/* Approved 2026-10-04. Loaded after page styles. Font families stay unchanged.
   Brand primitives -> semantic roles -> shared component variants. */
:root {
  --leaf:#479C73; --mint:#D2E9DD; --sky:#7EADDB; --sand:#E6D4BE;
  --aqua:#6DBEC6; --burnt-orange:#D4622C; --sun:#F0C845;
  --bg-page:#26282B; --bg-section:#26282B;
  --surface-card:#303236; --surface-raised:#3A3D42; --surface-input:#202225;
  --text-primary:#F6F5F3; --text-secondary:#C4C4C4; --text-muted:#B0B0B0;
  --text-highlight:var(--mint); --text-accent:#62BB90; --text-on-accent:#0E0E0F;
  --border-subtle:#44474D; --border-control:#868A90; --border-active:var(--leaf);
  --accent-wash:rgb(71 156 115 / 8%);
  --hero-glow:radial-gradient(ellipse at 65% 20%,rgb(71 156 115 / 14%),transparent 65%);
  --shadow-panel:0 16px 48px rgb(0 0 0 / 24%);
  --shadow-hover:0 0 24px rgb(71 156 115 / 10%);
  --radius-control:8px; --radius-card:12px; --radius-panel:16px;
  --duration-control:160ms; --duration-panel:240ms; --duration-reveal:360ms;
  --ease-system:cubic-bezier(.2,.8,.2,1);
  --section-y:clamp(64px,7.2vw,104px); --gutter:clamp(20px,3.34vw,48px);
  --measure:65ch;
  --type-disp-sm:clamp(16px,1.2vw,18px); --type-disp-md:clamp(18px,1.7vw,24px);
  --type-disp-lg:clamp(30px,3.5vw,48px); --type-disp-xl:clamp(40px,5vw,72px);
  --type-disp-2xl:clamp(40px,5vw,72px); --track-display:-.025em; --track-display-lg:-.035em;
  /* Compatibility aliases: preserve markup and component contracts. */
  --ground:var(--bg-page); --bg:var(--bg-page); --surface:var(--bg-page);
  --surface-deep:var(--bg-section); --panel:var(--surface-card); --warm:var(--bg-section);
  --carbon:var(--bg-page); --carbon-raised:var(--surface-card);
  --white:var(--text-primary); --text:var(--text-primary); --ink:var(--text-primary);
  --deep:var(--bg-section); --green-strong:var(--mint); --green-text:var(--mint);
  --green-bg:var(--bg-page); --green:var(--leaf); --accent:var(--leaf);
  --grant-purple:var(--sky); --forest-deepest:var(--bg-page); --forest-deep:var(--bg-section);
  --forest:var(--surface-card); --forest-lift:var(--surface-raised);
  --muted:var(--text-muted); --text-subtle:var(--text-muted);
  --line:var(--border-subtle); --line-2:var(--border-control);
  --sys-panel:var(--surface-card); --sys-panel-hover:var(--surface-raised);
  --sys-panel-deep:var(--surface-input); --sys-panel-ink:var(--surface-card);
  --sys-card-line:var(--border-subtle); --sys-accent-soft:var(--mint);
  --sys-radius:var(--radius-card); --sys-radius-lg:var(--radius-panel);
  --sys-shadow:var(--shadow-panel); --sys-shadow-low:0 1px 2px rgb(0 0 0 / 20%);
  --sys-ease:var(--duration-panel) var(--ease-system);
  --form-panel:var(--surface-card); --form-field:var(--surface-input);
  --form-ink:var(--text-primary); --form-muted:var(--text-muted); --form-gap:16px;
  --button-green:var(--leaf); --button-ink:var(--text-on-accent);
  --r-xs:6px; --r-sm:8px; --r-md:12px; --r-lg:16px;
  --dur-fast:160ms; --dur-base:240ms; --dur-slow:360ms; --dur-slower:360ms;
  color-scheme:dark;
}
html { scroll-padding-top:100px; }
html body { background:var(--bg-page); color:var(--text-primary); }
body :is(h1,h2,h3,h4,p,li,dt,dd) { overflow-wrap:break-word; }
body :is(h1,h2,h3) { text-wrap:balance; }
body :is(p,.sx__lede,.hx__lede) { line-height:1.55; }
body :is(.color-black,.color-gray-light,.color-white) { color:var(--text-primary)!important; }
body :is(.color-green,.color-orange) { color:var(--text-highlight)!important; }
body :is(.background-black,.background-gray-super-dark,.background-green) { background-color:var(--bg-page)!important; }
body :is(.background-white,.background-cream) { background-color:var(--bg-section)!important; }
body :is(a,button,input,textarea,select,summary,[tabindex]):focus-visible {
  outline:2px solid var(--text-highlight)!important; outline-offset:3px; box-shadow:0 0 0 2px var(--bg-page);
}
body :is(input,select,textarea) { color-scheme:dark; accent-color:var(--leaf); max-width:100%; }
body ::selection { background:var(--mint); color:var(--text-on-accent); }

/* Sticky chrome: one surface in every scroll/menu state. */
html body header.site-header { padding:12px var(--gutter); transform:none!important; }
html body header.site-header .top-wrap {
  width:100%; max-width:1360px; min-height:64px; padding:8px 20px;
  border:1px solid var(--border-subtle); border-radius:var(--radius-card);
  background:var(--bg-section); box-shadow:none; transform:none!important;
}
html body header.site-header.is-scrolled .top-wrap {
  background:rgb(48 50 54 / 92%); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
html body header.site-header :is(.header-nav-link,.header-nav-label,.header-nav-marker) { color:var(--text-primary)!important; }
html body header.site-header .header-nav-label { font-size:12px; line-height:1.4; letter-spacing:.02em; }
html body header.site-header .logo .logo-light { display:block!important; }
html body header.site-header .logo .logo-dark { display:none!important; }
html body header.site-header .hamburger { min-width:44px; min-height:44px; }
html body header.site-header .hamburger .line { background:var(--text-primary); }
html body header.site-header .header-submenu { background:var(--surface-raised); border:1px solid var(--border-subtle); border-radius:12px; box-shadow:var(--shadow-panel); }
html body header.site-header .header-submenu a { min-height:44px; }
html body :is(.modal-menu,.modal-menu .bottom-menu,.modal-menu .menu-more) { background:var(--bg-section); color:var(--text-primary); }
html body .modal-menu { overflow-y:auto; padding-bottom:32px; }
html body .modal-menu :is(a,button,span) { color:var(--text-primary); }
html body .floating-scroll-menu { background:var(--surface-card); color:var(--text-primary); border:1px solid var(--border-subtle); border-radius:8px; }

/* Page rhythm and editorial surfaces. */
html body :is(.sx,.hx,.page-section,.page-section.alt) { background:var(--bg-page); color:var(--text-primary); padding-block:var(--section-y); }
html body :is(.sx--deep,.sx--raised,.hx--deep,.hx--cream,.sx--light,.sx-cta--accent) { background:var(--bg-section); color:var(--text-primary); }
html body :is(.sx__inner,.hx__inner) { width:100%; max-width:1200px; margin-inline:auto; }
html body :is(.sx__title,.hx__title,.page-hero h1) { color:var(--text-primary); letter-spacing:-.025em; line-height:1.1; }
html body :is(.sx__title,.hx__title) { font-size:clamp(30px,3.5vw,48px); }
html body :is(.sx__lede,.hx__lede,.sx-feature__body,.sx-faq__answer,.page-intro) { color:var(--text-secondary); }
html body :is(.sx__eyebrow,.hx__eyebrow,.section-label) { color:var(--text-highlight); }
html body :is(.page-hero,.page-header) { background:var(--bg-page); color:var(--text-primary); }
html body :is(.pillar,.notice-block,.legal-doc,.review-aside,.cards .card) { background:var(--bg-page); color:var(--text-primary); border-color:var(--border-subtle); }
html body :is(.pillar,.cards .card) { border-top:1px solid var(--border-subtle); padding-block:24px; }
html body :is(.legal-doc,.review-aside,.pillar) p { color:var(--text-secondary); }

/* Cards and panels. Interactive cards share a border change; no faux click on prose. */
html body :is(.sx-card,.sx-plan,.pr-blob,.sx-step,.sx-quote,.hx-stack__card,.hx-showcase__panel,.hw__site-link,.wk__tile,.cs__card,.aud__card,.wp__shot,.wx__card) {
  background:var(--surface-card)!important; color:var(--text-primary)!important;
  border:1px solid var(--border-subtle); border-radius:var(--radius-card)!important;
  box-shadow:none; transition:border-color var(--sys-ease),box-shadow var(--sys-ease),transform var(--sys-ease);
}
html body :is(.sx-card,.sx-plan,.pr-blob,.sx-step,.sx-quote,.hx-stack__card,.hx-showcase__panel) { padding:clamp(20px,2.2vw,32px); }
html body :is(.sx-plan--featured,.pr-blob--glow) { border-color:var(--leaf); box-shadow:var(--shadow-hover); }
html body :is(.sx-step__title,.sx-step__body,.sx-plan__name,.sx-plan__price,.pr-plan__summary,.pr-price__val,.sx-plan__list li,.wk__title,.wk__kind,.wk__index,.wk__go,.hw__name,.hw__kind,.hw__site-foot,.cs__title) { color:var(--text-primary)!important; }
html body :is(.sx-step__body,.pr-plan__summary,.hw__copy,.sx-quote__role,.aud__copy) { color:var(--text-secondary)!important; }
html body :is(.sx-step::before,.sx-stat__value em,.hx-metric__value em,.sx-quote__mark) { color:var(--text-accent)!important; }
html body :is(.sx-plan__flag,.hw__tags li,.cs__tags li,.status) { background:var(--accent-wash); color:var(--text-highlight); border-radius:6px; }
html body :is(.sx-step::after,.hx-showcase__rule) { background:var(--border-subtle); }
html body :is(.sx-faq__item,.fq__group,.pr-svc__row,.hx-ledger__item) { border-color:var(--border-subtle); }
html body :is(.sx-faq__item summary,.fq__group-title,.fq__ask .hc__link) { color:var(--text-primary); }
html body :is(.sx-faq__item[open],.fq .sx-faq__item:hover) { background:var(--surface-card); }
html body :is(.fq__chip,.pr-cur__select,.pr-tab,.wk__filter) { color:var(--text-secondary); border-color:var(--border-control); border-radius:8px; min-height:44px; }
html body :is(.fq__chip:hover,.pr-tab[aria-selected='true'],.wk__filter.is-active) { color:var(--text-highlight); background:var(--surface-raised); }
html body :is(.sx-compare table,.sx-compare th,.sx-compare td,.pr-svc__cell,.pr-cur__select option) { color:var(--text-primary); background:var(--surface-card); border-color:var(--border-subtle); }
html body :is(.sx-compare thead th,.pr-svc__head) { background:var(--surface-raised); color:var(--text-primary); }
html body :is(.sx-compare__yes,.pr-svc__tier,.pr-price__prefix,.pr-price__unit) { color:var(--text-highlight); }
html body :is(.pr-pick,.pr-pick__results,.pr-pick__opt) { background:var(--surface-card); color:var(--text-primary); }

/* Primary, secondary and text actions. Keep existing labels, SVGs and hooks. */
html body :is(.sx-btn,.hero-action--primary,.pr-plan__cta,.career-submit,.auth-submit,.form-submit,.contact-submit,.call-submit,.button-frame,button[type='submit']) {
  background:var(--leaf)!important; color:var(--text-on-accent)!important;
  border:1px solid var(--leaf); border-radius:var(--radius-control)!important;
  min-height:48px; padding:12px 20px; box-shadow:none; transform:none;
  transition:background-color var(--duration-control),border-color var(--duration-control);
}
html body :is(.sx-btn,.hero-action--primary,.pr-plan__cta,.career-submit,.auth-submit,.button-frame,button[type='submit']) :is(span,svg) { color:inherit!important; }
html body :is(.sx-btn,.pr-plan__cta,.button-frame,button[type='submit']) svg path { fill:currentColor; }
html body :is(.sx-btn--ghost,.hero-action:not(.hero-action--primary),.auth-method-button) {
  background:transparent!important; color:var(--text-primary)!important; border:1px solid var(--border-control)!important;
  border-radius:8px!important; min-height:48px; padding:12px 20px;
}
html body :is(.button-frame,.sx-btn)::before,html body .button-frame::after { background:none; box-shadow:none; }
html body :is(.button-frame .button-frame__svg,.button-frame>svg.button-frame-svg) { display:none; }
html body :is(.link-arrow,.hc__link,.pr-more__link,.cs__back,.review-aside__mail,.auth-home-link,.lab-home-link) { color:var(--text-highlight); }
html body :is(button:disabled,input:disabled) { cursor:not-allowed; }
html body :is(button[type='submit']:disabled,.auth-submit:disabled) { background:var(--surface-raised)!important; color:var(--text-muted)!important; border-color:var(--border-control); opacity:1; }
@media(hover:hover) {
  html body :is(.sx-btn,.hero-action--primary,.pr-plan__cta,.career-submit,.auth-submit,.button-frame,button[type='submit']):not(:disabled):hover { background:var(--mint)!important; border-color:var(--text-highlight); }
  html body :is(.sx-btn--ghost,.hero-action:not(.hero-action--primary),.auth-method-button):not(:disabled):hover { background:var(--surface-raised)!important; }
  html body :is(a.hw__site-link,a.wk__tile,.pr-blob):hover { border-color:var(--leaf); box-shadow:var(--shadow-hover); transform:translateY(-2px); }
  html body :is(.link-arrow,.hc__link,.pr-more__link):hover { text-decoration:underline; text-underline-offset:4px; }
}

/* All existing forms, including floating auth labels and compact signup. */
html body :is(.contact-form-panel,.career-form,.hc__form,.js-review-form,.auth-form,.portal-form,.newsletter-form) {
  background:var(--surface-card); color:var(--text-primary); border:1px solid var(--border-subtle); border-radius:12px;
}
html body form .field { background:transparent!important; border:0!important; border-radius:0; padding:0; }
html body form .field :is(input,textarea,select),html body :is(.footer-newsletter__row input,.auth input,.reply textarea,.pr-pick__search) {
  background:var(--surface-input)!important; color:var(--text-primary)!important;
  border:1px solid var(--border-control)!important; border-radius:8px!important; min-height:48px; padding:12px 16px;
}
html body form .field label,html body :is(.field-note,.auth-help,.auth-legal,.auth-provider-status,.form-status,.rv-consent,.footer-newsletter__consent) { color:var(--text-secondary)!important; }
html body form .field label { margin-bottom:8px; line-height:1.4; }
html body :is(input,textarea)::placeholder { color:var(--text-muted)!important; opacity:1; }
html body :is(input,textarea,select)[aria-invalid='true'] { border-color:var(--sun)!important; }
html body :is(.form-status.error,.form-status.is-error,.field-note.is-short) { color:var(--sun)!important; }
html body :is(.rv-rating__opt span,.rv-consent__label input[type='checkbox']) { color:var(--text-primary); background:var(--surface-input); border:1px solid var(--border-control); border-radius:8px; }
html body .rv-rating__opt input:checked+span { background:var(--leaf); color:var(--text-on-accent); border-color:var(--leaf); }
html body .form-success-screen { background:var(--bg-page); color:var(--text-primary); }

/* Homepage: retain every section, remove the competing full-colour bands. */
html body[data-page='home'] .hero { background:var(--bg-page); min-height:0; }
html body[data-page='home'] .hero::after { background:linear-gradient(90deg,rgb(12 12 12 / 96%),rgb(12 12 12 / 80%)),var(--hero-glow); }
html body[data-page='home'] .hero .top-wrap { padding-top:156px; padding-bottom:64px; min-height:0; max-width:1296px; margin:auto; }
html body[data-page='home'] .hero-intro { max-width:880px; }
html body[data-page='home'] .hero-intro h1 { font-size:clamp(40px,5vw,72px); line-height:1.04; letter-spacing:-.035em; max-width:18ch; }
html body[data-page='home'] .hero-intro__lede { color:var(--text-secondary); max-width:53ch; font-size:18px; line-height:1.55; }
html body[data-page='home'] .hero-intro__eyebrow { color:var(--text-highlight); }
html body[data-page='home'] .hero .text-list { gap:24px; margin-top:24px; }
html body[data-page='home'] .hero .text-list span { color:var(--text-muted)!important; }
html body[data-page='home'] .hero .bottom-wrap { background:var(--bg-page); border-top:1px solid var(--border-subtle); }
html body .powered-by { background:var(--bg-section); color:var(--text-muted); padding:32px var(--gutter); border-block:1px solid var(--border-subtle); }
html body .pb-caption { color:var(--text-muted); }
html body :is(._01,._01 .inner-wrap,._01 .info-section,._02,._02 .inner-wrap,._03,.system-path) { background:var(--bg-page)!important; color:var(--text-primary); }
html body[data-page='home'] :is(._01 .info-section,._02 .inner-wrap,._03) { padding-block:var(--section-y); }
html body[data-page='home'] :is(._01 .title,._02 .title) { font-size:clamp(30px,3.5vw,48px); line-height:1.1; letter-spacing:-.025em; }
html body[data-page='home'] .sections .section { min-height:0; height:auto; padding-block:var(--section-y); border-top:1px solid var(--border-subtle); }
html body[data-page='home'] .sections .section :is(.lottie-container,.image-wrap) { background:var(--surface-card)!important; border:1px solid var(--border-subtle); border-radius:16px; }
html body[data-page='home'] .sections .section .title { font-size:clamp(30px,3.5vw,48px); line-height:1.1; }
html body[data-page='home'] .system-path { padding-block:var(--section-y); border-top:1px solid var(--border-subtle); }
html body[data-page='home'] .system-path h2 { font-size:clamp(36px,4vw,56px); line-height:1.05; }
html body[data-page='home'] #start .sx__inner { background:var(--surface-card); border:1px solid var(--border-subtle); border-radius:16px; }
html body[data-page='home'] :is(#built-in-africa,#process) .sx-step { background:var(--surface-card)!important; color:var(--text-primary); }
html body[data-page='home'] .aud__card { padding:20px; }
html body[data-page='home'] .aud__media { border-radius:12px; background:var(--surface-card); }
html body :is(.hw__bar,.hw__screen,.hw__site-foot,.client-browser,.cs__facts>div,.cs-next,.wp__bar) { background:var(--surface-card)!important; color:var(--text-primary); }
html body :is(.hx-marquee,.hx-metrics__row,.hx-crop,.hx-pull__inner) { color:var(--text-primary); }

/* Footer and shared utility surfaces. */
html body footer[data-shared-footer] { background:var(--bg-section); color:var(--text-primary); border-top:1px solid var(--border-subtle); }
html body footer[data-shared-footer] :is(.inner-wrap,.top-wrap,.bottom-wrap,.content) { background:transparent; }
html body footer[data-shared-footer] :is(a,span,p,label,button) { color:var(--text-secondary); }
html body footer[data-shared-footer] .footer-newsletter__row { background:transparent; border:0; gap:8px; }
html body footer[data-shared-footer] .footer-newsletter__row button { min-width:48px; padding:12px; }
html body footer[data-shared-footer] .footer-newsletter__row input { min-width:0; }
html body .lc-consent { --cc-bg:var(--surface-card); color:var(--text-primary); }
html body :is(.lc-consent__panel,.lc-consent__card,.lc-consent__banner) { background:var(--surface-card)!important; color:var(--text-primary); border:1px solid var(--border-subtle); border-radius:16px; box-shadow:var(--shadow-panel); }
html body .lc-consent :is(p,label,span,a,h2,h3) { color:var(--text-secondary); }
html body .lc-consent button { background:var(--surface-raised); color:var(--text-primary); border:1px solid var(--border-control); border-radius:8px; min-height:44px; }
html body .lc-chat { --lc-paper:var(--surface-card); --lc-ink:var(--text-primary); --lc-deep:var(--surface-raised); --lc-rule:var(--border-subtle); }
html body .lc-chat :is(.lc-chat__panel,.lc-chat__head,.lc-chat__log,.lc-chat__welcome,.lc-chat__utility,.lc-chat__composer,.lc-chat__bubble) { background:var(--surface-card); color:var(--text-primary); border-color:var(--border-subtle); }
html body .lc-chat :is(p,span,h2,h3,small,label) { color:var(--text-secondary); }
html body .lc-chat button { color:var(--text-primary); min-height:44px; }
html body .lc-chat :is(textarea,input) { background:var(--surface-input); color:var(--text-primary); border:1px solid var(--border-control); }
html body .lc-chat__live { background:var(--leaf); box-shadow:none; }
html body :is(.lc-chat__launcher,.lc-chat__avatar) { background:var(--surface-raised); animation:none; }
html body .lc-chat__human { background:var(--leaf); color:var(--text-on-accent); }

/* Auth and operational UI use the same tokens without changing session logic. */
html body[data-page='auth'],html body[data-page='auth'].is-auth-signed-out { background:var(--bg-page); color:var(--text-primary); }
html body[data-page='auth'] :is(.auth-shell,.auth-login-zone,.auth-panel,.portal-shell,.portal-main,.portal-panel) { background:var(--bg-page); color:var(--text-primary); }
html body[data-page='auth'] :is(.portal-sidebar,.portal-card,.analytics-card,.portal-record,.portal-ops-section,.auth-shell__visual) { background:var(--surface-card); color:var(--text-primary); border-color:var(--border-subtle); border-radius:12px; }
html body[data-page='auth'] :is(.auth-workspace h1,.auth-mode-tabs button,.auth-field-label a,.auth-access a,.auth-legal a) { color:var(--text-primary); }
html body[data-page='auth'].is-auth-signed-out .auth-form .field input { padding:20px 14px 6px; }
html body[data-page='auth'] .auth-form .field label { color:var(--text-muted)!important; }
html body[data-page='auth'] .auth-ascii-art { color:var(--text-accent); }
html body[data-page='lab'] .lab-soon { background:var(--bg-page); color:var(--text-primary); }
html body .shell :is(.rail,.main,.head,.log,.reply) { background:var(--bg-page); color:var(--text-primary); border-color:var(--border-subtle); }
html body .shell :is(.thread-card,.msg,.transcript) { background:var(--surface-card); color:var(--text-primary); border-color:var(--border-subtle); }
html body .shell .button { background:var(--leaf); color:var(--text-on-accent); min-height:44px; border-radius:8px; }
html body .shell .button.secondary { background:var(--surface-raised); color:var(--text-primary); border:1px solid var(--border-control); }

@media(max-width:767px) {
  html body header.site-header { padding:12px; }
  html body header.site-header .top-wrap { padding:8px 12px; min-height:64px; }
  html body :is(.sx,.hx,.page-section) { padding-inline:20px; }
  html body :is(.sx__inner,.hx__inner) { padding-inline:0; }
  html body[data-page='home'] .hero .top-wrap { padding:120px 20px 48px; }
  html body[data-page='home'] .hero-intro h1 { font-size:40px; }
  html body[data-page='home'] .hero-intro__actions { display:grid; grid-template-columns:1fr; gap:12px; }
  html body[data-page='home'] .hero-action { justify-content:center; width:100%; }
  html body[data-page='home'] :is(#built-in-africa,#process) .sx-steps__list { grid-template-columns:1fr; }
  html body[data-page='home'] #start .sx__inner { padding:20px; }
  html body :is(.pr-grid,.sx-pricing__grid,.sx-features__grid,.sx-quotes__grid,.aud__grid) { grid-template-columns:minmax(0,1fr); }
  html body :is(.form-row,.career-form__grid) { grid-template-columns:minmax(0,1fr); }
  html body :is(.sx-compare table) { width:100%; min-width:0; table-layout:fixed; font-size:12px; }
  html body .sx-compare :is(th,td) { min-width:0; padding:12px 5px; overflow-wrap:anywhere; }
  html body .shell .head { flex-wrap:wrap; padding:20px; }
  html body .shell .reply { padding:16px; }
}

/* CSS and JS agree: non-essential motion is optional; content never depends on it. */
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
  html body :is([data-animate-in],[data-reveal],.reveal) { opacity:1!important; visibility:visible!important; transform:none!important; clip-path:none!important; }
  html body :is(.pb-track,.hx-marquee__track) { transform:none!important; }
  html body .pb-track { flex-wrap:wrap; width:auto; justify-content:center; }
  html body .pb-track [aria-hidden='true'] { display:none; }
}

/* Live-demo semantic aliases; family declarations remain in their original files. */
html :is(body.ld-kit,body .ld-mockup,body .ld-kit) {
 --demo-accent:var(--leaf); --demo-deep:var(--mint); --demo-soft:var(--surface-raised);
 --demo-ink:var(--text-primary); --demo-muted:var(--text-muted); --demo-rule:var(--border-subtle); --demo-paper:var(--surface-card);
 --ld-green:var(--leaf); --ld-green-deep:var(--mint); --ld-mint:var(--surface-raised);
 --ld-ink:var(--text-primary); --ld-muted:var(--text-muted); --ld-line:var(--border-subtle);
 --ld-white:var(--surface-card); --ld-paper:var(--surface-card); --ld-shadow:var(--shadow-panel);
 --ld-sky:var(--sky); --ld-aqua:var(--aqua); --ld-sand:var(--sand); --ld-yellow:var(--sun);
 color:var(--text-primary); color-scheme:dark;
}
html :is(body.ld-kit,body .ld-mockup) :is(.ld-window,.ld-browser,.ld-real-phone,.ld-device,.ld-platform-menu,.ld-safari-toolbar,.ld-platform-dock,.studio-workspace,.studio-sidebar,.studio-main) {background:var(--surface-card);color:var(--text-primary);border-color:var(--border-subtle);}
html :is(body.ld-kit,body .ld-mockup) :is(.ld-btn,.ld-primary) {background:var(--leaf);color:var(--text-on-accent);border-radius:8px;min-height:44px;}
html :is(body.ld-kit,body .ld-mockup) .ld-btn--ghost {background:var(--surface-raised);color:var(--text-primary);border:1px solid var(--border-control);}
html :is(body.ld-kit,body .ld-mockup) :is(input,textarea,select) {background:var(--surface-input);color:var(--text-primary);border:1px solid var(--border-control);}
html :is(body.ld-kit,body .ld-mockup) :is(.ld-chip--sand,.ld-chip--sky,.ld-chip--aqua) {background:var(--surface-raised);color:var(--text-highlight);}
html :is(body.ld-kit,body .ld-mockup) .ld-pressed {transform:none;}
html :is(body.ld-kit,body .ld-mockup) :is(.ld-label,.ld-mute,.ld-url) {color:var(--text-muted);}
html body :is(.lc-consent,.lc-prefs) {--c-paper:var(--surface-card);--c-ink:var(--text-primary);--c-deep:var(--mint);--c-rule:var(--border-subtle);background:var(--surface-card);color:var(--text-primary);border-radius:16px;}
html body .lc-prefs {background:transparent;}
html body .lc-prefs__panel {background:var(--surface-card);color:var(--text-primary);border:1px solid var(--border-subtle);border-radius:16px;}
html body :is(.lc-consent,.lc-prefs) .lc-c-btn {background:var(--surface-raised);color:var(--text-primary);border:1px solid var(--border-control);border-radius:8px;min-height:44px;}
html body [data-system-reveal] {opacity:0;transform:translateY(8px);transition:opacity 360ms var(--ease-system),transform 360ms var(--ease-system);}
html body [data-system-reveal].is-revealed {opacity:1;transform:none;}
html.has-reveal body [data-reveal] {transition-duration:360ms;transition-delay:0ms;}

/* Resolve scoped legacy tokens at their original owning elements. */
html body[data-page='home'] {--home-canvas:var(--bg-page);--home-ink:var(--text-primary);--home-dark:var(--bg-section);--section-y:clamp(64px,7.2vw,104px);}
html body .client-portal {--pp-paper:var(--bg-page);--pp-card:var(--surface-card);--pp-card-2:var(--surface-raised);--pp-ink:var(--text-primary);--pp-ink-hover:var(--mint);--pp-muted:var(--text-muted);--pp-line:var(--border-subtle);--pp-purple:var(--leaf);--pp-radius:12px;}
html body[data-page] :is(.page-main,.page-intro),html body[data-page='faq'] #main-content {background:var(--bg-page)!important;color:var(--text-primary);}
html body[data-page='home'] .powered-by {background:var(--bg-section)!important;}
html body .pb-logo__name {color:var(--text-muted)!important;}
html body header.site-header .menu-segment--cta>.header-nav-link {background:var(--leaf);border-radius:8px;min-height:44px;padding:12px 16px;}
html body header.site-header .menu-segment--cta .header-nav-label {color:var(--text-on-accent)!important;}
html body[data-page] :is(.sx__lede,.hx__lede,.sx-faq__answer,.sx-faq__answer p,.pr-cur__label,.pr-price__prefix,.pr-price__unit) {color:var(--text-secondary)!important;}
html body[data-page] :is(.contact-aside__label,.contact-form-head>span,.call-aside>span,.book-aside>span,.lab-soon__badge) {color:var(--text-highlight)!important;}
html body .system-path :is(h2,h2 span) {color:var(--text-primary)!important;}
html body :is(.sx-plan__flag,.pr-blob .sx-plan__flag) {background:var(--surface-raised)!important;color:var(--text-highlight)!important;border:1px solid var(--leaf);}
html body .sx-plan__price span {color:var(--text-primary)!important;}
html body :is(.cs__link,.cs-next__link) {background:var(--surface-card)!important;color:var(--text-highlight)!important;}
html body .fq__ask .hc__link {background:transparent!important;color:var(--text-highlight)!important;}
html body[data-page='auth'].is-auth-signed-out .auth-form .field label,
html body[data-page='auth'].is-auth-signed-out .auth-legal a,
html body[data-page='auth'] .auth-footer,html body[data-page='auth'] .auth-footer a {color:var(--text-muted)!important;}
html body[data-page='auth'] .auth-footer {background:var(--bg-page);}
html body[data-page='home'] .hw__more .sx-btn :is(span,svg) {color:var(--text-on-accent)!important;}

html body[data-page='careers'] .page-section.alt,html body[data-page='faq'] .fq__ask {background:var(--bg-section)!important;}
html body .hw__project-link {background:var(--leaf);color:var(--text-on-accent);border-radius:8px;}
html body .hw__project-link span {color:var(--text-on-accent)!important;}
html :is(body.ld-kit,body .ld-mockup) .iv-invoice small {opacity:1;color:var(--text-muted);}
html body[data-page='book'] .book-next :is(span,p),html body[data-page='book'] .call-note span {color:var(--text-secondary)!important;}
html body[data-page='home'] .hero .top-wrap {align-content:start;}
html body .floating-scroll-menu {left:50%;right:auto;bottom:16px;transform:translateX(-50%)!important;width:max-content;max-width:calc(100% - 40px);border-radius:12px;padding:4px 12px;}
@media(max-width:767px){html body .floating-scroll-menu {max-width:calc(100% - 24px);}}

html body[data-page='book'] .book-assurance>span {color:var(--text-highlight)!important;}
html :is(body.ld-kit,body .ld-mockup) .iv-invoice small {opacity:1!important;}

html body[data-page='faq'] .fq__ask .sx__title {color:var(--text-primary)!important;}
html body .cs__tags li {background:var(--surface-raised)!important;color:var(--text-highlight);}
html body .cs-next__eyebrow {color:var(--text-muted)!important;}

/* The optional assistant shares the system even while its public loader is off. */
html body .lc-chat :is(.lc-chat__bob,.lc-chat__ground,.lc-chat__face,.lc-chat__avatar)::before,
html body .lc-chat :is(.lc-chat__bob,.lc-chat__ground,.lc-chat__face,.lc-chat__avatar) {animation:none!important;}
html body .lc-chat :is(.lc-chat__panel,.lc-chat__welcome,.lc-chat__utility,.lc-chat__ask,.lc-chat__thinking,.lc-chat__handoff,.lc-chat__route,.lc-chat__reaction,.lc-chat__attachment,.lc-chat__msg--bot) {background:var(--surface-card)!important;color:var(--text-primary)!important;border-color:var(--border-control)!important;}
html body .lc-chat :is(.lc-chat__hero,.lc-chat__title,.lc-chat__intro,.lc-chat__composer-label,.lc-chat__note,.lc-chat__status,.lc-chat__route-note,.lc-chat__route a,.lc-chat__source) {color:var(--text-secondary)!important;}
html body .lc-chat .lc-chat__msg--user {background:var(--leaf);color:var(--text-on-accent);}
html body .lc-chat .lc-chat__send {padding:10px;min-width:44px;min-height:44px;}
html body .lc-chat .lc-chat__input {border:0;min-width:0;padding:8px;}
html body .lc-chat .lc-chat__form {background:var(--surface-input);border:1px solid var(--border-control);border-radius:8px;}
html body .lc-chat .lc-chat__label {background:var(--surface-card);color:var(--text-primary);}

/* Demo controls remain usable at phone size; dense screens scroll vertically. */
html :is(body.ld-kit,body .ld-mockup) button {min-height:44px;min-width:44px;}
html :is(body.ld-kit,body .ld-mockup) :is(.ld-body,.ld-device-screen,.ft-app,.iv-detail,.studio-main) {overflow-y:auto;}
html :is(body.ld-kit,body .ld-mockup) .ft-check {min-height:44px;}
html :is(body.ld-kit,body .ld-mockup) :is(.ap-tabs,.studio-sidebar nav) {flex-shrink:0;}
html :is(body.ld-kit,body .ld-mockup) .iv-invoice {min-height:48px;}
html body [data-reveal] {--reveal-shift:8px;}

html body .modal-menu:not(.active) {visibility:hidden!important;opacity:0!important;pointer-events:none;}
html body .modal-menu.active {visibility:visible;opacity:1;transition:none;}
html body .lc-chat.is-open .lc-chat__panel {visibility:visible!important;opacity:1!important;clip-path:none!important;transform:none!important;transition:opacity 160ms;}
html body .client-portal :is(.portal-stat,.portal-stat--ink,.portal-stat--sun,.portal-stat--sky,.portal-stat--card) {background:var(--surface-card);color:var(--text-primary);border:1px solid var(--border-subtle);border-radius:12px;}
html body .client-portal .portal-stat strong {color:var(--text-accent);}
html body .client-portal .portal-stats {gap:16px;padding:20px;background:var(--bg-page);border:0;}
html body .client-portal .portal-tabs button.is-active {background:var(--surface-raised);color:var(--text-highlight);border:1px solid var(--leaf);border-radius:8px;}
html body .client-portal .portal-tabs__count {background:var(--surface-raised);color:var(--text-highlight);}
html body .client-portal :is(.portal-block,.portal-quick__item,.portal-compose,.portal-item,.analytics-figure) {border:1px solid var(--border-subtle);border-radius:12px;}
html body .client-portal :is(.portal-overview,.analytics-figures) {background:transparent;gap:16px;}
html body .client-portal .analytics-figure__change.is-positive {color:var(--text-accent);}
html body .client-portal .analytics-figure__change.is-negative {color:var(--sun);}
html body .client-portal .portal-dashboard-footer {min-height:0;height:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:24px;background:var(--surface-card);}
html body .client-portal :is(.portal-button,.portal-link) {border:1px solid var(--border-control);border-radius:8px;min-height:44px;}
html body .client-portal .portal-button--primary {background:var(--leaf);color:var(--text-on-accent);}

@media(max-width:767px) {
 html body .client-portal .portal-tabs {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));position:relative;top:auto;gap:8px;overflow:visible;}
 html body .client-portal .portal-tabs button {min-width:0;min-height:44px;padding:8px;font-size:12px;white-space:normal;line-height:1.3;}
 html body .client-portal .portal-tabs button::before {display:none;}
 html body .analytics-table-wrap {overflow:visible;}
 html body .analytics-records :is(table,thead,tbody,tr) {display:block;width:100%;}
 html body .analytics-records thead tr {display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}
 html body .analytics-records th {padding:0;border:0;}
 html body .analytics-records th button {min-height:44px;padding:8px;border:1px solid var(--border-control);border-radius:8px;}
 html body .analytics-records tbody tr {padding:12px;border:1px solid var(--border-subtle);border-radius:8px;margin-bottom:12px;}
 html body .analytics-records td {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:12px;white-space:normal;overflow-wrap:anywhere;padding:8px 0;border:0;}
 html body .analytics-records td::before {content:attr(data-column-label);color:var(--text-muted);}
 html body .analytics-pagination {flex-wrap:wrap;}
 html body .analytics-pagination button {min-height:44px;}
}

html body[data-page='auth'] {--leaf:#479C73;--green:var(--leaf);--ground:var(--bg-page);--bg:var(--bg-page);--surface:var(--bg-page);--green-bg:var(--bg-page);--button-green:var(--leaf);--deep:var(--bg-section);--accent:var(--leaf);--green-accent:var(--leaf);--green-strong:var(--mint);--green-text:var(--mint);--ink:var(--text-primary);--leaf-muted:var(--text-muted);}
html body .lc-chat .lc-chat__welcome-body {background:var(--surface-card)!important;color:var(--text-primary);border:1px solid var(--border-subtle);}
html body .client-portal :is(.portal-button,.portal-link,.portal-mini-button) {padding:10px 12px;}

html body .auth-divider {color:var(--text-muted);}

html body .hw__site-foot :is(strong,small,.hw__go) {color:var(--text-primary)!important;}
html body .hx-crop__word {color:var(--text-primary);}

html body.ld-kit .ld-chip {background:var(--surface-raised);color:var(--text-highlight);}

html body[data-page='home'] #process .sx-step::before {color:var(--text-accent)!important;}
html body[data-page='home'] :is(#process,#built-in-africa) .sx-step {border:1px solid var(--border-subtle)!important;}
/* One quiet, complete tools row: no moving duplicates or clipped labels. */
html body .pb-logo {color:var(--text-muted)!important;}
@media(hover:hover) and (prefers-reduced-motion:no-preference){html body .aud__card:hover {transform:translateY(-2px);}}

/* Round two: measured typography, content-led layout and a common component scale.
   Existing font files/families are deliberately retained. */
:root {
  --space-unit:4px; --space-tight:8px; --space-label:12px; --space-item:16px;
  --space-group:24px; --space-card:32px; --space-layout:48px; --space-band:64px;
  --content-width:1200px;
  --type-hero:clamp(38px,4.2vw,60px);
  --type-section:clamp(30px,3.34vw,48px);
  --type-card:clamp(21px,1.7vw,24px);
  --type-body:16px; --type-lead:clamp(17px,1.4vw,20px); --type-label:12px;
  --leading-display:1.08; --leading-title:1.2; --leading-body:1.6;
  --radius-control:12px; --radius-card:16px; --radius-panel:24px;
  --radius-small:8px; --panel-padding:clamp(24px,3.34vw,48px);
  --section-y:clamp(64px,7.8vw,112px);
  --shadow-inset:inset 0 1px 0 rgb(246 245 243 / 5%);
  --shadow-panel:var(--shadow-inset),0 16px 48px rgb(0 0 0 / 20%);
  --type-disp-sm:var(--type-body); --type-disp-md:var(--type-card);
  --type-disp-lg:var(--type-section); --type-disp-xl:var(--type-hero); --type-disp-2xl:var(--type-hero);
}
html body[data-page='home'] {--section-y:clamp(64px,7.8vw,112px);}
html body :is(h1,h2,h3,h4,.sx__title,.hx__title,.c-title,.p-title,.wp__title,.wx__title) {
  text-transform:none; letter-spacing:-.02em;
}
html body :is(.page-intro h1,.page-hero h1,.lab-soon h1) {
  font-size:var(--type-hero); font-weight:400; line-height:var(--leading-display); max-width:20ch;
}
html body :is(.sx__title,.hx__title,.page-section>h2,.page-section>.container>h2,.wp__heading,.wx__heading,.wcta__title,.cs__title) {
  font-size:var(--type-section); font-weight:400; line-height:var(--leading-display);
}
html body :is(.c-title,.sx-feature__title,.sx-step__title,.hx-manifest__title,.wx__title) {
  font-size:var(--type-card); font-weight:400; line-height:var(--leading-title); margin-bottom:16px;
}
html body :is(.p-title,.fq__group-title,.wp__title) {font-size:clamp(26px,2.5vw,36px);font-weight:400;line-height:1.15;}
html body :is(.sx__lede,.hx__lede,.page-intro p,.pillar p,.c-copy) {font-size:var(--type-lead);line-height:var(--leading-body);max-width:60ch;}
html body :is(.sx-step__body,.sx-feature__body,.pr-plan__summary,.sx-plan__list,.sx-faq__answer,.aud__copy) {font-size:var(--type-body);line-height:var(--leading-body);}
html body :is(.sx__eyebrow,.hx__eyebrow,.section-label,.hero-intro__eyebrow) {font-size:var(--type-label);line-height:1.5;letter-spacing:.06em;}
html body :is(.sx__head,.hx__head) {gap:16px;margin-bottom:48px;max-width:760px;}
html body .sx__head--center {max-width:760px;}
html body .page-intro {padding-top:clamp(144px,12vw,176px);padding-bottom:64px;}
html body .page-intro :is(h1,p) {margin-bottom:24px;}

/* Quiet navigation in every scroll state, including legacy is-bottom/menu states. */
html body header.site-header .top-wrap,
html body header.site-header.is-scrolled:not(.menu-open) .top-wrap {
  max-width:1280px;min-height:64px;background:rgb(48 50 54 / 94%)!important;
  border:1px solid var(--border-subtle);border-radius:var(--radius-card);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
html body header.site-header .header-nav-label {font-size:12px;letter-spacing:0;}
html body header.site-header .menu-segment--cta>.header-nav-link {border-radius:var(--radius-control);}
html body header.site-header .header-submenu {padding:8px;border-radius:var(--radius-card);}
html body header.site-header .header-submenu a {border-radius:var(--radius-small);padding:12px;}
html body .floating-scroll-menu {box-shadow:var(--shadow-panel);padding:4px 12px;}
html body .floating-scroll-menu button {min-height:44px;}
html body .floating-scroll-menu button span {font-size:11px;letter-spacing:.02em;}

/* Shared controls: readable labels and geometry; no oversized decorative button frames. */
html body :is(.sx-btn,.hero-action,.pr-plan__cta,.button-frame,.contact-submit,.call-submit,.auth-submit,.career-submit,.form-submit) {
  min-height:48px; border-radius:var(--radius-control)!important; font-size:14px;line-height:1.3;
  letter-spacing:0;text-transform:none;padding:12px 20px;gap:12px;
}
html body .button-frame {width:auto;height:auto;display:inline-flex!important;align-items:center;justify-content:center;}
html body .button-frame>svg.plaisio {display:none;}
html body .button-frame .label-wrap {position:static;inset:auto;padding:0;gap:16px;}
html body .button-frame .label-wrap span {font-size:12px;line-height:1.5;letter-spacing:0;}
html body :is(.sx-btn--ghost,.hero-action:not(.hero-action--primary)) {border-color:var(--border-control)!important;}
html body :is(.sx-card,.sx-plan,.pr-blob,.sx-step,.sx-quote,.hx-stack__card,.hx-showcase__panel,.aud__card,.wx__card) {border-radius:var(--radius-card)!important;box-shadow:var(--shadow-inset);}
html body :is(.sx-features__grid,.sx-quotes__grid,.pr-grid,.sx-pricing__grid,.aud__grid) {gap:24px;}
html body .sx-feature__icon {border-radius:12px;color:var(--text-highlight);}
html body :is(.contact-form-panel,.career-form,.hc__form,.js-review-form,.auth-form,.portal-form) {border-radius:var(--radius-card);padding:var(--panel-padding);}
html body form .field :is(input,textarea,select) {font-size:16px;line-height:1.5;border-radius:var(--radius-control)!important;}
html body form .field label {font-size:13px;line-height:1.5;}
html body :is(.form-row,.career-form__grid) {gap:24px;}
html body :is(.contact-form-head,.call-form-head) {margin-bottom:24px;}
html body :is(.contact-aside,.book-aside,.call-aside,.review-aside) {line-height:1.6;}

/* Hero: one content measure, lighter display type and a restrained brand glow. */
html body[data-page='home'] .hero .inner-wrap {width:calc(100% - 2 * var(--gutter));max-width:var(--content-width);padding:0;margin-inline:auto;}
html body[data-page='home'] .hero .top-wrap {display:grid;grid-template-columns:1fr;padding:160px 0 56px;gap:32px;}
html body[data-page='home'] .hero-intro {max-width:800px;margin:0;}
html body[data-page='home'] .hero-intro h1 {font-size:var(--type-hero);font-weight:400;line-height:var(--leading-display);letter-spacing:-.025em;max-width:21ch;}
html body[data-page='home'] .hero-intro__lede {font-size:var(--type-lead);max-width:53ch;line-height:var(--leading-body);margin-top:24px;}
html body[data-page='home'] .hero-intro__actions {margin-top:32px;}
html body[data-page='home'] .hero::after {background:linear-gradient(90deg,rgb(12 12 12 / 96%),rgb(12 12 12 / 76%)),var(--hero-glow);}
html body[data-page='home'] .hero .text-list {margin:0;padding:24px 0 0;border-top:1px solid var(--border-subtle);max-width:720px;gap:32px;}
html body[data-page='home'] .hero .text-list .js-scramble-text {font-size:11px;line-height:1.6;}
html body[data-page='home'] .hero .bottom-wrap {padding:16px 0 24px;background:transparent;}
html body[data-page='home'] .hero .scroll-cue {min-height:44px;align-items:center;}
html body .powered-by {padding-block:32px;}
html body .pb-caption {font-size:11px;letter-spacing:.05em;margin-bottom:24px;}

/* Studio and capabilities: intrinsic grids replace the inherited viewport-height rails. */
html body[data-page='home'] ._01>.inner-wrap {padding:var(--section-y) var(--gutter);}
html body[data-page='home'] ._01>.inner-wrap>.header {max-width:var(--content-width);margin:0 auto 32px;padding:0;}
html body[data-page='home'] ._01 .info-section {
  max-width:var(--content-width);margin:auto;padding:0;min-height:0;height:auto;
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-rows:auto 1fr;gap:24px 64px;
}
html body[data-page='home'] ._01 .info-section>.title {font-size:var(--type-section);font-weight:400;line-height:1.1;letter-spacing:-.02em;max-width:18ch;margin:0;}
html body[data-page='home'] ._01 .info-section>.description {grid-column:1;grid-row:2;margin:0;max-width:45ch;font-size:var(--type-lead);line-height:1.6;color:var(--text-secondary)!important;}
html body[data-page='home'] ._01 .info-section>.image-wrap {grid-column:2;grid-row:1 / 3;aspect-ratio:auto;width:100%;height:auto;min-height:0;margin:0;align-self:start;border:1px solid var(--border-subtle);border-radius:var(--radius-panel);background:var(--surface-card);}
html body[data-page='home'] ._01 .info-section>.image-wrap::after {display:none;}
html body[data-page='home'] .sections {padding-inline:var(--gutter);}
html body[data-page='home'] .sections .section {
  display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:auto auto 1fr;
  column-gap:64px;row-gap:24px;width:100%;max-width:var(--content-width);margin:0 auto;
  padding:var(--section-y) 0;min-height:0;height:auto;overflow:visible;box-shadow:none;
}
html body[data-page='home'] .sections .section>.header {grid-column:1;grid-row:1;font-size:12px;line-height:1.5;letter-spacing:.04em;}
html body[data-page='home'] .sections .section>.title {grid-column:1;grid-row:2;font-size:var(--type-section);font-weight:400;line-height:1.1;letter-spacing:-.02em;text-transform:none;margin:0;max-width:100%;}
html body[data-page='home'] .sections .section>.text-wrap {grid-column:1;grid-row:3;max-width:100%;}
html body[data-page='home'] .sections .section .description {font-size:17px;line-height:1.6;color:var(--text-secondary)!important;}
html body[data-page='home'] .sections .section .list {margin:24px 0 32px;padding:0;}
html body[data-page='home'] .sections .section .list li {padding:8px 0 8px 20px;position:relative;}
html body[data-page='home'] .sections .section .list li::before {content:'';position:absolute;left:0;top:18px;width:5px;height:5px;border-radius:50%;background:var(--leaf);}
html body[data-page='home'] .sections .section .list .title {font-size:16px;font-weight:400;line-height:1.6;letter-spacing:0;margin:0;max-width:none;}
html body[data-page='home'] .sections .section .text-wrap .button-frame {margin:0;}
html body[data-page='home'] .sections .section>.lottie-container {
  grid-column:2;grid-row:1 / 4;position:relative;inset:auto;width:100%;height:auto;min-height:0;padding:24px;
  align-self:center;border-radius:var(--radius-panel);background:radial-gradient(ellipse at 100% 0,rgb(71 156 115 / 7%),transparent 70%),var(--surface-card)!important;
  box-shadow:var(--shadow-inset);overflow:hidden;
}
html body[data-page='home'] ._02 .inner-wrap {max-width:calc(var(--content-width) + 2 * var(--gutter));margin:auto;}
html body[data-page='home'] ._02 .experience {grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);grid-template-rows:auto auto;gap:24px 64px;align-items:start;}
html body[data-page='home'] ._02 .experience .media-wrap {margin:0;grid-row:1 / 3;}
html body[data-page='home'] ._02 .experience .image-wrap {max-width:none;border:1px solid var(--border-subtle);border-radius:var(--radius-panel);}
html body[data-page='home'] ._02 .experience .title {font-size:var(--type-section);font-weight:400;line-height:1.1;}
html body[data-page='home'] ._02 .experience .text-wrap .button-frame {margin:32px 0 0;align-self:start;}
html body[data-page='home'] ._02 .experience .description {font-size:var(--type-lead);line-height:1.6;color:var(--text-secondary)!important;margin:0;}
html body[data-page='home'] .system-path h2 {font-size:var(--type-section);font-weight:400;line-height:1.1;letter-spacing:-.02em;}
html body[data-page='home'] .system-path__layout {align-items:start;gap:64px;}
html body[data-page='home'] .system-path__steps li {border-color:var(--border-subtle);padding:24px 0;}
html body[data-page='home'] .system-path__steps li:first-child {padding-top:0;border-top:0;}
html body[data-page='home'] .system-path__steps h3 {font-size:var(--type-card);font-weight:400;line-height:1.2;margin-bottom:8px;}
html body[data-page='home'] .system-path__steps p {font-size:16px;color:var(--text-secondary);}
html body[data-page='home'] :is(.system-path__number,.system-path__route) {color:var(--text-highlight);}
html body[data-page='home'] ._03 {min-height:0;}
html body[data-page='home'] ._03>.header {max-width:calc(var(--content-width) + 2 * var(--gutter));margin:0 auto 32px;padding-inline:var(--gutter);}
html body[data-page='home'] .aud__grid {max-width:var(--content-width);}
html body[data-page='home'] .aud__card {padding:24px;gap:16px;}
html body[data-page='home'] .aud__media {border-radius:var(--radius-control);aspect-ratio:auto;}
html body[data-page='home'] .aud__tag {font-size:12px;line-height:1.5;padding-top:0;}
html body[data-page='home'] .typography-section {height:auto;min-height:0;max-height:none;padding:var(--section-y) var(--gutter);background:var(--bg-section);}
html body[data-page='home'] .typography-section .row-wrap {max-width:var(--content-width);width:100%;margin-inline:auto;gap:24px;}
html body[data-page='home'] .typography-section .title {font-size:clamp(36px,5vw,64px);font-weight:400;line-height:1.1;letter-spacing:-.025em;text-transform:none;}
html body[data-page='home'] .typography-section .js-scramble-text {font-size:12px;line-height:1.5;}
html body[data-page='home'] #start .sx__inner {padding:var(--panel-padding);border-radius:var(--radius-panel);gap:48px;box-shadow:var(--shadow-inset);}
html body[data-page='home'] #start .hc__form {padding:0;border:0;background:transparent;}

/* Process, work and pricing each have a clear reading order and aligned content. */
html body :is(#process,#built-in-africa) .sx-steps__list {gap:16px;}
html body :is(#process,#built-in-africa) .sx-step {padding:64px 24px 24px;}
html body :is(#process,#built-in-africa) .sx-step::before {top:24px;left:24px;font-size:13px;}
html body .sx-step::after {display:none;}
html body :is(.pr-blob,.sx-plan) {padding:32px;gap:24px;}
html body .pr-blob .sx-plan__name {font-size:13px;line-height:1.5;letter-spacing:.02em;}
html body .pr-blob .pr-price__val {font-size:clamp(38px,3.2vw,48px);font-weight:400;line-height:1.1;letter-spacing:-.02em;}
html body .pr-blob .pr-plan__summary {max-width:none;}
html body .pr-blob .sx-plan__list {padding-top:24px;border-top:1px solid var(--border-subtle);}
html body .pr-blob .sx-plan__list li {line-height:1.6;}
html body .pr-blob .pr-plan__cta {margin-top:auto;gap:12px;justify-content:space-between;}
html body .pr-blob--glow.sx-plan--featured {background:linear-gradient(180deg,var(--accent-wash),transparent 55%),var(--surface-card)!important;}
html body .sx-plan__flag {border-radius:var(--radius-small);font-size:11px;line-height:1.5;}
html body :is(.pr-tabs,.wk__filters,.fq__chips) {gap:8px;flex-wrap:wrap;}
html body :is(.pr-tab,.wk__filter,.fq__chip) {border-radius:var(--radius-control);padding:12px 16px;font-size:12px;line-height:1.4;}
html body .sx-compare table {border-radius:var(--radius-card);overflow:hidden;}
html body .sx-compare :is(th,td) {padding:20px 16px;font-size:14px;line-height:1.5;}
html body .pr-svc__row {padding:24px;border:1px solid var(--border-subtle);border-radius:var(--radius-card);background:var(--surface-card);}
html body :is(.sx-faq__item summary) {font-size:clamp(18px,1.5vw,22px);font-weight:400;line-height:1.4;padding:24px 0;gap:24px;}
html body .sx-faq__item[open] {padding-inline:24px;border-radius:var(--radius-card);}
html body .sx-faq__answer {padding-bottom:24px;}
html body :is(.hw__site-link,.wk__tile,.wp__shot,.client-browser,.cs__media.client-browser) {border-radius:var(--radius-card)!important;border:1px solid var(--border-subtle);box-shadow:var(--shadow-inset);}
html body .hw__site-foot {padding:20px 24px;gap:12px;}
html body .hw__site-foot strong {font-size:18px;font-weight:400;line-height:1.3;}
html body :is(.wp__item,.cs__grid) {gap:48px;}
html body .cs__facts {gap:16px;}
html body .cs__facts>div {border:1px solid var(--border-subtle);border-radius:var(--radius-card);padding:24px;}
html body .cs-next__link {border:1px solid var(--border-subtle);border-radius:var(--radius-panel);padding:32px;}
html body :is(.cards .card,.pillar) {border:1px solid var(--border-subtle);border-radius:var(--radius-card);padding:32px;background:var(--surface-card);}
html body .legal-doc {max-width:800px;line-height:1.7;}
html body .legal-doc h2 {font-size:22px;font-weight:400;line-height:1.3;margin-top:40px;}
html body .legal-doc :is(p,li) {font-size:16px;line-height:1.7;}

/* Product demonstrations: same panel language, preserved individual interface fonts. */
html :is(body.ld-kit,body .ld-mockup) {--ld-radius:16px;--ld-radius-sm:8px;}
html :is(body.ld-kit,body .ld-mockup) :is(.ld-device,.ld-window,.ld-browser,.ld-real-phone,.studio-workspace) {border:1px solid var(--border-subtle);border-radius:var(--radius-card);box-shadow:var(--shadow-panel);}
html :is(body.ld-kit,body .ld-mockup) :is(.ld-btn,.ld-primary,input,textarea,select) {border-radius:var(--radius-control);}
html :is(body.ld-kit,body .ld-mockup) :is(.ld-label,.ld-mute,.ld-url) {line-height:1.5;}
/* No scrollbars inside the interactive mockups. Their panels still scroll by
   wheel, touch and keyboard; this sheet loads last, so it has the final say. */
html body .ld-mockup,html body .ld-mockup * {scrollbar-width:none!important;}
html body .ld-mockup::-webkit-scrollbar,html body .ld-mockup *::-webkit-scrollbar {display:none!important;width:0;height:0;}
html :is(body.ld-kit,body .ld-mockup) :is(.iv-heading h3,.studio-heading h3) {font-size:24px;font-weight:400;letter-spacing:-.02em;line-height:1.2;}
html :is(body.ld-kit,body .ld-mockup) :is(.iv-invoice b,.iv-invoice small) {font-size:12px;line-height:1.5;}
html :is(body.ld-kit,body .ld-mockup) .iv-invoice {padding:12px;}
html :is(body.ld-kit,body .ld-mockup) .studio-sidebar nav {gap:8px;}

/* Portal, account and inbox: compact operational hierarchy, shared controls. */
html body[data-page='auth'] .auth-workspace h1 {font-size:var(--type-hero);font-weight:400;line-height:1.08;letter-spacing:-.025em;}
html body[data-page='auth'] .auth-form {padding:32px;}
html body .client-portal {--pp-radius:var(--radius-card);}
html body .client-portal :is(.portal-header h2,.analytics-toolbar h3) {font-size:clamp(28px,2.5vw,36px);font-weight:400;line-height:1.15;letter-spacing:-.02em;}
html body .client-portal :is(.portal-block,.portal-card,.portal-ops-section,.portal-compose,.analytics-card,.portal-item,.portal-workspace-summary>div) {padding:24px;border:1px solid var(--border-subtle);border-radius:var(--radius-card);box-shadow:var(--shadow-inset);}
html body .client-portal :is(.portal-stat,.analytics-figure) {min-height:132px;padding:24px;border-radius:var(--radius-card);}
html body .client-portal :is(.portal-stat strong,.analytics-figure strong) {font-size:32px;font-weight:400;letter-spacing:-.02em;line-height:1.15;font-variant-numeric:tabular-nums;}
html body .client-portal :is(.portal-button,.portal-mini-button,.portal-link) {min-height:44px!important;padding:10px 16px;border:1px solid var(--border-control)!important;border-radius:var(--radius-control)!important;font-size:13px;line-height:1.4;}
html body .client-portal .portal-button--primary {background:var(--leaf)!important;color:var(--text-on-accent)!important;border-color:var(--leaf)!important;}
html body .client-portal :is(input,select,textarea) {border:1px solid var(--border-control);border-radius:var(--radius-control);min-height:44px;font-size:16px;line-height:1.5;}
html body .client-portal .portal-tabs button {border-radius:var(--radius-control);min-height:44px;line-height:1.4;}
html body .client-portal .portal-tabs button.is-active {box-shadow:var(--shadow-inset);}
html body .client-portal :is(.portal-overview,.analytics-grid,.analytics-figures) {gap:24px;}
html body .client-portal .portal-empty {border:1px dashed var(--border-control);border-radius:var(--radius-card);padding:32px;text-align:left;}
html body .client-portal :is(.portal-block__head h3,.portal-card h3,.analytics-card__head h4) {font-size:20px;font-weight:400;line-height:1.3;}
html body .shell :is(.thread-card,.msg,.transcript) {border-radius:var(--radius-card);padding:20px;}
html body .shell :is(.button,input,textarea) {border-radius:var(--radius-control);}

/* Footer: a useful close rather than another full-height hero. */
html body footer[data-shared-footer] {min-height:0;padding:64px var(--gutter) 32px;gap:48px;}
html body footer[data-shared-footer]>.inner-wrap {width:100%;max-width:var(--content-width);margin-inline:auto;min-height:0;height:auto;}
html body footer[data-shared-footer] .info--cols {gap:32px;}
html body footer[data-shared-footer] :is(.footer-newsletter__label,.footer-contact-label) {font-weight:400;line-height:1.5;}
html body footer[data-shared-footer] a {text-underline-offset:5px;}

@media(max-width:1023px) {
 html body[data-page='home'] :is(._01 .info-section,._02 .experience) {column-gap:32px;}
 html body[data-page='home'] .sections .section {column-gap:32px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);}
 html body[data-page='home'] .sections .section>.lottie-container {padding:16px;}
 html body[data-page='home'] .aud__grid {grid-template-columns:repeat(2,minmax(0,1fr));}
 html body :is(.pr-blob,.sx-plan,.cards .card,.pillar) {padding:24px;}
}
@media(max-width:767px) {
 html body :is(.page-intro) {padding-top:128px;padding-bottom:48px;}
 html body :is(.sx__head,.hx__head) {margin-bottom:32px;}
 html body header.site-header .top-wrap {min-height:60px;}
 html body[data-page='home'] .hero .top-wrap {padding:128px 0 40px;gap:32px;}
 html body[data-page='home'] .hero-intro h1 {font-size:var(--type-hero);}
 html body[data-page='home'] .hero .text-list {gap:16px;}
 html body[data-page='home'] .hero .text-list li {padding-left:10px;}
 html body[data-page='home'] .hero .text-list .js-scramble-text {font-size:10px;}
 html body[data-page='home'] ._01 .info-section {grid-template-columns:minmax(0,1fr);grid-template-rows:auto;gap:24px;}
 html body[data-page='home'] ._01 .info-section>.description {grid-column:1;grid-row:2;}
 html body[data-page='home'] ._01 .info-section>.image-wrap {grid-column:1;grid-row:3;height:auto;aspect-ratio:auto;}
 html body[data-page='home'] .sections .section {grid-template-columns:minmax(0,1fr);grid-template-rows:auto;gap:24px;}
 html body[data-page='home'] .sections .section>.lottie-container {grid-column:1;grid-row:4;margin-top:8px;padding:16px;border-radius:var(--radius-card);}
 html body[data-page='home'] .sections .section .text-wrap .button-frame {width:100%;}
 html body[data-page='home'] ._02 .experience {grid-template-columns:minmax(0,1fr);gap:24px;}
 html body[data-page='home'] ._02 .experience .text-wrap {grid-column:1;grid-row:1;}
 html body[data-page='home'] ._02 .experience .description {grid-column:1;grid-row:2;}
 html body[data-page='home'] ._02 .experience .media-wrap {grid-column:1;grid-row:3;}
 html body[data-page='home'] .system-path {padding-inline:var(--gutter);}
 html body[data-page='home'] .system-path__layout {gap:40px;}
 html body[data-page='home'] .aud__grid {grid-template-columns:minmax(0,1fr);}
 html body[data-page='home'] .aud__card {padding:20px;}
 html body[data-page='home'] .typography-section .row-wrap {grid-template-columns:minmax(0,1fr);margin-block:0 24px;}
 html body[data-page='home'] .typography-section .list-wrap {text-align:left!important;}
 html body[data-page='home'] #start .sx__inner {padding:24px;gap:32px;}
 html body .sx-compare :is(th,td) {font-size:12px;padding:16px 6px;}
 html body .sx-faq__item[open] {padding-inline:16px;}
 html body :is(.wp__item,.cs__grid) {gap:24px;}
 html body .client-portal :is(.portal-block,.portal-card,.portal-ops-section,.portal-compose,.analytics-card,.portal-item,.portal-workspace-summary>div) {padding:20px;}
 html body .client-portal :is(.portal-header,.portal-panel,.portal-stats) {padding-inline:20px;}
 html body .client-portal :is(.portal-stat,.analytics-figure) {min-height:120px;padding:20px;}
 html body .client-portal :is(.portal-overview,.analytics-grid,.analytics-figures) {gap:16px;}
 html body .client-portal .portal-tabs {gap:8px;padding:16px 20px;}
 html body .client-portal .portal-tabs button {font-size:12px;padding:8px;}
 html body .client-portal .portal-empty {padding:24px;}
 html body[data-page='auth'] .auth-form {padding:24px;}
 html body footer[data-shared-footer] {padding-block:48px 24px;}
}
@media(hover:hover) {
 html body header.site-header .header-submenu a:hover {background:var(--surface-card);}
 html body .client-portal .portal-button--primary:hover {background:var(--mint)!important;color:var(--text-on-accent)!important;}
 html body :is(.sx-card:has(a),.aud__card:has(a),.cards .card:has(a)):hover {border-color:var(--leaf);box-shadow:var(--shadow-hover);}
}

/* Resolve remaining high-specificity legacy page variants at their owning scope. */
html body[data-page='home'] .hero .top-wrap {width:100%;margin-inline:0;}
html body[data-page='home'] ._01 .info-section>.description {align-self:start;}
html body[data-page='home'] .typography-section .title.st-large>span.d-block {display:inline!important;}
html body header.site-header .header-nav-label {font-weight:400;}
html body[data-page] .pr-grid {--pr-popular:var(--leaf);align-items:stretch;}
html body[data-page] .pr-grid .pr-blob {padding:32px;gap:24px;border:1px solid var(--border-subtle);box-shadow:var(--shadow-inset);}
html body[data-page] .pr-grid .pr-blob--glow.sx-plan--featured {border:1px solid var(--leaf);margin-top:0;padding-top:64px;box-shadow:var(--shadow-hover);}
html body[data-page] .pr-grid .pr-blob .pr-plan__cta {border-radius:var(--radius-control)!important;min-height:48px!important;font-weight:400;font-size:14px;}
html body[data-page] .pr-grid .pr-blob .sx-plan__list li::before {color:var(--text-accent);}
html body[data-page] .pr-grid .pr-blob .sx-plan__name {font-weight:400;margin:0;font-size:18px;line-height:1.3;}
html body[data-page] .pr-grid .pr-blob .pr-plan__price {margin:0;min-height:0;}
html body[data-page] .pr-grid .pr-blob .pr-plan__summary {margin:0;min-height:0;}
html body[data-page] .pr-grid .pr-blob .sx-plan__list {margin:0;padding-top:24px;}
html body[data-page] .pr-grid .pr-blob .sx-plan__list li {line-height:1.5;}
html body[data-page='auth'].is-auth-signed-out .auth-workspace h1 {font-size:var(--type-hero);font-weight:400;line-height:1.08;letter-spacing:-.025em;}
html body[data-page='auth'].is-auth-signed-out .auth-mode-tabs {padding:4px;border-radius:var(--radius-control);background:var(--surface-card);border:1px solid var(--border-subtle);}
html body[data-page='auth'].is-auth-signed-out .auth-mode-tabs button {min-height:44px;border-radius:var(--radius-small);font-size:14px;font-weight:400;}
html body[data-page='auth'].is-auth-signed-out .auth-mode-tabs button[aria-selected='true'] {background:var(--surface-raised);color:var(--text-highlight);box-shadow:inset 0 0 0 1px var(--border-control);}
html body[data-page='auth'].is-auth-signed-out .auth-method-button {border-radius:var(--radius-control);min-height:44px;}
html body[data-page='auth'] :is(.auth-qr-card,.auth-qr) {border-radius:var(--radius-card);}
html body[data-page='home'] .sections .section>.lottie-container> [data-ld-module] {width:100%;min-width:0;}
@media(max-width:767px) {
 html body[data-page] .pr-grid .pr-blob {padding:24px;}
 html body[data-page] .pr-grid .pr-blob--glow.sx-plan--featured {padding-top:56px;}
}
/* Video panels fit their content instead of reserving an empty screen below it. */
html body .ld-mockup.ld-video-demo.ld-panel {min-height:0;height:auto;padding:16px;}
html body .ld-mockup.ld-video-demo .ld-video-stage {width:100%;max-width:none;}
html body .ld-mockup.ld-video-demo .ld-video-heading {margin-bottom:16px;}
html body .ld-mockup.ld-video-demo .ld-video-screen {border-radius:var(--radius-card);}
html body .ld-mockup.ld-video-demo .ld-video-toggle {border-radius:var(--radius-control);}

/* Narrow layouts discovered in the visual sweep. */
html body[data-page='pricing'] .hx--page {padding-top:160px;padding-bottom:64px;}
html body[data-page='pricing'] .hx--page h1 {font-size:var(--type-hero);font-weight:400;line-height:1.08;letter-spacing:-.025em;max-width:20ch;}
html body[data-page='pricing'] .pr-tiers {--pr-popular:var(--leaf);}
html body[data-page='pricing'] .pr-tiers .pr-cur__select {background:var(--surface-input);color:var(--text-primary);border:1px solid var(--border-control);border-radius:var(--radius-control);}
html body[data-page='pricing'] .pr-tiers .pr-cur__chev {color:var(--text-secondary);}
html body[data-page='faq'] #main-content {padding-top:144px;}
html body:is([data-page='sections'],[data-page='home-sections']) main>section:first-child {padding-top:144px;}
html body.ld-kit h1 {font-size:var(--type-section);font-weight:400;line-height:1.1;letter-spacing:-.02em;}
html body .wk__item,html body .wk__tile {min-width:0;max-width:100%;}
html body .wk__tile :is(.wk__title,.wk__kind,.wk__media) {min-width:0;overflow-wrap:anywhere;}
@container(max-width:480px) {
 html body .ld-pipeline .pl-board {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-height:360px;overflow-x:hidden;overflow-y:auto;scroll-snap-type:none;align-content:start;}
 html body .ld-pipeline .pl-col {min-width:0;width:auto;}
 html body .ld-pipeline .pl-card {padding:10px;gap:8px;overflow-wrap:anywhere;font-size:12px;}
 html body .ld-pipeline .pl-head {font-size:10px;}
 html body .ld-pipeline .pl-top {flex-wrap:wrap;min-height:64px;gap:8px;}
}
@media(max-width:900px) {html body .wk__grid {grid-template-columns:minmax(0,1fr);}}
@media(max-width:767px) {
 html body[data-page='pricing'] .hx--page {padding-top:128px;padding-bottom:48px;}
 html body[data-page='faq'] #main-content,html body:is([data-page='sections'],[data-page='home-sections']) main>section:first-child {padding-top:128px;}
}
/* The reference's 44px touch target applies inside live demos as well as site chrome. */
html body .ld-mockup button,html body.ld-kit button {min-height:44px!important;min-width:44px!important;}
html body .ld-mockup :is(input:not([type='hidden']),select,textarea) {min-height:44px!important;line-height:1.5;}
html body[data-page='auth'].is-auth-signed-out .auth-shell .auth-method-button {min-height:44px;}
html body footer[data-shared-footer] .footer-col__action {min-height:44px;}
html body .shell h1 {font-size:24px;font-weight:400;line-height:1.2;letter-spacing:-.02em;}
html body .pr-tabs {background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-card);padding:8px;}
html body .pr-tab[aria-selected='true'] {background:var(--surface-raised);color:var(--text-highlight);border-color:var(--leaf);}
/* Keep the sales data visible and the chart targets full-size in reduced motion. */
html body .ld-mini-business .mb-bars {grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(72px,1fr);gap:12px 8px;min-height:180px;}
html body .ld-mini-business .mb-bars button {position:relative;transform:none!important;background:transparent!important;height:100%;min-height:72px!important;}
html body .ld-mini-business .mb-bars button::before {content:'';position:absolute;inset:auto 4px 24px;height:calc((100% - 24px) * var(--h));background:var(--sky);border-radius:4px 4px 0 0;pointer-events:none;}
html body .ld-mini-business .mb-bars button.is-now::before {background:var(--leaf);}
html body .ld-mini-business .mb-bars button::after {content:attr(data-bar);position:absolute;bottom:2px;left:0;right:0;color:var(--text-secondary);font-size:11px;line-height:1.4;pointer-events:none;}
html body .ld-mini-startup .ms .ld-field {border:0;padding:0;background:transparent;}
@container(min-width:520px) {html body .ld-mini-business .mb-bars {grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:minmax(120px,1fr);}}

/* Background refinement: n8n's deep canvas, atmospheric light and quiet surfaces.
   Section hierarchy comes from space and elevation, not horizontal rules. */
:root {
  --canvas-light:radial-gradient(ellipse 75% 70% at 88% 32%,rgb(71 156 115 / 13%),transparent 72%),radial-gradient(ellipse 55% 45% at 12% 100%,rgb(126 173 219 / 7%),transparent 75%);
  --panel-light:radial-gradient(ellipse at 100% 0%,rgb(71 156 115 / 14%),transparent 65%),linear-gradient(145deg,rgb(246 245 243 / 3%),transparent 55%);
  --border-subtle:rgb(246 245 243 / 9%);
  --shadow-inset:inset 0 1px 0 rgb(246 245 243 / 3%);
}
html {background:var(--bg-page);}
html body {background:var(--bg-page);}
html body header.site-header .top-wrap,
html body header.site-header.is-scrolled:not(.menu-open) .top-wrap {background:rgb(48 50 54 / 88%)!important;}
html body :is(.page-intro,.hx--page) {background:var(--canvas-light),var(--bg-page)!important;}
html body[data-page='home'] .hero {background:var(--bg-page);}
html body[data-page='home'] .hero::after {
 background:radial-gradient(ellipse 75% 85% at 95% 40%,rgb(71 156 115 / 18%),transparent 72%),radial-gradient(ellipse 55% 45% at 25% 100%,rgb(126 173 219 / 9%),transparent 72%),linear-gradient(180deg,rgb(38 40 43 / 96%),var(--bg-page));
}
html body[data-page='home'] :is(.hero .bottom-wrap,.hero .text-list,.sections .section,.system-path) {border:0;}
html body .powered-by {background:var(--bg-page)!important;border:0;}
html body :is(.sx,.hx,.page-section,.page-section.alt,.sx--deep,.sx--raised,.hx--deep,.hx--cream,.sx--light) {background-color:var(--bg-page);}
html body[data-page='home'] .sections .section {background:transparent!important;}
html body[data-page='home'] .system-path {background:radial-gradient(ellipse 65% 55% at 0% 50%,rgb(71 156 115 / 25%),transparent 78%),var(--bg-page)!important;}
html body[data-page='home'] :is(.system-path__steps li,.system-path__steps li:last-child) {border:0;}
html body[data-page='home'] .system-path__steps {display:grid;gap:24px;}
html body[data-page='home'] .system-path__steps li {padding:0;}
html body[data-page='home'] .typography-section {background:radial-gradient(ellipse 65% 48% at 70% 50%,rgb(71 156 115 / 26%),transparent 80%),var(--bg-page);}
html body[data-page='home'] #start {background:linear-gradient(0deg,var(--bg-page),transparent 25%),var(--growth-horizon),var(--bg-page);}
html body[data-page='home'] #start .sx__inner {background:var(--panel-light),var(--surface-card);border-color:transparent;}
html body :is(.sx-card,.sx-step,.sx-quote,.hx-stack__card,.hx-showcase__panel,.aud__card,.wx__card,.cards .card,.pillar) {background:var(--panel-light),var(--surface-card)!important;border-color:transparent!important;box-shadow:none;}
html body :is(#process,#built-in-africa) .sx-step {border-color:transparent!important;}
html body[data-page='home'] :is(#process,#built-in-africa) .sx-step {border-color:transparent!important;}
html body :is(.hw__row,.wp__project,.wk__bar,.cs__header,.cs__body,.hx-ledger__item,.hx-metrics__row,.sx-stat,.hx-manifest__item) {border-block:0;}
html body :is(.sx__eyebrow,.hx__eyebrow,.section-label) {border:0;background-image:none;}
html body :is(.dotted-line,.dotted-line.--position-top) {border-block:0!important;background-image:none!important;}
html body :is(.hx-showcase__rule,.hx-showcase__rule::before,.hx-showcase__rule::after) {background:none;}
html body :is(.hx-ledger__item,.hx-manifest__item) {padding-block:24px;}
html body[data-page] .pr-grid .pr-blob {background:var(--panel-light),var(--surface-card)!important;border-color:transparent;box-shadow:none;}
html body[data-page] .pr-grid .pr-blob--glow.sx-plan--featured {background:radial-gradient(ellipse at 85% 0%,rgb(71 156 115 / 28%),transparent 70%),var(--surface-card)!important;border-color:rgb(71 156 115 / 40%);box-shadow:0 0 40px rgb(71 156 115 / 6%);}
html body[data-page] .pr-grid .pr-blob .sx-plan__list {border:0;}
html body .sx-plan__flag {border:0!important;}
html body :is(.sx-faq__item,.fq__group,.fq__group-title) {border:0!important;}
html body .sx-faq__list {display:grid;gap:12px;}
html body .sx-faq__item {background:var(--surface-card);border-radius:var(--radius-card);padding-inline:24px;}
html body .sx-faq__item[open] {background:var(--surface-raised);}
html body :is(.pr-svc__row,.cs__facts>div,.cs-next__link) {border-color:transparent;}
html body .sx-compare :is(th,td),html body .pr-svc__cell {border-block:0;}
html body .sx-compare tbody tr:nth-child(even) :is(th,td) {background:var(--surface-input);}
html body footer[data-shared-footer] {border:0;background:var(--growth-horizon),var(--bg-page);}
/* The legacy opaque pseudo-layer otherwise hides the footer light. */
html body footer[data-shared-footer]::before {background:transparent;}
html body footer[data-shared-footer] :is(.inner-wrap,.top-wrap,.bottom-wrap,.info--cols,.info--cols>li,.info--cols>li:last-child,.footer-newsletter,.footer-meta,.footer-bottom) {border:0;background-image:none;}
html body .client-portal :is(.portal-header,.portal-stats,.portal-dashboard-footer,.portal-block__head,.portal-item,.portal-tabs) {border-color:transparent;}
html body .client-portal :is(.portal-card,.portal-block,.portal-stat,.analytics-card,.analytics-figure,.portal-workspace-summary>div) {background:var(--panel-light),var(--surface-card);border-color:transparent;}
html body .client-portal .analytics-records :is(th,td) {border-bottom:0;}
html body .client-portal .analytics-records tbody tr:nth-child(even) {background:var(--surface-input);}
html body[data-page='auth'] .auth-shell {background:var(--canvas-light),var(--bg-page);}
html body .auth-divider::before,html body .auth-divider::after {background:none;border:0;}
@media(max-width:767px) {html body .sx-faq__item {padding-inline:16px;}}
/* Leaf light blooms: concentrated cores, broad falloff and dark section edges.
   Static backgrounds preserve reduced-motion preferences and never intercept input. */
:root {
 --growth-horizon:linear-gradient(180deg,var(--bg-page),transparent 38%),radial-gradient(ellipse 65% 60% at 12% 100%,rgb(71 156 115 / 48%),transparent 78%),radial-gradient(ellipse 65% 65% at 95% 95%,rgb(71 156 115 / 42%),transparent 80%);
 --canvas-light:linear-gradient(0deg,var(--bg-page),transparent 40%),radial-gradient(ellipse 55% 85% at 95% 30%,rgb(71 156 115 / 35%),transparent 75%),radial-gradient(ellipse 45% 60% at 65% 65%,rgb(71 156 115 / 14%),transparent 80%);
 --hero-glow:radial-gradient(ellipse 38% 50% at 90% 60%,rgb(71 156 115 / 48%),transparent 75%),radial-gradient(ellipse 65% 80% at 100% 45%,rgb(71 156 115 / 24%),transparent 80%);
}
html body[data-page='home'] .hero::after {background:linear-gradient(0deg,var(--bg-page),transparent 35%),var(--hero-glow),var(--bg-page);}
@media(max-width:767px) {
 :root {--hero-glow:radial-gradient(ellipse 85% 48% at 110% 70%,rgb(71 156 115 / 38%),transparent 80%),radial-gradient(ellipse 90% 60% at 90% 55%,rgb(71 156 115 / 14%),transparent 85%);}
}
html body .system-path__line,html body .hx-pull__attr::before {display:none;}
html body .system-path__route {justify-content:space-between;}
html body .floating-scroll-menu .inner-wrap {background:transparent;border:0;box-shadow:none;}

/* ── Footer layout ───────────────────────────────────────────────────────────
   Three bands: a lead row (brand line and the two calls to action), the link
   columns, and a one-line bottom bar. Services has the most links, so it gets
   a double-width column and sets them in two. Below 1024px the columns pair
   up two across; every link is a 44px target there. */
html body footer[data-shared-footer] {display:block;min-height:0;padding:64px var(--gutter) 28px;}
html body footer[data-shared-footer]>:is(.footer-lead,.inner-wrap) {width:100%;max-width:var(--content-width);margin-inline:auto;}
html body footer[data-shared-footer] .footer-lead {position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px 40px;padding-bottom:40px;margin-bottom:48px;border-bottom:1px solid var(--border-subtle);}
html body footer[data-shared-footer] .footer-lead__brand {display:flex;align-items:center;gap:20px;min-width:0;}
html body footer[data-shared-footer] .footer-lead__mark {flex:none;width:32px;height:auto;}
html body footer[data-shared-footer] .footer-lead__line {margin:0;max-width:30ch;color:var(--text-primary);text-wrap:balance;}
html body footer[data-shared-footer] .top-wrap {width:auto;margin:0;gap:12px;justify-content:flex-start;flex-direction:row;align-items:center;}
html body footer[data-shared-footer]>.inner-wrap {display:block;min-height:0;height:auto;margin-top:0;}
html body footer[data-shared-footer] .info--cols {display:grid;grid-template-columns:minmax(0,2.5fr) repeat(3,minmax(0,1fr)) minmax(0,1.7fr);gap:40px 32px;align-items:start;width:100%;max-width:none;}
html body footer[data-shared-footer] .info--cols>li {display:block;grid-column:auto;min-width:0;padding:0;border:0;}
html body footer[data-shared-footer] .footer-col nav {display:flex;flex-direction:column;align-items:flex-start;grid-column:auto;}
html body footer[data-shared-footer] .footer-col__head {margin:0 0 12px;color:var(--text-primary);opacity:1;}
html body footer[data-shared-footer] .footer-col__links {display:grid;gap:0;justify-items:start;text-align:left;}
html body footer[data-shared-footer] .footer-col:first-child .footer-col__links {display:block;columns:2;column-gap:24px;}
html body footer[data-shared-footer] .footer-col:first-child .footer-col__links>li {break-inside:avoid;}
html body footer[data-shared-footer] :is(.footer-col__links a,.footer-col__action) {min-height:36px;justify-content:flex-start;text-align:left;}
html body footer[data-shared-footer] :is(.footer-col__links a,.footer-col__action) span {line-height:1.3;}
html body footer[data-shared-footer] :is(.footer-col__links a,.footer-col__action) span {transition:color var(--duration-control) var(--ease-system);}
html body footer[data-shared-footer] :is(.footer-col__links a,.footer-col__action):hover {opacity:1;}
html body footer[data-shared-footer] :is(.footer-col__links a,.footer-col__action):hover span {color:var(--text-primary);opacity:1;}
html body footer[data-shared-footer] .footer-newsletter {grid-column:auto;justify-self:stretch;width:100%;margin-top:20px;}
html body footer[data-shared-footer] .footer-newsletter__label {margin-bottom:8px;color:var(--text-primary);}
html body footer[data-shared-footer] .footer-newsletter__row {display:grid;grid-template-columns:minmax(0,1fr) 48px;gap:8px;}
html body footer[data-shared-footer] .footer-newsletter__row :is(input,button) {min-height:48px;height:48px;width:100%;grid-row:1;}
html body footer[data-shared-footer] .footer-newsletter__row input {grid-column:1;}
html body footer[data-shared-footer] .footer-newsletter__row button {grid-column:2;min-width:0;padding:0;}
html body footer[data-shared-footer] .footer-bottom {display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 32px;margin-top:56px;padding-top:24px;border-top:1px solid var(--border-subtle);}
html body footer[data-shared-footer] .footer-bottom :is(.sign,.credits,.local-clock) {grid-area:auto;align-self:auto;padding:0;margin:0;text-align:left;align-items:flex-start;}
html body footer[data-shared-footer] .footer-bottom .sign {display:flex;flex-direction:row;flex-wrap:wrap;gap:6px 16px;}
html body footer[data-shared-footer] .footer-bottom .local-clock {display:flex;flex-direction:row;align-items:baseline;gap:10px;}
html body footer[data-shared-footer] .footer-bottom :is(span) {color:var(--text-muted);}
html body footer[data-shared-footer] .footer-bottom .clock-time {color:var(--text-secondary);font-variant-numeric:tabular-nums;min-width:8ch;}
@media(max-width:1023px){
 html body footer[data-shared-footer] {padding:48px var(--gutter) 24px;}
 html body footer[data-shared-footer] .footer-lead {padding-bottom:32px;margin-bottom:36px;}
 html body footer[data-shared-footer] .info--cols {grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 24px;}
 html body footer[data-shared-footer] .info--cols>li:first-child {grid-column:1 / -1;}
 /* Contact's links sit beside Legal; its newsletter form takes the full row. */
 html body footer[data-shared-footer] .info--cols>li:last-child {display:contents;}
 html body footer[data-shared-footer] .footer-newsletter {grid-column:1 / -1;margin-top:0;max-width:440px;}
 html body footer[data-shared-footer] :is(.footer-col__links a,.footer-col__action) {min-height:44px;}
 html body footer[data-shared-footer] .footer-bottom {margin-top:40px;}
}
@media(max-width:549px){
 html body footer[data-shared-footer] .footer-lead {align-items:flex-start;}
 html body footer[data-shared-footer] .top-wrap {width:100%;flex-wrap:wrap;}
 html body footer[data-shared-footer] .footer-bottom {flex-direction:column;align-items:flex-start;}
}

/* Header and mobile menu use the display face, matching the footer. */
html body header.site-header :is(.header-nav-label,.header-submenu a span),
html body .modal-menu :is(a,button) span {font-family:'Helvetica Now Display',arial,sans-serif;text-transform:none;letter-spacing:0;}
html body header.site-header .header-nav-label {font-size:15px;line-height:1.3;}
html body header.site-header .header-submenu .header-nav-label {font-size:15px;}
/* Homepage project enquiry: reference-led split heading and light form. */
html body[data-page='home'] #start {
  background: radial-gradient(ellipse at 28% 55%, rgb(71 156 115 / 22%), transparent 62%), #10281e;
  padding-block: clamp(48px, 6vw, 88px);
}
html body[data-page='home'] #start .sx__inner {
  max-width: 1160px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}
html body[data-page='home'] #start .hc__grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  align-items: center;
  gap: clamp(40px, 6vw, 88px);
}
html body[data-page='home'] #start .hc__head { margin: 0; }
html body[data-page='home'] #start .sx__title {
  max-width: 12ch;
  font-size: clamp(36px, 3.6vw, 52px);
  line-height: 1.08;
  text-transform: none;
}
html body[data-page='home'] #start .sx__title::after {
  content: '';
  display: block;
  width: 160px;
  height: 5px;
  margin-top: 22px;
  background: var(--leaf);
}
html body[data-page='home'] #start .sx__lede { max-width: 34ch; margin-top: 24px; }
html body[data-page='home'] #start .hc__form {
  --text-primary: #26503c;
  --text-secondary: #3d5148;
  --text-muted: #65736b;
  --form-ink: #26503c;
  --surface-input: #fff;
  --border-control: #a6b4ac;
  padding: clamp(24px, 3vw, 42px);
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
html body[data-page='home'] #start .field { min-height: 0; padding: 0; background: transparent !important; }
html body[data-page='home'] #start .field:focus-within { box-shadow: none !important; }
html body[data-page='home'] #start .field :is(input, textarea) {
  background: #fff !important;
  color: #26503c !important;
  padding: 12px;
  border-radius: 3px !important;
  font-size: 14px;
}
html body[data-page='home'] #start .field :is(input, textarea):focus {
  border-color: #26503c !important;
  outline: 2px solid #26503c !important;
  outline-offset: 2px;
}
html body[data-page='home'] #start .field [aria-invalid='true'] { border-color: #a63f20 !important; }
html body[data-page='home'] #start .form-status { color: #26503c !important; }
html body[data-page='home'] #start .form-status:is(.error, .is-error) { color: #a63f20 !important; }
html body[data-page='home'] #start button[type='submit'] { border-radius: 999px !important; padding-inline: 30px; }
@media (max-width: 900px) {
  html body[data-page='home'] #start .hc__grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  html body[data-page='home'] #start .sx__title { max-width: 16ch; }
}

/* Light appearance shares the same layout and brand primitives as dark. */
:root[data-theme='light'] {
  color-scheme:light;
  --bg-page:#F6F5F3; --bg-section:#F6F5F3;
  --surface-card:#FFFFFF; --surface-raised:#EAEFEA; --surface-input:#FFFFFF;
  --text-primary:#20382C; --text-secondary:#43574C; --text-muted:#58675E;
  --text-highlight:#26503C; --text-accent:#26503C; --text-on-accent:#0E0E0F;
  --border-subtle:rgb(32 56 44 / 16%); --border-control:#7A897F;
  --green-strong:var(--text-highlight); --green-text:var(--text-highlight);
  --sys-accent-soft:var(--text-highlight);
  --shadow-inset:inset 0 1px 0 rgb(255 255 255 / 60%);
  --shadow-panel:0 16px 48px rgb(32 56 44 / 8%);
  --canvas-light:radial-gradient(ellipse at 90% 35%,rgb(71 156 115 / 12%),transparent 75%);
  --panel-light:radial-gradient(ellipse at 100% 0%,rgb(71 156 115 / 8%),transparent 65%);
  --hero-glow:radial-gradient(ellipse at 90% 55%,rgb(71 156 115 / 20%),transparent 75%);
  --growth-horizon:radial-gradient(ellipse at 10% 100%,rgb(71 156 115 / 18%),transparent 75%);
}
html[data-theme='light'] body :is(input,select,textarea) {color-scheme:light;}
html[data-theme='light'] body header.site-header .top-wrap,
html[data-theme='light'] body header.site-header.is-scrolled:not(.menu-open) .top-wrap {background:rgb(246 245 243 / 94%)!important;}
html[data-theme='light'] body header.site-header .logo .logo-light {display:none!important;}
html[data-theme='light'] body header.site-header .logo .logo-dark {display:block!important;}
html[data-theme='light'] body[data-page='home'] #start {background:var(--canvas-light),var(--bg-page);}
html[data-theme='light'] body :is(.form-status.error,.form-status.is-error,.field-note.is-short) {color:#A63F20!important;}
html[data-theme='light'] body :is(input,textarea,select)[aria-invalid='true'] {border-color:#A63F20!important;}
html[data-theme='light'] body :is(.lc-consent,.lc-prefs) {--c-deep:var(--text-highlight);}
html[data-theme='light'] body .client-portal {--pp-ink-hover:var(--text-highlight);}
html[data-theme='light'] :is(body.ld-kit,body .ld-mockup) {--demo-deep:var(--text-highlight);--ld-green-deep:var(--text-highlight);}
/* Legacy component colours that were fixed to the dark canvas. */
html[data-theme='light'] body :is(.hws__index,.hws__tags li,.hws__link,.hws__link span,.fq__count,.review-steps__n) {color:var(--text-highlight)!important;}
html[data-theme='light'] body :is(.pr-footnote,.pr-svc__head span) {color:var(--text-secondary)!important;}
html[data-theme='light'] body[data-page='faq'] :is(.sx__title,.sx__eyebrow,.fq__chip),
html[data-theme='light'] body #auth-title {color:var(--text-primary)!important;}
html[data-theme='light'] body .auth-mode-tabs button {color:var(--text-secondary)!important;}
html[data-theme='light'] body .wk__filter sup {opacity:1;}
html[data-theme='light'] body :is(.sx-btn,.button-frame) span,
html[data-theme='light'] body header.site-header .menu-segment--cta .header-nav-label {color:var(--text-on-accent)!important;}

/* Share header space between every item instead of reserving it for the logo. */
html body header.site-header .top-wrap {
  align-items:center;
  gap:24px;
  padding-block:12px;
}
html body header.site-header .top-wrap .menu-wrap {
  align-items:center;
  justify-content:space-between;
  gap:clamp(12px, 2vw, 32px);
}
html body header.site-header .top-wrap .menu-wrap .menu-item-logo {
  align-self:center;
  margin:0;
  flex-shrink:0;
}
html body header.site-header .top-wrap .menu-wrap .menu-item-logo .logo {
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  min-height:44px;
  transform:none;
}
@media(max-width:1100px) {
  html body header.site-header .top-wrap {gap:12px;}
  html body header.site-header .top-wrap .menu-wrap {gap:12px;}
}

/* Each live preview owns one even inset; its screen determines its height. */
html body .ld-mockup:is(.ld-panel,.ld-mini) {
  display:grid;
  place-items:center;
  height:auto;
  min-height:0;
  padding:24px;
  box-sizing:border-box;
}
html body .ld-mockup > .ld-stage {
  display:block;
  width:100%;
  min-width:0;
  margin:0;
}
html body .ld-mockup :is(.ws-wrap,.ft.ft-single) {width:100%;}
html body .ld-app .ap-wrap {min-height:0;}
html body .ld-app {max-width:328px;margin-inline:auto;}
html body[data-page='home'] .sections .section > .lottie-container:has(>[data-ld-module]),
html body[data-page='home'] ._02 .experience .media-wrap:has(>[data-ld-module]),
html body[data-page='home'] .aud__media:has(>[data-ld-module]) {
  height:auto;
  min-height:0;
  aspect-ratio:auto;
  padding:0;
  align-self:center;
}
html body[data-page='home'] .lottie-container:has(>ld-app) {
  max-width:328px;
  justify-self:center;
}
@media(max-width:639px) {
  html body .ld-mockup:is(.ld-panel,.ld-mini) {padding:16px;}
  html body .ld-app,
  html body[data-page='home'] .lottie-container:has(>ld-app) {max-width:312px;}
}
html[data-theme='light'] body .sx-btn--ghost span {color:var(--text-primary)!important;}

/* ── Hero loop ───────────────────────────────────────────────────────────────
   The supplied footage fills the hero edge to edge, uncropped and with nothing
   laid over it: from 1024px the hero takes the 16:9 shape of the footage and
   the text sits over its empty left side. The footage is a light scene, so
   the hero uses dark ink over it in both themes. Below 1024px there is no
   room for text over a 16:9 frame, so the footage runs full width under the
   text instead. Reduced motion and data-saving visitors get no footage and
   the plain themed hero. */
@media(prefers-reduced-motion:reduce){
 html body[data-page='home'] .hero>.hero__media {display:none;}
}
@media(prefers-reduced-motion:no-preference) and (min-width:1024px){
 html body[data-page='home'] .hero:has(>.hero__media) {
  --text-primary:#20382C; --text-secondary:#43574C; --text-muted:#58675E;
  --text-highlight:#26503C; --border-subtle:rgb(32 56 44 / 16%); --border-control:#7A897F; --surface-raised:#E6ECE6;
  height:auto;min-height:0;aspect-ratio:16 / 9;overflow:visible;background:#F1F1EE;color:var(--text-primary);
 }
 html body[data-page='home'] .hero:has(>.hero__media)::before {content:none;}
 /* The only thing over the footage: its bottom edge dissolves into the page
    colour, so the hero runs into the tools strip without a line. */
 html body[data-page='home'] .hero:has(>.hero__media)::after {inset:auto 0 0 0;height:16%;z-index:-1;background:linear-gradient(180deg,transparent,var(--bg-page));}
 html body[data-page='home'] .hero:has(>.hero__media) .hero__background {position:absolute;inset:0 0 auto 0;z-index:-2;width:100%;height:auto;aspect-ratio:16 / 9;object-fit:contain;}
 /* Text starts under the header and ends above the fade. */
 html body[data-page='home'] .hero:has(>.hero__media) {justify-content:flex-start;}
 html body[data-page='home'] .hero:has(>.hero__media) .top-wrap {margin:0 auto;align-content:start;padding:clamp(100px,10.5vw,190px) 0 0;gap:clamp(18px,2.2vw,36px);}
 html body[data-page='home'] .hero:has(>.hero__media) :is(.hero-intro,.text-list) {max-width:min(43%,620px);}
 html body[data-page='home'] .hero:has(>.hero__media) .hero-intro h1 {font-size:clamp(34px,3.7vw,68px);max-width:none;color:var(--text-primary);}
 html body[data-page='home'] .hero:has(>.hero__media) .hero-intro__lede {font-size:clamp(15px,1.3vw,20px);margin-top:clamp(12px,1.5vw,24px);}
 html body[data-page='home'] .hero:has(>.hero__media) .hero-intro__actions {margin-top:clamp(18px,2vw,32px);}
 html body[data-page='home'] .hero:has(>.hero__media) .text-list {padding-top:0;gap:clamp(12px,1.6vw,32px);}
}
@media(prefers-reduced-motion:no-preference) and (max-width:1023px){
 html body[data-page='home'] .hero:has(>.hero__media) {height:auto;}
 html body[data-page='home'] .hero>.hero__media {order:2;display:block;position:relative;width:100%;}
 html body[data-page='home'] .hero>.hero__media::after {content:'';position:absolute;inset:auto 0 0 0;height:28%;pointer-events:none;background:linear-gradient(180deg,transparent,var(--bg-page));}
 html body[data-page='home'] .hero .hero__background {position:static;z-index:auto;display:block;width:100%;height:auto;aspect-ratio:16 / 9;object-fit:contain;}
}
/* The tools strip keeps the page colour and its own muted logo treatment; with
   the hero fading into that colour, it needs no rule or band of its own. */
html body[data-page='home'] .powered-by {border:0;}

/* Skip link: off screen until it takes keyboard focus. */
html body .skip-link {position:fixed;top:8px;left:8px;z-index:10000;padding:15px 16px;border-radius:var(--radius-control);background:var(--leaf);color:var(--text-on-accent);font:500 15px/1.2 'Helvetica Now Display',arial,sans-serif;text-decoration:none;transform:translateY(-200%);}
html body .skip-link:focus {transform:none;}

/* Tap targets. Inline links keep their line height; the padding only grows
   the area that responds to a finger. */
html body .hc__link {display:inline-block;padding-block:12px;margin-block:-12px;}
html body :is(.footer-newsletter__consent,.newsletter-consent,.career-consent) {min-height:44px;align-items:center;cursor:pointer;}
html body :is(.footer-newsletter__consent,.newsletter-consent,.career-consent) input {width:24px;height:24px;flex:0 0 24px;margin:0;}

/* ── The way we work: steps arrive one by one from the right ────────────────
   Hidden only once js/design-system.js marks the list ready, so the steps
   show without JS. The 40px start offset is clipped, never scrolled. */
html body[data-page='home'] .system-path {overflow-x:clip;}
html.has-reveal body .system-path__steps [data-reveal='none'] {opacity:1; transform:none;}
html body[data-page='home'] .system-path__steps li {grid-template-columns:32px minmax(0,1fr);}
@media(prefers-reduced-motion:no-preference) {
  html body .system-path__steps.js-reveal-ready > li {
    opacity:0; transform:translateX(40px);
    transition:opacity 500ms var(--ease-system),transform 500ms var(--ease-system);
    transition-delay:var(--step-delay,0ms);
  }
  html body .system-path__steps.js-reveal-ready > li.is-in {opacity:1; transform:none;}
}
