/* ============================================================
   GRUPO DAHIR — Kit compartido de landings de desarrollos
   Mismo sistema visual que dahir.com.ar (rediseño /nuevo/):
   fondo tinta, acento oro, Fraunces + Inter.

   Uso: cada landing enlaza /landing-kit/dahir-landing.css y
   /landing-kit/dahir-landing.js en el <head> (con defer) y solo
   cambia su contenido. No poner <script> al final del <body>:
   el editor visual los borra al guardar.

   Reglas pensadas para el editor visual compartido (/admin/):
   - Todo lo que depende de JS (gate de preview, animaciones)
     solo se activa cuando el script agrega clases al <html>.
     En el editor no corre el JS, así que se ve todo el contenido.
   - La barra de avance de obra se calcula desde el texto
     ("30% completado"): se edita un solo número.
   ============================================================ */

:root{
  --ink:#0a0a0b;
  --ink-2:#131315;
  --ink-3:#1c1c1f;
  --ink-4:#242428;
  --text:#f4f2ea;
  --text-muted:rgba(244,242,234,.66);
  --text-faint:rgba(244,242,234,.5);
  --dark-text:#141312;
  --line:rgba(255,255,255,.09);
  --line-2:rgba(255,255,255,.16);

  --c-gold:#c39b53;
  --c-gold-light:#e8cf95;
  --c-gold-dark:#8c6a2e;
  --gold-grad:linear-gradient(135deg,#f1dca6 0%,#d4b06a 38%,#a67c3d 70%,#e3c47f 100%);
  --c-gold-soft:rgba(195,155,83,.14);
  --c-magenta:#e6157a;
  --c-blue:#00a3dc;
  --c-salmon:#f37a6e;
  --c-live:#22c35e;
  --c-wsp:#22c35e;

  --font-display:'Fraunces', Georgia, serif;
  --font-body:'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --ease:cubic-bezier(.16,.84,.32,1);
  --container:min(1200px, calc(100vw - 32px));
  --nav-h:74px;
  --radius:20px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--nav-h) + 12px); background:var(--ink); }
body{
  margin:0; font-family:var(--font-body); color:var(--text); background:var(--ink);
  overflow-x:hidden; -webkit-font-smoothing:antialiased; line-height:1.55;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
button{ font-family:inherit; cursor:pointer; background:none; border:none; color:inherit; }
h1,h2,h3,h4{ font-family:var(--font-display); margin:0; font-weight:520; line-height:1.08; letter-spacing:-.01em; }
p{ margin:0; }
::selection{ background:var(--c-gold); color:var(--dark-text); }
.container{ width:var(--container); margin:0 auto; }
.muted{ color:var(--text-muted); }
.gold{ color:var(--c-gold); }

.eyebrow{
  display:inline-flex; align-items:center; gap:.55em; font-weight:700; font-size:.72rem;
  letter-spacing:.16em; text-transform:uppercase; color:var(--c-gold); margin:0 0 1em;
}
.eyebrow::before{ content:''; width:22px; height:2px; background:var(--c-gold); display:inline-block; }

/* barra de marca (mismo degradado que el progreso del sitio) */
.lp-brandline{ position:fixed; top:0; left:0; right:0; height:3px; z-index:1100;
  background:linear-gradient(90deg,var(--c-gold),var(--c-magenta),var(--c-blue)); }

/* ---------------- reveal (solo si corre el JS) ---------------- */
html.lp-js .rv{ opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
html.lp-js .rv.is-in{ opacity:1; transform:none; }
.rv-1{transition-delay:.06s} .rv-2{transition-delay:.13s} .rv-3{transition-delay:.2s} .rv-4{transition-delay:.27s}
@media (prefers-reduced-motion:reduce){ html.lp-js .rv{ opacity:1; transform:none; transition:none; } }

/* ---------------- gate de preview (solo si el JS lo activa) ---------------- */
.lp-gate{ display:none; }
html.lp-gate-on .lp-gate{
  position:fixed; inset:0; z-index:9999; background:var(--ink);
  display:flex; align-items:center; justify-content:center; flex-direction:column; gap:20px; padding:24px; text-align:center;
}
html.lp-gate-on body{ overflow:hidden; }
.lp-gate img{ width:200px; }
.lp-gate p{ color:var(--text-faint); font-size:.85rem; max-width:320px; }
.lp-gate form{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.lp-gate input{ background:var(--ink-3); border:1px solid var(--line-2); color:var(--text); padding:13px 16px; border-radius:30px; font-size:.95rem; width:200px; outline:none; }
.lp-gate input:focus{ border-color:var(--c-gold); }
.lp-gate button{ background:var(--text); color:var(--dark-text); padding:13px 22px; border-radius:30px; font-weight:700; font-size:.82rem; }
.lp-gate .err{ color:var(--c-salmon); font-size:.8rem; min-height:1em; }

/* ---------------- botones ---------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:14px 26px; border-radius:40px;
  font-weight:700; font-size:.85rem; letter-spacing:.02em; white-space:nowrap; border:1px solid transparent; background:none;
  transition:transform .4s var(--ease), background .3s, color .3s, box-shadow .4s, border-color .3s;
}
.btn-solid{ background:var(--text); color:var(--dark-text); }
.btn-solid:hover{ transform:translateY(-3px); background:var(--c-gold); box-shadow:0 14px 30px -10px rgba(195,155,83,.45); }
.btn-outline{ border-color:rgba(255,255,255,.3); color:var(--text); }
.btn-outline:hover{ background:rgba(255,255,255,.08); transform:translateY(-3px); }
.btn-wsp{ background:var(--c-wsp); color:#fff; }
.btn-wsp:hover{ transform:translateY(-3px); box-shadow:0 14px 30px -10px rgba(34,195,94,.5); }
.btn-sm{ padding:10px 18px; font-size:.78rem; }
.btn-block{ width:100%; }
.btn svg{ width:16px; height:16px; flex:none; }

/* ---------------- navegación ---------------- */
.lp-nav{
  position:fixed; top:3px; left:0; right:0; z-index:1000; height:var(--nav-h);
  display:flex; align-items:center; transition:background .4s var(--ease), border-color .4s;
  border-bottom:1px solid transparent;
  background:linear-gradient(180deg,rgba(10,10,11,.78) 0%,rgba(10,10,11,.35) 70%,rgba(10,10,11,0) 100%);
}
.lp-nav.scrolled, .lp-nav.open{ background:rgba(10,10,11,.82); backdrop-filter:blur(16px) saturate(140%); -webkit-backdrop-filter:blur(16px) saturate(140%); border-bottom-color:rgba(255,255,255,.06); }
.lp-nav-inner{ display:flex; align-items:center; gap:22px; width:var(--container); margin:0 auto; }
.lp-brand{ display:flex; align-items:center; gap:14px; min-width:0; }
.lp-brand-dahir img{ height:34px; width:auto; }
.lp-brand-sep{ width:1px; height:30px; background:var(--line-2); flex:none; }
.lp-brand-name{ font-family:var(--font-display); font-size:1.08rem; line-height:1.1; white-space:nowrap; }
.lp-brand-name small{ display:block; font-family:var(--font-body); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text-faint); margin-top:3px; }
.lp-links{ display:flex; align-items:center; gap:26px; margin-left:auto; }
.lp-links a{ font-size:.82rem; font-weight:600; color:var(--text-muted); position:relative; padding:6px 0; transition:color .3s; }
.lp-links a::after{ content:''; position:absolute; left:0; bottom:0; height:1px; width:0; background:var(--c-gold); transition:width .35s var(--ease); }
.lp-links a:hover, .lp-links a.active{ color:var(--text); }
.lp-links a:hover::after, .lp-links a.active::after{ width:100%; }
.lp-links .lp-link-other{ color:var(--c-gold); }
.lp-nav-cta{ margin-left:4px; }
.lp-burger{ display:none; margin-left:auto; width:44px; height:44px; border-radius:50%; border:1px solid var(--line-2); align-items:center; justify-content:center; flex-direction:column; gap:5px; }
.lp-burger span{ display:block; width:18px; height:1.6px; background:var(--text); transition:transform .3s var(--ease), opacity .3s; }
.lp-nav.open .lp-burger span:nth-child(1){ transform:translateY(6.6px) rotate(45deg); }
.lp-nav.open .lp-burger span:nth-child(2){ opacity:0; }
.lp-nav.open .lp-burger span:nth-child(3){ transform:translateY(-6.6px) rotate(-45deg); }
.lp-mobile{ display:none; }

/* ---------------- hero ---------------- */
.hero{ position:relative; min-height:100svh; display:flex; align-items:flex-end; padding:calc(var(--nav-h) + 60px) 0 64px; background:#111; overflow:hidden; }
.hero-bg{ position:absolute; inset:0; z-index:0; }
.hero-bg img{ width:100%; height:100%; object-fit:cover; }
.hero-bg::after{ content:''; position:absolute; inset:0;
  background:linear-gradient(90deg,rgba(6,6,7,.62) 0%,rgba(6,6,7,.25) 45%,rgba(6,6,7,0) 70%),
             linear-gradient(0deg,rgba(6,6,7,.94) 0%,rgba(6,6,7,.62) 30%,rgba(6,6,7,.18) 62%,rgba(6,6,7,.35) 100%); }
@media (max-width:640px){
  .hero:not(.hero-split) .hero-bg::after{ background:linear-gradient(0deg,rgba(6,6,7,.97) 0%,rgba(6,6,7,.82) 42%,rgba(6,6,7,.5) 72%,rgba(6,6,7,.4) 100%); }
}
.hero > .container{ position:relative; z-index:2; }
.hero-kicker{ display:flex; align-items:center; gap:10px; margin-bottom:20px; flex-wrap:wrap; }
.hero-kicker .dot{ width:7px; height:7px; border-radius:50%; background:var(--c-live); box-shadow:0 0 0 0 rgba(34,195,94,.6); animation:lpPulse 1.8s infinite; flex:none; }
.hero-kicker span{ font-size:.76rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); }
@keyframes lpPulse{ 0%{ box-shadow:0 0 0 0 rgba(34,195,94,.55);} 70%{ box-shadow:0 0 0 9px rgba(34,195,94,0);} 100%{ box-shadow:0 0 0 0 rgba(34,195,94,0);} }
.hero h1{ font-size:clamp(2.3rem,5.4vw,4.4rem); max-width:15ch; margin-bottom:20px; text-shadow:0 4px 24px rgba(0,0,0,.55); }
.hero h1 em{ font-style:normal; color:var(--c-gold); }
.hero-sub{ font-size:1.08rem; color:var(--text-muted); max-width:56ch; margin-bottom:32px; text-shadow:0 2px 12px rgba(0,0,0,.7); }
.hero-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-bottom:44px; }
.hero-stats{ display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line-2); padding-top:24px; gap:20px; }
.hero-stat b{ display:block; font-family:var(--font-display); font-weight:520; font-size:clamp(1.3rem,2.2vw,1.75rem); line-height:1.15; }
.hero-stat span{ display:block; font-size:.76rem; color:var(--text-faint); margin-top:4px; }

/* hero dividido: para renders verticales (torres). Imagen entera a la derecha, texto a la izquierda */
.hero.hero-split{ align-items:center; background:var(--ink); padding-bottom:56px; }
.hero-split .hero-bg{ left:auto; width:46%; }
.hero-split .hero-bg img{ object-position:center 30%; }
.hero-split .hero-bg::after{ background:linear-gradient(90deg,var(--ink) 0%,rgba(10,10,11,.55) 18%,rgba(10,10,11,0) 45%), linear-gradient(0deg,rgba(10,10,11,.6) 0%,rgba(10,10,11,0) 30%); }
.hero-split > .container > *{ max-width:min(640px,52%); }
.hero-split .hero-stats{ grid-template-columns:1fr 1fr; }

/* ---------------- secciones ---------------- */
.sec{ padding:104px 0; }
.sec-alt{ background:var(--ink-2); }
.sec-head{ max-width:680px; margin-bottom:50px; }
.sec-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.sec-head.center .eyebrow{ justify-content:center; }
.sec-head h2{ font-size:clamp(1.9rem,3.6vw,3rem); }
.sec-head p{ margin-top:16px; font-size:1.02rem; color:var(--text-muted); }

/* proyecto: texto + imagen */
.split{ display:grid; grid-template-columns:1.05fr 1fr; gap:60px; align-items:center; }
.split-text h2{ font-size:clamp(1.9rem,3.4vw,2.8rem); margin-bottom:22px; }
.split-text p{ color:var(--text-muted); margin-bottom:16px; font-size:1rem; }
.split-media{ border-radius:var(--radius); overflow:hidden; aspect-ratio:4/3.4; background:var(--ink-3); }
.split-media img{ width:100%; height:100%; object-fit:cover; }
.facts{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:16px; overflow:hidden; margin-top:28px; }
.fact{ background:var(--ink-3); padding:18px 20px; }
.fact span{ display:block; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-faint); margin-bottom:4px; }
.fact b{ font-family:var(--font-display); font-weight:520; font-size:1.15rem; }
.sec-alt .fact{ background:var(--ink); }

/* características en columnas */
.spec-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start; }
.spec-col{ background:var(--ink-3); border:1px solid var(--line); border-radius:var(--radius); padding:34px 32px; }
.sec-alt .spec-col{ background:var(--ink); }
.spec-col > h3{ font-size:1.5rem; margin-bottom:6px; }
.spec-group{ margin-top:24px; }
.spec-group > p{ font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--c-gold); margin-bottom:12px; }
.check-list li{ position:relative; padding-left:28px; margin-bottom:11px; color:var(--text-muted); font-size:.95rem; }
.check-list li::before{
  content:''; position:absolute; left:0; top:.28em; width:16px; height:16px; border-radius:50%; background:var(--c-gold-soft);
  -webkit-mask:none;
}
.check-list li::after{
  content:''; position:absolute; left:5.5px; top:calc(.28em + 4px); width:4px; height:7px;
  border:solid var(--c-gold); border-width:0 1.6px 1.6px 0; transform:rotate(45deg);
}
.spec-note{ text-align:center; font-size:.8rem; color:var(--text-faint); margin-top:28px; }

/* avance de obra */
.obra{ max-width:820px; margin:0 auto; background:var(--ink-3); border:1px solid var(--line); border-radius:var(--radius); padding:40px 40px 34px; }
.sec-alt .obra{ background:var(--ink); }
.obra-top{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:18px; flex-wrap:wrap; }
.obra-top h2{ font-size:clamp(1.7rem,3vw,2.3rem); }
.obra-pct{ font-family:var(--font-display); font-size:clamp(2rem,4vw,3rem); color:var(--c-gold); line-height:1; }
.obra-track{ height:10px; border-radius:20px; background:rgba(255,255,255,.08); overflow:hidden; }
.obra-bar{ height:100%; width:0; border-radius:20px; background:var(--gold-grad); transition:width 1.4s var(--ease); }
.obra-date{ margin-top:14px; font-size:.86rem; color:var(--text-faint); }

/* unidades */
.units{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:18px; }
.unit{ background:var(--ink-3); border:1px solid var(--line); border-radius:18px; padding:24px 22px 22px; display:flex; flex-direction:column; transition:border-color .35s, transform .35s var(--ease); }
.sec-alt .unit{ background:var(--ink); }
.unit:hover{ border-color:rgba(195,155,83,.4); transform:translateY(-4px); }
.unit-type{ font-size:.68rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--text-faint); }
.unit-code{ font-family:var(--font-display); font-size:2rem; margin:8px 0 2px; }
.unit-area{ font-size:.86rem; color:var(--text-muted); }
.unit-price{ font-family:var(--font-display); font-size:1.4rem; color:var(--c-gold); margin:16px 0 18px; padding-top:16px; border-top:1px solid var(--line); }
.unit-actions{ display:flex; gap:8px; margin-top:auto; }
.unit-actions .btn{ flex:1; padding:11px 12px; font-size:.76rem; }
.units-note{ text-align:center; font-size:.82rem; color:var(--text-faint); margin-top:26px; }

/* galería */
.gal-track{ display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px 2px 14px; cursor:grab; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.gal-track::-webkit-scrollbar{ display:none; }
.gal-track.dragging{ cursor:grabbing; scroll-snap-type:none; }
.gal-item{ flex:0 0 min(420px,82vw); scroll-snap-align:start; border-radius:18px; overflow:hidden; aspect-ratio:4/3; background:var(--ink-3); }
.gal-item img{ width:100%; height:100%; object-fit:cover; pointer-events:none; user-select:none; }
.gal-ctrl{ display:flex; gap:10px; justify-content:flex-end; margin-top:14px; }
.gal-ctrl button{ width:46px; height:46px; border-radius:50%; border:1px solid var(--line-2); display:flex; align-items:center; justify-content:center; transition:background .3s, border-color .3s; }
.gal-ctrl button:hover{ background:rgba(255,255,255,.08); border-color:var(--c-gold); }
.gal-ctrl svg{ width:18px; height:18px; }

/* ubicación */
.ubic{ display:grid; grid-template-columns:1fr 1.15fr; gap:50px; align-items:center; }
.ubic-list{ margin-top:24px; display:flex; flex-direction:column; gap:12px; }
.ubic-list li{ position:relative; padding-left:28px; color:var(--text-muted); font-size:.95rem; }
.ubic-list li::before{ content:''; position:absolute; left:0; top:.45em; width:10px; height:10px; border-radius:50%; border:2px solid var(--c-gold); }
.ubic-map{ border-radius:var(--radius); overflow:hidden; aspect-ratio:4/3; border:1px solid var(--line); background:var(--ink-3); }
.ubic-map iframe{ width:100%; height:100%; border:0; filter:invert(90%) hue-rotate(180deg) brightness(.95) contrast(.9); }

/* contacto */
.contact{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start; }
.contact h2{ font-size:clamp(1.9rem,3.4vw,2.8rem); }
.contact-lead{ margin-top:14px; color:var(--text-muted); }
.contact-rows{ margin-top:30px; display:flex; flex-direction:column; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:16px; overflow:hidden; }
.contact-row{ display:flex; align-items:center; gap:14px; padding:16px 18px; background:var(--ink-3); font-size:.92rem; color:var(--text-muted); transition:color .3s; }
.sec-alt .contact-row{ background:var(--ink); }
a.contact-row:hover{ color:var(--text); }
.contact-row svg{ width:18px; height:18px; color:var(--c-gold); flex:none; }
.contact-doc{ margin-top:18px; }
.form{ background:var(--ink-3); border:1px solid var(--line); border-radius:22px; padding:32px; display:flex; flex-direction:column; gap:14px; }
.sec-alt .form{ background:var(--ink); }
.field label{ display:block; font-size:.76rem; color:var(--text-faint); margin-bottom:6px; }
.field input, .field textarea{
  width:100%; background:var(--ink-2); border:1px solid rgba(255,255,255,.12); border-radius:12px;
  padding:13px 14px; color:var(--text); font-family:inherit; font-size:.95rem; outline:none; transition:border-color .3s; resize:vertical;
}
.field input:focus, .field textarea:focus{ border-color:var(--c-gold); }
.form-note{ font-size:.74rem; color:var(--text-faint); }
.form-msg{ display:none; padding:14px 16px; border-radius:12px; font-size:.9rem; }
.form-msg.ok{ display:block; background:rgba(34,195,94,.14); color:#7be0a0; }
.form-msg.err{ display:block; background:rgba(243,122,110,.14); color:var(--c-salmon); }

/* otros desarrollos */
.others{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:26px; }
.others a{ padding:10px 18px; border-radius:30px; border:1px solid var(--line-2); font-size:.82rem; color:var(--text-muted); transition:border-color .3s, color .3s; }
.others a:hover{ border-color:var(--c-gold); color:var(--text); }

/* footer */
.lp-foot{ padding:56px 0 40px; border-top:1px solid rgba(255,255,255,.06); text-align:center; }
.lp-foot img{ height:40px; width:auto; margin:0 auto 16px; opacity:.9; }
.lp-foot p{ font-size:.8rem; color:var(--text-faint); margin:4px 0; }
.lp-foot a{ color:var(--text-muted); }
.lp-foot a:hover{ color:var(--c-gold); }

/* flotantes */
.wsp-float{
  position:fixed; right:22px; bottom:22px; z-index:800; width:58px; height:58px; border-radius:50%;
  background:var(--c-wsp); display:flex; align-items:center; justify-content:center; box-shadow:0 12px 30px -8px rgba(34,195,94,.65);
  transition:transform .3s var(--ease);
}
.wsp-float:hover{ transform:scale(1.08); }
.wsp-float svg{ width:28px; height:28px; fill:#fff; }
.sticky-cta{ display:none; }

/* ---------------- responsive ---------------- */
@media (max-width:1080px){
  .lp-links, .lp-nav-cta{ display:none; }
  .lp-burger{ display:flex; }
  .lp-mobile{
    display:flex; flex-direction:column; gap:4px; position:fixed; top:calc(var(--nav-h) + 3px); left:0; right:0; z-index:999;
    background:rgba(10,10,11,.97); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); padding:10px 16px 22px; border-bottom:1px solid var(--line);
    transform:translateY(-12px); opacity:0; visibility:hidden; transition:opacity .3s, transform .3s var(--ease), visibility .3s;
  }
  .lp-mobile a{ padding:14px 4px; border-bottom:1px solid var(--line); font-weight:600; color:var(--text-muted); }
  .lp-mobile a.gold{ color:var(--c-gold); }
  .lp-mobile .btn{ margin-top:14px; border-bottom:none; color:var(--dark-text); padding:14px; }
  .lp-nav.open + .lp-mobile{ opacity:1; visibility:visible; transform:none; }
}
@media (max-width:980px){
  .hero.hero-split{ flex-direction:column; align-items:stretch; justify-content:flex-end; padding-top:0; }
  .hero-split .hero-bg{ position:relative; width:auto; height:58svh; margin:0 0 -90px; }
  .hero-split .hero-bg::after{ background:linear-gradient(0deg,var(--ink) 0%,rgba(10,10,11,.5) 35%,rgba(10,10,11,0) 70%); }
  .hero-split > .container > *{ max-width:none; }
  .split, .ubic, .contact, .spec-grid{ grid-template-columns:1fr; gap:36px; }
  .hero-stats{ grid-template-columns:1fr 1fr; }
  .sec{ padding:80px 0; }
}
@media (max-width:640px){
  :root{ --nav-h:64px; }
  .lp-brand-dahir img{ height:26px; }
  .lp-brand-sep{ height:24px; }
  .lp-brand-name{ font-size:.95rem; }
  .lp-brand-name small{ display:none; }
  .hero{ padding-bottom:40px; }
  .hero-sub{ font-size:1rem; }
  .hero-actions .btn{ flex:1 1 100%; }
  .hero-stats{ gap:16px 12px; }
  .sec{ padding:64px 0; }
  .spec-col, .obra, .form{ padding:26px 20px; }
  .facts{ grid-template-columns:1fr; }
  .gal-ctrl{ display:none; }
  .sticky-cta{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:800; gap:8px; padding:10px 12px calc(10px + env(safe-area-inset-bottom));
    background:rgba(10,10,11,.94); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-top:1px solid var(--line);
  }
  .sticky-cta .btn{ flex:1; padding:12px 8px; font-size:.78rem; }
  .wsp-float{ display:none; }
  body{ padding-bottom:74px; }
}

/* eyebrow siempre igual aunque esté dentro de bloques con estilos de párrafo */
.sec-head p.eyebrow, .split-text p.eyebrow, .obra p.eyebrow, .contact p.eyebrow, .ubic p.eyebrow{
  font-size:.72rem; color:var(--c-gold); margin:0 0 1em;
}
.sec-head.center p.eyebrow::before{ display:none; }
.sec-head.center p.eyebrow{ gap:0; }

/* =====================================================================
   COMPONENTES EXTRA (v2) — usados por las distintas landings
   ===================================================================== */

/* hero con video de fondo / logo del desarrollo */
.hero-bg video{ width:100%; height:100%; object-fit:cover; display:block; }
.hero-logo{ height:64px; width:auto; margin-bottom:22px; filter:drop-shadow(0 4px 18px rgba(0,0,0,.5)); }

/* franja de cifras */
.stats-band{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.stat{ background:var(--ink-3); padding:26px 22px; }
.sec-alt .stat{ background:var(--ink); }
.stat b{ display:block; font-family:var(--font-display); font-weight:520; font-size:clamp(1.6rem,3vw,2.3rem); color:var(--c-gold); line-height:1.05; }
.stat span{ display:block; margin-top:8px; font-size:.84rem; color:var(--text-muted); }

/* tarjetas (beneficios, modalidades, equipamiento, materialidad) */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.cards.cols-2{ grid-template-columns:repeat(2,1fr); }
.cards.cols-4{ grid-template-columns:repeat(4,1fr); }
.card{ background:var(--ink-3); border:1px solid var(--line); border-radius:18px; padding:28px 26px; transition:border-color .35s, transform .35s var(--ease); }
.sec-alt .card{ background:var(--ink); }
.card:hover{ border-color:rgba(195,155,83,.4); transform:translateY(-4px); }
.card-num{ display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:42px; padding:0 12px; border-radius:21px; background:var(--c-gold-soft); color:var(--c-gold); font-weight:800; font-size:.8rem; letter-spacing:.06em; margin-bottom:16px; }
.card h3{ font-size:1.18rem; margin-bottom:8px; }
.card p{ color:var(--text-muted); font-size:.92rem; }
.card ul.check-list{ margin-top:12px; }
.card-tag{ display:block; font-size:.68rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--text-faint); margin-bottom:6px; }

/* precios destacados (ej. lotes) */
.prices{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.price{ background:var(--ink-3); border:1px solid var(--line); border-radius:20px; padding:30px 26px; text-align:center; }
.sec-alt .price{ background:var(--ink); }
.price.featured{ border-color:rgba(195,155,83,.55); box-shadow:0 30px 60px -40px rgba(195,155,83,.5); }
.price-tag{ display:inline-block; background:var(--c-gold-soft); color:var(--c-gold); font-size:.66rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; padding:5px 12px; border-radius:20px; margin-bottom:14px; }
.price h3{ font-size:1.08rem; margin-bottom:10px; }
.price-num{ font-family:var(--font-display); font-size:2.4rem; line-height:1.05; }
.price-num small{ font-family:var(--font-body); font-size:.85rem; color:var(--text-faint); }
.price p{ margin-top:10px; font-size:.86rem; color:var(--text-muted); }
.cta-box{ margin-top:36px; text-align:center; padding:30px; background:var(--ink-3); border:1px solid rgba(195,155,83,.28); border-radius:20px; }
.sec-alt .cta-box{ background:var(--ink); }
.cta-box p{ color:var(--text-muted); margin-bottom:18px; }
.btns{ display:flex; gap:12px; flex-wrap:wrap; justify-content:center; }
.btns.left{ justify-content:flex-start; margin-top:24px; }

/* lista clave-valor (datos del activo, programa por piso) */
.kv{ border:1px solid var(--line); border-radius:16px; overflow:hidden; }
.kv-row{ display:flex; justify-content:space-between; gap:18px; padding:15px 20px; background:var(--ink-3); border-bottom:1px solid var(--line); font-size:.93rem; }
.sec-alt .kv-row{ background:var(--ink); }
.kv-row:last-child{ border-bottom:none; }
.kv-row span:first-child{ color:var(--text-faint); }
.kv-row span:last-child{ text-align:right; color:var(--text); font-weight:600; }
.kv-row span.pending{ color:var(--c-salmon); }
.kv-title{ display:flex; align-items:center; gap:10px; margin-bottom:6px; font-size:1.3rem; }
.badge{ display:inline-block; font-family:var(--font-body); font-size:.64rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; padding:4px 10px; border-radius:20px; background:var(--c-gold-soft); color:var(--c-gold); }
.badge.warn{ background:rgba(243,122,110,.14); color:var(--c-salmon); }
.fineprint{ font-size:.8rem; color:var(--text-faint); margin-top:22px; }

/* mosaico de imágenes con leyenda (tipologías, amenities, obra real) */
.tiles{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.tiles.cols-2{ grid-template-columns:repeat(2,1fr); }
.tile{ border-radius:18px; overflow:hidden; background:var(--ink-3); border:1px solid var(--line); margin:0; }
.sec-alt .tile{ background:var(--ink); }
.tile img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
.tile.contain img{ object-fit:contain; background:#f4f2ea; padding:10px; cursor:zoom-in; }
.tile-cap{ padding:14px 18px; }
.tile-cap b{ display:block; font-family:var(--font-display); font-weight:520; font-size:1.1rem; }
.tile-cap span{ font-size:.84rem; color:var(--text-muted); }

/* pestañas (planos por piso, recorrido 360) */
.tabs-nav{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:22px; }
.tabs-nav button{ padding:10px 18px; border-radius:30px; border:1px solid var(--line-2); font-size:.82rem; font-weight:600; color:var(--text-muted); transition:color .3s, border-color .3s, background .3s; }
.tabs-nav button:hover{ color:var(--text); border-color:var(--c-gold); }
.tabs-nav button.active{ background:var(--text); color:var(--dark-text); border-color:var(--text); }
html.lp-js .tab-pane{ display:none; }
html.lp-js .tab-pane.active{ display:block; }
.tab-pane{ margin-bottom:18px; }
.plan{ background:#f4f2ea; border-radius:18px; padding:14px; }
.plan img{ width:100%; max-height:78vh; object-fit:contain; cursor:zoom-in; }
.embed{ position:relative; border-radius:18px; overflow:hidden; aspect-ratio:16/9; background:var(--ink-3); border:1px solid var(--line); }
.embed iframe, .embed video{ position:absolute; inset:0; width:100%; height:100%; border:0; object-fit:cover; }
.split-media video{ width:100%; height:100%; object-fit:cover; display:block; }

/* documentos */
.docs{ display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:12px; }
.doc{ display:flex; align-items:center; gap:14px; padding:16px 18px; border-radius:14px; background:var(--ink-3); border:1px solid var(--line); transition:border-color .3s, transform .3s var(--ease); }
.sec-alt .doc{ background:var(--ink); }
.doc:hover{ border-color:rgba(195,155,83,.45); transform:translateY(-2px); }
.doc-ico{ flex:none; width:44px; height:44px; border-radius:10px; background:var(--c-gold-soft); color:var(--c-gold); display:flex; align-items:center; justify-content:center; font-size:.66rem; font-weight:800; letter-spacing:.06em; }
.doc b{ display:block; font-size:.9rem; font-weight:600; line-height:1.3; }
.doc span{ display:block; font-size:.76rem; color:var(--text-faint); margin-top:2px; }

/* preguntas frecuentes */
.faq{ max-width:780px; margin:0 auto; border:1px solid var(--line); border-radius:18px; overflow:hidden; }
.faq details{ background:var(--ink-3); border-bottom:1px solid var(--line); }
.sec-alt .faq details{ background:var(--ink); }
.faq details:last-child{ border-bottom:none; }
.faq summary{ list-style:none; cursor:pointer; padding:20px 24px; font-weight:600; display:flex; justify-content:space-between; gap:16px; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; color:var(--c-gold); font-size:1.3rem; line-height:1; transition:transform .3s var(--ease); }
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq details p{ padding:0 24px 20px; color:var(--text-muted); font-size:.93rem; }

/* texto largo (marco legal, jurídico) */
.prose{ max-width:760px; }
.prose p{ color:var(--text-muted); margin-bottom:14px; }
.prose.center{ margin:0 auto; text-align:center; }

/* lightbox */
.lp-lightbox{ position:fixed; inset:0; z-index:5000; background:rgba(6,6,7,.94); display:none; align-items:center; justify-content:center; padding:24px; cursor:zoom-out; }
.lp-lightbox.open{ display:flex; }
.lp-lightbox img{ max-width:100%; max-height:100%; object-fit:contain; border-radius:10px; background:#f4f2ea; }
.lp-lightbox button{ position:absolute; top:16px; right:16px; width:46px; height:46px; border-radius:50%; background:rgba(255,255,255,.12); font-size:1.4rem; }

/* botón de idioma (espejo del WhatsApp) */
.lang-toggle{ position:fixed; left:22px; bottom:22px; z-index:800; display:flex; align-items:center; gap:8px; padding:12px 16px; border-radius:30px; background:rgba(10,10,11,.85); border:1px solid var(--line-2); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); font-weight:700; font-size:.8rem; letter-spacing:.06em; }
.lang-toggle svg{ width:16px; height:16px; }
.lang-toggle:hover{ border-color:var(--c-gold); }

@media (max-width:980px){
  .cards, .cards.cols-4{ grid-template-columns:1fr 1fr; }
  .prices, .tiles{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .cards, .cards.cols-2, .cards.cols-4, .prices, .tiles, .tiles.cols-2{ grid-template-columns:1fr; }
  .lang-toggle{ bottom:84px; left:12px; padding:10px 14px; }
  .kv-row{ flex-direction:column; gap:2px; }
  .kv-row span:last-child{ text-align:left; }
  .hero-logo{ height:48px; }
}

/* dorado metálico: texto con degradado en los acentos grandes */
.hero h1 em, .obra-pct, .stat b, .unit-price, .price-num, .card-num{
  background:var(--gold-grad); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.card-num{ background:var(--gold-grad); -webkit-background-clip:text; background-clip:text; box-shadow:inset 0 0 0 1px rgba(195,155,83,.45); }
.eyebrow::before{ background:var(--gold-grad); }
.btn-solid:hover{ background:var(--gold-grad); }

/* carrusel de fotos dentro de "El proyecto" (flechas + pasa solo) */
.carousel{ position:relative; width:100%; height:100%; overflow:hidden; border-radius:var(--radius); background:var(--ink-3); }
.carousel .slide{ margin:0; }
html.lp-js .carousel .slide{ position:absolute; inset:0; opacity:0; transition:opacity .9s var(--ease); }
html.lp-js .carousel .slide.is-active{ opacity:1; }
html:not(.lp-js) .carousel .slide + .slide{ display:none; }
.carousel .slide img{ width:100%; height:100%; object-fit:cover; }
.carousel .slide figcaption{ position:absolute; left:14px; bottom:14px; background:rgba(10,10,11,.72); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); padding:7px 12px; border-radius:20px; font-size:.78rem; }
.carousel-btn{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:rgba(10,10,11,.62); border:1px solid rgba(255,255,255,.22); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); transition:background .3s, border-color .3s; }
.carousel-btn:hover{ background:rgba(10,10,11,.85); border-color:var(--c-gold); }
.carousel-btn svg{ width:18px; height:18px; }
.carousel-btn.prev{ left:12px; } .carousel-btn.next{ right:12px; }
.carousel-dots{ position:absolute; right:14px; bottom:16px; z-index:3; display:flex; gap:6px; }
.carousel-dots button{ width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.4); padding:0; transition:width .3s, background .3s; }
.carousel-dots button.on{ width:22px; border-radius:6px; background:var(--gold-grad); }
html:not(.lp-js) .carousel-btn, html:not(.lp-js) .carousel-dots{ display:none; }
.split-media.has-carousel{ aspect-ratio:4/3.4; }
/* avance de obra con fotos debajo de la barra */
.obra + .gal{ margin-top:34px; }
