/* ============================================================
   Teksmobile design system v3 — src/assets/v2.css
   Contract: src/COMPONENTS.md (§18 = imagery). Brief: DESIGN-V3.md.
   Every class is prefixed `t-` (or `svg-`) so this file can be loaded next
   to the legacy styles.css (it loads AFTER it, so its :root tokens win there too).
   Declarations are written compactly (one rule per line) to stay near 50 KB.
   Order: tokens → base → chrome → layout/type → heroes → components →
   imagery → tools → utilities → motion → print → legacy compensation.
   v3: Inter / Inter Tight, navy bands, flat cards, no gradients or glows.
   ============================================================ */

/* ---------- 1. TOKENS ---------- */
:root, [data-theme="light"] {
  color-scheme:light;
  --brand:#FF6B1A;--brand-dark:#D9480F;--brand-light:#FFE4D1;
  --brand-soft:rgba(255,107,26,.08);--brand-glow:rgba(255,107,26,.22);--gold:#D97706;
  --btn-bg:#E8590C;--btn-bg-hover:#D9480F;
  --navy:#0B1F3A;--navy-deep:#081833;--navy-ink:#0B1F3A;--navy-soft:rgba(11,31,58,.07);
  --bg:#FFFFFF;--bg2:#F6F7F9;--bg3:#EEF0F3;
  --bg-nav:rgba(255,255,255,.88);--bg-overlay:rgba(255,255,255,.6);
  --text:#1F2937;--text-strong:#0B1220;--muted:#5B6478;--muted-light:#8A93A3;
  --border:#E5E7EB;--border-soft:#EEF0F3;--border-strong:#CBD2DC;
  --shadow-sm:0 1px 2px rgba(16,24,40,.06);--shadow-md:0 4px 14px rgba(16,24,40,.08);
  --shadow-lg:0 16px 40px rgba(16,24,40,.12);--shadow-brand:none;
  --radius:12px;--radius-lg:16px;--radius-sm:8px;--grid-line:transparent;
  --accent-2:#0E8F8E;--accent-3:#6D28D9;--success:#15803D;--warn:#B45309;--danger:#B91C1C;
  --accent-2-soft:rgba(14,143,142,.10);--accent-3-soft:rgba(109,40,217,.08);
  --success-soft:rgba(21,128,61,.10);--warn-soft:rgba(180,83,9,.10);--danger-soft:rgba(185,28,28,.08);
  --font-head:'Inter Tight','Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --max:1200px;--max-narrow:760px;--gutter:16px;--nav-h:64px;
  --dark-surface:var(--navy);--on-dark:#E8ECF3;--on-dark-muted:rgba(232,236,243,.72);
  --svg-line:rgba(15,23,42,.26);--svg-surface:#FFFFFF;--svg-surface-2:#E9ECF1;
  --band-edge:transparent;--ring:0 0 0 3px rgba(11,31,58,.14);--numeral-bg:#0B1F3A;--numeral-ink:#FFFFFF;
}
[data-theme="dark"] {
  color-scheme:dark;
  --brand:#FF8A47;--brand-dark:#FFA06B;--brand-light:#3A1F0E;
  --brand-soft:rgba(255,138,71,.12);--brand-glow:rgba(255,138,71,.32);--gold:#F5B027;
  --btn-bg:#E8590C;--btn-bg-hover:#F56A1E;
  --navy:#0E1626;--navy-deep:#0A1120;--navy-ink:#DCE3EE;--navy-soft:rgba(220,227,238,.10);
  --bg:#0B0D12;--bg2:#12151C;--bg3:#1A1E28;
  --bg-nav:rgba(11,13,18,.88);--bg-overlay:rgba(11,13,18,.6);
  --text:#DDE2EA;--text-strong:#FFFFFF;--muted:#98A2B3;--muted-light:#6B7482;
  --border:rgba(255,255,255,.10);--border-soft:rgba(255,255,255,.06);--border-strong:rgba(255,255,255,.22);
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);--shadow-md:0 4px 14px rgba(0,0,0,.45);--shadow-lg:0 16px 40px rgba(0,0,0,.55);
  --accent-2:#2DD4BF;--accent-3:#A78BFA;--success:#4ADE80;--warn:#FBBF24;--danger:#F87171;
  --accent-2-soft:rgba(45,212,191,.12);--accent-3-soft:rgba(167,139,250,.12);
  --success-soft:rgba(74,222,128,.12);--warn-soft:rgba(251,191,36,.12);--danger-soft:rgba(248,113,113,.12);
  --svg-line:rgba(255,255,255,.22);--svg-surface:#1A1F2B;--svg-surface-2:#262C3A;
  --band-edge:rgba(255,255,255,.08);--ring:0 0 0 3px rgba(220,227,238,.18);--numeral-bg:#DCE3EE;--numeral-ink:#0B0D12;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme:dark;
    --brand:#FF8A47;--brand-dark:#FFA06B;--brand-light:#3A1F0E;
    --brand-soft:rgba(255,138,71,.12);--brand-glow:rgba(255,138,71,.32);--gold:#F5B027;
    --btn-bg:#E8590C;--btn-bg-hover:#F56A1E;
    --navy:#0E1626;--navy-deep:#0A1120;--navy-ink:#DCE3EE;--navy-soft:rgba(220,227,238,.10);
    --bg:#0B0D12;--bg2:#12151C;--bg3:#1A1E28;
    --bg-nav:rgba(11,13,18,.88);--bg-overlay:rgba(11,13,18,.6);
    --text:#DDE2EA;--text-strong:#FFFFFF;--muted:#98A2B3;--muted-light:#6B7482;
    --border:rgba(255,255,255,.10);--border-soft:rgba(255,255,255,.06);--border-strong:rgba(255,255,255,.22);
    --shadow-sm:0 1px 2px rgba(0,0,0,.4);--shadow-md:0 4px 14px rgba(0,0,0,.45);--shadow-lg:0 16px 40px rgba(0,0,0,.55);
    --accent-2:#2DD4BF;--accent-3:#A78BFA;--success:#4ADE80;--warn:#FBBF24;--danger:#F87171;
    --accent-2-soft:rgba(45,212,191,.12);--accent-3-soft:rgba(167,139,250,.12);
    --success-soft:rgba(74,222,128,.12);--warn-soft:rgba(251,191,36,.12);--danger-soft:rgba(248,113,113,.12);
    --svg-line:rgba(255,255,255,.22);--svg-surface:#1A1F2B;--svg-surface-2:#262C3A;
    --band-edge:rgba(255,255,255,.08);--ring:0 0 0 3px rgba(220,227,238,.18);--numeral-bg:#DCE3EE;--numeral-ink:#0B0D12;
  }
}
@media (min-width: 768px) {:root {--gutter:24px;}}
@media (min-width: 1024px) {:root {--nav-h:72px;}}
/* Navy bands remap the surface tokens so every component inside (cards, stats, eyebrows, buttons, SVG
   diagrams, forms) adapts without per-element overrides. Applies in both themes. */
.t-section--dark, .t-cta, .t-media-band, .t-hero--band, .t-card--dark, .t-footer {
  --text:#E8ECF3;--text-strong:#FFFFFF;--muted:rgba(232,236,243,.72);--muted-light:rgba(232,236,243,.5);
  --bg:rgba(255,255,255,.06);--bg2:rgba(255,255,255,.06);--bg3:rgba(255,255,255,.11);
  --border:rgba(255,255,255,.16);--border-soft:rgba(255,255,255,.09);--border-strong:rgba(255,255,255,.32);
  --navy-ink:#FFFFFF;--navy-soft:rgba(255,255,255,.12);--brand:#FF8A47;--brand-dark:#FFA06B;--brand-soft:rgba(255,138,71,.14);
  --gold:#F5B027;--warn:#FBBF24;--success:#4ADE80;--danger:#F87171;--accent-2:#2DD4BF;--accent-3:#A78BFA;
  --svg-line:rgba(255,255,255,.3);--svg-surface:rgba(255,255,255,.08);--svg-surface-2:rgba(255,255,255,.15);
  --shadow-sm:none;--shadow-md:none;--shadow-lg:none;--ring:0 0 0 3px rgba(255,255,255,.2);--numeral-bg:#FFFFFF;--numeral-ink:#0B1F3A;
  background:var(--navy);color:var(--text);
}
.t-media-band--light {--text:#1F2937;--text-strong:#0B1220;--muted:#5B6478;--muted-light:#8A93A3;--bg:#FFFFFF;--bg2:#F6F7F9;--bg3:#EEF0F3;--border:#E5E7EB;--border-soft:#EEF0F3;--border-strong:#CBD2DC;--navy-ink:#0B1F3A;--navy-soft:rgba(11,31,58,.07);--brand:#FF6B1A;--brand-dark:#D9480F;--brand-soft:rgba(255,107,26,.08);--svg-line:rgba(15,23,42,.26);--svg-surface:#FFFFFF;--svg-surface-2:#E9ECF1;--shadow-sm:0 1px 2px rgba(16,24,40,.06);--shadow-md:0 4px 14px rgba(16,24,40,.08);--ring:0 0 0 3px rgba(11,31,58,.14);--numeral-bg:#0B1F3A;--numeral-ink:#FFFFFF;background:#FFFFFF;}

/* ---------- 2. BASE (minimal: legacy pages load this file too) ---------- */
*, *::before, *::after { box-sizing: border-box; }
html {scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 1rem);-webkit-text-size-adjust:100%;}
body {margin:0;font-family:var(--font-body);font-size:1rem;background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
img {max-width:100%;height:auto;}
svg {max-width:100%;}
:focus-visible {outline:2px solid var(--brand);outline-offset:2px;}
::selection {background:var(--navy);color:#fff;}
.t-skip {position:absolute;left:var(--gutter);top:-100px;z-index:1000;padding:.6rem 1rem;background:var(--navy);color:#fff;font:600 .9rem var(--font-body);border-radius:var(--radius-sm);text-decoration:none;}
.t-skip:focus {top:12px;}
body.t-nav-open {overflow:hidden;}

/* ---------- 3. HEADER + NAV + MEGA MENU ---------- */
.t-header {position:sticky;top:0;z-index:100;background:var(--bg-nav);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);}
.t-nav__bar {position:relative;display:flex;align-items:center;gap:.75rem;min-height:var(--nav-h);}
.t-nav__logo {display:flex;align-items:center;line-height:0;margin-right:auto;text-decoration:none;}
.t-nav__logo .logo-img {height:38px;width:auto;display:block;}
.t-nav__burger {display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--border);border-radius:var(--radius-sm);background:transparent;color:var(--text);cursor:pointer;padding:0;}
.t-nav__burger[aria-expanded="true"] {border-color:var(--navy-ink);color:var(--navy-ink);}
.t-nav__list {list-style:none;margin:0;padding:0;display:flex;}
.t-nav__item {margin:0;}
.t-nav__link {display:inline-flex;align-items:center;gap:.25rem;padding:.55rem .5rem;background:none;border:0;border-radius:var(--radius-sm);color:var(--text);font:500 .9rem var(--font-body);letter-spacing:0;text-decoration:none;cursor:pointer;white-space:nowrap;position:relative;}
.t-nav__link:hover {color:var(--text-strong);background:var(--bg2);}
.t-nav__chev {flex:0 0 auto;transition:transform .2s;}
.t-nav__link--menu[aria-expanded="true"] .t-nav__chev {transform:rotate(180deg);}
.t-nav__actions {display:flex;align-items:center;gap:.6rem;}
.t-theme, .theme-toggle.t-theme {background:transparent;border:1px solid var(--border);width:38px;height:38px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text);padding:0;transition:border-color .2s,color .2s;}
.t-theme:hover {border-color:var(--border-strong);color:var(--text-strong);transform:none;}
.t-theme svg {width:18px;height:18px;}
.t-theme .icon-sun, [data-theme="dark"] .t-theme .icon-moon {display:none;}
[data-theme="dark"] .t-theme .icon-sun {display:block;}
/* mega panel */
.t-mega__inner {display:grid;gap:1.25rem;}
.t-mega__col {max-width:340px;}
.t-mega__title {margin:0 0 .5rem;font:600 .72rem var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.t-mega__link {display:block;padding:.45rem .6rem;margin:0 -.6rem;border-radius:var(--radius-sm);color:var(--text);text-decoration:none;line-height:1.35;}
.t-mega__link strong {display:block;font:600 .92rem var(--font-body);color:var(--text-strong);}
.t-mega__link span {display:block;font-size:.8rem;color:var(--muted);margin-top:.1rem;}
.t-mega__link:hover {background:var(--bg2);}
.t-mega__link:hover strong {color:var(--brand);}
.t-mega__all {display:inline-flex;gap:.35rem;margin-top:.75rem;font:600 .85rem var(--font-body);color:var(--brand);text-decoration:none;}
/* active section underline (sections without a nav item map to their parent menu) */
body:is([data-section="ai"], [data-section="ai-security"], [data-section="ai-knowledge"], [data-section="vector-search"]) .t-nav__item[data-section="ai"] > .t-nav__link,
body[data-section="salesforce"] .t-nav__item[data-section="salesforce"] > .t-nav__link,
body[data-section="events"] .t-nav__item[data-section="events"] > .t-nav__link,
body[data-section="seo"] .t-nav__item[data-section="seo"] > .t-nav__link,
body:is([data-section="solutions"], [data-section="industries"], [data-section="tools"]) .t-nav__item[data-section="solutions"] > .t-nav__link,
body:is([data-section="insights"], [data-section="glossary"], [data-section="case-studies"]) .t-nav__item[data-section="insights"] > .t-nav__link,
body:is([data-section="company"], [data-section="custom-software"]) .t-nav__item[data-section="company"] > .t-nav__link {box-shadow:inset 0 -2px 0 var(--brand);border-radius:var(--radius-sm) var(--radius-sm) 0 0;color:var(--text-strong);}
/* mobile (<1024): slide-down full-height panel with accordions */
@media (max-width: 1023.98px) {
  /* absolute under the sticky bar (not fixed: the header's backdrop-filter would become its containing block) */
  .t-nav__menu {position:absolute;top:100%;left:0;right:0;height:calc(100vh - var(--nav-h));height:calc(100dvh - var(--nav-h));z-index:99;overflow-y:auto;background:var(--bg);padding:.5rem var(--gutter) 2rem;visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity .2s,transform .2s,visibility 0s .2s;}
  .t-nav__burger[aria-expanded="true"] + .t-nav__menu {visibility:visible;opacity:1;transform:none;transition-delay:0s;}
  .t-nav__list {flex-direction:column;}
  .t-nav__item {border-bottom:1px solid var(--border-soft);}
  .t-nav__link {width:100%;justify-content:space-between;padding:.9rem 0;font-size:1.02rem;border-radius:0;}
  .t-nav__link:hover {background:none;}
  .t-mega {display:none;padding:0 0 1rem;}
  .t-nav__link--menu[aria-expanded="true"] + .t-mega {display:block;}
  .t-mega__inner {gap:1rem;}
  .t-mega__link {margin:0;padding:.4rem 0;}
  .t-nav__actions {padding:1.25rem 0 0;justify-content:space-between;}
  .t-nav__cta {flex:1;}
}
/* desktop (≥1024): inline bar, hover/focus/click mega menus */
@media (min-width: 1024px) {
  .t-nav__burger {display:none;}
  .t-nav__menu {display:flex;align-items:center;gap:1rem;flex:1 1 auto;justify-content:space-between;}
  .t-nav__list {gap:.1rem;flex-wrap:nowrap;}
  .t-nav__link {font-size:clamp(.82rem,.55rem + .35vw,.92rem);padding:.55rem clamp(.3rem,.5vw,.6rem);}
  .t-mega {position:absolute;top:100%;left:0;right:0;z-index:101;padding:1.5rem 1.75rem 1.5rem;background:var(--bg);border:1px solid var(--border);border-top:0;border-radius:0 0 var(--radius) var(--radius);box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .18s,transform .18s,visibility 0s .18s;}
  .t-nav__item--has-menu:not(.is-dismissed):hover > .t-mega, .t-nav__item--has-menu:not(.is-dismissed):focus-within > .t-mega, .t-nav__link--menu[aria-expanded="true"] + .t-mega {opacity:1;visibility:visible;transform:none;transition-delay:.06s,.06s,0s;}
  .t-mega__inner {grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1.5rem 2rem;}
  .t-mega__all {margin-top:1.25rem;}
}

/* ---------- 4. BREADCRUMBS ---------- */
.t-crumbs {font-size:.82rem;color:var(--muted);border-bottom:1px solid var(--border-soft);}
.t-crumbs ol {list-style:none;margin:0;padding:.6rem 0;display:flex;flex-wrap:wrap;gap:.25rem .5rem;}
.t-crumbs li + li::before {content:"/";margin-right:.5rem;color:var(--muted-light);}
.t-crumbs a {color:var(--muted);text-decoration:none;}
.t-crumbs a:hover {color:var(--text-strong);}
.t-crumbs [aria-current] {color:var(--text);font-weight:500;}

/* ---------- 5. FOOTER (navy; always the on-dark logo) ---------- */
.t-footer {background:var(--navy-deep);border-top:1px solid var(--band-edge);padding:3.5rem 0 1.5rem;font-size:.88rem;}
.t-footer p {margin:0;}
.t-footer .logo-img.light-only {display:none;}
.t-footer .logo-img.dark-only {display:block;}
.t-footer__grid {display:grid;gap:2rem 1.5rem;grid-template-columns:1fr;margin-bottom:2.5rem;}
.t-footer__brand {display:flex;flex-direction:column;gap:.9rem;align-items:flex-start;}
.t-footer__logo {line-height:0;}
.t-footer__logo .logo-img {height:44px;width:auto;display:block;}
.t-footer__desc {color:var(--muted);line-height:1.7;max-width:36ch;}
.t-footer__mail {color:var(--text-strong);font-weight:600;text-decoration:none;}
.t-footer__mail:hover {color:var(--brand);}
.t-footer__notice {background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.9rem 1.1rem;color:var(--muted);font-size:.78rem;line-height:1.6;max-width:46ch;}
.t-footer__notice strong {color:var(--warn);display:block;margin-bottom:.2rem;}
.t-footer__title {margin:0 0 .9rem;font:600 .74rem var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--text-strong);}
.t-footer__col a {display:block;color:var(--muted);text-decoration:none;padding:.22rem 0;line-height:1.4;}
.t-footer__col a:hover {color:var(--text-strong);}
.t-footer__bottom {border-top:1px solid var(--border-soft);padding-top:1.25rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem 1.5rem;color:var(--muted);font-size:.8rem;}
.t-footer__bottom a {color:var(--muted);text-decoration:none;}
.t-footer__bottom a:hover {color:var(--text-strong);}
@media (min-width: 560px) {.t-footer__grid {grid-template-columns:repeat(2,1fr);} .t-footer__brand {grid-column:1 / -1;}}
@media (min-width: 900px) {.t-footer__grid {grid-template-columns:repeat(3,1fr);}}
@media (min-width: 1120px) {.t-footer__grid {grid-template-columns:1.6fr repeat(5,1fr);} .t-footer__brand {grid-column:auto;}}

/* ---------- 6. LAYOUT: sections, containers, grids, split, stack ---------- */
.t-container {width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);}
.t-container--narrow {max-width:calc(var(--max-narrow) + 2 * var(--gutter));}
.t-section {padding:clamp(4rem,2.5rem + 4vw,6rem) 0;}
.t-section--tight {padding:clamp(2rem,1.5rem + 2vw,3rem) 0;}
.t-section--alt {background:var(--bg2);border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-soft);}
.t-section--dark {border-top:1px solid var(--band-edge);border-bottom:1px solid var(--band-edge);}
.t-grid {display:grid;gap:1.25rem;grid-template-columns:1fr;}
.t-grid > * {min-width:0;}
.t-split {display:grid;gap:2rem;align-items:center;}
.t-split > * {min-width:0;}
.t-stack {display:grid;gap:1.25rem;}
@media (min-width: 640px) {.t-grid--2,.t-grid--3,.t-grid--4 {grid-template-columns:repeat(2,1fr);}}
@media (min-width: 900px) {.t-split {grid-template-columns:1fr 1fr;gap:3rem;} .t-split--reverse .t-split__visual {order:-1;}}
@media (min-width: 1024px) {.t-grid--3 {grid-template-columns:repeat(3,1fr);} .t-grid--4 {grid-template-columns:repeat(4,1fr);} .t-grid {gap:1.5rem;} .t-split {gap:4rem;}}

/* ---------- 7. TYPOGRAPHY (scoped to .t-page + components; legacy pages get §22) ---------- */
.t-page {font-size:1rem;}
.t-page :where(h1, h2, h3, h4, h5, h6, p, ul, ol, figure, blockquote, pre, hr, fieldset) {margin:0;}
.t-page :where(ul, ol) {padding-left:1.25rem;}
.t-page :where(h1, h2, h3, h4, h5, h6) {font-family:var(--font-head);font-weight:600;color:var(--text-strong);line-height:1.25;letter-spacing:-.01em;}
.t-page a:not([class]) {color:var(--brand-dark);text-decoration-thickness:1px;text-underline-offset:2px;}
.t-page a:not([class]):hover {color:var(--brand);}
.t-h1, .t-hero__title {font:700 clamp(2.25rem,1.6rem + 2.6vw,3.5rem) / 1.1 var(--font-head);letter-spacing:-.025em;color:var(--text-strong);text-wrap:balance;}
.t-h2 {font:700 clamp(1.75rem,1.3rem + 1.4vw,2.25rem) / 1.15 var(--font-head);letter-spacing:-.02em;color:var(--text-strong);text-wrap:balance;max-width:30ch;}
.t-h3 {font:600 1.25rem / 1.3 var(--font-head);letter-spacing:-.01em;color:var(--text-strong);}
.t-lead {font-size:clamp(1.05rem,1rem + .3vw,1.2rem);line-height:1.6;color:var(--muted);max-width:60ch;}
.t-eyebrow, .t-hero__eyebrow {display:inline-block;font:600 .75rem / 1.4 var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.t-center .t-h2 {margin-inline:auto;}
/* vertical rhythm for plain siblings inside text containers (zero specificity: any class wins) */
.t-page :where(.t-container:not(.t-hero__inner), .t-split__text, .t-hero__copy, .t-tabpanel, .t-faq__body, .t-callout, .t-timeline__item, .t-step, .t-feature > div, .t-tool__panel, .t-tool__result, .t-card--body) > * + * {margin-top:var(--mt,1rem);}
:is(.t-eyebrow, .t-kicker, .t-hero__eyebrow) + * {--mt:.75rem;}
:is(.t-h1, .t-h2, .t-hero__title) + * {--mt:1rem;}
.t-h3 + * {--mt:.5rem;}
.t-lead + * {--mt:1.75rem;}
.t-h2, .t-h3, .t-eyebrow, .t-kicker {--mt:3rem;}
:is(.t-eyebrow, .t-kicker) + :is(.t-h2, .t-h3) {--mt:.75rem;}
.t-h2 + .t-h3 {--mt:1.25rem;}
.t-grid, .t-split, .t-stats, .t-steps, .t-timeline, .t-features, .t-checklist, .t-table-wrap, .t-tabs, .t-faq, .t-figure, .t-tool, .t-form, .t-article, .t-callout, .t-quote, .t-code, .t-logos, .t-pills, .t-stack, .t-hero__actions, .t-hero__facts, .t-divider, .t-photo, .t-shot, .t-gallery {--mt:2rem;}
.t-hero__sub {--mt:1.1rem;}
.t-hero__facts, .t-hero__actions {--mt:1.75rem;}

/* ---------- 8. HEROES (white, no decoration; --media/--split two columns; --band photo + navy) ---------- */
.t-hero {position:relative;padding:clamp(3rem,1.5rem + 4vw,5rem) 0 clamp(2.5rem,1.25rem + 3.5vw,4rem);background:var(--bg);}
.t-hero > .t-container {position:relative;}
.t-hero__title em {font-style:normal;color:var(--brand);}
.t-hero__sub {font-size:clamp(1.05rem,1rem + .35vw,1.2rem);line-height:1.6;color:var(--muted);max-width:58ch;}
.t-hero__actions {display:flex;flex-wrap:wrap;gap:.75rem;}
.t-hero__facts {list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;font-size:.9rem;font-weight:500;color:var(--muted);}
.t-hero__facts li {display:inline-flex;align-items:center;gap:.5rem;}
.t-hero__facts li::before {content:"";width:6px;height:6px;border-radius:50%;background:var(--border-strong);flex:0 0 auto;}
.t-hero__meta {font-size:.88rem;color:var(--muted);}
.t-hero__inner {display:grid;gap:2.5rem;align-items:center;}
.t-hero__copy {min-width:0;}
.t-hero__visual {min-width:0;}
.t-hero__visual > :is(.t-figure, .t-shot, .t-photo) {margin:0;}
.t-hero--page .t-hero__title, .t-hero--page .t-hero__sub, .t-hero--article .t-hero__title, .t-hero--article .t-hero__sub {max-width:none;}
.t-hero--page .t-hero__title {max-width:22ch;}
.t-hero--page .t-hero__sub {max-width:58ch;}
.t-hero--page .t-gallery {--mt:2.5rem;}
@media (min-width: 900px) {
  :is(.t-hero--media, .t-hero--split) {padding-block:clamp(3.5rem,2rem + 4vw,5.5rem) clamp(3rem,1.5rem + 3.5vw,4.5rem);}
  .t-hero__inner {grid-template-columns:7fr 5fr;gap:3.5rem;}
}
@media (min-width: 1200px) {.t-hero__inner {gap:5rem;}}
.t-hero--article .t-hero__title {font-size:clamp(1.9rem,1.4rem + 1.8vw,2.75rem);}
/* full-bleed photo with a navy overlay (industry / hub pages); the only allowed inline style is --band-img */
.t-hero--band, .t-media-band {position:relative;isolation:isolate;overflow:hidden;background-image:var(--band-img);background-size:cover;background-position:center;background-repeat:no-repeat;border-top:1px solid var(--band-edge);border-bottom:1px solid var(--band-edge);}
.t-hero--band::before, .t-media-band::before {content:"";position:absolute;inset:0;z-index:-1;background:var(--navy);opacity:.78;}
.t-media-band--light::before {background:#FFFFFF;opacity:.86;}
.t-hero--band {padding:clamp(4rem,2rem + 6vw,7rem) 0;}
.t-hero--band .t-hero__title em {color:var(--brand);}
.t-hero--band .t-hero__facts li::before {background:var(--brand);}

/* ---------- 9. BUTTONS + LINKS ---------- */
.t-btn {display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.72rem 1.3rem;border-radius:var(--radius-sm);border:1px solid transparent;font:600 .95rem / 1.25 var(--font-body);letter-spacing:0;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s,border-color .15s;}
.t-btn--primary {background:var(--btn-bg);color:#fff;border-color:var(--btn-bg);}
.t-btn--primary:hover {background:var(--btn-bg-hover);border-color:var(--btn-bg-hover);color:#fff;}
.t-btn--ghost {background:transparent;color:var(--navy-ink);border-color:var(--navy-ink);}
.t-btn--ghost:hover {background:var(--navy-soft);color:var(--navy-ink);}
.t-btn--light {background:#fff;color:#0B1F3A;border-color:#fff;}
.t-btn--light:hover {background:#EEF0F3;border-color:#EEF0F3;color:#0B1F3A;}
.t-btn--ghost-light {background:transparent;color:#fff;border-color:rgba(255,255,255,.55);}
.t-btn--ghost-light:hover {background:rgba(255,255,255,.12);border-color:#fff;color:#fff;}
/* on navy bands the primary action is the one orange element */
:is(.t-cta, .t-media-band:not(.t-media-band--light), .t-hero--band, .t-section--dark) .t-btn--light {background:var(--btn-bg);color:#fff;border-color:var(--btn-bg);}
:is(.t-cta, .t-media-band:not(.t-media-band--light), .t-hero--band, .t-section--dark) .t-btn--light:hover {background:var(--btn-bg-hover);border-color:var(--btn-bg-hover);}
.t-btn--sm {padding:.5rem .9rem;font-size:.85rem;}
.t-btn--lg {padding:.9rem 1.6rem;font-size:1rem;}
.t-btn[disabled], .t-btn[aria-disabled="true"] {opacity:.55;cursor:not-allowed;}
@media (max-width: 639.98px) {.t-btn {white-space:normal;text-align:center;max-width:100%;}}
.t-link {display:inline-flex;align-items:center;gap:.35rem;font:600 .9rem var(--font-body);color:var(--brand-dark);text-decoration:none;}
.t-link::after {content:"\2192";transition:transform .2s,opacity .2s;}
.t-link:hover {color:var(--brand);}
.t-link:hover::after {transform:translateX(3px);}

/* ---------- 10. CARDS (flat: 1px border, 12px radius, 24px padding) ---------- */
.t-card {display:flex;flex-direction:column;gap:.6rem;position:relative;padding:1.5rem;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);color:inherit;text-decoration:none;transition:border-color .15s,box-shadow .15s;}
.t-card:hover {border-color:var(--border-strong);box-shadow:var(--shadow-sm);}
.t-card__icon {width:40px;height:40px;border-radius:50%;background:var(--navy-soft);color:var(--navy-ink);display:grid;place-items:center;margin-bottom:.35rem;}
.t-card__icon svg {width:20px;height:20px;}
.t-card__title {font:600 1.125rem / 1.3 var(--font-head);letter-spacing:-.01em;color:var(--text-strong);}
.t-card__text {color:var(--muted);font-size:.95rem;}
.t-card > .t-link {margin-top:auto;padding-top:.35rem;}
.t-card > :is(.t-badge, .t-pill) {align-self:flex-start;}
.t-card--link {cursor:pointer;}
.t-card--link:hover .t-card__title {color:var(--brand-dark);}
@media (hover: hover) {.t-card--link .t-link::after {opacity:0;transform:translateX(-4px);} .t-card--link:hover .t-link::after, .t-card--link:focus-visible .t-link::after {opacity:1;transform:none;}}
.t-card--feature {border-top:3px solid var(--navy-ink);}
.t-card--outline {background:transparent;}
.t-card--dark {border-color:var(--band-edge);}
.t-card--center {align-items:center;text-align:center;}
.t-card--center .t-card__icon {margin-inline:auto;}
/* pricing / engagement tiers: article.t-plan.t-card inside .t-plans.t-grid */
.t-plans {align-items:stretch;}
.t-plan {padding:1.75rem 1.5rem;}
.t-plan > .t-badge {align-self:flex-start;margin-bottom:.25rem;}
.t-plan__name {font:600 1.3rem / 1.2 var(--font-head);letter-spacing:-.01em;color:var(--text-strong);}
.t-plan__price {font:700 clamp(1.4rem,1.1rem + 1vw,1.8rem) / 1.2 var(--font-head);color:var(--text-strong);letter-spacing:-.02em;font-variant-numeric:tabular-nums;}
.t-plan__price small, .t-plan__price span {font-size:.6em;font-weight:500;color:var(--muted);letter-spacing:0;}
.t-plan__text {color:var(--muted);font-size:.95rem;}
.t-plan__list {margin:.35rem 0 .75rem;font-size:.93rem;}
.t-plan > .t-btn {margin-top:auto;align-self:flex-start;}
.t-plan--featured {border-color:var(--navy-ink);box-shadow:var(--shadow-md);}
.t-plan--featured.t-card--feature {border-top-color:var(--brand);}

/* ---------- 11. STATS, STEPS, TIMELINE, FEATURES, CHECKLIST ---------- */
.t-stats {display:grid;gap:1rem;grid-template-columns:repeat(2,1fr);}
.t-stat {padding:1.4rem 1rem;text-align:center;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);}
.t-stat__value {display:block;font:700 clamp(2rem,1.5rem + 1.6vw,2.75rem) / 1 var(--font-head);color:var(--text-strong);font-variant-numeric:tabular-nums;letter-spacing:-.02em;}
.t-stat__label {display:block;margin-top:.5rem;font-size:.74rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
@media (min-width: 768px) {.t-stats {grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1.25rem;}}
.t-steps {list-style:none;padding:0;counter-reset:t-step;display:grid;gap:1.75rem;}
.t-step {counter-increment:t-step;position:relative;padding-left:56px;}
.t-step::before {content:counter(t-step);position:absolute;left:0;top:0;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--numeral-bg);color:var(--numeral-ink);font:600 .95rem var(--font-head);font-variant-numeric:tabular-nums;z-index:1;}
.t-step::after {content:"";position:absolute;left:19px;top:46px;bottom:-1.75rem;width:2px;background:var(--border);}
.t-step:last-child::after {display:none;}
.t-step__title {font:600 1.1rem / 1.3 var(--font-head);letter-spacing:-.01em;color:var(--text-strong);padding-top:.5rem;}
.t-step__text {color:var(--muted);font-size:.95rem;}
@media (min-width: 768px) {
  .t-steps {grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1.5rem;overflow:hidden;padding:4px;margin-inline:-4px;}
  .t-step {padding-left:0;padding-top:56px;}
  .t-step::after {left:48px;right:calc(-1.5rem - 6px);top:19px;bottom:auto;width:auto;height:2px;}
  .t-step__title {padding-top:0;}
}
.t-timeline {list-style:none;padding:0;margin-left:.35rem;border-left:2px solid var(--border);}
.t-timeline__item {position:relative;padding:0 0 2rem 1.75rem;}
.t-timeline__item:last-child {padding-bottom:.25rem;}
.t-timeline__item::before {content:"";position:absolute;left:-8px;top:.3rem;width:14px;height:14px;border-radius:50%;background:var(--navy-ink);border:3px solid var(--bg);}
.t-timeline__when {display:inline-block;font:600 .74rem var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.t-timeline__title {font:600 1.12rem / 1.3 var(--font-head);letter-spacing:-.01em;color:var(--text-strong);--mt:.25rem;}
.t-timeline__item p {color:var(--muted);font-size:.95rem;max-width:66ch;--mt:.4rem;}
.t-features {list-style:none;padding:0;display:grid;gap:1.5rem;}
.t-feature {display:flex;gap:1rem;align-items:flex-start;}
.t-feature > div {min-width:0;}
.t-feature__icon {flex:0 0 40px;height:40px;border-radius:50%;background:var(--navy-soft);color:var(--navy-ink);display:grid;place-items:center;}
.t-feature__icon svg {width:20px;height:20px;}
.t-feature__title {font:600 1.05rem / 1.3 var(--font-head);letter-spacing:-.01em;color:var(--text-strong);}
.t-feature p {color:var(--muted);font-size:.95rem;--mt:.3rem;}
@media (min-width: 768px) {.t-features--2 {grid-template-columns:repeat(2,1fr);gap:1.75rem 2rem;}}
.t-checklist {list-style:none;padding:0;display:grid;gap:.6rem;}
.t-checklist li {position:relative;padding-left:2rem;line-height:1.55;}
.t-checklist li::before {content:"\2713";position:absolute;left:0;top:.15em;width:1.3rem;height:1.3rem;border-radius:50%;display:grid;place-items:center;background:var(--success-soft);color:var(--success);font-size:.72rem;font-weight:700;}
.t-checklist--x li::before {content:"\2715";background:var(--danger-soft);color:var(--danger);}

/* ---------- 12. TABLES, CALLOUTS, QUOTE, BADGES, PILLS, LOGOS ---------- */
.t-table-wrap {overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);}
.t-table {width:100%;border-collapse:collapse;font-size:.92rem;}
.t-table th, .t-table td {padding:.75rem 1rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--border-soft);}
.t-table thead th {background:var(--bg2);font:600 .72rem var(--font-body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);white-space:nowrap;}
.t-table tbody th {font-weight:600;color:var(--text-strong);}
.t-table tbody tr:last-child :is(td, th) {border-bottom:0;}
.t-table tbody tr:hover :is(td, th) {background:var(--bg2);}
.t-table td :is(input:not([type="checkbox"]):not([type="radio"]), select) {width:100%;max-width:7rem;padding:.4rem .6rem;font:500 .9rem var(--font-body);color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);}
.t-table td :is(input, select):focus {outline:none;border-color:var(--navy-ink);box-shadow:var(--ring);}
.t-table--compare th:first-child, .t-table--compare td:first-child {position:sticky;left:0;z-index:1;background:var(--bg);font-weight:600;color:var(--text-strong);box-shadow:1px 0 0 var(--border-soft);min-width:140px;}
.t-table--compare thead th:first-child {background:var(--bg2);}
.t-table--compare tbody tr:hover td:first-child {background:var(--bg2);}
.t-yes {color:var(--success);font-weight:600;}
.t-no {color:var(--danger);font-weight:600;}
.t-yes::before {content:"\2713\00a0";}
.t-no::before {content:"\2715\00a0";}
.t-callout {--c:var(--accent-2);--c-soft:var(--accent-2-soft);position:relative;padding:1.1rem 1.25rem 1.1rem 1.4rem;border-radius:var(--radius);background:var(--c-soft);border:1px solid var(--border-soft);border-left:4px solid var(--c);}
.t-callout--warn {--c:var(--warn);--c-soft:var(--warn-soft);}
.t-callout--success {--c:var(--success);--c-soft:var(--success-soft);}
.t-callout--danger {--c:var(--danger);--c-soft:var(--danger-soft);}
.t-callout__title {display:block;font:600 .95rem var(--font-body);color:var(--c);}
.t-callout__title + * {--mt:.35rem;}
.t-callout p {--mt:.5rem;font-size:.95rem;}
.t-quote {padding:1.5rem 1.75rem;border-left:3px solid var(--navy-ink);background:var(--bg2);border-radius:0 var(--radius) var(--radius) 0;}
.t-quote p {font:400 1.15rem / 1.6 var(--font-head);letter-spacing:-.01em;color:var(--text-strong);}
.t-quote__cite {display:block;margin-top:.8rem;font-style:normal;font-size:.85rem;font-weight:500;color:var(--muted);}
.t-quote__cite::before {content:"\2014\00a0";}
.t-badge {display:inline-flex;align-items:center;padding:.22rem .6rem;border-radius:999px;font:600 .68rem var(--font-body);letter-spacing:.06em;text-transform:uppercase;background:var(--bg3);color:var(--muted);border:1px solid var(--border);vertical-align:middle;}
.t-badge--brand {background:var(--brand-soft);color:var(--brand-dark);border-color:var(--brand-glow);}
.t-badge--gold {background:var(--warn-soft);color:var(--gold);border-color:rgba(217,119,6,.35);}
.t-pills {display:flex;flex-wrap:wrap;gap:.5rem;}
.t-pill {display:inline-flex;align-items:center;padding:.35rem .8rem;border-radius:999px;background:var(--bg);border:1px solid var(--border);font-size:.82rem;font-weight:500;color:var(--text);text-decoration:none;transition:border-color .2s,color .2s,background .2s;}
a.t-pill:hover, a.t-pill:focus-visible {border-color:var(--navy-ink);color:var(--navy-ink);background:var(--navy-soft);}
.t-pill.t-muted {color:var(--muted);background:transparent;}
.t-logos {display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 2.25rem;}
.t-logo {font:600 1rem var(--font-head);letter-spacing:.01em;color:var(--muted-light);white-space:nowrap;transition:color .2s;}
.t-logo:hover {color:var(--text-strong);}

/* ---------- 13. TABS, FAQ ---------- */
.t-tabs__list {display:flex;gap:.25rem;border-bottom:1px solid var(--border);overflow-x:auto;scrollbar-width:none;}
.t-tabs__list::-webkit-scrollbar {display:none;}
.t-tab {flex:0 0 auto;appearance:none;background:none;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;padding:.7rem 1rem;font:600 .9rem var(--font-body);color:var(--muted);cursor:pointer;white-space:nowrap;border-radius:6px 6px 0 0;}
.t-tab:hover {color:var(--text-strong);background:var(--bg2);}
.t-tab[aria-selected="true"] {color:var(--text-strong);border-bottom-color:var(--brand);}
.t-tabpanel {padding-top:1.25rem;}
.t-tabpanel[hidden] {display:none;}
.t-faq {display:grid;gap:.6rem;}
.t-faq__item {border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);padding:0 1.25rem;}
.t-faq__item summary {list-style:none;cursor:pointer;position:relative;padding:1rem 2.25rem 1rem 0;font:600 1rem / 1.4 var(--font-body);color:var(--text-strong);}
.t-faq__item summary::-webkit-details-marker {display:none;}
.t-faq__item summary::after {content:"";position:absolute;right:.4rem;top:50%;width:.55rem;height:.55rem;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:translateY(-75%) rotate(45deg);transition:transform .25s;}
.t-faq__item[open] summary::after {transform:translateY(-25%) rotate(225deg);}
.t-faq__body {padding:0 0 1.1rem;color:var(--muted);font-size:.95rem;}
.t-faq__body p {--mt:.6rem;}

/* ---------- 14. CTA BAND (navy, text left, orange button right on desktop) ---------- */
.t-cta {position:relative;padding:clamp(3.5rem,2rem + 4vw,5rem) 0;border-top:1px solid var(--band-edge);}
.t-cta .t-container {display:grid;gap:1.5rem;}
.t-cta__title {margin:0;font:700 clamp(1.6rem,1.2rem + 1.4vw,2.1rem) / 1.15 var(--font-head);color:var(--text-strong);letter-spacing:-.02em;text-wrap:balance;max-width:26ch;}
.t-cta__text {margin:0;max-width:58ch;font-size:1.02rem;color:var(--muted);}
.t-cta__actions {display:flex;flex-wrap:wrap;gap:.75rem;}
.t-cta .t-btn:focus-visible {outline-color:#fff;}
@media (min-width: 900px) {.t-cta .t-container {grid-template-columns:minmax(0,1fr) auto;column-gap:3rem;align-items:center;} .t-cta__title {grid-column:1;} .t-cta__text {grid-column:1;margin-top:-.5rem;} .t-cta__actions {grid-column:2;grid-row:1 / span 2;flex-direction:column;align-items:stretch;}}
.t-center.t-cta .t-container, .t-cta.t-center .t-container {grid-template-columns:1fr;justify-items:center;text-align:center;}

/* ---------- 15. ARTICLE + TOC + PROSE ---------- */
.t-article {display:grid;gap:2rem;align-items:start;}
.t-toc {font-size:.88rem;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.1rem;}
.t-toc[hidden] {display:none;}
.t-toc__title {margin:0 0 .6rem;font:600 .72rem var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.t-toc ol, .t-toc ul {list-style:none;margin:0;padding:0;display:grid;gap:.15rem;}
.t-toc a {display:block;padding:.3rem .6rem;margin-left:-.6rem;border-left:2px solid transparent;color:var(--muted);text-decoration:none;line-height:1.35;border-radius:0 6px 6px 0;}
.t-toc a:hover {color:var(--text-strong);background:var(--bg3);}
.t-toc a.is-active {color:var(--text-strong);border-left-color:var(--brand);font-weight:600;}
@media (min-width: 1024px) {.t-article {grid-template-columns:240px minmax(0,1fr);gap:3rem;} .t-toc {position:sticky;top:calc(var(--nav-h) + 1.25rem);max-height:calc(100vh - var(--nav-h) - 2.5rem);overflow-y:auto;}}
.t-prose {font-size:1.0625rem;line-height:1.7;min-width:0;}
.t-prose > * + * {margin-top:1.1em;}
.t-prose h2 {font:700 clamp(1.5rem,1.2rem + 1vw,1.9rem) / 1.2 var(--font-head);color:var(--text-strong);letter-spacing:-.02em;margin-top:2em;scroll-margin-top:calc(var(--nav-h) + 1rem);}
.t-prose h3 {font:600 clamp(1.15rem,1.05rem + .4vw,1.3rem) / 1.3 var(--font-head);letter-spacing:-.01em;color:var(--text-strong);margin-top:1.7em;}
.t-prose h4 {font:600 1.05rem var(--font-head);color:var(--text-strong);margin-top:1.5em;}
.t-prose :is(h2, h3, h4) + * {margin-top:.6em;}
.t-prose > :first-child {margin-top:0;}
.t-prose :is(ul, ol) {padding-left:1.4rem;}
.t-prose li + li {margin-top:.4em;}
.t-prose li > :is(ul, ol) {margin-top:.4em;}
.t-prose a {color:var(--brand-dark);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;}
.t-prose a:hover {color:var(--brand);}
.t-prose strong {color:var(--text-strong);}
.t-prose blockquote {padding:1.25rem 1.5rem;border-left:3px solid var(--navy-ink);background:var(--bg2);border-radius:0 var(--radius) var(--radius) 0;font-family:var(--font-head);font-size:1.1em;color:var(--text-strong);}
.t-prose code {font-family:var(--font-mono);font-size:.88em;background:var(--bg3);border:1px solid var(--border-soft);border-radius:5px;padding:.1em .35em;}
.t-prose pre {padding:1rem 1.25rem;background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius);overflow-x:auto;font-size:.875rem;line-height:1.6;}
.t-prose pre code {background:none;border:0;padding:0;font-size:inherit;}
.t-prose table {width:100%;border-collapse:collapse;font-size:.92rem;display:block;overflow-x:auto;}
.t-prose th, .t-prose td {padding:.65rem .9rem;text-align:left;border-bottom:1px solid var(--border);vertical-align:top;}
.t-prose th {background:var(--bg2);font:600 .72rem var(--font-body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
.t-prose img:not(.t-shot img):not(.t-photo img) {border-radius:var(--radius);}
.t-prose > figure {margin:1.75em 0;}
.t-prose hr {border:0;border-top:1px solid var(--border);margin:2.5em 0;}

/* ---------- 16. FIGURES + SVG INFOGRAPHIC CLASSES (svg-* unchanged) ---------- */
.t-figure {display:block;margin:0;max-width:100%;}
.t-figure svg, .t-svg {display:block;width:100%;height:auto;}
.t-figure--wide {width:100%;}
.t-figure--card {background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(.75rem,2vw,1.5rem);}
.t-figure__caption {margin-top:.75rem;font-size:.85rem;line-height:1.5;color:var(--muted);text-align:center;}
.t-svg {font-family:var(--font-body);font-size:13px;overflow:visible;}
.t-svg text {fill:var(--text);}
/* stroke classes first (dashed before coloured so `svg-line-dashed svg-line-brand` = dashed brand; thick last so it
   overrides width), fill classes after: `class="svg-surface svg-line"` = filled box with a border */
.svg-line-dashed {stroke:var(--svg-line);stroke-width:1.5;stroke-dasharray:6 4;fill:none;}
.svg-line {stroke:var(--svg-line);stroke-width:1.5;fill:none;}
.svg-line-brand {stroke:var(--brand);stroke-width:2;fill:none;}
.svg-line-muted {stroke:var(--muted);stroke-width:1.5;fill:none;}
.svg-line-accent-2 {stroke:var(--accent-2);stroke-width:2;fill:none;}
.svg-line-accent-3 {stroke:var(--accent-3);stroke-width:2;fill:none;}
.svg-line-gold {stroke:var(--gold);stroke-width:2;fill:none;}
.svg-line-thick {stroke-width:2.5;}
.svg-ink {fill:var(--text);}
.svg-ink-muted {fill:var(--muted);}
.svg-surface {fill:var(--svg-surface);}
.svg-surface-2 {fill:var(--svg-surface-2);}
.svg-brand {fill:var(--brand);}
.svg-brand-soft {fill:var(--brand-soft);}
.svg-gold {fill:var(--gold);}
.svg-accent-2 {fill:var(--accent-2);}
.svg-accent-3 {fill:var(--accent-3);}
.svg-success {fill:var(--success);}
.svg-danger {fill:var(--danger);}
.svg-label {font-family:var(--font-body);font-size:13px;font-weight:600;}
.svg-title {font-family:var(--font-head);font-size:16px;font-weight:700;letter-spacing:-.01em;}
.svg-small {font-family:var(--font-body);font-size:11px;font-weight:500;}

/* ---------- 17. IMAGERY (v3): photos, browser/phone frames, media band, gallery, media split ----------
   Markup in COMPONENTS.md §18. Images always carry width/height, srcset/sizes, loading="lazy" (hero: fetchpriority="high"). */
.t-photo {display:block;margin:0;max-width:100%;}
.t-photo img {display:block;width:100%;height:auto;border-radius:var(--radius);background:var(--bg3);object-fit:cover;}
.t-photo--4x3 img {aspect-ratio:4 / 3;}
.t-photo--16x9 img {aspect-ratio:16 / 9;}
.t-photo--3x2 img {aspect-ratio:3 / 2;}
.t-photo--square img {aspect-ratio:1 / 1;}
.t-photo--portrait img {aspect-ratio:4 / 5;}
.t-photo figcaption, .t-caption {margin-top:.6rem;font-size:.82rem;line-height:1.5;color:var(--muted);}
/* browser frame: figure.t-shot > .t-shot__bar(span×3 + optional em URL) + img [+ figcaption as an in-frame footer strip] */
.t-shot {display:flex;flex-direction:column;margin:0;max-width:100%;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-md);overflow:hidden;--shot-bar:var(--bg2);--shot-dot:var(--border-strong);}
.t-shot__bar {display:flex;align-items:center;gap:6px;flex:0 0 auto;min-height:32px;padding:0 12px;background:var(--shot-bar);border-bottom:1px solid var(--border);}
.t-shot__bar span {width:9px;height:9px;border-radius:50%;background:var(--shot-dot);flex:0 0 auto;}
.t-shot__bar em {flex:0 1 auto;margin-left:10px;max-width:min(360px,70%);padding:.15rem .7rem;border:1px solid var(--border-soft);border-radius:6px;background:var(--bg);font:400 .7rem / 1.5 var(--font-mono);font-style:normal;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.t-shot > img {display:block;width:100%;height:auto;flex:1 1 auto;min-height:0;object-fit:cover;object-position:top;background:var(--bg3);}
.t-shot > figcaption {flex:0 0 auto;padding:.55rem .9rem;border-top:1px solid var(--border);background:var(--shot-bar);font-size:.8rem;line-height:1.45;color:var(--muted);}
.t-shot--dark {--shot-bar:#141B28;--shot-dot:rgba(255,255,255,.28);background:#0F1420;border-color:rgba(255,255,255,.12);}
.t-shot--dark .t-shot__bar, .t-shot--dark > figcaption {border-color:rgba(255,255,255,.1);color:rgba(232,236,243,.75);}
.t-shot--dark .t-shot__bar em {background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.1);color:rgba(232,236,243,.75);}
.t-shot--flat {box-shadow:none;}
/* phone frame: figure.t-shot.t-shot--phone > img (9:19.5); bezel is drawn with box-shadow rings so the caption sits below it */
.t-shot--phone {display:block;max-width:320px;margin-inline:auto;padding:12px;background:none;border:0;border-radius:0;box-shadow:none;overflow:visible;}
.t-shot--phone .t-shot__bar {display:none;}
.t-shot--phone > img {position:relative;aspect-ratio:9 / 19.5;width:100%;height:auto;border-radius:30px;object-fit:cover;object-position:top;background:var(--bg3);box-shadow:0 0 0 10px #0B1220,0 0 0 11px rgba(255,255,255,.18),var(--shadow-lg);}
.t-shot--phone > figcaption {margin-top:1.5rem;padding:0;border:0;background:none;text-align:center;}
.t-shot--phone.t-shot--flat > img {box-shadow:0 0 0 10px #0B1220,0 0 0 11px rgba(255,255,255,.18);}
/* full-bleed photo band: section.t-media-band[style="--band-img:url(...)"] > .t-container; overlay = navy @ 78% (--light: white @ 86%) */
.t-media-band {padding:clamp(4rem,2.5rem + 4vw,6rem) 0;}
.t-media-band .t-h2 {max-width:24ch;}
.t-media-band--light {color:var(--text);}
/* gallery of figures (2 or 3 columns); captions align because .t-shot stretches its image */
.t-gallery {display:grid;gap:1.25rem;grid-template-columns:1fr;}
.t-gallery > * {min-width:0;margin:0;}
.t-gallery > .t-shot--phone {justify-self:center;width:100%;}
@media (min-width: 640px) {.t-gallery--2, .t-gallery--3 {grid-template-columns:repeat(2,1fr);}}
@media (min-width: 1024px) {.t-gallery--3 {grid-template-columns:repeat(3,1fr);} .t-gallery {gap:1.5rem;}}
/* text beside a photo/screenshot */
.t-split--media {align-items:center;}
.t-split--media .t-split__visual > :is(.t-photo, .t-shot, .t-figure) {margin:0;}
.t-split--media .t-split__visual > .t-photo img {width:100%;}

/* ---------- 18. FORMS ---------- */
.t-form {display:grid;gap:1rem;}
.t-form__row {display:grid;gap:1rem;}
.t-form__group {display:grid;gap:.4rem;}
fieldset.t-form__group {border:0;padding:0;margin:0;min-width:0;}
.t-form__group > :is(label:not(.t-choice), legend) {display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:0;font-size:.8rem;font-weight:500;letter-spacing:0;text-transform:none;color:var(--text);}
fieldset.t-form__group > legend {margin-bottom:.5rem;}
fieldset.t-form__group > legend.t-kicker {font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.t-form__group > :is(label:not(.t-choice), legend) output {font:600 1rem var(--font-head);color:var(--text-strong);text-transform:none;letter-spacing:0;font-variant-numeric:tabular-nums;}
:is(.t-form, .t-tool) :is(input:not([type="range"]):not([type="radio"]):not([type="checkbox"]):not([type="hidden"]), select, textarea) {width:100%;background:var(--bg);border:1px solid var(--border-strong);border-radius:var(--radius-sm);padding:.68rem .9rem;color:var(--text);font:400 .98rem var(--font-body);line-height:1.4;transition:border-color .2s,box-shadow .2s;}
:is(.t-form, .t-tool) :is(input, select, textarea):focus {outline:none;border-color:var(--navy-ink);box-shadow:var(--ring);}
:is(.t-form, .t-tool) :is(input, select, textarea):focus-visible {outline:none;}
:is(.t-form, .t-tool) :is(input, textarea)::placeholder {color:var(--muted-light);}
:is(.t-form, .t-tool) select {appearance:none;-webkit-appearance:none;padding-right:2.4rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235B6478' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;}
[data-theme="dark"] :is(.t-form, .t-tool) select {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2398A2B3' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");}
:is(.t-form, .t-tool) textarea {resize:vertical;min-height:130px;}
:is(.t-form, .t-tool) :is(input, select, textarea):user-invalid {border-color:var(--danger);}
.t-form__hp {position:absolute !important;left:-9999px !important;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none;}
.t-form__note {font-size:.85rem;color:var(--muted);}
.t-form button[type="submit"] {justify-self:start;}
.t-form__status {font-size:.92rem;font-weight:500;color:var(--muted);}
.t-form__status:empty {display:none;}
.t-form__status.is-error {color:var(--danger);}
.t-form.is-sent .t-form__status {padding:.9rem 1.1rem;border-radius:var(--radius-sm);background:var(--success-soft);border:1px solid rgba(21,128,61,.3);color:var(--success);}
/* range slider: site.js sets --pct so the track fills to the thumb */
.t-range {-webkit-appearance:none;appearance:none;width:100%;height:6px;margin:.5rem 0;border-radius:3px;background:linear-gradient(var(--navy-ink),var(--navy-ink)) 0 0 / var(--pct,50%) 100% no-repeat var(--bg3);border:0;padding:0;cursor:pointer;}
.t-range::-webkit-slider-thumb {-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:var(--bg);border:3px solid var(--navy-ink);box-shadow:var(--shadow-md);}
.t-range::-moz-range-thumb {width:16px;height:16px;border-radius:50%;background:var(--bg);border:3px solid var(--navy-ink);box-shadow:var(--shadow-md);}
.t-range:focus-visible {outline:2px solid var(--navy-ink);outline-offset:4px;}
/* radio / checkbox chips: label.t-choice > input + span (site.js also toggles .is-checked for browsers without :has) */
.t-choices {display:flex;flex-wrap:wrap;gap:.5rem;}
.t-choice {display:inline-flex;align-items:center;gap:.55rem;padding:.55rem .95rem;border:1px solid var(--border-strong);border-radius:999px;background:var(--bg);font-size:.9rem;font-weight:500;line-height:1.3;color:var(--text);cursor:pointer;text-transform:none;letter-spacing:0;transition:border-color .2s,background .2s,color .2s,box-shadow .2s;}
.t-choice input {margin:0;flex:0 0 auto;accent-color:var(--navy-ink);}
.t-choice:hover {border-color:var(--navy-ink);}
.t-choice:is(:has(input:checked), .is-checked) {border-color:var(--navy-ink);background:var(--navy-soft);color:var(--navy-ink);font-weight:600;}
.t-choice:focus-within {box-shadow:var(--ring);border-color:var(--navy-ink);}
.t-choice--row {display:flex;border-radius:var(--radius-sm);}

/* ---------- 19. TOOL SHELL ---------- */
.t-tool {display:grid;gap:1.5rem;padding:clamp(1rem,3vw,1.75rem);background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);}
.t-tool__panel {display:grid;gap:1.1rem;align-content:start;}
.t-tool__panel > * + *, .t-tool__result > * + * {--mt:0;}
.t-tool__result {display:grid;gap:1.1rem;align-content:start;padding:1.5rem;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);}
.t-score {display:flex;flex-direction:column;gap:.25rem;}
.t-score__value {font:700 clamp(2.5rem,2rem + 2vw,3.4rem) / 1 var(--font-head);color:var(--brand-dark);font-variant-numeric:tabular-nums;letter-spacing:-.03em;}
.t-score__label {font-size:.74rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
.t-meter {height:10px;border-radius:5px;background:var(--bg3);overflow:hidden;}
.t-meter--sm {height:6px;}
.t-meter__bar {display:block;height:100%;width:0;border-radius:inherit;background:var(--brand);transition:width .4s ease;}
.t-tool__lines {list-style:none;padding:0;display:grid;}
.t-tool__lines li {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.4rem 1rem;padding:.6rem 0;border-bottom:1px solid var(--border-soft);font-size:.95rem;}
.t-tool__lines li:last-child {border-bottom:0;}
.t-tool__lines .t-meter {flex:1 0 100%;}
.t-tool__lines li span {color:var(--muted);}
.t-tool__lines li strong {font-family:var(--font-head);font-weight:600;color:var(--text-strong);font-variant-numeric:tabular-nums;white-space:nowrap;}
@media (min-width: 900px) {.t-tool {grid-template-columns:1.1fr .9fr;gap:2rem;} .t-tool__result {position:sticky;top:calc(var(--nav-h) + 1rem);}}

/* ---------- 20. UTILITIES + MISC ---------- */
.t-center {text-align:center;}
.t-center :is(.t-lead, .t-hero__sub, .t-h2) {margin-inline:auto;}
.t-center :is(.t-hero__actions, .t-hero__facts, .t-pills, .t-logos) {justify-content:center;}
.t-muted {color:var(--muted);}
.t-small {font-size:.875rem;}
.t-visually-hidden {position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
@media (max-width: 767.98px) {.t-hide-mobile {display:none !important;}}
.t-mt-0 {margin-top:0 !important;} .t-mt-1 {margin-top:.5rem !important;} .t-mt-2 {margin-top:1rem !important;} .t-mt-3 {margin-top:2rem !important;}
.t-mb-0 {margin-bottom:0 !important;} .t-mb-1 {margin-bottom:.5rem !important;} .t-mb-2 {margin-bottom:1rem !important;} .t-mb-3 {margin-bottom:2rem !important;}
.t-divider {border:0;border-top:1px solid var(--border);margin:2rem 0;}
.t-kicker {display:block;font:600 .72rem var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.t-num {display:block;font:700 clamp(2.25rem,1.75rem + 1.6vw,3rem) / 1 var(--font-head);color:var(--navy-ink);letter-spacing:-.03em;font-variant-numeric:tabular-nums;}
.t-code {margin:0;padding:1rem 1.25rem;background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius);overflow-x:auto;font-family:var(--font-mono);font-size:.86rem;line-height:1.6;tab-size:2;color:var(--text);}
.t-code code {font:inherit;}

/* ---------- 21. MOTION ---------- */
.t-js .t-reveal:not(.is-visible) {opacity:0;transform:translateY(12px);}
.t-reveal {transition:opacity .5s ease,transform .5s ease;}
.t-reveal.is-visible {opacity:1;transform:none;}
:is(.t-grid, .t-stats, .t-steps, .t-features) > .t-reveal:nth-child(2) {transition-delay:.08s;}
:is(.t-grid, .t-stats, .t-steps, .t-features) > .t-reveal:nth-child(3) {transition-delay:.16s;}
:is(.t-grid, .t-stats, .t-steps, .t-features) > .t-reveal:nth-child(4) {transition-delay:.24s;}
:is(.t-grid, .t-stats, .t-steps, .t-features) > .t-reveal:nth-child(n+5) {transition-delay:.3s;}
@media (prefers-reduced-motion: reduce) {
  html {scroll-behavior:auto;}
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; transition-delay: 0s !important; }
  .t-js .t-reveal:not(.is-visible) {opacity:1;transform:none;}
}

/* ---------- 22. PRINT ---------- */
@media print {
  .t-header, .t-footer, .t-cta, .t-crumbs, .t-skip, .t-hero__actions, .t-toc {display:none !important;}
  .t-js .t-reveal:not(.is-visible) {opacity:1;transform:none;}
  .t-section, .t-hero {padding:1.5rem 0;background:none;}
  .t-card, .t-callout, .t-faq__item, .t-table-wrap, .t-shot, .t-photo {break-inside:avoid;box-shadow:none;}
}

/* ---------- 23. LEGACY PAGE COMPENSATION (body.t-body--legacy loads styles.css first) ----------
   Fonts: styles.css hardcodes 'Exo 2' / 'Nunito' on body, headings and ~20 components; these win on specificity
   (.t-body--legacy + the original selector) so the whole site renders in Inter / Inter Tight.
   Also: the old nav was fixed (72px) and heroes padded 140px to clear it; the v2 header is sticky and in-flow. */
.t-body--legacy, .t-body--legacy :is(input, select, textarea, button, .nav-links a, .section-tag, .hero-badge, .svc-badge, .section-sub, .hero-sub, .ptag) {font-family:var(--font-body);}
.t-body--legacy :is(h1, h2, h3, h4, h5, h6, .nav-cta, .btn-primary, .btn-outline, .submit-btn, .filter-btn, .stat-item h3, .stat-card h3, .trust-logo, .step-num, .pnum, .testi-author strong, .footer-col h4, .timeline-year, .ceo-name, .info-text strong, .rad-item h4, .cs-stat h4, .project-body h3, .service-card h3, .value-card h3, .office-card h3, .agile-card h3, .ebook-card h3, .pdetail h3, .process-step h3, .timeline-item h3, .rad-visual h3) {font-family:var(--font-head);letter-spacing:-.01em;}
.t-body--legacy :is(.nav-cta, .btn-primary, .btn-outline, .submit-btn, .filter-btn) {font-family:var(--font-body);font-weight:600;letter-spacing:0;border-radius:var(--radius-sm);box-shadow:none;}
.t-body--legacy :is(.btn-primary, .submit-btn, .nav-cta) {background:var(--btn-bg);}
.t-body--legacy :is(.btn-primary, .submit-btn, .nav-cta):hover {background:var(--btn-bg-hover);transform:none;box-shadow:none;}
.t-body--legacy :is(h1, h2, h3, h4, h5, h6) {font-weight:600;}
.t-body--legacy :is(h1, h2, .section-heading, .hero h1) {font-weight:700;letter-spacing:-.02em;}
.t-body--legacy .section-tag {color:var(--muted);font-weight:600;letter-spacing:.08em;}
.t-body--legacy .hero-badge {animation:none;}
.t-body--legacy :is(.hero-badge, .svc-badge, .rad-badge) {background:var(--navy-soft);border-color:transparent;color:var(--navy-ink);letter-spacing:.06em;}
.t-body--legacy .hero-badge::before {animation:none;}
.t-body--legacy :is(.hero-glow, .hero-grid) {display:none;}
.t-body--legacy .page-hero {padding-top:68px;background:var(--bg);}
.t-body--legacy .hero {padding-top:80px;min-height:calc(100vh - var(--nav-h));background:var(--bg);}
.t-body--legacy .scam-notice strong {color:var(--gold);}
.t-body--legacy :is(.cta-banner, .rad-section, .rad-feature) {background:var(--bg2);}
.t-body--legacy .rad-feature {border-color:var(--border);}
.t-body--legacy .cta-banner::before {display:none;}
.t-body--legacy :is(.pnum, .step-num) {background:none;-webkit-text-fill-color:currentColor;color:var(--navy-ink);font-weight:700;letter-spacing:-.03em;}
.t-body--legacy .step-num {opacity:.3;}
.t-body--legacy .pnum {opacity:.9;}
@media (max-width: 768px) {.t-body--legacy .page-hero {padding-top:48px;} .t-body--legacy .hero {padding-top:56px;}}
