:root{
  --black:#1E1E1E; --ink:#1B1A1D; --white:#FFFDF9; --yellow:#FFDE59;
  --blue:#3C5EC4; --violet:#715C81; --red:#CE4949; --green:#396139; --heart:#662229;
  --muted:#6b6a70; --line:rgba(30,30,30,.12);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden}
body{font-family:'Manrope',system-ui,sans-serif;background:var(--white);color:var(--black);line-height:1.6;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;text-size-adjust:100%}
img{display:block;max-width:100%}
a{color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.eyebrow{font-family:'Urbanist',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.14em;font-size:.78rem}
.script{font-family:'Caveat Brush',cursive;font-weight:400;letter-spacing:0}

/* header (matches homepage) */
header{position:sticky;top:0;z-index:50;background:var(--black);color:var(--white)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px;gap:16px}
.logo{display:block;flex:0 0 auto;line-height:0}
.logo img{height:52px;width:auto}
nav ul{display:flex;gap:28px;list-style:none;align-items:center}
nav a{text-decoration:none;font-weight:500;font-size:.95rem;opacity:.85}
nav a:hover,nav a[aria-current]{opacity:1}
nav a[aria-current]{box-shadow:inset 0 -2px 0 var(--yellow)}
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--yellow);color:var(--black);font-weight:800;text-decoration:none;padding:14px 22px;border-radius:2px;font-size:.95rem;transition:transform .15s;text-align:center}
.btn:hover{transform:translateY(-2px)}
nav .btn{padding:10px 16px;opacity:1;box-shadow:none}
.menu-toggle{display:none;background:none;border:1.5px solid rgba(255,253,249,.4);color:var(--white);font:inherit;font-weight:700;font-size:.9rem;cursor:pointer;padding:8px 14px;border-radius:2px}

/* blog masthead */
.masthead{background:var(--black);color:var(--white);padding:72px 0 64px}
.masthead h1{font-family:'Urbanist',sans-serif;font-weight:800;font-size:clamp(3rem,9vw,6rem);letter-spacing:-.05em;line-height:.95;margin-top:14px}
.masthead p{max-width:560px;margin-top:20px;font-size:1.1rem;opacity:.85}
.brand-mark{display:block;width:104px;height:auto}
.masthead .brand-mark{margin-top:36px}

/* post list */
.posts{padding:64px 0 96px}
.post-list{list-style:none;display:grid;gap:0;border-top:2px solid var(--black)}
.post-card{border-bottom:1px solid var(--line)}
.post-card a{display:grid;grid-template-columns:180px 1fr;gap:32px;padding:36px 0;text-decoration:none}
.post-card .meta{font-size:.85rem;color:var(--muted);font-weight:500}
.post-card .meta .tag{display:block;font-family:'Urbanist';font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;color:var(--black);margin-bottom:6px}
.post-card h2{font-family:'Urbanist',sans-serif;font-weight:800;font-size:clamp(1.5rem,3vw,2.1rem);letter-spacing:-.03em;line-height:1.1}
.post-card a:hover h2{text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:4px;text-underline-offset:6px}
.post-card p{margin-top:12px;color:#3a393e;max-width:640px}
.post-card .more{display:inline-block;margin-top:14px;font-weight:800;font-size:.9rem}

/* article */
.article-head{background:var(--black);color:var(--white);padding:56px 0 60px}
.crumbs{font-size:.85rem;opacity:.7}
.crumbs a{text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.article-head .eyebrow{color:var(--yellow);margin-top:28px;display:block}
.article-head h1{font-family:'Urbanist',sans-serif;font-weight:800;font-size:clamp(2.1rem,5.4vw,3.8rem);letter-spacing:-.04em;line-height:1.05;margin-top:14px;max-width:900px}
.byline{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:26px;font-size:.95rem;opacity:.85}
.byline strong{font-weight:800;opacity:1}
.article{padding:56px 0 24px}
.prose{max-width:700px;margin:0 auto;font-size:1.12rem;line-height:1.75;color:#2a292d}
.prose h2{font-family:'Urbanist',sans-serif;font-weight:800;font-size:clamp(1.45rem,3vw,1.9rem);letter-spacing:-.03em;line-height:1.15;color:var(--black);margin:52px 0 16px}
.prose h2:first-child{margin-top:0}
.prose p{margin-top:20px}
.prose h2+p{margin-top:0}
.prose a{color:var(--black);font-weight:600;text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:3px;text-underline-offset:3px}
.prose a:hover{background:rgba(255,222,89,.35)}
.prose strong{color:var(--black)}
.prose blockquote{border-left:6px solid var(--yellow);padding-left:20px;margin:32px 0;font-size:1.3rem;font-weight:700;color:var(--black);line-height:1.35}
.note{max-width:700px;margin:40px auto 0;padding:18px 20px;background:#F5F1E6;font-size:.92rem;color:#4a494e;border-left:4px solid var(--black)}

.cta-box{max-width:700px;margin:56px auto 0;background:var(--black);color:var(--white);padding:40px 36px;position:relative}
.cta-box h2{font-family:'Urbanist',sans-serif;font-weight:800;font-size:clamp(1.6rem,3.4vw,2.2rem);letter-spacing:-.03em;line-height:1.1}
.cta-box p{margin:12px 0 24px;opacity:.85}
.back{max-width:700px;margin:40px auto 96px;font-weight:800}
.back a{text-decoration:none}
.back a:hover{text-decoration:underline}

footer{background:var(--black);color:rgba(255,253,249,.75);padding:56px 0 40px;font-size:.92rem}
.foot{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;align-items:center}
.foot-logo img{width:190px;height:auto}
.foot-links{display:flex;gap:22px;flex-wrap:wrap}
.foot-links a{text-decoration:none;font-weight:600}
.foot-links a:hover{color:var(--yellow)}
.foot small{display:block;margin-top:32px;opacity:.6}

@media (max-width:900px){
  .nav{height:64px}
  .logo img{height:44px}
  .menu-toggle{display:block}
  nav ul{display:none;position:absolute;top:64px;left:0;right:0;background:var(--black);flex-direction:column;align-items:stretch;padding:8px 24px 24px;gap:0;border-top:1px solid rgba(255,253,249,.1);box-shadow:0 16px 30px rgba(0,0,0,.35)}
  nav ul.open{display:flex}
  nav ul li a{display:block;padding:14px 0;font-size:1.05rem;border-bottom:1px solid rgba(255,253,249,.08)}
  nav a[aria-current]{box-shadow:none;color:var(--yellow)}
  nav ul li a.btn{margin-top:16px;padding:14px 22px;border-bottom:0;color:var(--black)}
  .post-card a{grid-template-columns:1fr;gap:10px;padding:28px 0}
}
@media (max-width:560px){
  .wrap{padding:0 20px}
  .masthead{padding:52px 0 48px}
  .article-head{padding:40px 0 44px}
  .prose{font-size:1.06rem}
  .cta-box{padding:32px 24px;margin-left:-20px;margin-right:-20px}
  .cta-box .btn{width:100%}
  .foot{flex-direction:column;align-items:flex-start}
}
/* covers */
.post-cover{max-width:900px;margin:0 auto 48px}
.post-cover img{width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;background:#000}
.post-card .thumb{width:100%;max-width:640px;height:auto;aspect-ratio:1200/630;object-fit:cover;background:#000;margin-bottom:20px}
@media (max-width:560px){.post-cover{margin:0 -20px 36px}}