/* ============================================================
   svitlychnavoice.com — custom header
   1) Logo +20% at top of page
   2) Header is ALWAYS fixed and continuously visible (no disappear/fly-in)
   3) On scroll it smoothly compacts: solid background + the logo scales
      back down to its original size. Mirrors foxnomad-style behaviour.
   Loaded after main-style.
   ============================================================ */

/* --- Header: fixed & always visible. Transparent at top (over the hero),
       solid + compact once scrolled. Smooth transitions, no removal from view. --- */
.bg-wrap > header,
header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background: transparent;
  transition: padding .30s ease, background-color .30s ease, box-shadow .30s ease;
}

.bg-wrap > header.snv-scrolled,
header.snv-scrolled {
  padding: 12px 0;                                /* compact (theme default is 50px 0) */
  background-color: #fff9f5;                      /* opaque warm white = white + theme's 5% orange */
  box-shadow: 0 2px 14px rgba(9, 21, 61, 0.08);
}

/* --- Logo: +20% at top, animates back to original size when scrolled --- */
.logo img {
  transition: transform .30s ease;
  transform-origin: left center;
  will-change: transform;
}
.logo img { height: 60px; }                                   /* base: was 50px (+20%) */
@media (min-width: 767px) and (max-width: 991px) { .logo img { height: 54px; } } /* was 45 */
@media (min-width: 481px) and (max-width: 766px) { .logo img { height: 54px; } } /* was 45 */
@media (min-width: 320px) and (max-width: 480px) { .logo img { height: 48px; } } /* was 40 */

/* 60→50, 54→45, 48→40 all equal scale(0.8333): logo returns to its original size */
header.snv-scrolled .logo img { transform: scale(0.83333); }

/* Vertically center the logo + nav within the header row (both states).
   The theme's row uses align-items:stretch, and the <ul> keeps its default
   margin, so the menu text sat off-centre — most visible in the compact bar. */
.bg-wrap > header .block.df.jb,
header .block.df.jb {
  align-items: center;
}
.logo { display: inline-flex; align-items: center; }   /* kill inline-img baseline gap */
.logo img { display: block; }
.header-nav-menu { margin: 0; }                          /* drop default <ul> vertical margin */

/* Spacer (injected by JS) reserves the header's at-top height so content
   starts below the fixed header and never jumps. */
.header-sticky-spacer { width: 100%; pointer-events: none; }