:root{
  --bg:#f4f7f2;
  --surface:#ffffff;
  --surface-soft:#eef4ef;
  --text:#17372d;
  --muted:#68786f;
  --line:#d9e4dc;
  --green:#073f2d;
  --green-2:#0b5b40;
  --gold:#d9b94e;
  --shadow:0 18px 50px rgba(7,63,45,.09);
  --header-h:64px;
  --sidebar-w:340px;
  --stage-gutter:18px;
}
html[data-theme="dark"]{
  --bg:#0d1814;
  --surface:#13231d;
  --surface-soft:#192d25;
  --text:#edf6f1;
  --muted:#a7bab0;
  --line:#284137;
  --green:#0c4d37;
  --green-2:#159166;
  --gold:#e7c35c;
  --shadow:0 18px 50px rgba(0,0,0,.28);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55;overflow-x:hidden}
a{color:inherit}button,a{font:inherit}
.blog-shell{min-height:100vh}

/* Header: same visual language and proportions as the approved main-site menu. */
.blog-topbar{position:sticky;top:0;z-index:100;background:linear-gradient(180deg,rgba(5,42,30,.99),rgba(5,48,34,.99));border-bottom:1px solid rgba(216,185,93,.22);box-shadow:0 12px 32px rgba(0,0,0,.18);color:#fff;overflow:visible}
.blog-topbar-inner{width:calc(100% - 80px);min-height:var(--header-h);height:var(--header-h);margin:auto;display:flex;align-items:center;gap:clamp(12px,1vw,20px);overflow:visible}
.blog-brand{width:106px;min-width:106px;display:flex;align-items:center;position:relative;z-index:4;text-decoration:none;overflow:visible}
.blog-brand img{width:100px;height:100px;max-width:none;object-fit:contain;display:block;transform:translateY(18px);filter:drop-shadow(0 6px 12px rgba(0,0,0,.28));transition:transform .22s ease}
.blog-brand:hover img{transform:translateY(18px) scale(1.035)}
.blog-categories{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:clamp(5px,.55vw,10px);overflow-x:auto;scrollbar-width:none;padding:0 2px}
.blog-categories::-webkit-scrollbar{display:none}
.blog-category{position:relative;height:40px;min-height:40px;padding:0 clamp(10px,.8vw,16px);border:0;border-radius:13px;background:transparent;color:#f0f4ef;font-size:clamp(11px,.78vw,14px);line-height:1;font-weight:780;white-space:nowrap;cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease}
.blog-category::after{content:"";position:absolute;left:14px;right:14px;bottom:3px;height:3px;border-radius:999px;background:var(--gold);opacity:0;transform:scaleX(.45);transition:.2s ease}
.blog-category:hover,.blog-category:focus-visible{color:#fff8df;background:rgba(216,185,93,.075);transform:translateY(-1px)}
.blog-category:hover::after,.blog-category:focus-visible::after{opacity:1;transform:scaleX(1)}
.blog-category.active{color:#fff9e6;background:linear-gradient(180deg,rgba(216,185,93,.12),rgba(216,185,93,.055));box-shadow:inset 0 0 0 1px rgba(216,185,93,.17),0 8px 20px rgba(0,0,0,.08)}
.blog-category.active::after{opacity:1;transform:scaleX(1)}
.blog-top-actions{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.blog-icon-btn,.blog-lang-current{height:40px;border:1px solid rgba(255,255,255,.28);border-radius:13px;background:rgba(255,255,255,.06);color:#fff;font-weight:900;cursor:pointer}
.blog-icon-btn{width:44px;font-size:17px}.blog-lang-current{min-width:60px;padding:0 13px;font-size:13.5px}
.blog-lang-switch{position:relative;z-index:120}
.blog-lang-menu{display:none;position:absolute;right:0;top:calc(100% + 8px);min-width:170px;padding:8px;border-radius:14px;background:#fff;border:1px solid rgba(8,61,44,.10);box-shadow:0 20px 48px rgba(0,0,0,.28)}
.blog-lang-switch.open .blog-lang-menu{display:grid;gap:2px}
.blog-lang-menu a{display:flex;align-items:center;min-height:42px;padding:10px 12px;border-radius:9px;color:#173126;text-decoration:none;font-size:14px;font-weight:800}
.blog-lang-menu a:hover,.blog-lang-menu a.active{background:#edf4f0}

/* Sidebar begins directly below the menu and uses hidden scrolling. */
.blog-layout{display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr);align-items:start;min-height:calc(100vh - var(--header-h));transition:grid-template-columns .24s ease}
.blog-sidebar{position:sticky;top:var(--header-h);height:calc(100vh - var(--header-h));min-height:0;background:var(--surface);border-right:1px solid var(--line);box-shadow:12px 0 35px rgba(7,63,45,.07);display:flex;flex-direction:column;z-index:40;transition:transform .24s ease,opacity .2s ease}
.blog-sidebar-head{min-height:76px;padding:16px 14px 14px 22px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}
.blog-sidebar-head>div{min-width:0}.blog-sidebar-head h2{font-size:18px;margin:0}.blog-sidebar-head span{display:block;margin-top:3px;font-size:10.5px;color:var(--muted);font-weight:800}
.blog-sidebar-dock-toggle{width:34px;height:34px;border:1px solid var(--line);border-radius:10px;background:var(--surface-soft);color:var(--green-2);font-size:24px;line-height:1;cursor:pointer}
.blog-article-list{flex:1;min-height:0;overflow-y:auto;padding:9px;scrollbar-width:none;-ms-overflow-style:none}
.blog-article-list::-webkit-scrollbar{display:none;width:0;height:0}
.blog-list-item{width:100%;display:grid;grid-template-columns:84px minmax(0,1fr);gap:11px;text-align:left;text-decoration:none;border:1px solid transparent;background:transparent;color:var(--text);padding:8px;border-radius:14px;transition:.18s ease}
.blog-list-item:hover{background:var(--surface-soft)}
.blog-list-item.active{background:var(--surface-soft);border-color:var(--line)}
.blog-list-item img{width:84px;height:72px;border-radius:10px;object-fit:cover;background:var(--surface-soft)}
.blog-list-item small{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--green-2);margin-bottom:4px}
.blog-list-item strong{font-size:13px;line-height:1.25;display:block}
.blog-list-item time{display:block;margin-top:6px;font-size:10px;color:var(--muted)}
.blog-sidebar-open-tab{display:none;position:fixed;left:0;top:calc(var(--header-h) + 18px);z-index:80;width:34px;height:56px;border:1px solid var(--line);border-left:0;border-radius:0 12px 12px 0;background:var(--surface);color:var(--green-2);box-shadow:8px 10px 24px rgba(0,0,0,.12);font-size:25px;cursor:pointer}
.sidebar-collapsed .blog-layout{grid-template-columns:0 minmax(0,1fr)}
.sidebar-collapsed .blog-sidebar{transform:translateX(-100%);opacity:0;pointer-events:none}
.sidebar-collapsed .blog-sidebar-open-tab{display:block}

/* Full-width stage: use all available space, only a slim safety gutter remains. */
.blog-stage{min-width:0;width:100%;padding-bottom:64px}
.blog-hero{width:100%;background:linear-gradient(135deg,#e7f3eb 0%,#f7f2df 55%,#f4f7f2 100%);border-bottom:1px solid var(--line)}
html[data-theme="dark"] .blog-hero{background:linear-gradient(135deg,#11271f 0%,#302a18 55%,#0d1814 100%)}
.blog-hero-inner{width:auto;max-width:none;margin:0 var(--stage-gutter);padding:42px 0 34px;display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:30px;align-items:end}
.blog-kicker{font-size:12px;font-weight:900;letter-spacing:.13em;text-transform:uppercase;color:var(--green-2);margin-bottom:10px}
.blog-hero h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(42px,5vw,70px);line-height:.98;margin:0;letter-spacing:-.045em}
.blog-hero p{max-width:1100px;margin:16px 0 0;color:var(--muted);font-size:17px}
.blog-hero-stat{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:var(--shadow)}
.blog-hero-stat strong{display:block;font-size:26px;color:var(--green-2)}.blog-hero-stat span{font-size:12px;color:var(--muted)}
.blog-content{width:auto;max-width:none;margin:20px var(--stage-gutter) 0;min-width:0;scroll-margin-top:82px}
.blog-article{width:100%;background:var(--surface);border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:var(--shadow)}
.blog-cover{position:relative;display:block;width:100%;aspect-ratio:16/6.4;overflow:hidden;background:var(--surface-soft);text-decoration:none}
.blog-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.blog-cover:hover img{transform:scale(1.012)}
.blog-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 38%,rgba(0,0,0,.48));pointer-events:none}
.blog-cover-label{position:absolute;left:24px;bottom:20px;z-index:2;color:#fff;background:rgba(7,63,45,.88);border:1px solid rgba(255,255,255,.2);padding:8px 12px;border-radius:999px;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.blog-article-inner{padding:clamp(28px,3.2vw,52px)}
.blog-meta{display:flex;align-items:center;gap:9px;flex-wrap:wrap;color:var(--muted);font-size:12px;font-weight:700;margin-bottom:12px}.blog-dot{width:4px;height:4px;background:var(--gold);border-radius:50%}
.blog-article h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(34px,4vw,60px);line-height:1.04;letter-spacing:-.035em;margin:0;max-width:1250px}
.blog-lead{font-size:20px;line-height:1.65;color:var(--muted);margin:20px 0 30px;max-width:1200px}
.blog-body{font-size:17px;line-height:1.82;max-width:1180px}.blog-body h3{font-family:Georgia,"Times New Roman",serif;font-size:27px;line-height:1.15;margin:36px 0 12px;color:var(--green-2)}.blog-body p{margin:0 0 20px}
.blog-body a{color:var(--green-2);font-weight:800;text-decoration-thickness:1.5px;text-underline-offset:3px}.blog-body a:hover{color:var(--text)}
.blog-quote{margin:30px 0;padding:22px 24px;border-left:4px solid var(--gold);background:var(--surface-soft);border-radius:0 16px 16px 0;font-size:18px;font-weight:700}
.blog-gallery{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:32px 0}.blog-gallery figure{margin:0}.blog-gallery img{width:100%;height:300px;object-fit:cover;border-radius:15px;background:var(--surface-soft);display:block}
.blog-article-nav{margin-top:42px;padding-top:24px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:16px}.blog-article-nav a{display:flex;align-items:center;min-height:54px;padding:12px 15px;border:1px solid var(--line);border-radius:14px;background:var(--surface-soft);color:var(--text);font-size:13px;font-weight:850;text-decoration:none}.blog-article-nav a:last-child{text-align:right;justify-content:flex-end}.blog-article-nav a:hover{border-color:rgba(11,91,64,.35)}
.blog-empty{padding:28px;color:var(--muted);text-align:center}.blog-empty-main{width:auto;margin:40px var(--stage-gutter);background:var(--surface);border:1px solid var(--line);border-radius:18px}
.blog-mobile-list-toggle{display:none}
.blog-site-footer{background:var(--green);color:#ddecdf;padding:28px 14px}.blog-site-footer-inner{width:calc(100% - 36px);max-width:none;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:13px}.blog-site-footer a{color:#fff;font-weight:850}

@media(max-width:1280px){
  .blog-topbar-inner{width:calc(100% - 34px);gap:8px}.blog-brand{width:82px;min-width:82px}.blog-brand img{width:82px;height:82px;transform:translateY(13px)}.blog-brand:hover img{transform:translateY(13px) scale(1.03)}
  .blog-category{padding:0 9px;font-size:11.5px}.blog-icon-btn{width:40px}.blog-lang-current{min-width:54px}
  :root{--sidebar-w:310px;--stage-gutter:14px}
}
@media(max-width:980px){
  .blog-topbar-inner{width:calc(100% - 18px)}.blog-brand{width:56px;min-width:56px}.blog-brand img{width:58px;height:58px;transform:none}.blog-brand:hover img{transform:scale(1.03)}
  .blog-categories{justify-content:flex-start}.blog-category{font-size:11px;padding:0 9px}.blog-icon-btn{display:none}
  .blog-hero-inner{grid-template-columns:1fr}.blog-hero-stat{display:none}
  :root{--sidebar-w:285px;--stage-gutter:12px}
}
@media(max-width:820px){
  :root{--header-h:64px;--stage-gutter:9px}
  .blog-topbar-inner{gap:6px}.blog-brand{width:50px;min-width:50px}.blog-brand img{width:50px;height:50px}.blog-top-actions{gap:5px}.blog-lang-current{min-width:48px;height:40px;padding:0;font-size:12px}.blog-lang-menu{min-width:150px}
  .blog-layout{display:block;min-height:0}.blog-stage{padding-bottom:38px}
  .blog-sidebar{display:none;position:fixed;top:var(--header-h);left:0;bottom:0;width:min(88vw,360px);height:auto;z-index:90;border-right:1px solid var(--line);box-shadow:18px 0 40px rgba(0,0,0,.22)}.blog-sidebar.open{display:flex}.blog-sidebar-dock-toggle,.blog-sidebar-open-tab{display:none!important}
  .blog-mobile-list-toggle{display:block;width:calc(100% - 18px);margin:10px auto 0;min-height:46px;border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:13px;font-weight:900;cursor:pointer}
  .blog-hero-inner{padding:28px 0 24px}.blog-hero h1{font-size:44px}.blog-hero p{font-size:15px}
  .blog-content{margin-top:10px}.blog-cover{aspect-ratio:16/9}.blog-cover-label{left:16px;bottom:14px}.blog-article-inner{padding:23px 18px 28px}.blog-lead{font-size:17px}.blog-body{font-size:15.5px}.blog-gallery{grid-template-columns:1fr 1fr}.blog-gallery img{height:190px}.blog-article-nav{grid-template-columns:1fr}
  .blog-site-footer-inner{display:block;text-align:center}.blog-site-footer-inner div+div{margin-top:8px}
}
@media(max-width:520px){
  .blog-brand{display:none}.blog-category{height:38px;min-height:38px;font-size:10.5px;padding:0 8px}.blog-top-actions{margin-left:auto}.blog-hero h1{font-size:38px}.blog-gallery{grid-template-columns:1fr}.blog-gallery img{height:220px}.blog-list-item{grid-template-columns:72px minmax(0,1fr)}.blog-list-item img{width:72px;height:66px}
}