:root{--bg:#f6f5f2;--card:#ffffff;--fg:#161616;--muted:#6b6b6b;--accent:#ff3b30;--accent2:#ff9500;--line:#ececec}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
background:var(--bg);color:var(--fg);line-height:1.55}

.site-header{background:var(--fg);padding:22px 16px;text-align:center;position:relative;overflow:hidden}
.site-header:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;
background:linear-gradient(90deg,var(--accent),var(--accent2))}
.site-header a{text-decoration:none;color:#fff}
.site-header h1{margin:0;font-size:1.5rem;font-weight:800;letter-spacing:.5px}
.site-header .tagline{color:#bbb;font-size:.75rem;margin-top:4px;letter-spacing:1px;text-transform:uppercase}

.hero{position:relative;height:260px;overflow:hidden}
.hero img{width:100%;height:100%;object-fit:cover;object-position:center 60%;display:block}
.hero:after{content:"";position:absolute;inset:0;
background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.75) 100%)}
.hero-text{position:absolute;left:0;right:0;bottom:14px;text-align:center;z-index:2;text-decoration:none}
.hero-text h1{margin:0;font-size:1.55rem;font-weight:900;color:#fff;letter-spacing:.5px;
text-shadow:0 2px 8px rgba(0,0,0,.4)}
.hero-text .tagline{color:rgba(255,255,255,.9);font-size:.72rem;margin-top:4px;
letter-spacing:1.5px;text-transform:uppercase}
.hero-bar{position:absolute;top:0;left:0;right:0;height:4px;
background:linear-gradient(90deg,var(--accent),var(--accent2));z-index:2}

main{max-width:680px;margin:0 auto;padding:20px 16px 40px}

.hero-label{display:inline-flex;align-items:center;gap:6px;background:var(--accent);color:#fff;
font-size:.72rem;font-weight:700;padding:4px 10px;border-radius:20px;text-transform:uppercase;
letter-spacing:.5px;margin-bottom:12px}
.hero-label:before{content:"";width:7px;height:7px;border-radius:50%;background:#fff;display:inline-block}

article{background:var(--card);border-radius:18px;padding:22px 20px 10px;margin-bottom:20px;
box-shadow:0 1px 3px rgba(0,0,0,.06),0 8px 24px rgba(0,0,0,.04)}
article h2{display:flex;align-items:center;gap:8px;font-weight:800;font-size:1.05rem;
margin:1.2em 0 .3em;color:var(--fg)}
article h2:first-of-type{margin-top:0}
article p{margin:.4em 0;color:#333}
.meta{color:var(--muted);font-size:.8rem;margin:0 0 14px;font-weight:600}

main>h2{font-size:.95rem;font-weight:800;margin:26px 0 10px;color:var(--fg)}
.archive{list-style:none;padding:0;margin:0}
.archive li{background:var(--card);border-radius:12px;padding:12px 16px;margin-bottom:8px;
box-shadow:0 1px 2px rgba(0,0,0,.05)}
.archive a{color:var(--fg);text-decoration:none;font-weight:600;font-size:.9rem}
.archive a:hover{color:var(--accent)}

.back{display:inline-block;margin:0 0 16px;color:var(--accent);text-decoration:none;font-weight:600}
.ad{margin:20px 0;min-height:90px}
.wa-share{display:inline-flex;align-items:center;gap:8px;margin:10px 0 16px;padding:11px 18px;
border-radius:24px;background:#25d366;color:#06331b;font-weight:700;text-decoration:none;font-size:.9rem}
.wa-share:hover{background:#1ebe5b}
.coffee-btn{display:inline-flex;align-items:center;gap:8px;margin:0 0 16px 8px;padding:11px 18px;
border-radius:24px;background:#ffdd00;color:#1a1a1a;font-weight:700;text-decoration:none;font-size:.9rem}
.coffee-btn:hover{background:#f0d000}
.site-footer{text-align:center;color:var(--muted);font-size:.78rem;padding:26px 16px}
.site-footer a{color:var(--fg)}