:root{
  --bg:#FFFFFF;
  --bg-alt:#F5F5F5;
  --text:#0A0A0A;
  --text-dim:#5C5C5C;
  --line: rgba(10,10,10,0.14);
  --line-strong: rgba(10,10,10,0.28);
  --red:#E31C25;
}
*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Inter', sans-serif;
  font-size:17px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
a{ color:var(--red); text-decoration:none; }
a:hover{ text-decoration:underline; }
img{ max-width:100%; display:block; }
.wrap{ max-width:760px; margin:0 auto; padding:0 24px; }
.wrap-wide{ max-width:1100px; margin:0 auto; padding:0 24px; }

.display{
  font-family:'Archivo', sans-serif;
  font-weight:800;
  letter-spacing:-0.01em;
  line-height:1.05;
}

/* header */
header{ border-bottom:1px solid var(--line); }
nav.wrap-wide{
  display:flex; align-items:center; justify-content:space-between;
  height:78px;
}
.wordmark{
  font-family:'Archivo', sans-serif;
  font-weight:900;
  font-size:20px;
  color:var(--red);
  text-transform:uppercase;
}
.navlinks{ display:flex; gap:8px; align-items:center; }
.navlinks a{
  color:var(--text-dim);
  font-size:13px; letter-spacing:0.04em; text-transform:uppercase;
  padding:8px 16px;
}
.navlinks a:hover{ color:var(--text); text-decoration:none; }
.navlinks .cta{
  border:1px solid var(--text); color:var(--text);
}
.navlinks .cta:hover{ background:var(--text); color:var(--bg); }

/* breadcrumb */
.breadcrumb{
  font-size:12.5px; color:var(--text-dim); letter-spacing:0.03em;
  padding:28px 0 0;
}
.breadcrumb a{ color:var(--text-dim); }
.breadcrumb a:hover{ color:var(--red); }

/* article header */
.article-head{ padding:20px 0 40px; border-bottom:1px solid var(--line); margin-bottom:40px; }
.eyebrow{
  font-size:11px; letter-spacing:0.18em; text-transform:uppercase;
  color:var(--red); font-weight:700; margin-bottom:14px; display:block;
}
.article-head h1{ font-size:clamp(30px, 5vw, 46px); margin-bottom:16px; }
.meta{ font-size:13px; color:var(--text-dim); }

/* article body */
article h2{
  font-family:'Archivo', sans-serif; font-weight:800;
  font-size:26px; margin:44px 0 16px; letter-spacing:-0.01em;
}
article h3{
  font-family:'Archivo', sans-serif; font-weight:700;
  font-size:20px; margin:30px 0 12px;
}
article p{ margin-bottom:20px; color:var(--text); }
article ul, article ol{ margin:0 0 20px 22px; }
article li{ margin-bottom:10px; }
article strong{ font-weight:600; }
article blockquote{
  border-left:3px solid var(--red);
  padding:4px 0 4px 20px;
  margin:28px 0;
  color:var(--text-dim);
  font-style:italic;
}

/* CTA box */
.cta-box{
  background:#0A0A0A;
  color:#FFFFFF;
  padding:40px 36px;
  margin:56px 0 48px;
  text-align:center;
}
.cta-box h3{
  font-family:'Archivo', sans-serif; font-weight:800;
  color:#FFFFFF; font-size:24px; margin-bottom:12px;
}
.cta-box p{ color:#B0B0B0; margin-bottom:22px; }
.cta-box a.btn{
  display:inline-block;
  background:var(--red); color:#FFFFFF;
  padding:14px 30px;
  font-size:13px; letter-spacing:0.06em; text-transform:uppercase; font-weight:700;
  text-decoration:none;
}
.cta-box a.btn:hover{ opacity:0.88; text-decoration:none; }

/* related posts */
.related{ border-top:1px solid var(--line); padding-top:36px; margin-top:20px; }
.related h3{ font-size:14px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-dim); margin-bottom:20px; font-weight:600; font-family:'Inter',sans-serif; }
.related-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media (max-width:600px){ .related-grid{ grid-template-columns:1fr; } }
.related-card{ border:1px solid var(--line); padding:20px; }
.related-card a{ color:var(--text); font-weight:600; font-size:15px; }
.related-card a:hover{ color:var(--red); text-decoration:none; }

/* blog index */
.blog-hero{ padding:64px 0 40px; border-bottom:1px solid var(--line); }
.blog-hero .eyebrow{ margin-bottom:16px; }
.blog-hero h1{ font-size:clamp(34px, 6vw, 56px); }
.blog-hero p{ color:var(--text-dim); margin-top:16px; max-width:520px; font-size:16px; }

.post-list{ padding:48px 0 80px; }
.post-card{
  display:block;
  padding:32px 0;
  border-bottom:1px solid var(--line);
}
.post-card:hover .post-title{ color:var(--red); }
.post-card .post-tag{ font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--red); font-weight:700; }
.post-title{
  font-family:'Archivo', sans-serif; font-weight:800; font-size:24px;
  color:var(--text); margin:10px 0 10px; transition:color .2s ease;
}
.post-excerpt{ color:var(--text-dim); font-size:15px; max-width:640px; }
.post-meta{ font-size:12.5px; color:var(--text-dim); margin-top:12px; }

/* footer */
footer{ border-top:1px solid var(--line); padding:44px 0; }
.footer-note{ font-size:12px; color:var(--text-dim); max-width:640px; line-height:1.6; }
.footer-links{ display:flex; gap:20px; margin-top:16px; flex-wrap:wrap; }
.footer-links a{ font-size:12.5px; color:var(--text-dim); text-transform:uppercase; letter-spacing:0.05em; }
.footer-links a:hover{ color:var(--red); }

article-wrap{ padding-bottom:60px; }