/* =====================================================================
   GNP Global — Mobile-first responsive overrides
   Applies on top of existing page styles.
   Breakpoints:
     ≤ 960px  — tablet / large phone (nav already handled in pages)
     ≤ 768px  — phone landscape + small tablet
     ≤ 480px  — phone portrait (primary mobile target)
   ===================================================================== */

/* ============================================================
   GLOBAL RESETS & BASE
   ============================================================ */
@media (max-width: 768px) {
  html, body {
    overflow-x: hidden;
  }

  /* Prevent any section from overflowing horizontally */
  section, footer, header, nav, .gnp-nav,
  .gnp-hero, .gnp-about, .gnp-stats, .gnp-catalog,
  .gnp-services, .gnp-regions, .gnp-suppliers, .gnp-contacts,
  .gnp-footer, .svc-hero, .svc-grid, .svc-process, .svc-advantages,
  .svc-cta, .abt-hero, .abt-mission, .abt-values, .abt-history,
  .abt-team, .abt-geo, .abt-cta-band, .cat-hero, .cat-body {
    max-width: 100%;
    overflow-x: hidden;
  }
}

/* ============================================================
   NAV — fine-tune for very small screens
   ============================================================ */
@media (max-width: 480px) {
  .gnp-nav__inner {
    padding: 4px 12px !important;
  }

  .gnp-logo-img {
    height: 64px !important;
  }

  .gnp-burger {
    width: 38px !important;
    height: 38px !important;
  }

  .gnp-mobile {
    top: 76px !important;
  }
}

/* ============================================================
   HERO (index.html)
   ============================================================ */
@media (max-width: 768px) {
  .gnp-hero {
    min-height: auto;
    padding: 0;
    background-position: center center;
    background-size: cover;
  }

  .gnp-hero__veil {
    background:
      linear-gradient(180deg,
        rgba(7, 16, 31, 0.92) 0%,
        rgba(7, 16, 31, 0.88) 60%,
        rgba(7, 16, 31, 0.80) 100%) !important;
  }

  .gnp-hero__inner {
    grid-template-columns: 1fr !important;
    padding: 60px 20px 48px !important;
    gap: 0 !important;
  }

  .gnp-hero__content {
    max-width: 100%;
  }

  .gnp-hero__title {
    font-size: clamp(30px, 8vw, 44px) !important;
    line-height: 1.08 !important;
    margin-bottom: 16px !important;
  }

  .gnp-hero__sub {
    font-size: 15px !important;
    margin-bottom: 28px !important;
    max-width: 100% !important;
  }

  .gnp-hero__cta {
    flex-direction: column;
    gap: 12px !important;
    align-items: stretch;
  }

  .gnp-btn-gold,
  .gnp-btn-ghost {
    width: 100%;
    justify-content: center;
    height: 52px !important;
    font-size: 15px !important;
  }

  .gnp-hero__stats {
    gap: 20px !important;
    margin-top: 36px !important;
    padding-top: 24px !important;
    flex-wrap: wrap;
  }

  .gnp-hero__stat-num {
    font-size: 22px !important;
  }

  .gnp-hero__stat-label {
    font-size: 11px !important;
  }

  .gnp-hero__eyebrow {
    font-size: 10px !important;
    padding: 5px 10px 5px 6px !important;
    margin-bottom: 18px !important;
  }
}

/* ============================================================
   ABOUT SECTION (index.html) — card grid
   ============================================================ */
@media (max-width: 768px) {
  .gnp-about__inner {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
    padding: 60px 20px !important;
  }

  .gnp-about__title {
    font-size: clamp(26px, 7vw, 38px) !important;
  }

  .gnp-about__grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }

  .gnp-feature {
    padding: 20px 16px !important;
  }

  .gnp-feature__title {
    font-size: 14px !important;
  }

  .gnp-feature__text {
    font-size: 13px !important;
  }
}

@media (max-width: 400px) {
  .gnp-about__grid {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================
   STATS BAR
   ============================================================ */
@media (max-width: 768px) {
  .gnp-stats__grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 0 !important;
  }

  .gnp-stat {
    padding: 24px 16px !important;
  }

  .gnp-stat__num {
    font-size: 28px !important;
  }

  .gnp-stat__label {
    font-size: 11px !important;
  }
}

@media (max-width: 400px) {
  .gnp-stats__grid {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* ============================================================
   CATALOG GRID (index.html)
   ============================================================ */
@media (max-width: 768px) {
  .gnp-catalog {
    padding: 60px 20px !important;
  }

  .gnp-catalog__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px !important;
    margin-bottom: 28px !important;
  }

  .gnp-catalog__title {
    font-size: clamp(24px, 6.5vw, 36px) !important;
  }

  .gnp-catalog__grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }

  .gnp-cat-card {
    padding: 16px 14px !important;
    gap: 8px !important;
  }

  .gnp-cat-card__icon {
    width: 40px !important;
    height: 40px !important;
    border-radius: 10px !important;
  }

  .gnp-cat-card__icon svg {
    width: 20px !important;
    height: 20px !important;
  }

  .gnp-cat-card__name {
    font-size: 13px !important;
    line-height: 1.3 !important;
  }

  .gnp-cat-card__count {
    font-size: 11px !important;
  }
}

@media (max-width: 400px) {
  .gnp-catalog__grid {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================
   SERVICES GRID (index.html)
   ============================================================ */
@media (max-width: 768px) {
  .gnp-services {
    padding: 60px 20px !important;
  }

  .gnp-services__head {
    margin-bottom: 28px !important;
  }

  .gnp-services__title {
    font-size: clamp(24px, 6.5vw, 36px) !important;
  }

  .gnp-services__grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .gnp-svc {
    padding: 20px 18px !important;
  }

  .gnp-svc__title {
    font-size: 15px !important;
  }

  .gnp-svc__text {
    font-size: 13px !important;
  }
}

/* ============================================================
   REGIONS GRID (index.html)
   ============================================================ */
@media (max-width: 768px) {
  .gnp-regions {
    padding: 60px 20px !important;
  }

  .gnp-regions__head {
    flex-direction: column;
    gap: 12px !important;
    margin-bottom: 28px !important;
  }

  .gnp-regions__title {
    font-size: clamp(24px, 6.5vw, 36px) !important;
  }

  .gnp-regions__sub {
    font-size: 14px !important;
  }

  .gnp-regions__grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }

  .gnp-region {
    padding: 16px !important;
  }

  .gnp-region__name {
    font-size: 14px !important;
  }
}

@media (max-width: 400px) {
  .gnp-regions__grid {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================
   SUPPLIERS (index.html)
   ============================================================ */
@media (max-width: 768px) {
  .gnp-suppliers {
    padding: 60px 20px !important;
  }

  .gnp-suppliers__title {
    font-size: clamp(24px, 6.5vw, 36px) !important;
  }

  .gnp-suppliers__sub {
    font-size: 15px !important;
  }

  .gnp-suppliers__body {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  .gnp-benefits {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }

  .gnp-benefit {
    padding: 20px 16px !important;
  }

  .gnp-benefit__title {
    font-size: 14px !important;
  }

  .gnp-benefit__text {
    font-size: 13px !important;
  }

  .gnp-suppliers__cta {
    flex-direction: column;
    align-items: stretch;
    margin-top: 32px !important;
  }

  .gnp-suppliers__cta .gnp-btn-gold,
  .gnp-suppliers__cta .gnp-btn-ghost {
    width: 100% !important;
    justify-content: center;
  }
}

@media (max-width: 400px) {
  .gnp-benefits {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================
   CONTACTS FORM (index.html)
   ============================================================ */
@media (max-width: 768px) {
  .gnp-contacts {
    padding: 60px 20px !important;
  }

  .gnp-contacts__inner {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  .gnp-contacts__title {
    font-size: clamp(24px, 6.5vw, 36px) !important;
  }

  .gnp-form__row {
    grid-template-columns: 1fr !important;
  }

  .gnp-form {
    padding: 24px 20px !important;
    border-radius: 16px !important;
  }

  .gnp-form__title {
    font-size: 18px !important;
  }

  .gnp-form__submit {
    width: 100%;
    height: 52px !important;
    font-size: 15px !important;
  }
}

/* ============================================================
   FOOTER (all pages)
   ============================================================ */
@media (max-width: 768px) {
  .gnp-footer {
    padding: 48px 20px 28px !important;
  }

  .gnp-footer__top {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }

  .gnp-footer__bottom {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }

  .gnp-footer__legal {
    flex-wrap: wrap;
    gap: 12px !important;
  }

  .gnp-footer__brand-sub {
    font-size: 13px !important;
  }

  .gnp-footer__col-title {
    font-size: 12px !important;
  }

  .gnp-footer__link {
    font-size: 13px !important;
  }

  .gnp-footer__copy {
    font-size: 12px !important;
  }
}

/* ============================================================
   SECTION EYEBROWS & GENERIC TYPOGRAPHY
   ============================================================ */
@media (max-width: 768px) {
  .gnp-section-eyebrow {
    font-size: 10px !important;
    letter-spacing: 0.12em !important;
  }
}

/* ============================================================
   ABOUT PAGE (about.html)
   ============================================================ */
@media (max-width: 768px) {
  /* Hero */
  .abt-hero {
    padding: 56px 20px 40px !important;
  }

  .abt-hero__inner {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  .abt-hero__title {
    font-size: clamp(28px, 7.5vw, 44px) !important;
    line-height: 1.08 !important;
  }

  .abt-hero__sub {
    font-size: 15px !important;
  }

  .abt-hero__cta {
    flex-direction: column;
    align-items: stretch;
    gap: 12px !important;
  }

  .abt-hero__cta .gnp-btn-gold,
  .abt-hero__cta .gnp-btn-ghost {
    width: 100% !important;
    justify-content: center;
  }

  .abt-hero__stats {
    grid-template-columns: 1fr 1fr !important;
    gap: 0 !important;
  }

  .abt-stat__num {
    font-size: 26px !important;
  }

  .abt-stat__label {
    font-size: 11px !important;
  }

  /* Mission */
  .abt-mission {
    padding: 60px 20px !important;
  }

  .abt-mission__inner {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  .abt-mission__title {
    font-size: clamp(24px, 6.5vw, 36px) !important;
  }

  .abt-mission__text {
    font-size: 15px !important;
  }

  .abt-mission__cta {
    flex-direction: column;
    align-items: stretch;
    gap: 12px !important;
  }

  .abt-mission__cta .gnp-btn-gold,
  .abt-mission__cta .gnp-btn-ghost {
    width: 100% !important;
    justify-content: center;
  }

  .abt-mission__badge-wrap {
    padding: 24px 20px !important;
    border-radius: 16px !important;
  }

  /* Values */
  .abt-values {
    padding: 60px 20px !important;
  }

  .abt-values__title {
    font-size: clamp(22px, 6vw, 34px) !important;
  }

  .abt-values__grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }

  .abt-val {
    padding: 20px 16px !important;
  }

  .abt-val__title {
    font-size: 15px !important;
  }

  .abt-val__text {
    font-size: 13px !important;
  }

  /* History / Timeline */
  .abt-history {
    padding: 60px 20px !important;
  }

  .abt-history__title {
    font-size: clamp(22px, 6vw, 34px) !important;
  }

  .abt-timeline {
    padding-left: 20px !important;
  }

  .abt-tl-item {
    gap: 16px !important;
    padding-bottom: 28px !important;
  }

  .abt-tl-item__year {
    font-size: 14px !important;
    width: 52px !important;
    flex-shrink: 0;
  }

  .abt-tl-item__title {
    font-size: 15px !important;
  }

  .abt-tl-item__text {
    font-size: 13px !important;
  }

  /* Team */
  .abt-team {
    padding: 60px 20px !important;
  }

  .abt-team__title {
    font-size: clamp(22px, 6vw, 34px) !important;
  }

  .abt-team__grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .abt-member {
    padding: 24px 20px !important;
  }

  /* Geo */
  .abt-geo {
    padding: 60px 20px !important;
  }

  .abt-geo__title {
    font-size: clamp(22px, 6vw, 34px) !important;
  }

  /* CTA band */
  .abt-cta-band {
    padding: 56px 20px !important;
  }

  .abt-cta-band__title {
    font-size: clamp(26px, 7vw, 40px) !important;
  }

  .abt-cta-band__actions {
    flex-direction: column;
    align-items: stretch;
    gap: 12px !important;
  }

  .abt-cta-band__actions .gnp-btn-gold,
  .abt-cta-band__actions .gnp-btn-ghost,
  .abt-cta-band__actions a {
    width: 100% !important;
    justify-content: center;
  }
}

@media (max-width: 400px) {
  .abt-values__grid {
    grid-template-columns: 1fr !important;
  }

  .abt-hero__stats {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* ============================================================
   CATALOG PAGE (catalog.html)
   ============================================================ */
@media (max-width: 768px) {
  .cat-hero {
    padding: 48px 20px 36px !important;
  }

  .cat-hero__title {
    font-size: clamp(26px, 7vw, 40px) !important;
  }

  .cat-hero__sub {
    font-size: 15px !important;
  }

  .cat-body {
    padding: 32px 20px 64px !important;
  }

  .cat-body__inner {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  /* Sidebar filters become top strip */
  .cat-sidebar {
    position: static !important;
    top: auto !important;
    width: 100% !important;
    padding: 20px !important;
    border-radius: 14px !important;
  }

  .cat-sidebar__title {
    font-size: 15px !important;
    margin-bottom: 16px !important;
  }

  /* Product grid */
  .cat-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }

  .cat-card {
    padding: 16px 14px !important;
    border-radius: 14px !important;
  }

  .cat-card__name {
    font-size: 14px !important;
    -webkit-line-clamp: 2 !important;
  }

  .cat-card__desc {
    font-size: 13px !important;
    -webkit-line-clamp: 3 !important;
  }

  .cat-card__meta {
    font-size: 11px !important;
  }

  .cat-card__btn {
    font-size: 13px !important;
    height: 36px !important;
    padding: 0 14px !important;
  }

  /* Search bar */
  .cat-search {
    padding: 0 20px;
    margin-bottom: 20px !important;
  }

  .cat-search__input {
    font-size: 15px !important;
    height: 48px !important;
    padding: 0 16px 0 44px !important;
  }

  /* Modal in catalog */
  .cat-modal-overlay,
  .svc-modal-overlay {
    padding: 12px !important;
    align-items: flex-end !important;
  }

  .cat-modal,
  .svc-modal {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 20px 20px 0 0 !important;
    max-height: 90vh !important;
    overflow-y: auto !important;
    padding: 24px 20px 32px !important;
  }

  .cat-modal__header,
  .svc-modal__header {
    margin-bottom: 20px !important;
  }

  .cat-modal__title,
  .svc-modal__title {
    font-size: 18px !important;
  }
}

@media (max-width: 480px) {
  .cat-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================
   SERVICES PAGE (services.html)
   ============================================================ */
@media (max-width: 768px) {
  /* Hero */
  .svc-hero {
    padding: 56px 20px 40px !important;
  }

  .svc-hero__inner {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  .svc-hero__title {
    font-size: clamp(26px, 7vw, 40px) !important;
    line-height: 1.08 !important;
  }

  .svc-hero__lead {
    font-size: 15px !important;
  }

  .svc-hero__stats {
    grid-template-columns: 1fr 1fr !important;
    gap: 0 !important;
  }

  .svc-hero__stat-num {
    font-size: 24px !important;
  }

  .svc-hero__stat-label {
    font-size: 11px !important;
  }

  /* Services grid */
  .svc-grid {
    padding: 60px 20px !important;
  }

  .svc-grid__title {
    font-size: clamp(22px, 6vw, 34px) !important;
  }

  .svc-grid__desc {
    font-size: 15px !important;
  }

  .svc-cards {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .svc-card {
    padding: 22px 18px !important;
  }

  .svc-card__name {
    font-size: 16px !important;
  }

  .svc-card__desc {
    font-size: 13px !important;
  }

  .svc-card__btn {
    font-size: 13px !important;
    height: 36px !important;
    padding: 0 14px !important;
  }

  /* Process steps */
  .svc-process {
    padding: 60px 20px !important;
  }

  .svc-process__title {
    font-size: clamp(22px, 6vw, 34px) !important;
  }

  .svc-steps {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  .svc-step {
    padding: 22px 18px !important;
  }

  .svc-step__title {
    font-size: 16px !important;
  }

  .svc-step__desc {
    font-size: 13px !important;
  }

  /* Advantages */
  .svc-advantages {
    padding: 60px 20px !important;
  }

  .svc-advantages__title {
    font-size: clamp(22px, 6vw, 34px) !important;
  }

  .svc-adv-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .svc-adv-item {
    padding: 20px 18px !important;
  }

  .svc-adv-item__title {
    font-size: 15px !important;
  }

  .svc-adv-item__text {
    font-size: 13px !important;
  }

  /* CTA section */
  .svc-cta {
    padding: 56px 20px !important;
  }

  .svc-cta__title {
    font-size: clamp(26px, 7vw, 40px) !important;
  }

  .svc-cta__desc {
    font-size: 15px !important;
  }

  .svc-cta__actions {
    flex-direction: column;
    align-items: stretch;
    gap: 12px !important;
  }

  .svc-cta__actions .gnp-btn-gold,
  .svc-cta__actions .gnp-btn-ghost,
  .svc-cta__actions a {
    width: 100% !important;
    justify-content: center;
  }

  /* Service modal — sheet from bottom */
  .svc-modal-overlay {
    padding: 0 !important;
    align-items: flex-end !important;
  }

  .svc-modal {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 20px 20px 0 0 !important;
    max-height: 92vh !important;
    overflow-y: auto !important;
    margin: 0 !important;
  }

  .svc-modal__close {
    width: 36px !important;
    height: 36px !important;
    font-size: 20px !important;
  }

  .svc-modal__title {
    font-size: 18px !important;
  }

  .svc-modal__submit,
  .svc-modal__cancel {
    width: 100%;
    justify-content: center;
  }

  .svc-modal__footer {
    flex-direction: column;
    gap: 10px !important;
  }
}

/* ============================================================
   TOUCH TARGETS — ensure all interactive elements ≥ 44px
   ============================================================ */
@media (max-width: 768px) {
  .gnp-nav__link,
  .gnp-mobile__link {
    min-height: 44px;
  }

  .gnp-mobile__lang-btn {
    min-height: 44px;
  }

  .gnp-btn-gold,
  .gnp-btn-ghost {
    min-height: 44px;
  }

  .gnp-form__input,
  .gnp-form__textarea {
    font-size: 16px !important; /* prevent iOS zoom */
  }

  input, textarea, select {
    font-size: 16px !important; /* prevent iOS zoom on all inputs */
  }

  .svc-card__btn,
  .cat-card__btn {
    min-height: 44px;
  }
}

/* ============================================================
   VISUAL SECTION STRIPS — compact padding on mobile
   ============================================================ */
@media (max-width: 768px) {
  /* Generic light-bg sections */
  .gnp-about,
  .gnp-suppliers {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* Generic dark-bg sections */
  .gnp-catalog,
  .gnp-services,
  .gnp-regions,
  .gnp-contacts,
  .gnp-stats {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

/* ============================================================
   LANG DROPDOWN — ensure usable on small screens
   ============================================================ */
@media (max-width: 480px) {
  .gnp-mobile__lang-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  .gnp-mobile__lang-btn {
    font-size: 13px !important;
    height: 44px !important;
    padding: 0 10px !important;
  }
}

/* ============================================================
   HIDE HERO DECORATIVE ELEMENTS ON VERY SMALL SCREENS
   ============================================================ */
@media (max-width: 360px) {
  .gnp-hero__eyebrow-dot::after {
    display: none;
  }
}

/* ============================================================
   ENSURE NO HORIZONTAL OVERFLOW FROM LONG WORDS
   ============================================================ */
@media (max-width: 768px) {
  h1, h2, h3, h4, p, span, a, div {
    word-break: break-word;
    overflow-wrap: break-word;
  }
}

/* ============================================================
   CATALOG PAGE — current tile/panel/card structure
   ============================================================ */

/* ── Cat page wrapper ── */
@media (max-width: 768px) {
  .cat-page {
    padding: 40px 14px 72px !important;
  }

  .cat-page__title {
    font-size: clamp(26px, 7vw, 38px) !important;
    margin-bottom: 32px !important;
  }

  /* Category tile grid: 2 cols on phones */
  .cat-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }

  /* Tiles */
  .cat-tile {
    padding: 12px 10px 12px 12px !important;
    gap: 10px !important;
    min-height: 60px;
    border-radius: 14px !important;
  }

  .cat-tile__icon {
    width: 38px !important;
    height: 38px !important;
    border-radius: 10px !important;
    flex-shrink: 0;
  }

  .cat-tile__icon svg {
    width: 18px !important;
    height: 18px !important;
  }

  .cat-tile__name {
    font-size: 12px !important;
    line-height: 1.3 !important;
  }

  .cat-tile__count {
    font-size: 10px !important;
  }

  /* Sub-panel */
  .sub-panel {
    padding: 14px 12px 16px !important;
    border-radius: 14px !important;
  }

  .sub-panel__name {
    font-size: 14px !important;
  }

  /* Sub-item list — flex column on all sizes (set in page CSS) */
  .sub-list {
    gap: 6px !important;
  }

  .sub-item {
    padding: 12px 12px !important;
    gap: 10px !important;
    min-height: 52px;
    border-radius: 10px !important;
  }

  .sub-item__ico {
    width: 34px !important;
    height: 34px !important;
    border-radius: 8px !important;
    flex-shrink: 0;
  }

  .sub-item__ico svg {
    width: 16px !important;
    height: 16px !important;
  }

  .sub-item__name {
    font-size: 12px !important;
  }

  .sub-item__hint {
    font-size: 10px !important;
  }

  /* Product area */
  .prod-area {
    border-radius: 12px !important;
  }

  .prod-area__toggle {
    padding: 12px 12px !important;
    min-height: 52px;
  }

  .prod-area__toggle-icon {
    width: 28px !important;
    height: 28px !important;
  }

  .prod-area__toggle-name {
    font-size: 12px !important;
  }

  .prod-area__toggle-count {
    font-size: 10px !important;
    padding: 2px 6px !important;
  }

  .prod-area__body {
    padding: 10px !important;
  }

  /* Product card grid: 2 cols on phone */
  .pcard-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }

  .pcard {
    border-radius: 10px !important;
  }

  .pcard__name {
    font-size: 11px !important;
  }

  .pcard__desc {
    font-size: 10px !important;
  }

  .pcard__btn {
    font-size: 9.5px !important;
    height: auto !important;
    min-height: 30px;
    padding: 6px 4px !important;
  }
}

/* ── Very small phones ── */
@media (max-width: 400px) {
  .cat-grid {
    grid-template-columns: 1fr !important;
  }

  .pcard-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .cat-tile {
    border-radius: 12px !important;
  }
}

/* ============================================================
   CONTACTS PAGE (contacts.html)
   ============================================================ */
@media (max-width: 768px) {
  .cnt-hero {
    padding: 56px 20px 40px !important;
  }

  .cnt-hero__title {
    font-size: clamp(28px, 7.5vw, 44px) !important;
  }

  .cnt-hero__sub {
    font-size: 15px !important;
  }

  .cnt-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .cnt-card {
    padding: 22px 18px !important;
    border-radius: 14px !important;
  }

  .cnt-card--wide {
    grid-column: auto !important;
  }

  .cnt-map {
    padding: 0 20px !important;
    margin-bottom: 40px !important;
  }

  .cnt-cta {
    padding: 56px 20px !important;
  }

  .cnt-cta__title {
    font-size: clamp(24px, 6.5vw, 36px) !important;
  }

  /* Contact modal */
  .cnt-modal-overlay {
    padding: 0 !important;
    align-items: flex-end !important;
  }

  .cnt-modal {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 20px 20px 0 0 !important;
    max-height: 92vh !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 28px 18px calc(24px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* ============================================================
   GLOBAL TOUCH & PERFORMANCE IMPROVEMENTS (all pages)
   ============================================================ */

/* GPU-compose sticky nav to avoid repaint jank on iOS scroll */
.gnp-nav {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  will-change: transform;
}

/* Smooth momentum scroll in mobile drawer */
.gnp-mobile {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
}

/* Safe area for notched iPhones on all pages */
@supports (padding: env(safe-area-inset-bottom)) {
  .gnp-footer {
    padding-bottom: calc(32px + env(safe-area-inset-bottom)) !important;
  }

  .gnp-mobile {
    padding-bottom: env(safe-area-inset-bottom);
  }
}

/* Remove 300ms tap delay on all interactive elements */
a, button, [role="button"],
.gnp-mobile__link, .gnp-nav__link,
.gnp-btn-gold, .gnp-btn-ghost,
.cat-tile, .sub-item, .pcard,
.gnp-cat-card, .gnp-svc,
.svc-card, .abt-val, .cnt-card {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

/* Prevent iOS zoom on any focused input across all pages */
@media (max-width: 768px) {
  input, textarea, select {
    font-size: 16px !important;
  }
}