/* valuepost.click — shared styles */
:root{
  --ink:#1a1a2e;--ink2:#4a4a6a;--paper:#faf7f0;--paper2:#f0ebe0;
  --lapis:#1a2744;--lapis2:#243454;--gold:#c9a55a;--gold2:#e8d4a0;
  --crimson:#8b1a1a;--rule:#d4c9a8;--green:#1e6b3c;--mute:#7a8fb0;
  --maxw:1120px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Lora',Georgia,serif;background:var(--paper);color:var(--ink);
  font-size:16px;line-height:1.65}
img{max-width:100%}
a{color:var(--lapis)}

/* ---- nav ---- */
#site-nav{position:sticky;top:0;z-index:50;background:var(--lapis);
  border-bottom:2px solid var(--gold);display:flex;align-items:center;
  padding:0 24px;min-height:54px;gap:4px;flex-wrap:wrap}
.nav-logo{font-family:'Cinzel',serif;font-size:15px;color:var(--gold);
  letter-spacing:1.2px;white-space:nowrap;margin-right:14px;font-weight:600;
  text-decoration:none}
.nav-links{display:flex;gap:2px;flex-wrap:wrap;margin-left:auto}
.nav-link{padding:8px 13px;font-family:'Cinzel',serif;font-size:11px;
  letter-spacing:.8px;text-transform:uppercase;color:var(--mute);
  text-decoration:none;border-radius:2px;white-space:nowrap;transition:color .15s,background .15s}
.nav-link:hover{color:var(--gold);background:rgba(201,165,90,.1)}
.nav-link.active{color:var(--gold);border-bottom:2px solid var(--gold)}

/* ---- layout ---- */
.wrap{max-width:var(--maxw);margin:0 auto}
.section{padding:56px 32px;border-bottom:1px solid var(--rule)}
.section:nth-of-type(even){background:rgba(240,235,224,.4)}
.section-header{font-family:'Cinzel',serif;font-size:clamp(24px,4vw,32px);
  font-weight:700;color:var(--lapis);margin-bottom:10px;letter-spacing:.5px;line-height:1.2}
.section-sub{font-size:16px;color:var(--ink2);font-style:italic;
  margin-bottom:32px;line-height:1.55;max-width:70ch}
.sub-title{font-family:'Cinzel',serif;font-size:14px;font-weight:600;
  letter-spacing:.9px;text-transform:uppercase;color:var(--ink2);
  margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--rule)}
.eyebrow{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:1.4px;
  text-transform:uppercase;color:var(--gold);margin-bottom:14px}

/* ---- hero ---- */
.hero{background:var(--lapis);padding:72px 32px;border-bottom:2px solid var(--gold)}
.hero .section-header{color:var(--gold);font-size:clamp(30px,6vw,48px)}
.hero .section-sub{color:var(--gold2);font-size:18px;margin-bottom:0}
.hero .eyebrow{color:var(--mute)}

/* ---- cards ---- */
.grid{display:grid;gap:22px}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:#fff;border:1px solid var(--rule);border-radius:4px;padding:24px;
  border-top:3px solid var(--gold)}
.card h3{font-family:'Cinzel',serif;font-size:18px;color:var(--lapis);
  margin-bottom:10px;font-weight:600}
.card p{font-size:15px;color:var(--ink2)}
.card a{color:var(--crimson);text-decoration:none;font-family:'JetBrains Mono',monospace;
  font-size:12px;letter-spacing:.5px;display:inline-block;margin-top:14px}
.card a:hover{text-decoration:underline}

.stats-row{display:flex;flex-wrap:wrap;gap:20px;margin-top:32px}
.stat-card{flex:1;min-width:150px;text-align:center;background:rgba(255,255,255,.06);
  border:1px solid rgba(201,165,90,.3);border-radius:4px;padding:18px 20px}
.stat-card .sv{font-family:'Cinzel',serif;font-size:32px;font-weight:700;color:var(--gold)}
.stat-card .sl{font-size:11px;text-transform:uppercase;letter-spacing:.9px;
  color:#9ba8c0;margin-top:4px;font-family:'JetBrains Mono',monospace}

/* ---- prose ---- */
.prose{max-width:74ch}
.prose h2{font-family:'Cinzel',serif;font-size:21px;color:var(--lapis);
  margin:36px 0 12px;font-weight:600}
.prose h3{font-family:'Cinzel',serif;font-size:16px;color:var(--ink2);
  margin:24px 0 8px;font-weight:600;letter-spacing:.4px}
.prose p{margin-bottom:14px;color:var(--ink2)}
.prose ul,.prose ol{margin:0 0 16px 22px;color:var(--ink2)}
.prose li{margin-bottom:7px}
.prose a{color:var(--crimson)}
.prose strong{color:var(--ink)}

.callout{background:var(--paper2);border-left:3px solid var(--gold);
  padding:16px 20px;border-radius:0 3px 3px 0;margin:22px 0;font-size:15px;color:var(--ink2)}
.mono{font-family:'JetBrains Mono',monospace;font-size:13px}

.btn{display:inline-block;padding:11px 24px;font-family:'Cinzel',serif;font-size:12px;
  letter-spacing:1px;text-transform:uppercase;text-decoration:none;border-radius:2px;
  transition:all .15s;margin:20px 10px 0 0}
.btn-gold{background:var(--gold);color:var(--lapis);border:1px solid var(--gold)}
.btn-gold:hover{background:var(--gold2)}
.btn-ghost{background:transparent;color:var(--gold);border:1px solid rgba(201,165,90,.5)}
.btn-ghost:hover{background:rgba(201,165,90,.12)}

/* ---- footer ---- */
footer{background:var(--lapis);color:#9ba8c0;padding:40px 32px;font-size:13px}
footer .wrap{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:center}
footer a{color:var(--gold2);text-decoration:none;margin-right:16px}
footer a:hover{color:var(--gold);text-decoration:underline}
footer .fnote{font-family:'JetBrains Mono',monospace;font-size:11px;color:#6b7d99}

@media (max-width:640px){
  .section,.hero{padding-left:20px;padding-right:20px}
  .nav-links{margin-left:0;width:100%;padding-bottom:6px}
  #site-nav{padding:8px 20px}
}