:root{
  --fot-about-bg1:#05070d;
  --fot-about-bg2:#08111f;
  --fot-about-bg3:#0a1324;
  --fot-about-card:#0d1728;
  --fot-about-border:rgba(255,255,255,.08);
  --fot-about-text:#e7ecf5;
  --fot-about-muted:#8a94a8;
  --fot-about-green2:#4ade80;
}

/* Betting Tips has body padding 0px. About had 26px, which pushed the
   header down and inward. This is the only difference. */
body.fot-about-body{
  padding:0!important;
  background:var(--fot-about-bg1)!important;
}

body.fot-about-body .space-title-box{
  display:none!important;
}

.fot-about-page{
  margin:0!important;
  padding:0!important;
  color:var(--fot-about-text);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}

.fot-about-stage{
  width:100%;
  box-sizing:border-box;
  overflow:hidden;
  padding:24px 16px 30px;
  background:
    radial-gradient(circle at 85% 8%,rgba(22,135,255,.14),transparent 42%),
    radial-gradient(circle at 12% 4%,rgba(74,222,128,.10),transparent 40%),
    linear-gradient(180deg,var(--fot-about-bg1) 0%,var(--fot-about-bg2) 45%,var(--fot-about-bg3) 100%);
}

.fot-about-hero,
.fot-about-layout{
  width:100%;
  max-width:1280px;
  margin-left:auto;
  margin-right:auto;
  box-sizing:border-box;
}

.fot-about-hero{
  min-height:460px;
  display:flex;
  border:1px solid var(--fot-about-border);
  border-radius:16px;
  background:linear-gradient(135deg,#0b1727 0%,#07111f 100%);
  overflow:hidden;
}

.fot-about-hero-inner{
  width:100%;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:54px 64px;
  background:
    linear-gradient(90deg,rgba(7,17,31,.98) 0%,rgba(7,17,31,.92) 55%,rgba(7,17,31,.68) 100%),
    radial-gradient(circle at 80% 50%,rgba(22,135,255,.18),transparent 35%);
}

.fot-about-eyebrow{
  color:var(--fot-about-green2);
  font-size:13px;
  font-weight:800;
  letter-spacing:1.8px;
  margin-bottom:16px;
}

.fot-about-hero h1{
  color:#fff;
  font-size:clamp(32px,5vw,60px);
  line-height:1.05;
  letter-spacing:-1.8px;
  max-width:1020px;
  margin:0;
}

.fot-about-lead{
  color:var(--fot-about-muted);
  font-size:18px;
  line-height:1.75;
  max-width:820px;
  margin:16px 0 0;
}

.fot-about-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-top:34px;
}

.fot-about-stat{
  border:1px solid var(--fot-about-border);
  border-radius:16px;
  background:var(--fot-about-card);
  padding:19px 16px;
  text-align:center;
}

.fot-about-stat strong{
  display:block;
  color:#fff;
  font-size:26px;
  line-height:1;
  margin-bottom:9px;
}

.fot-about-stat span{
  display:block;
  color:var(--fot-about-muted);
  font-size:13px;
  line-height:1.4;
}

.fot-about-layout{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(280px,.78fr);
  gap:24px;
  align-items:start;
  margin-top:24px;
}

.fot-about-content,
.fot-about-card{
  border:1px solid var(--fot-about-border);
  border-radius:16px;
  background:var(--fot-about-card);
}

.fot-about-content{padding:38px 42px}

.fot-about-content h2{
  color:#fff;
  font-size:27px;
  line-height:1.2;
  margin:38px 0 15px;
  letter-spacing:-.5px;
}

.fot-about-content h2:first-child{margin-top:0}

.fot-about-content p,
.fot-about-content li{
  color:var(--fot-about-text);
  font-size:16px;
  line-height:1.8;
}

.fot-about-content p{margin:0 0 20px}
.fot-about-content ul{margin:4px 0 24px;padding-left:22px}
.fot-about-content li{margin:7px 0}

.fot-about-sidebar{
  display:grid;
  gap:18px;
  position:sticky;
  top:90px;
}

.fot-about-card{padding:24px}

.fot-about-card-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:38px;
  height:38px;
  border-radius:10px;
  background:rgba(34,197,94,.12);
  border:1px solid rgba(34,197,94,.3);
  color:var(--fot-about-green2);
  font-weight:900;
  margin-bottom:15px;
}

.fot-about-card h2{color:#fff;font-size:19px;margin:0 0 15px}

.fot-about-card p,
.fot-about-card li{
  color:var(--fot-about-muted);
  font-size:14px;
  line-height:1.7;
}

.fot-about-card ul{padding-left:18px;margin:0}
.fot-about-card li{margin:6px 0}

.fot-about-card a{
  display:block;
  color:var(--fot-about-green2);
  font-size:14px;
  font-weight:700;
  text-decoration:none;
  padding:10px 0;
  border-bottom:1px solid var(--fot-about-border);
}

.fot-about-card a:last-child{border-bottom:0}
.fot-about-updated{color:var(--fot-about-muted);font-size:12px;text-align:center;margin:0}

@media(max-width:900px){
  .fot-about-stage{padding-top:20px}
  .fot-about-hero{min-height:auto}
  .fot-about-hero-inner{padding:42px 34px}
  .fot-about-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fot-about-layout{grid-template-columns:1fr}
  .fot-about-sidebar{position:static}
}

@media(max-width:560px){
  .fot-about-stage{padding:16px 10px 24px}
  .fot-about-hero-inner{padding:30px 22px}
  .fot-about-hero h1{font-size:32px;letter-spacing:-1px}
  .fot-about-lead{font-size:16px}
  .fot-about-stats{gap:10px}
  .fot-about-stat{padding:16px 10px}
  .fot-about-stat strong{font-size:22px}
  .fot-about-content{padding:28px 22px}
  .fot-about-content h2{font-size:23px}
}
