/* ==========================================================================
   Breakpoint enhancements (Bootstrap 5 breakpoints).
   sm 576 · md 768 · lg 992 · xl 1200
   ========================================================================== */

/* ---- ≥ 576px ------------------------------------------------------------ */
@media (min-width: 576px) {
  .category-grid,
  .product-grid,
  .capability-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .facts-band__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .catalogue { grid-template-columns: auto minmax(0, 1fr); }
  .catalogue .btn-group { grid-column: 1 / -1; }
}

/* ---- ≥ 768px ------------------------------------------------------------ */
@media (min-width: 768px) {
  .site-header__inner { gap: var(--space-6); }
  .site-header__cta { display: inline-flex; margin-left: auto; }
  .nav-toggle { margin-left: 0; }

  .gallery-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

  .cta-panel { padding: var(--space-8) var(--space-7); }

  .site-footer__top { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---- ≥ 992px ------------------------------------------------------------ */
@media (min-width: 992px) {
  .intro { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-9); align-items: start; }

  .category-grid,
  .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  .quality { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-9); }

  .facts-band__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

  .catalogue { grid-template-columns: auto minmax(0, 1fr) auto; padding: var(--space-6) var(--space-7); }
  .catalogue .btn-group { grid-column: auto; }

  .cta-panel { grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-8); }

  .site-footer__top { grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); }
}

/* ---- ≥ 1200px: desktop navigation --------------------------------------- */
@media (min-width: 1200px) {
  .site-header__inner { height: var(--header-height); }
  .site-header.is-scrolled .site-header__inner { height: 72px; }
  .site-logo img { height: 58px; transition: height var(--duration) var(--ease); }
  .site-header.is-scrolled .site-logo img { height: 48px; }

  .site-nav { display: block; margin-left: auto; }
  .site-header__cta { margin-left: 0; }
  .nav-toggle { display: none; }

  .product-grid,
  .capability-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ---- < 768px: phones and small tablets ---------------------------------- */
@media (max-width: 767.98px) {
  .section-head { margin-bottom: var(--space-6); }

  /* Footer: brand and contact full width, the two link lists side by side. */
  .site-footer { font-size: 14px; }
  .site-footer__top {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-6) var(--space-5);
    padding-block: var(--space-7) var(--space-6);
  }
  .site-footer__top > :first-child,
  .site-footer__top > :last-child { grid-column: 1 / -1; }
  .site-footer__about p { margin-top: var(--space-4); }
}

/* ---- < 576px: phones ---------------------------------------------------- */
@media (max-width: 575.98px) {
  .btn-group .btn { width: 100%; }

  /* Product cards become compact rows: image left, text right. */
  .product-grid { gap: var(--space-3); }
  .product-card { flex-direction: row; }
  .product-card .media-plate {
    flex: none;
    width: 112px;
    aspect-ratio: auto;
    min-height: 120px;
  }
  .media-plate--product img { max-width: 78%; }
  .product-card__body { padding: var(--space-4); }
  .product-card__body .eyebrow { margin-bottom: 2px; font-size: 10.5px; letter-spacing: 0.08em; }
  .product-card__title { margin-bottom: 4px; font-size: 1rem; }
  .product-card__text {
    display: -webkit-box;
    margin-bottom: var(--space-2);
    overflow: hidden;
    font-size: 14px;
    line-height: 1.5;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
  .product-card .link-arrow { font-size: 14px; }

  /* Capability cards: icon beside the heading. */
  .capability-grid { gap: var(--space-3); }
  .capability-card {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    column-gap: var(--space-4);
    padding: var(--space-5);
  }
  .capability-card .icon { grid-row: span 2; width: 28px; height: 28px; margin: 2px 0 0; }
  .capability-card h3 { margin-bottom: 4px; }

  /* Fact list: narrower label column. */
  .fact-list > div {
    grid-template-columns: minmax(0, 6.5rem) minmax(0, 1fr);
    gap: var(--space-3);
    padding-block: var(--space-3);
  }
  .fact-list dd { font-size: 15px; }

  .category-tile { padding: var(--space-3) var(--space-4); }
  .category-tile__img { width: 60px; height: 60px; }

  .steps li { padding-bottom: var(--space-4); }

  .facts-band { padding-block: var(--space-7); }
  .facts-band__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5) var(--space-4); }
  .facts-band__grid > div { padding-left: var(--space-3); }
  .facts-band__grid dd { font-size: 1.0625rem; }

  .catalogue { gap: var(--space-4); padding: var(--space-5); }
  .catalogue__icon { width: 56px; height: 56px; }

  .cta-panel { padding: var(--space-6) var(--space-5); }
  .cta-panel h2 { font-size: 1.5rem; }
}

/* Touch screens: no hover zoom that "sticks" after a tap. */
@media (hover: none) {
  .product-card:hover { box-shadow: none; border-color: var(--color-border); }
  .product-card:hover .media-plate img,
  .gallery-grid figure:hover img { transform: none; }
}
