html{scroll-behavior:smooth}
body{margin:0;background:var(--color-bg);font-family:var(--font-body);color:var(--color-text)}
a{color:inherit;text-decoration:none}a:hover{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[role="button"]:focus-visible,[role="link"]:focus-visible{outline:2px solid #201e1d;outline-offset:2px}
[data-if]{display:contents}
[data-if][hidden]{display:none}
.hv1:hover{background:#000 !important}
.hv2:hover{background:var(--color-surface) !important}
.hv3:hover{text-decoration:underline !important}
.hv4:hover{transform:translateY(-50%) translateX(-6px) !important}
.hv5:hover{transform:translateY(-50%) translateX(6px) !important}
.hv6:hover{box-shadow:inset 0 0 0 4px #201e1d !important}
.hv7:hover{background:#f0ad52 !important}
.hv8:hover{background:rgba(32,30,29,.15) !important}
.hv9:hover{transform:scale(1.04) !important}
.hv10:hover{background:#7fbb6c !important}
.hv11:hover{background:#ec8bbe !important}

/* Gym gallery: large photo + video, scrollable thumbnail strip underneath */
.gal{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,1fr);grid-template-areas:"stage vid" "strip strip"}
.gal-stage{grid-area:stage;position:relative;aspect-ratio:16/10;overflow:hidden;border-right:2px solid #201e1d;border-bottom:2px solid #201e1d;background:#201e1d}
.gal-stage>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in}
.gal-arrow{position:absolute;top:50%;transform:translateY(-50%);width:56px;height:56px;border:2px solid #201e1d;background:#f3f2f2;color:#201e1d;font:800 22px/1 var(--font-body);cursor:pointer}
.gal-arrow:hover{color:#f3f2f2}
.gal-prev{left:16px}.gal-next{right:16px}
.gal-cap{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;gap:16px;padding:12px 16px;background:#f3f2f2;border-top:2px solid #201e1d;font:600 15px/1.3 var(--font-body);color:#201e1d}
.gal-cap>span:last-child{font-weight:700;letter-spacing:.08em;white-space:nowrap}
.gal-vid{grid-area:vid;position:relative;border-bottom:2px solid #201e1d;background:#201e1d;min-height:0}
.gal-strip{grid-area:strip;display:flex;overflow-x:auto;scroll-snap-type:x proximity;border-bottom:2px solid #201e1d;scrollbar-width:thin}
.gal-thumb{flex:0 0 clamp(120px,14vw,200px);aspect-ratio:1;padding:0;border:0;border-right:2px solid #201e1d;background:#201e1d;cursor:pointer;position:relative;overflow:hidden;scroll-snap-align:start;opacity:.6;transition:opacity .2s}
.gal-thumb:hover,.gal-thumb[aria-current="true"]{opacity:1}
.gal-thumb[aria-current="true"]::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 6px #e99c37}
.gal-thumb>img{width:100%;height:100%;object-fit:cover;display:block}

/* "Contact us" + live-agent launcher: one connected pair, bottom-right; sits under open panels/overlays */
.fab-group{position:fixed;right:24px;bottom:24px;z-index:50;display:flex;align-items:stretch;box-shadow:var(--shadow-lg)}
.fab-group .m-agent{position:static !important;box-shadow:none !important}
/* Compact launcher (inline-styled, so !important): no arrow, smaller type and padding */
.m-agent{min-width:0 !important;padding:12px 14px !important;gap:10px !important;font-size:15px !important}
.m-agent svg{width:18px;height:18px}
.m-agent>span:last-child{display:none}
.m-agent>span>span:last-child{font-size:11px !important}
.contact-fab{display:flex;align-items:center;gap:10px;padding:12px 14px;background:#6eab5b;color:#201e1d;border:2px solid #201e1d;border-right:0;font:800 15px/1 var(--font-heading)}
.contact-fab:hover{background:#7fbb6c;color:#201e1d}
.contact-fab svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;flex-shrink:0}

/* Service-page questions: native <details>, one row per question */
.faq details{border-bottom:2px solid #201e1d}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover h3{text-decoration:underline}
.faq summary h3{margin:0;font:800 22px/1.2 var(--font-heading)}
.faq-plus{flex-shrink:0;font:800 32px/1 var(--font-heading);transition:transform .2s}
.faq details[open] .faq-plus{transform:rotate(45deg)}
.faq-a{padding:0 0 24px;max-width:68ch;font:500 17px/1.6 var(--font-body)}
.faq-a p{margin:0 0 12px}.faq-a p:last-child{margin:0}
.faq-a a{text-decoration:underline;text-underline-offset:3px}

/* ---------- Mobile (≤ 820px) — the pages are inline-styled, so overrides need !important ---------- */
.m-menu{display:none}
@media (max-width:820px){
  html,body{overflow-x:clip}

  /* Top bar: one line — phone + socials */
  .m-topbar{padding:8px 16px !important;flex-wrap:nowrap !important;font-size:12px !important}
  .m-topbar>div{gap:16px !important;flex-wrap:nowrap !important}
  .m-topbar>div:first-child>span,.m-topbar>div:last-child>a:first-child{display:none}

  /* Header: brand + menu button; nav and actions drop down when open */
  .m-header{flex-wrap:wrap !important}
  .m-brand{border-right:0 !important;padding:12px 16px !important;flex:1}
  .m-menu{display:flex;flex-direction:column;justify-content:center;gap:5px;width:56px;border:0;border-left:2px solid #201e1d;background:transparent;padding:0 16px;cursor:pointer}
  .m-menu span{display:block;height:2px;background:#201e1d;transition:transform .2s,opacity .2s}
  .m-open .m-menu span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .m-open .m-menu span:nth-child(2){opacity:0}
  .m-open .m-menu span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .m-nav,.m-actions{display:none !important}
  .m-open .m-nav{display:flex !important;flex:1 1 100% !important;flex-direction:column;align-items:stretch !important;gap:0 !important;padding:0 !important;border-top:2px solid #201e1d;font-size:18px !important;max-height:calc(100vh - 140px);overflow-y:auto}
  .m-open .m-nav a{padding:16px !important;border-bottom:1px solid var(--color-divider)}
  .m-open .m-actions{display:flex !important;flex:1 1 100%;border-top:2px solid #201e1d}
  .m-open .m-actions a{flex:1;padding:16px !important;border-left:0 !important}

  /* Home hero: active pillar fills the width; the other two stay visible as tappable colour strips */
  .m-hero{height:min(560px,calc(100svh - 170px)) !important;min-height:440px}
  .m-card{flex:0 0 52px !important;min-width:0 !important}
  .m-card.is-active{flex:1 1 auto !important}
  .m-card [data-dyn*=".shut"]{z-index:3}
  .m-card [data-dyn*=".shut"]>div:first-child{flex:1;writing-mode:vertical-rl;align-items:center !important;padding:16px 0 !important;border-bottom:0 !important}
  .m-card [data-dyn*=".shut"]>div:first-child>span:first-child{font-size:30px !important;overflow-wrap:normal !important;white-space:nowrap}
  .m-card [data-dyn*=".shut"]>div:first-child>span:last-child,.m-card [data-dyn*=".shut"]>div:not(:first-child){display:none !important}
  .m-card>div:first-child{padding:20px 16px 14px !important;font-size:56px !important}
  .m-card [data-action^="bk"]{min-width:0 !important}
  .m-card>div[style*="height:104px"]{padding:14px 16px !important;height:auto !important;align-items:center !important;gap:10px !important}
  .m-card>div[style*="height:104px"]>[data-action^="bk"]{flex-shrink:0;gap:10px !important}
  .m-card>div[style*="height:104px"]>span:first-child{align-self:center !important;white-space:normal}
  .m-card [data-action="openOcc"]{left:16px !important;bottom:96px !important;min-width:0 !important}
  .m-card [data-action="prevCard"],.m-card [data-action="nextCard"]{width:56px !important}
  .m-card [data-action="prevCard"] svg,.m-card [data-action="nextCard"] svg{width:48px;height:48px}
  .m-tabs>div:first-child{flex:1}
  .m-tabs [data-action="d.go"]{flex:1;justify-content:center;padding:0 8px !important;font-size:14px !important}
  .m-tabs [data-action="d.go"]:last-child{border-right:0 !important}
  .m-counter{display:none !important}

  /* Gym gallery: photo, thumbnails, then video, stacked */
  .gal{grid-template-columns:minmax(0,1fr);grid-template-areas:"stage" "strip" "vid"}
  .gal-stage{border-right:0;aspect-ratio:4/3}
  .gal-arrow{width:44px;height:44px;font-size:18px}
  .gal-prev{left:8px}.gal-next{right:8px}
  .gal-cap{font-size:13px;padding:10px 12px}
  .gal-thumb{flex-basis:96px}
  .gal-vid{aspect-ratio:16/10}

  /* About: building photo keeps its wide shape */
  .about-building{min-height:0 !important;aspect-ratio:16/9}

  /* Stacked columns: swap side dividers for bottom dividers */
  [style*="repeat(auto-fit"]>[style*="border-right:2px solid #201e1d"],
  [style*="flex-wrap:wrap"]>[style*="border-right:2px solid #201e1d"]{border-right:0 !important;border-bottom:2px solid #201e1d}

  /* Tighter section padding */
  [style*="padding:72px 32px"]{padding:48px 16px !important}
  [style*="padding:48px 32px"]{padding:36px 16px !important}

  /* Agent launcher: compact */
  .m-agent{right:12px !important;bottom:12px !important;padding:10px 12px !important;gap:8px !important;font-size:14px !important}
  .m-agent>span>span:last-child{display:none}
  .fab-group{right:12px;bottom:12px}
  .contact-fab{padding:10px 12px;gap:8px;font-size:14px}
}