/*
Theme Name: Investrekly
Theme URI: https://investrekly.com
Description: Custom dark theme for investrekly.com
Version: 1.0
Author: Investrekly
Text Domain: investrekly
*/

/* ── Reset & Base ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg:      #06060c;
  --bg2:     #0d0d1a;
  --card:    rgba(8,8,20,0.55);
  --border:  #2a2a42;
  --text:    #f0f0f8;
  --muted:   #8080b0;
  --dim:     #505070;
  --green:   #00d26a;
  --blue:    #60a5fa;
  --orange:  #fb923c;
  --purple:  #a78bfa;
  --red:     #ff3f3f;
  --font:    'Prompt', sans-serif;
  --mono:    'JetBrains Mono', monospace;
}

html { scroll-behavior: smooth; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }

/* ── Nav ── */
#inv-nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(6,6,12,0.85);
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.nav-inner {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 20px;
  height: 54px;
  display: flex;
  align-items: center;
  gap: 32px;
}
.nav-logo {
  font-family: var(--font);
  font-weight: 700;
  font-size: 1rem;
  color: var(--text);
  letter-spacing: -.01em;
  flex-shrink: 0;
}
.nav-logo .logo-dot { color: var(--green); }
.nav-links {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1;
}
.nav-links a {
  font-size: .8rem;
  font-weight: 600;
  color: var(--muted);
  padding: 5px 10px;
  border-radius: 5px;
  transition: color .15s, background .15s;
  white-space: nowrap;
}
.nav-links a:hover, .nav-links a.active { color: var(--text); background: rgba(255,255,255,.06); }
.nav-item { position: relative; }
.nav-item > a i { font-size: .65rem; margin-left: 2px; vertical-align: 1px; }
.nav-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 210px;
  margin-top: 4px;
  background: rgba(10,10,18,.98);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 6px;
  display: none;
  flex-direction: column;
  gap: 2px;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
}
.nav-item:hover .nav-dropdown { display: flex; }
.nav-dropdown a {
  font-size: .8rem;
  font-weight: 600;
  color: var(--muted);
  padding: 7px 10px;
  border-radius: 5px;
  white-space: nowrap;
}
.nav-dropdown a:hover { color: var(--text); background: rgba(255,255,255,.06); }
.nav-right { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.nav-btn {
  font-family: var(--font);
  font-size: .78rem;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 5px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  transition: .15s;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.nav-btn:hover { border-color: #5050a0; color: var(--text); }
.nav-btn.primary { background: var(--green); border-color: var(--green); color: #000; }
.nav-btn.primary:hover { background: #00b85e; }

/* hamburger — mobile */
#nav-toggle {
  display: none;
  background: none;
  border: none;
  color: var(--muted);
  font-size: 1.2rem;
  cursor: pointer;
  margin-left: auto;
  padding: 4px;
}
#nav-mobile {
  display: none;
  flex-direction: column;
  gap: 2px;
  padding: 8px 20px 14px;
  border-top: 1px solid var(--border);
  background: rgba(6,6,12,0.95);
}
#nav-mobile a {
  font-size: .88rem;
  font-weight: 600;
  color: var(--muted);
  padding: 9px 12px;
  border-radius: 6px;
  transition: color .15s, background .15s;
}
#nav-mobile a:hover { color: var(--text); background: rgba(255,255,255,.05); }
#nav-mobile a.nav-sub { font-size: .8rem; color: #64748b; padding-left: 24px; }
#nav-mobile.open { display: flex; }

/* ── Page wrapper (for non-home pages) ── */
#page-wrap {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ── Article (single post) ── */
#article-wrap {
  max-width: 720px;
  margin: 0 auto;
  padding: 40px 20px 80px;
}
.art-breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--dim);
  margin-bottom: 22px;
  font-family: var(--mono);
}
.art-breadcrumb a { color: var(--dim); transition: color .15s; }
.art-breadcrumb a:hover { color: var(--muted); }
.art-breadcrumb span { color: var(--border); }
.art-cat {
  display: inline-block;
  font-family: var(--mono);
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 3px;
  margin-bottom: 16px;
  color: #000;
}
.art-title {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.4;
  color: var(--text);
  margin-bottom: 16px;
}
.art-meta {
  display: flex;
  align-items: center;
  gap: 16px;
  font-family: var(--mono);
  font-size: .65rem;
  color: var(--dim);
  padding-bottom: 28px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 36px;
}
.art-meta i { font-size: 12px; }

/* Article content typography */
.art-content { color: #e2dfd9; font-size: .98rem; line-height: 1.85; }
.art-content h2 {
  font-size: 1.22rem; font-weight: 700; color: var(--text);
  margin: 40px 0 14px; padding-bottom: 8px; border-bottom: 1px solid var(--border);
}
.art-content h3 { font-size: 1.05rem; font-weight: 700; color: var(--text); margin: 30px 0 10px; }
.art-content h4 { font-size: .95rem; font-weight: 700; color: var(--muted); margin: 22px 0 8px; }
.art-content p { margin-bottom: 18px; }
.art-content ul, .art-content ol { margin: 0 0 18px 22px; }
.art-content li { margin-bottom: 6px; }
.art-content a { color: var(--green); border-bottom: 1px solid rgba(0,210,106,.3); transition: border-color .15s; }
.art-content a:hover { border-color: var(--green); }
.art-content strong { color: var(--text); font-weight: 700; }
.art-content em { color: var(--muted); font-style: italic; }
.art-content blockquote {
  margin: 24px 0; padding: 16px 20px;
  border-left: 3px solid var(--green);
  background: rgba(0,210,106,.05);
  border-radius: 0 8px 8px 0;
  color: var(--muted);
  font-style: italic;
}
.art-content code {
  font-family: var(--mono); font-size: .85em;
  background: rgba(255,255,255,.06); color: var(--blue);
  padding: 2px 6px; border-radius: 4px;
}
.art-content pre {
  background: #0a0a16; border: 1px solid var(--border);
  border-radius: 8px; padding: 18px 20px; overflow-x: auto;
  margin: 20px 0;
}
.art-content pre code { background: none; padding: 0; color: #a0c8f0; font-size: .85rem; }
.art-content img { border-radius: 8px; margin: 24px 0; }
.art-content table {
  width: 100%; border-collapse: collapse;
  margin: 20px 0; font-size: .88rem;
}
.art-content th {
  background: rgba(255,255,255,.04); color: var(--muted);
  font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  padding: 10px 14px; border-bottom: 1px solid var(--border); text-align: left;
}
.art-content td { padding: 10px 14px; border-bottom: 1px solid rgba(42,42,66,.5); }
.art-content tr:last-child td { border-bottom: none; }
.art-content hr { border: none; border-top: 1px solid var(--border); margin: 36px 0; }

/* Disclaimer box */
.art-disclaimer {
  margin-top: 40px; padding: 16px 20px;
  border: 1px solid var(--border); border-left: 3px solid var(--orange);
  border-radius: 0 8px 8px 0; background: rgba(251,146,60,.04);
  font-size: .8rem; color: var(--dim); line-height: 1.65;
}
.art-disclaimer strong { color: var(--orange); }

/* Article footer */
.art-foot {
  margin-top: 48px; padding-top: 28px; border-top: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
}
.art-back {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .82rem; font-weight: 600; color: var(--muted);
  padding: 8px 16px; border: 1px solid var(--border);
  border-radius: 6px; transition: .15s;
}
.art-back:hover { color: var(--text); border-color: #5050a0; }
.art-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.art-tag {
  font-family: var(--mono); font-size: .6rem; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 4px;
  border: 1px solid var(--border); color: var(--dim);
}

/* ── Footer ── */
#inv-footer {
  border-top: 1px solid var(--border);
  padding: 32px 20px;
  margin-top: 60px;
}
.footer-inner {
  max-width: 1080px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
}
.footer-logo { font-weight: 700; font-size: .9rem; }
.footer-logo .logo-dot { color: var(--green); }
.footer-copy { font-size: .72rem; color: var(--dim); }
.footer-links { display: flex; gap: 16px; }
.footer-links a { font-size: .75rem; color: var(--dim); transition: color .15s; }
.footer-links a:hover { color: var(--muted); }

/* ── 404 ── */
#err-wrap {
  max-width: 480px; margin: 80px auto; padding: 0 20px; text-align: center;
}
.err-code { font-family: var(--mono); font-size: 5rem; font-weight: 700; color: var(--border); line-height: 1; margin-bottom: 16px; }
.err-title { font-size: 1.3rem; font-weight: 700; margin-bottom: 8px; }
.err-desc { font-size: .88rem; color: var(--muted); margin-bottom: 28px; line-height: 1.7; }

/* ── Responsive ── */
@media (max-width: 700px) {
  .nav-links, .nav-right { display: none; }
  #nav-toggle { display: block; }
  .art-title { font-size: 1.4rem; }
  .footer-inner { flex-direction: column; align-items: flex-start; gap: 16px; }
}

/* ── Homepage (hero, bento, article list) ── */
#hp{font-family:'Prompt',sans-serif;max-width:1080px;margin:0 auto;color:var(--w);position:relative;z-index:1}
#hp-wrap{background:transparent;position:relative;z-index:1;width:100%}
#hp *{box-sizing:border-box;margin:0;padding:0}
#hp .hero{padding:40px 0 36px;border-bottom:1px solid var(--br);display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
#hp .hero-label{font-size:.65rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
#hp .hero-btns{display:flex;gap:10px;flex-wrap:wrap}
#hp .btn-g{background:var(--green);color:#000;font-family:'Prompt',sans-serif;font-weight:700;font-size:.88rem;padding:10px 22px;border-radius:6px;text-decoration:none;display:inline-flex;align-items:center;gap:7px;transition:.15s}
#hp .btn-g:hover{background:#00b85e}
#hp .btn-w{background:transparent;color:#9090b8;font-family:'Prompt',sans-serif;font-size:.88rem;padding:10px 22px;border-radius:6px;border:1px solid var(--border);text-decoration:none;display:inline-flex;align-items:center;gap:7px;transition:.15s}
#hp .btn-w:hover{border-color:#6060a0;color:var(--text)}
#hp .hero-right{display:flex;gap:28px}
#hp .hc{text-align:center}
#hp .hc-n{font-family:'mono',monospace;font-size:2rem;font-weight:700;color:var(--text);line-height:1}
#hp .hc-l{font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:4px}
#hp .dl{display:flex;align-items:center;gap:12px;padding:32px 0 16px}
#hp .dl-txt{font-size:.62rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
#hp .dl-line{flex:1;height:1px;background:var(--border)}
#hp .bento{display:grid;grid-template-columns:5fr 3fr 3fr;grid-template-areas:"main inv tech" "main tools psy" "calc calc calc";gap:6px;width:100%}
#hp .bc{border-radius:10px;background:var(--card);border:1px solid var(--border);padding:20px;display:flex;flex-direction:column;transition:border-color .18s,background .18s;position:relative;overflow:hidden;min-height:180px;cursor:pointer;backdrop-filter:blur(6px)}
#hp .bc:hover{background:rgba(20,20,50,0.7);border-color:#5050a0}
#hp .bc-main{grid-area:main;min-height:366px;padding:24px}
#hp .bc-inv{grid-area:inv}
#hp .bc-tech{grid-area:tech}
#hp .bc-tools{grid-area:tools}
#hp .bc-psy{grid-area:psy}
#hp .bc-calc{grid-area:calc;flex-direction:row;align-items:center;gap:20px;padding:18px 24px;min-height:88px}
#hp .bc-top{display:flex;align-items:center;justify-content:space-between}
#hp .bc-code{font-family:var(--mono);font-size:.62rem;font-weight:700;letter-spacing:.1em;color:var(--muted)}
#hp .bc-dot{width:7px;height:7px;border-radius:50%;background:var(--green);flex-shrink:0}
#hp .bc-body{margin-top:auto;padding-top:12px}
#hp .bc-num{font-family:var(--mono);font-size:2.2rem;font-weight:700;color:#3a3a70;line-height:1;margin-bottom:6px;transition:color .18s}
#hp .bc-main .bc-num{font-size:3.4rem}
#hp .bc:hover .bc-num{color:#7070c0}
#hp .bc-badge{font-family:var(--mono);font-size:.58rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#000;background:var(--green);padding:2px 8px;border-radius:3px;display:inline-block;margin-bottom:8px}
#hp .bc-name{font-size:.92rem;font-weight:700;color:var(--text);margin-bottom:3px}
#hp .bc-main .bc-name{font-size:1.1rem;margin-bottom:6px}
#hp .bc-desc{font-size:.78rem;color:var(--muted);line-height:1.6}
#hp .bc-main .bc-desc{color:#a0a0c8;font-size:.82rem}
#hp .bc-arr{position:absolute;bottom:16px;right:16px;font-size:14px;color:#4a4a80;transition:color .18s,transform .18s}
#hp .bc:hover .bc-arr{color:var(--green);transform:translate(2px,-2px)}
#hp .cc-sym{font-family:var(--mono);font-size:1.8rem;font-weight:700;color:#3a3a70;flex-shrink:0;line-height:1;transition:color .18s}
#hp .bc-calc:hover .cc-sym{color:#7070c0}
#hp .bc-calc .bc-name{font-size:.92rem;margin-bottom:3px}
#hp .bc-calc .bc-desc{color:var(--muted);font-size:.78rem}
#hp .bc-calc .bc-arr{position:static;margin-left:auto;font-size:16px;color:#4a4a80;flex-shrink:0;transition:color .18s,transform .18s}
#hp .bc-calc:hover .bc-arr{color:var(--green);transform:translateX(3px)}
#hp .art-wrap{border:1px solid var(--border);border-radius:10px;overflow:hidden}
#hp .art-head{display:grid;grid-template-columns:36px 1fr 90px 72px;padding:8px 16px;background:rgba(8,8,20,0.7);border-bottom:1px solid var(--border)}
#hp .art-head span{font-family:var(--mono);font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
#hp .ar{display:grid;grid-template-columns:36px 1fr 90px 72px;padding:13px 16px;text-decoration:none;border-bottom:1px solid var(--border);background:var(--card);transition:background .12s;align-items:center;backdrop-filter:blur(4px)}
#hp .ar:last-child{border-bottom:none}
#hp .ar:hover{background:rgba(20,20,50,0.7)}
#hp .ar-n{font-family:var(--mono);font-size:.72rem;color:var(--muted);font-weight:700}
#hp .ar-title{font-size:.85rem;font-weight:600;color:#b0b0d0;transition:color .12s;padding-right:12px}
#hp .ar:hover .ar-title{color:var(--text)}
#hp .ar-cat{font-family:var(--mono);font-size:.62rem;font-weight:700;letter-spacing:.04em}
#hp .ar-date{font-family:var(--mono);font-size:.62rem;color:var(--muted);text-align:right}
#hp .art-foot{padding-top:20px;text-align:center}
#hp .bc-main .bc-code{color:var(--green)}
#hp .bc-inv .bc-dot{background:var(--blue)}#hp .bc-inv .bc-code{color:var(--blue)}#hp .bc-inv:hover .bc-arr{color:var(--blue)}
#hp .bc-tech .bc-dot{background:var(--orange)}#hp .bc-tech .bc-code{color:var(--orange)}#hp .bc-tech:hover .bc-arr{color:var(--orange)}
#hp .bc-tools .bc-dot{background:var(--purple)}#hp .bc-tools .bc-code{color:var(--purple)}#hp .bc-tools:hover .bc-arr{color:var(--purple)}
#hp .bc-psy .bc-dot{background:var(--red)}#hp .bc-psy .bc-code{color:var(--red)}#hp .bc-psy:hover .bc-arr{color:var(--red)}
@media(max-width:820px){#hp .bento{grid-template-columns:1fr 1fr;grid-template-areas:"main main" "inv tech" "tools psy" "calc calc"}#hp .bc-main{min-height:200px}#hp .hero{flex-direction:column;align-items:flex-start}#hp .art-head{display:none}#hp .ar{grid-template-columns:30px 1fr 64px}#hp .ar-date{display:none}}
@media(max-width:500px){#hp .bento{grid-template-columns:1fr;grid-template-areas:"main" "inv" "tech" "tools" "psy" "calc"}#hp .hero-right{gap:20px}#hp .hc-n{font-size:1.5rem}}

/* ── Globe (homepage market map) ── */
#gw{position:sticky;top:0;height:100vh;width:100vw;margin-left:calc(50% - 50vw);overflow:hidden;background:#06060c;border-radius:0;margin-top:0;margin-bottom:0;user-select:none;z-index:0}
#gw-svg{position:absolute;top:0;left:0;display:block}
#gw-tt{position:fixed;background:#0d0d1c;border:1px solid #22223a;border-radius:8px;padding:10px 14px;pointer-events:none;display:none;z-index:9999;min-width:150px;font-family:'JetBrains Mono',monospace}
#gw-tt .gn{color:#f0f0f8;font-weight:700;font-size:13px;margin-bottom:2px;font-family:'Prompt',sans-serif}
#gw-tt .gc{font-size:9px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px;font-family:'Prompt',sans-serif}
#gw-tt .gv{font-size:13px;font-weight:700;color:#f0f0f8}
#gw-tt .gp{font-size:10px;font-weight:700;margin-top:2px}
#gw-tt .gh{font-size:8px;color:#505070;letter-spacing:.06em;margin-top:6px;border-top:1px solid #111128;padding-top:5px;font-family:'Prompt',sans-serif}
#gw-bar{position:absolute;top:14px;left:0;right:200px;display:flex;justify-content:center;gap:6px;flex-wrap:wrap;z-index:10;padding:0 14px}
.gwb{font-family:'Prompt',sans-serif;font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:6px 13px;border-radius:5px;border:1px solid #222238;background:#0d0d1a;color:#7070a0;cursor:pointer;display:flex;align-items:center;gap:7px;transition:border-color .15s,color .15s,background .15s}
.gwb:hover{border-color:#3a3a5a;color:#b0b0d0;background:#12121e}
.gwba{border-color:#5050a0!important;color:#f0f0f8!important;background:#14142a!important;transition:box-shadow .3s!important}
.gwnm{opacity:.3;cursor:default;pointer-events:none}
.gwbd{width:8px;height:8px;border-radius:2px;flex-shrink:0}
#gw-wc{position:absolute;top:14px;right:14px;text-align:right;z-index:10}
#gw-wc-time{font-size:1.6rem;font-weight:700;color:#e8e8f8;letter-spacing:.06em;line-height:1;font-family:'JetBrains Mono',monospace}
#gw-wc-day{font-size:9px;color:#6060a0;letter-spacing:.12em;text-transform:uppercase;margin-top:5px;font-family:'Prompt',sans-serif}
#gw-panel{position:absolute;top:76px;right:14px;background:#0a0a14;border:1px solid #20203a;border-radius:10px;padding:12px 14px;width:210px;backdrop-filter:blur(12px)}
#gw-plabel{font-size:8px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#6060a0;margin-bottom:8px;font-family:'Prompt',sans-serif}
#gw-ms{max-height:380px;overflow-y:auto}
#gw-ms::-webkit-scrollbar{width:2px}
#gw-ms::-webkit-scrollbar-track{background:transparent}
#gw-ms::-webkit-scrollbar-thumb{background:#2a2a50;border-radius:2px}
.gwr{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid #141428}
.gwr:last-child{border-bottom:none}
.gwrd{width:6px;height:6px;border-radius:50%;background:#222238;flex-shrink:0;transition:background .4s,box-shadow .4s}
.gwri{flex:1;min-width:0}
.gwrid{font-size:13px;font-weight:700;color:#9090c0;letter-spacing:.02em;font-family:'Prompt',sans-serif}
.gwric{font-size:9px;color:#505070;font-family:'Prompt',sans-serif;margin-top:1px}
.gwrt{font-size:9px;font-weight:700;color:#6060a0;font-family:'JetBrains Mono',monospace;min-width:36px;text-align:right;flex-shrink:0}
.gwrr{text-align:right;min-width:52px}
.gwrs{font-size:9px;font-weight:600;letter-spacing:.06em;color:#404060;text-transform:uppercase;transition:color .4s;font-family:'Prompt',sans-serif}
.gwrp{font-size:12px;font-weight:700;font-family:'Prompt',sans-serif;margin-top:1px;min-height:12px}
@media(max-width:640px){
  #gw{position:relative;height:auto;padding-top:60vh;overflow:visible}
  #gw-bar{flex-wrap:nowrap;overflow-x:auto;right:0;justify-content:flex-start;padding:0 10px;scrollbar-width:none}
  #gw-bar::-webkit-scrollbar{display:none}
  #gw-wc{top:52px;right:10px}
  #gw-wc-time{font-size:.85rem}
  #gw-wc-day{display:none}
  #gw-panel{position:relative;top:auto;right:auto;left:0;width:100%;max-width:none;border-radius:0;border-left:none;border-right:none;border-bottom:none}
  #gw-ms{max-height:none;overflow-y:visible}
}
