/* v9: supplied sage photography, white space and a compact masthead.
   Loaded after light-edition.css so v8 remains available for comparison. */
:root {
  --nav-h:60px;
  --bar-h:28px;
  --paper-warm:#f7f9f4;
  --ink:#25312a;
  --ink-80:#465248;
  --muted:#606b61;
  --accent:#487357;
  --accent-text:#365c42;
  --accent-soft:#eff5ea;
  --line:#e3e9df;
  --font-mono:var(--font-sans);
}
.product-light .scenes {--mono:var(--font-sans)}
.bar {height:auto;min-height:var(--bar-h);font-size:11px}
.nav,.nav.solid {height:var(--nav-h)}
.nav .wrap,.nav.solid .wrap {padding-block:8px;gap:24px}
.nav .brand {gap:8px}
.nav .brand span {font-size:25px}
.nav .brand svg,.nav.solid .brand svg {width:20px;height:20px}
.nav .navlinks {gap:28px}
.nav .navlinks a {font-size:13px;padding-block:10px}
.nav .btn,.nav.solid .btn-light {min-height:38px;padding:10px 17px;font-size:13px}

/* Preserve the supplied sage tones; white light keeps text areas quiet. */
.sage-edition .hero {min-height:0}
.sage-edition .hero-inner {padding:clamp(88px,9vw,132px) 0 112px}
.hero-media {inset:0}
.hero-media img {filter:brightness(1.16) contrast(.9);opacity:.62;object-position:36% 42%}
.hero::after {
  background:linear-gradient(180deg,rgba(255,255,255,.64) 0%,rgba(255,255,255,.72) 45%,rgba(255,255,255,.8) 68%,#fff 100%);
}
.sage-edition .hero-logos {background:#fff;padding:12px 0 40px}
.sage-edition .hero-logos-label {padding-bottom:24px}
.sage-edition .story {padding-top:40px}
.hero .sub,.hero-eyebrow {color:#4f6053}
.hero-cta .btn-outline-light {background:#ffffffc9;border-color:#cbd6c8}
.scene,.scene[data-kind] .scene-body {background:#f6f8f3}
.vendor,.flow-outputs span,.model-orb,.recognised-amount,.res-card {background:#f5f8f1}
.step-tab[aria-pressed="true"],.step-tab:hover {background:#e7eee1}
.success-seal {background:#edf4e7;color:var(--accent-text)}
.closing-media img {filter:brightness(1.2) contrast(.88);opacity:.48;object-position:50% 44%}
.closing::after {background:linear-gradient(180deg,#fff,rgba(255,255,255,.65) 48%,#fff)}

/* Photographs live beside the narrative, with no extra rules or frames. */
.editorial-photo {margin:0;background:#f2f6ec;overflow:hidden;border-radius:6px;position:relative}
.editorial-photo::after {content:"";position:absolute;inset:0;background:rgba(255,255,255,.16);pointer-events:none}
.editorial-photo img {width:100%;height:100%;object-fit:cover;filter:brightness(1.12) contrast(.9)}
.street-photo {aspect-ratio:16/7;width:100%;margin-top:40px}
.street-photo img {object-position:50% 65%}
.security-intro {display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:clamp(48px,7vw,96px)}
.lobby-photo {aspect-ratio:3/2}
.security-intro+.sgrid {margin-top:80px}

@media(max-width:959px) {
  .security-intro {gap:40px}
}
@media(max-width:700px) {
  :root {--nav-h:86px}
  .bar {font-size:10px;padding:6px 36px 6px 16px;line-height:1.45}
  .nav .wrap,.nav.solid .wrap {padding:6px var(--gutter);gap:2px 12px;grid-template-rows:38px 30px}
  .nav .brand span {font-size:23px}
  .nav .brand svg,.nav.solid .brand svg {width:18px;height:18px}
  .nav .btn,.nav.solid .btn-light {font-size:12px;min-height:36px;padding:9px 13px}
  .nav .navlinks {gap:26px}
  .nav .navlinks a {font-size:12px;padding-block:6px}
  .hero-media img {object-position:30% 40%}
  .sage-edition .hero-inner {padding:72px 0 88px}
  .sage-edition .hero-logos {padding:8px 0 28px}
  .sage-edition .story {padding-top:24px}
  .security-intro {grid-template-columns:minmax(0,1fr);gap:40px}
  .security-intro+.sgrid {margin-top:48px}
  .closing-media img {object-position:58% 50%}
  .product-light {--nav-h:60px}
  .product-light .nav .wrap {display:flex;padding-block:8px}
}
@media(max-width:360px) {
  .nav .navlinks {gap:18px}
  .nav .navlinks a {font-size:11px}
  .nav .brand span {font-size:22px}
}

/* Four fixed type sizes, with one consistent treatment per content role.
   Inheritance removes legacy local sizes, including inline brand pills. */
.sage-edition {
  --bar-real:0px;
  --bar-h:0px;
  --type-small:12px;
  --type-body:16px;
  --type-heading:24px;
  --type-display:48px;
  font-size:var(--type-body)!important;
}
.sage-edition :where(*) {font-size:inherit!important}
.sage-edition :where(
  p,.sub,.res-out,.outcome-tail,.story-outcome>p,.scard p,
  .finding-email>p,.allocation-summary>p,.flow-outputs span,footer li a
) {
  font-size:var(--type-body)!important;
  font-family:var(--font-sans);
  font-weight:400;
  line-height:1.65;
}
.sage-edition :where(
  .display,.h2,.cap-h,.story-outcome h2,.recognised-card>strong,
  .story-orb>strong,.summary-pool,.profit-number,.loss-number,
  .breach-story>strong,.res-fig
) {font-size:var(--type-display)!important}
.sage-edition :where(
  h3,h4,.brand span,.model-orb>span,.scene-caption strong,.res-what,
  .date-pair strong,.mini-doc-total strong,.recognised-amount,
  .allocation-origin,.allocation-halves strong,.summary-split strong,
  .tied-numbers strong,.support-equation strong,.summary-math strong
) {font-size:var(--type-heading)!important}
.sage-edition :where(
  small,.label,.bar,.hero-eyebrow,.hero-logos-label,.scene-top,.caption-num,
  .step-tab,.transport button,.art,.mini-label,.mini-doc-head,.mini-doc-total,
  .recognised-context,.recognised-amount span,.allocation-origin span,
  .allocation-halves span,.tied-numbers span,.summary-split span,
  .summary-math span,.watch-schedule,.loss-label,.verified-proof,
  .finding-from,.watch-context,.finding-driver,.finding-details,.threshold-mark,
  .reversal-chart>div>span,.zero-axis,.single-profit-chart>span,.res-tag,
  .res-who,.certs,.fbase,footer h4,.navlinks,.btn
) {font-size:var(--type-small)!important}
.sage-edition :where(.display,.h2,.cap-h,.story-outcome h2) {
  font-family:var(--font-display);
  font-weight:400;
  line-height:1.2;
  letter-spacing:-.025em;
}
.sage-edition :where(h3,h4,.scene-caption strong,.res-what) {
  font-family:var(--font-display);
  font-weight:400;
  line-height:1.3;
  letter-spacing:-.015em;
}
.sage-edition :where(
  .btn,.navlinks,.step-tab,.transport button,.scene-top,.mini-label,
  .mini-doc-head,.mini-doc-total,.recognised-context,.watch-context,.finding-from,
  .finding-driver,.finding-details,.res-tag,.res-who,.certs,.fbase,footer h4
) {font-family:var(--font-sans);line-height:1.5;letter-spacing:0}
.sage-edition :where(
  .res-fig,.summary-pool,.profit-number,.loss-number,.breach-story>strong,
  .story-orb>strong,.recognised-amount,.mini-doc-total strong,.allocation-origin,
  .allocation-halves strong,.summary-split strong,.tied-numbers strong,
  .support-equation strong,.summary-math strong
) {
  font-family:var(--font-sans);
  font-weight:600;
  font-variant-numeric:tabular-nums;
  line-height:1.15;
  letter-spacing:-.025em;
}
.sage-edition .hero .display {max-width:23ch;line-height:1.2}
.sage-edition .capsec .section-head .cap-h {line-height:1.2}
.sage-edition .nav .navlinks {gap:24px}
.sage-edition .nav .navlinks a {font-weight:600}
.sage-edition .recognised-amount {flex-wrap:wrap;gap:12px}
.sage-edition .finding-driver {flex-wrap:wrap}