:root{color-scheme:dark;--bg:#050a14;--navy:#0b1628;--panel:#101d32;--raised:#13253f;--line:rgba(149,183,226,.23);--sky:#99cfff;--gold:#dbbd8a;--light:#f7fbff;--muted:#a5b6cb;--action:#58b9f4;--shadow:0 25px 75px rgba(0,0,0,.25)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--light);font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}a:hover{color:#bfe2ff}button,a,summary{touch-action:manipulation}
a:focus-visible,summary:focus-visible{outline:3px solid var(--action);outline-offset:4px}img{max-width:100%;height:auto;display:block}
.skip{position:absolute;top:-60px;left:12px;padding:10px;background:var(--light);color:#081426;z-index:20}.skip:focus{top:8px}
.navshell{max-width:1380px;margin:auto;padding:18px clamp(20px,4vw,64px);display:flex;justify-content:space-between;align-items:center;gap:25px;border-bottom:1px solid var(--line)}
.wordmark{display:inline-flex;align-items:center;gap:10px;font-size:20px;letter-spacing:-.5px;font-weight:800;white-space:nowrap;color:var(--light)}
.wordmark img,.footbrand img{border-radius:8px;background:#fff;padding:3px}.wordmark sup{font-size:10px;vertical-align:super;color:var(--gold)}
.topnav,.navact{display:flex;align-items:center;gap:22px}.topnav a{font-size:13px;font-weight:550;color:#cbd8e8}.topnav a:hover{color:white}.navact{gap:10px}.mobile-nav{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:10px;min-height:45px;white-space:normal;max-width:100%;text-align:center;padding:11px 17px;font-size:13px;font-weight:720;transition:background .16s,transform .16s}
.btn:hover{transform:translateY(-1px)}.btn.solid{background:var(--action);color:#071b2c}.btn.solid:hover{background:#97d7ff}.btn.ghost{color:#f0f7ff;border:1px solid #426083;background:rgba(13,34,61,.4)}.btn.ghost:hover{border-color:#93c7fa}
main{max-width:1380px;margin:auto;padding:0 clamp(20px,4vw,64px)}
.hero{padding:clamp(60px,8vw,115px) 0 65px;min-height:625px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.16fr);gap:clamp(28px,4vw,62px);align-items:center}
.eyebrow{display:block;color:#75c7ff;font-size:11px;font-weight:750;letter-spacing:2px;text-transform:uppercase}
h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:inherit;letter-spacing:-1px;font-weight:500;line-height:1.13}
h1{font-size:clamp(43px,5.8vw,82px);margin:18px 0 26px}h1 em{font-style:normal;color:#afcce9}
h2{font-size:clamp(32px,4.15vw,56px);max-width:820px;margin:15px 0 22px}h3{font-size:21px;margin:13px 0 12px;font-weight:650;letter-spacing:-.5px}
.copy{color:var(--muted);line-height:1.75;max-width:680px;font-size:15px}.hero .copy{font-size:18px;max-width:570px}
.fine{font-size:11px;color:#9bacc3;line-height:1.6}.actions{display:flex;flex-wrap:wrap;gap:12px;margin:27px 0 20px}
.hero-product{position:relative;border-radius:20px;padding:12px;background:linear-gradient(135deg,#162943,#0a1528);border:1px solid #344e70;box-shadow:var(--shadow);overflow:hidden}
.hero-product img{width:100%;aspect-ratio:1.55;object-fit:cover;object-position:center;border-radius:12px}
.image-caption{display:inline-block;font-size:11px;color:#c7d7eb;letter-spacing:.3px;padding:12px 4px 1px}
.block{padding:clamp(55px,7vw,108px) 0;scroll-margin-top:40px}
.block>.copy{max-width:760px}.block h1{max-width:980px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:27px}.cards.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.panel{min-width:0;background:linear-gradient(155deg,#12233a,#0e1b30);border:1px solid var(--line);border-radius:14px;padding:24px}
.panel .eyebrow{font-size:9px;color:var(--gold)}.panel h3{font-size:19px}.panel .copy{font-size:13px;line-height:1.65}
.discover{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(210px,.55fr);align-items:center;gap:45px;padding:55px clamp(25px,4.3vw,62px);border-radius:25px;background:linear-gradient(125deg,#102442,#091427 69%);border:1px solid #324967}
.discover h2{margin-top:18px}.discovery-copy .copy{max-width:670px}
.rolelines{display:grid;gap:0;margin-top:23px;max-width:650px}
.rolelines>div{display:grid;grid-template-columns:80px 1fr;gap:17px;border-top:1px solid #34516e;padding:12px 0;font-size:13px;color:#d2e0ef}
.rolelines b{color:var(--gold);font-size:10px;letter-spacing:1px}
.guide-frame{display:flex;flex-direction:column;align-items:center;gap:10px;border:1px solid #395779;border-radius:15px;padding:18px;background:#081427;box-shadow:var(--shadow)}
.guide-frame img{width:min(100%,245px);aspect-ratio:148/210;object-fit:contain;border-radius:7px}
.guide-frame span{color:#d8c098;font-size:12px;text-align:center;font-weight:650}
.split{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:center;gap:clamp(24px,5vw,65px)}
.split>div{min-width:0}.visual-card{padding:13px;border:1px solid #345879;background:#091629;border-radius:22px;overflow:hidden}
.visual-card img{width:100%;border-radius:12px;object-fit:contain}
.visual-card .fine{padding:8px 7px 0}.client-visual{display:flex;justify-content:center}
.client-visual img{max-width:260px;max-height:500px;object-fit:contain;border:6px solid #243d63;border-radius:28px;box-shadow:var(--shadow)}
.trust{padding:55px;border:1px solid #384d6b;border-radius:20px;margin-bottom:90px;background:radial-gradient(circle at 95% 5%,rgba(62,115,182,.21),transparent 58%),var(--navy)}
.note{margin:27px 0;padding:20px 23px;border:1px solid #436488;border-left:3px solid var(--gold);border-radius:10px;background:#10213a;max-width:900px}
.note h3{margin:0 0 8px;color:#efdeb8;font-size:18px}.note .copy{margin-bottom:0}
.legal{max-width:960px;padding:75px 0 100px}.legal h1{font-size:clamp(38px,5vw,65px)}.legal-section{border-top:1px solid var(--line);padding:27px 0}
.legal-section h2{font-size:24px;margin:0 0 10px}.legal-section .copy{font-size:14px;max-width:900px}
.footer{border-top:1px solid var(--line);background:#081321;padding:45px clamp(25px,5vw,80px);margin-top:25px;display:flex;flex-direction:column;gap:30px}
.footbrand{display:flex;gap:15px;align-items:center}.footbrand b{font-size:22px}.footbrand p{font-size:12px;color:#bdcce0;margin:0}
.footer nav{display:flex;flex-wrap:wrap;gap:15px 28px;max-width:1200px}.footer nav a{font-size:12px;color:#b4c3d7}.footer .fine{max-width:1000px;margin:0}
@media(max-width:1100px){.topnav{gap:12px}.navact{gap:6px}.cards.four{grid-template-columns:repeat(2,minmax(0,1fr))}.navact>.btn{padding:9px 12px}}
@media(max-width:850px){.topnav,.navact{display:none}.mobile-nav{display:block;position:relative;margin-left:auto}.mobile-nav summary{cursor:pointer;list-style:none;padding:9px 13px;border:1px solid #416080;border-radius:10px;font-size:14px;color:#e1eefa}.mobile-nav summary::marker{content:''}.mobile-nav nav{position:absolute;right:0;top:42px;width:min(84vw,280px);z-index:15;background:#10203a;border:1px solid #416080;border-radius:12px;padding:10px;box-shadow:var(--shadow);display:flex;flex-direction:column}.mobile-nav nav a{font-size:14px;padding:9px;border-bottom:1px solid rgba(255,255,255,.08)}.hero{grid-template-columns:1fr;min-height:0;padding:60px 0}.discover{grid-template-columns:1fr;gap:30px}.guide-frame{max-width:310px}.split{grid-template-columns:1fr}.cards.three{grid-template-columns:1fr 1fr}}
@media(max-width:540px){body{font-size:15px}.hero{padding:45px 0}.hero h1{font-size:clamp(39px,10vw,54px)}.hero .copy{font-size:15px}.cards,.cards.four,.cards.three{grid-template-columns:1fr}.block{padding:48px 0}.block.discover{padding:32px 24px}.block.trust{padding:28px 24px}.guide-frame{margin:auto}.rolelines>div{grid-template-columns:70px 1fr;gap:10px}.split{gap:22px}.copy{font-size:14px}.btn{font-size:13px}.client-visual img{max-width:225px}.footer{padding:35px 20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn{transition:none}}

/* STUDIOFIT LUXURY PUBLIC ART DIRECTION — static HTML/CSS only.
   The browser receives no workout generator, medical scoring or proprietary JS. */
.hero-signature{
  position:relative;min-height:690px;padding-block:92px 126px;
  isolation:isolate;
}
.hero-signature::before{
  content:"";position:absolute;inset:20px -20px 22px;
  z-index:-1;pointer-events:none;
  background:
   radial-gradient(ellipse 65% 80% at 72% 45%,rgba(35,98,168,.15),transparent 75%),
   linear-gradient(115deg,rgba(7,22,42,.28),transparent 65%);
  border:1px solid rgba(88,162,237,.055);
}
.hero-signature .hero-copy{position:relative;z-index:1}
.hero-signature h1{
  font-size:clamp(49px,4.9vw,73px);font-weight:440;letter-spacing:-2.5px;
  line-height:1.07;max-width:680px;margin:24px 0;
}
.hero-signature h1 em{color:#cce4ff}
.hero-lead{font-size:clamp(16px,1.45vw,20px);font-weight:600;
  color:#5bc9ff;line-height:1.5;max-width:570px;margin:0 0 19px}
.hero-signature .copy{color:#b9c9dc;font-size:16px;line-height:1.8;max-width:540px}
.hero-signature .fine{margin-top:22px;max-width:485px}
.hero-signature .hero-product{
  border:0;background:transparent;box-shadow:none;overflow:visible;
  padding:0;position:relative;min-height:465px;
}
.studio-demo{
  position:relative;min-width:0;min-height:455px;
  background:linear-gradient(165deg,#0a172a,#091226);
  border:1px solid #345677;border-radius:23px;overflow:hidden;
  box-shadow:0 34px 90px rgba(0,0,0,.38),inset 0 1px rgba(196,227,255,.1);
}
.demo-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;
  min-height:39px;padding:10px 15px 9px;
  color:#95bce1;font-size:9px;letter-spacing:1.2px;
  border-bottom:1px solid #203756;background:#0e1d33}
.demo-dots{letter-spacing:2px;color:#6f99c7;font-size:8px}
.demo-status{color:#77c7f5;letter-spacing:.3px}
.demo-main{display:grid;grid-template-columns:125px minmax(0,1fr)}
.demo-sidebar{
  min-width:0;min-height:422px;background:#0d1c32;border-right:1px solid #2c4261;
  padding:19px 12px;display:flex;flex-direction:column;gap:5px;
}
.demo-side-brand{font-family:Georgia,serif;color:#b4dfff;font-size:32px;line-height:1;
  letter-spacing:-6px;margin:0 0 19px}
.demo-side-brand span{font-family:system-ui;font-size:9px;letter-spacing:0;vertical-align:top;margin-left:6px}
.demo-nav{font-size:10px;color:#94a9c5;padding:10px 9px;border-radius:7px;white-space:nowrap}
.demo-nav.on{color:#e1f6ff;background:#153b65;border-left:2px solid #66c5f5}
.demo-side-foot{font-size:8px;line-height:2.3;letter-spacing:1.9px;margin-top:auto;color:#8babc5}
.demo-content{min-width:0;padding:24px clamp(16px,2.1vw,28px) 22px}
.demo-mini{display:block;font-size:9px;letter-spacing:1.6px;color:#6bc5ff;font-weight:700}
.demo-content h3{font-size:26px;font-weight:550;margin:11px 0 19px;letter-spacing:-.8px}
.demo-session{border:1px solid #385c83;border-radius:14px;background:linear-gradient(110deg,#102d4c,#112237);
  padding:15px 17px 13px;margin-bottom:16px}
.demo-tag{font-size:8px;letter-spacing:1.3px;color:#76c7ff;font-weight:700}
.demo-session strong{display:block;font-size:20px;letter-spacing:-.4px;font-weight:660;margin-top:8px}
.demo-session p{font-size:11px;margin:6px 0 12px;color:#b9d0e7}
.demo-timeline{display:flex;gap:6px;border-top:1px solid rgba(191,221,255,.17);padding-top:12px}
.demo-timeline>div{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}
.demo-timeline span{font-size:14px;color:#6ac1ff}
.demo-timeline b{font-size:9px;color:#cfe1f1;white-space:nowrap;font-weight:550}
.demo-program{border:1px solid #253d5a;border-radius:12px;padding:12px 16px;background:#0a1728}
.demo-program>.demo-mini{font-size:8px}
.demo-row{display:grid;grid-template-columns:24px minmax(0,1fr);column-gap:8px;row-gap:0;
  border-top:1px solid #203755;padding:9px 0}
.demo-row:first-of-type{margin-top:8px}
.demo-row span{color:#62bfff;font-size:11px;grid-row:span 2}
.demo-row b{font-size:11px;font-weight:650}
.demo-row small{font-size:10px;color:#a6bacf}
.demo-client{
 position:absolute;bottom:-54px;right:-20px;width:195px;min-height:274px;
 border:5px solid #2a4566;border-radius:27px;
 background:#09182e;box-shadow:-10px 18px 50px rgba(0,0,0,.5),0 0 0 1px #7196c0;
 z-index:2;padding:12px 12px 14px;
}
.demo-client-top{display:flex;justify-content:space-between;gap:8px;
 font-size:8px;letter-spacing:1.1px;font-weight:800;color:#8ecfff;padding-bottom:12px;
 border-bottom:1px solid #263e60}
.demo-client-content{padding-top:16px}
.demo-client-content>.demo-mini{font-size:7px}
.demo-client-content>strong{display:block;font-size:24px;font-weight:550;margin:7px 0 14px}
.demo-client-card{border:1px solid #314e72;background:#112946;border-radius:11px;padding:12px;display:flex;flex-direction:column;gap:7px}
.demo-client-card>span:first-child{font-size:7px;color:#a2cbf3;letter-spacing:.8px}
.demo-client-card>b{font-size:11px;line-height:1.4}
.demo-client-card>small{font-size:9px;color:#adc1d8}
.demo-client-action{background:#59bfff;color:#06192a;font-size:9px;font-weight:850;
 display:block;padding:9px 8px;text-align:center;border-radius:7px;margin-top:5px}
.demo-client-bottom{display:block;font-size:6.5px;letter-spacing:.5px;color:#b5cbe3;padding-top:12px;text-align:center}
.demo-disclaimer{display:block;font-size:9px;color:#b5c9de;margin-top:12px;padding-right:190px}
.posture-visual{background:linear-gradient(135deg,#11253d,#0c182b)}
.posture-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;
 border-top:1px solid #355270;padding-top:12px;margin:12px 5px}
.posture-steps span{display:flex;align-items:center;gap:7px;min-width:0;
 font-size:11px;color:#c5d8e9}
.posture-steps b{color:#61c3fb;font-size:15px;font-weight:450}
@media (max-width:1180px){
 .hero-signature h1{font-size:clamp(43px,5vw,65px)}
 .demo-main{grid-template-columns:105px minmax(0,1fr)}
 .demo-sidebar{padding:16px 9px}
 .demo-nav{font-size:9px;padding:9px 7px}
 .demo-content{padding:19px 16px}
 .demo-client{right:-7px;width:170px;min-height:263px}
}
@media (max-width:850px){
 .hero-signature{padding:58px 0 70px;min-height:0}
 .hero-signature .hero-product{margin-top:6px;min-height:0}
 .hero-signature h1{font-size:clamp(42px,7.1vw,68px)}
 .studio-demo{min-height:0}
 .demo-sidebar{min-height:435px}
 .demo-client{right:0;bottom:-34px}
 .demo-disclaimer{padding-right:180px}
}
@media (max-width:540px){
 .hero-signature{padding:44px 0 65px}
 .hero-signature h1{font-size:clamp(44px,11.6vw,58px);letter-spacing:-1.9px;line-height:1.06}
 .hero-signature .copy{font-size:16px;line-height:1.7}
 .hero-lead{font-size:16px}
 .hero-signature .hero-product{padding-bottom:0}
 .studio-demo{border-radius:15px;min-height:0}
 .demo-toolbar{padding:11px 13px;font-size:9px;letter-spacing:.55px}
 .demo-main{grid-template-columns:minmax(0,1fr)}
 .demo-sidebar{display:none}
 .demo-side-brand{font-size:24px;letter-spacing:-5px}
 .demo-nav{font-size:7px;padding:7px 4px;overflow:hidden;text-overflow:ellipsis}
 .demo-side-foot{font-size:6px;letter-spacing:.5px}
 .demo-content{padding:20px 16px 16px}
 .demo-mini{font-size:9px;letter-spacing:.8px}
 .demo-content h3{font-size:25px;margin:10px 0 16px}
 .demo-session{padding:15px;margin-bottom:14px}
 .demo-tag{font-size:9px}
 .demo-session strong{font-size:21px}
 .demo-session p{font-size:12px}
 .demo-timeline span{font-size:16px}
 .demo-timeline b{font-size:11px;white-space:normal}
 .demo-program{padding:13px}
 .demo-row{grid-template-columns:22px minmax(0,1fr);gap:5px;padding:10px 0}
 .demo-row b{font-size:12px}
 .demo-row span,.demo-row small{font-size:11px}
 .demo-client{position:relative;bottom:auto;right:auto;width:84%;min-height:0;
  margin:-9px auto 0;border-width:3px;border-radius:17px;padding:10px 13px}
 .demo-client-content{padding-top:11px}
 .demo-client-content>strong{font-size:20px;margin:5px 0 8px}
 .demo-client-card{gap:4px}
 .demo-client-bottom{padding-top:10px}
 .demo-disclaimer{padding:0;margin:9px 0 0;font-size:9px;text-align:center}
 .posture-steps span{font-size:9px;gap:4px}
}
