*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--brand-primary:var(--vx-brand-primary,#f16a87);--brand-accent:var(--vx-brand-accent,#f16a87);--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-400:#9ca3af;--gray-500:#6b7280;--gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2937;--gray-900:#111827;--radius:8px;--radius-lg:16px;--radius-xl:24px;--shadow-sm:0 1px 2px rgba(15,23,42,.05);--shadow:0 4px 14px rgba(15,23,42,.06);--shadow-lg:0 18px 50px rgba(15,23,42,.12)}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',sans-serif;color:var(--gray-800);line-height:1.6;-webkit-font-smoothing:antialiased;background:#fff}
a{color:var(--brand-primary);text-decoration:none}
.container{max-width:1100px;margin:0 auto;padding:0 1.5rem}

.btn{display:inline-flex;align-items:center;justify-content:center;padding:.625rem 1.25rem;border-radius:var(--radius);font-weight:600;font-size:.9rem;border:none;cursor:pointer;text-decoration:none;transition:transform .15s,box-shadow .15s,opacity .15s,background .15s;line-height:1.4}
.btn-primary{background:var(--brand-primary);color:#fff;box-shadow:0 6px 18px color-mix(in srgb,var(--brand-primary) 30%,transparent)}
.btn-primary:hover{opacity:.92;transform:translateY(-1px);text-decoration:none}
.btn-outline{background:transparent;color:var(--gray-700);border:1px solid var(--gray-200)}
.btn-outline:hover{border-color:var(--gray-500)}
.btn-lg{padding:.85rem 2.1rem;font-size:1rem;border-radius:10px}
.btn-sm{padding:.4rem .85rem;font-size:.8rem}

.ms-header{background:#fff;border-bottom:1px solid var(--gray-200);padding:1rem 0 0;position:sticky;top:0;z-index:100}
.ms-header .container{display:flex;flex-direction:column;align-items:center;position:relative}
.ms-brand-center{text-align:center;padding-bottom:1rem;width:100%;position:relative}
.ms-brand-center::after{content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:100vw;height:1px;background:var(--gray-200)}
.ms-logo{height:72px;max-width:225px;object-fit:contain}
.ms-brand-text{font-size:1.6rem;font-weight:700;color:var(--gray-900);letter-spacing:-.01em}
.ms-nav{display:flex;align-items:center;gap:clamp(1.25rem,3vw,2.75rem);flex-wrap:wrap;justify-content:center;padding:.85rem 0}
.ms-nav a{color:var(--gray-700);font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;transition:color .15s;white-space:nowrap}
.ms-nav a:hover{color:var(--brand-primary)}
.ms-nav .btn{text-transform:none;letter-spacing:0}
.ms-menu-toggle{display:none;background:none;border:none;font-size:1.75rem;cursor:pointer;color:var(--gray-700);position:absolute;right:1.5rem;bottom:.5rem;line-height:1}
@media(max-width:768px){
    .ms-header{padding-bottom:0}
    .ms-brand-center{padding-bottom:.75rem}
    .ms-brand-center::after{display:none}
    .ms-nav{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;padding:1rem;border-top:1px solid var(--gray-200);box-shadow:0 4px 12px rgba(0,0,0,.1);z-index:200;gap:.75rem}
    .ms-nav.open{display:flex}
    .ms-nav a{font-size:1rem}
    .ms-menu-toggle{display:block;top:1.5rem;bottom:auto;transform:none}
}

.ms-hero{position:relative;width:100%;height:520px;overflow:hidden;background:var(--gray-100)}
.ms-hero-slideshow{position:absolute;inset:0;width:100%;height:100%}
.ms-hero-slide{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.5s ease-in-out}
.ms-hero-slide.active{opacity:1}
.ms-hero-slide img{width:100%;height:100%;object-fit:cover;object-position:center}
.ms-hero-overlay{position:absolute;inset:0;background:linear-gradient(to right,rgba(0,0,0,.55) 0%,rgba(0,0,0,.2) 60%,transparent 100%);z-index:1}
.ms-hero-content{position:absolute;inset:0;display:flex;align-items:center;z-index:2}
.ms-hero-content .container{max-width:620px;margin:0;margin-left:max(1.5rem,8%)}
.ms-hero-label{display:inline-block;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:#fff;background:rgba(255,255,255,.18);backdrop-filter:blur(6px);padding:.35rem .7rem;border-radius:999px;margin-bottom:1rem}
.ms-hero h2{font-size:clamp(2rem,4vw,3rem);font-weight:800;line-height:1.1;margin-bottom:1rem;color:#fff;letter-spacing:-.02em}
.ms-hero-subtitle{font-size:1.1rem;color:rgba(255,255,255,.9);margin-bottom:1.75rem;line-height:1.6;max-width:520px}
@media(max-width:768px){
    .ms-hero{height:420px}
    .ms-hero-content .container{margin-left:1.5rem}
}
@media(max-width:480px){.ms-hero{height:360px}}

/* ============================================================
   Hero Slideshow Engine
   Shared by every merchant layout template (_classic, _editorial,
   _minimal, _boutique, _studio). Each template injects the markup
   from _hero_slideshow.php into its own shaped container (full
   banner, circular frame, aspect-ratio box, etc) — this engine only
   owns the slide-cycling + image-arrangement mechanics, not the
   container's shape/position, so it drops into any layout.

   Markup:
     .vx-hero-slideshow[data-transition="X"][data-interval="N"]
       .vx-hero-slide.is-active   (one active at a time)
         .vx-hero-slide-grid.vx-layout-Y
           img*

   Slide transitions work by crossfading opacity while the *inactive*
   state also carries a transform/filter/clip-path offset. Since the
   outgoing slide animates active->inactive and the incoming slide
   animates inactive->active at the same time, both directions of
   the effect happen for free — no separate "leaving" bookkeeping.
   ============================================================ */
.vx-hero-slideshow{position:absolute;inset:0;overflow:hidden;perspective:1200px}
.vx-hero-slide{position:absolute;inset:0;opacity:0;z-index:1;transform-style:preserve-3d;backface-visibility:hidden;transition:opacity 1s ease,transform 1.1s ease,filter 1s ease,clip-path 1s ease,mask-position 1.1s ease}
.vx-hero-slide.is-active{opacity:1;z-index:2}
.vx-hero-slide-grid{display:grid;width:100%;height:100%;gap:10px;background:var(--vx-divider-colour,#ffffff)}
.vx-hero-slide-grid img{width:100%;height:100%;object-fit:cover;display:block}

/* Images-per-slide arrangement styles */
.vx-layout-single .vx-hero-slide-grid{grid-template-columns:1fr;grid-template-rows:1fr}
.vx-layout-rows .vx-hero-slide-grid{grid-template-columns:1fr;grid-auto-rows:1fr}
.vx-layout-grid .vx-hero-slide-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));grid-auto-rows:1fr}
.vx-layout-collage .vx-hero-slide-grid{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);grid-auto-flow:dense}
.vx-layout-collage .vx-hero-slide-grid img:nth-child(1){grid-column:span 2;grid-row:span 3}
.vx-layout-collage .vx-hero-slide-grid img:nth-child(2){grid-column:span 2;grid-row:span 2}
.vx-layout-collage .vx-hero-slide-grid img:nth-child(3){grid-column:span 2;grid-row:span 2}
.vx-layout-collage .vx-hero-slide-grid img:nth-child(4){grid-column:span 1;grid-row:span 1}
.vx-layout-collage .vx-hero-slide-grid img:nth-child(5){grid-column:span 1;grid-row:span 1}
.vx-layout-collage .vx-hero-slide-grid img:nth-child(6){grid-column:span 2;grid-row:span 2}

/* Ten modern transition effects, selected per-merchant via data-transition */
[data-transition="fade"] .vx-hero-slide{transform:none;filter:none;clip-path:none}

[data-transition="slide"] .vx-hero-slide{transform:translateX(10%)}
[data-transition="slide"] .vx-hero-slide.is-active{transform:translateX(0)}

[data-transition="zoom"] .vx-hero-slide{transform:scale(1.18)}
[data-transition="zoom"] .vx-hero-slide.is-active{transform:scale(1)}

[data-transition="kenburns"] .vx-hero-slide{transform:scale(1)}
[data-transition="kenburns"] .vx-hero-slide.is-active{transform:scale(1.1);transition:opacity 1.2s ease,transform 7s ease-out}

[data-transition="bubbles"] .vx-hero-slide{clip-path:circle(0% at 50% 50%)}
[data-transition="bubbles"] .vx-hero-slide.is-active{clip-path:circle(75% at 50% 50%)}

[data-transition="blinds"] .vx-hero-slide{mask-image:repeating-linear-gradient(90deg,#000 0 8%,transparent 8% 16%);-webkit-mask-image:repeating-linear-gradient(90deg,#000 0 8%,transparent 8% 16%);transform:scaleX(.001);transform-origin:left center}
[data-transition="blinds"] .vx-hero-slide.is-active{transform:scaleX(1)}

[data-transition="wipe"] .vx-hero-slide{clip-path:polygon(0 0,0 0,0 100%)}
[data-transition="wipe"] .vx-hero-slide.is-active{clip-path:polygon(0 0,100% 0,0 100%)}

[data-transition="flip"] .vx-hero-slide{transform:rotateY(90deg)}
[data-transition="flip"] .vx-hero-slide.is-active{transform:rotateY(0deg)}

[data-transition="dissolve"] .vx-hero-slide{filter:blur(20px) saturate(1.4)}
[data-transition="dissolve"] .vx-hero-slide.is-active{filter:blur(0) saturate(1)}

[data-transition="spiral"] .vx-hero-slide{transform:rotate(-14deg) scale(.8)}
[data-transition="spiral"] .vx-hero-slide.is-active{transform:rotate(0deg) scale(1)}

html{scroll-behavior:smooth}
.ms-section,#hero,#gallery{scroll-margin-top:180px}
@media(max-width:768px){.ms-section,#hero,#gallery{scroll-margin-top:120px}}
.ms-section{padding:5rem 0}
.ms-section:nth-child(even){background:var(--gray-50)}
.ms-section h2{font-size:clamp(1.6rem,2.5vw,2rem);font-weight:700;margin-bottom:1.75rem;text-align:center;color:var(--gray-900);letter-spacing:-.01em}

.ms-about p{max-width:720px;margin:0 auto;text-align:center;font-size:1.05rem;color:var(--gray-600)}

.under-review-notice{display:flex;align-items:center;gap:1rem;padding:1.25rem 1.5rem;background:#fef3c7;border-radius:var(--radius-lg);max-width:620px;margin:0 auto;color:#92400e;font-size:.95rem}
.review-icon{font-size:1.5rem}

.ms-block-content{max-width:720px;margin:0 auto;text-align:center;font-size:1rem;color:var(--gray-600)}

.ms-services-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}
.ms-service-card{background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius-lg);padding:1.75rem;transition:transform .2s,box-shadow .2s,border-color .2s;display:flex;flex-direction:column}
.ms-service-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-3px);border-color:var(--gray-300)}
.ms-service-card h3{font-size:1.05rem;font-weight:700;margin-bottom:.5rem;color:var(--gray-900);letter-spacing:-.01em}
.ms-service-card p{font-size:.9rem;color:var(--gray-500);margin-bottom:1rem;flex:1;line-height:1.55}
.ms-service-meta{display:flex;justify-content:space-between;align-items:center;font-size:.85rem;color:var(--gray-500);margin-bottom:1rem;padding-top:1rem;border-top:1px solid var(--gray-100)}
.ms-service-price{font-weight:700;color:var(--gray-900);font-size:1.1rem}
.ms-service-book{align-self:flex-start}

.ms-team-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem}
.ms-team-grid .ms-team-card{flex:0 1 200px}
.ms-team-card{text-align:center;padding:1rem}
.ms-team-avatar{width:128px;height:128px;border-radius:50%;background:var(--brand-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:2.5rem;margin:0 auto 1rem;overflow:hidden;box-shadow:0 10px 25px rgba(15,23,42,.08)}
.ms-team-avatar-photo img{width:100%;height:100%;object-fit:cover;display:block}
.ms-team-card h3{font-size:1rem;font-weight:700;margin-bottom:.25rem;color:var(--gray-900)}
.ms-team-role{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--brand-primary)}
.ms-team-bio{font-size:.85rem;color:var(--gray-500);margin-top:.5rem}

.ms-gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem}
.ms-gallery-item{border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:4/3;box-shadow:var(--shadow-sm)}
.ms-gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.ms-gallery-item:hover img{transform:scale(1.06)}

.ms-hours-list{max-width:440px;margin:0 auto;background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius-lg);padding:1rem 1.5rem;box-shadow:var(--shadow-sm)}
.ms-hours-row{display:flex;justify-content:space-between;padding:.6rem 0;border-bottom:1px solid var(--gray-100);font-size:.95rem}
.ms-hours-row:last-child{border-bottom:0}
.ms-hours-row.today{font-weight:600;color:var(--brand-primary)}
.day-name{font-weight:500}.closed{color:var(--gray-500)}

.ms-contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;max-width:760px;margin:0 auto 2rem}
.ms-contact-item{background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius-lg);padding:1.25rem 1.5rem;text-align:center}
.ms-contact-item strong{display:block;margin-bottom:.4rem;font-size:.75rem;color:var(--gray-500);font-weight:600;text-transform:uppercase;letter-spacing:.08em}
.ms-contact-item p{font-size:.95rem;color:var(--gray-800);font-weight:500}
.ms-social-links{display:flex;justify-content:center;gap:.75rem;flex-wrap:wrap}
.ms-social-link{display:inline-flex;padding:.5rem 1.1rem;border:1px solid var(--gray-200);border-radius:999px;font-size:.85rem;color:var(--gray-700);transition:all .15s;background:#fff}
.ms-social-link:hover{border-color:var(--brand-primary);color:var(--brand-primary)}

.ms-cta{background:#fff !important;padding:5rem 1rem}
.ms-cta .container{background:linear-gradient(135deg,var(--brand-primary),var(--brand-accent));color:#fff;border-radius:var(--radius-xl);padding:4rem 2rem;text-align:center;box-shadow:0 30px 60px -20px color-mix(in srgb,var(--brand-primary) 50%,transparent);position:relative;overflow:hidden;max-width:1000px}
.ms-cta .container::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 0%,rgba(255,255,255,.18),transparent 55%),radial-gradient(circle at 90% 100%,rgba(255,255,255,.12),transparent 50%);pointer-events:none}
.ms-cta h2{color:#fff;font-size:clamp(1.75rem,3vw,2.4rem);margin-bottom:.75rem;letter-spacing:-.02em;position:relative}
.ms-cta-sub{color:rgba(255,255,255,.92);margin:0 auto 2rem;font-size:1.05rem;max-width:520px;position:relative}
.ms-cta .btn-primary{background:#fff;color:var(--brand-primary);box-shadow:0 8px 22px rgba(0,0,0,.15);position:relative}
.ms-cta .btn-primary:hover{background:rgba(255,255,255,.92);transform:translateY(-1px)}
@media(max-width:600px){.ms-cta .container{padding:3rem 1.5rem}}

.ms-footer{background:var(--gray-900);color:var(--gray-400);padding:2rem 0;text-align:center;font-size:.85rem}
.ms-footer a{color:var(--gray-300)}
.ms-footer p{margin:.3rem 0}
.ms-powered{font-size:.8rem;opacity:.85}
.ms-powered a{color:#a78bfa;text-decoration:none;font-weight:600}
.ms-powered a:hover{text-decoration:underline}
