/* Salon refinement — 2026-09-20. Keep the original identity and native scrolling. */
:root {
  --section-pad-y: clamp(56px, 5vw, 80px);
  --muted-foreground: #575149;
}
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
section[id], .section { scroll-margin-top: 0; }
.section { padding-block: var(--section-pad-y); }
.team.section { padding-block: var(--section-pad-y); }
.services-heading { font-size: clamp(48px, 5.2vw, 76px); line-height: 1; }
.services-lead { max-width: 66ch; font-size: 16px; line-height: 1.65; }
.service-grid { margin-top: 28px; gap: 20px; }
.service-card { padding: 26px 24px 22px; min-height: 0; }
.service-card-top { margin-bottom: 16px; }
.service-card > p { font-size: 15px; line-height: 1.65; }
.service-card h3 { font-size: clamp(28px, 2.3vw, 34px); line-height: 1.1; }
.service-card-footer { flex-wrap: wrap; margin-top: 24px; gap: 8px 16px; }
.service-card-footer strong { font-size: 15px; }
.service-time, .service-number { font-size: 12px; }
.process-step p, .faq-item > p { font-size: 16px; line-height: 1.7; }
.team-grid { margin-top: 40px; gap: 64px; }
.contact-desc { font-size: 16px; }
.reviews-author span { font-size: 14px !important; color: #575149; }
.reviews-section > .salon-motion-control { display: block; margin: 16px auto 0; }
.salon-motion-control {
  min-height: 44px; padding: 10px 16px; border: 1px solid var(--border);
  border-radius: 999px; background: var(--card); color: var(--foreground);
  font: 500 13px/1.4 var(--font-manrope), sans-serif; cursor: pointer;
}
.hero-bg .salon-motion-control { position: absolute; bottom: 16px; right: 16px; z-index: 4; }
:where(a, button, summary):focus-visible { outline: 2px solid #6f583d; outline-offset: 4px; }
.section:focus { outline: none; }
@media (min-width: 961px) and (max-width: 1199px) {
  .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
  html { scroll-padding-top: 84px; }
}
@media (max-width: 680px) {
  :root { --section-pad-y: 48px; }
  .section { padding: 48px 20px; }
  .team.section { padding-block: 48px; }
  .services-lead { font-size: 15px; }
  .service-grid { gap: 16px; margin: 24px 0; }
  .service-card { padding: 22px 20px; }
  .service-card-top { margin-bottom: 12px; }
  .service-card h3 { font-size: 30px; margin-bottom: 10px; }
  .service-card-footer { margin-top: 18px; padding-top: 14px; }
  .team-grid { gap: 40px !important; }
  .hero-bg .salon-motion-control { bottom: 10px; right: 20px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }