/* =========================================================
   Moon Spa — San Luis Obispo
   Warm spa palette: candlelit ink + champagne + sage + cream
   ========================================================= */

:root{
  /* Warmer "candlelit" ink — softer than pure midnight */
  --ink-900: #1a2030;
  --ink-800: #222a3d;
  --ink-700: #2c3450;
  --ink-500: #4a5470;

  /* Warmer cream — sandier, less white */
  --cream-50: #f6ede0;
  --cream-100: #f3ead9;
  --cream-200: #ebe1cb;
  --cream-300: #ddd0b3;

  /* Champagne gold — slightly softer */
  --gold-200: #e2cb9f;
  --gold-300: #d4b88a;
  --gold-500: #b59668;
  --gold-700: #8a6c3e;

  /* Soft sage — quiet botanical accent */
  --sage-300: #b6c2ad;
  --sage-500: #88997d;

  /* Darker, more readable text */
  --text-900: #1c2128;
  --text-700: #2c323c;
  --text-500: #4d5460;
  --text-300: #969aa4;

  --rule: #d6cdb4;
  --rule-dark: #303a52;

  --shadow-soft: 0 28px 60px -28px rgba(28, 22, 14, .28);
  --shadow-card: 0 1px 0 rgba(28, 22, 14, .04), 0 24px 44px -22px rgba(28, 22, 14, .16);

  --serif: 'Cormorant Garamond', 'Cormorant', Georgia, 'Times New Roman', serif;
  --body: 'Lora', Georgia, 'Times New Roman', serif;
  --sans: 'Lora', Georgia, 'Times New Roman', serif; /* alias for legacy refs */

  --max: 1240px;
  --gutter: clamp(20px, 4vw, 56px);
  --section-y: clamp(80px, 9vw, 140px);

  --radius-sm: 3px;
  --radius-md: 6px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--body);
  font-weight:400;
  font-size:17.5px;
  line-height:1.78;
  color:var(--text-700);
  background:var(--cream-50);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  /* Subtle paper-warm grain — keeps it from feeling flat / digital */
  background-image:
    radial-gradient(circle at 12% 14%, rgba(214, 185, 136, .06), transparent 40%),
    radial-gradient(circle at 88% 86%, rgba(136, 153, 125, .05), transparent 45%);
}

img,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

::selection{background:var(--gold-300);color:var(--ink-900)}

/* Keyboard focus — accessible across both light and dark sections */
:focus{outline:none}
:focus-visible{
  outline:2px solid var(--gold-500);
  outline-offset:3px;
  border-radius:2px;
}

/* ---------- Type scale ---------- */
.kicker{
  font-family:var(--body);
  font-size:12.5px;
  font-weight:600;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--gold-700);
  margin:0 0 20px;
}
.kicker--light{color:var(--gold-300)}

.display{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(46px,7vw,98px);
  line-height:1.02;
  letter-spacing:-.005em;
  color:var(--cream-50);
  margin:0 0 28px;
}
.display__accent{
  font-style:normal;
  font-weight:500;
  color:var(--gold-300);
  display:inline-block;
}

/* Global: no italics anywhere on the page */
em, i, .display em, address{ font-style:normal; }
.display--mid{
  color:var(--ink-900);
  font-size:clamp(40px,5.4vw,72px);
}

.heading-2{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(34px,4.2vw,56px);
  line-height:1.08;
  letter-spacing:-.003em;
  color:var(--ink-900);
  margin:0 0 26px;
}
.heading-2--light{color:var(--cream-50)}

.lede{
  font-family:var(--serif);
  font-size:clamp(21px, 2.05vw, 27px);
  line-height:1.5;
  font-weight:400;
  color:var(--cream-50);
  margin:0 0 32px;
  max-width:60ch;
}
.lede--dark{color:var(--text-700)}

.prose p{
  font-family:var(--body);
  font-size:17.5px;
  line-height:1.82;
  color:var(--text-700);
  margin:0 0 22px;
}
.prose p:last-child{margin-bottom:0}

/* ---------- Container & sections ---------- */
.container{
  max-width:var(--max);
  margin:0 auto;
  padding-left:var(--gutter);
  padding-right:var(--gutter);
}
.section{
  padding:var(--section-y) 0;
  position:relative;
}
.section--cream{background:var(--cream-50)}
.section--cream-deep{background:var(--cream-100)}
.section--ink{background:var(--ink-900);color:var(--cream-50)}
.section--ink::before{
  content:"";
  position:absolute;inset:0;
  background:
    radial-gradient(900px 460px at 12% 0%, rgba(214, 185, 136, .10), transparent 62%),
    radial-gradient(960px 520px at 100% 100%, rgba(184, 144, 90, .07), transparent 62%),
    /* subtle warm grain — keeps the dark from looking flat / digital */
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.85   0 0 0 0 0.74   0 0 0 0 0.55   0 0 0 0.06 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  background-size:auto, auto, 240px 240px;
  pointer-events:none;
  opacity:1;
}
.section--ink > *{position:relative;z-index:1}

.section--cream::after,
.section--cream-deep::after{
  content:"";
  position:absolute;inset:0;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.34   0 0 0 0 0.27   0 0 0 0 0.13   0 0 0 0.04 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  background-size:220px 220px;
  pointer-events:none;
  z-index:0;
  opacity:.55;
}
.section--cream > *,
.section--cream-deep > *{position:relative;z-index:1}

.section-head{max-width:780px;margin:0 0 60px}
.section-head--center{margin:0 auto 68px;text-align:center}
.section-head__sub{
  font-family:var(--serif);
  font-size:clamp(19px,1.65vw,23px);
  line-height:1.55;
  color:var(--text-700);
  margin:10px 0 0;
}
.section-head__sub--light{color:var(--cream-100)}
/* Safety net: any sub-head inside a dark section is always light */
.section--ink .section-head__sub{color:var(--cream-100)}

/* ---------- Top utility strip ---------- */
.top-strip{
  background:var(--ink-900);
  color:var(--cream-100);
  font-size:13.5px;
  letter-spacing:.04em;
  font-family:var(--body);
}
.top-strip__inner{
  max-width:var(--max);
  margin:0 auto;
  padding:10px var(--gutter);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  flex-wrap:wrap;
}
.top-strip__sep{
  width:4px;height:4px;border-radius:50%;
  background:var(--gold-500);opacity:.7;
}
.top-strip__call{
  color:var(--gold-300);
  font-weight:500;
  letter-spacing:.08em;
}
.top-strip__call:hover{color:var(--cream-50)}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(250,246,238,.92);
  backdrop-filter:saturate(140%) blur(10px);
  -webkit-backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid transparent;
  transition:border-color .3s ease, box-shadow .3s ease, background .3s ease;
}
.site-header.is-scrolled{
  border-bottom-color:var(--rule);
  box-shadow:0 8px 30px -20px rgba(12,25,41,.18);
  background:rgba(250,246,238,.96);
}
.site-header__inner{
  max-width:var(--max);
  margin:0 auto;
  padding:14px var(--gutter);
  display:flex;align-items:center;gap:32px;
}
.site-header__logo img{height:46px;width:auto}
.site-nav{
  margin-left:auto;
  display:flex;align-items:center;gap:34px;
}
.site-nav a{
  font-family:var(--body);
  font-size:13.5px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--text-700);
  font-weight:600;
  position:relative;
  padding:6px 0;
}
.site-nav a::after{
  content:"";
  position:absolute;left:0;right:0;bottom:0;height:1px;
  background:var(--gold-500);
  transform:scaleX(0);transform-origin:left;
  transition:transform .35s ease;
}
.site-nav a:hover{color:var(--ink-900)}
.site-nav a:hover::after{transform:scaleX(1)}
.site-header__cta{margin-left:8px}

.nav-toggle{
  display:none;
  width:40px;height:40px;
  margin-left:auto;
  position:relative;
}
.nav-toggle span{
  position:absolute;left:8px;right:8px;height:1.5px;
  background:var(--ink-900);
  transition:transform .3s ease, opacity .3s ease;
}
.nav-toggle span:nth-child(1){top:13px}
.nav-toggle span:nth-child(2){top:19px}
.nav-toggle span:nth-child(3){top:25px}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.mobile-nav{
  display:none;
  flex-direction:column;
  gap:18px;
  padding:18px var(--gutter) 24px;
  border-top:1px solid var(--rule);
  background:var(--cream-50);
}
.mobile-nav a{
  font-family:var(--body);
  font-size:14px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-900);font-weight:600;
}
.mobile-nav a.btn{align-self:flex-start;margin-top:6px}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:15px 28px;
  font-family:var(--body);
  font-size:13px;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  border-radius:var(--radius-sm);
  transition:transform .3s ease, background .3s ease, color .3s ease, border-color .3s ease, box-shadow .3s ease;
  border:1px solid transparent;
  white-space:nowrap;
}
.btn--gold{
  background:var(--gold-500);
  color:var(--ink-900);
  border-color:var(--gold-500);
  box-shadow:0 8px 22px -10px rgba(138,108,62,.45);
}
.btn--gold:hover{
  background:var(--gold-300);
  border-color:var(--gold-300);
  box-shadow:0 12px 28px -12px rgba(138,108,62,.55);
}
.btn--outline-light{
  color:var(--cream-50);
  border-color:rgba(243,234,217,.78);
}
.btn--outline-light:hover{background:rgba(243,234,217,.1);border-color:var(--cream-50)}
.btn--ghost{
  color:var(--ink-900);
  border-color:var(--ink-900);
}
.btn--ghost:hover{background:var(--ink-900);color:var(--cream-50)}
.btn--lg{padding:19px 38px;font-size:13.5px}

/* ---------- Hero ---------- */
.hero{
  position:relative;
  min-height:min(820px, 92vh);
  display:flex;align-items:center;
  color:var(--cream-50);
  isolation:isolate;
  overflow:hidden;
}
.hero__media{
  position:absolute;inset:0;
  z-index:-2;
}
.hero__art{
  position:absolute;inset:0;
  /* Warmer, candlelit night — less screen-blue, more candle-ember */
  background:
    radial-gradient(60% 50% at 78% 22%, rgba(212, 184, 138, .28), transparent 60%),
    radial-gradient(70% 60% at 14% 90%, rgba(184, 144, 90, .14), transparent 65%),
    linear-gradient(168deg, #1a1f2c 0%, #232838 30%, #2c2f3d 55%, #1f2230 80%, #181c26 100%);
}
.hero__art::before{
  /* Larger, softer moon — less dramatic, more atmospheric */
  content:"";
  position:absolute;
  top:6%; right:4%;
  width:clamp(260px, 38vw, 540px);
  aspect-ratio:1;
  border-radius:50%;
  background:
    radial-gradient(circle at 36% 32%,
      rgba(255, 238, 208, .9) 0%,
      rgba(252, 232, 198, .55) 22%,
      rgba(228, 196, 144, .22) 45%,
      rgba(184, 152, 104, .08) 65%,
      transparent 80%);
  filter:blur(2px);
  opacity:.85;
}
.hero__art::after{
  /* Quieter star field — fewer, dimmer points */
  content:"";
  position:absolute;inset:0;
  background-image:
    radial-gradient(1.4px 1.4px at 14% 22%, rgba(252, 232, 198, .55), transparent 60%),
    radial-gradient(1.1px 1.1px at 32% 70%, rgba(252, 232, 198, .42), transparent 60%),
    radial-gradient(1.2px 1.2px at 58% 18%, rgba(252, 232, 198, .38), transparent 60%),
    radial-gradient(1px 1px at 78% 80%, rgba(252, 232, 198, .42), transparent 60%);
  opacity:.7;
}
.hero__veil{
  position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(26,32,48,0) 40%, rgba(26,32,48,.55) 100%);
}
.hero__content{
  max-width:var(--max);
  margin:0 auto;
  padding:140px var(--gutter) 130px;
  width:100%;
  position:relative;
}
.hero__content > .kicker{margin-bottom:24px}
.hero__ctas{
  display:flex;flex-wrap:wrap;gap:14px;
  margin-bottom:54px;
}
.hero__meta{
  list-style:none;padding:0;margin:0;
  display:flex;flex-wrap:wrap;gap:16px 40px;
  font-family:var(--body);
  font-size:15px;
  letter-spacing:.02em;
  color:var(--cream-50);
  border-top:1px solid rgba(243,234,217,.22);
  padding-top:26px;
  max-width:760px;
}
.hero__meta strong{
  color:var(--gold-300);
  font-weight:600;
  letter-spacing:.02em;
}

/* ---------- Two-column editorial layout ---------- */
.two-col{
  display:grid;
  grid-template-columns: 1fr 1.6fr;
  gap:clamp(40px, 6vw, 96px);
  align-items:start;
}
.two-col__side{position:sticky;top:100px}
.two-col--visit{align-items:start}
.two-col--visit .two-col__side{position:static}

/* ---------- Sanctuary image-paired layout ---------- */
.sanctuary-grid{
  display:grid;
  grid-template-columns: 0.95fr 1fr;
  gap:clamp(40px, 6vw, 88px);
  align-items:start;
}
.sanctuary-image{
  margin:0;
  position:sticky;
  top:104px;
}
.sanctuary-image img{
  width:100%;
  height:auto;
  display:block;
  border:1px solid rgba(214, 185, 136, .25);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-soft);
  background:var(--cream-200);
}
.sanctuary-image figcaption{
  margin-top:16px;
  font-family:var(--body);
  font-size:13px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#7a5e30;
  font-weight:600;
}
.sanctuary-body .kicker{margin-top:0}

/* ---------- Services feature image ---------- */
.services-feature{
  margin:0 0 72px;
  padding:0;
  position:relative;
  border:1px solid rgba(214, 185, 136, .22);
  border-radius:var(--radius-md);
  overflow:hidden;
  background:var(--ink-800);
  box-shadow:0 30px 60px -30px rgba(0,0,0,.5);
}
.services-feature img{
  width:100%;
  height:clamp(300px, 40vw, 540px);
  object-fit:cover;
  display:block;
}
.services-feature figcaption{
  padding:16px 24px;
  font-family:var(--body);
  font-size:13px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--gold-300);
  text-align:center;
  border-top:1px solid rgba(214, 185, 136, .22);
  font-weight:600;
  background:rgba(0,0,0,.18);
}

/* ---------- Visit image ---------- */
.visit-image{
  margin:38px 0 0;
  padding:0;
}
.visit-image img{
  width:100%;
  height:auto;
  display:block;
  border:1px solid rgba(214, 185, 136, .22);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-soft);
}
.visit-image figcaption{
  margin-top:14px;
  font-family:var(--body);
  font-size:13px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--gold-300);
  font-weight:600;
}

.signature-row{
  margin-top:40px;
  display:flex;align-items:center;gap:20px;
}
.signature-row__rule{
  width:52px;height:1px;background:var(--gold-500);
  flex-shrink:0;
}
.signature-row__label{
  font-family:var(--body);
  font-size:13.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--text-700);
  font-weight:600;
}

/* ---------- Services list ---------- */
.services{
  list-style:none;padding:0;margin:0;
  border-top:1px solid rgba(214,185,136,.24);
}
.service{
  display:grid;
  grid-template-columns: 100px 1fr;
  gap:40px;
  padding:36px 0;
  border-bottom:1px solid rgba(214,185,136,.18);
  transition:background .35s ease;
}
.service:hover{background:rgba(214,185,136,.05)}
.service__num{
  font-family:var(--serif);
  font-size:36px;
  color:var(--gold-300);
  font-weight:500;
  letter-spacing:.04em;
  font-variant-numeric:lining-nums;
}
.service__title{
  font-family:var(--serif);
  font-size:clamp(28px, 2.7vw, 38px);
  font-weight:500;
  color:var(--cream-50);
  margin:0 0 12px;
  letter-spacing:-.003em;
}
.service__body p{
  margin:0;
  font-family:var(--body);
  color:var(--cream-100);
  font-size:17px;
  line-height:1.78;
  max-width:62ch;
}
.services__footnote{
  margin-top:48px;
  text-align:center;
  font-family:var(--body);
  font-size:15px;
  color:var(--cream-100);
  letter-spacing:.02em;
}
.services__footnote a{
  color:var(--gold-300);
  border-bottom:1px solid var(--gold-500);
  padding-bottom:1px;
  font-weight:600;
}
.services__footnote a:hover{color:var(--cream-50);border-color:var(--cream-50)}

/* ---------- Experience steps ---------- */
.experience{
  list-style:none;padding:0;margin:0;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:clamp(28px, 3.2vw, 52px);
}
.experience li{
  border-top:1px solid var(--rule);
  padding-top:32px;
}
.experience__num{
  display:block;
  font-family:var(--serif);
  font-size:24px;
  color:var(--gold-700);
  font-weight:500;
  letter-spacing:.16em;
  margin-bottom:16px;
}
.experience h3{
  font-family:var(--serif);
  font-size:26px;
  font-weight:500;
  margin:0 0 12px;
  color:var(--ink-900);
  letter-spacing:-.003em;
}
.experience p{
  margin:0;
  font-family:var(--body);
  font-size:16.5px;
  line-height:1.72;
  color:var(--text-700);
}

/* ---------- Reviews ---------- */
.reviews{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:clamp(22px, 2.6vw, 38px);
}
.review{
  margin:0;
  background:var(--cream-50);
  padding:44px 38px 34px;
  border:1px solid rgba(214, 185, 136, .35);
  border-radius:var(--radius-md);
  position:relative;
  box-shadow:var(--shadow-card);
}
.review::before{
  content:"\201C";
  position:absolute;
  top:0; left:26px;
  transform:translateY(-55%);
  font-family:var(--serif);
  font-size:96px;
  line-height:1;
  color:var(--gold-500);
  background:var(--cream-100);
  padding:0 12px;
}
.review blockquote{margin:0 0 24px}
.review blockquote p{
  font-family:var(--serif);
  font-size:22px;
  line-height:1.52;
  color:var(--ink-900);
  margin:0;
  font-weight:500;
}
.review figcaption{
  display:flex;flex-direction:column;gap:4px;
  padding-top:18px;
  border-top:1px solid var(--rule);
}
.review__name{
  font-family:var(--body);
  font-size:14px;font-weight:600;
  color:var(--ink-900);
  letter-spacing:.06em;
  text-transform:uppercase;
}
.review__source{
  font-family:var(--body);
  font-size:13px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#7a5e30;
  font-weight:600;
}

/* ---------- Visit ---------- */
.two-col--visit{align-items:stretch;margin-bottom:80px}
.visit-card{
  background:rgba(243,234,217,.05);
  border:1px solid rgba(214, 185, 136, .25);
  border-radius:var(--radius-md);
  padding:clamp(34px, 4vw, 60px);
}
.visit-list{margin:0;padding:0}
.visit-row{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:26px;
  padding:20px 0;
  border-bottom:1px solid rgba(214, 185, 136, .18);
}
.visit-row:last-of-type{border-bottom:0}
.visit-row dt{
  font-family:var(--body);
  font-size:13px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold-300);
  font-weight:600;
  padding-top:4px;
}
.visit-row dd{
  margin:0;
  font-family:var(--serif);
  font-size:20px;
  line-height:1.55;
  color:var(--cream-50);
}
.visit-row dd a{
  border-bottom:1px solid var(--gold-500);
  padding-bottom:1px;
}
.visit-row dd a:hover{color:var(--gold-300);border-color:var(--gold-300)}
.visit-ctas{
  display:flex;flex-wrap:wrap;gap:14px;
  margin-top:36px;
}

.map-wrap{
  max-width:var(--max);
  margin:0 auto;
  padding:0 var(--gutter);
}
.map-wrap iframe{
  width:100%;
  height:clamp(320px, 44vw, 480px);
  border:1px solid rgba(214, 185, 136, .22);
  border-radius:var(--radius-md);
  filter:saturate(.85) brightness(.95);
  background:var(--ink-800);
}

/* ---------- Closer ---------- */
.closer{
  background:
    radial-gradient(900px 460px at 50% 0%, rgba(214, 185, 136, .22), transparent 65%),
    var(--cream-100);
  padding:var(--section-y) 0;
  text-align:center;
}
.closer__inner{max-width:820px}
.closer .display{margin-bottom:20px}
.closer .lede{margin:0 auto 36px;color:var(--text-700)}

/* ---------- Footer ---------- */
.site-footer{
  background:var(--ink-900);
  color:var(--cream-100);
  padding:88px 0 28px;
}
.site-footer__inner{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr;
  gap:clamp(28px, 4vw, 64px);
  padding-bottom:54px;
  border-bottom:1px solid rgba(243, 234, 217, .14);
}
.site-footer__brand img{
  height:54px;width:auto;
  margin-bottom:20px;
  filter:brightness(1.4);
}
.site-footer__brand p{
  font-family:var(--serif);
  font-size:19px;
  line-height:1.55;
  color:var(--cream-100);
  margin:0;
  max-width:34ch;
}
.site-footer__col h4{
  font-family:var(--body);
  font-size:13px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold-300);
  margin:0 0 16px;
  font-weight:600;
}
.site-footer__col p{
  margin:0;
  font-family:var(--body);
  font-size:15.5px;
  line-height:1.7;
  color:var(--cream-50);
}
.site-footer__col a{
  color:var(--cream-50);
  border-bottom:1px solid rgba(214, 185, 136, .55);
  padding-bottom:1px;
}
.site-footer__col a:hover{color:var(--gold-300)}
.site-footer__base{
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
  padding-top:26px;
  font-family:var(--body);
  font-size:12.5px;
  letter-spacing:.04em;
  color:var(--cream-200);
}
.site-footer__base p{margin:0}

/* ---------- Reveal animation ---------- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .9s ease, transform .9s ease}
.reveal.is-in{opacity:1;transform:none}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .two-col{grid-template-columns:1fr;gap:36px}
  .two-col__side{position:static}
  .sanctuary-grid{grid-template-columns:1fr;gap:36px}
  .sanctuary-image{position:static}
  .experience{grid-template-columns:repeat(2,1fr)}
  .reviews{grid-template-columns:1fr;gap:22px}
  .site-footer__inner{grid-template-columns:1fr 1fr;gap:40px}
  .site-nav, .site-header__cta{display:none}
  .nav-toggle{display:block}
  .mobile-nav.is-open{display:flex}
  .top-strip{font-size:12.5px}
  .top-strip__inner{gap:12px}
  .hero__content{padding:96px var(--gutter) 88px}
}
@media (max-width:560px){
  body{font-size:17px}
  .experience{grid-template-columns:1fr}
  .service{grid-template-columns:64px 1fr;gap:20px;padding:28px 0}
  .service__num{font-size:28px}
  .visit-row{grid-template-columns:1fr;gap:6px}
  .visit-row dt{padding-top:0}
  .site-footer__inner{grid-template-columns:1fr}
  .site-footer__base{flex-direction:column;align-items:flex-start;gap:6px}
  .hero__meta{flex-direction:column;gap:10px}
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:0!important;
    transition-duration:0!important;
  }
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none}
}