/* Densidade visual confortável para notebooks e monitores.
   Reduz a escala percebida sem usar zoom, preservando acessibilidade e responsividade. */
/* Largura padrão para celulares e tablets. */
.container,
.shared-header__inner,
.shared-footer__main,
.shared-footer__assets {
  width: 90% !important;
  max-width: none !important;
  margin-inline: auto !important;
}

@media (min-width: 900px) {
  body { font-size: 13px; }

  .container,
  .shared-header__inner,
  .shared-footer__main,
  .shared-footer__assets {
    width: 65% !important;
    max-width: none !important;
    margin-inline: auto !important;
  }
  .container { padding-inline: 0 !important; }
  .related { width: 100% !important; max-width: none !important; margin-inline: 0 !important; }

  /* Cabeçalho compartilhado */
  .shared-header__inner { min-height: 72px; gap: 22px; }
  .shared-logo img { width: 150px; }
  .shared-nav { gap: 24px; }
  .shared-nav a { font-size: .72rem; }
  .shared-icon-btn { width: 34px; height: 34px; }
  .shared-icon-btn svg { width: 17px; height: 17px; }

  /* Home */
  body:has(.hero-inner) {
    --fs-h1: clamp(2rem, 2.5vw, 2.35rem);
    --fs-h2: clamp(1.35rem, 1.8vw, 1.7rem);
    --fs-lead: .88rem;
  }
  .announce-bar p { padding-block: 6px; font-size: .72rem; }
  .header-inner { padding-block: 11px; }
  .header-inner .logo { font-size: 1.25rem; }
  .main-nav { gap: 24px; }
  .main-nav a { font-size: .86rem; }
  .hero { min-height: 0 !important; padding: 48px 0 38px !important; }
  .hero-inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1.03fr) !important; gap: 42px !important; }
  .hero-copy h1 { margin-block: 12px 15px; line-height: 1.04; font-weight: 700; }
  .hero-lead { max-width: 43ch; margin-bottom: 19px; line-height: 1.5; }
  .hero-cta { margin-bottom: 20px; gap: 9px; }
  .hero-cta .btn { min-height: 40px; padding: 9px 18px; font-size: .76rem; }
  .hero-trust { gap: 20px; }
  .hero-trust li { font-size: .72rem; }
  .hero-visual { width: 100%; max-width: 540px; justify-self: end; min-height: 0 !important; }
  .hero-panel { width: 100%; height: min(66vh, 545px); max-height: 545px; aspect-ratio: auto; border-radius: 18px; }
  .tag { font-size: .62rem; padding: 6px 11px; }
  .categories, .products, .testimonials { padding-block: 48px; }
  .section-head { margin-bottom: 24px; }
  .cat-grid, .cherry-product-grid { gap: 24px 13px; }

  /* Cards globais */
  .cherry-card__title { font-size: .76rem; }
  .cherry-card__old { font-size: .52rem; }
  .cherry-card__price { font-size: .76rem; }
  .cherry-card__installment { font-size: .57rem; }
  .cherry-card__buy { padding: 8px 10px; font-size: .66rem; }
  .cherry-card__fav { width: 35px; height: 35px; font-size: 1.35rem; }
  .cherry-card__share { width: 38px; height: 38px; bottom: -17px; }
  .cherry-card__badge { top: 12px; padding: 6px 11px 6px 16px; font-size: .62rem; }

  /* Catálogo */
  .catalog-hero { padding: 38px 0 24px; }
  .catalog-hero h1 { font-size: 2.35rem; }
  .catalog-section { padding-bottom: 52px; }

  /* Produto */
  .product-layout { grid-template-columns: minmax(0, 1.03fr) minmax(320px, .97fr); gap: 42px; }
  .gallery { grid-template-columns: 64px 1fr; gap: 10px; top: 90px; }
  .gallery__main { height: min(66vh, 545px); min-height: 440px; border-radius: 18px; }
  .thumb { width: 64px; height: 76px; }
  .details { padding-top: 4px; }
  .details h1 { font-size: clamp(1.75rem, 2.5vw, 2.35rem); }
  .price strong { font-size: 1.55rem; }
  .option-group { padding-block: 14px; }
  .color-option { width: 39px; height: 39px; }
  .size-option { min-width: 45px; height: 40px; }
  .purchase-row {
    grid-template-columns: 108px repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .purchase-row .btn {
    min-width: 0;
    padding-inline: 10px;
    white-space: nowrap;
  }
  .quantity, .btn { min-height: 45px; height: 45px; }
  .shipping { margin-top: 18px; padding: 14px; }
  .content-grid { padding-block: 48px; }
  .info-card { padding: 28px; }

  /* Rodapé global */
  .shared-footer { padding-top: 18px; }
  .shared-footer__brand img { width: 135px; }
  .shared-footer__main { column-gap: 20px; row-gap: 10px; }
  .shared-footer__assets { padding-top: 24px; }
}

@media (min-width: 900px) and (max-height: 800px) {
  .hero { padding-block: 34px 28px !important; }
  .hero-visual { max-width: 480px; }
  .hero-panel { height: min(62vh, 480px); max-height: 480px; }
}