/* Penny Beale site styles. Shared by every new-style page. */
:root {
  /* Mulberry glow & Blush (chosen 5 Nov 2026) */
  --ink: #6a2145;          /* mulberry: headings, dark sections */
  --text: #3a2a30;
  --muted: #6e5a62;
  --bg: #fdf8f4;           /* warm cream */
  --white: #ffffff;
  --line: #efdcdc;
  --brand: #4d7a68;        /* deep sage: main buttons */
  --brand-hover: #3d6354;
  --brand-text: #4d7a68;
  --brand-soft: #b5ddc9;   /* sage on dark backgrounds */
  --on-brand: #ffffff;
  --accent: #a64a64;       /* berry rose */
  --accent-hover: #8c3c53;
  --accent-text: #a64a64;
  --accent-soft: #ffd0dc;  /* rose on dark backgrounds */
  --on-accent: #ffffff;
  --shade: 106,33,69;      /* photo overlays (r,g,b) */
  --wash: radial-gradient(circle at 12% 15%, rgba(252,214,196,.95), transparent 55%),
          radial-gradient(circle at 88% 88%, rgba(244,186,202,.95), transparent 55%), #fdf4f2;
  --glow: radial-gradient(circle at 10% 12%, rgba(124,170,145,.85), transparent 58%),
          radial-gradient(circle at 90% 88%, rgba(228,98,138,.8), transparent 60%),
          radial-gradient(circle at 50% 50%, rgba(196,72,112,.45), transparent 70%), #6a2145;
  --glow-right: radial-gradient(circle at 62% 10%, rgba(124,170,145,.8), transparent 45%),
          radial-gradient(circle at 96% 92%, rgba(228,98,138,.8), transparent 50%),
          radial-gradient(circle at 80% 50%, rgba(196,72,112,.4), transparent 60%), #6a2145;
  --head: "Cormorant Garamond", Georgia, serif;
  --body: "Jost", system-ui, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font-family: var(--body); font-weight: 300; font-size: 18px; line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { color: inherit; }
.wrap { width: min(1160px, 100% - 40px); margin-inline: auto; }
.narrow { width: min(720px, 100% - 40px); margin-inline: auto; }
.center { text-align: center; }

h1, h2, h3 {
  font-family: var(--head); font-weight: 300; text-transform: uppercase;
  letter-spacing: .1em; line-height: 1.1; margin: 0 0 .5em; color: var(--ink);
}
h1 { font-size: clamp(44px, 7vw, 86px); }
h2 { font-size: clamp(34px, 4.6vw, 58px); }
h3 { font-size: clamp(24px, 2.2vw, 30px); letter-spacing: .08em; }
.script { display: block; font-family: var(--head); font-style: italic; text-transform: none; letter-spacing: .01em; color: var(--accent-text); }
.eyebrow { display: inline-block; font-weight: 500; font-size: 13px; letter-spacing: .24em; text-transform: uppercase; color: var(--brand-text); margin-bottom: 18px; }
.lede { font-size: clamp(19px, 1.6vw, 22px); line-height: 1.6; }
p { margin: 0 0 1.1em; }
section { padding: clamp(72px, 10vw, 130px) 0; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: .6em;
  font-family: var(--body); font-weight: 500; font-size: 16px; letter-spacing: .08em;
  text-transform: uppercase; text-decoration: none; text-align: left;
  padding: 18px 34px; border-radius: 999px; border: 2px solid transparent; cursor: pointer;
  transition: background .2s, color .2s, transform .2s, box-shadow .2s;
  box-shadow: 0 6px 18px -8px rgba(0,0,0,.35);
}
.btn::after { content: "→"; font-size: 1.15em; transition: transform .2s; }
.btn:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(0,0,0,.45); }
.btn:hover::after { transform: translateX(4px); }
.btn:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.btn-primary { background: var(--brand); color: var(--on-brand); }
.btn-primary:hover { background: var(--brand-hover); }
.btn-accent { background: var(--accent); color: var(--on-accent); }
.btn-accent:hover { background: var(--accent-hover); }
.btn-outline { background: transparent; color: var(--ink); border-color: var(--ink); box-shadow: none; }
.btn-outline:hover { background: var(--ink); color: var(--bg); }
.btn-light { background: var(--white); color: var(--ink); }
.btn-ghost-light { background: transparent; color: var(--white); border-color: rgba(255,255,255,.85); box-shadow: none; }
.btn-ghost-light:hover { background: var(--white); color: var(--ink); }
.btn-row { display: flex; flex-wrap: wrap; gap: 14px; }
.price-note { font-size: 15px; letter-spacing: .04em; opacity: .9; margin-top: 14px; }

/* ---------- Draft banner ---------- */

/* ---------- Header / hero ---------- */
.hero { position: relative; min-height: min(92vh, 860px); color: var(--white); display: flex; flex-direction: column; overflow: hidden; }
.hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 30%; }
.hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(var(--shade),.82) 0%, rgba(var(--shade),.55) 40%, rgba(var(--shade),0) 72%); }
.nav { position: relative; z-index: 3; display: flex; align-items: center; justify-content: space-between; padding: 26px 0; }
.nav .logo img { width: 170px; }
.nav ul { display: flex; gap: 28px; list-style: none; margin: 0; padding: 0; }
.nav a { text-decoration: none; font-size: 14px; letter-spacing: .18em; text-transform: uppercase; font-weight: 400; }
.nav ul a:hover { text-decoration: underline; text-underline-offset: 6px; }
.menu-btn { display: none; }
.hero-body { position: relative; z-index: 2; margin-block: auto; padding: 40px 0 90px; max-width: 640px; }
.hero h1 { color: var(--white); }
.hero h1 .script { font-size: .6em; margin-top: .25em; color: var(--white); }
.hero h1 .script em { font-style: inherit; color: var(--accent-soft); }
.hero p { font-size: 20px; max-width: 32em; color: rgba(255,255,255,.92); margin-bottom: 34px; }

/* ---------- Intro statement ---------- */
.statement { padding: clamp(64px, 8vw, 110px) 0; text-align: center; }
.statement p {
  font-family: var(--head); font-weight: 300; font-size: clamp(30px, 3.8vw, 50px);
  line-height: 1.25; color: var(--ink); margin: 0 auto; max-width: 17em;
}
.statement em { color: var(--accent-text); }
.statement .sig { font-family: var(--body); font-size: 14px; letter-spacing: .24em; text-transform: uppercase; color: var(--brand-text); margin-top: 28px; display: block; }

/* ---------- Split ---------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 7vw, 100px); align-items: center; }
.split-photo { position: relative; }
.split-photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 4px; }
.split-photo::after { content: ""; position: absolute; inset: auto -18px -18px auto; width: 60%; height: 60%; border: 2px solid var(--accent); border-radius: 4px; z-index: -1; }
.creds { list-style: none; padding: 0; margin: 28px 0 36px; display: grid; gap: 14px; }
.creds li { display: flex; gap: 14px; align-items: center; font-weight: 400; color: var(--ink); }
.creds svg { flex: none; width: 28px; height: 28px; color: var(--brand-text); }

/* ---------- Wash ---------- */
.wash { background: var(--wash); text-align: center; }
.opens { list-style: none; padding: 0; margin: 50px auto 40px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; max-width: 980px; }
.opens li { background: rgba(255,255,255,.75); border-radius: 16px; padding: 30px 24px; font-size: 19px; font-weight: 400; color: var(--ink); line-height: 1.45; box-shadow: 0 10px 30px -22px rgba(var(--shade),.5); }
.opens svg { width: 34px; height: 34px; color: var(--accent); margin: 0 auto 14px; display: block; }
.after-list { font-family: var(--head); font-style: italic; font-size: clamp(26px, 2.6vw, 34px); color: var(--ink); margin: 0; }

/* ---------- Testimonials ---------- */
.feature-quote { display: grid; grid-template-columns: 1fr 1fr; min-height: 600px; background: var(--ink); color: var(--white); padding: 0; overflow: hidden; }
.feature-quote > img { width: 100%; height: 100%; min-height: 600px; object-fit: cover; object-position: 51% 55%; display: block; }
.feature-quote figure { margin: 0; align-self: center; padding: clamp(48px, 6vw, 96px) clamp(28px, 6vw, 88px); max-width: 640px; }
.feature-quote .mark { font-family: var(--head); font-size: 120px; line-height: .6; color: var(--accent-soft); display: block; margin-bottom: 18px; }
.feature-quote blockquote { margin: 0 0 28px; font-family: var(--head); font-style: italic; font-size: clamp(28px, 3vw, 42px); line-height: 1.3; }
.feature-quote figcaption { font-size: 15px; letter-spacing: .22em; text-transform: uppercase; }
.feature-quote figcaption b { font-weight: 500; color: var(--accent-soft); }

.testimonials { background: var(--white); }
.videos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin: 50px 0 46px; }
.video-card { background: var(--bg); border-radius: 18px; overflow: hidden; display: flex; flex-direction: column; }
.video { position: relative; aspect-ratio: 16 / 9; background: #000 center / cover no-repeat; cursor: pointer; border: 0; padding: 0; width: 100%; display: block; }
.video::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.15); transition: background .2s; }
.video:hover::after { background: rgba(0,0,0,.05); }
.video .play { position: absolute; z-index: 1; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 70px; height: 70px; border-radius: 50%; background: var(--accent); display: grid; place-items: center; box-shadow: 0 6px 20px rgba(0,0,0,.35); }
.video .play::before { content: ""; border-style: solid; border-width: 11px 0 11px 18px; border-color: transparent transparent transparent var(--on-accent); margin-left: 5px; }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-card .q { padding: 26px 26px 30px; }
.video-card blockquote { margin: 0 0 14px; font-family: var(--head); font-style: italic; font-size: 24px; line-height: 1.35; color: var(--ink); }
.video-card .name { font-size: 14px; letter-spacing: .2em; text-transform: uppercase; color: var(--accent-text); font-weight: 500; }
.written { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-bottom: 50px; }
.written figure { margin: 0; padding: 34px 34px 30px; border-radius: 18px; background: var(--wash); }
.written blockquote { margin: 0 0 16px; font-size: 19px; line-height: 1.6; color: var(--ink); font-weight: 400; }
.written figcaption { font-size: 14px; letter-spacing: .2em; text-transform: uppercase; color: var(--accent-text); font-weight: 500; }
.written figcaption span { display: block; letter-spacing: .06em; text-transform: none; color: var(--muted); font-weight: 300; font-size: 15px; margin-top: 2px; }

/* ---------- Offers ---------- */
.taster { display: grid; grid-template-columns: 1.1fr 1fr; align-items: stretch; border-radius: 22px; overflow: hidden; background: var(--ink); color: var(--white); margin-top: 50px; }
.taster img { width: 100%; height: 100%; object-fit: cover; min-height: 340px; }
.taster-body { padding: clamp(32px, 5vw, 60px); display: flex; flex-direction: column; justify-content: center; }
.taster h3 { color: var(--white); font-size: clamp(30px, 3vw, 40px); }
.taster .price { font-family: var(--head); font-size: 54px; line-height: 1; color: var(--accent-soft); margin: 4px 0 6px; }
.taster .price small { font-family: var(--body); font-size: 15px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.8); margin-left: 8px; }
.taster p { color: rgba(255,255,255,.88); }
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 28px; }
.card { background: var(--white); border-radius: 18px; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 18px 40px -28px rgba(var(--shade),.55); }
.card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.card-body { padding: 30px 28px 34px; display: flex; flex-direction: column; flex: 1; }
.card-body p { color: var(--muted); font-size: 17px; flex: 1; }
.card .tag { font-size: 13px; letter-spacing: .2em; text-transform: uppercase; color: var(--accent-text); font-weight: 500; margin-bottom: 8px; }
.card .btn { align-self: flex-start; padding: 15px 26px; font-size: 14px; }

/* ---------- CTA + footer ---------- */
.cta { background: var(--glow); color: var(--white); text-align: center; }
.cta h2 { color: var(--white); }
.cta .script { color: var(--white); }
.cta p { color: rgba(255,255,255,.85); }
footer { background: var(--ink); color: rgba(255,255,255,.8); padding: 64px 0 40px; font-size: 15px; }
.foot { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 40px; }
footer img { width: 160px; margin-bottom: 18px; }
footer h4 { font-family: var(--body); font-weight: 500; font-size: 13px; letter-spacing: .22em; text-transform: uppercase; color: var(--white); margin: 6px 0 14px; }
footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
footer a { text-decoration: none; }
footer a:hover { text-decoration: underline; }
.social { display: flex; gap: 14px; margin-top: 18px; }
.social a { width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255,255,255,.4); display: grid; place-items: center; }
.social svg { width: 18px; height: 18px; fill: currentColor; }
.legal { border-top: 1px solid rgba(255,255,255,.15); margin-top: 44px; padding-top: 22px; font-size: 14px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; }

/* ---------- Mobile menu ---------- */
.mobile-menu { position: fixed; inset: 0; z-index: 100; background: var(--ink); color: var(--white); display: none; flex-direction: column; padding: 26px 24px; }
.mobile-menu.open { display: flex; }
.mobile-menu .top { display: flex; justify-content: space-between; align-items: center; }
.mobile-menu ul { list-style: none; padding: 0; margin: 48px 0 0; display: grid; gap: 22px; }
.mobile-menu a { font-family: var(--head); font-size: 32px; text-decoration: none; text-transform: uppercase; letter-spacing: .08em; }
.mobile-menu .btn { margin-top: 40px; align-self: flex-start; font-family: var(--body); }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .nav ul { display: none; }
  .menu-btn { display: inline-flex; background: none; border: 1px solid rgba(255,255,255,.75); color: var(--white); border-radius: 999px; padding: 9px 18px; font: 400 14px var(--body); letter-spacing: .16em; text-transform: uppercase; cursor: pointer; }
  .split, .cards, .videos, .taster, .written, .foot { grid-template-columns: 1fr; }
  .opens { grid-template-columns: 1fr 1fr; }
  .split-photo::after { inset: auto -10px -10px auto; }
  .taster img { min-height: 260px; max-height: 360px; }
}
@media (max-width: 560px) {
  body { font-size: 17px; }
  h1 { font-size: 40px; }
  .hero { min-height: 88vh; }
  .hero > img { object-position: 72% 20%; }
  .hero::before { background: linear-gradient(0deg, rgba(var(--shade),.9) 0%, rgba(var(--shade),.6) 55%, rgba(var(--shade),.2) 100%); }
  .hero-body { margin-top: auto; margin-bottom: 0; padding-bottom: 56px; }
  .hero p { font-size: 18px; }
  .opens { grid-template-columns: 1fr; }
  .btn { padding: 16px 26px; font-size: 15px; }
  .feature-quote { grid-template-columns: 1fr; min-height: 0; }
  .feature-quote > img { min-height: 0; aspect-ratio: 4 / 5; object-position: 51% 60%; }
  .feature-quote figure { padding: 48px 24px 56px; }
}

/* ---------- Glow sections ---------- */
.taster, .mobile-menu { background: var(--glow); }
.feature-quote { background: var(--glow-right); }
footer { background: linear-gradient(rgba(50,12,30,.38), rgba(50,12,30,.38)), var(--glow-right); }
/* Sage is the main call to action: it glows against the mulberry */
.btn-accent { background: var(--brand); color: var(--on-brand); }
.btn-accent:hover { background: var(--brand-hover); }
.video .play { background: var(--brand); }
.opens svg, .creds svg { color: var(--brand-text); }
.nav ul a[aria-current="page"] { color: var(--accent-soft); }
.mobile-menu a[aria-current="page"] { color: var(--accent-soft); }

/* ---------- Inner pages ---------- */
.hero.hero-page { min-height: min(74vh, 700px); }
.hero.hero-page.hero-home { min-height: min(92vh, 860px); }
.hero-page .hero-body { max-width: 640px; }
.hero-page .eyebrow { color: var(--brand-soft); }
.prose p { margin: 0 0 1.1em; }
.prose p:last-child { margin-bottom: 0; }
.chapter + .chapter { margin-top: clamp(64px, 9vw, 120px); }
.split.flip > :first-child { order: 2; }
.chapter .num { font-family: var(--head); font-style: italic; font-size: 22px; color: var(--accent-text); display: block; margin-bottom: 6px; }
.pillars { list-style: none; padding: 0; margin: 50px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; text-align: left; }
.pillars li { background: rgba(255,255,255,.78); border-radius: 18px; padding: 34px 30px; box-shadow: 0 10px 30px -22px rgba(var(--shade),.5); }
.pillars h3 { font-size: 30px; margin: 0 0 10px; }
.pillars p { margin: 0; font-size: 17px; }
.glow-statement { background: var(--glow); color: var(--white); text-align: center; }
.glow-statement blockquote { margin: 0 auto; max-width: 18em; font-family: var(--head); font-style: italic; font-size: clamp(32px, 4vw, 52px); line-height: 1.25; }
.glow-statement p { color: rgba(255,255,255,.88); max-width: 36em; margin: 28px auto 0; }
.photo-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.photo-pair img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 4px; }
@media (max-width: 960px) {
  .pillars { grid-template-columns: 1fr; }
  .split.flip > :first-child { order: 0; }
}
/* Hero with the words on the right: the photo fills the left part only, and a solid
   mulberry panel on the right fades into it, so the person stays uncovered. */
.hero.hero-right { background: var(--ink); }
/* The photo is shifted left (part of the brick wall hangs off-screen) so the person sits
   around a fifth of the way across. A long, eased fade turns it into solid mulberry by 58%,
   and the words start inside the solid part. A soft band at the top keeps the menu readable. */
.hero-right > img { left: -12%; width: 70%; right: auto; }
.hero-right .hero-body { margin-left: auto; width: min(480px, 36vw); max-width: none; }
.hero.hero-right::before { background:
  linear-gradient(180deg, rgba(var(--shade),.72) 0, rgba(var(--shade),.35) 90px, rgba(var(--shade),0) 170px),
  linear-gradient(90deg, rgba(var(--shade),0) 0%, rgba(var(--shade),0) 22%, rgba(var(--shade),.12) 29%, rgba(var(--shade),.3) 35%,
    rgba(var(--shade),.55) 41%, rgba(var(--shade),.78) 47%, rgba(var(--shade),.93) 53%, var(--ink) 58%, var(--ink) 100%); }
.hero-right h1 { font-size: clamp(38px, 4.1vw, 64px); }
/* Mirror of hero-right: photo shifted to the right, words on the left over a long fade */
.hero.hero-left { background: var(--ink); }
.hero-left > img { left: auto; right: -12%; width: 70%; }
.hero-left .hero-body { margin-right: auto; width: min(480px, 36vw); max-width: none; }
.hero-left h1 { font-size: clamp(38px, 4.1vw, 64px); }
.hero.hero-left::before { background:
  linear-gradient(180deg, rgba(var(--shade),.72) 0, rgba(var(--shade),.35) 90px, rgba(var(--shade),0) 170px),
  linear-gradient(270deg, rgba(var(--shade),0) 0%, rgba(var(--shade),0) 22%, rgba(var(--shade),.12) 29%, rgba(var(--shade),.3) 35%,
    rgba(var(--shade),.55) 41%, rgba(var(--shade),.78) 47%, rgba(var(--shade),.93) 53%, var(--ink) 58%, var(--ink) 100%); }
/* Portrait photos in a hero-left: a narrower photo panel so more of the picture shows
   (e.g. the laptop in the 1:1 photo). Solid colour runs right up to the photo, then fades. */
@media (min-width: 961px) {
.hero-left.hero-portrait > img { right: 0; width: 38%; }
.hero.hero-left.hero-portrait::before { background:
  linear-gradient(180deg, rgba(var(--shade),.72) 0, rgba(var(--shade),.35) 90px, rgba(var(--shade),0) 170px),
  linear-gradient(270deg, rgba(var(--shade),0) 0%, rgba(var(--shade),0) 24%, rgba(var(--shade),.35) 30%, rgba(var(--shade),.75) 35%, var(--ink) 39%, var(--ink) 100%); }
}
/* Phones and tablets: photo on top, words below on solid mulberry */
@media (max-width: 960px) {
  .hero.hero-page { --photo-h: min(80vw, 540px); min-height: 0; background: var(--ink); }
  .hero-page > img { left: 0; right: auto; width: 100%; height: var(--photo-h); bottom: auto; }
  .hero.hero-page::before { bottom: auto; height: var(--photo-h);
    background: linear-gradient(180deg, rgba(var(--shade),.45) 0%, rgba(var(--shade),0) 28%, rgba(var(--shade),0) 62%, var(--ink) 100%); }
  .hero-page .hero-body { margin: calc(var(--photo-h) - 140px) 0 0; padding: 0 0 56px; width: auto; }
}
/* Layering: photo at the back, darkening layer over it, menu and words on top */
.hero > img { z-index: 0; }
.hero::before { z-index: 1; }
.hero .nav { position: relative; z-index: 3; }
@media (max-width: 560px) {
  .hero.hero-page { min-height: 0; }
  .hero-page .hero-body { margin: calc(var(--photo-h) - 110px) 0 0; }
}

/* ---------- Offer rows (Work with me) ---------- */
.offer .tag { display: block; font-size: 13px; letter-spacing: .2em; text-transform: uppercase; color: var(--accent-text); font-weight: 500; margin-bottom: 14px; }
.offer h2 { margin-bottom: .35em; }
.offer .btn-row { margin-top: 30px; }
.offer .split-photo img { aspect-ratio: 5 / 4; }
.offer-note { font-size: 16px; color: var(--muted); margin-top: 18px; }

/* ---------- Lists, quote cards and FAQs ---------- */
.checklist { list-style: none; padding: 0; margin: 44px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 22px; text-align: left; }
.checklist li { position: relative; background: rgba(255,255,255,.78); border-radius: 14px; padding: 18px 22px 18px 54px; color: var(--ink); font-weight: 400; line-height: 1.5; box-shadow: 0 10px 30px -24px rgba(var(--shade),.5); }
.checklist li::before { content: ""; position: absolute; left: 22px; top: 22px; width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid var(--brand-text);
  background: radial-gradient(circle, var(--brand-text) 0 3px, transparent 4px); }
.checklist.plain li { background: var(--white); }
.quote-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 50px; text-align: left; }
.quote-cards figure { margin: 0; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.22); border-radius: 18px; padding: 32px 30px; backdrop-filter: blur(4px); }
.quote-cards blockquote { margin: 0 0 18px; font-family: var(--head); font-style: italic; font-size: 25px; line-height: 1.35; color: var(--white); }
.quote-cards figcaption { font-size: 14px; letter-spacing: .2em; text-transform: uppercase; color: var(--accent-soft); font-weight: 500; }
.glow-statement h2 { color: var(--white); }
.glow-statement .eyebrow { color: var(--brand-soft); }
.faq { max-width: 820px; margin: 44px auto 0; }
.faq details { border-bottom: 1px solid var(--line); padding: 4px 0; }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 18px 0; font-family: var(--head); font-size: 26px; color: var(--ink); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-family: var(--body); font-weight: 300; font-size: 30px; color: var(--accent-text); transition: transform .2s; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { margin: 0 0 22px; max-width: 40em; }
@media (max-width: 960px) {
  .checklist, .quote-cards { grid-template-columns: 1fr; }
}
.glow-statement .script { color: var(--accent-soft); }

/* ---------- Programme cards (1:1 Coaching) ---------- */
.plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 50px; align-items: stretch; }
.plan { background: var(--white); border-radius: 22px; padding: 38px 32px 34px; display: flex; flex-direction: column; box-shadow: 0 20px 44px -30px rgba(var(--shade),.55); }
.plan.featured { background: var(--glow); color: var(--white); }
.plan .tag { font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--accent-text); font-weight: 500; margin-bottom: 12px; }
.plan.featured .tag { color: var(--accent-soft); }
.plan h3 { font-size: clamp(30px, 2.6vw, 38px); margin: 0 0 6px; }
.plan.featured h3 { color: var(--white); }
.plan .rhythm { font-family: var(--head); font-style: italic; font-size: 24px; color: var(--accent-text); margin-bottom: 18px; }
.plan.featured .rhythm { color: var(--accent-soft); }
.plan p { font-size: 17px; margin: 0 0 14px; }
.plan .best { font-size: 16px; border-top: 1px solid var(--line); padding-top: 16px; margin-top: auto; }
.plan.featured .best { border-color: rgba(255,255,255,.25); }
.plan .note { font-size: 15px; font-style: italic; color: var(--muted); }
.plan.featured .note { color: rgba(255,255,255,.8); }
.plan .btn { margin-top: 22px; align-self: flex-start; }
.because { list-style: none; padding: 0; margin: 30px auto 0; max-width: 34em; display: grid; gap: 14px; font-family: var(--head); font-size: clamp(24px, 2.4vw, 32px); line-height: 1.3; color: var(--ink); }
@media (max-width: 960px) { .plans { grid-template-columns: 1fr; } }

/* Glowing quote panel (used in place of a photo beside text) */
.glow-panel { margin: 0; background: var(--glow); color: var(--white); border-radius: 22px; aspect-ratio: 4 / 5; display: flex; flex-direction: column; justify-content: center; padding: clamp(36px, 5vw, 64px); box-shadow: 0 24px 50px -30px rgba(var(--shade),.6); }
.glow-panel .mark { font-family: var(--head); font-size: 120px; line-height: .6; color: var(--accent-soft); display: block; margin-bottom: 18px; }
.glow-panel blockquote { margin: 0 0 26px; font-family: var(--head); font-style: italic; font-size: clamp(30px, 3vw, 44px); line-height: 1.25; }
.glow-panel figcaption { font-size: 14px; letter-spacing: .22em; text-transform: uppercase; color: var(--accent-soft); font-weight: 500; }
@media (max-width: 960px) { .glow-panel { aspect-ratio: auto; } }

/* ---------- Honour (sales page) ---------- */
.key-facts { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 30px; padding: 0; list-style: none; }
.key-facts li { border: 1px solid rgba(255,255,255,.4); border-radius: 999px; padding: 8px 16px; font-size: 14px; letter-spacing: .06em; color: rgba(255,255,255,.92); }
.pill-list { list-style: none; padding: 0; margin: 26px 0; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.pill-list li { background: var(--white); border: 1px solid var(--line); border-radius: 999px; padding: 10px 20px; font-family: var(--head); font-size: 22px; font-style: italic; color: var(--ink); }
.because-glow { list-style: none; padding: 0; margin: 30px auto 0; max-width: 36em; display: grid; gap: 14px; color: rgba(255,255,255,.92); font-size: 19px; }
.phases { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 50px; text-align: left; }
.phase { background: rgba(255,255,255,.8); border-radius: 22px; padding: 34px 30px; box-shadow: 0 16px 40px -30px rgba(var(--shade),.55); }
.phase .tag { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--accent-text); font-weight: 500; }
.phase h3 { font-size: 34px; margin: 6px 0 18px; }
.phase h4 { font-family: var(--head); font-style: italic; font-weight: 400; font-size: 24px; color: var(--accent-text); margin: 18px 0 6px; }
.phase p { font-size: 16px; margin: 0; }
.two-lists { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 70px); align-items: start; }
.two-lists .checklist { grid-template-columns: 1fr; margin-top: 26px; }
.includes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; margin-top: 50px; }
.includes article { background: var(--white); border-radius: 18px; padding: 30px 30px 26px; box-shadow: 0 14px 34px -26px rgba(var(--shade),.5); }
.includes h3 { font-size: 28px; margin: 0 0 8px; }
.includes p { font-size: 16px; margin: 0; }
.price-panel { margin: 50px auto 0; max-width: 760px; background: var(--glow); color: var(--white); border-radius: 26px; padding: clamp(36px, 5vw, 60px); text-align: center; box-shadow: 0 24px 50px -30px rgba(var(--shade),.6); }
.price-panel .amount { font-family: var(--head); font-size: clamp(44px, 5vw, 64px); line-height: 1; color: var(--white); margin: 8px 0; }
.price-panel .amount small { font-family: var(--body); font-size: 15px; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.8); }
.price-panel p { color: rgba(255,255,255,.88); }
.moons { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 50px; }
.moon { background: var(--white); border-radius: 18px; padding: 30px 28px; box-shadow: 0 14px 34px -26px rgba(var(--shade),.5); }
.moon .tag { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--accent-text); font-weight: 500; }
.moon h3 { font-size: 26px; margin: 6px 0 14px; }
.moon ul { margin: 0 0 16px; padding-left: 18px; font-size: 16px; }
.moon ul li { margin-bottom: 4px; }
.moon .dates { font-size: 14px; color: var(--muted); border-top: 1px solid var(--line); padding-top: 12px; line-height: 1.7; }
.comments { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 30px; text-align: left; }
.comments figure { margin: 0; background: rgba(255,255,255,.08); border-radius: 16px; padding: 24px; border: 1px solid rgba(255,255,255,.18); }
.comments h4 { margin: 0 0 8px; font-family: var(--head); font-size: 22px; font-weight: 400; color: var(--accent-soft); }
.comments p { margin: 0; font-size: 16px; color: rgba(255,255,255,.88); }
@media (max-width: 960px) {
  .phases, .moons, .comments, .includes, .two-lists { grid-template-columns: 1fr; }
}

/* ---------- Client avatars (small round photos beside testimonials) ---------- */
.avatar { flex: none; display: inline-block; width: 78px; height: 78px; border-radius: 50%; background: var(--line) center / cover no-repeat; background-image: var(--img); box-shadow: 0 0 0 3px rgba(255,255,255,.85), 0 6px 16px -6px rgba(0,0,0,.35); }
.with-avatar { display: flex; align-items: center; gap: 14px; }
.with-avatar .who { display: block; }
.feature-quote .with-avatar, .glow-statement .with-avatar { justify-content: flex-start; }
/* Initial circle for clients without a photo */
.avatar.initial { display: inline-grid; place-items: center; background: linear-gradient(135deg, var(--brand) 0%, var(--accent) 100%); font-family: var(--head); font-size: 34px; font-style: italic; color: var(--white); letter-spacing: 0; text-transform: none; }
@media (max-width: 560px) { .avatar { width: 64px; height: 64px; } }

/* ---------- Client stories page ---------- */
.videos.videos-2 { grid-template-columns: repeat(2, 1fr); }
.story-cards { columns: 3 300px; column-gap: 22px; margin-top: 50px; }
.story-cards figure { break-inside: avoid; margin: 0 0 22px; background: rgba(255,255,255,.85); border-radius: 18px; padding: 30px 28px 26px; box-shadow: 0 14px 34px -26px rgba(var(--shade),.5); }
.story-cards blockquote { margin: 0 0 20px; font-family: var(--head); font-style: italic; font-size: 23px; line-height: 1.4; color: var(--ink); }
.story-cards .who { font-size: 14px; letter-spacing: .18em; text-transform: uppercase; color: var(--accent-text); font-weight: 500; }
.story-cards .who span { display: block; letter-spacing: .04em; text-transform: none; color: var(--muted); font-weight: 300; font-size: 15px; margin-top: 2px; }
@media (max-width: 960px) { .videos.videos-2 { grid-template-columns: 1fr; } }
.story-cards { text-align: left; }

/* ---------- Editorial testimonials (Client stories) ---------- */
.editorial { display: grid; grid-template-columns: repeat(2, 1fr); gap: 60px 70px; margin-top: 60px; text-align: left; }
.editorial figure { margin: 0; border-left: 3px solid var(--brand); padding-left: 30px; position: relative; }
.editorial .mark { position: absolute; left: 24px; top: -38px; font-family: var(--head); font-size: 110px; color: var(--accent-text); opacity: .25; line-height: 1; }
.editorial blockquote { margin: 0 0 22px; font-family: var(--head); font-size: clamp(23px, 2.2vw, 29px); line-height: 1.38; color: var(--ink); position: relative; }
.editorial .who { font-size: 14px; letter-spacing: .18em; text-transform: uppercase; color: var(--accent-text); font-weight: 500; }
.editorial .who span { display: block; letter-spacing: .04em; text-transform: none; color: var(--muted); font-weight: 300; font-size: 15px; margin-top: 2px; }
/* ---------- Testimonial slider (home) ---------- */
.t-slider { display: flex; align-items: center; gap: 20px; max-width: 920px; margin: 50px auto 0; }
.t-track { flex: 1; display: grid; }
.t-slide { grid-area: 1 / 1; margin: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; opacity: 0; visibility: hidden; transition: opacity .5s, visibility .5s; }
.t-slide.on { opacity: 1; visibility: visible; }
.t-slide .avatar { width: 110px; height: 110px; margin-bottom: 26px; }
.t-slide blockquote { margin: 0 0 22px; font-family: var(--head); font-style: italic; font-size: clamp(25px, 2.8vw, 36px); line-height: 1.32; color: var(--ink); max-width: 22em; }
.t-slide figcaption b { display: block; font-weight: 500; font-size: 14px; letter-spacing: .2em; text-transform: uppercase; color: var(--accent-text); }
.t-slide figcaption span { color: var(--muted); font-size: 15px; }
.t-arrow { flex: none; width: 54px; height: 54px; border-radius: 50%; border: 1.5px solid var(--ink); background: transparent; color: var(--ink); font-size: 20px; cursor: pointer; transition: background .2s, color .2s; }
.t-arrow:hover, .t-arrow:focus-visible { background: var(--ink); color: #fff; }
.t-dots { display: flex; justify-content: center; gap: 10px; margin-top: 26px; flex-wrap: wrap; }
.t-dot { width: 10px; height: 10px; border-radius: 50%; border: 0; background: var(--line); cursor: pointer; padding: 0; }
.t-dot.on { background: var(--accent-text); }
@media (max-width: 960px) { .editorial { grid-template-columns: 1fr; gap: 54px; } }
@media (max-width: 560px) { .t-slider { gap: 8px; } .t-arrow { width: 40px; height: 40px; font-size: 16px; } .t-slide .avatar { width: 90px; height: 90px; } }
.t-dots { margin-bottom: 44px; }

/* ---------- Event cards (Events page): each event reads like a product ---------- */
.events-list { display: grid; gap: 34px; margin-top: 40px; }
.event-card { display: grid; grid-template-columns: 5fr 7fr; background: var(--white); border-radius: 26px; overflow: hidden; box-shadow: 0 26px 60px -36px rgba(var(--shade),.6); min-height: 400px; }
.event-media { position: relative; min-height: 300px; }
.event-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.event-media .glow-panel { height: 100%; aspect-ratio: auto; border-radius: 0; box-shadow: none; padding: clamp(28px, 4vw, 48px); }
.event-media .glow-panel blockquote { font-size: clamp(26px, 2.4vw, 34px); }
.event-badge { position: absolute; top: 18px; left: 18px; z-index: 2; background: var(--white); color: var(--ink); border-radius: 999px; padding: 7px 14px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 500; box-shadow: 0 6px 16px -8px rgba(0,0,0,.4); }
.event-body { padding: clamp(30px, 4vw, 48px); display: flex; flex-direction: column; justify-content: center; }
.event-body .kind { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--accent-text); font-weight: 500; margin-bottom: 10px; }
.event-body h2 { font-size: clamp(30px, 3vw, 42px); margin: 0 0 12px; }
.event-body .lede { font-size: 19px; margin: 0 0 16px; }
.event-body p { font-size: 16px; margin: 0 0 14px; }
.event-facts { list-style: none; padding: 0; margin: 4px 0 20px; display: flex; flex-wrap: wrap; gap: 8px; }
.event-facts li { background: var(--bg); border: 1px solid var(--line); border-radius: 999px; padding: 6px 14px; font-size: 14px; color: var(--ink); }
.event-body .btn-row { margin-top: 8px; }
@media (max-width: 960px) {
  .event-card { grid-template-columns: 1fr; min-height: 0; }
  .event-media { min-height: 0; aspect-ratio: 16 / 10; }
  .event-media .glow-panel { position: absolute; inset: 0; }
}
.event-body .btn { padding: 15px 26px; font-size: 14px; }
.event-badge { left: auto; right: 18px; }
/* Event fact bubbles: mulberry with a sage dot */
.event-facts li { background: var(--ink); border-color: var(--ink); color: var(--white); display: inline-flex; align-items: center; gap: 8px; }
.event-facts li::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--brand-soft); }

/* ---------- Contact page ---------- */
.contact-grid { display: grid; grid-template-columns: 7fr 5fr; gap: clamp(28px, 4vw, 50px); align-items: start; text-align: left; }
.contact-card { background: var(--white); border-radius: 26px; padding: clamp(30px, 4vw, 50px); box-shadow: 0 26px 60px -36px rgba(var(--shade),.6); }
.contact-card h2 { font-size: clamp(30px, 3vw, 42px); margin-bottom: 10px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.field label { font-size: 14px; letter-spacing: .08em; color: var(--ink); font-weight: 400; }
.field input, .field textarea { font: 300 17px var(--body); color: var(--text); background: var(--bg); border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; width: 100%; }
.field textarea { min-height: 150px; resize: vertical; }
.field input:focus, .field textarea:focus { outline: 2px solid var(--brand); outline-offset: 1px; border-color: transparent; }
.consent { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; color: var(--muted); margin: 6px 0 22px; }
.consent input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--brand); flex: none; }
.form-note { margin: 14px 0 0; font-size: 15px; }
.form-error { color: #b42318; font-size: 13px; }
.form-thanks { text-align: center; padding: 40px 10px; }
.form-thanks h3 { font-size: 34px; }
.contact-side { display: grid; gap: 22px; }
.side-card { background: var(--glow); color: var(--white); border-radius: 22px; padding: 32px; }
.side-card h3 { color: var(--white); font-size: 30px; margin-bottom: 8px; }
.side-card p { color: rgba(255,255,255,.88); font-size: 16px; }
.side-card .price { font-family: var(--head); font-size: 40px; color: var(--accent-soft); line-height: 1; margin: 6px 0 14px; }
.side-plain { background: var(--white); border-radius: 22px; padding: 30px 32px; box-shadow: 0 20px 44px -32px rgba(var(--shade),.55); }
.side-plain h3 { font-size: 26px; margin-bottom: 8px; }
.side-plain p { font-size: 16px; margin: 0 0 8px; }
.side-plain a { color: var(--brand-text); }
.side-social { display: flex; gap: 10px; margin-top: 12px; }
.side-social a { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: var(--white); }
.side-social svg { width: 18px; height: 18px; fill: currentColor; }
@media (max-width: 960px) { .contact-grid, .field-row { grid-template-columns: 1fr; } }

/* Contact: media & speaking */
.hero-link { display: inline-block; margin-top: 22px; color: var(--accent-soft); font-size: 15px; letter-spacing: .08em; text-decoration: none; border-bottom: 1px solid rgba(255,208,220,.45); padding-bottom: 2px; }
.hero-link:hover { border-bottom-color: var(--accent-soft); }
.media .media-lede { max-width: 38em; margin: 18px auto 0; }
.topics { list-style: none; padding: 0; margin: 54px auto 0; max-width: 1040px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; text-align: left; }
.topics li { position: relative; background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.18); border-radius: 22px; padding: 34px 34px 32px 34px; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); box-shadow: 0 24px 50px -36px rgba(30,6,18,.7); transition: transform .3s ease, background .3s ease; }
.topics li:hover { transform: translateY(-3px); background: rgba(255,255,255,.13); }
.topic-num { display: block; font-family: var(--head); font-style: italic; font-size: 22px; color: var(--accent-soft); margin-bottom: 10px; }
.topic-num::after { content: ""; display: block; width: 38px; height: 2px; background: var(--brand-soft); border-radius: 2px; margin-top: 10px; }
.topics h3 { color: var(--white); font-size: clamp(26px, 2.4vw, 32px); margin: 0 0 8px; }
.topics p { color: rgba(255,255,255,.86); font-size: 17px; margin: 0; max-width: none; }
.media-actions { justify-content: center; margin-top: 46px; }
@media (max-width: 760px) { .topics { grid-template-columns: 1fr; gap: 16px; margin-top: 40px; } .topics li { padding: 28px 26px; } }
.phase p + p { margin-top: 12px; }
.checklist.one-col { grid-template-columns: 1fr; gap: 10px; margin: 24px 0; }
.checklist.one-col li { padding-top: 14px; padding-bottom: 14px; }
.checklist.one-col li::before { top: 18px; }

/* ===== Sparkle & magic (copper: a warm glint that still fits) ===== */
:root {
  --spark: #e19a6c;
  --spark-2: #f8cba8;
  --spark-grad: linear-gradient(115deg, #f8cba8, #e19a6c 30%, #ffe0c4 52%, #d4825a 76%, #f8cba8);            /* on dark */
  --spark-grad-deep: linear-gradient(115deg, #9c4d27, #d4805a 30%, #b5602f 52%, #e19a6c 76%, #9c4d27);      /* on light */
}
@keyframes shimmer { to { background-position: 200% 0; } }

/* B · one shimmering word per page */
.spark-word { background: var(--spark-grad-deep); background-size: 200% auto; -webkit-background-clip: text; background-clip: text; color: transparent !important; animation: shimmer 8s linear infinite; }
.hero .spark-word, .glow-statement .spark-word, .cta .spark-word, .media .spark-word, .side-card .spark-word { background-image: var(--spark-grad); }

/* B · chip dots */
.event-facts li::before { background: var(--spark-grad); background-size: 200% auto; animation: shimmer 6s linear infinite; box-shadow: 0 0 8px rgba(248,203,168,.85); }

/* D · light passing through the main buttons */
.hero .btn-accent, .cta .btn-accent, .side-card .btn-accent, .taster .btn-accent { position: relative; overflow: hidden; isolation: isolate; }
.hero .btn-accent::before, .cta .btn-accent::before, .side-card .btn-accent::before, .taster .btn-accent::before {
  content: ""; position: absolute; top: 0; left: -60%; width: 45%; height: 100%; z-index: -1; pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(248,203,168,.5) 35%, rgba(255,240,228,.8) 50%, rgba(225,154,108,.45) 65%, transparent);
  transform: skewX(-20deg); animation: sweep 6.5s ease-in-out infinite; }
.hero .btn-accent::before { animation-delay: 1.2s; }
@keyframes sweep { 0%, 70% { left: -60%; } 100% { left: 130%; } }

/* E · breathing glow */
@property --gx1 { syntax: '<percentage>'; inherits: false; initial-value: 10%; }
@property --gy1 { syntax: '<percentage>'; inherits: false; initial-value: 12%; }
@property --gx2 { syntax: '<percentage>'; inherits: false; initial-value: 90%; }
@property --gy2 { syntax: '<percentage>'; inherits: false; initial-value: 88%; }
.glow-statement, .cta, .side-card, .plan.featured, .price-panel, .glow-panel, .taster, .feature-quote {
  background: radial-gradient(circle at var(--gx1) var(--gy1), rgba(124,170,145,.85), transparent 58%),
              radial-gradient(circle at var(--gx2) var(--gy2), rgba(228,98,138,.8), transparent 60%),
              radial-gradient(circle at 50% 50%, rgba(196,72,112,.45), transparent 70%), #6a2145;
  animation: breathe 16s ease-in-out infinite alternate; }
@keyframes breathe { 50% { --gx1: 30%; --gy1: 45%; --gx2: 70%; --gy2: 60%; } 100% { --gx1: 18%; --gy1: 70%; --gx2: 82%; --gy2: 25%; } }

/* F · gentle reveals (only for things below the fold, added by site.js) */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity: 1; transform: none; }

/* G · moon phases (southern sky: waxing is lit on the left) */
.moon-row { display: flex; justify-content: center; align-items: center; gap: 16px; margin: 34px auto 0; }
.moon-row i { width: 14px; height: 14px; border-radius: 50%; position: relative; overflow: hidden; background: rgba(var(--shade),.08); box-shadow: inset 0 0 0 1px rgba(var(--shade),.22); animation: moonglow 7s ease-in-out infinite; }
.moon-row i::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--spark-grad-deep); background-size: 200% auto; opacity: .85; }
.moon-row i:nth-child(1)::after { clip-path: inset(0 72% 0 0); } .moon-row i:nth-child(2)::after { clip-path: inset(0 50% 0 0); }
.moon-row i:nth-child(3)::after { clip-path: inset(0 24% 0 0); } .moon-row i:nth-child(4) { width: 20px; height: 20px; }
.moon-row i:nth-child(5)::after { clip-path: inset(0 0 0 24%); } .moon-row i:nth-child(6)::after { clip-path: inset(0 0 0 50%); } .moon-row i:nth-child(7)::after { clip-path: inset(0 0 0 72%); }
.moon-row i:nth-child(2) { animation-delay: .5s; } .moon-row i:nth-child(3) { animation-delay: 1s; } .moon-row i:nth-child(4) { animation-delay: 1.5s; }
.moon-row i:nth-child(5) { animation-delay: 2s; } .moon-row i:nth-child(6) { animation-delay: 2.5s; } .moon-row i:nth-child(7) { animation-delay: 3s; }
@keyframes moonglow { 0%, 100% { filter: none; } 20% { filter: drop-shadow(0 0 6px rgba(225,154,108,.9)); } }
.glow-statement .moon-row i, .cta .moon-row i { background: rgba(255,255,255,.14); box-shadow: inset 0 0 0 1px rgba(255,255,255,.35); }
.glow-statement .moon-row i::after, .cta .moon-row i::after { background: var(--spark-grad); }

/* G · tonight's sky in the footer */
.sky { display: inline-flex; align-items: center; gap: 12px; color: rgba(255,255,255,.85); }
.sky canvas { width: 26px; height: 26px; flex: none; }
.sky small { display: block; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.6); }

@media (prefers-reduced-motion: reduce) {
  .spark-word, .event-facts li::before, .moon-row i, .glow-statement, .cta, .side-card, .plan.featured, .price-panel, .glow-panel, .taster, .feature-quote { animation: none !important; }
  .hero .btn-accent::before, .cta .btn-accent::before, .side-card .btn-accent::before, .taster .btn-accent::before { display: none; }
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* Simple glowing header without a photo (privacy, not found) */
.hero.hero-glow { min-height: 0; text-align: center;
  background: radial-gradient(circle at var(--gx1) var(--gy1), rgba(124,170,145,.85), transparent 58%),
              radial-gradient(circle at var(--gx2) var(--gy2), rgba(228,98,138,.8), transparent 60%),
              radial-gradient(circle at 50% 50%, rgba(196,72,112,.45), transparent 70%), #6a2145;
  animation: breathe 16s ease-in-out infinite alternate; }
.hero.hero-glow::before { display: none; }
.hero-glow .hero-body { margin: 0 auto; padding: 56px 0 84px; max-width: 760px; width: auto; }
.hero-glow .eyebrow { color: var(--brand-soft); }
.hero-glow p { margin-left: auto; margin-right: auto; }
.hero-glow .btn-row { justify-content: center; }
.hero-glow .moon-row { margin: 0 auto 26px; }
.hero-glow .moon-row i { background: rgba(255,255,255,.14); box-shadow: inset 0 0 0 1px rgba(255,255,255,.35); }
.hero-glow .moon-row i::after { background: var(--spark-grad); }
@media (prefers-reduced-motion: reduce) { .hero.hero-glow { animation: none; } }

/* Legal text */
.legal-card { max-width: 780px; margin: 0 auto; background: var(--white); border-radius: 26px; padding: clamp(30px, 5vw, 60px); box-shadow: 0 26px 60px -36px rgba(var(--shade),.6); text-align: left; }
.legal-card h2 { font-size: clamp(24px, 2.4vw, 30px); margin: 38px 0 10px; }
.legal-card h2:first-of-type { margin-top: 0; }
.legal-card p, .legal-card li { font-size: 17px; }
.legal-card ul { padding-left: 22px; margin: 0 0 1.1em; display: grid; gap: 6px; }
.legal-card a { color: var(--brand-text); }
.legal-card .updated { font-size: 14px; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-text); margin: 0 0 26px; }

/* Not found: helpful links */
.lost-links { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; max-width: 1000px; margin: 0 auto; }
.lost-links a { display: block; background: var(--white); border-radius: 20px; padding: 28px 24px; text-decoration: none; color: var(--text); box-shadow: 0 16px 40px -30px rgba(var(--shade),.55); transition: transform .25s ease, box-shadow .25s ease; text-align: left; }
.lost-links a:hover, .lost-links a:focus-visible { transform: translateY(-3px); box-shadow: 0 22px 46px -28px rgba(var(--shade),.6); }
.lost-links b { display: block; font: 400 26px/1.15 var(--head); color: var(--ink); margin-bottom: 6px; }
.lost-links span { font-size: 15px; }
@media (max-width: 960px) { .lost-links { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .lost-links { grid-template-columns: 1fr; } }

/* ===== More contrast: deep forest edges + clean bright space (chosen Nov 2026). "html:root" keeps these winning over the base rules above. ===== */
html:root { --deep: 26,48,39; }   /* deep forest #1a3027 */
html:root { --bg: #fffdfb; }
html:root body { background: #fffdfb; }

/* Deep edges on the top sections, with a little brightness kept inside */
html:root .hero::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(circle at 26% 34%, rgba(228,98,138,.22), transparent 40%),
              linear-gradient(0deg, rgba(var(--deep),.6) 0, rgba(var(--deep),0) 32%),
              linear-gradient(180deg, rgba(var(--deep),.55) 0, rgba(var(--deep),0) 22%); }
html:root .hero.hero-left::after { background:
              radial-gradient(circle at 24% 40%, rgba(228,98,138,.22), transparent 38%),
              linear-gradient(90deg, rgba(var(--deep),.85) 0, rgba(var(--deep),0) 34%),
              linear-gradient(0deg, rgba(var(--deep),.55) 0, rgba(var(--deep),0) 30%),
              linear-gradient(180deg, rgba(var(--deep),.5) 0, rgba(var(--deep),0) 20%); }
html:root .hero.hero-right::after { background:
              radial-gradient(circle at 76% 40%, rgba(228,98,138,.22), transparent 38%),
              linear-gradient(270deg, rgba(var(--deep),.85) 0, rgba(var(--deep),0) 34%),
              linear-gradient(0deg, rgba(var(--deep),.55) 0, rgba(var(--deep),0) 30%),
              linear-gradient(180deg, rgba(var(--deep),.5) 0, rgba(var(--deep),0) 20%); }
html:root .hero.hero-glow::after { background: radial-gradient(ellipse at 50% 45%, transparent 45%, rgba(var(--deep),.7) 100%); }

/* Glow sections: a deep corner so the light glows brighter against it */
html:root :is(.cta, .side-card, .plan.featured, .price-panel, .taster, .feature-quote) {
  background: radial-gradient(circle at 0% 100%, rgba(var(--deep),.9), transparent 48%),
              radial-gradient(circle at 100% 0%, rgba(var(--deep),.55), transparent 40%),
              radial-gradient(circle at var(--gx1) var(--gy1), rgba(124,170,145,.85), transparent 58%),
              radial-gradient(circle at var(--gx2) var(--gy2), rgba(228,98,138,.8), transparent 60%),
              radial-gradient(circle at 50% 50%, rgba(196,72,112,.45), transparent 70%), #6a2145; }

/* One deep, snug band per page: the big quote / statement sections */
html:root .glow-statement {
  background: radial-gradient(circle at var(--gx1) var(--gy1), rgba(124,170,145,.38), transparent 50%),
              radial-gradient(circle at var(--gx2) var(--gy2), rgba(228,98,138,.42), transparent 52%),
              radial-gradient(circle at 50% 50%, rgba(225,154,108,.12), transparent 60%), rgb(var(--deep)); }

/* Footer: deepest of all */
html:root footer { background: linear-gradient(rgba(var(--deep),.82), rgba(var(--deep),.82)), var(--glow-right); }

/* Clean bright space: pure warm white, more air around the words */
html:root .statement { background: #fffdfb; padding: clamp(96px, 12vw, 170px) 0; }
html:root .statement p { max-width: 20em; margin-left: auto; margin-right: auto; }
html:root .statement .sig::before { content: ""; display: block; width: 46px; height: 1px; margin: 0 auto 26px; background: var(--spark-grad-deep); }
html:root main section:not(.wash):not(.cta):not(.glow-statement):not(.feature-quote),
html:root body > section:not(.wash):not(.cta):not(.glow-statement):not(.feature-quote):not(.statement) { background: #fffdfb; }
html:root .wash { --wash: radial-gradient(circle at 12% 15%, rgba(252,214,196,.8), transparent 50%), radial-gradient(circle at 88% 88%, rgba(244,186,202,.8), transparent 50%), #fffaf8; }

/* Even line lengths for the italic line under hero headings (no lonely last word) */
.hero h1 .script { text-wrap: balance; }

/* Home "Who I am": name line and story beats (Nov 2026) */
.hello { font-family: var(--head); font-style: italic; color: var(--accent-text); font-size: clamp(24px, 2.4vw, 32px); line-height: 1.2; margin: -.1em 0 .7em; }
.story-lines { margin: 1.4em 0; padding-left: 20px; border-left: 2px solid var(--accent-soft); }
.story-lines p { font-family: var(--head); font-style: italic; font-size: 1.3em; line-height: 1.35; color: var(--ink); margin: 0 0 .45em; }
.story-lines p:last-child { margin-bottom: 0; }
.who-photo { align-self: start; position: sticky; top: 110px; }
.who-photo img { object-position: 30% center; }
@media (max-width: 960px) { .who-photo { position: relative; top: auto; } .who-photo img { aspect-ratio: 4 / 3; object-position: 25% 30%; } }
/* Video thumbnails carry names in the middle (Nov 2026): play button sits in the corner */
.video .play { left: auto; top: auto; right: 14px; bottom: 14px; transform: none; width: 54px; height: 54px; }
.video .play::before { border-width: 9px 0 9px 15px; margin-left: 4px; }

/* Video in a pop-up, e.g. Uddhava's quote on Home (Nov 2026) */
.watch-btn { margin-top: 30px; gap: 10px; }
.watch-btn svg { width: 16px; height: 16px; }
.watch-btn::after { content: none !important; }
.video-pop { border: 0; padding: 0; width: min(960px, 92vw); background: #000; border-radius: 6px; overflow: visible; }
.video-pop::backdrop { background: rgba(30, 10, 20, .82); }
.video-pop .frame { aspect-ratio: 16 / 9; }
.video-pop iframe { width: 100%; height: 100%; border: 0; display: block; border-radius: 6px; }
.video-pop .close { position: absolute; top: -48px; right: 0; background: none; border: 0; color: #fff; font-size: 34px; line-height: 1; cursor: pointer; padding: 6px 10px; }


/* Phone crops for page heroes (Nov 2026): --pos-m on the photo sets its phone framing;
   .headroom-m starts the photo below the logo when the photo has no space above her head */
@media (max-width: 960px) {
  .hero > img[style*="--pos-m"] { object-position: var(--pos-m) !important; }
  .hero-page > img.headroom-m { top: 64px; height: calc(var(--photo-h) - 64px); }
}