html,
body {
    font-family: var(--font-main);
    background: var(--dark-bg);
    color: var(--dark-text);
}

body {
    overflow: hidden;
}

body.menu-open {
    overflow: hidden;
}

.app-shell {
    position: relative;
    min-height: 100dvh;
    background: var(--bg);
}

.presentation {
    height: 100dvh;
    overflow-y: auto;
    scroll-snap-type: y mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
}

.presentation::-webkit-scrollbar {
    display: none;
}

.slide {
    position: relative;
    width: 100%;
    min-height: 100dvh;
    overflow: hidden;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    isolation: isolate;
}

.slide--light {
    background: #f3f5f7;
    color: #11151a;
}

.slide--dark {
    background: #090b0e;
    color: #f4f6f8;
}

.slide__inner {
    position: relative;
    z-index: 5;
    width: var(--container);
    min-height: 100dvh;
    margin-inline: auto;
    padding: 32px 0 42px;
}

.eyebrow,
.section-topline,
.slide-index {
    font-size: 11px;
    line-height: 1.25;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.eyebrow {
    color: var(--muted);
}

.lead {
    font-size: clamp(17px, 1.2vw, 24px);
    line-height: 1.55;
    color: var(--muted);
    max-width: 620px;
}

h1,
h2,
h3 {
    font-weight: 500;
    letter-spacing: -.045em;
}

h1,
h2 {
    text-wrap: balance;
}

::selection {
    background: rgba(0, 141, 213, .22);
}

[data-lucide] {
    width: 18px;
    height: 18px;
    stroke-width: 1.65;
}

.reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .9s var(--ease), transform .9s var(--ease);
}

.reveal--delay-1 {
    transition-delay: .12s;
}

.reveal--delay-2 {
    transition-delay: .24s;
}

.reveal--delay-3 {
    transition-delay: .36s;
}

.reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

html[data-theme="dark"] .slide--light {
    background: #f3f5f7;
    color: #11151a;
}
