*{box-sizing:border-box}body{margin:0;line-height:1.6;font-size:17px}img{max-width:100%;display:block;width:100%;height:auto}
a{color:inherit}.wrap{max-width:1180px;margin:0 auto;padding:0 16px}
.bar{display:flex;align-items:center;gap:10px;padding:12px 0;flex-wrap:wrap}.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:1.35rem}.logo svg{width:34px;height:34px}
nav.cats{display:flex;gap:16px;overflow-x:auto;white-space:nowrap;font-size:.92rem;padding-bottom:8px}nav.cats a{text-decoration:none;opacity:.85}
.tag{display:inline-block;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:3px 9px;border-radius:99px;text-decoration:none}
main{padding:20px 0 40px}.grid{display:grid;gap:22px}.cards{display:grid;gap:20px}
.card img{aspect-ratio:4/3;object-fit:cover}.card .in{padding:14px 16px 18px}.card h3{margin:.4em 0;font-size:1.15rem;line-height:1.3}.card p{margin:0;color:var(--mut);font-size:.95rem}.card a{text-decoration:none}
.side ol{padding-left:22px;margin:0}.side li{margin:10px 0}.side a{text-decoration:none}.side h3{margin-top:0}
.sec{font-size:.8rem;text-transform:uppercase;letter-spacing:.12em;color:var(--mut);margin:28px 0 12px}
article.post{max-width:720px;margin:0 auto}article.post h1{font-size:2rem;line-height:1.2}article.post .meta{color:var(--mut);font-size:.9rem}article.post h2{font-size:1.3rem;margin:1.4em 0 .3em}article.post img{border-radius:10px;margin:18px 0}
.page{max-width:720px;margin:0 auto}
footer{padding:28px 0;font-size:.9rem}footer .links{display:flex;flex-wrap:wrap;gap:16px;margin:10px 0}
form input,form textarea{width:100%;padding:10px;margin:6px 0 14px;border:1px solid var(--line);border-radius:8px;font:inherit}
.btn{color:#fff;border:0;padding:12px 22px;border-radius:8px;font:inherit;font-weight:700;cursor:pointer}
@media(min-width:640px){.cards{grid-template-columns:1fr 1fr}.cards:not(.three)>.card:last-child:nth-child(odd){grid-column:1/-1}.cards:not(.three)>.card:last-child:nth-child(odd) img{aspect-ratio:21/9}}.grid.main{align-items:start}
@media(min-width:900px){.grid.main{grid-template-columns:1fr 300px}.cards.three{grid-template-columns:repeat(3,1fr)}}

:root{--ac:#E8553E;--ink:#1F2A44;--bg:#FFF8F4;--soft:#FFE7DC;--mut:#6B7280;--line:#F1D9CE}
body{font-family:"Avenir Next","Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--ink)}
h1,h2,h3,.logo{font-family:"Avenir Next","Segoe UI",Roboto,sans-serif;font-weight:800;letter-spacing:-.02em}
.top{background:#fff;border-bottom:3px solid var(--ac)}
.tag{background:var(--ac);color:#fff}
.hero{position:relative;border-radius:18px;overflow:hidden;color:#fff}
.hero img{aspect-ratio:16/10;object-fit:cover}
.hero .cap{padding:18px 20px;background:var(--ink)}
.hero h1{font-size:1.6rem;margin:.4em 0}
.card{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 2px 10px rgba(31,42,68,.06)}
.side{background:var(--ink);color:#fff;border-radius:14px;padding:18px}
.side a{color:#fff}.side li::marker{color:var(--ac);font-weight:800}
footer{background:var(--ink);color:#fff}footer a{color:#FFD6C2}
.btn{background:var(--ac)}
@media(min-width:900px){.hero h1{font-size:2.6rem}.hero .cap{position:absolute;inset:auto 0 0 0;padding:40px;background:linear-gradient(transparent,rgba(31,42,68,.92))}.hero img{aspect-ratio:21/9}}