/* Couleur V4 — logo blue, white / near-white / grey, original typography and normal flow. */
:root {
  --selmac-blue:#224091;
  --canvas-ivory:#fafaf7;
  --canvas-white:#fff;
  --canvas-mist:#f2f4f6;
  --copy:#454e5d;
  --muted:#596373;
  --relief:#dfe4eb;
  --paper:var(--canvas-ivory);
  --paper-2:#eef0f3;
  --ink:#333b4a;
  --line:#dde2e8;
}
body.colour-sections {--surface-ink:var(--ink);background:var(--canvas-ivory);color:var(--surface-ink)}
.colour-sections .theme-white {--surface-ink:var(--selmac-blue);--surface-line:#dde2e8;background:#fff;color:var(--surface-ink)}
.colour-sections .theme-ivory {--surface-ink:var(--selmac-blue);--surface-line:#dde2e8;background:var(--canvas-ivory);color:var(--surface-ink)}
.colour-sections :is(.content-section,.section-surface,.sections-layout) {position:relative;inset:auto;height:auto;min-height:0;margin:0;border:0;border-radius:0;box-shadow:none;transform:none;overflow:visible;isolation:auto}
.colour-sections .content-section {scroll-margin-top:100px;z-index:auto}
.colour-sections .section-surface {background:transparent;padding:0}
body.colour-sections .stack-card-inner {height:auto;min-height:0;padding-top:82px;padding-bottom:86px}
body.colour-sections .stack-number {top:82px;right:0;color:var(--surface-ink)}
.colour-sections :is(.hero-concept-copy,.hero-concept-visual,.stack-card-inner)>*,
.colour-sections :is(.stack-head-layout,.history-concept,.direction-concept,.projects-concept,.jobs-concept,.transmission-concept,.culture-head)>* {min-width:0}
.colour-sections :is(p,h1,h2,h3,h4,a,button) {overflow-wrap:break-word}
.colour-sections :is(.stack-copy p,.history-title p,.cert-head p,.projects-copy p,.jobs-concept-head p,.value-cell p,.transmission-copy>p,.culture-head p,.leader-editorial,.leader-editorial p,.leader-editorial h3,.succession h4,.succession strong,.succession span,.cert-controls p,.closing-meta p) {color:var(--surface-ink)}
.colour-sections :is(.values-row,.value-cell,.succession,.closing-meta) {border-color:var(--surface-line,var(--line))}
.colour-sections .text-link {line-height:1.5;max-width:100%;min-height:36px}
.colour-sections .text-link span {flex-shrink:0}
.colour-sections .scroll-progress span {background:var(--selmac-blue)}
.colour-sections .skip-link {background:#fff;color:var(--selmac-blue)}
.colour-sections .no-script-nav {background:var(--canvas-ivory);color:var(--ink)}

/* Same navigation shape, now a white surface with blue type and controls. */
.colour-sections .header-inner {background:#fff;color:var(--selmac-blue);border-color:#dde2e8;box-shadow:0 12px 36px #2240910d}
.colour-sections :is(.brand-meta,.main-nav a) {color:var(--selmac-blue)}
.colour-sections .main-nav a::after {background:currentColor}
.colour-sections .menu-toggle {background:#fff;color:var(--selmac-blue);box-shadow:none;border:1px solid #dde2e8}
.colour-sections .menu-toggle::before,.colour-sections .menu-toggle::after {background:var(--selmac-blue)}
.colour-sections .menu-toggle:focus-visible {outline-color:var(--selmac-blue)}
.colour-sections :is(.brand-logo,.footer-logo) {filter:none}

/* The organization note stays in the sky, inside the upper-left photo corner. */
.colour-sections .hero-concept {background:#fff;color:var(--selmac-blue);border:0}
.colour-sections .hero-ghost {color:#edf0f4}
.colour-sections .hero-title-outline {-webkit-text-stroke-color:var(--selmac-blue)}
.colour-sections :is(.hero-bottom-copy p,.hero-kicker span+span::before,.hero-data span) {color:var(--selmac-blue)}
.colour-sections :is(.hero-data,.hero-data>div) {border-color:#dde2e8}
.colour-sections .hero-photo {background:var(--canvas-ivory);box-shadow:none}
.colour-sections .hero-photo::after {display:none}
.colour-sections .hero-photo figcaption {left:18px;right:18px;bottom:18px;width:fit-content;max-width:calc(100% - 36px);padding:16px 20px;background:#fff;color:var(--selmac-blue);border-radius:10px}
.colour-sections .hero-tech-card {position:absolute;left:18px;right:auto;top:18px;bottom:auto;width:270px;max-width:58%;margin:0;padding:22px;background:var(--canvas-ivory);color:var(--ink);border:1px solid #eef0f3;box-shadow:0 8px 24px #333b4a0a;backdrop-filter:none}
.colour-sections .hero-tech-card span {color:var(--ink);margin-bottom:12px}
.colour-sections .sections-layout {padding-top:0;background:var(--canvas-ivory);color:var(--selmac-blue)}
.colour-sections .stack-intro {padding-top:76px;padding-bottom:0}

/* Every date is in normal flow. Only the desktop introduction can stay in view. */
body.colour-sections .history-concept {align-items:start;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:54px}
body.colour-sections .history-title {align-self:start;position:relative;padding-top:0}
body.colour-sections .history-scroll-viewport {height:auto;min-height:0;max-height:none;overflow:visible;padding:0 0 0 30px;border:0;border-radius:0;background:transparent}
body.colour-sections .history-scroll-viewport::before,body.colour-sections .history-scroll-viewport::after {display:none}
body.colour-sections .history-scroll-track {position:relative;inset:auto;transform:none!important;will-change:auto}
body.colour-sections .history-step {position:relative;grid-template-columns:105px minmax(0,1fr);gap:22px;align-items:start;padding:32px 0;min-height:0;opacity:1;transform:none;border-color:#dde2e8}
body.colour-sections .history-step:first-child {padding-top:0;border-top:0}
body.colour-sections .history-step:last-child {padding-bottom:0;border-bottom:0}
.colour-sections .history-step::before {content:"";position:absolute;left:-35px;top:40px;width:11px;height:11px;background:#fff;border:2px solid #b8c3d2;border-radius:50%;transition:background .35s,border-color .35s,box-shadow .35s}
.colour-sections .history-step:first-child::before {top:8px}
.colour-sections .history-step.is-active::before,.colour-sections .history-step.is-past::before {background:var(--selmac-blue);border-color:var(--selmac-blue)}
.colour-sections .history-step.is-active::before {box-shadow:0 0 0 5px #22409112}
.colour-sections .history-step b {color:var(--selmac-blue);transition:transform .45s var(--ease);transform-origin:left center}
.colour-sections .history-step.is-active b {transform:translateY(-3px)}
.colour-sections .history-step p,.colour-sections .history-step>div>span {color:var(--selmac-blue)}
body.colour-sections .history-axis {display:block;position:absolute;left:0;top:13px;bottom:13px;width:1px;background:#dde2e8;z-index:0;overflow:hidden}
body.colour-sections .history-axis span {position:absolute;inset:0;width:100%;height:100%;background:var(--selmac-blue);border-radius:0;box-shadow:none;transform:scaleY(var(--history-progress,0));transform-origin:top}
body.colour-sections .history-progress-label {display:flex;position:relative;inset:auto;z-index:auto;max-width:300px;margin-top:32px;color:var(--selmac-blue);gap:14px;font-size:9px}
.colour-sections .history-progress-label i {flex:1;background:#dde2e8;height:2px;width:auto}
.colour-sections .history-progress-label i::after {background:var(--selmac-blue)}
@media(min-width:1181px) and (min-height:780px) {
  body.colour-sections .history-title {position:sticky;top:112px}
}

/* Portrait and biography are separate columns: no image overlay or placeholder. */
body.colour-sections .direction-concept {grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);grid-template-rows:auto auto;column-gap:54px;row-gap:36px;align-items:start}
body.colour-sections .direction-title {grid-column:1;grid-row:1;align-self:start}
body.colour-sections .direction-portrait {grid-column:2;grid-row:1 / 3;position:relative;align-self:center;justify-self:center;margin:0;width:100%;max-width:600px;height:auto!important;min-height:0!important;max-height:none;aspect-ratio:3 / 4;background:transparent;border-radius:16px;overflow:hidden}
.colour-sections .direction-portrait::after {display:none}
.colour-sections .direction-portrait img {width:100%;height:100%;object-fit:contain;filter:none}
body.colour-sections .leader-editorial {grid-column:1;grid-row:2;align-self:start;padding:0;z-index:auto;color:var(--ink)}
.colour-sections .succession>div {grid-template-columns:repeat(2,minmax(0,1fr))}
.colour-sections .leader-editorial h3 {overflow-wrap:normal}
.colour-sections .succession {border-color:var(--line)}

.colour-sections #certifications .stack-card-inner {padding-bottom:16px}
.colour-sections #certifications .cert-marquee {padding-top:24px;padding-bottom:24px;background:#fff}
.colour-sections .cert-logo-tile {color:var(--selmac-blue);border-color:#dde2e8;background:#fff}
.colour-sections .cert-controls {padding-bottom:64px;flex-wrap:wrap}
.colour-sections .motion-toggle {color:var(--selmac-blue);border-color:#b8c3d2}
.colour-sections .project-shot {background:#eef0f3;border-color:transparent}
.colour-sections .project-shot figcaption,.colour-sections .project-shot figcaption span {color:var(--selmac-blue);background:#fff}
.colour-sections .culture-tile h3 {color:var(--ink)}
body.colour-sections .closing-section {background:#fff;color:var(--selmac-blue);border:0;box-shadow:none;padding-top:40px}
.colour-sections .closing-meta {border-color:#dde2e8}

/* Inner pages, gallery, modal, recruitment and footer share the same palette. */
.colour-sections :is(.page-hero,.gallery-hero,.notfound) {--surface-ink:var(--selmac-blue);background:#fff;color:var(--selmac-blue)}
.colour-sections :is(.page-hero .eyebrow,.page-hero p,.gallery-hero p,.gallery-hero .back-link) {color:var(--selmac-blue)}
.colour-sections :is(.legal-page,.jobs-page,.offer-wrap) {background:var(--canvas-ivory);color:var(--ink)}
.colour-sections :is(.legal-content p,.jobs-page-head p,.gallery-count,.album-meta,.album-card p,.photo-link figcaption,.album-tools,.album-tools .text-link) {color:var(--ink)}
.colour-sections .album-cover,.colour-sections .photo-link img {background:#eef0f3}
.colour-sections .album-cover>span {background:#fff;color:var(--selmac-blue)}
.colour-sections .gallery-filters button {background:transparent;color:var(--ink);border-color:#c9cfd7}
.colour-sections .gallery-filters button[aria-pressed=true] {background:#fff;color:var(--selmac-blue);border-color:var(--selmac-blue)}
.colour-sections :is(.job-card,.no-jobs-inline,.empty-jobs,.offer-single) {--surface-ink:var(--selmac-blue);background:#fff;color:var(--selmac-blue);border-color:#dde2e8}
.colour-sections :is(.job-card-top,.job-card p,.no-jobs-inline h3,.no-jobs-inline p,.offer-kicker,.offer-copy p,.offer-extra li,.offer-source,.offer-source a) {color:var(--selmac-blue)}
.colour-sections .apply-side-card {background:#fff;color:var(--selmac-blue);border:1px solid #dde2e8}
.colour-sections .apply-side-card p {color:var(--selmac-blue)}
.colour-sections .button,.colour-sections .apply-side-card .button {background:var(--canvas-ivory);color:var(--ink);white-space:normal}
.colour-sections .footer {--surface-ink:var(--ink);background:var(--canvas-ivory);color:var(--ink)}
.colour-sections :is(.footer h4,.footer p,.footer a,.footer-bottom) {color:var(--ink)}
.colour-sections .footer-grid {border-color:var(--line)}
.colour-sections .footer-word {color:#dfe3e8;text-align:center;transform:none}
.colour-sections .lightbox {background:var(--canvas-ivory);color:var(--ink)}
.colour-sections .lightbox::backdrop {background:#fafaf7f5}
.colour-sections .lightbox button,.colour-sections .lightbox .lightbox-file {background:#fff;color:var(--selmac-blue);border-color:#c9d1dd}
.colour-sections .lightbox button:hover {background:#eef0f3;color:var(--ink)}
.colour-sections .lightbox-bottom p {color:var(--ink)}
.colour-sections .lightbox-inner,.colour-sections .lightbox-stage {min-width:0}

@media(max-width:1180px) {
  .colour-sections .main-nav {background:#fff;border-color:#dde2e8;box-shadow:0 18px 40px #22409114}
  .colour-sections .main-nav a {border-color:#dde2e8}
  .colour-sections .hero-tech-card {top:16px;left:16px;width:246px;max-width:58%;padding:16px}
  body.colour-sections .history-concept {grid-template-columns:1fr;gap:38px}
  body.colour-sections .direction-concept {column-gap:34px;row-gap:30px}
  body.colour-sections .stack-card-inner {padding-top:64px;padding-bottom:68px}
  body.colour-sections .stack-number {top:64px}
}
@media(max-width:720px) {
  .colour-sections .hero-tech-card {display:none}
  .colour-sections .hero-photo figcaption {left:12px;right:12px;bottom:12px;max-width:calc(100% - 24px);padding:14px 16px}
  .colour-sections .hero-photo figcaption strong {font-size:26px}
  .colour-sections .stack-intro {padding-top:50px;padding-bottom:0}
  body.colour-sections .stack-card-inner {padding-top:50px;padding-bottom:54px}
  body.colour-sections .stack-number {top:22px}
  body.colour-sections .history-scroll-viewport {padding:0 0 0 24px}
  body.colour-sections .history-step {grid-template-columns:minmax(0,1fr);gap:14px;padding:28px 0}
  .colour-sections .history-step::before {left:-29px;top:36px}
  .colour-sections .history-step:first-child::before {top:8px}
  body.colour-sections .direction-concept {grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;gap:30px}
  body.colour-sections .direction-title {grid-column:1;grid-row:1}
  body.colour-sections .direction-portrait {grid-column:1;grid-row:2;max-width:480px;height:auto!important}
  body.colour-sections .leader-editorial {grid-column:1;grid-row:3;padding:0}
  .colour-sections .leader-editorial h3 {overflow-wrap:anywhere}
  .colour-sections .cert-controls {padding-bottom:44px;gap:16px}
  .colour-sections .cert-controls p {max-width:100%}
  .colour-sections .footer-links a {min-height:36px}
  .colour-sections .eyebrow {padding-right:28px;display:block}
  .colour-sections .hero-kicker span {overflow-wrap:normal}
  .colour-sections .lightbox {padding-top:max(14px,env(safe-area-inset-top));padding-bottom:max(14px,env(safe-area-inset-bottom))}
}
@media(max-width:380px) {
  .colour-sections .succession>div {grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce) {
  body.colour-sections .history-title {position:relative;top:auto}
  .colour-sections .history-step.is-active b {transform:none}
}
@media print {
  body.colour-sections .history-title {position:relative;top:auto}
  .colour-sections .content-section {break-inside:auto}
  .colour-sections .history-step,.colour-sections .direction-portrait {break-inside:avoid}
}

/* V3 visual language: one blue, quiet mineral surfaces and construction lines. */
.colour-sections .theme-mist {--surface-ink:var(--selmac-blue);--surface-line:var(--line);background:var(--canvas-mist);color:var(--selmac-blue)}
.colour-sections :is(.stack-title,.display,.stack-intro p,.leader-editorial h3,.value-cell h3,.no-jobs-inline h3,.empty-jobs h2,.job-card h3,.jobs-page-head h2,.offer-copy h2,.offer-extra h2,.apply-side-card h2,.legal-content h2,.album-card h2,.culture-tile h3) {color:var(--selmac-blue)}
.colour-sections :is(.stack-copy p,.history-title p,.cert-head p,.projects-copy p,.jobs-concept-head p,.value-cell p,.transmission-copy>p,.culture-head p,.leader-editorial p,.no-jobs-inline p,.empty-jobs p,.job-card p,.jobs-page-head p,.offer-copy p,.offer-extra li,.apply-side-card p,.legal-content p,.album-card p,.page-hero p,.gallery-hero p,.hero-bottom-copy p) {color:var(--copy)}
.colour-sections :is(.eyebrow,.leader-editorial>span,.succession h4,.succession strong) {color:var(--selmac-blue)}
.colour-sections :is(.brand-meta,.hero-kicker,.hero-data span,.hero-tech-card span,.history-step>div>span,.succession span,.cert-controls p,.job-card-top,.offer-kicker,.gallery-count,.album-meta,.photo-link figcaption,.closing-meta p) {color:var(--muted)}
.colour-sections .history-step p {color:var(--copy)}
.colour-sections .text-link,.colour-sections .album-tools .text-link {color:var(--selmac-blue);transition:color .25s}
.colour-sections .text-link span {transition:transform .3s var(--ease)}
.colour-sections .text-link:hover span {transform:translate(3px,-2px)}
.colour-sections .text-link:focus-visible {outline-color:var(--selmac-blue)}
.colour-sections .project-shot figcaption {color:var(--ink);background:#fffffff5;backdrop-filter:blur(8px)}
.colour-sections .project-shot figcaption span {color:var(--muted);background:transparent}
.colour-sections .hero-tech-card {background:#fffffff5;color:var(--selmac-blue);border-color:var(--line);box-shadow:0 10px 28px #2240910a}
.colour-sections .hero-photo figcaption {background:#fffffff5;backdrop-filter:blur(8px)}
.colour-sections .hero-ghost {color:var(--relief);opacity:.5}
@keyframes blueprint-line {from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes blueprint-upright {from{transform:scaleY(0)}to{transform:scaleY(1)}}

/* Section line drawing remains; no background grid. */
body.colour-sections :is(.content-section,.gallery-hero,.page-hero,.closing-section,.footer,.jobs-page,.legal-page) {position:relative;isolation:isolate}
.colour-sections .stack-number {font-variant-numeric:tabular-nums}
.colour-sections .stack-number::before {content:"";position:absolute;right:calc(100% + 16px);top:50%;height:1px;width:56px;background:#b9c2cf;transform:scaleX(1);transform-origin:right;transition:transform 1s .15s var(--ease)}
.colour-sections .eyebrow::before {transform:scaleX(1);transform-origin:left;transition:transform .9s .12s var(--ease)}
.motion-ready .colour-sections [data-draw]:not(.is-visible) .stack-number::before,
.motion-ready .colour-sections [data-draw]:not(.is-visible) .eyebrow::before {transform:scaleX(0)}

/* A real, offset duplicate — decoration is excluded from the accessible title. */
.colour-sections .title-depth {--depth:7px;position:relative;isolation:isolate;display:block;padding:0 var(--depth) var(--depth) 0;max-width:100%}
.colour-sections .title-depth-front {display:block;position:relative;z-index:1;color:var(--selmac-blue)}
.colour-sections .title-depth-back {position:absolute;left:0;right:var(--depth);top:0;z-index:0;color:var(--relief);pointer-events:none;user-select:none;transform:translate(var(--depth),var(--depth));opacity:1;transition:transform 1.1s .12s var(--ease),opacity .7s .12s ease}
.motion-ready .colour-sections .title-depth[data-draw]:not(.is-visible) .title-depth-back {transform:translate(0,0);opacity:0}
.colour-sections .direction-portrait {border:1px solid #dce1e8;box-shadow:0 16px 45px #22409108}
.colour-sections .cert-logo-tile {border-radius:8px;border-color:#dfe4ea;box-shadow:0 7px 22px #22409104}
.colour-sections .project-shot {border:1px solid #dfe4ea}
.colour-sections .culture-tile h3 {font-weight:600}
.colour-sections .button,.colour-sections .apply-side-card .button {background:var(--canvas-mist);color:var(--selmac-blue);border:1px solid var(--line)}
.colour-sections .footer {background:var(--canvas-mist);color:var(--selmac-blue)}
.colour-sections .footer h4 {color:var(--selmac-blue)}
.colour-sections :is(.footer p,.footer a,.footer-bottom) {color:var(--muted)}
.colour-sections .footer a:hover {color:var(--selmac-blue)}
.colour-sections .footer-word {color:#dfe4ea}
.colour-sections .lightbox {background:var(--canvas-white);color:var(--selmac-blue)}
.colour-sections .lightbox::backdrop {background:#fffffff5}
.colour-sections .lightbox-bottom p {color:var(--copy)}
.colour-sections .lightbox button:hover {background:var(--canvas-mist);color:var(--selmac-blue)}

@media(max-width:720px) {
  .colour-sections .title-depth {--depth:3px}
  .colour-sections .stack-number::before {width:28px;right:calc(100% + 10px)}
  /* Contain compact controls on mobile. */
  .colour-sections :is(.gallery-filters,.lightbox-actions) {max-width:100%}
}
@media(prefers-reduced-motion:reduce) {
  .colour-sections [data-draw]::before,.colour-sections .title-depth-back {opacity:1!important}
  .colour-sections .title-depth-back {transform:translate(var(--depth),var(--depth))!important}
  .colour-sections .eyebrow::before,.colour-sections .stack-number::before {transform:scaleX(1)!important}
}
