@font-face{font-family:Montserrat;font-weight:500;font-display:swap;src:url(/fonts/montserrat-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Montserrat;font-weight:700;font-display:swap;src:url(/fonts/montserrat-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:Montserrat;font-weight:800;font-display:swap;src:url(/fonts/montserrat-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:Montserrat;font-weight:900;font-display:swap;src:url(/fonts/montserrat-latin-900-normal.woff2) format("woff2")}
@font-face{font-family:"Comic Neue";font-weight:700;font-display:swap;src:url(/fonts/comic-neue-latin-700-normal.woff2) format("woff2")}

:root{--crema:#F1ECE2;--tinta:#13221F;--teja:#C24E1C;--marron:#2A1F18;--blanco:#fff}
*{box-sizing:border-box}
html,body{margin:0;background:var(--crema);color:var(--tinta);font-family:Montserrat,system-ui,sans-serif}
a{color:var(--tinta)}a:hover{color:var(--teja)}

.layout{display:grid;grid-template-columns:1fr minmax(0,460px) 1fr;min-height:100svh}
.page{grid-column:2;width:100%;background:var(--crema);display:flex;flex-direction:column}
@media (min-width:600px){.page{border-left:3px solid var(--tinta);border-right:3px solid var(--tinta)}}

/* viñetas laterales: solo en pantallas anchas; el bloque central nunca se mueve */
.side{display:none}
@media (min-width:1000px){
  .side{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:56px;padding:40px 24px;position:sticky;top:0;height:100svh;overflow:hidden}
  .side-l{grid-column:1}
  .side-r{grid-column:3}
}
.vineta{margin:0;width:min(220px,80%);max-height:42svh;aspect-ratio:480/700;background:var(--blanco);border:4px solid var(--tinta);border-radius:10px;padding:6px;box-shadow:6px 6px 0 var(--tinta)}
.vineta img{display:block;width:100%;height:100%;object-fit:cover;border-radius:4px}
.v-a{transform:rotate(-4deg)}.v-b{transform:rotate(3deg) translateX(18px)}
.v-c{transform:rotate(4deg)}.v-d{transform:rotate(-3deg) translateX(-18px)}
@media (min-width:1300px){.vineta{width:240px}}

.top{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;border-bottom:3px solid var(--tinta)}
.logo{text-decoration:none;display:flex;flex-direction:column}
.logo-1{font-weight:900;font-size:20px;color:var(--teja);line-height:1}
.logo-2{font-weight:700;font-size:9px;letter-spacing:2px;color:var(--tinta)}
.ig{font-size:11px;font-weight:700;text-decoration:none}

.hero{padding:22px 24px 0;text-align:center}
.kicker{margin:0;font-weight:800;font-size:11px;letter-spacing:4px;color:var(--teja)}
h1{margin:6px 0 0;font-weight:900;font-size:clamp(32px,9.5vw,40px);line-height:1.02}
.lead{margin:10px 0 0;font-size:15px;line-height:1.4;font-weight:500}

.stage{position:relative;height:270px;margin:10px auto 0;width:390px;max-width:100%}
.face{position:absolute;border-radius:50%;overflow:hidden;border:5px solid var(--tinta);background:var(--blanco)}
.face img,.cromo img{display:block;width:100%;object-fit:cover}
.face img{height:100%}
.face-a{left:36px;top:22px;width:150px;height:150px;transform:rotate(-6deg)}
.face-c{right:30px;top:6px;width:132px;height:132px;transform:rotate(5deg)}
.cromo{position:absolute;left:150px;top:112px;width:128px;background:var(--blanco);border:4px solid var(--tinta);border-radius:10px;padding:6px;transform:rotate(7deg);box-shadow:6px 6px 0 var(--tinta);display:flex;flex-direction:column}
.cromo img{height:auto;aspect-ratio:512/432;border-radius:4px}
.cromo-n{font-weight:800;font-size:9px;color:var(--teja);margin-top:5px;letter-spacing:1px}
.cromo-t{font-weight:800;font-size:12px}

.card{margin:0 20px;background:var(--blanco);border:3px solid var(--tinta);border-radius:16px;padding:16px;box-shadow:6px 6px 0 var(--tinta)}
.card-title{margin:0;font-family:"Comic Neue",cursive;font-weight:700;font-size:17px;text-transform:uppercase;line-height:1.2;text-align:center}
.lbl{display:block;font-size:11px;font-weight:700;margin-top:12px}
input[type=email]{width:100%;height:48px;margin-top:4px;border:2px solid var(--tinta);border-radius:10px;padding:0 12px;font:500 16px Montserrat,sans-serif;color:var(--tinta);background:var(--blanco)}
input[type=email]:focus{outline:3px solid var(--teja);outline-offset:1px}
.chk{display:flex;gap:8px;align-items:flex-start;font-size:11.5px;line-height:1.35;margin-top:10px;cursor:pointer}
.chk input{margin:1px 0 0;width:18px;height:18px;accent-color:var(--teja);flex:none}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.err{margin:10px 0 0;font-size:12px;font-weight:700;color:var(--teja)}
button{width:100%;height:52px;margin-top:12px;background:var(--teja);color:var(--blanco);border:3px solid var(--tinta);border-radius:12px;font:900 16px Montserrat,sans-serif;letter-spacing:1px;cursor:pointer;box-shadow:3px 3px 0 var(--tinta);transition:transform .08s,box-shadow .08s}
button:active{transform:translate(3px,3px);box-shadow:none}
button[disabled]{opacity:.6;cursor:wait}
.ok{text-align:center}
.ok p{margin:10px 0 0;font-size:14px;line-height:1.45}
.ok .ok-small{font-size:11.5px}

.foot{margin-top:auto;padding:18px 20px 22px;text-align:center;font-size:11px;line-height:1.5}
.foot p{margin:0}
.foot .sponsor{margin-top:4px;font-size:10px;opacity:.7}
.foot .legal{margin-top:6px;opacity:.8}

/* páginas legales */
.doc{padding:20px 24px 40px;font-size:14px;line-height:1.55}
.doc h1{font-size:26px;margin-bottom:14px}
.doc h2{font-size:16px;margin:22px 0 6px}