:root{
    --bg:#0e0e0d;
    --panel:#171715;
    --paper:#f7efe3;
    --gold:#d6ad63;
    --gold2:#f3d28c;
    --text:#f9f2e6;
    --muted:#bfb29d;
    --ink:#17130d;
    --line:rgba(214,173,99,.22);
    --shadow:0 24px 70px rgba(0,0,0,.35);
    --font:Inter,Arial,sans-serif;
    --serif:Georgia,'Times New Roman',serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
    font-family:var(--font);
    background:
        radial-gradient(circle at 20% 0%, rgba(214,173,99,.16), transparent 34%),
        linear-gradient(180deg,#0e0e0d,#151310 52%,#090909);
    color:var(--text);
    line-height:1.75;
}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{width:min(1180px,calc(100% - 36px));margin:auto}
.topline{background:#080808;border-bottom:1px solid var(--line);color:var(--muted);font-size:13px}
.topline .container{display:flex;justify-content:space-between;gap:18px;padding:8px 0}
.header{position:sticky;top:0;z-index:30;background:rgba(14,14,13,.86);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 0}
.logo img{height:54px}
.nav{display:flex;gap:22px;align-items:center;font-weight:800;font-size:14px;color:#f6e6c8}
.nav a:hover{color:var(--gold2)}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:12px 22px;font-weight:900;border:1px solid var(--line);transition:.25s}
.btn.gold{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#1b1207;border:0}
.btn.dark{background:#161616;color:#fff}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 44px rgba(214,173,99,.18)}
.hero{padding:60px 0 36px}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:stretch}
.hero-main{
    border:1px solid var(--line);
    border-radius:36px;
    min-height:560px;
    background:url('/assets/blog-hero.svg') center/cover no-repeat;
    padding:42px;
    display:flex;
    flex-direction:column;
    justify-content:end;
    position:relative;
    overflow:hidden;
    box-shadow:var(--shadow);
}
.hero-main:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.72))}
.hero-main>*{position:relative;z-index:1}
.kicker{color:var(--gold2);letter-spacing:3px;font-size:12px;font-weight:1000;text-transform:uppercase;margin-bottom:14px}
h1,h2,h3{font-family:var(--serif);line-height:1.08}
h1{font-size:clamp(42px,6vw,76px);letter-spacing:-2px;max-width:860px;margin-bottom:18px}
.lead{font-size:18px;color:#eadcc7;max-width:780px}
.hero-side{display:grid;gap:18px}
.side-card{
    background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));
    border:1px solid var(--line);
    border-radius:30px;
    overflow:hidden;
    box-shadow:0 18px 52px rgba(0,0,0,.22);
}
.side-card img{height:220px;width:100%;object-fit:cover}
.side-card div{padding:22px}
.side-card h3{font-size:27px;margin-bottom:8px}
.side-card p{color:var(--muted)}
section{padding:58px 0}
.section-head{display:flex;justify-content:space-between;gap:28px;align-items:end;margin-bottom:28px}
.section-head h2{font-size:44px}
.section-head p{max-width:560px;color:var(--muted)}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.post{
    background:var(--paper);
    color:var(--ink);
    border-radius:30px;
    overflow:hidden;
    box-shadow:0 20px 54px rgba(0,0,0,.24);
}
.post img{height:235px;width:100%;object-fit:cover}
.post-body{padding:24px}
.post .tag{display:inline-flex;background:#17130d;color:var(--gold2);border-radius:999px;padding:6px 12px;font-size:12px;font-weight:900;margin-bottom:12px}
.post h3{font-size:28px;margin-bottom:10px}
.post p{color:#655948}
.video-row{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.video-card{
    background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.025));
    border:1px solid var(--line);
    border-radius:32px;
    overflow:hidden;
    box-shadow:var(--shadow);
}
.video-card video{
    width:100%;
    height:240px;
    object-fit:cover;
    display:block;
    background:#000;
}
.video-text{padding:22px}
.video-text h3{font-size:29px;margin-bottom:8px;color:#fff}
.video-text p{color:var(--muted)}
.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:28px}
.panel{
    background:rgba(255,255,255,.055);
    border:1px solid var(--line);
    border-radius:34px;
    padding:32px;
}
.panel.light{background:var(--paper);color:var(--ink)}
.panel p{color:var(--muted)}
.panel.light p{color:#695d4d}
.keyword-cloud{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.keyword-cloud span{border:1px solid var(--line);border-radius:999px;padding:8px 13px;color:#f7dec0;background:rgba(255,255,255,.04);font-weight:800;font-size:13px}
.faq{display:grid;gap:12px}
.faq details{background:rgba(255,255,255,.055);border:1px solid var(--line);border-radius:20px;padding:18px}
.faq summary{font-weight:1000;cursor:pointer}
.faq p{margin-top:10px;color:var(--muted)}
.footer{background:#070707;border-top:1px solid var(--line);padding:42px 0;color:var(--muted)}
.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:28px}
.footer h4{color:#fff;margin-bottom:10px}
.footer a{display:block;color:var(--muted);margin:7px 0}
.footer a:hover{color:var(--gold2)}
@media(max-width:920px){.hero-grid,.split,.video-row,.footer-grid{grid-template-columns:1fr}.nav{display:none}.posts{grid-template-columns:1fr 1fr}.hero-main{min-height:460px}}
@media(max-width:560px){.topline .container,.section-head{display:block}.posts{grid-template-columns:1fr}.hero-main{min-height:430px;padding:28px}.side-card img{height:190px}.video-card video{height:205px}}