/* Risk Runway — blog shared stylesheet
   Extracted from the original inline article CSS so new posts stay consistent
   without duplicating 240 lines of rules per file. */

*{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#0a0a0a;
  --paper:#f5f4f0;
  --dim:#b8b5ac;
  --muted:#6b6a64;
  --accent:#1a1a2e;
  --green:#1a7a4a;
  --green-light:#eaf5ef;
  --red:#c0392b;
  --red-light:#fdf2f0;
  --amber:#c9a84c;
  --blue:#3a5a8a;
  --purple:#6a4c93;
  --line:#e8e6e1;
  --serif:'Georgia','Times New Roman',serif;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}
body{
  font-family:var(--sans);
  background:var(--paper);
  color:var(--ink);
  line-height:1.7;
  font-size:16px;
}
a{color:var(--accent);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s}
a:hover{border-bottom-color:var(--accent)}
img{max-width:100%;height:auto}

/* Header */
.site-header{
  background:#fff;
  border-bottom:1px solid var(--line);
  padding:1rem 1.5rem;
  position:sticky;
  top:0;
  z-index:100;
}
.site-header-inner{
  max-width:800px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.site-logo{
  font-family:var(--serif);
  font-size:1.1rem;
  font-weight:600;
  color:var(--ink);
  letter-spacing:-0.02em;
}
.site-logo span{color:var(--green);font-weight:700}
.site-nav a{
  font-size:.85rem;
  color:var(--dim);
  margin-left:1.25rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:500;
}
.site-nav a:hover,.site-nav a.active{color:var(--ink)}

/* Article */
.article-container{
  max-width:720px;
  margin:0 auto;
  padding:3rem 1.5rem 4rem;
}
.article-meta{
  font-size:.85rem;
  color:var(--dim);
  margin-bottom:1.5rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.article-meta .date::before{content:"•";margin:0 .5rem}
h1{
  font-family:var(--serif);
  font-size:2.4rem;
  line-height:1.2;
  margin-bottom:1.5rem;
  letter-spacing:-0.02em;
}
h2{
  font-family:var(--serif);
  font-size:1.6rem;
  margin-top:2.5rem;
  margin-bottom:1rem;
  line-height:1.3;
}
h3{
  font-size:1.15rem;
  font-weight:600;
  margin-top:2rem;
  margin-bottom:.75rem;
}
p{margin-bottom:1.25rem;color:#333}
ul,ol{margin-bottom:1.5rem;padding-left:1.5rem}
li{margin-bottom:.5rem}
strong{color:var(--ink)}

/* Answer-first lead paragraph */
.answer-lead{
  font-size:1.1rem;
  line-height:1.65;
  color:#222;
  border-left:3px solid var(--ink);
  padding-left:1.25rem;
  margin-bottom:2rem;
}

/* Calculator embed */
.calculator-embed{
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:2rem;
  margin:2.5rem 0;
  text-align:center;
}
.calculator-embed h3{
  font-family:var(--serif);
  font-size:1.4rem;
  margin-bottom:.5rem;
  margin-top:0;
}
.calculator-embed p{
  color:var(--dim);
  font-size:.95rem;
  margin-bottom:1.5rem;
}
.cta-button{
  display:inline-block;
  background:var(--accent);
  color:#fff;
  padding:.85rem 2rem;
  border-radius:6px;
  font-weight:600;
  font-size:1rem;
  letter-spacing:.02em;
  transition:transform .2s,box-shadow .2s;
  border:none;
}
.cta-button:hover{
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(0,0,0,.15);
  border:none;
}
.cta-note{font-size:.8rem;color:var(--dim);margin-top:1rem}
.cta-note span{color:var(--green);font-weight:600}

/* Callout boxes */
.highlight-box{
  background:var(--green-light);
  border-left:4px solid var(--green);
  padding:1.25rem 1.5rem;
  margin:2rem 0;
  border-radius:0 8px 8px 0;
}
.highlight-box p{margin:0;color:#1a5c38;font-size:.95rem}
.highlight-box strong{display:block;margin-bottom:.5rem;font-size:1.05rem;color:#14512f}
.warning-box{
  background:var(--red-light);
  border-left:4px solid var(--red);
  padding:1.25rem 1.5rem;
  margin:2rem 0;
  border-radius:0 8px 8px 0;
}
.warning-box p{margin:0;color:#8b2e24;font-size:.95rem}
.warning-box strong{color:#7a281e}

/* Tables */
.data-table{
  width:100%;
  border-collapse:collapse;
  margin:1.5rem 0;
  font-size:.95rem;
}
.data-table th,.data-table td{
  padding:.75rem 1rem;
  text-align:left;
  border-bottom:1px solid var(--line);
}
.data-table th{
  font-weight:600;
  font-size:.8rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--dim);
  background:#faf9f7;
}
.data-table tr:hover{background:#faf9f7}
.data-table td.num{font-variant-numeric:tabular-nums;white-space:nowrap}

/* Blog index cards */
.post-list{list-style:none;padding:0;margin:2rem 0}
.post-list li{margin-bottom:2rem}
.post-card{
  display:block;
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:1.75rem 2rem;
  border-bottom:1px solid var(--line);
  transition:transform .2s,box-shadow .2s;
}
.post-card:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 20px rgba(0,0,0,.07);
  border-bottom-color:var(--line);
}
.post-card h2{
  font-family:var(--serif);
  font-size:1.35rem;
  margin:0 0 .5rem;
  line-height:1.3;
}
.post-card p{color:var(--muted);font-size:.95rem;margin:0}
.post-card .post-tag{
  display:inline-block;
  font-size:.7rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--dim);
  margin-bottom:.75rem;
  font-weight:600;
}

/* Related links */
.related-links{
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:1.5rem 2rem;
  margin:3rem 0 2rem;
}
.related-links h4{
  font-size:.8rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--dim);
  margin-bottom:1rem;
}
.related-links ul{list-style:none;padding:0;margin:0}
.related-links li{margin-bottom:.75rem}
.related-links a{
  font-weight:500;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.related-links a::after{content:"→";color:var(--dim)}

/* FAQ */
.faq-item{border-bottom:1px solid var(--line);padding:1.25rem 0}
.faq-item h3{margin:0 0 .5rem;font-size:1.05rem}
.faq-item p{margin:0;color:var(--muted);font-size:.95rem}

/* Footer */
.site-footer{
  border-top:1px solid var(--line);
  padding:2rem 1.5rem;
  text-align:center;
  color:var(--dim);
  font-size:.85rem;
}
.site-footer a{color:var(--dim);margin:0 .5rem}
.site-footer a:hover{color:var(--ink)}

@media (max-width:640px){
  h1{font-size:1.8rem}
  h2{font-size:1.35rem}
  .article-container{padding:2rem 1rem 3rem}
  .site-nav{display:none}
  .data-table{font-size:.85rem}
  .data-table th,.data-table td{padding:.6rem .5rem}
}
