/* VILIANTE HEADER FINAL LOCK — must load last */
/* header-final-lock-head-load-v1 */

@media (min-width:1025px){
  body > header.site-header{
    position:fixed!important;
    top:18px!important;
    left:0!important;
    right:0!important;
    z-index:9999!important;
    width:100%!important;
    padding:0 18px!important;
    margin:0!important;
    background:transparent!important;
    pointer-events:none!important;
    font-family:Inter,Manrope,"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif!important;
  }

  body > header.site-header,
  body > header.site-header *{
    box-sizing:border-box!important;
    text-transform:none!important;
    font-style:normal!important;
    text-decoration:none!important;
    -webkit-font-smoothing:antialiased!important;
    text-rendering:geometricPrecision!important;
  }

  body > header.site-header > .container.nav{
    width:min(1180px,calc(100vw - 36px))!important;
    max-width:1180px!important;
    height:88px!important;
    min-height:88px!important;
    margin:0 auto!important;
    padding:0 22px 0 24px!important;
    display:grid!important;
    grid-template-columns:260px 1fr 185px!important;
    align-items:center!important;
    column-gap:18px!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.88)!important;
    border:1px solid rgba(18,32,51,.10)!important;
    box-shadow:0 18px 55px rgba(18,32,51,.11)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    pointer-events:auto!important;
  }

  body > header.site-header .brand,
  body > header.site-header .brand-logo{
    width:260px!important;
    min-width:260px!important;
    max-width:260px!important;
    height:88px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    margin:0!important;
    padding:0!important;
  }

  body > header.site-header .brand img,
  body > header.site-header .brand-logo img{
    height:66px!important;
    max-width:250px!important;
    width:auto!important;
    object-fit:contain!important;
    margin:0!important;
    padding:0!important;
  }

  body > header.site-header .brand-fallback{
    display:none!important;
  }

  body > header.site-header nav.nav-links{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:12px!important;
    width:100%!important;
    height:88px!important;
    margin:0!important;
    padding:0!important;
    transform:translateX(-48px)!important;
  }

  body > header.site-header nav.nav-links a{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:48px!important;
    padding:0 18px!important;
    margin:0!important;
    border-radius:999px!important;
    color:rgba(16,32,55,.78)!important;
    background:transparent!important;
    font-family:Inter,Manrope,"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif!important;
    font-size:18px!important;
    font-weight:700!important;
    line-height:1!important;
    letter-spacing:-.015em!important;
    white-space:nowrap!important;
  }

  body > header.site-header .nav-actions,
  body > header.site-header .nav-account-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:9px!important;
    width:185px!important;
    min-width:185px!important;
    height:88px!important;
    margin:0!important;
    padding:0!important;
  }

  body > header.site-header .header-icon-btn{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:999px!important;
    border:1px solid rgba(18,32,51,.10)!important;
    background:rgba(255,255,255,.68)!important;
    color:#102037!important;
  }

  body > header.site-header .header-login-btn{
    height:42px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 18px!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.62)!important;
    color:#102037!important;
    border:1px solid rgba(18,32,51,.14)!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1!important;
    letter-spacing:-.01em!important;
    white-space:nowrap!important;
  }
}

@media (max-width:1200px) and (min-width:1025px){
  body > header.site-header > .container.nav{
    grid-template-columns:230px 1fr 175px!important;
  }

  body > header.site-header .brand,
  body > header.site-header .brand-logo{
    width:230px!important;
    min-width:230px!important;
  }

  body > header.site-header .brand img,
  body > header.site-header .brand-logo img{
    height:60px!important;
    max-width:225px!important;
  }

  body > header.site-header nav.nav-links{
    transform:translateX(-32px)!important;
  }

  body > header.site-header nav.nav-links a{
    font-size:16px!important;
    padding:0 13px!important;
  }

  body > header.site-header .nav-actions,
  body > header.site-header .nav-account-actions{
    width:175px!important;
    min-width:175px!important;
  }
}

/* VILIANTE DESKTOP HEADER VISUAL MERGED v10 */

@media (min-width:1025px){
  body > header.site-header,
  body > header.site-header *{
    font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif !important;
    font-synthesis:none !important;
    -webkit-font-smoothing:antialiased !important;
    -moz-osx-font-smoothing:grayscale !important;
    text-rendering:auto !important;
  }

  body > header.site-header nav.nav-links a{
    font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif !important;
    font-size:19px !important;
    font-weight:700 !important;
    letter-spacing:-.012em !important;
    padding:0 19px !important;
    color:rgba(10,24,43,.90) !important;
  }

  body > header.site-header .header-login-btn{
    font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif !important;
    height:46px !important;
    padding:0 22px !important;
    font-size:15px !important;
    font-weight:700 !important;
    letter-spacing:-.005em !important;
    color:#0a182b !important;
    border-color:rgba(10,24,43,.20) !important;
  }

  body > header.site-header .brand img,
  body > header.site-header .brand-logo img{
    height:70px !important;
    max-width:262px !important;
  }
}

@media (max-width:1200px) and (min-width:1025px){
  body > header.site-header .brand img,
  body > header.site-header .brand-logo img{
    height:64px !important;
    max-width:240px !important;
  }
}

/* VILIANTE MOBILE HEADER LAYOUT FINAL v1 */
/* Mobile-only. Desktop untouched. */

@media (max-width:1024px){
  .viliante-mobile-site-header{
    height:76px !important;
    min-height:76px !important;
    padding:0 18px !important;
    display:grid !important;
    grid-template-columns:auto 1fr auto auto !important;
    align-items:center !important;
    column-gap:12px !important;
    background:rgba(255,255,255,.96) !important;
    border-bottom:1px solid rgba(16,35,63,.08) !important;
    box-shadow:0 10px 28px rgba(16,35,63,.06) !important;
  }

  .viliante-mobile-logo{
    grid-column:1 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:auto !important;
    min-width:86px !important;
    height:76px !important;
  }

  .viliante-mobile-logo img{
    height:58px !important;
    width:auto !important;
    max-width:92px !important;
    object-fit:contain !important;
  }

  .viliante-mobile-header-tools{
    grid-column:3 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:10px !important;
    height:76px !important;
    margin:0 !important;
    padding:0 !important;
  }

  .viliante-mobile-icon-btn{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    border-radius:999px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    color:#102037 !important;
    background:rgba(255,255,255,.72) !important;
    border:1px solid rgba(16,35,63,.10) !important;
  }

  .viliante-mobile-icon-btn svg{
    width:21px !important;
    height:21px !important;
    stroke-width:2 !important;
  }

  .viliante-mobile-menu-btn{
    grid-column:4 !important;
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    display:inline-flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
  }

  .viliante-mobile-menu-btn span{
    width:31px !important;
    height:2px !important;
    border-radius:999px !important;
    background:#102037 !important;
    display:block !important;
  }
}

/* VILIANTE MOBILE HEADER VISUAL MERGED v8 */

@media (max-width:1024px){
  .viliante-mobile-site-header{
    background:linear-gradient(135deg, rgba(255,248,238,.96), rgba(244,250,255,.94)) !important;
    border-bottom:1px solid rgba(16,35,63,.10) !important;
    box-shadow:0 12px 34px rgba(16,35,63,.08) !important;
    backdrop-filter:blur(18px) !important;
    -webkit-backdrop-filter:blur(18px) !important;
  }

  .viliante-mobile-logo{
    min-width:108px !important;
    margin-left:-8px !important;
  }

  .viliante-mobile-logo img{
    height:70px !important;
    max-width:114px !important;
  }
}

/* VILIANTE DESKTOP NAV CLEAN FINAL v19 */
@media (min-width:1025px){
  body > header.site-header nav.nav-links{
    gap:34px !important;
    transform:translateX(-78px) !important;
  }

  body > header.site-header nav.nav-links a{
    font-size:19px !important;
    font-weight:700 !important;
    letter-spacing:-.015em !important;
  }
}

@media (max-width:1200px) and (min-width:1025px){
  body > header.site-header nav.nav-links{
    gap:24px !important;
    transform:translateX(-40px) !important;
  }

  body > header.site-header nav.nav-links a{
    font-size:18px !important;
    font-weight:700 !important;
  }
}


/* VILIANTE MOBILE DRAWER SEND REQUEST v20 */

@media(max-width:1024px){
  .viliante-mobile-drawer-actions{
    display:grid !important;
    gap:10px !important;
  }

  .viliante-mobile-btn-secondary{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:48px !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.84) !important;
    color:#102037 !important;
    border:1px solid rgba(16,35,63,.14) !important;
    font-weight:850 !important;
    text-decoration:none !important;
    box-shadow:0 12px 28px rgba(16,35,63,.08) !important;
  }
}






/* VILIANTE DESKTOP HEADER HOVER CLEAN FINAL v24 */
@media(min-width:1025px){
  body > header.site-header nav.nav-links a{
    transform:none !important;
    transition:color .18s ease, text-shadow .18s ease, opacity .18s ease !important;
  }

  body > header.site-header nav.nav-links a:hover{
    transform:none !important;
    background:transparent !important;
    color:#071a33 !important;
    -webkit-text-fill-color:#071a33 !important;
    text-shadow:
      0 0 10px rgba(255,255,255,.85),
      0 8px 18px rgba(16,35,63,.10) !important;
  }

  body > header.site-header .header-icon-btn,
  body > header.site-header .header-login-btn{
    transition:
      background .18s ease,
      border-color .18s ease,
      color .18s ease,
      box-shadow .18s ease,
      transform .18s ease !important;
  }

  body > header.site-header .header-icon-btn:hover,
  body > header.site-header .header-login-btn:hover{
    background:rgba(16,35,63,.10) !important;
    border-color:rgba(16,35,63,.18) !important;
    color:#071a33 !important;
    transform:none !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.55), 0 10px 24px rgba(16,35,63,.10) !important;
  }
}

/* VILIANTE FLOATING ORDER NOW FINAL v25 */

.viliante-floating-order{
  position:fixed !important;
  z-index:9998 !important;
  right:26px !important;
  bottom:26px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  min-width:142px !important;
  height:52px !important;
  padding:0 22px !important;
  border-radius:999px !important;

  background:linear-gradient(135deg,#102037,#1b5f8f) !important;
  color:#fff !important;
  text-decoration:none !important;

  font-size:15px !important;
  font-weight:850 !important;
  letter-spacing:-.015em !important;

  box-shadow:
    0 20px 48px rgba(16,35,63,.22),
    inset 0 1px 0 rgba(255,255,255,.22) !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    filter .18s ease !important;
}

.viliante-floating-order:hover{
  transform:translateY(-2px) !important;
  filter:brightness(1.06) !important;
  box-shadow:
    0 26px 62px rgba(16,35,63,.28),
    inset 0 1px 0 rgba(255,255,255,.28) !important;
}

@media(max-width:1024px){
  .viliante-floating-order{
    left:16px !important;
    right:16px !important;
    bottom:16px !important;
    width:auto !important;
    height:56px !important;
    min-width:0 !important;
    border-radius:999px !important;

    font-size:15px !important;
    font-weight:900 !important;

    box-shadow:
      0 18px 44px rgba(16,35,63,.24),
      inset 0 1px 0 rgba(255,255,255,.22) !important;
  }

  body{
    padding-bottom:76px !important;
  }
}

/* VILIANTE FLOATING ORDER MOBILE SMALL FINAL v26 */
@media(max-width:1024px){
  .viliante-floating-order{
    left:auto !important;
    right:16px !important;
    bottom:18px !important;
    width:auto !important;
    min-width:118px !important;
    height:46px !important;
    padding:0 18px !important;
    border-radius:999px !important;

    background:rgba(16,35,63,.92) !important;
    color:#fff !important;

    font-size:14px !important;
    font-weight:850 !important;

    box-shadow:
      0 14px 34px rgba(16,35,63,.22),
      inset 0 1px 0 rgba(255,255,255,.18) !important;
    backdrop-filter:blur(12px) !important;
    -webkit-backdrop-filter:blur(12px) !important;
  }

  .viliante-floating-order:hover{
    transform:none !important;
  }

}

/* VILIANTE FLOATING ORDER HEARTBEAT FINAL v27 */
/* index-floating-order-heartbeat-v1 */

@keyframes vilianteOrderHeartbeat{
  0%, 100%{
    transform:scale(1);
    box-shadow:
      0 14px 34px rgba(16,35,63,.22),
      inset 0 1px 0 rgba(255,255,255,.18);
  }

  14%{
    transform:scale(1.045);
    box-shadow:
      0 20px 42px rgba(16,35,63,.26),
      inset 0 1px 0 rgba(255,255,255,.22);
  }

  28%{
    transform:scale(1);
  }

  42%{
    transform:scale(1.026);
    box-shadow:
      0 16px 38px rgba(16,35,63,.24),
      inset 0 1px 0 rgba(255,255,255,.20);
  }

  56%{
    transform:scale(1);
  }
}

.viliante-floating-order-heartbeat{
  animation:vilianteOrderHeartbeat 2.6s ease-in-out infinite !important;
  will-change:transform, box-shadow !important;
}

.viliante-floating-order-heartbeat:hover{
  animation-play-state:paused !important;
}

@media(prefers-reduced-motion:reduce){
  .viliante-floating-order-heartbeat{
    animation:none !important;
  }
}

/* VILIANTE REMOVE MOBILE FOOTER EXTRA GAP FINAL v29 */
@media(max-width:1024px){
  body{
    padding-bottom:0 !important;
  }

  .site-footer,
  .viliante-footer-final{
    margin-bottom:0 !important;
  }
}

/* VILIANTE DESKTOP HEADER ICONS RESTORE v31 */
@media (min-width:1025px){
  body > header.site-header .header-icon-btn,
  body > header.site-header button.header-icon-btn,
  body > header.site-header .nav-actions .header-icon-btn,
  body > header.site-header .nav-account-actions .header-icon-btn{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    min-height:42px !important;

    padding:0 !important;
    margin:0 !important;
    border-radius:999px !important;

    background:rgba(255,255,255,.68) !important;
    border:1px solid rgba(18,32,51,.10) !important;
    box-shadow:none !important;

    color:#102037 !important;
    text-decoration:none !important;
    cursor:pointer !important;

    outline:none !important;
    overflow:hidden !important;
  }

  body > header.site-header .header-icon-btn svg,
  body > header.site-header button.header-icon-btn svg,
  body > header.site-header .nav-actions .header-icon-btn svg,
  body > header.site-header .nav-account-actions .header-icon-btn svg{
    display:block !important;
    width:20px !important;
    height:20px !important;
    min-width:20px !important;
    min-height:20px !important;

    stroke:currentColor !important;
    stroke-width:2 !important;
    fill:none !important;
  }

  body > header.site-header .header-icon-btn:hover,
  body > header.site-header button.header-icon-btn:hover{
    background:rgba(16,35,63,.10) !important;
    border-color:rgba(16,35,63,.18) !important;
    color:#071a33 !important;
    transform:none !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.55), 0 10px 24px rgba(16,35,63,.10) !important;
  }
}

/* VILIANTE FLOATING ORDER DESKTOP SAME AS MOBILE v30 */
@media(min-width:1025px){
  .viliante-floating-order{
    background:rgba(16,35,63,.92) !important;
    color:#fff !important;
    box-shadow:
      0 14px 34px rgba(16,35,63,.22),
      inset 0 1px 0 rgba(255,255,255,.18) !important;
    backdrop-filter:blur(12px) !important;
    -webkit-backdrop-filter:blur(12px) !important;
  }

  .viliante-floating-order:hover{
    filter:none !important;
    background:rgba(16,35,63,.96) !important;
  }
}

/* VILIANTE MOBILE HEADER EXACT LOGO + COLOR FIX v2 */
@media(max-width:1024px){
  /*
    Mobile-only header polish.
    Does NOT change header height, width, or padding.
    Logo image = 64px.
    Header color = warm soft glass, not blue.
  */

  body > header.viliante-mobile-site-header{
    background:
      linear-gradient(
        180deg,
        rgba(255,250,241,.82) 0%,
        rgba(246,238,225,.66) 100%
      ) !important;
    border-bottom:1px solid rgba(151,116,74,.10) !important;
    box-shadow:
      0 8px 22px rgba(68,44,22,.035),
      inset 0 1px 0 rgba(255,255,255,.58) !important;
    backdrop-filter:blur(18px) saturate(118%) !important;
    -webkit-backdrop-filter:blur(18px) saturate(118%) !important;
  }

  body > header.viliante-mobile-site-header > .viliante-mobile-logo{
    min-width:100px !important;
    max-width:116px !important;
  }

  body > header.viliante-mobile-site-header > .viliante-mobile-logo img{
    height:64px !important;
    max-height:64px !important;
    width:auto !important;
    max-width:116px !important;
    object-fit:contain !important;
    transform:none !important;
  }

  body > header.viliante-mobile-site-header .viliante-mobile-icon-btn{
    background:rgba(255,255,255,.46) !important;
    border-color:rgba(68,44,22,.10) !important;
    color:#102037 !important;
    box-shadow:0 8px 18px rgba(68,44,22,.025) !important;
  }

  body > header.viliante-mobile-site-header .viliante-mobile-icon-btn svg{
    stroke:#102037 !important;
  }

  body > header.viliante-mobile-site-header > .viliante-mobile-menu-btn{
    background:transparent !important;
    box-shadow:none !important;
  }

  body > header.viliante-mobile-site-header > .viliante-mobile-menu-btn span{
    background:#102037 !important;
  }
}

@media(max-width:430px){
  body > header.viliante-mobile-site-header > .viliante-mobile-logo{
    min-width:96px !important;
    max-width:112px !important;
  }

  body > header.viliante-mobile-site-header > .viliante-mobile-logo img{
    height:64px !important;
    max-height:64px !important;
    max-width:112px !important;
  }
}
/* END VILIANTE MOBILE HEADER EXACT LOGO + COLOR FIX v2 */

/* header-right-actions-stable-v1 */
/* header-right-icons-shift-right-v2 */
/* header-logged-out-login-align-v1 */
/* header-logo-hitbox-fix-v1 */
@media (min-width:1025px){
  body > header.site-header .brand,
  body > header.site-header .brand-logo{
    pointer-events:none !important;
  }

  body > header.site-header .brand img,
  body > header.site-header .brand-logo img{
    pointer-events:auto !important;
    cursor:pointer !important;
  }

  body > header.site-header .nav-account-actions{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:6px !important;
    width:185px !important;
    min-width:185px !important;
    max-width:185px !important;
    flex:0 0 185px !important;
    transform:translateX(12px) !important;
  }

  body > header.site-header .nav-account-actions > .viliante-search-trigger,
  body > header.site-header .nav-account-actions > .viliante-auth-cart-icon{
    flex:0 0 42px !important;
  }

  body > header.site-header .nav-account-actions > .viliante-search-trigger{
    margin-left:6px !important;
  }

  body > header.site-header .nav-account-actions > a[href="/account"][aria-label="My Account"],
  body > header.site-header .nav-account-actions > .viliante-account-menu,
  body > header.site-header .nav-account-actions > .header-login-btn{
    position:absolute !important;
    top:50% !important;
    right:0 !important;
    margin:0 !important;
    transform:translateY(-50%) !important;
  }

  body > header.site-header .nav-account-actions > .viliante-account-menu{
    width:76px !important;
    min-width:76px !important;
    height:42px !important;
    justify-content:flex-start !important;
  }

  body > header.site-header .nav-account-actions > .header-login-btn{
    width:76px !important;
    min-width:76px !important;
    padding:0 14px !important;
  }

  html[data-viliante-auth-state="logged-out"] body > header.site-header .nav-account-actions{
    transform:translateX(0) !important;
  }
}

@media(max-width:1024px){
  body > header.viliante-mobile-site-header .viliante-mobile-header-tools{
    display:grid !important;
    grid-template-columns:42px 42px 42px !important;
    align-items:center !important;
    justify-content:end !important;
    column-gap:9px !important;
    width:144px !important;
    min-width:144px !important;
    max-width:144px !important;
  }

  body > header.viliante-mobile-site-header .viliante-mobile-header-tools > .viliante-mobile-icon-btn,
  body > header.viliante-mobile-site-header .viliante-mobile-header-tools > .viliante-account-menu{
    width:42px !important;
    min-width:42px !important;
    height:42px !important;
  }
}

/* mobile-header-grid-compact-fix-v1 */
@media (max-width:1024px) {
  body > header.viliante-mobile-site-header {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto auto !important;
    align-items: center !important;
    justify-content: initial !important;
    column-gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 14px !important;
    padding-right: 12px !important;
  }

  body > header.viliante-mobile-site-header > .viliante-mobile-logo {
    grid-column: 1 !important;
    justify-self: start !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 96px !important;
    margin: 0 !important;
  }

  body > header.viliante-mobile-site-header > .viliante-mobile-logo img {
    max-width: 96px !important;
  }

  body > header.viliante-mobile-site-header .viliante-mobile-header-tools {
    grid-column: 3 !important;
    justify-self: end !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: max-content !important;
    margin: 0 !important;
    gap: 6px !important;
  }

  body > header.viliante-mobile-site-header > .viliante-mobile-menu-btn {
    grid-column: 4 !important;
    justify-self: end !important;
  }

  body > header.viliante-mobile-site-header .viliante-mobile-icon-btn,
  body > header.viliante-mobile-site-header .viliante-mobile-header-tools > .viliante-account-menu,
  body > header.viliante-mobile-site-header > .viliante-mobile-menu-btn {
    flex: 0 0 40px !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
  }
}

@media (max-width:380px) {
  body > header.viliante-mobile-site-header {
    grid-template-columns: auto minmax(0, 1fr) auto auto !important;
    column-gap: 6px !important;
    padding-left: 10px !important;
    padding-right: 8px !important;
  }

  body > header.viliante-mobile-site-header > .viliante-mobile-logo {
    max-width: 86px !important;
  }

  body > header.viliante-mobile-site-header > .viliante-mobile-logo img {
    max-width: 86px !important;
  }

  body > header.viliante-mobile-site-header .viliante-mobile-header-tools {
    gap: 5px !important;
  }

  body > header.viliante-mobile-site-header .viliante-mobile-icon-btn,
  body > header.viliante-mobile-site-header .viliante-mobile-header-tools > .viliante-account-menu,
  body > header.viliante-mobile-site-header > .viliante-mobile-menu-btn {
    flex-basis: 38px !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
  }
}

/* mobile-header-tap-highlight-fix-v1 */
@media (hover:none) and (pointer:coarse) {
  body > header.viliante-mobile-site-header a,
  body > header.viliante-mobile-site-header button,
  body > header.viliante-mobile-site-header .viliante-mobile-icon-btn,
  body > header.viliante-mobile-site-header .viliante-mobile-menu-btn {
    -webkit-tap-highlight-color: transparent !important;
    tap-highlight-color: transparent !important;
  }

  body > header.viliante-mobile-site-header a:active,
  body > header.viliante-mobile-site-header button:active,
  body > header.viliante-mobile-site-header .viliante-mobile-icon-btn:active,
  body > header.viliante-mobile-site-header .viliante-mobile-menu-btn:active {
    box-shadow: none !important;
  }

  body > header.viliante-mobile-site-header a:focus:not(:focus-visible),
  body > header.viliante-mobile-site-header button:focus:not(:focus-visible) {
    outline: none !important;
  }
}

/* header-logo-focus-rectangle-fix-v1
   Prevent default black click/focus rectangles on header logo anchors while preserving keyboard focus visibility. */
body > header.site-header .brand-logo,
body > header.viliante-mobile-site-header > .viliante-mobile-logo {
  -webkit-tap-highlight-color: transparent;
}

body > header.site-header .brand-logo:focus:not(:focus-visible),
body > header.site-header .brand-logo:active,
body > header.viliante-mobile-site-header > .viliante-mobile-logo:focus:not(:focus-visible),
body > header.viliante-mobile-site-header > .viliante-mobile-logo:active {
  outline: none !important;
  box-shadow: none !important;
}

body > header.site-header .brand-logo:focus-visible,
body > header.viliante-mobile-site-header > .viliante-mobile-logo:focus-visible {
  outline: 2px solid rgba(35, 110, 180, 0.45) !important;
  outline-offset: 6px;
  border-radius: 18px;
}

/* interactive-click-focus-ring-fix-v1
   Hide mouse/touch focus rectangles on interactive UI while preserving keyboard focus-visible. */
:where(
  a,
  button,
  [role="button"],
  .btn,
  .brand-logo,
  .viliante-mobile-logo,
  .nav-link,
  .viliante-search-trigger,
  .viliante-icon-btn,
  .header-icon-btn,
  .viliante-mobile-icon-btn,
  .viliante-mobile-menu-btn,
  .viliante-account-menu,
  .viliante-account-toggle,
  .hero-actions a,
  .hero-actions button,
  .viliante-final-hero-dot
):focus:not(:focus-visible),
:where(
  a,
  button,
  [role="button"],
  .btn,
  .brand-logo,
  .viliante-mobile-logo,
  .nav-link,
  .viliante-search-trigger,
  .viliante-icon-btn,
  .header-icon-btn,
  .viliante-mobile-icon-btn,
  .viliante-mobile-menu-btn,
  .viliante-account-menu,
  .viliante-account-toggle,
  .hero-actions a,
  .hero-actions button,
  .viliante-final-hero-dot
):active {
  outline: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

:where(
  .brand-logo,
  .viliante-mobile-logo,
  .nav-link,
  .btn,
  .viliante-search-trigger,
  .viliante-icon-btn,
  .header-icon-btn,
  .viliante-mobile-icon-btn,
  .viliante-mobile-menu-btn,
  .viliante-account-menu,
  .viliante-account-toggle,
  .hero-actions a,
  .hero-actions button,
  .viliante-final-hero-dot
):focus-visible {
  outline: 2px solid rgba(16, 87, 183, 0.28) !important;
  outline-offset: 4px !important;
  box-shadow: none !important;
}

/* logged-in-header-icons-tight-right-v1
   Logged-in desktop only: tighten Search/Cart/Account spacing and nudge the group right. */
@media (min-width: 1025px) {
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions {
    gap: 7px !important;
    column-gap: 7px !important;
    transform: translateX(14px) !important;
  }

  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .header-icon-btn,
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-account-menu,
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-account-menu > .header-icon-btn {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .header-login-btn {
    margin-left: initial !important;
    transform: none !important;
  }
}

/* logged-in-header-icons-tight-right-v2
   Logged-in desktop only: keep Search, Cart, and Account in one equal-gap flex row. */
@media (min-width: 1025px) {
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    column-gap: 6px !important;
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
    flex: 0 0 150px !important;
    transform: translateX(14px) !important;
  }

  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-search-trigger,
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-auth-cart-icon,
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-account-menu,
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > a[href="/account"][aria-label="My Account"] {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    transform: none !important;
  }

  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-search-trigger,
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-auth-cart-icon,
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-account-menu > .header-icon-btn,
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > a[href="/account"][aria-label="My Account"] {
    margin: 0 !important;
  }

  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-account-menu {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-account-menu > .header-icon-btn {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
  }

  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .header-login-btn {
    display: none !important;
  }
}

/* logged-in-header-icons-shift-right-v3
   Logged-in desktop only: keep v2 tight icon spacing, move the whole icon group further right. */
@media (min-width: 1025px) {
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions {
    gap: 6px !important;
    column-gap: 6px !important;
    margin-right: -22px !important;
    transform: translateX(22px) !important;
  }
}

/* logged-in-header-icons-edge-balance-v4
   Logged-in desktop only: tiny symmetric outer-icon adjustment.
   Search moves slightly left, Account moves equally right, Cart remains centered.
   No icon size change. Logged-out layout is untouched. */
@media (min-width: 901px) {
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-search-trigger {
    transform: translateX(-4px) !important;
  }

  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-auth-cart-icon {
    transform: none !important;
  }

  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > .viliante-account-menu > .header-icon-btn,
  html[data-viliante-auth-state="logged-in"] body > header.site-header .nav-account-actions > a[href="/account"][aria-label="My Account"] {
    transform: translateX(4px) !important;
  }
}
