/* ========================================================================== Fitbox Studio + Momentum — shared stylesheet Two identities, one file, scoped by a class on : .t-chooser the front door .t-fitbox personal training / group fitness (dark, loud, red) .t-momentum construction & logistics (light, tight, industrial) Load-bearing rules live in BUILD-BRIEF.md §7 and DESIGN.md. Do not "improve". ========================================================================== */ *,*::before,*::after{box-sizing:border-box} html{-webkit-text-size-adjust:100%} body{margin:0} img{max-width:100%;display:block;height:auto} a{color:inherit} h1,h2,h3,p{margin:0} :focus-visible{outline:2px solid currentColor;outline-offset:3px} /* -------------------------------------------------------------------------- Oswald — self-hosted. One variable file per subset (weight axis 200–700), so 400 and 700 both come from the same download. font-display:swap: text paints in the fallback immediately, re-flows to Oswald when it arrives. Used by .t-chooser / .t-fitbox / .t-thanks headings. Not .t-momentum. -------------------------------------------------------------------------- */ @font-face{ font-family:'Oswald'; font-style:normal; font-weight:200 700; font-display:swap; src:url('/assets/fonts/oswald-latin.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; } @font-face{ font-family:'Oswald'; font-style:normal; font-weight:200 700; font-display:swap; src:url('/assets/fonts/oswald-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; } /* -------------------------------------------------------------------------- Reveals — visible by default; hidden only after the observer is ready. Never invert this (blank page anywhere that does not scroll). -------------------------------------------------------------------------- */ .reveal{opacity:1} .reveals-ready .reveal{opacity:0;transform:translateY(18px); transition:opacity .5s ease,transform .5s ease} .reveals-ready .reveal.in{opacity:1;transform:none} @media (prefers-reduced-motion:reduce){ .reveals-ready .reveal{opacity:1;transform:none;transition:none} } /* -------------------------------------------------------------------------- Shared image treatment Every image: thin static red edge. Glow is a pseudo-element behind the image, faded via opacity only. Never animate box-shadow. -------------------------------------------------------------------------- */ .shot{position:relative;display:block;border:1px solid var(--red-deep, #7A0A12)} .shot::before{ content:"";position:absolute;inset:-6px;border-radius:inherit; background:radial-gradient(closest-side, rgba(193,18,31,.55), transparent 75%); opacity:0;transition:opacity .25s ease;z-index:-1; } .shot:hover::before,.shot:focus-within::before{opacity:1} .shot--hero::before{opacity:.8} .shot img{width:100%} /* ========================================================================== CHOOSER — full-bleed split: Fitbox (photo, dark) | Momentum (photo, cream). Hovering a half expands it; centre badge + divider; stacks under 800px. Every selector scoped to .t-chooser. Oswald comes from the shared @font-face above — no @import. box-sizing / body margin inherited from the reset above. ========================================================================== */ .t-chooser{ background:#0b0b0b;color:#fff;min-height:100vh; font-family:Arial,-apple-system,Segoe UI,Roboto,Helvetica,sans-serif; } .t-chooser a{text-decoration:none} .t-chooser .chooser{min-height:100vh;display:flex;position:relative;overflow:hidden} .t-chooser .side{display:block;width:50%;min-height:100vh;position:relative;overflow:hidden;transition:width .55s cubic-bezier(.2,.8,.2,1)} .t-chooser .chooser:has(.fit:hover) .fit{width:57%} .t-chooser .chooser:has(.fit:hover) .momentum{width:43%} .t-chooser .chooser:has(.momentum:hover) .momentum{width:57%} .t-chooser .chooser:has(.momentum:hover) .fit{width:43%} .t-chooser .fit{background:#090909;color:#fff} .t-chooser .fit::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.2),rgba(0,0,0,.82)),url('/assets/tyre-training-sunset.webp') center/cover no-repeat;transform:scale(1.02);transition:transform .7s} .t-chooser .fit:hover::before{transform:scale(1.06)} .t-chooser .momentum{background:#f2efe7;color:#111} .t-chooser .momentum::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(242,239,231,.92) 0%,rgba(242,239,231,.48) 52%,rgba(242,239,231,.12)),url('/assets/momentum-architecture.webp') center/cover no-repeat;transform:scale(1.02);transition:transform .7s} .t-chooser .momentum:hover::before{transform:scale(1.06)} .t-chooser .content{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(34px,5vw,78px)} .t-chooser .momentum .content{justify-content:center;align-items:flex-start} .t-chooser .eyebrow{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.2em;font-weight:800;text-transform:uppercase;margin-bottom:20px} .t-chooser .eyebrow::before{content:"";width:34px;height:3px;background:#e21b23} .t-chooser h1{font-family:'Oswald',Impact,sans-serif;font-size:clamp(5rem,10vw,10rem);line-height:.8;text-transform:uppercase;letter-spacing:-.055em;margin:0 0 25px} .t-chooser .fit h1 span{color:#e21b23} .t-chooser .momentum h1{font-size:clamp(4rem,8vw,8rem)} .t-chooser .momentum h1 span{color:#e21b23} .t-chooser .tag{font-family:'Oswald',sans-serif;font-size:clamp(1.25rem,2vw,2rem);letter-spacing:.15em;text-transform:uppercase;margin:0 0 16px} .t-chooser p{max-width:430px;font-size:16px;line-height:1.6;margin:0 0 30px;color:#c9c9c9} .t-chooser .momentum p{color:#333} .t-chooser .btn{display:inline-flex;align-items:center;gap:55px;border:1px solid currentColor;padding:17px 22px;text-transform:uppercase;font-size:11px;letter-spacing:.15em;font-weight:900;transition:.25s} .t-chooser .fit .btn:hover{background:#e21b23;border-color:#e21b23} .t-chooser .momentum .btn:hover{background:#111;color:#fff} .t-chooser .center{position:absolute;z-index:5;left:50%;top:22%;transform:translate(-50%,-50%);background:#0b0b0b;color:#fff;width:145px;height:145px;border-radius:50%;display:grid;place-items:center;text-align:center;border:1px solid #333} .t-chooser .center div{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.16em;font-size:13px;line-height:1.55} .t-chooser .center i{display:block;width:38px;height:3px;background:#e21b23;margin:12px auto 0} .t-chooser .brand{position:absolute;z-index:6;top:30px;left:40px;color:#fff;font-weight:900;letter-spacing:.24em;font-size:13px;text-transform:uppercase} .t-chooser .brand small{display:block;font-size:8px;letter-spacing:.38em;margin-top:4px} .t-chooser .divider{position:absolute;z-index:4;left:50%;top:0;bottom:0;width:1px;background:#ffffff40} .t-chooser .footerbar{position:absolute;z-index:7;left:0;right:0;bottom:0;display:flex;justify-content:center;padding:15px;font-size:10px;letter-spacing:.16em;text-transform:uppercase} .t-chooser .footerbar span{background:rgba(11,11,11,.74);color:#ededed;padding:6px 14px;border-radius:3px} @media (max-width:800px){ .t-chooser .chooser{display:block;overflow:visible} .t-chooser .side, .t-chooser .chooser:has(.fit:hover) .fit,.t-chooser .chooser:has(.fit:hover) .momentum, .t-chooser .chooser:has(.momentum:hover) .momentum,.t-chooser .chooser:has(.momentum:hover) .fit{width:100%;min-height:76vh} .t-chooser .center,.t-chooser .divider{display:none} .t-chooser .brand{top:20px;left:22px} .t-chooser .content{padding:90px 24px 110px} .t-chooser .momentum .content{justify-content:flex-end} .t-chooser h1{font-size:clamp(4.2rem,22vw,7rem)} .t-chooser .momentum h1{font-size:clamp(3.6rem,17vw,6rem)} } /* ========================================================================== FITBOX — dark, high contrast, photography-led, loud condensed type ========================================================================== */ .t-fitbox{ --ink:#0A0A0B; --panel:#141416; --panel-2:#1C1C1F; --line:#2A2A2E; --red:#C1121F; --red-deep:#7A0A12; --red-lt:#E23B3B; --bone:#EDEDEF; --grey:#8A8A92; background:var(--ink);color:var(--bone); font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; -webkit-font-smoothing:antialiased; } /* neon treatment — Fitbox pages only. Deep near-black ground as a subtle gradient instead of the flat --ink fill above (which stays as the fallback). Never reaches .t-momentum: this is keyed to body.t-fitbox. */ body.t-fitbox{ background-color:var(--ink); background-image:linear-gradient(176deg,#0C0C0F 0%,#050506 100%); } .t-fitbox h1,.t-fitbox h2,.t-fitbox h3{ font-family:'Oswald','Arial Narrow',system-ui,sans-serif; font-weight:700;text-transform:uppercase;letter-spacing:.01em;line-height:1; } .t-fitbox h1{font-size:clamp(2.6rem,8vw,5rem)} .t-fitbox h2{font-size:clamp(2rem,5.5vw,3.2rem)} .t-fitbox h3{font-size:clamp(1.3rem,3vw,1.6rem)} .t-fitbox .lede{font-size:clamp(1.05rem,2.5vw,1.35rem);color:var(--bone)} .t-fitbox .label{ color:var(--grey);text-transform:uppercase;letter-spacing:.2em; font-size:.8rem;font-weight:600; } .t-fitbox .wrap{max-width:1120px;margin:0 auto;padding:0 clamp(1.1rem,4vw,2rem)} .t-fitbox section{padding:clamp(3.5rem,9vw,7rem) 0} .t-fitbox .panel{background:var(--panel)} .t-fitbox p+p{margin-top:1rem} /* fixed header — styled here (also the only stylesheet, so no FOUC risk, but keep it self-contained per BUILD-BRIEF §7.6) */ .t-fitbox .bar{ position:sticky;top:0;z-index:20;background:rgba(10,10,11,.9); border-bottom:1px solid var(--line); } .t-fitbox .bar .wrap{display:flex;align-items:center;justify-content:space-between; min-height:64px;gap:1rem} .t-fitbox .bar img{width:40px;height:auto} .t-fitbox .bar nav{display:flex;gap:clamp(.7rem,2.5vw,1.6rem);flex-wrap:wrap} .t-fitbox .bar nav a{ text-decoration:none;color:var(--bone);font-size:.82rem;font-weight:600; text-transform:uppercase;letter-spacing:.12em; } .t-fitbox .bar nav a:hover{color:var(--red-lt)} /* buttons — glossy red, small surfaces only */ .btn{ display:inline-block;text-decoration:none;font-weight:700; text-transform:uppercase;letter-spacing:.1em;font-size:.9rem; padding:.9rem 1.6rem;border:0;cursor:pointer;border-radius:2px; font-family:inherit; } .t-fitbox .btn{ color:#fff; background:linear-gradient(160deg,var(--red-deep),var(--red) 45%,var(--red-lt)); box-shadow:0 1px 0 rgba(255,255,255,.15) inset; } .t-fitbox .btn:hover,.t-fitbox .btn:focus-visible{transform:translateY(-2px)} .t-fitbox .btn--ghost{ background:none;border:1px solid var(--red);color:var(--bone); box-shadow:none; } .btn{transition:transform .2s ease} /* hero */ .t-fitbox .hero{position:relative;padding:0;overflow:hidden} .t-fitbox .hero::before{ /* neon bloom behind the hero — pseudo-element, opacity baked into the rgba, never box-shadow, never animated (DESIGN.md / BUILD-BRIEF §7.2). */ content:"";position:absolute;inset:0;z-index:0;pointer-events:none; background: radial-gradient(62% 62% at 82% 6%, rgba(226,59,59,.34) 0%, transparent 60%), radial-gradient(34% 40% at 88% -4%, rgba(226,59,59,.24) 0%, transparent 72%); } .t-fitbox .hero .wrap{ padding-top:clamp(3rem,10vw,6rem);padding-bottom:clamp(3rem,10vw,6rem); display:grid;gap:clamp(1.5rem,5vw,3rem);align-items:center; position:relative;z-index:1; } @media (min-width:880px){.t-fitbox .hero .wrap{grid-template-columns:1.05fr .95fr}} .t-fitbox .hero h1 span{color:var(--red-lt)} .t-fitbox .hero .cta-row{margin-top:1.8rem;display:flex;gap:.9rem;flex-wrap:wrap} /* cards / grids */ .t-fitbox .grid{display:grid;gap:1.5rem} @media (min-width:680px){.t-fitbox .grid--2{grid-template-columns:1fr 1fr}} @media (min-width:820px){.t-fitbox .grid--3{grid-template-columns:repeat(3,1fr)}} .t-fitbox .card{ background:var(--panel-2);border:1px solid var(--line);padding:1.6rem; border-radius:3px; } .t-fitbox .card h3{margin-bottom:.6rem} .t-fitbox .card .price{ font-family:'Oswald','Arial Narrow',system-ui,sans-serif; font-size:2rem;color:var(--red-lt);line-height:1;margin:.4rem 0 .2rem; } .t-fitbox .card ul{margin:.9rem 0 0;padding-left:1.1rem;color:var(--bone)} .t-fitbox .card li{margin:.35rem 0} .t-fitbox .card .btn{margin-top:1.2rem} .t-fitbox .card--slot{ /* Phase 2 will drop a "Start this plan" button in .card .cta without a rebuild */ } /* card glow — a red ring sitting in the 6px bleed just outside the card: a bordered pseudo-element with NO fill, so nothing is behind the card's centre at any card opacity (kills the fade-in flash). Faded by opacity only, never box-shadow (DESIGN.md). z-index:-1 drops it behind the card, which stays a non-stacking-context. */ .t-fitbox .card--glow{position:relative} .t-fitbox .card--glow::before{ content:"";position:absolute;inset:-6px;z-index:-1; border:6px solid rgba(226,59,59,.5);border-radius:9px; opacity:.45;transition:opacity .25s ease; } .t-fitbox .card--glow:hover::before, .t-fitbox .card--glow:focus-within::before{opacity:.85} @media (prefers-reduced-motion:reduce){ .t-fitbox .card--glow::before{transition:none} } /* small quiet button, used inline where a price would sit but the figure is negotiable */ .t-fitbox .btn--pill{ padding:.28rem .7rem;font-size:.72rem;letter-spacing:.08em; vertical-align:baseline; } .t-fitbox .card li .btn--pill{margin-top:0} /* gallery */ .t-fitbox .gallery{display:grid;gap:1rem;grid-template-columns:1fr 1fr} @media (min-width:820px){.t-fitbox .gallery{grid-template-columns:repeat(3,1fr)}} .t-fitbox .gallery .shot{border:0;border-radius:3px;overflow:hidden} .t-fitbox .gallery img{aspect-ratio:4/3;object-fit:cover} /* community band */ .t-fitbox .band{position:relative;padding:clamp(4rem,12vw,8rem) 0;text-align:center} .t-fitbox .band .bg{position:absolute;inset:0;z-index:0;border:0} .t-fitbox .band .bg::before{opacity:0} .t-fitbox .band .bg img{width:100%;height:100%;object-fit:cover;opacity:.25} .t-fitbox .band .wrap{position:relative;z-index:1} /* forms */ .t-fitbox form{display:grid;gap:1.1rem;max-width:560px} .t-fitbox label{display:grid;gap:.4rem;font-size:.85rem;font-weight:600; text-transform:uppercase;letter-spacing:.1em;color:var(--grey)} .t-fitbox input,.t-fitbox select,.t-fitbox textarea{ font:inherit;color:var(--bone);background:var(--panel-2); border:1px solid var(--line);border-radius:2px;padding:.8rem .9rem;width:100%; } .t-fitbox textarea{min-height:120px;resize:vertical} .t-fitbox input:focus,.t-fitbox select:focus,.t-fitbox textarea:focus{ outline:2px solid var(--red);outline-offset:1px} /* footer */ .t-fitbox footer{border-top:1px solid var(--line);background:var(--panel); padding:clamp(2.5rem,7vw,4rem) 0;color:var(--grey);font-size:.9rem} .t-fitbox footer a{color:var(--bone)} .t-fitbox footer .cols{display:grid;gap:1.5rem} @media (min-width:680px){.t-fitbox footer .cols{grid-template-columns:2fr 1fr 1fr}} .t-fitbox footer h3{font-size:1rem;margin-bottom:.6rem;color:var(--bone)} .t-fitbox .crosslink{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--line); font-size:.8rem} /* headline clip — solid colour FIRST, clip scoped in @supports (Instagram in-app browser). DESIGN.md: never in red on dark for body, headings only. */ .t-fitbox .clip{color:var(--red-lt)} @supports ((-webkit-background-clip:text) or (background-clip:text)){ .t-fitbox .clip{ background:linear-gradient(160deg,var(--red-deep),var(--red) 45%,var(--red-lt)); -webkit-background-clip:text;background-clip:text;color:transparent; } } /* ========================================================================== MOMENTUM — light, tight grid, industrial, restrained Palette from the logo: black, its red, white. ========================================================================== */ .t-momentum{ --black:#111113; --red:#C1121F; --white:#FFFFFF; --paper:#FFFFFF; --wash:#F4F4F4; --line:#DADADA; --muted:#5A5A5E; background:var(--paper);color:var(--black); font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; } .t-momentum h1,.t-momentum h2,.t-momentum h3{ font-family:system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif; font-weight:700;letter-spacing:-0.01em;line-height:1.1; } .t-momentum h1{font-size:clamp(2rem,5vw,3.1rem)} .t-momentum h2{font-size:clamp(1.5rem,3.5vw,2.1rem)} .t-momentum h3{font-size:1.1rem;text-transform:uppercase;letter-spacing:.06em} .t-momentum .wrap{max-width:1080px;margin:0 auto;padding:0 clamp(1.1rem,4vw,2rem)} .t-momentum section{padding:clamp(2.5rem,6vw,4.5rem) 0} .t-momentum .lede{font-size:clamp(1rem,2vw,1.15rem);color:var(--muted);max-width:60ch} .t-momentum .label{ color:var(--red);text-transform:uppercase;letter-spacing:.18em; font-size:.75rem;font-weight:700;display:block;margin-bottom:.8rem} .t-momentum .wash{background:var(--wash)} .t-momentum p+p{margin-top:.9rem} .t-momentum .bar{ position:sticky;top:0;z-index:20;background:var(--white); border-bottom:2px solid var(--black); } .t-momentum .bar .wrap{display:flex;align-items:center;justify-content:space-between; min-height:60px;gap:1rem} .t-momentum .bar nav{display:flex;gap:clamp(.7rem,2.5vw,1.5rem);flex-wrap:wrap} .t-momentum .bar nav a{ text-decoration:none;font-size:.78rem;font-weight:700;text-transform:uppercase; letter-spacing:.1em;color:var(--black)} .t-momentum .bar nav a:hover{color:var(--red)} /* Momentum wordmark (logo file not in this asset drop — text fallback, swap for the supplied black/red/white M when it arrives) */ .wordmark{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none; font-weight:800;letter-spacing:.02em;text-transform:uppercase} .t-momentum .wordmark{color:var(--black);font-size:1.05rem} .wordmark .mk{width:26px;height:26px;flex:none} .t-momentum .btn{ color:var(--white);background:var(--red);border-radius:0; } .t-momentum .btn:hover,.t-momentum .btn:focus-visible{background:var(--black)} .t-momentum .btn--ghost{background:none;border:2px solid var(--black);color:var(--black)} .t-momentum .btn--ghost:hover{background:var(--black);color:var(--white)} .t-momentum .hero{border-bottom:1px solid var(--line)} .t-momentum .hero .wrap{padding-top:clamp(2.5rem,7vw,5rem); padding-bottom:clamp(2.5rem,7vw,5rem)} .t-momentum .hero h1{max-width:16ch} .t-momentum .hero .cta-row{margin-top:1.6rem;display:flex;gap:.8rem;flex-wrap:wrap} .t-momentum .grid{display:grid;gap:1px;background:var(--line); border:1px solid var(--line)} @media (min-width:680px){.t-momentum .grid--2{grid-template-columns:1fr 1fr}} @media (min-width:820px){.t-momentum .grid--3{grid-template-columns:repeat(3,1fr)}} .t-momentum .cell{background:var(--paper);padding:1.6rem} .t-momentum .cell h3{margin-bottom:.5rem} .t-momentum .cell ul{margin:.6rem 0 0;padding-left:1.1rem;color:var(--muted)} .t-momentum .cell li{margin:.3rem 0} .t-momentum .tbd{ border:1px dashed var(--line);padding:1.4rem;color:var(--muted); background:var(--wash);font-size:.95rem} .t-momentum form{display:grid;gap:1rem;max-width:560px} .t-momentum label{display:grid;gap:.35rem;font-size:.8rem;font-weight:700; text-transform:uppercase;letter-spacing:.08em;color:var(--black)} .t-momentum input,.t-momentum select,.t-momentum textarea{ font:inherit;color:var(--black);background:var(--white); border:1px solid var(--black);border-radius:0;padding:.7rem .8rem;width:100%} .t-momentum textarea{min-height:120px;resize:vertical} .t-momentum input:focus,.t-momentum select:focus,.t-momentum textarea:focus{ outline:2px solid var(--red);outline-offset:1px} .t-momentum footer{border-top:2px solid var(--black);padding:clamp(2rem,5vw,3rem) 0; font-size:.88rem;color:var(--muted)} .t-momentum footer a{color:var(--black)} .t-momentum footer .cols{display:grid;gap:1.4rem} @media (min-width:680px){.t-momentum footer .cols{grid-template-columns:2fr 1fr 1fr}} .t-momentum footer h3{font-size:.85rem;margin-bottom:.5rem} .t-momentum .crosslink{margin-top:1.8rem;padding-top:1.2rem; border-top:1px solid var(--line);font-size:.78rem;color:var(--muted)} /* ========================================================================== THANK YOU — neutral, works for both sides ========================================================================== */ .t-thanks{ background:#0A0A0B;color:#EDEDEF;min-height:100vh;display:flex; align-items:center;justify-content:center;text-align:center;padding:2rem; font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; } .t-thanks .box{max-width:520px} .t-thanks h1{font:700 clamp(2rem,6vw,3rem)/1 'Oswald','Arial Narrow',system-ui,sans-serif; text-transform:uppercase;color:#EDEDEF} .t-thanks p{color:#8A8A92;margin-top:1rem} .t-thanks .links{margin-top:2rem;display:flex;gap:1rem;justify-content:center;flex-wrap:wrap} .t-thanks .links a{color:#E23B3B;text-decoration:none;font-weight:600; text-transform:uppercase;letter-spacing:.1em;font-size:.85rem} /* generic small print token warning helper (dev only, harmless in prod) */ [data-tbd]{} /* ========================================================================== FITBOX 2026 ART DIRECTION — editorial / cinematic homepage ========================================================================== */ .t-fitbox.fitbox-v2{--red:#d41120;--red-lt:#ff3342;--bone:#f5f3ef;--grey:#9b9ba3;background:#070708} .fitbox-v2 .bar{position:fixed;left:0;right:0;background:linear-gradient(#070708e8,transparent);border:0;backdrop-filter:none} .fitbox-v2 .bar .wrap{max-width:1320px;min-height:86px} .fitbox-v2 .bar img{width:48px;filter:drop-shadow(0 0 14px rgba(212,17,32,.22))} .fitbox-v2 .bar nav{align-items:center} .fitbox-v2 .bar nav a{font-size:.75rem;color:#d9d7d4} .fitbox-v2 .bar nav a:last-child{border:1px solid #4b151a;padding:.65rem 1rem;color:#fff} /* mobile nav toggle — checkbox hack, no JS. Works with JS disabled. */ .fitbox-v2 .nav-toggle{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} .fitbox-v2 .nav-btn{display:none} .fitbox-v2 .hero-v2{min-height:100svh;padding:0;display:grid;align-items:end;position:relative;overflow:hidden;background:#050506} .fitbox-v2 .hero-v2__media{position:absolute;inset:0;margin:0} .fitbox-v2 .hero-v2__media img{width:100%;height:100%;object-fit:cover;object-position:64% center;filter:grayscale(.75) contrast(1.16) brightness(.72)} .fitbox-v2 .hero-v2__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#050506 4%,rgba(5,5,6,.93) 27%,rgba(5,5,6,.42) 58%,rgba(5,5,6,.2)),linear-gradient(0deg,#050506 0%,transparent 35%),radial-gradient(circle at 74% 44%,rgba(212,17,32,.28),transparent 28%)} .fitbox-v2 .hero-v2__grid{position:relative;z-index:2;width:min(1320px,100%);margin:auto;padding:160px clamp(1.25rem,5vw,4.2rem) 70px;display:grid;grid-template-columns:minmax(0,1.25fr) .55fr;align-items:end;gap:3rem} .fitbox-v2 .hero-v2 .eyebrow,.fitbox-v2 .section-kicker{display:flex;align-items:center;gap:.8rem;text-transform:uppercase;letter-spacing:.24em;font-size:.7rem;font-weight:800;color:#c9c6c2} .fitbox-v2 .hero-v2 .eyebrow::before,.fitbox-v2 .section-kicker::before{content:"";width:34px;height:2px;background:var(--red)} .fitbox-v2 .hero-v2 h1{font-size:clamp(4.8rem,12vw,10.5rem);line-height:.78;letter-spacing:-.045em;margin:.8rem 0 1.5rem;max-width:7ch;text-wrap:balance} .fitbox-v2 .hero-v2 h1 em{font-style:normal;color:var(--red-lt);display:block} .fitbox-v2 .hero-v2 .lede{max-width:44ch;color:#c8c5c1;font-size:clamp(1rem,1.7vw,1.18rem)} .fitbox-v2 .hero-v2 .cta-row{margin-top:2rem} .fitbox-v2 .hero-v2__aside{border-left:1px solid rgba(255,255,255,.18);padding-left:1.5rem;margin-bottom:.6rem} .fitbox-v2 .hero-v2__aside strong{font:700 2rem/1 'Oswald',sans-serif;text-transform:uppercase;color:#fff;display:block} .fitbox-v2 .hero-v2__aside span{display:block;color:#aaa7a3;font-size:.82rem;margin-top:.45rem} .fitbox-v2 .scroll-mark{position:absolute;right:clamp(1.25rem,5vw,4.2rem);bottom:35px;z-index:3;color:#8e8b88;font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;writing-mode:vertical-rl} .fitbox-v2 .manifesto{padding:clamp(5rem,10vw,9rem) 0;background:#070708;overflow:hidden} .fitbox-v2 .manifesto .wrap{max-width:1320px} .fitbox-v2 .manifesto h2{font-size:clamp(3.3rem,8.5vw,8.2rem);letter-spacing:-.04em;line-height:.84;max-width:10ch;margin-top:1rem} .fitbox-v2 .manifesto h2 span{color:transparent;-webkit-text-stroke:1px #4b4b50} .fitbox-v2 .manifesto-copy{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:3rem;padding-top:1.5rem;border-top:1px solid #242427} .fitbox-v2 .manifesto-copy p{max-width:46ch;color:#aaa7a3} .fitbox-v2 .services-v2{padding:0;background:#0b0b0c} .fitbox-v2 .service-row{min-height:280px;border-top:1px solid #262629;display:grid;grid-template-columns:90px 1fr 1.1fr 140px;align-items:center;gap:2rem;padding:2.2rem clamp(1.25rem,5vw,4.2rem);position:relative;overflow:hidden;max-width:1440px;margin:auto} .fitbox-v2 .service-row:last-child{border-bottom:1px solid #262629} .fitbox-v2 .service-row__num{font:500 .8rem/1 system-ui;color:#69696f;align-self:start;padding-top:.45rem} .fitbox-v2 .service-row h3{font-size:clamp(2.2rem,4.8vw,4.7rem);letter-spacing:-.025em;position:relative;z-index:2} .fitbox-v2 .service-row p{max-width:42ch;color:#9f9ca0;position:relative;z-index:2} .fitbox-v2 .service-row__price{text-align:right;font:700 clamp(1.7rem,3vw,2.8rem)/1 'Oswald',sans-serif;color:#fff;position:relative;z-index:2} .fitbox-v2 .service-row__price small{display:block;font:600 .65rem/1.4 system-ui;color:var(--red-lt);letter-spacing:.15em;text-transform:uppercase;margin-top:.45rem} .fitbox-v2 .service-row__bg{position:absolute;right:0;top:0;width:38%;height:100%;object-fit:cover;opacity:0;filter:grayscale(1) contrast(1.15);transition:opacity .35s ease,transform .5s ease;transform:scale(1.04);mask-image:linear-gradient(90deg,transparent,#000 60%)} .fitbox-v2 .service-row:hover .service-row__bg{opacity:.24;transform:scale(1)} .fitbox-v2 .service-row:hover h3{color:var(--red-lt)} .fitbox-v2 .story-v2{background:#f1efeb;color:#0b0b0c;padding:0} .fitbox-v2 .story-v2__grid{display:grid;grid-template-columns:1fr 1fr;min-height:720px} .fitbox-v2 .story-v2__image{min-height:620px;position:relative;overflow:hidden} .fitbox-v2 .story-v2__image img{width:100%;height:100%;object-fit:cover;filter:grayscale(.25) contrast(1.05)} .fitbox-v2 .story-v2__image::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(212,17,32,.2),transparent 55%);mix-blend-mode:multiply} .fitbox-v2 .story-v2__copy{padding:clamp(4rem,8vw,8rem);display:flex;flex-direction:column;justify-content:center} .fitbox-v2 .story-v2 .section-kicker{color:#5d5b59}.fitbox-v2 .story-v2 h2{font-size:clamp(3rem,6vw,6rem);letter-spacing:-.04em;margin:1rem 0 1.5rem;max-width:7ch} .fitbox-v2 .story-v2 p{max-width:43ch;color:#55514e}.fitbox-v2 .story-v2 .btn{margin-top:2rem;align-self:flex-start} .fitbox-v2 .gallery-v2{padding:clamp(5rem,9vw,8rem) 0;background:#070708} .fitbox-v2 .gallery-v2 .wrap{max-width:1320px}.fitbox-v2 .gallery-v2__head{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-bottom:2rem} .fitbox-v2 .gallery-v2 h2{font-size:clamp(3rem,6vw,6rem);letter-spacing:-.03em}.fitbox-v2 .gallery-v2__head p{color:#858287;max-width:32ch} .fitbox-v2 .gallery-v2__grid{display:grid;grid-template-columns:1.3fr .7fr .8fr;grid-template-rows:310px 310px;gap:10px} .fitbox-v2 .gallery-v2 figure{margin:0;overflow:hidden;position:relative}.fitbox-v2 .gallery-v2 figure:first-child{grid-row:1/3}.fitbox-v2 .gallery-v2 figure:nth-child(4){grid-column:2/4} .fitbox-v2 .gallery-v2 img{width:100%;height:100%;object-fit:cover;filter:grayscale(.75) contrast(1.12);transition:transform .5s ease}.fitbox-v2 .gallery-v2 figure:hover img{transform:scale(1.025)} .fitbox-v2 .final-cta{position:relative;text-align:center;padding:clamp(7rem,15vw,12rem) 0;overflow:hidden;background:#0a0a0b}.fitbox-v2 .final-cta::before{content:"FITBOX";position:absolute;left:50%;top:50%;transform:translate(-50%,-52%);font:700 clamp(8rem,25vw,24rem)/1 'Oswald',sans-serif;color:#101012;white-space:nowrap}.fitbox-v2 .final-cta .wrap{position:relative}.fitbox-v2 .final-cta h2{font-size:clamp(3.5rem,8vw,8rem);letter-spacing:-.04em;max-width:8ch;margin:auto}.fitbox-v2 .final-cta h2 span{color:var(--red-lt)}.fitbox-v2 .final-cta p{color:#99969a;margin:1.2rem auto 2rem;max-width:42ch} @media(max-width:800px){ .fitbox-v2 .bar{background:#070708} .fitbox-v2 .bar .wrap{min-height:70px;flex-wrap:wrap} .fitbox-v2 .nav-btn{display:block;position:relative;width:28px;height:18px;margin-left:auto;cursor:pointer} .fitbox-v2 .nav-btn span{position:absolute;left:0;right:0;height:2px;background:#fff;transition:transform .2s ease,opacity .2s ease} .fitbox-v2 .nav-btn span:nth-child(1){top:0}.fitbox-v2 .nav-btn span:nth-child(2){top:8px}.fitbox-v2 .nav-btn span:nth-child(3){top:16px} .fitbox-v2 .bar nav{display:none;flex-basis:100%;flex-direction:column;align-items:stretch;gap:0;padding-bottom:.6rem} .fitbox-v2 .nav-toggle:checked~nav{display:flex} .fitbox-v2 .nav-toggle:focus-visible~.nav-btn{outline:2px solid #fff;outline-offset:4px} .fitbox-v2 .nav-toggle:checked~.nav-btn span:nth-child(1){transform:translateY(8px) rotate(45deg)} .fitbox-v2 .nav-toggle:checked~.nav-btn span:nth-child(2){opacity:0} .fitbox-v2 .nav-toggle:checked~.nav-btn span:nth-child(3){transform:translateY(-8px) rotate(-45deg)} .fitbox-v2 .bar nav a,.fitbox-v2 .bar nav a:last-child{border:0;padding:.85rem 0;color:#d9d7d4} .fitbox-v2 .hero-v2__grid{grid-template-columns:1fr;padding-top:130px}.fitbox-v2 .hero-v2__aside{display:none}.fitbox-v2 .hero-v2__media img{object-position:62% center;filter:grayscale(.75) contrast(1.16) brightness(.9)}.fitbox-v2 .hero-v2__media::after{background:linear-gradient(90deg,rgba(5,5,6,.88) 0%,rgba(5,5,6,.55) 80%),linear-gradient(0deg,#050506 0%,transparent 50%)} .fitbox-v2 .manifesto-copy{grid-template-columns:1fr}.fitbox-v2 .service-row{grid-template-columns:45px 1fr;gap:1rem}.fitbox-v2 .service-row p{grid-column:2}.fitbox-v2 .service-row__price{grid-column:2;text-align:left}.fitbox-v2 .service-row__bg{width:70%} .fitbox-v2 .story-v2__grid{grid-template-columns:1fr}.fitbox-v2 .story-v2__image{min-height:520px}.fitbox-v2 .story-v2__copy{padding:4rem 1.25rem} .fitbox-v2 .gallery-v2__head{display:block}.fitbox-v2 .gallery-v2__head p{margin-top:1rem}.fitbox-v2 .gallery-v2__grid{grid-template-columns:1fr 1fr;grid-template-rows:430px 220px 220px}.fitbox-v2 .gallery-v2 figure:first-child{grid-column:1/3;grid-row:auto}.fitbox-v2 .gallery-v2 figure:nth-child(4){grid-column:1/3} } /* Append this block to /css/style.css. Everything is scoped to .fitbox-v2. */ .fitbox-v2--subpage{background:#070708} .fitbox-v2--subpage main{overflow:hidden} .fitbox-v2 .subhero{min-height:82svh;padding:0;display:grid;align-items:end;position:relative;overflow:hidden;background:#050506} .fitbox-v2 .subhero__grid{position:relative;z-index:2;width:min(1320px,100%);margin:auto;padding:170px clamp(1.25rem,5vw,4.2rem) 80px;display:grid;grid-template-columns:minmax(0,1.25fr) .55fr;gap:4rem;align-items:end} .fitbox-v2 .subhero .eyebrow{display:flex;align-items:center;gap:.8rem;text-transform:uppercase;letter-spacing:.24em;font-size:.7rem;font-weight:800;color:#c9c6c2} .fitbox-v2 .subhero .eyebrow::before{content:"";width:34px;height:2px;background:var(--red)} .fitbox-v2 .subhero h1{font-size:clamp(4.8rem,11vw,9.5rem);line-height:.8;letter-spacing:-.045em;margin:.8rem 0 1.5rem;max-width:8ch;text-wrap:balance} .fitbox-v2 .subhero h1 em{font-style:normal;color:var(--red-lt);display:block} .fitbox-v2 .subhero .lede{max-width:46ch;color:#c8c5c1;font-size:clamp(1rem,1.7vw,1.18rem)} .fitbox-v2 .subhero .cta-row{margin-top:2rem;display:flex;gap:.9rem;flex-wrap:wrap} .fitbox-v2 .subhero__index{display:grid;grid-template-columns:46px 1fr;gap:.8rem 1rem;border-left:1px solid #2c2c30;padding-left:1.5rem;margin-bottom:.5rem} .fitbox-v2 .subhero__index span{color:var(--red-lt);font:.72rem/1.5 system-ui;font-weight:800}.fitbox-v2 .subhero__index strong{font:700 1.6rem/1 'Oswald',sans-serif;text-transform:uppercase;color:#fff} .fitbox-v2 .subhero__media{position:absolute;inset:0;margin:0}.fitbox-v2 .subhero__media img{width:100%;height:100%;object-fit:cover;object-position:68% center} .fitbox-v2 .subhero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#050506 5%,rgba(5,5,6,.92) 36%,rgba(5,5,6,.42) 70%),linear-gradient(0deg,#050506 0%,transparent 35%),radial-gradient(circle at 78% 35%,rgba(212,17,32,.18),transparent 30%)} .fitbox-v2 .subhero--plans::after{content:"PLANS";position:absolute;right:-.03em;bottom:-.14em;font:700 clamp(9rem,28vw,25rem)/1 'Oswald',sans-serif;color:#0c0c0e;letter-spacing:-.05em;z-index:0} .fitbox-v2 .subhero--corporate .subhero__aside{border-left:1px solid rgba(255,255,255,.18);padding-left:1.5rem;margin-bottom:.6rem}.fitbox-v2 .subhero--corporate .subhero__aside strong{font:700 2rem/1 'Oswald',sans-serif;text-transform:uppercase;display:block}.fitbox-v2 .subhero--corporate .subhero__aside span{display:block;color:#aaa7a3;font-size:.82rem;margin-top:.45rem} .fitbox-v2 .intro-v2,.fitbox-v2 .booking-v2,.fitbox-v2 .terms-v2{padding:clamp(5.5rem,10vw,9rem) 0;background:#070708}.fitbox-v2 .intro-v2 .wrap,.fitbox-v2 .booking-v2 .wrap,.fitbox-v2 .terms-v2 .wrap{max-width:1320px} .fitbox-v2 .intro-v2 h2,.fitbox-v2 .booking-v2 h2,.fitbox-v2 .terms-v2 h2,.fitbox-v2 .matrix-head h2,.fitbox-v2 .form-v2 h2,.fitbox-v2 .corp-gallery h2{font-size:clamp(3.3rem,7.6vw,7.4rem);letter-spacing:-.04em;line-height:.86;margin-top:1rem}.fitbox-v2 .intro-v2 h2 span,.fitbox-v2 .booking-v2 h2 span,.fitbox-v2 .terms-v2 h2 span,.fitbox-v2 .matrix-head h2 span,.fitbox-v2 .form-v2 h2 span,.fitbox-v2 .corp-gallery h2 span{color:var(--red-lt)} .fitbox-v2 .intro-v2__copy{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:3rem;padding-top:1.5rem;border-top:1px solid #242427}.fitbox-v2 .intro-v2__copy p{max-width:46ch;color:#aaa7a3} .fitbox-v2 .price-matrix,.fitbox-v2 .package-v2,.fitbox-v2 .corp-gallery{padding:clamp(5.5rem,10vw,9rem) 0;background:#0b0b0c}.fitbox-v2 .price-matrix .wrap,.fitbox-v2 .package-v2 .wrap,.fitbox-v2 .corp-gallery .wrap{max-width:1320px}.fitbox-v2 .matrix-head{display:grid;grid-template-columns:1.35fr .65fr;gap:3rem;align-items:end;margin-bottom:3rem}.fitbox-v2 .matrix-head>p{color:#8f8c90;max-width:36ch;justify-self:end} .fitbox-v2 .matrix-table{border-top:1px solid #2a2a2e}.fitbox-v2 .matrix-row{display:grid;grid-template-columns:1.55fr repeat(3,.72fr);min-height:150px;border-bottom:1px solid #2a2a2e;align-items:stretch}.fitbox-v2 .matrix-row>span{display:flex;flex-direction:column;justify-content:center;padding:1.5rem;border-left:1px solid #222226;color:#fff}.fitbox-v2 .matrix-row>span:first-child{border-left:0}.fitbox-v2 .matrix-row--head{min-height:auto;background:#101012}.fitbox-v2 .matrix-row--head>span{padding:.9rem 1.5rem;color:#717176;text-transform:uppercase;letter-spacing:.16em;font-size:.65rem;font-weight:800}.fitbox-v2 .matrix-name{font:700 clamp(1.7rem,3vw,3rem)/1 'Oswald',sans-serif;text-transform:uppercase;letter-spacing:-.02em}.fitbox-v2 .matrix-name b{font:700 .7rem/1 system-ui;color:var(--red-lt);margin-bottom:.7rem}.fitbox-v2 .matrix-name small,.fitbox-v2 .matrix-row span small{font:400 .75rem/1.4 system-ui;text-transform:none;letter-spacing:0;color:#858287;margin-top:.5rem}.fitbox-v2 .matrix-row strong{font:700 clamp(1.4rem,2.5vw,2.4rem)/1 'Oswald',sans-serif;text-transform:uppercase}.fitbox-v2 .negotiable{display:inline-flex;align-self:flex-start;border:1px solid #8b272f;color:#fff;padding:.55rem .8rem;border-radius:999px;text-transform:uppercase;letter-spacing:.12em;font-size:.66rem;font-weight:800}.fitbox-v2 .negotiable:hover{background:var(--red);border-color:var(--red)}.fitbox-v2 .matrix-note{margin-top:1.25rem;color:#77747a;font-size:.82rem;max-width:75ch} .fitbox-v2 .cream-break{background:#f1efeb;color:#0b0b0c;padding:0}.fitbox-v2 .cream-break__grid{display:grid;grid-template-columns:1fr 1fr;min-height:690px}.fitbox-v2 .cream-break figure{margin:0;min-height:580px;overflow:hidden}.fitbox-v2 .cream-break figure img{width:100%;height:100%;object-fit:cover}.fitbox-v2 .cream-break__copy{padding:clamp(4rem,8vw,8rem);display:flex;flex-direction:column;justify-content:center}.fitbox-v2 .cream-break .section-kicker{color:#5d5b59}.fitbox-v2 .cream-break h2{font-size:clamp(3rem,6vw,6rem);letter-spacing:-.04em;line-height:.9;margin:1rem 0 1.5rem;max-width:9ch}.fitbox-v2 .cream-break h2 span{color:var(--red)}.fitbox-v2 .cream-break p{max-width:44ch;color:#55514e}.fitbox-v2 .cream-break .btn{align-self:flex-start;margin-top:2rem} .fitbox-v2 .number-rows{margin-top:3rem;border-top:1px solid #29292d}.fitbox-v2 .number-row{min-height:170px;display:grid;grid-template-columns:75px 1fr 1.2fr;gap:2rem;align-items:center;border-bottom:1px solid #29292d}.fitbox-v2 .number-row>span{color:#68686e;font-size:.75rem}.fitbox-v2 .number-row h3{font-size:clamp(1.8rem,3.6vw,3.6rem);letter-spacing:-.02em}.fitbox-v2 .number-row p{color:#969399;max-width:44ch}.fitbox-v2 .number-rows--booking .number-row{grid-template-columns:75px 1fr 1.1fr 190px}.fitbox-v2 .number-row b{color:var(--red-lt);text-align:right;text-transform:uppercase;letter-spacing:.11em;font-size:.7rem} .fitbox-v2 .package-list{border-top:1px solid #29292d}.fitbox-v2 .package-row{display:grid;grid-template-columns:70px 1fr 1fr 150px;gap:2rem;align-items:center;min-height:260px;border-bottom:1px solid #29292d;padding:2rem 0}.fitbox-v2 .package-row__num{font-size:.75rem;color:#68686e;align-self:start;padding-top:.45rem}.fitbox-v2 .package-row__tag{color:var(--red-lt);text-transform:uppercase;letter-spacing:.17em;font-size:.68rem;font-weight:800}.fitbox-v2 .package-row h3{font-size:clamp(2.3rem,4.6vw,4.5rem);letter-spacing:-.03em;margin-top:.4rem}.fitbox-v2 .package-row ul{margin:0;padding-left:1rem;color:#9b989d;line-height:1.8}.fitbox-v2 .package-row__price{text-align:right;font:700 clamp(2rem,3.5vw,3.2rem)/1 'Oswald',sans-serif}.fitbox-v2 .package-row__price small{display:block;color:var(--red-lt);font:700 .62rem/1.4 system-ui;text-transform:uppercase;letter-spacing:.14em;margin-top:.5rem} .fitbox-v2 .corp-gallery__grid{display:grid;grid-template-columns:1.25fr .75fr;gap:10px}.fitbox-v2 .corp-gallery figure{margin:0;height:560px;overflow:hidden}.fitbox-v2 .corp-gallery figure:last-child{height:440px;align-self:end}.fitbox-v2 .corp-gallery img{width:100%;height:100%;object-fit:cover} .fitbox-v2 .form-v2{padding:clamp(6rem,11vw,10rem) 0;background:#080809}.fitbox-v2 .form-v2 .wrap{max-width:1320px}.fitbox-v2 .form-v2__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(3rem,7vw,7rem);align-items:start}.fitbox-v2 .form-v2__grid>div>p:last-child{color:#8f8c90;max-width:40ch;margin-top:1.25rem}.fitbox-v2 .form-v2 form{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.fitbox-v2 .form-v2 label{font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;color:#bbb8bc;font-weight:800}.fitbox-v2 .form-v2 input,.fitbox-v2 .form-v2 select,.fitbox-v2 .form-v2 textarea{width:100%;margin-top:.55rem;background:#0e0e10;border:1px solid #303034;color:#fff;padding:1rem;font:400 .95rem/1.4 system-ui;border-radius:0}.fitbox-v2 .form-v2 textarea{min-height:150px;resize:vertical}.fitbox-v2 .form-v2 input:focus,.fitbox-v2 .form-v2 select:focus,.fitbox-v2 .form-v2 textarea:focus{outline:1px solid var(--red);border-color:var(--red)}.fitbox-v2 .form-v2__full{grid-column:1/-1}.fitbox-v2 .form-v2 button{justify-self:start;margin-top:.5rem} @media(max-width:800px){ .fitbox-v2 .subhero{min-height:auto}.fitbox-v2 .subhero__grid{grid-template-columns:1fr;padding-top:130px}.fitbox-v2 .subhero__index,.fitbox-v2 .subhero__aside{display:none}.fitbox-v2 .subhero--corporate{min-height:88svh}.fitbox-v2 .subhero__media img{object-position:64% center}.fitbox-v2 .subhero__media::after{background:linear-gradient(90deg,#050506 0%,rgba(5,5,6,.82) 88%),linear-gradient(0deg,#050506 0%,transparent 50%)} .fitbox-v2 .intro-v2__copy,.fitbox-v2 .matrix-head,.fitbox-v2 .cream-break__grid,.fitbox-v2 .form-v2__grid{grid-template-columns:1fr}.fitbox-v2 .matrix-head>p{justify-self:start}.fitbox-v2 .matrix-row--head{display:none}.fitbox-v2 .matrix-row{grid-template-columns:1fr;min-height:0}.fitbox-v2 .matrix-row>span{border-left:0;border-top:1px solid #222226;flex-direction:row;justify-content:space-between;align-items:baseline;gap:1rem;padding:.85rem 1.1rem}.fitbox-v2 .matrix-row>span:first-child{border-top:0;flex-direction:column;align-items:flex-start;gap:0;padding-top:1.4rem}.fitbox-v2 .matrix-row>span:nth-child(2)::before,.fitbox-v2 .matrix-row>span:nth-child(3)::before,.fitbox-v2 .matrix-row>span:nth-child(4)::before{color:#858287;font:700 .66rem/1 system-ui;text-transform:uppercase;letter-spacing:.1em}.fitbox-v2 .matrix-row>span:nth-child(2)::before{content:"6 weeks"}.fitbox-v2 .matrix-row>span:nth-child(3)::before{content:"3 months"}.fitbox-v2 .matrix-row>span:nth-child(4)::before{content:"6 months"}.fitbox-v2 .cream-break figure{min-height:460px}.fitbox-v2 .cream-break__copy{padding:4rem 1.25rem} .fitbox-v2 .number-row,.fitbox-v2 .number-rows--booking .number-row{grid-template-columns:42px 1fr;gap:1rem;padding:1.5rem 0}.fitbox-v2 .number-row p,.fitbox-v2 .number-row b{grid-column:2;text-align:left}.fitbox-v2 .package-row{grid-template-columns:42px 1fr;gap:1rem;min-height:0}.fitbox-v2 .package-row ul,.fitbox-v2 .package-row__price{grid-column:2;text-align:left}.fitbox-v2 .corp-gallery__grid{grid-template-columns:1fr}.fitbox-v2 .corp-gallery figure,.fitbox-v2 .corp-gallery figure:last-child{height:360px}.fitbox-v2 .form-v2 form{grid-template-columns:1fr}.fitbox-v2 .form-v2__full{grid-column:auto} } /* floating WhatsApp button — Fitbox pages, fixed bottom-right. No box-shadow. */ .fitbox-v2 .wa-float{position:fixed;right:clamp(1rem,4vw,2rem);bottom:clamp(1rem,4vw,2rem);z-index:50;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--red);color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.14);transition:transform .2s ease} .fitbox-v2 .wa-float:hover,.fitbox-v2 .wa-float:focus-visible{transform:translateY(-3px)} @media(max-width:800px){.fitbox-v2 .wa-float{width:50px;height:50px}} /* ========================================================================== MOMENTUM V2 — editorial / architectural light system Scoped to .t-momentum.momentum-v2 only. ========================================================================== */ .t-momentum.momentum-v2{--m2-red:#d71920;--m2-ink:#101113;--m2-paper:#f7f5ef;--m2-cream:#ebe7dd;--m2-line:#c9c5bb;--m2-muted:#66645e;background:var(--m2-paper);color:var(--m2-ink);font:16px/1.55 Arial,Helvetica,sans-serif} .t-momentum.momentum-v2 *{box-sizing:border-box}.t-momentum.momentum-v2 .m2-wrap{width:min(1240px,calc(100% - 44px));max-width:none;margin:auto;padding:0}.t-momentum.momentum-v2 .m2-bar{position:sticky;top:0;z-index:40;background:var(--m2-paper);border-bottom:1px solid rgba(16,17,19,.14)} .t-momentum.momentum-v2 .m2-nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:28px}.t-momentum.momentum-v2 .m2-brand{display:flex;align-items:center;gap:12px;color:var(--m2-ink);text-decoration:none;font-weight:900;text-transform:uppercase;letter-spacing:-.03em}.t-momentum.momentum-v2 .m2-mark{width:36px;height:36px;background:var(--m2-ink);color:#fff;display:grid;place-items:center;position:relative}.t-momentum.momentum-v2 .m2-mark:after{content:"";position:absolute;width:7px;height:18px;right:4px;bottom:4px;background:var(--m2-red)} .t-momentum.momentum-v2 .m2-nav nav{display:flex;align-items:center;gap:25px}.t-momentum.momentum-v2 .m2-nav nav a{color:var(--m2-ink);text-decoration:none;font-size:.72rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}.t-momentum.momentum-v2 .m2-nav nav a:hover{color:var(--m2-red)}.t-momentum.momentum-v2 .m2-nav .m2-nav-cta{padding:13px 16px;background:var(--m2-red);color:#fff}.t-momentum.momentum-v2 .m2-nav .m2-nav-cta:hover{background:var(--m2-ink);color:#fff} /* mobile nav toggle — CSS-only checkbox, no JS, matches the Fitbox pages */ .t-momentum.momentum-v2 .m2-nav-toggle{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} .t-momentum.momentum-v2 .m2-nav-btn{display:none} .t-momentum.momentum-v2 .m2-eyebrow{display:flex;align-items:center;gap:12px;color:var(--m2-red);font-size:.7rem;font-weight:900;letter-spacing:.18em;text-transform:uppercase;margin-bottom:24px}.t-momentum.momentum-v2 .m2-eyebrow:before{content:"";width:42px;height:2px;background:var(--m2-red)} .t-momentum.momentum-v2 .m2-hero{padding:0;border-bottom:1px solid var(--m2-line)}.t-momentum.momentum-v2 .m2-hero-grid{display:grid;grid-template-columns:1fr;min-height:calc(100vh - 77px);align-items:stretch}.t-momentum.momentum-v2 .m2-hero-copy{display:flex;flex-direction:column;justify-content:center;padding:80px 0}.t-momentum.momentum-v2 .m2-hero h1,.t-momentum.momentum-v2 .m2-services-hero h1{font-family:'Oswald','Arial Narrow',Arial,sans-serif;font-size:clamp(4.8rem,9vw,9rem);line-height:.82;letter-spacing:-.055em;text-transform:uppercase;margin:0;max-width:7ch}.t-momentum.momentum-v2 h1 span,.t-momentum.momentum-v2 h2 span{color:var(--m2-red)}.t-momentum.momentum-v2 .m2-hero-copy>p{max-width:560px;color:#56544f;font-size:clamp(1rem,1.3vw,1.18rem);margin:28px 0 0}.t-momentum.momentum-v2 .m2-actions{display:flex;gap:24px;align-items:center;margin-top:34px;flex-wrap:wrap} .t-momentum.momentum-v2 .m2-btn{display:inline-flex;justify-content:space-between;align-items:center;gap:45px;padding:16px 20px;border:1px solid var(--m2-ink);text-decoration:none;text-transform:uppercase;letter-spacing:.09em;font-size:.72rem;font-weight:900;background:transparent;border-radius:0;color:var(--m2-ink)}.t-momentum.momentum-v2 .m2-btn-red{background:var(--m2-red);border-color:var(--m2-red);color:#fff}.t-momentum.momentum-v2 .m2-btn:hover{background:var(--m2-ink);border-color:var(--m2-ink);color:#fff}.t-momentum.momentum-v2 .m2-link{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;font-weight:900;text-decoration:none;color:var(--m2-ink);border-bottom:1px solid var(--m2-ink);padding-bottom:5px} .t-momentum.momentum-v2 .m2-capabilities{padding:0}.t-momentum.momentum-v2 .m2-row{display:grid;grid-template-columns:85px 1fr 1.1fr auto;gap:30px;align-items:center;border-bottom:1px solid var(--m2-line);padding:34px 0}.t-momentum.momentum-v2 .m2-row>span{color:#aaa79e;font:700 2.2rem/1 'Oswald',sans-serif}.t-momentum.momentum-v2 .m2-row h2{margin:0;font:700 clamp(1.7rem,3vw,3rem)/1 'Oswald',sans-serif;text-transform:uppercase;letter-spacing:-.03em}.t-momentum.momentum-v2 .m2-row p{margin:0;color:var(--m2-muted)}.t-momentum.momentum-v2 .m2-row a{color:var(--m2-ink);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:900;text-decoration:none} .t-momentum.momentum-v2 .m2-cream{background:var(--m2-cream);padding:clamp(90px,10vw,145px) 0}.t-momentum.momentum-v2 .m2-editorial-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:80px;align-items:start}.t-momentum.momentum-v2 .m2-editorial-grid h2,.t-momentum.momentum-v2 .m2-dark h2,.t-momentum.momentum-v2 .m2-quote h2,.t-momentum.momentum-v2 .m2-service-scope h2{font:700 clamp(3.2rem,6.7vw,7rem)/.88 'Oswald','Arial Narrow',sans-serif;text-transform:uppercase;letter-spacing:-.05em;margin:0}.t-momentum.momentum-v2 .m2-editorial-copy{padding-top:48px}.t-momentum.momentum-v2 .m2-editorial-copy>p{color:#55534f;max-width:520px;font-size:1.06rem}.t-momentum.momentum-v2 .m2-mini-grid{margin-top:45px;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #aaa69c}.t-momentum.momentum-v2 .m2-mini-grid div{padding:22px 0;border-bottom:1px solid #aaa69c}.t-momentum.momentum-v2 .m2-mini-grid b{color:var(--m2-red);margin-right:12px}.t-momentum.momentum-v2 .m2-mini-grid span{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;font-weight:800} .t-momentum.momentum-v2 .m2-dark{padding:clamp(90px,10vw,145px) 0;background:#111;color:#fff}.t-momentum.momentum-v2 .m2-dark .m2-eyebrow{color:#ef343a}.t-momentum.momentum-v2 .m2-process{display:grid;grid-template-columns:repeat(3,1fr);margin-top:55px;border-top:1px solid #444}.t-momentum.momentum-v2 .m2-process article{padding:38px 28px 10px 0;min-height:245px;border-right:1px solid #444}.t-momentum.momentum-v2 .m2-process article:not(:first-child){padding-left:28px}.t-momentum.momentum-v2 .m2-process b{color:var(--m2-red);font-size:.75rem;letter-spacing:.1em}.t-momentum.momentum-v2 .m2-process h3{font:700 1.8rem/1 'Oswald',sans-serif;text-transform:uppercase;margin:38px 0 13px}.t-momentum.momentum-v2 .m2-process p{color:#aaa;max-width:30ch} .t-momentum.momentum-v2 .m2-quote{padding:clamp(90px,10vw,145px) 0;background:var(--m2-paper)}.t-momentum.momentum-v2 .m2-quote-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:75px}.t-momentum.momentum-v2 .m2-quote-grid>div>p{color:#5c5953;max-width:460px}.t-momentum.momentum-v2 .m2-form{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:none}.t-momentum.momentum-v2 .m2-form label{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;font-weight:900;color:var(--m2-ink)}.t-momentum.momentum-v2 .m2-form input,.t-momentum.momentum-v2 .m2-form select,.t-momentum.momentum-v2 .m2-form textarea{margin-top:7px;padding:14px 0;border:0;border-bottom:1px solid #9c988f;background:transparent}.t-momentum.momentum-v2 .m2-form textarea{min-height:120px}.t-momentum.momentum-v2 .m2-full{grid-column:1/-1} .t-momentum.momentum-v2 .m2-footer{background:#dcd7cc;border-top:1px solid #bdb8ae;padding:52px 0 28px;color:#555}.t-momentum.momentum-v2 .m2-footer-grid{display:grid;grid-template-columns:1.5fr .7fr .8fr;gap:40px}.t-momentum.momentum-v2 .m2-footer h3{font:700 .85rem/1.2 Arial,sans-serif;color:#111;text-transform:uppercase;letter-spacing:.06em}.t-momentum.momentum-v2 .m2-footer a{color:#111}.t-momentum.momentum-v2 .m2-cross{margin-top:35px;padding-top:20px;border-top:1px solid #bbb5aa;font-size:.75rem} .t-momentum.momentum-v2 .m2-services-hero{padding:clamp(100px,12vw,175px) 0;border-bottom:1px solid var(--m2-line)}.t-momentum.momentum-v2 .m2-services-hero h1{max-width:8ch}.t-momentum.momentum-v2 .m2-services-hero>div>p{max-width:630px;color:#5d5a54;font-size:1.08rem;margin-top:28px}.t-momentum.momentum-v2 .m2-service-scope{padding:clamp(90px,10vw,145px) 0}.t-momentum.momentum-v2 .m2-scope-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px}.t-momentum.momentum-v2 .m2-scope-list{border-top:1px solid #99958c}.t-momentum.momentum-v2 .m2-scope-list div{display:grid;grid-template-columns:52px 1fr;gap:22px;padding:20px 0;border-bottom:1px solid #bbb6ac;color:#9a968e;font-size:.78rem}.t-momentum.momentum-v2 .m2-scope-list b{color:#111;font-size:.92rem;text-transform:uppercase;letter-spacing:.045em} @media(max-width:900px){ .t-momentum.momentum-v2 .m2-nav{flex-wrap:wrap} .t-momentum.momentum-v2 .m2-nav-btn{display:block;position:relative;width:30px;height:20px;margin-left:auto;cursor:pointer} .t-momentum.momentum-v2 .m2-nav-btn span{position:absolute;left:0;right:0;height:2px;background:var(--m2-ink);transition:transform .2s ease,opacity .2s ease} .t-momentum.momentum-v2 .m2-nav-btn span:nth-child(1){top:0}.t-momentum.momentum-v2 .m2-nav-btn span:nth-child(2){top:9px}.t-momentum.momentum-v2 .m2-nav-btn span:nth-child(3){top:18px} .t-momentum.momentum-v2 .m2-nav nav{display:none;flex-basis:100%;flex-direction:column;align-items:flex-start;gap:0;padding-bottom:14px} .t-momentum.momentum-v2 .m2-nav-toggle:checked~nav{display:flex} .t-momentum.momentum-v2 .m2-nav-toggle:focus-visible~.m2-nav-btn{outline:2px solid var(--m2-ink);outline-offset:4px} .t-momentum.momentum-v2 .m2-nav-toggle:checked~.m2-nav-btn span:nth-child(1){transform:translateY(9px) rotate(45deg)} .t-momentum.momentum-v2 .m2-nav-toggle:checked~.m2-nav-btn span:nth-child(2){opacity:0} .t-momentum.momentum-v2 .m2-nav-toggle:checked~.m2-nav-btn span:nth-child(3){transform:translateY(-9px) rotate(-45deg)} .t-momentum.momentum-v2 .m2-nav nav a{padding:13px 0} .t-momentum.momentum-v2 .m2-nav .m2-nav-cta{align-self:stretch;text-align:center;margin-top:8px} .t-momentum.momentum-v2 .m2-hero-grid,.t-momentum.momentum-v2 .m2-editorial-grid,.t-momentum.momentum-v2 .m2-quote-grid,.t-momentum.momentum-v2 .m2-scope-grid{grid-template-columns:1fr}.t-momentum.momentum-v2 .m2-hero-copy{padding:85px 0 55px}.t-momentum.momentum-v2 .m2-row{grid-template-columns:55px 1fr}.t-momentum.momentum-v2 .m2-row p,.t-momentum.momentum-v2 .m2-row a{grid-column:2}.t-momentum.momentum-v2 .m2-process{grid-template-columns:1fr}.t-momentum.momentum-v2 .m2-process article{border-right:0;border-bottom:1px solid #444;min-height:0;padding:30px 0!important}.t-momentum.momentum-v2 .m2-form{grid-template-columns:1fr}.t-momentum.momentum-v2 .m2-full{grid-column:auto}.t-momentum.momentum-v2 .m2-footer-grid{grid-template-columns:1fr}.t-momentum.momentum-v2 .m2-editorial-copy{padding-top:0}} .t-chooser .center{transition:opacity .35s ease} .t-chooser .chooser:has(.fit:hover) .center, .t-chooser .chooser:has(.momentum:hover) .center{opacity:0;pointer-events:none} @media (prefers-reduced-motion:reduce){.t-chooser .center{transition:none}} @media (max-width:800px){.fitbox-v2 .hero-v2 h1{line-height:.88}} .t-fitbox .story-v2__copy h2{overflow-wrap:anywhere} .fitbox-v2 .final-cta{padding-bottom:clamp(4rem,8vw,7rem)} .fitbox-v2 .final-cta::before{color:#17171a}