:root{
  --rosa:#E4007C; --rosa-sh:#9E0056; --mari:#F6A21E; --mari-sh:#B86F00;
  --anil:#1E2466; --anil-deep:#14184A; --ink:#2B1233; --masa:#FFF6EA; --nopal:#2E7D32;
  --bg:#FFF6EA; --text:#2B1233; --muted:#6F4C69; --card:#FFFFFF; --line:rgba(43,18,51,.12);
  color-scheme:light;
  box-sizing:border-box;
}
@media (prefers-color-scheme:dark){
  :root{--bg:#17122E;--text:#FCEFF7;--muted:#BBA6CB;--card:#241B47;--line:rgba(252,239,247,.14);color-scheme:dark}
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important}}
body{margin:0;background:var(--bg);color:var(--text);font:600 17px/1.6 'Nunito',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif}
img{max-width:100%;height:auto;display:block}
a{color:var(--rosa)}
@media (prefers-color-scheme:dark){a{color:#FF6FB8}}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--mari);outline-offset:3px;border-radius:6px}
.L{font-family:'Lilita One','Arial Rounded MT Bold','Trebuchet MS',sans-serif;font-weight:400}
.wrap{max-width:1100px;margin:0 auto;padding:0 22px}

/* Papel picado */
.picado{display:flex;gap:6px;height:34px;padding:0 6px;background:var(--anil)}
.picado span{flex:1;background:var(--c);
  clip-path:polygon(0 0,100% 0,100% 74%,87.5% 100%,75% 74%,62.5% 100%,50% 74%,37.5% 100%,25% 74%,12.5% 100%,0 74%)}

/* Encabezado */
.top{background:var(--anil);color:#fff}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}
.brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}
.brand img{width:44px;height:44px;border-radius:11px}
.brand span{font-family:'Lilita One','Trebuchet MS',sans-serif;font-size:28px;color:var(--mari);text-shadow:2px 2px 0 var(--rosa)}
.nav{display:flex;gap:6px;flex-wrap:wrap}
.nav a{color:#fff;text-decoration:none;font-weight:800;padding:10px 14px;border-radius:12px;min-height:44px;display:inline-flex;align-items:center}
.nav a:hover,.nav a[aria-current="page"]{background:rgba(255,255,255,.12)}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 24px;border-radius:16px;
  font-family:'Lilita One','Trebuchet MS',sans-serif;font-size:22px;text-decoration:none;color:var(--ink);background:var(--mari);box-shadow:0 5px 0 var(--mari-sh);transition:transform .08s,box-shadow .08s}
.btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--mari-sh)}
.btn.alt{background:#fff;color:var(--ink);box-shadow:0 5px 0 #C9B8C6}
.btn small{font-family:'Nunito',sans-serif;font-weight:800;font-size:13px;display:block;line-height:1.1;opacity:.75}
.btn .t{display:flex;flex-direction:column;align-items:flex-start;line-height:1.1}

/* Héroe */
.hero{position:relative;overflow:hidden;color:#fff;
  background:radial-gradient(90% 90% at 70% 45%,#FF46A8 0%,var(--rosa) 50%,#A30058 100%)}
.hero::before{content:"";position:absolute;inset:-40%;
  background:repeating-conic-gradient(from 0deg at 68% 48%,rgba(246,162,30,.18) 0 6deg,transparent 6deg 12deg);
  -webkit-mask:radial-gradient(circle at 68% 48%,#000 10%,transparent 55%);mask:radial-gradient(circle at 68% 48%,#000 10%,transparent 55%)}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:center;padding-top:56px;padding-bottom:64px}
.hero h1{margin:0;font-family:'Lilita One','Trebuchet MS',sans-serif;font-weight:400;font-size:clamp(50px,8.4vw,100px);line-height:.95;
  color:var(--mari);text-shadow:5px 5px 0 var(--anil),9px 9px 0 rgba(20,24,74,.5)}
.hero p.lead{font-size:clamp(20px,2.4vw,26px);font-weight:800;max-width:30ch;margin:22px 0 28px}
.hero .ctas{display:flex;gap:14px;flex-wrap:wrap}
.hero .ctas[hidden],.btn[hidden]{display:none}
.hero .note{font-size:14px;margin-top:14px;opacity:.85}
.hero .art{position:relative;aspect-ratio:1;max-width:520px;justify-self:center;width:100%}
.hero .art .main{position:absolute;inset:8%;filter:drop-shadow(0 18px 18px rgba(90,0,45,.45));animation:flota 4s ease-in-out infinite}
.hero .art .s{position:absolute;filter:drop-shadow(0 8px 8px rgba(90,0,45,.35))}
/* Aviso cuando llegan desde un link compartido */
.reto{display:inline-block;background:var(--masa);color:var(--ink);border-radius:22px;padding:14px 24px 16px;margin:0 0 24px;border-top:7px solid var(--anil);box-shadow:0 6px 0 rgba(90,0,45,.35);transform:rotate(-1.5deg);max-width:100%}
.reto[hidden]{display:none}
.reto small{display:block;font-weight:800;font-size:15px;line-height:1.3;color:#6F4C69}
.reto b{display:block;font-family:'Lilita One','Trebuchet MS',sans-serif;font-weight:400;font-size:clamp(44px,8vw,64px);line-height:1.05;color:var(--rosa)}
@media (max-width:820px){.retado .hero .art{max-width:210px}.retado .hero .wrap{padding-top:20px}}
@keyframes flota{50%{transform:translateY(-10px) rotate(-2deg)}}

/* Secciones */
section{padding:72px 0}
h2{font-family:'Lilita One','Trebuchet MS',sans-serif;font-weight:400;font-size:clamp(32px,5vw,48px);line-height:1.1;margin:0 0 12px;color:var(--rosa)}
@media (prefers-color-scheme:dark){h2{color:#FF6FB8}}
.sub{color:var(--muted);max-width:60ch;margin:0 0 36px;font-size:18px}
.pasos{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.paso{background:var(--card);border-radius:24px;padding:26px;box-shadow:inset 0 0 0 1.5px var(--line);text-align:center}
.paso img{width:120px;height:120px;object-fit:contain;margin:0 auto 10px}
.paso .n{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--mari);color:var(--ink);font-family:'Lilita One',sans-serif;font-size:20px;margin-bottom:6px}
.paso h3{font-family:'Lilita One','Trebuchet MS',sans-serif;font-weight:400;font-size:24px;margin:4px 0 6px}
.paso p{margin:0;color:var(--muted)}

.noche{background:radial-gradient(100% 80% at 50% 30%,#3440A8 0%,var(--anil) 60%,var(--anil-deep) 100%);color:#fff}
.noche h2{color:var(--mari);text-shadow:3px 3px 0 var(--rosa)}
.noche .sub{color:#D8DBF5}
.cadena{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:18px}
.cadena li{text-align:center;font-weight:800;font-size:15px;line-height:1.2}
.cadena img{width:96px;height:96px;object-fit:contain;margin:0 auto 8px;filter:drop-shadow(0 6px 6px rgba(0,0,0,.3))}
.cadena .k{display:block;font-family:'Lilita One',sans-serif;color:var(--mari);font-size:14px}
.cadena li.meta{grid-column:span 2}
.cadena li.meta img{width:150px;height:150px}

.cosas{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.cosa{background:var(--card);border-radius:22px;padding:24px;box-shadow:inset 0 0 0 1.5px var(--line)}
.cosa h3{font-family:'Lilita One','Trebuchet MS',sans-serif;font-weight:400;font-size:22px;margin:0 0 6px}
.cosa p{margin:0;color:var(--muted)}

/* Páginas de texto */
.page-head{background:var(--anil);color:#fff;padding:48px 0 40px}
.page-head h1{font-family:'Lilita One','Trebuchet MS',sans-serif;font-weight:400;font-size:clamp(40px,7vw,64px);margin:0;color:var(--mari);text-shadow:3px 3px 0 var(--rosa);line-height:1.05}
.page-head p{margin:10px 0 0;color:#D8DBF5;max-width:60ch}
.doc{padding:48px 0 72px}
.doc .wrap{max-width:780px}
.doc h2{font-size:30px;margin-top:40px}
.doc h2:first-child{margin-top:0}
.doc p,.doc li{max-width:68ch}
.contacto{background:var(--card);border-radius:24px;padding:26px;box-shadow:inset 0 0 0 1.5px var(--line);margin-bottom:40px}
.contacto p{margin:0 0 16px}
details{background:var(--card);border-radius:18px;box-shadow:inset 0 0 0 1.5px var(--line);margin-bottom:12px}
summary{cursor:pointer;list-style:none;padding:18px 54px 18px 22px;font-weight:800;font-size:18px;position:relative;min-height:56px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:22px;top:50%;transform:translateY(-50%);font-family:'Lilita One',sans-serif;font-size:28px;color:var(--rosa)}
details[open] summary::after{content:"–"}
details .a{padding:0 22px 20px;color:var(--muted)}
details .a p{margin:0 0 10px}

footer{background:var(--anil-deep);color:#C9CDEE;padding:36px 0;font-size:15px}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}
footer a{color:#fff;font-weight:800;text-decoration:none;margin-right:18px}
footer a:hover{text-decoration:underline}

@media (max-width:820px){
  .hero .wrap{grid-template-columns:1fr;padding-top:40px}
  .hero .art{max-width:380px;order:-1}
  .pasos{grid-template-columns:1fr}
}
.contacto .btn{max-width:100%;overflow-wrap:anywhere;text-align:center;font-size:clamp(16px,4.6vw,22px);padding:10px 20px}
.form{display:flex;flex-direction:column;gap:8px;max-width:560px}
.form label{font-weight:800;font-size:16px;margin-top:8px}
.form .req{font-weight:600;color:var(--muted);font-size:14px}
.form input,.form select,.form textarea{font:600 17px 'Nunito',system-ui,sans-serif;color:var(--text);background:var(--bg);border:2px solid var(--line);border-radius:14px;padding:12px 14px;min-height:50px;width:100%}
.form textarea{resize:vertical;min-height:130px}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--rosa);box-shadow:0 0 0 3px rgba(228,0,124,.2)}
.form .btn{margin-top:14px;align-self:flex-start;border:0;cursor:pointer}
.oculto{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
