:root {
    --studio-bg: #05050b;
    --studio-bg-soft: #0c0c18;
    --studio-panel: rgba(12, 13, 26, 0.84);
    --studio-panel-solid: #0f1020;
    --studio-panel-strong: #17172b;
    --studio-line: rgba(142, 151, 210, 0.2);
    --studio-line-strong: rgba(172, 183, 245, 0.34);
    --studio-text: #f1f2ff;
    --studio-muted: #a9adc4;
    --studio-dim: #737896;
    --studio-cyan: #6879f2;
    --studio-blue: #4659da;
    --studio-ice: #dfe3ff;
    --studio-label: #6f82e8;
    --studio-signal: #a824e0;
    --studio-red: #dd3034;
    --studio-shadow: 0 24px 80px rgba(0, 0, 0, 0.34);
    --studio-radius: 8px;
    --studio-max: 1180px;
    --studio-pad: 24px;
    --studio-font: "Aptos", "Segoe UI", Arial, sans-serif;
    --studio-serif: "Iowan Old Style", Georgia, "Times New Roman", serif;
    --studio-hero-title-size: 66px;
}

* {
    box-sizing: border-box;
}

html {
    min-height: 100%;
    scroll-behavior: smooth;
}

.growth-studio-page .site-aura {
    display: none;
}

body.growth-studio-page {
    overflow-x: hidden;
    min-height: 100%;
    margin: 0;
    font-family: var(--studio-font);
    font-size: 16px;
    line-height: 1.6;
    color: var(--studio-text);
    background:
        radial-gradient(circle at 16% 0%, rgba(99, 120, 255, 0.18), transparent 30rem),
        radial-gradient(circle at 88% 12%, rgba(192, 42, 255, 0.14), transparent 32rem),
        radial-gradient(circle at 52% 54%, rgba(104, 183, 255, 0.06), transparent 34rem),
        linear-gradient(180deg, #05050b 0%, #0b1024 44%, #080812 100%);
    background-attachment: fixed;
}

body.growth-studio-page::before {
    position: fixed;
    inset: 0;
    z-index: -1;
    content: "";
    background:
        linear-gradient(116deg, rgba(5, 5, 11, 0.22), rgba(5, 5, 11, 0.94) 56%),
        linear-gradient(132deg, transparent 0 12%, rgba(192, 42, 255, 0.136) 14%, transparent 20% 48%, rgba(255, 52, 52, 0.11) 52%, transparent 61%),
        linear-gradient(132deg, transparent 0 34%, rgba(51, 71, 214, 0.153) 38%, transparent 46%);
    pointer-events: none;
}

body.growth-studio-page::after {
    position: fixed;
    inset: 0;
    z-index: 0;
    content: "";
    background:
        radial-gradient(circle at 68% 42%, rgba(192, 42, 255, 0.11), transparent 18rem),
        radial-gradient(circle at 60% 46%, rgba(99, 120, 255, 0.13), transparent 16rem),
        linear-gradient(90deg, rgba(5, 5, 11, 0.08), rgba(5, 5, 11, 0.62) 64%, rgba(5, 5, 11, 0.2)),
        linear-gradient(132deg, transparent 0 58%, rgba(255, 52, 52, 0.07) 60%, transparent 67%),
        linear-gradient(132deg, transparent 0 20%, rgba(192, 42, 255, 0.07) 24%, transparent 31%);
    opacity: 0.78;
    pointer-events: none;
}

.studio-skip {
    position: fixed;
    top: 12px;
    left: 12px;
    z-index: 50;
    padding: 10px 12px;
    background: var(--studio-text);
    color: var(--studio-bg);
    transform: translateY(-160%);
}

.studio-skip:focus {
    transform: translateY(0);
}

.studio-header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 40;
    display: grid;
    grid-template-areas:
        "brand actions"
        "nav nav";
    grid-template-columns: minmax(190px, 1fr) auto;
    gap: 10px 16px;
    align-items: center;
    width: 100%;
    max-width: calc(var(--studio-max) + 48px);
    margin: 0 auto;
    padding: 16px 24px 18px;
    color: var(--studio-text);
    animation: studio-interface-in 700ms ease-out both;
}

.studio-header::before {
    position: absolute;
    inset: 8px 12px;
    z-index: -1;
    content: "";
    border: 1px solid rgba(142, 151, 210, 0.18);
    border-radius: var(--studio-radius);
    background: rgba(5, 5, 11, 0.58);
    box-shadow: 0 18px 60px rgba(0, 0, 0, 0.22);
    backdrop-filter: blur(18px);
}

.studio-brand {
    grid-area: brand;
    display: inline-flex;
    gap: 12px;
    align-items: center;
    min-width: 0;
}

.studio-brand-mark {
    width: 34px;
    height: 34px;
    border: 1px solid var(--studio-line-strong);
    border-radius: 50%;
    background:
        linear-gradient(90deg, transparent 48%, rgba(99, 120, 255, 0.58) 50%, transparent 52%),
        linear-gradient(0deg, transparent 48%, rgba(192, 42, 255, 0.49) 50%, transparent 52%),
        #0d0d1d;
    box-shadow: inset 0 0 0 8px rgba(99, 120, 255, 0.045);
}

.studio-brand-name,
.studio-brand-line {
    display: block;
}

.studio-brand-name {
    font-weight: 700;
}

.studio-brand-line {
    color: var(--studio-dim);
    font-size: 12px;
}

.studio-nav {
    grid-area: nav;
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    justify-content: center;
    width: 100%;
    min-width: 0;
    overflow-x: auto;
    padding: 4px;
    border: 1px solid var(--studio-line);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.035);
    scrollbar-width: none;
}

.studio-nav::-webkit-scrollbar {
    display: none;
}

.studio-nav a {
    flex: 0 0 auto;
    position: relative;
    z-index: 1;
    isolation: isolate;
    padding: 7px 10px;
    border-radius: 999px;
    color: var(--studio-muted);
    font-size: 12px;
    line-height: 1;
    transform-origin: center;
    transition: color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.studio-nav a::before {
    position: absolute;
    inset: 0;
    z-index: -1;
    content: "";
    border-radius: inherit;
    background: transparent;
    box-shadow: none;
    transition: inset 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.studio-nav a:hover,
.studio-nav a:focus-visible {
    color: var(--studio-text);
    background: transparent;
    box-shadow: none;
    outline: none;
    transform: scale(1.2);
    z-index: 2;
}

.studio-nav a:hover::before,
.studio-nav a:focus-visible::before {
    inset: -4px -7px;
    background: rgba(104, 183, 255, 0.18);
    box-shadow: 0 0 0 1px rgba(192, 42, 255, 0.32), 0 0 24px rgba(104, 183, 255, 0.22);
}

.studio-header-actions {
    grid-area: actions;
    display: flex;
    gap: 10px;
    align-items: center;
    justify-self: end;
    min-width: 0;
}

.studio-language-switch {
    display: flex;
    gap: 2px;
    padding: 4px;
    border: 1px solid var(--studio-line);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.035);
}

.studio-language-switch a {
    min-width: 32px;
    padding: 7px 8px;
    border-radius: 999px;
    color: var(--studio-muted);
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    text-align: center;
}

.studio-language-switch a:hover,
.studio-language-switch a:focus-visible,
.studio-language-switch a[aria-current="page"] {
    color: var(--studio-text);
    background: rgba(99, 120, 255, 0.12);
    outline: none;
}

.studio-header-cta {
    padding: 10px 14px;
    border: 1px solid rgba(111, 130, 232, 0.3);
    border-radius: 999px;
    background:
        linear-gradient(135deg, rgba(43, 65, 150, 0.34), rgba(94, 48, 150, 0.22)),
        rgba(8, 9, 20, 0.72);
    color: var(--studio-ice);
    font-weight: 700;
    font-size: 14px;
    white-space: nowrap;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
    transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, color 160ms ease, transform 160ms ease;
}

.studio-header-product-link {
    padding: 9px 11px;
    border: 1px solid var(--studio-line);
    border-radius: 999px;
    color: var(--studio-soft);
    font-size: 13px;
    font-weight: 750;
    line-height: 1;
    white-space: nowrap;
    background: rgba(255, 255, 255, 0.035);
    transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.studio-header-product-link:hover,
.studio-header-product-link:focus-visible {
    color: #ffffff;
    border-color: rgba(145, 199, 255, 0.28);
    background: rgba(104, 183, 255, 0.1);
    outline: none;
    transform: translateY(-1px);
}

.studio-header-product-link-primary {
    border-color: rgba(104, 183, 255, 0.26);
    background: rgba(104, 183, 255, 0.09);
}

.studio-header-cta:hover,
.studio-header-cta:focus-visible {
    color: #ffffff;
    border-color: rgba(145, 199, 255, 0.28);
    background:
        linear-gradient(135deg, rgba(55, 82, 180, 0.44), rgba(108, 54, 168, 0.32) 62%, rgba(142, 43, 96, 0.22)),
        rgba(12, 13, 26, 0.82);
    box-shadow: 0 0 0 1px rgba(111, 130, 232, 0.16), 0 16px 42px rgba(0, 0, 0, 0.24);
    outline: none;
    transform: translateY(-1px);
}

.growth-studio-page .site-main {
    color: var(--studio-text);
}

.growth-studio-page .site-main a {
    color: inherit;
    text-decoration: none;
}

.growth-studio-page .site-main button {
    font: inherit;
}

.growth-studio-page .site-main h1,
.growth-studio-page .site-main h2,
.growth-studio-page .site-main h3,
.growth-studio-page .site-main p {
    margin-top: 0;
}

.growth-studio-page .site-main h1,
.growth-studio-page .site-main h2,
.growth-studio-page .site-main h3 {
    font-family: var(--studio-serif);
    line-height: 1.08;
    letter-spacing: 0;
}

.growth-studio-page .site-main h1 {
    max-width: 900px;
    margin-bottom: 24px;
    font-size: var(--studio-hero-title-size);
}

.growth-studio-page .site-main h2 {
    margin-bottom: 18px;
    font-size: 42px;
}

.growth-studio-page .site-main h3 {
    margin-bottom: 12px;
    font-size: 24px;
}

.growth-studio-page .site-main p {
    color: var(--studio-muted);
}

.studio-hero {
    position: relative;
    display: grid;
    align-items: end;
    min-height: 92vh;
    overflow: hidden;
    padding: 158px 24px 58px;
    border-bottom: 0;
    --pointer-x: 68%;
    --pointer-y: 42%;
    --focus-x: 68%;
    --focus-y: 42%;
}

.studio-hero::after {
    position: absolute;
    inset: 0;
    z-index: 2;
    content: "";
    background: linear-gradient(118deg, transparent 0 44%, rgba(223, 227, 255, 0.12) 45%, transparent 47% 100%);
    opacity: 0;
    pointer-events: none;
    animation: studio-hero-scan 1800ms ease-out 260ms both;
}

.studio-hero::before {
    position: absolute;
    right: 0;
    bottom: -260px;
    left: 0;
    z-index: 1;
    height: 320px;
    content: "";
    background:
        radial-gradient(circle at 62% 0%, rgba(192, 42, 255, 0.1), transparent 24rem),
        radial-gradient(circle at 36% 12%, rgba(99, 120, 255, 0.09), transparent 22rem),
        linear-gradient(180deg, rgba(5, 5, 11, 0.02), rgba(5, 5, 11, 0));
    pointer-events: none;
}

.studio-hero-canvas,
.studio-light-field,
.studio-pointer-field,
.studio-hero-grid {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.studio-hero-canvas {
    z-index: 0;
    opacity: 0.94;
}

.studio-light-field {
    z-index: 1;
    overflow: hidden;
    opacity: 0.72;
    pointer-events: none;
}

.studio-light-field::before,
.studio-light-field::after {
    position: absolute;
    inset: -26% -14%;
    content: "";
    background:
        linear-gradient(132deg, transparent 0 18%, rgba(99, 120, 255, 0.18) 20%, transparent 25%),
        linear-gradient(132deg, transparent 0 48%, rgba(192, 42, 255, 0.13) 51%, transparent 57%),
        linear-gradient(132deg, transparent 0 72%, rgba(255, 52, 52, 0.1) 74%, transparent 79%);
    filter: blur(4px);
    transform: translate3d(-2%, -1%, 0);
    animation: studio-light-drift 12s ease-in-out infinite alternate;
}

.studio-light-field::after {
    opacity: 0.48;
    filter: blur(10px);
    transform: translate3d(4%, 2%, 0) scale(1.06);
    animation-duration: 16s;
    animation-direction: alternate-reverse;
}

.studio-pointer-field {
    z-index: 1;
    background:
        radial-gradient(circle at var(--pointer-x) var(--pointer-y), rgba(192, 42, 255, 0.12), transparent 18rem),
        radial-gradient(circle at var(--focus-x) var(--focus-y), rgba(99, 120, 255, 0.15), transparent 15rem),
        radial-gradient(circle at calc(var(--focus-x) + 8%) calc(var(--focus-y) + 6%), rgba(255, 52, 52, 0.055), transparent 12rem);
    opacity: 0.68;
    mix-blend-mode: screen;
    pointer-events: none;
    transition: opacity 240ms ease;
}

.studio-hero-grid {
    z-index: 2;
    background:
        linear-gradient(90deg, rgba(5, 5, 11, 0.08), rgba(5, 5, 11, 0.76) 64%, rgba(5, 5, 11, 0.22)),
        linear-gradient(132deg, transparent 0 58%, rgba(255, 52, 52, 0.094) 60%, transparent 67%),
        linear-gradient(132deg, transparent 0 20%, rgba(192, 42, 255, 0.085) 24%, transparent 31%),
        linear-gradient(180deg, rgba(5, 5, 11, 0.08), rgba(5, 5, 11, 0.42));
    pointer-events: none;
}

.studio-hero-overlay {
    position: relative;
    z-index: 3;
    min-width: 0;
    width: min(100%, var(--studio-max));
    margin: 0 auto;
    padding-right: min(410px, 36vw);
}

.studio-hero-overlay .studio-kicker,
.studio-hero-overlay h1,
.studio-hero-lead,
.studio-hero-actions,
.studio-hero-metrics {
    animation: studio-rise-in 760ms ease-out both;
}

.studio-hero-overlay h1 {
    max-width: 760px;
    animation-delay: 90ms;
}

.studio-hero-lead {
    animation-delay: 180ms;
}

.studio-hero-actions {
    animation-delay: 270ms;
}

.studio-hero-metrics {
    animation-delay: 360ms;
}

.studio-kicker {
    margin-bottom: 18px;
    color: var(--studio-label);
    font-weight: 800;
    font-size: 12px;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: uppercase;
}

.studio-hero-lead {
    max-width: 620px;
    margin-bottom: 28px;
    color: #c9cce0;
    font-size: 20px;
}

.studio-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 42px;
}

.studio-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 12px 18px;
    border-radius: var(--studio-radius);
    font-weight: 800;
    transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, color 160ms ease, transform 160ms ease;
}

.studio-button-primary {
    border: 1px solid rgba(111, 130, 232, 0.36);
    background:
        linear-gradient(135deg, rgba(48, 76, 178, 0.9), rgba(93, 52, 158, 0.9) 58%, rgba(145, 45, 98, 0.86)),
        #101225;
    color: #ffffff;
    box-shadow: 0 18px 46px rgba(0, 0, 0, 0.26), 0 0 28px rgba(111, 130, 232, 0.12);
}

.studio-button-secondary {
    border: 1px solid var(--studio-line-strong);
    background:
        linear-gradient(135deg, rgba(55, 82, 180, 0.14), rgba(93, 52, 158, 0.1)),
        rgba(8, 9, 20, 0.68);
    color: #dfe3ff;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.16);
}

.studio-button-primary:hover,
.studio-button-primary:focus-visible {
    color: #ffffff;
    border-color: rgba(145, 199, 255, 0.28);
    box-shadow: 0 0 0 1px rgba(111, 130, 232, 0.16), 0 20px 48px rgba(0, 0, 0, 0.28);
    outline: none;
    transform: translateY(-2px);
}

.studio-button-secondary:hover,
.studio-button-secondary:focus-visible {
    color: #ffffff;
    border-color: rgba(145, 199, 255, 0.34);
    background:
        linear-gradient(135deg, rgba(104, 183, 255, 0.15), rgba(192, 42, 255, 0.12)),
        rgba(255, 255, 255, 0.045);
    box-shadow: 0 0 0 1px rgba(192, 42, 255, 0.22), 0 0 26px rgba(104, 183, 255, 0.2);
    outline: none;
    transform: translateY(-2px);
}

.studio-hero-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 168px));
    gap: 1px;
    width: min(100%, 540px);
    margin: 0;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
    background: var(--studio-line);
    overflow: hidden;
}

.studio-hero-metrics div {
    padding: 14px;
    background: rgba(10, 10, 22, 0.82);
}

.studio-hero-metrics dt {
    color: var(--studio-ice);
    font-weight: 900;
    font-size: 18px;
}

.studio-hero-metrics dd {
    margin: 4px 0 0;
    color: var(--studio-muted);
    font-size: 13px;
}

.studio-signal-board {
    position: absolute;
    right: max(24px, calc((100vw - var(--studio-max)) / 2));
    bottom: 86px;
    z-index: 4;
    width: 348px;
    max-width: calc(100vw - 48px);
    min-height: 408px;
    padding: 15px 14px;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
    background: rgba(7, 7, 17, 0.76);
    box-shadow: var(--studio-shadow);
    backdrop-filter: blur(18px);
    animation: studio-panel-in 820ms ease-out 420ms both;
}

.studio-board-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 10px;
    color: var(--studio-muted);
    font-size: 12px;
    text-transform: uppercase;
}

.studio-board-status {
    color: var(--studio-label);
}

.studio-board-core {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    margin-bottom: 9px;
}

.studio-board-core span {
    height: 48px;
    border: 1px solid var(--studio-line);
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(99, 120, 255, 0.11), rgba(192, 42, 255, 0.03)),
        repeating-linear-gradient(90deg, transparent 0 12px, rgba(255, 255, 255, 0.05) 12px 13px);
}

.studio-board-readout {
    position: relative;
    z-index: 1;
    display: grid;
    align-content: start;
    gap: 5px;
    min-height: 100%;
    width: 100%;
    padding: 8px 8px 8px 10px;
    border: 1px solid rgba(142, 151, 210, 0.18);
    border-radius: 6px;
    background:
        linear-gradient(135deg, rgba(104, 183, 255, 0.07), rgba(192, 42, 255, 0.055)),
        rgba(255, 255, 255, 0.026);
    overflow: hidden;
    transition: box-shadow 180ms ease, background 180ms ease;
}

.studio-board-readout::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 2px;
    content: "";
    background: linear-gradient(180deg, var(--studio-cyan), var(--studio-signal));
    box-shadow: 0 0 18px rgba(104, 183, 255, 0.24);
}

.studio-board-readout-step {
    color: var(--studio-label);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.studio-board-readout strong {
    color: var(--studio-text);
    font-size: 17px;
    line-height: 1.12;
    overflow-wrap: anywhere;
}

.studio-board-readout p {
    margin: 0;
    color: var(--studio-muted);
    font-size: 13px;
    line-height: 1.36;
    overflow-wrap: anywhere;
}

.studio-board-path {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 5px;
    margin-bottom: 9px;
}

.studio-board-path span {
    position: relative;
    height: 5px;
    border-radius: 999px;
    background: rgba(142, 151, 210, 0.18);
    overflow: hidden;
}

.studio-board-path span::before {
    position: absolute;
    inset: 0;
    content: "";
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(104, 183, 255, 0.86), rgba(192, 42, 255, 0.86));
    opacity: 0;
    transform: scaleX(0.36);
    transform-origin: left center;
    transition: opacity 160ms ease, transform 160ms ease;
}

.studio-board-path span.is-active::before {
    opacity: 1;
    transform: scaleX(1);
}

.studio-board-control {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 7px;
    align-items: stretch;
    min-height: 218px;
    overflow: visible;
}

.studio-signal-board ul {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.studio-command-feed {
    position: relative;
    margin-top: 9px;
    padding: 8px 10px 8px 26px;
    border: 1px solid rgba(142, 151, 210, 0.18);
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.032);
    color: var(--studio-label);
    font-size: 12px;
    line-height: 1.35;
    overflow: hidden;
}

.studio-command-feed::before {
    position: absolute;
    top: 50%;
    left: 12px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--studio-signal);
    box-shadow: 0 0 14px rgba(192, 42, 255, 0.42);
    content: "";
    transform: translateY(-50%);
}

.studio-command-feed::after {
    position: absolute;
    inset: 0;
    content: "";
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.08), transparent);
    transform: translateX(-100%);
    animation: studio-feed-sweep 2300ms ease-in-out infinite;
}

.studio-command-feed span {
    position: relative;
    z-index: 1;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.studio-signal-board li {
    display: flex;
    gap: 10px;
    align-items: center;
    min-height: 27px;
    overflow: hidden;
    font-size: 14px;
}

.studio-signal-board li::before {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--studio-cyan);
    content: "";
}

.studio-signal-board button {
    width: 100%;
    max-width: 100%;
    min-height: 27px;
    padding: 5px 6px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #d7daee;
    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
    cursor: pointer;
    font-size: 14px;
    line-height: 1.16;
    transform-origin: left center;
    transition: color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.studio-signal-board button:hover,
.studio-signal-board button:focus-visible,
.studio-signal-board button.is-active {
    color: var(--studio-text);
    background: rgba(104, 183, 255, 0.13);
    box-shadow: 0 0 0 1px rgba(192, 42, 255, 0.28), 0 0 22px rgba(192, 42, 255, 0.18);
    outline: none;
    transform: translateY(-1px);
}

.studio-board-readout:hover,
.studio-board-readout:focus-within,
.studio-signal-board:has([data-hero-focus]:hover) .studio-board-readout,
.studio-signal-board:has([data-hero-focus]:focus-visible) .studio-board-readout {
    background:
        linear-gradient(135deg, rgba(104, 183, 255, 0.105), rgba(192, 42, 255, 0.082)),
        rgba(8, 9, 20, 0.92);
    box-shadow: 0 16px 42px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(192, 42, 255, 0.12);
}

.studio-signal-board li:has(button:hover)::before,
.studio-signal-board li:has(button:focus-visible)::before,
.studio-signal-board li:has(button.is-active)::before {
    background: var(--studio-signal);
    box-shadow: 0 0 16px rgba(192, 42, 255, 0.34);
}

.studio-section {
    padding: 94px 24px;
}

[data-reveal-section] {
    opacity: 0.001;
    transform: translateY(28px);
    transition:
        opacity 680ms ease,
        transform 680ms ease;
}

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

.studio-transformation {
    position: relative;
    border-bottom: 0;
    background:
        linear-gradient(132deg, transparent 0 48%, rgba(99, 120, 255, 0.07) 52%, transparent 60%),
        rgba(255, 255, 255, 0.012);
}

.studio-transformation-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 18px;
    align-items: stretch;
}

.studio-transform-map {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 68px minmax(0, 1fr);
    gap: 1px;
    min-height: 340px;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
    background: var(--studio-line);
    overflow: hidden;
}

.studio-transform-side,
.studio-transform-arrow,
.studio-audit-preview {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.018)),
        var(--studio-panel-solid);
}

.studio-transform-side {
    position: relative;
    padding: 22px 22px 142px;
    overflow: hidden;
}

.studio-transform-side .studio-kicker,
.studio-transform-side h2 {
    position: relative;
    z-index: 3;
}

.growth-studio-page .studio-transform-side h2 {
    max-width: 360px;
    font-size: 30px;
}

.studio-chaos-field,
.studio-system-orbit {
    position: absolute;
    inset: 48% 14px 14px;
    z-index: 1;
}

.studio-chaos-field span,
.studio-system-orbit span {
    position: absolute;
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 5px 8px;
    border: 1px solid var(--studio-line);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.035);
    color: var(--studio-muted);
    font-size: 14px;
    line-height: 1;
}

.studio-chaos-field span {
    color: #d9dcf2;
    background: rgba(104, 183, 255, 0.08);
    box-shadow: 0 0 18px rgba(104, 183, 255, 0.08);
}

.studio-system-orbit span {
    color: #e2e5ff;
    background: rgba(99, 120, 255, 0.09);
    box-shadow: 0 0 18px rgba(99, 120, 255, 0.1);
}

.studio-chaos-field span:nth-child(1) {
    top: 8%;
    left: 10%;
    transform: rotate(-5deg);
}

.studio-chaos-field span:nth-child(2) {
    top: 3%;
    right: 16%;
    border-color: rgba(192, 42, 255, 0.26);
    transform: rotate(5deg);
}

.studio-chaos-field span:nth-child(3) {
    top: 34%;
    left: 32%;
    transform: rotate(2deg);
}

.studio-chaos-field span:nth-child(4) {
    right: 11%;
    bottom: 32%;
    transform: rotate(-4deg);
}

.studio-chaos-field span:nth-child(5) {
    bottom: 12%;
    left: 14%;
    transform: rotate(5deg);
}

.studio-chaos-field span:nth-child(6) {
    right: 23%;
    bottom: 8%;
    border-color: rgba(255, 52, 52, 0.2);
    transform: rotate(-1deg);
}

.studio-transform-arrow {
    position: relative;
    display: grid;
    place-items: center;
}

.studio-transform-arrow span {
    position: relative;
    width: 42px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--studio-label), transparent);
    box-shadow: 0 0 18px rgba(99, 120, 255, 0.28);
}

.studio-transform-arrow span::after {
    position: absolute;
    top: -4px;
    right: 1px;
    width: 9px;
    height: 9px;
    border-top: 1px solid var(--studio-label);
    border-right: 1px solid var(--studio-label);
    content: "";
    transform: rotate(45deg);
}

.studio-system-orbit {
    display: grid;
    place-items: center;
}

.studio-system-orbit::before,
.studio-system-orbit::after {
    position: absolute;
    inset: 23% 20%;
    border: 1px solid rgba(104, 183, 255, 0.34);
    border-radius: 50%;
    content: "";
    transform: rotate(-8deg);
}

.studio-system-orbit::after {
    inset: 34% 28%;
    border-color: rgba(192, 42, 255, 0.3);
    transform: rotate(14deg);
}

.studio-system-orbit .studio-orbit-core {
    position: relative;
    z-index: 2;
    min-height: 34px;
    padding: 8px 11px;
    border-color: rgba(192, 42, 255, 0.34);
    background: rgba(99, 120, 255, 0.2);
    color: var(--studio-text);
    font-weight: 800;
    box-shadow: 0 0 34px rgba(99, 120, 255, 0.28);
}

.studio-system-orbit span:nth-child(2) {
    top: 14%;
    left: 20%;
}

.studio-system-orbit span:nth-child(3) {
    top: 17%;
    right: 16%;
}

.studio-system-orbit span:nth-child(4) {
    right: 16%;
    bottom: 27%;
}

.studio-system-orbit span:nth-child(5) {
    bottom: 14%;
    left: 26%;
}

.studio-system-orbit span:nth-child(6) {
    top: 48%;
    left: 14%;
    border-color: rgba(192, 42, 255, 0.24);
}

.studio-audit-preview {
    display: flex;
    flex-direction: column;
    min-height: 340px;
    padding: 20px;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
}

.studio-audit-preview h3 {
    font-family: var(--studio-font);
    font-size: 19px;
    line-height: 1.25;
}

.studio-audit-preview ul {
    display: grid;
    gap: 8px;
    margin: 12px 0 18px;
    padding: 0;
    list-style: none;
}

.studio-audit-preview li {
    position: relative;
    padding: 9px 10px 9px 28px;
    border: 1px solid rgba(142, 151, 210, 0.18);
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.032);
    color: #d7daee;
    font-size: 13px;
    line-height: 1.35;
}

.studio-audit-preview li::before {
    position: absolute;
    top: 14px;
    left: 13px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--studio-red);
    box-shadow: 0 0 14px rgba(255, 52, 52, 0.26);
    content: "";
}

.studio-audit-preview a {
    margin-top: auto;
    padding: 10px 12px;
    border: 1px solid rgba(192, 42, 255, 0.32);
    border-radius: var(--studio-radius);
    color: var(--studio-text);
    font-weight: 800;
    text-align: center;
    background: rgba(99, 120, 255, 0.08);
}

.studio-section-inner {
    min-width: 0;
    width: min(100%, var(--studio-max));
    margin: 0 auto;
}

.studio-section-heading {
    max-width: 680px;
    margin-bottom: 34px;
}

.studio-section-heading-wide {
    max-width: 820px;
}

.studio-signal-grid,
.studio-system-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
    background: var(--studio-line);
    overflow: hidden;
}

.studio-signal-card,
.studio-system-card {
    display: block;
    min-height: 190px;
    padding: 24px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018)),
        var(--studio-panel-solid);
}

.studio-system-card:hover,
.studio-system-card:focus-visible {
    background:
        linear-gradient(180deg, rgba(99, 120, 255, 0.11), rgba(255, 255, 255, 0.026)),
        var(--studio-panel-solid);
    outline: none;
}

.studio-signal-card span,
.studio-system-card span,
.studio-layer-detail span,
.studio-note-list span {
    display: inline-block;
    margin-bottom: 18px;
    color: var(--studio-ice);
    font-weight: 900;
    font-size: 12px;
    text-transform: uppercase;
}

.studio-signal-card h3,
.studio-system-card h3 {
    font-family: var(--studio-font);
    font-size: 20px;
    line-height: 1.25;
}

.studio-method {
    border-top: 0;
    border-bottom: 0;
    background:
        linear-gradient(90deg, rgba(51, 71, 214, 0.064), transparent 42%),
        linear-gradient(132deg, transparent 0 68%, rgba(192, 42, 255, 0.051) 71%, transparent 78%),
        rgba(255, 255, 255, 0.018);
}

.studio-method-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.88fr) minmax(520px, 1.12fr);
    gap: 48px;
    align-items: center;
}

.studio-method-copy p {
    max-width: 520px;
    font-size: 18px;
}

.studio-layer-system {
    position: relative;
    display: grid;
    grid-template-columns: 170px 1fr;
    gap: 12px 28px;
    min-height: 470px;
    padding: 22px;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
    background: rgba(7, 7, 17, 0.72);
    overflow: hidden;
}

.studio-layer-rail {
    position: absolute;
    top: 48px;
    bottom: 48px;
    left: 105px;
    width: 1px;
    background: linear-gradient(180deg, transparent, var(--studio-cyan), var(--studio-blue), transparent);
}

.studio-layer-rail::before {
    position: absolute;
    top: 0;
    left: -3px;
    width: 7px;
    height: 56px;
    border-radius: 999px;
    background: linear-gradient(180deg, transparent, rgba(223, 227, 255, 0.92), transparent);
    box-shadow:
        0 0 18px rgba(99, 120, 255, 0.32),
        0 0 28px rgba(192, 42, 255, 0.18);
    content: "";
    animation: studio-rail-pulse 3200ms ease-in-out infinite;
}

.studio-layer-node {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 12px;
    align-items: center;
    min-height: 64px;
    padding: 10px;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
    background: rgba(255, 255, 255, 0.035);
    color: var(--studio-muted);
    text-align: left;
    cursor: pointer;
}

.studio-layer-node span {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border: 1px solid var(--studio-line);
    border-radius: 50%;
    color: var(--studio-ice);
    font-weight: 900;
    font-size: 12px;
}

.studio-layer-node strong {
    font-size: 14px;
}

.studio-layer-node.is-active,
.studio-layer-node:hover,
.studio-layer-node:focus-visible {
    border-color: rgba(192, 42, 255, 0.32);
    color: var(--studio-text);
    background: rgba(99, 120, 255, 0.1);
    outline: none;
}

.studio-layer-detail {
    grid-row: 1 / span 5;
    grid-column: 2;
    display: flex;
    flex-direction: column;
    justify-content: end;
    min-height: 100%;
    height: 100%;
    padding: 32px;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
    background:
        linear-gradient(135deg, rgba(99, 120, 255, 0.1), transparent 38%),
        linear-gradient(132deg, transparent 0 55%, rgba(192, 42, 255, 0.068) 59%, transparent 66%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018));
}

.studio-layer-detail h3 {
    max-width: 480px;
    min-height: 2.4em;
    font-size: 34px;
}

.studio-layer-detail p {
    max-width: 500px;
    min-height: 5.1em;
    margin-bottom: 0;
    font-size: 18px;
}

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

.studio-system-card {
    min-height: 240px;
}

.studio-offers {
    background:
        linear-gradient(120deg, rgba(192, 42, 255, 0.072), transparent 34%),
        linear-gradient(250deg, rgba(255, 52, 52, 0.052), transparent 42%),
        rgba(255, 255, 255, 0.014);
}

.studio-section-heading p {
    max-width: 720px;
}

.studio-offer-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    border-radius: var(--studio-radius);
    background: transparent;
    perspective: 1100px;
    overflow: visible;
}

.studio-offer-card {
    --offer-glow-x: 50%;
    --offer-glow-y: 12%;
    --offer-tilt-x: 0deg;
    --offer-tilt-y: 0deg;
    --offer-lift: 0px;
    display: flex;
    flex-direction: column;
    min-height: 520px;
    padding: 28px;
    position: relative;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.018)),
        var(--studio-panel-solid);
    transform: translateY(var(--offer-lift)) rotateX(var(--offer-tilt-x)) rotateY(var(--offer-tilt-y));
    transform-style: preserve-3d;
    transition:
        border-color 180ms ease,
        box-shadow 220ms ease,
        transform 180ms ease,
        background 220ms ease;
    overflow: hidden;
    will-change: transform;
}

.studio-offer-card::before,
.studio-offer-card::after {
    position: absolute;
    inset: 0;
    pointer-events: none;
    content: "";
}

.studio-offer-card::before {
    opacity: 0;
    background:
        radial-gradient(circle at var(--offer-glow-x) var(--offer-glow-y), rgba(223, 227, 255, 0.22), transparent 0 22%),
        radial-gradient(circle at var(--offer-glow-x) var(--offer-glow-y), rgba(99, 120, 255, 0.26), transparent 0 42%);
    transition: opacity 220ms ease;
}

.studio-offer-card::after {
    opacity: 0.54;
    background:
        linear-gradient(135deg, transparent 0 32%, rgba(223, 227, 255, 0.075) 36%, transparent 42%),
        linear-gradient(225deg, transparent 0 58%, rgba(192, 42, 255, 0.07) 62%, transparent 70%);
    mix-blend-mode: screen;
}

.studio-offer-card.is-featured {
    background:
        linear-gradient(135deg, rgba(99, 120, 255, 0.16), transparent 38%),
        linear-gradient(210deg, rgba(192, 42, 255, 0.12), transparent 46%),
        var(--studio-panel-solid);
}

.studio-offer-card.is-live,
.studio-offer-card:hover,
.studio-offer-card:focus-within {
    --offer-lift: -8px;
    box-shadow:
        0 24px 60px rgba(0, 0, 0, 0.34),
        0 0 0 1px rgba(223, 227, 255, 0.08),
        0 0 42px rgba(99, 120, 255, 0.16);
}

.studio-offer-card.is-live::before,
.studio-offer-card:hover::before,
.studio-offer-card:focus-within::before {
    opacity: 1;
}

.studio-offer-card > * {
    position: relative;
    z-index: 1;
}

.studio-offer-head {
    display: flex;
    gap: 14px;
    align-items: start;
    justify-content: space-between;
    margin-bottom: 26px;
}

.studio-offer-head span {
    color: var(--studio-ice);
    font-weight: 900;
    font-size: 12px;
    text-transform: uppercase;
}

.studio-offer-head strong {
    color: #ffffff;
    font-family: var(--studio-font);
    font-size: 24px;
    line-height: 1;
    text-align: right;
    white-space: nowrap;
    transition: color 180ms ease, text-shadow 180ms ease;
}

.studio-offer-card.is-live .studio-offer-head strong,
.studio-offer-card:hover .studio-offer-head strong,
.studio-offer-card:focus-within .studio-offer-head strong {
    color: #ffffff;
    text-shadow: 0 0 22px rgba(223, 227, 255, 0.4);
}

.studio-offer-card h3 {
    margin-bottom: 10px;
    font-family: var(--studio-font);
    font-size: 28px;
    line-height: 1.12;
}

.studio-offer-cadence {
    margin-bottom: 18px;
    color: var(--studio-ice);
    font-weight: 800;
    font-size: 13px;
    text-transform: uppercase;
}

.studio-offer-card ul {
    display: grid;
    gap: 10px;
    margin: 24px 0 28px;
    padding: 0;
    list-style: none;
}

.studio-offer-plain {
    margin: 18px 0 0;
    padding: 14px;
    border: 1px solid rgba(223, 227, 255, 0.12);
    border-radius: var(--studio-radius);
    color: #edf0ff;
    font-weight: 750;
    font-size: 14px;
    line-height: 1.45;
    background: rgba(99, 120, 255, 0.075);
}

.studio-offer-card li {
    padding-left: 20px;
    color: #dfe2f5;
    font-size: 14px;
    line-height: 1.45;
    background: linear-gradient(90deg, var(--studio-cyan) 0 7px, transparent 7px) left 0.72em / 12px 2px no-repeat;
}

.studio-offer-card a {
    margin-top: auto;
    padding: 12px 14px;
    border: 1px solid rgba(192, 42, 255, 0.34);
    border-radius: var(--studio-radius);
    color: var(--studio-text);
    font-weight: 900;
    text-align: center;
    background: rgba(99, 120, 255, 0.1);
}

.studio-offer-card a:hover,
.studio-offer-card a:focus-visible {
    border-color: rgba(223, 227, 255, 0.46);
    background: rgba(99, 120, 255, 0.17);
    outline: none;
}

.studio-offer-card.is-live a,
.studio-offer-card:hover a,
.studio-offer-card:focus-within a {
    border-color: rgba(223, 227, 255, 0.38);
    background: rgba(99, 120, 255, 0.15);
}

.studio-price-note {
    max-width: 760px;
    margin: 18px 0 0;
    color: var(--studio-muted);
    font-size: 13px;
}

.studio-service-scope {
    display: grid;
    grid-template-columns: minmax(260px, 0.72fr) minmax(0, 1.28fr);
    gap: 1px;
    margin-top: 44px;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
    background: var(--studio-line);
    overflow: hidden;
}

.studio-service-heading,
.studio-service-list a {
    background: rgba(7, 7, 17, 0.7);
}

.studio-service-heading {
    padding: 28px;
}

.studio-service-heading h3 {
    font-family: var(--studio-font);
    font-size: 28px;
    line-height: 1.18;
}

.studio-service-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    background: var(--studio-line);
}

.studio-service-list a {
    display: grid;
    gap: 10px;
    min-height: 172px;
    padding: 24px;
}

.studio-service-list a:hover,
.studio-service-list a:focus-visible {
    background: rgba(99, 120, 255, 0.09);
    outline: none;
}

.studio-service-list span {
    color: var(--studio-ice);
    font-weight: 900;
    font-size: 12px;
}

.studio-service-list strong {
    color: #ffffff;
    font-size: 18px;
}

.studio-service-list p {
    margin: 0;
    color: var(--studio-muted);
    font-size: 14px;
    line-height: 1.5;
}

.studio-service-list .studio-service-plain {
    margin-top: 2px;
    padding-top: 10px;
    border-top: 1px solid rgba(223, 227, 255, 0.1);
    color: #edf0ff;
    font-weight: 760;
}

.studio-founder {
    border-top: 0;
    border-bottom: 0;
    background: #090914;
}

.studio-founder-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 1px;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
    background: var(--studio-line);
    overflow: hidden;
}

.studio-founder-panel,
.studio-founder-copy {
    padding: 38px;
    background: var(--studio-panel-solid);
}

.studio-founder-panel {
    background:
        linear-gradient(135deg, rgba(192, 42, 255, 0.094), transparent 45%),
        var(--studio-panel-solid);
}

.studio-founder-copy p {
    font-size: 18px;
}

.studio-founder-copy ul {
    display: grid;
    gap: 10px;
    margin: 26px 0 0;
    padding: 0;
    list-style: none;
}

.studio-founder-copy li {
    padding-left: 20px;
    color: #dddef0;
    background: linear-gradient(90deg, var(--studio-cyan) 0 7px, transparent 7px) left 0.72em / 12px 2px no-repeat;
}

.studio-thinking-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    gap: 44px;
    align-items: start;
}

.studio-note-list {
    display: grid;
    gap: 1px;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
    background: var(--studio-line);
    overflow: hidden;
}

.studio-note-list a {
    display: block;
    padding: 24px;
    background: rgba(255, 255, 255, 0.035);
}

.studio-note-list a:hover,
.studio-note-list a:focus-visible {
    background: rgba(99, 120, 255, 0.094);
    outline: none;
}

.studio-note-list strong {
    display: block;
    font-size: 20px;
}

.studio-final {
    padding: 96px 24px 110px;
    background:
        linear-gradient(90deg, rgba(51, 71, 214, 0.136), rgba(192, 42, 255, 0.085) 55%, rgba(255, 52, 52, 0.068)),
        #0b0b17;
}

.studio-final-inner {
    width: min(100%, 860px);
    margin: 0 auto;
    text-align: center;
}

.studio-final h2 {
    margin-right: auto;
    margin-left: auto;
}

.studio-final-deliverables {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    max-width: 860px;
    margin: 28px auto 30px;
    padding: 0;
    border: 1px solid var(--studio-line);
    border-radius: var(--studio-radius);
    background: var(--studio-line);
    list-style: none;
    overflow: hidden;
}

.studio-final-deliverables li {
    min-height: 82px;
    padding: 18px 14px;
    background: rgba(7, 7, 17, 0.64);
    color: #d7daee;
    font-weight: 800;
    font-size: 13px;
    line-height: 1.35;
}

.studio-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    justify-content: space-between;
    width: min(100%, var(--studio-max));
    margin: 0 auto;
    padding: 24px;
    color: var(--studio-muted);
    font-size: 14px;
}

.studio-footer a {
    color: inherit;
}

@keyframes studio-light-drift {
    0% {
        transform: translate3d(-4%, -2%, 0);
    }

    100% {
        transform: translate3d(4%, 2%, 0);
    }
}

@keyframes studio-interface-in {
    0% {
        opacity: 0;
        transform: translateY(-12px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes studio-rise-in {
    0% {
        opacity: 0;
        transform: translateY(18px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes studio-panel-in {
    0% {
        opacity: 0;
        transform: translateY(18px) scale(0.98);
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes studio-hero-scan {
    0% {
        opacity: 0;
        transform: translateX(-42%);
    }

    34% {
        opacity: 0.42;
    }

    100% {
        opacity: 0;
        transform: translateX(42%);
    }
}

@keyframes studio-feed-sweep {
    0% {
        transform: translateX(-100%);
    }

    58%,
    100% {
        transform: translateX(100%);
    }
}

@keyframes studio-rail-pulse {
    0% {
        opacity: 0;
        transform: translateY(0);
    }

    16%,
    72% {
        opacity: 0.78;
    }

    100% {
        opacity: 0;
        transform: translateY(calc(100% - 56px));
    }
}

@media (max-width: 1120px) {
    .growth-studio-page .site-main h1 {
        font-size: calc(var(--studio-hero-title-size) * 0.82);
    }

    .studio-signal-board {
        position: relative;
        right: auto;
        bottom: auto;
        z-index: 3;
        width: min(100%, 720px);
        margin: 32px auto 0;
    }

    .studio-hero-overlay {
        padding-right: 0;
    }

    .studio-hero {
        align-items: end;
    }

    .studio-method-layout,
    .studio-transformation-layout,
    .studio-thinking-layout,
    .studio-founder-layout,
    .studio-service-scope {
        grid-template-columns: 1fr;
    }

    .studio-layer-system {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .studio-layer-detail {
        grid-row: auto;
        grid-column: auto;
        min-height: 260px;
    }

    .studio-layer-rail {
        display: none;
    }

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

    .studio-offer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .studio-audit-preview {
        min-height: 0;
    }
}

@media (max-width: 860px) {
    .studio-header {
        grid-template-columns: 1fr auto;
    }

    .studio-nav {
        display: none;
    }

    .studio-header-cta {
        white-space: nowrap;
    }

    .growth-studio-page .site-main h1 {
        font-size: calc(var(--studio-hero-title-size) * 0.64);
    }

    .growth-studio-page .site-main h2 {
        font-size: 34px;
    }

    .studio-hero {
        min-height: auto;
        padding-top: 112px;
    }

    .studio-hero-lead {
        font-size: 18px;
    }

    .studio-hero-metrics,
    .studio-transform-map,
    .studio-signal-grid,
    .studio-system-grid,
    .studio-offer-grid,
    .studio-service-list,
    .studio-final-deliverables {
        grid-template-columns: 1fr;
    }

    .studio-transform-map {
        min-height: 0;
    }

    .studio-transform-side,
    .studio-audit-preview {
        min-height: 300px;
    }

    .studio-offer-card {
        min-height: 0;
    }

    .studio-transform-arrow {
        min-height: 74px;
    }

    .studio-transform-arrow span {
        width: 1px;
        height: 46px;
    }

    .studio-transform-arrow span::after {
        top: auto;
        right: -4px;
        bottom: 1px;
        transform: rotate(135deg);
    }
}

@media (max-width: 640px) {
    .studio-board-control {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .studio-header {
        gap: 10px;
        grid-template-areas:
            "brand"
            "actions";
        grid-template-columns: 1fr;
        max-width: 100vw;
        padding: 14px;
    }

    .studio-header::before {
        inset: 6px;
    }

    .studio-brand {
        max-width: 100%;
    }

    .studio-brand-line {
        display: none;
    }

    .studio-brand-name {
        overflow: hidden;
        max-width: 100%;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.growth-studio-page .studio-header .studio-header-cta {
        display: none;
    }

    .studio-header-actions {
        width: 100%;
        justify-self: stretch;
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: none;
    }

    .studio-header-actions::-webkit-scrollbar {
        display: none;
    }

    .studio-header-product-link {
        flex: 0 0 auto;
        padding: 8px 10px;
        font-size: 12px;
    }

    .studio-language-switch a {
        min-width: 30px;
        padding: 8px 7px;
        font-size: 11px;
    }

    .studio-hero,
    .studio-section,
    .studio-final {
        padding-right: 16px;
        padding-left: 16px;
    }

    .studio-hero {
        max-width: 100vw;
        overflow-x: hidden;
    }

    .studio-hero-overlay,
    .studio-hero-lead,
    .studio-hero-actions,
    .studio-hero-metrics {
        max-width: 100%;
    }

    .studio-hero-canvas {
        opacity: 0.42;
    }

    .studio-pointer-field {
        opacity: 0.34;
    }

    .studio-hero-grid {
        background:
            linear-gradient(90deg, rgba(5, 5, 11, 0.82), rgba(5, 5, 11, 0.9)),
            linear-gradient(180deg, rgba(5, 5, 11, 0.16), rgba(5, 5, 11, 0.94));
    }

    .growth-studio-page .site-main h1 {
        font-size: calc(var(--studio-hero-title-size) * 0.55);
    }

    .growth-studio-page .site-main h2 {
        font-size: 30px;
    }

    .studio-hero-actions {
        display: grid;
    }

    .studio-button {
        width: 100%;
    }

    .studio-layer-system,
    .studio-layer-detail,
    .studio-founder-panel,
    .studio-founder-copy,
    .studio-offer-card,
    .studio-service-heading,
    .studio-service-list a,
    .studio-transform-side,
    .studio-audit-preview,
    .studio-signal-card,
    .studio-system-card {
        padding: 18px;
    }

    .studio-chaos-field,
    .studio-system-orbit {
        inset: 48% 16px 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .studio-light-field::before,
    .studio-light-field::after,
    .studio-layer-rail::before {
        animation: none;
    }

    .studio-header,
    .studio-hero::after,
    .studio-hero-overlay .studio-kicker,
    .studio-hero-overlay h1,
    .studio-hero-lead,
    .studio-hero-actions,
    .studio-hero-metrics,
    .studio-signal-board,
    .studio-command-feed::after {
        animation: none;
    }

    [data-reveal-section] {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .studio-offer-card,
    .studio-offer-card.is-live,
    .studio-offer-card:hover,
    .studio-offer-card:focus-within {
        --offer-lift: 0px;
        --offer-tilt-x: 0deg;
        --offer-tilt-y: 0deg;
        transform: none;
        transition: none;
    }
}

/* Keep the homepage background continuous; sections should float over one fixed scene. */
body.growth-studio-page .growth-studio-content,
body.growth-studio-page .site-main,
body.growth-studio-page .studio-section,
body.growth-studio-page .studio-transformation,
body.growth-studio-page .studio-diagnostic,
body.growth-studio-page .studio-method,
body.growth-studio-page .studio-systems,
body.growth-studio-page .studio-founder,
body.growth-studio-page .studio-thinking,
body.growth-studio-page .studio-final {
    background: transparent !important;
    background-image: none !important;
}

body.growth-studio-page .growth-studio-content {
    position: relative;
    isolation: isolate;
}

body.growth-studio-page .growth-studio-content::before {
    position: fixed;
    inset: 0;
    z-index: 0;
    content: "";
    background:
        radial-gradient(circle at 68% 42%, rgba(192, 42, 255, 0.12), transparent 18rem),
        radial-gradient(circle at 60% 46%, rgba(99, 120, 255, 0.15), transparent 15rem),
        radial-gradient(circle at 76% 38%, rgba(255, 52, 52, 0.055), transparent 15rem),
        linear-gradient(90deg, rgba(5, 5, 11, 0.08), rgba(5, 5, 11, 0.66) 64%, rgba(5, 5, 11, 0.2)),
        linear-gradient(132deg, transparent 0 58%, rgba(255, 52, 52, 0.086) 60%, transparent 67%),
        linear-gradient(132deg, transparent 0 20%, rgba(192, 42, 255, 0.078) 24%, transparent 31%);
    pointer-events: none;
}

body.growth-studio-page .studio-section,
body.growth-studio-page .studio-final {
    position: relative;
    isolation: isolate;
}

body.growth-studio-page .studio-light-field,
body.growth-studio-page .studio-pointer-field,
body.growth-studio-page .studio-hero-grid {
    position: fixed;
    inset: 0;
}

body.growth-studio-page .studio-hero-canvas {
    position: absolute;
    inset: 0;
}

body.growth-studio-page .studio-light-field,
body.growth-studio-page .studio-pointer-field,
body.growth-studio-page .studio-hero-grid {
    display: none;
}

body.growth-studio-page .studio-hero {
    overflow: visible;
}

body.growth-studio-page .studio-hero-overlay,
body.growth-studio-page .studio-section,
body.growth-studio-page .studio-final {
    position: relative;
    z-index: 10;
}

body.growth-studio-page .studio-header {
    z-index: 40;
}

body.growth-studio-page .studio-signal-board {
    z-index: 20;
}

body.growth-studio-page .studio-hero-overlay .studio-kicker,
body.growth-studio-page .studio-hero-overlay h1,
body.growth-studio-page .studio-hero-lead,
body.growth-studio-page .studio-hero-actions,
body.growth-studio-page .studio-hero-metrics,
body.growth-studio-page .studio-signal-board {
    opacity: 1 !important;
    animation: none !important;
    transform: none !important;
}

body.growth-studio-page .studio-hero-overlay,
body.growth-studio-page .studio-signal-board {
    opacity: 1 !important;
    filter: none !important;
    mix-blend-mode: normal !important;
}

body.growth-studio-page .studio-node-editor-layer {
    position: absolute;
    inset: 0;
    z-index: 35;
    pointer-events: none;
}

body.growth-studio-page .studio-node-handle {
    position: absolute;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 1px solid rgba(241, 242, 255, 0.72);
    border-radius: 50%;
    background:
        radial-gradient(circle at 50% 45%, rgba(255, 255, 255, 0.26), transparent 44%),
        rgba(104, 183, 255, 0.72);
    color: #05050b;
    font-weight: 900;
    font-size: 12px;
    line-height: 1;
    box-shadow: 0 0 0 8px rgba(104, 183, 255, 0.12), 0 0 28px rgba(104, 183, 255, 0.3);
    cursor: grab;
    pointer-events: auto;
    transform: translate(-50%, -50%);
    touch-action: none;
}

body.growth-studio-page .studio-node-handle:hover,
body.growth-studio-page .studio-node-handle:focus-visible,
body.growth-studio-page .studio-node-handle.is-dragging {
    border-color: #ffffff;
    background:
        radial-gradient(circle at 50% 45%, rgba(255, 255, 255, 0.32), transparent 44%),
        rgba(192, 42, 255, 0.84);
    color: #ffffff;
    outline: none;
    box-shadow: 0 0 0 10px rgba(192, 42, 255, 0.16), 0 0 34px rgba(192, 42, 255, 0.36);
    cursor: grabbing;
}

.studio-node-editor-panel {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 70;
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 8px;
    width: min(520px, calc(100vw - 36px));
    padding: 12px;
    border: 1px solid rgba(142, 151, 210, 0.22);
    border-radius: 8px;
    background: rgba(5, 5, 11, 0.88);
    color: #f1f2ff;
    box-shadow: 0 22px 70px rgba(0, 0, 0, 0.34);
    backdrop-filter: blur(18px);
}

.studio-node-editor-panel strong {
    align-self: center;
    font-size: 13px;
}

.studio-node-editor-panel button {
    padding: 7px 10px;
    border: 1px solid rgba(145, 199, 255, 0.22);
    border-radius: 999px;
    background: rgba(104, 183, 255, 0.1);
    color: #dfe3ff;
    font-weight: 800;
    font-size: 12px;
    cursor: pointer;
}

.studio-node-editor-panel button:hover,
.studio-node-editor-panel button:focus-visible {
    border-color: rgba(145, 199, 255, 0.42);
    background: rgba(104, 183, 255, 0.18);
    color: #ffffff;
    outline: none;
}

.studio-node-editor-output {
    grid-column: 1 / -1;
    width: 100%;
    min-height: 126px;
    padding: 10px;
    border: 1px solid rgba(142, 151, 210, 0.18);
    border-radius: 6px;
    background: rgba(8, 9, 20, 0.88);
    color: #dfe3ff;
    font: 12px/1.45 Consolas, "Courier New", monospace;
    resize: vertical;
}
