/* =====================================================================================================================
   STRATEGIC LABS — V002-R1 VISUAL MASTERING LAYER (loaded after r1-responsive.css)
   Premium mobile / tablet compositions + header & affiliation mastering. Desktop (≥ 1200px) is untouched except the
   header affiliation zone (Vision 2030) which is a Professor-authorised header mastering delta.
   Ranges: mobile ≤599 · tablet portrait 600–899 · compact landscape 900–1199 · desktop ≥1200.
   ===================================================================================================================== */

/* ------------------------------------------------------------------ A. SHARED SYSTEM ------------------------------- */
:root {
  --r1-radius: 20px; --r1-radius-sm: 14px;
  --r1-surface: var(--paper-2, #f4f6f2);
  --r1-line: var(--line, rgba(26,75,68,.12));
  --r1-shadow: 0 18px 44px rgba(7,22,20,.10);
  --r1-ease: cubic-bezier(.2,.7,.2,1);
}
@media (max-width: 1199px) {
  .btn, .hm-hero__btn { min-block-size: 48px; }
  .eyebrow { letter-spacing: .12em; }
}

/* ------------------------------------------------------------------ B. HEADER / NAVBAR ----------------------------- */
/* Affiliation zone (Vision 2030): composed beside the brand — thin rule, quiet micro-surface, baseline-aligned, gentle
   reveal. Renders only when the official asset exists (see PublicShell). Hierarchy: brand › navigation › affiliation. */
.brand-affiliation { display: inline-flex; align-items: center; gap: .9rem; margin-inline-start: .35rem; padding: .3rem .55rem .3rem .1rem; border-radius: 12px; animation: r1-affiliation-in .7s var(--r1-ease) .15s both; }
.brand-affiliation__rule { inline-size: 1px; block-size: 30px; background: linear-gradient(to bottom, transparent, rgba(26,75,68,.32), transparent); }
.brand-affiliation img { block-size: 34px; inline-size: auto; max-inline-size: 132px; object-fit: contain; opacity: .96; transition: opacity .25s ease, transform .35s var(--r1-ease); }
.brand-affiliation__night { display: none; }
body[data-header-tone="dark"] .brand-affiliation__paper { display: none; }
body[data-header-tone="dark"] .brand-affiliation__night { display: block; }
body[data-header-tone="dark"] .brand-affiliation__rule { background: linear-gradient(to bottom, transparent, rgba(174,226,209,.4), transparent); }
.brand-affiliation:hover img, .brand:focus-visible + .brand-affiliation img { opacity: 1; transform: translateY(-1px); }
@keyframes r1-affiliation-in { from { opacity: 0; transform: translateX(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .brand-affiliation { animation: none; } .brand-affiliation img { transition: none; } }
/* desktop header grid gains one auto column for the zone (only when the zone exists) */
.site-header__inner:has(> .brand-affiliation) { grid-template-columns: auto auto 1fr auto; gap: var(--s5); }
@media (min-width: 1200px) and (max-width: 1379px) { .brand-affiliation img { block-size: 30px; max-inline-size: 110px; } }
/* mobile-menu affiliation row (phones): a calm closing row inside the menu */
.mnav__affiliation { display: none; }
@media (max-width: 599px) {
  .brand-affiliation { display: none; }
  .mnav__affiliation { display: flex; align-items: center; justify-content: center; margin-top: var(--s5); padding-top: var(--s5); border-block-start: 1px solid var(--r1-line); }
  .mnav__affiliation img { block-size: 40px; inline-size: auto; max-inline-size: 150px; object-fit: contain; }
}

/* Tablet header mode (600–1099): logo · affiliation · CTA · menu — never a squeezed desktop nav */
@media (min-width: 600px) and (max-width: 1099px) {
  .nav, .mega { display: none !important; }
  .nav-toggle { display: grid !important; }
  .header-cta { display: inline-flex !important; min-block-size: 42px; padding-inline: 1.1rem; }
  .site-header__inner { grid-template-columns: auto 1fr auto; block-size: 72px; gap: var(--s4); }
  .site-header__inner:has(> .brand-affiliation) { grid-template-columns: auto auto 1fr auto; }
  .brand img, body[data-header-tone="dark"] .brand__night { inline-size: clamp(140px, 18vw, 168px); }
  .brand-affiliation img { block-size: 30px; max-inline-size: 116px; }
  .header-actions { gap: var(--s3); }
}
@media (min-width: 600px) and (max-width: 767px) { .header-cta { display: none !important; } }
/* Tablet menu = premium side sheet (not a stretched phone menu) */
@media (min-width: 600px) and (max-width: 1099px) {
  .mnav { --content: 100%; --gutter-side: var(--s6); inset-inline-end: 0; inset-inline-start: auto; inline-size: min(440px, 88vw); max-inline-size: 100vw; overflow-x: hidden; isolation: isolate; box-shadow: -24px 0 60px rgba(7,22,20,.18); border-inline-start: 1px solid var(--r1-line); }
  body[data-nav-open="true"]::after { content: ""; position: fixed; inset: 0; z-index: 150; background: rgba(7,22,20,.5); animation: r1-dim .3s ease both; }
  @keyframes r1-dim { from { opacity: 0 } to { opacity: 1 } }
  .mnav .wrap, .mnav .container { width: 100%; }
  .mnav__top { padding: 1.1rem var(--s6); }
  .mnav__list { padding: .4rem var(--s6) 0; }
  .mnav__list > li > a, .mnav__level-row > a { font-size: 1.1rem; min-height: 54px; }
  .mnav__utility { padding: var(--s5) var(--s6) var(--s6); }
}
/* Phone menu polish */
@media (max-width: 599px) {
  .mnav__top { border-block-end: 1px solid var(--r1-line); }
  .mnav__top p { font-size: 1rem; letter-spacing: .02em; }
  .mnav__list > li { border-bottom: 1px solid var(--r1-line); }
  .mnav__list > li > a, .mnav__level-row > a { font-size: 1.14rem; letter-spacing: -.005em; }
  .mnav__family .mnav__expand { font-size: 1rem; }
  .mnav__sub a { font-size: .98rem; color: var(--ink-soft); }
  .mnav__utility .btn { min-block-size: 54px; border-radius: 999px; font-size: 1.02rem; }
  .mnav__phone { font-size: 1.02rem; text-align: center; }
}

/* Sections C (HERO) and D (STATS/KPI) previously here are superseded — the
   Home opening (hero / proof / practices-strip) <=1199 composition now lives
   entirely in v5-opening.css, a full rebuild rather than a patch on the old
   nested-in-hero structure. Section E below is the LATER, separate full
   practices index (block 4, `.hm-index`) further down Home — out of this
   wave's scope (Owner directive: audit only, do not redesign approved
   business content) — untouched. */

/* ------------------------------------------------------------------ E. PRACTICES = DISCOVERY PANELS --------------- */
/* phones + tablet portrait: editorial panels (surface, whitespace, hierarchy) instead of utility rows */
@media (max-width: 899px) {
  .hm-index { border-block: 0 !important; gap: .9rem; }
  .hm-index__col { border: 0 !important; }
  .hm-index__item { position: relative; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; grid-template-rows: auto auto auto auto !important; grid-template-areas: "n ico" "title title" "desc desc" "link link"; column-gap: 1rem !important; row-gap: .4rem !important; padding: 1.35rem 1.25rem 1.2rem !important; background: var(--r1-surface); border: 1px solid var(--r1-line); border-radius: var(--r1-radius); box-shadow: 0 1px 0 rgba(255,255,255,.6) inset; transition: border-color .25s ease, box-shadow .3s var(--r1-ease), transform .3s var(--r1-ease); }
  .hm-index__item:hover, .hm-index__item:focus-visible { background: var(--r1-surface); border-color: rgba(26,75,68,.28); box-shadow: var(--r1-shadow); }
  .hm-index__n { grid-area: n; grid-column: auto !important; justify-self: start; font-size: .78rem; letter-spacing: .2em; color: var(--brand-mid); }
  .hm-index__ico { grid-area: ico; grid-row: auto !important; grid-column: auto !important; justify-self: end; align-self: start; inline-size: 48px !important; block-size: 48px !important; margin: 0 0 .35rem !important; background: var(--mint-wash, rgba(68,188,167,.14)); border-color: transparent; color: var(--brand-deep); }
  .hm-index__ico .hm-ico { inline-size: 22px; block-size: 22px; }
  .hm-index__item h3 { grid-area: title; grid-column: auto !important; font-size: 1.16rem !important; line-height: 1.4; min-block-size: 0 !important; color: var(--ink); }
  .hm-index__item p { grid-area: desc; grid-column: auto !important; font-size: .95rem !important; line-height: 1.75; color: var(--ink-soft); margin-top: .2rem; }
  .hm-index__item .hm-link { grid-area: link; grid-column: auto !important; margin-top: .55rem !important; font-weight: 700; }
}
@media (min-width: 600px) and (max-width: 899px) {
  .hm-index { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 1rem; }
  .hm-index > li:last-child { grid-column: 1 / -1; }
  .hm-index__item { padding: 1.5rem 1.4rem 1.35rem !important; }
}
/* the "detailed material" pill under the index breathes on phones */
@media (max-width: 599px) { .hm-practices .hm-more, .hm-practices .btn--ghost { margin-top: 1.25rem; } }

/* ------------------------------------------------------------------ F. CONSOLE / EXPLORER (phones) ---------------- */
@media (max-width: 599px) {
  .hm-console { border-radius: 22px; }
  .hm-console__rail { padding: .7rem !important; gap: .4rem !important; }
  .hm-console__tab { border-radius: 12px !important; min-block-size: 52px !important; padding: .6rem .9rem !important; }
  .hm-console__tab.is-active { background: rgba(68,188,167,.16) !important; box-shadow: inset 0 0 0 1px rgba(68,188,167,.45) !important; }
  .hm-console__tab-name { font-size: .95rem !important; font-weight: 700; }
  .hm--page .practice-explorer__tab { border-radius: 12px; padding: .8rem .9rem !important; }
  .hm--page .practice-explorer__tab.is-active { background: var(--r1-surface) !important; box-shadow: inset 0 0 0 1px rgba(26,75,68,.22) !important; padding-inline-start: .9rem !important; }
}

/* ------------------------------------------------------------------ G. FOOTER = BRAND CLOSURE ----------------------- */
@media (max-width: 599px) {
  .site-footer { padding-top: clamp(2.75rem, 2rem + 3vw, 4rem); }
  .site-footer__top { padding-block: 0 var(--s5) !important; gap: var(--s5) !important; }
  .site-footer__brand img { inline-size: 168px !important; max-block-size: 40px; }
  .site-footer__brand > p { margin-block: var(--s4) 0 !important; font-size: .98rem !important; line-height: 1.8 !important; max-width: none; color: rgba(214,229,224,.82); }
  .site-footer__contact { margin-top: var(--s4) !important; padding-top: var(--s4) !important; gap: .15rem !important; border-block-start: 1px solid rgba(174,226,209,.16); }
  .site-footer__contact li { min-height: 42px !important; font-size: .98rem; }
  .site-footer__cols { margin-top: .25rem; border-block-start: 1px solid rgba(174,226,209,.16); }
  .foot-group { border-block-start: 0 !important; border-block-end: 1px solid rgba(174,226,209,.12); }
  .foot-group:last-child { border-block-end: 0; }
  .foot-group__toggle { font-size: .98rem !important; letter-spacing: .01em; color: var(--on-dark) !important; }
  .foot-group__cue { inline-size: 26px !important; block-size: 26px !important; background: rgba(174,226,209,.1) !important; }
  .foot-group .foot-list { padding-block: 0 1rem !important; }
  .foot-group .foot-list a { color: rgba(214,229,224,.86); font-size: .96rem; }
  .foot-bottom { align-items: center !important; text-align: center; font-size: .82rem; gap: .25rem !important; padding-block: var(--s4) calc(var(--s5) + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (min-width: 600px) and (max-width: 899px) {
  .site-footer__top { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) !important; align-items: start; gap: var(--s6) !important; }
  .site-footer__cols { grid-column: 1 / -1; }
}

/* ------------------------------------------------------------------ H. ARTICLE (phones) ---------------------------- */
@media (max-width: 599px) {
  .ar-hero__title { font-size: clamp(1.7rem, 1.25rem + 2.6vw, 2.1rem) !important; line-height: 1.25; }
  .ar-hero__deck { font-size: 1.02rem; line-height: 1.75; }
  .ar-hero__meta { font-size: .88rem; }
  .article-body .reading-column, .ar-body .reading-column { padding-inline: 0; }
  .article-body p, .ar-body p { font-size: 1.04rem; line-height: 1.9; }
  .article-body h2, .ar-body h2 { font-size: 1.4rem; margin-top: 2rem; }
  .px-rows .px-row__link { padding-block: .9rem; }
}

/* ------------------------------------------------------------------ I. SECTION HEADS / RHYTHM (phones) ------------ */
@media (max-width: 599px) {
  .hm-head { margin-bottom: 1.5rem; }
  .hm-head .eyebrow { margin-bottom: .6rem; }
  .hm-head h2, .hm-head .h2 { font-size: clamp(1.6rem, 1.25rem + 2.2vw, 1.95rem); line-height: 1.24; }
  .hm-head .lead, .hm-head p { font-size: 1rem; line-height: 1.75; }
  .section, .pm-section { padding-block: clamp(2.75rem, 2.2rem + 2.6vw, 3.6rem); }
  /* bands with inner-element spacing keep V002 padding 0 (see r1-responsive foundation) */
  .hm-fineprint, .hm-question, .hm-close, .px-close, .px-hero, .chapter, .article-body { padding-block: 0; }
  .hm-hero, .vmv6 { padding-block-end: 0; }
}

/* ------------------------------------------------------------------ J. CONTACT (phones) ---------------------------- */
@media (max-width: 599px) {
  .cj-step, .cj-panel { border-radius: var(--r1-radius); }
  .cj-progress li, .cj-steps li { min-inline-size: 36px; }
  .ct-hero .lead, .ct-hero p { font-size: 1rem; }
}