/* =============================================================
   THE 615 — Sanctum Editorial
   Inspired by understated luxury hospitality design.
   ============================================================= */

:root {
  /* Cream foundation */
  --ivory:        #F5F1EA;
  --ivory-2:      #EDE6DA;
  --paper:        #FAF6EE;
  --sand:         #D9CFBF;
  --sand-2:       #BFB29B;

  /* Navy — primary dark, drawn from logo */
  --navy:         #1F3A6B;
  --navy-2:       #2B4A7E;
  --navy-deep:    #122444;
  --ink:          #0B1730;

  /* Heritage red — accent, drawn from logo */
  --red:          #B8222A;
  --red-soft:     #C84149;
  --red-deep:     #8B181E;

  /* Aliases for legacy class hooks */
  --espresso:     var(--navy);
  --espresso-2:   var(--navy-2);
  --gold:         var(--red);
  --gold-soft:    var(--red-soft);

  --pearl:        #FFFFFF;

  --type-display: 'Oswald', 'Bebas Neue', 'Trade Gothic', Arial Narrow, sans-serif;
  --type-italic:  'Lora', Georgia, 'Times New Roman', serif;
  --type-body:    'Karla', 'Inter', system-ui, sans-serif;
  --type-mono:    'JetBrains Mono', ui-monospace, monospace;

  --max:    1480px;
  --gutter: clamp(1.25rem, 4vw, 3.5rem);

  --t-fast: 220ms cubic-bezier(.2,.8,.2,1);
  --t-med:  520ms cubic-bezier(.2,.8,.2,1);
  --t-slow: 1100ms cubic-bezier(.2,.8,.2,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body {
  margin: 0;
  font-family: var(--type-body);
  font-weight: 300;
  font-size: 16px;
  line-height: 1.65;
  color: var(--navy-deep);
  background: var(--ivory);
  letter-spacing: 0.005em;
  overflow-x: hidden;
}

/* Heavy paper-grain overlay across the whole site — weathered, vintage */
body::before {
  content: '';
  position: fixed; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='420' height='420' viewBox='0 0 420 420'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.62' numOctaves='4' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.45  0 0 0 0 0.30  0 0 0 0 0.20  0 0 0 0.7 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  opacity: 0.14;
  mix-blend-mode: multiply;
  pointer-events: none;
  z-index: 1;
}

/* Body gets a faint warm-paper tint that reads as aged stock */
body {
  background-image:
    radial-gradient(ellipse at 20% 10%, rgba(184,34,42,0.04) 0%, transparent 45%),
    radial-gradient(ellipse at 85% 90%, rgba(31,58,107,0.05) 0%, transparent 50%);
  background-color: var(--ivory);
}

/* SVG filter for weathered/distressed image edges (deckle/torn paper feel) */
svg.defs-only { position: absolute; width: 0; height: 0; }

/* Weathered photo treatment — applied to all editorial figure imgs */
.weathered, .hero .media,
.feat-card .image-wrap,
.diptych figure,
.bio .portrait,
.visit .image-wrap {
  position: relative;
}

/* Heavy grain overlay riding on top of every photographic image */
.feat-card .image-wrap::before,
.diptych figure::before,
.bio .portrait::before,
.visit .image-wrap::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='500' height='500'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.55' numOctaves='4' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.04  0 0 0 0 0.07  0 0 0 0 0.16  0 0 0 0.85 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode: multiply;
  opacity: 0.28;
  pointer-events: none;
  z-index: 2;
}
/* White scratch/highlight pass — second weathering layer */
.feat-card .image-wrap::after,
.diptych figure::after,
.bio .portrait::after,
.visit .image-wrap::after {
  content: '';
  position: absolute; inset: 0;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='600' height='600'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.55 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode: screen;
  opacity: 0.13;
  pointer-events: none;
  z-index: 2;
}

/* Vintage tonal grading — slight desaturation + warm-cool push to feel printed/aged */
.feat-card .image-wrap img,
.diptych figure img,
.bio .portrait img,
.visit .image-wrap img,
.hero .media img,
.hero .media video {
  filter: saturate(0.86) contrast(1.04) sepia(0.06);
}

/* Torn-paper / deckle edge using SVG-mask + irregular clip-path */
:root {
  --deckle: polygon(
    1% 2%, 4% 0%, 8% 1.5%, 13% 0.5%, 19% 2%, 26% 0.7%, 33% 2.2%, 40% 0.4%,
    47% 1.8%, 54% 0.9%, 61% 2%, 68% 0.6%, 75% 1.7%, 82% 0.4%, 89% 2.1%, 95% 0.8%, 99% 2%,
    99.5% 7%, 99% 14%, 99.6% 22%, 99% 31%, 99.4% 40%, 99% 50%, 99.6% 60%, 99% 70%, 99.4% 80%, 99% 90%, 99.5% 97%,
    96% 99%, 90% 98.5%, 83% 99.5%, 76% 98.4%, 69% 99.4%, 62% 98.2%, 55% 99.5%, 48% 98.3%,
    41% 99.4%, 34% 98%, 27% 99.5%, 20% 98.2%, 13% 99.5%, 6% 98%, 1.5% 99.4%,
    0.5% 92%, 1% 84%, 0.6% 75%, 1% 65%, 0.5% 55%, 1% 45%, 0.4% 36%, 0.9% 26%, 0.4% 16%, 0.9% 8%, 1% 2%
  );
  --deckle-rough: polygon(
    2% 4%, 7% 0%, 14% 3%, 22% 0.5%, 30% 4%, 38% 0%, 46% 3.5%, 54% 0%,
    62% 4%, 70% 0.5%, 78% 3%, 86% 0%, 93% 3.5%, 98% 1%,
    99.5% 8%, 98% 16%, 100% 24%, 98% 32%, 99.5% 42%, 98% 52%, 99.7% 62%, 98% 72%, 99.5% 82%, 98% 92%,
    96% 98%, 88% 100%, 80% 97%, 72% 99.5%, 64% 96%, 56% 100%, 48% 96.5%, 40% 100%,
    32% 96%, 24% 99.5%, 16% 96.5%, 8% 100%, 2% 97%,
    0.5% 90%, 2% 80%, 0.3% 70%, 2% 60%, 0.5% 50%, 2% 40%, 0.3% 30%, 2% 20%, 0.5% 10%, 2% 4%
  );
}
.diptych figure img,
.bio .portrait img,
.visit .image-wrap img,
.feat-card .image-wrap img {
  clip-path: var(--deckle);
}
.bio .portrait img {
  clip-path: var(--deckle-rough);
}

/* Featured cards — rougher inner border and torn-paper edges */
.feat-card .image-wrap {
  background: var(--ivory);
  box-shadow: 0 1px 0 rgba(11,23,48,0.08), 0 12px 30px -18px rgba(11,23,48,0.5);
  overflow: visible;
}

/* Hero — actively massaging, brightened to lift the warm amber */
.hero .media {
  position: absolute;
}
.hero .media img,
.hero .media video {
  /* Dramatically lift the warm/dark original toward a sun-bathed look */
  filter: brightness(1.18) saturate(0.88) contrast(0.94);
  image-rendering: -webkit-optimize-contrast;
}
/* Hero red watermark logo at lower right */
.hero::after {
  content: '';
  position: absolute; right: -10%; bottom: -14%;
  width: 56vmin; height: 56vmin;
  max-width: 640px; max-height: 640px;
  background: url('assets/img/logo2.png') center/contain no-repeat;
  opacity: 0.20;
  pointer-events: none;
  z-index: 1;
  filter: drop-shadow(0 0 30px rgba(0,0,0,0.3));
}

/* Torn paper bottom edge on hero — looks ripped from a poster */
.hero {
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 800' preserveAspectRatio='none'><path d='M0,0 L1200,0 L1200,780 C1170,776 1145,790 1115,784 C1085,778 1060,792 1030,786 C1000,780 975,792 945,786 C915,780 890,792 860,786 C830,780 805,792 775,786 C745,780 720,792 690,786 C660,780 635,792 605,786 C575,780 550,792 520,786 C490,780 465,792 435,786 C405,780 380,792 350,786 C320,780 295,792 265,786 C235,780 210,792 180,786 C150,780 125,792 95,786 C65,780 40,792 15,786 C8,785 4,784 0,783 Z' fill='%23000'/></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 800' preserveAspectRatio='none'><path d='M0,0 L1200,0 L1200,780 C1170,776 1145,790 1115,784 C1085,778 1060,792 1030,786 C1000,780 975,792 945,786 C915,780 890,792 860,786 C830,780 805,792 775,786 C745,780 720,792 690,786 C660,780 635,792 605,786 C575,780 550,792 520,786 C490,780 465,792 435,786 C405,780 380,792 350,786 C320,780 295,792 265,786 C235,780 210,792 180,786 C150,780 125,792 95,786 C65,780 40,792 15,786 C8,785 4,784 0,783 Z' fill='%23000'/></svg>");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

/* Stamp marks: the small logo next to each session */
.session .num .stamp img {
  filter: drop-shadow(0 1px 0 rgba(11,23,48,0.15));
}

/* Drop-cap red navy serif for first paragraph in editorial body */
.editorial .body > p:first-of-type::first-letter {
  font-family: var(--type-italic);
  font-style: italic;
  font-weight: 500;
  color: var(--red);
  font-size: 3.4rem;
  float: left;
  line-height: 0.85;
  margin: 0.15rem 0.6rem 0 -0.2rem;
}

/* Section heads weathered: subtle paint scratch behind H2 */
.menu-section h2,
.editorial h2 {
  position: relative;
}

/* Splatter dots near eyebrows */
.editorial .label::after {
  content: '';
  display: inline-block;
  margin-left: 0.6em;
  width: 28px; height: 8px;
  background-image: radial-gradient(circle 2px at 4px 4px, var(--red) 100%, transparent 100%),
                    radial-gradient(circle 1px at 12px 3px, var(--red) 100%, transparent 100%),
                    radial-gradient(circle 1.5px at 22px 5px, var(--navy) 100%, transparent 100%);
  vertical-align: middle;
}

/* ---------- Service Cards ---------- */
.svc-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin-top: 3.5rem;
}
@media (min-width: 720px) {
  .svc-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1000px) {
  .svc-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
}

.svc-card {
  position: relative;
  background: var(--paper);
  border: 1px solid rgba(11,23,48,0.12);
  padding: 2.2rem 1.8rem 1.8rem;
  display: flex; flex-direction: column;
  gap: 1.1rem;
  transition: transform 320ms cubic-bezier(.2,.8,.2,1), box-shadow 320ms cubic-bezier(.2,.8,.2,1), border-color 320ms;
  overflow: hidden;
}
.svc-card::before {
  content: '';
  position: absolute;
  top: -22px; right: -22px;
  width: 110px; height: 110px;
  background: url('assets/img/logo2.png') center/contain no-repeat;
  opacity: 0.07;
  pointer-events: none;
  transform: rotate(8deg);
  transition: transform 600ms cubic-bezier(.2,.8,.2,1), opacity 320ms;
}
.svc-card::after {
  content: '';
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='400' height='400'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.45  0 0 0 0 0.30  0 0 0 0 0.20  0 0 0 0.5 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode: multiply;
  opacity: 0.06;
  pointer-events: none;
}
.svc-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 40px -22px rgba(11,23,48,0.45);
  border-color: var(--red);
}
.svc-card:hover::before {
  opacity: 0.13;
  transform: rotate(-4deg) scale(1.1);
}
/* Alternating accent — every odd card has a blue tint instead of red on hover */
.svc-card:nth-child(2n):hover { border-color: var(--navy); }

.svc-card .card-stamp {
  width: 64px; height: 64px;
  display: block;
  position: relative; z-index: 2;
  filter: drop-shadow(0 2px 4px rgba(11,23,48,0.18));
}
.svc-card .card-stamp img { width: 100%; height: 100%; object-fit: contain; display: block; }

.svc-card .meta {
  display: flex; align-items: center; gap: 0.7rem;
  font-family: var(--type-display);
  font-weight: 500;
  font-size: 0.84rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--red);
  position: relative; z-index: 2;
}
.svc-card .meta .dot { color: var(--navy); opacity: 0.5; }
.svc-card .meta .price {
  font-family: var(--type-display);
  font-weight: 700;
  font-size: 1.4rem;
  letter-spacing: 0.02em;
  color: var(--navy-deep);
  margin-left: auto;
}
/* Even cards swap meta accents */
.svc-card:nth-child(2n) .meta { color: var(--navy); }
.svc-card:nth-child(2n) .meta .dot { color: var(--red); }

.svc-card h3 {
  font-size: clamp(1.3rem, 2.1vw, 1.8rem);
  letter-spacing: 0.012em;
  margin: 0;
  color: var(--navy-deep);
  position: relative; z-index: 2;
}

.svc-card p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.65;
  color: var(--navy-2);
  flex-grow: 1;
  font-weight: 300;
  position: relative; z-index: 2;
}

.svc-card .book-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.85rem 1.5rem;
  background: var(--navy-deep);
  color: var(--ivory);
  font-family: var(--type-display);
  font-weight: 600;
  font-size: 0.78rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  border: 2px solid var(--navy-deep);
  align-self: flex-start;
  transition: background 220ms, border-color 220ms, gap 220ms;
  margin-top: 0.4rem;
  position: relative; z-index: 2;
  text-decoration: none;
}
.svc-card .book-btn:hover { background: var(--red); border-color: var(--red); gap: 1rem; }
.svc-card:nth-child(2n) .book-btn { background: var(--red); border-color: var(--red); }
.svc-card:nth-child(2n) .book-btn:hover { background: var(--navy-deep); border-color: var(--navy-deep); }

img { max-width: 100%; display: block; }
a  { color: inherit; text-decoration: none; }

::selection { background: var(--red); color: var(--ivory); }

/* ---------- Type ---------- */

.eyebrow {
  font-family: var(--type-display);
  font-weight: 500;
  font-size: 0.78rem;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: var(--red);
  display: inline-flex;
  align-items: center;
  gap: 0.7em;
}
.eyebrow::before {
  content: '';
  width: 28px; height: 1px;
  background: currentColor;
  opacity: 0.65;
}
.eyebrow.center { justify-content: center; }
.eyebrow.center::after {
  content: '';
  width: 28px; height: 1px;
  background: currentColor;
  opacity: 0.65;
}

h1, h2, h3, h4 {
  font-family: var(--type-display);
  font-weight: 600;
  font-style: normal;
  letter-spacing: -0.005em;
  line-height: 1.0;
  color: var(--navy-deep);
  margin: 0;
  text-transform: uppercase;
}
h1 { font-size: clamp(2.8rem, 7.5vw, 6.6rem); letter-spacing: 0.005em; }
h2 { font-size: clamp(2.2rem, 5vw, 4.4rem); letter-spacing: 0.005em; }
h3 { font-size: clamp(1.4rem, 2.2vw, 2rem); letter-spacing: 0.012em; }
h4 { letter-spacing: 0.05em; }

/* Italic accents are a serif Lora — for poetic moments inside heavy display heads */
.italic, h1 .ital, h2 .ital, h3 .ital, .swash {
  font-family: var(--type-italic);
  font-style: italic;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  color: var(--red);
}
/* Blue accent variant for type alternation */
.ital.ital-blue, h1 .ital.ital-blue, h2 .ital.ital-blue, h3 .ital.ital-blue {
  color: var(--navy);
}
.hero h1 .swash {
  font-family: var(--type-italic);
  font-style: italic;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  color: var(--red-soft);
  text-shadow: 0 2px 10px rgba(11,23,48,0.5), 0 1px 2px rgba(11,23,48,0.4);
}
.hero h1 .swash.swash-blue {
  /* Light powder-blue tint that pops on the bright hero photo */
  color: #BFD8E8;
  text-shadow: 0 2px 10px rgba(11,23,48,0.55), 0 1px 2px rgba(11,23,48,0.45);
}

p { margin: 0 0 1em 0; }
.lead {
  font-size: clamp(1.05rem, 1.3vw, 1.2rem);
  line-height: 1.75;
  font-weight: 300;
  max-width: 56ch;
  color: var(--espresso-2);
}
.dim { color: var(--espresso-2); opacity: 0.78; }

/* ---------- Layout ---------- */
.wrap { width: 100%; max-width: var(--max); margin: 0 auto; padding-inline: var(--gutter); }
.section { padding-block: clamp(5rem, 10vw, 9rem); position: relative; }
.section.tight { padding-block: clamp(3rem, 6vw, 5rem); }
.rule { height: 1px; background: var(--sand-2); opacity: 0.55; margin-block: clamp(3rem, 5vw, 5rem); }
.rule.gold { background: var(--red); opacity: 0.55; }

/* Torn-paper edge above sections with alternate background — looks ripped */
.section.torn-top::before {
  content: '';
  position: absolute; left: 0; right: 0; top: -1px; height: 28px;
  background: inherit;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1200' height='28' preserveAspectRatio='none'><path d='M0,0 L0,18 C20,12 35,22 60,16 C85,10 105,24 135,17 C165,10 185,22 215,15 C245,8 270,24 300,16 C330,8 355,22 385,15 C415,8 440,24 470,17 C500,10 525,22 555,15 C585,8 610,24 640,17 C670,10 695,22 725,15 C755,8 780,24 810,17 C840,10 865,22 895,15 C925,8 950,24 980,17 C1010,10 1035,22 1065,15 C1095,8 1120,24 1150,17 C1175,12 1195,18 1200,16 L1200,0 Z' fill='%23000'/></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1200' height='28' preserveAspectRatio='none'><path d='M0,0 L0,18 C20,12 35,22 60,16 C85,10 105,24 135,17 C165,10 185,22 215,15 C245,8 270,24 300,16 C330,8 355,22 385,15 C415,8 440,24 470,17 C500,10 525,22 555,15 C585,8 610,24 640,17 C670,10 695,22 725,15 C755,8 780,24 810,17 C840,10 865,22 895,15 C925,8 950,24 980,17 C1010,10 1035,22 1065,15 C1095,8 1120,24 1150,17 C1175,12 1195,18 1200,16 L1200,0 Z' fill='%23000'/></svg>");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  z-index: 2;
}
.section.torn-bot::after {
  content: '';
  position: absolute; left: 0; right: 0; bottom: -1px; height: 28px;
  background: inherit;
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1200' height='28' preserveAspectRatio='none'><path d='M0,28 L0,10 C25,16 45,6 75,12 C105,18 130,4 160,10 C190,16 215,4 245,12 C275,20 300,4 330,11 C360,18 385,4 415,12 C445,20 470,6 500,12 C530,18 555,4 585,12 C615,20 640,6 670,12 C700,18 725,4 755,12 C785,20 810,6 840,12 C870,18 895,4 925,12 C955,20 980,6 1010,12 C1040,18 1065,4 1095,12 C1125,20 1150,6 1180,14 C1192,18 1198,16 1200,15 L1200,28 Z' fill='%23000'/></svg>");
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1200' height='28' preserveAspectRatio='none'><path d='M0,28 L0,10 C25,16 45,6 75,12 C105,18 130,4 160,10 C190,16 215,4 245,12 C275,20 300,4 330,11 C360,18 385,4 415,12 C445,20 470,6 500,12 C530,18 555,4 585,12 C615,20 640,6 670,12 C700,18 725,4 755,12 C785,20 810,6 840,12 C870,18 895,4 925,12 C955,20 980,6 1010,12 C1040,18 1065,4 1095,12 C1125,20 1150,6 1180,14 C1192,18 1198,16 1200,15 L1200,28 Z' fill='%23000'/></svg>");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  z-index: 2;
}

/* Paint-splatter accent that can be dropped near key elements */
.splatter {
  position: absolute;
  pointer-events: none;
  opacity: 0.45;
  mix-blend-mode: multiply;
  z-index: 0;
}

/* ---------- Header / Nav ---------- */
.nav {
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 50;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 1.4rem var(--gutter);
  transition: background var(--t-med), padding var(--t-med), border-color var(--t-med);
  border-bottom: 1px solid transparent;
}
.nav.solid {
  background: rgba(245,241,234,0.92);
  backdrop-filter: blur(14px) saturate(110%);
  -webkit-backdrop-filter: blur(14px) saturate(110%);
  padding-block: 0.95rem;
  border-bottom-color: rgba(159, 142, 110, 0.18);
}
.nav .links {
  display: flex; gap: 2rem; list-style: none; padding: 0; margin: 0;
  font-size: 0.74rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-weight: 400;
}
.nav .links li a {
  position: relative;
  padding: 0.4rem 0;
  transition: color var(--t-fast);
}
.nav .links li a::after {
  content: '';
  position: absolute; left: 0; bottom: -2px;
  width: 0; height: 1px; background: var(--gold);
  transition: width var(--t-med);
}
.nav .links li a:hover { color: var(--gold); }
.nav .links li a:hover::after { width: 100%; }

.brand {
  display: flex; align-items: center; gap: 0.85rem;
  color: var(--espresso);
  text-decoration: none;
}
.brand .seal {
  width: 64px; height: 64px;
  border-radius: 50%;
  display: grid; place-items: center;
  flex-shrink: 0;
  background: transparent;
  overflow: visible;
}
.brand .seal img,
.brand .seal svg {
  width: 100%; height: 100%; display: block; object-fit: contain;
  filter: drop-shadow(0 2px 4px rgba(11,23,48,0.3));
}
/* Footer brand gets even more presence */
.foot .brand-block .brand .seal { width: 72px; height: 72px; }
.brand-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1;
}
/* SVG-based wordmark: textLength forces both lines to exactly the same horizontal length */
.brand-svg {
  width: 138px;
  height: 40px;
  display: block;
  flex-shrink: 0;
}
.brand-svg .brand-pre,
.brand-svg .brand-post {
  font-family: var(--type-display);
  font-weight: 700;
  font-size: 26px;
  letter-spacing: 0.5px;
}
.brand-svg .brand-pre { fill: var(--red); }
.brand-svg .brand-post { fill: currentColor; }
.foot .brand-svg { width: 160px; height: 46px; }
.foot .brand-svg .brand-post { fill: var(--ivory); }
.nav.on-dark .brand-svg .brand-post { fill: var(--ivory); }
.nav.solid .brand-svg .brand-post { fill: var(--navy-deep); }
.nav.on-dark .brand-text .brand-pre { color: var(--gold-soft); text-shadow: 0 1px 2px rgba(15,11,7,0.45); }
.nav.on-dark .brand-text { color: var(--ivory); text-shadow: 0 1px 3px rgba(15,11,7,0.35); }
.nav.solid .brand-text { color: var(--espresso); text-shadow: none; }
.nav.solid .brand-text .brand-pre { text-shadow: none; }

.nav .right { display: flex; justify-content: flex-end; }

/* Hero/landing nav uses light type */
.nav.on-dark { color: var(--ivory); }
.nav.on-dark.solid { color: var(--espresso); }

.menu-toggle {
  display: none;
  background: none; border: none; cursor: pointer;
  width: 32px; height: 24px;
  position: relative;
  color: inherit;
}
.menu-toggle span {
  position: absolute; left: 0; right: 0; height: 1px; background: currentColor;
  transition: transform var(--t-fast), opacity var(--t-fast);
}
.menu-toggle span:nth-child(1) { top: 4px; }
.menu-toggle span:nth-child(2) { top: 11px; }
.menu-toggle span:nth-child(3) { top: 18px; }
.menu-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle.open span:nth-child(2) { opacity: 0; }
.menu-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 0.9rem;
  padding: 1.05rem 2rem;
  font-family: var(--type-display);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  border: 2px solid var(--navy);
  background: var(--navy);
  color: var(--ivory);
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast), transform var(--t-fast);
}
/* Weathered paint-splatter overlay on every button */
.btn::before {
  content: '';
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='60'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.4' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.6 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  opacity: 0.16;
  mix-blend-mode: screen;
  pointer-events: none;
}
.btn:hover { background: var(--red); border-color: var(--red); color: var(--ivory); }

.btn.ghost { background: transparent; color: var(--navy); }
.btn.ghost:hover { background: var(--navy); color: var(--ivory); border-color: var(--navy); }

.btn.on-dark { border-color: var(--ivory); background: transparent; color: var(--ivory); }
.btn.on-dark:hover { background: var(--red); color: var(--ivory); border-color: var(--red); }

.btn .arr { transition: transform var(--t-fast); display: inline-block; }
.btn:hover .arr { transform: translateX(4px); }

.link-arrow {
  display: inline-flex; align-items: center; gap: 0.7rem;
  font-size: 0.78rem; font-weight: 500;
  letter-spacing: 0.26em; text-transform: uppercase;
  border-bottom: 1px solid currentColor;
  padding-bottom: 0.35rem;
  color: var(--navy);
  transition: color var(--t-fast), gap var(--t-fast);
}
.link-arrow:hover { color: var(--red); gap: 1.1rem; }

/* ---------- Hero ---------- */
.hero {
  position: relative;
  min-height: 100vh;
  display: grid;
  align-items: end;
  color: var(--ivory);
  overflow: hidden;
  isolation: isolate;
  z-index: 2;     /* above the global body grain so the hero stays crisp */
}
.hero .media {
  position: absolute; inset: 0;
  z-index: -2;
}
.hero .media img,
.hero .media video {
  width: 100%; height: 100%; object-fit: cover;
  transform: scale(1.06);
  animation: heroZoom 18s ease-out forwards;
}
@keyframes heroZoom {
  to { transform: scale(1); }
}
.hero .media::after {
  content: '';
  position: absolute; inset: 0;
  /* Lighter overlay than before — image is already darker at edges from warm amber lighting,
     so we just add a soft bottom scrim for text legibility */
  background:
    linear-gradient(180deg, rgba(11,23,48,0.10) 0%, rgba(11,23,48,0) 25%, rgba(11,23,48,0) 55%, rgba(11,23,48,0.45) 88%, rgba(11,23,48,0.7) 100%);
  z-index: -1;
}

.hero-inner {
  padding-block: clamp(7rem, 14vw, 11rem) clamp(4rem, 7vw, 6rem);
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
.hero h1 {
  color: var(--ivory);
  max-width: 14ch;
  text-shadow: 0 2px 10px rgba(11,23,48,0.55), 0 1px 2px rgba(11,23,48,0.65);
}
.hero h1 .swash { font-style: italic; color: var(--ivory); display: inline-block; }
.hero .sub {
  max-width: 48ch;
  font-size: clamp(1rem, 1.2vw, 1.15rem);
  line-height: 1.75;
  color: rgba(245,241,234,0.95);
  text-shadow: 0 1px 6px rgba(11,23,48,0.55);
}
.hero .meta {
  display: flex; align-items: center; gap: 1.4rem;
  flex-wrap: wrap;
  margin-top: 0.5rem;
}
.hero .meta .dot { width: 4px; height: 4px; border-radius: 50%; background: var(--gold); display: inline-block; }
.hero .meta .item {
  font-family: var(--type-body);
  font-size: 0.74rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(245,241,234,0.75);
}

.hero .scroll-cue {
  position: absolute; left: var(--gutter); bottom: 2rem;
  font-size: 0.7rem; letter-spacing: 0.3em; text-transform: uppercase;
  color: rgba(245,241,234,0.65);
  display: flex; align-items: center; gap: 0.7rem;
  writing-mode: vertical-rl; transform: rotate(180deg);
}
.hero .scroll-cue::before {
  content: ''; width: 1px; height: 60px; background: rgba(245,241,234,0.4);
  animation: drop 2.6s ease-in-out infinite;
}
@keyframes drop {
  0%,100% { transform: scaleY(1); transform-origin: top; }
  50% { transform: scaleY(0.35); }
}

.hero .corner {
  position: absolute; top: 50%; right: var(--gutter);
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: right center;
  font-family: var(--type-body);
  font-size: 0.72rem;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: rgba(245,241,234,0.6);
}

/* ---------- Marquee strip — banner, weathered ---------- */
.marquee {
  background: var(--red);
  color: var(--ivory);
  overflow: hidden;
  border-top: 3px solid var(--navy-deep);
  border-bottom: 3px solid var(--navy-deep);
  position: relative;
}
/* Heavy paint texture on red banner — vintage weather-worn signage */
.marquee::before, .marquee::after {
  content: '';
  position: absolute; inset: 0;
  pointer-events: none;
  z-index: 1;
}
.marquee::before {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='400' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.55' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.05  0 0 0 0 0.07  0 0 0 0 0.18  0 0 0 0.85 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode: multiply;
  opacity: 0.35;
}
.marquee::after {
  /* white "scratched paint" highlights */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='600' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.6' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.6 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode: screen;
  opacity: 0.18;
}
.marquee-track {
  display: flex;
  gap: 4.5rem;
  padding: 1.4rem 0;
  width: max-content;
  animation: marquee 48s linear infinite;
  position: relative;
  z-index: 2;
}
.marquee-track:hover { animation-play-state: paused; }
@keyframes marquee {
  to { transform: translateX(-50%); }
}
.marquee-track span {
  font-family: var(--type-display);
  font-style: normal;
  font-weight: 600;
  font-size: clamp(1.1rem, 2.1vw, 1.7rem);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
  display: inline-flex; align-items: center; gap: 4.5rem;
  color: var(--ivory);
}
.marquee-track .star { color: var(--ivory); font-style: normal; opacity: 0.85; }

/* ---------- Philosophy / Editorial ---------- */
.editorial {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: start;
}
@media (min-width: 900px) {
  .editorial { grid-template-columns: 1fr 1.2fr; gap: 6rem; }
}
.editorial .label {
  font-family: var(--type-display);
  font-weight: 500;
  font-size: 0.78rem;
  letter-spacing: 0.36em;
  text-transform: uppercase;
  color: var(--red);
  position: relative;
  padding-top: 1.6rem;
}
.editorial .label::before {
  content: '';
  position: absolute; top: 0; left: 0;
  width: 56px; height: 1px;
  background: currentColor;
}
.editorial h2 .ital { font-style: italic; color: var(--gold); }
.editorial .body {
  font-size: clamp(1.05rem, 1.25vw, 1.15rem);
  line-height: 1.8;
  max-width: 60ch;
  color: var(--espresso-2);
  font-weight: 300;
}
.editorial .body p + p { margin-top: 1em; }

.editorial .signature {
  margin-top: 2.5rem;
  font-family: var(--type-italic);
  font-style: italic;
  font-weight: 500;
  font-size: 1.55rem;
  color: var(--red);
}
.editorial .signature .name { display: block; font-style: normal; font-family: var(--type-display); font-weight: 500; font-size: 0.78rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--navy-2); margin-top: 0.5rem; }

/* ---------- Featured card pair ---------- */
.featured {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(2rem, 4vw, 3.5rem);
}
@media (min-width: 900px) { .featured { grid-template-columns: 1.1fr 1fr; align-items: stretch; } }
.feat-card {
  position: relative;
  display: flex; flex-direction: column;
}
.feat-card .image-wrap {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
}
.feat-card.alt .image-wrap { aspect-ratio: 5 / 6; }
.feat-card .image-wrap img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.4s cubic-bezier(.2,.8,.2,1);
}
.feat-card:hover .image-wrap img { transform: scale(1.04); }
.feat-card .image-wrap::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(15,11,7,0.65));
  pointer-events: none;
}
.feat-card .text {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  color: var(--ivory);
  display: grid; gap: 0.9rem;
}
.feat-card h3 { color: var(--ivory); font-size: clamp(1.6rem, 2.6vw, 2.4rem); }
.feat-card p {
  color: rgba(245,241,234,0.82);
  font-size: 0.95rem;
  max-width: 44ch;
  margin: 0;
}
.feat-card .index {
  font-family: var(--type-display); font-style: italic;
  color: var(--ivory);
  font-size: 1.25rem;
  position: absolute;
  top: 1.5rem; left: 1.5rem;
  z-index: 2;
  background: rgba(11,23,48,0.65);
  border: 1px solid rgba(200,65,73,0.7);
  padding: 0.45rem 0.8rem;
  letter-spacing: 0.04em;
}

/* ---------- Sessions menu (editorial table) ---------- */
.menu-section h2 .ital { font-style: italic; color: var(--gold); }
.session-list {
  margin-top: 3rem;
  display: grid;
  gap: 0;
}
.session {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.6rem;
  padding-block: clamp(1.6rem, 2.6vw, 2.4rem);
  border-top: 1px solid rgba(159, 142, 110, 0.25);
  position: relative;
  transition: padding var(--t-med), background var(--t-med);
}
.session:last-child { border-bottom: 1px solid rgba(159, 142, 110, 0.25); }
@media (min-width: 800px) {
  .session { grid-template-columns: 150px 1fr 220px 140px; align-items: center; gap: 2.5rem; }
}
.session:hover { background: rgba(31, 58, 107, 0.06); padding-inline: 1rem; }

.session .num {
  font-family: var(--type-italic);
  font-style: italic;
  font-weight: 500;
  font-size: 1.35rem;
  color: var(--red);
  display: flex;
  align-items: center;
  gap: 0.85rem;
}
.session .num .stamp {
  width: 64px; height: 64px;
  display: inline-block;
  flex-shrink: 0;
}
.session .num .stamp img {
  width: 100%; height: 100%; object-fit: contain; display: block;
  filter: drop-shadow(0 2px 3px rgba(11,23,48,0.25));
  transition: transform 380ms cubic-bezier(.2,.8,.2,1);
}
.session:hover .num .stamp img { transform: rotate(-6deg) scale(1.06); }
.session .title { display: grid; gap: 0.3rem; }
.session .title h3 {
  font-size: clamp(1.4rem, 2vw, 1.85rem);
}
.session .title h3 .ital { font-style: italic; color: var(--red); }
.session .title p {
  margin: 0;
  font-size: 0.92rem;
  color: var(--espresso-2);
  font-weight: 300;
  max-width: 60ch;
  line-height: 1.6;
}
.session .duration {
  font-size: 0.74rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--espresso-2);
}
.session .price {
  font-family: var(--type-display);
  font-weight: 500;
  font-size: 1.7rem;
  text-align: right;
  color: var(--navy-deep);
  letter-spacing: 0.01em;
}
.session .price small { font-family: var(--type-body); font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--red); display: block; margin-top: 0.2rem; }

/* ---------- Image diptych ---------- */
.diptych {
  display: grid;
  gap: clamp(1rem, 2vw, 2rem);
  grid-template-columns: 1fr;
}
@media (min-width: 700px) { .diptych { grid-template-columns: 1fr 1fr; } }
.diptych figure { margin: 0; position: relative; }
.diptych img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.diptych .offset { transform: translateY(0); }
@media (min-width: 700px) { .diptych .offset { transform: translateY(4rem); } }
.diptych figcaption {
  margin-top: 1rem;
  font-size: 0.74rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--espresso-2);
}

/* ---------- Therapist / Bio ---------- */
.bio {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: center;
}
@media (min-width: 900px) { .bio { grid-template-columns: 0.9fr 1.1fr; gap: 6rem; } }
.bio .portrait { position: relative; }
.bio .portrait img { aspect-ratio: 4/5; object-fit: cover; width: 100%; }
.bio .portrait::after {
  content: '';
  position: absolute;
  inset: -1.5rem -1.5rem 1.5rem 1.5rem;
  border: 1px solid var(--red);
  z-index: -1;
}
.bio h2 .ital { font-style: italic; color: var(--gold); }
.bio .credentials {
  list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 0.9rem;
}
.bio .credentials li {
  display: grid; grid-template-columns: 24px 1fr; gap: 1rem;
  font-size: 0.95rem;
  padding-bottom: 0.9rem;
  border-bottom: 1px solid rgba(159, 142, 110, 0.25);
}
.bio .credentials li::before {
  content: '★';
  color: var(--red);
  font-size: 0.85rem;
  align-self: center;
}

/* ---------- Testimonials — navy banner, heavily weathered ---------- */
.testify { background: var(--navy); color: var(--ivory); position: relative; overflow: hidden; }
.testify::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='600' height='600'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.45' numOctaves='4' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.65 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode: screen;
  opacity: 0.16;
  pointer-events: none;
}
/* Big watermark logo behind testimonials */
.testify::after {
  content: '';
  position: absolute; right: -12%; top: 50%; transform: translateY(-50%);
  width: 60vmin; height: 60vmin;
  max-width: 700px; max-height: 700px;
  background: url('assets/img/logo2.png') center/contain no-repeat;
  opacity: 0.07;
  pointer-events: none;
  filter: grayscale(0.2);
}
.testify h2, .testify h3, .testify .lead { color: var(--ivory); }
.testify .eyebrow { color: var(--red-soft); }
.testify .quotes {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(2rem, 4vw, 3.5rem);
  margin-top: 4rem;
}
@media (min-width: 900px) { .testify .quotes { grid-template-columns: repeat(3, 1fr); } }
.quote {
  position: relative;
  padding: 2.5rem 1.5rem 1.5rem;
  border-top: 1px solid rgba(200,65,73,0.55);
}
.quote::before {
  content: '“';
  position: absolute; top: -0.4em; left: 0;
  font-family: var(--type-display);
  font-style: italic;
  font-size: 4.5rem;
  color: var(--red-soft);
  line-height: 1;
}
.quote p {
  font-family: var(--type-display);
  font-style: italic;
  font-size: 1.25rem;
  line-height: 1.55;
  color: rgba(245,241,234,0.94);
}
.quote .who {
  margin-top: 1.5rem;
  font-family: var(--type-body);
  font-size: 0.72rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--red-soft);
}

/* ---------- Visit / Booking ---------- */
.visit {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(2rem, 4vw, 4rem);
}
@media (min-width: 900px) { .visit { grid-template-columns: 1fr 1fr; } }
.visit .image-wrap img { aspect-ratio: 4/5; object-fit: cover; }
.visit h2 .ital { font-style: italic; color: var(--gold); }
.visit dl {
  margin: 2.5rem 0 0;
  display: grid;
  gap: 1.4rem;
}
.visit dt {
  font-family: var(--type-body);
  font-size: 0.7rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 0.3rem;
}
.visit dd {
  margin: 0;
  font-family: var(--type-display);
  font-size: 1.4rem;
  color: var(--espresso);
  line-height: 1.45;
}
.visit dd a:hover { color: var(--gold); }
.visit dd small {
  display: block;
  font-family: var(--type-body);
  font-size: 0.95rem;
  font-weight: 300;
  color: var(--espresso-2);
  margin-top: 0.35rem;
  line-height: 1.5;
}
.visit .cta-row { margin-top: 3rem; display: flex; gap: 1rem; flex-wrap: wrap; }

/* ---------- Footer ---------- */
.foot {
  background: var(--navy-deep);
  color: rgba(245,241,234,0.82);
  padding-block: clamp(4rem, 7vw, 6rem) 2rem;
  position: relative;
  overflow: hidden;
  border-top: 3px solid var(--red);
}
/* Weathered paint texture in footer */
.foot::before {
  content: '';
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='500' height='500'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.5' numOctaves='4' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.65 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode: screen;
  opacity: 0.12;
  pointer-events: none;
}
.foot .wrap { position: relative; z-index: 2; }
.foot .top {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  padding-bottom: 4rem;
  border-bottom: 1px solid rgba(200,65,73,0.28);
}
@media (min-width: 800px) { .foot .top { grid-template-columns: 1.5fr 1fr 1fr 1fr; } }
.foot h4 {
  font-family: var(--type-body);
  font-size: 0.7rem;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: var(--red-soft);
  margin: 0 0 1.4rem;
  font-weight: 500;
}
.foot .brand-block .brand,
.foot .brand-block .brand-text { color: var(--ivory); }
.foot .brand-block .brand-text .brand-pre { color: var(--red-soft); }
.foot .tagline {
  margin-top: 1.5rem;
  font-family: var(--type-display);
  font-style: italic;
  font-size: 1.3rem;
  line-height: 1.4;
  color: rgba(245,241,234,0.86);
  max-width: 28ch;
}
.foot ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.8rem; font-size: 0.92rem; }
.foot ul a:hover { color: var(--red-soft); }
.foot .bot {
  display: flex; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap;
  padding-top: 2rem;
  font-size: 0.78rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(245,241,234,0.6);
}
.foot .bot a:hover { color: var(--red-soft); }

/* ---------- Reveal motion ---------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity var(--t-slow), transform var(--t-slow);
}
[data-reveal].is-in { opacity: 1; transform: none; }
[data-reveal-delay="1"] { transition-delay: 80ms; }
[data-reveal-delay="2"] { transition-delay: 180ms; }
[data-reveal-delay="3"] { transition-delay: 280ms; }
[data-reveal-delay="4"] { transition-delay: 380ms; }
[data-reveal-delay="5"] { transition-delay: 480ms; }

/* ---------- Mobile nav drawer ---------- */
@media (max-width: 860px) {
  .nav .links { display: none; }
  .menu-toggle { display: inline-block; }
  .nav .right { justify-content: flex-end; }
  .drawer {
    position: fixed; inset: 0;
    background: var(--ivory);
    z-index: 49;
    display: grid; place-items: center;
    transform: translateY(-100%);
    transition: transform var(--t-med);
    padding: var(--gutter);
  }
  .drawer.open { transform: translateY(0); }
  .drawer ul {
    list-style: none; padding: 0; margin: 0;
    display: grid; gap: 1.6rem; text-align: center;
  }
  .drawer a {
    font-family: var(--type-display);
    font-size: 2.2rem;
    color: var(--espresso);
  }
  .drawer .ital { font-style: italic; color: var(--gold); }
}
@media (min-width: 861px) {
  .drawer { display: none !important; }
}

/* Ensure hero corner doesn't crash on mobile */
@media (max-width: 720px) {
  .hero .corner { display: none; }
  .hero .scroll-cue { display: none; }
}

/* Signature italtxt */
.editorial .signature .italtxt { font-style: italic; color: var(--gold); }

/* Drawer link colors when shown */
.drawer a {
  color: var(--espresso);
}
.drawer a.ital { font-style: italic; color: var(--gold); }

/* Visit dl tweaks for longer hours block */
.visit dd small { line-height: 1.6; }
.visit dd a { color: inherit; }
.visit dd a:hover { color: var(--gold); }