:root{
      /* ClubStack palette */
      --bg: #0b0f0c;              /* near-black */
      --bg-2: #121814;            /* panel */
      --felt: #1a7d40;            /* poker table green */
      --felt-dark:#0e542a;
      --primary:#15c46b;          /* neon green accent */
      --primary-2:#0ddf78;        
      --accent:#e21d2b;           /* spade red */
      --ink:#e6f2e9;              /* light text */
      --muted:#9fb6a8;            /* muted text */
      --card:#0f1512aa;           /* glass */
      --stroke: #1f2a23;          /* borders */
      --shadow: 0 20px 60px rgba(0,0,0,.55);
      --radius: 20px;
      --radius-lg: 28px;
    }

    *{box-sizing:border-box}
    html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:Montserrat,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;scroll-behavior:smooth}
    a{color:inherit;text-decoration:none}
    img{max-width:100%;display:block}
    .container{width:min(1200px,92%);margin:0 auto}

    /* ===== NAVBAR ===== */
    .navbar{position:sticky;top:0;z-index:50;background:linear-gradient(180deg, rgba(11,15,12,.9), rgba(11,15,12,.6) 70%, transparent);backdrop-filter:saturate(140%) blur(6px);border-bottom:1px solid rgba(255,255,255,.05)}
    .nav-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0}
    .brand{display:flex;align-items:center;gap:12px}
    .brand img{height:100px;width:auto;filter:drop-shadow(0 2px 10px rgba(0,0,0,.35))}
    .brand .wordmark{font-weight:800;letter-spacing:.5px}
    .nav-links{display:flex;align-items:center;gap:22px}
    .nav-links a{opacity:.9}
    .nav-links a:hover{opacity:1}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 18px;border:1px solid var(--stroke);border-radius:999px;background:linear-gradient(180deg,#14201a,#0d1712);color:var(--ink);box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}
    .btn:hover{border-color:#244533}
    .btn.primary{border:0;background:linear-gradient(180deg,var(--primary),var(--felt));color:#02160b; font-weight:800}

    .mobile-toggle{display:none;border:1px solid var(--stroke);border-radius:10px;background:transparent;padding:8px}
    .mobile-toggle span{display:block;width:22px;height:2px;background:#e6f2e9;margin:5px 0}

    @media (max-width:900px){
      .nav-links{position:fixed;inset:60px 0 auto 0;background:rgba(10,14,12,.98);backdrop-filter:blur(6px);border-bottom:1px solid var(--stroke);padding:18px;display:none}
      .nav-links.open{display:flex;flex-direction:column;gap:14px}
      .mobile-toggle{display:block}
    }

    /* ===== HERO ===== */
    .hero{position:relative;isolation:isolate}
    .hero::before{
      content:"";position:absolute;inset:-10% -10% 0 -10%;z-index:-1;pointer-events:none;
      background:
        radial-gradient(1000px 500px at 20% -10%, rgba(21,196,107,.25), transparent 60%),
        radial-gradient(900px 600px at 90% 0%, rgba(226,29,43,.18), transparent 60%),
        radial-gradient(1200px 700px at 50% 10%, rgba(26,125,64,.28), transparent 65%),
        linear-gradient(180deg, #0a0f0c 0%, #0c140f 40%, #0b0f0c 100%);
    }
    .hero-inner{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:40px;padding:72px 0 48px}
    .kicker{display:inline-block;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--primary-2);font-size:.85rem;margin-bottom:16px}
    h1{font-size:clamp(34px, 4vw, 56px);line-height:1.05;margin:0 0 16px}
    .lead{color:var(--muted);font-size:clamp(16px,1.5vw,18px);max-width:58ch}
    .hero-cta{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}

    .hero-card{position:relative;border-radius:var(--radius-lg);padding:20px;background:radial-gradient(120% 140% at 50% 0%, #113c25, #0b1310 80%);border:1px solid #173724;box-shadow:var(--shadow)}
    .hero-card .table{width:100%;aspect-ratio:2.1/1;border-radius:1000px;position:relative;background:
        radial-gradient(130% 130% at 50% 0%, #2cab64 0%, #1a7d40 35%, #0e542a 80%),
        radial-gradient(100% 160% at 50% 110%, #124526, transparent 70%);
      box-shadow:inset 0 0 40px rgba(0,0,0,.45), 0 18px 40px rgba(0,0,0,.5);
      border:16px solid #2b2b2b;
    }
    .table::after{content:"";position:absolute;inset:8%;border:2px dashed rgba(255,255,255,.12);border-radius:1000px}
    .chip{position:absolute;width:40px;height:40px;border-radius:50%;background:linear-gradient(180deg, #fff, #ddd);left:14%;top:44%;}
    .chip.red{background:linear-gradient(180deg, #ffdde0, #e21d2b)}
    .chip.blue{background:linear-gradient(180deg, #d8e6ff, #2b61e2)}
    .chip.black{background:linear-gradient(180deg, #666, #0a0a0a)}

    /* ===== FEATURES ===== */
    .section{padding:72px 0;border-top:1px solid #0f1a14}
    .section .headline{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}
    .section h2{margin:0;font-size:clamp(26px,3vw,36px)}
    .grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
    .feature{grid-column:span 3;min-height:180px;padding:22px;border-radius:var(--radius);background:linear-gradient(180deg, #101812, #0c120f);border:1px solid var(--stroke);box-shadow:var(--shadow)}
    .feature h3{margin:8px 0 6px;font-size:18px}
    .feature p{margin:0;color:var(--muted);font-size:14px}
    .badge{display:inline-flex;align-items:center;gap:8px;border:1px solid #21402f;background:#0f1713;padding:6px 10px;border-radius:999px;color:var(--primary)}
    .badge svg{width:16px;height:16px}

    @media (max-width:1000px){.feature{grid-column:span 6}}
    @media (max-width:640px){.hero-inner{grid-template-columns:1fr}.feature{grid-column:span 12}}

    /* ===== PRICING ===== */
    .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .card{position:relative;border-radius:var(--radius-lg);padding:26px;background:linear-gradient(180deg,#101712,#0d1310);border:1px solid var(--stroke);box-shadow:var(--shadow)}
    .card.highlight{border:1px solid rgba(21,196,107,.4);box-shadow:0 10px 40px rgba(21,196,107,.15)}
    .price{font-size:34px;font-weight:800}
    .period{color:var(--muted);font-size:14px}
    .card ul{margin:14px 0 0;padding:0;list-style:none;color:var(--muted);font-size:14px}
    .card li{padding:6px 0;display:flex;gap:8px;align-items:center}

    @media (max-width:960px){.cards{grid-template-columns:1fr}}

    /* ===== CLIENTS ===== */
    .marquee{overflow:hidden;border-radius:var(--radius);border:1px dashed #224031;background:linear-gradient(180deg,#0f1713,#0a110e);padding:14px}
    .marquee-track{display:flex;gap:36px;animation:scroll 24s linear infinite;will-change:transform}
    .marquee-item{opacity:.85;font-weight:700;white-space:nowrap;color:#b9d7c5}
    @keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

    /* ===== CONTACT ===== */
    .contact{display:grid;grid-template-columns:1.2fr .8fr;gap:24px}
    .panel{background:var(--card);border:1px solid var(--stroke);border-radius:var(--radius-lg);padding:22px;box-shadow:var(--shadow)}
    .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    .form-grid textarea{grid-column:span 2;min-height:120px}
    input,textarea,select{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #1e2a23;background:#0b120f;color:var(--ink);outline:none}
    input:focus,textarea:focus{border-color:#2b6b45;box-shadow:0 0 0 3px rgba(21,196,107,.2)}
    .submit{margin-top:8px}

    /* ===== FOOTER ===== */
    footer{border-top:1px solid var(--stroke);padding:26px 0;color:var(--muted);font-size:14px}

    /* ===== MODAL ===== */
    .modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;padding:20px}
    .modal.open{display:flex}
    .modal .modal-content{width:min(560px,92%);background:linear-gradient(180deg,#0f1713,#0a100e);border:1px solid var(--stroke);border-radius:18px;padding:24px;box-shadow:var(--shadow)}
    .modal h2{margin:0 0 16px}
    .close-x{position:absolute;right:18px;top:14px;font-size:26px;cursor:pointer;color:#95b7a4}

    /* helpers */
    .muted{color:var(--muted)}
    .row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
    .center{text-align:center}