/* Shared responsive rhythm for the homepage and insights. CSS pixels are used
   so OS scaling, browser zoom and high-density displays follow the same rules. */
:root {
  --page-gutter: clamp(24px, 5.5vw, 128px);
  --content-max: 1600px;
  --site-nav-height: 80px;
  --section-space: clamp(64px, 6vw, 120px);
}
html { scroll-padding-top: calc(var(--site-nav-height) + 16px); }
body { min-width: 0; }
.wrap { width: min(var(--content-max), calc(100% - var(--page-gutter) * 2)); }
.wrap > *, .trust-heading > *, .team-composition > *, .chapter-content > *,
.fde-heading > *, .office-layout > *, .insights-intro > * { min-width: 0; }
h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; overflow-wrap: break-word; }
img { max-width: 100%; }
.nav-shell nav { width: min(1760px, calc(100% - var(--page-gutter) * 2)); height: var(--site-nav-height); gap: 24px; }
.nav-shell .brand { flex-shrink: 0; }
.nav-shell .nav-links { gap: clamp(18px, 1.55vw, 32px) !important; }
.nav-shell .nav-links a { font-size: clamp(15px, .95vw, 18px) !important; }
.nav-shell .menu { flex: 0 0 44px; }
.hero { height: calc(100svh - var(--site-nav-height)); min-height: 560px; max-height: 1280px; }
.hero .hero-copy { padding: clamp(48px, 6vh, 104px) var(--page-gutter) 0; }
.hero h1 { font-size: clamp(40px, 5.2vw, 112px); line-height: 1.3; letter-spacing: .035em; }
.hero .hero-bottom { left: var(--page-gutter); right: var(--page-gutter); bottom: clamp(28px, 4vh, 60px); }
.hero .hero-bottom p { font-size: clamp(16px, 1.4vw, 25px); }
.clients-section, .team-section, .history-section, .offices-section, .ai-graph-section { padding-block: var(--section-space); }
.trust-heading h2, .section-title { font-size: clamp(30px, 3.25vw, 60px); line-height: 1.32; }
.trust-heading { gap: clamp(24px, 6vw, 110px); }
.trust-heading > p { font-size: clamp(17px, 1.2vw, 22px); }
.client-filters { flex-wrap: wrap; gap: 6px clamp(18px, 2vw, 36px); }
.client-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.client-mark { height: clamp(108px, 8.4vw, 150px); padding-inline: clamp(16px, 1.5vw, 28px); }
.client-mark svg { max-width: 156px; height: clamp(58px, 4.5vw, 72px); }
.client-mark span { opacity: 0; }
.client-mark:hover span { opacity: 1; }
.team-composition { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 7vw, 120px); }
.team-roles h3 { font-size: clamp(24px, 2vw, 34px); }
.team-roles p { font-size: clamp(17px, 1.2vw, 21px); }
.consulting-stack .consulting-panel, .fde-stack .fde-panel { min-height: calc(100svh - var(--site-nav-height)); scroll-margin-top: var(--site-nav-height); }
.consulting-stack .chapter-content { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(32px, 7vw, 120px); }
.consulting-stack .chapter-content h2 { font-size: clamp(34px, 4.1vw, 76px); line-height: 1.24; }
.fde-heading { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(28px, 5vw, 86px); }
.fde-heading h2 { font-size: clamp(32px, 3.4vw, 62px); line-height: 1.28; }
.fde-scenarios article { min-width: 0; }
.consulting-stack .consulting-panel.is-too-tall, .fde-stack .fde-panel.is-too-tall { position: relative; top: auto; }
.footer-brand > .footer-statement { font-size: clamp(16px, 1.7vw, 27px); gap: .25em; }
.footer-qrs { flex-wrap: wrap; }
.footer-hotline a { white-space: nowrap; }

/* Deliverable sample: copy at left, report at right. */
.samples {
  display: grid;
  grid-template-columns: minmax(270px, 420px) minmax(0, 1fr);
  column-gap: clamp(40px, 5.5vw, 96px);
  padding-inline: max(var(--page-gutter), calc((100vw - var(--content-max)) / 2));
  position: relative;
}
.samples > .center,
.samples > .sample-controls { grid-column: 1 / 3; width: 100%; }
.samples > .sample-controls { margin-inline: 0; }
.samples > .sample-stage {
  grid-column: 2;
  grid-row: 3;
  align-self: center;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  position: relative;
}
.samples .report { width: 100%; height: auto; }
.samples > .sample-bottom {
  grid-column: 1;
  grid-row: 3;
  align-self: stretch;
  width: auto;
  margin: 0;
  padding-block: clamp(18px, 2.7vw, 48px) clamp(4px, 1vw, 16px);
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr;
  gap: clamp(28px, 3vw, 48px);
}
.samples > .sample-bottom > div:last-child {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.samples .sample-bottom h3 {
  margin-bottom: 22px;
  font-size: clamp(28px, 2.35vw, 42px);
  font-weight: 400;
  line-height: 1.38;
  letter-spacing: -.02em;
}
.samples .sample-bottom p { font-size: clamp(16px, 1.12vw, 19px); }
.samples #sample-action {
  padding-top: clamp(20px, 2vw, 32px);
  border-top: 1px solid var(--line);
  color: var(--ink);
}
.samples #sample-note {
  margin: auto 0 0 !important;
  padding-top: clamp(34px, 5vw, 76px);
  max-width: 36em;
  font-size: 12px !important;
  line-height: 1.75;
  color: #777169;
}
.samples #sample-detail {
  position: absolute;
  right: clamp(18px, 2.2vw, 34px);
  bottom: clamp(18px, 2.2vw, 34px);
  z-index: 2;
  min-height: 42px;
  margin: 0;
  padding: 7px 13px 7px 16px !important;
  border: 1px solid rgba(0,67,105,.16) !important;
  background: rgba(250,249,246,.9) !important;
  color: var(--brand);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.samples #sample-detail:hover { background: rgba(250,249,246,.98) !important; }

/* Widescreen case stage scales as a composition, including adjacent cards. */
.case-gallery { --case-nav-height: var(--site-nav-height); }
.case-gallery.case-cinema .case-scroll-deck { min-height: 0 !important; }
.case-gallery.case-cinema .case-slide {
  inset: 50% auto auto 57% !important;
  width: min(58vw, 1120px) !important;
  height: min(780px, calc(100svh - var(--site-nav-height) - 76px)) !important;
}
.case-gallery.case-cinema .case-sidebar .section-title {
  left: var(--page-gutter);
  max-width: none;
  font-size: clamp(28px, 2.6vw, 54px);
}
.case-gallery.case-cinema .case-slide h3 { font-size: clamp(23px, 1.8vw, 34px) !important; }
.case-gallery.case-cinema .case-story p { font-size: clamp(14px, 1vw, 18px); line-height: 1.7; }
.case-gallery.case-cinema .case-card-copy { padding: clamp(20px, 2vw, 34px) clamp(24px, 2vw, 38px) 56px; }
.case-gallery.case-cinema .case-index { right: max(20px, 2vw); }
@media (min-width: 1200px) and (max-height: 800px) {
  .case-gallery.case-cinema .case-slide h3 { font-size: 23px !important; }
  .case-gallery.case-cinema .case-story p { font-size: 13px; line-height: 1.6; }
  .case-gallery.case-cinema .case-card-copy { padding: 18px 24px 46px; }
}

/* Keep complete cards in document flow when the cinematic stage cannot fit. */
.case-gallery:not(.case-cinema) { padding: var(--section-space) 0 !important; }
.case-gallery:not(.case-cinema) .case-layout { display: block !important; width: min(1120px, calc(100% - var(--page-gutter) * 2)) !important; margin: auto !important; }
.case-gallery:not(.case-cinema) .case-sidebar { position: relative !important; top: auto !important; height: auto; min-height: 0; margin-bottom: 40px !important; }
.case-gallery:not(.case-cinema) .case-sidebar .label,
.case-gallery:not(.case-cinema) .case-sidebar .section-title,
.case-gallery:not(.case-cinema) .case-sidebar .gallery-intro { position: static; opacity: 1; }
.case-gallery:not(.case-cinema) .case-sidebar .section-title { max-width: none; font-size: clamp(28px, 4vw, 44px); margin-top: 22px; }
.case-gallery:not(.case-cinema) .case-sidebar .gallery-intro { max-width: none; margin-top: 22px; }
.case-gallery:not(.case-cinema) .case-index,
.case-gallery:not(.case-cinema) .case-scroll-reading { display: none !important; }
.case-gallery:not(.case-cinema) .case-scroll-runway { height: auto !important; pointer-events: auto; }
.case-gallery:not(.case-cinema) .case-scroll-deck { display: grid !important; gap: 28px; position: static !important; width: 100% !important; height: auto !important; min-height: 0 !important; pointer-events: auto; }
.case-gallery:not(.case-cinema) .case-slide { display: block; position: relative !important; inset: auto !important; width: 100% !important; height: auto !important; translate: none !important; transform: none !important; visibility: visible !important; opacity: 1 !important; pointer-events: auto !important; }
.case-gallery:not(.case-cinema) .case-card-surface { height: auto; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); grid-template-rows: auto; clip-path: polygon(0 0,100% 0,100% calc(100% - 44px),calc(100% - 44px) 100%,0 100%); }
.case-gallery:not(.case-cinema) .case-card-copy { overflow: visible; padding: 24px 24px 50px; }
.case-gallery:not(.case-cinema) .case-story { gap: 8px; }
.case-gallery:not(.case-cinema) .case-visual img { position: absolute; inset: 0; }
.case-gallery:not(.case-cinema) .case-card-arrow { display: grid; width: 36px; height: 36px; right: -2px; bottom: -2px; opacity: 1; transform: none; }
.case-gallery:not(.case-cinema) .case-card-arrow svg { width: 28px; height: 28px; }

/* Editorial cards retain their aspect ratio and readable type at every width. */
.articles-main { padding-block: clamp(28px, 3.3vw, 64px) var(--section-space); }
.insights-intro { padding: clamp(28px, 3.8vw, 64px); gap: 5%; }
.insights-title { container-type: inline-size; }
.insights-title h1 { font-size: clamp(48px, 20cqi, 138px); letter-spacing: -.065em; line-height: 1; }
.article-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 2.2vw, 36px); }
.article-card h2 { font-size: clamp(22px, 1.65vw, 30px); letter-spacing: 0; }
.article-body { padding: clamp(22px, 2vw, 34px); padding-bottom: 38px; }
.articles-toolbar .filters { min-width: 0; }
.article-cover > img { object-fit: cover; }

@media (max-width: 1199px) {
  .client-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .history-track { overflow: visible; margin: 0; padding: 0; }
  .history-track .history-rail { min-width: 0; height: auto; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 32px; margin: 0; border: 0; }
  .history-rail .history-card { position: relative; top: auto; }
  .history-rail .history-year { position: static; display: block; margin-top: 14px; }
  .history-rail .history-stem, .history-rail .history-tick { display: none; }
  .history-event.is-expanded .history-card { transform: none; }
}
@media (max-width: 1150px) {
  .nav-shell .nav-links { top: var(--site-nav-height); max-height: calc(100dvh - var(--site-nav-height)); overflow-y: auto; gap: 0 !important; padding: 12px var(--page-gutter) 20px !important; }
  .nav-shell .nav-follow-indicator { display: none; }
}
@media (max-width: 1000px) {
  .trust-heading, .team-composition, .ai-graph-heading { grid-template-columns: 1fr; gap: 28px; }
  .trust-heading > p { max-width: 680px; }
  .consulting-stack .chapter-content, .fde-heading { grid-template-columns: 1fr; gap: 28px; }
  .consulting-stack .chapter-content { margin-top: 38px; }
  .fde-scenarios { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .consulting-stack .consulting-panel, .fde-stack .fde-panel { position: relative; top: auto; min-height: 0; padding-block: 64px; }
  .insights-intro { grid-template-columns: 1fr; gap: 30px; min-height: 0; }
  .insights-title h1 { font-size: clamp(48px, 17cqi, 118px); }
  .samples {
    grid-template-columns: minmax(230px, .72fr) minmax(0, 1.28fr);
    column-gap: 34px;
    padding-inline: var(--page-gutter);
  }
  .samples > .sample-bottom { padding-block: 8px 2px; gap: 26px; }
  .samples #sample-note { padding-top: 30px; }
}
@media (max-width: 760px) {
  :root { --page-gutter: 28px; --site-nav-height: 65px; }
  .client-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .client-mark { padding-inline: 12px; }
  .nav-shell .brand img { width: 160px; }
  .hero { min-height: 560px; }
  .hero h1 { font-size: clamp(34px, 6.4vw, 48px); }
  .hero .mobile-break { display: none; }
  .hero .hero-bottom { gap: 18px; align-items: end; }
  .hero .hero-bottom p { font-size: 16px; }
  .office-layout { grid-template-columns: 1fr; }
  .office-map-wrap.amap-map-wrap, #office-region-map { min-height: 360px; height: clamp(360px, 68vw, 500px); }
  .articles-toolbar { align-items: flex-start; flex-direction: column; gap: 12px; }
  .articles-toolbar .filters { max-width: 100%; gap: 22px; }
  .article-grid { grid-template-columns: 1fr; gap: 30px; }
  .article-card h2 { font-size: 23px; }
  .article-body { padding: 24px 24px 36px; }
  .case-gallery:not(.case-cinema) .case-card-surface { grid-template-columns: 1fr; grid-template-rows: auto auto; }
  .case-gallery:not(.case-cinema) .case-visual { aspect-ratio: 1.65; }
  .case-gallery:not(.case-cinema) .case-slide h3 { font-size: 25px !important; }
  .case-gallery:not(.case-cinema) .case-story p { font-size: 16px; }
  .case-gallery:not(.case-cinema) .case-card-copy { padding: 24px 20px 50px; }
  .samples {
    display: block;
    padding-inline: var(--page-gutter);
  }
  .samples > .center,
  .samples > .sample-controls,
  .samples > .sample-stage,
  .samples > .sample-bottom { width: 100%; margin-inline: 0; }
  .samples > .sample-controls { margin-bottom: 30px; }
  .samples > .sample-bottom {
    display: flex;
    flex-direction: column;
    gap: 22px;
    padding: 0;
    margin-bottom: 28px;
  }
  .samples > .sample-bottom > div:last-child { display: block; }
  .samples .sample-bottom h3 { font-size: clamp(27px, 7.2vw, 34px); margin-bottom: 18px; }
  .samples .sample-bottom p { font-size: 16px; }
  .samples #sample-action { padding-top: 18px; }
  .samples #sample-note { margin-top: 26px !important; padding-top: 0; }
  .samples > .sample-stage { padding: 0; }
  .samples #sample-detail {
    right: 14px;
    bottom: 14px;
    min-height: 40px;
    font-size: 14px;
  }
}
@media (max-width: 540px) {
  :root { --page-gutter: 24px; }
  .hero h1 { font-size: clamp(32px, 9.2vw, 44px); }
  .hero .mobile-break { display: block; }
  .hero .hero-bottom p { font-size: 14px; }
  .client-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .history-track .history-rail { grid-template-columns: 1fr; gap: 26px; }
  .team-scale { display: block; }
  .team-roles article { gap: 16px; }
  .team-roles h3 { font-size: 24px; }
  .fde-scenarios { grid-template-columns: 1fr; }
  .fde-heading h2, .consulting-stack .chapter-content h2 { font-size: clamp(29px, 7.8vw, 38px); }
  .fde-footerline { display: block; }
  .fde-chips { justify-content: flex-start; margin-top: 14px; }
  .footer-brand > .footer-statement { font-size: clamp(15px, 4.05vw, 20px); }
  footer .foot-note.footer-values { font-size: 12px; letter-spacing: .04em; }
  .footer-qrs { gap: 18px; }
  .footer-qrs .footer-code { width: clamp(118px, 34vw, 140px); height: clamp(118px, 34vw, 140px); }
  .footer-hotline { padding: 22px; }
  .footer-hotline a { font-size: clamp(24px, 7.4vw, 30px); }
  .case-gallery:not(.case-cinema) .case-sidebar .section-title { font-size: clamp(26px, 7.1vw, 36px); }
}
@media (max-height: 649px) and (min-width: 541px) {
  .hero { min-height: 480px; }
  .hero h1 { font-size: clamp(38px, 5vw, 64px); }
  .hero .hero-copy { padding-top: 38px; }
  .consulting-stack .consulting-panel, .fde-stack .fde-panel { position: relative; top: auto; min-height: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .case-card-surface, .case-card-arrow, .case-card-arrow svg { animation: none !important; transition: none !important; }
  .consulting-stack .consulting-panel, .fde-stack .fde-panel { position: relative; top: auto; }
}
