/* GreenScale pitch deck - 16:9 slides, arrow-key navigation */
:root {
    --ink: #0a0e14;
    --ink-2: #1f2937;
    --paper: #fafaf7;
    --green: #16a34a;
    --green-soft: #dcfce7;
    --green-deep: #064e3b;
    --amber: #f59e0b;
    --red: #dc2626;
    --gray: #6b7280;
    --rule: #e5e7eb;
    --serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
    --sans: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
    --mono: 'JetBrains Mono', ui-monospace, Menlo, monospace;
}
* { box-sizing: border-box; }
html, body {
    margin: 0; padding: 0; height: 100%;
    background: #000; color: var(--ink);
    font-family: var(--sans);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow: hidden;
}
.deck {
    position: relative;
    width: 100vw; height: 100vh;
    display: flex; align-items: center; justify-content: center;
}
.slide {
    position: absolute;
    width: min(95vw, 1280px);
    aspect-ratio: 16/9;
    background: var(--paper);
    box-shadow: 0 20px 60px rgba(0,0,0,0.6);
    border-radius: 6px;
    padding: 56px 72px;
    display: flex; flex-direction: column;
    opacity: 0; transform: translateX(40px);
    transition: opacity 0.35s, transform 0.35s;
    pointer-events: none;
    overflow: hidden;
}
.slide.active {
    opacity: 1; transform: translateX(0);
    pointer-events: auto;
}
.slide.prev { transform: translateX(-40px); }

.slide-num {
    position: absolute; bottom: 18px; right: 24px;
    font-family: var(--mono); font-size: 12px; color: var(--gray);
}
.slide-brand {
    position: absolute; bottom: 18px; left: 24px;
    font-size: 12px; color: var(--gray);
    display: flex; align-items: center; gap: 8px;
}
.slide-brand-logo {
    width: 18px; height: 18px; border-radius: 5px;
    background: linear-gradient(135deg, var(--green) 0%, #14b8a6 100%);
    display: flex; align-items: center; justify-content: center;
    color: white; font-weight: 800; font-size: 10px;
}

.eyebrow {
    font-family: var(--sans); font-size: 12px;
    color: var(--green); font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.12em;
    margin: 0 0 16px 0;
}
h1.title {
    font-family: var(--serif);
    font-size: clamp(40px, 5.5vw, 72px);
    font-weight: 700;
    line-height: 1.05; margin: 0 0 18px 0;
    letter-spacing: -0.025em;
}
h1.title em {
    font-style: italic; color: var(--green); font-weight: 700;
}
h2.head {
    font-family: var(--serif);
    font-size: clamp(28px, 3.6vw, 52px);
    font-weight: 700;
    margin: 0 0 22px 0; letter-spacing: -0.02em;
    line-height: 1.1;
}
h3.subhead {
    font-family: var(--sans);
    font-size: clamp(16px, 1.6vw, 22px);
    color: var(--gray); margin: 0 0 28px 0;
    font-weight: 500;
}
p.body, ul.body, ol.body {
    font-family: var(--serif);
    font-size: clamp(16px, 1.5vw, 22px);
    line-height: 1.5; color: var(--ink-2);
    margin: 0 0 14px 0;
}
ul.body, ol.body { padding-left: 20px; }
ul.body li, ol.body li { margin-bottom: 8px; }
ul.body li::marker { color: var(--green); }

.tag {
    display: inline-block;
    padding: 4px 10px; border-radius: 999px;
    font-family: var(--mono); font-size: 11px;
    background: var(--green-soft); color: var(--green-deep);
    border: 1px solid var(--green);
}
.kicker {
    background: var(--ink); color: var(--paper);
    padding: 5px 14px; border-radius: 4px;
    font-family: var(--mono); font-size: 13px;
    font-weight: 500;
    display: inline-block;
}

.numbers {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px;
    margin-top: 22px;
}
.numbers .n-val {
    font-family: var(--serif); font-size: clamp(40px, 4.5vw, 64px);
    font-weight: 700; color: var(--green); line-height: 1; letter-spacing: -0.02em;
}
.numbers .n-lab {
    font-family: var(--sans); font-size: 13px; color: var(--gray);
    margin-top: 6px; line-height: 1.4;
}

.compare {
    display: grid; grid-template-columns: 1fr 1fr; gap: 24px;
    margin-top: 16px;
}
.compare > div {
    border: 1px solid var(--rule); border-radius: 8px;
    padding: 18px;
}
.compare h4 { margin: 0 0 10px 0; font-family: var(--sans); font-size: 13px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--gray); }
.compare ul { padding-left: 20px; margin: 0; font-family: var(--serif); font-size: 16px; line-height: 1.5; }
.compare ul li { margin-bottom: 6px; color: var(--ink-2); }
.compare.win > div:last-child { background: var(--green-soft); border-color: var(--green); }
.compare.win > div:last-child h4 { color: var(--green-deep); }

.archfig {
    border: 1px solid var(--rule); border-radius: 10px;
    padding: 20px; background: white;
    font-family: var(--mono); font-size: 13px;
    color: var(--ink); white-space: pre;
    line-height: 1.4; overflow: auto;
}

.fact-list { display: grid; gap: 14px; margin-top: 14px; }
.fact { display: grid; grid-template-columns: 80px 1fr; gap: 18px; align-items: baseline; }
.fact .f-key { font-family: var(--mono); font-size: 13px; color: var(--green); font-weight: 600; }
.fact .f-val { font-family: var(--serif); font-size: clamp(15px, 1.4vw, 18px); color: var(--ink-2); line-height: 1.4; }

.progress {
    position: fixed; left: 0; bottom: 0;
    height: 3px; background: var(--green);
    transition: width 0.3s;
    z-index: 50;
}
.nav-hint {
    position: fixed; top: 14px; right: 16px;
    font-family: var(--mono); font-size: 11px;
    color: rgba(255,255,255,0.5);
    background: rgba(0,0,0,0.4); padding: 6px 10px; border-radius: 4px;
    z-index: 50; backdrop-filter: blur(8px);
}
.nav-link {
    position: fixed; top: 14px; left: 16px;
    font-family: var(--sans); font-size: 12px;
    color: rgba(255,255,255,0.7);
    text-decoration: none;
    padding: 6px 10px; border-radius: 4px;
    background: rgba(0,0,0,0.4); backdrop-filter: blur(8px);
    z-index: 50;
}
.nav-link:hover { color: white; }

@media print {
    html, body { background: white; overflow: visible; height: auto; }
    .nav-hint, .nav-link, .progress { display: none; }
    .deck { display: block; }
    .slide {
        page-break-after: always;
        position: relative !important;
        opacity: 1 !important; transform: none !important;
        box-shadow: none; margin: 0 auto 24px auto;
        pointer-events: auto;
    }
}