/* Liberty Partners — Commercial page */
  /* ============================================================
     HERO — split navy panel + full-bleed photograph
     ============================================================ */
  .chero { display: grid; grid-template-columns: minmax(400px, 36%) minmax(0, 1fr); background: var(--ink); min-height: min(90vh, 880px); }
  .chero__panel { display: flex; align-items: center; justify-content: center; background: var(--ink); color: var(--paper); padding: clamp(48px, 5.5vw, 104px) clamp(28px, 3.4vw, 72px); }
  .chero__panel-in { max-width: 44ch; }
  .chero .ey { font-family: var(--font-display); font-size: 12px; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; color: var(--sky); margin: 0 0 clamp(24px, 3vw, 34px); }
  .chero h1 {
    font-family: var(--font-body); font-weight: 300;
    font-size: clamp(38px, 4.1vw, 72px); line-height: 1.06; letter-spacing: -0.024em;
    margin: 0; color: var(--paper); text-wrap: balance;
  }
  .chero h1 em { font-style: italic; color: var(--sky); }
  .chero .sub { font-family: var(--font-body); font-weight: 300; font-size: clamp(17px, 1.25vw, 20px); line-height: 1.62; color: color-mix(in oklab, var(--paper) 80%, transparent); margin: clamp(30px, 3vw, 44px) 0 0; }
  .chero .sub em { color: var(--paper); font-style: italic; }
  .chero__cta { display: inline-flex; align-items: center; gap: 12px; margin-top: clamp(32px, 3.6vw, 46px); font-family: var(--font-display); font-size: 12px; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: var(--paper); background: color-mix(in oklab, var(--paper) 9%, transparent); border: 1px solid color-mix(in oklab, var(--paper) 26%, transparent); padding: 17px 26px; transition: background .25s var(--ease), border-color .25s var(--ease), color .25s var(--ease); }
  .chero__cta:hover { background: var(--sky); border-color: var(--sky); color: var(--ink); }
  .chero__cta .arrow { transition: transform .25s var(--ease); }
  .chero__cta:hover .arrow { transform: translateX(4px); }
  .chero__media { position: relative; overflow: hidden; background: var(--paper-3); }
  .chero__media img { width: 100%; height: 100%; object-fit: cover; display: block; }

  @media (max-width: 900px) {
    .chero { grid-template-columns: 1fr; min-height: 0; }
    .chero__media { order: -1; aspect-ratio: 16 / 10; }
    .chero__panel { padding: clamp(40px, 8vw, 68px) var(--gutter); }
    .chero__panel-in { max-width: 46ch; }
  }

  /* ============================================================
     INTRO — positioning
     ============================================================ */
  .com-intro { max-width: var(--max-w); margin: 0 auto; padding: var(--s-10) var(--gutter) var(--s-9); }
  .com-intro .grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
  .com-intro .lede { font-family: var(--font-body); font-size: clamp(25px, 2.6vw, 38px); line-height: 1.3; letter-spacing: -0.012em; color: var(--ink); margin: 0; font-weight: 300; text-wrap: pretty; }
  .com-intro .lede em { color: var(--accent); font-style: italic; }
  .com-intro .col p { font-family: var(--font-body); font-size: 19px; line-height: 1.62; color: var(--ink-soft); margin: 0 0 1.1em; }
  .com-intro .col p:last-child { margin-bottom: 0; }
  .com-intro .col p em { color: var(--ink); font-style: italic; }
  .stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--rule); margin-top: var(--s-8); }
  .stat { padding: 28px 28px 0 0; border-right: 1px solid var(--rule-soft); }
  .stat:last-child { border-right: 0; padding-right: 0; }
  .stat .v { font-family: var(--font-body); font-weight: 300; font-size: clamp(40px, 4vw, 58px); line-height: 1; letter-spacing: -0.02em; }
  .stat .v em { color: var(--accent); font-style: normal; }
  .stat .k { font-family: var(--font-display); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-soft); margin-top: 12px; }

  /* areas-of-construction strip (replaces redundant stat row) */
  .area-strip { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; border-top: 1px solid var(--rule); margin-top: 20px; }
  .area { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 14px; padding: 30px 14px 8px; border-right: 1px solid var(--rule-soft); }
  .area:last-child { border-right: 0; }
  .area svg { width: 40px; height: 40px; color: var(--accent); display: block; }
  .area .lbl { font-family: var(--font-display); font-size: 11px; font-weight: 500; letter-spacing: 0.13em; text-transform: uppercase; color: var(--ink-soft); line-height: 1.35; }
  @media (max-width: 900px) { .area-strip { grid-template-columns: repeat(3, 1fr); } .area:nth-child(3n) { border-right: 0; padding-right: 0; } .area:nth-child(n+4) { border-top: 1px solid var(--rule-soft); padding-top: 24px; } }
  @media (max-width: 540px) { .area-strip { grid-template-columns: repeat(2, 1fr); } .area:nth-child(3n) { border-right: 1px solid var(--rule-soft); padding-right: 22px; } .area:nth-child(2n) { border-right: 0; padding-right: 0; } .area:nth-child(n+3) { border-top: 1px solid var(--rule-soft); padding-top: 24px; } }

  /* ============================================================
     EDITORIAL BAND — full-bleed photograph + statement
     ============================================================ */
  .com-band { position: relative; height: clamp(420px, 60vh, 720px); overflow: hidden; background: var(--ink); }
  .com-band img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .com-band::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,43,69,.34) 0%, transparent 30%, transparent 52%, rgba(14,43,69,.86) 100%); }
  .com-band .band-cap { position: absolute; left: var(--gutter); right: var(--gutter); bottom: clamp(28px, 4vw, 52px); z-index: 2; max-width: var(--max-w); margin: 0 auto; color: var(--paper); }
  .com-band .band-cap .eyebrow { color: var(--sky); }
  .com-band .band-cap h3 { font-family: var(--font-body); font-weight: 300; font-size: clamp(28px, 3.4vw, 52px); line-height: 1.05; letter-spacing: -0.02em; margin: 14px 0 0; max-width: 22ch; text-wrap: balance; }
  .com-band .band-cap h3 em { color: var(--sky); font-style: italic; }

  /* ============================================================
     WORK SEQUENCE — gallery carousel
     ============================================================ */
  .work { padding: var(--s-10) 0; background: var(--paper); overflow: hidden; }
  .work .head { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--gutter) 44px; display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: end; }
  .work h2 { font-family: var(--font-body); font-weight: 300; font-size: clamp(40px, 5vw, 80px); line-height: 0.98; letter-spacing: -0.025em; margin: 16px 0 0; }
  .work h2 em { color: var(--accent); font-style: italic; }
  .work .head p { font-family: var(--font-body); font-size: 18px; line-height: 1.55; color: var(--ink-soft); margin: 14px 0 0; max-width: 52ch; }
  .ws-controls { display: flex; gap: 12px; }
  .ws-controls button { width: 56px; height: 56px; border-radius: 50%; border: 1px solid var(--rule); background: var(--paper); color: var(--ink); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease); }
  .ws-controls button:hover { background: var(--ink); color: var(--paper); border-color: var(--ink); }
  .ws-controls button:disabled { opacity: .3; cursor: default; }
  .ws-controls button:disabled:hover { background: var(--paper); color: var(--ink); border-color: var(--rule); }
  .ws-controls svg { width: 20px; height: 20px; }
  .ws-viewport { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--gutter); overflow: hidden; }
  .ws-track { display: flex; gap: 28px; transition: transform .55s var(--ease-out); will-change: transform; touch-action: pan-y; }
  .ws-slide { flex: 0 0 clamp(340px, 58%, 800px); cursor: grab; }
  .ws-track.dragging { transition: none; }
  .ws-track.dragging .ws-slide { cursor: grabbing; }
  .ws-slide .fr { position: relative; overflow: hidden; background: var(--paper-3); aspect-ratio: 4/3; }
  .ws-slide .fr img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.1s var(--ease-out); }
  .ws-slide:hover .fr img { transform: scale(1.05); }
  .ws-slide .fr::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(11,23,34,.62) 0%, transparent 52%); opacity: .8; transition: opacity .4s var(--ease); }
  .ws-slide:hover .fr::after { opacity: 1; }
  .ws-slide .stg { position: absolute; top: 16px; left: 16px; z-index: 2; font-family: var(--font-display); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--paper); background: color-mix(in oklab, var(--coastal) 80%, transparent); padding: 6px 11px; backdrop-filter: blur(4px); }
  .ws-meta { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 18px 2px 0; border-top: 1px solid var(--rule); margin-top: 18px; }
  .ws-meta .t { font-family: var(--font-body); font-size: 24px; line-height: 1.16; letter-spacing: -0.01em; color: var(--ink); }
  .ws-meta .n { font-family: var(--font-mono); font-size: 12px; color: var(--accent); letter-spacing: 0.08em; flex: none; }
  @media (max-width: 760px) { .work .head { grid-template-columns: 1fr; } .ws-controls { display: none; } .ws-slide { flex-basis: 82%; } }

  /* ============================================================
     TRACK RECORD — dark résumé band
     ============================================================ */
  .record { background: var(--ink); color: var(--paper); padding: var(--s-10) 0; }
  .record .head { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--gutter) 56px; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 80px); align-items: end; }
  .record .eyebrow { color: var(--sky); }
  .record h2 { font-family: var(--font-body); font-weight: 300; font-size: clamp(40px, 5vw, 80px); line-height: 0.98; letter-spacing: -0.025em; margin: 16px 0 0; }
  .record h2 em { color: var(--sky); font-style: italic; }
  .record .head p { font-family: var(--font-body); font-size: 19px; line-height: 1.55; color: var(--paper-3); margin: 0; max-width: 460px; }
  .rec-list { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--gutter); }
  .rec-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid color-mix(in oklab, var(--paper) 16%, transparent); }
  .rec { display: flex; flex-direction: column; padding: clamp(28px, 3vw, 42px) 0; border-bottom: 1px solid color-mix(in oklab, var(--paper) 12%, transparent); }
  .rec:nth-child(odd) { padding-right: clamp(28px, 4vw, 64px); }
  .rec:nth-child(even) { padding-left: clamp(28px, 4vw, 64px); border-left: 1px solid color-mix(in oklab, var(--paper) 12%, transparent); }
  .rec .top { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 18px; }
  .rec .n { font-family: var(--font-mono); font-size: 12px; color: var(--sky); letter-spacing: 0.08em; }
  .rec .role { font-family: var(--font-display); font-size: 10px; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; color: var(--paper-2); }
  .rec .name { font-family: var(--font-body); font-weight: 300; font-size: clamp(26px, 2.5vw, 38px); line-height: 1.1; letter-spacing: -0.015em; }
  .rec .name em { color: var(--sky); font-style: italic; }
  .rec .place { margin-top: 14px; font-family: var(--font-body); font-size: 16px; color: var(--paper-3); }
  @media (max-width: 900px) {
    .record .head { grid-template-columns: 1fr; gap: 28px; align-items: start; }
  }
  @media (max-width: 760px) {
    .rec-grid { grid-template-columns: 1fr; }
    .rec:nth-child(odd) { padding-right: 0; }
    .rec:nth-child(even) { padding-left: 0; border-left: 0; }
  }

  /* ============================================================
     DESIGN PHASES — one accountable path (open grid)
     ============================================================ */
  .phases { background: color-mix(in oklab, var(--sky) 9%, var(--paper)); padding: var(--s-10) 0; }
  .phases__in { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--gutter); }
  .phases .head { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 80px); align-items: end; margin-bottom: clamp(40px, 5vw, 64px); }
  .phases h2 { font-family: var(--font-body); font-weight: 300; font-size: clamp(40px, 5vw, 78px); line-height: 0.98; letter-spacing: -0.025em; margin: 16px 0 0; color: var(--ink); }
  .phases h2 em { color: var(--accent); font-style: italic; }
  .phases .head p { font-family: var(--font-body); font-size: 18px; line-height: 1.6; color: var(--ink-soft); margin: 0; max-width: 44ch; }
  .ph-case { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(40px, 5vw, 88px); align-items: start; }
  .ph-main { margin: 0; }
  .ph-case .fr { overflow: hidden; background: var(--paper-3); aspect-ratio: 4 / 3; }
  .ph-case .fr img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .ph-case .pn { font-family: var(--font-mono); font-size: 12px; color: var(--accent); letter-spacing: 0.08em; }
  .ph-main figcaption { padding-top: 28px; max-width: 54ch; }
  .ph-main h3 { font-family: var(--font-body); font-weight: 300; font-size: clamp(26px, 2.4vw, 38px); line-height: 1.12; letter-spacing: -0.015em; color: var(--ink); margin: 14px 0 0; text-wrap: balance; }
  .ph-main figcaption p { font-family: var(--font-body); font-size: 17px; line-height: 1.6; color: var(--ink-soft); margin: 14px 0 0; text-wrap: pretty; }
  .ph-item { display: grid; grid-template-columns: minmax(120px, 185px) 1fr; gap: clamp(20px, 2.4vw, 32px); padding: clamp(26px, 2.8vw, 38px) 0; border-top: 1px solid var(--rule); align-items: start; }
  .ph-side .ph-item:first-child { border-top: 0; padding-top: 0; }
  .ph-side .ph-item:last-child { padding-bottom: 0; }
  .ph-item h3 { font-family: var(--font-body); font-weight: 400; font-size: clamp(20px, 1.7vw, 25px); line-height: 1.2; letter-spacing: -0.01em; color: var(--ink); margin: 10px 0 8px; text-wrap: balance; }
  .ph-item p { font-family: var(--font-body); font-size: 15.5px; line-height: 1.55; color: var(--ink-soft); margin: 0; text-wrap: pretty; }
  @media (max-width: 980px) {
    .ph-case { grid-template-columns: 1fr; gap: 8px; }
    .ph-side { border-top: 1px solid var(--rule); margin-top: 32px; }
    .ph-side .ph-item:first-child { border-top: 0; padding-top: 32px; }
  }
  @media (max-width: 860px) {
    .phases .head { grid-template-columns: 1fr; gap: 24px; align-items: start; }
  }
  @media (max-width: 520px) {
    .ph-item { grid-template-columns: 1fr; }
  }

  /* ============================================================
     CREDENTIALS — license + qualifications
     ============================================================ */
  .creds { max-width: var(--max-w); margin: 0 auto; padding: var(--s-10) var(--gutter); }
  .creds__grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(40px, 6vw, 88px); align-items: center; }
  .creds__intro h2 { font-family: var(--font-body); font-weight: 300; font-size: clamp(34px, 4vw, 60px); line-height: 1.02; letter-spacing: -0.022em; margin: 16px 0 0; color: var(--ink); max-width: 15ch; text-wrap: balance; }
  .creds__intro p { font-family: var(--font-body); font-size: 18px; line-height: 1.6; color: var(--ink-soft); margin: 26px 0 0; max-width: 44ch; }
  .creds__card { background: var(--coastal-deep); color: var(--paper); display: grid; grid-template-columns: minmax(0, 1fr) 1.15fr; }
  .creds__id { padding: clamp(28px, 3vw, 40px); border-right: 1px solid color-mix(in oklab, var(--paper) 14%, transparent); display: flex; flex-direction: column; }
  .creds__id .lbl { font-family: var(--font-display); font-size: 10px; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; color: var(--sky); line-height: 1.5; }
  .creds__id .cgc { font-family: var(--font-body); font-weight: 300; font-size: clamp(38px, 4.2vw, 60px); line-height: 0.98; letter-spacing: -0.02em; margin: clamp(26px, 4vw, 48px) 0 auto; }
  .creds__id .note { font-family: var(--font-display); font-size: 10px; letter-spacing: 0.13em; text-transform: uppercase; line-height: 1.7; color: color-mix(in oklab, var(--paper) 60%, transparent); margin-top: 40px; }
  .creds__rows { display: grid; }
  .creds__row { padding: clamp(18px, 2vw, 26px) clamp(24px, 2.6vw, 34px); border-bottom: 1px solid color-mix(in oklab, var(--paper) 12%, transparent); }
  .creds__row:last-child { border-bottom: 0; }
  .creds__row .v { font-family: var(--font-body); font-weight: 300; font-size: clamp(20px, 1.7vw, 25px); line-height: 1.12; letter-spacing: -0.01em; }
  .creds__row .k { font-family: var(--font-display); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--sky); margin-top: 10px; }
  @media (max-width: 900px) {
    .creds__grid { grid-template-columns: 1fr; gap: 32px; }
    .creds__card { grid-template-columns: 1fr; }
    .creds__id { border-right: 0; border-bottom: 1px solid color-mix(in oklab, var(--paper) 14%, transparent); }
    .creds__id .cgc { margin: 22px 0; }
    .creds__id .note { margin-top: 0; }
  }

  /* ============================================================
     SECTORS
     ============================================================ */
  .sectors { max-width: var(--max-w); margin: 0 auto; padding: var(--s-10) var(--gutter); border-top: 1px solid var(--rule); }
  .sectors .head { margin-bottom: 44px; max-width: 720px; }
  .sectors h2 { font-family: var(--font-body); font-weight: 300; font-size: clamp(36px, 4.4vw, 64px); line-height: 1.0; letter-spacing: -0.022em; margin: 16px 0 0; }
  .sectors h2 em { color: var(--accent); font-style: italic; }
  .sec-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--rule); }
  .sec { display: flex; align-items: baseline; gap: 24px; padding: 30px 0; border-bottom: 1px solid var(--rule-soft); }
  .sec:nth-child(odd) { padding-right: 56px; }
  .sec:nth-child(even) { padding-left: 56px; border-left: 1px solid var(--rule-soft); }
  .sec .num { flex: none; font-family: var(--font-mono); font-size: 12px; color: var(--accent); letter-spacing: 0.08em; padding-top: 7px; }
  .sec .label { font-family: var(--font-body); font-size: clamp(22px, 2.1vw, 28px); line-height: 1.16; letter-spacing: -0.01em; color: var(--ink); transition: color .2s var(--ease); }
  .sec:hover .label { color: var(--accent); }
  @media (max-width: 760px) {
    .sec-grid { grid-template-columns: 1fr; }
    .sec:nth-child(odd) { padding-right: 0; }
    .sec:nth-child(even) { padding-left: 0; border-left: 0; }
  }

  /* ============================================================
     CTA
     ============================================================ */
  .com-cta { background: var(--coastal-deep); color: var(--paper); padding: var(--s-10) 0; }
  .com-cta .inner { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--gutter); display: grid; grid-template-columns: 1.4fr 1fr; gap: clamp(48px, 7vw, 96px); align-items: end; }
  .com-cta .eyebrow { color: var(--sky); }
  .com-cta h2 { font-family: var(--font-body); font-weight: 300; font-size: clamp(44px, 6vw, 92px); line-height: 0.98; letter-spacing: -0.025em; margin: 16px 0 0; }
  .com-cta h2 em { color: var(--sky); font-style: italic; }
  .com-cta .lede { font-family: var(--font-body); font-weight: 300; font-size: clamp(19px, 1.5vw, 22px); line-height: 1.5; color: color-mix(in oklab, var(--paper) 84%, transparent); margin: 24px 0 0; max-width: 46ch; }
  .com-cta .lede em { color: var(--sky); font-style: italic; }
  .com-cta .actions { margin-top: 36px; display: flex; gap: 16px; flex-wrap: wrap; }
  .com-cta .btn { color: var(--paper); border-color: rgba(255,255,255,.5); }
  .com-cta .btn.primary { background: var(--sky); color: var(--ink); border-color: var(--sky); }
  .com-cta .btn.primary:hover { background: var(--paper); border-color: var(--paper); }
  .com-cta .btn:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }
  .com-cta .meta .row { display: flex; justify-content: space-between; gap: 24px; padding: 14px 0; border-bottom: 1px solid color-mix(in oklab, var(--paper) 18%, transparent); font-family: var(--font-body); font-size: 18px; }
  .com-cta .meta .row:first-child { border-top: 1px solid color-mix(in oklab, var(--paper) 18%, transparent); }
  .com-cta .meta .row .k { font-family: var(--font-display); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--sky); align-self: center; }

  @media (max-width: 980px) {
    .com-intro .grid, .com-cta .inner { grid-template-columns: 1fr; gap: 32px; align-items: start; }
    .stat-row { grid-template-columns: 1fr 1fr; }
    .stat:nth-child(2n) { border-right: 0; padding-right: 0; }
    .stat:nth-child(2n+1) { padding-right: 28px; }
    .stat:nth-child(-n+2) { padding-bottom: 28px; }
    .stat:nth-child(n+3) { border-top: 1px solid var(--rule-soft); padding-top: 28px; }
  }