:root{
  --tinta:#14181C;
  --tinta-2:#1B2126;
  --tinta-3:#262D33;
  --papel:#F7F6F3;
  --hueso:#ECEAE4;
  --marca:#C8452D;
  --brasa:#E8863A;
  --oro:#E3B866;
  --concreto:#8A8F94;
  --concreto-texto:#5F6469;
  --linea:#DDDBD6;
  --display:'Archivo','Helvetica Neue',Arial,sans-serif;
  --cuerpo:'Source Serif 4',Georgia,'Times New Roman',serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --pad:clamp(20px,4.4vw,64px);
  --max:1360px;
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
  --nav:76px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--tinta);color:var(--papel);font-family:var(--cuerpo);font-size:18px;line-height:1.6;overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
h1,h2,h3,p,ul,ol{margin:0;padding:0}
ul,ol{list-style:none}
::selection{background:var(--marca);color:#fff}

.contenedor{width:100%;max-width:calc(var(--max) + var(--pad)*2);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--concreto)}
.mono::before{content:"";display:inline-block;width:28px;height:1px;background:currentColor;vertical-align:middle;margin-right:12px;transform:translateY(-1px)}
.mono--sin::before{display:none}
h1,h2,h3{font-family:var(--display);font-weight:700;letter-spacing:-.025em}
h2{font-size:clamp(34px,5.4vw,84px);line-height:1;font-variation-settings:'wdth' 112}
.lede{font-size:clamp(18px,1.5vw,22px);line-height:1.55;max-width:56ch;color:var(--concreto)}
.em{font-family:var(--cuerpo);font-style:italic;font-weight:400;letter-spacing:-.02em;font-variation-settings:normal;color:var(--marca)}
.fl{display:inline-block;transition:transform .5s var(--ease)}
a:hover>.fl,.enlace-mono:hover .fl,button:hover>.fl{transform:translateX(6px)}

.js .rev{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
.js .rev.visible{opacity:1;transform:none}

.p{display:inline-block;overflow:hidden;vertical-align:top;padding:.1em 0 .14em;margin:-.1em 0 -.14em}
.p>span{display:inline-block;transform:translateY(112%) rotate(4deg);transform-origin:0 100%;filter:blur(10px);opacity:0;transition:transform 1.15s var(--ease),filter 1s var(--ease),opacity .8s var(--ease);transition-delay:calc(var(--i)*42ms + var(--d,0ms))}
.vis .p>span{transform:none;filter:none;opacity:1}

.seccion{position:relative;padding:clamp(96px,11vw,176px) 0}
.seccion--tinta{background-color:var(--tinta);color:var(--papel)}
.seccion--tinta,.hero,.pie__cuerpo{background-image:linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);background-size:72px 72px;background-position:-1px -1px}
.seccion--papel,.seccion--hueso,.metodo,.pie__cta{background-image:linear-gradient(rgba(20,24,28,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(20,24,28,.05) 1px,transparent 1px);background-size:72px 72px;background-position:-1px -1px}
.seccion--papel{background-color:var(--papel);color:var(--tinta)}
.seccion--hueso{background-color:var(--hueso);color:var(--tinta)}
.seccion--papel .lede,.seccion--hueso .lede{color:var(--concreto-texto)}
.seccion--papel .mono,.seccion--hueso .mono{color:var(--concreto-texto)}
.cabeza-seccion{display:grid;gap:clamp(20px,2.4vw,32px);margin-bottom:clamp(48px,6vw,96px)}
.cabeza-seccion h2{max-width:16ch}

.reticula{display:none}

.progreso{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(var(--sp,0));background:linear-gradient(90deg,var(--marca),var(--brasa));z-index:120;pointer-events:none}

.btn{display:inline-flex;align-items:center;gap:14px;padding:20px 30px;border-radius:999px;background:var(--papel);color:var(--tinta);font-family:var(--display);font-weight:600;font-size:16px;font-variation-settings:'wdth' 108;letter-spacing:-.01em;transition:background .4s var(--ease),color .4s var(--ease),transform .5s var(--ease);will-change:transform}
.btn:hover{background:var(--tinta);color:var(--papel)}
.enlace-mono{display:inline-flex;align-items:center;gap:12px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--marca)}

.nav{position:fixed;top:0;left:0;right:0;height:var(--nav);z-index:100;transition:background .5s var(--ease),backdrop-filter .5s,transform .6s var(--ease),border-color .5s;border-bottom:1px solid transparent}
.nav.solida{background:rgba(20,24,28,.72);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border-color:rgba(255,255,255,.08)}
.nav.oculta{transform:translateY(-100%)}
.nav.abierto{transform:none}
.nav__int{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav__marca{display:flex;align-items:center;gap:12px}
.nav__logo{height:30px;width:auto}
.nav__marca b{font-family:var(--display);font-weight:700;font-size:17px;letter-spacing:-.01em;font-variation-settings:'wdth' 112}
.nav__links{display:flex;align-items:center;gap:clamp(18px,2.4vw,38px)}
.nav__links a:not(.nav__cta){position:relative;font-family:var(--mono);font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:rgba(247,246,243,.72);padding:6px 0;transition:color .3s}
.nav__links a:not(.nav__cta)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--marca);transform:scaleX(0);transform-origin:0 50%;transition:transform .5s var(--ease)}
.nav__links a:not(.nav__cta):hover,.nav__links a.activo{color:#fff}
.nav__links a:not(.nav__cta):hover::after,.nav__links a.activo::after{transform:scaleX(1)}
.nav__n{display:none;font-style:normal}
.nav__cta{display:inline-flex;align-items:center;gap:10px;padding:12px 22px;border-radius:999px;background:var(--marca);color:#fff;font-family:var(--display);font-weight:600;font-size:14px;font-variation-settings:'wdth' 108;transition:background .4s,transform .5s var(--ease)}
.nav__cta:hover{background:#fff;color:var(--tinta)}
.nav__wa{width:17px;height:17px;fill:currentColor}
.nav__cta-movil{display:none}
.nav__burger{display:none;width:44px;height:44px;position:relative;z-index:3}
.nav__burger span{position:absolute;left:11px;right:11px;height:2px;background:#fff;transition:transform .5s var(--ease),opacity .3s,top .5s var(--ease)}
.nav__burger span:nth-child(1){top:16px}
.nav__burger span:nth-child(2){top:21px}
.nav__burger span:nth-child(3){top:26px}
.nav.abierto .nav__burger span:nth-child(1){top:21px;transform:rotate(45deg)}
.nav.abierto .nav__burger span:nth-child(2){opacity:0}
.nav.abierto .nav__burger span:nth-child(3){top:21px;transform:rotate(-45deg)}

.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;background-color:var(--tinta);isolation:isolate}
.hero__lienzo{position:absolute;inset:0;z-index:-3}
.hero__lienzo canvas{width:100%;height:100%}
.hero__luz{position:absolute;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(520px circle at var(--mx,70%) var(--my,45%),rgba(232,134,58,.16),transparent 62%)}
.hero__velo{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(20,24,28,.94) 0%,rgba(20,24,28,.7) 34%,rgba(20,24,28,0) 62%),linear-gradient(0deg,var(--tinta) 0%,rgba(20,24,28,0) 22%)}
.hero__int{position:relative;width:100%;padding-top:calc(var(--nav) + 48px);padding-bottom:140px}
.hero__kicker{display:flex;flex-wrap:wrap;gap:8px 0;margin-bottom:clamp(24px,3vw,44px);color:var(--oro)}
.hero__kicker .hero__sep{margin:0 14px;opacity:.5}
.hero h1{font-size:clamp(46px,8.2vw,150px);line-height:.94;letter-spacing:-.04em;font-weight:700;font-variation-settings:'wdth' 114;max-width:11.2ch;text-wrap:balance}
.hero h1 .em{font-size:1.04em;letter-spacing:-.035em;padding-right:.04em}
.hero__sub{margin-top:clamp(28px,3.4vw,52px);max-width:44ch;font-size:clamp(17px,1.5vw,21px);color:rgba(247,246,243,.72);line-height:1.55;opacity:0;transform:translateY(18px);transition:opacity 1.2s var(--ease) .9s,transform 1.2s var(--ease) .9s}
.hero.vis .hero__sub{opacity:1;transform:none}
.hero__bajar{position:absolute;left:var(--pad);bottom:34px;display:flex;align-items:center;gap:16px;font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(247,246,243,.6);opacity:0;transition:opacity 1.2s var(--ease) 1.4s}
.hero.vis .hero__bajar{opacity:1}
.hero__bajar i{display:block;width:1px;height:46px;background:linear-gradient(var(--marca),transparent);transform-origin:0 0;animation:caida 2.2s var(--ease-io) infinite}
@keyframes caida{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.leyenda{position:absolute;left:calc(var(--pad) + 190px);bottom:34px;display:grid;gap:10px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(247,246,243,.7);opacity:0;transition:opacity 1.4s var(--ease) 1.5s}
.hero.vis .leyenda{opacity:1}
.leyenda span{display:flex;align-items:center;gap:12px}
.leyenda i{display:block;flex:none}
.leyenda .l-cubo{width:12px;height:12px;background:linear-gradient(135deg,#F6C77A,#C8452D);transform:rotate(45deg) scaleY(.7)}
.leyenda .l-aro{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--oro)}
.relato{position:relative;height:360vh;background:var(--tinta)}
.relato__escena{position:sticky;top:0;height:100svh;overflow:hidden}
.relato__capa{position:absolute;inset:0;display:grid;place-items:center;padding:0 var(--pad)}
.relato__capa--noche{color:var(--papel);background:var(--tinta)}
.relato__capa--dia{color:var(--tinta);background:var(--hueso);clip-path:circle(0px at 50% 50%)}
.relato__bloque{width:100%;max-width:1180px;display:grid;gap:clamp(22px,3vw,40px)}
.relato__txt{font-family:var(--display);font-weight:700;font-size:clamp(34px,6.2vw,104px);line-height:1;letter-spacing:-.035em;font-variation-settings:'wdth' 112;text-wrap:balance}
.relato__txt .w{opacity:calc(.14 + var(--o,0)*.86);transition:none}
.relato__capa--dia .relato__txt .w{opacity:calc(.1 + var(--o,0)*.9)}
.relato__capa--noche .mono{color:var(--oro)}
.relato__capa--dia .mono{color:var(--marca)}
.relato__aro{position:absolute;left:50%;top:50%;width:0;height:0;border-radius:50%;border:1px solid var(--marca);transform:translate(-50%,-50%);pointer-events:none;opacity:0;box-shadow:0 0 60px rgba(232,134,58,.35),inset 0 0 60px rgba(232,134,58,.2)}
.relato__orbe{position:absolute;pointer-events:none;border-radius:50%;filter:blur(90px);opacity:.5}
.relato__orbe--a{width:46vw;height:46vw;left:-12vw;top:-14vw;background:rgba(200,69,45,.35)}
.relato__orbe--b{width:36vw;height:36vw;right:-10vw;bottom:-12vw;background:rgba(232,134,58,.22)}
.relato__regla{position:absolute;left:var(--pad);right:var(--pad);bottom:34px;display:flex;justify-content:space-between;font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.relato__capa--noche .relato__regla{color:rgba(247,246,243,.45)}
.relato__capa--dia .relato__regla{color:rgba(20,24,28,.5)}

.camino{overflow:hidden}
.cifras{display:grid;margin-bottom:clamp(72px,9vw,136px)}
.cifra{position:relative;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:end;gap:clamp(20px,5vw,80px);padding:clamp(34px,4.4vw,64px) 0 clamp(30px,3.6vw,52px);border-top:1px solid rgba(255,255,255,.14)}
.cifra:last-child{border-bottom:1px solid rgba(255,255,255,.14)}
.cifra__n{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 .22em;font-family:var(--display);font-weight:800;font-variation-settings:'wdth' 125;font-size:clamp(64px,12vw,200px);line-height:.88;letter-spacing:-.05em;color:var(--papel)}
.cifra__n small{font-size:.24em;letter-spacing:-.02em;font-weight:600;font-variation-settings:'wdth' 112;color:var(--brasa);max-width:9ch;line-height:1.05}
.cifra__cota{position:absolute;left:0;bottom:-1px;height:9px;width:var(--w,40%);transform-origin:0 50%;transform:scaleX(0);transition:transform 1.8s var(--ease) .2s;background:linear-gradient(var(--marca),var(--marca)) 0 50%/100% 2px no-repeat,linear-gradient(var(--marca),var(--marca)) 0 0/2px 100% no-repeat,linear-gradient(var(--marca),var(--marca)) 100% 0/2px 100% no-repeat}
.cifra.visible .cifra__cota{transform:scaleX(1)}
.cifra p{font-size:clamp(18px,1.7vw,24px);line-height:1.5;color:rgba(247,246,243,.78);max-width:34ch;padding-bottom:clamp(6px,1vw,14px)}

.marquesina{display:grid;gap:clamp(14px,1.6vw,22px);margin-top:clamp(28px,3vw,44px);-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.marquesina__fila{overflow:hidden;white-space:nowrap;transform:skewX(var(--sk,0deg))}
.marquesina__pista{display:inline-flex;will-change:transform}
.marquesina__grupo{display:inline-flex;flex:none}
.logo-celda{flex:none;display:inline-flex;align-items:center;padding:0 clamp(18px,2.2vw,32px);font-family:var(--display);font-weight:600;font-size:clamp(18px,2vw,30px);letter-spacing:-.02em;font-variation-settings:'wdth' 108;color:rgba(247,246,243,.62);transition:color .3s}
.logo-celda::after{content:"";width:11px;height:11px;margin-left:clamp(18px,2.2vw,32px);background:linear-gradient(var(--marca),var(--marca)) 50% 0/1.5px 100% no-repeat,linear-gradient(var(--marca),var(--marca)) 0 50%/100% 1.5px no-repeat;opacity:.8}
.marquesina__fila:nth-child(2) .logo-celda{color:rgba(247,246,243,.4)}
.logo-celda:hover{color:var(--papel)}
.marquesina__rotulo{margin-top:clamp(48px,6vw,80px)}

.metodo{position:relative;background-color:var(--papel);color:var(--tinta);height:760vh}
.metodo__escena{position:sticky;top:0;height:100svh;display:flex;align-items:center;overflow:hidden}
.metodo__rejilla{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:clamp(24px,5vw,88px);align-items:center;width:100%;padding-top:var(--nav)}
.metodo__texto{display:grid;gap:clamp(18px,2vw,30px);align-content:center}
.metodo__texto h2{font-size:clamp(32px,4.2vw,68px);max-width:15ch}
.metodo__texto .lede{font-size:clamp(16px,1.25vw,19px);max-width:46ch}
.frentes{position:relative;display:grid;margin-top:clamp(8px,1.4vw,24px);min-height:clamp(150px,17vw,230px)}
.frente{grid-area:1/1;display:grid;gap:6px;align-content:start;opacity:0;transform:translateY(24px);filter:blur(8px);transition:opacity .6s var(--ease),transform .8s var(--ease),filter .6s;pointer-events:none}
.frente.on{opacity:1;transform:none;filter:none;pointer-events:auto}
.frente__n{font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:var(--marca)}
.frente__nom{font-family:var(--display);font-weight:800;font-variation-settings:'wdth' 118;font-size:clamp(40px,6vw,96px);line-height:.95;letter-spacing:-.04em}
.frente__desc{font-size:clamp(17px,1.5vw,22px);line-height:1.5;color:var(--concreto-texto);max-width:36ch;margin-top:8px}
.metodo__indice{display:flex;gap:10px;margin-top:clamp(10px,1.4vw,22px)}
.metodo__indice i{flex:1;max-width:46px;height:3px;background:rgba(20,24,28,.14);position:relative;overflow:hidden}
.metodo__indice i::after{content:"";position:absolute;inset:0;background:var(--marca);transform:scaleX(0);transform-origin:0 50%;transition:transform .7s var(--ease)}
.metodo__indice i.on::after{transform:scaleX(1)}
.radar{position:relative;width:min(100%,calc((100svh - var(--nav) - 60px) * 1.17),760px);aspect-ratio:820/700;justify-self:center}
.radar svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.radar__barrido{position:absolute;left:50%;top:50%;width:56%;aspect-ratio:1;margin:-28% 0 0 -28%;border-radius:50%;background:conic-gradient(from 0deg,rgba(200,69,45,0) 0deg,rgba(200,69,45,0) 262deg,rgba(200,69,45,.28) 360deg);transform:rotate(var(--ang,0deg));-webkit-mask-image:radial-gradient(circle,#000 0 70%,transparent 71%);mask-image:radial-gradient(circle,#000 0 70%,transparent 71%);pointer-events:none}
.radar__anillos{stroke:rgba(20,24,28,.16);fill:none}
.radar__ejes{stroke:rgba(20,24,28,.12)}
.radar__forma{fill:rgba(200,69,45,.12);stroke:var(--marca);stroke-width:2;stroke-linejoin:round;transition:d .6s}
.radar__nodo{fill:var(--papel);stroke:rgba(20,24,28,.4);stroke-width:1.5;transition:fill .5s,stroke .5s,r .5s var(--ease)}
.radar__nodo.vio{fill:var(--tinta);stroke:var(--tinta)}
.radar__nodo.on{fill:var(--marca);stroke:var(--marca)}
.radar__halo{fill:none;stroke:var(--marca);stroke-width:1.5;opacity:0;transform-box:fill-box;transform-origin:center}
.radar__halo.on{opacity:.8;animation:onda 1.8s var(--ease) infinite}
@keyframes onda{0%{transform:scale(.7);opacity:.9}100%{transform:scale(2.6);opacity:0}}
.radar__rotulo{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;fill:rgba(20,24,28,.36);transition:fill .5s}
.radar__rotulo.vio{fill:rgba(20,24,28,.78)}
.radar__rotulo.on{fill:var(--marca)}
.radar__centro{fill:var(--tinta)}
.radar__cota{font-family:var(--display);font-weight:800;font-size:46px;letter-spacing:-.04em;fill:var(--tinta);text-anchor:middle}
.radar__sub{font-family:var(--mono);font-size:10px;letter-spacing:.2em;fill:var(--concreto-texto);text-anchor:middle;text-transform:uppercase}

.ayuda{overflow:hidden}
.ayuda__ruta{position:absolute;inset:0;pointer-events:none;opacity:.9}
.ayuda__ruta svg{position:absolute;inset:0;width:100%;height:100%}
.ayuda .contenedor{position:relative}
.pasos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,26px);align-items:stretch}
.pasos li{position:relative;display:flex;flex-direction:column;gap:18px;padding:clamp(26px,2.6vw,42px);background:var(--tinta-2);transition:background .5s var(--ease)}
.pasos li::before,.pasos li::after{content:"";position:absolute;width:22px;height:22px;pointer-events:none;border:0 solid var(--marca);transition:width .6s var(--ease),height .6s var(--ease)}
.pasos li::before{left:-1px;top:-1px;border-width:2px 0 0 2px}
.pasos li::after{right:-1px;bottom:-1px;border-width:0 2px 2px 0}
.pasos li:hover{background:var(--tinta-3)}
.pasos li:hover::before,.pasos li:hover::after{width:calc(100% + 2px);height:calc(100% + 2px)}
.pasos li>.mono{color:var(--marca);font-size:12px;letter-spacing:.2em}
.pasos li>.mono::before{display:none}
.pasos h3{font-size:clamp(26px,2.4vw,38px);line-height:1.04;font-variation-settings:'wdth' 112;margin-top:clamp(40px,5vw,72px);max-width:12ch}
.paso__cita{font-family:var(--cuerpo);font-style:italic;font-size:clamp(20px,1.7vw,25px);line-height:1.3;color:var(--oro)}
.paso__cierre{color:rgba(247,246,243,.74);font-size:clamp(16px,1.2vw,18px);line-height:1.55}
.pasos .enlace-mono{margin-top:auto;padding-top:6px;color:var(--brasa)}
.nota-suave{margin-top:clamp(40px,5vw,72px);max-width:78ch;color:rgba(247,246,243,.6);font-size:clamp(16px,1.2vw,18px)}
.nota-suave a{color:var(--papel);border-bottom:1px solid var(--marca)}
.nota-suave strong{font-weight:600}

#casos{position:relative;background-color:var(--hueso);background-image:linear-gradient(rgba(20,24,28,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(20,24,28,.05) 1px,transparent 1px);background-size:72px 72px;color:var(--tinta);padding:0}
#casos>.contenedor{position:sticky;top:0;height:100svh;max-width:none;padding:0;display:flex;flex-direction:column;justify-content:center;gap:clamp(24px,3.4vh,44px);overflow:hidden;padding-top:calc(var(--nav) + 10px)}
#casos .cabeza-seccion{padding:0 var(--pad);margin:0;gap:14px}
#casos .cabeza-seccion h2{font-size:clamp(30px,4.6vw,76px);max-width:20ch}
#casos .mono{color:var(--concreto-texto)}
.casos{display:flex;gap:clamp(16px,1.8vw,28px);padding:0 var(--pad);width:max-content;will-change:transform}
.caso-tarjeta{flex:none;position:relative;display:flex;flex-direction:column;width:min(74vw,560px);background:var(--tinta);color:var(--papel);overflow:hidden;border-radius:4px;transition:transform .8s var(--ease)}
.caso-tarjeta__foto{display:block;position:relative;aspect-ratio:878/459;overflow:hidden;background:#20252A}
.caso-tarjeta__foto img{width:100%;height:100%;object-fit:cover;transform:scale(1.001);transition:transform 1.4s var(--ease),filter .8s}
.caso-tarjeta__foto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,24,28,0) 55%,rgba(20,24,28,.7));pointer-events:none}
.caso-tarjeta:hover .caso-tarjeta__foto img{transform:scale(1.07)}
.caso-tarjeta__texto{display:flex;flex-direction:column;gap:14px;padding:clamp(20px,2vw,30px) clamp(20px,2vw,30px) clamp(22px,2.2vw,32px);flex:1}
.caso-tarjeta .mono{color:var(--oro);font-size:11px;letter-spacing:.12em;line-height:1.5}
.caso-tarjeta .mono::before{display:none}
.caso-tarjeta__titular{display:block;font-family:var(--display);font-weight:700;font-variation-settings:'wdth' 112;font-size:clamp(20px,1.9vw,28px);line-height:1.1;letter-spacing:-.025em}
.caso-tarjeta .enlace-mono{margin-top:auto;padding-top:6px;color:var(--brasa)}
#casos .ideas__pie{position:absolute;right:var(--pad);top:calc(var(--nav) + 26px)}
#casos .ideas__pie[hidden]{display:none}
.casos__medida{position:absolute;left:var(--pad);right:var(--pad);bottom:clamp(18px,3vh,34px);height:2px;background:rgba(20,24,28,.14)}
.casos__medida i{position:absolute;inset:0;background:var(--marca);transform-origin:0 50%;transform:scaleX(var(--cp,0))}

.sobre{overflow:hidden}
.sobre__kicker{display:none}
.sobre__int{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,7vw,120px);align-items:center}
.sobre__foto{position:relative;aspect-ratio:1052/1316;max-width:560px;width:100%;overflow:hidden;border-radius:4px;background:#0c0f12}
.sobre__foto::before{content:"";position:absolute;inset:-12%;background:url(/img/jp-ayala.webp) center/cover;filter:grayscale(1) contrast(1.08);transform:translateY(var(--py,0px)) scale(1.1)}
.sobre__foto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(200,69,45,.0) 40%,rgba(200,69,45,.5)),radial-gradient(circle at 70% 20%,rgba(232,134,58,.28),transparent 60%);mix-blend-mode:multiply;pointer-events:none}
.sobre__foto.rev{clip-path:inset(0 0 100% 0);transition:clip-path 1.6s var(--ease),opacity 1s}
.js .sobre__foto.rev.visible{clip-path:inset(0)}
.sobre__col{display:grid;gap:clamp(18px,2vw,28px)}
.sobre__col h2{font-size:clamp(34px,5vw,80px);max-width:11ch}
.sobre__col>p:not(.mono){font-size:clamp(17px,1.35vw,20px);line-height:1.65;color:rgba(247,246,243,.76);max-width:52ch}
.sobre__col .mono{color:var(--oro)}
.hitos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:clamp(24px,3vw,44px);position:relative}
.hitos::before{content:"";position:absolute;left:0;right:0;top:6px;height:1px;background:rgba(255,255,255,.2)}
.hitos::after{content:"";position:absolute;left:0;width:100%;top:6px;height:1px;background:var(--marca);transform:scaleX(var(--hp,0));transform-origin:0 50%}
.hito{position:relative;padding-top:26px;padding-right:10px}
.hito::before{content:"";position:absolute;left:0;top:0;width:13px;height:13px;border-radius:50%;background:var(--tinta);border:1px solid rgba(255,255,255,.5);transition:background .5s,border-color .5s,box-shadow .5s}
.hito.on::before{background:var(--marca);border-color:var(--marca);box-shadow:0 0 0 6px rgba(200,69,45,.2)}
.hito b{display:block;font-family:var(--display);font-weight:800;font-variation-settings:'wdth' 118;font-size:clamp(22px,2.2vw,34px);letter-spacing:-.03em}
.hito span{display:block;font-size:14px;line-height:1.4;color:rgba(247,246,243,.62);margin-top:4px}

.ideas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,36px);perspective:1200px}
.idea{display:flex;flex-direction:column;transition:transform .6s var(--ease);transform-style:preserve-3d;will-change:transform}
.idea__foto{display:block;aspect-ratio:16/9;background:var(--tinta) center/cover;position:relative;overflow:hidden;border-radius:3px;margin-bottom:24px;transition:transform 1.2s var(--ease)}
.idea__foto::after{content:"";position:absolute;inset:0;background:linear-gradient(200deg,rgba(20,24,28,.1),rgba(20,24,28,.55));transition:opacity .6s}
.idea:hover .idea__foto{transform:scale(1.025)}
.idea:hover .idea__foto::after{opacity:.35}
.idea__meta{display:flex;margin-bottom:14px}
.idea__cat{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--marca)}
.idea h3{font-size:clamp(21px,2vw,28px);line-height:1.12;margin-bottom:14px;font-variation-settings:'wdth' 108;transition:color .4s}
.idea:hover h3{color:var(--marca)}
.idea p{font-size:16px;line-height:1.55;color:var(--concreto-texto)}
.ideas__pie{margin-top:clamp(40px,5vw,72px)}

.filtro-zona{position:relative}
.filtro{display:grid;gap:0;counter-reset:f}
.filtro li{position:sticky;top:calc(var(--nav) + 40px + var(--i)*26px);display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(20px,4vw,64px);align-items:start;padding:clamp(28px,3.4vw,56px);margin-bottom:clamp(24px,5vh,56px);background:var(--tinta-2);border:1px solid rgba(255,255,255,.1);border-radius:4px;transform-origin:50% 0;transform:scale(var(--sc,1));filter:brightness(var(--br,1));will-change:transform}
.filtro li:nth-child(2){background:var(--tinta-3)}
.filtro li:nth-child(3){background:#2F373E}
.filtro li>span{font-family:var(--display);font-weight:800;font-variation-settings:'wdth' 125;font-size:clamp(56px,9vw,150px);line-height:.85;letter-spacing:-.05em;color:var(--marca)}
.filtro li p{font-size:clamp(18px,1.8vw,26px);line-height:1.45;color:rgba(247,246,243,.88);max-width:42ch}

.pie{background:var(--tinta);color:var(--papel)}
.pie__cta{position:relative;overflow:hidden;background-color:var(--papel);color:var(--tinta);padding:clamp(88px,10vw,160px) 0}
.pie__cta .contenedor{position:relative;display:grid;gap:clamp(32px,4vw,56px)}
.pie__cta .mono{color:var(--concreto-texto)}
.pie__cta h2{font-size:clamp(38px,7vw,120px);line-height:.96;max-width:13ch;letter-spacing:-.04em;font-variation-settings:'wdth' 114}
.pie__cta-acc{display:flex;flex-wrap:wrap;align-items:center;gap:20px 36px}
.pie__cta .btn{background:var(--tinta);color:#fff;padding:24px 38px;font-size:18px}
.pie__cta .btn:hover{background:var(--marca)}
.pie__asistente{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta);border-bottom:1px solid var(--marca);padding-bottom:4px}
.pie__trama{position:absolute;right:-4%;top:50%;width:min(56vw,760px);transform:translateY(-50%);pointer-events:none}
.pie__cuerpo{padding:clamp(56px,6vw,96px) 0 28px}
.pie__cols{display:grid;grid-template-columns:1.3fr .8fr 1fr 1.2fr;gap:clamp(28px,3vw,56px)}
.pie__col{display:grid;gap:12px;align-content:start}
.pie__col .mono{margin-bottom:10px;color:var(--oro)}
.pie__col .mono::before{display:none}
.pie__col a:not(.pie__marca):not(.pie__dato):not(.pie__equipo){color:rgba(247,246,243,.72);font-size:16px;transition:color .3s}
.pie__col a:not(.pie__marca):not(.pie__dato):not(.pie__equipo):hover{color:#fff}
.pie__marca{display:flex;align-items:center;gap:14px}
.pie__logo{height:34px;width:auto}
.pie__nombre{font-family:var(--display);font-weight:700;font-size:20px;font-variation-settings:'wdth' 112}
.pie__frase{color:rgba(247,246,243,.62);font-size:16px;line-height:1.55;max-width:34ch}
.pie__social{display:flex;gap:18px;margin-top:6px}
.pie__icono{display:block;transition:transform .4s var(--ease),color .3s}
.pie__icono svg{width:22px;height:22px;fill:currentColor}
.pie__icono:hover{transform:translateY(-3px);color:var(--brasa)}
.pie__dato{display:grid;font-size:16px;color:rgba(247,246,243,.8)}
.pie__dato span{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--concreto)}
.pie__equipo{display:grid;gap:4px;font-size:15px;line-height:1.45;color:rgba(247,246,243,.62)}
.pie__equipo b{color:#fff;font-family:var(--display);font-weight:700;font-size:17px;font-variation-settings:'wdth' 108}
.pie__legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:clamp(40px,5vw,72px);padding-top:22px;border-top:1px solid rgba(255,255,255,.12);font-size:14px;color:rgba(247,246,243,.5)}
.pie__legales{display:flex;gap:22px}
.pie__legales a:hover{color:#fff}
.cajetin{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;margin-top:clamp(40px,5vw,72px);border:1px solid rgba(255,255,255,.22)}
.cajetin>div{padding:16px 20px;border-left:1px solid rgba(255,255,255,.22);display:grid;gap:6px;align-content:start}
.cajetin>div:first-child{border-left:0}
.cajetin span{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--concreto)}
.cajetin b{font-family:var(--display);font-weight:700;font-size:clamp(16px,1.6vw,22px);letter-spacing:-.01em;font-variation-settings:'wdth' 110}
.cajetin>div:first-child b{font-size:clamp(22px,2.6vw,38px);font-weight:800;font-variation-settings:'wdth' 120;letter-spacing:-.03em}

@media(max-width:1040px){
  .pasos{grid-template-columns:1fr}
  .pasos h3{margin-top:clamp(28px,6vw,48px);max-width:none}
  .ideas{grid-template-columns:1fr 1fr}
  .pie__cols{grid-template-columns:1fr 1fr}
}
@media(max-width:899px){
  :root{--nav:68px}
  .nav__burger{display:block}
  .nav__links{position:fixed;left:0;right:0;top:0;height:100dvh;padding:calc(var(--nav) + 18px) var(--pad) 28px;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;background:var(--tinta);transform:translateY(-102%);transition:transform .8s var(--ease);overflow-y:auto}
  .nav.abierto .nav__links{transform:none}
  .nav__links a:not(.nav__cta){display:flex;align-items:baseline;gap:18px;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.14);font-family:var(--display);font-size:clamp(26px,7.4vw,34px);letter-spacing:-.02em;text-transform:none;font-weight:700;font-variation-settings:'wdth' 114;color:#fff}
  .nav__links a:not(.nav__cta)::after{display:none}
  .nav__n{display:inline;font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--marca);font-weight:500}
  .nav__cta{margin-top:26px;justify-content:center;padding:18px 22px;font-size:17px}
  .nav__cta-esc{display:none}
  .nav__cta-movil{display:inline}
  .nav.abierto{background:var(--tinta)}
  .hero h1{max-width:9.4ch}
  .hero__velo{background:linear-gradient(0deg,rgba(20,24,28,.96) 0%,rgba(20,24,28,.74) 46%,rgba(20,24,28,.2) 100%)}
  .hero__int{padding-bottom:170px}
  .cifra{grid-template-columns:1fr;gap:12px}
  .metodo{height:auto}
  .metodo__escena{position:relative;height:auto;display:block;padding:clamp(80px,14vw,120px) 0}
  .metodo__rejilla{grid-template-columns:1fr;padding-top:0}
  .radar{order:-1;width:min(100%,520px);margin-bottom:12px}
  .metodo__indice{display:none}
  .frentes{min-height:0;gap:34px;margin-top:20px}
  .frente{grid-area:auto;opacity:1;transform:none;filter:none;pointer-events:auto;padding-top:22px;border-top:1px solid var(--linea)}
  .frente__nom{font-size:clamp(36px,10vw,56px)}
  #casos{padding:clamp(80px,14vw,120px) 0}
  #casos>.contenedor{position:relative;height:auto;overflow:visible;padding-top:0;gap:28px}
  .casos{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:20px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .casos::-webkit-scrollbar{display:none}
  .caso-tarjeta{scroll-snap-align:start;width:min(82vw,420px)}
  #casos .ideas__pie{position:static;padding:0 var(--pad)}
  .casos__medida{display:none}
  .sobre__int{grid-template-columns:1fr}
  .sobre__foto{max-width:420px}
  .hitos{grid-template-columns:1fr 1fr;row-gap:28px}
  .hitos::before,.hitos::after{display:none}
  .ideas{grid-template-columns:1fr}
  .filtro li{position:relative;top:auto;grid-template-columns:1fr;gap:12px;transform:none;filter:none}
  .pie__cols{grid-template-columns:1fr}
  .pie__trama{width:120vw;right:-50%;opacity:.5}
  .cajetin{grid-template-columns:1fr 1fr}
  .cajetin>div:nth-child(odd){border-left:0}
  .cajetin>div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.22)}
  .leyenda{display:none}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .rev{opacity:1;transform:none}
  .p>span{transform:none;filter:none;opacity:1}
  .hero__sub,.hero__bajar,.leyenda{opacity:1}
  .relato{height:auto}
  .relato__escena{position:relative;height:auto}
  .relato__capa{position:relative;min-height:70vh}
  .relato__capa--dia{clip-path:none}
  .relato__txt .w{opacity:1}
}