/* misquoted.ai — Shared CSS for marketing-site mockups */
/* Source of truth: /DESIGN.md (do not deviate from these tokens) */

@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display&family=JetBrains+Mono:wght@400;500;600;700&family=Source+Serif+4:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400;1,500&display=swap');

:root {
  --navy:#0F1B2D;
  --navy-90:#1E2D42;
  --navy-70:#3D4F66;
  --navy-50:#6B7A8D;
  --navy-30:#9AA6B4;
  --navy-10:#D6DCE3;
  --navy-5:#EDF0F3;
  --signal:#E63946;
  --verified:#2D936C;
  --quote-yellow:#EAB308;
  --query:#7C3AED;
  --cream:#F0E6DA;
  --cream-warm:#F5EDE3;
  --surface:#F8F9FA;
  --surface-alt:#E2E8F0;
  --content-max:1120px;
  --content-narrow:900px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  font-family:'Source Serif 4',Georgia,serif;
  color:var(--navy);
  background:#fff;
  -webkit-font-smoothing:antialiased;
  font-feature-settings:"kern" 1,"liga" 1;
  line-height:1.5;
}

/* Type utilities */
.mono{font-family:'JetBrains Mono',Menlo,monospace;font-feature-settings:"tnum" 1}
.serif{font-family:'DM Serif Display',Georgia,serif}
.sans{font-family:system-ui,-apple-system,sans-serif}
.body-serif{font-family:'Source Serif 4',Georgia,serif}

/* Container */
.page-wrap{max-width:var(--content-max);margin:0 auto;padding:0 24px}
.page-wrap-narrow{max-width:var(--content-narrow);margin:0 auto;padding:0 24px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:6px;font-family:system-ui,sans-serif;font-size:13px;font-weight:500;cursor:pointer;text-decoration:none;border:none;letter-spacing:0.01em;line-height:1}
.btn-primary{background:var(--navy);color:#fff}
.btn-primary:hover{background:var(--navy-90)}
.btn-ghost{background:transparent;color:var(--navy);border:1px solid var(--navy-10)}
.btn-ghost:hover{background:var(--surface)}
.btn-cream{background:var(--cream);color:var(--navy)}
.btn-cream:hover{background:var(--cream-warm)}
.btn-lg{padding:13px 24px;font-size:14px}
.btn-sm{padding:7px 14px;font-size:12px}

/* ────────────────────────── Site Header ────────────────────────── */
.site-header{position:sticky;top:0;z-index:200;background:rgba(255,255,255,0.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--surface-alt)}
.site-header-inner{max-width:var(--content-max);margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:32px}
.site-logo{font-family:'DM Serif Display',Georgia,serif;font-size:22px;color:var(--navy);text-decoration:none;display:inline-flex;align-items:baseline;line-height:1}
.site-logo .logo-tld{color:var(--navy-50)}
.site-nav{display:flex;gap:22px;flex:1;justify-content:center}
.site-nav a{font-family:system-ui,sans-serif;font-size:13px;color:var(--navy-70);text-decoration:none;font-weight:500;letter-spacing:0.01em}
.site-nav a:hover{color:var(--navy)}
.site-nav a.active{color:var(--navy);font-weight:600}
.site-actions{display:flex;align-items:center;gap:14px}
.site-login{font-family:system-ui,sans-serif;font-size:13px;color:var(--navy-70);text-decoration:none;font-weight:500}
.site-login:hover{color:var(--navy)}
.site-cta{padding:9px 18px;background:var(--navy);color:#fff;border-radius:6px;font-family:system-ui,sans-serif;font-size:13px;font-weight:500;text-decoration:none}
.site-cta:hover{background:var(--navy-90)}

/* ────────────────────────── Site Footer ────────────────────────── */
.site-footer{background:var(--navy);color:rgba(255,255,255,0.7);margin-top:96px;padding:64px 0 32px}
.site-footer-inner{max-width:var(--content-max);margin:0 auto;padding:0 24px}
.site-footer-cols{display:grid;grid-template-columns:repeat(6,1fr);gap:32px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,0.1)}
.footer-col h4{font-family:system-ui,sans-serif;font-size:11px;text-transform:uppercase;letter-spacing:0.12em;color:rgba(255,255,255,0.4);font-weight:600;margin-bottom:14px}
.footer-col a{display:block;font-family:system-ui,sans-serif;font-size:13px;color:rgba(255,255,255,0.7);text-decoration:none;padding:5px 0;line-height:1.4}
.footer-col a:hover{color:#fff}
.site-footer-bottom{padding-top:32px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.site-footer-brand{display:flex;align-items:baseline;gap:14px}
.footer-logo{font-family:'DM Serif Display',Georgia,serif;font-size:18px;color:#fff}
.footer-tag{font-family:system-ui,sans-serif;font-size:11px;color:rgba(255,255,255,0.4);text-transform:uppercase;letter-spacing:0.1em}
.site-footer-legal{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.site-footer-legal a{font-family:system-ui,sans-serif;font-size:12px;color:rgba(255,255,255,0.5);text-decoration:none}
.site-footer-legal a:hover{color:#fff}
.site-footer-legal span{font-family:system-ui,sans-serif;font-size:12px;color:rgba(255,255,255,0.4)}

/* ────────────────────────── Common bits ────────────────────────── */
.chk{color:var(--verified)}
.xs{color:var(--navy-30)}
.eyebrow{font-family:'JetBrains Mono',Menlo,monospace;font-size:11px;text-transform:uppercase;letter-spacing:0.14em;color:var(--navy-50);font-weight:600}
.section-title{font-family:'DM Serif Display',Georgia,serif;font-size:36px;line-height:1.1;letter-spacing:-0.01em;color:var(--navy)}
.section-deck{font-family:'Source Serif 4',Georgia,serif;font-style:italic;font-size:18px;line-height:1.55;color:var(--navy-70);max-width:54ch;margin-top:14px}
.rule-thick{border-top:2px solid var(--navy);width:48px;margin:0 0 16px}
.hairline{border-top:1px solid var(--surface-alt);margin:32px 0}

/* Inline CTA banner (cream warm) */
.inline-cta{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-radius:8px;margin:24px 0;background:linear-gradient(135deg,var(--cream) 0%,var(--cream-warm) 100%);border:1px solid rgba(15,27,45,0.06);gap:16px}
.inline-cta-text{font-family:system-ui,sans-serif;font-size:13px;color:var(--navy)}
.inline-cta-sub{font-family:system-ui,sans-serif;font-size:11px;color:var(--navy-50);margin-top:2px}

/* Badges (for tier flags, status pills) */
.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:100px;font-family:system-ui,sans-serif;font-size:11px;font-weight:500;letter-spacing:0.02em}
.badge-signal{background:rgba(230,57,70,0.08);color:var(--signal);border:1px solid rgba(230,57,70,0.18)}
.badge-verified{background:rgba(45,147,108,0.08);color:var(--verified);border:1px solid rgba(45,147,108,0.18)}
.badge-quote{background:rgba(234,179,8,0.08);color:#92400E;border:1px solid rgba(234,179,8,0.25)}
.badge-query{background:rgba(124,58,237,0.06);color:var(--query);border:1px solid rgba(124,58,237,0.18)}
.badge-navy{background:var(--surface);color:var(--navy-70);border:1px solid var(--surface-alt)}
