/* VMC premium layer, shared by every page (loaded before each page's own Figma styles).
   Sticky bar, full screen menu, reveal on scroll, image depth, focus and selection.
   Colours are the Figma style guide: brown #3e2f2c, cream #f3eeeb, tan #dfcaaf, rose #9a6869. */
html{scroll-behavior:smooth;scroll-padding-top:84px}
::selection{background:#dfcaaf;color:#3e2f2c}
:focus-visible{outline:2px solid #9a6869;outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:16px;top:-60px;z-index:100;background:#3e2f2c;color:#f3eeeb;padding:10px 16px;border-radius:999px;font:500 14px/1 Poppins,Arial,sans-serif;transition:top .2s}
.skip:focus{top:12px}

/* ---------- sticky bar (appears once the hero has scrolled away) ---------- */
.vbar{position:fixed;left:0;right:0;top:0;z-index:50;transform:translateY(-105%);transition:transform .5s cubic-bezier(.2,.7,.2,1);background:rgba(62,47,44,.94);color:#f3eeeb;-webkit-backdrop-filter:saturate(1.3) blur(16px);backdrop-filter:saturate(1.3) blur(16px);box-shadow:0 12px 32px rgba(30,20,18,.18)}
.vbar.show{transform:none}
.vbar-in{max-width:1440px;margin:0 auto;height:72px;padding:0 52px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.vbar-logo{display:block;width:124px;height:40px;flex:none}
.vbar-logo img{width:100%;height:100%}
.vbar nav{display:flex;gap:34px;font:500 12px/1 Poppins,Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase}
.vbar nav a{position:relative;padding:8px 0;opacity:.88;transition:opacity .2s}
.vbar nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:#dfcaaf;transform:scaleX(0);transform-origin:left;transition:transform .35s ease}
.vbar nav a:hover{opacity:1}
.vbar nav a:hover::after,.vbar nav a[aria-current]::after{transform:scaleX(1)}
.vbar-act{display:flex;align-items:center;gap:18px;flex:none}
.vbar-call{display:inline-flex;align-items:center;gap:8px;font:400 13px/1 Poppins,Arial,sans-serif;letter-spacing:.06em;opacity:.9}
.vbar-call svg{width:16px;height:16px}
.vbar-book{display:inline-flex;align-items:center;justify-content:center;height:42px;padding:0 22px;border-radius:999px;background:#f3eeeb;color:#3e2f2c;font:500 12px/1 Poppins,Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;transition:background .25s,color .25s}
.vbar-book:hover{background:#dfcaaf}
.vbar-menu{display:none;width:44px;height:44px;place-items:center;border:0;background:none;color:#f3eeeb;cursor:pointer}
.vbar-menu svg{width:26px;height:26px}
@media (max-width:1099px){
  .vbar-in{height:60px;padding:0 12px 0 16px;gap:10px}
  .vbar-logo{width:98px;height:32px}
  .vbar nav,.vbar-call span{display:none}
  .vbar-act{gap:6px}
  .vbar-call{width:40px;height:40px;justify-content:center;border:1px solid rgba(243,238,235,.35);border-radius:50%}
  .vbar-book{height:38px;padding:0 14px;font-size:11px;letter-spacing:.12em}
  .vbar-menu{display:grid}
}

/* ---------- full screen menu ---------- */
.vmenu{position:fixed;inset:0;z-index:60;background:#3e2f2c;color:#f3eeeb;display:flex;flex-direction:column;padding:18px 24px 28px;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility 0s linear .35s;overflow-y:auto}
.vmenu::before{content:"";position:absolute;inset:0;background:url(../img/cta-waves.webp) center/cover;mix-blend-mode:overlay;opacity:.14;pointer-events:none}
.vmenu.open{opacity:1;visibility:visible;transition:opacity .35s ease}
.vmenu-top{position:relative;display:flex;align-items:center;justify-content:space-between;height:48px}
.vmenu-top img{width:110px;height:36px}
.vmenu-close{width:44px;height:44px;display:grid;place-items:center;border:1px solid rgba(243,238,235,.35);border-radius:50%;background:none;color:#f3eeeb;cursor:pointer}
.vmenu-close svg{width:18px;height:18px}
.vmenu-links{position:relative;list-style:none;margin:40px 0 0;padding:0}
.vmenu-links li{border-bottom:1px solid rgba(243,238,235,.16)}
.vmenu-links a{display:flex;align-items:center;justify-content:space-between;padding:16px 0;font:400 34px/1.15 'Playfair Display',Georgia,serif;transform:translateY(12px);opacity:0;transition:transform .5s cubic-bezier(.2,.7,.2,1),opacity .5s}
.vmenu-links a svg{width:22px;height:22px;opacity:.6}
.vmenu.open .vmenu-links a{transform:none;opacity:1}
.vmenu.open .vmenu-links li:nth-child(2) a{transition-delay:.05s}
.vmenu.open .vmenu-links li:nth-child(3) a{transition-delay:.1s}
.vmenu.open .vmenu-links li:nth-child(4) a{transition-delay:.15s}
.vmenu.open .vmenu-links li:nth-child(5) a{transition-delay:.2s}
.vmenu-kicker{position:relative;margin:36px 0 12px;font:500 11px/1 Poppins,Arial,sans-serif;letter-spacing:.3em;text-transform:uppercase;color:#dfcaaf}
.vmenu-chips{position:relative;display:flex;flex-wrap:wrap;gap:8px}
.vmenu-chips a{padding:9px 14px;border:1px solid rgba(243,238,235,.28);border-radius:999px;font:400 13px/1 Poppins,Arial,sans-serif}
.vmenu-foot{position:relative;margin-top:auto;padding-top:32px;display:flex;flex-direction:column;gap:14px;font:300 14px/1.5 Poppins,Arial,sans-serif}
.vmenu-foot a.tel{font:400 22px/1 'Playfair Display',Georgia,serif}
.vmenu-book{display:flex;align-items:center;justify-content:center;height:54px;border-radius:999px;background:#f3eeeb;color:#3e2f2c;font:500 13px/1 Poppins,Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase}
body.menu-open{overflow:hidden}

/* ---------- reveal on scroll (only when JS ran and motion is allowed) ---------- */
.rv{opacity:0;transform:translateY(22px);transition:opacity 1s ease,transform 1s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}

/* ---------- image depth on hover ---------- */
.pimg,.panel-img,.timg,.laser-img,.fit-img,.strip{overflow:hidden}
.pimg img,.panel-img img,.timg img,.laser-img img,.strip img{transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.pcard:hover .pimg img,.panel:hover .panel-img img,.tpanel:hover .timg img,.laser-row:hover .laser-img img,.blend:hover .strip img{transform:scale(1.045)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;transition:none}
  .vbar,.vmenu,.vmenu-links a{transition:none}
}

/* ---------- WordPress additions ---------- */
/* zero specificity resets, so the bar and menu look right on pages without the Figma page reset */
:where(.vbar,.vmenu) *,:where(.vbar,.vmenu) *::before,:where(.vbar,.vmenu) *::after{box-sizing:border-box}
:where(.vbar,.vmenu) a{color:inherit;text-decoration:none}
:where(.vbar,.vmenu) img{display:block;max-width:100%}
:where(.vbar,.vmenu){font-family:Poppins,Arial,sans-serif}
.vbar.static{transform:none}
body.menu-open .mangomint-chat-container{visibility:hidden}
body.vmc-bar-static{padding-top:72px}
body.admin-bar .vbar{top:32px}
body.admin-bar .vmenu{top:32px}
@media (max-width:1099px){body.vmc-bar-static{padding-top:60px}}
@media (max-width:782px){body.admin-bar .vbar,body.admin-bar .vmenu{top:46px}}