
:root{--bg:#0d0b1a;--bg2:#15122b;--card:#1b1738;--acc:#e8b94a;--acc2:#c9922a;--text:#ece8f6;--mut:#a39cc0;--line:rgba(255,255,255,.09);--bt:#2a1a00}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:'Inter',system-ui,sans-serif;line-height:1.7;font-size:17px}
h1,h2,h3,.logo{font-family:'Cinzel',serif;line-height:1.25}
a{color:var(--acc)}
.wrap{max-width:1120px;margin:0 auto;padding:0 1.4rem}
nav{display:flex;justify-content:space-between;align-items:center;padding:1.1rem 0;gap:1rem}
nav .logo{font-weight:700;font-size:1.15rem;color:var(--acc);text-decoration:none}
nav .links{display:flex;gap:1.3rem;font-size:.92rem} nav .links a{color:var(--mut);text-decoration:none} nav .links a:hover{color:var(--text)}
.pill{display:inline-block;font-size:.75rem;font-weight:700;padding:.3rem .8rem;border-radius:999px;color:var(--acc);border:1px solid var(--acc);opacity:.95}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:2.5rem;align-items:center;padding:2.5rem 0 3.5rem}
.hero h1{font-size:clamp(2rem,4.6vw,3.3rem);margin:1rem 0} .hero h1 span{color:var(--acc)}
.hero p{color:var(--mut);font-size:1.08rem;max-width:34rem}
.hero img{width:100%;border-radius:1.1rem;border:1px solid var(--line);box-shadow:0 30px 60px -25px rgba(0,0,0,.6)}
.btn{display:inline-block;background:var(--acc);color:var(--bt);font-weight:700;padding:.8rem 1.4rem;border-radius:.7rem;text-decoration:none;transition:.2s} .btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.btn.ghost{background:transparent;color:var(--text);border:1px solid var(--line)}
.row{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.6rem}
section{padding:1.5rem 0 3rem} section>h2{font-size:1.8rem;margin-bottom:.3rem} .sub{color:var(--mut);margin-bottom:1.8rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.3rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:1rem;overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:.25s}
.card:hover{transform:translateY(-4px);border-color:var(--acc)}
.card img{width:100%;height:11rem;object-fit:cover;display:block}
.card .b{padding:1.1rem 1.2rem 1.3rem;display:flex;flex-direction:column;flex:1}
.tag{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--acc)}
.card h3{font-size:1.08rem;margin:.35rem 0 .45rem} .card p{color:var(--mut);font-size:.9rem;flex:1} .card .more{margin-top:.8rem;font-weight:700;font-size:.85rem;color:var(--acc)}
.prod{background:var(--card);border:1px solid var(--line);border-radius:1rem;overflow:hidden;display:flex;flex-direction:column}
.prod img{width:100%;height:9.5rem;object-fit:cover} .prod .b{padding:1rem 1.1rem 1.2rem;display:flex;flex-direction:column;flex:1} .prod p{color:var(--mut);font-size:.88rem;flex:1;margin:.3rem 0 .9rem}
.about{background:var(--bg2);border:1px solid var(--line);border-radius:1.1rem;padding:2rem} .about p{color:var(--mut);margin-top:.6rem}
footer{border-top:1px solid var(--line);color:var(--mut);font-size:.82rem;text-align:center;padding:2rem 1rem;margin-top:2rem}
.crumbs{font-size:.85rem;color:var(--mut);margin:.5rem 0 1rem} .crumbs a{color:var(--mut)}
article.post{max-width:760px;margin:0 auto}
article.post h1{font-size:clamp(1.9rem,4vw,2.7rem);margin:.6rem 0 .8rem}
.meta{color:var(--mut);font-size:.88rem;margin-bottom:1.4rem}
.post .heroimg{width:100%;border-radius:1rem;margin:0 0 1.8rem;border:1px solid var(--line);max-height:430px;object-fit:cover}
.post .content h2{font-size:1.55rem;margin:2.2rem 0 .8rem;color:var(--text)}
.post .content h3{font-size:1.2rem;margin:1.6rem 0 .5rem}
.post .content p,.post .content li{margin-bottom:1rem} .post .content ul,.post .content ol{padding-left:1.4rem;margin-bottom:1rem}
.post .content table{width:100%;border-collapse:collapse;margin:1rem 0 1.5rem;font-size:.95rem} .post .content th,.post .content td{border:1px solid var(--line);padding:.55rem .7rem;text-align:left}
.tip{background:var(--bg2);border-left:4px solid var(--acc);padding:1rem 1.2rem;border-radius:.6rem;margin:1.4rem 0} .tip p{margin:0!important}
figure{margin:1.8rem 0} figure img{width:100%;border-radius:.9rem;border:1px solid var(--line)} figcaption{color:var(--mut);font-size:.85rem;margin-top:.4rem;text-align:center}
.prodbox{display:flex;gap:1rem;align-items:center;justify-content:space-between;background:var(--bg2);border:1px solid var(--acc);border-radius:.9rem;padding:1rem 1.2rem;margin:1.6rem 0}
.prodbox p{margin:.2rem 0 0!important;color:var(--mut);font-size:.92rem} .pk{font-size:.7rem;font-weight:700;text-transform:uppercase;color:var(--acc);letter-spacing:.06em}
.ctaline{text-align:center;margin:1.8rem 0}
.note{font-size:.8rem;color:var(--mut);margin-top:2rem;border-top:1px solid var(--line);padding-top:1rem}
.related{max-width:1120px;margin:3rem auto 0}
@media(max-width:780px){.hero{grid-template-columns:1fr} nav .links{display:none} .prodbox{flex-direction:column;align-items:flex-start}}
