/* Final responsive layer shared by the legacy and v2 site shells. */
:root {
  --pp-mobile-gutter: 16px;
  --pp-mobile-section: 56px;
  --pp-touch-target: 44px;
}

html { overflow-x: clip; }
body { min-width: 0; overflow-x: hidden; }
main, section, article, aside, form, fieldset, .content-wrapper { min-width: 0; }
img, video, iframe, svg { max-width: 100%; }
input, select, textarea, button { max-width: 100%; }
input, select, textarea { min-width: 0; }
.pp-btn, .btn, button, input[type="submit"] { min-height: var(--pp-touch-target); }
.pp-btn, .btn { max-width: 100%; white-space: normal; text-align: center; }
.pp-breadcrumb { min-width: 0; flex-wrap: wrap; overflow-wrap: anywhere; }
.pp-card, .card, .pp-status-card { min-width: 0; }
.table-scroll, .table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

@media (max-width: 980px) {
  .pp-wrap,
  .pp-wrap-wide { width: min(100% - 40px, 1280px); }

  .flex { flex-wrap: wrap; }
  .pp-commerce-grid,
  .pp-checkout-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .pp-summary-card { position: static !important; }

  .ed-hero__top,
  .ed-hero__intro,
  .pillars__head,
  .editorial-feature,
  .journal__head { grid-template-columns: minmax(0, 1fr) !important; }
}

@media (max-width: 640px) {
  :root {
    --pp-mobile-gutter: 14px;
    --pp-mobile-section: 48px;
  }

  .pp-wrap,
  .pp-wrap-wide { width: calc(100% - (var(--pp-mobile-gutter) * 2)); }
  body.pp-light .container,
  .container { width: 100%; padding-inline: var(--pp-mobile-gutter) !important; }

  h1, .pp-display, .pp-section-title { overflow-wrap: anywhere; }
  .pp-section-title { font-size: clamp(1.9rem, 9vw, 2.7rem) !important; line-height: 1.08 !important; }
  .pp-lead, .lead { font-size: 0.98rem !important; line-height: 1.65 !important; }
  .section, .pp-section { padding-block: var(--pp-mobile-section) !important; }
  .pp-card, .pp-status-card { padding: 18px !important; border-radius: 18px !important; }

  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,
  textarea { width: 100%; min-height: 48px; font-size: 16px !important; }
  textarea { min-height: 120px; }

  main table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  main th, main td { white-space: nowrap; }

  .pp-status-actions,
  .pp-summary-actions,
  .pp-payment-status__actions,
  .ed-hero__cta-row,
  .hero__cta,
  .pd-actions,
  .calc__receipt-cta { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 10px !important; }
  .pp-status-actions .pp-btn,
  .pp-summary-actions .pp-btn,
  .pp-payment-status__actions .pp-btn,
  .ed-hero__cta-row .pp-btn,
  .hero__cta .pp-btn,
  .pd-actions .pp-btn,
  .calc__receipt-cta .pp-btn { width: 100%; justify-content: center; }

  .pp-cart-item { grid-template-columns: 72px minmax(0, 1fr) !important; gap: 12px !important; }
  .pp-cart-item__media img { width: 72px !important; height: 88px !important; }
  .pp-cart-item__total { grid-column: 2; justify-self: start !important; text-align: left !important; }
  .pp-checkout-steps { overflow-x: auto; justify-content: flex-start; padding-bottom: 6px; }
  .pp-checkout-step { flex: 0 0 auto; }
  .pp-payment-status { padding: 22px 18px !important; }
  .pp-payment-status__details, .pp-payment-status__next { text-align: left; }

  .shop-hero h1,
  .bk-hero h1,
  .sol-hero h1,
  .sp-hero h1,
  .pd-info h1,
  .abj-hero h1 { font-size: clamp(2.35rem, 12vw, 3.8rem) !important; line-height: 1.02 !important; }
  .shop-hero h1 br,
  .bk-hero h1 br,
  .sol-hero h1 br { display: none; }

  .shop-toolbar { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; align-items: stretch !important; gap: 12px !important; }
  .shop-toolbar__right, .shop-toolbar__search { width: 100% !important; }
  .shop-toolbar__right { display: grid !important; grid-template-columns: minmax(0, 1fr); }
  .shop-side { border: 0 !important; padding: 0 !important; }
  #cat-filters { display: flex; flex-wrap: nowrap !important; overflow-x: auto; padding-bottom: 6px; }
  #cat-filters .filter-chip { flex: 0 0 auto; }

  .pd-mainimg { aspect-ratio: 4 / 4.25 !important; }
  .pd-mainimg__chip { left: 12px !important; right: 12px !important; bottom: 12px !important; }
  .pd-thumbs { max-width: 100%; overflow-x: auto; padding-bottom: 4px; }
  .pd-stickybar { display: none !important; }
  .pd-info__price-row { align-items: flex-start !important; }
  .pd-info__price { overflow-wrap: anywhere; }

  .calc__panel,
  .contact__form,
  .quote__form { padding: 20px 16px !important; }
  .calc__product { grid-template-columns: 56px minmax(0, 1fr) !important; }
  .calc__product img { width: 56px !important; height: 56px !important; }
  .calc__receipt-row, .calc__receipt-total { gap: 14px; align-items: flex-start; }
  .calc__receipt-row .v, .calc__receipt-total b { text-align: right; overflow-wrap: anywhere; }
  .calc__tier-label { display: none; }
  .tier, .who__card, .topic, .ch__card, .pd-way { padding: 22px 18px !important; }

  .faq-tabs { display: flex; flex-wrap: nowrap !important; max-width: 100%; overflow-x: auto; padding-bottom: 6px; }
  .faq-tab { flex: 0 0 auto; }
  .faq-item__q { gap: 12px; overflow-wrap: anywhere; }
  .faq-item__q svg { margin-left: auto !important; }
  .sp-search { display: grid !important; grid-template-columns: auto minmax(0, 1fr); border-radius: 18px !important; padding: 8px 12px !important; }
  .sp-search .pp-btn, .sp-search button { grid-column: 1 / -1; width: 100%; justify-content: center; }

  .abj-price { padding: 24px 20px !important; }
  .abj-price strong { font-size: clamp(2rem, 11vw, 3rem) !important; overflow-wrap: anywhere; }
  .abj-actions { display: grid !important; grid-template-columns: minmax(0, 1fr); }
  .abj-actions .pp-btn { width: 100%; justify-content: center; }

  .pp-footer__grid, .pp-site-footer__grid { grid-template-columns: minmax(0, 1fr) !important; }
  .pp-footer__brand { grid-column: auto !important; }
  .pp-footer__bottom, .pp-site-footer__bottom { align-items: flex-start !important; }
}

@media (max-width: 380px) {
  :root { --pp-mobile-gutter: 12px; }
  .pp-card, .pp-status-card { padding: 16px !important; }
  .pp-logo__wordmark b { font-size: 14px !important; }
  .pp-icon-btn { width: 40px !important; height: 40px !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}
