/* Service choices from the owner's supplied booking screenshot. */
.service-catalog { background:var(--ink); }
.service-catalog-intro { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; margin-bottom:40px; }
.service-catalog-intro h2 { max-width:12ch; }
.service-catalog-intro>p { max-width:32ch; color:var(--muted); font-size:17px; line-height:1.7; }
.service-catalog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.service-card { display:flex; flex-direction:column; min-width:0; background:var(--brown); }
.service-card-photo { position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--brown); }
.service-card-photo img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; }
.service-card-photo-beard img { object-position:50% 80%; }
.service-card-content { display:flex; flex:1; flex-direction:column; align-items:flex-start; padding:28px; }
.service-card h3 { font:400 clamp(25px,2.1vw,32px)/1.2 var(--font-display); letter-spacing:-.025em; margin:0 0 12px; }
.service-card .service-price { color:var(--accent); font:500 24px/1.4 var(--font-body); font-variant-numeric:tabular-nums; margin:0 0 18px; }
.service-card .service-description { color:var(--muted); font-size:16px; line-height:1.7; margin:0 0 28px; }
.service-card .button { width:100%; min-height:56px; margin-top:auto; gap:12px; padding:12px 14px; font-size:13px; touch-action:manipulation; }
.service-card .button .icon { flex-shrink:0; }
.service-card .button:active { background:var(--accent-hover); }
.service-catalog-note { margin-top:24px; max-width:60ch; color:var(--muted); font-size:14px; line-height:1.6; }
@media(max-width:1100px) { .service-card-content { padding:24px; } }
@media(max-width:900px) {
  .service-catalog-intro { align-items:flex-start; flex-direction:column; gap:20px; margin-bottom:32px; }
  .service-catalog-intro h2 { max-width:none; }
  .service-catalog-grid { grid-template-columns:1fr; }
  .service-card { display:grid; grid-template-columns:40% minmax(0,1fr); }
  .service-card-photo { aspect-ratio:auto; min-height:100%; }
  .service-card-content { min-width:0; padding:28px; }
}
@media(max-width:600px) {
  .service-card { display:flex; }
  .service-card-photo { aspect-ratio:4/3; min-height:0; }
  .service-card-content { padding:24px; }
  .service-card h3 { font-size:28px; }
  .service-catalog-intro>p { font-size:16px; }
}
@media(max-width:340px) { .service-card-content { padding:20px; } .service-card .button { padding-inline:10px; gap:8px; } }
