/* intro v27 — Evangelion cascade: organic blob, wide banner, diagonal steps, slide-in L/R, word reveal */

/* Organic blob */
.intro-eva__blob {
    width: 24rem;
    height: 24rem;
    filter: blur(60px);
    opacity: 0.4;
    border-radius: 38% 62% 55% 45% / 55% 42% 58% 45%;
    animation: intro-eva-morph 12s ease-in-out infinite;
}
@keyframes intro-eva-morph {
    50% { border-radius: 55% 45% 42% 58% / 42% 58% 45% 55%; }
}

/* Single wide banner */
.intro-eva__banner-img {
    display: block;
    width: 100%;
    height: 12rem;
    object-fit: cover;
}
@media (min-width: 768px) {
    .intro-eva__banner-img { height: 16rem; }
}

/* Stepped diagonal cascade + asymmetric mixed sizes */
.intro-eva__row { margin-left: 0; }
.intro-eva__cell { max-width: 46rem; }
@media (min-width: 768px) {
    .intro-eva__row:nth-child(1) .intro-eva__cell { margin-left: 0;    max-width: 40rem; }
    .intro-eva__row:nth-child(2) .intro-eva__cell { margin-left: 3rem; max-width: 34rem; }
    .intro-eva__row:nth-child(3) .intro-eva__cell { margin-left: 6rem; max-width: 44rem; }
    .intro-eva__row:nth-child(4) .intro-eva__cell { margin-left: 9rem; max-width: 30rem; }
}

/* Slide-in from L / R on scroll — hidden only once JS arms it (no-JS content stays visible) */
.intro-eva.is-armed .intro-eva__row {
    opacity: 0;
    transition: opacity 560ms ease, transform 560ms ease;
}
.intro-eva.is-armed .intro-eva__row:nth-child(odd)  { transform: translateX(-2.5rem); }
.intro-eva.is-armed .intro-eva__row:nth-child(even) { transform: translateX(2.5rem); }
.intro-eva.is-armed .intro-eva__row.is-in { opacity: 1; transform: translateX(0); }

/* Letterpress-ish press using the element's own colour */
.intro-eva__press { text-shadow: 0 1px 0 currentColor; }

/* Word-by-word reveal */
.intro-eva__word { display: inline-block; }
.intro-eva.is-armed .intro-eva__word {
    opacity: 0;
    transform: translateY(0.6em);
    transition: opacity 420ms ease, transform 420ms ease;
}
.intro-eva.is-armed .intro-eva__reveal.is-in .intro-eva__word { opacity: 1; transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
    .intro-eva__blob { animation: none; }
    .intro-eva__row { opacity: 1; transform: none; }
    .intro-eva__word { opacity: 1; transform: none; }
}

.content-flow-gap {
    gap: 4rem;
}

.content-prose-measure {
    max-width: 48rem;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.content-body-frame {
    max-width: 64rem;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.content-medium-height {
    display: block;
    width: 100%;
    height: 18rem;
    min-height: 18rem;
    flex-shrink: 0;
    object-fit: cover;
}

/* image stagger — sm:translate-y-3 / sm:-translate-y-3 have no BS utility */
@media (min-width: 640px) {
    .content-stagger__img-up   { transform: translateY(0.75rem); }
    .content-stagger__img-down { transform: translateY(-0.75rem); }
}

/* dashed border — not a native BS utility */
.content-panel__dashed { border-style: dashed; }

/* decor line — fixed width to match w-16 */
.content-decor__line { width: 4rem; height: 0; display: block; }

/* CTA hover — transform/transition have no BS utility */
.content-cta__lift { transition: transform 150ms ease; }
.content-cta__lift:hover { transform: translateY(-2px); }

.tips-compact__thumb {
    width: 3rem;
    height: 3rem;
}

.tips-compact__thumb--xs {
    width: 1.5rem;
    height: 1.5rem;
}

.tips-compact__min-shrink {
    min-width: 0;
}

/* glossary ladder — figure offset */
.glossary-ladder__fig {
    transition: transform 0.2s ease;
}

.glossary-ladder__fig:hover {
    transform: translateX(4px);
}

/* FAQ v4 — collapsed panel (no display:none: scrollHeight must be measurable after class toggle) */
.support-qna-content-veiled {
    max-height: 0 !important;
    overflow: hidden;
    opacity: 0;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    pointer-events: none;
}

/* Thumb sizes */
.support-qna__thumb-md { width: 2.5rem; height: 2.5rem; }
.support-qna__thumb-sm { width: 2rem; height: 2rem; }

/* Corner blob sizes */
.support-qna__corner-blob-lg { width: 8rem; height: 8rem; }
.support-qna__corner-blob-md { width: 6rem; height: 6rem; }

/* Dot positions */
.support-qna__dot-a { top: 6rem; left: 33%; width: 0.75rem; height: 0.75rem; }
.support-qna__dot-b { top: 10rem; right: 33%; width: 0.5rem; height: 0.5rem; }
.support-qna__dot-c { bottom: 8rem; left: 50%; width: 1rem; height: 1rem; }

/* Stripe positions for gradient bands */
.support-qna__stripe-top { height: 8rem; }
.support-qna__stripe-mid { top: 4rem; height: 6rem; }

/* Blob positions */
.support-qna__blob-a { top: 5rem; left: 3rem; width: 4rem; height: 4rem; }
.support-qna__blob-b { top: 8rem; right: 4rem; width: 3rem; height: 3rem; }
.support-qna__blob-c { bottom: 6rem; left: 25%; width: 5rem; height: 5rem; }

/* Animation delays */
.support-qna__ornament--delay-2 { animation-delay: 0.5s; }
.support-qna__ornament--delay-3 { animation-delay: 0.8s; }
.support-qna__ornament--delay-4 { animation-delay: 1s; }
.support-qna__ornament--delay-5 { animation-delay: 1.2s; }
.support-qna__ornament--delay-6 { animation-delay: 1.5s; }
.support-qna__ornament--delay-7 { animation-delay: 2s; }

@keyframes support-qna-ornament-beat-cycle {
    0%, 100% { opacity: 1; }
    50%       { opacity: .5; }
}
.support-qna__ornament--beat {
    animation: support-qna-ornament-beat-cycle 2s cubic-bezier(.4,0,.6,1) infinite;
}

@keyframes support-qna-ornament-spring-cycle {
    0%, 100% { transform: translateY(0); animation-timing-function: cubic-bezier(.8,0,1,1); }
    50%       { transform: translateY(-25%); animation-timing-function: cubic-bezier(0,0,.2,1); }
}
.support-qna__ornament--spring {
    animation: support-qna-ornament-spring-cycle 1s infinite;
}

@keyframes support-qna-ornament-wave-cycle {
    75%, 100% { transform: scale(2); opacity: 0; }
}
.support-qna__ornament--wave {
    animation: support-qna-ornament-wave-cycle 1s cubic-bezier(0,0,.2,1) infinite;
}

.support-qna__ornament--lift:hover { transform: scale(1.25); transition: transform .2s ease; }

.support-qna__mark--lift:hover { transform: scale(1.1); transition: transform .2s ease; }

.subscription-inline-bar__shell {
    max-width: 48rem;
}