/* ==========================================================================
   IYS — Layout: shell, header, hero, sections, footer
   ========================================================================== */

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

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(248,249,251,0.92);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(225,230,236,0.6);
  transition:box-shadow var(--dur) var(--ease), background var(--dur) var(--ease);
}
.site-header.is-scrolled{
  box-shadow:var(--shadow-header);
  background:rgba(248,249,251,0.97);
}

.navbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; height:var(--header-h);
}

.nav-links{
  display:flex; align-items:center; gap:4px;
  list-style:none;
}
.nav-links a{
  display:inline-block;
  padding:9px 13px;
  border-radius:var(--radius-sm);
  font-size:var(--text-button);
  font-weight:700;
  letter-spacing:0.04em;
  text-transform:uppercase;
  color:var(--on-surface-variant);
  transition:color var(--dur) var(--ease), background var(--dur) var(--ease);
}
.nav-links a:hover{ color:var(--primary); background:var(--surface-container); }
.nav-links a.is-active{
  color:var(--primary);
  background:var(--surface-container);
  box-shadow:inset 0 -2px 0 var(--gold);
}

.nav-toggle{
  display:none;
  align-items:center; justify-content:center;
  width:44px; height:44px;
  background:none; border:none; cursor:pointer;
  color:var(--navy-deep); border-radius:var(--radius-sm);
}
.nav-toggle:hover{ background:var(--surface-container); }

/* Mobile drawer */
@media (max-width:1080px){
  .nav-links{
    position:fixed; inset:var(--header-h) 0 auto 0;
    flex-direction:column; align-items:stretch; gap:0;
    padding:12px var(--gutter) 24px;
    background:var(--surface);
    border-bottom:1px solid var(--border);
    box-shadow:var(--shadow-header);
    transform:translateY(-8px);
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity var(--dur) var(--ease), transform var(--dur) var(--ease), visibility var(--dur);
  }
  .nav-links.is-open{
    opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0);
  }
  .nav-links a{
    padding:14px 12px;
    border-bottom:1px solid var(--border);
    border-radius:0;
  }
  .nav-links li:last-child a{ border-bottom:none; }
  .nav-toggle{ display:inline-flex; }
  .navbar > .btn{ display:none; }
}

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{
  position:relative;
  display:flex; align-items:center;
  min-height:min(78vh,760px);
  padding:calc(var(--header-h) + var(--section-std)) 0 var(--section-std);
  background:var(--navy-deep);
  color:var(--white);
  overflow:hidden;
}
.hero__media{
  position:absolute; inset:0; z-index:0;
}
.hero__media img{
  width:100%; height:100%; object-fit:cover;
  opacity:0.38;
  transform:scale(1.04);
}
/* Navy wash so the display type always clears contrast over the photograph. */
.hero__media::after{
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(100deg, var(--navy-deep) 8%, rgba(8,26,51,0.88) 42%, rgba(8,26,51,0.55) 100%),
    radial-gradient(circle at 78% 18%, rgba(228,200,122,0.16) 0%, transparent 58%);
}
.hero__inner{ position:relative; z-index:2; }
.hero__content{ max-width:820px; }
.hero h1{ color:var(--white); margin-top:20px; }
.hero__sub{
  color:var(--secondary-fixed-dim);
  max-width:620px;
  margin-top:22px;
}
.hero__ctas{ display:flex; flex-wrap:wrap; gap:14px; margin-top:38px; }

.hero__wave{
  position:absolute; bottom:-1px; left:0; z-index:1;
  width:100%; height:80px;
  opacity:0.55; pointer-events:none;
}

/* ==========================================================================
   SECTIONS
   ========================================================================== */
.section{
  padding:var(--section-std) 0;
  scroll-margin-top:var(--header-h);
}
.section--tight{ padding:var(--section-tight) 0; }
.section--surface{ background:var(--surface); }
.section--white{ background:var(--white); }
.section--navy{ background:var(--navy-deep); color:var(--white); }

.section-head{ max-width:720px; margin-bottom:48px; }
.section-head--center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-head h2{ margin-top:12px; }
/* :not(.eyebrow) — otherwise this rule outranks .eyebrow and greys the kicker. */
.section-head p:not(.eyebrow){ color:var(--mute); margin-top:14px; font-size:var(--text-body-lg); }
.section--navy .section-head h2{ color:var(--white); }
.section--navy .section-head p:not(.eyebrow){ color:var(--secondary-fixed-dim); }

.subsection{ margin-bottom:var(--grid-gap-lg); scroll-margin-top:var(--header-h); }
.subsection:last-child{ margin-bottom:0; }

.rule{ height:1px; background:var(--border); border:0; margin:0; }

/* ==========================================================================
   GRIDS
   ========================================================================== */
.grid{ display:grid; gap:var(--grid-gap-md); }
.grid--2{ grid-template-columns:repeat(2,1fr); }
.grid--3{ grid-template-columns:repeat(3,1fr); }
.grid--4{ grid-template-columns:repeat(4,1fr); }
.grid--split{ grid-template-columns:repeat(2,1fr); gap:var(--grid-gap-lg); align-items:center; }
.grid--split-top{ align-items:start; }
.grid--gap-lg{ gap:var(--grid-gap-lg); }
.stack{ display:flex; flex-direction:column; gap:14px; }

@media (max-width:960px){
  .grid--3,.grid--4{ grid-template-columns:repeat(2,1fr); }
  .grid--2,.grid--split{ grid-template-columns:1fr; }
}
@media (max-width:620px){
  .grid--3,.grid--4{ grid-template-columns:1fr; }
}

/* Media-first order swap for the alternating service rows */
.order-first{ order:-1; }
@media (max-width:960px){ .order-first{ order:0; } }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{
  background:var(--navy-deep);
  color:var(--secondary-fixed-dim);
  padding:var(--section-std) 0 28px;
  border-top:1px solid rgba(119,141,178,0.2);
}
.footer-grid{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:var(--grid-gap-lg);
  padding-bottom:40px;
  border-bottom:1px solid var(--border-on-dark);
}
@media (max-width:960px){ .footer-grid{ grid-template-columns:1fr 1fr; gap:36px; } }
@media (max-width:560px){ .footer-grid{ grid-template-columns:1fr; } }

.site-footer h4{
  color:var(--primary-fixed-dim,#b1c7f0);
  font-family:var(--font-body);
  font-size:var(--text-label);
  font-weight:700;
  letter-spacing:0.1em;
  text-transform:uppercase;
  margin-bottom:16px;
}
.footer-links{ list-style:none; display:flex; flex-direction:column; gap:11px; }
.footer-links a{
  font-size:var(--text-body-sm);
  color:var(--surface-variant,#e0e3e5);
  transition:color var(--dur) var(--ease);
}
.footer-links a:hover{ color:var(--gold-light); }

.footer-blurb{
  font-size:var(--text-body-sm);
  color:var(--secondary-fixed-dim);
  max-width:280px;
  margin-top:18px;
  line-height:1.7;
}

.footer-bottom{
  display:flex; flex-wrap:wrap; gap:12px;
  justify-content:space-between; align-items:center;
  padding-top:24px;
  font-size:12px;
  color:#6E85A0;
}
.footer-bottom .stamp{
  color:var(--gold-light); font-weight:700; letter-spacing:0.06em;
}