/* ============================================================
 * Atlantic — shared styles for the research hub pages
 * (research.html, note.html, outlook.html, puzzle.html)
 * Matches the dive site: dark, Geist, red #D2262B, survey look.
 * ============================================================ */
*{margin:0;padding:0;box-sizing:border-box;}
body{background:#070808;color:#c9d4d4;font-family:'Geist',system-ui,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.5;}
.mono{font-family:'Geist Mono',ui-monospace,monospace;}
a{color:#c9d4d4;}
em{font-style:italic;}
.wrap{max-width:1160px;margin:0 auto;padding:0 5vw;}
.narrow{max-width:760px;}

/* faint survey gridlines behind sections */
.gridbg{position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
  background-size:72px 72px;}
main{position:relative;z-index:1;}

/* nav */
#nav{position:sticky;top:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:18px 5vw;background:rgba(7,8,8,.86);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.06);}
#nav .mark{font-weight:700;letter-spacing:-.03em;font-size:16px;color:#F3F6F5;}
#nav .mark span{color:#D2262B;}
#nav .r{display:flex;align-items:center;gap:22px;font-family:'Geist Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;}
#nav .r a{text-decoration:none;opacity:.8;} #nav .r a:hover{opacity:1;color:#fff;}
#nav .r a.here{color:#D2262B;opacity:1;}

/* draft banner */
.draft{background:repeating-linear-gradient(45deg,rgba(210,38,43,.08),rgba(210,38,43,.08) 12px,rgba(210,38,43,.14) 12px,rgba(210,38,43,.14) 24px);border-top:1px solid rgba(210,38,43,.3);border-bottom:1px solid rgba(210,38,43,.3);}
.draft .wrap{padding-top:10px;padding-bottom:10px;font-family:'Geist Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#e2b3b5;}
.draft b{color:#f0d0d1;}

/* section scaffolding */
.eyebrow{font-family:'Geist Mono',monospace;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:#D2262B;display:flex;align-items:center;gap:12px;margin-bottom:16px;}
.eyebrow:before{content:'';width:30px;height:1px;background:#D2262B;opacity:.7;}
h1.page{font-weight:500;letter-spacing:-.03em;font-size:clamp(34px,5vw,58px);color:#F3F6F5;line-height:1.04;}
.lede{margin-top:16px;max-width:64ch;color:#9aa6a4;font-size:15px;}
section.block{padding:52px 0;border-top:1px solid rgba(255,255,255,.06);}
section.block:first-of-type{border-top:none;}
.block h2{font-size:clamp(22px,2.6vw,32px);font-weight:500;color:#F3F6F5;letter-spacing:-.02em;}
.block .kicker{font-family:'Geist Mono',monospace;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:#7f8c8a;margin-bottom:12px;}
header.hero{padding:60px 0 30px;}
.tag{display:inline-block;font-family:'Geist Mono',monospace;font-size:8px;letter-spacing:.16em;text-transform:uppercase;padding:4px 8px;border-radius:5px;background:rgba(210,38,43,.14);color:#e08a8c;border:1px solid rgba(210,38,43,.3);vertical-align:middle;margin-left:10px;font-weight:400;}

/* perspectives grid (reused idea from homepage Insights) */
.persgrid{display:grid;grid-template-columns:1.25fr 1fr;gap:40px;margin-top:30px;}
@media(max-width:860px){.persgrid{grid-template-columns:1fr;}}
.feat{display:block;text-decoration:none;border-radius:14px;overflow:hidden;background:#0d0f11;border:1px solid rgba(255,255,255,.06);transition:border-color .2s,transform .2s;}
.feat:hover{border-color:rgba(210,38,43,.4);transform:translateY(-2px);}
.feat .img{width:100%;aspect-ratio:16/10;background:linear-gradient(135deg,#0e1417,#0a0c0e);background-size:cover;background-position:center;position:relative;}
.feat .img:after{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:26px 26px;}
.feat .cap{padding:22px 24px 28px;}
.feat .cat{font-family:'Geist Mono',monospace;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:#D2262B;}
.feat .cap h3{font-size:22px;font-weight:500;line-height:1.22;color:#F3F6F5;margin:12px 0 14px;letter-spacing:-.02em;}
.feat .meta{font-family:'Geist Mono',monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#7f8c8a;}
.rows{display:flex;flex-direction:column;}
.row{display:flex;align-items:center;gap:18px;padding:20px 4px;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.07);transition:padding .25s;}
.row:hover{padding-left:12px;} .row:hover .arr{color:#D2262B;}
.row .date{font-family:'Geist Mono',monospace;font-size:10px;letter-spacing:.14em;color:#7f8c8a;min-width:74px;}
.row h4{font-size:16px;font-weight:400;color:#dfe6e5;flex:1;letter-spacing:-.01em;}
.row .arr{color:#4a5a58;transition:color .2s;}

/* two-up cards (data set / outlook / puzzle) */
.cards{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:8px;}
@media(max-width:820px){.cards{grid-template-columns:1fr;}}
.card{background:#0d0f11;border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:26px 26px 24px;display:flex;flex-direction:column;}
.card h3{font-size:19px;font-weight:500;color:#F3F6F5;letter-spacing:-.01em;margin-bottom:10px;}
.card p{font-size:14px;color:#9aa6a4;margin-bottom:18px;}
.card .spacer{flex:1;}
.card .filemeta{font-family:'Geist Mono',monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:#5f6b6a;margin-top:14px;}

/* buttons + forms */
.btn{display:inline-flex;align-items:center;gap:10px;background:#D2262B;color:#fff;border:none;border-radius:9px;padding:13px 20px;font-family:'Geist Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;text-decoration:none;transition:transform .15s,box-shadow .15s;align-self:flex-start;}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(210,38,43,.3);}
.btn.ghost{background:transparent;border:1px solid rgba(255,255,255,.18);color:#e6ecec;}
.btn.ghost:hover{border-color:rgba(210,38,43,.6);box-shadow:none;}
.gate{display:flex;gap:10px;flex-wrap:wrap;align-items:center;}
.gate input[type=email]{flex:1;min-width:220px;background:#0a0c0e;border:1px solid rgba(255,255,255,.12);border-radius:9px;color:#e6ecec;font-family:'Geist Mono',monospace;font-size:12px;padding:13px 14px;outline:none;}
.gate input[type=email]:focus{border-color:rgba(210,38,43,.6);}
.formnote{font-family:'Geist Mono',monospace;font-size:9px;letter-spacing:.1em;color:#5f6b6a;margin-top:12px;line-height:1.7;}
.ok{color:#7fd0a2;font-family:'Geist Mono',monospace;font-size:11px;letter-spacing:.06em;margin-top:12px;display:none;}
.ok.show{display:block;}

/* subscribe strip */
.subwrap{background:#0d0f11;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:40px 38px;}
.subwrap h2{margin-bottom:8px;}
.subwrap p{color:#9aa6a4;font-size:14px;max-width:56ch;margin-bottom:22px;}

/* article body (note.html) */
.article{max-width:720px;margin:0 auto;padding:20px 0 40px;}
.article .amx{font-family:'Geist Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#7f8c8a;margin-bottom:22px;display:flex;gap:16px;flex-wrap:wrap;}
.article h2{font-size:24px;margin:34px 0 12px;color:#F3F6F5;font-weight:500;letter-spacing:-.02em;}
.article p{font-size:16px;line-height:1.75;color:#c3cecd;margin-bottom:18px;}
.article .lead{font-size:19px;line-height:1.7;color:#dfe6e5;}
.article blockquote{border-left:2px solid #D2262B;padding-left:20px;margin:24px 0;color:#9aa6a4;font-size:16px;}
.article .fig{background:#0d0f11;border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:20px;margin:26px 0;font-family:'Geist Mono',monospace;font-size:11px;color:#7f8c8a;letter-spacing:.04em;text-align:center;}

/* puzzle */
.puzzle{background:#0d0f11;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:38px;max-width:720px;}
.puzzle .q{font-size:19px;line-height:1.7;color:#dfe6e5;margin:18px 0 24px;}
.puzzle .hint{font-family:'Geist Mono',monospace;font-size:11px;color:#7f8c8a;letter-spacing:.06em;}

/* footer */
footer{border-top:1px solid rgba(255,255,255,.07);padding:34px 0 60px;margin-top:40px;position:relative;z-index:1;}
footer p{font-family:'Geist Mono',monospace;font-size:9.5px;letter-spacing:.06em;line-height:1.9;color:#5f6b6a;max-width:104ch;}
footer p b{color:#8a9896;}
footer .flinks{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:16px;font-family:'Geist Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;}
footer .flinks a{color:#8a9896;text-decoration:none;} footer .flinks a:hover{color:#fff;}