/* ============================================================
   Bi3 Wellness Spa - Responsive Styles
   All breakpoints in one place
   ============================================================ */

/* 1200px: Large tablet / small laptop */
@media (max-width: 1200px) {
  :root { --section-y: 104px; --gutter: 28px; }
  .split { gap: 56px; }
  .footer__top { grid-template-columns: 1fr 1fr; gap: 40px; }
}

/* 992px: Tablet landscape */
@media (max-width: 992px) {
  :root { --section-y: 88px; --header-h: 72px; }
  .nav, .header__actions .btn { display: none; }
  .burger { display: flex; }
  .brand img { width: 56px; height: 56px; }
  .header.is-scrolled .brand img,
  .header.is-solid .brand img { width: 52px; height: 52px; }
  .header.is-scrolled,
  .header.is-solid { height: var(--header-h); }
  .section-head { grid-template-columns: 1fr; gap: 22px; align-items: start; margin-bottom: 44px; }
  .split, .split--reverse { grid-template-columns: 1fr; gap: 40px; }
  .split--reverse .split__media { order: 0; }
  .split__badge { right: 16px; bottom: 16px; }
  .services-grid, .info-grid, .posts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .post-featured, .contact-grid { grid-template-columns: 1fr; gap: 36px; }
  .feature { min-height: 460px; }
  .feature__body { padding: 40px 32px; }

  /* Home hero */
  .hero--redesign .hero__inner { grid-template-columns: 1fr; grid-template-rows: auto auto auto; padding-bottom: 36px; }
  .hero--redesign .hero__content { grid-column: 1; grid-row: 1; }
  .hero__stats { grid-column: 1; grid-row: 2; }
  .hero__float-card { grid-column: 1; grid-row: 3; justify-self: start; max-width: 100%; }

  /* Home about */
  .about-highlight__inner { grid-template-columns: 1fr; gap: 40px; }
  .about-highlight__features { grid-template-columns: 1fr; }
  .about-highlight__images { min-height: 350px; }

  /* Home services preview */
  .services-preview__header { grid-template-columns: 1fr; gap: 24px; }

  /* Home why choose */
  .why-choose__body { grid-template-columns: 1fr; gap: 40px; }

  /* Home testimonials */
  .testimonials-section__header { grid-template-columns: 1fr; gap: 24px; }
  .testimonials-section__grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }

  /* Home book section */
  .book-section__inner { grid-template-columns: 1fr; gap: 36px; }

  /* Home FAQ */
  .faq-section__inner { grid-template-columns: 1fr; gap: 40px; }
  .faq-section__contact { max-width: 100%; }

  /* About story */
  .about-story__inner { grid-template-columns: 1fr; gap: 48px; }
  .about-story__image { order: -1; max-width: 100%; margin: 0; }
  .about-story__image img { height: 360px; object-position: top center; }
  .about-story__stats { gap: 28px; }
  .about-features__grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .about-mvv__grid { grid-template-columns: 1fr; gap: 20px; }

  /* Services page */
  .srv-hero__inner { grid-template-columns: 1fr; gap: 36px; }
  .srv-hero__stats { flex-direction: row; align-items: flex-start; gap: 32px; }
  .srv-hero__stat span { text-align: left; }
  .srv-grid { grid-template-columns: repeat(2, 1fr); }
  .srv-section-head { flex-direction: column; gap: 8px; }
  .srv-section-head p { text-align: left; }
  .srv-cta__inner { grid-template-columns: 1fr; gap: 36px; }
  .srv-cta__actions { align-items: flex-start; flex-direction: row; flex-wrap: wrap; }
}

/* 768px: Tablet portrait / Large phone */
@media (max-width: 768px) {
  :root { --section-y: 72px; --gutter: 20px; --header-h: 64px; }
  body { font-size: 15.5px; padding-bottom: 52px; }
  .mobile-bar { display: flex; }
  .footer { padding-bottom: 84px; }

  /* Fix header overflow — shrink logo & tighten header on mobile */
  .header { height: var(--header-h); }
  .header.is-scrolled,
  .header.is-solid { height: var(--header-h); }
  .brand img { width: 44px; height: 44px; }
  .header.is-scrolled .brand img,
  .header.is-solid .brand img { width: 44px; height: 44px; }
  .brand__name { font-size: 1.05rem; }
  .brand__tag { font-size: 0.5rem; letter-spacing: 0.22em; }

  /* Home hero */
  .hero--redesign h1 { font-size: clamp(2rem, 8vw, 3rem); }
  .hero__eyebrow { font-size: 0.7rem; }
  .hero__float-card { padding: 14px; }
  .hero__float-thumb { width: 72px; height: 52px; }
  .hero__inner { padding-bottom: 108px; }
  .hero__meta { gap: 24px; margin-top: 40px; }
  .hero__meta div { min-width: 110px; }

  /* Old grids */
  .services-grid, .info-grid, .posts-grid, .form-grid { grid-template-columns: 1fr; }

  /* Page hero */
  .page-hero { padding: calc(var(--header-h) + 56px) 0 52px; }
  .page-hero h1 { font-size: clamp(1.8rem, 7vw, 2.6rem); }

  /* Home about stats */
  .about-highlight__stats { grid-template-columns: 1fr 1fr; gap: 20px; }

  /* Testimonials */
  .testimonials-section__grid { grid-template-columns: 1fr; }

  /* Book form */
  .book-section__form-card { padding: 28px 20px; }
  .book-form__row { grid-template-columns: 1fr; gap: 0; }

  /* About hero */
  .about-hero-new { padding: calc(var(--header-h) + 60px) 0 60px; }
  .about-hero-new__inner { grid-template-columns: 1fr; gap: 32px; text-align: center; }
  .about-hero-new__stats { justify-content: center; flex-wrap: wrap; gap: 20px 32px; }
  .about-hero-new__image { display: none; }

  /* About story */
  .about-story__inner { grid-template-columns: 1fr; gap: 40px; }
  .about-story__image { max-width: 100%; margin: 0; }
  .about-story__img-wrap { border-radius: 20px; width: 100%; }
  .about-story__image img { width: 100%; height: 420px; object-fit: cover; object-position: top center; }
  .about-story__stats { gap: 20px; flex-wrap: wrap; }
  .about-features__grid { grid-template-columns: 1fr; gap: 16px; }

  /* Services hero */
  .srv-hero { padding: calc(var(--header-h) + 56px) 0 60px; }
  .srv-hero h1 { font-size: clamp(2rem, 8vw, 3rem); }
  .srv-hero__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; justify-items: center; text-align: center; }
  .srv-hero__stat strong { font-size: 1.8rem; }
  .srv-hero__stat span { text-align: center; }
  .srv-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }

  /* Contact */
  .contact-intro { grid-template-columns: 1fr; gap: 36px; }
  .contact-info-grid { grid-template-columns: 1fr; }

  /* Modal */
  .modal { padding: 16px; place-items: start center; }
  .modal__panel { max-height: calc(100dvh - 32px); padding: 40px 20px 28px; margin-top: 16px; }
  .modal__close { top: 12px; right: 12px; }
  .modal__steps { flex-wrap: nowrap; gap: 4px; }
  .step-text { font-size: 0.65rem; }
  .step-num { width: 28px; height: 28px; font-size: 0.78rem; }
  .step-line { flex: 1; min-width: 12px; }
  .form-grid-inner { grid-template-columns: 1fr !important; }

  /* Mobile menu */
  .mobile-menu { overflow-y: auto; padding-bottom: calc(28px + env(safe-area-inset-bottom)); }
  .mobile-menu nav { margin-bottom: 32px; }

  /* Article */
  .article { font-size: 1rem; }
  .article blockquote { font-size: 1.35rem; }
  .cta { padding: 92px 0; }
}

/* 480px: Small phone */
@media (max-width: 480px) {
  :root { --gutter: 16px; --header-h: 60px; }

  /* Brand */
  .brand__name { font-size: 0.95rem; }
  .brand img { width: 38px; height: 38px; }
  .header.is-scrolled .brand img,
  .header.is-solid .brand img { width: 38px; height: 38px; }

  /* Hero */
  .hero--redesign h1 { font-size: clamp(1.8rem, 8vw, 2.6rem); }
  .hero__actions { flex-direction: column; align-items: flex-start; }
  .hero__actions .btn { width: 100%; justify-content: center; }
  .hero__explore-link { align-self: flex-start; }
  .hero__float-card { border-radius: 14px; }

  /* About highlight */
  .about-highlight__stats { grid-template-columns: 1fr; }
  .about-highlight__badge { min-width: unset; padding: 12px 16px; }

  /* Services slider cards */
  .services-preview__card { flex: 0 0 85%; min-width: 260px; }

  /* Testimonials */
  .testimonial-card { padding: 20px 18px; }

  /* Book form */
  .book-section__form-card { border-radius: 16px; padding: 24px 16px; }

  /* Services page */
  .srv-grid { grid-template-columns: 1fr; gap: 14px; }
  .srv-card__img-wrap { aspect-ratio: 16 / 9; }
  .srv-hero__stats { grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 16px; justify-items: center; text-align: center; }
  .srv-hero__stat strong { font-size: 1.6rem; }
  .srv-hero__stat span { font-size: 0.62rem; }
  .srv-cta__actions { flex-direction: column; width: 100%; }
  .srv-cta__btn-primary { width: 100%; text-align: center; }
  .srv-hero__actions { flex-direction: column; align-items: flex-start; }
  .srv-hero__actions .btn { width: 100%; justify-content: center; }

  /* About page */
  .about-hero-new h1 { font-size: clamp(2rem, 9vw, 3rem); }

  /* Mobile menu */
  .mobile-menu nav a { font-size: 1.65rem; }

  /* Modal */
  .modal__panel { padding: 36px 16px 24px; }
  .step-text { display: none; }

  /* Misc */
  .feature__body { padding: 32px 22px; }
  .testimonial { padding: 30px 24px; }
  .card { padding: 28px 22px; }

  /* Footer: single column */
  .footer__top { grid-template-columns: 1fr; gap: 32px; }
}

/* Desktop: hide mobile menu */
@media (min-width: 993px) {
  .mobile-menu { display: none; }
}