/* Shared: hamburger + full-screen overlay */

.hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 36px;
  height: 36px;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
  flex-shrink: 0;
}

.hamburger span {
  display: block;
  width: 22px;
  height: 1px;
  background: #2a2825;
  transition: transform 0.25s ease, opacity 0.25s ease;
}

.hamburger.is-open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.hamburger.is-open span:nth-child(2) { opacity: 0; }
.hamburger.is-open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.nav-overlay {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: #f6f5f1;
  display: flex;
  flex-direction: column;
  padding: 88px 32px 48px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  overflow-y: auto;
}

.nav-overlay.is-open { opacity: 1; visibility: visible; }

.nav-overlay__close {
  position: absolute;
  top: 22px;
  right: 22px;
  background: none;
  border: none;
  font-size: 26px;
  color: #2a2825;
  cursor: pointer;
  padding: 10px;
  line-height: 1;
}

.nav-overlay a {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: 36px;
  color: #2a2825;
  text-decoration: none;
  padding: 18px 0;
  border-bottom: 1px solid rgba(168, 163, 154, 0.35);
  transition: opacity 0.2s;
}

.nav-overlay a:hover { opacity: 0.6; }

.nav-overlay a.nav-overlay__cta {
  border-bottom: none;
  margin-top: 24px;
  font-family: 'Inter', sans-serif;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-weight: 400;
}

body.nav-open { overflow: hidden; }

@media (max-width: 900px) {
  .hamburger { display: flex; }
  /* keep all navs as a row (overrides mockup's flex-direction: column on mobile) */
  nav, nav.site-nav, .nav {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    padding: 24px 28px !important;
  }
  .nav-links { display: none !important; }
}

/* ============================================================
   SITE NAV — canonical styles (shared across all pages)
   ============================================================ */

nav {
  padding: 36px 56px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #f6f5f1;
}

.logo {
  font-family: 'Cormorant Garamond', serif;
  font-size: 26px;
  font-weight: 400;
  letter-spacing: 0.22em;
  color: #2a2825;
  text-decoration: none;
}

.nav-links {
  display: flex;
  gap: 38px;
  align-items: center;
  list-style: none;
}

.nav-links a {
  color: #2a2825;
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.1em;
  transition: opacity 0.3s;
}

.nav-links a:hover { opacity: 0.55; }

.nav-links a[aria-current="page"] {
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
}

.nav-cta {
  background: #2a2825;
  border: none;
  padding: 14px 26px;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #f6f5f1 !important;
  text-decoration: none;
  transition: background 0.3s;
}

.nav-cta:hover { background: #58544e; opacity: 1 !important; }

/* ============================================================
   ALTAR'D HEALING -- FOUR-TONE BACKGROUND SYSTEM  v1.0
   Backgrounds-only pass. Do not modify for typography/layout.
   ============================================================ */

/* -- Shared stacking context -- */
[class*="bg-marble"],
[class*="bg-oat"],
[class*="bg-deep-clay"] {
  position: relative;
  isolation: isolate;
}

/* -- Plaster cloud -- ::before -- */
[class*="bg-marble"]::before,
[class*="bg-oat"]::before,
[class*="bg-deep-clay"]::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='c'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.012' numOctaves='3' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)'/%3E%3C/svg%3E");
  background-size: 600px 600px;
  opacity: 0.18;
  pointer-events: none;
  mix-blend-mode: overlay;
  z-index: 0;
}

/* -- Paper grain -- ::after -- */
[class*="bg-marble"]::after,
[class*="bg-oat"]::after,
[class*="bg-deep-clay"]::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.4 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  opacity: 0.06;
  pointer-events: none;
  mix-blend-mode: multiply;
  z-index: 0;
}

/* -- Base tones -- */
.bg-marble    { background: #f6f5f1; }
.bg-oat       { background: #e8ddd0; }
.bg-deep-clay { background: #7d5c46; }

/* Footer: marble, no texture pseudo-elements */
.bg-marble--flat { background: #f6f5f1; }

/* ============================================================
   MARBLE WEATHER PRESETS
   ============================================================ */
.bg-marble.weather-m-1 {
  background:
    radial-gradient(ellipse 60% 50% at 50% 0%, rgba(255,253,248,0.9) 0%, rgba(255,253,248,0) 70%),
    radial-gradient(ellipse 40% 30% at 90% 100%, rgba(228,220,205,0.5) 0%, rgba(228,220,205,0) 70%),
    #f6f5f1;
}
.bg-marble.weather-m-2 {
  background:
    radial-gradient(ellipse 60% 50% at 10% 30%, rgba(255,253,248,0.85) 0%, rgba(255,253,248,0) 70%),
    radial-gradient(ellipse 50% 40% at 100% 90%, rgba(228,220,205,0.5) 0%, rgba(228,220,205,0) 70%),
    #f6f5f1;
}
.bg-marble.weather-m-3 {
  background:
    radial-gradient(ellipse 80% 60% at 50% 50%, rgba(255,253,248,0.6) 0%, rgba(255,253,248,0) 70%),
    radial-gradient(ellipse 30% 25% at 95% 5%, rgba(228,220,205,0.4) 0%, rgba(228,220,205,0) 70%),
    #f6f5f1;
}

/* ============================================================
   OAT WEATHER PRESETS
   ============================================================ */
.bg-oat.weather-oat-1 {
  background:
    radial-gradient(ellipse 70% 50% at 85% 20%, rgba(252,235,200,0.7) 0%, rgba(252,235,200,0) 65%),
    radial-gradient(ellipse 50% 40% at 10% 90%, rgba(195,165,130,0.45) 0%, rgba(195,165,130,0) 70%),
    linear-gradient(115deg, #ede0cc 0%, #e8ddd0 50%, #ddc9b0 100%);
}
.bg-oat.weather-oat-2 {
  background:
    radial-gradient(ellipse 60% 50% at 15% 25%, rgba(252,235,200,0.7) 0%, rgba(252,235,200,0) 65%),
    radial-gradient(ellipse 50% 60% at 95% 90%, rgba(195,165,130,0.45) 0%, rgba(195,165,130,0) 70%),
    linear-gradient(85deg, #ede0cc 0%, #e8ddd0 50%, #ddc9b0 100%);
}
.bg-oat.weather-oat-3 {
  background:
    radial-gradient(ellipse 50% 40% at 75% 75%, rgba(252,235,200,0.6) 0%, rgba(252,235,200,0) 70%),
    radial-gradient(ellipse 60% 50% at 20% 10%, rgba(195,165,130,0.4) 0%, rgba(195,165,130,0) 70%),
    linear-gradient(200deg, #ede0cc 0%, #e8ddd0 50%, #ddc9b0 100%);
}
.bg-oat.weather-oat-4 {
  background:
    radial-gradient(ellipse 80% 40% at 50% 10%, rgba(252,235,200,0.65) 0%, rgba(252,235,200,0) 70%),
    radial-gradient(ellipse 80% 30% at 50% 100%, rgba(195,165,130,0.4) 0%, rgba(195,165,130,0) 70%),
    linear-gradient(180deg, #ede0cc 0%, #e8ddd0 50%, #ddc9b0 100%);
}

/* ============================================================
   DEEP CLAY WEATHER PRESETS
   ============================================================ */
.bg-deep-clay.weather-dc-a {
  background:
    radial-gradient(ellipse 55% 40% at 75% 20%, rgba(195,150,115,0.6) 0%, rgba(195,150,115,0) 65%),
    radial-gradient(ellipse 60% 50% at 15% 95%, rgba(60,40,28,0.7) 0%, rgba(60,40,28,0) 70%),
    linear-gradient(150deg, #8a6850 0%, #7d5c46 50%, #5e4534 100%);
}
.bg-deep-clay.weather-dc-b {
  background:
    radial-gradient(ellipse 55% 40% at 25% 20%, rgba(195,150,115,0.6) 0%, rgba(195,150,115,0) 65%),
    radial-gradient(ellipse 60% 50% at 85% 95%, rgba(60,40,28,0.7) 0%, rgba(60,40,28,0) 70%),
    linear-gradient(210deg, #8a6850 0%, #7d5c46 50%, #5e4534 100%);
}
.bg-deep-clay.weather-dc-c {
  background:
    radial-gradient(ellipse 70% 35% at 50% 15%, rgba(195,150,115,0.55) 0%, rgba(195,150,115,0) 70%),
    radial-gradient(ellipse 80% 60% at 50% 105%, rgba(60,40,28,0.7) 0%, rgba(60,40,28,0) 70%),
    linear-gradient(180deg, #8a6850 0%, #7d5c46 50%, #5e4534 100%);
}
.bg-deep-clay.weather-dc-d {
  background:
    radial-gradient(ellipse 40% 70% at 10% 50%, rgba(195,150,115,0.6) 0%, rgba(195,150,115,0) 70%),
    radial-gradient(ellipse 50% 80% at 100% 50%, rgba(60,40,28,0.7) 0%, rgba(60,40,28,0) 70%),
    linear-gradient(90deg, #8a6850 0%, #7d5c46 50%, #5e4534 100%);
}
.bg-deep-clay.weather-dc-e {
  background:
    radial-gradient(ellipse 40% 70% at 90% 50%, rgba(195,150,115,0.6) 0%, rgba(195,150,115,0) 70%),
    radial-gradient(ellipse 50% 80% at 0% 50%, rgba(60,40,28,0.7) 0%, rgba(60,40,28,0) 70%),
    linear-gradient(270deg, #8a6850 0%, #7d5c46 50%, #5e4534 100%);
}
.bg-deep-clay.weather-dc-f {
  background:
    radial-gradient(ellipse 50% 30% at 60% 80%, rgba(195,150,115,0.55) 0%, rgba(195,150,115,0) 70%),
    radial-gradient(ellipse 70% 50% at 30% 10%, rgba(60,40,28,0.65) 0%, rgba(60,40,28,0) 70%),
    linear-gradient(165deg, #8a6850 0%, #7d5c46 50%, #5e4534 100%);
}
.bg-deep-clay.weather-dc-g {
  background:
    radial-gradient(ellipse 60% 40% at 50% 35%, rgba(195,150,115,0.55) 0%, rgba(195,150,115,0) 70%),
    radial-gradient(ellipse 90% 50% at 50% 110%, rgba(35,20,12,0.8) 0%, rgba(35,20,12,0) 65%),
    linear-gradient(180deg, #8a6850 0%, #7d5c46 50%, #5e4534 100%);
}
.bg-deep-clay.weather-dc-h {
  background:
    radial-gradient(ellipse 40% 35% at 70% 30%, rgba(195,150,115,0.55) 0%, rgba(195,150,115,0) 70%),
    radial-gradient(ellipse 70% 60% at 20% 100%, rgba(60,40,28,0.7) 0%, rgba(60,40,28,0) 70%),
    linear-gradient(135deg, #8a6850 0%, #7d5c46 50%, #5e4534 100%);
}

/* -- Shadow modifier -- .body-talking ONLY -- */
.bg-deep-clay--shadow {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(ellipse 40% 30% at 25% 20%, rgba(150,110,85,0.50) 0%, rgba(150,110,85,0) 70%),
    radial-gradient(ellipse 75% 45% at 50% 105%, rgba(195,150,115,0.60) 0%, rgba(195,150,115,0) 65%),
    radial-gradient(ellipse 40% 30% at 85% 90%, rgba(18,10,5,0.40) 0%, rgba(18,10,5,0) 65%),
    linear-gradient(210deg, #967260 0%, #8a6450 50%, #6e5040 100%);
}

/* ============================================================
   KIT (ConvertKit) EMAIL CAPTURE — shared opt-in component
   Markup + behavior live in kit-form.js. Each capture location is a
   <div class="kit-form" data-style="email-form|final-cta-form" data-button="…">
   that the script hydrates, reusing the page's existing form styling.
   ============================================================ */

/* Transparent wrapper: the hydrated form / message flows as if it were
   a direct child of the original parent, so existing layout is preserved. */
.kit-form { display: contents; }

/* Muted, non-interactive submit button while a request is in flight. */
.kit-form form button[disabled] { opacity: 0.55; cursor: default; }

/* Success message — inherits color + alignment from the surrounding section
   so it reads as marble on dark sections and ink on light ones. */
.kit-form__feedback {
  max-width: 500px;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: clamp(20px, 2.4vw, 26px);
  line-height: 1.4;
  color: inherit;
  padding: 14px 0;
}

/* Inline error — appears beneath the form, which stays editable. */
.kit-form__error {
  max-width: 500px;
  margin-top: 14px;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  letter-spacing: 0.02em;
  line-height: 1.5;
  color: inherit;
  opacity: 0.85;
}

/* Centered variants (final-cta) mirror the form's own margin: 0 auto. */
.kit-form__feedback.is-centered,
.kit-form__error.is-centered { margin-left: auto; margin-right: auto; }
