/* Sound Shine Miami · v18 · logo aprobado «Eclipse Neón»: negro, blanco, rosa Miami y el magenta del neón, una sola familia (Montserrat) */
@font-face{font-family:"Montserrat";src:url("fonts/Montserrat-Variable.woff2") format("woff2");font-weight:300 800;font-style:normal;font-display:swap}

:root{
  --bg:#000;
  --fg:#fff;
  --mute:rgba(255,255,255,.58);
  --faint:rgba(255,255,255,.47);   /* v23: 4,7:1 sobre negro (WCAG AA en texto pequeño) */
  --line:rgba(255,255,255,.13);
  --pink:#f5007c;          /* MIAMI */
  --neon:#fa00a8;          /* el aro */
  /* la luz del aro, solo como línea de horizonte */
  --horizon:linear-gradient(90deg,rgba(245,0,124,0),var(--pink) 30%,var(--neon) 70%,rgba(250,0,168,0));
  --ease:cubic-bezier(.16,1,.3,1);
  --gx:max(clamp(20px,4.2vw,72px),env(safe-area-inset-left),env(safe-area-inset-right));
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{background:var(--bg);color:var(--fg);font-family:"Montserrat",system-ui,sans-serif;font-size:16px;line-height:1.5;overflow-x:clip}
body.intro,body.locked{overflow:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;text-align:inherit}
img{display:block;max-width:100%}
ul,ol{list-style:none}
::selection{background:var(--pink);color:#fff}
[hidden]{display:none!important}
:focus-visible{outline:1px solid var(--pink);outline-offset:4px}

.mono{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;line-height:1.45;font-variant-numeric:tabular-nums}
.mute{color:var(--mute)}
.skip{position:fixed;left:16px;top:-60px;z-index:300;background:var(--fg);color:var(--bg);padding:10px 16px;border-radius:999px;font-size:14px}
.skip:focus{top:16px}
.grain{position:fixed;inset:0;z-index:150;pointer-events:none;opacity:.055;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- botones ---------- */
.btn{display:inline-flex;align-items:center;gap:14px;height:52px;padding:0 26px;border-radius:999px;font-family:"Montserrat",system-ui,sans-serif;font-size:14px;font-weight:600;letter-spacing:0;text-transform:none;white-space:nowrap;transition:background .5s var(--ease),color .5s var(--ease),border-color .5s var(--ease)}
.btn .ar{display:inline-block;transition:transform .6s var(--ease)}
.btn:hover .ar{transform:translateX(4px)}
.btn.solid{background:var(--pink);color:var(--bg)}
.btn.solid:hover{background:var(--fg);color:var(--bg)}
.btn.ghost{border:1px solid rgba(255,255,255,.28)}
.btn.ghost:hover{border-color:var(--fg);background:rgba(255,255,255,.06)}
.btn.sm{height:40px;padding:0 18px}

/* ---------- revelados ---------- */
.ln{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.ln>span{display:block;transform:translate3d(0,110%,0);transition:transform 1.4s var(--ease);transition-delay:calc(var(--d,0) * 90ms)}
.in .ln>span,.ln.in>span{transform:none}
.rv{opacity:0;transform:translate3d(0,28px,0);transition:opacity 1.2s var(--ease),transform 1.4s var(--ease);transition-delay:calc(var(--d,0) * 90ms)}
.in .rv,.rv.in{opacity:1;transform:none}

/* ---------- cursor ---------- */
.cursor{display:none}
@media (hover:hover) and (pointer:fine){
  .cursor{display:block;position:fixed;left:0;top:0;z-index:190;pointer-events:none}
  .c-dot{position:absolute;left:-3px;top:-3px;width:6px;height:6px;border-radius:50%;background:var(--fg)}
  .c-ring{position:absolute;left:-22px;top:-22px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.55);display:grid;place-items:center;transform:scale(.5);opacity:0;transition:transform .5s var(--ease),opacity .4s,width .5s var(--ease),height .5s var(--ease),left .5s var(--ease),top .5s var(--ease)}
  .c-ring span{font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--fg);opacity:0;transition:opacity .3s}
  .cursor.label .c-ring{width:84px;height:84px;left:-42px;top:-42px;transform:none;opacity:1;background:var(--fg)}
  .cursor.label .c-ring span{opacity:1;color:var(--bg)}
  .cursor.label .c-dot{opacity:0}
  .cursor.link .c-ring{transform:none;opacity:1}
}

/* ---------- cabecera ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px var(--gx);transition:background .6s var(--ease),padding .6s var(--ease),transform .7s var(--ease)}
.nav .logo img{height:28px;width:auto}
.nav .links{display:flex;gap:clamp(20px,2.6vw,40px)}
.nav .links a{opacity:.7;transition:opacity .4s}
.nav .links a:hover{opacity:1}
.nav-r{display:flex;align-items:center;gap:22px}
.lang{display:flex;align-items:center;gap:8px;color:var(--faint)}
.lang a{transition:color .3s}
.lang a[aria-current]{color:var(--fg)}
.lang a:hover{color:var(--fg)}
.menu-btn{display:none}
.nav.solid{background:rgba(0,0,0,.9);padding-top:14px;padding-bottom:14px}
.nav.away{transform:translate3d(0,-110%,0)}
.menu{position:fixed;inset:0;z-index:90;background:var(--bg);display:flex;flex-direction:column;justify-content:space-between;padding:110px var(--gx) 40px;opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility 0s linear .5s}
.menu.open{opacity:1;visibility:visible;transition:opacity .5s var(--ease)}
.menu li a{display:block;font-size:min(clamp(40px,11vw,64px),12.5vh);font-weight:300;letter-spacing:-.045em;line-height:1.12}
.menu-foot{display:flex;flex-direction:column;gap:8px;color:var(--mute)}
@media (max-width:900px){
  .nav .links,.nav .btn.sm{display:none}
  .menu-btn{display:block;font:inherit;letter-spacing:inherit;text-transform:inherit}
  .nav .logo img{height:24px}
  .nav{padding:18px var(--gx)}
}

/* ---------- portada: intro, giro y giro con el scroll ---------- */
.hero{position:relative;height:230lvh}
.hero.stack{height:175lvh}
.h-stick{position:sticky;top:0;height:100lvh;min-height:520px;overflow:hidden;background:radial-gradient(ellipse 55% 60% at 50% 46%,#080306 0%,#000 68%)}
#sun{position:absolute;inset:0;width:100%;height:100%}
/* contador de la intro (000 → 100) bajo el aro; se apaga cuando entra el nombre */
.h-count{position:absolute;left:50%;bottom:clamp(84px,12lvh,124px);transform:translateX(-50%);font-size:12px;letter-spacing:.32em;color:var(--mute);transition:opacity .9s ease}
.words-in .h-count{opacity:0}
/* el logo aprobado partido en piezas (tools/marca.py): el aro es el del lienzo 3D, detrás del nombre */
.h-logo{position:absolute;left:var(--lx,8vw);top:var(--ly,30%);width:var(--lw,84vw);aspect-ratio:999.6/518.77;margin:0;pointer-events:none;transform-origin:50% 50%}
.hl{position:absolute;inset:0;display:block;will-change:transform,opacity}
.hl img{display:block;width:100%;height:100%;-webkit-user-drag:none;user-select:none}
.hl-n img{opacity:0;transform:scale(1.035);transition:opacity .9s ease,transform 1.6s var(--ease)}
.words-in .hl-n img{opacity:1;transform:none}
.hl-m img{opacity:0;transform:translate3d(0,3%,0);transition:opacity 1s ease .4s,transform 1.4s var(--ease) .4s}
.words-in .hl-m img{opacity:1;transform:none}
.hl-r{display:none}
.no-gl .hl-r{display:block}
.h-copy{position:absolute;left:50%;bottom:calc(9lvh + 40px);width:min(600px,calc(100vw - 2 * var(--gx)));transform:translate3d(-50%,0,0);text-align:center;opacity:0;pointer-events:none;will-change:transform,opacity}
.h-copy.live{pointer-events:auto}
/* v17: en vertical el texto entra al terminar la intro y se queda */
.stack .h-copy{transition:opacity 1.2s ease .55s,transform 1.4s var(--ease) .55s}
.side-h{font-weight:300;font-size:clamp(36px,min(4.6vw,7.4lvh),70px);line-height:.95;letter-spacing:-.05em}
.side-h b{font-weight:700}
.side-h i{font-style:normal;color:var(--pink)}
.h-copy p{margin:20px auto 0;font-size:16px;line-height:1.6;color:rgba(255,255,255,.72);max-width:470px}
.h-copy .acts{display:flex;gap:10px;justify-content:center;margin-top:26px;flex-wrap:wrap}
.h-foot{position:absolute;left:var(--gx);right:var(--gx);bottom:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:16px 0 20px;opacity:0;transform:translate3d(0,12px,0);transition:opacity 1.2s var(--ease) .5s,transform 1.4s var(--ease) .5s}
.words-in .h-foot{opacity:1;transform:none}
.h-foot::before{content:"";position:absolute;left:calc(var(--gx) * -1);right:calc(var(--gx) * -1);top:0;height:2px;background:var(--horizon);box-shadow:0 0 36px rgba(250,0,168,.4)}
.h-foot::after{content:"";position:absolute;left:calc(var(--gx) * -1);right:calc(var(--gx) * -1);top:2px;bottom:0;background:linear-gradient(180deg,rgba(245,0,124,.1),rgba(250,0,168,0));pointer-events:none}
.cue{display:flex;align-items:center;gap:12px}
.cue i{width:1px;height:26px;background:var(--line);position:relative;overflow:hidden}
.cue i::after{content:"";position:absolute;left:0;top:-40%;width:1px;height:40%;background:var(--fg);animation:cue 2.4s var(--ease) infinite}
@keyframes cue{to{top:110%}}
.paused .cue i::after{animation-play-state:paused}
.bar-r{display:flex;align-items:center;justify-content:flex-end;gap:26px}
.motion-btn{font:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--mute);transition:color .3s}
.motion-btn:hover{color:var(--fg)}
.sound{display:inline-flex;align-items:center;gap:10px;font:inherit;letter-spacing:inherit;text-transform:inherit}
/* v26: the label is 16px tall; the touch area grows to 44px without moving anything */
.sound{position:relative}
.sound::after{content:"";position:absolute;inset:-14px -12px}
.eq{display:inline-flex;align-items:flex-end;gap:2px;height:12px}
.eq b{width:2px;height:30%;background:var(--fg);transition:height .3s}
.sound[aria-pressed="true"] .eq b{background:var(--pink);animation:eq .9s ease-in-out infinite alternate}
.sound[aria-pressed="true"] .eq b:nth-child(2){animation-delay:-.3s}
.sound[aria-pressed="true"] .eq b:nth-child(3){animation-delay:-.55s}
.sound[aria-pressed="true"] .eq b:nth-child(4){animation-delay:-.15s}
@keyframes eq{from{height:20%}to{height:100%}}
.paused .sound .eq b{animation-play-state:paused}
/* la cabecera entra al terminar la intro */
.nav{transition:background .6s var(--ease),padding .6s var(--ease),transform .7s var(--ease),opacity 1.2s var(--ease)}
.intro .nav{opacity:0;transform:translate3d(0,-14px,0)}
@media (max-width:900px){
  .hide-m{display:none!important}
  .h-foot{grid-template-columns:auto 1fr;padding:12px 0 16px}
  .h-foot>span:first-child,.h-foot .motion-btn{display:none}
  .h-copy{bottom:calc(7lvh + 40px)}
  .h-copy p{font-size:15px;margin-top:14px}
  .h-copy .acts{margin-top:20px}
}
@media (max-height:720px){.h-copy p{display:none}.h-copy .acts{margin-top:18px}}
/* v15: en vertical el texto ya no va pegado abajo, así que el párrafo cabe hasta 640 px de alto */
@media (max-height:720px) and (min-height:641px) and (orientation:portrait){.stack .h-copy p{display:block}.stack .h-copy .acts{margin-top:20px}}


/* ---------- v29 · hero de venta: entra solo al terminar la intro, en la misma pantalla ---------- */
.hero,.hero.stack{height:100lvh;min-height:600px}
.hs{position:absolute;left:var(--gx);right:var(--gx);top:clamp(86px,11lvh,120px);bottom:clamp(66px,9lvh,86px);z-index:2;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;column-gap:clamp(24px,4vw,72px);pointer-events:none}
.sale-in .hs{pointer-events:auto}
.hs-copy{max-width:660px}
.hs-copy>*{opacity:0;transform:translate3d(0,22px,0);transition:opacity .9s ease,transform 1.1s var(--ease)}
.sale-in .hs-copy>*{opacity:1;transform:none}
.sale-in .hs-copy>:nth-child(2){transition-delay:.07s}
.sale-in .hs-copy>:nth-child(3){transition-delay:.14s}
.sale-in .hs-copy>:nth-child(4){transition-delay:.21s}
.sale-in .hs-copy>:nth-child(5){transition-delay:.28s}
.sale-in .hs-copy>:nth-child(6){transition-delay:.35s}
.sale-in .hs-copy>:nth-child(7){transition-delay:.42s}
.hs-eye{display:inline-flex;align-items:center;gap:10px;color:var(--mute)}
.hs-eye i{width:7px;height:7px;border-radius:50%;background:var(--pink);box-shadow:0 0 14px var(--pink)}
.hs-h{margin:16px 0 0;font-weight:300;font-size:clamp(34px,min(4.2vw,6.9lvh),66px);line-height:1;letter-spacing:-.045em}
.hs-h b{display:block;font-weight:700}
.hs-p{margin:18px 0 0;max-width:600px;font-size:16px;line-height:1.6;color:rgba(255,255,255,.72)}
.hs-q{margin-top:24px}
.hs-ql{color:var(--mute)}
.hs-chips{margin:12px -6px -8px 0;font-size:0;text-wrap:balance}
.hs-chips button{display:inline-block;margin:0 6px 8px 0;font:inherit;font-size:14px;font-weight:500;line-height:1;padding:10px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.03);color:rgba(255,255,255,.84);cursor:pointer;transition:background .35s var(--ease),border-color .35s var(--ease),color .35s var(--ease)}
.hs-chips button:hover{border-color:rgba(255,255,255,.55);color:#fff}
.hs-chips button[aria-pressed="true"]{background:rgba(245,0,124,.18);border-color:var(--pink);color:#fff}
.hs-chips button[aria-pressed="true"]::before{content:"✓ ";color:var(--pink)}
.hs-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.hs-trust{display:flex;align-items:center;gap:20px;margin-top:28px;padding-top:20px;border-top:1px solid var(--line)}
.hs-tl{flex:none;color:var(--faint)}
.hs-logos{display:flex;align-items:center;flex-wrap:wrap;gap:clamp(10px,1vw,16px);margin:0;padding:0;list-style:none}
.hs-logos img{display:block;width:auto;height:14px;opacity:.7;user-select:none;-webkit-user-drag:none}
/* v35: siete marcas (las mismas de la sección de marcas); tamaños por marca para que pesen igual */
.hs-logos .lg-waves img{height:19px}.hs-logos .lg-jbl img{height:24px}.hs-logos .lg-skb img{height:20px}.hs-logos .lg-rfone img{height:14px}
.hs-logos .lg-directout img{height:11px}.hs-logos .lg-voxa img{height:10px}
/* entre 901 y 1400 px no caben la etiqueta y las siete marcas en una línea: la etiqueta se va (el «Distribuidor autorizado» ya está arriba del titular) */
@media (min-width:901px) and (max-width:1400px){.hs-tl{display:none}}
.hs-proof{display:flex;flex-wrap:wrap;gap:12px clamp(18px,2.6vw,40px);margin:16px 0 0;padding:0;list-style:none}
.hs-proof li{display:flex;align-items:baseline;gap:8px}
.hs-proof b{color:var(--fg);font-weight:600}
.hs-proof span{color:var(--faint)}
/* los productos nuevos de Shure, dentro del halo del aro */
.hs-stage{position:relative;height:100%;min-height:260px;will-change:transform}
.hs-stage::after{content:"";position:absolute;left:8%;right:8%;bottom:8%;height:14%;border-radius:50%;background:radial-gradient(ellipse at center,rgba(245,0,124,.28),rgba(245,0,124,0) 70%);filter:blur(10px);opacity:0;transition:opacity 1.4s ease .3s;pointer-events:none}
.sale-in .hs-stage::after{opacity:0}
.hs-pr{position:absolute;bottom:15%;display:block;opacity:0;transform:translate3d(0,46px,0) scale(.96);transition:opacity 1s ease,transform 1.5s var(--ease)}
.sale-in .hs-pr{opacity:1;transform:none}
.sale-in .hs-p1{transition-delay:.25s}.sale-in .hs-p2{transition-delay:.1s}.sale-in .hs-p3{transition-delay:.4s}
.hs-pr img{display:block;width:auto;height:100%;filter:drop-shadow(0 28px 34px rgba(0,0,0,.65));transition:transform .8s var(--ease)}
.hs-pr:hover img{transform:translate3d(0,-6px,0)}
.hs-p1{left:16%;height:40%}
.hs-p2{left:44%;height:70%}
.hs-p3{left:64%;height:47%}
.hs-tag{position:absolute;left:50%;top:100%;display:flex;flex-direction:column;align-items:center;gap:3px;margin-top:12px;white-space:nowrap;transform:translateX(-50%);font-size:10px}
.hs-tag b{color:var(--fg);font-weight:600}
.hs-tag span{color:var(--faint)}
.hs-tag em{font-style:normal;color:var(--pink);opacity:0;transform:translate3d(0,-4px,0);transition:opacity .4s ease,transform .5s var(--ease)}
.hs-pr:hover .hs-tag em,.hs-pr:focus-visible .hs-tag em{opacity:1;transform:none}
/* sin WebGL: un aro de neón en CSS detrás de los productos; el aro del logo se apaga con el hero */
.no-gl .hs-stage::before{content:"";position:absolute;left:50%;top:46%;width:min(86%,80lvh);aspect-ratio:1;border-radius:50%;border:2px solid var(--pink);box-shadow:0 0 40px rgba(245,0,124,.5),inset 0 0 40px rgba(245,0,124,.3);transform:translate(-50%,-50%);opacity:0;transition:opacity 1.2s ease}
.no-gl.sale-in .hs-stage::before{opacity:0}

@media (max-width:1340px){.hs-chips button{font-size:13px;padding:9px 11px}}
/* v34: con el texto más largo, la fila de datos solo entra en pantallas de más de 940 px de alto */
@media (max-height:940px) and (min-aspect-ratio:1/1){.hs-proof{display:none}}
@media (max-height:800px) and (min-aspect-ratio:1/1){.hs-p{display:none}.hs-q{margin-top:20px}.hs-trust{margin-top:22px;padding-top:16px}}
@media (max-height:640px) and (min-aspect-ratio:1/1){.hs-trust{display:none}}
/* en vertical: los productos arriba y la venta debajo */
.stack .hs{top:clamp(62px,8lvh,80px);bottom:clamp(64px,8.5lvh,76px);grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;row-gap:6px;align-items:end}
.stack .hs-stage{order:-1;min-height:140px}
.stack .hs-copy{max-width:none}
.stack .hs-h{margin-top:10px;font-size:clamp(28px,8vw,40px)}
.stack .hs-p{display:none}
.stack .hs-q{margin-top:16px}
.stack .hs-chips{margin-top:10px;margin-bottom:-6px}.stack .hs-chips button{margin:0 6px 6px 0}
.stack .hs-chips button{font-size:13px;padding:8px 12px}
.stack .hs-acts{margin-top:16px}
.stack .hs-acts .btn{flex:1 1 auto;justify-content:center;height:48px;padding:0 18px}
.stack .hs-trust{gap:12px;margin-top:16px;padding-top:14px}
.stack .hs-tl,.stack .hs-proof{display:none}
.stack .hs-logos{gap:9px;justify-content:space-between}
.stack .hs-logos img{height:12px}
.stack .hs-logos .lg-waves img{height:15px}.stack .hs-logos .lg-jbl img{height:19px}
.stack .hs-logos .lg-skb img{height:16px}.stack .hs-logos .lg-rfone img{height:11px}
.stack .hs-logos .lg-directout img{height:9px}.stack .hs-logos .lg-voxa img{height:9px}
@media (max-width:380px){.stack .hs-logos img{height:11px}.stack .hs-logos .lg-directout img,.stack .hs-logos .lg-voxa img{height:8px}}
.stack .hs-tag{margin-top:6px;font-size:9px}
.stack .hs-tag span{display:none}
/* v36: la fila de logos se queda en los iPhone con las barras de Safari (unos 660 px de alto); solo se quita por debajo de 600 px */
@media (max-height:600px) and (orientation:portrait){.stack .hs-trust{display:none}}
@media (max-height:730px) and (orientation:portrait){.stack .hs-trust{margin-top:10px;padding-top:10px}.stack .hs-ql{display:none}.stack .hs-chips{margin-top:0}.stack .hs-acts .btn.ghost{display:none}.stack .hs-stage{min-height:110px}.stack .hs-h{font-size:clamp(26px,7.4vw,34px)}.stack .hs-chips button{padding:7px 11px}}
/* tableta en vertical: el texto y los botones a su tamaño normal */
@media (max-width:400px){.stack .hs-chips button{font-size:12.5px;padding:8px 10px}}
@media (max-width:365px){.stack .hs-chips button{font-size:12px;padding:8px 9px}}
@media (min-width:700px) and (orientation:portrait){.stack .hs-h{font-size:clamp(40px,6.4vw,58px)}.stack .hs-p{display:block;font-size:16px}.stack .hs-chips button{font-size:14px;padding:10px 15px}.stack .hs-acts .btn{flex:0 0 auto;height:52px;padding:0 26px}.stack .hs-tl{display:block}.stack .hs-logos img{height:15px}.stack .hs-logos .lg-waves img{height:19px}.stack .hs-logos .lg-jbl img{height:24px}.stack .hs-logos .lg-skb img{height:20px}.stack .hs-logos .lg-rfone img{height:14px}.stack .hs-logos .lg-directout img{height:12px}.stack .hs-logos .lg-voxa img{height:11px}.stack .hs-stage{max-height:46lvh}}

/* ---------- nosotros ---------- */
.about{padding:clamp(140px,24vh,240px) var(--gx) clamp(110px,16vh,170px);display:grid;grid-template-columns:minmax(150px,1fr) 3fr;gap:40px}
.statement{font-size:clamp(28px,3.4vw,54px);font-weight:300;line-height:1.14;letter-spacing:-.032em;max-width:1080px}
.statement .w{opacity:.36;transition:opacity .35s linear}
.statement .w.on{opacity:1}
.facts{grid-column:2;display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:clamp(70px,11vh,120px);padding-top:28px;border-top:1px solid var(--line)}
.facts b{display:block;font-weight:300;font-size:clamp(42px,4.6vw,76px);letter-spacing:-.05em;line-height:1;margin-bottom:14px;font-variant-numeric:tabular-nums}
@media (max-width:900px){.about{grid-template-columns:1fr;padding-top:clamp(84px,12vh,120px)}.facts{grid-column:1;grid-template-columns:repeat(2,1fr);row-gap:44px}}

/* ---------- mercados ---------- */
.marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(22px,3.4vw,44px) 0}
.track{display:flex;align-items:center;width:max-content;will-change:transform}
.track span{font-size:clamp(46px,7.4vw,124px);font-weight:300;letter-spacing:-.05em;line-height:1;padding:0 .3em;white-space:nowrap}
.track i{display:block;width:.16em;height:.16em;font-size:clamp(46px,7.4vw,124px);border-radius:50%;background:var(--pink);flex:none}

/* ---------- marcas ---------- */
.brands{padding:clamp(130px,20vh,220px) var(--gx) clamp(100px,14vh,160px)}
.sec-head{display:grid;grid-template-columns:minmax(150px,1fr) 3fr;gap:40px;align-items:start;margin-bottom:clamp(56px,9vh,96px)}
.h2{font-weight:300;font-size:clamp(38px,4.6vw,76px);line-height:.98;letter-spacing:-.05em}
.h2 b{font-weight:700}
.brand-list li{display:grid;grid-template-columns:minmax(150px,1fr) 2fr 1fr;gap:40px;align-items:baseline;padding:clamp(18px,2.4vw,30px) 0;border-top:1px solid var(--line)}
.brand-list li:last-child{border-bottom:1px solid var(--line)}
.brand-list .nm{font-size:clamp(34px,5vw,84px);font-weight:300;letter-spacing:-.05em;line-height:1;transition:transform .8s var(--ease)}
.brand-list .ct{text-align:right;transition:color .5s}
.brand-list .ct::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--pink);margin-right:12px;vertical-align:middle;transform:scale(0);transition:transform .5s var(--ease)}
.brand-list li:hover .nm{transform:translateX(18px)}
.brand-list li:hover .ct{color:var(--fg)}
.brand-list li:hover .ct::before{transform:none}
@media (max-width:900px){
  .sec-head{grid-template-columns:1fr;gap:20px}
  .brand-list li{grid-template-columns:36px 1fr;gap:12px}
  .brand-list .ct{grid-column:2;text-align:left;margin-top:6px}
}

/* ---------- destacado: la foto entra como un ecualizador ---------- */
.feat{position:relative;height:340lvh}
.feat .stick{position:sticky;top:0;height:100lvh;min-height:520px;overflow:hidden;background:var(--bg)}
.f-fallback{display:none}
.no-feat-gl .f-fallback{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%;opacity:0;transition:opacity 1.4s ease}
.no-feat-gl .feat.open .f-fallback{opacity:1}
.f-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.62) 30%,rgba(0,0,0,0) 58%),linear-gradient(0deg,rgba(0,0,0,.7) 0%,rgba(0,0,0,0) 30%);opacity:0;pointer-events:none}
.f-intro{position:absolute;z-index:2;left:var(--gx);top:clamp(96px,16lvh,150px);display:flex;flex-direction:column;gap:22px;pointer-events:none}
.f-intro .h2{font-size:clamp(44px,6.4vw,112px);line-height:.92}
.f-tags{position:absolute;inset:0;z-index:2;pointer-events:none}
.f-tag{position:absolute;left:0;top:0;display:flex;align-items:center;gap:12px;opacity:0;will-change:transform}
.f-tag i{position:relative;width:10px;height:10px;border-radius:50%;background:var(--pink);box-shadow:0 0 0 0 rgba(245,0,124,.5);flex:none;transform:scale(0);transition:transform .7s var(--ease);transition-delay:calc(var(--d) * 160ms)}
.f-tag i::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid rgba(245,0,124,.7);animation:ping 2.4s var(--ease) infinite}
.paused .f-tag i::after{animation-play-state:paused}
@keyframes ping{0%{transform:scale(.5);opacity:1}80%,100%{transform:scale(1.9);opacity:0}}
.f-tag em{font-style:normal;color:var(--fg);padding:7px 11px;border-radius:999px;background:rgba(0,0,0,.72);border:1px solid rgba(255,255,255,.16);white-space:nowrap;opacity:0;transform:translateX(-6px);transition:opacity .7s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--d) * 160ms + 120ms)}
.feat.tags .f-tag{opacity:1}
.feat.tags .f-tag i{transform:none}
.feat.tags .f-tag em{opacity:1;transform:none}
.f-copy{position:absolute;z-index:3;left:var(--gx);bottom:clamp(56px,11lvh,120px);max-width:560px}
.f-copy h3{font-weight:300;font-size:clamp(52px,min(7.2vw,13lvh),124px);line-height:.88;letter-spacing:-.055em;margin:22px 0 26px}
.f-copy h3 b{font-weight:700}
.f-copy p{font-size:16px;line-height:1.6;color:rgba(255,255,255,.8);max-width:440px}
.f-copy .acts{margin-top:28px}
.f-meter{position:absolute;z-index:3;right:var(--gx);bottom:clamp(56px,11lvh,120px);display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.f-meter #fSig{font-variant-numeric:tabular-nums;color:var(--fg)}
.f-meter i{display:block;width:200px;height:1px;background:var(--line);position:relative}
.f-meter b{position:absolute;inset:0;background:linear-gradient(90deg,var(--pink),var(--neon));transform-origin:left;transform:scaleX(0)}
@media (max-width:900px){
  .f-shade{background:linear-gradient(0deg,rgba(0,0,0,.96) 0%,rgba(0,0,0,.82) 46%,rgba(0,0,0,0) 74%)}
  .f-intro{top:118px}
  .f-intro .h2{font-size:clamp(40px,11vw,56px)}
  .f-copy{right:var(--gx);bottom:28px}
  .f-meter{top:76px;bottom:auto}
  .f-meter i{width:120px}
  .f-tag[data-u="0.47"],.f-tag[data-u="0.66"]{display:none}
}
@media (max-height:700px){.f-copy p{display:none}}

/* ---------- colección ---------- */
.coll{position:relative;height:calc(var(--n,11) * 62lvh + 100lvh)}
.coll .stick{position:sticky;top:0;height:100lvh;overflow:hidden;display:grid;grid-template-columns:minmax(220px,1fr) 1.5fr minmax(290px,1fr);align-items:center;gap:3vw;padding:0 var(--gx)}
.c-head{position:absolute;left:var(--gx);right:var(--gx);top:96px;display:flex;justify-content:space-between}
/* v33: pestañas por marca */
.c-head{align-items:center;gap:16px;z-index:2}
.c-tabs{display:flex;flex-wrap:wrap;gap:6px}
.c-tabs button{font:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--mute);min-height:38px;padding:0 14px;border:1px solid var(--line);border-radius:999px;transition:color .4s var(--ease),border-color .4s var(--ease),background .4s var(--ease)}
.c-tabs button:hover{color:var(--fg);border-color:rgba(255,255,255,.34)}
.c-tabs button.on{color:var(--bg);background:var(--fg);border-color:var(--fg)}
.c-tabs sup{font-size:8.5px;margin-left:5px;vertical-align:5px;opacity:.65}
.c-idx{display:grid;gap:2px}
.c-idx button{display:flex;gap:18px;align-items:baseline;padding:5px 0;font-size:15px;color:var(--faint);transition:color .6s var(--ease)}
.c-idx button span:last-child{transition:transform .6s var(--ease)}
.c-idx button:hover{color:var(--mute)}
.c-idx li.on button{color:var(--fg)}
.c-idx li.on button span:last-child{transform:translateX(8px)}
.c-stage{position:relative;height:min(64lvh,640px);perspective:1400px}
.c-beam{position:absolute;left:50%;top:-30%;width:120%;height:140%;transform:translateX(-50%);pointer-events:none;background:radial-gradient(ellipse 34% 50% at 50% 8%,rgba(255,255,255,.11),rgba(255,255,255,0) 70%)}
.c-beam::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,0) 78%);clip-path:polygon(43% 0,57% 0,76% 100%,24% 100%);filter:blur(30px)}
.c-floor{position:absolute;left:50%;bottom:-2%;width:70%;height:90px;transform:translateX(-50%);background:radial-gradient(ellipse at 50% 50%,rgba(245,0,124,.16),rgba(245,0,124,0) 64%);filter:blur(6px)}
.c-turn{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform}
.c-img{position:absolute;left:50%;top:50%;width:auto;height:auto;max-width:86%;max-height:92%;transform:translate3d(-50%,-44%,0) scale(.94);opacity:0;transition:opacity .9s var(--ease),transform 1.3s var(--ease)}
.c-img.wide{width:92%;max-height:none}
.c-img.on{opacity:1;transform:translate3d(-50%,-50%,0) scale(1)}
.c-info{position:relative;min-height:340px}
.c-info .it{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .35s ease}
.c-info .it.in{opacity:1;pointer-events:auto;transition:opacity .2s ease .15s}
.c-info .it .ln>span{transition-duration:1s}
.c-info .it .rv{transition-duration:.9s}
.c-info .it.in .ln>span,.c-info .it.in .rv{transition-delay:calc(180ms + var(--d,0) * 80ms)}
.c-info h3{font-weight:300;font-size:clamp(36px,3.4vw,58px);letter-spacing:-.045em;line-height:.98;margin:16px 0 20px}
.c-info h3 b{font-weight:700}
.c-info p{font-size:15px;line-height:1.6;color:rgba(255,255,255,.7);max-width:340px}
.c-info dl{display:grid;grid-template-columns:auto 1fr;gap:10px 22px;margin:26px 0 28px;padding-top:20px;border-top:1px solid var(--line);max-width:340px}
.c-info dt{color:var(--mute)}
.c-prog{position:absolute;left:var(--gx);right:var(--gx);bottom:40px;height:1px;background:var(--line)}
.c-prog b{position:absolute;inset:0;background:linear-gradient(90deg,var(--pink),var(--neon));transform-origin:left;transform:scaleX(0)}
.c-note{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:28px var(--gx) 0}
.c-note a{color:var(--fg)}
@media (max-width:900px){
  .coll .stick{grid-template-columns:1fr;align-content:center;gap:10px;padding-top:64px}
  .c-idx{display:none}
  .c-head{top:72px;flex-direction:column;align-items:flex-start;gap:8px}
  .c-tabs{gap:5px}
  .c-tabs button{min-height:36px;padding:0 11px;letter-spacing:.1em}
  .c-tabs sup{display:none}
  .c-stage{height:30lvh}
  .c-info{min-height:340px}
  .c-info h3{margin:10px 0 14px}
  .c-info dl{margin:18px 0 20px;padding-top:14px}
  .c-prog{bottom:20px}
}

/* ---------- con quién trabajamos ---------- */
.clients{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,110px);padding:clamp(140px,22vh,230px) var(--gx) clamp(110px,16vh,170px);align-items:start}
.cl-media{position:sticky;top:12lvh;height:76lvh;border-radius:18px;overflow:hidden;background:#0b0b0b}
.cl-media figure{position:absolute;inset:0;clip-path:inset(100% 0 0 0);transition:clip-path 1.1s var(--ease)}
.cl-media figure.on{clip-path:inset(0 0 0 0);z-index:2}
.cl-media figure.prev{clip-path:inset(0 0 0 0);z-index:1;transition:none}
.cl-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.14);transition:transform 1.8s var(--ease)}
.cl-media figure.on img{transform:scale(1)}
.cl-num{position:absolute;z-index:3;left:22px;bottom:20px;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.7),0 0 18px rgba(0,0,0,.55)}
.cl-text .h2{margin:24px 0 30px}
.lead{font-size:17px;line-height:1.6;color:rgba(255,255,255,.7);max-width:460px}
.cl-list{margin-top:clamp(48px,8vh,84px)}
.cl-list li{border-top:1px solid var(--line)}
.cl-list li:last-child{border-bottom:1px solid var(--line)}
.cl-list a{display:grid;grid-template-columns:52px 1fr 24px;gap:12px;padding:24px 0;align-items:start}
.cl-list .n{color:var(--faint);padding-top:8px;transition:color .5s}
.cl-list b{display:block;font-weight:300;font-size:clamp(24px,2.4vw,36px);letter-spacing:-.035em;line-height:1.1;color:var(--mute);transition:color .5s}
.cl-list .d{display:grid;grid-template-rows:0fr;transition:grid-template-rows .7s var(--ease)}
.cl-list .d>span{overflow:hidden;font-size:15px;line-height:1.55;color:var(--mute);max-width:420px;padding-top:0;opacity:0;transition:opacity .5s,padding .7s var(--ease)}
.cl-list .ar{padding-top:8px;color:var(--faint);transition:color .5s,transform .6s var(--ease)}
.cl-list li.on b{color:var(--fg)}
.cl-list li.on .n{color:var(--pink)}
.cl-list li.on .d{grid-template-rows:1fr}
.cl-list li.on .d>span{opacity:1;padding-top:10px}
.cl-list li.on .ar{color:var(--fg);transform:translate(3px,-3px)}
.cl-ph,.cl-dots{display:none}
@media (max-width:900px){
  /* v41: en el celular, carrusel de tarjetas (foto + texto de cada sector) que se pasa de lado. Antes (v31) la foto quedaba
     fija arriba: el texto pasaba cortado por debajo, la barra la tapaba al subir y al final quedaba colgada sobre un hueco. */
  .clients{display:block}
  .cl-media{display:none}
  .cl-list{display:flex;gap:12px;margin:clamp(30px,5vh,44px) calc(var(--gx) * -1) 0;padding:0 var(--gx) 4px;overflow-x:auto;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scroll-padding:0 var(--gx);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .cl-list::-webkit-scrollbar{display:none}
  .cl-list li,.cl-list li:last-child{flex:0 0 min(84%,420px);scroll-snap-align:start;border:1px solid var(--line);border-radius:16px;background:#070707;overflow:hidden}
  .cl-list a{display:flex;flex-direction:column;height:100%;padding:0 0 20px}
  .cl-list .ar{display:none}   /* invisible en táctil, pero ocupaba sitio y dejaba un hueco al pie de la tarjeta */
  .cl-ph{display:block;aspect-ratio:3/2;overflow:hidden;background:#0b0b0b;margin-bottom:16px}
  .cl-ph img{width:100%;height:100%;object-fit:cover}
  .cl-list .n{color:var(--pink);padding:0 18px}
  .cl-list b{color:var(--fg);font-size:24px;padding:8px 18px 0}
  .cl-list .d{grid-template-rows:1fr;padding:0 18px}
  .cl-list .d>span,.cl-list li.on .d>span{opacity:1;padding-top:10px;color:rgba(255,255,255,.66)}
  .cl-dots{display:flex;justify-content:center;gap:8px;margin-top:20px}
  .cl-dots i{width:6px;height:6px;border-radius:3px;background:rgba(255,255,255,.25);transition:width .5s var(--ease),background .5s}
  .cl-dots i.on{width:22px;background:var(--pink)}
}
@media (hover:none){.cl-list .ar{visibility:hidden}}

/* ---------- contacto: la señal en ondas ---------- */
.contact{padding:clamp(130px,20vh,220px) var(--gx) clamp(110px,16vh,170px);border-top:1px solid var(--line)}
.ct-head{display:grid;grid-template-columns:auto minmax(240px,380px);justify-content:space-between;align-items:end;gap:40px}
.ct-title{display:flex;flex-direction:column;gap:clamp(24px,3vw,40px)}
.display{font-weight:300;font-size:clamp(64px,10.4vw,176px);line-height:.86;letter-spacing:-.06em}
.display b{font-weight:700}
.ct-title .pk{font-style:normal;color:var(--pink)}
.ct-lead{padding-bottom:.6em}
/* cascada de líneas a todo el ancho, como el espectro de una consola */
.wv-field{position:relative;height:clamp(300px,54vh,580px);margin:clamp(10px,3vh,40px) calc(var(--gx) * -1) 0}
.wv-field canvas{position:absolute;inset:0;width:100%;height:100%}
.wv-cap{display:flex;justify-content:space-between;gap:16px;padding-top:16px;border-top:1px solid var(--line);margin-bottom:clamp(56px,9vh,100px)}
.wv-live{display:inline-flex;align-items:center;gap:10px;color:var(--fg)}
.wv-live i{position:relative;width:7px;height:7px;border-radius:50%;background:var(--pink)}
.wv-live i::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--pink);animation:wvping 1.8s cubic-bezier(0,0,.2,1) infinite}
.paused .wv-live i::after{animation:none}
@keyframes wvping{0%{transform:scale(1);opacity:.7}80%,100%{transform:scale(3.2);opacity:0}}
.hint-t{display:none}
@media (hover:none){.hint-f{display:none}.hint-t{display:inline}}
.ct-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(40px,7vw,130px);align-items:start}

/* canales: la línea se dibuja al entrar y se ilumina en rosa al pasar */
.channels{position:relative}
.channels a{position:relative;display:grid;grid-template-columns:150px 1fr 20px;gap:16px;align-items:baseline;padding:22px 0}
.channels a::before,.channels a::after,.channels::after{content:"";position:absolute;left:0;right:0;height:1px;transform-origin:left;pointer-events:none}
.channels a::before{top:0;background:var(--line);transform:scaleX(0);transition:transform 1.4s var(--ease);transition-delay:calc(var(--d,0) * 120ms)}
.channels::after{bottom:0;background:var(--line);transform:scaleX(0);transition:transform 1.4s var(--ease) .36s}
.channels.in a::before,.channels.in::after{transform:none}
.channels a::after{top:0;background:var(--pink);transform:scaleX(0);transition:transform .9s var(--ease)}
.channels a:hover::after,.channels a:focus-visible::after{transform:none}
.channels .v{font-size:clamp(18px,1.6vw,24px);letter-spacing:-.02em;transition:transform .8s var(--ease)}
.channels a:hover .v{transform:translate3d(10px,0,0)}
.channels .ar{transition:transform .6s var(--ease),color .4s}
.channels a:hover .ar{transform:translate(3px,-3px);color:var(--pink)}

/* formulario: el subrayado se llena en rosa al escribir y queda blanco al completar */
.cf{display:grid;grid-template-columns:1fr 1fr;gap:34px 28px}
.ct-grid .channels{margin-top:40px}
.cf .full{grid-column:1/-1}
.f{position:relative;display:flex;flex-direction:column;gap:12px}
.f>.mono{transition:color .5s}
.f:focus-within>.mono{color:var(--fg)}
.f input,.f textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);padding:6px 0 14px;font:inherit;font-size:18px;color:var(--fg);border-radius:0;resize:vertical}
.f input::placeholder,.f textarea::placeholder{color:var(--faint);transition:opacity .4s}
.f input:focus::placeholder,.f textarea:focus::placeholder{opacity:.5}
.f input:focus,.f textarea:focus{outline:none}
label.f::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--fg);transform:scaleX(0);transform-origin:left;transition:transform 1s var(--ease),background .5s}
label.f:has(input:not(:placeholder-shown),textarea:not(:placeholder-shown))::after{transform:none}
label.f:focus-within::after{transform:none;background:var(--pink)}
/* selector con píldora que se desliza */
.seg{position:relative;display:flex;flex-wrap:wrap;gap:8px}
.seg-pill{position:absolute;left:0;top:0;width:0;height:0;border-radius:999px;background:var(--fg);opacity:0;transition:transform .75s var(--ease),width .75s var(--ease),height .75s var(--ease),opacity .4s}
.seg.ready .seg-pill{opacity:1}
.seg button{position:relative;font:inherit;letter-spacing:inherit;text-transform:inherit;padding:11px 16px;border-radius:999px;border:1px solid var(--line);color:var(--mute);transition:color .5s var(--ease),border-color .5s var(--ease),background .5s var(--ease)}
.seg button:hover{border-color:rgba(255,255,255,.4);color:var(--fg)}
.seg button[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.seg.ready button[aria-pressed="true"]{background:transparent;border-color:transparent}
.send{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:6px}
.send .btn .ar{transition:transform .7s var(--ease)}
.send.go .btn .ar{transform:translate3d(8px,0,0)}
@media (max-width:900px){
  .ct-head{grid-template-columns:1fr;gap:26px}
  .wv-field{height:clamp(260px,46vh,380px)}
  .wv-cap{flex-direction:column;gap:8px}
  .ct-grid{grid-template-columns:1fr;gap:20px}
  .ct-grid .channels{margin-top:0}
  .cf{grid-template-columns:1fr;margin-top:40px}
  .channels a{grid-template-columns:1fr 20px;row-gap:6px}
  .channels .mono{grid-column:1/-1}
}

/* ---------- pie ---------- */
.foot{padding:0 var(--gx) 28px;border-top:1px solid var(--line)}
.foot-top{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:28px 0}
.foot-top ul{display:flex;gap:clamp(16px,2.4vw,36px);flex-wrap:wrap}
.foot-top a,.foot-top button{transition:color .3s}
.foot-top a:hover{color:var(--pink)}
.foot-word{padding:clamp(48px,9vh,100px) 0 clamp(36px,6vh,70px)}
.foot-word img{width:min(100%,880px);height:auto;margin:0 auto}
.foot-bot{position:relative;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:22px}
/* el horizonte de la marca cierra la página */
.foot-bot::before{content:"";position:absolute;left:calc(var(--gx) * -1);right:calc(var(--gx) * -1);top:0;height:2px;background:var(--horizon);box-shadow:0 0 36px rgba(250,0,168,.4)}
.foot{background:linear-gradient(180deg,rgba(245,0,124,0) calc(100% - 110px),rgba(245,0,124,.07))}
.legal{display:flex;gap:22px;flex-wrap:wrap}
.legal a:hover,.legal button:hover{color:var(--fg)}
.legal button{font:inherit;letter-spacing:inherit;text-transform:inherit}

/* ---------- cambio de idioma y movimiento reducido ---------- */
body.swapping main,body.swapping footer{opacity:.2;transition:opacity .3s}
@media (prefers-reduced-motion:reduce){
  .ln>span,.rv,.hl img,.channels a::before,.channels::after{transition:none!important;transform:none!important;opacity:1!important}
}

/* ---------- móvil: zonas seguras del iPhone y objetivos táctiles de 44 px ---------- */
.h-foot{padding-bottom:max(20px,calc(env(safe-area-inset-bottom) + 10px))}
.foot{padding-bottom:max(28px,calc(env(safe-area-inset-bottom) + 16px))}
@media (hover:none) and (pointer:coarse){
  .seg button{min-height:44px}
  .foot-top a,.foot-top button,.legal a,.legal button{display:inline-flex;align-items:center;min-height:44px}
  .lang a{display:inline-flex;align-items:center;min-height:44px;padding:0 4px}
}

/* ---------- móvil en horizontal (pantallas bajas): colección en dos columnas y menú que cabe ---------- */
@media (max-height:500px) and (orientation:landscape){
  .menu{padding-top:76px;padding-bottom:20px}
  .coll .stick{grid-template-columns:1fr 1.1fr;align-items:center;gap:4vw;padding-top:56px;padding-bottom:26px}
  .c-idx{display:none}
  .c-head{top:62px}
  .c-stage{height:62lvh}
  .c-info{min-height:250px}
  .c-info h3{font-size:30px;margin:6px 0 10px}
  .c-info p{font-size:13px;line-height:1.5}
  .c-info dl{margin:10px 0 12px;padding-top:10px;gap:4px 18px}
  .c-info .btn{height:44px}
  .c-prog{bottom:12px}
}

/* ---------- marcas: los logos en bucle (v12) ----------
   Celdas como una hoja técnica: número arriba, logo en blanco al centro, categoría abajo. El bucle lo mueve v10.js
   (hacia la derecha, al revés que los mercados), acelera con el scroll y frena al pasar el ratón. */
.logos{position:relative;margin:0 calc(var(--gx) * -1) clamp(70px,11vh,120px);overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 10%,#000 90%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 10%,#000 90%,transparent 100%)}
.lg-track{display:flex;width:max-content;will-change:transform}
.lg{--H:clamp(66px,7.6vw,116px);position:relative;flex:none;width:clamp(232px,24vw,384px);height:clamp(184px,19.5vw,288px);display:grid;place-items:center;border-right:1px solid var(--line);isolation:isolate}
.lg::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(58% 62% at 50% 50%,rgba(245,0,124,.17),rgba(245,0,124,0) 72%);opacity:0;transition:opacity .7s var(--ease)}
.lg img{height:calc(var(--H) * var(--k));width:auto;max-width:74%;object-fit:contain;opacity:.7;transform:scale(.97);transition:opacity .6s var(--ease),transform .9s var(--ease);user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.lg-n{position:absolute;left:22px;top:20px;color:var(--faint);transition:color .5s}
.lg-ct{position:absolute;left:22px;bottom:18px;right:22px;color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .5s}
.lg-ct::before{content:"";display:inline-block;width:0;height:6px;border-radius:50%;background:var(--pink);margin-right:0;vertical-align:middle;transform:scale(0);transition:transform .5s var(--ease),width .5s var(--ease),margin .5s var(--ease)}
@media (hover:hover) and (pointer:fine){
  .lg:hover::before{opacity:1}
  .lg:hover img{opacity:1;transform:scale(1.04)}
  .lg:hover .lg-n{color:var(--pink)}
  .lg:hover .lg-ct{color:var(--fg)}
  .lg:hover .lg-ct::before{transform:none;width:6px;margin-right:10px}
}
@media (max-width:900px){.logos{margin-bottom:56px}.lg{--H:clamp(58px,15vw,84px);width:clamp(190px,52vw,260px);height:clamp(150px,40vw,200px)}.lg-n{left:16px;top:14px}.lg-ct{left:16px;bottom:12px;right:16px;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.4}}

/* ================================================================ v19 · lo que pide el cliente (brief del 24-oct-2026) */
/* WhatsApp: acción principal */
.btn.wa-btn{gap:10px}
.wa-btn svg{width:18px;height:18px;flex:none;margin-left:-4px}
.btn.sm.wa-btn svg{width:15px;height:15px;margin-left:-2px}
.wa-fab{position:fixed;right:max(20px,env(safe-area-inset-right));bottom:max(20px,calc(env(safe-area-inset-bottom) + 12px));z-index:95;display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 22px 0 16px;border-radius:999px;background:var(--pink);color:#000;font-size:14px;font-weight:600;box-shadow:0 10px 34px rgba(245,0,124,.35);opacity:0;transform:translate3d(0,16px,0) scale(.96);pointer-events:none;transition:opacity .5s var(--ease),transform .7s var(--ease),background .4s}
.wa-fab svg{width:22px;height:22px;flex:none}
.wa-fab.on{opacity:1;transform:none;pointer-events:auto}
.wa-fab:hover{background:var(--fg)}
@media (max-width:900px){.wa-fab{width:56px;height:56px;padding:0;justify-content:center}.wa-fab span{display:none}.wa-fab svg{width:27px;height:27px}}

/* marcas: distribuidor autorizado */
.brand-list .auth{font-style:normal;color:var(--pink);margin-right:14px;white-space:nowrap}
@media (max-width:900px){.brand-list .auth{display:block;margin:0 0 4px}}

/* botones de elección (formulario) */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button{font:inherit;letter-spacing:inherit;text-transform:inherit;padding:11px 16px;border-radius:999px;border:1px solid var(--line);color:var(--mute);transition:color .5s var(--ease),border-color .5s var(--ease),background .5s var(--ease)}
.chips button:hover{border-color:rgba(255,255,255,.4);color:var(--fg)}
.chips button[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
@media (hover:none) and (pointer:coarse){.chips button{min-height:44px}}

/* ================================================================ v20 · lo que pidió el cliente al ver la v19 */
/* títulos de sección centrados, sin la columna vacía a la izquierda */
.sec-head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px}
.sec-head .h2{max-width:22ch}

/* cabecera: entre 901 y 1240 px los enlaces pasan al menú (no caben con el botón de WhatsApp) */
/* v33: con la pestaña de personalizados hay un enlace más; por debajo de 1320 px va al menú */
@media (max-width:1439px){.nav .links{gap:2vw}}
@media (min-width:901px) and (max-width:1320px){.nav .links{display:none}.menu-btn{display:block;font:inherit;letter-spacing:inherit;text-transform:inherit}}

/* marcas: mosaico de logos originales; cada uno abre el sitio de la marca. Luz que sigue al cursor (--mx, --my desde v10.js) */
.bx{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;max-width:1320px;margin:0 auto}
.bx-t{position:relative;display:grid;place-items:center;aspect-ratio:4/3;border:1px solid var(--line);border-radius:18px;overflow:hidden;isolation:isolate;background:#060606;transition:border-color .6s var(--ease),transform .8s var(--ease)}
.bx-t::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(250,0,168,.22),rgba(245,0,124,.06) 45%,rgba(0,0,0,0) 70%);opacity:0;transition:opacity .6s var(--ease)}
.bx-logo{width:calc(64% * var(--k,1));max-height:42%;height:auto;object-fit:contain;opacity:.86;transition:transform .9s var(--ease),opacity .6s;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.bx-prod{position:absolute;right:-4%;bottom:3%;width:56%;height:auto;opacity:0;transform:translate3d(10%,10%,0) rotate(-6deg);transition:opacity .7s var(--ease),transform 1.1s var(--ease);pointer-events:none;filter:drop-shadow(0 18px 30px rgba(0,0,0,.6))}
.bx-prod.wide{right:auto;left:3%;bottom:20%;width:94%}  /* v35: unidad de rack (ADTQ en 3/4), a casi todo el ancho de la casilla */
.bx-n{position:absolute;left:18px;top:16px;color:var(--faint);transition:color .5s}
.bx-meta{position:absolute;left:18px;right:18px;bottom:16px;display:flex;flex-direction:column;gap:5px;transition:opacity .5s,transform .6s var(--ease)}
.bx-auth{color:var(--pink);font-size:9.5px}
.bx-ct{color:var(--faint);transition:color .5s}
.bx-go{position:absolute;left:18px;bottom:16px;color:var(--fg);opacity:0;transform:translate3d(0,8px,0);transition:opacity .5s,transform .6s var(--ease)}
.bx-ask{place-items:center;text-align:center;padding:24px}
.bx-q{font-size:clamp(20px,1.7vw,26px);font-weight:600;letter-spacing:-.02em;line-height:1.2;max-width:12ch}
.bx-ask .bx-go{opacity:1;transform:none;color:var(--pink);left:0;right:0;text-align:center}
@media (hover:hover) and (pointer:fine){
  .bx-t:hover{border-color:rgba(250,0,168,.45)}
  .bx-t:hover::before{opacity:1}
  .bx-t:hover .bx-logo{opacity:1;transform:translate3d(0,-10%,0) scale(1.04)}
  .bx-t:hover .bx-prod{opacity:1;transform:none}
  .bx-t:hover .bx-meta{opacity:0;transform:translate3d(0,-8px,0)}
  .bx-t:hover .bx-go{opacity:1;transform:none}
  .bx-t:hover .bx-n{color:var(--pink)}
  .bx-t:has(.bx-prod):hover .bx-logo{transform:translate3d(-14%,-22%,0) scale(.86)}
}
@media (hover:none){.bx-t::before{opacity:.55;--mx:50%;--my:120%}.bx-ct{color:var(--mute)}}
@media (max-width:1000px){.bx{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.bx{gap:8px}.bx-t{border-radius:14px;aspect-ratio:1/1}.bx-n{left:12px;top:11px}.bx-logo{margin-top:-18%}.bx-meta{left:12px;right:10px;bottom:11px;gap:4px}.bx-auth{font-size:7.5px;letter-spacing:.1em}.bx-ct{font-size:8.5px;letter-spacing:.1em;line-height:1.35}.bx-q{font-size:17px}}

/* servicios: la consola de mezcla */
.services{padding:clamp(130px,20vh,220px) var(--gx) clamp(100px,14vh,160px)}
.mx{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:clamp(32px,5vw,96px);align-items:center;max-width:1240px;margin:clamp(48px,8vh,88px) auto 0}
.mx-desk{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(6px,.8vw,12px);padding:clamp(12px,1.6vw,22px);border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,#0e0e10,#050506);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 40px 90px rgba(0,0,0,.7),0 0 120px rgba(250,0,168,.06)}
.ch{position:relative;display:grid;grid-template-rows:10px 1fr auto auto;justify-items:center;gap:12px;height:clamp(300px,44vh,430px);padding:14px 0 12px;border-radius:14px;background:#09090a;border:1px solid rgba(255,255,255,.05);color:var(--faint);transition:border-color .5s var(--ease),background .5s var(--ease),color .5s}
.ch:hover{border-color:rgba(255,255,255,.14);color:var(--mute)}
.ch.on{border-color:rgba(250,0,168,.5);background:linear-gradient(180deg,rgba(250,0,168,.09),#09090a 60%);color:var(--fg)}
.ch-led{width:7px;height:7px;border-radius:50%;background:#26262a;transition:background .3s,box-shadow .3s}
.ch.on .ch-led{background:var(--neon);box-shadow:0 0 12px var(--neon),0 0 4px #fff}
.ch-mid{display:flex;gap:clamp(6px,.7vw,10px);height:100%;align-items:stretch}
.ch-meter{position:relative;width:6px;border-radius:3px;background:repeating-linear-gradient(to top,rgba(255,255,255,.07) 0 4px,transparent 4px 7px)}
.ch-meter i{position:absolute;inset:0;border-radius:3px;background:linear-gradient(to top,var(--pink),var(--neon) 70%,#ffd6ef);-webkit-mask:repeating-linear-gradient(to top,#000 0 4px,transparent 4px 7px);mask:repeating-linear-gradient(to top,#000 0 4px,transparent 4px 7px);clip-path:inset(calc((1 - var(--lv,0)) * 100%) 0 0 0)}
.ch-fd{position:relative;width:4px;border-radius:2px;background:rgba(255,255,255,.1)}
.ch-fd i{position:absolute;left:50%;bottom:calc(var(--r,.4) * (100% - 18px));width:clamp(22px,2.4vw,32px);height:18px;margin-left:calc(clamp(22px,2.4vw,32px) / -2);border-radius:4px;background:linear-gradient(#f4f4f4,#a9a9ad);box-shadow:0 6px 14px rgba(0,0,0,.6),inset 0 -2px 0 rgba(0,0,0,.25);transition:bottom 1s cubic-bezier(.34,1.32,.5,1)}
.ch-fd i::after{content:"";position:absolute;left:3px;right:3px;top:8px;height:2px;background:#555;transition:background .4s}
.ch.on .ch-fd i{bottom:calc(.84 * (100% - 18px))}
.ch.on .ch-fd i::after{background:var(--neon);box-shadow:0 0 8px var(--neon)}
.ch-n{font-size:10px}
.ch-lb{font-size:9px;letter-spacing:.1em;writing-mode:vertical-rl;transform:rotate(180deg);height:104px;text-align:left;white-space:nowrap;overflow:hidden}
.mx-out{position:relative;display:grid;align-content:center;min-height:clamp(320px,44vh,430px)}
.mx-p{grid-area:1/1;position:relative;opacity:0;transform:translate3d(0,18px,0);transition:opacity .45s ease,transform .8s var(--ease);pointer-events:none}
.mx-p.on{opacity:1;transform:none;pointer-events:auto;transition:opacity .6s ease .1s,transform .9s var(--ease) .1s}
.mx-p::before{content:attr(data-n);position:absolute;right:0;top:50%;transform:translateY(-58%);z-index:-1;font-weight:800;font-size:clamp(150px,17vw,280px);line-height:1;letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1px rgba(250,0,168,.28)}
.mx-k{color:var(--pink)}
.mx-p h3{font-weight:300;font-size:clamp(34px,3.8vw,60px);letter-spacing:-.045em;line-height:1.02;margin:18px 0 20px;max-width:13ch}
.mx-p p{font-size:17px;line-height:1.6;color:var(--mute);max-width:400px}
.mx-cta{grid-area:2/1;justify-self:start;margin-top:30px}
@media (max-width:900px){
  .mx{grid-template-columns:1fr;gap:28px;margin-top:40px}
  .mx-desk{gap:5px;padding:10px;border-radius:18px}
  .ch{height:230px;gap:9px;padding:10px 0;border-radius:10px}
  .ch-lb{display:none}
  .mx-out{min-height:0;text-align:center;justify-items:center}
  .mx-p h3{margin:12px auto 14px}
  .mx-p p{margin:0 auto}
  .mx-p::before{right:50%;transform:translate(50%,-58%)}
  .mx-cta{justify-self:center;margin-top:24px}
}

/* casos de éxito: foto de la gira a toda pantalla, el nombre se enciende como un letrero de neón */
.cases{position:relative;height:320lvh}
.cs-stick{position:sticky;top:0;height:100lvh;min-height:560px;overflow:hidden;display:grid}
.cs-media{position:absolute;inset:0;background:#000}
.cs-f{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.1s ease}
.cs-f.on{opacity:1}
/* v27: los retratos llevan una versión apaisada para pantallas anchas */
.cs-f picture{position:absolute;inset:0}
.cs-f img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 6s cubic-bezier(.2,.7,.2,1)}
.cs-f.on img{transform:scale(1)}
/* v28: fotos de gira reales; la capa oscura solo donde hay texto (titular arriba, lista abajo) para que la foto se vea viva */
.cs-f::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.86) 0%,rgba(0,0,0,.45) 22%,rgba(0,0,0,0) 44%),linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,0) 26%)}
.cs-head .h2{text-shadow:0 2px 28px rgba(0,0,0,.55)}
.cs-f figcaption{position:absolute;left:var(--gx);bottom:18px;z-index:2;font-size:9px;color:rgba(255,255,255,.42)}
.cs-head{position:absolute;left:0;right:0;top:clamp(92px,14lvh,140px);display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;z-index:2;padding:0 var(--gx)}
.cs-lab{color:var(--mute)}
/* v21: la marca manda; los artistas quedan como índice discreto */
.cs-foot{position:absolute;left:var(--gx);right:var(--gx);bottom:clamp(44px,7lvh,72px);z-index:2;display:grid;gap:clamp(28px,5lvh,52px)}
.cs-brand{justify-self:start;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.cs-by{color:var(--mute)}
.cs-logo{display:block;height:clamp(34px,4.4vw,64px);width:auto;opacity:.94;filter:drop-shadow(0 2px 24px rgba(0,0,0,.5));transition:opacity .5s;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.cs-brand:hover .cs-logo{opacity:1}
.cs-list{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,40px)}
.cs-b{position:relative;display:grid;grid-template-columns:auto 1fr;column-gap:12px;row-gap:6px;align-items:baseline;width:100%;padding:18px 0 0;text-align:left;color:inherit;cursor:pointer}
.cs-bar{position:absolute;left:0;right:0;top:0;height:2px;border-radius:2px;background:rgba(255,255,255,.16);overflow:hidden}
.cs-bar i{position:absolute;inset:0;background:rgba(255,255,255,.4);transform-origin:0 50%;transform:scaleX(var(--p,0));transition:background-color .5s}
.cs-i.on .cs-bar i{background:var(--pink)}
.cs-n{color:var(--faint);transition:color .5s}
.cs-nm{font-weight:600;font-size:clamp(17px,1.5vw,22px);line-height:1.2;letter-spacing:-.01em;color:rgba(255,255,255,.48);transition:color .5s}
.cs-ct{grid-column:2;color:var(--faint);transition:color .5s}
.cs-i.on .cs-n{color:var(--pink)}
.cs-i.on .cs-nm,.cs-b:hover .cs-nm{color:#fff}
.cs-i.on .cs-ct{color:var(--mute)}
@media (max-width:900px){
  .cases{height:280lvh}
  .cs-f::after{background:linear-gradient(0deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.6) 28%,rgba(0,0,0,0) 52%),linear-gradient(180deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,0) 26%)}
  .cs-f figcaption{bottom:18px;left:var(--gx);right:96px;text-align:left;font-size:8px}
  .cs-foot{bottom:94px;gap:26px}
  .cs-logo{height:clamp(30px,8.6vw,44px)}
  .cs-list{grid-template-columns:1fr;gap:0}
  .cs-b{grid-template-columns:24px 1fr auto;column-gap:10px;padding:13px 0 11px}
  .cs-bar{height:1px}
  .cs-nm{font-size:16px}
  .cs-ct{grid-column:auto;text-align:right}
}
@media (prefers-reduced-motion:reduce){.cs-f img{transition:none;transform:none}}

/* formulario único: «Ser distribuidor» despliega los datos de la empresa */
.cf-dl{display:grid;grid-template-rows:0fr;transition:grid-template-rows .7s var(--ease),opacity .5s;opacity:0}
.cf-dl>.cf-dl-in{overflow:hidden;display:grid;grid-template-columns:1fr 1fr;gap:26px 28px;min-height:0}
.cf-dl.open{grid-template-rows:1fr;opacity:1}
.cf-dl.open>.cf-dl-in{padding-top:2px}
.cf .send{margin-top:0}
.wv-field{height:clamp(200px,34vh,380px)}
@media (max-width:900px){.cf-dl>.cf-dl-in{grid-template-columns:1fr}.wv-field{height:clamp(180px,30vh,280px)}}

/* pie compacto */
.foot{padding:0 var(--gx) 24px}
.ft{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;padding:clamp(28px,5vh,48px) 0 clamp(22px,4vh,36px)}
.ft-logo img{width:clamp(150px,14vw,210px);height:auto}
.ft-links{display:flex;gap:clamp(18px,2.6vw,40px);flex-wrap:wrap}
.ft-links a{transition:color .3s}
.ft-links a:hover{color:var(--pink)}
.foot .foot-bot{display:flex;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;padding-top:20px}
@media (max-width:700px){.ft{flex-direction:column;align-items:flex-start;gap:22px}.foot .foot-bot{flex-direction:column}}

/* v22: «Por qué SoundShine» en Nosotros (los puntos de javierocamponet.com aprobados el 24-oct) */
.why-k,.why{margin-top:clamp(70px,11vh,120px)}
.why-k{grid-column:1}
.why{grid-column:2;display:grid;grid-template-columns:repeat(2,1fr);column-gap:clamp(28px,3.4vw,56px)}
.why li{display:grid;grid-template-columns:auto 1fr;column-gap:16px;row-gap:10px;align-content:start;padding:26px 0 34px;border-top:1px solid var(--line)}
.why-n{color:var(--pink);padding-top:.55em}
.why h3{font-weight:600;font-size:clamp(20px,1.7vw,26px);line-height:1.15;letter-spacing:-.02em}
.why p{grid-column:2;color:var(--mute);font-size:15px;line-height:1.55;max-width:440px}
@media (max-width:900px){.why-k{margin-top:72px}.why{grid-column:1;grid-template-columns:1fr;margin-top:0}}
/* v22: el final del pie queda por encima del botón flotante de WhatsApp */
.foot{padding-bottom:calc(92px + env(safe-area-inset-bottom))}

/* v24: el formulario envía por correo; WhatsApp queda como alternativa */
.hp{display:none}
.wa-alt{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0;color:var(--mute);text-align:left;transition:color .3s}
.wa-alt svg{width:17px;height:17px;flex:none;color:var(--pink)}
.wa-alt:hover{color:var(--fg)}
.btn[disabled]{opacity:.6;cursor:progress}
.cf-status{min-height:1.5em;margin-top:-16px;color:var(--mute)}
.cf-status:empty{display:none}
.cf-status[data-kind="ok"]{color:var(--fg)}
.cf-status[data-kind="ok"]::before{content:"✓  ";color:var(--pink)}
.cf-status[data-kind="err"]{color:#ff7aa8}

/* v38 · Aviso de cookies (consent.js), a la derecha para no tapar la fila de logos. Solo aparece si hay un ID de analítica en site.config.json; antes no tenía estilos en esta hoja */
.cc{position:fixed;right:var(--gx);bottom:max(20px,calc(env(safe-area-inset-bottom) + 12px));z-index:120;width:min(440px,calc(100vw - var(--gx) * 2));display:flex;flex-direction:column;gap:16px;padding:20px 22px;border:1px solid var(--line);border-radius:16px;background:rgba(10,10,10,.94);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 20px 60px rgba(0,0,0,.6);font-size:13px;line-height:1.55;color:rgba(255,255,255,.78)}
.cc a{color:var(--fg);border-bottom:1px solid currentColor}
.cc .row{display:flex;gap:8px}
.cc button{flex:1;display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 22px;border-radius:999px;border:1px solid rgba(255,255,255,.28);background:none;color:var(--fg);font:600 13px/1 "Montserrat",system-ui,sans-serif;cursor:pointer;transition:background .4s var(--ease),color .4s var(--ease),border-color .4s var(--ease)}
.cc button.ok{background:var(--pink);border-color:var(--pink);color:#000}
.cc button.ok:hover{background:var(--fg);border-color:var(--fg)}
.cc button.no:hover{border-color:var(--fg)}
body:has(.cc:not([hidden])) .wa-fab{opacity:0;pointer-events:none}

/* v38 · Ficha completa de cada producto, al lado del botón de cotizar */
.it-acts{display:flex;align-items:center;flex-wrap:wrap;gap:8px 22px}
.it-more{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--mute);transition:color .4s}
.it-more:hover{color:var(--fg)}
.it-more span{transition:transform .6s var(--ease)}
.it-more:hover span{transform:translateX(4px)}

/* v43: PC con poca altura útil (portátil con el zoom de Windows al 125 %): la lista de la colección se centraba
   en toda la pantalla y subía hasta las pestañas de marca. Se reserva el alto de la cabecera y se compactan la lista y la ficha de la derecha. */
@media (min-width:901px) and (min-height:501px) and (max-height:820px){
  .coll .stick{padding-top:146px;padding-bottom:52px}
  .c-idx{align-self:safe center}
  .c-idx button{padding:3px 0;font-size:14px;line-height:1.35}
  .c-info{min-height:300px}
  .c-info h3{font-size:clamp(30px,2.6vw,40px);margin:10px 0 12px}
  .c-info p{font-size:14px;line-height:1.5}
  .c-info dl{margin:14px 0 16px;padding-top:12px;gap:6px 20px}
  .c-info .btn{height:44px}
  .c-beam{top:-60%;height:170%}   /* el foco baja con el escenario: que siga saliendo del borde de arriba */
}

/* v45: hero de venta que no cabe en el alto real del iPhone (v10.js añade .fit1, .fit2 y .fit3 según haga falta).
   Javier lo vio el 31-oct: el titular subía bajo la cabecera y los logos de marcas quedaban bajo la barra «Desliza». */
.stack.fit1 .hs-ql{display:none}
.stack.fit1 .hs-chips{margin-top:0}
.stack.fit1 .hs-h{font-size:clamp(26px,7.4vw,34px)}
.stack.fit1 .hs-chips button{padding:7px 11px}
.stack.fit1 .hs-acts{margin-top:12px}
.stack.fit1 .hs-stage{min-height:100px}
.stack.fit1 .hs-trust{margin-top:10px;padding-top:10px}
.stack.fit2 .hs-eye{display:none}
.stack.fit2 .hs-stage{min-height:70px}
.stack.fit2 .hs-acts{flex-wrap:nowrap}
.hero.stack.fit2 .hs-acts .btn{flex:1 1 0;min-width:0;gap:8px;padding:0 8px;font-size:12.5px}
.hero.stack.fit2 .hs-acts .btn svg{display:none}   /* sin el ícono, «Cotizar por WhatsApp» cabe en media línea */
.stack.fit3 .hs-trust{display:none}   /* los logos de marca solo se quitan si no cabe nada más */