/* SemSub mobile refinement v14: public storefront, product, blog and checkout. */
@media (max-width: 767px) {
  html, body { width: 100%; max-width: 100%; overflow-x: clip; }
  body { font-size: 15px; }
  body > main, body > section, body > div { max-width: 100%; }
  img, video, iframe, table { max-width: 100%; }

  /* Homepage: remove viewport-height gaps and keep a compact section rhythm. */
  .home-page .hero-glow { min-height: auto !important; margin-top: 0 !important; padding-top: 0 !important; }
  .home-page .hero-glow > .max-w-site { padding: 1.5rem 1rem 2rem !important; gap: 1.5rem !important; }
  .home-page .hero-cta-row { width: 100%; }
  .home-page .hero-cta-row .hero-cta { flex: 1 1 9rem; min-height: 44px; }
  .home-page .hero-glow form { max-width: 100% !important; }
  .home-page .hero-glow form > div { padding: 0.25rem !important; }
  .home-page .hero-glow form button { min-width: 6.25rem; padding-inline: 0.85rem !important; }
  .home-page .home-showcase-root > div:last-child { padding-top: 1.75rem !important; padding-bottom: 2rem !important; }
  .home-page .home-showcase-root .grid { gap: 1rem !important; }
  .home-page .home-hub-section { min-height: 0 !important; height: auto !important; }
  .home-page .home-hub-inner { min-height: 0 !important; padding: 2rem 1rem !important; }
  .home-page .home-hub-inner > div { gap: 1.25rem !important; }
  .home-page .home-hub-slide { opacity: 1 !important; transform: none !important; }
  .home-page .home-hub-marquee-track { animation: none !important; overflow-x: auto; max-width: 100%; padding-bottom: 0.25rem; }
  .home-page #how { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
  .home-page #how .mb-16 { margin-bottom: 2rem !important; }
  .home-page section.py-20, .home-page section.py-24, .home-page section.py-16, .home-page section.py-14 { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
  .home-page section .max-w-site { padding-left: 1rem !important; padding-right: 1rem !important; }
  .home-page .stats-grid { gap: 0.75rem !important; }
  .home-page .listing-showcase-card { min-height: 0 !important; border-radius: 1.15rem; }
  .home-page .listing-card-top { min-height: 0; padding: 0.7rem 0.65rem 0.9rem; }
  .home-page .listing-card-logo { flex-basis: 3.5rem; width: 3.5rem; height: 3.5rem; }
  .home-page .listing-card-info-panel { padding: 1rem 0.85rem 0.9rem; }
  .home-page .listing-card-buy { min-height: 44px; }
  .home-page .home-show-scroll { padding-bottom: 0.5rem; }

  /* Browse and cart: keep controls and line items inside the viewport. */
  .browse-page .browse-filter-bar,
  .browse-page .border-b.sticky { position: static !important; top: auto !important; z-index: auto !important; }
  .browse-page .border-b form { padding-inline: 0.875rem !important; gap: 0.55rem !important; }
  .browse-page .border-b form label { width: calc(50% - 0.3rem); min-width: 0 !important; flex: 1 1 calc(50% - 0.3rem) !important; }
  .browse-page .border-b form label:first-of-type { flex-basis: 100% !important; width: 100%; }
  .browse-page .border-b form button { width: 100%; }
  .browse-page .px-6 { padding-inline: 0.875rem !important; }
  .browse-page .max-w-site { max-width: 100%; }
  .browse-page .grid { gap: 1rem !important; }
  .cart-page > .max-w-site { padding: 1rem 0.875rem calc(2rem + env(safe-area-inset-bottom, 0px)) !important; }
  .cart-page > .max-w-site > .mb-8 { margin-bottom: 1.25rem !important; }
  .cart-page h1 { font-size: 1.75rem !important; line-height: 1.2; }
  .cart-page .grid { gap: 1rem !important; }
  .cart-page .grid > .space-y-6 { display: grid; gap: 1rem; }
  .cart-page .grid > .space-y-6 > div { padding: 1rem !important; gap: 0.9rem !important; }
  .cart-page .grid > .space-y-6 > div > .h-24 { width: 4.25rem; height: 4.25rem; }
  .cart-page .grid > .space-y-6 h3 { font-size: 1rem; line-height: 1.3; overflow-wrap: anywhere; }
  .cart-page .grid > .space-y-6 .text-xl { font-size: 1.05rem; }
  .cart-page .grid > .lg\:col-span-4 > div { position: static !important; padding: 1rem !important; }
  .cart-page .grid > .lg\:col-span-4 a { min-height: 48px; display: flex; align-items: center; justify-content: center; }

  /* Featured-card slider: compact pill indicators with a comfortable hit area. */
  .home-page .hero-featured-dots { min-height: 2rem; align-items: center; gap: 0.15rem; margin-top: 0.6rem; }
  .home-page .hero-featured-dot,
  .home-page .hero-featured-dot.is-active,
  .home-page .hero-featured-dot:hover {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: relative;
    width: 1.7rem !important;
    height: 2rem !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 9999px !important;
    background: transparent !important;
    transform: none !important;
    box-shadow: none !important;
  }
  .home-page .hero-featured-dot::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 9999px;
    background: rgb(148 163 184 / 0.6);
    transform: translate(-50%, -50%);
    transition: width 180ms ease, background 180ms ease;
  }
  .home-page .hero-featured-dot.is-active::before { width: 1.35rem; background: var(--primary, #0047bb); }
  .home-page .hero-featured-dot:hover::before { background: rgb(100 116 139 / 0.8); }

  /* Product page. */
  .gg-shop-page .gg-shop-wrap { width: 100%; max-width: 100%; padding: 1rem 0.875rem calc(2rem + env(safe-area-inset-bottom, 0px)); }
  .gg-shop-page .gg-back { min-height: 44px; margin-bottom: 0.75rem; }
  .gg-shop-page .gg-shop-grid { display: grid; grid-template-columns: minmax(0, 1fr) !important; gap: 1rem; }
  .gg-shop-page .gg-shop-main, .gg-shop-page .gg-sidebar { width: 100%; min-width: 0; }
  .gg-shop-page .gg-sidebar { position: static !important; top: auto !important; gap: 0.875rem; }
  .gg-shop-page .gg-card { border-radius: 12px; }
  .gg-shop-page .gg-product-card, .gg-shop-page .gg-desc-card, .gg-shop-page .gg-reviews-card, .gg-shop-page .gg-buy-card { padding: 1rem; }
  .gg-shop-page .gg-product-head { flex-direction: column; align-items: center; gap: 0.9rem; }
  .gg-shop-page .gg-product-thumb { width: 104px; height: 104px; border-radius: 12px; }
  .gg-shop-page .gg-product-head > .min-w-0 { width: 100%; }
  .gg-shop-page .gg-product-title { font-size: 1.35rem; line-height: 1.2; text-align: center; margin-bottom: 1rem; overflow-wrap: anywhere; }
  .gg-shop-page .gg-features-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 0.75rem; }
  .gg-shop-page .gg-feature { min-width: 0; }
  .gg-shop-page .gg-feature-value { overflow-wrap: anywhere; }
  .gg-shop-page .gg-notice { margin-top: 1rem; padding: 0.8rem; }
  .gg-shop-page .gg-desc-card, .gg-shop-page .gg-reviews-card, .gg-shop-page .gg-related { margin-top: 1rem; }
  .gg-shop-page .gg-meta-row, .gg-shop-page .gg-price-row { gap: 0.65rem; }
  .gg-shop-page .gg-meta-label { min-width: 0; }
  .gg-shop-page .gg-meta-value { flex: 0 0 auto; text-align: right; }
  .gg-shop-page .gg-price-value { font-size: 1.8rem; }
  .gg-shop-page .gg-buy-card .gg-btn-buy, .gg-shop-page .gg-btn-secondary { width: 100%; min-height: 48px; }
  .gg-shop-page .gg-related-grid { grid-template-columns: minmax(0, 1fr); }
  .gg-shop-page .gg-activation-recent li, .gg-shop-page .gg-activation-text { overflow-wrap: anywhere; }

  /* Blog index and article pages. */
  .blog-page, .blog-article-page { padding-bottom: 2rem; overflow-x: clip; }
  .blog-banner { padding: 1.25rem 1rem !important; }
  .blog-article-page > .blog-banner { padding-top: 1.25rem !important; }
  .blog-banner-inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.9rem; }
  .blog-banner-headline { min-width: 0; font-size: 1.2rem; overflow-wrap: anywhere; }
  .blog-banner-cta { width: 100%; min-height: 44px; padding: 0.7rem 1rem; text-align: center; }
  .blog-nav { display: block; min-height: 0; padding: 0 0.75rem; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .blog-nav-inner { width: max-content; min-width: 100%; flex-wrap: nowrap; padding: 0.55rem 0; }
  .blog-nav-link { min-height: 42px; padding: 0.6rem 0.8rem; white-space: nowrap; }
  .blog-nav-sep { display: none; }
  .blog-main-wrap, .blog-article-wrap { width: 100%; padding: 1.25rem 1rem 0; gap: 1.5rem; }
  .blog-featured { margin-bottom: 1.5rem; }
  .blog-featured-card { grid-template-columns: minmax(0, 1fr); border-radius: 12px; }
  .blog-featured-body { padding: 1.2rem; }
  .blog-featured-image { aspect-ratio: 16 / 9; }
  .blog-grid { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .blog-card-body { padding: 1rem; }
  .blog-sidebar { position: static; top: auto; }
  .blog-sidebar-cta, .blog-sidebar-widget { padding: 1rem; margin-bottom: 1rem; border-radius: 12px; }
  .blog-article-title { font-size: 1.75rem; line-height: 1.18; overflow-wrap: anywhere; }
  .blog-article-content .blog-article-byline { font-size: 0.82rem; line-height: 1.5; margin-bottom: 1rem; }
  .blog-article-image { margin-bottom: 1.25rem; border-radius: 10px; }
  .blog-article-body { padding-bottom: 1rem; }
  .blog-article-body .content { font-size: 1rem; line-height: 1.7; overflow-wrap: anywhere; }
  .blog-article-body .content h2 { margin-top: 1.5rem; font-size: 1.3rem; }
  .blog-article-body .content h3 { font-size: 1.1rem; }
  .blog-article-body .content pre, .blog-article-body .content table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .blog-article-body .content img, .blog-article-body .content iframe { height: auto; max-width: 100%; }
  .blog-pagination { margin-top: 1.5rem; padding-top: 1.25rem; }

  /* Checkout and confirmation. */
  .checkout-page-wrap { padding: 0.9rem 0 calc(2rem + env(safe-area-inset-bottom, 0px)) !important; }
  .checkout-container { width: 100%; max-width: 100%; padding: 0 0.875rem !important; }
  .checkout-breadcrumb { margin-bottom: 0.75rem; padding-bottom: 0.25rem; overflow-x: auto; white-space: nowrap; }
  .checkout-progress { flex-direction: row !important; align-items: center !important; justify-content: space-between !important; gap: 0.75rem !important; margin-bottom: 1rem; padding: 0.75rem !important; overflow: visible !important; }
  .checkout-progress .progress-step { flex: 1 1 0; max-width: none; gap: 0.5rem; }
  .checkout-progress .progress-step:not(:last-child)::after { display: none; }
  .checkout-progress .progress-step-number { width: 32px; height: 32px; font-size: 0.75rem; }
  .checkout-progress .progress-step-label { font-size: 0.72rem; line-height: 1.2; }
  .checkout-grid { display: flex !important; flex-direction: column !important; gap: 1rem !important; }
  .checkout-sidebar { order: 1 !important; position: static !important; width: 100% !important; padding: 1rem !important; }
  .checkout-main { order: 2 !important; width: 100% !important; padding: 1rem !important; }
  .checkout-main h1 { font-size: 1.65rem; }
  .checkout-lead { margin-bottom: 1.1rem; }
  .checkout-section { margin-bottom: 1.1rem; padding-bottom: 1.1rem; }
  .payment-method-card { padding: 0.8rem; }
  .payment-method-card label { gap: 0.7rem; }
  .payment-method-card .icon-wrap { width: 40px; height: 40px; }
  .payment-method-card .method-text { min-width: 0; }
  .payment-method-card .method-text .method-name, .payment-method-card .method-text .method-desc { overflow-wrap: anywhere; }
  .checkout-line-item-head, .order-summary-mini, .order-summary-row, .order-summary-total { gap: 0.75rem; }
  .checkout-line-item-title, .order-summary-mini .mini-title { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
  .checkout-security-note, .checkout-trust-note { padding: 0.8rem; }
  .checkout-submit { min-height: 48px; margin-top: 1rem; }
  .cs-no-print { width: 100%; padding: 0.75rem 0.875rem 2rem !important; }
  .cs-page { width: 100%; max-width: 100%; }
  .cs-card { border-radius: 14px; }
  .cs-processing { padding: 1.5rem 1rem; }
  .cs-processing-loader { width: 6rem; height: 6rem; }
  .cs-body { padding: 1rem; }
  .cs-meta-grid { grid-template-columns: minmax(0, 1fr); }
  .cs-toolbar { display: grid; grid-template-columns: minmax(0, 1fr); }
  .cs-tool-btn { width: 100%; min-height: 44px; justify-content: center; }
}

@media (min-width: 480px) and (max-width: 767px) {
  .gg-shop-page .gg-features-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .cs-meta-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 390px) {
  .home-page .hero-glow form > div { flex-wrap: wrap; }
  .home-page .hero-glow form button { width: 100%; }
  .checkout-progress .progress-step-label { font-size: 0.66rem; }
  .gg-shop-page .gg-meta-row { align-items: flex-start; }
}

/* SEMSUB MOBILE BUYER DASHBOARD + GLOBAL OPTIMIZATION PATCH */
@media (max-width: 767px) {
  html, body { overflow-x: hidden; }
  .container, .page-container, .dashboard-container, .account-container { width:100% !important; max-width:100% !important; padding-left:14px !important; padding-right:14px !important; }

  /* Buyer dashboard / account */
  .dashboard-grid, .account-grid, .profile-grid, .settings-grid { display:flex !important; flex-direction:column !important; gap:14px !important; }
  .dashboard-sidebar, .account-sidebar, .profile-sidebar { width:100% !important; position:static !important; }
  .dashboard-card, .account-card, .profile-card, .settings-card { width:100% !important; border-radius:16px !important; padding:16px !important; overflow:hidden; }
  .dashboard-table, table { display:block; width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .dashboard-actions, .action-buttons { display:grid !important; grid-template-columns:1fr !important; gap:10px !important; }
  .dashboard-actions a, .dashboard-actions button { width:100% !important; min-height:44px; }

  /* Cards/listings */
  .listing-grid, .products-grid, .cards-grid { grid-template-columns:1fr !important; }
  .listing-card, .product-card { width:100% !important; }
  .listing-title, .product-title, h1, h2 { overflow-wrap:anywhere; }

  /* Navigation */
  .nav-menu, .navbar-links { flex-wrap:wrap !important; }
  .navbar, header { max-width:100% !important; }

  /* Forms */
  input, select, textarea, button { max-width:100%; }
  form .row, .form-row { display:flex !important; flex-direction:column !important; gap:10px !important; }

  /* Messages/orders */
  .messages-layout, .orders-layout { display:flex !important; flex-direction:column !important; }
  .order-card, .message-card { width:100% !important; }
}

@media (max-width: 480px) {
  .dashboard-card, .account-card, .profile-card { padding:13px !important; }
  .btn, button { min-height:42px; }
  .mobile-hide { display:none !important; }
}
