:root{
  --ink:#1d1a17; --ink-soft:#5f5752; --paper:#fffdf9;
  --accent:#e63d2e; --accent-2:#ffdf5b; --chrome:#e8e3de;
}
*{box-sizing:border-box}
html,body{margin:0; padding:0; background:var(--paper); color:var(--ink)}
a{color:var(--accent)}
.site-header{display:flex; flex-wrap:wrap; align-items:end; gap:12px; padding:18px 20px; border-bottom:1px solid var(--chrome); background:
  linear-gradient(to bottom, #fffdf9 0, #fff 100%)}
.brand{flex:1}
.wordmark{font:900 52px/1 "Archivo", system-ui, sans-serif; letter-spacing:.5px; text-transform:uppercase}
.meta{font:700 12px/1.2 "Archivo"; color:var(--ink-soft); margin-top:6px}
.main-nav a{display:inline-block; padding:10px 12px; font:700 14px "Archivo"; color:var(--ink); text-decoration:none; border-radius:6px}
.main-nav a[aria-current]{background:var(--chrome)}
.main-nav a:hover{background:var(--accent-2)}

.front .cover{display:grid; grid-template-columns: 2fr 1fr; gap:20px; padding:22px 20px 10px}
.cover-img{background:
  linear-gradient(120deg, rgba(230,61,46,.12), rgba(255,223,91,.18)),
  url('assets/cover.jpg') center/cover no-repeat;
  border:8px solid var(--ink); min-height:260px}
.cover-bug{align-self:end; font:700 14px "Archivo"; background:var(--ink); color:var(--accent-2);
  padding:10px 12px; border-radius:6px; box-shadow:4px 4px 0 var(--ink-soft)}

.grid{display:grid; grid-template-columns: 1fr 1fr; gap:20px; padding:10px 20px 28px}
.feature{border:1px solid var(--chrome); border-radius:12px; padding:16px; background:#fff}
.feature h2{font:900 26px/1.1 "Archivo"; margin:0 0 6px}
.dek{font:400 16px/1.5 "Literata"; color:var(--ink-soft)}
.cta{display:inline-block; margin-top:10px; font:700 13px "Archivo"; text-decoration:none; padding:8px 10px; background:var(--accent); color:white; border-radius:8px}
.cta.ghost{background:transparent; border:1px solid var(--ink); color:var(--ink)}

.promo{border:1px dashed var(--ink-soft); border-radius:12px; padding:16px; background:linear-gradient(#fffdf9, #fff)}
.ad-card h3, .classifieds h3{font:900 16px "Archivo"; margin:0 0 8px}

.site-footer{border-top:1px solid var(--chrome); padding:16px 20px; font:12px "Archivo"; color:var(--ink-soft)}

@media (max-width:800px){
  .front .cover{grid-template-columns: 1fr}
  .grid{grid-template-columns: 1fr}
  .wordmark{font-size:40px}
}