@font-face{font-family:"Archivo";src:url("/assets/fonts/archivo-var.woff2") format("woff2-variations"),url("/assets/fonts/archivo-var.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}

:root{
  --hueso:#F7F6F3;--papel:#ECEAE4;--tinta:#121212;--tinta-2:#2A2A28;--gris:#5C5B57;--gris-claro:#B8B6AF;
  --cobalto:#2441E8;--cobalto-oscuro:#1A31B8;--linea:rgba(18,18,18,.14);--linea-clara:rgba(247,246,243,.16);
  --ease-out:cubic-bezier(.23,1,.32,1);--ease-io:cubic-bezier(.77,0,.175,1);
  --gutter:16px;--max:1240px;--cab:64px;
  color-scheme:light;
}
@media (min-width:700px){:root{--gutter:32px;--cab:72px}}
@media (min-width:1100px){:root{--gutter:48px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--cab);scrollbar-color:var(--tinta) var(--papel)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--hueso);color:var(--tinta);font-family:"Archivo",system-ui,sans-serif;font-size:1rem;line-height:1.55;font-weight:420;font-stretch:100%;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
::selection{background:var(--cobalto);color:var(--hueso)}
:focus-visible{outline:2px solid var(--cobalto);outline-offset:3px;border-radius:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.html-bloqueado{overflow:hidden}

/* tipografía */
.t2{font-size:clamp(2.1rem,6.4vw,5rem);font-weight:640;font-stretch:125%;line-height:.98;letter-spacing:-.025em;text-wrap:balance}
.t3{font-size:clamp(1.45rem,2.6vw,2.1rem);font-weight:620;font-stretch:118%;line-height:1.05;letter-spacing:-.015em}

/* botones */
.boton{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;background:var(--tinta);color:var(--hueso);text-decoration:none;font-weight:600;font-stretch:112%;font-size:.98rem;letter-spacing:.005em;border-radius:2px;transition:background-color 200ms ease,transform 160ms var(--ease-out);-webkit-tap-highlight-color:transparent}
.boton:active{transform:scale(.97)}
.boton--chico{min-height:44px;padding:0 16px;font-size:.88rem}
.boton--grande{min-height:60px;padding:0 32px;font-size:1.05rem;background:var(--hueso);color:var(--tinta)}
.enlace{display:inline-flex;align-items:center;min-height:44px;font-weight:600;font-stretch:112%;text-decoration:none;background:linear-gradient(currentColor,currentColor) left calc(100% - 10px)/100% 1.5px no-repeat;transition:background-size 240ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .boton:hover{background:var(--cobalto)}
  .boton--grande:hover{background:var(--tinta);color:var(--hueso)}
  .enlace:hover{background-size:0 1.5px;background-position:right calc(100% - 10px)}
}

/* intro */
.intro{display:none}
.con-intro .intro{position:fixed;inset:0;z-index:100;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;padding:0 var(--gutter);background:var(--tinta);color:var(--hueso);animation:intro-sale 900ms var(--ease-io) 2600ms forwards;cursor:pointer}
.intro__l,.intro__r{font-size:clamp(.82rem,1.4vw,1.05rem);font-weight:560;font-stretch:118%;letter-spacing:.01em;opacity:0;animation:aparece 500ms var(--ease-out) 1700ms forwards}
.intro__r{text-align:right}
.intro__logo{width:clamp(120px,22vw,220px);overflow:visible}
.intro__banda{stroke-dasharray:1;stroke-dashoffset:1;animation:traza 520ms var(--ease-out) 150ms forwards}
.intro__clip{transform:translateY(100px);animation:sube 700ms var(--ease-out) 520ms forwards}
.intro__l1,.intro__l2,.intro__l3{stroke-dasharray:1;stroke-dashoffset:1;animation:traza 420ms var(--ease-out) forwards}
.intro__l1{animation-delay:1100ms}.intro__l2{animation-delay:1220ms}.intro__l3{animation-delay:1340ms}
.intro--fuera{animation:intro-salta 450ms var(--ease-io) forwards!important}
.intro--fuera *{animation-play-state:paused}
@keyframes intro-salta{from{clip-path:inset(0 0 0 0)}to{clip-path:inset(0 0 100% 0);visibility:hidden}}
.con-intro.intro-saltada .hero__t{animation-delay:200ms}.con-intro.intro-saltada .hero__lado{animation-delay:320ms}
@media (max-width:699px){.con-intro .intro{grid-template-columns:1fr;grid-template-rows:1fr auto 1fr;justify-items:center;text-align:center}.intro__l{align-self:end}.intro__r{align-self:start;text-align:center}}
@keyframes traza{to{stroke-dashoffset:0}}
@keyframes sube{to{transform:translateY(0)}}
@keyframes aparece{to{opacity:1}}
@keyframes intro-sale{to{clip-path:inset(0 0 100% 0);visibility:hidden}}
.intro{clip-path:inset(0 0 0 0)}

/* cabecera */
.cab{position:fixed;inset:0 0 auto;z-index:50;height:var(--cab);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 var(--gutter);background:var(--hueso);border-bottom:1px solid transparent;transition:border-color 200ms ease}
.cab[data-scrolled]{border-color:var(--linea)}
.cab__logo{display:flex;align-items:center;gap:10px;min-height:44px;text-decoration:none;color:var(--tinta)}
.cab__logo svg{height:28px;width:auto;color:var(--cobalto)}
.cab__logo span{font-size:13.5px;line-height:1.02;font-weight:620;font-stretch:112%;letter-spacing:.01em}
.cab__nav{display:none}
.cab__acc{display:flex;align-items:center;gap:8px}
.idioma{min-width:44px;min-height:44px;padding:0 10px;font-size:.82rem;font-weight:620;font-stretch:112%;letter-spacing:.04em;border:1px solid var(--linea);border-radius:2px;transition:border-color 200ms ease,transform 160ms var(--ease-out)}
.idioma:active{transform:scale(.97)}
.menu-btn{position:relative;width:44px;height:44px;display:grid;place-content:center;gap:6px;transition:transform 160ms var(--ease-out)}
.menu-btn:active{transform:scale(.94)}
.menu-btn i{display:block;width:22px;height:2px;background:currentColor;transition:transform 240ms var(--ease-out)}
.menu-btn[aria-expanded="true"] i:first-of-type{transform:translateY(4px) rotate(45deg)}
.menu-btn[aria-expanded="true"] i:last-of-type{transform:translateY(-4px) rotate(-45deg)}
.menu-movil{position:absolute;top:100%;left:0;right:0;display:flex;flex-direction:column;padding:8px var(--gutter) 24px;background:var(--hueso);border-bottom:1px solid var(--linea);transform-origin:top;animation:menu-entra 220ms var(--ease-out)}
.menu-movil[hidden]{display:none}
.menu-movil a{padding:14px 0;font-size:1.6rem;font-weight:620;font-stretch:118%;text-decoration:none;border-bottom:1px solid var(--linea)}
@keyframes menu-entra{from{opacity:0;transform:translateY(-8px)}}
@media (max-width:379px){.cab .boton--chico{display:none}}
@media (min-width:960px){
  .cab__nav{display:flex;gap:32px;position:absolute;left:50%;transform:translateX(-50%)}
  .cab__nav a{font-size:.93rem;font-weight:540;font-stretch:108%;text-decoration:none;padding:10px 0;background:linear-gradient(currentColor,currentColor) left calc(100% - 4px)/0 1.5px no-repeat;transition:background-size 240ms var(--ease-out)}
  .cab__nav a:hover,.cab__nav a[aria-current]{background-size:100% 1.5px}
  .menu-btn,.menu-movil{display:none!important}
}
@media (hover:hover) and (pointer:fine){.idioma:hover{border-color:var(--tinta)}}

/* hero */
.hero{padding-top:calc(var(--cab) + clamp(28px,6vw,72px));overflow:hidden}
.hero__txt{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.hero__t{font-size:clamp(2.45rem,8.6vw,6rem);font-weight:660;font-stretch:125%;line-height:.94;letter-spacing:-.03em;max-width:13ch;text-wrap:balance}
.hero__lado{display:grid;gap:24px;margin-top:clamp(20px,3vw,40px)}
.hero__p{max-width:46ch;color:var(--gris);font-size:clamp(1rem,1.25vw,1.13rem)}
.hero__ctas{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px}
@media (min-width:900px){.hero__lado{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:48px}}
.hero__t,.hero__lado{animation:sube-txt 800ms var(--ease-out) both}
.hero__lado{animation-delay:120ms}
.con-intro .hero__t{animation-delay:2900ms}.con-intro .hero__lado{animation-delay:3020ms}
@keyframes sube-txt{from{opacity:0;transform:translateY(24px)}}

.tira{margin-top:clamp(36px,6vw,72px);padding-bottom:clamp(40px,6vw,80px);overflow:hidden}
.tira__pista{display:flex;gap:12px;width:max-content;animation:corre 60s linear infinite}
.tira figure{flex:none;width:clamp(150px,44vw,280px);aspect-ratio:4/5;overflow:hidden;border-radius:2px;background:var(--papel)}
.tira img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
@media (hover:hover) and (pointer:fine){.tira:hover .tira__pista{animation-play-state:paused}}
@keyframes corre{to{transform:translateX(calc(-50% - 6px))}}

/* servicios */
.serv{padding:clamp(64px,10vw,140px) 0;border-top:1px solid var(--linea)}
.serv__cab{max-width:var(--max);margin:0 auto;padding:0 var(--gutter);display:grid;gap:16px 48px;grid-template-columns:1fr}
.serv__intro{max-width:40ch;color:var(--gris)}
.serv__ctrl{display:none}
@media (min-width:900px){
  .serv__cab{grid-template-columns:1fr auto;align-items:end}
  .serv__intro{grid-column:1}
  .serv__ctrl{display:flex;align-items:center;gap:16px;grid-column:2;grid-row:1/3;align-self:end}
}
.flecha{width:52px;height:52px;display:grid;place-items:center;border:1px solid var(--tinta);border-radius:2px;transition:background-color 200ms ease,color 200ms ease,transform 160ms var(--ease-out),opacity 200ms ease}
.flecha svg{width:22px;height:22px}
.flecha:active{transform:scale(.95)}
.flecha:disabled{opacity:.3;cursor:default}
@media (hover:hover) and (pointer:fine){.flecha:not(:disabled):hover{background:var(--tinta);color:var(--hueso)}}
.serv__cont{font-size:.9rem;font-weight:560;font-stretch:112%;font-variant-numeric:tabular-nums;min-width:3.5em;text-align:center}

.serv__pista{display:flex;gap:12px;margin-top:clamp(32px,5vw,56px);padding:0 var(--gutter);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--gutter);overscroll-behavior-x:contain;scrollbar-width:none;outline-offset:-2px}
.serv__pista::-webkit-scrollbar{display:none}
@media (min-width:1336px){.serv__pista{padding:0 calc((100vw - var(--max))/2 + var(--gutter));scroll-padding:0 calc((100vw - var(--max))/2 + var(--gutter))}}
.sv{position:relative;flex:none;width:86%;scroll-snap-align:start;display:grid;grid-template-rows:auto auto;background:var(--papel);border-radius:2px;overflow:hidden;padding:clamp(56px,9vw,120px) 20px 24px}
@media (min-width:900px){.sv{width:calc(min(100vw,var(--max)) - 2*var(--gutter));grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-rows:none;gap:56px;align-items:end;padding:clamp(96px,10vw,150px) 56px 56px}}
.sv__gig{position:absolute;top:clamp(10px,2vw,22px);left:16px;z-index:0;white-space:nowrap;font-size:clamp(3.4rem,13vw,11.5rem);font-weight:800;font-stretch:125%;line-height:1;letter-spacing:-.04em;color:var(--cobalto);pointer-events:none;transition:transform 900ms var(--ease-out),opacity 600ms ease}
.js .sv:not([data-activo]) .sv__gig{transform:translateX(6%);opacity:0}
.sv__vis{position:relative;z-index:1;min-height:0}
.sv__info{position:relative;z-index:1;display:grid;gap:14px;margin-top:24px}
@media (min-width:900px){.sv__info{margin-top:0;padding-bottom:4px}}
.sv__info>p:first-of-type{color:var(--tinta-2);max-width:42ch}
.sv__info ul{display:grid;gap:0;border-top:1px solid var(--linea)}
.sv__info li{padding:10px 0;border-bottom:1px solid var(--linea);font-size:.95rem;font-weight:500}
.precio{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;margin-top:6px;font-size:.95rem;color:var(--gris);font-weight:520}
.precio b{font-size:clamp(2rem,3.6vw,2.8rem);font-weight:680;font-stretch:118%;color:var(--tinta);letter-spacing:-.02em;line-height:1}

.sv__vis img,.sv__vis video{border-radius:2px}
.sv__vis--par{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:start}
.sv__vis--par img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 25%}
.sv__vis--par img:last-child{margin-top:18%}
.sv__vis--video video{width:100%;aspect-ratio:1;object-fit:cover;background:var(--tinta);max-width:460px}
.sv__vis--web,.sv__vis--tienda{background:var(--hueso);border:1px solid var(--linea);border-radius:4px;overflow:hidden}
.nav-falsa{display:flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-bottom:1px solid var(--linea);font-size:.75rem;color:var(--gris)}
.nav-falsa i{width:8px;height:8px;border-radius:50%;background:var(--linea)}
.nav-falsa span{margin-left:10px}
.web-falsa{position:relative;aspect-ratio:16/10;overflow:hidden}
.web-falsa img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;border-radius:0}
.web-falsa div{position:absolute;left:0;bottom:0;display:grid;gap:10px;padding:clamp(14px,3vw,28px);color:#fff;max-width:80%}
.web-falsa b{font-size:clamp(1.2rem,2.8vw,2.2rem);font-weight:680;font-stretch:118%;line-height:1;letter-spacing:-.02em;text-shadow:0 1px 18px rgba(0,0,0,.45)}
.web-falsa span{justify-self:start;padding:8px 12px;background:var(--hueso);color:var(--tinta);font-size:.78rem;font-weight:600;border-radius:2px}
.tienda-falsa{display:grid;grid-template-columns:1.3fr 1fr;gap:10px;padding:10px;aspect-ratio:16/10}
.tienda-falsa figure{display:flex;flex-direction:column;min-height:0}
.tienda-falsa img{flex:1;min-height:0;width:100%;object-fit:cover;object-position:50% 40%}
.tienda-falsa figcaption{display:flex;justify-content:space-between;padding-top:8px;font-size:.8rem;font-weight:560}
.tienda-falsa__carro{justify-content:flex-end;gap:6px;padding:14px;border:1px solid var(--linea);border-radius:2px;font-size:.8rem}
.tienda-falsa__carro span{font-weight:640;font-stretch:112%;font-size:1rem}
.tienda-falsa__carro b{font-weight:480;color:var(--gris)}
.tienda-falsa__carro em{margin-top:6px;padding:10px;text-align:center;font-style:normal;font-weight:620;background:var(--tinta);color:var(--hueso);border-radius:2px}
.sv__nota{position:absolute;right:8px;top:4px;padding:3px 8px;font-size:.75rem;font-weight:560;background:rgba(247,246,243,.92);color:var(--gris);border-radius:2px}
.web-real{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:0!important}
.sv__vis--tienda{position:relative}
.sv__vis--tienda .sv__nota{top:38px}
.sv__vis--empaque{display:grid;place-items:center;background:#E3DED3;border-radius:2px;aspect-ratio:4/3;overflow:hidden}
.sv__vis--empaque img{height:100%;width:auto;object-fit:contain}
.sv__vis--app{display:flex;justify-content:center}
.sv__vis--app img{width:min(240px,60%);border:6px solid var(--tinta);border-radius:22px;background:var(--tinta)}
.sv__vis--marca{display:grid;place-items:center;aspect-ratio:4/3;background:var(--cobalto);color:var(--hueso);border-radius:2px;position:relative}
.sv__vis--marca svg{width:46%}
.sv__vis--marca span{position:absolute;left:14px;bottom:12px;font-size:.75rem;font-weight:560;font-stretch:112%;letter-spacing:.04em;opacity:.8}

/* revelado de visuales del carrusel */
.js .sv__vis{clip-path:inset(0 0 0 0);transition:clip-path 900ms var(--ease-out)}
.js .sv:not([data-visto]) .sv__vis{clip-path:inset(100% 0 0 0)}

.serv__puntos{display:flex;justify-content:center;gap:0;margin-top:20px}
.serv__puntos button{width:44px;height:44px;display:grid;place-items:center}
.serv__puntos button::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--linea);transition:background-color 200ms ease,transform 200ms var(--ease-out)}
.serv__puntos button[aria-current="true"]::before{background:var(--cobalto);transform:scale(1.25)}

/* casos */
.casos{padding:clamp(64px,10vw,140px) 0;background:var(--hueso);border-top:1px solid var(--linea)}
.casos__cab{max-width:var(--max);margin:0 auto;padding:0 var(--gutter);display:grid;gap:16px}
.casos__cab p{color:var(--gris);max-width:44ch}
.casos__lista{max-width:var(--max);margin:clamp(32px,5vw,56px) auto 0;padding:0 var(--gutter)}
.caso{border-top:1px solid var(--linea)}
.caso:last-child{border-bottom:1px solid var(--linea)}
.caso__btn{width:100%;display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:18px 0;text-align:left;-webkit-tap-highlight-color:transparent}
.caso__nom{font-size:clamp(2rem,9vw,3rem);font-weight:720;font-stretch:125%;line-height:1;letter-spacing:-.03em;transition:color 200ms ease}
.caso__tipo{flex:none;font-size:.85rem;font-weight:540;color:var(--gris)}
.caso[data-activo] .caso__nom{color:var(--cobalto)}
.caso__det{display:grid;grid-template-rows:0fr;transition:grid-template-rows 420ms var(--ease-out)}
.caso[data-activo] .caso__det{grid-template-rows:1fr}
.caso:not([data-activo]) .caso__det{transition:none}
.caso{scroll-margin-top:calc(var(--cab) + 8px)}
.caso__det>div{min-height:0;overflow:hidden}
.caso__det img,.caso__det video{width:min(100%,360px);aspect-ratio:4/5;object-fit:cover;object-position:50% 25%;border-radius:2px;background:var(--tinta)}
.casos__mas{max-width:var(--max);margin:28px auto 0;padding:0 var(--gutter);color:var(--gris);font-size:.95rem}
.casos__mas span{font-weight:640;color:var(--tinta)}
.caso__det p{display:grid;gap:4px;padding:14px 0 24px;max-width:40ch;color:var(--tinta-2)}
.caso__det p span:first-child{font-weight:640;font-stretch:112%;color:var(--tinta)}

@media (min-width:900px){
  .casos__lista{display:flex;gap:8px;width:100%;height:clamp(520px,72vh,720px)}
  .caso,.caso:last-child{position:relative;flex:1 1 0%;min-width:clamp(64px,6vw,96px);border:0;background:var(--papel);border-radius:2px;overflow:hidden;transition:flex-grow 640ms var(--ease-io)}
  .caso[data-activo]{flex-grow:4.6}
  .caso__btn:focus-visible{outline:2px solid var(--hueso);outline-offset:-6px;box-shadow:inset 0 0 0 8px var(--cobalto)}
  .caso__btn{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;padding:20px 18px}
  .caso__nom{writing-mode:vertical-rl;transform:rotate(180deg);font-size:clamp(2.1rem,3.2vw,3.5rem);white-space:nowrap;order:2;color:var(--tinta)}
  .caso__tipo{order:1;writing-mode:vertical-rl;transform:rotate(180deg)}
  .caso[data-activo] .caso__nom,.caso[data-activo] .caso__tipo{color:var(--hueso)}
  .caso[data-activo] .caso__tipo{writing-mode:horizontal-tb;transform:none}
  .caso__det,.caso[data-activo] .caso__det{position:absolute;inset:0;z-index:1;display:block;transition:none}
  .caso__det>div{height:100%}
  .caso__det img,.caso__det video{width:100%;max-width:none;height:100%;aspect-ratio:auto;border-radius:0;opacity:0;transform:scale(1.06);transition:opacity 400ms ease,transform 900ms var(--ease-out)}
  .caso__det::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(18,18,18,.82),rgba(18,18,18,.1) 55%,rgba(18,18,18,.35));opacity:0;transition:opacity 400ms ease}
  .caso__det p{position:absolute;right:20px;bottom:18px;left:120px;z-index:2;padding:0;color:var(--hueso);opacity:0;transform:translateY(10px);transition:opacity 300ms ease,transform 400ms var(--ease-out)}
  .caso__det p span:first-child{color:var(--hueso)}
  .caso[data-activo] .caso__det img,.caso[data-activo] .caso__det video{opacity:1;transform:scale(1)}
  .caso[data-activo] .caso__det::after{opacity:1}
  .caso[data-activo] .caso__det p{opacity:1;transform:none;transition-delay:260ms}
}

/* resultados */
.res{padding:clamp(64px,10vw,140px) var(--gutter);border-top:1px solid var(--linea)}
.res>*{max-width:calc(var(--max) - 2*var(--gutter));margin-left:auto;margin-right:auto}
.res__cab{display:grid;gap:16px}
.res__cab p{color:var(--gris);max-width:44ch}
.res__lista{margin-top:clamp(32px,5vw,64px)}
.rc{display:grid;gap:14px;padding:clamp(28px,4vw,44px) 0;border-top:1px solid var(--linea)}
.rc:last-child{border-bottom:1px solid var(--linea)}
.rc__quien h3{font-size:clamp(1.35rem,2.2vw,1.7rem);font-weight:640;font-stretch:118%;letter-spacing:-.015em;line-height:1.05}
.rc__quien p{color:var(--gris);font-size:.92rem;margin-top:4px}
.rc__num{display:grid;gap:6px}
.rc__num b{font-size:clamp(3rem,7vw,5.6rem);font-weight:720;font-stretch:125%;line-height:.9;letter-spacing:-.04em;color:var(--cobalto);font-variant-numeric:tabular-nums}
.rc__num span{max-width:26ch;font-weight:540;color:var(--tinta-2)}
.rc__det>p{color:var(--tinta-2);max-width:40ch}
.rc__det ul{margin-top:10px;display:grid;gap:4px;font-size:.92rem;color:var(--gris)}
.rc__det li{display:flex;gap:10px;align-items:baseline}
.rc__det li::before{content:"";flex:none;width:12px;height:2px;background:var(--cobalto);transform:translateY(-4px) rotate(-22deg)}
@media (min-width:900px){.rc{grid-template-columns:minmax(0,3fr) minmax(0,5fr) minmax(0,4fr);gap:40px;align-items:start}}

/* por qué */
.porque{padding:clamp(72px,11vw,160px) var(--gutter);background:var(--tinta);color:var(--hueso)}
.porque>*{max-width:calc(var(--max) - 2*var(--gutter));margin-left:auto;margin-right:auto}
.porque .t2{color:var(--hueso)}
.porque__lista{margin-top:clamp(36px,6vw,80px)}
.porque__lista li{display:grid;gap:12px;padding:clamp(28px,4vw,48px) 0;border-top:1px solid var(--linea-clara);grid-template-columns:1fr}
.porque__lista li:last-child{border-bottom:1px solid var(--linea-clara)}
.porque__lista h3{font-size:clamp(1.75rem,4.6vw,3.8rem);font-weight:640;font-stretch:122%;line-height:1;letter-spacing:-.025em;text-wrap:balance}
.porque__lista p{color:var(--gris-claro);max-width:44ch}
.trazo{width:56px;height:34px;overflow:visible}
.trazo line{stroke:var(--cobalto);stroke-width:6;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 900ms var(--ease-out) 150ms}
@media (min-width:900px){.porque__lista li{grid-template-columns:80px minmax(0,7fr) minmax(0,4fr);gap:32px;align-items:start}.porque__lista p{padding-top:.4em}}
.js [data-rev]{transition:opacity 700ms ease,transform 900ms var(--ease-out)}
.js [data-rev]:not([data-visto]){opacity:0;transform:translateY(28px)}
.js [data-rev]:not([data-visto]) .trazo line{stroke-dashoffset:1}

/* contacto */
.contacto{background:var(--cobalto);color:var(--hueso);overflow:hidden}
.letrero{padding:clamp(28px,5vw,56px) 0 0;overflow:hidden}
.letrero__pista{display:flex;align-items:center;gap:clamp(20px,3vw,48px);width:max-content;animation:corre-letrero 26s linear infinite;padding-right:clamp(20px,3vw,48px)}
@keyframes corre-letrero{to{transform:translateX(-50%)}}
.letrero span{font-size:clamp(4.6rem,16vw,15rem);font-weight:780;font-stretch:125%;line-height:.9;letter-spacing:-.045em;text-transform:uppercase}
.letrero svg{flex:none;width:clamp(64px,10vw,150px);height:auto}
.contacto__cuerpo{max-width:var(--max);margin:0 auto;padding:clamp(36px,6vw,72px) var(--gutter) clamp(64px,9vw,120px);display:grid;gap:18px}
.contacto .t2{color:var(--hueso);max-width:16ch}
.contacto__cuerpo>p{max-width:46ch;color:rgba(247,246,243,.86)}
.contacto__acc{display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px;margin-top:12px}
.enlace--claro{color:var(--hueso)}
.form{display:grid;gap:14px;max-width:760px;margin-top:12px}
.form__fila{display:grid;gap:14px}
@media (min-width:700px){.form__fila{grid-template-columns:1fr 1fr}}
.campo{display:grid;gap:6px;font-size:.88rem;font-weight:600;font-stretch:112%}
.campo input,.campo select,.campo textarea{width:100%;min-height:52px;padding:12px 14px;font:inherit;font-size:1rem;font-weight:450;font-stretch:100%;color:var(--tinta);background:var(--hueso);border:1px solid transparent;border-radius:2px;transition:border-color 160ms ease,box-shadow 160ms ease}
.campo textarea{min-height:120px;resize:vertical;line-height:1.5}
.campo select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23121212' stroke-width='2'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:18px;padding-right:40px}
.campo input:focus-visible,.campo select:focus-visible,.campo textarea:focus-visible{outline:none;box-shadow:0 0 0 3px var(--tinta)}
.campo ::placeholder{color:var(--gris)}
.trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form__acc{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin-top:6px}
.form__acc .boton:disabled{opacity:.7;cursor:progress}
.form__alt{font-size:.92rem;color:rgba(247,246,243,.86)}
.form__estado{min-height:1.5em;font-weight:600}
.form__estado[data-tipo="error"]{color:var(--hueso);background:var(--tinta);padding:10px 14px;border-radius:2px;justify-self:start}
.form__estado:empty{display:none}
.contacto :focus-visible{outline-color:var(--hueso)}

/* pie */
.pie{display:grid;gap:12px;padding:32px var(--gutter) calc(32px + env(safe-area-inset-bottom));background:var(--tinta);color:var(--gris-claro);font-size:.88rem}
.pie__logo{display:flex;align-items:center;gap:10px;min-height:44px;justify-self:start;color:var(--hueso);text-decoration:none;font-weight:620;font-stretch:112%}
.pie__logo svg{width:34px;color:var(--cobalto)}
@media (min-width:900px){.pie{grid-template-columns:auto 1fr auto;align-items:center;gap:32px}.pie p:first-of-type{text-align:center}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important;transition-delay:0s!important}
  .tira{overflow-x:auto}
  .tira__pista,.letrero__pista{animation:none!important}
}
@media (min-width:1100px){
  .contacto__cuerpo{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:64px;align-items:start}
  .contacto__cuerpo>.t2,.contacto__cuerpo>p{grid-column:1}
  .contacto__cuerpo>.form{grid-column:2;grid-row:1/span 3;margin-top:0;max-width:none}
}