*{
    box-sizing:border-box
}
html{
    scroll-behavior:smooth
}
body{
    margin:0;
    background:#101112;
    color:#fff;
    font-family:DM Sans,sans-serif
}
a{
    color:inherit;
    text-decoration:none
}
img{
    display:block;
    width:100%;
    object-fit:cover
}
button{
    font:inherit;
    cursor:pointer
}
.gym-demo{
    background:#ff581c;
    color:#161616;
    text-align:center;
    font-size:10px;
    letter-spacing:.13em;
    font-weight:800;
    padding:9px
}
.gym-head{
    height:84px;
    background:#101112;
    display:flex;
    align-items:center;
    gap:30px;
    justify-content:space-between;
    padding:0 5%;
    border-bottom:1px solid #333;
    position:sticky;
    top:0;
    z-index:20
}
.gym-logo,.gym-foot>b{
    font:900 34px Barlow Condensed;
    letter-spacing:-.02em
}
.gym-logo span,.gym-foot span{
    color:#ff581c
}
.gym-logo b{
    font-size:19px;
    margin-left:8px;
    color:#ff581c
}
.gym-head nav{
    display:flex;
    gap:25px;
    font-size:11px;
    letter-spacing:.1em;
    font-weight:800
}
.gym-head nav a:hover{
    color:#ff581c
}
.join,.orange-btn{
    background:#ff581c;
    color:#151515;
    font:900 15px Barlow Condensed;
    letter-spacing:.09em;
    padding:16px 23px;
    display:inline-flex;
    align-items:center;
    gap:20px
}
.join:hover,.orange-btn:hover{
    background:#ff8655
}
#gym-toggle{
    display:none;
    background:none;
    border:0;
    color:#fff;
    font-size:24px
}
.gym-hero{
    position:relative;
    min-height:740px;
    display:flex;
    align-items:center;
    overflow:hidden;
    background:#111
}
.gym-hero img{
    position:absolute;
    inset:0;
    height:100%;
    filter:grayscale(100%);
    object-position:center 40%
}
.gym-hero:after{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,#0e0e0f 4%,#0e0e0fba 52%,#0e0e0f24)
}
.gym-hero-content{
    position:relative;
    z-index:1;
    padding:90px 8%;
    max-width:950px
}
.micro{
    color:#ff581c;
    font-weight:900;
    font-size:12px;
    letter-spacing:.23em
}
.gym-hero h1,.gym-section h2,.page-hero h1{
    font:900 clamp(90px,12vw,180px)/.78 Barlow Condensed;
    letter-spacing:-.035em;
    margin:35px 0
}
.gym-hero h1 em{
    font-style:normal;
    color:#ff581c
}
.gym-hero-content>p:not(.micro){
    max-width:440px;
    line-height:1.8;
    color:#ddd;
    font-size:17px
}
.gym-hero .orange-btn{
    margin-top:25px
}
.gym-stripe{
    background:#ff581c;
    color:#141414;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    padding:22px 6%;
    gap:20px
}
.gym-stripe div{
    border-right:1px solid #1115;
    padding:0 25px
}
.gym-stripe div:last-child{
    border:0
}
.gym-stripe strong{
    font:900 30px Barlow Condensed;
    display:block
}
.gym-stripe span{
    font-size:11px;
    font-weight:800;
    letter-spacing:.13em
}
.gym-section{
    padding:110px 7%
}
.gym-section h2{
    font-size:clamp(70px,8vw,115px);
    margin:20px 0 50px
}
.gym-section h2 span{
    color:#ff581c
}
.class-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:15px
}
.class-tile{
    height:490px;
    position:relative;
    overflow:hidden;
    background:#222
}
.class-tile img{
    height:100%;
    filter:grayscale(75%);
    transition:transform .5s
}
.class-tile:hover img{
    transform:scale(1.08)
}
.class-tile:after{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,#000e,transparent 70%)
}
.class-tile .tile-content{
    position:absolute;
    bottom:30px;
    left:30px;
    right:30px;
    z-index:1
}
.tile-content small{
    color:#ff581c;
    font-weight:800;
    letter-spacing:.18em
}
.tile-content h3{
    font:900 43px Barlow Condensed;
    margin:8px 0
}
.tile-content p{
    font-size:13px;
    line-height:1.6;
    color:#ddd
}
.gym-callout{
    background:#ff581c;
    color:#111;
    padding:85px 8%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:30px
}
.gym-callout h2{
    font:900 clamp(65px,8vw,115px)/.85 Barlow Condensed;
    margin:0
}
.gym-callout .orange-btn{
    background:#151515;
    color:#fff
}
.gym-foot{
    padding:65px 7%;
    background:#090a0a;
    display:flex;
    flex-direction:column;
    gap:15px
}
.gym-foot p{
    color:#aaa
}
.gym-foot small{
    color:#888
}
.gym-foot a{
    color:#ff581c;
    font-weight:800;
    font-size:12px;
    letter-spacing:.1em
}
.page-hero{
    background:#1c1d1e;
    padding:90px 7% 70px;
    border-bottom:8px solid #ff581c
}
.page-hero h1{
    font-size:clamp(80px,10vw,140px);
    margin:25px 0
}
.page-hero p:not(.micro){
    color:#aaa;
    max-width:650px;
    line-height:1.8
}
.gym-split{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center
}
.gym-split img{
    height:480px
}
.gym-split p{
    color:#bbb;
    line-height:1.9
}
.gym-split h2{
    margin:15px 0;
    font-size:80px
}
.schedule{
    width:100%;
    border-collapse:collapse
}
.schedule td,.schedule th{
    border-bottom:1px solid #444;
    padding:22px 15px;
    text-align:left
}
.schedule th{
    color:#ff581c
}
.gallery-grid{
    display:grid;
    grid-template-columns:1.5fr 1fr;
    gap:14px
}
.gallery-grid img{
    height:330px
}
.gallery-grid img:first-child{
    grid-row:span 2;
    height:674px
}
.contact-panel{
    background:#1c1d1e;
    padding:45px;
    max-width:850px
}
.contact-panel p{
    color:#aaa;
    line-height:1.8
}
.faq-item{
    border-bottom:1px solid #444
}
.faq-item button{
    width:100%;
    border:0;
    background:transparent;
    color:#fff;
    text-align:left;
    padding:24px 0;
    font-weight:800;
    display:flex;
    justify-content:space-between
}
.faq-item p{
    display:none;
    color:#bbb;
    line-height:1.8
}
.faq-item.open p{
    display:block
}
.faq-item.open button span{
    transform:rotate(45deg)
}
@media(max-width:1050px){
    .gym-head nav{
        display:none;
        position:absolute;
        top:84px;
        left:0;
        right:0;
        background:#111;
        padding:30px;
        flex-direction:column
    }
    .gym-head nav.open{
        display:flex
    }
    #gym-toggle{
        display:block
    }
    .gym-head .join{
        display:none
    }
    .class-grid{
        grid-template-columns:1fr 1fr
    }
    .gym-split{
        grid-template-columns:1fr
    }
}
@media(max-width:650px){
    .gym-hero{
        min-height:650px
    }
    .gym-hero h1{
        font-size:clamp(75px,19vw,130px)
    }
    .gym-stripe{
        grid-template-columns:1fr
    }
    .gym-stripe div{
        border-right:0;
        border-bottom:1px solid #1114;
        padding:10px
    }
    .class-grid,.gallery-grid{
        grid-template-columns:1fr
    }
    .gallery-grid img:first-child{
        grid-row:auto;
        height:330px
    }
    .class-tile{
        height:420px
    }
    .gym-callout{
        display:block
    }
    .gym-callout .orange-btn{
        margin-top:30px
    }
    .gym-section{
        padding:70px 6%
    }
    .gym-section h2{
        font-size:70px
    }
    .page-hero h1{
        font-size:75px
    }
    .gym-split h2{
        font-size:65px
    }
}
@media(prefers-reduced-motion:reduce){
    html{
        scroll-behavior:auto
    }
    .class-tile img{
        transition:none
    }
}