/* ===========================================================
   NOSTALGIA HOME INTERIOR — Premium Scrollable Site
   Palette: Warm cream / charcoal / brass caramel / taupe
   Type: Fraunces (display) + Plus Jakarta Sans (body/UI)
=========================================================== */

:root{
  --cream:        #F5F1EA;
  --cream-soft:   #ECE5DA;
  --ink:          #2B2620;
  --ink-soft:     #51463C;
  --brass:        #B6884F;
  --brass-light:  #D9B98A;
  --taupe:        #8A7560;
  --white:        #FFFFFF;

  --font-display: 'Fraunces', Georgia, serif;
  --font-body:    'Plus Jakarta Sans', -apple-system, sans-serif;

  --ease: cubic-bezier(.65,0,.2,1);
  --dur: 900ms;

  --header-h: 88px; /* reserved space so header never overlaps hero content */
}

*{ margin:0; padding:0; box-sizing:border-box; }

html,body{
  height:100%;
  overflow-x:hidden; /* never allow horizontal scroll/shift on any page */
  max-width:100vw;
}
body{ overflow:hidden; } /* overridden below — every page scrolls normally via .inner-page */

html:has(body.inner-page){
  overflow-y:auto;
  overflow-x:hidden;
}
body.inner-page{
  overflow-y:visible;
  overflow-x:hidden;
  height:auto;
  max-width:100vw;
}

body{
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--ink);
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing: antialiased;
}

a{ text-decoration:none; color:inherit; }
ul{ list-style:none; }
img{ display:block; max-width:100%; }
em{ font-style:italic; color:var(--brass); font-family: var(--font-display); }

/* ===================== HEADER ===================== */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:500;
  display:flex; align-items:center; justify-content:space-between;
  padding: 1.6rem 3.2rem;
  pointer-events:none;
  transition: padding .4s var(--ease), background .4s var(--ease), box-shadow .4s var(--ease), backdrop-filter .4s var(--ease);
}
.site-header > *{ pointer-events:auto; }

/* Shrink-on-scroll: compact padding once the user scrolls down the page.
   body.inner-page (applied site-wide) gives the header its permanent
   dark glass background — see further below. */
.site-header.scrolled{
  padding: .9rem 3.2rem;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
}
.site-header.scrolled .logo img,
.site-header.scrolled .logo .custom-logo{ max-height:38px; }
.site-header.scrolled .main-nav > ul{ padding:.4rem .5rem; }
.site-header.scrolled .nav-link{ padding:.5rem .9rem; }

.logo{
  display:flex; align-items:center; gap:.6rem;
  color:var(--cream);
}
.logo-mark{ color:var(--brass-light); font-size:1.1rem; }
.logo-text{
  font-family:var(--font-display);
  font-size:1.35rem; font-weight:500; letter-spacing:.06em;
  display:flex; flex-direction:column; line-height:1.1;
}
.logo-sub{
  font-family:var(--font-body); font-size:.6rem;
  letter-spacing:.32em; text-transform:uppercase;
  font-weight:500; color:var(--brass-light); margin-top:.2rem;
}
.logo img,
.logo .custom-logo{ display:block; max-height:48px; width:auto; }

/* NHI Logo Manager — all size control is via <style id="nhi-logo-forced"> in header.php */
/* No size rules here — keeps specificity clean */

/* .main-nav lives outside <header> in the DOM (top-level overlay) so the
   mobile full-screen menu is never affected by header stacking/clipping.
   On desktop it's positioned to sit centered within the header bar. */
.main-nav{
  position:fixed; top:0; left:0; right:0;
  display:flex; align-items:center; justify-content:center;
  padding: 1.6rem 3.2rem;
  pointer-events:none;
  z-index:510;
  transition: padding .4s var(--ease);
}
.main-nav > ul{ pointer-events:auto; }
.site-header.scrolled + .main-nav{ padding:.9rem 3.2rem; }

.main-nav > ul{
  display:flex; align-items:center; gap:.3rem;
  background: rgba(34,30,25,.42);
  border:1px solid rgba(245,241,234,.16);
  border-radius:999px;
  padding:.5rem .6rem;
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  box-shadow: 0 8px 28px rgba(43,38,32,.18);
  transition: background .4s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease);
}
.nav-link{
  display:flex; align-items:center; gap:.5rem;
  font-size:.78rem; letter-spacing:.14em; text-transform:uppercase;
  color: rgba(245,241,234,.72);
  font-weight:500;
  position:relative;
  padding:.6rem 1.05rem;
  border-radius:999px;
  transition: color .35s var(--ease), background .35s var(--ease);
}
.nav-icon{
  display:inline-flex; align-items:center; justify-content:center;
  color: var(--brass-light);
  opacity:.85;
  transition: color .35s var(--ease), opacity .35s var(--ease);
}
.nav-link::after{ display:none; }
.nav-link:hover, .nav-link.active{
  color:var(--cream);
  background: rgba(182,136,79,.18);
}
.nav-link:hover .nav-icon, .nav-link.active .nav-icon{ color:var(--brass-light); opacity:1; }

/* ===================== SERVICES DROPDOWN ===================== */
.main-nav li.has-dropdown{ position:relative; }
.main-nav li.has-dropdown > .nav-link::before{
  content:'▾'; font-size:.6rem; transition: transform .3s var(--ease); display:inline-block;
  order:2; margin-left:.15rem; opacity:.7;
}
.main-nav li.has-dropdown:hover > .nav-link::before,
.main-nav li.has-dropdown.open > .nav-link::before{ transform: rotate(180deg); }

/* Invisible bridge so the pointer never leaves the hoverable area
   between the "Services" link and the dropdown panel */
.main-nav li.has-dropdown::after{
  content:''; position:absolute; left:0; right:0; top:100%; height:1rem;
}

.sub-menu{
  position:absolute; top:calc(100% + .9rem); left:50%;
  transform: translateX(-50%) translateY(8px);
  min-width: 240px;
  width:max-content;
  background-color: rgb(36,31,26);
  background-image: linear-gradient(rgba(34,30,25,.92), rgba(34,30,25,.92));
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  border:1px solid rgba(245,241,234,.14);
  border-radius:16px;
  padding:.5rem;
  display:flex; flex-direction:column; gap:.15rem;
  opacity:0; visibility:hidden; pointer-events:none;
  transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s;
  z-index:900;
  box-shadow: 0 20px 44px rgba(0,0,0,.45);
}
.main-nav li.has-dropdown:hover .sub-menu,
.main-nav li.has-dropdown.open .sub-menu{
  opacity:1; visibility:visible; pointer-events:auto;
  transform: translateX(-50%) translateY(0);
}
.sub-menu li{ list-style:none; }
.sub-menu .nav-link{
  display:flex; align-items:center; gap:.6rem;
  padding:.65rem .9rem; font-size:.74rem; letter-spacing:.1em;
  border-radius:10px; white-space:nowrap; text-align:left;
  color: rgba(245,241,234,.68);
}
.sub-menu .nav-link::after,
.sub-menu .nav-link::before{ display:none; }
.sub-menu .nav-link:hover, .sub-menu .nav-link.active{
  background: rgba(182,136,79,.18); color:var(--cream);
}
/* ===================== SERVICE OVERVIEW CARDS ===================== */
.services-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; margin-top:1.6rem;
}
.service-card{
  position:relative; border-radius:18px; overflow:hidden;
  aspect-ratio: 4/5; display:flex; align-items:flex-end;
  box-shadow: 0 10px 30px rgba(43,38,32,.12);
  transition: transform .45s var(--ease), box-shadow .45s var(--ease);
}
.service-card:hover{ transform: translateY(-6px); box-shadow: 0 24px 52px rgba(43,38,32,.26); }
.service-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:4px;
  background: linear-gradient(90deg, var(--brass-light), var(--brass));
  transform: scaleX(0); transform-origin:left;
  transition: transform .5s var(--ease);
  z-index:2;
}
.service-card:hover::before{ transform: scaleX(1); }
.service-card img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition: transform .8s var(--ease), filter .45s var(--ease);
  filter: saturate(.95) brightness(.96);
}
.service-card:hover img{ transform: scale(1.08); filter: saturate(1.05) brightness(1.02); }
.service-card .service-card-overlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(43,38,32,.08) 22%, rgba(43,38,32,.62) 52%, rgba(43,38,32,.97) 85%, rgba(43,38,32,.97) 100%);
  transition: background .45s var(--ease);
}
.service-card:hover .service-card-overlay{
  background: linear-gradient(180deg, rgba(43,38,32,.12) 18%, rgba(43,38,32,.66) 48%, rgba(43,38,32,.98) 82%, rgba(43,38,32,.98) 100%);
}
.service-card-content{
  position:relative; z-index:1; padding:1.8rem; color:var(--cream); width:100%;
}
/* Large editorial numeral, floated top-right of the card */
.service-card-content .cap-mark{
  position:absolute; top:-2.6rem; right:1.6rem;
  font-family:var(--font-display); font-style:italic; font-weight:300;
  font-size:2.6rem; letter-spacing:0; text-transform:none;
  color: rgba(245,241,234,.4);
  margin-bottom:0;
  transition: color .45s var(--ease), transform .45s var(--ease);
}
.service-card:hover .cap-mark{ color: rgba(217,185,138,.85); transform:translateY(-2px); }
.service-card-content h3{
  font-family:var(--font-display); font-weight:500; font-size:1.4rem; margin-bottom:1.1rem;
  text-shadow: 0 2px 8px rgba(0,0,0,.5);
}
.service-card-content .btn{
  font-size:.7rem; padding:.6rem 1.3rem;
}

/* ===================== SERVICE DETAIL — 6-IMAGE GALLERY ===================== */
.service-gallery{
  display:grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr);
  gap:1rem; margin-top:1.6rem; min-height:60vh;
}
.service-gallery .showcase-item:nth-child(1),
.service-gallery .showcase-item:nth-child(4){ grid-row: span 2; }
.service-gallery .showcase-item:nth-child(1){ grid-column: span 1; }
@media (max-width:1080px){
  .services-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:880px){
  .services-grid{ grid-template-columns:1fr; }
  .service-gallery{ grid-template-columns:1fr 1fr; grid-template-rows:repeat(4,200px); min-height:auto; }
  .service-gallery .showcase-item:nth-child(1),
  .service-gallery .showcase-item:nth-child(4){ grid-row: span 1; grid-column: span 2; height:280px; }
}
@media (max-width:600px){
  .service-gallery{ grid-template-columns:1fr; grid-template-rows:repeat(6,220px); }
  .service-gallery .showcase-item:nth-child(1),
  .service-gallery .showcase-item:nth-child(4){ grid-column: span 1; height:220px; }
}

.header-phone{
  font-size:.82rem; letter-spacing:.08em;
  color:var(--cream);
  display:flex; align-items:center; gap:.5rem;
  border:1px solid rgba(245,241,234,.28);
  padding:.65rem 1.3rem; border-radius:999px;
  transition: border-color .3s, background .3s;
}
.header-phone:hover{ border-color:var(--brass-light); background:rgba(182,136,79,.12); }
.phone-icon{ color:var(--brass-light); }

.nav-toggle{
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:.4rem;
}
.nav-toggle span{ width:24px; height:2px; background:var(--cream); display:block; }
.main-nav-head{ display:none; }
.main-nav-foot{ display:none; }

/* ===================== HERO / PAGE BACKGROUND PANELS ===================== */
.slide-bg{
  position:absolute; inset:0; overflow:hidden; z-index:0;
}
.slide-bg img{
  width:100%; height:100%; object-fit:cover;
  transform: scale(1.08);
  transition: transform 9s linear;
  filter: saturate(0.92) brightness(.97);
}

.slide-overlay{
  position:absolute; inset:0;
  background: linear-gradient(115deg, rgba(43,38,32,.82) 0%, rgba(43,38,32,.55) 42%, rgba(43,38,32,.28) 100%);
}
/* Subtle film-grain texture for warmth — pure CSS, no image request */
.slide-bg::after{
  content:'';
  position:absolute; inset:0;
  z-index:1;
  pointer-events:none;
  opacity:.05;
  mix-blend-mode:overlay;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.4) 0, transparent 1px),
    radial-gradient(circle at 70% 60%, rgba(255,255,255,.3) 0, transparent 1px),
    radial-gradient(circle at 40% 80%, rgba(255,255,255,.35) 0, transparent 1px);
  background-size: 6px 6px, 9px 9px, 7px 7px;
}
.slide-overlay--light{
  background: linear-gradient(100deg, var(--cream) 0%, var(--cream) 55%, rgba(245,241,234,.6) 75%, rgba(245,241,234,.1) 100%);
}
.slide-overlay--dark{
  background: linear-gradient(115deg, rgba(43,38,32,.92) 0%, rgba(43,38,32,.74) 50%, rgba(43,38,32,.5) 100%);
}

/* ===================== TYPE SYSTEM ===================== */
.eyebrow{
  font-size:.78rem; letter-spacing:.36em; text-transform:uppercase;
  color:var(--brass-light); font-weight:600; margin-bottom:1.4rem;
}
.display-xl{
  font-family:var(--font-display);
  font-weight:300;
  font-size: clamp(3.6rem, 9vw, 8rem);
  line-height:1.02;
  letter-spacing:-.01em;
  margin-bottom:1.6rem;
}
.display-lg{
  font-family:var(--font-display);
  font-weight:300;
  font-size: clamp(2.4rem, 5.4vw, 4.6rem);
  line-height:1.12;
  letter-spacing:-.01em;
  margin-bottom:1.6rem;
  max-width:14ch;
}
.lead{
  font-size: clamp(1.05rem, 1.6vw, 1.3rem);
  max-width:42ch;
  color: rgba(245,241,234,.86);
  font-weight:300;
  margin-bottom:2.2rem;
}
.body-text{
  font-size:1.02rem;
  max-width:46ch;
  color: var(--ink-soft);
  font-weight:300;
  margin-bottom:2.2rem;
}

/* ===================== BUTTONS ===================== */
.btn{
  display:inline-flex; align-items:center; gap:.6rem;
  font-size:.82rem; letter-spacing:.18em; text-transform:uppercase;
  font-weight:600;
  padding: 1.05rem 2.3rem;
  border-radius:999px;
  transition: all .35s var(--ease);
  border:1px solid transparent;
  white-space:nowrap;
}
.btn-primary{ background:var(--brass); color:var(--ink); }
.btn-primary:hover{ background:var(--brass-light); transform:translateY(-2px); }
.btn-ghost{ border-color:rgba(245,241,234,.35); color:var(--cream); }
.btn-ghost:hover{ border-color:var(--brass-light); color:var(--brass-light); }
.btn-outline{ border-color:var(--brass); color:var(--brass); }
.btn-outline:hover{ background:var(--brass); color:var(--ink); }
.btn-large{ padding:1.2rem 3rem; font-size:.86rem; }

.hero-actions{ display:flex; gap:1rem; margin-bottom:3.4rem; flex-wrap:wrap; }

/* ===================== HOME HERO ===================== */
html{ scroll-behavior:smooth; }

.home-hero{
  position:relative;
  min-height:100vh;
  width:100%;
  display:flex;
  align-items:center;
  padding-top: var(--header-h);
  overflow:hidden;
  color:var(--cream);
}
.home-hero .slide-bg img{
  animation: nhiHeroZoom 16s var(--ease) forwards;
}
@keyframes nhiHeroZoom{ from{ transform:scale(1.12); } to{ transform:scale(1); } }

.home-hero-content{
  position:relative; z-index:1;
  max-width:1280px; margin:0 auto; width:100%;
  padding: 2rem 3.2rem 6rem;
}

.hero-scroll-cue{
  position:absolute; left:50%; bottom:2.2rem; z-index:1;
  transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:.55rem;
  color: rgba(245,241,234,.6);
  font-size:.7rem; letter-spacing:.24em; text-transform:uppercase;
}
.hero-scroll-cue .chevron{
  font-size:1.05rem; color:var(--brass-light);
  animation: nhiFloatDown 2.2s ease-in-out infinite;
}
@keyframes nhiFloatDown{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(6px);} }

/* Fade-up entrance animation — pure CSS, fires once on first paint */
.fade-up{ opacity:0; transform:translateY(26px); animation: nhiFadeUp .9s var(--ease) forwards; }
.fade-d1{ animation-delay:.05s; }
.fade-d2{ animation-delay:.2s; }
.fade-d3{ animation-delay:.35s; }
.fade-d4{ animation-delay:.5s; }
@keyframes nhiFadeUp{ to{ opacity:1; transform:translateY(0); } }

/* ===================== STATS BAND ===================== */
.stats-band{ background:var(--ink); color:var(--cream); padding: 3.2rem 3.2rem; }
.stats-row{
  max-width:1280px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1.6rem;
}
.stats-row .stat-item{ flex:1; min-width:140px; display:flex; flex-direction:column; align-items:center; text-align:center; }
.stats-row .stat-num{ font-family:var(--font-display); font-weight:300; font-size:clamp(2rem, 3.6vw, 2.8rem); color:var(--brass-light); }
.stats-row .stat-label{ font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(245,241,234,.62); margin-top:.5rem; }
.stats-divider{ width:1px; height:42px; background:rgba(245,241,234,.16); }

/* ===================== CATEGORY MARQUEE ===================== */
.marquee-band{ background:var(--brass); overflow:hidden; }
.marquee-track{
  display:flex; width:max-content;
  padding: 1.05rem 0;
  animation: nhiMarquee 26s linear infinite;
}
.marquee-track span{
  display:flex; align-items:center;
  white-space:nowrap;
  font-family:var(--font-display); font-style:italic; font-weight:500;
  font-size:1.05rem; color:var(--ink);
  padding: 0 1.8rem;
}
.marquee-track span::after{ content:'✦'; margin-left:1.8rem; font-style:normal; font-size:.75rem; color:rgba(43,38,32,.45); }
@keyframes nhiMarquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ===================== ABOUT (split, with image collage) ===================== */
.about-grid{
  display:grid; grid-template-columns: 1fr 1fr;
  gap: 3.6rem; align-items:center;
  margin-top:1rem;
}
.about-media{ position:relative; aspect-ratio: 4/5; max-width:480px; }
.about-media .media-main{
  position:absolute; inset:0; border-radius:18px; overflow:hidden;
  box-shadow: 0 26px 54px rgba(43,38,32,.2);
}
.about-media .media-main img{ width:100%; height:100%; object-fit:cover; }
.about-media .media-accent{
  position:absolute; width:48%; aspect-ratio:1/1;
  right:-10%; bottom:-10%;
  border-radius:16px; overflow:hidden;
  border: 6px solid var(--cream);
  box-shadow: 0 18px 40px rgba(43,38,32,.24);
}
.about-media .media-accent img{ width:100%; height:100%; object-fit:cover; }
.about-copy{ max-width:560px; }
.about-copy .value-grid{ margin-top:1.8rem; }

.value-grid{ display:flex; gap:1.6rem; flex-wrap:wrap; margin-top:1.6rem; }
.value-item{ flex:1; min-width:160px; }
.value-icon{ display:block; font-size:1.4rem; color:var(--brass); margin-bottom:.7rem; }
.value-item h4{ font-family:var(--font-display); font-weight:500; font-size:1.05rem; margin-bottom:.45rem; }
.value-item p{ font-size:.86rem; color:var(--ink-soft); font-weight:300; line-height:1.55; }

/* ===================== SERVICES ===================== */
.capability-row{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; margin-top:1rem;
}
.capability-card{
  background: rgba(245,241,234,.06);
  border:1px solid rgba(245,241,234,.14);
  border-radius:14px;
  padding:1.8rem 1.5rem;
  backdrop-filter: blur(6px);
  transition: border-color .35s, background .35s, transform .35s;
}
.capability-card:hover{
  border-color: var(--brass-light);
  background: rgba(182,136,79,.12);
  transform: translateY(-4px);
}
.cap-mark{
  display:inline-block; font-size:.7rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--brass-light); margin-bottom:1.1rem; font-weight:600;
}
.capability-card h4{
  font-family:var(--font-display); font-weight:500; font-size:1.15rem;
  margin-bottom:.6rem; line-height:1.3;
}
.capability-card p{ font-size:.86rem; color:rgba(245,241,234,.75); font-weight:300; line-height:1.6; }

/* ===================== PROCESS TIMELINE (How We Work) ===================== */
.process-row{
  position:relative;
  display:grid; grid-template-columns:repeat(4,1fr); gap:1.6rem;
  margin-top:2.6rem;
}
.process-row::before{
  content:'';
  position:absolute; top:21px; left:12%; right:12%; height:1px;
  background-image: repeating-linear-gradient(to right, var(--brass) 0 8px, transparent 8px 18px);
  z-index:0;
}
.process-step{
  position:relative; z-index:1;
  border-radius:14px;
  padding:2.2rem 1.5rem 1.7rem;
  transition: transform .35s var(--ease);
}
.process-step:hover{ transform: translateY(-4px); }
.process-num{
  position:absolute; top:-21px; left:1.5rem;
  width:42px; height:42px; border-radius:50%;
  background: linear-gradient(145deg, var(--brass-light), var(--brass));
  color:var(--ink);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:600; font-size:1.05rem;
  box-shadow: 0 8px 20px rgba(182,136,79,.4);
}
.process-step h4{
  font-family:var(--font-display); font-weight:500; font-size:1.15rem;
  margin:1.3rem 0 .6rem; line-height:1.3;
}
.process-step p{ font-size:.88rem; font-weight:300; line-height:1.6; margin:0; }
.inner-page .process-step{
  background: var(--white);
  border:1px solid rgba(43,38,32,.08);
}
.inner-page .process-step:hover{
  border-color: var(--brass);
  box-shadow: 0 18px 40px rgba(43,38,32,.1);
}
.inner-page .process-step h4{ color:var(--ink); }
.inner-page .process-step p{ color:var(--ink-soft); }

/* ===================== GALLERY ===================== */
.showcase-grid{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap:1rem;
  height: 52vh;
  margin-top:1.2rem;
}
.showcase-item{
  position:relative; overflow:hidden; border-radius:14px;
}
.showcase-tall{ grid-row: span 2; }
.showcase-item img{
  width:100%; height:100%; object-fit:cover;
  transition: transform .8s var(--ease), filter .45s var(--ease);
}
.showcase-item:hover img{ transform:scale(1.06); filter:brightness(.92); }
.showcase-item::after{
  content:'+';
  position:absolute; top:1rem; right:1rem; z-index:2;
  width:32px; height:32px; border-radius:50%;
  background: rgba(245,241,234,.16);
  border:1px solid rgba(245,241,234,.4);
  color:var(--cream);
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem; line-height:1; font-weight:300;
  opacity:0; transform: translateY(-6px) scale(.9);
  transition: opacity .35s var(--ease), transform .35s var(--ease);
  pointer-events:none;
  backdrop-filter: blur(4px);
}
.showcase-item:hover::after{ opacity:1; transform:translateY(0) scale(1); }
.showcase-item figcaption{
  position:absolute; left:0; right:0; bottom:0;
  padding:1.5rem 1.4rem 1.3rem;
  background: linear-gradient(to top, rgba(43,38,32,.92) 0%, rgba(43,38,32,.5) 60%, transparent 100%);
  color:var(--cream); font-family:var(--font-display); font-size:1.15rem; font-weight:500;
  display:flex; flex-direction:column; gap:.35rem;
  transform: translateY(6px);
  transition: transform .4s var(--ease);
}
.showcase-item:hover figcaption{ transform: translateY(0); }
.showcase-item figcaption span{
  font-family:var(--font-body);
  font-size:.68rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--brass-light); font-weight:600;
}

/* ===================== SECTION HEAD UTILITY ===================== */
.section-head{ max-width:760px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-head.center h2{ margin-left:auto; margin-right:auto; }
.section-head.center .eyebrow{ display:inline-block; width:100%; }

/* ===================== TESTIMONIALS ===================== */
.testimonial-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; margin-top:2rem;
}
.testimonial-card{
  background: var(--cream-soft);
  border:1px solid rgba(43,38,32,.08);
  border-radius:16px;
  padding:2.1rem 1.8rem;
  display:flex; flex-direction:column; gap:1.3rem;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease);
}
.testimonial-card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px rgba(43,38,32,.1); }
.testimonial-mark{ font-family:var(--font-display); font-size:2.6rem; color:var(--brass); line-height:.6; }
.testimonial-text{
  font-family:var(--font-display); font-style:italic; font-weight:400;
  font-size:1rem; color:var(--ink-soft); line-height:1.65; flex:1;
}
.testimonial-foot{
  display:flex; align-items:center; gap:.85rem;
  padding-top:1rem; border-top:1px solid rgba(43,38,32,.08);
}
.testimonial-avatar{
  width:42px; height:42px; border-radius:50%; flex-shrink:0;
  background:linear-gradient(145deg, var(--brass-light), var(--brass));
  color:var(--ink); display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:600; font-size:.92rem;
}
.testimonial-name{ font-size:.88rem; font-weight:600; color:var(--ink); }
.testimonial-role{ font-size:.74rem; color:var(--taupe); }

/* ===================== PACKAGES ===================== */
.pricing-row{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; margin-top:1rem;
}
.price-card{
  background: rgba(245,241,234,.05);
  border:1px solid rgba(245,241,234,.14);
  border-radius:18px;
  padding:2.2rem 1.8rem;
  backdrop-filter: blur(6px);
  position:relative;
  transition: transform .35s var(--ease), border-color .35s;
}
.price-card:hover{ transform: translateY(-6px); border-color: var(--brass-light); }
.price-card--featured{
  background: rgba(182,136,79,.14);
  border-color: var(--brass-light);
}
.price-badge{
  position:absolute; top:-12px; right:1.6rem;
  background:var(--brass); color:var(--ink);
  font-size:.66rem; letter-spacing:.18em; text-transform:uppercase;
  font-weight:700; padding:.4rem 1rem; border-radius:999px;
}
.price-card h3{ font-family:var(--font-display); font-weight:500; font-size:1.5rem; margin-bottom:.6rem; }
.price-tag{ font-family:var(--font-display); font-size:1.7rem; color:var(--brass-light); margin-bottom:.9rem; font-weight:500; }
.price-tag span{ font-family:var(--font-body); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(245,241,234,.6); }
.price-desc{ font-size:.88rem; color:rgba(245,241,234,.78); font-weight:300; margin-bottom:1.3rem; line-height:1.6; }
.price-card ul{ margin-bottom:1.8rem; display:flex; flex-direction:column; gap:.55rem; }
.price-card li{
  font-size:.84rem; color:rgba(245,241,234,.85); font-weight:300;
  padding-left:1.3rem; position:relative;
}
.price-card li::before{
  content:'—'; position:absolute; left:0; color:var(--brass-light);
}

/* ===================== CONTACT ===================== */
.contact-content{ max-width:760px; }
.contact-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:2.6rem;
}
.contact-card{
  background: rgba(245,241,234,.06);
  border:1px solid rgba(245,241,234,.16);
  border-radius:14px;
  padding:1.6rem 1.3rem;
  display:flex; flex-direction:column; gap:.5rem;
  transition: border-color .35s, transform .35s;
}
.contact-card:hover{ border-color:var(--brass-light); transform:translateY(-4px); }
.contact-icon{ font-size:1.4rem; color:var(--brass-light); }
.contact-label{ font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(245,241,234,.6); font-weight:600; }
.contact-value{ font-size:1rem; font-weight:500; }

/* ===================== FLOATING CONTACT BUTTONS ===================== */
.floating-contact{
  position:fixed; right:1.4rem; bottom:1.4rem; z-index:500;
  display:flex; flex-direction:column; gap:.8rem;
}
.float-btn{
  width:54px; height:54px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:var(--cream);
  box-shadow: 0 10px 28px rgba(43,38,32,.28);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), background .3s;
  backdrop-filter: blur(8px);
}
.float-btn:hover{ transform: translateY(-3px) scale(1.05); box-shadow: 0 16px 36px rgba(43,38,32,.34); }
.float-whatsapp{ background: linear-gradient(145deg, #3FBF60, #2BA84A); }
.float-call{ background: linear-gradient(145deg, var(--brass-light), var(--brass)); color:var(--ink); }

@media (max-width: 880px){
  .floating-contact{ right:1rem; bottom:1rem; gap:.6rem; }
  .float-btn{ width:48px; height:48px; }
}
/* Fade-up handles entrance animation now (see HOME HERO section above) */

/* ===================== RESPONSIVE ===================== */
@media (max-width: 1080px){
  .capability-row{ grid-template-columns:repeat(2,1fr); }
  .process-row{ grid-template-columns:1fr 1fr; }
  .process-row::before{ display:none; }
  .pricing-row{ grid-template-columns:1fr; max-width:420px; }
  .showcase-grid{ grid-template-columns:1fr 1fr; grid-template-rows:repeat(3,1fr); height:auto; min-height:60vh; }
  .showcase-tall{ grid-row:span 1; }
  .about-grid{ grid-template-columns:1fr; gap:2.4rem; }
  .about-media{ max-width:380px; margin:0 auto; }
  .testimonial-grid{ grid-template-columns:1fr 1fr; }
  .stats-row{ justify-content:center; }
}

@media (max-width: 880px){
  :root{ --header-h: 96px; }

  /* ── Full-screen overlay ── */
  .main-nav{
    position:fixed; inset:0;
    background:
      radial-gradient(ellipse at 100% 0%, rgba(182,136,79,.18) 0%, transparent 55%),
      radial-gradient(ellipse at 0% 100%, rgba(182,136,79,.10) 0%, transparent 50%),
      linear-gradient(160deg, #1a1612 0%, #2b2620 100%);
    z-index:9000;
    display:flex; flex-direction:column;
    opacity:0; visibility:hidden; pointer-events:none;
    transition: opacity .45s var(--ease), visibility .45s var(--ease);
  }
  .main-nav.open{ opacity:1; visibility:visible; pointer-events:auto; }

  /* ── Header row: logo + close ── */
  .main-nav-head{
    display:flex; align-items:center; justify-content:space-between;
    padding:1.4rem 1.6rem;
    border-bottom:1px solid rgba(182,136,79,.15);
    flex-shrink:0;
    gap:12px;
  }
  .logo--mobile-nav{
    color:var(--cream);
    flex:0 1 auto;
    min-width:0;
    max-width:calc(100% - 56px);
    display:flex;
    align-items:center;
    justify-content:flex-start;
  }
  .logo--mobile-nav .logo-sub{ color:var(--brass-light); }
  .logo--mobile-nav img.nhi-logo{
    max-height:36px !important;
    height:36px !important;
    width:auto !important;
    max-width:100% !important;
    object-fit:contain;
    object-position:left center;
  }
  .nav-close{
    width:40px; height:40px; border-radius:50%;
    background: rgba(182,136,79,.12);
    border:1px solid rgba(182,136,79,.3);
    display:flex; align-items:center; justify-content:center;
    cursor:pointer; position:relative; flex-shrink:0;
    transition: background .3s, transform .3s;
    margin-left:auto;
  }
  .nav-close:hover{ background:rgba(182,136,79,.28); transform:rotate(90deg); }
  .nav-close span{
    position:absolute; width:16px; height:1.5px;
    background:var(--brass-light); border-radius:1px;
  }
  .nav-close span:first-child{ transform:rotate(45deg); }
  .nav-close span:last-child{ transform:rotate(-45deg); }

  /* ── Nav list ── */
  .main-nav > ul{
    flex:1; overflow-y:auto;
    display:flex; flex-direction:column; justify-content:flex-start;
    gap:0; padding:1rem 1.6rem 1rem;
    background:none; border:none; box-shadow:none; backdrop-filter:none;
  }
  .main-nav > ul > li{
    border-bottom:1px solid rgba(245,241,234,.06);
  }
  .main-nav .nav-icon{ display:none; }
  .main-nav .nav-label{ display:inline; }

  /* Main nav links */
  .main-nav .nav-link{
    display:block; width:100%;
    font-family: var(--font-display);
    font-size:clamp(1.3rem, 5vw, 1.65rem);
    font-weight:300; letter-spacing:.04em; text-transform:none;
    color: rgba(245,241,234,.75);
    padding:.65rem 0;
    background:none; position:relative;
    transition: color .3s, padding-left .3s;
  }
  .main-nav .nav-link::before{ display:none; }
  .main-nav .nav-link::after{
    content:''; position:absolute; left:0; bottom:0;
    width:0; height:1px; background:var(--brass-light);
    transition: width .35s var(--ease);
  }
  .main-nav .nav-link:hover,
  .main-nav .nav-link.active{
    color:var(--cream); background:none; padding-left:.5rem;
  }
  .main-nav .nav-link:hover::after,
  .main-nav .nav-link.active::after{ width:2.4rem; }
  .main-nav .nav-link.active{ color:var(--brass-light); }

  /* Services sub-items — small chip row */
  .main-nav li.has-dropdown{
    display:flex; flex-direction:column; gap:.8rem;
  }
  .main-nav li.has-dropdown > .nav-link::before{ display:none; }
  .main-nav .sub-menu{
    position:static; transform:none; opacity:1; visibility:visible; pointer-events:auto;
    background:transparent; border:none; box-shadow:none; backdrop-filter:none;
    min-width:auto; padding:.1rem 0 .6rem .3rem;
    display:flex; flex-wrap:wrap; gap:.4rem; align-items:center;
  }
  .main-nav .sub-menu li{ list-style:none; }
  .main-nav .sub-menu .nav-link{
    font-family:var(--font-body);
    font-size:.75rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase;
    color:rgba(245,241,234,.45);
    padding:.35rem .75rem;
    background:rgba(245,241,234,.05);
    border:1px solid rgba(245,241,234,.1);
    border-radius:999px;
    width:auto; display:inline-block;
    transition: color .3s, background .3s, border-color .3s;
  }
  .main-nav .sub-menu .nav-link::after{ display:none; }
  .main-nav .sub-menu .nav-link:hover,
  .main-nav .sub-menu .nav-link.active{
    color:var(--brass-light);
    background:rgba(182,136,79,.12);
    border-color:rgba(182,136,79,.3);
    padding-left:.75rem;
  }

  /* ── Footer strip ── */
  .main-nav-foot{
    display:flex; align-items:center; justify-content:center; gap:1.4rem;
    padding:.9rem 1.6rem;
    border-top:1px solid rgba(182,136,79,.12);
    flex-shrink:0;
  }
  .main-nav-foot a{
    color:rgba(245,241,234,.45); font-size:.78rem; letter-spacing:.1em;
    text-transform:uppercase; transition:color .3s;
  }
  .main-nav-foot a:hover{ color:var(--brass-light); }
  .main-nav-foot-sep{
    width:3px; height:3px; border-radius:50%;
    background:rgba(182,136,79,.3);
  }

  .nav-toggle{ display:flex; }
  .header-phone{ display:none; }
  .site-header{ padding:1.2rem 1.4rem; }
  body.inner-page .site-header.scrolled,
  .site-header.scrolled{ padding:.8rem 1.4rem; }
  .contact-grid{ grid-template-columns:1fr; }
  .hero-scroll-cue{ display:none; }
  .stats-row{ gap:1.8rem 1.2rem; }
  .stats-divider{ display:none; }
}

@media (max-width: 600px){
  .capability-row{ grid-template-columns:1fr; }
  .process-row{ grid-template-columns:1fr; gap:2.2rem; }
  .display-xl{ font-size: clamp(2.6rem, 14vw, 4.5rem); }
  .display-lg{ font-size: clamp(2rem, 9vw, 3rem); max-width:none; }
  .showcase-grid{ grid-template-columns:1fr; grid-template-rows:repeat(4, 200px); height:auto; }
  .value-grid{ flex-direction:column; }
  .pricing-row{ max-width:none; gap:1rem; }
  .price-card{ padding:1.6rem 1.3rem; }
  .price-badge{ right:1rem; font-size:.6rem; padding:.32rem .8rem; }
  .testimonial-grid{ grid-template-columns:1fr; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto !important; }
  .slide-bg img,
  .marquee-track,
  .hero-scroll-cue .chevron{ transition:none !important; animation:none !important; }
  .fade-up{ animation:none !important; opacity:1 !important; transform:none !important; }
}

/* ===========================================================
   SITE-WIDE PAGE LAYOUT (Home, About, Services, Gallery, Packages, Contact)
   Every page now uses this normal scrollable layout —
   header + hero + content sections + footer.
=========================================================== */
body.inner-page{
  background: var(--cream);
  color: var(--ink);
}

/* Every page keeps a permanent dark glass header bar that reads
   well over both photo heroes and plain content sections. */
body.inner-page .site-header{
  position:fixed;
  background: rgba(43,38,32,.55);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  box-shadow: 0 4px 24px rgba(43,38,32,.18);
}
body.inner-page .site-header.scrolled{
  background: rgba(43,38,32,.7);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  box-shadow: 0 4px 24px rgba(43,38,32,.22);
}

/* Page Hero */
.page-hero{
  position:relative;
  min-height: 56vh;
  display:flex; align-items:center;
  overflow:hidden;
  color:var(--cream);
}
.page-hero .slide-bg img{ transform:scale(1.04); transition:none; }
.page-hero .slide-overlay{
  background: linear-gradient(115deg, rgba(43,38,32,.85) 0%, rgba(43,38,32,.6) 45%, rgba(43,38,32,.35) 100%);
}
.page-hero-content{
  position:relative; z-index:1;
  max-width:1280px; margin:0 auto; width:100%;
  padding: 9rem 3.2rem 4rem;
}
.page-hero .eyebrow{ color:var(--brass-light); }
.page-hero h1{
  font-family:var(--font-display); font-weight:300;
  font-size: clamp(2.6rem, 6vw, 5rem);
  line-height:1.08; letter-spacing:-.01em;
  max-width:16ch;
}
.page-hero h1 em{ color:var(--brass-light); font-style:italic; }
.page-hero .lead{ margin-top:1rem; }

/* Generic content section wrapper */
.content-section{
  max-width:1280px; margin:0 auto;
  padding: 5rem 3.2rem;
}
.content-section.alt{ background: var(--white); }
.content-section .eyebrow{ color:var(--brass); }
.content-section h2{
  font-family:var(--font-display); font-weight:300;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height:1.15; margin-bottom:1.4rem; max-width:18ch;
  color:var(--ink);
}
.content-section h2 em{ color:var(--brass); font-style:italic; }
.content-section p{
  font-size:1.02rem; color:var(--ink-soft); font-weight:300;
  max-width:60ch; line-height:1.75; margin-bottom:1.2rem;
}

/* Re-skin component classes for light inner-page backgrounds */
.inner-page .value-grid{ margin-top:2rem; }
.inner-page .value-item h4{ color:var(--ink); }
.inner-page .value-item p{ color:var(--ink-soft); }

.inner-page .capability-row{ margin-top:1rem; }
.inner-page .capability-card{
  background: var(--white);
  border:1px solid rgba(43,38,32,.08);
}
.inner-page .capability-card:hover{
  border-color: var(--brass);
  background: rgba(182,136,79,.06);
}
.inner-page .capability-card h4{ color:var(--ink); }
.inner-page .capability-card p{ color:var(--ink-soft); }
.inner-page .cap-mark{ color:var(--brass); }

.inner-page .pricing-row{ margin-top:1rem; }
.inner-page .price-card{
  background: var(--white);
  border:1px solid rgba(43,38,32,.08);
  color:var(--ink);
}
.inner-page .price-card--featured{
  background: rgba(182,136,79,.07);
  border-color: var(--brass);
}
.inner-page .price-card h3{ color:var(--ink); }
.inner-page .price-tag{ color:var(--brass); }
.inner-page .price-tag span{ color: var(--ink-soft); }
.inner-page .price-desc{ color:var(--ink-soft); }
.inner-page .price-card li{ color: var(--ink-soft); }
.inner-page .price-card li::before{ color:var(--brass); }

.inner-page .showcase-grid{ height:auto; min-height:64vh; margin-top:1rem; }

.inner-page .contact-grid{ margin-top:1rem; margin-bottom:0; }
.inner-page .contact-card{
  background: var(--white);
  border:1px solid rgba(43,38,32,.08);
  color:var(--ink);
}
.inner-page .contact-label{ color:var(--ink-soft); }
.inner-page .contact-icon{ color:var(--brass); }

/* Contact form (inner contact page) */
.contact-form-wrap{
  display:grid; grid-template-columns: 1fr 1fr; gap:3rem; align-items:start;
  margin-top:1rem;
}
.contact-form .form-row{ display:flex; flex-direction:column; gap:.4rem; margin-bottom:1.2rem; }
.contact-form label{
  font-size:.74rem; letter-spacing:.16em; text-transform:uppercase;
  font-weight:600; color:var(--taupe);
}
.contact-form input,
.contact-form select,
.contact-form textarea{
  font-family:var(--font-body); font-size:1rem;
  border:1px solid rgba(43,38,32,.15);
  background:var(--white);
  border-radius:10px; padding:.9rem 1.1rem;
  color:var(--ink); resize:vertical;
  width:100%;
}
.contact-form select{ cursor:pointer; }
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
  outline:none; border-color:var(--brass);
}
.contact-form button{ border:none; cursor:pointer; }

/* CTA banner before footer */
.cta-banner{
  background: var(--ink); color:var(--cream);
  text-align:center; padding: 4.5rem 2rem;
}
.cta-banner h2{ color:var(--cream); margin:0 auto 1.6rem; }
.cta-banner h2 em{ color:var(--brass-light); }

/* ===========================================================
   SITE FOOTER (inner pages)
=========================================================== */
.site-footer{
  background: var(--ink); color: rgba(245,241,234,.8);
}
.footer-top{
  max-width:1280px; margin:0 auto;
  padding: 4.5rem 3.2rem 3rem;
  display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1.2fr; gap:2rem;
}
.footer-col h4{
  font-family:var(--font-display); font-weight:500; font-size:1.05rem;
  color:var(--cream); margin-bottom:1.2rem;
}
.footer-col ul{ display:flex; flex-direction:column; gap:.7rem; }
.footer-col ul a{
  font-size:.92rem; color:rgba(245,241,234,.7);
  transition: color .3s;
}
.footer-col ul a:hover{ color:var(--brass-light); }
.footer-contact li{ display:flex; align-items:center; gap:.6rem; font-size:.92rem; }
.footer-contact li span{ color:var(--brass-light); }

.footer-brand .logo{ color:var(--cream); margin-bottom:1rem; display:inline-flex; }
.footer-tagline{
  font-size:.92rem; color:rgba(245,241,234,.65); font-weight:300;
  max-width:32ch; line-height:1.6; margin-bottom:1.4rem;
}
.footer-social{ display:flex; gap:.7rem; }
.footer-social a{
  width:38px; height:38px; border-radius:50%;
  border:1px solid rgba(245,241,234,.2);
  display:flex; align-items:center; justify-content:center;
  font-size:.7rem; letter-spacing:.05em; font-weight:700;
  transition: border-color .3s, color .3s;
}
.footer-social a:hover{ border-color:var(--brass-light); color:var(--brass-light); }

.footer-cta-text{ font-size:.92rem; color:rgba(245,241,234,.65); margin-bottom:1.2rem; font-weight:300; }

.footer-bottom{
  border-top:1px solid rgba(245,241,234,.1);
  max-width:1280px; margin:0 auto;
  padding: 1.6rem 3.2rem;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:.6rem;
  font-size:.8rem; color:rgba(245,241,234,.5);
}

/* Responsive — inner pages */
@media (max-width: 1080px){
  .footer-top{ grid-template-columns: 1fr 1fr 1fr; }
  .contact-form-wrap{ grid-template-columns:1fr; }
}
@media (max-width: 600px){
  .footer-top{ grid-template-columns:1fr; padding: 3rem 1.4rem 2rem; }
  .footer-bottom{ flex-direction:column; padding:1.4rem; }
  .page-hero-content{ padding: 7rem 1.4rem 3rem; }
  .content-section{ padding: 3.2rem 1.4rem; }
}

/* ===========================================================
   HOME HERO — MOBILE
=========================================================== */
@media (max-width: 880px){
  .home-hero-content{ padding: 1.5rem 1.4rem 5rem; }
  .stats-band{ padding: 2.4rem 1.4rem; }
  .marquee-track span{ font-size:.92rem; padding: 0 1.2rem; }
  .marquee-track span::after{ margin-left:1.2rem; }
  .about-media .media-accent{ border-width:4px; }
}

/* ===========================================================
   LEAD CAPTURE POPUP
=========================================================== */
.nhi-lead-overlay{
  position:fixed; inset:0; z-index:2000;
  background: rgba(20,17,14,.72);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display:flex; align-items:center; justify-content:center;
  padding:1.6rem;
  opacity:0; visibility:hidden;
  transition: opacity .4s var(--ease), visibility .4s var(--ease);
}
.nhi-lead-overlay.open{ opacity:1; visibility:visible; }

.nhi-lead-modal{
  position:relative;
  background:var(--cream);
  border-radius:20px;
  overflow:hidden;
  max-width:760px; width:100%;
  max-height:88vh;
  display:grid; grid-template-columns: .85fr 1fr;
  box-shadow: 0 40px 90px rgba(0,0,0,.45);
  transform: translateY(24px) scale(.97);
  transition: transform .45s var(--ease);
}
.nhi-lead-overlay.open .nhi-lead-modal{ transform:translateY(0) scale(1); }

.nhi-lead-close{
  position:absolute; top:.8rem; right:.8rem; z-index:3;
  width:32px; height:32px; border-radius:50%;
  background:rgba(43,38,32,.45); color:var(--cream);
  border:none; cursor:pointer; font-size:1.2rem; line-height:1; font-weight:300;
  display:flex; align-items:center; justify-content:center;
  transition: background .3s, transform .3s;
}
.nhi-lead-close:hover{ background:var(--brass); color:var(--ink); transform:rotate(90deg); }

.nhi-lead-media{ position:relative; min-height:260px; }
.nhi-lead-media img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter: saturate(.95) brightness(.96);
}
.nhi-lead-media-overlay{
  position:absolute; inset:0;
  background: linear-gradient(200deg, rgba(43,38,32,.1) 0%, rgba(43,38,32,.45) 55%, rgba(43,38,32,.92) 100%);
}
.nhi-lead-media-text{
  position:absolute; left:0; right:0; bottom:0; padding:1.8rem 1.6rem;
  color:var(--cream);
}
.nhi-lead-media-text .eyebrow{
  color:var(--brass-light); font-size:.66rem; letter-spacing:.26em;
  text-transform:uppercase; font-weight:600; margin-bottom:.6rem;
}
.nhi-lead-media-text h3{
  font-family:var(--font-display); font-weight:300; font-size:1.35rem; line-height:1.28;
  text-shadow: 0 2px 10px rgba(0,0,0,.4);
}
.nhi-lead-media-text h3 em{ color:var(--brass-light); font-style:italic; }

.nhi-lead-form-wrap{
  padding:1.9rem 1.9rem;
  overflow-y:auto;
  min-height:0; /* critical: lets this grid item scroll instead of being clipped by the modal's overflow:hidden */
  color:var(--ink);
}
.nhi-lead-form-wrap .eyebrow{
  color:var(--brass); font-size:.66rem; letter-spacing:.26em;
  text-transform:uppercase; font-weight:600; margin-bottom:.4rem;
}
.nhi-lead-form-wrap h3{
  font-family:var(--font-display); font-weight:500; font-size:1.3rem;
  margin-bottom:.4rem; color:var(--ink);
}
.nhi-lead-sub{
  font-size:.82rem; color:var(--ink-soft); margin-bottom:1.1rem; line-height:1.5; font-weight:300;
}
.nhi-lead-form .form-row{ margin-bottom:.65rem; gap:.25rem; }
.nhi-lead-form label{ font-size:.68rem; }
.nhi-lead-form input,
.nhi-lead-form select{ padding:.7rem .9rem; font-size:.92rem; }
.nhi-lead-submit{ width:100%; justify-content:center; margin-top:.3rem; padding:.85rem 2.3rem; }

.nhi-lead-thanks{ text-align:center; padding:2rem 0; }
.nhi-lead-thanks h3{
  font-family:var(--font-display); font-weight:500; font-size:1.5rem; color:var(--brass); margin-bottom:.6rem;
}
.nhi-lead-thanks p{ color:var(--ink-soft); font-size:.9rem; }

/* Tablet: keep both columns but tighten further */
@media (max-width: 900px){
  .nhi-lead-modal{ max-width:600px; }
}

/* Mobile: drop the image entirely — the form is what matters, and there's
   rarely enough vertical room for both on a phone screen. */
@media (max-width: 640px){
  .nhi-lead-modal{
    grid-template-columns:1fr;
    max-width:92vw; width:100%;
    max-height:90vh;
  }
  .nhi-lead-media{ min-height:130px; }
  .nhi-lead-media-text{ padding:1.2rem 1.3rem; }
  .nhi-lead-media-text .eyebrow{ font-size:.6rem; margin-bottom:.4rem; }
  .nhi-lead-media-text h3{ font-size:1.05rem; }
  .nhi-lead-form-wrap{ padding:1.5rem 1.3rem 1.7rem; overflow-y:auto; }
  .nhi-lead-form-wrap h3{ font-size:1.15rem; }
  .nhi-lead-sub{ margin-bottom:.9rem; }
  .nhi-lead-form .form-row{ margin-bottom:.55rem; }
}

@media (prefers-reduced-motion: reduce){
  .nhi-lead-overlay, .nhi-lead-modal, .nhi-lead-close{ transition:none !important; }
}