:root {
    font-family: Arial, Helvetica, sans-serif;
    color: #073f49;
    background: #071d45;
    --navy: #15478f;
    --teal: #073f49;
    --red: #f14950;
    --gold: #f0a20e;
    --muted: #59677e;
}

* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
button, a { font: inherit; }

.presentation-body {
    min-width: 320px;
    background: #071d45;
}

.presentation,
.presentation-slide {
    position: absolute;
    inset: 0;
}

.presentation-slide {
    display: none;
    place-items: center;
    background: #071d45;
}

.presentation-slide.is-active { display: grid; }

.slide-stage {
    position: relative;
    width: min(100vw, calc(100vh * 16 / 9));
    height: min(100vh, calc(100vw * 9 / 16));
    overflow: hidden;
    background:
        linear-gradient(135deg, transparent 0 80%, rgba(21, 71, 143, .018) 80% 80.25%, transparent 80.25%),
        #fff;
    box-shadow: 0 22px 70px rgba(0, 0, 0, .28);
}

.slide-header {
    position: absolute;
    top: 5.6%;
    left: 4.8%;
    right: 4.8%;
    height: 7.5%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.institution-strip { width: 42%; height: auto; display: block; }
.slide-header span { align-self: flex-start; color: var(--red); font-size: clamp(13px, 1.25vw, 20px); font-weight: 800; }

.slide-footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 5.7%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: .2% 5.2% 0;
    border-top: clamp(3px, .34vw, 6px) solid var(--gold);
    background: var(--navy);
    color: #fff;
    font-size: clamp(10px, 1vw, 15px);
}

.cover-stage { display: grid; place-items: center; }
.cover-strip { position: absolute; top: 7%; left: 5%; width: 51%; }
.cover-copy { text-align: center; transform: translateY(-1.5%); }
.cover-copy h1 { margin: 0; font-size: clamp(70px, 11vw, 166px); line-height: .9; letter-spacing: -.05em; color: var(--teal); }
.cover-title { margin: 3.6% 0 0; color: var(--navy); font-size: clamp(24px, 4.1vw, 62px); font-weight: 800; letter-spacing: .015em; }
.cover-course { margin: 5.2% 0 0; color: var(--red); font-size: clamp(15px, 2.25vw, 34px); font-weight: 800; letter-spacing: .04em; }
.cover-school { margin: 2% 0 0; color: var(--muted); font-size: clamp(13px, 1.65vw, 25px); }
.present-button {
    position: absolute;
    left: 50%;
    bottom: 10%;
    translate: -50% 0;
    padding: .65em 1.2em;
    border: 1px solid rgba(21, 71, 143, .35);
    border-radius: 999px;
    background: #fff;
    color: var(--navy);
    font-size: clamp(11px, 1.1vw, 16px);
    font-weight: 700;
    cursor: pointer;
}
.present-button:hover { background: #f3f7fc; }

.question-stage { position: absolute; inset: 21% 7.8% 10%; text-align: center; }
.lead-copy { margin: 0; color: var(--muted); font-size: clamp(18px, 2.7vw, 42px); }
.question-flow { display: grid; grid-template-columns: 1.25fr .35fr .5fr .35fr 1.55fr; align-items: center; gap: 1.5%; margin-top: 11%; }
.question-flow strong { color: var(--teal); font-size: clamp(22px, 3.1vw, 48px); white-space: nowrap; }
.question-flow strong:last-child { color: var(--navy); }
.question-flow b { color: var(--red); font-size: clamp(62px, 9vw, 138px); line-height: .8; }
.flow-arrow { color: var(--gold); font-size: clamp(32px, 4.5vw, 70px); font-weight: 300; }
.question-rule { width: 80%; height: 3px; margin: 6.5% auto 0; background: #c8d1dd; }
.question-stage h2 { margin: 4.5% 0 0; color: var(--teal); font-size: clamp(20px, 2.45vw, 38px); }

.system-stage { position: absolute; inset: 21% 7% 10%; text-align: center; }
.system-stage h2 { margin: 0; color: var(--teal); font-size: clamp(64px, 9vw, 138px); line-height: .85; }
.system-stage h3 { margin: 3% 0 0; color: var(--navy); font-size: clamp(27px, 4vw, 60px); }
.system-stage p { margin: 4% 0 0; color: var(--muted); font-size: clamp(17px, 2.3vw, 36px); }
.system-points { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4%; margin-top: 6.5%; color: var(--navy); font-size: clamp(15px, 2vw, 30px); }
.system-action { margin-top: 8%; color: var(--red); font-size: clamp(22px, 3vw, 46px); font-weight: 800; letter-spacing: .015em; }

.video-stage { padding: 0; background: #08182c; }
.video-stage video { display: block; width: 100%; height: 100%; border: 0; background: #08182c; object-fit: contain; }

.evidence-stage { position: absolute; inset: 20% 7% 9%; text-align: center; }
.evidence-stage h2 { margin: 0; color: var(--teal); font-size: clamp(27px, 3.6vw, 56px); }
.evidence-grid { display: grid; grid-template-columns: 1fr 1.12fr 1fr; gap: 4%; align-items: center; margin-top: 6%; }
.evidence-grid > div { display: grid; place-items: center; align-content: center; min-height: 27vh; }
.evidence-grid strong { color: var(--navy); font-size: clamp(55px, 7.8vw, 120px); line-height: 1; }
.evidence-grid span { margin-top: 8%; color: var(--teal); font-size: clamp(13px, 1.7vw, 26px); font-weight: 800; line-height: 1.12; }
.evidence-featured { padding: 6% 2%; border: clamp(3px, .3vw, 5px) solid var(--gold); border-radius: 22px; }
.evidence-grid .evidence-featured strong { color: var(--red); }
.evidence-stage > p { margin: 5.5% 0 0; color: var(--muted); font-size: clamp(10px, 1.1vw, 17px); }

.ready-stage { position: absolute; inset: 23% 8% 10%; text-align: center; }
.ready-stage h2 { margin: 0; color: var(--teal); font-size: clamp(38px, 5.3vw, 82px); }
.ready-stage > a { display: inline-block; margin-top: 4%; color: var(--navy); font-size: clamp(34px, 4.6vw, 70px); font-weight: 800; text-decoration: none; }
.ready-stage > p { margin: 4% 0 0; color: var(--muted); font-size: clamp(18px, 2.35vw, 36px); }
.ready-points { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4%; margin-top: 7%; color: var(--navy); font-size: clamp(15px, 1.9vw, 29px); }
.ready-stage small { display: block; margin-top: 5%; color: var(--muted); font-size: clamp(11px, 1.2vw, 18px); }
.ready-stage small a { color: var(--navy); }

.presentation-exit,
.presentation-controls {
    position: fixed;
    z-index: 20;
    opacity: .18;
    transition: opacity 160ms ease;
}
.presentation-exit:hover,
.presentation-controls:hover,
.presentation-exit:focus,
.presentation-controls:focus-within { opacity: 1; }
.presentation-exit { top: 14px; right: 18px; padding: 8px 11px; border-radius: 8px; background: rgba(7, 29, 69, .86); color: #fff; font-size: 13px; text-decoration: none; }
.presentation-controls { left: 50%; bottom: 11px; translate: -50% 0; display: flex; align-items: center; gap: 9px; padding: 5px 8px; border-radius: 999px; background: rgba(7, 29, 69, .88); color: #fff; }
.presentation-controls button { width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: inherit; font-size: 24px; line-height: 1; cursor: pointer; }
.presentation-controls button:hover { background: rgba(255, 255, 255, .14); }
.presentation-controls button:disabled { opacity: .25; cursor: default; }
.presentation-controls span { min-width: 44px; text-align: center; font-size: 12px; }

@media (max-aspect-ratio: 4 / 3) {
    .institution-strip { width: 48%; }
    .question-flow { gap: .5%; }
}

@media (prefers-reduced-motion: reduce) {
    * { scroll-behavior: auto !important; transition: none !important; }
}

@media print {
    html, body { height: auto; overflow: visible; background: #fff; }
    .presentation, .presentation-slide { position: static; }
    .presentation-slide { display: grid !important; break-after: page; }
    .slide-stage { width: 100vw; height: 56.25vw; box-shadow: none; }
    .presentation-exit, .presentation-controls, .present-button { display: none; }
}
