/* =====================================================================
   SoundHeart design system
   Brand: SoundHeart hunter green, warm ivory, and gold. Spectral for
   headlines, Mulish for reading. The heartbeat line and the SH heart
   monogram are the two signature marks. Warm rounded cards, gold buttons.
   ===================================================================== */

@font-face { font-family: "Spectral"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/spectral-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Spectral"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("../fonts/spectral-latin-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Spectral"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("../fonts/spectral-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Spectral"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/spectral-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Mulish"; font-style: normal; font-weight: 300 800; font-display: swap;
  src: url("../fonts/mulish-latin-wght-normal.woff2") format("woff2"); }
@font-face { font-family: "Amiri"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/amiri-arabic-400-normal.woff2") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E; }
@font-face { font-family: "Amiri"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("../fonts/amiri-arabic-700-normal.woff2") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E; }
@font-face { font-family: "IBM Plex Sans Arabic"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/ibm-plex-sans-arabic-arabic-400-normal.woff2") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E; }
@font-face { font-family: "IBM Plex Sans Arabic"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200E; }

:root {
  /* Brand */
  --brand-green: #1F3D2E;
  --brand-green-deep: #15301F;
  --brand-green-light: #2E5A44;
  --brand-gold: #B8964F;
  --brand-gold-bright: #C9A961;
  /* Color roles */
  --bg: #FAF6EE;
  --bg-alt: #F3ECDD;
  --surface: #FFFDF8;
  --line: #E4DAC6;
  --line-strong: #CDBF9F;
  --ink: #1F3D2E;
  --body: #33383F;
  --muted: #535d58;
  --forest: #1F3D2E;
  --forest-deep: #15301F;
  --on-forest: #FAF6EE;
  --on-forest-muted: #CBD6CC;
  --gold: #B8964F;
  --gold-text: #7A5E24;
  --gold-on-forest: #C9A961;
  --btn-bg: #B8964F;
  --btn-fg: #15301F;
  --btn-hover: #C9A961;
  --header-bg: rgba(250, 246, 238, .95);
  --danger: #9b3b2c;
  --shadow: 0 1px 2px rgba(21, 48, 31, .05), 0 18px 40px -28px rgba(21, 48, 31, .35);
  --shadow-hover: 0 2px 4px rgba(21, 48, 31, .06), 0 26px 50px -26px rgba(21, 48, 31, .45);
  /* Art (always a dusk palette so the hero reads the same in both themes) */
  --art-sky-1: #15301F;
  --art-sky-2: #2E5A44;
  --art-sky-3: #B8964F;
  --art-sun: #E2C27E;
  --art-far: #3c6250;
  --art-mid: #26473A;
  --art-near: #132a1c;
  --art-water: #335a49;
  --art-snow: #F1E8D4;
  --art-aurora: #8fbfa5;
  /* Type */
  --font-display: "Spectral", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --font-body: "Mulish", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --step--1: .8125rem;
  --step-0: 1.0625rem;
  --step-1: 1.25rem;
  --step-2: 1.5rem;
  --step-3: clamp(1.75rem, 1.2rem + 1.6vw, 2.25rem);
  --step-4: clamp(2.1rem, 1.3rem + 2.6vw, 3.1rem);
  --step-5: clamp(2.5rem, 1.4rem + 4vw, 4.6rem);
  /* Space */
  --s2: .5rem; --s3: .75rem; --s4: 1rem; --s5: 1.5rem; --s6: 2rem; --s7: 3rem; --s8: 4rem; --s9: 6rem;
  --section: clamp(4rem, 2.5rem + 5vw, 7rem);
  --gutter: clamp(1rem, .5rem + 2.5vw, 2.5rem);
  --measure: 66ch;
  --max: 1200px;
  --radius: 14px;
  --radius-sm: 8px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0f1d15; --bg-alt: #13261b; --surface: #182d21; --line: #2a4033; --line-strong: #3b5546;
    --ink: #F3ECDD; --body: #d3d8d2; --muted: #a8b4ac;
    --forest: #1a3527; --forest-deep: #0b1710; --on-forest: #FAF6EE; --on-forest-muted: #CBD6CC;
    --gold: #C9A961; --gold-text: #D9BE80; --gold-on-forest: #D9BE80;
    --btn-bg: #C9A961; --btn-fg: #15301F; --btn-hover: #DCC283;
    --header-bg: rgba(15, 29, 21, .93); --danger: #f0a090;
    --shadow: 0 18px 40px -28px rgba(0, 0, 0, .7); --shadow-hover: 0 26px 50px -26px rgba(0, 0, 0, .8);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0f1d15; --bg-alt: #13261b; --surface: #182d21; --line: #2a4033; --line-strong: #3b5546;
  --ink: #F3ECDD; --body: #d3d8d2; --muted: #a8b4ac;
  --forest: #1a3527; --forest-deep: #0b1710; --on-forest: #FAF6EE; --on-forest-muted: #CBD6CC;
  --gold: #C9A961; --gold-text: #D9BE80; --gold-on-forest: #D9BE80;
  --btn-bg: #C9A961; --btn-fg: #15301F; --btn-hover: #DCC283;
  --header-bg: rgba(15, 29, 21, .93); --danger: #f0a090;
  --shadow: 0 18px 40px -28px rgba(0, 0, 0, .7); --shadow-hover: 0 26px 50px -26px rgba(0, 0, 0, .8);
  color-scheme: dark;
}

:lang(ar) {
  --font-display: "Amiri", "Noto Naskh Arabic", "Times New Roman", serif;
  --font-body: "IBM Plex Sans Arabic", "Mulish", "Segoe UI", Tahoma, sans-serif;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 96px; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font: 400 var(--step-0)/1.7 var(--font-body);
  text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased;
}
:lang(ar) body, body:lang(ar) { line-height: 1.9; }
img, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-underline-offset: .2em; text-decoration-thickness: 1px; }
:focus-visible { outline: 2px solid var(--gold-text); outline-offset: 3px; border-radius: 3px; }
::selection { background: var(--gold); color: #fff; }
h1, h2, h3, h4 { margin: 0; color: var(--ink); font-family: var(--font-display); font-weight: 500; text-wrap: balance; }
h1 { font-size: var(--step-5); line-height: 1.06; letter-spacing: -.015em; }
h2 { font-size: var(--step-4); line-height: 1.12; letter-spacing: -.01em; }
h3 { font-size: var(--step-2); line-height: 1.25; }
h1 em, h2 em { font-style: italic; color: var(--gold-text); }
:lang(ar) h1, :lang(ar) h2, :lang(ar) h3 { letter-spacing: 0; font-weight: 700; line-height: 1.35; }
p { margin: 0 0 1em; }
.skip-link { position: absolute; inset-inline-start: -9999px; top: 0; }
.skip-link:focus { inset-inline-start: 12px; top: 12px; z-index: 1000; padding: 10px 14px; background: var(--surface); color: var(--ink); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.container {
  max-width: calc(var(--max) + 2 * var(--gutter)); margin-inline: auto;
  padding-left: max(var(--gutter), env(safe-area-inset-left, 0px));
  padding-right: max(var(--gutter), env(safe-area-inset-right, 0px));
}
.narrow { max-width: calc(760px + 2 * var(--gutter)); }
.section { padding-block: var(--section); }
.section.tight { padding-block: calc(var(--section) * .6); }
.band-alt { background: var(--bg-alt); }
.band-forest { background: var(--forest); color: var(--on-forest); }
.band-forest h1, .band-forest h2, .band-forest h3 { color: var(--on-forest); }
.band-forest .eyebrow { color: var(--gold-on-forest); }
.band-forest p, .band-forest li { color: var(--on-forest-muted); }
.rule { border: 0; border-top: 1px solid var(--line); margin: 0; }

/* ---------- Type utilities ---------- */
.eyebrow {
  display: flex; align-items: center; gap: .75rem; margin: 0 0 var(--s5);
  color: var(--gold-text); font: 600 var(--step--1)/1.2 var(--font-body); letter-spacing: .16em; text-transform: uppercase;
}
.eyebrow::before { content: ""; width: 28px; height: 1px; background: currentColor; flex: none; }
:lang(ar) .eyebrow { letter-spacing: 0; text-transform: none; font-size: .95rem; }
.lede { max-width: 60ch; color: var(--body); font-size: var(--step-1); line-height: 1.6; }
.muted { color: var(--muted); }
.small { font-size: var(--step--1); }
.measure { max-width: var(--measure); }
.kicker-num { font: 400 var(--step-1) var(--font-display); color: var(--gold-text); font-variant-numeric: tabular-nums; }

/* ---------- Buttons and links ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 50px;
  padding: .85rem 1.6rem; border: 1.5px solid transparent; border-radius: 999px;
  font: 700 .95rem/1.2 var(--font-body); letter-spacing: .01em; text-decoration: none; cursor: pointer;
  transition: background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease), box-shadow .2s var(--ease);
}
.btn:hover { transform: translateY(-1px); }
.btn-primary, .btn-light { background: var(--btn-bg); color: var(--btn-fg); box-shadow: 0 10px 24px -14px rgba(184, 150, 79, .9); }
.btn-primary:hover, .btn-light:hover { background: var(--btn-hover); }
.btn-secondary { border-color: var(--ink); color: var(--ink); background: transparent; }
.btn-secondary:hover { background: var(--ink); color: var(--bg); }
.btn-outline-light { border-color: rgba(250, 246, 238, .7); color: var(--on-forest); }
.btn-outline-light:hover { background: var(--on-forest); color: var(--brand-green-deep); border-color: var(--on-forest); }
.actions { display: flex; flex-wrap: wrap; gap: var(--s3); align-items: center; }
.link-arrow { display: inline-flex; align-items: center; gap: .45rem; font-weight: 600; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.link-arrow::after { content: "→"; transition: transform .2s var(--ease); }
:dir(rtl) .link-arrow::after, [dir="rtl"] .link-arrow::after { content: "←"; }
.link-arrow:hover::after { transform: translateX(3px); }
[dir="rtl"] .link-arrow:hover::after { transform: translateX(-3px); }

/* ---------- Header ---------- */
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 60; background: var(--bg); }
.site-header { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50; background: var(--header-bg); backdrop-filter: saturate(1.2) blur(14px); border-bottom: 1px solid var(--line); }
.nav { display: flex; align-items: center; gap: var(--s5); min-height: 80px; }
.brand { display: inline-flex; align-items: center; gap: .7rem; text-decoration: none; line-height: 1; margin-inline-end: auto; }
.brand-mark { width: 42px; height: auto; flex: none; }
.brand-text { display: inline-flex; flex-direction: column; }
.brand-name { font: 600 1.45rem var(--font-display); letter-spacing: -.005em; color: var(--ink); }
.brand-name sup { font: 500 .55rem var(--font-body); vertical-align: top; margin-inline-start: 1px; }
.brand-sub { margin-top: 5px; color: var(--gold-text); font-size: .66rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
:lang(ar) .brand-sub { letter-spacing: 0; text-transform: none; font-size: .78rem; }
.nav-menu { display: flex; align-items: center; gap: var(--s5); }
.nav-links { display: flex; gap: 1.5rem; margin: 0; padding: 0; list-style: none; font-size: .93rem; font-weight: 600; color: var(--ink); }
.nav-links a { text-decoration: none; padding-block: .5rem; border-bottom: 2px solid transparent; }
.nav-links a:hover, .nav-links a[aria-current="page"] { border-bottom-color: var(--gold); }
.nav-tools { display: flex; align-items: center; gap: var(--s4); }
.lang-switch { font-size: .9rem; font-weight: 600; text-decoration: none; padding: .4rem .2rem; }
.lang-switch:hover { text-decoration: underline; }
.menu-toggle { display: none; align-items: center; gap: .5rem; min-height: 44px; padding: 0 .9rem; border: 1px solid var(--line-strong); border-radius: 999px; background: transparent; color: var(--ink); font: 600 .9rem var(--font-body); cursor: pointer; }
.menu-toggle .bars { width: 16px; height: 10px; border-block: 1.5px solid currentColor; position: relative; }

@media (max-width: 1020px) {
  .menu-toggle { display: inline-flex; }
  .nav-menu { position: absolute; inset: 100% 0 auto; display: none; flex-direction: column; align-items: stretch; gap: 0;
    padding: var(--s4) max(var(--gutter), env(safe-area-inset-right, 0px)) var(--s6) max(var(--gutter), env(safe-area-inset-left, 0px));
    background: var(--bg); border-bottom: 1px solid var(--line); max-height: calc(100vh - 76px); overflow-y: auto; }
  .nav-menu.open { display: flex; }
  .nav-links { flex-direction: column; gap: 0; font-size: 1.15rem; }
  .nav-links a { display: block; padding-block: .9rem; border-bottom: 1px solid var(--line); }
  .nav-tools { flex-direction: column; align-items: stretch; padding-top: var(--s5); }
  .nav-tools .btn { width: 100%; }
}

/* ---------- Home hero ---------- */
.hero { position: relative; isolation: isolate; overflow: hidden; color: var(--on-forest);
  background: radial-gradient(120% 90% at 85% 10%, rgba(201, 169, 97, .16) 0%, transparent 55%),
              linear-gradient(160deg, var(--brand-green-deep) 0%, var(--brand-green) 55%, #24493a 100%); }
.hero-inner { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: center;
  padding-block: clamp(4rem, 2.5rem + 6vw, 7.5rem) clamp(4rem, 2.5rem + 5vw, 6.5rem); }
.hero h1 { color: #fff; max-width: 13ch; font-weight: 500; }
.hero .hero-sub { margin: var(--s5) 0 var(--s4); max-width: 30ch; font: italic 400 var(--step-2)/1.35 var(--font-display); color: var(--gold-on-forest); }
.hero .hero-copy { max-width: 48ch; color: var(--on-forest-muted); font-size: var(--step-1); }
.hero .actions { margin-top: var(--s6); }
.hero .eyebrow { color: var(--gold-on-forest); }
.hero-meta { margin: var(--s6) 0 0; display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; color: var(--on-forest-muted); font-size: .9rem; padding: 0; list-style: none; }
.hero-meta li { display: flex; align-items: center; gap: .5rem; }
.hero-meta li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gold-on-forest); }
.hero-emblem { position: relative; display: grid; place-items: center; }
.hero-emblem::before { content: ""; position: absolute; inset: 6%; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(201, 169, 97, .22), rgba(201, 169, 97, 0)); }
.hero-emblem img { position: relative; width: min(100%, 380px); filter: drop-shadow(0 24px 40px rgba(0, 0, 0, .35)); }
.hero-pulse { grid-column: 1 / -1; max-width: 640px; margin-top: var(--s4); }
@media (max-width: 860px) {
  .hero-inner { grid-template-columns: 1fr; }
  .hero-emblem { order: -1; justify-items: start; }
  .hero-emblem::before { display: none; }
  .hero-emblem img { width: 96px; filter: none; }
}

/* Heartbeat line, the signature motif */
.pulse { display: block; width: 100%; max-width: 560px; height: auto; overflow: visible; }
.pulse path { fill: none; stroke: var(--gold); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.band-forest .pulse path, .hero .pulse path { stroke: var(--gold-on-forest); }
.pulse.wide { max-width: none; }
.pulse.center { margin-inline: auto; }
@media (prefers-reduced-motion: no-preference) {
  .pulse.draw path { stroke-dasharray: 1200; stroke-dashoffset: 1200; animation: pulse-draw 2.6s .3s var(--ease) forwards; }
}
@keyframes pulse-draw { to { stroke-dashoffset: 0; } }
[dir="rtl"] .pulse { transform: scaleX(-1); }

/* SVG art fills */
.a-sky-1 { stop-color: var(--art-sky-1); } .a-sky-2 { stop-color: var(--art-sky-2); } .a-sky-3 { stop-color: var(--art-sky-3); }
.a-sun { fill: var(--art-sun); } .a-far { fill: var(--art-far); } .a-mid { fill: var(--art-mid); } .a-near { fill: var(--art-near); }
.a-water { fill: var(--art-water); } .a-snow { fill: var(--art-snow); } .a-glint { stroke: var(--art-snow); }
.a-aurora { stroke: var(--art-aurora); fill: none; }
.a-window { fill: var(--art-sun); }

/* ---------- Interior page hero ---------- */
.page-hero { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem) clamp(2.5rem, 1.5rem + 3vw, 4rem); border-bottom: 1px solid var(--line); }
.page-hero h1 { font-size: var(--step-5); max-width: 18ch; }
.page-hero .lede { margin-top: var(--s5); }
.page-hero .actions { margin-top: var(--s6); }
.breadcrumb ol { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 var(--s6); padding: 0; list-style: none; color: var(--muted); font-size: .85rem; }
.breadcrumb li + li::before { content: "/"; margin-inline-end: .4rem; color: var(--line-strong); }
.breadcrumb a { text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }

/* ---------- Layout patterns ---------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 1rem + 5vw, 6rem); align-items: start; }
.split > * { min-width: 0; }
.split.center { align-items: center; }
.split-7-5 { grid-template-columns: 7fr 5fr; }
.split-5-7 { grid-template-columns: 5fr 7fr; }
.section-head { max-width: 760px; margin-bottom: var(--s8); }
.section-head .lede { margin-top: var(--s5); }
.section-head-row { display: flex; justify-content: space-between; align-items: end; gap: var(--s6); flex-wrap: wrap; margin-bottom: var(--s7); }
.section-head-row > div { max-width: 720px; }
@media (max-width: 860px) { .split, .split-7-5, .split-5-7 { grid-template-columns: 1fr; } }

/* Offer grid (services): warm rounded cards */
.offers { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--s5); }
.offer { display: flex; flex-direction: column; gap: var(--s4); padding: var(--s6) var(--s5); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); transition: transform .2s var(--ease), box-shadow .2s var(--ease); }
.offer:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); }
.offer h3 { font-size: var(--step-2); }
.offer p { color: var(--body); margin: 0; }
.offer .link-arrow { margin-top: auto; align-self: flex-start; }
.band-forest .offer { background: rgba(255, 255, 255, .04); border-color: rgba(250, 246, 238, .16); box-shadow: none; }

/* Service type tag: text label, never color alone */
.tag { display: inline-flex; align-items: center; gap: .45rem; align-self: flex-start; padding: .28rem .7rem; border: 1px solid var(--line-strong); border-radius: 999px; color: var(--body); font-size: .74rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.tag::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); }
.tag.clinical::before { background: var(--ink); }
.tag.coaching::before { background: transparent; border: 1.5px solid var(--gold); }
.tag.education::before { border-radius: 1px; }
:lang(ar) .tag { letter-spacing: 0; text-transform: none; font-size: .82rem; }
.band-forest .tag { border-color: rgba(255,255,255,.3); color: var(--on-forest); }

/* Principles / numbered steps (only for real sequences) */
.steps { counter-reset: step; margin: 0; padding: 0; list-style: none; display: grid; gap: 0; }
.steps > li { counter-increment: step; display: grid; grid-template-columns: 64px 1fr; gap: var(--s4); padding: var(--s5) 0; border-top: 1px solid var(--line); }
.steps > li:last-child { border-bottom: 1px solid var(--line); }
.steps > li::before { content: counter(step, decimal-leading-zero); font: 400 var(--step-1) var(--font-display); color: var(--gold-text); font-variant-numeric: tabular-nums; }
.steps h3 { font-size: var(--step-1); font-family: var(--font-body); font-weight: 600; margin-bottom: .3rem; }
.steps p { margin: 0; color: var(--body); }
.band-forest .steps > li { border-color: rgba(255,255,255,.18); }
.band-forest .steps > li::before { color: var(--gold-on-forest); }
.band-forest .steps h3 { color: var(--on-forest); }

.principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s6); margin: 0; padding: 0; list-style: none; }
.principles li { padding-top: var(--s5); border-top: 1px solid var(--line-strong); }
.principles h3 { font-size: var(--step-2); margin-bottom: var(--s3); }
.principles p { margin: 0; color: var(--body); }
.band-forest .principles li { border-color: rgba(255,255,255,.25); }
@media (max-width: 860px) { .principles { grid-template-columns: 1fr; } }

/* Art frames */
.art-frame { position: relative; aspect-ratio: 4 / 5; max-width: 100%; overflow: hidden; border-radius: 2px; background: var(--art-sky-1); }
.art-frame svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.art-frame.wide { aspect-ratio: 16 / 10; }
.art-caption { margin-top: var(--s3); color: var(--muted); font-size: .85rem; }

/* Quote */
.quote { margin: 0; }
.quote p { font: 400 var(--step-4)/1.15 var(--font-display); letter-spacing: -.02em; color: var(--ink); max-width: 24ch; margin: 0; }
.band-forest .quote p { color: var(--on-forest); }
.quote footer { margin-top: var(--s5); color: var(--gold-text); font-weight: 600; font-size: .9rem; letter-spacing: .08em; text-transform: uppercase; }
.band-forest .quote footer { color: var(--gold-on-forest); }
:lang(ar) .quote footer { letter-spacing: 0; text-transform: none; }

/* Articles list */
.article-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s5); margin: 0; padding: 0; list-style: none; }
.article-card { display: flex; flex-direction: column; gap: var(--s3); padding: var(--s5); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); transition: transform .2s var(--ease), box-shadow .2s var(--ease); }
.article-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); }
.article-card .article-meta { margin-top: auto; }
.article-card h3 { font-size: var(--step-2); }
.article-card h3 a { text-decoration: none; }
.article-card h3 a:hover { text-decoration: underline; }
.article-card p { margin: 0; color: var(--body); }
.article-meta { color: var(--muted); font-size: .85rem; }
@media (max-width: 900px) { .article-list { grid-template-columns: 1fr; } }
.filters { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: var(--s6); }
.filter { min-height: 40px; padding: .4rem 1rem; border: 1px solid var(--line-strong); border-radius: 999px; background: transparent; color: var(--ink); font: 600 .88rem var(--font-body); cursor: pointer; }
.filter[aria-pressed="true"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }

/* Prose */
.prose { max-width: var(--measure); color: var(--body); }
.prose h2 { font-size: var(--step-3); margin: 2.2em 0 .6em; }
.prose h3 { font-size: var(--step-1); font-family: var(--font-body); font-weight: 600; margin: 1.8em 0 .4em; }
.prose p, .prose li { font-size: var(--step-0); }
.prose ul, .prose ol { padding-inline-start: 1.3em; margin: 0 0 1.2em; }
.prose li { margin-bottom: .45em; }
.prose a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--gold); }
.prose strong { color: var(--ink); }
.prose blockquote { margin: 1.6em 0; padding-inline-start: 1.2em; border-inline-start: 2px solid var(--gold); font: 400 var(--step-1)/1.5 var(--font-display); color: var(--ink); }
.prose .direct-answer { padding: var(--s5); background: var(--bg-alt); border-inline-start: 3px solid var(--gold); border-radius: var(--radius-sm); color: var(--ink); }
.byline { display: flex; flex-wrap: wrap; gap: .3rem 1.2rem; margin-top: var(--s5); color: var(--muted); font-size: .9rem; }
.refs { font-size: .9rem; }
.refs li { margin-bottom: .6em; overflow-wrap: anywhere; }

/* Notice and callouts */
.callout { padding: var(--s5) var(--s6); border: 1px solid var(--line); border-inline-start: 4px solid var(--gold); border-radius: var(--radius-sm); background: var(--surface); }
.callout p:last-child { margin: 0; }
.callout.crisis { border-inline-start-color: var(--danger); }
.label-evidence { display: inline-block; margin-bottom: var(--s3); font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
:lang(ar) .label-evidence { letter-spacing: 0; text-transform: none; }
.compare-cols { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s5); }
.compare-cols > div { padding: var(--s5); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
@media (max-width: 760px) { .compare-cols { grid-template-columns: 1fr; } }

/* Tables */
.table-wrap { overflow-x: auto; border-top: 1px solid var(--line-strong); }
table { width: 100%; border-collapse: collapse; min-width: 640px; font-size: .95rem; }
th, td { padding: .9rem .8rem; text-align: start; vertical-align: top; border-bottom: 1px solid var(--line); }
th { font-weight: 600; color: var(--ink); }
thead th { font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
td { color: var(--body); }
:lang(ar) thead th { letter-spacing: 0; text-transform: none; font-size: .9rem; }

/* Definition list (glossary, facts) */
.facts { display: grid; grid-template-columns: minmax(140px, 220px) 1fr; margin: 0; border-top: 1px solid var(--line-strong); }
.facts dt, .facts dd { padding: var(--s4) 0; border-bottom: 1px solid var(--line); margin: 0; }
.facts dt { font-weight: 600; color: var(--ink); padding-inline-end: var(--s4); }
.facts dd { color: var(--body); }
@media (max-width: 640px) { .facts { grid-template-columns: 1fr; } .facts dt { border-bottom: 0; padding-bottom: 0; } }
.glossary dt { font: 500 var(--step-1) var(--font-display); }
.glossary .origin { display: block; margin-top: .3rem; font: 600 .72rem var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--gold-text); }
:lang(ar) .glossary .origin { letter-spacing: 0; text-transform: none; }

/* FAQ */
.faq { border-top: 1px solid var(--line-strong); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { display: flex; justify-content: space-between; gap: var(--s5); padding: var(--s5) 0; cursor: pointer; list-style: none; font: 500 var(--step-1)/1.35 var(--font-body); color: var(--ink); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; flex: none; font: 300 1.6rem/1 var(--font-body); color: var(--gold-text); }
.faq details[open] summary::after { content: "–"; }
.faq .answer { padding-bottom: var(--s5); max-width: var(--measure); color: var(--body); }
.faq .answer p:last-child { margin: 0; }

/* Forms */
.form { display: grid; gap: var(--s5); }
.form h2, .form h3 { margin-bottom: 0; }
.field { display: grid; gap: .45rem; min-width: 0; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s5); }
@media (max-width: 640px) { .field-row { grid-template-columns: 1fr; } }
.field label, .field legend { font-weight: 600; font-size: .92rem; color: var(--ink); }
.field .hint { margin: 0; color: var(--muted); font-size: .84rem; }
.optional { color: var(--muted); font-weight: 400; }
input[type="text"], input[type="email"], input[type="tel"], select, textarea {
  width: 100%; min-height: 48px; padding: .75rem .9rem; border: 1px solid var(--line-strong); border-radius: var(--radius-sm);
  background: var(--surface); color: var(--ink); font: 400 1rem var(--font-body);
}
textarea { min-height: 120px; resize: vertical; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--gold-text); outline-offset: 1px; border-color: transparent; }
[aria-invalid="true"] { border-color: var(--danger) !important; }
.error-text { color: var(--danger); font-size: .86rem; font-weight: 600; margin: 0; }
.check { display: grid; grid-template-columns: 22px 1fr; gap: .7rem; align-items: start; }
.check input { width: 20px; height: 20px; margin: .2rem 0 0; accent-color: var(--forest); }
.check label { font-weight: 400; color: var(--body); }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.choice-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: .6rem; }
.choice { position: relative; }
.choice input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.choice span { display: flex; align-items: center; min-height: 52px; padding: .7rem 1rem; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface); font-weight: 500; }
.choice input:checked + span { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.choice input:focus-visible + span { outline: 2px solid var(--gold-text); outline-offset: 2px; }
.hp { position: absolute !important; inset-inline-start: -9999px; }
.form-status { margin: 0; min-height: 1.4em; font-weight: 600; }
.form-status.error { color: var(--danger); }
.panel { padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.band-forest .panel { color: var(--ink); }
.band-forest .panel p { color: var(--body); }

/* Quiz */
.quiz { max-width: 720px; }
.quiz-progress { height: 3px; background: var(--line); margin-bottom: var(--s6); }
.quiz-progress span { display: block; height: 100%; width: 0; background: var(--gold); transition: width .3s var(--ease); }
.quiz-count { color: var(--gold-text); font-size: .8rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 var(--s4); }
:lang(ar) .quiz-count { letter-spacing: 0; text-transform: none; font-size: .9rem; }
.quiz-statement { font: 400 var(--step-3)/1.25 var(--font-display); color: var(--ink); margin: 0 0 var(--s6); outline: none; }
.scale { display: grid; gap: .5rem; }
.scale button { display: flex; align-items: center; gap: .9rem; width: 100%; min-height: 54px; padding: .6rem 1rem; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); font: 500 1rem var(--font-body); text-align: start; cursor: pointer; }
.scale button:hover { border-color: var(--ink); }
.scale button[aria-pressed="true"] { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.scale .n { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--line-strong); font-size: .8rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.scale button[aria-pressed="true"] .n { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.quiz-nav { margin-top: var(--s5); display: flex; justify-content: space-between; }
.text-btn { min-height: 44px; padding: 0; border: 0; background: none; color: var(--muted); font: 600 .92rem var(--font-body); cursor: pointer; }
.text-btn:hover { color: var(--ink); }
.text-btn:disabled { visibility: hidden; }
.result-title { font-size: var(--step-4); margin: 0 0 var(--s4); outline: none; }
.bars { display: grid; gap: var(--s5); margin: var(--s6) 0; }
.bar { display: grid; grid-template-columns: 1fr auto; gap: .4rem 1rem; }
.bar-label { font-weight: 600; color: var(--ink); }
.bar-desc { grid-column: 1 / -1; color: var(--muted); font-size: .88rem; margin: 0; }
.bar-value { font-variant-numeric: tabular-nums; color: var(--muted); }
.bar-track { grid-column: 1 / -1; height: 8px; background: var(--line); border-radius: 8px; overflow: hidden; }
.bar-fill { height: 100%; width: 0; border-radius: 8px; background: var(--ink); transition: width .6s var(--ease); }
.bar-fill.strain { background: repeating-linear-gradient(45deg, var(--gold) 0 6px, var(--gold-text) 6px 9px); }
.legend { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; color: var(--muted); font-size: .84rem; }
.legend span { display: inline-flex; align-items: center; gap: .45rem; }
.legend i { display: inline-block; width: 18px; height: 8px; border-radius: var(--radius-sm); background: var(--ink); }
.legend i.strain { background: repeating-linear-gradient(45deg, var(--gold) 0 6px, var(--gold-text) 6px 9px); }

/* Navigator */
.nav-result { margin-top: var(--s6); }
.nav-result ul { margin: var(--s4) 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.nav-result li { padding: var(--s4) 0; border-bottom: 1px solid var(--line); }
.nav-result strong { display: block; font: 500 var(--step-1) var(--font-display); color: var(--ink); }

/* Books */
.books { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s5); margin: 0; padding: 0; list-style: none; }
.book { display: flex; flex-direction: column; gap: var(--s3); }
.book h3 { font-size: var(--step-2); }
.book .link-arrow { margin-top: auto; align-self: flex-start; }
.book-cover { position: relative; aspect-ratio: 2 / 3; display: flex; flex-direction: column; justify-content: space-between; padding: 1.3rem 1.2rem; background: linear-gradient(160deg, var(--brand-green-light), var(--brand-green-deep)); color: var(--on-forest); border-radius: 4px 10px 10px 4px; box-shadow: inset 6px 0 0 rgba(0, 0, 0, .18), var(--shadow); overflow: hidden; }
.book-cover::after { content: ""; position: absolute; inset: 1.1rem 1.1rem auto auto; width: 34px; height: 30px; background: url("../img/logo-mark.svg") center / contain no-repeat; opacity: .9; }
.book-cover b { font: 400 1.35rem/1.15 var(--font-display); }
.book-cover small { color: var(--gold-on-forest); font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; }
.book:nth-child(2) .book-cover { background: linear-gradient(160deg, #5a4526, #2f2312); }
.book:nth-child(3) .book-cover { background: linear-gradient(160deg, #3d5a63, #1a2c33); }
.book:nth-child(4) .book-cover { background: linear-gradient(160deg, #5b3a34, #2a1a17); }
@media (max-width: 860px) { .books { grid-template-columns: 1fr 1fr; } }

/* CTA band */
.cta-band { text-align: start; }
.cta-band h2 { max-width: 18ch; }
.cta-band p { max-width: 52ch; margin-top: var(--s5); }
.cta-band .actions { margin-top: var(--s6); }

/* Footer */
.site-footer { background: var(--brand-green-deep); color: var(--on-forest-muted); padding-block: var(--s8) var(--s5); font-size: .93rem; }
.site-footer .brand-name { color: var(--on-forest); }
.site-footer .brand-sub { color: var(--on-forest-muted); }
.footer-grid { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: var(--s6); }
.footer-grid h2 { margin: 0 0 var(--s4); font: 600 .74rem var(--font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-on-forest); }
:lang(ar) .footer-grid h2 { letter-spacing: 0; font-size: .9rem; }
.footer-grid ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .55rem; }
.footer-grid a { text-decoration: none; }
.footer-grid a:hover { text-decoration: underline; color: var(--on-forest); }
.footer-about p { margin-top: var(--s4); max-width: 34ch; }
.footer-crisis { margin-top: var(--s5); padding-top: var(--s4); border-top: 1px solid rgba(255,255,255,.15); font-size: .85rem; }
.footer-crisis strong { color: var(--on-forest); }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s3); margin-top: var(--s8); padding-top: var(--s5); border-top: 1px solid rgba(255,255,255,.12); font-size: .82rem; }
@media (max-width: 1020px) { .footer-grid { grid-template-columns: 1fr 1fr; } .footer-about { grid-column: 1 / -1; } }
@media (max-width: 520px) { .footer-grid { grid-template-columns: 1fr; } }

/* Misc */
.stack > * + * { margin-top: var(--s5); }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s6); }
@media (max-width: 760px) { .grid-2 { grid-template-columns: 1fr; } }
.list-check { margin: 0; padding: 0; list-style: none; }
.list-check li { position: relative; padding: .7rem 0 .7rem 1.6rem; border-bottom: 1px solid var(--line); color: var(--body); }
[dir="rtl"] .list-check li { padding: .7rem 1.6rem .7rem 0; }
.list-check li::before { content: ""; position: absolute; inset-inline-start: 0; top: 1.25rem; width: 9px; height: 1px; background: var(--gold); }
.band-forest .list-check li { border-color: rgba(255,255,255,.18); }
.not-for li::before { background: var(--danger); }
.contact-lines { margin: 0; padding: 0; list-style: none; }
.contact-lines li { display: grid; grid-template-columns: 110px 1fr; gap: var(--s4); padding: var(--s4) 0; border-bottom: 1px solid var(--line); }
.contact-lines span { color: var(--muted); font-size: .85rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
:lang(ar) .contact-lines span { letter-spacing: 0; text-transform: none; }
.contact-lines a { font-weight: 600; overflow-wrap: anywhere; }
.ltr { direction: ltr; unicode-bidi: isolate; display: inline-block; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: .01ms !important; animation: none !important; } }
@media print { .site-header, .site-footer, .booking, .actions { display: none !important; } body { background: #fff; color: #000; } }

/* Utilities (no inline styles anywhere, so CSP can forbid them) */
.mt-3 { margin-top: var(--s3); } .mt-4 { margin-top: var(--s4); } .mt-5 { margin-top: var(--s5); } .mt-6 { margin-top: var(--s6); } .mt-7 { margin-top: var(--s7); } .mb-0 { margin-bottom: 0; }
.size-3 { font-size: var(--step-3); }
.hero .eyebrow { color: var(--gold-on-forest); }
.band-forest .lede { color: var(--on-forest-muted); }
.nav-result .muted { margin: .3rem 0 .6rem; }

/* Framework model diagram */
.model { min-width: 640px; width: 100%; height: auto; }
.model .m-box rect { fill: var(--surface); stroke: var(--line-strong); stroke-width: 1.5; }
.model .m-text text { fill: var(--ink); font: 600 13px var(--font-body); text-anchor: middle; }
.model .m-text .m-note { fill: var(--muted); font-weight: 500; font-style: italic; }
.model .m-line path { fill: none; stroke: var(--gold-text); stroke-width: 2; }
.model .m-line .m-dash { stroke-dasharray: 5 5; }
.model .m-head path { fill: var(--gold-text); }
.model-wrap { border-top: 0; }
.offer .list-check li { font-size: .93rem; padding-block: .5rem; }
blockquote { margin: 0; }
.band-forest .principles p, .band-forest .steps p, .band-forest .offer p, .band-forest .list-check li { color: var(--on-forest-muted); }
.band-forest .principles h3 { color: var(--on-forest); }
a[href^="tel:"] { white-space: nowrap; }
.link-arrow.ltr { display: inline-flex; }

/* Mirror quotes and the three gaps */
.mirror { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line-strong); }
.mirror li { padding: var(--s4) 0; border-bottom: 1px solid var(--line); font: 400 var(--step-1)/1.4 var(--font-display); color: var(--ink); }
.gaps { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--s6); }
.gaps li { display: grid; grid-template-columns: 56px 1fr; gap: var(--s4); padding-top: var(--s5); border-top: 1px solid rgba(255,255,255,.25); }
.gaps h3 { font-size: var(--step-2); }
.gaps .gap-q { margin: .3rem 0 .5rem; font: italic 400 var(--step-1) var(--font-display); color: var(--gold-on-forest); }
.band-forest .gaps .kicker-num { color: var(--gold-on-forest); }
.prose .gaps li { border-color: var(--line-strong); }
.prose .gaps .gap-q { color: var(--gold-text); }
.size-2 { font-size: var(--step-2); }
.lens { margin-top: var(--s5); padding: var(--s5); background: var(--bg-alt); border-inline-start: 3px solid var(--gold); border-radius: var(--radius-sm); color: var(--body); }
.lens strong { color: var(--ink); }
.levels { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s5); margin: var(--s5) 0; }
.levels > div { padding-top: var(--s4); border-top: 2px solid var(--gold); }
.levels > div:nth-child(2) { border-top-style: dashed; }
.levels > div:nth-child(3) { border-top-style: dotted; }
.levels strong { display: block; margin-bottom: .3rem; color: var(--ink); }
.levels p { margin: 0; font-size: .95rem; }
@media (max-width: 760px) { .levels { grid-template-columns: 1fr; } }
.mt-0 { margin-top: 0 !important; }
.footer-jurisdiction { margin: var(--s7) 0 0; max-width: 80ch; font-size: .85rem; color: var(--on-forest-muted); }
.footer-bottom span:last-child { display: flex; flex-wrap: wrap; gap: .2rem .6rem; }

/* Blog */
.blog-tools { display: grid; gap: var(--s5); margin-bottom: var(--s7); }
.blog-search { max-width: 520px; }
input[type="search"] { width: 100%; min-height: 48px; padding: .75rem .9rem; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); font: 400 1rem var(--font-body); }
input[type="search"]:focus-visible { outline: 2px solid var(--gold-text); outline-offset: 1px; border-color: transparent; }
.blog-tools .filters { margin: 0; }
.blog-group { padding-top: var(--s7); }
.blog-group + .blog-group { margin-top: var(--s5); border-top: 1px solid var(--line); }
.blog-group .section-head-row { margin-bottom: var(--s5); }
.blog-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line-strong); }
.blog-list li { display: grid; grid-template-columns: 1fr auto; gap: var(--s4); align-items: baseline; padding: var(--s4) 0; border-bottom: 1px solid var(--line); }
.blog-list a { display: grid; gap: .25rem; text-decoration: none; min-width: 0; }
.blog-list strong { font: 500 var(--step-1)/1.3 var(--font-display); color: var(--ink); }
.blog-list a:hover strong { text-decoration: underline; text-decoration-color: var(--gold); }
.blog-list span:not(.article-meta) { color: var(--body); font-size: .95rem; }
.blog-empty { margin-top: var(--s6); }
.tag-link { text-decoration: none; }
.tag-link:hover { border-color: var(--ink); }
.author-box { display: grid; grid-template-columns: 56px 1fr; gap: var(--s4); align-items: start; padding: var(--s5); background: var(--bg-alt); border-radius: var(--radius); }
.author-box img { width: 56px; height: auto; }
.author-box p:last-child { margin: 0; }
.prose .faq { margin: var(--s4) 0 var(--s6); }
.prose .faq summary { font-size: var(--step-0); font-weight: 600; }
.prose table { min-width: 0; }
.article-title { font-size: var(--step-4); max-width: 22ch; }
@media (max-width: 600px) { .blog-list li { grid-template-columns: 1fr; gap: .3rem; } }

/* ---------- Brand layer: booking band, two doors, library ---------- */
.page-hero { background: linear-gradient(180deg, var(--bg-alt) 0%, var(--bg) 100%); }
.page-hero .pulse { max-width: 220px; margin-bottom: var(--s5); }

.booking { background: var(--brand-green); color: var(--on-forest); }
.booking-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--s5) var(--s7); align-items: center; padding-block: var(--s7); }
.booking-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s5); margin: 0; padding: 0; list-style: none; }
.booking-steps li { display: grid; grid-template-columns: 52px 1fr; gap: .9rem; align-items: center; }
.booking-steps .b-icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; border: 1.5px solid var(--gold-on-forest); color: var(--gold-on-forest); }
.booking-steps .b-icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.booking-steps small { display: block; color: var(--gold-on-forest); font-size: .72rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.booking-steps strong { display: block; margin-top: .15rem; color: #fff; font: 500 1.15rem/1.3 var(--font-display); }
:lang(ar) .booking-steps strong { font-family: var(--font-body); font-weight: 600; font-size: 1.05rem; }
.booking-cta p { margin: 0; color: var(--on-forest-muted); font-size: .9rem; }
.booking-cta a[href^="tel:"] { color: #fff; font-weight: 700; }
@media (max-width: 960px) { .booking-inner { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .booking-steps { grid-template-columns: 1fr; } }

.doors { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s5); }
.door { display: flex; flex-direction: column; gap: var(--s4); padding: clamp(1.75rem, 1.2rem + 2vw, 2.75rem); border-radius: var(--radius); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); }
.door.dark { background: linear-gradient(160deg, var(--brand-green) 0%, var(--brand-green-deep) 100%); border-color: transparent; color: var(--on-forest); }
.door.dark h3 { color: #fff; }
.door.dark p, .door.dark li { color: var(--on-forest-muted); }
.door.dark .eyebrow, .door.dark .link-arrow { color: var(--gold-on-forest); }
.door.dark .list-check li { border-color: rgba(250, 246, 238, .14); }
.door.dark .list-check li::before { background: var(--gold-on-forest); }
.door h3 { font-size: var(--step-3); }
.door .eyebrow { margin: 0; }
.door p { margin: 0; }
.door .actions { margin-top: auto; padding-top: var(--s4); }
.door .where { font-size: .88rem; font-weight: 700; color: var(--gold-text); }
.door.dark .where { color: var(--gold-on-forest); }
@media (max-width: 860px) { .doors { grid-template-columns: 1fr; } }

.library .books { gap: var(--s6); }
.book p { margin: 0; color: var(--muted); font-size: .92rem; }
.book h3 { font-size: var(--step-1); }

.tagline { margin: 0 auto; max-width: 30ch; text-align: center; font: italic 400 var(--step-3)/1.35 var(--font-display); color: var(--on-forest); }
.tagline-wrap { display: grid; gap: var(--s5); justify-items: center; text-align: center; }
.cta-band.center { text-align: center; }
.cta-band.center h2, .cta-band.center p { margin-inline: auto; }
.cta-band.center .actions { justify-content: center; }
.founder-mark { width: 64px; height: auto; margin-bottom: var(--s5); }
.footer-mark { width: 44px; height: auto; }
.site-footer .brand-sub { color: var(--gold-on-forest); }
.site-footer .brand-name { color: var(--on-forest); }
.hero h1 em { color: var(--gold-on-forest); }
.door.dark .tag { border-color: rgba(250, 246, 238, .3); color: var(--on-forest); }
.door.dark .tag::before { border-color: var(--gold-on-forest); }
.door .list-check a { color: inherit; text-decoration-color: var(--gold); }
.door.dark .list-check a { color: #fff; }

/* What brings you here today */
.needs-head { max-width: 760px; margin: 0 auto var(--s7); text-align: center; }
.needs-head h2 { font-size: var(--step-5); }
.needs-head .lede { margin: var(--s5) auto 0; }
.needs-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s5); margin: 0; padding: 0; list-style: none; }
.need { display: flex; flex-direction: column; gap: .6rem; height: 100%; padding: var(--s6) var(--s6) calc(var(--s6) + 4px); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); text-decoration: none; box-shadow: var(--shadow); transition: transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease); }
.need:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: var(--line-strong); }
.need strong { display: flex; align-items: baseline; gap: .7rem; font: 500 var(--step-2)/1.2 var(--font-display); color: var(--ink); }
.need strong::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--gold); transform: translateY(-.15em); }
.need span { color: var(--body); line-height: 1.6; }
:lang(ar) .need strong { font-weight: 700; }
.needs-foot { display: grid; justify-items: center; gap: var(--s4); margin-top: var(--s7); text-align: center; }
.needs-foot p { margin: 0; }
.needs-foot > p:first-child { font: italic 400 var(--step-1) var(--font-display); color: var(--muted); }
@media (max-width: 960px) { .needs-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .needs-grid { grid-template-columns: 1fr; } .need { padding: var(--s5); } }
.booking-cta { display: grid; gap: .6rem; justify-items: start; }
.hero-inner { padding-bottom: clamp(2.5rem, 1.5rem + 3vw, 4rem); }
.needs-head { max-width: 920px; }
.needs-head h2 { font-size: clamp(2.3rem, 1.3rem + 3.2vw, 4rem); }
:lang(ar) em, :lang(ar) .hero-sub, :lang(ar) .tagline, :lang(ar) .needs-foot > p:first-child, :lang(ar) .gap-q { font-style: normal; }
.books { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 860px) { .books, .library .books { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s5); } }
@media (max-width: 420px) { .book .link-arrow { font-size: .9rem; } }

/* ---------- Calm layer: fewer elements, more air ---------- */
:root { --shadow: 0 1px 2px rgba(21, 48, 31, .04); --shadow-hover: 0 12px 28px -18px rgba(21, 48, 31, .35); }
.center-text { text-align: center; }
.center-text h2 { margin-inline: auto; }
.actions.center { justify-content: center; }
.link-quiet { color: var(--on-forest); font-weight: 600; text-decoration: underline; text-decoration-color: rgba(201, 169, 97, .7); text-underline-offset: .3em; padding: .6rem .4rem; }
.link-quiet:hover { color: #fff; text-decoration-color: var(--gold-on-forest); }

.hero-calm { background: linear-gradient(170deg, var(--brand-green-deep) 0%, var(--brand-green) 100%); }
.hero-center { display: grid; justify-items: center; text-align: center; padding-block: clamp(4.5rem, 3rem + 6vw, 8rem) clamp(3rem, 2rem + 3vw, 5rem); }
.hero-mark { width: 84px; height: auto; margin-bottom: var(--s6); }
.hero-calm h1 { max-width: none; }
.hero-calm .hero-sub { margin: var(--s5) auto var(--s3); max-width: 34ch; }
.hero-calm .hero-copy { margin: 0 auto; max-width: 44ch; }
.hero-calm .actions { justify-content: center; gap: var(--s5); }
.hero-calm .pulse { max-width: 420px; margin-top: clamp(2.5rem, 2rem + 2vw, 4rem); opacity: .85; }

.needs-head h2 { font-size: var(--step-4); }
.needs-grid { gap: var(--s4); }
.need { padding: var(--s5) var(--s5) calc(var(--s5) + 2px); box-shadow: none; }
.need:hover { box-shadow: var(--shadow-hover); }
.need strong { font-size: var(--step-1); }
.need span { font-size: .95rem; color: var(--muted); }
p.needs-foot { display: block; margin: var(--s6) 0 0; text-align: center; color: var(--muted); }
p.needs-foot a { color: var(--ink); font-weight: 700; text-decoration-color: var(--gold); }

.start-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s5); margin: var(--s7) 0; padding: 0; list-style: none; }
.start-steps li { display: grid; justify-items: center; gap: .35rem; }
.start-steps .num { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: .4rem; border-radius: 50%; border: 1.5px solid var(--gold); color: var(--gold-text); font: 600 1.1rem var(--font-display); }
.start-steps strong { color: var(--ink); font: 500 var(--step-1)/1.3 var(--font-display); }
.start-steps span:not(.num) { color: var(--muted); font-size: .92rem; }
@media (max-width: 640px) { .start-steps { grid-template-columns: 1fr; gap: var(--s6); } }

.where { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s5); margin-top: var(--s7); }
.where > div { display: grid; align-content: start; gap: var(--s3); padding: var(--s6); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.where h3 { font-size: var(--step-2); }
.where p { margin: 0 0 var(--s3); color: var(--muted); }
.where .link-arrow { justify-self: start; }
@media (max-width: 760px) { .where { grid-template-columns: 1fr; } }

.quote-center p { margin-inline: auto; max-width: 30ch; font-size: var(--step-3); line-height: 1.35; }
.quote-center footer { display: grid; gap: .3rem; margin-top: var(--s5); }
.quote-center footer span { color: var(--muted); font-weight: 500; letter-spacing: 0; text-transform: none; font-size: .9rem; }
.actions.center .link-arrow { margin-inline: var(--s3); }
.cta-band.center .tagline { margin-bottom: var(--s4); }
:lang(ar) .quote-center footer span { font-size: .95rem; }
.hero-calm .hero-sub { max-width: 46ch; }

/* ---------- Restored homepage sections ---------- */
.eyebrow-center { justify-content: center; }
.eyebrow-center::before { display: none; }
.brand-sub { letter-spacing: .12em; }
.gaps-head { max-width: 760px; margin: 0 auto var(--s7); }
.gaps-head .lede { margin: var(--s5) auto 0; }
.gap-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s6); margin: 0; padding: 0; list-style: none; counter-reset: none; }
.gap-cols li { padding-top: var(--s5); border-top: 1px solid rgba(250, 246, 238, .22); }
.gap-cols .kicker-num { color: var(--gold-on-forest); font-size: var(--step-0); }
.gap-cols h3 { margin-top: var(--s3); color: #fff; font-size: var(--step-2); }
.gap-cols .gap-q { margin: .4rem 0 .6rem; font: italic 400 var(--step-1)/1.35 var(--font-display); color: var(--gold-on-forest); }
.gap-cols p:last-child { margin: 0; color: var(--on-forest-muted); }
@media (max-width: 860px) { .gap-cols { grid-template-columns: 1fr; gap: var(--s5); } }
.difference { max-width: 680px; margin: var(--s8) auto 0; padding-top: var(--s7); border-top: 1px solid rgba(250, 246, 238, .22); text-align: center; }
.difference-line { margin: 0 0 var(--s4); font: 500 var(--step-3)/1.25 var(--font-display); color: #fff; }
.difference-line em { color: var(--gold-on-forest); }
.difference p { color: var(--on-forest-muted); }
.difference .link-arrow { color: var(--gold-on-forest); margin-top: var(--s3); }
.safety { padding: var(--s6); border-radius: var(--radius); background: var(--surface); border: 1px solid var(--line); border-inline-start: 4px solid var(--brand-green-light); }
.safety h2 { font-size: var(--step-2); margin-bottom: var(--s3); }
.safety p { margin: 0; color: var(--body); }
.founder { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: center; }
.founder .quote p { font-size: var(--step-3); line-height: 1.3; max-width: 24ch; }
.founder-bio p { color: var(--body); }
.founder-bio h2 { margin-bottom: var(--s4); }
.founder-bio cite { font-style: italic; }
.founder-bio .actions { gap: var(--s5); margin-top: var(--s5); }
@media (max-width: 860px) { .founder { grid-template-columns: 1fr; } }
.cta-band.center h2 { max-width: 20ch; }
.cta-band.center > .container > p:not(.eyebrow):not(.tagline-small) { max-width: 52ch; }
.tagline-small { margin-top: var(--s7); font: italic 400 var(--step-1)/1.4 var(--font-display); color: var(--gold-on-forest); }
:lang(ar) .tagline-small, :lang(ar) .gap-cols .gap-q { font-style: normal; }

/* ---------- Quick contact: WhatsApp + Book now ---------- */
.fab { position: fixed; inset-inline-end: 18px; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); z-index: 70; display: grid; gap: 12px; }
.fab-btn { position: relative; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; text-decoration: none; box-shadow: 0 12px 26px -10px rgba(0, 0, 0, .45); transition: transform .2s var(--ease); }
.fab-btn:hover { transform: translateY(-2px); }
.fab-btn svg { width: 26px; height: 26px; }
.fab-wa { background: var(--brand-green); border: 1.5px solid var(--brand-gold); }
.fab-wa svg { fill: var(--brand-gold-bright); }
.fab-book { background: var(--brand-gold); }
.fab-book svg { fill: none; stroke: var(--brand-green-deep); stroke-width: 1.8; stroke-linecap: round; }
.fab-label { position: absolute; inset-inline-end: 66px; top: 50%; transform: translateY(-50%); padding: 6px 11px; border-radius: 8px; background: var(--brand-green-deep); color: #FAF6EE; font-size: .8rem; font-weight: 700; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .2s; }
.fab-btn:hover .fab-label, .fab-btn:focus-visible .fab-label { opacity: 1; }
@media (max-width: 720px) {
  body { padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px)); }
  .fab { inset: auto 0 0 0; grid-template-columns: 1fr 1fr; gap: 0; padding-bottom: env(safe-area-inset-bottom, 0px); background: var(--brand-green-deep); box-shadow: 0 -8px 24px -12px rgba(0, 0, 0, .4); }
  .fab-btn { width: auto; height: 64px; border-radius: 0; border: 0; box-shadow: none; display: flex; gap: .55rem; justify-content: center; align-items: center; }
  .fab-btn:hover { transform: none; }
  .fab-btn svg { width: 22px; height: 22px; }
  .fab-wa { background: var(--brand-green-deep); }
  .fab-label { position: static; transform: none; opacity: 1; padding: 0; background: none; font-size: .95rem; }
  .fab-wa .fab-label { color: #FAF6EE; }
  .fab-book .fab-label { color: var(--brand-green-deep); }
  .fab-btn:only-child { grid-column: 1 / -1; }
}
@media print { .fab { display: none !important; } }

/* ---------- Social icons ---------- */
.social { display: flex; flex-wrap: wrap; gap: .6rem; margin: var(--s5) 0 0; padding: 0; list-style: none; }
.social a { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(250, 246, 238, .3); color: var(--on-forest); transition: background .2s, color .2s; }
.social a:hover { background: var(--brand-gold); color: var(--brand-green-deep); border-color: var(--brand-gold); }
.social svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.social svg .fill, .social svg .dot { fill: currentColor; stroke: none; }
.res-soon + .social, .section .social { justify-content: center; }
.section .social a { border-color: var(--line-strong); color: var(--ink); }

/* ---------- Resources ---------- */
.res-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--s4); }
.res-card { display: grid; align-content: start; gap: .45rem; padding: var(--s6) var(--s5); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); text-decoration: none; transition: box-shadow .2s var(--ease), transform .2s var(--ease); }
.res-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover); }
.res-kicker { color: var(--gold-text); font-size: .74rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
:lang(ar) .res-kicker { letter-spacing: 0; font-size: .85rem; }
.res-card strong { font: 500 var(--step-2)/1.25 var(--font-display); color: var(--ink); }
.res-card span:last-child { color: var(--muted); font-size: .95rem; }
.res-soon { margin: 0; font: italic 400 var(--step-1) var(--font-display); color: var(--muted); }
:lang(ar) .res-soon { font-style: normal; }
.media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--s6); margin: var(--s6) 0 0; padding: 0; list-style: none; }
.media-card h3 { margin-top: var(--s4); font-size: var(--step-1); }
.media-card p { margin: .4rem 0 0; color: var(--muted); font-size: .95rem; }
.media-card video, .video-frame, .video-facade { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: var(--radius-sm); background: var(--brand-green-deep); }
.video-facade { position: relative; display: grid; place-items: center; align-content: center; gap: .8rem; padding: var(--s5); color: #FAF6EE; font: 500 1rem var(--font-body); cursor: pointer; background: linear-gradient(160deg, var(--brand-green-light), var(--brand-green-deep)); }
.video-facade .play { width: 64px; height: 64px; border-radius: 50%; background: var(--brand-gold); position: relative; }
.video-facade .play::after { content: ""; position: absolute; left: 26px; top: 20px; border-left: 18px solid var(--brand-green-deep); border-top: 12px solid transparent; border-bottom: 12px solid transparent; }
.audio-list { margin: var(--s6) 0 0; padding: 0; list-style: none; display: grid; gap: var(--s5); }
.audio-list li { padding: var(--s5); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.audio-list h3 { font-size: var(--step-1); }
.audio-list p { margin: .4rem 0 var(--s4); color: var(--muted); }
.audio-list audio { width: 100%; }
.audio-embed { width: 100%; height: 160px; border: 0; border-radius: var(--radius-sm); }
.pdf-list { display: grid; gap: var(--s4); grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); margin: var(--s6) 0 0; padding: 0; list-style: none; }
.pdf-list a { display: grid; grid-template-columns: 52px 1fr; gap: var(--s4); align-items: center; padding: var(--s5); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); text-decoration: none; }
.pdf-list a:hover { box-shadow: var(--shadow-hover); }
.pdf-icon { display: grid; place-items: center; width: 52px; height: 64px; border-radius: 6px; background: var(--brand-green); color: var(--brand-gold-bright); font-size: .75rem; font-weight: 800; letter-spacing: .08em; }
.pdf-list strong { display: block; color: var(--ink); font: 500 var(--step-1)/1.3 var(--font-display); }
.pdf-list a span span { display: block; margin-top: .2rem; color: var(--muted); font-size: .9rem; }
.menu-toggle { align-self: center; height: 44px; }
@media (max-width: 480px) { .brand-mark { width: 36px; } .brand-name { font-size: 1.25rem; } .brand-sub { font-size: .52rem; letter-spacing: .06em; } }
.res-cards { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.footer-grid ul.social { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: var(--s4); }

/* ---------- Newsletter ---------- */
.newsletter { padding-block: clamp(3rem, 2rem + 3vw, 5rem); }
.nl-box { display: grid; gap: var(--s5); padding: clamp(1.75rem, 1.2rem + 2vw, 2.75rem); border-radius: var(--radius); background: var(--surface); border: 1px solid var(--line); text-align: center; }
.nl-copy h2 { font-size: var(--step-3); margin: 0 auto var(--s3); max-width: 24ch; }
.nl-copy p { margin: 0 auto; max-width: 52ch; color: var(--muted); }
.nl-form { display: grid; gap: var(--s3); max-width: 520px; margin: 0 auto; width: 100%; }
.nl-row { display: flex; gap: .6rem; }
.nl-row input { flex: 1; min-width: 0; min-height: 50px; padding: .75rem 1rem; border: 1px solid var(--line-strong); border-radius: 999px; background: var(--bg); color: var(--ink); font: 400 1rem var(--font-body); }
.nl-row input:focus-visible { outline: 2px solid var(--gold-text); outline-offset: 1px; }
.nl-check { text-align: start; font-size: .88rem; }
.nl-check label { color: var(--muted); font-weight: 400; }
.nl-status { text-align: center; font-size: .92rem; }
@media (max-width: 520px) { .nl-row { flex-direction: column; } .nl-row .btn { width: 100%; } }

/* ---------- Belonging Forecast ---------- */
.forecast { position: relative; }
.fc-progress { display: none; height: 4px; margin-bottom: var(--s6); border-radius: 4px; background: var(--line); overflow: hidden; }
.forecast.is-interactive .fc-progress { display: block; }
.fc-progress span { display: block; height: 100%; width: 0; background: var(--gold); transition: width .4s var(--ease); }
.fc-step { padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.fc-step + .fc-step { margin-top: var(--s6); }
.forecast.is-interactive .fc-step + .fc-step { margin-top: 0; }
.fc-count { margin: 0 0 var(--s3); color: var(--gold-text); font-size: .75rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
:lang(ar) .fc-count { letter-spacing: 0; font-size: .9rem; }
.fc-step h2 { font-size: var(--step-3); outline: none; }
.fc-situation { margin: var(--s4) 0 var(--s6); font: italic 400 var(--step-2)/1.4 var(--font-display); color: var(--ink); }
:lang(ar) .fc-situation { font-style: normal; }
.fc-options { display: grid; gap: .6rem; }
.fc-options legend { margin-bottom: var(--s4); font-weight: 700; color: var(--ink); }
.fc-option { position: relative; display: block; cursor: pointer; }
.fc-option input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.fc-option label { display: block; cursor: pointer; padding: .9rem 1.1rem; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--bg); color: var(--ink); line-height: 1.45; transition: border-color .15s, box-shadow .15s; }
.fc-option:hover label { border-color: var(--ink); }
.fc-option input:checked + label { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); background: var(--surface); }
.fc-option input:focus-visible + label { outline: 2px solid var(--gold-text); outline-offset: 2px; }
.fc-reveal { margin-top: var(--s6); display: grid; gap: var(--s5); }
.fc-type { padding: var(--s5); border-radius: var(--radius-sm); background: var(--bg-alt); border-inline-start: 3px solid var(--gold); }
.forecast:not(.is-interactive) .fc-types { display: grid; gap: var(--s3); }
.fc-type-label { margin: 0 0 .4rem; font: 500 var(--step-1) var(--font-display); color: var(--ink); }
.fc-if { display: block; font: 700 .72rem var(--font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-text); margin-bottom: .2rem; }
:lang(ar) .fc-if { letter-spacing: 0; font-size: .85rem; }
.fc-type p:last-child { margin: 0; color: var(--body); }
.fc-note { margin: 0; color: var(--muted); font-style: italic; }
:lang(ar) .fc-note { font-style: normal; }
.fc-label { margin: 0 0 .4rem; font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-text); }
:lang(ar) .fc-label { letter-spacing: 0; font-size: .9rem; }
.fc-fact p:last-child, .fc-third p:last-child { margin: 0; }
.fc-gaps dl { display: grid; grid-template-columns: minmax(130px, 190px) 1fr; margin: 0; border-top: 1px solid var(--line); }
.fc-gaps dt, .fc-gaps dd { margin: 0; padding: .7rem 0; border-bottom: 1px solid var(--line); }
.fc-gaps dt { font-weight: 700; color: var(--ink); padding-inline-end: var(--s4); }
.fc-gaps dd { color: var(--body); }
@media (max-width: 600px) { .fc-gaps dl { grid-template-columns: 1fr; } .fc-gaps dt { border-bottom: 0; padding-bottom: 0; } }
.fc-third { padding: var(--s5); border-radius: var(--radius-sm); background: var(--brand-green); color: var(--on-forest); }
.fc-third .fc-label { color: var(--gold-on-forest); }
.fc-nav { display: flex; justify-content: space-between; align-items: center; margin-top: var(--s6); }
.fc-nav .btn:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.fc-end h2 { margin-bottom: var(--s4); }
.fc-end p { color: var(--body); }
.fc-next-cards { margin: var(--s6) 0; }
.fc-privacy { font-size: .88rem; color: var(--muted) !important; }

/* ---------- Guide ---------- */
.guide-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s4); margin-bottom: var(--s6); }
.guide-toc { margin-bottom: var(--s7); padding: var(--s5) var(--s6); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.guide-toc ol { margin: 0; padding-inline-start: 1.2em; columns: 2; column-gap: var(--s6); }
.guide-toc li { margin-bottom: .35rem; break-inside: avoid; }
.guide-toc a { color: var(--ink); text-decoration-color: var(--gold); }
@media (max-width: 640px) { .guide-toc ol { columns: 1; } }
.prose .guide-check { list-style: none; padding: 0; }
.prose .guide-check li { position: relative; padding-inline-start: 2rem; }
.prose .guide-check li::before { content: ""; position: absolute; inset-inline-start: 0; top: .3em; width: 1.05em; height: 1.05em; border: 1.5px solid var(--gold); border-radius: 4px; }
.guide-next { margin-top: var(--s8); padding: var(--s6); border-radius: var(--radius); background: var(--bg-alt); }
.guide-next h2 { margin-bottom: var(--s3); }
@media print {
  .fab, .newsletter, .breadcrumb, .guide-actions, .guide-next .actions, .skip-link { display: none !important; }
  .page-hero { background: none; border: 0; padding: 0 0 1rem; }
  .guide-toc { break-inside: avoid; }
  .prose h2 { break-after: avoid; }
  .prose li, .guide-toc, .callout, .guide-next { break-inside: avoid; }
  a { color: inherit; text-decoration: none; }
  .section, .section.tight { padding-block: 0 !important; }
  .guide-next { margin-top: 1.5rem; }
  .guide-toc { margin-bottom: 1.5rem; }
}

/* ---------- Service comparison ---------- */
.compare { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: var(--s4); margin: 0; padding: 0; list-style: none; }
.cmp { display: flex; flex-direction: column; gap: var(--s3); padding: var(--s5); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.cmp h3 { font-size: var(--step-2); }
.cmp-suits { margin: 0; color: var(--body); }
.cmp-k { font-weight: 700; color: var(--ink); }
.cmp details { border-top: 1px solid var(--line); padding-top: var(--s3); }
.cmp summary { cursor: pointer; font-weight: 700; color: var(--ink); list-style: none; display: flex; justify-content: space-between; align-items: center; min-height: 32px; }
.cmp summary::-webkit-details-marker { display: none; }
.cmp summary::after { content: "+"; color: var(--gold-text); font-size: 1.3rem; font-weight: 400; }
.cmp details[open] summary::after { content: "–"; }
.cmp dl { margin: var(--s3) 0 0; }
.cmp dt { margin-top: var(--s3); font-size: .74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-text); }
:lang(ar) .cmp dt { letter-spacing: 0; font-size: .85rem; }
.cmp dd { margin: .2rem 0 0; color: var(--body); font-size: .95rem; }
.cmp .link-arrow { margin-top: auto; align-self: flex-start; }
.compare { align-items: start; }


/* ---------- Sitemap page ---------- */
.sitemap-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: var(--s6); }
.sitemap-list { margin: var(--s4) 0 0; padding: 0; list-style: none; display: grid; gap: .45rem; }
.sitemap-list a { color: var(--ink); text-decoration-color: var(--gold); }
.sitemap-topic { margin-top: var(--s6); font-size: var(--step-1); }
.sitemap-topic a { text-decoration: none; color: var(--gold-text); }
.sitemap-cols { display: block; columns: 2; column-gap: var(--s6); }
.sitemap-cols li { break-inside: avoid; margin-bottom: .45rem; }
@media (max-width: 760px) { .sitemap-cols { columns: 1; } }

/* ---------- Belonging Circle ---------- */
.rotation { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s4); margin: 0; padding: 0; list-style: none; }
.rotation li { display: grid; gap: .4rem; padding: var(--s5); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); border-top: 4px solid var(--gold); }
.rot-week { color: var(--gold-text); font-size: .74rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.rotation strong { font: 500 var(--step-1)/1.3 var(--font-display); color: var(--ink); }
@media (max-width: 860px) { .rotation { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .rotation { grid-template-columns: 1fr; } }
.plans { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s5); align-items: stretch; }
.plan { display: flex; flex-direction: column; gap: var(--s3); padding: clamp(1.75rem, 1.2rem + 2vw, 2.5rem); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.plan h3 { font-size: var(--step-3); }
.plan-price { margin: 0; color: var(--body); }
.plan-price span { font: 500 var(--step-4)/1 var(--font-display); color: var(--ink); margin-inline-end: .3rem; }
.plan-alt { margin: 0; color: var(--muted); }
.plan .list-check { margin: var(--s3) 0; }
.plan-actions { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: auto; padding-top: var(--s4); }
.plan-note { margin: var(--s3) 0 0; font-size: .88rem; color: var(--muted); }
.plan-featured { background: linear-gradient(160deg, var(--brand-green), var(--brand-green-deep)); border: 2px solid var(--brand-gold); color: var(--on-forest); }
.plan-featured h3, .plan-featured .plan-price span { color: #fff; }
.plan-featured .plan-price, .plan-featured .plan-alt, .plan-featured .list-check li { color: var(--on-forest-muted); }
.plan-featured .list-check li { border-color: rgba(250, 246, 238, .14); }
.plan-featured .list-check li::before { background: var(--gold-on-forest); }
@media (max-width: 760px) { .plans { grid-template-columns: 1fr; } }
.res-featured { background: linear-gradient(160deg, var(--brand-green), var(--brand-green-deep)); border-color: transparent; }
.res-featured strong { color: #fff; }
.res-featured span:last-child { color: var(--on-forest-muted); }
.res-featured .res-kicker { color: var(--gold-on-forest); }

/* Resources: Belonging Moment, start-here paths */
.moment { display: grid; gap: var(--s4); }
.moment textarea { min-height: 72px; }
.moment-actions { display: flex; flex-wrap: wrap; gap: var(--s3); }
.moment .form-status:empty { display: none; }
.path-list { margin: 0; padding: 0; list-style: none; display: grid; gap: .55rem; }
.path-list a { color: var(--body); text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; }
.path-list a:hover { color: var(--ink); text-decoration-color: currentColor; }
.paths .offer { box-shadow: none; }
.paths .offer:hover { transform: none; }
/* Belong app page */
.btn[disabled] { opacity: .55; cursor: not-allowed; }
.app-stores { display: flex; flex-wrap: wrap; gap: var(--s3); align-items: center; }
@media (min-width: 1000px) { .res-cards:has(.res-wide) { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-flow: dense; } .res-wide { grid-column: span 2; } }
.paths { grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); }
/* Home: the question underneath, practice steps */
.under-quotes { margin: var(--s6) 0; padding: 0; list-style: none; display: grid; gap: var(--s3); }
.under-quotes li { font: italic 400 var(--step-2)/1.35 var(--font-display); color: var(--ink); }
.practice-cols { margin-top: var(--s7); }
.practice-cols h3 { margin: var(--s4) 0 .5rem; }
.practice-more { margin: var(--s7) 0 0; }
.band-forest .practice-more .link-arrow { color: var(--gold-on-forest); }
/* Article references */
.prose ol.refs { font-size: .86rem; color: var(--muted); padding-inline-start: 0; list-style-position: inside; }
.prose ol.refs li { overflow-wrap: anywhere; word-break: break-word; margin-bottom: .4rem; }
nav.filters a.filter { display: inline-flex; align-items: center; text-decoration: none; }