 
[data-flip]{}
 

 
.card{perspective:1100px;position:relative}
 
 
.card .in{position:relative;transform-style:preserve-3d;
  rotate:y 0deg;translate:0 0 0;
  transition:rotate .72s cubic-bezier(.65,0,.35,1),
             translate .36s cubic-bezier(.65,0,.35,1)}
.card.turning .in{translate:0 0 -78px}
 
.card .face{position:absolute;inset:0;backface-visibility:hidden;
  -webkit-backface-visibility:hidden;border-radius:var(--r4);overflow:hidden;
  clip-path:inset(0 round var(--r4))}
.card .front{position:relative}           
.card .back{transform:rotateY(180deg);background:var(--iron-800);color:var(--sand-100);
  display:flex;flex-direction:column;padding:30px 28px 26px}

 
.card .front{aspect-ratio:var(--ratio,3/4)}
.card .front img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .9s cubic-bezier(.22,1,.36,1)}
.card:hover .front img{transform:scale(1.04)}

 
.pb{position:absolute;left:0;right:0;bottom:0;height:46%;pointer-events:none}
.pb i{position:absolute;inset:0;display:block}
.pb i:nth-child(1){backdrop-filter:blur(0.14cqw) saturate(1.14);-webkit-backdrop-filter:blur(0.14cqw) saturate(1.14);
  mask-image:linear-gradient(to bottom,transparent 0%,#000 8%,#000 22%,transparent 34%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 8%,#000 22%,transparent 34%)}
.pb i:nth-child(2){backdrop-filter:blur(0.28cqw) saturate(1.14);-webkit-backdrop-filter:blur(0.28cqw) saturate(1.14);
  mask-image:linear-gradient(to bottom,transparent 6%,#000 18%,#000 32%,transparent 46%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 6%,#000 18%,#000 32%,transparent 46%)}
.pb i:nth-child(3){backdrop-filter:blur(0.56cqw) saturate(1.14);-webkit-backdrop-filter:blur(0.56cqw) saturate(1.14);
  mask-image:linear-gradient(to bottom,transparent 14%,#000 28%,#000 44%,transparent 58%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 14%,#000 28%,#000 44%,transparent 58%)}
.pb i:nth-child(4){backdrop-filter:blur(1.13cqw) saturate(1.14);-webkit-backdrop-filter:blur(1.13cqw) saturate(1.14);
  mask-image:linear-gradient(to bottom,transparent 24%,#000 38%,#000 54%,transparent 70%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 24%,#000 38%,#000 54%,transparent 70%)}
.pb i:nth-child(5){backdrop-filter:blur(2.25cqw) saturate(1.14) brightness(.97);-webkit-backdrop-filter:blur(2.25cqw) saturate(1.14) brightness(.97);
  mask-image:linear-gradient(to bottom,transparent 36%,#000 52%,#000 68%,transparent 84%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 36%,#000 52%,#000 68%,transparent 84%)}
.pb i:nth-child(6){backdrop-filter:blur(4.5cqw) saturate(1.14) brightness(.94);-webkit-backdrop-filter:blur(4.5cqw) saturate(1.14) brightness(.94);
  mask-image:linear-gradient(to bottom,transparent 50%,#000 68%,#000 86%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 50%,#000 68%,#000 86%)}
.pb i:nth-child(7){backdrop-filter:blur(9cqw) saturate(1.14) brightness(.9);-webkit-backdrop-filter:blur(9cqw) saturate(1.14) brightness(.9);
  mask-image:linear-gradient(to bottom,transparent 64%,#000 88%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 64%,#000 88%)}
.pb--one i:nth-child(7){backdrop-filter:blur(4cqw) saturate(1.14);
  -webkit-backdrop-filter:blur(4cqw) saturate(1.14);
  mask-image:linear-gradient(to bottom,transparent 0%,#000 55%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 55%)}
.pb--one i:not(:nth-child(7)){display:none}
.pb--none i{display:none}
 
.pb::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to bottom,transparent,rgba(11,10,6,.10) 30%,rgba(11,10,6,.50) 54%,rgba(11,10,6,.78) 74%,rgba(11,10,6,.90))}
.pb::before{content:"";position:absolute;inset:0;z-index:1;opacity:.05;
  mix-blend-mode:overlay;background-image:var(--grain);
  mask-image:linear-gradient(to bottom,transparent,#000 40%);
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 40%)}

.card .lab{position:absolute;left:22px;right:22px;bottom:20px;color:#fff;z-index:2;
  text-shadow:0 1px 2px rgba(11,10,6,.34),0 2px 26px rgba(11,10,6,.5)}
.card .lab .nm{color:#fff;font-family:'Clash Display','Clash Fallback';font-weight:700;letter-spacing:-.012em;
  font-size:var(--d4);line-height:.88;margin:0 0 14px;text-transform:uppercase}
.card .lab .nm b{display:block;font-weight:inherit}
.card .lab .nm b+b{color:var(--ball-500)}
 
.card .lab .nm .rs{clip-path:inset(-1em -1em 0 -1em);transition:clip-path .3s ease 1.4s}
.card .lab .nm .rl i{display:inline-block;font-style:normal;margin-right:-.012em}
.card .lab .nm .rl i:last-child{margin-right:0}
.card.rv .lab .nm .rl i,.card.pk-rv .lab .nm .rl i{transform:translateY(114%);
  transition:transform .85s cubic-bezier(.22,1,.36,1) calc(.1s + var(--i,0) * 55ms)}
.card.on .lab .nm .rl i{transform:none}
.card.on .lab .nm .rs{clip-path:inset(-1em)}
@media(prefers-reduced-motion:reduce){.card .lab .nm .rl i{transform:none;transition:none}.card .lab .nm .rs{clip-path:none;transition:none}}
.card .tags{display:flex;flex-wrap:wrap;gap:6px}
 
.card .tags span{font-family:'Satoshi','Satoshi Fallback',sans-serif;font-size:var(--t6);letter-spacing:var(--ls-uc);
  text-transform:uppercase;padding:5px 10px;border-radius:99px;
  border:1px solid var(--chip-edge);color:rgba(243,241,234,.9);backdrop-filter:blur(6px)}
.card .tags span.hi{background:var(--ball-500);border-color:var(--ball-500);color:var(--iron-800);
  font-weight:500}


 
.card .face{opacity:1;transition:opacity 0s linear .36s}
.card .back{opacity:0}
.card.flip .front{opacity:0}
.card.flip .back{opacity:1}
@media(prefers-reduced-motion:reduce){.card .face{transition-delay:0s}}

 
.card .back{display:flex;flex-direction:column;gap:0}
.card .back .mono{font-weight:700;order:1;color:var(--ball-500);margin-bottom:10px;display:block;letter-spacing:var(--ls-uc);
  font-size:var(--l1)}
.card .back h3{order:2;font-family:'Clash Display','Clash Fallback';font-weight:700;letter-spacing:-.012em;
  font-size:var(--d7);line-height:.92;margin:0;text-transform:uppercase}
.card .back h3 b{display:block;font-weight:inherit}
.card .back h3 b+b{color:var(--ball-500)}
 
.card .back .btags{order:3;display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 22px;
  padding-bottom:16px;border-bottom:1px solid rgba(243,241,234,.14)}
.card .back .btags span{font-family:'Satoshi','Satoshi Fallback',sans-serif;font-size:var(--l2);letter-spacing:var(--ls-uc);
  text-transform:uppercase;padding:4px 10px;border-radius:99px;line-height:1.2;
  border:1px solid var(--chip-edge);color:rgba(243,241,234,.72)}
 
.card .back p{order:4;color:rgba(243,241,234,.86);line-height:1.55;
  letter-spacing:-.002em;margin:auto 0;max-width:none;text-wrap:pretty}
.card .back .cta{order:5;display:flex;flex-wrap:wrap;gap:10px;padding-top:24px}
 
.card .back{
  --btn-fill:var(--ball-500); --btn-label:var(--iron-800);
  --fg:var(--sand-100); --focus:var(--sand-100);
   
  --chip-edge:color-mix(in srgb, var(--fg) 24%, transparent)}

 
.card .front{
  --fg:var(--sand-100);
  --chip-edge:color-mix(in srgb, var(--fg) 24%, transparent)}
 
.card .back .btn svg:not(.pticon){width:15px;height:15px;fill:currentColor}

 
.card.flip .in{rotate:y 180deg}

[data-flip="reveal"] .card .back{transform:none;backface-visibility:visible;
  top:auto;height:auto;max-height:100%;
  transform:translateY(101%);transition:transform .6s cubic-bezier(.22,1,.36,1)}
[data-flip="reveal"] .card:hover .back,
[data-flip="reveal"] .card.flip .back,
[data-flip="reveal"] .card:focus-within .back{transform:translateY(0)}

 
 
.card .turn{position:absolute;top:16px;right:16px;z-index:3;height:44px;min-width:44px;
  padding:0;gap:8px;border-radius:99px;border:0;
   
  box-shadow:inset 0 0 0 1.6px var(--btn-edge);
  --btn-edge:color-mix(in srgb, var(--fg) 52%, transparent);
  background:rgba(11,10,6,.42);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  color:#fff;cursor:pointer;display:none;align-items:center;justify-content:center;
  font-family:'Satoshi','Satoshi Fallback',sans-serif;font-size:var(--l1);letter-spacing:var(--ls-uc);text-transform:uppercase;
  line-height:1;transition:background .25s ease,color .25s ease,border-color .25s ease}
.card .turn .g{width:17px;height:17px;display:block;flex-shrink:0}
.card .turn .t{display:none}
@media(hover:none){
  .card .turn{padding:0 15px;height:44px}
  .card .turn .t{display:block}
}
.card .turn{display:flex}
.card.flip .turn{background:var(--ball-500);color:var(--iron-800);border-color:var(--ball-500)}
 

@media(prefers-reduced-motion:reduce){
  .card .in,.card .back,.card .front img{transition-duration:.01ms!important}
  .card.turning .in{translate:0 0 0}}


 

 
.card{container-type:inline-size}
.card .lab .nm{font-size:clamp(28px,10.4cqw,50px)}
.card .back h3{font-size:clamp(23px,6.6cqw,34px)}
 
.card .back p{font-size:clamp(13.5px,3.3cqw,17px)}
 
.card .back{overflow:hidden}



 
.card .back p{flex:0 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;
  scrollbar-width:none}
.card .back p.clipped{
  mask-image:linear-gradient(to bottom,#000 calc(100% - 30px),transparent);
  -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 30px),transparent)}
.card .back p::-webkit-scrollbar{display:none}

 
#coaches{padding-top:8px}

 
 
#coaches .lay{display:block}
#coaches .layhead{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,40ch);
  column-gap:clamp(40px,6vw,96px);align-items:end;
  margin-bottom:clamp(30px,4.4vw,54px)}
#coaches .layhead .lab{grid-column:1/-1}
#coaches .layhead h2{margin:10px 0 0;text-wrap:balance}
 
#coaches .layhead h2 .lkl{display:block}
 
#coaches .colede{margin:0 0 8px;color:var(--mut);font-size:var(--t4);
  max-width:40ch;line-height:1.6}
#coaches .cgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}

 
@media(max-width:1000px){
  #coaches .layhead{grid-template-columns:1fr}
  #coaches .colede{margin:16px 0 0;max-width:52ch}}
@media(max-width:720px){#coaches .cgrid{grid-template-columns:minmax(0,420px)}}

 
@media(max-width:720px){
  .card .front{aspect-ratio:var(--ratio,3/4.4)}
  .card .back{padding:24px 22px 22px}
  .card .back .btags{margin:12px 0 16px;padding-bottom:13px}
  .card .back p{line-height:1.48}
  .card .back .cta{padding-top:18px;gap:8px}
  .card .back .btn{padding:0 17px}
}
 
@media(max-width:380px){
  .card .front{aspect-ratio:var(--ratio,3/4.9)}
  .card .back{padding:20px 18px 18px}
  .card .back .btags{margin:10px 0 13px;padding-bottom:11px}
  .card .back .btags span{font-size:var(--l2);padding:3px 8px}
  .card .back p{font-size:var(--t6);line-height:1.45}
  .card .back .cta{padding-top:14px;flex-wrap:nowrap;gap:7px}
  .card .back .btn{flex:1 1 0;min-width:0;padding:0 10px;font-size:var(--t6)}
}
 

 
.card .pb i{transition:opacity .22s ease}
.card.turning .pb i{opacity:0;backdrop-filter:none;-webkit-backdrop-filter:none}
.card .in{will-change:rotate,translate}
.card:not(.turning) .in{will-change:auto}
@media(prefers-reduced-motion:reduce){.card .pb i{transition:none}}

 
@media(hover:hover){
  .card .front{cursor:none}
}
.ccur{position:fixed;top:0;left:0;z-index:150;pointer-events:none;
  display:flex;align-items:center;gap:9px;
  background:var(--volt-surf);color:var(--ink);border-radius:99px;
  padding:11px 18px;font-weight:600;font-size:var(--t6);white-space:nowrap;
  font-family:'Satoshi','Satoshi Fallback',system-ui,sans-serif;
  box-shadow:0 6px 26px rgba(11,10,6,.22);
  opacity:0;transform:translate(-50%,-50%) scale(.7);
  transition:opacity .25s ease,transform .35s cubic-bezier(.22,1,.36,1);
  will-change:transform}
.ccur.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.ccur b{width:8px;height:8px;border-radius:50%;background:var(--ink);flex-shrink:0}
 
.card.turning ~ .ccur,.ccur.hold{opacity:0}
@media(hover:none){.ccur{display:none}}
@media(prefers-reduced-motion:reduce){.ccur{transition:opacity .18s ease}}

 
.card .front{cursor:none}
