.site-header {
  grid-template-columns: 195px 1fr 190px;
  gap: 18px;
  background: #cf0b56;
}

.brand img { width: 178px; }
.main-nav { gap: clamp(24px, 2.35vw, 46px); }
.main-nav>a,
.nav-dropdown__toggle { font-size: 16px; font-weight: 600; letter-spacing: -.02em; white-space: nowrap; }

.nav-dropdown { position: relative; display: flex; align-items: center; align-self: stretch; }
.nav-dropdown__toggle { height: 100%; padding: 0; display: flex; align-items: center; border: 0; color: #fff; background: transparent; font-family: inherit; cursor: pointer; }

.nav-submenu {
  position: absolute;
  z-index: 100;
  top: calc(100% - 1px);
  left: -18px;
  width: 350px;
  padding: 16px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 8px;
  gap: 3px;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 16px;
  background: linear-gradient(180deg,#cf0b56 0%,#bd0a4f 100%);
  box-shadow: 0 22px 55px rgba(36,0,13,.36);
  transform: translateY(10px);
  transition: .22s ease;
}

.nav-submenu::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 12px; }

.nav-dropdown:hover .nav-submenu,
.nav-dropdown:focus-within .nav-submenu,
.nav-dropdown.is-open .nav-submenu { visibility: visible; opacity: 1; pointer-events: auto; transform: translateY(0); }
.nav-submenu { width: 590px; }
.nav-submenu a { min-height: 54px; padding: 13px 16px; display: flex; align-items: center; border-bottom: 2px solid rgba(255,255,255,.38); border-radius: 0; color: #fff; font-size: 16px; font-weight: 600; line-height: 1.3; transition: .18s; }
.nav-submenu a:nth-child(even) { border-left: 2px solid rgba(239,213,156,.58); }
.nav-submenu a:nth-last-child(-n+2):nth-child(odd),
.nav-submenu a:last-child { border-bottom: 0; }
.nav-submenu a::after { content: "↗" !important; position: static; width: auto; height: auto; margin-left: auto; display: inline-block !important; color: rgba(255,255,255,.8); background: none; font-size: 15px; line-height: 1; opacity: 1; transform: none; transition: transform .18s ease; }
.nav-submenu a:hover,
.nav-submenu a:focus-visible { color: #5b0b29; background: #f6e7c8; outline: none; }
.nav-submenu a:hover::after,
.nav-submenu a:focus-visible::after { color: #5b0b29; transform: translate(2px,-2px); }
.nav-seasonal { color: #f4d48e !important; white-space: nowrap; }
.header-cta { white-space: nowrap; }

@media (min-width: 1121px) {
  .main-nav > a:not(:last-child)::before,
  .main-nav > .nav-dropdown::after {
    content: "/";
    position: absolute;
    top: 50%;
    right: -18px;
    color: rgba(244,212,142,.78);
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    pointer-events: none;
    transform: translateY(-50%) rotate(12deg);
    transition: transform .2s ease, color .2s ease;
  }

  .main-nav > a:not(:last-child):hover::before,
  .main-nav > a:not(:last-child):focus-visible::before,
  .main-nav > .nav-dropdown:hover::after,
  .main-nav > .nav-dropdown:focus-within::after {
    color: #fff;
    transform: translateY(-50%) rotate(-12deg);
  }
}

@media(max-width:1260px){.site-header{grid-template-columns:170px 1fr 165px;padding-inline:20px}.brand img{width:158px}.main-nav{gap:18px}.main-nav>a,.nav-dropdown__toggle{font-size:15px}.header-cta{padding-inline:15px;font-size:11px}.nav-submenu a{font-size:15px}}
@media(min-width:1121px) and (max-width:1260px){.main-nav>a:not(:last-child)::before,.main-nav>.nav-dropdown::after{right:-10px}}
@media(max-width:1120px){.site-header{top:8px;left:10px;right:10px;height:76px;padding:0 16px;grid-template-columns:1fr auto;border-radius:14px}.brand img{width:150px;max-height:58px}.menu-toggle{display:block}.header-cta{display:none}.main-nav{display:none;position:absolute;top:68px;left:0;right:0;padding:14px 18px 20px;flex-direction:column;align-items:stretch;gap:0;border-radius:0 0 14px 14px;background:linear-gradient(105deg,#e4006c,#ec0074)}.main-nav.is-open{display:flex}.main-nav>a{padding:14px 4px;font-size:15px}.main-nav>a:after{bottom:8px}.nav-dropdown{display:block}.nav-dropdown__toggle{width:100%;height:auto;padding:14px 4px;justify-content:space-between;font-size:15px}.nav-submenu{position:static;width:100%;max-height:0;padding:0 10px;display:grid;grid-template-columns:1fr;overflow:hidden;visibility:visible;opacity:1;pointer-events:none;border:0;border-radius:10px;background:rgba(86,3,34,.32);box-shadow:none;transform:none;transition:max-height .3s ease,padding .3s ease}.nav-submenu::before{display:none}.nav-dropdown:hover .nav-submenu,.nav-dropdown:focus-within .nav-submenu{max-height:0;padding-block:0}.nav-dropdown.is-open .nav-submenu{max-height:560px;padding-block:10px;pointer-events:auto}.nav-submenu a{min-height:0;padding:11px 12px;border-left:0!important;border-bottom:2px solid rgba(255,255,255,.32);font-size:14px}.nav-submenu a:last-child{border-bottom:0}.nav-seasonal{color:#f8d995!important}}
@media(max-width:820px){.site-header{grid-template-columns:1fr auto}.brand img{width:150px}.main-nav{align-items:stretch}.nav-dropdown{display:block}.nav-dropdown__toggle{width:100%;height:auto;padding:14px 4px;justify-content:space-between;font-size:15px}.nav-submenu{position:static;width:100%;max-height:0;padding:0 10px;display:grid;overflow:hidden;visibility:visible;opacity:1;border:0;border-radius:10px;background:rgba(86,3,34,.32);box-shadow:none;transform:none;transition:max-height .3s ease,padding .3s ease}.nav-dropdown:hover .nav-submenu,.nav-dropdown:focus-within .nav-submenu{max-height:0;padding-block:0}.nav-dropdown.is-open .nav-submenu{max-height:560px;padding-block:10px}.nav-submenu a{padding:11px 12px;font-size:14px}.main-nav>a{font-size:15px}.nav-seasonal{color:#f8d995!important}}

@media(max-width:1120px){.site-header .main-nav{background:#cf0b56}}


@media(max-width:560px){
  .site-header{box-sizing:border-box;width:calc(100vw - 20px);max-width:calc(100vw - 20px);left:10px;right:auto;grid-template-columns:minmax(0,1fr) 44px;gap:0}
  .site-header .brand{min-width:0;padding-right:0}
  .site-header .brand img{width:min(150px,100%)}
  .site-header .menu-toggle{display:flex!important;visibility:visible!important;opacity:1!important;align-items:center;justify-content:center;position:relative;z-index:2;grid-column:2;width:44px;height:44px;padding:0;transform:none}
  .site-header .menu-toggle span{display:none}
  .site-header .menu-toggle::before{content:"☰";display:block;color:#fff;font:400 30px/1 Arial,sans-serif}
}