
:root{--bg:#ECEBF4;--panel:#fff;--ink:#17152E;--mute:#6B6891;--line:#D5D3E6;--hot:#E4287C;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#12112A;--panel:#1C1A3A;--ink:#EDEBFA;--mute:#A09DC8;--line:#35325F}}
:root[data-theme="dark"]{--bg:#12112A;--panel:#1C1A3A;--ink:#EDEBFA;--mute:#A09DC8;--line:#35325F}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 "DM Sans",system-ui,sans-serif}
.app{display:grid;grid-template-columns:minmax(300px,400px) minmax(0,1fr);gap:28px;max-width:1300px;margin:0 auto;padding:24px 20px 60px;align-items:start}
@media (max-width:900px){.app{grid-template-columns:1fr}}
.form{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px}
.form h1{font:800 19px/1.2 Unbounded,sans-serif;margin:0}
.lead{color:var(--mute);font-size:14px;margin:8px 0 14px}
fieldset{border:0;border-top:1px solid var(--line);padding:14px 0 2px;margin:0}
legend{font:500 13px Unbounded,sans-serif;padding:0 8px 0 0}
label{display:block;font-size:13px;color:var(--mute);margin:0 0 11px}
input[type=text],input[type=email],input[type=tel],textarea{width:100%;margin-top:4px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--ink);font:inherit}
textarea{min-height:70px;resize:vertical}
input:focus-visible,textarea:focus-visible,button:focus-visible{outline:2px solid var(--hot);outline-offset:2px}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.opts label{display:flex;align-items:center;gap:8px;margin:0;padding:8px;border:1px solid var(--line);border-radius:10px;color:var(--ink);cursor:pointer}
.opts label:has(input:checked){border-color:var(--hot);box-shadow:0 0 0 1px var(--hot)}
.opts label:has(input:focus-visible){outline:2px solid var(--hot);outline-offset:2px}
.opts input{position:absolute;opacity:0;pointer-events:none}
.opts i{width:26px;height:26px;border-radius:50%;flex:none;border:1px solid rgba(128,128,128,.5)}
.hint{font-size:12px;color:var(--mute);margin:0 0 10px}
button{font:inherit;font-weight:700;border-radius:999px;padding:12px 18px;border:0;background:var(--hot);color:#fff;cursor:pointer;width:100%}
.pages{display:grid;gap:18px}
.pg{container-type:inline-size;width:100%;max-width:794px;aspect-ratio:210/297;margin:0 auto;box-shadow:0 12px 40px rgba(20,18,60,.3);overflow:hidden;border-radius:4px}
.page{position:relative;width:100%;height:100%;overflow:hidden;font-size:1.85cqw;line-height:1.5;font-family:"DM Sans",sans-serif;background:var(--pbg);color:var(--fg)}
.doc{--pbg:#222326;--fg:#F4F4F4;--mut:#A3A3A8;--acx:var(--ac);--box:#2E2F33}
.doc[data-t=light]{--pbg:#F2F2F5;--fg:#16161A;--mut:#6A6A72;--acx:#16161A;--box:#E3E3E9}
.doc{--ac:#D7FF1F}
.pill{display:inline-block;background:var(--ac);color:#111;border-radius:99px;padding:.4em 1.2em;font:500 1.6cqw Unbounded,sans-serif;white-space:nowrap}
.page h3{margin:0 0 1.5cqw}
.sec{margin-bottom:3.2cqw}
.sec p,.sec .ln{margin:0;white-space:pre-line}
.k{color:var(--mut)}
.foot{position:absolute;left:6cqw;right:6cqw;bottom:4cqw;display:flex;flex-wrap:wrap;gap:1cqw}
.foot .pill{font-size:1.5cqw}
.ph{background:linear-gradient(135deg,var(--ac),#3B2FA8)}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.doc[data-p=bn] .ph img{filter:grayscale(1) contrast(1.05)}
/* portada */
.p1 .vname{position:absolute;left:4.5cqw;top:6cqw;bottom:6cqw;writing-mode:vertical-rl;transform:rotate(180deg);font:800 14cqw/1 Unbounded,sans-serif;text-transform:uppercase;white-space:nowrap}
.p1 .eco{position:absolute;left:17cqw;top:6cqw;bottom:6cqw;writing-mode:vertical-rl;transform:rotate(180deg);font:800 14cqw/1 Unbounded,sans-serif;text-transform:uppercase;white-space:nowrap;color:transparent;-webkit-text-stroke:1px var(--mut);opacity:.5}
.p1 .glow{position:absolute;right:-5cqw;top:14cqw;width:70cqw;height:70cqw;border-radius:50%;background:radial-gradient(circle,var(--ac) 0,transparent 68%);opacity:.75}
.p1 .cph{position:absolute;left:30cqw;right:5cqw;top:9cqw;bottom:20cqw;border-radius:2cqw;overflow:hidden}
.p1 .ctag{position:absolute;right:7cqw;bottom:8cqw;max-width:40cqw;text-align:right;font:700 3cqw/1.25 Unbounded,sans-serif;text-shadow:0 1px 8px rgba(0,0,0,.6);color:#fff}
.p1 .cgen{position:absolute;left:30cqw;bottom:6.5cqw;display:flex;gap:1cqw;flex-wrap:wrap;max-width:44cqw}
/* ficha */
.p2,.p3,.p4{padding:6cqw 6cqw 0}
.top{display:flex;justify-content:space-between;gap:3cqw;margin-bottom:3cqw}
.top h1{font:800 5.4cqw/1.05 Unbounded,sans-serif;margin:0 0 1cqw;text-transform:uppercase;overflow-wrap:anywhere}
.role{font:500 2.8cqw Unbounded,sans-serif;color:var(--acx);margin-bottom:2.4cqw}
.facts div{margin-bottom:.9cqw}
.circ{position:relative;width:34cqw;height:34cqw;flex:none}
.circ::before{content:"";position:absolute;inset:-1.5cqw -1.5cqw auto auto;width:34cqw;height:34cqw;border-radius:50%;background:var(--ac)}
.circ div{position:absolute;inset:1.5cqw -1.5cqw -1.5cqw 1.5cqw;border-radius:50%;overflow:hidden}
.cols{display:grid;grid-template-columns:1.15fr 1fr;gap:4cqw}
/* fotos */
.mos{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,17cqw);gap:1.6cqw;margin-bottom:3.4cqw}
.mos div{border-radius:1.6cqw;overflow:hidden}.mos div:first-child{grid-row:span 2}.mos div:nth-child(3){grid-row:span 2}
.box{background:var(--box);border-radius:1.4cqw;padding:1.8cqw 2.2cqw;font-style:italic;margin-bottom:2.6cqw}
.chips{display:flex;flex-wrap:wrap;gap:.8cqw}.chips span{border:1px solid var(--ac);border-radius:99px;padding:.2em .9em}
.clogo{position:absolute;right:6cqw;top:3cqw;max-height:5cqw;max-width:20cqw;object-fit:contain;display:none}
.flogo{display:none;max-height:6cqw;max-width:26cqw;object-fit:contain;margin-bottom:1.6cqw}
@media print{@page{size:A4;margin:0}html,body{background:#fff}.form{display:none}.app{display:block;padding:0;max-width:none}.pages{gap:0}.pg{max-width:none;width:210mm;height:297mm;aspect-ratio:auto;box-shadow:none;border-radius:0;break-after:page;margin:0}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}}
