:root {
  /* ── Deep Navy System ── */
  --ink:    #0F1729;
  --ink2:   #162035;
  --ink3:   #1E2D47;
  --panel:  #162035;
  --border: rgba(212,175,55,0.12);
  --gold:   #D4AF37;
  --gold2:  #C8A96E;
  --sand:   #E8D9BC;
  --dim:    #9AAABF;
  --muted:  #C4CEDF;
  --text:   #ECF0F8;
  --light:  #F5F8FF;
  --red:    #C45444;
  --green:  #4CA882;
  --blue:   #4A7FC1;
  --orange: #D4874A;
  --font-display: 'Cormorant Garamond', serif;
  --font-body:    'Barlow', sans-serif;
  --font-label:   'Barlow Condensed', sans-serif;
}

/* ════════════════════════════════════════════════════════
   GLOBAL TYPOGRAPHY LOCK
   Cormorant Garamond = display/headings
   Barlow Condensed   = labels, tags, caps
   Barlow             = body, UI, paragraphs
   ════════════════════════════════════════════════════════ */

*{box-sizing:border-box;margin:0;padding:0}

body{
  font-family:'Barlow',sans-serif;
  font-size:14px;
  line-height:1.7;
  color:#ECF0F8;
  background:var(--ink);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

h1,h2,h3,h4{
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  color:var(--light);
  line-height:1.1;
}

h1{font-size:clamp(36px,5vw,64px)}
h2{font-size:clamp(24px,3vw,42px)}
h3{font-size:clamp(18px,2vw,28px)}
h4{font-size:clamp(14px,1.5vw,20px)}

p{
  font-family:'Barlow',sans-serif;
  font-size:14px;
  line-height:1.75;
  color:#B8C4D8;
  font-weight:300;
}

/* Label / uppercase tag elements */
.label, [class*="eyebrow"], [class*="tag"], [class*="sub-title"] {
  font-family:'Barlow Condensed',sans-serif;
  font-size:9px;
  font-weight:700;
  letter-spacing:0.2em;
  text-transform:uppercase;
}

/* Ensure no font leakage from inline styles */
em{font-style:italic;color:var(--gold)}
strong{font-weight:600;color:var(--light)}

/* Page section base */
.page-section{
  display:none;
  padding-top:56px;
  min-height:100vh;
  background:var(--ink);
  color:var(--text);
}
.page-section.active{display:block}

/* Cards — consistent across all pages */
.card{
  background:var(--ink2);
  border:1px solid var(--border);
  padding:24px;
}
.card-elevated{
  background:var(--ink3);
  border:1px solid rgba(212,175,55,0.15);
  padding:24px;
}

/* Button system */
.btn-primary{
  background:var(--gold);
  color:#0F1729;
  border:none;
  padding:12px 24px;
  font-family:'Barlow Condensed',sans-serif;
  font-size:11px;
  font-weight:700;
  letter-spacing:0.12em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .2s;
}
.btn-primary:hover{background:#C4A030}

.btn-secondary{
  background:transparent;
  color:var(--gold);
  border:1px solid rgba(212,175,55,0.35);
  padding:11px 24px;
  font-family:'Barlow Condensed',sans-serif;
  font-size:11px;
  font-weight:700;
  letter-spacing:0.12em;
  text-transform:uppercase;
  cursor:pointer;
  transition:all .2s;
}
.btn-secondary:hover{border-color:var(--gold);background:rgba(212,175,55,0.06)}

/* Dividers */
.divider{height:1px;background:var(--border);margin:0}

/* Section spacing */
.section{padding:64px}
.section-inner{max-width:1160px;margin:0 auto}

/* Section label */
.section-label{
  font-family:'Barlow Condensed',sans-serif;
  font-size:9px;
  font-weight:700;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:12px;
  display:block;
}

/* Back button */
.back-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-family:'Barlow Condensed',sans-serif;
  font-size:9px;
  font-weight:700;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--dim);
  background:transparent;
  border:1px solid rgba(255,255,255,0.08);
  padding:6px 14px;
  cursor:pointer;
  transition:all .2s;
  margin-bottom:24px;
}
.back-btn:hover{color:var(--gold);border-color:rgba(212,175,55,0.3)}

/* Page header (replaces repeated heroes) */
.page-header{
  background:var(--ink2);
  border-bottom:1px solid var(--border);
  padding:40px 64px 36px;
}
.page-header-label{
  font-family:'Barlow Condensed',sans-serif;
  font-size:9px;
  font-weight:700;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:10px;
}
.page-header-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(28px,3vw,44px);
  font-weight:300;
  color:var(--light);
  line-height:1.1;
  margin-bottom:10px;
}
.page-header-sub{
  font-size:14px;
  color:var(--muted);
  line-height:1.7;
  max-width:640px;
  font-weight:300;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{font-size:15px;background:var(--ink)}
body{background:var(--ink);color:var(--text);font-family:'Barlow',sans-serif;font-weight:300;min-height:100vh}
a{color:inherit;text-decoration:none}
button{cursor:pointer;border:none;background:none;font-family:inherit}

/* ── NAV ── */
.site-nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 32px;height:56px;
  background:rgba(15,23,41,0.97);
  border-bottom:1px solid rgba(212,175,55,0.15);
  backdrop-filter:blur(12px);
}
.nav-brand{display:flex;align-items:center;gap:10px;cursor:pointer}
.nav-logo{
  width:32px;height:32px;background:var(--gold);
  display:flex;align-items:center;justify-content:center;
  font-family:'Cormorant Garamond',serif;font-size:14px;font-weight:600;color:#000;
}
.nav-name{font-family:'Barlow Condensed',sans-serif;font-size:14px;font-weight:500;letter-spacing:.12em;color:var(--sand);text-transform:uppercase}
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--gold)}
.nav-cta{
  padding:6px 16px;border:1px solid var(--gold);
  font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);
  transition:all .2s;cursor:pointer;background:none;font-family:'Barlow',sans-serif;
}
.nav-cta:hover{background:var(--gold);color:#000}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px}
.hamburger span{display:block;width:22px;height:2px;background:var(--gold);transition:all .3s}
.mobile-nav{
  display:none;position:fixed;top:56px;left:0;right:0;z-index:99;
  background:rgba(8,12,18,0.98);border-bottom:1px solid var(--border);
  flex-direction:column;padding:16px 24px 20px;gap:14px;
}
.mobile-nav a{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:8px 0;border-bottom:1px solid var(--border)}
.mobile-nav a:last-child{border-bottom:none}
.mobile-nav.open{display:flex}

/* ── PAGES ── */
.page-section{display:none;padding-top:56px;min-height:100vh}
.page-section.active{display:block}

/* ── MAIN PAGE ── */
.hero{
  height:auto;
  min-height:clamp(420px, 62vh, 680px);
  display:flex;flex-direction:column;justify-content:space-between;
  padding:52px 64px 48px;
  box-sizing:border-box;
  background: radial-gradient(ellipse at 15% 50%, rgba(212,175,55,.06) 0%, transparent 50%),
              radial-gradient(ellipse at 85% 15%, rgba(74,127,193,.05) 0%, transparent 45%),
              var(--ink);
}
.hero-left{width:100%;display:flex;flex-direction:column;height:100%;justify-content:space-between}
.hero-tag{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:24px}
.hero-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(3.8rem,9.5vw,11.5rem);
  font-weight:300;
  line-height:0.95;
  letter-spacing:-0.03em;
  color:var(--light);
  margin-bottom:28px;
}
.hero-title em{font-style:italic;color:var(--gold)}
.hero-top{display:flex;flex-direction:column;justify-content:flex-start}
.hero-bottom{display:flex;flex-direction:column;gap:0;justify-content:flex-end}
.hero-sub{font-size:15px;font-weight:300;color:var(--muted);max-width:640px;line-height:1.7;margin-bottom:28px}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.btn-primary{
  padding:13px 32px;background:var(--gold);color:#000;
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;
  font-family:'Barlow',sans-serif;transition:all .2s;
}
.btn-primary:hover{background:var(--sand)}
.btn-secondary{
  padding:13px 32px;border:1px solid var(--border);color:var(--muted);
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  font-family:'Barlow',sans-serif;transition:all .2s;
}
.btn-secondary:hover{border-color:var(--gold);color:var(--gold)}
.hero-stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  border:1px solid var(--border);margin-top:32px;max-width:800px;
}
.hs-item{padding:24px;border-right:1px solid var(--border);text-align:center}
.hs-item:last-child{border-right:none}
.hs-num{font-family:'Cormorant Garamond',serif;font-size:28px;color:var(--gold);margin-bottom:4px}
.hs-lab{font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--dim)}

/* Products section */
.products{padding:80px 64px;background:var(--ink2);border-top:1px solid var(--border)}
.section-tag{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
.section-title{font-family:'Cormorant Garamond',serif;font-size:2.2rem;font-weight:300;color:var(--light);margin-bottom:48px}

.prod-card{
  display:flex;flex-direction:column;
  background:var(--ink2);padding:36px 30px;
  border-bottom:2px solid transparent;transition:border-color .2s,background .2s;
  min-height:220px;
}
.prod-card:hover{border-bottom-color:var(--gold)}
.prod-code{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
.prod-name{font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--light);margin-bottom:10px}
.prod-desc{font-size:12px;color:var(--muted);line-height:1.7}
.prod-link{margin-top:20px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);cursor:pointer}
.prod-link:hover{color:var(--sand)}

/* Footer strip */
.main-footer{
  padding:32px 64px;border-top:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
}
.footer-copy{font-size:11px;color:var(--dim)}
.footer-links{display:flex;gap:24px}
.footer-links a{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.footer-links a:hover{color:var(--gold)}

/* ── DASHBOARD (SPI) ── */
.dash-header{
  padding:24px 32px 0;display:flex;align-items:flex-start;justify-content:space-between;
  border-bottom:1px solid var(--border);
}
.dash-title-row{padding:0 0 16px}
.dash-tag{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.dash-title{font-family:'Cormorant Garamond',serif;font-size:1.5rem;color:var(--light)}
.dash-back{
  padding:6px 14px;border:1px solid var(--border);
  font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  cursor:pointer;background:none;font-family:'Barlow',sans-serif;
  transition:all .2s;
}
.dash-back:hover{border-color:var(--gold);color:var(--gold)}

.dash-layout{display:flex;height:calc(100vh - 108px);overflow:hidden}
.dash-sidebar{
  width:300px;flex-shrink:0;border-right:1px solid var(--border);
  overflow-y:auto;padding:0;
}
.dash-sidebar::-webkit-scrollbar{width:3px}
.dash-sidebar::-webkit-scrollbar-thumb{background:var(--border)}
.dash-main{flex:1;overflow:visible;display:flex;flex-direction:column}
.dash-map-area{flex:0 0 55%;min-height:250px;border-bottom:1px solid var(--border);position:relative;background:#091522;overflow:hidden}
.dash-map-area svg{display:block;width:100%;height:100%;}
.dash-detail{flex:1;min-height:120px;padding:20px 24px;overflow-y:auto}

/* SPI Rankings sidebar */
.spi-head{
  padding:16px 20px;border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
}
.spi-head-title{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
.spi-count{
  font-size:9px;padding:3px 8px;border:1px solid var(--border);color:var(--dim);letter-spacing:.1em;
}
.spi-row{
  display:flex;align-items:center;padding:10px 20px;gap:12px;
  border-bottom:1px solid rgba(255,255,255,0.03);cursor:pointer;transition:background .15s;
}
.spi-row:hover{background:rgba(255,255,255,0.03)}
.spi-row.active{background:rgba(212,175,55,0.06)}
.spi-row.locked{opacity:.4;cursor:default;filter:blur(2px)}
.spi-rank{font-size:11px;color:var(--dim);width:20px;flex-shrink:0}
.spi-flag{font-size:16px;flex-shrink:0}
.spi-name{flex:1;font-size:12px;color:var(--text)}
.spi-score{font-size:13px;font-family:'Barlow Condensed',sans-serif;color:var(--gold)}
.spi-bar-wrap{width:60px;height:3px;background:rgba(255,255,255,0.07)}
.spi-bar{height:3px;background:var(--gold);transition:width 0.8s ease}

/* Map tooltip */
.map-tip{
  position:absolute;pointer-events:none;
  background:rgba(15,23,41,0.97);border:1px solid rgba(212,175,55,0.35);
  color:var(--text);padding:10px 14px;font-size:11px;
  display:none;z-index:10;min-width:160px;line-height:1.6;
}

/* Detail panel */
.det-name{font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--light);margin-bottom:12px}
.det-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.det-item{}
.det-k{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:3px}
.det-v{font-size:14px;color:var(--text)}
.det-v.highlight{color:var(--gold)}

/* Paywall */
.spi-lock{
  padding:24px 20px;text-align:center;border-top:1px solid var(--border);
  background:linear-gradient(180deg,transparent,var(--ink2));
}
.spi-lock p{font-size:11px;color:var(--dim);margin-bottom:12px}
.btn-unlock{
  padding:8px 20px;border:1px solid var(--gold);
  color:var(--gold);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  font-family:'Barlow',sans-serif;background:none;cursor:pointer;transition:all .2s;
}
.btn-unlock:hover{background:var(--gold);color:#000}

/* ── MARS DASHBOARD ── */
.mars-header{
  padding:0 32px;height:48px;
  display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid var(--border);
  background:rgba(8,12,18,0.6);
}
.mars-product{display:flex;align-items:center;gap:10px}
.mars-logo{
  width:28px;height:28px;background:var(--gold);
  display:flex;align-items:center;justify-content:center;
  font-family:'Cormorant Garamond',serif;font-size:11px;color:#000;font-weight:600;
}
.mars-name{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.mars-desc{font-size:9px;color:var(--dim)}
.mars-price{font-size:11px;color:var(--muted)}
.mars-price em{font-style:normal;color:var(--gold);font-weight:500}
.mars-cta{
  padding:6px 16px;background:var(--gold);color:#000;
  font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;
  font-family:'Barlow',sans-serif;cursor:pointer;border:none;
}

.mars-stats{
  display:grid;grid-template-columns:repeat(5,1fr);
  border-bottom:1px solid var(--border);
}
.ms-item{
  padding:14px 20px;border-right:1px solid var(--border);
}
.ms-item:last-child{border-right:none}
.ms-val{font-family:'Cormorant Garamond',serif;font-size:1.6rem;color:var(--light)}
.ms-lab{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:2px}

.mars-body{display:flex;height:calc(100vh - 158px)}
.mars-sidebar{
  width:265px;flex-shrink:0;border-right:1px solid var(--border);
  display:flex;flex-direction:column;overflow:hidden;
}
.mars-side-head{
  padding:12px 18px;border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;flex-shrink:0;
}
.mars-side-title{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
.mars-cnt{font-size:9px;padding:2px 7px;border:1px solid var(--border);color:var(--dim)}
.rank-list{flex:1;overflow-y:auto}
.rank-list::-webkit-scrollbar{width:3px}
.rank-list::-webkit-scrollbar-thumb{background:var(--border)}
.rank-row{
  display:flex;align-items:center;padding:9px 18px;gap:10px;
  border-bottom:1px solid rgba(255,255,255,0.025);cursor:pointer;transition:background .15s;
}
.rank-row:hover{background:rgba(255,255,255,0.03)}
.rank-row.active{background:rgba(212,175,55,0.06)}
.rank-row.locked{opacity:.35;filter:blur(2.5px);cursor:default}
.rr-n{font-size:10px;color:var(--dim);width:18px;flex-shrink:0;font-family:'Barlow Condensed',sans-serif}
.rr-name{font-size:11px;color:var(--text);line-height:1.3}
.rr-region{font-size:9px;color:var(--dim)}
.rr-score{font-size:12px;font-family:'Barlow Condensed',sans-serif;color:var(--gold);margin-left:auto;margin-right:8px}
.rr-cls{font-size:8px;padding:2px 5px;letter-spacing:.08em}
.c-dom{background:rgba(196,84,68,.2);color:#C45444;border:1px solid rgba(196,84,68,.3)}
.c-maj{background:rgba(212,135,74,.15);color:#D4874A;border:1px solid rgba(212,135,74,.3)}
.c-sig{background:rgba(139,105,20,.15);color:#c4981f;border:1px solid rgba(139,105,20,.3)}
.c-eme{background:rgba(74,127,193,.1);color:#4A7FC1;border:1px solid rgba(74,127,193,.2)}

/* MARS rank bars */
.rank-bars{flex:1;overflow-y:auto;padding:16px}
.rank-bars::-webkit-scrollbar{width:3px}
.rank-bars::-webkit-scrollbar-thumb{background:var(--border)}
.rb-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.rb-name{font-size:10px;color:var(--muted);width:90px;flex-shrink:0;text-align:right}
.rb-track{flex:1;height:6px;background:rgba(255,255,255,0.05)}
.rb-fg{height:6px;background:var(--gold);width:0;transition:width .8s ease}
.rb-val{font-size:10px;color:var(--dim);width:30px;text-align:right}
.rb-lock{flex:1;height:6px;background:rgba(255,255,255,0.05);filter:blur(3px)}

/* MARS right panel */
.mars-right{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}
.mars-map-panel{
  flex:0 0 310px;border-bottom:1px solid var(--border);
  display:flex;flex-direction:column;min-height:0;overflow:hidden;
}
.mars-panel-head{
  padding:10px 18px;border-bottom:1px solid var(--border);flex-shrink:0;
  display:flex;align-items:center;justify-content:space-between;
}
.mars-panel-title{font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--dim)}
.hover-hint{font-size:9px;color:var(--dim);cursor:default}
.map-wrap{flex:1;position:relative;overflow:hidden;background:#0a1520;min-height:0}
.map-wrap svg{display:block;width:100%;height:100%}
.map-legend{
  position:absolute;bottom:10px;right:10px;
  background:rgba(0,0,0,0.7);border:1px solid rgba(255,255,255,0.08);
  padding:8px 12px;display:flex;flex-direction:column;gap:5px;
}
.ml-item{display:flex;align-items:center;gap:6px;font-size:9px;color:var(--muted)}
.ml-dot{width:10px;height:10px;border-radius:1px;flex-shrink:0}

/* MARS lower charts */
.mars-charts{flex:1;display:flex;overflow:hidden}
.chart-panel{flex:1;border-right:1px solid var(--border);padding:14px 16px;overflow-y:auto;min-width:0}
.chart-panel:last-child{border-right:none}
.chart-panel::-webkit-scrollbar{width:3px}
.chart-panel::-webkit-scrollbar-thumb{background:var(--border)}
.chart-head{
  display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px;
}
.ch-sub{font-size:8px;letter-spacing:.15em;text-transform:uppercase;color:var(--dim)}
.ch-title{font-size:13px;font-family:'Cormorant Garamond',serif;color:var(--light);margin-top:2px}
.ch-toggle{font-size:8px;padding:3px 8px;border:1px solid var(--border);color:var(--dim);cursor:pointer}

/* Spending chart */
.spend-row{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.sr-name{font-size:10px;color:var(--muted);width:100px;flex-shrink:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sr-track{flex:1;height:5px;background:rgba(255,255,255,0.04)}
.sr-bar{height:5px;background:var(--blue);width:0;transition:width .8s ease}
.sr-val{font-size:9px;color:var(--dim);width:42px;text-align:right;white-space:nowrap}
.sr-pct{font-size:9px;color:var(--dim);width:28px;text-align:right}
.spend-lock{opacity:.3;filter:blur(2.5px)}

/* FMF chart */
.fmf-row{display:flex;align-items:center;gap:8px;margin-bottom:7px;flex-wrap:wrap}
.fr-name{font-size:10px;color:var(--muted);width:90px;flex-shrink:0}
.fr-fmf{font-size:9px;color:var(--blue);width:55px;text-align:right}
.fr-fms{font-size:9px;color:var(--orange);width:55px;text-align:right}
.fr-dep{font-size:8px;padding:1px 5px;letter-spacing:.06em}
.dep-high{background:rgba(196,84,68,.15);color:#C45444;border:1px solid rgba(196,84,68,.25)}
.dep-med{background:rgba(212,135,74,.12);color:#D4874A;border:1px solid rgba(212,135,74,.25)}
.dep-low{background:rgba(76,168,130,.1);color:#4CA882;border:1px solid rgba(76,168,130,.2)}
.fmf-lock{opacity:.3;filter:blur(2.5px)}
.fmf-head-row{
  display:flex;align-items:center;gap:8px;margin-bottom:10px;
  font-size:8px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);
}
.fmf-leg{display:flex;align-items:center;gap:4px}
.fmf-dot{width:6px;height:6px;border-radius:50%}

/* Detail box (MARS) */
.mars-det{
  position:absolute;bottom:0;left:0;right:0;
  background:rgba(8,12,18,0.95);border-top:1px solid var(--border);
  padding:14px 18px;
}
.det-box{background:var(--ink3);border:1px solid var(--border);padding:16px 20px}
.det-box-name{font-family:'Cormorant Garamond',serif;font-size:1.2rem;color:var(--light);margin-bottom:10px}
.det-box-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.det-box-item .det-k{font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:3px}
.det-box-item .det-v{font-size:13px;color:var(--text)}

/* Paywalls */
.mars-paywall{
  padding:16px 18px;text-align:center;
  border-top:1px solid var(--border);background:linear-gradient(180deg,transparent,rgba(0,0,0,0.5));
  flex-shrink:0;
}
.mars-paywall p{font-size:10px;color:var(--dim);margin-bottom:8px}
.btn-access{
  padding:7px 18px;border:1px solid var(--gold);
  font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--gold);background:none;font-family:'Barlow',sans-serif;cursor:pointer;transition:all .2s;
}
.btn-access:hover{background:var(--gold);color:#000}

/* ── METHODOLOGY ── */
.meth-wrap{padding:48px 64px;max-width:1100px}
.meth-title{font-family:'Cormorant Garamond',serif;font-size:2.5rem;font-weight:300;color:var(--light);margin-bottom:8px}
.meth-sub{font-size:12px;color:var(--muted);margin-bottom:48px}
.pillar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);margin-bottom:48px}
.pillar-card{background:var(--ink2);padding:24px;border-top:2px solid transparent;transition:border-color .2s}
.pillar-card:hover{border-top-color:var(--gold)}
.pc-code{font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.pc-name{font-family:'Cormorant Garamond',serif;font-size:1.1rem;color:var(--light);margin-bottom:6px}
.pc-wt{font-size:10px;color:var(--muted);margin-bottom:8px}
.pc-comp{font-size:11px;color:var(--dim);line-height:1.6}

/* ── CONTACT ── */
.contact-wrap{padding:80px 64px;display:flex;gap:80px;max-width:1100px;margin:0 auto}
.contact-info{flex:1;max-width:400px}
.contact-title{font-family:'Cormorant Garamond',serif;font-size:2.2rem;font-weight:300;color:var(--light);margin-bottom:16px}
.contact-sub{font-size:13px;color:var(--muted);line-height:1.7;margin-bottom:36px}
.cm-row{display:flex;gap:12px;align-items:flex-start;margin-bottom:16px}
.cm-label{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);width:80px;flex-shrink:0;padding-top:2px}
.cm-value{font-size:13px;color:var(--text)}
.cm-value a{color:var(--gold)}
.contact-form{flex:1;max-width:460px}
.form-row{margin-bottom:18px}
.form-label{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:6px;display:block}
.form-input,.form-select,.form-textarea{
  width:100%;background:rgba(255,255,255,0.03);border:1px solid var(--border);
  color:var(--text);padding:10px 14px;font-size:12px;
  font-family:'Barlow',sans-serif;transition:border-color .2s;
}
.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--gold)}
.form-textarea{resize:vertical;min-height:100px}
.form-select option{background:var(--ink2)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.btn-submit{
  width:100%;padding:12px;background:var(--gold);color:#000;
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;
  font-family:'Barlow',sans-serif;cursor:pointer;border:none;transition:all .2s;
}
.btn-submit:hover{background:var(--sand)}
.form-success{
  display:none;text-align:center;padding:24px;
  border:1px solid rgba(76,168,130,0.3);color:#4CA882;font-size:13px;
}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .hero{padding:60px 40px}
  .hero-stats{grid-template-columns:repeat(2,1fr)}
  .hs-item:nth-child(2){border-right:none}
  .prod-grid{grid-template-columns:1fr 1fr}
  .mars-stats{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:768px){
  .nav-links,.nav-cta{display:none}
  .hamburger{display:flex}
  .hero{padding:40px 24px}
  .hero-title{font-size:2.4rem}
  .hero-stats{grid-template-columns:repeat(2,1fr)}
  .products{padding:48px 24px}
  .prod-grid{grid-template-columns:1fr}
  .mars-body{flex-direction:column;height:auto}
  .mars-sidebar{width:100%;height:300px}
  .mars-charts{flex-direction:column}
  .chart-panel{border-right:none;border-bottom:1px solid var(--border)}
  .contact-wrap{flex-direction:column;padding:40px 24px;gap:40px}
  .meth-wrap{padding:32px 24px}
  .pillar-grid{grid-template-columns:1fr}
  .main-footer{flex-direction:column;gap:16px;text-align:center;padding:24px}
}
@media(max-width:420px){
  .hero-stats{grid-template-columns:1fr 1fr}
  .hs-item{padding:16px 12px}
  .hero-actions{flex-direction:column}
  .btn-primary,.btn-secondary{text-align:center}
  .mars-stats{grid-template-columns:repeat(2,1fr)}
  .det-box-grid{grid-template-columns:repeat(2,1fr)}
  .form-grid{grid-template-columns:1fr}
}

/* ── REFINEMENT PASS: spacing, readability, hierarchy ── */

/* Prod grid: better card spacing */
.prod-card { padding: 32px 28px; }
.prod-name { margin-bottom: 12px; }
.prod-desc { line-height: 1.65; }
.prod-link { margin-top: 22px; }

/* Services: section spacing */
.srv-products { padding: 72px 64px; }
.srv-prod-title { margin-bottom: 8px; }
.srv-prod-sub { margin-bottom: 44px; }
.srv-prod-card { padding: 30px 28px; }
.spc-desc { line-height: 1.8; margin-bottom: 22px; }
.spc-name { margin-bottom: 12px; }

/* Custom research section */
.sc-item { padding: 18px 0; gap: 18px; }
.sc-item-title { margin-bottom: 6px; font-size: 12.5px; }
.sc-item-desc { line-height: 1.65; }
.sc-text { line-height: 1.9; margin-bottom: 28px; }

/* MARS dashboard: panels */
.mars-map-panel { flex: 0 0 260px; }
.mars-body { height: calc(100vh - 148px); }
.rank-row { padding: 10px 18px; }
.rr-name { line-height: 1.4; }
.chart-panel { padding: 18px 18px; }
.rank-bars { padding: 18px; }
.rb-row { margin-bottom: 11px; }
.mars-right { gap: 0; }

/* Map min-heights */
.dash-map-area { min-height: 300px; }
.map-wrap { min-height: 240px; }

/* Mobile improvements */
@media(max-width: 768px) {
  .prod-card { padding: 24px 20px; }
  .srv-prod-card { padding: 24px 20px; }
  .sc-item { padding: 14px 0; }
  .srv-products { padding: 48px 24px; }
  .srv-custom { padding: 48px 24px !important; }
  .sc-left { padding-right: 0; border-right: none; }
  .sc-right { padding-left: 0; }
  .mars-map-panel { flex: 0 0 220px; }
  .hero-stats { max-width: 100%; }
}

/* ── LIVE INTELLIGENCE TICKER ── */
.intel-ticker-wrap{
  display:flex;align-items:center;height:36px;
  background:#070b11;border-top:1px solid var(--border);border-bottom:1px solid var(--border);
  overflow:hidden;position:relative;
}
.intel-ticker-label{
  flex-shrink:0;padding:0 14px;height:100%;
  display:flex;align-items:center;
  font-size:8px;letter-spacing:.2em;text-transform:uppercase;
  color:#000;background:var(--gold);font-weight:600;
  border-right:1px solid rgba(212,175,55,.3);
}
.intel-ticker-track{flex:1;overflow:hidden;position:relative;height:100%}
.intel-ticker-inner{
  display:flex;align-items:center;white-space:nowrap;
  height:100%;
  animation:ticker-scroll 60s linear infinite;
}
.intel-ticker-inner:hover{animation-play-state:paused}
@keyframes ticker-scroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}
.it-item{font-size:11px;color:var(--muted);padding:0 20px;display:inline-flex;align-items:center;gap:8px}
.it-sep{color:rgba(212,175,55,.25);font-size:8px;flex-shrink:0}
.it-cat{font-size:8px;letter-spacing:.1em;text-transform:uppercase;padding:2px 7px;border-radius:0;flex-shrink:0}
.it-cat.conflict{color:#C45444;background:rgba(196,84,68,.12);border:1px solid rgba(196,84,68,.2)}
.it-cat.defense{color:var(--gold);background:rgba(212,175,55,.08);border:1px solid rgba(212,175,55,.2)}
.it-cat.assist{color:#4A7FC1;background:rgba(74,127,193,.1);border:1px solid rgba(74,127,193,.2)}
.it-cat.energy{color:#4CA882;background:rgba(76,168,130,.1);border:1px solid rgba(76,168,130,.2)}
.it-cat.policy{color:var(--muted);background:rgba(138,149,168,.08);border:1px solid rgba(138,149,168,.15)}

/* ── SAMPLE INTELLIGENCE OUTPUT ── */
.sample-intel-wrap{
  padding:80px 64px;background:var(--ink);border-top:1px solid var(--border);
}
.sample-intel-eyebrow{
  font-size:9px;letter-spacing:.25em;text-transform:uppercase;
  color:var(--gold);margin-bottom:40px;
}
.sample-intel-layout{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.sample-intel-badge{
  font-size:8px;letter-spacing:.2em;text-transform:uppercase;
  padding:4px 10px;border:1px solid rgba(212,175,55,.3);
  color:var(--gold);display:inline-block;margin-bottom:16px;
}
.sample-intel-title{
  font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:300;
  color:var(--light);line-height:1.2;margin-bottom:10px;
}
.sample-intel-meta{font-size:10px;color:var(--dim);margin-bottom:20px;letter-spacing:.04em}
.sample-intel-desc{font-size:12px;color:var(--muted);line-height:1.8;margin-bottom:24px}
.sample-intel-features{display:flex;flex-direction:column;gap:10px}
.sif-item{display:flex;align-items:flex-start;gap:10px;font-size:11px;color:var(--muted);line-height:1.5}
.sif-dot{width:4px;height:4px;background:var(--gold);border-radius:50%;flex-shrink:0;margin-top:6px}

/* Report preview card */
.sample-intel-preview{
  background:var(--ink2);border:1px solid var(--border);
  padding:28px;position:relative;overflow:hidden;
}
.sip-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.sip-header-tag{font-size:7px;letter-spacing:.15em;text-transform:uppercase;color:var(--dim)}
.sip-header-date{font-size:9px;color:var(--dim)}
.sip-title{font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--light);margin-bottom:4px}
.sip-sub{font-size:10px;color:var(--dim);margin-bottom:16px}
.sip-divider{height:1px;background:var(--border);margin-bottom:16px}
.sip-section-label{font-size:8px;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.sip-section-text{font-size:11px;color:var(--muted);line-height:1.7;margin-bottom:20px}
.sip-scenarios{display:flex;flex-direction:column;gap:10px}
.sip-scenario{display:flex;align-items:center;gap:10px}
.sip-scen-label{font-size:10px;color:var(--muted);width:110px;flex-shrink:0}
.sip-scen-bar{flex:1;height:4px;background:rgba(255,255,255,0.05)}
.sip-scen-fill{height:4px;transition:width 1s ease}
.sip-scen-pct{font-size:10px;color:var(--dim);width:30px;text-align:right}
.sip-blur-overlay{
  position:absolute;bottom:0;left:0;right:0;height:80px;
  background:linear-gradient(180deg,transparent,var(--ink2));
  pointer-events:none;
}

/* prod-subtitle */
.prod-subtitle{font-size:12px;color:var(--dim);line-height:1.7;max-width:640px;margin-bottom:36px}

/* ── GLOBAL SPACING / TYPOGRAPHY (TASK 7) ── */
.hero-tag{margin-bottom:20px}
.hero-title{margin-bottom:20px;letter-spacing:-.01em}
.hero-sub{margin-bottom:40px;font-size:14px}
.hero-stats{margin-top:32px}
.hs-item{padding:22px 20px}
.products{padding:88px 64px}
.section-tag{margin-bottom:10px;letter-spacing:.25em}
.section-title{margin-bottom:16px}

@media(max-width:1024px){
  .hero{grid-template-columns:1fr;padding:60px 40px 40px}
  .sample-intel-layout{grid-template-columns:1fr;gap:40px}
}
@media(max-width:768px){
  .sample-intel-wrap{padding:48px 24px}
  .products{padding:56px 24px}
  .intel-ticker-wrap{display:none}
}



.prod-card {
  display: flex;
  flex-direction: column;
  padding: 36px 32px;
  background: var(--ink2);
  border-bottom: 2px solid transparent;
  transition: border-color .2s, background .2s;
}
.prod-card:hover { border-bottom-color: var(--gold); background: var(--ink3); }
.prod-code {
  font-size: 9px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 10px;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.prod-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.35rem;
  color: var(--light);
  margin-bottom: 12px;
  line-height: 1.2;
}
.prod-desc {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.7;
  flex: 1;
}
.prod-link {
  margin-top: 22px;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--gold);
  cursor: pointer;
  display: inline-block;
  transition: color .2s;
  align-self: flex-start;
}
.prod-subtitle {
  font-size: 12.5px;
  color: var(--dim);
  line-height: 1.75;
  max-width: 600px;
  margin-bottom: 40px;
}
.products { padding: 88px 64px; }
.section-title { margin-bottom: 14px; }
.section-tag { letter-spacing: .25em; margin-bottom: 10px; }

/* T6 — Sample intelligence output section */
.sample-intel-wrap { padding: 88px 64px; background: var(--ink); border-top: 1px solid var(--border); }
.sample-intel-eyebrow { margin-bottom: 44px; font-size: 9px; letter-spacing: .25em; }
.sample-intel-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: start; }
.sample-intel-title { font-size: 2.1rem; margin-bottom: 12px; line-height: 1.15; }
.sample-intel-meta { margin-bottom: 22px; font-size: 10.5px; }
.sample-intel-desc { font-size: 12.5px; line-height: 1.8; margin-bottom: 28px; }
.sample-intel-features { gap: 12px; }
.sif-item { font-size: 11.5px; line-height: 1.55; }
.sample-intel-preview { padding: 32px; }
.sip-title { font-size: 1.5rem; margin-bottom: 6px; }
.sip-sub { margin-bottom: 20px; font-size: 10px; }
.sip-divider { margin-bottom: 20px; }
.sip-section-label { margin-bottom: 10px; }
.sip-section-text { font-size: 11.5px; line-height: 1.75; margin-bottom: 24px; }
.sip-scenario { gap: 12px; }
.sip-scen-label { font-size: 10.5px; width: 120px; }

/* T7 — Global spacing pass */
.hero-tag { margin-bottom: 22px; font-size: 10px; }
.hero-title { margin-bottom: 22px; line-height: 1.08; }
.hero-sub { margin-bottom: 44px; font-size: 14px; line-height: 1.75; }
.hero-stats { margin-top:32px; }
.hs-item { padding: 22px 20px; }
.hs-num { font-size: 30px; margin-bottom: 5px; }
.hs-lab { font-size: 9px; letter-spacing: .16em; }

/* T8 — Design language: reinforce gold separators and border details */
.intel-ticker-wrap { height: 38px; }
.it-item { font-size: 11px; }
.it-cat { border-radius: 1px; }

/* Responsive guard */

@media(max-width: 768px) {
  .prod-grid { grid-template-columns: 1fr; }
  .products { padding: 56px 24px; }
  .sample-intel-wrap { padding: 56px 24px; }
  .sample-intel-layout { grid-template-columns: 1fr; gap: 40px; }
  .hero-stats { grid-template-columns: repeat(2, 1fr); }
}
.hero-credibility{font-size:10px;color:var(--dim);line-height:1.6;margin-top:20px;max-width:560px;letter-spacing:.02em}

/* ══════════════════════════════════
   FINAL REFINEMENT PASS — Tasks 3,5-10
══════════════════════════════════ */

/* T3 — Platform status bar */
.platform-status-bar{
  width:100%;
  background:#0F1729;
  border-bottom:1px solid rgba(212,175,55,.12);
  padding:0 32px;
  height:28px;
  display:flex;align-items:center;
  overflow:hidden;
  position:relative;z-index:1;
}
.psb-inner{
  display:flex;align-items:center;gap:14px;
  font-size:9px;letter-spacing:.08em;
  white-space:nowrap;overflow:hidden;
}
.psb-live{
  color:var(--gold);font-size:8px;letter-spacing:.18em;
  font-weight:600;flex-shrink:0;
}
.psb-sep{color:rgba(212,175,55,.3);flex-shrink:0}
.psb-regions{color:var(--muted);flex-shrink:0}
.psb-dot{color:rgba(212,175,55,.4);margin:0 4px}
.psb-sources{
  color:var(--dim);font-size:8.5px;letter-spacing:.06em;
  padding-left:14px;border-left:1px solid rgba(255,255,255,.06);
  flex-shrink:0;
}

/* T5 — Global spacing improvements */
.products{ padding:80px 64px }
.sample-intel-wrap{ padding:80px 64px }

/* T6 — Product grid readability */
.prod-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--border);
  align-items:stretch;
}
/* 5-card grid: last card spans remaining 2 cols to fill row */
/* 5 cards in 3-col grid: card 5 is nth-child(3n+2) → span 2 cols */
@media(min-width:1201px){
  .prod-card:last-child:nth-child(3n+2){
    grid-column:span 2;
  }
}
/* 5 cards in 2-col grid (769–1200px): card 5 is nth-child(2n+1) → span 2 cols */
@media(min-width:769px) and (max-width:1200px){
  .prod-card:last-child:nth-child(2n+1){
    grid-column:span 2;
  }
}
/* nth-child span rule moved to prod-grid canonical block above */

/* prod-card base rule consolidated above */
.prod-card:hover{border-bottom-color:var(--gold);background:var(--ink3)}
.prod-name{
  font-family:'Cormorant Garamond',serif;
  font-size:1.3rem;color:var(--light);
  margin-bottom:12px;line-height:1.2;
}
.prod-desc{font-size:12px;color:var(--muted);line-height:1.72;flex:1}
.prod-link{margin-top:20px;align-self:flex-start}

/* T7 — MARS layout: map height + overall breathing room */
.mars-body{ height:calc(100vh - 144px); }
.mars-map-panel{ flex:0 0 290px; }
.map-wrap{ min-height:260px; }
.mars-right{ overflow:hidden; }

/* T8 — Sidebar rankings spacing */
.rank-row{
  padding:11px 18px;
  border-bottom:1px solid rgba(255,255,255,0.028);
}
.rr-name{ font-size:11.5px; line-height:1.4; }
.rr-region{ font-size:9px; margin-top:1px; }
.rr-score{ font-size:12.5px; }
.mars-side-head{ padding:14px 18px; }

/* T9 — Chart containers */
.chart-panel{ padding:20px 20px 16px; }
.chart-head{ margin-bottom:16px; }
.ch-title{ font-size:13px;margin-top:3px; }
.ch-sub{ font-size:8.5px;letter-spacing:.14em; }
.spend-row{ margin-bottom:9px; }
.sr-name{ font-size:10.5px; }
.rb-row{ margin-bottom:12px; }
.rb-name{ font-size:10.5px; }

/* T10 — Reduce visual noise */
.mars-stats{ border-bottom:1px solid var(--border); }
.ms-item{ padding:14px 24px; }
.mars-panel-head{ padding:11px 18px; }
.mars-panel-title{ letter-spacing:.14em; }
.spi-row{ border-bottom:1px solid rgba(255,255,255,0.025); }
.rank-row:last-child{ border-bottom:none; }

/* Responsive guard */
@media(max-width:1200px){
  .prod-grid{ grid-template-columns:repeat(2,1fr); }
}

@media(max-width:1024px){
  .globe-header{
    grid-template-columns:1fr;
    align-items:flex-start;
  }
  .globe-header-metric{
    text-align:left;
    padding:0;
  }
  .globe-controls{
    justify-content:flex-start;
    flex-wrap:wrap;
  }
}
@media(max-width:768px){
  .platform-status-bar{ display:none; }
  .prod-grid{ grid-template-columns:1fr; }
  .products{ padding:56px 24px; }
  .sample-intel-wrap{ padding:56px 24px; }
  .mars-body{ height:auto; }
  .mars-map-panel{ flex:0 0 220px; }
}

/* ── INTERACTIVE GLOBE ── */
.globe-section{
  background:var(--ink2);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  clear:both;
}
.globe-header{
  padding:14px 64px 12px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center;
  column-gap:28px;
  row-gap:10px;
  border-bottom:1px solid var(--border);
}
.globe-header-left{
  min-width:0;
}
.globe-header-metric{
  text-align:center;
  padding:0 8px;
  flex-shrink:0;
}
.ghm-value{
  font-family:'Cormorant Garamond',serif;
  font-size:2rem;
  line-height:1;
  color:var(--gold);
}
.ghm-label{
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--dim);
  margin-top:2px;
}
.globe-eyebrow{
  font-size:9px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold);margin-bottom:3px;
}
.globe-subtitle{font-size:11px;color:var(--muted);line-height:1.5;white-space:normal}
.globe-hint{color:var(--dim);font-size:10px;margin-left:6px;display:inline}
.globe-controls{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-shrink:0}
.globe-btn{
  font-size:8px;letter-spacing:.1em;text-transform:uppercase;
  padding:5px 12px;border:1px solid var(--border);
  color:var(--dim);background:none;cursor:pointer;
  font-family:'Barlow',sans-serif;transition:all .2s;
}
.globe-btn:hover{border-color:rgba(212,175,55,.4);color:var(--gold)}
.globe-btn-active{
  border-color:rgba(212,175,55,.5)!important;
  color:var(--gold)!important;
  background:rgba(212,175,55,.07)!important;
}
.globe-wrap{
  position:relative;height:500px;
  overflow:hidden;background:#050e18;
  display:flex;align-items:center;justify-content:center;
}
.globe-overlay-tl{
  position:absolute;top:16px;left:24px;z-index:2;
  pointer-events:none;
}
.got-label{
  font-size:8px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(212,175,55,.6);margin-bottom:2px;
}
.got-count{font-size:10px;color:var(--dim)}
.globe-legend{
  padding:8px 64px;background:var(--ink2);
  border-top:1px solid var(--border);
  display:flex;gap:24px;flex-wrap:wrap;
}
.gl-item{display:flex;align-items:center;gap:6px;font-size:9px;color:var(--dim)}
.gl-dot{width:10px;height:10px;border-radius:1px;flex-shrink:0}
@media(max-width:768px){
  .globe-header{
    padding:12px 24px;
    grid-template-columns:1fr;
    align-items:flex-start;
  }
  .globe-header-metric{
    text-align:left;
    padding:0;
  }
  .globe-controls{
    justify-content:flex-start;
    flex-wrap:wrap;
  }
  .globe-subtitle{font-size:10.5px;line-height:1.55}
  .ghm-value{font-size:1.6rem}
  .globe-wrap{height:360px}  .globe-header{padding:12px 24px}
  .globe-legend{padding:8px 24px;gap:14px}
  .globe-wrap{height:360px}
}

/* ══════════════════════════════════════════════════════
   SPEC BRIEF STYLES — sb-* classes
══════════════════════════════════════════════════════ */
.spec-hub{padding:32px 48px 64px}
.spec-catalog{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-top:8px}
.spec-card{background:var(--ink2);border:1px solid var(--border);padding:24px;cursor:pointer;transition:all .2s}
.spec-card:hover{border-color:rgba(212,175,55,.4);transform:translateY(-2px)}
.spec-card-badge{font-size:8px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
.spec-card-country{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:300;color:var(--light);margin-bottom:2px}
.spec-card-region{font-size:10px;color:var(--dim);margin-bottom:12px;letter-spacing:.05em}
.spec-card-score{display:flex;align-items:baseline;gap:10px;margin-bottom:12px}
.spec-card-score-val{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:600}
.spec-card-score-cls{font-size:9px;letter-spacing:.12em;text-transform:uppercase;font-weight:600}
.spec-card-desc{font-size:11px;color:var(--muted);line-height:1.65;margin-bottom:14px}
.spec-card-cta{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
/* SPEC brief page layout */
.spec-brief-page{min-height:100vh;background:var(--ink)}
.sb-topbar{
  position:sticky;top:56px;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 24px;height:44px;
  background:rgba(8,12,18,0.98);border-bottom:1px solid var(--border);
}
.sb-back{
  padding:5px 12px;border:1px solid var(--border);
  font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  cursor:pointer;background:none;font-family:'Barlow',sans-serif;transition:all .2s;
}
.sb-back:hover{border-color:var(--gold);color:var(--gold)}
.sb-badge{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}
.sb-cta{
  padding:6px 16px;background:var(--gold);color:#000;
  font-size:9px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;
  font-family:'Barlow',sans-serif;cursor:pointer;border:none;transition:all .2s;
}
.sb-cta:hover{background:var(--sand)}
/* Gate overlay */
.sb-gate{
  position:fixed;inset:0;z-index:200;
  background:rgba(5,10,16,0.92);backdrop-filter:blur(8px);
  display:flex;align-items:center;justify-content:center;
}
.sb-gate-box{
  background:var(--ink2);border:1px solid rgba(212,175,55,.3);
  width:100%;max-width:480px;margin:20px;
}
.sb-gate-hdr{
  background:#0F1729;border-bottom:2px solid var(--gold);
  padding:20px 28px;
}
.sb-gate-title{font-family:'Cormorant Garamond',serif;font-size:22px;color:var(--light);margin-bottom:4px}
.sb-gate-sub{font-size:10px;color:var(--dim);letter-spacing:.06em}
.sb-gate-body{padding:24px 28px}
.sb-gate-inp{
  width:100%;background:rgba(255,255,255,.04);border:1px solid var(--border);
  color:var(--text);padding:10px 14px;font-size:12px;
  font-family:'Barlow',sans-serif;margin-bottom:10px;display:block;
  transition:border-color .2s;outline:none;
}
.sb-gate-inp:focus{border-color:var(--gold)}
.sb-gate-btn{
  width:100%;padding:12px;background:var(--gold);color:#000;
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;
  font-family:'Barlow',sans-serif;cursor:pointer;border:none;margin-top:4px;
}
.sb-gate-note{font-size:10px;color:var(--dim);margin-top:10px;text-align:center}
.sb-gate-skip{font-size:10px;color:rgba(212,175,55,.5);margin-top:8px;text-align:center;cursor:pointer}
.sb-gate-skip:hover{color:var(--gold)}
/* Brief cover */
.sb-cover{border-bottom:1px solid var(--border)}
.sb-cover-main{
  display:grid;grid-template-columns:1fr auto;gap:40px;align-items:start;
  padding:36px 48px;background:linear-gradient(135deg,rgba(212,175,55,.04) 0%,transparent 60%),var(--ink);
}
.sb-cover-type{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.sb-cover-country{font-family:'Cormorant Garamond',serif;font-size:clamp(2.4rem,5vw,4rem);font-weight:300;color:var(--light);line-height:1}
.sb-cover-region{font-size:11px;color:var(--muted);margin-top:6px;letter-spacing:.06em}
.sb-cover-right{text-align:center;padding:20px 24px;background:var(--ink2);border:1px solid var(--border);min-width:160px}
.sb-atlas-label{font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.sb-atlas-score{font-family:'Cormorant Garamond',serif;font-size:3.2rem;font-weight:600;line-height:1}
.sb-atlas-class{font-size:9px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;margin-top:4px;margin-bottom:10px}
.sb-atlas-bar-bg{height:4px;background:rgba(255,255,255,.08);margin-bottom:8px}
.sb-atlas-bar-fill{height:4px;transition:width .8s ease}
/* Decision frame */
.sb-decision-frame{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--border);border-top:1px solid var(--border);
}
.sb-df-cell{background:var(--ink2);padding:18px 22px}
.sb-df-label{font-size:9px;letter-spacing:.15em;text-transform:uppercase;margin-bottom:6px;font-weight:700}
.sb-df-text{font-size:11px;color:var(--muted);line-height:1.65}
/* CIQ */
.sb-ciq{padding:20px 48px;background:rgba(212,175,55,.03);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.sb-ciq-label{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.sb-ciq-q{font-family:'Cormorant Garamond',serif;font-size:1.2rem;color:var(--light);line-height:1.5;margin-bottom:8px}
.sb-ciq-subs{font-size:10px;color:var(--dim);line-height:1.7}
/* Brief body */
.sb-body{padding:0 48px 48px}
.sb-section{padding:28px 0;border-bottom:1px solid var(--border)}
.sb-section:last-child{border-bottom:none}
.sb-section-hdr{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.sb-section-num{
  width:28px;height:28px;background:rgba(212,175,55,.12);border:1px solid rgba(212,175,55,.25);
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-family:'Cormorant Garamond',serif;color:var(--gold);flex-shrink:0;
}
.sb-section-title{font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--light)}
.sb-section p,.sb-body p{font-size:12px;color:var(--muted);line-height:1.8;margin-bottom:12px}
/* Tables */
.sb-table{width:100%;border-collapse:collapse;font-size:11px;margin-bottom:12px}
.sb-table th{font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);padding:6px 10px;text-align:left;border-bottom:1px solid var(--border);background:rgba(255,255,255,.02)}
.sb-table td{padding:7px 10px;color:var(--text);border-bottom:1px solid rgba(255,255,255,.03);line-height:1.5;vertical-align:top}
.sb-table tr:hover td{background:rgba(255,255,255,.02)}
/* KV pairs */
.sb-kv{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);margin-bottom:12px}
.sb-kv-item{background:var(--ink2);padding:12px 14px}
.sb-kv-label{font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:4px}
.sb-kv-value{font-size:12px;color:var(--text);line-height:1.4}
/* Finding box */
.sb-finding{background:rgba(212,175,55,.05);border-left:3px solid var(--gold);padding:14px 18px;margin:12px 0}
.sb-finding-label{font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.sb-finding-text{font-size:12px;color:var(--text);line-height:1.75}
/* Callout */
.sb-callout{background:rgba(74,127,193,.06);border-left:3px solid #4A7FC1;padding:14px 18px;margin:12px 0}
.sb-callout-label{font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:#4A7FC1;margin-bottom:6px}
.sb-callout-text{font-size:11px;color:var(--muted);line-height:1.75}
/* Source line */
.sb-source{font-size:9px;color:var(--dim);margin-top:10px;padding-top:8px;border-top:1px solid rgba(255,255,255,.04);line-height:1.6}
/* CoG */
.sb-cog{display:flex;gap:0;border:1px solid var(--border);margin:12px 0}
.sb-cog-label-col{background:rgba(212,175,55,.06);border-right:1px solid var(--border);padding:16px 18px;min-width:130px;flex-shrink:0}
.sb-cog-marker{font-size:8px;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.sb-cog-var{font-family:'Cormorant Garamond',serif;font-size:14px;color:var(--light);line-height:1.4}
.sb-cog-body{padding:16px 18px;flex:1}
.sb-cog-text{font-size:12px;color:var(--muted);line-height:1.75}
/* Signal grid */
.sb-signal-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);margin:12px 0}
.sb-signal-col{background:var(--ink2);padding:16px 18px}
.sb-signal-hdr{font-size:9px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;margin-bottom:10px}
.sb-signal-item{display:flex;gap:8px;font-size:11px;color:var(--muted);line-height:1.55;margin-bottom:6px}
.sb-signal-dot{color:var(--gold);flex-shrink:0}
.sb-noise-dot{color:var(--dim);flex-shrink:0}
/* EWI */
.sb-ewi{border:1px solid var(--border);font-size:11px}
.sb-ewi-row{display:grid;grid-template-columns:1.4fr 1.4fr 1.4fr .6fr;border-bottom:1px solid rgba(255,255,255,.04)}
.sb-ewi-row:last-child{border-bottom:none}
.sb-ewi-cell{padding:8px 12px;color:var(--muted);vertical-align:top;line-height:1.5}
.sb-ewi-hdr{font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);background:rgba(255,255,255,.02)}
/* Scenarios */
.sb-scenarios{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);margin:12px 0}
.sb-scen{background:var(--ink2);padding:20px}
.sb-scen-label{font-size:8px;letter-spacing:.15em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.sb-scen-title{font-family:'Cormorant Garamond',serif;font-size:1.1rem;color:var(--light);margin-bottom:4px}
.sb-scen-prob{font-family:'Cormorant Garamond',serif;font-size:1.8rem;font-weight:600;margin-bottom:4px}
.sb-scen-prob-wrap{margin:0 0 8px}
.sb-scen-prob-track{height:4px;background:rgba(255,255,255,.07);width:100%;margin-top:4px;overflow:hidden}
.sb-scen-prob-fill{height:4px;width:0;transition:width 1s ease}
.sb-scen-text{font-size:11px;color:var(--muted);line-height:1.65}
/* Red team */
.sb-redteam{border:1px solid var(--border)}
.sb-rt-row{display:grid;grid-template-columns:.7fr 2fr 1.5fr;gap:0;border-bottom:1px solid rgba(255,255,255,.04)}
.sb-rt-row:last-child{border-bottom:none}
.sb-rt-label{padding:14px 16px;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);background:rgba(212,175,55,.04);border-right:1px solid var(--border);line-height:1.5}
.sb-rt-cell{padding:14px 16px;font-size:11px;color:var(--muted);line-height:1.65;border-right:1px solid var(--border)}
.sb-rt-cell:last-child{border-right:none}
/* PIR */
.sb-pir{display:flex;flex-direction:column;gap:1px}
.sb-pir-item{display:flex;gap:16px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.04);align-items:flex-start}
.sb-pir-item:last-child{border-bottom:none}
.sb-pir-num{width:28px;height:28px;background:rgba(212,175,55,.1);border:1px solid rgba(212,175,55,.2);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:14px;color:var(--gold);flex-shrink:0}
.sb-pir-text{font-size:12px;color:var(--text);margin-bottom:4px;line-height:1.5}
.sb-pir-why{font-size:10px;color:var(--dim);line-height:1.6}
/* CTA section */
.sb-cta-section{padding:40px 48px;background:var(--ink2);border-top:2px solid var(--gold)}
.sb-cta-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border)}
.sb-cta-col{background:var(--ink2);padding:24px}
.sb-cta-tier{font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--gold);margin-bottom:4px}
.sb-cta-sub{font-size:11px;color:var(--light);font-weight:500;margin-bottom:8px}
.sb-cta-desc{font-size:11px;color:var(--muted);line-height:1.65;margin-bottom:12px}
.sb-cta-action{font-size:11px;color:var(--text);line-height:1.6}




/* ── MOBILE DASHBOARD FIXES ── */
@media(max-width:768px){
  .dash-layout{flex-direction:column;height:auto;overflow:visible}
  .dash-sidebar{width:100%;border-right:none;border-bottom:1px solid var(--border);max-height:300px;overflow-y:auto}
  .dash-main{overflow:visible}
  .dash-map-area{min-height:220px;flex:0 0 220px}
  .dash-detail{padding:14px 16px}
  .det-grid{grid-template-columns:repeat(2,1fr)}
  .db-tabbar{overflow-x:auto;-webkit-overflow-scrolling:touch;padding:0 12px}
  .db-tab{padding:12px 14px;font-size:9px}
  .hub-grid{grid-template-columns:1fr!important}
  .freshness-strip{padding:6px 14px;gap:10px}
  .freshness-item{font-size:8px}
  /* ATLAS mobile */
  .atlas-wrap{flex-direction:column;height:auto}
  .atlas-sidebar{width:100%;height:auto;border-right:none;border-bottom:1px solid var(--border)}
  .atlas-country-list{max-height:200px}
  .atlas-map-panel{height:160px}
  .atlas-kpi-grid{grid-template-columns:repeat(2,1fr)}
  .atlas-score-breakdown{grid-template-columns:1fr 1fr}
  /* HERMES mobile */
  .hermes-wrap{flex-direction:column;height:auto}
  .hermes-sidebar{width:100%;height:auto;border-right:none;border-bottom:1px solid var(--border)}
  .hermes-source-list{max-height:120px}
  .hermes-main{min-height:400px}
  /* Compare modal */
  .compare-selectors{grid-template-columns:1fr}
  .compare-modal{padding:60px 8px 40px}
  /* SPEC mobile improvements */
  .sb-kv{grid-template-columns:1fr 1fr}
  .sb-scenarios{grid-template-columns:1fr}
  .sb-decision-frame{grid-template-columns:1fr}
  .sb-topbar .sb-badge{display:none}
  /* Search bar in hermes feed head on mobile */
  .hermes-feed-head{flex-wrap:wrap;gap:6px}
  #hermes-keyword{width:100%!important;order:3}
}
@media(max-width:480px){
  .hub-header{padding:24px 16px 20px}
  .hub-title{font-size:1.4rem}
  .compare-metric-row{grid-template-columns:100px 1fr 1fr}
  .freshness-strip{display:none}
}

/* ── COUNTRY COMPARISON TOOL ── */
.compare-modal{
  display:none;position:fixed;inset:0;z-index:800;
  background:rgba(5,10,16,.96);backdrop-filter:blur(8px);
  align-items:flex-start;justify-content:center;
  overflow-y:auto;padding:80px 20px 40px;
}
.compare-box{
  background:var(--ink2);border:1px solid var(--border);
  width:100%;max-width:900px;
}
.compare-hdr{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 24px;border-bottom:1px solid var(--border);
  background:#0F1729;
}
.compare-title{font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--light)}
.compare-sub{font-size:9px;color:var(--dim);margin-top:2px;letter-spacing:.08em}
.compare-close{background:none;border:none;color:var(--dim);font-size:20px;cursor:pointer}
.compare-selectors{
  display:grid;grid-template-columns:1fr 1fr 1fr;gap:1px;
  background:var(--border);border-bottom:1px solid var(--border);
}
.compare-sel-col{background:var(--ink2);padding:12px 16px}
.compare-sel-label{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.compare-select{
  width:100%;background:rgba(255,255,255,.04);border:1px solid var(--border);
  color:var(--text);padding:7px 10px;font-size:12px;
  font-family:'Barlow',sans-serif;outline:none;
}
.compare-select:focus{border-color:var(--gold)}
.compare-select option{background:var(--ink2)}
.compare-grid{padding:20px 24px}
.compare-metric-row{
  display:grid;grid-template-columns:140px 1fr 1fr 1fr;
  gap:0;border-bottom:1px solid rgba(255,255,255,.04);
  align-items:center;
}
.compare-metric-row:last-child{border-bottom:none}
.compare-metric-label{
  font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--dim);padding:10px 0;padding-right:10px;
}
.compare-val{
  padding:10px 14px;font-size:13px;text-align:center;
  font-family:'Barlow Condensed',sans-serif;
}
.compare-val.best{color:var(--gold)}
.compare-section-hdr{
  font-size:8px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold);padding:12px 0 6px;
  border-top:1px solid rgba(212,175,55,.15);margin-top:8px;
}
.compare-bar-row{display:flex;align-items:center;gap:6px;margin-bottom:4px}
.compare-bar{flex:1;height:4px;background:rgba(255,255,255,.06)}
.compare-bar-fill{height:4px;transition:width .6s ease}

/* ── METRIC TOOLTIPS / EXPLAINERS ── */
.metric-info{
  display:inline-flex;align-items:center;justify-content:center;
  width:13px;height:13px;border-radius:50%;
  border:1px solid rgba(212,175,55,.3);color:rgba(212,175,55,.6);
  font-size:8px;cursor:pointer;margin-left:4px;flex-shrink:0;
  vertical-align:middle;line-height:1;transition:all .15s;
  font-family:'Barlow',sans-serif;
}
.metric-info:hover{border-color:var(--gold);color:var(--gold);background:rgba(212,175,55,.08)}
/* Tooltip popup */
.metric-tooltip{
  position:fixed;z-index:900;
  background:var(--ink2);border:1px solid rgba(212,175,55,.35);
  padding:14px 18px;max-width:320px;min-width:220px;
  box-shadow:0 12px 40px rgba(0,0,0,.6);
  pointer-events:none;
  opacity:0;transition:opacity .15s;
}
.metric-tooltip.visible{opacity:1;pointer-events:auto}
.mt-label{font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.mt-title{font-family:'Cormorant Garamond',serif;font-size:1.05rem;color:var(--light);margin-bottom:8px}
.mt-desc{font-size:11px;color:var(--muted);line-height:1.7;margin-bottom:8px}
.mt-drivers{font-size:10px;color:var(--dim);line-height:1.6}
.mt-drivers strong{color:var(--muted)}
.mt-close{position:absolute;top:8px;right:10px;font-size:14px;color:var(--dim);cursor:pointer;background:none;border:none;padding:0}


/* ── EWI SUBSCRIPTION WIDGET ── */
.ewi-sub-strip{
  background:rgba(212,175,55,.04);
  border:1px solid rgba(212,175,55,.2);
  padding:14px 24px;margin-bottom:20px;
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
}

/* ── SPEC PRINT / PDF ── */
@media print{
  .site-nav,.sb-topbar,.sb-gate,.ewi-sub-strip,
  .mobile-nav,#admin-modal,#admin-badge{display:none!important}
  @page{margin:15mm;size:A4}
}
.spec-pdf-btn{
  padding:5px 12px;border:1px solid rgba(212,175,55,.35);
  font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);
  background:none;cursor:pointer;font-family:'Barlow',sans-serif;
}
.spec-pdf-btn:hover{background:rgba(212,175,55,.08)}

/* Responsive SPEC */
@media(max-width:768px){
  .spec-hub{padding:20px 20px 40px}
  .sb-cover-main{grid-template-columns:1fr;padding:24px 20px}
  .sb-cover-right{text-align:left}
  .sb-decision-frame{grid-template-columns:1fr}
  .sb-ciq{padding:16px 20px}
  .sb-body{padding:0 20px 32px}
  .sb-kv{grid-template-columns:1fr 1fr}
  .sb-signal-grid{grid-template-columns:1fr}
  .sb-scenarios{grid-template-columns:1fr}
  .sb-ewi-row{grid-template-columns:1fr 1fr}
  .sb-rt-row{grid-template-columns:1fr}
  .sb-cta-grid{grid-template-columns:1fr}
  .sb-redteam .sb-rt-cell{border-right:none}
  .sb-topbar .sb-badge{display:none}
}

/* ══════════════════════════════════════════════════════
   ADMIN UNLOCK MODAL
══════════════════════════════════════════════════════ */
#admin-modal{
  display:none;position:fixed;inset:0;z-index:999;
  background:rgba(5,10,16,.95);backdrop-filter:blur(10px);
  align-items:center;justify-content:center;
}
.admin-box{
  background:var(--ink2);border:1px solid rgba(212,175,55,.4);
  width:100%;max-width:380px;margin:20px;padding:32px;
}
.admin-box-title{font-family:'Cormorant Garamond',serif;font-size:1.5rem;color:var(--light);margin-bottom:4px}
.admin-box-sub{font-size:10px;color:var(--dim);letter-spacing:.06em;margin-bottom:20px}
.admin-inp{
  width:100%;background:rgba(255,255,255,.04);border:1px solid var(--border);
  color:var(--text);padding:10px 14px;font-size:13px;font-family:'Barlow',sans-serif;
  margin-bottom:12px;outline:none;transition:border-color .2s;display:block;
}
.admin-inp:focus{border-color:var(--gold)}
.admin-btn{
  width:100%;padding:11px;background:var(--gold);color:#000;
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;
  font-family:'Barlow',sans-serif;cursor:pointer;border:none;
}
.admin-err{font-size:11px;color:#C45444;margin-top:8px;display:none}
.admin-cancel{font-size:10px;color:var(--dim);margin-top:10px;text-align:center;cursor:pointer}
.admin-cancel:hover{color:var(--gold)}
#admin-badge{
  display:none;position:fixed;bottom:16px;right:16px;z-index:500;
  background:var(--gold);color:#000;
  font-size:9px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  padding:5px 12px;cursor:pointer;
}
</style>
</head>
<body>
<form name="ewi-subscription" data-netlify="true" hidden><input name="email"/></form>
<form name="spec-brief-gate" data-netlify="true" netlify-honeypot="bot-field" hidden><input name="email"/><input name="org"/><input name="brief"/></form>



<!-- ── COUNTRY COMPARISON MODAL ── -->
<div id="compare-modal" class="compare-modal">
  <div class="compare-box">
    <div class="compare-hdr">
      <div>
        <div class="compare-title">Country Comparison</div>
        <div class="compare-sub">SPI · MARS · ATLAS — Select up to 3 countries</div>
      </div>
      <button class="compare-close" onclick="closeCompare()">×</button>
    </div>
    <div class="compare-selectors">
      <div class="compare-sel-col">
        <div class="compare-sel-label">Country 1</div>
        <select class="compare-select" id="compare-c1" onchange="renderCompare()">
          <option value="">— Select —</option>
        </select>
      </div>
      <div class="compare-sel-col">
        <div class="compare-sel-label">Country 2</div>
        <select class="compare-select" id="compare-c2" onchange="renderCompare()">
          <option value="">— Select —</option>
        </select>
      </div>
      <div class="compare-sel-col">
        <div class="compare-sel-label">Country 3 (optional)</div>
        <select class="compare-select" id="compare-c3" onchange="renderCompare()">
          <option value="">— None —</option>
        </select>
      </div>
    </div>
    <div class="compare-grid" id="compare-grid">
      <div style="text-align:center;padding:32px;color:var(--dim);font-size:12px">Select countries above to compare</div>
    </div>
  </div>
</div>

<!-- ── METRIC TOOLTIP POPUP ── -->
<div id="metric-tooltip" class="metric-tooltip">
  <button class="mt-close" onclick="hideMetricTooltip()">×</button>
  <div class="mt-label" id="mt-label">METRIC</div>
  <div class="mt-title" id="mt-title">—</div>
  <div class="mt-desc" id="mt-desc">—</div>
  <div class="mt-drivers" id="mt-drivers"></div>
</div>

<!-- ── ADMIN UNLOCK MODAL ── -->
<div id="admin-modal">
  <div class="admin-box">
    <div class="admin-box-title">Administrator Access</div>
    <div class="admin-box-sub">Enter your admin password to view all dashboard tiers</div>
    <input class="admin-inp" type="password" id="admin-pass-input" placeholder="Password"
      onkeydown="if(event.key==='Enter')submitAdminPass()">
    <button class="admin-btn" onclick="submitAdminPass()">Unlock Full Access →</button>
    <div class="admin-err" id="admin-login-err">Incorrect password. Try again.</div>
    <div class="admin-cancel" onclick="closeAdminLogin()">Cancel</div>
  </div>
</div>
<div id="admin-badge" onclick="lockAdmin()" title="Click to re-lock">✓ ADMIN VIEW — Click to lock</div>


<!-- ── NAVIGATION ── -->
<nav class="site-nav">
  <div class="nav-brand" onclick="showPage('main')">
    <div class="nav-logo">RG</div>
    <div class="nav-name">RepubliQ Global</div>
  </div>
  <div class="nav-links">
    <a href="#" onclick="showPage('main');return false;">Home</a>
    <a href="#" onclick="showPage('services');return false;">Services</a>
    <a href="#" onclick="showPage('about');return false;">About</a>
    <a href="#" onclick="showPage('dashb');return false;">Dashboard</a>
    <a href="#" onclick="showPage('military');return false;">MARS Monitor</a>
    <a href="#" onclick="showPage('methodology');return false;">Methodology</a>
    <a href="#" onclick="showPage('contact');return false;">Contact</a>
    <a href="#" onclick="showPage('spec');return false;" style="color:var(--gold);font-weight:600;">SPEC Briefs ↓</a>
  </div>
  <button class="nav-cta" onclick="showPage('contact')" style="background:var(--gold);color:#000;border-color:var(--gold);">Get Intelligence →</button>
  <div class="hamburger" onclick="toggleMobileNav()" id="hamburger-btn">
    <span></span><span></span><span></span>
  </div>
</nav>

<div class="mobile-nav" id="mobile-nav">
  <a href="#" onclick="showPage('main');closeMobileNav();return false;">Home</a>
  <a href="#" onclick="showPage('services');closeMobileNav();return false;">Services</a>
  <a href="#" onclick="showPage('about');closeMobileNav();return false;">About</a>
  <a href="#" onclick="showPage('dashb');closeMobileNav();return false;">Dashboard</a>
  <a href="#" onclick="showPage('military');closeMobileNav();return false;">MARS Monitor</a>
  <a href="#" onclick="showPage('methodology');closeMobileNav();return false;">Methodology</a>
  <a href="#" onclick="showPage('contact');closeMobileNav();return false;">Contact</a>
  <a href="#" onclick="showPage('spec');closeMobileNav();return false;" style="color:var(--gold);">SPEC Briefs ↓</a>
</div>

<!-- ══════════════ MAIN PAGE ══════════════ -->
<div class="page-section active" id="page-main">
  <!-- ── PLATFORM STATUS BAR ── -->
  <div class="platform-status-bar" style="background:rgba(212,175,55,.04);border-bottom:1px solid rgba(212,175,55,.12);">
    <div class="psb-inner">
      <span class="psb-live">● LIVE</span>
      <span class="psb-sep">·</span>
      <span class="psb-regions">MENA <span class="psb-dot">◆</span> Horn of Africa <span class="psb-dot">◆</span> Red Sea <span class="psb-dot">◆</span> Gulf <span class="psb-dot">◆</span> East Africa</span>
      <span class="psb-sources">Sources: SIPRI <span class="psb-dot">·</span> ACLED <span class="psb-dot">·</span> World Bank <span class="psb-dot">·</span> DSCA <span class="psb-dot">·</span> Regional Media <span class="psb-dot">·</span> Maritime AIS</span>
    </div>
  </div>


  <div class="hero" style="background:var(--ink2);border-bottom:1px solid var(--border);">
    <div class="hero-left">
      <div class="hero-top">
        <div class="hero-tag">Horn of Africa · Red Sea Basin · MENA · East Africa</div>
        <h1 class="hero-title">Practitioner-Led<br>Intelligence for<br><em>Consequential</em><br>Decisions</h1>
      </div>
      <div class="hero-bottom">
        <p class="hero-sub">RepubliQ Global is led by a former Rendon Group country analyst, co-founder of SLPA, and Deloitte GPS Manager — combining institutional research credibility, active clearance, and four regional languages into decision-grade intelligence for organisations where the stakes are highest.</p>
        <div class="hero-actions">
          <button class="btn-primary" onclick="showPage('spec')">↓ Download Free Intelligence Brief</button>
          <button class="btn-secondary" onclick="showPage('about')">Meet the Team →</button>
        </div>
        <div class="hero-stats">
          <div class="hs-item"><div class="hs-num">57</div><div class="hs-lab">Countries</div></div>
          <div class="hs-item"><div class="hs-num">395K</div><div class="hs-lab">Conflict Events</div></div>
          <div class="hs-item"><div class="hs-num">29</div><div class="hs-lab">Dossier Sections</div></div>
          <div class="hs-item"><div class="hs-num">4</div><div class="hs-lab">Regional Languages</div></div>
        </div>
        <p class="hero-credibility">Trusted by legal practitioners, development organisations, security consultancies, and investors operating in East Africa and the Red Sea corridor.</p>
      </div>
    </div>
  </div>

  <!-- ── INTERACTIVE GLOBE ── -->


  <div class="globe-section">
    <div class="globe-header">
      <div class="globe-header-left">
        <div class="globe-eyebrow">Live Intelligence Coverage</div>
        <div class="globe-subtitle">57 countries monitored · MENA · East Africa · South Asia · <span class="globe-hint">Drag to rotate · Hover for data · Click to explore</span></div>
      </div>
      <div class="globe-header-metric">
        <div class="ghm-value">395K</div>
        <div class="ghm-label">Conflict Events</div>
      </div>
      <div class="globe-controls">
        <button onclick="setHomeLayer('spi')" id="hl-spi" class="globe-btn globe-btn-active">SPI</button>
        <button onclick="setHomeLayer('mars')" id="hl-mars" class="globe-btn">Military</button>
        <button onclick="setHomeLayer('conflict')" id="hl-conflict" class="globe-btn">Conflict</button>
        <button onclick="toggleGlobeRotation()" id="globe-rotate-btn" class="globe-btn" title="Pause/resume rotation">⏸</button>
      </div>
    </div>
    <div class="globe-wrap" id="home-map-wrap">
      <svg id="home-map" style="width:100%;height:100%;display:block;cursor:grab"></svg>
      <div class="map-tip" id="home-mtt"></div>
      <div class="globe-overlay-tl">
        <div class="got-label">STRATEGIC POWER INDEX</div>
        <div class="got-count" id="globe-country-count">57 countries</div>
      </div>
    </div>
    <div class="globe-legend">
      <div id="globe-legend-items">
      <div class="gl-item"><div class="gl-dot" style="background:#8B1A0A"></div>Dominant / Tier 1</div>
      <div class="gl-item"><div class="gl-dot" style="background:#C45444"></div>Major / Tier 2</div>
      <div class="gl-item"><div class="gl-dot" style="background:#D4874A"></div>Significant / Tier 3</div>
      <div class="gl-item"><div class="gl-dot" style="background:#8B6914"></div>Emerging / Tier 4</div>
      <div class="gl-item"><div class="gl-dot" style="background:#1a2d42"></div>Outside coverage</div>
      </div>
    </div>
  </div>

  <!-- ── EAST AFRICA + RED SEA REGIONAL MAP ── -->
  <div id="regional-map-section" style="background:var(--ink);padding:56px 64px 40px;border-top:1px solid var(--border);">
    <div style="max-width:1160px;margin:0 auto;">
      <div style="display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:28px;flex-wrap:wrap;gap:16px;">
        <div>
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:10px;">Strategic Coverage Zone</div>
          <h2 style="font-family:'Cormorant Garamond',serif;font-size:clamp(22px,2.4vw,34px);font-weight:300;color:var(--light);line-height:1.15;">East Africa · Horn · Red Sea Basin</h2>
        </div>
        <div style="display:flex;gap:16px;align-items:center;flex-wrap:wrap;">
          <div style="display:flex;align-items:center;gap:6px;"><div style="width:10px;height:10px;background:#8B0000;"></div><span style="font-size:9px;color:var(--dim);letter-spacing:.08em;">EXTREME RISK</span></div>
          <div style="display:flex;align-items:center;gap:6px;"><div style="width:10px;height:10px;background:#C45444;"></div><span style="font-size:9px;color:var(--dim);letter-spacing:.08em;">HIGH RISK</span></div>
          <div style="display:flex;align-items:center;gap:6px;"><div style="width:10px;height:10px;background:#D4874A;"></div><span style="font-size:9px;color:var(--dim);letter-spacing:.08em;">MEDIUM RISK</span></div>
          <div style="display:flex;align-items:center;gap:6px;"><div style="width:10px;height:10px;background:#2a6644;"></div><span style="font-size:9px;color:var(--dim);letter-spacing:.08em;">LOW RISK</span></div>
        </div>
      </div>
      <div style="position:relative;background:rgba(10,16,32,0.8);border:1px solid var(--border);overflow:hidden;">
        <svg id="regional-map" viewBox="0 0 900 560" style="width:100%;display:block;cursor:pointer;"></svg>
        <div id="rm-tooltip" style="display:none;position:absolute;background:rgba(15,23,41,0.97);border:1px solid rgba(212,175,55,.35);padding:12px 16px;pointer-events:none;min-width:200px;max-width:260px;z-index:20;box-shadow:0 8px 32px rgba(0,0,0,.6);">
          <div id="rm-tt-country" style="font-family:'Barlow Condensed',sans-serif;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:4px;"></div>
          <div id="rm-tt-tier" style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:6px;font-family:'Barlow Condensed',sans-serif;font-weight:700;"></div>
          <div id="rm-tt-note" style="font-size:11px;color:var(--muted);line-height:1.55;margin-bottom:6px;"></div>
          <div id="rm-tt-action" style="font-size:9px;color:rgba(212,175,55,.5);letter-spacing:.06em;font-style:italic;"></div>
        </div>
      </div>
      <div style="margin-top:14px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;">
        <span style="font-size:9px;color:var(--dim);padding:4px 0;margin-right:4px;font-family:'Barlow Condensed',sans-serif;letter-spacing:.1em;text-transform:uppercase;">SPEC Coverage:</span>
        <button onclick="showSpec('page-spec-djibouti')" style="background:rgba(212,175,55,.06);border:1px solid rgba(212,175,55,.2);color:var(--gold);padding:3px 12px;font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .2s;" onmouseover="this.style.background='rgba(212,175,55,.14)'" onmouseout="this.style.background='rgba(212,175,55,.06)'">Djibouti</button>
        <button onclick="showSpec('page-spec-somaliland')" style="background:rgba(212,175,55,.06);border:1px solid rgba(212,175,55,.2);color:var(--gold);padding:3px 12px;font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .2s;" onmouseover="this.style.background='rgba(212,175,55,.14)'" onmouseout="this.style.background='rgba(212,175,55,.06)'">Somaliland</button>
        <button onclick="showSpec('page-spec-ethiopia')" style="background:rgba(212,175,55,.06);border:1px solid rgba(212,175,55,.2);color:var(--gold);padding:3px 12px;font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .2s;" onmouseover="this.style.background='rgba(212,175,55,.14)'" onmouseout="this.style.background='rgba(212,175,55,.06)'">Ethiopia</button>
        <button onclick="showSpec('page-spec-kenya')" style="background:rgba(212,175,55,.06);border:1px solid rgba(212,175,55,.2);color:var(--gold);padding:3px 12px;font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .2s;" onmouseover="this.style.background='rgba(212,175,55,.14)'" onmouseout="this.style.background='rgba(212,175,55,.06)'">Kenya</button>
        <button onclick="showSpec('page-spec-oman')" style="background:rgba(212,175,55,.06);border:1px solid rgba(212,175,55,.2);color:var(--gold);padding:3px 12px;font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .2s;" onmouseover="this.style.background='rgba(212,175,55,.14)'" onmouseout="this.style.background='rgba(212,175,55,.06)'">Oman</button>
        <button onclick="showSpec('page-spec-yemen')" style="background:rgba(212,175,55,.06);border:1px solid rgba(212,175,55,.2);color:var(--gold);padding:3px 12px;font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .2s;" onmouseover="this.style.background='rgba(212,175,55,.14)'" onmouseout="this.style.background='rgba(212,175,55,.06)'">Yemen</button>
        <button onclick="showSpec('page-spec-socotra')" style="background:rgba(212,175,55,.06);border:1px solid rgba(212,175,55,.2);color:var(--gold);padding:3px 12px;font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .2s;" onmouseover="this.style.background='rgba(212,175,55,.14)'" onmouseout="this.style.background='rgba(212,175,55,.06)'">Socotra</button>
        <button onclick="showPage('dashb')" style="background:transparent;border:1px solid rgba(255,255,255,.1);color:var(--dim);padding:3px 12px;font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .2s;" onmouseover="this.style.borderColor='rgba(212,175,55,.2)';this.style.color='var(--muted)'" onmouseout="this.style.borderColor='rgba(255,255,255,.1)';this.style.color='var(--dim)'">Full Dashboard →</button>
      </div>
    </div>
  </div>

  <!-- ── LIVE INTELLIGENCE TICKER ── -->
  <div class="intel-ticker-wrap">
    <div class="intel-ticker-label">LIVE</div>
    <div class="intel-ticker-track">
      <div class="intel-ticker-inner" id="ticker-inner">
        <span class="it-item"><span class="it-cat conflict">Conflict Alert</span> Red Sea maritime incident reported near Bab-el-Mandeb</span>
        <span class="it-sep">◆</span>
        <span class="it-item"><span class="it-cat defense">Defense Spending</span> Saudi Arabia defense budget +4.1% — FY2026 allocation</span>
        <span class="it-sep">◆</span>
        <span class="it-item"><span class="it-cat assist">Security Assistance</span> Egypt FMF allocation updated — $1.3bn authorised</span>
        <span class="it-sep">◆</span>
        <span class="it-item"><span class="it-cat energy">Energy Infrastructure</span> LNG facility expansion approved in Qatar</span>
        <span class="it-sep">◆</span>
        <span class="it-item"><span class="it-cat policy">Technology Policy</span> AI regulation framework shift — UAE Digital Authority</span>
        <span class="it-sep">◆</span>
        <span class="it-item"><span class="it-cat conflict">Military Movement</span> Ethiopian armed forces repositioning in Tigray region</span>
        <span class="it-sep">◆</span>
        <span class="it-item"><span class="it-cat defense">Power Index</span> Iran SPI score revised following naval exercise data</span>
        <span class="it-sep">◆</span>
        <span class="it-item"><span class="it-cat assist">Maritime Alert</span> Houthi activity reported — southern Red Sea corridor</span>
        <span class="it-sep">◆</span>
        <span class="it-item"><span class="it-cat energy">Economic Signal</span> Sudan foreign reserve depletion — critical threshold reached</span>
        <span class="it-sep">◆</span>
        <span class="it-item"><span class="it-cat policy">Diplomatic</span> US-Saudi security framework review — quarterly briefing issued</span>
      </div>
    </div>
  </div>


  <!-- ── TRUST STRIP ── -->
  <div style="background:var(--ink3);border-top:1px solid var(--border);border-bottom:1px solid rgba(212,175,55,.12);padding:20px 64px;">
    <div style="max-width:1160px;margin:0 auto;">
      <div style="text-align:center;margin-bottom:16px;">
        <span style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--dim);">Designed for institutions operating in complex environments</span>
      </div>
      <div style="display:flex;justify-content:center;flex-wrap:wrap;gap:0;">
        <div style="padding:10px 24px;border-right:1px solid var(--border);text-align:center;min-width:140px;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--gold);margin-bottom:3px;">395K</div>
          <div style="font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);">Conflict Events</div>
          <div style="font-size:9px;color:rgba(255,255,255,.2);margin-top:1px;">UCDP + ACLED</div>
        </div>
        <div style="padding:10px 24px;border-right:1px solid var(--border);text-align:center;min-width:140px;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--gold);margin-bottom:3px;">57</div>
          <div style="font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);">Countries Scored</div>
          <div style="font-size:9px;color:rgba(255,255,255,.2);margin-top:1px;">SPI · MARS · ATLAS</div>
        </div>
        <div style="padding:10px 24px;border-right:1px solid var(--border);text-align:center;min-width:140px;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--gold);margin-bottom:3px;">29</div>
          <div style="font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);">Dossier Sections</div>
          <div style="font-size:9px;color:rgba(255,255,255,.2);margin-top:1px;">Per SPEC brief</div>
        </div>
        <div style="padding:10px 24px;border-right:1px solid var(--border);text-align:center;min-width:140px;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--gold);margin-bottom:3px;">8+</div>
          <div style="font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);">Primary Sources</div>
          <div style="font-size:9px;color:rgba(255,255,255,.2);margin-top:1px;">SIPRI · IMF · World Bank</div>
        </div>
        <div style="padding:10px 24px;text-align:center;min-width:140px;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--gold);margin-bottom:3px;">SAT</div>
          <div style="font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);">Analytic Method</div>
          <div style="font-size:9px;color:rgba(255,255,255,.2);margin-top:1px;">Sherman Kent doctrine</div>
        </div>
      </div>
      <div style="margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.04);display:flex;justify-content:center;flex-wrap:wrap;gap:8px 20px;">
        <span style="font-size:9px;color:var(--dim);">Built for</span>
        <span style="font-size:9px;padding:2px 9px;border:1px solid rgba(255,255,255,.07);color:var(--muted);">Immigration Law Firms</span>
        <span style="font-size:9px;padding:2px 9px;border:1px solid rgba(255,255,255,.07);color:var(--muted);">Development Organisations</span>
        <span style="font-size:9px;padding:2px 9px;border:1px solid rgba(255,255,255,.07);color:var(--muted);">Security Consultancies</span>
        <span style="font-size:9px;padding:2px 9px;border:1px solid rgba(255,255,255,.07);color:var(--muted);">Maritime Operators</span>
        <span style="font-size:9px;padding:2px 9px;border:1px solid rgba(255,255,255,.07);color:var(--muted);">USAID Implementing Partners</span>
        <span style="font-size:9px;padding:2px 9px;border:1px solid rgba(255,255,255,.07);color:var(--muted);">Private Equity &amp; DFIs</span>
        <span style="font-size:9px;padding:2px 9px;border:1px solid rgba(255,255,255,.07);color:var(--muted);">Think Tanks &amp; Research</span>
        <span style="font-size:9px;padding:2px 9px;border:1px solid rgba(255,255,255,.07);color:var(--muted);">Diplomatic Missions</span>
      </div>
    </div>
  </div>

  <!-- ── WHAT REPUBLIQ DOES ── -->
  <div style="background:var(--ink2);padding:44px 64px 36px;border-bottom:1px solid var(--border);">
    <div style="max-width:900px;margin:0 auto;text-align:center;">
      <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;">What RepubliQ Global Does</div>
      <p style="font-size:15px;font-weight:300;color:var(--muted);line-height:1.8;margin-bottom:24px;">RepubliQ Global produces analyst-led intelligence for organisations operating in East Africa, the Horn, and the Red Sea corridor. The analysis is produced by a practitioner with Rendon Group intelligence experience, SLPA research credentials, and four regional languages — not a platform aggregating public data.</p>
      <div style="display:flex;justify-content:center;flex-wrap:wrap;gap:10px 24px;">
        <span style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);">Political Risk</span>
        <span style="color:rgba(212,175,55,.3);">·</span>
        <span style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);">Conflict Monitoring</span>
        <span style="color:rgba(212,175,55,.3);">·</span>
        <span style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);">Economic Intelligence</span>
        <span style="color:rgba(212,175,55,.3);">·</span>
        <span style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);">Maritime Security</span>
        <span style="color:rgba(212,175,55,.3);">·</span>
        <span style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);">Regional Power Dynamics</span>
      </div>
    </div>
  </div>

  <!-- ── REGIONAL FOCUS ── -->
  <div style="background:var(--ink2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:32px 64px;">
    <div style="max-width:1160px;margin:0 auto;">
      <div style="text-align:center;margin-bottom:20px;">
        <span style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);">Regional Coverage</span>
      </div>
      <div style="display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--border);">
        <div style="background:var(--ink3);padding:18px 20px;text-align:center;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:16px;font-weight:600;color:var(--gold);margin-bottom:4px;">Horn of Africa</div>
          <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);">Ethiopia · Somalia · Djibouti<br>Somaliland · Eritrea</div>
        </div>
        <div style="background:var(--ink3);padding:18px 20px;text-align:center;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:16px;font-weight:600;color:var(--gold);margin-bottom:4px;">East Africa</div>
          <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);">Kenya · Tanzania · Uganda<br>Sudan · South Sudan</div>
        </div>
        <div style="background:var(--ink3);padding:18px 20px;text-align:center;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:16px;font-weight:600;color:var(--gold);margin-bottom:4px;">Red Sea Basin</div>
          <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);">Bab-el-Mandeb · Suez<br>Yemen · Socotra</div>
        </div>
        <div style="background:var(--ink3);padding:18px 20px;text-align:center;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:16px;font-weight:600;color:var(--gold);margin-bottom:4px;">Gulf Region</div>
          <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);">Saudi Arabia · UAE · Qatar<br>Kuwait · Oman · Iraq</div>
        </div>
        <div style="background:var(--ink3);padding:18px 20px;text-align:center;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:16px;font-weight:600;color:var(--gold);margin-bottom:4px;">MENA</div>
          <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);">Egypt · Libya · Jordan<br>Lebanon · Morocco · Algeria</div>
        </div>
      </div>
    </div>
  </div>

  <!-- ── CORE PRODUCTS ── -->
  <div class="products">
    <div class="section-tag">Intelligence Products</div>
    <div class="section-title">Five Core Products. One Decision Platform.</div>
    <p class="prod-subtitle">RepubliQ Global is a geopolitical intelligence platform — not a collection of reports. Each product integrates structured data, proprietary scoring models, and continuous monitoring into decision-grade outputs.</p>
    <div class="prod-grid">
      <div class="prod-card" style="background:var(--ink3);border:1px solid rgba(212,175,55,.1);">
        <div class="prod-code">SPEC Intelligence Dossiers</div>
        <div class="prod-name">Country Intelligence Dossiers</div>
        <div class="prod-desc">Decision-grade country assessments covering political risk, elite power structure, conflict intelligence, economic analysis, scenario modelling, and early warning indicators. 29 structured sections. Built for senior decision-makers — not general audiences.</div>
        <div class="prod-link" onclick="showPage('spec')">Download Free Djibouti Brief →</div>
      </div>
      <div class="prod-card" style="background:var(--ink3);border:1px solid rgba(212,175,55,.1);">
        <div class="prod-code">Strategic Power Index</div>
        <div class="prod-name">Strategic Power Index</div>
        <div class="prod-desc">11-pillar composite power scoring across 57 countries. Natural resources, military capability, strategic geography, governance quality, financial power, and technology — combined into a single calibrated index with full methodology transparency.</div>
        <div class="prod-link" onclick="showPage('dashb')">View Dashboard →</div>
      </div>
      <div class="prod-card" style="background:var(--ink3);border:1px solid rgba(212,175,55,.1);">
        <div class="prod-code">MARS Military Monitor</div>
        <div class="prod-name">Military Power Monitor</div>
        <div class="prod-desc">Structured military capability rankings integrating defence spending, order of battle, force composition, US security assistance flows, arms transfers, and combat experience. 57 countries. SIPRI-calibrated annual refresh.</div>
        <div class="prod-link" onclick="showPage('military')">View MARS →</div>
      </div>
      <div class="prod-card" style="background:var(--ink3);border:1px solid rgba(212,175,55,.1);">
        <div class="prod-code">Conflict Intelligence — AMAL</div>
        <div class="prod-name">Conflict Intelligence</div>
        <div class="prod-desc">395,770 unified conflict events 1989–2026 (UCDP GED + ACLED). Country-level conflict scoring, fatality trend analysis, and hotspot identification. The most comprehensive unified conflict dataset available for MENA and East Africa.</div>
        <div class="prod-link" onclick="showPage('dashb')">View Dashboard →</div>
      </div>
      <div class="prod-card" style="background:var(--ink3);border:1px solid rgba(212,175,55,.1);">
        <div class="prod-code">Regional Monitoring &amp; Early Warning</div>
        <div class="prod-name">Regional Monitoring</div>
        <div class="prod-desc">Continuous monitoring of geopolitical developments, conflict signals, and strategic risk indicators. Integrates multilingual OSINT across Arabic, French, Swahili, Somali, and Amharic with structured early warning thresholds and subscriber alerts.</div>
        <div class="prod-link" onclick="window.open('https://calendly.com/republiqglobal/briefing','_blank')">Book a Briefing Call →</div>
      </div>
    </div>
  </div>

  <!-- ── DATA & METHODOLOGY ── -->
  <div style="background:var(--ink);padding:60px 64px;border-top:1px solid var(--border);">
    <div style="max-width:1160px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;">
      <div>
        <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;">Data Foundation &amp; Methodology</div>
        <h2 style="font-family:'Cormorant Garamond',serif;font-size:clamp(24px,2.8vw,38px);font-weight:300;color:var(--light);line-height:1.1;margin-bottom:16px;">Built on primary data and<br><em style="font-style:italic;color:var(--gold);">practitioner-grade analysis.</em></h2>
        <p style="font-size:14px;color:var(--muted);line-height:1.75;font-weight:300;margin-bottom:20px;">RepubliQ Global integrates open-source intelligence with structured analytic techniques adapted from government intelligence frameworks — applied by a practitioner with direct experience producing analysis for government clients. Analysis is reproducible, source-tagged, and built for decisions.</p>
        <button class="btn-secondary" onclick="showPage('methodology')" style="font-size:10px;">View Full Methodology →</button>
      </div>
      <div style="display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);">
        <div style="background:var(--ink3);padding:18px 20px;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;color:var(--gold);margin-bottom:4px;">395K</div>
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--light);margin-bottom:3px;">Conflict Events</div>
          <div style="font-size:9px;color:var(--dim);">UCDP GED + ACLED · 1989–2026</div>
        </div>
        <div style="background:var(--ink3);padding:18px 20px;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;color:var(--gold);margin-bottom:4px;">57</div>
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--light);margin-bottom:3px;">Countries Scored</div>
          <div style="font-size:9px;color:var(--dim);">SPI · MARS · ATLAS indices</div>
        </div>
        <div style="background:var(--ink3);padding:18px 20px;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;color:var(--gold);margin-bottom:4px;">8+</div>
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--light);margin-bottom:3px;">Primary Sources</div>
          <div style="font-size:9px;color:var(--dim);">ACLED · UCDP · World Bank · SIPRI<br>IMF · AidData · AfDB · Freedom House</div>
        </div>
        <div style="background:var(--ink3);padding:18px 20px;">
          <div style="font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;color:var(--gold);margin-bottom:4px;">SAT</div>
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--light);margin-bottom:3px;">Analytic Methods</div>
          <div style="font-size:9px;color:var(--dim);">Structured Analytic Techniques<br>Sherman Kent · UK DI doctrine</div>
        </div>
      </div>
    </div>
  </div>

  <!-- ── WHO THIS IS FOR ── -->
  <div style="background:var(--ink2);padding:56px 64px;border-top:1px solid var(--border);">
    <div style="max-width:1160px;margin:0 auto;">
      <div style="text-align:center;margin-bottom:40px;">
        <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:10px;">Who This Is For</div>
        <h2 style="font-family:'Cormorant Garamond',serif;font-size:clamp(24px,2.6vw,36px);font-weight:300;color:var(--light);">Different buyers. <em style="font-style:italic;color:var(--gold);">Same regional depth.</em></h2>
      </div>
      <div style="display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);">
        <div style="background:var(--ink2);padding:28px 28px 32px;">
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(212,175,55,.5);margin-bottom:12px;">For Legal Practitioners</div>
          <div style="font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:500;color:var(--light);margin-bottom:12px;">Immigration &amp;<br>Asylum Cases</div>
          <p style="font-size:12px;color:var(--muted);line-height:1.7;margin-bottom:16px;">Certified translation in Somali, Arabic, and French. Country conditions expert declarations for Horn of Africa asylum claims. Somaliland, Ethiopia, Eritrea, Djibouti, Somalia — sourced, structured, and legally defensible.</p>
          <div style="font-size:10px;color:var(--dim);margin-bottom:20px;display:flex;flex-direction:column;gap:5px;"><span>◆ Certified document translation</span><span>◆ Country conditions declarations</span><span>◆ Immigration court interpretation</span><span>◆ Expert witness testimony</span></div>
          <button onclick="showPage('contact')" style="background:transparent;border:1px solid rgba(212,175,55,.3);color:var(--gold);padding:8px 16px;font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:all .2s;" onmouseover="this.style.background='rgba(212,175,55,.08)'" onmouseout="this.style.background='transparent'">Enquire About Language Services →</button>
        </div>
        <div style="background:var(--ink);padding:28px 28px 32px;">
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(212,175,55,.5);margin-bottom:12px;">For Operators &amp; Programmes</div>
          <div style="font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:500;color:var(--light);margin-bottom:12px;">Development &amp;<br>Security Sector</div>
          <p style="font-size:12px;color:var(--muted);line-height:1.7;margin-bottom:16px;">Decision-grade country intelligence for USAID implementing partners, NGOs, security consultancies, and organisations deploying people and programmes into the Horn of Africa and Red Sea corridor.</p>
          <div style="font-size:10px;color:var(--dim);margin-bottom:20px;display:flex;flex-direction:column;gap:5px;"><span>◆ SPEC country intelligence dossiers</span><span>◆ Pre-deployment regional briefings</span><span>◆ Conflict and displacement monitoring</span><span>◆ Early warning indicator alerts</span></div>
          <button onclick="showPage('spec')" style="background:transparent;border:1px solid rgba(212,175,55,.3);color:var(--gold);padding:8px 16px;font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:all .2s;" onmouseover="this.style.background='rgba(212,175,55,.08)'" onmouseout="this.style.background='transparent'">Download Free Country Brief →</button>
        </div>
        <div style="background:var(--ink2);padding:28px 28px 32px;">
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(212,175,55,.5);margin-bottom:12px;">For Investors &amp; Maritime</div>
          <div style="font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:500;color:var(--light);margin-bottom:12px;">Risk Intelligence &amp;<br>Advisory</div>
          <p style="font-size:12px;color:var(--muted);line-height:1.7;margin-bottom:16px;">Structured political risk and economic intelligence for private equity, development finance, and maritime operators with East Africa or Red Sea exposure. Analyst-grade, not aggregated opinion.</p>
          <div style="font-size:10px;color:var(--dim);margin-bottom:20px;display:flex;flex-direction:column;gap:5px;"><span>◆ Political risk assessments</span><span>◆ Red Sea corridor monitoring</span><span>◆ Economic stability scoring (ATLAS)</span><span>◆ Retained analyst advisory</span></div>
          <button onclick="window.open('https://calendly.com/republiqglobal/briefing','_blank')" style="background:transparent;border:1px solid rgba(212,175,55,.3);color:var(--gold);padding:8px 16px;font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:all .2s;" onmouseover="this.style.background='rgba(212,175,55,.08)'" onmouseout="this.style.background='transparent'">Book an Intelligence Briefing →</button>
        </div>
      </div>
    </div>
  </div>


  <!-- ── SAMPLE INTELLIGENCE OUTPUT ── -->
  <div class="sample-intel-wrap">
    <div class="sample-intel-eyebrow">Sample Intelligence Output</div>
    <div class="sample-intel-layout">
      <div class="sample-intel-left">
        <div class="sample-intel-badge">SPEC COUNTRY DOSSIER</div>
        <div class="sample-intel-title">Djibouti Country Intelligence Dossier 2026</div>
        <div class="sample-intel-meta">Published March 2026 · RepubliQ Global Intelligence · Horn of Africa Bundle</div>
        <div class="sample-intel-desc">A 29-section decision-grade country intelligence dossier covering Djibouti's political structure, elite power networks, ATLAS risk score (63.5 Medium Risk), conflict intelligence (UCDP + ACLED), strategic infrastructure, patron competition dynamics, and 24-month scenario analysis. Same format as the paid product — available free.</div>
        <div class="sample-intel-features">
          <div class="sif-item"><span class="sif-dot"></span>RepubliQ Finding — patron competition, not Guelleh's health, is the succession risk</div>
          <div class="sif-item"><span class="sif-dot"></span>ATLAS Risk Score 63.5 — full methodology, worked example, peer comparison</div>
          <div class="sif-item"><span class="sif-dot"></span>Elite Power Structure — RPP inner circle, five foreign patron mapping</div>
          <div class="sif-item"><span class="sif-dot"></span>24-month scenario analysis — three pathways with probability weights</div>
        </div>
        <button class="btn-primary" style="margin-top:28px" onclick="showPage('spec')">Download Free Djibouti Brief →</button>
      </div>
      <div class="sample-intel-right">
        <div class="sample-intel-preview">
          <div class="sip-header">
            <div class="sip-header-tag">CLASSIFICATION: COMMERCIAL SENSITIVE</div>
            <div class="sip-header-date">March 2026</div>
          </div>
          <div class="sip-title">Iran–Israel Escalation Risk</div>
          <div class="sip-sub">Strategic Assessment · RepubliQ Global</div>
          <div class="sip-divider"></div>
          <div class="sip-section">
            <div class="sip-section-label">Executive Summary</div>
            <div class="sip-section-text">Escalation probability remains elevated at 62% over the 90-day assessment window. Direct conventional exchange remains the least likely outcome. Proxy escalation through Iraqi and Lebanese networks presents the highest near-term risk vector.</div>
          </div>
          <div class="sip-scenarios">
            <div class="sip-scenario">
              <div class="sip-scen-label">Containment</div>
              <div class="sip-scen-bar"><div class="sip-scen-fill" style="width:45%;background:var(--green)"></div></div>
              <div class="sip-scen-pct">45%</div>
            </div>
            <div class="sip-scenario">
              <div class="sip-scen-label">Limited Escalation</div>
              <div class="sip-scen-bar"><div class="sip-scen-fill" style="width:35%;background:var(--orange)"></div></div>
              <div class="sip-scen-pct">35%</div>
            </div>
            <div class="sip-scenario">
              <div class="sip-scen-label">Direct Exchange</div>
              <div class="sip-scen-bar"><div class="sip-scen-fill" style="width:20%;background:var(--red)"></div></div>
              <div class="sip-scen-pct">20%</div>
            </div>
          </div>
          <div class="sip-blur-overlay"></div>
        </div>
      </div>
    </div>
  </div>


  <!-- ══════════════ SPEC LEAD MAGNET ══════════════ -->
  <section style="padding:80px 64px;background:linear-gradient(180deg,rgba(212,175,55,.05) 0%,transparent 100%);border-top:1px solid var(--border);position:relative;overflow:hidden;">
    <div style="position:absolute;inset:0;background-image:linear-gradient(rgba(212,175,55,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(212,175,55,.02) 1px,transparent 1px);background-size:60px 60px;pointer-events:none;"></div>
    <div style="max-width:1160px;margin:0 auto;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;">

      <!-- Left -->
      <div>
        <div style="display:inline-flex;align-items:center;gap:10px;margin-bottom:20px;">
          <div style="width:24px;height:1px;background:var(--gold);"></div>
          <span style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);">Free Intelligence Brief</span>
        </div>
        <h2 style="font-family:'Cormorant Garamond',serif;font-size:clamp(32px,3.6vw,50px);font-weight:300;line-height:1.1;color:var(--light);margin-bottom:16px;">
          Download the Djibouti<br><em style="font-style:italic;color:var(--gold);">SPEC Dossier.</em><br>Complimentary.
        </h2>
        <p style="font-size:14px;color:var(--muted);line-height:1.75;max-width:420px;margin-bottom:24px;font-weight:300;">A 29-section Country Intelligence Dossier. ATLAS risk scoring, 395,000 conflict events, elite power structure, and 24-month scenario analysis. Same depth as the paid product.</p>
        <ul style="list-style:none;display:flex;flex-direction:column;gap:8px;margin-bottom:28px;">
          <li style="display:flex;align-items:flex-start;gap:9px;font-size:12px;color:var(--text);"><span style="color:var(--gold);font-size:10px;margin-top:1px;flex-shrink:0;">✓</span>ATLAS score 63.5 — full methodology and peer comparison</li>
          <li style="display:flex;align-items:flex-start;gap:9px;font-size:12px;color:var(--text);"><span style="color:var(--gold);font-size:10px;margin-top:1px;flex-shrink:0;">✓</span>395,000 conflict events — UCDP + ACLED unified 1989–2026</li>
          <li style="display:flex;align-items:flex-start;gap:9px;font-size:12px;color:var(--text);"><span style="color:var(--gold);font-size:10px;margin-top:1px;flex-shrink:0;">✓</span>Patron network and succession scenario mapping</li>
          <li style="display:flex;align-items:flex-start;gap:9px;font-size:12px;color:var(--text);"><span style="color:var(--gold);font-size:10px;margin-top:1px;flex-shrink:0;">✓</span>Decision implications — investors, operators, policy and defense</li>
        </ul>
        <form name="homepage-spec-lead" method="POST" data-netlify="true" netlify-honeypot="bot-field" id="lm-form" onsubmit="handleLMSubmit(event)">
          <input type="hidden" name="form-name" value="homepage-spec-lead">
          <p style="display:none;"><label>Skip: <input name="bot-field"></label></p>
          <div style="display:flex;max-width:420px;">
            <input type="email" name="email" id="lm-email" required placeholder="your@organisation.com"
              style="flex:1;background:rgba(5,10,16,.9);border:1px solid rgba(255,255,255,.08);border-right:none;padding:10px 14px;font-size:13px;font-family:'Barlow',sans-serif;color:var(--light);outline:none;transition:border-color .2s;"
              onfocus="this.style.borderColor='var(--gold)'" onblur="this.style.borderColor='rgba(255,255,255,.08)'">
            <button type="submit" id="lm-btn"
              style="background:var(--gold);color:#000;font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:10px 18px;border:none;cursor:pointer;white-space:nowrap;transition:background .2s;"
              onmouseover="this.style.background='var(--sand)'" onmouseout="this.style.background='var(--gold)'">
              Get Free Brief ↓
            </button>
          </div>
          <p id="lm-note" style="font-size:10px;color:var(--dim);margin-top:6px;">Enter work email. PDF opens instantly. No spam. Unsubscribe any time.</p>
        </form>
      </div>

      <!-- Right: SPEC card -->
      <div style="position:relative;">
        <div style="position:absolute;inset:-20px;background:radial-gradient(ellipse at center,rgba(212,175,55,.07) 0%,transparent 70%);pointer-events:none;"></div>
        <div onclick="showPage('spec')" style="cursor:pointer;background:var(--ink2);border:1px solid rgba(212,175,55,.28);overflow:hidden;box-shadow:0 28px 56px rgba(0,0,0,.5);position:relative;transition:transform .3s,box-shadow .3s;"
          onmouseover="this.style.transform='translateY(-4px)';this.style.boxShadow='0 40px 72px rgba(0,0,0,.55)'"
          onmouseout="this.style.transform='translateY(0)';this.style.boxShadow='0 28px 56px rgba(0,0,0,.5)'">
          <div style="background:#0F1729;border-bottom:3px solid var(--gold);padding:12px 18px;display:flex;align-items:center;justify-content:space-between;">
            <span style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);">SPEC Country Dossier</span>
            <span style="background:var(--gold);color:#000;font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:2px 7px;">EXECUTIVE SAMPLE</span>
          </div>
          <div style="padding:20px;">
            <div style="font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:500;color:var(--light);">Djibouti</div>
            <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-bottom:14px;">Horn of Africa · March 2026</div>
            <div style="background:rgba(212,175,55,.05);border:1px solid rgba(212,175,55,.18);padding:12px 14px;margin-bottom:10px;">
              <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(212,175,55,.6);margin-bottom:5px;">ATLAS RISK SCORE</div>
              <div style="display:flex;align-items:baseline;gap:8px;margin-bottom:6px;">
                <span style="font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:600;color:var(--gold);line-height:1;">63.5</span>
                <span style="font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#f0a500;">MEDIUM RISK</span>
              </div>
              <div style="height:2px;background:rgba(255,255,255,.06);overflow:hidden;"><div style="height:100%;width:63.5%;background:linear-gradient(90deg,var(--gold),var(--sand));"></div></div>
              <div style="font-size:9px;color:var(--dim);margin-top:5px;">Kenya 61.1 · Somalia 58.2 · Ethiopia 49.4</div>
            </div>
            <div style="border-left:2px solid var(--gold);background:rgba(212,175,55,.06);padding:10px 12px;margin-bottom:10px;">
              <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:4px;">REPUBLIQ FINDING</div>
              <div style="font-size:11px;color:var(--text);line-height:1.5;">Patron competition — not Guelleh's health — is the primary succession risk. China, UAE, US, and France each hold structural leverage.</div>
            </div>
            <div style="opacity:.16;display:flex;flex-direction:column;gap:4px;margin-bottom:12px;">
              <div style="height:6px;background:rgba(255,255,255,.3);border-radius:1px;"></div>
              <div style="height:6px;width:76%;background:rgba(255,255,255,.3);border-radius:1px;"></div>
              <div style="height:6px;width:54%;background:rgba(255,255,255,.3);border-radius:1px;"></div>
            </div>
            <div style="width:100%;background:var(--gold);color:#000;font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:10px;text-align:center;">
              View Full Brief & Download ↓
            </div>
          </div>
        </div>
      </div>

    </div>
  </section>

  <footer class="main-footer" style="flex-direction:column;gap:12px;padding:24px 64px;">
    <div style="display:flex;align-items:center;justify-content:space-between;width:100%;flex-wrap:wrap;gap:12px;">
      <div class="footer-copy">© 2026 RepubliQ Global LLC · Co-founder, <a href="https://myslpa.org" target="_blank" style="color:rgba(212,175,55,.4);text-decoration:none;">SLPA</a> · All rights reserved.</div>
      <div class="footer-links">
        <a href="#" onclick="showPage('methodology');return false;">Methodology</a>
        <a href="#" onclick="showPage('contact');return false;">Contact</a>
        <a href="#" onclick="showPrivacyModal();return false;">Privacy</a>
        <a href="#" onclick="showTermsModal();return false;">Terms</a>
        <a href="https://republiqglobal.com">republiqglobal.com</a>
        <a href="#" onclick="showAdminLogin();return false;" style="color:rgba(255,255,255,0.08);">·</a>
      </div>
    </div>
    <div style="font-size:9px;color:var(--dim);line-height:1.7;max-width:900px;border-top:1px solid rgba(255,255,255,.04);padding-top:10px;width:100%;">
      <strong style="color:rgba(255,255,255,.2);">Data Attribution:</strong>
      This platform integrates data from ACLED (<a href="https://acleddata.com" target="_blank" style="color:rgba(212,175,55,.4);">acleddata.com</a>) under research licence terms.
      Conflict event data © Armed Conflict Location &amp; Event Data Project (ACLED); <a href="https://acleddata.com/privacy/" target="_blank" style="color:rgba(212,175,55,.4);">ACLED Privacy Policy</a>.
      Additional sources: UCDP GED (Uppsala University), SIPRI, IISS Military Balance, IMF WEO, World Bank WDI, DSCA, BP Statistical Review.
      Intelligence assessments © 2026 RepubliQ Global. Structured analytic methodology adapted from Sherman Kent School / UK Defence Intelligence doctrine.
      Platform for institutional use. Not for redistribution without attribution.
    </div>
  </footer>
  <!-- Privacy / Terms Modals -->
  <div id="privacy-modal" style="display:none;position:fixed;inset:0;z-index:998;background:rgba(5,10,16,.95);backdrop-filter:blur(8px);align-items:center;justify-content:center;overflow-y:auto;padding:20px;">
    <div style="background:var(--ink2);border:1px solid var(--border);max-width:600px;width:100%;padding:32px;position:relative;">
      <button onclick="document.getElementById('privacy-modal').style.display='none'" style="position:absolute;top:16px;right:16px;background:none;border:none;color:var(--dim);font-size:18px;cursor:pointer;">×</button>
      <div style="font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:10px;">Privacy Policy</div>
      <div style="font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--light);margin-bottom:20px;">Data &amp; Privacy</div>
      <div style="font-size:12px;color:var(--muted);line-height:1.9;">
        <p><strong style="color:var(--text);">Data we collect:</strong> Email addresses submitted via gate forms and the lead magnet form. Organisation name (optional). Message content from the contact form.</p>
        <p><strong style="color:var(--text);">How we use it:</strong> To deliver requested intelligence materials. To send occasional RepubliQ Global intelligence updates if you opt in. We do not sell or share your data with third parties.</p>
        <p><strong style="color:var(--text);">Form processing:</strong> Forms are processed via Netlify Forms. Netlify's privacy policy applies to form submissions: <a href="https://netlify.com/privacy" target="_blank" style="color:var(--gold);">netlify.com/privacy</a></p>
        <p><strong style="color:var(--text);">Conflict data:</strong> This platform uses ACLED data under research licence. ACLED processes data in accordance with its own <a href="https://acleddata.com/privacy/" target="_blank" style="color:var(--gold);">privacy policy</a>.</p>
        <p><strong style="color:var(--text);">Your rights:</strong> To request deletion of your data, submit a request via our <a href="#" onclick="showPage('contact');return false;" style="color:var(--gold);">Contact page</a> with subject: DATA DELETE REQUEST.</p>
        <p style="color:var(--dim);font-size:10px;">Last updated: March 2026 · RepubliQ Global · republiqglobal.com</p>
      </div>
    </div>
  </div>
  <div id="terms-modal" style="display:none;position:fixed;inset:0;z-index:998;background:rgba(5,10,16,.95);backdrop-filter:blur(8px);align-items:center;justify-content:center;overflow-y:auto;padding:20px;">
    <div style="background:var(--ink2);border:1px solid var(--border);max-width:600px;width:100%;padding:32px;position:relative;">
      <button onclick="document.getElementById('terms-modal').style.display='none'" style="position:absolute;top:16px;right:16px;background:none;border:none;color:var(--dim);font-size:18px;cursor:pointer;">×</button>
      <div style="font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:10px;">Terms of Use</div>
      <div style="font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--light);margin-bottom:20px;">Terms &amp; Conditions</div>
      <div style="font-size:12px;color:var(--muted);line-height:1.9;">
        <p><strong style="color:var(--text);">Platform access:</strong> This platform provides intelligence for institutional decision-making. Free briefs are for individual use and redistribution with attribution.</p>
        <p><strong style="color:var(--text);">Data licensing:</strong> Conflict event data is sourced from ACLED and UCDP under their respective licence terms. Reproduction of underlying datasets requires direct licensing from those organisations.</p>
        <p><strong style="color:var(--text);">Intelligence assessments:</strong> All analytical outputs, scoring models, and scenario assessments are © 2026 RepubliQ Global. Commercial use requires a subscription agreement.</p>
        <p><strong style="color:var(--text);">Disclaimer:</strong> Intelligence assessments are probabilistic judgments, not guarantees. RepubliQ Global accepts no liability for decisions made based on platform outputs. Users are responsible for independent verification of critical decisions.</p>
        <p><strong style="color:var(--text);">Governing law:</strong> These terms are governed by the laws of the United States. Disputes shall be resolved by arbitration.</p>
        <p style="color:var(--dim);font-size:10px;">Last updated: March 2026 · RepubliQ Global · <a href="#" onclick="showPage('contact');return false;" style="color:var(--gold);">Contact Us</a></p>
      </div>
    </div>
  </div>
</div>


<!-- ══════════════ SERVICES PAGE ══════════════ -->
<!-- ══════════════ ABOUT PAGE ══════════════ -->
<div class="page-section" id="page-about">
  <div style="background:var(--ink2);border-bottom:1px solid var(--border);padding:12px 64px;">
    <button class="dash-back" onclick="showPage('main')">← Home</button>
  </div>

  <!-- ── ABOUT HERO ── -->
  <div style="background:var(--ink);padding:80px 64px 64px;border-bottom:1px solid var(--border);">
    <div style="max-width:1160px;margin:0 auto;">
      <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:16px;">About RepubliQ Global</div>
      <h1 style="font-family:'Cormorant Garamond',serif;font-size:clamp(32px,4vw,58px);font-weight:300;color:var(--light);line-height:1.05;margin-bottom:24px;">Practitioner intelligence.<br><em style="font-style:italic;color:var(--gold);">Not aggregated data.</em></h1>
      <p style="font-size:15px;color:var(--muted);line-height:1.8;font-weight:300;max-width:720px;">RepubliQ Global is a specialist intelligence and advisory firm focused on East Africa, the Horn of Africa, the Red Sea Basin, and MENA. It is led by a practitioner with direct government intelligence experience, institutional research credentials, and native fluency across four regional languages — supported by a network of specialist analysts and subject matter experts available across the region.</p>
    </div>
  </div>

  <!-- ── THE PRINCIPAL ── -->
  <div style="background:var(--ink2);padding:72px 64px;border-bottom:1px solid var(--border);">
    <div style="max-width:1160px;margin:0 auto;display:grid;grid-template-columns:260px 1fr;gap:72px;align-items:start;">
      <div>
        <div style="width:160px;height:160px;background:linear-gradient(135deg,rgba(212,175,55,.12),rgba(212,175,55,.03));border:1px solid rgba(212,175,55,.18);display:flex;align-items:center;justify-content:center;margin-bottom:24px;">
          <div style="text-align:center;">
            <div style="font-family:'Cormorant Garamond',serif;font-size:40px;font-weight:300;color:rgba(212,175,55,.4);line-height:1;">RG</div>
            <div style="font-family:'Barlow Condensed',sans-serif;font-size:7px;letter-spacing:.15em;color:rgba(212,175,55,.25);text-transform:uppercase;margin-top:4px;">Principal</div>
          </div>
        </div>
        <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:rgba(212,175,55,.5);margin-bottom:16px;">The Principal</div>
        <div style="display:flex;flex-direction:column;gap:10px;margin-bottom:24px;">
          <div style="font-size:11px;color:var(--muted);display:flex;align-items:flex-start;gap:8px;line-height:1.5;"><span style="color:var(--gold);font-size:8px;margin-top:3px;flex-shrink:0;">◆</span><span>Former Rendon Group Analyst &amp; Country Specialist</span></div>
          <div style="font-size:11px;color:var(--muted);display:flex;align-items:flex-start;gap:8px;line-height:1.5;"><span style="color:var(--gold);font-size:8px;margin-top:3px;flex-shrink:0;">◆</span><span>Co-Founder, SLPA — 501(c)(3) Somaliland Policy &amp; Research</span></div>
          <div style="font-size:11px;color:var(--muted);display:flex;align-items:flex-start;gap:8px;line-height:1.5;"><span style="color:var(--gold);font-size:8px;margin-top:3px;flex-shrink:0;">◆</span><span>Deloitte GPS Manager — Data, DevSecOps &amp; Programme Management</span></div>
          <div style="font-size:11px;color:var(--muted);display:flex;align-items:flex-start;gap:8px;line-height:1.5;"><span style="color:var(--gold);font-size:8px;margin-top:3px;flex-shrink:0;">◆</span><span>M.A. International Relations — American University, Washington D.C.</span></div>
          <div style="font-size:11px;color:var(--muted);display:flex;align-items:flex-start;gap:8px;line-height:1.5;"><span style="color:var(--gold);font-size:8px;margin-top:3px;flex-shrink:0;">◆</span><span>Active Security Clearance</span></div>
        </div>
        <div style="background:rgba(212,175,55,.05);border:1px solid rgba(212,175,55,.12);padding:14px 16px;margin-bottom:20px;">
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(212,175,55,.4);margin-bottom:10px;">Languages</div>
          <div style="display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px;">
            <span style="font-size:10px;background:rgba(212,175,55,.08);border:1px solid rgba(212,175,55,.2);color:var(--gold);padding:3px 10px;">Somali</span>
            <span style="font-size:10px;background:rgba(212,175,55,.08);border:1px solid rgba(212,175,55,.2);color:var(--gold);padding:3px 10px;">Arabic</span>
            <span style="font-size:10px;background:rgba(212,175,55,.08);border:1px solid rgba(212,175,55,.2);color:var(--gold);padding:3px 10px;">French</span>
            <span style="font-size:10px;background:rgba(212,175,55,.08);border:1px solid rgba(212,175,55,.2);color:var(--gold);padding:3px 10px;">English</span>
          </div>
          <div style="font-size:9px;color:var(--dim);">+ Amharic &amp; Afar comprehension</div>
        </div>
        <a href="https://myslpa.org" target="_blank" style="font-size:10px;color:rgba(212,175,55,.5);text-decoration:none;display:flex;align-items:center;gap:6px;transition:color .2s;" onmouseover="this.style.color='var(--gold)'" onmouseout="this.style.color='rgba(212,175,55,.5)'">
          <span>◆</span> myslpa.org — Somaliland Policy &amp; Research →
        </a>
      </div>

      <div>
        <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:16px;">Background</div>
        <h2 style="font-family:'Cormorant Garamond',serif;font-size:clamp(24px,2.6vw,38px);font-weight:300;color:var(--light);line-height:1.1;margin-bottom:20px;">Built by someone<br><em style="font-style:italic;color:var(--gold);">who has been in the room.</em></h2>
        <p style="font-size:14px;color:var(--muted);line-height:1.85;font-weight:300;margin-bottom:16px;">RepubliQ Global was built by a practitioner who has produced country-level intelligence for government clients at The Rendon Group, delivered enterprise technology programmes at institutional scale through Deloitte GPS, and co-founded SLPA — a 501(c)(3) nonprofit dedicated to Somaliland policy and research — at the moment Somaliland has become one of the most strategically significant territories in the Horn of Africa.</p>
        <p style="font-size:14px;color:var(--muted);line-height:1.85;font-weight:300;margin-bottom:28px;">That combination — operational intelligence experience, institutional research credibility, enterprise delivery capability, active clearance, and four regional languages — is what makes RepubliQ different from a data platform, a generalist advisory firm, or a translation service. It is the convergence of all four in one practitioner, supported by a network of regional specialists.</p>

        <div style="display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);margin-bottom:28px;">
          <div style="background:var(--ink);padding:20px 22px;">
            <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(212,175,55,.45);margin-bottom:8px;">Intelligence Experience</div>
            <div style="font-size:13px;color:var(--text);line-height:1.65;">Rendon Group country analyst — producing decision-grade intelligence for government clients in complex operational environments across the Horn of Africa and MENA.</div>
          </div>
          <div style="background:var(--ink);padding:20px 22px;">
            <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(212,175,55,.45);margin-bottom:8px;">Research Foundation</div>
            <div style="font-size:13px;color:var(--text);line-height:1.65;">Co-founder of SLPA — a 501(c)(3) nonprofit conducting primary research on Somaliland governance, policy, and international recognition. Institutional credibility commercial platforms cannot replicate.</div>
          </div>
          <div style="background:var(--ink);padding:20px 22px;">
            <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(212,175,55,.45);margin-bottom:8px;">Language Capability</div>
            <div style="font-size:13px;color:var(--text);line-height:1.65;">Native fluency in Somali, Arabic, French, and English — with Amharic and Afar comprehension. The rarest combination in the Horn of Africa intelligence market.</div>
          </div>
          <div style="background:var(--ink);padding:20px 22px;">
            <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(212,175,55,.45);margin-bottom:8px;">Enterprise Delivery</div>
            <div style="font-size:13px;color:var(--text);line-height:1.65;">Deloitte GPS Manager across data infrastructure, DevSecOps, automation, and programme management — knows exactly how institutional clients procure, evaluate, and use intelligence products.</div>
          </div>
        </div>

        <div style="display:flex;gap:12px;flex-wrap:wrap;">
          <button class="btn-primary" onclick="showPage('contact')">Discuss Your Requirements →</button>
          <button class="btn-secondary" onclick="showPage('spec')">Read the Analysis →</button>
          <a href="https://myslpa.org" target="_blank" style="display:inline-flex;align-items:center;padding:10px 20px;border:1px solid rgba(212,175,55,.2);color:rgba(212,175,55,.6);font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;transition:all .2s;" onmouseover="this.style.borderColor='rgba(212,175,55,.4)';this.style.color='var(--gold)'" onmouseout="this.style.borderColor='rgba(212,175,55,.2)';this.style.color='rgba(212,175,55,.6)'">SLPA Research →</a>
        </div>
      </div>
    </div>
  </div>

  <!-- ── EXPERT NETWORK ── -->
  <div style="background:var(--ink);padding:72px 64px;border-bottom:1px solid var(--border);">
    <div style="max-width:1160px;margin:0 auto;">
      <div style="display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start;">
        <div>
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;">Expert Network</div>
          <h2 style="font-family:'Cormorant Garamond',serif;font-size:clamp(24px,2.6vw,38px);font-weight:300;color:var(--light);line-height:1.1;margin-bottom:20px;">A team behind<br><em style="font-style:italic;color:var(--gold);">every engagement.</em></h2>
          <p style="font-size:14px;color:var(--muted);line-height:1.85;font-weight:300;margin-bottom:16px;">RepubliQ Global draws on a network of regional analysts, former government specialists, academic researchers, and subject matter experts with native language fluency across East Africa, the Horn of Africa, and MENA.</p>
          <p style="font-size:14px;color:var(--muted);line-height:1.85;font-weight:300;margin-bottom:28px;">This network includes PhD researchers from leading institutions, political scientists, conflict analysts, legal translation specialists, and practitioner-level experts in maritime security, development economics, and regional governance. They are available on-demand for specific engagements — ensuring every RepubliQ product is backed by the depth the region demands.</p>
          <button class="btn-primary" onclick="showPage('contact')">Discuss an Engagement →</button>
        </div>
        <div style="display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);">
          <div style="background:var(--ink2);padding:22px 24px;">
            <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(212,175,55,.45);margin-bottom:10px;">Horn of Africa</div>
            <div style="font-size:12px;color:var(--muted);line-height:1.7;">Somalia · Somaliland · Ethiopia · Eritrea · Djibouti · Kenya conflict analysts with native Somali, Amharic, and Afar fluency.</div>
          </div>
          <div style="background:var(--ink2);padding:22px 24px;">
            <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(212,175,55,.45);margin-bottom:10px;">MENA Specialists</div>
            <div style="font-size:12px;color:var(--muted);line-height:1.7;">Yemen · Gulf · Egypt · Jordan · Lebanon political economists and security analysts with native Arabic and French fluency.</div>
          </div>
          <div style="background:var(--ink2);padding:22px 24px;">
            <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(212,175,55,.45);margin-bottom:10px;">Maritime &amp; Trade</div>
            <div style="font-size:12px;color:var(--muted);line-height:1.7;">Red Sea corridor · Bab-el-Mandeb · Gulf of Aden maritime security and trade intelligence specialists.</div>
          </div>
          <div style="background:var(--ink2);padding:22px 24px;">
            <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(212,175,55,.45);margin-bottom:10px;">Legal &amp; Translation</div>
            <div style="font-size:12px;color:var(--muted);line-height:1.7;">Certified legal translation and interpretation in Somali, Arabic, French, and English for immigration, asylum, and international legal proceedings.</div>
          </div>
          <div style="background:var(--ink2);padding:22px 24px;">
            <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(212,175,55,.45);margin-bottom:10px;">Academic Research</div>
            <div style="font-size:12px;color:var(--muted);line-height:1.7;">PhD researchers from leading US and European institutions specialising in Horn of Africa governance, conflict, and political economy.</div>
          </div>
          <div style="background:var(--ink2);padding:22px 24px;">
            <div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(212,175,55,.45);margin-bottom:10px;">Development &amp; Humanitarian</div>
            <div style="font-size:12px;color:var(--muted);line-height:1.7;">Former USAID, UN, and INGO practitioners with field experience across East Africa and the Horn — providing ground-truth context unavailable from desk analysis.</div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- ── NETWORK STATS ── -->
  <div style="background:var(--ink2);padding:40px 64px;border-bottom:1px solid var(--border);">
    <div style="max-width:1160px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);">
      <div style="background:var(--ink2);padding:24px 28px;text-align:center;">
        <div style="font-family:'Cormorant Garamond',serif;font-size:40px;font-weight:300;color:var(--gold);margin-bottom:6px;">4</div>
        <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--light);margin-bottom:4px;">Regional Languages</div>
        <div style="font-size:10px;color:var(--dim);">Somali · Arabic · French · English</div>
      </div>
      <div style="background:var(--ink2);padding:24px 28px;text-align:center;">
        <div style="font-family:'Cormorant Garamond',serif;font-size:40px;font-weight:300;color:var(--gold);margin-bottom:6px;">20+</div>
        <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--light);margin-bottom:4px;">Countries Covered</div>
        <div style="font-size:10px;color:var(--dim);">East Africa · Horn · MENA</div>
      </div>
      <div style="background:var(--ink2);padding:24px 28px;text-align:center;">
        <div style="font-family:'Cormorant Garamond',serif;font-size:40px;font-weight:300;color:var(--gold);margin-bottom:6px;">6</div>
        <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--light);margin-bottom:4px;">Specialist Areas</div>
        <div style="font-size:10px;color:var(--dim);">Conflict · Maritime · Legal · Economic · Research · Development</div>
      </div>
      <div style="background:var(--ink2);padding:24px 28px;text-align:center;">
        <div style="font-family:'Cormorant Garamond',serif;font-size:40px;font-weight:300;color:var(--gold);margin-bottom:6px;">DC</div>
        <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--light);margin-bottom:4px;">Based</div>
        <div style="font-size:10px;color:var(--dim);">American University · Washington D.C.</div>
      </div>
    </div>
  </div>

  <!-- ── ABOUT CTA ── -->
  <div style="background:var(--ink);padding:56px 64px;">
    <div style="max-width:800px;margin:0 auto;text-align:center;">
      <h2 style="font-family:'Cormorant Garamond',serif;font-size:clamp(24px,2.6vw,38px);font-weight:300;color:var(--light);margin-bottom:16px;">Ready to work with the team?</h2>
      <p style="font-size:14px;color:var(--muted);line-height:1.75;margin-bottom:28px;">Whether you need a country intelligence brief, certified translation, a pre-deployment briefing, or a retained analyst relationship — RepubliQ Global has the regional depth and language capability to deliver it.</p>
      <div style="display:flex;gap:16px;justify-content:center;flex-wrap:wrap;">
        <button class="btn-primary" onclick="showPage('contact')" style="padding:14px 28px;">Start a Conversation →</button>
        <button class="btn-secondary" onclick="showPage('spec')" style="padding:14px 28px;">Read the Analysis →</button>
      </div>
    </div>
  </div>

</div><!-- /page-about -->

<div class="page-section" id="page-services">

<style>
.srv-hero{
  padding:72px 64px 56px;
  background:linear-gradient(135deg,rgba(212,175,55,.04) 0%,transparent 55%),
             radial-gradient(ellipse at 80% 0%,rgba(74,127,193,.04) 0%,transparent 50%),var(--ink);
  border-bottom:1px solid var(--border);
}
.srv-eyebrow{font-size:9px;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
.srv-h1{font-family:'Cormorant Garamond',serif;font-size:clamp(2.2rem,4vw,3.4rem);font-weight:300;color:var(--light);line-height:1.12;margin-bottom:16px}
.srv-lead{font-size:13px;color:var(--muted);line-height:1.85;max-width:580px;margin-bottom:36px}
.srv-hero-actions{display:flex;gap:12px;flex-wrap:wrap}

/* Tiers */
.srv-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border-top:1px solid var(--border)}
.srv-tier{background:var(--ink2);padding:36px 32px;border-top:3px solid transparent;transition:border-color .2s,background .2s;cursor:default}
.srv-tier:hover{background:var(--ink3)}
.srv-tier.featured{border-top-color:var(--gold);background:var(--ink3)}
.st-badge{font-size:8px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:14px;padding:3px 9px;display:inline-block}
.st-badge.analyst{color:#4CA882;border:1px solid rgba(76,168,130,.3)}
.st-badge.strategic{color:var(--gold);border:1px solid rgba(212,175,55,.35)}
.st-badge.enterprise{color:#4A7FC1;border:1px solid rgba(74,127,193,.3)}
.st-name{font-family:'Cormorant Garamond',serif;font-size:1.5rem;color:var(--light);margin-bottom:6px}
.st-price{font-size:13px;color:var(--muted);margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--border)}
.st-price strong{font-size:22px;color:var(--gold);font-family:'Cormorant Garamond',serif;font-weight:300}
.st-features{display:flex;flex-direction:column;gap:10px;margin-bottom:28px}
.st-feat{display:flex;gap:10px;font-size:11px;color:var(--muted);line-height:1.5}
.st-feat::before{content:'✓';color:var(--gold);flex-shrink:0;font-size:11px}
.st-feat.locked{color:var(--dim)}
.st-feat.locked::before{content:'○';color:var(--dim)}
.st-cta{width:100%;padding:10px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-family:'Barlow',sans-serif;cursor:pointer;transition:all .2s}
.st-cta.primary{background:var(--gold);color:#000;border:1px solid var(--gold)}
.st-cta.primary:hover{background:var(--sand)}
.st-cta.secondary{background:none;color:var(--gold);border:1px solid var(--gold)}
.st-cta.secondary:hover{background:rgba(212,175,55,.08)}

/* Products deep-dive */
.srv-products{padding:64px 64px}
.srv-prod-title{font-family:'Cormorant Garamond',serif;font-size:2rem;color:var(--light);margin-bottom:8px}
.srv-prod-sub{font-size:12px;color:var(--dim);margin-bottom:40px}
.srv-prod-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--border)}
.srv-prod-card{background:var(--ink2);padding:32px;transition:background .2s}
.srv-prod-card:hover{background:var(--ink3)}
.spc-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:16px}
.spc-code{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.spc-status{font-size:8px;letter-spacing:.1em;text-transform:uppercase;padding:2px 7px;border:1px solid}
.spc-status.live{color:#4CA882;border-color:rgba(76,168,130,.4)}
.spc-status.soon{color:var(--dim);border-color:var(--border)}
.spc-status.preview{color:#4A7FC1;border-color:rgba(74,127,193,.35)}
.spc-name{font-family:'Cormorant Garamond',serif;font-size:1.25rem;color:var(--light);margin-bottom:10px}
.spc-desc{font-size:11px;color:var(--muted);line-height:1.8;margin-bottom:20px}
.spc-specs{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}
.spc-spec-item{}
.spc-spec-k{font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:2px}
.spc-spec-v{font-size:11px;color:var(--text)}
.spc-link{margin-top:18px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);cursor:pointer;display:inline-block}
.spc-link:hover{color:var(--sand)}

/* Custom research */
.srv-custom{padding:0 64px 64px;display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--border);padding-top:64px}
.sc-left{padding-right:64px;border-right:1px solid var(--border)}
.sc-title{font-family:'Cormorant Garamond',serif;font-size:1.8rem;color:var(--light);margin-bottom:14px}
.sc-text{font-size:12px;color:var(--muted);line-height:1.9;margin-bottom:24px}
.sc-items{display:flex;flex-direction:column;gap:0}
.sc-item{padding:16px 0;border-bottom:1px solid var(--border);display:flex;gap:16px}
.sc-item-num{font-family:'Cormorant Garamond',serif;font-size:1.6rem;color:rgba(212,175,55,.25);flex-shrink:0;line-height:1}
.sc-item-body{}
.sc-item-title{font-size:12px;color:var(--text);margin-bottom:4px}
.sc-item-desc{font-size:11px;color:var(--dim);line-height:1.6}
.sc-right{padding-left:64px}
.sc-quote{
  border-left:2px solid var(--gold);padding:20px 24px;
  font-family:'Cormorant Garamond',serif;font-size:1.15rem;
  color:var(--muted);line-height:1.7;font-style:italic;margin-bottom:28px;
  background:rgba(212,175,55,.03);
}
.sc-clients{margin-bottom:28px}
.sc-clients-title{font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--dim);margin-bottom:14px}
.sc-client-tags{display:flex;flex-wrap:wrap;gap:8px}
.sc-tag{font-size:10px;padding:5px 12px;border:1px solid var(--border);color:var(--muted)}

@media(max-width:900px){
  .srv-tiers{grid-template-columns:1fr}
  .srv-products{padding:40px 24px}
  .srv-prod-grid{grid-template-columns:1fr}
  .srv-custom{padding:40px 24px;grid-template-columns:1fr}
  .sc-left{padding-right:0;border-right:none;border-bottom:1px solid var(--border);padding-bottom:40px;margin-bottom:40px}
  .sc-right{padding-left:0}
  .srv-hero{padding:48px 24px 40px}
}
</style>

<div style="padding:0">
  <!-- Hero -->
  <div class="srv-hero">
    <button class="dash-back" style="margin-bottom:20px" onclick="showPage('main')">← Home</button>
    <div class="srv-eyebrow">Services &amp; Intelligence Access</div>
    <div class="srv-h1">Intelligence, Translation<br>&amp; Advisory Services</div>
    <div class="srv-lead">RepubliQ Global provides analyst-led intelligence, certified language services, and regional advisory for legal practitioners, development organisations, security consultancies, and institutional investors. Led by a former Rendon Group analyst with four regional languages and institutional research credentials.</div>
    <div class="srv-hero-actions">
      <a href="https://calendly.com/republiqglobal/briefing" target="_blank" class="btn-primary" style="text-decoration:none;">Book a Briefing Call</a>
      <button class="btn-secondary" onclick="showPage('dashb')">Preview Dashboard Free</button>
    </div>
  </div>

  <!-- Pricing Tiers -->
  <div class="srv-tiers">
    <div class="srv-tier">
      <div class="st-badge analyst">Analyst</div>
      <div class="st-name">Analyst Plus</div>
      <div class="st-price"><strong style="font-size:22px;color:var(--gold);font-family:'Cormorant Garamond',serif;font-weight:300;">Pricing structured by scope &amp; tier</div>
      <div class="st-features">
        <div class="st-feat">State Power Index — full 57-country dataset</div>
        <div class="st-feat">MARS Military Monitor — full rankings &amp; charts</div>
        <div class="st-feat">CSV/JSON data exports</div>
        <div class="st-feat">Monthly SPEC briefing report</div>
        <div class="st-feat">API access — up to 5,000 calls/month</div>
        <div class="st-feat locked">Custom country deep-dives</div>
        <div class="st-feat locked">Dedicated analyst support</div>
        <div class="st-feat locked">Power BI / Tableau connectors</div>
      </div>
      <a href="https://calendly.com/republiqglobal/briefing" target="_blank" class="st-cta secondary" style="display:block;text-align:center;text-decoration:none;">Book a Briefing Call</a>
    </div>

    <div class="srv-tier featured">
      <div class="st-badge strategic">Strategic · Most Popular</div>
      <div class="st-name">Strategic</div>
      <div class="st-price"><strong style="font-size:22px;color:var(--gold);font-family:'Cormorant Garamond',serif;font-weight:300;">Pricing structured by scope &amp; tier</div>
      <div class="st-features">
        <div class="st-feat">Everything in Analyst Plus</div>
        <div class="st-feat">HERMES Maritime Intelligence</div>
        <div class="st-feat">ATLAS Economic Stability Index</div>
        <div class="st-feat">Quarterly SPEC country reports (up to 4)</div>
        <div class="st-feat">API access — up to 25,000 calls/month</div>
        <div class="st-feat">Custom country deep-dives (2/quarter)</div>
        <div class="st-feat">Power BI / Tableau connectors</div>
        <div class="st-feat locked">Dedicated analyst</div>
      </div>
      <a href="https://calendly.com/republiqglobal/briefing" target="_blank" class="st-cta primary" style="display:block;text-align:center;text-decoration:none;">Book a Briefing Call</a>
    </div>

    <div class="srv-tier">
      <div class="st-badge enterprise">Enterprise</div>
      <div class="st-name">Enterprise</div>
      <div class="st-price"><strong style="font-size:22px;color:var(--gold);font-family:'Cormorant Garamond',serif;font-weight:300;">Pricing structured by scope &amp; tier</div>
      <div class="st-features">
        <div class="st-feat">All modules — full platform access</div>
        <div class="st-feat">AYAAN Narrative Intelligence</div>
        <div class="st-feat">Unlimited SPEC country reports</div>
        <div class="st-feat">Unlimited API access</div>
        <div class="st-feat">Dedicated regional analyst</div>
        <div class="st-feat">Custom data feeds &amp; webhooks</div>
        <div class="st-feat">White-label options available</div>
        <div class="st-feat">SLA &amp; uptime guarantees</div>
      </div>
      <a href="https://calendly.com/republiqglobal/briefing" target="_blank" class="st-cta secondary" style="display:block;text-align:center;text-decoration:none;">Book a Briefing Call</a>
    </div>
  </div>

  <!-- Products deep-dive -->
  <div class="srv-products">
    <div class="srv-prod-title">Intelligence Products</div>
    <div class="srv-prod-sub">Six analytical modules. Each independently validated. All integrated into a single platform.</div>
    <div class="srv-prod-grid">

      <div class="srv-prod-card">
        <div class="spc-head">
          <div class="spc-code">Strategic Power Index</div>
          <span class="spc-status live">Live</span>
        </div>
        <div class="spc-name">State Power Index</div>
        <div class="spc-desc">Composite assessment of structural state capacity across 8 pillars: natural resources, governance, military, geography, economics, alliances, demographics, and technology. 57 countries across MENA, East Africa, South Asia.</div>
        <div class="spc-specs">
          <div class="spc-spec-item"><div class="spc-spec-k">Coverage</div><div class="spc-spec-v">57 Countries</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Update</div><div class="spc-spec-v">Annual + Quarterly</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Indicators</div><div class="spc-spec-v">40+ per country</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Output</div><div class="spc-spec-v">Score, Tier, Profile</div></div>
        </div>
        <span class="spc-link" onclick="showPage('dashb')">View live dashboard →</span>
      </div>

      <div class="srv-prod-card">
        <div class="spc-head">
          <div class="spc-code">Military Power Monitor</div>
          <span class="spc-status live">Live</span>
        </div>
        <div class="spc-name">Military Power Monitor</div>
        <div class="spc-desc">Real-time military capability rankings integrating defence spending, order of battle, nuclear posture, US security assistance (FMF/FMS), arms transfers, and combat experience across 57 countries.</div>
        <div class="spc-specs">
          <div class="spc-spec-item"><div class="spc-spec-k">Coverage</div><div class="spc-spec-v">57 Countries</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Update</div><div class="spc-spec-v">Monthly (FMF/FMS)</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Sources</div><div class="spc-spec-v">SIPRI, IISS, DSCA</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Output</div><div class="spc-spec-v">MPS, Class, Detail</div></div>
        </div>
        <span class="spc-link" onclick="showPage('military')">View MARS monitor →</span>
      </div>

      <div class="srv-prod-card">
        <div class="spc-head">
          <div class="spc-code">Technology Power Index</div>
          <span class="spc-status soon">Q2 2026</span>
        </div>
        <div class="spc-name">Trade &amp; Port Intelligence</div>
        <div class="spc-desc">Maritime chokepoint analysis, trade dependency scoring, and port vulnerability assessment for Bab-el-Mandeb, Strait of Hormuz, Suez Canal, and key regional ports. Integrates AIS vessel tracking data.</div>
        <div class="spc-specs">
          <div class="spc-spec-item"><div class="spc-spec-k">Coverage</div><div class="spc-spec-v">MENA + Horn</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Update</div><div class="spc-spec-v">Weekly</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Sources</div><div class="spc-spec-v">AIS, UN Comtrade</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Output</div><div class="spc-spec-v">TPI, Risk Alerts</div></div>
        </div>
        <span class="spc-link" onclick="showPage('contact')">Register interest →</span>
      </div>

      <div class="srv-prod-card">
        <div class="spc-head">
          <div class="spc-code">Economic Intelligence</div>
          <span class="spc-status soon">Q2 2026</span>
        </div>
        <div class="spc-name">Economic Stability Index</div>
        <div class="spc-desc">Sovereign debt risk, currency vulnerability, fiscal resilience and economic fragility assessments. Designed for institutional investors with direct exposure to emerging market sovereigns in our coverage universe.</div>
        <div class="spc-specs">
          <div class="spc-spec-item"><div class="spc-spec-k">Coverage</div><div class="spc-spec-v">47 Countries</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Update</div><div class="spc-spec-v">Quarterly</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Sources</div><div class="spc-spec-v">IMF, World Bank</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Output</div><div class="spc-spec-v">ESI, Risk Rating</div></div>
        </div>
        <span class="spc-link" onclick="showPage('contact')">Register interest →</span>
      </div>

      <div class="srv-prod-card">
        <div class="spc-head">
          <div class="spc-code">Multilingual OSINT</div>
          <span class="spc-status preview">Preview</span>
        </div>
        <div class="spc-name">Narrative Intelligence</div>
        <div class="spc-desc">Real-time tracking of state and non-state information operations, propaganda patterns, and influence campaigns across the Horn of Africa and Arabian Peninsula. AI-assisted media monitoring in Arabic and Amharic.</div>
        <div class="spc-specs">
          <div class="spc-spec-item"><div class="spc-spec-k">Coverage</div><div class="spc-spec-v">Horn + Gulf</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Update</div><div class="spc-spec-v">Daily</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Languages</div><div class="spc-spec-v">EN, AR, AM</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Output</div><div class="spc-spec-v">Actor, Narrative Map</div></div>
        </div>
        <span class="spc-link" onclick="showPage('contact')">Request preview →</span>
      </div>

      <div class="srv-prod-card">
        <div class="spc-head">
          <div class="spc-code">Country Intelligence Reports</div>
          <span class="spc-status live">On Demand</span>
        </div>
        <div class="spc-name">Country Intelligence Reports</div>
        <div class="spc-desc">AI-synthesised, analyst-reviewed country intelligence reports integrating all platform modules. Structured to NATO intelligence standards. Typical report: 25–40 pages covering political risk, military balance, economic stability, and scenario analysis.</div>
        <div class="spc-specs">
          <div class="spc-spec-item"><div class="spc-spec-k">Format</div><div class="spc-spec-v">PDF, Structured</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Turnaround</div><div class="spc-spec-v">48–72 hours</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Pages</div><div class="spc-spec-v">25–40</div></div>
          <div class="spc-spec-item"><div class="spc-spec-k">Coverage</div><div class="spc-spec-v">All 57 countries</div></div>
        </div>
        <span class="spc-link" onclick="showPage('contact')">Request sample report →</span>
      </div>

    </div>
  </div>

  <!-- Custom Research -->
  <!-- ── LANGUAGE SERVICES ── -->
  <div style="background:var(--ink2);border-top:1px solid var(--border);padding:56px 64px;">
    <div style="max-width:1160px;margin:0 auto;">
      <div style="display:grid;grid-template-columns:1fr 2fr;gap:64px;align-items:start;">
        <div>
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;">Language &amp; Translation Services</div>
          <h2 style="font-family:'Cormorant Garamond',serif;font-size:clamp(22px,2.2vw,32px);font-weight:300;color:var(--light);line-height:1.2;margin-bottom:16px;">Rare Language Capability<br><em style="font-style:italic;color:var(--gold);">for High-Stakes Contexts.</em></h2>
          <p style="font-size:13px;color:var(--muted);line-height:1.75;font-weight:300;margin-bottom:20px;">Certified translation and professional interpretation in Somali, Arabic, French, and English — with Amharic and Afar comprehension. The combination of Horn of Africa regional expertise and language capability is what makes this service different from a general translation agency.</p>
          <button class="btn-primary" onclick="showPage('contact')" style="font-size:10px;">Request Language Services →</button>
        </div>
        <div style="display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);">
          <div style="background:var(--ink);padding:24px 26px;"><div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(212,175,55,.5);margin-bottom:10px;">Certified Translation</div><p style="font-size:12px;color:var(--muted);line-height:1.7;margin-bottom:8px;">Certified document translation for legal, immigration, and official use — birth certificates, court records, identity documents, police records, country condition reports.</p><div style="font-size:10px;color:var(--dim);">Somali · Arabic · French · English</div></div>
          <div style="background:var(--ink);padding:24px 26px;"><div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(212,175,55,.5);margin-bottom:10px;">Immigration Court Interpretation</div><p style="font-size:12px;color:var(--muted);line-height:1.7;margin-bottom:8px;">Professional interpretation for USCIS interviews, immigration court hearings, asylum interviews, and attorney-client consultations. Telephonic and in-person.</p><div style="font-size:10px;color:var(--dim);">Somali · Arabic · French</div></div>
          <div style="background:var(--ink);padding:24px 26px;"><div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(212,175,55,.5);margin-bottom:10px;">Country Conditions Declarations</div><p style="font-size:12px;color:var(--muted);line-height:1.7;margin-bottom:8px;">Expert declarations on country conditions for asylum and withholding cases — Horn of Africa and MENA. Somaliland, Ethiopia, Eritrea, Djibouti, Somalia, Yemen. Sourced, structured, legally defensible.</p><div style="font-size:10px;color:var(--dim);">Expert witness preparation available</div></div>
          <div style="background:var(--ink);padding:24px 26px;"><div style="font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(212,175,55,.5);margin-bottom:10px;">Multilingual OSINT Monitoring</div><p style="font-size:12px;color:var(--muted);line-height:1.7;margin-bottom:8px;">Arabic, Somali, and French open-source intelligence monitoring for organisations that need Horn of Africa and MENA regional media coverage in English-accessible format.</p><div style="font-size:10px;color:var(--dim);">Daily or weekly digest formats</div></div>
        </div>
      </div>
    </div>
  </div>

  <div class="srv-custom">
    <div class="sc-left">
      <div class="sc-title">Custom Research &amp; Bespoke Analysis</div>
      <div class="sc-text">Beyond the platform, RepubliQ Global provides tailored analytical support for clients with specific intelligence requirements that fall outside our standard product suite.</div>
      <div class="sc-items">
        <div class="sc-item">
          <div class="sc-item-num">01</div>
          <div class="sc-item-body">
            <div class="sc-item-title">Strategic Scenario Analysis</div>
            <div class="sc-item-desc">Structured scenario modelling for specific geopolitical events — election outcomes, succession crises, escalation scenarios, or policy shifts.</div>
          </div>
        </div>
        <div class="sc-item">
          <div class="sc-item-num">02</div>
          <div class="sc-item-body">
            <div class="sc-item-title">Due Diligence &amp; Country Entry</div>
            <div class="sc-item-desc">Rapid-turn risk assessments for organisations considering market entry, investment, or operational expansion in our coverage universe.</div>
          </div>
        </div>
        <div class="sc-item">
          <div class="sc-item-num">03</div>
          <div class="sc-item-body">
            <div class="sc-item-title">Conflict Mapping &amp; Actor Analysis</div>
            <div class="sc-item-desc">Detailed mapping of armed group structures, territorial control, and strategic objectives for operational planning in complex environments.</div>
          </div>
        </div>
        <div class="sc-item">
          <div class="sc-item-num">04</div>
          <div class="sc-item-body">
            <div class="sc-item-title">Data Licensing &amp; API Integration</div>
            <div class="sc-item-desc">Direct data licensing for integration into proprietary platforms, dashboards, or risk models. Custom API endpoints and data schemas available.</div>
          </div>
        </div>
        <div class="sc-item">
          <div class="sc-item-num">05</div>
          <div class="sc-item-body">
            <div class="sc-item-title">Regional Intelligence &amp; Early Warning</div>
            <div class="sc-item-desc">Multilingual monitoring, narrative analysis, political network mapping, and early-warning briefings across East Africa, the Horn of Africa, and the Red Sea.</div>
            <div style="display:flex;flex-direction:column;gap:5px;margin-top:10px">
              <div style="display:flex;gap:8px;font-size:10px;color:var(--dim)"><span style="color:rgba(212,175,55,.5);flex-shrink:0">·</span>Local-language source monitoring</div>
              <div style="display:flex;gap:8px;font-size:10px;color:var(--dim)"><span style="color:rgba(212,175,55,.5);flex-shrink:0">·</span>Narrative and influence tracking</div>
              <div style="display:flex;gap:8px;font-size:10px;color:var(--dim)"><span style="color:rgba(212,175,55,.5);flex-shrink:0">·</span>Political network and actor mapping</div>
              <div style="display:flex;gap:8px;font-size:10px;color:var(--dim)"><span style="color:rgba(212,175,55,.5);flex-shrink:0">·</span>Recurring early-warning briefings</div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="sc-right">
      <div class="sc-quote">"Strategic intelligence is most valuable when it arrives before the crisis — not after."</div>
      <div class="sc-clients">
        <div class="sc-clients-title">Designed for</div>
        <div class="sc-client-tags">
          <span class="sc-tag">Defence Ministries</span>
          <span class="sc-tag">Foreign Affairs</span>
          <span class="sc-tag">AFRICOM / CENTCOM</span>
          <span class="sc-tag">Multilateral Orgs</span>
          <span class="sc-tag">USAID Missions</span>
          <span class="sc-tag">Sovereign Wealth Funds</span>
          <span class="sc-tag">Private Equity</span>
          <span class="sc-tag">Security Operators</span>
          <span class="sc-tag">Diplomatic Corps</span>
          <span class="sc-tag">Research Institutions</span>
        </div>
      </div>
      <button class="btn-primary" style="width:100%;padding:14px;margin-top:8px" onclick="showPage('contact')">Discuss Your Requirements</button>
    </div>
  </div>

  <!-- ── LANGUAGE SERVICES ── -->
  <div style="padding:64px;border-top:1px solid var(--border);background:var(--ink)">
    <div style="display:grid;grid-template-columns:1fr 1fr;gap:0">
      <div style="padding-right:64px;border-right:1px solid var(--border)">
        <div style="font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:12px">Language Services</div>
        <div style="font-family:'Cormorant Garamond',serif;font-size:1.8rem;font-weight:300;color:var(--light);margin-bottom:16px">Multilingual Intelligence<br>for Complex Environments</div>
        <p style="font-size:12px;color:var(--muted);line-height:1.9;margin-bottom:24px">RepubliQ Global provides translation, interpretation, and multilingual analytical services for clients operating across the Arabic-speaking world, East Africa, and the Sahel. Our regional language team supports both raw translation and culturally-contextualised geopolitical analysis.</p>
        <div style="display:flex;flex-direction:column;gap:0">
          <div style="padding:14px 0;border-bottom:1px solid var(--border);display:flex;gap:14px">
            <div style="font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:rgba(212,175,55,.22);flex-shrink:0;line-height:1">01</div>
            <div><div style="font-size:12px;color:var(--text);margin-bottom:3px">Document Translation</div><div style="font-size:11px;color:var(--dim);line-height:1.6">Verbatim and interpretive translation of intelligence reports, government communiqués, diplomatic correspondence, and open-source media. Certified translation available.</div></div>
          </div>
          <div style="padding:14px 0;border-bottom:1px solid var(--border);display:flex;gap:14px">
            <div style="font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:rgba(212,175,55,.22);flex-shrink:0;line-height:1">02</div>
            <div><div style="font-size:12px;color:var(--text);margin-bottom:3px">Interpretation Services</div><div style="font-size:11px;color:var(--dim);line-height:1.6">Simultaneous and consecutive interpretation for diplomatic engagements, security sector briefings, and multilateral meetings. Remote and in-person formats available.</div></div>
          </div>
          <div style="padding:14px 0;border-bottom:1px solid var(--border);display:flex;gap:14px">
            <div style="font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:rgba(212,175,55,.22);flex-shrink:0;line-height:1">03</div>
            <div><div style="font-size:12px;color:var(--text);margin-bottom:3px">Multilingual Analysis</div><div style="font-size:11px;color:var(--dim);line-height:1.6">AYAAN Narrative Intelligence monitors Arabic and Amharic sources. Analytical products delivered in English, French, or Arabic. Somali, Tigrinya, and Swahili source-reading available.</div></div>
          </div>
          <div style="padding:14px 0;display:flex;gap:14px">
            <div style="font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:rgba(212,175,55,.22);flex-shrink:0;line-height:1">04</div>
            <div><div style="font-size:12px;color:var(--text);margin-bottom:3px">Cultural &amp; Context Advisory</div><div style="font-size:11px;color:var(--dim);line-height:1.6">Regional analysts provide cultural context and sub-text interpretation for complex political communications — essential for accurate HUMINT assessment and diplomatic engagement.</div></div>
          </div>
        </div>
      </div>

      <div style="padding-left:64px">
        <div style="font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--dim);margin-bottom:18px">Supported Languages</div>
        <div style="display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);margin-bottom:28px">
          <div style="background:var(--ink2);padding:18px 16px">
            <div style="font-size:13px;color:var(--gold);font-family:'Cormorant Garamond',serif;margin-bottom:6px">Arabic · عربي</div>
            <div style="font-size:10px;color:var(--dim);line-height:1.7">MSA and regional dialects. Gulf, Levantine, Egyptian, Maghrebi. Full analytical capability including media monitoring.</div>
          </div>
          <div style="background:var(--ink2);padding:18px 16px">
            <div style="font-size:13px;color:var(--gold);font-family:'Cormorant Garamond',serif;margin-bottom:6px">French · Français</div>
            <div style="font-size:10px;color:var(--dim);line-height:1.7">Formal and diplomatic French. Sahel and Francophone Africa regional variant. Intelligence products available in French.</div>
          </div>
          <div style="background:var(--ink2);padding:18px 16px">
            <div style="font-size:13px;color:var(--gold);font-family:'Cormorant Garamond',serif;margin-bottom:6px">Swahili · Kiswahili</div>
            <div style="font-size:10px;color:var(--dim);line-height:1.7">Standard Swahili and coastal variants. East Africa open-source monitoring across Kenya, Tanzania, DRC, Great Lakes.</div>
          </div>
          <div style="background:var(--ink2);padding:18px 16px">
            <div style="font-size:13px;color:var(--gold);font-family:'Cormorant Garamond',serif;margin-bottom:6px">Regional Languages</div>
            <div style="font-size:10px;color:var(--dim);line-height:1.7">Amharic, Tigrinya, Somali, Oromo, Hausa, Tigre. Specialist source translation for Horn of Africa and Sahel coverage.</div>
          </div>
        </div>
        <div style="border:1px solid rgba(212,175,55,.15);padding:18px 20px;background:rgba(212,175,55,.02);margin-bottom:22px">
          <div style="font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-bottom:10px">Typical Use Cases</div>
          <div style="display:flex;flex-direction:column;gap:6px">
            <div style="font-size:11px;color:var(--muted);display:flex;gap:8px"><span style="color:rgba(212,175,55,.5);flex-shrink:0">·</span>Translation of foreign government defence white papers and budgets</div>
            <div style="font-size:11px;color:var(--muted);display:flex;gap:8px"><span style="color:rgba(212,175,55,.5);flex-shrink:0">·</span>Arabic-language state broadcaster media monitoring</div>
            <div style="font-size:11px;color:var(--muted);display:flex;gap:8px"><span style="color:rgba(212,175,55,.5);flex-shrink:0">·</span>Interpretation for diplomatic delegations in East Africa</div>
            <div style="font-size:11px;color:var(--muted);display:flex;gap:8px"><span style="color:rgba(212,175,55,.5);flex-shrink:0">·</span>Contextual analysis of propaganda and information operation narratives</div>
            <div style="font-size:11px;color:var(--muted);display:flex;gap:8px"><span style="color:rgba(212,175,55,.5);flex-shrink:0">·</span>HUMINT source material review and linguistic corroboration</div>
          </div>
        </div>
        <button class="btn-primary" style="width:100%;padding:13px" onclick="showPage('contact')">Enquire About Language Services</button>
      </div>
    </div>
  </div>

</div>

  <!-- ── PLATFORM CAPABILITIES & ROADMAP ── -->
  <div style="padding:64px;border-top:1px solid var(--border);background:var(--ink);">
    <div style="max-width:1160px;margin:0 auto;">
      <div style="display:inline-flex;align-items:center;gap:10px;margin-bottom:14px;">
        <div style="width:24px;height:1px;background:var(--gold);"></div>
        <span style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);">Platform Capabilities &amp; Roadmap</span>
      </div>
      <h2 style="font-family:'Cormorant Garamond',serif;font-size:clamp(24px,2.8vw,36px);font-weight:300;color:var(--light);margin-bottom:8px;">Additional capabilities<br><em style="font-style:italic;color:var(--gold);">available on request.</em></h2>
      <p style="font-size:13px;color:var(--muted);max-width:580px;line-height:1.75;margin-bottom:36px;">These analytical modules extend the core platform for specific use cases. Available to existing clients on request, or launching to general access in H2 2026.</p>
      <div style="display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);">
        <div style="background:var(--ink2);padding:28px;">
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;">Technology Power Index</div>
          <div style="font-family:'Cormorant Garamond',serif;font-size:16px;color:var(--light);margin-bottom:8px;">National Technology Capability</div>
          <div style="font-size:12px;color:var(--muted);line-height:1.65;margin-bottom:12px;">14-domain scoring across digital infrastructure, AI ecosystem, cybersecurity posture, and strategic technology alliances. 57 countries.</div>
          <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);padding:4px 8px;border:1px solid var(--border);display:inline-block;">Q3 2026</div>
        </div>
        <div style="background:var(--ink2);padding:28px;">
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;">ATLAS Economic Intelligence</div>
          <div style="font-family:'Cormorant Garamond',serif;font-size:16px;color:var(--light);margin-bottom:8px;">Sovereign Economic Risk</div>
          <div style="font-size:12px;color:var(--muted);line-height:1.65;margin-bottom:12px;">GDP risk, inflation exposure, debt distress, FDI climate and trade vulnerability across 47 countries. IMF + World Bank + AfDB integrated.</div>
          <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);padding:4px 8px;border:1px solid var(--border);display:inline-block;">Q3 2026</div>
        </div>
        <div style="background:var(--ink2);padding:28px;">
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;">Maritime Intelligence — SENTINEL</div>
          <div style="font-family:'Cormorant Garamond',serif;font-size:16px;color:var(--light);margin-bottom:8px;">Chokepoint &amp; Maritime Monitoring</div>
          <div style="font-size:12px;color:var(--muted);line-height:1.65;margin-bottom:12px;">Red Sea, Bab-el-Mandeb, Strait of Hormuz, and Gulf of Aden. Vessel incident tracking and maritime risk alerts.</div>
          <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);padding:4px 8px;border:1px solid var(--border);display:inline-block;">Q4 2026</div>
        </div>
        <div style="background:var(--ink2);padding:28px;">
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;">Political Risk Monitor</div>
          <div style="font-family:'Cormorant Garamond',serif;font-size:16px;color:var(--light);margin-bottom:8px;">Governance Fragility Scoring</div>
          <div style="font-size:12px;color:var(--muted);line-height:1.65;margin-bottom:12px;">Election risk, leadership transition tracking, civil unrest indicators and regime durability analysis across MENA and East Africa.</div>
          <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);padding:4px 8px;border:1px solid var(--border);display:inline-block;">Q4 2026</div>
        </div>
        <div style="background:var(--ink2);padding:28px;">
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;">Business Development Engine</div>
          <div style="font-family:'Cormorant Garamond',serif;font-size:16px;color:var(--light);margin-bottom:8px;">Opportunity Intelligence</div>
          <div style="font-size:12px;color:var(--muted);line-height:1.65;margin-bottom:12px;">Internal analytical tool for identifying and prioritising high-value engagement opportunities across MENA and East Africa. Available to RepubliQ clients and partners.</div>
          <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);padding:4px 8px;border:1px solid var(--border);display:inline-block;">By Request</div>
        </div>
        <div style="background:var(--ink2);padding:28px;">
          <div style="font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;">API &amp; Data Integration</div>
          <div style="font-family:'Cormorant Garamond',serif;font-size:16px;color:var(--light);margin-bottom:8px;">Platform Data Access</div>
          <div style="font-size:12px;color:var(--muted);line-height:1.65;margin-bottom:12px;">Direct API access to SPI, MARS, AMAL and ATLAS endpoints. JSON and CSV exports. Power BI and Tableau connectors. Enterprise tier.</div>
          <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);padding:4px 8px;border:1px solid var(--border);display:inline-block;">Enterprise Tier</div>
        </div>
      </div>
    </div>
  </div>

</div><!-- /page-services -->


<!-- ══════════════ DASHBOARD HUB ══════════════ -->
<div class="page-section" id="page-dashb">

<style>
/* Dashboard tab bar */
.db-tabbar{
  display:flex;align-items:center;padding:0 32px;
  border-bottom:1px solid var(--border);background:var(--ink2);
  position:sticky;top:56px;z-index:50;gap:0;
}
.db-tab{
  padding:14px 22px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--dim);cursor:pointer;border-bottom:2px solid transparent;
  margin-bottom:-1px;background:none;
  border-top:none;border-left:none;border-right:none;
  font-family:'Barlow',sans-serif;transition:all .2s;white-space:nowrap;
}
.db-tab:hover{color:var(--text)}
.db-tab.active{color:var(--gold);border-bottom-color:var(--gold)}
.db-tab-content{display:none}

/* Hub overview */
.hub-header{
  padding:48px 64px 36px;
  border-bottom:1px solid var(--border);
  background:radial-gradient(ellipse at 70% 0%,rgba(212,175,55,.03) 0%,transparent 60%);
}
.hub-eyebrow{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
.hub-title{font-family:'Cormorant Garamond',serif;font-size:clamp(1.8rem,3vw,2.8rem);font-weight:300;color:var(--light);margin-bottom:10px}
.hub-sub{font-size:12px;color:var(--muted);max-width:560px;line-height:1.7}

/* Preview cards grid */
.hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border)}
.hub-card{
  background:var(--ink2);padding:28px 28px 24px;
  display:flex;flex-direction:column;
  transition:background .2s;
}
.hub-card:hover{background:var(--ink3)}
.hc-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:14px}
.hc-code{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.hc-status{font-size:8px;letter-spacing:.1em;text-transform:uppercase;padding:2px 7px;border:1px solid}
.hc-status.live{color:#4CA882;border-color:rgba(76,168,130,.4)}
.hc-status.soon{color:var(--dim);border-color:var(--border)}
.hc-status.preview{color:#4A7FC1;border-color:rgba(74,127,193,.35)}
.hc-name{font-family:'Cormorant Garamond',serif;font-size:1.2rem;color:var(--light);margin-bottom:8px}
.hc-desc{font-size:11px;color:var(--muted);line-height:1.7;margin-bottom:16px;flex:1}
.hc-preview{border:1px solid var(--border);background:rgba(0,0,0,0.25);margin-bottom:16px;padding:12px 14px;min-height:80px}
.hc-chart-row{display:flex;align-items:center;gap:6px;margin-bottom:5px}
.hc-bar-label{font-size:9px;color:var(--muted);width:80px;flex-shrink:0;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hc-bar-track{flex:1;height:4px;background:rgba(255,255,255,0.05)}
.hc-bar-fill{height:4px;transition:width .7s ease}
.hc-bar-val{font-size:9px;color:var(--dim);width:28px;text-align:right}
.hc-mini-table{width:100%;border-collapse:collapse;font-size:10px}
.hc-mini-table th{font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);padding:3px 6px;text-align:left;border-bottom:1px solid var(--border)}
.hc-mini-table td{padding:4px 6px;color:var(--text);border-bottom:1px solid rgba(255,255,255,0.03)}
.hc-mini-table td:first-child{color:var(--muted)}
.hc-cta{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 14px;border:1px solid var(--border);
  font-size:9px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gold);cursor:pointer;background:none;font-family:'Barlow',sans-serif;
  transition:all .2s;
}
.hc-cta:hover{background:rgba(212,175,55,.08);border-color:var(--gold)}
.hc-cta.locked{color:var(--dim);cursor:default}
.hc-cta.locked:hover{background:none;border-color:var(--border)}


/* ── SEARCH BARS ── */
.dash-search-wrap{padding:8px 16px;border-bottom:1px solid var(--border);flex-shrink:0;background:rgba(0,0,0,.15);position:relative}
.dash-search-input{
  width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  color:var(--text);padding:7px 10px 7px 28px;font-size:11px;
  font-family:'Barlow',sans-serif;outline:none;transition:border-color .2s;
}
.dash-search-input:focus{border-color:rgba(212,175,55,.4)}
.dash-search-input::placeholder{color:var(--dim);font-size:10px}
.dash-search-icon{position:absolute;left:24px;top:50%;transform:translateY(-50%);font-size:10px;color:var(--dim);pointer-events:none}

/* ── DATA FRESHNESS LABELS ── */
.freshness-strip{
  display:flex;align-items:center;gap:16px;padding:6px 24px;
  background:rgba(0,0,0,.25);border-bottom:1px solid var(--border);
  font-size:9px;flex-shrink:0;flex-wrap:wrap;
}
.freshness-item{display:flex;align-items:center;gap:5px;color:var(--dim)}
.freshness-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0}
.freshness-dot.live{background:#4CA882;box-shadow:0 0 4px rgba(76,168,130,.6)}
.freshness-dot.recent{background:#D4AF37}
.freshness-dot.stale{background:#C45444}
.freshness-label{letter-spacing:.08em;text-transform:uppercase}
.freshness-val{color:var(--muted)}


@media(max-width:900px){
  .hub-grid{grid-template-columns:1fr 1fr}
  .hub-header{padding:36px 24px 28px}
}
@media(max-width:600px){
  .hub-grid{grid-template-columns:1fr}
  .db-tabbar{overflow-x:auto;padding:0 16px}
}
</style>

<!-- Tab bar -->
<div class="db-tabbar">
  <button class="db-tab active" id="db-tab-hub" onclick="switchDashTab('hub')">Intelligence Hub</button>
  <button class="db-tab" id="db-tab-spi" onclick="switchDashTab('spi')">SPI Rankings</button>
  <button class="db-tab" id="db-tab-hermes" onclick="switchDashTab('hermes')">AYAAN Feed</button>
  <button class="db-tab" id="db-tab-atlas" onclick="switchDashTab('atlas')">ATLAS Economic</button>
</div>

<!-- ── TAB: HUB OVERVIEW ── -->
<div class="db-tab-content" id="dbt-hub">
  <div class="hub-header">
    <button class="dash-back" style="margin-bottom:20px" onclick="showPage('main')">← Home</button>
    <div class="hub-eyebrow">Intelligence Platform · Dashboard Overview</div>
    <div class="hub-title">Six Analytical Modules.<br>One Integrated Platform.</div>
    <div class="hub-sub">Preview each intelligence module below. Live data from the AMAL API. Full institutional access available on subscription.</div>
  </div>

  <div class="freshness-strip">
  <div class="freshness-item"><div class="freshness-dot live"></div><span class="freshness-label">Conflict DB</span><span class="freshness-val">395,770 events · UCDP+ACLED · 1989–2026</span></div>
  <div class="freshness-item"><div class="freshness-dot live"></div><span class="freshness-label">SPI</span><span class="freshness-val">57 countries · 2026</span></div>
  <div class="freshness-item"><div class="freshness-dot live"></div><span class="freshness-label">MARS</span><span class="freshness-val">31 countries · SIPRI 2025</span></div>
  <div class="freshness-item"><div class="freshness-dot recent"></div><span class="freshness-label">ATLAS</span><span class="freshness-val">47 countries · IMF 2025</span></div>
</div><div style="display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);margin:0;border-bottom:1px solid var(--border);">
  <div style="background:var(--ink2);padding:14px 24px;text-align:center;">
    <div style="font-family:'Cormorant Garamond',serif;font-size:2rem;color:var(--gold)" id="hub-counter-total">—</div>
    <div style="font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:2px">Total Conflict Events</div>
    <div style="font-size:9px;color:rgba(255,255,255,.15);margin-top:1px">UCDP + ACLED · 1989–2026</div>
  </div>
  <div style="background:var(--ink2);padding:14px 24px;text-align:center;">
    <div style="font-family:'Cormorant Garamond',serif;font-size:2rem;color:#C45444" id="hub-counter-recent">—</div>
    <div style="font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:2px">Events Last 365 Days</div>
    <div style="font-size:9px;color:rgba(255,255,255,.15);margin-top:1px">ACLED · Live monitoring</div>
  </div>
  <div style="background:var(--ink2);padding:14px 24px;text-align:center;">
    <div style="font-family:'Cormorant Garamond',serif;font-size:2rem;color:var(--gold)" id="hub-counter-countries">—</div>
    <div style="font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:2px">Countries Affected</div>
    <div style="font-size:9px;color:rgba(255,255,255,.15);margin-top:1px">Active conflict zones</div>
  </div>
  <div style="background:var(--ink2);padding:14px 24px;text-align:center;">
    <div style="font-family:'Cormorant Garamond',serif;font-size:2rem;color:#D4874A" id="hub-counter-fatalities">—</div>
    <div style="font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:2px">Total Fatalities</div>
    <div style="font-size:9px;color:rgba(255,255,255,.15);margin-top:1px">Best estimate · UCDP</div>
  </div>
</div>
<div class="hub-grid">

    <!-- SPI preview -->
    <div class="hub-card">
      <div class="hc-head">
        <span class="hc-code">ARES · SPI</span>
        <span class="hc-status live">Live</span>
      </div>
      <div class="hc-name">State Power Index</div>
      <div class="hc-desc">Composite 8-pillar assessment of structural state capacity. Ranks 57 countries across MENA, East Africa, South Asia.</div>
      <div class="hc-preview" id="hub-spi-preview">
        <!-- populated by JS -->
        <div style="font-size:10px;color:var(--dim);text-align:center;padding:18px 0">Loading…</div>
      </div>
      <button class="hc-cta" onclick="switchDashTab('spi')">View Full Rankings →</button>
    </div>

    <!-- MARS preview -->
    <div class="hub-card">
      <div class="hc-head">
        <span class="hc-code">MARS · MPS</span>
        <span class="hc-status live">Live</span>
      </div>
      <div class="hc-name">Military Power Monitor</div>
      <div class="hc-desc">Military Power Score across defence spending, order of battle, nuclear posture, and US security assistance.</div>
      <div class="hc-preview" id="hub-mars-preview">
        <div style="font-size:10px;color:var(--dim);text-align:center;padding:18px 0">Loading…</div>
      </div>
      <button class="hc-cta" onclick="showPage('military')">View MARS Monitor →</button>
    </div>

    <!-- Natural Resources preview -->
    <div class="hub-card">
      <div class="hc-head">
        <span class="hc-code">ATLAS · NRI</span>
        <span class="hc-status soon">Q2 2026</span>
      </div>
      <div class="hc-name">Natural Resources Index</div>
      <div class="hc-desc">Hydrocarbon reserves, critical mineral endowment, water security, and resource-conflict correlation across the coverage universe.</div>
      <div class="hc-preview">
        <table class="hc-mini-table">
          <tr><th>Country</th><th>Oil Res.</th><th>Risk</th></tr>
          <tr><td>Saudi Arabia</td><td>266 Gbl</td><td style="color:#C45444">High</td></tr>
          <tr><td>Iran</td><td>208 Gbl</td><td style="color:#C45444">High</td></tr>
          <tr><td>UAE</td><td>98 Gbl</td><td style="color:#D4874A">Med</td></tr>
          <tr><td>Iraq</td><td>145 Gbl</td><td style="color:#C45444">High</td></tr>
          <tr><td>Ethiopia</td><td>—</td><td style="color:#4CA882">Low</td></tr>
        </table>
      </div>
      <button class="hc-cta locked" onclick="showPage('contact')">Register Interest →</button>
    </div>

    <!-- Conflict Monitor preview -->
    <div class="hub-card">
      <div class="hc-head">
        <span class="hc-code">NEXUS · CIM</span>
        <span class="hc-status soon">Q3 2026</span>
      </div>
      <div class="hc-name">Conflict Monitor</div>
      <div class="hc-desc">Real-time conflict event tracking using UCDP and ACLED data. Fatality mapping, actor identification, and escalation scoring.</div>
      <div class="hc-preview">
        <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-bottom:8px">Active Conflicts — Sample</div>
        <div id="hub-conflict-preview">
          <div class="hc-chart-row"><span class="hc-bar-label">Sudan</span><div class="hc-bar-track"><div class="hc-bar-fill" style="width:88%;background:#C45444"></div></div><span class="hc-bar-val">HIGH</span></div>
          <div class="hc-chart-row"><span class="hc-bar-label">Somalia</span><div class="hc-bar-track"><div class="hc-bar-fill" style="width:72%;background:#D4874A"></div></div><span class="hc-bar-val">MED</span></div>
          <div class="hc-chart-row"><span class="hc-bar-label">Ethiopia</span><div class="hc-bar-track"><div class="hc-bar-fill" style="width:65%;background:#D4874A"></div></div><span class="hc-bar-val">MED</span></div>
          <div class="hc-chart-row"><span class="hc-bar-label">Yemen</span><div class="hc-bar-track"><div class="hc-bar-fill" style="width:55%;background:#8B6914"></div></div><span class="hc-bar-val">MOD</span></div>
          <div class="hc-chart-row"><span class="hc-bar-label">Syria</span><div class="hc-bar-track"><div class="hc-bar-fill" style="width:44%;background:#8B6914"></div></div><span class="hc-bar-val">LOW</span></div>
        </div>
      </div>
      <button class="hc-cta locked" onclick="showPage('contact')">Register Interest →</button>
    </div>

    <!-- HERMES preview -->
    <div class="hub-card">
      <div class="hc-head">
        <span class="hc-code">HERMES · TPI</span>
        <span class="hc-status soon">Q2 2026</span>
      </div>
      <div class="hc-name">Trade &amp; Port Intelligence</div>
      <div class="hc-desc">Chokepoint risk scoring for Bab-el-Mandeb, Hormuz, and Suez Canal. Port vulnerability and trade dependency assessments.</div>
      <div class="hc-preview">
        <table class="hc-mini-table">
          <tr><th>Chokepoint</th><th>Traffic</th><th>Risk Score</th></tr>
          <tr><td>Bab-el-Mandeb</td><td>21k ships/yr</td><td style="color:#C45444">74</td></tr>
          <tr><td>Hormuz</td><td>18k ships/yr</td><td style="color:#C45444">81</td></tr>
          <tr><td>Suez Canal</td><td>19k ships/yr</td><td style="color:#D4874A">58</td></tr>
        </table>
      </div>
      <button class="hc-cta locked" onclick="showPage('contact')">Register Interest →</button>
    </div>

    <!-- SPEC preview -->
    <div class="hub-card">
      <div class="hc-head">
        <span class="hc-code">SPEC · CIR</span>
        <span class="hc-status live">On Demand</span>
      </div>
      <div class="hc-name">Country Intelligence Reports</div>
      <div class="hc-desc">AI-synthesised, analyst-reviewed country reports. 25–40 pages. NATO-structured. All 57 countries. 48–72 hour turnaround.</div>
      <div class="hc-preview">
        <div style="font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-bottom:10px">Report Contents</div>
        <div style="display:flex;flex-direction:column;gap:5px">
          <div style="font-size:10px;color:var(--muted);display:flex;gap:8px"><span style="color:rgba(212,175,55,.5)">01</span> Political Risk Assessment</div>
          <div style="font-size:10px;color:var(--muted);display:flex;gap:8px"><span style="color:rgba(212,175,55,.5)">02</span> Military Balance Analysis</div>
          <div style="font-size:10px;color:var(--muted);display:flex;gap:8px"><span style="color:rgba(212,175,55,.5)">03</span> Economic Stability (ATLAS)</div>
          <div style="font-size:10px;color:var(--muted);display:flex;gap:8px"><span style="color:rgba(212,175,55,.5)">04</span> 3 Scenario Projections</div>
          <div style="font-size:10px;color:var(--dim);display:flex;gap:8px;opacity:.5;filter:blur(1.5px)"><span>05</span> Intelligence Assessments</div>
        </div>
      </div>
      <button class="hc-cta" onclick="showPage('contact')">Request Sample Report →</button>
    </div>

  </div><!-- /hub-grid -->
</div><!-- /dbt-hub -->

<!-- ── TAB: SPI RANKINGS ── -->
<div class="db-tab-content" id="dbt-spi">
  <div class="dash-layout">
    <div class="dash-sidebar">
      <div class="spi-head">
        <span class="spi-head-title">Rankings</span>
        <span class="spi-count" id="spi-count">57 COUNTRIES</span> <button onclick="openCompare()" style="font-size:8px;padding:2px 8px;border:1px solid rgba(212,175,55,.3);color:var(--gold);background:none;cursor:pointer;font-family:'Barlow',sans-serif;letter-spacing:.08em;text-transform:uppercase;margin-left:4px">Compare ⇄</button>
      </div>
      <div class="freshness-strip" id="freshness-spi">
  <div class="freshness-item"><div class="freshness-dot live"></div><span class="freshness-label">SPI</span><span class="freshness-val" id="fresh-spi-date">Data year 2026</span></div>
  <div class="freshness-item"><div class="freshness-dot live"></div><span class="freshness-label">Countries</span><span class="freshness-val" id="fresh-spi-count">—</span></div>
  <div class="freshness-item"><div class="freshness-dot recent"></div><span class="freshness-label">Source</span><span class="freshness-val">SIPRI · World Bank · IISS · 2025</span></div>
</div><div class="dash-search-wrap"><span class="dash-search-icon">⌕</span><input class="dash-search-input" type="text" id="spi-search" placeholder="Search 57 countries…" oninput="filterSPIList(this.value)"></div><div id="spi-list"></div>
      <div class="spi-lock" id="spi-lock">
        <p>Full dataset of 57 countries requires institutional access</p>
        <button class="btn-unlock" onclick="showPage('contact')">Request Institutional Access</button>
      </div>
    </div>
    <div class="dash-main">
      <div class="dash-map-area">
        <svg id="spi-map"></svg>
        <div class="map-tip" id="spi-mtt"></div>
      </div>
      <div class="dash-detail" id="spi-detail">
        <div id="spi-det-name" class="det-name">Select a country</div>
        <div id="spi-det-grid" class="det-grid"></div>
      </div>
    </div>
  </div>
</div><!-- /dbt-spi -->

<!-- ── TAB: AYAAN FEED ── -->
<div class="db-tab-content" id="dbt-hermes">
<style>
/* ── HERMES / AYAAN FEED ──────────────────────────────────── */
.hermes-wrap{display:flex;height:calc(100vh - 108px);overflow:hidden;background:var(--ink)}
/* Sidebar */
.hermes-sidebar{
  width:280px;flex-shrink:0;border-right:1px solid var(--border);
  display:flex;flex-direction:column;overflow:hidden;background:var(--ink2);
}
.hermes-sidebar-head{
  padding:14px 18px;border-bottom:1px solid var(--border);flex-shrink:0;
  display:flex;align-items:center;justify-content:space-between;
  background:#0F1729;
}
.hermes-sidebar-title{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:600}
.hermes-total-badge{
  font-size:9px;padding:2px 8px;
  background:rgba(212,175,55,.12);border:1px solid rgba(212,175,55,.3);
  color:var(--gold);letter-spacing:.06em;font-family:'Barlow Condensed',sans-serif;
}
/* Filter section */
.hermes-filters{padding:14px 16px;border-bottom:1px solid var(--border);flex-shrink:0;display:flex;flex-direction:column;gap:10px}
.hermes-filter-group{}
.hermes-filter-label{font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);margin-bottom:5px;display:block}
.hermes-filter-btns{display:flex;gap:4px;flex-wrap:wrap}
.hfb{
  font-size:8px;letter-spacing:.08em;text-transform:uppercase;
  padding:4px 10px;border:1px solid rgba(255,255,255,.08);color:var(--dim);
  background:none;cursor:pointer;font-family:'Barlow',sans-serif;transition:all .15s;
}
.hfb:hover{border-color:rgba(212,175,55,.35);color:var(--muted)}
.hfb.active{
  border-color:rgba(212,175,55,.6);color:var(--gold);
  background:rgba(212,175,55,.08);
}
/* Stats strip */
.hermes-stats{
  padding:10px 16px;border-bottom:1px solid var(--border);flex-shrink:0;
  display:grid;grid-template-columns:1fr 1fr;gap:8px;background:rgba(0,0,0,.2);
}
.hermes-stat{text-align:center}
.hermes-stat-val{font-family:'Cormorant Garamond',serif;font-size:1.1rem;color:var(--gold);display:block}
.hermes-stat-label{font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);display:block;margin-top:1px}
/* Source list */
.hermes-source-list{flex:1;overflow-y:auto}
.hermes-source-list::-webkit-scrollbar{width:3px}
.hermes-source-list::-webkit-scrollbar-thumb{background:rgba(212,175,55,.2)}
.hermes-src-item{
  display:flex;align-items:center;justify-content:space-between;
  padding:9px 16px;cursor:pointer;transition:background .12s;
  border-bottom:1px solid rgba(255,255,255,.03);
}
.hermes-src-item:hover{background:rgba(255,255,255,.03)}
.hermes-src-item.active{background:rgba(212,175,55,.07);border-left:2px solid var(--gold)}
.hermes-src-name{font-size:11px;color:var(--text);line-height:1.3}
.hermes-src-lang{font-size:8px;padding:1px 4px;border:1px solid rgba(255,255,255,.08);color:var(--dim);margin-left:4px;letter-spacing:.04em}
.hermes-src-cnt{
  font-size:9px;min-width:24px;text-align:center;padding:1px 5px;
  background:rgba(255,255,255,.05);color:var(--dim);
  font-family:'Barlow Condensed',sans-serif;
}
/* Main feed */
.hermes-main{flex:1;overflow-y:auto;display:flex;flex-direction:column;background:var(--ink)}
.hermes-main::-webkit-scrollbar{width:3px}
.hermes-main::-webkit-scrollbar-thumb{background:rgba(212,175,55,.15)}
.hermes-feed-head{
  padding:14px 24px;border-bottom:1px solid var(--border);flex-shrink:0;
  display:flex;align-items:center;justify-content:space-between;
  background:var(--ink2);position:sticky;top:0;z-index:10;
}
.hermes-feed-title{font-family:'Cormorant Garamond',serif;font-size:1.15rem;color:var(--light)}
.hermes-feed-sub{font-size:9px;color:var(--dim);margin-top:2px;letter-spacing:.04em}
.hermes-refresh{
  font-size:8px;letter-spacing:.1em;text-transform:uppercase;
  padding:5px 12px;border:1px solid var(--border);color:var(--dim);
  background:none;cursor:pointer;font-family:'Barlow',sans-serif;transition:all .2s;
}
.hermes-refresh:hover{border-color:rgba(212,175,55,.5);color:var(--gold)}
/* Article cards */
.hermes-articles{padding:12px 16px;display:flex;flex-direction:column;gap:8px}
.hermes-article{
  background:var(--ink2);
  border:1px solid rgba(255,255,255,.06);
  padding:14px 16px;
  cursor:pointer;
  transition:border-color .15s,background .15s;
  position:relative;
}
.hermes-article:hover{
  border-color:rgba(212,175,55,.3);
  background:var(--ink3);
}
.hermes-article::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:2px;
  background:transparent;transition:background .15s;
}
.hermes-article:hover::before{background:var(--gold)}
/* Article meta row */
.ha-meta{display:flex;align-items:center;gap:6px;margin-bottom:7px;flex-wrap:wrap}
.ha-source{
  font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--gold);font-weight:600;
}
.ha-lang{
  font-size:8px;padding:1px 5px;
  border:1px solid rgba(255,255,255,.1);color:var(--muted);
  letter-spacing:.06em;text-transform:uppercase;
}
.ha-lang.lang-ar{border-color:rgba(212,175,55,.25);color:var(--gold)}
.ha-lang.lang-fr{border-color:rgba(74,127,193,.35);color:#4A7FC1}
.ha-lang.lang-so{border-color:rgba(76,168,130,.35);color:#4CA882}
.ha-lang.lang-sw{border-color:rgba(76,168,130,.35);color:#4CA882}
.ha-lang.lang-am{border-color:rgba(212,135,74,.35);color:#D4874A}
.ha-tier{font-size:8px;padding:1px 5px;letter-spacing:.06em;text-transform:uppercase}
.ha-tier-1{color:#4CA882;border:1px solid rgba(76,168,130,.3);background:rgba(76,168,130,.06)}
.ha-tier-2{color:#4A7FC1;border:1px solid rgba(74,127,193,.25);background:rgba(74,127,193,.05)}
.ha-countries{display:flex;gap:3px;flex-wrap:wrap}
.ha-country{
  font-size:8px;padding:1px 5px;
  background:rgba(212,175,55,.08);
  border:1px solid rgba(212,175,55,.18);
  color:rgba(212,175,55,.7);
  letter-spacing:.04em;
}
.ha-date{font-size:9px;color:var(--dim);margin-left:auto;white-space:nowrap}
/* Article title + summary */
.ha-title{
  font-family:'Cormorant Garamond',serif;
  font-size:14px;color:var(--light);
  line-height:1.45;margin-bottom:6px;font-weight:400;
}
.ha-summary{
  font-size:11px;color:var(--muted);line-height:1.65;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.ha-footer{display:flex;align-items:center;justify-content:space-between;margin-top:8px}

/* ── HERMES SENTIMENT ── */
.ha-sentiment{font-size:8px;padding:1px 6px;letter-spacing:.06em;text-transform:uppercase;border:1px solid;margin-left:2px}
.sent-positive{color:#4CA882;border-color:rgba(76,168,130,.3);background:rgba(76,168,130,.06)}
.sent-negative{color:#C45444;border-color:rgba(196,84,68,.3);background:rgba(196,84,68,.06)}
.sent-neutral{color:var(--dim);border-color:rgba(255,255,255,.1);background:transparent}

.ha-link{
  font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(212,175,55,.45);display:inline-block;transition:color .15s;
}
.hermes-article:hover .ha-link{color:var(--gold)}
/* States */
.hermes-empty{
  padding:48px 24px;text-align:center;
  color:var(--dim);font-size:12px;line-height:1.7;
}
.hermes-loading{
  padding:40px 24px;text-align:center;
  color:var(--dim);font-size:11px;
}
.hermes-loading::after{
  content:'';display:block;width:24px;height:24px;margin:12px auto 0;
  border:2px solid rgba(212,175,55,.2);border-top-color:var(--gold);
  border-radius:50%;animation:spin .8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
/* Language color dots in sidebar */
.hermes-lang-dots{display:flex;gap:4px;margin-top:8px;padding:0 16px 10px;flex-wrap:wrap}
.hld-item{display:flex;align-items:center;gap:4px;font-size:9px;color:var(--dim)}
.hld-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
/* Responsive */
@media(max-width:768px){
  .hermes-wrap{flex-direction:column;height:auto}
  .hermes-sidebar{width:100%;height:auto;border-right:none;border-bottom:1px solid var(--border)}
  .hermes-source-list{max-height:140px}
  .hermes-main{min-height:400px}
}
</style>
<div class="hermes-wrap">
  <!-- Sidebar -->
  <div class="hermes-sidebar">
    <div class="hermes-sidebar-head">
      <span class="hermes-sidebar-title">AYAAN Intelligence</span>
      <span class="hermes-total-badge" id="hermes-total">— articles</span>
    </div>
    <div class="hermes-filters">
      <div class="hermes-filter-group">
        <span class="hermes-filter-label">Language</span>
        <div class="hermes-filter-btns">
          <button class="hfb active" id="hfb-lang-all"  onclick="hermesSetLang(null)">All</button>
          <button class="hfb" id="hfb-lang-en"  onclick="hermesSetLang('en')">EN</button>
          <button class="hfb" id="hfb-lang-ar"  onclick="hermesSetLang('ar')">AR</button>
          <button class="hfb" id="hfb-lang-fr"  onclick="hermesSetLang('fr')">FR</button>
          <button class="hfb" id="hfb-lang-so"  onclick="hermesSetLang('so')">SO</button>
          <button class="hfb" id="hfb-lang-sw"  onclick="hermesSetLang('sw')">SW</button>
          <button class="hfb" id="hfb-lang-am"  onclick="hermesSetLang('am')">AM</button>
        </div>
      </div>
      <div class="hermes-filter-group">
        <span class="hermes-filter-label">Tier</span>
        <div class="hermes-filter-btns">
          <button class="hfb active" id="hfb-tier-all" onclick="hermesSetTier(null)">All</button>
          <button class="hfb" id="hfb-tier-1" onclick="hermesSetTier(1)">Tier 1 · Major</button>
          <button class="hfb" id="hfb-tier-2" onclick="hermesSetTier(2)">Tier 2 · Regional</button>
        </div>
      </div>
    </div>
    <div class="hermes-stats">
      <div class="hermes-stat">
        <span class="hermes-stat-val" id="hermes-stat-articles">—</span>
        <span class="hermes-stat-label">Articles</span>
      </div>
      <div class="hermes-stat">
        <span class="hermes-stat-val" id="hermes-stat-sources">—</span>
        <span class="hermes-stat-label">Sources</span>
      </div>
    </div>
    <div style="padding:8px 16px 6px;border-bottom:1px solid var(--border);flex-shrink:0">
      <span style="font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)">Last Ingested</span>
      <div style="font-size:10px;color:var(--muted);margin-top:2px" id="hermes-last-ingest">—</div>
    </div>
    <div class="hermes-source-list" id="hermes-source-list">
      <div style="padding:20px 16px;text-align:center;font-size:11px;color:var(--dim)">Loading sources…</div>
    </div>
  </div>
  <!-- Main feed -->
  <div class="hermes-main" id="hermes-main">
    <div class="hermes-feed-head">
      <div>
        <div class="hermes-feed-title">Regional Intelligence Feed</div>
        <div class="hermes-feed-sub" id="hermes-feed-sub">Loading…</div>
      </div>
      <input class="dash-search-input" type="text" id="hermes-keyword" placeholder="Search articles…" style="width:160px;padding:5px 8px;font-size:10px" oninput="hermesKeywordSearch(this.value)"><button class="hermes-refresh" onclick="loadHermesFeed(true)">↻ Refresh</button>
    </div>
    <div class="freshness-strip" id="freshness-hermes">
  <div class="freshness-item"><div class="freshness-dot live"></div><span class="freshness-label">AYAAN</span><span class="freshness-val" id="fresh-hermes-articles">— articles</span></div>
  <div class="freshness-item"><div class="freshness-dot live"></div><span class="freshness-label">Sources</span><span class="freshness-val" id="fresh-hermes-sources">46 active</span></div>
  <div class="freshness-item"><div class="freshness-dot live"></div><span class="freshness-label">Last ingest</span><span class="freshness-val" id="fresh-hermes-time">—</span></div>
  <div class="freshness-item"><div class="freshness-dot recent"></div><span class="freshness-label">Refresh</span><span class="freshness-val">Every 6 hours</span></div>
</div><div class="hermes-articles" id="hermes-articles">
      <div class="hermes-loading">Loading intelligence feed</div>
    </div>
  </div>
</div>
</div><!-- /dbt-hermes -->

<!-- ── TAB: ATLAS ECONOMIC ── -->
<div class="db-tab-content" id="dbt-atlas">
<style>

/* ── ATLAS CHOROPLETH MAP ── */
.atlas-map-panel{
  border-bottom:1px solid var(--border);
  flex-shrink:0;background:#050e18;
  height:220px;position:relative;overflow:hidden;
}
.atlas-map-panel svg{width:100%;height:100%;display:block}

/* ── ATLAS DASHBOARD ── */
.atlas-wrap{display:flex;height:calc(100vh - 108px);overflow:hidden}
.atlas-sidebar{
  width:280px;flex-shrink:0;border-right:1px solid var(--border);
  display:flex;flex-direction:column;overflow:hidden;background:var(--ink2);
}
.atlas-sidebar-head{
  padding:14px 18px;border-bottom:1px solid var(--border);flex-shrink:0;
  display:flex;align-items:center;justify-content:space-between;background:#0F1729;
}
.atlas-sidebar-title{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:600}
.atlas-count-badge{font-size:9px;padding:2px 8px;background:rgba(212,175,55,.12);border:1px solid rgba(212,175,55,.3);color:var(--gold);font-family:'Barlow Condensed',sans-serif}
.atlas-filters{padding:12px 16px;border-bottom:1px solid var(--border);flex-shrink:0;display:flex;flex-direction:column;gap:8px}
.atlas-filter-label{font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:4px;display:block}
.atlas-filter-btns{display:flex;gap:4px;flex-wrap:wrap}
.afb{font-size:8px;letter-spacing:.06em;text-transform:uppercase;padding:3px 9px;border:1px solid rgba(255,255,255,.08);color:var(--dim);background:none;cursor:pointer;font-family:'Barlow',sans-serif;transition:all .15s}
.afb:hover{border-color:rgba(212,175,55,.35);color:var(--muted)}
.afb.active{border-color:rgba(212,175,55,.6);color:var(--gold);background:rgba(212,175,55,.08)}
.atlas-country-list{flex:1;overflow-y:auto}
.atlas-country-list::-webkit-scrollbar{width:3px}
.atlas-country-list::-webkit-scrollbar-thumb{background:rgba(212,175,55,.2)}
.atlas-row{
  display:flex;align-items:center;padding:9px 16px;gap:10px;
  border-bottom:1px solid rgba(255,255,255,.025);cursor:pointer;transition:background .12s;
}
.atlas-row:hover{background:rgba(255,255,255,.03)}
.atlas-row.active{background:rgba(212,175,55,.06);border-left:2px solid var(--gold)}
.atlas-row-rank{font-size:10px;color:var(--dim);width:20px;flex-shrink:0;font-family:'Barlow Condensed',sans-serif}
.atlas-row-name{flex:1;font-size:11px;color:var(--text);line-height:1.3}
.atlas-row-region{font-size:9px;color:var(--dim)}
.atlas-row-score{font-size:13px;font-family:'Barlow Condensed',sans-serif;margin-right:6px}
.atlas-row-tier{font-size:8px;padding:1px 5px;letter-spacing:.06em;text-transform:uppercase}
.at-critical{color:#C45444;border:1px solid rgba(196,84,68,.3);background:rgba(196,84,68,.08)}
.at-high{color:#D4874A;border:1px solid rgba(212,135,74,.3);background:rgba(212,135,74,.07)}
.at-medium{color:#c4981f;border:1px solid rgba(196,152,31,.3);background:rgba(196,152,31,.06)}
.at-low{color:#4CA882;border:1px solid rgba(76,168,130,.3);background:rgba(76,168,130,.06)}
.at-stable{color:#4A7FC1;border:1px solid rgba(74,127,193,.3);background:rgba(74,127,193,.06)}
/* Main panel */
.atlas-main{flex:1;display:flex;flex-direction:column;overflow:hidden;background:var(--ink)}
.atlas-detail-header{
  padding:16px 24px;border-bottom:1px solid var(--border);flex-shrink:0;
  background:var(--ink2);display:flex;align-items:flex-start;justify-content:space-between;
}
.atlas-detail-name{font-family:'Cormorant Garamond',serif;font-size:1.6rem;color:var(--light)}
.atlas-detail-region{font-size:10px;color:var(--dim);margin-top:2px;letter-spacing:.06em}
.atlas-detail-score-wrap{text-align:right}
.atlas-detail-score{font-family:'Cormorant Garamond',serif;font-size:2.4rem;font-weight:600;line-height:1}
.atlas-detail-tier{font-size:9px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;margin-top:4px}
.atlas-score-bar-wrap{width:120px;height:3px;background:rgba(255,255,255,.08);margin-top:8px;margin-left:auto}
.atlas-score-bar-fill{height:3px;transition:width .8s ease}
/* KPI grid */
.atlas-kpi-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;background:var(--border);border-bottom:1px solid var(--border);flex-shrink:0;
}
.atlas-kpi{background:var(--ink2);padding:14px 18px}
.atlas-kpi-val{font-family:'Cormorant Garamond',serif;font-size:1.5rem;color:var(--light);display:block}
.atlas-kpi-label{font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:3px;display:block}
.atlas-kpi-sub{font-size:9px;color:var(--dim);margin-top:1px;display:block}
/* Charts area */
.atlas-charts{flex:1;overflow-y:auto;padding:16px 24px;display:flex;flex-direction:column;gap:16px}
.atlas-charts::-webkit-scrollbar{width:3px}
.atlas-charts::-webkit-scrollbar-thumb{background:rgba(212,175,55,.15)}
.atlas-chart-card{background:var(--ink2);border:1px solid var(--border);padding:16px 20px}
.atlas-chart-title{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;display:flex;align-items:center;justify-content:space-between}
.atlas-bar-row{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.atlas-bar-name{font-size:10px;color:var(--muted);width:120px;flex-shrink:0;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;text-align:right}
.atlas-bar-track{flex:1;height:5px;background:rgba(255,255,255,.05)}
.atlas-bar-fill{height:5px;transition:width .8s ease}
.atlas-bar-val{font-size:10px;color:var(--dim);width:44px;text-align:right;white-space:nowrap}
/* Score breakdown */
.atlas-score-breakdown{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.atlas-score-item{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);padding:12px 14px}
.atlas-score-item-label{font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.atlas-score-item-val{font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--light)}
.atlas-score-item-bar{height:2px;background:rgba(255,255,255,.06);margin-top:6px}
.atlas-score-item-fill{height:2px;transition:width .8s ease}
/* Tier summary strip */
.atlas-tier-strip{
  display:grid;grid-template-columns:repeat(5,1fr);
  gap:1px;background:var(--border);border-bottom:1px solid var(--border);flex-shrink:0;
}
.atlas-tier-cell{background:var(--ink2);padding:10px 14px;text-align:center}
.atlas-tier-count{font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--light)}
.atlas-tier-label{font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-top:2px}
/* Responsive */
@media(max-width:768px){
  .atlas-wrap{flex-direction:column;height:auto}
  .atlas-sidebar{width:100%;height:auto}
  .atlas-country-list{max-height:200px}
  .atlas-kpi-grid{grid-template-columns:repeat(2,1fr)}
  .atlas-score-breakdown{grid-template-columns:1fr 1fr}
}
</style>
<div class="atlas-wrap">
  <!-- Sidebar -->
  <div class="atlas-sidebar">
    <div class="atlas-sidebar-head">
      <span class="atlas-sidebar-title">ATLAS Economic</span>
      <span class="atlas-count-badge" id="atlas-count">47 countries</span>
    </div>
    <div class="freshness-strip" id="freshness-atlas">
  <div class="freshness-item"><div class="freshness-dot live"></div><span class="freshness-label">ATLAS</span><span class="freshness-val" id="fresh-atlas-date">47 countries · 2025</span></div>
  <div class="freshness-item"><div class="freshness-dot recent"></div><span class="freshness-label">Source</span><span class="freshness-val">IMF WEO · World Bank WDI · 2025</span></div>
  <div class="freshness-item"><div class="freshness-dot live"></div><span class="freshness-label">Updated</span><span class="freshness-val" id="fresh-atlas-updated">—</span></div>
</div><div class="atlas-filters">
      <div>
        <span class="atlas-filter-label">Risk Tier</span>
        <div class="atlas-filter-btns">
          <button class="afb active" id="afb-all"      onclick="atlasSetTier(null)">All</button>
          <button class="afb" id="afb-critical" onclick="atlasSetTier('CRITICAL')">Critical</button>
          <button class="afb" id="afb-high"     onclick="atlasSetTier('HIGH')">High</button>
          <button class="afb" id="afb-medium"   onclick="atlasSetTier('MEDIUM')">Medium</button>
          <button class="afb" id="afb-low"      onclick="atlasSetTier('LOW')">Low</button>
          <button class="afb" id="afb-stable"   onclick="atlasSetTier('STABLE')">Stable</button>
        </div>
      </div>
      <div>
        <span class="atlas-filter-label">Region</span>
        <div class="atlas-filter-btns">
          <button class="afb active" id="afb-region-all"  onclick="atlasSetRegion(null)">All</button>
          <button class="afb" id="afb-region-mena"  onclick="atlasSetRegion('Middle East')">MENA</button>
          <button class="afb" id="afb-region-ea"    onclick="atlasSetRegion('East Africa')">East Africa</button>
          <button class="afb" id="afb-region-na"    onclick="atlasSetRegion('North Africa')">N Africa</button>
          <button class="afb" id="afb-region-wa"    onclick="atlasSetRegion('West Africa')">W Africa</button>
        </div>
      </div>
    </div>
    <!-- Tier summary strip -->
    <div class="atlas-tier-strip" id="atlas-tier-strip">
    </div>
    <div class="atlas-country-list" id="atlas-country-list">
      <div style="padding:20px;text-align:center;font-size:11px;color:var(--dim)">Loading…</div>
    </div>
  </div>
  <!-- Main panel -->
  <div class="atlas-main" id="atlas-main">
    <div class="atlas-detail-header" id="atlas-detail-header">
      <div>
        <div class="atlas-detail-name" id="atlas-det-name">Select a country</div>
        <div class="atlas-detail-region" id="atlas-det-region">—</div>
      </div>
      <div class="atlas-detail-score-wrap">
        <div class="atlas-detail-score" id="atlas-det-score" style="color:var(--gold)">—</div>
        <div class="atlas-detail-tier" id="atlas-det-tier">ECONOMIC RISK SCORE</div>
        <div class="atlas-score-bar-wrap">
          <div class="atlas-score-bar-fill" id="atlas-det-bar" style="width:0;background:var(--gold)"></div>
        </div>
      </div>
    </div>
    <!-- KPI row -->
    <div class="atlas-kpi-grid" id="atlas-kpi-grid">
      <div class="atlas-kpi"><span class="atlas-kpi-val" id="ak-gdp">—</span><span class="atlas-kpi-label">GDP <span class="metric-info" onclick="showMetricTooltip('gdp_usd_bn',this)">?</span></span><span class="atlas-kpi-sub">USD Billions</span></div>
      <div class="atlas-kpi"><span class="atlas-kpi-val" id="ak-growth">—</span><span class="atlas-kpi-label">GDP Growth <span class="metric-info" onclick="showMetricTooltip('gdp_growth_pct',this)">?</span></span><span class="atlas-kpi-sub">% per annum</span></div>
      <div class="atlas-kpi"><span class="atlas-kpi-val" id="ak-inflation">—</span><span class="atlas-kpi-label">Inflation <span class="metric-info" onclick="showMetricTooltip('inflation_pct',this)">?</span></span><span class="atlas-kpi-sub">% CPI</span></div>
      <div class="atlas-kpi"><span class="atlas-kpi-val" id="ak-debt">—</span><span class="atlas-kpi-label">Debt / GDP <span class="metric-info" onclick="showMetricTooltip('debt_pct_gdp',this)">?</span></span><span class="atlas-kpi-sub">% of GDP</span></div>
    </div>
    <!-- ATLAS choropleth map -->
    <div class="atlas-map-panel" id="atlas-map-wrap">
      <svg id="atlas-map"></svg>
      <div class="map-tip" id="atlas-mtt"></div>
      <div style="position:absolute;top:8px;right:8px;display:flex;gap:6px;z-index:5" id="atlas-map-legend-items">
        <div style="display:flex;align-items:center;gap:3px;font-size:8px;color:var(--muted)"><div style="width:8px;height:8px;background:#C45444;flex-shrink:0"></div>Critical</div>
        <div style="display:flex;align-items:center;gap:3px;font-size:8px;color:var(--muted)"><div style="width:8px;height:8px;background:#D4874A;flex-shrink:0"></div>High</div>
        <div style="display:flex;align-items:center;gap:3px;font-size:8px;color:var(--muted)"><div style="width:8px;height:8px;background:#8B6914;flex-shrink:0"></div>Medium</div>
        <div style="display:flex;align-items:center;gap:3px;font-size:8px;color:var(--muted)"><div style="width:8px;height:8px;background:#4CA882;flex-shrink:0"></div>Low/Stable</div>
      </div>
    </div>
    <!-- Charts -->
    <div class="atlas-charts" id="atlas-charts">
      <!-- Score breakdown -->
      <div class="atlas-chart-card">
        <div class="atlas-chart-title">Risk Score Breakdown</div>
        <div class="atlas-score-breakdown" id="atlas-score-breakdown">
          <div class="atlas-score-item"><div class="atlas-score-item-label">Economic Risk <span class="metric-info" onclick="showMetricTooltip('economic_risk_score',this)">?</span></div><div class="atlas-score-item-val" id="asb-econ">—</div><div class="atlas-score-item-bar"><div class="atlas-score-item-fill" id="asb-econ-bar" style="width:0;background:#C45444"></div></div></div>
          <div class="atlas-score-item"><div class="atlas-score-item-label">Fiscal Score <span class="metric-info" onclick="showMetricTooltip('fiscal_score',this)">?</span></div><div class="atlas-score-item-val" id="asb-fiscal">—</div><div class="atlas-score-item-bar"><div class="atlas-score-item-fill" id="asb-fiscal-bar" style="width:0;background:#D4874A"></div></div></div>
          <div class="atlas-score-item"><div class="atlas-score-item-label">Debt Distress <span class="metric-info" onclick="showMetricTooltip('debt_distress_score',this)">?</span></div><div class="atlas-score-item-val" id="asb-debt">—</div><div class="atlas-score-item-bar"><div class="atlas-score-item-fill" id="asb-debt-bar" style="width:0;background:#8B6914"></div></div></div>
          <div class="atlas-score-item"><div class="atlas-score-item-label">Current Account</div><div class="atlas-score-item-val" id="asb-ca">—</div><div class="atlas-score-item-sub" style="font-size:9px;color:var(--dim)">% of GDP</div></div>
          <div class="atlas-score-item"><div class="atlas-score-item-label">FX Reserves</div><div class="atlas-score-item-val" id="asb-fx">—</div><div class="atlas-score-item-sub" style="font-size:9px;color:var(--dim)">USD Billions</div></div>
          <div class="atlas-score-item"><div class="atlas-score-item-label">Trade Openness</div><div class="atlas-score-item-val" id="asb-trade">—</div><div class="atlas-score-item-sub" style="font-size:9px;color:var(--dim)">Index score</div></div>
        </div>
      </div>
      <!-- Top risk countries bar chart -->
      <div class="atlas-chart-card">
        <div class="atlas-chart-title">
          <span>Top Economic Risk Countries</span>
          <span style="font-size:9px;color:var(--dim)">Economic Risk Score</span>
        </div>
        <div id="atlas-top-risk-chart"></div>
      </div>
      <!-- Debt distress chart -->
      <div class="atlas-chart-card">
        <div class="atlas-chart-title">
          <span>Debt Distress Monitor</span>
          <span style="font-size:9px;color:var(--dim)">Debt Distress Score</span>
        </div>
        <div id="atlas-debt-chart"></div>
      </div>
      <!-- GDP growth chart -->
      <div class="atlas-chart-card">
        <div class="atlas-chart-title">
          <span>GDP Growth vs Inflation</span>
          <span style="font-size:9px;color:var(--dim)">Top 15 by GDP</span>
        </div>
        <div id="atlas-gdp-chart"></div>
      </div>
    </div>
  </div>
</div>
</div><!-- /dbt-atlas -->


</div><!-- /page-dashb -->

<!-- ══════════════ MARS DASHBOARD ══════════════ -->
<div class="page-section" id="page-military">
  <div class="mars-header">
    <div class="mars-product">
      <div class="mars-logo">M</div>
      <div>
        <div class="mars-name">Agent MARS · Premium Intelligence Product</div>
        <div class="mars-desc">Military Power Index · Defence Spending · Arms Transfers · US Security Assistance · 57 Countries</div>
      </div>
    </div>
    <div style="display:flex;align-items:center;gap:20px">
      <span class="mars-price"><em>Pricing by scope &amp; tier</em> &nbsp;·&nbsp; Contact us to discuss access</span>
      <a href="https://calendly.com/republiqglobal/briefing" target="_blank" class="mars-cta" style="text-decoration:none;display:inline-block;">Book a Briefing Call</a>
      <button class="dash-back" onclick="showPage('main')">← Main Site</button>
    </div>
  </div>

  <div class="mars-stats">
    <div class="ms-item"><div class="ms-val" id="ms-countries">57</div><div class="ms-lab">Countries Tracked</div></div>
    <div class="ms-item"><div class="ms-val" id="ms-spend">$2.4T</div><div class="ms-lab">Global Defence Spend</div></div>
    <div class="ms-item"><div class="ms-val" id="ms-dominant">8</div><div class="ms-lab">Dominant Powers</div></div>
    <div class="ms-item"><div class="ms-val" id="ms-fmf">$28B+</div><div class="ms-lab">US FMF Tracked</div></div>
    <div class="ms-item"><div class="ms-val">4</div><div class="ms-lab">Analytical Dimensions</div></div>
  </div>

  <div class="mars-body">
    <!-- Sidebar: rankings + detail -->
    <div class="mars-sidebar">
      <div style="border-bottom:1px solid var(--border);flex-shrink:0">
        <div class="mars-side-head">
          <span class="mars-side-title">Military Power Rankings</span>
          <span class="mars-cnt">57 COUNTRIES</span>
        </div>
        <div style="padding:12px 18px;border-bottom:1px solid var(--border)">
          <!-- Detail box inside sidebar -->
          <div id="det-name" style="font-family:'Cormorant Garamond',serif;font-size:1.1rem;color:var(--light);margin-bottom:8px">Saudi Arabia</div>
          <div id="det-grid" style="display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;font-size:10px"></div>
        </div>
      </div>
      <div class="dash-search-wrap"><span class="dash-search-icon">⌕</span><input class="dash-search-input" type="text" id="mars-search" placeholder="Search countries…" oninput="filterMARSList(this.value)"></div>
      <div class="rank-list" id="rank-list">
        <!-- populated by JS -->
        <div class="mars-paywall" id="rank-lock">
          <p>Full Rankings Restricted</p>
          <a href="https://calendly.com/republiqglobal/briefing" target="_blank" class="btn-access" style="text-decoration:none;display:inline-block;">Book a Briefing Call</a>
        </div>
      </div>
    </div>

    <!-- Right: map + charts -->
    <div class="mars-right">
      <div class="mars-map-panel">
        <div class="mars-panel-head">
          <div>
            <span style="font-size:8px;letter-spacing:.15em;text-transform:uppercase;color:var(--dim);display:block">Military Power · Geographic Distribution</span>
            <span style="font-size:12px;font-family:'Cormorant Garamond',serif;color:var(--light)">Military Power Index Map</span>
          </div>
          <span class="hover-hint">Hover for Detail</span>
        </div>
        <div class="map-wrap" id="mars-map-wrap">
          <svg id="mars-map"></svg>
          <div class="map-tip" id="mars-mtt"></div>
        </div>
        <!-- Legend -->
        <div style="padding:6px 14px;border-top:1px solid var(--border);display:flex;gap:16px;background:var(--ink2);flex-shrink:0">
          <div class="ml-item"><div class="ml-dot" style="background:#C45444"></div>Dominant</div>
          <div class="ml-item"><div class="ml-dot" style="background:#D4874A"></div>Major</div>
          <div class="ml-item"><div class="ml-dot" style="background:#8B6914"></div>Significant</div>
          <div class="ml-item"><div class="ml-dot" style="background:#1e3a5f"></div>Emerging</div>
        </div>
      </div>

      <div class="mars-charts">
          <div class="chart-panel" style="min-width:0;overflow-y:auto"><div class="chart-head"><div><div class="ch-sub">MARS · Top 15</div><div class="ch-title">Military Power Score</div></div></div><div class="rank-bars" id="rank-bars"></div></div>
        <!-- Spending chart -->
        <div class="chart-panel">
          <div class="chart-head">
            <div>
              <div class="ch-sub">SIPRI · Defence Spending</div>
              <div class="ch-title">Top Spenders by Volume</div>
            </div>
            <span class="ch-toggle">USD BILLIONS</span>
          </div>
          <div id="spend-list"></div>
          <div class="spend-lock" id="spend-lock">
            <div class="mars-paywall">
              <p>Full Dataset Restricted</p>
              <a href="https://calendly.com/republiqglobal/briefing" target="_blank" class="btn-access" style="text-decoration:none;display:inline-block;">Book a Briefing Call</a>
            </div>
          </div>
        </div>
        <!-- FMF chart -->
        <div class="chart-panel">
          <div class="chart-head">
            <div>
              <div class="ch-sub">DSCA · US Security Assistance</div>
              <div class="ch-title">FMF &amp; FMS by Country</div>
            </div>
            <span class="ch-toggle">USD MILLIONS</span>
          </div>
          <div class="fmf-head-row">
            <div class="fmf-leg"><div class="fmf-dot" style="background:#4A7FC1"></div>FMF Grant Aid</div>
            <div class="fmf-leg"><div class="fmf-dot" style="background:#D4874A"></div>FMS Sales</div>
            <div class="fmf-leg"><div class="fmf-dot" style="background:#C45444"></div>High Dependency</div>
          </div>
          <div id="fmf-list"></div>
          <div class="fmf-lock" id="fmf-lock">
            <div class="mars-paywall">
              <p>Full Dataset Restricted</p>
              <a href="https://calendly.com/republiqglobal/briefing" target="_blank" class="btn-access" style="text-decoration:none;display:inline-block;">Book a Briefing Call</a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div style="padding:10px 32px;border-top:1px solid var(--border);font-size:9px;color:var(--dim);background:var(--ink2)">
    Military Power &amp; Security Assistance Monitor &nbsp;·&nbsp; Sources: SIPRI Military Expenditure Database, DSCA Notifications, IISS Military Balance, Nuclear Threat Initiative &nbsp;·&nbsp; <button class="btn-access" style="padding:4px 12px;font-size:8px" onclick="showPage('contact')">Request Institutional Access</button>
  </div>
</div>

<!-- ══════════════ METHODOLOGY ══════════════ -->
<div class="page-section" id="page-methodology">

<style>
/* ── METHODOLOGY STYLES ── */
.meth-page { min-height:100vh; background:var(--ink); }

.meth-hero {
  padding: 56px 64px 40px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(135deg, rgba(212,175,55,.03) 0%, transparent 60%);
  display: flex; align-items: flex-start; justify-content: space-between; gap: 40px;
}
.meth-hero-text {}
.meth-hero-back { margin-bottom:20px; }
.meth-eyebrow { font-size:9px; letter-spacing:.25em; text-transform:uppercase; color:var(--gold); margin-bottom:10px; }
.meth-h1 { font-family:'Cormorant Garamond',serif; font-size:clamp(2rem,4vw,3.2rem); font-weight:300; color:var(--light); line-height:1.15; margin-bottom:16px; }
.meth-lead { font-size:13px; color:var(--muted); line-height:1.8; max-width:520px; }

.meth-nav-pills { display:flex; gap:8px; flex-wrap:wrap; }
.meth-pill {
  padding:7px 18px; border:1px solid var(--border);
  font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim);
  cursor:pointer; background:none; font-family:'Barlow',sans-serif; transition:all .2s;
}
.meth-pill.active, .meth-pill:hover { border-color:var(--gold); color:var(--gold); background:rgba(212,175,55,.06); }

/* Framework overview */
.meth-overview {
  display:grid; grid-template-columns: 1fr 1fr; gap:0;
  border-bottom:1px solid var(--border);
}
.mo-left { padding:48px 64px; border-right:1px solid var(--border); }
.mo-right { padding:48px 48px; }
.mo-title { font-family:'Cormorant Garamond',serif; font-size:1.5rem; color:var(--light); margin-bottom:24px; }
.mo-text { font-size:12px; color:var(--muted); line-height:1.9; margin-bottom:16px; }

/* Score equation visual */
.score-eq {
  display:flex; align-items:center; gap:0; flex-wrap:wrap;
  margin:28px 0; padding:24px; border:1px solid var(--border); background:var(--ink2);
}
.eq-item { text-align:center; padding:0 14px; }
.eq-wt { font-size:20px; font-family:'Cormorant Garamond',serif; color:var(--gold); font-weight:500; }
.eq-lab { font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); margin-top:4px; }
.eq-op { font-size:18px; color:var(--dim); padding:0 4px; margin-top:-8px; }

/* Pillar section */
.meth-section { padding:0 64px 48px; }
.meth-sec-head {
  padding:32px 0 24px; display:flex; align-items:baseline; gap:20px;
  border-bottom:1px solid var(--border); margin-bottom:0;
}
.meth-sec-title { font-family:'Cormorant Garamond',serif; font-size:1.6rem; color:var(--light); }
.meth-sec-sub { font-size:11px; color:var(--dim); letter-spacing:.08em; }

/* Interactive pillar cards */
.pillars-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); }
.pillar-tile {
  background:var(--ink2); padding:0; cursor:pointer;
  transition:background .2s; position:relative; overflow:hidden;
}
.pillar-tile:hover, .pillar-tile.open { background:var(--ink3); }
.pt-header { padding:20px 20px 16px; border-bottom:1px solid transparent; transition:border-color .2s; }
.pillar-tile.open .pt-header { border-bottom-color:var(--border); }
.pt-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.pt-code { font-size:9px; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); }
.pt-arrow { font-size:12px; color:var(--dim); transition:transform .2s; }
.pillar-tile.open .pt-arrow { transform:rotate(90deg); }
.pt-name { font-family:'Cormorant Garamond',serif; font-size:1.05rem; color:var(--light); margin-bottom:6px; }
.pt-weight-bar { height:3px; background:rgba(255,255,255,0.06); margin-top:8px; }
.pt-weight-fill { height:3px; background:var(--gold); transition:width .6s ease; }
.pt-wt-label { font-size:9px; color:var(--dim); margin-top:5px; }
.pt-body { display:none; padding:16px 20px 20px; }
.pillar-tile.open .pt-body { display:block; }
.pt-desc { font-size:11px; color:var(--muted); line-height:1.8; margin-bottom:14px; }
.pt-sources { display:flex; flex-wrap:wrap; gap:5px; }
.pt-src { font-size:9px; padding:2px 7px; border:1px solid rgba(255,255,255,0.08); color:var(--dim); letter-spacing:.06em; }
.pt-indicators { margin-top:12px; }
.pt-ind-title { font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--dim); margin-bottom:8px; }
.pt-ind-list { display:flex; flex-direction:column; gap:4px; }
.pt-ind-item { display:flex; align-items:center; gap:6px; font-size:10px; color:var(--muted); }
.pt-ind-item::before { content:''; width:4px; height:4px; background:var(--gold); opacity:.5; flex-shrink:0; }

/* MARS methodology */
.mars-meth-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--border); margin-top:24px; }
.mm-card { background:var(--ink2); padding:24px 28px; }
.mm-head { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.mm-num { width:28px; height:28px; background:rgba(212,175,55,.12); border:1px solid rgba(212,175,55,.25); display:flex; align-items:center; justify-content:center; font-size:11px; font-family:'Cormorant Garamond',serif; color:var(--gold); flex-shrink:0; }
.mm-title { font-size:13px; font-family:'Cormorant Garamond',serif; color:var(--light); }
.mm-wt { font-size:9px; color:var(--dim); margin-bottom:10px; }
.mm-desc { font-size:11px; color:var(--muted); line-height:1.7; }

/* Data sources table */
.sources-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border); margin-top:24px; }
.src-card { background:var(--ink2); padding:20px 22px; }
.src-name { font-size:12px; color:var(--gold); font-weight:500; margin-bottom:6px; }
.src-full { font-size:10px; color:var(--muted); margin-bottom:8px; line-height:1.5; }
.src-freq { font-size:9px; color:var(--dim); padding:2px 7px; border:1px solid var(--border); display:inline-block; margin-bottom:6px; letter-spacing:.08em; }
.src-use { font-size:10px; color:var(--text); line-height:1.6; }

/* Tabs */
.meth-tabs { display:flex; border-bottom:1px solid var(--border); padding:0 64px; background:var(--ink2); }
.meth-tab {
  padding:14px 20px; font-size:10px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--dim); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px;
  background:none; border-top:none; border-left:none; border-right:none; font-family:'Barlow',sans-serif;
  transition:all .2s;
}
.meth-tab.active { color:var(--gold); border-bottom-color:var(--gold); }
.meth-tab:hover { color:var(--text); }
.meth-tab-content { display:none; }
.meth-tab-content.active { display:block; }

@media(max-width:768px){
  .meth-hero { padding:32px 24px; flex-direction:column; }
  .meth-overview { grid-template-columns:1fr; }
  .mo-left { border-right:none; border-bottom:1px solid var(--border); padding:32px 24px; }
  .mo-right { padding:32px 24px; }
  .pillars-grid { grid-template-columns:repeat(2,1fr); }
  .mars-meth-grid { grid-template-columns:1fr; }
  .sources-grid { grid-template-columns:1fr; }
  .meth-section { padding:0 24px 40px; }
  .meth-tabs { padding:0 24px; overflow-x:auto; }
  .score-eq { gap:0; }
  .eq-item { padding:0 8px; }
}
@media(max-width:420px){
  .pillars-grid { grid-template-columns:1fr; }
}


/* ── Component-level typography fixes ── */

/* Nav brand */
.nav-name{font-family:'Barlow Condensed',sans-serif;font-size:14px;font-weight:600;letter-spacing:.1em;color:var(--light);text-transform:uppercase}
.nav-links a{font-family:'Barlow Condensed',sans-serif;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--gold)}
.nav-cta{font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}

/* Hero */
.hero-title{font-family:'Cormorant Garamond',serif;font-size:clamp(38px,5vw,72px);font-weight:300;color:var(--light);line-height:1.0}
.hero-title em{font-style:italic;color:var(--gold)}
.hero-sub{font-family:'Barlow',sans-serif;font-size:15px;font-weight:300;color:var(--muted);line-height:1.8;max-width:560px}
.hero-tag{font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:16px;display:block}
.hero-credibility{font-family:'Barlow',sans-serif;font-size:12px;color:var(--dim);line-height:1.6}
.hs-num{font-family:'Cormorant Garamond',serif;font-size:32px;font-weight:600;color:var(--gold)}
.hs-lab{font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* Section headings */
.section-tag{font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:12px}
.section-title{font-family:'Cormorant Garamond',serif;font-size:clamp(28px,3vw,44px);font-weight:300;color:var(--light);margin-bottom:12px}
.prod-subtitle{font-family:'Barlow',sans-serif;font-size:14px;font-weight:300;color:var(--muted);max-width:680px}

/* Product cards */
.prod-code{font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.prod-name{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:400;color:var(--light);margin-bottom:8px}
.prod-desc{font-family:'Barlow',sans-serif;font-size:13px;font-weight:300;color:var(--muted);line-height:1.7;margin-bottom:12px}
.prod-link{font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);cursor:pointer}

/* SPEC cards */
.spec-card-country{font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.spec-card-title{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:400;color:var(--light)}
.spec-card-desc{font-family:'Barlow',sans-serif;font-size:13px;font-weight:300;color:var(--muted);line-height:1.6}

/* Service tier */
.st-badge{font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.st-name{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:300;color:var(--light)}
.st-feat{font-family:'Barlow',sans-serif;font-size:13px;color:var(--muted)}

/* Dashboard tabs */
.db-tab{font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.db-tab.active{color:var(--gold);border-bottom-color:var(--gold)}

/* Dash back button */
.dash-back{font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}

/* Form labels */
.cf-label{font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:6px;display:block}
.cf-input,.cf-select,.cf-textarea{font-family:'Barlow',sans-serif;font-size:13px;color:var(--text);background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);padding:10px 14px}
.cf-input:focus,.cf-textarea:focus{outline:none;border-color:rgba(212,175,55,.4)}

/* About page */
.srv-h1{font-family:'Cormorant Garamond',serif;font-size:clamp(28px,3vw,44px);font-weight:300;color:var(--light);margin-bottom:12px}
.srv-eyebrow{font-family:'Barlow Condensed',sans-serif;font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:12px}
.srv-lead{font-family:'Barlow',sans-serif;font-size:14px;font-weight:300;color:#C4CEDF;line-height:1.8;max-width:680px}

/* Intelligence ticker */
.it-item{font-family:'Barlow',sans-serif;font-size:12px;color:var(--muted)}
.it-cat{font-family:'Barlow Condensed',sans-serif;font-size:8px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:2px 6px;margin-right:6px}

/* SPEC brief body */
.sb-section-title{font-family:'Barlow Condensed',sans-serif;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.sb-body p{font-family:'Barlow',sans-serif;font-size:13px;line-height:1.8;color:var(--text)}

/* Mobile nav */
.mobile-nav a{font-family:'Barlow Condensed',sans-serif;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:10px 0;border-bottom:1px solid var(--border)}

/* Footer */
.footer-copy{font-family:'Barlow',sans-serif;font-size:11px;color:var(--dim)}
.footer-links a{font-family:'Barlow Condensed',sans-serif;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}

/* ── Deep navy card tiers ── */
.card-ink{background:var(--ink);border:1px solid var(--border)}
.card-ink2{background:var(--ink2);border:1px solid var(--border)}
.card-ink3{background:var(--ink3);border:1px solid rgba(212,175,55,.12)}

/* ── Ensure all page backgrounds are consistent ── */
.page-section{background:var(--ink)}
.page-section > div > [style*="background:var(--ink);"]{background:var(--ink) !important}


/* ── LEGIBILITY OVERRIDES ── */
body, p, li, td, th, input, textarea, select {
  color: #C4CEDF;
}
h1, h2, h3, h4, h5, h6 {
  color: #F5F8FF;
}
strong, b { color: #F5F8FF; font-weight: 600; }
.hero-title, .page-header-title, .section-title, .srv-h1 {
  color: #F5F8FF !important;
}
.hero-sub, .prod-subtitle, .page-header-sub, .srv-lead {
  color: #C4CEDF !important;
}
.spec-card-desc, .prod-desc, .st-feat, .cf-label + *, .contact-sub {
  color: #C4CEDF !important;
}
[style*="color:var(--muted)"] { color: #C4CEDF !important; }
[style*="color:var(--text)"]  { color: #ECF0F8 !important; }
[style*="color:var(--dim)"]   { color: #9AAABF !important; }
[style*="color:var(--light)"] { color: #F5F8FF !important; }
/* Dashboard text */
.spi-row, .mars-row, .atlas-row { color: #C4CEDF; }
.spi-name, .rank-name { color: #ECF0F8; font-weight: 500; }
/* Nav */
.nav-links a { color: #C4CEDF; }
.nav-links a:hover, .nav-links a.active { color: #D4AF37; }
.nav-name { color: #F5F8FF; }
/* Form fields */
.cf-input, .cf-select, .cf-textarea {
  color: #ECF0F8 !important;
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(212,175,55,0.2) !important;
}
.cf-label { color: #9AAABF !important; }
/* SPEC brief body */
.sb-body, .sb-body p, .sb-body li { color: #C4CEDF; }
.sb-body strong { color: #F5F8FF; }
/* Table text */
table td, table th { color: #C4CEDF; }
table th { color: #F5F8FF; font-weight: 600; }
/* Ticker */
.it-item { color: #C4CEDF; }
/* Mobile nav */
.mobile-nav a { color: #C4CEDF; }
/* Footer */
.footer-copy, .footer-links a { color: #9AAABF; }

/* ── Multi-page layout ── */
.page-main {
  padding-top: 56px;
  min-height: 100vh;
  background: var(--ink);
}

/* Nav CTA button */
.nav-cta {
  background: var(--gold);
  color: #0F1729 !important;
  border: none;
  padding: 8px 18px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  transition: background .2s;
  white-space: nowrap;
}
.nav-cta:hover { background: #C4A030; }

/* Nav brand */
.nav-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.nav-logo {
  width: 32px; height: 32px;
  background: var(--gold);
  color: #0F1729;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px; font-weight: 700;
  letter-spacing: .05em;
  flex-shrink: 0;
}

/* Hamburger */
.hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  padding: 4px;
}
.hamburger span {
  display: block; width: 22px; height: 2px;
  background: var(--light); transition: all .3s;
}
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile nav */
.mobile-nav {
  display: none;
  position: fixed; top: 56px; left: 0; right: 0;
  background: var(--ink2);
  border-bottom: 1px solid var(--border);
  z-index: 99;
  flex-direction: column;
  padding: 8px 0;
}
.mobile-nav.open { display: flex; }
.mobile-nav a {
  padding: 12px 24px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px; letter-spacing: .1em; text-transform: uppercase;
  color: #C4CEDF; text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,.04);
  transition: color .2s;
}
.mobile-nav a:hover { color: var(--gold); }

@media (max-width: 768px) {
  .nav-links, .nav-cta { display: none; }
  .hamburger { display: flex; }
}
@media (min-width: 769px) {
  .hamburger { display: none; }
}

/* Active nav link */
.nav-links a.active { color: var(--gold) !important; }

/* Back button standardised */
.dash-back, .back-btn {
  background: transparent;
  border: 1px solid rgba(255,255,255,0.1);
  color: #9AAABF;
  padding: 6px 14px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 9px; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  cursor: pointer; transition: all .2s;
}
.dash-back:hover, .back-btn:hover {
  color: var(--gold);
  border-color: rgba(212,175,55,0.3);
}