/* ═══════════════════════════════════════════════════════════════
 SitePath Intelligence — Shared Stylesheet
 ═══════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600;700;800;900&family=Geist+Mono:wght@400;500;600&family=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500;9..144,600;9..144,700&display=swap');
*{box-sizing:border-box;margin:0;padding:0}
:root{
 --navy:#0a1628;--navy2:#0f1e38;
 --blue:#1d4ed8;--sky:#3b82f6;--sky2:#60a5fa;
 --green:#16a34a;--green2:#15803d;
 --red:#dc2626;--amber:#d97706;
 --text:#111;--text2:#374151;--text3:#6b7280;--text4:#9ca3af;
 --border:#e9ecef;--border2:#f0f0f0;
 --surface:#fff;--bg:#f0f2f5;
}
html{height:100%}
body{font-family:'Geist',ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;color:var(--text);line-height:1.5;background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:'ss03','cv11'}
.serif,.display-serif{font-family:'Fraunces',Georgia,serif;font-weight:500;letter-spacing:-0.015em;font-feature-settings:'ss01'}
.mono{font-family:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-feature-settings:'cv02','ss01'}
.serif{font-family:'Instrument Serif',Georgia,serif;font-weight:400;letter-spacing:-0.01em}
a{color:var(--sky);text-decoration:none}
a:hover{text-decoration:underline}
button{font-family:inherit;cursor:pointer}

/* ── TOPBAR ──────────────────────────────────────────────── */
.topbar{
 display:flex;align-items:center;justify-content:space-between;
 padding:0 16px;height:52px;
 background:var(--navy);
 border-bottom:1px solid rgba(255,255,255,0.06);
 flex-shrink:0;z-index:600;position:relative;
}
.t-logo{display:flex;align-items:center;gap:9px;text-decoration:none;flex-shrink:0}
.t-logo:hover{opacity:0.88}
.t-logo-img{width:32px;height:32px;display:block;flex-shrink:0}
.t-logo-text{display:flex;flex-direction:column;gap:0}
.t-logo-name{font-size:14px;font-weight:800;color:#fff;letter-spacing:-0.3px;line-height:1.1}
.t-logo-name span{color:var(--sky2)}
.t-logo-sub{font-size:9px;font-weight:600;color:rgba(255,255,255,0.3);letter-spacing:2px;text-transform:uppercase}
.t-nav{display:flex;align-items:center;gap:1px;margin:0 8px}
.t-navlink{font-size:12px;font-weight:500;color:rgba(255,255,255,0.55);padding:5px 11px;border-radius:5px;text-decoration:none;transition:all 0.15s;white-space:nowrap}
.t-navlink:hover{color:#fff;background:rgba(255,255,255,0.08);text-decoration:none}
.t-navlink.active{color:#fff;background:rgba(255,255,255,0.1);font-weight:600}
.t-right{display:flex;gap:6px;align-items:center;flex-shrink:0}
.user-pill{font-size:11px;padding:3px 10px;border-radius:20px;background:rgba(74,222,128,0.15);color:#4ade80;border:1px solid rgba(74,222,128,0.3);display:none;white-space:nowrap;max-width:180px;overflow:hidden;text-overflow:ellipsis}
.user-pill.show{display:block}
.btn-nav{font-size:12px;font-weight:600;padding:5px 14px;border-radius:6px;background:var(--green);color:#fff;border:none;transition:background 0.15s}
.btn-nav:hover{background:var(--green2)}
.btn-nav-ghost{font-size:12px;padding:5px 11px;border-radius:6px;background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.65);border:1px solid rgba(255,255,255,0.12);transition:all 0.15s}
.btn-nav-ghost:hover{color:#fff;background:rgba(255,255,255,0.14)}
.hamburger{display:none;flex-direction:column;gap:4px;background:none;border:none;padding:4px;cursor:pointer}
.hamburger span{display:block;width:18px;height:1.5px;background:rgba(255,255,255,0.6)}

/* ── MOBILE NAV ──────────────────────────────────────────── */
.mobile-drawer{display:none;position:fixed;top:52px;left:0;right:0;background:var(--navy);border-bottom:1px solid rgba(255,255,255,0.08);z-index:599;padding:6px 0}
.mobile-drawer.open{display:block}
.mobile-drawer a{display:block;padding:11px 20px;font-size:13px;color:rgba(255,255,255,0.7);text-decoration:none;border-bottom:1px solid rgba(255,255,255,0.05)}
.mobile-drawer a:hover{color:#fff;background:rgba(255,255,255,0.05)}

/* ── PILLS ───────────────────────────────────────────────── */
.pill{font-size:10px;padding:2px 7px;border-radius:10px;font-weight:600;display:inline-block}
.pg{background:#dcfce7;color:#166534}.py{background:#fef9c3;color:#854d0e}
.po{background:#ffedd5;color:#9a3412}.pr{background:#fee2e2;color:#991b1b}.pgy{background:#f3f4f6;color:#374151}

/* ── MODALS ──────────────────────────────────────────────── */
.overlay{position:fixed;inset:0;background:rgba(10,22,40,0.9);backdrop-filter:blur(6px);z-index:2000;display:none;align-items:center;justify-content:center;padding:16px}
.overlay.show{display:flex}
.modal{background:#fff;border-radius:14px;width:100%;max-width:400px;box-shadow:0 20px 60px rgba(0,0,0,0.3);overflow:hidden}
.modal-head{padding:24px 24px 14px;text-align:center}
.modal-icon{font-size:32px;margin-bottom:10px}
.modal-head h2{font-size:17px;font-weight:800;color:var(--navy);margin-bottom:6px}
.modal-head p{font-size:12px;color:var(--text3);line-height:1.6}
.modal-body{padding:0 22px 22px}
.m-btn{width:100%;padding:11px;border-radius:8px;font-size:13px;font-weight:700;cursor:pointer;border:none;margin-bottom:6px;transition:all 0.15s;font-family:inherit}
.mb-green{background:var(--green);color:#fff}.mb-green:hover{background:var(--green2)}
.mb-navy{background:var(--navy);color:#fff}.mb-navy:hover{background:var(--navy2)}
.mb-sky{background:var(--sky);color:#fff}.mb-sky:hover{background:var(--blue)}
.mb-ghost{background:#f3f4f6;color:var(--text2)}.mb-ghost:hover{background:#e5e7eb}
.m-or{display:flex;align-items:center;gap:8px;margin:3px 0 8px;color:#e5e7eb;font-size:11px}
.m-or::before,.m-or::after{content:'';flex:1;height:1px;background:#f3f4f6}
.m-note{font-size:11px;color:var(--text4);text-align:center;margin-top:6px;line-height:1.55}
.m-note a{color:var(--sky)}

/* ── PAGE LAYOUTS ────────────────────────────────────────── */
.page-shell{max-width:860px;margin:0 auto;padding:48px 24px 80px}
.page-header{margin-bottom:32px}
.page-title{font-size:24px;font-weight:800;color:var(--navy);margin-bottom:6px;letter-spacing:-0.3px}
.page-sub{font-size:14px;color:var(--text3);line-height:1.65;max-width:600px}
.page-hero{background:var(--navy);padding:48px 32px;text-align:center}
.page-hero h1{font-size:clamp(24px,4vw,40px);font-weight:800;color:#fff;margin-bottom:10px;letter-spacing:-0.5px}
.page-hero p{font-size:14px;color:rgba(255,255,255,0.55);max-width:520px;margin:0 auto;line-height:1.7}

/* ── CARDS ───────────────────────────────────────────────── */
.card{background:#fff;border:1px solid var(--border);border-radius:10px;padding:24px}
.card+.card{margin-top:16px}
.card h2{font-size:16px;font-weight:700;color:var(--navy);margin-bottom:10px}
.card p{font-size:13px;color:var(--text2);line-height:1.75;margin-bottom:10px}
.card p:last-child{margin:0}

/* ── SITE FOOTER ─────────────────────────────────────────── */
.site-footer{border-top:1px solid var(--border);padding:24px 32px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;background:#fff}
.sf-brand{font-size:13px;font-weight:800;color:var(--navy)}
.sf-brand span{color:var(--sky)}
.sf-links{display:flex;gap:20px;flex-wrap:wrap}
.sf-links a{font-size:12px;color:var(--text4);text-decoration:none;transition:color 0.15s}
.sf-links a:hover{color:var(--text2)}
.sf-legal{font-size:12px;color:var(--text4)}

/* ── COOKIE BANNER ───────────────────────────────────────── */
#cookieBanner{display:none;position:fixed;bottom:0;left:0;right:0;z-index:900;background:#fff;border-top:1px solid var(--border);padding:12px 24px}
.cb-inner{display:flex;align-items:center;gap:16px;flex-wrap:wrap;max-width:1000px;margin:0 auto}
.cb-text{font-size:12px;color:var(--text3);flex:1;min-width:240px;line-height:1.5}
.cb-text a{color:var(--sky)}
.cb-btns{display:flex;gap:8px;flex-shrink:0}
.cb-btn{font-size:12px;font-weight:600;padding:6px 14px;border-radius:5px;cursor:pointer;font-family:inherit;transition:all 0.15s}
.cb-essential{background:transparent;color:var(--text3);border:1px solid var(--border)}.cb-essential:hover{border-color:var(--text4);color:var(--text2)}
.cb-accept{background:var(--green);color:#fff;border:none}.cb-accept:hover{background:var(--green2)}

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media(max-width:768px){
 .t-nav{display:none}
 .hamburger{display:flex}
 .page-shell{padding:32px 16px 60px}
 .site-footer{padding:20px 16px}
 .sf-links{display:none}
}
@media print{
 .topbar,.mobile-drawer,.site-footer,#cookieBanner,.overlay{display:none!important}
}