    :root{
      --primary:#155eef;
      --primary-hover:#0f4bd8;
      --action:#576cdb;
      --action-hover:#465bc7;
      --bg:#f8fafc;
      --surface:#ffffff;
      --text:#101828;
      --text-secondary:#475467;
      --radius-card:16px;
      --radius-panel:32px;
      --radius:var(--radius-card);
      --shadow:0 14px 32px rgba(16,24,40,.08);
      --border:#e4e7ec;
      --max:1200px;
      --font-sans:"Helvetica Neue","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,sans-serif;
      --font-display:"Inter Tight","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,sans-serif;
      --weight-light:300;
      --weight-regular:400;
      --weight-medium:500;
      --weight-semibold:500;
      --weight-bold:500;
      --text-caption:13px;
      --text-body:16px;
      --text-body-lg:18px;
      --text-subheading:20px;
      --text-heading-sm:24px;
      --text-heading:32px;
      --text-heading-lg:48px;
      --text-display:64px;
      --text-display-xl:80px;
      --leading-caption:18px;
      --leading-body:24px;
      --leading-body-lg:27px;
      --leading-subheading:28px;
      --leading-heading-sm:30px;
      --leading-heading:40px;
      --leading-heading-lg:54px;
      --leading-display:64px;
      --leading-display-xl:80px;
      --spacing-4:4px;
      --spacing-8:8px;
      --spacing-12:12px;
      --spacing-16:16px;
      --spacing-20:20px;
      --spacing-24:24px;
      --spacing-28:28px;
      --spacing-32:32px;
      --spacing-40:40px;
      --spacing-48:48px;
      --spacing-56:56px;
      --spacing-60:60px;
      --spacing-64:64px;
      --spacing-72:72px;
      --section-gap-compact:80px;
      --section-gap:96px;
      --spacing-120:120px;
      --spacing-192:192px;
    }
    *{margin:0;padding:0;box-sizing:border-box}
    html{scroll-behavior:smooth;scroll-padding-top:96px}
    @media (min-width:900px) and (pointer:fine){
      html{scroll-snap-type:y proximity}
      .hero,
      main > section{scroll-snap-align:start;scroll-snap-stop:normal}
    }
    @media (prefers-reduced-motion:reduce){html{scroll-snap-type:none}}
    body{
      font-family:var(--font-sans);
      background:var(--bg);
      color:var(--text);
      line-height:1.5;
      min-height:100vh;
      display:flex;
      flex-direction:column;
    }
    a{color:inherit}
    h1,h2,h3,h4{font-family:var(--font-display)}
    .sr-only{
      position:absolute;
      width:1px;
      height:1px;
      padding:0;
      margin:-1px;
      overflow:hidden;
      clip:rect(0,0,0,0);
      white-space:nowrap;
      border:0;
    }
    .nav{
      position:fixed;
      inset:0 0 auto;
      z-index:20;
      border:0;
      background:transparent;
      transition:background-color .22s ease, border-color .22s ease, box-shadow .22s ease, backdrop-filter .22s ease;
    }
    .nav.is-scrolled,
    .nav.is-menu-open{
      border-bottom:1px solid rgba(217,225,239,.82);
      background:rgba(248,250,252,.86);
      box-shadow:0 8px 24px rgba(16,24,40,.06);
      backdrop-filter:blur(16px) saturate(150%);
    }
    .nav-inner{
      max-width:var(--max);
      margin:0 auto;
      min-height:76px;
      padding:14px 24px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:14px;
    }
    .brand{
      display:flex; align-items:center; gap:10px;
      color:var(--text);
      font-size:18px;
      font-weight:var(--weight-bold); letter-spacing:-.025em;
    }
    .dot{
      width:11px; height:11px; border-radius:3px;
      background:var(--primary);
    }
    .nav-links{
      display:flex; align-items:center; gap:14px;
      flex-wrap:wrap;
      justify-content:flex-end;
    }
    .nav-links a{
      text-decoration:none;
      color:#344054;
      font-weight:var(--weight-semibold);
      font-size:14px;
      padding:8px 10px;
      border-radius:9px;
    }
    .nav-links a:hover{background:rgba(21,94,239,.08); color:var(--text)}
    .nav-links a.btn{color:#fff; padding:10px 14px}
    .nav-links a.btn:hover{background:var(--action-hover); color:#fff}
    .nav-links a[data-nav]:not(.btn)[aria-current="page"]{color:var(--action);background:rgba(87,108,219,.09)}
    .nav-menu-toggle{display:none}
    .btn{
      display:inline-block;
      background:var(--action);
      color:#fff;
      text-decoration:none;
      padding:12px 24px;
      border-radius:9999px;
      font-family:var(--font-display);
      font-size:16px;
      font-weight:var(--weight-medium);
      transition:background-color .2s, transform .16s, box-shadow .16s;
      border:0;
      white-space:nowrap;
    }
    .btn:hover{background:var(--action-hover);box-shadow:0 8px 18px rgba(87,108,219,.20)}
    .btn:active{transform:translateY(1px)}
    .btn-outline{
      display:inline-flex;
      align-items:center;
      gap:8px;
      background:transparent;
      color:var(--action);
      text-decoration:none;
      padding:12px 0;
      border-radius:0;
      font-family:var(--font-display);
      font-size:16px;
      font-weight:var(--weight-medium);
      border:0;
      transition:background-color .2s, color .2s, transform .08s;
      white-space:nowrap;
    }
    .btn-outline::after{content:'→';font-size:19px;line-height:1}
    .btn-outline:hover{color:var(--action-hover);text-decoration:underline;text-underline-offset:4px}
    .btn-outline:active{transform:translateY(1px)}
    .hero{
      position:relative;
      isolation:isolate;
      min-height:100vh;
      min-height:100svh;
      overflow:hidden;
      background:#dde8f4 url('/courtio-padel-hero.webp') center 54% / cover no-repeat;
    }
    .hero::before{
      content:'';
      position:absolute;
      inset:0;
      z-index:-1;
      background:linear-gradient(90deg, #f8fafc 0%, rgba(248,250,252,.99) 29%, rgba(248,250,252,.90) 42%, rgba(248,250,252,.32) 61%, rgba(8,15,31,.06) 100%);
    }
    .hero-inner{
      max-width:var(--max);
      min-height:100vh;
      min-height:100svh;
      margin:0 auto;
      padding:clamp(128px,16vh,158px) 24px clamp(64px,10vh,88px);
      display:flex;
      align-items:center;
      text-align:left;
    }
    .hero-copy{max-width:650px}
    .hero h1{
      color:#101828;
      font-size:clamp(56px,6.1vw,var(--text-display-xl));
      line-height:1;
      font-weight:var(--weight-medium);
      margin-bottom:20px;
      letter-spacing:-.07em;
    }
    .hero h1 span{color:var(--primary)}
    .hero p:not(.hero-proof){
      color:#344054;
      font-size:var(--text-subheading);
      max-width:440px;
      margin:0 0 26px;
    }
    .hero-cta{
      display:flex;
      justify-content:flex-start;
      gap:12px;
      flex-wrap:wrap;
      margin-top:0;
    }
    .hero-cta .btn{display:inline-flex;align-items:center;gap:11px}
    .btn-arrow{font-size:19px;line-height:0;transition:transform .16s}
    .hero-cta .btn:hover .btn-arrow{transform:translateX(3px)}
    .btn-secondary{
      display:inline-flex;
      align-items:center;
      gap:9px;
      padding:12px 0;
      border:0;
      border-radius:0;
      background:transparent;
      color:var(--action);
      font-family:var(--font-display);
      font-size:16px;
      font-weight:var(--weight-medium);
      text-decoration:none;
      transition:background-color .16s, border-color .16s;
    }
    .btn-secondary > span{display:none}
    .btn-secondary::after{content:'→';font-size:19px;line-height:1}
    .btn-secondary:hover{color:var(--action-hover);text-decoration:underline;text-underline-offset:4px}
    .hero-proof{display:flex;gap:16px;flex-wrap:wrap;margin-top:24px!important;font-size:12px!important;font-weight:var(--weight-semibold);color:#667085!important}
    .hero-proof span{display:inline-flex;align-items:center;gap:6px}
    .hero-proof span::before{content:'✓';color:#155eef;font-weight:var(--weight-bold)}
    .content{
      max-width:var(--max);
      margin:0 auto;
      padding:18px 18px 36px;
      flex:1;
    }
    .grid{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
      gap:var(--spacing-16);
      margin-top:var(--spacing-16);
    }
    .card{
      background:var(--surface);
      border-radius:var(--radius);
      padding:var(--spacing-32);
      box-shadow:var(--shadow);
      border:1px solid rgba(218,220,224,.7);
    }
    .icon{
      width:42px; height:42px;
      border-radius:12px;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:20px;
      background:rgba(26,115,232,.10);
      margin-bottom:12px;
    }
    .card h3{font-size:var(--text-heading-sm);line-height:var(--leading-heading-sm);font-weight:var(--weight-medium);margin-bottom:var(--spacing-8)}
    .card p{color:var(--text-secondary);font-size:var(--text-body);line-height:var(--leading-body)}
    .section{
      padding:var(--section-gap-compact) 0;
      text-align:center;
    }
    .section h2{
      font-size:var(--text-heading);
      line-height:var(--leading-heading);
      margin-bottom:8px;
      letter-spacing:-.02em;
      font-weight:var(--weight-medium);
    }
    .section p{
      color:var(--text-secondary);
      font-size:var(--text-body-lg);
      line-height:var(--leading-body-lg);
      max-width:780px;
      margin:0 auto;
    }
    .advantage-section{
      padding:var(--section-gap-compact) 0 var(--section-gap);
      text-align:left;
    }
    .advantage-heading{
      display:grid;
      grid-template-columns:1fr;
      align-items:end;
      gap:28px;
    }
    .advantage-kicker{
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin-bottom:14px;
      color:var(--primary);
      font-size:12px;
      font-weight:var(--weight-semibold);
      letter-spacing:.11em;
      text-transform:uppercase;
    }
    .advantage-kicker::before{
      content:'';
      width:7px;
      height:7px;
      border-radius:2px;
      background:currentColor;
    }
    .advantage-heading h2{
      max-width:640px;
      margin:0;
      color:#101828;
      font-size:clamp(40px,4vw,var(--text-heading-lg));
      line-height:var(--leading-heading-lg);
      letter-spacing:-1.44px;
      font-weight:var(--weight-medium);
    }
    .advantage-heading > p{
      max-width:430px;
      margin:0;
      color:#475467;
      font-size:var(--text-subheading);
      line-height:var(--leading-subheading);
      font-weight:var(--weight-light);
    }
    .advantage-showcase{
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:var(--spacing-16);
      margin-top:var(--spacing-40);
    }
    .advantage-primary,
    .advantage-compact,
    .advantage-outcome{
      border:1px solid #d9e1ef;
      border-radius:var(--radius-card);
      text-decoration:none;
      transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
    }
    .advantage-primary{
      position:relative;
      min-height:364px;
      overflow:hidden;
      display:flex;
      flex-direction:column;
      justify-content:flex-end;
      padding:var(--spacing-32);
      background:#12327c;
      color:#fff;
      border-color:#12327c;
      border-radius:var(--radius-panel);
    }
    .advantage-primary::before,
    .advantage-primary::after{
      content:'';
      position:absolute;
      width:230px;
      height:230px;
      border:1px solid rgba(255,255,255,.14);
      border-radius:50%;
      pointer-events:none;
    }
    .advantage-primary::before{right:-82px;top:-104px}
    .advantage-primary::after{right:-30px;top:-52px}
    .advantage-label{
      position:absolute;
      top:28px;
      left:32px;
      z-index:1;
      color:#c7d7fe;
      font-size:12px;
      font-weight:var(--weight-medium);
      letter-spacing:.1em;
      text-transform:uppercase;
    }
    .advantage-primary h3{
      position:relative;
      z-index:1;
      max-width:440px;
      margin:0 0 10px;
      font-size:clamp(28px,3.2vw,40px);
      line-height:1.13;
      letter-spacing:-.04em;
      font-weight:var(--weight-medium);
    }
    .advantage-primary p{
      position:relative;
      z-index:1;
      max-width:470px;
      margin:0;
      color:#dbe7ff;
      font-size:var(--text-body);
      line-height:var(--leading-body);
    }
    .advantage-link{
      position:relative;
      z-index:1;
      display:inline-flex;
      align-items:center;
      gap:8px;
      width:max-content;
      margin-top:22px;
      color:#fff;
      font-family:var(--font-display);
      font-size:16px;
      font-weight:var(--weight-medium);
    }
    .advantage-link span{font-size:18px;line-height:1}
    .advantage-commercial{
      display:grid;
      grid-template-rows:1fr 1fr;
      gap:0;
      overflow:hidden;
      border:1px solid var(--border);
      border-radius:var(--radius-panel);
      background:var(--surface);
    }
    .advantage-compact{
      display:flex;
      flex-direction:column;
      justify-content:center;
      min-height:175px;
      padding:var(--spacing-32);
      border:0;
      border-bottom:1px solid var(--border);
      border-radius:0;
      background:transparent;
      color:var(--text);
    }
    .advantage-compact:last-child{border-bottom:0}
    .advantage-compact h3{
      margin:0 0 var(--spacing-8);
      font-size:22px;
      line-height:28px;
      letter-spacing:-.44px;
      font-weight:var(--weight-medium);
    }
    .advantage-compact p{
      margin:0;
      color:#475467;
      font-size:var(--text-body);
      line-height:var(--leading-body);
    }
    .advantage-compact .advantage-link{
      margin-top:14px;
      color:var(--primary);
      font-size:14px;
    }
    .advantage-outcomes{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:0;
      margin-top:var(--spacing-16);
      overflow:hidden;
      border:1px solid var(--border);
      border-radius:var(--radius-panel);
      background:var(--surface);
    }
    .advantage-outcome{
      min-height:216px;
      padding:var(--spacing-32);
      border:0;
      border-right:1px solid var(--border);
      border-radius:0;
      background:transparent;
    }
    .advantage-outcome:last-child{border-right:0}
    .advantage-number{
      display:block;
      margin-bottom:var(--spacing-32);
      color:#98a2b3;
      font-size:12px;
      font-weight:var(--weight-medium);
      letter-spacing:.1em;
    }
    .advantage-outcome h3{
      margin:0 0 8px;
      color:#101828;
      font-size:22px;
      line-height:28px;
      letter-spacing:-.44px;
      font-weight:var(--weight-medium);
    }
    .advantage-outcome p{
      margin:0;
      color:#667085;
      font-size:var(--text-body);
      line-height:var(--leading-body);
    }
    .advantage-footer{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:var(--spacing-24);
      margin-top:var(--spacing-24);
      padding:var(--spacing-24) 0 0;
    }
    .advantage-footer p{
      max-width:none;
      margin:0;
      color:#667085;
      font-size:var(--text-body);
      line-height:var(--leading-body);
    }
    @media (hover:hover){
      .advantage-primary:hover{
        transform:translateY(-3px);
        border-color:#b5c7f6;
        box-shadow:0 12px 26px rgba(16,24,40,.08);
      }
      .advantage-compact:hover,
      .advantage-outcome:hover{background:#fafbff}
      .advantage-primary:hover .advantage-link span,
      .advantage-compact:hover .advantage-link span{transform:translateX(3px)}
    }
    @media (prefers-reduced-motion:reduce){
      .advantage-primary,
      .advantage-compact,
      .advantage-outcome{transition:none}
    }
    .club-section{
      padding:var(--section-gap) 0;
      text-align:left;
    }
    .audience-tabs{
      display:flex;
      align-items:flex-end;
      gap:var(--spacing-24);
      margin-bottom:var(--spacing-40);
      border-bottom:1px solid var(--border);
    }
    .audience-tab{
      appearance:none;
      padding:0 0 var(--spacing-16);
      border:0;
      border-bottom:2px solid transparent;
      background:transparent;
      color:#98a2b3;
      cursor:pointer;
      font-family:var(--font-display);
      font-size:clamp(32px,4vw,var(--text-heading-lg));
      font-weight:var(--weight-medium);
      letter-spacing:-1.44px;
      line-height:var(--leading-heading-lg);
      transition:color .18s ease, border-color .34s cubic-bezier(.22,1,.36,1);
    }
    .audience-tab[aria-selected="true"]{
      color:#101828;
      border-bottom-color:var(--action);
    }
    .audience-tab:hover{color:#344054}
    .audience-panel[hidden]{display:none}
    .audience-panel.is-entering .audience-intro{
      animation:audience-intro-in .34s cubic-bezier(.22,1,.36,1) both;
    }
    .audience-panel.is-entering .club-tools{
      animation:audience-grid-in .42s cubic-bezier(.22,1,.36,1) .04s both;
    }
    .audience-panel.is-entering .club-tool{
      animation:audience-card-in .42s cubic-bezier(.22,1,.36,1) both;
    }
    .audience-panel.is-entering .club-tool:nth-child(1){animation-delay:.08s}
    .audience-panel.is-entering .club-tool:nth-child(2){animation-delay:.13s}
    .audience-panel.is-entering .club-tool:nth-child(3){animation-delay:.18s}
    .audience-panel.is-entering .club-tool:nth-child(4){animation-delay:.23s}
    .audience-panel.is-entering .club-tool:nth-child(5){animation-delay:.28s}
    .audience-panel.is-entering .club-tool:nth-child(6){animation-delay:.33s}
    @keyframes audience-intro-in{
      from{opacity:0;transform:translateY(8px)}
      to{opacity:1;transform:translateY(0)}
    }
    @keyframes audience-grid-in{
      from{opacity:0;transform:translateY(12px)}
      to{opacity:1;transform:translateY(0)}
    }
    @keyframes audience-card-in{
      from{opacity:0;transform:translateY(8px)}
      to{opacity:1;transform:translateY(0)}
    }
    @media (prefers-reduced-motion:reduce){
      .audience-panel.is-entering .audience-intro,
      .audience-panel.is-entering .club-tools,
      .audience-panel.is-entering .club-tool{animation:none}
    }
    .audience-intro{
      margin-top:var(--spacing-40);
      max-width:740px;
    }
    .audience-intro h3{
      margin:0 0 var(--spacing-12);
      color:#101828;
      font-size:var(--text-heading-sm);
      line-height:var(--leading-heading-sm);
      letter-spacing:-.48px;
      font-weight:var(--weight-medium);
    }
    .audience-intro p{
      max-width:680px;
      margin:0;
      color:#667085;
      font-size:var(--text-body-lg);
      font-weight:var(--weight-light);
      line-height:1.55;
      letter-spacing:.003em;
    }
    .club-tools{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:0;
      margin-top:var(--spacing-32);
      overflow:hidden;
      border:1px solid var(--border);
      border-radius:var(--radius-panel);
    }
    .club-tool{
      display:flex;
      flex-direction:column;
      min-height:224px;
      padding:var(--spacing-32);
      border:0;
      border-right:1px solid var(--border);
      border-bottom:1px solid var(--border);
      border-radius:0;
      background:transparent;
      transition:background-color .18s ease;
    }
    .club-tool:nth-child(3n){border-right:0}
    .club-tool:nth-child(n+4){border-bottom:0}
    .club-tool-art{
      display:flex;
      align-items:center;
      justify-content:center;
      width:26px;
      height:26px;
      border:0;
      border-radius:0;
      background:transparent;
      color:#98a2b3;
    }
    .club-tool-art svg{
      width:24px;
      height:24px;
      fill:none;
      stroke:currentColor;
      stroke-linecap:round;
      stroke-linejoin:round;
      stroke-width:1.5;
    }
    .club-tool h3{
      margin:var(--spacing-24) 0 var(--spacing-8);
      color:#101828;
      font-size:var(--text-heading-sm);
      line-height:var(--leading-heading-sm);
      letter-spacing:-.48px;
      font-weight:var(--weight-medium);
    }
    .club-tool p{
      margin:0;
      color:#667085;
      font-size:var(--text-body);
      font-weight:var(--weight-light);
      line-height:1.55;
      letter-spacing:.003em;
    }
    .club-tool--link{
      color:inherit;
      text-decoration:none;
    }
    .club-tool--link .club-tool-link{
      display:inline-flex;
      align-items:center;
      gap:6px;
      margin-top:var(--spacing-16);
      color:var(--action);
      font-family:var(--font-display);
      font-size:14px;
      font-weight:var(--weight-medium);
    }
    .club-tool--link:hover .club-tool-link{text-decoration:underline;text-underline-offset:4px}
    .player-tools .club-tool{border-bottom:0}
    @media (hover:hover){
      .club-tool:hover{
        background:#fafbff;
      }
    }
    .badge-row{
      display:flex;
      gap:10px;
      flex-wrap:wrap;
      justify-content:center;
      margin-top:14px;
    }
    .badge{
      display:inline-flex;
      gap:8px;
      align-items:center;
      padding:8px 12px;
      border-radius:999px;
      background:#fff;
      border:1px solid rgba(218,220,224,.9);
      box-shadow:0 2px 10px rgba(0,0,0,.04);
      font-weight:700;
      font-size:13px;
      color:var(--text-secondary);
    }
    .divider{
      border:none;
      border-top:1px solid var(--border);
      margin:0 auto;
      max-width:560px;
      opacity:.9;
    }
    .two-col{
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:var(--spacing-24);
      align-items:stretch;
      margin-top:18px;
    }
    .panel{
      background:#fff;
      border:1px solid rgba(218,220,224,.9);
      border-radius:var(--radius);
      padding:var(--spacing-32);
      box-shadow:var(--shadow);
      text-align:left;
    }
    .panel h3{font-size:16px;margin-bottom:8px}
    .panel ul{margin-left:18px; color:var(--text-secondary); font-size:14px}
    .panel li{margin:8px 0}
    .note{
      margin-top:12px;
      font-size:13px;
      color:var(--text-secondary);
    }
    .form{
      display:grid;
      gap:10px;
      margin-top:12px;
    }
    .form input, .form textarea{
      width:100%;
      padding:12px 12px;
      border-radius:12px;
      border:1px solid rgba(218,220,224,.95);
      background:#fff;
      font-size:14px;
      outline:none;
    }
    .form input:focus, .form textarea:focus{
      border-color:rgba(26,115,232,.7);
      box-shadow:0 0 0 4px rgba(26,115,232,.12);
    }
    .form textarea{min-height:96px; resize:vertical}
    .hero p:not(.hero-proof),
    .card p,
    .section p,
    .advantage-primary p,
    .advantage-compact p,
    .advantage-outcome p,
    .advantage-footer p,
    .audience-intro p,
    .club-tool p,
    .panel li,
    .note{
      font-weight:var(--weight-light);
      line-height:1.55;
      letter-spacing:.003em;
    }
    .section > p{max-width:720px}
    .payments-section{
      padding:var(--section-gap) 0;
      text-align:left;
    }
    .payments-section > p{
      max-width:680px;
      margin:var(--spacing-12) 0 0;
      text-align:left;
    }
    .payment-flow{
      position:relative;
      display:grid;
      grid-template-columns:.8fr 1.2fr;
      grid-template-rows:auto 1fr;
      gap:var(--spacing-40) var(--spacing-48);
      margin-top:var(--spacing-48);
      padding:var(--spacing-48);
      overflow:hidden;
      border-radius:var(--radius-panel);
      background:#12327c;
      color:#fff;
    }
    .payment-flow::before{
      content:'';
      position:absolute;
      top:-180px;
      left:-150px;
      width:340px;
      height:340px;
      border:1px solid rgba(255,255,255,.12);
      border-radius:50%;
      box-shadow:0 0 0 54px rgba(255,255,255,.035), 0 0 0 108px rgba(255,255,255,.02);
      pointer-events:none;
    }
    .payment-flow::after{
      content:'';
      position:absolute;
      right:-100px;
      bottom:-130px;
      width:280px;
      height:280px;
      border:1px solid rgba(255,255,255,.12);
      border-radius:50%;
      pointer-events:none;
    }
    .payment-flow-header{
      position:relative;
      z-index:1;
      grid-column:1;
      grid-row:1 / span 2;
      align-self:center;
    }
    .payment-flow-header h3{
      margin:0;
      color:#fff;
      font-size:var(--text-heading);
      line-height:var(--leading-heading);
      letter-spacing:-.64px;
      font-weight:var(--weight-medium);
    }
    .payment-steps{
      position:relative;
      z-index:1;
      grid-column:2;
      grid-row:1 / span 2;
      display:grid;
      align-content:center;
      gap:var(--spacing-16);
      min-width:0;
    }
    .payment-step{
      position:relative;
      display:grid;
      grid-template-columns:64px minmax(0,1fr);
      align-items:center;
      min-height:120px;
      gap:var(--spacing-20);
      padding:var(--spacing-24) var(--spacing-28);
      border:1px solid rgba(255,255,255,.76);
      border-radius:var(--radius-card);
      background:rgba(255,255,255,.98);
      box-shadow:0 16px 34px rgba(4,20,59,.18);
    }
    .payment-step:nth-child(1){margin-right:var(--spacing-48)}
    .payment-step:nth-child(2){margin-left:var(--spacing-32)}
    .payment-step:nth-child(3){margin-right:var(--spacing-24)}
    .payment-step-number{
      position:relative;
      z-index:1;
      color:var(--action);
      font-family:var(--font-display);
      font-size:32px;
      line-height:1;
      font-weight:var(--weight-medium);
      letter-spacing:-.05em;
    }
    .payment-step p{
      max-width:none;
      margin:0;
      color:#344054;
      padding-right:0;
      font-size:var(--text-body-lg);
      font-weight:var(--weight-light);
      line-height:1.5;
      letter-spacing:.003em;
    }
    .demo-section{
      padding:var(--section-gap-compact) 0 var(--section-gap);
      text-align:left;
    }
    .demo-heading{
      max-width:var(--max);
      margin:0 auto var(--spacing-24);
    }
    .demo-heading h2{
      margin:0;
      color:#101828;
      font-size:var(--text-heading);
      line-height:var(--leading-heading);
      letter-spacing:-.64px;
      font-weight:var(--weight-medium);
    }
    .demo-panel{
      max-width:var(--max);
      margin:0 auto;
      display:grid;
      grid-template-columns:.78fr 1.22fr;
      padding:var(--spacing-12);
      overflow:hidden;
      border:1px solid #d9e1ef;
      border-radius:var(--radius-panel);
      background:var(--surface);
      box-shadow:0 18px 42px rgba(16,24,40,.06);
    }
    .demo-aside{
      position:relative;
      display:flex;
      min-height:512px;
      flex-direction:column;
      justify-content:space-between;
      padding:var(--spacing-48) var(--spacing-40);
      overflow:hidden;
      border-radius:22px;
      background:#12327c;
      color:#fff;
    }
    .demo-aside::before,
    .demo-aside::after{
      content:'';
      position:absolute;
      right:-108px;
      bottom:-118px;
      width:260px;
      height:260px;
      border:1px solid rgba(255,255,255,.19);
      border-radius:50%;
      pointer-events:none;
    }
    .demo-aside::after{
      right:-48px;
      bottom:-58px;
      border:0;
      background:rgba(159,185,255,.22);
    }
    .demo-aside-copy,
    .demo-aside-meta{position:relative;z-index:1}
    .demo-aside-eyebrow{
      display:block;
      margin-bottom:var(--spacing-20);
      color:#c7d7fe;
      font-size:12px;
      font-weight:var(--weight-medium);
      letter-spacing:.1em;
    }
    .demo-aside h3{
      max-width:250px;
      margin:0;
      color:#fff;
      font-size:clamp(28px,3vw,36px);
      line-height:1.1;
      letter-spacing:-.05em;
      font-weight:var(--weight-medium);
    }
    .demo-aside p{
      max-width:270px;
      margin:var(--spacing-20) 0 0;
      color:#dbe7ff;
      font-size:var(--text-body);
      font-weight:var(--weight-light);
      line-height:1.55;
      letter-spacing:.003em;
    }
    .demo-aside-meta{
      display:flex;
      align-items:center;
      gap:var(--spacing-12);
      color:#e7efff;
      font-size:var(--text-caption);
      font-weight:var(--weight-light);
    }
    .demo-aside-meta::before{
      content:'';
      width:8px;
      height:8px;
      border-radius:2px;
      background:#9fb9ff;
    }
    .demo-form-area{
      padding:var(--spacing-48) var(--spacing-48) var(--spacing-40);
    }
    .demo-panel .form{
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:var(--spacing-28) var(--spacing-32);
      margin-top:var(--spacing-32);
    }
    .demo-field{display:grid;min-width:0;gap:var(--spacing-8)}
    .demo-field--wide{grid-column:1 / -1}
    .demo-field > span{
      color:#667085;
      font-size:var(--text-caption);
      font-weight:var(--weight-regular);
      line-height:var(--leading-caption);
    }
    .demo-panel .form input,
    .demo-panel .form textarea{
      min-width:0;
      padding:0 0 var(--spacing-8);
      border:0;
      border-bottom:1px solid #d0d5dd;
      border-radius:0;
      background:transparent;
      color:#344054;
      font-weight:var(--weight-regular);
    }
    .demo-panel .form input{height:40px}
    .demo-panel .form textarea{
      min-height:104px;
      padding-top:0;
    }
    .demo-panel .form input:focus,
    .demo-panel .form textarea:focus{border-color:var(--action);box-shadow:0 2px 0 rgba(87,108,219,.16)}
    .demo-panel .form button{
      justify-self:start;
      min-height:48px;
      white-space:nowrap;
    }
    .demo-panel .form .note{margin:0}
    .demo-panel .form #contact-msg{grid-column:1 / -1}
    .demo-contact{
      margin:var(--spacing-24) 0 0;
      color:#667085;
      font-size:var(--text-caption);
      font-weight:var(--weight-light);
    }
    .demo-contact a{font-weight:var(--weight-medium)!important}
    .clubs-section{
      padding:var(--section-gap) 0;
      text-align:left;
    }
    .clubs-heading{
      display:grid;
      grid-template-columns:minmax(0,1fr) minmax(280px,.72fr);
      align-items:end;
      gap:var(--spacing-40);
    }
    .clubs-heading h2{
      max-width:640px;
      margin:0;
      color:#101828;
      font-size:clamp(40px,4vw,var(--text-heading-lg));
      line-height:var(--leading-heading-lg);
      letter-spacing:-1.44px;
      font-weight:var(--weight-medium);
    }
    .clubs-heading p{
      max-width:420px;
      margin:0;
      color:#667085;
      font-size:var(--text-body-lg);
      font-weight:var(--weight-light);
      line-height:1.55;
      letter-spacing:.003em;
    }
    .clubs-showcase{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      margin-top:var(--spacing-40);
      overflow:hidden;
      border:1px solid #d9e1ef;
      border-radius:var(--radius-panel);
      background:var(--surface);
    }
    .club-partner{
      display:flex;
      min-height:350px;
      flex-direction:column;
      padding:var(--spacing-32);
      border-right:1px solid var(--border);
    }
    .club-partner:nth-child(3n){border-right:0}
    .club-partner:nth-child(-n+3){border-bottom:1px solid var(--border)}
    .club-partner-label{
      display:inline-flex;
      align-items:center;
      gap:var(--spacing-8);
      color:#667085;
      font-size:var(--text-caption);
      font-weight:var(--weight-medium);
      letter-spacing:.08em;
      text-transform:uppercase;
    }
    .club-partner-label::before{
      content:'';
      width:7px;
      height:7px;
      border-radius:2px;
      background:var(--action);
    }
    .club-logo-stage{
      display:flex;
      flex:1;
      align-items:center;
      justify-content:center;
      min-height:178px;
      margin:var(--spacing-24) 0;
      padding:var(--spacing-20);
      border:0;
      border-radius:20px;
      background:#fff;
    }
    .club-logo-stage img{
      display:block;
      width:150px;
      height:150px;
      max-width:78%;
      object-fit:contain;
    }
    .club-partner-details h3{
      margin:0 0 var(--spacing-4);
      color:#101828;
      font-size:var(--text-subheading);
      line-height:var(--leading-subheading);
      letter-spacing:-.4px;
      font-weight:var(--weight-medium);
    }
    .club-partner-details p{
      margin:0;
      color:#667085;
      font-size:var(--text-caption);
      font-weight:var(--weight-light);
      line-height:var(--leading-caption);
    }
    .club-partner--cta{
      position:relative;
      justify-content:space-between;
      overflow:hidden;
      border-color:#12327c;
      background:#12327c;
      color:#fff;
    }
    .club-partner--cta::before,
    .club-partner--cta::after{
      content:'';
      position:absolute;
      right:-72px;
      bottom:-90px;
      width:230px;
      height:230px;
      border:1px solid rgba(255,255,255,.16);
      border-radius:50%;
      pointer-events:none;
    }
    .club-partner--cta::after{right:-16px;bottom:-34px}
    .club-partner--cta > *{position:relative;z-index:1}
    .club-partner--cta .club-partner-label{color:#c7d7fe}
    .club-partner--cta .club-partner-label::before{background:#9fb9ff}
    .club-partner--cta h3{
      max-width:260px;
      margin:0;
      color:#fff;
      font-size:clamp(28px,3vw,36px);
      line-height:1.1;
      letter-spacing:-.05em;
      font-weight:var(--weight-medium);
    }
    .club-partner--cta p{
      max-width:230px;
      margin:var(--spacing-16) 0 0;
      color:#dbe7ff;
      font-size:var(--text-body);
      font-weight:var(--weight-light);
      line-height:1.55;
      letter-spacing:.003em;
    }
    .club-partner-cta{
      display:inline-flex;
      align-items:center;
      gap:var(--spacing-8);
      width:max-content;
      color:#fff;
      font-family:var(--font-display);
      font-size:var(--text-body);
      font-weight:var(--weight-medium);
      text-decoration:none;
    }
    .club-partner-cta span{font-size:19px;line-height:1}
    @media (max-width:900px){
      .nav-inner{min-height:72px;padding:14px 18px}
      .nav-menu-toggle{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        min-height:40px;
        padding:0 14px;
        border:1px solid #d0d5dd;
        border-radius:999px;
        background:rgba(255,255,255,.72);
        color:#344054;
        cursor:pointer;
        font-family:var(--font-display);
        font-size:14px;
        font-weight:var(--weight-medium);
      }
      .nav-links{
        position:absolute;
        top:calc(100% + 8px);
        right:18px;
        display:none;
        width:min(300px,calc(100vw - 36px));
        padding:var(--spacing-8);
        flex-direction:column;
        align-items:stretch;
        gap:var(--spacing-4);
        border:1px solid #d9e1ef;
        border-radius:20px;
        background:rgba(255,255,255,.98);
        box-shadow:0 18px 40px rgba(16,24,40,.14);
      }
      .nav.is-menu-open .nav-links{display:flex}
      .nav-links a,
      .nav-links a:not(.btn){display:block;padding:12px 14px}
      .nav-links a.btn{margin-top:var(--spacing-4);padding:12px 14px;text-align:center;font-size:14px}
    }
    @media (max-width:720px){
      .hero{
        min-height:100vh;
        min-height:100svh;
        background-color:#f8fafc;
        background-position:center bottom;
        background-size:auto 45%;
      }
      .hero::before{
        background:linear-gradient(180deg, #f8fafc 0%, #f8fafc 52%, rgba(248,250,252,.95) 61%, rgba(248,250,252,.42) 75%, transparent 92%);
      }
      .hero-inner{
        min-height:100vh;
        min-height:100svh;
        padding:calc(104px + env(safe-area-inset-top)) 22px 40px;
        align-items:flex-start;
      }
      .hero h1{font-size:52px;letter-spacing:-2.7px}
      .hero p{font-size:16px;max-width:390px}
      .hero-proof{gap:10px 16px;max-width:350px}
    }
    @media (max-width:840px){
      .two-col{grid-template-columns:1fr}
      .payment-flow{grid-template-columns:1fr;grid-template-rows:auto;gap:var(--spacing-32);padding:var(--spacing-40)}
      .payment-flow-header,.payment-steps{grid-column:auto;grid-row:auto}
      .payment-steps{max-width:620px}
      .demo-panel{grid-template-columns:1fr;padding:var(--spacing-12)}
      .demo-aside{min-height:0;padding:var(--spacing-40)}
      .demo-form-area{padding:var(--spacing-40)}
      .clubs-heading{grid-template-columns:1fr;gap:var(--spacing-20)}
      .clubs-showcase{grid-template-columns:repeat(2,minmax(0,1fr))}
      .club-partner:nth-child(3n){border-right:1px solid var(--border)}
      .club-partner:nth-child(2n){border-right:0}
      .club-partner:nth-child(4){border-bottom:1px solid var(--border)}
      .club-partner--cta{min-height:240px}
      .advantage-heading,
      .advantage-showcase{grid-template-columns:1fr}
      .advantage-heading > p{max-width:560px}
      .advantage-commercial{grid-template-columns:1fr 1fr;grid-template-rows:none}
      .advantage-compact{border-right:1px solid var(--border);border-bottom:0}
      .advantage-compact:last-child{border-right:0}
      .club-tools{grid-template-columns:repeat(2,1fr)}
      .club-tool:nth-child(3n){border-right:1px solid var(--border)}
      .club-tool:nth-child(n+4){border-bottom:1px solid var(--border)}
      .club-tool:nth-child(2n){border-right:0}
      .club-tool:nth-child(n+5){border-bottom:0}
      .player-tools .club-tool:nth-child(-n+2){border-bottom:1px solid var(--border)}
      .player-tools .club-tool:nth-child(3){border-right:0;border-bottom:0}
    }
    @media (max-width:420px){
      .brand{font-size:17px}
      .hero-inner{padding-top:calc(96px + env(safe-area-inset-top))}
      .hero h1{font-size:39px;letter-spacing:-2.15px}
      .hero p{font-size:15px}
      .hero-cta{gap:9px}
      .hero-cta .btn,.btn-secondary{padding:12px 14px}
      .hero-cta .btn-secondary{
        background:rgba(248,250,252,.9);
        border:1px solid rgba(152,162,179,.32);
        border-radius:999px;
      }
    }
    @media (max-width:600px){
      .advantage-section{padding:58px 0 64px}
      .advantage-heading{gap:16px}
      .advantage-heading h2{font-size:37px;letter-spacing:-1.6px}
      .advantage-showcase{margin-top:28px}
      .advantage-primary{min-height:330px;padding:26px 24px}
      .advantage-label{top:23px;left:24px}
      .advantage-commercial,
      .advantage-outcomes,
      .club-tools{grid-template-columns:1fr}
      .advantage-compact{min-height:0}
      .advantage-outcome{min-height:0}
      .advantage-number{margin-bottom:22px}
      .advantage-compact,
      .advantage-compact:last-child{border-right:0;border-bottom:1px solid var(--border)}
      .advantage-compact:last-child{border-bottom:0}
      .advantage-outcome,
      .advantage-outcome:last-child{border-right:0;border-bottom:1px solid var(--border)}
      .advantage-outcome:last-child{border-bottom:0}
      .advantage-footer{align-items:flex-start;flex-direction:column}
      .payments-section{padding:66px 0}
      .payment-flow{margin-top:var(--spacing-32);padding:var(--spacing-24);border-radius:24px}
      .payment-steps{gap:var(--spacing-12)}
      .payment-step,.payment-step:nth-child(1),.payment-step:nth-child(2),.payment-step:nth-child(3){margin-right:0;margin-left:0}
      .payment-step{grid-template-columns:56px minmax(0,1fr);min-height:112px;gap:var(--spacing-16);padding:var(--spacing-20)}
      .payment-step-number{font-size:28px}
      .payment-step p{padding-right:0;font-size:var(--text-body)}
      .demo-section{padding:66px 0}
      .demo-panel{padding:var(--spacing-8);border-radius:24px}
      .demo-aside{min-height:260px;padding:var(--spacing-32) var(--spacing-24);border-radius:18px}
      .demo-aside h3{max-width:280px}
      .demo-form-area{padding:var(--spacing-32) var(--spacing-16) var(--spacing-24)}
      .demo-panel .form{grid-template-columns:1fr;gap:var(--spacing-24);margin-top:var(--spacing-28)}
      .demo-field--wide{grid-column:auto}
      .clubs-section{padding:66px 0}
      .clubs-showcase{grid-template-columns:1fr;margin-top:var(--spacing-32)}
      .club-partner,
      .club-partner:nth-child(3n),
      .club-partner:nth-child(2n),
      .club-partner:nth-child(-n+3){min-height:300px;border-right:0;border-bottom:1px solid var(--border)}
      .club-partner:last-child{border-bottom:0}
      .club-partner--cta{grid-column:auto;border-color:#12327c}
      .club-section{padding:66px 0 64px}
      .audience-tabs{gap:var(--spacing-16);margin-bottom:var(--spacing-32)}
      .audience-tab{font-size:32px;line-height:40px;padding-bottom:12px}
      .audience-intro{margin-top:var(--spacing-32)}
      .club-tool{min-height:0}
      .club-tool,
      .club-tool:nth-child(3n),
      .club-tool:nth-child(n+4),
      .club-tool:nth-child(2n),
      .club-tool:nth-child(n+5){border-right:0;border-bottom:1px solid var(--border)}
      .club-tool:last-child{border-bottom:0}
      .player-tools .club-tool,
      .player-tools .club-tool:nth-child(-n+2),
      .player-tools .club-tool:nth-child(3){border-right:0;border-bottom:1px solid var(--border)}
      .player-tools .club-tool:last-child{border-bottom:0}
    }
