/* Full-width photography, quietly animated. The first slide works without JS. */
.salon-slider { --slide-duration: 7500ms; position: relative; isolation: isolate; background: #2b1b25; color: #fffaf7; overflow: hidden; }
.salon-slides { display: grid; }
.salon-slide { grid-area: 1 / 1; position: relative; min-width: 0; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 900ms ease, visibility 900ms; }
.salon-slide.is-active { opacity: 1; visibility: visible; pointer-events: auto; }
.salon-slide-photo, .salon-slide-shade { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.salon-slide-photo { left: 20%; mask-image: linear-gradient(90deg, transparent, #000 20%); }
.salon-slide-photo img { width: 100%; height: 100%; object-fit: cover; object-position: var(--slide-focus, 65% 50%); }
.salon-slide.is-active .salon-slide-photo img { animation: salon-photo-drift 16s ease-out both paused; }
.salon-slider[data-playing="true"] .salon-slide.is-active .salon-slide-photo img { animation-play-state: running; }
.salon-slide-shade { background: linear-gradient(90deg, #261721ed 0%, #2d1b26ca 28%, #24141f55 56%, #2116200d 83%), linear-gradient(0deg, #211520cc 0%, transparent 38%); }
.salon-slide-inner { position: relative; display: flex; align-items: center; min-height: 680px; padding-block: 83px 155px; }
.salon-slide-copy { width: 610px; max-width: 65%; }
.salon-site .salon-slide-copy > .eyebrow { display: flex; gap: 13px; align-items: center; color: #f1d5e0; font-size: 10px; letter-spacing: .19em; }
.salon-slide-copy > .eyebrow > span { width: 6px; height: 6px; flex: 0 0 6px; border: 1px solid #f4aec8; transform: rotate(45deg); box-shadow: 0 0 0 5px #f4aec80a; }
.salon-site .salon-slide-copy h2 { font-size: clamp(66px, 6.7vw, 108px); letter-spacing: -.045em; line-height: 1.01; margin-block: 27px 24px; color: #fffaf7; }
.salon-site .salon-slide-copy h2 em { color: #efb2ca; }
.salon-site .salon-slide-copy > p { max-width: 345px; color: #efe2e8; font-size: 14px; line-height: 1.85; }
.salon-slide-actions { display: flex; flex-wrap: wrap; gap: 16px 29px; align-items: center; margin-top: 31px; }
.salon-site .salon-slide-actions .button { border: 1px solid #f5cbd9; background: #f5cbd9; color: #402331; min-height: 53px; padding: 17px 24px; font-size: 12px; }
.salon-site .salon-slide-actions .button:hover { background: #fff3f6; border-color: #fff3f6; box-shadow: 0 9px 26px #140b1730; }
.salon-site .salon-slide-actions .text-link { color: #fff6fa; font-size: 12px; border-color: #ffffff55; gap: 10px; }
.salon-site .salon-slide-actions .text-link:hover { border-color: #efb2ca; color: #efb2ca; }
.salon-slider-bottom { position: absolute; bottom: 26px; left: 0; right: 0; display: flex; align-items: center; justify-content: space-between; gap: 30px; min-height: 65px; padding-top: 21px; border-top: 1px solid #ffffff30; z-index: 2; }
.salon-slider-location { display: flex; align-items: center; gap: 11px; color: #f3dfe8; font-size: 9px; letter-spacing: .1em; }
.salon-slider-location > .icon { width: 19px; height: 19px; color: #edabc5; }
.salon-slider-location small { display: block; margin-top: 6px; font-size: 11px; letter-spacing: 0; color: #dfcad4; }
.salon-slider-controls { display: flex; align-items: center; gap: 30px; }
.salon-slider-choices { display: flex; align-items: center; gap: 23px; }
.salon-slider-choice { position: relative; display: flex; align-items: center; gap: 9px; min-height: 44px; padding: 0 0 8px; border: 0; background: none; color: #dfcad4; font-size: 10px; text-align: left; }
.salon-slider-choice > span:first-child { font-size: 10px; font-variant-numeric: tabular-nums; }
.salon-choice-label { font-size: 11px; }
.salon-slider-choice.is-active { color: #fffaf7; }
.salon-choice-track { position: absolute; bottom: 0; left: 0; right: 0; height: 1px; overflow: hidden; background: #ffffff30; }
.salon-choice-track > i { display: block; height: 100%; width: 100%; background: #f3b6ce; transform: scaleX(0); transform-origin: left; }
.salon-slider-choice.is-active .salon-choice-track > i { transform: scaleX(1); }
.salon-slider[data-playing="true"] .salon-slider-choice.is-active .salon-choice-track > i { animation: salon-slide-progress var(--slide-duration) linear both; }
.salon-slider-playback { display: flex; align-items: center; gap: 2px; }
.salon-slider-arrow, .salon-slider-autoplay { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; min-height: 44px; border: 0; color: #fff5f9; background: transparent; }
.salon-slider-arrow { width: 44px; padding: 8px; }
.salon-slider-arrow .icon { width: 18px; height: 18px; }
.salon-slider-arrow[data-slide-prev] .icon { transform: rotate(180deg); }
.salon-slider-autoplay { gap: 9px; padding: 8px 12px; min-width: 80px; font-size: 11px; }
.salon-slider-autoplay:disabled { color: #ddc3cf; cursor: default; }
.salon-slider-arrow:hover, .salon-slider-autoplay:hover:not(:disabled) { background: #ffffff12; border-radius: 30px; }
.salon-playback-icon { width: 9px; height: 11px; border-inline: 2px solid currentColor; }
.salon-slider[data-autoplay="false"] .salon-playback-icon { width: 0; height: 0; border: 5px solid transparent; border-left: 8px solid currentColor; border-right: 0; }
.salon-slider-explore { display: flex; align-items: center; gap: 16px; font-size: 8px; letter-spacing: .12em; color: #f0d9e3; }
.salon-slider-explore > span { font-size: 24px; color: #f0b7ce; }
.salon-slider :is(a, button):focus-visible { outline: 2px solid #fff7fa; outline-offset: 5px; }
@keyframes salon-photo-drift { from { transform: scale(1.01); } to { transform: scale(1.08); } }
@keyframes salon-slide-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (min-width: 1700px) { .salon-slide-inner { min-height: 750px; } }
@media (max-width: 1200px) {
  .salon-slide-copy { max-width: 70%; }
  .salon-slider-controls { gap: 18px; }
  .salon-slider-choices { gap: 18px; }
  .salon-slider-explore { display: none; }
}
@media (max-width: 900px) {
  .salon-slide-inner { min-height: 660px; padding-block: 70px 155px; }
  .salon-slide-copy { max-width: 80%; }
  .salon-site .salon-slide-copy h2 { font-size: clamp(64px, 9vw, 82px); }
  .salon-slide-shade { background: linear-gradient(90deg,#261721ed,#26172191 47%,#26172110),linear-gradient(0deg,#211520e6,transparent 50%); }
  .salon-slider-location { display: none; }
  .salon-slider-controls { justify-content: space-between; width: 100%; }
}
@media (max-width: 600px) {
  .salon-slide-inner { align-items: flex-end; min-height: 715px; padding-block: 250px 153px; }
  .salon-slide-copy { width: 100%; max-width: 100%; }
  .salon-slide-photo { left: 0; bottom: auto; height: 470px; mask-image: linear-gradient(#000 48%, transparent); }
  .salon-slide-photo img { object-position: var(--slide-mobile-focus, 50% 43%); }
  .salon-slide-shade { background: linear-gradient(0deg,#2b1b25 0%,#2b1b25 32%,#2b1b25c2 55%,#2b1b2522 81%,#2b1b250a); }
  .salon-site .salon-slide-copy > .eyebrow { font-size: 8px; gap: 10px; letter-spacing: .15em; }
  .salon-site .salon-slide-copy h2 { font-size: clamp(49px, 12.8vw, 76px); line-height: 1.04; margin-block: 18px 17px; letter-spacing: -.035em; }
  .salon-site .salon-slide-copy > p { font-size: 12px; line-height: 1.8; max-width: 290px; }
  .salon-slide-actions { flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 23px; }
  .salon-site .salon-slide-actions .button { min-height: 48px; font-size: 11px; padding: 14px 19px; }
  .salon-site .salon-slide-actions .text-link { font-size: 11px; min-height: 44px; }
  .salon-slider-bottom { bottom: 21px; padding-top: 16px; }
  .salon-slider-controls { align-items: flex-end; gap: 12px; }
  .salon-slider-choices { flex: 1; gap: 15px; }
  .salon-slider-choice { flex-direction: column; align-items: flex-start; justify-content: center; gap: 8px; padding-bottom: 11px; }
  .salon-slider-choice > span:first-child { font-size: 11px; }
  .salon-choice-label { font-size: 10px; line-height: 1.35; max-width: 74px; }
  .salon-slider-playback { flex-wrap: wrap; max-width: 88px; justify-content: center; gap: 0; }
  .salon-slider-autoplay { order: 3; min-width: 88px; min-height: 44px; padding: 5px; gap: 6px; font-size: 10px; }
  .salon-slider-arrow { width: 44px; min-height: 44px; }
}
@media (max-width: 359px) {
  .salon-slide-inner { padding-top: 225px; padding-bottom: 150px; }
  .salon-site .salon-slide-copy h2 { font-size: 46px; }
  .salon-slider-choices { gap: 12px; }
  .salon-slider-choice { flex: 1; min-width: 36px; }
  .salon-choice-label { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .salon-slide { transition: none; }
  .salon-slider .salon-slide-photo img, .salon-slider .salon-choice-track > i { animation: none !important; }
}
.motion-paused .salon-slide { transition: none; }
.motion-paused .salon-slider .salon-slide-photo img, .motion-paused .salon-slider .salon-choice-track > i { animation: none !important; }
