/* 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: 160px; max-height: 40px; 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: linear-gradient(108deg, #f7f2ee 0%, #eee7df 54%, #e7ddd5 100%); overflow: hidden; }
.nf-opening-inner { max-width: 1280px; min-height: 448px; padding: 64px 40px; margin: auto; display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); align-content: center; }
.nf-opening-copy { position: relative; z-index: 1; grid-column: 1; max-width: 500px; }
.nf-opening-kicker { display: inline-flex; align-items: center; gap: 9px; margin: 0 0 18px; color: #b81040; font-size: 10px !important; font-weight: 800; letter-spacing: .14em; line-height: 1.2 !important; text-transform: uppercase; }
.nf-opening-kicker::before { content: ''; width: 24px; height: 2px; border-radius: 99px; background: #f51359; }
.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:not(.nf-opening-kicker) { font-size: 17px !important; line-height: 1.6; color: #52565c; max-width: 370px; margin: 0; }
.nf-opening-services { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.nf-opening-services span { display: inline-flex; align-items: center; gap: 7px; min-height: 32px; padding: 6px 11px; border: 1px solid #e2d5cd; border-radius: 999px; background: rgba(255,255,255,.62); color: #3b3d43; font-size: 12px; font-weight: 700; }
.nf-opening-services i { color: #d01249; font-size: 15px; }
.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(55%, 700px); height: auto; transform: translate3d(0, calc(-50% + var(--nf-opening-parallax, 0px)), 0); will-change: transform; 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. */
.nf-customer-ui #home-address-picker .modal-dialog { width: calc(100% - 32px); max-width: 600px; }
.nf-customer-ui #home-address-picker .modal-content { position: relative; overflow: hidden; border: 1px solid #f1dbe4; border-radius: 28px; background: #fff; box-shadow: 0 24px 80px #20212b26; }
.nf-customer-ui #home-address-picker .nf-address-close { position: absolute; inset-inline-end: 16px; top: 16px; z-index: 2; display: inline-flex; width: 42px; height: 42px; align-items: center; justify-content: center; border: 1px solid #f2d9e2; border-radius: 50%; background: #fff5f8; color: #b81040; font-size: 22px; transition: background-color .15s, transform .15s; }
.nf-customer-ui #home-address-picker .nf-address-close:hover { background: #ffe6ef; transform: rotate(5deg); }
.nf-customer-ui #home-address-picker #main-search-banner { min-height: 0; border: 0; border-radius: 0; background: white; padding: 42px 36px 38px; }
.nf-customer-ui #home-address-picker .banner-center { display: block; max-width: none; width: 100%; margin: 0; }
.nf-customer-ui #home-address-picker .nf-address-intro { display: flex; align-items: flex-start; gap: 14px; padding-inline-end: 42px; }
.nf-customer-ui #home-address-picker .nf-address-intro > i { display: inline-flex; width: 44px; height: 44px; flex: 0 0 44px; align-items: center; justify-content: center; border-radius: 14px; background: #fff0f5; color: #d01249; font-size: 25px; }
.nf-customer-ui #home-address-picker h2 { font-family: inherit; font-size: 24px; font-weight: 750; letter-spacing: -.035em; line-height: 1.25; margin: 1px 0 8px; padding-inline-end: 18px; color: #20212b; }
.nf-customer-ui #home-address-picker .nf-address-intro p { font-size: 14px !important; line-height: 1.55; color: #60636f; margin: 0; }
.nf-customer-ui #home-address-picker .home-search-wrap { max-width: none; width: 100%; margin-top: 26px; }
.nf-customer-ui #home-address-picker .home-search-card { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.nf-customer-ui #home-address-picker #main-search-banner .search-geocomplete .el-input__wrapper,
.nf-customer-ui #home-address-picker #main-search-banner .el-input__wrapper { min-height: 54px; border: 1px solid #dedee4; border-radius: 15px; background: #fff; box-shadow: none; }
.nf-customer-ui #home-address-picker #main-search-banner .search-geocomplete .el-input__wrapper.is-focus { border-color: #d01249; box-shadow: 0 0 0 4px #d0124914; }
.nf-customer-ui #home-address-picker #main-search-banner .el-input__inner { height: 44px; font-family: inherit; font-size: 16px; color: #20212b; }
.nf-customer-ui #home-address-picker #main-search-banner .el-input__inner::placeholder { color: #8a8c96; }
.nf-customer-ui #home-address-picker #main-search-banner .flex-enabled-locate button,
.nf-customer-ui #home-address-picker #main-search-banner .el-button { min-width: 54px; min-height: 54px; border: 0; border-radius: 15px; background: #d01249; color: #fff; box-shadow: 0 8px 18px #d0124930; }
.nf-customer-ui #home-address-picker #main-search-banner .flex-enabled-locate button:hover,
.nf-customer-ui #home-address-picker #main-search-banner .el-button:hover { background: #b81040; }
.nf-customer-ui #home-address-picker #main-search-banner .flex-enabled-locate button:disabled,
.nf-customer-ui #home-address-picker #main-search-banner .el-button.is-disabled { opacity: .5; box-shadow: none; }
.nf-customer-ui #home-address-picker .home-search-card:focus-within { border-color: transparent; box-shadow: none; }
.nf-customer-ui #home-address-picker .home-search-card input:focus-visible { outline: 0; }
.nf-customer-ui #home-address-picker .nf-location-autocomplete-popper { z-index: 1060; border: 1px solid #f1dbe4; border-radius: 14px; box-shadow: 0 18px 40px #20212b1c; }

@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: 320px; padding: 40px 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-kicker { margin-bottom: 14px; }
  .nf-opening-copy > p:not(.nf-opening-kicker) { font-size: 14px !important; max-width: 230px; }
  .nf-opening-services { margin-top: 17px; }
  .nf-opening-services span { font-size: 11px; }
  .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: 0; padding: 36px 20px 0; display: flex; flex-direction: column; align-items: flex-start; }
  .nf-opening-copy { max-width: 100%; }
  .nf-opening-kicker { margin-bottom: 12px; }
  .nf-customer-ui .nf-home-opening h1 { font-size: clamp(36px, 10vw, 46px); line-height: 1.02; margin-bottom: 14px; }
  .nf-opening-copy > p:not(.nf-opening-kicker) { max-width: 310px; }
  .nf-opening-services { margin-top: 18px; }
  .nf-opening-location { margin-top: 22px; }
  .nf-opening-photo { position: relative; inset: auto; order: 3; width: calc(100% + 40px); max-width: none; height: 230px; margin: 30px -20px 0; transform: none; object-fit: cover; object-position: 68% center; border-radius: 26px 26px 0 0; mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 100%); }
  .nf-customer-ui #home-address-picker .modal-dialog { width: 100%; max-width: none; margin: 0; min-height: 100%; align-items: flex-end; }
  .nf-customer-ui #home-address-picker .modal-content { max-height: min(92dvh, 680px); border-radius: 28px 28px 0 0; padding-bottom: env(safe-area-inset-bottom); }
  .nf-customer-ui #home-address-picker .modal-content::before { content: ''; display: block; width: 42px; height: 4px; margin: 10px auto 0; border-radius: 99px; background: #d8d8de; }
  .nf-customer-ui #home-address-picker #main-search-banner { padding: 24px 20px 30px; }
  .nf-customer-ui #home-address-picker .nf-address-intro { padding-inline-end: 44px; }
  .nf-customer-ui #home-address-picker .nf-address-intro > i { width: 40px; height: 40px; flex-basis: 40px; border-radius: 12px; font-size: 22px; }
  .nf-customer-ui #home-address-picker h2 { font-size: 22px; }
  .nf-customer-ui #home-address-picker .home-search-wrap { margin-top: 22px; }
  .nf-customer-ui #home-address-picker .home-search-card > .d-flex { gap: 8px; }
}
@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; }
  .nf-customer-ui .nf-home-opening h1 { font-size: 30px; }
  .nf-opening-photo { width: calc(100% + 32px); margin-inline: -16px; height: 200px; }
  .nf-opening-location { font-size: 14px; gap: 6px; padding-inline: 14px; }
}
