@font-face{font-family:Inter;src:url(/static/fonts/inter.woff2?v=2) format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Newsreader;src:url(/static/fonts/newsreader.woff2?v=2) format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:Newsreader;src:url(/static/fonts/newsreader-italic.woff2?v=2) format('woff2');font-weight:200 800;font-style:italic;font-display:swap}
:root{/* Tema claro (24-oct-2026): papel, tinta casi negra y azul pizarra, los colores del Instagram @cesarlopezpy. Los bloques oscuros (.dark y la sección 3D) redefinen los mismos tokens abajo, así las reglas no cambian. --sobre-acento es el texto sobre un fondo de acento (botones, avisos). */--ink:#1b1b1b;--ink-hondo:#24313e;--green:#32517f;--mint:#32517f;--mint-claro:#24313e;--sobre-acento:#ffffff;--paper:#f4f3ef;--paper-hondo:#eceae4;--surface:#ffffff;--lamina:#ffffff;--muted:#4a4a4a;--line:#d9d9d9;--line-tenue:rgba(27,27,27,.07);--tinta-clara:#f2f0ea;--tinta-suave:#b9c3cd;--linea-oscura:rgba(242,240,234,.18);--font:Inter,system-ui,"Segoe UI",sans-serif;--display:Newsreader,Georgia,"Times New Roman",serif;color-scheme:light}
.dark,.cine{--ink:#f2f0ea;--green:#a9bedd;--mint:#e9e5d6;--mint-claro:#ffffff;--sobre-acento:#1b1b1b;--paper:#24313e;--surface:#2c3b49;--muted:#b9c3cd;--line:rgba(242,240,234,.16);--line-tenue:rgba(242,240,234,.08);color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.65}a{color:inherit}button,input,textarea,select{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{text-underline-offset:5px}img{display:block;max-width:100%;height:auto}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.1;letter-spacing:-.028em}h1{font-size:clamp(44px,5.6vw,86px)}h2{font-size:clamp(34px,4.2vw,60px)}h3{font-size:25px;letter-spacing:-.022em}em{font-family:var(--display);font-style:italic;font-weight:400;color:var(--green)}p{max-width:65ch}p+p{margin-top:20px}::selection{background:var(--mint);color:var(--sobre-acento)}:focus-visible{outline:3px solid var(--green);outline-offset:5px}.wrap{width:min(1320px,calc(100% - 100px));margin-inline:auto}.section{padding-block:110px}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;line-height:1.6;color:var(--green);margin-bottom:22px}.intro{font-size:19px;line-height:1.7;color:var(--muted)}.muted{color:var(--muted);font-size:14px}.skip{position:fixed;z-index:100;top:10px;left:10px;padding:12px;background:var(--surface);transform:translateY(-160%)}.skip:focus{transform:none}
.header{min-height:94px;display:flex;align-items:center;justify-content:space-between;gap:32px;padding:18px 50px;border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:17px;text-decoration:none;font-size:19px;line-height:1.2;font-weight:600;white-space:nowrap}.brand-mark{font-size:35px;letter-spacing:-.12em;font-weight:500;border-right:1px solid var(--line);padding-right:20px}.brand-mark span{color:var(--green)}.brand small{display:block;margin-top:6px;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.17em;font-weight:400}nav{display:flex;align-items:center;gap:28px}nav a{font-size:13px;text-decoration:none}nav a:hover{color:var(--green)}.nav-contact{padding:13px 17px;border:1px solid var(--line)}.menu-toggle{display:none}.hero{display:grid;grid-template-columns:1fr 1.12fr;align-items:center;gap:25px;padding-block:65px 55px}.hero h1{font-size:clamp(42px,5.15vw,78px);white-space:nowrap}.hero .intro{max-width:43ch;margin-top:28px;font-size:17px}.hero-note{font-size:12px;color:var(--muted);margin-top:35px}.dot{display:inline-block;width:7px;height:7px;background:var(--green);border-radius:100%;margin-right:9px}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:25px;margin-top:30px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;text-decoration:none;padding:16px 22px;font-size:14px;border:1px solid transparent;line-height:1.4;min-height:52px}.primary{background:var(--mint);color:var(--sobre-acento)}.primary:hover{background:var(--mint-claro)}.accent{background:var(--mint);color:var(--sobre-acento)}.accent:hover{background:var(--mint-claro)}.text-link{display:inline-flex;gap:16px;align-items:center;border:0;border-bottom:1px solid currentColor;padding:7px 0;text-decoration:none;background:transparent;font-size:14px;color:var(--green)}.hero-visual{background:var(--surface);border:1px solid var(--line);min-width:0}.visual-top{display:flex;justify-content:space-between;padding:18px 22px;font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line-tenue);gap:10px}.hero-image{height:370px;display:block;overflow:hidden;position:relative;background:var(--lamina)}.hero-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:contrast(1.07)}.visual-bottom{border-top:1px solid var(--line-tenue);display:flex;align-items:center;gap:20px;padding:20px 24px}.visual-bottom p{font-family:var(--display);font-style:italic;font-size:18px;line-height:1.35}.cross{color:var(--green);font-size:26px}.round-link{margin-left:auto;width:40px;height:40px;border:1px solid var(--line);display:grid;place-items:center;border-radius:50%;text-decoration:none}.expertise-strip{display:flex;justify-content:space-around;gap:20px;padding:24px 50px;border-block:1px solid var(--line);font-size:12px;letter-spacing:.05em}.expertise-strip p+p{margin:0}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:65px;margin-bottom:55px}.section-head>p{width:360px;flex-shrink:0;color:var(--muted);font-size:16px}.projects-grid{display:grid;grid-template-columns:1.17fr 1fr;gap:65px 35px}.project-card{text-decoration:none;min-width:0;display:block;background:var(--surface);border:1px solid var(--line);color:inherit}.project-top{display:flex;justify-content:space-between;padding:18px 22px;font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line-tenue);gap:10px}.project-image{position:relative;overflow:hidden;aspect-ratio:1.27;background:var(--lamina)}.project-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s;filter:contrast(1.08)}.project-bottom{border-top:1px solid var(--line-tenue);display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px}.project-bottom p{font-family:var(--display);font-style:italic;font-size:18px;line-height:1.35;margin:0}.dark{background:var(--ink-hondo);color:var(--tinta-clara)}.dark .eyebrow,.dark em,.light{color:var(--mint)}.dark .intro,.dark .section-head>p{color:var(--tinta-suave)}.services{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin:60px 0 35px}.services article{border-top:1px solid var(--linea-oscura);padding-top:24px}.service-top{display:flex;justify-content:space-between;font-size:12px;color:var(--tinta-suave);margin-bottom:50px}.service-top span:first-child{font-family:var(--display);font-size:25px;color:var(--mint)}.services h3{margin-bottom:22px}.services p{font-size:15px;color:var(--tinta-suave)}.services .deliverable{font-size:13px;color:var(--mint);border-top:1px solid var(--linea-oscura);padding-top:22px;margin-top:30px}.profile-teaser{display:grid;grid-template-columns:1fr 1fr;gap:0 95px;border-bottom:1px solid var(--line)}.profile-teaser>.eyebrow{grid-column:1/-1}.profile-teaser>div p{color:var(--muted);margin-bottom:25px}.resources{display:grid;grid-template-columns:1fr 1fr;gap:95px}.resource-item{padding-top:28px;margin-top:28px;border-top:1px solid var(--line)}.resource-item h3{font-size:21px}.resource-item p{font-size:15px;color:var(--muted);margin-top:12px}.form{display:grid;align-content:start;gap:10px}.resource-form{background:var(--surface);border:1px solid var(--line);padding:40px}.form h3{margin-bottom:20px}.form label{font-size:13px;margin-top:8px}.form input,.form textarea,.form select{min-width:0;width:100%;padding:12px 14px;border:1px solid var(--line);background:transparent;border-radius:0;color:inherit;font-size:16px}.form textarea{resize:vertical}.form select{background:var(--surface);color:var(--ink)}.form .button{justify-self:start;margin-top:15px}.form-note{font-size:12px;margin-top:16px;color:var(--muted)}.contact-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:100px}.contact-grid .intro{margin-block:30px}.contact-location{margin-top:30px;font-size:13px;color:var(--tinta-suave)}.contact-form .form-note{color:var(--tinta-suave)}.contact-form input,.contact-form textarea{border-color:var(--linea-oscura)}.honey{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.notice{padding:20px;background:var(--mint);color:var(--sobre-acento)}.footer{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:35px;padding:50px;border-top:1px solid var(--line);font-size:12px}.footer-name{font-size:24px;text-decoration:none;letter-spacing:-.05em}.footer-name span{display:block;font-size:12px;color:var(--muted);letter-spacing:0;margin-top:10px}.footer>div{display:flex;flex-direction:column;align-items:start;gap:8px}.footer>p{color:var(--muted)}
.project-intro{padding-block:55px 45px}.back-link{margin-bottom:45px}.project-summary{display:flex;justify-content:space-between;gap:70px;margin-top:30px}.project-summary>p{font-size:19px;color:var(--muted);max-width:650px}.project-summary>span{font-size:12px;border-left:1px solid var(--line);padding-left:25px;flex-shrink:0}.explorer-top{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-block:20px;border-top:1px solid var(--line)}.explorer-top .eyebrow{margin:0;font-size:10px}.view-controls{display:flex;gap:8px;flex-wrap:wrap}.view-controls button{background:transparent;border:1px solid var(--line);padding:10px 16px;font-size:13px;color:var(--ink)}.view-controls button[aria-pressed=true]{background:var(--mint);color:var(--sobre-acento);border-color:var(--mint)}.explorer-stage{height:580px;background:var(--lamina);overflow:hidden;position:relative;border:1px solid var(--line)}.image-layer{position:absolute;inset:0;overflow:hidden}.image-layer img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.explorer-label{position:absolute;left:20px;bottom:16px;font-size:10px;letter-spacing:.05em;text-transform:uppercase;z-index:2;color:var(--ink);background:rgba(255,255,255,.92);padding:8px 10px;pointer-events:none}.model-host{position:absolute;inset:0}.model-host model-viewer{display:block;width:100%;height:100%;background:var(--lamina);--progress-bar-color:var(--green)}.viewer-status{font-size:13px;color:var(--muted);margin-top:15px}.model-controls{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:15px}.model-controls p{font-size:12px;color:var(--muted)}.case-details,.profile-columns{display:grid;grid-template-columns:1fr 1fr;gap:80px}.detail-list{list-style:none;padding:0;margin:28px 0}.detail-list li{border-top:1px solid var(--line);padding-block:15px}.detail-list li::before{content:'↗';color:var(--green);margin-right:20px}.case-cta{text-align:center}.case-cta p{margin-inline:auto}.case-cta .button{margin-top:30px}.profile-page .intro{max-width:750px;margin-top:35px}.profile-columns article+article{border-top:1px solid var(--line);padding-top:30px;margin-top:30px}.profile-columns article p{color:var(--muted);margin-top:18px}.legal{max-width:850px}.legal h1{font-size:55px;margin-bottom:35px}.legal p{margin-block:20px}.thank-you{max-width:850px;min-height:65vh}.thank-you h1{font-size:60px;margin-bottom:30px}
@media(min-width:1600px){.hero-image{height:460px}}
@media(max-width:1150px){.header{padding:18px 30px;gap:18px}nav{gap:17px}nav a{font-size:12px}.brand{font-size:17px}.wrap{width:calc(100% - 60px)}.hero h1{font-size:49px}.hero .intro{font-size:16px}.hero-image{height:340px}.hero-image img{width:195%}.contact-grid,.resources{gap:50px}.section-head{gap:35px}.section-head>p{width:310px}.explorer-top{align-items:start;flex-direction:column}}
@media(max-width:900px){.header{min-height:80px;flex-wrap:wrap}.menu-toggle{display:block;background:transparent;border:1px solid var(--line);padding:9px 14px;font-size:14px}.header nav{display:flex;width:100%;gap:16px;flex-wrap:wrap}.js-ready .header nav{display:none}.js-ready .header nav.open{display:flex}.header nav a{font-size:14px;padding:10px}.header nav .nav-contact{margin-left:auto}.hero{gap:25px}.hero h1{font-size:42px}.hero-image{height:370px}.hero-image img{width:235%}.hero .actions{gap:14px}.hero .button{padding:14px}.visual-top{font-size:9px;flex-direction:column;gap:0}.visual-bottom{padding:16px}.visual-bottom p{font-size:16px}.section{padding-block:80px}.section-head>p{width:290px}.services{gap:25px}.services h3{font-size:23px}.profile-teaser{gap:0 45px}.resources{gap:35px}.resource-form{padding:25px}.footer{padding:35px;grid-template-columns:1fr 1fr}.footer>p{grid-column:1/-1}.explorer-stage{height:480px}.case-details,.profile-columns{gap:40px}}
@media(max-width:650px){.wrap{width:calc(100% - 40px)}.header{padding:14px 20px}.brand{gap:12px;font-size:16px}.brand-mark{font-size:29px;padding-right:14px}.brand small{font-size:9px}.header nav{align-items:stretch;flex-direction:column;gap:0}.header nav .nav-contact{margin:10px 0 0}.hero{grid-template-columns:1fr;padding-block:40px 30px;gap:35px}.hero h1{font-size:clamp(39px,9.4vw,60px);white-space:normal}.hero .intro{font-size:16px;max-width:42ch;margin-top:22px}.hero-note{margin-top:22px}.hero-image{height:330px}.hero-image img{width:185%}.visual-top{flex-direction:row}.visual-bottom p{font-size:18px}.expertise-strip{padding:18px 20px;justify-content:start;flex-wrap:wrap;gap:8px 18px;font-size:10px}.section{padding-block:65px}.eyebrow{font-size:10px;margin-bottom:16px}.section-head{flex-direction:column;align-items:start;gap:24px;margin-bottom:35px}.section-head>p{width:auto;font-size:15px}.projects-grid{grid-template-columns:1fr;gap:35px}.project-image{aspect-ratio:1.2}.project-bottom p{font-size:16px}.services{grid-template-columns:1fr;gap:35px;margin-top:40px}.service-top{margin-bottom:24px}.services .deliverable{margin-top:20px}.resources,.contact-grid,.case-details,.profile-columns{grid-template-columns:1fr;gap:35px}.profile-teaser{grid-template-columns:1fr;gap:24px}.profile-teaser>.eyebrow{margin-bottom:0}.resource-form{padding:25px}.contact-grid .intro{font-size:17px}.footer{grid-template-columns:1fr;padding:35px 20px;gap:25px}.footer>p{grid-column:auto}.project-intro{padding-block:35px}.back-link{margin-bottom:30px}.project-intro h1{font-size:43px}.project-summary{flex-direction:column;gap:22px}.project-summary>p{font-size:17px}.project-summary>span{font-size:12px}.view-controls{gap:6px}.view-controls button{padding:11px;font-size:12px}.explorer-stage{height:350px}.explorer-label{font-size:9px;left:10px;bottom:10px}.model-controls{align-items:start;flex-direction:column;gap:10px}.profile-page h1{font-size:41px}.profile-page .intro{font-size:17px}.legal h1,.thank-you h1{font-size:40px}.form .button{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}








@media(max-width:700px){}








.oferta-panel{background:rgba(233,229,214,.05);border:1px solid rgba(233,229,214,.22);padding:48px 50px;margin-bottom:40px}
.oferta-stack{list-style:none;padding:0;margin:0 0 8px;display:grid;gap:0}
.oferta-stack li{display:flex;gap:24px;align-items:baseline;padding:24px 0;border-bottom:1px solid rgba(233,229,214,.18)}
.oferta-stack li:first-child{padding-top:0}
.oferta-num{font-family:var(--display);font-size:14px;color:var(--mint);opacity:.75;flex-shrink:0;padding-top:3px}
.oferta-stack li>div{flex:1}
.oferta-stack h3{margin-bottom:6px;font-size:19px}
.oferta-stack p{font-size:14.5px;color:var(--tinta-suave);margin:0}
.oferta-valor{font-family:var(--display);font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--mint);white-space:nowrap;flex-shrink:0;align-self:center}
.oferta-garantias{list-style:none;padding:24px 0 8px;margin:8px 0 32px;border-top:1px solid rgba(233,229,214,.22);display:grid;gap:20px}
.oferta-garantias li{display:flex;gap:16px;align-items:flex-start}
.oferta-check{flex-shrink:0;width:26px;height:26px;border-radius:50%;background:var(--mint);color:var(--sobre-acento);display:grid;place-items:center;font-size:13px;font-weight:700;margin-top:2px}
.oferta-garantia-titulo{font-family:var(--display);font-size:15px;color:var(--mint);margin:0 0 3px}
.oferta-garantias p:not(.oferta-garantia-titulo){font-size:14.5px;color:var(--tinta-suave);margin:0}
.oferta-cta{width:100%;justify-content:center;font-size:15px;padding:19px 24px}
.oferta-condiciones{margin-top:18px;text-align:center;color:var(--tinta-suave);font-size:13px}
.oferta-cierre{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:35px;margin-bottom:40px}
.oferta-cierre p:not(.eyebrow){font-size:15px;color:var(--tinta-suave)}
.oferta-admision{font-family:var(--display);font-style:italic;font-size:19px;line-height:1.5;color:var(--tinta-clara);max-width:62ch;margin:0 0 36px}
.oferta-admision::before{content:"\201C"}
.oferta-admision::after{content:"\201D"}
@media(max-width:640px){.oferta-panel{padding:32px 24px}.oferta-stack li{flex-direction:column;gap:10px}.oferta-num{opacity:.5}}


/* ===== "Construimos la solución": experiencia 3D guiada por scroll ===== */
.cine{--cine-fondo:var(--ink-hondo);--cine-tinta:var(--tinta-clara);--cine-ambar:var(--mint);background:var(--cine-fondo);color:var(--cine-tinta);position:relative}
.cine-pista{display:none}
.cine.cine-listo .cine-pista{display:block;position:relative}
.cine.cine-listo .cine-respaldo{display:none}
.cine-fijo{position:sticky;top:0;height:100vh;overflow:hidden}
.cine-saltar{position:absolute;z-index:5;right:24px;bottom:22px;color:var(--mint);font-size:13px;text-decoration:underline;text-underline-offset:5px}
.model-host.is-loading{opacity:0;pointer-events:none}
.cine-lienzo{position:absolute;inset:0;opacity:0;transition:opacity .55s ease}
.cine-encendido .cine-lienzo{opacity:1}
.cine-lienzo canvas{display:block;width:100%;height:100%}
.cine-vineta{position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 90% at 50% 45%,rgba(36,49,62,0) 38%,rgba(36,49,62,.55) 78%,rgba(36,49,62,.92) 100%)}
.cine-textos{position:absolute;inset:0;pointer-events:none}
.cine-escena{position:absolute;left:clamp(24px,6vw,92px);bottom:clamp(90px,14vh,150px);max-width:min(560px,72vw);opacity:0;will-change:opacity,transform}
.cine-kicker{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--cine-ambar);margin:0 0 18px}
.cine-escena h2{font-family:var(--display);font-size:clamp(34px,4.6vw,64px);line-height:1.05;letter-spacing:-.03em;color:var(--cine-tinta);margin:0}
.cine-sub{font-size:clamp(15px,1.25vw,18px);line-height:1.65;color:var(--tinta-suave);margin:20px 0 0;max-width:48ch}
.cine-acciones{display:flex;flex-wrap:wrap;align-items:center;gap:18px 26px;margin-top:30px;pointer-events:auto}
.cine-link{color:var(--cine-ambar);font-size:14px;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:5px}
.cine-etiquetas{position:absolute;right:clamp(46px,6vw,96px);top:50%;transform:translateY(-50%);list-style:none;margin:0;padding:0;display:grid;gap:14px;text-align:right;pointer-events:none}
.cine-etiquetas li{font-size:12px;letter-spacing:.06em;color:var(--tinta-suave);opacity:0;border-right:2px solid var(--cine-ambar);padding-right:14px}
.cine-progreso{position:absolute;right:clamp(20px,2.2vw,34px);top:50%;transform:translateY(-50%);list-style:none;margin:0;padding:0;display:grid;gap:9px}
.cine-progreso li{width:2px;height:26px;background:rgba(242,240,234,.16)}
.cine-progreso li.activo{background:var(--cine-ambar)}
.cine-progreso li span{display:none}
.cine-cargando{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:13px;letter-spacing:.08em;color:var(--tinta-suave);transition:opacity .35s ease}
.cine-encendido .cine-cargando{opacity:0}
.cine-respaldo{padding-block:clamp(70px,10vw,120px)}
.cine-respaldo h2{font-family:var(--display);font-size:clamp(34px,4.4vw,60px);line-height:1.06;letter-spacing:-.03em;margin:14px 0 0}
.cine-respaldo em{color:var(--cine-ambar);font-style:italic}
.cine-respaldo .cine-sub{margin-top:22px}
.cine-nota{margin-top:26px;font-size:12px;letter-spacing:.04em;color:var(--tinta-suave)}
/* Póster del 3D: lo que ve quien no tiene WebGL o pidió reducir movimiento */
.cine-respaldo-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(32px,5vw,72px);align-items:center}
.cine-poster{position:relative;margin:0;aspect-ratio:16/9;overflow:hidden;background:var(--cine-fondo)}
.cine-poster img{display:block;width:100%;height:100%;object-fit:cover}
@media(max-width:900px){.cine-respaldo-grid{grid-template-columns:1fr}}
@media(max-width:820px){
.cine-escena{left:22px;right:22px;bottom:clamp(74px,12vh,120px);max-width:none}
.cine-etiquetas{display:none}
.cine-progreso{right:12px}
}
/* Encabezado en oscuro mientras la experiencia ocupa la pantalla */
html.cine-en-pantalla .header{background:rgba(36,49,62,.78);backdrop-filter:blur(10px);border-bottom-color:rgba(242,240,234,.12)}
html.cine-en-pantalla .header a,html.cine-en-pantalla .brand,html.cine-en-pantalla .brand-mark{color:var(--tinta-clara)}
html.cine-en-pantalla .brand small{color:var(--tinta-suave)}
html.cine-en-pantalla .brand-mark{border-right-color:rgba(242,240,234,.22)}
html.cine-en-pantalla .nav-contact{border-color:rgba(242,240,234,.4)}
html.cine-en-pantalla .menu-toggle{color:var(--tinta-clara)}
/* La oferta es la pieza que más tiene que destacar de la página */
.oferta-destacada{position:relative;border-top:3px solid var(--mint)}
.oferta-destacada::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 70% at 18% 0%,rgba(233,229,214,.14) 0%,rgba(233,229,214,0) 62%)}
.oferta-destacada .wrap{position:relative}
.oferta-badge{display:inline-block;border:1px solid rgba(233,229,214,.45);border-radius:999px;padding:8px 16px;margin-bottom:26px;color:var(--mint)}
.oferta-titulo{font-size:clamp(38px,5vw,68px)}
.oferta-cupo{margin-top:18px;font-size:13px;letter-spacing:.02em;color:var(--mint);display:flex;align-items:center;gap:10px}
.oferta-cupo::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--mint);flex-shrink:0}
.oferta-destacada .oferta-panel{box-shadow:0 32px 90px -50px rgba(0,0,0,.9)}
.oferta-destacada .oferta-condiciones{display:none}

/* --- Entrada de planos (escenas.js). El HTML sin JS no se toca: las reglas
   sólo aplican cuando el script marcó html.planos-listos y puso data-plano. */
html.planos-listos [data-plano]{transition:opacity .3s cubic-bezier(.22,.61,.36,1),transform .3s cubic-bezier(.22,.61,.36,1)}
html.planos-listos [data-plano="sube"]{opacity:0;transform:translateY(12px)}
html.planos-listos [data-plano="barrido"]{opacity:0;transform:translateY(6px)}
html.planos-listos [data-plano][data-plano-visible]{opacity:1;transform:none;clip-path:inset(0 0 0 0)}
@media (prefers-reduced-motion: reduce){
html.planos-listos [data-plano]{transition:none;opacity:1;transform:none;clip-path:none}
}

.resource-lista{margin:16px 0 0;padding-left:18px;display:grid;gap:6px;font-size:14px;color:var(--muted)}
.resource-lista li::marker{color:var(--green)}

/* ===================================================================
   Rediseño 30-oct-2026 — principios de diseño de Apple + reglas de
   animación de Emil Kowalski (github.com/emilkowalski/skills).
   Va al final para ganar la cascada sin reescribir las reglas de arriba;
   la paleta (papel + azul pizarra + bloques pizarra) no cambia.
   - Una sola familia (Inter): jerarquía por peso, tamaño y tracking según
     el tamaño, sin cursivas ni serif.
   - Materiales: encabezado y menú translúcidos (blur + saturación).
   - Superficies con radio continuo y sombra suave en lugar de bordes.
   - Movimiento: sólo transform/opacity, curvas propias, press a 0.97,
     hover con movimiento sólo en punteros finos.
   =================================================================== */
:root{--display:var(--font);--muted:#58585d;--line:#dedcd5;--ease-out:cubic-bezier(.23,1,.32,1);--ease-in-out:cubic-bezier(.77,0,.175,1);--radio-s:12px;--radio-m:20px;--radio-l:28px;--pastilla:980px;--sombra:0 1px 2px rgba(27,27,27,.04),0 12px 32px -18px rgba(27,27,27,.22);--sombra-alta:0 2px 4px rgba(27,27,27,.05),0 24px 56px -28px rgba(27,27,27,.32);--material:rgba(244,243,239,.72);--anillo:rgba(50,81,127,.22);--alto-header:64px}
.dark,.cine{--anillo:rgba(169,190,221,.32);--material:rgba(36,49,62,.72)}
body{font-size:17px;line-height:1.53;letter-spacing:-.011em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
html{scroll-padding-top:calc(var(--alto-header) + 24px)}

/* Tipografía: el tracking se ajusta con el tamaño (negativo en títulos, ~0 en texto) */
h1,h2,h3{font-family:var(--font);font-weight:600;font-optical-sizing:auto}
h1{font-size:clamp(40px,5.6vw,80px);line-height:1.04;letter-spacing:-.038em}
h2{font-size:clamp(32px,4.4vw,56px);line-height:1.07;letter-spacing:-.032em}
h3{font-size:21px;line-height:1.25;letter-spacing:-.018em}
em{font-family:inherit;font-style:normal;font-weight:inherit;color:var(--green)}
.eyebrow{font-size:15px;font-weight:600;letter-spacing:-.008em;text-transform:none;margin-bottom:14px}
.intro{font-size:21px;line-height:1.45;letter-spacing:-.017em}
.muted{font-size:14px;letter-spacing:-.006em}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:6px}

/* Encabezado: material translúcido, alto compacto */
.header{min-height:var(--alto-header);padding:0 max(50px,calc((100% - 1320px)/2));background:var(--material);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid rgba(27,27,27,.07)}
.brand{gap:12px;font-size:15px;font-weight:600;letter-spacing:-.01em}
.brand-mark{font-size:24px;letter-spacing:-.1em;font-weight:600;padding-right:12px}
.brand small{margin-top:2px;font-size:11px;letter-spacing:0;text-transform:none;font-weight:400}
nav{gap:26px}
nav a{font-size:13px;letter-spacing:-.005em;color:rgba(27,27,27,.8);transition:color .15s ease}
nav a:hover{color:var(--ink)}
.nav-contact{padding:8px 16px;border:0;border-radius:var(--pastilla);background:var(--green);color:#fff!important;font-weight:500;transition:transform .16s var(--ease-out),background-color .2s ease}
.nav-contact:hover{background:var(--ink-hondo)}
.nav-contact:active{transform:scale(.97)}
html.cine-en-pantalla .header{background:var(--material);border-bottom-color:rgba(242,240,234,.1)}
html.cine-en-pantalla .nav-contact{background:var(--tinta-clara);color:var(--ink-hondo)!important}
html.cine-en-pantalla .header nav a:not(.nav-contact){color:rgba(242,240,234,.85)}
html.cine-en-pantalla .menu-icono{color:var(--tinta-clara)}

/* Botones: pastillas, respuesta al presionar (no al soltar) */
.button{justify-content:center;gap:8px;padding:14px 26px;min-height:50px;border-radius:var(--pastilla);font-size:16px;font-weight:500;letter-spacing:-.012em;transition:transform .16s var(--ease-out),background-color .2s ease,color .2s ease}
.button:active{transform:scale(.97)}
.text-link{gap:6px;border-bottom:0;padding:10px 0;min-height:44px;font-size:16px;font-weight:500;letter-spacing:-.012em;transition:opacity .15s ease}
.text-link:active{opacity:.6}
.actions{gap:14px 28px}

/* Portada */
.hero{padding-block:72px 64px;gap:56px}
.hero h1{font-size:clamp(40px,5vw,74px)}
.hero .intro{font-size:19px;margin-top:24px}
.hero-note{font-size:13px;margin-top:28px}
.hero-visual{border:0;border-radius:var(--radio-l);overflow:hidden;box-shadow:var(--sombra-alta)}
.visual-top,.project-top{font-size:12px;letter-spacing:-.003em;text-transform:none;border-bottom:0;padding:16px 22px 6px}
.visual-bottom,.project-bottom{border-top:0;padding:16px 22px 20px}
.visual-bottom p,.project-bottom p{font-family:var(--font);font-style:normal;font-weight:600;font-size:17px;letter-spacing:-.018em;line-height:1.3}
.cross{font-size:20px}
.round-link{width:36px;height:36px;border:0;background:var(--paper-hondo);color:var(--green);font-size:15px;transition:transform .16s var(--ease-out)}
.round-link:active{transform:scale(.92)}
.expertise-strip{justify-content:center;flex-wrap:wrap;gap:10px;padding:0 20px 72px;border-block:0;font-size:13px;letter-spacing:-.005em}
.expertise-strip p{padding:8px 16px;border-radius:var(--pastilla);background:var(--surface);color:var(--muted);box-shadow:0 1px 2px rgba(27,27,27,.05)}

/* Secciones y tarjetas */
.section{padding-block:120px}
.section-head{margin-bottom:48px}
.section-head>p{font-size:17px;line-height:1.5}
.projects-grid{gap:28px}
.project-card{border:0;border-radius:var(--radio-l);overflow:hidden;box-shadow:var(--sombra);transition:transform .16s var(--ease-out);isolation:isolate}
.project-card:active{transform:scale(.985)}
.project-image img{transition:transform .6s var(--ease-out)}
@media(hover:hover) and (pointer:fine){.project-card:hover .project-image img{transform:scale(1.03)}}

/* Bloques oscuros */
.services{gap:20px}
.services article{border-top:0;padding:28px;border-radius:var(--radio-m);background:rgba(242,240,234,.05);box-shadow:inset 0 0 0 1px rgba(242,240,234,.07)}
.service-top{margin-bottom:36px;font-size:13px}
.service-top span:first-child{font-family:var(--font);font-size:15px;font-weight:600;letter-spacing:0}
.services h3{margin-bottom:14px}
.services .deliverable{font-size:14px;font-weight:500;padding-top:18px;margin-top:24px}

/* Oferta */
.oferta-destacada{border-top:0}
.oferta-panel{border-radius:var(--radio-l);border-color:rgba(233,229,214,.14);background:rgba(233,229,214,.045)}
.oferta-num,.oferta-valor,.oferta-garantia-titulo{font-family:var(--font)}
.oferta-num{font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}
.oferta-valor{font-size:12px;font-weight:600;letter-spacing:0;text-transform:none}
.oferta-garantia-titulo{font-weight:600}
.oferta-stack h3{font-size:19px}
.oferta-admision{font-family:var(--font);font-style:normal;font-weight:500;font-size:21px;letter-spacing:-.018em}
.oferta-badge{font-size:13px;padding:6px 14px;border-color:rgba(233,229,214,.3)}

/* Formularios: campos redondeados con anillo de foco, sin contorno duro */
.form{gap:8px}
.form label{font-size:14px;font-weight:500;margin-top:10px}
.form input,.form textarea,.form select{min-height:50px;padding:13px 16px;border-radius:var(--radio-s);background:var(--surface);border:1px solid var(--line);transition:border-color .15s ease,box-shadow .15s ease}
.form input:focus,.form textarea:focus,.form select:focus{outline:0;border-color:var(--green);box-shadow:0 0 0 4px var(--anillo)}
.dark .form input,.dark .form textarea,.dark .form select{background:rgba(242,240,234,.06);border-color:rgba(242,240,234,.14);color:var(--tinta-clara)}
.dark .form select option{color:#1b1b1b}
.resource-form{border:0;border-radius:var(--radio-l);box-shadow:var(--sombra-alta)}
.notice{border-radius:var(--radio-s)}
.form .button{justify-self:stretch}

/* Pie */
.footer{background:var(--paper-hondo);border-top:0;color:var(--muted);padding:44px max(50px,calc((100% - 1320px)/2))}
.footer-name{font-size:19px;font-weight:600;letter-spacing:-.02em;color:var(--ink)}
.footer a{text-decoration:none}
@media(hover:hover) and (pointer:fine){.footer a:hover{text-decoration:underline}}

/* Ficha de proyecto: control segmentado y escenario redondeado */
.view-controls{gap:0;padding:3px;border-radius:var(--pastilla);background:rgba(27,27,27,.06)}
.view-controls button{border:0;border-radius:var(--pastilla);padding:8px 18px;font-size:14px;font-weight:500;transition:background-color .2s ease,box-shadow .2s ease,transform .16s var(--ease-out)}
.view-controls button:active{transform:scale(.97)}
.view-controls button[aria-pressed=true]{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(27,27,27,.14)}
.explorer-top{border-top:0}
.explorer-top .eyebrow{font-size:15px}
.explorer-stage{border:0;border-radius:var(--radio-l);box-shadow:var(--sombra)}
.explorer-label{border-radius:var(--pastilla);padding:6px 12px;text-transform:none;letter-spacing:0;font-size:12px;background:rgba(255,255,255,.75);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.project-summary>span{font-size:13px}
.detail-list li{font-size:16px}

/* 3D guiado por scroll */
.cine-escena h2,.cine-respaldo h2{font-family:var(--font);font-weight:600;letter-spacing:-.034em}
.cine-respaldo em{font-style:normal}
.cine-kicker{font-size:14px;font-weight:600;letter-spacing:-.005em;text-transform:none}
.cine-etiquetas li{font-size:13px;letter-spacing:0}
.cine-poster{border-radius:var(--radio-l)}
.cine-saltar{font-size:14px}

/* Entrada de los planos (escenas.js): un poco más larga y con curva propia */
html.planos-listos [data-plano]{transition:opacity .6s var(--ease-out),transform .6s var(--ease-out)}
html.planos-listos [data-plano="sube"]{transform:translateY(16px)}
html.planos-listos [data-plano="barrido"]{transform:translateY(10px)}

/* Botón del menú: dos líneas que se cruzan en X */
.menu-icono{position:relative;display:block;width:18px;height:12px;color:var(--ink)}
.menu-icono::before,.menu-icono::after{content:"";position:absolute;left:0;right:0;height:1.5px;border-radius:2px;background:currentColor;transition:transform .25s var(--ease-out)}
.menu-icono::before{top:2px}
.menu-icono::after{bottom:2px}
.menu-toggle[aria-expanded=true] .menu-icono::before{transform:translateY(3.25px) rotate(45deg)}
.menu-toggle[aria-expanded=true] .menu-icono::after{transform:translateY(-3.25px) rotate(-45deg)}

@media(max-width:1150px){.header{padding-inline:30px}.hero h1{font-size:46px}.footer{padding-inline:30px}}

/* Móvil: menú como hoja translúcida a pantalla completa, enlaces grandes */
@media(max-width:900px){
:root{--alto-header:56px}
.header{min-height:var(--alto-header);flex-wrap:nowrap;padding-block:0}
.menu-toggle{display:grid;place-items:center;width:44px;height:44px;margin-right:-10px;padding:0;border:0;background:transparent;border-radius:50%;transition:transform .16s var(--ease-out)}
.menu-toggle:active{transform:scale(.92)}
.js-ready .header nav,.js-ready .header nav.open{display:flex;position:absolute;top:100%;left:0;right:0;height:calc(100dvh - var(--alto-header));flex-direction:column;align-items:stretch;gap:0;padding:12px 24px calc(24px + env(safe-area-inset-bottom));overflow-y:auto;background:var(--paper);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s var(--ease-out),visibility 0s linear .2s}
.js-ready .header nav.open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .25s var(--ease-out),visibility 0s}
.js-ready .header nav a{font-size:28px;font-weight:600;letter-spacing:-.025em;color:var(--ink);padding:14px 0;border-bottom:1px solid rgba(27,27,27,.07);opacity:0;transform:translateY(-8px);transition:opacity .2s var(--ease-out),transform .3s var(--ease-out)}
.js-ready .header nav.open a{opacity:1;transform:none}
.js-ready .header nav.open a:nth-child(2){transition-delay:30ms}
.js-ready .header nav.open a:nth-child(3){transition-delay:60ms}
.js-ready .header nav.open a:nth-child(4){transition-delay:90ms}
.js-ready .header nav.open a:nth-child(5){transition-delay:120ms}
.js-ready .header nav .nav-contact{margin:28px 0 0;border:0;text-align:center;justify-content:center;font-size:17px;font-weight:500;letter-spacing:-.012em;padding:15px 24px}
html.menu-abierto{overflow:hidden}
html.menu-abierto .header,html.menu-abierto.cine-en-pantalla .header{background:var(--paper);border-bottom-color:rgba(27,27,27,.07)}
html.menu-abierto.cine-en-pantalla .header nav a:not(.nav-contact),html.menu-abierto.cine-en-pantalla .header .brand,html.menu-abierto.cine-en-pantalla .brand-mark,html.menu-abierto.cine-en-pantalla .menu-icono{color:var(--ink)}
html.menu-abierto.cine-en-pantalla .brand small{color:var(--muted)}
html.menu-abierto.cine-en-pantalla .brand-mark{border-right-color:var(--line)}
html.menu-abierto.cine-en-pantalla .nav-contact{background:var(--green);color:#fff!important}
.hero{gap:40px}
.section{padding-block:88px}
.services article{padding:24px}
}
@media(max-width:650px){
.header{padding-inline:20px}
.brand-mark{font-size:22px;padding-right:10px}
.brand small{font-size:10px}
.hero{padding-block:36px 40px;gap:32px}
.hero h1{font-size:clamp(38px,10.4vw,52px);line-height:1.05}
.hero .intro{font-size:17px;line-height:1.5;margin-top:18px}
.hero .actions{gap:6px 22px}
.hero .button{padding:14px 22px}
.hero-image{height:300px}
.hero-visual{border-radius:var(--radio-m)}
h2{font-size:clamp(30px,8.6vw,40px)}
.intro{font-size:18px}
.eyebrow{font-size:14px;margin-bottom:10px}
.expertise-strip{justify-content:flex-start;padding:0 20px 56px;gap:8px;font-size:12px}
.expertise-strip p{padding:7px 13px}
.section{padding-block:72px}
.section-head{gap:16px;margin-bottom:32px}
.projects-grid{gap:20px}
.project-card,.explorer-stage,.resource-form,.oferta-panel{border-radius:var(--radio-m)}
.oferta-panel{padding:28px 22px}
.oferta-admision{font-size:18px}
.footer{padding:36px 20px calc(36px + env(safe-area-inset-bottom))}
.view-controls{width:100%}
.view-controls button{flex:1;padding:9px 12px}
.contact-grid .button{width:100%}
}

/* Accesibilidad: sin transparencia el material se vuelve sólido; sin movimiento quedan sólo fundidos */
@media(prefers-reduced-transparency:reduce){.header,.js-ready .header nav{background:var(--paper)!important;-webkit-backdrop-filter:none;backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){.js-ready .header nav a{transform:none}.button:active,.project-card:active,.nav-contact:active{transform:none}}
