/* Raphsomar AI. Mismo sistema visual que sponsorships.raphsomar.com */
@font-face{font-family:"Cormorant Garamond";src:url(../fonts/cormorant-garamond-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(../fonts/cormorant-garamond-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(../fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Jost";src:url(../fonts/jost-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Jost";src:url(../fonts/jost-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  --black:#000;--coal:#141210;--bone:#ECE6DA;--gold:#C6A775;--gold-d:#6F5730;--stone:#A8A092;
  --err:#E0907A;--err-d:#9A3B22;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Jost",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gut:clamp(1.25rem,5vw,4.5rem);
  --sec:clamp(6rem,14vw,12rem);
  --ease:cubic-bezier(.22,1,.36,1);
  --max:1440px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--black);color:var(--bone);font:400 1.0625rem/1.65 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
a{color:inherit}
p{margin:0 0 1.1em}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;line-height:.98;letter-spacing:-.01em}
::selection{background:var(--gold);color:#000}
:focus-visible{outline:1px solid var(--gold);outline-offset:4px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:1rem;top:-4rem;z-index:100;background:var(--gold);color:#000;padding:.8rem 1rem;font:500 .8rem var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none}
.skip:focus{top:1rem}

.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.sec{padding:var(--sec) 0;position:relative}
.s-black{background:var(--black);color:var(--bone)}
.s-coal{background:var(--coal);color:var(--bone)}
.s-bone{background:var(--bone);color:var(--coal)}
.s-bone .eyebrow,.s-bone .gold{color:var(--gold-d)}
.s-bone .muted{color:#4d463c}

.eyebrow{font:500 .75rem/1.4 var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin:0 0 2rem;display:flex;gap:1rem;align-items:center}
.eyebrow::before{content:"";width:2.5rem;height:1px;background:currentColor;opacity:.7}
.muted{color:var(--stone)}
.gold{color:var(--gold)}
em,.it{font-style:italic}
.h-xl{font-size:clamp(3.1rem,9.4vw,9.75rem)}
.h-l{font-size:clamp(2.6rem,6.6vw,6.5rem)}
.h-m{font-size:clamp(2rem,4.2vw,3.9rem);line-height:1.04}
.lead{font-size:clamp(1.12rem,1.5vw,1.35rem);line-height:1.6;max-width:36em}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.8rem;min-height:52px;padding:0 1.9rem;border:1px solid var(--gold);border-radius:1px;font:500 .78rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),transform .2s var(--ease)}
.btn:active{transform:translateY(1px)}
.btn-p{background:var(--gold);color:#000}
.btn-p:hover{background:var(--bone);border-color:var(--bone)}
.btn-g{background:transparent;color:var(--bone);border-color:rgba(236,230,218,.4)}
.btn-g:hover{border-color:var(--gold);color:var(--gold)}
.s-bone .btn-g{color:var(--coal);border-color:rgba(20,18,16,.35)}
.s-bone .btn-g:hover{border-color:var(--gold-d);color:var(--gold-d)}
.btn[disabled]{opacity:.55;cursor:progress}
.link{font:500 .78rem var(--sans);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:.3rem;color:var(--gold);transition:color .3s}
.link:hover{color:var(--bone)}
.s-bone .link{color:var(--gold-d)}.s-bone .link:hover{color:var(--coal)}

/* Cabecera */
.hd{position:fixed;inset:0 0 auto;z-index:50;transition:background .4s var(--ease),border-color .4s;border-bottom:1px solid transparent}
.hd.solid{background:rgba(0,0,0,.92);border-color:rgba(198,167,117,.18)}
@supports (backdrop-filter:blur(1px)){.hd.solid{background:rgba(0,0,0,.78);backdrop-filter:blur(14px)}}
.hd-in{display:flex;align-items:center;gap:2rem;height:84px;max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.brand{display:flex;align-items:center;gap:.9rem;text-decoration:none;color:var(--bone);margin-right:auto}
.brand img{width:40px;height:auto}
.brand-t{display:flex;flex-direction:column;line-height:1}
.brand-n{font:400 .95rem var(--sans);letter-spacing:.38em;margin-right:-.38em}
.brand-s{font:500 .6rem var(--sans);letter-spacing:.42em;color:var(--gold);margin-top:.45rem}
.nav{display:flex;gap:2rem}
.nav a{font:400 .78rem var(--sans);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--stone);transition:color .3s;padding:.5rem 0}
.nav a:hover,.nav a[aria-current]{color:var(--bone)}
.lang{font:500 .72rem var(--sans);letter-spacing:.16em;display:flex;gap:.2rem}
.lang a,.lang span{padding:.6rem .35rem;text-decoration:none;color:var(--stone)}
.lang span{color:var(--gold)}
.lang a:hover{color:var(--bone)}
.hd .btn{min-height:44px;padding:0 1.2rem;font-size:.7rem}
.burger{display:none;background:none;border:0;color:var(--bone);width:48px;height:48px;padding:12px;cursor:pointer}
.burger span{display:block;height:1px;background:currentColor;margin:6px 0;transition:transform .4s var(--ease),opacity .3s}
.menu-open .burger span:nth-child(1){transform:translateY(3.5px) rotate(45deg)}
.menu-open .burger span:nth-child(2){transform:translateY(-3.5px) rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:45;background:var(--black);padding:120px var(--gut) 2.5rem;display:flex;flex-direction:column;visibility:hidden;opacity:0;transition:opacity .45s var(--ease),visibility 0s .45s}
.menu-open .mnav{visibility:visible;opacity:1;transition:opacity .45s var(--ease)}
.mnav a.ml{font:400 clamp(2.4rem,11vw,3.4rem)/1.12 var(--serif);text-decoration:none;color:var(--bone);padding:.2rem 0}
.mnav .mfoot{margin-top:auto;display:flex;flex-direction:column;gap:1.4rem;align-items:flex-start}
.mnav .mono{width:52px;opacity:.9}

/* Hero */
.hero{min-height:100svh;display:flex;align-items:flex-end;padding:140px 0 clamp(3rem,7vw,6rem);position:relative;overflow:hidden;background:var(--black)}
.hero-media{position:absolute;inset:-8% 0 0;z-index:0}
.hero-media img{width:100%;height:100%;object-fit:cover;opacity:.46;filter:saturate(.7)}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.15) 40%,rgba(0,0,0,.92) 100%);z-index:1;pointer-events:none}
.hero .wrap{position:relative;z-index:2;width:100%}
.hero h1{max-width:13ch}
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.08em}
.hero h1 .ln>span{display:block}
.hero-b{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:3rem;align-items:end;margin-top:clamp(2.5rem,5vw,4rem)}
.hero-b .lead{margin:0;color:#d8d1c3}
.ctas{display:flex;flex-wrap:wrap;gap:1rem;justify-content:flex-end}
.hero-meta{position:absolute;right:var(--gut);top:130px;z-index:2;font:500 .68rem var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--stone);writing-mode:vertical-rl}

/* Marquee */
.mq{border-block:1px solid rgba(198,167,117,.22);overflow:hidden;background:var(--black);padding:1.6rem 0}
.mq-t{display:flex;width:max-content;animation:mq 60s linear infinite}
.mq ul{display:flex;list-style:none;margin:0;padding:0}
.mq li{font:italic 400 clamp(1.5rem,2.6vw,2.3rem)/1 var(--serif);color:var(--bone);white-space:nowrap;padding:0 1.6rem;display:flex;align-items:center;gap:3.2rem}
.mq li::after{content:"";width:6px;height:6px;background:var(--gold);transform:rotate(45deg)}
.mq:hover .mq-t{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}

/* Lista manual */
.manual{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,7rem)}
.manual ol{list-style:none;margin:0;padding:0;counter-reset:m}
.manual li{counter-increment:m;display:grid;grid-template-columns:3.2rem 1fr;align-items:baseline;border-top:1px solid rgba(20,18,16,.18);padding:1.35rem 0;font:400 clamp(1.5rem,2.6vw,2.4rem)/1.15 var(--serif)}
.manual li:last-child{border-bottom:1px solid rgba(20,18,16,.18)}
.manual li::before{content:counter(m,decimal-leading-zero);font:500 .72rem var(--sans);letter-spacing:.2em;color:var(--gold-d)}
.sticky{position:sticky;top:120px;align-self:start}

/* Frase iluminada */
.lit{font:400 clamp(2rem,4.6vw,4.4rem)/1.12 var(--serif);max-width:22ch}
.js .lit .w{color:rgba(236,230,218,.16);transition:color .5s var(--ease)}
.js .lit .w.on{color:var(--bone)}
.js .lit .w.on.g{color:var(--gold)}

/* Demo */
.demo{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.demo-in label{display:block;font:500 .72rem var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--stone);margin-bottom:.8rem}
.demo-in textarea{width:100%;min-height:9rem;resize:vertical;background:transparent;border:1px solid rgba(236,230,218,.25);border-radius:1px;color:var(--bone);font:400 1.35rem/1.35 var(--serif);padding:1rem 1.1rem;transition:border-color .3s}
.demo-in textarea:focus{outline:none;border-color:var(--gold)}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 1.5rem}
.chip{background:none;border:1px solid rgba(236,230,218,.2);border-radius:1px;color:var(--stone);font:400 .82rem var(--sans);padding:.6rem .8rem;cursor:pointer;min-height:44px;text-align:left;transition:color .3s,border-color .3s}
.chip:hover{color:var(--bone);border-color:var(--gold)}
.note{font:400 .8rem/1.5 var(--sans);color:var(--stone);margin-top:1.2rem}
.flow{list-style:none;margin:0;padding:0;border-top:1px solid rgba(198,167,117,.3)}
.flow li{display:grid;grid-template-columns:7.5rem 1fr;gap:1.5rem;padding:1.3rem 0;border-bottom:1px solid rgba(236,230,218,.1);position:relative}
.flow .k{font:500 .7rem/1.9 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.flow .v{font:400 clamp(1.25rem,2vw,1.75rem)/1.25 var(--serif)}
.flow .v small{display:block;font:400 .88rem/1.5 var(--sans);color:var(--stone);margin-top:.35rem}
.flow li::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--gold)}
.js .flow.run li{opacity:0;transform:translateY(10px)}
.js .flow.run li.in{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease)}
.js .flow.run li.in::after{width:100%;transition:width .9s var(--ease)}

/* Areas */
.areas{border-top:1px solid rgba(236,230,218,.14)}
.area{display:grid;grid-template-columns:5rem minmax(0,5fr) minmax(0,6fr);gap:clamp(1.5rem,4vw,4rem);padding:clamp(3rem,6vw,5rem) 0;border-bottom:1px solid rgba(236,230,218,.14)}
.area .n{font:500 .75rem var(--sans);letter-spacing:.2em;color:var(--gold);padding-top:1rem}
.area h3{font-size:clamp(2.4rem,5vw,4.8rem)}
.area h3 em{color:var(--gold)}
.area .pb{font-size:1.05rem;color:#d4cdbf;max-width:34em}
.chain{display:flex;flex-wrap:wrap;gap:.3rem .1rem;margin:1.6rem 0 2rem;padding:0;list-style:none;font:400 .78rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.chain li{display:flex;align-items:center}
.chain li+li::before{content:"";width:1.3rem;height:1px;background:var(--gold);margin:0 .6rem;opacity:.8}
.area.sub{grid-template-columns:5rem minmax(0,11fr)}
.area.sub .row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(1.5rem,4vw,4rem)}

/* Prompt a sistema */
.p2s{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(2rem,6vw,6rem);margin-top:clamp(3rem,6vw,5rem)}
.p2s h3{font:500 .75rem var(--sans);letter-spacing:.24em;text-transform:uppercase;margin-bottom:1.6rem}
.p2s ol{list-style:none;margin:0;padding:0}
.p2s li{font:400 clamp(1.4rem,2.4vw,2.1rem)/1.1 var(--serif);padding:.55rem 0;border-bottom:1px solid rgba(20,18,16,.14);display:flex;justify-content:space-between;gap:1rem}
.p2s li span{font:500 .68rem var(--sans);letter-spacing:.2em;color:var(--gold-d);align-self:center}
.p2s .basic li{color:#8a8274}
.p2s .full{columns:2;column-gap:clamp(2rem,4vw,4rem)}
.p2s .full li{break-inside:avoid}

/* Humano */
.duo{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(236,230,218,.14);margin-top:clamp(3rem,6vw,5rem)}
.duo>div{padding:2.5rem 0}
.duo>div+div{border-left:1px solid rgba(236,230,218,.14);padding-left:clamp(1.5rem,4vw,4rem)}
.duo h3{font:500 .75rem var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:1.5rem}
.duo p{font:400 clamp(1.6rem,3vw,2.7rem)/1.18 var(--serif);margin:0}

/* Metodo */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:clamp(3rem,6vw,5rem);counter-reset:s}
.step{border-top:1px solid var(--gold);padding:1.8rem clamp(1rem,2vw,2rem) 0 0}
.step .n{font:400 clamp(3rem,5vw,4.6rem)/1 var(--serif);color:var(--gold);display:block;margin-bottom:1.4rem}
.step h3{font:500 .8rem var(--sans);letter-spacing:.22em;text-transform:uppercase;margin-bottom:1rem}
.step p{font-size:.98rem;color:var(--stone)}
.teach{margin-top:clamp(4rem,8vw,7rem);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:end}

/* Tecnologia */
.tech{margin-top:clamp(3rem,6vw,5rem);border-top:1px solid rgba(236,230,218,.16)}
.tech-r{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:2rem;padding:1.9rem 0;border-bottom:1px solid rgba(236,230,218,.12)}
.tech-r h3{font:500 .72rem/1.8 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.tech-r ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.2rem 0}
.tech-r li{font:400 clamp(1.3rem,2.2vw,2rem)/1.3 var(--serif);color:var(--bone)}
.tech-r li:not(:last-child)::after{content:"/";color:rgba(198,167,117,.5);margin:0 .75rem}
.tm{font-size:.78rem;color:var(--stone);margin-top:1.8rem;max-width:60em}

/* Superinteligencia */
.si{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(2rem,6vw,6rem);align-items:end}
.si-scale{list-style:none;margin:clamp(3rem,6vw,5rem) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr)}
.si-scale li{border-top:1px solid rgba(236,230,218,.2);padding-top:1.5rem;padding-right:2rem}
.si-scale li:last-child{border-color:var(--gold)}
.si-scale b{display:block;font:400 clamp(1.8rem,3.2vw,3rem)/1 var(--serif);margin-bottom:.8rem}
.si-scale li:last-child b{color:var(--gold);font-style:italic}
.si-scale span{font-size:.95rem;color:var(--stone)}

/* Bleed */
.bleed{position:relative;height:min(78vh,760px);overflow:hidden;background:var(--coal)}
.bleed img{width:100%;height:120%;object-fit:cover;opacity:.8}
.bleed figcaption{position:absolute;left:var(--gut);bottom:2rem;font:500 .7rem var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--bone)}

/* Trayectoria */
.tl{list-style:none;margin:clamp(3rem,6vw,5rem) 0 0;padding:0}
.tl li{display:grid;grid-template-columns:9rem 1fr;gap:2rem;padding:1.6rem 0;border-top:1px solid rgba(20,18,16,.16);align-items:baseline}
.tl li:last-child{border-bottom:1px solid rgba(20,18,16,.16)}
.tl .y{font:400 clamp(1.8rem,3vw,2.6rem)/1 var(--serif);color:var(--gold-d)}
.tl .t{font:400 clamp(1.3rem,2.2vw,1.9rem)/1.25 var(--serif)}
.sectors{font:400 clamp(1.3rem,2.2vw,1.9rem)/1.5 var(--serif);max-width:40ch}

/* Ecosistema */
.eco{list-style:none;margin:clamp(3rem,6vw,5rem) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(236,230,218,.16)}
.eco li{padding:1.8rem 1.5rem 1.8rem 0;border-right:1px solid rgba(236,230,218,.1)}
.eco li+li{padding-left:1.5rem}
.eco li:last-child{border-right:0}
.eco a{text-decoration:none;display:block}
.eco .d{font:500 .7rem var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:1rem}
.eco b{font:400 1.8rem/1.1 var(--serif);display:block;margin-bottom:.8rem}
.eco a:hover b{color:var(--gold)}
.eco p{font-size:.93rem;color:var(--stone);margin:0}
.eco [aria-current] b{color:var(--gold)}

/* FAQ */
.faq{margin-top:clamp(2.5rem,5vw,4rem);border-top:1px solid rgba(20,18,16,.18)}
.faq details{border-bottom:1px solid rgba(20,18,16,.18)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:2rem;padding:1.6rem 0;font:400 clamp(1.35rem,2.3vw,2rem)/1.2 var(--serif)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:300 1.6rem/1 var(--sans);color:var(--gold-d);transition:transform .4s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .a{padding:0 0 1.8rem;max-width:48em;color:#3b352c}

/* Contacto */
.ct{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2.5rem,6vw,7rem)}
.ct-side p{color:#d4cdbf}
.ct-side .or{margin-top:2.5rem;padding-top:2rem;border-top:1px solid rgba(236,230,218,.14)}
form .modes{border:0;padding:0;margin:0 0 2rem;display:flex;gap:0}
form .modes legend{font:500 .72rem var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--stone);margin-bottom:1rem;padding:0}
.mode{flex:1;position:relative}
.mode input{position:absolute;opacity:0}
.mode span{display:flex;align-items:center;justify-content:center;min-height:52px;padding:.6rem 1rem;border:1px solid rgba(236,230,218,.25);font:500 .72rem var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--stone);cursor:pointer;text-align:center;transition:.3s}
.mode+.mode span{border-left:0}
.mode input:checked+span{background:var(--gold);border-color:var(--gold);color:#000}
.mode input:focus-visible+span{outline:1px solid var(--gold);outline-offset:3px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 1.5rem}
.f{margin-bottom:.4rem}
.f label{display:block;font:500 .72rem var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--stone);margin-bottom:.5rem}
.f label i{font-style:normal;color:var(--gold)}
.f input,.f textarea,.f select{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(236,230,218,.3);border-radius:0;color:var(--bone);font:400 1.05rem var(--sans);padding:.65rem 0;min-height:48px;transition:border-color .3s}
.f select{appearance:none;background:linear-gradient(45deg,transparent 50%,var(--gold) 50%) right 6px top 55%/6px 6px no-repeat,linear-gradient(-45deg,transparent 50%,var(--gold) 50%) right 0 top 55%/6px 6px no-repeat}
.f select option{background:var(--coal);color:var(--bone)}
.f textarea{min-height:6.5rem;resize:vertical}
.f input:focus,.f textarea:focus,.f select:focus{outline:none;border-color:var(--gold)}
.f [aria-invalid=true]{border-color:var(--err)}
.err{display:block;min-height:1.5rem;font:400 .82rem/1.5rem var(--sans);color:var(--err)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fs{border:0;padding:0;margin:0;min-width:0}
.fs[hidden]{display:none}
.consent{display:flex;gap:.8rem;align-items:flex-start;font-size:.88rem;color:var(--stone);margin:1rem 0 .2rem}
.consent input{width:20px;height:20px;accent-color:var(--gold);margin-top:.15rem;flex:none}
.status{min-height:1.6rem;margin-top:1.2rem;font-size:.95rem}
.status.ok{color:var(--gold)}.status.ko{color:var(--err)}
.sent{border-top:1px solid var(--gold);padding-top:2rem}
.sent h3{font-size:clamp(2rem,4vw,3.2rem);margin-bottom:1rem}

/* Pie */
.ft{background:var(--black);border-top:1px solid rgba(198,167,117,.2);padding:clamp(4rem,8vw,7rem) 0 2.5rem;font-size:.92rem}
.ft-top{display:grid;grid-template-columns:minmax(0,5fr) repeat(3,minmax(0,2fr));gap:2.5rem}
.ft .mono{width:64px;margin-bottom:1.5rem}
.ft h2{font:500 .7rem var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:1.2rem}
.ft ul{list-style:none;margin:0;padding:0}
.ft li{margin-bottom:.55rem}
.ft a{text-decoration:none;color:var(--stone);transition:color .3s}
.ft a:hover{color:var(--bone)}
.ft-b{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-top:4rem;padding-top:1.8rem;border-top:1px solid rgba(236,230,218,.1);color:var(--stone);font-size:.8rem}

/* Blog y legal */
.page-top{padding:clamp(9rem,16vw,13rem) 0 clamp(3rem,6vw,5rem)}
.posts{list-style:none;margin:0;padding:0;border-top:1px solid rgba(20,18,16,.18)}
.posts li{border-bottom:1px solid rgba(20,18,16,.18)}
.posts a{display:grid;grid-template-columns:10rem 1fr;gap:2rem;padding:2rem 0;text-decoration:none;align-items:baseline}
.posts time{font:500 .72rem var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold-d)}
.posts b{font:400 clamp(1.7rem,3.2vw,2.8rem)/1.1 var(--serif);display:block;transition:color .3s}
.posts a:hover b{color:var(--gold-d)}
.posts p{margin:.7rem 0 0;color:#4d463c;max-width:46em}
.prose{max-width:44rem;font-size:1.1rem;line-height:1.75}
.prose h2{font-size:clamp(1.9rem,3.4vw,2.7rem);margin:2.8rem 0 1rem;line-height:1.08}
.prose h3{font-size:clamp(1.5rem,2.4vw,1.9rem);margin:2.2rem 0 .8rem}
.prose blockquote{margin:2rem 0;padding-left:1.5rem;border-left:1px solid var(--gold-d);font:italic 400 1.6rem/1.35 var(--serif)}
.prose a{color:var(--gold-d)}
.prose ul,.prose ol{padding-left:1.2rem}
.prose li{margin-bottom:.4rem}
.prose img{margin:2rem 0}
.prose hr{border:0;border-top:1px solid rgba(20,18,16,.2);margin:3rem 0}
.empty{font:italic 400 1.6rem var(--serif);color:#4d463c}

/* Revelado */
.js .rv{opacity:0;transform:translateY(28px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.js .rv.in{opacity:1;transform:none}
.js .hero h1 .ln>span{transform:translateY(105%);transition:transform 1.15s var(--ease)}
.js .hero.go h1 .ln>span{transform:none}
.js .hero h1 .ln:nth-child(2)>span{transition-delay:.12s}
.js .hero h1 .ln:nth-child(3)>span{transition-delay:.24s}
.js .hero .hero-b{opacity:0;transform:translateY(16px);transition:opacity 1s .5s var(--ease),transform 1s .5s var(--ease)}
.js .hero.go .hero-b{opacity:1;transform:none}


/* ============ V2: mas luz, sistemas en movimiento ============ */
img{height:auto}
:root{--paper:#F6F2EA;--ink-m:#5c5447;--mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace}
body{--fg:var(--bone);--line:rgba(236,230,218,.14);--mut:var(--stone);--acc:var(--gold)}
.s-black,.s-coal{--fg:var(--bone);--line:rgba(236,230,218,.14);--mut:var(--stone);--acc:var(--gold)}
.s-bone,.s-paper,.hero{--fg:var(--coal);--line:rgba(20,18,16,.14);--mut:var(--ink-m);--acc:var(--gold-d)}
.s-paper{background:var(--paper);color:var(--coal)}
.s-bone .muted,.s-paper .muted,.hero .muted{color:var(--ink-m)}
.s-paper .eyebrow,.s-paper .gold{color:var(--gold-d)}
.s-paper .btn-g,.hero .btn-g{color:var(--coal);border-color:rgba(20,18,16,.35)}
.s-paper .btn-g:hover,.hero .btn-g:hover{border-color:var(--gold-d);color:var(--gold-d)}
.s-paper .link{color:var(--gold-d)}
:focus-visible{outline:2px solid var(--acc);outline-offset:4px}
.s-bone .btn-p:hover,.s-paper .btn-p:hover,.hero .btn-p:hover{background:var(--coal);border-color:var(--coal);color:var(--bone)}

/* Progreso de lectura */
.progress{position:fixed;left:0;top:0;height:2px;width:100%;background:var(--gold);transform-origin:0 50%;transform:scaleX(0);z-index:60;pointer-events:none}

/* Cabecera clara */
.hd{color:var(--coal)}
.hd.solid{background:rgba(236,230,218,.94);border-color:rgba(111,87,48,.22)}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.hd.solid{background:rgba(236,230,218,.8);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}}
.brand{color:var(--coal)}
.brand-s{color:var(--gold-d)}
.nav a{color:var(--ink-m)}
.nav a:hover{color:var(--coal)}
.lang a,.lang span{color:var(--ink-m)}
.lang span{color:var(--gold-d)}
.lang a:hover{color:var(--coal)}
.hd .btn-p:hover{background:var(--coal);border-color:var(--coal);color:var(--bone)}
.burger{color:var(--coal)}
.mnav{background:var(--bone)}
.mnav a.ml{color:var(--coal)}

/* Hero */
.hero{background:var(--bone);color:var(--coal);align-items:center;padding:130px 0 clamp(3rem,6vw,5rem)}
.hero::after{display:none}
.hero-meta{color:var(--ink-m)}
.hero-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.h-hero{font-size:clamp(3rem,6.2vw,6.9rem)}
.hero h1{max-width:none}
.hero-b{grid-template-columns:1fr;gap:2rem;margin-top:clamp(2rem,4vw,3rem)}
.hero-b .lead{color:#3b352c;max-width:32em}
.ctas{justify-content:flex-start}

/* Panel del sistema en vivo */
.live{position:relative;background:#0b0a09;color:var(--bone);border:1px solid rgba(198,167,117,.35);overflow:hidden;isolation:isolate;min-height:460px;display:flex;flex-direction:column}
.live-media{position:absolute;inset:0;z-index:-1}
.live-media img{width:100%;height:100%;object-fit:cover;opacity:.42}
.live::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,10,9,.5),rgba(11,10,9,.2) 40%,rgba(11,10,9,.94) 78%)}
.live-bar{display:flex;align-items:center;gap:.7rem;padding:.9rem 1.1rem;border-bottom:1px solid rgba(236,230,218,.12);font:500 .66rem var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--stone)}
.live-tag{margin-left:auto;color:var(--gold);border:1px solid rgba(198,167,117,.45);padding:.25rem .5rem;letter-spacing:.18em}
.pulse{width:7px;height:7px;background:var(--gold);border-radius:50%;box-shadow:0 0 0 0 rgba(198,167,117,.6);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(198,167,117,0)}100%{box-shadow:0 0 0 0 rgba(198,167,117,0)}}
.graph{width:100%;height:auto;display:block;padding:1.4rem 1.1rem .4rem}
.g-e{fill:none;stroke:rgba(236,230,218,.22);stroke-width:1}
.g-flow{fill:none;stroke:var(--gold);stroke-width:1;stroke-dasharray:3 9;opacity:.55;animation:flow 1.6s linear infinite}
@keyframes flow{to{stroke-dashoffset:-24}}
.g-n rect{fill:rgba(11,10,9,.78);stroke:rgba(236,230,218,.28);stroke-width:1;transition:fill .35s var(--ease),stroke .35s var(--ease)}
.g-n text{font:500 11px var(--sans);letter-spacing:2.2px;fill:var(--stone);text-anchor:middle;transition:fill .35s}
.g-n.on rect{stroke:var(--gold)}
.g-n.on text{fill:var(--bone)}
.g-n.cur rect{fill:var(--gold);stroke:var(--gold)}
.g-n.cur text{fill:#000}
.g-pk{fill:var(--bone);filter:drop-shadow(0 0 5px rgba(198,167,117,.9))}
.log{list-style:none;margin:0;padding:.6rem 1.1rem 1rem;font:400 .78rem/1.55 var(--mono);flex:1}
.log li{display:grid;grid-template-columns:5.6rem 1fr;gap:.8rem;padding:.28rem 0;border-top:1px dashed rgba(236,230,218,.08)}
.log b{font-weight:400;color:var(--gold);text-transform:uppercase;letter-spacing:.08em}
.log b::before{content:"› ";color:rgba(198,167,117,.6)}
.log span{color:#d9d2c4}
.log .typing span::after{content:"";display:inline-block;width:.5em;height:1em;margin-left:2px;background:var(--gold);vertical-align:-2px;animation:blink .8s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.live-next{display:none;align-self:flex-end;margin:0 1.1rem 1rem;background:none;border:1px solid rgba(236,230,218,.25);color:var(--bone);font:500 .66rem var(--sans);letter-spacing:.2em;text-transform:uppercase;padding:.7rem .9rem;min-height:40px;cursor:pointer;transition:border-color .3s,color .3s}
.js .live-next{display:inline-flex;gap:.5rem}
.live-next:hover{border-color:var(--gold);color:var(--gold)}

/* Marquee sobre carbon */
.mq{background:var(--coal)}

/* Frase iluminada en claro */
.js .s-bone .lit .w{color:rgba(20,18,16,.14)}
.js .s-bone .lit .w.on{color:var(--coal)}
.js .s-bone .lit .w.on.g{color:var(--gold-d)}

/* Pregunta */
.manual li{border-color:var(--line)}

/* Areas en claro con flujos vivos */
.areas,.area{border-color:var(--line)}
.area .n{color:var(--acc)}
.area h3 em{color:var(--acc)}
.area .pb{color:#3b352c}
.mflow{list-style:none;display:flex;flex-wrap:wrap;row-gap:.6rem;margin:1.6rem 0 2rem;padding:0}
.mflow li{display:flex;align-items:center}
.mflow li+li::before{content:"";width:1.3rem;height:1px;background:rgba(20,18,16,.3)}
.mflow span{display:block;font:500 .66rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:.62rem .7rem;border:1px solid rgba(20,18,16,.22);color:var(--coal);background:transparent}
.js .rv.in .mflow span{animation:lit calc(var(--n) * .6s) calc(var(--i) * .6s) infinite both}
@keyframes lit{0%{background:var(--coal);color:var(--bone);border-color:var(--coal)}12%{background:var(--coal);color:var(--bone);border-color:var(--coal)}20%,100%{background:transparent;color:var(--coal);border-color:rgba(20,18,16,.22)}}
.js .rv.in .mflow li:last-child span{animation-name:litlast}
@keyframes litlast{0%,14%{background:var(--gold);color:#000;border-color:var(--gold)}22%,100%{background:transparent;color:var(--coal);border-color:rgba(20,18,16,.22)}}

/* Prompt a sistema: el sistema se enciende paso a paso */
.js .p2s .full li{opacity:.18;transform:translateX(-6px);transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:calc(var(--i) * 110ms)}
.js .p2s.in .full li{opacity:1;transform:none}

/* IA y personas en claro */
.duo{border-color:var(--line)}
.duo>div+div{border-color:var(--line)}
.duo h3{color:var(--acc)}

/* Metodo: la linea se dibuja */
.step{border-top:1px solid var(--line);position:relative}
.step::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--gold-d);transform:scaleX(0);transform-origin:0 50%;transition:transform 1.1s var(--ease)}
.js .step.in::before,.step::before{transform:scaleX(1)}
.js .step:not(.in)::before{transform:scaleX(0)}
.step:nth-child(2)::before{transition-delay:.15s}.step:nth-child(3)::before{transition-delay:.3s}.step:nth-child(4)::before{transition-delay:.45s}
.step .n{color:var(--gold-d)}
.step p{color:var(--ink-m)}

/* Tecnologia en claro */
.tech,.tech-r{border-color:var(--line)}
.tech-r h3{color:var(--acc)}
.tech-r li{color:var(--coal);transition:color .3s}
.tech-r li:hover{color:var(--gold-d)}
.tech-r li:not(:last-child)::after{color:rgba(111,87,48,.5)}
.tm{color:var(--ink-m)}

/* Superinteligencia (el negro dramatico) */
.si-scale li{border-color:rgba(236,230,218,.2)}

/* Autoridad */
.au{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(2rem,6vw,6rem);align-items:end}
.au-n{list-style:none;margin:clamp(3rem,6vw,5rem) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.au-n li{padding:2rem 2rem 0 0}
.au-n li+li{border-left:1px solid var(--line);padding-left:2rem}
.au-n b{display:block;font:400 clamp(4rem,9vw,8.5rem)/.9 var(--serif);color:var(--gold-d);margin-bottom:1rem;font-variant-numeric:lining-nums}
.au-n span{color:var(--ink-m);max-width:18em;display:block}

/* Ecosistema en claro */
.eco{border-color:var(--line)}
.eco li{border-color:var(--line)!important}
.eco .d,.eco [aria-current] b{color:var(--gold-d)}
.eco b{color:var(--coal)}
.eco a:hover b{color:var(--gold-d)}
.eco p{color:var(--ink-m)}

/* FAQ en papel */
.s-paper .faq,.s-paper .faq details{border-color:var(--line)}

/* Tablet */
@media (max-width:1080px){
  .nav{display:none}.burger{display:block}
  .hd .btn{display:none}
  .demo,.manual,.ct,.si,.teach,.p2s{grid-template-columns:1fr}
  .sticky{position:static}
  .steps{grid-template-columns:1fr 1fr;row-gap:3rem}
  .eco{grid-template-columns:1fr 1fr}
  .eco li:nth-child(2){border-right:0}
  .eco li:nth-child(3){padding-left:0}
  .eco li:nth-child(n+3){border-top:1px solid rgba(236,230,218,.1)}
  .ft-top{grid-template-columns:1fr 1fr}
  .hero-meta{display:none}
}
/* Movil: decisiones propias */
@media (max-width:720px){
  body{font-size:1rem}
  .h-xl{font-size:14.2vw}
  .hd-in{height:72px;gap:.8rem}
  .brand img{width:34px}
  .brand-n{font-size:.82rem;letter-spacing:.3em}
  .hero{padding-top:120px;min-height:92svh}
  .hero-b{grid-template-columns:1fr;gap:2rem}
  .ctas{justify-content:flex-start;flex-direction:column;align-items:stretch}
  .area,.area.sub{grid-template-columns:1fr;gap:1rem}
  .area.sub .row{grid-template-columns:1fr;gap:1rem}
  .area .n{padding-top:0}
  .flow li{grid-template-columns:1fr;gap:.3rem}
  .p2s .full{columns:1}
  .duo{grid-template-columns:1fr}
  .duo>div+div{border-left:0;border-top:1px solid rgba(236,230,218,.14);padding-left:0}
  .steps{grid-template-columns:1fr}
  .tech-r{grid-template-columns:1fr;gap:.8rem}
  .si-scale{grid-template-columns:1fr;gap:2rem}
  .tl li{grid-template-columns:1fr;gap:.4rem}
  .eco{grid-template-columns:1fr}
  .eco li,.eco li+li{padding:1.6rem 0;border-right:0;border-top:1px solid rgba(236,230,218,.1)}
  .grid2{grid-template-columns:1fr}
  form .modes{flex-direction:column}
  .mode+.mode span{border-left:1px solid rgba(236,230,218,.25);border-top:0}
  .ft-top{grid-template-columns:1fr}
  .posts a{grid-template-columns:1fr;gap:.6rem}
  .mq{padding:1.1rem 0}
  .bleed{height:56vh}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .rv,.js .hero .hero-b{opacity:1;transform:none}
  .js .hero h1 .ln>span{transform:none}
  .js .lit .w{color:var(--bone)}
  .js .flow.run li{opacity:1;transform:none}
  .mq-t{animation:none;flex-wrap:wrap}
}

@media (max-width:1080px){
  .hero-g{grid-template-columns:1fr}
  .live{min-height:0}
  .au{grid-template-columns:1fr}
}
@media (max-width:720px){
  .h-hero{font-size:13.4vw}
  .hero{padding-top:108px}
  .au-n{grid-template-columns:1fr}
  .au-n li,.au-n li+li{padding:1.6rem 0;border-left:0;border-bottom:1px solid var(--line)}
  .log li{grid-template-columns:4.6rem 1fr;gap:.5rem}
  .log{font-size:.74rem}
  .graph{padding:1rem .5rem .2rem}
}
@media (prefers-reduced-motion:reduce){
  .js .p2s .full li{opacity:1;transform:none}
  .js .step:not(.in)::before{transform:scaleX(1)}
  .js .s-bone .lit .w{color:var(--coal)}
  .pulse,.g-flow{animation:none}
}
.hero-meta{display:none}
.hero .eyebrow{color:var(--gold-d)}
.log{min-height:calc(6 * 2.05em + 1.6rem)}
.hd.solid{background:var(--bone)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.ft-brand{display:flex;flex-direction:column;line-height:1;margin:-.4rem 0 1.6rem}
.ft-brand span:first-child{font:400 .95rem var(--sans);letter-spacing:.38em;color:var(--bone)}
.ft-brand span:last-child{font:500 .6rem var(--sans);letter-spacing:.42em;color:var(--gold);margin-top:.45rem}
@media (max-width:720px){.g-n text{font-size:16px;letter-spacing:1.5px}.live-bar{font-size:.6rem}}
