/* Site-wide taste pass (Kristian, 15 Oct 2026).
   The homepage taste pass (assets/home-taste.css, stages 2 to 5) locked and
   rolled out to every other page. Visual only: no words, links, forms or page
   order change. Load it as the last stylesheet on each page. The homepage keeps
   its own tuned copy in home-taste.css and does not load this file.

   What it carries over:
   1. Labels in sentence case, never tracked capitals.
   2. One type scale: bigger section headings, 24px card titles.
   3. One vertical spacing scale: section padding 128px on the homepage, 64px on other pages (40px on phones),
      16px heading to lead line, 48px heading to content, 20px between cards.
   4. Soft card surfaces: hairline borders dropped, a pale fill instead.
   5. Motion: buttons press, cards lift on hover, sections rise in on scroll.
   6. Phones: every button and card link at least 44px tall. */

:root {
  --st-ease: cubic-bezier(0.23, 1, 0.32, 1);
  --st-sec: clamp(64px, 9vw, 128px);
  --st-head: 16px;
  --st-content: clamp(32px, 3.4vw, 48px);
  --st-block: clamp(56px, 5.6vw, 80px);
}
/* Inner pages (Kristian, 15 Oct 2026): most sections share one background, so the
   padding above and below stacks into one gap. Half the homepage value keeps the gap
   between sections close to the homepage's colour bands. */
body:not([data-cs-page="home"]) { --st-sec: clamp(40px, 4.5vw, 64px); }

/* 1. Labels in sentence case. */
html body main :is(p, span, small, div, li, dt, a, label, figcaption, strong, b):not(abbr) {
  text-transform: none !important;
}

/* 1b. Labels drop the wide tracking and sit at the homepage label size. */
html body main :is([class*="eyebrow"], [class*="kicker"]):not(#st) {
  letter-spacing: normal !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

/* 2. Type scale. The :not(#st) lifts these over page rules without touching markup. */
html body main h1:not(#st) {
  font-size: clamp(36px, 3.6vw, 52px) !important;
  line-height: 1.08 !important;
}
html body main h2:not(#st) {
  font-size: clamp(30px, 3.2vw, 44px) !important;
  line-height: 1.12 !important;
}
html body main :is([class*="card"], [class*="__col"], li, article, details, .faq-item) h3:not(#st) {
  font-size: clamp(21px, 1.8vw, 24px) !important;
  line-height: 1.25 !important;
}
@media (max-width: 767px) {
  html body main h1:not(#st) { font-size: clamp(28px, 7.4vw, 32px) !important; }
  html body main h2:not(#st) { font-size: clamp(26px, 7vw, 30px) !important; }
}

/* 3. Vertical spacing. Every section after the opening one gets the same padding. */
html body main > section:not(:first-of-type):not(#st),
html body main > div > section:not(:first-of-type):not(#st) {
  padding-top: var(--st-sec) !important;
  padding-bottom: var(--st-sec) !important;
}
html body main > section:first-of-type:not(#st),
html body main > div > section:first-of-type:not(#st) {
  padding-bottom: var(--st-sec) !important;
}
html body main section h2:not(#st) { margin-bottom: 0 !important; }
html body main section h2 + p:not(#st) { margin-top: var(--st-head) !important; }
html body main section h2 + p + :not(p):not(#st),
html body main section h2 + :not(p):not(#st) { margin-top: var(--st-content) !important; }

/* 4. Soft card surfaces: the hairline border goes and a pale fill holds the
      shape, as on the homepage. The list is every off-white card with a 1px
      border in the site's stylesheets (form fields, menus and chips left out). */
:is(
  html body main .card,
  html body main .cap-row,
  html body main .about-card,
  html body main .eng-card,
  html body main .featured-insight,
  html body main .insight-card,
  html body main .contact-card,
  html body main body .svc-start__b,
  html body main .ob-inc__col,
  html body main .lib-hero__example,
  html body main .lib-faq__item,
  html body main .lib-steps__step,
  html body main .st-own__routes li,
  html body main .st-board,
  html body main .fsx-need p,
  html body main .fsy-doc__page,
  html body main .fsy-effort,
  html body main .fsy-lane,
  html body main .fsy-terms__call,
  html body main .fsz-facts div,
  html body main .fsz-flow__note,
  html body main .fsz-story li:not(:last-child),
  html body main .fsz-tl,
  html body main .fsz-usp li,
  html body main .fsz-wk,
  html body main .seo-panel,
  html body main .seo-faq details,
  html body main .seo-related a,
  html body main .seo-refresh .seo-panel,
  html body main .seo-refresh .seo-card,
  html body main .seo-refresh .seo-list li,
  html body main .tr-offer,
  html body main .tr-topic,
  html body main .tr-method,
  html body main .tr-page .tr-topic,
  html body main .tr-step,
  html body main .tr-page .tr-method,
  html body main .tr-cmp,
  html body main .tr-wk,
  html body main .tr-day,
  html body main .bl-svc,
  html body main .bl-evidence,
  html body main .bl-flow,
  html body main .bl-flow__stage,
  html body main .bl-card,
  html body main .bl-diagram,
  html body main li.bl-node,
  html body main div.bl-node,
  html body main .bl-lift,
  html body main .bl-refresh .fs-acc__item,
  html body main .om-obj,
  html body main .ty__step,
  html body main .cs-stat,
  html body main .cs-pair__item,
  html body main .cs-card,
  html body main .cs-ledger__rows,
  html body main .cs-ledger__fee,
  html body main .ab-how__card,
  html body main .pj-stage,
  html body main .pj-study,
  html body main .pj-sectors li,
  html body main .pj-page .seo-faq details,
  html body main .omv-panel,
  html body main .omv-panel__action,
  html body main .om-page .om-acc__item,
  html body main .pf-case,
  html body main .pf-sum,
  html body main .pf-fit,
  html body main .ft-card,
  html body main .ft-answer,
  html body main .ml-proof,
  html body main .ml-section,
  html body main .ml-side-panel,
  html body main .ml-report,
  html body main .ml-lane-card,
  html body main .ml-summary-card,
  html body main .ml-metric-block,
  html body main .ml-system-card,
  html body main .ml-fast-note,
  html body main .ml-details,
  html body main .ip-sheet,
  html body main .ip-app,
  html body main .ip-step:not(.is-on),
  html body main .rg-gap,
  html body main .rg-ls
) {
  border-color: transparent !important;
  background-color: rgba(229, 229, 226, 0.55) !important;
}

/* 5. Motion. */
@media (prefers-reduced-motion: no-preference) {
  html body main :is(a[class*="btn"], a[class*="cta"], button, .hero-btn) {
    transition: transform 160ms var(--st-ease), background-color 200ms var(--st-ease), color 200ms var(--st-ease);
  }
  html body main :is(a[class*="btn"], a[class*="cta"], button, .hero-btn):active {
    transform: scale(0.97);
  }
  html body main :is([class*="card"], [class*="__col"], .om-obj) {
    transition: translate 260ms var(--st-ease), box-shadow 260ms var(--st-ease), background-color 200ms var(--st-ease);
  }
  @media (hover: hover) and (pointer: fine) {
    html body main :is([class*="card"]:has(a), a[class*="card"]):hover {
      translate: 0 -4px;
    }
  }
  @supports (animation-timeline: view()) {
    @keyframes st-rise {
      from { transform: translateY(28px); }
      to { transform: none; }
    }
    html body main > section:not(:first-of-type) :is(h2, [class*="card"], [class*="__col"], .om-obj, .faq-item),
    html body main > div > section:not(:first-of-type) :is(h2, [class*="card"], [class*="__col"], .om-obj, .faq-item) {
      animation: st-rise linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 40%;
    }
  }
}

/* 6. Phones: tap targets. */
@media (max-width: 767px) {
  html body main :is(a[class*="btn"], a[class*="cta"], a[class*="link"], button):not(p a):not(p button) {
    min-height: 44px;
  }
  html body main a[class*="link"]:not(p a) {
    display: inline-flex;
    align-items: center;
  }
}

/* 7. Centred section heads widen to fit the larger headings (three lines at most). */
html body main .section-head:not(#st) { max-width: min(100%, 760px) !important; }

/* 8. A heading inside a panel or card is a sub-head, 30px as on the homepage. */
html body main :is([class*="panel"], [class*="card"], [class*="__col"], aside) h2:not(#st) {
  font-size: clamp(24px, 2.2vw, 30px) !important;
}