/* Light restyle for the existing blog / resources / privacy / AI pages.
 * Loaded after each page's own <style>, so it only swaps colors and fonts to
 * match the white site. Layout and copy are untouched. */
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 300 800; font-display: swap; src: url("/assets/fonts/outfit-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: "Outfit"; font-style: normal; font-weight: 300 800; font-display: swap; src: url("/assets/fonts/outfit-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; }
:root {
  --bg: #ffffff;
  --surface: #f7f7f8;
  --border: #e6e6e9;
  --heading: #17181a;
  --body: #3d3e42;
  --accent: #2f5cff;
  --accent-hover: #1f45d6;
}
body { font-family: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; background: #ffffff; color: var(--body); }
.nav { background: rgba(255, 255, 255, 0.86); -webkit-backdrop-filter: blur(14px) saturate(1.4); backdrop-filter: blur(14px) saturate(1.4); border-bottom: 1px solid var(--border); }
.nav-logo { color: var(--heading); display: inline-flex; align-items: center; letter-spacing: -0.02em; }
.nav-logo::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #cfe0ff 0%, #2f5cff 55%, #1b2f9e 100%); box-shadow: 0 2px 8px rgba(47, 92, 255, 0.4); margin-right: 10px; }
.nav-logo span { color: var(--heading); }
.nav-back { color: var(--accent); }
.nav-back:hover { color: var(--accent-hover); }
h1, h2, h3 { letter-spacing: -0.025em; }
.article-meta, .page-meta, .post-card .meta { color: #6b6b70; }
.article-intro, .callout + p, .cta-box p { color: #55565b; }
.cta-box { background: #f4f6ff; border: 1px solid #dfe5ff; }
.cta-btn { background: #17181a; color: #ffffff; border-radius: 999px; }
.cta-btn:hover { background: var(--accent); color: #ffffff; }
.callout { background: var(--surface); border: 1px solid var(--border); }
.post-card { background: #ffffff; }
.post-card:hover { box-shadow: 0 10px 28px rgba(23, 24, 26, 0.06); }
.footer { color: #6b6b70; border-top: 1px solid var(--border); }
/* Footer links match the homepage footer (#6b6b70, 5.3:1 on white). opacity:1 undoes each page's old .7 fade. */
.flink { color: #6b6b70; opacity: 1; }
.flink:hover { color: var(--heading); opacity: 1; }
a { color: var(--accent); }
a:hover { color: var(--accent-hover); }
.nav a.nav-logo, .post-card, .post-card:hover { color: inherit; }
.nav a.nav-logo { color: var(--heading); }
[style*="color:#999"] { color: #6b6b70 !important; }

/* Tap targets on phones (Fix 1): nav links and footer links get a 44px hit area. */
.nav-logo, .nav-back { display: inline-flex; align-items: center; min-height: 44px; }
.flink { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
@media (max-width: 899px) { .nav { padding-top: 12px; padding-bottom: 12px; } }
