.catalog-section { background: var(--paper); }
.catalog { display: grid; gap: 12px; }
.catalog-group { border: 1px solid var(--line); background: rgba(255,255,255,.62); }
.catalog-group summary { list-style: none; min-height: 74px; padding: 0 28px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; user-select: none; }
.catalog-group summary::-webkit-details-marker { display: none; }
.catalog-group summary > span { display: flex; align-items: center; gap: 20px; font-family: var(--serif); font-size: clamp(20px, 2.2vw, 29px); letter-spacing: -.025em; }
.catalog-group summary small { color: var(--gold); font: 10px var(--sans); letter-spacing: .12em; }
.catalog-group summary i { width: 24px; height: 24px; border: 1px solid var(--line); border-radius: 50%; position: relative; transition: transform .25s, background .25s; }
.catalog-group summary i::before, .catalog-group summary i::after { content: ""; position: absolute; width: 8px; height: 1px; background: var(--teal); left: 7px; top: 11px; }
.catalog-group summary i::after { transform: rotate(90deg); transition: transform .25s; }
.catalog-group[open] summary { background: var(--teal); color: white; }
.catalog-group[open] summary i { background: var(--gold); border-color: var(--gold); transform: rotate(180deg); }
.catalog-group[open] summary i::before, .catalog-group[open] summary i::after { background: var(--teal-dark); }
.catalog-group[open] summary i::after { transform: rotate(0); }
.catalog-grid { padding: 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; border-top: 1px solid var(--line); }
.catalog-grid.single { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.service-card { min-height: 236px; padding: 24px; border: 1px solid var(--line); background: white; display: flex; flex-direction: column; transition: transform .25s, border-color .25s, box-shadow .25s; }
.service-card:hover { transform: translateY(-3px); border-color: rgba(6,79,82,.35); box-shadow: 0 14px 35px rgba(6,79,82,.08); }
.service-card.selected { border-color: var(--gold); background: rgba(238,211,162,.12); }
.service-card.compact { min-height: 185px; }
.service-card.featured { background: var(--cream); }
.card-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.card-heading h3 { font-family: var(--serif); font-size: 21px; line-height: 1.15; font-weight: 400; margin: 0; }
.card-heading strong { color: var(--teal); flex: none; font-family: var(--serif); font-size: 17px; font-weight: 400; }
.service-card > p { color: var(--muted); font-size: 12px; line-height: 1.65; margin: 17px 0 22px; max-width: 580px; }
.card-book { width: max-content; margin: auto 0 0 auto; border: 0; border-bottom: 1px solid var(--gold); padding: 8px 0; background: transparent; color: var(--teal); font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: .14em; cursor: pointer; }
.card-book span { color: var(--gold); margin-left: 9px; }
.pricing-footnote { color: var(--muted); font-size: 10px; margin: 18px 2px 0; }
.booking-services.grouped { display: block; }
.booking-category { border: 1px solid var(--line); margin-bottom: 8px; }
.booking-category summary { list-style: none; padding: 13px 15px; background: var(--cream); cursor: pointer; font-family: var(--serif); font-size: 15px; display: flex; justify-content: space-between; }
.booking-category summary::-webkit-details-marker { display: none; }
.booking-category summary::after { content: "+"; color: var(--gold); }
.booking-category[open] summary::after { content: "−"; }
.booking-category-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 8px; }
.booking-service.pending p { color: var(--gold); }
.pricing-notice { padding: 11px 13px; margin: -10px 0 18px; background: #fff5e7; border: 1px solid rgba(215,170,99,.4); color: #735c36; font-size: 10px; line-height: 1.5; }

@media (max-width: 900px) {
  .catalog-grid, .catalog-grid.single { grid-template-columns: 1fr; padding: 10px; }
  .catalog-group summary { min-height: 66px; padding: 0 16px; }
  .catalog-group summary > span { gap: 12px; font-size: 20px; }
  .service-card { min-height: 210px; padding: 20px; }
  .booking-category-grid { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .catalog-section .section-heading { margin-bottom: 38px; }
  .catalog-group summary > span { font-size: 17px; }
  .catalog-group summary small { display: none; }
  .card-heading { flex-direction: column; gap: 8px; }
  .service-card { min-height: 225px; }
}
