/* =========================================================
   4DK NBA — PREMIUM FRONT PAGE REVAMP
   Replaces nba-section.css only.
   Keeps the current NBA page content, links, score ticker,
   season preview, articles, 82-0 challenge and preview desk.
   ========================================================= */

:root{
  --nba-red:#ef4934;
  --nba-orange:#f06a32;
  --nba-gold:#d7b56d;
  --nba-cream:#f4efe5;
  --nba-paper:#ebe4d8;
  --nba-ink:#101013;
  --nba-panel:#17171b;
  --nba-line:#343238;
  --nba-muted:#a9a29a;
}

/* NBA PAGE BASE */
body{
  background:var(--nba-cream);
}

/* Make the NBA section feel like its own publication */
.masthead{
  background:rgba(244,239,229,.98);
  border-color:#d8d0c4;
}
.masthead .brand-mark{
  background:var(--nba-red);
}
.masthead .nav a.active,
.masthead .nav a:hover{
  color:var(--nba-red);
}

/* =========================================================
   HERO / BASKETBALL ANNUAL COVER
   ========================================================= */
.nba-hero{
  position:relative;
  overflow:hidden;
  color:#f7f2ea;
  background:
    radial-gradient(circle at 85% 13%,rgba(239,73,52,.30),transparent 24rem),
    radial-gradient(circle at 12% 92%,rgba(215,181,109,.10),transparent 28rem),
    linear-gradient(135deg,#0b0b0d 0%,#15151a 54%,#09090b 100%);
  border-bottom:1px solid #2a292e;
}
.nba-hero:before{
  content:"4DK BASKETBALL ANNUAL";
  position:absolute;
  left:22px;
  top:50%;
  transform:translate(-45%,-50%) rotate(-90deg);
  transform-origin:center;
  font-size:9px;
  font-weight:1000;
  letter-spacing:.18em;
  color:rgba(255,255,255,.18);
  z-index:2;
  pointer-events:none;
}
.nba-hero:after{
  content:"26/27";
  position:absolute;
  right:-32px;
  top:-48px;
  font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  font-size:clamp(170px,26vw,350px);
  line-height:.8;
  letter-spacing:-.07em;
  color:#fff;
  opacity:.035;
  pointer-events:none;
}
.nba-court-bg{
  position:absolute;
  inset:0;
  opacity:.12;
  background:
    linear-gradient(90deg,transparent 49.75%,#fff 49.9% 50.1%,transparent 50.25%),
    radial-gradient(circle at 50% 50%,transparent 0 128px,#fff 129px 131px,transparent 132px),
    linear-gradient(#fff,#fff) left 7% top 50%/1px 74% no-repeat,
    linear-gradient(#fff,#fff) right 7% top 50%/1px 74% no-repeat;
  pointer-events:none;
}
.nba-hero-grid{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);
  gap:28px;
  align-items:stretch;
  padding-top:50px;
  padding-bottom:52px;
}
.nba-hero-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
}
.nba-kicker,.nba-eyebrow{
  font-size:9px;
  font-weight:1000;
  letter-spacing:.16em;
  color:var(--nba-red);
  text-transform:uppercase;
}
.nba-kicker{
  display:flex;
  align-items:center;
  gap:10px;
}
.nba-kicker:before{
  content:"";
  width:42px;
  height:4px;
  background:var(--nba-red);
}
.nba-hero h1{
  max-width:620px;
  margin:12px 0 18px;
  font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  font-size:clamp(68px,8.6vw,122px);
  line-height:.77;
  letter-spacing:-.025em;
}
.nba-hero-copy p{
  max-width:560px;
  margin:0;
  color:#c6beb5;
  font:20px/1.34 Georgia,'Times New Roman',serif;
}
.nba-hero-nav{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:25px;
}
.nba-hero-nav a{
  padding:9px 11px;
  border:1px solid #44434a;
  background:#121217;
  color:#eee8df;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.09em;
  text-transform:uppercase;
  transition:.2s ease;
}
.nba-hero-nav a:hover{
  border-color:var(--nba-red);
  background:var(--nba-red);
  color:#fff;
}

/* Lead story becomes magazine cover art */
.nba-hero-feature{
  position:relative;
  min-height:510px;
  overflow:hidden;
  border:1px solid #3b3940;
  color:#fff;
  background:#111;
  box-shadow:0 30px 70px rgba(0,0,0,.30);
}
.nba-hero-feature:before{
  content:"LEAD";
  position:absolute;
  right:-18px;
  top:6px;
  z-index:2;
  font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  font-size:105px;
  line-height:1;
  color:#fff;
  opacity:.08;
  pointer-events:none;
}
.nba-hero-feature img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .45s ease;
}
.nba-hero-feature:hover img{
  transform:scale(1.015);
}
.nba-hero-shade{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(0,0,0,.02) 12%,rgba(0,0,0,.88) 100%),
    linear-gradient(90deg,rgba(0,0,0,.38),transparent 72%);
}
.nba-feature-label,.nba-feature-big,.nba-feature-deck,.nba-feature-read{
  position:absolute;
  left:22px;
  z-index:4;
}
.nba-feature-label{
  top:20px;
  padding:7px 9px;
  background:var(--nba-red);
  color:#fff;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.13em;
}
.nba-feature-big{
  bottom:100px;
  right:22px;
  font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  font-size:clamp(46px,5.2vw,74px);
  line-height:.79;
}
.nba-feature-deck{
  right:22px;
  bottom:54px;
  max-width:520px;
  color:#e0d9d1;
  font:15px/1.28 Georgia,serif;
}
.nba-feature-read{
  bottom:23px;
  color:#ff8a60;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.12em;
}

/* =========================================================
   PULSE / LEAGUE STORYLINES
   ========================================================= */
.nba-pulse{
  position:relative;
  border-bottom:1px solid #d7cfc4;
  background:var(--nba-paper);
}
.nba-pulse:before{
  content:"AROUND THE LEAGUE";
  position:absolute;
  left:22px;
  top:13px;
  font-size:7px;
  font-weight:1000;
  letter-spacing:.16em;
  color:#9c9287;
}
.nba-pulse-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
  background:#d3cabc;
  padding-top:28px;
}
.nba-pulse-grid>div{
  min-height:112px;
  padding:16px 17px;
  background:#eee8de;
  transition:.18s ease;
}
.nba-pulse-grid>div:hover{
  background:#f7f2e9;
}
.nba-pulse-grid span{
  display:block;
  color:var(--nba-red);
  font-size:8px;
  font-weight:1000;
}
.nba-pulse-grid strong{
  display:block;
  margin-top:12px;
  font-size:13px;
  letter-spacing:.09em;
}
.nba-pulse-grid small{
  display:block;
  margin-top:6px;
  color:#736c64;
  font-size:10px;
  line-height:1.35;
}

/* =========================================================
   SEASON PREVIEW — MAIN PACKAGE
   ========================================================= */
.nba-season-feature{
  position:relative;
  overflow:hidden;
  padding:46px 0;
  background:#111115;
}
.nba-season-feature:before{
  content:"BASKETBALL ANNUAL";
  position:absolute;
  right:-10px;
  bottom:-35px;
  color:#fff;
  opacity:.025;
  font:1000 100px/1 Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  white-space:nowrap;
}
.nba-season-feature-inner{
  position:relative;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  min-height:330px;
  overflow:hidden;
  border:1px solid #3a383e;
  background:
    radial-gradient(circle at 82% 20%,rgba(239,73,52,.22),transparent 14rem),
    radial-gradient(circle at 12% 85%,rgba(215,181,109,.10),transparent 15rem),
    linear-gradient(135deg,#1b1a1e,#0e0e11 70%);
  color:#f6f0e8;
  box-shadow:0 22px 50px rgba(0,0,0,.20);
}
.season-feature-copy{
  position:relative;
  z-index:3;
  padding:30px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.season-feature-copy h2{
  margin:8px 0 14px;
  font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  font-size:clamp(54px,7.2vw,88px);
  line-height:.80;
  letter-spacing:-.025em;
}
.season-feature-copy p{
  max-width:650px;
  margin:0;
  color:#c1bbb3;
  font:16px/1.45 Georgia,serif;
}
.season-feature-copy b{
  display:block;
  margin-top:22px;
  color:#ff7656;
  font-size:9px;
  letter-spacing:.12em;
}
.season-feature-board{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  border-left:1px solid #35343a;
  background:
    repeating-linear-gradient(90deg,transparent 0 48px,rgba(255,255,255,.035) 49px 50px),
    radial-gradient(circle at center,transparent 0 78px,rgba(255,255,255,.07) 79px 80px,transparent 81px);
  text-align:center;
}
.season-feature-board:before{
  content:"26/27";
  position:absolute;
  right:-12px;
  top:-28px;
  font:1000 120px/1 Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  color:#fff;
  opacity:.05;
}
.season-feature-board span{
  color:var(--nba-gold);
  font-size:8px;
  font-weight:1000;
  letter-spacing:.18em;
}
.season-feature-board strong{
  font-size:18px;
  letter-spacing:.10em;
}
.season-feature-board em{
  color:var(--nba-red);
  font-style:normal;
  font-size:10px;
  font-weight:1000;
}
.season-feature-board small{
  margin-top:9px;
  color:#aaa49d;
  font-size:8px;
  font-weight:900;
  letter-spacing:.10em;
}

/* =========================================================
   LATEST — EDITORIAL STORY WALL
   ========================================================= */
.nba-latest{
  position:relative;
  overflow:hidden;
  padding:54px 0 62px;
  background:
    repeating-linear-gradient(0deg,rgba(17,17,17,.016) 0 1px,transparent 1px 5px),
    var(--nba-cream);
}
.nba-latest:before{
  content:"4DK NBA";
  position:absolute;
  right:-40px;
  top:8px;
  font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  font-size:clamp(120px,20vw,280px);
  line-height:.8;
  color:#111;
  opacity:.025;
  pointer-events:none;
}
.nba-section-head{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:24px;
  margin-bottom:24px;
}
.nba-section-head h2{
  max-width:760px;
  margin:5px 0 0;
  font-size:clamp(36px,5.5vw,62px);
  line-height:.91;
  letter-spacing:-.055em;
  text-transform:uppercase;
}
.nba-section-head>p{
  max-width:335px;
  margin:0;
  color:#6f6861;
  font-size:12px;
  line-height:1.5;
}
.nba-story-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
}
.nba-story-card{
  min-width:0;
  padding-bottom:18px;
  border-bottom:1px solid #cbc3b7;
}
/* Flagship story card */
.nba-story-card:first-child{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:0;
  padding-bottom:0;
  border:1px solid #c9c0b3;
  background:#fffaf2;
}
.nba-story-card:first-child .nba-story-art{
  height:430px;
}
.nba-story-card:first-child .nba-story-copy{
  padding:30px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.nba-story-card:first-child .nba-story-copy h3{
  font-size:clamp(34px,4.4vw,50px);
}
.nba-story-card.wide{
  grid-column:1/-1;
}
.nba-story-art{
  position:relative;
  display:block;
  height:330px;
  overflow:hidden;
  color:#fff;
  background:#111;
  box-shadow:0 15px 32px rgba(17,17,17,.12);
}
.nba-story-card.wide .nba-story-art{
  height:390px;
}
.nba-story-art img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .35s ease;
}
.nba-story-art:hover img{
  transform:scale(1.018);
}
.nba-story-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(0,0,0,.05) 18%,rgba(0,0,0,.86) 100%),
    linear-gradient(90deg,rgba(0,0,0,.32),transparent 72%);
}
.nba-story-label,
.nba-story-art strong,
.nba-story-art small{
  position:absolute;
  left:18px;
  z-index:3;
}
.nba-story-label{
  top:17px;
  padding:6px 8px;
  background:var(--nba-red);
  font-size:8px;
  font-weight:1000;
  letter-spacing:.12em;
}
.nba-story-art strong{
  right:18px;
  bottom:43px;
  font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  font-size:43px;
  line-height:.83;
}
.nba-story-art small{
  bottom:16px;
  color:#ded7cf;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.12em;
}
.nba-story-art.russ .nba-story-label{background:#ef6b2e}
.nba-story-art.miami .nba-story-label{background:#98002e}
.nba-story-art.kawhi .nba-story-label{background:#c8102e}
.nba-story-art.wolves .nba-story-label{background:#78be20;color:#071c2c}
.nba-story-art.awards .nba-story-label{background:#6f45b5}
.nba-story-art.east .nba-story-label{background:#153d71}
.nba-story-art.bucks .nba-story-label{background:#174f36}
.nba-story-copy h3{
  margin:13px 0 7px;
  font:700 30px/1 Georgia,'Times New Roman',serif;
  letter-spacing:-.035em;
}
.nba-story-copy p{
  margin:0 0 10px;
  color:#67605a;
  font-size:12px;
  line-height:1.48;
}
.nba-story-copy .meta{
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
  color:#7c756e;
}

/* =========================================================
   82–0 INTERACTIVE
   ========================================================= */
.nba-challenge{
  position:relative;
  margin:0;
  border-top:1px solid #272327;
  border-bottom:1px solid #272327;
  background:#0d0d10;
}
.nba-challenge .challenge-promo-inner{
  border-color:#38343a;
}
.nba-challenge .eyebrow{
  color:var(--nba-red);
}
.nba-challenge .button{
  background:var(--nba-red);
}

/* =========================================================
   PREVIEW DESK
   ========================================================= */
.nba-preview-desk{
  position:relative;
  overflow:hidden;
  padding:58px 0 64px;
  background:
    radial-gradient(circle at 88% 10%,rgba(239,73,52,.10),transparent 18rem),
    #0e0e11;
  color:#eee8df;
}
.nba-preview-desk:after{
  content:"NEXT";
  position:absolute;
  right:-18px;
  bottom:-45px;
  color:#fff;
  opacity:.025;
  font:1000 180px/1 Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
}
.nba-section-head.preview{
  position:relative;
  z-index:2;
}
.nba-section-head.preview h2{
  color:#f2ece5;
}
.nba-section-head.preview .nba-eyebrow{
  color:#ff6c4d;
}
.nba-text-link{
  color:#ff7656;
  font-size:9px;
  font-weight:1000;
  letter-spacing:.10em;
}
.nba-preview-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.nba-preview-card{
  overflow:hidden;
  border:1px solid #343238;
  background:#161619;
  transition:transform .2s ease,border-color .2s ease;
}
.nba-preview-card:hover{
  transform:translateY(-2px);
  border-color:#57515c;
}
.preview-visual{
  position:relative;
  min-height:255px;
  overflow:hidden;
  display:flex;
  align-items:flex-end;
  padding:18px;
}
.preview-visual strong{
  position:relative;
  z-index:3;
  font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  font-size:35px;
  line-height:.83;
}
.preview-code{
  position:absolute;
  left:15px;
  top:14px;
  z-index:4;
  font-size:9px;
  font-weight:1000;
  letter-spacing:.13em;
}
.preview-number{
  position:absolute;
  right:-4px;
  top:-20px;
  font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  font-size:150px;
  line-height:1;
  opacity:.08;
}
.preview-copy{
  padding:18px;
}
.preview-copy>span{
  font-size:8px;
  font-weight:1000;
  letter-spacing:.12em;
  color:#a29a93;
}
.preview-copy h3{
  margin:5px 0 8px;
  font:700 25px/1 Georgia,serif;
}
.preview-copy p{
  margin:0 0 13px;
  color:#a49c95;
  font-size:11px;
  line-height:1.45;
}
.preview-copy em{
  display:inline-block;
  color:#ff7656;
  font-style:normal;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.11em;
}
.nba-preview-card.heat .preview-visual{
  background:
    linear-gradient(180deg,transparent,rgba(0,0,0,.62)),
    radial-gradient(circle at 76% 22%,rgba(249,160,27,.42),transparent 8rem),
    linear-gradient(135deg,#7f001f,#1a0b0f 70%);
}
.nba-preview-card.okc .preview-visual{
  background:
    linear-gradient(180deg,transparent,rgba(0,0,0,.57)),
    radial-gradient(circle at 77% 20%,rgba(239,59,36,.35),transparent 8rem),
    linear-gradient(135deg,#007ac1,#0b2135 70%);
}
.nba-preview-card.lakers .preview-visual{
  background:
    linear-gradient(180deg,transparent,rgba(0,0,0,.60)),
    radial-gradient(circle at 78% 18%,rgba(253,185,39,.40),transparent 8rem),
    linear-gradient(135deg,#552583,#1a1021 70%);
}
.preview-lines{
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(90deg,transparent 0 54px,rgba(255,255,255,.06) 55px 56px);
}
.preview-rings{
  position:absolute;
  right:-60px;
  bottom:-90px;
  width:260px;
  height:260px;
  border:2px solid rgba(255,255,255,.10);
  border-radius:50%;
  box-shadow:0 0 0 35px rgba(255,255,255,.025),0 0 0 70px rgba(255,255,255,.02);
}
.preview-stars{
  position:absolute;
  right:17px;
  top:15px;
  color:#fdb927;
  font-size:20px;
  letter-spacing:.16em;
}

/* =========================================================
   NBA FOOTER BAND
   ========================================================= */
.nba-footer-band{
  border-top:1px solid #29292d;
  border-bottom:1px solid #29292d;
  background:#09090b;
}
.nba-footer-band .shell{
  display:flex;
  justify-content:space-between;
  gap:20px;
  overflow:auto;
  padding-top:14px;
  padding-bottom:14px;
  white-space:nowrap;
}
.nba-footer-band span{
  font-size:8px;
  font-weight:1000;
  letter-spacing:.14em;
  color:#7f7871;
}
.nba-footer-band span:nth-child(odd){
  color:var(--nba-red);
}

/* =========================================================
   TABLET
   ========================================================= */
@media(max-width:940px){
  .nba-hero:before{display:none}
  .nba-hero-grid{
    grid-template-columns:1fr;
  }
  .nba-hero-feature{
    min-height:440px;
  }
  .nba-pulse-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .nba-season-feature-inner{
    grid-template-columns:1fr;
  }
  .season-feature-board{
    min-height:180px;
    border-left:0;
    border-top:1px solid #35343a;
  }
  .nba-story-grid{
    grid-template-columns:1fr;
  }
  .nba-story-card:first-child{
    grid-column:auto;
    grid-template-columns:1fr;
  }
  .nba-story-card:first-child .nba-story-art{
    height:390px;
  }
  .nba-story-card.wide{
    grid-column:auto;
  }
  .nba-story-card.wide .nba-story-art{
    height:340px;
  }
  .nba-preview-grid{
    grid-template-columns:1fr;
  }
}

/* =========================================================
   MOBILE
   ========================================================= */
@media(max-width:620px){
  .masthead .menu-btn{
    color:#111 !important;
    opacity:1 !important;
  }

  .nba-hero-grid{
    gap:24px;
    padding-top:34px;
    padding-bottom:36px;
  }
  .nba-kicker{
    font-size:8px;
  }
  .nba-kicker:before{
    width:32px;
  }
  .nba-hero h1{
    font-size:clamp(58px,16vw,78px);
    line-height:.79;
  }
  .nba-hero-copy p{
    font-size:18px;
    line-height:1.37;
  }
  .nba-hero-nav{
    gap:6px;
    margin-top:20px;
  }
  .nba-hero-nav a{
    padding:8px 9px;
    font-size:7px;
  }
  .nba-hero-feature{
    min-height:355px;
  }
  .nba-feature-label{
    left:16px;
    top:16px;
  }
  .nba-feature-big{
    left:16px;
    right:16px;
    bottom:84px;
    font-size:44px;
  }
  .nba-feature-deck{
    left:16px;
    right:16px;
    bottom:47px;
    font-size:13px;
  }
  .nba-feature-read{
    left:16px;
    bottom:19px;
  }

  .nba-pulse:before{
    left:16px;
  }
  .nba-pulse-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .nba-pulse-grid>div{
    min-height:98px;
    padding:13px;
  }

  .nba-season-feature{
    padding:34px 0;
  }
  .season-feature-copy{
    padding:22px;
  }
  .season-feature-copy h2{
    font-size:54px;
  }
  .season-feature-copy p{
    font-size:14px;
  }
  .season-feature-board{
    min-height:150px;
  }

  .nba-latest{
    padding-top:42px;
    padding-bottom:48px;
  }
  .nba-section-head{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
    margin-bottom:18px;
  }
  .nba-section-head h2{
    font-size:38px;
  }
  .nba-section-head>p{
    font-size:11px;
  }

  .nba-story-grid{
    gap:20px;
  }
  .nba-story-card:first-child{
    border:0;
    background:transparent;
  }
  .nba-story-card:first-child .nba-story-art,
  .nba-story-art,
  .nba-story-card.wide .nba-story-art{
    height:285px;
  }
  .nba-story-card:first-child .nba-story-copy{
    padding:0;
  }
  .nba-story-card:first-child .nba-story-copy h3,
  .nba-story-copy h3{
    margin-top:12px;
    font-size:28px;
  }
  .nba-story-art strong{
    font-size:37px;
  }

  .nba-preview-desk{
    padding-top:44px;
    padding-bottom:50px;
  }
  .preview-visual{
    min-height:220px;
  }
  .preview-visual strong{
    font-size:32px;
  }
  .preview-copy h3{
    font-size:24px;
  }
}