/* QuickServe - visual polish layer, added 29 August 2026.
   Additive only: deleting the <link> in index.html restores the
   previous appearance exactly. */

:root{
  --qs-body:#a6c2b0;
  --qs-line:rgba(255,255,255,0.075);
  --qs-line-hot:rgba(200,230,0,0.28);
  --qs-surface:linear-gradient(180deg,rgba(255,255,255,0.038) 0%,rgba(255,255,255,0.012) 100%);
  --qs-surface-hot:linear-gradient(180deg,rgba(200,230,0,0.075) 0%,rgba(200,230,0,0.015) 100%);
  --qs-shadow:0 24px 48px -28px rgba(0,0,0,0.9),0 2px 6px -2px rgba(0,0,0,0.5);
  --qs-ease:cubic-bezier(.22,.61,.36,1);
}

/* 1. RHYTHM */
section{padding-block:clamp(64px,7.5vw,108px)}
section[id]{scroll-margin-top:92px}
#hero{padding-block:clamp(104px,11vw,132px) clamp(56px,6vw,76px)}

/* 2. TYPE */
h2{line-height:0.92;letter-spacing:0.015em}
.section-label{letter-spacing:0.2em;font-size:0.7rem}
.section-intro{max-width:60ch;color:var(--qs-body);font-size:1rem;line-height:1.7}
.hero-sub{max-width:46ch;color:var(--qs-body)}
.product-card p,.step p,.feature-text p,.ball-detail,.value-card p,
.perk-sub,.lc-detail,.footer-tagline,.sb p,.sb ul li{color:var(--qs-body)}

/* 3. SURFACES */
.ball-card,.product-card,.step,.value-card,.launch-card,.perk,
.feature-item,.ball-intro-card,.info-box,.contact-form,.cii{
  background-image:var(--qs-surface);
  border-color:var(--qs-line);
  transition:transform .4s var(--qs-ease),box-shadow .4s var(--qs-ease),
             border-color .3s,background-image .3s;
}
.ball-card:hover,.product-card:hover,.step:hover,
.value-card:hover,.launch-card:hover,.perk:hover{
  transform:translateY(-4px);
  box-shadow:var(--qs-shadow);
  border-color:var(--qs-line-hot);
  background-image:var(--qs-surface-hot);
}
.ball-card::before,.product-card::before{height:2px;z-index:2}

/* 4. CONTROLS */
.btn-primary,.nav-cta,.form-submit{
  transition:transform .25s var(--qs-ease),box-shadow .25s var(--qs-ease),background .2s;
}
.btn-primary:hover,.nav-cta:hover,.form-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 34px -12px rgba(200,230,0,0.5);
}
.btn-primary:active,.nav-cta:active,.form-submit:active{transform:translateY(0)}
.btn-outline{transition:transform .25s var(--qs-ease),border-color .25s,background .25s}
.btn-outline:hover{transform:translateY(-2px)}
input:focus,select:focus,textarea:focus{
  border-color:var(--ball);
  box-shadow:0 0 0 3px rgba(200,230,0,0.14);
  outline:none;
}

/* 5. NAV */
nav{box-shadow:0 18px 36px -32px rgba(0,0,0,0.95)}

/* 6. ACCESSIBILITY */
a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--ball);
  outline-offset:3px;
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
    scroll-behavior:auto!important;
  }
  .ticker-track{animation:none!important}
}

/* 7. DETAIL */
::selection{background:var(--ball);color:var(--night)}
html{scrollbar-color:rgba(200,230,0,0.35) var(--night)}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-track{background:var(--night)}
*::-webkit-scrollbar-thumb{background:rgba(200,230,0,0.25);border:2px solid var(--night);border-radius:8px}
*::-webkit-scrollbar-thumb:hover{background:rgba(200,230,0,0.45)}
img,svg{max-width:100%}
.reveal,.reveal-l,.reveal-r{transition-timing-function:var(--qs-ease);transition-duration:.7s}

/* 8. CLUB DASHBOARD */
.qs-card,.qs-stat-card{
  background-image:var(--qs-surface);
  border-color:var(--qs-line);
  transition:border-color .3s,box-shadow .3s;
}
.qs-card:hover,.qs-stat-card:hover{border-color:var(--qs-line-hot);box-shadow:var(--qs-shadow)}
.qs-note{
  font-size:0.74rem;line-height:1.6;color:var(--dim);
  border-left:2px solid rgba(200,230,0,0.3);
  padding:2px 0 2px 12px;margin-top:14px;
}
.qs-note strong{color:var(--qs-body);font-weight:600}

/* 9. NARROW SCREENS */
@media (max-width:640px){
  section{padding-inline:6%}
  .section-intro{font-size:0.95rem}
}


/* ── 10. PARTNER ANALYTICS MOCKUP ──────────────────────────
   The mini dashboard was setting Bebas Neue, a condensed display
   face, at 11px with wide tracking for its UI labels, which is what
   made this block read as a different design to the rest of the
   page. Display type is now reserved for the big numbers, and the
   labels use the same DM Sans small-caps treatment as .section-label
   everywhere else. Sizes lifted off 7.5-9px, which was below
   comfortable reading. */
.mini-screen-title{
  font-family:'DM Sans',sans-serif!important;
  font-size:0.62rem!important;
  font-weight:700!important;
  letter-spacing:0.18em!important;
  text-transform:uppercase;
  color:rgba(200,230,0,0.75)!important;
}
.mini-stat-l{
  font-family:'DM Sans',sans-serif;
  font-size:0.58rem!important;
  font-weight:600!important;
  letter-spacing:0.12em!important;
  text-transform:uppercase;
  color:rgba(166,194,176,0.85)!important;
}
.mini-stat-v{
  font-size:1.45rem!important;
  letter-spacing:0.02em!important;
  line-height:1.05!important;
}
.mini-stat-s{
  font-size:0.56rem!important;
  letter-spacing:0.02em!important;
  opacity:0.95;
}
.mini-chart-label{
  font-family:'DM Sans',sans-serif;
  font-size:0.58rem!important;
  font-weight:600!important;
  letter-spacing:0.14em!important;
  text-transform:uppercase;
  color:rgba(166,194,176,0.8)!important;
}

/* ── 11. PARTNER ANALYTICS COPY BLOCK ──────────────────────*/
.mini-dash-copy h3{line-height:0.9;letter-spacing:0.02em;margin-bottom:18px}
.mini-dash-copy p{max-width:46ch;color:var(--qs-body)}
.mini-dash-list li{color:var(--qs-body);line-height:1.75}

/* ── 12. PERK CARDS ────────────────────────────────────────
   The five club-benefit cards were wrapping three-deep in a narrow
   column at a size that was hard to scan. */
.perk-label{font-size:0.95rem!important;letter-spacing:0.01em}
.perk-sub{font-size:0.78rem!important;line-height:1.6!important;max-width:22ch;margin-left:auto;margin-right:auto}
.perk{padding-block:26px}


/* ===== QS-V2-BRIDGE : site-wide brand alignment (nav, footer, static pages, club dashboard) ===== */
:root{--ball:#C3DB2E;--night:#101711;--night2:#18211A;--chalk:#FAF9F5;--dim:#9AA396;--qs-lime-hi:#DCF04F;--qs-lime-deep:#93A821;--qs-teal:#0E3B2E;--qs-paper-2:#F1F1E8;--qs-rule-d:rgba(255,255,255,.09);--qs-amber:#E2A621;--qs-court:#1668C4;--qs-ease:cubic-bezier(.22,.61,.36,1)}
h1,h2,h3,h4,h5,.logo-text,.stat-num,.step-num,.ball-price,.qs-stat-v,.qs-big,.qs-num{font-family:'Inter Tight','DM Sans',system-ui,-apple-system,sans-serif!important;letter-spacing:-.02em!important}
h1,h2{font-weight:800!important}
body{background:var(--night)}
#existing-club-root,#qs-ltc-root,#clubs-root{background-image:radial-gradient(80% 60% at 88% 0%,rgba(22,104,196,.13) 0%,transparent 58%),radial-gradient(70% 60% at 4% 96%,rgba(14,59,46,.5) 0%,transparent 60%)}
.qs-card,.qs-stat-card{background-image:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012))!important;border-color:rgba(255,255,255,.085)!important;transition:border-color .3s,box-shadow .35s var(--qs-ease),transform .35s var(--qs-ease)}
.qs-card:hover,.qs-stat-card:hover{border-color:rgba(195,219,46,.32)!important;box-shadow:0 26px 52px -30px rgba(0,0,0,.85);transform:translateY(-3px)}
.qs-stat-v{color:var(--ball)!important}
.qs-note{font-size:.74rem;line-height:1.62;color:var(--dim);border-left:2px solid rgba(195,219,46,.35);padding:3px 0 3px 13px;margin-top:15px}
.qs-note strong{color:#C6D0C2;font-weight:600}
.qs-paid-banner{border-radius:0!important;background-image:linear-gradient(90deg,rgba(195,219,46,.14),rgba(195,219,46,.03))!important;border-left:3px solid var(--ball)!important}
table th{font-size:.6rem!important;letter-spacing:.13em!important;text-transform:uppercase!important;color:var(--dim)!important;font-weight:600!important}
a{transition:color .22s var(--qs-ease)}
::selection{background:var(--ball);color:var(--night)}

/* dashboard: display face needs its weight when applied inline */
[style*="Inter Tight"]{font-weight:800!important;letter-spacing:-.02em!important}
.qs-card,.qs-stat-card,#existing-club-root,#qs-ltc-root,#clubs-root{font-family:'DM Sans',system-ui,-apple-system,sans-serif}
#existing-club-root table,#qs-ltc-root table{font-variant-numeric:tabular-nums}
