/* Phone and tablet layouts share the shop's white, blue and silver palette. */
@media (max-width: 800px) {
  :root {
    --mobile-nav-height: calc(68px + env(safe-area-inset-bottom, 0px));
    --mobile-consultant-space: 100px;
  }
  body { padding-bottom: calc(var(--mobile-nav-height) + var(--mobile-consultant-space)); }
  #home, #catalog, #service-info { scroll-margin-top: calc(124px + env(safe-area-inset-top, 0px)); }
  .container { width: min(calc(100% - 24px), var(--container)); }
  .site-header { padding-top: env(safe-area-inset-top, 0px); }
  .header-main { min-height: 64px; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 6px; }
  .header-main .logo { width: 104px; min-height: 52px; }
  .header-main .logo img { width: 94px; height: 48px; }
  .header-main .logo > span { right: 0; bottom: 8px; font-size: 9px; }
  .header-actions { gap: 0; min-width: 0; }
  .header-actions .language-switch { gap: 0; margin: 0; }
  .language-switch button { min-width: 44px; min-height: 44px; height: 44px; padding: 0 5px; font-size: 12px; }
  .menu-trigger { width: 44px; height: 44px; }
  .category-nav__inner { padding-inline: max(12px, env(safe-area-inset-left, 0px)); overscroll-behavior-x: contain; }
  .category-nav button { min-height: 44px; font-size: 13px; }
  .button--dark, .product-card__buy button:not(:disabled) {
    color: #fff; background: var(--blue); border-color: var(--blue); box-shadow: 0 3px 10px #071a331a;
  }
  .button--dark:hover, .product-card__buy button:not(:disabled):hover { background: var(--navy); }

  .store-hero { padding-top: 12px; }
  .hero-banner--storefront { min-height: 0; border-radius: 18px; }
  .hero-banner--storefront .hero-banner__content {
    width: 100%; max-width: none; min-height: 520px; padding: 24px 22px 200px;
  }
  .hero-banner--storefront .eyebrow { margin-bottom: 16px; font-size: 10px; }
  .hero-banner--storefront .hero-banner__content h1 {
    max-width: none; margin-bottom: 16px; font-size: clamp(30px, 8.2vw, 38px); line-height: 1.08; overflow-wrap: anywhere;
  }
  .hero-banner--storefront .hero-banner__content h1 em { color: #25496d; }
  .hero-banner--storefront .hero-banner__content p { margin-bottom: 20px; color: #203b56; font-size: 14px; line-height: 1.65; }
  .hero-banner--storefront .button-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .hero-banner--storefront .button-row .button { min-width: 0; min-height: 50px; padding: 10px; font-size: 12px; line-height: 1.4; white-space: normal; }
  .hero-banner--storefront .button--silver { background: #fffffff0; border-color: #8fa3b8; }
  .hero-banner--storefront .storefront-photo > img { object-position: 67% bottom; }
  .hero-banner--storefront::before {
    background: linear-gradient(180deg, #fffffdeb 0%, #fffffdd1 34%, #fffffd9e 50%, #fffffd3b 64%, transparent 78%);
  }
  .storefront-photo__expand { right: 12px; bottom: 12px; min-height: 44px; padding: 9px 12px; }

  .catalog-section { padding-block: 26px 36px; }
  .catalog-heading { margin-bottom: 16px; }
  .catalog-heading h2 { font-size: 36px; line-height: 1.08; }
  .catalog-heading p { color: #40546b; font-size: 14px; line-height: 1.6; }
  .stock-date { color: #40546b; font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
  .catalog-toolbar { gap: 10px; margin-bottom: 18px; padding: 12px; border-color: #b4c2d1; color: #40546b; }
  .catalog-toolbar__left { width: 100%; min-width: 0; gap: 6px; }
  .catalog-toolbar__left .result-count { margin-left: auto; }
  .catalog-toolbar__right { display: grid; grid-template-columns: minmax(0, 1fr); min-width: 0; gap: 10px; }
  .catalog-toolbar__right > [data-catalog-search] { display: block; width: 100%; min-width: 0; height: 46px; font-size: 16px; border-radius: 10px; }
  .filter-mobile-button { min-height: 44px; padding-inline: 12px; font-size: 14px; }
  .sort-control { min-width: 0; gap: 8px; font-size: 13px; }
  .sort-control select { min-width: 0; max-width: 72%; height: 44px; font-size: 16px; border-radius: 10px; }
  .active-filters { display: flex; flex-wrap: wrap; gap: 8px; }
  .active-filters button { min-height: 44px; max-width: 100%; padding: 8px 12px; font-size: 13px; overflow-wrap: anywhere; }

  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 10px; }
  .product-card { display: flex; flex-direction: column; min-width: 0; border-color: #b4c2d1; border-radius: 14px; box-shadow: 0 3px 12px #071a3310; }
  .product-card__visual { height: clamp(150px, 42vw, 205px); aspect-ratio: auto; padding: 14px; }
  .product-card__visual img { width: 100%; height: 100%; max-height: 100%; object-fit: contain; }
  .product-card__body { display: flex; flex: 1; flex-direction: column; min-width: 0; padding: 12px 10px; }
  .product-card__body > small { color: #344d67; font-size: 11px; line-height: 1.5; letter-spacing: .035em; overflow-wrap: anywhere; }
  .product-card__title { min-height: 3em; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
  .product-card__type { min-height: 2.8em; color: #40546b; font-size: 12px; line-height: 1.4; }
  .product-card__meta { color: #40546b; font-size: 11px; line-height: 1.5; }
  .product-card__buy { flex-direction: column; align-items: stretch; gap: 8px; margin-top: auto; padding-top: 14px; }
  .product-card__buy strong { font-size: 19px; line-height: 1.4; white-space: nowrap; }
  .product-card__buy button { width: 100%; min-height: 46px; padding: 8px 6px; border-radius: 10px; font-size: 13px; line-height: 1.35; }
  .favorite-button { top: 5px; right: 5px; width: 44px; height: 44px; }
  .load-more { width: 100%; min-height: 48px; justify-content: center; margin-top: 24px; font-size: 14px; }

  .mobile-bottom-nav {
    height: var(--mobile-nav-height); min-height: 0; padding: 0 env(safe-area-inset-right, 0px) env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px);
    grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: stretch;
  }
  .mobile-bottom-nav a, .mobile-bottom-nav button { min-width: 0; min-height: 68px; padding: 6px 2px; gap: 4px; font-size: 11px; line-height: 1.15; }
  .mobile-bottom-nav span { max-width: 100%; font-size: 11px; line-height: 1.2; overflow-wrap: anywhere; text-align: center; }
  .mobile-bottom-nav svg { flex-shrink: 0; width: 23px; height: 23px; }
  .mobile-bottom-nav .mobile-bottom-nav__consultant { color: var(--navy); font-weight: 700; }
  .mobile-bottom-nav__consultant svg { box-sizing: content-box; margin-top: -6px; padding: 7px; color: #fff; background: var(--navy); border: 3px solid #fff; border-radius: 14px; box-shadow: 0 3px 10px #071d3a1a; }
  .mobile-bottom-nav__consultant span { margin-top: -5px; font-size: 10px; letter-spacing: .04em; }
  /* Keep the signed launcher and its live availability status above navigation. */
  .ai-fab.laksi-launcher {
    display: flex; right: max(12px, env(safe-area-inset-right, 0px)); bottom: calc(var(--mobile-nav-height) + 12px);
    width: 228px; min-width: 0; max-width: calc(100vw - 24px); height: auto; min-height: 62px; padding: 10px 12px; gap: 10px;
    color: #fff; background: var(--blue); border: 1px solid #c4d0df; border-radius: 16px; box-shadow: 0 5px 18px #071a3333;
  }
  .ai-fab.laksi-launcher svg { flex: 0 0 24px; width: 24px; height: 24px; color: #fff; }
  .ai-fab.laksi-launcher .laksi-launcher__copy { display: grid; min-width: 0; gap: 3px; }
  .laksi-launcher__copy strong { color: #fff; font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
  .laksi-launcher__copy small { color: #edf3fa; font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
  .ai-fab.laksi-launcher:hover { background: var(--navy); }
  .toast { right: 12px; bottom: calc(var(--mobile-nav-height) + var(--mobile-consultant-space)); max-width: calc(100vw - 24px); font-size: 13px; }

  /* Fit the visible area, including when the on-screen keyboard opens. */
  .drawer, .modal {
    position: fixed; top: var(--dialog-viewport-top, 0px); right: 0; bottom: auto; left: 0;
    width: 100%; max-width: 100%; height: var(--dialog-viewport-height, 100dvh); max-height: var(--dialog-viewport-height, 100dvh);
    margin: 0; padding: max(16px, env(safe-area-inset-top, 0px)) 16px max(20px, env(safe-area-inset-bottom, 0px));
    border-radius: 0; overscroll-behavior-y: contain; overflow-x: hidden; overflow-y: auto;
  }
  .dialog-header { position: sticky; top: calc(-1 * max(16px, env(safe-area-inset-top, 0px))); z-index: 5; gap: 12px; align-items: center; min-height: 60px; margin-bottom: 20px; padding-block: 8px; background: #fff; }
  .dialog-header h2 { margin: 0; padding-bottom: 8px; font-size: clamp(26px, 7vw, 32px); line-height: 1.15; overflow-wrap: anywhere; }
  .dialog-close { width: 44px; height: 44px; }
  .dialog-close--floating { position: sticky; top: 0; float: right; margin-bottom: -44px; margin-left: auto; right: 0; z-index: 6; }
  .drawer-search { grid-template-columns: minmax(0, 1fr) auto; gap: 6px; }
  .drawer-search input { width: 100%; min-width: 0; font-size: 16px; border-radius: 10px; }
  .drawer-search .button { padding-inline: 16px; }
  .search-suggestions button { min-height: 44px; padding: 9px 12px; font-size: 13px; border-radius: 10px; }
  .search-result-item { grid-template-columns: 44px minmax(0, 1fr) auto; gap: 10px; }
  .search-result-item > span:first-child { width: 44px; height: 60px; }
  .search-result-item b { font-size: 13px; overflow-wrap: anywhere; }
  .search-result-item strong { font-size: 12px; white-space: nowrap; }
  .mobile-menu-links button { min-height: 54px; font-size: 24px; }
  .drawer-language { flex-wrap: wrap; gap: 12px; }
  .filters-panel select { min-width: 0; width: 100%; min-height: 46px; font-size: 16px; }
  .mobile-filter-controls .filters-panel { display: block !important; }
  .mobile-filter-controls .filters-panel > fieldset:first-of-type { display: block; }
  .filters-panel label:not(.stock-toggle) { display: grid; gap: 8px; width: 100%; margin-bottom: 16px; }
  .stock-toggle { min-height: 48px; align-items: center; font-size: 14px; }
  .mobile-filter-controls { margin-bottom: 20px; }
  .mini-item { grid-template-columns: 52px minmax(0, 1fr) 44px; gap: 10px; }
  .mini-item__image { width: 52px; height: 76px; }
  .mini-item h3 { font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
  .mini-item p { font-size: 12px; overflow-wrap: anywhere; }
  .mini-item > button { width: 44px; min-height: 44px; padding: 0; }
  .mini-item__actions { flex-wrap: wrap; gap: 8px; }
  .mini-item__actions button { min-width: 44px; min-height: 44px; padding: 6px; font-size: 16px; }
  .cart-footer { position: sticky; bottom: calc(-1 * max(20px, env(safe-area-inset-bottom, 0px))); margin: 20px -16px calc(-1 * max(20px, env(safe-area-inset-bottom, 0px))); padding: 16px 16px max(20px, env(safe-area-inset-bottom, 0px)); }
  .cart-footer > div { font-size: 14px; }
  .cart-footer > div strong { font-size: 21px; white-space: nowrap; }
  .cart-footer p { font-size: 12px; line-height: 1.55; }
  .continue-shopping { min-height: 44px; }
  .product-detail { gap: 20px; min-width: 0; }
  .product-gallery__main { min-height: 0; height: clamp(220px, 68vw, 310px); padding: 18px 40px; border-radius: 14px; }
  .product-info h2 { margin: 8px 0 14px; font-size: 25px; line-height: 1.2; overflow-wrap: anywhere; }
  .product-info .product-price { font-size: 30px; line-height: 1.3; }
  .quantity-row label { flex-wrap: wrap; gap: 12px; font-size: 14px; }
  .product-actions { position: sticky; bottom: calc(-1 * max(20px, env(safe-area-inset-bottom, 0px))); grid-template-columns: 1fr 1fr; gap: 8px; padding-block: 12px; }
  .product-actions .button { min-height: 48px; padding: 8px 10px; font-size: 13px; line-height: 1.4; }
  .product-tabs { gap: 12px; }
  .product-tabs button { flex: 1; min-width: 0; min-height: 48px; padding: 10px 0; font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
  .product-tab-panel { font-size: 15px; }
  .choice-grid { gap: 10px; }
  .choice-grid span { min-height: 64px; padding: 10px; font-size: 14px; overflow-wrap: anywhere; }
  .checkout-summary, .checkout-info { min-width: 0; }
  .summary-row { flex-wrap: wrap; font-size: 14px; }
  #ai-dialog { top: var(--ai-viewport-top, 0px); height: var(--ai-viewport-height, 100dvh); padding-inline: 16px; }
  #ai-dialog .dialog-header { position: static; padding-top: 0; }
  #ai-dialog .dialog-header h2 { padding-bottom: 0; }
  #ai-dialog .ai-chat { min-width: 0; }
  #ai-dialog .ai-input { min-height: 56px; }
  #ai-dialog .ai-input textarea { font-size: 16px; }
  #ai-dialog .ai-disclaimer { font-size: 11px; }
  .service-section { padding-block: 24px; }
  .service-grid h3 { font-size: 16px; }
  .service-grid p { font-size: 14px; line-height: 1.6; }
  .site-footer { padding-block: 32px 24px; }
  .footer-grid { gap: 24px 16px; padding-bottom: 24px; }
  .footer-grid a, .footer-grid button { min-height: 44px; margin-bottom: 0; padding-block: 10px; font-size: 14px; line-height: 1.5; }
  .footer-grid p { font-size: 13px; line-height: 1.6; }
  .footer-bottom { flex-wrap: wrap; gap: 12px; font-size: 12px; }
  .footer-bottom a { min-height: 44px; padding-block: 10px; }
}

@media (max-width: 359px) {
  .ai-fab.laksi-launcher { width: 210px; }
  .header-main .logo { width: 94px; }
  .header-main .logo img { width: 85px; }
  .hero-banner--storefront .hero-banner__content { padding-inline: 18px; }
  .product-grid { gap: 10px 8px; }
  .product-card__body { padding-inline: 9px; }
  .product-card__buy strong { font-size: 17px; }
  .sort-control { flex-wrap: wrap; }
  .sort-control select { max-width: 100%; width: 100%; }
}

@media (min-width: 561px) and (max-width: 800px) {
  .container { width: calc(100% - 40px); }
  .hero-banner--storefront .hero-banner__content { max-width: 68%; min-height: 440px; padding: 32px 30px 130px; }
  .hero-banner--storefront::before { background: linear-gradient(90deg, #fffffdeb, #fffffdd9 40%, #fffffdab 62%, transparent 83%); }
  .hero-banner--storefront .storefront-photo > img { object-position: 64% center; }
  .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .product-card__visual { height: 200px; }
  .product-card__title { font-size: 15px; }
}

@media (hover: none) {
  .product-card:hover, .button:hover { transform: none; }
}