/* =========================================================================
   Oudora — responsive
   ========================================================================= */

@media (max-width: 1200px) {
  .o-carousel-track { grid-auto-columns: calc((100% - 2 * 24px) / 3); }
}

@media (max-width: 1024px) {
  :root { --o-header-h: auto; }
  .o-nav { display: none; }            /* mega menu hidden; use drawer */
  .o-burger { display: inline-flex; }
  .o-header-bar {
    grid-template-columns: 1fr auto 1fr;
    column-gap: 8px;
    padding-block: 12px;
  }
  .o-header-logo { min-width: 0; }
  .o-account-link,
  .o-header-left .o-search-toggle { display: none; }
  .o-mobile-search-toggle { display: inline-flex; }
  .o-header-right { gap: 4px; }
  .o-header-action,
  .o-burger {
    flex: 0 0 44px;
    width: 44px;
    min-width: 44px;
    height: 44px;
    padding: 0;
    align-items: center;
    justify-content: center;
  }
  .o-header-action .o-icon,
  .o-burger .o-icon { flex: 0 0 auto; }
  .o-search-toggle .o-action-label,
  .o-header-action .o-action-label { display: none; }
  .o-footer-grid { grid-template-columns: 1fr 1fr; gap: 36px; }
  /* Balanced tablet footer: brand and newsletter span both columns, Shop and
     Information sit as the two even middle columns (no lonely wide column). */
  .o-footer-brand { grid-column: 1 / -1; }
  .o-footer-news { grid-column: 1 / -1; }
  .o-carousel-track { grid-auto-columns: calc((100% - 24px) / 2.2); }
  .o-post-grid { grid-template-columns: repeat(2, 1fr); }
  .o-usps-grid { grid-template-columns: repeat(2, 1fr); }
  .o-carousel-nav { display: none; }
}

@media (max-width: 680px) {
  body { font-size: 15px; }
  .o-header-logo img { max-width: 100%; max-height: 40px; }
  .o-wordmark-main { font-size: 26px; }
  .o-wordmark-sub { letter-spacing: 4px; }
  .section-head:not(.center) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "eyebrow link"
      "title title";
    align-items: end;
    gap: 12px 16px;
  }
  .section-head:not(.center) .section-eyebrow { grid-area: eyebrow; margin-bottom: 0; }
  .section-head:not(.center) .section-title { grid-area: title; text-align: center; }
  .section-head:not(.center) .section-link { grid-area: link; }
  .section-head.center { align-items: center; }
  .o-carousel-track { grid-auto-columns: calc((100% - 16px) / 1.6); gap: 16px; }
  .o-post-grid { grid-template-columns: 1fr; }
  .o-footer-grid { grid-template-columns: 1fr; }
  .o-usps-grid { grid-template-columns: 1fr 1fr; gap: 16px; padding-block: 26px; }
  .o-usp { gap: 12px; }
  .o-usp span { font-size: 11.5px; }
  .o-footer-bottom-inner { flex-direction: column; align-items: flex-start; }
  .o-announce-inner { gap: 4px; }
  .o-announce-item { letter-spacing: 1.5px; font-size: 11px; }
}

@media (max-width: 420px) {
  .o-announce-inner {
    min-height: var(--o-announce-h);
    height: auto;
    padding-block: 7px;
    align-items: stretch;
  }
  .o-announce-track { flex: 1 1 0; min-width: 0; height: auto; justify-content: center; overflow: visible; }
  .o-announce-item {
    width: 100%; max-width: none; overflow: visible; text-overflow: clip; white-space: normal;
    text-align: center; line-height: 1.35;
  }
  .o-announce-arrow { flex: 0 0 28px; min-height: 30px; padding-inline: 2px; align-self: center; justify-content: center; }
  .o-wordmark-main { font-size: 24px; letter-spacing: 3px; }
  .o-wordmark-sub { font-size: 9px; letter-spacing: 3.5px; }
  .o-usps-grid { grid-template-columns: 1fr; }
  .o-carousel-track { grid-auto-columns: 78%; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
