/* Shared enhancements: nav, mobile menu, mobile cards, media, transitions */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.18s}

/* Desktop nav: parent is a link, caret toggles */
.nav-group{display:flex;align-items:center;gap:2px}
.nav-group>.nav-parent{font:inherit;color:inherit;text-decoration:none}
.nav-group .nav-btn.nav-caret{padding:6px 6px!important;min-width:0;line-height:1}
@media (hover:hover) and (min-width:981px){
  .nav-group:hover .dropdown,.nav-group:focus-within .dropdown{display:block}
  .nav-group .dropdown::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
}

/* Mobile menu grouped */
.mobile-panel .m-group{border-top:1px solid var(--line)}
.mobile-panel .m-group:first-child{border-top:0}
.mobile-panel details>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;min-height:48px;cursor:pointer}
.mobile-panel details>summary::-webkit-details-marker{display:none}
.mobile-panel details>summary a{font-weight:700!important;flex:1;padding:12px 0!important}
.mobile-panel details>summary .m-tog{width:44px;height:44px;display:grid;place-items:center;font-size:22px;color:var(--blue,#1f3a5f)}
.mobile-panel details[open]>summary .m-tog{transform:rotate(45deg)}
.mobile-panel .m-sub{display:flex;flex-direction:column;padding:0 0 10px 14px;border-left:2px solid var(--line);margin:0 0 8px 4px}
.mobile-panel .m-sub a{font-size:16px!important;font-weight:500!important;min-height:42px;display:flex;align-items:center;opacity:.85}
.mobile-panel .m-top{display:flex;align-items:center;min-height:48px;font-weight:700!important}
.mobile-panel a[aria-current="page"]{color:var(--blue,#1f3a5f)!important;opacity:1}

/* Logos and images never stretch */
.logo-shell img,footer img,.partner-logo img{height:auto!important;max-width:100%;object-fit:contain}
img{max-width:100%}
figure img,.photo-tiles img,.photo-band img{object-fit:cover}
.photo-tiles img,.photo-band img{height:auto;aspect-ratio:3/2}

/* Hero video */
.hero-media-frame{isolation:isolate}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease;z-index:1}
.hero-video.ready{opacity:1}
.hero-media-frame .hero-media-caption{z-index:2}
.hero-still{object-position:50% 35%!important}

/* Tablet: tight 3/4-up rows go to 2 columns */
@media (min-width:641px) and (max-width:980px){
  body:not(#_) .matrix.matrix:has(>.matrix-card){grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* Phone: every card group is a single readable column */
@media (max-width:640px){
  body:not(#_) .matrix.matrix:has(>.matrix-card),body:not(#_) .matrix,.grid-3,.grid-4,.cards,.card-grid,.three-up,.four-up,.phases,.bands,.vx-row,[class*="grid-cols"]{grid-template-columns:1fr!important;display:grid!important}
  .matrix{gap:12px!important}
  .matrix-card,.card{padding:20px 18px!important;min-height:0!important;height:auto!important}
  .matrix-card h3,.card h3{font-size:22px!important;line-height:1.2!important;word-break:normal}
  .matrix-card p,.matrix-card li,.card p{font-size:16px!important;line-height:1.55!important}
  .matrix-card .vx-block{font-size:12px!important;letter-spacing:.14em}
  /* label-only cards -> compact tick list */
  body:not(#_) .matrix.vx-labels.vx-labels:has(>.matrix-card){grid-template-columns:1fr 1fr!important;gap:8px!important}
  .matrix.vx-labels .matrix-card{padding:12px 12px 12px 30px!important;position:relative}
  .matrix.vx-labels .matrix-card::before{content:"✓";position:absolute;left:11px;top:11px;color:var(--gold,#b8913a);font-weight:700}
  .matrix.vx-labels .matrix-card p{font-size:14px!important;margin:0}
  .photo-tiles{grid-template-columns:1fr!important}
  .section{padding-top:48px!important;padding-bottom:48px!important}
  h2{word-break:normal;overflow-wrap:break-word}
}
@media (max-width:380px){body:not(#_) .matrix.vx-labels.vx-labels:has(>.matrix-card){grid-template-columns:1fr!important}}

/* Readable box/card titles: clean sans instead of decorative serif */
body:not(#_) main :is(.matrix-card h3,.matrix-card h4,.card h3,.feature-card h3,.compare h3,.service-row h3,.offer h3,.phase-row h4,.time-step h4,.def-row b,.def-row dt,dl dt,[class*="card"] h3,[class*="card"] h4){
  font-family:var(--sans)!important;font-weight:650!important;letter-spacing:-.01em!important;line-height:1.3!important;font-style:normal!important}
body:not(#_) main :is(.matrix-card h3,.card h3,.feature-card h3,.compare h3,.service-row h3,.offer h3,.phase-row h4,.time-step h4,[class*="card"] h3){font-size:clamp(18px,1.6vw,22px)!important}
body:not(#_) main :is(.matrix-card h4,[class*="card"] h4){font-size:clamp(16px,1.3vw,18px)!important}
/* Box content lines (.vx-block): default = normal readable body text.
   RULE: only a label directly followed by a box title becomes an eyebrow. See docs/SITE-GUIDE.md */
body:not(#_) main .matrix-card>.vx-block{font-family:var(--sans)!important;font-weight:400!important;font-size:16px!important;line-height:1.6!important;letter-spacing:0!important;text-transform:none!important;font-style:normal!important;color:var(--ink-2,#4a4f57)!important;margin:0 0 10px!important;display:block}
body:not(#_) main .matrix-card>.vx-block :is(p,span,em,strong,b){display:inline!important;font:inherit!important;letter-spacing:inherit!important;text-transform:inherit!important;color:inherit!important;margin:0!important}
@media (min-width:981px){body:not(#_) main .matrix-card>.vx-block{font-size:17px!important}}
/* Reference cards (no heading inside): title / meta / body */
body:not(#_) main .matrix-card:not(:has(h3,h4))>.vx-block:first-child{font-weight:600!important;font-size:18px!important;line-height:1.4!important;color:var(--ink,#101418)!important}
body:not(#_) main .matrix-card:not(:has(h3,h4))>.vx-block:nth-child(2){font-family:var(--mono)!important;font-size:13px!important;letter-spacing:.02em!important;color:var(--muted,#6b7079)!important}
/* Eyebrow: label immediately above a box title */
body:not(#_) main .matrix-card>.vx-block:first-child:has(+h3,+h4){font-family:var(--mono)!important;font-weight:600!important;font-size:12px!important;line-height:1.4!important;letter-spacing:.14em!important;text-transform:uppercase!important;color:color-mix(in oklab,var(--gold-deep,#D89013) 72%,#000)!important}
@media (min-width:981px){body:not(#_) main .matrix-card>.vx-block:first-child:has(+h3,+h4){font-size:13px!important}}
body:not(#_) main :is(.def-row b,.def-row dt,dl dt){font-size:clamp(17px,1.4vw,20px)!important}

/* ===== Client-file layout patterns (see docs/SITE-GUIDE.md layout map) ===== */
/* Rows: label left, text right, thin rules */
body:not(#_) main .def-list.vx-rows{border-top:1px solid var(--line,rgba(0,0,0,.12));max-width:none}
body:not(#_) main .vx-rows .def-row{display:grid!important;grid-template-columns:minmax(160px,260px) minmax(0,1fr)!important;gap:8px 36px!important;padding:20px 0!important;border-bottom:1px solid var(--line,rgba(0,0,0,.12))}
body:not(#_) main .vx-rows .def-k{font-family:var(--sans)!important;font-weight:650!important;font-size:17px!important;line-height:1.4!important;color:var(--ink,#101418)!important}
body:not(#_) main .vx-rows .def-v{font-family:var(--sans)!important;font-size:16px!important;line-height:1.6!important;color:var(--muted,#5b606a)!important}
body:not(#_) main .vx-rows .def-v :is(p,em,span){display:inline;font:inherit}
body:not(#_) main .vx-rows .def-v em{font-style:italic}
/* Sources list */
body:not(#_) main .src-list{border-top:1px solid var(--line,rgba(0,0,0,.12))}
body:not(#_) main .src-row{padding:20px 0;border-bottom:1px solid var(--line,rgba(0,0,0,.12))}
body:not(#_) main .src-row .st{font:650 17px/1.45 var(--sans);color:var(--ink,#101418)}
body:not(#_) main .src-row .sm{font:400 13px/1.5 var(--mono);color:var(--muted,#6b7079);margin-top:4px}
body:not(#_) main .src-row .su{font:400 16px/1.6 var(--sans);color:var(--muted,#5b606a);margin-top:8px}
body:not(#_) main .src-row .su :is(p,em,span){display:inline;font:inherit}
body:not(#_) main .src-row .su em{font-style:italic}
/* Method output bands: one row of three */
body:not(#_) main .def-list.vx-bands{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border:0;max-width:none}
body:not(#_) main .vx-bands .def-row{display:block!important;border:1px solid var(--line,rgba(0,0,0,.12))!important;background:var(--surface,#fff);padding:16px 18px!important}
body:not(#_) main .vx-bands .def-k{font:600 12px/1.4 var(--mono)!important;letter-spacing:.12em;text-transform:uppercase;margin-bottom:6px}
body:not(#_) main .vx-bands .def-row:nth-child(1) .def-k{color:#2C6B3A}
body:not(#_) main .vx-bands .def-row:nth-child(2) .def-k{color:color-mix(in oklab,var(--gold-deep,#D89013) 72%,#000)}
body:not(#_) main .vx-bands .def-row:nth-child(3) .def-k{color:#9A3426}
body:not(#_) main .vx-bands .def-v{font:400 16px/1.55 var(--sans)!important;color:var(--muted,#5b606a)}
/* Method limits: boxes side by side */
body:not(#_) main .def-list.vx-limits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line,rgba(0,0,0,.12));border:1px solid var(--line,rgba(0,0,0,.12));max-width:none}
body:not(#_) main .vx-limits .def-row{display:block!important;border:0!important;background:var(--surface,#fff);padding:22px!important}
body:not(#_) main .vx-limits .def-k{font:650 18px/1.35 var(--sans)!important;color:var(--ink,#101418);margin-bottom:8px}
body:not(#_) main .vx-limits .def-v{font:400 16px/1.6 var(--sans)!important;color:var(--muted,#5b606a)}
/* Insights evidence: quote on top, two panels below */
body:not(#_) main .matrix.vx-evd{grid-template-columns:1fr!important;gap:0!important}
body:not(#_) main .vx-evd>.matrix-card:nth-child(2){display:grid!important;grid-template-columns:1fr 1fr;gap:28px;border-top:0}
body:not(#_) main .vx-evd>.matrix-card:nth-child(2)>.vx-block{margin:0!important}
body:not(#_) main .vx-evd .vx-block>.vx-block:first-child{font:600 12px/1.4 var(--mono)!important;letter-spacing:.14em!important;text-transform:uppercase!important;color:color-mix(in oklab,var(--gold-deep,#D89013) 72%,#000)!important;margin-bottom:8px!important}
body:not(#_) main .vx-evd .vx-block>.vx-block:first-child+p{display:block!important}
/* Insights index: two per row */
@media (min-width:861px){body:not(#_) main .matrix.vx-c2.vx-c2{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
/* Four-card rows never place content side by side */
body:not(#_) main .matrix:has(>.matrix-card:nth-child(4):last-child)>.matrix-card{flex-direction:column!important;align-items:flex-start!important}
/* Responsive per client file */
@media (max-width:860px){
  body:not(#_) main .def-list.vx-bands,body:not(#_) main .def-list.vx-limits{grid-template-columns:1fr}
  body:not(#_) main .vx-evd>.matrix-card:nth-child(2){grid-template-columns:1fr}
}
@media (max-width:620px){body:not(#_) main .vx-rows .def-row{grid-template-columns:1fr!important;gap:6px!important}}
body:not(#_) main .vx-evd .vx-block>p{font:400 16px/1.6 var(--sans)!important;letter-spacing:0!important;text-transform:none!important;color:var(--muted,#5b606a)!important;margin:0!important}
body:not(#_) main .vx-evd blockquote{margin:12px 0!important;padding-left:16px!important;border-left:2px solid var(--gold,#FEB640)}
/* Client corrections Sep 29 */
body:not(#_) main .vx-evd .vx-block>.vx-block:first-child{font-size:14px!important;color:var(--ink,#101418)!important;font-weight:700!important}
@media (min-width:981px){body:not(#_) main .vx-evd .vx-block>.vx-block:first-child{font-size:15px!important}}
body:not(#_) main .matrix-no{font-family:var(--sans)!important;font-weight:700!important;font-size:20px!important;line-height:1!important;letter-spacing:.02em!important;font-variant-numeric:lining-nums tabular-nums;color:color-mix(in oklab,var(--gold-deep,#D89013) 62%,#000)!important;margin:0 0 14px!important;display:block;text-transform:none!important}
@media (min-width:641px){body:not(#_) main .matrix-no{font-size:22px!important}}
@media (min-width:981px){body:not(#_) main .matrix-no{font-size:26px!important}}
/* Word labels (e.g. "Paper") stay small */
body:not(#_) main .matrix-no.vx-word{font:600 13px/1.4 var(--mono)!important;letter-spacing:.12em!important;text-transform:uppercase!important}
.vx-about-copy{max-width:820px}
.vx-about-copy p{font-size:18px;line-height:1.7;color:var(--ink-2,#3a3f47);margin:0 0 18px}
.person-body>p{margin:0 0 14px}
@media (min-width:981px) and (max-width:1180px){.nav-links{gap:14px!important}}

sup.vx-sm{font-size:.55em;vertical-align:super;line-height:0;letter-spacing:.02em;margin-left:1px}

/* Footer bottom lines: one even size (client ref, Oct 2) */
.footer-bottom,.footer-bottom span,.footer-bottom a{font-size:12px!important;line-height:1.6!important;color:#817B73!important;padding:0!important;font-family:Inter,system-ui,sans-serif}
.footer-bottom a{display:inline!important;text-decoration:none}
.footer-bottom a:hover{text-decoration:underline}
@media (max-width:760px){.footer-bottom,.footer-bottom span,.footer-bottom a{font-size:12px!important}}
