:root {
  /* Visual Lock v1.0 — change only through an explicit design-system revision. */
  /* Brand */
  --kpi-navy-950: #071c2b;
  --kpi-navy-900: #0b2539;
  --kpi-navy-800: #123a53;
  --kpi-blue-600: #1277a8;
  --kpi-teal-600: #13897d;
  --kpi-teal-400: #43b6b0;
  --kpi-amber-600: #d78b28;
  --kpi-slate-600: #627e91;

  /* Neutral surfaces */
  --kpi-ink: #142d3e;
  --kpi-muted: #5c727e;
  --kpi-muted-strong: #425967;
  --kpi-paper: #f4f6f3;
  --kpi-surface: #ffffff;
  --kpi-line: #dbe3e3;

  /* Typography */
  --font-body: Arial, Helvetica, sans-serif;
  --text-xs: 12px;
  --text-sm: 13px;
  --text-base: 16px;
  --text-lg: 18px;
  --leading-copy: 1.58;
  --tracking-label: .09em;

  /* Layout */
  --header-height: 76px;
  --page-gutter: clamp(38px, 4.4vw, 72px);
  --space-1: 6px;
  --space-2: 10px;
  --space-3: 14px;
  --space-4: 18px;
  --space-5: 24px;
  --space-6: 32px;

  /* Components and motion */
  --radius-round: 999px;
  --shadow-card: 0 10px 28px rgba(18, 45, 60, .08);
  --shadow-card-hover: 0 16px 34px rgba(18, 45, 60, .13);
  --transition-fast: .2s ease;
  --transition-base: .28s ease;
  --focus-ring: 0 0 0 4px rgba(19, 137, 125, .24);

  /* Locked component geometry */
  --card-border: 1px solid var(--kpi-line);
  --mobile-dock-height: 54px;
  --mobile-content-safe-area: 88px;

  /* Semantic aliases */
  --navy: var(--kpi-navy-900);
  --navy-2: var(--kpi-navy-800);
  --blue: var(--kpi-blue-600);
  --teal: var(--kpi-teal-600);
  --amber: var(--kpi-amber-600);
  --ink: var(--kpi-ink);
  --muted: var(--kpi-muted);
  --paper: var(--kpi-paper);
  --line: var(--kpi-line);
}

* { box-sizing: border-box; }

html, body { margin: 0; min-width: 1180px; min-height: 100%; background: var(--paper); }

body { color: var(--ink); font-family: var(--font-body); font-size: var(--text-base); line-height: 1.5; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }

a { color: inherit; text-decoration: none; }
a:focus-visible { outline: 2px solid var(--kpi-teal-600); outline-offset: 4px; box-shadow: var(--focus-ring); }

.site-shell { width: 100vw; height: 100vh; min-height: 700px; overflow: hidden; background: var(--paper); }

.site-header {
  height: var(--header-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--page-gutter);
  background: rgba(250, 251, 248, .985);
  border-bottom: 1px solid var(--line);
  position: relative;
  z-index: 5;
}

.brand { min-height: 60px; display: flex; align-items: center; gap: 14px; }
.brand-mark { width: auto; height: 60px; display: block; object-fit: contain; flex-shrink: 0; }
.brand-copy { display: flex; flex-direction: column; line-height: 1; }
.brand-copy strong { font-size: 19px; letter-spacing: .08em; color: var(--navy); }
.brand-copy small { margin-top: 6px; font-size: var(--text-xs); text-transform: uppercase; letter-spacing: var(--tracking-label); color: #5f737f; }

.main-nav { height: 100%; display: flex; align-items: center; gap: clamp(24px, 2.35vw, 40px); }
.main-nav a { height: 100%; min-width: 44px; display: flex; align-items: center; gap: 6px; position: relative; color: var(--kpi-muted-strong); font-size: var(--text-sm); font-weight: 700; letter-spacing: .025em; }
.main-nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--teal); transform: scaleX(0); transition: transform var(--transition-fast); }
.main-nav a:hover::after, .main-nav a.active::after { transform: scaleX(1); }
.main-nav a.active { color: var(--navy); }
.main-nav a span { font-size: 12px; opacity: .55; }
.site-header.navbar { padding-left: var(--page-gutter); padding-right: var(--page-gutter); }
.main-nav .nav-link { padding: 0; color: inherit; }
.nav-link-caret { display: inline-flex; align-items: center; font-size: 10px !important; }

.home-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(470px, 40%) minmax(0, 60%); }

.identity-panel {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  color: white;
  background:
    linear-gradient(90deg, rgba(4, 24, 38, .94) 0%, rgba(7, 35, 53, .83) 58%, rgba(8, 36, 54, .48) 100%),
    linear-gradient(135deg, #0c3449 0%, #0e5c67 55%, #789495 100%);
}

.identity-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background-image: url('../../public/hero-industrial.png');
  background-size: cover;
  background-position: 54% center;
  filter: saturate(.72) contrast(1.06);
}

.identity-panel::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(5,25,38,.02) 25%, rgba(5,25,38,.48)); }

.image-credit { position: absolute; top: 29px; right: 30px; padding-left: 12px; border-left: 1px solid rgba(255,255,255,.34); font-size: var(--text-xs); letter-spacing: .15em; text-transform: uppercase; opacity: .72; writing-mode: vertical-rl; }

.identity-content { position: absolute; left: clamp(42px, 4.8vw, 78px); right: 46px; bottom: clamp(42px, 6.8vh, 78px); max-width: 560px; }
.eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: 25px; color: #e6f1f2; font-size: 12px; line-height: 1.45; font-weight: 750; letter-spacing: .13em; text-transform: uppercase; }
.eyebrow span { width: 34px; height: 2px; background: #45c2b6; }
.identity-content h1 { margin: 0; max-width: 600px; color: white; font-size: clamp(43px, 3.85vw, 64px); line-height: 1; letter-spacing: -.052em; font-weight: 600; text-wrap: balance; }
.identity-content h1 em { color: #5bd0c4; font-style: normal; }
.identity-content > p { margin: 27px 0 34px; max-width: 500px; color: rgba(242,248,248,.94); font-size: clamp(16px, 1.24vw, 19px); line-height: var(--leading-copy); }

.facts { display: flex; border-top: 1px solid rgba(255,255,255,.3); padding-top: 22px; }
.facts div { display: flex; flex-direction: column; min-width: 115px; margin-right: clamp(18px, 2.5vw, 42px); }
.facts strong { font-size: 16px; letter-spacing: .01em; color: white; }
.facts span { margin-top: 6px; color: rgba(230,241,241,.78); font-size: var(--text-xs); text-transform: uppercase; letter-spacing: var(--tracking-label); }

.navigation-panel { display: flex; flex-direction: column; padding: clamp(30px, 3.8vh, 46px) clamp(40px, 4.25vw, 70px) 20px; background: radial-gradient(circle at 100% 0%, rgba(19,137,125,.055), transparent 34%), var(--paper); overflow: hidden; }
.panel-heading { display: grid; grid-template-columns: 1.08fr .92fr; align-items: end; gap: clamp(28px, 3vw, 48px); margin-bottom: clamp(20px, 2.6vh, 30px); padding-bottom: clamp(18px, 2.2vh, 25px); border-bottom: 1px solid var(--line); }
.section-label { display: block; margin-bottom: 11px; color: var(--teal); font-size: var(--text-xs); font-weight: 800; text-transform: uppercase; letter-spacing: .16em; }
.panel-heading h2 { margin: 0; color: var(--navy); font-size: clamp(30px, 2.35vw, 39px); line-height: 1.04; letter-spacing: -.04em; font-weight: 650; text-wrap: balance; }
.panel-heading p { max-width: 360px; margin: 0 0 3px; color: #526b78; font-size: 15.5px; line-height: 1.58; }

.card-grid { flex: 1; min-height: 334px; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 14px; }
.nav-card { position: relative; display: grid; grid-template-columns: 40% 60%; background: rgba(255,255,255,.97); border: 1px solid var(--line); box-shadow: 0 5px 18px rgba(18,45,60,.055); overflow: hidden; transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base); }
.nav-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--accent); transform: scaleY(.32); transform-origin: top; transition: transform .28s ease; }
.nav-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--accent) 46%, var(--line)); box-shadow: var(--shadow-card-hover); }
.nav-card:focus-visible { border-color: var(--accent); }
.nav-card:hover::before { transform: scaleY(1); }
.nav-card.blue { --accent: var(--blue); }
.nav-card.teal { --accent: var(--teal); }
.nav-card.amber { --accent: var(--amber); }
.nav-card.slate { --accent: var(--kpi-slate-600); }
.card-image { position: relative; display: block; min-height: 100%; overflow: hidden; background: #d9e3e4; }
.card-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(4,31,46,.02) 32%, rgba(4,31,46,.54)); }
.card-image img { object-fit: cover; transition: transform .45s ease; }
.nav-card:hover .card-image img { transform: scale(1.055); }
.card-content { position: relative; display: flex; flex-direction: column; padding: clamp(17px, 1.75vh, 22px) 20px 16px; min-width: 0; }
.card-number { position: absolute; top: 13px; right: 16px; color: #778d98; font-size: var(--text-xs); font-weight: 800; letter-spacing: .12em; }
.card-icon { position: absolute; left: 13px; bottom: 13px; z-index: 1; width: 36px; height: 36px; display: grid; place-items: center; color: white; background: var(--accent); border-radius: 50%; box-shadow: 0 5px 14px rgba(5,30,44,.22); }
.card-icon svg { width: 21px; height: 21px; }
.card-text { display: flex; flex-direction: column; padding-right: 18px; }
.card-text strong { color: var(--navy); font-size: clamp(19px, 1.35vw, 23px); letter-spacing: -.025em; }
.card-text small { max-width: 285px; margin-top: 8px; color: var(--kpi-muted); font-size: 13.5px; line-height: 1.46; }
.card-link { margin-top: auto; padding-top: 8px; color: #344f5d; font-size: var(--text-xs); font-weight: 800; text-transform: uppercase; letter-spacing: var(--tracking-label); }
.card-link b { float: right; color: var(--accent); font-size: 15px; transition: transform .2s ease; }
.nav-card:hover .card-link b { transform: translate(2px,-2px); }

.contact-bar { height: 56px; flex: 0 0 56px; margin-top: 14px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; color: white; background: var(--navy); border-left: 3px solid var(--kpi-teal-400); transition: background var(--transition-fast); }
.contact-bar:hover { background: var(--navy-2); }
.contact-bar span { font-size: 13px; color: rgba(255,255,255,.84); }
.contact-bar span i { display: inline-block; width: 6px; height: 6px; margin-right: 10px; background: #4bc3b7; border-radius: 50%; }
.contact-bar strong { font-size: 12px; text-transform: uppercase; letter-spacing: .07em; }
.contact-bar strong b { margin-left: 14px; color: #51c9bd; font-size: 18px; font-weight: 400; }

.panel-footer { height: 28px; display: flex; align-items: end; justify-content: space-between; color: #667e89; font-size: var(--text-xs); text-transform: uppercase; letter-spacing: var(--tracking-label); }

/* Services archive — representative desktop template */
.services-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(420px, 34%) minmax(0, 66%); }
.services-intro { position: relative; isolation: isolate; overflow: hidden; color: white; }
.services-intro-image { position: absolute; inset: 0; z-index: -3; background: url('../../public/services-onshore.png') 53% center / cover no-repeat; filter: saturate(.72) contrast(1.06); transform: scale(1.015); }
.services-intro-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(5,27,42,.66), rgba(5,27,42,.93)), linear-gradient(90deg, rgba(5,27,42,.78), rgba(5,27,42,.2)); }
.services-breadcrumb { position: absolute; top: 30px; left: var(--page-gutter); display: flex; align-items: center; gap: 9px; color: rgba(255,255,255,.72); font-size: var(--text-xs); letter-spacing: .04em; }
.services-breadcrumb a:hover { color: white; }
.services-breadcrumb strong { color: white; font-weight: 700; }
.services-intro-copy { position: absolute; right: 44px; bottom: clamp(42px, 7vh, 76px); left: var(--page-gutter); max-width: 520px; }
.services-kicker { display: flex; align-items: center; gap: 11px; margin-bottom: 22px; color: #dcebed; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.services-kicker i { width: 32px; height: 2px; background: var(--kpi-teal-400); }
.services-intro h1 { margin: 0; color: white; font-size: clamp(42px, 3.7vw, 61px); font-weight: 600; line-height: 1; letter-spacing: -.052em; }
.services-intro h1 em { color: #5bd0c4; font-style: normal; }
.services-intro-copy > p { max-width: 500px; margin: 27px 0 31px; color: rgba(242,248,248,.92); font-size: clamp(16px, 1.15vw, 18px); line-height: var(--leading-copy); }
.hierarchy-path { display: flex; align-items: center; gap: clamp(8px, 1vw, 15px); padding-top: 20px; border-top: 1px solid rgba(255,255,255,.28); color: rgba(255,255,255,.78); font-size: var(--text-xs); font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.hierarchy-path b { color: var(--kpi-teal-400); font-size: 15px; font-weight: 400; }

.services-directory { display: flex; min-width: 0; flex-direction: column; padding: clamp(28px, 3.6vh, 44px) clamp(38px, 4vw, 66px) 20px; overflow: hidden; background: radial-gradient(circle at 100% 0%, rgba(18,119,168,.065), transparent 36%), var(--paper); }
.directory-heading { display: grid; grid-template-columns: 1.08fr .92fr; align-items: end; gap: clamp(28px, 3vw, 50px); margin-bottom: clamp(20px, 2.6vh, 30px); padding-bottom: clamp(18px, 2.2vh, 24px); border-bottom: 1px solid var(--line); }
.directory-heading h2 { margin: 0; color: var(--navy); font-size: clamp(30px, 2.35vw, 39px); font-weight: 650; line-height: 1.04; letter-spacing: -.04em; }
.directory-heading p { max-width: 370px; margin: 0 0 3px; color: #526b78; font-size: 15.5px; line-height: 1.58; }

.service-group-grid { flex: 1; min-height: 360px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 14px; }
.service-group-card { --accent: var(--blue); position: relative; isolation: isolate; min-width: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.45); background: var(--navy); box-shadow: 0 6px 20px rgba(18,45,60,.08); transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base); }
.service-group-card::before { content: ""; position: absolute; top: 0; right: 0; left: 0; z-index: 3; height: 3px; background: var(--accent); transform: scaleX(.28); transform-origin: left; transition: transform var(--transition-base); }
.service-group-card img { z-index: -2; object-fit: cover; filter: saturate(.76) contrast(1.05); transition: transform .5s ease, filter .4s ease; }
.service-group-shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(4,25,39,.08) 22%, rgba(4,25,39,.92)); }
.service-group-number { position: absolute; top: 17px; left: 18px; color: rgba(255,255,255,.78); font-size: var(--text-xs); font-weight: 800; letter-spacing: .13em; }
.service-group-card strong { position: absolute; right: 42px; bottom: 18px; left: 18px; color: white; font-size: clamp(17px, 1.25vw, 21px); font-weight: 650; line-height: 1.12; letter-spacing: -.025em; }
.service-group-arrow { position: absolute; right: 17px; bottom: 16px; color: var(--accent); font-size: 21px; transition: transform var(--transition-fast); }
.service-group-card:hover { z-index: 2; transform: translateY(-3px); border-color: color-mix(in srgb, var(--accent) 65%, white); box-shadow: var(--shadow-card-hover); }
.service-group-card:hover::before { transform: scaleX(1); }
.service-group-card:hover img { transform: scale(1.055); filter: saturate(.95) contrast(1.05); }
.service-group-card:hover .service-group-arrow { transform: translate(2px,-2px); }
.service-group-card:focus-visible { border-color: var(--accent); }
.service-group-card.teal { --accent: var(--teal); }
.service-group-card.amber { --accent: var(--amber); }
.service-group-card.green { --accent: #4d9670; }
.service-group-card.red { --accent: #c76359; }
.service-group-card.slate { --accent: var(--kpi-slate-600); }

.services-footer { height: 42px; flex: 0 0 42px; display: flex; align-items: end; justify-content: space-between; color: #667e89; font-size: var(--text-xs); }
.services-footer > span { display: flex; align-items: center; gap: 9px; }
.services-footer i { width: 6px; height: 6px; background: var(--teal); border-radius: var(--radius-round); }
.services-footer a { color: var(--navy); font-weight: 800; text-transform: uppercase; letter-spacing: var(--tracking-label); }
.services-footer a b { margin-left: 10px; color: var(--teal); font-size: 16px; }
/* Phase 5.9–5.12 — shared archive, detail, and contact templates */
.catalog-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(410px, 34%) minmax(0, 66%); }
.catalog-identity { position: relative; isolation: isolate; overflow: hidden; color: white; }
.catalog-identity > img { z-index: -3; object-fit: cover; filter: saturate(.7) contrast(1.07); }
.catalog-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg,rgba(5,27,42,.62),rgba(5,27,42,.95)),linear-gradient(90deg,rgba(5,27,42,.75),rgba(5,27,42,.18)); }
.catalog-breadcrumb { position: absolute; top: 30px; right: 30px; left: var(--page-gutter); display: flex; flex-wrap: wrap; gap: 8px; color: rgba(255,255,255,.7); font-size: var(--text-xs); }
.catalog-breadcrumb strong { color: white; }
.catalog-identity-copy { position: absolute; right: 42px; bottom: clamp(48px,8vh,84px); left: var(--page-gutter); }
.catalog-kicker { display: flex; align-items: center; gap: 11px; margin-bottom: 22px; color: #dcebed; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.catalog-kicker i { width: 32px; height: 2px; background: var(--kpi-teal-400); }
.catalog-identity h1 { margin: 0; color: white; font-size: clamp(40px,3.55vw,58px); font-weight: 600; line-height: 1.01; letter-spacing: -.05em; }
.catalog-identity h1 em { color: #5bd0c4; font-style: normal; }
.catalog-identity-copy p { max-width: 490px; margin: 25px 0 0; color: rgba(242,248,248,.92); font-size: clamp(16px,1.1vw,18px); line-height: var(--leading-copy); }
.catalog-directory { display: flex; min-width: 0; flex-direction: column; padding: clamp(27px,3.4vh,42px) clamp(38px,4vw,66px) 20px; overflow: hidden; background: radial-gradient(circle at 100% 0%,rgba(19,137,125,.055),transparent 35%),var(--paper); }
.catalog-heading { display: grid; grid-template-columns: 1.08fr .92fr; align-items: end; gap: 35px; margin-bottom: 18px; padding-bottom: 19px; border-bottom: 1px solid var(--line); }
.catalog-heading h2 { margin: 0; color: var(--navy); font-size: clamp(29px,2.25vw,38px); line-height: 1.05; letter-spacing: -.04em; }
.catalog-heading p { margin: 0 0 3px; color: #526b78; font-size: 14px; line-height: 1.55; }
.catalog-list { flex: 1; min-height: 0; display: grid; grid-template-rows: repeat(4,1fr); border-top: 1px solid var(--line); }
.catalog-row { display: grid; grid-template-columns: 40px 145px minmax(0,1fr) auto; align-items: center; gap: 17px; padding: 0 14px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.64); transition: background .2s ease,transform .2s ease; }
.catalog-row:hover { z-index: 1; background: white; transform: translateX(3px); }
.catalog-row > span { color: var(--teal); font-size: 11px; font-weight: 800; }
.catalog-row small { color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.catalog-row strong { color: var(--navy); font-size: 16px; }
.catalog-row > b { color: var(--blue); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.catalog-footer { min-height: 37px; display: flex; align-items: end; justify-content: space-between; color: #667e89; font-size: 11px; }
.catalog-footer a { color: var(--navy); font-weight: 800; }
.topic-grid { flex: 1; min-height: 0; display: grid; grid-template-columns: repeat(3,1fr); grid-template-rows: repeat(2,1fr); gap: 10px; }
.topic-card { position: relative; display: flex; flex-direction: column; padding: 15px; background: white; border: 1px solid var(--line); box-shadow: 0 4px 14px rgba(18,45,60,.04); }
.topic-card > span { position: absolute; top: 13px; right: 14px; color: #82959e; font-size: 10px; }
.topic-card small { color: var(--teal); font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.topic-card strong { margin-top: 12px; max-width: 90%; color: var(--navy); font-size: clamp(15px,1.15vw,19px); line-height: 1.18; }
.topic-card b { margin-top: auto; color: var(--blue); font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }
.detail-catalog { gap: clamp(14px,1.8vh,20px); }
.training-detail-grid { flex: 1; min-height: 0; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; border: 1px solid var(--line); background: white; }
.training-detail-grid article { position: relative; padding: clamp(16px,2vh,23px); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.training-detail-grid article:nth-child(even) { border-right: 0; }
.training-detail-grid article:nth-child(n+3) { border-bottom: 0; }
.training-detail-grid article > span { color: var(--teal); font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.training-detail-grid h3 { margin: 10px 0 7px; color: var(--navy); font-size: clamp(17px,1.35vw,21px); }
.training-detail-grid p { margin: 0; color: var(--muted); font-size: 12.5px; line-height: 1.5; }
.catalog-callout { min-height: 62px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 10px 16px; color: white; background: var(--navy); border-left: 3px solid var(--teal); }
.catalog-callout div { display: flex; flex-direction: column; }
.catalog-callout small { color: rgba(255,255,255,.62); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.catalog-callout strong { margin-top: 3px; font-size: 14px; }
.catalog-callout a { color: #5bd0c4; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.contact-grid { flex: 1; min-height: 0; display: grid; grid-template-columns: 1.15fr .85fr; grid-template-rows: 1fr 1fr; gap: 11px; }
.contact-grid > * { padding: clamp(18px,2.2vh,25px); background: white; border: 1px solid var(--line); }
.contact-grid small { color: var(--teal); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .09em; }
.contact-grid strong { display: block; margin-top: 10px; color: var(--navy); font-size: clamp(18px,1.55vw,24px); line-height: 1.15; }
.contact-grid p { margin: 9px 0 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.contact-primary { grid-row: 1 / span 2; display: flex; flex-direction: column; justify-content: end; color: white; background: linear-gradient(150deg,var(--navy),var(--navy-2)); border-left: 4px solid var(--teal); }
.contact-primary small { color: #5bd0c4; }
.contact-primary strong { color: white; font-size: clamp(24px,2.1vw,34px); overflow-wrap: anywhere; }
.contact-primary span { margin-top: 18px; color: #5bd0c4; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.contact-paths { display: flex; gap: 10px; margin-top: 11px; }
.contact-paths a { flex: 1; padding: 12px 13px; color: var(--navy); background: white; border: 1px solid var(--line); font-size: 11px; font-weight: 800; text-align: center; }

/* Process Safety Management — representative Service Group template */
.group-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(410px, 34%) minmax(0, 66%); }
.group-identity { position: relative; isolation: isolate; overflow: hidden; color: white; }
.group-identity-image { position: absolute; inset: 0; z-index: -3; background: url('../../public/hero-industrial.png') 57% center / cover no-repeat; filter: saturate(.68) contrast(1.08); transform: scale(1.015); }
.group-identity-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(5,27,42,.68), rgba(5,27,42,.95)), linear-gradient(90deg, rgba(5,27,42,.8), rgba(5,27,42,.22)); }
.group-breadcrumb { position: absolute; top: 30px; right: 32px; left: var(--page-gutter); display: flex; align-items: center; flex-wrap: wrap; gap: 8px; color: rgba(255,255,255,.7); font-size: var(--text-xs); line-height: 1.4; }
.group-breadcrumb a:hover { color: white; }
.group-breadcrumb strong { color: white; font-weight: 700; }
.group-identity-copy { position: absolute; right: 42px; bottom: clamp(88px, 12vh, 128px); left: var(--page-gutter); max-width: 520px; }
.group-role { display: flex; align-items: center; gap: 11px; margin-bottom: 23px; color: #dcebed; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.group-role i { width: 32px; height: 2px; background: var(--kpi-teal-400); }
.group-identity h1 { margin: 0; color: white; font-size: clamp(42px, 3.65vw, 60px); font-weight: 600; line-height: 1; letter-spacing: -.052em; }
.group-identity h1 em { color: #5bd0c4; font-style: normal; }
.group-identity-copy > p { max-width: 480px; margin: 27px 0 0; color: rgba(242,248,248,.92); font-size: clamp(16px, 1.12vw, 18px); line-height: var(--leading-copy); }
.group-back { position: absolute; bottom: 31px; left: var(--page-gutter); min-height: 44px; display: inline-flex; align-items: center; gap: 11px; color: rgba(255,255,255,.76); font-size: var(--text-sm); font-weight: 800; }
.group-back span { color: var(--kpi-teal-400); font-size: 18px; }
.group-back:hover { color: white; }

.group-content { display: grid; min-width: 0; grid-template-rows: auto minmax(0, 1fr) auto auto; gap: clamp(17px, 2.2vh, 25px); padding: clamp(27px, 3.4vh, 42px) clamp(38px, 4vw, 66px) 20px; overflow: hidden; background: radial-gradient(circle at 100% 0%, rgba(19,137,125,.055), transparent 35%), var(--paper); }
.group-content-heading { padding-bottom: clamp(17px, 2.1vh, 23px); border-bottom: 1px solid var(--line); }
.group-content-heading > div { display: flex; align-items: end; justify-content: space-between; gap: 30px; }
.group-content-heading h2 { max-width: 720px; margin: 0; color: var(--navy); font-size: clamp(29px, 2.28vw, 38px); font-weight: 650; line-height: 1.07; letter-spacing: -.04em; text-wrap: balance; }
.level-badge { flex: 0 0 auto; padding: 9px 11px; color: var(--blue); background: white; border: 1px solid var(--line); font-size: var(--text-xs); font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }

.group-explanation { min-height: 0; display: grid; grid-template-columns: 1.36fr .64fr; gap: clamp(28px, 3.4vw, 54px); align-items: start; }
.group-primary-copy { max-width: 780px; padding-top: 2px; }
.group-primary-copy p { margin: 0; color: #526b78; font-size: 15.5px; line-height: 1.65; }
.group-primary-copy .group-lead { margin-bottom: 16px; color: var(--ink); font-size: clamp(18px, 1.28vw, 21px); font-weight: 500; line-height: 1.55; }
.group-reading-guide { padding: 17px 19px 15px; background: rgba(255,255,255,.82); border-top: 3px solid var(--teal); box-shadow: 0 5px 18px rgba(18,45,60,.05); }
.group-reading-guide > span { color: var(--teal); font-size: var(--text-xs); font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.group-reading-guide ol { margin: 12px 0 0; padding: 0; list-style: none; }
.group-reading-guide li { display: grid; grid-template-columns: 28px 1fr; gap: 8px; padding: 8px 0; border-top: 1px solid var(--line); }
.group-reading-guide li b { color: var(--blue); font-size: var(--text-xs); letter-spacing: .08em; }
.group-reading-guide li p { margin: 0; color: #526b78; font-size: 13px; line-height: 1.42; }

.related-scope-section { display: grid; grid-template-columns: minmax(245px, .8fr) minmax(360px, 1.2fr); gap: clamp(25px, 3vw, 46px); align-items: stretch; padding-top: clamp(17px, 2.1vh, 23px); border-top: 1px solid var(--line); }
.related-scope-heading { display: flex; flex-direction: column; justify-content: center; }
.related-scope-heading h3 { max-width: 390px; margin: 0; color: var(--navy); font-size: clamp(21px, 1.55vw, 26px); font-weight: 650; line-height: 1.15; letter-spacing: -.03em; }
.related-scope-heading p { max-width: 420px; margin: 10px 0 0; color: #5b717c; font-size: 13.5px; line-height: 1.5; }
.related-scope-card { --accent: var(--blue); min-height: 112px; position: relative; display: grid; grid-template-columns: 34% 1fr; align-items: end; overflow: hidden; background: white; border: 1px solid var(--line); box-shadow: 0 5px 18px rgba(18,45,60,.055); transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base); }
.related-scope-card::before { content: ""; position: absolute; top: 0; right: 0; left: 0; z-index: 3; height: 3px; background: var(--accent); transform: scaleX(.3); transform-origin: left; transition: transform var(--transition-base); }
.related-scope-image { position: relative; grid-row: 1 / span 3; align-self: stretch; overflow: hidden; background: #d8e2e4; }
.related-scope-image img { object-fit: cover; filter: saturate(.72); transition: transform .45s ease; }
.related-scope-image i { position: absolute; inset: 0; background: linear-gradient(180deg, transparent, rgba(4,31,46,.46)); }
.related-scope-index { position: absolute; top: 15px; right: 16px; color: #778d98; font-size: var(--text-xs); font-weight: 800; letter-spacing: .12em; }
.related-scope-card > strong { padding: 27px 44px 5px 18px; color: var(--navy); font-size: clamp(20px, 1.42vw, 24px); font-weight: 650; line-height: 1.12; letter-spacing: -.03em; }
.related-scope-path { padding: 0 18px 17px; color: #5d727d; font-size: var(--text-xs); font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.related-scope-path b { float: right; color: var(--accent); font-size: 18px; }
.related-scope-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--accent) 44%, var(--line)); box-shadow: var(--shadow-card-hover); }
.related-scope-card:hover::before { transform: scaleX(1); }
.related-scope-card:hover img { transform: scale(1.05); }
.scope-mini-list { min-width: 0; display: grid; gap: 7px; }
.scope-mini-list a { display: grid; grid-template-columns: 32px minmax(0,1fr) auto; align-items: center; gap: 10px; min-height: 35px; padding: 7px 10px; background: white; border: 1px solid var(--line); transition: transform var(--transition-fast), border-color var(--transition-fast); }
.scope-mini-list a:hover { transform: translateX(3px); border-color: var(--teal); }
.scope-mini-list span { color: var(--teal); font-size: 10px; font-weight: 800; }
.scope-mini-list strong { color: var(--navy); font-size: 13px; }
.scope-mini-list small { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .05em; }
.scope-detail-list { min-height: 0; display: grid; gap: 8px; padding-top: 16px; border-top: 1px solid var(--line); overflow: auto; }
.scope-detail-list > a { display: grid; grid-template-columns: 34px minmax(0,1fr) 18px; align-items: center; gap: 12px; min-height: 66px; padding: 10px 13px; background: white; border: 1px solid var(--line); }
.scope-detail-list > a > span { color: var(--teal); font-size: 10px; font-weight: 800; }
.scope-detail-list > a > div { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: baseline; gap: 3px 15px; }
.scope-detail-list small { color: var(--teal); font-size: 9px; text-transform: uppercase; letter-spacing: .06em; }
.scope-detail-list strong { grid-column: 1; color: var(--navy); font-size: 16px; }
.scope-detail-list p { grid-column: 2; grid-row: 1 / span 2; margin: 0; max-width: 330px; color: var(--muted); font-size: 11px; line-height: 1.4; }
.scope-detail-list > a > b { color: var(--blue); }

.group-footer { min-height: 30px; display: flex; align-items: end; justify-content: space-between; gap: 28px; color: #667e89; font-size: var(--text-xs); }
.group-footer span { text-transform: uppercase; letter-spacing: var(--tracking-label); }
.group-footer strong { color: var(--kpi-muted-strong); font-weight: 700; text-align: right; }
.group-training-shell { height: 100vh; overflow: hidden; }
.group-training-stage { height: calc(100vh - var(--header-height)); min-height: 624px; overflow: hidden; }
.group-training-content { min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: 0; padding: clamp(26px, 3.3vh, 40px) clamp(38px, 4vw, 66px) 18px; background: radial-gradient(circle at 100% 0%, rgba(18,119,168,.065), transparent 36%), var(--paper); }
.group-training-header { flex: 0 0 auto; display: grid; grid-template-columns: 1.08fr .92fr; align-items: end; gap: clamp(28px, 3vw, 50px); margin-bottom: 15px; padding-bottom: clamp(15px, 1.8vh, 20px); border-bottom: 1px solid var(--line); }
.group-training-header h2 { margin: 0; color: var(--navy); font-size: clamp(29px, 2.25vw, 38px); font-weight: 650; line-height: 1.04; letter-spacing: -.04em; }
.group-training-header > p { max-width: 430px; margin: 0 0 3px; color: #526b78; font-size: 14px; line-height: 1.55; }
.group-training-scroll { min-height: 0; flex: 1; overflow-y: auto; overscroll-behavior: contain; scroll-behavior: smooth; padding: 4px 18px 20px 0; scrollbar-color: var(--blue) #dfe6e4; scrollbar-width: thin; }
.group-training-scroll:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
.group-training-scroll::-webkit-scrollbar { width: 7px; }
.group-training-scroll::-webkit-scrollbar-track { background: #dfe6e4; }
.group-training-scroll::-webkit-scrollbar-thumb { background: var(--blue); }
.group-training-intro { max-width: 820px; padding: 14px 0 38px; border-bottom: 1px solid var(--line); }
.group-training-lead { margin: 0 0 18px; color: var(--navy); font-size: clamp(22px, 1.65vw, 29px); font-weight: 550; line-height: 1.38; letter-spacing: -.03em; }
.group-training-intro > p:last-of-type, .group-training-section-body > p { color: #526b78; font-size: 14.5px; line-height: 1.72; }
.group-training-toc { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; margin-top: 28px; padding: 19px 21px; background: white; border-left: 3px solid var(--blue); }
.group-training-toc > span { grid-column: 1 / -1; margin-bottom: 8px; color: #0c5b7b; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.group-training-toc a { display: block; padding: 9px 0; color: var(--navy); border-top: 1px solid var(--line); }
.group-training-toc small { display: block; color: var(--blue); font-size: 9px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.group-training-toc strong { display: block; margin-top: 5px; font-size: 13px; line-height: 1.35; }
.group-training-section { max-width: 820px; display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 22px; padding: 38px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 12px; }
.group-training-section-no-number { grid-template-columns: minmax(0, 1fr); }
.group-training-section-number { color: var(--blue); font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.group-training-section-body h3, .group-training-relations h3 { margin: 10px 0 17px; color: var(--navy); font-size: clamp(25px, 2vw, 34px); font-weight: 620; line-height: 1.1; letter-spacing: -.04em; }
.group-training-section-body > p { margin: 0; max-width: 72ch; }
.group-training-section-body > p + p { margin-top: 16px; }
.group-training-list-block { margin-top: 24px; padding: 20px 22px; background: #e9efed; border-top: 3px solid var(--teal); }
.group-training-list-block > span { color: var(--navy); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.group-training-list-block ul { margin: 14px 0 0; padding-left: 20px; color: #526b78; font-size: 14px; line-height: 1.65; }
.group-training-list-block li + li { margin-top: 7px; }
.group-training-relations { max-width: 820px; margin-top: 38px; padding: 28px; background: #e9efed; border-top: 3px solid var(--teal); }
.group-training-relations h3 { margin-bottom: 22px; font-size: 28px; }
.group-training-relation-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.group-training-relation-list a { padding: 16px; background: white; transition: transform var(--transition-fast), box-shadow var(--transition-fast); }
.group-training-relation-list a:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(18,45,60,.08); }
.group-training-relation-list small { display: block; color: var(--teal); font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.group-training-relation-list strong { display: block; margin-top: 8px; color: var(--navy); font-size: 14px; }

/* Process Hazard Analysis — representative Sub-group template */
.subgroup-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(390px, 31%) minmax(0, 69%); }
.subgroup-identity { position: relative; isolation: isolate; overflow: hidden; color: white; }
.subgroup-identity-image { position: absolute; inset: 0; z-index: -3; background: url('../../public/services-onshore.png') 62% center / cover no-repeat; filter: saturate(.62) contrast(1.08); transform: scale(1.02); }
.subgroup-identity-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(5,27,42,.7), rgba(5,27,42,.96)), linear-gradient(90deg, rgba(5,27,42,.84), rgba(5,27,42,.24)); }
.subgroup-breadcrumb { position: absolute; top: 29px; right: 28px; left: var(--page-gutter); display: flex; align-items: center; flex-wrap: wrap; gap: 7px; color: rgba(255,255,255,.68); font-size: var(--text-xs); line-height: 1.4; }
.subgroup-breadcrumb a:hover { color: white; }
.subgroup-breadcrumb strong { color: white; font-weight: 700; }
.subgroup-identity-copy { position: absolute; right: 38px; bottom: clamp(89px, 12vh, 126px); left: var(--page-gutter); max-width: 500px; }
.subgroup-role { display: flex; align-items: center; gap: 11px; margin-bottom: 22px; color: #e6e9d4; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.subgroup-role i { width: 32px; height: 2px; background: var(--amber); }
.subgroup-identity h1 { margin: 0; color: white; font-size: clamp(41px, 3.35vw, 57px); font-weight: 600; line-height: 1; letter-spacing: -.052em; }
.subgroup-identity h1 em { color: #f0b35e; font-style: normal; }
.subgroup-identity-copy > p { max-width: 470px; margin: 26px 0 0; color: rgba(242,248,248,.92); font-size: clamp(16px, 1.08vw, 18px); line-height: var(--leading-copy); }
.subgroup-back { position: absolute; bottom: 31px; left: var(--page-gutter); min-height: 44px; display: inline-flex; align-items: center; gap: 11px; color: rgba(255,255,255,.76); font-size: var(--text-sm); font-weight: 800; }
.subgroup-back span { color: #f0b35e; font-size: 18px; }
.subgroup-back:hover { color: white; }

.subgroup-content { display: grid; min-width: 0; grid-template-rows: auto minmax(0, 1fr) auto auto; gap: clamp(16px, 2.15vh, 24px); padding: clamp(27px, 3.35vh, 41px) clamp(38px, 4vw, 66px) 20px; overflow: hidden; background: radial-gradient(circle at 100% 0%, rgba(215,139,40,.06), transparent 35%), var(--paper); }
.subgroup-content-heading { padding-bottom: clamp(17px, 2.1vh, 23px); border-bottom: 1px solid var(--line); }
.subgroup-content-heading > div { display: flex; align-items: end; justify-content: space-between; gap: 30px; }
.subgroup-content-heading h2 { max-width: 760px; margin: 0; color: var(--navy); font-size: clamp(29px, 2.25vw, 38px); font-weight: 650; line-height: 1.07; letter-spacing: -.04em; text-wrap: balance; }
.subgroup-level { color: #a96816; }

.subgroup-explanation { min-height: 0; display: grid; grid-template-columns: 1.08fr .92fr; gap: clamp(28px, 3.3vw, 52px); align-items: start; }
.subgroup-primary-copy { max-width: 760px; padding-top: 2px; }
.subgroup-primary-copy p { margin: 0; color: #526b78; font-size: 15.5px; line-height: 1.65; }
.subgroup-primary-copy .subgroup-lead { margin-bottom: 16px; color: var(--ink); font-size: clamp(18px, 1.25vw, 21px); font-weight: 500; line-height: 1.55; }
.analysis-lens { padding: 16px 18px 14px; background: rgba(255,255,255,.84); border-top: 3px solid var(--amber); box-shadow: 0 5px 18px rgba(18,45,60,.05); }
.analysis-lens > span { color: #a96816; font-size: var(--text-xs); font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.analysis-lens-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 12px; border-top: 1px solid var(--line); }
.analysis-lens article { min-width: 0; padding: 11px 12px 4px; border-left: 1px solid var(--line); }
.analysis-lens article:first-child { padding-left: 0; border-left: 0; }
.analysis-lens article:last-child { padding-right: 0; }
.analysis-lens article b { display: block; margin-bottom: 5px; color: #a96816; font-size: var(--text-xs); letter-spacing: .08em; }
.analysis-lens article strong { display: block; color: var(--navy); font-size: 14px; }
.analysis-lens article p { margin: 5px 0 0; color: #5d727d; font-size: 12px; line-height: 1.4; }

.technical-detail-section { display: grid; grid-template-columns: minmax(245px, .75fr) minmax(400px, 1.25fr); gap: clamp(25px, 3vw, 46px); align-items: stretch; padding-top: clamp(17px, 2.1vh, 23px); border-top: 1px solid var(--line); }
.technical-detail-heading { display: flex; flex-direction: column; justify-content: center; }
.technical-detail-heading h3 { max-width: 390px; margin: 0; color: var(--navy); font-size: clamp(21px, 1.55vw, 26px); font-weight: 650; line-height: 1.15; letter-spacing: -.03em; }
.technical-detail-heading p { max-width: 420px; margin: 10px 0 0; color: #5b717c; font-size: 13.5px; line-height: 1.5; }
.technical-detail-card { --accent: var(--amber); min-height: 112px; position: relative; display: grid; grid-template-columns: 36% 1fr; align-items: end; overflow: hidden; background: white; border: 1px solid var(--line); box-shadow: 0 5px 18px rgba(18,45,60,.055); transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base); }
.technical-detail-card::before { content: ""; position: absolute; top: 0; right: 0; left: 0; z-index: 3; height: 3px; background: var(--accent); transform: scaleX(.3); transform-origin: left; transition: transform var(--transition-base); }
.technical-detail-image { position: relative; grid-row: 1 / span 3; align-self: stretch; overflow: hidden; background: #d8e2e4; }
.technical-detail-image img { object-fit: cover; filter: saturate(.67); transition: transform .45s ease; }
.technical-detail-image i { position: absolute; inset: 0; background: linear-gradient(180deg, transparent, rgba(4,31,46,.5)); }
.technical-detail-meta { padding: 19px 42px 4px 18px; color: #8a672e; font-size: var(--text-xs); font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.technical-detail-card > strong { padding: 0 42px 4px 18px; color: var(--navy); font-size: clamp(22px, 1.55vw, 26px); font-weight: 650; line-height: 1.1; letter-spacing: -.03em; }
.technical-detail-link { padding: 0 18px 15px; color: #5d727d; font-size: var(--text-xs); font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.technical-detail-link b { float: right; color: var(--accent); font-size: 18px; }
.technical-detail-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--accent) 50%, var(--line)); box-shadow: var(--shadow-card-hover); }
.technical-detail-card:hover::before { transform: scaleX(1); }
.technical-detail-card:hover img { transform: scale(1.05); }

.subgroup-footer { min-height: 30px; display: flex; align-items: end; justify-content: space-between; gap: 28px; color: #667e89; font-size: var(--text-xs); }
.subgroup-footer span { text-transform: uppercase; letter-spacing: var(--tracking-label); }
.subgroup-footer strong { color: var(--kpi-muted-strong); font-weight: 700; text-align: right; }

/* HAZOP Study — representative Technical Detail template */
.detail-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(360px, 29%) minmax(0, 71%); }
.detail-identity { position: relative; isolation: isolate; overflow: hidden; color: white; }
.detail-identity-image { position: absolute; inset: 0; z-index: -3; background: url('../../public/hero-industrial.png') 62% center / cover no-repeat; filter: saturate(.56) contrast(1.1); transform: scale(1.02); }
.detail-identity-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(5,27,42,.72), rgba(5,27,42,.97)), linear-gradient(90deg, rgba(5,27,42,.86), rgba(5,27,42,.28)); }
.detail-breadcrumb { position: absolute; top: 29px; right: 26px; left: var(--page-gutter); display: flex; align-items: center; flex-wrap: wrap; gap: 7px; color: rgba(255,255,255,.66); font-size: var(--text-xs); line-height: 1.4; }
.detail-breadcrumb a:hover { color: white; }
.detail-breadcrumb strong { color: white; font-weight: 700; }
.detail-identity-copy { position: absolute; right: 36px; bottom: clamp(105px, 14vh, 146px); left: var(--page-gutter); max-width: 470px; }
.detail-role { display: flex; align-items: center; gap: 11px; margin-bottom: 22px; color: #f0dfc7; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.detail-role i { width: 32px; height: 2px; background: #c76359; }
.detail-identity h1 { margin: 0; color: white; font-size: clamp(49px, 4.2vw, 69px); font-weight: 600; line-height: .95; letter-spacing: -.055em; }
.detail-identity h1 em { color: #df8279; font-style: normal; }
.detail-identity-copy > p { margin: 21px 0 20px; color: rgba(242,248,248,.9); font-size: clamp(16px, 1.08vw, 18px); line-height: 1.5; }
.detail-level { display: inline-flex; padding: 8px 10px; color: white; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.26); font-size: var(--text-xs); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.detail-back { position: absolute; bottom: 31px; left: var(--page-gutter); min-height: 44px; display: inline-flex; align-items: center; gap: 11px; color: rgba(255,255,255,.76); font-size: var(--text-sm); font-weight: 800; }
.detail-back span { color: #df8279; font-size: 18px; }
.detail-back:hover { color: white; }

.detail-content { display: grid; min-width: 0; grid-template-rows: auto auto minmax(0, 1fr) auto auto; gap: clamp(14px, 1.85vh, 21px); padding: clamp(25px, 3.15vh, 38px) clamp(38px, 4vw, 66px) 18px; overflow: hidden; background: radial-gradient(circle at 100% 0%, rgba(199,99,89,.055), transparent 34%), var(--paper); }
.detail-content-heading { display: grid; grid-template-columns: 1.18fr .82fr; align-items: end; gap: clamp(28px, 3.2vw, 52px); padding-bottom: clamp(16px, 1.9vh, 21px); border-bottom: 1px solid var(--line); }
.detail-content-heading h2 { max-width: 760px; margin: 0; color: var(--navy); font-size: clamp(29px, 2.22vw, 37px); font-weight: 650; line-height: 1.07; letter-spacing: -.04em; text-wrap: balance; }
.detail-content-heading > p { max-width: 390px; margin: 0 0 3px; color: #526b78; font-size: 14.5px; line-height: 1.58; }

.detail-definition { display: grid; grid-template-columns: 1.16fr .84fr; gap: clamp(30px, 3.5vw, 58px); }
.detail-definition p { margin: 0; color: #526b78; font-size: 14.5px; line-height: 1.6; }
.detail-definition .detail-lead { color: var(--ink); font-size: clamp(17px, 1.15vw, 20px); font-weight: 500; line-height: 1.52; }

.detail-block-grid { min-height: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.detail-block { position: relative; min-width: 0; padding: clamp(17px, 2.1vh, 23px) clamp(14px, 1.45vw, 23px) 14px; border-left: 1px solid var(--line); }
.detail-block:first-child { padding-left: 0; border-left: 0; }
.detail-block:last-child { padding-right: 0; }
.detail-block > span { position: absolute; top: 16px; right: 16px; color: #9b7b77; font-size: var(--text-xs); font-weight: 800; letter-spacing: .11em; }
.detail-block small { display: block; margin-bottom: 10px; color: #a4554d; font-size: var(--text-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.detail-block h3 { max-width: 240px; margin: 0; color: var(--navy); font-size: clamp(16px, 1.12vw, 19px); font-weight: 650; line-height: 1.2; letter-spacing: -.02em; }
.detail-block p { margin: 10px 0 0; color: #5d727d; font-size: 12.5px; line-height: 1.46; }

.detail-action { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 12px 16px 12px 18px; background: white; border-left: 3px solid #c76359; box-shadow: 0 5px 18px rgba(18,45,60,.045); }
.detail-action .section-label { margin-bottom: 4px; color: #a4554d; }
.detail-action p { max-width: 720px; margin: 0; color: #5d727d; font-size: 13px; line-height: 1.45; }
.detail-action a { flex: 0 0 auto; min-height: 44px; display: inline-flex; align-items: center; padding: 0 15px; color: white; background: var(--navy); font-size: var(--text-xs); font-weight: 800; letter-spacing: .07em; text-transform: uppercase; transition: background var(--transition-fast); }
.detail-action a:hover { background: var(--navy-2); }
.detail-action a b { margin-left: 12px; color: #df8279; font-size: 17px; }

.detail-footer { min-height: 25px; display: flex; align-items: end; justify-content: space-between; gap: 28px; color: #667e89; font-size: var(--text-xs); }
.detail-footer span { text-transform: uppercase; letter-spacing: var(--tracking-label); }
.detail-footer strong { color: var(--kpi-muted-strong); font-weight: 700; text-align: right; }

/* Projects Archive — Pass 5.1 */
.projects-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(390px, 31%) minmax(0, 69%); }
.projects-identity { position: relative; isolation: isolate; overflow: hidden; color: white; }
.projects-identity-image { position: absolute; inset: 0; z-index: -3; background: url('../../public/projects-offshore.png') 51% center / cover no-repeat; filter: saturate(.68) contrast(1.08); transform: scale(1.015); }
.projects-identity-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(5,27,42,.62), rgba(5,27,42,.95)), linear-gradient(90deg, rgba(5,27,42,.82), rgba(5,27,42,.18)); }
.projects-breadcrumb { position: absolute; top: 30px; right: 30px; left: var(--page-gutter); display: flex; gap: 9px; color: rgba(255,255,255,.7); font-size: var(--text-xs); }
.projects-breadcrumb strong { color: white; }
.projects-identity-copy { position: absolute; right: 42px; bottom: clamp(44px, 7vh, 76px); left: var(--page-gutter); max-width: 520px; }
.projects-kicker { display: flex; align-items: center; gap: 11px; margin-bottom: 22px; color: #dcebed; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.projects-kicker i { width: 32px; height: 2px; background: var(--kpi-teal-400); }
.projects-identity h1 { margin: 0; color: white; font-size: clamp(42px, 3.55vw, 59px); font-weight: 600; line-height: 1; letter-spacing: -.052em; }
.projects-identity h1 em { color: #5bd0c4; font-style: normal; }
.projects-identity-copy > p { max-width: 470px; margin: 27px 0 29px; color: rgba(242,248,248,.92); font-size: clamp(16px, 1.1vw, 18px); line-height: var(--leading-copy); }
.projects-period { display: flex; align-items: center; gap: 20px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.28); }
.projects-period div { display: flex; flex-direction: column; }
.projects-period strong { color: white; font-size: 20px; }
.projects-period span { margin-top: 4px; color: rgba(255,255,255,.66); font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.projects-period b { color: var(--kpi-teal-400); font-size: 18px; font-weight: 400; }

.projects-directory { display: flex; min-width: 0; flex-direction: column; padding: clamp(26px, 3.3vh, 40px) clamp(38px, 4vw, 66px) 18px; overflow: hidden; background: radial-gradient(circle at 100% 0%, rgba(18,119,168,.06), transparent 35%), var(--paper); }
.projects-heading { display: grid; grid-template-columns: 1.08fr .92fr; align-items: end; gap: clamp(28px, 3vw, 50px); margin-bottom: clamp(17px, 2.2vh, 25px); padding-bottom: clamp(16px, 1.9vh, 21px); border-bottom: 1px solid var(--line); }
.projects-heading h2 { margin: 0; color: var(--navy); font-size: clamp(29px, 2.25vw, 38px); font-weight: 650; line-height: 1.04; letter-spacing: -.04em; }
.projects-heading p { max-width: 400px; margin: 0 0 3px; color: #526b78; font-size: 14.5px; line-height: 1.56; }
.project-year-grid { flex: 1; min-height: 400px; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); gap: 9px; }
.project-year-card { position: relative; isolation: isolate; min-width: 0; overflow: hidden; color: white; background: var(--navy); border: 1px solid rgba(255,255,255,.36); box-shadow: 0 5px 16px rgba(18,45,60,.07); transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base); }
.project-year-card::before { content: ""; position: absolute; top: 0; right: 0; left: 0; z-index: 3; height: 3px; background: var(--teal); transform: scaleX(.25); transform-origin: left; transition: transform var(--transition-base); }
.project-year-card img { z-index: -2; object-fit: cover; filter: saturate(.62) contrast(1.06); transition: transform .45s ease, filter .35s ease; }
.project-year-shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(4,25,39,.18), rgba(4,25,39,.92)); }
.project-year-index { position: absolute; top: 11px; left: 12px; color: rgba(255,255,255,.67); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.project-year-status { position: absolute; top: 10px; right: 9px; display: flex; align-items: center; gap: 5px; color: white; font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.project-year-status i { width: 5px; height: 5px; background: #5bd0c4; border-radius: 50%; box-shadow: 0 0 0 3px rgba(91,208,196,.16); }
.project-year-card > strong { position: absolute; right: 10px; bottom: 36px; left: 11px; font-size: clamp(20px, 1.55vw, 26px); font-weight: 650; letter-spacing: -.04em; }
.project-year-link { position: absolute; right: 10px; bottom: 11px; left: 11px; color: rgba(255,255,255,.68); font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.project-year-link b { float: right; color: #5bd0c4; font-size: 14px; }
.project-year-card.current { border-color: rgba(91,208,196,.64); }
.project-year-card.current::before { transform: scaleX(1); background: #5bd0c4; }
.project-year-card:hover { z-index: 2; transform: translateY(-3px); border-color: rgba(91,208,196,.72); box-shadow: var(--shadow-card-hover); }
.project-year-card:hover::before { transform: scaleX(1); }
.project-year-card:hover img { transform: scale(1.06); filter: saturate(.86) contrast(1.06); }
.projects-footer { height: 36px; flex: 0 0 36px; display: flex; align-items: end; justify-content: space-between; color: #667e89; font-size: var(--text-xs); }
.projects-footer span { display: flex; align-items: center; gap: 9px; }
.projects-footer i { width: 6px; height: 6px; background: var(--teal); border-radius: 50%; }
.projects-footer strong { color: var(--navy); letter-spacing: .08em; }

/* Project Year — Pass 5.2, list-first representative template */
.project-year-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(360px, 29%) minmax(0, 71%); }
.project-year-identity { position: relative; isolation: isolate; overflow: hidden; color: white; }
.project-year-identity-image { position: absolute; inset: 0; z-index: -3; background: url('../../public/projects-offshore.png') 55% center / cover no-repeat; filter: saturate(.62) contrast(1.08); transform: scale(1.02); }
.project-year-identity-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(5,27,42,.66), rgba(5,27,42,.96)), linear-gradient(90deg, rgba(5,27,42,.84), rgba(5,27,42,.2)); }
.project-year-breadcrumb { position: absolute; top: 29px; right: 28px; left: var(--page-gutter); display: flex; flex-wrap: wrap; gap: 8px; color: rgba(255,255,255,.68); font-size: var(--text-xs); }
.project-year-breadcrumb strong { color: white; }
.project-year-identity-copy { position: absolute; right: 38px; bottom: clamp(100px, 13vh, 140px); left: var(--page-gutter); max-width: 470px; }
.project-year-kicker { display: flex; align-items: center; gap: 11px; margin-bottom: 22px; color: #dcebed; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.project-year-kicker i { width: 32px; height: 2px; background: var(--kpi-teal-400); }
.project-year-identity h1 { margin: 0; color: white; font-size: clamp(50px, 4.5vw, 72px); font-weight: 600; line-height: .94; letter-spacing: -.058em; }
.project-year-identity h1 em { color: #5bd0c4; font-style: normal; }
.project-year-identity-copy > p { max-width: 450px; margin: 24px 0 19px; color: rgba(242,248,248,.92); font-size: clamp(16px, 1.08vw, 18px); line-height: 1.55; }
.project-year-badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 10px; color: white; background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.24); font-size: var(--text-xs); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.project-year-badge i { width: 6px; height: 6px; background: #5bd0c4; border-radius: 50%; }
.project-year-back { position: absolute; bottom: 31px; left: var(--page-gutter); min-height: 44px; display: inline-flex; align-items: center; gap: 11px; color: rgba(255,255,255,.76); font-size: var(--text-sm); font-weight: 800; }
.project-year-back span { color: #5bd0c4; font-size: 18px; }

.project-list-panel { display: flex; min-width: 0; flex-direction: column; padding: clamp(26px, 3.25vh, 40px) clamp(38px, 4vw, 66px) 18px; overflow: hidden; background: radial-gradient(circle at 100% 0%, rgba(18,119,168,.055), transparent 34%), var(--paper); }
.project-list-heading { display: grid; grid-template-columns: 1.08fr .92fr; align-items: end; gap: clamp(28px, 3vw, 50px); margin-bottom: clamp(17px, 2.2vh, 25px); padding-bottom: clamp(16px, 1.9vh, 21px); border-bottom: 1px solid var(--line); }
.project-list-heading h2 { margin: 0; color: var(--navy); font-size: clamp(29px, 2.25vw, 38px); font-weight: 650; line-height: 1.04; letter-spacing: -.04em; }
.project-list-heading p { max-width: 410px; margin: 0 0 3px; color: #526b78; font-size: 14.5px; line-height: 1.56; }
.project-list-table { flex: 1; min-height: 390px; display: flex; flex-direction: column; overflow: hidden; background: rgba(255,255,255,.74); border: 1px solid var(--line); box-shadow: 0 5px 18px rgba(18,45,60,.04); }
.project-list-header, .project-list-row { display: grid; grid-template-columns: 48px minmax(220px, 1.55fr) minmax(150px, 1fr) minmax(140px, .9fr) 128px; align-items: center; column-gap: 14px; }
.project-list-header { min-height: 42px; padding: 0 17px; color: #607783; background: #edf1ef; border-bottom: 1px solid var(--line); font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.project-list-body { flex: 1; display: grid; grid-template-rows: repeat(6, minmax(0, 1fr)); min-height: 0; }
.project-list-row { min-height: 0; padding: 5px 17px; border-top: 1px solid var(--line); transition: background var(--transition-fast), transform var(--transition-fast); }
.project-list-row:first-child { border-top: 0; }
.project-list-row:hover { z-index: 1; background: white; box-shadow: inset 3px 0 0 var(--teal); }
.project-row-number { color: var(--teal); font-size: var(--text-xs); font-weight: 800; letter-spacing: .08em; }
.project-list-row strong { min-width: 0; color: var(--navy); font-size: 14px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.project-list-row > span:not(.project-row-number):not(.project-row-status) { min-width: 0; color: #5d727d; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.project-row-status { display: inline-flex; align-items: center; gap: 7px; color: #6c7e86; font-size: 9px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.project-row-status i { width: 5px; height: 5px; background: var(--amber); border-radius: 50%; }
.project-row-status b { margin-left: auto; color: var(--teal); font-size: 13px; }
.project-list-footer { height: 38px; flex: 0 0 38px; display: flex; align-items: end; justify-content: space-between; color: #667e89; font-size: var(--text-xs); }
.project-list-footer > span { display: flex; align-items: center; gap: 9px; }
.project-list-footer i { width: 6px; height: 6px; background: var(--teal); border-radius: 50%; }
.project-list-footer a { color: var(--navy); font-weight: 800; text-transform: uppercase; letter-spacing: var(--tracking-label); }
.project-list-footer a b { margin-left: 10px; color: var(--teal); font-size: 16px; }

.project-year-stage-showcase .project-year-identity-image { background-position: 62% center; filter: saturate(.52) contrast(1.08); }
.project-showcase-panel { display: flex; min-width: 0; flex-direction: column; gap: 16px; padding: clamp(22px, 2.45vh, 30px) clamp(28px, 3vw, 42px) 14px; overflow-y: auto; background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(252,253,253,.96)), var(--paper); }
.project-showcase-heading { display: block; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.project-showcase-heading h2 { margin: 0; color: var(--navy); font-size: clamp(20px, 1.5vw, 26px); font-weight: 650; line-height: 1; letter-spacing: -.04em; }
.project-caseboard, .project-logo-section { display: grid; gap: 12px; }
.project-showcase-section-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-bottom: 9px; border-bottom: 1px solid var(--line); }
.project-showcase-section-head strong { color: #68808b; font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.project-showcase-section-head-logos { align-items: flex-end; padding-bottom: 12px; }
.project-logo-heading-copy p { max-width: 520px; margin: 8px 0 0; color: #607985; font-size: 13px; line-height: 1.55; }
.project-showcase-section-head-logos strong { display: inline-flex; align-items: baseline; gap: 7px; color: #5f7884; }
.project-showcase-section-head-logos strong b { color: var(--navy); font-size: 18px; letter-spacing: -.04em; }
.project-case-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-flow: dense; gap: 10px; }
.project-case-card { position: relative; isolation: isolate; min-height: 138px; display: flex; flex-direction: column; justify-content: flex-end; padding: 13px 13px 12px; overflow: hidden; border: 1px solid rgba(15,52,72,.18); background: #122b3a; box-shadow: inset 0 0 0 1px rgba(255,255,255,.04); }
.project-case-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(7,26,37,.08), rgba(7,26,37,.88)), linear-gradient(135deg, rgba(9,35,51,.54), rgba(9,35,51,.18)); }
.project-case-card::after { content: ""; position: absolute; inset: 0; z-index: -2; background: var(--project-case-image) center / cover no-repeat; transform: scale(1.02); filter: saturate(.52) contrast(1.04) brightness(.92); }
.project-case-card strong { display: block; max-width: 16ch; margin-top: 9px; color: white; font-size: clamp(17px, 1.04vw, 21px); font-weight: 620; line-height: 1.08; letter-spacing: -.035em; text-wrap: balance; }
.project-case-card p { margin: 8px 0 0; color: rgba(232,242,245,.8); font-size: 11px; line-height: 1.35; }
.project-case-meta { color: rgba(232,242,245,.58); font-size: 7.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.project-case-card.layout-feature { grid-column: span 2; min-height: 162px; }
.project-case-card.layout-wide { grid-column: span 2; min-height: 138px; }
.project-case-card.layout-standard { grid-column: span 1; }
.project-case-card.shift-up { transform: translateY(-6px); }
.project-case-card.shift-down { transform: translateY(6px); }
.project-case-card.shift-none { transform: none; }
.project-case-card.tone-teal::before { background: linear-gradient(180deg, rgba(8,39,42,.12), rgba(8,39,42,.78)), linear-gradient(135deg, rgba(17,120,109,.52), rgba(17,120,109,.12)); }
.project-case-card.tone-sky::before { background: linear-gradient(180deg, rgba(8,33,46,.12), rgba(8,33,46,.8)), linear-gradient(135deg, rgba(25,114,170,.54), rgba(25,114,170,.12)); }
.project-case-card.tone-ink::before { background: linear-gradient(180deg, rgba(11,31,43,.1), rgba(11,31,43,.84)), linear-gradient(135deg, rgba(54,87,111,.54), rgba(54,87,111,.1)); }
.project-case-card.tone-sand::before { background: linear-gradient(180deg, rgba(46,31,14,.12), rgba(46,31,14,.76)), linear-gradient(135deg, rgba(195,135,63,.5), rgba(195,135,63,.08)); }
.project-logo-cluster { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-flow: dense; align-items: stretch; gap: 12px; padding-top: 2px; }
.project-logo-card { position: relative; min-height: 124px; display: flex; flex-direction: column; justify-content: space-between; gap: 14px; padding: 14px; background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(247,250,251,.92)); border: 1px solid rgba(15,52,72,.12); box-shadow: 0 14px 30px rgba(11,36,52,.08), inset 0 1px 0 rgba(255,255,255,.82); transition: transform var(--transition-fast), box-shadow var(--transition-fast), border-color var(--transition-fast); }
.project-logo-card::before { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(15,111,106,.05), transparent 48%, rgba(18,44,62,.03)); pointer-events: none; }
.project-logo-card:hover { transform: translateY(-3px); border-color: rgba(15,52,72,.22); box-shadow: 0 20px 34px rgba(11,36,52,.12), inset 0 1px 0 rgba(255,255,255,.9); }
.project-logo-card-inner { min-height: 76px; display: flex; align-items: center; justify-content: center; padding: 6px 8px; background: rgba(255,255,255,.72); border: 1px solid rgba(15,52,72,.06); }
.project-logo-card img { max-width: 100%; max-height: 48px; object-fit: contain; filter: saturate(.96) contrast(1.01); mix-blend-mode: multiply; }
.project-logo-card figcaption { position: relative; color: var(--navy); font-size: 11px; font-weight: 700; line-height: 1.35; letter-spacing: .01em; text-wrap: balance; }
.project-logo-card.span-8 { grid-column: span 8; min-height: 94px; }
.project-logo-card.span-6 { grid-column: span 6; min-height: 92px; }
.project-logo-card.span-5 { grid-column: span 5; min-height: 90px; }
.project-logo-card.span-4 { grid-column: span 4; }
.project-logo-card.span-3 { grid-column: span 3; min-height: 82px; }
.project-logo-card.offset-none { transform: none; }
.project-logo-card.offset-down { transform: translateY(5px); }
.project-logo-card.offset-up { transform: translateY(-4px); }
.project-logo-card.offset-down-soft { transform: translateY(3px); }
.project-logo-card.offset-up-soft { transform: translateY(-2px); }
.project-showcase-footer { min-height: 30px; display: flex; align-items: end; justify-content: space-between; gap: 20px; padding-top: 2px; color: #667e89; font-size: var(--text-xs); }
.project-showcase-footer span { display: flex; align-items: center; gap: 9px; }
.project-showcase-footer i { width: 6px; height: 6px; background: var(--teal); border-radius: 50%; }
.project-showcase-actions { display: flex; justify-content: center; gap: 8px; padding-top: 2px; }
.project-showcase-backlink { min-height: 30px; display: inline-flex; align-items: center; justify-content: center; padding: 0 12px; color: #556d79; background: rgba(255,255,255,.72); border: 1px solid rgba(15,52,72,.12); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; transition: color var(--transition-fast), border-color var(--transition-fast), background var(--transition-fast); }
.project-showcase-backlink:hover { color: var(--navy); border-color: rgba(15,52,72,.24); background: white; }
.project-showcase-backlink.is-secondary { color: #6a808b; background: rgba(255,255,255,.52); }

/* Single Project — Pass 5.3 representative template */
.single-project-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(350px, 28%) minmax(0, 72%); }
.single-project-identity { position: relative; isolation: isolate; overflow: hidden; color: white; }
.single-project-identity-image { position: absolute; inset: 0; z-index: -3; background: url('../../public/projects-offshore.png') 58% center / cover no-repeat; filter: saturate(.55) contrast(1.1); transform: scale(1.02); }
.single-project-identity-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(5,27,42,.7), rgba(5,27,42,.97)), linear-gradient(90deg, rgba(5,27,42,.86), rgba(5,27,42,.22)); }
.single-project-breadcrumb { position: absolute; top: 29px; right: 26px; left: var(--page-gutter); display: flex; flex-wrap: wrap; gap: 7px; color: rgba(255,255,255,.66); font-size: var(--text-xs); }
.single-project-breadcrumb strong { color: white; }
.single-project-identity-copy { position: absolute; right: 36px; bottom: clamp(103px, 14vh, 145px); left: var(--page-gutter); max-width: 460px; }
.single-project-kicker { display: flex; align-items: center; gap: 11px; margin-bottom: 22px; color: #dcebed; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.single-project-kicker i { width: 32px; height: 2px; background: var(--kpi-teal-400); }
.single-project-identity h1 { margin: 0; color: white; font-size: clamp(43px, 3.7vw, 61px); font-weight: 600; line-height: .98; letter-spacing: -.055em; }
.single-project-identity h1 em { color: #5bd0c4; font-style: normal; }
.single-project-identity-copy > p { margin: 22px 0 18px; color: rgba(242,248,248,.9); font-size: clamp(16px, 1.08vw, 18px); line-height: 1.52; }
.single-project-level { display: inline-flex; padding: 8px 10px; color: white; background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.24); font-size: var(--text-xs); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.single-project-back { position: absolute; bottom: 31px; left: var(--page-gutter); min-height: 44px; display: inline-flex; align-items: center; gap: 11px; color: rgba(255,255,255,.76); font-size: var(--text-sm); font-weight: 800; }
.single-project-back span { color: #5bd0c4; font-size: 18px; }

.single-project-content { display: grid; min-width: 0; grid-template-rows: auto auto minmax(0, 1fr) auto auto; gap: clamp(14px, 1.9vh, 21px); padding: clamp(25px, 3.15vh, 38px) clamp(38px, 4vw, 66px) 18px; overflow: hidden; background: radial-gradient(circle at 100% 0%, rgba(19,137,125,.055), transparent 34%), var(--paper); }
.single-project-heading { display: grid; grid-template-columns: 1.15fr .85fr; align-items: end; gap: clamp(28px, 3.2vw, 52px); padding-bottom: clamp(16px, 1.9vh, 21px); border-bottom: 1px solid var(--line); }
.single-project-heading h2 { max-width: 760px; margin: 0; color: var(--navy); font-size: clamp(29px, 2.22vw, 37px); font-weight: 650; line-height: 1.07; letter-spacing: -.04em; }
.single-project-heading > p { max-width: 400px; margin: 0 0 3px; color: #526b78; font-size: 14.5px; line-height: 1.58; }
.single-project-summary { display: grid; grid-template-columns: 1.16fr .84fr; gap: clamp(30px, 3.5vw, 58px); }
.single-project-summary p { margin: 0; color: #526b78; font-size: 14.5px; line-height: 1.6; }
.single-project-summary .single-project-lead { color: var(--ink); font-size: clamp(17px, 1.15vw, 20px); font-weight: 500; line-height: 1.52; }
.single-project-facts { min-height: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.single-project-facts article { position: relative; min-width: 0; padding: clamp(17px, 2.1vh, 23px) clamp(14px, 1.45vw, 23px) 14px; border-left: 1px solid var(--line); }
.single-project-facts article:first-child { padding-left: 0; border-left: 0; }
.single-project-facts article:last-child { padding-right: 0; }
.single-project-facts article > span { position: absolute; top: 16px; right: 16px; color: #6f8b91; font-size: var(--text-xs); font-weight: 800; letter-spacing: .11em; }
.single-project-facts small { display: block; margin-bottom: 10px; color: var(--teal); font-size: var(--text-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.single-project-facts strong { display: block; color: var(--navy); font-size: clamp(16px, 1.12vw, 19px); font-weight: 650; line-height: 1.2; }
.single-project-facts p { margin: 10px 0 0; color: #5d727d; font-size: 12.5px; line-height: 1.46; }
.single-project-note { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 12px 16px 12px 18px; background: white; border-left: 3px solid var(--teal); box-shadow: 0 5px 18px rgba(18,45,60,.045); }
.single-project-note .section-label { margin-bottom: 4px; }
.single-project-note p { max-width: 720px; margin: 0; color: #5d727d; font-size: 13px; line-height: 1.45; }
.single-project-note a { flex: 0 0 auto; min-height: 44px; display: inline-flex; align-items: center; padding: 0 15px; color: white; background: var(--navy); font-size: var(--text-xs); font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.single-project-note a b { margin-left: 12px; color: #5bd0c4; font-size: 17px; }
.single-project-footer { min-height: 25px; display: flex; align-items: end; justify-content: space-between; gap: 28px; color: #667e89; font-size: var(--text-xs); }
.single-project-footer span { text-transform: uppercase; letter-spacing: var(--tracking-label); }
.single-project-footer strong { color: var(--kpi-muted-strong); text-align: right; }

/* Insights Archive — Pass 5.4 */
.insights-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(390px, 31%) minmax(0, 69%); }
.insights-identity { position: relative; isolation: isolate; overflow: hidden; color: white; }
.insights-identity-image { position: absolute; inset: 0; z-index: -3; background: url('../../public/insights-geothermal.png') 54% center / cover no-repeat; filter: saturate(.65) contrast(1.08); transform: scale(1.015); }
.insights-identity-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(5,27,42,.62), rgba(5,27,42,.95)), linear-gradient(90deg, rgba(5,27,42,.82), rgba(5,27,42,.18)); }
.insights-breadcrumb { position: absolute; top: 30px; right: 30px; left: var(--page-gutter); display: flex; gap: 9px; color: rgba(255,255,255,.7); font-size: var(--text-xs); }
.insights-breadcrumb strong { color: white; }
.insights-identity-copy { position: absolute; right: 42px; bottom: clamp(44px, 7vh, 76px); left: var(--page-gutter); max-width: 520px; }
.insights-kicker { display: flex; align-items: center; gap: 11px; margin-bottom: 22px; color: #e8e3d2; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.insights-kicker i { width: 32px; height: 2px; background: var(--amber); }
.insights-identity h1 { margin: 0; color: white; font-size: clamp(42px, 3.55vw, 59px); font-weight: 600; line-height: 1; letter-spacing: -.052em; }
.insights-identity h1 em { color: #f0b35e; font-style: normal; }
.insights-identity-copy > p { max-width: 480px; margin: 27px 0 28px; color: rgba(242,248,248,.92); font-size: clamp(16px, 1.1vw, 18px); line-height: var(--leading-copy); }
.insights-scope { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; padding-top: 19px; border-top: 1px solid rgba(255,255,255,.28); color: rgba(255,255,255,.74); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.insights-scope b { color: #f0b35e; }

.insights-directory { display: flex; min-width: 0; flex-direction: column; padding: clamp(26px, 3.3vh, 40px) clamp(38px, 4vw, 66px) 18px; overflow: hidden; background: radial-gradient(circle at 100% 0%, rgba(215,139,40,.06), transparent 35%), var(--paper); }
.insights-heading { display: grid; grid-template-columns: 1.08fr .92fr; align-items: end; gap: clamp(28px, 3vw, 50px); margin-bottom: clamp(17px, 2.2vh, 25px); padding-bottom: clamp(16px, 1.9vh, 21px); border-bottom: 1px solid var(--line); }
.insights-heading h2 { margin: 0; color: var(--navy); font-size: clamp(29px, 2.25vw, 38px); font-weight: 650; line-height: 1.04; letter-spacing: -.04em; }
.insights-heading p { max-width: 410px; margin: 0 0 3px; color: #526b78; font-size: 14.5px; line-height: 1.56; }
.insights-layout { flex: 1; min-height: 400px; display: grid; grid-template-columns: minmax(310px, .92fr) minmax(420px, 1.08fr); gap: 14px; }
.insight-feature { min-width: 0; display: grid; grid-template-rows: 48% 52%; overflow: hidden; background: white; border: 1px solid var(--line); box-shadow: 0 6px 20px rgba(18,45,60,.06); }
.insight-feature-image { position: relative; min-height: 0; overflow: hidden; background: #dbe3e3; }
.insight-feature-image img { object-fit: cover; filter: saturate(.72) contrast(1.04); }
.insight-feature-image i { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 35%, rgba(4,31,46,.55)); }
.insight-feature-content { display: flex; min-height: 0; flex-direction: column; padding: clamp(16px, 1.8vh, 21px) 20px 16px; border-top: 3px solid var(--amber); }
.insight-meta { color: #a96816; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.insight-feature-content > strong { margin-top: 9px; color: var(--navy); font-size: clamp(20px, 1.45vw, 25px); line-height: 1.12; letter-spacing: -.03em; }
.insight-feature-content > p { margin: 9px 0 0; color: #5d727d; font-size: 13px; line-height: 1.48; }
.insight-pending { margin-top: auto; padding-top: 9px; color: #536b77; border-top: 1px solid var(--line); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.insight-pending b { float: right; color: var(--amber); font-size: 15px; }
.insight-list { min-width: 0; display: grid; grid-template-rows: repeat(5, minmax(0, 1fr)); border: 1px solid var(--line); background: rgba(255,255,255,.7); }
.insight-row { position: relative; min-width: 0; display: grid; grid-template-columns: 118px 1fr; gap: 15px; padding: 9px 38px 9px 9px; border-top: 1px solid var(--line); transition: background var(--transition-fast); }
.insight-row:first-child { border-top: 0; }
.insight-row:hover { background: white; box-shadow: inset 3px 0 0 var(--amber); }
.insight-row-image { position: relative; min-height: 0; overflow: hidden; background: #dbe3e3; }
.insight-row-image img { object-fit: cover; filter: saturate(.63); }
.insight-row-image i { position: absolute; inset: 0; background: linear-gradient(180deg, transparent, rgba(4,31,46,.38)); }
.insight-row-copy { min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.insight-row-copy small { color: #a96816; font-size: 8px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.insight-row-copy strong { margin-top: 4px; color: var(--navy); font-size: 14px; line-height: 1.22; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.insight-row-copy span { margin-top: 5px; color: #738791; font-size: 9px; font-weight: 700; }
.insight-row-number { position: absolute; top: 12px; right: 12px; color: #91a0a6; font-size: 9px; letter-spacing: .1em; }
.insights-footer { height: 36px; flex: 0 0 36px; display: flex; align-items: end; justify-content: space-between; color: #667e89; font-size: var(--text-xs); }
.insights-footer span { display: flex; align-items: center; gap: 9px; }
.insights-footer i { width: 6px; height: 6px; background: var(--amber); border-radius: 50%; }
.insights-footer strong { color: var(--kpi-muted-strong); font-weight: 700; }

/* Shared dynamic archive controls — filter + numbered pagination */
.archive-toolbar { min-height: 36px; display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: -8px 0 12px; }
.archive-filters { min-width: 0; display: flex; align-items: center; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.archive-filters::-webkit-scrollbar { display: none; }
.archive-filters button, .archive-pagination button { appearance: none; border: 1px solid var(--line); color: #5d727d; background: rgba(255,255,255,.72); font: inherit; cursor: pointer; transition: color var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast); }
.archive-filters button { min-height: 30px; flex: 0 0 auto; padding: 0 11px; font-size: 9px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.archive-filters button:hover, .archive-filters button.active { color: white; background: var(--navy); border-color: var(--navy); }
.insights-toolbar .archive-filters button:hover, .insights-toolbar .archive-filters button.active { background: #9a5e13; border-color: #9a5e13; }
.archive-result-count { flex: 0 0 auto; color: #738791; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.archive-pagination { display: flex; align-items: center; gap: 4px; }
.archive-pagination button { min-width: 27px; height: 27px; padding: 0 7px; font-size: 9px; font-weight: 800; }
.archive-pagination button:first-child, .archive-pagination button:last-child { padding: 0 9px; text-transform: uppercase; letter-spacing: .06em; }
.archive-pagination button:hover:not(:disabled), .archive-pagination button.active { color: white; background: var(--navy); border-color: var(--navy); }
.insights-footer .archive-pagination button:hover:not(:disabled), .insights-footer .archive-pagination button.active { background: #9a5e13; border-color: #9a5e13; }
.archive-pagination button:disabled { opacity: .38; cursor: default; }
.archive-empty { min-height: 100%; display: grid; place-items: center; color: #738791; font-size: 12px; }

/* Global Navigation & Click Flow — Pass 5.9 */
.main-nav { overflow: visible; }
.nav-dropdown { position: relative; height: 100%; display: flex; align-items: center; }
.nav-dropdown > a { height: 100%; display: flex; align-items: center; }
.nav-dropdown-panel { position: absolute; z-index: 80; top: calc(100% - 1px); left: -18px; width: 310px; padding: 11px; visibility: hidden; opacity: 0; transform: translateY(8px); background: rgba(255,255,255,.98); border: 1px solid var(--line); border-top: 3px solid var(--kpi-blue-600); box-shadow: 0 18px 42px rgba(5,27,42,.17); transition: opacity var(--transition-fast), transform var(--transition-fast), visibility var(--transition-fast); }
.nav-dropdown-right .nav-dropdown-panel { right: -12px; left: auto; width: 245px; }
.nav-dropdown:hover .nav-dropdown-panel, .nav-dropdown:focus-within .nav-dropdown-panel { visibility: visible; opacity: 1; transform: translateY(0); }
.nav-menu-label { display: block; padding: 4px 8px 9px; color: #79909a; font-size: 8px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.nav-dropdown-panel > a { min-height: 47px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 7px 9px; color: var(--navy); border-top: 1px solid var(--line); transition: color var(--transition-fast), background var(--transition-fast), padding-left var(--transition-fast); }
.nav-dropdown-panel > a:hover, .nav-dropdown-panel > a:focus-visible { padding-left: 13px; color: var(--kpi-blue-700); background: #eef4f3; }
.nav-dropdown-panel strong { font-size: 11px; font-weight: 750; }
.nav-dropdown-panel small { margin-top: 3px; color: #788d96; font-size: 8px; font-weight: 650; }
.nav-menu-pending { display: flex; align-items: center; gap: 7px; margin-top: 8px; padding: 8px 9px; color: #617984; background: #edf2f1; font-size: 8px; font-weight: 750; }
.nav-menu-pending i { width: 5px; height: 5px; background: var(--kpi-blue-500); border-radius: 50%; }
.projects-toolbar { margin-bottom: 10px; }
.projects-toolbar + .project-year-grid { min-height: 0; }
.project-list-toolbar { margin-bottom: 10px; }
.project-list-toolbar + .project-list-table { min-height: 0; }

/* Single Insight — Pass 5.5, fixed viewport with internal reading scroll */
.single-insight-shell { height: 100vh; overflow: hidden; }
.single-insight-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(390px, 31%) minmax(0, 69%); overflow: hidden; }
.single-insight-identity { position: relative; isolation: isolate; overflow: hidden; color: white; }
.single-insight-identity-image { position: absolute; inset: 0; z-index: -3; }
.single-insight-identity-image img { object-fit: cover; filter: saturate(.65) contrast(1.08); }
.single-insight-identity-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(5,27,42,.57), rgba(5,27,42,.96)), linear-gradient(90deg, rgba(5,27,42,.84), rgba(5,27,42,.17)); }
.single-insight-breadcrumb { position: absolute; top: 30px; right: 28px; left: var(--page-gutter); display: flex; flex-wrap: wrap; gap: 8px; color: rgba(255,255,255,.68); font-size: var(--text-xs); }
.single-insight-breadcrumb strong { color: white; }
.single-insight-identity-copy { position: absolute; right: 38px; bottom: clamp(92px, 12vh, 128px); left: var(--page-gutter); max-width: 500px; }
.single-insight-kicker { display: flex; align-items: center; gap: 11px; margin-bottom: 21px; color: #f0dfc7; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.single-insight-kicker i { width: 32px; height: 2px; background: var(--amber); }
.single-insight-identity h1 { margin: 0; color: white; font-size: clamp(39px, 3.25vw, 54px); font-weight: 600; line-height: 1; letter-spacing: -.052em; }
.single-insight-identity h1 em { color: #f0b35e; font-style: normal; }
.single-insight-identity h1.single-insight-plan-title { font-size: clamp(34px, 2.8vw, 47px); line-height: 1.04; }
.single-insight-identity-copy > p { margin: 25px 0 22px; color: rgba(242,248,248,.91); font-size: clamp(16px, 1.05vw, 18px); line-height: 1.58; }
.single-insight-meta { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 17px; border-top: 1px solid rgba(255,255,255,.28); color: rgba(255,255,255,.7); font-size: 9px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.single-insight-meta b { color: #f0b35e; }
.single-insight-back { position: absolute; bottom: 30px; left: var(--page-gutter); display: flex; align-items: center; gap: 11px; color: rgba(255,255,255,.76); font-size: var(--text-sm); font-weight: 800; }
.single-insight-back span { color: #f0b35e; font-size: 18px; }
.single-insight-reading-panel { min-width: 0; min-height: 0; display: flex; flex-direction: column; padding: clamp(26px, 3.3vh, 40px) clamp(38px, 4vw, 66px) 18px; background: radial-gradient(circle at 100% 0%, rgba(215,139,40,.06), transparent 35%), var(--paper); }
.single-insight-reading-header { flex: 0 0 auto; display: grid; grid-template-columns: 1.08fr .92fr; align-items: end; gap: clamp(28px, 3vw, 50px); margin-bottom: 15px; padding-bottom: clamp(15px, 1.8vh, 20px); border-bottom: 1px solid var(--line); }
.single-insight-reading-header h2 { margin: 0; color: var(--navy); font-size: clamp(29px, 2.25vw, 38px); font-weight: 650; line-height: 1.04; letter-spacing: -.04em; }
.single-insight-reading-header > p { max-width: 410px; margin: 0 0 3px; color: #526b78; font-size: 14px; line-height: 1.55; }
.single-insight-scroll { min-height: 0; flex: 1; overflow-y: auto; overscroll-behavior: contain; scroll-behavior: smooth; padding: 4px 18px 20px 0; scrollbar-color: var(--amber) #dfe6e4; scrollbar-width: thin; }
.single-insight-scroll > * { width: min(100%, 840px); }
.single-insight-scroll:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; }
.single-insight-scroll::-webkit-scrollbar { width: 7px; }
.single-insight-scroll::-webkit-scrollbar-track { background: #dfe6e4; }
.single-insight-scroll::-webkit-scrollbar-thumb { background: var(--amber); }
.single-insight-intro { max-width: 840px; padding: 14px 0 38px; border-bottom: 1px solid var(--line); }
.single-insight-lead { margin: 0 0 18px; color: var(--navy); font-size: clamp(22px, 1.65vw, 29px); font-weight: 550; line-height: 1.38; letter-spacing: -.03em; }
.single-insight-intro > p:last-child, .single-insight-section p { color: #526b78; font-size: 14.5px; line-height: 1.72; }
.single-insight-section { max-width: 840px; display: block; padding: 38px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 12px; }
.single-insight-section-number { display: none; }
.single-insight-section h3, .single-insight-relations h3 { margin: 10px 0 17px; color: var(--navy); font-size: clamp(25px, 2vw, 34px); font-weight: 620; line-height: 1.1; letter-spacing: -.04em; }
.single-insight-section p { margin: 0; max-width: 68ch; }
.single-insight-section p + p { margin-top: 16px; }
.single-insight-section blockquote { margin: 25px 0 0; padding: 21px 23px; color: var(--navy); background: white; border-left: 3px solid var(--amber); font-size: 16px; font-weight: 550; line-height: 1.55; }
.single-insight-figure { max-width: 840px; margin: 38px 0 0; }
.single-insight-figure > span { position: relative; display: block; min-height: 300px; overflow: hidden; }
.single-insight-figure img { object-fit: cover; filter: saturate(.7) contrast(1.04); }
.single-insight-figure figcaption { margin-top: 10px; color: #748993; font-size: 10px; }
.single-insight-relations { max-width: 840px; margin-top: 38px; padding: 28px; background: #e9efed; border-top: 3px solid var(--teal); }
.single-insight-relations h3 { margin-bottom: 22px; font-size: 28px; }
.single-insight-relation-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.single-insight-relation-list > span, .single-insight-relation-list > a { padding: 16px; background: white; transition: transform var(--transition-fast), box-shadow var(--transition-fast); }
.single-insight-relation-list > a:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(18,45,60,.08); }
.single-insight-relation-list small { display: block; color: var(--teal); font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.single-insight-relation-list strong { display: block; margin-top: 8px; color: var(--navy); font-size: 14px; }
.single-insight-footer { max-width: 840px; display: flex; justify-content: space-between; gap: 15px; margin-top: 31px; padding-bottom: 4px; }
.single-insight-footer a { min-height: 44px; display: inline-flex; align-items: center; gap: 11px; padding: 0 15px; color: white; background: var(--navy); font-size: 9px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.single-insight-footer a:last-child { background: var(--teal); }
.single-insight-toc { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; margin-top: 28px; padding: 19px 21px; background: white; border-left: 3px solid var(--amber); }
.single-insight-toc > span { grid-column: 1 / -1; margin-bottom: 8px; color: #9a5e13; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.single-insight-toc a { padding: 8px 0; color: var(--navy); border-top: 1px solid var(--line); font-size: 12px; font-weight: 700; }
.single-insight-toc a:hover { color: #9a5e13; }
.single-insight-keypoints { margin-top: 23px; padding: 21px 23px; background: #e9efed; }
.single-insight-keypoints > strong { color: var(--navy); font-size: 14px; }
.single-insight-keypoints ul { margin: 13px 0 0; padding-left: 19px; color: #526b78; font-size: 14px; line-height: 1.65; }
.single-insight-keypoints li + li { margin-top: 7px; }
.single-insight-note { margin-top: 23px; padding: 20px 22px; background: rgba(215,139,40,.09); border-top: 2px solid var(--amber); }
.single-insight-note span { color: #9a5e13; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.single-insight-note p { margin-top: 8px; color: var(--navy); font-weight: 550; }
.single-insight-sequence { margin: 25px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.single-insight-sequence li { display: grid; grid-template-columns: 1fr; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.single-insight-sequence li > span { display: none; }
.single-insight-sequence strong { color: var(--navy); font-size: 14px; }
.single-insight-sequence p { margin-top: 3px; font-size: 13px; line-height: 1.5; }

/* About — Pass 5.6 */
.about-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(410px, 34%) minmax(0, 66%); }
.about-identity { position: relative; overflow: hidden; color: white; }
.about-identity-image { position: absolute; inset: 0; z-index: 0; background: url('../../public/about-hydrogen-power.png') center / cover no-repeat; filter: saturate(.74) contrast(1.06); transform: scale(1.02); }
.about-identity-shade { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(5,27,42,.48), rgba(5,27,42,.93)), linear-gradient(90deg, rgba(5,27,42,.82), rgba(5,27,42,.12)); }
.about-breadcrumb { position: absolute; z-index: 2; top: 30px; right: 28px; left: var(--page-gutter); display: flex; gap: 8px; color: rgba(255,255,255,.68); font-size: var(--text-xs); }
.about-breadcrumb strong { color: white; }
.about-identity-copy { position: absolute; z-index: 2; right: 42px; bottom: clamp(46px, 7vh, 78px); left: var(--page-gutter); max-width: 520px; }
.about-kicker { display: flex; align-items: center; gap: 11px; margin-bottom: 22px; color: #d9edf0; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.about-kicker i { width: 32px; height: 2px; background: var(--kpi-blue-400); }
.about-identity h1 { margin: 0; color: white; font-size: clamp(43px, 3.65vw, 61px); font-weight: 600; line-height: 1; letter-spacing: -.052em; }
.about-identity h1 em { color: #74c9e6; font-style: normal; }
.about-identity-copy > p { margin: 27px 0 25px; color: rgba(242,248,248,.92); font-size: clamp(16px, 1.1vw, 18px); line-height: 1.58; }
.about-established { display: flex; align-items: center; gap: 12px; padding-top: 19px; border-top: 1px solid rgba(255,255,255,.28); color: rgba(255,255,255,.7); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.about-established strong { color: white; font-size: 19px; letter-spacing: -.02em; }
.about-established i { width: 5px; height: 5px; background: #74c9e6; border-radius: 50%; }
.about-content { min-width: 0; display: flex; flex-direction: column; padding: clamp(25px, 3.2vh, 38px) clamp(38px, 4vw, 64px) 17px; overflow: hidden; background: radial-gradient(circle at 100% 0%, rgba(18,119,168,.07), transparent 35%), var(--paper); }
.about-heading { display: grid; grid-template-columns: 1.08fr .92fr; align-items: end; gap: clamp(28px, 3vw, 48px); margin-bottom: clamp(16px, 2vh, 23px); padding-bottom: clamp(15px, 1.8vh, 20px); border-bottom: 1px solid var(--line); }
.about-heading h2 { margin: 0; color: var(--navy); font-size: clamp(29px, 2.18vw, 37px); font-weight: 650; line-height: 1.04; letter-spacing: -.04em; }
.about-heading > p { max-width: 405px; margin: 0 0 3px; color: #526b78; font-size: 14px; line-height: 1.55; }
.about-main-grid { min-height: 0; flex: 1.12; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr); gap: clamp(26px, 3vw, 46px); }
.about-story { min-width: 0; padding: 6px 0 18px; }
.about-lead { margin: 13px 0 15px; color: var(--navy); font-size: clamp(19px, 1.45vw, 25px); font-weight: 550; line-height: 1.4; letter-spacing: -.025em; }
.about-story > p:not(.about-lead) { max-width: 690px; margin: 0; color: #526b78; font-size: 13.5px; line-height: 1.65; }
.about-industry-line { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 19px; padding-top: 15px; border-top: 1px solid var(--line); }
.about-industry-line > span { width: 100%; color: #748993; font-size: 8px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.about-industry-line strong { color: var(--navy); font-size: 11px; }
.about-industry-line i { width: 4px; height: 4px; background: var(--teal); border-radius: 50%; }
.about-facts { min-height: 0; display: grid; grid-template-rows: repeat(3, minmax(0, 1fr)); border: 1px solid var(--line); background: rgba(255,255,255,.72); }
.about-facts article { position: relative; min-height: 0; display: grid; grid-template-columns: 1fr auto; align-content: center; padding: 13px 18px; border-top: 1px solid var(--line); }
.about-facts article:first-child { border-top: 0; }
.about-facts article > span { position: absolute; top: 11px; right: 13px; color: #8da0a8; font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.about-facts small { grid-column: 1 / -1; color: var(--teal); font-size: 8px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.about-facts strong { margin-top: 4px; color: var(--navy); font-size: clamp(17px, 1.2vw, 21px); font-weight: 650; letter-spacing: -.025em; }
.about-facts p { align-self: end; margin: 6px 0 0 12px; color: #71848d; font-size: 9px; }
.about-bottom-grid { min-height: 120px; flex: .78; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr); gap: 12px; margin-top: 13px; }
.about-experience { min-width: 0; padding: 17px 20px; background: white; border-left: 3px solid var(--teal); }
.about-experience h3 { margin: 8px 0 7px; color: var(--navy); font-size: clamp(17px, 1.28vw, 21px); line-height: 1.2; letter-spacing: -.025em; }
.about-experience p { margin: 0; color: #5d727d; font-size: 11.5px; line-height: 1.5; }
.about-certification-card { min-width: 0; display: grid; grid-template-columns: 38% 62%; overflow: hidden; background: var(--navy); color: white; transition: transform var(--transition-base), box-shadow var(--transition-base); }
.about-certification-image { position: relative; min-height: 0; overflow: hidden; }
.about-certification-image img { object-fit: cover; filter: saturate(.58); transition: transform .45s ease; }
.about-certification-image i { position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(5,27,42,.7)); }
.about-certification-copy { display: flex; min-width: 0; flex-direction: column; justify-content: center; padding: 16px 18px; }
.about-certification-copy small { color: #74c9e6; font-size: 8px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.about-certification-copy strong { margin-top: 7px; font-size: clamp(16px, 1.15vw, 20px); line-height: 1.15; }
.about-certification-copy > span { margin-top: auto; padding-top: 12px; color: rgba(255,255,255,.66); border-top: 1px solid rgba(255,255,255,.18); font-size: 8px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.about-certification-copy b { float: right; color: #74c9e6; font-size: 14px; }
.about-certification-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-card-hover); }
.about-certification-card:hover img { transform: scale(1.05); }
.about-footer { height: 34px; flex: 0 0 34px; display: flex; align-items: end; justify-content: space-between; color: #667e89; font-size: var(--text-xs); }
.about-footer > span { display: flex; align-items: center; gap: 8px; }
.about-footer i { width: 6px; height: 6px; background: var(--kpi-blue-600); border-radius: 50%; }
.about-footer a { color: var(--navy); font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.about-footer b { margin-left: 9px; color: var(--teal); font-size: 15px; }

/* Certifications Archive — Pass 5.7 */
.certifications-shell { height: 100vh; overflow: hidden; }
.certifications-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(410px, 34%) minmax(0, 66%); }
.certifications-identity { position: relative; overflow: hidden; color: white; }
.certifications-identity-image { position: absolute; inset: 0; z-index: 0; background: url('../../public/about-hydrogen-power.png') center / cover no-repeat; filter: saturate(.68) contrast(1.06); transform: scale(1.02); }
.certifications-identity-shade { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(5,27,42,.5), rgba(5,27,42,.95)), linear-gradient(90deg, rgba(5,27,42,.84), rgba(5,27,42,.1)); }
.certifications-breadcrumb { position: absolute; z-index: 2; top: 30px; right: 25px; left: var(--page-gutter); display: flex; flex-wrap: wrap; gap: 8px; color: rgba(255,255,255,.65); font-size: var(--text-xs); }
.certifications-breadcrumb strong { color: white; }
.certifications-identity-copy { position: absolute; z-index: 2; right: 42px; bottom: clamp(92px, 12vh, 128px); left: var(--page-gutter); max-width: 520px; }
.certifications-kicker { display: flex; align-items: center; gap: 11px; margin-bottom: 22px; color: #d9edf0; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.certifications-kicker i { width: 32px; height: 2px; background: var(--kpi-blue-400); }
.certifications-identity h1 { margin: 0; color: white; font-size: clamp(42px, 3.55vw, 59px); font-weight: 600; line-height: 1; letter-spacing: -.052em; }
.certifications-identity h1 em { color: #74c9e6; font-style: normal; }
.certifications-identity-copy > p { margin: 27px 0 24px; color: rgba(242,248,248,.91); font-size: clamp(16px, 1.08vw, 18px); line-height: 1.58; }
.certifications-note { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.26); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.certifications-note span { color: rgba(255,255,255,.62); }
.certifications-note strong { color: #74c9e6; }
.certifications-back { position: absolute; bottom: 30px; left: var(--page-gutter); display: flex; align-items: center; gap: 11px; color: rgba(255,255,255,.76); font-size: var(--text-sm); font-weight: 800; }
.certifications-back span { color: #74c9e6; font-size: 18px; }
.certifications-directory { min-width: 0; display: flex; flex-direction: column; padding: clamp(25px, 3.2vh, 38px) clamp(38px, 4vw, 64px) 17px; overflow: hidden; background: radial-gradient(circle at 100% 0%, rgba(18,119,168,.07), transparent 35%), var(--paper); }
.certifications-heading { display: grid; grid-template-columns: 1.08fr .92fr; align-items: end; gap: clamp(28px, 3vw, 48px); margin-bottom: clamp(13px, 1.6vh, 18px); padding-bottom: clamp(14px, 1.7vh, 18px); border-bottom: 1px solid var(--line); }
.certifications-heading h2 { margin: 0; color: var(--navy); font-size: clamp(29px, 2.18vw, 37px); font-weight: 650; line-height: 1.04; letter-spacing: -.04em; }
.certifications-heading > p { max-width: 405px; margin: 0 0 3px; color: #526b78; font-size: 14px; line-height: 1.55; }
.certifications-toolbar { margin: 0 0 11px; }
.certification-filter-pending:disabled { opacity: .52; cursor: not-allowed; }
.certification-grid { min-height: 0; flex: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(3, minmax(0, 1fr)); gap: 9px; }
.certification-record { position: relative; min-width: 0; display: grid; grid-template-columns: 54px minmax(0, 1fr) 18px; align-items: center; gap: 14px; padding: 13px 14px; color: inherit; background: rgba(255,255,255,.77); border: 1px solid var(--line); transition: transform var(--transition-fast), box-shadow var(--transition-fast), border-color var(--transition-fast); }
.certification-seal { width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid #8ca4ad; border-radius: 50%; box-shadow: inset 0 0 0 4px white, inset 0 0 0 5px #cad6d8; background: #edf2f1; }
.certification-seal i { color: var(--teal); font-size: 10px; font-style: normal; font-weight: 900; letter-spacing: .08em; }
.certification-record-copy { min-width: 0; }
.certification-record-copy small { display: block; color: var(--teal); font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.certification-record-copy strong { display: block; margin-top: 6px; color: var(--navy); font-size: clamp(13px, .95vw, 16px); line-height: 1.2; }
.certification-record-copy > span { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; color: #778b94; font-size: 8px; font-weight: 700; }
.certification-record-copy > span i { width: 3px; height: 3px; background: var(--kpi-blue-500); border-radius: 50%; }
.certification-record > b { color: var(--kpi-blue-600); font-size: 15px; }
.certification-record:hover { transform: translateY(-2px); border-color: #a9bdc2; box-shadow: var(--shadow-card-hover); }
.certifications-footer { height: 38px; flex: 0 0 38px; display: flex; align-items: end; justify-content: space-between; color: #667e89; font-size: var(--text-xs); }
.certifications-footer > span { display: flex; align-items: center; gap: 8px; }
.certifications-footer > span i { width: 6px; height: 6px; background: var(--kpi-blue-600); border-radius: 50%; }

/* Certification Detail — Pass 5.8 */
.certification-detail-shell { height: 100vh; overflow: hidden; }
.certification-detail-stage { height: calc(100vh - var(--header-height)); min-height: 624px; display: grid; grid-template-columns: minmax(410px, 34%) minmax(0, 66%); }
.certification-detail-identity { position: relative; isolation: isolate; overflow: hidden; color: white; }
.certification-detail-image { position: absolute; inset: 0; z-index: -3; }
.certification-detail-image img { object-fit: cover; filter: saturate(.54) contrast(1.09); }
.certification-detail-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(5,27,42,.61), rgba(5,27,42,.98)), linear-gradient(90deg, rgba(5,27,42,.87), rgba(5,27,42,.18)); }
.certification-detail-breadcrumb { position: absolute; top: 30px; right: 25px; left: var(--page-gutter); display: flex; flex-wrap: wrap; gap: 8px; color: rgba(255,255,255,.64); font-size: var(--text-xs); }
.certification-detail-breadcrumb strong { color: white; }
.certification-detail-identity-copy { position: absolute; right: 40px; bottom: clamp(86px, 10vh, 112px); left: var(--page-gutter); max-width: 530px; }
.certification-detail-kicker { display: flex; align-items: center; gap: 11px; margin-bottom: 18px; color: #d9edf0; font-size: var(--text-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.certification-detail-kicker > i { width: 32px; height: 2px; background: var(--kpi-blue-400); }
.certification-detail-seal { width: 66px; height: 66px; display: grid; place-items: center; margin-bottom: 20px; border: 1px solid rgba(255,255,255,.62); border-radius: 50%; box-shadow: inset 0 0 0 5px rgba(5,27,42,.3), inset 0 0 0 6px rgba(255,255,255,.24); }
.certification-detail-seal i { color: #74c9e6; font-size: 11px; font-style: normal; font-weight: 900; letter-spacing: .1em; }
.certification-detail-identity h1 { margin: 0; color: white; font-size: clamp(37px, 3.1vw, 52px); font-weight: 600; line-height: 1.02; letter-spacing: -.05em; }
.certification-detail-identity h1 em { color: #74c9e6; font-style: normal; }
.certification-detail-identity-copy > p { margin: 23px 0 0; color: rgba(242,248,248,.9); font-size: clamp(15px, 1vw, 17px); line-height: 1.58; }
.certification-detail-back { position: absolute; bottom: 30px; left: var(--page-gutter); display: flex; align-items: center; gap: 11px; color: rgba(255,255,255,.76); font-size: var(--text-sm); font-weight: 800; }
.certification-detail-back span { color: #74c9e6; font-size: 18px; }
.certification-detail-content { min-width: 0; display: flex; flex-direction: column; padding: clamp(24px, 3vh, 36px) clamp(38px, 4vw, 64px) 16px; overflow: hidden; background: radial-gradient(circle at 100% 0%, rgba(18,119,168,.07), transparent 35%), var(--paper); }
.certification-detail-heading { display: grid; grid-template-columns: 1.08fr .92fr; align-items: end; gap: clamp(28px, 3vw, 48px); margin-bottom: 12px; padding-bottom: clamp(14px, 1.6vh, 18px); border-bottom: 1px solid var(--line); }
.certification-detail-heading h2 { margin: 0; color: var(--navy); font-size: clamp(28px, 2.08vw, 36px); font-weight: 650; line-height: 1.04; letter-spacing: -.04em; }
.certification-detail-heading > p { max-width: 405px; margin: 0 0 3px; color: #526b78; font-size: 13.5px; line-height: 1.52; }
.certification-detail-status { min-height: 40px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 15px; padding: 8px 13px; color: #536b77; background: rgba(18,119,168,.08); border-left: 3px solid var(--kpi-blue-600); }
.certification-detail-status > span { display: flex; align-items: center; gap: 7px; font-size: 8px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.certification-detail-status > span i { width: 6px; height: 6px; background: var(--kpi-blue-500); border-radius: 50%; }
.certification-detail-status strong { color: var(--navy); font-size: 12px; }
.certification-detail-status small { color: #748993; font-size: 8px; font-weight: 700; }
.certification-detail-main { min-height: 0; flex: 1.08; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr); gap: clamp(28px, 3vw, 46px); padding-top: clamp(14px, 1.8vh, 20px); }
.certification-detail-summary { min-width: 0; }
.certification-detail-lead { margin: 12px 0 12px; color: var(--navy); font-size: clamp(18px, 1.35vw, 23px); font-weight: 550; line-height: 1.38; letter-spacing: -.025em; }
.certification-detail-summary > p:not(.certification-detail-lead) { max-width: 680px; margin: 0; color: #526b78; font-size: 12.5px; line-height: 1.58; }
.certification-detail-scope { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 15px; padding-top: 13px; border-top: 1px solid var(--line); }
.certification-detail-scope > span { width: 100%; color: #748993; font-size: 8px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.certification-detail-scope strong { color: var(--navy); font-size: 10px; }
.certification-detail-scope i { width: 4px; height: 4px; background: var(--kpi-blue-500); border-radius: 50%; }
.certification-metadata { min-height: 0; display: grid; grid-template-columns: 1fr 1fr; margin: 0; border: 1px solid var(--line); background: rgba(255,255,255,.72); }
.certification-metadata div { min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: 10px 12px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.certification-metadata div:nth-child(-n+2) { border-top: 0; }
.certification-metadata div:nth-child(odd) { border-left: 0; }
.certification-metadata dt { color: var(--teal); font-size: 7.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.certification-metadata dd { margin: 5px 0 0; color: var(--navy); font-size: 11px; font-weight: 700; line-height: 1.25; }
.certification-detail-bottom { min-height: 112px; flex: .7; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(280px, .92fr); gap: 10px; margin-top: 12px; }
.certification-document-card { min-width: 0; display: grid; grid-template-columns: 45px 1fr auto; align-items: center; gap: 14px; padding: 14px 16px; background: white; border: 1px solid var(--line); }
.certification-document-icon { position: relative; width: 39px; height: 49px; display: block; border: 1px solid #aabdc2; background: #edf2f1; }
.certification-document-icon i { position: absolute; right: 8px; left: 8px; height: 1px; background: #91a7ad; }
.certification-document-icon i:nth-child(1) { top: 17px; }.certification-document-icon i:nth-child(2) { top: 24px; }.certification-document-icon i:nth-child(3) { top: 31px; }
.certification-document-card small { display: block; color: var(--teal); font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.certification-document-card strong { display: block; margin-top: 5px; color: var(--navy); font-size: 13px; }
.certification-document-card p { margin: 4px 0 0; color: #71848d; font-size: 9px; }
.certification-document-card > b { align-self: start; padding: 5px 7px; color: #71848d; background: #e8eeec; font-size: 7px; letter-spacing: .08em; text-transform: uppercase; }
.certification-detail-governance { padding: 14px 17px; color: white; background: var(--navy); border-left: 3px solid var(--kpi-blue-400); }
.certification-detail-governance .section-label { color: #74c9e6; }
.certification-detail-governance > strong { display: block; margin-top: 7px; font-size: 15px; }
.certification-detail-governance p { margin: 7px 0 0; color: rgba(255,255,255,.66); font-size: 9.5px; line-height: 1.45; }
.certification-detail-footer { height: 34px; flex: 0 0 34px; display: flex; align-items: end; justify-content: space-between; color: #667e89; font-size: var(--text-xs); }
.certification-detail-footer > span { display: flex; align-items: center; gap: 8px; }
.certification-detail-footer > span i { width: 6px; height: 6px; background: var(--kpi-blue-600); border-radius: 50%; }
.certification-detail-footer a { color: var(--navy); font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.certification-detail-footer b { margin-left: 8px; color: var(--teal); font-size: 15px; }

@media (max-width: 1399px) {
  :root { --page-gutter: clamp(30px, 3.5vw, 50px); }
  .home-stage { grid-template-columns: minmax(450px, 39%) minmax(0, 61%); }
  .navigation-panel { padding-right: 42px; padding-left: 42px; }
  .panel-heading { gap: 28px; }
  .card-text small { font-size: 13px; }
  .services-stage { grid-template-columns: minmax(390px, 32%) minmax(0, 68%); }
  .services-directory { padding-right: 40px; padding-left: 40px; }
  .directory-heading { gap: 28px; }
  .service-group-card strong { font-size: 17px; }
  .group-stage { grid-template-columns: minmax(390px, 32%) minmax(0, 68%); }
  .group-content { padding-right: 40px; padding-left: 40px; }
  .group-explanation { gap: 30px; }
  .related-scope-section { gap: 26px; }
  .subgroup-stage { grid-template-columns: minmax(370px, 30%) minmax(0, 70%); }
  .subgroup-content { padding-right: 40px; padding-left: 40px; }
  .subgroup-explanation { gap: 30px; }
  .technical-detail-section { gap: 26px; }
  .detail-stage { grid-template-columns: minmax(350px, 28%) minmax(0, 72%); }
  .detail-content { padding-right: 40px; padding-left: 40px; }
  .detail-content-heading { gap: 30px; }
  .detail-definition { gap: 32px; }
  .detail-block { padding-right: 15px; padding-left: 15px; }
  .projects-stage { grid-template-columns: minmax(370px, 30%) minmax(0, 70%); }
  .projects-directory { padding-right: 40px; padding-left: 40px; }
  .project-year-grid { gap: 8px; }
  .project-year-stage { grid-template-columns: minmax(350px, 28%) minmax(0, 72%); }
  .project-list-panel { padding-right: 40px; padding-left: 40px; }
  .project-list-header, .project-list-row { grid-template-columns: 42px minmax(210px, 1.5fr) minmax(140px, 1fr) minmax(125px, .9fr) 116px; column-gap: 11px; }
  .single-project-stage { grid-template-columns: minmax(340px, 27%) minmax(0, 73%); }
  .single-project-content { padding-right: 40px; padding-left: 40px; }
  .single-project-heading { gap: 30px; }
  .single-project-summary { gap: 32px; }
  .insights-stage { grid-template-columns: minmax(370px, 30%) minmax(0, 70%); }
  .insights-directory { padding-right: 40px; padding-left: 40px; }
  .insights-layout { grid-template-columns: minmax(290px, .9fr) minmax(390px, 1.1fr); }
  .insight-row { grid-template-columns: 104px 1fr; }
}

@media (max-height: 780px) {
  .navigation-panel { padding-top: 24px; padding-bottom: 16px; }
  .panel-heading { margin-bottom: 16px; padding-bottom: 17px; }
  .identity-content { bottom: 38px; }
  .identity-content > p { margin: 20px 0 25px; }
  .card-grid { min-height: 300px; }
  .card-content { padding: 14px 16px 13px; }
  .card-text small { margin-top: 5px; font-size: 12.5px; line-height: 1.38; }
  .card-link { font-size: 11px; }
  .contact-bar { height: 52px; flex-basis: 52px; margin-top: 10px; }
  .panel-footer { height: 25px; }
  .services-directory { padding-top: 23px; padding-bottom: 15px; }
  .directory-heading { margin-bottom: 16px; padding-bottom: 16px; }
  .services-intro-copy { bottom: 37px; }
  .services-intro-copy > p { margin: 20px 0 24px; }
  .service-group-grid { min-height: 320px; }
  .service-group-card strong { bottom: 15px; font-size: 16px; }
  .service-group-arrow { bottom: 13px; }
  .services-footer { height: 34px; flex-basis: 34px; }
  .group-content { gap: 14px; padding-top: 22px; padding-bottom: 14px; }
  .group-content-heading { padding-bottom: 15px; }
  .group-identity-copy { bottom: 91px; }
  .group-identity-copy > p { margin-top: 19px; }
  .group-primary-copy .group-lead { margin-bottom: 11px; font-size: 17px; }
  .group-primary-copy p { font-size: 14px; line-height: 1.52; }
  .group-reading-guide { padding-top: 13px; padding-bottom: 10px; }
  .group-reading-guide li { padding: 6px 0; }
  .related-scope-section { padding-top: 14px; }
  .related-scope-heading p { margin-top: 6px; }
  .related-scope-card { min-height: 96px; }
  .group-footer { min-height: 24px; }
  .subgroup-content { gap: 14px; padding-top: 22px; padding-bottom: 14px; }
  .subgroup-content-heading { padding-bottom: 15px; }
  .subgroup-identity-copy { bottom: 91px; }
  .subgroup-identity-copy > p { margin-top: 18px; }
  .subgroup-primary-copy .subgroup-lead { margin-bottom: 10px; font-size: 17px; }
  .subgroup-primary-copy p { font-size: 14px; line-height: 1.5; }
  .analysis-lens { padding-top: 12px; padding-bottom: 9px; }
  .analysis-lens article { padding-top: 7px; }
  .technical-detail-section { padding-top: 14px; }
  .technical-detail-heading p { margin-top: 6px; }
  .technical-detail-card { min-height: 96px; }
  .subgroup-footer { min-height: 24px; }
  .detail-content { gap: 12px; padding-top: 20px; padding-bottom: 13px; }
  .detail-content-heading { padding-bottom: 13px; }
  .detail-identity-copy { bottom: 104px; }
  .detail-definition .detail-lead { font-size: 16.5px; }
  .detail-definition p { font-size: 13px; line-height: 1.47; }
  .detail-block { padding-top: 13px; padding-bottom: 10px; }
  .detail-block small { margin-bottom: 6px; }
  .detail-block p { margin-top: 6px; font-size: 11.5px; line-height: 1.38; }
  .detail-action { min-height: 58px; padding-top: 8px; padding-bottom: 8px; }
  .detail-footer { min-height: 20px; }
  .projects-directory { padding-top: 22px; padding-bottom: 13px; }
  .projects-heading { margin-bottom: 14px; padding-bottom: 14px; }
  .projects-identity-copy { bottom: 37px; }
  .projects-identity-copy > p { margin: 19px 0 22px; }
  .project-year-grid { min-height: 330px; }
  .projects-footer { height: 30px; flex-basis: 30px; }
  .project-list-panel { padding-top: 21px; padding-bottom: 13px; }
  .project-list-heading { margin-bottom: 14px; padding-bottom: 14px; }
  .project-year-identity-copy { bottom: 99px; }
  .project-list-header { min-height: 36px; }
  .project-list-footer { height: 30px; flex-basis: 30px; }
  .single-project-content { gap: 12px; padding-top: 20px; padding-bottom: 13px; }
  .single-project-heading { padding-bottom: 13px; }
  .single-project-identity-copy { bottom: 103px; }
  .single-project-summary .single-project-lead { font-size: 16.5px; }
  .single-project-summary p { font-size: 13px; line-height: 1.47; }
  .single-project-facts article { padding-top: 13px; padding-bottom: 10px; }
  .single-project-facts p { margin-top: 6px; font-size: 11.5px; line-height: 1.38; }
  .single-project-note { min-height: 58px; padding-top: 8px; padding-bottom: 8px; }
  .insights-directory { padding-top: 22px; padding-bottom: 13px; }
  .insights-heading { margin-bottom: 14px; padding-bottom: 14px; }
  .insights-identity-copy { bottom: 37px; }
  .insights-identity-copy > p { margin: 19px 0 21px; }
  .insights-layout { min-height: 335px; }
  .insight-feature-content > p { font-size: 12px; }
  .insights-footer { height: 30px; flex-basis: 30px; }
  .about-content, .certifications-directory, .certification-detail-content { padding-top: 21px; padding-bottom: 13px; }
  .about-heading, .certifications-heading, .certification-detail-heading { margin-bottom: 12px; padding-bottom: 13px; }
  .about-identity-copy, .certifications-identity-copy, .certification-detail-identity-copy { bottom: 90px; }
  .about-bottom-grid, .certification-detail-bottom { min-height: 102px; }
  .certification-record { padding-top: 9px; padding-bottom: 9px; }
  .certification-seal { width: 46px; height: 46px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Pass 4.4 — representative mobile templates
   Mobile is a purpose-built vertical composition; desktop rules above remain unchanged. */
@media (max-width: 767px) {
  :root {
    --header-height: 68px;
    --page-gutter: 20px;
  }

  html, body { min-width: 0; width: 100%; overflow-x: hidden; }
  body { font-size: 15px; }
  .site-shell { width: 100%; height: auto; min-height: 100svh; overflow: visible; }
  .site-header { height: var(--header-height); padding: 0 var(--page-gutter); }
  .brand { min-height: 44px; gap: 10px; }
  .brand-mark { height: 48px; }
  .brand-copy strong { font-size: 17px; }
  .brand-copy small { max-width: 175px; margin-top: 5px; font-size: 9px; white-space: nowrap; }
  .brand-copy strong { font-size: 17px; }
  .main-nav {
    position: fixed; right: 14px; bottom: 14px; left: 14px; z-index: 20;
    height: var(--mobile-dock-height); gap: 2px; padding: 5px;
    overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none;
    background: rgba(7,28,43,.96); border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 14px 34px rgba(7,28,43,.28); backdrop-filter: blur(12px);
  }
  .main-nav::-webkit-scrollbar { display: none; }
  .main-nav a { flex: 1 0 auto; height: 42px; min-width: 54px; padding: 0 10px; justify-content: center; color: rgba(255,255,255,.7); font-size: 10px; letter-spacing: .02em; }
  .main-nav a::after { right: 8px; bottom: 1px; left: 8px; height: 2px; }
  .main-nav a.active { color: white; background: rgba(255,255,255,.07); }
  .main-nav a span { display: none; }
  .nav-dropdown { flex: 1 0 auto; height: 42px; }
  .nav-dropdown > a { width: 100%; height: 42px; padding: 0 10px; justify-content: center; }
  .nav-dropdown-panel { display: none; }

  /* Homepage — one mobile viewport */
  .home-stage { height: calc(100svh - var(--header-height)); min-height: 0; display: grid; grid-template: minmax(235px, 43%) minmax(0, 57%) / 1fr; }
  .identity-panel { min-height: 0; }
  .identity-panel::before { background-position: 54% 46%; }
  .image-credit { display: none; }
  .identity-content { right: var(--page-gutter); bottom: 23px; left: var(--page-gutter); max-width: none; }
  .eyebrow { gap: 9px; margin-bottom: 11px; font-size: 9px; letter-spacing: .1em; }
  .eyebrow span { width: 25px; }
  .identity-content h1 { font-size: clamp(32px, 9.6vw, 43px); line-height: .98; }
  .identity-content > p { margin: 13px 0 0; max-width: 94%; font-size: 14px; line-height: 1.46; }
  .facts { display: none; }
  .navigation-panel { min-height: 0; padding: 18px var(--page-gutter) calc(var(--mobile-content-safe-area) - 10px); overflow: hidden; }
  .panel-heading { display: block; margin-bottom: 13px; padding-bottom: 12px; }
  .section-label { margin-bottom: 6px; font-size: 9px; }
  .panel-heading h2 { font-size: 25px; line-height: 1.04; }
  .panel-heading h2 br { display: none; }
  .panel-heading p { display: none; }
  .card-grid { min-height: 0; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 8px; }
  .nav-card { grid-template-columns: 38% 62%; min-height: 0; }
  .card-content { padding: 12px 10px 10px; }
  .card-number { top: 8px; right: 8px; font-size: 8px; }
  .card-icon { left: 8px; bottom: 8px; width: 27px; height: 27px; }
  .card-icon svg { width: 16px; height: 16px; }
  .card-text { padding-right: 5px; }
  .card-text strong { font-size: 15px; line-height: 1.08; }
  .card-text small { margin-top: 5px; font-size: 11px; line-height: 1.32; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .card-link { padding-top: 5px; font-size: 8px; letter-spacing: .05em; }
  .card-link b { font-size: 11px; }
  .contact-bar, .panel-footer { display: none; }

  /* Shared inner-page identity */
  .services-stage, .group-stage, .subgroup-stage, .detail-stage, .projects-stage, .project-year-stage, .single-project-stage, .insights-stage { height: auto; min-height: calc(100svh - var(--header-height)); display: block; }
  .services-intro, .group-identity, .subgroup-identity, .detail-identity, .projects-identity, .project-year-identity, .single-project-identity, .insights-identity { min-height: 43svh; }
  .services-breadcrumb, .group-breadcrumb, .subgroup-breadcrumb, .detail-breadcrumb, .projects-breadcrumb, .project-year-breadcrumb, .single-project-breadcrumb, .insights-breadcrumb { top: 18px; right: var(--page-gutter); left: var(--page-gutter); font-size: 10px; }
  .services-intro-copy, .group-identity-copy, .subgroup-identity-copy, .detail-identity-copy, .projects-identity-copy, .project-year-identity-copy, .single-project-identity-copy, .insights-identity-copy { right: var(--page-gutter); bottom: 28px; left: var(--page-gutter); max-width: none; }
  .services-kicker, .group-role, .subgroup-role, .detail-role, .projects-kicker, .project-year-kicker, .single-project-kicker, .insights-kicker { margin-bottom: 12px; font-size: 9px; }
  .services-intro h1, .group-identity h1, .subgroup-identity h1, .projects-identity h1 { font-size: clamp(34px, 10vw, 45px); }
  .detail-identity h1 { font-size: clamp(45px, 14vw, 62px); }
  .services-intro-copy > p, .group-identity-copy > p, .subgroup-identity-copy > p { margin: 13px 0 0; font-size: 14px; line-height: 1.5; }
  .hierarchy-path { margin-top: 14px; padding-top: 12px; gap: 7px; font-size: 9px; }
  .group-back, .subgroup-back, .detail-back { display: none; }
  .detail-identity-copy { bottom: 25px; }
  .detail-identity-copy > p { margin: 10px 0 12px; font-size: 13px; }
  .detail-level { padding: 6px 8px; font-size: 9px; }
  .projects-identity-copy > p { margin: 13px 0 0; font-size: 14px; line-height: 1.5; }
  .projects-period { display: none; }

  /* Services archive */
  .services-directory { min-height: 57svh; padding: 20px var(--page-gutter) var(--mobile-content-safe-area); overflow: hidden; }
  .directory-heading { display: block; margin-bottom: 14px; padding-bottom: 13px; }
  .directory-heading h2 { font-size: 27px; }
  .directory-heading h2 br { display: none; }
  .directory-heading p { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .service-group-grid { min-height: 390px; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, 1fr); gap: 8px; }
  .service-group-number { top: 10px; left: 11px; font-size: 9px; }
  .service-group-card strong { right: 28px; bottom: 11px; left: 11px; font-size: 15px; }
  .service-group-arrow { right: 10px; bottom: 9px; font-size: 15px; }
  .services-footer { display: none; }

  /* Projects archive */
  .projects-directory { min-height: 57svh; padding: 20px var(--page-gutter) var(--mobile-content-safe-area); overflow: visible; }
  .projects-heading { display: block; margin-bottom: 14px; padding-bottom: 13px; }
  .projects-heading h2 { font-size: 27px; }
  .projects-heading h2 br { display: none; }
  .projects-heading p { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .project-year-grid { min-height: 700px; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(4, minmax(92px, 1fr)); gap: 8px; }
  .project-year-card > strong { bottom: 31px; font-size: 21px; }
  .project-year-link { bottom: 9px; }
  .projects-footer { display: none; }
  .archive-toolbar { margin: 0 0 12px; align-items: flex-start; }
  .archive-result-count { padding-top: 8px; }

  /* Project year list */
  .project-year-identity h1 { font-size: clamp(46px, 14vw, 62px); }
  .project-year-identity-copy > p { margin: 12px 0 13px; font-size: 14px; line-height: 1.48; }
  .project-year-badge { padding: 6px 8px; font-size: 9px; }
  .project-year-back { display: none; }
  .project-list-panel { min-height: 57svh; padding: 20px var(--page-gutter) var(--mobile-content-safe-area); overflow: visible; }
  .project-list-heading { display: block; margin-bottom: 14px; padding-bottom: 13px; }
  .project-list-heading h2 { font-size: 27px; }
  .project-list-heading h2 br { display: none; }
  .project-list-heading p { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .project-list-table { min-height: 720px; overflow: visible; }
  .project-list-header { display: none; }
  .project-list-body { display: block; }
  .project-list-row { min-height: 78px; display: grid; grid-template-columns: 34px 1fr auto; grid-template-rows: auto auto; gap: 5px 9px; padding: 13px 12px; }
  .project-row-number { grid-row: 1 / span 2; align-self: center; }
  .project-list-row strong { grid-column: 2 / span 2; font-size: 14px; }
  .project-list-row > span:not(.project-row-number):not(.project-row-status) { grid-column: 2; font-size: 11.5px; }
  .project-list-row > span:nth-of-type(3) { display: none; }
  .project-row-status { grid-column: 3; grid-row: 2; font-size: 8px; }
  .project-list-footer { display: none; }

  .project-showcase-panel { display: block; padding: 22px var(--page-gutter) var(--mobile-content-safe-area); overflow: visible; }
  .project-showcase-heading { display: block; padding-bottom: 16px; }
  .project-showcase-heading h2 { font-size: 27px; }
  .project-showcase-heading p { margin-top: 10px; font-size: 13px; }
  .project-caseboard, .project-logo-section { margin-top: 20px; }
  .project-showcase-section-head { display: block; padding-bottom: 14px; }
  .project-showcase-section-head strong { display: block; margin-top: 6px; }
  .project-logo-heading-copy p { margin-top: 7px; font-size: 12.5px; }
  .project-showcase-section-head-logos strong b { font-size: 16px; }
  .project-case-grid { grid-template-columns: 1fr; gap: 12px; }
  .project-case-card,
  .project-case-card.layout-feature,
  .project-case-card.layout-wide,
  .project-case-card.layout-standard { min-height: 0; grid-column: auto; padding: 16px; transform: none; }
  .project-case-card strong,
  .project-case-card.layout-feature strong { max-width: none; margin-top: 14px; font-size: 24px; }
  .project-case-card p { margin-top: 14px; font-size: 13px; }
  .project-logo-cluster { grid-template-columns: 1fr 1fr; gap: 10px; }
  .project-logo-card,
  .project-logo-card.span-8,
  .project-logo-card.span-6,
  .project-logo-card.span-5,
  .project-logo-card.span-4,
  .project-logo-card.span-3 { grid-column: auto; min-height: 132px; padding: 13px; transform: none; }
  .project-logo-card-inner { min-height: 82px; padding: 8px; }
  .project-logo-card img { max-height: 56px; }
  .project-logo-card figcaption { font-size: 10.5px; }
  .project-showcase-footer { margin-top: 18px; display: block; line-height: 1.5; }
  .project-showcase-actions { justify-content: flex-start; flex-wrap: wrap; margin-top: 8px; }

  /* Single project */
  .single-project-identity h1 { font-size: clamp(39px, 11.5vw, 52px); }
  .single-project-identity-copy > p { margin: 12px 0 13px; font-size: 14px; line-height: 1.48; }
  .single-project-level { padding: 6px 8px; font-size: 9px; }
  .single-project-back { display: none; }
  .single-project-content { display: block; padding: 22px var(--page-gutter) var(--mobile-content-safe-area); overflow: visible; }
  .single-project-heading { display: block; padding-bottom: 16px; }
  .single-project-heading h2 { font-size: 27px; }
  .single-project-heading > p { margin-top: 10px; font-size: 13px; }
  .single-project-summary { display: block; margin-top: 18px; }
  .single-project-summary .single-project-lead { font-size: 17px; }
  .single-project-summary p { margin-top: 12px; font-size: 14px; }
  .single-project-facts { grid-template-columns: 1fr 1fr; margin-top: 22px; }
  .single-project-facts article { min-height: 165px; padding: 17px 14px 15px; border-top: 1px solid var(--line); }
  .single-project-facts article:nth-child(odd) { border-left: 0; }
  .single-project-facts article:first-child, .single-project-facts article:nth-child(2) { border-top: 0; }
  .single-project-facts article > span { top: 14px; right: 12px; font-size: 9px; }
  .single-project-facts small { font-size: 9px; }
  .single-project-facts strong { font-size: 16px; }
  .single-project-facts p { font-size: 12px; }
  .single-project-note { margin-top: 20px; display: block; padding: 16px; }
  .single-project-note a { display: inline-flex; margin-top: 12px; }
  .single-project-footer { margin-top: 18px; display: block; line-height: 1.5; }
  .single-project-footer strong { display: block; margin-top: 5px; text-align: left; }

  /* Insights archive */
  .insights-identity h1 { font-size: clamp(34px, 10vw, 45px); }
  .insights-identity-copy > p { margin: 13px 0 0; font-size: 14px; line-height: 1.5; }
  .insights-scope { display: none; }
  .insights-directory { min-height: 57svh; padding: 20px var(--page-gutter) var(--mobile-content-safe-area); overflow: visible; }
  .insights-heading { display: block; margin-bottom: 14px; padding-bottom: 13px; }
  .insights-heading h2 { font-size: 27px; }
  .insights-heading h2 br { display: none; }
  .insights-heading p { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .insights-layout { display: block; min-height: 0; }
  .insight-feature { min-height: 390px; grid-template-rows: 48% 52%; }
  .insight-feature-content > strong { font-size: 21px; }
  .insight-list { margin-top: 10px; display: block; }
  .insight-row { min-height: 92px; grid-template-columns: 92px 1fr; padding: 9px 31px 9px 9px; }
  .insight-row-copy strong { font-size: 13px; white-space: normal; }
  .insights-footer { display: none; }

  /* Content-led Service Group and Sub-group */
  .group-content, .subgroup-content, .detail-content { display: block; padding: 22px var(--page-gutter) var(--mobile-content-safe-area); overflow: visible; }
  .group-training-shell { height: auto; overflow: visible; }
  .group-training-stage { height: auto; min-height: calc(100svh - var(--header-height)); display: block; }
  .group-training-content { display: block; padding: 22px var(--page-gutter) var(--mobile-content-safe-area); overflow: visible; }
  .group-training-header { display: block; margin-bottom: 14px; padding-bottom: 13px; }
  .group-training-header h2 { font-size: 27px; line-height: 1.08; }
  .group-training-header h2 br { display: none; }
  .group-training-header > p { margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .group-training-scroll { padding-right: 10px; }
  .group-training-intro { padding: 8px 0 28px; }
  .group-training-lead { font-size: 19px; }
  .group-training-section { grid-template-columns: 31px 1fr; gap: 9px; padding: 29px 0; }
  .group-training-section-no-number { grid-template-columns: 1fr; }
  .group-training-section-body h3 { font-size: 24px; }
  .group-training-list-block ul, .group-training-section-body > p { font-size: 13px; line-height: 1.6; }
  .group-training-relations { margin-top: 29px; padding: 21px 16px; }
  .group-training-relations h3 { font-size: 24px; }
  .group-training-relation-list { grid-template-columns: 1fr; }
  .group-content-heading, .subgroup-content-heading { padding-bottom: 15px; }
  .group-content-heading > div, .subgroup-content-heading > div { display: block; }
  .group-content-heading h2, .subgroup-content-heading h2, .detail-content-heading h2 { font-size: 27px; line-height: 1.08; }
  .level-badge { display: inline-flex; margin-top: 11px; padding: 7px 9px; font-size: 9px; }
  .group-explanation, .subgroup-explanation { display: block; margin-top: 18px; }
  .group-primary-copy .group-lead, .subgroup-primary-copy .subgroup-lead { margin-bottom: 11px; font-size: 17px; line-height: 1.48; }
  .group-primary-copy p, .subgroup-primary-copy p { font-size: 14px; line-height: 1.58; }
  .group-reading-guide, .analysis-lens { margin-top: 20px; }
  .scope-mini-list { margin-top: 14px; }
  .scope-mini-list a { grid-template-columns: 25px 1fr; min-height: 52px; }
  .scope-mini-list small { grid-column: 2; }
  .scope-detail-list { margin-top: 20px; overflow: visible; }
  .scope-detail-list > a { min-height: 98px; }
  .scope-detail-list > a > div { display: block; }
  .scope-detail-list strong { display: block; margin-top: 4px; font-size: 14px; }
  .scope-detail-list p { margin-top: 5px; font-size: 11px; }
  .related-scope-section, .technical-detail-section { display: block; margin-top: 22px; padding-top: 20px; }
  .related-scope-heading h3, .technical-detail-heading h3 { font-size: 22px; }
  .related-scope-card, .technical-detail-card { min-height: 132px; margin-top: 15px; grid-template-columns: 38% 1fr; }
  .related-scope-card > strong { font-size: 19px; }
  .technical-detail-card > strong { font-size: 21px; }
  .group-footer, .subgroup-footer { margin-top: 20px; display: block; line-height: 1.5; }
  .group-footer strong, .subgroup-footer strong { display: block; margin-top: 5px; text-align: left; }

  /* Technical detail */
  .detail-content-heading { display: block; padding-bottom: 16px; }
  .detail-content-heading > p { margin-top: 10px; font-size: 13px; }
  .detail-definition { display: block; margin-top: 18px; }
  .detail-definition .detail-lead { font-size: 17px; }
  .detail-definition p { margin-top: 12px; font-size: 14px; }
  .detail-block-grid { display: grid; grid-template-columns: 1fr 1fr; margin-top: 22px; }
  .detail-block { min-height: 190px; padding: 17px 14px 15px; border-top: 1px solid var(--line); }
  .detail-block:nth-child(odd) { border-left: 0; }
  .detail-block:first-child, .detail-block:nth-child(2) { border-top: 0; }
  .detail-block > span { top: 14px; right: 12px; font-size: 9px; }
  .detail-block small { font-size: 9px; }
  .detail-block h3 { font-size: 16px; }
  .detail-block p { font-size: 12px; }
  .detail-action { margin-top: 20px; display: block; padding: 16px; }
  .detail-action a { display: inline-flex; margin-top: 12px; }
  .detail-footer { margin-top: 18px; display: block; line-height: 1.5; }
  .detail-footer strong { display: block; margin-top: 5px; text-align: left; }
}

@media (max-width: 767px) {
  .catalog-shell { height: auto; overflow: visible; }
  .catalog-stage { height: auto; min-height: calc(100svh - var(--header-height)); display: block; }
  .catalog-identity { min-height: 43svh; }
  .catalog-breadcrumb { top: 17px; right: var(--page-gutter); left: var(--page-gutter); font-size: 8px; }
  .catalog-identity-copy { right: var(--page-gutter); bottom: 25px; left: var(--page-gutter); }
  .catalog-kicker { margin-bottom: 10px; font-size: 8px; }
  .catalog-identity h1 { font-size: clamp(32px,9.5vw,43px); }
  .catalog-identity-copy p { margin-top: 11px; font-size: 13px; line-height: 1.44; }
  .catalog-directory { min-height: 57svh; padding: 20px var(--page-gutter) var(--mobile-content-safe-area); overflow: visible; }
  .catalog-heading { display: block; margin-bottom: 13px; padding-bottom: 13px; }
  .catalog-heading h2 { font-size: 27px; }
  .catalog-heading h2 br { display: none; }
  .catalog-heading p { margin-top: 8px; font-size: 13px; }
  .catalog-list { min-height: 390px; }
  .catalog-row { grid-template-columns: 27px 1fr auto; gap: 8px; padding: 10px; }
  .catalog-row small { display: none; }
  .catalog-row strong { font-size: 13px; }
  .catalog-row > b { font-size: 8px; }
  .catalog-footer { margin-top: 10px; }
  .catalog-footer > span { display: none; }
  .topic-grid { min-height: 570px; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3,1fr); }
  .topic-card { padding: 12px; }
  .topic-card strong { font-size: 15px; }
  .training-detail-grid { display: block; }
  .training-detail-grid article { min-height: 145px; border-right: 0; border-bottom: 1px solid var(--line)!important; }
  .training-detail-grid article:last-child { border-bottom: 0!important; }
  .catalog-callout { display: block; padding: 14px; }
  .catalog-callout a { display: inline-block; margin-top: 11px; }
  .contact-grid { display: block; }
  .contact-grid > * { display: block; min-height: 135px; margin-bottom: 10px; }
  .contact-primary { min-height: 190px; }
  .contact-paths { display: block; }
  .contact-paths a { display: block; margin-top: 8px; }

  /* Certifications archive */
  .certifications-shell, .certification-detail-shell { height: auto; overflow: visible; }
  .certifications-stage, .certification-detail-stage { height: auto; min-height: calc(100svh - var(--header-height)); display: block; }
  .certifications-identity, .certification-detail-identity { min-height: 43svh; }
  .certifications-breadcrumb, .certification-detail-breadcrumb { top: 17px; right: var(--page-gutter); left: var(--page-gutter); font-size: 8px; }
  .certifications-identity-copy, .certification-detail-identity-copy { right: var(--page-gutter); bottom: 25px; left: var(--page-gutter); max-width: none; }
  .certifications-kicker, .certification-detail-kicker { margin-bottom: 10px; font-size: 8px; }
  .certifications-identity h1 { font-size: clamp(33px, 9.7vw, 44px); }
  .certifications-identity-copy > p { margin: 12px 0 0; font-size: 13px; line-height: 1.45; }
  .certifications-note, .certifications-back, .certification-detail-back { display: none; }
  .certifications-directory { min-height: 57svh; padding: 20px var(--page-gutter) var(--mobile-content-safe-area); overflow: visible; }
  .certifications-heading { display: block; margin-bottom: 14px; padding-bottom: 13px; }
  .certifications-heading h2 { font-size: 27px; }
  .certifications-heading h2 br { display: none; }
  .certifications-heading > p { margin-top: 8px; font-size: 14px; }
  .certifications-toolbar { display: block; }
  .certifications-toolbar .archive-result-count { display: block; padding-top: 8px; }
  .certification-grid { min-height: 560px; grid-template-columns: 1fr; grid-template-rows: repeat(6, minmax(82px, 1fr)); }
  .certification-record { grid-template-columns: 48px minmax(0, 1fr) 16px; padding: 11px 12px; }
  .certification-seal { width: 46px; height: 46px; }
  .certification-record-copy strong { font-size: 14px; }
  .certifications-footer { min-height: 43px; height: auto; padding-top: 10px; align-items: flex-start; }
  .certifications-footer > span { display: none; }

  /* Certification detail */
  .certification-detail-seal { width: 48px; height: 48px; margin-bottom: 12px; }
  .certification-detail-identity h1 { font-size: clamp(29px, 8.7vw, 40px); }
  .certification-detail-identity-copy > p { margin-top: 10px; font-size: 12px; line-height: 1.42; }
  .certification-detail-content { display: block; padding: 20px var(--page-gutter) var(--mobile-content-safe-area); overflow: visible; }
  .certification-detail-heading { display: block; margin-bottom: 12px; padding-bottom: 13px; }
  .certification-detail-heading h2 { font-size: 27px; }
  .certification-detail-heading h2 br { display: none; }
  .certification-detail-heading > p { margin-top: 8px; font-size: 13px; }
  .certification-detail-status { grid-template-columns: 1fr; gap: 5px; padding: 12px 13px; }
  .certification-detail-main { display: block; padding-top: 20px; }
  .certification-detail-lead { font-size: 18px; }
  .certification-detail-summary > p:not(.certification-detail-lead) { font-size: 13px; }
  .certification-metadata { margin-top: 20px; grid-template-columns: 1fr 1fr; }
  .certification-metadata div { min-height: 73px; }
  .certification-detail-bottom { display: block; margin-top: 12px; }
  .certification-document-card { min-height: 105px; }
  .certification-detail-governance { margin-top: 10px; }
  .certification-detail-footer { display: none; }
}

@media (max-width: 767px) {
  .about-stage { height: auto; min-height: calc(100svh - var(--header-height)); display: block; }
  .about-identity { min-height: 43svh; }
  .about-breadcrumb { top: 17px; right: var(--page-gutter); font-size: 9px; }
  .about-identity-copy { right: var(--page-gutter); bottom: 25px; left: var(--page-gutter); }
  .about-kicker { margin-bottom: 11px; font-size: 8px; }
  .about-identity h1 { font-size: clamp(34px, 10vw, 45px); }
  .about-identity-copy > p { margin: 12px 0 0; font-size: 13px; line-height: 1.45; }
  .about-established { display: none; }
  .about-content { padding: 20px var(--page-gutter) var(--mobile-content-safe-area); overflow: visible; }
  .about-heading { display: block; margin-bottom: 14px; padding-bottom: 13px; }
  .about-heading h2 { font-size: 27px; }
  .about-heading h2 br { display: none; }
  .about-heading > p { margin-top: 8px; font-size: 14px; }
  .about-main-grid { display: block; }
  .about-lead { font-size: 19px; }
  .about-story > p:not(.about-lead) { font-size: 14px; }
  .about-facts { min-height: 300px; margin-top: 20px; }
  .about-facts article { min-height: 98px; }
  .about-bottom-grid { display: block; margin-top: 12px; }
  .about-experience { padding: 18px; }
  .about-experience p { font-size: 13px; }
  .about-certification-card { min-height: 150px; margin-top: 12px; }
  .about-certification-copy strong { font-size: 18px; }
  .about-footer { display: none; }
}

@media (max-width: 767px) {
  .single-insight-shell { height: 100svh; min-height: 0; }
  .single-insight-stage { height: calc(100svh - var(--header-height)); min-height: 0; display: grid; grid-template-columns: 1fr; grid-template-rows: 43svh minmax(0, 1fr); }
  .single-insight-identity { min-height: 0; }
  .single-insight-breadcrumb { top: 16px; right: var(--page-gutter); font-size: 8px; }
  .single-insight-identity-copy { right: var(--page-gutter); bottom: 23px; left: var(--page-gutter); }
  .single-insight-kicker { margin-bottom: 10px; font-size: 8px; }
  .single-insight-identity h1 { font-size: clamp(31px, 9.5vw, 42px); }
  .single-insight-identity-copy > p { margin: 10px 0 0; font-size: 12px; line-height: 1.42; }
  .single-insight-meta, .single-insight-back { display: none; }
  .single-insight-reading-panel { min-height: 0; padding: 17px var(--page-gutter) 10px; }
  .single-insight-reading-header { display: block; margin-bottom: 10px; padding-bottom: 10px; }
  .single-insight-reading-header h2 { font-size: 23px; }
  .single-insight-reading-header h2 br, .single-insight-reading-header > p { display: none; }
  .single-insight-scroll { padding-right: 10px; }
  .single-insight-intro { padding: 8px 0 28px; }
  .single-insight-lead { font-size: 19px; }
  .single-insight-intro > p:last-child, .single-insight-section p { font-size: 13px; line-height: 1.6; }
  .single-insight-section { grid-template-columns: 31px 1fr; gap: 9px; padding: 29px 0; }
  .single-insight-section h3 { font-size: 24px; }
  .single-insight-section blockquote { padding: 17px; font-size: 14px; }
  .single-insight-figure { margin-top: 29px; }
  .single-insight-figure > span { min-height: 210px; }
  .single-insight-relations { margin-top: 29px; padding: 21px 16px; }
  .single-insight-relations h3 { font-size: 24px; }
  .single-insight-relation-list { grid-template-columns: 1fr; }
  .single-insight-footer { flex-direction: column; }
  .single-insight-footer a { justify-content: center; }
}

[hidden] { display: none !important; }

.identity-panel,
.services-intro-image,
.projects-identity-image,
.project-year-identity-image,
.single-project-identity-image,
.insights-identity-image,
.detail-identity-image {
  background-size: cover;
  background-position: center;
}

.group-identity-image,
.subgroup-identity-image,
.about-identity-image,
.certifications-identity-image,
.certification-detail-image,
.catalog-identity,
.single-insight-identity-image,
.technical-detail-image,
.related-scope-image,
.about-certification-image {
  position: relative;
  overflow: hidden;
}

.group-identity-image img,
.subgroup-identity-image img,
.about-identity-image img,
.certifications-identity-image img,
.certification-detail-image img,
.catalog-identity > img,
.single-insight-identity-image img,
.technical-detail-image img,
.related-scope-image img,
.about-certification-image img,
.service-group-card img,
.project-year-card img,
.insight-feature-image img,
.insight-row-image img,
.card-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Hero media must fill the left identity panel; the generic media rule above is relative. */
.group-identity > .group-identity-image,
.about-identity > .about-identity-image,
.certifications-identity > .certifications-identity-image {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
}

.group-identity > .group-identity-shade { z-index: 1; }
.group-identity > .group-breadcrumb,
.group-identity > .group-identity-copy,
.group-identity > .group-back { z-index: 2; }