/* ── Base ─────────────────────────────────────────────── */
body{font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:var(--ink);background:var(--bg);margin:0;}
h1,h2,h3,h4,h5{font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;}
a{color:var(--forest);}
*{box-sizing:border-box;}

/* ── Global header ────────────────────────────────────── */
.site-header{position:sticky;top:0;z-index:60;background:var(--navy);color:#fff;
  border-bottom:1px solid rgba(255,255,255,.08);}
.site-header .hd-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;
  gap:22px;padding:0 24px;height:58px;}
.site-header .logo{font:700 20px var(--font-ui);color:#fff;text-decoration:none;display:flex;gap:10px;align-items:center;}
.site-header .logo img{height:30px;width:auto;}
.site-header nav{display:flex;gap:4px;flex:1;}
.site-header .nav-link{color:#D7E0E8;text-decoration:none;font:500 14px var(--font-ui);
  padding:8px 14px;border-radius:99px;transition:background .15s,color .15s;}
.site-header .nav-link:hover{color:#fff;background:rgba(255,255,255,.08);}
.site-header .nav-link.on{background:#fff;color:var(--navy);font-weight:600;}
.site-header .hd-actions{display:flex;gap:8px;align-items:center;}
.hd-search{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);
  color:#fff;border-radius:99px;padding:8px 14px;font:400 13px var(--font-ui);outline:none;width:170px;}
.hd-search::placeholder{color:#9FB2C4;}
.hd-search:focus{background:rgba(255,255,255,.16);border-color:#fff;}
.hnav-toggle{display:none;background:none;border:0;color:#fff;font-size:22px;cursor:pointer;padding:6px;}
/* mobile drawer */
.hnav-drawer{position:fixed;top:0;right:-280px;width:280px;height:100%;background:var(--navy);
  z-index:70;transition:right .22s ease;padding:20px;display:flex;flex-direction:column;gap:4px;}
.hnav-drawer.open{right:0;}
.hnav-backdrop{position:fixed;inset:0;background:rgba(7,26,43,.55);z-index:65;opacity:0;
  pointer-events:none;transition:opacity .2s;}
.hnav-backdrop.open{opacity:1;pointer-events:auto;}
.hnav-drawer .nav-link{color:#D7E0E8;padding:12px 14px;border-radius:var(--r-sm);font-size:15px;}
.hnav-drawer .nav-link.on{background:#fff;color:var(--navy);}
/* ── Footer ───────────────────────────────────────────── */
.site-footer{background:var(--navy);color:#C7D3DE;margin-top:64px;}
.site-footer .ft-inner{max-width:1200px;margin:0 auto;padding:48px 24px 28px;
  display:flex;flex-wrap:wrap;gap:34px;}
.site-footer .ft-col{min-width:150px;}
.site-footer .ft-col h5{color:#fff;margin:0 0 12px;font-size:13px;letter-spacing:.06em;text-transform:uppercase;}
.site-footer a{color:#AFC0CF;text-decoration:none;display:block;font-size:13.5px;padding:3px 0;}
.site-footer a:hover{color:#fff;}
.site-footer .ft-legal{border-top:1px solid rgba(255,255,255,.10);padding:16px 24px;
  font-size:12.5px;color:#7E93A8;text-align:center;}
/* ── Hero ─────────────────────────────────────────────── */
.hero{background:#EFF2F5;border-bottom:1px solid var(--line);
  color:#fff;position:relative;overflow:hidden;}
.hero .hero-inner{max-width:1200px;margin:0 auto;padding:64px 24px 40px;display:grid;
  grid-template-columns:1.05fr .95fr;gap:36px;align-items:center;}
.hero h1{font-size:46px;line-height:1.08;color:var(--ink);margin:0 0 14px;font-weight:800;
  letter-spacing:-.02em;}
.hero h1 .accent{color:var(--forest);}
.hero .hero-sub{font-size:17px;color:var(--muted);max-width:520px;margin:0 0 26px;}
.hero .hero-cta{display:flex;gap:12px;flex-wrap:wrap;}
.hero .hero-map-wrap{position:relative;border-radius:var(--r-lg);overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-md);min-height:330px;}
.hero .hero-map-wrap .curtain{position:absolute;inset:0;display:none;align-items:center;justify-content:center;color:#9FB2C4;font-size:14px;}
.hero-trust{display:flex;gap:26px;margin-top:22px;color:var(--muted);font-size:13px;flex-wrap:wrap;}
.hero-trust b{color:var(--navy);font-size:17px;font-family:var(--font-mono);}
/* ── Stats strip ──────────────────────────────────────── */
.stats-strip{background:linear-gradient(180deg,#F0F3F6,#FBFCFD);border-bottom:1px solid var(--line);padding:34px 24px 38px;}
.stats-strip .st-inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.stats-strip .stat{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:20px 22px;position:relative;overflow:hidden;box-shadow:var(--shadow-sm);}
.stats-strip .stat::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--acc,var(--forest));}
.stats-strip .stat b{display:block;font:800 30px var(--font-mono);color:var(--navy);line-height:1.1;}
.stats-strip .stat span{display:block;margin-top:6px;font-size:13.5px;color:var(--ink);font-weight:600;}
.stats-strip .stat small{display:block;margin-top:3px;font-size:12px;color:var(--muted);line-height:1.5;}
.stat{display:flex;align-items:baseline;gap:8px;}
.stat b{font:800 26px var(--font-ui);color:var(--navy);font-family:var(--font-mono);}
.stat span{font-size:13px;color:var(--muted);}
/* ── Theme cards ──────────────────────────────────────── */
.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:14px;}
.theme-card{display:block;text-decoration:none;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-md);padding:16px;position:relative;overflow:hidden;
  transition:transform .14s ease,box-shadow .18s ease;color:var(--ink);}
.theme-card:hover{transform:translateY(-3px);box-shadow:var(--sh-md);}
.theme-card .tc-dot{width:34px;height:34px;border-radius:9px;margin-bottom:10px;background:var(--acc,#176B4D);}
.theme-card .tc-name{font:700 14.5px var(--font-ui);color:var(--navy);}
.theme-card .tc-sub{font-size:12px;color:var(--muted);margin-top:3px;}
/* ── Featured map cards ───────────────────────────────── */
.fm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;}
.fm-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--sh-sm);}
.fm-card .fm-prev{height:150px;background:#0B2136;display:flex;align-items:center;justify-content:center;
  font-size:13px;color:#9FB2C4;}
.fm-card .fm-body{padding:16px;display:flex;flex-direction:column;gap:6px;flex:1;}
.fm-card .fm-tag{font:600 10.5px var(--font-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--acc,#176B4D);}
.fm-card h3{margin:0;font-size:17px;color:var(--navy);}
.fm-card .fm-meta{font-family:var(--font-mono);font-size:11.5px;color:var(--muted);}
.fm-card p{font-size:13.5px;color:#4A5A66;margin:0;line-height:1.55;}
.fm-card .fm-cta{margin-top:auto;padding-top:10px;}
/* ── Data search band ─────────────────────────────────── */
.search-band{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:26px;display:flex;flex-direction:column;gap:12px;max-width:860px;margin:0 auto;}
.search-band h3{margin:0;font-size:22px;}
.search-input{width:100%;border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px;
  font:400 15px var(--font-ui);outline:none;background:#fff;}
.search-input:focus{border-color:var(--forest);box-shadow:0 0 0 3px rgba(23,107,77,.12);}
.popular{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:12.5px;color:var(--muted);}
.popular .chip{background:#EEF2F1;border:1px solid var(--line);color:var(--navy-2);border-radius:99px;
  padding:4px 12px;font:500 12.5px var(--font-ui);cursor:pointer;text-decoration:none;}
.popular .chip:hover{background:#E3EBE8;border-color:var(--forest);color:var(--forest);}
/* ── Audience + developer CTA ─────────────────────────── */
.aud-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;}
.aud-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  padding:20px;text-decoration:none;color:var(--ink);display:block;transition:transform .14s,box-shadow .18s;}
.aud-card:hover{transform:translateY(-3px);box-shadow:var(--sh-md);}
.aud-card h3{margin:0 0 6px;font-size:16px;color:var(--navy);}
.aud-card p{margin:0;font-size:13.5px;color:var(--muted);}
.dev-cta{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);border-radius:var(--r-lg);
  color:#fff;padding:40px;display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between;}
.dev-cta h2{margin:0 0 8px;color:#fff;}
.dev-cta p{margin:0;color:#B9C8D6;font-size:15px;max-width:560px;}
/* ── Research cards ───────────────────────────────────── */
.rs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;}
.rs-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:18px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:8px;
  transition:transform .14s,box-shadow .18s;}
.rs-card:hover{transform:translateY(-3px);box-shadow:var(--sh-md);}
.rs-card .rs-meta{display:flex;gap:8px;flex-wrap:wrap;}
.rs-card h3{margin:0;font-size:16px;color:var(--navy);}
.rs-card p{margin:0;font-size:13.5px;color:var(--muted);}
/* ── Responsive ───────────────────────────────────────── */
@media(max-width:920px){
  .hero .hero-inner{grid-template-columns:1fr;padding-top:44px;}
  .hero h1{font-size:36px;}
  .site-header nav,.hd-search{display:none;}
  .hnav-toggle{display:inline-flex;}
}
@media(max-width:560px){
  .section{padding:36px 16px;}
  .stats-strip .st-inner{gap:12px;justify-content:flex-start;}
  .hero h1{font-size:30px;}
}
/* ── Accessibility ─────────────────────────────────────── */
:focus-visible{outline:2px solid #1D8FC4;outline-offset:2px;}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #1D8FC4;outline-offset:2px;}
.skip-link{position:absolute;left:-9999px;top:0;background:#fff;color:#071A2B;padding:8px 14px;z-index:200;border-radius:0 0 8px 0;font-weight:600;}
.skip-link:focus{left:0;}

/* ── App header (shared: SPA + static pages) ──────────── */
#header { background: #1C476D; padding: 10px 20px;
          display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.08); height: 52px;
          position: sticky; top: 0; z-index: 60; }
#header-left { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
#header #logo { height: 44px; width: auto; object-fit: contain; border-radius: 4px; flex-shrink: 0; }
.logo-link { display: inline-flex; align-items: center; line-height: 0; }
#header #header-text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
#header h1 { font-size: 17px; color: #ffffff; font-weight: 700; letter-spacing: 0.5px; white-space: nowrap; line-height: 1.15; margin: 0; font-family: 'Inter', system-ui, sans-serif; }
#header .tagline { font-size: 11px; color: #ffffff; opacity: 0.8; letter-spacing: 0.2px; white-space: nowrap; line-height: 1.2; font-family: 'Inter', system-ui, sans-serif; }
#nav { display: flex; gap: 2px; align-items: center; }
#nav a { font-size: 13px; padding: 6px 14px; border-radius: 999px; color: rgba(255,255,255,0.85); font-weight: 600;
         transition: background .15s, color .15s; white-space: nowrap; text-decoration: none; font-family: 'Inter', system-ui, sans-serif; }
#nav a:hover { background: rgba(255,255,255,0.18); color: #ffffff; }
#nav a.active { background: #ffffff; color: #071A2B; font-weight: 700; border-radius: 999px; box-shadow: none; }
#nav-toggle { display: none; margin-left: auto; flex-shrink: 0; background: rgba(255,255,255,0.12); border: none; cursor: pointer; border-radius: 8px; padding: 8px; line-height: 0; z-index: 30; align-self: center; position: relative; right: -6px; }
#nav-toggle span { display: block; width: 20px; height: 2px; background: #fff; margin: 3px auto; border-radius: 2px; transition: transform .2s, opacity .2s; }
#header.nav-open #nav-toggle span:nth-child(1) { transform: translateY(5px) rotate(45deg); }
#header.nav-open #nav-toggle span:nth-child(2) { opacity: 0; }
#header.nav-open #nav-toggle span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }
#nav-backdrop { display: none; position: fixed; inset: 0; background: rgba(10,15,26,0.5); z-index: 20; }
@media (max-width: 768px) {
  #nav { display: flex; flex-direction: column; gap: 6px; flex: none; position: fixed; top: 0; left: 0; bottom: 0; width: 78%; max-width: 300px; background: #071A2B; padding: 80px 18px 24px; align-items: stretch; transform: translateX(-100%); transition: transform .25s ease; z-index: 25; box-shadow: 2px 0 16px rgba(0,0,0,0.2); }
  #header.nav-open #nav { transform: translateX(0); }
  #header.nav-open #nav-backdrop { display: block; }
  #nav-toggle { display: block; }
  #nav a { font-size: 15px; padding: 11px 12px; border-radius: 10px; }
}
#header .hd-title { font-size: 17px; color: #ffffff; font-weight: 700; letter-spacing: 0.5px; white-space: nowrap; line-height: 1.15; font-family: 'Inter', system-ui, sans-serif; }
#header #header-text{overflow:hidden;}
#header .hd-title,#header h1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#header .tagline{overflow:hidden;text-overflow:ellipsis;}
@media (max-width:480px){ #header .tagline{display:none;} }
.api-group{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:8px 16px 14px;margin-bottom:16px;}
.api-group h4{margin:12px 0 6px;font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--forest);}
.api-tbl{width:100%;border-collapse:collapse;font-size:13.5px;}
.api-tbl th{text-align:left;padding:8px 10px;color:var(--muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--line);}
.api-tbl td{padding:8px 10px;border-bottom:1px solid #EDF1F4;vertical-align:top;}
.api-tbl tr:nth-child(even) td{background:#F6F8FA;}
.api-tbl td:first-child{font-family:var(--font-mono);font-size:12.5px;color:var(--navy);white-space:nowrap;}
pre{background:#0E1B2E;color:#CDE0EE;border-radius:var(--r-md);padding:14px 16px;overflow-x:auto;font:400 12.5px/1.55 var(--font-mono);}
@media(max-width:640px){ .api-tbl td:first-child{white-space:normal!important;word-break:break-word;overflow-wrap:anywhere;} }

/* ── Featured maps v2: spotlight + compact list ────────── */
.fm-split{display:grid;grid-template-columns:1.1fr 1.4fr;gap:18px;align-items:stretch;}
.fm-spot{display:block;text-decoration:none;background:linear-gradient(160deg,#0E2A44 0%,#12395C 55%,#1A4B73 100%);color:#fff;border-radius:var(--r-lg);overflow:hidden;position:relative;min-height:280px;padding:30px 28px;}
.fm-spot::after{content:"🗺️";position:absolute;right:-8px;bottom:-14px;font-size:120px;opacity:.14;transform:rotate(-8deg);}
.fm-spot-inner{position:relative;z-index:2;display:flex;flex-direction:column;gap:10px;height:100%;}
.fm-spot .fm-tag{color:#8FE3BC;font-size:11.5px;font-weight:700;letter-spacing:.08em;}
.fm-spot h3{font-size:30px;margin:0;color:#fff;}
.fm-spot .fm-meta{font:400 12px var(--font-mono);color:#9FB8CC;}
.fm-spot p{color:#D5E3EE;font-size:14px;line-height:1.6;margin:0;max-width:46ch;}
.fm-open{margin-top:auto;align-self:flex-start;background:var(--emerald);color:#fff;font-weight:600;font-size:13.5px;padding:10px 18px;border-radius:999px;}
.fm-list{display:flex;flex-direction:column;gap:10px;justify-content:center;}
.fm-row{display:flex;align-items:center;gap:14px;text-decoration:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px;transition:border-color .15s,box-shadow .15s;}
.fm-row:hover{border-color:var(--forest);box-shadow:var(--shadow-sm);}
.fm-row-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;}
.fm-row-t{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0;}
.fm-row-t b{font-size:14.5px;color:var(--ink);}
.fm-row-t i{font:400 11.5px var(--font-mono);color:var(--muted);font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.fm-row-a{font-size:12.5px;font-weight:600;color:var(--forest);white-space:nowrap;}
@media(max-width:920px){ .fm-split{grid-template-columns:1fr;} }

/* ── Landing tab navigation (below hero) ──────────────── */
.tab-sec{max-width:1200px;margin:0 auto;padding:46px 24px 64px;}
.tab-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;}
.tab-card{display:flex;flex-direction:column;align-items:flex-start;gap:6px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:20px 18px;text-decoration:none;transition:border-color .15s,box-shadow .15s,transform .15s;}
.tab-card:hover{border-color:var(--forest);box-shadow:var(--shadow-md);transform:translateY(-2px);}
.tab-ic{font-size:22px;line-height:1;}
.tab-card b{font-size:15.5px;color:var(--ink);}
.tab-card i{font-size:12.5px;color:var(--muted);font-style:normal;line-height:1.45;}
@media(max-width:560px){.tab-grid{grid-template-columns:repeat(2,1fr);} .tab-card{padding:16px 14px;}}
.b-btn.navy{background:#D7DEE2;color:#172026;border:1px solid #BECAD0;}
.b-btn.navy:hover{background:#C6CFD4;transform:translateY(-1px);}

/* Code blocks: light */
pre{background:#fff;color:#000;border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px;overflow-x:auto;}

/* Code blocks: force light everywhere */
pre{background:#FFF !important;color:#000 !important;border:1px solid var(--line) !important;}
