/* ===== /fabrica-de-persianas-en-puebla/ · efecto propio «La línea de producción»: una banda fija que avanza de lado
   con el scroll por las 5 estaciones del taller, cada una con su video real ===== */
.ln-track{position:relative;margin-top:clamp(2rem,4vw,3rem)}
.motion .ln-track{height:460vh}
.ln-stage{position:relative;overflow:hidden}
.motion .ln-stage{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;justify-content:center;padding:92px 0 24px}
.ln-head{display:flex;align-items:center;gap:1.2rem;padding:0 clamp(16px,4vw,48px);margin-bottom:1.3rem}
.ln-cont{font:600 .7rem/1 var(--f-ui);letter-spacing:.18em;text-transform:uppercase;color:var(--texto-3);white-space:nowrap}
.ln-cont b{font:800 1.5rem/1 var(--f-display);letter-spacing:0;color:var(--naranja)}
.ln-rail{position:relative;flex:1;height:4px;border-radius:4px;background:rgba(255,255,255,.08)}
.ln-rail i{position:absolute;inset:0;border-radius:4px;transform-origin:left;transform:scaleX(var(--p,0));background:var(--g-naranja)}
.ln-rail span{position:absolute;top:50%;left:var(--x,0%);width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#20242a;border:2px solid #4a4f56;transition:background .3s,border-color .3s,transform .3s}
.ln-rail span.on{background:var(--naranja);border-color:var(--naranja);transform:scale(1.15)}
.ln-band{display:flex;align-items:center;gap:clamp(14px,1.6vw,22px);width:max-content;padding:0 clamp(16px,4vw,48px);will-change:transform}
.ln-txt,.ln-fin{flex:none;width:min(410px,80vw);padding:1.6rem 1.5rem 1.5rem;border-radius:18px;background:var(--grafito);border:1px solid var(--linea)}
.ln-txt .num{font:600 .7rem/1 var(--f-ui);letter-spacing:.18em;text-transform:uppercase;color:var(--cielo)}
.ln-txt h3{margin-top:.7rem;font:900 clamp(1.7rem,2.6vw,2.4rem)/.98 var(--f-display);text-transform:uppercase}
.ln-txt p,.ln-fin p{margin-top:.8rem;color:var(--texto-2)}
.ln-fin{border-color:rgba(245,134,52,.45);box-shadow:0 40px 80px -40px rgba(248,74,5,.35)}
.ln-fin .t{font:900 clamp(1.6rem,2.4vw,2.2rem)/.98 var(--f-display);text-transform:uppercase;color:var(--texto)}
.ln-est{position:relative;flex:none;height:min(calc(100svh - 230px),640px);aspect-ratio:9/16;margin:0;border-radius:18px;overflow:hidden;background:#000;border:1px solid var(--linea-2);box-shadow:0 40px 70px -40px rgba(0,0,0,.9)}
.ln-est video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ln-est .est-n{position:absolute;left:12px;top:12px;z-index:2;padding:.42rem .65rem;border-radius:8px;background:rgba(10,12,15,.78);font:700 .66rem/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--naranja)}
.ln-est figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:2.6rem 1rem 1rem;background:linear-gradient(0deg,rgba(10,12,15,.92),rgba(10,12,15,0));font:600 .7rem/1.4 var(--f-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--texto-2)}
.ln-est figcaption b{display:block;margin-bottom:.25rem;font:800 1.25rem/1 var(--f-display);letter-spacing:.01em;color:var(--texto)}
html:not(.motion) .ln-stage{overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem}
html:not(.motion) .ln-band>*{scroll-snap-align:start}
html:not(.motion) .ln-est{height:min(70vh,560px)}
html:not(.motion) .ln-head{display:none}

/* --- medios de las secciones --- */
.fm{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fm .ph{aspect-ratio:3/4}
.fm .ph.w{grid-column:1/-1;aspect-ratio:16/9}
.fm .ph.v{aspect-ratio:4/5}
.ph .tag{position:absolute;left:12px;top:12px;z-index:3;display:inline-flex;align-items:center;gap:.45rem;padding:.45rem .7rem;border-radius:8px;background:rgba(10,12,15,.78);font:700 .66rem/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:#9BE4FF}
.ph .tag i{width:7px;height:7px;border-radius:50%;background:#ff4d3d;box-shadow:0 0 0 3px rgba(255,77,61,.25)}
.precios{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:1.6rem}
.precios div{padding:.9rem 1rem;border-radius:12px;background:var(--grafito);border:1px solid var(--linea)}
.precios dt{font:600 .64rem/1.3 var(--f-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--texto-3)}
.precios dd{margin-top:.35rem;font:900 1.5rem/1 var(--f-display);color:var(--texto)}
.precios dd small{font:600 .72rem/1 var(--f-body);color:var(--texto-3)}
.inst{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:clamp(2rem,4vw,3rem)}
.inst .ph{aspect-ratio:3/4}
.inst .ph.w{grid-column:span 2;aspect-ratio:auto}
.gar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:clamp(1.8rem,3vw,2.4rem)}
.gar div{padding:1.3rem 1.2rem;border-radius:16px;background:var(--grafito);border:1px solid var(--linea)}
.gar b{display:block;font:900 clamp(2rem,3vw,2.6rem)/1 var(--f-display);background:var(--g-naranja);-webkit-background-clip:text;background-clip:text;color:transparent}
.gar strong{display:block;margin-top:.6rem;font:800 1.15rem/1.05 var(--f-display);text-transform:uppercase;color:var(--texto)}
.gar span{display:block;margin-top:.4rem;color:var(--texto-2);font-size:.92rem}
.donde{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:clamp(1.8rem,3vw,2.4rem)}
.donde article{padding:1.4rem 1.4rem 1.3rem;border-radius:16px;background:var(--grafito);border:1px solid var(--linea)}
.donde article.si{border-color:rgba(245,134,52,.5)}
.donde .k{font:600 .68rem/1.45 var(--f-ui);letter-spacing:.2em;text-transform:uppercase;color:var(--texto-3)}
.donde article.si .k{color:var(--naranja)}
.donde .t{margin-top:.5rem;font:900 1.6rem/1 var(--f-display);text-transform:uppercase}
.donde p:not(.k):not(.t){margin-top:.6rem;color:var(--texto-2)}
.donde .ctas{margin-top:1.2rem}

@media (max-width:1100px){.precios,.gar{grid-template-columns:1fr 1fr}}
@media (max-width:900px){
  .motion .ln-track{height:540vh}
  .ln-est{height:min(calc(100svh - 270px),560px)}
  .inst{grid-template-columns:1fr 1fr;grid-auto-flow:dense}   /* las fotos angostas rellenan el hueco junto a las anchas */
  .donde{grid-template-columns:1fr}
}
@media (max-width:640px){.gar,.precios{grid-template-columns:1fr 1fr}}
