/* ==========================================================================
   Vibe Homeopathy — v4 "warm neutral"
   Warm neutrals, soft taupe darks, pops of olive-sage, powder blue and clay (butter only on the homepage photo).
   Colours are named by role (dark, accent, tint, pop) so the palette is easy to swap.
   Instrument Serif for headings, DM Sans for everything else.
   ========================================================================== */

:root {
  /* Darks: a soft warm taupe in the family of the logo colour */
  --dark: #5E5045;
  --dark-2: #6D5E52;
  --dark-deep: #463B33;
  /* Accent for italic words and links */
  --accent: #8C6650;
  --accent-deep: #6F4F3D;
  /* Tints */
  --tint: #BCD2EA;
  --tint-soft: #E1EAF3;
  /* Warm neutrals */
  --bg: #F5EFE7;
  --surface: #FCFAF7;
  --bone: #F9F4EE;        /* soft cream for cards on the page background */
  --sand: #EADFD2;
  --stone: #D7C3AE;
  /* Pops */
  --pop: #687852;          /* deep olive-sage: buttons, labels, numbers (cream text on top) */
  --pop-ink: #FCFAF7;      /* text on deep sage */
  --pop-light: #C2CCAA;    /* lighter sage: text and marks on the dark sections */
  --pop-soft: #D3DBC2;     /* sage wash: larger boxes and panels */
  --hero-accent: #F3DB97;  /* butter, used only over the homepage photo */
  --clay: #C77A52;
  /* Text */
  --ink: #2A1C16;
  --muted: #7B6A5F;
  --line: rgba(42, 28, 22, .12);
  --line-light: rgba(245, 239, 231, .18);

  --serif: 'Instrument Serif', 'Times New Roman', Georgia, serif;
  --sans: 'DM Sans', 'Helvetica Neue', Arial, sans-serif;

  --gutter: clamp(20px, 4vw, 64px);
  --max: 1380px;
  --r: 6px;
  --r-sm: 4px;
  --header-h: 114px;
  --section: clamp(72px, 8vw, 120px);
  --ease: cubic-bezier(.2, .7, .1, 1);
  /* One warm, soft film grade over every photo so they read as one set */
  --grade: sepia(.18) saturate(.88) contrast(.94) brightness(1.04);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; background: var(--dark-deep); }
body {
  font-family: var(--sans); font-size: 17px; line-height: 1.65; font-weight: 400;
  color: var(--ink); background: var(--bg);
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; }
img { object-fit: cover; }
main img, .citem__media img { filter: var(--grade); }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
input, select { font: inherit; color: inherit; }
::selection { background: var(--pop); color: var(--pop-ink); }
:focus-visible { outline: 2px solid var(--accent-deep); outline-offset: 3px; }

.wrap { max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.dark { background: var(--dark); color: var(--bg); }
.sand { background: var(--sand); }
.milk { background: var(--surface); }

/* ---------- Type ---------- */
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 400; line-height: 1; letter-spacing: -.01em; }
h1 em, h2 em, h3 em { font-style: italic; }
.display { font-size: clamp(3.2rem, 7vw, 7rem); line-height: .95; letter-spacing: -.015em; }
.h2 { font-size: clamp(2.4rem, 4vw, 3.8rem); line-height: 1; }
.h3 { font-size: clamp(1.8rem, 2.4vw, 2.4rem); }
.lead { font-size: clamp(1.05rem, 1.3vw, 1.2rem); line-height: 1.65; max-width: 36em; }
.muted { color: var(--muted); }
.dark .muted { color: rgba(245, 239, 231, .7); }
.small { font-size: 14px; }

.tag {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 12px; border-radius: 2px;
  font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; line-height: 1.2;
  background: var(--sand); color: var(--dark);
}
.tag::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .55; }
.tag--tint { background: var(--tint); }
.tag--pop { background: var(--pop); color: var(--pop-ink); }
.tag--glass { background: rgba(245, 239, 231, .16); color: var(--bg); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.tag--line { background: none; border: 1px solid currentColor; }
.tag--plain::before { display: none; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 15px 26px; border-radius: 2px;
  font-size: 12.5px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; line-height: 1;
  border: 1px solid transparent; white-space: nowrap;
  transition: background .4s var(--ease), color .4s var(--ease), border-color .4s var(--ease), transform .4s var(--ease);
}
.btn:hover { transform: none; }
.btn .arrow { transition: transform .4s var(--ease); }
.btn:hover .arrow { transform: translateX(4px); }
.btn--dark { background: var(--dark); color: var(--bg); }
.btn--dark:hover { background: var(--dark-deep); }
.btn--light { background: var(--bg); color: var(--dark); }
.btn--light:hover { background: var(--pop); color: var(--pop-ink); }
.btn--tint { background: var(--tint); color: var(--dark); }
.btn--tint:hover { background: #a9c5e4; }
.btn--pop { background: var(--pop); color: var(--pop-ink); }
.btn--pop:hover { background: #5A6947; }
.btn--line { border-color: currentColor; }
.btn--line:hover { background: var(--dark); color: var(--bg); border-color: var(--dark); }
.btn--line-light { border-color: rgba(245, 239, 231, .6); color: var(--bg); }
.btn--line-light:hover { background: var(--bg); color: var(--dark); }
.btn--sm { padding: 11px 16px; font-size: 11.5px; }
.btn--block { width: 100%; }

.link {
  display: inline-flex; align-items: center; gap: 8px; font-weight: 500; font-size: 15px;
  border-bottom: 1px solid currentColor; padding-bottom: 3px;
}
.link::after { content: "→"; transition: transform .4s var(--ease); }
.link:hover::after { transform: translateX(4px); }

/* ---------- Header ---------- */
.site-header { position: fixed; inset: 0 0 auto; z-index: 100; color: var(--dark); transition: background .5s var(--ease), color .5s var(--ease), box-shadow .5s var(--ease); }
.site-header[data-tone="light"] { color: var(--bg); }
.announce {
  height: 30px; display: flex; align-items: center; overflow: hidden; white-space: nowrap;
  background: var(--dark-deep); color: rgba(245, 239, 231, .78); font-size: 12.5px; letter-spacing: .01em;
}
.announce__track { display: flex; align-items: center; width: max-content; animation: ticker 70s linear infinite; }
.announce__track span { padding: 0 22px; }
.announce__track i { width: 4px; height: 4px; border-radius: 50%; background: var(--pop-light); opacity: .8; }
/* Pause on hover with a real mouse only (on phones a tap would leave it stuck paused). */
@media (hover: hover) and (pointer: fine) { .announce:hover .announce__track { animation-play-state: paused; } }
.header-inner { height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.site-header.is-scrolled { background: rgba(245, 239, 231, .88); color: var(--dark); backdrop-filter: blur(16px) saturate(1.3); -webkit-backdrop-filter: blur(16px) saturate(1.3); box-shadow: 0 1px 0 var(--line); }

.logo { display: inline-block; position: relative; line-height: 0; }
.logo__img { height: 64px; width: auto; display: block; transition: opacity .5s var(--ease), height .4s var(--ease); }
.logo__img--cream { position: absolute; left: 0; top: 0; opacity: 0; }
.site-header[data-tone="light"]:not(.is-scrolled) .logo__img--brown, .menu-open .logo__img--brown { opacity: 0; }
.site-header[data-tone="light"]:not(.is-scrolled) .logo__img--cream, .menu-open .logo__img--cream { opacity: 1; }

.nav { display: flex; gap: clamp(16px, 2.2vw, 34px); }
.nav a { font-size: 12.5px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; position: relative; padding: 6px 0; opacity: .88; transition: opacity .3s; }
.nav a:hover, .nav a[aria-current="page"] { opacity: 1; }
.nav a[aria-current="page"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 1px; background: currentColor; }
.header-actions { display: flex; align-items: center; gap: 12px; }
.cart-btn {
  display: inline-flex; align-items: center; gap: 8px; height: 46px; padding: 0 16px 0 14px; border-radius: 2px;
  border: 1px solid currentColor; font-size: 14px; font-weight: 500;
}
.cart-btn svg { width: 18px; height: 18px; }
.cart-btn__count { min-width: 20px; height: 20px; border-radius: 10px; display: inline-grid; place-items: center; font-size: 11.5px; background: var(--pop); color: var(--pop-ink); padding: 0 5px; }
.cart-btn__count.bump { animation: bump .6s var(--ease); }
@keyframes bump { 40% { transform: scale(1.4); background: var(--tint); } }
.header-actions .btn { height: 46px; padding: 0 22px; }
.site-header[data-tone="light"]:not(.is-scrolled) .header-actions .btn--dark { background: var(--bg); color: var(--dark); }
.menu-btn { display: none; width: 46px; height: 46px; border-radius: 50%; border: 1px solid currentColor; position: relative; }
.menu-btn span { position: absolute; left: 14px; right: 14px; height: 1.5px; background: currentColor; transition: transform .45s var(--ease); }
.menu-btn span:first-child { top: 19px; } .menu-btn span:last-child { top: 26px; }
.menu-open .menu-btn span:first-child { transform: translateY(3.5px) rotate(45deg); }
.menu-open .menu-btn span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
.mobile-menu {
  position: fixed; inset: 0; z-index: 90; background: var(--dark); color: var(--bg);
  padding: calc(var(--header-h) + 28px) var(--gutter) 36px; display: flex; flex-direction: column; justify-content: space-between;
  opacity: 0; visibility: hidden; transform: translateY(-12px); transition: all .5s var(--ease);
}
.menu-open .mobile-menu { opacity: 1; visibility: visible; transform: none; }
.menu-open .site-header { color: var(--bg); background: transparent !important; box-shadow: none !important; }
.mobile-menu nav a { display: block; font-family: var(--serif); font-size: clamp(2.4rem, 11vw, 3.4rem); line-height: 1.25; }

/* ---------- Reveal ---------- */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 1s var(--ease), transform 1s var(--ease); }
.reveal.in { opacity: 1; transform: none; }
.reveal[data-delay="1"] { transition-delay: .1s; } .reveal[data-delay="2"] { transition-delay: .2s; } .reveal[data-delay="3"] { transition-delay: .3s; }
.zoom-in img { transform: scale(1.08); transition: transform 1.8s var(--ease); }
.zoom-in.in img { transform: none; }
.shot .reveal { opacity: 1; transform: none; transition: none; }
.shot .zoom-in img { transform: none; transition: none; }
.shot *, .shot *::before, .shot *::after { animation-play-state: paused !important; }
.shot .site-header { position: absolute; }

/* ---------- Sections ---------- */
.section { padding: var(--section) 0; position: relative; }
.head { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; margin-bottom: clamp(40px, 5vw, 72px); flex-wrap: wrap; }
.head .tag { margin-bottom: 22px; }
.head p { max-width: 30em; }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: min(100vh, 940px); display: flex; align-items: flex-end; color: var(--bg); overflow: hidden; isolation: isolate; }
.hero__img { position: absolute; inset: 0; z-index: -2; }
.hero__img img { width: 100%; height: 100%; object-position: 50% 38%; }
.hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, rgba(46, 36, 29, .78) 0%, rgba(46, 36, 29, .45) 38%, rgba(46, 36, 29, 0) 70%),
    linear-gradient(0deg, rgba(46, 36, 29, .55) 0%, rgba(46, 36, 29, 0) 40%),
    linear-gradient(180deg, rgba(46, 36, 29, .5) 0%, rgba(46, 36, 29, 0) 24%);
}
.hero__inner { width: 100%; padding-top: calc(var(--header-h) + 60px); padding-bottom: clamp(48px, 6vw, 88px); display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; }
.hero__copy { max-width: 720px; }
.hero__copy .tag { margin-bottom: 26px; }
.hero__copy h1 em { color: var(--hero-accent); }
.hero__copy .lead { margin-top: 26px; color: rgba(245, 239, 231, .88); max-width: 32em; }
.hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
.hero__card {
  flex: none; width: 320px; padding: 22px; border-radius: var(--r-sm);
  background: rgba(245, 239, 231, .14); border: 1px solid rgba(245, 239, 231, .22);
  backdrop-filter: blur(18px) saturate(1.2); -webkit-backdrop-filter: blur(18px) saturate(1.2);
}
.hero__card p { font-size: 14px; color: rgba(245, 239, 231, .82); margin: 6px 0 16px; }
.hero__card h3 { font-size: 1.9rem; }
.hero__card .row { display: flex; align-items: center; justify-content: space-between; }
.hero__card .dot { width: 9px; height: 9px; border-radius: 50%; background: #8FD19E; box-shadow: 0 0 0 5px rgba(143, 209, 158, .22); }

/* ---------- Ticker ---------- */
.ticker { background: var(--dark); color: var(--bg); overflow: hidden; padding: 20px 0; }
.ticker__track { display: flex; width: max-content; animation: ticker 50s linear infinite; }
.ticker__track span { font-family: var(--serif); font-size: clamp(1.5rem, 2.2vw, 2rem); padding: 0 26px; white-space: nowrap; }
.ticker__track i { font-style: normal; color: var(--pop-light); align-self: center; }
.ticker__track i:nth-of-type(3n+2) { color: var(--tint); }
@keyframes ticker { to { transform: translateX(-50%); } }

/* ---------- Intro (Hey, I'm Leah) ---------- */
.intro { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(40px, 6vw, 96px); align-items: center; }
.intro__copy .h2 { margin: 22px 0 26px; }
.intro__copy p { max-width: 32em; }
.intro__copy p + p { margin-top: 16px; }
.intro__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 32px 0 36px; }
.intro__pics { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: end; max-width: 480px; justify-self: end; width: 100%; }
.pic { position: relative; border-radius: var(--r); overflow: hidden; background: var(--sand); }
.pic img { width: 100%; height: 100%; }
.pic--tall { aspect-ratio: 3 / 4.2; }
.pic--short { aspect-ratio: 3 / 3.6; }
.placeholder {
  display: grid; place-items: center; text-align: center; padding: 24px;
  background: linear-gradient(160deg, var(--stone), #c7ad94); color: var(--dark);
}
.placeholder svg { width: 40px; height: 40px; margin: 0 auto 12px; opacity: .7; }
.placeholder span { font-size: 14px; font-weight: 500; }
.pic__label { position: absolute; left: 14px; bottom: 14px; }

/* ---------- Who I support ---------- */
.who { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.who__card { position: relative; border-radius: var(--r); overflow: hidden; aspect-ratio: 3 / 4; color: var(--bg); display: flex; align-items: flex-end; isolation: isolate; }
.who__card img { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; transition: transform 1.2s var(--ease); }
.who__card:hover img { transform: scale(1.05); }
.who__card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(46, 36, 29, .78) 0%, rgba(46, 36, 29, .1) 55%, rgba(46, 36, 29, 0) 100%); }
.who__body { padding: 28px; }
.who__body h3 { font-size: 2.6rem; margin-bottom: 8px; }
.who__body p { font-size: 15px; color: rgba(245, 239, 231, .86); max-width: 24em; }
.who__arrow { position: absolute; top: 20px; right: 20px; width: 46px; height: 46px; border-radius: 50%; background: rgba(245, 239, 231, .9); color: var(--dark); display: grid; place-items: center; transform: rotate(-45deg); transition: transform .5s var(--ease), background .5s; }
.who__card:hover .who__arrow { transform: none; background: var(--pop); color: var(--pop-ink); }

/* ---------- Bento ---------- */
.bento { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: minmax(250px, auto); gap: 16px; }
.bento > * { border-radius: var(--r); overflow: hidden; position: relative; }
.bento__photo { grid-column: span 2; grid-row: span 2; }
.bento__photo img { width: 100%; height: 100%; position: absolute; inset: 0; }
.bento__photo .tag { position: absolute; left: 22px; bottom: 22px; background: rgba(46, 36, 29, .55); color: var(--bg) !important; }
.bento__card { padding: 30px; display: flex; flex-direction: column; justify-content: space-between; }
.bento__card h3 { font-size: 2.1rem; }
.bento__card p { font-size: 15px; }
.bento__card .big { font-family: var(--serif); font-size: 5.4rem; line-height: .85; }
.bento__card--dark { background: var(--dark); color: var(--bg); }
.bento__card--dark p { color: rgba(245, 239, 231, .75); }
.bento__card--tint { background: var(--tint); color: var(--dark); }
.bento__card--pop { background: var(--pop-soft); color: var(--dark); }
.bento__card--sand { background: var(--sand); }
.bento__card .tag { align-self: flex-start; }
.bento__card--photo { color: var(--bg); justify-content: flex-end; isolation: isolate; }
.bento__card--photo img { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; }
.bento__card--photo::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(46, 36, 29, .8), rgba(46, 36, 29, 0) 65%); }
.bento__card--photo p { color: rgba(245, 239, 231, .85); }
.discovery__copy > .tag { align-self: flex-start; }
.consult-note { margin-top: 16px; display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; padding: 18px 22px 18px 26px; border-radius: var(--r-sm); border: 1px solid var(--line-light); font-size: 15.5px; color: rgba(245, 239, 231, .8); }
.consult-note b { color: var(--bg); font-weight: 500; }

/* ---------- Products ---------- */
.products { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.prod { display: flex; flex-direction: column; border-radius: var(--r); overflow: hidden; background: var(--surface); transition: transform .6s var(--ease), box-shadow .6s var(--ease); }
.prod:hover { transform: translateY(-6px); box-shadow: 0 30px 60px -34px rgba(42, 28, 22, .45); }
.prod__media { position: relative; aspect-ratio: 1 / 1.05; overflow: hidden; background: var(--sand); }
.prod__media img { width: 100%; height: 100%; transition: transform 1.2s var(--ease); }
.prod:hover .prod__media img { transform: scale(1.05); }
.prod__media .tag { position: absolute; top: 18px; left: 18px; }
.prod__body { padding: 24px 26px 26px; display: flex; flex-direction: column; flex: 1; }
.prod__body h3 { font-size: 2.1rem; }
.prod__body p { color: var(--muted); font-size: 15px; margin: 8px 0 22px; flex: 1; }
.prod__foot { display: flex; align-items: center; justify-content: space-between; }
.price { font-size: 17px; font-weight: 500; }
.price small { font-weight: 400; color: var(--muted); margin-right: 4px; font-size: 14px; }
.prod--kit .prod__media { background: var(--pop-soft); display: grid; place-items: center; text-align: center; padding: 30px; }
.prod--kit .prod__media h4 { font-size: clamp(3rem, 4.6vw, 4.6rem); line-height: .9; }
.prod--kit .prod__media h4 em { display: block; }
.kit-dots { display: grid; grid-template-columns: repeat(6, 14px); gap: 9px; justify-content: center; margin-top: 26px; }
.kit-dots i { width: 14px; height: 14px; border-radius: 50%; background: var(--dark); opacity: .85; }
.kit-dots i:nth-child(4n+2) { background: var(--accent); }
.kit-dots i:nth-child(5n+3) { background: var(--accent-deep); }

/* ---------- Consult cards ---------- */
.consults { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.cons {
  border-radius: var(--r); padding: 12px; display: flex; flex-direction: column;
  background: var(--dark-2); color: var(--bg); position: relative; overflow: hidden;
  transition: transform .6s var(--ease), background .6s var(--ease);
}
.cons:hover { transform: translateY(-6px); background: #7A6A5D; }
.cons__img { position: relative; aspect-ratio: 4 / 3.4; border-radius: calc(var(--r) - 10px); overflow: hidden; }
.cons__img img { width: 100%; height: 100%; transition: transform 1.2s var(--ease); }
.cons:hover .cons__img img { transform: scale(1.06); }
.cons__img .tag { position: absolute; top: 12px; right: 12px; background: rgba(46, 36, 29, .62); color: var(--bg); }
.cons__body { padding: 22px 14px 10px; display: flex; flex-direction: column; flex: 1; }
.cons h3 { font-size: 2.3rem; margin-bottom: 8px; }
.cons p { font-size: 15px; color: rgba(245, 239, 231, .75); margin-bottom: 22px; flex: 1; }
.cons__foot { display: flex; justify-content: space-between; align-items: center; padding-top: 18px; border-top: 1px solid var(--line-light); }
.cons__price { font-family: var(--serif); font-size: 2rem; }
.cons__go { width: 44px; height: 44px; border-radius: 50%; background: var(--bg); color: var(--dark); display: grid; place-items: center; transition: background .4s, transform .5s var(--ease); }
.cons:hover .cons__go { background: var(--pop-light); transform: rotate(-45deg); }
.discovery {
  margin-top: 16px; border-radius: var(--r); overflow: hidden; display: grid; grid-template-columns: 1.15fr 1fr;
  background: var(--tint); color: var(--dark);
}
.discovery__copy { padding: clamp(32px, 4.5vw, 64px); display: flex; flex-direction: column; justify-content: center; gap: 18px; }
.discovery__copy h3 { font-size: clamp(2.4rem, 4vw, 4rem); }
.discovery__copy p { max-width: 30em; }
.discovery__img { min-height: 340px; position: relative; }
.discovery__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-position: 50% 30%; }

/* ---------- Steps ---------- */
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.step { padding: 30px 28px 32px; border-radius: var(--r); background: var(--surface); }
.dark .step { background: var(--dark-2); }
.step__n { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; font-size: 15px; font-weight: 500; background: var(--pop); color: var(--pop-ink); margin-bottom: 48px; }
.step:nth-child(2) .step__n { background: var(--tint); }
.step:nth-child(3) .step__n { background: var(--stone); }
.step:nth-child(4) .step__n { background: var(--sand); }
.step h3 { font-size: 2.1rem; margin-bottom: 8px; }
.step p { font-size: 15px; color: var(--muted); }
.dark .step p { color: rgba(245, 239, 231, .72); }

/* ---------- Guides list ---------- */
.guides { border-top: 1px solid var(--line); }
.guide-row {
  display: grid; grid-template-columns: 80px 1.1fr 1.4fr 56px; gap: 24px; align-items: center;
  padding: 30px 0; border-bottom: 1px solid var(--line); transition: padding .5s var(--ease);
}
.guide-row:hover { padding-left: 14px; }
.guide-row__n { font-size: 14px; color: var(--muted); }
.guide-row h3 { font-size: clamp(1.9rem, 2.8vw, 2.8rem); }
.guide-row p { color: var(--muted); font-size: 15.5px; }
.guide-row__go { width: 52px; height: 52px; border-radius: 50%; border: 1px solid var(--line); display: grid; place-items: center; transition: all .5s var(--ease); }
.guide-row:hover .guide-row__go { background: var(--dark); color: var(--bg); border-color: var(--dark); transform: rotate(-45deg); }

/* ---------- Honest ---------- */
.honest { border-radius: var(--r); background: var(--pop-soft); padding: clamp(40px, 6vw, 88px); display: grid; grid-template-columns: 1.1fr 1fr; gap: 56px; align-items: end; }
.honest h2 { font-size: clamp(2.6rem, 4.4vw, 4.4rem); }
.honest p { color: var(--dark-2); }
.honest p + p { margin-top: 14px; }
.honest .actions { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; margin-top: 26px; }
.emergency { display: inline-flex; align-items: center; gap: 10px; font-weight: 500; font-size: 15px; }
.emergency::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: #C77A52; box-shadow: 0 0 0 5px rgba(199, 122, 82, .2); }

/* ---------- Instagram ---------- */
.insta { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.insta a { aspect-ratio: 1; border-radius: var(--r-sm); overflow: hidden; position: relative; }
.insta img { width: 100%; height: 100%; transition: transform 1s var(--ease); }
.insta a:hover img { transform: scale(1.06); }
.insta a::after { content: ""; position: absolute; inset: 0; background: rgba(94, 80, 69, 0); transition: background .5s; }
.insta a:hover::after { background: rgba(94, 80, 69, .2); }

/* ---------- Footer ---------- */
.site-footer { background: var(--dark-deep); color: var(--bg); padding: clamp(72px, 8vw, 112px) 0 32px; overflow: hidden; }
.footer-top { display: grid; grid-template-columns: 1.2fr 2fr; gap: 64px; padding-bottom: 64px; border-bottom: 1px solid var(--line-light); }
.footer-top h2 { font-size: clamp(2.4rem, 3.6vw, 3.4rem); }
.footer-top h2 em { color: var(--pop-light); }
.signup { display: flex; gap: 8px; margin-top: 26px; max-width: 460px; padding: 6px; border-radius: 2px; background: rgba(245, 239, 231, .08); border: 1px solid var(--line-light); }
.signup input { flex: 1; background: none; border: 0; padding: 0 18px; font-size: 15px; outline: none; min-width: 0; }
.signup input::placeholder { color: rgba(245, 239, 231, .5); }
.footer-cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
.footer-cols h4 { font-family: var(--sans); font-size: 13px; font-weight: 500; color: var(--pop-light); margin-bottom: 18px; }
.footer-cols a, .footer-cols li { display: block; list-style: none; font-size: 15px; color: rgba(245, 239, 231, .78); padding: 4px 0; }
.footer-cols a:hover { color: var(--bg); }
.footer-logo { display: block; width: min(240px, 50%); height: auto; margin: 56px auto 40px; opacity: .22; user-select: none; }
.disclaimer { font-size: 13px; line-height: 1.7; color: rgba(245, 239, 231, .6); }
.disclaimer strong { color: var(--bg); font-weight: 500; }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--line-light); font-size: 13px; color: rgba(245, 239, 231, .5); }
.footer-bottom nav { display: flex; gap: 22px; }

/* ---------- Inner page hero ---------- */
.page-hero { padding: calc(var(--header-h) + 36px) 0 0; }
.page-hero__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.page-hero h1 { font-size: clamp(3.4rem, 7vw, 7.2rem); line-height: .92; letter-spacing: -.02em; margin: 22px 0 24px; }
.page-hero h1 em { color: var(--accent); }
.page-hero__img { border-radius: var(--r); overflow: hidden; aspect-ratio: 4 / 3.4; max-width: 520px; justify-self: end; width: 100%; position: relative; }
.page-hero__img img { width: 100%; height: 100%; }
.page-hero__img .tag { position: absolute; left: 20px; bottom: 20px; background: rgba(46, 36, 29, .55) !important; color: var(--bg) !important; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.chips a { padding: 10px 16px; border-radius: 2px; border: 1px solid var(--line); font-size: 14px; font-weight: 500; transition: all .4s var(--ease); }
.chips a:hover { background: var(--dark); color: var(--bg); border-color: var(--dark); }
.breadcrumb { font-size: 14px; color: var(--muted); display: flex; gap: 10px; }
.breadcrumb a:hover { color: var(--dark); }

/* ---------- Product page ---------- */
.pdp { padding: calc(var(--header-h) + 30px) 0 var(--section); }
.pdp__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(36px, 5vw, 88px); margin-top: 24px; align-items: start; }
.pdp__gallery { position: sticky; top: calc(var(--header-h) + 20px); }
.shot .pdp__gallery { position: relative; top: 0; }
.stage { position: relative; aspect-ratio: 1 / 1.06; border-radius: var(--r); overflow: hidden; background: var(--sand); }
.stage__view { position: absolute; inset: 0; opacity: 0; transition: opacity .7s var(--ease); }
.stage__view.on { opacity: 1; }
.stage__view img { width: 100%; height: 100%; position: absolute; inset: 0; }
.stage__pick {
  position: absolute; left: 18px; bottom: 18px; right: 18px; z-index: 2; max-width: 360px;
  display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: var(--r-sm);
  background: rgba(252, 250, 247, .78); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  transition: transform .5s var(--ease);
}
.stage__pick.swap { animation: pop .6s var(--ease); }
@keyframes pop { 40% { transform: scale(1.03); } }
.stage__pick small { display: block; font-size: 12px; color: var(--muted); }
.stage__pick b { display: block; font-weight: 500; font-size: 16px; line-height: 1.25; }
.stage__pick .pills { display: flex; gap: 6px; margin-top: 6px; }
.stage__pick .pills span { font-size: 12px; padding: 3px 9px; border-radius: 2px; background: var(--dark); color: var(--bg); }
.stage__pick .pills span + span { background: var(--tint); color: var(--dark); }
.stage__sticker {
  position: absolute; top: 20px; right: 20px; width: 100px; height: 100px; border-radius: 50%;
  background: var(--pop); color: var(--pop-ink); display: grid; place-items: center; text-align: center;
  font-size: 13px; font-weight: 500; line-height: 1.15; transform: rotate(8deg); z-index: 2;
}
.stage__sticker b { display: block; font-family: var(--serif); font-weight: 400; font-size: 34px; line-height: .9; }
.thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 10px; }
.thumb { aspect-ratio: 1; border-radius: var(--r-sm); overflow: hidden; position: relative; background: var(--sand); outline: 2px solid transparent; outline-offset: -2px; transition: outline-color .4s, opacity .4s; opacity: .75; }
.thumb:hover { opacity: 1; }
.thumb img { width: 100%; height: 100%; }
.thumb.on { outline-color: var(--dark); opacity: 1; }

.pdp__info .tag { margin-bottom: 18px; }
.pdp__title { font-size: clamp(3rem, 5vw, 5rem); line-height: .95; letter-spacing: -.015em; }
.pdp__common { font-family: var(--serif); font-style: italic; font-size: 1.6rem; color: var(--muted); margin-top: 6px; }
.pdp__price { display: flex; align-items: baseline; gap: 12px; margin-top: 22px; }
.pdp__price b { font-size: 1.7rem; font-weight: 500; }
.pdp__price span { font-size: 14px; color: var(--muted); }
.pdp__trad { margin-top: 18px; color: var(--ink); font-size: 16.5px; min-height: 3.4em; }
.pdp__trad small { display: block; font-size: 13px; color: var(--muted); margin-top: 6px; }
.field { margin-top: 26px; }
.field__label { display: flex; justify-content: space-between; font-size: 14px; font-weight: 500; margin-bottom: 10px; }
.field__label span { color: var(--muted); font-weight: 400; }
.select {
  width: 100%; appearance: none; -webkit-appearance: none; cursor: pointer;
  background: var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%235E5045' stroke-width='1.5'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 20px center;
  border: 1px solid var(--line); border-radius: var(--r-sm); padding: 17px 48px 17px 20px; font-size: 16px; font-weight: 500;
}
.select:hover { border-color: var(--dark); }
.field__fixed { font-size: 16px; font-weight: 500; color: var(--dark); }
.seg { display: flex; flex-wrap: wrap; gap: 8px; }
.seg label { cursor: pointer; flex: 1; min-width: 90px; }
.seg input { position: absolute; opacity: 0; pointer-events: none; }
.seg span { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 12px; border-radius: 2px; border: 1px solid var(--line); background: var(--surface); font-size: 15px; font-weight: 500; transition: all .3s var(--ease); }
.seg label:hover span { border-color: var(--dark); }
.seg input:checked + span { background: var(--dark); color: var(--bg); border-color: var(--dark); }
.seg input:focus-visible + span { outline: 2px solid var(--accent-deep); outline-offset: 2px; }
.seg svg { width: 12px; height: 18px; }
.buy-row { display: grid; grid-template-columns: 136px 1fr; gap: 10px; margin-top: 28px; }
.qty { display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; text-align: center; border: 1px solid var(--line); border-radius: 2px; background: var(--surface); }
.qty button { height: 100%; font-size: 20px; }
.qty output { font-weight: 500; }
.add-btn { justify-content: space-between; padding: 20px 26px; font-size: 16px; }
.add-btn.added { background: var(--accent-deep); }
.offer { margin-top: 14px; padding: 18px 20px; border-radius: var(--r-sm); background: var(--pop-soft); display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: center; }
.offer__dots { display: flex; gap: 5px; }
.offer__dots i { width: 13px; height: 26px; border-radius: 7px 7px 4px 4px; border: 1.5px solid var(--dark); display: block; opacity: .55; }
.offer__dots i.on { background: var(--dark); opacity: 1; }
.offer__dots i.free { border-style: dashed; }
.offer__dots i.free.on { background: var(--accent-deep); border-color: var(--accent-deep); border-style: solid; }
.offer p { font-size: 14.5px; line-height: 1.5; }
.offer b { font-weight: 600; }
.ship { margin-top: 16px; font-size: 14px; color: var(--muted); }
.bar { height: 4px; border-radius: 2px; background: var(--sand); margin-top: 10px; overflow: hidden; }
.bar i { display: block; height: 100%; width: 0; background: var(--dark); border-radius: 2px; transition: width .8s var(--ease); }

.accordion { margin-top: 36px; display: grid; gap: 10px; }
.accordion details { background: var(--surface); border-radius: var(--r-sm); padding: 0 22px; }
.accordion summary { list-style: none; cursor: pointer; padding: 20px 0; display: flex; align-items: center; gap: 14px; font-weight: 500; font-size: 16.5px; }
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary::after { content: "+"; margin-left: auto; width: 30px; height: 30px; border-radius: 50%; background: var(--sand); display: grid; place-items: center; font-size: 18px; font-weight: 400; transition: transform .4s var(--ease), background .4s; }
.accordion details[open] summary::after { transform: rotate(45deg); background: var(--pop); color: var(--pop-ink); }
.accordion .acc-body { padding: 0 0 22px; color: var(--muted); font-size: 15.5px; }
.accordion .acc-body p + p, .accordion .acc-body ul { margin-top: 10px; }
.accordion .acc-body ul { padding-left: 18px; }
.label-note { margin-top: 20px; font-size: 13.5px; line-height: 1.6; color: var(--muted); }
.label-note strong { color: var(--ink); font-weight: 500; }

.help { border-radius: var(--r); background: var(--tint); display: grid; grid-template-columns: 1fr auto; gap: 32px; align-items: center; padding: clamp(36px, 5vw, 64px); }
.help h2 { font-size: clamp(2.2rem, 3.6vw, 3.4rem); }
.help p { margin-top: 10px; max-width: 34em; }
.help .actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* ---------- Cart drawer ---------- */
.cart-overlay { position: fixed; inset: 0; z-index: 140; background: rgba(46, 36, 29, .4); opacity: 0; pointer-events: none; transition: opacity .5s var(--ease); }
.cart-drawer {
  position: fixed; top: 10px; right: 10px; bottom: 10px; z-index: 150; width: min(440px, calc(100% - 20px));
  background: var(--bg); border-radius: var(--r); display: flex; flex-direction: column; overflow: hidden;
  transform: translateX(110%); visibility: hidden;
  transition: transform .7s var(--ease), visibility 0s linear .7s;
}
.cart-is-open .cart-overlay { opacity: 1; pointer-events: auto; }
.cart-is-open .cart-drawer { transform: none; visibility: visible; transition-delay: 0s; box-shadow: 0 40px 100px -30px rgba(0, 0, 0, .5); }
.cart-head { display: flex; justify-content: space-between; align-items: center; padding: 24px 26px; }
.cart-head h2 { font-size: 2.3rem; }
.cart-close { width: 42px; height: 42px; border-radius: 50%; background: var(--sand); font-size: 15px; }
.cart-progress { margin: 0 26px; padding: 16px 18px; border-radius: var(--r-sm); background: var(--pop-soft); font-size: 14px; }
.cart-progress .bar { background: rgba(94, 80, 69, .15); }
.cart-items { flex: 1; overflow-y: auto; padding: 8px 26px; }
.cart-empty { padding: 60px 0; text-align: center; }
.cart-empty p { font-family: var(--serif); font-size: 2rem; margin-bottom: 18px; }
.citem { display: grid; grid-template-columns: 74px 1fr auto; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.citem__media { background: var(--sand); border-radius: 14px; overflow: hidden; aspect-ratio: 1 / 1.15; }
.citem__media img { width: 100%; height: 100%; }
/* Gift vouchers in the cart: a tiny version of the gift card (dark, cream logo, "Gift voucher"). */
.citem__media--gift { background: var(--dark); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 10px 8px; }
.citem__media--gift img { width: 78%; height: auto; filter: none; }
.citem__media--gift span { font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--bg); opacity: .85; text-align: center; line-height: 1.3; }
.citem h3 { font-family: var(--sans); font-size: 16px; font-weight: 500; }
.citem small { display: block; font-size: 13px; color: var(--muted); margin-top: 2px; }
.citem__qty { display: inline-flex; align-items: center; gap: 12px; margin-top: 10px; border: 1px solid var(--line); border-radius: 2px; padding: 4px 12px; font-size: 14px; }
.citem__qty button { width: 16px; font-size: 16px; }
.citem__right { text-align: right; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; }
.citem__price { font-weight: 500; }
.citem__remove { font-size: 13px; color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.cart-foot { padding: 20px 26px 24px; background: var(--surface); }
.cart-row { display: flex; justify-content: space-between; font-size: 15px; padding: 3px 0; }
.cart-row--total { font-size: 19px; font-weight: 500; padding-top: 10px; }
.cart-row--save { color: var(--accent-deep); font-weight: 500; }
.cart-foot .btn { margin-top: 16px; }
.cart-foot .small { margin-top: 12px; color: var(--muted); font-size: 12.5px; line-height: 1.5; text-align: center; }

/* ---------- Consultations page ---------- */
.ccards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.ccard { border-radius: var(--r); background: var(--surface); overflow: hidden; display: flex; flex-direction: column; transition: transform .6s var(--ease), box-shadow .6s var(--ease); }
.ccard:hover { transform: none; box-shadow: 0 18px 40px -30px rgba(42, 28, 22, .35); }
.ccard__img { aspect-ratio: 16 / 8; overflow: hidden; position: relative; }
.ccard__img img { width: 100%; height: 100%; }
.ccard__img .tag { position: absolute; left: 16px; top: 16px; }
.ccard__body { padding: 26px 28px 28px; display: flex; flex-direction: column; flex: 1; }
.ccard__top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.ccard h3 { font-size: 2rem; }
.ccard__price { font-size: 1.15rem; font-weight: 500; white-space: nowrap; }
.ccard p { color: var(--muted); font-size: 15px; margin: 12px 0 18px; flex: 1; }
.ccard ul { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 24px; }
.ccard li { font-size: 13px; padding: 6px 12px; border-radius: 2px; background: var(--sand); }
.ccard--feature { grid-column: span 2; background: var(--dark); color: var(--bg); flex-direction: row; }
.ccard--feature .ccard__img { aspect-ratio: auto; flex: 0 0 38%; }
.ccard--feature .ccard__body { justify-content: center; padding: clamp(28px, 4vw, 52px); }
.ccard--feature h3 { font-size: clamp(2.4rem, 3.4vw, 3.2rem); color: var(--bg); }
.ccard--feature h3 em { color: var(--pop-light); }
.ccard--feature .btn--dark { background: var(--pop); color: var(--pop-ink); }
.ccard--feature .btn--dark:hover { background: var(--bg); }
.ccard--feature p { color: rgba(245, 239, 231, .82); flex: none; }
.ccard--feature li { background: rgba(252, 250, 247, .6); }

.program { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.program__img { border-radius: var(--r); overflow: hidden; aspect-ratio: 4 / 3; max-width: 440px; position: relative; margin-top: 40px; }
.program__img img { width: 100%; height: 100%; }
.program__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 32px; }
.program__stats div { border-radius: var(--r-sm); background: var(--dark-2); padding: 18px; font-size: 13px; color: rgba(245, 239, 231, .7); }
.program__stats b { display: block; font-family: var(--serif); font-weight: 400; font-size: 2rem; color: var(--bg); line-height: 1.1; }
.includes { list-style: none; display: grid; gap: 10px; }
.includes li { display: grid; grid-template-columns: 52px 1fr; gap: 18px; padding: 24px; border-radius: var(--r-sm); background: var(--dark-2); }
.includes .n { width: 40px; height: 40px; border-radius: 50%; background: var(--pop); color: var(--pop-ink); display: grid; place-items: center; font-size: 14px; font-weight: 500; }
.includes li:nth-child(even) .n { background: var(--tint); }
.includes h3 { font-size: 1.7rem; margin-bottom: 4px; }
.includes p { color: rgba(245, 239, 231, .72); font-size: 15px; }
.note { margin-top: 18px; padding: 18px 20px; border-radius: var(--r-sm); border: 1px solid var(--line-light); font-size: 14px; color: rgba(245, 239, 231, .72); }

.areas { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.areas .accordion { margin-top: 0; }
.areas summary { font-family: var(--serif); font-weight: 400; font-size: 1.9rem; }
.areas summary .n { font-family: var(--sans); font-size: 13px; color: var(--muted); width: 26px; }
.symptoms { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; }
.accordion .acc-body .symptoms { padding-left: 0; margin-top: 0; }
.symptoms li { padding: 8px 14px; border-radius: 2px; background: var(--sand); color: var(--dark); font-size: 14px; }
.areas__img { margin-top: 32px; border-radius: var(--r); overflow: hidden; aspect-ratio: 16 / 9; max-width: 440px; }
.areas__img img { width: 100%; height: 100%; }
.callout { margin-top: 16px; padding: 22px 24px; border-radius: var(--r-sm); background: var(--tint); color: var(--dark); font-size: 15px; }
.faq { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.faq .accordion { margin-top: 0; }

/* ---------- Guides index ---------- */
.gcards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.gcard { display: flex; flex-direction: column; border-radius: var(--r); overflow: hidden; background: var(--surface); transition: transform .6s var(--ease), box-shadow .6s var(--ease); }
a.gcard:hover { transform: translateY(-6px); box-shadow: 0 30px 60px -34px rgba(42, 28, 22, .45); }
.gcard__img { aspect-ratio: 16 / 10; overflow: hidden; position: relative; }
.gcard__img img { width: 100%; height: 100%; transition: transform 1.2s var(--ease); }
a.gcard:hover .gcard__img img { transform: scale(1.05); }
.gcard__img .tag { position: absolute; left: 16px; top: 16px; }
.gcard__body { padding: 24px 26px 26px; display: flex; flex-direction: column; flex: 1; }
.gcard__meta { font-size: 13px; color: var(--muted); margin-bottom: 8px; }
.gcard h3 { font-size: 2.2rem; margin-bottom: 10px; }
.gcard p { color: var(--muted); font-size: 15px; flex: 1; margin-bottom: 20px; }
.gcard--feature { grid-column: span 2; flex-direction: row; }
.gcard--feature .gcard__img { flex: 0 0 55%; aspect-ratio: auto; }
.gcard--feature .gcard__body { justify-content: center; padding: clamp(28px, 4vw, 52px); }
.gcard--feature h3 { font-size: clamp(2.4rem, 3.6vw, 3.4rem); }
.gcard--soon { opacity: .72; }
.gcard--soon .gcard__img img { filter: var(--grade) grayscale(.35); }

.sources { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.source { display: grid; grid-template-columns: 1fr 48px; gap: 16px; align-items: center; padding: 22px 24px; border-radius: var(--r-sm); background: var(--surface); transition: background .4s; }
a.source:hover { background: var(--sand); }
.source h3 { font-family: var(--sans); font-size: 17px; font-weight: 500; margin-bottom: 4px; }
.source p { font-size: 14.5px; color: var(--muted); }
.source__go { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line); display: grid; place-items: center; transform: rotate(-45deg); transition: all .4s var(--ease); }
a.source:hover .source__go { background: var(--dark); color: var(--bg); border-color: var(--dark); }
.sources-books { font-family: var(--sans); font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin: 40px 0 12px; }

/* ---------- Article ---------- */
.article-hero { padding: calc(var(--header-h) + 30px) 0 clamp(48px, 6vw, 80px); }
.article-hero__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(32px, 5vw, 72px); align-items: end; margin-top: 24px; }
.article-hero h1 { font-size: clamp(3.2rem, 6.4vw, 6.4rem); line-height: .94; letter-spacing: -.02em; margin: 20px 0 22px; }
.article-hero h1 em { color: var(--accent); }
.article-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
.article-hero__img { border-radius: var(--r); overflow: hidden; aspect-ratio: 4 / 3; max-width: 480px; justify-self: end; width: 100%; }
.article-hero__img img { width: 100%; height: 100%; }
.article { display: grid; grid-template-columns: 260px minmax(0, 720px); gap: clamp(40px, 6vw, 110px); justify-content: center; padding-bottom: var(--section); }
.toc { position: sticky; top: calc(var(--header-h) + 24px); align-self: start; }
.shot .toc { position: static; }
.toc h4 { font-family: var(--sans); font-size: 13px; font-weight: 500; color: var(--muted); margin-bottom: 12px; }
.toc ol { list-style: none; border-left: 1px solid var(--line); counter-reset: toc; }
.toc li { counter-increment: toc; }
.toc ol a { display: block; padding: 8px 0 8px 18px; font-size: 14.5px; color: var(--muted); border-left: 2px solid transparent; margin-left: -1px; transition: all .3s; }
.toc ol a::before { content: "0" counter(toc) "  "; font-size: 12px; opacity: .7; }
.toc ol a:hover, .toc ol a.on { color: var(--dark); border-left-color: var(--dark); }
.toc__help { margin-top: 28px; padding: 22px; border-radius: var(--r-sm); background: var(--tint); }
.toc__help h5 { font-family: var(--serif); font-weight: 400; font-size: 1.7rem; line-height: 1.05; margin-bottom: 8px; }
.toc__help p { font-size: 14px; margin-bottom: 14px; }

.prose { font-size: 17.5px; line-height: 1.75; color: var(--ink); }
.prose > * + * { margin-top: 18px; }
.prose h2 { font-size: clamp(2.2rem, 3.4vw, 3rem); line-height: 1.02; margin-top: 64px; scroll-margin-top: calc(var(--header-h) + 20px); }
.prose h2:first-child { margin-top: 0; }
.prose h2 .num { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--pop); color: var(--pop-ink); font-family: var(--sans); font-size: 14px; font-weight: 500; vertical-align: middle; margin-right: 14px; position: relative; top: -4px; }
.prose h3 { font-family: var(--sans); font-size: 18px; font-weight: 600; margin-top: 32px; }
.prose p { color: var(--ink-2, #3d2c25); }
.prose ul, .prose ol { padding-left: 22px; }
.prose li + li { margin-top: 8px; }
.prose li::marker { color: var(--accent); }
.prose strong { font-weight: 600; }
.prose a:not(.btn) { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--accent); }
.prose figure { margin-top: 36px; border-radius: var(--r); overflow: hidden; }
.prose figure img { width: 100%; aspect-ratio: 16 / 9.5; }
.prose figcaption { font-size: 13.5px; color: var(--muted); padding: 12px 4px 0; }

.note-box { border-radius: var(--r-sm); padding: 22px 24px; font-size: 16px; line-height: 1.65; }
.note-box b { display: block; font-weight: 600; margin-bottom: 4px; }
.note-box--tip { background: var(--tint); }
.note-box--key { background: var(--pop-soft); }
.note-box--care { background: var(--surface); border: 1px solid var(--line); }
.note-box--care b::before { content: ""; display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #C77A52; box-shadow: 0 0 0 4px rgba(199, 122, 82, .2); margin-right: 10px; position: relative; top: -1px; }

.checklist { list-style: none; padding: 0 !important; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.checklist li { margin: 0 !important; padding: 16px 18px 16px 50px; border-radius: var(--r-sm); background: var(--surface); position: relative; font-size: 15.5px; line-height: 1.5; }
.checklist li::before { content: "✓"; position: absolute; left: 16px; top: 15px; width: 22px; height: 22px; border-radius: 50%; background: var(--dark); color: var(--bg); font-size: 12px; display: grid; place-items: center; }
.checklist b { display: block; font-weight: 600; }

.pictures { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.picture { padding: 20px 22px; border-radius: var(--r-sm); background: var(--surface); }
.picture h4 { font-family: var(--sans); font-size: 16.5px; font-weight: 600; }
.picture small { display: block; font-size: 13px; color: var(--muted); margin-bottom: 8px; }
.picture p { font-size: 15px; line-height: 1.55; color: var(--muted); }
.picture a { font-size: 14px; font-weight: 500; display: inline-block; margin-top: 10px; }

.potencies { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.potency { padding: 22px; border-radius: var(--r-sm); background: var(--surface); }
.potency b { display: block; font-family: var(--serif); font-weight: 400; font-size: 2.6rem; line-height: 1; margin-bottom: 10px; }
.potency:nth-child(1) b { color: var(--accent); } .potency:nth-child(2) b { color: var(--dark); } .potency:nth-child(3) b { color: var(--accent-deep); }
.potency p { font-size: 14.5px; line-height: 1.55; color: var(--muted); }
/* Fibonacci Homochord explainer (choosing guide) */
.fib { margin-top: 40px; padding: clamp(24px, 3vw, 34px); border-radius: var(--r-sm); background: var(--surface); border: 1px solid var(--line); scroll-margin-top: calc(var(--header-h) + 20px); }
.fib__label { font-size: 11.5px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--pop) !important; margin: 0 0 8px; }
.prose .fib h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.9rem, 2.6vw, 2.3rem); line-height: 1.05; margin: 0 0 14px; }
.fib__row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 6px 14px; margin: 20px 0 22px; padding: 16px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.fib__row span { font-family: var(--serif); line-height: 1; color: var(--pop); }
.fib__row span:nth-child(1) { font-size: 1.1rem; } .fib__row span:nth-child(2) { font-size: 1.25rem; } .fib__row span:nth-child(3) { font-size: 1.4rem; }
.fib__row span:nth-child(4) { font-size: 1.55rem; } .fib__row span:nth-child(5) { font-size: 1.7rem; } .fib__row span:nth-child(6) { font-size: 1.85rem; }
.fib__row span:nth-child(7) { font-size: 2rem; } .fib__row span:nth-child(8) { font-size: 2.15rem; } .fib__row span:nth-child(9) { font-size: 2.3rem; } .fib__row span:nth-child(10) { font-size: 2.45rem; }
.fib__note { font-size: 13.5px; color: var(--muted) !important; }
.fib p + p { margin-top: 12px; }
.field__label a { text-decoration: underline; text-underline-offset: 3px; }

.how { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.how__item { border-radius: var(--r-sm); overflow: hidden; background: var(--surface); }
.how__item .ph { aspect-ratio: 4 / 3; overflow: hidden; }
.how__item .ph img { width: 100%; height: 100%; }
.how__item div:last-child { padding: 16px 18px 18px; font-size: 15px; line-height: 1.55; }
.how__item b { display: block; font-weight: 600; margin-bottom: 4px; }

.dose-table { width: 100%; border-collapse: separate; border-spacing: 0; border-radius: var(--r-sm); overflow: hidden; font-size: 15.5px; background: var(--surface); }
.dose-table th, .dose-table td { padding: 16px 18px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.dose-table th { background: var(--dark); color: var(--bg); font-weight: 500; font-size: 14px; }
.dose-table tr:last-child td { border-bottom: 0; }
.dose-table td:first-child { font-weight: 600; width: 32%; }

.related { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.related .gcard__img { aspect-ratio: 16 / 9; }
.shot .progress { display: none; }

/* Reading progress, quick answers, share, cheat sheet */
.progress { position: fixed; left: 0; top: 0; height: 3px; width: 0; background: var(--pop); z-index: 120; transition: width .15s linear; }
.quick { border-radius: var(--r); background: var(--dark); color: var(--bg); padding: clamp(26px, 3.4vw, 40px); }
.quick h2 { font-size: 2.2rem !important; margin: 0 0 18px !important; }
.quick h2 em { color: var(--pop-light); }
.quick ol { list-style: none; padding: 0 !important; display: grid; gap: 12px; counter-reset: q; }
.quick li { counter-increment: q; display: grid; grid-template-columns: 34px 1fr; gap: 14px; margin: 0 !important; font-size: 16.5px; line-height: 1.5; color: rgba(245, 239, 231, .88); }
.quick li::before { content: counter(q); width: 30px; height: 30px; border-radius: 50%; background: var(--pop); color: var(--pop-ink); display: grid; place-items: center; font-size: 13px; font-weight: 600; }
.quick li:nth-child(2)::before { background: var(--tint); }
.quick li:nth-child(3)::before { background: var(--stone); }
.quick li b { color: var(--bg); font-weight: 600; }
.share-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--line-light); }
.share-row .btn { padding: 11px 16px; font-size: 14px; }
.cheat { text-align: left; border-radius: var(--r); overflow: hidden; background: var(--pop-soft); color: var(--dark); max-width: 420px; margin: 40px auto 0; box-shadow: 0 30px 60px -30px rgba(42, 28, 22, .4); }
.cheat__top { background: var(--dark); color: var(--bg); padding: 22px 26px; display: flex; justify-content: space-between; align-items: center; }
.cheat__top h3 { font-size: 1.9rem !important; margin: 0 !important; font-family: var(--serif) !important; font-weight: 400 !important; }
.cheat__top img { height: 34px; width: auto; }
.cheat ol { list-style: none; padding: 20px 26px 8px !important; margin: 0 !important; display: grid; gap: 10px; }
.cheat li { display: grid; grid-template-columns: 30px 1fr; gap: 12px; margin: 0 !important; font-size: 15.5px; line-height: 1.45; }
.cheat li b { display: block; font-weight: 600; }
.cheat li i { font-style: normal; width: 28px; height: 28px; border-radius: 50%; background: var(--surface); display: grid; place-items: center; font-size: 13px; font-weight: 600; }
.cheat__foot { padding: 12px 26px 20px; font-size: 12px; color: var(--dark-2); display: flex; justify-content: space-between; gap: 12px; }
.cheat-wrap { text-align: center; }
.cheat-wrap > p { font-size: 14px; color: var(--muted); margin-top: 14px !important; }
.prose .accordion { margin-top: 22px; }
.prose .accordion details { background: var(--surface); }

/* Guide library filters */
.filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.filters button { padding: 11px 18px; border-radius: 2px; border: 1px solid var(--line); font-size: 14.5px; font-weight: 500; background: var(--surface); transition: all .3s var(--ease); }
.filters button:hover { border-color: var(--dark); }
.filters button.on { background: var(--dark); color: var(--bg); border-color: var(--dark); }
.gcards .gcard.is-hidden { display: none; }

@media print {
  .site-header, .mobile-menu, .site-footer, .toc, .progress, .share-row, .cart-overlay, .cart-drawer, .related, .section.milk, .article-hero__img { display: none !important; }
  body { background: #fff; font-size: 12pt; }
  .article-hero { padding: 0 0 16px; }
  .article { display: block; padding: 0; }
  .prose figure { display: none; }
  .note-box, .quick, .cheat, .picture, .potency, .checklist li { break-inside: avoid; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .reveal { opacity: 1 !important; transform: none !important; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1120px) {
  .nav { display: none; }
  .menu-btn { display: block; }
  .header-actions .btn { display: none; }
  .consults { grid-template-columns: repeat(2, 1fr); }
  .bento { grid-template-columns: repeat(2, 1fr); }
  .insta { grid-template-columns: repeat(2, 1fr); }
  .footer-cols { grid-template-columns: repeat(2, 1fr); }
  .ccards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
  :root { --header-h: 100px; }
  body { font-size: 16px; }
  .header-inner { height: 70px; }
  .logo__img { height: 52px; }
  .cart-btn { height: 42px; } .menu-btn { width: 42px; height: 42px; }
  .menu-btn span:first-child { top: 17px; } .menu-btn span:last-child { top: 24px; }
  .hero { min-height: 0; }
  .hero__inner { flex-direction: column; align-items: stretch; padding-top: 400px; }
  .hero__card { width: 100%; }
  .hero { background: var(--dark-deep); }
  .hero__img { bottom: auto; height: 560px; }
  .hero__img img { object-position: 72% 45%; }
  .hero::before { background: linear-gradient(180deg, rgba(46, 36, 29, .45) 0%, rgba(46, 36, 29, 0) 22%, rgba(46, 36, 29, 0) 52%, rgba(46, 36, 29, .85) 80%, #463B33 560px) !important; }
  .intro, .footer-top, .page-hero__grid, .pdp__grid, .program, .areas, .faq, .honest, .discovery, .help { grid-template-columns: 1fr; }
  .who, .products, .steps, .ccards, .thumbs { grid-template-columns: 1fr; }
  .thumbs { grid-template-columns: repeat(4, 1fr); }
  .who__card { aspect-ratio: 4 / 4.4; }
  .consults { grid-template-columns: 1fr; }
  .bento { grid-template-columns: 1fr 1fr; grid-auto-rows: minmax(200px, auto); }
  .bento__photo { grid-column: span 2; grid-row: auto; aspect-ratio: 1 / 1; }
  .bento__card { padding: 22px; }
  .bento__card h3 { font-size: 1.6rem; }
  .bento__card .big { font-size: 3.8rem; }
  .discovery__img { min-height: 260px; order: -1; }
  .guide-row { grid-template-columns: 1fr 52px; gap: 8px 16px; }
  .guide-row__n { display: none; }
  .guide-row p { grid-column: 1; }
  .guide-row__go { grid-column: 2; grid-row: 1 / span 2; }
  .pdp__gallery { position: relative; top: 0; }
  .ccard--feature { grid-column: auto; flex-direction: column; }
  .ccard--feature .ccard__img { aspect-ratio: 16 / 10; flex: none; }
  .program__img { margin-top: 0; }
  .footer-bottom { flex-direction: column; }
  .head { align-items: flex-start; }
  .gcards, .sources, .related, .article-hero__grid, .checklist, .pictures, .potencies, .how { grid-template-columns: 1fr; }
  .gcard--feature { grid-column: auto; flex-direction: column; }
  .gcard--feature .gcard__img { aspect-ratio: 4 / 3; flex: none; }
  .article { grid-template-columns: 1fr; gap: 32px; }
  .toc { position: static; order: 2; }
  .toc ol, .toc h4 { display: none; }
  .toc__help { margin-top: 0; }
  .prose { font-size: 16.5px; }
  .dose-table td:first-child { width: 40%; }
}
@media (max-width: 520px) {
  .buy-row { grid-template-columns: 112px 1fr; }
  .add-btn { padding: 18px 18px; }
  .hero__ctas .btn { flex: 1; }
  .program__stats { grid-template-columns: 1fr; }
  .footer-cols { grid-template-columns: 1fr 1fr; }
  .insta { gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .zoom-in img { transform: none; }
  html { scroll-behavior: auto; }
}

/* Consultation photo framing */
img[src*="photo-1758273240360"] { object-position: 40% 40%; }
img[src*="photo-1493894473891"] { object-position: 50% 60%; }

/* ---------- Character: accent colours ---------- */
.tint { background: var(--sand); }
.h2 em, .help h2 em, .honest h2 em, .gcard h3 em, .discovery__copy h3 em, .footer-top h2 em { color: var(--accent); }
.dark .h2 em, .dark h2 em, .site-footer h2 em, .quick h2 em { color: var(--pop-light); }
.cons__price { color: var(--pop-light); }
.cons:hover .cons__go { background: var(--pop-light); }
.tint .prod { background: var(--surface); }
.btn--dark:hover { background: var(--accent-deep); }
.btn--line:hover { background: var(--dark); border-color: var(--dark); }
.announce__track i { background: var(--pop-light); opacity: 1; }
.cart-btn__count { background: var(--pop); color: var(--pop-ink); }
.prose h2 .num { background: var(--pop); color: var(--pop-ink); }
.note-box--tip { background: var(--tint-soft); }
.honest { background: var(--pop-soft); }
.help { background: var(--tint-soft); }
/* ---------- Product pages and admin-made pages ---------- */
.pdp__price s { font-size: 1.1rem; }
.product-desc { margin-top: 28px; color: var(--muted); font-size: 16px; }
.product-desc p + p { margin-top: 12px; }
.page-figure { max-width: 1060px; margin: 0 auto 56px; border-radius: var(--r); overflow: hidden; }
.page-figure img { width: 100%; aspect-ratio: 16 / 8; object-fit: cover; }
.page-body { max-width: 760px; margin: 0 auto; }
.page-body h2 { margin-top: 48px; }

/* ---------- Editorial layer: lighter sections inspired by classic practitioner sites ---------- */
.eyebrow { font-size: 12px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); margin-bottom: 18px; }
.dark .eyebrow { color: rgba(245, 239, 231, .7); }
.centre-head { max-width: 760px; margin: 0 auto clamp(44px, 5vw, 64px); text-align: center; }
.centre-head .h2 { margin-bottom: 22px; }
.centre-head .lead { margin: 0 auto; max-width: 40em; }
.centre-head .small { margin-top: 14px; }

/* Bigger logo over the homepage photo */
body[data-page="home"] .site-header:not(.is-scrolled) .header-inner { height: 104px; }
body[data-page="home"] .site-header:not(.is-scrolled) .logo__img { height: 84px; }

.hero__note { margin-top: 22px; font-size: 14.5px; color: rgba(245, 239, 231, .85); }
.hero__note a { color: var(--bg); border-bottom: 1px solid rgba(245, 239, 231, .55); padding-bottom: 2px; }
.hero__note a:hover { border-color: var(--hero-accent); color: var(--hero-accent); }

/* Consultation types: four clean columns, no photos, an easy "Book now" in each */
.book-grid { display: grid; grid-template-columns: repeat(4, 1fr); max-width: 1180px; margin: 0 auto; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.book-item { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 44px 28px 40px; transition: background .4s var(--ease); }
.book-item + .book-item { border-left: 1px solid var(--line); }
.book-item:hover { background: var(--bg); }
.book-item__time { font-size: 11.5px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.book-item h3 { font-size: clamp(1.8rem, 2.2vw, 2.2rem); line-height: 1.05; margin: 14px 0 6px; }
.book-item__price { font-family: var(--serif); font-size: 1.7rem; color: var(--pop); }
.book-item p { color: var(--muted); font-size: 15px; line-height: 1.6; margin: 16px 0 26px; max-width: 24em; flex: 1; }
.book-item__btn { margin-top: auto; }
.book-more { text-align: center; margin-top: 30px; font-size: 15px; color: var(--muted); }
.book-more a { color: var(--dark); border-bottom: 1px solid currentColor; padding-bottom: 1px; }
.book-more a:hover { color: var(--pop); }
/* Free discovery call: its own band so it stands out */
.discovery-band { padding: clamp(56px, 6vw, 84px) 0; }
.discovery-band__inner { display: grid; grid-template-columns: auto 1fr auto; gap: clamp(28px, 4vw, 56px); align-items: center; }
.discovery-band__badge { width: 132px; height: 132px; border-radius: 50%; border: 1px solid rgba(245, 239, 231, .45); display: grid; place-content: center; text-align: center; line-height: 1; }
.discovery-band__badge b { font-family: var(--serif); font-weight: 400; font-size: 3.4rem; color: var(--pop-light); }
.discovery-band__badge span { font-size: 11px; letter-spacing: .2em; text-transform: uppercase; margin-top: 4px; }
.discovery-band__copy .h2 { font-size: clamp(2.2rem, 3.4vw, 3.2rem); margin-bottom: 12px; }
.discovery-band__copy p:last-child { color: rgba(245, 239, 231, .8); max-width: 34em; }
.discovery-band__btn { padding: 18px 28px; }

/* Products: small photos with a simple caption underneath */
.products { grid-template-columns: repeat(auto-fit, minmax(170px, 250px)); justify-content: center; gap: 36px 24px; }
.prod { background: none; border-radius: 0; overflow: visible; }
.prod:hover { transform: none; box-shadow: none; }
.prod__media { aspect-ratio: 1; border-radius: var(--r-sm); }
.prod__media .tag { top: 10px; left: 10px; }
.prod__body { padding: 14px 0 0; }
.prod__body h3 { font-size: 1.4rem; line-height: 1.15; }
.prod__body h3 .arrow { display: inline-block; font-family: var(--sans); font-size: .8em; transition: transform .4s var(--ease); }
.prod:hover h3 .arrow { transform: translateX(4px); }
.prod__price { margin-top: 4px; font-size: 14px; color: var(--muted); }
.prod__price small { font-size: 12px; margin-right: 2px; }
.prod__price s { margin-right: 6px; }
.shop-more { text-align: center; margin-top: clamp(36px, 4vw, 52px); }

@media (max-width: 860px) {
  body[data-page="home"] .site-header:not(.is-scrolled) .header-inner { height: 84px; }
  body[data-page="home"] .site-header:not(.is-scrolled) .logo__img { height: 64px; }
  .book-grid { grid-template-columns: 1fr 1fr; }
  .book-item:nth-child(3) { border-left: 0; }
  .book-item:nth-child(n+3) { border-top: 1px solid var(--line); }
  .discovery-band__inner { grid-template-columns: 1fr; text-align: center; justify-items: center; }
  .discovery-band__badge { width: 104px; height: 104px; }
  .discovery-band__badge b { font-size: 2.6rem; }
  .discovery-band__copy p:last-child { margin: 0 auto; }
}
@media (max-width: 520px) {
  .products { grid-template-columns: 1fr 1fr; gap: 28px 14px; }
  .book-grid { grid-template-columns: 1fr; }
  .book-item + .book-item { border-left: 0; border-top: 1px solid var(--line); }
  .book-item { padding: 34px 8px 32px; }
}

@media (max-width: 1120px) and (min-width: 861px) {
  .book-grid { grid-template-columns: 1fr 1fr; }
  .book-item:nth-child(3) { border-left: 0; }
  .book-item:nth-child(n+3) { border-top: 1px solid var(--line); }
}

/* ---------- Consultations page (minimal) ---------- */
.consult-hero, .page-intro { padding: calc(var(--header-h) + clamp(56px, 7vw, 96px)) 0 clamp(40px, 5vw, 64px); }
.consult-hero h1, .page-intro h1 { font-size: clamp(3rem, 6vw, 5.6rem); line-height: .95; letter-spacing: -.02em; margin-bottom: 24px; }
.consult-hero h1 em, .page-intro h1 em { color: var(--accent); }
.ctypes { padding-bottom: var(--section); }
.ctypes .wrap { max-width: 1120px; }
.ctype { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 6vw, 96px); padding: clamp(40px, 5vw, 64px) 0; border-top: 1px solid var(--line); scroll-margin-top: calc(var(--header-h) + 16px); }
.ctype:last-child { border-bottom: 1px solid var(--line); }
.ctype__num { font-size: 12px; letter-spacing: .2em; color: var(--muted); margin-bottom: 14px; }
.ctype h2 { font-size: clamp(2.4rem, 3.6vw, 3.4rem); line-height: 1; }
.ctype__meta { margin-top: 14px; font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.ctype__price { margin-top: 18px; font-family: var(--serif); font-size: 2.2rem; line-height: 1; color: var(--pop); }
.ctype__body { padding-top: 26px; }
.ctype__body > p:first-child { font-size: 17px; line-height: 1.7; color: var(--dark); }
.ctype__list { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 28px; }
.ctype__list li { position: relative; padding-left: 22px; font-size: 15px; color: var(--muted); }
.ctype__list li::before { content: ""; position: absolute; left: 0; top: .78em; width: 10px; height: 1px; background: var(--pop); }
.ctype__note { margin-top: 20px; font-size: 14px; line-height: 1.6; color: var(--muted); padding-left: 16px; border-left: 1px solid var(--pop-soft); }
.ctype__btn { margin-top: 30px; }
.ctype__note a { color: var(--dark); border-bottom: 1px solid currentColor; white-space: nowrap; }
.ctype__note a:hover { color: var(--pop); }
.ctype--free h2 em, .ctype--free .ctype__price { color: var(--pop); }

.expect { list-style: none; padding: 0; margin: 0 auto; max-width: 1120px; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); }
.expect li { padding: 34px 26px 8px 0; }
.expect li + li { padding-left: 26px; border-left: 1px solid var(--line); }
.expect__n { display: block; font-family: var(--serif); font-size: 2.4rem; line-height: 1; color: var(--pop); margin-bottom: 18px; }
.expect h3 { font-size: 1.7rem; margin-bottom: 10px; }
.expect p { font-size: 15px; line-height: 1.65; color: var(--muted); }
.expect__note { max-width: 46em; margin: 44px auto 0; text-align: center; font-size: 14px; line-height: 1.6; color: var(--muted); }

@media (max-width: 860px) {
  .ctype { grid-template-columns: 1fr; gap: 6px; }
  .ctype__body { padding-top: 14px; }
  .ctype__list { grid-template-columns: 1fr; }
  .expect { grid-template-columns: 1fr 1fr; }
  .expect li:nth-child(3) { padding-left: 0; border-left: 0; }
  .expect li:nth-child(n+3) { border-top: 1px solid var(--line); margin-top: 24px; }
}
@media (max-width: 520px) {
  .expect { grid-template-columns: 1fr; }
  .expect li, .expect li + li { padding: 26px 0 6px; border-left: 0; }
  .expect li + li { border-top: 1px solid var(--line); margin-top: 0; }
}
/* ---------- Header dropdowns ---------- */
.nav { align-items: center; }
.nav__item { position: relative; display: flex; align-items: center; gap: 2px; }
.nav__caret { display: grid; place-items: center; width: 22px; height: 28px; margin-right: -8px; color: inherit; opacity: .75; }
.nav__caret svg { transition: transform .35s var(--ease); }
.nav__item.open .nav__caret svg { transform: rotate(180deg); }
.nav__drop { position: absolute; top: 100%; left: -22px; z-index: 5; padding-top: 16px; min-width: 236px; opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .3s var(--ease), transform .3s var(--ease), visibility 0s linear .3s; }
.nav__item.open .nav__drop, .nav__drop:focus-within { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
@media (hover: hover) {
  .nav__item:hover .nav__drop { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
  .nav__item:hover .nav__caret svg { transform: rotate(180deg); }
}
.nav__panel { background: var(--surface); color: var(--dark); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 10px 0; box-shadow: 0 22px 44px -24px rgba(70, 59, 51, .35); }
.nav .nav__panel a { display: block; padding: 9px 22px; font-size: 14.5px; font-weight: 400; letter-spacing: 0; text-transform: none; white-space: nowrap; opacity: 1; color: var(--dark); transition: color .25s, background .25s; }
.nav .nav__panel a::after { content: none; }
.nav .nav__panel a:hover, .nav .nav__panel a:focus-visible { background: var(--bg); color: var(--pop); }
.nav .nav__panel a[aria-current="page"] { color: var(--pop); }
.nav .nav__panel a.is-pop { color: var(--pop); font-weight: 500; }

/* Phone menu: each section's pages sit underneath it in small type */
.mobile-menu { overflow-y: auto; }
.mobile-menu nav > a { font-size: clamp(2.2rem, 9vw, 3rem); }
.mobile-menu nav .mm-sub { display: flex; flex-wrap: wrap; gap: 2px 18px; margin: 2px 0 14px; }
.mobile-menu nav .mm-sub a { display: inline-block; font-family: var(--sans); font-size: 14.5px; line-height: 1.6; opacity: .72; }
.mobile-menu nav .mm-sub a.is-pop { color: var(--pop-light); opacity: 1; }

/* ---------- What people come to me for (symptom page): homepage-style grids ---------- */
.expect--3 { grid-template-columns: repeat(3, 1fr); }
.concerns { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 1080px; margin: 0 auto; border-top: 1px solid var(--line); }
.concern { padding: 34px 28px 32px; text-align: center; border-bottom: 1px solid var(--line); }
.concern:not(:nth-child(3n + 1)) { border-left: 1px solid var(--line); }
.concern h3 { font-size: clamp(1.6rem, 2vw, 1.9rem); line-height: 1.1; margin-bottom: 10px; }
.concern p { font-size: 15px; line-height: 1.6; color: var(--muted); max-width: 22em; margin: 0 auto; }
.concerns__more { text-align: center; margin-top: 34px; }
.sg-end .btn { margin-top: 30px; }

@media (max-width: 860px) {
  .expect--3 { grid-template-columns: 1fr; }
  .expect--3 li, .expect--3 li + li { padding: 26px 0 6px; border-left: 0; margin-top: 0; }
  .expect--3 li + li { border-top: 1px solid var(--line); }
  .concerns { grid-template-columns: 1fr 1fr; }
  .concern:not(:nth-child(3n + 1)) { border-left: 0; }
  .concern:nth-child(even) { border-left: 1px solid var(--line); }
}
@media (max-width: 520px) {
  .concerns { grid-template-columns: 1fr; }
  .concern:nth-child(even) { border-left: 0; }
  .concern { padding: 26px 8px 24px; }
}
/* ---------- Consultations: compact two-column grid ---------- */
.consult-hero--compact { padding-bottom: clamp(32px, 4vw, 48px); }
.consult-hero--compact h1 { font-size: clamp(2.8rem, 5vw, 4.4rem); margin-bottom: 18px; }
.cgrid { display: grid; grid-template-columns: 1fr 1fr; max-width: 1040px; margin: 0 auto; border-top: 1px solid var(--line); }
.cgrid__item { display: flex; flex-direction: column; align-items: flex-start; padding: clamp(30px, 3.4vw, 44px) clamp(22px, 3vw, 44px) clamp(30px, 3.4vw, 40px); border-bottom: 1px solid var(--line); scroll-margin-top: calc(var(--header-h) + 16px); }
.cgrid__item:nth-child(odd):not(.cgrid__item--free) { border-right: 1px solid var(--line); padding-left: 0; }
.cgrid__item:nth-child(even) { padding-right: 0; }
.cgrid__top { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; width: 100%; }
.cgrid__meta { font-size: 11.5px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.cgrid__price { font-family: var(--serif); font-size: 1.9rem; line-height: 1; color: var(--pop); }
.cgrid__item h2 { font-size: clamp(2rem, 2.8vw, 2.6rem); line-height: 1; margin: 14px 0 12px; }
.cgrid__item p:not([class]) { font-size: 15px; line-height: 1.65; color: var(--muted); max-width: 30em; }
.cgrid__small { margin-top: 8px; font-size: 13px; color: var(--muted); }
.cgrid__item .btn { margin-top: 22px; }
.cgrid__item--free { grid-column: 1 / -1; flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 28px; padding-left: 0; padding-right: 0; }
.cgrid__item--free > div { flex: 1; max-width: 560px; }
.cgrid__item--free .btn { margin-top: 0; flex: none; }
.section--compact { padding: clamp(56px, 7vw, 96px) 0; }

@media (max-width: 760px) {
  .cgrid { grid-template-columns: 1fr; }
  .cgrid__item, .cgrid__item:nth-child(odd):not(.cgrid__item--free), .cgrid__item:nth-child(even) { padding-left: 0; padding-right: 0; border-right: 0; }
  .cgrid__item--free { flex-direction: column; align-items: flex-start; }
  .cgrid__item--free .btn { margin-top: 6px; }
}

/* ---------- Shop pages: smaller, lighter, quieter (Leah: "smaller is better") ---------- */
.pdp { padding: calc(var(--header-h) + 20px) 0 clamp(56px, 7vw, 96px); }
.pdp .wrap { max-width: 1120px; }
.breadcrumb { font-size: 13px; }
.pdp__grid { gap: clamp(32px, 5vw, 72px); margin-top: 20px; }
@media (min-width: 861px) { .pdp__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.pdp__gallery { max-width: 500px; }
.stage { aspect-ratio: 1; border-radius: var(--r-sm); }
.stage__pick { display: none; }
.stage__sticker { top: 14px; right: 14px; width: 64px; height: 64px; font-size: 10.5px; font-weight: 400; }
.stage__sticker b { font-size: 22px; }
.thumbs { grid-template-columns: repeat(4, 64px); gap: 8px; }
.thumb { border-radius: 2px; outline-width: 1px; }

.pdp__kicker { display: block; font-size: 11.5px; font-weight: 400; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); margin-bottom: 14px; }
.pdp__info .tag { margin-bottom: 14px; }
.pdp__title { font-size: clamp(2.2rem, 3vw, 2.8rem); line-height: 1.02; letter-spacing: -.01em; }
.pdp__common { font-size: 1.15rem; margin-top: 4px; }
.pdp__price { margin-top: 16px; gap: 8px; }
.pdp__price b { font-size: 1.2rem; font-weight: 400; }
.pdp__price span { font-size: 12.5px; }
.pdp__trad { margin-top: 14px; font-size: 14.5px; line-height: 1.65; color: var(--muted); min-height: 0; }
.pdp__trad small { font-size: 12px; }

.pdp .field { margin-top: 20px; }
.pdp .field__label { font-size: 11.5px; font-weight: 400; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
.pdp .field__label span { letter-spacing: 0; text-transform: none; font-size: 12.5px; }
.pdp .select { padding: 12px 40px 12px 14px; font-size: 14.5px; font-weight: 400; border-radius: 2px; background-position: right 14px center; }
.field__fixed { font-size: 14.5px; font-weight: 400; }
.pdp .seg span { padding: 10px 12px; font-size: 14px; font-weight: 400; color: var(--muted); }
.pdp .seg input:checked + span { background: var(--surface); color: var(--dark); border-color: var(--dark); }
.pdp .buy-row { grid-template-columns: 112px 1fr; margin-top: 22px; }
.pdp .qty button { font-size: 16px; }
.pdp .qty output { font-weight: 400; font-size: 14px; }
.pdp .add-btn { padding: 14px 20px; font-size: 12.5px; }
.pdp .add-btn b { font-weight: 400; }

.pdp .offer { margin-top: 14px; padding: 12px 0; background: none; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); border-radius: 0; gap: 14px; }
.pdp .offer__dots { gap: 4px; }
.pdp .offer__dots i { width: 9px; height: 18px; border-width: 1px; }
.pdp .offer p { font-size: 13px; color: var(--muted); }
.pdp .offer b { font-weight: 500; color: var(--dark); }
.pdp .ship { margin-top: 12px; font-size: 12.5px; }
.pdp .bar { height: 2px; }

.pdp .accordion { margin-top: 26px; gap: 0; border-top: 1px solid var(--line); }
.pdp .accordion details { background: none; border-radius: 0; padding: 0; border-bottom: 1px solid var(--line); }
.pdp .accordion summary { padding: 14px 0; font-size: 14px; font-weight: 400; }
.pdp .accordion summary::after { width: 20px; height: 20px; font-size: 14px; background: none; color: var(--muted); }
.pdp .accordion details[open] summary::after { background: none; color: var(--dark); }
.pdp .accordion .acc-body { padding-bottom: 16px; font-size: 13.5px; line-height: 1.65; }
.pdp .label-note { font-size: 12px; }
.pdp .label-note strong { font-weight: 400; color: var(--muted); }

/* Help band and "More from the range" on the remedy page */
.help { background: none; border: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); border-radius: 0; padding: 28px 0; gap: 24px; max-width: 1120px; margin: 0 auto; }
.help h2 { font-size: clamp(1.6rem, 2.2vw, 2rem); }
.help p { font-size: 14px; color: var(--muted); margin-top: 6px; }
span.eyebrow { display: block; }
#more .centre-head { margin-bottom: clamp(28px, 3vw, 40px); }
#more .h2 { font-size: clamp(1.9rem, 2.6vw, 2.4rem); }

@media (max-width: 860px) {
  .pdp__grid { grid-template-columns: minmax(0, 1fr); }
  .pdp__gallery { max-width: 460px; }
  .thumbs { grid-template-columns: repeat(4, 56px); }
  .help { grid-template-columns: 1fr; }
}
.pdp ~ .wrap, #more .wrap { max-width: 1120px; }
.help { max-width: none; }
#more .products { grid-template-columns: repeat(auto-fit, minmax(150px, 210px)); gap: 28px 20px; }
#more .prod__body h3 { font-size: 1.2rem; }
#more .prod__price { font-size: 13px; }
/* Smaller headings on the inner pages (Leah: smaller is better) */
.consult-hero, .page-intro { padding: calc(var(--header-h) + clamp(40px, 5vw, 64px)) 0 clamp(28px, 3.5vw, 44px); }
.consult-hero h1, .page-intro h1, .consult-hero--compact h1 { font-size: clamp(2.4rem, 4vw, 3.4rem); line-height: 1; margin-bottom: 16px; }
.consult-hero .lead, .page-intro .lead { font-size: 16px; }
.section--compact .h2, .sg-end .h2 { font-size: clamp(1.9rem, 2.8vw, 2.5rem); }
.section--compact .centre-head { margin-bottom: clamp(28px, 3.5vw, 44px); }
.cgrid__item h2 { font-size: clamp(1.7rem, 2.2vw, 2.1rem); }
.cgrid__price { font-size: 1.5rem; }
.cgrid__item--free .cgrid__top { justify-content: flex-start; gap: 16px; }
.concern { padding: 26px 24px 24px; }
.concern h3 { font-size: clamp(1.35rem, 1.6vw, 1.55rem); margin-bottom: 8px; }
.concern p { font-size: 14px; }
.section--compact .expect__n { font-size: 1.8rem; margin-bottom: 12px; }
.section--compact .expect h3 { font-size: 1.4rem; }
.section--compact .expect p { font-size: 14px; }
.page-intro + .section--compact { padding-top: clamp(20px, 3vw, 40px); }

/* Remedy photos: one per lid, with the Vibe logo on the dropper bottle's label */
.stage__logo { position: absolute; left: 50%; top: 56%; width: 15%; aspect-ratio: 900 / 481; transform: translate(-50%, -50%); z-index: 1; background: url("/assets/logo-brown-sm.png") center / contain no-repeat; mix-blend-mode: multiply; opacity: .92; pointer-events: none; }
/* The Vibe bottle label, drawn over the plain label in the remedy photo (Leah, 25 Oct 2026).
   Same layout and colours as Leah's real label: dark band with the remedy name, the logo, then
   the potency, "Homeopathic medicine", size and lid. Everything is sized from the photo's width
   (cqw), so it stays on the bottle at every screen size. Placed for this exact photo. */
.stage, .prod__media { container-type: inline-size; }
/* "Coming soon" in place of a photo (first aid kit, Leah 26 Oct 2026): sand, a thin inner frame, small capitals, serif title */
.soon { position: absolute; inset: 0; display: flex; padding: 4cqw; background: #E9DCCB; }
.soon__frame { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2.4cqw; border: 1px solid rgba(61, 47, 43, .35); text-align: center; color: #3D2F2B; }
.soon__label { font-family: var(--sans); font-size: max(10px, 2.4cqw); letter-spacing: .2em; text-transform: uppercase; color: var(--muted, #5E5045); }
.soon__title { font-family: var(--serif); font-size: 11cqw; line-height: 1; }
.soon__title em { color: #687852; }
.soon__rule { width: 14cqw; height: 1px; background: rgba(61, 47, 43, .35); }
.soon__line { font-family: var(--sans); font-size: 2.6cqw; color: #5E5045; }
/* Bundle packs: one Vibe bottle per remedy, side by side (each slice shows the bottle from the same photo) */
.tri { position: absolute; inset: 0; z-index: 1; }
.tri__p { position: absolute; top: 0; bottom: 0; overflow: hidden; }
.tri__img { position: absolute; top: 0; height: 100%; container-type: inline-size; }
.stage__view .tri__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.prod:hover .prod__media:has(.vlabel) img { transform: none; } /* the label stays on the bottle */
.prod__sq { position: absolute; top: 0; left: 50%; height: 100%; aspect-ratio: 1; transform: translateX(-50%); container-type: inline-size; pointer-events: none; }
.vlabel { position: absolute; left: 37.8%; top: 49.3%; width: 24.3%; height: 27.2%; z-index: 1; display: flex; flex-direction: column; background: #F3E1CF; border-radius: .25cqw; overflow: hidden; pointer-events: none; color: #3D2F2B; }
.vlabel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(40, 25, 15, .26), rgba(40, 25, 15, .05) 16%, rgba(255, 255, 255, .08) 38%, rgba(255, 255, 255, 0) 60%, rgba(40, 25, 15, .08) 84%, rgba(40, 25, 15, .3)); }
.vlabel__band { background: #3D2F2B; color: #F3E1CF; padding: 1.5cqw .9cqw 1.3cqw; text-align: center; }
.vlabel__band b { display: block; font-family: var(--sans); font-weight: 500; font-size: 1.75cqw; letter-spacing: .14em; line-height: 1.2; text-transform: uppercase; text-wrap: balance; }
.vlabel__body { flex: 1; display: flex; flex-direction: column; align-items: center; padding: 0 1cqw 1.5cqw; }
.vlabel__logo { flex: 1; width: 11.5cqw; background: url("/assets/logo-brown-sm.png") center / contain no-repeat; }
.vlabel__foot { width: 100%; display: flex; flex-direction: column; align-items: center; gap: .35cqw; padding-top: 1cqw; border-top: 1px solid rgba(61, 47, 43, .25); font-family: var(--sans); text-transform: uppercase; text-align: center; }
.vlabel__fib { padding-bottom: 1cqw; font-family: var(--sans); font-size: .95cqw; letter-spacing: .16em; text-transform: uppercase; color: #687852; }
.vlabel__foot span:not([data-bottle-meta]) { font-size: 1.05cqw; letter-spacing: .14em; }
.vlabel__foot [data-bottle-meta] { font-size: .95cqw; letter-spacing: .12em; opacity: .75; }
.stage__view--drip img { object-position: 50% 80%; }
.stage__caption { position: absolute; left: 12px; right: 12px; bottom: 12px; z-index: 2; max-width: 290px; padding: 10px 12px; border-radius: 2px; background: rgba(252, 250, 247, .85); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); font-size: 12.5px; line-height: 1.45; color: var(--muted); }
.stage__caption b { display: block; margin-bottom: 2px; font-size: 11px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--dark); }
.thumbs { grid-template-columns: repeat(2, 64px); }
@media (max-width: 860px) { .thumbs { grid-template-columns: repeat(2, 56px); } }
/* Bundle offer on the remedy photo: a small, quiet label instead of a big round sticker */
.stage__offer { position: absolute; top: 14px; right: 14px; z-index: 2; margin: 0; padding: 7px 12px 6px; border-radius: 2px; background: rgba(252, 250, 247, .88); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); font-size: 10.5px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; line-height: 1.3; color: var(--dark); }
.stage__offer span { margin: 0 3px; color: var(--muted); }
.stage__offer em { font-family: var(--serif); font-size: 14px; font-weight: 400; font-style: italic; letter-spacing: 0; text-transform: none; color: var(--pop); }
/* Lid explanations: hover (or keyboard focus) on Dropper / Dripolator */
.seg label { position: relative; }
.seg .tip { position: absolute; left: 50%; bottom: calc(100% + 10px); z-index: 5; width: 240px; padding: 10px 12px; border-radius: 2px; background: var(--dark); color: var(--bg); font-size: 12.5px; font-style: normal; line-height: 1.45; text-align: left; opacity: 0; visibility: hidden; transform: translate(-50%, 4px); transition: opacity .25s var(--ease), transform .25s var(--ease), visibility 0s linear .25s; pointer-events: none; }
.seg .tip::after { content: ""; position: absolute; left: 50%; top: 100%; margin-left: -5px; border: 5px solid transparent; border-top-color: var(--dark); }
.seg input:focus-visible ~ .tip { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: 0s; }
@media (hover: hover) {
  .seg label:hover .tip { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: 0s; }
}
/* Phones and tablets have no hover: show the chosen lid's explanation under the buttons instead */
@media (hover: none) {
  .seg { position: relative; padding-bottom: 46px; }
  .seg label { position: static; }
  .seg .tip { left: 0; right: 0; bottom: 0; top: auto; width: auto; padding: 0; background: none; color: var(--muted); transform: none; }
  .seg .tip::after { content: none; }
  .seg input:checked ~ .tip { opacity: 1; visibility: visible; }
}
/* Product pages: quiet badge and spacing for the bundle's "Choose your remedies" button */
.pdp__info .tag { padding: 0; background: none !important; color: var(--muted) !important; font-size: 11.5px; font-weight: 400; letter-spacing: .2em; }
.pdp__info .tag::before { display: none; }
.pdp__info > .add-btn { display: inline-flex; gap: 14px; margin-top: 20px; }
/* ---------- Homepage shop: four quiet, taller cards ---------- */
.products--shop { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 1080px; margin: 0 auto; gap: 32px 22px; }
.products--shop .prod__media { aspect-ratio: 4 / 5; }
.products--shop .prod__body h3 { font-size: 1.3rem; }
.prod__media .tag { top: 10px; left: 10px; padding: 5px 9px 4px; border-radius: 2px; background: rgba(252, 250, 247, .88) !important; color: var(--dark) !important; font-size: 10px; font-weight: 500; letter-spacing: .16em; }
@media (max-width: 860px) { .products--shop { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- Blends page: a simple list to choose from ---------- */
.blends { border: 0; padding: 0; margin: 20px 0 0; min-width: 0; }
.blends legend { padding: 0; margin-bottom: 8px; }
.blend { display: block; cursor: pointer; border-top: 1px solid var(--line); }
.blend:last-of-type { border-bottom: 1px solid var(--line); }
.blend input { position: absolute; opacity: 0; pointer-events: none; }
.blend > span { display: block; position: relative; padding: 11px 0 11px 26px; transition: background .25s; }
.blend > span::before { content: ""; position: absolute; left: 2px; top: 15px; width: 12px; height: 12px; border-radius: 50%; border: 1px solid var(--muted); }
.blend input:checked + span::before { border-color: var(--dark); background: radial-gradient(var(--dark) 0 3px, transparent 3.5px); }
.blend input:focus-visible + span { outline: 2px solid var(--accent-deep); outline-offset: 2px; }
.blend b { display: block; font-size: 14.5px; font-weight: 500; color: var(--dark); }
.blend small { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.5; color: var(--muted); }
.blend:hover b { color: var(--pop); }
.blends__note { margin-top: 8px; font-size: 12px; color: var(--muted); }
.add-btn:disabled { opacity: .55; cursor: not-allowed; }

/* ---------- Bundles page ---------- */
.products--bundles { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); max-width: 1080px; margin: 0 auto; gap: 30px 20px; }
.products--bundles .prod__body h3 { font-size: 1.2rem; }
.bundles__note { max-width: 40em; margin: 36px auto 0; text-align: center; font-size: 12.5px; color: var(--muted); }

/* ---------- Bach flower page: the seven groups ---------- */
.bach-groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 26px 32px; max-width: 1080px; margin: 0 auto; }
.bach-group h3 { font-family: var(--sans); font-size: 11.5px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--pop); padding-bottom: 10px; margin-bottom: 6px; border-bottom: 1px solid var(--line); }
.bach-group ul { list-style: none; margin: 0; padding: 0; }
.bach-group button { padding: 5px 0; font-family: var(--serif); font-size: 1.2rem; color: var(--dark); text-align: left; transition: color .25s; }
.bach-group button:hover, .bach-group button.on { color: var(--pop); }
.bach-group button.on { font-style: italic; }
.bach-group h3 { min-height: 40px; display: flex; align-items: flex-end; }

/* Bach flower photos: small round photo beside each name, and a quiet credit under the main photo */
.bach-group button { display: flex; align-items: center; gap: 12px; }
.bach-group button img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: none; }
.bach-group button.on img { box-shadow: 0 0 0 2px var(--pop); }
.photo-credit { margin-top: 8px; font-size: 11px; line-height: 1.4; color: var(--muted); }
.photo-credit a { color: inherit; }
/* ---------- Simple guide pages (potency) ---------- */
.guide-simple { max-width: 760px; padding-bottom: clamp(56px, 7vw, 96px); }
.guide-simple h2 { font-size: clamp(1.8rem, 2.6vw, 2.3rem); margin: 8px 0 14px; }
.guide-simple .potencies { margin: 22px 0 8px; }
.guide-next { display: flex; justify-content: space-between; gap: 20px; margin-top: 44px; padding-top: 18px; border-top: 1px solid var(--line); font-size: 14px; }
.guide-next a { color: var(--dark); }
.guide-next a:hover { color: var(--pop); }

/* ---------- Acute remedy guide ---------- */
.acute { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1080px; margin: 0 auto; border-top: 1px solid var(--line); }
.acute__item { padding: 26px 24px 24px 0; border-bottom: 1px solid var(--line); }
.acute__item:not(:nth-child(3n + 1)) { padding-left: 24px; border-left: 1px solid var(--line); }
.acute__item h2 { font-size: clamp(1.35rem, 1.7vw, 1.6rem); margin-bottom: 12px; }
.acute__item ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.acute__item li { font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.acute__item li b { display: block; font-size: 14px; font-weight: 500; color: var(--dark); }
.acute__note { max-width: 46em; margin: 34px auto 0; text-align: center; font-size: 12.5px; line-height: 1.6; color: var(--muted); }
.acute__note strong { font-weight: 500; color: var(--dark); }
.acute__more { text-align: center; margin-top: 26px; }

/* ---------- Remedy profiles ---------- */
.profiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 0 28px; max-width: 1080px; margin: 0 auto; }
.profile { padding: 22px 0; border-top: 1px solid var(--line); scroll-margin-top: calc(var(--header-h) + 16px); }
.profile h2 { font-size: 1.45rem; line-height: 1.1; }
.profile__common { margin-top: 2px; font-family: var(--serif); font-style: italic; font-size: 1.02rem; color: var(--muted); }
.profile p:not(.profile__common) { margin-top: 10px; font-size: 13.5px; line-height: 1.6; color: var(--muted); }
.profile__shop { display: inline-block; margin-top: 12px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--dark); }
.profile__shop:hover { color: var(--pop); }

@media (max-width: 860px) {
  .acute { grid-template-columns: 1fr 1fr; }
  .acute__item:not(:nth-child(3n + 1)) { padding-left: 0; border-left: 0; }
  .acute__item:nth-child(even) { padding-left: 20px; border-left: 1px solid var(--line); }
}
@media (max-width: 560px) {
  .acute { grid-template-columns: 1fr; }
  .acute__item:nth-child(even) { padding-left: 0; border-left: 0; }
}
/* Bach flower photos: a stronger soft, warm grade so bright garden photos match the site's tones */
:root { --grade-soft: sepia(.34) saturate(.68) contrast(.88) brightness(1.06); }
#bachPhoto, .bach-group button img { filter: var(--grade-soft); }
.pdp__gallery .stage:has(#bachPhoto)::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(245, 239, 231, .10), rgba(140, 102, 80, .10)); mix-blend-mode: soft-light; }
/* ==========================================================================
   Guides: minimal refresh (smaller type, thin lines, no heavy colour blocks)
   ========================================================================== */
body[data-page="guides"] { --guide-ink: #3d2c25; }

/* Hero (guides hub and each guide) */
body[data-page="guides"] .page-hero, body[data-page="guides"] .article-hero { padding: calc(var(--header-h) + 24px) 0 clamp(36px, 4vw, 56px); }
body[data-page="guides"] .page-hero__grid, body[data-page="guides"] .article-hero__grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
body[data-page="guides"] .page-hero h1, body[data-page="guides"] .article-hero h1 { font-size: clamp(2.4rem, 4vw, 3.4rem); line-height: 1.02; letter-spacing: -.01em; margin: 6px 0 16px; }
body[data-page="guides"] .page-hero .lead, body[data-page="guides"] .article-hero .lead { font-size: 16px; line-height: 1.65; max-width: 34em; }
body[data-page="guides"] .page-hero__img, body[data-page="guides"] .article-hero__img { max-width: 440px; justify-self: end; aspect-ratio: 4 / 3; border-radius: var(--r-sm); }
body[data-page="guides"] .page-hero__img .tag { display: none; }
body[data-page="guides"] .page-hero .tag, body[data-page="guides"] .article-hero .tag { padding: 0; background: none !important; color: var(--muted) !important; font-size: 11.5px; font-weight: 400; letter-spacing: .2em; }
body[data-page="guides"] .page-hero .tag::before, body[data-page="guides"] .article-hero .tag::before { display: none; }
body[data-page="guides"] .article-meta { gap: 14px; margin-top: 4px; }
body[data-page="guides"] .article-meta .tag { letter-spacing: .14em; font-size: 11px; }
body[data-page="guides"] .chips { gap: 6px 18px; margin-top: 18px; }
body[data-page="guides"] .chips a { padding: 0 0 2px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; font-size: 13.5px; font-weight: 400; background: none; }
body[data-page="guides"] .chips a:hover { background: none; color: var(--pop); border-color: var(--pop); }
body[data-page="guides"] .breadcrumb { font-size: 12.5px; }

/* Section headings on the hub */
body[data-page="guides"] .section { padding: clamp(56px, 6vw, 88px) 0; }
body[data-page="guides"] .head { margin-bottom: clamp(28px, 3vw, 40px); }
body[data-page="guides"] .head .tag { padding: 0; background: none !important; color: var(--muted) !important; font-size: 11.5px; font-weight: 400; letter-spacing: .2em; margin-bottom: 12px; }
body[data-page="guides"] .head .tag::before { display: none; }
body[data-page="guides"] .h2, body[data-page="guides"] .help h2, body[data-page="guides"] .honest h2 { font-size: clamp(1.9rem, 2.8vw, 2.5rem); }
body[data-page="guides"] .head p { font-size: 15px; }

/* Guide library */
body[data-page="guides"] .filters button { padding: 7px 14px; font-size: 13px; font-weight: 400; background: none; }
body[data-page="guides"] .filters button.on { background: var(--dark); }
body[data-page="guides"] .gcards { gap: 28px 22px; }
body[data-page="guides"] .gcard { background: none; border-radius: 0; box-shadow: none; }
body[data-page="guides"] .gcard__img { border-radius: var(--r-sm); aspect-ratio: 4 / 3; }
body[data-page="guides"] .gcard--feature { grid-column: span 2; }
body[data-page="guides"] .gcard--feature .gcard__img { aspect-ratio: 16 / 10; }
body[data-page="guides"] .gcard__body { padding: 14px 0 0; }
body[data-page="guides"] .gcard h3, body[data-page="guides"] .gcard--feature h3 { font-size: clamp(1.3rem, 1.6vw, 1.5rem); line-height: 1.15; margin: 4px 0 6px; }
body[data-page="guides"] .gcard p { font-size: 13.5px; line-height: 1.55; color: var(--muted); }
body[data-page="guides"] .gcard__meta { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
body[data-page="guides"] .gcard .link { margin-top: 10px; font-size: 12px; }
body[data-page="guides"] .gcard .tag { background: rgba(252, 250, 247, .88) !important; color: var(--dark) !important; font-size: 10px; }

/* Steps, sources, honest and help bands on the hub */
body[data-page="guides"] .section.sand, body[data-page="guides"] .section.milk { background: var(--surface); }
body[data-page="guides"] .step { background: none; border-radius: 0; padding: 18px 0 0; border-top: 1px solid var(--line); }
body[data-page="guides"] .step h3 { font-size: 1.3rem; }
body[data-page="guides"] .step p, body[data-page="guides"] .source p { font-size: 13.5px; }
body[data-page="guides"] .callout { background: none; border-left: 1px solid var(--accent); border-radius: 0; padding: 4px 0 4px 16px; font-size: 13.5px; color: var(--muted); }
body[data-page="guides"] .source { background: none; border-radius: 0; border-top: 1px solid var(--line); padding: 16px 0; }
body[data-page="guides"] .honest { background: none; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); border-radius: 0; padding: 32px 0; }
body[data-page="guides"] .honest p, body[data-page="guides"] .honest li { font-size: 14px; }

/* Inside a guide: contents list, short version, body text */
body[data-page="guides"] .article { gap: clamp(32px, 5vw, 72px); }
body[data-page="guides"] .toc h4 { font-size: 11.5px; letter-spacing: .18em; text-transform: uppercase; }
body[data-page="guides"] .toc ol a { font-size: 13px; padding: 6px 0 6px 16px; }
body[data-page="guides"] .toc__help { background: none; border-top: 1px solid var(--line); border-radius: 0; padding: 18px 0 0; }
body[data-page="guides"] .toc__help h5 { font-size: 1.3rem; }
body[data-page="guides"] .toc__help p { font-size: 13px; color: var(--muted); }

body[data-page="guides"] .quick { background: var(--surface); color: var(--dark); border: 1px solid var(--line); border-radius: var(--r-sm); padding: clamp(22px, 2.6vw, 30px); }
body[data-page="guides"] .quick h2 { font-size: 1.6rem !important; margin-bottom: 14px !important; }
body[data-page="guides"] .quick h2 em { color: var(--accent); }
body[data-page="guides"] .quick li { font-size: 14.5px; color: var(--muted); grid-template-columns: 26px 1fr; gap: 10px; }
body[data-page="guides"] .quick li b { color: var(--dark); font-weight: 500; }
body[data-page="guides"] .quick li::before, body[data-page="guides"] .quick li:nth-child(n)::before { width: 22px; height: 22px; font-size: 11px; font-weight: 500; background: none; border: 1px solid var(--pop); color: var(--pop); }
body[data-page="guides"] .share-row { border-top-color: var(--line); padding-top: 16px; margin-top: 18px; }
body[data-page="guides"] .share-row .btn { padding: 9px 16px; font-size: 11.5px; }
body[data-page="guides"] .share-row .btn--line-light { color: var(--dark); border-color: var(--line); }

body[data-page="guides"] .prose { font-size: 15.5px; line-height: 1.75; }
body[data-page="guides"] .prose p, body[data-page="guides"] .prose li { color: var(--guide-ink); }
body[data-page="guides"] .prose h2 { font-size: clamp(1.6rem, 2.2vw, 2rem); margin-top: 48px; display: flex; align-items: center; gap: 12px; }
body[data-page="guides"] .prose h2 .num { width: 24px; height: 24px; min-width: 24px; font-family: var(--sans); font-size: 11px; font-weight: 500; background: none !important; border: 1px solid var(--pop); color: var(--pop) !important; }
body[data-page="guides"] .prose strong, body[data-page="guides"] .prose b { font-weight: 500; }

body[data-page="guides"] .note-box { background: none !important; border: 0; border-left: 1px solid var(--accent); border-radius: 0; padding: 4px 0 4px 16px; font-size: 14px; line-height: 1.65; color: var(--muted); }
body[data-page="guides"] .note-box b { font-weight: 500; color: var(--dark); }
body[data-page="guides"] .note-box--key { border-left-color: var(--pop); }
body[data-page="guides"] .note-box--care b::before { width: 6px; height: 6px; box-shadow: none; margin-right: 8px; }

body[data-page="guides"] .checklist { gap: 0 28px; }
body[data-page="guides"] .checklist li { background: none; border-radius: 0; border-top: 1px solid var(--line); padding: 12px 0 12px 26px; font-size: 13.5px; color: var(--muted); }
body[data-page="guides"] .checklist li b { font-weight: 500; color: var(--dark); }
body[data-page="guides"] .checklist li::before { left: 0; width: 16px; height: 16px; font-size: 9px; background: none; border: 1px solid var(--pop); color: var(--pop); }

body[data-page="guides"] .pictures { gap: 0 24px; }
body[data-page="guides"] .picture { background: none; border-radius: 0; border-top: 1px solid var(--line); padding: 14px 0; }
body[data-page="guides"] .picture h4 { font-size: 15px; font-weight: 500; }
body[data-page="guides"] .picture p { font-size: 13.5px; color: var(--muted); }
body[data-page="guides"] .picture a { font-size: 12px; }

body[data-page="guides"] .potency { background: none; border-radius: 0; border-top: 1px solid var(--line); padding: 14px 0; }
body[data-page="guides"] .potency b { font-size: 1.8rem; }
body[data-page="guides"] .potency p { font-size: 13.5px; }

body[data-page="guides"] .cheat-wrap { max-width: 420px; }
body[data-page="guides"] .prose figure img { border-radius: var(--r-sm); max-height: 360px; object-fit: cover; }
body[data-page="guides"] .prose figcaption { font-size: 12.5px; }
body[data-page="guides"] .accordion summary { font-size: 14.5px; font-weight: 400; padding: 14px 0; }
body[data-page="guides"] .accordion details { background: none; border-radius: 0; padding: 0; border-bottom: 1px solid var(--line); }
body[data-page="guides"] .accordion { gap: 0; border-top: 1px solid var(--line); }
body[data-page="guides"] .accordion summary::after { width: 20px; height: 20px; font-size: 14px; background: none !important; color: var(--muted) !important; }
body[data-page="guides"] .accordion .acc-body { font-size: 14px; }
body[data-page="guides"] .dose-table { font-size: 14px; }
body[data-page="guides"] .related .gcard h3 { font-size: 1.3rem; }

@media (max-width: 860px) {
  body[data-page="guides"] .page-hero__grid, body[data-page="guides"] .article-hero__grid { grid-template-columns: 1fr; }
  body[data-page="guides"] .page-hero__img, body[data-page="guides"] .article-hero__img { justify-self: start; max-width: 100%; }
  body[data-page="guides"] .gcard--feature { grid-column: auto; }
}
body[data-page="guides"] .gcard--feature { grid-column: auto; flex-direction: column; }
body[data-page="guides"] .gcard--feature .gcard__img { aspect-ratio: 4 / 3; flex: none; }
body[data-page="guides"] .gcard--feature .gcard__body { padding: 14px 0 0; }
body[data-page="guides"] .gcard .link { display: inline-flex; padding: 0 0 2px; background: none; color: var(--dark); border: 0; border-bottom: 1px solid currentColor; font-size: 12px; font-weight: 500; letter-spacing: .04em; text-transform: none; }
body[data-page="guides"] .article-meta { margin-top: 12px; }
body[data-page="guides"] .gcards { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
body[data-page="guides"] .gcard__body { display: flex; flex-direction: column; align-items: flex-start; }
body[data-page="guides"] .step__n { width: auto; height: auto; background: none !important; color: var(--pop) !important; font-family: var(--serif); font-size: 1.6rem; font-weight: 400; display: block; margin-bottom: 10px; }
body[data-page="guides"] .step h3 { margin-top: 0; }
body[data-page="guides"] .dose-table th { background: none; color: var(--muted); font-size: 11px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; border-bottom: 1px solid var(--dark); }
body[data-page="guides"] .dose-table td { background: none; font-size: 13.5px; }
body[data-page="guides"] .dose-table td:first-child { font-weight: 500; }
body[data-page="guides"] .dose-table { border-radius: 0; box-shadow: none; }
body[data-page="guides"] main .btn:not(.btn--sm) { padding: 11px 18px; font-size: 11.5px; }
body[data-page="guides"] .prose figure img { max-height: 300px; }
body[data-page="guides"] .gcard.gcard--feature .link { padding: 0 0 2px; background: none; color: var(--dark); border: 0; border-bottom: 1px solid currentColor; font-size: 12px; letter-spacing: .04em; text-transform: none; }
body[data-page="guides"] .gcard.gcard--feature .link::after { content: none; }

/* Blends page: dropdown + description, and a grid of all nine blends */
.blend-note { margin-top: 10px; padding-left: 12px; border-left: 1px solid var(--accent); font-size: 13px; color: var(--muted); }
.blend-grid .blend-card { background: none; width: 100%; cursor: pointer; font: inherit; color: inherit; transition: background .25s; }
.blend-grid .blend-card:hover { background: var(--bg); }
.blend-grid .blend-card.on h3 { color: var(--pop); font-style: italic; }
.pdp .note-box { background: none !important; border: 0; border-left: 1px solid var(--pop); border-radius: 0; padding: 2px 0 2px 14px; margin-top: 18px !important; font-size: 13.5px; color: var(--muted); }
.pdp .product-desc { font-size: 14.5px; line-height: 1.7; }

/* "On this page" side pane: sits in the left margin and stays put while scrolling (wide screens) */
.side-toc { display: none; }
.toc-target { scroll-margin-top: calc(var(--header-h) + 20px); }
@media (min-width: 1380px) {
  .side-toc { display: block; position: fixed; z-index: 20; left: 24px; top: calc(var(--header-h) + 36px); width: calc((100vw - 1120px) / 2 - 36px); max-width: 210px; max-height: calc(100vh - var(--header-h) - 72px); overflow-y: auto; opacity: 0; transform: translateY(6px); transition: opacity .35s var(--ease), transform .35s var(--ease); pointer-events: none; }
  .side-toc.is-shown { opacity: 1; transform: none; pointer-events: auto; }
  .side-toc p { font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
  .side-toc ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--line); }
  .side-toc a { display: block; padding: 5px 0 5px 14px; margin-left: -1px; border-left: 1px solid transparent; font-size: 12.5px; line-height: 1.4; color: var(--muted); transition: color .25s, border-color .25s; }
  .side-toc a:hover, .side-toc a.on { color: var(--dark); border-left-color: var(--pop); }
  .shot .side-toc { position: absolute; }
}
@media print { .side-toc { display: none !important; } }
/* ---------- Acute remedy guide as a tool: locked left panel + moments ---------- */
.tool { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: clamp(28px, 4vw, 56px); max-width: 1180px; }
.tool__side { position: sticky; top: calc(var(--header-h) + 24px); align-self: start; }
.shot .tool__side { position: static; }
.tool__search { position: relative; }
.tool__search svg { position: absolute; left: 0; top: 50%; transform: translateY(-50%); color: var(--muted); }
.tool__search input { width: 100%; padding: 10px 0 10px 26px; border: 0; border-bottom: 1px solid var(--dark); background: transparent; font: inherit; font-size: 14px; color: var(--dark); border-radius: 0; }
.tool__search input:focus { outline: none; border-bottom-color: var(--pop); }
.tool__count { margin: 10px 0 16px; font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.tool__topics { display: grid; border-left: 1px solid var(--line); }
.tool__topics button { text-align: left; padding: 6px 0 6px 14px; margin-left: -1px; border-left: 1px solid transparent; font-size: 13px; color: var(--muted); }
.tool__topics button:hover, .tool__topics button.on { color: var(--dark); border-left-color: var(--pop); }
.tool__print { display: inline-block; margin-top: 18px; font-size: 12px; color: var(--dark); border-bottom: 1px solid currentColor; }
.tool__empty { padding: 24px 0; color: var(--muted); font-size: 14px; }
.tool__empty p + p { margin-top: 8px; }
.tool__empty a { color: var(--dark); border-bottom: 1px solid currentColor; }
.acute--tool { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: none; }
.acute--tool .acute__item, .acute--tool .acute__item:not(:nth-child(3n + 1)) { padding: 22px 22px 20px 0; border-left: 0; }
.acute--tool .acute__item:nth-child(even) { padding-left: 22px; border-left: 1px solid var(--line); }
.acute--tool .acute__item[hidden] { display: none; }
.acute__topic { font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--pop); margin-bottom: 4px; }
.acute__item li a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.acute__item li a:hover { color: var(--pop); }
.acute__doc { margin-top: 12px; padding-left: 10px; border-left: 1px solid var(--accent); font-size: 12px; line-height: 1.5; color: var(--muted); }
.tool .acute__note { margin: 28px 0 0; text-align: left; }
@media (max-width: 860px) {
  .tool { grid-template-columns: 1fr; }
  .tool__side { position: static; }
  .tool__topics { display: flex; flex-wrap: wrap; gap: 4px 14px; border-left: 0; }
  .tool__topics button { padding: 4px 0; border-left: 0; }
  .tool__topics button.on { text-decoration: underline; text-underline-offset: 4px; }
  .acute--tool { grid-template-columns: 1fr; }
  .acute--tool .acute__item:nth-child(even) { padding-left: 0; border-left: 0; }
}
@media print { .tool { grid-template-columns: 1fr; } .tool__side { display: none; } }
body[data-page="guides"] .page-intro + .section--compact { padding-top: clamp(16px, 2vw, 28px); }

/* Phones and tablets: comfortable tap sizes (about 44px, Apple's guideline) */
@media (hover: none), (max-width: 860px) {
  .btn, .btn--sm { min-height: 44px; }
  .tool__topics button { padding: 9px 0; }
  .tool__topics { gap: 0 16px; }
}
.side-toc.is-cramped { display: none !important; }

/* Wait-and-watch flowchart on the dosing guide */
.flow { margin: 36px 0 8px; }
.flow__label { font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--pop); text-align: center; margin-bottom: 12px; }
.flow__top, .flow__step, .flow__end { position: relative; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px 14px; font-size: 13.5px; line-height: 1.5; color: var(--muted); text-align: center; }
.flow__top { max-width: 340px; margin: 0 auto; color: var(--dark); font-family: var(--serif); font-size: 1.25rem; line-height: 1.25; padding: 16px 18px; }
.flow__step b { display: block; font-weight: 500; color: var(--dark); margin-bottom: 2px; }
.flow__end { margin-top: 26px; background: none; }
.flow__split { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 44px; }
/* connector: line down from the top box, across the three columns, then down into each */
.flow__split::before { content: ""; position: absolute; left: 50%; top: -44px; height: 22px; border-left: 1px solid var(--muted); }
.flow__split::after { content: ""; position: absolute; left: 16.66%; right: 16.66%; top: -22px; border-top: 1px solid var(--muted); }
.flow__col { position: relative; }
.flow__col::before { content: ""; position: absolute; left: 50%; top: -22px; height: 22px; border-left: 1px solid var(--muted); }
.flow__step::after, .flow__end:not(:last-child)::after { content: ""; position: absolute; left: 50%; bottom: -27px; height: 26px; border-left: 1px solid var(--muted); }
.flow__step::before, .flow__end::before { content: ""; position: absolute; left: calc(50% - 4px); top: -6px; border: 4px solid transparent; border-top-color: var(--muted); }
.flow__top::before { content: none; }
@media (max-width: 640px) {
  .flow__split { grid-template-columns: 1fr; gap: 30px; }
  .flow__split::after { content: none; }
  .flow__col::before { top: -30px; height: 30px; }
  .flow__split::before { top: -44px; height: 44px; }
  .flow__col + .flow__col::before { content: none; }
  .flow__col + .flow__col { padding-top: 0; border-top: 1px solid var(--line); padding-top: 24px; }
}
/* Vibe logo on the standard bottle photo in product cards */
.prod__media { position: relative; }
.prod__logo { position: absolute; left: 50%; top: 62%; width: 18%; aspect-ratio: 900 / 481; transform: translate(-50%, -50%); background: url("/assets/logo-brown-sm.png") center / contain no-repeat; mix-blend-mode: multiply; opacity: .92; pointer-events: none; }
/* Beginner's guide */
.beg-ideas { list-style: none; padding: 0 !important; margin: 18px 0 8px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 22px; }
.beg-ideas li { border-top: 1px solid var(--line); padding: 16px 0 0; margin: 0 !important; }
.beg-ideas .expect__n { font-size: 1.5rem; margin-bottom: 8px; }
.beg-ideas h3 { font-family: var(--serif); font-weight: 400; font-size: 1.3rem; margin: 0 0 6px; }
.beg-ideas p { font-size: 13.5px; line-height: 1.6; color: var(--muted) !important; }
.beg-ways { display: grid; grid-template-columns: 1fr 1fr; gap: 0 22px; margin-top: 14px; }
.beg-ways > div { border-top: 1px solid var(--line); padding-top: 14px; }
.beg-ways h3 { font-family: var(--serif); font-weight: 400; font-size: 1.3rem; margin: 0 0 6px; }
.beg-ways p { font-size: 14px; }
.beg-steps { padding-left: 20px; }
.beg-steps li { margin-bottom: 8px; }
.guide-simple .accordion { margin-top: 14px; }
.guide-simple .prose a, .guide-simple a:not(.btn) { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
@media (max-width: 640px) { .beg-ideas, .beg-ways { grid-template-columns: 1fr; } }
/* ---------- Remedy finder ---------- */
.finder-az-wrap { padding: 8px 0 clamp(28px, 3vw, 40px); }
.finder-az-wrap .wrap { max-width: 1180px; }
.finder-az-wrap .eyebrow { margin-bottom: 12px; }
.finder__az { columns: 4 200px; column-gap: 28px; border-top: 1px solid var(--line); padding-top: 16px; }
.finder__letter { break-inside: avoid; margin-bottom: 12px; }
.finder__letter b { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.3rem; color: var(--pop); line-height: 1; margin-bottom: 4px; }
.finder__letter a { display: block; padding: 2px 0; font-size: 13px; color: var(--muted); }
.finder__letter a:hover { color: var(--dark); }
.finder { border-top: 1px solid var(--line); }
.finder__item { border-bottom: 1px solid var(--line); scroll-margin-top: calc(var(--header-h) + 20px); }
.finder__item[hidden] { display: none; }
.finder__item summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 16px; padding: 16px 0; }
.finder__item summary::-webkit-details-marker { display: none; }
.finder__topic { grid-column: 1; font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--pop); }
.finder__title { grid-column: 1; font-family: var(--serif); font-size: 1.45rem; line-height: 1.15; color: var(--dark); }
.finder__intro { grid-column: 1; font-size: 13.5px; color: var(--muted); }
.finder__count { grid-column: 2; grid-row: 1 / span 3; align-self: center; font-size: 12px; color: var(--muted); white-space: nowrap; }
.finder__count::after { content: "+"; display: inline-block; margin-left: 10px; font-size: 16px; transition: transform .3s var(--ease); }
.finder__item[open] .finder__count::after { transform: rotate(45deg); }
.finder__item summary:hover .finder__title { color: var(--pop); }
.finder__remedies { list-style: none; margin: 0 0 18px; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 26px; }
.finder__remedies li { border-left: 1px solid var(--pop-soft); padding-left: 12px; }
.finder__remedies b { font-weight: 500; font-size: 14px; color: var(--dark); }
.finder__remedies b a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.finder__remedies b a:hover { color: var(--pop); }
.finder__remedies p { margin-top: 2px; font-size: 13.5px; line-height: 1.55; color: var(--muted); }
.finder__item .acute__doc { margin: 0 0 18px; }
@media (max-width: 640px) {
  .finder__remedies { grid-template-columns: 1fr; }
  .finder__count { font-size: 11px; }
}
@media print { .finder__item { break-inside: avoid; } .finder-az-wrap { display: none; } }
/* ---------- Beginner's guide: short and visual ---------- */
.beg-band { padding: clamp(36px, 5vw, 64px) 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.beg-quote { max-width: 760px; margin: 0 auto; text-align: center; font-family: var(--serif); font-size: clamp(1.7rem, 2.8vw, 2.4rem); line-height: 1.2; color: var(--dark); }
.beg-quote em { color: var(--accent); }
.beg-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; max-width: 980px; margin: 0 auto; }
.beg-card { text-align: center; padding: 28px 22px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); }
.beg-card svg { width: 44px; height: 44px; fill: none; stroke: var(--pop); stroke-width: 1.4; margin-bottom: 12px; }
.beg-card h3 { font-size: 1.45rem; margin-bottom: 6px; }
.beg-card p { font-size: 14px; line-height: 1.55; color: var(--muted); max-width: 18em; margin: 0 auto; }
.beg-flow, .beg-steps2 { list-style: none; padding: 0; margin: 0 auto; display: grid; gap: 22px; max-width: 980px; position: relative; }
.beg-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.beg-steps2 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.beg-flow::before, .beg-steps2::before { content: ""; position: absolute; top: 22px; left: 12%; right: 12%; border-top: 1px solid var(--pop-soft); }
.beg-flow li, .beg-steps2 li { position: relative; text-align: center; }
.beg-flow span, .beg-steps2 span { display: grid; place-items: center; width: 44px; height: 44px; margin: 0 auto 12px; border-radius: 50%; background: var(--surface); border: 1px solid var(--pop); color: var(--pop); font-family: var(--serif); font-size: 1.3rem; position: relative; }
.beg-flow h3, .beg-steps2 h3 { font-size: 1.35rem; margin-bottom: 4px; }
.beg-flow p, .beg-steps2 p { font-size: 13.5px; line-height: 1.55; color: var(--muted); max-width: 16em; margin: 0 auto; }
.beg-flow a, .beg-steps2 a, .beg-faq .acc-body a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.beg-ways2 { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; max-width: 820px; margin: 0 auto; }
.beg-way { display: block; padding: 28px 26px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); transition: border-color .3s, transform .3s var(--ease); }
.beg-way:hover { border-color: var(--pop); transform: translateY(-2px); }
.beg-way__label { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--pop); margin-bottom: 6px; }
.beg-way h3 { font-size: 1.6rem; margin-bottom: 6px; }
.beg-way p:not(.beg-way__label) { font-size: 14px; color: var(--muted); }
.beg-way__go { display: inline-block; margin-top: 14px; font-size: 12.5px; color: var(--dark); border-bottom: 1px solid currentColor; }
.beg-faq { max-width: 720px; }
.beg-next { text-align: center; margin-top: 30px; }
@media (max-width: 760px) {
  .beg-cards, .beg-flow, .beg-ways2 { grid-template-columns: 1fr; }
  .beg-steps2 { grid-template-columns: 1fr 1fr; gap: 28px 16px; }
  .beg-flow::before, .beg-steps2::before { content: none; }
}
.beg-card svg { display: block; margin: 0 auto 12px; }

/* "Read more" expanders on the beginner's guide */
.more { max-width: 720px; margin: 28px auto 0; text-align: center; }
.more summary { list-style: none; display: inline-flex; align-items: center; gap: 10px; cursor: pointer; padding: 10px 18px; min-height: 40px; border: 1px solid var(--line); border-radius: 999px; font-size: 13px; color: var(--dark); background: var(--surface); transition: border-color .25s, color .25s; }
.more summary::-webkit-details-marker { display: none; }
.more summary::after { content: "+"; font-size: 16px; line-height: 1; color: var(--pop); transition: transform .3s var(--ease); }
.more[open] summary::after { transform: rotate(45deg); }
.more summary:hover { border-color: var(--pop); color: var(--pop); }
.more[open] summary span::after { content: ""; }
.more__body { text-align: left; margin-top: 20px; padding: 6px 0 4px 18px; border-left: 1px solid var(--pop-soft); }
.more__body h3 { font-size: 1.25rem; margin: 16px 0 4px; }
.more__body h3:first-child { margin-top: 0; }
.more__body p { font-size: 14px; line-height: 1.7; color: var(--muted); }
.more__body a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
@media print { .more__body { display: block !important; } }
.prose .fib__row { margin: 18px 0; }
.prose .note-box a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }

/* ==========================================================================
   Remedy finder: search -> topic tiles -> moments -> compare remedies
   ========================================================================== */
.rf-hero { padding: calc(var(--header-h) + clamp(36px, 5vw, 64px)) 0 clamp(28px, 3.5vw, 44px); text-align: center; }
.rf-hero h1 { font-size: clamp(2.6rem, 4.6vw, 3.8rem); line-height: 1; margin: 6px 0 12px; }
.rf-hero h1 em { color: var(--accent); }
.rf-hero__lead { font-size: 15.5px; color: var(--muted); }
.rf-search { position: relative; max-width: 620px; margin: 22px auto 0; text-align: left; }
.rf-search svg { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.rf-search input { width: 100%; height: 58px; padding: 0 22px 0 52px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); font: inherit; font-size: 16px; color: var(--dark); box-shadow: 0 10px 30px -22px rgba(70, 59, 51, .5); transition: border-color .25s, box-shadow .25s; }
.rf-search input:focus { outline: none; border-color: var(--pop); box-shadow: 0 0 0 4px rgba(104, 120, 82, .12); }
.rf-suggest { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 8px); list-style: none; margin: 0; padding: 8px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 24px 50px -28px rgba(70, 59, 51, .45); }
.rf-suggest li a { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 11px 14px; border-radius: 9px; color: var(--dark); }
.rf-suggest li a b { font-weight: 500; font-size: 15px; }
.rf-suggest li a span { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--pop); }
.rf-suggest li.on a, .rf-suggest li a:hover { background: var(--bg); }
.rf-suggest__all a { font-size: 13.5px; color: var(--muted) !important; border-top: 1px solid var(--line); border-radius: 0 0 9px 9px !important; margin-top: 4px; }
.rf-popular { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin-top: 16px; font-size: 13px; color: var(--muted); }
.rf-popular a { padding: 6px 13px; border: 1px solid var(--line); border-radius: 999px; color: var(--dark); background: var(--surface); transition: border-color .25s, color .25s; }
.rf-popular a:hover { border-color: var(--pop); color: var(--pop); }
.rf-body { padding: clamp(16px, 2vw, 28px) 0 clamp(48px, 6vw, 80px); scroll-margin-top: var(--header-h); min-height: 60vh; }
.rf-body .wrap { max-width: 1120px; }
.rf-h2 { font-size: clamp(1.7rem, 2.4vw, 2.2rem); text-align: center; margin-bottom: 22px; }
.rf-h2 em { color: var(--accent); }
.rf-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 11.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--pop); }
.rf-eyebrow svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.rf-section > .rf-eyebrow { display: flex; justify-content: center; margin-bottom: 6px; }

.rf-tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.rf-tile { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 24px 12px 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); transition: border-color .25s, transform .25s var(--ease), box-shadow .25s; }
.rf-tile svg { width: 40px; height: 40px; fill: none; stroke: var(--pop); stroke-width: 1.4; margin-bottom: 10px; }
.rf-tile h3 { font-size: 1.15rem; line-height: 1.15; }
.rf-tile p { margin-top: 4px; font-size: 12px; color: var(--muted); }
.rf-tile:hover { border-color: var(--pop); transform: translateY(-2px); box-shadow: 0 16px 30px -24px rgba(70, 59, 51, .5); }

.rf-az { max-width: 900px; margin: 34px auto 0; text-align: center; }
.rf-az summary { list-style: none; display: inline-block; cursor: pointer; font-size: 13.5px; color: var(--dark); border-bottom: 1px solid var(--pop-soft); padding-bottom: 2px; }
.rf-az summary::-webkit-details-marker { display: none; }
.rf-az__list { columns: 3 200px; column-gap: 24px; margin-top: 20px; text-align: left; }
.rf-az__list a { display: block; padding: 4px 0; font-size: 13.5px; color: var(--muted); break-inside: avoid; }
.rf-az__list a:hover { color: var(--pop); }

.rf-back { display: inline-block; margin-bottom: 14px; font-size: 13px; color: var(--muted); }
.rf-back:hover { color: var(--dark); }
.rf-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; }
.rf-card { display: flex; flex-direction: column; padding: 20px 20px 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); transition: border-color .25s, transform .25s var(--ease); }
.rf-card:hover { border-color: var(--pop); transform: translateY(-2px); }
.rf-card__topic { font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--pop); }
.rf-card h3 { font-size: 1.35rem; line-height: 1.15; margin: 4px 0 6px; }
.rf-card p { font-size: 13.5px; line-height: 1.55; color: var(--muted); flex: 1; }
.rf-card__go { margin-top: 12px; font-size: 12.5px; color: var(--dark); }
.rf-empty { text-align: center; color: var(--muted); }

.rf-moment { max-width: 980px; margin: 0 auto; text-align: center; }
.rf-moment .rf-eyebrow { justify-content: center; }
.rf-title { font-size: clamp(2.2rem, 3.6vw, 3rem); line-height: 1.02; margin: 8px 0 8px; }
.rf-intro { font-size: 16px; color: var(--dark); }
.rf-how { max-width: 36em; margin: 10px auto 26px; font-size: 13.5px; color: var(--muted); }
.rf-how strong { font-weight: 500; color: var(--dark); }
.rf-remedies { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; text-align: left; }
.rf-remedy { position: relative; display: flex; flex-direction: column; padding: 22px 22px 18px; border: 1px solid var(--line); border-top: 2px solid var(--pop); border-radius: 12px; background: var(--surface); }
.rf-remedy__n { position: absolute; top: 18px; right: 18px; font-family: var(--serif); font-size: 1.3rem; color: var(--pop-soft); }
.rf-remedy h3 { font-size: 1.4rem; line-height: 1.15; padding-right: 26px; }
.rf-remedy p { margin-top: 8px; font-size: 14px; line-height: 1.6; color: var(--muted); flex: 1; }
.rf-remedy__shop { align-self: flex-start; margin-top: 14px; padding: 9px 14px; border-radius: 999px; background: var(--dark); color: var(--bg); font-size: 12px; letter-spacing: .04em; transition: background .25s; }
.rf-remedy__shop:hover { background: var(--pop); }
.rf-remedy__ask { margin-top: 14px; font-size: 12px; color: var(--muted); }
.rf-note { max-width: 40em; margin: 22px auto 0; padding: 10px 16px; border-radius: 10px; background: var(--bg); font-size: 13px; color: var(--dark); }
.rf-next { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 26px; margin-top: 26px; }
.rf-next__link { font-size: 13px; color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.rf-others { margin-top: 30px; padding-top: 22px; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.rf-others p { width: 100%; font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin-bottom: 4px; }
.rf-others a { padding: 6px 13px; border: 1px solid var(--line); border-radius: 999px; font-size: 13px; color: var(--dark); }
.rf-others a:hover { border-color: var(--pop); color: var(--pop); }
.rf-help { padding: 0 0 clamp(48px, 6vw, 72px); }
.rf-help p { max-width: 40em; margin: 0 auto; text-align: center; font-size: 13px; color: var(--muted); }
.rf-help a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
@media (max-width: 1020px) { .rf-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) {
  .rf-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .rf-search input { height: 52px; font-size: 15px; }
  .rf-popular a, .rf-others a { padding: 10px 14px; }
}
/* Beginner's guide: "What is homeopathic medicine?" facts */
.beg-what .centre-head .lead { font-size: 16px; }
.beg-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 980px; margin: 0 auto; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.beg-fact { padding: 26px 18px; text-align: center; }
.beg-fact + .beg-fact { border-left: 1px solid var(--line); }
.beg-fact b { display: block; font-family: var(--serif); font-weight: 400; font-size: clamp(2.4rem, 4vw, 3.2rem); line-height: 1; color: var(--pop); margin-bottom: 8px; }
.beg-fact span { display: block; max-width: 15em; margin: 0 auto; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
@media (max-width: 760px) {
  .beg-facts { grid-template-columns: 1fr 1fr; }
  .beg-fact:nth-child(3) { border-left: 0; }
  .beg-fact:nth-child(n+3) { border-top: 1px solid var(--line); }
}
/* ---------- How to choose a remedy: visual steps ---------- */
.ch-journey { margin-top: 36px; }
.ch-journey a { display: block; color: inherit; }
.ch-journey a:hover h3 { color: var(--pop); }
.ch-step { scroll-margin-top: calc(var(--header-h) - 10px); }
.ch-emergency { text-align: center; margin-top: 18px; font-size: 12.5px; color: var(--muted); }
.beg-way a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.ch-notice { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ch-example { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 22px; max-width: 760px; margin: 28px auto 0; padding: 22px 26px; border-radius: 14px; background: var(--surface); border: 1px dashed var(--pop-soft); }
.ch-example__text { font-size: 15px; color: var(--dark); }
.ch-example__arrow { font-size: 26px; color: var(--pop); }
.ch-example__remedy { font-family: var(--serif); font-size: 1.6rem; }
.ch-example__remedy a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.ch-pictures { max-width: 1000px; margin: 0 auto; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ch-cta { text-align: center; margin-top: 28px; }
.ch-cta p { max-width: 34em; margin: 14px auto 0; font-size: 13.5px; color: var(--muted); }
.ch-cta b { font-weight: 500; color: var(--dark); }
.ch-tips { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; max-width: 980px; margin: 30px auto 0; }
.ch-tips p { padding: 14px 16px; border-top: 1px solid var(--line); font-size: 13.5px; line-height: 1.55; color: var(--muted); }
.ch-tips b { display: block; font-weight: 500; color: var(--dark); margin-bottom: 2px; }
.ch-tips a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.ch-end { display: grid; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: start; max-width: 1040px; }
.ch-faq .h2 { margin-bottom: 18px; }
.ch-faq .acc-body a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.share-row--plain { border: 0 !important; padding: 0 !important; margin-top: 20px !important; display: flex; gap: 10px; }
@media (max-width: 860px) {
  .ch-notice, .ch-pictures { grid-template-columns: 1fr 1fr; }
  .ch-tips { grid-template-columns: 1fr; }
  .ch-end { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .ch-notice, .ch-pictures { grid-template-columns: 1fr; }
  .ch-example { grid-template-columns: 1fr; text-align: center; }
  .ch-example__arrow { transform: rotate(90deg); }
}
/* Footer disclaimer: one clear block */
.disclaimer { margin-top: 8px; }
.disclaimer h4 { font-family: var(--sans); font-size: 11.5px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--bg); margin-bottom: 10px; }
.disclaimer p + p { margin-top: 8px; }
/* ---------- Site search ---------- */
.search-btn { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid currentColor; border-radius: 2px; color: inherit; }
.search-btn svg { width: 18px; height: 18px; }
.site-search { position: fixed; z-index: 95; left: 0; right: 0; top: var(--header-h); max-height: calc(100vh - var(--header-h)); overflow-y: auto; background: var(--surface); border-bottom: 1px solid var(--line); box-shadow: 0 30px 60px -40px rgba(70, 59, 51, .5); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .25s var(--ease), transform .25s var(--ease), visibility 0s linear .25s; }
.search-open .site-search { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.search-open .site-header { background: rgba(245, 239, 231, .97); color: var(--dark); }
.search-open .site-header .logo__img--brown { opacity: 1 !important; }
.search-open .site-header .logo__img--cream { opacity: 0 !important; }
.search-open .site-header .header-actions .btn--dark { background: var(--dark) !important; color: var(--bg) !important; }
.site-search__inner { max-width: 880px; padding-top: 22px; padding-bottom: 28px; }
.site-search__box { position: relative; display: flex; align-items: center; border-bottom: 1px solid var(--dark); }
.site-search__box svg { width: 20px; height: 20px; color: var(--muted); flex: none; }
.site-search__box input { flex: 1; min-width: 0; height: 52px; padding: 0 12px; border: 0; background: transparent; font: inherit; font-size: 18px; color: var(--dark); }
.site-search__box input:focus { outline: none; }
.site-search__close { width: 40px; height: 40px; font-size: 16px; color: var(--muted); }
.site-search__hint { margin: 16px 0 10px; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.site-search__quick { display: flex; flex-wrap: wrap; gap: 8px; }
.site-search__quick a { padding: 8px 14px; border: 1px solid var(--line); border-radius: 999px; font-size: 13.5px; color: var(--dark); }
.site-search__quick a:hover { border-color: var(--pop); color: var(--pop); }
.site-search__groups { display: grid; gap: 18px; }
.site-search__group h3 { font-family: var(--sans); font-size: 11px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--pop); margin-bottom: 4px; }
.site-search__group ul { list-style: none; margin: 0; padding: 0; }
.site-search__group a { display: block; padding: 9px 12px; margin: 0 -12px; border-radius: 8px; color: var(--dark); }
.site-search__group a:hover, .site-search__group a:focus { background: var(--bg); outline: none; }
.site-search__group a b { display: block; font-weight: 500; font-size: 15px; }
.site-search__group a span { display: block; margin-top: 2px; font-size: 13px; line-height: 1.5; color: var(--muted); }
.site-search__group mark { background: var(--pop-soft); color: inherit; padding: 0 1px; border-radius: 2px; }
.site-search__more { margin-top: 2px; font-size: 12.5px; color: var(--muted); border-bottom: 1px solid var(--line); }
.site-search__empty { margin-top: 18px; font-size: 14px; color: var(--muted); }
.site-search__empty a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
@media (max-width: 860px) {
  .search-btn { width: 42px; height: 42px; }
  .site-search__box input { font-size: 16px; }
}
@media (max-width: 420px) { .header-actions { gap: 8px; } .cart-btn { padding: 0 10px; } }
@media print { .site-search, .search-btn { display: none !important; } }
/* Beginner's guide: energy medicine */
.beg-energy__inner { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: clamp(20px, 4vw, 48px); align-items: center; max-width: 860px; margin: 0 auto; padding: clamp(26px, 3.5vw, 40px); border-radius: 16px; background: var(--surface); border: 1px solid var(--line); }
.beg-energy__inner > svg { width: 110px; height: 110px; fill: none; stroke: var(--pop); stroke-width: 1; opacity: .8; }
.beg-energy .h2 { margin: 4px 0 10px; }
.beg-energy__lead { font-family: var(--serif); font-size: clamp(1.35rem, 2vw, 1.6rem); line-height: 1.3; color: var(--dark); }
.beg-energy__text { margin-top: 10px; font-size: 14.5px; line-height: 1.7; color: var(--muted); }
@media (max-width: 640px) { .beg-energy__inner { grid-template-columns: 1fr; text-align: center; } .beg-energy__inner > svg { margin: 0 auto; width: 80px; height: 80px; } }
/* Remedy finder: "keeps coming back?" consult prompt */
.rf-chronic { max-width: 820px; margin: 34px auto 0; padding: clamp(22px, 3vw, 32px); border-radius: 16px; background: var(--dark); color: var(--bg); text-align: center; }
.rf-chronic__label { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--pop-light); }
.rf-chronic h3 { font-size: clamp(1.6rem, 2.4vw, 2rem); line-height: 1.1; margin: 6px 0 10px; color: var(--bg); }
.rf-chronic h3 em { color: var(--pop-light); }
.rf-chronic p:not(.rf-chronic__label) { max-width: 40em; margin: 0 auto; font-size: 14px; line-height: 1.7; color: rgba(245, 239, 231, .82); }
.rf-chronic strong { font-weight: 500; color: var(--bg); }
.rf-chronic__actions { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 12px 22px; margin-top: 18px; }
.rf-chronic .btn--dark { background: var(--bg); color: var(--dark); }
.rf-chronic .btn--dark:hover { background: var(--pop-light); }
.rf-chronic__link { font-size: 13px; color: var(--bg); border-bottom: 1px solid rgba(245, 239, 231, .45); }
.rf-moment .rf-chronic { margin-top: 30px; }
/* Remedy finder: acute or chronic */
.rf-ac { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-top: 18px; text-align: left; }
.rf-ac__col { display: flex; flex-direction: column; align-items: flex-start; padding: 4px 24px; }
.rf-ac__col + .rf-ac__col { border-left: 1px solid rgba(245, 239, 231, .2); }
.rf-ac__col h4 { font-family: var(--serif); font-weight: 400; font-size: 1.5rem; color: var(--pop-light); margin-bottom: 6px; }
.rf-chronic .rf-ac__col p { margin: 0 0 14px; flex: 1; text-align: left; }
@media (max-width: 640px) {
  .rf-ac { grid-template-columns: 1fr; gap: 18px; }
  .rf-ac__col { padding: 0; }
  .rf-ac__col + .rf-ac__col { border-left: 0; border-top: 1px solid rgba(245, 239, 231, .2); padding-top: 18px; }
}
.rf-chronic .btn--line-light { color: var(--bg); border-color: rgba(245, 239, 231, .55); }
.rf-chronic .btn--line-light:hover { background: var(--bg); color: var(--dark); }

/* Guide pages: warm sand-blush instead of the pale sage (cheat cards, underlines, connecting lines) */
body[data-page="guides"] { --pop-soft: #E6D3C2; }
body[data-page="guides"] .cheat { background: linear-gradient(160deg, #EFE2D5, #E6D3C2); }
body[data-page="guides"] .cheat li i { background: var(--surface); color: var(--accent); }
body[data-page="guides"] .cheat__foot { color: var(--muted); }
/* ---------- How often to dose (visual) ---------- */
.dose-rule { margin-top: 16px; padding-left: 12px; border-left: 2px solid var(--pop-soft); font-size: 13.5px; color: var(--muted); }
.dose-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dose-tip { max-width: 680px; margin: 22px auto 0; text-align: center; font-size: 14px; color: var(--muted); }
.dose-tip b, .dose-tip strong { font-weight: 500; color: var(--dark); }
.dose-tip a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.dose-pace { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; max-width: 1000px; margin: 0 auto; }
.dose-pace__item { position: relative; padding: 22px 20px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line); text-align: center; }
.dose-pace__item:nth-child(n+3)::before { content: "→"; position: absolute; left: -13px; top: 50%; transform: translateY(-50%); color: var(--accent); font-size: 14px; }
.dose-pace__tag { display: inline-block; padding: 4px 10px; border-radius: 999px; background: var(--bg); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.dose-pace__item h3 { font-size: 1.45rem; margin: 12px 0 6px; }
.dose-pace__item p { font-size: 13.5px; line-height: 1.55; color: var(--muted); }
.dose-pace__item--stop { background: var(--dark); border-color: var(--dark); }
.dose-pace__item--stop h3 { color: var(--bg); }
.dose-pace__item--stop p { color: rgba(245, 239, 231, .8); }
.dose-pace__item--stop .dose-pace__tag { background: rgba(245, 239, 231, .14); color: var(--bg); }
.dose-flow { max-width: 1000px; margin: 44px auto 0; }
.dose-kids { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 64px); align-items: center; max-width: 1000px; }
.dose-kids__img { border-radius: 16px; overflow: hidden; aspect-ratio: 4 / 3; }
.dose-kids__img img { width: 100%; height: 100%; object-fit: cover; }
.dose-kids .h2 { margin: 6px 0 14px; }
.dose-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.dose-list li { position: relative; padding-left: 22px; font-size: 14.5px; line-height: 1.6; color: var(--muted); }
.dose-list li::before { content: ""; position: absolute; left: 0; top: .7em; width: 10px; height: 1px; background: var(--accent); }
@media (max-width: 860px) {
  .dose-cards { grid-template-columns: 1fr 1fr; }
  .dose-pace { grid-template-columns: 1fr 1fr; }
  .dose-pace__item:nth-child(3)::before { display: none; }
  .dose-kids { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .dose-cards, .dose-pace { grid-template-columns: 1fr; }
  .dose-pace__item:nth-child(n+3)::before { content: "↓"; left: 50%; top: -15px; transform: translateX(-50%); display: block !important; }
}
/* ---------- Remedy profiles: top 50 ---------- */
.rp-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 14px; }
.rp-chip { padding: 7px 14px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); font: inherit; font-size: 12.5px; color: var(--dark); cursor: pointer; transition: border-color .25s, background .25s, color .25s; }
.rp-chip:hover { border-color: var(--pop); }
.rp-chip.on { background: var(--dark); border-color: var(--dark); color: var(--bg); }
.rp-count { text-align: center; font-size: 12px; letter-spacing: .08em; color: var(--muted); margin-bottom: 22px; }
.rp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.rp-tile { display: flex; flex-direction: column; padding: 18px 18px 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); transition: border-color .25s, transform .25s var(--ease), box-shadow .25s; }
.rp-tile:hover { border-color: var(--pop); transform: translateY(-2px); box-shadow: 0 16px 30px -24px rgba(70, 59, 51, .5); }
.rp-tile__abbr { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 14px; border-radius: 12px; background: linear-gradient(160deg, #EFE2D5, #E6D3C2); font-family: var(--serif); font-size: 1.2rem; color: var(--dark); }
.rp-tile h3 { font-size: 1.3rem; line-height: 1.12; }
.rp-tile__src { margin-top: 2px; font-size: 11.5px; letter-spacing: .06em; color: var(--muted); }
.rp-tile__key { margin-top: 10px; font-family: var(--serif); font-style: italic; font-size: 1.02rem; line-height: 1.35; color: var(--dark); }
.rp-profile { max-width: 980px; margin: 0 auto; }
.rp-profile__head { display: flex; align-items: center; gap: clamp(18px, 3vw, 30px); margin-bottom: 26px; }
.rp-profile__abbr { flex: none; display: grid; place-items: center; width: clamp(84px, 11vw, 116px); aspect-ratio: 1; border-radius: 20px; background: linear-gradient(160deg, #EFE2D5, #E6D3C2); font-family: var(--serif); font-size: clamp(1.7rem, 3vw, 2.4rem); color: var(--dark); }
.rp-profile .rf-title { margin: 4px 0 6px; }
.rp-profile__key { font-family: var(--serif); font-style: italic; font-size: clamp(1.15rem, 1.8vw, 1.4rem); line-height: 1.3; color: var(--muted); }
.rp-pic { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.rp-pic__box { padding: 20px 20px 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.rp-pic__box svg { width: 28px; height: 28px; fill: none; stroke: var(--pop); stroke-width: 1.6; }
.rp-pic__box h4 { margin: 8px 0 4px; font-size: 11px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.rp-pic__box p { font-size: 14.5px; line-height: 1.55; color: var(--dark); }
.rp-pic__box:first-child { background: var(--dark); border-color: var(--dark); }
.rp-pic__box:first-child svg { stroke: #E6D3C2; }
.rp-pic__box:first-child h4 { color: rgba(245, 239, 231, .7); }
.rp-pic__box:first-child p { color: var(--bg); }
.rp-sub { margin: 38px 0 14px; font-size: clamp(1.5rem, 2.4vw, 1.9rem); text-align: center; }
.rp-moments__topic { font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--pop); }
.rp-moments .rf-remedy h3 { margin-top: 4px; padding-right: 0; }
.rp-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 30px; }
.rp-nav { display: flex; justify-content: space-between; gap: 14px; margin-top: 34px; padding-top: 20px; border-top: 1px solid var(--line); }
.rp-nav a { display: flex; flex-direction: column; gap: 2px; font-family: var(--serif); font-size: 1.2rem; color: var(--dark); }
.rp-nav a:last-child { text-align: right; }
.rp-nav a span { font-family: var(--sans); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.rp-nav a:hover { color: var(--pop); }
@media (max-width: 720px) {
  .rp-pic { grid-template-columns: 1fr; }
  .rp-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .rp-tile { padding: 14px; }
  .rp-tile__abbr { width: 44px; height: 44px; margin-bottom: 10px; font-size: 1.05rem; }
  .rp-tile h3 { font-size: 1.12rem; }
  .rp-tile__key { font-size: .95rem; }
}
@media (hover: none) { .rp-chip { min-height: 44px; } }
.rp-pic__box h4 { font-family: var(--sans); }
.rp-moments .rf-remedy { border-top-width: 1px; padding: 18px 20px 16px; }
.rp-moments .rf-remedy__shop { align-self: flex-start; margin-top: 10px; padding: 0; background: none; border: 0; border-bottom: 1px solid var(--pop-soft); border-radius: 0; color: var(--dark); font-size: 12.5px; font-weight: 400; }
.rp-moments .rf-remedy__shop:hover { background: none; color: var(--pop); }
/* ---------- Consultations (inviting, simple) ---------- */
.cx-hero { padding: calc(var(--header-h) + 24px) 0 clamp(40px, 5vw, 64px); }
.cx-hero .article-hero__grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
.cx-hero h1 { font-size: clamp(2.5rem, 4.4vw, 3.7rem); line-height: 1.02; letter-spacing: -.01em; margin: 8px 0 16px; }
.cx-hero .lead { font-size: 16px; line-height: 1.65; max-width: 32em; }
.cx-hero .article-hero__img { max-width: 460px; justify-self: end; aspect-ratio: 4 / 5; border-radius: 18px; }
.cx-hero__btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.cx-trust { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 26px 0 0; padding: 0; font-size: 13px; color: var(--muted); }
.cx-trust li { display: inline-flex; align-items: center; gap: 8px; }
.cx-trust svg { width: 18px; height: 18px; fill: none; stroke: var(--pop); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.cx-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; max-width: 1060px; margin: 0 auto; align-items: stretch; }
.cx-card { position: relative; display: flex; flex-direction: column; padding: 28px 26px 26px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); transition: transform .3s var(--ease), box-shadow .3s; }
.cx-card:hover { transform: translateY(-3px); box-shadow: 0 22px 40px -30px rgba(70, 59, 51, .55); }
.cx-card__ask { font-family: var(--serif); font-style: italic; font-size: 1.1rem; color: var(--accent); }
.cx-card h3 { font-size: 1.75rem; line-height: 1.1; margin: 6px 0 12px; }
.cx-card__price { display: flex; align-items: baseline; gap: 10px; padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px solid var(--line); }
.cx-card__price span { font-family: var(--serif); font-size: 2.2rem; line-height: 1; color: var(--dark); }
.cx-card__price small, .cx-follow__price small { font-size: 12px; letter-spacing: .06em; color: var(--muted); }
.cx-card__text { font-size: 14px; line-height: 1.6; color: var(--muted); flex: 1; }
.cx-card .btn { align-self: flex-start; margin-top: 20px; }
.cx-ticks { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 6px; }
.cx-ticks li { position: relative; padding-left: 24px; font-size: 13.5px; }
.cx-ticks li::before { content: ""; position: absolute; left: 2px; top: .35em; width: 10px; height: 5px; border-left: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); }
.cx-card--main { background: var(--dark); border-color: var(--dark); color: var(--bg); }
.cx-card--main h3, .cx-card--main .cx-card__price span { color: var(--bg); }
.cx-card--main .cx-card__ask { color: #E6D3C2; }
.cx-card--main .cx-card__text, .cx-card--main .cx-card__price small { color: rgba(245, 239, 231, .75); }
.cx-card--main .cx-card__price { border-color: rgba(245, 239, 231, .16); }
.cx-card__badge { position: absolute; top: -12px; left: 26px; padding: 5px 12px; border-radius: 999px; background: #E6D3C2; color: var(--dark); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; }
.cx-follow { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 32px; max-width: 1060px; margin: 18px auto 0; padding: 34px 36px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.cx-follow h3 { font-size: clamp(1.7rem, 2.4vw, 2.1rem); margin: 4px 0 8px; }
.cx-follow p { font-size: 15px; line-height: 1.6; color: var(--muted); max-width: 520px; }
.cx-follow__price { display: flex; align-items: baseline; gap: 8px; }
.cx-follow__price span { font-family: var(--serif); font-size: 2.2rem; line-height: 1; color: var(--dark); }
.cx-free { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); max-width: 1060px; margin: 0 auto; border-radius: 22px; overflow: hidden; background: linear-gradient(160deg, #EFE2D5, #E6D3C2); }
.cx-free__img { min-height: 320px; }
.cx-free__img img { width: 100%; height: 100%; object-fit: cover; }
.cx-free__body { padding: clamp(28px, 4vw, 52px); align-self: center; }
.cx-free__tag { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.cx-free h2 { font-size: clamp(2rem, 3.2vw, 2.7rem); line-height: 1.05; margin: 10px 0 12px; }
.cx-free__body > p:not(.cx-free__tag):not(.cx-free__small) { font-size: 15px; line-height: 1.65; color: var(--dark); margin-bottom: 22px; max-width: 30em; }
.cx-free__small { margin-top: 14px; font-size: 12.5px; color: var(--muted); }
.cx-free__small a { color: var(--dark); border-bottom: 1px solid currentColor; }
.cx-steps { margin-top: 10px; }
.cx-faq { max-width: 760px; }
.cx-faq .h2 { text-align: center; }
.cx-faq .accordion summary { font-size: 15px; font-weight: 400; }
.cx-faq .acc-body { font-size: 14.5px; }
.cx-cta { padding: clamp(56px, 7vw, 90px) 0; background: var(--dark); text-align: center; }
.cx-cta__quote { font-family: var(--serif); font-size: clamp(2.2rem, 4vw, 3.2rem); line-height: 1.05; color: var(--bg); margin-bottom: 22px; }
.cx-cta__quote em { color: #E6D3C2; }
@media (max-width: 900px) {
  .cx-cards { grid-template-columns: 1fr; max-width: 520px; gap: 26px; }
  .cx-follow { grid-template-columns: 1fr; gap: 10px; max-width: 520px; margin-top: 26px; }
  .cx-follow .btn { justify-self: start; }
  .cx-free { grid-template-columns: 1fr; }
  .cx-free__img { min-height: 220px; max-height: 260px; }
}
@media (max-width: 860px) {
  .cx-hero .article-hero__grid { grid-template-columns: 1fr; }
  .cx-hero .article-hero__img { justify-self: start; max-width: 100%; aspect-ratio: 4 / 3; }
}
.cx-free__img { position: relative; }
.cx-free__img img { position: absolute; inset: 0; }
.cx-hero .article-hero__img { max-width: 420px; aspect-ratio: 5 / 6; }
/* ---------- First aid kit page ---------- */
.kit-hero__name { display: none; }
.kit-hero__title { font-size: clamp(2.3rem, 4vw, 3.4rem); line-height: 1.02; letter-spacing: -.01em; margin: 12px 0 14px; }
.kit-hero__title em { color: var(--accent); }
.kit-hero__lead { font-size: 15px; line-height: 1.65; color: var(--muted); margin-bottom: 18px; max-width: 34em; }
.kit-perks { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 22px 0 0; padding: 18px 0 0; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); }
.kit-perks li { display: inline-flex; align-items: center; gap: 8px; }
.kit-perks svg { width: 18px; height: 18px; fill: none; stroke: var(--pop); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.kit-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; max-width: 1060px; margin: 0 auto; }
.kit-moment { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 26px 16px 22px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); transition: border-color .25s, transform .25s var(--ease), box-shadow .25s; }
.kit-moment:hover { border-color: var(--pop); transform: translateY(-3px); box-shadow: 0 18px 32px -26px rgba(70, 59, 51, .55); }
.kit-moment svg { width: 44px; height: 44px; padding: 10px; box-sizing: content-box; border-radius: 50%; background: linear-gradient(160deg, #EFE2D5, #E6D3C2); fill: none; stroke: var(--dark); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 14px; }
.kit-moment h3 { font-size: 1.3rem; line-height: 1.15; }
.kit-moment p { margin-top: 4px; font-size: 13px; line-height: 1.5; color: var(--muted); }
.kit-why { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; max-width: 1060px; }
.kit-why__img { border-radius: 20px; overflow: hidden; aspect-ratio: 4 / 5; max-height: 560px; }
.kit-why__img img { width: 100%; height: 100%; object-fit: cover; }
.kit-why .h2 { margin: 6px 0 24px; }
.kit-why__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.kit-why__list li { display: flex; gap: 16px; align-items: flex-start; }
.kit-why__list span { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--pop); color: var(--pop); font-family: var(--serif); font-size: 1.2rem; }
.kit-why__list h3 { font-size: 1.3rem; }
.kit-why__list p { margin-top: 2px; font-size: 14px; line-height: 1.6; color: var(--muted); }
.kit-sizes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; max-width: 820px; margin: 0 auto; }
.kit-size { padding: 30px 28px 28px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.kit-size__n { font-family: var(--serif); font-size: clamp(3.4rem, 6vw, 4.6rem); line-height: .9; color: var(--accent); }
.kit-size__n::after { content: " remedies"; font-family: var(--sans); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.kit-size h3 { font-size: 1.5rem; margin: 14px 0 6px; }
.kit-size p:last-child { font-size: 14px; line-height: 1.6; color: var(--muted); }
.kit-size--big { background: var(--dark); border-color: var(--dark); }
.kit-size--big .kit-size__n { color: #E6D3C2; }
.kit-size--big .kit-size__n::after { color: rgba(245, 239, 231, .7); }
.kit-size--big h3 { color: var(--bg); }
.kit-size--big p:last-child { color: rgba(245, 239, 231, .78); }
.kit-sizes__go { text-align: center; margin-top: 26px; }
.kit-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 820px; }
.kit-steps a { display: block; color: inherit; border: 0; }
.kit-steps a:hover h3 { color: var(--pop); }
@media (max-width: 900px) {
  .kit-grid { grid-template-columns: 1fr 1fr; }
  .kit-why { grid-template-columns: 1fr; }
  .kit-why__img { aspect-ratio: 4 / 3; }
}
@media (max-width: 560px) {
  .kit-sizes { grid-template-columns: 1fr; }
  .kit-steps { grid-template-columns: 1fr; }
  .kit-moment { padding: 20px 12px 18px; }
}
.signup__msg { margin-top: 10px; min-height: 1em; font-size: 13px; color: rgba(245, 239, 231, .75); }
.signup__msg:empty { display: none; }

/* ---------- Privacy, terms and shipping ---------- */
.legal-hero { padding: calc(var(--header-h) + 24px) 0 clamp(28px, 4vw, 44px); }
.legal-hero h1 { font-size: clamp(2.4rem, 4vw, 3.4rem); line-height: 1.02; letter-spacing: -.01em; margin: 14px 0 12px; }
.legal-hero h1 em { color: var(--accent); }
.legal-hero .lead { font-size: 16px; max-width: 36em; }
.legal-updated { margin-top: 12px; font-size: 12px; letter-spacing: .08em; color: var(--muted); }
.legal-body { max-width: 760px; padding-bottom: clamp(56px, 7vw, 96px); }
.legal-body .prose h2 { font-size: clamp(1.4rem, 2.2vw, 1.75rem); margin: 34px 0 10px; }
.legal-body .prose h2:first-child { margin-top: 0; }
.legal-body .prose p, .legal-body .prose li { font-size: 15px; line-height: 1.7; color: var(--muted); }
.legal-body .prose strong { color: var(--dark); font-weight: 500; }
.legal-body .prose ul { padding-left: 18px; display: grid; gap: 8px; }
.legal-body .prose a { color: var(--dark); border-bottom: 1px solid var(--pop-soft, #E6D3C2); }
.legal-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 36px; }
.legal-facts div { padding: 18px 16px; border-radius: 14px; background: linear-gradient(160deg, #EFE2D5, #E6D3C2); text-align: center; }
.legal-facts b { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.5rem; color: var(--dark); }
.legal-facts span { font-size: 12.5px; color: var(--muted); }
@media (max-width: 560px) { .legal-facts { grid-template-columns: 1fr; } }
.legal-hero .wrap { max-width: 760px; }

/* Five range cards fit on one row on laptops */
#more .products { grid-template-columns: repeat(auto-fit, minmax(150px, 196px)); }

/* ---------- Potency guide (visual) ---------- */
.pot-journey { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 820px; }
.pot-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; max-width: 900px; margin: 0 auto; }
.pot-card { padding: 26px 24px 24px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); text-align: center; }
.pot-card__n { font-family: var(--serif); font-size: clamp(2.6rem, 4.4vw, 3.4rem); line-height: 1; color: var(--accent); margin-bottom: 12px; }
.pot-card p:last-child { font-size: 14px; line-height: 1.6; color: var(--muted); }
.pot-card:last-child { background: var(--dark); border-color: var(--dark); }
.pot-card:last-child .pot-card__n { color: #E6D3C2; }
.pot-card:last-child p:last-child { color: rgba(245, 239, 231, .78); }
.pot-fib { max-width: 900px; margin: 0 auto; padding: clamp(22px, 3vw, 34px); border-radius: 20px; background: linear-gradient(160deg, #EFE2D5, #E6D3C2); }
.pot-fib .fib__row { justify-content: center; margin: 0 0 22px; border-color: rgba(70, 59, 51, .15); }
.pot-fib__points { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 28px; }
.pot-fib__points h3 { font-size: 1.3rem; margin-bottom: 4px; }
.pot-fib__points p { font-size: 14px; line-height: 1.6; color: var(--muted); }
@media (max-width: 720px) {
  .pot-cards, .pot-fib__points { grid-template-columns: 1fr; }
  .pot-journey { grid-template-columns: 1fr; }
}

/* ---------- Calmer headline sizes (smaller is better) ---------- */
body[data-page="404"] .page-hero h1 { font-size: clamp(2.6rem, 5vw, 4.4rem); line-height: 1; }
/* Home heading: sized to the screen so "A natural system of medicine," stays on one line on laptops and desktops. */
.hero .display { font-size: clamp(2.6rem, 5.3vw, 5.1rem); }
.hero__copy { max-width: 820px; }
.hero__copy .lead { max-width: 32em; }

/* Until Leah's own photo is added, the empty photo box is hidden and the other photo fills the space. */
.intro__pics:has(.placeholder) { grid-template-columns: 1fr; max-width: 380px; }
.intro__pics .placeholder { display: none; }
.intro__pics:has(.placeholder) .pic--short { aspect-ratio: 4 / 5; }
.article-hero [data-share] { margin-top: 6px; }
.cart-msg { margin-top: 10px; font-size: 13px; line-height: 1.5; color: var(--accent-deep, var(--dark)); }
.cart-msg:empty { display: none; }

.order-done { padding-bottom: clamp(70px, 9vw, 120px); }
.order-done__btns { display: flex; flex-wrap: wrap; gap: 10px; margin: 26px 0 8px; }
.order-done .legal-updated a { color: var(--dark); border-bottom: 1px solid currentColor; }

/* ---------- Waitlist (coming-soon products) ---------- */
.waitlist { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.waitlist__label { display: block; font-family: var(--serif); font-size: 1.35rem; line-height: 1.2; margin-bottom: 12px; }
.waitlist__row { display: flex; gap: 8px; }
.waitlist__row input[type="email"] { flex: 1; min-width: 0; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); padding: 12px 16px; font: inherit; font-size: 15px; }
.waitlist__row input[type="email"]:focus { outline: 2px solid var(--pop); outline-offset: 1px; }
.waitlist__msg { font-size: 13px; color: var(--accent-deep); margin-top: 8px; }
.waitlist__msg:empty { display: none; }
.waitlist__note { font-size: 12.5px; color: var(--muted); margin-top: 8px; }
.waitlist__done { font-family: var(--serif); font-size: 1.4rem; line-height: 1.25; }
@media (max-width: 480px) { .waitlist__row { flex-direction: column; } }

/* ---------- Gift voucher code in the cart ---------- */
.cart-voucher { margin: 4px 0 12px; font-size: 14px; }
.cart-voucher summary { cursor: pointer; color: var(--muted); text-decoration: underline; text-underline-offset: 3px; list-style: none; }
.cart-voucher summary::-webkit-details-marker { display: none; }
.cart-voucher__form { display: flex; gap: 8px; margin-top: 10px; }
.cart-voucher__form input { flex: 1; min-width: 0; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); padding: 10px 14px; font: inherit; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; }
.cart-voucher__msg, .cart-voucher__note { color: var(--accent-deep); text-align: left; margin-top: 6px; }
.cart-voucher__msg:empty { display: none; }
.cart-voucher__remove { margin-left: 6px; font-size: 12px; color: var(--muted); text-decoration: underline; }

/* ---------- Gift vouchers page ---------- */
.gift-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: start; max-width: 1080px; }
.gift-preview { position: sticky; top: calc(var(--header-h) + 20px); }
/* Gift voucher card, "A. Bone card" from the style guide (Leah, 26 Oct 2026): light bone card, thin latte frame,
   brown logo, the amount in Instrument Serif with one sage italic word, and the code in a small sage box. */
.gift-card { position: relative; background: var(--surface); color: var(--ink); border-radius: var(--r); padding: clamp(24px, 3.2vw, 36px); padding-top: clamp(96px, 9.5vw, 116px); min-height: clamp(270px, 27vw, 310px); display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; overflow: hidden; box-shadow: 0 1px 0 rgba(42, 28, 22, .05), 0 18px 40px -22px rgba(94, 80, 69, .35); }
.gift-card::after { content: ""; position: absolute; inset: 10px; border: 1px solid var(--stone); border-radius: var(--r-sm); pointer-events: none; }
.gift-card__logo { position: absolute; top: clamp(22px, 3vw, 32px); left: clamp(24px, 3.2vw, 36px); width: clamp(84px, 9vw, 104px); height: auto; }
.gift-card__kind { position: absolute; top: clamp(30px, 3.6vw, 40px); right: clamp(24px, 3.2vw, 36px); font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--pop); }
.gift-card__value { font-family: var(--serif); font-size: clamp(2.1rem, 3.8vw, 2.9rem); line-height: 1; color: var(--ink); }
.gift-card__value em { color: var(--pop); }
.gift-card__names { font-size: 14px; color: var(--muted); }
.gift-card__msg { font-family: var(--serif); font-style: italic; font-size: 1.1rem; line-height: 1.3; color: var(--dark); overflow-wrap: anywhere; }
.gift-card__code { display: inline-flex; align-self: flex-start; align-items: center; gap: 12px; margin-top: 12px; padding: 9px 14px; background: var(--pop); color: var(--surface); border-radius: var(--r-sm); }
.gift-card__code span { font-size: 9.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--pop-soft); }
.gift-card__code b { font-family: ui-monospace, Menlo, Consolas, monospace; font-weight: 500; font-size: 1rem; letter-spacing: .12em; }
.gift-card__small { font-size: 12px; line-height: 1.5; color: var(--muted); margin-top: 4px; }
.gift-form { display: grid; gap: 22px; }
.gift-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.gift-form__type { display: grid; gap: 10px; }
.gift-opt { display: block; cursor: pointer; }
.gift-opt input, .gift-chip input { position: absolute; opacity: 0; pointer-events: none; }
.gift-opt span { display: block; border: 1px solid var(--line); border-radius: var(--r-sm); padding: 14px 18px; background: var(--surface); transition: border-color .2s; }
.gift-opt b { display: block; font-weight: 500; }
.gift-opt small { display: block; color: var(--muted); font-size: 13.5px; margin-top: 2px; }
.gift-opt input:checked + span, .gift-chip input:checked + span { border-color: var(--pop); box-shadow: inset 0 0 0 1px var(--pop); }
.gift-opt input:focus-visible + span, .gift-chip input:focus-visible + span { outline: 2px solid var(--pop); outline-offset: 2px; }
.gift-amounts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.gift-chip { cursor: pointer; }
.gift-chip span { display: grid; place-items: center; min-height: 48px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); font-family: var(--serif); font-size: 1.35rem; }
.gift-form__names { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.gift-form .input { width: 100%; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); padding: 13px 16px; font: inherit; font-size: 15px; resize: vertical; }
.gift-form .input:focus { outline: 2px solid var(--pop); outline-offset: 1px; }
.gift-form__hint { display: block; font-size: 12.5px; line-height: 1.5; color: var(--muted); margin-top: 6px; }
.gift-form__count { display: block; text-align: right; font-size: 12px; color: var(--muted); margin-top: 4px; }
.gift-form__msg { font-size: 13px; color: var(--accent-deep); }
.gift-form__msg:empty { display: none; }
.gift-form__note { font-size: 13px; color: var(--muted); margin-top: -10px; }
.gift-know { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: clamp(28px, 5vw, 72px); max-width: 1080px; }
.gift-know__list { list-style: none; padding: 0; margin: 0; }
.gift-know__list li { padding: 14px 0; border-top: 1px solid var(--line); font-size: 15.5px; line-height: 1.6; }
.gift-know__list li:last-child { border-bottom: 1px solid var(--line); }
.gift-know__list li { display: flex; gap: 14px; align-items: flex-start; }
.gift-know__list svg, .gift-opt__icon { flex: none; width: 22px; height: 22px; fill: none; stroke: var(--pop); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; margin-top: 2px; }
.gift-opt span { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; align-items: center; }
.gift-opt__icon { grid-row: span 2; margin-top: 0; }
.gift-done__list { display: grid; gap: 24px; max-width: 560px; margin: 0 auto; }
.gift-done__list .gift-card { aspect-ratio: auto; min-height: 320px; padding-top: 110px; }
.gift-done__print { text-align: center; margin-top: 26px; }
@media (max-width: 860px) {
  .gift-grid, .gift-know { grid-template-columns: 1fr; }
  .gift-preview { position: static; max-width: 460px; }
}
@media (max-width: 480px) {
  .gift-amounts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gift-form__names { grid-template-columns: 1fr; }
  .gift-card { aspect-ratio: auto; min-height: 230px; padding-top: 90px; }
}
#take .dose-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 1080px; }
@media (max-width: 1020px) { #take .dose-cards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { #take .dose-cards { grid-template-columns: 1fr; } }
/* Remedy page: keynotes and "A bit more about the remedy" */
.pdp__source { font-size: 12px; color: var(--muted); margin: -6px 0 18px; letter-spacing: .02em; }
.acc-key { font-family: var(--serif); font-size: 1.2rem; line-height: 1.3; color: var(--ink); }
.acc-pic { margin: 10px 0 12px; display: grid; gap: 6px; }
.acc-pic div { display: grid; grid-template-columns: 92px 1fr; gap: 10px; padding-top: 6px; border-top: 1px solid var(--line); font-size: 14.5px; }
.acc-pic dt { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--pop); padding-top: 2px; }
.acc-pic dd { margin: 0; color: var(--ink); }
.acc-link { color: var(--dark); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- In-between window sizes (half screen, small laptops, tablets) ---------- */
/* Keep "Book now" in the header whenever there's room. */
@media (max-width: 1120px) and (min-width: 600px) {
  .header-actions .btn { display: inline-flex; height: 42px; padding: 0 16px; font-size: 12px; }
  .header-actions { gap: 10px; }
}
/* The menu slides in from the right as a panel (like the cart), instead of covering the whole screen. */
@media (max-width: 1120px) and (min-width: 700px) {
  .mobile-menu { left: auto; right: 0; width: min(420px, 92vw); padding: calc(var(--header-h) + 24px) 36px 32px; transform: translateX(28px); box-shadow: 0 0 0 100vmax rgba(42, 28, 22, .45); }
  .menu-open .mobile-menu { transform: none; }
  .menu-open .site-header { color: var(--dark); }
  .menu-open .site-header[data-tone="light"]:not(.is-scrolled) { color: var(--bg); }
  .menu-open .site-header:not([data-tone="light"]) .logo__img--brown, .menu-open .site-header.is-scrolled .logo__img--brown { opacity: 1; }
  .menu-open .site-header:not([data-tone="light"]) .logo__img--cream, .menu-open .site-header.is-scrolled .logo__img--cream { opacity: 0; }
  .menu-open .header-actions { color: var(--bg); }
  .menu-open .header-actions .btn--dark { background: var(--bg) !important; color: var(--dark) !important; }
  .mobile-menu nav > a { font-size: 1.9rem; line-height: 1.2; margin-top: 10px; }
  .mobile-menu nav > a:first-child { margin-top: 0; }
  .mobile-menu nav .mm-sub { gap: 2px 14px; margin: 4px 0 8px; }
  .mobile-menu nav .mm-sub a { font-size: 13.5px; }
}
/* Shop pages in one column: the photo is centred and a good size, not stuck on the left. */
@media (max-width: 860px) {
  .pdp__gallery { max-width: 560px; width: 100%; margin: 0 auto; }
}

/* ---------- About homeopathy page ---------- */
.ah-what { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 72px); max-width: 1080px; align-items: start; }
.ah-what__text p { font-size: 16px; line-height: 1.75; color: var(--muted); }
.ah-what__text p + p { margin-top: 14px; }
.ah-btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
/* Timeline: a row of swipeable cards joined by a thin line. */
.ah-track__bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; max-width: 1180px; margin: 0 auto 18px; }
.ah-track__hint { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.ah-track__btns { display: flex; gap: 8px; }
.ah-track__btn { width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--line); background: var(--surface); color: var(--dark); font-size: 16px; cursor: pointer; transition: background .2s, border-color .2s; }
.ah-track__btn:hover { background: var(--bone); border-color: var(--pop-soft); }
.ah-track { list-style: none; margin: 0 auto; padding: 0 0 14px; max-width: 1180px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 270px); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: thin; scrollbar-color: var(--pop-soft) transparent; }
.ah-track:focus-visible { outline: 2px solid var(--pop-soft); outline-offset: 4px; }
.ah-track li { scroll-snap-align: start; position: relative; padding-top: 30px; }
.ah-track li::before { content: ""; position: absolute; left: 0; right: -16px; top: 5px; border-top: 1px solid var(--pop-soft); }
.ah-track li:last-child::before { right: 0; }
.ah-track li::after { content: ""; position: absolute; left: 22px; top: 0; width: 11px; height: 11px; border-radius: 50%; background: var(--pop); box-shadow: 0 0 0 4px var(--surface); }
.ah-track li > div { height: 100%; padding: 20px 22px 22px; border: 1px solid var(--line); border-radius: var(--r); background: var(--bone); }
.ah-track__year { display: block; font-family: var(--serif); font-style: italic; font-size: 1.9rem; line-height: 1; color: var(--accent); margin: 0 0 12px 22px; }
.ah-track li { display: flex; flex-direction: column; }
.ah-track li > .ah-track__year { order: -1; }
.ah-track h3 { font-size: 1.2rem; line-height: 1.2; margin-bottom: 6px; }
.ah-track p { font-size: 14px; line-height: 1.6; color: var(--muted); }
.ah-track li:last-child > div { background: var(--dark); border-color: var(--dark); }
.ah-track li:last-child h3 { color: var(--bone); }
.ah-track li:last-child p { color: rgba(245, 239, 231, .78); }
/* Calm, smaller headings on the About pages (Leah's minimal style). */
body[data-page="about"] .article-hero__grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); align-items: center; }
body[data-page="about"] .article-hero h1 { font-size: clamp(2.4rem, 4vw, 3.4rem); line-height: 1.02; letter-spacing: -.01em; margin: 6px 0 16px; }
body[data-page="about"] .h2 { font-size: clamp(2rem, 3vw, 2.7rem); line-height: 1.05; }
body[data-page="about"] .beg-quote { font-size: clamp(1.4rem, 2.2vw, 1.9rem); }
.ah-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; max-width: 1080px; margin: 0 auto; }
.ah-card { padding: clamp(22px, 2.6vw, 30px); border: 1px solid var(--line); border-radius: var(--r); background: var(--bone); }
.ah-card__icon { width: 36px; height: 36px; fill: none; stroke: var(--pop); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 14px; }
.ah-card__place { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--pop); margin-bottom: 4px; }
.ah-card h3 { font-size: 1.4rem; line-height: 1.15; margin-bottom: 8px; }
.ah-card p:last-child { font-size: 14.5px; line-height: 1.6; color: var(--muted); }
/* About homeopathy: big-number facts */
.ah-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; max-width: 1180px; margin: 0 auto; }
.ah-stat { padding: 26px 22px; border: 1px solid var(--line); border-radius: var(--r); background: var(--bone); }
.ah-stat__num { display: block; font-family: var(--serif); font-style: italic; font-size: clamp(2.2rem, 3.2vw, 2.8rem); line-height: 1; color: var(--accent); margin-bottom: 14px; }
.ah-stat h3 { font-size: 1.2rem; line-height: 1.2; margin-bottom: 6px; }
.ah-stat p { font-size: 14px; line-height: 1.6; color: var(--muted); }
@media (max-width: 980px) { .ah-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .ah-stats { grid-template-columns: 1fr; } }.ah-ideas { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); max-width: 1180px; }
.ah-more { display: inline-block; margin-top: 10px; font-size: 13px; color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
@media (max-width: 860px) {
  .ah-what, .ah-cards { grid-template-columns: 1fr; }
  body[data-page="about"] .article-hero__grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .ah-track { grid-auto-columns: 78%; }
  .ah-track__hint { font-size: 11px; }
}

/* ---------- What healing looks like guide ---------- */
.hl-dirs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; max-width: 1180px; margin: 0 auto; }
.hl-dir { padding: 24px 22px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); text-align: center; }
.hl-dir svg { width: 48px; height: 48px; margin: 0 auto 12px; display: block; fill: none; stroke: var(--pop); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.hl-dir h3 { font-size: 1.35rem; margin-bottom: 6px; }
.hl-dir p { font-size: 14px; line-height: 1.55; color: var(--muted); }
.hl-notice { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; max-width: 1180px; margin: 0 auto; }
.hl-card { display: flex; flex-direction: column; gap: 10px; padding: 24px 22px; border: 1px solid var(--line); border-radius: var(--r); background: var(--bone); }
.hl-card__tag { align-self: flex-start; font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; padding: 4px 9px; border-radius: 2px; background: var(--sand); color: var(--dark); }
.hl-card__tag--good { background: var(--pop-soft); color: var(--ink); }
.hl-card__tag--care { background: var(--dark); color: var(--bg); }
.hl-card h3 { font-size: 1.4rem; line-height: 1.15; }
.hl-card > p { font-size: 14.5px; line-height: 1.6; color: var(--muted); }
.hl-card .hl-card__do { margin-top: auto; padding: 12px 14px; border-radius: var(--r-sm); background: var(--sand); color: var(--ink); font-size: 14px; }
.hl-card__do b { display: block; font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; font-weight: 500; color: var(--pop); margin-bottom: 3px; }
.hl-steps-wrap { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 72px); max-width: 1080px; align-items: start; }
.hl-steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.hl-steps li { display: flex; gap: 16px; align-items: flex-start; padding: 18px 20px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); }
.hl-steps span { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--pop); color: var(--pop-ink); font-family: var(--serif); font-size: 1.15rem; }
.hl-steps h3 { font-size: 1.3rem; margin-bottom: 3px; }
.hl-steps p { font-size: 14.5px; line-height: 1.55; color: var(--muted); }
.hl-never { max-width: 1080px; margin: 22px auto 0; }
.hl-time { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 820px; margin: 0 auto; }
.hl-time__card { padding: 28px; border-radius: var(--r); background: var(--bone); border: 1px solid var(--line); text-align: center; }
.hl-time__label { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--pop); }
.hl-time__card h3 { font-size: clamp(1.7rem, 2.6vw, 2.2rem); margin: 6px 0 10px; }
.hl-time__card p:last-child { font-size: 14.5px; line-height: 1.6; color: var(--muted); }
.hl-time__note { text-align: center; max-width: 620px; margin: 22px auto 0; font-size: 14px; color: var(--muted); }
/* Why follow-ups are 4, 6 or 8 weeks apart */
.hl-gap { max-width: 980px; margin: clamp(36px, 5vw, 56px) auto 0; }
.hl-gap__head { text-align: center; max-width: 620px; margin: 0 auto 22px; }
.hl-gap__head h3 { font-size: clamp(1.5rem, 2.2vw, 1.9rem); margin-bottom: 8px; }
.hl-gap__head p { font-size: 15px; line-height: 1.65; color: var(--muted); }
.hl-gap__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.hl-gap__card { padding: 24px 22px; border-radius: var(--r); background: var(--surface); border: 1px solid var(--line); text-align: center; }
.hl-gap__weeks { display: block; font-family: var(--serif); font-style: italic; font-size: 2.6rem; line-height: 1; color: var(--accent); }
.hl-gap__weeks small { display: block; font-family: var(--sans, inherit); font-style: normal; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--pop); margin-top: 6px; }
.hl-gap__card h4, .hl-gap__card h3 { font-family: var(--serif); font-weight: 400; font-size: 1.25rem; margin: 14px 0 6px; }
.hl-gap__card p { font-size: 14px; line-height: 1.6; color: var(--muted); }
/* Pillars of health: six pillars holding up "your vital force" */
.hl-pillars { max-width: 1100px; margin: clamp(28px, 4vw, 44px) auto 0; }
.hl-pillars__roof { position: relative; text-align: center; padding: 26px 20px 22px; background: var(--dark); color: var(--bone); border-radius: var(--r) var(--r) 4px 4px; clip-path: polygon(6% 0, 94% 0, 100% 100%, 0 100%); }
.hl-pillars__roof span, .hl-pillars__roof small { color: #F5EFE7; }
.hl-pillars__roof span { display: block;font-family: var(--serif); font-style: italic; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.1; }
.hl-pillars__roof small { display: block; margin-top: 6px; font-size: 12px; letter-spacing: .06em; opacity: .8; }
.hl-pillars__row { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; padding: 10px 14px 0; }
.hl-pillar { padding: 22px 14px 24px; background: var(--bone); border: 1px solid var(--line); border-top: 3px solid var(--pop-soft); text-align: center; }
.hl-pillar svg { width: 34px; height: 34px; fill: none; stroke: var(--pop); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; margin: 0 auto 12px; display: block; }
.hl-pillar h3 { font-size: 1.1rem; line-height: 1.2; margin-bottom: 6px; }
.hl-pillar p { font-size: 13.5px; line-height: 1.55; color: var(--muted); }
.hl-pillars__base { height: 12px; margin: 0 4px; background: var(--dark); border-radius: 4px; opacity: .85; }
.hl-pillars__why { margin: clamp(36px, 5vw, 56px) auto 0; }
.hl-pillars__why .h3 { font-size: clamp(1.6rem, 2.4vw, 2rem); }
@media (max-width: 980px) { .hl-pillars__row { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .hl-gap__row { grid-template-columns: 1fr; }
  .hl-pillars__row { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 10px 6px 0; }
  .hl-pillars__roof { clip-path: none; }
}
.hl-help { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1080px; }
@media (max-width: 1020px) { .hl-dirs, .hl-notice, .hl-help { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .hl-steps-wrap, .hl-time { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .hl-dirs, .hl-notice, .hl-help { grid-template-columns: 1fr; } }

/* ---------- What people come to me for: wider groups ---------- */
.care-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; max-width: 1080px; margin: 0 auto; }
.care-group { background: var(--bone); border: 1px solid var(--line); border-radius: var(--r); padding: clamp(22px, 2.6vw, 30px); }
.care-group--wide { grid-column: 1 / -1; }
.care-group__head { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; }
.care-group__icon { flex: none; width: 34px; height: 34px; padding: 6px; border-radius: 50%; background: var(--pop-soft); fill: none; stroke: var(--pop); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.care-group h3 { font-size: clamp(1.35rem, 1.8vw, 1.6rem); line-height: 1.15; }
.care-group > p { font-size: 14.5px; line-height: 1.65; color: var(--muted); }
.care-group .care-group__label { margin: 16px 0 8px; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--pop); }
.care-group ul { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 18px; }
.care-group li { position: relative; padding-left: 16px; font-size: 13.5px; line-height: 1.4; color: var(--dark); }
.care-group li::before { content: ""; position: absolute; left: 0; top: .5em; width: 7px; height: 7px; border-radius: 50%; background: var(--pop); }
.care-group--wide ul { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
@media (max-width: 480px) { .care-group ul { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .care-groups { grid-template-columns: 1fr; } }

/* ---------- Bundle packs page ---------- */
.pack__sticker { white-space: normal; text-align: center; line-height: 1.1; }
.pack__inside { margin: 4px 0 22px; padding: 18px 20px; border-radius: var(--r-sm); background: var(--surface); border: 1px solid var(--line); }
.pack__inside:empty { display: none; }
.pack__label { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--pop); margin-bottom: 12px; }
.pack__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; }
.pack__list li { display: flex; gap: 12px; align-items: flex-start; }
.pack__n { flex: none; display: grid; place-items: center; width: 26px; height: 26px; margin-top: 1px; border-radius: 50%; background: var(--pop-soft); color: var(--dark); font-size: 12.5px; font-weight: 600; }
.pack__list b { display: block; font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--ink); letter-spacing: .005em; }
.pack__list small { display: block; font-size: 14px; line-height: 1.55; color: #5F5048; margin-top: 3px; }
.pack__more { display: inline-block; margin-top: 14px; font-size: 13px; color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.pack-tiles { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; max-width: 1080px; margin: 0 auto; }
.pack-tile { display: grid; grid-template-rows: auto 1fr auto; gap: 6px; text-align: left; padding: 18px 18px 16px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--bone); color: var(--ink); cursor: pointer; transition: border-color .25s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease); }
.pack-tile:hover { border-color: var(--pop); transform: translateY(-2px); box-shadow: 0 14px 30px -22px rgba(42, 28, 22, .45); }
.pack-tile.on { border-color: var(--pop); box-shadow: inset 0 0 0 1px var(--pop); background: var(--pop-soft); }
.pack-tile__name { font-family: var(--serif); font-size: 1.35rem; line-height: 1.1; }
.pack-tile__in { font-size: 12.5px; line-height: 1.45; color: var(--muted); }
.pack-tile__price { font-size: 13px; color: var(--pop); font-weight: 500; }
.pack-offer { max-width: 760px; margin: 0 auto; text-align: center; padding: clamp(28px, 4vw, 44px); border-radius: var(--r); background: var(--sand); }
.pack-offer .h2 { margin: 6px 0 10px; }
.pack-offer .btn { margin-top: 18px; }

/* ---------- Lid choice: the chosen lid stands out (sage fill, tick, picture) ---------- */
.field__label--lid { font-size: 14px; color: var(--dark); }
.pdp .seg label { min-width: 120px; }
.pdp .seg span { position: relative; gap: 10px; padding: 12px 14px; font-size: 14.5px; color: var(--muted); border: 1px solid var(--line); background: var(--surface); }
.pdp .seg span b { font-weight: 400; }
.pdp .seg .lid-ic { width: 15px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.pdp .seg label:hover span { border-color: var(--pop); color: var(--dark); }
.pdp .seg input:checked + span { background: var(--pop-soft); color: var(--ink); border-color: var(--pop); box-shadow: inset 0 0 0 1px var(--pop); }
.pdp .seg input:checked + span b { font-weight: 500; }
.pdp .seg input:checked + span .lid-ic { stroke: var(--pop); }
.pdp .seg input:checked + span::after { content: "✓"; position: absolute; top: -8px; right: -8px; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--pop); color: var(--pop-ink); font-size: 11px; line-height: 1; }

/* ---------- What people come to me for: icons and groups ---------- */
.concern__icon { display: block; width: 30px; height: 30px; margin: 0 auto 12px; fill: none; stroke: var(--pop); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.concern-group { text-align: center; margin: 34px 0 14px; }
.concern-group:first-of-type { margin-top: 0; }
#ongoing .concerns + .concern-group { margin-top: 40px; }

/* ---------- First aid kit: the name as the big heading, and three sizes ---------- */
.kit-hero__name { display: block; font-size: clamp(2.8rem, 5vw, 4.3rem); line-height: .98; letter-spacing: -.015em; margin: 14px 0 6px; }
.kit-hero__title { font-family: var(--serif); font-size: clamp(1.45rem, 2.2vw, 1.9rem); line-height: 1.15; margin: 0 0 14px; color: var(--muted); }
.kit-hero__sizes { list-style: none; padding: 0; margin: 4px 0 18px; display: flex; gap: 10px; }
.kit-hero__sizes li { display: flex; align-items: baseline; gap: 6px; padding: 8px 14px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); }
.kit-hero__sizes b { font-family: var(--serif); font-weight: 400; font-size: 1.5rem; line-height: 1; color: var(--pop); }
.kit-hero__sizes span { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.kit-sizes { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1040px; }
.kit-size__icon { width: 46px; height: 46px; margin-bottom: 14px; fill: none; stroke: var(--pop); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.kit-size--big .kit-size__icon { stroke: var(--pop-light); }
@media (max-width: 860px) { .kit-sizes { grid-template-columns: 1fr; } }

/* ---------- Bundles: the three remedies, and "what's inside" ---------- */
.inside__intro { text-align: center; max-width: 640px; margin: 0 auto clamp(26px, 3vw, 38px); }
.inside__intro .h2 { margin: 6px 0 10px; }
.inside__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.inside__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 760px; margin: 0 auto; }
.inside__item { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 22px; display: flex; flex-direction: column; gap: 14px; }
.inside__head { display: flex; gap: 12px; align-items: flex-start; }
.inside__n { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--pop-soft); color: var(--dark); font-size: 13.5px; font-weight: 600; }
.inside__head h3 { font-size: 1.45rem; line-height: 1.1; }
.inside__key { font-size: 14.5px; color: #5F5048; margin-top: 4px; line-height: 1.5; }
.inside__why { font-size: 14.5px; line-height: 1.55; padding: 12px 14px; background: var(--pop-soft); border-radius: var(--r-sm); }
.inside__why b { display: block; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; font-weight: 500; color: var(--dark); margin-bottom: 4px; }
.inside__pic { margin: 0; display: grid; gap: 8px; }
.inside__pic div { display: grid; grid-template-columns: 88px 1fr; gap: 10px; font-size: 14.5px; line-height: 1.55; color: var(--ink); padding-top: 8px; border-top: 1px solid var(--line); }
.inside__pic dt { font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--pop); padding-top: 3px; }
.inside__pic dd { margin: 0; }
.inside__more { font-size: 14px; line-height: 1.55; color: var(--muted); }
.inside__link { margin-top: auto; font-size: 13px; color: var(--dark); border-bottom: 1px solid var(--pop-soft); align-self: flex-start; }
.bundle-card { display: flex; flex-direction: column; }
.bundle-card__actions { display: grid; gap: 6px; margin-top: 12px; }
.bundle-card__actions .btn { width: 100%; justify-content: center; padding-left: 8px; padding-right: 8px; white-space: nowrap; }
.bundle-card__soon { display: grid; place-items: center; min-height: 36px; font-size: 12.5px; color: var(--muted); border: 1px dashed var(--line); border-radius: var(--r-sm); }@media (max-width: 860px) { .inside__grid, .inside__grid--2 { grid-template-columns: 1fr; } }

@media print {
  body[data-page="order-complete"] .site-header, body[data-page="order-complete"] .site-footer, body[data-page="order-complete"] .legal-hero,
  body[data-page="order-complete"] .centre-head, body[data-page="order-complete"] .gift-done__print, body[data-page="order-complete"] .announce { display: none !important; }
  .gift-card { -webkit-print-color-adjust: exact; print-color-adjust: exact; break-inside: avoid; box-shadow: none; }
}

/* ---------- Fertility program page ---------- */
.fx .h2 { font-size: clamp(2rem, 3vw, 2.7rem); line-height: 1.05; }
.fx-hero .article-hero__grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: center; }
.fx-hero h1 { font-size: clamp(2.4rem, 4vw, 3.4rem); line-height: 1.02; letter-spacing: -.01em; margin: 6px 0 16px; }
.fx-chips { list-style: none; padding: 0; margin: 20px 0 4px; display: flex; flex-wrap: wrap; gap: 8px; }
.fx-chips li { padding: 7px 14px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); font-size: 13px; color: var(--muted); }
.fx-chips b { color: var(--dark); font-weight: 600; }
.fx-incl { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 72px); max-width: 1100px; align-items: center; }
.fx-incl__card { padding: clamp(28px, 3.5vw, 40px); border-radius: 22px; background: var(--dark); color: #F5EFE7; box-shadow: 0 30px 60px -40px rgba(60, 45, 35, .55); }
.fx-incl__label { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: #E6D3C2; }
.fx-incl__price { font-family: var(--serif); font-size: clamp(3rem, 5vw, 4rem); line-height: 1; margin: 10px 0 18px; color: #F5EFE7; }
.fx-incl__price small { display: block; font-family: "DM Sans", system-ui, sans-serif; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; opacity: .75; margin-top: 8px; }
.fx-ticks { gap: 10px; margin-bottom: 20px; }
.fx-ticks li { font-size: 14.5px; color: rgba(245, 239, 231, .9); }
.fx-incl__partner { font-size: 14px; padding: 14px 16px; border-radius: 12px; background: rgba(245, 239, 231, .08); margin-bottom: 22px; color: rgba(245, 239, 231, .85); }
.fx-incl__partner b { color: #F5EFE7; }
.fx-incl__text p { font-size: 16px; line-height: 1.75; color: var(--muted); }
.fx-incl__text p + p { margin-top: 14px; }
.fx-incl__text .h2 { margin-bottom: 18px; }
.fx-path { list-style: none; padding: 0; margin: 0 auto; max-width: 1180px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; counter-reset: none; position: relative; }
.fx-path::before { content: ""; position: absolute; left: 6%; right: 6%; top: 27px; border-top: 1px dashed var(--pop-soft); }
.fx-path li { position: relative; padding: 0 6px; text-align: center; }
.fx-path__n { position: relative; display: inline-grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: var(--surface); border: 1px solid var(--pop-soft); font-family: var(--serif); font-style: italic; font-size: 1.3rem; color: var(--accent); margin-bottom: 14px; }
.fx-path__when { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--pop); margin-bottom: 4px; }
.fx-path h3 { font-size: 1.3rem; margin-bottom: 6px; }
.fx-path p:last-child { font-size: 14px; line-height: 1.6; color: var(--muted); }
.fx-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 22px; }
.fx-duo div { padding: 20px; border-radius: var(--r); border: 1px solid var(--line); background: var(--bone); }
.fx-duo h3 { font-family: var(--serif); font-style: italic; font-size: 1.4rem; color: var(--accent); margin-bottom: 6px; }
.fx-duo p { font-size: 14px !important; line-height: 1.6; margin: 0 !important; }
.fx-window { max-width: 760px; margin: 0 auto 28px; padding: 26px; border-radius: 20px; background: var(--surface); border: 1px solid var(--line); }
.fx-window__bar { display: grid; grid-template-columns: repeat(5, 1fr) 1.6fr; gap: 6px; }
.fx-window__day { display: grid; place-items: center; height: 46px; border-radius: 10px; background: var(--pop-soft); color: var(--dark); font-size: 13px; }
.fx-window__day:nth-child(1) { opacity: .55; } .fx-window__day:nth-child(2) { opacity: .65; } .fx-window__day:nth-child(3) { opacity: .75; } .fx-window__day:nth-child(4) { opacity: .88; }
.fx-window__day--o { background: var(--dark); color: #F5EFE7; font-family: var(--serif); font-style: italic; font-size: 1.05rem; }
.fx-window__facts { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 18px; }
.fx-window__facts p { font-size: 14px; line-height: 1.55; color: var(--muted); }
.fx-window__facts b { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.5rem; color: var(--accent); }
.fx-signs { max-width: 1100px; }
.fx-pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; max-width: 1100px; margin: 0 auto; }
.fx-pillar { padding: 24px 24px 26px; border-radius: var(--r); background: var(--bone); border: 1px solid var(--line); border-top: 3px solid var(--pop-soft); }
.fx-pillar h3 { font-family: var(--serif); font-style: italic; font-size: 1.5rem; color: var(--accent); margin-bottom: 8px; }
.fx-pillar p { font-size: 14.5px; line-height: 1.6; color: var(--muted); }
.fx-heart { background: var(--dark); color: #F5EFE7; }
.fx-heart__in { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 72px); max-width: 1100px; align-items: center; }
.fx-heart__img img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 20px; }
.fx-heart .eyebrow { color: #E6D3C2; }
.fx-heart .h2 { color: #F5EFE7; margin-bottom: 18px; }
.fx-heart .h2 em { color: #E6D3C2; }
.fx-heart p { font-size: 16px; line-height: 1.75; color: rgba(245, 239, 231, .82); }
.fx-heart p + p { margin-top: 14px; }
.fx-quote { margin: 26px 0 0; padding-left: 18px; border-left: 2px solid #E6D3C2; font-family: var(--serif); font-style: italic; font-size: clamp(1.4rem, 2.2vw, 1.8rem); line-height: 1.25; color: #F5EFE7; }
.fx-med .hl-gap__card { text-align: left; }
.fx-med .hl-gap__card h4, .fx-med .hl-gap__card h3 { margin-top: 0; }
.fx-start { text-align: center; max-width: 720px; margin: 0 auto; }
.fx-start .lead { margin: 12px 0 0; }
.fx-start__btns { justify-content: center; }
@media (max-width: 980px) {
  .fx-path { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 28px; }
  .fx-path::before { display: none; }
  .fx-pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .fx-hero .article-hero__grid, .fx-incl, .fx-heart__in { grid-template-columns: 1fr; }
  .fx-heart__img img { aspect-ratio: 16 / 10; }
}
@media (max-width: 560px) {
  .fx-path, .fx-pillars, .fx-duo, .fx-window__facts { grid-template-columns: 1fr; }
  .fx-window { padding: 18px; }
  .fx-window__bar { grid-template-columns: repeat(5, 1fr); }
  .fx-window__day--o { grid-column: 1 / -1; }
}
.fx-cardbtns { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: auto; }
.fx-more { font-size: 13px; color: var(--dark); border-bottom: 1px solid var(--pop-soft); }

/* "On this page" corner button (screens too narrow for the side pane) */
.toc-pop { display: none; position: fixed; left: 16px; bottom: 16px; z-index: 30; }
.toc-pop.is-on.is-shown { display: block; }
.toc-pop__btn { min-height: 44px; padding: 0 18px; border-radius: 999px; background: var(--dark); color: #F5EFE7; font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; box-shadow: 0 10px 24px -10px rgba(60, 45, 35, .5); }
.toc-pop__btn::before { content: ""; display: inline-block; width: 12px; height: 8px; margin-right: 10px; border-top: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; vertical-align: 1px; }
.toc-pop__list { position: absolute; left: 0; bottom: 56px; width: min(290px, calc(100vw - 32px)); max-height: 60vh; overflow-y: auto; padding: 16px 18px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 24px 50px -24px rgba(60, 45, 35, .45); }
.toc-pop__list p { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
.toc-pop__list ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--line); }
.toc-pop__list a { display: block; padding: 8px 0 8px 14px; margin-left: -1px; border-left: 1px solid transparent; font-size: 14px; line-height: 1.35; color: var(--muted); }
.toc-pop__list a.on, .toc-pop__list a:hover { color: var(--dark); border-left-color: var(--pop); }
.shot .toc-pop { display: none !important; }
@media print { .toc-pop { display: none !important; } }
/* ---------- Your first consultation (new clients) guide ---------- */
.nc-wheel { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; max-width: 680px; margin: 10px auto 0; }
.nc-wheel__centre { grid-area: 2 / 2; display: grid; place-items: center; min-height: 120px; border-radius: 50%; aspect-ratio: 1; justify-self: center; width: min(140px, 100%); background: var(--dark); color: #F5EFE7; box-shadow: 0 0 0 8px var(--bone), 0 0 0 9px var(--pop-soft); }
.nc-wheel__centre span { font-family: var(--serif); font-style: italic; font-size: clamp(1.6rem, 3vw, 2.2rem); }
.nc-wheel__item { display: flex; flex-direction: column; justify-content: center; padding: 18px 14px; border-radius: var(--r); background: var(--surface); border: 1px solid var(--line); text-align: center; font-size: 13px; line-height: 1.4; color: var(--muted); }
.nc-wheel__item b { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.25rem; color: var(--dark); margin-bottom: 2px; }.nc-steps { list-style: none; padding: 0; margin: 0 auto; max-width: 760px; display: grid; gap: 12px; }
.nc-steps li { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 18px; align-items: start; padding: 20px 22px; border-radius: var(--r); background: var(--surface); border: 1px solid var(--line); }
.nc-steps li > span { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--pop-soft); font-family: var(--serif); font-style: italic; font-size: 1.2rem; color: var(--accent); }
.nc-steps h3 { font-size: 1.25rem; margin-bottom: 4px; }
.nc-steps p { font-size: 14.5px; line-height: 1.6; color: var(--muted); }
.nc-time { position: relative; max-width: 1080px; height: 230px; margin: 10px auto 30px; }
.nc-time__line { position: absolute; left: 0; right: 0; top: 50%; border-top: 2px solid var(--pop-soft); }
.nc-time__pt { position: absolute; left: var(--x); top: 50%; width: 150px; transform: translate(-50%, calc(-100% - 18px)); text-align: center; font-size: 12.5px; line-height: 1.4; color: var(--muted); }
.nc-time__pt::after { content: ""; position: absolute; left: 50%; bottom: -24px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: var(--pop); box-shadow: 0 0 0 4px var(--surface); }
.nc-time__pt--low { transform: translate(-50%, 18px); }
.nc-time__pt--low::after { bottom: auto; top: -24px; }
.nc-time__pt b { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.15rem; color: var(--dark); }
.nc-time__pt--key b { color: var(--accent); font-style: italic; }
.nc-time__pt--key::after { background: var(--accent); width: 16px; height: 16px; margin-left: -8px; }
.nc-tips { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; max-width: 980px; margin: 0 auto; }
.nc-tip { padding: 20px 22px; border-radius: var(--r); background: var(--bone); border: 1px solid var(--line); }
.nc-tip h3 { font-family: var(--serif); font-style: italic; font-size: 1.3rem; color: var(--accent); margin-bottom: 4px; }
.nc-tip p { font-size: 14px; line-height: 1.6; color: var(--muted); }
.nc-dark { background: var(--dark); color: #F5EFE7; }
.nc-dark .eyebrow { color: #E6D3C2; }
.nc-dark .h2 { color: #F5EFE7; margin-bottom: 18px; }
.nc-dark .h2 em { color: #E6D3C2; }
.nc-nws { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 64px); max-width: 1100px; margin: 0 auto; align-items: center; }
.nc-nws p { font-size: 16px; line-height: 1.75; color: rgba(245, 239, 231, .82); }
.nc-nws p + p { margin-top: 14px; }
.nc-nws b { color: #F5EFE7; }
.nc-nws__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.nc-nws__col { padding: 22px; border-radius: var(--r); background: rgba(245, 239, 231, .07); border: 1px solid rgba(245, 239, 231, .14); }
.nc-nws__col h3 { font-family: var(--serif); font-style: italic; font-size: 1.4rem; color: #E6D3C2; margin-bottom: 10px; }
.nc-nws__col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.nc-nws__col li { font-size: 14px; line-height: 1.45; color: rgba(245, 239, 231, .85); padding-left: 14px; position: relative; }
.nc-nws__col li::before { content: ""; position: absolute; left: 0; top: .6em; width: 5px; height: 5px; border-radius: 50%; background: #E6D3C2; }
.nc-mod { max-width: 1100px; margin: clamp(32px, 4vw, 48px) auto 0; padding: clamp(24px, 3vw, 36px); border-radius: 22px; background: var(--bone); border: 1px solid var(--line); }
.nc-mod__head { text-align: center; margin-bottom: 20px; }
.nc-mod__head h3 { font-size: clamp(1.5rem, 2.2vw, 1.9rem); margin-bottom: 6px; }
.nc-mod__head p { font-size: 14.5px; color: var(--muted); }
.nc-mod__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.nc-mod__grid div { padding: 14px 16px; border-radius: 12px; background: var(--surface); border: 1px solid var(--line); }
.nc-mod__grid b { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.1rem; color: var(--dark); }
.nc-mod__grid span { font-size: 13px; line-height: 1.45; color: var(--muted); }
.nc-mod__eg { margin-top: 18px; padding: 14px 18px; border-left: 2px solid var(--accent); font-size: 14.5px; line-height: 1.6; color: var(--muted); }
.nc-mod__eg b { color: var(--dark); }
.nc-quirks { list-style: none; padding: 0; margin: 16px 0; display: grid; gap: 8px; }
.nc-quirks li { padding: 12px 16px; border-radius: 12px; background: var(--surface); border: 1px solid var(--line); font-family: var(--serif); font-style: italic; font-size: 1.1rem; color: var(--dark); }
.nc-prep { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; max-width: 1100px; margin: 0 auto; }
.nc-prep__col { padding: 24px; border-radius: var(--r); background: var(--bone); border: 1px solid var(--line); }
.nc-prep__col h3 { font-family: var(--serif); font-style: italic; font-size: 1.4rem; color: var(--accent); margin-bottom: 6px; }
.nc-prep__col .cx-ticks li { font-size: 14px; line-height: 1.5; color: var(--muted); }
@media (max-width: 980px) {
  .nc-mod__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nc-prep, .nc-tips { grid-template-columns: 1fr; max-width: 560px; }
  .nc-nws { grid-template-columns: 1fr; }
}
@media (max-width: 1040px) {
  .nc-time { height: auto; display: grid; gap: 14px; padding-left: 26px; border-left: 2px solid var(--pop-soft); margin-left: 8px; }
  .nc-time__line { display: none; }
  .nc-time__pt, .nc-time__pt--low { position: relative; left: auto; top: auto; width: auto; transform: none; text-align: left; }
  .nc-time__pt::after, .nc-time__pt--low::after { left: -33px; top: 6px; bottom: auto; margin-left: 0; }
  .nc-time__pt--key::after { left: -35px; }
}
@media (max-width: 600px) {
  .nc-wheel { gap: 8px; }
  .nc-wheel__item { padding: 12px 8px; font-size: 12px; }
  .nc-wheel__item b { font-size: 1.05rem; }
  .nc-nws__cols, .nc-mod__grid { grid-template-columns: 1fr; }
  .nc-steps li { grid-template-columns: 1fr; gap: 10px; }
}
/* About homeopathy hero photo (old hospital, warmed to match the palette) */
.ah-photo { margin: 0; }
.ah-photo img { filter: sepia(.35) contrast(1.02); }
.ah-photo figcaption { margin-top: 10px; font-size: 12px; line-height: 1.5; color: var(--muted); }

/* "The whole you": eight parts of you around a central circle */
.nc-orbit { position: relative; width: min(640px, 100%); aspect-ratio: 1; margin: 6px auto 0; }
.nc-orbit::before { content: ""; position: absolute; inset: 22%; border-radius: 50%; background: radial-gradient(circle, rgba(211, 219, 194, .55), rgba(211, 219, 194, 0) 70%); }
.nc-orbit__ring { position: absolute; inset: 12%; border-radius: 50%; border: 1px dashed var(--pop-soft); }
.nc-orbit__you { position: absolute; inset: 35%; display: grid; place-content: center; text-align: center; border-radius: 50%; background: var(--dark); color: #F5EFE7; box-shadow: 0 0 0 10px rgba(245, 239, 231, .9), 0 0 0 11px var(--pop-soft), 0 24px 50px -24px rgba(60, 45, 35, .55); }
.nc-orbit__you span { font-family: var(--serif); font-style: italic; font-size: clamp(2rem, 4vw, 2.8rem); line-height: 1; }
.nc-orbit__you small { margin-top: 6px; font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: #E6D3C2; }
.nc-orbit__item { position: absolute; width: 132px; transform: translate(-50%, -50%); text-align: center; }
.nc-orbit__item i { display: grid; place-items: center; width: 48px; height: 48px; margin: 0 auto 8px; border-radius: 50%; background: var(--surface); border: 1px solid var(--pop-soft); box-shadow: 0 8px 18px -12px rgba(60, 45, 35, .45); }
.nc-orbit__item svg { width: 22px; height: 22px; fill: none; stroke: var(--pop); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.nc-orbit__item b { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.2rem; line-height: 1.1; color: var(--dark); }
.nc-orbit__item span { display: block; font-size: 12px; line-height: 1.35; color: var(--muted); margin-top: 2px; }
.nc-orbit__item--1 { left: 50%; top: 12%; }
.nc-orbit__item--2 { left: 76.9%; top: 23.1%; }
.nc-orbit__item--3 { left: 88%; top: 50%; }
.nc-orbit__item--4 { left: 76.9%; top: 76.9%; }
.nc-orbit__item--5 { left: 50%; top: 88%; }
.nc-orbit__item--6 { left: 23.1%; top: 76.9%; }
.nc-orbit__item--7 { left: 12%; top: 50%; }
.nc-orbit__item--8 { left: 23.1%; top: 23.1%; }
@media (max-width: 640px) {
  .nc-orbit { aspect-ratio: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .nc-orbit::before, .nc-orbit__ring { display: none; }
  .nc-orbit__you { position: static; grid-column: 1 / -1; justify-self: center; width: 150px; height: 150px; margin: 6px 0 14px; }
  .nc-orbit__item { position: static; width: auto; transform: none; padding: 14px 10px; border-radius: var(--r); background: var(--surface); border: 1px solid var(--line); }
}
/* About me: what you can expect (8 cards, 4 across) */
.am-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 1180px; }
@media (max-width: 980px) { .am-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .am-cards { grid-template-columns: 1fr; } }
/* About me: what I believe (2 cards), the line under the cards, and the centred last-word buttons */
.am-believe { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 900px; }
@media (max-width: 720px) { .am-believe { grid-template-columns: 1fr; } }
.am-after { max-width: 40em; margin: clamp(28px, 3.5vw, 44px) auto 0; text-align: center; }
.am-btns { justify-content: center; }
.ah-what__text a:not(.btn) { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }

/* Consultations: the fertility program as a wide feature card under the three main consults */
.cx-fert { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(24px, 4vw, 56px); align-items: center; max-width: 1060px; margin: 18px auto 0; padding: clamp(28px, 3.5vw, 44px); border-radius: 18px; background: var(--pop-soft); border: 1px solid rgba(104, 120, 82, .25); }
.cx-fert h3 { font-size: clamp(1.9rem, 2.8vw, 2.4rem); margin: 4px 0 12px; }
.cx-fert .cx-card__price { border-color: rgba(104, 120, 82, .3); }
.cx-fert .cx-card__text { font-size: 15px; color: var(--ink); opacity: .8; margin-bottom: 20px; }
.cx-fert__list { margin: 0; gap: 12px; padding: 24px 26px; border-radius: 14px; background: rgba(252, 250, 247, .75); }
.cx-fert__list li { font-size: 14.5px; color: var(--ink); }
@media (max-width: 860px) { .cx-fert { grid-template-columns: 1fr; max-width: 520px; margin-top: 26px; } }
.pack__inside .pack__list li { padding: 11px 0; }
.pack__inside .pack__list li + li { border-top: 1px solid var(--line); }
.pack__inside .pack__list li:first-child { padding-top: 2px; }

/* ---------- Guide pages: photo-banner heading (Option A, Leah's choice 18 Oct 2026) ---------- */
.gh { padding: calc(var(--header-h) + 24px) 0 clamp(28px, 3.5vw, 44px); }
.gh .breadcrumb { margin-bottom: 16px; }
.gh__banner { position: relative; height: clamp(220px, 22vw, 280px); border-radius: 22px; overflow: hidden; background: var(--dark); }
.gh__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gh__banner::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(50, 38, 30, .74) 0%, rgba(50, 38, 30, .45) 42%, rgba(50, 38, 30, .05) 78%); }
.gh__txt { position: absolute; z-index: 1; left: clamp(24px, 4vw, 48px); right: clamp(24px, 4vw, 48px); bottom: clamp(24px, 3vw, 38px); max-width: 560px; }
.gh__eb { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: #E6D3C2; margin-bottom: 8px; }
.gh h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(2.1rem, 3.4vw, 2.8rem); line-height: 1.04; letter-spacing: -.005em; color: #F5EFE7; margin: 0 0 8px; }
.gh h1 em { color: #E6D3C2; }
.gh__line { font-size: 15.5px; line-height: 1.5; color: rgba(245, 239, 231, .88); margin: 0; }
.gh__after { margin-top: 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.gh__after .dose-rule { margin-top: 0; }
.gh__tools { text-align: center; }
.gh__tools .rf-search { margin-top: 26px; }
@media (max-width: 600px) {
  .gh__banner { height: 230px; border-radius: 18px; }
  .gh__banner::after { background: linear-gradient(0deg, rgba(50, 38, 30, .8) 0%, rgba(50, 38, 30, .35) 60%, rgba(50, 38, 30, .1) 100%); }
  .gh__line { font-size: 14.5px; }
}
/* ---------- Consultations: care journey (Leah chose Option 1, 18 Oct 2026) ---------- */
.cj-label { max-width: 1120px; margin: 0 auto 14px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.cj { list-style: none; padding: 0; margin: 0 auto; max-width: 1120px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; position: relative; }
.cj::before { content: ""; position: absolute; left: 12%; right: 12%; top: 22px; border-top: 1px dashed var(--pop-soft); }
.cj__step { position: relative; display: flex; flex-direction: column; align-items: center; }
.cj__n { position: relative; display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 14px; border-radius: 50%; background: var(--surface); border: 1px solid var(--pop-soft); font-family: var(--serif); font-style: italic; font-size: 1.2rem; color: var(--accent); }
.cj__card { flex: 1; width: 100%; display: flex; flex-direction: column; padding: 22px 20px 22px; border-radius: 16px; background: var(--bone); border: 1px solid var(--line); }
.cj__card h3 { font-size: 1.45rem; line-height: 1.1; margin: 2px 0 10px; }
.cj__price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid var(--line); }
.cj__price span { font-family: var(--serif); font-size: 1.9rem; line-height: 1; color: var(--dark); }
.cj__price small { font-size: 12px; letter-spacing: .04em; color: var(--muted); }
.cj__text { font-size: 14px; line-height: 1.6; color: var(--muted); flex: 1; margin-bottom: 16px; }
.cj__card .btn { align-self: flex-start; }
.cj__step--main .cj__n { background: var(--dark); border-color: var(--dark); color: #F5EFE7; }
.cj__step--main .cj__card { background: var(--dark); border-color: var(--dark); box-shadow: 0 24px 48px -30px rgba(60, 45, 35, .6); }
.cj__step--main h3, .cj__step--main .cj__price span { color: #F5EFE7; }
.cj__step--main .cx-card__ask { color: #E6D3C2; }
.cj__step--main .cj__text, .cj__step--main .cj__price small { color: rgba(245, 239, 231, .78); }
.cj__step--main .cj__price { border-color: rgba(245, 239, 231, .16); }
.cj-paths { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; max-width: 1120px; margin: 28px auto 0; }
.cj-path { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px 24px; align-items: center; padding: 26px 28px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); }
.cj-path h3 { font-size: 1.6rem; margin: 2px 0 8px; }
.cj-path .cj__text { margin: 0; flex: none; }
.cj-path__side { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; text-align: right; }
.cj-path__side .cj__price { border: 0; padding: 0; margin: 0; justify-content: flex-end; }
.cj-path--fert { background: var(--sand); border-color: #DCCBB7; }
@media (max-width: 1000px) {
  .cj { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 22px; }
  .cj::before { display: none; }
  .cj-paths { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .cj { grid-template-columns: 1fr; }
  .cj__step { flex-direction: row; align-items: flex-start; gap: 12px; }
  .cj__n { flex: none; margin: 18px 0 0; width: 38px; height: 38px; }
  .cj-path { grid-template-columns: 1fr; }
  .cj-path__side { align-items: flex-start; text-align: left; }
  .cj-path__side .cj__price { justify-content: flex-start; }
}
/* ---------- What healing looks like: polish (18 Oct 2026) ---------- */
/* Easier reading: bigger, darker body text on this page */
.hl-page .lead { color: #5F5048; }
.hl-page .hl-card > p, .hl-page .hl-steps p, .hl-page .hl-time__card p:last-child, .hl-page .hl-gap__card p,
.hl-page .hl-pillar p, .hl-page .beg-card p, .hl-page .ah-what__text p { font-size: 15px; line-height: 1.65; color: #5F5048; }
.hl-page .hl-pillar p { font-size: 14px; }
.hl-page .hl-time__note, .hl-page .hl-gap__head p { color: #5F5048; font-size: 15px; }
/* Direction of cure: four arrows */
.hl-arrows { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; max-width: 1180px; margin: 0 auto; }
.hl-arrow { padding: 24px 22px 26px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.hl-arrow__line { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; margin-bottom: 18px; padding: 12px 14px; border-radius: 12px; background: var(--bone); }
.hl-arrow__line span { font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--dark); white-space: nowrap; }
.hl-arrow__line span:last-child { color: var(--pop); }
.hl-arrow__line i { position: relative; height: 2px; background: linear-gradient(90deg, var(--stone), var(--pop)); border-radius: 2px; }
.hl-arrow__line i::after { content: ""; position: absolute; right: -2px; top: 50%; width: 8px; height: 8px; border-top: 2px solid var(--pop); border-right: 2px solid var(--pop); transform: translateY(-50%) rotate(45deg); }
.hl-arrow h3 { font-size: 1.35rem; line-height: 1.15; margin-bottom: 6px; }
.hl-arrow p { font-size: 15px; line-height: 1.6; color: #5F5048; }
/* Along the way: colour key and colour-coded cards */
.hl-key { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; padding: 0; margin: -8px auto 22px; font-size: 13.5px; color: var(--dark); }
.hl-key li { display: flex; align-items: center; gap: 8px; }
.hl-key__dot { width: 12px; height: 12px; border-radius: 50%; }
.hl-key__dot--go { background: var(--pop); }
.hl-key__dot--tell { background: var(--clay); }
.hl-key__dot--review { background: var(--dark); }
.hl-card { border-top: 3px solid var(--line); }
.hl-card--go { border-top-color: var(--pop); }
.hl-card--tell { border-top-color: var(--clay); }
.hl-card--review { border-top-color: var(--dark); }
.hl-card__tag--go { background: #D3DBC2; color: var(--ink); }
.hl-card__tag--tell { background: #F1DCCD; color: #7A4428; }
.hl-card__tag--review { background: var(--dark); color: var(--bg); }
/* If it's uncomfortable: the doctor step and the medicine rule stand out */
.hl-steps__doctor { border-color: rgba(199, 122, 82, .45) !important; background: #FBF1EA !important; }
.hl-steps__doctor > span { background: var(--clay) !important; }
.hl-safety { max-width: 1080px; margin: 22px auto 0; padding: 16px 20px 16px 52px; position: relative; border-radius: 12px; background: #FBF1EA; border: 1px solid rgba(199, 122, 82, .35); font-size: 15px; line-height: 1.6; color: var(--ink); }
.hl-safety::before { content: "!"; position: absolute; left: 16px; top: 15px; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: var(--clay); color: #fff; font-weight: 700; font-size: 14px; }
@media (max-width: 1000px) { .hl-arrows { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .hl-arrows { grid-template-columns: 1fr; } }
.cx-free h2 em { color: var(--accent); }
.cx-free__list { margin: 0 0 22px; gap: 8px; }
.cx-free__list li { font-size: 14.5px; color: var(--dark); }

/* Shop pages: a chooser that clearly holds more options (18 Oct 2026) */
.picker { position: relative; }
.pdp .picker .select { padding: 15px 120px 15px 16px; font-size: 16px; font-weight: 500; color: var(--ink); border: 1.5px solid var(--pop); border-radius: 10px; background-color: var(--surface); background-image: none; box-shadow: 0 8px 22px -18px rgba(60, 45, 35, .5); }
.pdp .picker .select:hover, .pdp .picker .select:focus { border-color: var(--dark); outline: none; box-shadow: 0 0 0 4px rgba(104, 120, 82, .14); }
.picker__tab { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); padding: 7px 12px; border-radius: 7px; background: var(--pop); color: var(--pop-ink); font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; pointer-events: none; }
.picker__count { color: var(--pop) !important; font-weight: 600 !important; }
.picker__hint { margin-top: 8px; font-size: 13px; line-height: 1.5; color: var(--muted); }
.picker__hint a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
/* Every remedy grid */
.rt-search { position: relative; max-width: 460px; margin: -6px auto 22px; }
.rt-search svg { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.rt-search input { width: 100%; height: 48px; padding: 0 18px 0 44px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); font: inherit; font-size: 15px; color: var(--dark); }
.rt-search input:focus { outline: none; border-color: var(--pop); box-shadow: 0 0 0 4px rgba(104, 120, 82, .12); }
.rt-empty { grid-column: 1 / -1; text-align: center; color: var(--muted); font-size: 15px; }
.rt-empty a { color: var(--dark); border-bottom: 1px solid currentColor; }
/* Plain page links and lists for search engines; replaced by the real menu, footer and tools when scripts run. */
/* Links for search engines only: the page's script is at the end of the page, before this list, so it's hidden here instead. */
.ssr-nav { display: none !important; }
.ssr-nav ul, .ssr-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ssr-list { max-width: 760px; margin: 0 auto; font-size: 14px; color: var(--muted); }
.ssr-list b { color: var(--dark); font-weight: 500; }

/* ---------- Wait-and-watch chart, restyled to match the site (19 Oct 2026) ---------- */
.dose-flow { --fl-line: #C9B9A8; }
.dose-flow .flow__label { display: table; margin: 0 auto 14px; padding: 6px 14px; border-radius: 999px; background: #D3DBC2; color: var(--ink); font-weight: 600; }
.dose-flow .flow__top { max-width: 440px; padding: 22px 28px; border: 0; border-radius: 18px; background: var(--dark); color: #F5EFE7; font-size: clamp(1.3rem, 2vw, 1.55rem); box-shadow: 0 22px 44px -28px rgba(60, 45, 35, .65); }
.dose-flow .flow__split { gap: 14px; margin-top: 46px; }
.dose-flow .flow__split::before { border-left: 2px solid var(--fl-line); }
.dose-flow .flow__split::after { border-top: 2px solid var(--fl-line); }
.dose-flow .flow__col::before { border-left: 2px solid var(--fl-line); }
.dose-flow .flow__col { display: flex; flex-direction: column; gap: 10px; padding: 0 16px 18px; border: 1px solid var(--line); border-top: 4px solid var(--fl-c); border-radius: 18px; background: var(--bone); }
.dose-flow .flow__col:nth-child(1) { --fl-c: var(--clay); }
.dose-flow .flow__col:nth-child(2) { --fl-c: var(--dark); }
.dose-flow .flow__col:nth-child(3) { --fl-c: var(--pop); }
.dose-flow .flow__step { padding: 20px 6px 8px; border: 0; border-radius: 0; background: none; font-size: 14.5px; color: #5F5048; }
.dose-flow .flow__step b { font-family: var(--serif); font-weight: 400; font-size: 1.45rem; line-height: 1.15; color: var(--fl-c); margin-bottom: 6px; }
.dose-flow .flow__step::before, .dose-flow .flow__step::after, .dose-flow .flow__end:not(:last-child)::after { content: none; }
.dose-flow .flow__end { margin: 0; padding: 12px 14px 12px 40px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); font-size: 14px; line-height: 1.5; color: var(--ink); text-align: left; }
.dose-flow .flow__end::before { content: "→"; position: absolute; left: 14px; top: 11px; border: 0; color: var(--fl-c); font-weight: 600; }
@media (max-width: 640px) {
  .dose-flow .flow__split { gap: 18px; }
  .dose-flow .flow__col + .flow__col { border-top: 4px solid var(--fl-c); padding-top: 0; }
}

/* Top banner with "Reduce motion" switched on (common on iPhones): one message at a time, gently fading,
   instead of a frozen strip cut off mid-sentence. */
.announce--fade { justify-content: center; }
.announce--fade .announce__track { animation: none !important; width: auto; position: relative; display: block; text-align: center; }
.announce--fade .announce__track span, .announce--fade .announce__track i { display: none; }
.announce--fade .announce__track span.is-on { display: inline; padding: 0 16px; animation: announce-in .6s ease both !important; }
@keyframes announce-in { from { opacity: 0; } to { opacity: 1; } }
/* ---------- New family guides (teething, school, summer, travel, new mums, sleep) ---------- */
.gd-ticks { margin-top: 16px; gap: 9px; }
.gd-ticks li { font-size: 15px; color: var(--ink); }
.gd-ideas { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1080px; }
.gd-rems { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; max-width: 1080px; margin: 0 auto; }
.gd-rem { padding: 20px 20px 22px; border-radius: 16px; background: var(--bone); border: 1px solid var(--line); border-top: 3px solid #D3DBC2; }
.gd-rem h3 { font-family: var(--serif); font-weight: 400; font-size: 1.35rem; line-height: 1.15; color: var(--dark); margin-bottom: 6px; }
.gd-rem p { font-size: 14.5px; line-height: 1.6; color: #5F5048; }
.gd-note { max-width: 760px; margin: 20px auto 0; text-align: center; font-size: 13.5px; line-height: 1.6; color: var(--muted); }
.gd-note a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.gd-doctor { max-width: 820px; margin: 0 auto; padding: 22px 26px 20px; border-radius: 16px; background: #FBF1EA; border: 1px solid rgba(199, 122, 82, .35); }
.gd-doctor ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.gd-doctor li { position: relative; padding-left: 26px; font-size: 15px; line-height: 1.6; color: var(--ink); }
.gd-doctor li::before { content: ""; position: absolute; left: 4px; top: .62em; width: 8px; height: 8px; border-radius: 50%; background: var(--clay); }
.gd-doctor__000 { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(199, 122, 82, .3); font-size: 15px; color: var(--ink); }
.gd-related { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; margin-top: 22px; }
.gd-link { font-size: 14px; color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
/* Guides page, Option C: "Your first five steps" path, then three short lists */
.gp-jump { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 26px; }
.gp-jump a { border: 1px solid var(--line); border-radius: 8px; padding: 8px 14px; font-size: 13.5px; background: var(--surface); color: var(--ink); }
.gp-jump a:hover { border-color: var(--dark); }
.gp-path { background: var(--surface); border: 1px solid var(--line); border-radius: 20px; padding: clamp(22px, 3vw, 34px); scroll-margin-top: 110px; }
.gp-path .h2 { margin: 4px 0 20px; }
.gp-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.gp-step { display: flex; flex-direction: column; align-items: center; text-align: center; color: var(--ink); }
.gp-step__img { display: block; width: 100%; aspect-ratio: 1.3; border-radius: 12px; overflow: hidden; }
.gp-step__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.gp-step:hover .gp-step__img img { transform: scale(1.04); }
.gp-step__num { width: 32px; height: 32px; border-radius: 50%; background: var(--pop); color: #fff; display: grid; place-items: center; font-size: 13.5px; font-weight: 500; margin: -17px 0 8px; position: relative; border: 3px solid var(--surface); }
.gp-step h3 { font-family: var(--serif); font-weight: 400; font-size: 1.25rem; line-height: 1.15; }
.gp-step p { font-size: 12.5px; color: var(--muted); margin-top: 3px; }
.gp-step .tag:empty, .gl-row .tag:empty { display: none; }
.gp-step .tag { margin-top: 6px; }
.gp-step.gcard--soon { opacity: .75; }
.gl-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 24px; }
.gl-col, .gp-step, .gl-row__t { min-width: 0; }
.gl-row__t { overflow-wrap: anywhere; }
.gl-col { background: var(--surface); border: 1px solid var(--line); border-radius: 18px; padding: 22px 22px 12px; scroll-margin-top: 110px; }
.gl-col .h2 { font-size: clamp(1.6rem, 2.2vw, 1.9rem); margin-bottom: 10px; }
.gl-row { display: grid; grid-template-columns: 56px 1fr auto; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid var(--line); color: var(--ink); }
.gl-row img, .gl-row__ph { width: 56px; height: 44px; border-radius: 8px; object-fit: cover; background: var(--sand); display: block; }
.gl-row__t { font-size: 14.5px; line-height: 1.35; font-weight: 500; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.gl-row__m { font-size: 12px; color: var(--muted); white-space: nowrap; }
a.gl-row:hover .gl-row__t { color: var(--dark); text-decoration: underline; text-decoration-color: var(--pop-soft); text-underline-offset: 3px; }
.gl-row--soon, .gl-row.gcard--soon { opacity: .7; }
.gl-row .tag { font-size: 10px; padding: 2px 7px; }
@media (max-width: 1020px) { .gl-cols { grid-template-columns: 1fr 1fr; } .gl-col:last-child { grid-column: 1 / -1; } .gp-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 22px; } }
@media (max-width: 640px) { .gl-cols { grid-template-columns: 1fr; } .gp-steps { grid-template-columns: 1fr 1fr; } .gp-step:last-child { grid-column: 1 / -1; max-width: 50%; justify-self: center; } }

/* Guide builder: introduction, shop links, the calm "Using remedies well" note */
.gd-intro { max-width: 720px; margin: 0 auto; text-align: center; }
.gd-intro p { font-size: clamp(16.5px, 1.5vw, 18.5px); line-height: 1.75; color: #5F5048; }
.gd-intro p + p { margin-top: 12px; }
.gd-rem { display: flex; flex-direction: column; }
.gd-rem__shop { margin-top: auto; padding-top: 12px; align-self: flex-start; font-size: 13px; letter-spacing: .02em; color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.gd-rem__shop:hover { border-bottom-color: var(--dark); }
.gd-calm { max-width: 760px; margin: 0 auto; padding: clamp(20px, 2.6vw, 28px) clamp(22px, 3vw, 34px); border-radius: 18px; background: var(--bone); border: 1px solid var(--line); text-align: left; }
.section.milk .gd-calm { background: #F6F1EA; }
.gd-calm .eyebrow { margin-bottom: 6px; }
.gd-calm .h2 { margin-bottom: 16px; }
.gd-calm ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.gd-calm li { position: relative; padding-left: 26px; font-size: 15px; line-height: 1.6; color: #5F5048; }
.gd-calm li::before { content: ""; position: absolute; left: 3px; top: .38em; width: 11px; height: 6px; border-left: 1.5px solid var(--pop); border-bottom: 1.5px solid var(--pop); transform: rotate(-45deg); }
.gd-calm__000 { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); font-size: 14px; color: var(--muted); }
.gd-calm__note { max-width: 760px; margin: 14px auto 0; font-size: 14px; line-height: 1.6; color: var(--muted); text-align: center; }

/* Guide builder: "At a glance", Mind · Emotions · Body clues, highlighted lines */
.section--compact.section--tight { padding: clamp(28px, 3.5vw, 44px) 0; }
.gd-glance { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1px; max-width: 1080px; margin: 0 auto; background: var(--line); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.gd-glance > div { background: var(--bone); padding: 16px 20px 18px; }
.gd-glance dt { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.gd-glance dd { margin: 0; font-family: var(--serif); font-size: 1.2rem; line-height: 1.25; color: var(--dark); }
.gd-clues { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; max-width: 1080px; margin: 0 auto; }
.gd-clues--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 760px; }
.gd-clues--1 { grid-template-columns: 1fr; max-width: 520px; }
.gd-clue { padding: 24px 24px 22px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); border-top: 3px solid #D3DBC2; }
.gd-clue:nth-child(2) { border-top-color: #E6C3AE; }
.gd-clue:nth-child(3) { border-top-color: #D8C6B1; }
.section.milk .gd-clue { background: var(--bone); }
.gd-clue svg { width: 38px; height: 38px; fill: none; stroke: var(--pop); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; display: block; margin-bottom: 10px; }
.gd-clue h3 { font-family: var(--serif); font-weight: 400; font-size: 1.5rem; color: var(--dark); margin-bottom: 10px; }
.gd-clue ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.gd-clue li { position: relative; padding-left: 18px; font-size: 14.5px; line-height: 1.55; color: #5F5048; }
.gd-clue li::before { content: ""; position: absolute; left: 2px; top: .6em; width: 6px; height: 6px; border-radius: 50%; background: var(--pop); opacity: .6; }
.gd-quote { margin-top: 22px; padding: 4px 0 4px 18px; border-left: 3px solid #D3DBC2; font-family: var(--serif); font-style: italic; font-size: 1.35rem; line-height: 1.4; color: var(--dark) !important; }
.gd-cmp { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; max-width: 980px; margin: 0 auto; }
.gd-cmp--1 { grid-template-columns: 1fr; max-width: 560px; }
.gd-cmp__card { padding: 26px 26px 24px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); }
.section.milk .gd-cmp__card { background: var(--bone); }
.gd-cmp__card h3 { font-family: var(--serif); font-weight: 400; font-size: 1.7rem; color: var(--dark); margin-bottom: 14px; }
.gd-cmp__label { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin: 16px 0 8px; }
.gd-cmp__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.gd-cmp__list li { position: relative; padding-left: 26px; font-size: 15px; line-height: 1.55; color: var(--ink); }
.gd-cmp__list--pro li::before { content: ""; position: absolute; left: 3px; top: .3em; width: 11px; height: 6px; border-left: 2px solid var(--pop); border-bottom: 2px solid var(--pop); transform: rotate(-45deg); }
.gd-cmp__list--con li::before { content: ""; position: absolute; left: 4px; top: .65em; width: 10px; height: 2px; border-radius: 2px; background: var(--clay); }
@media (max-width: 860px) { .gd-clues, .gd-clues--2 { grid-template-columns: 1fr; max-width: 560px; } .gd-cmp { grid-template-columns: 1fr; max-width: 560px; } }
@media (max-width: 860px) { .gd-ideas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .gd-ideas { grid-template-columns: 1fr; } .gd-doctor { padding: 18px; } }
/* Tools & Guides page: space between the five steps and the card library (Leah, 19 Oct 2026) */
.gp-all { margin-top: clamp(56px, 7vw, 96px); }

/* About me: Leah's family photo at the top, in its own shape (6:5), a little larger beside the heading (Leah, 19 Oct 2026) */
body[data-page="about"] .article-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
body[data-page="about"] .article-hero__img { aspect-ratio: 6 / 5; max-width: 600px; }
body[data-page="about"] .article-hero__img img { object-fit: cover; object-position: center 40%; }
@media (max-width: 860px) { body[data-page="about"] .article-hero__grid { grid-template-columns: 1fr; } body[data-page="about"] .article-hero__img { justify-self: start; max-width: 100%; } }
/* About me: the long discovery-call button wraps on small phones instead of sticking out */
.am-btns .btn { max-width: 100%; white-space: normal; text-align: center; }

/* ================= About me, redesigned (Leah, 19 Oct 2026) =================
   Photo hero with a polaroid-style frame and a handwritten-feel note, story as chapters,
   quick facts, a dark quote band, belief cards, expect cards and training stats. */
.ab-hero { padding: calc(var(--header-h) + 26px) 0 clamp(56px, 7vw, 96px); position: relative; overflow: hidden; }
.ab-hero::before { content: ""; position: absolute; right: -12vw; top: 8%; width: 58vw; height: 84%; background: radial-gradient(closest-side, rgba(211, 219, 194, .55), rgba(211, 219, 194, 0)); pointer-events: none; }
.ab-hero__grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(36px, 6vw, 96px); align-items: center; margin-top: 28px; }
.ab-hero h1 { font-size: clamp(3rem, 5.4vw, 5.2rem); line-height: .95; letter-spacing: -.02em; margin: 18px 0 20px; }
.ab-hero h1 em { color: var(--accent); }
.ab-creds { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 30px 0 30px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ab-creds li { padding: 16px 16px 16px 0; display: flex; flex-direction: column; gap: 4px; }
.ab-creds li + li { padding-left: 16px; border-left: 1px solid var(--line); }
.ab-creds b { font-family: var(--serif); font-weight: 400; font-size: 1.15rem; line-height: 1.1; color: var(--ink); }
.ab-creds span { font-size: 12.5px; color: var(--muted); letter-spacing: .02em; }
.ab-hero__btns { display: flex; flex-wrap: wrap; gap: 12px; }
.ab-hero__btns .btn, .ab-end__btns .btn { max-width: 100%; white-space: normal; text-align: center; }

.ab-photo { position: relative; margin: 0; justify-self: end; width: 100%; max-width: 620px; }
.ab-photo__frame { background: #fff; padding: 14px 14px 0; border-radius: 4px; box-shadow: 0 30px 60px -28px rgba(42, 28, 22, .35), 0 2px 6px rgba(42, 28, 22, .06); transform: rotate(1.6deg); transition: transform .8s var(--ease); }
.ab-photo:hover .ab-photo__frame { transform: rotate(0deg); }
.ab-photo__frame img { display: block; width: 100%; height: auto; border-radius: 2px; filter: var(--grade); }
.ab-photo__frame figcaption { font-family: var(--serif); font-style: italic; font-size: 1.35rem; color: var(--dark); text-align: center; padding: 14px 10px 18px; }
.ab-photo__note { position: relative; margin: 12px 0 0 -28px; max-width: 330px; background: var(--pop-soft); color: var(--dark-deep); padding: 16px 18px; border-radius: 4px; font-size: 14px; line-height: 1.55; transform: rotate(-2deg); box-shadow: 0 14px 30px -18px rgba(42, 28, 22, .4); }
.ab-photo__note b { font-weight: 600; }

.ab-intro { padding: clamp(56px, 7vw, 96px) 0; background: var(--surface); text-align: center; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ab-intro__quote { font-family: var(--serif); font-size: clamp(1.6rem, 2.6vw, 2.3rem); line-height: 1.3; max-width: 30em; margin: 0 auto; color: var(--ink); }

.ab-story__grid { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); gap: clamp(32px, 6vw, 96px); align-items: start; max-width: 1180px; }
.ab-story__side { position: sticky; top: calc(var(--header-h) + 24px); }
.ab-story__toc { list-style: none; counter-reset: ch; margin-top: 30px; display: grid; gap: 10px; }
.ab-story__toc li { counter-increment: ch; font-size: 14px; color: var(--muted); display: flex; gap: 12px; align-items: baseline; }
.ab-story__toc li::before { content: counter(ch, decimal-leading-zero); font-family: var(--serif); color: var(--pop); font-size: 1rem; }
.ab-chapters { display: grid; gap: 0; }
.ab-ch { display: grid; grid-template-columns: 64px minmax(0, 1fr); column-gap: 18px; padding: 28px 0; border-top: 1px solid var(--line); }
.ab-ch:last-child { border-bottom: 1px solid var(--line); }
.ab-ch__n { grid-row: span 2; font-family: var(--serif); font-size: 2.4rem; line-height: 1; color: var(--pop); }
.ab-ch h3 { font-size: 1.6rem; margin-bottom: 10px; }
.ab-ch p { font-size: 16px; line-height: 1.75; color: var(--muted); }
.ab-pull { margin: 0; padding: 38px 0 38px 82px; border-top: 1px solid var(--line); }
.ab-pull p { font-family: var(--serif); font-style: italic; font-size: clamp(2rem, 3.4vw, 3rem); line-height: 1.1; color: var(--accent); }

.ab-home__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(32px, 6vw, 96px); align-items: center; max-width: 1180px; }
.ab-home__text .h2 { margin-bottom: 22px; }
.ab-home__text p:not(.eyebrow) { font-size: 16px; line-height: 1.75; color: var(--muted); }
.ab-home__text p + p { margin-top: 14px; }
.ab-home__text a { color: var(--dark); border-bottom: 1px solid var(--pop-soft); }
.ab-facts { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ab-facts li { background: var(--bone); border: 1px solid var(--line); border-radius: 6px; padding: 24px 20px; display: flex; flex-direction: column; gap: 8px; min-height: 150px; justify-content: flex-end; }
.ab-facts li:nth-child(2), .ab-facts li:nth-child(3) { background: var(--bg); }
.ab-facts b { font-family: var(--serif); font-weight: 400; font-size: clamp(2.2rem, 3.4vw, 3rem); line-height: 1; color: var(--accent); }
.ab-facts span { font-size: 14px; color: var(--dark); }

.ab-band { background: var(--dark-deep); color: var(--bg); }
.ab-band .eyebrow { color: var(--pop-light); }
.ab-band .h2 { color: var(--bg); }
.ab-band .h2 em { color: var(--pop-light); }
.ab-band__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: center; max-width: 1180px; }
.ab-band__quote { font-family: var(--serif); font-style: italic; font-size: clamp(1.7rem, 2.6vw, 2.3rem); line-height: 1.2; color: var(--hero-accent); margin-top: 26px; max-width: 16em; }
.ab-band__text p { font-size: 16px; line-height: 1.8; color: rgba(245, 239, 231, .82); }
.ab-band__text p + p { margin-top: 14px; }

.ab-head { text-align: center; max-width: 760px; margin: 0 auto clamp(30px, 4vw, 48px); }
.ab-head .h2, .ab-home .h2, .ab-band .h2, .ab-story .h2, .ab-train .h2, .ab-end .h2 { font-size: clamp(2rem, 3vw, 2.7rem); }
.ab-believe__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; max-width: 1000px; margin: 0 auto; }
.ab-belief { background: var(--surface); border: 1px solid var(--line); border-top: 3px solid var(--pop); border-radius: 6px; padding: 32px 30px; }
.ab-belief__n { font-family: var(--serif); font-size: 2.6rem; color: var(--pop); line-height: 1; display: block; margin-bottom: 14px; }
.ab-belief h3 { font-size: 1.7rem; margin-bottom: 12px; }
.ab-belief p { font-size: 15.5px; line-height: 1.7; color: var(--muted); }

.ab-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; max-width: 1180px; margin: 0 auto; }
.ab-card { background: var(--bg); border: 1px solid var(--line); border-radius: 6px; padding: 24px 22px; transition: transform .5s var(--ease), box-shadow .5s var(--ease); }
.ab-card:hover { transform: translateY(-4px); box-shadow: 0 18px 30px -22px rgba(42, 28, 22, .35); }
.ab-card svg { width: 46px; height: 46px; padding: 9px; border-radius: 50%; background: var(--pop-soft); fill: none; stroke: var(--pop); stroke-width: 1.6; margin-bottom: 16px; display: block; }
.ab-card h3 { font-size: 1.35rem; margin-bottom: 8px; }
.ab-card p { font-size: 14px; line-height: 1.6; color: var(--muted); }
.ab-expect__after { max-width: 40em; margin: clamp(30px, 4vw, 48px) auto 0; text-align: center; font-family: var(--serif); font-size: clamp(1.25rem, 1.8vw, 1.5rem); line-height: 1.45; color: var(--dark); }

.ab-train__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 96px); align-items: start; max-width: 1180px; }
.ab-train__stats { display: grid; gap: 14px; position: sticky; top: calc(var(--header-h) + 24px); }
.ab-stat { background: var(--pop); color: var(--pop-ink); border-radius: 6px; padding: 28px 26px; display: flex; flex-direction: column; gap: 6px; }
.ab-stat + .ab-stat { background: var(--sand); color: var(--dark-deep); }
.ab-stat b { font-family: var(--serif); font-weight: 400; font-size: clamp(3.4rem, 5vw, 4.6rem); line-height: .9; }
.ab-stat span { font-size: 15px; }
.ab-stat small { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; opacity: .75; }
.ab-train .h2 { margin-bottom: 22px; }
.ab-train__text p { font-size: 16px; line-height: 1.75; color: var(--muted); }
.ab-train__text p + p { margin-top: 14px; }

.ab-end { padding: 0 0 var(--section); }
.ab-end__card { background: var(--pop-soft); border-radius: 10px; padding: clamp(36px, 6vw, 72px) clamp(24px, 6vw, 80px); text-align: center; max-width: 1080px; margin: 0 auto; }
.ab-end__card .lead { margin: 18px auto 0; color: var(--dark-deep); }
.ab-end__btns { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 28px; }

@media (max-width: 1080px) { .ab-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  .ab-hero__grid, .ab-story__grid, .ab-home__grid, .ab-band__grid, .ab-train__grid { grid-template-columns: 1fr; }
  .ab-photo { justify-self: start; max-width: 100%; }
  .ab-story__side, .ab-train__stats { position: static; }
  .ab-story__toc { display: none; }
  .ab-train__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .ab-creds { grid-template-columns: 1fr; }
  .ab-creds li { padding: 12px 0; }
  .ab-creds li + li { padding-left: 0; border-left: none; border-top: 1px solid var(--line); }
  .ab-photo__note { margin: 12px 0 0 10px; max-width: calc(100% - 20px); }
  .ab-photo__frame { padding: 10px 10px 0; transform: rotate(1deg); }
  .ab-believe__grid, .ab-cards { grid-template-columns: 1fr; }
  .ab-ch { grid-template-columns: 44px minmax(0, 1fr); column-gap: 12px; }
  .ab-ch__n { font-size: 1.8rem; }
  .ab-pull { padding-left: 0; }
  .ab-facts li { min-height: 120px; padding: 18px 16px; }
  .ab-train__stats { grid-template-columns: 1fr; }
}

/* Bundle packs: "3 remedies" as a modern frosted label instead of the round sticker (Leah, 19 Oct 2026) */
.pack__sticker { top: 16px; right: 16px; width: auto; height: auto; border-radius: 999px; padding: 6px 14px 6px 6px; display: inline-flex; align-items: center; gap: 9px;
  background: rgba(252, 250, 247, .84); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); color: var(--dark-deep);
  border: 1px solid rgba(42, 28, 22, .08); box-shadow: 0 10px 24px -14px rgba(42, 28, 22, .4); transform: none;
  font-size: 11px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; line-height: 1; white-space: nowrap; }
.pack__sticker b { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--pop); color: var(--pop-ink);
  font-family: var(--serif); font-size: 17px; font-weight: 400; letter-spacing: 0; line-height: 1; }

/* About me: the confession sits quietly in the white strip under the photo (Leah, 19 Oct 2026) */
.ab-photo__frame figcaption { font-family: var(--sans); font-style: normal; font-size: 13.5px; line-height: 1.55; color: var(--muted); text-align: left; padding: 14px 6px 18px; }
.ab-photo__frame figcaption b { font-weight: 600; color: var(--dark); }

/* ===== About me: "Six things to know about me" cards ===== */
.ab-facts .beg-card { text-align: left; padding: 26px 24px 24px; }
.ab-facts .beg-card h3 { margin-top: 6px; }
.ab-fact__n { display: block; font-family: "Instrument Serif", serif; font-style: italic; font-size: 34px; line-height: 1; color: var(--pop); }
/* ===== Fertility: layers list and cycle phases (19 Oct 2026) ===== */
.fx-layers { list-style: none; padding: 0; margin: 20px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.fx-layers li { padding: 14px 16px; border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--bone); font-size: 14px; line-height: 1.5; color: var(--muted); }
.fx-layers b { display: block; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 1.2rem; color: var(--accent); margin-bottom: 2px; }
.fx-cycle { max-width: 900px; margin: 0 auto 28px; padding: 26px; border-radius: 20px; background: var(--surface); border: 1px solid var(--line); }
.fx-cycle__bar { display: grid; grid-template-columns: 5fr 8fr 3fr 12fr; gap: 6px; }
.fx-cycle__ph { display: grid; place-items: center; height: 50px; border-radius: 10px; font-size: 13px; color: var(--dark); text-align: center; padding: 0 6px; }
.fx-cycle__ph--1 { background: var(--sand); }
.fx-cycle__ph--2 { background: var(--pop-soft); }
.fx-cycle__ph--3 { background: var(--dark); color: #F5EFE7; font-family: var(--serif); font-style: italic; font-size: 1rem; }
.fx-cycle__ph--4 { background: var(--tint-soft); }
.fx-cycle__notes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }
.fx-cycle__notes p { font-size: 14px; line-height: 1.55; color: var(--muted); margin: 0; }
.fx-cycle__notes b { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.3rem; color: var(--accent); margin-bottom: 2px; }
.fx-cycle__foot { margin: 16px 0 0; font-size: 13px; color: var(--muted); text-align: center; }
@media (max-width: 760px) {
  .fx-layers, .fx-cycle__notes { grid-template-columns: 1fr; }
  .fx-cycle { padding: 18px; }
  .fx-cycle__bar { grid-template-columns: 1fr 1fr; }
  .fx-cycle__notes p { padding-left: 12px; border-left: 3px solid var(--pop-soft); }
}
/* ===== Phone menu: tidy fold-out list (Leah, 19 Oct 2026) ===== */
.mobile-menu { justify-content: flex-start; gap: 28px; }
.mobile-menu nav { display: flex; flex-direction: column; }
.mobile-menu .mm-group { border-bottom: 1px solid rgba(245, 239, 231, .16); }
.mobile-menu .mm-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mobile-menu nav a.mm-top { flex: 1; font-family: var(--serif); font-size: 1.85rem; line-height: 1.15; padding: 14px 0; margin: 0; }
.mobile-menu .mm-toggle { position: relative; flex: none; width: 44px; height: 44px; margin-right: -10px; border: 0; background: none; color: inherit; cursor: pointer; border-radius: 50%; }
.mobile-menu .mm-toggle span { position: absolute; left: 50%; top: 50%; width: 15px; height: 1.5px; margin: -0.75px 0 0 -7.5px; background: currentColor; transition: transform .35s var(--ease); }
.mobile-menu .mm-toggle span:last-child { transform: rotate(90deg); }
.mobile-menu .mm-group.open .mm-toggle span:last-child { transform: rotate(0deg); }
.mobile-menu .mm-toggle:focus-visible { outline: 1px solid currentColor; outline-offset: -4px; }
.mobile-menu nav .mm-sub { display: grid; grid-template-rows: 0fr; margin: 0; transition: grid-template-rows .4s var(--ease); }
.mobile-menu nav .mm-group.open .mm-sub { grid-template-rows: 1fr; }
.mobile-menu nav .mm-sub__in { overflow: hidden; display: flex; flex-direction: column; }
.mobile-menu nav .mm-sub a { display: block; font-family: var(--sans); font-size: 15px; line-height: 1.4; padding: 9px 0 9px 2px; opacity: .78; }
.mobile-menu nav .mm-sub a:last-child { margin-bottom: 12px; }
.mobile-menu nav .mm-sub a[aria-current="page"] { opacity: 1; color: var(--pop-light); }
@media (max-width: 1120px) and (min-width: 700px) {
  .mobile-menu nav a.mm-top { font-size: 1.6rem; padding: 12px 0; margin: 0; }
  .mobile-menu nav .mm-sub a { font-size: 14.5px; }
}
@media (prefers-reduced-motion: reduce) { .mobile-menu nav .mm-sub, .mobile-menu .mm-toggle span { transition: none; } }
/* ===== What people come to me for: skimmable cards (Leah, 19 Oct 2026) ===== */
.care-group > p.care-group__line { margin: -2px 0 14px; font-size: 14.5px; font-style: italic; font-family: var(--serif); font-size: 1.1rem; color: var(--muted); }
@media (max-width: 480px) { .care-group ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; } .care-group li { font-size: 13px; } }
/* Remedy finder: the "Popular" pills sit in their own wrapping row, each pill on one line (phone fix, 19 Oct 2026). */
.rf-popular [data-rf-popular] { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.rf-popular a, .rf-others a { display: inline-flex; align-items: center; white-space: nowrap; line-height: 1.2; }
@media (max-width: 520px) { .rf-popular { flex-direction: column; gap: 10px; } }
/* ===== Photo tone (Leah, 19 Oct 2026): every stock photo gets the same soft, warm, low-contrast finish so they match. ===== */
img[src*="images.unsplash.com"] { filter: saturate(.86) contrast(.94) brightness(1.02) sepia(.06); }
/* Buttons never grow wider than their card or column: if a label doesn't fit (medium screens, narrow cards), it
   wraps onto two lines instead of sliding under the next card (consultations, 1024px, 19 Oct 2026). */
main .btn { max-width: 100%; white-space: normal; text-align: center; line-height: 1.2; }
/* Breadcrumbs stay on one tidy line: each step keeps its words together, and a long page name is shortened with "…"
   instead of wrapping "Tools & / Guides" over two lines on phones (19 Oct 2026). */
.breadcrumb { align-items: baseline; min-width: 0; }
.breadcrumb > * { flex: none; white-space: nowrap; }
.breadcrumb > :last-child { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
/* About me intro: a short, first-person welcome under the hero (Leah, 20 Oct 2026). */
.ab-intro__body { max-width: 36em; margin: clamp(22px, 3vw, 32px) auto 0; text-align: left; }
.ab-intro__body p { font-size: clamp(16px, 1.25vw, 17.5px); line-height: 1.75; color: var(--muted); }
.ab-intro__body p + p { margin-top: 14px; }
.ab-intro__sign { margin: clamp(22px, 3vw, 30px) auto 0; font-family: var(--serif); font-style: italic; font-size: clamp(1.35rem, 2vw, 1.7rem); color: var(--accent); }
/* ---------- About me: welcome, how you'll feel, the name, sign-off (20 Oct 2026) ---------- */
.ab-welcome { padding: clamp(44px, 6vw, 76px) 0; }
.ab-welcome .ab-intro__body { text-align: center; }
.ab-why { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.ab-why b { font-weight: 500; color: var(--dark); }
.ab-feel { max-width: 980px; margin: clamp(40px, 5vw, 60px) auto 0; text-align: center; }
.ab-feel h3 { font-size: clamp(1.5rem, 2.4vw, 1.9rem); }
.ab-feel h3 em { color: var(--accent); }
.ab-feel ul { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.ab-feel li { padding: 18px 16px; border-radius: 14px; background: linear-gradient(160deg, #EFE2D5, #E6D3C2); }
.ab-feel li b { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.3rem; color: var(--dark); }
.ab-feel li span { display: block; margin-top: 4px; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.ab-feel .ab-expect__after { margin-top: 22px; }
.ab-sign { margin-top: 26px; font-size: clamp(1.8rem, 2.8vw, 2.3rem); }
@media (max-width: 760px) { .ab-feel ul { grid-template-columns: 1fr 1fr; } }
/* Fact cards: text lines up with the heading (it was centred under it) */
.ab-facts .beg-card p { margin: 6px 0 0; max-width: none; }

/* "What people come to me for": short-term list in two columns, with the same round icons as the
   ongoing cards (Leah, 26 Oct 2026) */
.st-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 44px; max-width: 1080px; margin: 0 auto; border-top: 1px solid var(--line); }
.st-item { display: flex; align-items: flex-start; gap: 14px; padding: 16px 2px; border-bottom: 1px solid var(--line); }
.st-item h3 { font-size: clamp(1.2rem, 1.5vw, 1.35rem); line-height: 1.15; margin: 4px 0 3px; }
.st-item p { font-size: 14px; line-height: 1.5; color: var(--muted); }
/* Phones only: two compact columns of icon and title (the description lines are left out) */
@media (max-width: 640px) {
  .st-list { gap: 0 14px; }
  .st-item { align-items: center; gap: 10px; padding: 12px 0; }
  .st-item .care-group__icon { width: 30px; height: 30px; padding: 5px; }
  .st-item h3 { font-size: 1.05rem; margin: 0; }
  .st-item p { display: none; }
}
.care-group__link { display: inline-block; margin-top: 14px; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--dark); text-decoration: underline; text-underline-offset: 4px; }

/* Consultations: the short booking note under the options (Leah, 26 Oct 2026) */
.cx-policy { max-width: 640px; margin: 28px auto 0; text-align: center; font-size: 14px; line-height: 1.6; color: var(--muted); }
.cx-policy a { color: var(--dark); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }

/* Acute remedy finder: short-term only; ongoing → initial consultation (Leah, 26 Oct 2026) */
.rf-scope { margin-top: 14px; font-size: 14px; line-height: 1.55; color: var(--muted); }
.rf-scope a { color: var(--dark); text-decoration: underline; text-underline-offset: 3px; }
.rf-ongoing { margin: 22px 0 0; padding: 16px 20px; border-left: 3px solid #687852; background: rgba(195, 205, 170, .22); border-radius: 0 var(--r-sm, 4px) var(--r-sm, 4px) 0; font-size: 14.5px; line-height: 1.6; color: var(--dark); }
.rf-ongoing a { display: inline-block; margin-top: 4px; color: var(--dark); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }

/* "Same day? Email me" under acute booking buttons (Leah, 26 Oct 2026) */
.same-day { display: block; margin-top: 8px; font-size: 13px; color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.same-day--light { display: inline-block; margin: 10px 0 0 12px; color: rgba(245, 239, 231, .8); }

/* Mobile homepage cover (Leah, 26 Oct 2026): the cover fills the whole phone screen on load (nothing else shows until
   you scroll). The photo sits across the top as zoomed-out as the screen allows, fades into one deep colour, and the
   words sit on its lower part with the buttons near the bottom of the screen. Computer layout unchanged. */
.hero .btn-short { display: none; }
@media (max-width: 600px) {
  .hero { background: #2E241D; min-height: 100vh; min-height: 100svh; }
  .hero__img { bottom: auto; height: calc(100vh - 110px); height: calc(100svh - 110px); }
  .hero__img img { object-position: 52% 32%; }
  .hero::before { background: linear-gradient(180deg, rgba(46, 36, 29, .45) 0%, rgba(46, 36, 29, 0) 16%, rgba(46, 36, 29, 0) 48%, rgba(46, 36, 29, .78) 74%, #2E241D calc(100svh - 110px)) !important; }
  .hero__inner { padding-top: calc(var(--header-h) + 24px); padding-bottom: 40px; }
  .hero .display { font-size: min(32px, 8.4vw); line-height: 1.02; }
  .hero__copy .lead { margin-top: 10px; font-size: 15px; line-height: 1.5; }
  .hero__ctas { margin-top: 18px; }
  .hero__ctas .btn { white-space: nowrap; padding-left: 8px; padding-right: 8px; letter-spacing: .1em; }
  .hero__note { display: none; }
  .hero .btn-long { display: none; }
  .hero .btn-short { display: inline; }
}

/* Leah, 26 Oct 2026: between phone and full computer width the photo fills the whole cover too (no brown bands under it);
   the bottom fades into the photo's own dark tone behind the words. */
@media (min-width: 601px) and (max-width: 860px) {
  .hero { min-height: 100vh; min-height: 100svh; background: #2E241D; }
  .hero__img { bottom: 0; height: auto; }
  .hero__img img { object-position: 60% 35%; }
  .hero__inner { padding-top: calc(var(--header-h) + 40px); }
  .hero::before { background: linear-gradient(180deg, rgba(46, 36, 29, .45) 0%, rgba(46, 36, 29, 0) 20%, rgba(46, 36, 29, 0) 42%, rgba(46, 36, 29, .7) 72%, rgba(46, 36, 29, .9) 100%) !important; }
}

/* Leah, 26 Oct 2026: six key ideas sit in two rows of three; a wide closing card on About me */
.ah-ideas { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1000px; }
.beg-card--wide { grid-column: 1 / -1; max-width: 640px; justify-self: center; width: 100%; }
@media (max-width: 860px) { .ah-ideas { grid-template-columns: 1fr; } }

/* Coming-soon blends on the blends page (Leah, 26 Oct 2026) */
.blend-card.is-soon { opacity: .72; }
.blend-card__soon { display: inline-block; margin-top: 8px; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }

/* "What's in it" line in the blends Ingredients tab (Leah, 26 Oct 2026) */
.blend-whats { margin: 0 0 10px; line-height: 1.6; }

/* Dripolator tip under the lid choice (Leah, 26 Oct 2026) */
.lid-note { margin: 10px 0 0; font-size: 13px; line-height: 1.5; color: var(--muted); }
/* "Recommended" badge on the Dripolator lid (Leah, 26 Oct 2026) */
.seg .lid-rec { position: absolute; top: -9px; left: 10px; padding: 2px 7px 1px; border-radius: 99px; background: var(--pop); color: var(--pop-ink); font-size: 9.5px; font-style: normal; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; line-height: 1.5; }
/* About Me hero, simple version (Leah, 27 Oct 2026): four points with icons in two columns, Polaroid photo
   with no caption (thicker bottom edge), and the story in one easy-to-read column. */
.ab-creds { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ab-creds li, .ab-creds li + li { flex-direction: column; align-items: flex-start; gap: 10px; padding: 18px 18px 18px 0; border-top: 0; border-bottom: 0; }
.ab-creds li + li { padding-left: 18px; border-left: 1px solid var(--line); }
.ab-creds li > div { display: flex; flex-direction: column; gap: 4px; }
.ab-creds svg { flex: none; width: 28px; height: 28px; margin-top: 1px; fill: none; stroke: var(--pop); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.ab-photo__frame { padding-bottom: 48px; }
.ab-story1 { grid-template-columns: 1fr; max-width: 720px; gap: 6px; }
.ab-story1 .ab-why { border-top: 0; border-left: 3px solid var(--pop); padding: 2px 0 2px 18px; margin-top: 22px; }
@media (max-width: 600px) {
  .ab-creds { grid-template-columns: 1fr; }
  .ab-creds li, .ab-creds li + li { flex-direction: row; align-items: center; gap: 14px; padding: 12px 0; border-left: 0; }
  .ab-creds li + li { border-top: 1px solid var(--line); }
  .ab-photo__frame { padding-bottom: 32px; }
}

/* Home page (Leah, 29 Oct 2026): "What you get when you work with me" boxes straight after the photo,
   a sand "Hey, I'm Leah" with her family photo (shown on phones too), and the shop in one row of four. */
.wyg { background: var(--bg); padding: clamp(56px, 6vw, 88px) 0; }
.wyg .centre-head { margin-bottom: clamp(28px, 3vw, 40px); }
.wyg .centre-head .h2 { font-size: clamp(1.9rem, 2.8vw, 2.5rem); line-height: 1.05; margin-bottom: 14px; }
.wyg .centre-head p.muted { margin: 0 auto; max-width: 36em; font-size: 15px; line-height: 1.6; }
.wyg-grid { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; max-width: 1080px; margin: 0 auto; }
.wyg-grid li { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 24px 14px 22px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; }
.wyg-grid svg { width: 28px; height: 28px; margin-bottom: 8px; fill: none; stroke: var(--pop); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.wyg-grid li:nth-child(4n + 2) svg { stroke: var(--clay); }
.wyg-grid li:nth-child(4n + 3) svg { stroke: var(--accent); }
.wyg-grid li:nth-child(4n + 4) svg { stroke: #B8913F; }
.wyg-grid h3 { font-size: 1.5rem; line-height: 1.1; white-space: nowrap; }
.wyg-grid p { font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.wyg-link { text-align: center; margin-top: 30px; }
.wyg-link a { font-size: 11.5px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--dark); text-decoration: underline; text-underline-offset: 5px; text-decoration-color: rgba(94, 80, 69, .35); }
body[data-page="home"] #about { background: var(--sand); }
#about .intro__copy p { max-width: 36em; line-height: 1.75; text-wrap: pretty; }
#about .intro__copy p + p { margin-top: 16px; }
#about .pic--short img { object-position: 42% 72%; }
.same-inline { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.book-item p { max-width: 19em; }
.products--shop { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 820px; gap: 22px 18px; }
.products--shop .prod__media { aspect-ratio: 1; }
.products--shop .prod__body h3 { font-size: 1.1rem; }
.products--shop .prod__price { font-size: 12.5px; }
.products--shop .tag { display: none; }
@media (max-width: 860px) {
  .products--shop { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
  .products--shop .prod__body { padding-top: 8px; }
  .products--shop .prod__body h3 { font-size: .92rem; line-height: 1.15; min-height: 3.45em; }
  .products--shop .prod__body h3 .arrow { display: none; }
  .products--shop .prod__price { font-size: 10.5px; }
}
@media (max-width: 760px) {
  .wyg-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .wyg-grid li { padding: 16px 8px; gap: 4px; }
  .wyg-grid svg { width: 22px; height: 22px; margin-bottom: 6px; }
  .wyg-grid h3 { font-size: 1.05rem; white-space: normal; }
  .wyg-grid p { font-size: 11.5px; }
  body[data-page="home"] #about { padding: 52px 0; }
  body[data-page="home"] #about .intro__pics { max-width: 100%; margin-top: 28px; }
  body[data-page="home"] #about .pic--short { aspect-ratio: 4 / 3; }
  body[data-page="home"] #about .ah-btns { margin-top: 24px !important; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  body[data-page="home"] #about .ah-btns .btn { justify-content: center; padding-left: 8px; padding-right: 8px; }
}