:root {
    --accent-cyan: #56e6ff;
    --accent-lime: #b7ff64;
    --accent-amber: #ffb74a;
    --surface-glass: rgba(9, 12, 13, 0.72);
    --line-strong: rgba(255, 255, 255, 0.16);
    --mx: 50vw;
    --my: 50vh;
}

html { scroll-behavior: smooth; }

body {
    background: #070909;
    letter-spacing: 0;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 20;
    pointer-events: none;
    background: radial-gradient(420px circle at var(--mx) var(--my), rgba(86, 230, 255, 0.045), transparent 70%);
    mix-blend-mode: screen;
}

::selection { color: #050707; background: var(--accent-cyan); }

.scroll-progress {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    z-index: 11000;
    background: rgba(255, 255, 255, 0.04);
}

.scroll-progress span {
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, var(--accent-cyan), var(--accent-lime));
    transform: scaleX(0);
    transform-origin: left;
    will-change: transform;
}

.arch-grid-bg {
    background-size: 56px 56px;
    opacity: 0.55;
    mask-image: linear-gradient(to bottom, black, transparent 90%);
}

nav {
    min-height: 58px;
    padding: 0.55rem 2rem;
    background: transparent;
    border-bottom-color: transparent;
    backdrop-filter: none;
    transition: background 0.35s ease, min-height 0.35s ease;
}

nav.is-scrolled {
    min-height: 58px;
    background: transparent;
    border-bottom-color: transparent;
    box-shadow: none;
    backdrop-filter: none;
}

body > nav { grid-template-columns: auto 1fr auto; }
body > nav .nav-actions { grid-column: 3; }

footer .footer-nav {
    position: static;
    width: auto;
    min-height: 0;
    padding: 0;
    display: flex;
    grid-template-columns: none;
    gap: 1rem;
    background: transparent;
    border: 0;
    backdrop-filter: none;
    z-index: auto;
    width: 100%;
    max-width: none;
    min-height: 72px;
    margin-top: 1.5rem;
    padding: 1rem 2rem;
    justify-content: center;
    flex-wrap: wrap;
    row-gap: 0.7rem;
    border-top: 1px solid rgba(255,255,255,0.1);
    background: rgba(255,255,255,0.018);
}

footer { padding: 3rem 0 0; gap: 1rem; }
footer > p { padding: 0 1.5rem; }

.nav-brand {
    display: flex;
    align-items: center;
    overflow: visible;
}

.nav-brand::before { display: none; content: none; }
.nav-brand::after {
    content: "LinSpace AI";
    display: block;
    color: transparent;
    background: linear-gradient(90deg, #79b7ff 0%, #8fa6ff 52%, #b58cff 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font: 500 1.35rem/1 Inter, sans-serif;
    letter-spacing: 0;
    white-space: nowrap;
}
.logo-img { display: none; }

.nav-group { gap: 0.7rem; }

.nav-group a {
    position: relative;
    font-size: 0.65rem;
    color: rgba(255, 255, 255, 0.55);
}

.nav-group a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 100%;
    bottom: -0.45rem;
    height: 1px;
    background: var(--accent-cyan);
    transition: right 0.25s ease;
}

.nav-group a:hover::after { right: 0; }
.nav-group .nav-sep { opacity: 0.35; }

.nav-cta {
    position: relative;
    overflow: hidden;
    height: 1.74rem;
    min-height: 1.74rem;
    padding: 0 0.62rem !important;
    border: 1px solid rgba(255,255,255,0.42) !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,0.1) !important;
    color: rgba(255,255,255,0.9) !important;
    font-size: 0.65rem !important;
    letter-spacing: 0.02em !important;
    box-shadow: none !important;
    filter: none !important;
}

.nav-cta::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,0.9);
    transform: translateY(102%);
    transition: transform 0.3s ease;
}

.nav-cta:hover::before { transform: translateY(0); }
.nav-cta span { position: relative; z-index: 1; }
.nav-cta::after { content: none !important; }
.nav-cta:hover,
.nav-cta:hover span,
.nav-cta:hover::after {
    color: #111 !important;
    -webkit-text-fill-color: #111 !important;
}

.nav-subscribe {
    min-width: 3.75rem;
    justify-content: center;
}

.lang-toggle {
    top: 0.65rem !important;
    right: 14.35rem !important;
    align-items: stretch;
    height: 2rem;
    min-height: 2rem;
    overflow: visible;
    border: 0;
    border-radius: 0 !important;
    background: transparent;
}

.lang-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-width: 2.35rem;
    padding-right: 0.62rem;
    padding-left: 0.62rem;
    padding-top: 0;
    padding-bottom: 0;
    color: rgba(255,255,255,0.48);
    font-size: 0.62rem;
}

.lang-btn.active {
    color: rgba(255,255,255,0.95);
    background: transparent;
}

.lang-btn + .lang-btn {
    border-left-color: rgba(255,255,255,0.24);
}

section {
    max-width: 1500px;
    padding-left: clamp(2rem, 5vw, 5rem);
    padding-right: clamp(2rem, 5vw, 5rem);
}

.section-label {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin-bottom: 2.25rem;
    color: rgba(255, 255, 255, 0.48);
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    font-size: 0.67rem;
    letter-spacing: 0.16em;
}

.section-label::before {
    content: "";
    width: 7px;
    height: 7px;
    border: 1px solid var(--accent-cyan);
    transform: rotate(45deg);
}

.section-label::after {
    content: "";
    width: 48px;
    height: 1px;
    background: linear-gradient(90deg, rgba(86, 230, 255, 0.8), transparent);
}

h1, h2 { letter-spacing: 0; }

[hidden] {
    display: none !important;
}

#hero {
    min-height: max(780px, calc(100svh - 48px));
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, 560px);
    align-items: center;
    gap: clamp(2rem, 5vw, 6rem);
    padding-top: 6.5rem;
    padding-bottom: 1.75rem;
    isolation: isolate;
}

#hero::before {
    content: "";
    position: absolute;
    inset: 0 50% auto;
    width: 100vw;
    height: 100%;
    transform: translateX(-50%);
    z-index: 1;
    pointer-events: none;
    background: repeating-linear-gradient(0deg, transparent 0, transparent 3px, rgba(255,255,255,0.012) 4px);
}

.hero-bg img {
    opacity: 0.68;
    filter: grayscale(0.55) contrast(1.18) brightness(0.82);
    transform: scale(1.025);
    animation: hero-breathe 16s ease-in-out infinite alternate;
}

.hero-bg::after {
    background:
        linear-gradient(90deg, rgba(7,9,9,0.98) 0%, rgba(7,9,9,0.78) 36%, rgba(7,9,9,0.25) 72%, rgba(7,9,9,0.62) 100%),
        linear-gradient(180deg, rgba(7,9,9,0.18) 0%, transparent 24%, transparent 67%, #070909 100%);
}

@keyframes hero-breathe {
    from { transform: scale(1.025); }
    to { transform: scale(1.075); }
}

.hero-copy {
    position: relative;
    z-index: 3;
    max-width: 850px;
}

#hero .section-label {
    max-width: 680px;
    color: rgba(255,255,255,0.48);
}

#hero h1 {
    max-width: 780px;
    margin-bottom: 1.5rem;
    font-size: clamp(3.25rem, 5.3vw, 5.6rem);
    line-height: 0.98;
    font-weight: 300;
    text-wrap: balance;
}

#hero .hero-title-lead,
#hero .hero-title-focus {
    display: block;
}

#hero .hero-title-lead {
    margin-bottom: 0.18em;
    color: rgba(255,255,255,0.72);
    font-size: 0.7em;
    line-height: 1.12;
}

#hero .hero-title-focus {
    color: rgba(255,255,255,0.98);
    line-height: 1;
}

#hero h1 [data-lang="en"] .hero-title-lead {
    font-size: 0.58em;
}

#hero h1 [data-lang="en"] .hero-title-focus {
    font-size: 0.68em;
}

.hero-divider {
    width: 92px;
    margin: 2.35rem 0;
    background: linear-gradient(90deg, var(--accent-cyan), transparent);
    box-shadow: 0 0 12px rgba(86, 230, 255, 0.5);
}

#hero .large-text {
    max-width: 760px;
    font-size: clamp(1.05rem, 1.45vw, 1.35rem);
    line-height: 1.7;
    color: rgba(255,255,255,0.72);
}

#hero .hero-brand-line {
    max-width: 700px;
    margin-top: 1.55rem;
    color: rgba(255,255,255,0.48);
    font-size: 0.9rem;
    letter-spacing: 0.035em;
}

#hero .hero-actions {
    flex-wrap: wrap;
    margin-top: 2rem;
}

.btn-container { gap: 0.8rem; }

.btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0.9rem 1.45rem;
    border-radius: 0;
    overflow: hidden;
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 0.72rem;
    letter-spacing: 0.08em;
}

.btn::after {
    content: "↗";
    margin-left: 1.2rem;
    font-size: 1rem;
    transition: transform 0.25s ease;
}

.btn:hover::after { transform: translate(3px, -3px); }

.btn-primary { background: #f4f7f5; }
.btn-primary:hover { background: var(--accent-cyan); }
.btn-secondary { border-color: rgba(255,255,255,0.28); backdrop-filter: blur(12px); }

.hero-console {
    position: relative;
    z-index: 4;
    align-self: center;
    width: 100%;
    border: 1px solid rgba(255,255,255,0.18);
    background: linear-gradient(145deg, rgba(14,18,19,0.88), rgba(5,7,7,0.7));
    box-shadow: 0 30px 90px rgba(0,0,0,0.45), inset 0 0 50px rgba(86,230,255,0.025);
    backdrop-filter: blur(18px);
}

.hero-console::before,
.hero-console::after {
    content: "";
    position: absolute;
    width: 18px;
    height: 18px;
    border-color: var(--accent-cyan);
}

.hero-console::before { top: -1px; left: -1px; border-top: 2px solid; border-left: 2px solid; }
.hero-console::after { right: -1px; bottom: -1px; border-right: 2px solid; border-bottom: 2px solid; }

.hero-video-console {
    aspect-ratio: 16 / 9;
    max-width: 560px;
    overflow: hidden;
    background: #020404;
}

.hero-demo-video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #020404;
    scroll-margin-top: 5rem;
}

.video-hud {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 0.9rem;
    color: rgba(255,255,255,0.76);
    background: linear-gradient(180deg, rgba(2,4,4,0.9), transparent);
    font: 0.56rem/1 "SFMono-Regular", Consolas, monospace;
    letter-spacing: 0.09em;
    pointer-events: none;
}

.video-scan {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    z-index: 2;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(86,230,255,0.9), transparent);
    box-shadow: 0 0 12px rgba(86,230,255,0.7);
    animation: video-scan 5.5s ease-in-out infinite;
    pointer-events: none;
}

@keyframes video-scan {
    0%, 100% { top: 4%; opacity: 0.2; }
    50% { top: 96%; opacity: 0.75; }
}

.console-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid rgba(255,255,255,0.12);
    color: rgba(255,255,255,0.7);
    font: 0.64rem/1 "SFMono-Regular", Consolas, monospace;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.live-indicator { color: var(--accent-lime); }
.live-indicator i { display: inline-block; width: 6px; height: 6px; margin-right: 0.4rem; border-radius: 50%; background: currentColor; box-shadow: 0 0 10px currentColor; animation: pulse 1.7s ease-in-out infinite; }

@keyframes pulse { 50% { opacity: 0.3; transform: scale(0.75); } }

.site-diagram {
    position: relative;
    height: 290px;
    overflow: hidden;
    background-image: linear-gradient(rgba(86,230,255,0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(86,230,255,0.07) 1px, transparent 1px);
    background-size: 24px 24px;
}

.site-diagram::before {
    content: "SITE / 31.2304 N / 121.4737 E";
    position: absolute;
    top: 12px;
    left: 14px;
    color: rgba(255,255,255,0.34);
    font: 0.55rem/1 Consolas, monospace;
}

.site-boundary {
    position: absolute;
    inset: 58px 66px 44px 54px;
    border: 1px solid rgba(86,230,255,0.65);
    transform: skewY(-8deg) rotate(-4deg);
    box-shadow: inset 0 0 45px rgba(86,230,255,0.06), 0 0 20px rgba(86,230,255,0.06);
}

.site-boundary::before,
.site-boundary::after,
.site-boundary span {
    content: "";
    position: absolute;
    border: 1px solid rgba(183,255,100,0.42);
    background: rgba(183,255,100,0.025);
}

.site-boundary::before { inset: 18% 52% 48% 12%; }
.site-boundary::after { inset: 52% 10% 12% 46%; }
.site-boundary span:nth-child(1) { inset: 24% 16% 22% 53%; }
.site-boundary span:nth-child(2) { inset: 61% 59% 8% 13%; }
.site-boundary span:nth-child(3) { inset: 17% 43% 56% 39%; border-color: rgba(255,183,74,0.58); }

.site-axis { position: absolute; background: rgba(255,255,255,0.16); }
.axis-x { left: 30px; right: 30px; top: 55%; height: 1px; }
.axis-y { top: 30px; bottom: 30px; left: 57%; width: 1px; }

.site-node { position: absolute; width: 7px; height: 7px; border: 1px solid var(--accent-cyan); background: #080b0b; transform: rotate(45deg); box-shadow: 0 0 10px rgba(86,230,255,0.65); }
.node-a { left: 26%; top: 36%; }
.node-b { right: 22%; top: 29%; }
.node-c { right: 31%; bottom: 23%; border-color: var(--accent-amber); }

.scan-beam {
    position: absolute;
    left: 0;
    right: 0;
    height: 1px;
    top: 10%;
    background: linear-gradient(90deg, transparent, var(--accent-cyan), transparent);
    box-shadow: 0 0 14px rgba(86,230,255,0.8);
    animation: scan 4.8s ease-in-out infinite;
}

@keyframes scan { 0%, 100% { top: 10%; opacity: 0.2; } 50% { top: 88%; opacity: 0.9; } }

.console-metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid rgba(255,255,255,0.12);
    border-bottom: 1px solid rgba(255,255,255,0.12);
}

.console-metrics div { padding: 0.85rem; }
.console-metrics div + div { border-left: 1px solid rgba(255,255,255,0.12); }
.console-metrics span, .console-metrics small { display: block; color: rgba(255,255,255,0.36); font: 0.5rem/1.2 Consolas, monospace; }
.console-metrics strong { display: block; margin: 0.3rem 0; color: #fff; font: 400 1.25rem/1 Consolas, monospace; }
.console-metrics small { color: var(--accent-lime); }

.console-log { display: flex; align-items: center; justify-content: space-between; padding: 0.8rem 1rem; color: rgba(255,255,255,0.38); font: 0.55rem/1 Consolas, monospace; }
.console-log b { display: flex; gap: 3px; }
.console-log i { width: 16px; height: 2px; background: var(--accent-cyan); animation: load 1.2s ease-in-out infinite alternate; }
.console-log i:nth-child(2) { animation-delay: .12s; }
.console-log i:nth-child(3) { animation-delay: .24s; }
.console-log i:nth-child(4) { animation-delay: .36s; }
.console-log i:nth-child(5) { animation-delay: .48s; }
@keyframes load { from { opacity: .12; } to { opacity: 1; } }

#hero .hero-index {
    position: absolute;
    right: 1.2rem;
    bottom: 4rem;
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.7rem;
    color: rgba(255,255,255,0.35);
    font: 0.55rem/1 Consolas, monospace;
}

.hero-index i { width: 1px; height: 70px; background: linear-gradient(var(--accent-cyan), rgba(255,255,255,0.1)); }

.bg-section::before {
    filter: saturate(0.55) contrast(1.05);
    background-image: linear-gradient(180deg, rgba(7,9,9,0.96) 0%, rgba(7,9,9,0.79) 45%, rgba(7,9,9,0.97) 100%), var(--section-bg);
}

#manifesto, #intelligence-stack, #product-stage, #cta { background: transparent; }

#manifesto {
    display: grid;
    grid-template-columns: minmax(220px, 0.7fr) minmax(0, 1.3fr);
    gap: 5vw;
    padding-top: 11rem;
    padding-bottom: 11rem;
}

#manifesto .section-label { grid-column: 1 / -1; margin-bottom: 0; }
#manifesto h2 { font-size: clamp(2.6rem, 4vw, 4.8rem); line-height: 1.05; }
#manifesto .large-text { font-size: clamp(1.1rem, 1.5vw, 1.45rem); border-left: 1px solid var(--accent-cyan); padding-left: 2rem; }

.manifesto-visual {
    position: relative;
    grid-column: 1 / -1;
    aspect-ratio: 21 / 8;
    margin-top: 1.5rem;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.16);
    background: #050707;
}

.manifesto-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: linear-gradient(90deg, black, transparent 66%);
    pointer-events: none;
}

.manifesto-visual img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center 47%;
    filter: saturate(0.75) contrast(1.08) brightness(0.82);
}

.manifesto-tape {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    background: rgba(4,7,7,0.82);
    border-top: 1px solid rgba(255,255,255,0.16);
    backdrop-filter: blur(14px);
}

.manifesto-tape span { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; }
.manifesto-tape span + span { border-left: 1px solid rgba(255,255,255,0.12); }
.manifesto-tape b { color: var(--accent-cyan); font: 0.65rem/1 Consolas, monospace; }
.manifesto-tape i { color: rgba(255,255,255,0.78); font: normal 0.72rem/1.2 Consolas, monospace; letter-spacing: 0.06em; text-transform: uppercase; }

.paradigm-grid { gap: 1px; background: rgba(255,255,255,0.12); }
.paradigm-column { padding: clamp(2rem, 4vw, 4rem); background: rgba(7,9,9,0.83); backdrop-filter: blur(12px); }
.paradigm-column:first-child::after { display: none; }
.paradigm-column:last-child { background: rgba(13,23,22,0.82); }
.paradigm-label { font-family: Consolas, monospace; color: var(--accent-cyan); }
.paradigm-title { font-size: 2.1rem; }
.paradigm-items li { position: relative; padding-left: 1.2rem; }
.paradigm-items li::before { content: ""; position: absolute; left: 0; top: 1.55rem; width: 5px; height: 5px; background: rgba(255,255,255,0.22); }
.paradigm-column:last-child .paradigm-items li::before { background: var(--accent-lime); box-shadow: 0 0 8px rgba(183,255,100,0.5); }

.paradigm-signal {
    position: relative;
    height: 170px;
    margin: 1.8rem 0 2rem;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.12);
    background-image: linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
    background-size: 24px 24px;
}

.signal-random i {
    position: absolute;
    width: 32%;
    height: 52%;
    border: 1px solid rgba(255,255,255,0.28);
    background: rgba(255,255,255,0.025);
}
.signal-random i:nth-child(1) { left: 12%; top: 22%; transform: rotate(-9deg); }
.signal-random i:nth-child(2) { left: 35%; top: 16%; transform: rotate(7deg); border-color: rgba(255,183,74,0.5); }
.signal-random i:nth-child(3) { right: 10%; top: 31%; transform: rotate(-4deg); }
.signal-random::after { content: "UNRESOLVED"; position: absolute; right: 0.8rem; bottom: 0.7rem; color: rgba(255,183,74,0.7); font: 0.55rem/1 Consolas, monospace; }

.signal-reasoning::before,
.signal-reasoning::after { content: ""; position: absolute; left: 12%; right: 12%; height: 1px; background: linear-gradient(90deg, var(--accent-cyan), rgba(183,255,100,0.72)); }
.signal-reasoning::before { top: 36%; transform: rotate(6deg); }
.signal-reasoning::after { top: 64%; transform: rotate(-5deg); }
.signal-reasoning i { position: absolute; width: 13px; height: 13px; border: 1px solid var(--accent-cyan); background: #08100f; transform: rotate(45deg); box-shadow: 0 0 14px rgba(86,230,255,0.28); }
.signal-reasoning i:nth-child(1) { left: 12%; top: 31%; }
.signal-reasoning i:nth-child(2) { left: 32%; top: 52%; border-color: var(--accent-lime); }
.signal-reasoning i:nth-child(3) { left: 51%; top: 26%; }
.signal-reasoning i:nth-child(4) { right: 28%; top: 60%; border-color: var(--accent-lime); }
.signal-reasoning i:nth-child(5) { right: 11%; top: 38%; }

.stack-grid { grid-template-columns: repeat(4, 1fr); gap: 1px; background: rgba(255,255,255,0.12); }
.stack-item { position: relative; min-height: 255px; background: rgba(8,11,11,0.86); overflow: hidden; transition: background 0.35s ease, transform 0.35s ease; }
.stack-item::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 2px; background: linear-gradient(90deg, var(--accent-cyan), var(--accent-lime)); transition: right 0.35s ease; }
.stack-item:hover { z-index: 2; background: rgba(18,29,28,0.96); transform: translateY(-5px); }
.stack-item:hover::after { right: 0; }
.stack-number { font-family: Consolas, monospace; }

.stack-item::before {
    content: "";
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    width: 58px;
    height: 58px;
    opacity: 0.72;
    border: 1px solid rgba(86,230,255,0.25);
    background-size: 12px 12px;
    transition: opacity 0.3s ease, transform 0.3s ease;
}
.stack-item:hover::before { opacity: 1; transform: scale(1.08); }
.stack-item:nth-child(1)::before { background-image: radial-gradient(circle, var(--accent-cyan) 1px, transparent 2px); }
.stack-item:nth-child(2)::before { background-image: repeating-linear-gradient(135deg, transparent 0 7px, rgba(255,183,74,0.55) 8px 9px); }
.stack-item:nth-child(3)::before { background: linear-gradient(145deg, transparent 34%, rgba(86,230,255,0.72) 35% 37%, transparent 38%), linear-gradient(35deg, transparent 42%, rgba(183,255,100,0.5) 43% 46%, transparent 47%); }
.stack-item:nth-child(4)::before { border-radius: 50%; background: radial-gradient(circle, transparent 0 28%, rgba(86,230,255,0.5) 29% 31%, transparent 32% 47%, rgba(86,230,255,0.22) 48% 50%, transparent 51%); }
.stack-item:nth-child(5)::before { background: linear-gradient(135deg, rgba(255,183,74,0.55), transparent 42%), linear-gradient(315deg, rgba(86,230,255,0.48), transparent 44%); }
.stack-item:nth-child(6)::before { background-image: repeating-linear-gradient(90deg, rgba(86,230,255,0.55) 0 2px, transparent 2px 10px); }
.stack-item:nth-child(7)::before { background: linear-gradient(90deg, transparent 47%, rgba(183,255,100,0.55) 48% 52%, transparent 53%), linear-gradient(transparent 47%, rgba(183,255,100,0.55) 48% 52%, transparent 53%); }
.stack-item:nth-child(8)::before { border-color: rgba(183,255,100,0.45); background: radial-gradient(circle at center, rgba(183,255,100,0.65) 0 5%, transparent 6% 25%, rgba(183,255,100,0.26) 26% 28%, transparent 29%); }

#human-ai { min-height: 72vh; display: flex; flex-direction: column; justify-content: center; overflow: hidden; }
#human-ai h2 { font-size: clamp(3rem, 7vw, 7.5rem); line-height: 0.95; }
#human-ai .large-text { color: var(--accent-cyan); font: 0.9rem/1.5 Consolas, monospace; letter-spacing: 0.12em; text-transform: uppercase; }

.human-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(150px, 1fr));
    width: min(760px, 100%);
    margin: 4rem auto 0;
    border-top: 1px solid rgba(255,255,255,0.16);
    border-bottom: 1px solid rgba(255,255,255,0.16);
    background: rgba(5,8,8,0.45);
    backdrop-filter: blur(12px);
}
.human-metrics span { padding: 1.4rem 1rem; }
.human-metrics span + span { border-left: 1px solid rgba(255,255,255,0.12); }
.human-metrics strong { display: block; color: #fff; font: 300 2.4rem/1 Inter, sans-serif; }
.human-metrics small { display: block; margin-top: 0.65rem; color: rgba(255,255,255,0.48); font: 0.6rem/1.3 Consolas, monospace; letter-spacing: 0.08em; text-transform: uppercase; }

.product-intro { margin-bottom: 3rem; }

.product-gallery {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(280px, 0.8fr);
    grid-template-rows: repeat(2, minmax(210px, 1fr));
    gap: 1px;
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.15);
    box-shadow: 0 40px 100px rgba(0,0,0,0.42);
}

.product-shot { position: relative; min-height: 0; overflow: hidden; background: #050707; }
.product-shot-main { grid-row: 1 / 3; }
.product-shot img { display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(0.82) contrast(1.05); transition: transform 0.65s cubic-bezier(.2,.7,.2,1), filter 0.4s ease; }
.product-shot:hover img { transform: scale(1.025); filter: saturate(1) contrast(1.04); }
.product-shot figcaption { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 2.7rem 1.25rem 1rem; color: rgba(255,255,255,0.78); background: linear-gradient(transparent, rgba(3,5,5,0.92)); font-size: 0.72rem; }
.product-shot figcaption b { color: var(--accent-cyan); font: 0.58rem/1 Consolas, monospace; letter-spacing: 0.08em; }

.workflow-rail {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin-top: 2rem;
    border: 1px solid rgba(255,255,255,0.13);
    background: rgba(5,8,8,0.7);
}
.workflow-rail::before { content: ""; position: absolute; top: 50%; left: 12%; right: 12%; height: 1px; background: linear-gradient(90deg, var(--accent-cyan), var(--accent-lime)); opacity: 0.28; }
.workflow-rail span { position: relative; z-index: 1; display: flex; align-items: center; gap: 0.85rem; padding: 1.2rem; background: rgba(5,8,8,0.76); }
.workflow-rail span + span { border-left: 1px solid rgba(255,255,255,0.1); }
.workflow-rail i { display: grid; place-items: center; width: 28px; height: 28px; flex: 0 0 28px; border: 1px solid rgba(86,230,255,0.55); color: var(--accent-cyan); font: normal 0.55rem/1 Consolas, monospace; }
.workflow-rail b { color: rgba(255,255,255,0.7); font: 400 0.66rem/1.2 Consolas, monospace; letter-spacing: 0.05em; text-transform: uppercase; }

.product-viewport {
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 8.6;
    background-color: rgba(4,6,6,0.92);
    background-size: 92%;
    border-color: rgba(255,255,255,0.18);
    box-shadow: 0 40px 100px rgba(0,0,0,0.42);
}
.product-viewport::after { content: "AI DESIGN WORKSPACE / ONLINE"; position: absolute; right: 2rem; bottom: 1.5rem; color: var(--accent-lime); font: 0.58rem/1 Consolas, monospace; letter-spacing: .08em; }
.viewport-label { color: var(--accent-cyan); font-family: Consolas, monospace; }

.roadmap-grid { position: relative; gap: 0; background: transparent; }
.roadmap-grid::before { content: ""; position: absolute; left: 0; right: 0; top: 22px; height: 1px; background: linear-gradient(90deg, var(--accent-cyan), var(--accent-lime), rgba(255,255,255,0.15)); }
.roadmap-item { padding: 3.5rem 2rem 2rem; background: transparent; border-left: 1px solid rgba(255,255,255,0.12); }
.roadmap-item::before { left: -4px; top: 18px; width: 8px; height: 8px; background: #080a0a; border: 1px solid var(--accent-cyan); transform: rotate(45deg); transition: box-shadow .3s ease, background .3s ease; }
.roadmap-item:hover::before { height: 8px; background: var(--accent-cyan); box-shadow: 0 0 18px rgba(86,230,255,.75); }

.cta-note { background: rgba(7,9,9,0.58); backdrop-filter: blur(16px); border-color: rgba(255,255,255,0.18); }
#cta .btn-container { justify-content: center; }

.reveal-ready {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.8s cubic-bezier(.2,.7,.2,1), transform 0.8s cubic-bezier(.2,.7,.2,1);
}
.reveal-ready.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1280px) {
    #hero { grid-template-columns: minmax(0, 1fr) minmax(400px, 520px); gap: 2.5rem; }
}

@media (max-width: 1120px) {
    #hero { grid-template-columns: minmax(0, 1fr) minmax(440px, 500px); gap: 1.5rem; }
    #hero h1 { font-size: clamp(2.8rem, 5vw, 4.2rem); }
    .site-diagram { height: 245px; }
    .nav-group-gap, .nav-group .nav-sep-dot, .nav-group li:has(.nav-sep-dot) { display: none; }
}

@media (max-width: 960px) {
    body::before { display: none; }
    nav { grid-template-columns: auto 1fr auto; padding: .65rem 1rem; }
    .nav-links-wrap { display: none; }
    .nav-actions { grid-column: 3; }
    .lang-toggle { top: .8rem !important; right: 11.4rem !important; }
    #hero { display: flex; min-height: auto; padding-top: 8.2rem; padding-bottom: 4rem; }
    .hero-copy { width: 100%; }
    #hero h1 { max-width: 650px; font-size: clamp(2.75rem, 10vw, 4.6rem); }
    .hero-console { width: min(100%, 540px); margin-top: 3.5rem; }
    .hero-index { display: none; }
    #manifesto { grid-template-columns: 1fr; gap: 2rem; }
    #manifesto .section-label { grid-column: auto; }
    .manifesto-visual { grid-column: auto; aspect-ratio: 16 / 9; }
    .product-gallery { grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; }
    .product-shot-main { grid-column: 1 / -1; grid-row: auto; aspect-ratio: 16 / 9; }
    .product-shot:not(.product-shot-main) { aspect-ratio: 16 / 10; }
    .stack-grid { grid-template-columns: repeat(2, 1fr); }
    .roadmap-grid { grid-template-columns: repeat(2, 1fr); }
    .roadmap-grid::before { display: none; }
    .roadmap-item { padding-top: 2.5rem; }
    .roadmap-item::before { top: 0; }
}

@media (max-width: 560px) {
    section { padding-left: 1.2rem; padding-right: 1.2rem; }
    .logo-img { max-width: 72px; height: 28px; }
    .nav-brand::after { font-size: 1.08rem; }
    .nav-actions { gap: 0.45rem; }
    .nav-cta { height: 1.62rem; min-height: 1.62rem; padding: .42rem .44rem !important; font-size: .52rem !important; }
    .nav-subscribe { min-width: 2.9rem; }
    .lang-toggle { right: 9.95rem !important; top: .72rem !important; }
    .lang-btn { min-width: 2.2rem; padding: .4rem .48rem; font-size: .62rem; }
    #hero { min-height: calc(100svh - 110px); padding-top: 5.8rem; padding-bottom: 1.2rem; }
    #hero .section-label { gap: .65rem; font-size: .58rem; line-height: 1.55; letter-spacing: .12em; }
    #hero .section-label::before { flex: 0 0 7px; }
    #hero .section-label::after { display: none; }
    #hero h1 { font-size: clamp(2.2rem, 10.5vw, 2.75rem); line-height: 1.01; }
    #hero .large-text { font-size: .92rem; line-height: 1.55; }
    #hero .hero-divider { margin: 1.5rem 0; }
    #hero .hero-copy > p:not(.large-text) { display: none; }
    #hero .hero-copy > .hero-brand-line { display: block; margin-top: 1rem; font-size: .78rem; line-height: 1.55; }
    #hero .hero-actions { margin-top: 1.35rem; }
    .btn-container { width: 100%; }
    .btn { width: 100%; }
    .hero-console { display: none; }
    .hero-video-console { display: block; width: 100%; margin-top: 2rem; }
    .site-diagram { height: 230px; }
    .site-boundary { inset: 55px 45px 42px 40px; }
    .console-metrics strong { font-size: 1.05rem; }
    #manifesto, #paradigm, #intelligence-stack, #human-ai, #product-stage, #roadmap, #cta { padding-top: 5rem; padding-bottom: 7rem; }
    #manifesto .large-text { padding-left: 1.2rem; }
    .manifesto-visual { aspect-ratio: 4 / 5; }
    .manifesto-tape { grid-template-columns: 1fr; }
    .manifesto-tape span { padding: .75rem 1rem; }
    .manifesto-tape span + span { border-left: 0; border-top: 1px solid rgba(255,255,255,0.1); }
    .paradigm-grid, .stack-grid, .roadmap-grid { grid-template-columns: 1fr; }
    .paradigm-signal { height: 145px; }
    .stack-item { min-height: 220px; }
    #human-ai { min-height: 64vh; }
    .human-metrics { grid-template-columns: 1fr; }
    .human-metrics span + span { border-left: 0; border-top: 1px solid rgba(255,255,255,0.12); }
    .product-gallery { grid-template-columns: 1fr; }
    .product-shot-main { grid-column: auto; }
    .product-shot, .product-shot:not(.product-shot-main) { aspect-ratio: 4 / 3; }
    .workflow-rail { grid-template-columns: 1fr 1fr; }
    .workflow-rail::before { display: none; }
    .workflow-rail span:nth-child(3) { border-left: 0; border-top: 1px solid rgba(255,255,255,0.1); }
    .workflow-rail span:nth-child(4) { border-top: 1px solid rgba(255,255,255,0.1); }
    .product-viewport { aspect-ratio: 4 / 3; background-size: 150%; }
    .product-viewport::after { right: 1rem; bottom: 1rem; font-size: .48rem; }
    footer { padding: 3rem 1.2rem; }
    footer { padding: 2.5rem 0 0; }
    footer .footer-nav { gap: 0.9rem 1.15rem; padding: 1.2rem; }
    footer .footer-nav .footer-sep { display: none; }
}

/* Media-led homepage rebuild */
.chapter-section {
    padding-top: 10rem;
    padding-bottom: 10rem;
}

.chapter-head {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(260px, 0.55fr);
    column-gap: 7vw;
    align-items: end;
    margin-bottom: 3.5rem;
}

.chapter-head .section-label { grid-column: 1 / -1; }
.chapter-head h2 { margin: 0; max-width: 960px; }
.chapter-head p { margin: 0 0 0.35rem; font-size: 0.95rem; line-height: 1.7; }
.chapter-head-compact h2 { grid-column: 1 / -1; }

#manifesto {
    display: block;
    padding-top: 10rem;
    padding-bottom: 10rem;
}

#manifesto .section-label { margin-bottom: 2rem; }

.media-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.16);
    background: #020303;
    box-shadow: 0 36px 90px rgba(0,0,0,0.34);
}

.media-frame img,
.media-frame video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    background: #020303;
}

.media-frame img { filter: saturate(0.88) contrast(1.04); }
.media-frame video { color-scheme: dark; }

.video-play-host { position: relative; }

.video-play-trigger {
    position: absolute;
    z-index: 9;
    top: 50%;
    left: 50%;
    width: 58px;
    height: 58px;
    padding: 0;
    transform: translate(-50%, -50%);
    border: 1px solid rgba(255,255,255,0.72);
    border-radius: 50%;
    background: rgba(3,8,9,0.76);
    box-shadow: 0 12px 38px rgba(0,0,0,0.42), 0 0 24px rgba(86,230,255,0.18);
    cursor: pointer;
    transition: opacity 180ms ease, transform 180ms ease, background-color 180ms ease;
}

.video-play-trigger span {
    position: absolute;
    top: 50%;
    left: 52%;
    width: 0;
    height: 0;
    transform: translate(-42%, -50%);
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 16px solid #fff;
}

.video-play-trigger:hover,
.video-play-trigger:focus-visible {
    background: rgba(8,20,22,0.94);
    outline: 2px solid rgba(86,230,255,0.8);
    outline-offset: 3px;
}

.video-play-host.is-playing .video-play-trigger {
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -50%) scale(0.88);
}

.video-seek-host { position: relative; }

.video-seekbar {
    position: absolute;
    z-index: 8;
    left: clamp(0.75rem, 2vw, 1.35rem);
    right: clamp(5.5rem, 12vw, 8rem);
    bottom: 0.95rem;
    height: 18px;
    display: flex;
    align-items: center;
    cursor: ew-resize;
    touch-action: none;
}

.video-seekbar::before {
    content: "";
    position: absolute;
    inset: -0.35rem -0.2rem;
    background: linear-gradient(180deg, transparent, rgba(2,4,4,0.76));
    opacity: 0.78;
}

.video-seekbar span {
    position: relative;
    width: 100%;
    height: 5px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.28);
    background: rgba(255,255,255,0.18);
}

.video-seekbar i {
    display: block;
    width: 100%;
    height: 100%;
    transform: scaleX(0);
    transform-origin: left center;
    background: linear-gradient(90deg, var(--accent-cyan), #b7ff64);
    box-shadow: 0 0 16px rgba(86,230,255,0.45);
}

.video-seekbar:hover span,
.video-seekbar.is-dragging span,
.video-seekbar:focus-visible span {
    height: 7px;
    border-color: rgba(255,255,255,0.58);
}

.video-seekbar:focus-visible {
    outline: 1px solid rgba(86,230,255,0.9);
    outline-offset: 2px;
}

.media-caption {
    position: absolute;
    z-index: 3;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 3.25rem 1.35rem 1.1rem;
    color: rgba(255,255,255,0.78);
    background: linear-gradient(transparent, rgba(2,4,4,0.92));
    font-size: 0.72rem;
    pointer-events: none;
}

.media-caption b {
    color: var(--accent-cyan);
    font: 500 0.58rem/1 Consolas, monospace;
    letter-spacing: 0.08em;
}

.video-frame .media-caption {
    left: 1rem;
    right: auto;
    bottom: 3.25rem;
    padding: 0.6rem 0.75rem;
    background: rgba(2,4,4,0.8);
    backdrop-filter: blur(8px);
}

.decision-flow {
    position: relative;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    margin-top: 1.5rem;
    border-top: 1px solid rgba(255,255,255,0.14);
    border-bottom: 1px solid rgba(255,255,255,0.14);
}

.decision-flow::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 8%;
    right: 8%;
    height: 1px;
    background: linear-gradient(90deg, var(--accent-cyan), var(--accent-lime));
    opacity: 0.32;
}

.decision-flow span {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 0.85rem;
    min-height: 76px;
    padding: 1rem 1.2rem;
    background: rgba(5,8,8,0.82);
}

.decision-flow span + span { border-left: 1px solid rgba(255,255,255,0.1); }
.decision-flow i { color: var(--accent-cyan); font: normal 0.58rem/1 Consolas, monospace; }
.decision-flow b { color: rgba(255,255,255,0.74); font-size: 0.74rem; font-weight: 400; }

.paradigm-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(310px, 0.65fr);
    gap: clamp(2rem, 5vw, 5rem);
    align-items: center;
}

.comparison-frame { align-self: start; }
.media-hud {
    position: absolute;
    z-index: 2;
    top: 1rem;
    left: 1rem;
    right: 1rem;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 1rem;
    color: rgba(255,255,255,0.8);
    font: 500 0.58rem/1 Consolas, monospace;
    letter-spacing: 0.08em;
    pointer-events: none;
}
.media-hud i { height: 1px; background: linear-gradient(90deg, rgba(255,183,74,0.65), rgba(86,230,255,0.7)); }

.paradigm-ledger { border-top: 1px solid rgba(255,255,255,0.14); }
.paradigm-ledger > div {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
    min-height: 118px;
    padding: 1.15rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.14);
}
.paradigm-ledger i { color: var(--accent-cyan); font: normal 0.58rem/1 Consolas, monospace; }
.paradigm-ledger span { display: block; min-width: 0; }
.paradigm-ledger small { display: block; margin-bottom: 0.45rem; color: rgba(255,255,255,0.34); font: 0.54rem/1 Consolas, monospace; text-transform: uppercase; }
.paradigm-ledger b,
.paradigm-ledger strong { display: block; color: rgba(255,255,255,0.7); font-size: 0.72rem; font-weight: 400; line-height: 1.45; }
.paradigm-ledger strong { color: #fff; }
.paradigm-ledger em { color: var(--accent-lime); font-style: normal; }

.stack-map {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(340px, 0.65fr);
    gap: clamp(2rem, 5vw, 5rem);
    align-items: start;
}

.stack-map-list {
    margin: 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid rgba(255,255,255,0.15);
}

.stack-map-list li {
    display: grid;
    grid-template-columns: 34px minmax(115px, 0.75fr) minmax(0, 1fr);
    align-items: center;
    gap: 0.9rem;
    min-height: 68px;
    padding: 0.85rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.12);
}

.stack-map-list i { color: var(--accent-cyan); font: normal 0.58rem/1 Consolas, monospace; }
.stack-map-list b { color: #fff; font-size: 0.78rem; font-weight: 400; }
.stack-map-list span { color: rgba(255,255,255,0.43); font-size: 0.68rem; line-height: 1.4; }

.judgment-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(330px, 0.65fr);
    gap: clamp(2rem, 5vw, 5rem);
    align-items: center;
}

.judgment-chain {
    position: relative;
    border-top: 1px solid rgba(255,255,255,0.14);
}

.judgment-chain::before {
    content: "";
    position: absolute;
    top: 2rem;
    bottom: 2rem;
    left: 21px;
    width: 1px;
    background: linear-gradient(var(--accent-cyan), var(--accent-lime));
    opacity: 0.42;
}

.judgment-step {
    position: relative;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 1rem;
    min-height: 112px;
    padding: 1.35rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.14);
}

.judgment-step > i {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    align-self: start;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(86,230,255,0.55);
    background: #070a0a;
    color: var(--accent-cyan);
    font: normal 0.58rem/1 Consolas, monospace;
}

.judgment-step b { display: block; margin-bottom: 0.55rem; color: #fff; font-size: 0.9rem; font-weight: 400; }
.judgment-step span { color: rgba(255,255,255,0.48); font-size: 0.72rem; line-height: 1.65; }

.value-framework {
    margin-top: 6rem;
    padding-top: 2.5rem;
    border-top: 1px solid rgba(255,255,255,0.18);
}

.value-framework-head {
    display: grid;
    grid-template-columns: minmax(260px, 0.65fr) minmax(0, 1fr);
    gap: 5vw;
    align-items: end;
    margin-bottom: 2.5rem;
}

.value-framework-head small { color: var(--accent-cyan); font: 0.58rem/1 Consolas, monospace; letter-spacing: 0.1em; }
.value-framework-head h3 { margin-top: 0.65rem; font-size: clamp(1.65rem, 2.8vw, 2.7rem); font-weight: 300; line-height: 1.1; }
.value-framework-head p { max-width: 620px; margin: 0; font-size: 0.9rem; }

.value-axis { border-top: 1px solid rgba(255,255,255,0.14); }
.value-axis-row {
    display: grid;
    grid-template-columns: 40px minmax(150px, 0.45fr) minmax(0, 1fr);
    align-items: center;
    gap: 1.2rem;
    min-height: 74px;
    padding: 1rem 1.2rem;
    border-bottom: 1px solid rgba(255,255,255,0.12);
    background: linear-gradient(90deg, rgba(86,230,255,0.055), transparent 48%);
    transition: background 0.3s ease;
}
.value-axis-row:hover { background: linear-gradient(90deg, rgba(86,230,255,0.12), rgba(183,255,100,0.035) 70%, transparent); }
.value-axis-row i { color: var(--accent-cyan); font: normal 0.58rem/1 Consolas, monospace; }
.value-axis-row b { color: #fff; font-size: 0.82rem; font-weight: 400; }
.value-axis-row span { color: rgba(255,255,255,0.48); font-size: 0.72rem; line-height: 1.45; }
.value-axis-row:nth-child(5),
.value-axis-row:nth-child(6) { background-image: linear-gradient(90deg, rgba(183,255,100,0.075), transparent 52%); }

#human-ai { min-height: 78vh; }
#human-ai::before { background-position: center 44%, center 44%; }
#human-ai h2 { max-width: 1180px; margin-left: auto; margin-right: auto; font-size: clamp(2.8rem, 5.4vw, 6rem); }

.responsibility-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: min(1080px, 100%);
    margin: 4.5rem auto 0;
    border-top: 1px solid rgba(255,255,255,0.18);
    border-bottom: 1px solid rgba(255,255,255,0.18);
    background: rgba(3,6,6,0.58);
    backdrop-filter: blur(18px);
    text-align: left;
}

.responsibility-panel { display: flex; flex-direction: column; padding: 2rem 2.25rem; }
.responsibility-panel + .responsibility-panel { border-left: 1px solid rgba(255,255,255,0.14); }
.responsibility-panel small { margin-bottom: 1.3rem; color: var(--accent-cyan); font: 0.58rem/1 Consolas, monospace; letter-spacing: 0.08em; }
.human-panel small { color: var(--accent-lime); }
.responsibility-panel > b { margin-bottom: 1rem; color: #fff; font-size: 1.05rem; font-weight: 400; }
.responsibility-panel > span { padding: 0.8rem 0; border-top: 1px solid rgba(255,255,255,0.1); color: rgba(255,255,255,0.58); font-size: 0.78rem; }

.evaluation-layers { margin-top: 1rem; }
.evaluation-layer {
    position: relative;
    padding: 2rem 2.5rem;
    border: 1px solid rgba(255,255,255,0.16);
    background: rgba(5,8,8,0.76);
    backdrop-filter: blur(14px);
}
.evaluation-layer + .evaluation-layer { margin-top: 1rem; }
.value-layer { width: 92%; margin-left: 8%; border-color: rgba(86,230,255,0.38); }
.baseline-layer { width: 84%; border-color: rgba(255,183,74,0.38); }
.evaluation-layer small { color: var(--accent-cyan); font: 0.58rem/1 Consolas, monospace; letter-spacing: 0.09em; }
.baseline-layer small { color: #ffb74a; }
.evaluation-layer h3 { margin: 0.8rem 0 1.4rem; font-size: clamp(1.35rem, 2.4vw, 2.25rem); font-weight: 300; }
.evaluation-layer > div { display: grid; grid-template-columns: repeat(6, 1fr); border-top: 1px solid rgba(255,255,255,0.12); }
.evaluation-layer > div span { padding: 0.9rem 0.7rem 0; color: rgba(255,255,255,0.55); font-size: 0.68rem; }
.evaluation-layer > div span + span { border-left: 1px solid rgba(255,255,255,0.1); }

.evidence-system { margin-top: 4rem; }
.evidence-grades {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid rgba(255,255,255,0.15);
    border-bottom: 1px solid rgba(255,255,255,0.15);
}
.evidence-grade { display: grid; grid-template-columns: 42px 1fr; gap: 0.4rem 1rem; padding: 1.5rem 1.25rem; }
.evidence-grade + .evidence-grade { border-left: 1px solid rgba(255,255,255,0.12); }
.evidence-grade i { grid-row: 1 / 3; display: grid; place-items: center; align-self: center; width: 38px; height: 38px; border: 1px solid rgba(86,230,255,0.5); color: var(--accent-cyan); font: normal 0.8rem/1 Consolas, monospace; }
.evidence-grade:nth-child(2) i { border-color: rgba(183,255,100,0.5); color: var(--accent-lime); }
.evidence-grade:nth-child(3) i { border-color: rgba(255,183,74,0.5); color: #ffb74a; }
.evidence-grade b { color: #fff; font-size: 0.75rem; font-weight: 400; }
.evidence-grade span { color: rgba(255,255,255,0.42); font-size: 0.64rem; line-height: 1.45; }

.maturity-scale {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    margin-top: 2rem;
    border: 1px solid rgba(255,255,255,0.13);
}
.maturity-scale::before { content: ""; position: absolute; top: 50%; left: 10%; right: 10%; height: 1px; background: linear-gradient(90deg, rgba(255,183,74,0.55), var(--accent-cyan), var(--accent-lime)); }
.maturity-scale span { position: relative; z-index: 1; display: flex; align-items: center; gap: 0.75rem; min-height: 66px; padding: 0.85rem 1rem; background: rgba(5,8,8,0.9); }
.maturity-scale span + span { border-left: 1px solid rgba(255,255,255,0.1); }
.maturity-scale i { display: grid; place-items: center; width: 28px; height: 28px; flex: 0 0 28px; border: 1px solid rgba(255,255,255,0.25); color: rgba(255,255,255,0.65); font: normal 0.58rem/1 Consolas, monospace; }
.maturity-scale b { color: rgba(255,255,255,0.7); font-size: 0.68rem; font-weight: 400; }

.motion-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
}

.motion-feature { min-width: 0; }
.motion-feature figcaption {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.1rem 0.15rem 0;
    color: rgba(255,255,255,0.58);
    font-size: 0.72rem;
}
.motion-feature figcaption b { color: var(--accent-cyan); font: 500 0.58rem/1 Consolas, monospace; letter-spacing: 0.07em; }

#product-stage .workflow-rail { margin-top: 3rem; }

@media (max-width: 960px) {
    .chapter-section { padding-top: 7rem; padding-bottom: 7rem; }
    .chapter-head { grid-template-columns: 1fr; gap: 1.25rem; margin-bottom: 2.5rem; }
    .chapter-head .section-label { grid-column: auto; }
    .chapter-head-compact h2 { grid-column: auto; }
    .paradigm-layout,
    .stack-map,
    .judgment-layout { grid-template-columns: 1fr; }
    .stack-map-visual { max-width: none; }
    .motion-grid { grid-template-columns: 1fr; gap: 3rem; }
    .value-framework-head { grid-template-columns: 1fr; gap: 1rem; }
    .evaluation-layer,
    .value-layer,
    .baseline-layer { width: 100%; margin-left: 0; }
    .evaluation-layer > div { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 560px) {
    .chapter-section,
    #manifesto { padding-top: 5rem; padding-bottom: 6rem; }
    .chapter-head { margin-bottom: 2rem; }
    .chapter-head h2 { font-size: 2rem; line-height: 1.1; }
    .chapter-head p { font-size: 0.82rem; }
    .media-frame { aspect-ratio: 16 / 9; }
    .media-caption { padding: 2.6rem 0.8rem 0.75rem; font-size: 0.62rem; }
    .media-caption b { font-size: 0.5rem; }
    .video-frame .media-caption { display: none; }
    .decision-flow { grid-template-columns: 1fr 1fr; }
    .decision-flow::before { display: none; }
    .decision-flow span { min-height: 60px; padding: 0.8rem; }
    .decision-flow span:nth-child(odd) { border-left: 0; }
    .decision-flow span:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,0.1); }
    .media-hud { top: 0.7rem; left: 0.7rem; right: 0.7rem; font-size: 0.48rem; }
    .paradigm-ledger > div { grid-template-columns: 24px 1fr; gap: 0.55rem 0.75rem; min-height: 0; }
    .paradigm-ledger em { display: none; }
    .paradigm-ledger strong { grid-column: 2; padding-top: 0.55rem; border-top: 1px solid rgba(183,255,100,0.18); }
    .stack-map-list li { grid-template-columns: 28px minmax(96px, 0.75fr) 1fr; gap: 0.6rem; }
    .stack-map-list span { font-size: 0.62rem; }
    .judgment-step { min-height: 0; }
    .value-framework { margin-top: 4rem; }
    .value-axis-row { grid-template-columns: 28px minmax(92px, 0.55fr) minmax(0, 1fr); gap: 0.65rem; padding: 0.85rem 0.45rem; }
    .value-axis-row b { font-size: 0.7rem; }
    .value-axis-row span { font-size: 0.62rem; }
    #human-ai { min-height: 68vh; }
    #human-ai h2 { font-size: clamp(2.2rem, 10vw, 3.2rem); }
    .responsibility-split { grid-template-columns: 1fr; margin-top: 3rem; }
    .responsibility-panel { padding: 1.5rem 1.25rem; }
    .responsibility-panel + .responsibility-panel { border-left: 0; border-top: 1px solid rgba(255,255,255,0.14); }
    .evaluation-layer { padding: 1.5rem 1.1rem; }
    .evaluation-layer > div { grid-template-columns: repeat(2, 1fr); }
    .evaluation-layer > div span:nth-child(odd) { border-left: 0; }
    .evidence-grades { grid-template-columns: 1fr; }
    .evidence-grade + .evidence-grade { border-left: 0; border-top: 1px solid rgba(255,255,255,0.12); }
    .maturity-scale span { justify-content: center; flex-direction: column; gap: 0.4rem; min-width: 0; padding: 0.7rem 0.25rem; text-align: center; }
    .maturity-scale b { font-size: 0.55rem; }
    .motion-grid { gap: 2.5rem; }
    .motion-feature figcaption { align-items: flex-start; flex-direction: column; gap: 0.45rem; }
}

/* Visual product story */
.story-heading {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.55fr);
    column-gap: 7vw;
    align-items: end;
    margin-bottom: 3.5rem;
}
.story-heading .section-label { grid-column: 1 / -1; }
.story-heading h2 { max-width: 980px; margin: 0; font-size: clamp(2.8rem, 5vw, 5.4rem); line-height: 1.02; }
.story-heading p { max-width: 560px; margin: 0 0 0.35rem; font-size: 0.95rem; line-height: 1.7; }
.story-heading-wide h2 { max-width: 1100px; }

.freedom-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.45fr);
    gap: 1.5rem;
    align-items: stretch;
}
.freedom-visual { min-height: 0; }
.software-shift {
    display: grid;
    grid-template-rows: 1fr auto 1fr;
    border-top: 1px solid rgba(255,255,255,0.16);
    border-bottom: 1px solid rgba(255,255,255,0.16);
    background: rgba(3,6,6,0.68);
}
.software-before,
.software-after { display: flex; flex-direction: column; justify-content: center; padding: 1.5rem; }
.software-shift small { color: rgba(255,255,255,0.36); font: 0.56rem/1 Consolas, monospace; letter-spacing: 0.08em; }
.software-shift b { margin: 0.7rem 0 1rem; color: rgba(255,255,255,0.72); font-size: 0.82rem; font-weight: 400; }
.software-before span { display: inline-block; padding: 0.35rem 0; border-top: 1px solid rgba(255,255,255,0.08); color: rgba(255,255,255,0.32); font: 0.56rem/1.2 Consolas, monospace; }
.software-after { background: linear-gradient(135deg, rgba(86,230,255,0.1), rgba(183,255,100,0.035)); }
.software-after strong { margin: 0.75rem 0 0.2rem; color: #fff; font: 400 clamp(1.65rem, 3vw, 2.6rem)/1 Inter, sans-serif; }
.software-after b { color: var(--accent-lime); }
.shift-arrow { display: grid; place-items: center; height: 42px; border-top: 1px solid rgba(255,255,255,0.1); border-bottom: 1px solid rgba(255,255,255,0.1); color: var(--accent-cyan); }

.freedom-gains {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 1.5rem;
    border-top: 1px solid rgba(255,255,255,0.14);
    border-bottom: 1px solid rgba(255,255,255,0.14);
}
.freedom-gains span { display: flex; align-items: center; gap: 0.9rem; min-height: 68px; padding: 1rem 1.2rem; background: rgba(4,7,7,0.74); }
.freedom-gains span + span { border-left: 1px solid rgba(255,255,255,0.1); }
.freedom-gains i { color: var(--accent-cyan); font: normal 0.56rem/1 Consolas, monospace; }
.freedom-gains b { color: rgba(255,255,255,0.68); font-size: 0.72rem; font-weight: 400; }

.workflow-film { width: 100%; }
.workflow-media { width: 100%; min-width: 0; }
.workflow-caption {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 52px;
    padding: 0.8rem 1rem;
    border: 1px solid rgba(255,255,255,0.16);
    border-top: 0;
    background: rgba(4,7,7,0.9);
    color: rgba(255,255,255,0.72);
    font-size: 0.72rem;
}
.workflow-caption b {
    color: var(--accent-cyan);
    font: 500 0.58rem/1 Consolas, monospace;
    letter-spacing: 0.08em;
}
.workflow-nine {
    display: grid;
    grid-template-columns: repeat(9, 1fr);
    margin: 1.5rem 0 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid rgba(255,255,255,0.14);
    border-bottom: 1px solid rgba(255,255,255,0.14);
}
.workflow-nine li { position: relative; min-width: 0; min-height: 94px; padding: 1rem 0.7rem; background: rgba(4,7,7,0.8); }
.workflow-nine li + li { border-left: 1px solid rgba(255,255,255,0.1); }
.workflow-nine li::after { content: ""; position: absolute; left: 0.7rem; right: 0.7rem; bottom: 0; height: 2px; background: var(--accent-cyan); opacity: 0.42; }
.workflow-nine li:nth-child(3n+2)::after { background: var(--accent-lime); }
.workflow-nine li:nth-child(3n)::after { background: #ffb74a; }
.workflow-nine i { display: block; margin-bottom: 1rem; color: var(--accent-cyan); font: normal 0.54rem/1 Consolas, monospace; }
.workflow-nine b { display: block; color: rgba(255,255,255,0.68); font-size: 0.66rem; font-weight: 400; line-height: 1.35; }

.speed-stage {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.45fr);
    gap: 1.5rem;
    align-items: stretch;
}
.speed-claim {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(1.5rem, 3vw, 2.5rem);
    border-top: 1px solid rgba(86,230,255,0.38);
    border-bottom: 1px solid rgba(183,255,100,0.35);
    background: rgba(4,7,7,0.76);
}
.speed-claim small { color: var(--accent-cyan); font: 0.58rem/1 Consolas, monospace; letter-spacing: 0.08em; }
.speed-claim strong { margin-top: 1.1rem; color: #fff; font: 300 clamp(3.2rem, 7vw, 6.2rem)/0.9 Inter, sans-serif; }
.speed-claim b { margin: 0.7rem 0 1.5rem; color: var(--accent-lime); font: 500 0.7rem/1 Consolas, monospace; }
.speed-claim span { color: rgba(255,255,255,0.5); font-size: 0.75rem; line-height: 1.65; }

.speed-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 3rem;
}
.speed-gallery figure { min-width: 0; }
.speed-gallery figcaption,
.showcase-tile figcaption { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: 0.9rem 0.1rem 0; color: rgba(255,255,255,0.48); font-size: 0.66rem; }
.speed-gallery figcaption b,
.showcase-tile figcaption b { color: var(--accent-cyan); font: 500 0.54rem/1 Consolas, monospace; letter-spacing: 0.07em; }

.creativity-section { min-height: 82vh; }
.creativity-section::before { background-image: linear-gradient(90deg, rgba(5,8,8,0.88), rgba(5,8,8,0.48) 58%, rgba(5,8,8,0.78)), var(--section-bg); }
.creativity-section h2 { max-width: 1120px; margin: 0 auto; font-size: clamp(3rem, 6vw, 6.5rem); line-height: 0.98; }
.creativity-line { margin: 2rem auto 0 !important; color: rgba(255,255,255,0.64); font-size: 0.95rem; }
.creative-focus {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    width: min(820px, 100%);
    margin: 4rem auto 0;
    border-top: 1px solid rgba(255,255,255,0.18);
    border-bottom: 1px solid rgba(255,255,255,0.18);
    background: rgba(3,6,6,0.55);
    backdrop-filter: blur(16px);
}
.creative-focus span { display: flex; align-items: center; justify-content: center; gap: 0.8rem; min-height: 72px; padding: 1rem; }
.creative-focus span + span { border-left: 1px solid rgba(255,255,255,0.12); }
.creative-focus i { color: var(--accent-cyan); font: normal 0.54rem/1 Consolas, monospace; }
.creative-focus b { color: rgba(255,255,255,0.74); font-size: 0.72rem; font-weight: 400; }

.showcase-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3rem 1.5rem;
}
.showcase-tile { min-width: 0; }
.product-claim {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 2rem;
    margin-top: 4rem;
    padding: 1.7rem 0;
    border-top: 1px solid rgba(255,255,255,0.16);
    border-bottom: 1px solid rgba(255,255,255,0.16);
}
.product-claim small { color: var(--accent-cyan); font: 0.56rem/1 Consolas, monospace; letter-spacing: 0.08em; }
.product-claim strong { color: #fff; font-size: clamp(1rem, 2.2vw, 1.7rem); font-weight: 300; line-height: 1.35; }

.bim-stage {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.45fr);
    gap: 1.5rem;
    align-items: stretch;
}
.bim-modules {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid rgba(255,255,255,0.15);
    border-left: 1px solid rgba(255,255,255,0.15);
}
.bim-modules span {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 0;
    overflow: hidden;
    padding: 1.3rem;
    border-right: 1px solid rgba(255,255,255,0.15);
    border-bottom: 1px solid rgba(255,255,255,0.15);
    background: #050909;
    cursor: pointer;
}
.bim-modules span::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(2,6,7,0.38) 0%, transparent 34%, transparent 57%, rgba(2,5,6,0.9) 100%);
    box-shadow: inset 0 0 42px rgba(0,0,0,0.2);
}
.bim-modules span::before {
    content: "PLAY";
    position: absolute;
    right: 0.9rem;
    top: 0.82rem;
    z-index: 2;
    padding: 0.22rem 0.38rem;
    border: 1px solid rgba(86,230,255,0.34);
    color: rgba(86,230,255,0.72);
    background: rgba(4,8,9,0.56);
    font: 0.46rem/1 Consolas, monospace;
    letter-spacing: 0.08em;
    opacity: 0.72;
}
.bim-modules span[aria-pressed="true"]::before {
    content: "PAUSE";
    border-color: rgba(183,255,100,0.4);
    color: rgba(183,255,100,0.78);
}
.bim-modules span:focus-visible {
    outline: 1px solid rgba(86,230,255,0.75);
    outline-offset: -2px;
}
.bim-motion {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    background: #050909;
}
.bim-modules i,
.bim-modules b { position: relative; z-index: 2; }
.bim-modules i { color: var(--accent-cyan); font: normal 0.56rem/1 Consolas, monospace; text-shadow: 0 1px 8px rgba(0,0,0,0.9); }
.bim-modules b { color: rgba(255,255,255,0.82); font-size: 0.72rem; font-weight: 400; line-height: 1.4; text-shadow: 0 2px 12px rgba(0,0,0,0.95); }
.bim-modules span:hover .bim-motion { filter: brightness(1.08) saturate(1.08); }
.roadmap-inline-cta {
    width: fit-content;
    margin-top: 1.5rem;
}
.bim-partner-band {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 2rem;
    align-items: center;
    margin-top: 1.5rem;
    padding: 1.6rem 1.8rem;
    border: 1px solid rgba(183,255,100,0.25);
    background: linear-gradient(90deg, rgba(183,255,100,0.075), rgba(86,230,255,0.035));
}
.bim-partner-band small { color: var(--accent-lime); font: 0.55rem/1 Consolas, monospace; letter-spacing: 0.08em; }
.bim-partner-band strong { color: rgba(255,255,255,0.76); font-size: 0.9rem; font-weight: 400; line-height: 1.45; }

.bim-status {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-left: 0.75rem;
    color: var(--accent-cyan);
    font: normal 0.58rem/1.2 "SFMono-Regular", Consolas, monospace;
    letter-spacing: 0.08em;
    vertical-align: middle;
    white-space: nowrap;
}

.bim-status::before {
    content: "";
    width: 22px;
    height: 1px;
    background: var(--accent-cyan);
    opacity: 0.7;
}

@media (max-width: 960px) {
    .story-heading { grid-template-columns: 1fr; gap: 1.2rem; margin-bottom: 2.5rem; }
    .story-heading .section-label { grid-column: auto; }
    .freedom-layout,
    .speed-stage,
    .bim-stage { grid-template-columns: 1fr; }
    .software-shift { grid-template-columns: 1fr auto 1fr; grid-template-rows: auto; }
    .shift-arrow { width: 42px; height: auto; border: 0; border-left: 1px solid rgba(255,255,255,0.1); border-right: 1px solid rgba(255,255,255,0.1); }
    .workflow-nine { grid-template-columns: repeat(3, 1fr); }
    .workflow-nine li:nth-child(4),
    .workflow-nine li:nth-child(7) { border-left: 0; }
    .workflow-nine li:nth-child(n+4) { border-top: 1px solid rgba(255,255,255,0.1); }
    .bim-modules span { min-height: 130px; }
}

@media (max-width: 560px) {
    .story-heading h2 { font-size: 2.15rem; line-height: 1.06; }
    .story-heading p { font-size: 0.82rem; }
    .software-shift { grid-template-columns: 1fr; }
    .shift-arrow { width: auto; height: 38px; border-left: 0; border-right: 0; border-top: 1px solid rgba(255,255,255,0.1); border-bottom: 1px solid rgba(255,255,255,0.1); }
    .freedom-gains { grid-template-columns: 1fr; }
    .freedom-gains span + span { border-left: 0; border-top: 1px solid rgba(255,255,255,0.1); }
    .workflow-nine li { min-height: 82px; padding: 0.8rem 0.55rem; }
    .workflow-nine i { margin-bottom: 0.7rem; }
    .speed-gallery,
    .showcase-grid { grid-template-columns: 1fr; }
    .speed-claim strong { font-size: 3.8rem; }
    .speed-gallery figcaption,
    .showcase-tile figcaption { align-items: flex-start; flex-direction: column; gap: 0.4rem; }
    .creativity-section h2 { font-size: 2.55rem; }
    .creative-focus { grid-template-columns: 1fr; }
    .creative-focus span + span { border-left: 0; border-top: 1px solid rgba(255,255,255,0.12); }
    .product-claim,
    .bim-partner-band { grid-template-columns: 1fr; gap: 0.8rem; }
    .bim-modules span { min-height: 110px; padding: 1rem; }
}

/* Flagship hero composition */
#hero {
    width: 100%;
    max-width: none;
    min-height: max(780px, 92svh);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: clamp(8rem, 12vh, 10rem) clamp(2.5rem, 4vw, 5rem) clamp(4.5rem, 7vh, 6.5rem);
}

#hero .hero-copy {
    width: min(48vw, 780px);
    max-width: 780px;
    z-index: 5;
}

#hero .section-label {
    margin-bottom: clamp(2.4rem, 4vh, 3.5rem);
}

#hero h1 {
    max-width: none;
    margin-bottom: 0;
    font-size: clamp(4.8rem, 5.75vw, 7.35rem);
    line-height: 0.92;
}

#hero .hero-title-lead {
    margin-bottom: 0.2em;
    font-size: 0.64em;
}

#hero h1 [data-lang="en"] .hero-title-lead {
    font-size: 0.48em;
}

#hero h1 [data-lang="en"] .hero-title-focus {
    font-size: 0.58em;
    line-height: 1.02;
}

#hero .hero-divider {
    width: 120px;
    margin: clamp(2.25rem, 4vh, 3rem) 0 clamp(1.8rem, 3vh, 2.4rem);
}

#hero .large-text {
    max-width: 720px;
    font-size: clamp(1rem, 1.15vw, 1.35rem);
    line-height: 1.72;
}

#hero .hero-brand-line {
    margin-top: 1.35rem;
}

#hero .hero-video-console {
    position: absolute;
    top: 50%;
    right: clamp(1.5rem, 3vw, 4rem);
    z-index: 2;
    width: min(66vw, 1220px);
    max-width: none;
    border: 0;
    outline: 1px solid rgba(255,255,255,0.16);
    background: transparent;
    box-shadow: 0 55px 150px rgba(0,0,0,0.62);
    backdrop-filter: none;
    transform: translateY(-45%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,0.72) 11%, #000 23%, #000 100%);
    mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,0.72) 11%, #000 23%, #000 100%);
}

#hero .hero-video-console::before,
#hero .hero-video-console::after {
    display: none;
}

#hero .hero-bg img {
    opacity: 0.76;
    filter: grayscale(0.5) contrast(1.16) brightness(0.88);
}

#hero .hero-bg::after {
    background:
        linear-gradient(90deg, rgba(7,9,9,0.98) 0%, rgba(7,9,9,0.9) 27%, rgba(7,9,9,0.38) 54%, rgba(7,9,9,0.36) 100%),
        linear-gradient(180deg, rgba(7,9,9,0.08) 0%, transparent 27%, transparent 68%, #070909 100%);
}

@media (max-width: 1360px) and (min-width: 961px) {
    #hero {
        padding-right: clamp(2rem, 3.5vw, 3.5rem);
        padding-left: clamp(2rem, 3.5vw, 3.5rem);
    }

    #hero .hero-copy {
        width: min(47vw, 640px);
    }

    #hero .hero-video-console {
        right: clamp(1.5rem, 3vw, 2.5rem);
        width: min(64vw, 870px);
    }

    #hero h1 {
        font-size: clamp(4rem, 6.2vw, 5.4rem);
    }
}

@media (max-width: 960px) {
    #hero {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        min-height: auto;
        gap: 0;
        padding: 7.5rem clamp(1.5rem, 5vw, 3rem) 5rem;
    }

    #hero h1 {
        max-width: 760px;
        font-size: clamp(3.2rem, 10vw, 4.8rem);
    }

    #hero .hero-video-console {
        position: relative;
        top: auto;
        right: auto;
        width: 100%;
        max-width: none;
        margin-top: 3rem;
        transform: none;
        -webkit-mask-image: none;
        mask-image: none;
    }

    #hero .hero-copy {
        width: 100%;
    }
}

@media (max-width: 560px) {
    #hero {
        min-height: auto;
        padding: 6.5rem 1.2rem 3rem;
    }

    #hero .section-label {
        margin-bottom: 1.8rem;
    }

    #hero h1 {
        font-size: clamp(2.55rem, 11vw, 3.25rem);
    }

    #hero .hero-title-lead {
        font-size: 0.68em;
    }

    #hero .hero-divider {
        width: 84px;
        margin: 1.8rem 0 1.5rem;
    }

    #hero .large-text {
        font-size: 0.94rem;
        line-height: 1.62;
    }

    #hero .hero-video-console {
        margin-top: 2.25rem;
    }
}

/* Four-part homepage narrative */
#paradigm,
#intelligence-stack,
#roadmap {
    padding-top: clamp(7rem, 10vw, 9rem);
    padding-bottom: clamp(7rem, 10vw, 9rem);
    background: transparent !important;
}

#paradigm::before,
#intelligence-stack::before,
#roadmap::before {
    filter: none;
    background-image:
        linear-gradient(90deg, rgba(7,9,9,0.98) 0%, rgba(7,9,9,0.9) 27%, rgba(7,9,9,0.38) 54%, rgba(7,9,9,0.36) 100%),
        linear-gradient(180deg, rgba(7,9,9,0.08) 0%, transparent 27%, transparent 68%, #070909 100%),
        linear-gradient(rgba(7,9,9,0.24), rgba(7,9,9,0.24)),
        var(--section-bg);
    background-size: cover, cover, cover, cover;
    background-position: center center, center center, center center, center center;
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
}

.workflow-gains {
    margin-top: 1.5rem;
}

.roadmap-cta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: clamp(2rem, 5vw, 6rem);
    align-items: center;
    margin-top: clamp(4rem, 7vw, 7rem);
    padding: clamp(2rem, 4vw, 3.5rem) 0;
    border-top: 1px solid rgba(255,255,255,0.18);
    border-bottom: 1px solid rgba(255,255,255,0.18);
}

.roadmap-cta small {
    color: var(--accent-cyan);
    font: 0.58rem/1 "SFMono-Regular", Consolas, monospace;
    letter-spacing: 0.12em;
}

.roadmap-cta h3 {
    margin: 0.8rem 0 0.7rem;
    color: #fff;
    font-size: clamp(1.9rem, 3.6vw, 3.4rem);
    font-weight: 300;
    line-height: 1.08;
    letter-spacing: 0;
}

.roadmap-cta p {
    max-width: 720px;
    color: rgba(255,255,255,0.58);
    font-size: 0.92rem;
    line-height: 1.7;
}

.roadmap-cta .btn {
    min-width: 190px;
}

@media (max-width: 720px) {
    .roadmap-cta {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .roadmap-cta .btn {
        width: 100%;
    }
}

@media (max-width: 560px) {
    #paradigm .story-heading h2 {
        font-size: 1.95rem;
        line-height: 1.08;
    }
}

@media (min-width: 961px) {
    html {
        scroll-snap-type: y proximity;
    }

    #hero,
    #paradigm,
    #intelligence-stack,
    #roadmap {
        height: max(700px, 100svh);
        min-height: 0;
        overflow: hidden;
        scroll-snap-align: start;
    }

    #hero {
        padding-top: clamp(5rem, 10svh, 7rem);
        padding-bottom: clamp(2rem, 4svh, 3.5rem);
    }

    #paradigm,
    #intelligence-stack,
    #roadmap {
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding-top: clamp(4.5rem, 7svh, 6rem);
        padding-bottom: clamp(2rem, 4svh, 3.5rem);
    }

    #paradigm .story-heading,
    #intelligence-stack .story-heading,
    #roadmap .story-heading {
        margin-bottom: clamp(1rem, 2svh, 1.75rem);
    }

    #paradigm .story-heading .section-label,
    #intelligence-stack .story-heading .section-label,
    #roadmap .story-heading .section-label {
        margin-bottom: clamp(0.8rem, 1.5svh, 1.25rem);
    }

    #paradigm .story-heading h2,
    #intelligence-stack .story-heading h2,
    #roadmap .story-heading h2 {
        font-size: clamp(2.5rem, 4.4vw, 4.8rem);
    }

    #paradigm .story-heading p,
    #intelligence-stack .story-heading p,
    #roadmap .story-heading p {
        font-size: 0.86rem;
        line-height: 1.55;
    }

    #paradigm .workflow-media {
        width: min(100%, 68svh, 980px);
        margin-right: auto;
        margin-left: auto;
    }

    #intelligence-stack .workflow-nine {
        margin-top: clamp(0.75rem, 1.5svh, 1.2rem);
    }

    #intelligence-stack .workflow-nine li {
        min-height: clamp(64px, 9svh, 84px);
        padding: 0.7rem 0.55rem;
    }

    #intelligence-stack .workflow-nine i {
        margin-bottom: 0.6rem;
    }

    #paradigm .workflow-gains,
    #intelligence-stack .speed-gallery,
    #roadmap .bim-partner-band {
        display: none;
    }

    #intelligence-stack .speed-stage {
        height: min(46svh, 520px);
    }

    #intelligence-stack .speed-main-visual {
        height: 100%;
        aspect-ratio: auto;
    }

    #intelligence-stack .speed-claim {
        padding: clamp(1.2rem, 2.5vw, 2rem);
    }

    #intelligence-stack .speed-claim strong {
        font-size: clamp(2.6rem, 6svh, 5.2rem);
    }

    #roadmap .bim-stage {
        height: min(34svh, 430px);
    }

    #roadmap .bim-visual {
        height: 100%;
        aspect-ratio: auto;
    }

    #roadmap .bim-modules span {
        padding: 0.9rem;
    }

    #roadmap .roadmap-cta {
        margin-top: clamp(1rem, 2svh, 1.75rem);
        padding: clamp(1rem, 2svh, 1.75rem) 0;
    }

    #roadmap .roadmap-cta h3 {
        margin: 0.55rem 0 0.45rem;
        font-size: clamp(1.7rem, 3vw, 2.8rem);
    }

    #roadmap .roadmap-cta p {
        font-size: 0.82rem;
        line-height: 1.5;
    }
}

@media (min-width: 961px) {
    #paradigm,
    #intelligence-stack,
    #roadmap {
        width: 100%;
        max-width: none;
        display: grid;
        grid-template-columns: minmax(360px, 0.78fr) minmax(0, 1.22fr);
        grid-template-rows: minmax(0, 1fr) auto;
        column-gap: clamp(2rem, 4vw, 5rem);
        row-gap: clamp(0.9rem, 2svh, 1.5rem);
        align-items: center;
    }

    #paradigm .story-heading,
    #intelligence-stack .story-heading,
    #roadmap .story-heading {
        position: relative;
        z-index: 3;
        display: block;
        grid-column: 1;
        grid-row: 1;
        width: 100%;
        margin: 0;
        align-self: center;
    }

    #paradigm .story-heading .section-label,
    #intelligence-stack .story-heading .section-label,
    #roadmap .story-heading .section-label {
        margin-bottom: clamp(1.5rem, 3svh, 2.5rem);
    }

    #paradigm .story-heading h2,
    #intelligence-stack .story-heading h2,
    #roadmap .story-heading h2 {
        max-width: 620px;
        font-size: clamp(3.2rem, 4.8vw, 5.7rem);
        line-height: 0.98;
    }

    #paradigm .story-heading h2 {
        font-size: clamp(2.8rem, 4vw, 4.6rem);
        line-height: 1.04;
    }

    #paradigm .story-heading p,
    #intelligence-stack .story-heading p,
    #roadmap .story-heading p {
        max-width: 520px;
        margin-top: clamp(1.7rem, 3.5svh, 3rem);
        color: rgba(255,255,255,0.68);
        font-size: clamp(0.88rem, 1vw, 1.05rem);
        line-height: 1.65;
    }

    #paradigm .workflow-media {
        grid-column: 2;
        grid-row: 1;
        position: relative;
        z-index: 2;
        width: min(66vw, 1220px);
        max-width: none;
        margin: 0;
        justify-self: end;
        align-self: center;
    }

    #paradigm .workflow-caption {
        grid-template-columns: auto minmax(170px, 1fr);
        gap: 1rem;
        width: min(62%, 560px);
        min-height: 66px;
        margin-top: clamp(0.65rem, 1.2svh, 0.9rem);
        margin-left: auto;
        padding: 0.75rem 1rem;
        border-top: 1px solid rgba(255,255,255,0.16);
        background: rgba(4,7,7,0.88);
        box-shadow: 0 12px 36px rgba(0,0,0,0.34);
        backdrop-filter: blur(14px);
    }

    #paradigm .workflow-caption b {
        align-self: center;
        font-size: 0.58rem;
    }

    #paradigm .workflow-caption span {
        align-self: center;
        padding-left: 1rem;
        border-left: 1px solid rgba(255,255,255,0.14);
        font-size: 0.68rem;
        line-height: 1.45;
    }

    #intelligence-stack .workflow-nine {
        grid-column: 1 / -1;
        grid-row: 2;
        margin: 0;
        transform: translateY(8px);
    }

    #paradigm {
        grid-template-rows: minmax(0, 1fr);
    }

    #roadmap {
        grid-template-rows: minmax(0, 1fr);
    }

    #intelligence-stack .speed-stage {
        position: relative;
        z-index: 2;
        grid-column: 2;
        grid-row: 1;
        display: block;
        width: min(66vw, 1220px);
        max-width: none;
        height: auto;
        aspect-ratio: 2 / 1;
        justify-self: end;
        align-self: center;
    }

    #intelligence-stack .speed-main-visual {
        width: 100%;
        height: 100%;
    }

    #intelligence-stack .speed-claim {
        position: absolute;
        top: calc(100% + clamp(0.65rem, 1.2svh, 0.9rem));
        right: 0;
        bottom: auto;
        z-index: 3;
        display: grid;
        grid-template-columns: auto auto minmax(170px, 1fr);
        grid-template-rows: auto auto;
        gap: 0.3rem 1rem;
        width: min(62%, 560px);
        padding: 0.55rem 1rem;
        border: 1px solid rgba(255,255,255,0.16);
        background: rgba(4,7,7,0.88);
        box-shadow: 0 12px 36px rgba(0,0,0,0.34);
        backdrop-filter: blur(14px);
    }

    #intelligence-stack .speed-claim small {
        grid-column: 1 / 3;
        grid-row: 1;
    }

    #intelligence-stack .speed-claim strong {
        grid-column: 1;
        grid-row: 2;
        margin: 0;
        font-size: clamp(1.8rem, 3svh, 2.6rem);
    }

    #intelligence-stack .speed-claim b {
        grid-column: 2;
        grid-row: 2;
        align-self: center;
        margin: 0;
        white-space: nowrap;
    }

    #intelligence-stack .speed-claim span {
        grid-column: 3;
        grid-row: 1 / 3;
        align-self: center;
        padding-left: 1rem;
        border-left: 1px solid rgba(255,255,255,0.14);
        font-size: 0.68rem;
        line-height: 1.45;
    }

    #roadmap .bim-stage {
        position: relative;
        z-index: 2;
        grid-column: 2;
        grid-row: 1;
        width: min(46vw, 820px);
        max-width: none;
        height: auto;
        aspect-ratio: 4 / 3;
        grid-template-columns: 1fr;
        justify-self: end;
        align-self: center;
    }

    #roadmap .bim-modules {
        width: 100%;
        height: 100%;
    }

    #paradigm .workflow-film,
    #intelligence-stack .speed-main-visual {
        -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,0.72) 11%, #000 23%, #000 93%, rgba(0,0,0,0.2) 100%);
        mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,0.72) 11%, #000 23%, #000 93%, rgba(0,0,0,0.2) 100%);
    }

    #roadmap .roadmap-cta {
        grid-column: 1 / -1;
        grid-row: 2;
        margin-top: 0;
    }
}

@media (min-width: 961px) and (max-width: 1360px) {
    #paradigm .workflow-media,
    #intelligence-stack .speed-stage {
        width: min(64vw, 870px);
    }

    #roadmap .bim-stage {
        width: min(46vw, 660px);
    }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
    .reveal-ready { opacity: 1; transform: none; }
}