@media (min-width: 760px) {
  .field-grid,
  .success-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .success-actions {
    display: grid;
  }
}

@media (max-width: 759px) {
  .brand-tagline { display: none; }

  .booking-page .public-shop-shell {
    width: min(calc(100% - 14px), 640px);
    padding-top: 8px;
  }

  .shop-hero,
  .shop-hero-content { min-height: 510px; }

  .shop-hero { border-radius: 24px; }

  .shop-hero-shade {
    background:
      linear-gradient(0deg, rgba(15, 12, 9, 0.94) 0%, rgba(15, 12, 9, 0.48) 68%, rgba(15, 12, 9, 0.22) 100%);
  }

  .shop-hero-content { padding: 18px 18px 22px; }
  .shop-hero-copy { margin-top: auto; padding: 80px 0 24px; }
  .shop-hero-copy h1 { font-size: clamp(2.6rem, 14vw, 4.4rem); }

  .shop-hero-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .hero-primary-action { grid-column: 1 / -1; }
  .hero-primary-action,
  .hero-secondary-action { width: 100%; padding: 0 14px; }

  .shop-content-grid { grid-template-columns: 1fr; gap: 14px; margin-top: 14px; }
  .booking-experience { grid-row: 1; }
  .shop-profile-column { grid-row: 2; gap: 14px; }

  .page-shell {
    width: min(calc(100% - 14px), 640px);
    padding-top: 10px;
    padding-bottom: 24px;
  }

  .booking-card,
  .success-card {
    padding: 14px;
    border-radius: 20px;
  }

  .booking-page .booking-experience { padding: 14px; border-radius: 20px; }

  .slot-panel-header,
  .success-actions {
    display: grid;
    gap: 10px;
  }

  .selected-slot-label {
    text-align: left;
    justify-self: start;
  }

  .slot-chip,
  .slot-hour-trigger,
  .primary-button,
  .ghost-button,
  .link-button,
  .ghost-link {
    width: 100%;
  }
}

@media (max-width: 420px) {
  h1 {
    font-size: 1.85rem;
  }

  .field-grid,
  .success-actions {
    grid-template-columns: 1fr;
  }

  .slot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .slot-chip {
    min-height: 70px;
    padding: 10px 8px;
  }

  .shop-hero-actions { grid-template-columns: 1fr; }
  .hero-primary-action { grid-column: auto; }
}