/* =========================================================
   CASA IDILIO — styles.css v4  (Inter + Cinzel, sin eyebrows)
   ========================================================= */

/* ---------- TOKENS ---------- */
:root{
  --bordo:        #3D1A18;
  --terracota:    #C4845A;
  --dorado:       #A8935A;
  --marfil:       #F0E6D8;
  --crema:        #FAF5EF;
  --crema-osc:    #EDE3D2;   /* fondo de "La Casa" — beige levemente más oscuro */
  --texto-oscuro: #2A1210;
  --muted:        #7A5A4E;

  --serif:  'Cinzel', Georgia, serif;              /* titulares · CTAs · labels (all-caps) */
  --body:   'Cormorant Garamond', Georgia, serif;  /* body · descripciones · lists · footer info */
  --script: 'Great Vibes', 'Cedarville Cursive', cursive; /* acentos manuscritos dentro de titulares */

  --max: 1280px;
  --pad: 32px;
  --sec: 140px;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ---------- RESET ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--crema);
  color:var(--texto-oscuro);
  font-family:var(--body);
  font-size:27px;              /* body escalado otra vez */
  line-height:1.7;
  font-weight:400;
  letter-spacing:0;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
h1,h2,h3{ margin:0; font-family:var(--serif); font-weight:500; }

/* Acento manuscrito dentro de titulares (Great Vibes). Regla 80/20: úsese
   como palabra corta al lado de Cinzel uppercase, nunca en toda la frase. */
.script{
  font-family:var(--script);
  font-weight:400;
  font-style:normal;
  font-size:1.35em;              /* Great Vibes ópticamente se ve más chica */
  line-height:.9;                 /* absorbe sus ascenders altos */
  letter-spacing:0;
  text-transform:none;
  vertical-align:-.05em;
}
p{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }
::selection{ background:var(--terracota); color:var(--crema); }

.container{
  width:100%;
  max-width:var(--max);
  margin:0 auto;
  padding:0 var(--pad);
}

/* ----- fondos alternados ----- */
.sec--crema{  background:var(--crema);  }
.sec--marfil{ background:var(--marfil); }

/* ----- titulares (Cinzel — all-caps + tracking amplio para elegancia) ----- */
.h2{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(29px, 3.3vw, 35px);   /* +10% */
  line-height:1.25;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--bordo);
}
h3{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(22px, 2.2vw, 26px);   /* +10% */
  line-height:1.3;
  letter-spacing:0.05em;
  text-transform:uppercase;
}

/* ----- eyebrow (SMALL CAPS wide-tracked, arriba-izq del bloque) ----- */
.eyebrow{
  display:inline-block;
  font-family:var(--serif);
  font-size:11px;
  letter-spacing:0.24em;
  text-transform:uppercase;
  color:var(--muted);
  line-height:1;
  font-weight:500;
}

/* ---------- BOTONES BASE ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-family:var(--serif);
  font-weight:500;
  font-size:13px;
  letter-spacing:0.15em;
  text-transform:uppercase;
  line-height:1;
  padding:18px 36px;
  border-radius:60px;
  border:1px solid transparent;
  transition:background-color .3s ease, color .3s ease, border-color .3s ease;
  white-space:nowrap;
}
.btn--solid{
  background:var(--bordo);
  color:var(--marfil);
  border-color:var(--bordo);
}
.btn--solid:hover{ background:var(--terracota); border-color:var(--terracota); color:var(--crema); }

.btn--ghost-dark{
  border-color:var(--bordo);
  color:var(--bordo);
  background:transparent;
}
.btn--ghost-dark:hover{ background:var(--bordo); color:var(--marfil); }

/* =========================================================
   NAVBAR — oculto en HERO; aparece al pasar el hero
   ========================================================= */
.nav{
  position:fixed;
  inset:0 0 auto 0;
  z-index:100;
  padding:16px 0;
  background:var(--crema);
  box-shadow:0 1px 24px rgba(42,18,16,.06);
  transform:translateY(-100%);
  opacity:0;
  visibility:hidden;
  transition:transform .55s var(--ease), opacity .35s var(--ease), visibility .35s var(--ease);
}
.nav.is-stuck{
  transform:translateY(0);
  opacity:1;
  visibility:visible;
}
.nav.is-hidden{ pointer-events:none; }

.nav__inner{
  width:100%;
  max-width:var(--max);
  margin:0 auto;
  padding:0 var(--pad);
  display:flex;
  align-items:center;
  gap:24px;
}
.nav__logo{
  flex:0 0 auto;
  position:relative;
  display:flex;
  align-items:center;
  gap:14px;
  text-decoration:none;
}
.nav__logo-img{
  height:56px;
  width:auto;
  display:block;
}
.nav__logo-text{
  font-family:var(--serif);
  font-weight:600;
  font-size:20px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--bordo);
  line-height:1;
  white-space:nowrap;
}

.nav__links{
  flex:1 1 auto;
  display:flex;
  justify-content:center;
  gap:34px;
}
.nav__links a{
  font-family:var(--serif);
  font-weight:600;
  font-size:12px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--bordo);
  position:relative;
  padding-bottom:6px;
  transition:color .3s ease;
}
.nav__links a:hover{ color:var(--terracota); }
.nav__links a::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:100%; height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:right;
  transition:transform .5s var(--ease);
}
.nav__links a:hover::after{ transform:scaleX(1); transform-origin:left; }

/* CTA navbar — outline bordo (solidificado), fill bordo al hover */
.nav__cta{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--serif);
  font-weight:500;
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--bordo);
  background:transparent;
  border:1px solid var(--bordo);
  border-radius:60px;
  padding:14px 26px 14px 28px;
  transition:background-color .3s ease, color .3s ease, border-color .3s ease, transform .3s ease;
}
.nav__cta::after{
  content:"→";
  font-size:14px;
  line-height:1;
  transition:transform .3s ease;
  margin-left:2px;
}
.nav__cta:hover{
  background:var(--bordo);
  border-color:var(--bordo);
  color:var(--marfil);
  transform:translateY(-1px);
}
.nav__cta:hover::after{ transform:translateX(3px); }

/* burger */
.nav__burger{
  display:none;
  flex:0 0 auto;
  width:34px; height:24px;
  position:relative;
}
.nav__burger span{
  position:absolute; left:0;
  width:100%; height:1px;
  background:var(--bordo);
}
.nav__burger span:nth-child(1){ top:7px; }
.nav__burger span:nth-child(2){ top:16px; }

/* =========================================================
   DRAWER
   ========================================================= */
.drawer{
  position:fixed;
  inset:0;
  z-index:200;
  background:var(--crema);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  opacity:0;
  visibility:hidden;
  transition:opacity .5s var(--ease), visibility .5s var(--ease);
}
.drawer.is-open{ opacity:1; visibility:visible; }
.drawer__close{
  position:absolute;
  top:24px; right:24px;
  color:var(--bordo);
  padding:8px;
}
.drawer__links{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:24px;
  text-align:center;
}
.drawer__links a{
  font-family:var(--serif);
  font-weight:500;
  font-size:20px;
  color:var(--bordo);
  letter-spacing:0.14em;
  text-transform:uppercase;
}
.drawer__cta{
  margin-top:44px;
  font-family:var(--serif);
  font-size:12px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--bordo);
  border:1px solid var(--bordo);
  border-radius:40px;
  padding:16px 30px;
}

/* =========================================================
   1 · HERO
   ========================================================= */
.hero{
  position:relative;
  width:100%;
  height:100vh;
  min-height:620px;
  overflow:hidden;
  display:block;
}
.hero__bg{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  will-change:transform;
}
.hero__overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(30,15,13,.75) 0%, rgba(30,15,13,.85) 100%);
}

/* Título — abajo-izquierda */
.hero__main{
  position:absolute;
  bottom:120px;
  left:56px;
  max-width:1050px;
  z-index:2;
}
.hero__title{
  color:var(--marfil);
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(48px, 5.4vw, 72px);
  line-height:1.15;
  letter-spacing:0.04em;
}
.hero__title .word{ display:inline-block; overflow:hidden; vertical-align:top; }
.hero__title .word i{ display:inline-block; font-style:normal; }
.hero__title-alt{ display:inline-block; font-style:italic; }
.hero__title .hero__title-alt .word i{ font-style:italic; }

/* Separador decorativo dorado (línea continua + diamante en el medio) */
.hero-separator{
  position:relative;
  width:120px;
  height:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:32px 0;
}
.hero-separator .line{
  width:100%;
  height:1px;
  background-color:#A8935A;
}
.hero-separator .diamond{
  position:absolute;
  width:8px;
  height:8px;
  background-color:#A8935A;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%) rotate(45deg);
}

/* Descripción + CTA — ARRIBA-derecha */
.hero__aside{
  position:absolute;
  top:140px;
  right:56px;
  max-width:380px;
  text-align:right;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:24px;
}
.hero__lead{
  font-family:var(--body);
  color:var(--marfil);
  font-size:26px;
  font-weight:400;
  line-height:1.55;
  text-shadow:0 1px 18px rgba(42,18,16,.35);
}

/* CTA hero — pill sólido marfil → bordo */
.hero__cta{
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-family:var(--serif);
  font-weight:500;
  font-size:14px;
  letter-spacing:0.15em;
  text-transform:uppercase;
  color:var(--bordo);
  background:var(--marfil);
  padding:22px 40px;
  border-radius:60px;
  transition:background-color .3s ease, color .3s ease;
  white-space:nowrap;
}
.hero__cta:hover{ background:var(--bordo); color:var(--marfil); }
.hero__cta-arrow{ font-size:16px; line-height:1; margin-left:0; transition:transform .3s ease; }
.hero__cta:hover .hero__cta-arrow{ transform:translateX(4px); }

/* =========================================================
   BLOQUE COMÚN
   ========================================================= */
section[class*="sec--"]{ padding:var(--sec) 0; }

/* =========================================================
   2 · HISTORIA  (crema)
   ========================================================= */
.historia__grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  gap:60px 40px;
  align-items:start;
}
.historia__col--left{
  grid-column:1 / span 5;
  display:flex;
  flex-direction:column;
  gap:44px;
}
.historia__media{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.historia__ph{ margin:0; }
.historia__ph img{
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  border-radius:2px;
}
.historia{
  padding:170px 0 200px;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.24 0 0 0 0 0.10 0 0 0 0 0.09 0 0 0 0.08 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
  background-repeat:repeat;
  background-size:200px 200px;
}
@media (max-width:768px){
  .historia{ background-size:300px 300px; }
}
.historia__text{
  grid-column:7 / span 6;
  padding-top:8px;
  max-width:560px;
}
.historia__text .h2{ margin-bottom:28px; }
.historia__text p{
  font-family:var(--body);
  font-size:23px;
  font-weight:400;
  line-height:1.7;
  color:var(--texto-oscuro);
}
.historia__text p + p{ margin-top:16px; }

/* =========================================================
   3 · LA CASA  (crema-osc, full-bleed derecho)
   ========================================================= */
.lacasa{
  background:var(--crema-osc);
  padding:0;
  overflow:hidden;
}
.lacasa__grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  gap:0;
  align-items:stretch;
  min-height:640px;
}
.lacasa__text{
  grid-column:1 / span 5;
  display:flex;
  flex-direction:column;
  justify-content:space-between;   /* eyebrow arriba, cuerpo abajo (Lucomoria) */
  gap:0;
  padding:80px 60px 60px 40px;     /* menos padding-bottom → body baja */
}
.lacasa__eyebrow{ color:var(--muted); margin-bottom:0; }
.lacasa__body{
  margin-top:auto;              /* pin al piso dentro de .lacasa__text */
  max-width:480px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;       /* evita que el CTA (u otros hijos) se estiren */
}
.lacasa__body > * + *{ margin-top:12px; }   /* subtítulo más pegado al titular */
.lacasa__body .lacasa__cta{ margin-top:28px; } /* CTA sí con más aire */
.lacasa__body .h2,
.lacasa__h2{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(26px, 2.86vw, 37px);   /* +10% */
  line-height:1.2;
  letter-spacing:0.05em;
  text-transform:uppercase;
  color:var(--bordo);
  margin-bottom:0;
}
.lacasa__body p{
  font-family:var(--body);
  font-size:24px;
  font-weight:400;
  line-height:1.65;
  color:var(--texto-oscuro);
  margin-top:24px;
}

/* CTA "Ver espacios" — text link mayúscula con arrow (sin pill) */
.lacasa__cta{
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-top:12px;
  align-self:flex-start;
  font-family:var(--serif);
  font-weight:500;
  font-size:12px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--bordo);
  background:transparent;
  border:0;
  padding:0;
  transition:color .3s ease;
}
.lacasa__cta:hover{ color:var(--terracota); }
.lacasa__cta-arrow{ font-size:14px; line-height:1; transition:transform .3s ease; }
.lacasa__cta:hover .lacasa__cta-arrow{ transform:translateX(4px); }

/* Features minimal debajo del CTA: PET FRIENDLY · +200 M² · BAÑOS ACCESIBLES */
.lacasa__features{
  margin-top:32px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px 18px;
  font-family:var(--serif);
  font-weight:500;
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--dorado);
}
.lacasa__features li{ display:inline-flex; align-items:center; gap:18px; }
.lacasa__features li:not(:last-child)::after{
  content:"·";
  color:var(--dorado);
  opacity:.6;
  margin-left:6px;
  font-size:14px;
}

.lacasa__carousel{
  grid-column:6 / span 7;
  position:relative;
  display:flex;
  align-items:center;
  padding:60px 80px 60px 40px;
}

/* Firulete decorativo — detalle UI del manual de marca, en 2 esquinas opuestas */
.firulete{
  position:absolute;
  width:80px;
  height:auto;
  opacity:.85;
  pointer-events:none;
  z-index:2;
  user-select:none;
}
.firulete--tl{
  top:32px;
  left:16px;
}
.firulete--br{
  bottom:32px;
  right:56px;
  transform:rotate(180deg);
}
@media (max-width:768px){
  .firulete{ width:52px; }
  .firulete--tl{ display:none; }
  .firulete--br{ bottom:68px; right:28px; }
}

/* carrusel fade */
.car{
  position:relative;
  width:100%;
  aspect-ratio:4/3;
  background:var(--marfil);
}
.car__track{ position:absolute; inset:0; overflow:hidden; }
.car__slide{
  position:absolute; inset:0;
  opacity:0;
  transition:opacity .5s ease-out;
  pointer-events:none;
}
.car__slide.is-active{ opacity:1; pointer-events:auto; }
.car__slide img{ width:100%; height:100%; object-fit:cover; }

/* gradient shadow para el contador */
.car__shade{
  position:absolute; left:0; right:0; bottom:0;
  height:22%;
  background:linear-gradient(0deg, rgba(0,0,0,.32) 0%, transparent 100%);
  pointer-events:none;
}
.car__count{
  position:absolute;
  left:24px; bottom:24px;
  font-family:var(--serif);
  font-weight:500;
  font-size:14px;
  letter-spacing:0.14em;
  color:var(--marfil);
  pointer-events:none;
}

/* Flechas Lucomoria: círculos blancos 64px, overlapping los bordes */
.car__arrow{
  position:absolute;
  top:50%;
  width:64px; height:64px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  gap:0;
  background:#FFFFFF;
  box-shadow:0 4px 20px rgba(0,0,0,.08);
  color:var(--bordo);
  transition:transform .3s ease, background-color .3s ease, width .5s var(--ease), padding .5s var(--ease);
  overflow:hidden;
  white-space:nowrap;
  z-index:3;
  transform:translate(0, -50%);
}
.car__arrow--prev{ left:24px; }
.car__arrow--next{ right:24px; }
.car__arrow:hover{ transform:translate(0, -50%) scale(1.05); }

.car__arrow-label{
  display:none;
  font-family:var(--serif);
  font-weight:500;
  font-size:11px;
  letter-spacing:0.16em;
  text-transform:uppercase;
}
.car__arrow--next.is-gallery{
  width:auto;
  padding:0 26px;
  gap:10px;
  border-radius:60px;
}
.car__arrow--next.is-gallery .car__arrow-label{ display:inline; }

/* =========================================================
   4 · CATEGORÍAS  (crema) — Lucomoria SERVICES con peek
   ========================================================= */
.cats{ background:var(--crema); padding:var(--sec) 0; overflow:hidden; }
.cats__head{
  padding:0 var(--pad);
  max-width:var(--max);
  margin:0 auto 64px;
}
.cats__title{
  text-align:right;
  font-size:clamp(40px, 3.85vw, 57px);   /* +10% */
  line-height:1.1;
  letter-spacing:-0.02em;
}

/* grid horizontal — 2 cards simétricas */
.cats__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  padding:0 var(--pad);
  max-width:var(--max);
  margin:0 auto;
}

.cat{ display:flex; flex-direction:column; }
.cat__media{
  position:relative;
  overflow:hidden;
  border-radius:2px;
  height:clamp(360px, 42vh, 480px);
}
.cat__media::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height:30%;
  background:linear-gradient(0deg, rgba(0,0,0,.35) 0%, transparent 100%);
  pointer-events:none;
}
.cat__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.95);
  transition:transform .7s ease-out;
}
.cat:hover .cat__media img{ transform:scale(1.03); }

/* label overlay Lucomoria: sin pill, solo texto claro sobre gradient */
.cat__name{
  position:absolute;
  left:20px;
  bottom:20px;
  font-family:var(--serif);
  font-weight:500;
  font-size:13px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--marfil);
  text-shadow:0 1px 4px rgba(0,0,0,.4);
  z-index:2;
}

/* bajada debajo de la card */
.cat__desc{
  font-family:var(--body);
  font-size:23px;
  font-weight:400;
  line-height:1.55;
  color:var(--texto-oscuro);
  margin-top:20px;
  max-width:440px;
}

/* =========================================================
   5 · SERVICIOS  (crema — sección clara, cards bordo compactas)
   ========================================================= */
.serv{
  background:var(--crema);
  padding:80px 0 140px;   /* aire extra abajo antes de Momentos */
  color:var(--bordo);
}
.serv__head{
  margin-bottom:0;
  text-align:left;
}
.serv__title{
  font-family:var(--serif);
  font-weight:500;
  text-align:left;
  color:var(--bordo);
  font-size:clamp(33px, 3.75vw, 48px);   /* +10% */
  line-height:1.15;
  letter-spacing:0.05em;
  text-transform:uppercase;
  max-width:720px;
}
.serv__sub{
  font-family:var(--body);
  font-weight:400;
  font-style:normal;
  font-size:27px;
  color:var(--texto-oscuro);
  line-height:1.55;
  margin-top:20px;
  max-width:680px;
  text-align:left;
}
/* ---- Listado editorial de servicios (2 cols desktop, 1 col mobile) ---- */
.svclist{
  list-style:none;
  padding:0;
  margin:56px 0 0;
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:56px;
  border-top:1px solid rgba(168,147,90,.2);
}
.svc-row{
  display:flex;
  align-items:center;
  gap:16px;
  padding:22px 4px;
  border-bottom:1px solid rgba(168,147,90,.2);
  cursor:pointer;
  color:var(--bordo);
  transition:color .3s var(--ease);
  outline:none;
}
.svc-row__name{
  flex:1 1 auto;
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(20px, 1.6vw, 24px);
  letter-spacing:0.06em;
  line-height:1.2;
  text-transform:uppercase;
  color:inherit;
}
/* Iconos del listado ocultos — se mantienen en DOM solo para inyectar al modal */
.svc-row__ico{ display:none; }

/* + como botón circular bordo */
.svc-row__plus{
  flex:0 0 36px;
  width:36px; height:36px;
  border:1.5px solid var(--bordo);
  border-radius:50%;
  background:transparent;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family:var(--serif);
  font-weight:400;
  font-size:16px;
  line-height:1;
  color:var(--bordo);
  transition:background-color .3s var(--ease), color .3s var(--ease), transform .3s var(--ease), border-color .3s var(--ease);
}
@media (hover:hover){
  .svc-row:hover{ color:var(--terracota); }
  .svc-row:hover .svc-row__name{ color:var(--terracota); }
  .svc-row:hover .svc-row__plus{
    background:var(--bordo);
    color:var(--marfil);
    transform:rotate(45deg);
  }
}
.svc-row:focus-visible{
  outline:1px solid var(--dorado);
  outline-offset:4px;
}

/* ---- Modal Servicio ---- */
.svcmodal{
  position:fixed;
  inset:0;
  z-index:200;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.svcmodal.is-open{ display:flex; }
.svcmodal__overlay{
  position:absolute; inset:0;
  background:rgba(61,26,24,.7);
  opacity:0;
  transition:opacity .3s ease;
}
.svcmodal.is-visible .svcmodal__overlay{ opacity:1; }
.svcmodal__box{
  position:relative;
  z-index:1;
  width:100%;
  max-width:520px;
  background:var(--crema);
  border-radius:8px;
  padding:48px 40px 44px;
  box-shadow:0 20px 60px rgba(0,0,0,.15);
  text-align:center;
  color:var(--texto-oscuro);
  opacity:0;
  transform:scale(.95);
  transition:opacity .35s cubic-bezier(.22,1,.36,1), transform .35s cubic-bezier(.22,1,.36,1);
}
.svcmodal.is-visible .svcmodal__box{ opacity:1; transform:scale(1); }
.svcmodal__close{
  position:absolute;
  top:20px; right:20px;
  width:auto;
  padding:8px;
  font-family:var(--serif);
  font-size:24px;
  line-height:1;
  color:var(--dorado);
  cursor:pointer;
  transition:color .3s ease;
}
.svcmodal__close:hover{ color:var(--bordo); }
.svcmodal__ico{
  width:48px; height:48px;
  margin:0 auto 24px;
  color:var(--dorado);
  display:flex;
  align-items:center;
  justify-content:center;
}
.svcmodal__ico svg{ width:100%; height:100%; }
.svcmodal__title{
  font-family:var(--serif);
  font-weight:500;
  font-size:28px;
  letter-spacing:0.06em;
  line-height:1.2;
  text-transform:uppercase;
  color:var(--bordo);
  margin:0 0 20px;
}
.svcmodal__desc{
  font-family:var(--body);
  font-size:16px;
  line-height:1.6;
  color:var(--texto-oscuro);
  margin:0;
}
body.modal-open{ overflow:hidden; }

/* CTA único centrado debajo del grid — pill sólido bordo */
.serv__ctarow{
  margin-top:48px;
  text-align:center;
}
.serv__cta{
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-family:var(--serif);
  font-weight:500;
  font-size:13px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--marfil);
  background:var(--bordo);
  padding:20px 44px;
  border-radius:60px;
  transition:background-color .3s ease, color .3s ease;
  white-space:nowrap;
}
.serv__cta:hover{ background:var(--terracota); color:var(--crema); }
.serv__cta-arrow{ font-size:15px; line-height:1; transition:transform .3s ease; }
.serv__cta:hover .serv__cta-arrow{ transform:translateX(4px); }

.serv__note{
  margin-top:24px;
  text-align:center;
  color:var(--texto-oscuro);
  font-style:normal;
  font-family:var(--body);
  font-weight:400;
  font-size:21px;
  max-width:600px;
  margin-left:auto;
  margin-right:auto;
  opacity:.75;
}

/* =========================================================
   6 · MOMENTOS  (bordo + chevron sutil)
   ========================================================= */
.mom{
  overflow:hidden;
  background-color:var(--bordo);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='12' viewBox='0 0 24 12'><path d='M0 6 L6 0 L12 6 L18 0 L24 6' stroke='%23F0E6D8' stroke-width='0.5' fill='none' opacity='0.08'/></svg>");
  background-repeat:repeat;
  color:var(--marfil);
}
.mom__grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  gap:44px 40px;
  align-items:start;
}
.mom__text{ grid-column:1 / span 5; display:flex; flex-direction:column; gap:22px; padding-top:0; }
.mom__text .h2{ margin-top:-.15em; color:var(--marfil); }
.mom__text .h2{ font-size:clamp(33px, 4vw, 51px); }   /* +10% */
.mom__text p{
  font-family:var(--body);
  max-width:520px;
  font-size:24px;
  font-weight:400;
  line-height:1.65;
  color:var(--marfil);
  opacity:.85;
}

.mom__carousel{ grid-column:6 / span 7; }

.drag{
  --visible:2.7;   /* apenas más grande que 3, sin exagerar */
  --gap:14px;
  overflow:hidden;
  cursor:grab;
  touch-action:pan-y;
}
.drag.is-dragging{ cursor:grabbing; }
.drag__track{
  display:flex;
  gap:var(--gap);
  will-change:transform;
}
.drag__slide{
  margin:0;
  flex:0 0 calc((100% - (var(--visible) - 1) * var(--gap)) / var(--visible));
}
.drag__slide img{
  width:100%;
  aspect-ratio:3/4;
  object-fit:cover;
  border-radius:2px;
  user-select:none;
  -webkit-user-drag:none;
}
.drag__bar{
  position:relative;
  width:100%;
  height:2px;
  background:rgba(240,230,216,.15);
  margin-top:24px;
}
.drag__bar-fill{
  position:absolute;
  left:0; top:0; bottom:0;
  width:30%;
  background:var(--marfil);
  transform-origin:left;
}

/* firma editorial "momentos." — Great Vibes, dorado sutil sobre bordo */
.mom__signature{
  margin-top:16px;
  text-align:right;
  font-family:var(--script);
  font-weight:400;
  font-style:normal;
  font-size:48px;                 /* +10% */
  letter-spacing:0;
  line-height:.9;
  color:var(--dorado);
  opacity:.6;
}

/* =========================================================
   7 · CONTACTO  (crema — continua la sección Momentos, centrado)
   ========================================================= */
.cont{
  background:var(--crema);
  padding:140px 0;
  color:var(--bordo);
}
.cont__inner{
  max-width:720px;
  margin:0 auto;
  padding:0 var(--pad);
  text-align:center;
}
.cont__title{
  font-family:var(--serif);
  font-weight:500;
  color:var(--bordo);
  font-size:clamp(35px, 4.2vw, 53px);   /* +10% */
  line-height:1.15;
  letter-spacing:0.05em;
  text-transform:uppercase;
}
.cont__sub{
  font-family:var(--body);
  font-style:italic;
  font-weight:400;
  font-size:24px;
  color:var(--texto-oscuro);
  line-height:1.6;
  max-width:600px;
  margin:24px auto 0;
}
.cont__icons{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:40px;
  margin-top:80px;
  align-items:start;
  justify-items:center;
  position:relative;
  max-width:820px;
  margin-left:auto;
  margin-right:auto;
}
/* separadores hairline verticales muy sutiles entre bloques */
.cont__icons::before,
.cont__icons::after{
  content:"";
  position:absolute;
  top:14px; bottom:14px;
  width:1px;
  background:rgba(61,26,24,.08);
}
.cont__icons::before{ left:33.33%; }
.cont__icons::after{ left:66.66%; }

.cont__ico{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  color:var(--bordo);
  padding:0 12px;
}
/* contenedor circular hairline — feel hotel/hospitality premium */
.cont__ico-wrap{
  width:64px; height:64px;
  border-radius:50%;
  border:1px solid rgba(61,26,24,.18);
  display:flex;
  align-items:center;
  justify-content:center;
  transition:border-color .3s ease, background-color .3s ease, transform .3s ease;
}
.cont__ico:hover .cont__ico-wrap{
  border-color:var(--bordo);
  background:var(--bordo);
  transform:translateY(-2px);
}
.cont__ico-svg{
  width:24px; height:24px;
  color:var(--bordo);
  transition:color .3s ease;
}
.cont__ico:hover .cont__ico-svg{ color:var(--marfil); }
.cont__lbl{
  display:block;
  font-family:var(--serif);
  font-weight:500;
  font-size:10px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--muted);
  margin-top:22px;
}
.cont__val{
  display:block;
  font-family:var(--body);
  font-size:23px;
  font-weight:400;
  color:var(--bordo);
  margin-top:8px;
}

/* CTA — outline fino minimalista, Inter (misma tipo que titulares), no pill grotesco */
.cont__cta{
  display:inline-flex;
  align-items:center;
  gap:14px;
  margin-top:72px;
  font-family:var(--body);
  font-weight:500;
  font-size:20px;
  letter-spacing:0;
  color:var(--bordo);
  background:transparent;
  border:1px solid var(--bordo);
  padding:16px 32px;
  border-radius:60px;
  transition:background-color .3s ease, color .3s ease, border-color .3s ease;
  white-space:nowrap;
}
.cont__cta:hover{ background:var(--bordo); color:var(--marfil); }
.cont__cta-text{ line-height:1; }
.cont__cta-arrow{ display:inline-flex; align-items:center; transition:transform .3s ease; }
.cont__cta:hover .cont__cta-arrow{ transform:translateX(4px); }

/* =========================================================
   FOOTER  (bordo — grid con brand + 3 cols + bottom row)
   ========================================================= */
.foot{
  background:var(--bordo);
  padding:88px 0 36px;
  color:var(--marfil);
  border-top:none;
}
.foot__inner{ display:flex; flex-direction:column; }
.foot__grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:48px 40px;
  align-items:start;
}

/* Brand column (logo + tagline) */
.foot__brand{ display:flex; flex-direction:column; gap:20px; }
.foot__logo{ display:inline-block; }
.foot__logo img{
  height:64px;
  width:auto;
  display:block;
  filter:brightness(0) invert(1) opacity(.92);   /* logo dark → marfil sobre bordo */
}
.foot__tagline{
  font-family:var(--body);
  font-style:italic;
  font-size:24px;
  font-weight:400;
  color:var(--marfil);
  max-width:360px;
  line-height:1.4;
  margin:0;
}

/* Columns con título + lista */
.foot__col{ display:flex; flex-direction:column; gap:16px; }
.foot__col-title{
  font-family:var(--serif);
  font-weight:500;
  font-size:12px;                /* +10% */
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--dorado);
  margin:0 0 4px;
}
.foot__col ul{ display:flex; flex-direction:column; gap:10px; }
.foot__col ul li a,
.foot__col ul li{
  font-family:var(--body);
  font-size:22px;
  font-weight:400;
  color:var(--marfil);
  transition:color .3s ease;
}
.foot__col ul li a:hover{ color:var(--terracota); }

.foot__addr{
  display:flex; flex-direction:column; gap:4px;
  font-family:var(--body);
  font-style:normal;
  font-size:22px;
  color:var(--marfil);
}
.foot__link{
  display:inline-block;
  margin-top:4px;
  font-family:var(--body);
  font-weight:500;
  font-size:21px;
  color:var(--dorado);
  border-bottom:1px solid var(--dorado);
  padding-bottom:2px;
  align-self:flex-start;
  transition:color .3s ease, border-color .3s ease;
}
.foot__link:hover{ color:var(--terracota); border-color:var(--terracota); }

/* Bottom row: copyright + credit */
.foot__bottom{
  margin-top:64px;
  padding-top:24px;
  border-top:1px solid rgba(168,147,90,.2);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  flex-wrap:wrap;
}
.foot__copy,
.foot__by{
  font-family:var(--body);
  font-style:italic;
  font-size:18px;
  line-height:1.5;
  color:rgba(240,230,216,.75);
  margin:0;
}
.foot__by a{ color:var(--dorado); font-style:italic; transition:color .3s ease; }
.foot__by a:hover{ color:var(--marfil); }

/* =========================================================
   NAV — estado activo (subrayado dorado sutil)
   ========================================================= */
.drawer__links a.is-active{ color:var(--terracota); }
.nav__links a.is-active{ color:var(--bordo); }
.nav__links a.is-active::after{
  transform:scaleX(1);
  transform-origin:left;
  background:var(--dorado);
}

/* =========================================================
   SUBPÁGINA — HERO compacto
   ========================================================= */
.subhero{
  position:relative;
  width:100%;
  height:65vh;
  min-height:440px;
  overflow:hidden;
  display:flex;
  align-items:flex-end;
}
.subhero__bg{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.subhero__overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(260deg, rgba(42,18,16,.35) 0%, rgba(42,18,16,0) 55%),
    linear-gradient(180deg, rgba(42,18,16,.10) 0%, rgba(42,18,16,.55) 100%);
}
.subhero__inner{
  position:relative;
  z-index:2;
  max-width:var(--max);
  width:100%;
  margin:0 auto;
  padding:0 var(--pad) 72px;
}
.subhero__title{
  font-family:var(--body);
  font-weight:500;
  color:var(--marfil);
  font-size:clamp(48px, 6vw, 84px);   /* +10% */
  line-height:1.05;
  letter-spacing:-0.02em;
  margin:0 0 18px;
}
.subhero__lead{
  font-family:var(--body);
  color:var(--marfil);
  font-size:24px;
  font-weight:400;
  line-height:1.55;
  max-width:600px;
}

/* =========================================================
   SUBPÁGINA — LA CONSTRUCCIÓN
   ========================================================= */
.constr{ padding:140px 0; }
.constr__grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  gap:60px 40px;
  align-items:start;
}
.constr__media{
  grid-column:1 / span 5;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.constr__ph{ margin:0; }
.constr__ph img{
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  border-radius:2px;
}
.constr__text{
  grid-column:7 / span 6;
  padding-top:8px;
  max-width:560px;
}
.constr__text .h2{ margin-bottom:28px; }
.constr__text p{
  font-family:var(--body);
  font-size:23px;
  font-weight:400;
  line-height:1.7;
  color:var(--texto-oscuro);
}
.constr__text p + p{ margin-top:16px; }

/* =========================================================
   SUBPÁGINA — DÓNDE ESTAMOS (mapa)
   ========================================================= */
.mapa{ padding:140px 0; }
.mapa__grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  gap:56px 40px;
  align-items:center;
}
.mapa__text{
  grid-column:1 / span 5;
  display:flex;
  flex-direction:column;
  gap:22px;
}
.mapa__text .h2{ margin:0; }
.mapa__lead{
  font-family:var(--body);
  font-size:23px;
  font-weight:400;
  line-height:1.7;
  color:var(--texto-oscuro);
  max-width:520px;
}
.mapa__addr{
  display:flex;
  flex-direction:column;
  gap:4px;
  font-family:var(--body);
  font-style:normal;
  font-size:23px;
  color:var(--bordo);
  margin-top:8px;
}
.mapa__cta{ align-self:flex-start; margin-top:16px; }
.mapa__frame{
  grid-column:6 / span 7;
  border-radius:6px;
  overflow:hidden;
  background:var(--marfil);
}

/* =========================================================
   SUBPÁGINA — RESEÑAS (bordo + chevron, mismo tratamiento que Momentos)
   ========================================================= */
.rev{
  padding:140px 0;
  background-color:var(--bordo);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='12' viewBox='0 0 24 12'><path d='M0 6 L6 0 L12 6 L18 0 L24 6' stroke='%23F0E6D8' stroke-width='0.5' fill='none' opacity='0.08'/></svg>");
  background-repeat:repeat;
  color:var(--marfil);
}
.rev__head{ text-align:center; margin-bottom:56px; }
.rev__title{ text-align:center; margin:0 auto 12px; color:var(--marfil); }
.rev__sub{
  font-family:var(--body);
  font-size:23px;
  color:var(--marfil);
  opacity:.85;
  max-width:600px;
  margin:0 auto;
}
.rev__grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:20px;
  margin-bottom:56px;
}
.rev__card{
  background:var(--crema);
  border:1px solid rgba(168,147,90,.18);
  border-radius:6px;
  padding:34px 30px;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.rev__stars{
  font-size:16px;
  letter-spacing:0.12em;
  color:var(--dorado);
  line-height:1;
}
.rev__text{
  font-family:var(--body);
  font-style:italic;
  font-size:23px;
  line-height:1.65;
  color:var(--texto-oscuro);
  flex:1 1 auto;
}
.rev__meta{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding-top:8px;
  border-top:1px solid rgba(61,26,24,.08);
}
.rev__author{
  font-family:var(--serif);
  font-weight:500;
  font-size:12px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--bordo);
}
.rev__date{
  font-family:var(--body);
  font-size:12px;
  color:var(--dorado);
}
.rev__ctarow{ text-align:center; }
.rev .btn--ghost-dark{
  border-color:var(--marfil);
  color:var(--marfil);
}
.rev .btn--ghost-dark:hover{
  background:var(--marfil);
  color:var(--bordo);
}

/* =========================================================
   SUBPÁGINA — FEATURES (claro, mismo crema del resto)
   ========================================================= */
.feats{
  background:var(--crema);
  padding:140px 0;
  color:var(--bordo);
}
.feats__title{
  color:var(--bordo);
  text-align:center;
  margin:0 auto 72px;
  max-width:720px;
}
.feats__grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:24px;
}
.feat{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:18px;
  padding:16px 12px;
}
.feat__icon{
  width:36px; height:36px;
  color:var(--terracota);
  flex:0 0 auto;
}
.feat__label{
  font-family:var(--serif);
  font-weight:500;
  font-size:12px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--bordo);
  margin:0;
  line-height:1.35;
}
.feat__desc{
  font-family:var(--body);
  font-size:21px;
  line-height:1.55;
  color:var(--texto-oscuro);
  opacity:.7;
  max-width:280px;
}

/* CTA "Reservar" al pie de la sección feats (usada como cierre de la-casa) */
.feats__ctarow{
  margin-top:72px;
  text-align:center;
}
.feats__cta{
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-family:var(--serif);
  font-weight:500;
  font-size:13px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--marfil);
  background:var(--bordo);
  padding:20px 44px;
  border-radius:60px;
  transition:background-color .3s ease, color .3s ease;
  white-space:nowrap;
}
.feats__cta:hover{ background:var(--terracota); }
.feats__cta-arrow{ display:inline-flex; align-items:center; transition:transform .3s ease; }
.feats__cta:hover .feats__cta-arrow{ transform:translateX(4px); }

/* =========================================================
   SUBPÁGINA LA CASA — hero + secciones de ambientes
   ========================================================= */

/* --- Hero de la-casa --- */
.lchero{
  position:relative;
  width:100%;
  height:72vh;
  min-height:500px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.lchero__bg{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.lchero__overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(42,18,16,.20) 0%, rgba(42,18,16,.55) 100%);
}
.lchero__inner{
  position:relative;
  z-index:2;
  max-width:var(--max);
  width:100%;
  margin:0 auto;
  padding:0 var(--pad);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:32px;
}
.lchero__title{
  font-family:var(--body);
  font-weight:500;
  color:var(--marfil);
  font-size:clamp(42px, 5.5vw, 75px);   /* +10% */
  line-height:1.08;
  letter-spacing:-0.02em;
  margin:0;
  max-width:900px;
}
.lchero__cta{
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-family:var(--serif);
  font-weight:500;
  font-size:13px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--bordo);
  background:var(--marfil);
  padding:18px 34px;
  border-radius:60px;
  transition:background-color .3s ease, color .3s ease;
  white-space:nowrap;
}
.lchero__cta:hover{ background:var(--bordo); color:var(--marfil); }
.lchero__cta-arrow{ font-size:14px; line-height:1; transition:transform .3s ease; }
.lchero__cta:hover .lchero__cta-arrow{ transform:translateY(3px); }

/* --- Secciones de ambientes: ritmo uniforme, entra en 1 viewport de laptop --- */
.lcsec{ background:var(--crema); padding:70px 0; }
.lcsec .container{ display:block; }

/* Grilla de imágenes base */
.lcgrid{ display:grid; gap:16px; }
.lcph{ margin:0; overflow:hidden; border-radius:2px; }
.lcph img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
}

/* Placeholder "Foto próximamente" — fondo bordo + Cinzel marfil chico */
.lcph.ph--todo{
  background:var(--bordo);
  display:flex;
  align-items:center;
  justify-content:center;
  /* NO min-height acá: rompe grids con rows de altura fija. Mobile lo setea abajo. */
}
.lcph.ph--todo span{
  font-family:var(--serif);
  font-weight:500;
  font-size:12px;
  letter-spacing:0.24em;
  text-transform:uppercase;
  color:var(--marfil);
  opacity:.7;
  text-align:center;
  padding:20px;
}

/* Bloque texto (título + body) debajo de cada grilla */
.lctext{
  margin-top:40px;
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  gap:20px 32px;
  align-items:start;
}
.lctext__title{
  grid-column:1 / span 4;
  font-family:var(--serif);
  font-weight:500;
  color:var(--bordo);
  font-size:clamp(33px, 3.75vw, 48px);   /* +10% */
  line-height:1.15;
  letter-spacing:0.05em;
  text-transform:uppercase;
  margin:0;
}
.lctext__body{
  grid-column:5 / span 8;
  display:flex;
  flex-direction:column;
  gap:24px;
}
.lctext__body p{
  font-family:var(--body);
  font-size:24px;
  font-weight:400;
  line-height:1.7;
  color:var(--texto-oscuro);
  max-width:760px;
  margin:0;
}

/* Features row (mismo estilo que lacasa__features del home) */
.lcfeats{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px;
  font-family:var(--serif); font-weight:500; font-size:11px;
  letter-spacing:0.18em; text-transform:uppercase; color:var(--dorado);
  margin:8px 0 0;
}
.lcfeats li{ display:inline-flex; align-items:center; }
.lcfeats li:not(:last-child)::after{
  content:"·"; color:var(--dorado); opacity:.6;
  margin-left:14px; font-size:14px;
}

/* Lista de items en Cocina */
.lclist{
  display:grid; grid-template-columns:1fr 1fr; gap:8px 32px;
  font-family:var(--body); font-size:15px; color:var(--texto-oscuro);
  margin:4px 0 0;
}
.lclist li{
  padding-left:16px;
  position:relative;
  line-height:1.6;
}
.lclist li::before{
  content:"—";
  position:absolute; left:0; top:0;
  color:var(--dorado);
}

/* -------- Layouts asimétricos por ambiente -------- */

/* PATIO: 1 grande izq + 2 apiladas der — altura fija para caber en viewport */
.lcgrid--patio{
  grid-template-columns:7fr 5fr;
  grid-template-rows:230px 230px;
  height:476px;
}
.lcgrid--patio .lcph--main{ grid-column:1; grid-row:1 / span 2; }
.lcgrid--patio .lcph--st1{ grid-column:2; grid-row:1; }
.lcgrid--patio .lcph--st2{ grid-column:2; grid-row:2; }

/* VITRINAS: 2 landscapes lado a lado */
.lcgrid--vitrinas{
  grid-template-columns:1fr 1fr;
  gap:24px;
}
.lcgrid--vitrinas .lcph--vt2{ grid-column:1; grid-row:1; aspect-ratio:4/3; }
.lcgrid--vitrinas .lcph--vt3{ grid-column:2; grid-row:1; aspect-ratio:4/3; }

/* ESPEJOS: 1 portrait tall izq + 1 landscape der → asimétrico editorial */
.lcgrid--espejos{
  grid-template-columns:5fr 7fr;
  align-items:center;
  gap:32px;
}
.lcgrid--espejos .lcph--esp1{ aspect-ratio:3/4; }
.lcgrid--espejos .lcph--esp3{ aspect-ratio:4/3; }

/* ENCUENTRO: 1 portrait tall izq + 1 landscape der → asimétrico editorial */
.lcgrid--encuentro{
  grid-template-columns:5fr 7fr;
  align-items:center;
  gap:32px;
}
.lcgrid--encuentro .lcph--main{ grid-column:1; grid-row:1; aspect-ratio:3/4; }
.lcgrid--encuentro .lcph--st1{ grid-column:2; grid-row:1; aspect-ratio:4/3; }

/* TERRAZA: 2 lado a lado del mismo tamaño */
.lcgrid--terraza{
  grid-template-columns:1fr 1fr;
}
.lcgrid--terraza .lcph--tr1,
.lcgrid--terraza .lcph--tr2{ aspect-ratio:4/3; }

/* COCINA: 1 grande izq + 2 apiladas der */
.lcgrid--cocina{
  grid-template-columns:6fr 6fr;
  grid-template-rows:230px 230px;
  height:476px;
}
.lcgrid--cocina .lcph--main{ grid-column:1; grid-row:1 / span 2; }
.lcgrid--cocina .lcph--st1{ grid-column:2; grid-row:1; }
.lcgrid--cocina .lcph--st2{ grid-column:2; grid-row:2; }

/* -------- CTA final bordo -------- */
.lccta{
  background:var(--bordo);
  padding:140px 0;
  color:var(--marfil);
  text-align:center;
}
.lccta__inner{
  max-width:720px;
  margin:0 auto;
  padding:0 var(--pad);
  display:flex; flex-direction:column; align-items:center;
}
.lccta__title{
  color:var(--marfil);
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(33px, 3.75vw, 48px);   /* +10% */
  line-height:1.15;
  letter-spacing:0.05em;
  text-transform:uppercase;
  margin:0;
}
.lccta__sub{
  margin-top:20px;
  font-family:var(--body);
  font-size:24px;
  line-height:1.6;
  color:var(--marfil);
  opacity:.7;
  max-width:640px;
}
.lccta__btn{
  display:inline-flex; align-items:center; gap:12px;
  margin-top:48px;
  font-family:var(--serif); font-weight:500;
  font-size:13px; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--marfil);
  background:var(--terracota);
  padding:20px 44px;
  border-radius:60px;
  transition:background-color .3s ease;
  white-space:nowrap;
}
.lccta__btn:hover{ background:var(--marfil); color:var(--bordo); }
.lccta__btn-arrow{ display:inline-flex; align-items:center; transition:transform .3s ease; }
.lccta__btn:hover .lccta__btn-arrow{ transform:translateX(4px); }

/* -------- Mobile la-casa -------- */
@media (max-width:768px){
  .lchero{ height:65vh; min-height:440px; }
  .lchero__inner{ padding:0 var(--pad) 60px; gap:24px; }
  .lchero__title{ font-size:clamp(29px, 7.2vw, 43px); line-height:1.15; }
  .lchero__cta{ padding:16px 28px; font-size:12px; }

  .lcsec{ padding:56px 0; }

  /* Todos los grids colapsan a 1 columna vertical — sin height fija */
  .lcgrid,
  .lcgrid--patio,
  .lcgrid--vitrinas,
  .lcgrid--espejos,
  .lcgrid--encuentro,
  .lcgrid--terraza,
  .lcgrid--cocina{
    grid-template-columns:1fr;
    grid-template-rows:auto;
    height:auto;
    min-height:0;
    gap:12px;
    align-items:stretch;
  }
  .lcgrid--patio .lcph--main,
  .lcgrid--patio .lcph--st1,
  .lcgrid--patio .lcph--st2,
  .lcgrid--vitrinas .lcph--vt1,
  .lcgrid--vitrinas .lcph--vt2,
  .lcgrid--vitrinas .lcph--vt3,
  .lcgrid--espejos .lcph--esp1,
  .lcgrid--espejos .lcph--esp2,
  .lcgrid--espejos .lcph--esp3,
  .lcgrid--encuentro .lcph--main,
  .lcgrid--encuentro .lcph--st1,
  .lcgrid--encuentro .lcph--st2,
  .lcgrid--cocina .lcph--main,
  .lcgrid--cocina .lcph--st1,
  .lcgrid--cocina .lcph--st2{
    grid-column:1; grid-row:auto;
    aspect-ratio:4/3;
    margin:0;
    position:static;
  }
  .lcph.ph--todo{ min-height:200px; aspect-ratio:4/3; }

  .lctext{ grid-template-columns:1fr; gap:14px; margin-top:40px; }
  .lctext__title, .lctext__body{ grid-column:1; }
  .lctext__title{ font-size:clamp(24px, 6.6vw, 32px); line-height:1.15; }
  .lctext__body{ gap:14px; }
  .lctext__body p{ font-size:14px; line-height:1.5; }

  .lclist{ grid-template-columns:1fr; font-size:14px; }
  .lclist li{ line-height:1.5; }
  .lcfeats{ flex-direction:column; align-items:flex-start; gap:6px; font-size:10px; }
  .lcfeats li:not(:last-child)::after{ display:none; }

  .lccta{ padding:72px 0; }
  .lccta__title{ font-size:clamp(24px, 6.6vw, 32px); line-height:1.15; }
  .lccta__sub{ font-size:15px; line-height:1.5; }
  .lccta__btn{ padding:18px 32px; font-size:12px; }
}

/* =========================================================
   WHATSAPP FLOTANTE
   ========================================================= */
.wafloat{
  position:fixed;
  right:28px; bottom:28px;
  z-index:90;
  width:68px; height:68px;
  border-radius:50%;
  background:var(--bordo);
  color:var(--crema);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 32px rgba(42,18,16,.32);
  transition:background-color .3s ease, transform .3s ease, box-shadow .3s ease;
}
.wafloat svg{ width:30px; height:30px; }
.wafloat:hover{ background:var(--terracota); transform:translateY(-3px); box-shadow:0 14px 36px rgba(196,132,90,.38); }

/* =========================================================
   BREAKPOINTS
   ========================================================= */
@media (max-width:1120px){
  :root{ --sec:110px; }
  .lacasa__text{ padding:70px 40px 50px 32px; }
}

@media (max-width:900px){
  .svclist{ grid-template-columns:1fr; column-gap:0; }
}

@media (max-width:768px){
  :root{ --pad:20px; --sec:72px; }
  body{ font-size:18px; line-height:1.5; }

  .nav{
    padding:12px 0;
    transform:translateY(0);
    opacity:1;
    visibility:visible;
  }
  .nav.is-hidden{ pointer-events:auto; }
  .nav__links, .nav__cta{ display:none; }
  .nav__burger{ display:block; margin-left:auto; }
  .nav__logo-img{ height:44px; }
  .nav__logo-text{ font-size:16px; letter-spacing:0.12em; }
  .nav__logo{ gap:10px; }

  /* ---- Regla global mobile: titulares -10% + line-height 1.15 ---- */
  .h2{ font-size:clamp(24px, 5.8vw, 32px); line-height:1.15; }

  /* ============ HERO ============ */
  /* Título arriba, descripción y CTA debajo, alineado a la izquierda, dentro del 1er viewport */
  .hero{
    height:100vh;
    max-height:100vh;
    min-height:560px;
    display:flex;
    flex-direction:column;
    padding:0;
  }
  .hero__bg{ object-position:center right; }
  .hero__main{
    position:static;
    padding:32vh 24px 0;
    max-width:none;
    margin:0;
    order:1;
  }
  .hero__title{ font-size:clamp(28px, 7vw, 40px); line-height:1.15; }
  .hero-separator{ margin:24px 0 32px; }
  .hero__aside{
    position:static;
    padding:0 24px;
    max-width:none;
    text-align:left;
    align-items:flex-start;
    order:2;
    margin:0;
    gap:20px;
  }
  .hero__lead{ font-size:16px; line-height:1.5; }
  .hero__cta{ align-self:flex-start; padding:16px 30px; }

  /* ============ HISTORIA ============ */
  .historia{ padding:80px 0; }
  .historia__grid{ grid-template-columns:1fr; gap:26px; }
  .historia__col--left,
  .historia__text{ grid-column:1 / -1; }
  .historia__text{ padding-top:0; }
  .historia__text p{ font-size:16px; line-height:1.5; }

  /* ============ LA CASA — Cinco ambientes ============ */
  .lacasa__grid{ grid-template-columns:1fr; min-height:0; }
  .lacasa__text{ grid-column:1; padding:56px var(--pad) 32px; gap:14px; }
  .lacasa__carousel{
    grid-column:1;
    padding:12px var(--pad) 60px;   /* +40px aire debajo antes del corte */
    overflow:hidden;                 /* firulete queda contenido */
  }
  .lacasa__body{ max-width:none; }
  .lacasa__body p{ font-size:16px; line-height:1.5; margin-top:20px; }
  .lacasa__body .h2,
  .lacasa__h2{ font-size:clamp(23px, 6.3vw, 32px); line-height:1.15; }

  .car__arrow{ width:44px; height:44px; }
  .car__arrow--prev{ left:14px; }
  .car__arrow--next{ right:14px; }
  .car__arrow--next.is-gallery{ padding:0 16px; }
  .car__arrow--next.is-gallery .car__arrow-label{ font-size:10px; }
  .car__count{ left:16px; bottom:16px; font-size:12px; }

  /* ============ CATEGORÍAS (Sociales + Corporativos) ============ */
  .cats{ padding:56px 0; }
  .cats__head{ margin:0 auto 32px; }
  .cats__title{ font-size:clamp(30px, 7.5vw, 44px); line-height:1.1; }
  .cats__grid{
    grid-template-columns:1fr;
    gap:64px 20px;                   /* +aire entre card 1 y card 2 */
    padding:0 var(--pad);
  }
  .cat{ padding-bottom:16px; }
  .cat__media{ height:clamp(260px, 58vw, 360px); }
  .cat__desc{
    max-width:none;
    font-size:16px;
    line-height:1.5;
    margin-top:16px;
    padding-bottom:8px;
  }
  .cat__name{ font-size:12px; letter-spacing:0.14em; }

  /* ============ SERVICIOS ============ */
  .serv{ padding:56px 0; }
  .serv__title{ font-size:clamp(27px, 7vw, 36px); line-height:1.15; }
  .serv__sub{ font-size:16px; line-height:1.5; margin-top:14px; }
  .svclist{ grid-template-columns:1fr; column-gap:0; margin-top:32px; }
  .svc-row{ padding:20px 4px; gap:14px; }
  .svc-row__name{ font-size:clamp(17px, 4.6vw, 18px); letter-spacing:0.05em; }
  .svc-row__plus{ flex:0 0 30px; width:30px; height:30px; font-size:14px; border-width:1.5px; }
  .serv__note{ margin-top:20px; font-size:15px; line-height:1.5; }
  .serv__ctarow{ margin-top:32px; }
  .serv__cta{ display:flex; width:100%; justify-content:center; padding:18px 24px; }

  /* Modal mobile */
  .svcmodal{ padding:16px; }
  .svcmodal__box{ padding:32px 24px 28px; max-width:92%; }
  .svcmodal__title{ font-size:22px; margin-bottom:16px; }
  .svcmodal__desc{ font-size:15px; }
  .svcmodal__ico{ width:40px; height:40px; margin-bottom:18px; }
  .svcmodal__close{ top:14px; right:14px; font-size:22px; }

  /* ============ MOMENTOS ============ */
  .mom{ padding:56px 0; }
  .mom__grid{ grid-template-columns:1fr; gap:24px; }
  .mom__text{ grid-column:1 / -1; gap:14px; }
  .mom__carousel{ grid-column:1 / -1; }
  .mom__text .h2{ font-size:clamp(27px, 7vw, 40px); line-height:1.15; }
  .mom__text p{ font-size:16px; line-height:1.5; }
  .mom__signature{ font-size:18px; }
  /* Carrusel: 1 completa + peek ~40% de la siguiente */
  .drag{ --visible:1.4; --gap:12px; }

  /* ============ CONTACTO (Reservá tu fecha) ============ */
  /* WhatsApp + Instagram fila superior, Dirección fila inferior full-width, sin divisorias */
  .cont{ padding:72px 0; }
  .cont__title{ font-size:clamp(28px, 7.5vw, 42px); line-height:1.15; }
  .cont__sub{ font-size:16px; line-height:1.5; margin-top:16px; }
  .cont__icons{
    grid-template-columns:1fr 1fr;
    gap:20px;
    margin-top:40px;
  }
  .cont__icons::before,
  .cont__icons::after{ display:none; }
  .cont__ico:nth-child(3){ grid-column:1 / -1; }
  .cont__ico{ padding:0 4px; }
  .cont__lbl{ font-size:10px; margin-top:14px; }
  .cont__val{ font-size:16px; line-height:1.4; }
  .cont__cta{ display:flex; width:100%; padding:18px 28px; justify-content:center; margin-top:44px; font-size:16px; }

  /* ============ FOOTER ============ */
  .foot{ padding:44px 0 20px; }
  .foot__grid{ grid-template-columns:1fr 1fr; gap:28px 20px; }
  .foot__brand{ grid-column:1 / -1; gap:12px; }
  .foot__logo img{ height:44px; }
  .foot__tagline{ font-size:20px; line-height:1.35; }
  .foot__col{ gap:12px; }
  .foot__col-title{ font-size:10px; letter-spacing:0.2em; }
  .foot__col ul{ gap:8px; }
  .foot__col ul li,
  .foot__col ul li a{ font-size:17px; }
  .foot__addr{ font-size:17px; }
  .foot__link{ font-size:17px; margin-top:2px; }
  .foot__bottom{ margin-top:28px; padding-top:18px; flex-direction:column; align-items:flex-start; gap:8px; }
  .foot__copy, .foot__by{ font-size:14px; line-height:1.4; }

  .wafloat{ width:56px; height:56px; right:18px; bottom:18px; box-shadow:0 8px 24px rgba(42,18,16,.28); }
  .wafloat svg{ width:26px; height:26px; }

  /* ============ SUBPÁGINA NOSOTROS ============ */
  .subhero{ height:60vh; min-height:400px; }
  .subhero__inner{ padding:0 var(--pad) 44px; }
  .subhero__title{ font-size:clamp(32px, 8.2vw, 47px); line-height:1.1; }
  .subhero__lead{ font-size:16px; line-height:1.5; }

  /* Una casona con historia propia */
  .constr{ padding:64px 0; }
  .constr__grid{ grid-template-columns:1fr; gap:24px; }
  .constr__media, .constr__text{ grid-column:1 / -1; }
  .constr__text{ padding-top:0; }
  .constr__text .h2{ font-size:clamp(24px, 6.6vw, 32px); line-height:1.15; margin-bottom:18px; }
  .constr__text p{ font-size:16px; line-height:1.5; }
  .constr__text p + p{ margin-top:12px; }

  /* Dónde estamos */
  .mapa{ padding:64px 0; }
  .mapa__grid{ grid-template-columns:1fr; gap:24px; }
  .mapa__text, .mapa__frame{ grid-column:1 / -1; }
  .mapa__text{ gap:14px; }
  .mapa__text .h2{ font-size:clamp(24px, 6.6vw, 32px); line-height:1.15; }
  .mapa__lead{ font-size:16px; line-height:1.5; }
  .mapa__addr{ font-size:16px; line-height:1.5; }
  .mapa__frame iframe{ height:360px; max-height:60vh; }

  /* Lo que dicen de nosotros — reseñas más chicas */
  .rev{ padding:64px 0; }
  .rev__head{ margin-bottom:32px; }
  .rev__title{ font-size:clamp(24px, 6.6vw, 32px); line-height:1.15; }
  .rev__sub{ font-size:15px; line-height:1.5; }
  .rev__grid{ grid-template-columns:1fr; gap:10px; margin-bottom:28px; }
  .rev__card{ padding:22px 20px; gap:12px; }
  .rev__stars{ font-size:14px; }
  .rev__text{ font-size:15px; line-height:1.55; }
  .rev__author{ font-size:10px; letter-spacing:0.14em; }
  .rev__date{ font-size:11px; }

  /* Feats subpágina la-casa */
  .feats{ padding:64px 0; }
  .feats__title{ margin-bottom:32px; font-size:clamp(24px, 6.6vw, 32px); line-height:1.15; }
  .feats__grid{ grid-template-columns:1fr 1fr; gap:20px; }
  .feat__desc{ font-size:13px; line-height:1.5; }

  /* La Casa features (features minimal home) — apilan vertical */
  .lacasa__features{ flex-direction:column; align-items:flex-start; gap:8px; }
  .lacasa__features li:not(:last-child)::after{ display:none; }
}

@media (max-width:600px){
  .feats__grid{ grid-template-columns:1fr; }
}

@media (max-width:375px){
  .drawer__links a{ font-size:22px; }
}

/* ---------- accesibilidad ---------- */
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
}
