/* =============================================
   RG RESPONSIVE SAFETY LAYER
   Mobile-first adjustments without changing brand visuals.
   ============================================= */

*, *::before, *::after {
  box-sizing: border-box;
}

html {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-gutter: auto;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  overflow-y: clip;
  min-height: 100%;
}

/* Avoid a visual double-scrollbar gutter when fixed purchase bars are present. */
html:has(.add-to-cart-bar),
html:has(.add-to-cart-mobile-bar) {
  scrollbar-gutter: auto;
}

/* Keep the document as the only page scroller. Overlays and small widgets
   can still scroll internally, but layout wrappers must not add a second bar. */
main,
.page,
.app,
.wrapper,
.layout,
.container,
.content,
.page-wrapper,
.site-wrapper,
.main-wrapper,
#app,
#root {
  overflow-y: visible !important;
  max-height: none !important;
}

img, video, canvas, svg, iframe {
  max-width: 100%;
}

img {
  height: auto;
}

button,
a,
input,
select,
textarea {
  max-width: 100%;
}

button,
a[href],
input[type="button"],
input[type="submit"],
input[type="reset"] {
  touch-action: manipulation;
}

input,
select,
textarea {
  min-width: 0;
}

.rg-header,
.rg-header-inner,
main,
section,
footer {
  max-width: 100%;
}

.rg-header-inner {
  gap: 0.75rem;
}

.rg-cart-icon,
.rg-menu-btn {
  min-width: 44px;
  min-height: 44px;
}

.rg-nav-desktop {
  min-width: 0;
}

.rg-nav-link {
  white-space: nowrap;
}

.rg-whatsapp-btn {
  min-height: 44px;
  white-space: nowrap;
}

.rg-product-grid,
#rg-product-grid {
  grid-template-columns: 1fr;
}

.rg-card,
.rg-home-product-card,
.combo-card,
.article-card,
.resource-card,
.guide-item,
.section-card,
.cart-item,
.summary-card,
.shipping-option,
.payment-option {
  min-width: 0;
}

.rg-card-name,
.rg-card-desc,
.rg-home-product-title,
.rg-home-product-desc,
.combo-title,
.combo-desc,
.article-body h3,
.article-body p {
  overflow-wrap: anywhere;
}

.rg-card-footer,
.rg-home-product-footer,
.combo-price-row,
.summary-item {
  min-width: 0;
}

.rg-card-add,
.rg-home-product-add,
.combo-cta,
.combo-secondary,
.btn-primary,
.btn-secondary,
.btn-checkout,
.cat-btn,
.blog-button,
.article-link,
.resource-card a {
  min-height: 44px;
}

.combo-cta,
.combo-secondary,
.btn-primary,
.btn-secondary,
.btn-checkout {
  text-align: center;
}

#rg-category-bar,
.rg-home-carousel-track,
#mainCarousel {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}

footer div {
  max-width: 100%;
}

@media (min-width: 640px) {
  .rg-product-grid,
  #rg-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .rg-product-grid,
  #rg-product-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  body {
    font-size: 16px;
  }

  input,
  select,
  textarea {
    font-size: 16px !important;
  }

  .rg-header-inner {
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }

  .rg-logo-wrapper {
    min-width: 0;
  }

  .rg-logo-wrapper img,
  .header-logo {
    max-width: min(52vw, 176px);
  }

  .rg-cart-icon {
    flex: 0 0 auto;
  }

  main[class*="px-"],
  section[class*="px-"] {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .grid,
  .rg-home-grid,
  .combos-intro,
  .combos-grid,
  .article-grid,
  .side-grid,
  .guide-grid,
  .resource-grid,
  .cta-panel {
    grid-template-columns: 1fr !important;
  }

  .flex:not(.rg-header-inner):not(.rg-nav-desktop):not(#rg-category-bar):not(.rg-home-carousel-track) {
    min-width: 0;
  }

  .rg-card {
    min-height: auto;
  }

  .rg-card-image {
    height: 188px;
  }

  .rg-card-image img {
    max-width: min(84%, 190px);
    max-height: 140px;
  }

  .rg-card-footer,
  .rg-home-product-footer {
    gap: 0.75rem;
  }

  .rg-card-price,
  .rg-home-product-price,
  .combo-final {
    white-space: normal;
  }

  .combo-cta,
  .combo-secondary,
  .blog-button,
  .btn-primary,
  .btn-secondary,
  .btn-checkout {
    width: 100%;
  }

  .blog-actions,
  .combos-proof,
  footer div[style*="display:flex"] {
    align-items: stretch;
  }

  .section-card,
  .guide-band,
  .cta-panel {
    padding: 1rem;
  }

  .checkout-main {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  #checkout-container {
    grid-template-columns: 1fr !important;
  }

  .checkout-input {
    min-height: 48px;
  }

  .shipping-option,
  .payment-option {
    padding: 1rem;
  }

  .trust-badge {
    min-width: 0;
  }

  .cart-item-bottom,
  .summary-item {
    gap: 0.75rem;
  }

  .empty-cart {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

@media (max-width: 520px) {
  .rg-header-inner {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  .rg-cart-icon,
  .rg-menu-btn {
    padding: 0.5rem;
    border-radius: 0.875rem;
  }

  .rg-product-grid,
  #rg-product-grid {
    gap: 1rem !important;
  }

  .rg-pagination-container,
  .rg-pagination,
  .rg-pagination-wrapper {
    max-width: 100%;
    overflow-x: auto;
    justify-content: flex-start;
    -webkit-overflow-scrolling: touch;
  }

  .rg-pagination-container {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
  }

  .blog-hero,
  .combos-hero {
    word-break: normal;
  }

  .blog-hero h1,
  .combos-hero h1 {
    font-size: clamp(1.8rem, 9vw, 2.35rem);
  }

  .article-body,
  .combo-body {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .combo-price-row {
    align-items: flex-start;
  }

  footer {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    padding-bottom: 5.75rem !important;
  }
}