/* ============================================================
   NIVEL NOVA — Landing promoción Parla
   Tipografías: Cormorant Garamond (titulares) + Montserrat (UI)
   ============================================================ */

/* ---------- 1. Tokens ---------- */
:root{
  /* Color — paleta de marca
     Azul  #162A31  ·  Marrón  #A07E65
     Los sufijos -rgb son los mismos colores en canales sueltos, para poder
     usarlos con transparencia: rgb(var(--navy-rgb) / .8). Cambiando estas
     líneas se recolorea toda la landing. */
  --navy:            #162A31;   --navy-rgb:        22 42 49;
  --navy-deep:       #0E1C21;   --navy-deep-rgb:   14 28 33;
  --navy-mid:        #2C525F;   --navy-mid-rgb:    44 82 95;
  --navy-bottom:     #1B333B;
  --ink:             #162A31;   --ink-rgb:         22 42 49;
  --brown:           #A07E65;
  --brown-dark:      #846551;
  --brown-soft:      #B59880;
  --cream:           #F6F4F0;
  --cream-2:         #EDEBE7;
  --white:           #FFFFFF;
  --body:            #5A6672;
  --line:            #E2DED6;

  /* Alias heredados: el CSS se escribió con nombres "gold". Se mantienen para
     no tocar 40 reglas, pero apuntan ya al marrón de marca. */
  --gold:            var(--brown);
  --gold-dark:       var(--brown-dark);
  --gold-soft:       var(--brown-soft);

  /* Tipografía */
  --serif:  'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sans:   'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --script: 'Sacramento', 'Brush Script MT', cursive;

  /* Layout */
  --maxw: 1264px;
  /* Margen exterior de página. Se calcula sobre el viewport (no sobre el
     bloque contenedor), por eso funciona igual dentro de una columna de grid.
     --sbw lo fija main.js con el ancho real de la barra de scroll. */
  --edge: max(24px, calc((100vw - var(--sbw, 0px) - var(--maxw)) / 2));
  --radius: 4px;
  --header-h: 84px;
}

/* ---------- 2. Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ overflow-x:clip; -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:var(--header-h); }
body{
  margin:0;
  font-family:var(--sans);
  font-size:15px;
  font-weight:400;
  line-height:1.85;
  color:var(--body);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{ display:block; max-width:100%; }
img{ height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p{ margin:0; }
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

/* ---------- 3. Utilidades ---------- */
.wrap{ width:min(100% - 48px, var(--maxw)); margin-inline:auto; }
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.sprite{ display:none; }

.eyebrow{
  font-family:var(--sans);
  font-size:11.5px; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold);
  margin-bottom:14px;
}
.eyebrow--light{ color:var(--gold-soft); }

.h2{
  font-family:var(--serif);
  font-size:clamp(2rem, 3.2vw, 2.75rem);
  font-weight:500; line-height:1.14; letter-spacing:.005em;
  color:var(--ink);
}
.h2--light{ color:#fff; }

.lead{ max-width:46ch; margin-top:20px; font-size:14.5px; line-height:1.95; }
.lead--light{ color:rgba(255,255,255,.82); }

.script{ font-family:var(--script); font-weight:400; line-height:1.15; }

/* Botón */
.btn{
  display:inline-flex; align-items:center; gap:12px;
  padding:15px 26px;
  background:var(--gold); color:#fff;
  font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  border-radius:var(--radius);
  transition:background .25s ease, transform .25s ease;
}
.btn:hover{ background:var(--gold-dark); }
.btn:active{ transform:translateY(1px); }
.btn .ico{ width:15px; height:15px; flex:none; transition:transform .25s ease; }
.btn:hover .ico{ transform:translateX(4px); }
.btn--block{ width:100%; justify-content:center; padding:17px 26px; font-size:12.5px; }
.btn--sm{ padding:12px 20px; font-size:11px; }

/* Iconos */
.ico{ width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.4;
      stroke-linecap:round; stroke-linejoin:round; }

/* ---------- 4. Header ---------- */
.header{
  position:sticky; top:0; z-index:60;
  background:var(--cream);
  border-bottom:1px solid rgb(var(--ink-rgb) / .08);
}
.header__inner{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  min-height:var(--header-h);
}
.header__nav{ display:flex; align-items:center; gap:30px; }
.header__nav a{
  font-size:11.5px; font-weight:500; letter-spacing:.11em; text-transform:uppercase;
  color:var(--ink); padding:6px 0; position:relative;
}
.header__nav .btn{ display:none; }
.header__nav a:not(.btn)::after{
  content:''; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:var(--gold); transition:right .3s ease;
}
.header__nav a:not(.btn):hover::after{ right:0; }
.header__cta{ flex:none; }

/* Logo */
.logo{ display:block; flex:none; line-height:0; }
.logo svg{ display:block; width:152px; height:auto; aspect-ratio:6040 / 1892; }
.logo--hero svg{ width:228px; }
.logo--footer svg{ width:164px; }

/* Versión en negativo: el símbolo lee estas dos variables */
.logo--light{ --logo-ink:#fff; --logo-accent:var(--brown-soft); }

/* Menú móvil */
.burger{ display:none; width:40px; height:40px; padding:9px; color:var(--ink); }
.burger span{ display:block; height:1.5px; background:currentColor; margin:5px 0; transition:.3s; }
.nav-open .burger span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.nav-open .burger span:nth-child(2){ opacity:0; }
.nav-open .burger span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

/* ---------- 5. Hero ---------- */
.hero{ position:relative; isolation:isolate; color:#fff; }
.hero__media{ position:absolute; inset:0; z-index:-2; }
.hero__media img{ width:100%; height:100%; object-fit:cover; object-position:60% 55%; }
.hero__media::after{
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(100deg, var(--navy-deep) 0%, rgb(var(--navy-rgb) / .94) 28%, rgb(var(--navy-mid-rgb) / .62) 52%, rgb(var(--navy-mid-rgb) / .12) 78%, rgb(var(--navy-mid-rgb) / 0) 100%),
    linear-gradient(180deg, rgb(var(--navy-deep-rgb) / .35) 0%, rgb(var(--navy-deep-rgb) / 0) 40%);
}
.hero__inner{
  padding:72px 0 80px;
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,400px);
  gap:56px; align-items:center;
}
.hero__content{ max-width:600px; }

/* Formulario compacto sobre el hero */
.hero__panel{
  background:rgb(var(--navy-deep-rgb) / .82);
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.14);
  border-radius:5px;
  padding:30px 28px 28px;
  box-shadow:0 18px 50px rgb(var(--navy-deep-rgb) / .45);
}
.hero__panel-title{
  font-family:var(--sans); font-size:17px; font-weight:600; line-height:1.4; color:#fff;
}
.hero__panel-text{
  font-size:13px; line-height:1.6; color:rgba(255,255,255,.72); margin:8px 0 20px;
}
.hero__form{ display:grid; gap:12px; }
.hero__form .field input{ height:50px; }
.hero__form .consent{ margin:4px 0 2px; }
.hero__form .btn{ margin-top:4px; }
.hero .logo{ margin-bottom:26px; }
.hero__title{
  font-family:var(--serif);
  font-size:clamp(2.6rem, 5.1vw, 4rem);
  font-weight:500; line-height:1.08; letter-spacing:.005em;
  margin-bottom:22px; text-wrap:balance;
}
.hero__claim{ font-size:clamp(1rem,1.55vw,1.25rem); font-weight:400; line-height:1.5; margin-bottom:18px; }
.hero__text{ max-width:61ch; color:rgba(255,255,255,.82); font-size:14px; line-height:1.9; margin-bottom:34px; }

/* ---------- 6. Barra de iconos ---------- */
.features{ background:var(--cream); padding:38px 0 36px; }
.features__grid{
  display:grid; grid-template-columns:repeat(5,1fr); gap:28px 16px;
}
.feature{ text-align:center; color:var(--ink); }
.feature__ico{ width:34px; height:34px; margin:0 auto 14px; color:var(--gold); }
.feature__ico .ico{ stroke-width:1.2; }
.feature__label{
  font-size:11.5px; font-weight:600; letter-spacing:.055em; line-height:1.55;
  text-transform:uppercase;
}

/* ---------- 7. Split genérico ---------- */
.split{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:stretch;
}
.split__media{ position:relative; min-height:420px; }
.split__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.split__body{ display:flex; flex-direction:column; justify-content:center; padding:74px 0; }

/* Proyecto: imagen izq. a sangre, texto der. */
.project{ background:var(--cream-2); grid-template-columns:minmax(0,47.6%) minmax(0,1fr); }
.project .split__media{ min-height:470px; }
.project .split__body{ padding-inline:64px var(--edge); position:relative; }
.project__signature{
  position:absolute; right:calc(var(--edge) + 8px); bottom:96px;
  font-size:34px; color:var(--ink); opacity:.75; transform:rotate(-6deg);
  text-align:center; pointer-events:none;
}

/* Zonas comunes: navy izq., imagen der. a sangre */
.commons{
  position:relative; isolation:isolate; overflow:hidden;
  background:var(--navy); color:#fff;
  padding:80px var(--edge);
}
.commons__bg{
  position:absolute; top:0; left:31%; width:69%; height:100%;
  object-fit:cover; object-position:center; z-index:-1;
  -webkit-mask-image:linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.28) 12%, rgba(0,0,0,.78) 30%, #000 46%);
          mask-image:linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.28) 12%, rgba(0,0,0,.78) 30%, #000 46%);
}
.commons__body{ max-width:490px; }
.commons__list{ display:flex; gap:52px; margin-top:38px; flex-wrap:wrap; }
.commons__item{ text-align:center; }
.commons__item .icobox{ width:34px; height:34px; margin:0 auto 10px; color:var(--gold-soft); }
.commons__item span{
  display:block; font-size:11px; font-weight:600; letter-spacing:.11em; text-transform:uppercase;
}

/* ---------- 8. Las viviendas ---------- */
.homes{ background:var(--white); padding:78px 0 70px; }
.homes__top{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.7fr); gap:56px; }
.homes__intro{ display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.homes__intro .btn{ margin-top:30px; }
.homes__gallery{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.homes__gallery figure{ margin:0; aspect-ratio:4/3; overflow:hidden; border-radius:3px; background:var(--cream-2); }
.homes__gallery img{ width:100%; height:100%; object-fit:cover; }
.homes__specs{
  display:grid; grid-template-columns:repeat(5,1fr); gap:20px;
  margin-top:36px; padding-left:0;
}
.homes__specs .feature__ico{ color:var(--ink); width:30px; height:30px; margin-bottom:10px; }
.homes__specs .feature__label{ font-size:10.5px; letter-spacing:.07em; }

/* ---------- 9. Confort / calidades ---------- */
/* El panel navy replica la geometría del bloque "Más espacio para todo lo que
   importa": mismo margen exterior, misma anchura de columna de texto y el mismo
   aire por la derecha, en lugar de un porcentaje fijo del viewport. */
.quality{
  background:var(--cream-2);
  grid-template-columns: calc(var(--edge) + var(--maxw) * 0.346 + 72px) minmax(0,1fr);
}
.quality__panel{
  background:var(--navy); color:#fff;
  display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
  padding:74px 72px 74px var(--edge);
}
.quality__title{
  font-family:var(--sans); font-size:clamp(1.4rem,2.1vw,1.85rem); font-weight:600;
  line-height:1.28; letter-spacing:.01em; text-transform:uppercase; color:#fff;
}
.quality__panel .lead{ max-width:34ch; }
.quality__panel .btn{ margin-top:30px; }
.quality__grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px;
  align-content:center; padding:74px var(--edge) 74px 72px;
}
.quality__grid .feature__ico{ width:46px; height:46px; color:var(--ink); margin-bottom:20px; }
.quality__grid .feature__label{ font-size:12.5px; letter-spacing:.045em; }

/* ---------- 10. Ubicación ---------- */
.location{ background:var(--cream); }
.location__grid{
  display:grid; grid-template-columns:minmax(0,40.5%) minmax(0,23.5%) minmax(0,1fr);
  align-items:center; gap:0;
}
.location__body{ padding:74px 24px 74px var(--edge); }
.location__body .btn{ margin-top:28px; }
.location__list{ padding:74px 24px 74px 8px; display:grid; gap:4px; align-content:center; }
.location__row{
  display:grid; grid-template-columns:26px 1fr auto; align-items:center; gap:16px;
  padding:7px 0;
}
.location__row .icobox{ width:22px; height:22px; color:var(--ink); }
.location__row span{ font-size:13.5px; color:var(--body); }
.location__row b{ font-size:13.5px; font-weight:600; color:var(--ink); letter-spacing:.01em; }
.location__map{
  position:relative; align-self:stretch; min-height:340px;
  margin:46px 0; border-radius:3px 0 0 3px; overflow:hidden;
  background:var(--cream-2);
}
.location__map iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; filter:saturate(.85); }
.location__map .btn{ position:absolute; left:22px; bottom:22px; z-index:2; }

/* ---------- 11. Planos y tipologías ---------- */
.plans{ background:var(--cream); padding:20px 0 74px; }
.plans__grid{ display:grid; grid-template-columns:minmax(0,30%) minmax(0,1fr); gap:40px; align-items:center; }
.plans__grid > *,
.plans__carousel, .plans__viewport, .plans__track, .plan, .plan__img, .plan__info{ min-width:0; }
.plans__intro{ display:flex; flex-direction:column; align-items:flex-start; }
.plans__intro .btn{ margin-top:28px; }
.plans__carousel{ position:relative; padding:0 46px; }
.plans__viewport{ overflow:hidden; width:100%; }
.plans__track{ display:flex; transition:transform .5s cubic-bezier(.4,0,.2,1); }
.plan{
  flex:0 0 100%; display:grid; grid-template-columns:1.35fr 1fr; align-items:stretch;
}
.plan__img{ background:var(--cream-2); display:grid; place-items:center; padding:22px; min-height:300px; }
.plan__img img{ max-width:100%; max-height:272px; width:auto; object-fit:contain; mix-blend-mode:multiply; }
.plan__info{ background:var(--white); padding:34px 32px; display:flex; flex-direction:column; justify-content:center; }
.plan__info h3{ font-family:var(--sans); font-size:15px; font-weight:600; color:var(--ink); margin-bottom:14px; }
.plan__info p{ font-size:13.5px; line-height:1.75; color:var(--body); }
.plan__info .btn{ align-self:flex-start; margin-top:22px; }
.plans__nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:38px; height:38px; display:grid; place-items:center; color:#9AA3AC;
  transition:color .2s ease;
}
.plans__nav:hover{ color:var(--ink); }
.plans__nav .ico{ width:22px; height:22px; stroke-width:1.2; }
.plans__nav--prev{ left:0; }
.plans__nav--next{ right:0; }
.plans__dots{ display:flex; justify-content:center; gap:8px; margin-top:26px; }
.plans__dots button{
  flex:none; width:7px; height:7px; border-radius:50%; background:#D3CEC4; transition:background .25s ease;
}
.plans__dots button[aria-selected="true"]{ background:var(--ink); }

/* ---------- 12. CTA + formulario ---------- */
.contact{ display:grid; grid-template-columns:minmax(0,52.8%) minmax(0,1fr); }
.contact__media{ position:relative; isolation:isolate; display:flex; align-items:center; color:#fff; }
.contact__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.contact__media::after{
  content:''; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(75deg, rgb(var(--navy-deep-rgb) / .15) 0%, rgb(var(--navy-rgb) / .55) 45%, rgb(var(--navy-rgb) / .9) 100%);
}
.contact__overlay{ padding:80px 60px 80px 46%; }
.contact__kicker{
  font-size:clamp(1rem,1.5vw,1.2rem); font-weight:500; letter-spacing:.05em;
  text-transform:uppercase; margin-bottom:8px;
}
.contact__overlay .h2{ color:#fff; }
.contact__overlay .lead{ max-width:38ch; }

.contact__form{ background:var(--navy-deep); color:#fff; padding:64px var(--edge) 64px 56px; }
.contact__form h2{
  font-family:var(--sans); font-size:clamp(1.15rem,1.7vw,1.4rem); font-weight:600;
  line-height:1.4; color:#fff; margin-bottom:12px;
}
.contact__form > p{ font-size:13.5px; line-height:1.8; color:rgba(255,255,255,.72); max-width:52ch; margin-bottom:26px; }
.form__grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.field{ display:flex; flex-direction:column; }
.field--full{ grid-column:1 / -1; }
.field--stacked > label{
  font-size:10.5px; font-weight:500; letter-spacing:.02em;
  color:#8B959E; margin:0 0 -20px 14px; position:relative; z-index:1; pointer-events:none;
}
.field input,
.field select{
  width:100%; font-family:var(--sans); font-size:14px; color:var(--ink);
  background:#fff; border:1px solid #fff; border-radius:var(--radius);
  padding:14px 14px; height:52px;
  transition:box-shadow .2s ease;
}
.field--stacked input,
.field--stacked select{ padding-top:22px; height:66px; }
.field select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23162A31' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; background-size:16px;
  padding-right:40px;
}
.field input::placeholder{ color:#8B959E; }
.field input:focus, .field select:focus{ outline:none; box-shadow:0 0 0 2px var(--gold); }
.field input[aria-invalid="true"], .field select[aria-invalid="true"]{ box-shadow:0 0 0 2px #E06A5A; }

.hp{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }

.consent{ grid-column:1 / -1; display:flex; align-items:flex-start; gap:11px; margin:8px 0 4px; }
.consent input{
  appearance:none; flex:none; width:17px; height:17px; margin-top:2px;
  border:1px solid rgba(255,255,255,.55); border-radius:2px; background:transparent; cursor:pointer;
}
.consent input:checked{ background:var(--gold); border-color:var(--gold); }
.consent input:checked::after{
  content:''; display:block; width:5px; height:9px; margin:1px auto 0;
  border:solid #fff; border-width:0 1.6px 1.6px 0; transform:rotate(45deg);
}
.consent label{ font-size:11.5px; line-height:1.6; color:rgba(255,255,255,.78); }
.consent a{ text-decoration:underline; text-underline-offset:2px; }

.form__msg:empty{ display:none; }
.form__msg{ grid-column:1 / -1; font-size:12.5px; line-height:1.6; margin-top:4px; }
.form__msg[data-state="error"]{ color:#FFB3A7; }
.form__msg[data-state="ok"]{ color:#A8D5B5; }

/* ---------- 13. Footer ---------- */
.footer{ background:var(--cream); padding:56px 0 46px; }
.footer__grid{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:56px; align-items:start; }
.footer__tagline{ font-size:14px; line-height:1.9; color:var(--ink); max-width:38ch; }
.footer__social{ display:flex; gap:16px; margin-top:20px; }
.footer__social a{ width:22px; height:22px; color:var(--ink); transition:color .2s ease; }
.footer__social a:hover{ color:var(--gold); }
.footer__links{ display:flex; flex-wrap:wrap; gap:8px 20px; justify-content:flex-end; max-width:420px; }
.footer__links a{ font-size:13.5px; color:var(--ink); }
.footer__links a:hover{ color:var(--gold); }
.footer__legal{
  display:flex; flex-wrap:wrap; gap:8px 14px; justify-content:flex-end;
  margin-top:22px; font-size:11.5px; color:#8D939A;
}
.footer__legal span{ color:var(--line); }

.subfooter{ background:var(--navy-bottom); color:rgba(255,255,255,.9); padding:26px 0; }
.subfooter__inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.developer{ display:flex; align-items:center; gap:14px; }
.developer__label{ font-size:11px; letter-spacing:.03em; color:rgba(255,255,255,.6); }
.developer__mark{ width:26px; height:34px; color:#fff; }
.developer__name{ font-size:15px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.subfooter__claim{ font-size:26px; color:rgba(255,255,255,.9); transform:rotate(-4deg); }

/* ---------- 14. Responsive ---------- */
@media (max-width:1100px){
  .header__nav{ gap:20px; }
  .header__nav a{ font-size:10.5px; letter-spacing:.08em; }
  .homes__top{ grid-template-columns:minmax(0,1fr) minmax(0,1.4fr); gap:36px; }
}

@media (max-width:980px){
  :root{ --edge:24px; }

  /* Nav móvil */
  .burger{ display:block; }
  .header__cta{ display:none; }
  .header__nav .btn{ display:inline-flex; }
  .header__nav{
    position:fixed; inset:var(--header-h) 0 auto 0;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--navy); padding:8px 24px 28px;
    transform:translateY(-12px); opacity:0; visibility:hidden;
    transition:opacity .25s ease, transform .25s ease, visibility .25s;
    max-height:calc(100dvh - var(--header-h)); overflow:auto;
  }
  .nav-open .header__nav{ transform:none; opacity:1; visibility:visible; }
  .header__nav a{ color:#fff; padding:15px 0; border-bottom:1px solid rgba(255,255,255,.1); font-size:12px; }
  .header__nav .btn{ display:none; }
.header__nav a:not(.btn)::after{ display:none; }
  .header__nav .btn{ margin-top:20px; justify-content:center; }

  /* Hero */
  .hero__inner{ padding:56px 0 64px; grid-template-columns:1fr; gap:36px; }
  .hero__panel{ max-width:440px; }
  .hero__media img{ object-position:65% 50%; }
  .hero__media::after{
    background:linear-gradient(180deg, rgb(var(--navy-deep-rgb) / .9) 0%, rgb(var(--navy-rgb) / .86) 55%, rgb(var(--navy-rgb) / .9) 100%);
  }

  .features__grid{ grid-template-columns:repeat(2,1fr); gap:30px 12px; }

  /* Splits a una columna */
  .split{ grid-template-columns:1fr; }
  .split__media{ min-height:0; aspect-ratio:16/10; }
  .split__media img{ position:static; }
  .project .split__media{ min-height:0; }
  .project{ grid-template-columns:1fr; }
  .project .split__body{ padding:52px var(--edge); }
  .project__signature{ position:static; margin-top:26px; transform:none; text-align:left; }
  .commons{ padding:0; }
  .commons__bg{
    position:static; width:100%; height:auto; aspect-ratio:16/10;
    -webkit-mask-image:none; mask-image:none;
  }
  .commons__body{ max-width:none; padding:52px var(--edge); }
  .commons__list{ gap:32px; justify-content:flex-start; }

  .homes{ padding:56px 0; }
  .homes__top{ grid-template-columns:1fr; gap:30px; }
  .homes__gallery{ grid-template-columns:1fr 1fr; }
  .homes__gallery figure:last-child{ grid-column:1 / -1; aspect-ratio:16/9; }
  .homes__specs{ grid-template-columns:repeat(3,1fr); gap:26px 12px; }

  .quality{ display:flex; flex-direction:column; }
  .contact{ grid-template-columns:1fr; }
  .quality__panel{ padding:52px var(--edge); }
  .quality__grid{ grid-template-columns:repeat(2,1fr); padding:52px var(--edge); gap:36px 20px; }

  .location__grid{ grid-template-columns:1fr; }
  .location__body{ padding:52px var(--edge) 0; }
  .location__list{ padding:34px var(--edge); }
  .location__map{ margin:0 var(--edge) 52px; border-radius:3px; min-height:280px; }

  .plans{ padding:0 0 56px; }
  .plans__grid{ grid-template-columns:1fr; gap:30px; }
  .plans__carousel{ padding:0; }
  .plans__nav{ display:none; }
  .plan{ grid-template-columns:1fr; }

  .contact{ grid-template-columns:1fr; }
  .contact__media{ min-height:400px; }
  .contact__overlay{ padding:64px var(--edge); }
  .contact__media::after{ background:linear-gradient(180deg, rgb(var(--navy-deep-rgb) / .4) 0%, rgb(var(--navy-rgb) / .85) 100%); }
  .contact__form{ padding:52px var(--edge); }

  .footer__grid{ grid-template-columns:1fr; gap:32px; text-align:left; }
  .footer__links{ justify-content:flex-start; }
  .footer__legal{ justify-content:flex-start; }
  .subfooter__inner{ flex-direction:column; align-items:flex-start; gap:20px; }
}

@media (max-width:620px){
  .features__grid{ grid-template-columns:1fr 1fr; }
  .homes__gallery{ grid-template-columns:1fr; }
  .homes__gallery figure:last-child{ aspect-ratio:4/3; }
  .homes__specs{ grid-template-columns:1fr 1fr; }
  .quality__grid{ grid-template-columns:1fr; }
  .form__grid{ grid-template-columns:1fr; }
  .contact__overlay{ padding:52px var(--edge); }
  .subfooter__claim{ font-size:22px; }
  .btn{ padding:14px 20px; font-size:11px; }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
}

/* ---------- 15. Marcador de imagen pendiente (quitar en producción) ---------- */
.img-placeholder{
  position:absolute; inset:0; width:100%; height:100%; min-height:180px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; padding:20px; text-align:center;
  background:
    linear-gradient(135deg, #E7E3DB 0%, #D9D3C8 50%, #E7E3DB 100%);
  color:#8A8375;
}
.split__media .img-placeholder,
.contact__media .img-placeholder{ position:absolute; }
.homes__gallery .img-placeholder,
.plan__img .img-placeholder{ position:static; }
.plan__img .img-placeholder{ min-height:272px; background:#E7E3DB; }
.img-placeholder span{ font-size:12.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }
.img-placeholder code{ font-size:11px; letter-spacing:.02em; opacity:.75; }

/* Ajuste fino: en móvil el texto del hero fluye sin saltos forzados */
@media (max-width:980px){
  .hero__text br{ display:none; }
}
