/* ==========================================================================
   Stedholm v7, "The Practice".
   One stylesheet. It replaces the four layers v3 to v6.1 had stacked
   (theme, instruments, broadsheet, evidence). The plan is
   research/v7/DESIGN_PLAN.md:

     - one system on every page, applied the same way everywhere;
     - white and mist grounds, spruce as the firm's colour, oxide only for
       the one thing that needs attention, verdigris for a confirmed state;
     - Schibsted Grotesk when the firm speaks, Source Serif 4 when it shows
       you a document it would hand you;
     - everything left-aligned on a 12-column, 1200px grid;
     - no eyebrow labels, no mono, no middle dots, no arrows;
     - motion only where something changes (the v6.1 rule is kept).
   ========================================================================== */

:root {
  --s-paper: #FFFFFF;
  --s-mist: #F1F4F3;
  --s-ink: #17201E;
  --s-slate: #4E5A57;
  --s-rule: #D3DAD7;
  --s-rule-strong: #7C8885;  /* field borders: 3.6:1 on white */
  --s-spruce: #123B36;
  --s-spruce-deep: #0C2A26;
  --s-spruce-line: #2A524C;
  --s-spruce-soft: #E3ECE9;
  --s-on-spruce: #D5E2DE;    /* body text on spruce: 9.6:1 */
  --s-on-spruce-dim: #A9C0BA;
  --s-verd: #1F6B5F;
  --s-ox: #A63E1B;
  --s-sans: var(--wp--preset--font-family--sans);
  --s-serif: var(--wp--preset--font-family--serif);
  --s-gap: clamp(1rem, 2.4vw, 2rem);
  --s-ease: cubic-bezier(0.2, 0, 0.2, 1);
  --sted-ease: var(--s-ease);
}

/* ------------------------------------------------------------------ base */
html { color-scheme: light; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-feature-settings: "kern"; }
a, button, summary, input, select, textarea, [role="button"] {
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(18, 59, 54, 0.14);
}
h1, h2, h3, h4 { text-wrap: balance; }
p, li { text-wrap: pretty; }
.sted-ledger td, .sted-specs .sted-v, .sted-prose, .sted-record-line { overflow-wrap: break-word; }
/* Tabular figures only where figures line up. In Schibsted Grotesk the tnum
   feature also widens the comma and full stop, so it never goes on running text. */
.sted-index-count, .sted-index-n, .sted-cal-day { font-variant-numeric: tabular-nums; }
.wp-block-navigation__responsive-container.has-modal-open { overscroll-behavior: contain; }

a { text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }

:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--s-spruce);
  outline-offset: 3px;
  border-radius: 2px;
}
.sted-dark :where(a, button, input, textarea, select, summary, [tabindex]):focus-visible { outline-color: #FFFFFF; }
.skip-link:focus {
  background: var(--s-spruce); color: #FFFFFF;
  padding: 0.8rem 1.3rem; font-weight: 600; text-decoration: none;
}
.sted-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* The header, the page and the footer meet edge to edge; WordPress's root
   block gap would otherwise open a white seam between each. */
.wp-site-blocks > * + *,
.wp-block-post-content > * + * { margin-block-start: 0 !important; }

/* -------------------------------------------------------------- grounds */
.sted-ground--mist { background: var(--s-mist); }
.sted-dark { background: var(--s-spruce); color: var(--s-on-spruce); }
.sted-dark :where(h1, h2, h3, h4) { color: #FFFFFF; }
.sted-dark p, .sted-dark li { color: var(--s-on-spruce); }
.sted-dark a:not(.wp-block-button__link) { color: #FFFFFF; }

/* --------------------------------------------------------------- buttons */
.wp-block-button__link {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; box-sizing: border-box;
  border: 1px solid var(--s-spruce);
  text-decoration: none;
  line-height: 1.2;
  transition: background-color 160ms var(--s-ease), border-color 160ms var(--s-ease), color 160ms var(--s-ease);
}
.wp-block-button__link:hover { text-decoration: none; }
.is-style-quiet .wp-block-button__link {
  background: transparent; color: var(--s-spruce); border-color: var(--s-spruce);
}
.is-style-quiet .wp-block-button__link:hover,
.is-style-quiet .wp-block-button__link:focus-visible { background: var(--s-spruce); color: #FFFFFF; }
.wp-block-buttons { gap: 0.75rem; }
.sted-dark .wp-block-button__link { background: #FFFFFF; color: var(--s-spruce); border-color: #FFFFFF; }
.sted-dark .wp-block-button__link:hover { background: var(--s-spruce-soft); border-color: var(--s-spruce-soft); color: var(--s-spruce-deep); }
.sted-dark .is-style-quiet .wp-block-button__link { background: transparent; color: #FFFFFF; border-color: rgba(255, 255, 255, 0.55); }
.sted-dark .is-style-quiet .wp-block-button__link:hover { background: rgba(255, 255, 255, 0.08); border-color: #FFFFFF; color: #FFFFFF; }
@media (prefers-reduced-motion: no-preference) {
  .wp-block-button__link:active, .sted-form button[type="submit"]:active { transform: translate3d(0, 1px, 0); }
}

/* ---------------------------------------------------------------- header */
.sted-utility { display: none; } /* retired in v7: the location lives in the footer */
.sted-header {
  background: var(--s-paper);
  border-bottom: 1px solid var(--s-rule);
}
.sted-header .sted-logo { display: block; }
.sted-header .sted-logo svg { height: 32px; width: auto; display: block; }
.sted-header .wp-block-navigation { font-size: 0.98rem; font-weight: 500; }
.sted-header .wp-block-navigation a,
.sted-header .wp-block-navigation .wp-block-navigation-submenu__toggle {
  color: var(--s-ink); text-decoration: none;
}
.sted-header .wp-block-navigation .wp-block-navigation-item__content { padding-block: 0.5rem; }
.sted-header .wp-block-navigation > .wp-block-navigation__container > .wp-block-navigation-item > a,
.sted-header .wp-block-navigation > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
  position: relative;
}
.sted-header .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0.1rem; height: 2px;
  background: var(--s-spruce);
  transform: scaleX(0); transform-origin: left center;
  transition: transform 180ms var(--s-ease);
}
.sted-header .wp-block-navigation__container > .wp-block-navigation-item:hover > .wp-block-navigation-item__content::after,
.sted-header .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:focus-visible::after,
.sted-header .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content::after,
.sted-header .wp-block-navigation__container > .current-menu-ancestor > .wp-block-navigation-item__content::after { transform: scaleX(1); }
.sted-header .wp-block-navigation .wp-block-navigation__submenu-container {
  border: 1px solid var(--s-rule) !important;
  border-radius: 6px;
  background: var(--s-paper);
  padding: 0.5rem !important;
  min-width: 15rem !important;
  box-shadow: 0 12px 28px -12px rgba(18, 59, 54, 0.28);
}
.sted-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  padding: 0.6rem 0.75rem !important; border-radius: 4px;
}
.sted-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
  background: var(--s-mist);
}
.sted-header .sted-header-cta .wp-block-button__link { min-height: 42px; padding: 0.6rem 1.1rem; font-size: 0.95rem; }
.wp-block-navigation__responsive-container.has-modal-open { background: var(--s-paper) !important; }
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation__responsive-container-content { padding-top: 4.5rem; }
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation-item__content { font-size: 1.35rem; font-weight: 500; }
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { font-size: 1.1rem; color: var(--s-slate); }
/* Inside the full-screen mobile menu the list reads left to right like the
   rest of the site, and the submenu is an indented list, not a dropdown. */
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation__container,
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation-item { align-items: flex-start !important; text-align: left; }
.wp-block-navigation__responsive-container.has-modal-open .wp-block-navigation__submenu-container {
  border: 0 !important; box-shadow: none !important; background: transparent !important;
  padding: 0.25rem 0 0.5rem 1rem !important; min-width: 0 !important;
}
@media (max-width: 781px) {
  .sted-header .sted-header-cta { display: none; }
  .sted-header .sted-logo svg { height: 28px; }
}

/* ------------------------------------------------------------ breadcrumbs */
.sted-crumbs {
  background: var(--s-mist);
  font-size: 0.875rem; color: var(--s-slate);
  padding-block: 1rem 0;
}
.sted-crumbs a { color: var(--s-slate); text-decoration: none; }
.sted-crumbs a:hover { color: var(--s-spruce); text-decoration: underline; }
.sted-page--article .sted-crumbs { background: var(--s-paper); padding-block: 1rem; border-bottom: 1px solid var(--s-rule); }
.home .sted-crumbs, .blog .sted-crumbs { display: none; }

/* ------------------------------------------------------------------- hero */
.sted-hero { background: var(--s-mist); position: relative; }
.sted-hero-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--s-gap); align-items: center; }
.sted-hero-grid > * { grid-column: 1 / -1; margin: 0; }
.sted-hero h1 { margin: 0; max-width: 19ch; color: var(--s-ink); }
.sted-lede {
  margin: 1.4rem 0 0; max-width: 58ch;
  font-size: clamp(1.125rem, 1.6vw, 1.3rem); line-height: 1.55; color: var(--s-slate);
}
.sted-hero .wp-block-buttons { margin-top: 2rem !important; }

/* Inner pages: the statement in seven columns, the drawing in five. */
.sted-hero--art .sted-hero-statement { grid-column: 1 / span 7; }
.sted-hero--art .sted-hero-object { grid-column: 8 / -1; }
.sted-hero--art h1 { max-width: 17ch; }
.sted-art svg { display: block; width: 100%; height: auto; }
.sted-hero--art .sted-art { max-width: 500px; margin-left: auto; }
@media (max-width: 899px) {
  .sted-hero--art .sted-hero-statement, .sted-hero--art .sted-hero-object { grid-column: 1 / -1; }
  .sted-hero--art .sted-hero-object { display: none; } /* every drawing restates the page's own words */
}

/* Home: the report beneath the statement, laid across the edge of the band
   onto the white page below, like a document put down on a desk. */
.sted-hero--doc { padding-bottom: 0 !important; background: linear-gradient(to bottom, var(--s-mist) 0, var(--s-mist) calc(100% - 9rem), var(--s-paper) calc(100% - 9rem)); }
.sted-hero--doc h1 { max-width: 20ch; font-size: clamp(2.5rem, 5.4vw, 4.25rem); }
.sted-hero--doc .sted-hero-object { margin-top: clamp(2.5rem, 5vw, 4rem); }

/* -------------------------------------------------------- section opener
   The heading takes the left half; its intro sits beside it on the right,
   aligned to the heading's first line. Everything else runs full width
   beneath. A section that has no intro lets its heading run longer. */
.sted-ann {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--s-gap);
  align-items: start;
}
.sted-ann > * { grid-column: 1 / -1; margin-block: 0; }
.sted-ann > .sted-h2 { grid-column: 1 / span 8; margin: 0; max-width: 22ch; }
.sted-ann > .sted-h2:has(+ .sted-intro) { grid-column: 1 / span 6; }
.sted-ann > .sted-h2 + .sted-intro { grid-column: 8 / -1; grid-row: 1; padding-top: 0.45rem; }
.sted-ann > .sted-h2 ~ :not(.sted-intro):not(.sted-ann-note) { margin-top: clamp(2.25rem, 4vw, 3.5rem); }
.sted-ann > .sted-h2 ~ :not(.sted-intro) ~ :not(.sted-ann-note) { margin-top: 1.5rem; }
.sted-intro { margin: 0; font-size: 1.125rem; line-height: 1.6; color: var(--s-slate); max-width: 52ch; }
.sted-ann > .sted-intro:not(.sted-h2 + .sted-intro) { max-width: 62ch; margin-top: 1rem; }
.sted-ann-note {
  margin-top: 2rem !important; max-width: 68ch;
  font-size: 0.95rem; color: var(--s-slate);
}
.sted-h2 { color: var(--s-ink); }
@media (max-width: 899px) {
  .sted-ann > .sted-h2, .sted-ann > .sted-h2:has(+ .sted-intro), .sted-ann > .sted-h2 + .sted-intro { grid-column: 1 / -1; grid-row: auto; }
  .sted-ann > .sted-h2 + .sted-intro { padding-top: 0; margin-top: 1rem; }
}

/* A section heading set where the label used to be. */
.sted-eyebrow { display: none; }

/* --------------------------------------------------------------- measure */
.sted-measure { max-width: 62ch; }
.sted-measure-narrow { max-width: 52ch; }
.sted-prose { max-width: 68ch; }
/* The article template's .sted-prose is the full-width wrapper of a constrained
   720px column; the measure belongs to the column, not the wrapper. */
.wp-block-group.sted-prose.is-layout-constrained { max-width: none; }
.sted-prose > * + * { margin-top: 1.1rem; }
.sted-prose > :first-child { margin-top: 0; }
.sted-prose h2 { margin-top: 2.6rem; font-size: clamp(1.5rem, 2.4vw, 1.875rem); }
.sted-prose h3 { margin-top: 2rem; font-size: 1.25rem; }
.sted-prose ul, .sted-prose ol { padding-left: 1.25rem; }
.sted-prose li + li { margin-top: 0.45rem; }
.sted-prose li::marker { color: var(--s-spruce); }

/* ---------------------------------------------------------------- doors
   Three next steps directly under the home report. */
.sted-doors-section { padding-top: clamp(3rem, 5vw, 4.5rem) !important; }
.sted-doors { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-gap); }
.sted-door {
  display: flex; flex-direction: column; gap: 0.5rem;
  padding-top: 1.25rem; border-top: 2px solid var(--s-spruce);
  color: var(--s-ink); text-decoration: none;
}
.sted-door-title { font-size: 1.25rem; font-weight: 600; letter-spacing: -0.01em; }
.sted-door-line { color: var(--s-slate); line-height: 1.55; }
.sted-door-label { margin-top: auto; padding-top: 0.5rem; font-weight: 600; color: var(--s-spruce); }
.sted-door:hover .sted-door-title { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.2em; }
@media (max-width: 899px) { .sted-doors { grid-template-columns: minmax(0, 1fr); gap: 2rem; } }

/* ----------------------------------------------------------------- index
   The services list: two columns of entries, each under its own rule. */
.sted-index { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--s-gap); }
.sted-index > li {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.25rem 1rem;
  padding: 1.6rem 0 1.8rem; border-top: 1px solid var(--s-rule);
}
.sted-index-n--dot { display: none; }
.sted-index.is-numbered > li { grid-template-columns: 2.5rem minmax(0, 1fr) auto; }
.sted-index-n { font-weight: 600; color: var(--s-spruce); padding-top: 0.15rem; }
.sted-index-body h3 { margin: 0; font-size: 1.375rem; }
.sted-index-body h3 a { color: var(--s-ink); text-decoration: none; }
.sted-index-body h3 a:hover { color: var(--s-spruce); text-decoration: underline; text-decoration-thickness: 2px; }
.sted-index-body p { margin: 0.5rem 0 0; color: var(--s-slate); max-width: 46ch; }
.sted-index-count { font-size: 0.875rem; color: var(--s-slate); white-space: nowrap; padding-top: 0.35rem; }
@media (max-width: 899px) { .sted-index { grid-template-columns: minmax(0, 1fr); } }

/* The price statement: the one spruce panel inside a light page. */
.sted-frame {
  margin-top: clamp(2.5rem, 4vw, 3.5rem);
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2rem; align-items: center;
  background: var(--s-spruce); color: var(--s-on-spruce);
  padding: clamp(1.75rem, 4vw, 3rem); border-radius: 6px;
}
.sted-frame-lead { margin: 0; font-size: clamp(1.4rem, 2.4vw, 1.875rem); line-height: 1.2; font-weight: 600; letter-spacing: -0.015em; color: #FFFFFF; max-width: 26ch; }
.sted-frame-body { margin: 0.9rem 0 0; color: var(--s-on-spruce); max-width: 62ch; }
.sted-frame-btn.wp-block-button__link { align-self: center; justify-self: end; height: auto; background: #FFFFFF; color: var(--s-spruce); border-color: #FFFFFF; padding: 0.9rem 1.45rem; font-weight: 600; border-radius: 4px; white-space: nowrap; }
.sted-frame-btn.wp-block-button__link:hover { background: var(--s-spruce-soft); border-color: var(--s-spruce-soft); }
@media (max-width: 899px) { .sted-frame { grid-template-columns: minmax(0, 1fr); } .sted-frame-btn { justify-self: start; } }

/* ---------------------------------------------------------------- figure */
.sted-figure { gap: clamp(2rem, 6vw, 5rem) !important; }
.sted-figure .sted-h2 { margin-top: 0; }
.sted-figure .sted-prose { margin-top: 1.25rem; color: var(--s-slate); }
.sted-figure-art svg { display: block; width: 100%; height: auto; max-width: 440px; }
@media (max-width: 781px) { .sted-figure-art svg { max-width: 340px; } }

/* ---------------------------------------------------------------- latest */
.sted-latest { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-gap); }
.sted-latest-card {
  display: flex; flex-direction: column; gap: 0.6rem;
  padding-top: 1.25rem; border-top: 1px solid var(--s-rule);
  color: var(--s-ink); text-decoration: none;
}
.sted-latest-cat { font-size: 0.875rem; font-weight: 600; color: var(--s-verd); }
.sted-latest-title { font-size: 1.25rem; font-weight: 600; line-height: 1.3; letter-spacing: -0.01em; }
.sted-latest-line { color: var(--s-slate); font-size: 0.98rem; }
.sted-latest-meta { margin-top: auto; padding-top: 0.4rem; font-weight: 600; color: var(--s-spruce); }
.sted-latest-card:hover .sted-latest-title { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.2em; }
.sted-latest-section:not(:has(.sted-latest-card)) { display: none; }
@media (max-width: 899px) { .sted-latest { grid-template-columns: minmax(0, 1fr); gap: 2rem; } }

/* ----------------------------------------------------------------- lines */
.sted-lines { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--s-gap); }
.sted-lines > li { position: relative; padding: 1rem 0 1rem 1.6rem; border-top: 1px solid var(--s-rule); font-size: 1.0625rem; }
.sted-lines > li::before { content: ""; position: absolute; left: 0; top: 1.55rem; width: 8px; height: 8px; background: var(--s-spruce); }
@media (max-width: 781px) { .sted-lines { grid-template-columns: minmax(0, 1fr); } }

/* Statements the firm stands behind, set large (About). */
.sted-plates { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--s-gap); }
.sted-plates > li {
  padding: 1.5rem 0 1.75rem; border-top: 1px solid var(--s-ink);
  font-size: clamp(1.25rem, 2vw, 1.5rem); line-height: 1.35; font-weight: 500; letter-spacing: -0.01em; max-width: 30ch;
}
@media (max-width: 781px) { .sted-plates { grid-template-columns: minmax(0, 1fr); } }

/* ---------------------------------------------------------- cards, units */
.sted-cards { margin-top: 0 !important; }
.sted-cards + .sted-cards { margin-top: 2.5rem !important; }
.sted-unit { padding-top: 1.25rem; border-top: 1px solid var(--s-rule); }
.sted-unit h3 { margin: 0; font-size: 1.25rem !important; line-height: 1.3; }
.sted-unit h3 a, .sted-unit-link { color: var(--s-ink); text-decoration: none; }
.sted-unit h3 a:hover { color: var(--s-spruce); text-decoration: underline; text-decoration-thickness: 2px; }
.sted-unit p { margin: 0.6rem 0 0; color: var(--s-slate); }
.sted-unit-tag, .sted-cell-tag { margin: 0 0 0.6rem !important; font-size: 0.875rem; font-weight: 600; color: var(--s-verd); }
.sted-more {
  display: inline-flex; align-items: center; gap: 8px;
  font-weight: 600; color: var(--s-spruce); text-decoration: none;
}
.sted-more::after {
  content: ""; flex: none; width: 14px; height: 1px; background: currentColor;
  transition: width 160ms var(--s-ease), height 160ms var(--s-ease);
}
.sted-more:hover::after, .sted-more:focus-visible::after { width: 24px; height: 2px; }
.sted-more:active::after { width: 18px; }

/* Insights index (query loop) */
.wp-block-post-template .sted-unit { height: 100%; }
.sted-unit .wp-block-post-title { margin: 0; font-size: 1.25rem !important; }
.sted-unit .wp-block-post-title a { color: var(--s-ink); text-decoration: none; }
.sted-unit .wp-block-post-title a:hover { color: var(--s-spruce); text-decoration: underline; text-decoration-thickness: 2px; }
.sted-unit .wp-block-post-excerpt { color: var(--s-slate); margin-top: 0.6rem; }
.sted-unit .wp-block-post-excerpt__more-link { font-weight: 600; color: var(--s-spruce); }

/* The six-area grid (Managed IT) */
.sted-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5rem var(--s-gap); }
.sted-grid > .sted-unit h3 { font-size: 1.25rem; }
/* A one-word tag over a heading that already names the area is a label for
   its own sake, wherever it appears. */
.sted-unit-tag, .sted-cell-tag { display: none !important; }
@media (max-width: 899px) { .sted-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .sted-grid { grid-template-columns: minmax(0, 1fr); } }

/* Matrix (Cybersecurity) and tabs (Compliance): a ruled table of cells. */
.sted-matrix, .sted-tabs {
  display: grid; gap: 1px; background: var(--s-rule);
  border: 1px solid var(--s-rule); border-radius: 6px; overflow: hidden;
}
.sted-matrix { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* As many columns as there are cells, so two cells never leave an empty third. */
.sted-tabs { grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }
.sted-cell { background: var(--s-paper); padding: clamp(1.5rem, 3vw, 2.25rem); }
.sted-ground--mist .sted-cell { background: var(--s-paper); }
.sted-cell h3 { margin: 0; font-size: 1.25rem; }
.sted-cell p { margin: 0.6rem 0 0; color: var(--s-slate); }
.sted-cell .sted-more { margin-top: 1rem; }
@media (max-width: 899px) { .sted-matrix, .sted-tabs { grid-template-columns: minmax(0, 1fr); } }

/* Two arrangements side by side (Managed IT). */
.sted-paths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-gap); }
.sted-path { background: var(--s-paper); border: 1px solid var(--s-rule); border-radius: 6px; padding: clamp(1.5rem, 3vw, 2.25rem); }
.sted-path h3 { margin: 0 0 0.9rem; font-size: 1.375rem; }
.sted-path .sted-prose { color: var(--s-slate); }
@media (max-width: 899px) { .sted-paths { grid-template-columns: minmax(0, 1fr); } }

/* ------------------------------------------------------------ the steps
   The order is real, so the steps are numbered. */
.sted-units {
  list-style: none; margin: 0; padding: 0; counter-reset: st;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 2.5rem var(--s-gap);
}
.sted-units > li { counter-increment: st; padding-top: 1.25rem; border-top: 2px solid var(--s-spruce); }
.sted-units > li::before {
  content: counter(st); display: block; margin-bottom: 0.9rem;
  font-size: 2rem; line-height: 1; font-weight: 600; color: var(--s-spruce); letter-spacing: -0.02em;
}
.sted-units h3 { margin: 0; font-size: 1.25rem; }
.sted-units p { margin: 0.6rem 0 0; color: var(--s-slate); }

/* The runbook (How we work): numbered nodes on a vertical line. */
.sted-spine { list-style: none; margin: 0; padding: 0; counter-reset: sp; position: relative; max-width: 54rem; }
.sted-spine > li { counter-increment: sp; position: relative; display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: 1.5rem; padding-bottom: 2.25rem; }
.sted-spine > li:not(:last-child)::before {
  content: ""; position: absolute; left: calc(1.375rem - 0.5px); top: 2.75rem; bottom: 0; width: 1px; background: var(--s-rule);
}
.sted-spine > li:last-child { padding-bottom: 0; }
.sted-node {
  display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%;
  border: 1.5px solid var(--s-spruce); background: var(--s-paper); position: relative; z-index: 1;
}
.sted-node::after { content: counter(sp); font-weight: 600; color: var(--s-spruce); }
.sted-spine h3 { margin: 0.5rem 0 0.4rem; font-size: 1.25rem; }
.sted-spine p { margin: 0; color: var(--s-slate); max-width: 62ch; }

/* The checklist (Assessment). */
.sted-checks { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 2rem var(--s-gap); }
.sted-checks > li { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: 1rem; padding-top: 1.25rem; border-top: 1px solid var(--s-rule); }
.sted-check { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--s-spruce-soft); color: var(--s-verd); }
.sted-check svg { width: 1.2rem; height: 1.2rem; }
.sted-check-tick { stroke-dasharray: 24; stroke-dashoffset: 0; }
.sted-checks h3 { margin: 0.2rem 0 0.4rem; font-size: 1.2rem; }
.sted-checks p { margin: 0; color: var(--s-slate); }

/* ------------------------------------------------------------ spec list */
.sted-specs { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--s-ink); }
.sted-specs > li {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--s-gap);
  padding: 1.25rem 0; border-bottom: 1px solid var(--s-rule);
}
.sted-specs .sted-k { grid-column: 1 / span 4; font-weight: 600; font-size: 1.0625rem; line-height: 1.45; }
.sted-specs .sted-v { grid-column: 5 / -1; }
.sted-specs .sted-v p { margin: 0; color: var(--s-slate); max-width: 62ch; }
@media (max-width: 781px) {
  .sted-specs .sted-k, .sted-specs .sted-v { grid-column: 1 / -1; }
  .sted-specs .sted-v { margin-top: 0.4rem; }
}

/* Where an answer comes from (Compliance renewal walkthrough). */
.sted-standing {
  display: inline-flex; align-items: center; gap: 0.4rem;
  margin-bottom: 0.45rem; padding: 0.2rem 0.55rem; border-radius: 999px;
  font-size: 0.8125rem; font-weight: 600; line-height: 1.3;
}
.sted-standing--from-the-record { background: var(--s-spruce-soft); color: var(--s-verd); }
.sted-standing--from-the-assessment { background: var(--s-mist); color: var(--s-slate); box-shadow: inset 0 0 0 1px var(--s-rule); }
.sted-standing--yours-to-answer { background: #F7E9E3; color: var(--s-ox); }

/* ----------------------------------------------------------------- ledger */
.sted-scroll-x { overflow-x: auto; }
.sted-scroll-x:focus-visible { outline: 2px solid var(--s-spruce); outline-offset: 4px; }
.sted-ledger { width: 100%; border-collapse: collapse; font-size: 0.98rem; }
.sted-ledger th {
  text-align: left; font-size: 0.875rem; font-weight: 600; color: var(--s-slate);
  padding: 0 1.25rem 0.75rem 0; border-bottom: 1px solid var(--s-ink);
}
.sted-ledger td { padding: 1rem 1.25rem 1rem 0; border-bottom: 1px solid var(--s-rule); vertical-align: top; }
.sted-ledger td:last-child, .sted-ledger th:last-child { padding-right: 0; }
.sted-ref { font-weight: 600; white-space: nowrap; }
.sted-ledger-more { margin-top: 1rem; }
.sted-ledger-more > summary {
  cursor: pointer; list-style: none; display: inline-flex; align-items: center; gap: 0.6rem;
  font-weight: 600; color: var(--s-spruce); padding: 0.4rem 0;
}
.sted-ledger-more > summary::-webkit-details-marker { display: none; }
.sted-ledger-more > summary::before {
  content: ""; width: 0.55rem; height: 0.55rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-2px, -2px); transition: transform 180ms var(--s-ease);
}
.sted-ledger-more[open] > summary::before { transform: rotate(225deg) translate(-2px, -2px); }
.sted-ledger-more .sted-scroll-x { margin-top: 1rem; }

/* State chips: verdigris confirmed, oxide attention, slate pending. Each
   carries its word, so none depends on colour. */
.sted-state {
  display: inline-flex; align-items: center; gap: 0.45rem;
  font-family: var(--s-sans); font-size: 0.8125rem; font-weight: 600; line-height: 1.3;
  color: var(--s-verd); white-space: nowrap;
}
.sted-state::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex: none; }
.sted-state--ox { color: var(--s-ox); }
.sted-state--zinc { color: var(--s-slate); }
.sted-state--zinc::before { background: transparent; box-shadow: inset 0 0 0 1.5px currentColor; }

/* -------------------------------------------------------------------- FAQ */
.sted-faq { border-top: 1px solid var(--s-ink); max-width: 56rem; }
.sted-faq details { border-bottom: 1px solid var(--s-rule); }
.sted-faq summary {
  cursor: pointer; list-style: none; position: relative;
  padding: 1.25rem 3rem 1.25rem 0; font-size: 1.125rem; font-weight: 600; line-height: 1.4;
}
.sted-faq summary::-webkit-details-marker { display: none; }
.sted-faq summary::before, .sted-faq summary::after {
  content: ""; position: absolute; right: 0.4rem; top: 50%; width: 14px; height: 2px; background: var(--s-spruce);
  transition: transform 200ms var(--s-ease);
}
.sted-faq summary::after { transform: rotate(90deg); }
.sted-faq details[open] summary::after { transform: rotate(0deg); }
.sted-faq summary:hover { color: var(--s-spruce); }
.sted-faq-a { padding: 0 3rem 1.5rem 0; }
.sted-faq-a p { margin: 0; color: var(--s-slate); max-width: 68ch; }

/* ------------------------------------------------------------------ aside */
.sted-aside { background: var(--s-mist); border-radius: 6px; padding: 1.75rem; }
.sted-ground--mist .sted-aside { background: var(--s-paper); border: 1px solid var(--s-rule); }
.sted-aside-h { margin: 0 0 0.9rem; font-weight: 600; font-size: 1.0625rem; }
.sted-aside ul { margin: 0; padding: 0; list-style: none; }
.sted-aside li { position: relative; padding-left: 1.2rem; color: var(--s-slate); }
.sted-aside li + li { margin-top: 0.6rem; }
.sted-aside li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 6px; height: 6px; background: var(--s-spruce); }

/* --------------------------------------------------------- closing band */
.sted-cta h2 { font-size: clamp(1.9rem, 3.4vw, 2.75rem); max-width: 20ch; margin: 0; }
.sted-cta .sted-measure-narrow { margin-top: 1rem; color: var(--s-on-spruce); }

/* The privacy notice: two columns of text. */
.sted-prose--columns { columns: 2; column-gap: 4rem; max-width: none !important; }
.sted-prose--columns > * { break-inside: avoid; }
.sted-prose--columns h2, .sted-prose--columns h3 { break-after: avoid; margin-top: 1.6rem; font-size: 1.25rem; }
.sted-prose--columns > :first-child { margin-top: 0; }
.sted-prose--columns p { color: var(--s-slate); }
@media (max-width: 781px) { .sted-prose--columns { columns: 1; } }

/* ------------------------------------------------------------------ forms */
.sted-form, .sted-form-main { display: grid; gap: 1.25rem; }
.sted-form:not(:has(.sted-form-grid)) { max-width: 46rem; }
.sted-form .sted-field { display: grid; gap: 0.45rem; }
.sted-form label { font-weight: 600; font-size: 0.95rem; }
.sted-form .sted-optional { color: var(--s-slate); font-weight: 400; }
.sted-form input[type="text"], .sted-form input[type="email"], .sted-form input[type="tel"],
.sted-form input[type="date"], .sted-form select, .sted-form textarea {
  box-sizing: border-box; width: 100%; min-height: 48px;
  padding: 0.75rem 0.9rem; font: inherit; color: var(--s-ink);
  background: var(--s-paper); border: 1px solid var(--s-rule-strong); border-radius: 4px;
  transition: border-color 160ms var(--s-ease), box-shadow 160ms var(--s-ease);
}
.sted-form input:focus-visible, .sted-form select:focus-visible, .sted-form textarea:focus-visible {
  outline: none; border-color: var(--s-spruce); box-shadow: 0 0 0 3px rgba(18, 59, 54, 0.18);
}
.sted-form textarea { min-height: 9.5rem; resize: vertical; }
.sted-form .sted-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.sted-form button[type="submit"] { cursor: pointer; font: inherit; font-weight: 600; background: var(--s-spruce); color: #FFFFFF; border-radius: 4px; padding: 0.9rem 1.45rem; }
.sted-form button[type="submit"]:hover { background: var(--s-spruce-deep); }
.sted-form-notice { border: 1px solid var(--s-verd); border-left-width: 4px; background: var(--s-paper); padding: 1rem 1.25rem; border-radius: 4px; }
.sted-form-notice.is-error { border-color: var(--s-ox); }
.sted-consent { font-size: 0.9rem; color: var(--s-slate); }

/* The booking calendar (Contact). */
.sted-form-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.sted-form-aside { position: sticky; top: 1.5rem; }
.sted-booking-h { margin: 0 0 1rem; }
.sted-booking { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 1.2rem; align-items: start; margin-bottom: 0.6rem; }
@media (max-width: 899px) { .sted-form-grid { grid-template-columns: minmax(0, 1fr); } .sted-form-aside { position: static; } }
.sted-cal { border: 1px solid var(--s-rule); border-radius: 6px; background: var(--s-paper); padding: 1rem 1rem 1.1rem; }
.sted-cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.8rem; }
.sted-cal-month { font-weight: 600; color: var(--s-ink); }
.sted-cal-nav { border: 1px solid var(--s-rule-strong); border-radius: 4px; background: var(--s-paper); width: 2.25rem; height: 2.25rem; cursor: pointer; font-size: 1rem; line-height: 1; color: var(--s-ink); }
.sted-cal-nav:hover:not(:disabled) { border-color: var(--s-spruce); color: var(--s-spruce); }
.sted-cal-nav:disabled { opacity: 0.35; cursor: default; }
.sted-cal-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
.sted-cal-dow { font-size: 0.8125rem; font-weight: 600; color: var(--s-slate); text-align: center; padding-bottom: 0.35rem; }
.sted-cal-day {
  display: block; width: 100%; aspect-ratio: 1.15; border: 1px solid var(--s-rule); border-radius: 4px;
  background: var(--s-paper); font: inherit; font-size: 0.95rem; color: var(--s-ink); cursor: pointer;
}
.sted-cal-day:hover:not(:disabled) { border-color: var(--s-spruce); }
.sted-cal-day[aria-pressed="true"] { background: var(--s-spruce); border-color: var(--s-spruce); color: #FFFFFF; font-weight: 600; }
.sted-cal-day:disabled { color: #9AA5A2; background: var(--s-mist); border-color: transparent; cursor: default; }
.sted-cal-day.is-blank { visibility: hidden; }
.sted-slots { display: grid; gap: 0.5rem; }
.sted-slots-h { font-weight: 600; font-size: 0.95rem; margin: 0 0 0.2rem; }
.sted-slot {
  text-align: left; border: 1px solid var(--s-rule-strong); border-radius: 4px; background: var(--s-paper);
  padding: 0.75rem 0.9rem; cursor: pointer; display: flex; justify-content: space-between; gap: 1rem;
  font: inherit; font-size: 0.95rem; color: var(--s-ink); min-height: 48px; align-items: center;
}
.sted-slot span:last-child { font-size: 0.875rem; color: var(--s-slate); }
.sted-slot[aria-pressed="true"] { border-color: var(--s-spruce); box-shadow: inset 0 0 0 1px var(--s-spruce); background: var(--s-spruce-soft); }
.sted-slot:hover { border-color: var(--s-spruce); }
.sted-booking-status { grid-column: 1 / -1; font-size: 0.9rem; font-weight: 600; color: var(--s-verd); min-height: 1.2em; margin: 0; }
.sted-booking-fallback { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.sted-motion .sted-booking-fallback, .sted-cal-js .sted-booking-fallback { display: none; }
.sted-cal[hidden], .sted-slots[hidden] { display: none; }
@media (max-width: 699px) { .sted-booking, .sted-booking-fallback { grid-template-columns: minmax(0, 1fr); } }

/* ---------------------------------------------------------------- articles */
.sted-article-meta { font-size: 0.9rem; font-weight: 600; color: var(--s-verd); }
.sted-article-meta a { color: inherit; text-decoration: none; }
.sted-page--article .wp-block-post-title { font-size: clamp(2.1rem, 4.4vw, 3.25rem); line-height: 1.08; letter-spacing: -0.025em; }
.sted-page--article .sted-prose { font-size: 1.125rem; }
.wp-block-table table { border-collapse: collapse; width: 100%; font-size: 0.98rem; }
.wp-block-table table, .wp-block-table td, .wp-block-table th { border: 0; }
.wp-block-table th { text-align: left; font-size: 0.875rem; font-weight: 600; color: var(--s-slate); border-bottom: 1px solid var(--s-ink); padding: 0 1rem 0.7rem 0; }
.wp-block-table td { border-bottom: 1px solid var(--s-rule); padding: 0.85rem 1rem 0.85rem 0; vertical-align: top; }
.sted-search-result { padding: 1.25rem 0; border-bottom: 1px solid var(--s-rule); }
.sted-search-result:first-child { border-top: 1px solid var(--s-ink); }
.sted-search-result h2 { font-size: 1.25rem; margin: 0 0 0.35rem; }
.sted-search-result p { margin: 0; color: var(--s-slate); }
.wp-block-query-pagination a { color: var(--s-spruce); font-weight: 600; }

/* ----------------------------------------------------------------- footer */
.sted-footer { background: var(--s-spruce-deep) !important; color: var(--s-on-spruce); }
.sted-footer .sted-logo svg { height: 30px; width: auto; display: block; }
.sted-footer p { color: var(--s-on-spruce); }
.sted-footer a { color: #FFFFFF; text-decoration: none; }
.sted-footer a:hover { text-decoration: underline; text-decoration-thickness: 1px; }
.sted-footer ul { list-style: none; padding-left: 0; margin: 0; }
.sted-footer ul li + li { margin-top: 0.6rem; }
.sted-footer-heading { font-weight: 600; font-size: 0.9rem; color: var(--s-on-spruce-dim) !important; margin-bottom: 0.9rem !important; }
.sted-footer-fine { color: var(--s-on-spruce-dim) !important; font-size: 0.875rem; }
.sted-footer .wp-block-separator { border: 0; border-top: 1px solid var(--s-spruce-line) !important; background: none !important; opacity: 1; }

/* ==========================================================================
   THE MONTHLY REPORT SHEET, the site's one signature.
   A document on paper: white, set in the serif, with the only shadow on the
   site because it is the only paper on the page. Row headings, states and
   the apparatus labels stay in the interface's sans.
   ========================================================================== */
.sted-record {
  position: relative;
  background: var(--s-paper);
  border: 1px solid var(--s-rule);
  border-radius: 6px;
  padding: clamp(1.25rem, 3.4vw, 2.75rem) clamp(1.25rem, 3.8vw, 3.25rem) clamp(1.25rem, 3vw, 2.25rem);
  box-shadow: 0 1px 2px rgba(18, 59, 54, 0.06), 0 24px 48px -24px rgba(18, 59, 54, 0.30);
}
.sted-hero--doc .sted-record { max-width: 64rem; }
.sted-record-head {
  display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap;
  padding-bottom: 1.1rem; margin-bottom: 0.25rem; border-bottom: 2px solid var(--s-ink);
}
.sted-record-title { display: flex; flex-direction: column; gap: 0.2rem; }
.sted-record-name { font-family: var(--s-serif); font-size: clamp(1.375rem, 2.4vw, 1.75rem); font-weight: 600; line-height: 1.15; color: var(--s-ink); letter-spacing: -0.01em; }
.sted-record-for { font-size: 0.9rem; color: var(--s-slate); }
.sted-record-stamp {
  font-size: 0.8125rem; font-weight: 600; color: var(--s-slate);
  border: 1px solid var(--s-rule-strong); border-radius: 999px; padding: 0.2rem 0.65rem; white-space: nowrap;
}
.sted-record-row {
  display: grid; grid-template-columns: 8.5rem minmax(0, 1fr) auto;
  column-gap: 1.25rem; align-items: baseline;
  padding: 1rem 0; border-bottom: 1px solid var(--s-rule);
}
.sted-record-row:last-child { border-bottom: 0; }
.sted-record-k { font-size: 0.95rem; font-weight: 600; color: var(--s-ink); }
.sted-record-line { margin: 0; font-family: var(--s-serif); font-size: 1.0625rem; line-height: 1.5; color: var(--s-ink); }
.sted-record-note {
  margin: 1rem 0 0; padding-top: 1rem; border-top: 1px solid var(--s-rule);
  font-family: var(--s-serif); font-size: 0.95rem; line-height: 1.55; color: var(--s-slate); max-width: 72ch;
}

/* Basis connects: a verdigris guide rises from the basis to the line it
   supports. Limit terminates: an oxide rule that ends in a stop. Each also
   carries its own word, so neither depends on colour. */
.sted-record-evidence { grid-column: 2 / -1; display: grid; gap: 0.45rem; margin-top: 0.7rem; }
.sted-record-field {
  position: relative; margin: 0; padding-left: 1.75rem;
  font-family: var(--s-serif); font-size: 0.95rem; line-height: 1.5; color: var(--s-slate);
}
.sted-record-field-k { margin-right: 0.5rem; font-family: var(--s-sans); font-size: 0.8125rem; font-weight: 600; }
.sted-record-field::before, .sted-record-field::after {
  content: ""; position: absolute;
  transition: width 220ms var(--s-ease), height 220ms var(--s-ease);
}
.sted-record-field--basis .sted-record-field-k { color: var(--s-verd); }
.sted-record-field--basis::before { left: 0.5rem; top: -0.7rem; height: calc(0.7rem + 0.75em); width: 1px; background: var(--s-verd); }
.sted-record-field--basis::after { left: 0.5rem; top: 0.75em; width: 0.8rem; height: 1px; background: var(--s-verd); }
.sted-record-field--limit .sted-record-field-k { color: var(--s-ox); }
.sted-record-field--limit::before { left: 0.15rem; top: 0.75em; width: 1rem; height: 1px; background: var(--s-ox); }
.sted-record-field--limit::after { left: 1.15rem; top: calc(0.75em - 0.4rem); width: 1px; height: 0.8rem; background: var(--s-ox); }
@media (max-width: 639px) {
  .sted-record-row { grid-template-columns: minmax(0, 1fr) auto; row-gap: 0.3rem; }
  .sted-record-k { grid-column: 1 / -1; }
  .sted-record-evidence { grid-column: 1 / -1; }
}

/* Inspection: a row with a basis and a limit becomes a toggle once the
   script runs. Nothing is revealed; the row shows that it is being read. */
.sted-record-inspect { all: unset; cursor: pointer; font: inherit; color: inherit; border-radius: 2px; }
.sted-record-inspect:focus-visible { outline: 2px solid var(--s-spruce); outline-offset: 3px; }
.sted-record.is-inspectable .sted-record-row.has-evidence {
  position: relative; cursor: pointer;
  transition: transform 220ms cubic-bezier(.22, 1, .36, 1), background-color 220ms cubic-bezier(.22, 1, .36, 1);
}
.sted-record.is-inspectable .sted-record-row.has-evidence:hover .sted-record-k { text-decoration: underline; text-underline-offset: 0.2em; }
.sted-record-row.is-inspected { transform: translate3d(4px, 0, 0); }
.sted-record-row.is-inspected::before {
  content: ""; position: absolute; left: -14px; top: 1rem; bottom: 1rem; width: 3px; border-radius: 2px;
  background: var(--s-ox);
}
.sted-record-row .sted-state { transition: transform 220ms cubic-bezier(.22, 1, .36, 1); }
.sted-record-row.is-inspected .sted-state { transform: translate3d(-2px, 0, 0); }
.sted-record-row.is-inspected .sted-record-field { color: var(--s-ink); }
.sted-record-row.is-inspected .sted-record-field--basis::before { width: 2px; }
.sted-record-row.is-inspected .sted-record-field--basis::after { width: 0.9rem; height: 2px; }
.sted-record-row.is-inspected .sted-record-field--limit::before { height: 2px; }
.sted-record-row.is-inspected .sted-record-field--limit::after { width: 2px; height: 1.12rem; top: calc(0.75em - 0.56rem); }
@keyframes sted-in-l { from { transform: translate3d(-6px, 0, 0); } to { transform: none; } }
@keyframes sted-in-r { from { transform: translate3d(6px, 0, 0); } to { transform: none; } }
.sted-record-row.is-inspected .sted-record-field--basis { animation: sted-in-l 280ms cubic-bezier(.22, 1, .36, 1) 40ms both; }
.sted-record-row.is-inspected .sted-record-field--limit { animation: sted-in-r 280ms cubic-bezier(.22, 1, .36, 1) 80ms both; }

/* The Evidence Pass: the index the script carries down the home report,
   once. It ends as the attention row's own index bar. */
.sted-pass { position: absolute; left: 10px; top: 0; width: 3px; height: 18px; border-radius: 2px; background: var(--s-ox); pointer-events: none; z-index: 1; }
.sted-pass::after { content: ""; position: absolute; left: 3px; top: 8.5px; width: 6px; height: 1px; background: var(--s-ink); }

/* A note that states what the evidence does not establish wears the same
   Limit mark as the report. */
.sted-ann-note.sted-limit-note {
  position: relative; padding-left: 1.75rem; max-width: 68ch;
  font-family: var(--s-serif); font-size: 1rem; line-height: 1.55; color: var(--s-ink);
}
.sted-limit-note .sted-record-field-k { color: var(--s-ox); }
.sted-limit-note::before, .sted-limit-note::after { content: ""; position: absolute; background: var(--s-ox); }
.sted-limit-note::before { left: 0.15rem; top: 0.78em; width: 1rem; height: 1px; }
.sted-limit-note::after { left: 1.15rem; top: calc(0.78em - 0.4rem); width: 1px; height: 0.8rem; }

/* ==========================================================================
   MOTION. Only where something changes (kept from v6.1): a drawing that
   depicts an event plays it once when it is reached; the report's pass and
   inspection; the checklist ticks; the veil between pages. Everything is
   scoped to `.sted-motion`, which the script sets only when motion is
   allowed, so with JavaScript off every drawing renders finished.
   ========================================================================== */
@keyframes sted-draw { to { stroke-dashoffset: 0; } }
@keyframes sted-flag-in { from { opacity: 0; transform: scaleY(0.82); } to { opacity: 1; transform: none; } }
.sted-motion .sted-art .sted-a-trace { stroke-dasharray: 620; stroke-dashoffset: 620; }
.sted-art .sted-a-flag { transform-box: fill-box; transform-origin: center; }
.sted-motion .sted-art .sted-a-flag { opacity: 0; }
.sted-art.is-in .sted-a-trace-1 { animation: sted-draw 900ms ease-out forwards; }
.sted-art.is-in .sted-a-trace-2 { animation: sted-draw 420ms ease-out 820ms forwards; }
.sted-art.is-in .sted-a-trace-3 { animation: sted-draw 900ms ease-out 1180ms forwards; }
.sted-art.is-in .sted-a-flag { animation: sted-flag-in 380ms ease-out 1160ms forwards; }

@keyframes sted-packet {
  0% { opacity: 0; transform: translate3d(-26px, 26px, 0); }
  12%, 78% { opacity: 1; }
  100% { opacity: 0; transform: translate3d(26px, -26px, 0); }
}
.sted-motion .sted-art.is-in .sted-a-packet { animation: sted-packet 3.2s linear 2; }
.sted-art .sted-a-packet-2 { animation-delay: 1.06s; }
.sted-art .sted-a-packet-3 { animation-delay: 2.12s; }

@keyframes sted-current { to { stroke-dashoffset: -36px; } }
.sted-art .sted-a-lead { stroke-dasharray: 6 12; }
.sted-motion .sted-art.is-in .sted-a-lead { animation: sted-current 1.9s linear 3; }

@keyframes sted-tick-in { from { opacity: 0; transform: translate3d(-3px, 0, 0); } to { opacity: 1; transform: none; } }
.sted-art .sted-a-tick { transform-box: fill-box; transform-origin: center; }
.sted-motion .sted-art .sted-a-tick { opacity: 0; }
.sted-art.is-in .sted-a-tick { animation: sted-tick-in 300ms ease-out forwards; }
.sted-art.is-in .sted-a-tick-0 { animation-delay: 60ms; }
.sted-art.is-in .sted-a-tick-1 { animation-delay: 120ms; }
.sted-art.is-in .sted-a-tick-2 { animation-delay: 180ms; }
.sted-art.is-in .sted-a-tick-3 { animation-delay: 240ms; }
.sted-art.is-in .sted-a-tick-4 { animation-delay: 300ms; }
.sted-art.is-in .sted-a-tick-5 { animation-delay: 360ms; }
.sted-art.is-in .sted-a-tick-6 { animation-delay: 420ms; }
.sted-art.is-in .sted-a-tick-7 { animation-delay: 480ms; }
.sted-art.is-in .sted-a-tick-8 { animation-delay: 540ms; }
.sted-art.is-in .sted-a-tick-9 { animation-delay: 600ms; }
.sted-art.is-in .sted-a-tick-10 { animation-delay: 660ms; }
.sted-art.is-in .sted-a-tick-11 { animation-delay: 720ms; }

@keyframes sted-tick { to { stroke-dashoffset: 0; } }
.sted-motion .sted-page--assessment .sted-check-tick { stroke-dashoffset: 24; }
.sted-motion .sted-page--assessment .sted-checklist-section.is-in .sted-check-tick { animation: sted-tick 520ms ease-out forwards; }
.sted-motion .sted-page--assessment .sted-checklist-section.is-in li:nth-child(1) .sted-check-tick { animation-delay: 500ms; }
.sted-motion .sted-page--assessment .sted-checklist-section.is-in li:nth-child(2) .sted-check-tick { animation-delay: 900ms; }
.sted-motion .sted-page--assessment .sted-checklist-section.is-in li:nth-child(3) .sted-check-tick { animation-delay: 1300ms; }
.sted-motion .sted-page--assessment .sted-checklist-section.is-in li:nth-child(4) .sted-check-tick { animation-delay: 1700ms; }

/* The page veil: a sheet of paper above the page, so words are covered,
   never dimmed. Created by the script only under `.sted-motion`. */
.sted-veil { position: fixed; inset: 0; z-index: 9999; background: var(--s-paper); pointer-events: none; opacity: 0; }
@keyframes sted-veil-out { from { opacity: 1; } to { opacity: 0; } }
.sted-motion .sted-veil { transition: opacity 240ms var(--s-ease); }
.sted-motion .sted-veil.is-arriving { animation: sted-veil-out 360ms var(--s-ease) both; }
.sted-motion .sted-veil.is-leaving { opacity: 1; }

/* Reduced motion and print: an off switch, not a dimmer. Every from-state
   resolves to its finished value. */
@media (prefers-reduced-motion: reduce), print {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    animation-delay: 0ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .sted-motion .sted-art .sted-a-trace { stroke-dashoffset: 0 !important; }
  .sted-motion .sted-art .sted-a-flag,
  .sted-motion .sted-art .sted-a-tick,
  .sted-motion .sted-art .sted-a-packet { opacity: 1 !important; }
  .sted-motion .sted-check-tick { stroke-dashoffset: 0 !important; }
  .sted-record-row, .sted-record-row .sted-state, .sted-record-field,
  .sted-record-field::before, .sted-record-field::after, .sted-more::after { transition: none !important; animation: none !important; }
  .sted-pass, .sted-veil { display: none !important; }
}
@media print {
  .sted-header, .sted-footer, .sted-cta, .sted-crumbs { display: none !important; }
  .sted-record { box-shadow: none; }
}