/* Final mobile layout pass: consistent gutters, full-bleed sections and carousels. */
@media (max-width: 767.98px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
  }

  .page-shell,
  .site-main,
  .site-main > *,
  .site-footer,
  .site-footer > * {
    min-width: 0;
    box-sizing: border-box;
  }

  .site-main > section:not(.home-category-showcase, .brand-showcase, .popular-now-fullwidth, .hasan-sevki-premium) {
    width: 100%;
    max-width: 100%;
  }

  /* The editor control obscures cards on narrow screens. */
  .layout-settings { display: none !important; }

  /* Intentional edge-to-edge surfaces, sized from the page gutter instead of 100vw. */
  .home-category-showcase,
  .brand-showcase,
  .popular-now-fullwidth,
  .everyday-care-left,
  .interest-radar,
  .brand-club-grid,
  .hasan-sevki-premium {
    left: auto !important;
    width: calc(100% + 24px) !important;
    min-width: 0 !important;
    max-width: none !important;
    margin-right: -12px !important;
    margin-left: -12px !important;
  }

  .home-promotion-hero .campaign-slider {
    width: calc(100% + 24px);
    max-width: none;
    margin-left: -12px;
  }

  /* Promotion slider and flash sale keep stable geometry on every product state. */
  .home-promotion-hero .campaign-slider {
    height: 105px !important;
    min-height: 105px !important;
    max-height: 105px !important;
  }

  .home-promotion-hero .campaign-slide-link > picture > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .home-promotion-hero .flash-sale-panel {
    height: 284px !important;
    min-height: 284px !important;
    max-height: 284px !important;
  }

  .home-promotion-hero .flash-panel-heading {
    height: 58px !important;
    min-height: 58px !important;
    flex: 0 0 58px !important;
  }

  .home-promotion-hero .flash-product-render {
    height: 186px !important;
    min-height: 186px !important;
    max-height: 186px !important;
    flex: 0 0 186px !important;
    overflow: hidden;
  }

  .home-promotion-hero .flash-product-card {
    width: 100%;
    height: 186px !important;
    min-height: 186px !important;
    max-height: 186px !important;
  }

  .home-promotion-hero .flash-product-image {
    height: 116px !important;
    max-height: 116px !important;
    object-fit: contain;
  }

  .home-promotion-hero .flash-product-controls {
    height: 40px !important;
    min-height: 40px !important;
    flex: 0 0 40px !important;
  }

  /* Keep the complete compact masthead sticky; category navigation scrolls away. */
  .site-header {
    position: sticky;
    z-index: 190;
    top: 0;
  }

  .site-header.is-search-sticky .header-main {
    padding: 3px 0 4px;
    box-shadow: 0 8px 22px rgb(26 20 22 / 12%);
  }

  /* Categories are the only header section excluded from the sticky state. */
  .site-header.is-search-sticky .category-nav { display: none !important; }
  .site-header.is-mobile-header-expanded .category-nav { display: none !important; }
  .site-header.is-search-sticky .mobile-search-row { display: flex !important; }
  .site-header.is-search-sticky .mobile-menu-column { display: grid !important; }
  .site-header.is-search-sticky .header-search-column { display: block; width: auto; flex: 1 1 0; }
  .site-header.is-search-sticky .header-search { height: 36px; margin: 0; border: 1px solid #e8e8eb; background: #f5f5f6; }

  .header-search:focus-within,
  .header-main.search-is-open .header-search {
    border: 1px solid var(--brand-red);
    border-radius: 12px;
    box-shadow: 0 0 0 3px rgb(237 0 23 / 8%);
    animation: none !important;
    transform: none !important;
  }

  /* Components that previously expanded only toward the left. */
  .category-departments,
  .seasonal-discovery {
    width: 100%;
    margin-right: 0 !important;
    margin-left: 0 !important;
    border-right-width: 1px;
    border-left-width: 1px;
    border-radius: 18px;
  }

  /* Category department: full usable width and readable product cards. */
  .category-departments {
    padding: 16px 0 18px;
    background: transparent;
    box-shadow: none;
  }

  .category-departments__header { padding-inline: 2px; }
  .category-departments__header p { max-width: 100%; }
  .category-departments__columns { gap: 16px; }
  .category-department { padding: 6px; border-radius: 16px; }
  .category-department__cover { width: 100%; margin-bottom: 9px; aspect-ratio: 2.2 / 1; }
  .category-department__products {
    width: 100%;
    grid-template-columns: none !important;
    grid-template-rows: 1fr;
    grid-auto-columns: calc((100% - 10px) / 2) !important;
    grid-auto-flow: column;
    gap: 10px;
    padding: 2px 0 8px;
    scroll-padding-inline: 0;
    overscroll-behavior-inline: contain;
  }

  .category-department__products > .product-card { width: 100%; }
  .category-department__view-all { margin-top: 10px; }

  /* Brand wall: keep the full-width backdrop, align all inner content to the screen. */
  .brand-showcase__band { padding: 16px 10px; }
  .brand-showcase__view { width: 100%; border-radius: 17px; }
  .brand-showcase__catalog { width: 100%; padding: 16px 11px 10px; }
  .brand-showcase__filters { width: 100%; padding-right: 0; }
  .brand-showcase__products {
    width: 100%;
    grid-template-columns: none !important;
    grid-auto-columns: calc((100% - 10px) / 2) !important;
    grid-auto-flow: column;
    gap: 10px;
    padding: 4px 0 10px;
    scroll-padding-inline: 0;
    overscroll-behavior-inline: contain;
  }

  .brand-showcase .dense-product-card { width: 100%; min-height: 258px; }

  /* Brand club gets the same stable carousel geometry. */
  .brand-club-grid { padding: 18px 10px; }
  .brand-club-grid__showcase { width: 100%; border-radius: 17px; }
  .brand-club-grid__catalog { width: 100%; padding: 17px 10px 12px; }
  .brand-club-grid__products {
    width: 100%;
    grid-template-columns: none !important;
    grid-auto-columns: calc((100% - 10px) / 2) !important;
    grid-auto-flow: column;
    gap: 10px;
    padding: 2px 0 9px;
    overflow-x: auto;
    scroll-padding-inline: 0;
    overscroll-behavior-inline: contain;
  }

  .brand-club-product { width: 100%; min-height: 300px; }

  /* Personalized sections previously remained 24px short on the right. */
  .everyday-care-left,
  .interest-radar,
  .brand-club-grid {
    box-sizing: border-box;
    border-right-width: 0;
    border-left-width: 0;
    border-radius: 0;
  }

  .everyday-care-left__shop { padding-right: 12px; padding-left: 12px; }
  .everyday-care-left__products {
    width: calc(100% + 24px);
    margin-right: -12px;
    margin-left: -12px;
    padding-right: 12px;
    padding-left: 12px;
    scroll-padding-inline: 12px;
  }
  .everyday-care-card {
    flex: 0 0 calc((100% - 10px) / 2);
    width: calc((100% - 10px) / 2);
    min-width: calc((100% - 10px) / 2);
    max-width: calc((100% - 10px) / 2);
  }

  .interest-radar { padding-right: 12px; padding-left: 12px; }
  .interest-radar__filters,
  .interest-radar__carousel-shell { width: 100%; min-width: 0; }
  .interest-radar__products {
    width: 100%;
    grid-auto-columns: calc((100% - 10px) / 2) !important;
    gap: 10px;
    padding-right: 0;
    padding-left: 0;
    scroll-padding-inline: 0;
  }
  .interest-radar__products .product-card {
    width: 100%;
    min-width: 0;
    max-width: none;
  }

  /* Lifestyle + product pairs: no viewport-sized columns inside a padded parent. */
  .seasonal-discovery { padding: 22px 10px; }
  .seasonal-discovery__header { gap: 10px; margin-bottom: 18px; }
  .seasonal-discovery__deals {
    width: 100%;
    grid-template-columns: repeat(3, calc(100% - 14px)) !important;
    grid-template-rows: repeat(2, auto);
    grid-auto-flow: column;
    gap: 10px;
    padding: 2px 0 10px;
    scroll-padding-inline: 0 14px;
    overscroll-behavior-inline: contain;
  }

  .seasonal-deal { width: 100%; min-height: 274px; grid-template-columns: minmax(0, 1fr) minmax(142px, .92fr); }

  /* Other horizontal collections use their container, never the viewport, as the source of truth. */
  .popular-now-fullwidth { padding: 20px 12px; }
  .popular-now-fullwidth__deck { width: 100%; padding: 10px 7px 3px; }
  .popular-now-fullwidth__products { grid-auto-columns: calc((100% - 10px) / 2) !important; scroll-padding-inline: 0; }
  .budget-category-track { grid-auto-columns: calc(100% - 38px); padding-right: 0; }
  .budget-products { grid-auto-columns: calc((100% - 10px) / 2) !important; scroll-padding-inline: 0; }
  .category-banners__grid { width: 100%; margin-inline: 0; padding: 4px 0 13px; }
  .category-banner { min-width: calc(100% - 22px); flex-basis: calc(100% - 22px); }

  /* Two-up mobile product system: show useful choice without oversized cards. */
  .deal-products,
  .dense-products {
    grid-auto-columns: calc((100% - 10px) / 2) !important;
    gap: 10px !important;
    scroll-padding-inline: 0 !important;
  }

  .product-card {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 286px;
    border-radius: 13px;
  }

  .product-card-media,
  body[data-card-density="comfortable"] .product-card-media,
  body[data-card-density="compact"] .product-card-media {
    height: 126px;
    flex-basis: 126px;
    padding: 8px;
  }

  .product-card-body,
  body[data-card-density="comfortable"] .product-card-body,
  body[data-card-density="compact"] .product-card-body { padding: 2px 10px 10px; }
  .product-badges,
  body[data-card-density="compact"] .product-badges { width: 104px; height: 48px; }
  .product-favorite,
  body[data-card-density="compact"] .product-favorite { top: 7px; right: 7px; width: 27px; height: 27px; }
  .product-favorite img { width: 15px; }
  .product-title,
  body[data-card-density="comfortable"] .product-title,
  body[data-card-density="compact"] .product-title { min-height: 31px; font-size: 10px; line-height: 1.42; }
  .product-rating { gap: 3px; margin-top: 4px; }
  .product-rating b { font-size: 9px; }
  .product-rating small { font-size: 7px; }
  .product-price,
  body[data-card-density="compact"] .product-price { min-height: 29px; margin: 5px 0 6px; }
  .product-price del { font-size: 8px; }
  .product-price strong,
  body[data-card-density="compact"] .product-price strong { font-size: 14px; letter-spacing: -.25px; }
  .product-shipping,
  body[data-card-density="compact"] .product-shipping { min-height: 20px; margin: 3px 0; padding: 3px 4px; font-size: 7px; letter-spacing: .2px; }
  .product-cart-button,
  body[data-card-density="comfortable"] .product-cart-button,
  body[data-card-density="compact"] .product-cart-button { min-height: 33px; border-radius: 8px; gap: 5px; font-size: 8px; }
  .product-cart-button img { width: 14px; }

  .dense-product-card,
  body[data-card-density="compact"] .dense-product-card { min-height: 254px; border-radius: 13px; }
  .dense-product-card__media,
  body[data-card-density="compact"] .dense-product-card__media { height: 112px; flex-basis: 112px; margin: 6px 6px 0; }
  .dense-product-card__body,
  body[data-card-density="compact"] .dense-product-card__body { padding: 7px 9px 9px; }
  .dense-product-card h3,
  body[data-card-density="compact"] .dense-product-card h3 { min-height: 30px; font-size: 9px; line-height: 1.4; }
  .dense-product-card__cart,
  body[data-card-density="compact"] .dense-product-card__cart { height: 30px; font-size: 7px; }

  .brand-club-product__media { height: 126px; flex-basis: 126px; margin: 6px 6px 0; }
  .brand-club-product__media > span { top: 6px; left: 6px; padding: 4px 6px; font-size: 6px; }
  .brand-club-product__media > button { top: 6px; right: 6px; width: 27px; height: 27px; }
  .brand-club-product__body { padding: 8px 9px 9px; }
  .brand-club-product__body h4 { min-height: 31px; margin: 4px 0; font-size: 10px; line-height: 1.4; }
  .brand-club-product__price { margin-bottom: 6px; }
  .brand-club-product__price strong { font-size: 14px; }
  .brand-club-product__cart { height: 33px; border-radius: 8px; font-size: 7px; }

  .everyday-care-card { min-height: 300px; border-radius: 15px; }
  .everyday-care-card__media { height: 126px; margin: 6px; border-radius: 12px; }
  .everyday-care-card__media > img { padding: 23px 12px 13px; }
  .care-badge { top: 7px; left: 7px; max-width: 88px; padding: 4px 6px; font-size: 6px; }
  .care-favorite { top: 7px; right: 7px; width: 27px; height: 27px; font-size: 17px; }
  .care-delivery { right: 7px; bottom: 7px; padding: 4px 6px; font-size: 6px; }
  .everyday-care-card__body { padding: 5px 9px 9px; }
  .everyday-care-card h3 { min-height: 32px; margin: 6px 0; font-size: 10px; line-height: 1.4; }
  .care-rating { gap: 4px; }
  .care-rating span { padding: 3px 5px; font-size: 8px; }
  .care-rating small { font-size: 7px; }
  .care-price strong { font-size: 15px; }

  .deal-product-card { min-height: 326px; }
  .deal-product-image { height: 128px; }
  .deal-product-title { min-height: 32px; font-size: 10px; }

  /* Keep cart actions legible across every mobile product-card family. */
  .product-cart-button,
  body[data-card-density="comfortable"] .product-cart-button,
  body[data-card-density="compact"] .product-cart-button,
  .dense-product-card__cart,
  body[data-card-density="compact"] .dense-product-card__cart,
  .brand-club-product__cart,
  .similar-product-card__cart,
  .personalized-center-card__cart,
  .budget-cart,
  .deal-cart,
  .care-cart,
  .seasonal-deal__body button[data-seasonal-cart],
  .gogo-success-product__add-btn,
  .category-product-card__cart,
  .search-product-list article button {
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 8px;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.2;
  }

  .product-cart-button img,
  .dense-product-card__cart img,
  .brand-club-product__cart img,
  .similar-product-card__cart img,
  .budget-cart img,
  .deal-cart img,
  .seasonal-deal__body button[data-seasonal-cart] img { width: 16px !important; height: 16px; }

}

@media (prefers-reduced-motion: reduce) {
  .category-department__products,
  .brand-showcase__products,
  .brand-club-grid__products,
  .seasonal-discovery__deals { scroll-behavior: auto; }
}