.site-header-shell {
  position: fixed;
  z-index: var(--z-120);
  top: 0;
  right: 0;
  left: 0;
  height: var(--jaroni-header-height);
  color: var(--jaroni-dark);
  background: var(--jaroni-white);
  transform: translate3d(0, 0, 0);
  transition: box-shadow .24s ease, transform .3s cubic-bezier(.2, .72, .25, 1);
  will-change: transform;
}
.site-header-shell::after {
  position: absolute;
  z-index: 3;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--jaroni-yellow) 0 34%, var(--jaroni-red) 34% 67%, var(--jaroni-green) 67%);
  content: "";
  pointer-events: none;
}
.site-header-shell.jaroni-header--top { top: 0; box-shadow: none; }
.site-header-shell.jaroni-header--floating { top: 0; box-shadow: 0 11px 28px rgba(6, 17, 11, .13); }
.site-header-shell.jaroni-header--hidden { transform: translate3d(0, calc(-100% - 18px), 0); }

.topbar {
  height: var(--topbar-height);
  color: #4f5a55;
  border-bottom: 1px solid #e8ecea;
  background: #f8f9f8;
}
.topbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-28);
  height: 100%;
  font-size: var(--text-66);
  font-weight: var(--font-weight-620);
}
.topbar__group { display: flex; align-items: center; gap: clamp(13px, 1.8vw, 24px); min-width: 0; }
.topbar__group--right { justify-content: flex-end; }
.topbar__item, .topbar__quick, .topbar__whatsapp { display: inline-flex; align-items: center; gap: var(--space-6); white-space: nowrap; }
.topbar__item > svg { width: 14px; height: 14px; fill: none; stroke: var(--jaroni-green); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.topbar__quick, .topbar__whatsapp { transition: color var(--duration-fast) ease; }
.topbar__quick:hover, .topbar__whatsapp:hover { color: var(--jaroni-green); }
.topbar__separator { width: 1px; height: 14px; background: #dce2df; }
.topbar__social { display: flex; align-items: center; gap: var(--space-4); }
.topbar__social a { display: grid; place-items: center; width: 25px; height: 25px; color: #4d5953; border-radius: var(--radius-3); transition: color var(--duration-fast) ease, background var(--duration-fast) ease; }
.topbar__social a:hover { color: var(--jaroni-green); background: #edf3f0; }
.topbar__social svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.55; }
.jaroni-header--floating .topbar { border-color: #edf0ee; }

.main-header {
  height: var(--main-header-height);
  color: var(--jaroni-dark);
  border-bottom: 1px solid #edf0ee;
  background: var(--jaroni-white);
}
.main-header__inner {
  display: grid;
  grid-template-columns: minmax(188px, 220px) minmax(390px, 760px) minmax(242px, 292px);
  align-items: center;
  justify-content: space-between;
  column-gap: clamp(20px, 2.6vw, 42px);
  height: 100%;
}
.brand { display: inline-flex; align-items: center; justify-self: start; width: fit-content; min-width: 0; color: var(--jaroni-dark); }
.brand img { width: clamp(57px, 4.7vw, 68px); height: clamp(57px, 4.7vw, 68px); flex: 0 0 auto; object-fit: contain; }
.brand__name { display: grid; margin-left: var(--space-9); font-size: clamp(1.04rem, 1.32vw, 1.24rem); font-weight: var(--font-weight-900); letter-spacing: .035em; line-height: 1; }
.brand__name small { margin-top: var(--space-5); color: var(--jaroni-green); font-size: .49rem; letter-spacing: .22em; }
.header-search-slot { width: min(100%, 760px); min-width: 0; justify-self: center; }
.header-actions { display: flex; align-items: center; justify-content: flex-end; gap: var(--space-3); }
.main-header .mobile-menu-toggle, .main-header .search-toggle { display: none; }
.jaroni-header--floating .main-header { border-color: #edf0ee; }

@media (prefers-reduced-motion: reduce) { .site-header-shell { transition-duration: .01ms; } }