/*
 * Kawasaki-style “video” slides: ~30pt headline rule, high contrast,
 * one idea per beat, yellow accent — scoped to problem + walkthrough + competition + toolkit reels.
 */

.landing-walkthrough .reel-demo-chrome,
.landing-problem .reel-demo-chrome,
.landing-competition .reel-demo-chrome,
.landing-toolkit .reel-demo-chrome,
.landing-environmental .reel-demo-chrome {
    opacity: 0.88;
}

.landing-walkthrough .reel-demo-progress,
.landing-problem .reel-demo-progress,
.landing-competition .reel-demo-progress,
.landing-toolkit .reel-demo-progress,
.landing-environmental .reel-demo-progress {
    height: 3px;
}

.landing-walkthrough .reel-demo-meta,
.landing-problem .reel-demo-meta,
.landing-competition .reel-demo-meta,
.landing-toolkit .reel-demo-meta,
.landing-environmental .reel-demo-meta {
    font-size: 0.58rem;
    letter-spacing: 0.1em;
}

.landing-walkthrough .reel-demo-job,
.landing-problem .reel-demo-job,
.landing-competition .reel-demo-job,
.landing-toolkit .reel-demo-job,
.landing-environmental .reel-demo-job {
    color: #fef08a;
}

/* Headlines — target ~30px+ on phones */
.landing-walkthrough .st-line,
.landing-problem .st-line,
.landing-competition .st-line,
.landing-toolkit .st-line,
.landing-environmental .st-line {
    max-width: 18ch;
    font-size: clamp(1.875rem, 7.5vw, 2.75rem);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -0.03em;
    color: #ffffff;
    text-shadow:
        0 2px 0 rgba(0, 0, 0, 0.85),
        0 4px 24px rgba(0, 0, 0, 0.65);
}

.landing-walkthrough .st-line-sm,
.landing-problem .st-line-sm,
.landing-competition .st-line-sm,
.landing-toolkit .st-line-sm,
.landing-environmental .st-line-sm {
    margin-top: 0.85rem;
    font-size: clamp(1.25rem, 4.2vw, 1.75rem);
    font-weight: 700;
    line-height: 1.2;
    color: rgba(241, 245, 249, 0.94);
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.55);
}

.landing-walkthrough .st-walk-copy,
.landing-problem .st-walk-copy,
.landing-competition .st-walk-copy,
.landing-toolkit .st-walk-copy,
.landing-environmental .st-walk-copy {
    max-width: 16ch;
    font-size: clamp(1.875rem, 7vw, 2.5rem);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: #fff;
    text-shadow:
        0 2px 0 rgba(0, 0, 0, 0.85),
        0 4px 28px rgba(0, 0, 0, 0.6);
}

.landing-walkthrough .st-walk-copy--sub,
.landing-problem .st-walk-copy--sub,
.landing-competition .st-walk-copy--sub,
.landing-toolkit .st-walk-copy--sub,
.landing-environmental .st-walk-copy--sub {
    margin-top: 0.65rem;
    font-size: clamp(1.2rem, 4vw, 1.55rem);
    font-weight: 700;
    color: #e2e8f0;
}

.landing-walkthrough .st-brand-fin,
.landing-problem .st-brand-fin,
.landing-competition .st-brand-fin,
.landing-toolkit .st-brand-fin,
.landing-environmental .st-brand-fin {
    max-width: 16ch;
    font-size: clamp(1.875rem, 7vw, 2.65rem);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: #fff;
    text-shadow:
        0 2px 0 rgba(0, 0, 0, 0.85),
        0 4px 28px rgba(0, 0, 0, 0.55);
}

.landing-walkthrough .st-fin-sub,
.landing-problem .st-fin-sub,
.landing-competition .st-fin-sub,
.landing-toolkit .st-fin-sub,
.landing-environmental .st-fin-sub {
    margin-top: 0.75rem;
    font-size: clamp(1.1rem, 3.5vw, 1.4rem);
    font-weight: 600;
    color: rgba(226, 232, 240, 0.92);
}

.landing-walkthrough .st-line strong,
.landing-problem .st-line strong,
.landing-competition .st-line strong,
.landing-toolkit .st-line strong,
.landing-environmental .st-line strong,
.landing-walkthrough .st-walk-copy strong,
.landing-problem .st-walk-copy strong,
.landing-competition .st-walk-copy strong,
.landing-toolkit .st-walk-copy strong,
.landing-environmental .st-walk-copy strong,
.landing-walkthrough .st-brand-fin strong,
.landing-problem .st-brand-fin strong,
.landing-competition .st-brand-fin strong,
.landing-toolkit .st-brand-fin strong,
.landing-environmental .st-brand-fin strong {
    color: #fef08a;
    font-weight: 900;
}

.landing-walkthrough .st-shout-lg,
.landing-walkthrough .st-shout-md {
    font-size: clamp(1.75rem, 7vw, 2.5rem);
}

/* Slightly smaller device mock so the slide reads first */
.landing-walkthrough .st-walk-phone {
    max-height: min(50vh, 28rem);
}

.landing-walkthrough .st-walk-timer {
    font-size: clamp(2rem, 9vw, 2.85rem);
}

.landing-walkthrough .st-walk-session,
.landing-walkthrough .st-walk-timeline,
.landing-walkthrough .st-walk-reward {
    border-color: rgba(255, 255, 255, 0.14);
}

.landing-walkthrough .st-rec-line {
    font-size: 1rem;
}

/* Near-black slide canvas */
.landing-walkthrough .st-clip1-bg,
.landing-walkthrough .st-clip--2 .st-clip-bg,
.landing-walkthrough .st-clip--3 .st-clip-bg,
.landing-walkthrough .st-clip--4 .st-clip-bg,
.landing-walkthrough .st-clip--5 .st-clip-bg {
    background: #000000 !important;
}

.landing-problem .st-clip--problem .st-clip-bg {
    background: #000000 !important;
}

.landing-competition .st-clip--competition .st-clip-bg {
    background: #000000 !important;
}

.landing-toolkit .st-clip--toolkit .st-clip-bg {
    background: #000000 !important;
}

.landing-problem .st-pr-tab {
    font-size: 0.68rem;
    padding: 0.45rem 0.65rem;
}

.landing-problem .st-pr-bubble {
    font-size: clamp(1rem, 3.8vw, 1.2rem);
}