:root{
    --bg:#FFFFFF;
    --surface:#F4F7F2;
    --surface-2:#EEF3EA;
    --ink:#16261D;
    --ink-soft:#51605A;
    --ink-dim:#86948C;
    --green:#1F6B3B;
    --green-deep:#164F2C;
    --lime:#8DC63F;
    --orange:#F7931E;
    --orange-deep:#E07D0C;
    --line:rgba(22,38,29,.10);
    --line-2:rgba(22,38,29,.16);
    /* dark accent (B beütés) */
    --dk:#0B1611; --dk-2:#14241B; --dk-ink:#F2F7F3; --dk-soft:#B7C7BD; --dk-lime:#9FE870;
    --display:'Cabinet Grotesk','General Sans',system-ui,sans-serif;
    --body:'General Sans',system-ui,-apple-system,sans-serif;
    --radius:20px; --radius-sm:13px;
  }
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--body);background:var(--bg);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px;}

/* ---- UTIL BAR ---- */
.util{height:34px;font-size:12.5px;color:var(--ink-soft);background:rgba(244,247,242,.9);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.5);overflow:hidden;}
.util .wrap{display:flex;align-items:center;justify-content:space-between;height:100%;}
.util-left,.util-right{display:flex;align-items:center;gap:18px;}
.util-item{display:inline-flex;align-items:center;gap:7px;color:var(--ink-soft);transition:color .2s;}
.util-item:hover{color:var(--green);}
.util-item svg{width:13px;height:13px;color:var(--green);}
.util-soc{display:flex;align-items:center;gap:4px;}
.util-soc a{width:24px;height:24px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:var(--ink-soft);transition:color .2s,background .2s;}
.util-soc a:hover{color:#fff;background:var(--green);}
.util-soc a svg{width:12px;height:12px;}

/* ---- LIVE PV BAR (header util) ---- */
.util-live{display:flex;align-items:center;flex:1;min-width:0;justify-content:center;gap:0;font-size:11px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;line-height:1;}
.util-live .sl-item{display:inline-flex;align-items:center;gap:4px;padding:0 7px;border-left:1px solid var(--line);}
.util-live .sl-item:first-child{border-left:0;padding-left:0;}
.util-live .sl-item>svg{width:12px;height:12px;color:var(--green);flex:none;}
.util-live .sl-lbl{color:var(--ink-dim);}
.util-live b{color:var(--green-deep);font-weight:700;font-variant-numeric:tabular-nums;}
.util-live .sl-wx svg{width:14px;height:14px;color:var(--orange);}
.util-live .sl-temp{margin-left:3px;color:var(--ink-soft);}
.util-live .sl-clock b{color:var(--ink);}

/* ---- NAV ---- */
body > header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(12px) saturate(160%);border-bottom:1px solid var(--line);}
nav.main-nav{display:flex;align-items:center;gap:30px;height:76px;}
.logo img{height:40px;width:auto;display:block;}
.nav-links{display:flex;gap:6px;font-size:15px;color:var(--ink-soft);font-weight:500;}
.nav-item{position:relative;}
.nav-item>a,.nav-item>button{position:relative;display:inline-flex;align-items:center;gap:6px;padding:10px 14px;color:var(--ink-soft);background:none;border:none;font-family:var(--body);font-size:15px;font-weight:500;cursor:pointer;transition:color .2s;}
.nav-item>a::after,.nav-item>button::after{content:"";position:absolute;left:14px;right:14px;bottom:4px;height:2px;background:var(--green);border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.7,.2,1);}
.nav-item:hover>a,.nav-item:hover>button,.nav-item.on>a{color:var(--green);}
.nav-item:hover>a::after,.nav-item:hover>button::after,.nav-item.on>a::after{transform:scaleX(1);}
.nav-item .chev{width:12px;height:12px;transition:transform .25s;}
.nav-item:hover .chev{transform:rotate(180deg);}
.mega{position:absolute;top:calc(100%+6px);left:-12px;min-width:480px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 30px 70px -22px rgba(11,22,17,.32),0 8px 22px -14px rgba(11,22,17,.18);padding:18px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .22s,visibility .22s,transform .22s;z-index:60;}
.nav-item:hover .mega,.nav-item:focus-within .mega{opacity:1;visibility:visible;transform:translateY(0);}
.mega::before{content:"";position:absolute;top:-14px;left:0;right:0;height:18px;}
.mega .grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.mega .item{display:flex;gap:12px;padding:12px;border-radius:14px;transition:background .2s,transform .15s;}
.mega .item:hover{background:var(--surface);transform:translateX(2px);}
.mega .item .mi{width:38px;height:38px;border-radius:10px;background:var(--surface-2);color:var(--green);display:flex;align-items:center;justify-content:center;border:1px solid var(--line);flex:none;}
.mega .item.biz-c .mi{background:#FDEFDD;color:var(--orange-deep);border-color:rgba(247,147,30,.22);}
.mega .item.sto-c .mi{background:#EEF3EA;color:var(--green-deep);}
.mega .item .mi svg{width:18px;height:18px;}
.mega .item .t{font-family:var(--display);font-weight:700;font-size:14.5px;color:var(--ink);letter-spacing:-.01em;}
.mega .item .d{font-size:12.5px;color:var(--ink-soft);margin-top:2px;}
.mega-foot{margin-top:10px;padding-top:12px;border-top:1px solid var(--line);font-size:12.5px;color:var(--ink-dim);display:flex;justify-content:space-between;align-items:center;}
.mega-foot a{color:var(--green);font-weight:600;display:inline-flex;align-items:center;gap:5px;}
.mega-foot a svg{width:13px;height:13px;}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:18px;}
.lang{display:flex;gap:11px;font-size:13px;color:var(--ink-dim);align-items:center;}
.lang a.on{color:var(--green);font-weight:600;}
.lang a:hover{color:var(--ink);}
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--body);font-weight:600;font-size:15px;border:none;cursor:pointer;border-radius:999px;padding:12px 22px;transition:transform .15s,box-shadow .25s,background .2s;}
.btn:hover{transform:translateY(-1px);}
.btn-primary{background:var(--ink);color:#fff;}
.btn-primary:hover{background:var(--green-deep);}
.btn-green{background:var(--green);color:#fff;}
.btn-green:hover{background:var(--green-deep);}
.btn svg{width:16px;height:16px;flex:none;}
.menu-toggle{display:none;background:none;border:1px solid var(--line-2);border-radius:10px;width:44px;height:44px;color:var(--ink);cursor:pointer;align-items:center;justify-content:center;}

/* ---- BREADCRUMB ---- */
.breadcrumb-bar{padding:18px 0 0;font-size:13px;color:var(--ink-dim);}
.breadcrumb-bar a{color:var(--green);transition:opacity .15s;}
.breadcrumb-bar a:hover{opacity:.75;}
.breadcrumb-bar span{margin:0 6px;}

/* ---- ARTICLE / PAGE ---- */
.article-wrap{padding:44px 0 80px;}
.article-header{margin-bottom:36px;padding-bottom:28px;border-bottom:1px solid var(--line);}
.article-kicker{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--green);background:var(--surface-2);border:1px solid var(--line);padding:5px 13px;border-radius:999px;margin-bottom:14px;}
.article-header h1{font-family:var(--display);font-weight:800;letter-spacing:-.02em;line-height:1.07;font-size:clamp(28px,4vw,50px);}
.article-date{font-size:13px;color:var(--ink-dim);margin-top:12px;display:flex;align-items:center;gap:6px;}
.article-date svg{width:14px;height:14px;color:var(--green);}
.article-layout{display:grid;grid-template-columns:1fr 300px;gap:48px;align-items:start;}
.article-body{max-width:none;}
.article-body h2{font-family:var(--display);font-weight:700;font-size:clamp(20px,2.5vw,28px);color:var(--ink);margin:38px 0 14px;letter-spacing:-.01em;}
.article-body h3{font-family:var(--display);font-weight:700;font-size:clamp(17px,2vw,22px);color:var(--ink);margin:28px 0 10px;}
.article-body p{font-size:16.5px;line-height:1.78;color:var(--ink-soft);margin-bottom:20px;}
.article-body ul,.article-body ol{margin:0 0 20px 26px;font-size:16px;color:var(--ink-soft);}
.article-body li{margin-bottom:8px;line-height:1.6;}
.article-body a{color:var(--green);text-decoration:underline;text-decoration-color:rgba(31,107,59,.3);text-underline-offset:2px;}
.article-body a.btn{color:#fff;text-decoration:none;}
.article-body img{max-width:100%;border-radius:var(--radius-sm);margin:28px 0;}
.article-body strong{font-weight:700;color:var(--ink);}
.article-body table{width:100%;border-collapse:collapse;margin:28px 0;font-size:14.5px;}
.article-body td,.article-body th{border:1px solid var(--line);padding:10px 16px;}
.article-body th{background:var(--surface);font-weight:600;font-family:var(--display);}
.article-body blockquote{border-left:3px solid var(--green);margin:28px 0;padding:16px 24px;background:var(--surface);border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-style:italic;color:var(--ink-soft);}
.article-body figure{margin:28px 0;}
.article-body figure img{margin:0;}
.article-body figcaption,.article-body .fig-cap,.article-body .hero-cap{font-size:13px;color:var(--ink-dim);margin-top:8px;font-style:italic;}
.article-body .box{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--green);border-radius:0 var(--radius-sm) var(--radius-sm) 0;padding:18px 22px;margin:26px 0;}
.article-body .box h4{font-family:var(--display);font-weight:700;font-size:16px;color:var(--ink);margin-bottom:10px;}
.article-body .box ul{margin-bottom:0;}
.article-body .pull{border-left:4px solid var(--lime);padding:6px 0 6px 20px;margin:28px 0;font-family:var(--display);font-size:clamp(18px,2.2vw,22px);line-height:1.4;color:var(--green-deep);font-style:italic;}
.article-body .stats{display:flex;gap:14px;margin:26px 0;flex-wrap:wrap;}
.article-body .stat{flex:1;min-width:120px;border:1px solid var(--line);border-top:4px solid var(--green);border-radius:var(--radius-sm);padding:16px 10px;text-align:center;}
.article-body .stat .n{display:block;font-family:var(--display);font-size:26px;font-weight:800;color:var(--green-deep);}
.article-body .stat .l{font-size:11.5px;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.04em;}
.article-body .content-cta{background:var(--green-deep);color:#fff;border-radius:var(--radius);padding:28px;margin:34px 0 6px;}
.article-body .content-cta h3{font-family:var(--display);font-weight:700;font-size:20px;color:#fff;margin-bottom:8px;}
.article-body .content-cta p{color:#dcead9;margin-bottom:14px;}
.article-body .content-cta .c-info{font-size:14px;font-weight:600;color:var(--lime);}

/* ---- SIDEBAR ---- */
.sidebar{position:sticky;top:96px;}
.sidebar-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:24px;margin-bottom:20px;}
.sidebar-card h3{font-family:var(--display);font-weight:700;font-size:17px;margin-bottom:14px;}
.sidebar-cta{background:var(--green);color:#fff;padding:24px;border-radius:var(--radius);}
.sidebar-cta h3{font-family:var(--display);font-weight:700;font-size:18px;margin-bottom:8px;}
.sidebar-cta p{font-size:13.5px;opacity:.85;margin-bottom:18px;}
.sidebar-cta a{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--green);font-weight:700;font-size:14px;padding:10px 20px;border-radius:999px;}

/* ---- EMPTY STATE ---- */
.empty-state{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:56px 36px;text-align:center;margin-top:24px;}
.empty-state .icon{width:56px;height:56px;border-radius:var(--radius-sm);background:var(--surface-2);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;color:var(--green);}
.empty-state h2{font-family:var(--display);font-weight:700;font-size:22px;margin-bottom:10px;}
.empty-state p{color:var(--ink-soft);font-size:15px;max-width:38ch;margin:0 auto 24px;}

/* ---- BLOG LISTING ---- */
.page-hero{padding:52px 0 40px;border-bottom:1px solid var(--line);}
.page-hero h1{font-family:var(--display);font-weight:800;letter-spacing:-.02em;font-size:clamp(30px,4vw,52px);}
.page-hero p{font-size:17px;color:var(--ink-soft);margin-top:10px;max-width:50ch;}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:48px 0 80px;}
.blog-card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;transition:transform .25s,box-shadow .25s;}
.blog-card:hover{transform:translateY(-4px);box-shadow:0 20px 44px -28px rgba(22,38,29,.35);}
.blog-card .card-body{padding:22px;}
.blog-card .card-date{font-size:12px;color:var(--ink-dim);margin-bottom:8px;}
.blog-card h2{font-family:var(--display);font-weight:700;font-size:16.5px;letter-spacing:-.01em;line-height:1.3;color:var(--ink);margin-bottom:10px;}
.blog-card .card-excerpt{font-size:13.5px;color:var(--ink-soft);line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.blog-card .card-link{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:600;color:var(--green);margin-top:14px;}
.blog-card .card-link svg{width:13px;height:13px;transition:transform .2s;}
.blog-card:hover .card-link svg{transform:translateX(3px);}

/* ---- FOOTER ---- */
footer{border-top:1px solid var(--line);padding:28px 0;background:var(--surface);}
.foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;}
.foot-links{display:flex;gap:20px;font-size:13px;color:var(--ink-dim);}
.foot-links a:hover{color:var(--green);}
footer .copy{font-size:13px;color:var(--ink-dim);}
footer .tagline{font-size:12.5px;color:var(--ink-dim);}

/* ---- MOBILE ---- */
@media(max-width:960px){
  .nav-links,.lang{display:none;}
  .menu-toggle{display:flex;}
  /* keep the util bar as a compact live strip on mobile (acum + total + weather + clock).
     fixed height + reserved icon slot so the JS fill never shifts layout (CLS-safe). */
  .util{height:32px;}
  .util .wrap{justify-content:center;height:32px;}
  .util-left,.util-right{display:none;}
  .util-live{font-size:11px;flex:none;}
  .util-live .sl-dt{display:none;}
  .util-live .sl-wx{min-width:32px;justify-content:center;}
  .article-layout{grid-template-columns:1fr;}
  .sidebar{position:static;display:grid;grid-template-columns:1fr 1fr;gap:16px;}
  .blog-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:600px){
  .wrap{padding:0 18px;}
  .blog-grid{grid-template-columns:1fr;}
  .sidebar{grid-template-columns:1fr;}
  .foot{flex-direction:column;text-align:center;gap:8px;}
}
/* Mobile nav drawer */
.mobile-nav{display:none;position:fixed;inset:0;z-index:200;background:rgba(11,22,17,.5);}
.mobile-nav.open{display:block;}
.mobile-nav-inner{position:absolute;top:0;right:0;width:min(340px,90vw);height:100%;background:#fff;overflow-y:auto;padding:24px;animation:slideIn .25s ease;}
@keyframes slideIn{from{transform:translateX(100%)}to{transform:translateX(0)}}
.mobile-nav-inner .close{position:absolute;top:20px;right:20px;background:none;border:1px solid var(--line-2);border-radius:10px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink);}
.mobile-nav-inner .m-links{margin-top:60px;display:flex;flex-direction:column;gap:4px;}
.mobile-nav-inner .m-links a{display:block;padding:12px 14px;border-radius:10px;font-weight:500;font-size:16px;color:var(--ink);transition:background .15s;}
.mobile-nav-inner .m-links a:hover{background:var(--surface);}
.mobile-nav-inner .m-links a.on{color:var(--green);font-weight:700;}
.mobile-nav-inner .m-cta{margin-top:20px;display:flex;flex-direction:column;gap:12px;}
