/* ═══ PropSports API — Shared Styles ═══ */
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;600;700;800&family=Instrument+Sans:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --white:#ffffff; --off:#F7F6F3; --paper:#EFEFEB;
  --ink:#0D0D0D; --ink2:#2A2A2A; --muted:#6B6B6B; --border:#E2E1DC;
  --red:#E8321A; --red2:#FF4429; --green:#0BAA5C; --blue:#1B65F0; --gold:#E8A020;
  --card-shadow:0 2px 20px rgba(0,0,0,0.06),0 0 0 1px rgba(0,0,0,0.05);
  --max:1200px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--white);color:var(--ink);font-family:'Instrument Sans',sans-serif;overflow-x:hidden;line-height:1.6;-webkit-font-smoothing:antialiased;}

/* ── SPORTS BALL BG ── */
.balls-bg{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden;}
.ball{position:absolute;border-radius:50%;opacity:0.06;animation:ballFloat linear infinite;}
@keyframes ballFloat{
  0%{transform:translateY(100vh) rotate(0deg);}
  100%{transform:translateY(-120px) rotate(720deg);}
}
.ball-baseball{
  background:white;
  border:3px solid #ddd;
  box-shadow:inset -4px -4px 8px rgba(0,0,0,0.1);
}
.ball-basketball{
  background:radial-gradient(circle at 35% 35%, #e8831a, #c45a00);
}
.ball-hockey{
  background:radial-gradient(circle at 35% 35%, #555, #222);
  border-radius:4px;
  height:12px !important;
}

/* ── TICKER ── */
.ticker-wrap{background:var(--ink);overflow:hidden;height:36px;display:flex;align-items:center;position:relative;z-index:10;}
.ticker-inner{display:flex;white-space:nowrap;animation:ticker 50s linear infinite;}
.ticker-item{display:inline-flex;align-items:center;gap:8px;padding:0 32px;font-size:12px;font-weight:600;font-family:'JetBrains Mono',monospace;color:rgba(255,255,255,0.7);}
.tscore{color:#F5A623;}
.tlive{display:inline-block;width:6px;height:6px;border-radius:50%;background:#4ade80;animation:blink 1.5s infinite;}
@keyframes ticker{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes blink{0%,100%{opacity:1;}50%{opacity:0.3;}}

/* ── NAV ── */
nav{position:sticky;top:0;z-index:200;background:rgba(255,255,255,0.95);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);padding:0 48px;height:62px;display:flex;align-items:center;justify-content:space-between;}
.logo-wrap{display:flex;align-items:center;gap:10px;text-decoration:none;}
.logo-icon{width:32px;height:32px;flex-shrink:0;}
.logo-text{font-family:'Syne',sans-serif;font-weight:800;font-size:18px;color:var(--ink);letter-spacing:-0.3px;}
.logo-text span{color:var(--red);}
.nav-menu{display:flex;align-items:center;gap:6px;list-style:none;}
.nav-menu a{font-size:13px;font-weight:500;color:var(--muted);text-decoration:none;padding:6px 10px;border-radius:6px;transition:all 0.15s;}
.nav-menu a:hover,.nav-menu a.active{color:var(--ink);background:var(--off);}
.nav-pill{font-size:10px;font-weight:700;letter-spacing:0.5px;text-transform:uppercase;padding:3px 9px;border-radius:4px;background:rgba(232,50,26,0.08);color:var(--red);border:1px solid rgba(232,50,26,0.15);}
.btn-nav{padding:8px 18px;background:var(--ink);color:var(--white);font-size:13px;font-weight:600;border-radius:8px;text-decoration:none;transition:all 0.2s;margin-left:8px;}
.btn-nav:hover{background:var(--ink2);transform:translateY(-1px);}
.hamburger{display:none;flex-direction:column;gap:4px;cursor:pointer;padding:6px;}
.hamburger span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;transition:all 0.3s;}
.mobile-menu{display:none;position:fixed;inset:0;top:62px;background:white;z-index:150;padding:20px;flex-direction:column;gap:4px;}
.mobile-menu a{display:block;padding:12px 16px;font-size:16px;font-weight:500;color:var(--ink);text-decoration:none;border-radius:8px;transition:background 0.15s;}
.mobile-menu a:hover{background:var(--off);}
.mobile-menu .btn-nav{text-align:center;margin-top:12px;}

/* ── SECTIONS ── */
.wrap{max-width:var(--max);margin:0 auto;padding:0 48px;position:relative;z-index:1;}
section{padding:80px 0;position:relative;}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--red);margin-bottom:12px;}
h1{font-family:'Syne',sans-serif;font-size:clamp(44px,6vw,80px);font-weight:800;letter-spacing:-2px;color:var(--ink);line-height:1.0;margin-bottom:18px;}
h2{font-family:'Syne',sans-serif;font-size:clamp(28px,4vw,52px);font-weight:800;letter-spacing:-1.5px;color:var(--ink);line-height:1.05;margin-bottom:14px;}
h3{font-family:'Syne',sans-serif;font-size:22px;font-weight:700;color:var(--ink);margin-bottom:8px;}
.lead{font-size:17px;color:var(--muted);max-width:520px;line-height:1.7;margin-bottom:28px;}
.accent{color:var(--red);}

/* ── BUTTONS ── */
.btn-red{display:inline-block;padding:14px 28px;background:var(--red);color:white;font-weight:700;font-size:14px;border-radius:10px;text-decoration:none;transition:all 0.2s;box-shadow:0 4px 14px rgba(232,50,26,0.3);}
.btn-red:hover{background:var(--red2);transform:translateY(-2px);box-shadow:0 8px 24px rgba(232,50,26,0.4);}
.btn-ink{display:inline-block;padding:14px 28px;background:var(--ink);color:white;font-weight:700;font-size:14px;border-radius:10px;text-decoration:none;transition:all 0.2s;}
.btn-ink:hover{background:var(--ink2);transform:translateY(-1px);}
.btn-ghost{display:inline-block;padding:13px 24px;background:transparent;color:var(--ink);font-weight:600;font-size:13px;border-radius:10px;text-decoration:none;border:1.5px solid var(--border);font-family:'JetBrains Mono',monospace;transition:all 0.2s;}
.btn-ghost:hover{border-color:#bbb;background:var(--off);}
.btn-outline{display:inline-block;padding:11px 20px;background:transparent;color:var(--ink);font-weight:600;font-size:13px;border-radius:8px;text-decoration:none;border:1.5px solid var(--border);transition:all 0.2s;}
.btn-outline:hover{border-color:#aaa;background:var(--off);}

/* ── STATS STRIP ── */
.stats-strip{background:var(--off);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:28px 48px;display:flex;justify-content:center;flex-wrap:wrap;gap:0;}
.stat-box{text-align:center;padding:0 44px;border-right:1px solid var(--border);}
.stat-box:last-child{border-right:none;}
.stat-n{font-family:'Syne',sans-serif;font-size:40px;font-weight:800;color:var(--ink);letter-spacing:-1px;line-height:1;display:block;}
.stat-n em{color:var(--red);font-style:normal;}
.stat-l{font-size:11px;color:var(--muted);font-weight:600;letter-spacing:0.5px;text-transform:uppercase;margin-top:4px;}

/* ── CARDS ── */
.card{background:var(--white);border:1px solid var(--border);border-radius:16px;padding:28px;box-shadow:var(--card-shadow);transition:all 0.25s;}
.card:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(0,0,0,0.1);}
.card-icon{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:16px;}
.icon-red{background:rgba(232,50,26,0.08);}
.icon-blue{background:rgba(27,101,240,0.08);}
.icon-green{background:rgba(11,170,92,0.08);}
.icon-gold{background:rgba(232,160,32,0.08);}

/* ── ENDPOINT CARDS ── */
.ep-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px;}
.ep-card{background:var(--white);border:1px solid var(--border);border-radius:10px;padding:14px 16px;display:flex;gap:12px;align-items:flex-start;transition:all 0.15s;}
.ep-card:hover{border-color:#ccc;box-shadow:var(--card-shadow);}
.get-badge{font-family:'JetBrains Mono',monospace;font-size:9px;font-weight:700;padding:3px 7px;border-radius:4px;background:rgba(11,170,92,0.1);color:var(--green);border:1px solid rgba(11,170,92,0.2);white-space:nowrap;flex-shrink:0;margin-top:2px;}
.ep-path{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ink);margin-bottom:3px;}
.ep-desc{font-size:11px;color:var(--muted);}

/* ── CODE ── */
.code-block{background:#0D1117;border-radius:12px;overflow:hidden;}
.code-header{padding:10px 16px;background:#161B22;border-bottom:1px solid rgba(255,255,255,0.06);display:flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;font-size:11px;color:rgba(255,255,255,0.4);}
.dot{width:10px;height:10px;border-radius:50%;}
pre{padding:20px;overflow-x:auto;font-family:'JetBrains Mono',monospace;font-size:12px;line-height:1.7;color:#e6edf3;}
.kw{color:#FF7B72;} .str{color:#A5D6FF;} .cm{color:#6E7681;} .fn{color:#D2A8FF;} .url{color:#F2CC60;} .num{color:#79C0FF;}

/* ── PRICING ── */
.pricing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:48px;}
.p-card{background:var(--white);border:1.5px solid var(--border);border-radius:20px;padding:28px 24px;position:relative;transition:all 0.25s;}
.p-card:hover{transform:translateY(-4px);box-shadow:0 20px 60px rgba(0,0,0,0.1);}
.p-card.hot{border-color:var(--red);background:linear-gradient(160deg,#fff8f7 0%,var(--white) 100%);}
.hot-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--red);color:white;font-size:10px;font-weight:800;letter-spacing:1px;padding:4px 14px;border-radius:20px;white-space:nowrap;text-transform:uppercase;}
.p-sport{font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-bottom:6px;}
.p-icon{font-size:28px;margin-bottom:10px;display:block;}
.p-name{font-family:'Syne',sans-serif;font-size:22px;font-weight:800;color:var(--ink);margin-bottom:4px;}
.p-price{display:flex;align-items:baseline;gap:2px;margin-bottom:4px;}
.p-dollar{font-size:18px;font-weight:700;color:var(--ink);margin-top:4px;}
.p-num{font-family:'Syne',sans-serif;font-size:48px;font-weight:800;color:var(--ink);line-height:1;}
.p-period{font-size:13px;color:var(--muted);margin-left:2px;}
.p-was{font-size:11px;color:var(--muted);text-decoration:line-through;margin-bottom:16px;}
.p-feats{list-style:none;margin-bottom:24px;}
.p-feats li{font-size:13px;color:var(--ink2);padding:5px 0;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;}
.p-feats li:last-child{border-bottom:none;}
.ck{color:var(--green);font-size:13px;flex-shrink:0;}
.btn-plan{display:block;text-align:center;padding:12px;border-radius:10px;font-weight:700;font-size:13px;text-decoration:none;transition:all 0.2s;}
.btn-plan-red{background:var(--red);color:white;}
.btn-plan-red:hover{background:var(--red2);}
.btn-plan-ink{background:var(--ink);color:white;}
.btn-plan-ink:hover{background:var(--ink2);}
.btn-plan-outline{background:transparent;color:var(--ink);border:1.5px solid var(--border);}
.btn-plan-outline:hover{border-color:#aaa;background:var(--off);}

/* ── SPONSOR ── */
.sponsor-bar{background:var(--ink);padding:48px;border-radius:20px;display:flex;align-items:center;gap:32px;flex-wrap:wrap;}
.sponsor-logo-txt{font-family:'Syne',sans-serif;font-size:30px;font-weight:800;color:white;letter-spacing:-0.5px;white-space:nowrap;}
.sponsor-logo-txt em{color:var(--red);font-style:normal;}
.sponsor-div{width:1px;height:50px;background:rgba(255,255,255,0.15);flex-shrink:0;}
.sponsor-copy h3{font-size:16px;font-weight:700;color:white;margin-bottom:4px;}
.sponsor-copy p{font-size:13px;color:rgba(255,255,255,0.5);max-width:380px;}
.btn-sponsor{margin-left:auto;padding:12px 24px;background:var(--red);color:white;font-weight:700;font-size:13px;border-radius:8px;text-decoration:none;white-space:nowrap;transition:all 0.2s;}
.btn-sponsor:hover{background:var(--red2);}

/* ── FOOTER ── */
footer{background:var(--ink);color:rgba(255,255,255,0.6);padding:60px 48px 32px;}
.footer-grid{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px;}
.footer-brand .logo-text{color:white;}
.footer-tagline{font-size:13px;color:rgba(255,255,255,0.4);margin-top:10px;max-width:220px;line-height:1.6;}
.footer-col h4{font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:rgba(255,255,255,0.3);margin-bottom:14px;}
.footer-col ul{list-style:none;}
.footer-col li{margin-bottom:8px;}
.footer-col a{font-size:13px;color:rgba(255,255,255,0.55);text-decoration:none;transition:color 0.15s;}
.footer-col a:hover{color:white;}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.08);padding-top:24px;max-width:var(--max);margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.footer-copy{font-size:12px;color:rgba(255,255,255,0.2);}
.footer-legal{display:flex;gap:20px;}
.footer-legal a{font-size:12px;color:rgba(255,255,255,0.2);text-decoration:none;}
.footer-legal a:hover{color:rgba(255,255,255,0.5);}

/* ── BREADCRUMB ── */
.breadcrumb{padding:12px 0;display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);}
.breadcrumb a{color:var(--muted);text-decoration:none;}
.breadcrumb a:hover{color:var(--ink);}
.bc-sep{opacity:0.4;}

/* ── ANIMATIONS ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}
.fu{animation:fadeUp 0.6s ease both;}
.d1{animation-delay:0.1s;}.d2{animation-delay:0.2s;}.d3{animation-delay:0.3s;}.d4{animation-delay:0.4s;}.d5{animation-delay:0.5s;}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .pricing-grid{grid-template-columns:1fr 1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px;}
}
@media(max-width:768px){
  nav{padding:0 20px;}
  .nav-menu{display:none;}
  .hamburger{display:flex;}
  .wrap{padding:0 20px;}
  .stats-strip{padding:20px;}
  .stat-box{padding:12px 16px;width:50%;}
  section{padding:56px 0;}
  .sponsor-bar{flex-direction:column;text-align:center;}
  .sponsor-div{width:60px;height:1px;}
  .btn-sponsor{margin-left:0;}
  footer{padding:48px 20px 24px;}
  .footer-grid{grid-template-columns:1fr;gap:24px;}
  .footer-bottom{flex-direction:column;text-align:center;}
}
@media(max-width:600px){
  .pricing-grid{grid-template-columns:1fr;}
  .ep-grid{grid-template-columns:1fr;}
}
