/* Layer 1: primitive colour, spacing, type, radius, shadow, blur, duration, width, and z-index tokens. */
:root {
    color-scheme: light dark;

    --colour-pearl-50: #fffdf8;
    --colour-pearl-100: #f7f2e9;
    --colour-aqua-50: #e8fbfa;
    --colour-aqua-200: #9cebef;
    --colour-cyan-500: #00bcca;
    --colour-cyan-700: #087b87;
    --colour-coral-400: #ef795e;
    --colour-violet-100: #eee9fb;
    --colour-violet-500: #7f70d9;
    --colour-gold-400: #d9a34b;
    --colour-ink-900: #081a1f;
    --colour-ink-800: #12323a;
    --colour-ink-700: #24474f;
    --colour-slate-500: #5d7075;
    --colour-night-950: #041116;
    --colour-night-900: #07151c;
    --colour-night-800: #10262f;
    --colour-night-700: #183640;
    --colour-white: #ffffff;
    --colour-success-light: #137451;
    --colour-success-dark: #72ddb0;
    --colour-warning-light: #8a5b12;
    --colour-warning-dark: #f2c96f;
    --colour-danger-light: #a13d31;
    --colour-danger-dark: #ff9d8f;

    --space-1: .25rem;
    --space-2: .5rem;
    --space-3: .75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;
    --space-24: 6rem;
    --space-32: 8rem;

    --font-display: "Avenir Next", "Segoe UI", Helvetica, Arial, sans-serif;
    --font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-size-xs: .72rem;
    --font-size-sm: .84rem;
    --font-size-base: 1rem;
    --font-size-lede: clamp(1.08rem, 1.7vw, 1.35rem);
    --font-size-h1: clamp(3.25rem, 7.4vw, 7.5rem);
    --font-size-h2: clamp(2.35rem, 4.8vw, 5rem);
    --font-size-h3: clamp(1.35rem, 2vw, 2rem);

    --radius-xs: .35rem;
    --radius-sm: .75rem;
    --radius-md: 1.25rem;
    --radius-lg: 2rem;
    --radius-xl: 3rem;
    --radius-pill: 999px;
    --shadow-soft: 0 1.5rem 5rem rgba(8, 26, 31, .12);
    --shadow-clay: .5rem .65rem 1.25rem rgba(8, 26, 31, .18), -.2rem -.2rem .65rem rgba(255, 255, 255, .55);
    --shadow-night: 0 1.6rem 5.5rem rgba(0, 0, 0, .32);
    --blur-glass: 1.15rem;
    --duration-fast: 120ms;
    --duration-medium: 220ms;
    --duration-slow: 280ms;
    --duration-ambient: 18s;
    --ease-standard: cubic-bezier(.2, .7, .2, 1);
    --width-shell: min(77.5rem, calc(100vw - 3rem));
    --width-reading: min(75ch, calc(100vw - 3rem));
    --header-height: 4.75rem;
    --z-skip: 1000;
    --z-header: 100;
    --z-assistant: 210;
}

/* Layer 2: semantic light-theme mappings. */
:root,
[data-theme="light"] {
    --canvas: var(--colour-pearl-100);
    --canvas-soft: var(--colour-pearl-50);
    --canvas-tint: var(--colour-aqua-50);
    --ink: var(--colour-ink-900);
    --ink-soft: var(--colour-ink-800);
    --text-muted: var(--colour-slate-500);
    --surface: rgba(255, 253, 248, .74);
    --surface-solid: var(--colour-pearl-50);
    --surface-muted: rgba(232, 251, 250, .66);
    --surface-ink: var(--colour-ink-900);
    --glass: rgba(255, 253, 248, .72);
    --glass-strong: rgba(255, 253, 248, .92);
    --control-boundary: rgba(8, 26, 31, .18);
    --soft-boundary: rgba(8, 26, 31, .1);
    --accent: var(--colour-cyan-700);
    --accent-bright: var(--colour-cyan-500);
    --accent-contrast: var(--colour-ink-900);
    --coral: var(--colour-coral-400);
    --violet: var(--colour-violet-500);
    --gold: var(--colour-gold-400);
    --focus: var(--colour-cyan-700);
    --success: var(--colour-success-light);
    --warning: var(--colour-warning-light);
    --danger: var(--colour-danger-light);
    --disabled: rgba(98, 117, 122, .52);
    --selection-bg: var(--colour-aqua-200);
    --selection-ink: var(--colour-ink-900);
    --atmosphere-cyan: rgba(0, 188, 202, .2);
    --atmosphere-coral: rgba(239, 121, 94, .17);
    --atmosphere-violet: rgba(127, 112, 217, .16);
    --orbit-note-text: var(--colour-ink-900);
}

/* Layer 3: independently authored semantic dark-theme mappings. */
[data-theme="dark"] {
    --canvas: var(--colour-night-900);
    --canvas-soft: var(--colour-night-950);
    --canvas-tint: var(--colour-night-800);
    --ink: #eef7f6;
    --ink-soft: #d5e7e7;
    --text-muted: #9fb5b8;
    --surface: rgba(16, 38, 47, .76);
    --surface-solid: var(--colour-night-800);
    --surface-muted: rgba(24, 54, 64, .7);
    --surface-ink: var(--colour-night-950);
    --glass: rgba(11, 30, 38, .72);
    --glass-strong: rgba(11, 30, 38, .94);
    --control-boundary: rgba(232, 251, 250, .2);
    --soft-boundary: rgba(232, 251, 250, .11);
    --accent: #74e7ee;
    --accent-bright: #39d6df;
    --accent-contrast: var(--colour-night-950);
    --coral: #f28b74;
    --violet: #a89bea;
    --gold: #ecc46f;
    --focus: #6cecf2;
    --success: var(--colour-success-dark);
    --warning: var(--colour-warning-dark);
    --danger: var(--colour-danger-dark);
    --disabled: rgba(159, 181, 184, .48);
    --selection-bg: #237a84;
    --selection-ink: var(--colour-white);
    --atmosphere-cyan: rgba(57, 214, 223, .17);
    --atmosphere-coral: rgba(242, 139, 116, .13);
    --atmosphere-violet: rgba(168, 155, 234, .16);
    --orbit-note-text: var(--colour-white);
}

/* Layer 4: component tokens. */
:root {
    --button-primary-bg: var(--ink);
    --button-primary-text: var(--canvas-soft);
    --button-secondary-bg: var(--surface-solid);
    --button-secondary-text: var(--ink);
    --button-boundary: var(--control-boundary);
    --field-bg: var(--surface-solid);
    --field-text: var(--ink);
    --field-boundary: var(--control-boundary);
    --header-bg: var(--glass);
    --header-boundary: var(--soft-boundary);
    --nav-text: var(--ink-soft);
    --flash-bg: var(--glass-strong);
    --assistant-bg: var(--glass-strong);
    --assistant-ink-bg: var(--surface-ink);
    --closing-bg: var(--colour-night-700);
    --closing-text: var(--colour-white);
    --closing-muted: #c1d5d7;
    --footer-bg: var(--colour-night-950);
    --footer-text: #f1f8f7;
    --footer-muted: #9cb3b7;
    --footer-accent: #8beaf0;
}

*,
*::before,
*::after { box-sizing: border-box; }

html {
    min-width: 20rem;
    background: var(--canvas);
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--header-height) + var(--space-8));
}

body {
    position: relative;
    min-width: 20rem;
    min-height: 100vh;
    margin: 0;
    overflow-x: clip;
    color: var(--ink);
    background:
        radial-gradient(circle at 8% 8%, var(--atmosphere-cyan), transparent 29rem),
        radial-gradient(circle at 92% 30%, var(--atmosphere-violet), transparent 34rem),
        radial-gradient(circle at 25% 72%, var(--atmosphere-coral), transparent 31rem),
        var(--canvas);
    font-family: var(--font-body);
    font-size: var(--font-size-base);
    line-height: 1.65;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body.menu-open { overflow: hidden; }
main { position: relative; z-index: 1; }
[hidden] { display: none !important; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button,
input,
textarea,
select { font: inherit; }
button { color: inherit; }
button,
a { -webkit-tap-highlight-color: transparent; }
button:disabled { cursor: wait; opacity: .68; }
:focus-visible { outline: .2rem solid var(--focus); outline-offset: .25rem; }
::selection { color: var(--selection-ink); background: var(--selection-bg); }

h1,
h2,
h3,
h4,
p { margin-top: 0; }

h1,
h2,
h3,
h4 {
    color: var(--ink);
    font-family: var(--font-display);
    font-weight: 700;
    line-height: 1.03;
    letter-spacing: -.045em;
    overflow-wrap: anywhere;
}

h1 { font-size: var(--font-size-h1); }
h2 { font-size: var(--font-size-h2); }
h3 { font-size: var(--font-size-h3); }
p { color: var(--text-muted); }

.shell { width: var(--width-shell); margin-inline: auto; }
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.skip-link {
    position: fixed;
    z-index: var(--z-skip);
    top: var(--space-3);
    left: var(--space-3);
    padding: var(--space-3) var(--space-4);
    color: var(--ink);
    background: var(--surface-solid);
    box-shadow: 0 0 0 .15rem var(--ink);
    transform: translateY(-160%);
}
.skip-link:focus { transform: translateY(0); }

.eyebrow {
    margin-bottom: var(--space-6);
    color: var(--accent);
    font-size: var(--font-size-xs);
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}
.eyebrow--light { color: var(--footer-accent); }
.eyebrow--gold { color: var(--gold); }
.lede { max-width: 46.25rem; font-size: var(--font-size-lede); line-height: 1.55; }
.text-link {
    display: inline-flex;
    gap: var(--space-2);
    align-items: center;
    color: var(--ink);
    font-weight: 750;
    text-decoration: underline;
    text-decoration-color: var(--accent);
    text-decoration-thickness: .1rem;
    text-underline-offset: .35rem;
}

.button {
    display: inline-flex;
    min-height: 3.25rem;
    padding: .8rem 1.4rem;
    gap: var(--space-5);
    align-items: center;
    justify-content: center;
    color: var(--button-secondary-text);
    border: 0;
    border-radius: var(--radius-pill);
    background: var(--button-secondary-bg);
    box-shadow: inset 0 0 0 1px var(--button-boundary);
    font-weight: 750;
    line-height: 1.2;
    cursor: pointer;
    transition: transform var(--duration-medium) var(--ease-standard), box-shadow var(--duration-medium) var(--ease-standard), background-color var(--duration-medium) var(--ease-standard), color var(--duration-medium) var(--ease-standard);
}
.button:hover { transform: translateY(-.12rem); }
.button:active { transform: translateY(0); }
.button--small { min-height: 2.75rem; padding: .65rem 1rem; gap: var(--space-2); font-size: .9rem; }
.button--ink {
    color: var(--button-primary-text);
    background: var(--button-primary-bg);
    box-shadow: var(--shadow-clay);
}
.button--ink:hover { box-shadow: var(--shadow-soft); }
.button--light { color: var(--colour-ink-900); background: var(--colour-pearl-50); box-shadow: var(--shadow-clay); }
.button--outline { color: var(--ink); background: transparent; box-shadow: inset 0 0 0 1px var(--button-boundary); }
.button--outline:hover { box-shadow: inset 0 0 0 2px var(--accent); }
.button--full { width: 100%; }

/* Floating functional-glass header and navigation. */
.site-header {
    position: sticky;
    z-index: var(--z-header);
    top: 0;
    padding-top: var(--space-3);
    pointer-events: none;
}
.site-header__inner {
    display: flex;
    min-height: var(--header-height);
    padding: var(--space-2) var(--space-3) var(--space-2) var(--space-5);
    align-items: center;
    justify-content: space-between;
    border-radius: var(--radius-pill);
    background: var(--header-bg);
    box-shadow: inset 0 0 0 1px var(--header-boundary), var(--shadow-soft);
    pointer-events: auto;
}
@supports ((-webkit-backdrop-filter: blur(1rem)) or (backdrop-filter: blur(1rem))) {
    .site-header__inner,
    .chat-panel { -webkit-backdrop-filter: blur(var(--blur-glass)); backdrop-filter: blur(var(--blur-glass)); }
}
.brand {
    position: relative;
    display: inline-flex;
    min-width: 9.4rem;
    min-height: 2.75rem;
    gap: .65rem;
    align-items: center;
    color: var(--ink);
}
.brand__mark { width: 2.4rem; height: auto; flex: 0 0 auto; }
.brand__wordmark {
    max-width: 8.75rem;
    color: var(--ink);
    font-size: clamp(.66rem, .82vw, .82rem);
    font-weight: 850;
    line-height: 1.05;
    letter-spacing: .115em;
    text-transform: uppercase;
}
.brand::before {
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 1.2rem;
    width: 3.4rem;
    height: 3.4rem;
    border-radius: 50%;
    background: color-mix(in srgb, var(--accent-bright) 26%, transparent);
    content: "";
    opacity: .5;
    transform: translate(-50%, -50%) scale(.86);
    animation: halo-breathe 5.5s var(--ease-standard) infinite alternate;
    pointer-events: none;
}
.primary-nav { display: flex; gap: clamp(.75rem, 1.35vw, 1.65rem); align-items: center; }
.primary-nav > a:not(.button) {
    position: relative;
    color: var(--nav-text);
    font-size: .9rem;
    font-weight: 680;
}
.primary-nav > a:not(.button)::after {
    position: absolute;
    right: 0;
    bottom: -.5rem;
    left: 0;
    height: .14rem;
    border-radius: var(--radius-pill);
    background: var(--accent);
    content: "";
    transform: scaleX(0);
    transform-origin: right;
    transition: transform var(--duration-medium) var(--ease-standard);
}
.primary-nav > a:hover::after,
.primary-nav > a[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }
.primary-nav .nav-login { color: var(--accent); }
.site-header .button--ink { color: var(--accent-contrast); background: var(--accent-bright); box-shadow: none; }
.theme-toggle {
    display: none;
    min-height: 2.75rem;
    padding: .55rem .8rem;
    gap: var(--space-2);
    align-items: center;
    border: 0;
    border-radius: var(--radius-pill);
    color: var(--nav-text);
    background: var(--surface-muted);
    box-shadow: inset 0 0 0 1px var(--header-boundary);
    font-size: var(--font-size-xs);
    font-weight: 750;
    cursor: pointer;
}
[data-js="true"] .theme-toggle { display: inline-flex; }
.theme-toggle__indicator {
    width: .75rem;
    height: .75rem;
    border-radius: 50%;
    background: var(--gold);
    box-shadow: 0 0 0 .25rem color-mix(in srgb, var(--gold) 18%, transparent);
    transition: background-color var(--duration-fast) var(--ease-standard), transform var(--duration-fast) var(--ease-standard);
}
[data-theme="dark"] .theme-toggle__indicator { background: var(--violet); transform: scale(.82); }
.menu-toggle { display: none; min-width: 2.75rem; min-height: 2.75rem; border: 0; background: transparent; cursor: pointer; }

.flash-stack { position: relative; z-index: 2; padding-top: var(--space-4); }
.flash {
    margin: 0 0 var(--space-2);
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-sm);
    color: var(--ink);
    background: var(--flash-bg);
    box-shadow: inset 0 0 0 1px var(--soft-boundary), var(--shadow-soft);
}
.flash--success { box-shadow: inset .3rem 0 0 var(--success), var(--shadow-soft); }
.flash--warning { box-shadow: inset .3rem 0 0 var(--warning), var(--shadow-soft); }
.flash--error { box-shadow: inset .3rem 0 0 var(--danger), var(--shadow-soft); }

/* Standalone AngelB OS authentication gateway. */
.auth-gateway {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}
.auth-gateway__header {
    display: flex;
    width: min(69rem, calc(100vw - 2rem));
    min-height: 4.5rem;
    margin: 0 auto;
    align-items: center;
    justify-content: space-between;
}
.auth-gateway__brand {
    display: inline-flex;
    gap: .45rem;
    align-items: baseline;
    color: var(--ink);
    font-family: var(--font-display);
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: -.05em;
}
.auth-gateway__brand span:last-child {
    padding: .15rem .45rem;
    border-radius: var(--radius-pill);
    color: var(--accent-contrast);
    background: var(--accent);
    font-family: var(--font-body);
    font-size: .62rem;
    letter-spacing: .08em;
}
.auth-gateway__theme { display: none; }
[data-js="true"] .auth-gateway__theme { display: inline-flex; }
.auth-gateway__main {
    display: grid;
    width: min(69rem, calc(100vw - 2rem));
    padding: var(--space-4) 0 var(--space-10);
    margin: auto;
    place-items: center;
}
.auth-gateway__shell {
    display: grid;
    overflow: hidden;
    width: 100%;
    grid-template-columns: minmax(0, .9fr) minmax(22rem, .85fr);
    border-radius: var(--radius-xl) var(--radius-md) var(--radius-xl) var(--radius-lg);
    background: var(--surface);
    box-shadow: inset 0 0 0 1px var(--soft-boundary), var(--shadow-soft);
}
.auth-gateway__story {
    display: flex;
    min-height: 35rem;
    padding: clamp(2rem, 6vw, 5rem);
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    color: var(--colour-white);
    background:
        radial-gradient(circle at 20% 20%, rgba(0, 188, 202, .32), transparent 20rem),
        radial-gradient(circle at 92% 84%, rgba(239, 121, 94, .27), transparent 21rem),
        var(--colour-night-800);
}
.auth-gateway__story h2 { max-width: 12ch; margin-bottom: var(--space-6); color: var(--colour-white); font-size: clamp(2.7rem, 5vw, 5rem); }
.auth-gateway__story > p:not(.eyebrow) { max-width: 31rem; color: #c3d5d7; font-size: var(--font-size-lede); }
.auth-gateway__story-note { margin-top: var(--space-8); font-size: var(--font-size-sm) !important; }
.auth-gateway__form {
    display: flex;
    padding: clamp(2rem, 5vw, 4.25rem);
    flex-direction: column;
    justify-content: center;
    background: var(--glass-strong);
}
.auth-gateway__form h1 { margin-bottom: var(--space-4); font-size: clamp(2.2rem, 4vw, 3.8rem); }
.auth-gateway__intro { margin-bottom: var(--space-8); }
.auth-google { margin: calc(var(--space-3) * -1) 0 var(--space-7); }
.auth-google__button { display: flex; min-height: 2.75rem; justify-content: center; }
.auth-google__terms { max-width: 34rem; margin: var(--space-3) auto 0; color: var(--text-muted); font-size: .72rem; line-height: 1.55; text-align: center; }
.auth-google__terms a { color: var(--accent); font-weight: 750; text-decoration: underline; text-underline-offset: .16rem; }
.auth-google__separator { display: flex; margin-top: var(--space-5); gap: var(--space-3); align-items: center; color: var(--text-muted); font-size: .68rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.auth-google__separator::before,
.auth-google__separator::after { height: 1px; flex: 1; content: ""; background: var(--soft-boundary); }
.auth-gateway__messages { display: grid; gap: var(--space-3); margin-bottom: var(--space-5); }
.auth-gateway__notice {
    margin-bottom: var(--space-5);
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-sm);
    color: var(--ink);
    background: var(--surface-muted);
    box-shadow: inset .28rem 0 0 var(--accent), inset 0 0 0 1px var(--soft-boundary);
    overflow-wrap: anywhere;
}
.auth-gateway__reference { display: block; margin-top: var(--space-2); color: var(--text-muted); font-size: .68rem; font-weight: 700; letter-spacing: .04em; }
.auth-field--code input { text-align: center; font-size: 2rem; font-weight: 800; letter-spacing: .42em; font-variant-numeric: tabular-nums; }
.auth-gateway__resend { margin-top: var(--space-4); text-align: center; }
.text-button { min-height: 2.75rem; padding: .5rem .75rem; color: var(--accent); border: 0; background: transparent; font-weight: 750; text-decoration: underline; text-underline-offset: .25rem; cursor: pointer; }
.auth-gateway__password-help { margin: 0 0 var(--space-5); color: var(--text-muted); font-size: .78rem; }
.auth-consent { display: grid; margin-bottom: var(--space-6); grid-template-columns: 1.25rem 1fr; gap: var(--space-3); align-items: start; color: var(--ink-soft); font-size: .82rem; }
.auth-consent input { width: 1.15rem; height: 1.15rem; margin-top: .15rem; accent-color: var(--accent); }
.auth-consent a { color: var(--accent); text-decoration: underline; text-underline-offset: .2rem; }
.auth-gateway__messages .auth-gateway__notice { margin: 0; }
.auth-gateway__notice--error,
.auth-gateway__notice--danger { box-shadow: inset .28rem 0 0 var(--danger), inset 0 0 0 1px var(--soft-boundary); }
.auth-gateway__notice--warning { box-shadow: inset .28rem 0 0 var(--warning), inset 0 0 0 1px var(--soft-boundary); }
.auth-gateway__notice--success { box-shadow: inset .28rem 0 0 var(--success), inset 0 0 0 1px var(--soft-boundary); }
.auth-field { display: block; margin-bottom: var(--space-5); }
.auth-field > label { display: block; margin-bottom: var(--space-2); color: var(--ink); font-size: .78rem; font-weight: 800; letter-spacing: .04em; }
.auth-field input {
    width: 100%;
    min-height: 3.25rem;
    padding: .8rem 1rem;
    border: 1px solid var(--field-boundary);
    border-radius: var(--radius-sm);
    color: var(--field-text);
    background: var(--field-bg);
}
.auth-field input::placeholder { color: var(--text-muted); opacity: 1; }
.auth-field input:focus { outline: .2rem solid color-mix(in srgb, var(--focus) 48%, transparent); outline-offset: .1rem; border-color: var(--focus); }
.auth-password-control { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-2); align-items: center; }
.auth-password-toggle {
    min-width: 2.75rem;
    min-height: 2.75rem;
    padding: .55rem .8rem;
    border: 0;
    border-radius: var(--radius-pill);
    color: var(--ink);
    background: var(--surface-muted);
    box-shadow: inset 0 0 0 1px var(--field-boundary);
    font-size: var(--font-size-xs);
    font-weight: 800;
    cursor: pointer;
}
.auth-gateway__submit { margin-top: var(--space-2); }
.auth-gateway__links { display: flex; margin-top: var(--space-6); gap: var(--space-4) var(--space-6); align-items: center; justify-content: space-between; flex-wrap: wrap; color: var(--text-muted); font-size: var(--font-size-sm); }
.auth-gateway__links a:not(.text-link) { color: var(--accent); font-weight: 800; text-decoration: underline; text-underline-offset: .2rem; }

/* Existing child-template surfaces remain styled during the staged redesign. */
.hero {
    position: relative;
    overflow: clip;
    min-height: 42rem;
    isolation: isolate;
}
.hero::before {
    position: absolute;
    z-index: -1;
    width: min(64rem, 92vw);
    height: min(64rem, 92vw);
    top: -30rem;
    right: -18rem;
    border-radius: 48% 52% 63% 37%;
    background:
        radial-gradient(circle at 35% 38%, var(--atmosphere-cyan), transparent 42%),
        radial-gradient(circle at 65% 64%, var(--atmosphere-violet), transparent 48%),
        radial-gradient(circle at 52% 30%, var(--atmosphere-coral), transparent 45%);
    content: "";
    filter: blur(1rem);
    animation: ambient-drift var(--duration-ambient) var(--ease-standard) infinite alternate;
    pointer-events: none;
}
@keyframes ambient-drift {
    from { transform: translate3d(-1.5rem, -.75rem, 0) rotate(-2deg); }
    to { transform: translate3d(1.25rem, 1rem, 0) rotate(3deg); }
}
[data-ambient-paused="true"] .hero::before { animation-play-state: paused; }
.hero__grid {
    position: relative;
    display: grid;
    min-height: 42rem;
    grid-template-columns: minmax(0, .86fr) minmax(31rem, 1.14fr);
    gap: clamp(2rem, 4.2vw, 4.5rem);
    align-items: center;
    padding-block: clamp(3.25rem, 5.6vw, 5.75rem);
}
.hero__copy h1 { max-width: 50rem; margin-bottom: var(--space-6); }
.hero__copy h1 em { color: var(--accent); font-style: normal; }
.hero__copy .lede { max-width: 40.5rem; margin-bottom: var(--space-8); }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.hero__trust { display: flex; margin-top: var(--space-8); gap: var(--space-5); align-items: center; }
.hero__trust strong { color: var(--ink); font-size: .79rem; letter-spacing: .08em; text-transform: uppercase; }
.hero__trust span { width: 3.4rem; height: .12rem; border-radius: var(--radius-pill); background: var(--accent); opacity: .45; }
.hero__trust p { max-width: 21.25rem; margin: 0; font-size: var(--font-size-sm); }

.system-window {
    position: relative;
    overflow: hidden;
    color: var(--colour-white);
    border-radius: var(--radius-lg) var(--radius-lg) var(--radius-xl) var(--radius-lg);
    background: var(--colour-night-900);
    box-shadow: 1.2rem 1.4rem 0 color-mix(in srgb, var(--accent-bright) 74%, transparent), var(--shadow-night);
}
.system-window__top { display: flex; min-height: 4rem; padding-inline: var(--space-6); align-items: center; justify-content: space-between; box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .13); }
.system-window__top strong { font-size: var(--font-size-sm); letter-spacing: .08em; text-transform: uppercase; }
.system-window__dots { display: flex; gap: .4rem; }
.system-window__dots i { width: .45rem; height: .45rem; border-radius: 50%; background: rgba(255, 255, 255, .35); }
.system-window__body { display: grid; min-height: 29.4rem; grid-template-columns: 5.5rem 1fr; }
.system-window__rail { display: flex; padding: var(--space-6) var(--space-4); gap: var(--space-3); flex-direction: column; box-shadow: inset -1px 0 0 rgba(255, 255, 255, .13); }
.system-window__rail i { display: block; height: 2.1rem; border-radius: var(--radius-xs); background: rgba(255, 255, 255, .07); }
.system-window__rail i:first-child { background: var(--colour-cyan-500); }
.system-window__content { padding: var(--space-8); }
.system-window__intro { display: flex; margin-bottom: var(--space-6); justify-content: space-between; align-items: end; }
.system-window__intro p { margin: 0; color: #91a9ad; font-size: var(--font-size-xs); letter-spacing: .1em; text-transform: uppercase; }
.system-window__intro h2 { margin: var(--space-1) 0 0; color: var(--colour-white); font-size: 1.8rem; letter-spacing: -.03em; }
.system-window__intro span { color: var(--footer-accent); font-size: var(--font-size-xs); }
.system-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3); }
.system-stat { min-height: 6.6rem; padding: var(--space-4); border-radius: var(--radius-sm); background: rgba(255, 255, 255, .055); }
.system-stat small { display: block; color: #91a9ad; font-size: .67rem; text-transform: uppercase; }
.system-stat strong { display: block; margin: .55rem 0 .2rem; color: var(--colour-white); font-size: 1.55rem; }
.system-stat span { color: var(--footer-accent); font-size: .7rem; }
.system-chart { display: grid; min-height: 11rem; margin-top: var(--space-3); padding: var(--space-5); grid-template-columns: 1fr 8.1rem; gap: var(--space-5); border-radius: var(--radius-sm); background: rgba(255, 255, 255, .045); }
.system-bars { display: flex; gap: .55rem; align-items: end; }
.system-bars i { flex: 1; min-height: 22%; border-radius: var(--radius-pill) var(--radius-pill) 0 0; background: #28707a; }
.system-bars i:nth-child(2) { height: 52%; }
.system-bars i:nth-child(3) { height: 72%; background: var(--colour-cyan-500); }
.system-bars i:nth-child(4) { height: 44%; }
.system-bars i:nth-child(5) { height: 86%; background: var(--colour-gold-400); }
.system-bars i:nth-child(6) { height: 66%; }
.system-tasks { display: flex; gap: var(--space-2); flex-direction: column; }
.system-tasks span { padding: .55rem; border-radius: var(--radius-xs); color: #bfd1d3; background: rgba(255, 255, 255, .06); font-size: .67rem; }
.system-note { position: absolute; right: -1.4rem; bottom: -1.6rem; width: 11.25rem; padding: var(--space-4) var(--space-5); border-radius: var(--radius-md) var(--radius-md) var(--radius-xs) var(--radius-md); color: var(--ink); background: var(--surface-solid); box-shadow: var(--shadow-soft); }
.system-note small { display: block; color: var(--accent); font-weight: 800; text-transform: uppercase; }
.system-note strong { display: block; margin-top: var(--space-1); line-height: 1.25; }

.proof-strip { position: relative; background: color-mix(in srgb, var(--surface) 78%, transparent); }
.proof-strip__inner { display: grid; min-height: 7.5rem; padding-block: var(--space-4); grid-template-columns: 1.1fr repeat(3, 1fr); gap: var(--space-3); align-items: stretch; }
.proof-strip__intro,
.proof-link { display: flex; padding: var(--space-5) var(--space-6); flex-direction: column; justify-content: center; border-radius: var(--radius-md); }
.proof-strip__intro { padding-left: 0; color: var(--text-muted); font-size: var(--font-size-sm); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.proof-link { background: var(--surface); transition: transform var(--duration-medium) var(--ease-standard), background-color var(--duration-medium) var(--ease-standard); }
.proof-link strong { font-size: 1.08rem; }
.proof-link span { color: var(--text-muted); font-size: .8rem; }
.proof-link:hover { background: var(--surface-solid); transform: translateY(-.15rem); }
.proof-link:hover strong { color: var(--accent); }

.section,
.page-section { position: relative; padding-block: clamp(3.75rem, 6.5vw, 6.75rem); }
.section--paper,
.page-section--paper { background: linear-gradient(135deg, color-mix(in srgb, var(--canvas-tint) 64%, transparent), color-mix(in srgb, var(--surface) 48%, transparent)); }
.section--ink,
.page-section--ink,
.brief-section { color: var(--colour-white); background: linear-gradient(145deg, var(--colour-night-900), var(--colour-night-800)); }
.section--ink h2,
.section--ink h3,
.page-section--ink h2,
.page-section--ink h3,
.brief-section h2 { color: var(--colour-white); }
.section--ink p,
.page-section--ink p,
.brief-section p { color: #aec3c5; }
.section-heading { display: grid; margin-bottom: clamp(2.25rem, 4vw, 3.75rem); grid-template-columns: 1.2fr .8fr; gap: var(--space-12); align-items: end; }
.section-heading h2 { margin-bottom: 0; }
.section-heading__side { max-width: 32.5rem; }
.section-heading__side p:last-child { margin-bottom: 0; }
.section-heading--single { display: block; max-width: 51rem; }

.services-grid { display: grid; grid-template-columns: 1.12fr .88fr; gap: var(--space-5); }
.service-card { min-height: 22.5rem; padding: clamp(1.75rem, 4vw, 3.6rem); border-radius: var(--radius-xl) var(--radius-sm) var(--radius-xl) var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-soft); }
.service-card:nth-child(2) { border-radius: var(--radius-sm) var(--radius-xl) var(--radius-lg) var(--radius-xl); background: var(--surface-muted); }
.service-card:nth-child(3) { border-radius: var(--radius-xl) var(--radius-lg) var(--radius-sm) var(--radius-xl); background: color-mix(in srgb, var(--surface) 72%, var(--atmosphere-coral)); }
.service-card:nth-child(4) { border-radius: var(--radius-lg) var(--radius-xl) var(--radius-xl) var(--radius-sm); }
.service-card__number { display: flex; margin-bottom: var(--space-16); color: var(--accent); font-size: var(--font-size-xs); font-weight: 800; letter-spacing: .13em; justify-content: space-between; }
.service-card__mark { display: grid; width: 3.4rem; height: 3.4rem; padding: .8rem; place-items: center; border-radius: 44% 56% 48% 52%; background: var(--surface-solid); box-shadow: var(--shadow-clay); }
.service-card__mark svg { width: 100%; height: 100%; stroke: currentColor; fill: none; stroke-width: 1.6; }
.service-card h3 { max-width: 26.25rem; margin-bottom: var(--space-5); font-size: clamp(1.8rem, 3vw, 3.1rem); }
.service-card p { max-width: 33rem; }
.service-card__list { display: flex; padding: 0; gap: var(--space-2) var(--space-5); flex-wrap: wrap; list-style: none; color: var(--ink-soft); font-size: var(--font-size-sm); font-weight: 700; }
.service-card__list li::before { margin-right: var(--space-2); color: var(--accent); content: "+"; }

.work-grid { display: grid; grid-template-columns: 1.25fr .75fr; grid-template-areas: "event wow" "event view"; gap: var(--space-5); }
.work-card { position: relative; overflow: hidden; min-height: 20rem; border-radius: var(--radius-lg); color: var(--colour-white); background: var(--colour-night-800); box-shadow: var(--shadow-soft); }
.work-card--event { min-height: 43rem; grid-area: event; border-radius: var(--radius-xl) var(--radius-md) var(--radius-xl) var(--radius-lg); }
.work-card--wow { grid-area: wow; }
.work-card--view { grid-area: view; }
.work-card img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-slow) var(--ease-standard); }
.work-card::after { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 30%, rgba(4, 13, 16, .9)); content: ""; }
.work-card:hover img { transform: scale(1.025); }
.work-card__content { position: absolute; z-index: 1; right: 0; bottom: 0; left: 0; display: grid; padding: clamp(1.5rem, 3vw, 2.6rem); grid-template-columns: 1fr auto; gap: var(--space-5); align-items: end; }
.work-card__content small { color: var(--footer-accent); font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.work-card__content h3 { margin: var(--space-2) 0 0; color: var(--colour-white); font-size: clamp(1.65rem, 2.6vw, 2.9rem); }
.work-card__arrow { display: grid; width: 3rem; height: 3rem; place-items: center; border-radius: 50%; background: rgba(255, 255, 255, .13); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .3); }

.ops-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(3rem, 9vw, 7.5rem); align-items: center; }
.ops-copy h2 { color: var(--colour-white); }
.ops-list { margin: var(--space-8) 0; padding: 0; list-style: none; }
.ops-list li { display: grid; padding: var(--space-4) 0; grid-template-columns: 1.6rem 1fr; gap: var(--space-3); color: #d5e0e1; }
.ops-list li + li { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1); }
.ops-list li::before { color: var(--colour-cyan-500); content: "↗"; }
.scorecard { position: relative; padding: clamp(1.5rem, 4vw, 3.1rem); border-radius: var(--radius-xl) var(--radius-md) var(--radius-xl) var(--radius-lg); color: var(--ink); background: var(--surface-solid); box-shadow: var(--shadow-night); }
.scorecard__top { display: flex; margin-bottom: var(--space-10); justify-content: space-between; }
.scorecard__top small { color: var(--accent); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.scorecard__top span { font-size: .76rem; }
.scorecard__rows { display: grid; gap: var(--space-5); }
.score-row { display: grid; grid-template-columns: 9.4rem 1fr 2.75rem; gap: var(--space-4); align-items: center; font-size: .82rem; }
.score-track { height: .55rem; border-radius: var(--radius-pill); background: var(--surface-muted); }
.score-track i { display: block; width: 82%; height: 100%; border-radius: inherit; background: var(--accent); }
.score-row:nth-child(2) .score-track i { width: 74%; background: var(--gold); }
.score-row:nth-child(3) .score-track i { width: 91%; background: var(--coral); }
.scorecard__note { margin: var(--space-10) 0 0; padding-top: var(--space-5); box-shadow: inset 0 1px 0 var(--soft-boundary); font-size: .82rem; }

.process-list { counter-reset: process; }
.process-step { display: grid; min-height: 10.6rem; padding: var(--space-8); grid-template-columns: 5rem .85fr 1.15fr; gap: var(--space-8); align-items: center; border-radius: var(--radius-lg); counter-increment: process; }
.process-step:nth-child(even) { background: var(--surface); }
.process-step::before { color: var(--accent); font-size: .8rem; font-weight: 800; content: "0" counter(process); }
.process-step h3 { margin: 0; font-size: clamp(1.7rem, 3vw, 3rem); }
.process-step p { max-width: 34.4rem; margin: 0; }

.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); }
.price-card { position: relative; display: flex; min-height: 32.5rem; padding: var(--space-10); flex-direction: column; border-radius: var(--radius-xl) var(--radius-md) var(--radius-xl) var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-soft); }
.price-card:nth-child(3) { border-radius: var(--radius-md) var(--radius-xl) var(--radius-lg) var(--radius-xl); }
.price-card--featured { color: var(--colour-white); background: var(--colour-night-800); transform: translateY(-1.25rem); }
.price-card--featured h3 { color: var(--colour-white); }
.price-card--featured p,
.price-card--featured li { color: #b6c8ca; }
.price-card__tag { color: var(--accent); font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.price-card--featured .price-card__tag { color: var(--footer-accent); }
.price-card h3 { margin: var(--space-6) 0 var(--space-3); font-size: 1.8rem; }
.price-card__price { margin: var(--space-4) 0 var(--space-8); color: var(--ink); font-size: 2.55rem; font-weight: 750; letter-spacing: -.05em; }
.price-card--featured .price-card__price { color: var(--colour-white); }
.price-card__price small { color: inherit; font-size: .78rem; font-weight: 600; letter-spacing: 0; }
.price-card ul { margin: 0 0 var(--space-8); padding: 0; list-style: none; }
.price-card li { padding: .55rem 0; color: var(--text-muted); font-size: .9rem; }
.price-card li + li { box-shadow: inset 0 1px 0 var(--soft-boundary); }
.price-card li::before { margin-right: .55rem; color: var(--accent); content: "↗"; }
.price-card .button { margin-top: auto; }

.brief-grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(3rem, 9vw, 7.5rem); }
.brief-copy { position: sticky; top: 8.1rem; align-self: start; }
.brief-copy h2 { color: var(--colour-white); }
.brief-copy p { color: #acc0c2; }
.brief-points { display: grid; margin-top: var(--space-10); gap: var(--space-3); }
.brief-points span { padding: var(--space-3) var(--space-4); border-radius: var(--radius-pill); color: #d7e3e4; background: rgba(255, 255, 255, .07); font-size: .88rem; }
.lead-form { padding: clamp(1.75rem, 5vw, 3.6rem); border-radius: var(--radius-xl) var(--radius-md) var(--radius-xl) var(--radius-lg); color: var(--ink); background: var(--surface-solid); box-shadow: var(--shadow-night); }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-5); }
.field { display: block; margin-bottom: var(--space-5); }
.field > span { display: block; margin-bottom: var(--space-2); color: var(--ink); font-size: .76rem; font-weight: 750; letter-spacing: .04em; }
.field input,
.field textarea,
.field select {
    width: 100%;
    min-height: 3.25rem;
    padding: .8rem .9rem;
    color: var(--field-text);
    border: 0;
    border-radius: var(--radius-sm);
    background: var(--field-bg);
    box-shadow: inset 0 0 0 1px var(--field-boundary);
}
.field textarea { resize: vertical; }
.field input:focus,
.field textarea:focus,
.field select:focus { outline: .2rem solid color-mix(in srgb, var(--focus) 48%, transparent); outline-offset: .1rem; box-shadow: inset 0 0 0 1px var(--focus); }
.form-status { min-height: 1.5rem; margin: var(--space-3) 0 0; color: var(--text-muted); font-size: .82rem; }
.form-status[data-state="pending"] { color: var(--accent); }
.form-status[data-state="success"] { color: var(--success); }
.form-status[data-state="error"] { color: var(--danger); }
.form-note { margin: var(--space-3) 0 0; color: var(--text-muted); font-size: var(--font-size-xs); }
.trap-field { position: absolute; left: -625rem; }
form[role="search"] { display: flex; gap: var(--space-3); flex-wrap: wrap; align-items: end; }
form[role="search"] .field { min-width: min(100%, 15rem); margin-bottom: 0; flex: 1 1 15rem; }
form[role="search"] .button { flex: 0 0 auto; }

/* Interior pages. */
.page-hero { position: relative; padding: clamp(5rem, 10vw, 9rem) 0 clamp(4.5rem, 8vw, 7rem); }
.page-hero::before { position: absolute; z-index: -1; inset: 8% 3% 0 12%; border-radius: 42% 58% 61% 39%; background: linear-gradient(120deg, var(--atmosphere-cyan), var(--atmosphere-violet), transparent 72%); content: ""; filter: blur(2rem); pointer-events: none; }
.page-hero__grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: var(--space-20); align-items: end; }
.page-hero h1 { max-width: 56rem; margin-bottom: 0; font-size: clamp(3.2rem, 7vw, 7rem); }
.page-hero__side { max-width: 31rem; }
.page-hero__side p { font-size: 1.12rem; }
.page-hero__index { display: block; margin-bottom: var(--space-5); color: var(--accent); font-size: var(--font-size-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.split-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(3rem, 8vw, 6.9rem); }
.split-layout__sticky { position: sticky; top: 8.1rem; align-self: start; }
.split-layout__sticky h2 { font-size: clamp(2.2rem, 4vw, 4.3rem); }
.content-stack { display: grid; gap: var(--space-5); }
.content-panel { padding: clamp(1.6rem, 4vw, 3rem); border-radius: var(--radius-xl) var(--radius-md) var(--radius-xl) var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-soft); }
.content-panel:nth-child(even) { border-radius: var(--radius-md) var(--radius-xl) var(--radius-lg) var(--radius-xl); background: var(--surface-muted); }
.content-panel h3 { margin-bottom: var(--space-4); }
.content-panel p:last-child { margin-bottom: 0; }
.content-panel--ink { color: var(--colour-white); background: var(--colour-night-800); }
.content-panel--ink h3 { color: var(--colour-white); }
.content-panel--ink p { color: #acc0c2; }
.feature-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-5); }
.feature-item { min-height: 15rem; padding: var(--space-8); border-radius: var(--radius-lg); background: var(--surface); }
.feature-item:nth-child(3n + 2) { background: var(--surface-muted); }
.feature-item small { color: var(--accent); font-weight: 800; letter-spacing: .1em; }
.feature-item h3 { margin: var(--space-10) 0 var(--space-3); }

.portfolio-list { display: grid; gap: var(--space-8); }
.portfolio-row { display: grid; overflow: hidden; min-height: 17rem; grid-template-columns: 1.05fr .95fr; border-radius: var(--radius-xl); background: var(--surface); box-shadow: var(--shadow-soft); }
.portfolio-row:nth-child(even) { grid-template-columns: .95fr 1.05fr; }
.portfolio-row__image { overflow: hidden; background: var(--colour-night-800); }
.portfolio-row__image img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-slow) var(--ease-standard); }
.portfolio-row:hover img { transform: scale(1.02); }
.portfolio-row__copy { display: flex; padding: clamp(1.75rem, 5vw, 3.75rem); flex-direction: column; justify-content: center; }
.portfolio-row__copy small { color: var(--accent); font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.portfolio-row__copy h2 { margin: var(--space-4) 0; font-size: clamp(2rem, 4vw, 4rem); }
.portfolio-row__copy .text-link { align-self: start; margin-top: var(--space-3); }
.legacy-projects { display: grid; margin-top: var(--space-20); grid-template-columns: repeat(3, 1fr); gap: var(--space-5); }
.legacy-card { overflow: hidden; border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-soft); }
.legacy-card__media,
.blog-card__image--fallback { display: grid; aspect-ratio: 16 / 9; place-items: center; color: var(--text-muted); background: linear-gradient(135deg, var(--surface-muted), var(--canvas-tint)); }
.legacy-card__media img { width: 100%; height: 100%; object-fit: cover; }
.legacy-card__media--fallback span,
.blog-card__image--fallback span { font-size: var(--font-size-xs); font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.legacy-card img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.legacy-card__copy { padding: var(--space-6); }
.legacy-card__copy h3 { margin-bottom: var(--space-2); font-size: 1.35rem; }

.contact-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(2.5rem, 8vw, 6.25rem); }
.contact-details { display: grid; gap: var(--space-6); align-content: start; }
.contact-detail { padding: var(--space-5); border-radius: var(--radius-lg); background: var(--surface); }
.contact-detail small { display: block; color: var(--accent); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.contact-detail a,
.contact-detail strong { display: block; margin-top: var(--space-2); font-size: 1.12rem; }

.blog-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-8); }
.blog-card { overflow: hidden; border-radius: var(--radius-xl) var(--radius-md) var(--radius-xl) var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-soft); }
.blog-card:nth-child(even) { border-radius: var(--radius-md) var(--radius-xl) var(--radius-lg) var(--radius-xl); }
.blog-card__image { display: block; overflow: hidden; aspect-ratio: 16 / 9; background: var(--colour-night-800); }
.blog-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-slow) var(--ease-standard); }
.blog-card:hover img { transform: scale(1.025); }
.blog-card__copy { padding: var(--space-8); }
.blog-card__meta { color: var(--accent); font-size: var(--font-size-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.blog-card h2 { margin: var(--space-4) 0; font-size: clamp(1.6rem, 3vw, 2.6rem); }
.pagination { display: flex; margin-top: var(--space-12); gap: var(--space-2); flex-wrap: wrap; align-items: center; }
.pagination a,
.pagination span { display: grid; min-width: 2.75rem; min-height: 2.75rem; padding: var(--space-2); place-items: center; border-radius: var(--radius-pill); background: var(--surface); box-shadow: inset 0 0 0 1px var(--soft-boundary); }
.pagination .current { color: var(--accent-contrast); background: var(--accent-bright); }
.article-shell { width: var(--width-reading); margin-inline: auto; }
.article-header { padding: clamp(5rem, 10vw, 8.75rem) 0 var(--space-16); }
.article-header h1 { font-size: clamp(3rem, 7vw, 6.7rem); }
.article-meta { color: var(--accent); font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.article-image { overflow: hidden; width: min(72.5rem, calc(100vw - 3rem)); aspect-ratio: 16 / 9; margin: 0 auto var(--space-20); border-radius: var(--radius-xl); background: var(--surface-muted); }
.article-image img { width: 100%; height: 100%; border-radius: inherit; object-fit: contain; }
.prose { padding-bottom: 6.9rem; font-size: 1.08rem; }
.prose h2,
.prose h3 { margin-top: 2.2em; }
.prose h2 { font-size: clamp(2rem, 4vw, 3.6rem); }
.prose p,
.prose li { color: var(--ink-soft); }
.prose img { height: auto !important; }
.prose a { color: var(--accent); text-decoration: underline; text-underline-offset: .2rem; }
.empty-state { padding: var(--space-20) var(--space-8); border-radius: var(--radius-xl); text-align: center; background: var(--surface-muted); }
.empty-state h2 { margin-bottom: var(--space-3); font-size: 2rem; }

/* Task 4: editorial sales-page narratives. */
#selected-work,
#services,
#angelb-os,
#education-systems,
#starting-offers,
#project-brief { scroll-margin-top: calc(var(--header-height) + var(--space-8)); }

.studio-orbit {
    position: relative;
    width: min(100%, 31rem);
    aspect-ratio: 1;
    margin-inline: auto;
    border-radius: 48% 52% 44% 56%;
    background:
        radial-gradient(circle at 32% 30%, rgba(255, 255, 255, .85), transparent 20%),
        linear-gradient(145deg, color-mix(in srgb, var(--accent-bright) 68%, var(--canvas-soft)), color-mix(in srgb, var(--violet) 46%, var(--canvas-soft)) 58%, color-mix(in srgb, var(--coral) 54%, var(--canvas-soft)));
    box-shadow: var(--shadow-soft);
    isolation: isolate;
}
.studio-orbit::before,
.studio-orbit::after {
    position: absolute;
    border-radius: 50%;
    content: "";
    pointer-events: none;
}
.studio-orbit::before { inset: 11%; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .55); }
.studio-orbit::after { inset: 24%; background: rgba(255, 253, 248, .2); filter: blur(.6rem); }
.studio-orbit__note {
    position: absolute;
    z-index: 2;
    top: 8%;
    left: 10%;
    margin: 0;
    color: var(--orbit-note-text);
    font-size: var(--font-size-xs);
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.studio-orbit__core {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    width: 58%;
    color: var(--colour-white);
    text-align: center;
    transform: translate(-50%, -50%);
}
.studio-orbit__core span { display: block; margin-bottom: var(--space-2); font-size: var(--font-size-xs); font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.studio-orbit__core strong { display: block; font-family: var(--font-display); font-size: clamp(1.6rem, 3vw, 2.6rem); line-height: 1.05; letter-spacing: -.04em; }
.studio-orbit__node {
    position: absolute;
    z-index: 3;
    display: grid;
    min-height: 2.75rem;
    padding: .7rem var(--space-4);
    place-items: center;
    border-radius: var(--radius-pill);
    color: var(--ink);
    background: var(--glass-strong);
    box-shadow: var(--shadow-clay);
    font-size: var(--font-size-xs);
    font-weight: 800;
}
.studio-orbit__node--strategy { top: 22%; right: -2%; }
.studio-orbit__node--design { right: 7%; bottom: 16%; }
.studio-orbit__node--build { bottom: 8%; left: 5%; }
.studio-orbit__node--manage { top: 31%; left: -5%; }
.home-hero .hero__grid { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); }
.home-hero .hero__copy h1 { font-size: clamp(3.6rem, 5.5vw, 6.1rem); }

/* Hero story slider: one visible product narrative with explicit manual controls. */
.story-slider { position: relative; width: 100%; min-width: 0; }
.story-slider__viewport {
    position: relative;
    display: grid;
    min-width: 0;
    isolation: isolate;
}
.story-slider__slide {
    position: relative;
    z-index: 1;
    grid-area: 1 / 1;
    min-width: 0;
    opacity: 0;
    pointer-events: none;
    transform: translate3d(1.25rem, 0, 0) scale(.985);
    transition: opacity 420ms var(--ease-standard), transform 520ms var(--ease-standard);
}
.story-slider__slide[data-active="true"] { z-index: 2; opacity: 1; pointer-events: auto; transform: translate3d(0, 0, 0) scale(1); }
.story-slider__slide[hidden] { display: none; }
.story-slider .motion-banner__caption--bottom { display: none; }
.story-slider__meta {
    position: absolute;
    z-index: 6;
    right: clamp(1rem, 3vw, 2rem);
    bottom: clamp(4.8rem, 7vw, 5.4rem);
    display: grid;
    max-width: min(25rem, calc(100% - 2rem));
    padding: .95rem 1.1rem;
    gap: .2rem;
    border-radius: 1.2rem 2.2rem 1.2rem 2.2rem;
    color: var(--colour-ink-900);
    background: rgba(255, 253, 248, .9);
    box-shadow: var(--shadow-clay);
    -webkit-backdrop-filter: blur(.9rem);
    backdrop-filter: blur(.9rem);
}
.story-slider__meta span { color: var(--colour-cyan-700); font-size: .62rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.story-slider__meta strong { font-size: clamp(.78rem, 1.15vw, .96rem); line-height: 1.3; }
.story-slider__controls {
    position: absolute;
    z-index: 9;
    bottom: 1rem;
    left: 1rem;
    display: none;
    min-height: 3.35rem;
    padding: .3rem;
    gap: var(--space-2);
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-pill);
    background: rgba(255, 253, 248, .9);
    box-shadow: var(--shadow-clay);
    -webkit-backdrop-filter: blur(.9rem);
    backdrop-filter: blur(.9rem);
}
.story-slider[data-slider-ready="true"] .story-slider__controls { display: flex; }
.story-slider__arrow,
.story-slider__toggle,
.story-slider__tabs button {
    min-height: 2.75rem;
    border: 0;
    color: var(--ink);
    background: var(--surface);
    box-shadow: inset 0 0 0 1px var(--soft-boundary);
    font-size: .72rem;
    font-weight: 800;
    cursor: pointer;
    transition: color var(--duration-fast) var(--ease-standard), background-color var(--duration-fast) var(--ease-standard), transform var(--duration-fast) var(--ease-standard);
}
.story-slider__arrow { width: 2.75rem; padding: 0; border-radius: 50%; font-size: 1.1rem; }
.story-slider__toggle { padding: .65rem .85rem; border-radius: var(--radius-pill); }
.story-slider__tabs { display: flex; padding: .25rem; gap: .2rem; border-radius: var(--radius-pill); background: var(--surface); box-shadow: inset 0 0 0 1px var(--soft-boundary); }
.story-slider__tabs button { padding: .55rem .85rem; border-radius: var(--radius-pill); background: transparent; box-shadow: none; }
.story-slider__tabs button[aria-selected="true"] { color: var(--accent-contrast); background: var(--accent-bright); }
.story-slider__arrow:hover,
.story-slider__toggle:hover { color: var(--accent-contrast); background: var(--accent-bright); transform: translateY(-.08rem); }

/* Full-scale product infographics. Each scene is an inline, brand-owned SVG. */
.motion-banner {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: clamp(28rem, 58vh, 42rem);
    border-radius: 2.2rem 5.5rem 2.8rem 4.5rem;
    isolation: isolate;
    transform: translateZ(0);
}
.motion-banner--studio {
    min-width: 0;
    background:
        radial-gradient(circle at 18% 15%, rgba(255, 255, 255, .64), transparent 23%),
        linear-gradient(145deg, color-mix(in srgb, var(--accent-bright) 22%, var(--surface)), color-mix(in srgb, var(--violet) 22%, var(--surface)) 58%, color-mix(in srgb, var(--coral) 19%, var(--surface)));
    box-shadow: var(--shadow-soft);
}
.motion-banner--operations {
    background: radial-gradient(circle at 78% 17%, rgba(127, 112, 217, .27), transparent 27rem), radial-gradient(circle at 14% 80%, rgba(0, 188, 202, .18), transparent 24rem), var(--colour-night-900);
    box-shadow: var(--shadow-night);
}
.motion-banner--education {
    background: radial-gradient(circle at 18% 20%, rgba(255, 255, 255, .7), transparent 22rem), linear-gradient(135deg, color-mix(in srgb, var(--accent-bright) 18%, var(--surface)), color-mix(in srgb, var(--violet) 20%, var(--surface)) 54%, color-mix(in srgb, var(--coral) 19%, var(--surface)));
    box-shadow: var(--shadow-soft);
}
.motion-banner__canvas { position: absolute; z-index: 2; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.motion-banner__glow { position: absolute; z-index: 1; width: 44%; aspect-ratio: 1; border-radius: 50%; filter: blur(2.5rem); opacity: .52; }
.motion-banner__glow--a { top: 4%; left: -10%; background: var(--atmosphere-cyan); }
.motion-banner__glow--b { right: -9%; bottom: 4%; background: var(--atmosphere-coral); }
.motion-banner__glow--c { top: 2%; right: 12%; background: var(--atmosphere-violet); }
.motion-banner__caption {
    position: absolute;
    z-index: 4;
    display: flex;
    max-width: min(19rem, 44%);
    min-height: 3.5rem;
    padding: .8rem 1.15rem;
    gap: var(--space-3);
    align-items: center;
    border-radius: var(--radius-pill);
    color: var(--ink);
    background: var(--glass-strong);
    box-shadow: var(--shadow-clay);
    -webkit-backdrop-filter: blur(.9rem);
    backdrop-filter: blur(.9rem);
}
.motion-banner--operations .motion-banner__caption { color: var(--colour-ink-900); background: rgba(255, 253, 248, .92); }
.motion-banner__caption span { color: var(--accent); font-size: .65rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.motion-banner--operations .motion-banner__caption span { color: var(--colour-cyan-700); }
.motion-banner__caption strong { color: inherit; font-size: clamp(.72rem, 1.1vw, .94rem); line-height: 1.25; }
.motion-banner__caption svg { width: 1.65rem; height: 1.65rem; flex: 0 0 auto; color: var(--accent); }
.motion-banner__caption--top { top: 6%; left: 5%; }
.motion-banner__caption--right { top: 24%; right: 3%; }
.motion-banner__caption--bottom { right: 8%; bottom: 5%; }
.motion-banner__animated { transform-box: fill-box; transform-origin: center; animation-play-state: paused; will-change: transform, opacity, stroke-dashoffset; }
.infographic-layer { transform-box: fill-box; transform-origin: center; }
.infographic-layer text { font-family: var(--font-body); letter-spacing: .02em; }
.infographic-signal { filter: drop-shadow(0 .3rem .7rem rgba(0, 188, 202, .24)); }
.motion-banner__animated--float { animation: scene-float 5.8s var(--ease-standard) infinite alternate; }
.motion-banner__animated--float-reverse { animation: scene-float-reverse 6.4s var(--ease-standard) infinite alternate; }
.motion-banner__animated--drift { animation: scene-drift 12s var(--ease-standard) infinite alternate; }
.motion-banner__animated--drift-reverse { animation: scene-drift-reverse 14s var(--ease-standard) infinite alternate; }
.motion-banner__animated--breathe { animation: scene-breathe 7s var(--ease-standard) infinite alternate; }
.motion-banner__animated--dash { animation: scene-dash 17s linear infinite; }
.motion-banner__animated--orbit { animation: scene-orbit 9s var(--ease-standard) infinite alternate; }
.motion-banner[data-motion-active="true"] .motion-banner__animated { animation-play-state: running; }
.motion-banner[data-motion-active="false"] .motion-banner__animated,
html[data-ambient-paused="true"] .motion-banner__animated { animation-play-state: paused; }

.os-story__grid { grid-template-columns: 1fr; }
.os-story__copy { display: grid; max-width: 67rem; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: var(--space-5) clamp(2rem, 7vw, 7rem); align-items: start; }
.os-story__copy .eyebrow,
.os-story__copy h2 { grid-column: 1; }
.os-story__copy .lede,
.os-story__copy .ops-list,
.os-story__copy .button { grid-column: 2; }
.os-story__copy .lede { grid-row: 1 / span 2; }
.os-story__copy .button { justify-self: start; }
.os-story__visual-note { max-width: 48rem; margin: 0; color: #9fb5b8; font-size: var(--font-size-xs); }
.education-story__grid { grid-template-columns: 1fr; }
.education-story__intro { display: grid; max-width: 72rem; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: var(--space-4) clamp(2rem, 8vw, 7.5rem); align-items: start; }
.education-story__intro .eyebrow,
.education-story__intro h2 { grid-column: 1; }
.education-story__intro .lede,
.education-story__intro > p:not(.eyebrow):not(.boundary-note),
.education-story__intro .boundary-note,
.education-story__intro .text-link { grid-column: 2; }
.education-story__intro .lede { grid-row: 1 / span 2; }
.education-story__intro .text-link { justify-self: start; }

.proof-stage { background: linear-gradient(145deg, color-mix(in srgb, var(--canvas-tint) 66%, transparent), color-mix(in srgb, var(--surface) 38%, transparent)); }
.proof-gallery { display: grid; grid-template-columns: 1.2fr .8fr; grid-template-areas: "event wow" "event view"; gap: var(--space-5); align-items: start; }
.proof-story { position: relative; display: flex; overflow: hidden; flex-direction: column; border-radius: var(--radius-lg); color: var(--colour-white); background: var(--colour-night-800); box-shadow: var(--shadow-soft); }
.proof-story--event { grid-area: event; border-radius: var(--radius-xl) var(--radius-md) var(--radius-xl) var(--radius-lg); }
.proof-story--wow { grid-area: wow; border-radius: var(--radius-md) var(--radius-xl) var(--radius-lg) var(--radius-xl); }
.proof-story--view { grid-area: view; border-radius: var(--radius-xl) var(--radius-lg) var(--radius-sm) var(--radius-xl); }
.proof-story__media { position: relative; display: block; width: 100%; overflow: hidden; aspect-ratio: 16 / 9; background: var(--colour-night-900); }
.proof-story__media img { display: block; width: 100%; height: 100%; object-fit: contain; }
.proof-story__caption { position: relative; z-index: 1; display: flex; min-height: 6.75rem; padding: clamp(1.25rem, 2.2vw, 2rem); gap: var(--space-5); align-items: center; justify-content: space-between; background: var(--colour-night-800); }
.proof-story__caption small { display: block; margin-bottom: var(--space-1); color: var(--footer-accent); font-size: var(--font-size-xs); font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.proof-story__caption strong { display: block; color: var(--colour-white); font-family: var(--font-display); font-size: clamp(1.5rem, 2.5vw, 2.8rem); letter-spacing: -.04em; }

.service-narrative { overflow: clip; }
.service-flow { display: grid; gap: clamp(2rem, 5vw, 4.5rem); }
.service-chapter {
    position: relative;
    display: grid;
    min-height: 16rem;
    padding: clamp(1.5rem, 4vw, 3.5rem);
    grid-template-columns: minmax(0, .4fr) minmax(0, 1fr) minmax(0, .6fr);
    gap: clamp(1.5rem, 4vw, 3.75rem);
    align-items: center;
    border-radius: 42% 58% 46% 54% / 12% 18% 14% 20%;
}
.service-chapter:nth-child(even) { width: 94%; margin-left: auto; background: var(--surface); box-shadow: var(--shadow-soft); }
.service-chapter:nth-child(3) { width: 92%; background: color-mix(in srgb, var(--surface-muted) 76%, transparent); }
.service-chapter:nth-child(5) { width: 96%; margin-inline: auto 0; background: linear-gradient(125deg, color-mix(in srgb, var(--violet) 13%, var(--surface)), color-mix(in srgb, var(--coral) 11%, var(--surface))); }
.service-chapter__index,
.service-chapter__scope { margin: 0; font-size: var(--font-size-xs); font-weight: 750; }
.service-chapter__index { color: var(--accent); letter-spacing: .1em; text-transform: uppercase; }
.service-chapter__copy h3 { margin-bottom: var(--space-4); font-size: clamp(2rem, 4.3vw, 4.5rem); }
.service-chapter__copy p { max-width: 40rem; margin-bottom: 0; }
.service-chapter__scope { color: var(--ink-soft); line-height: 1.8; }

.os-story { overflow: clip; }
.os-story::before { position: absolute; right: -10rem; bottom: -15rem; width: 36rem; height: 36rem; border-radius: 50%; background: rgba(127, 112, 217, .18); content: ""; filter: blur(3rem); pointer-events: none; }
.os-story__grid { position: relative; display: grid; grid-template-columns: .88fr 1.12fr; gap: clamp(3rem, 8vw, 7rem); align-items: center; }
.direction-board { padding: clamp(1.5rem, 4vw, 3.25rem); border-radius: var(--radius-xl) var(--radius-md) var(--radius-xl) var(--radius-lg); color: var(--ink); background: var(--surface-solid); box-shadow: var(--shadow-night); }
.direction-board__header { display: flex; margin-bottom: var(--space-10); gap: var(--space-4); align-items: end; justify-content: space-between; }
.direction-board__header p { margin: 0; color: var(--accent); font-size: var(--font-size-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.direction-board__header strong { color: var(--ink); font-family: var(--font-display); font-size: 1.25rem; }
.direction-board__list { display: grid; margin: 0; padding: 0; gap: var(--space-3); list-style: none; }
.direction-board__list li { display: flex; min-height: 4.4rem; padding: var(--space-4) var(--space-5); gap: var(--space-4); align-items: center; justify-content: space-between; border-radius: var(--radius-md); background: var(--surface-muted); }
.direction-board__list span { color: var(--ink-soft); font-weight: 700; }
.direction-board__list strong { padding: .35rem .7rem; border-radius: var(--radius-pill); color: var(--warning); background: color-mix(in srgb, var(--warning) 11%, transparent); font-size: var(--font-size-xs); }
.direction-board__list strong[data-state="progress"] { color: var(--accent); background: color-mix(in srgb, var(--accent) 11%, transparent); }
.direction-board__list strong[data-state="input"] { color: var(--violet); background: color-mix(in srgb, var(--violet) 11%, transparent); }
.direction-board__list strong[data-state="ready"] { color: var(--success); background: color-mix(in srgb, var(--success) 11%, transparent); }
.direction-board__note { margin: var(--space-8) 0 0; color: var(--text-muted); font-size: var(--font-size-xs); }

.education-story { overflow: clip; background: radial-gradient(circle at 12% 75%, var(--atmosphere-coral), transparent 28rem); }
.education-story__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(3rem, 9vw, 7.5rem); align-items: start; }
.education-story__body { max-width: 45rem; }
.os-story .os-story__grid,
.education-story .education-story__grid { grid-template-columns: 1fr; }
.boundary-note { padding: var(--space-5) var(--space-6); border-radius: var(--radius-md); color: var(--ink); background: var(--surface-muted); box-shadow: inset .3rem 0 0 var(--accent); }
.boundary-note strong { color: inherit; }

/* Technology narrative and progressive atmospheric motion. */
.home-hero { position: relative; overflow: clip; isolation: isolate; }
.home-hero .hero__grid { position: relative; z-index: 2; }
.atmosphere { position: absolute; z-index: 0; inset: -8% -5% -12%; overflow: hidden; pointer-events: none; }
.atmosphere__field { position: absolute; width: min(48rem, 68vw); aspect-ratio: 1; border-radius: 50%; opacity: .42; will-change: transform; }
.atmosphere__field--a { top: -28%; left: -8%; background: radial-gradient(circle, color-mix(in srgb, var(--accent-bright) 48%, transparent), transparent 68%); animation: atmosphere-drift-a 18s var(--ease-standard) infinite alternate; }
.atmosphere__field--b { right: -10%; bottom: -42%; background: radial-gradient(circle, color-mix(in srgb, var(--coral) 38%, transparent), transparent 70%); animation: atmosphere-drift-b 22s var(--ease-standard) infinite alternate; }
.system-network { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .42; }
.system-network path { fill: none; stroke: color-mix(in srgb, var(--accent) 34%, transparent); stroke-width: 1.35; stroke-dasharray: 10 18; animation: signal-travel 18s linear infinite; }
.system-network path:nth-child(2) { stroke: color-mix(in srgb, var(--violet) 30%, transparent); animation-duration: 24s; animation-direction: reverse; }
.system-network circle { fill: var(--accent-bright); opacity: .72; transform-box: fill-box; transform-origin: center; animation: network-pulse 3.8s var(--ease-standard) infinite alternate; }
.system-network circle:nth-child(even) { animation-delay: -1.9s; }

html[data-ambient-paused="true"] .atmosphere__field,
html[data-ambient-paused="true"] .system-network path,
html[data-ambient-paused="true"] .system-network circle,
html[data-ambient-paused="true"] .studio-orbit__node,
html[data-ambient-paused="true"] .brand::before,
html[data-ambient-paused="true"] [data-capability-signal]::before { animation-play-state: paused; }

.studio-orbit__node { animation: orbit-route 10s var(--ease-standard) infinite; }
.studio-orbit__node--strategy { animation-delay: 0s; }
.studio-orbit__node--design { animation-delay: -2.5s; }
.studio-orbit__node--build { animation-delay: -5s; }
.studio-orbit__node--manage { animation-delay: -7.5s; }

html[data-motion-ready="true"] [data-reveal] { opacity: 0; transform: translateY(1.1rem); transition: opacity .72s var(--ease-standard), transform .72s var(--ease-standard); }
html[data-motion-ready="true"] [data-reveal][data-in-view="true"] { opacity: 1; transform: translateY(0); }
[data-proof-depth] { transform: perspective(72rem) translate3d(var(--proof-shift-x, 0), var(--proof-shift-y, 0), 0) rotateX(var(--proof-rotate-x, 0deg)) rotateY(var(--proof-rotate-y, 0deg)); transition: transform .18s var(--ease-standard), box-shadow var(--duration-medium) var(--ease-standard); transform-style: preserve-3d; }
[data-proof-depth]:hover { box-shadow: var(--shadow-night); }

.systems-map { position: relative; overflow: clip; color: var(--colour-white); background: var(--colour-night-900); }
.systems-map::before { position: absolute; top: -14rem; left: 16%; width: 35rem; height: 35rem; border-radius: 50%; background: rgba(0, 188, 202, .12); content: ""; pointer-events: none; }
.systems-map__grid { position: relative; display: grid; grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); gap: clamp(3rem, 8vw, 8rem); align-items: start; }
.systems-map__intro { position: sticky; top: calc(var(--header-height) + var(--space-8)); }
.systems-map h2 { color: var(--colour-white); }
.systems-map .lede,
.systems-route p { color: #b6c8ca; }
.systems-route { position: relative; display: grid; margin: 0; padding: 0; gap: var(--space-3); list-style: none; }
.systems-route::before { position: absolute; z-index: 0; top: 1.7rem; bottom: 1.7rem; left: 1.2rem; width: .12rem; border-radius: var(--radius-pill); background: rgba(255, 255, 255, .12); content: ""; }
.systems-route[data-capability-signal]::after { position: absolute; z-index: 1; top: 1.7rem; left: .88rem; width: .75rem; height: .75rem; border-radius: 50%; background: var(--colour-cyan-500); box-shadow: 0 0 0 .45rem rgba(0, 188, 202, .12); content: ""; animation: signal-step 8s var(--ease-standard) infinite alternate; }
.systems-route li { position: relative; z-index: 2; display: grid; min-height: 7.4rem; padding: var(--space-5) var(--space-5) var(--space-5) 3.4rem; grid-template-columns: 3rem 1fr; gap: var(--space-4); align-items: start; border-radius: var(--radius-lg); background: rgba(255, 255, 255, .045); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.systems-route li > span { color: var(--footer-accent); font-size: var(--font-size-xs); font-weight: 850; letter-spacing: .12em; }
.systems-route strong { display: block; margin-bottom: var(--space-2); color: var(--colour-white); font-family: var(--font-display); font-size: clamp(1.4rem, 2.3vw, 2.15rem); }
.systems-route p { margin: 0; }

.capability-field { overflow: clip; background: radial-gradient(circle at 82% 16%, var(--atmosphere-violet), transparent 30rem); }
.capability-field__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(3rem, 9vw, 8rem); align-items: start; }
.capability-field__intro { position: sticky; top: calc(var(--header-height) + var(--space-8)); }
.capability-spectrum { display: grid; margin: 0; padding: 0; gap: var(--space-3); list-style: none; }
.capability-spectrum li { display: grid; min-height: 6.5rem; padding: var(--space-5) clamp(1.25rem, 4vw, 3rem); grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: var(--space-6); align-items: center; border-radius: 44% 56% 48% 52% / 20% 24% 18% 22%; background: var(--surface); box-shadow: var(--shadow-soft); }
.capability-spectrum li:nth-child(even) { width: 94%; margin-left: auto; background: color-mix(in srgb, var(--surface-muted) 84%, transparent); }
.capability-spectrum span { color: var(--ink); font-family: var(--font-display); font-size: clamp(1.25rem, 2.4vw, 2.1rem); font-weight: 780; line-height: 1.05; }
.capability-spectrum small { color: var(--ink-soft); font-size: .88rem; line-height: 1.65; }

.operating-story { overflow: clip; background: linear-gradient(135deg, color-mix(in srgb, var(--canvas-tint) 74%, transparent), color-mix(in srgb, var(--surface) 56%, transparent)); }
.operating-story__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(3rem, 9vw, 8rem); align-items: start; }
.operating-story__body { max-width: 48rem; }
.operating-ledger { display: grid; margin: var(--space-10) 0 0; gap: var(--space-4); }
.operating-ledger div { display: grid; padding: var(--space-5) 0; grid-template-columns: minmax(10rem, .48fr) 1fr; gap: var(--space-6); border-bottom: 1px solid var(--soft-boundary); }
.operating-ledger dt { color: var(--accent); font-size: var(--font-size-xs); font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.operating-ledger dd { margin: 0; color: var(--ink-soft); }

@keyframes halo-breathe {
    from { opacity: .32; transform: translate(-50%, -50%) scale(.84); }
    to { opacity: .64; transform: translate(-50%, -50%) scale(1.08); }
}
@keyframes atmosphere-drift-a {
    from { transform: translate3d(-3%, -2%, 0) scale(.94); }
    to { transform: translate3d(12%, 8%, 0) scale(1.08); }
}
@keyframes atmosphere-drift-b {
    from { transform: translate3d(5%, 4%, 0) scale(1.04); }
    to { transform: translate3d(-10%, -9%, 0) scale(.9); }
}
@keyframes signal-travel { to { stroke-dashoffset: -280; } }
@keyframes network-pulse { from { opacity: .38; transform: scale(.78); } to { opacity: .88; transform: scale(1.18); } }
@keyframes orbit-route {
    0%, 100% { transform: translate3d(0, 0, 0); }
    25% { transform: translate3d(.5rem, -.35rem, 0); }
    50% { transform: translate3d(.15rem, .45rem, 0); }
    75% { transform: translate3d(-.45rem, .08rem, 0); }
}
@keyframes signal-step { from { transform: translateY(0); } to { transform: translateY(calc(100% + 35rem)); } }
@keyframes scene-float { from { transform: translate3d(0, .6rem, 0) rotate(-.4deg); } to { transform: translate3d(.25rem, -1rem, 0) rotate(.55deg); } }
@keyframes scene-float-reverse { from { transform: translate3d(.2rem, -.7rem, 0) rotate(.45deg); } to { transform: translate3d(-.35rem, .85rem, 0) rotate(-.45deg); } }
@keyframes scene-drift { from { transform: translate3d(-3%, -2%, 0) scale(.92); } to { transform: translate3d(9%, 7%, 0) scale(1.08); } }
@keyframes scene-drift-reverse { from { transform: translate3d(6%, 5%, 0) scale(1.04); } to { transform: translate3d(-8%, -6%, 0) scale(.94); } }
@keyframes scene-breathe { from { transform: scale(.985); } to { transform: scale(1.012); } }
@keyframes scene-dash { to { stroke-dashoffset: -440; } }
@keyframes scene-orbit { from { transform: translate3d(-.7rem, .2rem, 0); } to { transform: translate3d(1rem, -.65rem, 0); } }

.starting-story { background: linear-gradient(140deg, color-mix(in srgb, var(--surface) 42%, transparent), color-mix(in srgb, var(--canvas-tint) 64%, transparent)); }
.offer-river { display: grid; gap: var(--space-5); }
.offer-entry { display: grid; min-height: 11.25rem; padding: var(--space-8); grid-template-columns: .45fr 1fr auto auto; gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; border-radius: var(--radius-lg); }
.offer-entry:nth-child(odd) { width: 95%; background: var(--surface); }
.offer-entry:nth-child(3) { margin-left: auto; }
.offer-entry--featured { width: 92%; margin-left: auto; color: var(--colour-white); background: var(--colour-night-800); box-shadow: var(--shadow-soft); }
.offer-entry--featured h3 { color: var(--colour-white); }
.offer-entry--featured p { color: #b6c8ca; }
.offer-entry__cue { margin: 0; color: var(--accent); font-size: var(--font-size-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.offer-entry--featured .offer-entry__cue { color: var(--footer-accent); }
.offer-entry h3 { margin-bottom: var(--space-2); }
.offer-entry div p { margin: 0; }
.offer-entry__price { color: var(--ink); font-family: var(--font-display); font-size: clamp(1.5rem, 3vw, 2.55rem); letter-spacing: -.04em; white-space: nowrap; }
.offer-entry--featured .offer-entry__price { color: var(--colour-white); }
.offer-entry .text-link,
.service-path__action,
.pricing-offer__action,
.service-next__actions .text-link { min-height: 2.75rem; align-items: center; }

.service-ledger { display: grid; gap: clamp(3.5rem, 8vw, 7rem); }
.service-path {
    display: grid;
    padding: clamp(1.5rem, 4vw, 3.5rem);
    grid-template-columns: minmax(0, .6fr) minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas: "heading outcome fit" "heading deliverables deliverables" "heading boundary action";
    gap: var(--space-8) clamp(2rem, 5vw, 4.75rem);
    align-items: start;
    border-radius: var(--radius-xl) var(--radius-md) var(--radius-xl) var(--radius-lg);
}
.service-path:nth-child(even) { width: 94%; margin-left: auto; background: var(--surface); box-shadow: var(--shadow-soft); }
.service-path:nth-child(3) { width: 94%; background: color-mix(in srgb, var(--surface-muted) 72%, transparent); }
.service-path--ink { width: 96%; color: var(--colour-white); background: linear-gradient(145deg, var(--colour-night-900), var(--colour-night-700)) !important; }
.service-path--education { width: 98%; grid-template-areas: "heading outcome fit" "heading tracks tracks" "heading deliverables deliverables" "heading boundary action"; background: linear-gradient(125deg, color-mix(in srgb, var(--violet) 12%, var(--surface)), color-mix(in srgb, var(--coral) 11%, var(--surface))); }
.service-path__heading { grid-area: heading; }
.service-path__heading span,
.service-path__label { color: var(--accent); font-size: var(--font-size-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.service-path__heading h3 { margin: var(--space-5) 0 0; font-size: clamp(2.2rem, 4.2vw, 4.4rem); }
.service-path__outcome { grid-area: outcome; }
.service-path__fit { grid-area: fit; }
.service-path__deliverables { grid-area: deliverables; }
.service-path__deliverables ul { display: flex; margin: 0; padding: 0; gap: var(--space-3) var(--space-6); flex-wrap: wrap; list-style: none; }
.service-path__deliverables li { color: var(--ink-soft); font-size: var(--font-size-sm); font-weight: 700; }
.service-path__deliverables li::before { margin-right: var(--space-2); color: var(--accent); content: "+"; }
.service-path__label { margin-bottom: var(--space-3); }
.service-path__outcome p:last-child,
.service-path__fit p:last-child { margin-bottom: 0; }
.service-path__boundary { grid-area: boundary; margin: 0; color: var(--ink-soft); font-size: var(--font-size-sm); }
.service-path__action { grid-area: action; justify-self: end; align-self: end; }
.service-path--ink h3,
.service-path--ink p,
.service-path--ink li { color: var(--colour-white); }
.service-path--ink .service-path__heading span,
.service-path--ink .service-path__label { color: var(--footer-accent); }
.education-tracks { display: grid; grid-area: tracks; grid-template-columns: 1fr 1fr; gap: var(--space-5); }
.education-tracks section { padding: var(--space-6); border-radius: var(--radius-lg); background: var(--surface); }
.education-tracks h4 { margin: 0 0 var(--space-3); font-size: 1.15rem; letter-spacing: -.02em; }
.education-tracks p { margin: 0; font-size: var(--font-size-sm); }

.service-next,
.pricing-next { color: var(--colour-white); background: radial-gradient(circle at 80% 30%, rgba(0, 188, 202, .18), transparent 28rem), var(--colour-night-700); }
.service-next h2,
.pricing-next h2 { color: var(--colour-white); }
.service-next p,
.pricing-next p { color: var(--closing-muted); }
.service-next__grid,
.pricing-next__grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(3rem, 8vw, 7rem); align-items: end; }
.service-next__actions { display: flex; margin-top: var(--space-6); gap: var(--space-5); align-items: center; flex-wrap: wrap; }
.text-link--light { color: var(--colour-white); }

.pricing-ledger { display: grid; gap: clamp(2.5rem, 6vw, 5.5rem); }
.pricing-offer {
    display: grid;
    min-height: 20rem;
    padding: clamp(1.5rem, 4vw, 3.5rem);
    grid-template-columns: .42fr .9fr 1.1fr;
    grid-template-areas: "index title title" "fit scope scope" ". action action";
    gap: var(--space-8) clamp(2rem, 5vw, 4.5rem);
    align-items: start;
    border-radius: var(--radius-xl) var(--radius-md) var(--radius-xl) var(--radius-lg);
    background: var(--surface);
}
.pricing-offer:nth-child(1) { width: 94%; }
.pricing-offer:nth-child(3) { width: 94%; margin-left: auto; background: var(--surface-muted); }
.pricing-offer--featured { width: 97%; margin-left: auto; color: var(--colour-white); background: var(--colour-night-800); box-shadow: var(--shadow-soft); }
.pricing-offer__index { grid-area: index; margin: 0; color: var(--accent); font-size: var(--font-size-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.pricing-offer__title { display: flex; grid-area: title; gap: var(--space-8); align-items: start; justify-content: space-between; }
.pricing-offer__title h3 { margin: 0; font-size: clamp(2rem, 4vw, 4.2rem); }
.pricing-offer__title strong { color: var(--ink); font-family: var(--font-display); font-size: clamp(1.6rem, 3vw, 2.65rem); letter-spacing: -.05em; white-space: nowrap; }
.pricing-offer__fit { grid-area: fit; }
.pricing-offer__scope { grid-area: scope; }
.pricing-offer__label { color: var(--accent); font-size: var(--font-size-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.pricing-offer__scope ul { display: grid; margin: 0; padding: 0; grid-template-columns: 1fr 1fr; gap: var(--space-3) var(--space-8); list-style: none; }
.pricing-offer__scope li { color: var(--ink-soft); font-size: var(--font-size-sm); }
.pricing-offer__scope li::before { margin-right: var(--space-2); color: var(--accent); content: "↗"; }
.pricing-offer__action { grid-area: action; justify-self: end; }
.pricing-offer--featured h3,
.pricing-offer--featured .pricing-offer__title strong { color: var(--colour-white); }
.pricing-offer--featured p,
.pricing-offer--featured li { color: #b6c8ca; }
.pricing-offer--featured .pricing-offer__index,
.pricing-offer--featured .pricing-offer__label { color: var(--footer-accent); }

.proposal-story__grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(3rem, 8vw, 7rem); align-items: start; }
.proposal-story__intro { position: sticky; top: 8.1rem; }
.proposal-stream { display: grid; gap: var(--space-5); }
.proposal-stream article { padding: clamp(1.5rem, 4vw, 3rem); border-radius: var(--radius-xl) var(--radius-md) var(--radius-xl) var(--radius-lg); background: rgba(255, 255, 255, .07); }
.proposal-stream article:nth-child(even) { margin-left: var(--space-10); border-radius: var(--radius-md) var(--radius-xl) var(--radius-lg) var(--radius-xl); }
.proposal-stream span { color: var(--footer-accent); font-size: var(--font-size-xs); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.proposal-stream h3 { margin: var(--space-5) 0 var(--space-3); color: var(--colour-white); }
.proposal-stream p { margin-bottom: 0; color: #b6c8ca; }
.proposal-stream .boundary-note { margin-top: var(--space-5); color: var(--colour-white); background: rgba(0, 188, 202, .12); }

.agreement-story { background: radial-gradient(circle at 8% 84%, var(--atmosphere-violet), transparent 27rem); }
.agreement-story__grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(3rem, 9vw, 7.5rem); }
.agreement-notes { display: grid; margin: 0; gap: var(--space-6); }
.agreement-notes div { display: grid; padding: var(--space-6); grid-template-columns: .55fr 1.45fr; gap: var(--space-6); border-radius: var(--radius-lg); background: var(--surface); }
.agreement-notes div:nth-child(even) { margin-left: var(--space-10); background: var(--surface-muted); }
.agreement-notes dt { color: var(--ink); font-weight: 800; }
.agreement-notes dd { margin: 0; color: var(--text-muted); }

@media (max-width: 53.75rem) {
    .proof-gallery { grid-template-columns: 1fr; grid-template-areas: "event" "wow" "view"; }
    .home-hero .hero__grid { grid-template-columns: 1fr; }
    .service-chapter { grid-template-columns: minmax(7rem, .35fr) minmax(0, 1fr); }
    .service-chapter__scope { grid-column: 2; }
    .os-story__grid,
    .education-story__grid,
    .service-next__grid,
    .pricing-next__grid,
    .proposal-story__grid,
    .agreement-story__grid { grid-template-columns: 1fr; }
    .motion-banner--studio { min-width: 0; }
    .os-story__copy,
    .education-story__intro { grid-template-columns: 1fr; }
    .os-story__copy .eyebrow,
    .os-story__copy h2,
    .os-story__copy .lede,
    .os-story__copy .ops-list,
    .os-story__copy .button,
    .education-story__intro .eyebrow,
    .education-story__intro h2,
    .education-story__intro .lede,
    .education-story__intro > p:not(.eyebrow):not(.boundary-note),
    .education-story__intro .boundary-note,
    .education-story__intro .text-link { grid-column: 1; grid-row: auto; }
    .service-path,
    .service-path--education {
        width: 100%;
        grid-template-columns: 1fr 1fr;
        grid-template-areas: "heading heading" "outcome fit" "tracks tracks" "deliverables deliverables" "boundary action";
    }
    .service-path:nth-child(even),
    .service-path:nth-child(3),
    .service-path--ink,
    .service-path--education { width: 100%; }
    .pricing-offer,
    .pricing-offer:nth-child(1),
    .pricing-offer:nth-child(3),
    .pricing-offer--featured {
        width: 100%;
        grid-template-columns: 1fr 1fr;
        grid-template-areas: "index index" "title title" "fit scope" ". action";
    }
    .proposal-story__intro { position: static; }
}

@media (max-width: 37.5rem) {
    .motion-banner { min-height: clamp(25rem, 110vw, 31rem); border-radius: 1.6rem 3.2rem 2rem 2.8rem; }
    .motion-banner__caption { max-width: 66%; padding: .65rem .8rem; }
    .motion-banner__caption--top { top: 3%; left: 3%; }
    .motion-banner__caption--right { top: auto; right: 2%; bottom: 18%; }
    .motion-banner__caption--bottom { right: 4%; bottom: 3%; }
    .studio-orbit { width: calc(100% - 1rem); }
    .studio-orbit__note { top: 6%; left: 7%; }
    .studio-orbit__node { min-height: 2.5rem; padding: .55rem .75rem; font-size: .65rem; }
    .studio-orbit__node--strategy { right: -3%; }
    .studio-orbit__node--manage { left: -3%; }
    .story-slider__controls { right: .5rem; bottom: .5rem; left: .5rem; gap: .2rem; justify-content: space-between; }
    .story-slider__tabs { min-width: 0; flex: 1; justify-content: center; }
    .story-slider__tabs button { min-width: 0; padding-inline: .35rem; font-size: .58rem; }
    .story-slider__arrow,
    .story-slider__toggle { width: 2.45rem; min-width: 2.45rem; min-height: 2.45rem; padding: 0; }
    .story-slider__toggle { border-radius: 50%; font-size: 0; }
    .story-slider__toggle::before { content: "Ⅱ"; }
    .story-slider__toggle[aria-pressed="true"]::before { content: "▶"; }
    .story-slider__toggle::before { font-size: .72rem; font-weight: 850; }
    .story-slider__meta { right: .75rem; bottom: 4.35rem; max-width: calc(100% - 1.5rem); padding: .75rem .85rem; }
    .service-chapter { width: 100% !important; min-height: 0; padding: var(--space-8) var(--space-5); grid-template-columns: 1fr; border-radius: var(--radius-lg); }
    .service-chapter__scope { grid-column: 1; }
    .direction-board__header,
    .direction-board__list li { align-items: start; flex-direction: column; }
    .direction-board__header strong { font-size: 1.05rem; }
    .offer-entry { width: 100% !important; padding: var(--space-8) var(--space-5); grid-template-columns: 1fr; }
    .offer-entry__price { white-space: normal; }
    .service-path,
    .service-path--education { padding: var(--space-8) var(--space-5); grid-template-columns: 1fr; grid-template-areas: "heading" "outcome" "fit" "tracks" "deliverables" "boundary" "action"; border-radius: var(--radius-lg); }
    .service-path__action { justify-self: start; }
    .education-tracks { grid-template-columns: 1fr; }
    .service-next__actions { align-items: start; flex-direction: column; }
    .pricing-offer,
    .pricing-offer:nth-child(1),
    .pricing-offer:nth-child(3),
    .pricing-offer--featured { padding: var(--space-8) var(--space-5); grid-template-columns: 1fr; grid-template-areas: "index" "title" "fit" "scope" "action"; border-radius: var(--radius-lg); }
    .pricing-offer__title { gap: var(--space-4); flex-direction: column; }
    .pricing-offer__title strong { white-space: normal; }
    .pricing-offer__scope ul { grid-template-columns: 1fr; }
    .pricing-offer__action { justify-self: start; }
    .proposal-stream article:nth-child(even),
    .agreement-notes div:nth-child(even) { margin-left: 0; }
    .agreement-notes div { grid-template-columns: 1fr; }
}

/* Seamless closing field and footer. */
.closing-cta { position: relative; z-index: 1; padding-block: clamp(3.75rem, 6.5vw, 6.5rem); color: var(--closing-text); background: radial-gradient(circle at 18% 15%, rgba(0, 188, 202, .22), transparent 34rem), radial-gradient(circle at 88% 90%, rgba(127, 112, 217, .19), transparent 30rem), var(--closing-bg); }
.closing-cta__grid { display: grid; grid-template-columns: .34fr .86fr .8fr; gap: clamp(1.75rem, 5vw, 4.4rem); align-items: start; }
.closing-cta h2 { margin-bottom: 0; color: var(--closing-text); font-size: clamp(2.7rem, 5vw, 5.7rem); }
.closing-cta__action p { color: var(--closing-muted); }
.site-footer { position: relative; z-index: 1; padding-top: var(--space-12); color: var(--footer-text); background: linear-gradient(180deg, var(--closing-bg), var(--footer-bg) 22%); }
.footer-grid { display: grid; padding-bottom: var(--space-12); grid-template-columns: 1.4fr .7fr .8fr 1.1fr; gap: var(--space-10); }
.footer-brand img { width: 13.4rem; margin-bottom: var(--space-6); }
.footer-brand p { max-width: 20.6rem; color: var(--footer-muted); }
.footer-brand a { color: var(--footer-accent); }
.footer-brand a,
.contact-detail a,
.prose a { overflow-wrap: anywhere; }
.footer-links h2,
.footer-newsletter h2 { margin-bottom: var(--space-5); color: var(--footer-text); font-family: var(--font-body); font-size: .76rem; letter-spacing: .12em; text-transform: uppercase; }
.footer-links a { display: block; margin: .65rem 0; color: var(--footer-muted); font-size: .9rem; }
.footer-links a:hover { color: var(--footer-text); }
.footer-newsletter p { color: var(--footer-muted); font-size: .88rem; }
.newsletter-control { display: grid; grid-template-columns: 1fr 2.9rem; border-radius: var(--radius-pill); background: rgba(255, 255, 255, .07); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .17); }
.newsletter-control input { min-width: 0; min-height: 3rem; padding: .8rem var(--space-4); color: var(--footer-text); border: 0; outline: 0; background: transparent; }
.newsletter-control input::placeholder { color: var(--footer-muted); }
.newsletter-control button { min-width: 2.75rem; min-height: 2.75rem; color: var(--footer-text); border: 0; background: transparent; cursor: pointer; }
.site-footer .form-status { color: var(--footer-muted); }
.site-footer .form-status[data-state="success"] { color: var(--colour-success-dark); }
.site-footer .form-status[data-state="error"] { color: var(--colour-danger-dark); }
.footer-base { display: flex; min-height: 4.75rem; align-items: center; justify-content: space-between; }
.footer-base p { margin: 0; color: var(--footer-muted); font-size: .78rem; }
.footer-base div { display: flex; gap: var(--space-6); }
.footer-base a { color: var(--footer-muted); font-size: .78rem; }

/* Functional-glass project assistant. */
.sales-chat { position: relative; z-index: var(--z-assistant); }
.chat-fields { display: block; }
.chat-launcher {
    position: fixed;
    z-index: calc(var(--z-assistant) - 10);
    right: var(--space-5);
    bottom: var(--space-5);
    display: grid;
    min-width: 15.3rem;
    min-height: 3.5rem;
    padding: .8rem var(--space-4);
    grid-template-columns: .7rem 1fr 1.6rem;
    gap: var(--space-3);
    align-items: center;
    border: 0;
    border-radius: var(--radius-pill);
    color: var(--colour-white);
    background: var(--colour-night-900);
    box-shadow: var(--shadow-night);
    text-align: left;
    cursor: pointer;
}
.chat-launcher strong,
.chat-launcher small { display: block; }
.chat-launcher strong { font-size: .83rem; }
.chat-launcher small { color: #a6bbbe; font-size: .68rem; }
.chat-launcher__pulse { width: .55rem; height: .55rem; border-radius: 50%; background: var(--colour-cyan-500); box-shadow: 0 0 0 .3rem rgba(0, 188, 202, .15); }
.chat-launcher__arrow { text-align: right; }
.chat-panel { position: fixed; z-index: var(--z-assistant); right: var(--space-5); bottom: var(--space-5); overflow: hidden; width: min(28.75rem, calc(100vw - 2rem)); max-height: min(47.5rem, calc(100vh - 2.5rem)); border-radius: var(--radius-xl) var(--radius-xl) var(--radius-sm) var(--radius-xl); color: var(--ink); background: var(--assistant-bg); box-shadow: inset 0 0 0 1px var(--soft-boundary), var(--shadow-night); }
.chat-panel__header { display: flex; padding: var(--space-5) var(--space-6); color: var(--colour-white); background: var(--assistant-ink-bg); justify-content: space-between; align-items: start; }
.chat-panel__header h2 { margin: var(--space-2) 0 0; color: var(--colour-white); font-size: 1.55rem; }
.chat-presence { color: #a6bbbe; font-size: .68rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.chat-presence i { display: inline-block; width: .45rem; height: .45rem; margin-right: .4rem; border-radius: 50%; background: var(--colour-cyan-500); }
.icon-button { display: grid; width: 2.75rem; height: 2.75rem; place-items: center; border: 0; border-radius: 50%; color: var(--colour-white); background: rgba(255, 255, 255, .1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2); font-size: 1.4rem; cursor: pointer; }
.chat-panel__body { overflow-y: auto; max-height: calc(min(47.5rem, 100vh - 2.5rem) - 6.3rem); padding: var(--space-6); }
.chat-message { padding: var(--space-4); border-radius: var(--radius-md); background: var(--surface-muted); box-shadow: inset .25rem 0 0 var(--accent); font-size: .84rem; }
.project-reference { overflow-wrap: anywhere; word-break: break-word; }
.chat-topics { display: grid; margin: var(--space-5) 0; padding: 0; gap: var(--space-2); border: 0; }
.chat-topics legend { margin-bottom: var(--space-3); font-size: .76rem; font-weight: 750; }
.chat-topics label { position: relative; cursor: pointer; }
.chat-topics input { position: absolute; opacity: 0; pointer-events: none; }
.chat-topics span { display: block; min-height: 2.75rem; padding: .7rem .85rem; border-radius: var(--radius-pill); background: var(--surface); box-shadow: inset 0 0 0 1px var(--soft-boundary); font-size: .82rem; transition: background-color var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard), box-shadow var(--duration-fast) var(--ease-standard); }
.chat-topics input:checked + span { color: var(--accent-contrast); background: var(--accent-bright); box-shadow: none; }
.chat-topics input:focus-visible + span { outline: .2rem solid var(--focus); outline-offset: .15rem; }

@media (max-width: 67.5rem) {
    :root { --width-shell: min(calc(100% - 2.5rem), 60rem); }
    .primary-nav { gap: var(--space-4); }
    .primary-nav .nav-login { display: none; }
    .theme-toggle span:last-child { display: none; }
    .hero__grid { grid-template-columns: minmax(0, 1fr) minmax(26rem, .9fr); gap: var(--space-8); }
    .footer-grid { grid-template-columns: 1.3fr .8fr .8fr; }
    .footer-newsletter { grid-column: 1 / -1; max-width: 32.5rem; }
}

@media (max-width: 53.75rem) {
    :root { --width-shell: min(calc(100% - 2rem), 45rem); }
    h1 { font-size: clamp(3.15rem, 12vw, 5.7rem); }
    .site-header { padding-top: var(--space-2); }
    .site-header__inner { min-height: 4.25rem; padding-left: var(--space-4); flex-wrap: wrap; }
    [data-js="true"] .site-header__inner { flex-wrap: nowrap; }
    .brand { min-width: 8.4rem; }
    .brand__mark { width: 2.15rem; }
    .brand__wordmark { max-width: 7.6rem; font-size: .63rem; }
    [data-js="true"] .menu-toggle { display: flex; gap: var(--space-3); align-items: center; }
    .menu-toggle__label { font-size: .78rem; font-weight: 750; }
    .menu-toggle__lines { display: grid; width: 1.5rem; gap: .4rem; }
    .menu-toggle__lines i { height: .12rem; border-radius: var(--radius-pill); background: var(--ink); transition: transform var(--duration-medium) var(--ease-standard), opacity var(--duration-medium) var(--ease-standard); }
    .menu-toggle[aria-expanded="true"] .menu-toggle__lines i:first-child { transform: translateY(.25rem) rotate(45deg); }
    .menu-toggle[aria-expanded="true"] .menu-toggle__lines i:last-child { transform: translateY(-.25rem) rotate(-45deg); }
    .primary-nav {
        position: static;
        display: flex;
        width: 100%;
        max-height: none;
        padding: var(--space-4) 0 var(--space-2);
        gap: 0;
        align-items: stretch;
        flex-direction: column;
        overflow: visible;
        color: var(--ink);
        background: transparent;
        box-shadow: none;
        opacity: 1;
        transform: none;
        transition: none;
    }
    @supports ((-webkit-backdrop-filter: blur(1rem)) or (backdrop-filter: blur(1rem))) {
        .primary-nav {
            -webkit-backdrop-filter: blur(var(--blur-glass));
            backdrop-filter: blur(var(--blur-glass));
        }
    }
    [data-js="true"] .primary-nav {
        position: fixed;
        inset: 5.5rem 1rem auto;
        width: auto;
        max-height: calc(100vh - 6.5rem);
        padding: var(--space-5);
        overflow-y: auto;
        border-radius: var(--radius-lg);
        background: var(--glass-strong);
        box-shadow: inset 0 0 0 1px var(--header-boundary), var(--shadow-soft);
        opacity: 0;
        transform: translateY(-.5rem);
        transition: opacity var(--duration-medium) var(--ease-standard), transform var(--duration-medium) var(--ease-standard);
    }
    [data-js="true"] .primary-nav[data-open="true"] { opacity: 1; transform: translateY(0); }
    .primary-nav > a:not(.button) { min-height: 2.75rem; padding: .75rem var(--space-2); font-size: 1.05rem; }
    .primary-nav > a::after { display: none; }
    .primary-nav .nav-login { display: block; }
    .primary-nav .theme-toggle { margin: var(--space-2) 0; justify-content: center; }
    .primary-nav .theme-toggle span:last-child { display: inline; }
    .primary-nav .button { margin-top: var(--space-2); }
    .hero,
    .hero__grid { min-height: auto; }
    .hero__grid { grid-template-columns: 1fr; padding: var(--space-12) 0 var(--space-16); }
    .hero__visual { max-width: 38rem; }
    .system-note { right: var(--space-4); }
    .proof-strip__inner { grid-template-columns: repeat(3, 1fr); }
    .proof-strip__intro { grid-column: 1 / -1; min-height: 4.5rem; padding-bottom: 0; }
    .section-heading,
    .page-hero__grid { grid-template-columns: 1fr; gap: var(--space-6); }
    .services-grid,
    .work-grid,
    .ops-grid,
    .brief-grid,
    .split-layout,
    .contact-grid { grid-template-columns: 1fr; }
    .work-grid { grid-template-areas: "event" "wow" "view"; }
    .work-card--event { min-height: 28.75rem; }
    .ops-copy { max-width: 40.6rem; }
    .process-step { grid-template-columns: 3.75rem .7fr 1.3fr; }
    .pricing-grid { grid-template-columns: 1fr; max-width: 38.75rem; margin-inline: auto; }
    .price-card--featured { transform: none; }
    .brief-copy,
    .split-layout__sticky { position: static; }
    .closing-cta__grid { grid-template-columns: 1fr; }
    .closing-cta__grid > .eyebrow { margin-bottom: 0; }
    .footer-grid { grid-template-columns: 1.2fr .8fr .8fr; }
    .portfolio-row,
    .portfolio-row:nth-child(even) { grid-template-columns: 1fr; }
    .portfolio-row__image { aspect-ratio: 16 / 9; }
    .legacy-projects { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 37.5rem) {
    :root { --width-shell: calc(100vw - 1.75rem); --width-reading: calc(100vw - 1.75rem); }
    body { font-size: .94rem; }
    h2 { font-size: clamp(2.35rem, 12vw, 4rem); }
    .site-header__inner { border-radius: var(--radius-lg); }
    .hero__grid { padding: var(--space-12) 0 var(--space-16); }
    .hero__copy h1 { font-size: clamp(2.9rem, 13vw, 4rem); }
    .hero__trust { margin-top: var(--space-10); gap: var(--space-3); align-items: start; flex-wrap: wrap; }
    .hero__trust span { display: none; }
    .hero__trust p { width: 100%; }
    .hero__visual { max-width: calc(100vw - 2.4rem); margin-right: var(--space-3); }
    .system-window { box-shadow: .8rem 1rem 0 color-mix(in srgb, var(--accent-bright) 74%, transparent), var(--shadow-soft); }
    .system-window__body { grid-template-columns: 3.5rem 1fr; min-height: 24.4rem; }
    .system-window__rail { padding: var(--space-5) var(--space-2); }
    .system-window__content { padding: var(--space-5) var(--space-3); }
    .system-window__intro { align-items: start; flex-direction: column; }
    .system-stats { grid-template-columns: 1fr 1fr; }
    .system-stat:last-child { display: none; }
    .system-chart { min-height: 8.75rem; grid-template-columns: 1fr; }
    .system-tasks,
    .system-note { display: none; }
    .proof-strip__inner { grid-template-columns: 1fr; }
    .proof-link { padding-left: 0; background: transparent; }
    .section,
    .page-section { padding-block: var(--space-16); }
    .section-heading { margin-bottom: var(--space-8); }
    .service-card { min-height: auto; padding: var(--space-8) var(--space-5); }
    .service-card__number { margin-bottom: var(--space-12); }
    .work-card,
    .work-card--event { min-height: 24.4rem; }
    .work-card__content { grid-template-columns: 1fr; }
    .work-card__arrow { display: none; }
    .score-row { grid-template-columns: 6.25rem 1fr 2.1rem; gap: var(--space-2); font-size: .74rem; }
    .process-step { padding: var(--space-6) var(--space-3); grid-template-columns: 2.6rem 1fr; gap: var(--space-2) var(--space-3); }
    .process-step p { grid-column: 2; }
    .price-card { min-height: 0; padding: var(--space-8) var(--space-5); }
    .field-row { grid-template-columns: 1fr; gap: 0; }
    form[role="search"] .button { width: 100%; }
    .lead-form { padding: var(--space-6) var(--space-5); }
    .page-hero { padding-top: var(--space-16); }
    .page-hero h1 { font-size: clamp(3rem, 15vw, 4.8rem); }
    .feature-list,
    .blog-grid { grid-template-columns: 1fr; }
    .feature-item { min-height: 13rem; }
    .legacy-projects { grid-template-columns: 1fr; }
    .article-image { width: var(--width-shell); }
    .closing-cta h2 { font-size: 3rem; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--space-10) var(--space-6); }
    .footer-brand,
    .footer-newsletter { grid-column: 1 / -1; }
    .footer-base { padding: var(--space-5) 0; gap: var(--space-3); align-items: start; flex-direction: column; }
    .chat-launcher { right: var(--space-3); bottom: var(--space-3); width: 3.5rem; min-width: 0; height: 3.5rem; padding: 0; grid-template-columns: 1fr; place-items: center; border-radius: 50%; }
    .chat-launcher > span:not(.chat-launcher__pulse) { display: none; }
    .chat-panel { right: var(--space-2); bottom: var(--space-2); width: calc(100vw - 1rem); max-height: calc(100vh - 1rem); }
    .chat-panel__body { max-height: calc(100vh - 7.4rem); }
    .systems-map__grid,
    .capability-field__grid,
    .operating-story__grid { grid-template-columns: 1fr; }
    .systems-map__intro,
    .capability-field__intro { position: static; }
    .capability-spectrum li { width: 100%; grid-template-columns: 1fr; border-radius: var(--radius-lg); }
    .capability-spectrum li:nth-child(even) { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
    .hero::before { animation: none; }
    .brand::before,
    .atmosphere__field,
    .system-network path,
    .system-network circle,
    .studio-orbit__node,
    .systems-route[data-capability-signal]::after { animation: none !important; }
    html[data-motion-ready="true"] [data-reveal] { opacity: 1; transform: none; }
    [data-proof-depth] { transform: none !important; }
    .story-slider__slide { transform: none !important; }
    .motion-banner__animated { animation: none !important; transform: none !important; }
}

@media (prefers-reduced-transparency: reduce) {
    :root,
    [data-theme="light"] { --glass: var(--colour-pearl-50); --glass-strong: var(--colour-pearl-50); --surface: var(--colour-pearl-50); }
    [data-theme="dark"] { --glass: var(--colour-night-800); --glass-strong: var(--colour-night-800); --surface: var(--colour-night-800); }
    .site-header__inner,
    .primary-nav,
    .chat-panel { -webkit-backdrop-filter: none; backdrop-filter: none; }
}

@media (prefers-contrast: more) {
    :root { --control-boundary: currentColor; --soft-boundary: currentColor; }
    .button,
    .theme-toggle,
    .field input,
    .field textarea,
    .field select,
    .newsletter-control { box-shadow: inset 0 0 0 2px currentColor; }
    .text-link { text-decoration-thickness: .15rem; }
}

@media (forced-colors: active) {
    .site-header__inner,
    .primary-nav,
    .button,
    .theme-toggle,
    .flash,
    .lead-form,
    .studio-orbit,
    .studio-orbit__node,
    .proof-story,
    .direction-board,
    .motion-banner,
    .motion-banner__caption,
    .service-path,
    .offer-entry,
    .pricing-offer,
    .proposal-stream article,
    .agreement-notes div,
    .boundary-note,
    .field input,
    .field textarea,
    .field select,
    .chat-launcher,
    .chat-panel,
    .icon-button,
    .newsletter-control { border: 1px solid CanvasText; box-shadow: none; forced-color-adjust: auto; }
    :focus-visible { outline-color: Highlight; }
    .chat-topics input:checked + span,
    button:disabled { border: 1px solid CanvasText; color: CanvasText; background: Canvas; opacity: 1; }
    .chat-topics input:focus-visible + span { outline-color: Highlight; }
    .hero::before,
    .page-hero::before { display: none; }
}

@media (max-width: 53.75rem) {
    .auth-gateway__main { margin-top: 0; }
    .auth-gateway__shell { grid-template-columns: 1fr; }
    .auth-gateway__story { min-height: 0; padding: var(--space-10) var(--space-6); }
    .auth-gateway__story h2 { max-width: 16ch; font-size: clamp(2.35rem, 10vw, 4rem); }
}

@media (max-width: 37.5rem) {
    .auth-gateway__header,
    .auth-gateway__main { width: calc(100vw - 1.75rem); }
    .auth-gateway__header { min-height: 4rem; }
    .auth-gateway__shell { border-radius: var(--radius-lg); }
    .auth-gateway__story,
    .auth-gateway__form { padding: var(--space-8) var(--space-5); }
    .auth-password-control { grid-template-columns: 1fr; }
    .auth-password-toggle { width: 100%; }
    .auth-gateway__links { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-transparency: reduce) {
    .auth-gateway__shell,
    .auth-gateway__form { background: var(--surface-solid); }
}

@media (forced-colors: active) {
    .auth-gateway__shell,
    .auth-gateway__form,
    .auth-gateway__story,
    .auth-gateway__notice,
    .auth-field input,
    .auth-password-toggle { border: 1px solid CanvasText; box-shadow: none; }
}