/* /gyms/: the gym offer. Same tokens, fonts and section rhythm (--sec, --head) as the rest of zxn.uk; one action colour (orange, .gy-btn in style.css).
   Phone first: most owners open it from WhatsApp or email. Dark bands open and close the page; the Bookings band is the full-bleed break. */
.gyms{--gy-dim:#c9ced6}
.gyms .scene{margin:0;background:color-mix(in srgb,var(--accent) 62%,#fff);border:1.5px solid var(--ink);border-radius:10px}
.gyms .desk{box-shadow:5px 6px 0 #11111126}
.gyms figure{margin:0}
.gyms figcaption{margin-top:12px;font-size:15px;line-height:1.45;color:var(--muted)}
.gy-tag{margin:0;font:700 13px/1.3 var(--body);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-soft)}
.gy-body{max-width:40em;margin:var(--head) 0 0;font-size:clamp(17px,1.6vw,20px);line-height:1.5}
.gy-small{font-size:15px;line-height:1.45;color:var(--muted)}
.gy-ticks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.gy-ticks li{position:relative;padding-left:28px;font-size:16px;line-height:1.4}
.gy-ticks li:before{content:"";position:absolute;left:4px;top:.22em;width:6px;height:11px;border:solid currentColor;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}

/* Hero: a dark band, the promise in big type on the left and the Explosive Boxing site on the right */
.gy-hero{background:var(--ink);color:var(--paper);padding-block:clamp(32px,5vw,80px) clamp(40px,6vw,96px)}
.gy-hero-in{display:grid;gap:clamp(32px,5vw,56px);align-items:center}
.gy-hero-copy{min-width:0}
.gy-kicker{margin:0;font:700 13px/1.35 var(--body);letter-spacing:.09em;text-transform:uppercase;color:var(--orange)}
.gy-hero h1{margin:16px 0 0;font:700 clamp(50px,10.5vw,124px)/.92 var(--display);letter-spacing:-.06em;color:var(--paper)}
.gy-pt{font-style:normal;color:var(--mark)}
.gy-offer{display:inline-block;margin:clamp(18px,2.4vw,28px) 0 0;font:700 clamp(21px,2.4vw,30px)/1.15 var(--display);letter-spacing:-.03em;position:relative;isolation:isolate}
.gy-offer:after{content:"";position:absolute;z-index:-1;left:0;right:0;bottom:.06em;height:.3em;background:var(--orange);opacity:.85}
.gy-lead{max-width:34em;margin:16px 0 0;font-size:clamp(17px,1.7vw,21px);line-height:1.5;color:var(--gy-dim)}
.gy-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin:clamp(24px,3vw,36px) 0 0}
.gy-link{display:inline-flex;align-items:center;min-height:44px;font-weight:650;color:inherit;text-decoration:underline;text-decoration-thickness:1.5px}
.gy-urgent{display:flex;gap:10px;align-items:baseline;max-width:34em;margin:20px 0 0;font-size:15px;line-height:1.45;color:var(--gy-dim)}
.gy-urgent:before{content:"";flex:none;width:9px;height:9px;background:var(--orange);transform:translateY(-1px)}
.gy-hero-shot{position:relative}
.gy-hero-shot .scene{padding:clamp(14px,2.2vw,28px) clamp(14px,2.2vw,28px) clamp(28px,4vw,48px);border-color:var(--paper)}
.gy-hero-shot .phone{right:clamp(18px,4vw,48px);bottom:clamp(12px,2vw,24px);width:clamp(76px,22%,170px)}
.gy-hero .gy-hero-shot figcaption{color:var(--gy-dim)}
@media(min-width:1000px){.gy-hero-in{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}}
@media(max-width:620px){.gy-cta{display:grid;justify-items:start}.gy-cta .gy-btn{width:100%}}

/* Proof */
.gy-proof{display:grid;gap:clamp(28px,4vw,56px);align-items:center;padding-block:var(--sec)}
.gy-proof h2{margin:14px 0 0;font:700 clamp(30px,4vw,54px)/1 var(--display);letter-spacing:-.045em}
.gy-links{display:flex;flex-wrap:wrap;gap:4px 24px;margin:20px 0 0}
.gy-links a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);font-weight:650;text-underline-offset:3px}
.gy-figure{display:grid;gap:6px;margin:24px 0 0}
.gy-figure strong{font:700 clamp(30px,3.6vw,46px)/1 var(--display);letter-spacing:-.04em}
.gy-figure span{font-size:15px;color:var(--muted)}
.gy-quote{margin-top:24px}
@media(min-width:1000px){.gy-proof{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}}

/* The usual problems: one numbered row each, the worry big, what we do beside it */
.gy-why{padding-block:0 var(--sec)}
.gy-why .grp-h,.gy-inc .grp-h,.gy-prices .grp-h{border-bottom:1.5px solid var(--ink);padding-bottom:12px}
.gy-fix{list-style:none;margin:0;padding:0;counter-reset:fix}
.gy-fix li{counter-increment:fix;display:grid;grid-template-columns:2.4rem minmax(0,1fr);gap:8px 12px;padding-block:22px;border-bottom:1px solid var(--line)}
.gy-fix li:before{content:counter(fix,decimal-leading-zero);grid-row:1/3;padding-top:.5em;font:700 14px/1 var(--body);color:var(--muted);font-variant-numeric:tabular-nums}
.gy-worry{margin:0;font:700 clamp(22px,2.4vw,32px)/1.12 var(--display);letter-spacing:-.035em}
.gy-answer{margin:0;max-width:34em;font-size:17px;line-height:1.5;color:var(--ink-soft)}
@media(min-width:900px){.gy-fix li{grid-template-columns:3rem minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:baseline}.gy-fix li:before{grid-row:auto;padding-top:0}}

/* What's included: the website, then the named extras with what each would cost on its own */
.gy-inc{padding-block:0 var(--sec)}
.gy-inc-grid{display:grid;gap:24px;margin-top:var(--head)}
.gy-core,.gy-bonus{min-width:0;padding:clamp(20px,2.6vw,32px);border:1.5px solid var(--ink);border-radius:10px}
.gy-core{background:#fff;box-shadow:5px 6px 0 #11111126}
.gy-bonus{background:var(--paper-3)}
.gy-core h3,.gy-bonus h3{margin:0 0 20px;font:700 clamp(24px,2.4vw,32px)/1.05 var(--display);letter-spacing:-.04em}
.gy-bonuses{list-style:none;margin:0;padding:0;display:grid}
.gy-bonuses li{display:grid;gap:6px;padding-block:16px;border-top:1px solid var(--line)}
.gy-bonuses li:first-child{padding-top:0;border-top:0}
.gy-b-h{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px;margin:0;font:700 18px/1.25 var(--display);letter-spacing:-.02em}
.gy-worth{flex:none;padding:3px 10px;border:1.5px solid var(--ink);border-radius:999px;background:color-mix(in srgb,var(--orange) 45%,#fff);font:700 13px/1.3 var(--body);letter-spacing:0}
.gy-bonuses li>p:not(.gy-b-h){margin:0;font-size:16px;line-height:1.45}
.gy-b-total{margin:20px 0 0;padding-top:16px;border-top:1.5px solid var(--ink);font-size:15px;font-weight:650}
@media(min-width:900px){.gy-inc-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}}

/* zxn.uk Bookings: the full-bleed break */
.gy-book{padding-block:var(--sec);background:color-mix(in srgb,var(--teal) 24%,var(--paper));border-block:1.5px solid var(--ink)}
.gy-book h2{max-width:20ch;margin:14px 0 0;font:700 clamp(32px,4.6vw,62px)/1 var(--display);letter-spacing:-.05em}
.gy-book-grid{list-style:none;margin:clamp(28px,4vw,48px) 0 0;padding:0;display:grid;gap:28px}
.gy-book-grid .scene{padding:clamp(14px,2vw,22px)}
.gy-book-grid .desk img{aspect-ratio:16/10}
.gy-phone-scene{display:flex;justify-content:center}
.gy-phone-scene .phone--solo{width:min(31%,200px)}
.gy-book-grid figcaption{color:var(--ink-soft)}
.gy-book-foot{display:grid;gap:14px;max-width:62ch;margin-top:clamp(28px,4vw,44px)}
.gy-book-foot p{margin:0;font-size:17px;line-height:1.5}
.gy-book-foot .gy-small{font-size:15px;color:var(--ink-soft)}
.gy-actions{margin-top:6px}
@media(min-width:700px){.gy-book-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Prices */
.gy-prices{padding-block:var(--sec)}
.gy-anchor{margin:var(--head) 0 0;font-size:15px;line-height:1.45;color:var(--muted)}
.gy-found{display:grid;gap:8px;margin-top:20px;padding:20px;border:1.5px solid var(--ink);border-radius:10px;background:color-mix(in srgb,var(--orange) 30%,#fff)}
.gy-found p{margin:0;font-size:16px;line-height:1.45;max-width:62ch}
.gy-found .gy-found-n{font:700 clamp(22px,2.4vw,30px)/1.1 var(--display);letter-spacing:-.03em}
.gy-tiers{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:24px}
.gy-tier article{display:flex;flex-direction:column;height:100%;padding:clamp(20px,2.4vw,30px);background:#fff;border:1.5px solid var(--ink);border-radius:10px}
.gy-tier.is-featured article{background:var(--ink);color:var(--paper);box-shadow:6px 7px 0 var(--orange)}
.gy-badge{align-self:flex-start;margin:0 0 14px;padding:4px 12px;border-radius:999px;background:var(--orange);color:var(--ink);font:700 13px/1.3 var(--body)}
.gy-tier h3{margin:0;font:700 clamp(26px,2.6vw,34px)/1.05 var(--display);letter-spacing:-.04em}
.gy-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:18px 0 0}
.gy-price strong{font:700 clamp(48px,5vw,64px)/1 var(--body);letter-spacing:-.04em}
.gy-price span{font-size:15px;font-weight:650}
.gy-inc-vat{margin:6px 0 0;font-size:14px;color:var(--muted)}
.gy-tier.is-featured .gy-inc-vat{color:var(--gy-dim)}
.gy-tier-line{margin:16px 0 0;font-size:16px;line-height:1.45}
.gy-tier .gy-ticks{margin:16px 0 0;padding-top:16px;border-top:1.5px solid currentColor}
.gy-tier .gy-ticks li{font-size:15px}
.gy-tier .gy-btn{margin-top:auto;width:100%}
.gy-tier .gy-ticks+.gy-btn{margin-top:24px}
.gy-terms{display:grid;gap:10px;max-width:70ch;margin-top:28px}
.gy-terms p{margin:0;font-size:16px;line-height:1.5}
@media(min-width:1000px){.gy-tiers{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}}

/* The launch promise */
.gy-promise{padding-block:0 var(--sec)}
.gy-promise-box{display:grid;gap:12px;padding:clamp(22px,3.4vw,44px);background:var(--paper-3);border:3px solid var(--ink);border-radius:14px}
.gy-promise-t{margin:0;max-width:30em;font:700 clamp(24px,3vw,40px)/1.15 var(--display);letter-spacing:-.035em}

/* The mock-up form */
.gy-form-band{padding-block:var(--sec);background:var(--paper-2);border-top:1.5px solid var(--ink)}
.gy-form-in{display:grid;gap:28px}
.gy-form-copy h2{margin:0;font:700 clamp(32px,4.4vw,58px)/1 var(--display);letter-spacing:-.05em}
.gy-urgent-list{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:10px}
.gy-urgent-list li{position:relative;padding-left:19px;font-size:16px;line-height:1.45}
.gy-urgent-list li:before{content:"";position:absolute;left:0;top:.5em;width:9px;height:9px;background:var(--orange);border:1px solid #11111140}
.gy-form-wrap{min-width:0}
.gy-opt{font-size:14px;font-weight:500;color:var(--ink-soft)}
.gy-sent .sent-h{font-size:clamp(26px,3.4vw,40px);line-height:1.05}
.gy-sent a{font-weight:650}
@media(min-width:1000px){.gy-form-in{grid-template-columns:minmax(0,1fr) minmax(0,600px);column-gap:72px;align-items:start}}

/* Questions and the close */
.gy-faq{padding-top:var(--sec)}
.gy-close{padding-block:var(--sec);background:var(--ink);color:var(--paper)}
.gy-close h2{max-width:18ch;margin:0;font:700 clamp(34px,5.4vw,72px)/1 var(--display);letter-spacing:-.05em}
.gy-close-in>p:not(.gy-cta){max-width:40em;margin:18px 0 0;font-size:clamp(17px,1.7vw,21px);line-height:1.5;color:var(--gy-dim)}
