@font-face{font-family:"Noto Sans TC";src:url(/assets/fonts/ssa-noto-tc-vf.woff2) format("woff2");font-weight:400 900;font-display:swap}
@font-face{font-family:"Archivo";src:url(/assets/fonts/ssa-archivo.woff2) format("woff2");font-weight:500 900;font-stretch:100% 125%;font-display:swap}
@font-face{font-family:"Montserrat";src:url(/assets/fonts/ssa-montserrat.woff2) format("woff2");font-weight:500 700;font-display:swap}

@layer reset, tokens, base, layout, components, sections, utilities;

@layer reset {
  *,*::before,*::after{box-sizing:border-box}
  html,body{margin:0}
  h1,h2,h3,h4,p,figure,ul,ol{margin:0;padding:0}
  ul,ol{list-style:none}
  img,video,svg{display:block;max-width:100%}
  a{color:inherit;text-decoration:none}
  button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
}

@layer tokens {
  :root{
    --ink-950:#0A0E14; --ink-800:#1B232E; --ink-600:#4A5462; --ink-400:#8B95A1; --ink-300:#AEB5BE;
    --paper-50:#F7F7F4; --paper-100:#EEEEEA; --paper-200:#E1E1DB;
    --cobalt-900:#0A2A52; --cobalt-700:#0F4785; --cobalt-500:#165FAD; --cobalt-300:#7FA6D6; --cobalt-100:#DCE7F4; --cobalt-050:#EEF3FA;
    --electric-600:#0838BA; --electric-500:#0A46E6; --electric-400:#4573FF;
    --white:#FFFFFF; --error:#B3302A;

    --font-cjk:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;
    --font-latin:"Montserrat",var(--font-cjk);
    --font-display:"Archivo","Montserrat",sans-serif;

    --step-10:clamp(4.25rem,2.6rem + 7vw,9.875rem);
    --step-8:clamp(2.75rem,1.4rem + 5.2vw,6.3rem);
    --step-6:clamp(2.25rem,1.5rem + 3vw,4.05rem);
    --step-4:clamp(1.625rem,1.3rem + 1vw,2.6rem);
    --step-2:clamp(1.375rem,1.2rem + .5vw,1.66rem);
    --step-1:clamp(1.125rem,1.05rem + .3vw,1.33rem);
    --step-0:clamp(1rem,.97rem + .12vw,1.0625rem);
    --step--1:.875rem;
    --step--2:.75rem;

    --max:1680px;
    --gutter:clamp(20px,4.4vw,80px);
    --col-gap:clamp(16px,1.6vw,32px);
    --section-y:clamp(96px,11vw,200px);
    --header-h:80px;

    --ease-out:cubic-bezier(.16,1,.3,1);
    --ease-in-out:cubic-bezier(.65,0,.35,1);
    --dur-1:160ms; --dur-2:280ms; --dur-3:560ms; --dur-4:900ms; --dur-5:1200ms;
    --grain-dark:url("/assets/texture/grain-dark.png");
    --grain-light:url("/assets/texture/grain-light.png");
  }
  .theme-paper{--bg:var(--paper-100);--fg:var(--ink-950);--fg-muted:var(--ink-600);--line:rgba(10,14,20,.14);--line-strong:var(--ink-950);--accent:var(--electric-500);--accent-hover:var(--electric-600);--accent-fg:var(--white);--accent-text:var(--electric-500);--grain:var(--grain-dark)}
  .theme-ink{--bg:var(--ink-950);--fg:var(--white);--fg-muted:var(--ink-300);--line:rgba(255,255,255,.16);--line-strong:var(--white);--accent:var(--electric-500);--accent-hover:var(--electric-600);--accent-fg:var(--white);--accent-text:var(--electric-400);--grain:var(--grain-light)}
  .theme-cobalt{--bg:var(--cobalt-500);--fg:var(--white);--fg-muted:var(--cobalt-100);--line:rgba(255,255,255,.24);--line-strong:var(--white);--accent:var(--white);--accent-hover:var(--cobalt-050);--accent-fg:var(--cobalt-500);--accent-text:var(--white);--grain:var(--grain-light)}
}

@layer base {
  html{background:var(--paper-100);color:var(--ink-950);-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body{font-family:var(--font-cjk);font-size:var(--step-0);line-height:1.85;letter-spacing:.02em;font-kerning:normal;text-spacing-trim:trim-start;text-autospace:normal;-webkit-font-smoothing:antialiased;overflow-x:clip}
  [class*="theme-"]{background:var(--grain) 0 0/192px 192px repeat,var(--bg);color:var(--fg)}
  p{text-wrap:pretty}
  :focus-visible{outline:3px solid var(--electric-500);outline-offset:3px}
  .theme-cobalt :focus-visible,.theme-ink :focus-visible{outline-color:var(--white)}
  ::selection{background:var(--electric-500);color:var(--white)}
}

@layer layout {
  .wrap{padding-inline:max(var(--gutter),calc((100% - var(--max)) / 2))}
  .grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--col-gap)}
  .section{padding-block:var(--section-y)}
  @media (max-width:1023px){.grid{grid-template-columns:repeat(8,minmax(0,1fr))}}
  @media (max-width:767px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
}

@layer components {
  .display{font-weight:900;line-height:1.06;letter-spacing:-.015em;font-feature-settings:"palt" 1;text-wrap:balance}
  .display--xl{font-size:var(--step-8)}
  .display--l{font-size:var(--step-6);line-height:1.1}
  svg use{fill:currentColor}
  .display .punct{margin-inline:.06em .14em}
  .lead{font-size:var(--step-1);line-height:1.75;color:var(--fg-muted)}
  .muted{color:var(--fg-muted)}
  .accent-text{color:var(--accent-text)}
  .eyebrow{font-family:var(--font-latin);font-size:var(--step--2);font-weight:600;letter-spacing:.16em;text-transform:uppercase;line-height:1.4}
  .num{font-family:var(--font-display);font-stretch:125%;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.01em}

  .sec-label{display:flex;align-items:baseline;gap:12px;padding-top:16px;border-top:1px solid var(--line-strong);margin-bottom:clamp(40px,5vw,72px)}
  .sec-label .eyebrow:last-child{margin-left:auto}
  @media (max-width:767px){.sec-label > .eyebrow:last-child:not(:nth-child(2)){display:none}}
  .sec-label__idx{color:var(--accent-text)}
  .slash{display:inline-block;color:var(--accent-text);font-family:var(--font-display);font-stretch:125%;font-weight:800}

  .btn{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;gap:20px;min-height:56px;padding:0 22px 0 26px;font-weight:700;font-size:var(--step--1);letter-spacing:.06em;background:var(--accent);color:var(--accent-fg);transition:color var(--dur-2) var(--ease-out)}
  .btn--l{min-height:64px;font-size:var(--step-0);padding:0 24px 0 30px}
  .btn--s{min-height:44px;padding:0 16px 0 20px;gap:14px}
  .btn .bars{position:absolute;inset:0;z-index:-1;display:grid;grid-template-rows:1fr 1.25fr 1.66fr}
  .btn .bars i{background:var(--accent-hover);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-3) var(--ease-out)}
  .btn .bars i:nth-child(2){transition-delay:40ms}
  .btn .bars i:nth-child(3){transition-delay:80ms}
@media (hover:hover){  .btn:hover .bars i{transform:scaleX(1)}}
  .btn--ghost{background:transparent;color:var(--fg);box-shadow:inset 0 0 0 1px var(--line-strong)}
  .btn--ghost .bars i{background:var(--fg)}
@media (hover:hover){  .btn--ghost:hover{color:var(--bg)}}
  .icon-swap{position:relative;width:20px;height:20px;overflow:hidden;flex:none}
  .icon-swap svg{position:absolute;inset:0;width:20px;height:20px;transition:transform var(--dur-3) var(--ease-out)}
  .icon-swap svg:last-child{transform:translate(-110%,110%)}
@media (hover:hover){  a:hover .icon-swap svg:first-child{transform:translate(110%,-110%)}}
@media (hover:hover){  a:hover .icon-swap svg:last-child{transform:translate(0,0)}}

  .link{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:var(--step--1);letter-spacing:.06em;padding-block:10px;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;transition:background-size var(--dur-3) var(--ease-out)}
@media (hover:hover){  .link:hover{background-size:0 1px;background-position:100% 100%}}

  .media-mono img,.media-mono video{filter:grayscale(1) contrast(1.12) brightness(.94);transition:filter var(--dur-4) var(--ease-out),transform var(--dur-5) var(--ease-out)}
}

@layer sections {
  /* Header */
  .hdr{position:fixed;inset:0 0 auto;z-index:50;height:var(--header-h);display:flex;align-items:center;gap:32px;color:var(--white);transition:color var(--dur-2)}
  .hdr.is-solid{--header-h:64px;background:rgba(238,238,234,.88);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);color:var(--ink-950);box-shadow:0 1px 0 rgba(10,14,20,.12)}
  .hdr__brand{display:flex;align-items:center;gap:12px}
  .hdr .btn{--accent:var(--electric-500);--accent-hover:var(--electric-600);--accent-fg:var(--white)}
  .hdr__shield{width:34px;height:auto;color:currentColor}
  .hdr.is-solid .hdr__shield{color:var(--cobalt-500)}
  .hdr.is-solid.on-ink{background:rgba(10,14,20,.8);color:var(--white);box-shadow:0 1px 0 rgba(255,255,255,.1)}
  .hdr.is-solid.on-cobalt{background:rgba(15,71,133,.86);color:var(--white);box-shadow:0 1px 0 rgba(255,255,255,.14)}
  .hdr.is-solid:is(.on-ink,.on-cobalt) .hdr__shield{color:var(--white)}
  .hdr.on-ink .hdr__nav a[aria-current]::after{background:var(--electric-400)}
  .hdr.on-cobalt .hdr__nav a[aria-current]::after{background:var(--white)}
  .hdr__name strong{display:block;font-size:17px;font-weight:900;letter-spacing:.08em;line-height:1.1}
  .hdr__name small{display:block;font-family:var(--font-latin);font-size:9.5px;font-weight:700;letter-spacing:.15em;line-height:1.6;opacity:.8}
  .hdr__nav{display:flex;gap:clamp(18px,2.2vw,40px);margin-inline:auto}
  .hdr__nav a{position:relative;font-size:15px;font-weight:700;letter-spacing:.06em;padding-block:8px}
  .hdr__nav a sup{font-family:var(--font-latin);font-size:10px;font-weight:600;margin-right:6px;opacity:.7;vertical-align:4px}
  .hdr__nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform var(--dur-3) var(--ease-out)}
  .hdr__nav a[aria-current]::after{transform:scaleX(1);transform-origin:left}
@media (hover:hover){  .hdr__nav a:hover::after{transform:scaleX(1);transform-origin:left}}
  .hdr__nav a[aria-current]::after{background:var(--electric-500)}
  .hdr:not(.is-solid) .hdr__nav a[aria-current]::after{background:var(--white)}
  .hdr__menu{display:none;width:44px;height:44px;place-items:center}
  @media (max-width:1100px){.hdr__nav{display:none}.hdr__menu{display:grid;margin-left:auto}}

  /* Hero */
  .hero{position:relative;min-height:max(640px,100svh);display:grid;overflow:clip}
  .hero__media{position:absolute;inset:0;z-index:0;background:var(--ink-950)}
  .hero__media video{width:100%;height:100%;object-fit:cover;object-position:60% 40%;filter:grayscale(1) contrast(1.15) brightness(.8)}
  .hero__scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,14,20,.82) 0%,rgba(10,14,20,.45) 48%,rgba(10,14,20,.05) 80%),linear-gradient(0deg,rgba(10,14,20,.85) 0%,rgba(10,14,20,0) 45%)}
  .hero__inner{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:space-between;padding-top:calc(var(--header-h) + 28px);padding-bottom:28px;background:var(--grain-light) 0 0/192px repeat}
  .hero__meta{display:flex;justify-content:space-between;gap:24px;color:rgba(255,255,255,.72);padding-top:14px;border-top:1px solid rgba(255,255,255,.2)}
  .hero__main{align-items:end;margin-top:auto;padding-bottom:clamp(32px,4vw,64px)}
  .hero__title{grid-column:1/span 8;font-size:var(--step-10);font-weight:900;line-height:.98;letter-spacing:-.03em;font-feature-settings:"palt" 1}
  .hero__title .line{display:block;overflow:clip;padding-bottom:.04em;margin-bottom:-.04em}
  .hero__title .line>span{display:inline-block}
  .hero__aside{grid-column:9/span 4;display:grid;gap:28px;align-self:end}
  .hero__aside p{color:rgba(255,255,255,.78);font-size:var(--step-0);line-height:1.85}
  .hero__aside p strong{display:block;color:var(--white);font-weight:700}
  .hero__actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px}
  .hero__foot{display:flex;align-items:center;gap:24px;padding-top:16px;border-top:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.72)}
  .hero__foot .scroll-cue{margin-left:auto;display:flex;align-items:center;gap:12px}
  .scroll-cue i{position:relative;width:1px;height:40px;background:rgba(255,255,255,.25);overflow:hidden}
  .scroll-cue i::after{content:"";position:absolute;inset:0;background:var(--white);animation:cue 1.8s var(--ease-in-out) infinite}
  @keyframes cue{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}
  .video-toggle{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 14px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
  .video-toggle svg{width:16px;height:16px}
  @media (max-width:1023px){.hero__title{grid-column:1/-1}.hero__aside{grid-column:1/span 6;margin-top:32px}}
  .hero__meta > span{white-space:nowrap}
  @media (max-width:767px){.hero__aside{grid-column:1/-1}.hero__meta > span:not(:first-child){display:none}.hero__foot .caption{display:none}}

  /* Doors */
  .doors{border-bottom:1px solid var(--line)}
  .door{position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--col-gap);align-items:center;padding-block:clamp(22px,2.6vw,40px);border-top:1px solid var(--line);transition:color var(--dur-3) var(--ease-out)}
  .door::before{content:"";position:absolute;inset:0 calc(-1 * max(var(--gutter),(100vw - var(--max)) / 2));z-index:-1;background:var(--electric-500);transform:scaleY(0);transform-origin:bottom;transition:transform var(--dur-3) var(--ease-out)}
@media (hover:hover){  .door:hover{color:var(--white)}}
@media (hover:hover){  .door:hover::before{transform:scaleY(1)}}
  .door__num{grid-column:1;font-size:var(--step-2);align-self:start;padding-top:.5em}
  .door__title{grid-column:2/span 6;font-size:var(--step-6);font-weight:900;letter-spacing:-.03em;line-height:1.1;font-feature-settings:"palt" 1}
  .door__desc{grid-column:8/span 4;max-width:24ic;color:var(--fg-muted);text-wrap:balance;transition:color var(--dur-3)}
@media (hover:hover){  .door:hover .door__desc{color:rgba(255,255,255,.82)}}
  .door__arrow{grid-column:12;justify-self:end;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;box-shadow:inset 0 0 0 1px currentColor}
  .door__arrow .icon-swap{width:22px;height:22px}
  .door-preview{position:fixed;left:0;top:0;z-index:40;width:clamp(220px,18vw,300px);aspect-ratio:4/5;pointer-events:none;overflow:hidden;opacity:0;transform:translate3d(-50%,-50%,0) scale(.85) rotate(-4deg);transition:opacity var(--dur-2),scale var(--dur-3) var(--ease-out)}
  .door-preview img{width:100%;height:100%;object-fit:cover}
  @media (hover:none),(max-width:1023px){.door-preview{display:none}}
  @media (max-width:767px){.door{grid-template-columns:auto 1fr auto;gap:6px 16px}.door__num{grid-column:1;padding-top:.2em}.door__title{grid-column:2}.door__desc{grid-column:2;font-size:var(--step--1)}.door__arrow{grid-column:3;grid-row:1/span 2;width:44px;height:44px}}

  /* Statement */
  .statement__title{grid-column:1/span 9}
  .statement__body{grid-column:7/span 5;margin-top:clamp(40px,4vw,64px);display:grid;gap:28px;justify-items:start}
  .facts{margin-top:clamp(72px,8vw,128px);border-top:1px solid var(--line)}
  .fact{grid-column:span 4;padding:28px 24px 0 0;display:grid;gap:12px;align-content:start}
  .fact+.fact{padding-left:24px;border-left:1px solid var(--line)}
  .fact__big{font-size:var(--step-8);line-height:.9;color:var(--fg)}
  .fact__big.cjk{font-family:var(--font-cjk);font-weight:900;letter-spacing:-.04em;font-feature-settings:"palt" 1}
  .fact__big sup{font-size:.32em;vertical-align:1.6em;margin-left:.1em;color:var(--accent-text)}
  .fact p{color:var(--fg-muted);font-size:var(--step--1);max-width:22ic}
  .court-rule{position:relative;height:120px;margin-top:clamp(64px,7vw,112px)}
  .court-rule svg{width:100%;height:100%;overflow:visible}
  @media (max-width:1023px){.statement__title{grid-column:1/-1}.statement__body{grid-column:1/span 6}.fact{grid-column:span 8;padding:24px 0}.fact+.fact{padding-left:0;border-left:0;border-top:1px solid var(--line)}}
  @media (max-width:767px){.statement__body{grid-column:1/-1}.fact{grid-column:1/-1}}

  /* Services */
  .head-row{align-items:end;margin-bottom:clamp(40px,4vw,64px)}
  .head-row h2{grid-column:1/span 8}
  .head-row>p{grid-column:9/span 4;color:var(--fg-muted)}
  .svc-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:var(--col-gap);height:clamp(620px,52vw,860px)}
  .card{position:relative;overflow:hidden;color:var(--white);background:var(--ink-950);display:flex;flex-direction:column;justify-content:space-between;padding:clamp(20px,2vw,32px)}
  .card--lg{grid-column:1/span 7;grid-row:1/span 2}
  .card--sm{grid-column:8/span 5}
  .card figure{position:absolute;inset:0;z-index:0}
  .card figure img{width:100%;height:100%;object-fit:cover}
  .card figure::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,14,20,.86) 0%,rgba(10,14,20,.1) 55%,rgba(10,14,20,.3) 100%)}
@media (hover:hover){  .card:hover figure img{filter:grayscale(0) contrast(1.02) brightness(1);transform:scale(1.04)}}
  .card>*:not(figure){position:relative;z-index:1}
  .card__top{display:flex;justify-content:space-between;align-items:center}
  .card__title{font-size:var(--step-4);font-weight:900;letter-spacing:-.02em;line-height:1.15;font-feature-settings:"palt" 1}
  .card--lg .card__title{font-size:var(--step-6)}
  .card__desc{color:rgba(255,255,255,.8);font-size:var(--step--1);margin-top:8px}
  .card__foot{display:flex;align-items:end;justify-content:space-between;gap:24px}
  .card .door__arrow{width:52px;height:52px;flex:none;transition:background var(--dur-3),color var(--dur-3)}
@media (hover:hover){  .card:hover .door__arrow{background:var(--electric-500);box-shadow:none}}
  @media (max-width:1023px){.head-row h2,.head-row>p{grid-column:1/-1}.head-row>p{margin-top:24px}.svc-grid{height:auto;grid-template-rows:none}.card--lg,.card--sm{grid-column:1/-1;grid-row:auto;aspect-ratio:4/3}}
  @media (max-width:767px){.card--lg,.card--sm{aspect-ratio:4/5}}

  /* Playbook */
  .playbook__grid{align-items:center}
  .playbook__copy{grid-column:1/span 6;display:grid;gap:32px;justify-items:start}
  .playbook__copy p{color:var(--fg-muted);max-width:30ic}
  .playbook__court{grid-column:7/span 6}
  .court{width:100%;height:auto;overflow:visible}
  .court .ln{fill:none;stroke:rgba(255,255,255,.4);stroke-width:1.25}
  .court .play{fill:none;stroke:var(--white);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
  .court .play.dash{stroke-dasharray:2 9}
  .court .mk{font-family:var(--font-display);font-stretch:125%;font-weight:800;font-size:22px;fill:var(--white)}
  .court .mk.x{fill:var(--cobalt-100)}
  .court .tag{font-family:var(--font-display);font-stretch:125%;font-weight:800;font-size:13px;fill:var(--cobalt-500)}
  .court .tagbg{fill:var(--white)}
  .steps{margin-top:clamp(64px,7vw,112px)}
  .step{grid-column:span 4;padding-top:20px;border-top:1px solid var(--line-strong);display:grid;gap:10px;align-content:start}
  .step .num{font-size:var(--step-4);line-height:1}
  .step h3{font-size:var(--step-2);font-weight:900;letter-spacing:-.01em;line-height:1.3;margin-top:18px}
  .step p{color:var(--fg-muted);font-size:var(--step--1)}
  @media (max-width:1023px){.playbook__copy,.playbook__court{grid-column:1/-1}.playbook__court{margin-top:56px}.step{grid-column:1/-1;margin-bottom:32px}}

  /* Coaches */
  .roster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--col-gap)}
  .pcard{display:grid;gap:18px;align-content:start}
  .pcard__top{display:flex;justify-content:space-between;align-items:end;padding-bottom:12px;border-bottom:1px solid var(--line-strong)}
  .pcard__top .num{font-size:var(--step-4);line-height:.9}
  .pcard figure{overflow:hidden;aspect-ratio:4/5;background:var(--ink-950)}
  .pcard figure img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;transition:transform var(--dur-5) var(--ease-out)}
@media (hover:hover){  .pcard:hover figure img{transform:scale(1.04)}}
  .pcard h3{font-size:var(--step-4);font-weight:900;letter-spacing:-.02em;line-height:1.1;font-feature-settings:"palt" 1}
  .pcard h3 small{font-size:var(--step--1);font-weight:700;color:var(--fg-muted);letter-spacing:.04em;margin-left:12px}
  .pcard__role{font-weight:700;font-size:var(--step-0)}
  .pcard__proof{color:var(--fg-muted);font-size:var(--step--1);line-height:1.7}
  .pcard__cta{display:flex;justify-content:space-between;align-items:center;padding-block:14px;border-block:1px solid var(--line);font-weight:700;font-size:var(--step--1);letter-spacing:.06em;transition:color var(--dur-2)}
@media (hover:hover){  .pcard:hover .pcard__cta{color:var(--electric-500)}}
  @media (max-width:1023px){.roster{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:min(78vw,420px);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:16px;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);scroll-padding-inline:var(--gutter)}.pcard{scroll-snap-align:start}}

  /* Social */
  .reels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--col-gap)}
  .reel figure{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--ink-950)}
  .reel figure img{width:100%;height:100%;object-fit:cover}
@media (hover:hover){  .reel:hover figure img{filter:grayscale(0) contrast(1.02) brightness(1);transform:scale(1.04)}}
  .reel__chip{position:absolute;left:16px;top:16px;z-index:1;color:var(--white)}
  .reel figure::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,14,20,.7) 0%,rgba(10,14,20,0) 40%);pointer-events:none}
  .reel__play{position:absolute;left:16px;bottom:16px;z-index:1;display:flex;align-items:center;gap:14px;color:var(--white);font-weight:700;font-size:var(--step--1);letter-spacing:.06em}
  .reel__play i{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--electric-500);transition:transform var(--dur-3) cubic-bezier(.34,1.4,.64,1)}
  .reel__play svg{width:20px;height:20px;margin-left:2px}
@media (hover:hover){  .reel:hover .reel__play i{transform:scale(1.1)}}
  .reel__copy{display:grid;gap:8px;padding-top:20px}
  .reel__copy h3{font-size:var(--step-2);font-weight:900;letter-spacing:-.01em;line-height:1.3}
  .reel__copy p{color:var(--fg-muted);font-size:var(--step--1)}
  .reel__copy .eyebrow{color:var(--accent-text)}
  @media (max-width:1023px){.reels{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:min(78vw,420px);overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);padding-bottom:16px}.reel{scroll-snap-align:start}}

  /* Enquiry */
  .enquiry__main{grid-column:1/span 7;display:grid;gap:32px;align-content:start}
  .enquiry__main p{color:var(--fg-muted);max-width:30ic}
  .enquiry__side{grid-column:8/span 5;display:grid;gap:16px;align-content:end}
  .tile{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:1fr auto;align-items:end;gap:8px 24px;min-height:168px;padding:24px 28px;color:var(--white);background:var(--electric-500)}
  .tile .bars{position:absolute;inset:0;z-index:-1;display:grid;grid-template-rows:1fr 1.25fr 1.66fr}
  .tile .bars i{background:var(--electric-600);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-3) var(--ease-out)}
  .tile .bars i:nth-child(2){transition-delay:40ms}.tile .bars i:nth-child(3){transition-delay:80ms}
@media (hover:hover){  .tile:hover .bars i{transform:scaleX(1)}}
  .tile--outline{background:transparent;color:var(--ink-950);box-shadow:inset 0 0 0 1px var(--ink-950)}
  .tile--outline .bars i{background:var(--ink-950)}
@media (hover:hover){  .tile--outline:hover{color:var(--white)}}
  .tile .eyebrow{grid-column:1/-1;align-self:start;opacity:.85}
  .tile strong{font-size:var(--step-4);font-weight:900;letter-spacing:-.02em;line-height:1.2}
  .tile .icon-swap{width:28px;height:28px}.tile .icon-swap svg{width:28px;height:28px}
  @media (max-width:1023px){.enquiry__main,.enquiry__side{grid-column:1/-1}.enquiry__side{margin-top:40px}}

  /* Footer */
  .ftr{padding-top:clamp(72px,8vw,128px);overflow:clip}
  .ftr__top{row-gap:48px}
  .ftr__brand{grid-column:1/span 5;display:grid;gap:20px;align-content:start}
  .ftr__brand .row{display:flex;gap:16px;align-items:center}
  .ftr__brand svg{width:56px;height:auto}
  .ftr__brand strong{font-size:var(--step-2);font-weight:900;letter-spacing:.06em}
  .slogan{display:block;width:min(260px,70%);aspect-ratio:705.81/129.18;background:currentColor;-webkit-mask:url("/assets/logo/ssa-slogan-zh.svg") center/contain no-repeat;mask:url("/assets/logo/ssa-slogan-zh.svg") center/contain no-repeat}
  .ftr__brand p{color:var(--fg-muted);font-size:var(--step--1)}
  .ftr__col{grid-column:span 3;display:grid;gap:4px;align-content:start}
  .ftr__col:first-of-type{grid-column:7/span 3}
  .ftr__col h3{margin-bottom:12px;color:var(--fg-muted)}
  .ftr__col a{padding-block:6px;font-size:var(--step-0);font-weight:700;width:fit-content;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size var(--dur-3) var(--ease-out)}
@media (hover:hover){  .ftr__col a:hover{background-size:100% 1px}}
  .ftr__mark{margin-top:clamp(64px,7vw,120px);font-family:var(--font-display);font-stretch:125%;font-weight:900;line-height:.74;letter-spacing:-.02em;white-space:nowrap;color:var(--white);user-select:none;margin-bottom:-.06em}
  .ftr__mark span{display:inline-block}
  .ftr__bottom{display:flex;justify-content:space-between;gap:24px;padding-block:20px;border-top:1px solid var(--line);position:relative;background:var(--cobalt-500)}
  @media (max-width:1023px){.ftr__brand,.ftr__col,.ftr__col:first-of-type{grid-column:1/-1}}
}

@layer utilities {
  .js.is-enhanced [data-reveal]{opacity:0;transform:translateY(28px);transition:opacity var(--dur-4) var(--ease-out),transform var(--dur-4) var(--ease-out)}
  .js.is-enhanced [data-reveal].is-in{opacity:1;transform:none}
  .js.is-enhanced .hero__title .line>span{transform:translateY(105%);transition:transform var(--dur-5) var(--ease-out)}
  .js.is-enhanced .is-loaded .hero__title .line>span{transform:none}
  .js.is-enhanced .is-loaded .hero__title .line:nth-child(2)>span{transition-delay:90ms}
  .js.is-enhanced .is-loaded .hero__title .line:nth-child(3)>span{transition-delay:180ms}
  .js.is-enhanced .court .play{stroke-dashoffset:var(--len);stroke-dasharray:var(--len)}
  .js.is-enhanced .court .play.dash{stroke-dasharray:2 9;stroke-dashoffset:0;opacity:0;transition:opacity var(--dur-3)}
  .js.is-enhanced .court.is-in .play{stroke-dashoffset:0;transition:stroke-dashoffset 1.4s var(--ease-in-out)}
  .js.is-enhanced .court.is-in .play.dash{opacity:1;transition-delay:.6s}
  .js.is-enhanced .court.is-in .p2{transition-delay:.5s}.js.is-enhanced .court.is-in .p3{transition-delay:1s}
  .js.is-enhanced .rule-draw{transform:scaleX(0);transform-origin:center;transition:transform 1.4s var(--ease-out)}
  .js.is-enhanced .is-in .rule-draw{transform:scaleX(1)}
  .nowrap{white-space:nowrap}
  .roster,.reels{scrollbar-width:none}
  .roster::-webkit-scrollbar,.reels::-webkit-scrollbar{display:none}
  .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  @media (prefers-reduced-motion:reduce){
    *,*::before,*::after{transition-duration:0s!important;animation:none!important;transition-delay:0s!important}
    .js.is-enhanced [data-reveal],.js.is-enhanced .hero__title .line>span{opacity:1;transform:none}
    .js.is-enhanced .court .play{stroke-dashoffset:0}
  }
}

@layer sections {
  input,select,textarea{font:inherit;color:inherit;border-radius:0;max-width:100%}
  button,input,select,textarea{-webkit-tap-highlight-color:transparent}
  :target{scroll-margin-top:100px} [hidden]{display:none}
  main{outline:none} img{height:auto} picture{display:block}
  .line{display:block} .display strong{font-weight:900}
  .skip-link{position:fixed;top:12px;left:20px;z-index:200;background:var(--white);color:var(--ink-950);padding:12px 20px;transform:translateY(-200%)}
  .skip-link:focus{transform:none} body.dialog-open{overflow:hidden}
  .hdr{--fg:var(--ink-950);--bg:var(--paper-100);--line-strong:currentColor;--accent:var(--electric-500);--accent-hover:var(--electric-600);--accent-fg:var(--white);view-transition-name:hdr}
  .hdr.on-ink,.hdr.on-cobalt{--fg:var(--white);--bg:var(--ink-950);--accent:var(--white)}
  .hdr .hdr__cta{color:inherit;--accent:transparent;--accent-hover:var(--fg);--accent-fg:var(--fg)}
  .hdr .hdr__cta .bars i{background:var(--fg)} .hdr__cta .icon-swap{width:18px;height:18px}
  .cta-compact{display:none}
  .hdr__brand{flex:none} .hdr__cta{flex:none} .hdr__menu{flex:none}
  .hdr__menu svg{width:24px;height:24px}
  .page-home .hdr:not(.is-solid){color:var(--white);--fg:var(--white);--bg:var(--ink-950)}
  .btn:active,.tile:active{transform:translateY(1px)}
  .btn:disabled{cursor:wait;opacity:.65} .btn{text-align:left}
  .btn--ghost{box-shadow:none;border:1px solid var(--line-strong)}
  .social-intro{grid-column:9/span 4;color:var(--fg-muted)} .social-intro p{margin:0}
  .social-handle--mobile{display:none} .social-handle{overflow-wrap:anywhere;letter-spacing:.04em}
  .social-links{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;margin-top:36px}
  .carousel-progress{height:2px;background:var(--line);margin-top:24px;display:none;overflow:hidden}
  .carousel-progress i{height:100%;display:block;background:var(--accent-text);transform-origin:left}
  .pcard__level{font-size:var(--step--1);font-weight:700;color:var(--accent-text);line-height:1.7}
  .pcard figure picture{height:100%} .pcard__top .eyebrow{font-size:12px;letter-spacing:.08em}
  .reel figure picture{height:100%} .reel__play{inset:auto 16px 16px;text-align:left}
  .reel__play i{flex:none} .reel button.reel__cover{position:absolute;inset:0;width:100%;z-index:2;text-align:left}
  .reel__copy .link{justify-self:start} .reel__chip{max-width:calc(100% - 32px)}
  .ftr__col:nth-child(2){grid-column:7/span 3} .ftr__col:nth-child(3){grid-column:10/span 3}
  .ftr__mark{font-size:min(18vw,340px);overflow:clip} .ftr__col a,.contact-alternatives a{overflow-wrap:anywhere}
  .mobile-nav{max-width:none;max-height:none;width:100%;height:100dvh;inset:0;margin:0;padding:0;border:0;overflow-y:auto;z-index:100}
  .mobile-nav::backdrop{background:var(--cobalt-500)}
  .mobile-nav__bars{position:absolute;inset:0;display:grid;grid-template-rows:1fr 1.25fr 1.66fr;pointer-events:none}
  .mobile-nav__bars i{background:var(--cobalt-700);transform:scaleY(0);transform-origin:top}
  .mobile-nav.is-opening .mobile-nav__bars i{animation:nav-wipe 560ms var(--ease-out) both}
  .mobile-nav.is-opening .mobile-nav__bars i:nth-child(2){animation-delay:60ms}.mobile-nav.is-opening .mobile-nav__bars i:nth-child(3){animation-delay:120ms}
  @keyframes nav-wipe{0%{transform:scaleY(1)}100%{transform:scaleY(0)}}
  .mobile-nav__inner{position:relative;display:grid;gap:28px;padding-block:20px 48px;min-height:100%}
  .mobile-nav__top{display:flex;align-items:center;justify-content:space-between;gap:16px}
  .menu-close{min-width:64px;min-height:44px;font-size:14px}.menu-close span{font-size:24px;margin-left:8px}
  .mobile-nav nav{display:grid;align-content:center;gap:12px;padding-block:24px}
  .mobile-nav nav a{font-size:var(--step-4);font-weight:900;padding-block:8px;border-bottom:1px solid var(--line)}
  .mobile-nav nav sup{font-family:var(--font-latin);font-size:12px;font-weight:600;margin-right:16px}
  .mobile-nav.is-opening nav a{animation:nav-link 560ms var(--ease-out) both}
  .mobile-nav nav a:nth-child(2){animation-delay:80ms}.mobile-nav nav a:nth-child(3){animation-delay:160ms}.mobile-nav nav a:nth-child(4){animation-delay:240ms}.mobile-nav nav a:nth-child(5){animation-delay:320ms}
  @keyframes nav-link{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
  .mobile-nav .btn{justify-self:start}
  @media(hover:hover){.hdr .hdr__cta:hover{color:var(--bg)}}
  @media(max-width:1100px){.hdr{gap:16px}.hdr__cta{margin-left:auto}.hdr__menu{margin-left:0}.cta-full{display:none}.cta-compact{display:inline}}
  @media(max-width:600px){.hdr__name small{display:none}.hdr__name strong{font-size:14px;letter-spacing:.04em}.hdr__brand{gap:8px}.hdr__shield{width:27px}.hdr{gap:8px}.hdr__cta{min-height:44px;padding-inline:12px;gap:8px;font-size:12px}.hdr__cta .icon-swap{display:none}}
  @media(max-width:1023px){.social-intro{grid-column:1/-1;margin-top:24px}.social-intro p{margin:0}.carousel-progress{display:block}.ftr__col:nth-child(2),.ftr__col:nth-child(3){grid-column:1/-1}}
  @media(max-width:767px){.social-handle--desktop{display:none}.social-handle--mobile{display:inline-flex;margin-top:18px;font-size:12px}.social .head-row p{margin-top:0}.pcard h3 small{display:block;margin:12px 0 0}}
}
@layer sections {
  .page-hero{padding-top:calc(80px + clamp(48px,6vw,96px));padding-bottom:0}
  .breadcrumbs{gap:12px;flex-wrap:wrap;margin-bottom:40px;color:var(--fg-muted);font-size:var(--step--2);line-height:1.8}
  .breadcrumbs a{padding-block:6px}.breadcrumbs [aria-current]{color:var(--fg)}
  .page-hero__label{color:var(--accent-text);margin-bottom:24px}
  .page-hero h1{max-width:12ic}
  .page-hero__row{margin-block:clamp(32px,4vw,56px) clamp(64px,7vw,112px)}
  .page-hero__aside{grid-column:8/span 5;display:grid;gap:32px;justify-items:start}
  .page-hero__photo{position:relative;aspect-ratio:21/9;overflow:hidden}
  .page-hero__photo picture,.page-hero__photo img{width:100%;height:100%;object-fit:cover}
  .page-hero__photo::after{content:"";position:absolute;inset:65% 0 0;background:linear-gradient(0deg,rgba(10,14,20,.75),rgba(10,14,20,0));pointer-events:none}
  .page-hero__photo figcaption{position:absolute;z-index:1;bottom:24px;right:var(--gutter);left:var(--gutter);color:var(--white);text-align:right}
  .section-jumps{display:flex;gap:12px;flex-wrap:wrap;padding-block:28px;border-bottom:1px solid rgba(10,14,20,.14)}
  .chip{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border:1px solid currentColor;font-size:14px;font-weight:700}
  .intro-grid .statement__body{grid-column:7/span 5;gap:24px}.intro-grid h2{grid-column:1/span 9}
  .intro-side{grid-column:8/span 5;display:grid;gap:24px;margin-top:40px;color:var(--fg-muted)}
  .section h2+p{margin-top:24px}.school-service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--col-gap)}
  .school-service-card{position:relative;isolation:isolate;aspect-ratio:4/5;display:flex;flex-direction:column;justify-content:end;padding:clamp(24px,3vw,48px);color:var(--white);background:var(--ink-950);overflow:hidden}
  .school-service-card figure{position:absolute;inset:0;z-index:-1}.school-service-card picture,.school-service-card img{width:100%;height:100%;object-fit:cover}
  .school-service-card figure::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,14,20,.93),rgba(10,14,20,.3) 90%)}
  .numbered-item-index{position:absolute;top:32px;left:32px;font-family:var(--font-display);font-size:var(--step-4);font-weight:800}
  .school-service-card h3{font-size:var(--step-4);font-weight:900;margin-bottom:18px}.school-service-card p{font-size:var(--step--1);line-height:1.85}
  .numbered-item-tag{font-family:var(--font-latin);font-size:var(--step--2);letter-spacing:.12em;font-weight:600;margin-top:24px}
  .school-service-card--row{grid-column:1/-1;aspect-ratio:auto;color:var(--ink-950);background:transparent;padding:32px 0 32px 12%;border-block:1px solid var(--line)}
  .school-service-card--row .numbered-item-index{left:0}.school-service-card--row p{max-width:48ic;color:var(--ink-600)}
  .school-photo-band{position:relative;overflow:hidden}.school-photo-band>div:first-child{height:clamp(400px,55vw,760px)}
  .school-photo-band img,.school-photo-band picture{width:100%;height:100%;object-fit:cover}.school-photo-band-copy{padding:24px var(--gutter);display:flex;justify-content:space-between;gap:20px;font-family:var(--font-latin);font-size:var(--step--2)}
  .level-doors{margin-top:48px}.section-footnote,.small-note{font-size:var(--step--1);color:var(--fg-muted);margin-top:24px}
  .programme-title-block{max-width:44ic}.programme-title-block h2{margin-block:24px 32px}.programme-title-block p{color:var(--fg-muted)}
  .programme-steps{position:relative}.programme-steps .step{position:relative}.programme-steps .step::before{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;background:var(--white)}
  .programme-steps .num{font-size:var(--step-2)}.steps--four .step{grid-column:span 3}.steps--four .step div{display:grid;gap:14px}
  .faq-grid>div:first-child{grid-column:1/span 4}.faq-list{grid-column:5/span 8}
  .faq-grid h2{font-size:var(--step-4);line-height:1.2}.faq-grid .arrow-link{display:inline-flex;min-height:44px;align-items:center;gap:20px;margin-top:24px;font-weight:700;font-size:14px}
  .faq-list details{border-top:1px solid var(--line)}.faq-list details:last-child{border-bottom:1px solid var(--line)}
  .faq-list summary{position:relative;cursor:pointer;list-style:none;padding:24px 48px 24px 0;font-size:var(--step-1);font-weight:700;line-height:1.6}
  .faq-list summary::-webkit-details-marker{display:none}.faq-list summary::before,.faq-list summary::after{content:"";position:absolute;right:8px;top:50%;width:18px;height:1px;background:currentColor;transition:transform var(--dur-2)}
  .faq-list summary::after{transform:rotate(90deg)}.faq-list details[open] summary::after{transform:rotate(0)}.faq-list details[open] summary::before{transform:rotate(180deg)}
  .faq-list details p{padding:0 48px 28px 0;color:var(--fg-muted);max-width:42ic}
  .school-end-cta{display:grid;gap:32px;justify-items:start}.school-end-cta>span{font-family:var(--font-latin);font-size:12px;letter-spacing:.12em;font-weight:600}
  .coach-groups{margin-top:96px}.coach-group+.coach-group{margin-top:96px}.roster--single{grid-template-columns:repeat(3,minmax(0,1fr))}
  .coach-evidence-intro{display:grid;grid-template-columns:1fr 2fr;gap:var(--col-gap)}.coach-evidence-intro p{max-width:34ic;color:var(--fg-muted);margin-top:24px}
  .coach-evidence-row{gap:24px}.coach-evidence-number{font-family:var(--font-display);font-size:var(--step-4);font-weight:800}.coach-evidence-name h3{font-size:var(--step-2);font-weight:900}
  .coach-evidence-row p,.coach-evidence-row small{font-size:14px;color:var(--fg-muted)}.coach-evidence-record{display:grid;gap:8px}.coach-evidence-record>span{font-size:12px;color:var(--fg-muted)}.coach-evidence-record strong{font-size:var(--step-1)}
  .coach-evidence-row>a{padding-block:14px;border-top:1px solid var(--line);font-size:14px;font-weight:700}.coach-evidence-foot{display:grid;gap:32px;justify-items:start;margin-top:48px}.coach-evidence-foot p{color:var(--fg-muted);font-size:14px;max-width:46ic}
  .profile-page{padding-top:144px}.profile-grid{align-items:start;padding-bottom:var(--section-y)}.profile-identity{grid-column:1/span 5;position:sticky;top:88px}
  .profile-identity figure{aspect-ratio:4/5;max-height:64vh;overflow:hidden}.profile-identity picture,.profile-identity img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
  .profile-identity h1{font-size:var(--step-6);margin-top:28px}.profile-identity .eyebrow{margin-top:14px;color:var(--fg-muted)}.profile-identity .pcard__level{margin-top:12px}.profile-identity .profile-role{font-size:var(--step-1);font-weight:700;margin-top:16px}.profile-short{font-size:14px;color:var(--fg-muted);margin-top:12px}
  .profile-records{grid-column:7/span 6}.profile-focus{display:grid;gap:24px}.profile-focus p{color:var(--fg-muted);max-width:34ic}.profile-focus .btn{justify-self:start}
  .cv-block{margin-top:80px}.cv-block .sec-label{margin-bottom:32px}.cv-block h2{font-size:var(--step-2);font-weight:900}.cv-note{font-size:14px;color:var(--fg-muted);margin-top:12px}
  .cv-record{padding-block:24px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 2fr;gap:12px 20px}.cv-record dt{font-family:var(--font-display);font-size:var(--step-1);font-weight:700;line-height:1.6}.cv-record dd{margin:0}.cv-record h3{font-size:var(--step-1);font-weight:700;line-height:1.5}.cv-record p{color:var(--fg-muted);font-size:14px;margin-top:8px}
  .achievement-table{width:100%;border-collapse:collapse;font-size:14px;text-align:left}.achievement-table caption{text-align:left;font-size:var(--step-2);font-weight:900;margin-bottom:24px}.achievement-table th{font-family:var(--font-latin);font-weight:600;font-size:12px;letter-spacing:.08em;color:var(--fg-muted)}.achievement-table th,.achievement-table td{padding:18px 14px 18px 0;border-bottom:1px solid var(--line);vertical-align:top}.achievement-table th:first-child,.achievement-table td:first-child{font-variant-numeric:tabular-nums;text-align:right;padding-right:24px}.achievement-table td strong{display:block;line-height:1.6}.achievement-table td p{color:var(--fg-muted);margin-top:8px}
  .achievement-mobile{display:none}.profile-source{border-top:1px solid var(--line);margin-top:64px;padding-top:24px;font-size:14px;color:var(--fg-muted);display:grid;gap:24px;justify-items:start}.profile-source .btn{color:var(--accent-fg)}
  .profile-next{padding-block:64px}.profile-next .sec-label{margin-bottom:24px}
  .basketball-intro .intro-side{grid-column:7/span 5}.basketball-paths .doors{margin-top:48px}
  .match-section__heading{align-items:end;margin-bottom:48px}.match-section__heading>div{grid-column:1/span 7}.match-section__heading>p{grid-column:8/span 5;color:var(--fg-muted);max-width:30ic}
  .match-section__media{row-gap:var(--col-gap);align-items:start}.match-section__media>figure{grid-column:span 4;min-width:0}.match-section__media>figure:first-child{grid-column:span 7}.match-section__media>figure:nth-child(2){grid-column:span 5}.match-section__media>figure:nth-child(3){grid-column:8/span 5}
  .match-section__media img,.match-section__media video{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;background:var(--ink-950)}.match-section__media video{object-fit:contain}.match-section__media figcaption{margin-top:14px;color:var(--fg-muted);font-size:12px;line-height:1.8;font-weight:600}
  #youth-match .match-section__media>figure:first-child{grid-column:1/span 5}#youth-match .match-section__media>figure:nth-child(2){grid-column:6/span 7}#youth-match .match-section__media>figure:nth-child(3){grid-column:1/span 5}
  .match-section__foot{display:grid;gap:28px;justify-items:start;margin-top:48px}.match-section__foot p{max-width:42ic;color:var(--fg-muted);font-size:14px}
  .basketball-practical>.btn{margin-top:40px}.practical-grid{margin-top:0}.practical-grid h3{font-size:var(--step-2)}
  .club-profile{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin-top:48px}.club-profile>div{display:grid;gap:8px}.club-profile .club-logo{width:56px}.club-profile a{font-size:14px}.club-profile strong{font-size:var(--step-2)}
  .club-content .reels{grid-auto-flow:initial;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;overflow:visible;padding:0}.story-banner{display:flex;align-items:end;justify-content:space-between;gap:48px;margin-top:96px;padding-top:32px;border-top:1px solid var(--line)}.story-banner h2{font-size:var(--step-4);font-weight:900;margin-top:20px}.story-banner p,.social-note{font-size:14px;color:var(--fg-muted);max-width:34ic;margin-top:24px}
  .instagram-dialog{width:min(660px,calc(100% - 32px));max-height:90dvh;overflow:auto;margin:auto;padding:24px;border:1px solid var(--ink-950);background:var(--paper-100);color:var(--ink-950)}.instagram-dialog::backdrop{background:rgba(10,14,20,.8)}.instagram-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.instagram-dialog h2{font-size:var(--step-2);line-height:1.4}.instagram-close{min-width:44px;min-height:44px;font-size:24px}.instagram-embed-host{min-height:160px}.instagram-embed-host iframe{max-width:100%}.instagram-fallback{font-size:14px;margin-top:24px}.instagram-fallback a{text-decoration:underline}
  .contact-page{padding-block:144px var(--section-y)}.contact-copy{grid-column:1/span 4;position:sticky;top:96px;display:grid;gap:24px;align-self:start}.contact-copy>h2{font-size:var(--step-2);margin-top:24px}.contact-copy>p:not(.lead){font-size:14px;color:var(--fg-muted)}.contact-form-host{grid-column:6/span 7;grid-row:1/span 2}.contact-copy .eyebrow{color:var(--accent-text)}.contact-copy h1{font-size:var(--step-4);line-height:1.2}.contact-copy .lead{font-size:var(--step-0)}
  .contact-alternatives{border-top:1px solid var(--line);padding-top:24px;display:grid;gap:12px}.contact-alternatives h3{font-size:14px}.contact-alternatives a{font-size:14px;text-decoration:underline;text-underline-offset:5px;min-height:44px;display:flex;align-items:center}
  .contact-next{grid-column:1/span 4;margin-top:64px;align-self:start}.contact-next h2{font-size:var(--step-2);font-weight:900}.contact-next__steps{display:grid;gap:20px;margin-top:24px}.contact-next__steps li{border-top:1px solid var(--line);padding-top:16px;display:flex;align-items:center;gap:20px}.contact-next__steps .num{font-size:var(--step-2)}.contact-next__steps strong{font-size:14px}
  .enquiry-form{min-width:0}.form-section-head{display:flex;gap:16px;align-items:baseline;padding:24px 0;border-top:1px solid var(--line-strong);margin-bottom:8px}.form-section-head:not(:first-child){margin-top:32px}.form-section-head>span{font-family:var(--font-display);font-size:var(--step-2);font-weight:800}.form-section-head h3{font-size:var(--step-2);font-weight:900}
  .field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px var(--col-gap)}.enquiry-form label{font-size:14px;font-weight:700;line-height:1.6}.enquiry-form label>span:not(.consent span){font-size:12px;font-weight:400;color:var(--fg-muted);margin-left:8px}.enquiry-form b{color:var(--error);font-weight:700}.enquiry-form input:not([type=checkbox],[type=hidden]),.enquiry-form select,.enquiry-form textarea{display:block;width:100%;min-height:56px;margin-top:12px;border:1px solid var(--ink-600);padding:14px 16px;background:var(--paper-50);font-size:var(--step-0);font-weight:400;line-height:1.6}
  .enquiry-form input::placeholder,.enquiry-form textarea::placeholder{color:var(--ink-600);opacity:1}.enquiry-form textarea{min-height:160px;resize:vertical}.enquiry-form select{appearance:none;padding-right:44px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6' stroke='%234A5462' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}.enquiry-form [aria-invalid=true]{border-color:var(--error)}
  .full-field{display:block;margin-block:32px}.consent{display:flex;align-items:start;gap:14px;padding-block:24px;border-top:1px solid var(--line)}.enquiry-form .consent span{font-size:14px;font-weight:400;color:var(--fg)}.consent input{flex:none;width:24px;height:24px;margin:1px 0 0;accent-color:var(--electric-500)}.form-submit{margin-top:8px;max-width:100%;justify-content:space-between;min-width:240px}.form-note{font-size:12px;color:var(--fg-muted);margin-top:24px;line-height:1.9}.form-note a{text-decoration:underline}.form-errors{border:2px solid var(--error);padding:24px;margin-bottom:32px;color:var(--error)}.form-errors h3{font-size:var(--step-0)}.form-errors ul{margin-top:16px;display:grid;gap:12px}.form-errors a{text-decoration:underline;font-size:14px}.form-status{font-size:14px;color:var(--error);margin-block:16px}.form-inline-error{color:var(--error);font-size:14px;margin-top:16px}
  .thanks-page{min-height:100svh;padding-top:180px;display:grid;gap:40px;align-content:center;justify-items:start}.thanks-page p{max-width:36ic;color:var(--fg-muted)}.thanks-page>div{display:flex;flex-wrap:wrap;gap:20px}
  .not-found{position:relative;overflow:hidden;padding-top:160px}.not-found__court{position:absolute;inset:100px -10% auto 40%;width:70%;opacity:.12;pointer-events:none}.not-found__num{font-family:var(--font-display);font-stretch:125%;font-size:var(--step-10);font-weight:900;line-height:1}.not-found h1{font-size:var(--step-6);margin-top:32px}.not-found p{margin-top:24px}.not-found .doors{margin-top:64px;position:relative}
  @media(hover:hover){.chip:hover{background:var(--electric-500);border-color:var(--electric-500);color:var(--white)}.school-service-card:hover img{filter:grayscale(0) contrast(1.02);transform:scale(1.04)}.achievement-table tbody tr:hover{background:var(--paper-200)}.match-section__media figure:hover img{filter:grayscale(0) contrast(1.02) brightness(1)}}
  @media(max-width:1023px){.page-hero__aside{grid-column:1/-1;max-width:34ic}.intro-grid .statement__body,.intro-grid h2,.intro-side,.basketball-intro .intro-side{grid-column:1/-1}.steps--four .step{grid-column:span 4}.faq-grid>div:first-child,.faq-list{grid-column:1/-1}.faq-list{margin-top:48px}.profile-identity{grid-column:1/span 3}.profile-records{grid-column:5/span 4}.profile-identity h1{font-size:var(--step-4)}.cv-record{grid-template-columns:1fr}.profile-focus h2{font-size:var(--step-4)}.coach-evidence-intro{grid-template-columns:1fr}.coach-evidence-intro>div{margin-top:24px}.roster--single{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:initial;overflow:visible;margin:0;padding:0}.match-section__heading>div,.match-section__heading>p{grid-column:1/-1}.match-section__heading>p{margin-top:24px}.match-section__media>figure:first-child{grid-column:span 5}.match-section__media>figure:nth-child(2),.match-section__media>figure:nth-child(3){grid-column:6/span 3}#youth-match .match-section__media>figure:first-child,#youth-match .match-section__media>figure:nth-child(3){grid-column:1/span 3}#youth-match .match-section__media>figure:nth-child(2){grid-column:4/span 5}.contact-copy{grid-column:1/span 3}.contact-form-host{grid-column:4/span 5}.contact-next{grid-column:1/span 3}.field-grid{grid-template-columns:1fr}.club-content .reels{grid-template-columns:repeat(2,minmax(0,1fr))}}
  @media(max-width:767px){.page-hero__photo{aspect-ratio:4/5}.page-hero h1{font-size:var(--step-8)}.school-service-grid{grid-template-columns:1fr}.school-service-card--row{padding-left:16%}.school-photo-band-copy{display:grid;gap:12px}.steps--four .step{grid-column:1/-1}.profile-identity,.profile-records{grid-column:1/-1}.profile-identity{position:static}.profile-identity figure{max-height:none}.profile-records{margin-top:64px}.profile-identity h1{font-size:var(--step-6)}.achievement-table{display:none}.achievement-mobile{display:block}.cv-block{margin-top:64px}.profile-next{padding-block:48px}.roster--single{grid-template-columns:1fr;max-width:420px}.coach-evidence-row{grid-column:1/-1}.match-section__media>figure:first-child,.match-section__media>figure:nth-child(2),.match-section__media>figure:nth-child(3),#youth-match .match-section__media>figure:first-child,#youth-match .match-section__media>figure:nth-child(2),#youth-match .match-section__media>figure:nth-child(3){grid-column:1/-1}.match-section__media{row-gap:40px}.club-content .reels{grid-template-columns:1fr;gap:56px}.story-banner{display:grid;gap:24px}.contact-copy,.contact-form-host,.contact-next{grid-column:1/-1;grid-row:auto}.contact-copy{position:static}.contact-copy h1{font-size:var(--step-6)}.contact-form-host{margin-top:56px}.contact-next{margin-top:64px}.form-submit{min-width:0;width:100%}.instagram-dialog{padding:16px}.instagram-dialog h2{font-size:var(--step-1)}.thanks-page{padding-top:140px}.not-found__court{width:120%;inset:80px -40% auto auto}}
}
@layer utilities {
  .js .display .line>span{display:inline-block}.door-preview{transition:opacity var(--dur-2)}
  .no-js .hdr__menu{display:none}.no-js .hdr__nav{display:flex;flex-wrap:wrap}.no-js .hdr{position:relative;height:auto;min-height:80px;background:var(--cobalt-500);color:var(--white)}
  .no-js .hero{min-height:800px}.no-js .hero__inner{padding-top:28px}
  .js .ftr__mark.is-in .mark-letter{animation:mark-rise 1200ms var(--ease-out) both;animation-delay:calc(var(--letter-index) * 60ms)}@keyframes mark-rise{from{transform:translateY(110%)}to{transform:none}}
  @supports(animation-timeline:scroll()){@media(min-width:1024px) and (prefers-reduced-motion:no-preference){.hero{view-timeline-name:--hero}.hero__media video{animation:hero-scale linear both;animation-timeline:--hero;animation-range:exit 0% exit 100%}.hero__title{animation:hero-rise linear both;animation-timeline:--hero;animation-range:exit 0% exit 100%}@keyframes hero-scale{to{transform:scale(1.08)}}@keyframes hero-rise{to{transform:translateY(-8vh)}}}}
  @view-transition{navigation:auto} ::view-transition-old(root){animation:page-out 280ms var(--ease-out) both}::view-transition-new(root){animation:page-in 560ms var(--ease-out) both}::view-transition-old(hdr),::view-transition-new(hdr){animation:none}
  @keyframes page-out{to{opacity:0;transform:translateY(-16px)}}@keyframes page-in{from{opacity:0;transform:translateY(24px)}}
  @media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition-duration:0s!important;transition-delay:0s!important}.js [data-reveal],.js .hero__title .line>span{opacity:1;transform:none}.js .court .play{stroke-dashoffset:0}.js .court .play.dash{opacity:1}.door-preview{display:none}@view-transition{navigation:none}}
}

@layer utilities {
  html{scroll-padding-top:88px}
  .hero__inner{min-width:0;width:100%}.hero__meta>span:nth-child(2){white-space:normal;text-align:center}
  .tile strong{text-wrap:balance}.door__title{text-wrap:balance}
  .no-js .hdr{flex-wrap:wrap}.no-js .hdr__nav{order:3;width:100%;gap:16px}
  .ftr__col h2{margin-bottom:12px;color:var(--fg-muted);font-size:12px;font-weight:600;letter-spacing:.16em}
  .form-intro{margin-bottom:40px}.form-intro h2{font-size:var(--step-2);font-weight:900}.form-intro p{color:var(--fg-muted);font-size:14px;max-width:34ic;margin-top:16px}
  @media(max-width:767px){.ftr__bottom{display:grid;grid-template-columns:1fr auto;row-gap:16px}.ftr__bottom>span:nth-child(2){grid-row:2;grid-column:1/-1}.ftr__bottom>a{white-space:nowrap;min-height:44px;display:flex;align-items:center}.ftr__bottom>span:first-child{align-self:center}}
}

@layer utilities {
  .page-hero{--page-top:calc(80px + clamp(48px,6vw,96px));padding-top:var(--page-top)}
  .page-hero>.wrap{min-height:calc(100svh - var(--page-top));display:flex;flex-direction:column;padding-bottom:clamp(64px,7vw,112px)}
  .page-hero__row{margin-bottom:0}
  .page-schools .page-hero__photo img{object-position:50% 22%}
  .hdr__brand,.hdr__nav a{min-height:44px;display:inline-flex;align-items:center}
  .hdr.on-ink :focus-visible,.hdr.on-cobalt :focus-visible{outline-color:var(--white)}
  .ftr__col a{min-height:44px;display:inline-flex;align-items:center}
  .contact-alternatives h2{font-size:14px;font-weight:700}
  .component-demo{margin-top:48px;display:flex;flex-wrap:wrap;gap:24px}.component-demo.roster,.component-demo.reels{display:grid}
}

@layer utilities {
 .carousel-progress i{width:33.333%}
 .not-found__court{opacity:1}.not-found__court path,.not-found__court circle:not(:last-child){opacity:.12}
 .head-row>p{max-width:30ic}.statement__body p,.intro-side p,.ftr__brand p{max-width:34ic}
 .thanks-page .thanks-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:min(100%,880px);gap:24px}
 .thanks-page .tile--outline{color:var(--white);border:1px solid var(--white);box-shadow:none}.thanks-page .tile--outline .bars i{background:var(--white)}
 @media(hover:hover){.thanks-page .tile--outline:hover{color:var(--cobalt-500)}}
 @media(max-width:600px){.thanks-page .thanks-actions{grid-template-columns:1fr}}
}

@layer utilities {
 .btn>span:not(.bars,.icon-swap){min-width:0;text-wrap:balance}.btn:disabled .bars{display:none}
 .reel__chip{background:var(--ink-950);padding:6px 8px}
 .no-js .video-toggle{display:none}
}

@layer utilities {p{text-wrap:wrap}.section{contain:layout style}}

@layer utilities {
 .page-hero__row{margin-top:auto;padding-top:clamp(32px,4vw,56px)}
 .card figure picture{width:100%;height:100%}
 [data-mask]>.line{overflow:clip;padding-bottom:.08em;margin-bottom:-.08em}
 [data-mask] .mask-inner{display:inline-block;max-width:100%}
 @media(prefers-reduced-motion:no-preference){
 .js.is-enhanced [data-mask] .mask-inner{transform:translateY(108%);transition:transform 1200ms var(--ease-out);transition-delay:calc(var(--line-index) * 90ms)}
 .js.is-enhanced [data-mask].is-in .mask-inner{transform:none}
 .js.is-enhanced .court-rule svg:last-child circle:last-child{transform:scale(0);transform-box:fill-box;transform-origin:center;transition:transform 900ms cubic-bezier(.34,1.4,.64,1)}
 .js.is-enhanced .court-rule.is-in svg:last-child circle:last-child{transform:scale(1)}
 }
 .mark-letter{display:inline-block}
}

@layer utilities {.coach-directory .coach-groups{margin-top:0}.school-photo-band-copy strong{font-family:var(--font-cjk);font-size:14px;line-height:1.8}.no-js .hdr .hdr__shield{color:var(--white)}}

@layer utilities {.component-demo.svc-grid{display:grid}.faq-list details[open] summary::before{transform:rotate(45deg)}.faq-list details[open] summary::after{transform:rotate(135deg)}}

@layer utilities {.no-js .reel__cover{display:none}}
