@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap');

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

:root {
    --bg-base: #060c1f;
    --bg-muted: #0b1634;
    --surface-1: rgba(12, 24, 52, 0.8);
    --surface-2: rgba(16, 34, 71, 0.85);
    --surface-3: #f4f8ff;
    --surface-4: #ffffff;
    --line-soft: rgba(125, 154, 224, 0.24);
    --line-strong: rgba(120, 157, 255, 0.5);
    --text-primary: #ecf2ff;
    --text-secondary: #bfccf2;
    --text-ink: #0f1b3a;
    --text-ink-soft: #3f4f74;
    --brand-primary: #4f7cff;
    --brand-primary-strong: #2d5df7;
    --brand-accent: #d34fb3;
    --brand-cyan: #35d5ff;
    --status-success: #22c55e;
    --status-warning: #f59e0b;
    --status-pulse: #58a5ff;
    --line-card: rgba(120, 151, 236, 0.34);
    --line-card-hover: rgba(132, 165, 247, 0.5);
    --surface-input: rgba(8, 16, 35, 0.85);
    --surface-overlay: rgba(99, 132, 224, 0.18);
    --shadow-soft: 0 24px 44px rgba(4, 12, 28, 0.25);
    --shadow-lift: 0 30px 60px rgba(6, 13, 31, 0.35);
    --rainier-fg: rgba(125, 154, 224, 0.18);
    --rainier-fg-strong: rgba(125, 154, 224, 0.28);
    --nav-fade-out-ms: 280ms;
    --nav-fade-in-ms: 240ms;
    --nav-peek-band: 80px;
    --nav-scroll-delta: 12px;
    /* CAS-1650 Round 5: hero content z-index is driven by a single custom
       property so the desktop + mobile stacking invariants are expressed
       in one selector instead of two. Desktop uses 2 (above .hero-bg at
       -2 and .hero-overlay at -1 inside an isolated stacking context);
       mobile uses 1 (above .hero-bg-rainier at 0). */
    --hero-content-z: 2;
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 26px;
    --radius-pill: 999px;
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4rem;
    --space-9: 6rem;
    --space-10: 8rem;
    --text-display: clamp(3.75rem, 7vw, 5.5rem);
    --text-h1: clamp(2.75rem, 5vw, 4rem);
    --text-h2: clamp(2rem, 3.4vw, 2.75rem);
    --text-h3: clamp(1.4rem, 2.1vw, 1.75rem);
    --text-body-lg: 1.125rem;
    --text-body: 1rem;
    --text-body-sm: 0.875rem;
    --text-eyebrow: 0.75rem;
    --text-caption: 0.75rem;
    --max-width: 1160px;
    --transition-fast: 180ms ease;
    --transition-med: 320ms ease;
}

html {
    scroll-behavior: smooth;
}

body {
    background:
        radial-gradient(circle at 20% -15%, rgba(84, 124, 255, 0.35), transparent 46%),
        radial-gradient(circle at 85% 5%, rgba(102, 88, 255, 0.3), transparent 40%),
        linear-gradient(160deg, #040916 0%, #09162f 55%, #09152a 100%);
    color: var(--text-primary);
    font-family: 'Manrope', 'Segoe UI', sans-serif;
    line-height: 1.65;
    min-height: 100vh;
}

a {
    color: inherit;
}

.skip-link {
    background: #f6fbff;
    border-radius: 10px;
    color: #0d1a38;
    font-weight: 700;
    left: 1rem;
    padding: 0.55rem 0.8rem;
    position: absolute;
    top: -120px;
    z-index: 250;
}

.skip-link:focus {
    top: 0.8rem;
}

img,
svg {
    display: block;
    max-width: 100%;
}

.container {
    margin: 0 auto;
    max-width: var(--max-width);
    padding: 0 var(--space-5);
}

main {
    display: grid;
    gap: var(--space-6);
    padding-bottom: var(--space-8);
}

section {
    position: relative;
}

.eyebrow {
    color: var(--brand-cyan);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.13em;
    margin-bottom: var(--space-3);
    text-transform: uppercase;
}

.display-title,
h1,
h2,
h3 {
    font-family: 'Space Grotesk', 'Manrope', sans-serif;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

h1 {
    font-size: var(--text-h1);
    margin-bottom: var(--space-4);
}

h2 {
    font-size: var(--text-h2);
    margin-bottom: var(--space-3);
}

h3 {
    font-size: var(--text-h3);
    margin-bottom: var(--space-2);
}

h1, h2, h3 { text-wrap: balance; }
.body-lg { font-size: var(--text-body-lg); line-height: 1.55; }
.eyebrow { font-size: var(--text-eyebrow); }
.metric-value, .plan-tag { font-variant-numeric: tabular-nums; }

p {
    color: inherit;
}

.section-intro {
    color: var(--text-secondary);
    max-width: 68ch;
}

.section-head {
    align-items: end;
    display: flex;
    gap: var(--space-4);
    justify-content: space-between;
    margin-bottom: var(--space-5);
}

.badge-inline {
    align-items: center;
    background: rgba(40, 85, 205, 0.25);
    border: 1px solid rgba(120, 157, 255, 0.33);
    border-radius: var(--radius-pill);
    color: #d7e4ff;
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 700;
    gap: 0.4rem;
    letter-spacing: 0.08em;
    padding: 0.45rem 0.8rem;
    text-transform: uppercase;
}

.navbar {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.015)),
        rgba(4, 10, 24, 0.48);
    border-bottom: 1px solid rgba(120, 157, 255, 0.2);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.08) inset,
        0 16px 44px rgba(3, 9, 22, 0.18);
    position: sticky;
    top: 0;
    transition: background var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);
    z-index: 120;
}

@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
    .navbar {
        -webkit-backdrop-filter: blur(28px) saturate(220%) brightness(1.08);
        backdrop-filter: blur(28px) saturate(220%) brightness(1.08);
        background:
            radial-gradient(circle at 12% 0%, rgba(255, 255, 255, 0.09), transparent 34%),
            linear-gradient(90deg, rgba(124, 145, 255, 0.12), rgba(53, 213, 255, 0.045), rgba(124, 145, 255, 0.1)),
            rgba(4, 10, 24, 0.32);
    }
}

.navbar::after {
    background: linear-gradient(90deg, transparent, rgba(124, 145, 255, 0.46), rgba(53, 213, 255, 0.22), transparent);
    bottom: -1px;
    content: "";
    height: 1px;
    left: 0;
    opacity: 0.45;
    pointer-events: none;
    position: absolute;
    right: 0;
}

.navbar.is-scrolled {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.01)),
        rgba(4, 10, 24, 0.58);
    border-bottom-color: rgba(144, 176, 255, 0.34);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.08) inset,
        0 12px 28px rgba(3, 9, 22, 0.35);
}

.nav-shell {
    align-items: center;
    display: flex;
    gap: var(--space-4);
    justify-content: space-between;
    min-height: 78px;
}

.nav-panel {
    display: block;
}

.nav-toggle {
    background: var(--surface-overlay);
    border: 1px solid var(--line-card-hover);
    min-height: 44px;
    min-width: 44px;
    border-radius: 10px;
    color: #eff5ff;
    cursor: pointer;
    display: none;
    font: inherit;
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.5rem 0.8rem;
}

.logo {
    align-items: center;
    display: inline-flex;
    font-family: 'Space Grotesk', 'Manrope', sans-serif;
    font-size: 1.28rem;
    font-weight: 700;
    gap: 0.62rem;
    letter-spacing: 0.01em;
    text-decoration: none;
}

.logo img {
    /* Doron UX feedback (CAS-1650): logo is a transparent mark.
       No card, no border, no box-shadow ring, no border-radius. */
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: block;
    height: 32px;
    width: 34px;
}

.logo > span {
    color: var(--text-primary);
}

.logo::before {
    display: none;
}

.breadcrumb {
    margin: 0 0 var(--space-3);
    font-size: 0.85rem;
    letter-spacing: 0.04em;
}

.breadcrumb ol {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.breadcrumb li {
    color: var(--text-secondary);
}

.breadcrumb li + li::before {
    content: '/';
    color: rgba(180, 200, 245, 0.45);
    margin-right: 0.4rem;
}

.breadcrumb a {
    color: #d3e1ff;
    text-decoration: none;
}

.breadcrumb a:hover,
.breadcrumb a:focus-visible {
    color: #ffffff;
    text-decoration: underline;
}

.breadcrumb [aria-current="page"] {
    color: #ffffff;
    font-weight: 600;
}

.nav-list {
    align-items: center;
    display: flex;
    gap: var(--space-2);
    list-style: none;
}

.nav-list a {
    align-items: center;
    border-radius: 9px;
    color: #d5e0ff;
    display: inline-flex;
    min-height: 44px;
    font-size: 0.94rem;
    font-weight: 600;
    padding: 0.52rem 0.8rem;
    text-decoration: none;
    transition: color var(--transition-fast), background var(--transition-fast);
}

.nav-list a:hover,
.nav-list a:focus-visible {
    background: rgba(99, 132, 224, 0.18);
    color: #f5f8ff;
}

.nav-list a.is-active,
.nav-list a[aria-current="page"] {
    background: rgba(88, 123, 233, 0.28);
    border: 1px solid rgba(132, 165, 247, 0.5);
    color: #f4f8ff;
}

.btn-primary,
.btn-secondary,
.btn-ghost {
    border-radius: 12px;
    display: inline-flex;
    font-size: 0.95rem;
    font-weight: 700;
    justify-content: center;
    padding: 0.8rem 1.25rem;
    text-decoration: none;
    transition: transform var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
    white-space: nowrap;
}

.btn-primary {
    background: linear-gradient(135deg, var(--brand-primary), var(--brand-accent));
    box-shadow: 0 14px 26px rgba(57, 92, 214, 0.4);
    color: #f7fbff;
}

.btn-primary:hover,
.btn-primary:focus-visible {
    box-shadow: 0 20px 34px rgba(74, 106, 226, 0.45);
    transform: translateY(-2px);
}

.btn-secondary {
    background: rgba(115, 148, 244, 0.14);
    border: 1px solid rgba(136, 166, 255, 0.58);
    color: #d7e5ff;
}

.btn-secondary:hover,
.btn-secondary:focus-visible {
    background: rgba(140, 166, 245, 0.22);
    color: #f5f8ff;
    transform: translateY(-2px);
}

.btn-ghost {
    background: transparent;
    border: 1px solid rgba(124, 165, 255, 0.38);
    color: #b8caf4;
}

.btn-ghost:hover,
.btn-ghost:focus-visible {
    background: rgba(124, 165, 255, 0.12);
    color: #ebf1ff;
    transform: translateY(-2px);
}

.btn-primary:focus-visible,
.btn-secondary:focus-visible,
.btn-ghost:focus-visible,
.nav-list a:focus-visible,
.hero-sandbox-row input:focus-visible,
.form-group input:focus-visible,
.form-group select:focus-visible,
.form-group textarea:focus-visible,
.early-access-form input[type="email"]:focus-visible,
.early-access-form button:focus-visible,
summary:focus-visible {
    outline: 3px solid rgba(79, 124, 255, 0.55);
    outline-offset: 2px;
}

.hero {
    isolation: isolate;
    overflow: hidden;
    padding-top: clamp(3rem, 10vw, 6.5rem);
    position: relative;
}

/* Doron UX feedback (CAS-1650): Mount Rainier silhouette is rendered as a
   decorative background layer behind .hero-grid. The layer is positioned,
   clipped to the hero region (no horizontal overflow at any viewport), and
   does not interact with the mouse. The sky/ground gradient veil inside the
   SVG already blends the mountain into the cobalt/indigo gradient so this
   page-chrome layer reads as a brand anchor, not a sharp foreground subject. */
.hero-bg {
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: -2;
}

.hero-bg svg {
    display: block;
    height: 100%;
    width: 100%;
}

/* Dark contrast overlay sits between the silhouette and the hero copy so
   WCAG AA contrast is preserved on the hero headline and CTA row. */
.hero-overlay {
    background: linear-gradient(180deg, rgba(4, 9, 22, 0.62) 0%, rgba(4, 9, 22, 0.38) 38%, rgba(4, 9, 22, 0.78) 100%);
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: -1;
}

/* On narrow viewports the silhouette compresses with preserveAspectRatio so
   it does not introduce horizontal scroll or push the body height. */
@media (max-width: 760px) {
    .hero {
        padding-top: clamp(3rem, 10vw, 6.5rem);
        /* Doron UX feedback (CAS-1650): layer the original Mount Rainier SVG
           silhouette behind the hero. The asset is a same-origin local SVG
           (assets/rainier-bg.svg) — composed in code, not a third-party photo
           or CDN linkage. The background is fixed-position, anchored to the
           hero region, and never moves. No scroll-jacking. */
        background-image: url("/assets/rainier-bg.svg");
        background-repeat: no-repeat;
        background-position: center bottom;
        background-size: 100% auto;
        background-attachment: scroll;
        overflow: hidden;
    }

    /* The Rainier silhouette is decorative; screen readers ignore it. */
    .hero-bg-rainier {
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background-image: url("/assets/rainier-bg.svg");
        background-repeat: no-repeat;
        background-position: center bottom;
        background-size: 100% auto;
        opacity: 0.85;
    }

    /* CAS-1650 Round 5: bump the hero content z-index down to 1 because
       the mobile path uses .hero-bg-rainier at z-index:0 instead of the
       desktop isolated stacking context. The base `.hero > .container`
       rule above consumes this custom property so the stacking pin is
       expressed once. */
    .hero {
        --hero-content-z: 1;
    }

    .hero-overlay {
        background: linear-gradient(180deg, rgba(4, 9, 22, 0.72) 0%, rgba(4, 9, 22, 0.5) 50%, rgba(4, 9, 22, 0.85) 100%);
    }
}

/* Doron UX feedback (CAS-1650) Round 5: collapse the two duplicate
   `.hero > .container` stacking rules (desktop base + mobile @media
   override) into a single rule whose z-index is driven by a custom
   property. The desktop path uses isolation:isolate + z-index:-2 / -1
   with a desktop content anchor at z-index:2; the mobile path uses
   .hero-bg-rainier at z-index:0 with a mobile content anchor at z-index:1.
   --hero-content-z is set to 2 by default and overridden to 1 inside the
   mobile @media block above (see the (max-width: 760px) media query),
   so the hero copy and CTAs can never be painted behind the mountain at
   any viewport while the layering invariant is expressed once. */
.hero > .container {
    position: relative;
    z-index: var(--hero-content-z, 2);
}

/* Round 4: visible Rainier fallback at all viewports. The mobile media
   block above already sets .hero background-image; we extend the same
   URL to desktop so the silhouette reads even if the inline SVG layer
   is hidden, painted behind a tall panel, or blocked by a future host
   re-write. Pointer-events:none keeps it decorative. */
.hero {
    background-image: url("/assets/rainier-bg.svg");
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 100% auto;
    background-attachment: scroll;
}

/* Round 4: tighten the desktop overlay gradient so the Rainier silhouette
   is readable at desktop widths without dimming the hero copy below
   WCAG AA contrast. The original desktop gradient already sits between
   the SVG and the copy; this raises the lower band so the silhouette
   peaks are not crushed by an opaque ground tone. */
.hero-overlay {
    background: linear-gradient(180deg, rgba(4, 9, 22, 0.58) 0%, rgba(4, 9, 22, 0.32) 32%, rgba(4, 9, 22, 0.66) 100%);
}

/* Rev-3 sticky nav: legacy data-nav-state values are tolerated, but every
   state remains visible so the Liquid Glass shell follows the page scroll. */
.js-ready .navbar {
    transition:
        background var(--transition-fast),
        border-color var(--transition-fast),
        box-shadow var(--transition-fast);
}

.js-ready .navbar[data-nav-state="top"],
.js-ready .navbar[data-nav-state="peek"],
.js-ready .navbar[data-nav-state="fading"] {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    .js-ready .navbar,
    .js-ready .navbar[data-nav-state="top"],
    .js-ready .navbar[data-nav-state="peek"],
    .js-ready .navbar[data-nav-state="fading"] {
        opacity: 1;
        pointer-events: auto;
        transform: none;
        transition: background var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);
    }
}

.hero-brandmark {
    margin: 0 0 var(--space-3);
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
}

.hero-brandmark img {
    /* Doron UX feedback (CAS-1650): hero brandmark is a transparent mark.
       No card, no border, no box-shadow ring, no border-radius. */
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: block;
    height: 60px;
    width: 64px;
}

.hero-grid {
    display: grid;
    gap: var(--space-5);
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
}

.hero-copy p {
    color: var(--text-secondary);
    max-width: 60ch;
}

.cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin: var(--space-5) 0 var(--space-4);
}

.proof-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.proof-chip {
    background: rgba(100, 130, 230, 0.18);
    border: 1px solid rgba(129, 159, 249, 0.38);
    border-radius: var(--radius-pill);
    color: #cfe0ff;
    font-size: 0.77rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.43rem 0.75rem;
    text-transform: uppercase;
}

.hero-interaction {
    background: rgba(11, 24, 51, 0.72);
    border: 1px solid rgba(124, 159, 247, 0.34);
    border-radius: var(--radius-md);
    display: grid;
    gap: 0.8rem;
    margin-top: var(--space-4);
    padding: 0.95rem;
}

.hero-interaction-head {
    align-items: start;
    display: flex;
    gap: var(--space-2);
    justify-content: space-between;
}

.hero-interaction-head strong {
    color: #e7efff;
    font-size: 0.77rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.hero-interaction-head p {
    color: var(--text-secondary);
    font-size: 0.84rem;
    max-width: 45ch;
}

.hero-sandbox-form {
    display: grid;
    gap: 0.6rem;
}

.hero-sandbox-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.hero-sandbox-row input {
    background: rgba(8, 17, 38, 0.9);
    border: 1px solid rgba(135, 169, 255, 0.45);
    border-radius: 10px;
    color: #edf4ff;
    flex: 1 1 260px;
    font-size: 0.92rem;
    min-height: 44px;
    padding: 0.68rem 0.82rem;
}

.hero-sandbox-row input::placeholder {
    color: rgba(206, 219, 251, 0.68);
}

.hero-sandbox-output {
    background: rgba(66, 98, 188, 0.16);
    border: 1px solid rgba(120, 157, 255, 0.34);
    border-radius: 12px;
    display: grid;
    gap: 0.38rem;
    padding: 0.72rem 0.78rem;
    transition: transform var(--transition-fast), box-shadow var(--transition-fast), border-color var(--transition-fast);
}

.hero-sandbox-output-title {
    color: #d9e7ff;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    margin: 0;
    text-transform: uppercase;
}

.hero-sandbox-output p {
    color: #e8f0ff;
    font-size: 0.88rem;
    margin: 0;
}

.hero-sandbox-meta {
    color: var(--text-secondary) !important;
    font-size: 0.81rem !important;
}

.hero-sandbox-output.is-flash {
    border-color: rgba(152, 186, 255, 0.62);
    box-shadow: 0 10px 18px rgba(37, 64, 146, 0.32);
    transform: translateY(-1px);
}

.panel {
    backdrop-filter: blur(8px);
    background: linear-gradient(165deg, rgba(16, 33, 67, 0.84), rgba(10, 20, 44, 0.88));
    border: 1px solid rgba(136, 167, 255, 0.32);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-soft);
    padding: var(--space-4);
}

.hero-panel {
    display: grid;
    gap: var(--space-3);
}

.status-line {
    align-items: center;
    border-bottom: 1px solid rgba(125, 154, 224, 0.2);
    display: flex;
    font-size: 0.92rem;
    justify-content: space-between;
    padding-bottom: var(--space-2);
}

.status-label {
    align-items: center;
    color: #d6e4ff;
    display: inline-flex;
    gap: 0.5rem;
    font-weight: 700;
}

.status-label::before {
    animation: pulse 1.8s ease-in-out infinite;
    background: var(--status-pulse);
    border-radius: 999px;
    content: "";
    height: 0.62rem;
    width: 0.62rem;
}

.agent-queue {
    display: grid;
    gap: var(--space-2);
    list-style: none;
}

.agent-queue li {
    background: rgba(72, 102, 183, 0.18);
    border: 1px solid rgba(118, 149, 236, 0.34);
    border-radius: var(--radius-md);
    display: grid;
    gap: 0.35rem;
    padding: 0.85rem 0.95rem;
}

.agent-queue strong {
    font-size: 0.95rem;
}

.agent-queue span {
    color: var(--text-secondary);
    font-size: 0.85rem;
}

.status-token {
    border-radius: var(--radius-pill);
    font-size: 0.72rem;
    font-weight: 700;
    justify-self: start;
    letter-spacing: 0.08em;
    padding: 0.27rem 0.58rem;
    text-transform: uppercase;
}

.status-token.running {
    background: rgba(93, 130, 255, 0.24);
    color: #dee7ff;
}

.status-token.complete {
    background: rgba(31, 163, 107, 0.22);
    color: #c6f5df;
}

.status-token.next {
    background: rgba(213, 134, 26, 0.2);
    color: #ffe4be;
}

.scene {
    padding-top: var(--space-9);
}

.surface {
    background: rgba(10, 19, 44, 0.7);
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-soft);
    padding: var(--space-5);
}

.grid-3 {
    display: grid;
    gap: var(--space-3);
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid-2 {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.feature-card,
.metric-card,
.flow-card,
.trust-card,
.service-card,
.profile-card,
.contact-card,
.pricing-card,
.workflow-card {
    background: linear-gradient(170deg, rgba(19, 35, 72, 0.8), rgba(12, 24, 53, 0.88));
    border: 1px solid rgba(120, 151, 236, 0.34);
    border-radius: var(--radius-md);
    box-shadow: 0 14px 30px rgba(3, 10, 27, 0.22);
    padding: 1.15rem;
    transition: transform var(--transition-med), border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.feature-card:hover,
.metric-card:hover,
.flow-card:hover,
.trust-card:hover,
.service-card:hover,
.profile-card:hover,
.contact-card:hover,
.pricing-card:hover,
.workflow-card:hover {
    border-color: rgba(141, 171, 255, 0.6);
    box-shadow: var(--shadow-lift);
    transform: translateY(-5px);
}

.feature-card p,
.metric-card p,
.flow-card p,
.trust-card p,
.service-card p,
.profile-card p,
.contact-card p,
.pricing-card p,
.workflow-card p {
    color: var(--text-secondary);
    font-size: 0.95rem;
}

.metric-value {
    color: #f4f7ff;
    font-family: 'Space Grotesk', 'Manrope', sans-serif;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 0.4rem;
}

.timeline {
    counter-reset: step;
    display: grid;
    gap: var(--space-3);
    list-style: none;
}

.timeline li {
    background: rgba(15, 30, 63, 0.78);
    border: 1px solid rgba(127, 160, 244, 0.35);
    border-radius: var(--radius-md);
    padding: 1rem 1rem 1rem 3.35rem;
    position: relative;
}

.timeline li::before {
    align-items: center;
    background: linear-gradient(160deg, rgba(75, 120, 255, 0.88), rgba(125, 99, 255, 0.9));
    border-radius: 12px;
    color: #f6f9ff;
    counter-increment: step;
    content: counter(step);
    display: flex;
    font-size: 0.9rem;
    font-weight: 800;
    height: 1.85rem;
    justify-content: center;
    left: 0.95rem;
    position: absolute;
    top: 1rem;
    width: 1.85rem;
}

.timeline p {
    color: var(--text-secondary);
    font-size: 0.92rem;
}

.workflow-grid {
    display: grid;
    gap: var(--space-3);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: var(--space-4);
}

.workflow-card span {
    color: var(--brand-cyan);
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.early-access-wrap {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
}

.early-access-card,
.try-card {
    background: linear-gradient(165deg, rgba(18, 37, 75, 0.82), rgba(10, 22, 46, 0.9));
    border: 1px solid rgba(136, 166, 252, 0.36);
    border-radius: var(--radius-lg);
    padding: var(--space-4);
}

.early-access-card h3,
.try-card h3 {
    margin-bottom: 0.7rem;
}

.early-access-card p,
.try-card p {
    color: var(--text-secondary);
}

.early-access-form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin-top: 1.2rem;
}

.early-access-form input[type="email"] {
    background: rgba(9, 18, 40, 0.88);
    border: 1px solid rgba(140, 171, 250, 0.42);
    border-radius: 10px;
    color: #eef4ff;
    flex: 1 1 240px;
    font-size: 0.98rem;
    min-height: 47px;
    padding: 0.75rem 0.95rem;
}

.early-access-form input[type="email"]::placeholder {
    color: rgba(205, 218, 250, 0.68);
}

.form-message {
    font-size: 0.92rem;
    margin-top: 0.8rem;
    min-height: 1.4rem;
}

.form-message-success {
    color: #7ef0be;
}

.form-message-error {
    color: #ffd0cf;
}

.form-message-info {
    color: #d1dcfb;
}

details.progressive {
    border-top: 1px solid rgba(130, 161, 236, 0.25);
    margin-top: 1rem;
    padding-top: 1rem;
}

details.progressive + details.progressive {
    margin-top: 0.8rem;
}

summary {
    color: #dee8ff;
    cursor: pointer;
    font-weight: 700;
    list-style: none;
    padding-right: 1.2rem;
    position: relative;
}

summary::-webkit-details-marker {
    display: none;
}

summary::after {
    color: var(--brand-cyan);
    content: "+";
    font-size: 1.05rem;
    position: absolute;
    right: 0;
    top: 0;
    transition: transform var(--transition-fast);
}

details[open] summary::after {
    transform: rotate(45deg);
}

details.progressive p {
    color: var(--text-secondary);
    font-size: 0.9rem;
    margin-top: 0.6rem;
}

.callout-bar {
    align-items: center;
    background: linear-gradient(115deg, rgba(28, 65, 158, 0.78), rgba(78, 69, 164, 0.78));
    border: 1px solid rgba(152, 180, 255, 0.45);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-soft);
    display: grid;
    gap: var(--space-3);
    grid-template-columns: minmax(0, 1.3fr) auto;
    margin-top: var(--space-4);
    padding: 1rem 1.15rem;
}

.callout-bar p {
    color: #eef3ff;
}

.page-shell {
    padding-top: 2.8rem;
}

.page-hero {
    padding-top: 1.5rem;
}

.page-hero .surface {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
}

.page-hero p {
    color: var(--text-secondary);
    max-width: 55ch;
}

.split-note {
    align-self: center;
    background: rgba(13, 26, 53, 0.62);
    border: 1px solid rgba(124, 162, 245, 0.33);
    border-radius: var(--radius-md);
    padding: 1rem;
}

.split-note p {
    font-size: 0.92rem;
}

.pricing-shell {
    padding-top: 2.8rem;
}

.pricing-hero .surface {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
}

.pricing-badges {
    display: grid;
    gap: 0.55rem;
    list-style: none;
    margin-top: 0.85rem;
}

.pricing-badges li {
    color: var(--text-secondary);
    font-size: 0.9rem;
    padding-left: 1rem;
    position: relative;
}

.pricing-badges li::before {
    color: var(--brand-cyan);
    content: "-";
    left: 0;
    position: absolute;
}

.bill-anatomy-grid {
    display: grid;
    gap: var(--space-3);
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.anatomy-card,
.plan-card,
.policy-card {
    background: linear-gradient(170deg, rgba(19, 35, 72, 0.82), rgba(12, 24, 53, 0.9));
    border: 1px solid rgba(120, 151, 236, 0.34);
    border-radius: var(--radius-md);
    box-shadow: 0 14px 30px rgba(3, 10, 27, 0.24);
    padding: 1.15rem;
}

.anatomy-label,
.plan-tag {
    color: var(--brand-cyan);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin-bottom: 0.45rem;
    text-transform: uppercase;
}

.anatomy-card p,
.plan-card p,
.policy-card p {
    color: var(--text-secondary);
    font-size: 0.93rem;
}

.plan-grid {
    display: grid;
    gap: var(--space-3);
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.stacked-list {
    display: grid;
    gap: 0.45rem;
    list-style: none;
    margin-top: 0.85rem;
}

.stacked-list li {
    color: var(--text-secondary);
    font-size: 0.9rem;
    padding-left: 0.95rem;
    position: relative;
}

.stacked-list li::before {
    color: var(--brand-cyan);
    content: "-";
    left: 0;
    position: absolute;
}

.table-note {
    color: var(--text-secondary);
    margin-top: 0.95rem;
}

.policy-grid-2 {
    display: grid;
    gap: var(--space-3);
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.faq-grid {
    display: grid;
    gap: 0.95rem;
}

.service-cards,
.pricing-grid,
.trust-grid,
.profile-grid {
    display: grid;
    gap: var(--space-3);
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.trust-meta {
    color: #d5e3ff;
    font-size: 0.88rem;
    font-weight: 700;
    margin-top: 0.9rem;
}

.trust-table-shell {
    overflow-x: auto;
}

.trust-table-shell:focus-visible {
    border-radius: 12px;
    outline: 2px solid rgba(130, 195, 255, 0.95);
    outline-offset: 2px;
}

.trust-table {
    border-collapse: collapse;
    margin-top: 0.95rem;
    min-width: 720px;
    width: 100%;
}

.trust-table caption {
    color: #c4d7ff;
    font-size: 0.82rem;
    margin-bottom: 0.65rem;
    text-align: left;
}

.trust-table th,
.trust-table td {
    border: 1px solid rgba(126, 163, 245, 0.36);
    padding: 0.72rem 0.74rem;
    text-align: left;
    vertical-align: top;
}

.trust-table th {
    background: rgba(32, 64, 132, 0.52);
    color: #edf3ff;
    font-size: 0.8rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.trust-table td {
    background: rgba(13, 26, 56, 0.74);
    color: var(--text-secondary);
    font-size: 0.9rem;
}

.trust-table tbody th {
    background: rgba(13, 26, 56, 0.82);
    color: #e6efff;
    font-size: 0.9rem;
    letter-spacing: normal;
    text-transform: none;
}

.claim-table td code {
    color: #d8e5ff;
    font-size: 0.79rem;
}

.trust-limits ul {
    display: grid;
    gap: 0.58rem;
    list-style: none;
    margin-top: 0.7rem;
}

.trust-limits li {
    color: var(--text-secondary);
    padding-left: 1rem;
    position: relative;
}

.trust-limits li::before {
    color: var(--brand-cyan);
    content: "-";
    left: 0;
    position: absolute;
}

.service-card ul,
.pricing-card ul,
.trust-card ul,
.contact-card ul {
    display: grid;
    gap: 0.5rem;
    list-style: none;
    margin-top: 0.8rem;
}

.service-card li,
.pricing-card li,
.trust-card li,
.contact-card li {
    color: var(--text-secondary);
    font-size: 0.9rem;
    padding-left: 1.05rem;
    position: relative;
}

.service-card li::before,
.pricing-card li::before,
.trust-card li::before,
.contact-card li::before {
    color: var(--brand-cyan);
    content: "-";
    left: 0;
    position: absolute;
}

.card-highlight {
    border-color: rgba(157, 179, 255, 0.64);
    box-shadow: 0 26px 46px rgba(31, 56, 122, 0.33);
}

.service-tier {
    color: var(--brand-cyan);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.contact-layout {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.contact-form,
.form-group {
    display: grid;
}

.contact-form {
    gap: 0.9rem;
}

.form-group {
    gap: 0.4rem;
}

.form-group label {
    color: #e5eeff;
    font-size: 0.88rem;
    font-weight: 600;
}

.form-group input,
.form-group select,
.form-group textarea {
    background: var(--surface-input);
    border: 1px solid var(--line-card-hover);
    border-radius: 10px;
    color: #ecf4ff;
    font: inherit;
    padding: 0.72rem 0.82rem;
}

.form-group textarea {
    min-height: 128px;
    resize: vertical;
}

.form-group input::placeholder,
.form-group textarea::placeholder {
    color: rgba(199, 214, 250, 0.65);
}

.hidden {
    display: none;
}

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

.footer {
    border-top: 1px solid rgba(124, 161, 246, 0.22);
    color: #a8bbeb;
    margin-top: var(--space-6);
    padding: 1.65rem 0;
}

.footer p {
    font-size: 0.88rem;
}

.reveal {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 550ms ease, transform 550ms ease;
}

.js-ready .reveal {
    opacity: 0;
    transform: translateY(18px);
}

.reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.terminal { background: var(--surface-2); border: 1px solid var(--line-strong); border-radius: var(--radius-md); box-shadow: var(--shadow-soft); color: var(--text-primary); font: .95rem/1.8 ui-monospace, SFMono-Regular, Menlo, monospace; margin-top: var(--space-4); padding: var(--space-4); }
.terminal header, .terminal-controls { align-items: center; display: flex; gap: 1rem; justify-content: space-between; }
.terminal-lines { list-style: decimal; margin: 1rem 0 1rem 1.5rem; }
.terminal-lines li { color: var(--text-secondary); opacity: .3; }
.terminal-lines li.is-done, .terminal-lines li.is-typing { color: var(--text-primary); opacity: 1; }
.terminal-lines li.is-typing { color: var(--brand-cyan); }
.terminal-controls button { background: transparent; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); color: inherit; cursor: pointer; font: inherit; padding: .35rem .7rem; }
.terminal-controls span { color: var(--text-secondary); margin-left: auto; }

/* CAS-1660 Path B components */
.persona-row, .logo-strip, .badge-row { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.persona-row span, .logo-strip span, .badge-row span { border: 1px solid var(--line-card); border-radius: var(--radius-pill); padding: var(--space-2) var(--space-4); }
.logo-strip { justify-content: space-between; margin: var(--space-5) 0; }
.logo-strip span { color: var(--text-secondary); font-family: "Space Grotesk", sans-serif; letter-spacing: .04em; }
.badge-row span { background: var(--surface-overlay); color: var(--text-primary); }
.testimonial-grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(3, 1fr); margin-top: var(--space-6); }
.testimonial-grid blockquote { border-left: 3px solid var(--brand-accent); color: var(--text-primary); padding: var(--space-4); }
.testimonial-grid cite { color: var(--text-secondary); display: block; font-size: var(--text-body-sm); margin-top: var(--space-3); }
.formula-card { background: linear-gradient(135deg, var(--surface-2), var(--surface-overlay)); border: 1px solid var(--line-card-hover); border-radius: var(--radius-md); margin: var(--space-5) 0; padding: var(--space-5); }
.plan-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.founder-grid { align-items: center; display: grid; gap: var(--space-6); grid-template-columns: minmax(180px, .45fr) 1fr; }
.founder-placeholder { align-items: center; aspect-ratio: 4/5; background: linear-gradient(145deg, var(--surface-overlay), var(--surface-2)); border: 1px dashed var(--line-card-hover); border-radius: var(--radius-lg); display: flex; flex-direction: column; justify-content: center; padding: var(--space-4); }
.founder-mark { color: var(--brand-cyan); height: 88px; width: 88px; }
.founder-name { color: var(--text-primary); font: 600 1.05rem/1.2 'Space Grotesk', system-ui, sans-serif; letter-spacing: 0.01em; margin-top: var(--space-3); }
.founder-role { color: var(--text-secondary); font: 500 0.85rem/1.3 'Manrope', system-ui, sans-serif; letter-spacing: 0.05em; text-transform: uppercase; margin-top: var(--space-1); }
.persona-cards { grid-template-columns: repeat(5, 1fr); }
.footer-grid { display: grid; gap: var(--space-5); grid-template-columns: 1.1fr 1.4fr 1fr; }
.footer-grid strong { color: var(--text-primary); }
.footer-grid code { color: var(--brand-cyan); }
.org-tree, .org-branch { display: grid; gap: var(--space-4); list-style: none; }
.org-branch { border-left: 1px solid var(--line-card); margin: var(--space-3) 0 0 var(--space-5); padding-left: var(--space-5); }
.org-node { background: var(--surface-1); border: 1px solid var(--line-card); border-radius: var(--radius-md); cursor: pointer; padding: var(--space-4); transition: border-color var(--transition-fast), transform var(--transition-fast); }
.org-node:hover, .org-node:focus-within, .org-node.is-expanded { border-color: var(--brand-accent); transform: translateY(-2px); }
.org-node-tag { color: var(--brand-cyan); font-size: var(--text-caption); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.org-status-list { display: flex; flex-wrap: wrap; gap: var(--space-2); list-style: none; margin-top: var(--space-3); }
.org-status { border-radius: var(--radius-pill); font-size: var(--text-caption); padding: var(--space-1) var(--space-3); }
.org-status--active { background: color-mix(in srgb, var(--status-success) 25%, transparent); }
.org-status--blocked { background: color-mix(in srgb, var(--status-warning) 25%, transparent); }
.org-status--ready { background: color-mix(in srgb, var(--brand-cyan) 25%, transparent); }
.org-tree .org-level { opacity: 1; transform: none; }
.js-ready .org-tree .org-level { opacity: .2; transform: translateY(12px); transition: opacity .35s ease, transform .35s ease; }
.js-ready .org-tree.is-active .org-level { opacity: 1; transform: none; }
.js-ready .org-tree.is-active .org-level:nth-child(2) { transition-delay: .1s; }

@media (min-width: 761px) { .hero-copy { max-width: 760px; } }
@media (max-width: 760px) { .testimonial-grid, .plan-grid-3, .founder-grid, .persona-cards, .footer-grid { grid-template-columns: 1fr; } }

@keyframes pulse {
    0%,
    100% {
        box-shadow: 0 0 0 0 rgba(88, 165, 255, 0.4);
        transform: scale(0.95);
    }

    50% {
        box-shadow: 0 0 0 8px rgba(88, 165, 255, 0);
        transform: scale(1.05);
    }
}

@media (max-width: 1080px) {
    .container {
        padding: 0 1.4rem;
    }

    .hero-grid,
    .page-hero .surface,
    .pricing-hero .surface,
    .early-access-wrap,
    .grid-2,
    .contact-layout {
        grid-template-columns: 1fr;
    }

    .service-cards,
    .pricing-grid,
    .bill-anatomy-grid,
    .plan-grid,
    .policy-grid-2,
    .trust-grid,
    .profile-grid,
    .workflow-grid,
    .grid-3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .section-head {
        align-items: start;
        flex-direction: column;
    }

    .split-note {
        max-width: 70ch;
    }

    .callout-bar {
        grid-template-columns: 1fr;
        justify-items: start;
    }
}

@media (max-width: 980px) {
    .nav-shell {
        align-items: center;
        flex-wrap: wrap;
        gap: 0.75rem;
        justify-content: space-between;
        padding: 0.85rem 0;
    }

    .nav-toggle {
        display: inline-flex;
    }

    .nav-panel {
        display: none;
        width: 100%;
    }

    .navbar.nav-open .nav-panel {
        display: block;
    }

    .nav-list {
        display: grid;
        gap: 0.45rem;
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
    }

    .nav-list a,
    .nav-list .btn-primary {
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 760px) {
    .nav-shell {
        align-items: center;
        flex-wrap: wrap;
        gap: 0.75rem;
        justify-content: space-between;
        padding: 0.85rem 0;
    }

    .nav-toggle {
        display: inline-flex;
    }

    .nav-panel {
        display: none;
        width: 100%;
    }

    .navbar.nav-open .nav-panel {
        display: block;
    }

    .nav-list {
        display: grid;
        gap: 0.45rem;
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
    }

    .nav-list a,
    .nav-list .btn-primary {
        justify-content: center;
        width: 100%;
    }

    .cta-row {
        align-items: stretch;
        flex-direction: column;
    }

    .cta-row .btn-primary,
    .cta-row .btn-secondary,
    .cta-row .btn-ghost {
        width: 100%;
    }

    .hero-interaction-head {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-sandbox-row {
        flex-direction: column;
    }

    .hero-sandbox-row .btn-secondary,
    .hero-sandbox-row input {
        width: 100%;
    }

    .hero,
    .scene,
    .page-shell {
        padding-top: var(--space-5);
    }

    .surface,
    .early-access-card,
    .try-card {
        padding: 1.05rem;
    }

    .service-cards,
    .pricing-grid,
    .bill-anatomy-grid,
    .plan-grid,
    .policy-grid-2,
    .trust-grid,
    .profile-grid,
    .workflow-grid,
    .grid-3 {
        grid-template-columns: 1fr;
    }

    .metric-value {
        font-size: 1.75rem;
    }

    .proof-row {
        gap: 0.45rem;
    }

    .btn-primary,
    .btn-secondary,
    .btn-ghost {
        white-space: normal;
    }
}



@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation: none !important;
        scroll-behavior: auto !important;
        transition: none !important;
    }

    .reveal {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* =========================================================================
   Virtual Agent Org Chart (CAS-1650)
   - Semantic nested-list baseline (no JS required)
   - CSS-only staged fade/translate activation via .org-chart.is-active
   - prefers-reduced-motion keeps everything fully visible & static
   ========================================================================= */

.org-chart-section {
    --org-rail: rgba(125, 154, 224, 0.28);
    --org-rail-active: rgba(47, 196, 255, 0.65);
    --org-pad: var(--space-4);
    --org-node-bg: rgba(16, 34, 71, 0.9);
    --org-node-line: rgba(120, 157, 255, 0.45);
}

.org-chart-section .surface {
    padding: clamp(1.25rem, 2.4vw, 2rem);
}

.org-tree {
    list-style: none;
    margin: var(--space-4) 0 0;
    padding: 0;
    display: grid;
    gap: var(--space-5);
    position: relative;
}

.org-branch {
    list-style: none;
    margin: var(--space-4) 0 0;
    padding: 0;
    display: grid;
    gap: var(--space-4);
    position: relative;
}

.org-level {
    position: relative;
}

/* Hairline connector stroke between a level and its children.
   Pure CSS: padding-top creates space, then a vertical line drawn via
   inset shadow that visibly connects each parent branch to its children. */
.org-level > .org-branch {
    padding-left: var(--space-3);
    border-left: 2px solid var(--org-rail);
    margin-left: var(--space-3);
    transition: border-color var(--transition-med);
}

.org-chart.is-active .org-level > .org-branch {
    border-color: var(--org-rail-active);
}

.org-node {
    background: var(--org-node-bg);
    border: 1px solid var(--org-node-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-soft);
    padding: 1rem 1.1rem;
    position: relative;
    transition: transform var(--transition-med), border-color var(--transition-med), box-shadow var(--transition-med);
}

.org-node h3 {
    font-size: 1.05rem;
    margin-bottom: 0.4rem;
}

.org-node p {
    color: var(--text-secondary);
    font-size: 0.93rem;
}

.org-node-tag {
    color: var(--brand-cyan);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    margin-bottom: 0.55rem;
    text-transform: uppercase;
}

.org-node--root {
    border-color: rgba(125, 99, 255, 0.55);
    box-shadow: 0 0 0 1px rgba(125, 99, 255, 0.12), var(--shadow-soft);
}

.org-node--lead {
    border-color: rgba(79, 124, 255, 0.55);
}

.org-node--review {
    border-color: rgba(31, 163, 107, 0.55);
}

.org-node--approval {
    border-color: rgba(213, 134, 26, 0.55);
    box-shadow: 0 0 0 1px rgba(213, 134, 26, 0.12), var(--shadow-soft);
}

/* Connector bullet: a small circle that visually links a node to its branch */
.org-level > .org-node::after,
.org-level > .org-branch::before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    left: calc(-1 * var(--space-3) - 5px);
    background: var(--brand-primary);
    border: 2px solid var(--bg-base);
    border-radius: 50%;
    top: 1.2rem;
    box-shadow: 0 0 0 0 rgba(79, 124, 255, 0);
    transition: background var(--transition-med), box-shadow var(--transition-med);
}

.org-level > .org-branch::before {
    display: none;
}

.org-status-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    list-style: none;
    margin: 0.75rem 0 0;
    padding: 0;
}

.org-status {
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-pill);
    color: var(--text-secondary);
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.25rem 0.65rem;
    transition: background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
}

.org-status--active {
    border-color: rgba(47, 196, 255, 0.7);
    color: var(--brand-cyan);
}

.org-status--blocked {
    border-color: rgba(213, 134, 26, 0.7);
    color: var(--status-warning);
}

.org-status--ready {
    border-color: rgba(31, 163, 107, 0.7);
    color: var(--status-success);
}

/* Staged activation: before .is-active, nodes are present but muted; after,
   each level fades in on a staggered delay anchored in CSS. The structure
   is fully visible without JS — JS only adds the .is-active class. */
.org-chart .org-level {
    opacity: 0.35;
    transform: translateY(8px);
    transition: opacity 480ms ease, transform 480ms ease;
}

.org-chart.is-active .org-level {
    opacity: 1;
    transform: translateY(0);
}

.org-chart.is-active .org-level-0 { transition-delay: 0ms; }
.org-chart.is-active .org-level-1 { transition-delay: 120ms; }
.org-chart.is-active .org-level-2 { transition-delay: 240ms; }
.org-chart.is-active .org-level-final { transition-delay: 360ms; }

.org-chart.is-active .org-node:hover {
    border-color: var(--brand-cyan);
    transform: translateY(-2px);
}

.org-chart.is-active .org-status--active {
    background: rgba(47, 196, 255, 0.15);
}

/* Mobile: drop horizontal connector strokes, stack vertically. */
@media (max-width: 720px) {
    .org-level > .org-branch {
        border-left: none;
        border-top: 2px solid var(--org-rail);
        margin-left: 0;
        padding-left: 0;
        padding-top: var(--space-3);
    }

    .org-chart.is-active .org-level > .org-branch {
        border-color: var(--org-rail-active);
    }

    .org-level > .org-node::after {
        display: none;
    }

    .org-status-list {
        gap: 0.3rem;
    }
}

/* Reduced motion: skip staged fade/translate entirely; show full static chart. */
@media (prefers-reduced-motion: reduce) {
    .org-chart .org-level,
    .org-chart.is-active .org-level {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }

    .org-level > .org-branch,
    .org-chart.is-active .org-level > .org-branch {
        border-color: var(--org-rail) !important;
        transition: none !important;
    }

    .org-node {
        transition: none !important;
    }

}

/* =====================================================================
   CAS-1660 Pass 2 — Rev 2 amendments
   --------------------------------------------------------------------
   - Book Intro Call modal (a11y, focus trap, ESC, return focus)
   - Social footer (X + LinkedIn)
   - Hero subhead + promoted terminal CLI
   - Our Story section (Kirkland, SRE/TPM, founder bio)
   - Packages table (3-tier DIY hosting)
   - /industries hub + 18 per-industry tiles
   - /concepts hub + 7 concept cards
   - Virtual agentic org chart promoted to home
   - Per-agent budget + model-tier routing animation
   - Bespoke custom platforms section
   - MCP Integrations strip + /integrations.html hub
   - Communications Integrations strip + /channels.html hub
   - Governance stub + /governance.html
   - Maturity Model stub + /maturity.html
   - Industry animation stub + Solutions 18 case-study tiles
   ===================================================================== */

/* ---------- Social footer additions ---------- */
.footer-socials {
    display: flex;
    gap: 0.9rem;
    margin-top: 0.4rem;
}

.footer-socials a {
    color: var(--text-muted);
    text-decoration: none;
    font-size: 0.9rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.2rem 0.1rem;
    border-bottom: 1px solid transparent;
}

.footer-socials a:hover,
.footer-socials a:focus {
    color: var(--text-primary);
    border-bottom-color: var(--brand-accent);
}

.footer-socials a:focus {
    outline: 2px solid var(--brand-accent);
    outline-offset: 2px;
    border-radius: 2px;
}

.footer-socials__icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 3px;
    background: rgba(124, 145, 255, 0.18);
    color: var(--brand-accent);
    font-size: 0.7rem;
    line-height: 16px;
    text-align: center;
    font-weight: 700;
}

/* ---------- Hero subhead + promoted terminal ---------- */
.hero-subhead {
    font-size: 1.18rem;
    line-height: 1.4;
    color: var(--text-muted);
    margin: 0.4rem 0 0;
    max-width: 30ch;
}

.hero-terminal {
    margin-top: 1.6rem;
    max-width: 100%;
}

/* ---------- Our Story section ---------- */
.story-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: var(--space-5);
    align-items: start;
}

.story-copy p {
    color: var(--text-muted);
    line-height: 1.6;
    margin: 0 0 1rem;
}

.story-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: var(--space-3);
    margin-top: var(--space-4);
}

.story-metric {
    background: linear-gradient(180deg, rgba(20, 32, 70, 0.55), rgba(10, 18, 42, 0.55));
    border: 1px solid rgba(124, 145, 255, 0.2);
    border-radius: 12px;
    padding: 1.2rem 1rem;
}

.story-metric__value {
    font-family: var(--font-display);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
    line-height: 1.1;
}

.story-metric__label {
    color: var(--text-muted);
    font-size: 0.85rem;
    margin: 0.45rem 0 0;
    line-height: 1.4;
}

/* ---------- Pricing packages table ---------- */
.packages-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: rgba(8, 14, 32, 0.5);
    border: 1px solid rgba(124, 145, 255, 0.2);
    border-radius: 12px;
    overflow: hidden;
    margin-top: var(--space-3);
    font-size: 0.95rem;
}

.packages-table caption {
    caption-side: top;
    text-align: left;
    padding: 0 0 0.6rem;
    color: var(--text-muted);
    font-size: 0.9rem;
}

.packages-table thead th {
    text-align: left;
    background: rgba(124, 145, 255, 0.12);
    color: var(--text-primary);
    font-family: var(--font-display);
    font-weight: 600;
    padding: 0.9rem 1rem;
    font-size: 0.9rem;
    letter-spacing: 0.02em;
}

.packages-table tbody td {
    padding: 0.85rem 1rem;
    border-top: 1px solid rgba(124, 145, 255, 0.12);
    color: var(--text-muted);
    vertical-align: top;
}

.packages-table tbody th {
    text-align: left;
    padding: 0.85rem 1rem;
    border-top: 1px solid rgba(124, 145, 255, 0.12);
    color: var(--text-primary);
    font-weight: 600;
    background: rgba(124, 145, 255, 0.06);
}

.packages-table tbody tr.is-highlight th,
.packages-table tbody tr.is-highlight td {
    background: rgba(124, 145, 255, 0.08);
}

.packages-note,
.pricing-table-note {
    color: var(--text-muted);
    font-size: 0.85rem;
    margin: 0.8rem 0 0;
    padding-left: 0.2rem;
}

.packages-table-shell {
    margin-top: var(--space-3);
    border-radius: 12px;
}

/* ---------- Industries hub grid + per-industry cards ---------- */
.industries-hub-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--space-3);
    margin-top: var(--space-4);
}

.industry-tile {
    display: block;
    padding: 1.3rem 1.2rem;
    background:
        linear-gradient(180deg, rgba(20, 32, 70, 0.55), rgba(8, 14, 32, 0.55));
    border: 1px solid rgba(124, 145, 255, 0.18);
    border-radius: 14px;
    color: var(--text-primary);
    text-decoration: none;
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
}

.industry-tile:hover,
.industry-tile:focus {
    transform: translateY(-2px);
    border-color: var(--brand-accent);
    outline: none;
}

.industry-tile:focus {
    outline: 2px solid var(--brand-accent);
    outline-offset: 2px;
}

.industry-tile__name {
    font-family: var(--font-display);
    font-size: 1.05rem;
    font-weight: 600;
    margin: 0;
    color: var(--text-primary);
}

.industry-tile__problem {
    color: var(--text-muted);
    font-size: 0.88rem;
    line-height: 1.45;
    margin: 0.5rem 0 0.7rem;
}

.industry-tile__outcomes {
    list-style: none;
    margin: 0;
    padding: 0;
    color: var(--text-primary);
    font-size: 0.84rem;
    line-height: 1.45;
}

.industry-tile__outcomes li {
    padding-left: 0.85rem;
    position: relative;
    margin-bottom: 0.25rem;
}

.industry-tile__outcomes li::before {
    content: "→";
    color: var(--brand-accent);
    position: absolute;
    left: 0;
}

.industry-page-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
    gap: var(--space-5);
    align-items: start;
    margin-top: var(--space-4);
}

.industry-page-tiers {
    background: rgba(124, 145, 255, 0.06);
    border: 1px solid rgba(124, 145, 255, 0.18);
    border-radius: 12px;
    padding: 1.2rem 1.2rem 1rem;
}

.industry-page-tiers h3 {
    margin-top: 0;
    font-size: 1rem;
    color: var(--text-primary);
}

.industry-page-tiers ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.industry-page-tiers li {
    padding: 0.4rem 0;
    border-top: 1px solid rgba(124, 145, 255, 0.12);
    color: var(--text-muted);
    font-size: 0.9rem;
}

.industry-page-tiers li:first-child {
    border-top: 0;
}

.industry-page-tiers li strong {
    color: var(--text-primary);
    font-weight: 600;
}

.industry-cta-row {
    display: flex;
    gap: 0.8rem;
    flex-wrap: wrap;
    margin-top: var(--space-4);
}

/* ---------- Concepts hub + concept cards ---------- */
.concepts-strip {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--space-2);
    margin-top: var(--space-3);
}

.concept-card {
    display: block;
    padding: 1rem 1rem 0.9rem;
    background: rgba(20, 32, 70, 0.45);
    border: 1px solid rgba(124, 145, 255, 0.18);
    border-radius: 10px;
    color: var(--text-primary);
    text-decoration: none;
    transition: transform 160ms ease, border-color 160ms ease;
}

.concept-card:hover,
.concept-card:focus {
    transform: translateY(-1px);
    border-color: var(--brand-accent);
    outline: none;
}

.concept-card:focus {
    outline: 2px solid var(--brand-accent);
    outline-offset: 2px;
}

.concept-card__title {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
}

.concept-card__hint {
    color: var(--text-muted);
    font-size: 0.84rem;
    line-height: 1.4;
    margin: 0.4rem 0 0;
}

/* ---------- Solutions 18 case-study grid ---------- */
.solutions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: var(--space-3);
    margin-top: var(--space-4);
}

.solution-tile {
    display: flex;
    flex-direction: column;
    padding: 1.2rem 1.1rem;
    background:
        linear-gradient(180deg, rgba(20, 32, 70, 0.6), rgba(8, 14, 32, 0.55));
    border: 1px solid rgba(124, 145, 255, 0.18);
    border-radius: 12px;
    color: var(--text-primary);
    text-decoration: none;
    min-height: 170px;
}

.solution-tile:hover,
.solution-tile:focus {
    border-color: var(--brand-accent);
    outline: none;
}

.solution-tile:focus {
    outline: 2px solid var(--brand-accent);
    outline-offset: 2px;
}

.solution-tile__name {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
}

.solution-tile__problem {
    color: var(--text-muted);
    font-size: 0.88rem;
    line-height: 1.45;
    margin: 0.5rem 0 0.7rem;
}

.solution-tile__metrics {
    list-style: none;
    margin: auto 0 0;
    padding: 0;
    font-size: 0.84rem;
    color: var(--text-primary);
}

.solution-tile__metrics li {
    padding: 0.18rem 0;
}

/* ---------- Bespoke platforms animated industry tile table ---------- */
.bespoke-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: var(--space-2);
    margin-top: var(--space-3);
}

.bespoke-tile {
    display: block;
    padding: 0.9rem 0.95rem;
    background: linear-gradient(180deg, rgba(20, 32, 70, 0.6), rgba(8, 14, 32, 0.6));
    border: 1px solid rgba(124, 145, 255, 0.22);
    border-radius: 10px;
    color: var(--text-primary);
    text-decoration: none;
    font-size: 0.9rem;
    transition: transform 160ms ease, border-color 160ms ease;
}

.bespoke-tile:hover,
.bespoke-tile:focus {
    transform: translateY(-1px);
    border-color: var(--brand-accent);
    outline: none;
}

.bespoke-tile:focus {
    outline: 2px solid var(--brand-accent);
    outline-offset: 2px;
}

/* ---------- Virtual agent org chart (home) ---------- */
.virtual-org {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-3);
    margin-top: var(--space-4);
}

.virtual-org__row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--space-2);
}

.virtual-org__node {
    padding: 1rem 1rem 0.9rem;
    background: rgba(20, 32, 70, 0.5);
    border: 1px solid rgba(124, 145, 255, 0.2);
    border-radius: 12px;
    cursor: pointer;
    transition: border-color 180ms ease, transform 180ms ease;
}

.virtual-org__node:hover,
.virtual-org__node:focus {
    border-color: var(--brand-accent);
    outline: none;
}

.virtual-org__node:focus {
    outline: 2px solid var(--brand-accent);
    outline-offset: 2px;
}

.virtual-org__tag {
    font-family: var(--font-display);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--brand-accent);
    margin: 0;
}

.virtual-org__title {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0.3rem 0;
}

.virtual-org__detail {
    color: var(--text-muted);
    font-size: 0.86rem;
    line-height: 1.45;
    margin: 0;
}

.virtual-org__node.is-expanded .virtual-org__detail {
    color: var(--text-primary);
}

.virtual-org__node.is-root {
    background: linear-gradient(180deg, rgba(124, 145, 255, 0.18), rgba(20, 32, 70, 0.45));
    border-color: rgba(124, 145, 255, 0.55);
}

.virtual-org.is-active .virtual-org__node {
    opacity: 0.45;
    transform: translateY(8px);
    transition: opacity 380ms ease, transform 380ms ease;
}

.virtual-org.is-active .virtual-org__node.is-revealed {
    opacity: 1;
    transform: translateY(0);
}

/* ---------- Per-agent budget animation ---------- */
.budget-anim {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--space-3);
    margin-top: var(--space-4);
}

.budget-anim__column {
    background: rgba(8, 14, 32, 0.5);
    border: 1px solid rgba(124, 145, 255, 0.2);
    border-radius: 12px;
    padding: 1rem 1.1rem 1.1rem;
}

.budget-anim__title {
    font-family: var(--font-display);
    font-size: 0.95rem;
    color: var(--text-primary);
    margin: 0;
}

.budget-anim__hint {
    color: var(--text-muted);
    font-size: 0.84rem;
    margin: 0.4rem 0 0.8rem;
}

.budget-rail {
    list-style: none;
    margin: 0;
    padding: 0;
}

.budget-rail li {
    padding: 0.45rem 0;
    border-top: 1px solid rgba(124, 145, 255, 0.12);
    color: var(--text-muted);
    font-size: 0.86rem;
    display: flex;
    justify-content: space-between;
    gap: 0.4rem;
}

.budget-rail li:first-child {
    border-top: 0;
}

.budget-rail li strong {
    color: var(--text-primary);
    font-weight: 600;
}

.budget-callout {
    margin-top: var(--space-3);
    padding: 1rem 1.1rem;
    background: rgba(124, 145, 255, 0.08);
    border: 1px dashed rgba(124, 145, 255, 0.4);
    border-radius: 10px;
    color: var(--text-primary);
    font-size: 0.92rem;
    line-height: 1.5;
}

.budget-callout strong {
    color: var(--brand-accent);
}

/* ---------- MCP + Communications strips ---------- */
.logo-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin-top: var(--space-3);
}

.logo-strip span {
    padding: 0.45rem 0.9rem;
    background: rgba(20, 32, 70, 0.45);
    border: 1px solid rgba(124, 145, 255, 0.18);
    border-radius: 8px;
    color: var(--text-muted);
    font-size: 0.85rem;
    font-family: var(--font-display);
    letter-spacing: 0.02em;
}

/* ---------- Governance stub + Maturity stub ---------- */
.governance-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--space-3);
    margin-top: var(--space-3);
}

.governance-card {
    padding: 1rem 1.1rem;
    background: rgba(20, 32, 70, 0.45);
    border: 1px solid rgba(124, 145, 255, 0.18);
    border-radius: 10px;
}

.governance-card h3 {
    font-size: 0.95rem;
    margin: 0;
    color: var(--text-primary);
}

.governance-card p {
    color: var(--text-muted);
    font-size: 0.86rem;
    line-height: 1.45;
    margin: 0.5rem 0 0;
}

.stub-callout {
    margin-top: var(--space-3);
    padding: 1rem 1.1rem;
    border-left: 3px solid var(--brand-accent);
    background: rgba(124, 145, 255, 0.06);
    border-radius: 6px;
    color: var(--text-muted);
    font-size: 0.9rem;
}

.stub-callout strong {
    color: var(--text-primary);
}

.maturity-stages {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--space-2);
    margin-top: var(--space-3);
}

.maturity-stage {
    padding: 1rem;
    background: linear-gradient(180deg, rgba(20, 32, 70, 0.55), rgba(8, 14, 32, 0.5));
    border: 1px solid rgba(124, 145, 255, 0.2);
    border-radius: 10px;
}

.maturity-stage h3 {
    font-size: 0.95rem;
    margin: 0;
    color: var(--text-primary);
}

.maturity-stage__num {
    font-family: var(--font-display);
    font-size: 0.7rem;
    color: var(--brand-accent);
    margin: 0 0 0.3rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.maturity-stage__desc {
    color: var(--text-muted);
    font-size: 0.85rem;
    line-height: 1.45;
    margin: 0.4rem 0 0;
}

.maturity-stage__prereq {
    margin-top: 0.5rem;
    color: var(--text-muted);
    font-size: 0.78rem;
    font-style: italic;
}

/* ---------- Industry animation stub grid (home section 1) ---------- */
.industries-anim {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 0.8rem;
    margin-top: var(--space-3);
}

.industry-anim-tile {
    display: block;
    padding: 0.8rem 0.85rem;
    background: rgba(20, 32, 70, 0.5);
    border: 1px solid rgba(124, 145, 255, 0.2);
    border-radius: 8px;
    color: var(--text-primary);
    text-decoration: none;
    font-size: 0.85rem;
    text-align: center;
    transition: border-color 160ms ease, transform 160ms ease;
}

.industry-anim-tile:hover,
.industry-anim-tile:focus {
    border-color: var(--brand-accent);
    transform: translateY(-1px);
    outline: none;
}

.industry-anim-tile:focus {
    outline: 2px solid var(--brand-accent);
    outline-offset: 2px;
}

/* ---------- Stub-page content callouts (sub-pages) ---------- */
.stub-page {
    max-width: 760px;
    margin: 0 auto;
}

.stub-page__meta {
    color: var(--text-muted);
    font-size: 0.92rem;
    line-height: 1.6;
    margin: 0 0 1.2rem;
}

.stub-page__section {
    margin-top: var(--space-4);
}

.stub-page__section h2 {
    font-size: 1.15rem;
    margin: 0 0 0.6rem;
}

.stub-page__section p {
    color: var(--text-muted);
    line-height: 1.6;
    margin: 0 0 1rem;
}

.stub-page__back {
    margin-top: var(--space-4);
    color: var(--text-muted);
    font-size: 0.9rem;
}

/* ---------- Mobile stacking ---------- */
@media (max-width: 760px) {
    .story-grid,
    .industry-page-grid {
        grid-template-columns: 1fr;
    }

    .hero-subhead {
        font-size: 1rem;
        max-width: 100%;
    }

    .packages-table {
        font-size: 0.85rem;
    }

    .packages-table thead th,
    .packages-table tbody td,
    .packages-table tbody th {
        padding: 0.6rem 0.7rem;
    }

    .footer-socials {
        flex-wrap: wrap;
    }
}

@media (prefers-reduced-motion: reduce) {
    .virtual-org.is-active .virtual-org__node,
    .virtual-org.is-active .virtual-org__node.is-revealed,
    .industry-tile,
    .concept-card,
    .solution-tile,
    .bespoke-tile,
    .industry-anim-tile {
        transition: none !important;
        transform: none !important;
    }
}

/* ---------- CAS-1660 Pass 2 home additions ---------- */
.our-story .metric-grid {
    margin-top: var(--space-4);
}

.industries-strip .industry-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--space-3);
    margin: var(--space-4) 0;
}

.solutions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--space-4);
    margin-top: var(--space-4);
}

.solution-card {
    background: linear-gradient(180deg, rgba(20, 32, 70, 0.55), rgba(8, 14, 32, 0.55));
    border: 1px solid rgba(124, 145, 255, 0.18);
    border-radius: 14px;
    padding: 1.3rem 1.2rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.solution-card h3 {
    font-family: var(--font-display);
    font-size: 1.05rem;
    margin: 0;
    color: var(--text-primary);
}

.solution-card__problem {
    color: var(--text-muted);
    margin: 0;
    line-height: 1.45;
    font-size: 0.92rem;
}

.solution-card__outcomes {
    list-style: none;
    padding: 0;
    margin: 0;
    color: var(--text-muted);
    font-size: 0.88rem;
}

.solution-card__outcomes li {
    padding: 0.18rem 0;
    border-top: 1px solid rgba(124, 145, 255, 0.1);
}

.virtual-agentic-org .virtual-org-stages {
    list-style: decimal;
    padding-left: 1.4rem;
    margin: var(--space-4) 0;
    color: var(--text-muted);
    line-height: 1.6;
}

.virtual-agentic-org .virtual-org-stages li {
    margin-bottom: 0.55rem;
}

.virtual-agentic-org .virtual-org-stages strong {
    color: var(--text-primary);
    font-weight: 600;
}

.budget-routing .budget-routing-tiers {
    list-style: none;
    padding: 0;
    margin: var(--space-3) 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--space-3);
}

.budget-routing .budget-routing-tiers li {
    background: rgba(124, 145, 255, 0.08);
    border: 1px solid rgba(124, 145, 255, 0.16);
    border-radius: 10px;
    padding: 0.9rem 1rem;
    color: var(--text-muted);
    font-size: 0.92rem;
}

.budget-routing .budget-routing-tiers strong {
    color: var(--text-primary);
}

.budget-routing .callout,
.governance-summary .callout,
.bespoke .callout {
    background: rgba(124, 145, 255, 0.10);
    border-left: 3px solid var(--brand-accent);
    padding: 0.8rem 1rem;
    border-radius: 8px;
    margin: var(--space-3) 0;
}

.bespoke .bespoke-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--space-3);
    margin-top: var(--space-4);
}

.governance-summary ol {
    margin: var(--space-3) 0;
    padding-left: 1.4rem;
    color: var(--text-muted);
    line-height: 1.6;
}

.governance-summary ol li {
    margin-bottom: 0.45rem;
}

.maturity-stages .maturity-stages-list {
    list-style: decimal;
    padding-left: 1.4rem;
    margin: var(--space-4) 0;
    color: var(--text-muted);
    line-height: 1.6;
}

.maturity-stages .maturity-stages-list li {
    margin-bottom: 0.55rem;
}

.maturity-stages .maturity-stages-list strong {
    color: var(--text-primary);
    font-weight: 600;
}

/* ---------- CAS-1660 Rev 3 home restructure ---------- */
:root {
    --cascadia-purple: #7c91ff;
    --cascadia-navy: #060c1f;
    --cascadia-evergreen: #0c3b34;
}

.home-agent-operations {
    min-height: clamp(620px, 82vh, 800px);
    padding-bottom: clamp(3rem, 9vh, 6rem);
}

.home-agent-operations .hero-bg {
    opacity: 1;
    transform: scale(1.08);
    transform-origin: center bottom;
}

.home-agent-operations .hero-overlay {
    background:
        linear-gradient(90deg, rgba(4, 9, 22, 0.28) 0%, rgba(4, 9, 22, 0.18) 52%, rgba(4, 9, 22, 0.48) 100%),
        linear-gradient(180deg, rgba(4, 9, 22, 0.18) 0%, rgba(4, 9, 22, 0.22) 46%, rgba(4, 9, 22, 0.5) 100%);
}

.home-agent-operations .hero-grid {
    align-items: center;
    min-height: clamp(520px, 68vh, 660px);
}

.home-agent-operations h1 strong {
    color: var(--cascadia-purple);
    font-weight: 800;
    text-shadow: 0 0 26px rgba(124, 145, 255, 0.2);
}

.home-agent-operations .hero-terminal {
    background: rgba(6, 12, 31, 0.72);
    border-color: rgba(124, 145, 255, 0.34);
    backdrop-filter: blur(18px) saturate(145%);
    box-shadow: 0 32px 90px rgba(2, 8, 20, 0.48);
    min-height: 360px;
    overflow: hidden;
}

.home-agent-operations .hero-terminal .terminal-lines {
    display: block;
    min-height: 220px;
    overflow: hidden;
}

.home-agent-operations .hero-terminal .terminal-lines li {
    overflow: hidden;
    text-overflow: clip;
    white-space: nowrap;
}

.home-agent-operations + .who-we-are-section {
    padding-top: clamp(2.5rem, 6vw, 4.5rem);
}

.terminal-lines--typed li {
    min-height: 1.8em;
    opacity: 1;
}

.terminal-lines--typed .terminal-text::after {
    color: var(--brand-cyan);
    content: "";
}

.terminal-lines--typed li.is-typing .terminal-text::after {
    animation: terminalCaret 850ms steps(1) infinite;
    content: "▌";
}

@keyframes terminalCaret {
    50% { opacity: 0; }
}

.who-grid,
.org-budget-grid,
.governance-control-grid {
    align-items: start;
    display: grid;
    gap: clamp(2rem, 5vw, 4rem);
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
}

.who-grid {
    align-items: center;
    grid-template-columns: minmax(0, 1.25fr) minmax(240px, 0.55fr);
}

.who-copy > p,
.governance-control-section p,
.budget-copy-card p {
    color: var(--text-secondary);
    line-height: 1.75;
    margin-top: 1rem;
}

.who-metrics {
    display: grid;
    gap: var(--space-3);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: var(--space-5);
}

.founder-card {
    align-self: start;
    background:
        linear-gradient(145deg, rgba(124, 145, 255, 0.26), rgba(12, 59, 52, 0.22) 48%, rgba(5, 12, 28, 0.95)),
        radial-gradient(circle at 18% 12%, rgba(53, 213, 255, 0.24), transparent 34%);
    border: 1px solid rgba(176, 194, 255, 0.32);
    border-radius: 18px;
    box-shadow: 0 28px 60px rgba(2, 8, 20, 0.34);
    justify-self: end;
    max-width: 340px;
    overflow: hidden;
    padding: 0.7rem;
    position: relative;
    width: min(100%, 340px);
}

.founder-card__image-frame {
    border-radius: 13px;
    height: clamp(300px, 34vw, 380px);
    overflow: hidden;
}

.founder-card img {
    height: 132%;
    min-height: 0;
    object-fit: cover;
    object-position: 50% 38%;
    transform: translateY(-17%);
    width: 100%;
}

.founder-card figcaption {
    background: linear-gradient(180deg, rgba(3, 8, 22, 0.08), rgba(3, 8, 22, 0.88));
    border-radius: 0 0 13px 13px;
    bottom: 0.7rem;
    left: 0.7rem;
    padding: 3.4rem 0.95rem 0.95rem;
    position: absolute;
    right: 0.7rem;
}

.founder-card strong,
.founder-card span {
    display: block;
}

.founder-card span {
    color: var(--text-secondary);
    font-size: 0.9rem;
    margin-top: 0.25rem;
}

.founder-card .founder-signature {
    color: #f6fbff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.55rem;
    font-style: italic;
    line-height: 1;
    margin: 0 0 0.35rem;
}

.solution-industry-band {
    margin-top: var(--space-5);
    position: relative;
}

.solution-industry-viewport {
    border-radius: 16px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
}

.solution-industry-viewport::-webkit-scrollbar {
    display: none;
}

.solution-industry-track {
    display: flex;
    gap: var(--space-4);
    width: max-content;
    will-change: scroll-position;
}

.solution-industry-grid {
    display: grid;
    gap: var(--space-4);
    grid-auto-flow: column;
    grid-auto-columns: 240px;
    grid-template-rows: repeat(2, minmax(232px, auto));
    width: max-content;
}

.solution-industry-grid--duplicate {
    display: none;
}

.solution-industry-band__arrow {
    align-items: center;
    background: rgba(7, 15, 35, 0.78);
    border: 1px solid rgba(124, 145, 255, 0.3);
    border-radius: 999px;
    color: var(--text-primary);
    display: inline-flex;
    font-size: 1.6rem;
    font-weight: 700;
    height: 2.75rem;
    justify-content: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: background 180ms ease, border-color 180ms ease, transform 180ms ease;
    width: 2.75rem;
    z-index: 3;
}

.solution-industry-band__arrow:hover,
.solution-industry-band__arrow:focus-visible {
    background: rgba(124, 145, 255, 0.24);
    border-color: rgba(124, 145, 255, 0.58);
    transform: translateY(-50%) scale(1.04);
}

.solution-industry-band__arrow--prev {
    left: 0.5rem;
}

.solution-industry-band__arrow--next {
    right: 0.5rem;
}

.solution-industry-card {
    background:
        linear-gradient(180deg, rgba(13, 27, 58, 0.92), rgba(5, 12, 29, 0.94)),
        radial-gradient(circle at top right, rgba(124, 145, 255, 0.18), transparent 42%);
    border: 1px solid rgba(124, 145, 255, 0.2);
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 232px;
    padding: 1.18rem;
    position: relative;
    scroll-snap-align: start;
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.solution-industry-card:hover,
.solution-industry-card:focus-within {
    border-color: rgba(124, 145, 255, 0.58);
    box-shadow: 0 24px 60px rgba(2, 8, 20, 0.34);
    transform: translateY(-3px);
}

.solution-industry-card h3 {
    font-size: 1rem;
    margin: 0 2.5rem 0.55rem 0;
}

.solution-industry-card p {
    color: var(--text-secondary);
    display: -webkit-box;
    font-size: 0.86rem;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    line-height: 1.5;
    overflow: hidden;
}

.solution-industry-card__arrow {
    align-items: center;
    background: rgba(124, 145, 255, 0.12);
    border: 1px solid rgba(124, 145, 255, 0.3);
    border-radius: 999px;
    color: var(--text-primary);
    display: inline-flex;
    height: 2rem;
    justify-content: center;
    position: absolute;
    right: 0.85rem;
    text-decoration: none;
    top: 0.85rem;
    transition: transform 180ms ease, background 180ms ease;
    width: 2rem;
}

.solution-industry-card:hover .solution-industry-card__arrow,
.solution-industry-card__arrow:focus-visible {
    background: rgba(124, 145, 255, 0.24);
    transform: translate(3px, -3px);
}

.org-budget-layout,
.org-budget-row {
    display: grid;
    gap: var(--space-5);
}

.org-budget-row--chart {
    align-items: center;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
}

.org-budget-row--costs {
    clear: both;
    align-items: start;
    grid-template-columns: minmax(260px, 0.58fr) minmax(0, 1.42fr);
}

.cost-table-card,
.org-chart-panel,
.budget-copy-card,
.maturity-model-card {
    background: rgba(7, 15, 35, 0.68);
    border: 1px solid rgba(124, 145, 255, 0.22);
    border-radius: 16px;
    box-shadow: 0 24px 70px rgba(2, 8, 20, 0.28);
    padding: 1.15rem;
}

.cost-table-card h3,
.budget-copy-card h3,
.maturity-model-card h3 {
    margin: 0 0 1rem;
}

.cost-bar-table {
    display: grid;
    gap: 0.35rem;
}

.cost-bar-row {
    align-items: center;
    display: grid;
    gap: 0.85rem;
    grid-template-columns: minmax(140px, 1.2fr) minmax(120px, 1fr) minmax(90px, 0.7fr);
    min-height: 58px;
    padding: 0.45rem 0;
}

.cost-bar-row--head {
    color: var(--text-secondary);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    min-height: 28px;
    text-transform: uppercase;
}

.cost-agent {
    align-items: center;
    display: grid;
    gap: 0 0.62rem;
    grid-template-columns: 2rem minmax(0, 1fr);
}

.cost-agent i {
    align-items: center;
    background: linear-gradient(145deg, var(--cascadia-purple), var(--brand-cyan));
    border-radius: 50%;
    color: #041024;
    display: inline-flex;
    font-style: normal;
    font-weight: 900;
    grid-row: span 2;
    height: 2rem;
    justify-content: center;
    width: 2rem;
}

.cost-agent strong,
.cost-agent em {
    overflow-wrap: anywhere;
}

.cost-agent em {
    color: var(--text-secondary);
    font-size: 0.75rem;
    font-style: normal;
}

.cost-counter {
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    text-align: right;
}

.cost-bar-track {
    background: rgba(124, 145, 255, 0.1);
    border: 1px solid rgba(124, 145, 255, 0.18);
    border-radius: 999px;
    height: 0.72rem;
    overflow: hidden;
}

.cost-bar-fill {
    background: linear-gradient(90deg, var(--cascadia-evergreen), var(--cascadia-purple), var(--brand-cyan));
    border-radius: inherit;
    display: block;
    height: 100%;
    width: 0;
}

.budget-anim.is-active .cost-bar-fill,
.cost-table-card:not(.js-ready) .cost-bar-fill {
    transition: width 4s ease-out;
    width: var(--bar-width);
}

.js-ready .budget-anim.is-active .cost-bar-fill {
    animation: budgetBarLoop 7s ease-out infinite;
    animation-iteration-count: infinite;
}

@keyframes budgetBarLoop {
    0%,
    16% {
        width: 0;
    }

    73%,
    100% {
        width: var(--bar-width);
    }
}

.cost-bar-row--total {
    border-top: 1px solid rgba(124, 145, 255, 0.22);
    color: var(--text-primary);
    font-weight: 800;
    margin-top: 0.25rem;
    padding-top: 0.85rem;
}

.org-chart-panel {
    aspect-ratio: 960 / 430;
    display: grid;
    gap: 42px;
    grid-template-rows: 90px 90px 90px;
    margin-inline: auto;
    max-width: 960px;
    min-height: 430px;
    overflow: hidden;
    padding: 1rem 0 0;
    position: relative;
    width: 100%;
}

.org-connectors {
    inset: 0;
    height: 100%;
    pointer-events: none;
    position: absolute;
    width: 100%;
}

.org-connectors path {
    fill: none;
    stroke: rgba(124, 145, 255, 0.38);
    stroke-dasharray: 520;
    stroke-dashoffset: 520;
    stroke-linecap: round;
    stroke-width: 2;
}

.virtual-org.is-active .org-connectors path {
    animation: drawConnector 10s ease infinite;
    animation-iteration-count: infinite;
}

.virtual-org.is-active .org-line--stage-1 { animation-delay: 200ms; }
.virtual-org.is-active .org-line--stage-2 { animation-delay: 400ms; }
.virtual-org.is-active .org-line--stage-3 { animation-delay: 980ms; }

@keyframes drawConnector {
    to { stroke-dashoffset: 0; }
}

.org-chart-level {
    display: grid;
    gap: clamp(0.6rem, 2vw, 1.4rem);
    position: relative;
    z-index: 1;
}

.org-chart-level--ceo {
    justify-content: center;
}

.org-chart-level--chiefs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    justify-content: center;
    width: 100%;
}

.org-chart-level--domains {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    justify-content: center;
    width: 100%;
}

.org-chart-panel .virtual-org__node {
    align-self: center;
    background: linear-gradient(180deg, rgba(18, 34, 72, 0.96), rgba(6, 14, 33, 0.96));
    border-radius: 10px;
    justify-self: center;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-height: 90px;
    opacity: 1;
    padding: 0.68rem 0.56rem;
    position: relative;
    text-align: center;
    width: min(180px, 100%);
    z-index: 1;
}

.js-ready .org-chart-panel .virtual-org__node {
    opacity: 0;
    transform: translateY(10px) scale(0.98);
}

.js-ready .org-chart-panel.is-active .virtual-org__node,
.js-ready .virtual-org.is-active .virtual-org__node {
    animation: orgNodeRevealLoop 10s ease infinite;
    animation-delay: var(--node-delay, 0ms);
    animation-iteration-count: infinite;
}

.org-chart-panel .virtual-org__node p {
    color: var(--text-secondary);
    font-size: 0.7rem;
    line-height: 1.3;
    margin: 0;
}

.org-chart-panel .virtual-org__name {
    color: var(--text-primary);
    display: block;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.3;
}

.org-chart-panel .virtual-org__role {
    color: var(--cascadia-pink, #ec4899);
    display: block;
    font-size: 0.75rem;
    font-weight: 800;
    line-height: 1.3;
}

@keyframes orgNodeReveal {
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes orgNodeRevealLoop {
    0%,
    8%,
    100% {
        opacity: 0;
        transform: translateY(10px) scale(0.98);
    }

    16%,
    86% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.worker-dots {
    display: flex;
    gap: 0.25rem;
    justify-content: center;
    margin-top: 0.28rem;
}

.worker-dots i {
    background: rgba(53, 213, 255, 0.75);
    border-radius: 50%;
    display: block;
    height: 0.34rem;
    width: 0.34rem;
}

.js-ready .org-chart-panel .worker-dots i {
    opacity: 0;
    transform: scale(0.4);
}

.js-ready .virtual-org.is-active .worker-dots i {
    animation: orgWorkerDotLoop 10s ease infinite;
    animation-delay: calc(var(--node-delay, 0ms) + 220ms);
    animation-iteration-count: infinite;
}

.js-ready .virtual-org.is-active .worker-dots i:nth-child(2) {
    animation-delay: calc(var(--node-delay, 0ms) + 320ms);
}

.js-ready .virtual-org.is-active .worker-dots i:nth-child(3) {
    animation-delay: calc(var(--node-delay, 0ms) + 420ms);
}

@keyframes orgWorkerDot {
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes orgWorkerDotLoop {
    0%,
    12%,
    100% {
        opacity: 0;
        transform: scale(0.4);
    }

    18%,
    86% {
        opacity: 1;
        transform: scale(1);
    }
}

.pricing-cards {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: var(--space-5);
}

.packages-section__intro {
    max-width: 100%;
}

.packages-role-callout {
    background: linear-gradient(90deg, rgba(124, 145, 255, 0.18), rgba(53, 213, 255, 0.08));
    border: 1px solid rgba(124, 145, 255, 0.32);
    border-radius: 14px;
    color: var(--text-primary);
    font-size: 1.02rem;
    margin: 0 auto var(--space-5);
    max-width: 780px;
    padding: 0.95rem 1.15rem;
    text-align: center;
}

.packages-role-callout strong {
    font-weight: 900;
}

.pricing-card {
    background: linear-gradient(180deg, rgba(12, 25, 55, 0.88), rgba(5, 12, 29, 0.94));
    border: 1px solid rgba(124, 145, 255, 0.22);
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-height: 390px;
    opacity: 0;
    padding: 1.25rem;
    transform: translateY(16px);
    transition: opacity 520ms ease, transform 520ms ease, border-color 180ms ease;
}

.reveal.is-visible .pricing-card {
    opacity: 1;
    transform: translateY(0);
}

.reveal.is-visible .pricing-card:nth-child(2) { transition-delay: 90ms; }
.reveal.is-visible .pricing-card:nth-child(3) { transition-delay: 180ms; }

.pricing-card--popular {
    border-color: rgba(124, 145, 255, 0.66);
    box-shadow: 0 32px 80px rgba(55, 85, 190, 0.2);
    transform: translateY(6px);
}

.pricing-badge {
    align-self: flex-start;
    background: rgba(124, 145, 255, 0.18);
    border: 1px solid rgba(124, 145, 255, 0.34);
    border-radius: 999px;
    color: var(--text-primary);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    margin: 0;
    padding: 0.25rem 0.6rem;
    text-transform: uppercase;
}

.pricing-card__price {
    color: var(--text-primary);
    font-family: var(--font-display);
    font-size: 2.4rem;
    font-weight: 800;
    line-height: 1;
    margin: 0;
}

.pricing-card__price span {
    color: var(--text-secondary);
    font-size: 0.9rem;
}

.pricing-card dl {
    display: grid;
    gap: 0.72rem;
    margin: 0 0 auto;
}

.pricing-card dl div {
    border-top: 1px solid rgba(124, 145, 255, 0.14);
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 0.72rem;
}

.pricing-card dt {
    color: var(--text-secondary);
}

.pricing-card dd {
    color: var(--text-primary);
    font-weight: 700;
    text-align: right;
}

.bespoke-custom {
    border-left: 3px solid var(--cascadia-purple);
    margin-top: var(--space-6);
    padding: 0.25rem 0 0.25rem 1.25rem;
}

.bespoke-custom p {
    color: var(--text-secondary);
    margin-top: 0.5rem;
}

.bespoke-custom .btn-primary {
    margin-top: 0.9rem;
}

.integration-marquee {
    border: 1px solid rgba(124, 145, 255, 0.2);
    border-radius: 14px;
    margin: var(--space-5) 0 var(--space-4);
    overflow: hidden;
    padding: 1rem 0;
    position: relative;
}

.integration-marquee::before,
.integration-marquee::after {
    content: "";
    inset: 0 auto 0 0;
    pointer-events: none;
    position: absolute;
    width: 90px;
    z-index: 2;
}

.integration-marquee::before {
    background: linear-gradient(90deg, var(--bg-base), transparent);
}

.integration-marquee::after {
    background: linear-gradient(270deg, var(--bg-base), transparent);
    left: auto;
    right: 0;
}

.integration-marquee__track {
    animation: integrationMarquee 38s linear infinite;
    display: flex;
    gap: 0.75rem;
    width: max-content;
}

.integration-marquee:hover .integration-marquee__track,
.integration-marquee:focus-within .integration-marquee__track {
    animation-play-state: paused;
}

.integration-logo,
.integration-marquee-fallback span {
    align-items: center;
    background: rgba(13, 27, 58, 0.9);
    border: 1px solid rgba(124, 145, 255, 0.22);
    border-radius: 999px;
    color: var(--text-primary);
    display: inline-flex;
    gap: 0.58rem;
    font-weight: 800;
    justify-content: center;
    min-width: 116px;
    padding: 0.48rem 0.9rem 0.48rem 0.52rem;
    white-space: nowrap;
}

.integration-logo:has(.ticker-image),
.integration-marquee-fallback span:has(.ticker-image) {
    border-radius: 14px;
    min-height: 76px;
    min-width: 128px;
    padding: 0.55rem 0.7rem;
}

.ticker-image {
    aspect-ratio: 1 / 1;
    border-radius: 10px;
    display: block;
    flex: 0 0 auto;
    height: 48px;
    object-fit: contain;
    width: 48px;
}

.integration-logo--fallback .ticker-glyph {
    outline: 1px solid rgba(255, 255, 255, 0.12);
}

.ticker-glyph {
    align-items: center;
    background: linear-gradient(145deg, var(--cascadia-purple), var(--brand-cyan));
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 50%;
    box-shadow: 0 0 18px rgba(124, 145, 255, 0.28);
    color: #fff;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 0.78rem;
    font-weight: 900;
    height: 32px;
    justify-content: center;
    width: 32px;
}

.integration-logo[data-integration-kind="channel"],
.integration-marquee-fallback span[data-integration-kind="channel"] {
    border-color: rgba(53, 213, 255, 0.3);
    color: #d8f8ff;
}

@keyframes integrationMarquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

.integration-marquee-fallback {
    display: none;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin-bottom: var(--space-4);
}

.governance-control-grid {
    align-items: center;
}

.maturity-stages--interactive {
    grid-template-columns: 1fr;
}

.maturity-stages--interactive .maturity-stage {
    padding: 0;
}

.maturity-stages--interactive a {
    align-items: center;
    color: inherit;
    display: grid;
    gap: 0 0.8rem;
    grid-template-columns: 2.1rem 1fr;
    padding: 0.9rem;
    text-decoration: none;
}

.maturity-stages--interactive span {
    align-items: center;
    background: rgba(124, 145, 255, 0.18);
    border: 1px solid rgba(124, 145, 255, 0.34);
    border-radius: 50%;
    display: inline-flex;
    font-weight: 900;
    grid-row: span 2;
    height: 2.1rem;
    justify-content: center;
    width: 2.1rem;
}

.maturity-stages--interactive strong,
.maturity-stages--interactive em {
    display: block;
}

.maturity-stages--interactive em {
    color: var(--text-secondary);
    font-size: 0.82rem;
    font-style: normal;
}

.maturity-mountain {
    min-height: 520px;
    position: relative;
}

.maturity-mountain__svg {
    height: 100%;
    inset: 0;
    min-height: 320px;
    position: absolute;
    width: 100%;
}

.maturity-mountain__ridge {
    fill: url("#maturity-mountain-fill");
    opacity: 0.88;
}

.maturity-mountain__ridge--back {
    fill: rgba(124, 145, 255, 0.18);
    opacity: 1;
}

.maturity-mountain__trail {
    animation: maturityTrailDraw 8s ease-in-out infinite alternate;
    fill: none;
    stroke: url("#maturity-trail-gradient");
    stroke-dasharray: 22 12;
    stroke-dashoffset: 42;
    stroke-linecap: round;
    stroke-width: 5;
}

.maturity-mountain__beacons circle {
    animation: maturityBeaconPulse 3s ease-in-out infinite alternate;
    fill: #f7b267;
    stroke: rgba(255, 255, 255, 0.74);
    stroke-width: 2;
    transform-box: fill-box;
    transform-origin: center;
}

.maturity-mountain__beacons circle:nth-child(2) { animation-delay: 160ms; }
.maturity-mountain__beacons circle:nth-child(3) { animation-delay: 320ms; }
.maturity-mountain__beacons circle:nth-child(4) { animation-delay: 480ms; }
.maturity-mountain__beacons circle:nth-child(5) { animation-delay: 640ms; }

.maturity-mountain__nodes {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr);
    margin: 0 auto;
    max-width: 480px;
    min-height: 520px;
    padding: 1rem;
    position: relative;
    z-index: 1;
}

.maturity-mountain__node {
    align-items: center;
    background: rgba(9, 19, 43, 0.82);
    border: 1px solid rgba(124, 145, 255, 0.36);
    border-radius: 14px;
    color: var(--text-primary);
    display: grid;
    gap: 0.08rem 0.58rem;
    grid-template-columns: 2rem minmax(0, 1fr);
    max-width: none;
    min-width: 0;
    padding: 0.62rem 0.7rem;
    position: static;
    text-decoration: none;
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
    width: 100%;
}

.maturity-mountain__node:hover,
.maturity-mountain__node:focus-visible {
    border-color: rgba(247, 178, 103, 0.76);
    box-shadow: 0 18px 34px rgba(3, 10, 26, 0.38);
    outline: none;
    transform: translateY(-3px);
}

.maturity-mountain__number {
    align-items: center;
    background: rgba(124, 145, 255, 0.2);
    border: 1px solid rgba(124, 145, 255, 0.38);
    border-radius: 50%;
    display: inline-flex;
    font-weight: 900;
    grid-row: span 2;
    height: 2rem;
    justify-content: center;
    width: 2rem;
}

.maturity-mountain__node strong,
.maturity-mountain__node em {
    display: block;
}

.maturity-mountain__node strong {
    font-size: 0.84rem;
    line-height: 1.18;
}

.maturity-mountain__node em {
    color: var(--text-secondary);
    font-size: 0.72rem;
    font-style: normal;
    line-height: 1.25;
}

.maturity-mountain__node--1 { grid-row: 1; }
.maturity-mountain__node--2 { grid-row: 2; }
.maturity-mountain__node--3 { grid-row: 3; }
.maturity-mountain__node--4 { grid-row: 4; }
.maturity-mountain__node--5 { grid-row: 5; }

@keyframes maturityTrailDraw {
    to { stroke-dashoffset: 0; }
}

@keyframes maturityBeaconPulse {
    to { transform: scale(1.14); }
}

.page-hero .industries-heading-surface,
.page-hero .about-hero-surface {
    align-items: center;
    overflow: hidden;
    position: relative;
}

.industry-mountain-glyph,
.about-mountain-glyph,
.about-mission-glyph {
    filter: drop-shadow(0 24px 42px rgba(3, 10, 26, 0.32));
    justify-self: end;
    max-width: 100%;
}

.industry-mountain-glyph {
    width: min(32vw, 280px);
}

.about-mountain-glyph {
    grid-column: 1 / -1;
    justify-self: end;
    margin-top: -4.5rem;
    opacity: 0.76;
    width: min(30vw, 280px);
}

.about-layout-grid {
    display: grid;
    gap: var(--space-4);
    grid-template-areas:
        "mission mission"
        "operate partner"
        "founder founder"
        "callout callout";
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.about-layout-card--mission {
    grid-area: mission;
    position: relative;
}

.about-layout-card--operate { grid-area: operate; }
.about-layout-card--partner { grid-area: partner; }
.about-layout-card--founder { grid-area: founder; }
.about-layout-card--callout { grid-area: callout; }

.about-mission-glyph {
    opacity: 0.74;
    position: absolute;
    right: 1.6rem;
    top: 1.2rem;
    width: min(24vw, 260px);
}

.about-principles,
.about-trust-grid {
    position: relative;
    z-index: 1;
}

.about-layout-card--mission .section-intro {
    max-width: 62ch;
}

.founder-card--about {
    justify-self: start;
}

.pricing-rewrite .surface {
    border-color: rgba(124, 145, 255, 0.28);
}

.pricing-ops-hero .pricing-ops-hero__grid {
    align-items: center;
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
}

.pricing-proof-list,
.capacity-steps {
    display: grid;
    gap: 0.6rem;
    list-style: none;
    margin: 1.15rem 0 0;
}

.pricing-proof-list li,
.capacity-steps li {
    color: var(--text-secondary);
    padding-left: 1.15rem;
    position: relative;
}

.pricing-proof-list li::before,
.capacity-steps li::before {
    color: #f7b267;
    content: "-";
    left: 0;
    position: absolute;
}

.pricing-dashboard-card,
.capacity-chart-card {
    background:
        radial-gradient(circle at 18% 10%, rgba(53, 213, 255, 0.2), transparent 30%),
        linear-gradient(160deg, rgba(8, 18, 42, 0.95), rgba(4, 10, 24, 0.98));
    border: 1px solid rgba(124, 145, 255, 0.34);
    border-radius: 18px;
    box-shadow: 0 34px 80px rgba(2, 8, 20, 0.36);
    padding: 1.1rem;
}

.pricing-dashboard-card__topline,
.pricing-signal-grid div,
.capacity-steps li {
    border: 1px solid rgba(124, 145, 255, 0.2);
    border-radius: 12px;
    background: rgba(13, 27, 58, 0.68);
}

.pricing-dashboard-card__topline {
    align-items: center;
    color: #eef3ff;
    display: flex;
    font-weight: 800;
    justify-content: space-between;
    padding: 0.72rem 0.82rem;
}

.status-pill {
    background: rgba(34, 197, 94, 0.16);
    border: 1px solid rgba(34, 197, 94, 0.42);
    border-radius: 999px;
    color: #a7f3d0;
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    padding: 0.22rem 0.52rem;
    text-transform: uppercase;
}

.pricing-signal-grid {
    display: grid;
    gap: 0.75rem;
    margin-top: 0.9rem;
}

.pricing-signal-grid div {
    padding: 0.82rem;
}

.pricing-signal-grid span {
    color: var(--text-secondary);
    display: block;
    font-size: 0.78rem;
}

.pricing-signal-grid strong {
    color: var(--text-primary);
    display: block;
    font-size: 1rem;
    margin-top: 0.18rem;
}

.capacity-trend,
.capacity-chart {
    margin-top: 1rem;
    width: 100%;
}

.capacity-trend path,
.capacity-chart path {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.capacity-trend__band {
    stroke: rgba(124, 145, 255, 0.34);
    stroke-width: 18;
}

.capacity-trend__line {
    stroke: #f7b267;
    stroke-width: 5;
}

.capacity-trend circle {
    fill: #f7b267;
    stroke: rgba(255, 255, 255, 0.72);
    stroke-width: 2;
}

.pricing-capability-grid,
.pricing-compact-grid {
    display: grid;
    gap: var(--space-3);
}

.pricing-capability-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

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

.pricing-proof-card {
    background: linear-gradient(170deg, rgba(19, 35, 72, 0.82), rgba(12, 24, 53, 0.92));
    border: 1px solid rgba(120, 151, 236, 0.3);
    border-radius: 14px;
    padding: 1rem;
}

.pricing-proof-card p {
    color: var(--text-secondary);
    font-size: 0.93rem;
}

.pricing-cards--rewrite {
    align-items: stretch;
}

.pricing-card--rewrite {
    min-height: 610px;
}

.pricing-card--rewrite h4 {
    color: #eef3ff;
    font-size: 0.78rem;
    letter-spacing: 0.1em;
    margin-top: 0.2rem;
    text-transform: uppercase;
}

.pricing-card__fit {
    color: #dce8ff;
    font-weight: 800;
}

.pricing-card--rewrite.pricing-card--popular {
    border-color: rgba(247, 178, 103, 0.62);
    box-shadow: 0 28px 80px rgba(247, 178, 103, 0.12), 0 32px 80px rgba(55, 85, 190, 0.2);
    transform: translateY(0) scale(1.018);
}

.pricing-evidence-grid {
    align-items: center;
    display: grid;
    gap: var(--space-5);
    grid-template-columns: minmax(0, 0.95fr) minmax(320px, 1.05fr);
}

.capacity-steps {
    counter-reset: capacity-step;
}

.capacity-steps li {
    counter-increment: capacity-step;
    display: grid;
    gap: 0.14rem;
    padding: 0.8rem 0.85rem 0.8rem 2.6rem;
}

.capacity-steps li::before {
    align-items: center;
    background: rgba(247, 178, 103, 0.16);
    border: 1px solid rgba(247, 178, 103, 0.38);
    border-radius: 50%;
    color: #f7b267;
    content: counter(capacity-step);
    display: inline-flex;
    font-weight: 900;
    height: 1.6rem;
    justify-content: center;
    left: 0.65rem;
    top: 0.85rem;
    width: 1.6rem;
}

.capacity-steps strong {
    color: var(--text-primary);
}

.capacity-steps span {
    color: var(--text-secondary);
    font-size: 0.92rem;
}

.pricing-callout {
    background: linear-gradient(90deg, rgba(247, 178, 103, 0.14), rgba(53, 213, 255, 0.08));
    border: 1px solid rgba(247, 178, 103, 0.28);
    border-radius: 14px;
    color: #eef3ff;
    margin-top: 1rem;
    padding: 0.9rem 1rem;
}

.capacity-chart__grid {
    stroke: rgba(124, 145, 255, 0.16);
    stroke-width: 1;
}

.capacity-chart__band {
    stroke: rgba(124, 145, 255, 0.28);
    stroke-width: 34;
}

.capacity-chart__demand {
    stroke: #f7b267;
    stroke-width: 5;
}

.capacity-chart__indicator,
.capacity-chart__arrow {
    stroke: var(--brand-cyan);
    stroke-width: 4;
}

.pricing-faq-link {
    color: var(--text-secondary);
    margin-top: 0.9rem;
}

.pricing-faq-link a {
    color: var(--brand-cyan);
    font-weight: 800;
}

.pricing-final-cta .callout-bar {
    align-items: center;
    display: grid;
    gap: var(--space-4);
    grid-template-columns: minmax(0, 1fr) auto;
    text-align: left;
}

.pricing-final-cta .callout-bar h2 {
    font-size: clamp(1.5rem, 2.6vw, 2.1rem);
}

.pricing-final-cta .callout-bar p {
    margin-top: 0.4rem;
    max-width: 68ch;
}

.footer {
    overflow: hidden;
    padding-top: 0;
}

.footer-evergreen {
    color: rgba(12, 59, 52, 0.85);
    margin: -1px 0 0;
}

.footer-evergreen svg {
    height: 86px;
    width: 100%;
}

.footer-evergreen path:first-child {
    fill: rgba(124, 145, 255, 0.16);
}

.footer-evergreen path:last-child {
    fill: rgba(12, 59, 52, 0.82);
}

@media (max-width: 980px) {
    .who-grid,
    .org-budget-grid,
    .governance-control-grid,
    .pricing-cards,
    .pricing-ops-hero__grid,
    .pricing-evidence-grid,
    .pricing-capability-grid,
    .pricing-compact-grid,
    .about-layout-grid {
        grid-template-columns: 1fr;
    }

    .about-layout-grid {
        grid-template-areas:
            "mission"
            "operate"
            "partner"
            "founder"
            "callout";
    }

    .about-mission-glyph {
        opacity: 0.3;
        width: min(44vw, 220px);
    }

    .who-metrics {
        grid-template-columns: 1fr;
    }

    .founder-card {
        justify-self: start;
    }

    .org-budget-row--chart,
    .org-budget-row--costs {
        grid-template-columns: 1fr;
    }

    .org-chart-panel {
        min-height: 430px;
    }

    .pricing-final-cta .callout-bar {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .home-agent-operations {
        min-height: auto;
        padding-bottom: 6rem;
    }

    .cost-bar-row {
        grid-template-columns: 1fr;
        gap: 0.45rem;
    }

    .cost-bar-row--head {
        display: none;
    }

    .solution-industry-track {
        animation: none;
    }

    .solution-industry-grid {
        grid-auto-columns: min(82vw, 300px);
    }

    .solution-industry-grid--duplicate {
        display: none;
    }

    .solution-industry-viewport {
        scroll-snap-type: x mandatory;
    }

    .solution-industry-band__arrow {
        height: 2.35rem;
        width: 2.35rem;
    }

    .org-chart-panel {
        aspect-ratio: auto;
        gap: 2rem;
        grid-template-rows: auto;
        min-height: 0;
        padding: 1rem;
    }

    .org-connectors {
        display: none;
    }

    .org-chart-level,
    .org-chart-level--chiefs,
    .org-chart-level--domains {
        gap: 1rem;
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .page-hero .industries-heading-surface,
    .page-hero .about-hero-surface {
        grid-template-columns: 1fr;
    }

    .industry-mountain-glyph,
    .about-mountain-glyph,
    .about-mission-glyph {
        justify-self: start;
        width: min(78vw, 240px);
    }

    .about-mountain-glyph {
        margin-top: 0;
    }

    .about-mission-glyph {
        margin-top: 1rem;
        opacity: 0.72;
        position: static;
    }

    .about-principles,
    .about-trust-grid {
        grid-template-columns: 1fr;
    }

    .maturity-mountain {
        min-height: 520px;
    }

    .maturity-mountain__svg {
        opacity: 0.58;
    }

    .maturity-mountain__node {
        max-width: none;
        min-width: 0;
        width: 100%;
    }

    .pricing-card--rewrite.pricing-card--popular {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .terminal-lines--typed li.is-typing .terminal-text::after,
    .integration-marquee__track,
    .maturity-mountain__trail,
    .maturity-mountain__beacons circle,
    .solution-industry-track,
    .virtual-org.is-active .org-connectors path,
    .js-ready .virtual-org.is-active .virtual-org__node,
    .js-ready .virtual-org.is-active .worker-dots i,
    .reveal.is-visible .pricing-card {
        animation: none !important;
        transition: none !important;
    }

    .solution-industry-track {
        transform: none !important;
    }

    .integration-marquee {
        display: none;
    }

    .integration-marquee-fallback {
        display: flex;
    }

    .cost-bar-fill {
        width: var(--bar-width) !important;
    }

    .js-ready .org-chart-panel .virtual-org__node,
    .js-ready .org-chart-panel .worker-dots i {
        opacity: 1 !important;
        transform: none !important;
    }

    .org-connectors path {
        stroke-dashoffset: 0 !important;
    }

    .maturity-mountain__trail {
        stroke-dashoffset: 0 !important;
    }

    .maturity-mountain__beacons circle,
    .maturity-mountain__node:hover,
    .maturity-mountain__node:focus-visible {
        transform: none !important;
    }
}