/* ============================================================
   Mares & Makers — Obsidian style, brand palette
   Bold Obsidian-Media structure (hard borders, offset shadows, clip-path
   bands, pill buttons) recoloured with the original brand palette —
   Espresso, Sage, Dusty Rose, Antique Brass — pushed more saturated/darker
   than the muted brand-kit hexes so they hold their own against the
   heavier obsidian treatment (thick borders, black bands, hard shadows).
   ============================================================ */
body[data-theme="obsidian"]{
  --bg:#FFFFFF; --text:#4A302D; --accent:#B8842A; --accent-ink:#7A5310; --accent-soft:#FBF0DE; --border:#E9E3D6;
  --card:#FFFFFF; --bg-subtle:#FBF0DE; --bg-dark:#211509; --espresso:#4A302D;
  --rose:#BD3F63; --rose-soft:#FBE7ED; --sage:#4F6339; --sage-soft:#EAF0E2; --rosette:#A61E32; --cream:#FFFFFF; --ink:#4A302D;
  --font:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-display:'Rubik','Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-hand:'Caveat','Segoe Script',cursive;
  --band-cream:color-mix(in srgb,var(--accent) 6%,#fff);
  --band-rose:color-mix(in srgb,var(--rose) 12%,#fff);
  --band-sage:color-mix(in srgb,var(--sage) 8%,#fff);
  --sage-soft:color-mix(in srgb,var(--sage) 10%,#fff);
}
body[data-theme="obsidian"]{font-family:var(--font);font-weight:500}
body[data-theme="obsidian"] h1,body[data-theme="obsidian"] h2,body[data-theme="obsidian"] h3{
  font-family:var(--font-display);font-weight:900;text-transform:none;line-height:1.02;letter-spacing:-.025em;
}
body[data-theme="obsidian"] .hero h1{font-size:clamp(34px,4.2vw,64px) !important;letter-spacing:-.015em !important;line-height:1.04 !important}
body[data-theme="obsidian"] .head h2,
body[data-theme="obsidian"] .audit-copy h2,
body[data-theme="obsidian"] .quote .q h2,
body[data-theme="obsidian"] .about h2,
body[data-theme="obsidian"] .cta h2{
  font-size:clamp(34px,5vw,64px) !important;letter-spacing:-.025em !important;line-height:1.0 !important;
}
body[data-theme="obsidian"] .eyebrow{font-weight:800;text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--accent);margin-bottom:18px}
body[data-theme="obsidian"] .stat .n{font-family:var(--font-display);font-weight:900;font-size:clamp(26px,4.4vw,58px);letter-spacing:-.02em;color:var(--accent)}
body[data-theme="obsidian"] .hero-scrim{background:linear-gradient(95deg,rgba(38,36,31,.70) 0%,rgba(38,36,31,.54) 36%,rgba(38,36,31,.22) 66%,rgba(38,36,31,0) 100%)}
@media(max-width:900px){
  body[data-theme="obsidian"] .hero-scrim{background:linear-gradient(178deg,rgba(38,36,31,.56) 0%,rgba(38,36,31,.72) 45%,rgba(38,36,31,.72) 100%)}
}

/* ---- buttons: Obsidian's exact pill metrics ---- */
body[data-theme="obsidian"] .btn-primary,
body[data-theme="obsidian"] .btn-secondary,
body[data-theme="obsidian"] .hero .btn-primary,
body[data-theme="obsidian"] .band-espresso .btn-primary,
body[data-theme="obsidian"] .toolkit-list .btn-primary,
body[data-theme="obsidian"] .fdr-slide.s-signoff .btn-primary,
body[data-theme="obsidian"] .dark .btn-primary{
  height:auto !important;padding:18px 30px !important;font-size:15px !important;gap:10px !important;
  border-radius:60px !important;font-weight:800;text-transform:uppercase;letter-spacing:.04em;
  box-shadow:none !important;transition:transform .18s,background .18s,border-color .18s,color .18s !important;
}
body[data-theme="obsidian"] .btn-primary,
body[data-theme="obsidian"] .hero .btn-primary,
body[data-theme="obsidian"] .band-espresso .btn-primary,
body[data-theme="obsidian"] .toolkit-list .btn-primary,
body[data-theme="obsidian"] .fdr-slide.s-signoff .btn-primary,
body[data-theme="obsidian"] .dark .btn-primary{
  border:3px solid var(--accent) !important;background:var(--accent) !important;color:#fff !important;
}
body[data-theme="obsidian"] .btn-primary:hover,
body[data-theme="obsidian"] .hero .btn-primary:hover,
body[data-theme="obsidian"] .band-espresso .btn-primary:hover,
body[data-theme="obsidian"] .toolkit-list .btn-primary:hover,
body[data-theme="obsidian"] .fdr-slide.s-signoff .btn-primary:hover,
body[data-theme="obsidian"] .dark .btn-primary:hover{
  transform:translateY(-2px) rotate(-1deg) !important;
  background:var(--accent-ink) !important;border-color:var(--accent-ink) !important;color:#fff !important;
}
body[data-theme="obsidian"] .btn-secondary{
  background:transparent !important;color:var(--text) !important;border:3px solid var(--text) !important;
}
body[data-theme="obsidian"] .btn-secondary:hover{
  background:var(--bg-dark) !important;color:#fff !important;border-color:var(--bg-dark) !important;
  transform:translateY(-2px) rotate(-1deg) !important;
}
body[data-theme="obsidian"] .btn-hero-ghost{
  height:auto !important;padding:18px 30px !important;font-size:15px !important;border-radius:60px !important;
  border:3px solid #fff !important;background:transparent !important;color:#fff !important;
  font-weight:800;text-transform:uppercase;letter-spacing:.04em;
}
body[data-theme="obsidian"] .btn-hero-ghost:hover{background:#fff !important;color:var(--text) !important}

/* ---- Obsidian card treatment: hard-offset drop-shadow hover ---- */
body[data-theme="obsidian"] .card,
body[data-theme="obsidian"] .why-card,
body[data-theme="obsidian"] .rev-card,
body[data-theme="obsidian"] .pkgd-card,
body[data-theme="obsidian"] .step,
body[data-theme="obsidian"] .jrny-card,
body[data-theme="obsidian"] .path-card,
body[data-theme="obsidian"] .notsure,
body[data-theme="obsidian"] .frame,
body[data-theme="obsidian"] .tab-panel{
  border:2px solid var(--text) !important;border-radius:20px !important;box-shadow:none !important;
  transition:transform .18s ease,box-shadow .18s ease !important;
}
body[data-theme="obsidian"] .card:hover,
body[data-theme="obsidian"] .why-card:hover,
body[data-theme="obsidian"] .rev-card:hover,
body[data-theme="obsidian"] .pkgd-card:hover,
body[data-theme="obsidian"] .step:hover,
body[data-theme="obsidian"] .jrny-card:hover,
body[data-theme="obsidian"] .path-card:hover,
body[data-theme="obsidian"] .notsure:hover,
body[data-theme="obsidian"] .frame:hover,
body[data-theme="obsidian"] .tab-panel:hover{
  transform:translateY(-6px) rotate(-.5deg) !important;box-shadow:10px 12px 0 var(--accent) !important;
}

/* ---- "how it works": white band, sage cards with white text, sage text outside cards ---- */
body[data-theme="obsidian"] #system{
  background:#FBF8F2 !important;color:#8FA873 !important;
  position:relative;z-index:1;
  padding-top:calc(36px + 4.5vw) !important;padding-bottom:calc(20px + 4.5vw) !important;
  border-bottom:none !important;
}
body[data-theme="obsidian"] #system h2,body[data-theme="obsidian"] #system h3{color:#8FA873 !important}
body[data-theme="obsidian"] #system h2.system-title{color:#FF9EBB !important}
body[data-theme="obsidian"] #system p{color:#8FA873 !important}
body[data-theme="obsidian"] #system .head p{color:#4A302D !important}
body[data-theme="obsidian"] #system .eyebrow{color:#8FA873 !important}
body[data-theme="obsidian"] #system .tab-panel{background:#8FA873 !important;color:#fff;border:none !important;transition:none !important}
body[data-theme="obsidian"] #system .tab-panel:hover{transform:none !important;box-shadow:none !important}
body[data-theme="obsidian"] #system .tab-panel p,body[data-theme="obsidian"] #system .tab-bullets,body[data-theme="obsidian"] #system .tab-bullets li,body[data-theme="obsidian"] #system .tab-lede{color:#fff !important}
body[data-theme="obsidian"] #system .tab-step{color:#8FA873 !important;opacity:.75}
body[data-theme="obsidian"] #system .tab-ic{background:transparent !important;color:#fff !important;opacity:.5 !important}

/* ---- "why mares & makers": cream section, pink heading. The cards carry their
   own colours from index.html (the shared bordered-card system), so nothing here
   repaints them. ---- */
body[data-theme="obsidian"] #why{background:#FBF8F2 !important}
body[data-theme="obsidian"] #why .head h2{color:#FF9EBB !important}
body[data-theme="obsidian"] #why .head p{color:#4A302D !important}
body[data-theme="obsidian"] #why .real-copy p{color:#4A302D !important}
body[data-theme="obsidian"] #why .real-copy strong{color:#BD3F63 !important}
body[data-theme="obsidian"] #why .real-card{border-color:var(--text) !important;border-radius:16px !important;box-shadow:5px 6px 0 var(--pop) !important}
body[data-theme="obsidian"] #why .real-card:hover{transform:translate(-3px,-4px) !important;box-shadow:9px 12px 0 var(--pop) !important}
body[data-theme="obsidian"] #why .real-card h3{color:var(--espresso) !important}
body[data-theme="obsidian"] #why .real-card p{color:#000 !important}
body[data-theme="obsidian"] #why .real-card .ic{border-color:var(--text) !important;background:var(--pop-soft) !important;color:var(--pop-ink) !important;box-shadow:none !important}

/* ---- "packages": cream section (unchanged), pink cards + text — same treatment as #why ---- */
body[data-theme="obsidian"] #packages{--pkg-pink-card:#FF9EBB;--pkg-pink-accent:#BF778C;
  /* rose accent for the packages lettering + accents (replaces the gold, this section only) */
  --accent:#FF9EBB;--accent-ink:#FF9EBB;--accent-soft:#F7E8EC;
  --pkg-hair:rgba(255,158,187,.55);--pkg-glow:rgba(189,63,99,.5)}
body[data-theme="obsidian"] #packages .head h2{color:var(--accent) !important}
body[data-theme="obsidian"] #packages .head p{color:#4A302D !important}
body[data-theme="obsidian"] #packages .pkgd-card{background:#FFF4F7 !important;border-color:#F3D9E1 !important}
body[data-theme="obsidian"] #packages .pkgd-card:hover{box-shadow:10px 12px 0 var(--pkg-pink-card) !important}
body[data-theme="obsidian"] #packages .pkgd-top{background:#FFF4F7 !important;border-bottom-color:#F3D9E1 !important}
body[data-theme="obsidian"] #packages .pkgd-name,
body[data-theme="obsidian"] #packages .pkgd-short,
body[data-theme="obsidian"] #packages .pkgd-result,
body[data-theme="obsidian"] #packages .pkgd-bestfor{color:var(--pkg-pink-card) !important}
body[data-theme="obsidian"] #packages .pkgd-bestfor b{color:var(--pkg-pink-card) !important}
body[data-theme="obsidian"] #packages .pkgd-prow .lbl,
body[data-theme="obsidian"] #packages .pkgd-prow .amt,
body[data-theme="obsidian"] #packages .pkgd-prow .amt small{color:var(--pkg-pink-card) !important}
body[data-theme="obsidian"] #packages .pkgd-prow .amt .from{color:var(--pkg-pink-card) !important}
body[data-theme="obsidian"] #packages .pkgd-ic{background:#fff !important;color:#BD3F63 !important;border-color:#F3D9E1 !important}
body[data-theme="obsidian"] #packages .pkgd-rule{background:var(--pkg-pink-card) !important}
body[data-theme="obsidian"] #packages .pkgd-prices{border:none !important}
body[data-theme="obsidian"] #packages .pkgd-pop{background:var(--pkg-pink-card) !important;color:#fff !important}
body[data-theme="obsidian"] #packages .pkgd-card.is-pop{box-shadow:0 0 0 2px var(--pkg-pink-card),0 34px 66px -44px var(--pkg-glow) !important}
body[data-theme="obsidian"] #packages .pkgd-toggle{background:#FFF4F7 !important;color:var(--pkg-pink-card) !important}
body[data-theme="obsidian"] #packages .pkgd-toggle:hover{background:#FFEAF0 !important}
body[data-theme="obsidian"] #packages .pkgd-incl li:before{border-color:var(--pkg-pink-card) !important}
body[data-theme="obsidian"] #packages .pkgd-inclh{color:var(--pkg-pink-card) !important}
body[data-theme="obsidian"] #packages .pkgd-incl li,
body[data-theme="obsidian"] #packages .pkgd-incl li.carry{color:var(--pkg-pink-card) !important}
body[data-theme="obsidian"] #packages .pkgd-incl li{border-top-color:#F5E3E8 !important}
body[data-theme="obsidian"] #packages .pkgd-foot{background:transparent !important;border-top-color:#F5E3E8 !important}
/* v2 card (The Stable): the "what's included" header is the top of the white list tile */
body[data-theme="obsidian"] #packages .pkgv2 .pkgd-toggle,
body[data-theme="obsidian"] #packages .pkgv2 .pkgd-toggle:hover{background:#fff !important}
body[data-theme="obsidian"] #packages .pkgv2 .pkgd-ic{border-color:transparent !important}
/* symbols (card icon, tick circles, row icons) stay cherry — lettering is the bright pink */
body[data-theme="obsidian"] #packages .pkgv2{--pkv-rose:#BD3F63 !important}
/* header band is the bright pink; its lettering is white */
body[data-theme="obsidian"] #packages .pkv-hero{background:#FF9EBB !important}
body[data-theme="obsidian"] #packages .pkv-name,
body[data-theme="obsidian"] #packages .pkv-short,
body[data-theme="obsidian"] #packages .pkv-result{color:#fff !important}
body[data-theme="obsidian"] #packages .pkv-rule{background:rgba(255,255,255,.7) !important}
body[data-theme="obsidian"] #packages .pkv-pop{background:#B8842A !important;color:#fff !important}
/* "designed for" tile: mid pink — lighter than the header band, brighter than the card ground */
body[data-theme="obsidian"] #packages .pkv-tile.pkv-for{background:#FFD3E1 !important}
body[data-theme="obsidian"] #packages .pkv-for .pkv-tic{background:#fff !important}
body[data-theme="obsidian"] #packages .pkv-for b{color:#BD3F63 !important}
body[data-theme="obsidian"] #packages .pkv-tail{color:#B8842A !important;opacity:1 !important}

/* ---- "kind words" / reviews: cream section, green heading (same green as #system) ---- */
body[data-theme="obsidian"] #reviews .head h2,
body[data-theme="obsidian"] #reviews .eyebrow{color:#8FA873 !important}
body[data-theme="obsidian"] #reviews .head h2.system-title{color:#FF9EBB !important}
body[data-theme="obsidian"] #reviews .head p{color:#4A302D !important}
body[data-theme="obsidian"] #reviews .rev-card{border:none !important;box-shadow:0 22px 46px -32px rgba(59,42,33,.42) !important}
body[data-theme="obsidian"] #reviews .rev-card:hover{box-shadow:0 26px 52px -30px rgba(59,42,33,.48) !important}

/* ---- #herd, #resource, #contact, footer: pinned back to the original brand-kit
   tokens (these sections are mostly hardcoded already; this just resets the couple
   of var(--accent)/var(--espresso) references still inside them) ---- */
body[data-theme="obsidian"] .lmp,
body[data-theme="obsidian"] #herd,
body[data-theme="obsidian"] #contact,
body[data-theme="obsidian"] .foot{
  --accent:#B0894F; --accent-ink:#8A6A3B; --accent-soft:#F4F0E9;
  --rose:#C9A1A0; --rose-soft:#F6ECEB; --sage:#878C6B; --sage-soft:#EAEEE1;
  --espresso:#3B2A21; --cream:#F4ECE0; --ink:#26241F; --rosette:#9B2D30;
  --band-cream:#FAF6EF; --band-rose:#FBF1EF; --band-sage:#F1F3EC;
}

/* ---- nav: stays white throughout scrolling ---- */

/* ---- revamp pass: hero trust badges, stars, focus glow (was gold/brown) ---- */
body[data-theme="obsidian"] .hero-eyebrow,
body[data-theme="obsidian"] .hero-trust svg,
body[data-theme="obsidian"] .hero-quote .hq-stars{color:var(--accent) !important}
body[data-theme="obsidian"] .hero-field:focus{box-shadow:0 0 0 4px rgba(184,132,42,.3) !important}

/* ---- founder carousel: kicker/eyebrow gold + shadow tint + arrow border ---- */
body[data-theme="obsidian"] .fdr-slide.s-dark .fdr-kicker,
body[data-theme="obsidian"] .fdr-slide.s-cover .eyebrow{color:var(--accent) !important}
body[data-theme="obsidian"] .fdr-slide{box-shadow:none !important;border:2px solid var(--text) !important}
body[data-theme="obsidian"] .fdr-slide.s-cream::after,
body[data-theme="obsidian"] .fdr-slide.s-blush::after,
body[data-theme="obsidian"] .fdr-slide.s-signoff::after{background:radial-gradient(120% 78% at 100% 0%,rgba(184,132,42,.1),transparent 58%) !important}
body[data-theme="obsidian"] .fdr-dot{background:rgba(10,10,11,.22) !important}
body[data-theme="obsidian"] .fdr-arrow{border:2px solid var(--text) !important}
body[data-theme="obsidian"] .fdr-arrow:hover{background:var(--accent) !important;border-color:var(--accent) !important;color:#fff !important}

/* ---- "how it works" tab dots + closing pill CTA (was gold gradient + italic) ---- */
body[data-theme="obsidian"] .how-dots i{background:rgba(10,10,11,.22) !important}
body[data-theme="obsidian"] .cm-t2{
  background:linear-gradient(135deg,#D9A84B,#8A6021) !important;color:#fff !important;font-style:normal !important;
  border:0 !important;border-radius:60px !important;box-shadow:0 16px 30px -14px rgba(122,83,16,.75) !important;
}
body[data-theme="obsidian"] .cm-t2:hover{color:#fff !important;box-shadow:0 22px 38px -14px rgba(122,83,16,.8) !important;transform:translateY(-2px) !important}
body[data-theme="obsidian"] .cm-o2{border:0 !important;background:linear-gradient(135deg,#FF9EBB,#BD3F63) !important;color:#fff !important;box-shadow:0 16px 30px -14px rgba(189,63,99,.75) !important}
body[data-theme="obsidian"] .cm-o2:hover{color:#fff !important;transform:translateY(-2px) !important;box-shadow:0 22px 38px -14px rgba(189,63,99,.8) !important}

/* ---- package/journey highlight rings (was brown-tinted glow) ---- */
body[data-theme="obsidian"] .jrny-card.active{box-shadow:0 0 0 1px var(--accent),0 18px 40px -26px rgba(184,132,42,.35) !important}
body[data-theme="obsidian"] .pkgd-card.is-pop{box-shadow:0 0 0 2px var(--accent),0 34px 66px -44px rgba(184,132,42,.35) !important}
body[data-theme="obsidian"] .pkgd-pop{background:var(--accent) !important;color:#fff !important}

/* ---- icon roundels: ink/pink border instead of default grey ---- */
body[data-theme="obsidian"] .card .ic,
body[data-theme="obsidian"] .pkgd-ic{border:2px solid var(--text) !important}
body[data-theme="obsidian"] .why-card .ic{border:2px solid var(--accent) !important}
body[data-theme="obsidian"] .path-ic,
body[data-theme="obsidian"] .s-week .no{color:var(--accent-ink) !important}
body[data-theme="obsidian"] .tab-ic{color:var(--accent-ink) !important}

/* ---- "why us" bento cards: gold/rose/sage top ribbons -> pink/ink ---- */
body[data-theme="obsidian"] .card.c1 .card-top,
body[data-theme="obsidian"] .card.c2 .card-top,
body[data-theme="obsidian"] .card.c3 .card-top,
body[data-theme="obsidian"] .card.c4 .card-top{background:var(--bg-dark) !important}
/* ---- #products (the Toolkit): cream section, pink heading, cards alternate pink/green/pink ---- */
body[data-theme="obsidian"] #products{background:var(--band-cream) !important}
body[data-theme="obsidian"] #products .head h2{color:#FF9EBB !important}
body[data-theme="obsidian"] .badge{color:var(--text) !important}
body[data-theme="obsidian"] .card.c4 .badge{color:#fff !important}
body[data-theme="obsidian"] .card.c2 .card-feats li::before{border-color:var(--text) !important}
body[data-theme="obsidian"] .card-cta:hover,
body[data-theme="obsidian"] .toolkit-list .btn-primary:hover{background:var(--bg-dark) !important}
body[data-theme="obsidian"] .screen{border:2px solid var(--text) !important;box-shadow:none !important;border-radius:20px !important}
body[data-theme="obsidian"] .toolkit-list{background:var(--bg-subtle) !important;border:2px solid var(--text) !important}
body[data-theme="obsidian"] .toolkit-list .field{border-color:var(--text) !important}
/* the pop-up borrows the hero card fields and the shop CTA pill */
body[data-theme="obsidian"] .lmp-form .field{border:1px solid #E5E7EA !important;background:#F4F5F7 !important}
body[data-theme="obsidian"] .lmp-form .field:focus{background:#fff !important;border-color:#FF9EBB !important;box-shadow:0 0 0 3px rgba(255,158,187,.28) !important}
body[data-theme="obsidian"] .lmp-form .btn-primary{background:#FF9EBB !important;border:2px solid var(--espresso) !important;color:#fff !important}
body[data-theme="obsidian"] .lmp-form .btn-primary:hover{background:#FF83A8 !important;border-color:var(--espresso) !important;transform:translateY(-1px) !important}

/* ---- form fields: bolder ink border + pink focus ring (was thin grey + brown glow) ---- */
body[data-theme="obsidian"] .field{border:2px solid var(--text) !important}
body[data-theme="obsidian"] .field:focus{border-color:var(--accent) !important;box-shadow:0 0 0 4px rgba(184,132,42,.25) !important}
body[data-theme="obsidian"] .form-success{border-color:var(--accent) !important}

/* ---- nav/menu/audit-form shells: ink-tinted shadows instead of brown ---- */
body[data-theme="obsidian"] .nav-in,
body[data-theme="obsidian"] .nav-in.scrolled{box-shadow:none !important}
body[data-theme="obsidian"] .mobile-menu{border:2px solid var(--text) !important;box-shadow:8px 8px 0 #FF9EBB !important}
body[data-theme="obsidian"] .mobile-menu a.nav-cta:hover,
body[data-theme="obsidian"] .mobile-menu a.nav-cta.active,
body[data-theme="obsidian"] .mobile-menu a.js-book:hover{background:#FF83A8 !important}
body[data-theme="obsidian"] .audit-form,
body[data-theme="obsidian"] .audit-thanks{border:2px solid var(--text) !important;box-shadow:none !important;border-radius:20px !important}

/* ---- lightbox (obsidian ink overlay only — herd ribbon left as original) ---- */

/* ---- toolkit "peek inside" fake app-screen mockups: espresso/gold/sage -> ink/pink ---- */
body[data-theme="obsidian"] .s-cap .ig-img{background:linear-gradient(150deg,var(--accent),var(--accent-ink)) !important}
body[data-theme="obsidian"] .s-reel{background:linear-gradient(160deg,var(--text),#232228) !important}
body[data-theme="obsidian"] .s-lesson{background:linear-gradient(160deg,var(--text),#1c1c20) !important}
body[data-theme="obsidian"] .s-call{background:#1c1c20 !important}
body[data-theme="obsidian"] .s-call .vt{background:linear-gradient(150deg,#232228,#3a3a42) !important}
body[data-theme="obsidian"] .s-call .vt:nth-child(4) .fa{background:var(--accent) !important}
body[data-theme="obsidian"] .s-call .vt:nth-child(6) .fa{background:var(--accent-ink) !important}
body[data-theme="obsidian"] .tile .mk-label{color:var(--text-2) !important}

/* ---- one vertical rhythm for every content section: same top/bottom padding
   everywhere so the gaps between sections read as a single consistent band ---- */
body[data-theme="obsidian"] #why,
body[data-theme="obsidian"] #packages,
body[data-theme="obsidian"] #reviews,
body[data-theme="obsidian"] #products,
body[data-theme="obsidian"] #work-teaser,
body[data-theme="obsidian"] #caseStudy,
body[data-theme="obsidian"] #herd,
body[data-theme="obsidian"] #about,
body[data-theme="obsidian"] #contact,
body[data-theme="obsidian"] #resource,
body[data-theme="obsidian"] .lmp{
  padding-top:clamp(26px,3vw,40px) !important;padding-bottom:clamp(26px,3vw,40px) !important;
}
/* #system sits on the shared rhythm like every other band */
body[data-theme="obsidian"] #system{
  padding-top:clamp(26px,3vw,40px) !important;
  padding-bottom:clamp(26px,3vw,40px) !important;
}
/* the hero and the footer meet the same rhythm at their inner seams */
body[data-theme="obsidian"] .hero{padding-bottom:clamp(26px,3vw,40px) !important}
body[data-theme="obsidian"] .foot{padding-top:clamp(26px,3vw,40px) !important}
body[data-theme="obsidian"] #about .fdr-intro{margin-bottom:18px !important}
body[data-theme="obsidian"] .fdr-swipe{color:#FF9EBB !important}

/* ---- flat pass: no drop shadows on images or cards (hover included) ---- */
body[data-theme="obsidian"] img,
body[data-theme="obsidian"] .card,body[data-theme="obsidian"] .card:hover,
body[data-theme="obsidian"] .frame,body[data-theme="obsidian"] .frame:hover,
body[data-theme="obsidian"] .step,body[data-theme="obsidian"] .step:hover,
body[data-theme="obsidian"] .jrny-card,body[data-theme="obsidian"] .jrny-card:hover,
body[data-theme="obsidian"] .rev-card,body[data-theme="obsidian"] .rev-card:hover,
body[data-theme="obsidian"] .pkgd-card,body[data-theme="obsidian"] .pkgd-card:hover,
body[data-theme="obsidian"] .notsure,body[data-theme="obsidian"] .notsure:hover,
body[data-theme="obsidian"] .real-card,body[data-theme="obsidian"] .real-card:hover,
body[data-theme="obsidian"] .why-card,body[data-theme="obsidian"] .why-card:hover,
body[data-theme="obsidian"] .path-card,body[data-theme="obsidian"] .path-card:hover,
body[data-theme="obsidian"] .tab-panel,body[data-theme="obsidian"] .tab-panel:hover,
body[data-theme="obsidian"] .audit-form,
body[data-theme="obsidian"] .audit-thanks,
body[data-theme="obsidian"] .csm-stats,
body[data-theme="obsidian"] .fdr-slide,
body[data-theme="obsidian"] .polaroid,
body[data-theme="obsidian"] .screen,
body[data-theme="obsidian"] .dev,
body[data-theme="obsidian"] .ba-col img,
body[data-theme="obsidian"] .sysc-shot img,
body[data-theme="obsidian"] .section-img{box-shadow:none !important}
/* most-popular package keeps its ring, minus the blur */
body[data-theme="obsidian"] #packages .pkgd-card.is-pop{box-shadow:0 0 0 2px var(--accent) !important}
body[data-theme="obsidian"] #reviews .rev-card,
body[data-theme="obsidian"] #reviews .rev-card:hover{box-shadow:none !important}
body[data-theme="obsidian"] .real-card .ic,
body[data-theme="obsidian"] .pkgd-ic,
body[data-theme="obsidian"] .pkv-pop{box-shadow:none !important}
body[data-theme="obsidian"] #why .real-card .ic{box-shadow:none !important}

/* ---- hero: gold accents recoloured to the site bright pink (#FF9EBB).
   The 5-star review rating deliberately stays gold. ---- */
body[data-theme="obsidian"] .hero{--hero-pink:#FF9EBB;--hero-pink-ink:#FF83A8}
body[data-theme="obsidian"] .hero .hero-eyebrow{color:var(--hero-pink) !important}
body[data-theme="obsidian"] .hero .hero-eyebrow::before{background:var(--hero-pink) !important}
body[data-theme="obsidian"] .hero .hero-trust svg{color:var(--hero-pink) !important}
body[data-theme="obsidian"] .hero .hero-quote{border-left-color:var(--hero-pink) !important}
body[data-theme="obsidian"] .hero .btn-primary,
body[data-theme="obsidian"] .hero .hero-form .hero-form-btn{
  background:var(--hero-pink) !important;border-color:var(--hero-pink) !important;color:#fff !important;
}
body[data-theme="obsidian"] .hero .btn-primary:hover,
body[data-theme="obsidian"] .hero .hero-form .hero-form-btn:hover{
  background:var(--hero-pink-ink) !important;border-color:var(--hero-pink-ink) !important;color:#fff !important;
}
body[data-theme="obsidian"] .hero .hero-form .hero-field:focus{
  border-color:var(--hero-pink) !important;box-shadow:0 0 0 3px rgba(255,158,187,.38) !important;
}
/* stars keep the gold */
body[data-theme="obsidian"] .hero .hero-quote .hq-stars{color:var(--accent) !important}

/* 2026-09-19: bigger hero submit (full row, full width on mobile); package CTA now sits under prices */
body[data-theme="obsidian"] .hero .hero-form .hero-form-btn{height:40px !important;width:100%;justify-self:stretch;padding:0 18px !important;font-size:13px !important}
@media(max-width:560px){
  body[data-theme="obsidian"] .hero .hero-form .hero-form-btn{height:48px !important;font-size:14px !important}
}
body[data-theme="obsidian"] #packages .pkv-body .pkv-cta{margin-top:6px;margin-bottom:4px}
@media(min-width:561px){
  body[data-theme="obsidian"] .hero .hero-form .hero-field::placeholder{font-size:.8rem}
  body[data-theme="obsidian"] .hero .hero-form .hero-field{padding:0 10px !important}
}

/* ============================================================
   2026-09-19 re-applied from the 18 Sep review (selected items only)
   ============================================================ */
button,input,select,textarea{font-family:inherit}

/* consistent gap under section heads (#why keeps its tight intro gap) */
body[data-theme="obsidian"] section:not(#why) .head{margin-bottom:clamp(24px,3vw,40px)}
body[data-theme="obsidian"] .section-img{margin-bottom:clamp(24px,3vw,40px)}

/* one cream for the plain bands (was four near-identical creams) */
body[data-theme="obsidian"] .nav,
body[data-theme="obsidian"] #packages,
body[data-theme="obsidian"] #reviews,
body[data-theme="obsidian"] #products,
body[data-theme="obsidian"] #caseStudy,
body[data-theme="obsidian"] #about,
body[data-theme="obsidian"] #contact,
body[data-theme="obsidian"] .foot{background:#FBF8F2 !important}

/* packages: small pink text + prices -> deeper pink for contrast; prices fit their tiles on phones */
body[data-theme="obsidian"] #packages .pkgd-card .pkgd-toggle,
body[data-theme="obsidian"] #packages .pkgd-incl li,
body[data-theme="obsidian"] #packages .pkgd-inclh,
body[data-theme="obsidian"] #packages .pkgd-prow .lbl,
body[data-theme="obsidian"] #packages .pkv-amt i{color:#BD3F63 !important}
body[data-theme="obsidian"] #packages .pkv-amt b{color:#BD3F63}
@media(max-width:480px){
  body[data-theme="obsidian"] #packages .pkv-tile{padding:16px 14px;gap:12px}
  body[data-theme="obsidian"] #packages .pkv-tic{flex:0 0 42px;width:42px;height:42px}
  body[data-theme="obsidian"] #packages .pkv-tic svg{width:22px;height:22px}
  body[data-theme="obsidian"] #packages .pkv-amt b{font-size:1.4rem}
  body[data-theme="obsidian"] #packages .pkv-amt i{display:block;margin:0 0 4px}
}

/* case study: stats stack icon over number so +312% clears its icon */
@media(min-width:761px){
  body[data-theme="obsidian"] .csm-stats .cs-top{flex-direction:column;gap:6px}
}

/* carousels: first card lines up with the 1080px content edge on desktop */
@media(min-width:1100px){
  body[data-theme="obsidian"] .how-track{
    padding-left:calc((100vw - 1080px) / 2 + 24px);padding-right:calc((100vw - 1080px) / 2 + 24px);
    scroll-padding-inline:calc((100vw - 1080px) / 2 + 24px)}
  body[data-theme="obsidian"] .tab-slide{flex-basis:1032px;scroll-snap-align:start}
}

/* carousel dots: bigger tap areas, same visible dot */
body[data-theme="obsidian"] .fdr-dots{gap:0}
body[data-theme="obsidian"] .fdr-dot{position:relative;width:24px;height:24px;background:transparent !important}
body[data-theme="obsidian"] .fdr-dot::before{content:"";position:absolute;inset:8px;border-radius:50%;background:rgba(10,10,11,.22)}
body[data-theme="obsidian"] .fdr-dot.on::before{background:var(--accent)}
body[data-theme="obsidian"] .how-dots{gap:0;padding:0 4px}
body[data-theme="obsidian"] .how-dots i{position:relative;width:22px;height:22px;background:transparent !important;cursor:pointer;transform:none}
body[data-theme="obsidian"] .how-dots i::before{content:"";position:absolute;inset:7.5px;border-radius:50%;background:rgba(10,10,11,.22);transition:background .2s,transform .2s}
body[data-theme="obsidian"] .how-dots i.on::before{background:#3B2A21;transform:scale(1.2)}

/* footer links stay on one row on desktop */
@media(min-width:901px){ body[data-theme="obsidian"] .foot-links:not(.foot-links-legal){gap:14px 22px;max-width:900px;margin-inline:auto} }

/* founder carousel CTA: label on one line with breathing room at every width */
body[data-theme="obsidian"] .fdr-car .s5-cta{padding:0 22px;white-space:nowrap;letter-spacing:.08em;gap:10px}
@media(max-width:560px){
  body[data-theme="obsidian"] .fdr-car .s5-cta{padding:0 14px;font-size:clamp(9px,2.9vw,12px);letter-spacing:.04em;gap:6px}
  body[data-theme="obsidian"] .fdr-car .s5-cta svg{width:14px;height:14px;flex:0 0 14px}
}

/* case study, compact: copy + cropped before/after phones + CTA in about one screen */
body[data-theme="obsidian"] .csm2 .wrap{max-width:1080px}
.csm2-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-areas:"copy ba" "cta ba";column-gap:clamp(32px,5vw,64px);align-items:center}
.csm2-copy{grid-area:copy;align-self:end}
.csm2-ba{grid-area:ba;display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.csm2-cta-wrap{grid-area:cta;align-self:start;margin-top:26px}
.csm2-eyebrow{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#BD3F63}
body[data-theme="obsidian"] .csm2-title{margin:12px 0 16px;font-family:var(--font-display);font-weight:900;font-size:clamp(28px,3.1vw,42px);line-height:1.05;letter-spacing:-.025em;color:#3B2A21}
.csm2-lead{margin:0;font-size:1rem;line-height:1.6;color:var(--text-2);max-width:44ch}
.csm2-col{margin:0;display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.csm2-cap{margin:10px 0 14px;min-height:2.8em;font-weight:700;font-size:.9rem;line-height:1.4;color:#3B2A21;max-width:22ch}
.csm2-shot{position:relative;width:100%;aspect-ratio:9/14;overflow:hidden;border-radius:18px;border:1px solid #EADFD2;background:#fff}
.csm2-shot img{display:block;width:100%;height:auto}
.csm2-shot::after{content:"";position:absolute;left:0;right:0;bottom:0;height:22%;background:linear-gradient(to bottom,rgba(251,248,242,0),#FBF8F2)}
.csm2-cta{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 30px;border-radius:60px;background:#BD3F63;color:#fff;font-weight:800;font-size:14px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;transition:background .18s,transform .18s}
.csm2-cta:hover{background:#A33453;color:#fff;transform:translateY(-2px)}
@media(max-width:760px){
  .csm2-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "ba" "cta";row-gap:22px}
  .csm2-copy{text-align:center}
  .csm2-lead{margin:0 auto;font-size:.95rem}
  .csm2-ba{gap:12px}
  .csm2-cap{font-size:.74rem;margin:8px 0 10px}
  .csm2-shot{border-radius:12px}
  .csm2-cta-wrap{margin-top:0;text-align:center}
  .csm2 .ba-pill{padding:6px 15px;font-size:.6rem;letter-spacing:.1em}
}
/* case study stats back in, under the story (overrides the old docked-under-phone position) */
body[data-theme="obsidian"] .csm2-eyebrow{margin-bottom:14px}
body[data-theme="obsidian"] .csm2 .csm-stats{position:static;width:auto;margin:26px 0 0;padding:20px 8px;border-radius:18px;background:#fff;border:1px solid #EADFD2}
body[data-theme="obsidian"] .csm2 .csm-stats li{padding:0 10px;gap:8px}
body[data-theme="obsidian"] .csm2 .csm-stats .cs-top{flex-direction:column;gap:8px}
body[data-theme="obsidian"] .csm2 .csm-stats .cs-ic{width:42px;height:42px;flex:0 0 42px}
body[data-theme="obsidian"] .csm2 .csm-stats .cs-ic svg{width:21px;height:21px}
body[data-theme="obsidian"] .csm2 .csm-stats .cs-num{font-size:clamp(1.4rem,2.4vw,1.9rem)}
body[data-theme="obsidian"] .csm2 .csm-stats small{font-size:.8rem;line-height:1.3}
@media(max-width:760px){
  body[data-theme="obsidian"] .csm2 .csm-stats{margin-top:20px;padding:16px 4px}
  body[data-theme="obsidian"] .csm2 .csm-stats li{padding:0 6px}
  body[data-theme="obsidian"] .csm2 .csm-stats small{font-size:.74rem}
}

/* case study replaced by one link to /work */
body[data-theme="obsidian"] .csm-link{background:#FBF8F2 !important;border-bottom:1px solid var(--border)}
body[data-theme="obsidian"] .csm-link .wrap{display:flex;flex-direction:column;align-items:center;gap:14px}
/* ---- the shop: bordered product cards with a coloured offset block ---- */
body[data-theme="obsidian"] #products .prod{border:2px solid var(--text) !important;box-shadow:5px 6px 0 var(--pop) !important}
body[data-theme="obsidian"] #products .prod:hover{transform:translate(-3px,-4px) !important;box-shadow:9px 12px 0 var(--pop) !important}
body[data-theme="obsidian"] #products .prod-media{border:0 !important;border-bottom:2px solid var(--text) !important;border-radius:13px 13px 0 0 !important}
body[data-theme="obsidian"] #products .prod-flag{border-color:var(--text) !important}
body[data-theme="obsidian"] #products .prod-flag.rose{background:#BD3F63 !important;color:#fff !important}
body[data-theme="obsidian"] #products .prod-kind{background:#FBE7ED !important;color:#B06A84 !important}
body[data-theme="obsidian"] #products .prod.p2 .prod-kind{background:#E9EFE1 !important;color:#4F6339 !important}
body[data-theme="obsidian"] #products .prod.p3 .prod-kind{background:#FBF0DE !important;color:var(--accent-ink) !important}
body[data-theme="obsidian"] #products .prod-name{color:var(--text) !important}
body[data-theme="obsidian"] #products .prod-buy{border-color:var(--text) !important;background:var(--pop) !important;color:#fff !important}
body[data-theme="obsidian"] #products .prod-buy:hover{background:var(--pop-ink) !important}
body[data-theme="obsidian"] #products .prod-quote .stars{color:var(--accent) !important}

/* ---- how it works: the numbered process keeps its own colours, not the
   blanket green that #system headings and body copy use ---- */
body[data-theme="obsidian"] #system .hiw-name{color:var(--text) !important}
body[data-theme="obsidian"] #system .hiw-lede{color:var(--pop-ink) !important}
body[data-theme="obsidian"] #system .hiw-when{color:var(--pop-ink) !important}
body[data-theme="obsidian"] #system .hiw-num{color:#fff !important}
body[data-theme="obsidian"] #system .hiw-split b{color:var(--pop-ink) !important}
body[data-theme="obsidian"] #system .hiw-split p{color:#000 !important}
body[data-theme="obsidian"] #system .hiw-card{border-color:var(--text) !important}

/* ---- work teaser: sits on the same cream as the services above it, so a
   hairline separates them; gold heading to alternate with the pink above. ---- */
body[data-theme="obsidian"] #work-teaser{background:#FBF8F2 !important;border-top:1px solid var(--border)}
body[data-theme="obsidian"] #work-teaser .head h2{color:#FF9EBB !important}
body[data-theme="obsidian"] #work-teaser .head p{color:#4A302D !important}

/* the brand-board photo sits flush on the divider above it */
body[data-theme="obsidian"] #packages{padding-top:0 !important}

/* the how-it-works photo sits flush on the divider below it */
body[data-theme="obsidian"] #system{padding-bottom:0 !important}
