@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400..800&display=swap');
/* Central accent + surface tokens; every component reads from these. */
@import url('/css/components/layout.css');
@import url('/css/components/nav-mobile.css');
@import url('/css/components/cards.css');
@import url('/css/components/forms.css');
@import url('/css/components/toggle.css');
@import url('/css/components/markdown.css');
@import url('/css/components/submit.css');
@import url('/css/components/tag-select.css');
@import url('/css/components/search-select.css');
@import url('/css/components/detail.css');
@import url('/css/components/series.css');
@import url('/css/components/payment.css');
@import url('/css/components/perks.css');
@import url('/css/components/modal.css');
@import url('/css/components/misc.css');
@import url('/css/components/features.css');
@import url('/css/components/faq.css');
@import url('/css/components/cta.css');
@import url('/css/components/phone.css');
@import url('/css/components/phone-screens.css');
@import url('/css/components/mark.css');
@font-face {
    font-family: 'Jelek Type';
    src: url('/fonts/jelek-type.otf') format('opentype');
    font-weight: 400;
    font-display: swap;
}

:root {
    --accent: #0d48b5;
    --accent-strong: #0a3a92;
    --accent-soft: #e7edfa;
    --ink: #000000;
    --ink-soft: #57534e;
    --muted: #8a8378;
    --line: #e7e2da;
    --surface: #ffffff;
    --surface-2: #faf8f5;
    --bg: #f2f1ed;
    --radius: 14px;
    --radius-sm: 9px;
    --shadow: 0 1px 2px rgba(28, 25, 23, 0.05), 0 8px 24px rgba(28, 25, 23, 0.06);
    --wrap: 1120px;
    /* Social marks come from the Simple Icons CDN, tinted to the muted ink so they stay quiet. */
    --ico-instagram: url('https://cdn.simpleicons.org/instagram/8a8378');
    --ico-twitter: url('https://cdn.simpleicons.org/x/8a8378');
    --ico-threads: url('https://cdn.simpleicons.org/threads/8a8378');
}

* {
    box-sizing: border-box;
}

/* Kill the macOS/iOS rubber-band bounce at the scroll edges. */
html {
    overscroll-behavior: none;
}

body {
    margin: 0;
    font-family: 'Montserrat', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    background: var(--bg);
    color: var(--ink);
    line-height: 1.55;
}

a {
    color: inherit;
    text-decoration: none;
}

h1,
h2,
h3 {
    line-height: 1.2;
    margin: 0 0 0.4em;
}

h1 {
    font-family: 'Jelek Type', 'Montserrat', system-ui, sans-serif;
    font-weight: 400;
}

em {
    color: var(--accent);
    font-style: normal;
}

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

.wrap {
    max-width: var(--wrap);
    margin: 0 auto;
    padding: 0 20px;
}

.narrow {
    max-width: 720px;
}

.center {
    text-align: center;
}

.site-main {
    min-height: 60vh;
}
