/* content.css — shared styles for all Dalil content pages */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg:   #0f1117;
  --s1:   #161b27;
  --s2:   #1c2333;
  --bd:   rgba(255,255,255,0.08);
  --bd2:  rgba(255,255,255,0.04);
  --t1:   #e8eaf0;
  --t2:   #8b95a8;
  --t3:   #5a6478;
  --gold: #c9a84c;
  --up:   #34c759;
  --dn:   #ff3b30;
  --mono: 'JetBrains Mono','IBM Plex Mono',monospace;
  --sans: Inter,-apple-system,sans-serif;
}

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

body { background:var(--bg); color:var(--t1); font-family:var(--sans); font-size:16px; line-height:1.7; min-height:100vh; }

/* Nav */
.c-nav { position:sticky; top:0; z-index:100; background:rgba(12,17,32,0.97); backdrop-filter:blur(14px); border-bottom:1px solid var(--bd); padding:0 24px; display:flex; align-items:center; justify-content:space-between; height:56px; }
.c-nav-brand { font-family:Georgia,serif; font-size:1.1rem; font-weight:700; color:var(--gold); text-decoration:none; display:flex; align-items:center; gap:8px; }
.c-nav-back { font-family:var(--mono); font-size:0.78rem; color:var(--t2); text-decoration:none; display:flex; align-items:center; gap:6px; transition:color 0.15s; }
.c-nav-back:hover { color:var(--t1); }

/* Hero */
.c-hero { padding:48px 24px 32px; max-width:860px; margin:0 auto; }
.c-hero-label { font-family:var(--mono); font-size:0.72rem; color:var(--t3); letter-spacing:0.12em; text-transform:uppercase; margin-bottom:10px; }
.c-hero h1 { font-size:clamp(1.8rem,4vw,2.6rem); font-weight:600; line-height:1.2; color:var(--t1); margin-bottom:14px; }
.c-hero-desc { font-size:1.05rem; color:var(--t2); max-width:620px; line-height:1.7; }

/* Live card */
.c-live { background:var(--s1); border:1px solid var(--bd); border-radius:12px; padding:20px 24px; margin:0 auto 24px; max-width:860px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.c-live-value { font-family:var(--mono); font-size:2.4rem; font-weight:700; color:var(--t1); letter-spacing:-0.02em; }
.c-live-change { font-family:var(--mono); font-size:1.1rem; font-weight:600; }
.c-live-change.up { color:var(--up); }
.c-live-change.dn { color:var(--dn); }
.c-live-meta { font-family:var(--mono); font-size:0.72rem; color:var(--t3); margin-top:4px; }
.c-live-label { font-family:var(--mono); font-size:0.70rem; color:var(--t3); letter-spacing:0.1em; margin-bottom:4px; }

/* Stats grid */
.c-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; margin:0 auto 24px; max-width:860px; padding:0 24px; }
.c-stat { background:var(--s1); border:1px solid var(--bd); border-radius:8px; padding:14px 16px; }
.c-stat-label { font-family:var(--mono); font-size:0.68rem; color:var(--t3); letter-spacing:0.1em; margin-bottom:6px; }
.c-stat-value { font-family:var(--mono); font-size:1.2rem; font-weight:600; color:var(--t1); }
.c-stat-sub { font-family:var(--mono); font-size:0.70rem; color:var(--t3); margin-top:2px; }
.c-stat-value.up { color:var(--up); }
.c-stat-value.dn { color:var(--dn); }

/* Body */
.c-body { max-width:860px; margin:0 auto; padding:0 24px 64px; }
.c-body h2 { font-size:1.3rem; font-weight:600; color:var(--t1); margin:36px 0 12px; padding-bottom:8px; border-bottom:1px solid var(--bd); }
.c-body h3 { font-size:1.05rem; font-weight:500; color:var(--t1); margin:24px 0 8px; }
.c-body p { color:var(--t2); margin-bottom:14px; }
.c-body a { color:var(--gold); text-decoration:none; }
.c-body a:hover { text-decoration:underline; }
.c-body ul { color:var(--t2); padding-left:20px; margin-bottom:14px; }
.c-body ul li { margin-bottom:6px; }

/* Table */
.c-table { width:100%; border-collapse:collapse; margin:16px 0; }
.c-table th { font-family:var(--mono); font-size:0.70rem; color:var(--t3); letter-spacing:0.1em; text-align:left; padding:8px 12px; border-bottom:1px solid var(--bd); }
.c-table td { font-family:var(--mono); font-size:0.88rem; color:var(--t1); padding:10px 12px; border-bottom:1px solid var(--bd2); }
.c-table tr:last-child td { border-bottom:none; }
.c-table .up { color:var(--up); }
.c-table .dn { color:var(--dn); }

/* CTA button */
.c-cta {
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:var(--gold);
  color:#0c1120 !important;
  font-family:var(--mono);
  font-size:0.84rem;
  font-weight:700;
  padding:12px 22px;
  border-radius:8px;
  text-decoration:none !important;
  letter-spacing:0.06em;
  margin:24px 0;
  transition:opacity 0.15s;
}
.c-cta:hover { opacity:0.88; text-decoration:none !important; }

/* Related links */
.c-related { display:flex; flex-wrap:wrap; gap:8px; margin:20px 0; }
.c-related a { background:var(--s1); border:1px solid var(--bd); border-radius:6px; padding:6px 14px; font-family:var(--mono); font-size:0.78rem; color:var(--t2); text-decoration:none; transition:all 0.15s; }
.c-related a:hover { color:var(--t1); border-color:var(--gold); }

/* Footer */
.c-footer { border-top:1px solid var(--bd); padding:20px 24px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.c-footer-text { font-family:var(--mono); font-size:0.68rem; color:var(--t3); }

/* Calendar */
.cal-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; margin:16px 0; }
.cal-day { background:var(--s1); border:1px solid var(--bd); border-radius:8px; padding:10px 12px; }
.cal-day.holiday { border-color:rgba(255,59,48,0.3); background:rgba(255,59,48,0.06); }
.cal-date { font-family:var(--mono); font-size:0.72rem; color:var(--t3); margin-bottom:4px; }
.cal-name { font-family:var(--sans); font-size:0.84rem; color:var(--t1); font-weight:500; }
.cal-type { font-family:var(--mono); font-size:0.68rem; margin-top:4px; color:var(--dn); }

/* Glossary */
.glossary-term { margin-bottom:28px; scroll-margin-top:80px; }
.glossary-term dt { font-family:var(--mono); font-size:1.05rem; font-weight:600; color:var(--gold); margin-bottom:6px; }
.glossary-term dd { color:var(--t2); }
.glossary-index { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:28px; }
.glossary-index a { font-family:var(--mono); font-size:0.78rem; color:var(--t2); background:var(--s1); border:1px solid var(--bd); border-radius:5px; padding:4px 10px; text-decoration:none; }
.glossary-index a:hover { color:var(--gold); }

/* Sector stock rows */
.sector-stock { display:flex; justify-content:space-between; align-items:center; padding:10px 12px; border-bottom:1px solid var(--bd2); }
.sector-stock:last-child { border-bottom:none; }
.sector-stock-id { font-family:var(--mono); font-size:0.90rem; font-weight:600; color:var(--t1); }
.sector-stock-name { font-family:var(--sans); font-size:0.78rem; color:var(--t3); }
.sector-stock-val { font-family:var(--mono); font-size:0.88rem; color:var(--t1); text-align:right; }
.sector-stock-ch { font-family:var(--mono); font-size:0.84rem; font-weight:600; text-align:right; }

@media (max-width:640px) {
  .c-hero { padding:28px 16px 20px; }
  .c-live { padding:14px 16px; margin:0 16px 20px; }
  .c-stats { padding:0 16px; }
  .c-body { padding:0 16px 80px; }
  .c-live-value { font-size:1.9rem; }
  .c-nav { padding:0 14px; }
}