/* ===========================================================================
   fft.css — Focus Financial Team design system (oklch dark theme)
   Loaded by the fft layout; site inherits brand colors via BrandCssVarsService.
   Fonts loaded by the fft layout via <link>; no @import needed here.
   =========================================================================== */
:root {
  --background-50: .1 0 0;
  --background-100: .12 0 0;
  --background-200: .15 0 0;
  --background-300: .18 0 0;
  --background-400: .22 0 0;
  --background-500: .25 0 0;
  --background-600: .3 0 0;
  --background-700: .35 0 0;
  --background-800: .4 0 0;
  --background-900: .45 0 0;
  --background-950: .08 0 0;
  --primary-50: .9 .05 80;
  --primary-100: .85 .08 80;
  --primary-200: .8 .1 80;
  --primary-300: .75 .11 80;
  --primary-400: .7 .12 80;
  --primary-500: .65 .13 80;
  --primary-600: .58 .12 80;
  --primary-700: .5 .11 80;
  --primary-800: .42 .1 80;
  --primary-900: .35 .08 80;
  --primary-950: .28 .06 80;
  --accent-50: .95 .03 85;
  --accent-100: .9 .04 85;
  --accent-200: .85 .06 85;
  --accent-300: .8 .08 85;
  --accent-400: .75 .09 85;
  --accent-500: .7 .1 85;
  --accent-600: .65 .09 85;
  --accent-700: .58 .08 85;
  --accent-800: .5 .07 85;
  --accent-900: .42 .06 85;
  --accent-950: .35 .05 85;
  --secondary-50: .35 .02 0;
  --secondary-100: .38 .02 0;
  --secondary-200: .42 .02 0;
  --secondary-300: .46 .02 0;
  --secondary-400: .5 .02 0;
  --secondary-500: .55 .02 0;
  --secondary-600: .6 .02 0;
  --secondary-700: .65 .02 0;
  --secondary-800: .7 .02 0;
  --secondary-900: .75 .02 0;
  --secondary-950: .3 .02 0;
  --foreground-50: .98 .01 85;
  --foreground-100: .95 .02 85;
  --foreground-200: .9 .02 85;
  --foreground-300: .85 .02 85;
  --foreground-400: .8 .02 85;
  --foreground-500: .75 .02 85;
  --foreground-600: .7 .02 85;
  --foreground-700: .65 .02 85;
  --foreground-800: .6 .02 85;
  --foreground-900: .55 .02 85;
  --foreground-950: .5 .02 85;
  --font-heading: "Playfair Display", "Georgia", serif;
  --font-body: "DM Sans", "Inter", sans-serif;
  --font-label: "DM Sans", "Inter", sans-serif;
}

html { scroll-behavior: smooth; }
body {
  font-family: var(--font-body);
  background-color: oklch(var(--background-50));
  color: oklch(var(--foreground-100));
}
h1,h2,h3,h4,h5,h6 { font-family: var(--font-heading); color: oklch(var(--foreground-100)); }
::selection { background-color: oklch(var(--primary-500) / .3); color: oklch(var(--foreground-100)); }
a { color: oklch(var(--primary-400)); }
a:hover { color: oklch(var(--primary-300)); }

/* Theme header/footer overrides for McontrolBase */
.theme-header { display: none !important; }
.theme-footer { display: none !important; }
.theme-main { padding-top: 0; }

/* Page-level utility classes */
.fft-section { padding: 5rem 0; }
/* .fft-container = the site's one horizontal-alignment rule. Every section's content
   (other than deliberately edge-to-edge pieces) nests inside this — no section should
   declare its own max-width/side-padding. .fft-full-container is the edge-to-edge escape
   hatch for full-bleed media/split sections; nest a .fft-container inside it if the
   section still needs text aligned to the standard column. */
.fft-full-container { width: 100%; }
.fft-container { width: 100%;  margin: 0 auto; padding: 0 1.25rem; }
@media (min-width: 640px) { .fft-container { padding: 0 2rem; } }
@media (min-width: 1024px) { .fft-container { padding: 0 3rem; } }

/* Shared responsive layout vocabulary — reuse these instead of writing a new
   grid/breakpoint per section. A section's own class should only add what's
   actually different (gap, colors, card padding), never redeclare columns/
   breakpoints that one of these already covers.
   .fft-grid-2/3/4  = N-up card grid, mobile-first (1 col -> 2 @640px -> N @1024px).
   .fft-sidebar-layout = content + fixed sidebar, stacks to 1 col under 900px.
   .fft-sidebar-sticky = sticky sidebar column, un-stickies once stacked.
   .fft-form-row       = 2-up form field row, stacks under 480px. */
.fft-grid-2, .fft-grid-3, .fft-grid-4 { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 640px) {
  .fft-grid-2, .fft-grid-3, .fft-grid-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .fft-grid-3 { grid-template-columns: repeat(3, 1fr); }
  .fft-grid-4 { grid-template-columns: repeat(4, 1fr); }
}

.fft-sidebar-layout { display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: flex-start; }
@media (min-width: 900px) { .fft-sidebar-layout { grid-template-columns: 1fr 360px; } }

.fft-sidebar-sticky { position: sticky; top: 6rem; }
@media (max-width: 899px) { .fft-sidebar-sticky { position: static; } }

.fft-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 480px) { .fft-form-row { grid-template-columns: 1fr; } }
.fft-card {
  background: oklch(var(--background-100));
  border: 1px solid oklch(var(--background-200) / .5);
  border-radius: 0.5rem;
  padding: 1.5rem;
  transition: all 0.3s;
}
.fft-card:hover {
  border-color: oklch(var(--primary-400) / .4);
  box-shadow: 0 0 25px oklch(var(--primary-500) / .08);
}
.fft-btn {
  display: inline-flex;
  align-items: center;
  background: oklch(var(--primary-500));
  color: oklch(var(--background-950));
  font-weight: 600;
  border: none;
  padding: 1rem 2rem;
  border-radius: 9999px;
  font-family: var(--font-body);
  cursor: pointer;
  transition: all 0.3s;
  text-decoration: none;
  font-size: 0.9rem;
}
.fft-btn:hover {
  background: oklch(var(--primary-400));
  transform: scale(1.05);
}
.fft-divider { width: 60px; height: 3px; background: oklch(var(--primary-500)); margin: 1rem 0; }

/* ── Page Hero (banner) — shared inner-page header, see element/fft_page_hero.php ── */
.fft-pagehero { position: relative; padding: 9rem 0 4rem; overflow: hidden; }
.fft-pagehero:not(.has-image) { background: oklch(var(--background-950)); }
.fft-pagehero .fft-hero-bg { position: absolute; inset: 0; z-index: 0; }
.fft-pagehero .fft-hero-bg img { width: 100%; height: 100%; object-fit: cover; }
.fft-pagehero .fft-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, oklch(var(--background-950) / .95), oklch(var(--background-950) / .75) 55%, oklch(var(--background-950) / .5));
}
.fft-pagehero-content { position: relative; z-index: 1; max-width: 720px; }
.fft-pagehero-eyebrow {
  display: inline-flex; align-items: center; gap: .6rem;
  font-size: .75rem; font-weight: 600; letter-spacing: .15em; text-transform: uppercase;
  color: oklch(var(--primary-400)); margin-bottom: 1rem;
}
.fft-pagehero-eyebrow .fft-eyebrow-line { width: 28px; height: 2px; background: oklch(var(--primary-500)); display: inline-block; }
.fft-pagehero-title {
  font-size: clamp(2.25rem, 4vw, 3.25rem); font-weight: 700; line-height: 1.15;
  margin: 0 0 1rem; color: oklch(var(--foreground-100));
}
.fft-pagehero-title .fft-hl {
  color: transparent;
  background: linear-gradient(to right, oklch(var(--primary-400)), oklch(var(--primary-500)), oklch(var(--accent-500)));
  -webkit-background-clip: text; background-clip: text;
}
.fft-pagehero-sub { font-size: 1.05rem; line-height: 1.65; color: oklch(var(--foreground-300)); max-width: 560px; margin: 0; }
/* Optional de-risking line (fft_page_hero.php's $note) — use sparingly, only where a page
   needs to reduce action-anxiety (e.g. booking a call), not as a general tagline slot. */
.fft-pagehero-note { font-size: .85rem; color: oklch(var(--foreground-500)); margin-top: .75rem; }

/* Readdy animations */
@keyframes goldShimmerSweep {
  0% { background-position: 200% 0; }
  to { background-position: -200% 0; }
}
@keyframes sparkleTwinkle {
  0%,to { opacity: .3; }
  25% { opacity: .8; }
  50% { opacity: .4; }
  75% { opacity: 1; }
}
@keyframes goldRingPulse {
  0% { box-shadow: 0 0 0 0 oklch(var(--primary-500) / .4); }
  70% { box-shadow: 0 0 0 12px oklch(var(--primary-500) / 0); }
  to { box-shadow: 0 0 0 0 oklch(var(--primary-500) / 0); }
}

.gold-shimmer-text {
  background: linear-gradient(105deg, oklch(var(--primary-500)/.4) 0%, oklch(var(--primary-400)/.6) 15%, oklch(var(--accent-400)/.75) 30%, oklch(var(--primary-300)/.65) 45%, oklch(var(--primary-500)/.45) 55%, oklch(var(--accent-500)/.7) 70%, oklch(var(--primary-400)/.55) 85%, oklch(var(--primary-500)/.4) 100%);
  color: transparent;
  text-shadow: 0 0 40px oklch(var(--primary-500)/.25), 0 0 80px oklch(var(--accent-500)/.2), 0 0 120px oklch(var(--primary-400)/.15);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  animation: 4s ease-in-out infinite goldShimmerSweep;
}
.gold-shimmer-text:before, .gold-shimmer-text:after {
  content: "";
  pointer-events: none;
  position: absolute;
}
.gold-shimmer-text:before {
  background: linear-gradient(105deg, transparent 0%, oklch(var(--accent-400)/.4) 40%, oklch(var(--primary-300)/.55) 50%, oklch(var(--accent-400)/.4) 60%, transparent 100%);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  animation: 4s ease-in-out .3s infinite goldShimmerSweep;
  inset: 0;
}
.gold-sparkle { position: relative; }
.gold-sparkle:after {
  content: "";
  pointer-events: none;
  background: radial-gradient(circle at 20% 30%, oklch(var(--accent-400)/.85) 0%, transparent 2px), radial-gradient(circle at 70% 60%, oklch(var(--primary-400)/.9) 0%, transparent 1.5px), radial-gradient(circle at 40% 80%, oklch(var(--accent-500)/.85) 0%, transparent 2px), radial-gradient(circle at 85% 20%, oklch(var(--primary-300)/.9) 0%, transparent 1.5px), radial-gradient(circle at 55% 45%, oklch(var(--accent-400)/.85) 0%, transparent 2px), radial-gradient(circle at 10% 70%, oklch(var(--primary-400)/.85) 0%, transparent 1.5px);
  animation: 2.5s ease-in-out infinite sparkleTwinkle;
  position: absolute;
  inset: 0;
}
.gold-ring {
  box-shadow: 0 0 0 0 oklch(var(--primary-500) / .4);
  animation: 2.5s ease-out infinite goldRingPulse;
}
.honeypot-field { opacity:0; pointer-events:none; position:absolute; top:-9999px; left:-9999px; }

/* ── Header — see element/fft_header.php. Classed (not inline) so hover states are CSS,
   not onmouseover/onmouseout JS, and horizontal padding comes from .fft-container. ── */
.fft-nav { position:fixed; top:0; left:0; right:0; z-index:50; transition:all 0.5s; background:transparent; }
.fft-nav-inner { display:flex; align-items:center; justify-content:space-between; height:5rem; }
.fft-nav-logo-link { display:flex; align-items:center; gap:0.5rem; text-decoration:none; }
.fft-nav-logo-wrap { height:3rem; display:flex; align-items:center; justify-content:center; border-radius:0.5rem;   /* padding: 0 0.5rem; */
  margin: 0 0 0 -0.5rem; transition:all 0.5s; }
.fft-nav-logo-wrap img { height:2.5rem; width:auto; object-fit:contain; }
.fft-nav-logo-text { font-family:var(--font-heading); font-weight:700; font-size:1.1rem; color:oklch(var(--foreground-100)); }
/* .fft-nav-panel groups links + CTA only so the mobile toggle has one thing to show/hide.
   On desktop it must NOT be a flex item itself — display:contents makes its children
   (.fft-nav-links, .fft-nav-cta) act as direct children of .fft-nav-inner again, so the
   original 3-way justify-content:space-between (logo | links | CTA) is unchanged. The
   mobile media query below overrides this back to a real flex column for the dropdown. */
.fft-nav-panel { display:contents; }
.fft-nav-links { display:flex; align-items:center; gap:2.5rem; }
.fft-nav-link { font-size:0.875rem; font-weight:500; letter-spacing:0.025em; color:oklch(var(--foreground-300)); text-decoration:none; white-space:nowrap; transition:color 0.15s; }
.fft-nav-link:hover { color:oklch(var(--primary-400)); }
.fft-nav-cta { display:inline-flex; align-items:center; background:oklch(var(--primary-500)); color:oklch(var(--background-50)); padding:0.625rem 1.25rem; border-radius:9999px; font-size:0.875rem; font-weight:600; text-decoration:none; white-space:nowrap; transition:background 0.15s; }
.fft-nav-cta:hover { background:oklch(var(--primary-600)); }
.fft-nav-toggle { display:none; background:none; border:none; color:oklch(var(--foreground-100)); font-size:1.5rem; line-height:1; cursor:pointer; padding:0.25rem; }

/* Mobile: hide the row, show the toggle, and turn .fft-nav-panel into a full-width
   dropdown fixed just below the 5rem-tall nav bar. Toggling .is-open (fft_header.php's
   inline script) is the only JS in the header besides the existing scroll-blur effect. */
@media (max-width:640px) {
  .fft-nav-toggle { display:flex; align-items:center; justify-content:center; }
  .fft-nav-panel {
    display:none;
    position:fixed; top:5rem; left:0; right:0;
    flex-direction:column; align-items:stretch; gap:0;
    max-height:calc(100vh - 5rem); overflow-y:auto;
    background:oklch(var(--background-50) / .98); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
    border-top:1px solid oklch(var(--background-200) / .3);
    padding:.5rem 0 1rem;
  }
  .fft-nav-panel.is-open { display:flex; }
  .fft-nav-links { flex-direction:column; align-items:stretch; gap:0; }
  /* 1.25rem matches .fft-container's base (sub-640px) side padding, so the dropdown's
     text lines up with everything else on the page even though the panel itself is full-bleed. */
  .fft-nav-link { padding:.85rem 1.25rem; }
  .fft-nav-cta { margin:.75rem 1.25rem 0; justify-content:center; }
}

/* ── Footer — see element/fft_footer.php. Classed (not inline) for the same reason as the header. ── */
.fft-footer { position:relative; width:calc(100% - 2rem); margin:1.5rem auto 0; background:oklch(var(--background-950)); border-radius:0.5rem 0.5rem 0 0; overflow:hidden; }
.fft-footer-inner { padding:4rem 0; }
.fft-footer-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr 1.2fr; gap:3rem; }
@media (max-width:900px) { .fft-footer-grid { grid-template-columns:1fr 1fr; gap:2.5rem; } }
@media (max-width:520px) { .fft-footer-grid { grid-template-columns:1fr; gap:2rem; } }
.fft-footer-brand-title { font-family:var(--font-heading); font-size:1.5rem; font-weight:700; color:oklch(var(--foreground-100)); line-height:1.3; }
.fft-footer-brand-sub { font-size:0.875rem; color:oklch(var(--foreground-400)); margin-top:1rem; line-height:1.6; }
.fft-footer-brand-logo { margin-top:1.5rem; height:2.5rem; width:auto; object-fit:contain; }
.fft-footer-heading { font-size:1rem; font-weight:600; color:oklch(var(--foreground-100)); margin-bottom:1.5rem; }
.fft-footer-list { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:0.75rem; }
.fft-footer-link { font-size:0.875rem; color:oklch(var(--foreground-400)); text-decoration:none; transition:color 0.15s; }
.fft-footer-link:hover { color:oklch(var(--primary-400)); }
.fft-footer-newsletter-sub { font-size:0.875rem; color:oklch(var(--foreground-400)); margin-bottom:1rem; }
.fft-footer-newsletter-form { display:flex; align-items:center; gap:0.5rem; }
.fft-footer-newsletter-input { flex:1; background:oklch(var(--background-900)); border:1px solid oklch(var(--primary-500) / 0.3); border-radius:9999px; padding:0.625rem 1rem; font-size:0.875rem; color:oklch(var(--foreground-100)); outline:none; }
.fft-footer-newsletter-btn { width:2.5rem; height:2.5rem; flex-shrink:0; display:flex; align-items:center; justify-content:center; background:oklch(var(--foreground-100)); border-radius:9999px; border:none; cursor:pointer; font-size:1rem; color:oklch(var(--background-950)); }
.fft-footer-brandline { padding:0 0 4rem; text-align:center; }
.fft-footer-brandline p { font-size:4vw; font-family:var(--font-heading); font-weight:700; white-space:nowrap; line-height:1; position:relative; }
.fft-footer-bottom { border-top:1px solid oklch(var(--primary-500) / 0.1); padding:1.5rem 0; }
.fft-footer-copy { font-size:0.75rem; color:oklch(var(--foreground-600)); text-align:center; }

/* ── Get Answers (booking calendar) — see templates/Fft/get_answers.php.
   Header is now the shared .fft_page_hero element (was its own dark full-bleed
   .ga-wrap before); the card reuses .fft-card for bg/border/hover instead of its
   own hardcoded #111/#1c1c1c colors — ga-card only adds what .fft-card doesn't
   (the 2-col grid, bigger padding+radius, gold border). ── */
.fft-ga-section { padding-top:0; margin-top:-3rem; position:relative; z-index:10; }
.ga-card { border-color:oklch(var(--primary-500)/.15); border-radius:1rem; padding:2rem; display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; }
@media(max-width:768px){ .ga-card{ grid-template-columns:1fr; gap:2rem; } }
.ga-cal__top { display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem; }
.ga-cal__month { font-weight:600; font-size:1rem; }
.ga-nav-btn { background:oklch(var(--background-200)); border:1px solid oklch(var(--primary-500)/.2); color:oklch(var(--foreground-200)); width:2rem; height:2rem; border-radius:.5rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .15s; }
.ga-nav-btn:hover:not(:disabled){ border-color:oklch(var(--primary-500)/.6); }
.ga-nav-btn:disabled{ opacity:.3; cursor:not-allowed; }
.ga-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:.35rem; }
.ga-dow { text-align:center; font-size:.7rem; color:oklch(var(--foreground-500)); padding:.4rem 0; }
.ga-day { aspect-ratio:1; border:none; background:transparent; color:oklch(var(--foreground-200)); border-radius:.5rem; font-size:.85rem; cursor:pointer; transition:all .15s; }
.ga-day:disabled { color:oklch(var(--foreground-700)); cursor:not-allowed; }
.ga-day.is-open:not(:disabled):hover { background:oklch(var(--primary-500)/.15); }
.ga-day.is-selected { background:oklch(var(--primary-500)); color:oklch(var(--background-950)); font-weight:700; }
.ga-day.is-open:not(.is-selected){ box-shadow:inset 0 0 0 1px oklch(var(--primary-500)/.35); }
/* Sized up + centered (not the site default left-aligned small text) — this audience
   skews mid-to-older, and reassurance copy that reads as fine print defeats its purpose. */
.ga-slots__title { font-size:1.05rem; font-weight:600; color:oklch(var(--foreground-200)); margin-bottom:.5rem; text-align:center; }
/* Reassurance line shown above the time slots once a date is picked (see fft.js reassure()).
   Empty + no min-height when blank so it doesn't reserve dead space before a date is chosen.
   .is-in re-triggers on every date change via a classList remove/reflow/add in fft.js. */
.ga-reassure { font-size:1rem; font-weight:600; color:oklch(var(--primary-300)); text-align:center; margin:0 0 1rem; }
.ga-reassure:empty { margin:0; }
.ga-reassure.is-in { animation: gaReassureIn .35s ease both; }
@keyframes gaReassureIn { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }
.ga-slots { display:grid; grid-template-columns:repeat(3,1fr); gap:.5rem; max-height:230px; overflow:auto; }
.ga-slot { background:oklch(var(--background-200)); border:1px solid oklch(var(--primary-500)/.2); color:oklch(var(--foreground-100)); padding:.55rem; border-radius:.5rem; font-size:.8rem; cursor:pointer; transition:all .15s; }
.ga-slot:hover { border-color:oklch(var(--primary-500)/.6); }
.ga-slot.is-selected { background:oklch(var(--primary-500)); color:oklch(var(--background-950)); font-weight:700; border-color:oklch(var(--primary-500)); }
.ga-empty { color:oklch(var(--foreground-500)); font-size:.85rem; padding:1rem 0; }
.ga-form { margin-top:1.25rem; display:none; flex-direction:column; gap:.75rem; }
.ga-form.is-visible { display:flex; }
.ga-form input, .ga-form textarea { width:100%; background:oklch(var(--background-50)); border:1px solid oklch(var(--background-200)); border-radius:.5rem; padding:.7rem .9rem; color:oklch(var(--foreground-100)); font-size:.9rem; outline:none; }
.ga-form input:focus, .ga-form textarea:focus { border-color:oklch(var(--primary-500)/.5); }
.ga-submit { width:100%; background:oklch(var(--primary-500)); color:oklch(var(--background-950)); border:none; padding:.85rem; border-radius:9999px; font-weight:600; font-size:.9rem; cursor:pointer; transition:background .15s; }
.ga-submit:hover { background:oklch(var(--primary-400)); }
.ga-summary { font-size:.85rem; color:oklch(var(--primary-300)); margin-bottom:.25rem; }
.ga-msg { text-align:center; padding:1rem; border-radius:.5rem; margin-top:1rem; font-size:.9rem; display:none; }
.ga-msg.ok { display:block; background:oklch(var(--primary-500)/.12); color:oklch(var(--primary-300)); }
.ga-msg.err { display:block; background:oklch(0.6 0.2 25 / .12); color:oklch(0.7 0.18 25); }

/* ── News index — see templates/Fft/news_index.php ── */
/* Horizontal padding comes from the nested .fft-container (fft-pagehero-content); vertical-only here. */
.fft-news-hero { position:relative; min-height:400px; display:flex; align-items:center; justify-content:center; text-align:center; overflow:hidden; padding:8rem 0 4rem; }
.fft-news-hero::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg, oklch(var(--background-950)/.95), oklch(var(--background-50)/.85)); z-index:1; }
.fft-news-hero__deco { position:absolute; inset:0; z-index:0; overflow:hidden; }
.fft-news-hero__deco span { position:absolute; border:1px solid oklch(var(--primary-500)/.08); border-radius:50%; }
.fft-news-hero__deco span:nth-child(1) { width:300px; height:300px; top:-60px; right:-40px; }
.fft-news-hero__deco span:nth-child(2) { width:200px; height:200px; bottom:-30px; left:-20px; }
.fft-news-hero__deco span:nth-child(3) { width:150px; height:150px; top:40%; left:60%; }
.fft-news-hero__inner { position:relative; z-index:2; max-width:700px; }
.fft-news-hero__eyebrow { display:inline-flex; align-items:center; gap:0.5rem; font-size:0.75rem; font-weight:600; letter-spacing:0.15em; text-transform:uppercase; color:oklch(var(--primary-400)); margin-bottom:1.5rem; }
.fft-news-hero__eyebrow svg { width:16px; height:16px; fill:currentColor; }
.fft-news-hero__title { font-family:var(--font-heading); font-size:clamp(2rem,4vw,3.5rem); font-weight:700; color:oklch(var(--foreground-100)); line-height:1.15; }
.fft-news-hero__sub { color:oklch(var(--foreground-300)); font-size:1rem; line-height:1.6; margin-top:1.25rem; max-width:560px; margin-left:auto; margin-right:auto; }
.fft-news-search { max-width:480px; margin:2rem auto 0; position:relative; }
.fft-news-search input { width:100%; background:oklch(var(--background-100)); border:1px solid oklch(var(--background-200)); border-radius:9999px; padding:0.75rem 1.25rem 0.75rem 2.75rem; color:oklch(var(--foreground-100)); font-size:0.9rem; outline:none; transition:border-color 0.2s; }
.fft-news-search input:focus { border-color:oklch(var(--primary-500)/.5); }
.fft-news-search input::placeholder { color:oklch(var(--foreground-600)); }
.fft-news-search__icon { position:absolute; left:1rem; top:50%; transform:translateY(-50%); color:oklch(var(--foreground-500)); font-size:0.9rem; pointer-events:none; }

/* Horizontal alignment comes from wrapping in .fft-container in the template; vertical-only here. */
.fft-news-filters { display:flex; flex-wrap:wrap; gap:0.5rem; justify-content:center; padding:2rem 0 0; }
.fft-news-filter { padding:0.5rem 1.25rem; border-radius:9999px; font-size:0.85rem; font-weight:500; color:oklch(var(--foreground-400)); background:oklch(var(--background-100)); border:1px solid oklch(var(--background-200)); text-decoration:none; transition:all 0.2s; cursor:pointer; }
.fft-news-filter:hover { color:oklch(var(--primary-400)); border-color:oklch(var(--primary-500)/.3); }
.fft-news-filter.is-active { background:oklch(var(--primary-500)); color:oklch(var(--background-950)); border-color:oklch(var(--primary-500)); font-weight:600; }
.fft-news-filter--tag { background:oklch(var(--primary-500)/.1); color:oklch(var(--primary-400)); border-color:oklch(var(--primary-500)/.3); }

.fft-news-tags { display:flex; flex-wrap:wrap; gap:0.5rem; justify-content:center; padding:1rem 0 0; }
.fft-news-tag { font-size:0.8rem; color:oklch(var(--foreground-500)); text-decoration:none; transition:color 0.15s; }
.fft-news-tag:hover { color:oklch(var(--primary-400)); }

.fft-news-featured { display:block; text-decoration:none; position:relative; border-radius:0.75rem; overflow:hidden; margin:3rem auto 0; }
.fft-news-featured__img { width:100%; aspect-ratio:21/9; object-fit:cover; display:block; }
.fft-news-featured__overlay { position:absolute; inset:0; background:linear-gradient(to top, oklch(var(--background-950)/.95), oklch(var(--background-950)/.4), transparent); }
.fft-news-featured__content { position:absolute; bottom:0; left:0; right:0; padding:2.5rem; }
.fft-news-featured__pills { display:flex; gap:0.5rem; margin-bottom:1rem; }
.fft-news-pill { display:inline-block; padding:0.25rem 0.75rem; border-radius:4px; font-size:0.7rem; font-weight:600; text-transform:uppercase; letter-spacing:0.05em; background:oklch(var(--primary-500)/.2); color:oklch(var(--primary-400)); }
.fft-news-featured__title { font-family:var(--font-heading); font-size:clamp(1.5rem,3vw,2.25rem); font-weight:700; color:oklch(var(--foreground-100)); line-height:1.25; }
.fft-news-featured__excerpt { color:oklch(var(--foreground-300)); font-size:0.95rem; line-height:1.6; margin-top:0.75rem; max-width:600px; }
.fft-news-featured__meta { display:flex; flex-wrap:wrap; gap:1.5rem; margin-top:1rem; font-size:0.8rem; color:oklch(var(--foreground-400)); align-items:center; }
.fft-news-featured__meta img { width:28px; height:28px; border-radius:50%; object-fit:cover; }
.fft-news-featured__cta { display:inline-flex; align-items:center; gap:0.5rem; color:oklch(var(--primary-400)); font-weight:600; font-size:0.85rem; margin-top:1.25rem; }

/* Columns/breakpoint come from .fft-sidebar-layout (markup); this just adds top margin + gap. */
.fft-news-grid { margin:3rem auto 0; gap:2.5rem; }
.fft-news-articles { display:flex; flex-direction:column; gap:1.5rem; }

.fft-article-card { display:flex; text-decoration:none; border-radius:0.5rem; overflow:hidden; background:oklch(var(--background-100)); border:1px solid oklch(var(--background-200)/.5); transition:all 0.3s; }
.fft-article-card:hover { border-color:oklch(var(--primary-400)/.4); box-shadow:0 0 25px oklch(var(--primary-500)/.08); }
.fft-article-card__img { width:220px; min-height:200px; object-fit:cover; flex-shrink:0; }
.fft-article-card__body { padding:1.5rem; display:flex; flex-direction:column; flex:1; }
.fft-article-card__pill { display:inline-block; padding:0.2rem 0.6rem; border-radius:4px; font-size:0.7rem; font-weight:600; text-transform:uppercase; background:oklch(var(--primary-500)/.15); color:oklch(var(--primary-400)); margin-bottom:0.75rem; align-self:flex-start; }
.fft-article-card__date { font-size:0.8rem; color:oklch(var(--foreground-500)); margin-bottom:0.5rem; }
.fft-article-card__title { font-family:var(--font-heading); font-size:1.2rem; font-weight:700; color:oklch(var(--foreground-100)); line-height:1.3; }
.fft-article-card__excerpt { color:oklch(var(--foreground-300)); font-size:0.875rem; line-height:1.6; margin-top:0.5rem; flex:1; }
.fft-article-card__author { display:flex; align-items:center; gap:0.5rem; margin-top:1rem; font-size:0.8rem; color:oklch(var(--foreground-400)); }
.fft-article-card__author img { width:24px; height:24px; border-radius:50%; object-fit:cover; }

@media(max-width:640px) {
  .fft-article-card { flex-direction:column; }
  .fft-article-card__img { width:100%; min-height:180px; max-height:200px; }
}

/* .fft-sidebar-sticky (markup) handles position/top/un-stick-on-stack. */
.fft-news-sidebar { display:flex; flex-direction:column; gap:1.5rem; }
.fft-sidebar-card { background:oklch(var(--background-100)); border:1px solid oklch(var(--background-200)/.5); border-radius:0.5rem; padding:1.5rem; }
.fft-sidebar-card h3 { font-family:var(--font-heading); font-size:1.1rem; font-weight:700; color:oklch(var(--foreground-100)); margin-bottom:1rem; }
.fft-sidebar-rank { display:flex; gap:0.75rem; padding:0.75rem 0; border-bottom:1px solid oklch(var(--background-200)/.3); text-decoration:none; }
.fft-sidebar-rank:last-child { border-bottom:none; }
.fft-sidebar-rank__num { font-family:var(--font-heading); font-size:1.25rem; font-weight:700; color:oklch(var(--primary-500)/.4); min-width:1.75rem; }
.fft-sidebar-rank__text { font-size:0.85rem; color:oklch(var(--foreground-300)); line-height:1.4; transition:color 0.15s; }
.fft-sidebar-rank:hover .fft-sidebar-rank__text { color:oklch(var(--primary-400)); }
.fft-sidebar-topics { display:flex; flex-wrap:wrap; gap:0.5rem; }
.fft-sidebar-topic { font-size:0.8rem; padding:0.3rem 0.75rem; border-radius:9999px; background:oklch(var(--background-200)); color:oklch(var(--foreground-400)); text-decoration:none; transition:all 0.2s; }
.fft-sidebar-topic:hover { background:oklch(var(--primary-500)/.15); color:oklch(var(--primary-400)); }

.fft-sidebar-cta { background:linear-gradient(135deg, oklch(var(--primary-500)/.12), oklch(var(--background-100))); border:1px solid oklch(var(--primary-500)/.2); border-radius:0.5rem; padding:1.75rem; text-align:center; }
.fft-sidebar-cta__eyebrow { font-size:0.7rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:oklch(var(--primary-400)); margin-bottom:0.5rem; }
.fft-sidebar-cta h3 { font-family:var(--font-heading); font-size:1.15rem; font-weight:700; color:oklch(var(--foreground-100)); margin-bottom:0.5rem; }
.fft-sidebar-cta p { font-size:0.85rem; color:oklch(var(--foreground-400)); margin-bottom:1rem; }
.fft-sidebar-cta form { display:flex; flex-direction:column; gap:0.5rem; }
.fft-sidebar-cta input[type="email"] { background:oklch(var(--background-50)); border:1px solid oklch(var(--background-200)); border-radius:9999px; padding:0.625rem 1rem; color:oklch(var(--foreground-100)); font-size:0.85rem; text-align:center; outline:none; }
.fft-sidebar-cta input[type="email"]:focus { border-color:oklch(var(--primary-500)/.5); }
.fft-sidebar-cta button { cursor:pointer; }

.fft-news-section-title { font-family:var(--font-heading); font-size:1.5rem; font-weight:700; color:oklch(var(--foreground-100)); display:flex; align-items:center; gap:1rem; }
.fft-news-section-title::after { content:''; flex:1; height:1px; background:oklch(var(--background-200)); }

.fft-load-more { display:block; text-align:center; margin:2.5rem auto; padding:0.875rem 2.5rem; border-radius:9999px; border:1px solid oklch(var(--primary-500)/.3); background:transparent; color:oklch(var(--primary-400)); font-weight:600; font-size:0.9rem; text-decoration:none; transition:all 0.2s; }
.fft-load-more:hover { background:oklch(var(--primary-500)/.1); border-color:oklch(var(--primary-500)/.5); }

.fft-news-empty { text-align:center; padding:4rem 0; }
.fft-news-empty__icon { font-size:3rem; color:oklch(var(--foreground-600)); margin-bottom:1rem; }
.fft-news-empty p { color:oklch(var(--foreground-400)); }

/* ── News article — see templates/Fft/news_article.php (sidebar classes shared with news_index above) ── */
.fft-article-hero { position:relative; min-height:420px; display:flex; align-items:flex-end; overflow:hidden; }
.fft-article-hero__img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.fft-article-hero__overlay { position:absolute; inset:0; background:linear-gradient(to top, oklch(var(--background-950)/.95), oklch(var(--background-950)/.5), oklch(var(--background-950)/.3)); }
/* Wraps in .fft-container now (not its own max-width/padding); vertical padding stays. */
.fft-article-hero__content { position:relative; z-index:2; padding:3rem 0; }
.fft-article-hero__back { display:inline-flex; align-items:center; gap:0.4rem; font-size:0.85rem; color:oklch(var(--foreground-400)); text-decoration:none; margin-bottom:1.25rem; transition:color 0.15s; }
.fft-article-hero__back:hover { color:oklch(var(--primary-400)); }
.fft-article-hero__title { font-family:var(--font-heading); font-size:clamp(1.75rem,4vw,3rem); font-weight:700; color:oklch(var(--foreground-100)); line-height:1.2; max-width:800px; }
.fft-article-hero__hook { font-style:italic; color:oklch(var(--foreground-300)); font-size:1.05rem; margin-top:1rem; max-width:650px; line-height:1.6; }
/* Wraps in .fft-container now (not its own max-width/padding); columns come from .fft-sidebar-layout. */
.fft-article-layout { padding:2.5rem 0; gap:2.5rem; }
.fft-article-meta { display:flex; flex-wrap:wrap; gap:1.5rem; align-items:center; padding-bottom:1.5rem; border-bottom:1px solid oklch(var(--background-200)/.3); margin-bottom:2rem; }
.fft-article-author { display:flex; align-items:center; gap:0.75rem; }
.fft-article-author img { width:40px; height:40px; border-radius:50%; object-fit:cover; }
.fft-article-author__name { font-weight:600; font-size:0.9rem; color:oklch(var(--foreground-100)); }
.fft-article-author__role { font-size:0.8rem; color:oklch(var(--foreground-500)); }
.fft-article-meta__items { display:flex; flex-wrap:wrap; gap:1rem; font-size:0.8rem; color:oklch(var(--foreground-400)); }
.fft-article-share { margin-left:auto; display:flex; gap:0.75rem; }
.fft-article-share a { font-size:0.8rem; color:oklch(var(--foreground-400)); text-decoration:none; transition:color 0.15s; }
.fft-article-share a:hover { color:oklch(var(--primary-400)); }
.fft-article-body { line-height:1.8; color:oklch(var(--foreground-200)); font-size:1rem; }
.fft-article-body p { margin-bottom:1.25rem; }
.fft-article-cta-inline { background:linear-gradient(135deg, oklch(var(--primary-500)/.1), oklch(var(--background-100))); border:1px solid oklch(var(--primary-500)/.2); border-radius:0.5rem; padding:2rem; margin:2rem 0; text-align:center; }
.fft-article-cta-inline__eyebrow { font-size:0.7rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:oklch(var(--primary-400)); margin-bottom:0.5rem; }
.fft-article-cta-inline h3 { font-family:var(--font-heading); font-size:1.25rem; font-weight:700; color:oklch(var(--foreground-100)); margin-bottom:0.5rem; }
.fft-article-cta-inline p { font-size:0.9rem; color:oklch(var(--foreground-400)); margin-bottom:1rem; }
.fft-article-tags { display:flex; flex-wrap:wrap; gap:0.5rem; margin:2rem 0; padding-top:1.5rem; border-top:1px solid oklch(var(--background-200)/.3); }
.fft-article-tag { font-size:0.8rem; padding:0.3rem 0.75rem; border-radius:9999px; background:oklch(var(--background-200)); color:oklch(var(--foreground-400)); text-decoration:none; transition:all 0.2s; }
.fft-article-tag:hover { background:oklch(var(--primary-500)/.15); color:oklch(var(--primary-400)); }
.fft-article-author-card { display:flex; gap:1rem; background:oklch(var(--background-100)); border:1px solid oklch(var(--background-200)/.5); border-radius:0.5rem; padding:1.5rem; margin:2rem 0; }
.fft-article-author-card img { width:56px; height:56px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.fft-article-author-card__name { font-weight:600; font-size:0.95rem; color:oklch(var(--foreground-100)); }
.fft-article-author-card__role { font-size:0.8rem; color:oklch(var(--primary-400)); margin-bottom:0.5rem; }
.fft-article-author-card__bio { font-size:0.85rem; color:oklch(var(--foreground-400)); line-height:1.6; }
.fft-related-section { margin-top:3rem; }
.fft-related-title { font-family:var(--font-heading); font-size:1.5rem; font-weight:700; color:oklch(var(--foreground-100)); margin-bottom:1.5rem; display:flex; align-items:center; gap:1rem; }
.fft-related-title::after { content:''; flex:1; height:1px; background:oklch(var(--background-200)); }
.fft-related-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:1.5rem; }
.fft-related-card { display:flex; flex-direction:column; text-decoration:none; border-radius:0.5rem; overflow:hidden; background:oklch(var(--background-100)); border:1px solid oklch(var(--background-200)/.5); transition:all 0.3s; }
.fft-related-card:hover { border-color:oklch(var(--primary-400)/.4); box-shadow:0 0 20px oklch(var(--primary-500)/.08); }
.fft-related-card__img { width:100%; height:180px; object-fit:cover; }
.fft-related-card__body { padding:1.25rem; flex:1; display:flex; flex-direction:column; }
.fft-related-card__pill { display:inline-block; padding:0.2rem 0.6rem; border-radius:4px; font-size:0.7rem; font-weight:600; text-transform:uppercase; background:oklch(var(--primary-500)/.15); color:oklch(var(--primary-400)); margin-bottom:0.5rem; align-self:flex-start; }
.fft-related-card__title { font-family:var(--font-heading); font-size:1.05rem; font-weight:700; color:oklch(var(--foreground-100)); line-height:1.3; }
.fft-related-card__meta { display:flex; gap:1rem; font-size:0.75rem; color:oklch(var(--foreground-500)); margin-top:auto; padding-top:0.75rem; }

/* ── Booking success page — see templates/Fft/booking_success.php ── */
.fft-success-card { max-width:560px; margin:0 auto; text-align:center; }
.fft-success-icon { width:72px; height:72px; margin:0 auto 1.5rem; border-radius:50%; display:flex; align-items:center; justify-content:center; background:oklch(var(--primary-500)); color:oklch(var(--background-50)); }
.fft-success-title { font-size:2rem; margin-bottom:0.75rem; }
.fft-success-when { color:oklch(var(--primary-500)); font-weight:600; font-size:1.05rem; margin-bottom:0.75rem; }
.fft-success-note { color:oklch(var(--foreground-300)); line-height:1.7; margin-bottom:1.75rem; }

/* ── Contact page — see templates/Fft/contact.php ──
   NOTE: uses --fft-bg/--fft-text/--fft-primary/--fft-border/--fft-bg-elevated/--fft-text-muted,
   which are undefined anywhere (not part of this theme's oklch var system). Preserved as-is
   from the original inline styles — pre-existing bug, not introduced by this extraction. */
.fft-contact-section { padding-top:0; }
/* Columns/breakpoint come from .fft-sidebar-layout (markup); no section-specific override needed. */
.fft-contact-form-card { background:var(--fft-bg-elevated); }
.fft-contact-form-title { font-size:1.5rem; margin-bottom:1.5rem; }
.fft-contact-form { display:flex; flex-direction:column; gap:1.25rem; }
/* Uses .fft-form-row (markup) for the 2-up field row. */
.fft-field-label { display:block; font-size:0.8rem; color:var(--fft-text-muted); margin-bottom:0.4rem; }
.fft-field-input { width:100%; background:var(--fft-bg); border:1px solid var(--fft-border); border-radius:6px; padding:0.75rem 1rem; color:var(--fft-text); font-size:0.9rem; }
.fft-field-input--textarea { resize:none; }
.fft-contact-submit { width:100%; text-align:center; border-radius:50px; margin-top:0.5rem; }
/* .fft-sidebar-sticky (markup) handles position/top/un-stick-on-stack. */
.fft-contact-sidebar { display:flex; flex-direction:column; gap:1.5rem; }
.fft-contact-info-row { display:flex; align-items:center; gap:1rem; margin-bottom:1rem; }
.fft-contact-info-row:last-child { margin-bottom:0; }
.fft-contact-icon { width:40px; height:40px; background:rgba(184,147,14,0.1); border-radius:8px; display:flex; align-items:center; justify-content:center; }
.fft-contact-icon span { color:var(--fft-primary); font-size:1.2rem; }
.fft-contact-info-label { display:block; font-size:0.75rem; color:var(--fft-text-muted); text-transform:uppercase; letter-spacing:0.05em; }
.fft-contact-info-value { color:var(--fft-text); text-decoration:none; font-size:0.9rem; }
.fft-office-hours-title { font-size:1rem; margin-bottom:1rem; color:var(--fft-primary); }
.fft-office-hours-list { display:flex; flex-direction:column; gap:0.5rem; font-size:0.85rem; }
.fft-office-hours-row { display:flex; justify-content:space-between; }
.fft-office-hours-row .fft-field-label,
.fft-office-hours-row span:first-child { color:var(--fft-text-muted); }
.fft-office-hours-row span:last-child { color:var(--fft-text); }
.fft-social-card { text-align:center; }
.fft-social-card-title { font-size:1rem; margin-bottom:1rem; }
.fft-social-links { display:flex; justify-content:center; gap:1rem; }
.fft-social-icon { width:40px; height:40px; background:rgba(184,147,14,0.1); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--fft-primary); text-decoration:none; font-size:1.1rem; }

/* ── Workshops page — see templates/Fft/workshops.php ── */
.fft-workshops-section { padding-top:0; }
/* Columns/breakpoint come from .fft-sidebar-layout (markup); no section-specific override needed. */
.fft-workshops-list { display:flex; flex-direction:column; gap:1.5rem; }
.fft-workshop-card { padding:0; overflow:hidden; }
.fft-workshop-card__inner { display:grid; grid-template-columns:200px 1fr; }
@media (max-width:520px) { .fft-workshop-card__inner { grid-template-columns:1fr; } }
.fft-workshop-card__img { width:100%; height:100%; object-fit:cover; }
@media (max-width:520px) { .fft-workshop-card__img { height:180px; } }
.fft-workshop-card__body { padding:2rem; }
.fft-workshop-card__meta { display:flex; gap:0.5rem; align-items:center; margin-bottom:0.75rem; }
.fft-workshop-card__meta-item { color:oklch(var(--primary-500)); font-size:0.75rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; }
.fft-workshop-card__sep { color:oklch(var(--foreground-400)); }
.fft-workshop-card__title { font-size:1.5rem; margin-bottom:0.5rem; }
.fft-workshop-card__desc { color:oklch(var(--foreground-300)); font-size:0.9rem; line-height:1.7; margin-bottom:1rem; }
.fft-workshop-card__stats { display:flex; gap:1.5rem; font-size:0.85rem; color:oklch(var(--foreground-400)); margin-bottom:1rem; }
.fft-workshop-card__progress-row { display:flex; align-items:center; gap:0.75rem; }
.fft-workshop-card__progress-track { width:120px; height:6px; background:oklch(var(--background-200)); border-radius:3px; overflow:hidden; }
.fft-workshop-card__progress-fill { height:100%; background:oklch(var(--primary-500)); border-radius:3px; }
.fft-workshop-card__progress-count { font-size:0.75rem; color:oklch(var(--foreground-400)); }
.fft-workshop-card__spots-left { font-size:0.75rem; color:oklch(var(--primary-500)); font-weight:600; margin-left:auto; }

/* .fft-sidebar-sticky (markup) handles position/top/un-stick-on-stack. */
.fft-booking-card { background:oklch(var(--background-200)); }
.fft-booking-card__title { font-size:1.5rem; margin-bottom:0.5rem; }
.fft-booking-card__sub { color:oklch(var(--foreground-400)); font-size:0.85rem; margin-bottom:1.5rem; }
.fft-booking-form { display:flex; flex-direction:column; gap:1rem; }
/* Uses .fft-form-row (markup) for the 2-up field row. */
.fft-booking-field-label { display:block; font-size:0.8rem; color:oklch(var(--foreground-400)); margin-bottom:0.4rem; }
.fft-booking-field-input { width:100%; background:oklch(var(--background-50)); border:1px solid oklch(var(--background-200)); border-radius:6px; padding:0.75rem 1rem; color:oklch(var(--foreground-100)); font-size:0.9rem; }
.fft-booking-submit { width:100%; justify-content:center; margin-top:0.5rem; }

/* ── News shared: pills, newsletter form, sidebar layout — see news_index.php + news_article.php ── */
.fft-news-pill--accent { background:oklch(var(--accent-500)/.2); color:oklch(var(--accent-400)); }
.fft-news-section-title--tight { margin-bottom:0; }
.fft-news-count { font-size:0.85rem; color:oklch(var(--foreground-500)); margin-top:-0.5rem; }
.fft-news-empty__text { font-size:1.1rem; font-weight:600; color:oklch(var(--foreground-200)); margin-bottom:0.5rem; }
.fft-load-more-count { text-align:center; font-size:0.8rem; color:oklch(var(--foreground-500)); }
.fft-newsletter-submit { width:100%; justify-content:center; font-size:0.85rem; padding:0.625rem 1.5rem; }
.fft-related-grid--narrow { max-width:400px; }
/* .fft-sidebar-sticky (markup) handles position/top/un-stick-on-stack. */
.fft-article-sidebar { display:flex; flex-direction:column; gap:1.5rem; align-self:start; }
.fft-article-pills-row { display:flex; gap:0.5rem; margin-bottom:1rem; }
.fft-article-hook { font-size:1.1rem; font-weight:500; color:oklch(var(--foreground-200)); line-height:1.7; margin-bottom:2rem; padding-left:1rem; border-left:3px solid oklch(var(--primary-500)); }

/* ── Get Answers extras ── */
.ga-card--empty { grid-template-columns:1fr; text-align:center; }
.ga-grid--days { margin-top:.35rem; }

/* ── Home page — see templates/Fft/home.php ── */
.fft-ml-sm { margin-left:0.5rem; }

/* Hero */
.fft-home-hero { position:relative; min-height:600px; overflow:hidden; display:flex; align-items:center; }
.fft-home-hero__bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.fft-home-hero__scrim-x { position:absolute; inset:0; background:linear-gradient(to right,oklch(var(--background-950)/.9),oklch(var(--background-950)/.7),oklch(var(--background-950)/.4)); }
.fft-home-hero__scrim-y { position:absolute; inset:0; background:linear-gradient(to top,oklch(var(--background-950)/.6),transparent,oklch(var(--background-950)/.3)); }
/* Horizontal alignment now comes from nesting .fft-container inside content — vertical-only padding here. */
.fft-home-hero__content { position:relative; z-index:10; width:100%; padding:6rem 0 5rem; }
.fft-home-hero__inner { max-width:56rem; }
.fft-home-hero__title-line { display:block; font-size:clamp(2.5rem,5vw,4.5rem); font-weight:700; color:oklch(var(--foreground-100)); line-height:1.1; letter-spacing:-0.025em; }
.fft-home-hero__title-line--gap { margin-top:0.25rem; }
.fft-home-hero__title-gradient { background:linear-gradient(to right,oklch(var(--primary-400)),oklch(var(--primary-500)),oklch(var(--accent-500))); -webkit-background-clip:text; background-clip:text; color:transparent; }
.fft-home-hero__sub { font-size:1.125rem; color:oklch(var(--foreground-300)); max-width:36rem; margin-top:2rem; line-height:1.625; }
.fft-home-hero__cta-wrap { margin-top:2.5rem; }
.fft-home-hero__cta { padding:1rem 2rem; font-size:1rem; }

/* Stats */
/* Stats — grid columns/breakpoints come from .fft-grid-4 (markup); gap matches its default. */
.fft-stats-section { position:relative; z-index:10; margin-top:-20px; }
.fft-stat-card { text-align:center; border-color:oklch(var(--primary-400)/.4); padding:2rem; }
.fft-stat-card__number-row { display:flex; align-items:baseline; justify-content:center; gap:0.25rem; }
.fft-stat-card__number { font-size:clamp(2rem,3vw,3rem); font-family:var(--font-heading); font-weight:700; color:oklch(var(--primary-500)); }
.fft-stat-card__suffix { font-size:1.5rem; font-family:var(--font-heading); font-weight:700; color:oklch(var(--primary-500)); }
.fft-stat-card__label { color:oklch(var(--foreground-300)); margin-top:0.5rem; font-size:0.9rem; font-weight:500; }

/* Services — wraps in .fft-container (not a bespoke wrap div); grid is .fft-grid-3. */
.fft-services-section { padding:5rem 0 6rem; }
.fft-services-title { font-size:clamp(1.875rem,3vw,3rem); font-weight:700; color:oklch(var(--foreground-100)); margin-bottom:3rem; }
.fft-services-title__icon { color:oklch(var(--primary-500)); margin-left:0.5rem; }
.fft-service-card { position:relative; overflow:hidden; border-radius:0.5rem; cursor:pointer; }
.fft-service-card__frame { position:relative; aspect-ratio:3/4; overflow:hidden; }
.fft-service-card__img { width:100%; height:100%; object-fit:cover; transition:transform 0.7s; }
.fft-service-card__frame:hover .fft-service-card__img { transform:scale(1.1); }
.fft-service-card__scrim { position:absolute; inset:0; background:linear-gradient(to top,oklch(var(--background-950)/.9),oklch(var(--background-950)/.3),transparent); }
.fft-service-card__content { position:absolute; bottom:0; left:0; right:0; padding:2rem; }
.fft-service-card__title { font-size:1.5rem; font-weight:700; color:oklch(var(--foreground-100)); margin-bottom:0.5rem; }
.fft-service-card__desc { font-size:0.9rem; color:oklch(var(--foreground-300)); line-height:1.625; }

/* Testimonials — wraps in .fft-container; grid is .fft-grid-3 (gap overridden to 2rem here). */
.fft-testimonials-section { padding:5rem 0 6rem; background:oklch(var(--foreground-50)); }
.fft-testimonials-title { text-align:center; font-size:clamp(1.875rem,3vw,3rem); font-weight:700; color:oklch(var(--background-950)); margin-bottom:3rem; }
.fft-testimonials-title__paren { color:oklch(var(--secondary-500)); }
.fft-testimonials-grid { gap:2rem; }
.fft-testimonial-card { background:oklch(var(--background-50)); border:1px solid oklch(var(--background-200)/.7); border-radius:0.5rem; padding:1.75rem; display:flex; flex-direction:column; transition:all 0.5s; cursor:pointer; }
.fft-testimonial-card:hover { transform:translateY(-4px); border-color:oklch(var(--primary-400)/.4); }
.fft-testimonial-card__rating-wrap { margin-bottom:1.25rem; }
.fft-testimonial-card__rating { display:inline-flex; align-items:center; gap:0.375rem; background:oklch(var(--background-950)); padding:0.375rem 0.75rem; border-radius:9999px; }
.fft-testimonial-card__star { color:oklch(var(--primary-500)); font-size:0.75rem; }
.fft-testimonial-card__score { color:oklch(var(--foreground-100)); font-size:0.75rem; font-weight:600; }
.fft-testimonial-card__quote-wrap { position:relative; flex:1; }
.fft-testimonial-card__quote-mark { position:absolute; left:-4px; top:-16px; font-size:3rem; font-family:var(--font-heading); line-height:1; }
.fft-testimonial-card__quote { font-size:0.9rem; line-height:1.625; padding-left:1rem; }
.fft-testimonial-card__footer { display:flex; align-items:center; gap:0.75rem; margin-top:1.5rem; padding-top:1.25rem; border-top:1px solid oklch(var(--background-200)/.5); }
.fft-testimonial-card__avatar { width:2.5rem; height:2.5rem; border-radius:9999px; object-fit:cover; }
.fft-testimonial-card__name { font-size:0.875rem; font-weight:600; color:oklch(var(--background-950)); }
.fft-testimonial-card__role { font-size:0.75rem;; }

/* Workshop CTA split — deliberately edge-to-edge (.fft-full-container), not boxed;
   stacks to a single column under 768px instead of squeezing two 50% panels. */
.fft-cta-section { position:relative; overflow:hidden; }
.fft-cta-split { display:flex; min-height:600px; }
@media (max-width:768px) { .fft-cta-split { flex-direction:column; min-height:auto; } }
.fft-cta-media { position:relative; width:50%; min-height:100%; }
@media (max-width:768px) { .fft-cta-media { width:100%; min-height:360px; } }
.fft-cta-media__img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.fft-cta-media__scrim-x { position:absolute; inset:0; background:linear-gradient(to right,oklch(var(--background-950)/.4),transparent); }
.fft-cta-media__scrim-y { position:absolute; inset:0; background:linear-gradient(to top,oklch(var(--background-950)/.8),transparent,oklch(var(--background-950)/.3)); }
.fft-cta-media__eyebrow-wrap { position:absolute; top:2rem; left:2rem; }
.fft-cta-media__eyebrow { color:oklch(var(--foreground-300)); font-size:0.75rem; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; }
.fft-cta-media__title-wrap { position:absolute; bottom:4rem; left:2rem; }
.fft-cta-media__title { font-size:clamp(1.5rem,3vw,3rem); font-weight:700; color:oklch(var(--foreground-100)); line-height:1.2; }
.fft-cta-media__title-line { display:block; }
.fft-cta-media__title-line--accent { color:oklch(var(--primary-400)); }
.fft-cta-panel { width:50%; background:oklch(var(--foreground-50)); display:flex; align-items:center; }
@media (max-width:768px) { .fft-cta-panel { width:100%; } }
.fft-cta-panel__inner { padding:4rem; max-width:32rem; }
@media (max-width:768px) { .fft-cta-panel__inner { padding:2.5rem 1.25rem; } }
.fft-cta-panel__title { font-size:clamp(1.875rem,3vw,3rem); font-weight:700; color:oklch(var(--background-950)); line-height:1.2; }
.fft-cta-panel__sub { font-size:1.125rem; color:oklch(var(--background-400)); margin-top:2rem; line-height:1.625; }
.fft-cta-panel__cta-wrap { margin-top:2.5rem; }
.fft-cta-panel__btn { display:inline-flex; align-items:center; background:oklch(var(--background-950)); color:oklch(var(--foreground-100)); padding:1rem 2rem; border-radius:9999px; text-decoration:none; font-weight:600; font-size:0.9rem; transition:all 0.3s; }
.fft-cta-panel__btn:hover { background:oklch(var(--background-800)); transform:scale(1.05); }