/* The Flip Zone. Black and silver, following the All Star uniforms.
   The old site was red and blue; that palette is deliberately gone. */
:root{
  --bg:#0A0B0D;
  --surface:#121417;
  --surface-2:#191C21;
  --line:rgba(255,255,255,.09);
  --line-2:rgba(255,255,255,.16);
  --txt:#E9EBEF;
  --txt-2:#A5ABB5;
  --txt-3:#848A95;
  --silver:#C8CDD5;
  --chrome:linear-gradient(170deg,#FBFCFD 0%,#DCE0E6 45%,#AEB4BE 100%);
  --wrap:1180px;
  --r:14px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--txt);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--txt);text-decoration-color:var(--line-2);text-underline-offset:3px}
a:hover{text-decoration-color:var(--silver)}
h1,h2,h3,.eyebrow{font-family:Archivo,Inter,sans-serif;letter-spacing:-.02em}
h1,h2,h3{margin:0 0 .5em;line-height:1.12;font-weight:800}
h1{font-size:clamp(2rem,5.2vw,3.5rem);font-style:italic;text-transform:uppercase;letter-spacing:-.025em}
h2{font-size:clamp(1.5rem,3vw,2.25rem)}
h3{font-size:1.2rem;font-weight:700}
p{margin:0 0 1rem}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}
.eyebrow{
  font-size:.74rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--txt-3);margin:0 0 .7rem;
}
.lead{color:var(--txt-2);font-size:1.06rem;max-width:62ch}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---- buttons ---- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.85rem 1.5rem;border-radius:999px;font-weight:700;font-size:.95rem;
  text-decoration:none;border:1px solid transparent;transition:.18s ease;white-space:nowrap;
}
.btn-chrome{background:var(--chrome);color:#0A0B0D;box-shadow:0 1px 0 rgba(255,255,255,.5) inset}
.btn-chrome:hover{filter:brightness(1.07);transform:translateY(-1px)}
.btn-ghost{border-color:var(--line-2);color:var(--txt);background:rgba(255,255,255,.03)}
.btn-ghost:hover{border-color:var(--silver);background:rgba(255,255,255,.07)}
.link-arrow{
  display:inline-block;margin-top:.4rem;font-weight:700;font-size:.92rem;
  color:var(--silver);text-decoration:none;border-bottom:1px solid var(--line-2);padding-bottom:2px;
}
.link-arrow::after{content:" \2192"}
.link-arrow:hover{border-color:var(--silver)}

/* ---- header ---- */
.fz-header{
  position:sticky;top:0;z-index:60;background:rgba(10,11,13,.92);
  border-bottom:1px solid var(--line);
}
.fz-nav{display:flex;align-items:center;gap:1rem;min-height:74px}
.fz-brand{display:flex;align-items:center;flex:0 0 auto}
.fz-logo{width:158px;height:auto}
.fz-burger{
  margin-left:auto;display:none;width:44px;height:44px;border-radius:10px;
  background:transparent;border:1px solid var(--line-2);color:var(--txt);cursor:pointer;padding:9px;
}
.fz-menu{margin-left:auto;display:flex;align-items:center;gap:1.4rem}
.fz-menu ul{display:flex;gap:1.05rem;list-style:none;margin:0;padding:0}
/* Scoped to the list on purpose. A bare .fz-menu a also matched the two CTA
   buttons and repainted .btn-chrome's dark label silver, on a silver
   gradient. Invisible, and a screenshot will not show it to you. */
.fz-menu ul a{
  text-decoration:none;font-size:.88rem;font-weight:600;color:var(--txt-2);
  padding:.3rem 0;border-bottom:2px solid transparent;white-space:nowrap;
}
.fz-menu ul a:hover{color:var(--txt)}
.fz-menu ul a[aria-current=page]{color:var(--txt);border-bottom-color:var(--silver)}
.fz-nav-cta{display:flex;gap:.6rem}
.fz-nav-cta .btn{padding:.6rem 1.05rem;font-size:.85rem}

@media (max-width:1180px){
  .fz-burger{display:block}
  .fz-menu{
    position:absolute;left:0;right:0;top:100%;display:none;flex-direction:column;
    align-items:stretch;gap:0;background:#0E1013;border-bottom:1px solid var(--line);
    padding:.5rem 22px 1.2rem;
  }
  .fz-menu.open{display:flex}
  .fz-menu ul{flex-direction:column;gap:0}
  .fz-menu li{border-bottom:1px solid var(--line)}
  .fz-menu a{display:block;padding:.9rem 0;font-size:1rem}
  .fz-nav-cta{padding-top:1rem}
  .fz-nav-cta .btn{flex:1}
}

/* ---- hero ---- */
.hero{position:relative;isolation:isolate;min-height:clamp(380px,52vw,520px);display:flex;align-items:flex-end}
.hero-tall{min-height:clamp(460px,64vw,660px)}
/* Her gym walls are bright green and magenta, which fights the black/silver
   chrome. Pulling saturation on hero backgrounds only keeps the palette
   consistent; card and gallery photos stay full colour. */
.hero-bg{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;
  filter:saturate(.62) contrast(1.06) brightness(.94);
}
.hero-veil{
  position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(10,11,13,.55) 0%,rgba(10,11,13,.35) 35%,rgba(10,11,13,.93) 100%);
}
.hero-inner{padding-top:4.5rem;padding-bottom:3.2rem;width:100%}
.hero h1{max-width:19ch;text-shadow:0 2px 24px rgba(0,0,0,.5)}
.hero-sub{
  font-family:Inter,sans-serif;font-weight:500;font-style:normal;letter-spacing:0;
  font-size:1.05rem;line-height:1.6;color:var(--txt-2);max-width:56ch;margin:.9rem 0 1.6rem;
}
.hero-cta{display:flex;gap:.7rem;flex-wrap:wrap}

/* ---- sections ---- */
.sec{padding:clamp(3rem,7vw,5.5rem) 0}
.sec-alt{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec-head{max-width:70ch;margin-bottom:2.4rem}
.sec-strip{padding:0}
.strip{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line);border-bottom:1px solid var(--line);
}
.strip>div{background:var(--bg);padding:1.5rem 1.2rem;display:flex;flex-direction:column;gap:.15rem}
.strip strong{font-family:Archivo,sans-serif;font-size:1.02rem;font-weight:800}
.strip span{color:var(--txt-3);font-size:.85rem}
@media (max-width:760px){.strip{grid-template-columns:repeat(2,1fr)}}

/* ---- cards ---- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:1.3rem}
.card{
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;display:flex;flex-direction:column;transition:.2s ease;
}
.card:hover{border-color:var(--line-2);transform:translateY(-3px)}
.card img{aspect-ratio:4/3;object-fit:cover;width:100%;background:#0E1013}
.card-body{padding:1.3rem;display:flex;flex-direction:column;gap:.15rem;flex:1}
.card-body p{color:var(--txt-2);font-size:.95rem;flex:1}

/* ---- split ---- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,4vw,3.4rem);align-items:center}
.split-reverse .split-media{order:2}
.split-media img{border-radius:var(--r);border:1px solid var(--line);width:100%;aspect-ratio:4/3;object-fit:cover}
@media (max-width:860px){
  .split{grid-template-columns:1fr}
  .split-reverse .split-media{order:0}
}

/* ---- levels ---- */
.levels{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:2.4rem}
.level{
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r);padding:1.3rem;
  position:relative;
}
.level-n{
  font-family:Archivo,sans-serif;font-style:italic;font-weight:800;font-size:2.4rem;line-height:1;
  background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent;
  display:block;margin-bottom:.4rem;
}
.level h3{margin-bottom:.25rem}
.level p{color:var(--txt-2);font-size:.9rem;margin:0}

/* ---- season facts ---- */
.season{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-bottom:2rem}
.season-item{background:var(--surface-2);padding:1.2rem}
.season-item span{display:block;color:var(--txt-3);font-size:.78rem;text-transform:uppercase;letter-spacing:.13em;margin-bottom:.3rem}
.season-item strong{font-family:Archivo,sans-serif;font-size:1rem}

/* ---- note ---- */
.note{
  border:1px solid var(--line-2);border-left:3px solid var(--silver);border-radius:var(--r);
  background:var(--surface-2);padding:1.4rem 1.5rem;margin:2rem 0;
}
.note h3{margin-bottom:.35rem}
.note p{color:var(--txt-2);font-size:.95rem;margin-bottom:.6rem}
.note p:last-child{margin-bottom:0}

/* ---- price ---- */
.price-card{border:1px solid var(--line-2);border-radius:var(--r);background:var(--surface-2);padding:1.6rem;margin:1.6rem 0;max-width:340px}
.price{font-family:Archivo,sans-serif;font-weight:800;font-style:italic;font-size:2.8rem;line-height:1;margin:0 0 .3rem;
  background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}
.price span{font-size:.95rem;font-style:normal;font-weight:600;color:var(--txt-2);
  -webkit-text-fill-color:var(--txt-2);margin-left:.5rem}
.price-note{color:var(--txt-3);font-size:.9rem;margin-bottom:1.1rem}

.ticks{list-style:none;padding:0;margin:0 0 1.4rem}
.ticks li{padding:.55rem 0 .55rem 1.9rem;position:relative;border-bottom:1px solid var(--line);color:var(--txt-2)}
.ticks li::before{content:"";position:absolute;left:0;top:1.05rem;width:11px;height:6px;
  border-left:2px solid var(--silver);border-bottom:2px solid var(--silver);transform:rotate(-45deg)}
.round{border-radius:var(--r);border:1px solid var(--line)}
.gallery{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.gallery img{border-radius:10px;border:1px solid var(--line);aspect-ratio:1;object-fit:cover;width:100%}
.gallery img:first-child{grid-column:1/-1;aspect-ratio:16/9}

/* ---- quotes ---- */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:1.2rem}
.quote{margin:0;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:1.5rem}
.stars{color:var(--silver);letter-spacing:.18em;font-size:.95rem;margin-bottom:.7rem}
.quote blockquote{margin:0}
.quote p{color:var(--txt-2);font-size:.95rem}
.quote figcaption{font-family:Archivo,sans-serif;font-weight:700;font-size:.9rem;margin-top:.9rem;color:var(--txt)}

/* ---- direct answer blocks (AI citability) ---- */
.answers{max-width:75ch}
.answer{padding:1.5rem 0;border-top:1px solid var(--line)}
.answer:first-child{border-top:0;padding-top:0}
.answer h2{font-size:1.22rem;margin-bottom:.5rem}
.answer p{color:var(--txt-2);margin:0}

/* ---- Jackrabbit ----
   The widget ships its own stylesheet with color:black and an olive
   border, built for a white page. Rather than fight it, every widget sits
   on a light panel. Do NOT darken .jr-panel: the class list disappears. */
.jr-block{margin:2.2rem 0}
.jr-head{margin-bottom:.8rem}
.jr-head h3{margin-bottom:.2rem}
.jr-head p{color:var(--txt-3);font-size:.9rem;margin:0}
.jr-panel{
  background:#F4F5F7;color:#12141A;border:1px solid var(--line-2);
  border-radius:var(--r);padding:.4rem 1.1rem;overflow-x:auto;
}
.jr-panel .jr-container{margin:1.1rem 0 !important}
.jr-panel .responsive-table{color:#12141A;font-family:Inter,sans-serif}
.jr-panel .responsive-table thead th{
  font-family:Archivo,sans-serif;font-weight:700;font-size:.78rem;
  text-transform:uppercase;letter-spacing:.06em;color:#4A505A;
  border-bottom:2px solid #C8CDD5;
}
.jr-panel .responsive-table tbody tr:nth-of-type(even){background:rgba(18,20,26,.045)}
.jr-panel .responsive-table td,.jr-panel .responsive-table th{border-color:#D5D9E0}
.jr-panel .jr-reg-col a{
  display:inline-block;background:#12141A;color:#F4F5F7;text-decoration:none;
  font-family:Archivo,sans-serif;font-weight:700;font-size:.78rem;
  padding:.42rem .95rem;border-radius:999px;white-space:nowrap;
}
.jr-panel .jr-reg-col a:hover{background:#2A2F38}
.jr-panel .jr-header{font-weight:700 !important}
.jr-panel-cal{padding:1.1rem}
.jr-fallback{padding:1.2rem 0;color:#4A505A}
/* A category with nothing scheduled returns a stylesheet and no table, which
   would render as an empty white box. enhance.js swaps in this instead. */
.jr-block.is-empty .jr-panel{
  background:var(--surface-2);color:var(--txt-2);border-style:dashed;
  padding:1.4rem 1.5rem;
}
.jr-empty{margin:0;color:var(--txt-2);font-size:.95rem}
.jr-empty a{color:var(--txt);font-weight:600}

/* ---- contact ---- */
.sec-contact{background:var(--surface);border-top:1px solid var(--line)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,4vw,3rem);align-items:start}
.contact-facts{list-style:none;padding:0;margin:1.4rem 0 0}
.contact-facts li{display:flex;gap:1rem;padding:.75rem 0;border-top:1px solid var(--line);align-items:baseline}
.contact-facts span{
  flex:0 0 62px;color:var(--txt-3);font-size:.76rem;text-transform:uppercase;letter-spacing:.13em;
  font-family:Archivo,sans-serif;font-weight:700;
}
.contact-facts a{font-weight:600;text-decoration:none;border-bottom:1px solid var(--line-2)}
.contact-form{background:#fff;border-radius:var(--r);border:1px solid var(--line-2);overflow:hidden;min-height:520px}
.contact-form iframe{min-height:520px;display:block}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr}}

/* ---- footer ---- */
.fz-footer{background:#08090B;border-top:1px solid var(--line);padding-top:3.2rem}
.fz-foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:2.2rem;padding-bottom:2.6rem}
.fz-foot-logo{width:150px;margin-bottom:1rem}
.fz-foot-blurb{color:var(--txt-3);font-size:.92rem;max-width:38ch}
.fz-foot-h{font-size:.78rem;text-transform:uppercase;letter-spacing:.15em;color:var(--txt-3);margin-bottom:.9rem}
.fz-foot-links{list-style:none;padding:0;margin:0}
.fz-foot-links li{margin-bottom:.5rem}
.fz-foot-links a,.fz-footer address a{color:var(--txt-2);text-decoration:none;font-size:.93rem}
.fz-foot-links a:hover,.fz-footer address a:hover{color:var(--txt)}
.fz-footer address{font-style:normal;margin-bottom:.8rem;font-size:.93rem}
.fz-foot-phone{font-family:Archivo,sans-serif;font-weight:800;font-size:1.15rem;text-decoration:none}
.fz-foot-cta{display:flex;gap:.6rem;margin-top:1.1rem;flex-wrap:wrap}
.fz-foot-cta .btn{padding:.6rem 1.1rem;font-size:.85rem}
.fz-legal{
  border-top:1px solid var(--line);padding-top:1.3rem;padding-bottom:1.6rem;
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
}
.fz-legal p{margin:0;color:var(--txt-3);font-size:.85rem}
.fz-legal a{color:var(--txt-3);text-decoration:none}
.fz-legal a:hover{color:var(--txt-2)}
@media (max-width:820px){.fz-foot-grid{grid-template-columns:1fr;gap:2rem}}

/* ---- legal prose ---- */
.sec-legal{padding-top:3rem}
.prose{max-width:76ch}
.prose h1{font-size:clamp(1.8rem,4vw,2.6rem)}
.prose h2{font-size:1.05rem;font-weight:600;font-family:Inter,sans-serif;color:var(--txt-2);
  letter-spacing:0;line-height:1.6;margin:0 0 2rem;max-width:66ch}
.prose h3{margin-top:2rem;font-size:1.08rem}
.prose p{color:var(--txt-2);font-size:.97rem}
.updated{color:var(--txt-3);font-size:.85rem;margin-bottom:1.6rem}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important;scroll-behavior:auto !important}
}