/* ============================================================================
   RENTA DE PANTALLAS LED — Producciones Interfaz
   AISLADO bajo body.ld. Prefijo .ld-.

   DIRECCIÓN DE ARTE
   Editorial audiovisual, no catálogo. La fotografía manda: bloques a sangre,
   retículas asimétricas, tipografía condensada muy grande y filetes de 1px.
   Casi no hay tarjetas — cuando algo va "encerrado" es porque es un dato, no
   porque falte composición.

   El rojo Interfaz es ACENTO, no fondo: CTA, una palabra del titular, filetes
   e indicadores. Todo lo demás vive en negro/grafito para que la fotografía
   de evento sea lo único con color.

   Fotografía: TODA es material real de Interfaz. Cada sección usa una toma
   distinta a propósito; ninguna se repite entre secciones.
   ============================================================================ */
.ld{
  --ld-bg:#070707; --ld-bg2:#0D0D0D; --ld-bg3:#111111; --ld-bg4:#161616;
  --ld-line:#1E1E1E; --ld-line2:#2A2A2A;
  --ld-ink:#F5F5F5; --ld-mut:#9A9A9A; --ld-faint:#6B6B6B;
  --ld-red:#E50914; --ld-red2:#FF2A35; --ld-red-dim:rgba(229,9,20,.12);
  --ld-sans:'Barlow',system-ui,-apple-system,sans-serif;
  --ld-cond:'Barlow Condensed','Barlow',sans-serif;
  --ld-gap:clamp(88px,9vw,150px);
  background:var(--ld-bg); color:var(--ld-ink);
  font-family:var(--ld-sans); -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
/* landing.css ya reserva la altura del header fijo con
   `.lp{padding-top:var(--nav-h)}`. Aquí el hero es a sangre y se encarga él
   mismo de despejar el header, así que ese padding se cancela: si no, se suma
   dos veces (191px de más) y los CTAs caen fuera del viewport. */
.ld{padding-top:0}
.ld .wrap{max-width:1340px;margin:0 auto;padding:0 clamp(18px,3vw,40px)}
.ld h1,.ld h2,.ld h3{font-family:var(--ld-cond);font-weight:800;line-height:.94;
  letter-spacing:-.02em;margin:0;text-transform:uppercase}
.ld p{margin:0;font-family:var(--ld-sans)}
.ld a{color:inherit;text-decoration:none}
.ld img{max-width:100%;display:block}
.ld :focus-visible{outline:2px solid var(--ld-red);outline-offset:3px}

/* ---------- átomos ---------- */
.ld-eyebrow{display:inline-flex;align-items:center;gap:12px;font-family:var(--ld-cond);
  font-weight:700;letter-spacing:.3em;text-transform:uppercase;font-size:12px;color:var(--ld-red)}
.ld-eyebrow::before{content:"";width:30px;height:1px;background:var(--ld-red)}
.ld-eyebrow--w{color:var(--ld-mut)}
.ld-eyebrow--w::before{background:var(--ld-mut)}

.ld-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--ld-cond);font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  font-size:15px;padding:17px 30px;border:1px solid transparent;cursor:pointer;
  transition:background .2s,border-color .2s,color .2s,transform .2s}
.ld .ld-btn--p{background:var(--ld-red);color:#fff;border-color:var(--ld-red)}
.ld .ld-btn--p:hover{background:var(--ld-red2);border-color:var(--ld-red2);transform:translateY(-2px)}
.ld .ld-btn--o{background:transparent;color:var(--ld-ink);border-color:rgba(245,245,245,.28)}
.ld .ld-btn--o:hover{border-color:var(--ld-ink);background:rgba(245,245,245,.06)}

.ld-sec{padding:var(--ld-gap) 0}
.ld-sec--line{border-top:1px solid var(--ld-line)}
.ld-h2{font-size:clamp(38px,6.2vw,92px)}
.ld-h2 em{font-style:normal;color:var(--ld-red)}
.ld-lead{color:var(--ld-mut);font-size:clamp(15.5px,1.15vw,17.5px);line-height:1.7;max-width:60ch;margin-top:22px}

/* reveal: se activa con IntersectionObserver; sin JS todo queda visible */
.ld-anim .ld-rev{opacity:0;transform:translateY(22px);transition:opacity .75s cubic-bezier(.22,1,.36,1),transform .75s cubic-bezier(.22,1,.36,1)}
.ld-anim .ld-rev.in{opacity:1;transform:none}

/* ============================ 1 · HERO ================================== */
.ld-hero{position:relative;min-height:clamp(600px,90vh,980px);display:flex;align-items:flex-end;
  overflow:hidden;background:#000}
.ld-hero-bg{position:absolute;inset:0;z-index:0}
.ld-hero-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 42%;
  transform:scale(1.06);animation:ld-drift 26s ease-in-out infinite alternate}
@keyframes ld-drift{from{transform:scale(1.06) translate3d(0,0,0)}to{transform:scale(1.13) translate3d(-1.2%,-1%,0)}}
/* Velos: negro por abajo para el texto, un rojo casi imperceptible arriba a la
   derecha para que la marca "toque" la foto sin teñirla. */
.ld-hero-bg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(7,7,7,.80) 0%,rgba(7,7,7,.42) 32%,rgba(7,7,7,0) 62%),
  linear-gradient(180deg,rgba(7,7,7,.70) 0%,rgba(7,7,7,.24) 26%,rgba(7,7,7,.58) 52%,rgba(7,7,7,.86) 80%,var(--ld-bg) 100%),
  radial-gradient(1100px 620px at 88% 6%,rgba(229,9,20,.16),transparent 62%)}
.ld-hero .wrap{position:relative;z-index:1;width:100%;padding-bottom:clamp(30px,3.4vw,56px);
  padding-top:calc(var(--nav-h, 191px) + 26px)}
.ld-h1{font-size:max(42px,min(7vw,124px,12.2vh));letter-spacing:-.035em;margin-top:16px;max-width:15ch}
.ld-h1 em{font-style:normal;color:var(--ld-red)}
/* reveal por línea con clip, sin librerías */
.ld-anim .ld-h1 .ln{display:block;overflow:hidden}
.ld-anim .ld-h1 .ln > span{display:block;transform:translateY(105%);
  transition:transform .95s cubic-bezier(.16,1,.3,1)}
.ld-anim .ld-h1.in .ln > span{transform:none}
.ld-anim .ld-h1 .ln:nth-child(2) > span{transition-delay:.10s}
.ld-anim .ld-h1 .ln:nth-child(3) > span{transition-delay:.20s}
.ld-hero-sub{color:#D2D2D2;font-size:clamp(15.5px,1.15vw,18px);line-height:1.6;max-width:54ch;margin-top:20px}
.ld-hero-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.ld-hero-meta{display:flex;gap:0;flex-wrap:wrap;margin-top:clamp(16px,1.8vw,26px);
  border-top:1px solid rgba(245,245,245,.14);padding-top:14px}
.ld-hero-meta span{font-family:var(--ld-cond);font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  font-size:11.5px;color:#B4B4B4;padding-right:22px;margin-right:22px;position:relative}
.ld-hero-meta span:not(:last-child)::after{content:"";position:absolute;right:0;top:2px;bottom:2px;
  width:1px;background:rgba(245,245,245,.18)}

/* ---------- 2 · FRANJA DE CONFIANZA ---------- */
.ld-trust{border-top:1px solid var(--ld-line);border-bottom:1px solid var(--ld-line);background:var(--ld-bg2)}
.ld-trust .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.ld-trust > .wrap > div{padding:clamp(30px,3.4vw,52px) clamp(16px,2vw,34px);position:relative}
.ld-trust > .wrap > div + div::before{content:"";position:absolute;left:0;top:clamp(30px,3.4vw,52px);
  bottom:clamp(30px,3.4vw,52px);width:1px;background:var(--ld-line)}
.ld-trust b{display:block;font-family:var(--ld-cond);font-weight:800;font-size:clamp(34px,4.4vw,62px);
  line-height:.9;letter-spacing:-.02em}
.ld-trust b em{font-style:normal;color:var(--ld-red)}
.ld-trust span{display:block;margin-top:10px;font-family:var(--ld-cond);font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;font-size:11.5px;color:var(--ld-faint);line-height:1.5}

/* ============ 3 · NO RENTAMOS UNA PANTALLA (foto con anotaciones) ======== */
.ld-exp-head{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,72px);align-items:end}
.ld-exp-head > *{min-width:0}
.ld-shot{position:relative;margin-top:clamp(38px,4.5vw,64px);overflow:hidden;background:var(--ld-bg3)}
.ld-shot img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:50% 58%}
.ld-shot::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(7,7,7,.45),transparent 38%,rgba(7,7,7,.55))}
/* Anotaciones tipo case study: punto + línea + etiqueta. Se posicionan con
   variables para no repetir reglas por hotspot. */
.ld-hot{position:absolute;z-index:2;left:var(--x);top:var(--y);display:flex;align-items:center;gap:0}
.ld-hot i{width:9px;height:9px;flex:none;border-radius:50%;background:var(--ld-red);
  box-shadow:0 0 0 4px rgba(229,9,20,.22);position:relative}
.ld-hot i::after{content:"";position:absolute;left:50%;top:50%;width:34px;height:1px;
  background:linear-gradient(90deg,var(--ld-red),rgba(229,9,20,.25));transform:translateY(-50%)}
.ld-hot b{margin-left:44px;font-family:var(--ld-cond);font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;font-size:11.5px;color:#fff;white-space:nowrap;
  background:rgba(7,7,7,.74);padding:6px 11px;border:1px solid rgba(245,245,245,.14);
  backdrop-filter:blur(4px)}
/* lista equivalente para móvil (los hotspots se ocultan) */
.ld-hot-list{display:none;margin-top:26px;border-top:1px solid var(--ld-line)}
.ld-hot-list li{list-style:none;padding:13px 0;border-bottom:1px solid var(--ld-line);
  font-family:var(--ld-cond);font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  font-size:12.5px;color:var(--ld-mut);display:flex;gap:12px;align-items:center}
.ld-hot-list li::before{content:"";width:6px;height:6px;background:var(--ld-red);flex:none}

/* ---------- MARQUEE ---------- */
.ld-marq{overflow:hidden;border-top:1px solid var(--ld-line);border-bottom:1px solid var(--ld-line);
  padding:20px 0;background:var(--ld-bg2)}
.ld-marq-in{display:flex;width:max-content;animation:ld-slide 46s linear infinite}
.ld-marq span{font-family:var(--ld-cond);font-weight:800;font-size:clamp(20px,2.4vw,32px);
  letter-spacing:.06em;text-transform:uppercase;color:#242424;padding:0 28px;white-space:nowrap}
.ld-marq span em{font-style:normal;color:var(--ld-red);opacity:.55}
@keyframes ld-slide{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* ============ 4 · TIPOS DE PRODUCCIÓN (3 bloques fotográficos) =========== */
.ld-types{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:clamp(36px,4vw,58px)}
.ld-type{position:relative;overflow:hidden;background:#000;min-height:clamp(400px,50vw,600px);
  display:flex;align-items:flex-end}
.ld-type img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform .9s cubic-bezier(.22,1,.36,1);z-index:0}
.ld-type::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(7,7,7,.28) 0%,rgba(7,7,7,.05) 30%,rgba(7,7,7,.88) 100%);
  transition:background .45s ease}
.ld-type:hover img,.ld-type:focus-within img{transform:scale(1.07)}
.ld-type:hover::after,.ld-type:focus-within::after{background:linear-gradient(180deg,rgba(7,7,7,.34) 0%,rgba(7,7,7,.12) 26%,rgba(7,7,7,.93) 100%)}
.ld-type-b{position:relative;z-index:2;padding:clamp(24px,2.4vw,38px);width:100%}
.ld-type-n{font-family:var(--ld-cond);font-weight:800;font-size:13px;letter-spacing:.24em;color:var(--ld-red)}
.ld-type-b h3{font-size:clamp(28px,2.9vw,44px);margin:12px 0 0}
.ld-type-b p{color:#C4C4C4;font-size:14.5px;line-height:1.6;margin-top:12px;max-width:34ch}
/* la lista y la flecha se revelan en hover; en táctil quedan siempre visibles */
.ld-type-more{max-height:0;opacity:0;overflow:hidden;
  transition:max-height .5s cubic-bezier(.22,1,.36,1),opacity .4s ease,margin-top .5s ease}
.ld-type:hover .ld-type-more,.ld-type:focus-within .ld-type-more{max-height:190px;opacity:1;margin-top:16px}
.ld-type-more ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:7px}
.ld-type-more li{font-family:var(--ld-cond);font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  font-size:11px;color:#CFCFCF;border:1px solid rgba(245,245,245,.22);padding:5px 10px}
.ld-type-go{display:inline-flex;align-items:center;gap:9px;margin-top:18px;font-family:var(--ld-cond);
  font-weight:800;letter-spacing:.1em;text-transform:uppercase;font-size:13px;color:#fff}
.ld-type-go svg{transition:transform .3s ease}
.ld-type:hover .ld-type-go svg{transform:translateX(5px)}

/* ============ 5 · GALERÍA BENTO ========================================= */
.ld-gal{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:clamp(130px,13vw,200px);
  gap:2px;margin-top:clamp(36px,4vw,58px)}
.ld-gal > *{min-width:0}
.ld-gal figure{position:relative;margin:0;overflow:hidden;background:var(--ld-bg3)}
.ld-gal img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.22,1,.36,1)}
.ld-gal figure:hover img{transform:scale(1.06)}
.ld-gal figcaption{position:absolute;left:0;right:0;bottom:0;padding:clamp(14px,1.5vw,22px);z-index:2;
  background:linear-gradient(0deg,rgba(7,7,7,.94),rgba(7,7,7,.35) 62%,transparent);
  transform:translateY(12px);opacity:0;transition:transform .45s ease,opacity .45s ease}
.ld-gal figure:hover figcaption,.ld-gal figure:focus-within figcaption{transform:none;opacity:1}
.ld-gal figcaption b{display:block;font-family:var(--ld-cond);font-weight:800;font-size:clamp(16px,1.5vw,21px);
  letter-spacing:.02em;text-transform:uppercase}
.ld-gal figcaption span{display:block;margin-top:5px;font-size:12.5px;color:#B6B6B6;letter-spacing:.02em}
.ld-g1{grid-column:span 4;grid-row:span 2}
.ld-g2{grid-column:span 2;grid-row:span 2}
.ld-g3{grid-column:span 2;grid-row:span 2}
.ld-g4{grid-column:span 4;grid-row:span 2}
.ld-g5{grid-column:span 3;grid-row:span 2}
.ld-g6{grid-column:span 3;grid-row:span 2}

/* ============ 6 · TU CONTENIDO (split) ================================== */
.ld-split{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:clamp(440px,54vw,660px)}
.ld-split > *{min-width:0}
.ld-split-tx{display:flex;flex-direction:column;justify-content:center;
  padding:clamp(40px,5vw,86px) clamp(18px,4vw,80px);background:var(--ld-bg2)}
.ld-split-ph{position:relative;overflow:hidden;background:#000}
.ld-split-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.ld-split-ph::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,var(--ld-bg2),transparent 26%)}
.ld-apps{display:flex;flex-wrap:wrap;gap:0;margin-top:clamp(26px,3vw,40px);
  border-top:1px solid var(--ld-line2)}
.ld-apps span{font-family:var(--ld-cond);font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  font-size:12px;color:var(--ld-mut);padding:14px 0;width:50%;border-bottom:1px solid var(--ld-line2);
  display:flex;align-items:center;gap:11px}
.ld-apps span::before{content:"";width:5px;height:5px;background:var(--ld-red);flex:none}

/* ============ 7 · SOLUCIONES (bloques asimétricos) ====================== */
.ld-sols{display:grid;grid-template-columns:repeat(12,1fr);gap:2px;margin-top:clamp(36px,4vw,58px)}
.ld-sol{position:relative;overflow:hidden;background:var(--ld-bg2);display:flex;align-items:flex-end;
  min-height:clamp(280px,26vw,380px);border:1px solid var(--ld-line)}
.ld-sol img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.42;
  transition:transform .8s cubic-bezier(.22,1,.36,1),opacity .5s ease;z-index:0}
.ld-sol::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(7,7,7,.55),rgba(7,7,7,.92))}
.ld-sol:hover img{transform:scale(1.05);opacity:.58}
.ld-sol-b{position:relative;z-index:2;padding:clamp(24px,2.4vw,38px);width:100%}
.ld-sol-b h3{font-size:clamp(22px,2.1vw,32px)}
.ld-sol-b h3 em{font-style:normal;color:var(--ld-red)}
.ld-sol-b p{color:var(--ld-mut);font-size:14.5px;line-height:1.6;margin-top:11px;max-width:44ch}
.ld-sol--a{grid-column:span 7}
.ld-sol--b{grid-column:span 5}
.ld-sol--c{grid-column:span 5}
.ld-sol--d{grid-column:span 7}
.ld-sol--full{grid-column:span 12;min-height:clamp(300px,30vw,440px)}
.ld-sol-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}
.ld-sol-tags span{font-family:var(--ld-cond);font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  font-size:11px;color:#CFCFCF;border:1px solid rgba(245,245,245,.2);padding:5px 10px}

/* ============ 8 · TECNOLOGÍA (datos reales del catálogo) ================ */
.ld-tech{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(30px,4vw,72px);align-items:start}
.ld-tech > *{min-width:0}
.ld-tech-list{border-top:1px solid var(--ld-line2)}
.ld-tech-list article{padding:clamp(20px,2.2vw,30px) 0;border-bottom:1px solid var(--ld-line2);
  display:grid;grid-template-columns:44px 1fr;gap:18px;align-items:start}
.ld-tech-n{font-family:var(--ld-cond);font-weight:800;font-size:13px;letter-spacing:.14em;color:var(--ld-red);padding-top:5px}
.ld-tech-list h3{font-size:clamp(19px,1.7vw,24px)}
.ld-tech-list p{color:var(--ld-mut);font-size:14.5px;line-height:1.65;margin-top:9px}
/* tabla de configuraciones — el único bloque "encerrado" de la página,
   porque es dato duro y se lee mejor tabulado */
.ld-spec{border:1px solid var(--ld-line2);background:var(--ld-bg2)}
.ld-spec-h{padding:18px 22px;border-bottom:1px solid var(--ld-line2);display:flex;
  justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap}
.ld-spec-h b{font-family:var(--ld-cond);font-weight:800;font-size:17px;letter-spacing:.04em;text-transform:uppercase}
.ld-spec-h span{font-size:12px;color:var(--ld-faint);letter-spacing:.02em}
.ld-spec table{width:100%;border-collapse:collapse}
.ld-spec th,.ld-spec td{text-align:left;padding:13px 22px;border-bottom:1px solid var(--ld-line);
  font-size:14px;vertical-align:top}
.ld-spec th{font-family:var(--ld-cond);font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  font-size:11px;color:var(--ld-faint);width:34%;white-space:nowrap}
.ld-spec td{color:#DADADA;font-variant-numeric:tabular-nums}
.ld-spec tr:last-child th,.ld-spec tr:last-child td{border-bottom:0}
.ld-note{margin-top:20px;color:var(--ld-faint);font-size:13px;line-height:1.65;max-width:64ch;
  padding-left:14px;border-left:1px solid var(--ld-line2)}

/* ============ 9 · PROCESO ============================================== */
.ld-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:clamp(36px,4vw,58px);
  border-top:1px solid var(--ld-line2)}
.ld-flow > *{min-width:0}
.ld-step{padding:clamp(26px,2.6vw,40px) clamp(16px,2vw,32px) clamp(26px,2.6vw,40px) 0;position:relative}
.ld-step + .ld-step{padding-left:clamp(16px,2vw,32px)}
.ld-step + .ld-step::before{content:"";position:absolute;left:0;top:clamp(26px,2.6vw,40px);bottom:clamp(26px,2.6vw,40px);
  width:1px;background:var(--ld-line)}
.ld-step::after{content:"";position:absolute;top:-1px;left:0;width:38px;height:2px;background:var(--ld-red)}
.ld-step + .ld-step::after{left:clamp(16px,2vw,32px)}
.ld-step-n{font-family:var(--ld-cond);font-weight:800;font-size:clamp(30px,3.2vw,46px);
  line-height:.9;color:var(--ld-line2);letter-spacing:-.02em}
.ld-step h3{font-size:clamp(17px,1.5vw,21px);margin:14px 0 10px}
.ld-step p{color:var(--ld-mut);font-size:14px;line-height:1.6}

/* ============ 10 · CTA FINAL (viewport completo) ======================== */
.ld-final{position:relative;min-height:clamp(560px,88vh,900px);display:flex;align-items:center;
  overflow:hidden;background:#000;text-align:center}
.ld-final-bg{position:absolute;inset:0;z-index:0}
.ld-final-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 48%}
.ld-final-bg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(180deg,var(--ld-bg) 0%,rgba(7,7,7,.62) 26%,rgba(7,7,7,.72) 70%,var(--ld-bg) 100%),
  radial-gradient(900px 500px at 50% 46%,rgba(229,9,20,.14),transparent 68%)}
.ld-final .wrap{position:relative;z-index:1;width:100%}
.ld-final h2{font-size:clamp(42px,9vw,140px);letter-spacing:-.035em}
.ld-final h2 em{font-style:normal;color:var(--ld-red)}
.ld-final p{color:#D2D2D2;font-size:clamp(15.5px,1.3vw,19px);line-height:1.6;margin:26px auto 0;max-width:52ch}
.ld-final-loc{margin-top:20px;font-family:var(--ld-cond);font-weight:700;letter-spacing:.24em;
  text-transform:uppercase;font-size:11.5px;color:var(--ld-faint)}
.ld-final .ld-hero-ctas{justify-content:center;margin-top:36px}

/* ============ 11 · FORMULARIO + CONTACTO ================================ */
.ld-cta{border-top:1px solid var(--ld-line);background:var(--ld-bg2)}
.ld-cta .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,4vw,72px);align-items:start}
.ld-cta .wrap > *{min-width:0}
.ld-form{background:var(--ld-bg3);border:1px solid var(--ld-line2);padding:clamp(24px,3vw,40px)}
.ld-fg{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px}
.ld-fg > *{min-width:0}
.ld-f{display:flex;flex-direction:column;gap:7px}
.ld-f--full{grid-column:1/-1}
.ld-f label{font-family:var(--ld-cond);font-weight:700;font-size:11.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ld-faint)}
.ld-f input,.ld-f select,.ld-f textarea{width:100%;min-width:0;background:var(--ld-bg);
  border:1px solid var(--ld-line2);color:var(--ld-ink);padding:13px 14px;font-family:var(--ld-sans);
  font-size:14.5px;transition:border-color .18s}
.ld-f textarea{resize:vertical;min-height:92px}
.ld-f input::placeholder,.ld-f textarea::placeholder{color:#4C4C4C}
.ld-f input:focus,.ld-f select:focus,.ld-f textarea:focus{outline:0;border-color:var(--ld-red)}
.ld-f select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ld-faint) 50%),linear-gradient(135deg,var(--ld-faint) 50%,transparent 50%);
  background-position:calc(100% - 18px) 55%,calc(100% - 13px) 55%;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:36px}
.ld-form button{width:100%;margin-top:22px}
.ld-legal{color:var(--ld-faint);font-size:12.5px;line-height:1.6;margin-top:14px}
.ld-form .ok{display:none}
.ld-form.sent form{display:none}
.ld-form.sent .ok{display:block;text-align:center;padding:34px 8px}
.ld-form.sent .ok h3{font-size:26px;color:var(--ld-red);margin-bottom:12px}
.ld-form.sent .ok p{color:var(--ld-mut);font-size:15px;line-height:1.65;max-width:44ch;margin:0 auto}
.ld-tel{display:flex;flex-direction:column;gap:3px;padding:16px 0;border-top:1px solid var(--ld-line2);
  transition:color .18s}
.ld-tel:hover{color:var(--ld-red)}
.ld-tel .l{font-family:var(--ld-cond);font-weight:700;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ld-faint)}
.ld-tel .n{font-family:var(--ld-cond);font-weight:800;font-size:clamp(22px,2vw,28px);letter-spacing:.01em}

/* ======================= RESPONSIVE ==================================== */
@media (max-width:1180px){
  .ld-types{grid-template-columns:1fr;gap:2px}
  .ld-type{min-height:clamp(340px,44vw,460px)}
  .ld-type-more{max-height:190px;opacity:1;margin-top:16px}   /* táctil: siempre visible */
  .ld-sol--a,.ld-sol--b,.ld-sol--c,.ld-sol--d{grid-column:span 6}
  .ld-tech{grid-template-columns:1fr;gap:38px}
  .ld-exp-head{grid-template-columns:1fr;gap:22px;align-items:start}
}
@media (max-width:900px){
  .ld-trust .wrap{grid-template-columns:repeat(2,1fr)}
  .ld-trust > .wrap > div:nth-child(3)::before,
  .ld-trust > .wrap > div:nth-child(2n+1)::before{display:none}
  .ld-trust > .wrap > div:nth-child(n+3){border-top:1px solid var(--ld-line)}
  .ld-split{grid-template-columns:1fr;min-height:0}
  .ld-split-ph{min-height:320px}
  .ld-split-ph::after{background:linear-gradient(0deg,var(--ld-bg2),transparent 42%)}
  .ld-cta .wrap{grid-template-columns:1fr}
  .ld-flow{grid-template-columns:1fr 1fr}
  .ld-step:nth-child(3),.ld-step:nth-child(4){border-top:1px solid var(--ld-line)}
  /* hotspots fuera; en su lugar la lista legible */
  .ld-hot{display:none}
  .ld-hot-list{display:block}
  .ld-gal{grid-template-columns:repeat(4,1fr)}
  .ld-g1,.ld-g4{grid-column:span 4}
  .ld-g2,.ld-g3,.ld-g5,.ld-g6{grid-column:span 2}
}
@media (max-width:600px){
  .ld-hero{min-height:auto}
  .ld-hero .wrap{padding-top:calc(var(--nav-h, 135px) + 34px);padding-bottom:44px}
  .ld-h1{max-width:none;font-size:clamp(38px,10.5vw,62px)}
  .ld-hero-ctas .ld-btn{flex:1;min-width:100%}
  .ld-hero-meta span{padding-right:14px;margin-right:14px;font-size:10.5px}
  .ld-trust .wrap{grid-template-columns:1fr}
  .ld-trust > .wrap > div + div{border-top:1px solid var(--ld-line)}
  .ld-trust > .wrap > div::before{display:none!important}
  .ld-sols{grid-template-columns:1fr}
  .ld-sol--a,.ld-sol--b,.ld-sol--c,.ld-sol--d,.ld-sol--full{grid-column:span 1}
  .ld-flow{grid-template-columns:1fr}
  .ld-step,.ld-step + .ld-step{padding-left:0;padding-right:0}
  .ld-step + .ld-step::before{display:none}
  .ld-step + .ld-step::after{left:0}
  .ld-step + .ld-step{border-top:1px solid var(--ld-line)}
  .ld-gal{grid-template-columns:1fr;grid-auto-rows:clamp(180px,52vw,240px)}
  .ld-g1,.ld-g2,.ld-g3,.ld-g4,.ld-g5,.ld-g6{grid-column:span 1;grid-row:span 1}
  .ld-gal figcaption{transform:none;opacity:1}       /* sin hover en táctil */
  .ld-fg{grid-template-columns:1fr}
  .ld-apps span{width:100%}
  .ld-final{min-height:auto;padding:clamp(70px,16vw,110px) 0}
  .ld-final .ld-hero-ctas .ld-btn{min-width:100%}
}

@media (prefers-reduced-motion:reduce){
  .ld *,.ld *::before,.ld *::after{animation:none!important;transition:none!important}
  .ld-anim .ld-rev{opacity:1;transform:none}
  .ld-anim .ld-h1 .ln > span{transform:none}
  .ld-hero-bg img{transform:scale(1.04)}
  .ld-marq-in{animation:none}
}