/* layout.css — хедер, футер, секции. Только токены. */

/* ---------- Header: один на весь сайт, фиксированный ---------- */

.site-header {
    position: fixed;
    inset-inline: 0;
    top: 0;
    z-index: var(--z-sticky);
    min-height: var(--header-h);
    display: flex;
    align-items: center;
    background: var(--glass-bg);
    backdrop-filter: blur(var(--glass-blur, 18px));
    -webkit-backdrop-filter: blur(var(--glass-blur, 18px));
    border-bottom: 1px solid var(--color-border);
}

.site-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    width: 100%;
    padding-inline: max(var(--page-pad), env(safe-area-inset-left), env(safe-area-inset-right));
}

.site-header .site-header__inner {
    max-width: 1600px;
}

.site-header__logo {
    display: inline-flex;
    align-items: center;
    width: 104px;
    min-height: 32px;
    background: url("/assets/gamma-logo-approved@2x.webp") left center / contain no-repeat;
    font-family: var(--font-display);
    font-size: 0;
    line-height: 1;
    font-weight: var(--fw-h4);
    color: var(--color-text);
    flex: 0 0 auto;
}

.site-header__nav {
    display: none;
    align-items: center;
    gap: var(--space-6);
}

.site-header__nav a {
    font-size: var(--fs-nav);
    line-height: var(--lh-nav);
    font-weight: var(--fw-nav);
    color: var(--color-text-secondary);
    transition: color var(--dur-fast) var(--ease-out);
}

.site-header__nav a:hover {
    color: var(--color-text);
}

.header-catalog {
    position: relative;
}

.header-catalog summary {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    list-style: none;
    color: var(--color-text-secondary);
    font-size: var(--fs-nav);
    line-height: var(--lh-nav);
    font-weight: var(--fw-nav);
}

.header-catalog summary::-webkit-details-marker {
    display: none;
}

.header-catalog summary::after {
    content: "↓";
    font-size: var(--fs-caption);
    transition: transform var(--dur-fast) var(--ease-out);
}

.header-catalog[open] summary::after {
    transform: rotate(180deg);
}

.header-catalog summary:hover,
.header-catalog summary:focus-visible {
    color: var(--color-text);
}

.header-catalog summary:focus-visible {
    outline: 2px solid var(--gamma-color-primary);
    outline-offset: var(--space-2);
    border-radius: var(--radius-xs);
}

.header-catalog__panel {
    position: absolute;
    top: calc(100% + var(--space-4));
    right: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    gap: var(--space-6);
    width: min(720px, calc(100vw - (var(--page-pad) * 2)));
    padding: var(--space-6);
    border: 1px solid var(--gamma-hero-border-soft);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-lg);
}

.header-catalog__panel div {
    display: flex;
    flex-direction: column;
}

.site-header__nav-list,
.header-catalog__panel ul,
.site-footer__col ul {
    display: flex;
    align-items: stretch;
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-header__nav-list {
    align-items: center;
    gap: var(--space-4);
}

.header-catalog__panel ul,
.site-footer__col ul {
    flex-direction: column;
    gap: var(--space-2);
}

.header-catalog__panel p {
    margin-bottom: var(--space-1);
    color: var(--gamma-color-primary);
    font-size: var(--fs-caption);
    line-height: var(--lh-caption);
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
    letter-spacing: var(--ls-kicker);
}

.header-catalog__panel a {
    padding-block: var(--space-1);
    font-size: var(--fs-body-sm);
}

.site-header__actions {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex: 0 0 auto;
}

.site-header__cta-short {
    display: inline;
}

.site-header__cta-wide {
    display: none;
}

@media (min-width: 1024px) {
    .site-header__logo {
        width: 152px;
        min-height: 44px;
    }
}

@media (min-width: 1200px) {
    .site-header__nav {
        display: flex;
        gap: var(--space-4);
    }

    .site-header__cta-short {
        display: none;
    }

    .site-header__cta-wide {
        display: inline;
    }
}

@media (min-width: 1280px) {
    .site-header__nav {
        gap: var(--space-6);
    }
}

@media (max-width: 380px) {
    .site-header__actions .btn {
        padding-inline: var(--space-3);
    }

    .site-header__logo { width: 88px; }
}

/* ---------- Hero ---------- */

.hero {
    position: relative;
    padding-block: var(--section-pad-lg);
    overflow: hidden;
}

.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--gradient-accent-wash);
    pointer-events: none;
}

.hero__inner {
    position: relative;
    display: grid;
    gap: var(--space-12);
    grid-template-columns: minmax(0, 1fr);
}

.hero__content {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    align-items: flex-start;
}

.hero__title {
    max-width: 18ch;
}

.hero__lead {
    max-width: var(--measure);
}

.hero__proof {
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body-sm);
    color: var(--color-text-muted);
}

.hero--center .hero__content {
    align-items: center;
    text-align: center;
    margin-inline: auto;
}

.hero--center .hero__title {
    max-width: 20ch;
}

.hero--center .cta-group {
    justify-content: center;
}

.hero--statement .hero__title {
    max-width: 16ch;
}

.hero--media-full {
    display: flex;
    align-items: flex-end;
    min-height: 100vh;
    min-height: 100dvh;
    padding-block: var(--section-pad-lg);
}

.hero--media-full .hero__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.hero--media-full .hero__bg img,
.hero--media-full .hero__bg video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero--media-full .hero__bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, var(--scrim-top) 0%, var(--scrim-bottom) 100%);
}

.hero--media-full .hero__inner {
    z-index: var(--z-raised);
}

.hero--compact {
    padding-block: var(--section-pad-md);
}

/* ---------- Approved Gamma hero ---------- */

.gamma-hero {
    padding-block: var(--space-12);
    min-height: 0;
    display: grid;
    align-items: start;
    background:
        radial-gradient(circle at 84% 18%, var(--gamma-hero-glow-indigo), transparent 31%),
        radial-gradient(circle at 96% 78%, var(--gamma-hero-glow-pink), transparent 26%),
        linear-gradient(135deg, var(--gamma-hero-canvas-start) 0%, var(--gamma-hero-canvas-mid) 52%, var(--gamma-hero-canvas-end) 100%);
}

.gamma-hero::before {
    background: none;
}

.gamma-hero__grid {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: var(--space-8);
    max-width: 1600px;
}

.gamma-hero__content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.gamma-hero__badge {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    min-height: 38px;
    margin: 0 0 var(--space-6);
    padding: var(--space-2) var(--space-4);
    border: 1px solid var(--gamma-hero-badge-border);
    border-radius: var(--radius-pill);
    background: var(--gamma-hero-badge-bg);
    color: var(--gamma-color-badge);
    font-size: var(--fs-gamma-badge);
    line-height: 1.2;
    font-weight: 500;
    letter-spacing: 0;
}

.gamma-hero__badge .icon {
    width: 20px;
    height: 20px;
}

.gamma-hero__title {
    max-width: 12ch;
    margin: 0;
    color: var(--gamma-color-title);
    font-family: var(--font-display);
    font-size: var(--fs-gamma-hero);
    line-height: .99;
    font-weight: 700;
    letter-spacing: -.045em;
}

.gamma-hero__lead {
    max-width: 620px;
    margin: var(--space-6) 0 0;
    color: var(--gamma-color-lead);
    font-size: var(--fs-gamma-lead);
    line-height: 1.55;
}

.gamma-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-top: var(--space-8);
}

.gamma-hero__actions .btn {
    min-width: 210px;
    border-radius: var(--radius-gamma-control);
}

.gamma-hero__actions .btn--primary {
    background: var(--gamma-color-primary);
    box-shadow: var(--shadow-gamma-button);
}

.gamma-hero__actions .btn--primary:hover {
    background: var(--gamma-color-primary-hover);
}

.gamma-hero__actions .btn--secondary {
    color: var(--gamma-color-secondary-text);
    border-color: var(--gamma-color-secondary-border);
    background: var(--gamma-hero-surface-button);
}

.gamma-hero__benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: min(100%, 590px);
    margin-top: var(--space-8);
    overflow: hidden;
    border: 1px solid var(--gamma-hero-border-soft);
    border-radius: var(--radius-gamma-benefits);
    background: var(--gamma-hero-surface-glass);
    box-shadow: var(--shadow-gamma-benefits);
    backdrop-filter: blur(16px);
}

.gamma-hero__benefit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    min-width: 0;
    min-height: 54px;
    padding: var(--space-2) var(--space-3);
    border-right: 1px solid var(--gamma-hero-border-soft);
    color: var(--gamma-color-benefit-text);
    font-size: var(--fs-gamma-benefit);
    line-height: 1.25;
    white-space: nowrap;
}

.gamma-hero__benefit:last-child {
    border-right: 0;
}

.gamma-hero__benefit-icon,
.gamma-hero__lang {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border-radius: 50%;
    color: var(--gamma-color-primary);
    background: var(--gamma-color-icon-soft);
}

.gamma-hero__benefit-icon .icon {
    width: 20px;
    height: 20px;
}

.gamma-hero__lang {
    color: var(--gamma-color-surface);
    background: linear-gradient(135deg, var(--gamma-lang-start), var(--gamma-lang-end));
    font-size: var(--fs-gamma-lang);
    font-weight: 700;
}

.gamma-hero__visual {
    position: relative;
    z-index: 1;
    margin: 0;
    min-width: 0;
    filter: var(--shadow-gamma-visual);
}

.gamma-hero__visual img {
    display: block;
    width: 100%;
    height: auto;
    clip-path: inset(0 0 0 3%);
}

@media (min-width: 768px) and (max-width: 1023px) {
    .gamma-hero__title {
        max-width: 13ch;
    }

    .gamma-hero__visual {
        max-width: 760px;
        margin-inline: auto;
    }
}

@media (min-width: 1024px) {
    .gamma-hero__grid {
        grid-template-columns: minmax(440px, .84fr) minmax(620px, 1.26fr);
        gap: clamp(18px, 2.6vw, 42px);
    }

    .gamma-hero__visual {
        width: calc(100% + 74px);
        margin-left: calc(var(--space-8) * -1);
        margin-right: calc(var(--space-12) * -1);
        margin-top: calc(var(--space-2) * -1);
    }
}

@media (max-width: 767px) {
    .gamma-hero {
        min-height: 0;
        padding-block: var(--space-8) var(--space-12);
    }

    .gamma-hero__grid {
        gap: var(--space-8);
    }

    .gamma-hero__badge {
        min-height: 34px;
        margin-bottom: var(--space-6);
        padding: var(--space-2) var(--space-3);
        font-size: var(--fs-gamma-badge-mobile);
    }

    .gamma-hero__title {
        max-width: 10.5ch;
        font-size: var(--fs-gamma-hero-mobile);
        line-height: 1.02;
    }

    .gamma-hero__lead {
        margin-top: var(--space-6);
        font-size: var(--fs-body);
    }

    .gamma-hero__lead br {
        display: none;
    }

    .gamma-hero__actions {
        display: grid;
        width: 100%;
        gap: var(--space-3);
        margin-top: 24px;
    }

    .gamma-hero__actions .btn {
        width: 100%;
        min-width: 0;
    }

    .gamma-hero__benefits {
        grid-template-columns: 1fr;
        margin-top: var(--space-6);
    }

    .gamma-hero__benefit {
        justify-content: flex-start;
        min-height: 48px;
        padding-inline: var(--space-4);
        border-right: 0;
        border-bottom: 1px solid var(--gamma-hero-border-soft);
    }

    .gamma-hero__benefit:last-child {
        border-bottom: 0;
    }
}

@media (max-width: 390px) {
    .gamma-hero__badge {
        font-size: var(--fs-gamma-badge-small);
    }

    .gamma-hero__title {
        font-size: var(--fs-gamma-hero-mobile);
    }
}

/* ---------- Internal pages: approved Gamma Light system ---------- */

.intent-hero {
    position: relative;
    overflow: hidden;
    padding-block: var(--space-12);
    background:
        radial-gradient(circle at 84% 12%, var(--gamma-hero-glow-indigo), transparent 34%),
        radial-gradient(circle at 12% 88%, var(--gamma-hero-glow-pink), transparent 28%),
        linear-gradient(135deg, var(--gamma-hero-canvas-start), var(--gamma-hero-canvas-end));
}

.intent-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: var(--space-8);
    max-width: 1440px;
}

.intent-hero__content {
    position: relative;
    z-index: var(--z-raised);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.intent-hero__badge {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    margin: 0 0 var(--space-6);
    padding: var(--space-2) var(--space-4);
    border: 1px solid var(--gamma-hero-badge-border);
    border-radius: var(--radius-pill);
    color: var(--gamma-color-primary);
    background: var(--gamma-hero-badge-bg);
    font-size: var(--fs-gamma-badge);
    line-height: var(--lh-caption);
    font-weight: var(--fw-semibold);
}

.intent-hero__title {
    max-width: 14ch;
    margin: 0;
    color: var(--gamma-color-title);
    font-family: var(--font-display);
    font-size: var(--fs-gamma-intent-hero);
    line-height: 1.02;
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-h1);
}

.intent-hero__title span {
    display: block;
    color: var(--gamma-color-primary);
}

.intent-hero__lead {
    max-width: 640px;
    margin: var(--space-6) 0 0;
    color: var(--gamma-color-lead);
    font-size: var(--fs-body-lg);
    line-height: var(--lh-body-lg);
}

.intent-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-top: var(--space-8);
}

.intent-hero__actions .btn {
    min-width: 210px;
    border-radius: var(--radius-gamma-control);
}

.intent-hero__proof {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-6);
    color: var(--color-text-muted);
    font-size: var(--fs-body-sm);
}

.intent-hero__proof span {
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--gamma-hero-border-soft);
    border-radius: var(--radius-pill);
    background: var(--gamma-hero-surface-glass);
}

.intent-hero__proof i {
    color: var(--gamma-color-primary);
    font-style: normal;
}

.intent-hero__visual {
    position: relative;
    z-index: var(--z-base);
    margin: 0;
    overflow: visible;
    border: 1px solid var(--gamma-hero-border-soft);
    border-radius: var(--radius-lg);
    background: var(--gamma-color-surface);
    box-shadow: var(--shadow-gamma-media);
}

.intent-hero__visual img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: inherit;
}

.intent-hero__float {
    position: absolute;
    inset-inline-end: var(--space-6);
    bottom: var(--space-6);
    max-width: 260px;
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--gamma-hero-border-soft);
    border-radius: var(--radius-md);
    color: var(--gamma-color-title);
    background: var(--gamma-hero-surface-glass);
    box-shadow: var(--shadow-gamma-float);
    backdrop-filter: blur(var(--glass-blur));
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body-sm);
    font-weight: var(--fw-semibold);
}

.intent-page .section__head {
    margin-bottom: var(--space-6);
}

.intent-page .steps .step,
.intent-page .grid--auto .card {
    border-color: var(--gamma-hero-border-soft);
    box-shadow: var(--shadow-gamma-card);
}

.intent-page .steps .step:nth-child(2),
.intent-page .grid--auto .card:nth-child(2) {
    background: var(--gamma-color-icon-soft);
}

.intent-page .steps .step:nth-child(3),
.intent-page .grid--auto .card:nth-child(3) {
    background: var(--gamma-color-surface-2);
}

.intent-page .table-wrap {
    background: var(--gamma-color-surface);
    box-shadow: var(--shadow-gamma-card);
}

.intent-page .numbered {
    gap: var(--space-3);
}

.intent-page .numbered__item {
    padding: var(--space-4);
    border: 1px solid var(--gamma-hero-border-soft);
    border-radius: var(--radius-lg);
    background: var(--gamma-color-surface);
    box-shadow: var(--shadow-gamma-card);
}

@media (min-width: 1024px) {
    .intent-hero__grid {
        grid-template-columns: minmax(430px, .88fr) minmax(570px, 1.12fr);
        gap: var(--space-12);
    }

    .intent-hero__visual {
        transform: rotate(-1deg);
    }

    .intent-hero--create .intent-hero__visual {
        transform: rotate(1deg);
    }
}

@media (max-width: 767px) {
    .intent-hero {
        padding-block: var(--space-8) var(--space-12);
    }

    .intent-hero__badge {
        margin-bottom: var(--space-4);
        font-size: var(--fs-gamma-badge-mobile);
    }

    .intent-hero__title {
        max-width: 16ch;
        font-size: var(--fs-gamma-intent-hero-mobile);
    }

    .intent-hero__lead {
        margin-top: var(--space-4);
        font-size: var(--fs-body);
    }

    .intent-hero__actions {
        display: grid;
        width: 100%;
        margin-top: var(--space-6);
    }

    .intent-hero__actions .btn {
        width: 100%;
        min-width: 0;
    }

    .intent-hero__proof {
        gap: var(--space-1);
    }

    .intent-hero__proof span {
        padding-inline: var(--space-2);
    }

    .intent-hero__float {
        position: relative;
        inset: auto;
        max-width: none;
        margin: calc(var(--space-4) * -1) var(--space-4) var(--space-4);
    }
}

@media (min-width: 1024px) {
    .hero--split .hero__inner {
        grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
        align-items: center;
    }

    .hero--data .hero__inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        align-items: center;
    }
}

/* ---------- Полосы ---------- */

.strip {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-8);
    align-items: center;
    justify-content: space-between;
    padding-block: var(--section-pad-sm);
    border-block: 1px solid var(--color-border);
}

.strip--logos {
    justify-content: center;
    gap: var(--space-12);
}

.marquee {
    overflow: hidden;
    padding-block: var(--space-6);
    border-block: 1px solid var(--color-border);
    background: var(--color-surface);
}

.marquee__track {
    display: flex;
    gap: var(--space-8);
    width: max-content;
    animation: marquee var(--dur-ambient, 24s) linear infinite;
}

.marquee__item {
    font-family: var(--font-display);
    font-size: var(--fs-h3);
    line-height: 1;
    font-weight: var(--fw-h3);
    color: var(--color-text);
    white-space: nowrap;
}

@keyframes marquee {
    to {
        transform: translateX(-50%);
    }
}

@media (prefers-reduced-motion: reduce) {
    .marquee__track {
        animation: none;
    }
}

/* ---------- Нумерованный редакционный список ---------- */

.numbered {
    display: flex;
    flex-direction: column;
}

.numbered__item {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: minmax(0, 1fr);
    padding-block: var(--space-8);
    border-top: 1px solid var(--color-border);
}

.numbered__num {
    font-family: var(--font-display);
    font-size: var(--fs-display);
    line-height: 1;
    font-weight: var(--fw-display);
    font-variant-numeric: tabular-nums;
    color: var(--color-accent);
}

.numbered__body {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

@media (min-width: 768px) {
    .numbered__item {
        grid-template-columns: minmax(0, 200px) minmax(0, 1fr);
        gap: var(--space-12);
    }
}

/* ---------- Bento ---------- */

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

@media (min-width: 768px) {
    .bento {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .bento > * {
        grid-column: auto;
        grid-row: auto;
    }
}

/* ---------- Инверсные блоки ---------- */

.invert-block {
    padding-block: var(--section-pad-sm);
}

.invert-block--dark {
    background: var(--color-text);
    color: var(--color-bg);
}

.invert-block--accent {
    background: var(--color-accent);
    color: var(--color-on-accent, var(--color-bg));
}

.invert-block--dark .kicker,
.invert-block--accent .kicker {
    color: currentColor;
}

.invert-block--dark .t-h2,
.invert-block--dark .t-lead,
.invert-block--accent .t-h2,
.invert-block--accent .t-lead {
    color: currentColor;
}

.intent-page--powerpoint .invert-block--accent {
    color: var(--gamma-color-surface);
}

/* ---------- Showcase ---------- */

.showcase-full {
    padding-block: var(--section-pad-sm);
    background: var(--color-surface);
}

.showcase-full__title {
    max-width: 22ch;
}

.quote-full {
    padding-block: var(--section-pad-sm);
    background: var(--color-surface);
}

.quote-full__text {
    font-family: var(--font-display);
    font-size: var(--fs-h2);
    line-height: var(--lh-h2);
    font-weight: var(--fw-h2);
    max-width: 24ch;
}

.quote-full__author {
    margin-top: var(--space-6);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body-sm);
    color: var(--color-text-muted);
}

/* ---------- Галерея ---------- */

.gallery {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
}

/* ---------- Финальный CTA ---------- */

.cta-band {
    padding-block: var(--section-pad-sm);
    background: var(--color-primary);
    color: var(--color-on-primary);
}

.cta-band .kicker {
    color: currentColor;
}

.cta-band .t-lead {
    color: var(--color-on-primary);
}

.cta-band__inner {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    align-items: flex-start;
}

.cta-quiet {
    padding-block: var(--section-pad-sm);
    border-top: 1px solid var(--color-border);
}

/* ---------- Footer: один на весь сайт ---------- */

.site-footer {
    padding-block: var(--section-pad-sm);
    background: var(--color-surface);
    border-top: 1px solid var(--color-border);
}

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

.site-footer__brand {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    max-width: 40ch;
}

.site-footer__nav {
    display: grid;
    gap: var(--space-8);
    grid-template-columns: repeat(auto-fit, minmax(min(160px, 100%), 1fr));
}

.site-footer__col {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.site-footer__col-title {
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text);
}

.site-footer__col a {
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body-sm);
    color: var(--color-text-secondary);
    transition: color var(--dur-fast) var(--ease-out);
}

.site-footer__col a:hover {
    color: var(--color-text);
}

.site-footer__legal {
    margin-top: var(--space-12);
    padding-top: var(--space-6);
    border-top: 1px solid var(--color-border);
    font-size: var(--fs-caption);
    line-height: var(--lh-caption);
    color: var(--color-text-muted);
}

@media (min-width: 1024px) {
    .site-footer__top {
        grid-template-columns: minmax(220px, .7fr) minmax(0, 2.3fr);
    }
}

/* ---------- Scenario pages: 15 intent-specific landings ---------- */

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

.home-scenario-group {
    padding: var(--space-6);
    border: 1px solid var(--scenario-line);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--scenario-card-shadow);
}

.home-scenario-group--business {
    background: linear-gradient(145deg, var(--color-surface), var(--scenario-violet-soft));
}

.home-scenario-group--study {
    background: linear-gradient(145deg, var(--color-surface), var(--scenario-green-soft));
}

.home-scenario-group--teach {
    background: linear-gradient(145deg, var(--color-surface), var(--scenario-orange-soft));
}

.home-scenario-group__label {
    margin-bottom: var(--space-2);
    color: var(--gamma-color-primary);
    font-size: var(--fs-caption);
    line-height: var(--lh-caption);
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
    letter-spacing: var(--ls-kicker);
}

.home-scenario-group h3 {
    margin-bottom: var(--space-6);
    font-size: var(--fs-h4);
    line-height: var(--lh-h4);
}

.home-scenario-links {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    list-style: none;
}

.home-scenario-links a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding-block: var(--space-3);
    border-top: 1px solid var(--scenario-line);
    color: var(--color-text-secondary);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body-sm);
    transition: color var(--dur-fast) var(--ease-out), padding var(--dur-fast) var(--ease-out);
}

.home-scenario-links a:hover {
    padding-left: var(--space-2);
    color: var(--gamma-color-primary);
}

.home-scenario-links span {
    color: var(--gamma-color-primary);
}

@media (min-width: 768px) {
    .home-scenario-catalog {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .home-scenario-catalog {
        grid-template-columns: 1.2fr 1fr .8fr;
    }
}

.scenario-page {
    --scenario-accent: var(--scenario-violet);
    --scenario-wash: var(--scenario-violet-soft);
    color: var(--scenario-dark);
}

.scenario-theme-2 {
    --scenario-accent: var(--scenario-orange);
    --scenario-wash: var(--scenario-orange-soft);
}

.scenario-theme-3 {
    --scenario-accent: var(--scenario-green);
    --scenario-wash: var(--scenario-green-soft);
}

.scenario-theme-4 {
    --scenario-accent: var(--scenario-pink);
    --scenario-wash: var(--scenario-pink-soft);
}

.scenario-theme-5 {
    --scenario-accent: var(--scenario-blue);
    --scenario-wash: var(--scenario-blue-soft);
}

.scenario-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding-block: var(--space-12);
    background:
        radial-gradient(circle at 86% 16%, var(--gamma-hero-glow-indigo), transparent 34%),
        radial-gradient(circle at 8% 86%, var(--gamma-hero-glow-pink), transparent 30%),
        linear-gradient(135deg, var(--gamma-hero-canvas-start), var(--scenario-wash));
}

.scenario-hero__grid {
    display: grid;
    align-items: center;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-8);
}

.scenario-hero__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.scenario-hero__badge {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    margin: 0 0 var(--space-4);
    padding: var(--space-2) var(--space-4);
    border: 1px solid var(--scenario-accent);
    border-radius: var(--radius-pill);
    color: var(--scenario-accent);
    background: var(--scenario-glass);
    font-size: var(--fs-caption);
    line-height: var(--lh-caption);
    font-weight: var(--fw-semibold);
}

.scenario-hero__title {
    max-width: 13ch;
    margin: 0;
    color: var(--scenario-dark);
    font-family: var(--font-display);
    font-size: var(--scenario-hero-title-mobile);
    line-height: 1.02;
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-display);
}

.scenario-hero__lead {
    max-width: 58ch;
    margin: var(--space-6) 0 0;
    color: var(--scenario-dark-muted);
    font-size: var(--fs-body-lg);
    line-height: var(--lh-body-lg);
}

.scenario-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-top: var(--space-8);
}

.scenario-page .btn--primary {
    background: var(--scenario-accent);
    border-color: var(--scenario-accent);
}

.scenario-page .btn--primary:hover {
    filter: brightness(.9);
}

.scenario-hero__proof {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-6);
    color: var(--color-text-muted);
    font-size: var(--fs-caption);
    line-height: var(--lh-caption);
}

.scenario-hero__proof span {
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--scenario-line);
    border-radius: var(--radius-pill);
    background: var(--scenario-glass);
}

.scenario-hero__proof i {
    color: var(--scenario-accent);
    font-style: normal;
}

.scenario-hero__visual {
    position: relative;
    margin: 0;
    padding: var(--space-3);
    border: 1px solid var(--scenario-line);
    border-radius: var(--radius-lg);
    background: var(--scenario-glass);
    box-shadow: var(--scenario-shadow);
    transform: perspective(1200px) rotateY(-2deg) rotateX(1deg);
    transition: transform var(--dur-slow) var(--ease-out), box-shadow var(--dur-slow) var(--ease-out);
}

.scenario-hero__visual:hover {
    transform: perspective(1200px) rotateY(0) rotateX(0) scale(1.015);
    box-shadow: var(--shadow-lg);
}

.scenario-hero__visual img {
    width: 100%;
    height: auto;
    aspect-ratio: 32 / 21;
    object-fit: cover;
    border-radius: var(--radius-md);
}

.scenario-hero__visual figcaption {
    position: absolute;
    right: var(--space-6);
    bottom: var(--space-6);
    max-width: 34ch;
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--scenario-line);
    border-radius: var(--radius-sm);
    color: var(--scenario-dark);
    background: var(--scenario-glass);
    box-shadow: var(--shadow-sm);
    font-size: var(--fs-caption);
    line-height: var(--lh-caption);
    backdrop-filter: blur(var(--glass-blur));
}

.scenario-section .section__head {
    max-width: 740px;
    margin-bottom: var(--space-6);
}

.scenario-section,
.scenario-outline-section {
    padding-block: var(--section-pad-sm);
}

.scenario-section .kicker,
.scenario-outline-section .kicker {
    color: var(--scenario-accent);
}

.scenario-pain-grid,
.scenario-flow,
.scenario-card-grid,
.scenario-audience,
.scenario-related {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-4);
}

.scenario-pain,
.scenario-flow article,
.scenario-card,
.scenario-audience article,
.scenario-related .card {
    min-width: 0;
    padding: var(--space-4);
    border: 1px solid var(--scenario-line);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--scenario-card-shadow);
    transition: transform var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}

.scenario-pain:hover,
.scenario-flow article:hover,
.scenario-card:hover,
.scenario-audience article:hover,
.scenario-related .card:hover {
    transform: translateY(calc(var(--move-sm) * -1));
    border-color: var(--scenario-accent);
    box-shadow: var(--shadow-md);
}

.scenario-pain span,
.scenario-flow article > span,
.scenario-card > span {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    margin-bottom: var(--space-4);
    border-radius: var(--radius-sm);
    color: var(--scenario-accent);
    background: var(--scenario-wash);
    font-size: var(--fs-body-sm);
    line-height: 1;
    font-weight: var(--fw-semibold);
}

.scenario-card > span svg {
    width: 22px;
    height: 22px;
}

.scenario-pain p,
.scenario-flow p,
.scenario-card p,
.scenario-audience p {
    color: var(--color-text-secondary);
}

.scenario-flow h3,
.scenario-card h3,
.scenario-audience h3 {
    margin-bottom: var(--space-3);
    color: var(--scenario-dark);
    font-size: var(--fs-h4);
    line-height: var(--lh-h4);
}

.scenario-outline-section {
    scroll-margin-top: var(--header-h);
}

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

.scenario-outline-layout .section__head {
    margin: 0;
}

.scenario-outline-layout .btn {
    margin-top: var(--space-6);
}

.scenario-outline {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-3);
    margin: 0;
    padding: 0;
    list-style: none;
}

.scenario-outline li {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    min-height: 56px;
    padding: var(--space-4);
    border: 1px solid var(--scenario-line);
    border-radius: var(--radius-md);
    color: var(--scenario-dark);
    background: var(--color-surface);
    font-weight: var(--fw-medium);
}

.scenario-outline li span {
    flex: 0 0 auto;
    color: var(--scenario-accent);
    font-size: var(--fs-caption);
    font-weight: var(--fw-bold);
}

.scenario-audience article {
    background: var(--scenario-wash);
}

.scenario-related .card {
    display: block;
}

.scenario-cta {
    background: var(--scenario-accent);
}

.scenario-cta .btn--primary {
    color: var(--scenario-dark);
    background: var(--color-surface);
    border-color: var(--color-surface);
}

@media (min-width: 768px) {
    .scenario-pain-grid,
    .scenario-flow,
    .scenario-card-grid,
    .scenario-audience,
    .scenario-related {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

@media (min-width: 1024px) {
    .scenario-hero__grid {
        grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
        gap: var(--space-12);
    }

    .scenario-hero__title {
        font-size: var(--scenario-hero-title);
    }

    .scenario-pain-grid,
    .scenario-flow,
    .scenario-card-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .scenario-audience,
    .scenario-related {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .scenario-outline-layout {
        grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr);
        gap: var(--space-16);
    }
}

@media (max-width: 767px) {
    .scenario-hero__actions,
    .scenario-hero__actions .btn {
        width: 100%;
    }

    .scenario-hero__visual {
        padding: var(--space-2);
        transform: none;
    }

    .scenario-hero__visual figcaption {
        position: static;
        max-width: none;
        margin-top: var(--space-2);
        box-shadow: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .scenario-hero__visual,
    .scenario-pain,
    .scenario-flow article,
    .scenario-card,
    .scenario-audience article,
    .scenario-related .card {
        transition: none;
        transform: none;
    }
}
