/* ============================================================================
   site-header.css - THE marketing header. (V01.76)

   One stylesheet for the one header in partials/site-header.php, loaded by all
   three public surfaces. Before V01.76 the header was styled three times: an
   inline <style> block in templates/home.php, a block inside marketing.css for
   the SEO pages, and nothing at all for the legal pages. Those copies drifted.

   Loaded on its own rather than by pulling marketing.css onto the homepage,
   because marketing.css carries the whole SEO page system and would restyle
   the homepage body.
   ========================================================================= */
:root{
  --lb-bg:#f4f1ea; --lb-surface:#fffdf9; --lb-line:#e6e1d6; --lb-line2:#ddd6c7;
  --lb-dark:#20261f; --lb-ink:#3f453d; --lb-item:#4f4a40; --lb-muted:#6f6a5e;
  --lb-faint:#8a857a; --lb-green:#157a52; --lb-green2:#13714b; --lb-soft:#e6f2ea;
}
.skip{position:absolute;left:-9999px;top:0;z-index:200;padding:12px 18px;
  background:var(--lb-dark);color:#fff;border-radius:0 0 10px 0;font-weight:700}
.skip:focus{left:0}

.site-header{position:sticky;top:0;z-index:50;background:var(--lb-surface);
  border-bottom:1px solid var(--lb-line)}
.site-header .container{max-width:1180px;margin:0 auto;padding:0 28px}
.header-row{display:flex;align-items:center;gap:10px;height:76px}

.brand{display:flex;align-items:center;gap:11px;flex:none;text-decoration:none;margin-right:6px}
.brand-mark{width:36px;height:36px;border-radius:12px;background:var(--lb-green);
  display:grid;place-items:center;flex:none}
.brand-mark svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round}
.brand-wm{font:800 19px/1 'Bricolage Grotesque','Unbounded','Plus Jakarta Sans','Manrope',system-ui,sans-serif;
  letter-spacing:-.6px;color:var(--lb-dark);white-space:nowrap}
.brand-wm i{font-style:normal;color:var(--lb-green)}

.desktop-nav{display:flex;align-items:center;gap:2px;margin-left:10px}
.nav-group{position:relative}
.nav-button,.nav-link{display:inline-flex;align-items:center;gap:5px;padding:9px 13px;
  border:0;background:none;border-radius:10px;cursor:pointer;color:var(--lb-ink);
  text-decoration:none;white-space:nowrap;
  font:600 var(--t-nav,13.5px)/1 'Plus Jakarta Sans','Manrope',system-ui,sans-serif}
.nav-button:hover,.nav-link:hover,.nav-link[aria-current]{background:var(--lb-soft);color:var(--lb-green2)}
.nav-group.is-open>.nav-button{background:var(--lb-soft);color:var(--lb-green2)}
.chev{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.6;
  stroke-linecap:round;stroke-linejoin:round}
.nav-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:252px;display:none;
  background:var(--lb-surface);border:1px solid var(--lb-line);border-radius:16px;padding:8px;
  box-shadow:0 18px 40px -18px rgba(32,38,31,.35);z-index:60}
.nav-group.is-open .nav-menu{display:block}
.nav-menu a{display:block;padding:10px 12px;border-radius:10px;color:var(--lb-item);
  text-decoration:none;font:600 13.5px 'Plus Jakarta Sans','Manrope',system-ui,sans-serif}
.nav-menu a:hover,.nav-menu a[aria-current]{background:var(--lb-soft);color:var(--lb-green2)}

.header-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.lang-wrap{position:relative}
.lang-chip{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 12px;
  border:1px solid var(--lb-line);border-radius:11px;background:var(--lb-surface);
  cursor:pointer;color:var(--lb-item);
  font:700 12px 'Plus Jakarta Sans','Manrope',system-ui,sans-serif}
.lang-chip:hover{border-color:var(--lb-green);background:var(--lb-soft);color:var(--lb-green2)}
.lang-chip .code{letter-spacing:.4px}
.lang-chip .chev{width:11px;height:11px;opacity:.7}
.site-header .lang-menu{position:absolute;top:calc(100% + 8px);right:0;width:250px;max-height:328px;
  overflow:auto;display:none;background:var(--lb-surface);border:1px solid var(--lb-line);
  border-radius:16px;padding:8px;box-shadow:0 18px 40px -18px rgba(32,38,31,.35);z-index:70}
.site-header .lang-wrap.is-open .lang-menu{display:block}
.site-header .lang-item{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;
  border-radius:10px;text-decoration:none;color:var(--lb-item);
  font:600 13px 'Plus Jakarta Sans','Manrope',system-ui,sans-serif}
.site-header .lang-item:hover{background:var(--lb-soft);color:var(--lb-green2)}
.site-header .lang-item .lbl{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.site-header .lang-item .cd{font-size:11px;font-weight:700;color:var(--lb-faint);letter-spacing:.4px}
.site-header .lang-item.is-current{background:var(--lb-soft);color:var(--lb-green2)}
.site-header .lang-item.is-current .cd{color:var(--lb-green2)}

.site-header .signin{display:inline-flex;align-items:center;height:44px;padding:0 14px;
  border-radius:11px;color:var(--lb-dark);text-decoration:none;white-space:nowrap;
  font:600 13.5px 'Plus Jakarta Sans','Manrope',system-ui,sans-serif}
.site-header .signin:hover{background:#f0ebe0}
.site-header .btn-primary{display:inline-flex;align-items:center;height:44px;padding:0 18px;
  border-radius:12px;background:var(--lb-green);color:#fff;text-decoration:none;white-space:nowrap;
  font:700 13.5px 'Plus Jakarta Sans','Manrope',system-ui,sans-serif}
.site-header .btn-primary:hover{background:var(--lb-green2)}

.mobile-toggle{display:none;width:44px;height:44px;flex:none;align-items:center;
  justify-content:center;position:relative;border:1px solid var(--lb-line);
  border-radius:11px;background:var(--lb-surface);cursor:pointer}
.mobile-toggle span,.mobile-toggle:before,.mobile-toggle:after{content:'';position:absolute;
  width:18px;height:2px;border-radius:2px;background:var(--lb-dark);transition:.2s}
.mobile-toggle:before{transform:translateY(-6px)}
.mobile-toggle:after{transform:translateY(6px)}
.mobile-toggle[aria-expanded="true"] span{opacity:0}
.mobile-toggle[aria-expanded="true"]:before{transform:rotate(45deg)}
.mobile-toggle[aria-expanded="true"]:after{transform:rotate(-45deg)}

.mobile-nav{display:none;border-top:1px solid var(--lb-line);background:var(--lb-surface);
  max-height:calc(100vh - 64px);overflow:auto}
.mobile-nav.is-open{display:block}
.mobile-nav .container{padding-top:6px;padding-bottom:18px}
.mobile-nav details{border-bottom:1px solid var(--lb-line)}
.mobile-nav summary{display:flex;align-items:center;gap:10px;min-height:52px;cursor:pointer;
  list-style:none;color:var(--lb-dark);
  font:700 14px 'Plus Jakarta Sans','Manrope',system-ui,sans-serif}
.mobile-nav summary::-webkit-details-marker{display:none}
.pm{margin-left:auto;width:14px;height:14px;position:relative;flex:none}
.pm:before,.pm:after{content:'';position:absolute;background:var(--lb-muted);border-radius:2px}
.pm:before{inset:6px 0;height:2px}
.pm:after{inset:0 6px;width:2px}
.mobile-nav details[open] .pm:after{display:none}
.d-sub{padding:2px 0 12px}
.d-sub a{display:block;padding:11px 0 11px 2px;color:var(--lb-item);text-decoration:none;
  font:600 13.5px 'Plus Jakarta Sans','Manrope',system-ui,sans-serif}
.d-link,.d-signin{display:flex;align-items:center;min-height:52px;color:var(--lb-dark);
  text-decoration:none;border-bottom:1px solid var(--lb-line);
  font:700 14px 'Plus Jakarta Sans','Manrope',system-ui,sans-serif}
.d-signin{border-bottom:0}
.site-header .lang-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:4px 0 14px}
.site-header .lang-grid .lang-item{border:1px solid var(--lb-line);min-height:44px}
.site-header .lang-grid .lang-item .cd{display:none}
.site-header .d-cta{display:flex;align-items:center;justify-content:center;min-height:48px;
  margin-top:10px;border-radius:12px;background:var(--lb-green);color:#fff;text-decoration:none;
  padding:0 14px;text-align:center;
  font:700 14px 'Plus Jakarta Sans','Manrope',system-ui,sans-serif}

@media (max-width:1023px){
  .header-row{height:64px}
  .site-header .container{padding:0 16px}
  .desktop-nav{display:none}
  .site-header .signin,.site-header .btn-primary{display:none}
  .mobile-toggle{display:inline-flex}
  .brand-mark{width:32px;height:32px;border-radius:10px}
  .brand-wm{font-size:17px}
  /* (V01.76) The language control is NEVER hidden. marketing.css previously
     carried `.header-actions .language{display:none}` in its 1050px block,
     which removed the only route to another language from every SEO page on
     every phone. It is deleted, not overridden. */
}
@media (max-width:480px){
  .lang-chip{padding:0 10px;gap:6px}
  .brand-wm{font-size:16px}
}

/* ---- flag sprite: 18 rows in langs.php order, 24x18 CSS box, 3x source ----
   Raster, not SVG: the MIT lipis/flag-icons set is 303KB optimised because
   Serbia, Spain, Croatia, Brazil and Albania carry full coats of arms as path
   data, none of which is visible at 24x18. This sprite is 5,557 bytes. */
.flag{display:inline-block;width:24px;height:18px;flex:none;border-radius:3px;
  background-image:url(/assets/flags.png);background-size:24px 324px;
  background-repeat:no-repeat;box-shadow:inset 0 0 0 1px rgba(32,38,31,.14)}
.flag-en{background-position:0 0px}
.flag-es{background-position:0 -18px}
.flag-pl{background-position:0 -36px}
.flag-ro{background-position:0 -54px}
.flag-bg{background-position:0 -72px}
.flag-lt{background-position:0 -90px}
.flag-uk{background-position:0 -108px}
.flag-ru{background-position:0 -126px}
.flag-hu{background-position:0 -144px}
.flag-cs{background-position:0 -162px}
.flag-pt-br{background-position:0 -180px}
.flag-sr{background-position:0 -198px}
.flag-hr{background-position:0 -216px}
.flag-sq{background-position:0 -234px}
.flag-fr{background-position:0 -252px}
.flag-it{background-position:0 -270px}
.flag-tr{background-position:0 -288px}
.flag-el{background-position:0 -306px}
