/* Presentation from the supplied Pro scalper future reference. */

*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0d1117;--bg2:#161b22;--bg3:#1c2330;
  --border:#30363d;--border2:#21262d;
  --text:#e6edf3;--text-dim:#8b949e;--text-bright:#f0f6fc;
  --green:#00e5a0;--red:#ff4d6a;--blue:#4d8fff;--yellow:#f5c842;--orange:#ff8c00;
  --radius:12px;--shadow:0 4px 24px rgba(0,0,0,.5);
}
body{background:var(--bg);color:var(--text);font-family:'Inter','Segoe UI',Arial,sans-serif;min-height:100vh;font-size:14px;line-height:1.5}

/* ── NAV ── */
nav{position:sticky;top:0;z-index:100;background:rgba(13,17,23,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:0 32px;height:60px;display:flex;align-items:center;justify-content:space-between;}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.nav-logo-icon{width:32px;height:32px;background:none;padding:0;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.nav-logo-icon img{width:32px;height:32px;border-radius:8px;object-fit:contain}
.nav-title{font-family:'Syne',sans-serif;font-weight:800;font-size:17px;color:var(--text-bright);letter-spacing:-0.5px;line-height:1.05}
.nav-sub{font-family:inherit;font-size:10px;color:var(--text-dim);letter-spacing:1.4px;text-transform:uppercase;margin-top:4px;white-space:nowrap}
.nav-actions{display:flex;gap:10px}
.btn{display:inline-flex;align-items:center;gap:7px;padding:9px 20px;border-radius:8px;font-size:13px;font-weight:700;cursor:pointer;text-decoration:none;transition:all .15s;border:none;font-family:inherit;letter-spacing:0}
.btn-outline{background:transparent;border:1px solid var(--border2);color:var(--text)}
.btn-outline:hover{border-color:var(--blue);color:var(--blue)}
.btn-primary{background:var(--green);color:#0a0c10}
.btn-primary:hover{opacity:.85}

/* ── HERO SLIDER ── */
.hero{position:relative;height:clamp(260px,31vw,510px);overflow:hidden;isolation:isolate;background:linear-gradient(135deg,#09131c 0%,#102431 52%,#151b2d 100%);border-bottom:1px solid rgba(112,189,255,.15)}
.hero::before{content:'';position:absolute;inset:12px clamp(14px,3vw,46px);z-index:1;border:1px solid rgba(116,195,255,.22);border-radius:20px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 20px 46px rgba(0,0,0,.32);pointer-events:none}
.hero::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(8,13,20,.55),transparent 18%,transparent 82%,rgba(8,13,20,.55));pointer-events:none}
.slide{position:absolute;inset:12px clamp(14px,3vw,46px);opacity:0;overflow:hidden;border-radius:20px;transition:opacity .7s ease,transform .7s ease;transform:scale(1.015);display:flex;align-items:center;justify-content:center;background:#05080d}
.slide.active{opacity:1;transform:scale(1)}
.slide img{width:100%;height:100%;object-fit:contain;background:#05080d}
.slide-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,12,18,.08) 0%,rgba(6,12,18,.08) 62%,rgba(6,12,18,.7) 100%)}
.slide-title{position:absolute;left:28px;bottom:28px;max-width:min(70%,620px);padding:9px 13px;border:1px solid rgba(255,255,255,.16);border-radius:8px;background:rgba(7,14,21,.7);color:#fff;font-size:15px;font-weight:700;letter-spacing:.1px;text-shadow:0 2px 8px rgba(0,0,0,.7);backdrop-filter:blur(10px)}
.slide-placeholder{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:linear-gradient(135deg,#0d1117 0%,#161b22 50%,#1c2330 100%)}
.slide-placeholder h1{font-size:clamp(28px,5vw,52px);font-weight:700;color:var(--text-bright);text-align:center;line-height:1.15}
.slide-placeholder h1 span{color:var(--green)}
.slide-placeholder p{font-size:16px;color:var(--text-dim);text-align:center;max-width:520px}
.slide-cta{display:flex;gap:12px;margin-top:8px}

/* Slider controls */
.slider-dots{position:absolute;bottom:25px;left:50%;transform:translateX(-50%);z-index:3;display:flex;align-items:center;gap:7px;padding:8px 10px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(6,12,18,.68);box-shadow:0 8px 22px rgba(0,0,0,.28);backdrop-filter:blur(10px)}
.dot{width:7px;height:7px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.38);cursor:pointer;transition:width .2s ease,background .2s ease,transform .2s ease}
.dot:hover,.dot:focus-visible{background:#8ab8ff;outline:none;transform:scale(1.15)}
.dot.active{width:24px;background:var(--green)}
.slider-arrow{position:absolute;top:50%;z-index:4;width:44px;height:44px;padding:0;border:1px solid rgba(154,205,255,.3);border-radius:12px;background:rgba(8,16,25,.78);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:25px;line-height:1;transform:translateY(-50%);box-shadow:0 10px 26px rgba(0,0,0,.28);backdrop-filter:blur(10px);transition:background .16s ease,border-color .16s ease,transform .16s ease}
.slider-arrow:hover,.slider-arrow:focus-visible{border-color:var(--green);background:rgba(10,32,37,.95);outline:none;transform:translateY(-50%) scale(1.05)}
.slider-arrow.prev{left:clamp(22px,4vw,64px)}
.slider-arrow.next{right:clamp(22px,4vw,64px)}

/* ── MAIN CONTENT ── */
main{max-width:1200px;margin:0 auto;padding:40px 24px 60px}
.section-title{font-size:13px;font-weight:700;color:var(--text-dim);letter-spacing:.8px;text-transform:uppercase;margin-bottom:16px}

/* ── STAT CARDS ── */
.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:36px}
@media(max-width:980px){.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.stat-card{background:var(--bg2);border:1px solid var(--border);border-radius:16px;padding:20px 22px;position:relative;overflow:hidden;box-shadow:0 18px 38px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.05);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.stat-card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.18);box-shadow:0 22px 46px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.08)}
.stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px}
.stat-card::after{content:'';position:absolute;width:150px;height:150px;border-radius:50%;right:-58px;top:-70px;opacity:.20;filter:blur(2px)}
.stat-card.pnl{background:linear-gradient(135deg,rgba(0,229,160,.18),rgba(77,143,255,.11) 48%,rgba(22,27,34,.96));border-color:rgba(0,229,160,.28)}
.stat-card.green{background:linear-gradient(135deg,rgba(0,229,160,.16),rgba(22,27,34,.96) 58%);border-color:rgba(0,229,160,.24)}
.stat-card.blue{background:linear-gradient(135deg,rgba(77,143,255,.17),rgba(22,27,34,.96) 58%);border-color:rgba(77,143,255,.25)}
.stat-card.orange{background:linear-gradient(135deg,rgba(255,143,0,.18),rgba(22,27,34,.96) 58%);border-color:rgba(255,143,0,.25)}
.stat-card.yellow{background:linear-gradient(135deg,rgba(245,200,66,.18),rgba(22,27,34,.96) 58%);border-color:rgba(245,200,66,.25)}
.stat-card.pnl::before{background:linear-gradient(90deg,var(--green),var(--blue))}
.stat-card.green::before{background:var(--green)}
.stat-card.red::before{background:var(--red)}
.stat-card.blue::before{background:var(--blue)}
.stat-card.orange::before{background:var(--orange)}
.stat-card.yellow::before{background:var(--yellow)}
.stat-card.pnl::after{background:var(--green)}
.stat-card.green::after{background:var(--green)}
.stat-card.blue::after{background:var(--blue)}
.stat-card.orange::after{background:var(--orange)}
.stat-card.yellow::after{background:var(--yellow)}
.stat-label{font-size:10px;color:var(--text-dim);letter-spacing:.7px;text-transform:uppercase;margin-bottom:8px}
.stat-value{font-size:30px;font-weight:800;color:var(--text-bright);letter-spacing:0}
.stat-value.green{color:var(--green)}
.stat-value.red{color:var(--red)}
.stat-value.blue{color:var(--blue)}
.stat-value.orange{color:var(--orange)}
.stat-value.yellow{color:var(--yellow)}
.stat-sub{font-size:12px;color:var(--text-dim);margin-top:5px}
.last50-stat-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1180px){.last50-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ── CHARTS ROW ── */
.charts-row{display:grid;grid-template-columns:1fr 2fr;gap:16px;margin-bottom:36px}
@media(max-width:700px){.charts-row{grid-template-columns:1fr}}
.chart-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:20px}
.chart-card.winloss-card{background:radial-gradient(circle at 8% 10%,rgba(0,229,160,.20),transparent 32%),radial-gradient(circle at 100% 0%,rgba(255,77,106,.18),transparent 34%),linear-gradient(135deg,rgba(77,143,255,.10),rgba(22,27,34,.96));border-color:rgba(0,229,160,.22);box-shadow:0 18px 38px rgba(0,0,0,.24)}
.chart-card h3{font-size:13px;font-weight:700;color:var(--text-bright);margin-bottom:14px}
.donut-wrap{display:flex;align-items:center;gap:22px}
.winloss-card .donut-wrap{min-height:142px}
.winloss-card canvas{width:118px;height:118px}
.legend-item{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:12px}
.winloss-card .legend-item{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:8px 10px;min-width:150px}
.legend-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.legend-label{color:var(--text-dim);flex:1}
.legend-val{color:var(--text-bright);font-weight:700}
.hm-day-label{font-size:9px;color:var(--text-dim);text-align:center;padding-bottom:3px}
.hm-cell{aspect-ratio:1;border-radius:3px;background:rgba(255,255,255,.05);cursor:default;transition:transform .1s}
.hm-cell:hover{transform:scale(1.3)}
.heatmap-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-top:8px}
.hm-tooltip{display:none;position:fixed;background:#1c2330;border:1px solid var(--border);border-radius:6px;padding:5px 9px;font-size:11px;color:var(--text-bright);pointer-events:none;z-index:9999;white-space:nowrap}
.no-data{font-size:12px;color:var(--text-dim);padding:20px 0;text-align:center}

/* ── TRADE TABLE ── */
.table-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.table-card table{width:100%;border-collapse:collapse}
.table-card thead th{padding:10px 14px;text-align:left;font-size:10px;color:var(--text-dim);letter-spacing:.8px;text-transform:uppercase;font-weight:500;background:var(--bg3);white-space:nowrap;border-bottom:1px solid var(--border)}
.table-card thead th.r{text-align:right}
.table-card tbody tr{border-top:1px solid var(--border2);transition:background .12s}
.table-card tbody tr:hover{background:rgba(77,143,255,.05)}
.table-card td{padding:10px 14px;font-size:12px;color:var(--text);vertical-align:middle}
.table-card td.r{text-align:right}
.sym-badge{font-size:9px;padding:2px 6px;border-radius:4px;font-weight:700;letter-spacing:.5px;background:var(--bg3);color:var(--blue);border:1px solid var(--border2)}
.trade-num{font-size:12px;font-weight:600;color:var(--text-dim);white-space:nowrap}
.trade-direction{font-size:11px;font-weight:700;letter-spacing:.5px;white-space:nowrap}
.row-type{font-size:11px;font-weight:500;white-space:nowrap;padding:2px 6px;border-radius:4px}
.row-type.exit{background:rgba(255,77,106,.08);color:var(--red)}
.row-type.entry{background:rgba(77,143,255,.08);color:var(--blue)}
.pnl-wrap{text-align:right;white-space:nowrap}
.pnl-val{font-size:12px;font-weight:600;display:block}
.pnl-val.win{color:var(--green)}
.pnl-val.loss{color:var(--red)}
.pnl-pct{font-size:10px;font-weight:600}
.pnl-pct.win{color:var(--green)}
.pnl-pct.loss{color:var(--red)}
.reason-pill{font-size:9px;padding:2px 6px;border-radius:4px;letter-spacing:.5px;font-weight:700;text-transform:uppercase}
.reason-pill.stoploss,.reason-pill.trailing_stop{background:rgba(255,77,106,.12);color:var(--red)}
.reason-pill.target,.reason-pill.trailing_tp{background:rgba(0,229,160,.1);color:var(--green)}
.reason-pill.bot_shutdown,.reason-pill.smma_cross{background:rgba(245,200,66,.1);color:var(--yellow)}
.reason-pill.master_target{background:rgba(107,126,146,.1);color:var(--text-dim)}
.reason-pill.manual{background:rgba(107,126,146,.1);color:var(--text-dim)}
.row-hover td{background:var(--bg3)}

/* ── FOOTER ── */
.landing-footer{padding:64px 24px 30px;border-top:1px solid rgba(107,184,255,.12);background:linear-gradient(180deg,#0d1117 0%,#0c151e 54%,#101722 100%)}
.footer-shell{position:relative;max-width:1240px;margin:0 auto;overflow:hidden;border:1px solid rgba(130,198,255,.16);border-radius:18px;background:linear-gradient(135deg,rgba(21,36,51,.98),rgba(13,25,34,.98));box-shadow:0 24px 70px rgba(0,0,0,.34)}
.footer-shell::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#4d8fff 0%,#28c7d8 46%,#00e5a0 100%)}
.footer-link-list{display:grid;gap:10px}
.footer-link{display:block;padding:5px 0;color:var(--text);text-decoration:none;font-size:13px;font-weight:600;transition:color .15s ease,transform .15s ease}
.footer-link:hover,.footer-link:focus-visible{color:var(--green);outline:none;transform:translateX(3px)}
.footer-cta{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:34px clamp(24px,5vw,56px);border-bottom:1px solid rgba(255,255,255,.08);background:linear-gradient(90deg,rgba(77,143,255,.12),rgba(0,229,160,.11))}
.footer-eyebrow,.footer-links-label{display:block;margin-bottom:7px;color:#8dbdff;font-size:10px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase}
.footer-cta-text{color:var(--text-bright);font-size:25px;font-weight:700;letter-spacing:0}
.footer-cta-note{max-width:560px;margin:7px 0 0;color:var(--text-dim);font-size:14px;line-height:1.6}
.footer-cta-btn{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;min-height:46px;padding:0 25px;border:1px solid rgba(255,255,255,.16);border-radius:9px;background:linear-gradient(90deg,#4d8fff,#16d3ae);color:#071015;text-decoration:none;font-size:13px;font-weight:800;box-shadow:0 12px 28px rgba(0,205,165,.18);transition:transform .16s ease,box-shadow .16s ease}
.footer-cta-btn:hover,.footer-cta-btn:focus-visible{outline:none;transform:translateY(-2px);box-shadow:0 16px 30px rgba(0,205,165,.28)}
.footer-socials{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:38px;padding:30px clamp(24px,5vw,56px);border-bottom:1px solid rgba(255,255,255,.07)}
.footer-side-links{display:grid;gap:7px}
.footer-side-links.left{justify-items:start;text-align:left}
.footer-side-links.right{justify-items:end;text-align:right}
.footer-icon-row{display:flex;align-items:center;justify-content:center;gap:10px}
.social-round{width:46px;height:46px;border:1px solid rgba(255,255,255,.13);border-radius:12px;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 22px rgba(0,0,0,.22);text-decoration:none;transition:transform .16s ease,border-color .16s ease,filter .16s ease}
.social-round:hover,.social-round:focus-visible{outline:none;transform:translateY(-3px);border-color:rgba(255,255,255,.48);filter:brightness(1.1)}
.social-round svg{width:21px;height:21px;fill:#fff}
.social-youtube{background:#d92335}
.social-linkedin{background:#0a66c2}
.social-instagram{background:linear-gradient(135deg,#ed933a,#cf3978 56%,#6755d9)}
.social-facebook{background:#1877f2}
.footer-bottom{padding:17px 26px;text-align:center;font-size:12px;color:var(--text-dim);background:rgba(0,0,0,.16)}

/* ── MOBILE RESPONSIVE ── */
@media(max-width:768px){
  /* Nav */
  nav{padding:0 16px;height:52px;}
  .nav-title{font-size:14px;}
  .nav-sub{display:none;}
  .btn{padding:7px 13px;font-size:12px;}

  /* Hero slider */
  .hero{height:clamp(225px,54vw,340px);}
  .hero::before{inset:9px 12px;border-radius:14px;}
  .slide{inset:9px 12px;border-radius:14px;}
  .slide-title{left:16px;bottom:16px;max-width:calc(100% - 32px);padding:7px 10px;font-size:12px;}
  .slider-dots{bottom:18px;padding:6px 8px;}
  .slider-arrow{width:34px;height:34px;border-radius:10px;font-size:20px;}
  .slider-arrow.prev{left:20px;}
  .slider-arrow.next{right:20px;}

  /* Main layout */
  main{padding:24px 14px 48px;}

  /* Stat cards */
  .stat-grid{grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:24px;}
  .last50-stat-grid{grid-template-columns:repeat(2,1fr);}
  .stat-value{font-size:22px;}

  /* Charts row */
  .charts-row{grid-template-columns:1fr;gap:12px;margin-bottom:24px;}

  /* Trade table — horizontal scroll wrapper */
  .table-scroll-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .table-card table{min-width:640px;}

  /* footer */
  .landing-footer{padding:44px 14px 22px;}
  .footer-shell{border-radius:16px;}
  .footer-cta{flex-direction:column;align-items:center;padding:28px 18px;text-align:center;}
  .footer-cta-note{font-size:13px;}
  .footer-socials{grid-template-areas:'social social' 'legal support';grid-template-columns:1fr 1fr;gap:24px 18px;padding:24px 18px;}
  .footer-side-links.left{grid-area:legal;justify-items:start;text-align:left;}
  .footer-side-links.right{grid-area:support;justify-items:end;text-align:right;}
  .footer-icon-row{grid-area:social;gap:10px;}
  .social-round{width:44px;height:44px;}
}

@media(max-width:480px){
  .stat-grid{grid-template-columns:repeat(2,1fr);gap:8px;}
  .stat-value{font-size:18px;}
  .stat-label{font-size:9px;}
  .hero{height:205px;}
  .slider-arrow{width:30px;height:30px;font-size:18px;}
  .slider-arrow.prev{left:16px;}
  .slider-arrow.next{right:16px;}
  .footer-cta-text{font-size:22px;}
  .footer-socials{gap:20px 12px;padding:22px 14px;}
  .footer-link{font-size:13px;}
}
