/* ============================================================
   RESPONSIVE — public
   ============================================================ */

/* ── Faceted sermons — responsive ─────────────────────────────────────── */
@media (max-width: 860px) {
  .sermons-layout { grid-template-columns: 1fr; }

  /* Sidebar becomes a fixed off-canvas drawer */
  .filter-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: min(85vw, 320px);
    z-index: 300;
    background: var(--white);
    box-shadow: 4px 0 24px rgba(0,0,0,0.18);
    padding: 1.5rem;
    overflow-y: auto;
    transform: translateX(-110%);
    transition: transform 0.25s ease;
    /* override sticky positioning */
    max-height: none;
    top: 0;
  }
  .filter-sidebar--open { transform: translateX(0); }
  .filter-sidebar__close { display: flex; }

  body.filter-drawer-open { overflow: hidden; }

  /* Show the mobile filter button */
  .mobile-filter-btn { display: inline-flex; }

  .sermons-hero { padding: 1.5rem 0 1.35rem; }
  .sermons-hero__title { font-size: 1.5rem; }
  .sermon-search-form { max-width: 100%; }
  /* Compact submit on small screens — icon only, full hit target */
  .sermon-search-form__btn {
    width: 2.65rem;
    height: 2.65rem;
    padding: 0;
  }
  .sermon-search-form__btn-label { display: none; }
  .sermon-search-form__btn-icon { display: block; }
}

/* Upgrade to full-res hero image on wider screens */
@media (min-width: 769px) {
  .hero { background-image: var(--hero-bg); }
}

@media (max-width: 768px) {
  .hero { padding: 4rem 0 3.5rem; }
  .hero__times { gap: 1.5rem; }

  .home-about { grid-template-columns: 1fr; gap: 2.5rem; }

  .site-footer__grid { grid-template-columns: 1fr; gap: 2rem; }

  .site-nav .container { position: relative; flex-wrap: wrap; height: auto; padding-top: 0; padding-bottom: 0; }
  .site-nav__brand { padding: 1rem 0; }
  .site-nav__hamburger { display: flex; }

  .site-nav__links {
    display: none;
    flex-direction: column;
    width: 100%;
    border-top: 1px solid rgba(255,255,255,0.1);
    padding: 0.5rem 0 0.75rem;
    gap: 0;
  }
  .site-nav__links--open { display: flex; }

  .site-nav__links a,
  .site-nav__links .site-nav__link,
  .site-nav__links button {
    padding: 0.7rem 0.5rem;
    font-size: 0.95rem;
    border-radius: 0;
    width: 100%;
    display: block;
  }
  .site-nav__links .btn-nav-cta {
    margin: 0.5rem 0 0;
    text-align: center;
    border-radius: var(--radius);
    display: block;
  }
  .site-nav__members { font-size: 0.95rem !important; opacity: 0.7; }

  .site-subnav__inner {
    gap: 0;
  }
  .site-subnav__link {
    padding: 0.6rem 0.75rem;
    font-size: 0.8rem;
  }

  .sermon-list__duration { display: none; }
}

@media (max-width: 540px) {
  .section { padding: 3rem 0; }
  .hero__actions { flex-direction: column; }
  .hero__actions .btn { text-align: center; justify-content: center; }
}

/* Player compact layout — kicks in below 1000px */
@media (max-width: 1000px) {
  .player { border-top: none; } /* mini-progress replaces border */

  /* Hide desktop row, show compact mini */
  .player__desktop-row { display: none; }
  .player__compact-mini {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0 1rem;
    height: 56px;
    position: relative; /* for mini-progress absolute positioning */
  }
  .player__compact-mini .player__info { flex: 1; min-width: 0; }

  /* Expanded: hide mini, show expanded panel */
  .player--expanded .player__compact-mini { display: none; }
  .player--expanded .player__compact-expanded {
    display: flex;
    flex-direction: column;
    padding: 1.25rem 1.25rem 1rem;
  }
}