/* ==========================================================
   Aura Beauty — responsive.css  (load last)
   ========================================================== */

@media (max-width: 1000px) {
  .grid-3, .signature, .gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .signature > div:nth-child(2n) { border-right: 0; }
  .signature > div:nth-child(-n + 2) { border-bottom: 1px solid var(--rule-soft); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-grid > *:first-child { grid-column: 1 / -1; }
}

@media (max-width: 860px) {
  .hero { min-height: auto; }
  .hero-inner { grid-template-columns: 1fr; }
  .monogram { order: -1; }
  .monogram img { width: min(74%, 320px); }
  .hero .lede { max-width: 48ch; }

  .split, .grid-2 { grid-template-columns: 1fr; }
  .split--reverse > *:first-child { order: 0; }

  /* Slide-down navigation */
  .nav-toggle { display: block; }
  .nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    background: #081C15;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
    border-bottom: 1px solid var(--rule);
    padding: 0 var(--gutter);
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s var(--ease);
  }
  .nav.is-open { max-height: 26rem; }
  .nav a {
    padding: 1rem 0;
    border-bottom: 1px solid var(--rule-soft);
    font-size: 0.95rem;
  }
  .nav a:last-child { border-bottom: 0; }
  .nav a::after { display: none; }
}

@media (max-width: 620px) {
  .grid-3, .signature, .gallery-grid, .form-grid { grid-template-columns: 1fr; }
  .signature > div { border-right: 0; border-bottom: 1px solid var(--rule-soft); }
  .signature > div:last-child { border-bottom: 0; }

  .service-index > li { grid-template-columns: 1fr auto; }
  .service-index .leader { display: none; }
  .service-index .name { font-size: 1.1rem; }

  .artist { grid-template-columns: 1fr; }
  .artist .avatar { width: 92px; height: 92px; font-size: 1.9rem; }

  .footer-grid { grid-template-columns: 1fr; }
  .footer-base { justify-content: flex-start; }

  .btn { width: 100%; }
  .btn-row { flex-direction: column; }

  .float-book { padding: 0.75rem 1rem; font-size: 0.75rem; }
  .site-footer { padding-bottom: 5.5rem; }

  .timeline li { grid-template-columns: 2.5rem 1fr; gap: 0.9rem; }
}

@media print {
  .site-header, .float-book, .filter-bar, .btn-row { display: none; }
  body { background: #fff; color: #111; }
  body::before { display: none; }
}