/* ============================================================
   KittyHawk-Karma — "Watercolour Almanac" (see ART-DIRECTION.md)
   Watery, crafted, editorial. Layered washes, grain, celestial line art,
   Fraunces italic display + Hanken Grotesk text. One stylesheet.
   ============================================================ */

/* ---- Fonts (self-hosted, latin) ---------------------------------- */
@font-face{font-family:"Fraunces";font-style:normal;font-weight:400;font-display:swap;src:url("/static/fonts/Fraunces-Regular.woff2") format("woff2");}
@font-face{font-family:"Fraunces";font-style:normal;font-weight:500;font-display:swap;src:url("/static/fonts/Fraunces-Medium.woff2") format("woff2");}
@font-face{font-family:"Fraunces";font-style:normal;font-weight:600;font-display:swap;src:url("/static/fonts/Fraunces-SemiBold.woff2") format("woff2");}
@font-face{font-family:"Fraunces";font-style:italic;font-weight:400;font-display:swap;src:url("/static/fonts/Fraunces-Italic.woff2") format("woff2");}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:400;font-display:swap;src:url("/static/fonts/HankenGrotesk-Regular.woff2") format("woff2");}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url("/static/fonts/HankenGrotesk-Medium.woff2") format("woff2");}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:600;font-display:swap;src:url("/static/fonts/HankenGrotesk-SemiBold.woff2") format("woff2");}
/* Wordmark face — ornamental, in the spirit of Kate's "Harrington" paperwork */
@font-face{font-family:"Berkshire Swash";font-style:normal;font-weight:400;font-display:swap;src:url("/static/fonts/BerkshireSwash-Regular.woff2") format("woff2");}

/* ---- Token overrides (watery palette) ---------------------------- */
:root{
  --c-bg:#f1f8f6;           /* misty aqua-white (was cool periwinkle) */
  --c-surface:#fffdfb;
  --c-ink:#27343a;          /* soft teal-slate (was indigo) */
  --c-ink-soft:#586a70;
  --c-line:#dde9e8;
  /* — Kate's floaty palette, retuned turquoise-forward (purple retired
       per her note: "an awful lot of purple — make it more turquoise based").
       The old periwinkle "blue" now leans cyan/aqua; the "purple" slot is a
       soft seafoam-teal so nothing reads purple anywhere on the site. — */
  --c-blue:#3aa6c3;         /* was periwinkle #5f9bdf — now turquoise-blue */
  --c-blue-deep:#2b85a0;
  --c-purple:#46b6a4;       /* retired purple → seafoam teal-green */
  --c-purple-deep:#2f8e7e;
  --c-aqua:#3fc0b4;
  --c-aqua-deep:#1f9a96;
  --c-green:#5cc189;
  --c-green-deep:#3a9966;
  --c-sky:#b2e4e2;          /* was periwinkle-sky #a9d6ef — now pale aqua */
  --c-pink:#e394bb;         /* Divine Feminine Community accent */
  --c-pink-deep:#c25f93;
  /* Kate's "yellow" accents are now a dark teal (her preferred palette) */
  --c-gold:#1f6b6e;         /* dark teal accent (was warm gold) */
  /* brand = a watery teal bridging aqua↔blue */
  --c-brand:#2f9a9a;
  --c-brand-deep:#256b78;
  --c-night:#234a52;        /* deep teal night (was violet-indigo) */
  --c-lilac:#8fd2ce;        /* retired lilac → soft aqua */
  --c-mist:#e7f1f6;
  --c-accent:#3aa6c3;
  --c-accent-ink:#ffffff;

  --f-display:"Fraunces", Georgia, serif;
  --f-text:"Hanken Grotesk", system-ui, sans-serif;

  --maxw:75rem;
  --maxw-prose:40rem;
  --r-l:24px; --r-m:14px;
  --shadow-soft:0 22px 60px -30px rgba(34,58,69,.45);
  --shadow-lift:0 34px 90px -34px rgba(34,58,69,.55);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.45'/%3E%3C/svg%3E");
}

/* ---- Base ------------------------------------------------------- */
html{scroll-behavior:smooth;overflow-x:clip;}
body{font-family:var(--f-text);color:var(--c-ink);background:var(--c-bg);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip;position:relative;}
/* site-wide watery colour wash — the hero palette throughout every page */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(48% 40% at 8% 6%, rgba(63,192,180,.15), transparent 60%),
    radial-gradient(46% 42% at 92% 18%, rgba(95,155,223,.13), transparent 62%),
    radial-gradient(54% 46% at 44% 60%, rgba(63,192,180,.12), transparent 60%),
    radial-gradient(50% 46% at 84% 92%, rgba(92,193,137,.12), transparent 60%);}
/* fine grain over everything — crafted, not flat */
body::after{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;
  background-image:var(--grain);opacity:.035;mix-blend-mode:multiply;}
.container{width:min(100% - 2.4rem, var(--maxw));margin-inline:auto;}
.prose{max-width:var(--maxw-prose);}
a{color:inherit;text-decoration:none;}
::selection{background:var(--c-aqua);color:#fffefb;}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
img{max-width:100%;display:block;}
.icon{width:1em;height:1em;display:inline-block;vertical-align:-0.12em;}

h1,h2,h3,h4{font-family:var(--f-display);font-weight:500;line-height:var(--lh-snug);
  letter-spacing:-.012em;color:var(--c-brand-deep);text-wrap:balance;}
p{text-wrap:pretty;}

/* eyebrow — Fraunces italic, with a little drawn star */
.eyebrow{display:inline-flex;align-items:center;gap:.5em;font-family:var(--f-display);font-style:italic;
  font-weight:400;font-size:var(--step-1);color:var(--c-brand);letter-spacing:0;line-height:1;}
.eyebrow::before{content:"";width:.5em;height:.5em;flex:none;background:var(--c-gold);
  clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);}
.eyebrow--mini{font-size:var(--step-0);}
.eyebrow--center{justify-content:center;}

/* section rhythm */
.section{padding-block:clamp(3rem,6vw,5.25rem);position:relative;}
.section--snug{padding-block:clamp(2.2rem,4.5vw,3.6rem);}
.section__head{max-width:48rem;margin-bottom:clamp(1.8rem,3.5vw,2.6rem);}
.section__head--center{margin-inline:auto;text-align:center;}
.section__head h2{font-size:var(--step-3);margin:.5em 0 .45em;font-weight:400;}
.section__head h2 em{font-style:italic;color:var(--c-brand);}
.section__lede{font-size:var(--step-1);color:var(--c-ink-soft);line-height:1.55;}

/* hand-drawn ink divider between sections (not an <hr>) */
.ink-div{display:block;width:min(100% - 2.4rem,var(--maxw));margin:0 auto;height:34px;color:var(--c-gold);opacity:.6;}
.ink-div svg{width:100%;height:100%;display:block;overflow:visible;}

/* watercolour blobs (the "floaty" feel) */
.blob{position:absolute;border-radius:50%;filter:blur(48px);opacity:.5;z-index:-1;pointer-events:none;}
.blob{opacity:.6;}
.blob--aqua{background:radial-gradient(circle,var(--c-aqua),transparent 70%);}
/* "lilac" blobs now read teal/sky — keeps the floaty feel without the heavy purple */
.blob--lilac{background:radial-gradient(circle,var(--c-sky),transparent 70%);opacity:.45;}
.blob--sky{background:radial-gradient(circle,var(--c-blue),transparent 70%);}
.blob--green{background:radial-gradient(circle,var(--c-green),transparent 70%);}

/* ---- Buttons ---------------------------------------------------- */
.btn{position:relative;display:inline-flex;align-items:center;gap:.55em;font-family:var(--f-text);
  font-weight:600;font-size:var(--step-0);line-height:1;color:#fffefb;
  background:linear-gradient(118deg,var(--c-aqua),var(--c-blue) 55%,var(--c-purple));
  padding:1em 1.7em;border:0;border-radius:var(--r-pill);cursor:pointer;
  box-shadow:var(--shadow-soft);transition:transform var(--dur-fast) var(--ease-out-soft),box-shadow var(--dur-fast) var(--ease-out-soft);}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift);}
.btn .arrow{transition:transform var(--dur-fast) var(--ease-out-soft);}
.btn:hover .arrow{transform:translateX(4px);}
.btn--ghost{background:transparent;color:var(--c-brand-deep);box-shadow:inset 0 0 0 1.5px var(--c-brand);}
.btn--ghost:hover{background:var(--c-mist);box-shadow:inset 0 0 0 1.5px var(--c-brand-deep);}
.btn--sm{padding:.62em 1.15em;font-size:var(--step--1);}

/* ---- Announcement bar (scrolling marquee, non-interactive) ------ */
.announce{font-size:var(--step--1);position:relative;z-index:2;overflow:hidden;
  padding:.6rem 0;color:var(--c-brand-deep);
  pointer-events:none;user-select:none;-webkit-user-select:none;}
.announce__track{display:flex;width:max-content;
  animation:announce-marquee var(--marquee-dur,32s) linear infinite;}
.announce__group{display:flex;align-items:center;flex-shrink:0;}
.announce__item{white-space:nowrap;padding:0 .15rem;}
.announce__item strong{color:var(--c-brand-deep);font-weight:700;}
.announce__sep{padding:0 1.4rem;color:var(--c-brand);opacity:.7;}
@keyframes announce-marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.announce--aqua{background:var(--c-mist);}
.announce--lilac{background:#efeaf6;}
.announce--sky{background:#e3eef4;}
.announce--gold{background:#e1efe9;}
/* Note: the announcement ticker is an explicitly-requested feature, so it keeps
   scrolling even under prefers-reduced-motion (gentle horizontal text, no flashing).
   The hero waves and other large motion still calm under reduced-motion. */

/* ---- Header / nav ----------------------------------------------- */
.site-header{position:sticky;top:0;z-index:var(--z-nav);
  background:rgba(244,247,246,.72);backdrop-filter:blur(14px) saturate(1.1);
  border-bottom:1px solid transparent;transition:border-color var(--dur) ease,background var(--dur) ease;}
.site-header.is-scrolled{border-bottom-color:var(--c-line);background:rgba(244,247,246,.94);}
.site-header__inner{width:min(100% - 2.4rem,var(--maxw));margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:.7rem;}
.brand{display:flex;align-items:center;gap:.7rem;}
.brand__mark{width:64px;height:auto;}
.brand__name{font-family:"Berkshire Swash",var(--f-display);font-weight:400;font-size:clamp(1.3rem,1.05rem+1vw,1.85rem);color:var(--c-brand-deep);letter-spacing:0;line-height:1;}
.brand__dash{color:var(--c-brand);}
.nav{display:flex;align-items:center;gap:1.9rem;}
.nav a{font-weight:500;font-size:var(--step-0);color:var(--c-ink-soft);position:relative;transition:color var(--dur-fast) ease;}
.nav a:not(.nav__cta)::after{content:"";position:absolute;left:0;right:100%;bottom:-5px;height:1.5px;background:var(--c-gold);transition:right var(--dur) var(--ease-out-soft);}
.nav a:not(.nav__cta):hover{color:var(--c-brand-deep);}
.nav a:not(.nav__cta):hover::after{right:0;}
.nav__cta{color:#fffefb;background:linear-gradient(118deg,var(--c-aqua),var(--c-blue) 55%,var(--c-purple));padding:.62em 1.25em;border-radius:var(--r-pill);box-shadow:var(--shadow-soft);}
.nav__cta:hover{transform:translateY(-1px);}
/* About dropdown */
.nav__group{position:relative;display:flex;align-items:center;}
.nav__grouptop{display:inline-flex;align-items:center;gap:.3em;}
.nav__caret{font-size:.6em;transition:transform var(--dur-fast) ease;}
.nav__group:hover .nav__caret,.nav__group:focus-within .nav__caret{transform:rotate(180deg);}
.nav__menu{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(8px);min-width:210px;
  background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-m);box-shadow:var(--shadow-lift);
  padding:.45rem;display:flex;flex-direction:column;gap:.1rem;opacity:0;visibility:hidden;
  transition:opacity var(--dur) ease,transform var(--dur) ease;z-index:60;}
.nav__menu::before{content:"";position:absolute;top:-10px;left:0;right:0;height:10px;}
.nav__group:hover .nav__menu,.nav__group:focus-within .nav__menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(4px);}
.nav__menu a{font-size:var(--step--1);color:var(--c-ink);padding:.55em .8em;border-radius:8px;white-space:nowrap;}
.nav__menu a::after{display:none!important;}
.nav__menu a:hover{background:var(--c-mist);color:var(--c-brand-deep);}
.mobile-menu__sub{font-size:var(--step-0)!important;color:var(--c-ink-soft)!important;opacity:.92;}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;}
.nav-toggle span{width:24px;height:2px;background:var(--c-brand-deep);border-radius:2px;transition:.25s;}

.mobile-menu{position:fixed;inset:0;z-index:var(--z-modal);background:linear-gradient(160deg,#e8f2ef,#dde9ec);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.4rem;padding:4.2rem 1rem 2rem;overflow-y:auto;transform:translateY(-100%);transition:transform .5s var(--ease-out-expo);}
.mobile-menu.open{transform:none;}
.mobile-menu__close{position:fixed;top:1rem;right:1.3rem;font-size:2.4rem;line-height:1;background:none;border:0;color:var(--c-brand-deep);cursor:pointer;z-index:1;}
.mobile-menu__nav{display:flex;flex-direction:column;align-items:center;gap:.85rem;margin:auto 0;}
.mobile-menu__nav a{font-family:var(--f-display);font-size:var(--step-2);color:var(--c-brand-deep);}
.mobile-menu__cta{font-family:var(--f-text)!important;font-size:var(--step-0)!important;font-weight:600;color:#fffefb!important;background:linear-gradient(118deg,var(--c-aqua),var(--c-blue) 55%,var(--c-purple));padding:.7em 1.7em;border-radius:var(--r-pill);margin-top:.6rem;box-shadow:var(--shadow-soft);}
.mobile-menu__sign{font-family:var(--f-display);font-style:italic;color:var(--c-brand);margin-top:1.4rem;}

/* ---- Hero ------------------------------------------------------- */
.hero{position:relative;overflow:hidden;padding-block:clamp(2.6rem,7vw,5.5rem) clamp(3rem,7vw,6rem);}
.hero__bg{position:absolute;inset:0;z-index:-3;background:linear-gradient(180deg,#e7f5f3,var(--c-bg));}
/* Photo hero (Kate's original water image) */
.hero--photo .hero__bg{background-size:cover;background-position:center 38%;}
.hero--photo .hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.74) 32%,rgba(255,255,255,.32) 60%,rgba(255,255,255,.06) 82%,rgba(255,255,255,0) 100%);}
.hero--photo .hero__aurora{display:none;}
@media (max-width:760px){
  .hero--photo .hero__bg::after{background:linear-gradient(180deg,rgba(255,255,255,.9) 0%,rgba(255,255,255,.66) 42%,rgba(255,255,255,.28) 72%,rgba(255,255,255,.05) 100%);}
}
.hero__aurora{position:absolute;inset:-25%;z-index:-2;pointer-events:none;}
.hero__aurora span{position:absolute;border-radius:50%;filter:blur(58px);opacity:.7;mix-blend-mode:multiply;}
.hero__aurora span:nth-child(1){width:44vw;height:44vw;left:-2%;top:-4%;background:radial-gradient(circle,var(--c-blue),transparent 66%);animation:float1 18s ease-in-out infinite;}
.hero__aurora span:nth-child(2){width:40vw;height:40vw;right:0%;top:0%;background:radial-gradient(circle,var(--c-sky),transparent 66%);animation:float2 22s ease-in-out infinite;}
.hero__aurora span:nth-child(3){width:46vw;height:46vw;left:24%;bottom:-22%;background:radial-gradient(circle,var(--c-aqua),transparent 64%);animation:float1 26s ease-in-out infinite reverse;}
.hero__aurora span:nth-child(4){width:38vw;height:38vw;right:18%;bottom:-12%;background:radial-gradient(circle,var(--c-green),transparent 66%);animation:float2 30s ease-in-out infinite;}
@keyframes float1{0%,100%{transform:translate(0,0)}50%{transform:translate(3%,-4%)}}
@keyframes float2{0%,100%{transform:translate(0,0)}50%{transform:translate(-4%,5%)}}
.hero__motes{position:absolute;inset:0;z-index:1;pointer-events:none;}
.hero__mote{position:absolute;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle,#fff,rgba(255,255,255,0));opacity:.7;animation:drift 16s ease-in-out infinite;}
@keyframes drift{0%,100%{transform:translateY(0) translateX(0);opacity:.3}50%{transform:translateY(-26px) translateX(14px);opacity:.85}}
.hero__inner{position:relative;z-index:2;display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;}
.hero__moons{width:128px;height:24px;color:var(--c-gold);margin-bottom:1rem;opacity:.8;}
.hero__title{font-size:var(--step-5);font-weight:400;line-height:1.0;color:var(--c-brand-deep);margin:.3rem 0 1.2rem;letter-spacing:-.02em;}
.hero__title em{font-style:italic;color:var(--c-brand);}
.hero__lede{font-size:var(--step-1);color:var(--c-ink-soft);line-height:1.55;max-width:33rem;margin-bottom:1.9rem;}
.hero__actions{display:flex;gap:.9rem;flex-wrap:wrap;align-items:center;}
/* hero art — glowing mark inside slow orbit rings */
.hero__art{position:relative;display:grid;place-items:center;aspect-ratio:1;}
.hero__orbit{position:absolute;border:1px solid var(--c-gold);border-radius:50%;opacity:.4;}
.hero__orbit--1{inset:4%;}
.hero__orbit--2{inset:16%;border-style:dashed;border-color:var(--c-brand);opacity:.3;animation:spin 60s linear infinite;}
.hero__orbit--3{inset:-6%;border-color:var(--c-lilac);opacity:.3;}
@keyframes spin{to{transform:rotate(360deg)}}
.hero__orbit-dot{position:absolute;top:16%;left:50%;width:10px;height:10px;border-radius:50%;background:var(--c-gold);box-shadow:0 0 14px var(--c-gold);}
.hero__halo{position:absolute;inset:18%;border-radius:50%;background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.95),rgba(178,228,226,.45) 55%,transparent 72%);filter:blur(2px);}
.hero__logo{position:relative;width:min(64%,300px);filter:drop-shadow(0 22px 44px rgba(47,103,108,.32));}
/* Scroll cue — soft blended pale-green → white pill (Kate prefers gentle gradients to block colour) */
.hero__scroll{margin-top:2.4rem;font-family:var(--f-text);font-weight:600;color:var(--c-brand-deep);
  font-size:var(--step-0);display:inline-flex;gap:.5em;align-items:center;letter-spacing:.02em;
  padding:.5em 1.1em;border-radius:var(--r-pill);
  background:linear-gradient(135deg,
    color-mix(in srgb,var(--c-green) 30%,#fff) 0%,
    color-mix(in srgb,var(--c-aqua) 16%,#fff) 48%,
    #ffffff 100%);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c-green) 28%,transparent),0 6px 16px -10px color-mix(in srgb,var(--c-green) 60%,transparent);}
.hero__scroll::after{content:"↓";font-size:1.05em;line-height:1;animation:scrollnudge 1.8s ease-in-out infinite;}
@keyframes scrollnudge{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
@media (prefers-reduced-motion:reduce){.hero__scroll::after{animation:none;}}
/* Apothecary "keep scrolling" cue — points down to the price list. */
.scroll-more{margin:2.6rem auto 0;text-align:center;display:flex;flex-direction:column;align-items:center;gap:.35em;
  font-family:var(--f-text);font-weight:600;font-size:var(--step-0);letter-spacing:.02em;color:var(--c-brand-deep);}
.scroll-more::after{content:"↓";font-size:1.3em;line-height:1;animation:scrollnudge 1.8s ease-in-out infinite;}
@media (prefers-reduced-motion:reduce){.scroll-more::after{animation:none;}}

/* ---- Inner page header ------------------------------------------ */
.page-head{position:relative;overflow:hidden;text-align:center;padding-block:clamp(3rem,8vw,5.5rem) clamp(2rem,5vw,3.4rem);}
.page-head__bg{position:absolute;inset:0;z-index:-2;
  background:
    radial-gradient(40% 70% at 12% 0%,rgba(63,192,180,.42),transparent 70%),
    radial-gradient(42% 72% at 88% 8%,rgba(95,155,223,.40),transparent 72%),
    radial-gradient(46% 64% at 60% 100%,rgba(63,192,180,.40),transparent 70%),
    radial-gradient(40% 60% at 30% 100%,rgba(92,193,137,.34),transparent 70%),
    linear-gradient(180deg,#eaf6f6,var(--c-bg));}
.page-head .blob{z-index:-1;}
.page-head__moons{width:120px;height:22px;color:var(--c-gold);opacity:.7;margin-bottom:.8rem;}
.page-head h1{font-size:var(--step-4);font-weight:400;color:var(--c-brand-deep);margin:.4rem 0 .6rem;}
.page-head h1 em{font-style:italic;color:var(--c-brand);}
.page-head__lede{font-size:var(--step-1);color:var(--c-ink-soft);max-width:46ch;margin-inline:auto;line-height:1.55;}

/* ---- Intro / lede band ------------------------------------------ */
.intro{position:relative;overflow:hidden;}
.intro__grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(2rem,5vw,5rem);align-items:start;}
.intro__heading{font-size:var(--step-3);font-weight:400;margin-bottom:0;}
.intro__heading em{font-style:italic;color:var(--c-brand);}
.intro__body{font-size:var(--step-1);color:var(--c-ink-soft);line-height:1.7;}
.intro__body p+p{margin-top:1rem;}
.intro__body p:first-of-type::first-letter{font-family:var(--f-display);font-size:3.4em;line-height:.8;float:left;margin:.06em .12em 0 0;color:var(--c-brand);font-style:italic;}
.intro__sprig{position:absolute;right:3%;top:8%;width:42px;color:var(--c-aqua);opacity:.5;}

/* ---- Offerings (editorial, numbered, alternating) --------------- */
.offerings{position:relative;overflow:hidden;
  background:
    radial-gradient(50% 60% at 0% 0%,rgba(63,192,180,.18),transparent 70%),
    radial-gradient(50% 60% at 100% 30%,rgba(95,155,223,.15),transparent 72%),
    radial-gradient(60% 60% at 80% 100%,rgba(92,193,137,.16),transparent 70%),
    linear-gradient(180deg,#eef6f6,#eaf4f1);}
.offer-list{display:flex;flex-direction:column;gap:clamp(1.4rem,3vw,2.4rem);}
.offer{position:relative;display:grid;grid-template-columns:auto 1fr;gap:clamp(1.4rem,3vw,2.6rem);align-items:start;
  background:var(--c-surface);border-radius:var(--r-l);padding:clamp(1.6rem,3vw,2.6rem);
  box-shadow:var(--shadow-soft);overflow:hidden;transition:transform var(--dur) var(--ease-out-soft),box-shadow var(--dur) var(--ease-out-soft);}
/* All cards read left-to-right, left-justified (Kate: alternating sides looked messy) */
.offer:nth-child(odd){border-top-left-radius:70px;}
.offer:nth-child(even){border-bottom-right-radius:70px;}
/* When an image is added it fills the space to the side of the text */
.offer--media{grid-template-columns:auto 1fr clamp(200px,30%,330px);}
.offer__media{align-self:stretch;border-radius:var(--r-m);overflow:hidden;min-height:220px;
  background:color-mix(in srgb,var(--accent) 10%,var(--c-surface));}
.offer__media img{width:100%;height:100%;object-fit:cover;display:block;}
.offer:hover{transform:translateY(-5px);box-shadow:var(--shadow-lift);}
/* turquoise-forward accent cycle — aqua · blue · teal · green (no dominant purple) */
.offer{--accent:var(--c-aqua);--accent-deep:var(--c-aqua-deep);}
.offer:nth-child(4n+2){--accent:var(--c-blue);--accent-deep:var(--c-blue-deep);}
.offer:nth-child(4n+3){--accent:var(--c-brand);--accent-deep:var(--c-brand-deep);}
.offer:nth-child(4n+4){--accent:var(--c-green);--accent-deep:var(--c-green-deep);}
/* Divine Feminine Community — pink, set per-card in the template */
.offer--dfc{--accent:var(--c-pink)!important;--accent-deep:var(--c-pink-deep)!important;}
.offer{border-left:4px solid var(--accent);}
.offer__num{position:relative;display:flex;flex-direction:column;align-items:center;gap:.8rem;min-width:88px;}
.offer__numtext{font-family:var(--f-display);font-style:italic;font-size:var(--step-4);line-height:1;
  color:transparent;-webkit-text-stroke:1.4px var(--accent);}
.offer__icon{width:56px;height:56px;display:grid;place-items:center;border-radius:50%;color:#fff;
  background:linear-gradient(135deg,var(--accent),var(--accent-deep));box-shadow:0 8px 20px -8px var(--accent);}
.offer__icon .icon{width:26px;height:26px;}
.offer__body-wrap h3{font-size:var(--step-2);color:var(--c-brand-deep);margin:0 0 .25rem;font-weight:500;}
.offer__summary{font-family:var(--f-display);font-style:italic;color:var(--accent-deep);margin-bottom:.7rem;font-size:var(--step-1);}
.offer__body{color:var(--c-ink-soft);line-height:1.65;}
.offer__price{margin-top:.8rem;font-weight:600;color:var(--accent-deep);}
.offer__link{display:inline-flex;gap:.4em;margin-top:1rem;font-weight:600;color:var(--accent-deep);}
.offer__link:hover{opacity:.75;}
@media (max-width:760px){
  .offer,.offer--media{grid-template-columns:auto 1fr;}
  .offer__media{grid-column:1 / -1;min-height:180px;margin-top:.4rem;}
}

/* ---- Quote band (nocturnal, constellation) ---------------------- */
.quoteband{position:relative;text-align:center;color:#f3f1fb;overflow:hidden;padding-block:clamp(3.4rem,7vw,5.75rem);
  background:radial-gradient(120% 130% at 20% 0%,#3a5fb0,transparent 60%),
    radial-gradient(120% 130% at 90% 100%,#5b3f9c,transparent 60%),
    linear-gradient(135deg,#2a3f8a,var(--c-night) 70%);}
.quoteband::before{content:"";position:absolute;inset:0;opacity:.5;pointer-events:none;
  background:radial-gradient(40% 60% at 14% 20%,rgba(95,196,180,.5),transparent 70%),radial-gradient(40% 60% at 86% 84%,rgba(154,127,209,.5),transparent 70%);}
.quoteband__stars{position:absolute;inset:0;color:var(--c-gold);opacity:.55;}
.quoteband__star{position:absolute;width:14px;height:14px;}
.quoteband__q{position:relative;font-family:var(--f-display);font-style:italic;font-weight:400;font-size:var(--step-4);line-height:1.18;max-width:22ch;margin-inline:auto;}
.quoteband__mark{position:relative;display:block;font-size:var(--step-0);letter-spacing:.18em;text-transform:uppercase;opacity:.8;margin-top:1.4rem;color:var(--c-gold);}

/* ---- Events ----------------------------------------------------- */
.event-list{display:flex;flex-direction:column;gap:1.2rem;}
.event{display:grid;grid-template-columns:auto 1fr auto;gap:1.7rem;align-items:center;background:var(--c-surface);border-radius:var(--r-l);padding:1.6rem 1.9rem;box-shadow:var(--shadow-soft);transition:transform var(--dur) var(--ease-out-soft);}
.event:hover{transform:translateY(-3px);}
.event__date{display:grid;place-items:center;width:84px;height:84px;border-radius:22px;color:#fff;text-align:center;box-shadow:0 10px 22px -10px var(--c-blue);
  background:linear-gradient(135deg,var(--c-blue),var(--c-purple));}
.event:nth-child(3n+2) .event__date{background:linear-gradient(135deg,var(--c-aqua),var(--c-blue));box-shadow:0 10px 22px -10px var(--c-aqua);}
.event:nth-child(3n+3) .event__date{background:linear-gradient(135deg,var(--c-green),var(--c-aqua));box-shadow:0 10px 22px -10px var(--c-green);}
.event__day{font-family:var(--f-display);font-size:var(--step-3);line-height:1;}
.event__mon{font-size:var(--step--1);text-transform:uppercase;letter-spacing:.12em;}
.event__date--tbc{font-family:var(--f-display);font-style:italic;font-size:var(--step-0);}
.event__date--monthly{font-family:var(--f-display);font-style:italic;font-size:var(--step-0);letter-spacing:.02em;}
.event__body h3{font-size:var(--step-2);margin:0 0 .25rem;font-weight:500;}
.event__meta{color:var(--c-ink-soft);font-size:var(--step--1);margin-bottom:.4rem;}
.event__meta span+span::before{content:"✦";margin:0 .5em;color:var(--c-gold);font-size:.7em;}
.event__desc{color:var(--c-ink-soft);line-height:1.55;}
.event__dates{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;margin-bottom:.6rem;}
.event__dates-label{font-size:var(--step--1);color:var(--c-brand-deep);font-weight:600;margin-right:.15rem;}
.event__datechip{font-size:var(--step--1);background:var(--c-mist);color:var(--c-brand-deep);border:1px solid var(--c-line);border-radius:var(--r-pill);padding:.18em .7em;white-space:nowrap;}
.event__cta{white-space:nowrap;}
/* show promo flyers whole (portrait or landscape) instead of cropping to a band */
.event__thumb{width:auto;max-width:min(100%,340px);height:auto;max-height:360px;border-radius:var(--r-m);object-fit:contain;margin-bottom:1rem;border:1px solid var(--c-line);background:var(--c-surface);}
.empty-note{font-family:var(--f-display);font-style:italic;font-size:var(--step-2);color:var(--c-ink-soft);background:var(--c-mist);border-radius:var(--r-l);padding:3rem;text-align:center;}

/* ---- Apothecary ------------------------------------------------- */
.apoth-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(1.4rem,3vw,2.4rem);}
.apoth{position:relative;background:var(--c-surface);border-radius:var(--r-l);overflow:hidden;box-shadow:var(--shadow-soft);display:flex;flex-direction:column;transition:transform var(--dur) var(--ease-out-soft),box-shadow var(--dur) var(--ease-out-soft);}
.apoth:hover{transform:translateY(-6px);box-shadow:var(--shadow-lift);}
.apoth{--accent:var(--c-aqua);}
.apoth:nth-child(4n+2){--accent:var(--c-blue);}
.apoth:nth-child(4n+3){--accent:var(--c-brand);}
.apoth:nth-child(4n+4){--accent:var(--c-green);}
.apoth__media{position:relative;aspect-ratio:4/3;display:grid;place-items:center;color:#fff;overflow:hidden;
  background:linear-gradient(150deg,color-mix(in srgb,var(--accent) 70%,#fff),color-mix(in srgb,var(--accent) 95%,#1b2a4a));}
.apoth__media::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 55% at 28% 18%,rgba(255,255,255,.4),transparent 70%);}
.apoth__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.apoth__media .icon{width:54px;height:54px;opacity:.9;position:relative;}
.apoth__body{padding:1.6rem 1.7rem 1.9rem;display:flex;flex-direction:column;gap:.4rem;flex:1;border-top:3px solid var(--accent);}
.apoth__cat{font-family:var(--f-display);font-style:italic;color:var(--accent);}
/* one header only — the product name, in the accent colour (Kate's request) */
.apoth__body h3{font-size:var(--step-2);color:var(--accent);margin:0;font-weight:500;}
.apoth__desc{color:var(--c-ink-soft);line-height:1.55;flex:1;}
.apoth__price{font-weight:600;color:var(--c-brand-deep);}

/* ---- About ------------------------------------------------------ */
.about__grid{display:grid;grid-template-columns:1fr 1.18fr;gap:clamp(2rem,5vw,5rem);align-items:center;}
.about__portrait{position:relative;width:100%;max-width:440px;justify-self:center;}
.about__portrait::before{content:"";position:absolute;inset:-12px;border:1px solid var(--c-gold);border-radius:26px;opacity:.5;}
.about__portrait img{position:relative;width:100%;height:auto;display:block;border-radius:18px;box-shadow:var(--shadow-lift);}
.about__portrait--placeholder{position:relative;aspect-ratio:4/5;border-radius:160px 160px 24px 24px;background:radial-gradient(circle at 50% 32%,#eef6f3,#dde9ee);display:grid;place-items:center;box-shadow:var(--shadow-soft);}
.about__portrait--placeholder .brand__mark{width:55%;opacity:.6;}
/* when no photo is set, the logo sits in a round medallion that suits its shape
   (the tall arched portrait frame is for an actual photo only) */
.about__portrait--logo{max-width:340px;margin-inline:auto;}
.about__portrait--logo::before{display:none;}
.about__portrait--logo .about__portrait--placeholder{aspect-ratio:1/1;border-radius:50%;
  background:radial-gradient(circle at 50% 38%,#eef6f3,#dbe8ec);border:1px solid color-mix(in srgb,var(--c-gold) 40%,#fff);}
.about__portrait--logo .brand__mark{width:62%;opacity:.78;}
.about__body{font-size:var(--step-1);color:var(--c-ink-soft);line-height:1.75;}
.about__body h2{font-size:var(--step-3);font-weight:400;color:var(--c-brand-deep);margin-bottom:1rem;}
.about__body h2 em{font-style:italic;color:var(--c-brand);}
.about__body p+p{margin-top:1rem;}
.philosophy{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:var(--sp-xl);}
.phil{position:relative;padding:1.8rem 1.8rem 1.8rem 2rem;background:var(--c-surface);border-radius:var(--r-l);box-shadow:var(--shadow-soft);border-top:3px solid var(--c-aqua);}
.phil:nth-child(2){border-top-color:var(--c-purple);}
.phil:nth-child(3){border-top-color:var(--c-blue);}
.phil__no{font-family:var(--f-display);font-style:italic;color:transparent;-webkit-text-stroke:1px var(--c-aqua);font-size:var(--step-2);}
.phil:nth-child(2) .phil__no{-webkit-text-stroke-color:var(--c-purple);}
.phil:nth-child(3) .phil__no{-webkit-text-stroke-color:var(--c-blue);}
.phil h3{font-size:var(--step-1);margin:.3rem 0 .4rem;font-weight:500;}
.phil p{color:var(--c-ink-soft);line-height:1.6;}

/* ---- CTA strip -------------------------------------------------- */
.cta-strip{text-align:center;position:relative;overflow:hidden;}
.cta-strip__card{position:relative;background:radial-gradient(120% 130% at 50% 0%,#eef6f3,#dcecec);border-radius:var(--r-l);padding:clamp(2.8rem,7vw,5rem);box-shadow:var(--shadow-soft);overflow:hidden;}
.cta-strip__card .blob{z-index:0;opacity:.4;}
.cta-strip h2{position:relative;font-size:var(--step-4);font-weight:400;font-style:italic;color:var(--c-brand-deep);margin:0 0 .6rem;z-index:1;}
.cta-strip p{position:relative;color:var(--c-ink-soft);font-size:var(--step-1);max-width:42ch;margin:0 auto 1.7rem;z-index:1;}
/* Rich-text body inside a closing panel: centre the whole block (the .rich-text p
   rule resets the auto side-margins, which left the constrained text pushed left). */
.cta-strip .rich-text{position:relative;z-index:1;max-width:42ch;margin:0 auto 1.7rem;color:var(--c-ink-soft);font-size:var(--step-1);}
.cta-strip .rich-text p{margin-left:auto;margin-right:auto;}
.cta-strip .btn{position:relative;z-index:1;}

/* ---- Contact ---------------------------------------------------- */
.contact__grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,5vw,4.5rem);align-items:start;}
.contact__aside{font-size:var(--step-0);color:var(--c-ink-soft);line-height:1.7;}
.contact__aside .eyebrow{display:inline-flex;margin-bottom:.5rem;}
.contact__detail{display:flex;gap:.6rem;align-items:center;margin-top:1rem;font-weight:500;color:var(--c-brand-deep);}
.contact__detail .icon{width:20px;height:20px;color:var(--c-brand);}
.form{display:grid;gap:1.1rem;background:var(--c-surface);border-radius:var(--r-l);padding:clamp(1.7rem,4vw,2.6rem);box-shadow:var(--shadow-soft);}
.field{display:grid;gap:.4rem;}
.field label{font-weight:600;font-size:var(--step--1);color:var(--c-brand-deep);}
.field input,.field textarea{font-family:var(--f-text);font-size:var(--step-0);color:var(--c-ink);background:var(--c-bg);border:1.5px solid var(--c-line);border-radius:var(--r-m);padding:.85rem 1rem;transition:border-color var(--dur-fast) ease,box-shadow var(--dur-fast) ease;}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--c-brand);box-shadow:0 0 0 4px rgba(79,157,151,.14);}
.field--hp{position:absolute;left:-9999px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem;}

/* ---- Flash / cookie / preloader --------------------------------- */
.flash-wrap{width:min(100% - 2.4rem,var(--maxw));margin:1rem auto 0;display:grid;gap:.5rem;}
.flash{padding:.9rem 1.2rem;border-radius:var(--r-m);font-weight:500;}
.flash--success{background:#e2f2ed;color:#2a6a60;border:1px solid #bce0d6;}
.flash--error{background:#f7e8e9;color:#a1454b;border:1px solid #ebcacc;}
.cookie{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:var(--z-toast);max-width:30rem;background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-l);padding:1.2rem 1.4rem;box-shadow:var(--shadow-lift);display:grid;gap:.8rem;}
.cookie[hidden]{display:none;}
.cookie p{font-size:var(--step--1);color:var(--c-ink-soft);line-height:1.5;}
.cookie__actions{display:flex;gap:.6rem;justify-content:flex-end;}
.preloader{position:fixed;inset:0;z-index:var(--z-overlay);display:grid;place-items:center;background:linear-gradient(160deg,#e9f4f2,#dde9ec);}
.preloader__mark{font-size:2.4rem;color:var(--c-gold);animation:pulse 1.6s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:.4;transform:scale(.9)}50%{opacity:1;transform:scale(1.08)}}
html.is-loaded .preloader{opacity:0;visibility:hidden;}

/* ---- Legal / prose ---------------------------------------------- */
.legal{padding-block:clamp(2.5rem,6vw,4.5rem);}
.legal__body{max-width:var(--maxw-prose);margin-inline:auto;color:var(--c-ink-soft);line-height:1.75;}
.legal__body h2{font-size:var(--step-2);color:var(--c-brand-deep);margin:2rem 0 .6rem;font-weight:500;}
.legal__body h3{font-size:var(--step-1);color:var(--c-brand-deep);margin:1.4rem 0 .4rem;}
.legal__body p,.legal__body li{margin-bottom:.7rem;}
.legal__body ul{padding-left:1.2rem;}
.legal__body a{color:var(--c-brand);text-decoration:underline;}
.legal__letterhead{display:flex;justify-content:space-between;align-items:flex-start;gap:1.2rem;margin-bottom:1.6rem;}
.legal__doctitle{font-family:var(--f-display);font-size:var(--step-1);color:var(--c-brand-deep);margin-bottom:.2rem;}
.legal__updated{font-size:.9rem;opacity:.75;margin-bottom:0;}
.legal__logo{width:clamp(72px,12vw,110px);height:auto;flex:none;}

/* ---- Footer ----------------------------------------------------- */
/* Softer, lighter footer (Kate): green/blue wash, dark text, black logo kept as-is */
.site-footer{position:relative;background:linear-gradient(180deg,#dcefe9,#cfe6e7);color:var(--c-ink);overflow:visible;}
.site-footer__wave{position:absolute;left:0;right:0;top:0;transform:translateY(-99%);
  height:clamp(46px,7vw,92px);line-height:0;pointer-events:none;}
.site-footer__wave svg{width:100%;height:100%;display:block;}
.ftwave--a{fill:var(--c-aqua);opacity:.45;}
.ftwave--b{fill:var(--c-blue);opacity:.4;}
.ftwave--c{fill:#dcefe9;}
.site-footer::before{content:"";position:absolute;inset:0;opacity:.5;pointer-events:none;background:radial-gradient(40% 60% at 12% 10%,rgba(63,192,180,.18),transparent 70%),radial-gradient(40% 60% at 88% 30%,rgba(95,155,223,.16),transparent 72%);}
.site-footer__inner{position:relative;width:min(100% - 2.4rem,var(--maxw));margin-inline:auto;display:grid;grid-template-columns:1.6fr 1.1fr 1fr 1fr 1fr;gap:2rem;padding-block:clamp(3rem,6vw,4.8rem);}
.site-footer__mark{width:84px;opacity:1;margin-bottom:.8rem;}
.site-footer__tag{font-family:var(--f-display);font-style:italic;font-size:var(--step-1);color:var(--c-brand-deep);}
.site-footer__by{color:var(--c-ink-soft);margin-top:.5rem;line-height:1.6;font-size:var(--step--1);max-width:32ch;}
.site-footer__col h4{font-family:var(--f-text);font-weight:600;font-size:var(--step--1);text-transform:uppercase;letter-spacing:.14em;color:var(--c-brand-deep);margin-bottom:1rem;}
.site-footer__col a{display:block;color:var(--c-ink-soft);padding:.28rem 0;transition:color var(--dur-fast) ease;}
.site-footer__col a:hover{color:var(--c-brand-deep);}
.site-footer__social{margin-top:.6rem;display:flex;gap:1rem;}
.site-footer__base{position:relative;border-top:1px solid rgba(37,107,120,.2);width:min(100% - 2.4rem,var(--maxw));margin-inline:auto;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-block:1.3rem;font-size:var(--step--1);color:var(--c-ink-soft);}
.site-footer__base a{color:var(--c-brand-deep);text-decoration:underline;}

/* ---- Responsive ------------------------------------------------- */
/* full nav (now includes the long "Divine Feminine Community" link) folds to the
   hamburger earlier so it never overflows the bar on small laptops/tablets */
@media (max-width:1024px){
  .nav{display:none;}
  .nav-toggle{display:flex;}
}
@media (max-width:880px){
  .hero__inner{grid-template-columns:1fr;text-align:center;}
  .hero__art{order:-1;max-width:340px;margin-inline:auto;}
  .hero__lede{margin-inline:auto;}
  .hero__actions,.hero__moons{margin-inline:auto;}
  .intro__grid,.about__grid,.contact__grid{grid-template-columns:1fr;}
  .offer,.offer:nth-child(even){grid-template-columns:auto 1fr;}
  .offer:nth-child(even) .offer__num{order:0;}
  .philosophy{grid-template-columns:1fr;}
  .event{grid-template-columns:auto 1fr;}
  .event__cta{grid-column:1/-1;}
  .site-footer__inner{grid-template-columns:1fr 1fr;}
}
@media (max-width:520px){
  .field-row{grid-template-columns:1fr;}
  .hero__title{font-size:var(--step-4);}
  .offer__num{min-width:64px;}
  .intro__body p:first-of-type::first-letter{font-size:2.8em;}
  /* compact footer: brand on top, link columns side-by-side (left/right) */
  .site-footer__inner{grid-template-columns:1fr 1fr;gap:1.1rem 1.4rem;padding-block:2.2rem;}
  .site-footer__brand{grid-column:1 / -1;margin-bottom:.2rem;}
  .site-footer__mark{width:48px;}
  .site-footer__col h4{margin-bottom:.5rem;}
  .site-footer__col a{padding:.2rem 0;}
  .site-footer__base{flex-direction:column;align-items:flex-start;gap:.4rem;padding-block:1rem;}
  .site-footer__wave{height:38px;}
}
@media (prefers-reduced-motion:reduce){
  .hero__mote,.hero__aurora span,.hero__orbit--2,.preloader__mark{animation:none;}
}

/* ============================================================
   Gentle ambient animation — slow, calming, never flashy.
   All disabled under prefers-reduced-motion (block at the end).
   ============================================================ */
@keyframes floaty{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-12px) rotate(-1.2deg)}}
@keyframes breathe{0%,100%{opacity:.8;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}
@keyframes twinkle{0%,100%{opacity:.25;transform:scale(.7)}50%{opacity:1;transform:scale(1.1)}}
@keyframes sway{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
@keyframes hue-drift{0%,100%{filter:hue-rotate(0deg)}50%{filter:hue-rotate(-12deg)}}
@keyframes scrollcue{0%{transform:scaleX(0);transform-origin:left}50%{transform:scaleX(1);transform-origin:left}50.1%{transform-origin:right}100%{transform:scaleX(0);transform-origin:right}}

/* hero mark gently floats; halo breathes */
.hero__logo{animation:floaty 8s ease-in-out infinite;}
.hero__halo{animation:breathe 6s ease-in-out infinite;}
.hero__art{will-change:transform;}
.intro__sprig{transform-origin:bottom center;animation:sway 9s ease-in-out infinite;}

/* eyebrow star + quote stars twinkle on their own rhythms */
.eyebrow::before{animation:twinkle 5s ease-in-out infinite;}
.quoteband__star{animation:twinkle 3.6s ease-in-out infinite;}
.quoteband__star:nth-child(2){animation-duration:4.4s;animation-delay:.6s;}
.quoteband__star:nth-child(3){animation-duration:5.2s;animation-delay:1.1s;}
.quoteband__star:nth-child(4){animation-duration:4s;animation-delay:1.7s;}
.quoteband{animation:hue-drift 16s ease-in-out infinite;}

/* light sheen sweeps across buttons on hover */
.btn{overflow:hidden;}
.btn::before{content:"";position:absolute;top:0;left:-60%;width:45%;height:100%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.4),transparent);
  transform:skewX(-18deg);transition:left .7s var(--ease-out-soft);}
.btn:hover::before{left:130%;}

/* offering cards: number & icon lift on hover, accent glow */
.offer__icon{transition:transform var(--dur) var(--ease-out-soft);}
.offer:hover .offer__icon{transform:translateY(-4px) scale(1.06);}
.offer__numtext{transition:opacity var(--dur) ease;}
.offer:hover .offer__numtext{opacity:.6;}

/* apothecary + event cards: image breathes subtly on hover */
.apoth__media img,.apoth__media .icon{transition:transform var(--dur-slow) var(--ease-out-soft);}
.apoth:hover .apoth__media img,.apoth:hover .apoth__media .icon{transform:scale(1.05);}

/* nav link CTA + brand mark micro-interactions */
.brand__mark{transition:transform var(--dur) var(--ease-out-soft);}
.brand:hover .brand__mark{transform:rotate(-8deg);}

@media (prefers-reduced-motion:reduce){
  .hero__logo,.hero__halo,.intro__sprig,.eyebrow::before,.quoteband__star,
  .quoteband,.hero__scroll::after{animation:none!important;}
  .btn::before{display:none;}
}

/* ---- Staggered reveal (CSS-driven via .is-in; JS just toggles the class) -- */
[data-reveal-stagger] > *{opacity:0;transform:translateY(20px);
  transition:opacity .6s var(--ease-out-soft),transform .6s var(--ease-out-soft);}
[data-reveal-stagger].is-in > *{opacity:1;transform:none;}
[data-reveal-stagger].is-in > *:nth-child(2){transition-delay:.08s}
[data-reveal-stagger].is-in > *:nth-child(3){transition-delay:.16s}
[data-reveal-stagger].is-in > *:nth-child(4){transition-delay:.24s}
[data-reveal-stagger].is-in > *:nth-child(5){transition-delay:.32s}
[data-reveal-stagger].is-in > *:nth-child(6){transition-delay:.40s}
.no-js [data-reveal-stagger] > *{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){[data-reveal-stagger] > *{opacity:1!important;transform:none!important;}}

/* ---- Hero waves — layered swell: rolls ALONG and bobs up & down -- */
.hero__waves{position:absolute;inset:0;z-index:-1;pointer-events:none;}
.hero__waves svg{width:100%;height:100%;display:block;}
.wbob,.wdrift{transform-box:view-box;will-change:transform;}
/* Calmed per Kate (movement was distracting / accessibility): NO sideways drift,
   only a very small, slow vertical bob. Static under reduced-motion. */
@keyframes swell{0%,100%{transform:translateY(-7px)}50%{transform:translateY(7px)}}
.wbob--a{animation:swell 22s ease-in-out infinite;}
.wbob--b{animation:swell 26s ease-in-out infinite;animation-delay:-6s;}
.wbob--c{animation:swell 24s ease-in-out infinite;animation-delay:-10s;}
.wbob--d{animation:swell 28s ease-in-out infinite;animation-delay:-4s;}
.wdrift--a{fill:var(--c-sky);opacity:.28;}
.wdrift--b{fill:var(--c-blue);opacity:.30;}
.wdrift--c{fill:var(--c-aqua);opacity:.34;}
.wdrift--d{fill:var(--c-green);opacity:.30;}
@media (prefers-reduced-motion:reduce){.wbob--a,.wbob--b,.wbob--c,.wbob--d{animation:none;}}

/* ---- Soft light quote (replaces the heavy dark band) ------------- */
.quote-soft{text-align:center;position:relative;}
.quote-soft__star{display:block;color:var(--c-gold);font-size:var(--step-1);margin-bottom:.4rem;}
.quote-soft__q{font-family:var(--f-display);font-style:italic;font-weight:400;
  font-size:var(--step-4);line-height:1.25;color:var(--c-brand-deep);max-width:18ch;margin:0 auto;}
.quote-soft__mark{display:block;margin-top:1.1rem;font-size:var(--step--1);letter-spacing:.2em;
  text-transform:uppercase;color:var(--c-aqua-deep);}

/* ============================================================
   New pages — Testimonials · Certificates · Nails · Crafting · Community
   ============================================================ */

/* ---- Testimonials --------------------------------------------------- */
.testi-grid{columns:3 300px;column-gap:clamp(1.2rem,2.4vw,2rem);}
.testi{break-inside:avoid;margin-bottom:clamp(1.2rem,2.4vw,2rem);background:var(--c-surface);
  border-radius:var(--r-l);padding:1.7rem 1.8rem;box-shadow:var(--shadow-soft);border-top:3px solid var(--c-brand);}
.testi__cat{display:inline-block;margin-bottom:.6rem;padding:.2em .8em;border-radius:var(--r-pill);
  font-size:var(--step--1);font-weight:600;color:#fff;letter-spacing:.01em;}
.testi__media{display:block;width:100%;height:auto;border-radius:var(--r-m);margin:0 0 .8rem;}
.testi__mark{font-family:var(--f-display);font-style:italic;font-size:var(--step-3);line-height:0;color:var(--c-brand);opacity:.5;}
.testi__quote{color:var(--c-ink);line-height:1.6;margin:.4rem 0 1rem;font-size:var(--step-0);}
.testi__author{font-weight:600;color:var(--c-brand-deep);}
.testi__context{display:block;font-family:var(--f-display);font-style:italic;color:var(--c-ink-soft);font-size:var(--step--1);}

/* ---- Certificates / qualifications --------------------------------- */
.cert-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem;}
.cert{display:flex;align-items:center;gap:1rem;background:var(--c-surface);border-radius:var(--r-m);
  padding:1.1rem 1.3rem;box-shadow:var(--shadow-soft);border-left:3px solid var(--c-gold);}
.cert__icon{width:34px;height:34px;flex:none;color:var(--c-brand);}
.cert__title{font-weight:600;color:var(--c-brand-deep);line-height:1.3;}
.cert__date{display:block;font-family:var(--f-display);font-style:italic;color:var(--c-ink-soft);font-size:var(--step--1);}
/* certificates with an uploaded image — show the whole scan, click to enlarge */
.cert--img{flex-direction:column;align-items:stretch;gap:.7rem;text-align:center;}
.cert__media{display:block;border-radius:10px;overflow:hidden;border:1px solid var(--c-line);background:#fff;}
.cert__media img{width:100%;height:210px;object-fit:contain;display:block;transition:transform var(--dur) var(--ease-out-soft);}
.cert__media:hover img{transform:scale(1.03);}

/* ---- Nails price list ---------------------------------------------- */
.pricelist{max-width:40rem;margin-inline:auto;background:var(--c-surface);border-radius:var(--r-l);
  padding:clamp(1.4rem,3vw,2.4rem);box-shadow:var(--shadow-soft);}
.pricerow{display:flex;justify-content:space-between;gap:1.2rem;align-items:baseline;
  padding:.8rem 0;border-bottom:1px dashed var(--c-line);}
.pricerow:last-child{border-bottom:0;}
.pricerow__name{color:var(--c-ink);}
.pricerow__price{font-weight:600;color:var(--c-brand-deep);white-space:nowrap;font-family:var(--f-display);}
.price-note{max-width:40rem;margin:1.2rem auto 0;text-align:center;color:var(--c-ink-soft);font-size:var(--step--1);}

/* Apothecary blends — the detailed price list, grouped by range */
.blendgroup{max-width:46rem;margin:0 auto clamp(1.6rem,3.5vw,2.6rem);}
.blendgroup__title{font-family:var(--f-display);font-style:italic;font-size:var(--step-2);color:var(--c-brand-deep);
  text-align:center;margin:0 0 1rem;}
.blendlist{background:var(--c-surface);border-radius:var(--r-l);box-shadow:var(--shadow-soft);
  padding:clamp(1.2rem,3vw,2rem);}
.blend{padding:1.1rem 0;border-bottom:1px dashed var(--c-line);}
.blend:first-child{padding-top:0;}
.blend:last-child{border-bottom:0;padding-bottom:0;}
.blend__head{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;}
.blend__name{font-size:var(--step-1);color:var(--c-ink);}
.blend__meta{font-weight:600;color:var(--c-brand-deep);white-space:nowrap;font-family:var(--f-display);}
.blend__oils{font-size:var(--step--1);color:var(--c-aqua-deep);margin-top:.2rem;font-style:italic;}
.blend__desc{color:var(--c-ink-soft);line-height:1.55;margin-top:.4rem;}

/* ---- Community hosts ----------------------------------------------- */
.hosts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.2rem;}
.host{background:var(--c-surface);border-radius:var(--r-l);padding:1.4rem 1.5rem;box-shadow:var(--shadow-soft);border-top:3px solid var(--c-brand);display:flex;flex-direction:column;}
.host__media{aspect-ratio:1/1;margin-bottom:1rem;border-radius:var(--r-m);overflow:hidden;background:#fbeef5;display:grid;place-items:center;}
.host__media img{width:100%;height:100%;}
.host__media--cover img{object-fit:cover;}
.host__media--contain img{object-fit:contain;}
.host__name{font-family:var(--f-display);font-size:var(--step-1);color:var(--c-brand-deep);}
.host__when{color:var(--c-ink-soft);font-size:var(--step--1);margin-top:.3rem;}
.host__note{font-style:italic;color:var(--c-brand);font-size:var(--step--1);margin-top:.3rem;}
.membership{background:linear-gradient(135deg,color-mix(in srgb,var(--c-brand) 14%,#fff),color-mix(in srgb,var(--c-accent) 16%,#fff));
  border-radius:var(--r-l);padding:clamp(1.6rem,3.5vw,2.6rem);box-shadow:var(--shadow-soft);max-width:46rem;}
.membership h3{font-size:var(--step-2);color:var(--c-brand-deep);margin-bottom:.5rem;font-weight:500;}
.membership p{color:var(--c-ink-soft);line-height:1.7;}

/* ---- Distinct theme: Divine Feminine Community (pink) -------------- */
body.theme-dfc{--c-brand:#cf6aa0;--c-brand-deep:#a8497f;--c-accent:#e394bb;--c-gold:#a8497f;}
body.theme-dfc .page-head__bg{background:
  radial-gradient(40% 70% at 12% 0%,rgba(227,148,187,.5),transparent 70%),
  radial-gradient(42% 72% at 88% 8%,rgba(207,106,160,.42),transparent 72%),
  radial-gradient(46% 64% at 60% 100%,rgba(244,200,222,.5),transparent 70%),
  linear-gradient(180deg,#fbeef5,var(--c-bg));}
body.theme-dfc .btn{background:linear-gradient(118deg,var(--c-accent),var(--c-brand) 60%,var(--c-brand-deep));}
/* DFC: her own watercolour roses behind the hero (white drops out via blend) */
body.theme-dfc .page-head::before,
body.theme-dfc .page-head::after{content:"";position:absolute;bottom:0;z-index:-1;
  width:min(34vw,260px);height:min(46vw,360px);pointer-events:none;
  background:url("../img/dfc-rose.jpg") no-repeat bottom center / contain;
  mix-blend-mode:multiply;opacity:.85;}
body.theme-dfc .page-head::before{right:max(3%,calc(50% - 560px));}
body.theme-dfc .page-head::after{left:max(3%,calc(50% - 560px));transform:scaleX(-1);opacity:.6;}
@media (max-width:760px){
  body.theme-dfc .page-head::before{opacity:.4;width:170px;height:230px;}
  body.theme-dfc .page-head::after{display:none;}
}
/* keep the page pink only — recolour the decorative blobs (no blue/purple) */
body.theme-dfc .blob--lilac{background:radial-gradient(circle,var(--c-pink),transparent 70%);opacity:.5;}
body.theme-dfc .blob--aqua{background:radial-gradient(circle,#f6cfe0,transparent 70%);opacity:.55;}
/* varied pink accents across the host cards */
body.theme-dfc .host:nth-child(4n+2){border-top-color:#d98cb8;}
body.theme-dfc .host:nth-child(4n+3){border-top-color:var(--c-pink-deep);}
body.theme-dfc .host:nth-child(4n+4){border-top-color:#eaa9c9;}

/* ---- Distinct theme: SensatioNails (pale blue, per Kate's request) -- */
body.theme-nails{--c-brand:#5491bf;--c-brand-deep:#356a96;--c-accent:#8cc1e3;--c-gold:#4a7ea3;}
body.theme-nails .page-head__bg{background:
  radial-gradient(40% 70% at 12% 0%,rgba(140,193,227,.5),transparent 70%),
  radial-gradient(42% 72% at 88% 8%,rgba(84,145,191,.38),transparent 72%),
  radial-gradient(46% 64% at 60% 100%,rgba(214,232,246,.6),transparent 70%),
  linear-gradient(180deg,#e9f3fb,var(--c-bg));}
body.theme-nails .btn{background:linear-gradient(118deg,var(--c-accent),var(--c-brand) 60%,var(--c-brand-deep));}
/* keep the page pale-blue — recolour the decorative hero blobs */
body.theme-nails .blob--lilac{background:radial-gradient(circle,#bfe0f3,transparent 70%);opacity:.5;}
body.theme-nails .blob--aqua{background:radial-gradient(circle,#9cc8e8,transparent 70%);opacity:.5;}
/* her SensatioNails wordmark — black art-nouveau script, white dropped out */
.nails-logo{display:block;margin:0 auto 1rem;width:min(78%,420px);height:auto;}
/* SensatioNails hero — flourish wraps around the heading (Kate ref 2026-06-24) */
body.theme-nails .page-head .container{position:relative;}
body.theme-nails .nails-logo{width:min(94%,560px);margin-bottom:0;position:relative;z-index:1;
  /* the script text sits ~57% across the image (flower fills the left quarter) —
     shift left so the TEXT is page-centred over the h1, flower hugs left (Kate 2026-07-10) */
  transform:translateX(-8%);}
body.theme-nails .page-head h1{position:relative;z-index:2;margin-top:clamp(-7rem,-12vw,-4rem);}

@media (max-width:640px){ .testi-grid{columns:1;} }
.about__links{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem;}
/* "More things to explore" hub — proper cards, not afterthought ghost buttons */
.explore-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.2rem;}
.explore-card{display:flex;flex-direction:column;gap:.45rem;background:var(--c-surface);border-radius:var(--r-l);
  padding:1.6rem 1.7rem;box-shadow:var(--shadow-soft);border-top:3px solid var(--c-brand);
  transition:transform var(--dur) var(--ease-out-soft),box-shadow var(--dur) var(--ease-out-soft);}
.explore-card:nth-child(4n+2){border-top-color:var(--c-blue);}
.explore-card:nth-child(4n+3){border-top-color:var(--c-green);}
.explore-card:nth-child(4n+4){border-top-color:var(--c-aqua-deep);}
.explore-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift);}
.explore-card__icon{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;
  background:linear-gradient(135deg,var(--c-aqua),var(--c-brand));color:#fff;margin-bottom:.3rem;}
.explore-card__icon .icon{width:22px;height:22px;}
.explore-card h3{font-size:var(--step-1);color:var(--c-brand-deep);margin:0;font-weight:500;}
.explore-card p{color:var(--c-ink-soft);font-size:var(--step--1);line-height:1.55;margin:0;flex:1;}
.explore-card__link{font-weight:600;color:var(--c-brand-deep);font-size:var(--step--1);margin-top:.5rem;}
.explore-card:hover .explore-card__link{opacity:.78;}

/* ── Rich text from the admin editor (real paragraphs + emphasis) ── */
.rich-text > :first-child{margin-top:0;}
.rich-text > :last-child{margin-bottom:0;}
.rich-text p{margin:0 0 1em;}
.rich-text ul,.rich-text ol{margin:0 0 1em 1.25em;padding:0;}
.rich-text li{margin:.25em 0;}
.rich-text a{color:var(--accent-deep,var(--c-brand-deep));text-decoration:underline;}
.rich-text strong,.rich-text b{font-weight:600;}

/* Image fit choice (admin: "show whole photo" vs "fill the frame") */
.apoth__media--contain img{object-fit:contain;padding:8px;}
.apoth__media--contain::after{opacity:.2;}
.apoth__media--cover img{object-fit:cover;}
