/* Location-first homepage: brand header, uncropped hero and address popup. */
.nf-customer-ui.controller-store.action-index { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
.nf-customer-ui .nf-site-header.nf-home-header { background: var(--nf-accent); border-bottom: 1px solid #d0124933; padding-inline: 0; }
.nf-customer-ui .nf-home-header #top-navigation { max-width: 1200px; min-height: 68px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 24px; margin-inline: auto; padding: 10px 28px; }
.nf-home-header #top-navigation > .nf-header-brand,
.nf-home-header #top-navigation > .justify-content-end { width: auto; min-width: 0; padding: 0; }
.nf-home-header #vue-widget-nav { display: none !important; }
.nf-home-header #top-navigation .top-logo a { display: inline-flex; align-items: center; min-height: 44px; padding: 0; }
.nf-home-header #top-navigation .top-logo img { width: 136px; max-height: 30px; object-fit: contain; }
.nf-home-header #top-navigation .nf-header-address { display: flex; align-items: center; gap: 12px; min-width: 0; min-height: 48px; width: auto; justify-self: start; padding: 0 24px; border: 0; border-inline-start: 1px solid #ffffff40; border-radius: 6px; background: transparent; color: white; text-align: start; font: inherit; }
.nf-home-header #top-navigation .nf-header-address:hover { background: #ffffff18; }
.nf-home-header #top-navigation .nf-header-address > i { color: white; font-size: 25px; }
.nf-header-address > span { min-width: 0; }
.nf-header-address small { display: block; font-size: 11px; line-height: 1.6; }
.nf-header-address strong { display: block; font-size: 14px; font-weight: 650; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nf-home-header #top-navigation .top-menu { display: flex; align-items: center; gap: 8px; margin: 0; padding: 0; }
.nf-home-header #top-navigation .top-menu > li { margin: 0 !important; padding: 0 !important; }
.nf-home-header #top-navigation .top-menu > li:empty { display: none !important; }
.nf-home-header #top-navigation ul.top-menu > li > a,
.nf-home-header #top-navigation ul.top-menu > li .dropdown-toggle,
.nf-home-header #top-navigation ul.top-menu > li .btn { color: white; }
.nf-home-header #top-navigation ul.top-menu > li > a { text-decoration: none; min-height: 44px; }
.nf-home-header #top-navigation .cart-handle { display: inline-flex; align-items: center; justify-content: center; position: relative; min-width: 44px; min-height: 44px; padding: 8px; }
.nf-home-header #top-navigation .cart-handle img { width: 23px; height: 25px; object-fit: contain; filter: brightness(0) invert(1); }
.nf-home-header #top-navigation .cart-handle .badge { position: absolute; top: 0; right: 0; bottom: auto; margin: 0; }
.nf-home-header #top-navigation .hamburger { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 10px; }
.nf-home-header #top-navigation .hamburger-box { display: block; }
.nf-home-header .hamburger-inner, .nf-home-header .hamburger-inner::before, .nf-home-header .hamburger-inner::after { background: white !important; }
.nf-home-header #top-navigation .nf-header-address:focus-visible,
.nf-home-header #top-navigation .top-menu > li > a:focus-visible,
.nf-home-header #top-navigation .hamburger:focus-visible { outline: 2px solid white; outline-offset: 3px; }

.nf-home-opening { position: relative; background: #eee8df; overflow: hidden; }
.nf-opening-inner { max-width: 1200px; min-height: 420px; padding: 56px 28px; margin: auto; display: grid; grid-template-columns: 1fr 1fr; align-content: center; }
.nf-opening-copy { position: relative; z-index: 1; grid-column: 1; }
.nf-customer-ui .nf-home-opening h1 { font-family: inherit; font-size: clamp(44px,4.6vw,62px); font-weight: 750; line-height: 1.08; letter-spacing: -.045em; color: #171d23; margin: 0 0 20px; text-shadow: none; text-wrap: balance; }
.nf-opening-copy p { font-size: 17px !important; line-height: 1.6; color: #52565c; max-width: 370px; margin: 0; }
.nf-opening-location { position: relative; z-index: 1; grid-column: 1; justify-self: start; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; margin-top: 28px; padding: 13px 22px; border: 0; border-radius: 12px; background: #d01249; color: white; line-height: 1.4; font-family: inherit; font-size: 16px; font-weight: 650; box-shadow: 0 4px 12px #87082c12; transition: background-color .15s, box-shadow .15s; }
.nf-opening-location > i { font-size: 21px; }
.nf-opening-location:hover { background: #b81040; box-shadow: 0 6px 16px #87082c20; }
.nf-opening-location:active { box-shadow: none; }
.nf-opening-photo { position: absolute; inset-inline-end: 0; top: 50%; width: min(50%,600px); height: auto; transform: translateY(-50%); object-fit: contain; object-position: right center; pointer-events: none; mask-image: linear-gradient(to right,transparent,#000 12%,#000 98%,transparent), linear-gradient(to bottom,transparent,#000 4%,#000 95%,transparent); mask-composite: intersect; }

/* Keep the existing Vue location controls in their original root. */
#home-address-picker .modal-dialog { max-width: 560px; }
#home-address-picker .modal-content { border: 0; border-radius: 22px; box-shadow: 0 24px 80px #20212b26; }
#home-address-picker .nf-address-close { position: absolute; inset-inline-end: 12px; top: 12px; z-index: 2; width: 44px; height: 44px; border: 0; border-radius: 50%; background: #f5f5f7; color: #20212b; font-size: 24px; }
#home-address-picker .nf-address-close:hover { background: #ececf0; }
.nf-customer-ui.controller-store.action-index #home-address-picker #main-search-banner { min-height: 0; border: 0; border-radius: 22px; background: white; padding: 36px 28px 32px; }
.nf-customer-ui.controller-store.action-index #home-address-picker .banner-center { display: block; max-width: none; width: 100%; margin: 0; }
.nf-customer-ui.controller-store.action-index #home-address-picker .nf-address-intro { display: flex; align-items: flex-start; gap: 14px; padding-inline-end: 32px; }
.nf-address-intro > i { font-size: 28px; color: #d01249; padding-top: 2px; }
.nf-customer-ui.controller-store.action-index #home-address-picker h2 { font-family: inherit; font-size: 23px; font-weight: 700; letter-spacing: -.025em; line-height: 1.3; margin: 0 0 10px; padding-inline-end: 28px; }
.nf-address-intro p { font-size: 14px !important; line-height: 1.6; color: #60636f; margin: 0; }
.nf-customer-ui.controller-store.action-index #home-address-picker .home-search-wrap { max-width: none; width: 100%; margin-top: 24px; }
.nf-customer-ui.controller-store.action-index #home-address-picker .home-search-card { border: 1px solid #dedee4; border-radius: 14px; padding: 6px; box-shadow: none; }
.nf-customer-ui.controller-store.action-index #home-address-picker .el-input__inner { font-family: inherit; font-size: 16px; }
.nf-customer-ui.controller-store.action-index #home-address-picker .flex-enabled-locate button { border-radius: 10px; }
.nf-customer-ui.controller-store.action-index #home-address-picker .home-search-card:focus-within { border-color: #d01249; box-shadow: 0 0 0 3px #d0124914; }
.nf-customer-ui #home-address-picker .home-search-card input:focus-visible { outline: 0; }

@media (min-width: 992px) {
  .nf-home-header #top-navigation ul.top-menu > li > a { font-size: 14px; }
  .nf-home-header #top-navigation ul.top-menu a[href$='/login'] { background: #fff0f5; color: #b81040; border-radius: 10px; padding-inline: 18px; }
  .nf-home-header #top-navigation .top-menu > li.d-lg-inline { display: flex !important; align-items: center; min-height: 44px; }
  .nf-home-header #top-navigation .top-menu > li.line-left { height: 44px; border: 0; }
}
@media (max-width: 991.98px) {
  .nf-customer-ui .nf-home-header #top-navigation { grid-template-columns: minmax(0,1fr) auto; min-height: 64px; gap: 8px; padding: 8px 20px; }
  .nf-home-header .nf-header-brand { display: none !important; }
  .nf-home-header #top-navigation .nf-header-address { padding: 0; justify-self: stretch; gap: 10px; border: 0; }
  .nf-home-header #top-navigation .top-menu { gap: 4px; }
  .nf-opening-inner { min-height: 300px; padding: 36px 24px; grid-template-columns: 56% 44%; }
  .nf-customer-ui .nf-home-opening h1 { font-size: clamp(32px,4.8vw,44px); margin-bottom: 16px; }
  .nf-opening-copy p { font-size: 14px !important; max-width: 230px; }
  .nf-opening-photo { width: 43%; }
  .nf-opening-location { font-size: 15px; margin-top: 24px; padding-inline: 18px; }
}
@media (max-width: 575.98px) {
  .nf-opening-inner { min-height: 280px; padding: 30px 20px; }
  #home-address-picker .modal-dialog { margin: 0; max-width: none; min-height: 100%; align-items: flex-end; }
  #home-address-picker .modal-content { border-radius: 22px 22px 0 0; padding-bottom: env(safe-area-inset-bottom); }
  .nf-customer-ui.controller-store.action-index #home-address-picker #main-search-banner { padding: 30px 20px 32px; }
  .nf-customer-ui.controller-store.action-index #home-address-picker .nf-address-intro { padding-inline-end: 24px; }
  .nf-address-intro > i { display: none; }
}
@media (max-width: 359.98px) {
  .nf-customer-ui .nf-home-header #top-navigation { padding-inline: 16px; gap: 4px; }
  .nf-home-header #top-navigation .nf-header-address { gap: 6px; }
  .nf-header-address strong { font-size: 12px; }
  .nf-opening-inner { padding-inline: 16px; grid-template-columns: 66% 34%; }
  .nf-customer-ui .nf-home-opening h1 { font-size: 30px; }
  .nf-opening-photo { width: 33%; }
  .nf-opening-location { font-size: 14px; gap: 6px; padding-inline: 14px; }
}