/* WasteSpot shared public header v3.4.1 */
:root {
  --ws-header-height: 72px;
  --ws-header-max: 1540px;
  --ws-header-ink: #102019;
  --ws-header-ink-soft: #294038;
  --ws-header-muted: #8b9892;
  --ws-header-line: #dbe4dd;
  --ws-header-canvas: #eaf0eb;
  --ws-header-green: #20a261;
  --ws-header-green-dark: #126f42;
  --ws-header-green-soft: #def5e7;
  --ws-header-lime: #dfff68;
  --ws-brand-accent: #9dcd32;
}

.site-header {
  position: sticky;
  z-index: 1100;
  top: 0;
  height: var(--ws-header-height);
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(219, 228, 221, .9);
  color: var(--ws-header-ink);
  background: rgba(255, 255, 255, .92);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

.header-inner {
  width: min(var(--ws-header-max), calc(100% - 40px));
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 27px;
  min-width: 0;
}

.site-header .brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  flex: 0 0 auto;
  color: var(--ws-header-ink);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 21px;
  font-weight: 850;
  line-height: 1;
  letter-spacing: -.045em;
  text-decoration: none;
  white-space: nowrap;
}

.site-header .brand-mark {
  width: 39px;
  height: 39px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}

.site-header .brand-mark img {
  width: 100%;
  height: 100%;
  display: block;
}

.site-header .brand-domain {
  color: var(--ws-brand-accent);
  font-weight: 780;
}

.site-header .main-nav {
  min-width: 0;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 3px;
  margin: 0;
}

.site-header .main-nav a {
  padding: 9px 12px;
  border-radius: 10px;
  color: var(--ws-header-ink-soft);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
  font-weight: 680;
  line-height: 1.3;
  text-decoration: none;
  white-space: nowrap;
}

.site-header .main-nav a:hover,
.site-header .main-nav a:focus-visible,
.site-header .main-nav a[aria-current="page"] {
  color: var(--ws-header-ink);
  background: var(--ws-header-canvas);
}

.site-header .header-actions {
  min-width: 0;
  margin-left: auto;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 9px;
}

.site-header .beta-label {
  display: none;
  padding: 5px 8px;
  color: var(--ws-header-green-dark);
  border: 1px solid #b9e2c9;
  border-radius: 999px;
  background: var(--ws-header-green-soft);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 10px;
  font-weight: 850;
  line-height: 1.3;
  letter-spacing: .07em;
  text-transform: uppercase;
  white-space: nowrap;
}

.site-header .button {
  min-height: 44px;
  padding: 11px 17px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-radius: 13px;
  color: var(--ws-header-ink);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
  font-weight: 780;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.site-header .button:hover { transform: translateY(-1px); }
.site-header .button svg { width: 18px; height: 18px; flex: 0 0 auto; }

.site-header .header-suggest {
  color: var(--ws-header-green);
  border: 1px solid rgba(16, 32, 25, .16);
  background: #fff;
}

.site-header .header-suggest:hover,
.site-header .header-suggest:focus-visible {
  border-color: #a7d9ba;
  box-shadow: 0 8px 24px rgba(16, 32, 25, .08);
}

.site-header .header-report {
  border: 1px solid transparent;
  background: var(--ws-header-lime);
}

.site-header .header-report:hover,
.site-header .header-report:focus-visible {
  box-shadow: 0 10px 28px rgba(153, 188, 48, .24);
}

.site-header .mobile-menu {
  display: none;
  width: 42px;
  height: 42px;
  padding: 0;
  place-items: center;
  border: 1px solid var(--ws-header-line);
  border-radius: 12px;
  color: var(--ws-header-ink);
  background: #fff;
  cursor: pointer;
}

.site-header .mobile-menu:hover,
.site-header .mobile-menu:focus-visible { background: #f5f8f5; }
.site-header .mobile-menu svg { width: 20px; height: 20px; }

@media (max-width: 1800px) {
  .header-inner { gap: 18px; }
  .site-header .main-nav a { padding-inline: 9px; font-size: 13px; }
  .site-header .header-actions { gap: 8px; }
  .site-header .button { padding-inline: 14px; font-size: 13px; }
}

@media (max-width: 1400px) {
  .site-header .main-nav { display: none; }
  .site-header .main-nav.open {
    position: fixed;
    z-index: 1099;
    top: var(--ws-header-height);
    left: 0;
    right: 0;
    display: grid;
    gap: 2px;
    padding: 10px 20px 18px;
    border-bottom: 1px solid var(--ws-header-line);
    background: #fff;
    box-shadow: 0 10px 28px rgba(16, 32, 25, .09);
  }
  .site-header .main-nav.open a {
    width: min(var(--ws-header-max), 100%);
    margin: 0 auto;
    padding: 12px 14px;
  }
  .site-header .mobile-menu { display: grid; }
}

@media (max-width: 1100px) {
  .site-header .header-suggest { display: none; }
}

@media (max-width: 930px) {
  .site-header .beta-label { display: none; }
}

@media (max-width: 680px) {
  :root { --ws-header-height: 64px; }
  .site-header { height: var(--ws-header-height); }
  .header-inner { width: calc(100% - 24px); gap: 10px; }
  .site-header .brand { font-size: 18px; }
  .site-header .brand-mark { width: 35px; height: 35px; }
  .site-header .header-report {
    width: 42px;
    min-width: 42px;
    padding: 0;
  }
  .site-header .header-report svg { width: 19px; height: 19px; }
  .site-header .header-report .header-action-label { display: none; }
  .site-header .main-nav.open { top: var(--ws-header-height); }
}

@media (max-width: 420px) {
  .site-header .brand { gap: 8px; font-size: 17px; }
  .site-header .brand-mark { width: 34px; height: 34px; }
}

/* Scalable language menu v3.4.1 */
.site-header .language-menu {
  position: relative;
  flex: 0 0 auto;
  margin: 0;
}

.site-header .language-menu summary {
  min-width: 64px;
  min-height: 38px;
  padding: 0 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  list-style: none;
  border: 1px solid var(--ws-header-line);
  border-radius: 12px;
  color: var(--ws-header-ink-soft);
  background: #f7f9f7;
  cursor: pointer;
  user-select: none;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.site-header .language-menu summary::-webkit-details-marker { display: none; }
.site-header .language-menu summary::marker { content: ""; }
.site-header .language-menu summary:hover,
.site-header .language-menu summary:focus-visible,
.site-header .language-menu[open] summary {
  border-color: #b9c9be;
  color: var(--ws-header-ink);
  background: #fff;
  box-shadow: 0 8px 24px rgba(16, 32, 25, .08);
  outline: none;
}

.site-header .language-globe { width: 17px; height: 17px; flex: 0 0 auto; }
.site-header .language-current {
  min-width: 20px;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 11px;
  font-weight: 850;
  line-height: 1;
  text-align: center;
}
.site-header .language-chevron {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  transition: transform .18s ease;
}
.site-header .language-menu[open] .language-chevron { transform: rotate(180deg); }

.site-header .language-menu-panel {
  position: absolute;
  z-index: 1200;
  top: calc(100% + 10px);
  right: 0;
  width: 210px;
  padding: 7px;
  border: 1px solid var(--ws-header-line);
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(16, 32, 25, .16);
}

.site-header .language-menu-panel a {
  min-height: 43px;
  padding: 9px 10px;
  display: flex;
  align-items: center;
  gap: 12px;
  border-radius: 10px;
  color: var(--ws-header-ink-soft);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  text-decoration: none;
}
.site-header .language-menu-panel a:hover,
.site-header .language-menu-panel a:focus-visible {
  color: var(--ws-header-ink);
  background: #f1f5f2;
  outline: none;
}
.site-header .language-menu-panel a[aria-current="page"] {
  color: var(--ws-header-ink);
  background: var(--ws-header-green-soft);
}
.site-header .language-name { min-width: 0; flex: 1 1 auto; font-size: 13px; font-weight: 730; }
.site-header .language-code {
  min-width: 30px;
  padding: 4px 6px;
  border-radius: 999px;
  color: var(--ws-header-muted);
  background: #edf1ee;
  font-size: 10px;
  font-weight: 850;
  line-height: 1;
  text-align: center;
}
.site-header .language-menu-panel a[aria-current="page"] .language-code {
  color: #fff;
  background: var(--ws-header-ink);
}

@media (max-width: 680px) {
  .site-header .language-menu summary { min-width: 52px; min-height: 42px; padding: 0 8px; gap: 5px; }
  .site-header .language-globe { width: 16px; height: 16px; }
  .site-header .language-chevron { display: none; }
  .site-header .language-menu-panel { width: min(210px, calc(100vw - 24px)); }
}

@media (max-width: 360px) {
  .site-header .brand-domain { display: none; }
  .site-header .brand { font-size: 16px; }
}
