@media (min-width: 1024px) {
    .about-scrolly__sticky { position: sticky; top: 8rem; }
}

.about-scrolly__step { opacity: .45; transition: opacity 300ms ease; }
.about-scrolly__step.is-active,
.about-scrolly__step.is-done { opacity: 1; }
.about-scrolly__bar { width: 3rem; height: .25rem; flex-shrink: 0; }
.about-scrolly__bar-fill { width: 0; transition: width 500ms ease; }
.about-scrolly__step.is-done .about-scrolly__bar-fill,
.about-scrolly__step.is-active .about-scrolly__bar-fill { width: 100%; }

.about-scrolly__panel { opacity: .35; transform: scale(.96); transition: opacity 600ms ease, transform 600ms cubic-bezier(.2, .8, .2, 1); }
.about-scrolly__panel.is-active { opacity: 1; transform: none; }

.about-scrolly__figure { aspect-ratio: 3 / 2; }
.about-scrolly__img { object-fit: cover; transform: scale(1.08); transition: transform 1200ms cubic-bezier(.2, .8, .2, 1); }
.about-scrolly__panel.is-active .about-scrolly__img { transform: scale(1); }

.about-scrolly__chip { left: 1.25rem !important; bottom: 1.25rem !important; transform: translateY(1rem); opacity: 0; transition: transform 500ms ease 300ms, opacity 500ms ease 300ms; }
.about-scrolly__panel.is-active .about-scrolly__chip { transform: none; opacity: 1; }
.about-scrolly__chip-text { max-width: 12rem; }

@media (prefers-reduced-motion: reduce) {
    .about-scrolly__panel, .about-scrolly__img, .about-scrolly__chip { opacity: 1; transform: none; transition: none; }
}

/* wpg-hidden: utility classes are renamed in production builds, so hidden states must not rely on .hidden / .d-none alone */
.about-scrolly[hidden], .about-scrolly [hidden], .about-scrolly .hidden.d-none { display: none !important; }

/* values-terminal — terminal window chrome, grid-line background, blinking cursor */
/* Layout/animation only — no colors here, theme colors are applied via tw: */

.values-terminal__grid-bg {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(to right, currentColor 1px, transparent 1px),
        linear-gradient(to bottom, currentColor 1px, transparent 1px);
    background-size: 40px 40px;
    opacity: 0.05;
    pointer-events: none;
}

.values-terminal__chrome {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-bottom-width: 1px;
}

.values-terminal__dot {
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 9999px;
    display: inline-block;
    opacity: 0.5;
}

.values-terminal__body {
    line-height: 1.6;
}

.values-terminal__line {
    animation: values-terminal-fade-in 0.4s ease both;
}

.values-terminal__cursor {
    display: inline-block;
    opacity: 0;
}

[data-values-terminal].is-ready .values-terminal__cursor {
    animation: values-terminal-blink 1s steps(1, end) infinite;
}

@keyframes values-terminal-blink {
    0%, 50% { opacity: 1; }
    50.01%, 100% { opacity: 0; }
}

@keyframes values-terminal-fade-in {
    from { opacity: 0; transform: translateY(0.25rem); }
    to { opacity: 1; transform: translateY(0); }
}

/* Совпадает с Tailwind max-w-4xl (56rem) для Bootstrap-ветки */
.border-rail-list__shell {
    max-width: 56rem;
}

.border-rail-list__portrait {
    width: 7rem;
    height: 7rem;
}

@media (min-width: 768px) {
    .border-rail-list__portrait {
        width: 8rem;
        height: 8rem;
    }
}

.border-rail-list__min-shrink {
  min-width: 0;
}

/* quote v18 — checkerboard rhythm, extrude title, icon glyph cards */

/* BS glyph tile sizing (TW w-12 h-12 = 3rem) */
.quote-check__glyph {
    width: 3rem;
    height: 3rem;
    flex-shrink: 0;
}

.quote-check__meta {
    min-width: 0;
}

.quote-scan__layer {
    animation: quoteScanFlicker 4s steps(2, end) infinite;
}
@keyframes quoteScanFlicker {
    0%, 92%, 100% { opacity: 0.35; }
    94% { opacity: 0.7; }
}

/* checkerboard stagger — margin only (transform on ancestors breaks flip-card 3D) */
.quote-check__cell:nth-child(odd) {
    margin-top: 0.25rem;
}
.quote-check__cell:nth-child(even) {
    margin-bottom: 0.25rem;
}

.quote-check__grid.is-compact-grid .quote-check__cell {
    margin-top: 0;
    margin-bottom: 0;
}

.quote-flip__perspective {
    perspective: 1400px;
}

.quote-flip__card {
    cursor: pointer;
    overflow: visible;
}
.quote-flip__card:active {
    transform: none;
    scale: 1;
}

.quote-tape__strip {
    width: 3.5rem;
    height: 1.25rem;
    transform: rotate(-12deg);
}
.quote-tape__strip--a {
    top: -0.35rem;
    left: 0.75rem;
}
.quote-tape__strip--b {
    top: -0.35rem;
    right: 0.75rem;
    transform: rotate(12deg);
}

.quote-check__extrude {
    position: absolute;
    top: 0;
    left: 0;
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
    line-height: 1.2;
}
.quote-check__extrude--back {
    transform: translate(3px, 3px);
}
.quote-check__extrude--mid {
    transform: translate(6px, 6px);
}

.quote-flip__inner {
    display: grid;
    position: relative;
    width: 100%;
    transform-style: preserve-3d;
    transition: transform 450ms ease;
}
.quote-flip__face {
    grid-area: 1 / 1;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}
.quote-flip__card.is-flipped .quote-flip__inner {
    transform: rotateY(180deg);
}
.quote-flip__face--back {
    transform: rotateY(180deg);
}

.quote-flip__card:focus-visible {
    outline: 2px solid var(--bs-primary);
    outline-offset: 2px;
}

.quote-check-root button:focus-visible,
.quote-check-root [tabindex="0"]:focus-visible {
    outline: 2px solid var(--bs-primary);
    outline-offset: 2px;
}

@media (hover: hover) {
    .quote-check-root button:hover {
        opacity: 0.92;
    }
}

/* cta v38 — surge band: rising area chart + staggered copy reveal (no colors) */
.cta-surge__band { isolation: isolate; }
.cta-surge__chart { pointer-events: none; top: auto !important; bottom: 0 !important; height: 55% !important; }
.cta-surge__rise { transform-box: view-box; transform-origin: 50% 100%; transform: scaleY(0); transition: transform 1400ms cubic-bezier(.2, .8, .2, 1); }
.cta-surge__rise path[data-line] { transition: stroke-dashoffset 2200ms ease 300ms; }
[data-surge].is-visible .cta-surge__rise { transform: scaleY(1); }

.cta-surge__pulse { width: .875rem; height: .875rem; opacity: 0; transform: translate(-50%, -50%); transition: opacity 400ms ease 1800ms; }
.cta-surge__pulse::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid; animation: cta-surge-ping 2s ease-out infinite; }
[data-surge].is-visible .cta-surge__pulse { opacity: 1; }

.cta-surge__eyebrow { backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.cta-surge__fade { opacity: 0; transform: translateY(1.25rem); transition: opacity 700ms ease, transform 700ms cubic-bezier(.2, .8, .2, 1); }
.cta-surge__fade--2 { transition-delay: 120ms; }
.cta-surge__fade--3 { transition-delay: 240ms; }
[data-surge].is-visible .cta-surge__fade { opacity: 1; transform: none; }

.cta-surge__stat { opacity: 0; transform: translateY(1rem); transition: opacity 600ms ease, transform 600ms ease; }
[data-surge].is-visible .cta-surge__stat { opacity: 1; transform: none; }
[data-surge].is-visible li:nth-child(2) .cta-surge__stat { transition-delay: 150ms; }
[data-surge].is-visible li:nth-child(3) .cta-surge__stat { transition-delay: 300ms; }

@keyframes cta-surge-ping { 0% { transform: scale(1); opacity: .6; } 100% { transform: scale(3.2); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
    .cta-surge__rise, .cta-surge__fade, .cta-surge__stat { transition: none; transform: none; opacity: 1; }
    .cta-surge__rise path[data-line] { transition: none; }
    .cta-surge__pulse { transition: none; }
    .cta-surge__pulse::after { animation: none; }
}

/* wpg-hidden: utility classes are renamed in production builds, so hidden states must not rely on .hidden / .d-none alone */
.cta-surge[hidden], .cta-surge [hidden], .cta-surge .hidden.d-none { display: none !important; }

