/* The Grad Guide — shared styles
   Plain, fast, no framework/build step — matches the site's own no-nonsense approach.
   Base text kept large/high-contrast throughout (18px+) for readability. */

:root{
  --ink:#1a1f2b;
  --ink-soft:#3d4453;
  --paper:#ffffff;
  --paper-soft:#f6f5f2;
  --accent:#1d4ed8;
  --accent-dark:#15347f;
  --accent-soft:#eef2ff;
  --border:#e2e0d9;
  --good:#0f7a4a;
  --font-body: Georgia, 'Times New Roman', serif;
  --font-head: 'Trebuchet MS', 'Segoe UI', Arial, sans-serif;
  --maxw: 780px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  font-size:18px;
  line-height:1.65;
  color:var(--ink);
  background:var(--paper);
}
img{max-width:100%;}

a{color:var(--accent);}
a:hover{color:var(--accent-dark);}

h1,h2,h3,h4{
  font-family:var(--font-head);
  color:var(--ink);
  line-height:1.25;
}
h1{font-size:2.1rem;margin:0 0 .5em;}
h2{font-size:1.55rem;margin:1.4em 0 .5em;}
h3{font-size:1.2rem;margin:1.2em 0 .4em;}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px;}
.wrap-wide{max-width:1000px;margin:0 auto;padding:0 20px;}

/* Header / nav */
header.site{
  border-bottom:1px solid var(--border);
  background:var(--paper);
}
.nav-row{
  max-width:1000px;
  margin:0 auto;
  padding:16px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.logo{
  font-family:var(--font-head);
  font-weight:700;
  font-size:1.3rem;
  color:var(--ink);
  text-decoration:none;
}
.logo span{color:var(--accent);}
nav.main-links{display:flex;gap:22px;flex-wrap:wrap;font-family:var(--font-head);font-weight:700;font-size:.98rem;}
nav.main-links a{color:var(--ink-soft);text-decoration:none;}
nav.main-links a:hover{color:var(--accent);}

/* Hero */
.hero{
  background:var(--paper-soft);
  border-bottom:1px solid var(--border);
  padding:56px 0 48px;
}
.hero h1{font-size:2.5rem;max-width:14ch;}
.hero p.lede{font-size:1.2rem;color:var(--ink-soft);max-width:56ch;}
.hero .cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:22px;}

.btn{
  display:inline-block;
  font-family:var(--font-head);
  font-weight:700;
  font-size:1.02rem;
  padding:13px 24px;
  border-radius:8px;
  text-decoration:none;
  border:2px solid transparent;
}
.btn-primary{background:var(--accent);color:#fff;}
.btn-primary:hover{background:var(--accent-dark);color:#fff;}
.btn-outline{background:transparent;color:var(--accent);border-color:var(--accent);}
.btn-outline:hover{background:var(--accent-soft);}

/* Section blocks */
section.block{padding:44px 0;}
section.block.alt{background:var(--paper-soft);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}

.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px;margin-top:26px;}
.card{
  background:var(--paper);
  border:1px solid var(--border);
  border-radius:10px;
  padding:22px;
}
.card .eyebrow{font-family:var(--font-head);font-weight:700;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);}
.card h3{margin-top:.3em;}
.card p{color:var(--ink-soft);font-size:1rem;}
.card a.card-link{font-family:var(--font-head);font-weight:700;text-decoration:none;}

/* Email capture box */
.capture-box{
  background:var(--accent-soft);
  border:1px solid #c7d4f7;
  border-radius:12px;
  padding:30px 28px;
  margin:36px 0;
}
.capture-box h3{margin-top:0;}
.capture-box form{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;}
.capture-box input[type=email]{
  flex:1 1 240px;
  font-size:1.05rem;
  padding:12px 14px;
  border-radius:8px;
  border:1px solid var(--border);
  font-family:var(--font-body);
}
.capture-box .fine{font-size:.85rem;color:var(--ink-soft);margin-top:10px;}
.capture-msg{font-family:var(--font-head);font-weight:700;margin-top:10px;}
.capture-msg.ok{color:var(--good);}
.capture-msg.err{color:#a3241f;}

/* Article */
article.post h2{border-top:1px solid var(--border);padding-top:1em;}
.byline{
  font-family:var(--font-head);
  font-size:.95rem;
  color:var(--ink-soft);
  margin:0 0 2em;
  padding-bottom:1.4em;
  border-bottom:1px solid var(--border);
}
.byline strong{color:var(--ink);}
.pull-fact{
  background:var(--paper-soft);
  border-left:4px solid var(--accent);
  padding:16px 20px;
  margin:1.6em 0;
  font-size:1.02rem;
}

/* Paid tier note box */
.upsell-box{
  border:2px solid var(--accent);
  border-radius:12px;
  padding:26px;
  margin:2em 0;
  background:var(--paper);
}
.upsell-box h3{margin-top:0;color:var(--accent-dark);}

/* Footer */
footer.site{
  border-top:1px solid var(--border);
  padding:34px 0 50px;
  color:var(--ink-soft);
  font-size:.95rem;
}
footer.site a{color:var(--ink-soft);}

/* Mobile */
@media (max-width:600px){
  .hero h1{font-size:2rem;}
  .nav-row{flex-direction:column;align-items:flex-start;}
}