/* Salon details and live booking categories */
.site-header{position:fixed;transition:top .25s,background .25s,box-shadow .25s}
.site-header.is-scrolled{top:.5rem;background:rgba(38,32,26,.94);box-shadow:0 8px 30px rgba(0,0,0,.17)}
section[id]{scroll-margin-top:100px}
.site-nav{gap:clamp(.55rem,1vw,1rem)}
.nav-social{display:flex;align-items:center;gap:.35rem;margin-left:.1rem}
.nav-social a{display:grid;place-items:center;width:29px;height:29px;border:1px solid rgba(255,255,255,.45);border-radius:50%;font-size:.64rem;line-height:1;font-weight:700}
.nav-social a:last-child{font-size:1.2rem}
.nav-social a:hover{background:#f3e2ba;color:#29231b}
.hero-image{animation:camera-pan 19s ease-in-out infinite alternate;transform-origin:center center;will-change:transform}
.hero-image-real{opacity:0;animation:camera-pan-alt 19s ease-in-out infinite alternate,hero-dissolve 20s ease-in-out infinite;object-position:center}
.hero-overlay{z-index:0}
@keyframes camera-pan{from{transform:scale(1.12) translateX(-2%)}to{transform:scale(1.18) translateX(2%)}}
@keyframes camera-pan-alt{from{transform:scale(1.18) translateX(2%)}to{transform:scale(1.12) translateX(-2%)}}
@keyframes hero-dissolve{0%,36%{opacity:0}48%,86%{opacity:1}100%{opacity:0}}

.intro{background:#f5f2eb}
.intro-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(3rem,6vw,6rem)}
.intro-media{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto auto;gap:12px;padding:0 1.5rem 2rem 0}
.intro-media .about-photo{overflow:hidden;min-width:0}
.intro-media .about-photo-main{grid-column:1/-1}
.intro-media .about-photo-main img{aspect-ratio:1.6}
.intro-media .about-photo-detail img,.intro-media .about-photo-work img,.intro-media .about-photo-extra img{aspect-ratio:1}
.intro-media img{display:block;width:100%;height:100%;object-fit:cover}
.intro-media .about-photo-work img{object-position:center 37%}
.intro-media span{right:0;bottom:0;background:#2f291e;color:#f7efdf;padding:.9rem 1.3rem;font-size:1rem}
.intro-copy h2{max-width:14ch}
.values{margin-top:4rem}

.salon-film{background:#302b25;color:#f9f5ed;padding-top:clamp(9rem,12vw,12rem)}
.salon-film-inner{max-width:1200px}
.salon-film-heading{max-width:700px;margin:0 auto 2.7rem;text-align:center}
.salon-film-heading .eyebrow{color:#d9b973}
.salon-film-heading h2{max-width:17ch;margin:.5rem auto 1rem;color:#f9f5ed}
.salon-film-heading h2 em{color:#d9b973}
.salon-film-heading>p:last-child{max-width:54ch;margin:0 auto;color:#d8cfc0;line-height:1.8}
.salon-film-frame{position:relative;aspect-ratio:16/9;padding:10px;border:1px solid #a58a56;background:#1d1a17;box-shadow:0 24px 65px rgba(0,0,0,.22)}
.salon-film-frame video{display:block;width:100%;height:100%;aspect-ratio:16/9;object-fit:contain;background:#161412}
.film-main-play{position:absolute;top:50%;left:50%;display:grid;place-items:center;width:76px;height:76px;border:1px solid rgba(255,255,255,.8);border-radius:50%;background:rgba(37,31,25,.75);color:#fff;transform:translate(-50%,-50%);cursor:pointer;font-size:1.35rem;transition:background .2s,transform .2s}
.film-main-play:hover{background:#b89451;transform:translate(-50%,-50%) scale(1.08)}
.film-main-play[hidden]{display:none}
.salon-film-frame.is-playing .film-main-play{opacity:0;pointer-events:none}
.film-controls{position:absolute;right:10px;bottom:10px;left:10px;display:flex;align-items:center;gap:.85rem;padding:.8rem 1rem;background:linear-gradient(transparent,rgba(0,0,0,.83));color:#fff}
.film-controls button{flex:none;border:0;background:transparent;color:#fff;cursor:pointer;font-size:1.15rem}
.film-controls button:focus-visible,.film-main-play:focus-visible,.film-progress:focus-visible{outline:2px solid #e0bf79;outline-offset:3px}
.film-time{flex:none;font-size:.78rem;font-variant-numeric:tabular-nums}
.film-progress{flex:1;min-width:0;accent-color:#d2ad69;cursor:pointer}

.services{background:#fffdf8}
.services .section-heading{margin-bottom:3rem}
.service-grid{gap:2.4rem 1.25rem}
.service-card{position:relative;display:block;border-bottom:1px solid #d9d1c2;padding-bottom:1.3rem;transition:transform .3s}
.service-card:hover{transform:translateY(-5px)}
.service-card img{aspect-ratio:4/4.2;object-fit:cover}
.service-card>div{padding:1rem .2rem 0}
.service-card h3{font-size:clamp(1.6rem,2vw,2.15rem);line-height:1.15;margin:.45rem 0 .55rem}
.service-card p{min-height:2.9em;color:#665f54}
.service-card b{color:#8d6a28}

.team{background:#eee8dd}
.team .section-heading h2{max-width:16ch}
.team-grid{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(230px,calc((100% - 3.75rem)/4));gap:1.25rem;overflow-x:auto;padding-bottom:1.25rem;scroll-snap-type:x mandatory;scrollbar-color:#b39768 transparent}
.team-card{min-width:0;background:#faf8f2;scroll-snap-align:start}
.team-avatar{background:#e5d7c4;aspect-ratio:4/4.2;overflow:hidden}
.team-avatar img{display:block;width:100%;height:100%;object-fit:cover}
.team-avatar{position:relative}
.team-avatar:after{content:"";position:absolute;inset:9px;border:1px solid rgba(237,217,173,.75);pointer-events:none}
.team-card>div:last-child{padding:1.25rem 1.2rem 1.5rem}
.team-card span{color:#8d6b33;font-size:.64rem;font-weight:700;letter-spacing:.15em}
.team-card h3{font-size:1.65rem;line-height:1.2;margin:.5rem 0 .6rem}
.team-card p{font-size:.86rem;line-height:1.6;margin:0}
.team-loading{grid-column:1/-1}

.promotions{background:#eae5da}
.promo-list{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 2rem)/3);grid-template-columns:none;gap:1rem;overflow-x:auto;padding:.2rem .1rem 1rem;scroll-snap-type:x mandatory;scrollbar-color:#ae8e55 transparent}
.promo-card{display:flex;flex-direction:column;min-width:0;padding:0;background:#fffdf8;border:1px solid #d9cdb7;scroll-snap-align:start;animation:promo-reveal .65s both;animation-delay:var(--promo-delay,0ms)}
.promo-photo{position:relative;overflow:hidden;background:#e9e1d3}
.promo-photo img{display:block;width:100%;height:270px;object-fit:cover;animation:promo-pan 14s ease-in-out infinite alternate}
.promo-amount{position:absolute;right:1rem;bottom:1rem;padding:.38rem .7rem;background:#fffdf8;color:#8a641f;font-family:'Playfair Display',Georgia,serif;font-size:1.7rem;font-weight:400;line-height:1}
.promo-body{display:flex;flex:1;flex-direction:column;padding:1.25rem 1.35rem 1.5rem}
.promo-label{color:#8e6e23;font-size:.68rem;font-weight:700;letter-spacing:.16em}
.promo-card h3{font-size:1.55rem;line-height:1.2;margin:.55rem 0 .75rem}
.promo-summary{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font-size:.9rem;line-height:1.6;min-height:4.8em;margin-bottom:1rem}
.promo-terms{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.85rem}
.promo-terms small{display:inline-block;padding:.28rem .5rem;background:#eee8dd;color:#685533;font-size:.72rem}
.promo-details{border-top:1px solid #e3d9c7;margin-top:auto;padding-top:.8rem}
.promo-details summary{color:#8d6b30;cursor:pointer;font-size:.77rem;font-weight:700}
.promo-details p{white-space:pre-line;margin:.7rem 0 0;font-size:.82rem;line-height:1.6}
.promo-book{display:inline-flex;align-self:flex-start;margin-top:1rem;padding-bottom:.15rem;border-bottom:1px solid #a88241;color:#77591b;font-size:.77rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.promo-controls{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.7rem;color:#7b6236;font-size:.76rem;font-weight:700;letter-spacing:.14em}
.promo-controls[hidden]{display:none}
.promo-controls>div{display:flex;gap:.5rem}
.promo-controls button{width:42px;height:42px;border:1px solid #aa8b54;border-radius:50%;background:#fffdf8;color:#5a4528;cursor:pointer;font-size:1.2rem}
.promo-controls button:disabled{opacity:.35;cursor:default}
.promo-controls button:not(:disabled):hover{background:#302b25;color:#fff}
@keyframes promo-reveal{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes promo-pan{from{transform:scale(1.03) translateX(-1%)}to{transform:scale(1.1) translateX(1%)}}
.gift-cards{background:#f8f5ee}
.gift-cards .section-heading h2{max-width:14ch}
.gift-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.1rem}
.gift-card{display:block;background:#fffdf8;border:1px solid #e1d7c6;transition:transform .25s}
.gift-card:hover{transform:translateY(-5px)}
.gift-card img{display:block;width:100%;height:350px;object-fit:cover}
.gift-card>div{padding:1.25rem 1.3rem 1.5rem}
.gift-card span{color:#8f6c30;font-size:.65rem;letter-spacing:.15em;font-weight:700}
.gift-card h3{font-size:1.85rem;line-height:1.15;margin:.5rem 0}
.gift-card p{font-size:.91rem;min-height:2.7em;margin:0 0 1.2rem}
.gift-card b{color:#8a6427;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}
.gallery-extra[hidden]{display:none}
.gallery-toggle{display:flex;align-items:center;gap:1.4rem;margin:2rem auto 0;padding:.7rem 1.4rem;border:1px solid #b9924c;border-radius:100px;background:transparent;color:#6b501e;cursor:pointer;font-size:.82rem;font-weight:700;transition:background .2s,color .2s}
.gallery-toggle[hidden]{display:none}
.gallery-toggle:hover{background:#2f291e;color:#fff}
.reviews{background:#f2eee6}
.contact-social{display:flex;justify-content:flex-end;align-items:center;gap:1.5rem;padding-top:1.25rem}
.contact-social span{margin-right:auto;color:#8b6d25;font-size:.71rem;font-weight:700;letter-spacing:.15em}
.contact-social a{border-bottom:1px solid #c2a260;padding-bottom:.2rem;font-weight:700;font-size:.84rem}
.contact-social a:hover{color:#9b711e}
.contact-social b{margin-left:.4rem;font-weight:400}

.visit-map{background:#302b25;color:#fff}
.map-layout{display:grid;grid-template-columns:minmax(260px,.75fr) minmax(0,1.25fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.map-copy h2{max-width:12ch}
.map-copy h2 em{color:#d8bb79}
.map-copy p:not(.eyebrow){max-width:38ch;color:#d6ccbb;line-height:1.85}
.map-copy .text-link{color:#e8d19a;border-color:#c5a765}
.map-frame{padding:.65rem;background:#e6ddca;min-height:490px}
.map-frame iframe{display:block;width:100%;height:490px;border:0;filter:grayscale(.35) sepia(.11)}

.floating-actions{position:fixed;right:1.2rem;bottom:1.3rem;z-index:70;display:flex;flex-direction:column;gap:.55rem}
.floating-actions a{display:flex;align-items:center;justify-content:center;gap:.6rem;min-width:144px;min-height:47px;padding:.65rem 1rem;border:1px solid #c9ad77;border-radius:100px;box-shadow:0 8px 24px rgba(0,0,0,.2);font-size:.82rem;font-weight:700;transition:transform .2s,background .2s}
.floating-actions a:hover{transform:translateY(-3px)}
.floating-call{background:#fffdf8;color:#302b25}
.floating-book{background:#c9a65b;color:#211b15}
.floating-book:hover{background:#dfbe75}
.floating-gift{background:#302b25;color:#fff}
.floating-gift:hover{background:#514736}

.promo-dialog{width:min(880px,calc(100% - 2rem));max-height:calc(100dvh - 2rem);padding:0;border:1px solid #d8c39a;background:#fffdf8;color:#272019;box-shadow:0 25px 90px rgba(0,0,0,.35);overflow:auto}
.promo-dialog::backdrop{background:rgba(20,17,13,.76);backdrop-filter:blur(7px)}
.promo-dialog-inner{position:relative;padding:1.4rem}
.promo-dialog-close{position:absolute;z-index:2;top:1rem;right:1rem;display:grid;place-items:center;width:38px;height:38px;border:1px solid #c9b999;border-radius:50%;background:#fffdf8;color:#302b25;cursor:pointer;font-size:1.7rem;line-height:1}
.promo-dialog-close:hover{background:#302b25;color:#fff}
.promo-dialog-head{text-align:center;padding:.55rem 2.2rem 1.1rem}
.promo-dialog-head .eyebrow{margin-bottom:.2rem}
.promo-dialog-head h2{font-size:clamp(1.7rem,3vw,2.5rem);margin:0}
.promo-slide{position:relative;background:#eee8dd}
.promo-slide img{display:block;width:100%;height:auto;max-height:min(62dvh,550px);object-fit:contain}
.promo-prev,.promo-next{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border:0;border-radius:50%;background:rgba(255,253,248,.9);color:#302b25;cursor:pointer;font-size:1.6rem}
.promo-prev{left:.75rem}.promo-next{right:.75rem}
.promo-prev[hidden],.promo-next[hidden]{display:none}
.promo-dialog-foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:1rem}
.promo-count{font-size:.76rem;color:#8a6a30;letter-spacing:.13em;font-weight:700}
.promo-dialog-foot .button{min-height:44px}

@media(max-width:900px){
  .nav-social{margin:.4rem 0 .4rem .7rem}
  .nav-social a{padding:0}
  .intro-grid{grid-template-columns:1fr 1fr}
  .team-grid{grid-auto-columns:minmax(220px,calc((100% - 2.5rem)/3))}
  .promo-list{grid-auto-columns:calc((100% - 1rem)/2)}
  .gift-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
  .map-layout{grid-template-columns:1fr}
  .map-copy h2{max-width:18ch}
}
@media(max-width:650px){
  .site-header.is-scrolled{top:.35rem}
  .hero-image-real{object-position:55% center}
  .intro-grid{grid-template-columns:1fr}
  .intro-media{max-width:none;padding:0 1rem 1.5rem 0}
  .intro-media span{font-size:.82rem}
  .intro-copy h2{max-width:15ch}
  .service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem .9rem}
  .service-card img{aspect-ratio:4/4.9}
  .service-card h3{font-size:1.42rem}
  .service-card p{font-size:.84rem;min-height:0}
  .team-grid{grid-auto-columns:minmax(225px,75%)}
  .promo-list{grid-auto-columns:88%}
  .promo-photo img{height:245px}
  .promo-summary{min-height:0}
  .gift-grid{grid-template-columns:1fr}
  .gift-card img{height:280px}
  .gift-card p{min-height:0}
  .contact-social{justify-content:flex-start;flex-wrap:wrap;gap:.7rem 1.2rem}
  .contact-social span{flex-basis:100%}
  .map-frame,.map-frame iframe{min-height:380px;height:380px}
  .floating-actions{left:.65rem;right:.65rem;bottom:.6rem;flex-direction:row;gap:.5rem}
  .floating-actions a{flex:1;min-width:0;min-height:48px;padding:.55rem .45rem;font-size:.73rem;gap:.3rem}
  .footer{padding-bottom:6.5rem}
  .promo-dialog-inner{padding:.65rem}
  .promo-dialog-head{padding:1.2rem 1.8rem .7rem}
  .promo-dialog-head h2{font-size:1.55rem}
  .promo-dialog-close{top:.4rem;right:.4rem}
  .promo-dialog-foot{padding:.8rem .25rem .2rem}
  .promo-dialog-foot .button{padding:.55rem .8rem;gap:.4rem;font-size:.74rem}
}
@media(max-width:420px){.service-grid{grid-template-columns:1fr}.service-card img{aspect-ratio:4/3.5}}
@media(prefers-reduced-motion:reduce){.hero-image,.hero-image-real,.promo-card,.promo-photo img{animation:none;transform:none}.hero-image-real{opacity:0}.service-card,.floating-actions a,.site-header{transition:none}}
