/* Portfolio composition: a clear subject, generous intervals, optional depth. */
:root { --chapter-space: clamp(80px, 8vw, 112px); --opening-space: 88px; --radius-media: 12px; --radius-panel: 16px; --ease-expressive: cubic-bezier(.16,1,.3,1); --content: 1320px; --paper: #fff; --quiet: #f5f5f6; --surface: #f5f5f6; --ink: #202022; }
html:has(.portfolio-page) { scroll-padding-top: 0; }
.portfolio-page { background: var(--paper); color: var(--ink); }
.portfolio-page .container, .portfolio-page .nav-wrap, .portfolio-page > footer { width: calc(100% - 112px); max-width: var(--content); }
.portfolio-page h1, .portfolio-page h2, .portfolio-page h3 { text-wrap: balance; }
.portfolio-page h1 {  line-height: 1.06; font-weight: 400; letter-spacing: -.026em; max-width: 1080px; }
.portfolio-page h1 .brand-phrase {  line-height: inherit; letter-spacing: -.004em; }
.portfolio-page h2 { font-size: clamp(34px, 3.7vw, 54px); font-weight: 400; line-height: 1.08; letter-spacing: -.024em; }
.portfolio-page p { text-wrap: pretty; }
.portfolio-page .eyebrow { font-size: 12px; font-weight: 500; letter-spacing: .14em; line-height: 1.6; margin-bottom: 26px; }
.portfolio-page .header { height: 80px; background: #ffffffed; backdrop-filter: blur(20px); }
.portfolio-page .header .brand { width: 116px; }
.portfolio-page .header nav { gap: 26px; font-size: 16px; }
.portfolio-page .nav-cta { padding: 13px 20px; }
.portfolio-page .button { padding: 17px 24px; font-size: 16px; min-height: 52px; }
.portfolio-page .text-link { font-size: 15px; font-weight: 400; gap: 10px; line-height: 1.5; }
.portfolio-page .text-link .cta-icon { transition: transform .22s ease; }
.portfolio-page .text-link:hover .cta-icon { transform: none; }
.portfolio-page [hidden] { display: none !important; }
.portfolio-page :where(section[id], h2[id], h3[id], article[id]) { scroll-margin-top: 120px; }
.page-opening { padding-block: var(--opening-space) 84px; }
.page-opening .opening-intro, .opening-intro { margin-top: 30px; max-width: 530px; font-size: 19px; color: #65656a; line-height: 1.6; }
.chapter { padding-block: var(--chapter-space); }
.chapter-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 50px; margin-bottom: 58px; }
.chapter-heading h2 { max-width: 740px; margin: 0; }
.chapter-heading > .text-link { flex-shrink: 0; margin-bottom: 7px; }
.chapter-intro { color: #626268; font-size: 20px; line-height: 1.6; max-width: 420px; }
/* Visual project library. Whole cards are links; action targets stay still. */
.folio-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 32px; row-gap: 88px; }
.folio-card { min-width: 0; }
.folio-link { display: block; }
.folio-visual { position: relative; overflow: hidden; border-radius: var(--radius-media); isolation: isolate; background: #f5f5f6; }
.folio-art { width: 100%; aspect-ratio: 4/3; height: auto; overflow: hidden; position: relative; background: #f5f5f6; border-radius: 0; }
.folio-art img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .65s var(--ease-expressive); }
.folio-open { position: absolute; bottom: 22px; right: 22px; width: 48px; height: 48px; border-radius: 50%; background: #fff; display: grid; place-items: center; font-size: 24px; transition: background-color .25s,color .25s; }
.folio-link:hover .folio-open, .folio-link:focus-visible .folio-open { background: var(--ink); color: white; }
.folio-link:hover .folio-art:not(.case-focus-window) img { transform: scale(1.035); }
.folio-link:focus-visible { outline-offset: 9px; border-radius: 10px; }
.folio-meta { display: flex; justify-content: space-between; gap: 20px; margin: 28px 0 14px; font-size: 15px; line-height: 1.5; }
.folio-meta > span:first-child { font-weight: 600; }
.folio-meta > span:last-child { color: var(--muted); text-align: right; }
.folio-card h3 { font-size: clamp(25px, 2.3vw, 34px); font-weight: 400; line-height: 1.18; letter-spacing: -.025em; margin: 0; max-width: 560px; }
.folio-card > a > p { font-size: 15px; margin-top: 13px; color: var(--muted); }
.work-library { padding-top: 0; }
.work-filters { display: flex; flex-wrap: wrap; gap: 12px 32px; border: 0; padding: 15px 0; margin-bottom: 48px; }
.work-filters button { background: none; border: 0; padding: 12px 0; cursor: pointer; color: #717177; font: inherit; font-size: 14px; }
.work-filters button[aria-pressed="true"] { color: var(--ink); font-weight: 650; }
.work-filters button:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 6px; }
.library-note { margin: 54px 0 0; color: var(--muted); font-size: 14px; }
/* A single voice at a time, with deliberate, manual navigation. */
.quote-stage { padding-block: 96px; background: var(--quiet); }
.quote-dark { background: #202022; color: #fff; }
.quote-heading { margin-bottom: 42px; }
.quote-heading .eyebrow { margin: 0; }
.quote-heading h2 { margin-top: 18px; }
.quote-slides { max-width: 1060px; }
.quote-stage .work-feedback-quote { padding: 0; margin: 0 0 36px; border: 0; display: block; }
.quote-stage[data-enhanced] .quote-slides { display: grid; }
.quote-stage[data-enhanced] .work-feedback-quote { grid-area: 1/1; margin: 0; }
.quote-stage .work-feedback-quote blockquote { margin-bottom: 36px; }
.quote-stage .work-feedback-quote blockquote p { font-size: clamp(28px,3vw,40px); line-height: 1.24; letter-spacing: -.02em; color: inherit; font-weight: 400; text-wrap: balance; }
.quote-stage .work-feedback-quote figcaption { font-size: 16px; font-weight: 400; line-height: 1.5; }
.quote-dark .work-feedback-quote figcaption { color: #d7d7db; }
.quote-bottom { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-top: 44px; }
.quote-bottom > p { font-size: 14px; color: #65656c; max-width: 580px; line-height: 1.6; }
.quote-dark .quote-bottom > p { color: #b9b9bf; }
.quote-controls { display: flex; gap: 20px; align-items: center; }
.quote-controls button { width: 46px; height: 46px; border: 1px solid #a1a1a6; border-radius: 50%; color: inherit; background: transparent; cursor: pointer; font-size: 19px; transition: background-color .2s,color .2s; }
.quote-controls button:hover { background: var(--ink); color: #fff; }
.quote-dark .quote-controls button:hover { background: #fff; color: var(--ink); }
.quote-controls span { font-size: 14px; min-width: 36px; text-align: center; font-variant-numeric: tabular-nums; }
.quote-dark button:focus-visible { outline-color: #fff; box-shadow: none; }
/* Public previews focus on one premise, with a quiet invitation. */
.preview-opening { padding-bottom: 58px; }
.preview-opening > .text-link { margin-bottom: 45px; font-size: 14px; }
.preview-opening h1 {  max-width: 980px; }
.preview-opening .intro { max-width: 650px; font-size: 19px; line-height: 1.6; margin-top: 30px; }
.preview-status { display: flex; gap: 12px 24px; flex-wrap: wrap; font-size: 14px; margin-top: 32px; }
.preview-status > span:last-child { color: var(--muted); }
.preview-summary { display: grid; grid-template-columns: 1.75fr 1fr; align-items: start; gap: 100px; margin-top: 40px; }
.preview-opening .preview-summary .intro { margin: 0; }
.preview-summary .preview-status { flex-direction: column; gap: 8px; margin: 0; line-height: 1.6; }
.portfolio-page .public-cover { margin-bottom: 0; }
.portfolio-page .public-cover img { width: 100%; height: auto; aspect-ratio: auto; max-height: none; border-radius: 10px; display: block; }
.preview-story { display: grid; grid-template-columns: 1fr 1fr; gap: 110px; align-items: start; }
.preview-story .chapter-heading { margin-bottom: 30px; }
.preview-story .preview-lead { font-size: 20px; line-height: 1.6; max-width: 530px; color: #626268; margin-bottom: 32px; }
.preview-story .story-disclosure summary { font-size: 16px; }
.invitation-panel { padding: 38px; background: #f5f5f6; border-radius: 10px; }
.invitation-panel h2 { font-size: 40px; margin-bottom: 24px; }
.invitation-panel > p:not(.eyebrow) { font-size: 16px; line-height: 1.65; color: #626268; }
.invitation-panel .button { margin-top: 25px; }
.invitation-panel .invitation-note { font-size: 14px !important; margin-top: 20px; }
.invitation-panel .story-disclosure { margin-top: 28px; border-bottom: 0; }
.invitation-panel .story-disclosure summary { padding-bottom: 0; }
.invitation-panel .story-disclosure[open] summary { padding-bottom: 18px; }
.contact-opening { padding-block: var(--opening-space) 80px; }
.contact-opening h1 {  }
.contact-invitation { display: flex; align-items: center; justify-content: space-between; gap: 50px; margin-top: 50px; }
.contact-invitation p { font-size: 18px; line-height: 1.65; color: #66666c; }
.contact-invitation .actions { margin: 0; }
.contact-paths { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; padding-block: 38px 100px; }
.contact-paths > a { padding: 30px 0; border-top: 1px solid var(--line); position: relative; }
.contact-paths h2 { font-size: 28px; padding-right: 40px; }
.contact-paths p:not(.eyebrow) { font-size: 15px; color: var(--muted); margin-top: 16px; }
.contact-paths > a > span:last-child { position: absolute; right: 8px; top: 76px; font-size: 28px; }
.contact-paths > a:hover h2 { text-decoration: underline; text-underline-offset: 7px; text-decoration-thickness: 1px; }
.private-context { display: grid; grid-template-columns: 1fr 1fr; gap: 30px 80px; border: 0; padding-block: 72px 100px; }
.private-context > .eyebrow { grid-column: 1/-1; margin: 0; }
.private-context p:not(.eyebrow) { font-size: 18px; line-height: 1.7; color: var(--muted); margin-bottom: 24px; }
.page-case .case-intro { padding-block: 45px 50px; }
.page-case .case-hero-grid { margin-block: 50px; gap: 80px; grid-template-columns: 1fr 1.15fr; }
.page-case .case-intro h1 {  line-height: 1.07; }
.page-case .case-intro .intro { font-size: 18px; line-height: 1.65; margin-top: 28px; }
.page-case .case-role-line { margin-top: 35px; padding-top: 20px; border: 0; font-size: 14px; line-height: 1.7; color: #73737a; max-width: 440px; }
.page-case .case-contents-wrap { top: 80px; }
.page-case .case-contents { min-height: 55px; }
.page-case .case-section { padding-block: 110px; scroll-margin-top: 144px; }
.page-case .case-section-head { grid-template-columns: .95fr 1fr; gap: 100px; align-items: start; }
.page-case .case-section-head h2 { font-size: clamp(32px,3.5vw,49px); max-width: 560px; }

.page-case .case-prose > p { font-size: 18px; line-height: 1.75; color: #55555d; margin-top: 0; }
.page-case .case-figure { margin-top: 52px; }
.page-case .case-figure > button { border-radius: 10px; overflow: hidden; background: #f5f5f6; }
.page-case .case-figure > button img { width: 100%; height: auto; max-height: none; }
.page-case .case-figure figcaption { margin-top: 18px; font-size: 14px; }
.page-case .case-deep-dive { margin-top: 44px; }
.page-case .case-deep-dive > summary { padding-block: 23px; }
.page-case .case-pair, .page-case .case-decisions, .page-case .case-results, .page-case .case-decision-record { gap: 38px; }
.page-case .case-decisions p, .page-case .case-results p { font-size: 15px; line-height: 1.7; }
.page-case .case-results { margin-block: 42px; }
.page-case .case-results h3 { font-size: 30px; }
.page-case .case-note { margin-top: 38px; padding-left: 25px; font-size: 14px; }
.page-case .colour-section { background: #f5f5f6; }
.page-case .chapter-outcome { border: 0; }
.page-case .case-next { padding-block: 64px 85px; }
.page-case .case-next h2 { font-size: 35px; }
.page-utility .legal-layout { padding-block: 55px 100px; }
/* Keep opening screens quiet and use contrast at the conclusion. */
.page-case .colour-section.tone-intro { background: #fff; }
.page-case .case-hero-grid .case-figure { margin-top: 0; }
.page-case .case-outcome-band { background: #202022; color: #fff; }
.page-case .case-outcome-band .chapter-outcome { border: 0; }
.page-case .case-outcome-band h2, .page-case .case-outcome-band h3 { color: white; }
.page-case .case-outcome-band .case-prose p, .page-case .case-outcome-band .case-results p,
.page-case .case-outcome-band .case-note, .page-case .case-outcome-band .case-credit,
.page-case .case-outcome-band .eyebrow { color: #c5c5cb; }
.page-case .case-outcome-band .case-note { border-color: #c5c5cb; }
.page-case .case-outcome-band .case-results > div, .page-case .case-outcome-band .case-credit { border-color: #ffffff35; }
.page-case .case-role-line span { display: block; margin-top: 6px; color: #45454b; }
/* Direction: shared, purposeful compositions. */
 .portfolio-page .hero { grid-template-columns: .92fr 1.08fr; column-gap: 80px; padding-block: 76px 64px; min-height: 0; align-items: center; }
.hero-copy { min-width: 0; }
.portfolio-page .hero h1 {  line-height: 1.06; max-width: 540px; letter-spacing: -.03em; }
.portfolio-page .hero h1 .brand-phrase {  line-height: inherit; color: var(--ink); }
.portfolio-page .hero .intro { font-size: 19px; line-height: 1.6; max-width: 405px; margin-top: 28px; }
.portfolio-page .hero .actions { margin-top: 30px; flex-wrap: wrap; }
.experience-marquee { position: relative; display: flex; align-items: center; gap: 24px; border: 0; padding-block: 24px; }
.logo-viewport { flex: 1; min-width: 0; overflow: hidden; }
.logo-track-list { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 20px; list-style: none; padding: 0; margin: 0; }
.logo-track-list li { width: 136px; height: 52px; overflow: hidden; display: flex; justify-content: center; align-items: center; flex: 0 0 136px; }
.logo-track-list img { width: 230px; max-width: none; height: auto; flex-shrink: 0; }
.logo-track-list[aria-hidden] { display: none; }
[data-motion-ready] .logo-track { display: flex; width: max-content; animation: company-drift 42s linear infinite; }
[data-motion-ready] .logo-track-list { display: flex; flex-wrap: nowrap; gap: 28px; padding-right: 28px; }
[data-motion-ready] .logo-viewport { mask-image: linear-gradient(to right,transparent,#000 3%,#000 97%,transparent); }
@keyframes company-drift { to { transform: translateX(-50%); } }
.ambient-paused .logo-track, .ambient-paused .role-cursor, .logo-viewport:hover .logo-track { animation-play-state: paused; }
.motion-control { border: 1px solid var(--line); border-radius: 50%; background: white; color: var(--ink); width: 44px; height: 44px; flex-shrink: 0; cursor: pointer; transition: color .2s,background-color .2s; }
.motion-control:hover { background: var(--ink); color: #fff; }
.featured-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; }
.featured-grid .folio-art { aspect-ratio: 4/3; }
.featured-grid h3 { font-size: clamp(25px,2.25vw,31px); }
.featured-grid .folio-meta { display: block; margin: 24px 0 13px; }
.featured-grid .folio-meta span { display: block; text-align: left; }
.featured-grid .folio-meta span:first-child { font-size: 14px; margin-bottom: 4px; }
.folio-meta > span:first-child { font-size: 14px; }
.leadership-feature { display: grid; grid-template-columns: 1fr 1fr; gap: 56px 100px; padding-block: 0 var(--chapter-space); }
.leadership-title { max-width: 490px; }
.leadership-title h2 { margin-bottom: 24px; }
.leadership-title > p:not(.eyebrow) { max-width: 370px; color: #626268; font-size: 18px; line-height: 1.65; }
.leadership-title .text-link { margin-top: 28px; }
.leadership-points article { display: flex; align-items: start; gap: 26px; padding-block: 26px; border: 0; }
.leadership-points article:first-child { padding-top: 0; border: 0; }
.point-index { font-size: 13px; color: #737379; line-height: 2; font-variant-numeric: tabular-nums; }
.leadership-points h3 { font-size: 25px; letter-spacing: -.02em; font-weight: 400; margin-bottom: 10px; }
.leadership-points p { font-size: 16px; line-height: 1.65; color: #626268; max-width: 440px; }
.leadership-endorsement { grid-column: 1/-1; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; border: 0; padding: 44px 48px; background: var(--quiet); border-radius: 12px; margin: 0; }
.leadership-endorsement blockquote { font-size: clamp(25px,2.5vw,34px); line-height: 1.4; letter-spacing: -.014em; max-width: 920px; margin: 0; }
.leadership-endorsement figcaption { font-size: 16px; line-height: 1.6; margin: 0; }
.leadership-endorsement figcaption span { display: block; margin-top: 6px; color: #626268; font-size: 14px; }
/* A typographic product banner; one proposition, one destination. */
.product-feature { background: #f5f5f6; padding-block: 64px; }
.product-feature .chapter-heading { margin-bottom: 40px; }
.product-feature .chapter-heading h2 { font-size: 36px; }
.product-feature .eyebrow { margin-bottom: 16px; }
.decised-banner { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 90px; align-items: start; border: 0; padding-top: 6px; }
.product-status { display: flex; align-items: center; gap: 9px; font-size: 12px; letter-spacing: .12em; margin-bottom: 25px; }
.product-status span { width: 6px; height: 6px; border-radius: 50%; background: var(--ink); }
.decised-identity :is(h2,h3) { font-size: clamp(48px,5vw,68px); font-weight: 400; letter-spacing: -.04em; line-height: 1; }
.decised-domain { margin-top: 22px; font-size: 14px; }
.decised-proposition { font-size: clamp(23px,2.2vw,29px); line-height: 1.25; letter-spacing: -.024em; }
.decised-description { font-size: 16px; line-height: 1.65; max-width: 430px; margin-top: 22px; }
.decised-invitation .button { margin-top: 28px; }
/* Mentorship is a clear invitation, supported by a real voice. */
.mentor-invitation { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; padding-block: var(--chapter-space); }
.mentor-invitation h2 { margin-bottom: 24px; }
.mentor-invitation > div > p:not(.eyebrow) { font-size: 18px; line-height: 1.65; max-width: 395px; color: #626268; }
.mentor-invitation .text-link { margin-top: 28px; }
.mentor-topic-list { display: flex; flex-direction: column; gap: 18px; padding-bottom: 8px; border: 0; font-size: 15px; }
.mentor-topic-list > span { display: flex; align-items: center; gap: 14px; }
.mentor-preview figure { margin: 28px 0 0; }
.mentor-preview blockquote { font-size: 23px; line-height: 1.5; letter-spacing: -.015em; max-width: 480px; }
.mentor-preview figcaption { display: flex; align-items: center; gap: 14px; margin-top: 24px; font-size: 15px; }
.mentor-preview img { border-radius: 50%; object-fit: cover; width: 44px; height: 44px; }
.mentor-preview small { display: block; color: var(--muted); margin-top: 3px; font-size: 14px; }
/* A steady closing invitation serves roles, contracts and independent engagements. */
.closing-section { background: #202022; color: #fff; padding-block: 82px 64px; }
.closing-composition { display: grid; grid-template-columns: minmax(0,1.9fr) minmax(260px,1fr); gap: 64px; align-items: end; }
.closing-main { grid-column: 1/-1; min-width: 0; }
.closing-composition:has(> .practice-bridge) .closing-main { grid-column: auto; }
.closing-section h2 { color: #fff; font-size: clamp(38px,4.2vw,60px); line-height: 1.1; }
.closing-section .eyebrow { color: #babac0; margin-bottom: 23px; }
.closing-intro { margin-top: 24px; color: #c4c4ca; font-size: 16px; line-height: 1.7; }
.closing-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 32px; }
.closing-email { display: inline-flex; align-items: center; justify-content: flex-start; min-height: 48px; padding: 8px 0; color: #fff; font-size: 18px; text-decoration: underline; text-decoration-color: #ffffff60; text-underline-offset: 5px; transition: color .2s, text-decoration-color .2s; }
.closing-email:hover { color: var(--accent); text-decoration-color: currentColor; }
.practice-bridge { display: flex; flex-direction: column; align-items: flex-start; justify-self: end; gap: 20px; width: 100%; max-width: 330px; margin: 0; }
.practice-bridge .practice-bridge-label { font-size: 16px; color: #fff; margin-bottom: 8px; }
.practice-bridge-copy > p { font-size: 16px; line-height: 1.6; color: #c4c4ca; max-width: 465px; }
.practice-bridge .text-link { display: inline-flex; justify-content: flex-start; min-height: 48px; margin: 0; color: #fff; }
.portfolio-page .closing-section .text-link:hover { color: #fff; }
.closing-section :where(a,button):focus-visible { outline-color: #fff; box-shadow: 0 0 0 2px var(--ink); }
.portfolio-page > footer { padding-top: 36px; }
.portfolio-page .footer-top { padding-bottom: 30px; align-items: center; }
/* About: a proportionate portrait, clear story and visible practice. */
.about-introduction { padding-block: var(--opening-space) 70px; }
.about-heading { margin-bottom: 64px; }
.portfolio-page .about-heading h1 {  max-width: 1100px; }
.about-person { display: grid; grid-template-columns: 270px minmax(0,650px); gap: clamp(55px,9vw,130px); align-items: center; }
.about-person figure { margin: 0; }
.about-person .about-portrait { width: 100%; height: 324px; display: block; object-fit: cover; border-radius: 6px; }
.about-person figcaption { font-size: 14px; color: #626268; margin-top: 16px; }
.about-story .eyebrow { margin-bottom: 22px; }
.about-story .about-statement { font-size: 28px; line-height: 1.35; letter-spacing: -.018em; color: var(--ink); margin-top: 0; }
.about-story > p { color: #626268; font-size: 17px; line-height: 1.7; margin-top: 20px; }
.about-story .actions { margin-top: 28px; }
.about-chapters { display: flex; gap: 36px; align-items: center; padding-block: 24px; border: 0; flex-wrap: wrap; }
.about-chapters > span { font-size: 9px; letter-spacing: .13em; margin-right: auto; color: #737379; }
.about-chapters a { font-size: 15px; text-underline-offset: 5px; }
.about-chapters a:hover { text-decoration: underline; }
/* Leadership: each responsibility stays beside the evidence that supports it. */
.leadership-detail .chapter-heading { display: block; margin-bottom: 56px; }
.leadership-detail .chapter-intro { max-width: 650px; margin-top: 24px; font-size: 18px; line-height: 1.65; }
.leadership-evidence { display: grid; gap: 64px; }
.leadership-story { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); gap: clamp(32px,5vw,72px); align-items: stretch; }
.leadership-story-copy { padding-block: 8px; }
.leadership-theme { display: inline-block; background: var(--accent); color: var(--ink); padding: 6px 12px; border-radius: 4px; font-size: 14px; line-height: 1.5; margin-bottom: 20px; }
.leadership-evidence h3 { font-size: clamp(26px,2.5vw,34px); font-weight: 400; letter-spacing: -.024em; line-height: 1.2; margin-bottom: 18px; }
.leadership-story-copy > p:not(.leadership-theme) { font-size: 18px; line-height: 1.65; color: #626268; max-width: 52ch; }
.leadership-story-example { margin-top: 28px; }
.leadership-story-example h4 { font-size: 16px; line-height: 1.5; font-weight: 500; margin: 0 0 8px; }
.leadership-story-example p { font-size: 16px; line-height: 1.65; color: #626268; max-width: 56ch; }
.leadership-feedback { display: flex; flex-direction: column; justify-content: center; gap: 24px; margin: 0; padding: 36px; background: #f5f5f6; border-radius: 12px; }
.leadership-feedback blockquote { margin: 0; }
.leadership-feedback blockquote p { font-size: clamp(21px,1.8vw,25px); letter-spacing: -.012em; line-height: 1.5; color: var(--ink); }
.leadership-feedback figcaption { font-size: 15px; line-height: 1.6; color: var(--ink); }
.leadership-feedback figcaption span { display: block; color: #626268; }
.evidence-note { font-size: 14px; line-height: 1.6; color: #626268; margin-top: 32px; }
/* Process: visible stages, connected by intent rather than concealed in controls. */
.process-chapter { background: #f5f5f6; padding-block: 86px 64px; }
.process-chapter .chapter-heading { display: block; }
.process-chapter .chapter-intro { font-size: 18px; max-width: 500px; margin-top: 24px; }
.story-disclosure { border-block: 1px solid var(--line); }
.story-disclosure + .story-disclosure { border-top: 0; }
.story-disclosure > summary { display: flex; gap: 20px; justify-content: space-between; align-items: center; padding: 24px 0; list-style: none; cursor: pointer; font-size: 16px; line-height: 1.4; font-weight: 400; }
.story-disclosure > summary::-webkit-details-marker { display: none; }
.story-disclosure > summary > span:last-child { margin-left: auto; font-size: 22px; transition: transform .25s; }
.story-disclosure[open] > summary > span:last-child { transform: rotate(45deg); }
.story-disclosure > summary[aria-expanded="false"] > span:last-child { transform: none; }
.disclosure-body { padding-bottom: 26px; }
.disclosure-body p { font-size: 16px; color: #626268; line-height: 1.7; max-width: 700px; }
.colleague-voices .quote-slides { max-width: 1000px; }
.colleague-voices .quote-heading h2 { font-size: 24px; color: #fff; line-height: 1.3; letter-spacing: -.01em; margin: 0; }
.mentoring-chapter { padding-block: 88px; background: #f5f5f6; }
.mentoring-main { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: start; }
.mentoring-main > div:last-child { padding-top: 42px; max-width: 480px; }
.mentoring-main p:not(.eyebrow) { font-size: 18px; line-height: 1.65; color: #626268; }
.mentoring-main .actions { margin-top: 28px; }
.mentoring-chapter .recommendations { padding: 0; margin-top: 74px; width: 100%; }
.mentoring-chapter .recommendations > .section-heading { margin-bottom: 26px; }
.mentoring-chapter .recommendations h2 { font-size: 28px; }
.mentoring-chapter .recommendations .section-heading .eyebrow { display: none; }
.mentoring-chapter .recommendation-track { grid-auto-columns: calc((100% - 48px)/3); gap: 24px; }
.mentoring-chapter .recommendation-card { background: #fff; border: 0; padding: 28px; border-radius: 6px; min-height: 325px; }
.mentoring-chapter .recommendation-card blockquote { font-size: 19px; line-height: 1.55; letter-spacing: -.014em; }
.portfolio-page .reading-section { padding-block: var(--chapter-space); margin: 0 auto; }
.portfolio-page .book-grid { gap: 34px; }
.mentor-offers { display: grid; grid-template-columns: repeat(3,1fr); gap: 54px; padding-bottom: 80px; }
.mentor-offers article { padding-top: 0; border: 0; }
.mentor-offers h2 { font-size: 29px; margin-block: 28px 18px; }
.mentor-offers p { font-size: 16px; line-height: 1.7; color: #626268; }
.session-preparation { padding: 54px 0 80px; border: 0; }
.session-preparation h2 { font-size: 37px; margin-bottom: 24px; }
.session-preparation > p:not(.eyebrow) { max-width: 630px; font-size: 18px; line-height: 1.7; color: #626268; }
.page-mentorship .recommendations { margin-top: 0; }
/* Lab: independent products, practice and resources shared with the community. */
.lab-directory { display: flex; flex-wrap: wrap; gap: 12px 30px; margin-top: 34px; }
.lab-directory a { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; font-size: 16px; text-decoration: underline; text-decoration-color: #b9b9bf; text-underline-offset: 6px; transition: text-decoration-color .2s; }
.lab-directory a:hover { text-decoration-color: var(--ink); }
.lab-directory .carbon-icon { width: 16px; height: 16px; }
.lab-collection { padding-bottom: var(--chapter-space); }
.lab-live-feature { background: var(--ink); color: #fff; border-radius: 16px; padding: 44px 48px 48px; }
.lab-project-topline { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 44px; }
.lab-project-state { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; line-height: 1.5; }
.lab-state-dot { width: 7px; height: 7px; background: currentColor; border-radius: 50%; flex-shrink: 0; }
.lab-live-feature .lab-state-dot { background: #f2ff49; }
.lab-project-topline > .carbon-icon { width: 28px; height: 28px; }
.lab-live-body { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: start; }
.portfolio-page .lab-live-feature h2 { color: #fff; font-size: clamp(64px,7.8vw,108px); letter-spacing: -.04em; line-height: 1; }
.lab-subjects { display: flex; flex-wrap: wrap; gap: 10px 18px; margin: 26px 0 0; padding: 0; list-style: none; font-size: 15px; color: #c4c4ca; }
.lab-live-copy .lab-proposition { font-size: clamp(25px,2.5vw,34px); line-height: 1.3; letter-spacing: -.02em; color: #fff; }
.lab-live-copy > p + p { margin-top: 22px; font-size: 17px; line-height: 1.65; color: #c4c4ca; max-width: 440px; }
.lab-live-copy .button { margin-top: 30px; }
.button.paper { background: #fff; color: var(--ink); border: 1px solid #fff; }
.button.paper:hover { background: #e4e4e8; border-color: #e4e4e8; color: var(--ink); }
.button.paper:active { background: #cdcdd2; border-color: #cdcdd2; }
.lab-live-feature :focus-visible { outline: 2px solid white; outline-offset: 6px; box-shadow: none; }
.lab-companions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px; margin-top: 28px; }
.lab-project-panel { min-width: 0; display: flex; flex-direction: column; padding: 40px; border-radius: 16px; }
.lab-project-panel .lab-project-topline { margin-bottom: 50px; }
.portfolio-page .lab-project-panel h2 { font-size: clamp(34px,3.4vw,48px); line-height: 1.14; }
.lab-project-panel > p { font-size: 18px; line-height: 1.65; color: #626268; margin-top: 22px; max-width: 390px; }
.lab-project-panel .lab-panel-end { margin-top: auto; padding-top: 36px; }
.lab-incubator { background: var(--quiet); }
.lab-incubator .lab-state-dot { background: transparent; border: 1px solid #626268; }
.lab-studio { border: 1px solid #dcdce1; }
.portfolio-page .lab-studio h2 { font-size: clamp(32px,3.2vw,46px); letter-spacing: .015em; }
/* Community resources: an open collection that can grow over time. */
.lab-community-resource { padding-top: 84px; }
.lab-resource-copy { max-width: 720px; }
.lab-resource-label { display: flex; align-items: center; gap: 12px; font-size: 14px; line-height: 1.5; margin-bottom: 24px; color: #626268; }
.lab-resource-label img { width: 24px; height: 24px; }
.lab-resource-copy h2 { font-size: clamp(34px,3.4vw,48px); line-height: 1.15; letter-spacing: -.025em; font-weight: 400; }
.lab-resource-description { margin-top: 22px; max-width: 620px; font-size: 18px; line-height: 1.65; color: #626268; }
.lab-resource-copy .button { margin-top: 28px; }
@media (max-width: 800px) {
 .lab-community-resource { padding-top: 60px; }
 .lab-resource-description { font-size: 17px; }
}
@media (max-width: 1100px) {
 .lab-live-feature { padding: 36px; }
 .lab-live-body { gap: 36px; }
 .lab-project-panel { padding: 32px; }
 .lab-companions { gap: 22px; margin-top: 22px; }
}
@media (max-width: 700px) {
 .lab-directory { gap: 4px 24px; margin-top: 26px; }
 .lab-directory a { font-size: 15px; }
 .lab-live-feature { padding: 28px 24px 32px; border-radius: 12px; }
 .lab-project-topline { margin-bottom: 32px; }
 .lab-live-body { grid-template-columns: 1fr; gap: 34px; }
 .portfolio-page .lab-live-feature h2 { font-size: 64px; }
 .lab-subjects { font-size: 14px; gap: 8px 14px; margin-top: 20px; }
 .lab-live-copy .lab-proposition { font-size: 27px; }
 .lab-live-copy > p + p { font-size: 16px; }
 .lab-companions { grid-template-columns: 1fr; gap: 20px; margin-top: 20px; }
 .lab-project-panel { padding: 28px 24px 32px; border-radius: 12px; }
 .lab-project-panel .lab-project-topline { margin-bottom: 34px; }
 .portfolio-page .lab-project-panel h2 { font-size: 34px; }
 .portfolio-page .lab-studio h2 { font-size: 30px; }
 .lab-project-panel > p { font-size: 17px; }
 .lab-project-panel .lab-panel-end { padding-top: 28px; }
}
/* Private work begins with an equally weighted, recognisable project library. */
.page-private-work .folio-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 88px 32px; }
.page-private-work .folio-art { aspect-ratio: 4/3; }
.page-private-work .folio-card h3 { font-size: clamp(26px,2.5vw,36px); }
.page-private-work .folio-meta { display: block; }
.page-private-work .folio-meta span { display: block; text-align: left; }
.page-private-work .folio-meta span:first-child { margin-bottom: 5px; }
.page-case .case-intro > .case-facts { margin-top: 48px; }
.page-case .case-prose p + p { margin-top: 20px; }
.page-case .case-deep-dive { background: #f5f5f6; border: 1px solid #e3e3e6; border-radius: 8px; padding: 0 24px; }
.page-case .colour-section .case-deep-dive { background: #fff; }
.page-case .case-deep-dive > summary { font-size: 16px; padding-block: 24px; }
.page-case .case-deep-dive > summary:hover { color: #55555d; }
.page-case .case-deep-dive > summary::after { display: grid; place-items: center; border: 1px solid #b9b9c0; border-radius: 50%; width: 30px; height: 30px; flex-shrink: 0; }
.page-case .case-lightbox-bar h2 { font-size: 19px; font-weight: 400; line-height: 1.4; letter-spacing: -.012em; max-width: none; text-wrap: pretty; }
/* Legal & General: context, system, application, behaviour, evidence, outcome. */
.case-lead-layout { display: grid; grid-template-columns: 1.75fr 1fr; gap: 40px 100px; margin-top: 46px; align-items: start; }
.case-title { grid-column: 1 / -1; }
.page-case .case-title h1 { max-width: 1000px; }
.page-case .case-lead-layout .case-hero-copy > .intro { margin-top: 0; }
.case-editorial .case-lead-layout h1 {  max-width: 760px; }
.page-case .case-lead-layout .case-label { margin-top: 0; }
.case-lead-layout .case-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; border: 0; padding: 0; margin: 0; align-content: start; }
.case-lead-layout .case-facts dt { font-size: 12px; }
.case-lead-layout .case-facts dd { font-size: 15px; }
.case-editorial .case-lead-visual { margin-top: 56px; }

.case-editorial .case-figure figcaption span { display: block; font-size: 14px; margin-top: 5px; max-width: 750px; }
.case-editorial .case-section-head { grid-template-columns: .9fr 1.1fr; gap: 100px; }
.case-editorial .case-section-head h2 { font-size: clamp(32px,3.3vw,46px); }
.case-editorial .case-section-head .eyebrow { margin-bottom: 20px; }

.case-editorial .case-section { padding-block: 92px; }
.design-tension { border-left: 3px solid var(--ink); padding-left: 30px; max-width: 870px; margin-top: 54px; }
.design-tension > span { display: block; font-size: 12px; letter-spacing: .13em; margin-bottom: 18px; }
.design-tension p { font-size: 28px; line-height: 1.4; letter-spacing: -.02em; }
.case-editorial #themes > .case-figure { width: 100%; max-width: none; }
.case-editorial #system > .case-figure { width: 100%; max-width: none; }
.case-editorial .case-results { gap: 40px; margin-top: 48px; }
.case-editorial .case-results > div { padding-top: 24px; border-color: #b2b2b9; }
.case-editorial .case-results h3 { font-size: clamp(29px,3.2vw,43px); font-weight: 400; }
.case-editorial .case-decision-record { grid-template-columns: 1fr; gap: 0; border-bottom: 0; margin-top: 38px; padding: 0; }
.case-editorial .case-decision-record > div { display: grid; grid-template-columns: 180px 1fr 1.15fr; gap: 32px; padding-block: 26px; border-bottom: 1px solid var(--line); }
.case-editorial .case-decision-record h3 { font-size: 22px; margin: 0; }
.case-editorial .case-decision-record .eyebrow { margin: 4px 0 0; }
.case-editorial .case-decision-record p:not(.eyebrow) { font-size: 15px; }
/* Carbon UI symbols: consistent artboards, centred independently of font metrics. */
.carbon-icon { display: inline-block; flex-shrink: 0; vertical-align: middle; fill: currentColor; }
.cta-icon { display: inline-flex; align-items: center; justify-content: center; }
.cta-icon .carbon-icon, .folio-open .carbon-icon { width: 20px; height: 20px; }
.quote-controls button, .recommendation-controls button { display: inline-flex; align-items: center; justify-content: center; }
.disclosure-icon { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.disclosure-icon .carbon-icon { width: 20px; height: 20px; }
.page-case .case-deep-dive > summary::after { content: ''; box-sizing: border-box; background: url('icons/add.svg') center / 24px 24px no-repeat; }
.page-case .case-deep-dive:has(> summary:hover) { border-color: #a6a6ae; }
.page-case .case-deep-dive { transition: border-color .2s, background-color .2s; }
.leadership-points > article > .carbon-icon { width: 24px; height: 24px; margin-top: 3px; }
.mentor-offers > article > .carbon-icon { width: 32px; height: 32px; }
.quote-stage .work-feedback-quote figcaption > span { display: block; color: #65656c; margin-top: 7px; font-size: 14px; }
/* Metadata occupies its own row, so the title and explanation share a start line. */
.page-case .case-section-head { row-gap: 22px; }
.page-case .case-heading-title { display: contents; }
.page-case .case-heading-title > .eyebrow { grid-column: 1/-1; grid-row: 1; margin: 0; display: flex; align-items: center; gap: 18px; }
.page-case .chapter-number { color: #74747b; font-size: 13px; letter-spacing: 0; font-variant-numeric: tabular-nums; }
.page-case .case-heading-title > h2 { grid-column: 1; grid-row: 2; margin: 0; }
.page-case .case-section-head > .case-prose { grid-column: 2; grid-row: 2; }
.page-case .case-outcome-band .chapter-number { color: #c5c5cb; }
.page-case .case-section { scroll-margin-top: var(--case-anchor-offset, 168px); }
.case-contents a { transition: color .18s ease; }
@media (min-width: 701px) {
 .leadership-points, .mentor-preview { padding-top: 42px; }
}
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: page-leave 160ms ease-out both; }
::view-transition-new(root) { animation: page-arrive 320ms cubic-bezier(.16,1,.3,1) both; }
.header { view-transition-name: portfolio-header; }
::view-transition-old(portfolio-header), ::view-transition-new(portfolio-header) { animation: none; }
@keyframes page-leave { to { opacity: 0; } }
@keyframes page-arrive { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
 ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}
/* Lemon marks the page title, with room for every ascender and descender. */
.portfolio-page h1.highlight-title { line-height: 1.08; }
.title-highlight { color: var(--ink); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.portfolio-page h1.highlight-title .brand-phrase { line-height: inherit; background: linear-gradient(transparent 67%,var(--accent) 67%,var(--accent) 94%,transparent 94%); padding: 0 .02em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.closing-section h2 .brand-phrase { font-family: var(--font-display); font-size: 1.01em; font-weight: 400; letter-spacing: -.004em; }
.closing-actions .button { justify-content: center; width: auto; flex-shrink: 0; }
.quote-dark .work-feedback-quote figcaption > span { color: #bfc0c6; }
.colleague-voices .quote-heading { margin-bottom: 48px; }
.portfolio-page .footer-top > div { font-size: 14px; }
.portfolio-page .footer-bottom { font-size: 13px; line-height: 1.6; border: 0; }
.portfolio-page .recommendation-person p, .portfolio-page .review-source { font-size: 14px; line-height: 1.5; }
.portfolio-page .recommendation-person h3 { font-size: 17px; }
.portfolio-page .role-cursor > span { font-size: 12px; }
.portfolio-page .note-handle { font-size: 12px; }
/* Tablet: retain the composition without squeezing its contents. */
@media (max-width: 1100px) {
 .portfolio-page .container, .portfolio-page .nav-wrap, .portfolio-page > footer { width: calc(100% - 72px); }
 .portfolio-page .header nav { gap: 20px; }
 .portfolio-page .hero { gap: 30px; }
 .portfolio-page .hero h1 {  }
 .featured-grid, .page-private-work .folio-grid { gap: 24px; }
 .featured-grid h3, .page-private-work .folio-card h3 { font-size: 24px; }
 .leadership-feature, .mentor-invitation { gap: 45px; }
 .about-person { gap: 60px; grid-template-columns: 230px 1fr; }
 .about-person .about-portrait { height: 288px; }
 .about-story .about-statement { font-size: 25px; }
 .leadership-story { gap: 32px; }
 .leadership-feedback { padding: 28px; }
 .mentoring-main { gap: 45px; }
 .mentoring-chapter .recommendation-track { grid-auto-columns: calc((100% - 24px)/2); }
 .contact-invitation { flex-direction: column; align-items: flex-start; gap: 25px; }
 .preview-story, .page-case .case-section-head { gap: 50px; }
 .case-lead-layout { gap: 40px 45px; grid-template-columns: 1.55fr 1fr; }
 .preview-summary { gap: 45px; grid-template-columns: 1.55fr 1fr; }
 .case-lead-layout .case-facts { grid-template-columns: 1fr; gap: 20px; }
 .case-editorial .case-decision-record > div { grid-template-columns: 140px 1fr 1fr; gap: 20px; }
}
@media (max-width: 800px) and (min-width: 701px) {
 .portfolio-page .nav-cta { display: none; }
 .portfolio-page .header nav { margin-left: auto; }
 .portfolio-page .hero { grid-template-columns: 1fr; gap: 45px; }
 .portfolio-page .hero h1 {  }
}
@media (max-width: 700px) {
 :root { --chapter-space: 72px; --opening-space: 52px; }
 .portfolio-page .container, .portfolio-page .nav-wrap, .portfolio-page > footer { width: calc(100% - 40px); }
 .portfolio-page .header { height: 72px; }
 .portfolio-page h1 {  }
 .portfolio-page h2 { font-size: 34px; }
 .portfolio-page .eyebrow { margin-bottom: 20px; font-size: 12px; }
 .portfolio-page .hero { display: grid; grid-template-columns: 1fr; padding-block: 46px 34px; gap: 40px; }
 .portfolio-page .hero h1 {  }
 .portfolio-page .hero .intro { font-size: 16px; margin-top: 24px; }
 .portfolio-page .hero .actions { margin-top: 26px; gap: 22px; }
 .experience-marquee { padding-block: 16px; gap: 12px; }
 .logo-track-list li { width: 110px; flex-basis: 110px; }
 .logo-track-list img { width: 210px; }
 .motion-control { width: 38px; height: 38px; }
 .page-opening { padding-block: var(--opening-space) 46px; }
 .page-opening .opening-intro, .opening-intro { font-size: 17px; margin-top: 25px; }
 .chapter-heading { align-items: flex-start; gap: 24px; flex-direction: column; margin-bottom: 34px; }
 .chapter-intro { font-size: 17px; }
 .folio-grid, .featured-grid, .page-private-work .folio-grid { grid-template-columns: 1fr; gap: 42px; }
 .folio-art, .featured-grid .folio-art, .page-private-work .folio-art { aspect-ratio: 1.5; }
 .folio-card h3, .featured-grid h3, .page-private-work .folio-card h3 { font-size: clamp(26px,2.5vw,36px); }
 .folio-meta { margin-top: 21px; gap: 16px; font-size: 14px; }
 .folio-open { width: 40px; height: 40px; right: 14px; bottom: 14px; font-size: 21px; }
 .work-filters { gap: 4px 20px; margin-bottom: 30px; }
 .work-filters button { font-size: 14px; }
 .leadership-feature, .mentor-invitation { grid-template-columns: 1fr; gap: 38px; }
 .leadership-title > p:not(.eyebrow), .mentor-invitation > div > p:not(.eyebrow) { font-size: 17px; }
 .leadership-points article:first-child { border: 0; padding-top: 25px; }
 .leadership-points h3 { font-size: 24px; }
 .leadership-points article { gap: 20px; }
 .leadership-endorsement { gap: 24px; padding: 28px 24px; }
 .leadership-endorsement blockquote { font-size: 24px; }
 .product-feature { padding-block: 55px; }
 .product-feature .chapter-heading { margin-bottom: 40px; }
 .product-feature .chapter-heading h2 { font-size: 32px; }
 .mentor-preview blockquote { font-size: 23px; }
 .closing-section { padding-block: 60px 40px; }
 .closing-composition { grid-template-columns: 1fr; gap: 44px; }
 .closing-section h2 { font-size: clamp(35px,8.2vw,48px); }
 .closing-actions { gap: 12px 24px; margin-top: 28px; }
 .closing-intro { font-size: 15px; }
 .practice-bridge { justify-self: start; gap: 16px; max-width: 400px; }
 .practice-bridge .text-link { margin: 0; }
 .about-introduction { padding-block: var(--opening-space) 44px; }
 .about-heading { margin-bottom: 38px; }
 .portfolio-page .about-heading h1 {  }
 .about-person { grid-template-columns: 1fr; gap: 34px; }
 .about-person figure { width: 210px; }
 .about-person .about-portrait { height: 246px; }
 .about-story .about-statement { font-size: 26px; }
 .about-story > p { font-size: 16px; }
 .about-story .actions { gap: 23px; }
 .about-chapters { gap: 18px 23px; padding-block: 22px; }
 .about-chapters > span { width: 100%; }
 .about-chapters a { font-size: 15px; }
 .leadership-detail .chapter-heading { margin-bottom: 40px; }
 .leadership-detail .chapter-intro { font-size: 17px; margin-top: 20px; }
 .leadership-evidence { gap: 48px; }
 .leadership-story { grid-template-columns: 1fr; gap: 24px; }
 .leadership-story-copy { padding: 0; }
 .leadership-theme { margin-bottom: 16px; }
 .leadership-evidence h3 { font-size: 28px; }
 .leadership-story-copy > p:not(.leadership-theme) { font-size: 17px; }
 .leadership-story-example { margin-top: 24px; }
 .leadership-feedback { padding: 28px 24px; gap: 20px; }
 .leadership-feedback blockquote p { font-size: 21px; }
 .process-chapter { padding-block: 65px 48px; }
 .career-entry { grid-template-columns: 1fr; gap: 20px; padding-block: 28px; }
 .career-entry h3 { font-size: 25px; }
 .career-entry h4 { font-size: 16px; }
 .career-entry p { font-size: 15px; }
 .quote-stage { padding-block: 62px; }
 .quote-stage .work-feedback-quote blockquote p { font-size: 28px; line-height: 1.35; }
 .quote-bottom { flex-direction: column-reverse; align-items: flex-start; margin-top: 32px; }
 .mentoring-chapter { padding-block: 65px; }
 .mentoring-main { grid-template-columns: 1fr; gap: 25px; }
 .mentoring-main > div:last-child { padding-top: 0; }
 .mentoring-main p:not(.eyebrow) { font-size: 17px; }
 .mentoring-main .actions { gap: 22px; }
 .mentoring-chapter .recommendations { margin-top: 50px; }
 .mentoring-chapter .recommendations h2 { font-size: 27px; padding-right: 80px; }
 .mentoring-chapter .recommendation-track { grid-auto-columns: 88%; gap: 18px; }
 .mentoring-chapter .recommendation-card { padding: 24px; }
 .portfolio-page .book-grid { gap: 28px 18px; }
 .mentor-offers { grid-template-columns: 1fr; gap: 32px; padding-bottom: 60px; }
 .mentor-offers h2 { font-size: 28px; margin-block: 18px; }
 .session-preparation { padding-block: 40px 60px; }
 .session-preparation h2 { font-size: 33px; }
 .session-preparation > p:not(.eyebrow) { font-size: 17px; }
 .page-mentorship .recommendations { margin-top: 0; }
 .preview-opening h1 {  }
 .preview-opening .intro { font-size: 17px; }
 .preview-summary { grid-template-columns: 1fr; gap: 24px; margin-top: 30px; }
 .preview-opening > .text-link { margin-bottom: 34px; }
 .portfolio-page .public-cover img { aspect-ratio: 1.5; }
 .preview-story { grid-template-columns: 1fr; gap: 48px; }
 .preview-story .preview-lead { font-size: 18px; }
 .invitation-panel { padding: 28px; }
 .invitation-panel h2 { font-size: 35px; }
 .contact-opening { padding-block: var(--opening-space) 55px; }
 .contact-opening h1 {  }
 .contact-invitation { margin-top: 30px; }
 .contact-invitation .actions { align-items: flex-start; gap: 24px; }
 .contact-paths { grid-template-columns: 1fr; gap: 14px; padding-block: 0 65px; }
 .contact-paths h2 { font-size: 26px; }
 .private-context { grid-template-columns: 1fr; padding-block: 54px 65px; }
 .page-case .case-intro { padding-block: 32px; }
 .page-case .case-hero-grid, .case-lead-layout { grid-template-columns: 1fr; gap: 34px; margin-block: 32px; }
 .case-lead-layout .case-facts { grid-template-columns: 1fr 1fr; gap: 24px; border: 0; padding: 0; }
 .page-case .case-intro h1, .case-editorial .case-lead-layout h1 {  }
 .page-case .case-intro .intro { font-size: 17px; margin-top: 24px; }
 .page-case .case-role-line { margin-top: 24px; }
 .page-case .case-hero-grid .case-figure { margin: 0; }
 .page-case .case-section { padding-block: 65px; }
 .page-case .case-section-head { grid-template-columns: 1fr; gap: 25px; }
 .page-case .case-section-head h2 { font-size: 33px; }
 .page-case .case-prose > p { font-size: 17px; }
 .page-case .case-contents-wrap { top: 72px; }
 .page-case .case-figure { margin-top: 34px; }
 .page-case .case-figure figcaption { gap: 15px; }
 .page-case .case-pair, .page-case .case-decisions, .page-case .case-results { gap: 28px; }
 .page-case .case-next { align-items: flex-start; flex-direction: column; }
 .page-case .case-next h2 { font-size: 29px; }
 .page-case .case-deep-dive { padding-inline: 18px; }
 .page-case .case-deep-dive > summary { font-size: 16px; }
 .design-tension { padding-left: 23px; margin-top: 36px; }
 .design-tension p { font-size: 25px; }
 .case-editorial .case-decision-record > div { grid-template-columns: 1fr; gap: 14px; }
 .case-editorial .case-decision-record h3 { font-size: 24px; }
 .case-editorial .case-results h3 { font-size: 32px; }
}
@media (prefers-reduced-motion: reduce) {
 .portfolio-page *, .portfolio-page *::before, .portfolio-page *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
 .folio-link:hover .folio-art img, .text-link:hover .cta-icon { transform: none !important; }
 .logo-track { animation: none !important; transform: none !important; }
}

@media (max-width: 1000px) { .decised-banner { gap: 45px; } }
@media (max-width: 700px) {
 .decised-banner { grid-template-columns: 1fr; gap: 40px; padding-top: 0; }
 .decised-identity :is(h2,h3) { font-size: 54px; }
 .decised-proposition { font-size: 28px; }
 .product-feature { padding-block: 54px; }
 .product-feature .chapter-heading { margin-bottom: 32px; }
 .page-case .case-section-head { row-gap: 24px; }
 .page-case .case-heading-title > .eyebrow { grid-row: 1; }
 .page-case .case-heading-title > h2 { grid-column: 1; grid-row: 2; }
 .page-case .case-section-head > .case-prose { grid-column: 1; grid-row: 3; }
 .quote-bottom { align-items: flex-start; }
 .quote-bottom > p { max-width: 38ch; }
}

.decised-banner > .product-status { grid-column: 1/-1; margin: 0; }
.quote-heading h2.eyebrow { font-size: 12px; line-height: 1.6; letter-spacing: .14em; margin: 0; font-weight: 500; }

.page-case .case-figure figcaption button { min-height: 44px; display: inline-flex; align-items: center; gap: 6px; padding: 8px 6px; margin-top: -8px; }

.case-lightbox[open] { animation: viewer-arrive 260ms cubic-bezier(.16,1,.3,1); }
.case-lightbox[open]::backdrop { animation: veil-arrive 220ms ease-out; }
@keyframes viewer-arrive { from { opacity: 0; transform: translateY(12px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes veil-arrive { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
 .case-lightbox[open], .case-lightbox[open]::backdrop { animation: none !important; transform: none !important; clip-path: none !important; }
}

/* Studio refinements: deliberate hierarchy, functional colour and connected stages. */
.portfolio-page .lab-live-feature h2 { font-size: clamp(72px,10vw,144px); }
.lab-live-feature { padding: clamp(32px,4.5vw,64px); }
.lab-resource-copy { max-width: 820px; }
.lab-community-resource { padding-block: 80px 16px; }
.work-filters { gap: 8px; padding: 0; }
.work-filters button { font-size: 15px; padding: 12px 18px; border-radius: 999px; color: #595960; transition: background-color .2s,color .2s; }
.work-filters button[aria-pressed="true"] { background: var(--ink); color: #fff; font-weight: 400; }
.work-filters button:hover { background: var(--quiet); color: var(--ink); text-decoration: none; }
.work-filters button[aria-pressed="true"]:hover { background: #38383c; color: #fff; }
.about-chapters a { padding-block: 10px; }
@media (max-width: 1100px) and (min-width: 701px) {
 .portfolio-page .hero { column-gap: 48px; }
}
@media (max-width: 700px) {
 .portfolio-page .hero { grid-template-columns: 1fr; padding-block: 44px 40px; row-gap: 30px; }
 .portfolio-page .hero h1 {  line-height: 1.06; letter-spacing: -.026em; }
 .page-private-work .folio-grid { grid-template-columns: 1fr; row-gap: 48px; }
 .portfolio-page .lab-live-feature h2 { font-size: clamp(64px,16vw,100px); }
 .lab-live-feature { padding: 32px 24px; }
 .work-filters { gap: 4px; margin-bottom: 32px; }
 .work-filters button { font-size: 14px; padding: 12px 14px; }
}

.career-list { position: relative; padding-left: 36px; }
.career-list::before { content: ""; position: absolute; left: 5px; top: 40px; bottom: 80px; width: 1px; background: #dedee3; }
.career-entry { position: relative; display: grid; grid-template-columns: 200px 1fr; gap: 48px; padding: 34px 36px; margin-bottom: 16px; background: #f5f5f6; border: 0; border-radius: 12px; }
.career-entry::before { content: ""; position: absolute; left: -35px; top: 42px; width: 9px; height: 9px; border-radius: 50%; background: #94949c; box-shadow: 0 0 0 6px #fff; }
.career-entry:first-child::before { background: var(--ink); }
.career-company { position: relative; width: 145px; height: 48px; overflow: hidden; }
.career-company img { position: absolute; width: var(--mark-width); max-width: none; height: auto; left: var(--mark-left); top: var(--mark-top); }
.career-company[data-company="hsbc"] { --mark-width: 412px; --mark-left: -148px; --mark-top: -35px; }
.career-company[data-company="google"] { --mark-width: 318px; --mark-left: -99px; --mark-top: -21px; }
.career-company[data-company="ntt-data"] { --mark-width: 286px; --mark-left: -76px; --mark-top: -17px; }
.career-company[data-company="ubs"] { --mark-width: 279px; --mark-left: -85px; --mark-top: -16px; }
.career-entry h4 { font-size: 21px; font-weight: 400; line-height: 1.25; margin: 0 0 14px; letter-spacing: -.014em; }
.career-entry p { font-size: 16px; line-height: 1.65; color: #626268; max-width: 650px; }
.career-entry .career-date { font-size: 14px; margin-top: 14px; }
.career-entry .text-link { margin-top: 18px; }
.career-list .earlier-experience { margin-top: 24px; }
@media (max-width: 1000px) {
 .career-entry { grid-template-columns: 160px 1fr; gap: 32px; padding-inline: 28px; }
}
@media (max-width: 700px) {
 .career-list { padding-left: 24px; }
 .career-entry { grid-template-columns: 1fr; gap: 24px; padding: 28px 24px; }
 .career-entry::before { left: -23px; }
 .career-entry > div:first-child { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
 .career-entry .career-date { margin: 0; }
 .career-entry h4 { font-size: 20px; }
 .career-company { flex: 0 0 145px; }
}


/* The mentorship carousel is intentionally smaller than colleague perspectives. */
.mentor-carousel { background: #f5f5f6; border-radius: 14px; padding: 30px 32px 22px; margin-top: 32px; }
.mentor-quote-label { color: #68686f; font-size: 14px; line-height: 1.5; margin-bottom: 24px; }
.mentor-carousel[data-enhanced] .mentor-slides { display: grid; }
.mentor-carousel .mentor-slide { display: flex; flex-direction: column; justify-content: space-between; margin: 0 0 30px; }
.mentor-carousel[data-enhanced] .mentor-slide { grid-area: 1/1; margin: 0; }
.mentor-carousel blockquote { margin: 0; font-size: clamp(22px,2vw,27px); line-height: 1.35; letter-spacing: -.018em; max-width: none; }
.mentor-carousel figcaption { margin-top: 28px; font-size: 15px; }
.mentor-carousel small { font-size: 13px; line-height: 1.5; }
.mentor-carousel-controls { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 24px; }
.mentor-carousel-controls[hidden] { display: none; }
.mentor-carousel-controls button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; height: 44px; min-width: 44px; border: 0; border-radius: 50%; background: transparent; color: #424249; cursor: pointer; font: inherit; font-size: 19px; transition: background .2s; }
.mentor-carousel-controls button:hover { background: #e5e5e9; color: #202022; }
.mentor-carousel-controls [data-mentor-toggle] { border-radius: 8px; padding-inline: 10px; margin-left: -10px; font-size: 14px; }
.mentor-carousel-nav { display: flex; align-items: center; gap: 8px; }
.mentor-carousel-nav > span { color: #717179; font-size: 13px; min-width: 36px; text-align: center; font-variant-numeric: tabular-nums; }


@media (max-width: 450px) {
 .mentor-carousel { padding: 26px 22px 18px; }
 .mentor-carousel small { font-size: 13px; }
}

.mentor-carousel-controls button[hidden] { display: none; }







/* Page titles share one size token, including case studies and utility pages. */
:root { --page-title-size: clamp(38px, 4.4vw, 60px); --page-title-leading: 1.08; }
.portfolio-page h1.page-title { font-size: var(--page-title-size); line-height: var(--page-title-leading); font-weight: 400; letter-spacing: -.026em; }
.portfolio-page h1.page-title :is(.brand-phrase,.brand-display) { font-size: 1.02em; line-height: inherit; }
/* Compact, FigJam-inspired notes. The introduction remains the primary focus. */
.thinking-notes { width: 100%; max-width: 396px; min-width: 0; align-self: center; justify-self: center; padding: 4px 12px 0; }
.thinking-notes-panels { position: relative; isolation: isolate; }
.thinking-notes[data-enhanced="true"] .thinking-notes-panels { display: grid; }
.thinking-notes[data-enhanced="true"] .thinking-notes-panels::before,
.thinking-notes[data-enhanced="true"] .thinking-notes-panels::after { content: ""; position: absolute; z-index: -1; border-radius: 1px; }
.thinking-notes[data-enhanced="true"] .thinking-notes-panels::before { inset: 12px -7px -10px; background: #f5f5f0; box-shadow: 0 2px 3px #20202206; }
.thinking-notes[data-enhanced="true"] .thinking-notes-panels::after { inset: 6px -3px -5px; background: #edf1c4; }
.thinking-note { min-width: 0; min-height: 330px; display: flex; flex-direction: column; gap: 16px; margin: 0 0 24px; padding: 24px; color: #202022; background: var(--accent); border: 0; border-radius: 1px; box-shadow: 0 3px 7px #20202212, inset 0 12px 0 #ffffff20; transform-origin: 50% 10%; }
.thinking-notes[data-enhanced="true"] .thinking-note { grid-area: 1/1; margin: 0; }
.thinking-note-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.thinking-note-top p { display: flex; gap: 12px; align-items: center; margin: 0; font-size: 14px; line-height: 1.4; color: #454a29; }
.thinking-note-top p > span { font-size: 12px; color: #686d45; font-variant-numeric: tabular-nums; }
.thinking-note-top img { display: block; width: 28px; height: 28px; flex-shrink: 0; }
.thinking-notes .thinking-note-question { font-size: 26px; line-height: 1.18; letter-spacing: -.018em; font-weight: 400; margin: 0; max-width: none; }
.thinking-note-todos { display: grid; gap: 0; margin-top: 0; }
.thinking-note-todo { display: flex; align-items: flex-start; gap: 10px; padding: 8px 0; min-height: 44px; font-size: 16px; line-height: 1.45; cursor: pointer; }
.thinking-note-todo input { width: 18px; height: 18px; flex: 0 0 18px; margin: 3px 0 0; accent-color: #202022; cursor: pointer; }
.thinking-note-todo span { transition: color .2s; }
.thinking-note-todo input:checked + span { text-decoration: line-through; text-decoration-thickness: 1px; color: #616544; }
.thinking-note-todo input:focus-visible { outline: 2px solid #202022; outline-offset: 4px; }
.thinking-note-controls { display: flex; width: fit-content; max-width: 100%; align-items: center; gap: 2px; margin: 30px auto 0; padding: 5px; border: 1px solid #e7e7eb; border-radius: 12px; background: #fff; box-shadow: 0 4px 16px #20202208; }
.thinking-note-controls[hidden] { display: none; }
.thinking-note-controls button { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; min-width: 44px; height: 44px; padding: 10px; color: #202022; font: inherit; font-size: 14px; font-weight: 400; border: 0; border-radius: 7px; background: transparent; cursor: pointer; transition: color .2s,background .2s; }
.thinking-note-controls button:hover { background: #f5f5f6; }
.thinking-note-controls button:active { background: #e9e9ed; }
.thinking-note-controls button[aria-disabled="true"] { color: #96969e; cursor: default; background: transparent; }
.thinking-note-controls button:focus-visible { outline: 2px solid #202022; outline-offset: 1px; }
.thinking-note-count { min-width: 57px; text-align: center; font-size: 13px; font-variant-numeric: tabular-nums; color: #64646c; }
.thinking-note-controls .thinking-note-reset { margin-left: 6px; padding-inline: 12px; }
@media (max-width: 700px) {
 .thinking-notes { max-width: 360px; }
 .thinking-note { padding: 22px; }
 .thinking-notes .thinking-note-question { font-size: 25px; }
}
@media (max-width: 360px) {
 .thinking-notes { padding-inline: 7px; }
 .thinking-note { padding: 20px 18px; }
 .thinking-notes .thinking-note-question { font-size: 24px; }
 .thinking-note-controls { padding: 3px; gap: 0; }
 .thinking-note-controls .thinking-note-reset { margin-left: 2px; padding-inline: 10px; }
}

[data-enhanced="true"] .process-panels { display: grid; }
[data-enhanced="true"] .process-panel { grid-area: 1/1; min-width: 0; }
/* A continuous process landscape. The linework itself expresses exploration and focus. */
.process-studio { --process-active: #f2ff49; padding: 40px 44px 30px; background: #202022; border-radius: 18px; color: #fff; }
.process-landscape { padding: 4px 0 32px; }
.process-territories { display: grid; grid-template-columns: 1fr 1fr; text-align: center; font-size: 15px; color: #c1c1c7; gap: 28px; }
.process-routes { width: 100%; height: auto; display: block; overflow: visible; margin-block: 12px 8px; }
.process-axis { stroke: #73737b; stroke-width: 1; stroke-dasharray: 2 8; }
.process-current { stroke: #92929c; stroke-width: 1.3; opacity: .55; transition: opacity .35s,stroke .35s; cursor: pointer; }
.process-current path { vector-effect: non-scaling-stroke; }
.process-current[data-preview] { stroke: #c8c8d1; opacity: .7; }
.process-current[data-active] { stroke: var(--process-active); opacity: .95; }
.process-junctions { fill: #202022; stroke: #dedee4; stroke-width: 1.5; }
.process-checkpoints { display: flex; justify-content: space-between; gap: 20px; font-size: 13px; color: #a8a8b0; padding-inline: 2%; }
.process-checkpoints > span:nth-child(2) { text-align: center; }
.process-checkpoints > span:last-child { text-align: right; }
.process-controls { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; padding-bottom: 32px; }
.process-controls button { display: grid; grid-template-columns: auto 1fr auto; align-items: start; gap: 10px; min-width: 0; padding: 20px 0 18px; border: 0; border-top: 1px solid #56565d; border-radius: 0; background: transparent; color: #c4c4cb; font: inherit; font-size: 20px; line-height: 1.2; text-align: left; cursor: pointer; transition: border-color .25s,color .25s; }
.process-controls button:hover { color: #fff; border-color: #d8d8df; }
.process-controls button[aria-pressed="true"] { color: #fff; border-top-color: var(--process-active); }
.process-control-number { font-size: 12px; color: #95959e; margin-top: 4px; }
.process-controls small { display: block; margin-top: 9px; font-size: 13px; color: #aaaab2; line-height: 1.45; }
.process-control-arrow { font-size: 23px; line-height: 1; color: #898993; }
[aria-pressed="true"] .process-control-number, [aria-pressed="true"] .process-control-arrow { color: var(--process-active); }
.process-controls button:focus-visible { outline: 2px solid var(--process-active); outline-offset: 5px; }
.process-panels { border-top: 1px solid #45454b; padding-top: 32px; }
.process-panel { display: grid; grid-template-columns: 1fr 1.2fr; gap: 64px; padding-bottom: 30px; }
.process-step-name { font-size: 13px; color: #a6a6ae; margin: 0 0 13px; }
.process-panel h3 { font-size: clamp(27px,2.5vw,34px); line-height: 1.13; font-weight: 400; letter-spacing: -.022em; max-width: 390px; }
.process-description { font-size: 17px; line-height: 1.65; color: #cdccd2; }
.process-methods { font-size: 14px; line-height: 1.6; color: #a6a6af; margin-top: 18px; }
.process-output { font-size: 16px; line-height: 1.5; color: #f1f1f3; margin-top: 24px; }
.process-output > span { display: block; font-size: 12px; line-height: 1.5; color: #a6a6af; margin-bottom: 3px; }
.process-learning { display: flex; align-items: center; gap: 14px; font-size: 14px; line-height: 1.5; color: #ababB3; }
.process-learning > span { color: #d4d4da; font-size: 23px; }
.process-ai-note { display: flex; align-items: start; gap: 16px; font-size: 15px; line-height: 1.65; color: #6a6a71; max-width: 830px; margin: 28px 0 0; }
.process-ai-note > span:first-child { color: #74747c; font-size: 22px; flex-shrink: 0; }
.process-ai-note strong { font-weight: 400; color: #333339; }
@media (max-width: 1100px) {

 .process-studio { padding-inline: 32px; }
 .process-control-arrow { display: none; }
 .process-controls button { grid-template-columns: auto 1fr; font-size: 19px; }
}
@media (max-width: 700px) {
 .process-studio { padding: 30px 22px 26px; }
 .process-territories { font-size: 13px; gap: 25px; }
 .process-routes { margin-block: 26px 20px; }
 .process-checkpoints { gap: 12px; font-size: 11px; }
 .process-checkpoints > span { flex: 1; }
 .process-landscape { padding-bottom: 26px; }
 .process-controls { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 22px; padding-bottom: 24px; }
 .process-controls button { font-size: 18px; padding-block: 16px; gap: 8px; }
 .process-control-number { font-size: 11px; }
 .process-controls small { font-size: 12px; }
 .process-panel { grid-template-columns: 1fr; gap: 22px; }
 .process-panel h3 { font-size: 28px; }
 .process-description { font-size: 16px; }
 .process-methods { font-size: 13px; }
 .process-learning { align-items: start; font-size: 13px; }
 .process-ai-note { font-size: 14px; }
}
@media (max-width: 360px) {
 .process-studio { padding-inline: 16px; }
 .process-controls { gap: 8px 16px; }
 .process-controls button { font-size: 16px; }
 .process-control-number { display: none; }
 .process-controls button { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
 .process-current,.process-controls button { transition: none; }
}

/* Review refinements: clear audience routes and honest public-preview labels. */
.audience-routes { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-top: 20px; }
.audience-routes > a { display: grid; gap: 6px; padding: 22px 24px; background: var(--quiet); border-radius: 10px; transition: background-color .2s; }
.audience-routes > a > span:first-child { font-size: 18px; line-height: 1.4; }
.audience-routes > a > span:last-child { display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 16px; line-height: 1.5; color: #626268; }
.audience-routes > a:hover { background: #ebebee; }
.audience-routes > a:hover > span:first-child { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.audience-routes > a:focus-visible { outline-offset: 4px; }
.page-home .hero-copy { grid-column: 1; grid-row: 1; }
.page-home .thinking-notes { grid-column: 2; grid-row: 1; }
.page-home .audience-routes { grid-row: 2; }
.portfolio-page .folio-card > a > .folio-access { font-size: 15px; line-height: 1.5; margin-top: 16px; color: #56565c; }
.about-story .evidence-principle { color: var(--ink); }
.experience-context { color: #626268; font-size: 17px; line-height: 1.6; max-width: 640px; margin: -24px 0 40px; }
.portfolio-page #roles { scroll-margin-top: 120px; }
.contact-invitation .eyebrow { font-size: 13px; color: var(--ink); margin: 0 0 14px; }
@media (max-width: 800px) {
 .page-home .thinking-notes { grid-column: 1; grid-row: 3; }
 .audience-routes { grid-template-columns: 1fr; gap: 10px; margin-top: 0; }
 .audience-routes > a { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; }
 .audience-routes > a > span:first-child { font-size: 16px; }
 .audience-routes > a > span:last-child { font-size: 15px; }
}
@media (max-width: 700px) {
 .experience-context { margin-top: 0; font-size: 16px; }
}
@media (max-width: 420px) {
 .audience-routes > a { display: grid; grid-template-columns: 1fr; gap: 4px; }
}