/* ============================================================================
   bw_csuite1.css  .  CSUITE-1 THE C-SUITE CUT, PART 1: THE LIGHT PAGES (Opus 5.5 lane, Oct 17 2026)
   ----------------------------------------------------------------------------
   The dress of the three light pages, implemented against the Fable desk renders (BITWORD_DESIGN_SYSTEM.md;
   HOME_CSUITE_desktop/_phone, SITE_BOARD_CSUITE, SITE_FANCLUBS_CSUITE). Dress only: every page keeps its live
   wording, content and section order. Each page opts in with one body class (cs1-home, cs1-board, cs1-fan), so
   nothing here can touch any other page. Color law: mint #3ddc97 = action and LIVE only; gold #d8b36a = the
   seat and RESERVED only; navy header/footer. Gates: em-dash 0, en-dash 0.
   ============================================================================ */
html body.cs1{font-family:Poppins,-apple-system,"Segoe UI",system-ui,Roboto,Helvetica,Arial,sans-serif!important;
  background:#f5f7fa;color:#33415b;-webkit-font-smoothing:antialiased}
body.cs1 input,body.cs1 button,body.cs1 select,body.cs1 textarea{font-family:inherit}

/* ---------------------------------------------------------------- HOME --- */
body.cs1-home .wrap{max-width:1012px;padding:26px 16px 72px}
body.cs1-home .whatis{background:#fff;border:1px solid #e4e9f1;border-inline-start:4px solid #3ddc97;border-radius:12px;
  padding-block:15px 14px;padding-inline:18px 20px;margin:0 0 16px;font-size:14px;line-height:20px;color:#33415b}
body.cs1-home .whatis .l1,body.cs1-home .whatis .l2{display:inline}
body.cs1-home .whatis b{color:#1f2940;font-weight:600}
body.cs1-home .whatis .l2{color:#33415b;margin:0}
body.cs1-home .srch{margin-top:0}
body.cs1-home .srch input{height:51px;border:1px solid #e4e9f1;border-radius:12px;padding-block:0 0;padding-inline:44px 16px;font-size:14px;color:#1f2940;
  background-color:#fff;background-position:18px center;background-size:17px 17px;box-shadow:0 1px 3px rgba(16,24,40,.05)}
body.cs1-home .srch input::placeholder{color:#8a94a6;opacity:1}
body.cs1-home .srch input:focus{border-color:#3ddc97;box-shadow:0 0 0 4px rgba(61,220,151,.16)}
body.cs1-home .sres{border-color:#e4e9f1;border-radius:12px;box-shadow:0 8px 24px rgba(16,24,40,.08)}
body.cs1-home .sgrp{font-size:10.5px;font-weight:600;letter-spacing:1.4px;color:#8a94a6}
body.cs1-home .sitem{color:#1f2940;border-top-color:#eef1f6}
body.cs1-home .sitem .snm{font-weight:600}
body.cs1-home .sitem .smeta{color:#8a94a6}
body.cs1-home .place{margin:10px 0 0;font-size:12.5px;line-height:20px;color:#8a94a6}
body.cs1-home .place .bwPlaceName{font-weight:600;color:#1f2940}
body.cs1-home .place a{color:#2bb886;font-weight:600;margin-inline-start:0}

/* the one card shell: white, hairline, radius 14, the quiet shadow; the 4px mint accent bar is inset (16px) */
body.cs1-home .door,html body.cs1-home .bww3card{position:relative;background:#fff;border:1px solid #e4e9f1;border-top:1px solid #e4e9f1;
  border-radius:14px;padding:24px 24px 20px 24px;margin-top:16px;box-shadow:0 1px 3px rgba(16,24,40,.05)}
body.cs1-home .door::before,html body.cs1-home .bww3card::before,body.cs1-home .bwcn-start::before{content:"";position:absolute;inset-inline-start:0;top:16px;bottom:16px;
  width:4px;border-start-start-radius:0;border-start-end-radius:3px;border-end-end-radius:3px;border-end-start-radius:0;background:#3ddc97}
html body.cs1-home .bww3card .eye{font-size:10.5px;line-height:16px;font-weight:600;letter-spacing:1.85px;text-transform:uppercase;color:#8a94a6}
html body.cs1-home .bww3card .nm{font-size:27px;line-height:36px;font-weight:600;color:#1f2940;letter-spacing:0;margin:5px 0 7px}
html body.cs1-home .bww3card .dashln{font-size:13px;line-height:20px;font-weight:600;margin:0 0 13px}
html body.cs1-home .bww3card .dashln a{color:#2bb886;font-weight:600}
html body.cs1-home .bww3door{background:#f7f9fc;border:1px solid #eef1f6;border-radius:10px;padding:15px 18px 13px;margin-top:14px;color:#33415b}
html body.cs1-home .bww3card .bww3door:first-of-type{margin-top:0}
html body.cs1-home .bww3door .dh{font-size:15px;line-height:22px;font-weight:600;color:#1f2940}
html body.cs1-home .bww3door .ds{font-size:13px;line-height:20px;color:#8a94a6;margin-top:4px}
html body.cs1-home .bww3door .dgo{color:#2bb886;font-weight:600;font-size:13px;line-height:20px;margin-top:7px;display:block}
/* the claim box for a visitor with no @name (same shell, same accent law) */
body.cs1-home .door .clab{font-size:15px;font-weight:600;color:#1f2940;margin-bottom:10px}
body.cs1-home .field{border:1px solid #e4e9f1;border-radius:12px}
body.cs1-home .field:focus-within{border-color:#3ddc97;box-shadow:0 0 0 4px rgba(61,220,151,.16)}
body.cs1-home .field .at{font-weight:600;color:#2bb886}
body.cs1-home .field input{font-weight:400;color:#1f2940}
body.cs1-home .res.ok{color:#13865c}
body.cs1-home .res a,body.cs1-home .small a{color:#2bb886;font-weight:600}
body.cs1-home .btn{display:inline-flex;align-items:center;justify-content:center;width:auto;min-width:0;height:43px;padding:0 26px;border-radius:999px;
  background:#3ddc97;color:#0b1622;font-weight:700;font-size:14px;box-shadow:none;border:0}
body.cs1-home .door .btn{display:flex;width:100%;margin-top:14px}
body.cs1-home .small{font-size:12.5px;color:#8a94a6}

/* shelves */
body.cs1-home .shelf{margin-top:30px}
body.cs1-home .shelf .sh{align-items:flex-start;margin:0 0 12px}
body.cs1-home .shelf .sh h2{font-size:17px;line-height:24px;font-weight:600;color:#1f2940;letter-spacing:0}
body.cs1-home .shelf .sh .shn{font-size:12px;line-height:18px;font-weight:400;color:#8a94a6;margin-top:0}
body.cs1-home .shelf .sh>a{font-size:13px;line-height:24px;font-weight:600;color:#2bb886}
body.cs1-home .cards{display:grid;grid-auto-flow:row;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-columns:auto;gap:14px;overflow:visible;padding:0}
body.cs1-home .cards>.card:only-child{grid-column:1/-1}
body.cs1-home .card{position:relative;background:#fff;border:1px solid #e4e9f1;border-radius:14px;padding:17px 18px 17px 18px;color:#33415b;
  box-shadow:0 1px 3px rgba(16,24,40,.05)}
body.cs1-home .card .cn{font-size:16px;line-height:25px;font-weight:600;color:#1f2940;padding-inline-end:46px}
body.cs1-home .card .cm{font-size:13px;line-height:20px;color:#64748b;margin-top:0}
body.cs1-home .card .cn+.cm{font-size:12.5px;color:#9ca4b4;margin-top:2px}
body.cs1-home .card .cm+.cm{color:#64748b}
body.cs1-home .cards>.card:only-child .cn{padding-inline-end:0}
body.cs1-home .card .cn + .cm:last-child{margin-bottom:0}
/* country: a small bordered chip, top right (the big gray circles die) */
body.cs1-home .card .cfl{position:absolute;top:15px;inset-inline-end:14px;margin:0;display:block}
body.cs1-home .cs1cc{display:inline-flex;align-items:center;justify-content:center;height:23px;min-width:34px;padding:0 7px;box-sizing:border-box;
  border:1px solid #e4e9f1;border-radius:6px;background:#fff;font-size:10px;line-height:1;font-weight:600;letter-spacing:1.2px;color:#8a94a6}
body.cs1-home .cs1cc.cs1none{border-style:dashed}
/* state chips: LIVE mint-tinted, RESERVED gold-tinted */
body.cs1-home .chip{display:inline-flex;align-items:center;height:24px;box-sizing:border-box;padding:0 9px;margin-top:10px;border-radius:6px;
  font-size:10px;line-height:1;font-weight:700;letter-spacing:1.2px}
body.cs1-home .chip.live{background:#e4faf1;color:#13865c}
body.cs1-home .chip.reserved{background:#faf4e6;color:#9a7729}
body.cs1-home .chip.upcoming{background:#eef1f6;color:#64748b}
body.cs1-home .seatln{font-size:12.5px;color:#8a94a6;font-weight:600}
body.cs1-home .legal{font-size:11px;line-height:18px;color:#97a0b1;margin-top:34px}

/* the start-your-own-club door (bw_clubnav card), white with the accent bar */
body.cs1-home .bwcn-start{position:relative;display:block;background:#fff;color:#33415b;border:1px solid #e4e9f1;border-radius:14px;
  padding:26px 24px 24px;margin:26px 0 0;box-shadow:0 1px 3px rgba(16,24,40,.05);overflow:visible}
body.cs1-home .bwcn-start:after{display:none}
body.cs1-home .bwcn-start .bwcn-sh{font-size:20px;line-height:26px;font-weight:600;color:#1f2940;letter-spacing:0;gap:9px}
body.cs1-home .bwcn-start .bwcn-free{display:inline-flex;align-items:center;height:23px;padding:0 9px;border-radius:6px;background:#e4faf1;color:#13865c;
  font-size:10px;line-height:1;font-weight:700;letter-spacing:1.5px}
body.cs1-home .bwcn-start .bwcn-sl{font-size:14px;line-height:22px;color:#33415b;margin:7px 0 8px}
body.cs1-home .bwcn-start ul{display:block;margin:0 0 16px}
body.cs1-home .bwcn-start li{display:inline;margin-block:0 0;margin-inline:0 14px;border:0;padding:0;border-radius:0;font-size:12.5px;line-height:20px;font-weight:400;color:#64748b}
body.cs1-home .bwcn-start li:before{color:#13865c;font-weight:700;margin-inline-end:4px}
body.cs1-home .bwcn-start .bwcn-go{display:inline-flex;align-items:center;height:43px;padding:0 28px;border-radius:999px;background:#3ddc97;color:#0b1622;
  font-size:14px;font-weight:700;box-shadow:none}

@media (max-width:999px){ body.cs1-home .cards{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){
  body.cs1-home .wrap{padding:26px 20px 60px}
  body.cs1-home .cards{grid-template-columns:minmax(0,1fr);gap:14px}
  body.cs1-home .whatis{padding-block:15px 14px;padding-inline:18px 16px}
  html body.cs1-home .bww3card .nm{font-size:24px;line-height:32px}
  html body.cs1-home .bww3door{padding:17px 18px 15px}
}

/* ----------------------------------------------------------- FAN CLUBS --- */
body.cs1-fan .wrap{max-width:752px;padding:33px 16px 60px}
body.cs1-fan .fchead{gap:10px;margin:0 0 17px}
body.cs1-fan h1{font-size:28px;line-height:36px;font-weight:600;color:#1f2940;margin:0;letter-spacing:0}
body.cs1-fan .fcchev{width:26px;height:26px;border:1px solid #e4e9f1;color:#8a94a6;font-size:15px}
body.cs1-fan .sub{font-size:14px;line-height:22px;color:#64748b;margin:-8px 0 16px}
body.cs1-fan #q{height:49px;border:1px solid #e4e9f1;border-radius:12px;padding:0 20px;font-size:14px;color:#1f2940;background:#fff;
  box-shadow:0 1px 3px rgba(16,24,40,.05)}
body.cs1-fan #q::placeholder{color:#8a94a6;opacity:1}
body.cs1-fan #q:focus{border-color:#3ddc97;box-shadow:0 0 0 4px rgba(61,220,151,.16)}
body.cs1-fan #placeLine,body.cs1-fan #facets{display:inline-block;vertical-align:top}
body.cs1-fan #placeLine{margin-block:9px 0;margin-inline:0 18px}
body.cs1-fan #facets{margin:9px 0 0}
body.cs1-fan #facets .place{display:inline-block;margin-block:0 0;margin-inline:0 18px}
body.cs1-fan .place{font-size:13px;line-height:20px;color:#8a94a6}
body.cs1-fan .place .flab2,body.cs1-fan .facets .flab2{font-size:10.5px;font-weight:400;letter-spacing:1px;color:#939cad;margin-inline-end:6px}
body.cs1-fan .place .bwPlaceName{font-weight:600;color:#1f2940}
body.cs1-fan .place a{color:#2bb886;font-weight:600;margin-inline-start:3px}
body.cs1-fan .total{font-size:12px;line-height:20px;font-weight:400;color:#8a94a6;margin:0 0 13px}
/* the start-a-club band: a white card with the accent bar */
body.cs1-fan .bwcn-strip{position:relative;background:#fff;color:#33415b;border:1px solid #e4e9f1;border-radius:14px;padding:18px 20px 17px 20px;margin:0 0 13px;
  box-shadow:0 1px 3px rgba(16,24,40,.05);gap:16px}
body.cs1-fan .bwcn-strip::before{content:"";position:absolute;inset-inline-start:0;top:14px;bottom:14px;width:4px;border-start-start-radius:0;border-start-end-radius:3px;border-end-end-radius:3px;border-end-start-radius:0;background:#3ddc97}
body.cs1-fan .bwcn-strip .bwcn-plus{display:none}
body.cs1-fan .bwcn-strip .bwcn-st b{font-size:15.5px;line-height:22px;font-weight:600;color:#1f2940}
body.cs1-fan .bwcn-strip .bwcn-st span{font-size:12.5px;line-height:18px;color:#8a94a6;margin-top:1px}
body.cs1-fan .bwcn-strip .bwcn-go{display:inline-flex;align-items:center;height:36px;padding:0 22px;border-radius:999px;background:#3ddc97;color:#0b1622;
  font-size:13px;font-weight:700}
/* club rows: white cards, name, the league line, the country chip, the mint Join pill */
body.cs1-fan .row{background:#fff;border:1px solid #e4e9f1;border-radius:14px;padding:16px 20px;margin:0 0 13px;gap:16px;min-height:78px;box-sizing:border-box;
  box-shadow:0 1px 3px rgba(16,24,40,.05)}
body.cs1-fan .row .nm{display:block;font-size:15.5px;line-height:23px;font-weight:600;color:#1f2940}
body.cs1-fan .row .meta{font-size:12px;line-height:20px;color:#8a94a6;margin-top:1px}
body.cs1-fan .row .meta .ct{color:#2bb886;font-weight:600}
body.cs1-fan .row .meta .cs1dot:has(+ .cc){display:none}
body.cs1-fan .row .meta .cc{display:inline-flex;align-items:center;height:16px;box-sizing:border-box;margin-inline-start:8px;padding:0 6px;border:1px solid #e4e9f1;border-radius:3px;
  font-size:9px;line-height:1;font-weight:600;letter-spacing:1px;color:#8a94a6;vertical-align:1px}
body.cs1-fan .row .offerline{color:#13865c;font-weight:600}
body.cs1-fan .b{height:32px;padding:0 20px;min-width:76px;border-radius:999px;background:#3ddc97;color:#0b1622;font-size:13px;font-weight:700}
body.cs1-fan .b.joined{background:#fff;border:1px solid #e4e9f1;color:#64748b;display:inline-flex;align-items:center;justify-content:center}
body.cs1-fan .chip.trophy{background:#faf4e6;color:#9a7729}
body.cs1-fan .buildingline{font-size:10.5px;font-weight:600;letter-spacing:1.4px;color:#8a94a6;border-top-color:#e4e9f1}
body.cs1-fan .more{border:1px solid #e4e9f1;background:#fff;color:#1f2940;border-radius:999px;font-weight:600;height:44px;padding:0}
body.cs1-fan .note{color:#8a94a6}
body.cs1-fan .foot{font-size:12px;color:#8a94a6}
body.cs1-fan .foot a{color:#2bb886;font-weight:600}
@media (max-width:640px){
  body.cs1-fan .wrap{padding:24px 20px 56px}
  body.cs1-fan .row{padding:14px 16px}
  body.cs1-fan .bwcn-strip{padding-block:16px 16px;padding-inline:18px 16px}
}

/* --------------------------------------------------------- FOR BUSINESS --- */
body.cs1-board .wrap{max-width:1012px;padding:26px 16px 90px}
/* the dark hero, the faint white mark bleeding off the bottom right */
body.cs1-board .wrap>.hero{position:relative;overflow:hidden;border-radius:16px;padding:58px 40px 83px;box-shadow:none;text-align:center;color:#fff;
  background:linear-gradient(162deg,#17263e 0%,#0f1b2d 48%,#0b1522 100%)}
body.cs1-board .wrap>.hero::after{content:"";position:absolute;inset-inline-end:-112px;bottom:-94px;width:452px;height:320px;pointer-events:none;
  background:url(/bw_mark_white_c1.png) no-repeat center/contain;opacity:.05}
body.cs1-board .wrap>.hero>*{position:relative;z-index:1}
body.cs1-board .wrap>.hero h1{font-size:42px;line-height:47px;font-weight:700;letter-spacing:0;margin:0;color:#fff}
body.cs1-board .wrap>.hero h1 .g{display:block;color:#3ddc97}
body.cs1-board .wrap>.hero p{max-width:612px;margin:17px auto 0;font-size:15px;line-height:24px;color:#b9c8da}
body.cs1-board .tallytag{display:inline-flex;align-items:center;justify-content:center;height:40px;box-sizing:border-box;margin-top:22px;padding:0 22px;
  background:transparent;border:1px solid rgba(255,255,255,.14);border-radius:999px;font-size:13px;font-weight:600;color:#fff}
/* the verification line sits inside the hero, under the tally pill (it stays the page's own next line) */
body.cs1-board .tallynote{position:relative;z-index:2;margin:-68px 0 67px;font-size:11.5px;line-height:18px;color:#8fa3bd;text-align:center}
body.cs1-board #bww3boardline{max-width:none!important;margin:17px 0 0!important;padding:13px 20px!important;border:1px solid #e4e9f1!important;border-radius:12px!important;
  background:#fff!important;font-size:13.5px!important;line-height:20px!important;color:#33415b!important;text-align:center;box-shadow:0 1px 3px rgba(16,24,40,.05)}
body.cs1-board #bww3boardline a{color:#2bb886!important;font-weight:600!important}
/* the brand-teams band: dark, the gold accent bar, the gold kicker */
body.cs1-board .sec#start{margin:17px 0 0}
body.cs1-board .cs1band{position:relative;background:#101c30;color:#b9c8da;border-radius:14px;padding:25px 26px 21px;margin:0 0 35px}
body.cs1-board .cs1band::before{content:"";position:absolute;inset-inline-start:0;top:17px;bottom:17px;width:4px;border-start-start-radius:0;border-start-end-radius:3px;border-end-end-radius:3px;border-end-start-radius:0;background:#d8b36a}
body.cs1-board .cs1band .cs1bk{font-size:11px;line-height:14px;font-weight:700;letter-spacing:1.9px;text-transform:uppercase;color:#d8b36a}
body.cs1-board .cs1band .cs1bt{margin:7px 0 15px;font-size:13.5px;line-height:21px;color:#b9c8da}
body.cs1-board .cs1band .cs1bb{display:inline-flex;align-items:center;height:40px;padding:0 24px;border-radius:999px;background:#3ddc97;color:#0b1622;
  font-size:13px;font-weight:700;text-decoration:none}
body.cs1-board .kicker{font-size:10.5px;line-height:14px;font-weight:600;letter-spacing:1.9px;color:#8a94a6}
body.cs1-board .sec>h2{margin:10px 0 8px;font-size:24px;line-height:30px;font-weight:600;color:#1f2940;letter-spacing:0}
body.cs1-board .lead{font-size:14px;line-height:22px;color:#64748b;margin:0 0 16px}
/* the four paths: light cards, one icon chip each */
body.cs1-board .routegrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
body.cs1-board .route,body.cs1-board .route.hero{background:#fff;color:#33415b;border:1px solid #e4e9f1;border-top:1px solid #e4e9f1;border-radius:14px;
  padding:20px 20px 22px;text-align:start;box-shadow:0 1px 3px rgba(16,24,40,.05)}
body.cs1-board .route:hover{transform:none;box-shadow:0 6px 18px rgba(16,24,40,.08)}
body.cs1-board .rt-ic,body.cs1-board .route .rt-ic{width:40px;height:40px;border-radius:10px;background:#e4faf1;color:#13865c;font-size:20px;font-weight:700}
body.cs1-board .rt-ic svg{width:20px;height:20px}
body.cs1-board .rt-tag{display:block;margin:13px 0 7px;font-size:10px;line-height:14px;font-weight:600;letter-spacing:1.5px;color:#8a94a6}
body.cs1-board .rt-h{margin:0 0 3px;font-size:16px;line-height:24px;font-weight:600;color:#1f2940;letter-spacing:0}
body.cs1-board .rt-d{font-size:12.5px;line-height:19.5px;color:#64748b}
body.cs1-board .rt-d b{color:#1f2940;font-weight:600}
body.cs1-board .rt-go,body.cs1-board .route .rt-go{margin-top:14px;font-size:13px;line-height:20px;font-weight:600;color:#2bb886}
body.cs1-board .routenote{border:1px solid #e4e9f1;border-radius:14px;padding:18px 22px;margin-top:18px;font-size:13.5px;line-height:22px;color:#33415b;
  box-shadow:0 1px 3px rgba(16,24,40,.05)}
body.cs1-board .routenote>div+div{margin-top:20px!important}
body.cs1-board .routenote b{color:#1f2940;font-weight:600}
body.cs1-board .routenote a{color:#2bb886;font-weight:600}
body.cs1-board details.boardmore{margin:17px 0 16px}
body.cs1-board details.boardmore>summary{height:53px;box-sizing:border-box;padding:0 22px;border:1px solid #e4e9f1;border-radius:14px;font-size:14.5px;font-weight:600;
  color:#1f2940;box-shadow:0 1px 3px rgba(16,24,40,.05)}
body.cs1-board details.boardmore>summary::after{font-size:17px;font-weight:600;color:#2bb886}
body.cs1-board .thing{border-radius:14px;box-shadow:none}
body.cs1-board .generics{border-radius:12px}
body.cs1-board .checkbox2{border:1px solid #e4e9f1;border-top:1px solid #e4e9f1;border-radius:14px;box-shadow:0 1px 3px rgba(16,24,40,.05)}
body.cs1-board .btn.g{background:#3ddc97;color:#0b1622;font-weight:700;box-shadow:none}
body.cs1-board .legal{color:#97a0b1;line-height:18px}
@media (max-width:999px){ body.cs1-board .routegrid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){
  body.cs1-board .wrap{padding:20px 20px 72px}
  body.cs1-board .wrap>.hero{padding:40px 20px 98px}
  body.cs1-board .wrap>.hero h1{font-size:32px;line-height:38px}
  body.cs1-board .wrap>.hero::after{inset-inline-end:-150px;bottom:-110px}
  body.cs1-board .tallynote{min-height:36px;margin:-78px 20px 59px}
  body.cs1-board .routegrid{grid-template-columns:minmax(0,1fr)}
  body.cs1-board .cs1band{padding-block:22px 20px;padding-inline:22px 18px}
  body.cs1-board .sec>h2{font-size:22px;line-height:30px}
}
