/* ==========================================================================
   Pramukh Wellness — Responsive enhancements (mobile-first, min-width)
   Base (≤599px) styles live in style.css
   ========================================================================== */

/* Mobile bottom action bar is shown below 768px */
@media (max-width: 767.98px) {
  :root { --mobile-bar-h: 70px; }
}
@media (min-width: 768px) {
  .mobile-bar { display: none; }
}

/* Very small screens (320px) */
@media (max-width: 359.98px) {
  :root { --gutter: 1rem; }
  .brand__name { font-size: .98rem; letter-spacing: .08em; }
  .brand img { width: 34px; height: 34px; }
  .nav-toggle { width: 44px; height: 44px; }
  .btn { padding-inline: 1.2rem; }
  .mobile-bar .btn { font-size: .85rem; padding-inline: .5rem; }
  .props, .facts { grid-template-columns: 1fr; }
}

/* ---------- ≥ 600px : large phones / small tablets ---------- */
@media (min-width: 600px) {
  :root { --gutter: 1.75rem; --section-pad: 5rem; }

  .brand__tag { display: block; }
  .brand__name { font-size: 1.32rem; letter-spacing: .14em; }

  .benefits { grid-template-columns: repeat(2, 1fr); }
  .info-grid { grid-template-columns: repeat(2, 1fr); }
  .journal-grid { grid-template-columns: repeat(2, 1fr); }
  .team-grid { grid-template-columns: repeat(2, 1fr); }
  .values { grid-template-columns: repeat(2, 1fr); }
  .props { grid-template-columns: repeat(4, 1fr); }
  .facts { grid-template-columns: repeat(4, 1fr); }

  .form__row--2 { grid-template-columns: repeat(2, 1fr); }
  .form-card { padding: var(--space-7) var(--space-6); }

  .session {
    grid-template-columns: 170px 1fr;
    align-items: center;
    column-gap: var(--space-5);
  }
  .session__when { flex-direction: column; align-items: flex-start; gap: .15rem; }
  .session__action { grid-column: 2; }

  .cta-band { padding: var(--space-9) var(--space-7); }
  .testimonial { padding: var(--space-7) var(--space-8); }

  .hero__content { padding-block: var(--space-9) var(--space-8); }
}

/* ---------- ≥ 768px : tablets ---------- */
@media (min-width: 768px) {
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
  :root { --header-h: 80px; }

  .header__book { display: inline-flex; }

  .hero { align-items: center; min-height: min(86vh, 780px); }
  .hero::before {
    background:
      linear-gradient(90deg, rgba(248, 245, 239, .97) 0%, rgba(248, 245, 239, .9) 38%, rgba(248, 245, 239, .35) 62%, rgba(248, 245, 239, 0) 80%);
  }
  .hero__media img { object-position: 70% 50%; }
  .hero__content { max-width: 600px; padding-block: var(--space-9); }

  .steps { grid-template-columns: repeat(3, 1fr); }

  .tt-controls { grid-template-columns: 1fr auto; align-items: end; }
  .tt-controls__days { grid-column: 1 / -1; }

  .session {
    grid-template-columns: 170px 1fr auto;
  }
  .session__action { grid-column: auto; justify-content: flex-end; }

  .contact-grid { grid-template-columns: 1fr 1fr; }
  .footer__grid { grid-template-columns: 1.4fr 1fr 1fr; }
  .footer__grid .footer__col--wide { grid-column: 1 / -1; }

  .class-feature { grid-template-columns: 1fr 1.25fr; padding: var(--space-6); gap: var(--space-7); }
  .class-feature:nth-child(even) .class-feature__media { order: 2; }
}

/* ---------- ≥ 1024px : laptops ---------- */
@media (min-width: 1024px) {
  :root { --section-pad: 6.5rem; --gutter: 2rem; }

  .grid--3 { grid-template-columns: repeat(3, 1fr); }
  .benefits { grid-template-columns: repeat(4, 1fr); }
  .info-grid--3 { grid-template-columns: repeat(3, 1fr); }
  .journal-grid { grid-template-columns: repeat(3, 1fr); }
  .journal-grid .post-card--featured { grid-column: span 2; }
  .team-grid { grid-template-columns: repeat(3, 1fr); }
  .values { grid-template-columns: repeat(4, 1fr); }

  .split { grid-template-columns: 1fr 1fr; gap: var(--space-9); }
  .split--reverse .split__media { order: 2; }

  .page-hero__grid { grid-template-columns: 1.15fr .85fr; gap: var(--space-8); }
  .page-hero { padding-block: var(--space-8) var(--space-9); }

  .contact-grid--form { grid-template-columns: .85fr 1.15fr; align-items: start; }
  .booking-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: var(--space-8); align-items: start; }
  .booking-layout__intro { position: sticky; top: calc(var(--header-h) + 2rem); }

  .footer__grid { grid-template-columns: 1.5fr 1fr 1fr 1.4fr; }
  .footer__grid .footer__col--wide { grid-column: auto; }

  .article-layout { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: var(--space-8); align-items: start; }
  .article-layout .toc { position: sticky; top: calc(var(--header-h) + 2rem); order: 2; }
}

/* ---------- ≥ 1280px : full desktop navigation ---------- */
@media (min-width: 1280px) {
  .site-header .container { max-width: 1440px; }
  .brand__name > span { display: block; }
  .brand__name { font-size: 1.08rem; line-height: 1.15; letter-spacing: .2em; }
  .brand__tag { display: none; }
  .brand img { width: 46px; height: 46px; }
  .nav-toggle { display: none; }
  .header__wa { display: inline-flex; }

  .nav {
    position: static;
    inset: auto;
    visibility: visible;
    opacity: 1;
    transform: none;
    padding: 0;
    background: transparent;
    border: 0;
    overflow: visible;
    transition: none;
  }
  .nav__list { display: flex; align-items: center; gap: .15rem; }
  .nav__list li { border: 0; }
  .nav__link {
    position: relative;
    padding: .5rem .6rem;
    font-family: var(--font-body);
    font-size: .92rem;
    white-space: nowrap;
    font-weight: 500;
    color: var(--charcoal);
    border-radius: 999px;
  }
  .nav__link:hover { color: var(--forest); background: rgba(163, 177, 138, .18); }
  .nav__link[aria-current="page"] { color: var(--forest); font-weight: 600; }
  .nav__link[aria-current="page"]::after {
    position: absolute;
    left: 50%; bottom: -2px;
    width: 6px; height: 6px;
    transform: translateX(-50%);
  }
  .nav__link[aria-current="true"] { color: var(--forest); font-weight: 600; }
  .nav__link[aria-current="true"]::after {
    position: absolute;
    left: 50%; bottom: -2px;
    width: 6px; height: 6px;
    transform: translateX(-50%);
  }
  .nav__cta, .nav__note { display: none; }

  /* "Our Classes" dropdown */
  .nav__item--has-sub { position: relative; }
  .nav__parent { gap: 0; }
  .nav__sub-toggle { width: 26px; height: 26px; margin-left: -.3rem; border: 0; color: var(--charcoal); }
  .nav__sub-toggle:hover { color: var(--forest); background: rgba(163, 177, 138, .18); }
  .nav__sub-toggle svg { width: 15px; height: 15px; }
  /* Undo the drawer's display:none; visibility below decides whether it shows */
  .js .nav__item--has-sub:not(.is-open) .nav__sub { display: block; }
  .nav__sub {
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 20;
    min-width: 230px;
    margin-top: .6rem;
    padding: .5rem;
    background: var(--white);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow);
    visibility: hidden;
    opacity: 0;
    transform: translateY(-4px);
    transition: opacity .2s var(--ease), transform .2s var(--ease), visibility 0s linear .2s;
  }
  /* Invisible bridge so the menu stays open while the pointer moves down to it */
  .nav__sub::before { content: ""; position: absolute; left: 0; right: 0; top: -.75rem; height: .75rem; }
  .nav__item--has-sub:hover .nav__sub,
  .nav__item--has-sub:focus-within .nav__sub,
  .js .nav__item--has-sub.is-open .nav__sub {
    visibility: visible;
    opacity: 1;
    transform: none;
    transition: opacity .2s var(--ease), transform .2s var(--ease), visibility 0s;
  }
  .js .nav__item--has-sub.is-closed .nav__sub { visibility: hidden; opacity: 0; }
  .nav__item--has-sub:hover .nav__sub-toggle svg,
  .nav__item--has-sub.is-open .nav__sub-toggle svg { transform: rotate(180deg); }
  .nav__sublink {
    padding: .55rem .8rem;
    font-size: .92rem;
    font-weight: 500;
    color: var(--charcoal);
    border-radius: 8px;
    white-space: nowrap;
  }
  .nav__sublink:hover, .nav__sublink:focus-visible { color: var(--forest); background: rgba(163, 177, 138, .18); }
  .nav__sublink[aria-current="page"] { color: var(--forest); font-weight: 600; background: var(--sage-wash); }

  /* Icon-only WhatsApp button until there is room for its label */
  .header__wa { width: 42px; padding: 0; }
  .header__wa span:not(.sr-only) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

  .header__inner { gap: var(--space-5); }
}

/* ---------- ≥ 1440px : large desktop ---------- */
@media (min-width: 1440px) {
  :root { --container: 1280px; }
  .nav__link { padding-inline: .8rem; }
  .header__wa { width: auto; padding: .55rem 1.1rem; }
  .header__wa span:not(.sr-only) { position: static; width: auto; height: auto; overflow: visible; clip: auto; }
}

/* ---------- Trainers page ---------- */
@media (min-width: 600px) {
  .trainer-grid { grid-template-columns: repeat(2, 1fr); }
  .trainer-profile__facts { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 1024px) {
  .trainer-hero { padding-block: var(--space-8) var(--space-9); }
  .trainer-hero__grid { grid-template-columns: 1fr 1fr; gap: var(--space-8); }
  .trainer-profile { grid-template-columns: .9fr 1.1fr; gap: var(--space-9); }
  .trainer-profile--reverse .trainer-profile__media { order: 2; }
}

/* Word divider: keep the word legible on phones */
@media (max-width: 599.98px) {
  .word-divider__text { font-size: 29vw; line-height: .82; }
  .word-divider__shape { height: 26px; }
}

/* Trainer profiles: wider text column in both orientations; photo stays in view */
@media (min-width: 1024px) {
  .trainer-profile { align-items: start; }
  .trainer-profile--reverse { grid-template-columns: 1.1fr .9fr; }
  .trainer-profile__media { position: sticky; top: calc(var(--header-h) + 2rem); }
}