/* Pro Club Manager marketing site — black / cream / indigo (boilerplate 2 Nov 2026) */
:root{--bg:#000000;--surface:#121212;--ink:#f4f1e8;--muted:#b9b5aa;--line:#2a2a2a;
  /* ACCENT — indigo #6366F1 (swatch shown to Steve 2 Nov 2026) / button hover darker #4F46E5 for white-text contrast; light tint #818CF8 for text on black. One-line swap here */
  --accent:#6366F1;--accent-hover:#4F46E5;--accent-rgb:99,102,241;
  /* Lighter tint of the accent for text/links on black (contrast >= 4.5:1) */
  --accent-text:#818CF8;--accent-text-hover:#A5B4FC;
  --on-accent:#ffffff}
html,body{background:var(--bg);color:var(--ink)}
body{font-family:'Sansation',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;min-height:100vh;display:flex;flex-direction:column;margin:0}
img{max-width:100%;height:auto}
a{color:var(--accent-text)}a:hover{color:var(--accent-text-hover)}
a:focus-visible,.btn:focus-visible{outline:2px solid var(--accent-text);outline-offset:3px}

/* Skip link */
.skip-link{position:absolute;left:-9999px;top:0;background:var(--accent);color:var(--on-accent);padding:.5rem 1rem;z-index:10000;font-weight:700}
.skip-link:focus{left:.75rem;top:.75rem;color:var(--on-accent)}

/* Navbar (Pro Club Manager equivalent of navbar-touchline) */
.navbar-pcm{background:rgba(0,0,0,.92)!important;backdrop-filter:blur(10px);border-bottom:1px solid rgba(var(--accent-rgb),.25);padding-top:calc(.7rem - 4px);padding-bottom:calc(.7rem - 4px);z-index:1030}
.navbar-pcm .container{display:flex;flex-wrap:wrap;align-items:center}
.navbar-pcm .navbar-brand{display:flex;align-items:center;flex:1 1 0%;min-width:0;min-height:48px;margin-right:.5rem;padding:0}
.navbar-pcm .navbar-brand img{width:auto;height:48px;max-height:48px;max-width:100%;object-fit:contain;object-position:left center} /* suite nav logo: shared 48px; nav PNG tight-cropped incl. g descender (20261102crop) */
.navbar-pcm .navbar-toggler{flex:0 0 2.75rem;width:2.75rem;display:inline-flex;align-items:center;justify-content:center;padding-left:0;padding-right:0;border-color:rgba(244,241,232,.35)}
.navbar-pcm .navbar-toggler:focus{box-shadow:0 0 0 .2rem rgba(var(--accent-rgb),.4)}
.navbar-pcm .navbar-toggler-icon{margin:0 auto;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(244, 241, 232, 0.92)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")}
.navbar-pcm .nav-link{color:var(--muted)!important;font-weight:500;padding:.5rem .85rem!important;border-radius:.4rem}
.navbar-pcm .nav-link:hover,.navbar-pcm .nav-link:focus-visible{color:var(--accent-text)!important}
.navbar-pcm .nav-link.active,.navbar-pcm .nav-link[aria-current="page"]{color:var(--ink)!important;box-shadow:inset 0 -2px 0 var(--accent)}
@media (max-width:991.98px){
  .navbar-pcm .navbar-collapse{flex-basis:100%;width:100%}
  .navbar-pcm .navbar-collapse .navbar-nav{align-items:stretch!important;padding-top:.5rem;padding-bottom:.75rem}
  .navbar-pcm .navbar-collapse .nav-link{padding-left:.25rem!important;padding-right:.25rem!important}
  .navbar-pcm .navbar-collapse .nav-link.active,.navbar-pcm .navbar-collapse .nav-link[aria-current="page"]{box-shadow:inset 3px 0 0 var(--accent);padding-left:.75rem!important}
  .navbar-pcm .navbar-collapse .btn{margin-top:.35rem;width:100%}
}
@media (min-width:992px){
  .navbar-pcm .navbar-toggler{display:none}
  .navbar-pcm .navbar-brand{flex:0 1 auto}
  .navbar-pcm .navbar-brand img{max-width:none}
  .navbar-pcm .container{flex-wrap:nowrap}
}

/* Buttons */
.btn-pcm{background-color:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:700;padding:.5rem 1.1rem;border-radius:.5rem}
.btn-pcm:hover,.btn-pcm:focus-visible{background-color:var(--accent-hover);border-color:var(--accent-hover);color:var(--on-accent)}
.btn-coming-soon,.btn-coming-soon:disabled{cursor:not-allowed;pointer-events:none}
.btn.btn-coming-soon:disabled{opacity:.85;background-color:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.coming-soon-label{display:inline-block;margin-left:.5rem;padding:.1rem .5rem;border-radius:999px;font-size:.7em;font-weight:700;letter-spacing:.03em;text-transform:uppercase;background:#000;color:var(--ink);vertical-align:middle}

/* Holding page (home + 404) */
main.holding{flex:1;padding:3rem 1.25rem 2rem;text-align:center}
.hero{width:100%;max-width:100%;height:auto;margin:0 auto 1.75rem;display:block}
/* MuddyStuds brand credit — right-aligned under the hero wordmark (30/1221 inset matches the artwork padding) */
.hero-brand{width:100%;max-width:100%;margin:0 auto 1.75rem}
.hero-brand .hero{margin:0 auto}
.from-muddystuds{display:flex;justify-content:flex-end;margin:.1rem 0 0;padding-right:0} /* hero lockup is tight-cropped (20261102lock) */
.from-muddystuds a{display:inline-flex;align-items:center;gap:.4rem;color:var(--muted);text-decoration:none;opacity:.9;transition:opacity .15s ease}
.from-muddystuds a:hover,.from-muddystuds a:focus-visible{opacity:1;color:var(--ink)}
.from-muddystuds-label{font-size:.95rem;font-weight:500;letter-spacing:.02em;text-transform:lowercase;line-height:1}
.from-muddystuds-mark{display:block;height:48px;width:auto}
@media (max-width:575.98px){.from-muddystuds-mark{height:36px}.from-muddystuds-label{font-size:.9rem}}
.tag{font-size:clamp(1.25rem,3.2vw,1.7rem);font-weight:700;margin:0 auto 1rem;max-width:36ch}
.lead-copy{color:var(--muted);font-size:1.05rem;max-width:60ch;margin:0 auto 1.5rem}
.soon{display:inline-block;background:var(--accent);color:var(--on-accent);font-weight:700;padding:.55rem 1.1rem;border-radius:999px;margin-bottom:2rem;letter-spacing:.02em}
a.soon:hover{color:var(--on-accent);background:var(--accent-hover)}
.features{list-style:none;padding:0;margin:0 auto 2rem;max-width:720px}
.features li>div{border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:12px;padding:1rem;height:100%;text-align:left;background:var(--surface)}
.features h2{font-size:1rem;font-weight:700;color:var(--accent-text);margin:0 0 .35rem}
.features p{margin:0;color:var(--muted);font-size:.95rem}
.free{color:var(--ink);max-width:60ch;margin:0 auto 1.25rem}
.who{color:var(--muted)}

/* Legal pages */
.legal-page{flex:1;padding:3rem 0 4rem}
.legal-page h1{font-weight:700;margin-bottom:.5rem}
.legal-meta{color:var(--muted);font-size:.95rem;margin-bottom:2rem}
.legal-content{background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:1rem;padding:2rem 1.75rem}
.legal-content h2{font-size:1.2rem;font-weight:700;margin-top:1.75rem;margin-bottom:.65rem;color:var(--ink)}
.legal-content h2:first-child{margin-top:0}
.legal-content p,.legal-content li{color:var(--muted)}
.legal-content ul{padding-left:1.2rem}
.legal-disclaimer{margin-top:2rem;padding:1rem 1.15rem;border-left:3px solid var(--accent);background:rgba(var(--accent-rgb),.08);color:var(--muted);font-size:.9rem;border-radius:0 .5rem .5rem 0}
.text-cream{color:var(--ink)!important}
@media (max-width:575.98px){.legal-content{padding:1.5rem 1.15rem}}

/* Footer */
.site-footer{background:#050505;border-top:1px solid var(--line);padding:2rem 0 1.75rem;color:var(--muted);font-size:.9rem}
.site-footer a{color:var(--muted)}
.site-footer a:hover{color:var(--accent-text)}
.footer-brand{font-weight:700;color:var(--ink);margin-bottom:.35rem}

/* Brand breathing room (20261029m1) */
.navbar-pcm .navbar-brand{margin-right:1.5rem;padding-right:.25rem}
@media (max-width:1199.98px){.navbar-pcm .navbar-brand{margin-right:1rem}}

/* Static nav: shadow only on scroll */
.navbar-pcm{transition:box-shadow 280ms ease}
@media (prefers-reduced-motion:reduce){.navbar-pcm{transition:none}}



/* ===== Pro Club Manager additions (own stamp: indigo glow, tiered club diagram, card grid) ===== */
.text-muted-brand{color:var(--muted)!important}
.btn-outline-cream{border:1px solid rgba(244,241,232,.45);color:var(--ink);font-weight:700;padding:.5rem 1.1rem;border-radius:.5rem;background:transparent}
.btn-outline-cream:hover,.btn-outline-cream:focus-visible{border-color:var(--accent-text);color:var(--accent-text);background:rgba(var(--accent-rgb),.08)}
.pcm-hero{position:relative;padding:3.5rem 0 3rem;overflow:hidden}
.pcm-hero::before{content:"";position:absolute;inset:-30% -10% auto auto;width:70%;height:120%;background:radial-gradient(closest-side,rgba(var(--accent-rgb),.28),transparent 70%);pointer-events:none}
.pcm-hero .container{position:relative}
.pcm-hero .hero-brand{max-width:720px;margin:0 0 2rem}
.pcm-hero .from-muddystuds{justify-content:flex-end;padding-right:0;margin-top:.5rem}
.pcm-hero h1{font-weight:700;font-size:clamp(2rem,5vw,3.25rem);line-height:1.08;letter-spacing:-.01em;margin-bottom:1rem}
.pcm-hero h1 .hl{color:var(--accent-text)}
.pcm-hero .lead{color:var(--muted);font-size:1.12rem;max-width:56ch}
.eyebrow{display:inline-block;font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-text);background:rgba(var(--accent-rgb),.12);border:1px solid rgba(var(--accent-rgb),.35);padding:.25rem .7rem;border-radius:999px;margin-bottom:1rem}
.hero-points{list-style:none;padding:0;margin:1.25rem 0 0;color:var(--ink)}
.hero-points li{margin:.35rem 0}.hero-points i{color:var(--accent-text);width:1.4rem}

/* Hero mock: a stylised club dashboard card (no screenshots yet) */
.mock{background:linear-gradient(180deg,#15152a,#0d0d18);border:1px solid rgba(var(--accent-rgb),.35);border-radius:1.25rem;padding:1.1rem;box-shadow:0 30px 80px rgba(var(--accent-rgb),.18);text-align:left;max-width:420px;margin:0 auto}
.mock-top{display:flex;align-items:center;gap:.6rem;margin-bottom:.9rem}
.mock-top img{width:34px;height:34px}
.mock-top strong{display:block;font-size:1rem}.mock-top span{color:var(--muted);font-size:.8rem}
.mock-row{display:flex;gap:.75rem;align-items:flex-start;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:.8rem;padding:.65rem .75rem;margin-bottom:.55rem}
.mock-row i{color:var(--accent-text);margin-top:.2rem;width:1.1rem;text-align:center}
.mock-row b{display:block;font-size:.9rem}.mock-row small{color:var(--muted);font-size:.78rem}
.mock-pill{margin-left:auto;font-size:.7rem;font-weight:700;background:var(--accent);color:#fff;border-radius:999px;padding:.1rem .5rem;white-space:nowrap;align-self:center}
.mock-pill.ok{background:#2e7d32}

.section{padding:4rem 0}
.section-alt{background:#07070d;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-title{font-weight:700;font-size:clamp(1.6rem,3.5vw,2.2rem);margin-bottom:.6rem;text-transform:none;letter-spacing:0;color:var(--ink)}
.section-sub{color:var(--muted);max-width:62ch;margin-bottom:2rem;font-size:1.05rem}
.feature-card{background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:1rem;padding:1.4rem;height:100%;transition:transform .15s ease,border-color .15s ease}
.feature-card:hover{transform:translateY(-3px);border-color:rgba(var(--accent-rgb),.55)}
.feature-icon{width:46px;height:46px;border-radius:.8rem;display:inline-flex;align-items:center;justify-content:center;background:rgba(var(--accent-rgb),.15);color:var(--accent-text);font-size:1.25rem;margin-bottom:.9rem}
.feature-card h3{font-size:1.1rem;font-weight:700;margin-bottom:.4rem}
.feature-card p{color:var(--muted);margin:0;font-size:.95rem}
@media (prefers-reduced-motion:reduce){.feature-card{transition:none}.feature-card:hover{transform:none}}

/* Club hierarchy diagram */
.tiers{display:flex;flex-direction:column;align-items:center;gap:.9rem}
.tier{background:var(--surface);border:1px solid var(--line);border-radius:1rem;padding:1rem 1.2rem;width:100%;text-align:center;position:relative}
.tier h3{font-size:1.05rem;font-weight:700;margin:0 0 .2rem}.tier p{margin:0;color:var(--muted);font-size:.9rem}
.tier-club{max-width:100%;border:1px solid var(--accent);background:linear-gradient(180deg,rgba(var(--accent-rgb),.22),rgba(var(--accent-rgb),.06))}
.tier-teams{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;width:100%}
.tier-teams .tier{border-top:3px solid var(--accent)}
.tier-people{max-width:100%;border-style:dashed}
.tier-link{width:2px;height:18px;background:rgba(var(--accent-rgb),.6)}
@media (max-width:575.98px){.tier-teams{grid-template-columns:1fr}}
.check-list{list-style:none;padding:0;margin:0}
.check-list li{padding-left:1.8rem;position:relative;margin:.65rem 0;color:var(--muted)}
.check-list li strong{color:var(--ink)}
.check-list li::before{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:0;top:.05rem;color:var(--accent-text)}

/* Roles table */
.roles{width:100%;border-collapse:separate;border-spacing:0;background:var(--surface);border:1px solid var(--line);border-radius:1rem;overflow:hidden;font-size:.95rem}
.roles th,.roles td{padding:.8rem 1rem;border-bottom:1px solid var(--line);vertical-align:top}
.roles thead th{background:rgba(var(--accent-rgb),.14);color:var(--ink);font-weight:700}
.roles td{color:var(--muted)}.roles td:first-child{color:var(--ink);font-weight:700;white-space:nowrap}
.roles tr:last-child td{border-bottom:0}

/* Plans */
.plan{background:var(--surface);border:1px solid var(--line);border-radius:1rem;padding:1.5rem;height:100%;display:flex;flex-direction:column}
.plan.featured{border:1px solid var(--accent);box-shadow:0 0 0 1px rgba(var(--accent-rgb),.4),0 20px 50px rgba(var(--accent-rgb),.15)}
.plan .plan-tag{font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text)}
.plan h3{font-weight:700;font-size:1.35rem;margin:.3rem 0 .3rem}
.plan .price-soon{color:var(--ink);font-weight:700;margin-bottom:1rem}
.plan .check-list{flex:1}

/* Suite */
.suite-card{display:block;background:var(--surface);border:1px solid var(--line);border-radius:1rem;padding:1.2rem;height:100%;text-decoration:none;color:var(--ink);border-left:4px solid var(--suite,#888)}
.suite-card:hover{border-color:var(--suite,#888);color:var(--ink)}
.suite-card h3{font-size:1.05rem;font-weight:700;margin:0 0 .3rem}.suite-card p{color:var(--muted);margin:0;font-size:.92rem}

/* FAQ */
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:.8rem;padding:1rem 1.2rem;margin-bottom:.7rem}
.faq summary{cursor:pointer;font-weight:700;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--accent-text);font-size:1.3rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{color:var(--muted);margin:.7rem 0 0}

/* CTA band */
.cta-band{background:linear-gradient(120deg,#4F46E5,#6366F1 55%,#818CF8);border-radius:1.25rem;padding:2.5rem 1.5rem;text-align:center;color:#fff}
.cta-band h2{font-weight:700;font-size:clamp(1.5rem,3.4vw,2rem);margin-bottom:.5rem}
.cta-band p{color:rgba(255,255,255,.9);max-width:56ch;margin:0 auto 1.4rem}
.btn-cta-white{background:#fff;color:#1e1b4b;font-weight:700;padding:.6rem 1.25rem;border-radius:.5rem;border:0}
.btn-cta-white:hover,.btn-cta-white:focus-visible{background:#EEF2FF;color:#1e1b4b}

.suite{color:var(--muted);font-size:.85rem;margin-top:.5rem}.suite a{color:var(--muted)}
.navbar-pcm .nav-link.active,.navbar-pcm .nav-link[aria-current="page"]{box-shadow:inset 0 -2px 0 var(--accent)}
section[id]{scroll-margin-top:80px}
.pcm-hero h1 .hl{white-space:nowrap}


/* Suite container parity: same width as Touchline (Bootstrap .container, 1320px @xxl, 12px gutters) (20261102cw) */
main.holding{padding-left:calc(var(--bs-gutter-x,1.5rem)*.5);padding-right:calc(var(--bs-gutter-x,1.5rem)*.5)}
.features,.audiences{max-width:none}
/* Suite lockup (t584u/t585u): ring = 48px like every suite nav; the 'g' descender hangs 5.5px below it, so the
   image is 53.5px tall and the extra is pulled back out of the flow to keep the ring centred in the bar (20261102ring) */
.navbar-pcm .navbar-brand img{height:53.5px;max-height:53.5px;margin-bottom:-5.5px}