/* Hallmark · genre: modern-minimal · nav: N5 floating-pill · footer: Ft1 mast-headed · design-system: design.md · designed-as-app
 * Shared chrome identity for all pages (2026-07). This file is the single,
 * SELF-CONTAINED source of truth for nav, footer, quote-box and paper — the
 * per-page embedded styles contain no chrome rules at all since the dead-CSS
 * cleanup. Loaded AFTER each page's embedded <style>. See /design.md. */

/* ===== Self-hosted brand fonts (downloaded from Google Fonts, OFL-licensed) ===== */
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 700; font-display: swap; src: url('../assets/fonts/Archivo-700-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 700; font-display: swap; src: url('../assets/fonts/Archivo-700-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 800; font-display: swap; src: url('../assets/fonts/Archivo-800-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 800; font-display: swap; src: url('../assets/fonts/Archivo-800-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 900; font-display: swap; src: url('../assets/fonts/Archivo-900-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 900; font-display: swap; src: url('../assets/fonts/Archivo-900-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'DM Sans'; font-style: italic; font-weight: 400; font-display: swap; src: url('../assets/fonts/DMSans-400i-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'DM Sans'; font-style: italic; font-weight: 400; font-display: swap; src: url('../assets/fonts/DMSans-400i-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'DM Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('../assets/fonts/DMSans-400-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'DM Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('../assets/fonts/DMSans-400-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'DM Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url('../assets/fonts/DMSans-500-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'DM Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url('../assets/fonts/DMSans-500-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'DM Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('../assets/fonts/DMSans-700-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'DM Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('../assets/fonts/DMSans-700-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Canonical values for every token the chrome uses — identical to the per-page
   :root blocks, re-declared here so a page missing one can never break the
   shared chrome. */
:root {
    --paper: #FDFCFE; --white: #FFFFFF;
    --primary: #7B4397; --primary-dark: #5E2E78;
    --accent: #A4D233; --accent-dark: #8AB920;
    --dark: #2D1B3D;
    --gray-100: #F5F3F7; --gray-200: #E5E0EB; --gray-400: #A89DB8;
    --gray-600: #7A6D8E; --gray-700: #5A4D6E; --gray-800: #2D2D44;
    --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem;
    --space-6: 1.5rem; --space-8: 2rem; --space-12: 3rem;
    --radius: 0.5rem;
    --shadow-lg: 0 10px 15px -3px rgba(45, 27, 61, 0.1), 0 4px 6px -4px rgba(45, 27, 61, 0.1);
    --transition: 200ms ease;
}
body { background: var(--paper); }
body.canvas-gray { background: var(--gray-100); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }

/* ===== N5 floating pill nav ===== */
.header {
    position: fixed; z-index: 1000;
    top: var(--space-4); left: 50%; right: auto; transform: translateX(-50%);
    max-width: min(760px, calc(100vw - 2rem)); width: max-content;
    border-radius: 999px;
    background: rgba(253, 252, 254, 0.82);
    backdrop-filter: blur(14px) saturate(120%);
    -webkit-backdrop-filter: blur(14px) saturate(120%);
    border: 1px solid var(--gray-200);
    box-shadow: 0 8px 24px -12px rgba(45, 27, 61, 0.25);
}
.header .container { width: auto; max-width: none; padding: 0 var(--space-4); }
.header .header-inner { display: flex; align-items: center; justify-content: space-between; padding: var(--space-2) 0; gap: var(--space-6); }
.header .logo img { height: 34px; width: auto; display: block; }
.nav { display: none; }
.header .nav-list { display: flex; align-items: center; gap: var(--space-4); list-style: none; margin: 0; padding: 0; }
.header .nav-list li { margin: 0; padding: 0; line-height: 1.5; }
.header .nav-link { display: inline-block; font-size: 0.9rem; font-weight: 500; line-height: 1.5; color: var(--gray-700); padding: var(--space-2) 0; position: relative; white-space: nowrap; }
.header .nav-link:hover, .header .nav-link.active { color: var(--primary); }
.header .nav-link::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: var(--accent); transition: width var(--transition); }
.header .nav-link:hover::after, .header .nav-link.active::after { width: 100%; }
.header .nav-cta { background: var(--accent); padding: var(--space-2) var(--space-4); border-radius: 999px; font-weight: 700; white-space: nowrap; }
.header .nav-cta:hover { background: var(--accent-dark); }
.header .nav-cta::after { display: none; }
.header .nav-link.nav-cta, .header .nav-link.nav-cta:hover { color: var(--dark); }

/* dropdown */
.nav-item { position: relative; }
.nav-dropdown { position: absolute; top: 100%; left: 50%; min-width: 220px; background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: var(--space-2) 0; margin: 0; opacity: 0; visibility: hidden; transform: translateX(-50%) translateY(10px); transition: opacity var(--transition), visibility var(--transition), transform var(--transition); list-style: none; }
.nav-item:hover .nav-dropdown { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.nav-dropdown li { margin: 0; padding: 0; line-height: 1.5; }
.nav-dropdown a { display: block; padding: var(--space-2) var(--space-4); color: var(--gray-700); font-size: 0.9rem; }
.nav-dropdown a:hover { background: var(--gray-100); color: var(--primary); }

/* mobile */
.menu-toggle { display: flex; flex-direction: column; gap: 5px; padding: var(--space-2); background: none; border: none; cursor: pointer; }
.menu-toggle span { display: block; width: 24px; height: 2px; background: var(--dark); }
.mobile-nav { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: var(--white); padding: calc(34px + var(--space-8) + var(--space-6)) var(--space-4) var(--space-4); overflow-y: auto; z-index: 900; }
.mobile-nav.active { display: block; }
.mobile-nav-list { list-style: none; margin: 0; padding: 0; }
.mobile-nav-list a { display: block; padding: var(--space-3) 0; font-size: 1.1rem; color: var(--dark); border-bottom: 1px solid var(--gray-200); }
.mobile-nav-list .submenu { padding-left: var(--space-4); list-style: none; }
.mobile-nav-list .submenu a { font-size: 1rem; color: var(--gray-700); }
.mobile-nav-cta { display: block; text-align: center; background: var(--accent); color: var(--dark); border-radius: var(--radius); border-bottom: none !important; margin: var(--space-2) 0 var(--space-4); font-weight: 700; }
@media (min-width: 1024px) { .nav { display: block; } .menu-toggle { display: none; } }

/* ===== quote-box: hairline + accent-square heading marker ===== */
.quote-box { border: 1px solid var(--gray-200); }
.quote-box h5 { display: flex; align-items: center; gap: var(--space-3); }
.quote-box h5::before { content: ''; width: 10px; height: 10px; background: var(--accent); border-radius: 2px; flex-shrink: 0; }

/* ===== Ft1 mast-headed footer ===== */
.footer { background: var(--dark); color: var(--gray-400); padding: var(--space-12) 0 var(--space-8); }
.footer-mast { display: flex; align-items: center; gap: var(--space-6); flex-wrap: wrap; margin-bottom: var(--space-8); }
.footer-mast img { height: 44px; width: auto; display: block; filter: brightness(0) invert(1); }
.footer-tagline { font-size: 0.95rem; color: var(--gray-400); margin: 0; max-width: 52ch; }
.footer-links-row { font-size: 0.9rem; line-height: 2.1; color: var(--gray-600); margin-bottom: var(--space-8); }
.footer-links-row a { color: var(--gray-400); white-space: nowrap; }
.footer-links-row a:hover { color: var(--accent); }
.footer-meta { font-size: 0.85rem; color: var(--gray-400); margin-bottom: var(--space-2); }
.footer-meta a { color: var(--gray-400); text-decoration: underline; }
.footer-meta a:hover { color: var(--accent); }
p.footer-meta:nth-of-type(2) { border-top: 1px solid var(--gray-800); padding-top: var(--space-6); margin-top: var(--space-6); }
