*{box-sizing:border-box;margin:0}
:root{--ink:#0b1424;--ink-soft:#333;--muted:#888;--band:#f5f5f5;--btn:#1f1f1f}
body{font-family:Inter,system-ui,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2{font-weight:700;letter-spacing:-.04em;line-height:1.15}

.nav{display:flex;align-items:center;gap:20px;padding:12px;font-size:14px;color:#555}
.nav img{width:60px}
.nav a:hover{color:var(--ink)}

.hero{max-width:1100px;margin:0 auto;padding:110px 24px 200px;text-align:center}
.hero h1{font-size:clamp(36px,6vw,72px)}

.coaches{max-width:900px;margin:0 auto;padding:0 24px 40px;text-align:center}
.coaches h2{font-size:clamp(30px,4vw,48px)}
.logos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:32px 60px;margin:56px 0 100px}
.logos img{height:46px;width:auto}
.logos .tw{height:48px}
.logos .tr{height:46px}
.logos .pa,.logos .ck{height:30px}
.logos .ab{height:44px}

.person{display:flex;gap:40px;max-width:760px;margin:0 auto 90px;padding:0 24px;text-align:left}
.person img{width:320px;height:240px;object-fit:cover;border-radius:12px;flex-shrink:0}
.person h3,.service h3{font-size:clamp(32px,3.5vw,48px);font-weight:700;letter-spacing:-.04em;line-height:1.1}
.person p,.service p{color:var(--muted);font-size:22px;font-weight:500;line-height:1.6;letter-spacing:-.02em;margin-top:18px;max-width:300px}

.services{background:var(--band);padding:100px 24px}
.service{display:flex;align-items:center;gap:50px;max-width:1000px;margin:0 auto 30px}
.service:nth-child(even){flex-direction:row-reverse}
.service>img{width:475px;height:355px;object-fit:cover;border-radius:12px;flex-shrink:0}
.service>div{flex:1}
.btn{display:inline-block;margin-top:24px;padding:10px 14px;border-radius:6px;background:var(--btn);color:#fff;font-size:14px;font-weight:600;box-shadow:0 10px 20px rgba(0,0,0,.15)}
.btn:hover{background:#000}

footer{display:flex;justify-content:space-between;align-items:center;padding:36px;background:#1f1f1f;color:#fff;font-size:13px}
footer a{color:#09f}

/* service detail pages */
.detail{display:grid;grid-template-columns:1fr 1fr;align-items:start;min-height:calc(100vh - 64px)}
.detail>div{padding:60px 24px 60px max(24px,calc(50vw - 560px));max-width:600px}
.detail h1{font-size:clamp(40px,4.5vw,56px);color:var(--ink-soft)}
.detail p{color:var(--muted);font-size:24px;line-height:1.5;letter-spacing:-.02em;margin-top:24px}
.detail .btn{background:#eee;color:#222;box-shadow:none}
.detail .btn:hover{background:#ddd}
.detail>img{width:100%;height:600px;object-fit:cover}

@media (max-width:800px){
  .hero{padding:60px 16px 100px}
  .logos{gap:28px 40px;margin:40px 0 70px}
  .person,.service,.service:nth-child(even){flex-direction:column;align-items:stretch;gap:20px}
  .person{padding:0 16px;margin-bottom:60px}
  .person img,.service>img{width:100%;height:auto;aspect-ratio:4/3}
  .person p,.service p{max-width:none;font-size:19px}
  .services{padding:60px 16px}
  .service{margin-bottom:60px}
  .detail{grid-template-columns:1fr;min-height:0}
  .detail>div{padding:32px 16px}
  .detail>img{height:auto;aspect-ratio:4/3;order:-1}
  footer{padding:28px 16px}
}