/* ============================================================
   Poultry Gear — Homepage Mobile Polish
   Loaded ONLY on the homepage, ONLY at mobile widths.
   Desktop (>768px) is never affected.
   Managed by Novamira sandbox file: pg-mobile-home.php
   To remove everything: disable/delete that sandbox file.
   ============================================================ */

/* ---- Touch devices: swap the sticky hover-lift for a tactile press ---- */
@media (hover:none) and (pointer:coarse){
  .pg-hero .hero-product-card:hover,
  .cats-grid .cat-card:hover,
  .products-grid .product-card:hover,
  .why-grid .why-card:hover{ transform:none; }

  .cats-grid .cat-card:active,
  .products-grid .product-card:active{ transform:scale(.985); }

  .pg-hero .hero-btns .btn-primary:active,
  .pg-hero .hero-btns .btn-outline:active,
  .products-grid .prod-atc:active,
  .pg-hero .hpc-btn-cart:active,
  .pg-section .btn-primary:active{ transform:scale(.97); }

  .cat-card,.product-card,.prod-atc,
  .pg-hero .btn-primary,.pg-hero .btn-outline,
  .hpc-btn-cart{ transition:transform .12s ease; }
}

/* ---- Responsiveness hardening (homepage) ---- */
/* Bulletproof: never allow sideways scroll. `clip` does NOT create a
   scroll container, so the sticky header keeps working. */
@media (max-width:900px){
  html, body{ overflow-x:clip; max-width:100%; }
  /* Nothing on the page may exceed the viewport width */
  .pg-hero, .pg-trust, .pg-section, .pg-promo, .pg-why,
  .hero-inner, .section-inner, .trust-inner, .promo-grid,
  .cats-grid, .products-grid, .why-grid{ max-width:100%; }
  img{ max-width:100%; height:auto; }

  /* Smooth, fluid spacing so the layout scales between breakpoints
     instead of only snapping at 900px / 600px */
  .pg-section, .pg-section.bg-light, .pg-why{ padding:clamp(34px,7vw,60px) 0; }
  .section-inner{ padding-left:clamp(16px,4.5vw,28px); padding-right:clamp(16px,4.5vw,28px); }
}

/* Tablet / large-phone range: keep the 2-up grids breathing, not stretched */
@media (min-width:601px) and (max-width:900px){
  .cats-grid, .products-grid, .why-grid{ gap:18px; }
  .hero-product-card{ max-width:460px; }
}

/* ---- ≤600px (phones) ---- */
@media (max-width:600px){

  /* Bring the value proposition back — compact, max 3 lines */
  .pg-hero .hero-sub{
    display:-webkit-box !important;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
    font-size:13.5px;
    line-height:1.7;
    margin-top:0;
    margin-bottom:22px;
    color:rgba(255,255,255,.62);
  }

  /* Thumb-friendly hero CTAs */
  .pg-hero .hero-btns .btn-primary,
  .pg-hero .hero-btns .btn-outline{
    min-height:50px;
    padding-top:0;
    padding-bottom:0;
  }

  /* Equal-height product cards: clamp names to 2 lines + comfy add-to-cart */
  .products-grid .prod-name{
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    min-height:2.7em;
  }
  .products-grid .prod-atc{
    min-height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
  }

  /* Trust bar: allow wrapping instead of overflow on narrow screens */
  .pg-trust .trust-item{ text-align:center; }
  .pg-trust .trust-text{ white-space:normal !important; line-height:1.3; }

  /* Full-width, easy-to-hit "View all products" CTA (not the hero buttons) */
  .pg-section .btn-primary{
    display:inline-flex;
    width:100%;
    max-width:360px;
    justify-content:center;
    min-height:52px;
  }
}

/* ---- ≤380px (small phones): keep the two hero CTAs from crowding ---- */
@media (max-width:380px){
  .pg-hero .hero-btns{ gap:8px; }
  .pg-hero .hero-btns .btn-primary,
  .pg-hero .hero-btns .btn-outline{
    font-size:12px;
    padding-left:6px;
    padding-right:6px;
  }
}
