/**
 * OMEGA — phone layout
 * Touch-first, compact, no cramped CTAs or 1-col category lists.
 */

@media (max-width: 767px) {
  html {
    overflow-x: clip;
  }

  body {
    overflow-x: clip;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  body.cart-open,
  body.filters-open,
  body.nav-open {
    overflow: hidden;
  }

  .container {
    padding-inline: 1rem;
  }

  /* ── Header ─────────────────────────────────────────────── */

  .site-header {
    padding-top: env(safe-area-inset-top, 0px);
  }

  .site-header__inner {
    grid-template-columns: 1fr auto !important;
    gap: 0.55rem !important;
    padding-block: 0.55rem !important;
    min-height: 0 !important;
  }

  .site-logo__mark {
    width: 2.15rem !important;
    height: 2.15rem !important;
    border-radius: 7px;
    font-size: 1rem;
  }

  .site-logo__name {
    font-size: 0.98rem !important;
  }

  .site-header__actions {
    gap: 0.1rem;
  }

  .header-action,
  .site-header__menu-toggle {
    min-width: 2.75rem !important;
    min-height: 2.75rem !important;
    width: 2.75rem;
    height: 2.75rem;
    padding: 0 !important;
    border-radius: 10px;
  }

  .site-search__form {
    height: 2.75rem;
    border-radius: 10px;
  }

  .site-search__input {
    font-size: 16px !important;
    padding-inline: 0.9rem;
  }

  .site-search__submit {
    width: 2.75rem;
  }

  .search-dropdown {
    left: 0;
    right: 0;
    width: auto;
    max-height: min(70vh, 24rem);
  }

  /* ── Hero ───────────────────────────────────────────────── */

  body[data-page="home"] .hero {
    min-height: min(58dvh, 28rem) !important;
  }

  body[data-page="home"] .hero__grid {
    padding-block: 4.25rem 1.5rem !important;
    align-content: end;
  }

  body[data-page="home"] .hero__brand {
    font-size: 2.15rem !important;
    margin-bottom: 0.55rem;
  }

  body[data-page="home"] .hero__title {
    font-size: 1.28rem !important;
    max-width: 18ch;
    margin-bottom: 0.55rem;
  }

  body[data-page="home"] .hero__text {
    font-size: 0.9375rem;
    margin-bottom: 1.1rem;
    max-width: none;
  }

  body[data-page="home"] .hero__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.55rem;
    width: 100%;
  }

  body[data-page="home"] .hero__actions .btn {
    width: 100%;
    justify-content: center;
    min-height: 2.85rem;
    padding-inline: 0.6rem;
    font-size: 0.875rem;
  }

  /* ── Benefits: equal-height 2×2 so 01/02 and 03/04 share one baseline ── */

  body[data-page="home"] .benefits-strip__grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: 1fr 1fr;
    align-items: stretch !important;
    gap: 0 !important;
  }

  body[data-page="home"] .benefit {
    align-self: stretch;
    height: auto;
    min-height: 0 !important;
    padding: 0.9rem 0.8rem !important;
    gap: 0.55rem !important;
    border-right: 1px solid var(--home-rule, #d4d9df) !important;
    border-bottom: 1px solid var(--home-rule, #d4d9df) !important;
  }

  body[data-page="home"] .benefit:nth-child(2n) {
    border-right: 0 !important;
  }

  body[data-page="home"] .benefit:nth-child(3),
  body[data-page="home"] .benefit:nth-child(4) {
    border-bottom: 0 !important;
  }

  body[data-page="home"] .benefit__title {
    font-size: 0.8125rem;
  }

  body[data-page="home"] .benefit__text {
    font-size: 0.75rem;
  }

  /* ── Sections ───────────────────────────────────────────── */

  body[data-page="home"] .section {
    padding-block: 1.75rem !important;
  }

  body[data-page="home"] .section__header,
  body[data-page="home"] .section__header--row {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.45rem;
    margin-bottom: 1rem;
  }

  body[data-page="home"] .section__title {
    font-size: 1.45rem !important;
  }

  body[data-page="home"] .section__text {
    font-size: 0.875rem;
  }

  body[data-page="home"] .catalog-band {
    grid-template-columns: 1fr !important;
    gap: 0.85rem;
    margin-bottom: 1rem;
  }

  body[data-page="home"] .catalog-band__stat {
    gap: 1.25rem 1.75rem;
  }

  body[data-page="home"] .catalog-band__stat strong {
    font-size: 2rem !important;
  }

  /* ── Categories: tidy 2-col tiles ───────────────────────── */

  body[data-page="home"] .category-grid,
  .category-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.65rem !important;
  }

  body[data-page="home"] .category-grid > .category-card--stack:nth-child(1),
  body[data-page="home"] .category-grid > .category-card--stack:nth-child(2) {
    grid-column: auto !important;
  }

  body[data-page="home"] .category-grid > .category-card--stack:nth-child(1) .category-card__link,
  body[data-page="home"] .category-grid > .category-card--stack:nth-child(2) .category-card__link {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }

  body[data-page="home"] .category-card--stack .category-card__thumb,
  body[data-page="home"] .category-grid > .category-card--stack:nth-child(1) .category-card__thumb,
  body[data-page="home"] .category-grid > .category-card--stack:nth-child(2) .category-card__thumb {
    aspect-ratio: 4 / 3 !important;
    min-height: 0 !important;
    max-height: none !important;
    height: auto !important;
  }

  body[data-page="home"] .category-card--stack .category-card__thumb img,
  body[data-page="home"] .category-grid > .category-card--stack:nth-child(1) .category-card__thumb img,
  body[data-page="home"] .category-grid > .category-card--stack:nth-child(2) .category-card__thumb img {
    position: static !important;
    padding: 0.65rem !important;
  }

  body[data-page="home"] .category-card--stack .category-card__body,
  body[data-page="home"] .category-grid > .category-card--stack:nth-child(1) .category-card__body,
  body[data-page="home"] .category-grid > .category-card--stack:nth-child(2) .category-card__body {
    padding: 0.7rem 0.75rem 0.8rem !important;
    min-height: 0 !important;
    border-left: 0 !important;
    border-top: 1px solid #eef1f4 !important;
  }

  body[data-page="home"] .category-card--stack .category-card__title,
  body[data-page="home"] .category-grid > .category-card--stack:nth-child(1) .category-card__title,
  body[data-page="home"] .category-grid > .category-card--stack:nth-child(2) .category-card__title {
    font-size: 0.98rem !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  body[data-page="home"] .category-card--stack .category-card__arrow {
    width: 1.65rem;
    height: 1.65rem;
  }

  /* ── Product cards: compact 2-col shop tiles ────────────── */

  .product-grid,
  body[data-page="home"] .product-grid,
  .page-shop .product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.65rem !important;
  }

  .product-card {
    position: relative;
    border-radius: 12px !important;
  }

  .product-card__image {
    padding: 0.65rem !important;
  }

  .product-card__body {
    padding: 0.65rem 0.7rem 0.75rem !important;
    gap: 0.2rem !important;
  }

  .product-card__meta {
    font-size: 0.62rem;
    letter-spacing: 0.04em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .product-card__brand {
    display: none;
  }

  .product-card__title {
    font-size: 0.8rem !important;
    line-height: 1.3 !important;
    min-height: 0 !important;
    -webkit-line-clamp: 2;
  }

  .product-card .stock,
  .product-card__desc,
  .product-card__sku {
    display: none !important;
  }

  .price,
  .price--quote {
    font-size: 0.8125rem !important;
  }

  .product-card__actions {
    position: absolute;
    top: 0.45rem;
    right: 0.45rem;
    margin: 0 !important;
    z-index: 2;
    width: auto;
    gap: 0;
  }

  .product-card__cta,
  .product-card__cta-secondary {
    display: none !important;
  }

  .product-card__wishlist {
    width: 2.35rem;
    height: 2.35rem;
    min-width: 2.35rem;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(18, 21, 26, 0.14);
    color: #15181d;
  }

  .product-card__wishlist:active {
    transform: scale(0.94);
  }

  .product-card:active {
    transform: scale(0.985);
  }

  /* ── Promo / why / brand / CTA ──────────────────────────── */

  body[data-page="home"] .promo-banner__stage {
    min-height: 0;
    border-radius: 12px;
  }

  body[data-page="home"] .promo-banner__media {
    min-height: 18.5rem !important;
  }

  body[data-page="home"] .promo-banner__content {
    margin: auto 0.75rem 0.75rem !important;
    padding: 1rem 1rem 1.05rem !important;
  }

  body[data-page="home"] .promo-banner__title {
    font-size: 1.45rem !important;
  }

  body[data-page="home"] .why-omega {
    grid-template-columns: 1fr !important;
  }

  body[data-page="home"] .why-omega__item {
    border-right: 0 !important;
    padding: 1.05rem 1rem;
  }

  body[data-page="home"] .brand-strip {
    padding: 1rem;
  }

  body[data-page="home"] .brand-strip__name {
    font-size: 1.65rem;
  }

  body[data-page="home"] .b2b-cta__inner {
    padding-block: 1.5rem;
    gap: 1rem;
  }

  body[data-page="home"] .b2b-cta .btn {
    width: 100%;
    justify-content: center;
  }

  /* ── Shop ───────────────────────────────────────────────── */

  .page-shop,
  .page-category {
    padding-bottom: 1.5rem;
  }

  .breadcrumbs {
    margin: 0.75rem 0 0.65rem;
    font-size: 0.75rem;
  }

  .page-header {
    margin-bottom: 0.85rem;
    padding-block: 0;
  }

  .page-header__title {
    font-size: 1.55rem !important;
  }

  .page-header__text {
    font-size: 0.875rem;
  }

  .shop-toolbar {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.65rem;
    margin-bottom: 0.85rem;
    padding-bottom: 0.75rem;
  }

  .shop-toolbar__summary {
    font-size: 0.8125rem;
  }

  .shop-toolbar__right {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100%;
    margin-left: 0 !important;
    gap: 0.5rem;
  }

  .shop-sort {
    width: auto !important;
    min-width: 0;
  }

  .shop-sort span {
    display: none;
  }

  .shop-sort select {
    width: 100%;
    min-width: 0 !important;
    min-height: 2.75rem;
    font-size: 16px !important;
  }

  .filters-mobile-toggle {
    min-height: 2.75rem;
    min-width: 5.75rem;
    padding-inline: 0.9rem;
    font-weight: 700;
  }

  /* Filters as a bottom sheet */
  .shop-sidebar {
    top: auto !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: min(86dvh, 40rem) !important;
    max-height: min(86dvh, 40rem) !important;
    border-radius: 18px 18px 0 0 !important;
    border: 0 !important;
    transform: translateY(110%) !important;
    box-shadow: 0 -18px 48px rgba(16, 18, 22, 0.18) !important;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  .shop-sidebar.is-open {
    transform: translateY(0) !important;
  }

  .shop-sidebar::before {
    content: "";
    display: block;
    width: 2.5rem;
    height: 4px;
    margin: 0.65rem auto 0.15rem;
    border-radius: 999px;
    background: #d5dae1;
    flex-shrink: 0;
  }

  .filters__head {
    padding-top: 0.35rem;
  }

  .filters__input,
  .filters__field input,
  .filters select {
    font-size: 16px !important;
    min-height: 2.75rem;
  }

  .filters__check {
    min-height: 2.75rem;
  }

  /* ── Mobile nav ─────────────────────────────────────────── */

  .mobile-nav__panel {
    width: min(22rem, 92vw);
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  .mobile-nav__list a {
    min-height: 3rem;
    padding-block: 0.85rem;
  }

  .mobile-nav__search input {
    font-size: 16px !important;
    min-height: 2.85rem;
  }

  /* ── Cart / footer / misc ───────────────────────────────── */

  .cart-drawer__panel {
    width: 100% !important;
    max-width: none !important;
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  .site-footer__grid {
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }

  .site-footer {
    padding-bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px));
  }

  .pagination {
    justify-content: center;
    gap: 0.35rem;
  }

  .toast-container {
    left: 0.75rem;
    right: 0.75rem;
    bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px));
  }

  .product-detail {
    grid-template-columns: 1fr !important;
    gap: 1.15rem;
  }

  .contact-layout,
  .checkout-layout {
    grid-template-columns: 1fr !important;
  }

  input,
  select,
  textarea {
    font-size: 16px;
  }
}

@media (max-width: 767px) and (hover: none) {
  .product-card:hover,
  .category-card:hover,
  body[data-page="home"] .product-card:hover,
  body[data-page="home"] .category-card:hover {
    transform: none;
    box-shadow: none !important;
  }

  .btn:active,
  .header-action:active,
  .category-card:active {
    transform: scale(0.98);
  }
}

@media (max-width: 380px) {
  .product-card__title {
    font-size: 0.75rem !important;
  }

  body[data-page="home"] .hero__actions {
    grid-template-columns: 1fr;
  }
}