/* Episode Atlas shared design tokens and document-level defaults. */

:root {
    --page-bg: #f6f1e7;
    --page-bg-alt: #edf3f2;
    --ink-strong: #1b1a17;
    --ink-muted: #4b4b4b;
    --brand-ink: #123f3a;
    --brand-accent: #e3922b;
    --brand-accent-strong: #c8761b;
    --brand-cool: #1f7a76;
    --card-bg: #ffffff;
    --border-soft: rgba(20, 20, 20, 0.08);
    --shadow-soft: 0 12px 30px rgba(15, 18, 19, 0.08);
    --shadow-strong: 0 18px 40px rgba(15, 18, 19, 0.14);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    min-height: 100%;
}

body {
    font-family: "Outfit", "Segoe UI", Tahoma, sans-serif;
    color: var(--ink-strong);
    background: radial-gradient(circle at 10% 10%, rgba(227, 146, 43, 0.15), transparent 42%),
        radial-gradient(circle at 80% 0%, rgba(31, 122, 118, 0.15), transparent 45%),
        linear-gradient(180deg, var(--page-bg), var(--page-bg-alt));
}

h1,
h2 {
    color: var(--brand-ink);
    font-family: "Space Grotesk", "Outfit", sans-serif;
    margin: 0 0 0.65rem;
}

h1 {
    font-size: clamp(1.8rem, 3.8vw, 2.6rem);
}

h2 {
    font-size: clamp(1.2rem, 2.4vw, 1.55rem);
}

p {
    line-height: 1.7;
    color: var(--ink-muted);
    margin: 0 0 0.85rem;
}

a {
    color: var(--brand-ink);
}