/* A finishing layer for the existing Afalina storefront. No external assets. */
.storefront {
  --bg: #faf9f6;
  --text: #23443e;
  --muted: #6d7a6e;
  --navy: #155e69;
  --navy-dark: #104b55;
  --border: #e5e8df;
  --shadow: 0 10px 30px #2a4b3a09;
  text-rendering: optimizeLegibility;
}
.storefront .container { width: min(1240px, calc(100% - 72px)); }
.storefront .utility-bar { background: #f1f3ec; border-color: #e9ece3; }
.storefront .utility-inner { min-height: 34px; font-size: 11px; letter-spacing: .015em; }
.storefront .utility-inner a { font-weight: 550; }
.storefront .topbar { background: #fffefbef; border-color: #e7e9e180; box-shadow: 0 4px 20px #2a4b3a04; }
.storefront .header-inner { min-height: 94px; }
.storefront .brand-title { font-size: 23px; font-weight: 750; letter-spacing: .10em; }
.storefront .brand-subtitle { font-size: 9px; letter-spacing: .10em; }
.storefront .header-nav { font-size: 13px; font-weight: 500; gap: 32px; margin-left: 42px; }
.storefront .header-nav a { position: relative; }
.storefront .header-nav a::after { content: ''; position: absolute; left: 0; right: 100%; bottom: 5px; height: 1px; background: #80936f; transition: right .18s ease; }
.storefront .header-nav a:hover::after { right: 0; }
.storefront .delivery-trigger { font-size: 12px; font-weight: 500; }
.storefront .cart-btn { border-radius: 12px; font-size: 13px; font-weight: 550; padding: 13px 19px; box-shadow: 0 5px 12px #155e6910; }
.storefront #cartCount { background: #e4eee2; font-size: 11px; }
.storefront .search-section { padding: 24px 0; }
.storefront .search-wrap { border-color: #dfe4d9; border-radius: 15px; padding: 6px 7px 6px 20px; box-shadow: 0 4px 14px #2d513306; }
.storefront .search-wrap input { font-size: 15px; }
.storefront .search-wrap button { background: #eef2e8; font-size: 13px; font-weight: 550; border-radius: 10px; min-width: 108px; }
.storefront .search-wrap:focus-within { outline: 2px solid #80987980; outline-offset: 2px; }
.storefront .hero-grocery .hero-grid { min-height: 410px; border-radius: 25px; border-color: #e8ecdf; background: #edf0e4; box-shadow: 0 12px 32px #4a5b3608; }
.storefront .hero-copy { padding: 42px 38px 39px 46px; }
.storefront .hero-kicker { font-size: 9px; font-weight: 600; letter-spacing: .15em; }
.storefront .hero-kicker>span { width: 6px; height: 6px; background: #8b9e77; }
.storefront .hero-grocery h1 { font-size: clamp(43px, 4.1vw, 60px); font-weight: 590; line-height: 1.1; letter-spacing: -.045em; margin: 21px 0 22px; color: #204b4b; }
.storefront .hero-grocery h1 em { color: #327375; font-weight: 400; }
.storefront .hero-grocery p { color: #68755f; line-height: 1.8; font-size: 14px; max-width: 365px; }
.storefront .hero-grocery .hero-actions { margin: 27px 0 19px; gap: 27px; }
.storefront .hero-grocery .primary-btn { min-height: 50px; padding: 14px 23px; font-size: 13px; font-weight: 550; border-radius: 12px; box-shadow: 0 5px 16px #155e6912; transition: box-shadow .18s, background .18s; }
.storefront .hero-grocery .primary-btn:hover { box-shadow: 0 8px 18px #155e6922; }
.storefront .hero-signature { color: #758568; font-size: 14px; }
.storefront .hero-benefits { color: #728165; font-size: 10px; }
.storefront .grocery-photo { min-height: 410px; }
.storefront .grocery-photo img { object-position: 54% 64%; }
.storefront .grocery-photo figcaption { transform: none; bottom: 25px; right: 25px; border: 1px solid #fffef2a6; border-radius: 50px; padding: 10px 16px; background: #fffef2e8; box-shadow: 0 4px 18px #31422510; backdrop-filter: blur(5px); }
.storefront .grocery-photo figcaption span { font-size: 11px; font-weight: 450; }
.storefront .grocery-photo .photo-badge-icon { font-size: 21px; }
.storefront .grocery-shortcuts { padding: 25px 0; gap: 11px; border-color: #e7e9df; }
.storefront .grocery-shortcuts>span { margin-right: 10px; font-weight: 450; font-size: 11px; }
.storefront .grocery-shortcuts button { background: #fffefa; border-color: #e1e6d9; min-height: 40px; font-weight: 450; padding: 10px 17px; transition: background .18s, border-color .18s; }
.storefront .grocery-shortcuts button>span { color: #8b9a7a; }
.storefront .categories-section { padding: 43px 0 30px; }
.storefront .section-head { margin-bottom: 27px; }
.storefront .eyebrow { font-size: 9px; letter-spacing: .14em; color: #7b8c6a; font-weight: 500; }
.storefront .section-head h2 { margin-top: 11px; font-size: 32px; line-height: 1.25; font-weight: 550; color: #29493f; letter-spacing: -.035em; }
.storefront .category-total { font-size: 11px; color: #8a9582; font-weight: 400; }
.storefront .catalog-breadcrumbs { margin-bottom: 23px; gap: 7px; }
.storefront .crumb { background: #f0f2e9; font-weight: 450; font-size: 11px; padding: 8px 12px; border-radius: 9px; }
.storefront .crumb.active { background: #e7eddf; font-weight: 550; }
.storefront .categories { gap: 17px; }
.storefront .category { min-height: 222px; padding: 10px 10px 18px; border-radius: 19px; border-color: #e5e9de; background: #fffefb; box-shadow: 0 3px 12px #30483003; }
.storefront .category:hover { transform: translateY(-3px); border-color: #b6c4a8; box-shadow: 0 12px 26px #3048300c; }
.storefront .category-art { border-radius: 12px; aspect-ratio: 1.12; margin-bottom: 15px; }
.storefront .category-photo { background: transparent; border-radius: 0; padding: 7px; mix-blend-mode: multiply; }
.storefront .category-art:has(.category-photo:not([hidden])) .food-art { visibility: hidden; }
.storefront .category-copy { padding: 0 22px 0 4px; gap: 5px; }
.storefront .category .name { font-size: 13px; font-weight: 550; line-height: 1.45; color: #34543f; }
.storefront .category small { font-size: 10px; color: #87917d; padding-top: 6px; }
.storefront .category-arrow { font-size: 18px; bottom: 19px; right: 15px; color: #9ba88b; }
.storefront .catalog-section { padding: 26px 0 35px; }
.storefront .products-grid { gap: 19px; }
.storefront .product-card { background: #fffefb; border: 1px solid #e4e8de; border-radius: 18px; padding: 15px 17px 18px; box-shadow: 0 3px 13px #30483003; transition: border-color .18s, box-shadow .18s; }
.storefront .product-card:hover { border-color: #c0cbb4; box-shadow: 0 9px 25px #3048300b; }
.storefront .product-image { background: #f2f4ed; border-radius: 12px; margin-bottom: 19px; }
.storefront .product-image.has-photo { height: 198px; background: #f7f7f0; overflow: hidden; }
.storefront .product-image img { object-fit: contain; padding: 14px 16px 22px; mix-blend-mode: normal; }
.storefront .category-image-note { position: absolute; bottom: 8px; left: 0; right: 0; text-align: center; font-size: 8px; font-weight: 400; line-height: 1.2; color: #8f9984; }
.storefront .product-name { font-size: 14px; line-height: 1.55; font-weight: 500; color: #2b493b; }
.storefront .product-meta { font-size: 11px; line-height: 1.65; color: #87917d; margin: 9px 0 18px; }
.storefront .product-bottom { padding-top: 16px; border-top: 1px solid #edf0e6; }
.storefront .product-price { font-size: 23px; font-weight: 600; letter-spacing: -.035em; color: #205953; }
.storefront .add-btn { min-height: 43px; padding: 11px 14px; font-weight: 500; font-size: 12px; color: #395c30; background: #e9efdf; border-radius: 10px; }
.storefront .add-btn:hover:not(:disabled) { background: #dce9cd; }
.storefront .product-card.unavailable { background: #f5f6f0; }
.storefront .product-card.unavailable .product-image { opacity: 1; }
.storefront .product-cart-count { color: #678250; }
.storefront .catalog-sync-note { color: #8b9580; font-size: 10px; }
.storefront .store-info-section { background: #eef1e6; padding: 47px 0; }
.storefront .store-info-grid { gap: 18px; }
.storefront .store-info-main h2 { font-weight: 550; font-size: 32px; line-height: 1.25; margin-bottom: 18px; }
.storefront .store-info-main p { font-size: 13px; line-height: 1.85; }
.storefront .info-card { border-radius: 16px; border-color: #e1e7d6; padding: 24px; background: #fffef8; }
.storefront .info-icon { background: #eef2e6; color: #829a6b; width: 41px; height: 41px; }
.storefront .info-card strong { font-weight: 550; font-size: 12px; }
.storefront .info-card p { font-size: 12px; line-height: 1.8; }
.storefront .delivery-card { background: #f7f8f0; border-color: #dde5d2; border-radius: 16px; padding: 25px; }
.storefront .delivery-rules:empty { display: none; }
.storefront .delivery-note { line-height: 1.7; }
.storefront footer { padding: 32px 0 40px; background: #fffef9; }
.storefront .footer-brand strong { font-weight: 650; letter-spacing: .11em; }
.storefront .footer-contact { line-height: 1.65; }
.storefront .drawer { box-shadow: -12px 0 45px #183e321c; }
.storefront .drawer-header h2 { font-weight: 550; }
.storefront .cart-item-name { font-size: 14px; line-height: 1.5; font-weight: 550; }
.storefront .qty-btn { width: 36px; height: 36px; border-radius: 10px; }
.storefront .drawer .total-row { font-weight: 550; }
.storefront .checkout-form { padding: 29px; gap: 19px; }
.storefront .dialog-head h2 { font-size: 25px; line-height: 1.25; font-weight: 550; color: #29493f; letter-spacing: -.03em; margin: 8px 0 0; }
.storefront .order-preview { background: #f4f6ed; border-color: #e1e7d6; border-radius: 14px; }
.storefront .checkout-form label { font-weight: 500; }
.storefront .checkout-form input,.storefront .checkout-form select,.storefront .checkout-form textarea { border-color: #dee5d4; border-radius: 11px; }
.storefront .checkout-form :is(input,select,textarea):focus-visible { outline: 2px solid #849d7080; outline-offset: 2px; }
.storefront.searching .catalog-section { padding-top: 18px; }
@media(max-width:1120px){
  .storefront .container { width: calc(100% - 52px); }
  .storefront .header-nav { margin-left: 20px; gap: 24px; }
  .storefront .hero-copy { padding: 34px; }
  .storefront .hero-grocery h1 { font-size: 45px; }
  .storefront .hero-grocery .hero-actions { gap: 20px; }
  .storefront .category { min-height: 226px; }
}
@media(max-width:920px){
  .storefront .header-inner { min-height: 82px; }
  .storefront .hero-copy { padding: 29px; }
  .storefront .hero-grocery h1 { font-size: 40px; }
  .storefront .hero-grocery p { font-size: 13px; }
  .storefront .hero-grocery .hero-grid,.storefront .grocery-photo { min-height: 380px; }
  .storefront .grocery-shortcuts { gap: 9px; }
  .storefront .grocery-shortcuts button { padding: 10px 13px; }
  .storefront .product-image.has-photo { height: 185px; }
}
@media(max-width:700px){
  .storefront .container { width: calc(100% - 32px); }
  .storefront .utility-inner { min-height: 29px; font-size: 10px; }
  .storefront .header-inner { min-height: 73px; gap: 10px; }
  .storefront .brand-title { font-size: 19px; letter-spacing: .08em; }
  .storefront .brand-subtitle { font-size: 8px; letter-spacing: .02em; }
  .storefront .cart-btn { padding: 11px 12px; min-height: 44px; font-size: 12px; }
  .storefront .search-section { padding: 16px 0; }
  .storefront .search-wrap { border-radius: 13px; padding: 4px 5px 4px 13px; gap: 8px; }
  .storefront .search-wrap input { font-size: 16px; min-width: 0; }
  .storefront .search-wrap input::placeholder { font-size: 13px; }
  .storefront .search-wrap button { min-width: 65px; padding: 0 14px; min-height: 41px; font-size: 12px; }
  .storefront .hero-grocery .hero-grid { min-height: 0; border-radius: 21px; }
  .storefront .hero-copy { padding: 26px 25px 24px; }
  .storefront .hero-kicker { font-size: 8px; }
  .storefront .hero-grocery h1 { font-size: 40px; margin: 15px 0 17px; line-height: 1.12; }
  .storefront .hero-grocery p { font-size: 13px; line-height: 1.75; }
  .storefront .hero-grocery .hero-actions { margin: 22px 0 15px; gap: 19px; }
  .storefront .hero-grocery .primary-btn { padding: 12px 16px; min-height: 45px; font-size: 12px; gap: 18px; border-radius: 11px; }
  .storefront .hero-signature { font-size: 12px; }
  .storefront .hero-benefits { font-size: 9px; }
  .storefront .grocery-photo { height: 182px; min-height: 182px; max-height: 182px; }
  .storefront .grocery-photo img { object-position: 50% 71%; }
  .storefront .grocery-photo figcaption { padding: 8px 12px; right: 17px; bottom: 17px; }
  .storefront .grocery-photo figcaption span { font-size: 10px; }
  .storefront .grocery-photo .photo-badge-icon { font-size: 19px; }
  .storefront .grocery-shortcuts { padding: 18px 0; gap: 9px; }
  .storefront .grocery-shortcuts button { min-height: 39px; font-size: 11px; padding: 10px 13px; }
  .storefront .categories-section { padding: 32px 0 24px; }
  .storefront .section-head { margin-bottom: 21px; }
  .storefront .section-head h2 { font-size: 25px; margin-top: 9px; }
  .storefront .eyebrow { font-size: 8px; }
  .storefront .category-total { font-size: 10px; }
  .storefront .catalog-breadcrumbs { margin-bottom: 18px; }
  .storefront .categories { gap: 12px; }
  .storefront .category { min-height: 211px; padding: 9px 9px 17px; border-radius: 16px; }
  .storefront .category-art { margin-bottom: 13px; border-radius: 10px; }
  .storefront .category-copy { padding: 0 20px 0 4px; }
  .storefront .category .name { font-size: 13px; line-height: 1.4; }
  .storefront .category small { font-size: 10px; }
  .storefront .category-arrow { right: 12px; bottom: 17px; font-size: 17px; }
  .storefront .catalog-section { padding: 22px 0 27px; }
  .storefront .products-grid { gap: 12px; }
  .storefront .product-card,.storefront.searching .product-card { padding: 10px 11px 14px; border-radius: 15px; contain-intrinsic-size: auto 355px; }
  .storefront .product-image { border-radius: 10px; margin-bottom: 14px; }
  .storefront .product-image.has-photo { height: 140px; }
  .storefront .product-image img { padding: 10px 8px 23px; }
  .storefront .category-image-note { font-size: 7px; bottom: 8px; }
  .storefront .product-name { font-size: 13px; line-height: 1.5; }
  .storefront .product-meta { font-size: 10px; margin: 8px 0 15px; }
  .storefront .product-price { font-size: 21px; }
  .storefront .product-bottom { padding-top: 13px; gap: 11px; }
  .storefront .add-btn { min-height: 44px; font-size: 12px; }
  .storefront .store-info-section { padding: 34px 0; }
  .storefront .store-info-grid { gap: 13px; }
  .storefront .store-info-main h2 { font-size: 27px; margin-bottom: 15px; }
  .storefront .info-card { padding: 21px 19px; border-radius: 15px; }
  .storefront .delivery-card { padding: 21px 19px; }
  .storefront footer { padding: 28px 0 48px; }
  .storefront .checkout-form { padding: 24px; }
}
@media(max-width:370px){
  .storefront .hero-copy { padding: 25px 22px 23px; }
  .storefront .hero-grocery h1 { font-size: 36px; }
  .storefront .brand-title { font-size: 18px; }
  .storefront .category .name { font-size: 12px; }
  .storefront .category { min-height: 201px; }
  .storefront .product-image.has-photo { height: 128px; }
}
@media(prefers-reduced-motion:reduce){.storefront .category:hover{transform:none}}

/* Editorial caption: preserve the original photograph, remove the badge. */
.storefront .grocery-photo::before{content:'';position:absolute;inset:45% 0 0;z-index:1;background:linear-gradient(transparent,rgba(29,45,32,.43));pointer-events:none}
.storefront .grocery-photo .hero-photo-caption{display:block;left:31px;right:auto;bottom:27px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;transform:none;color:#fffef7;z-index:2;text-shadow:0 1px 12px #152d2440}
.storefront .grocery-photo .hero-photo-caption .caption-kicker{display:block;font-family:inherit;font-size:9px;line-height:1.5;font-weight:500;letter-spacing:.16em;margin:0 0 11px}
.storefront .hero-photo-caption strong{font:400 34px/1.08 Georgia,'Times New Roman',serif;letter-spacing:-.025em}
.storefront .hero-photo-caption em{font-weight:400}
@media(max-width:700px){.storefront .grocery-photo .hero-photo-caption{left:22px;bottom:19px}.storefront .grocery-photo .hero-photo-caption .caption-kicker{font-size:7px;letter-spacing:.13em;margin-bottom:7px}.storefront .hero-photo-caption strong{font-size:26px}.storefront .grocery-photo::before{inset:25% 0 0}}

/* Product photography: neutral studio field, unmodified product colours. */
.storefront .product-image,
.storefront .product-image.has-photo {
  position: relative;
  height: 198px;
  background: #fff;
  border: 1px solid #eceee6;
  border-radius: 13px;
  overflow: hidden;
  isolation: isolate;
}
.storefront .product-image img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  padding: 16px 18px 25px;
  mix-blend-mode: normal;
  filter: none;
  opacity: 1;
  transition: transform .2s ease;
}
.storefront .photo-pending {
  display: block;
  font: 11px/1.5 'Segoe UI', sans-serif;
  letter-spacing: .01em;
  color: #98a091;
}
.storefront .product-image.has-photo > .photo-pending { display: none; }
.storefront .product-image-note {
  position: absolute;
  inset: auto 0 7px;
  text-align: center;
  font: 9px/1.4 'Segoe UI', sans-serif;
  letter-spacing: .015em;
  color: #7c8975;
}
.storefront .product-image-note[hidden] { display: none; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .storefront .product-card:hover .product-image img { transform: scale(1.025); }
}
@media (max-width: 640px) {
  .storefront .product-image, .storefront .product-image.has-photo { height: 145px; border-radius: 10px; }
  .storefront .product-image img { padding: 10px 10px 23px; }
  .storefront .product-image-note { font-size: 8px; }
}
