/* =====================================================================
   KREATIVNÍ KVĚTINÁŘSTVÍ — responsive.css
   ===================================================================== */

/* ── 3xl: 1920px ── */
@media (min-width: 1920px) {
  html { font-size: 17px; }
  .container { max-width: 1680px; padding: 0 60px; }
  .nav-container { max-width: 1680px; padding: 0 60px; }
  .hero-medallion { width: 400px; height: 400px; }
  .hero-tagline { font-size: 1.7rem; }
  .craft-grid { gap: 32px; }
  .masonry-grid { grid-template-columns: repeat(5, 1fr); }
  .parallax-heading { font-size: 5rem; }
  .cards-section, .gallery-section, .contact-section { padding: 120px 0 130px; }
}

/* ── 2xl: 1440px ── */
@media (min-width: 1440px) {
  :root { --nav-h: 80px; }
  .nav-cta { padding: 12px 24px; font-size: 0.92rem; }
}

/* ── xl: 1280px ── */
@media (max-width: 1280px) {
  .container { padding: 0 32px; }
  .nav-container { padding: 0 32px; }
  .craft-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .masonry-grid { grid-template-columns: repeat(3, 1fr); }
  .contact-grid { gap: 40px; }
  .contact-botanical { right: 24px; width: 160px; }
}

/* ── lg: 1024px ── */
@media (max-width: 1024px) {
  .nav-links-wrap { gap: 4px; }
  .nav-link { padding: 8px 12px; font-size: 0.88rem; }
  .parallax-content { padding: 72px 32px; }
  .parallax-text { font-size: 1rem; }
  .cards-section { padding: 80px 0 90px; }
  .gallery-section { padding: 80px 0 90px; }
  .contact-section { padding: 80px 0 90px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px; }
  .footer-brand { grid-column: 1 / -1; }
}

/* ── md: 768px ── */
@media (max-width: 768px) {
  :root { --nav-h: 60px; }
  html { font-size: 15px; }
  .container { padding: 0 20px; }
  .nav-container { padding: 0 20px; }
  .nav-links-wrap { display: none; }
  .nav-cta { display: none; }
  .nav-hamburger { display: flex; padding: 11px; margin-left: auto; }
  .mobile-close { display: none; }
  .nav-logo-pill img { height: 38px; }

  /* blob-bg is 600px wide and overflows at mobile widths */
  .blob-bg { display: none; }
  /* Contain any remaining absolute decorative elements */
  .cards-section { overflow: hidden; }

  /* iOS doesn't support background-attachment: fixed */
  .hero { background-attachment: scroll; }
  .parallax-section { background-attachment: scroll; min-height: 55vh; overflow: hidden; }

  .hero-medallion { width: 260px; height: 260px; }
  .hero-tagline { font-size: 1.2rem; }
  .hero-eyebrow { font-size: 1rem; }
  .hero-ctas { gap: 12px; }
  .btn-primary, .btn-outline { padding: 13px 24px; font-size: 0.92rem; }

  .parallax-content { padding: 56px 24px; }
  .parallax-text { font-size: 0.95rem; }

  .craft-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  .craft-card-img-wrap { height: 160px; }
  .craft-card-body { padding: 16px; }

  /* Fix: columns property has no effect on display:grid — use grid-template-columns */
  .masonry-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }

  .contact-grid { grid-template-columns: 1fr; gap: 28px; }
  .contact-botanical { display: none; }
  .contact-map { min-height: 280px; }
  .contact-map iframe { min-height: 280px; }

  /* Prevent long hours text from overflowing the badge pill */
  .open-badge {
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    font-size: 0.8rem;
    padding: 9px 14px;
    gap: 6px;
  }

  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-brand { grid-column: auto; }

  .cards-section { padding: 56px 0 64px; }
  .gallery-section { padding: 56px 0 64px; }
  .contact-section { padding: 56px 0 64px; }
  .section-header { margin-bottom: 32px; }

  .lb-prev { left: 8px; }
  .lb-next { right: 8px; }

  /* Sticky mobile CTA bar */
  .mobile-cta-bar { display: flex; }

  /* Push footer above sticky bar */
  .site-footer { padding-bottom: 76px; }
}

/* ── sm: 480px ── */
@media (max-width: 480px) {
  .hero-medallion { width: 220px; height: 220px; }
  .hero-tagline { font-size: 1.05rem; }
  .hero-ctas {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    width: 100%;
    max-width: 300px;
  }
  .btn-primary, .btn-outline { text-align: center; padding: 15px 20px; justify-content: center; }

  .craft-grid { grid-template-columns: 1fr; }
  .craft-card-img-wrap { height: 200px; }

  /* Keep 2-column gallery on phones — 1 col scrolls too long */
  .masonry-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }

  .section-header h2 { font-size: 1.9rem; }
  .parallax-heading { font-size: 2rem; }
  .parallax-content { padding: 48px 20px; }

  .hours-table td { font-size: 0.88rem; padding: 8px 0; }
  .contact-item a { font-size: 1.1rem; }

  .cards-section { padding: 48px 0 56px; }
  .gallery-section { padding: 48px 0 56px; }
  .contact-section { padding: 48px 0 56px; }

  .footer-logo { height: 64px; }
  .mobile-link { font-size: 2.2rem; }
}

/* ── xs: 375px ── */
@media (max-width: 375px) {
  .hero-medallion { width: 190px; height: 190px; }
  .hero-eyebrow { font-size: 0.88rem; letter-spacing: 0.02em; }
  .section-header h2 { font-size: 1.7rem; }
  .nav-logo-pill img { height: 32px; }
  .masonry-grid { gap: 6px; }
  .craft-grid { gap: 12px; }
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html { scroll-behavior: auto; }
  #leaves-canvas { display: none; }
  .cursor-petal { animation: none; }
  .blob-bg { animation: none; }
  .open-dot { animation: none; }
}