/* Compact information system. Loaded after visual themes. */
:root {
  --font: "Onest", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-main: var(--font);
  --font-menu: "Onest", system-ui, sans-serif;
  --font-menu-label: var(--font);
  --container: min(100% - 40px, 1280px);
  --radius: 6px;
  --radius-lg: 8px;
  --header-offset: 98px;
  --type-caption: 11px;
  --type-label: 12px;
  --type-body-sm: 14px;
  --type-body: 15px;
  --type-body-lg: 16px;
  --type-h6: 16px;
  --type-h5: 18px;
  --type-h4: 21px;
  --type-h3: 24px;
  --type-h2: 32px;
  --type-h1: 42px;
  --line-tight: 1.14;
  --line-body: 1.5;
}

* { letter-spacing: 0 !important; }

html {
  font-size: 100%;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body,
button,
input,
select,
textarea {
  font-family: var(--font);
}

body {
  color: var(--text);
  font-size: var(--type-body);
  font-weight: 400;
  line-height: var(--line-body);
  font-synthesis: none;
}

:where(p, li, dd, figcaption, small) {
  text-wrap: pretty;
  overflow-wrap: break-word;
}

:where(h1, h2, h3, h4, h5, h6, strong, b) {
  text-wrap: balance;
}

:where(strong, b) { font-weight: 650; }

:where(time, .metric-value, .fact-value, .case-filter-group small) {
  font-variant-numeric: tabular-nums;
}

/* Header: two compact rows, readable labels, stable dropdown origin. */
.header-main {
  grid-template-columns: 166px minmax(260px, 1fr) auto auto 38px 38px;
  gap: 9px;
  min-height: 54px;
}

.brand-link img { width: 156px; }

.quick-search input {
  min-height: 38px;
  padding-inline: 13px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
}

.header-incident,
.header-request,
.header-link,
.header-icon-link,
.mobile-menu-button {
  min-height: 38px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 650;
}

.primary-nav {
  gap: clamp(12px, 1.7vw, 22px);
  min-height: 44px;
}

.primary-nav details > summary,
.primary-nav > a {
  min-height: 44px;
  font-family: var(--font-menu);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
}

.primary-nav details > summary::after {
  width: 7px;
  height: 7px;
  border-width: 0 1.5px 1.5px 0;
}

.solution-panel,
.service-panel,
.catalog-panel { top: var(--header-offset); }

.catalog-panel.catalog-panel-main {
  grid-template-columns: minmax(270px, .28fr) minmax(0, .72fr);
  gap: 32px;
  padding-top: 26px;
  padding-bottom: 30px;
}

.catalog-panel h2 {
  font-family: var(--font-menu);
  font-size: 19px;
  font-weight: 600;
  line-height: 1.25;
}

.catalog-panel p {
  max-width: 62ch;
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.55;
}

.catalog-panel-intro > span {
  font-family: var(--font);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0;
}

.catalog-category-card {
  gap: 7px;
  padding: 13px;
  border-radius: 6px;
}

.catalog-route strong {
  font-family: var(--font-menu);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.4;
}

.catalog-route span {
  font-family: var(--font-menu);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.5;
}

.catalog-subroutes a {
  min-height: 25px;
  border-radius: 4px;
  font-family: var(--font-menu);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.4;
}

/* Unified dropdown typography: four levels, one font, restrained weight. */
.flat-solution-panel,
.catalog-panel,
.service-panel,
.nav-dropdown-panel,
.reference-mega-inner {
  font-family: var(--font-menu);
}

.flat-solution-frame {
  padding-top: 16px;
}

.flat-solution-head {
  gap: 10px 14px;
  padding-bottom: 14px;
}

.flat-solution-head h2 {
  font-family: var(--font-menu);
  font-size: 19px;
  font-weight: 600;
  line-height: 1.25;
}

.flat-solution-views {
  gap: 2px;
  padding: 3px;
  border-radius: 7px;
  box-shadow: none;
}

.flat-solution-view,
.flat-solution-view.is-active {
  min-height: 34px;
  padding-inline: 12px;
  border-radius: 5px;
  font-family: var(--font-menu);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.35;
}

.flat-solution-grid {
  min-height: 0;
  padding-top: 16px;
}

.flat-solution-column {
  gap: 14px;
  padding: 0 18px 22px;
}

.flat-solution-column h3,
.rich-dropdown-section h3,
.service-menu-group h3,
.product-solution-panel .solution-menu-rail > span,
.product-solution-panel .solution-pane-head span,
.service-panel-intro span,
.reference-kicker {
  color: var(--muted);
  font-family: var(--font-menu-label);
  font-size: 10px;
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: 0;
  text-transform: uppercase;
}

.flat-solution-links { gap: 10px; }
.flat-solution-link { gap: 3px; }

.flat-solution-link strong,
.solution-menu-link strong,
.service-menu .solution-menu-link strong,
.product-solution-panel .solution-menu-tab strong {
  font-family: var(--font-menu);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.4;
}

.flat-solution-link span,
.solution-menu-link span,
.service-menu .solution-menu-link span,
.product-solution-panel .solution-menu-tab span {
  font-family: var(--font-menu);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.5;
}

.flat-solution-actions {
  gap: 0;
  padding-block: 10px;
}

.flat-solution-actions a {
  min-height: 30px;
  padding-inline: 13px;
  font-family: var(--font-menu);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.4;
}

.flat-solution-actions a:first-child { padding-left: 0; }
.flat-solution-actions a + a { padding-left: 13px; }

.nav-dropdown-panel {
  min-width: 250px;
  padding: 7px;
  border-radius: 6px;
}

.nav-dropdown-panel > a {
  padding: 9px 10px;
  border-radius: 4px;
  font-family: var(--font-menu);
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1.45;
}

.nav-dropdown-rich .rich-dropdown-panel {
  padding: 18px;
  border-radius: 6px;
}

.rich-dropdown-grid { gap: 16px; }

.rich-dropdown-section {
  gap: 9px;
  padding-right: 16px;
}

.rich-dropdown-links { gap: 8px; }

.rich-dropdown-link {
  gap: 3px;
  padding: 0 0 8px;
}

.rich-dropdown-link strong {
  font-family: var(--font-menu);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.4;
}

.rich-dropdown-link span {
  font-family: var(--font-menu);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.5;
}

.nav-dropdown-panel > a.rich-dropdown-cta {
  min-height: 38px;
  margin-top: 12px;
  padding-inline: 14px !important;
  border-radius: 6px !important;
  font-family: var(--font-menu);
  font-size: 12.5px;
  font-weight: 600 !important;
  line-height: 1.4;
}

.service-panel {
  gap: 32px;
  padding-top: 26px;
  padding-bottom: 30px;
}

.service-panel-intro { gap: 11px; }

.service-panel-intro h2,
.product-solution-panel .solution-pane-head h2 {
  font-family: var(--font-menu);
  font-size: 19px;
  font-weight: 600;
  line-height: 1.25;
}

.service-panel-intro p {
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.55;
}

.service-panel-intro a,
.product-solution-panel .solution-menu-overview {
  font-size: 12.5px;
  font-weight: 600;
}

.service-panel-grid { gap: 24px; }
.service-menu-group { gap: 10px; }

.product-solution-panel .solution-menu-tab {
  padding: 10px 11px;
  border-radius: 6px;
}

.reference-mega-inner {
  gap: clamp(28px, 5vw, 68px);
  padding-block: 26px 30px;
}

.reference-mega-column { gap: 14px; }
.reference-mega-column a { font-size: 13.5px; font-weight: 500; line-height: 1.45; }
.reference-mega-lead strong { font-size: 16px; font-weight: 600; line-height: 1.25; }
.reference-mega-lead small { font-size: 11px; font-weight: 400; line-height: 1.5; }

/* First screen: enough context to decide, no oversized typography. */
html[data-view-mode] .page-hero,
html[data-view-mode] .page-home .page-hero,
.page-hero,
.page-home .page-hero {
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, .82fr);
  gap: clamp(24px, 3vw, 40px);
  min-height: 380px;
  max-height: none;
  margin-top: 14px;
  padding: 34px clamp(28px, 3.6vw, 48px);
  border-radius: 8px;
}

html[data-view-mode] .page-home .page-hero,
.page-home .page-hero { min-height: 410px; }

html[data-view-mode] .page-hero h1,
html[data-view-mode] .page-home .page-hero h1,
.page-hero h1,
.page-home .page-hero h1 {
  max-width: 24ch;
  font-size: var(--type-h1);
  font-weight: 700;
  line-height: 1.08;
}

html[data-view-mode] .page-hero p,
.page-hero p {
  max-width: 68ch;
  margin-top: 12px;
  font-size: var(--type-body-lg);
  font-weight: 400;
  line-height: 1.5;
}

.breadcrumbs {
  gap: 6px;
  margin-bottom: 13px;
  font-size: 12px;
  font-weight: 550;
}

.breadcrumbs a::after { margin-left: 6px; }

.hero-chips {
  gap: 6px;
  margin-bottom: 13px;
}

.hero-chips span,
.route-card span,
.direction-card span,
.info-card span,
.partner-card span,
.case-card span {
  padding: 3px 6px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.25;
  text-transform: none;
}

.hero-actions { margin-top: 15px; }

html[data-view-mode] .page-hero-media,
.page-hero-media { border-radius: 8px; }

html[data-view-mode] .page-hero-media img,
.page-hero-media img {
  max-height: 238px;
  aspect-ratio: 16 / 9;
}

/* Sections: one clear heading, one explanatory paragraph, then the choice. */
.content-section,
.page-home .content-section,
.page-partners .content-section {
  padding-block: clamp(30px, 3.5vw, 46px);
}

.content-section + .content-section {
  border-top: 1px solid color-mix(in srgb, var(--line) 78%, transparent);
}

.section-head {
  gap: 7px;
  max-width: 920px;
  margin-bottom: 18px;
}

.section-head h2,
.content-section > h2,
.split-section h2,
.request-form h2,
.cta-band h2 {
  max-width: 32ch;
  font-size: var(--type-h2);
  font-weight: 700;
  line-height: 1.15;
}

.section-head p,
.content-section > p,
.split-section p,
.cta-band p {
  max-width: 74ch;
  font-size: var(--type-body);
  font-weight: 400;
  line-height: 1.52;
}

.section-kicker,
.eyebrow,
.catalog-panel-intro > span,
.career-entry-route > span,
.career-role-groups h3,
.career-document-table span,
.network-partner-row span,
.network-article-link span {
  font-family: var(--font);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0;
  text-transform: none;
}

.section-kicker {
  margin-bottom: 7px;
  padding: 3px 6px;
  border-radius: 4px;
}

/* Repeated choices: compact enough to compare without losing descriptions. */
.route-grid,
.direction-grid,
.solution-axis-grid,
.info-grid,
.partner-grid,
.case-mini-grid,
.contact-routes { gap: 10px; }

.solution-axis-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.route-card,
.direction-card,
.solution-axis-card,
.info-card,
.partner-card,
.case-mini,
.site-map-item,
.process-step,
.proof-tile,
.case-card,
.partner-directory-card,
.partner-profile-card,
.partner-material-card {
  gap: 8px;
  min-height: 132px;
  padding: 15px;
  border-radius: 6px;
  box-shadow: 0 1px 0 rgba(15, 23, 42, .04);
}

.solution-axis-card {
  grid-template-columns: 36px minmax(0, 1fr);
  min-height: 142px;
}

.ui-pictogram {
  width: 36px;
  height: 36px;
  border-radius: 5px;
}

.ui-pictogram-symbol {
  width: 20px;
  height: 20px;
}

.route-card strong,
.solution-axis-card strong,
.direction-card h3,
.info-card h3,
.partner-card h3,
.case-mini strong,
.site-map-item strong,
.process-step h3,
.case-card h3,
.proof-tile strong,
.partner-directory-card h3 {
  font-size: 17px;
  font-weight: 650;
  line-height: 1.25;
}

.route-card p,
.solution-axis-card p,
.direction-card p,
.info-card p,
.partner-card p,
.case-mini p,
.site-map-item span,
.process-step p,
.case-card p,
.proof-tile p,
.partner-directory-card p {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.48;
}

.route-card > strong + span,
.navigator-brief-entry > span {
  display: block;
  width: auto;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.48;
  text-transform: none;
}

.route-card:hover,
.direction-card:hover,
.info-card:hover,
.proof-tile:hover,
.case-card:hover,
.partner-directory-card:hover,
.partner-profile-card:hover,
.partner-material-card:hover {
  transform: translateY(-2px);
}

/* Controls and forms: compact, with explicit interactive states. */
.button {
  min-height: 40px;
  padding-inline: 14px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 650;
}

:where(input, select, textarea) {
  font-size: 15px;
  line-height: 1.4;
}

.case-search-line input,
.search-page-input input,
.partner-tools input,
.partner-tools select,
.partner-tools button {
  min-height: 44px;
}

.case-filters {
  top: calc(var(--header-offset) + 14px);
  gap: 14px;
  padding: 15px;
  border-radius: 6px;
}

.case-filter-group > summary {
  min-height: 36px;
  font-size: 14px;
  font-weight: 650;
}

.case-filters label {
  font-size: 13px;
  line-height: 1.4;
}

/* Service pages: keep the route selector close to the task and easy to scan. */
.service-choice-section {
  padding-top: 18px;
  padding-bottom: 0;
}

.service-choice-bar { padding-bottom: 13px; }
.service-choice-bar h2 { font-size: 20px; font-weight: 650; }
.service-choice-tabs button { min-height: 36px; font-size: 12px; font-weight: 650; }
.service-choice-column h3 { min-height: 48px; padding: 12px 14px 9px; text-transform: none; }
.service-choice-link { min-height: 74px; padding: 12px 14px; }
.service-choice-link strong { font-size: 13px; font-weight: 650; }
.service-choice-copy small { font-size: 12px; line-height: 1.4; }

.network-layer-row,
.network-stage-row,
.network-object-row,
.network-decision-row { padding-block: 14px; }

.network-artifact-list article { padding-block: 13px; }
.network-partner-row { min-height: 138px; padding: 16px; }
.network-article-link { min-height: 184px; padding: 18px; }
.network-article-link span { margin-bottom: 22px; }

/* Footer remains complete but no longer competes with page content. */
.footer-column a,
.footer-bottom { font-size: 13px; }
.footer-policy { padding-block: 14px; }
.footer-bottom { padding-block: 14px 18px; }

/* Preserve the cinematic idea without allowing it to consume a full desktop. */
html[data-view-mode="cinema"] .page-hero {
  min-height: min(560px, calc(100dvh - var(--header-offset) - 18px));
}

@media (min-width: 981px) and (max-width: 1180px) {
  :root { --header-offset: 140px; }
  .header-main { grid-template-columns: 156px minmax(240px, 1fr) auto 38px 38px; }
  .solution-axis-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
  :root {
    --container: min(100% - 28px, 920px);
    --header-offset: 0px;
    --type-h1: 36px;
    --type-h2: 28px;
  }

  .catalog-panel.catalog-panel-main,
  .catalog-route-grid-main {
    grid-template-columns: minmax(0, 1fr);
  }

  .catalog-panel.catalog-panel-main {
    gap: 18px;
  }

  html[data-view-mode] .page-hero,
  html[data-view-mode] .page-home .page-hero,
  .page-hero,
  .page-home .page-hero {
    grid-template-columns: 1fr;
    min-height: 0;
    padding: 28px;
  }

  html[data-view-mode="cinema"] .page-hero { min-height: 520px; }
  .content-section { padding-block: 30px; }
  .case-filters { top: auto; }
}

@media (max-width: 620px) {
  :root {
    --container: min(100% - 24px, 560px);
    --type-h1: 30px;
    --type-h2: 25px;
    --type-h3: 21px;
  }

  body { font-size: 15px; }
  .site-header { padding-inline: 0; }
  .header-main {
    width: 100%;
    padding: 8px;
    grid-template-columns: minmax(0, 1fr) 42px 42px 46px;
    grid-template-areas:
      "brand account cart menu"
      "search search search search";
    gap: 8px;
  }
  .brand-link img { width: 146px; }
  .header-account { grid-area: account; }
  .header-cart { grid-area: cart; }
  .mobile-menu-button { grid-area: menu; font-size: 0; }
  .site-header .quick-search { grid-area: search; min-width: 0; }

  html[data-view-mode] .page-hero,
  html[data-view-mode] .page-home .page-hero,
  .page-hero,
  .page-home .page-hero {
    width: var(--container);
    margin-top: 8px;
    padding: 22px;
    border-radius: 6px;
  }

  html[data-view-mode] .page-hero p,
  .page-hero p {
    display: block;
    max-width: 100%;
    overflow: visible;
    font-size: 15px;
    -webkit-box-orient: initial;
    -webkit-line-clamp: initial;
  }

  .content-section,
  .page-home .content-section,
  .page-partners .content-section { padding-block: 26px; }

  .section-head { margin-bottom: 15px; }
  .section-head p { font-size: 14px; }
  .solution-axis-grid { grid-template-columns: 1fr; }

  .route-card,
  .direction-card,
  .solution-axis-card,
  .info-card,
  .partner-card,
  .case-mini,
  .site-map-item,
  .process-step,
  .proof-tile,
  .partner-directory-card,
  .partner-profile-card,
  .partner-material-card {
    min-height: 0;
    padding: 14px;
  }

  html[data-view-mode="cinema"] .page-hero { min-height: 470px; }
}

@media (prefers-reduced-motion: reduce) {
  .route-card:hover,
  .direction-card:hover,
  .info-card:hover,
  .proof-tile:hover,
  .case-card:hover,
  .partner-directory-card:hover { transform: none; }
}