/* ============================================================
   Layout — container, sections, header, footer, nav, blobs, waves
   The differentiator: asymmetric grids + organic shapes.
   ============================================================ */
.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }
.container--narrow { max-width: var(--container-narrow); }

.section { padding-block: var(--section-y); position: relative; }
.section--alt { background: var(--bg-alt); }
.section--night { background: var(--bg-night); color: var(--text-on-dark); }
.section--night h1, .section--night h2, .section--night h3 { color: var(--moon); }
.section--night p { color: var(--text-on-dark-soft); }
.section--center { text-align: center; }
.section--tight { padding-block: clamp(2rem, 5vw, 3.5rem); }

/* Soft floating glow orbs behind sections */
.orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  opacity: 0.55;
  pointer-events: none;
  z-index: 0;
}
.orb--lav { background: var(--glow); }
.orb--rose { background: var(--rose-glow); }
.section > .container { position: relative; z-index: 1; }

/* ---- Organic blob shapes ---- */
.blob { position: absolute; inset: 0; width: 100%; height: 100%; }
.blob path { fill: var(--lavender); opacity: 0.18; }

/* Image masks: organic, never sharp arches */
.mask-blob { display: block; overflow: hidden; position: relative; }
.mask-blob img,
.mask-blob > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mask-blob--1 { border-radius: 63% 37% 54% 46% / 55% 48% 52% 45%; }
.mask-blob--2 { border-radius: 38% 62% 63% 37% / 41% 44% 56% 59%; }
.mask-blob--3 { border-radius: 49% 51% 36% 64% / 57% 38% 62% 43%; }
.mask-blob--4 { border-radius: 60% 40% 47% 53% / 39% 57% 43% 61%; }

/* ---- Wave dividers ---- */
.wave { position: absolute; left: 0; width: 100%; line-height: 0; z-index: 2; pointer-events: none; }
.wave--bottom { bottom: -1px; }
.wave--top { top: -1px; }
.wave svg { width: 100%; height: clamp(40px, 6vw, 90px); display: block; }

/* ============================================================
   Header
   ============================================================ */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: var(--moon);
  transition: background 0.4s var(--ease), box-shadow 0.4s var(--ease);
}
.site-header__inner {
  display: flex; align-items: center; gap: 1.5rem;
  min-height: var(--header-h);
}
.site-header__brand { margin-right: auto; }
.site-header__wave { display: none; }

.site-header.is-scrolled { background: var(--moon); box-shadow: 0 12px 40px -24px rgba(46,26,46,0.4); }

/* Transparent over hero */
.site-header--transparent { position: fixed; left: 0; right: 0; background: transparent; }
.site-header--transparent .brand__name,
.site-header--transparent .primary-nav__list a { color: var(--moon); }
.site-header--transparent .nav-toggle__bar,
.site-header--transparent .nav-toggle__bar::before,
.site-header--transparent .nav-toggle__bar::after { background: var(--moon); }
.site-header--transparent.is-scrolled { position: fixed; background: var(--moon); box-shadow: 0 12px 40px -24px rgba(46,26,46,0.4); }
.site-header--transparent.is-scrolled .brand__name,
.site-header--transparent.is-scrolled .primary-nav__list a { color: var(--ink); }
.site-header--transparent.is-scrolled .nav-toggle__bar,
.site-header--transparent.is-scrolled .nav-toggle__bar::before,
.site-header--transparent.is-scrolled .nav-toggle__bar::after { background: var(--ink); }
.has-transparent-header { /* hero sits under fixed header */ }

.brand { display: inline-flex; align-items: center; gap: 0.6rem; font-family: var(--font-display); }
.brand__mark { color: var(--rose); font-size: 1.4rem; }
.brand__name { font-weight: 600; font-size: 1.2rem; color: var(--ink); letter-spacing: 0.01em; }
.brand--light .brand__name { color: var(--moon); }
.custom-logo { max-height: 56px; width: auto; }

/* Primary nav */
.primary-nav__list { list-style: none; display: flex; gap: 1.6rem; padding: 0; margin: 0; }
.primary-nav__list a {
  font-size: 0.96rem; font-weight: 500; color: var(--ink);
  position: relative; padding-block: 0.4rem;
}
.primary-nav__list a::after {
  content: ""; position: absolute; left: 0; bottom: -2px; height: 2px; width: 0;
  background: var(--rose); transition: width 0.3s var(--ease);
}
.primary-nav__list a:hover::after,
.primary-nav__list .current-menu-item > a::after { width: 100%; }
.site-header__cta { display: inline-flex; }

/* Mobile nav toggle */
.nav-toggle {
  display: none; width: 44px; height: 44px; border: 0; background: transparent;
  position: relative; cursor: pointer;
}
.nav-toggle__bar, .nav-toggle__bar::before, .nav-toggle__bar::after {
  content: ""; position: absolute; left: 10px; width: 24px; height: 2px; background: var(--ink);
  border-radius: 2px; transition: transform 0.3s var(--ease), opacity 0.3s var(--ease);
}
.nav-toggle__bar { top: 21px; }
.nav-toggle__bar::before { top: -7px; }
.nav-toggle__bar::after { top: 7px; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar { background: transparent; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar::before { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar::after { transform: translateY(-7px) rotate(-45deg); }

/* Mobile drawer */
.mobile-nav {
  position: fixed; inset: 0; top: var(--header-h); z-index: 99;
  background: var(--moon); padding: 2rem var(--gutter) 3rem;
  transform: translateY(-12px); opacity: 0; transition: opacity 0.3s var(--ease), transform 0.3s var(--ease);
  overflow-y: auto;
}
.mobile-nav[hidden] { display: none; }
.mobile-nav.is-open { opacity: 1; transform: translateY(0); }
.mobile-nav__list { list-style: none; padding: 0; margin: 0 0 2rem; }
.mobile-nav__list li { border-bottom: 1px solid var(--line); }
.mobile-nav__list a { display: block; padding: 1rem 0; font-size: 1.2rem; font-family: var(--font-display); color: var(--ink); }
.mobile-nav__cta { display: grid; gap: 0.8rem; }

/* ============================================================
   Footer
   ============================================================ */
.site-footer { background: var(--bg-night); color: var(--text-on-dark); position: relative; padding-top: clamp(3rem, 6vw, 5rem); }
.site-footer__wave { display: block; }
.site-footer__wave svg path { fill: var(--bg-night); }
.site-footer__grid {
  display: grid; grid-template-columns: 1.6fr 1fr 1.2fr; gap: clamp(2rem, 5vw, 4rem);
  padding-bottom: 3rem;
}
.site-footer__tag { color: var(--text-on-dark-soft); margin: 1rem 0; max-width: 38ch; }
.site-footer__title { font-size: 1.05rem; color: var(--lavender); margin-bottom: 1rem; letter-spacing: 0.02em; }
.site-footer__menu { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.6rem; }
.site-footer__menu a { color: var(--text-on-dark-soft); }
.site-footer__menu a:hover { color: var(--moon); }
.site-footer__actions { margin-top: 1rem; }
.site-footer__bar { border-top: 1px solid var(--line-dark); padding-block: 1.4rem; }
.site-footer__bar-inner { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.site-footer__copy, .site-footer__disclaimer { color: var(--text-on-dark-soft); font-size: 0.85rem; margin: 0; }
.site-footer__disclaimer { font-style: italic; }

/* NAP / trust */
.nap { font-style: normal; display: grid; gap: 0.35rem; }
.nap__name { font-weight: 600; color: var(--moon); }
.nap__line, .nap__hours { color: var(--text-on-dark-soft); font-size: 0.95rem; }
.nap__phone { color: var(--rose); font-weight: 600; }
.trust-strip { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 500; font-size: 0.95rem; }
.trust-strip__star { color: var(--thread); }
.trust-strip--light { color: var(--text-on-dark-soft); }

/* Sticky mobile call */
.sticky-call {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 95;
  display: none; gap: 0.6rem; padding: 0.7rem var(--gutter);
  background: rgba(244,241,236,0.92); backdrop-filter: blur(10px);
  border-top: 1px solid var(--line);
}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 900px) {
  .primary-nav, .site-header__cta { display: none; }
  .nav-toggle { display: block; }
  .site-footer__grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .sticky-call { display: grid; grid-template-columns: 1fr 1fr; }
  body { padding-bottom: 76px; }
}