/* The season banner.
   Built on the theme's own tokens so it reads as part of the site rather than an advert bolted onto it.
   Warmer than the rest of the page on purpose: this is the one place we are allowed to raise our voice. */

.of-season{
  position:relative; overflow:hidden;
  background:
    radial-gradient(120% 140% at 88% 18%, rgba(255,106,44,.20) 0%, rgba(255,106,44,0) 58%),
    linear-gradient(180deg, var(--gunmetal) 0%, var(--ink) 100%);
  border-bottom:1px solid var(--hair);
}
/* A thin blaze line along the top. Hunter orange is the one colour this audience reads instantly. */
.of-season::before{
  content:""; position:absolute; inset:0 0 auto 0; height:3px;
  background:linear-gradient(90deg, var(--orange) 0%, var(--orange-600) 42%, transparent 100%);
}

.of-season__inner{ display:grid; gap:28px; padding:34px 0 36px; }

.of-season__kicker{
  display:inline-block; margin:0 0 10px; padding:5px 12px;
  border:1px solid rgba(255,106,44,.45); border-radius:99px; background:var(--orange-050);
  font-family:var(--cond); text-transform:uppercase; letter-spacing:.1em; font-weight:600;
  font-size:12px; color:var(--orange);
}
.of-season__line{
  margin:0 0 10px; font-family:var(--disp); font-size:30px; line-height:1.12;
  color:var(--white); text-wrap:balance;
}
.of-season__sub{ margin:0 0 20px; color:var(--muted); line-height:1.6; max-width:52ch; }
.of-season__cta{ margin:0; display:flex; flex-wrap:wrap; gap:12px; }

/* The openers. Dates rather than slogans, because a date is the thing that makes someone act. */
.of-season__dates{ list-style:none; margin:0; padding:0; display:grid; gap:10px; align-content:start; }
.of-season__date a{
  display:grid; grid-template-columns:1fr auto; align-items:center; gap:4px 14px;
  padding:13px 16px; border:1px solid var(--hair-2); border-radius:var(--r-lg);
  background:rgba(0,0,0,.28); color:var(--text); transition:border-color .15s, transform .15s;
}
.of-season__date a:hover{ border-color:var(--orange); transform:translateX(2px); }
/* Place all three explicitly. Leaving the state name to auto-placement let it land in the second
   column beside the day count, so the card read "23 days Georgia" with the name pushed to the right. */
.of-season__state{
  grid-column:1; grid-row:1;
  font-family:var(--disp); font-size:17px; color:var(--white); line-height:1.2;
}
.of-season__when{ grid-column:1; grid-row:2; font-size:13px; color:var(--muted); }
.of-season__count{
  grid-column:2; grid-row:1 / span 2; align-self:center;
  font-family:var(--cond); font-weight:600; letter-spacing:.04em;
  font-size:15px; color:var(--orange); white-space:nowrap; text-align:right;
}
.of-season__date.is-open .of-season__count{ color:var(--success); }
.of-season__date.is-open a{ border-color:rgba(70,208,127,.45); }

@media (min-width:860px){
  .of-season__inner{ grid-template-columns:1.25fr .85fr; gap:52px; align-items:center; padding:46px 0 48px; }
  .of-season__line{ font-size:38px; }
}
@media (max-width:519px){
  .of-season__cta .btn{ flex:1 1 100%; text-align:center; }
  .of-season__line{ font-size:26px; }
}

/* ---- season hub and state pages -------------------------------------------------------- */
.season__list{ list-style:none; margin:0; padding:0; display:grid; gap:1px; background:var(--hair);
  border:1px solid var(--hair); border-radius:var(--r-lg); overflow:hidden; }
.season__row{ display:grid; grid-template-columns:1fr auto; gap:2px 16px; padding:15px 18px; background:var(--surface-2); align-items:center; }
.season__state{ grid-column:1; grid-row:1; font-family:var(--disp); font-size:19px; color:var(--white); }
.season__state a{ color:inherit; border-bottom:2px solid var(--orange); }
.season__state a:hover{ color:var(--orange); }
.season__dates{ grid-column:1; grid-row:2; font-size:14px; color:var(--muted); }
.season__count{ grid-column:2; grid-row:1; text-align:right; font-family:var(--cond); font-weight:600;
  letter-spacing:.04em; font-size:16px; color:var(--orange); white-space:nowrap; }
.season__row.is-open .season__count{ color:var(--success); }
.season__flag{ grid-column:2; grid-row:2; text-align:right; font-family:var(--cond);
  text-transform:uppercase; letter-spacing:.06em; font-size:11px; color:var(--muted-2); white-space:nowrap; }
.season__flag.is-verified{ color:var(--success); }
.season--state .ship__verdict{ font-size:26px; margin:12px 0 10px; }
.season__gear-head{ font-family:var(--disp); font-size:24px; color:var(--white); margin:38px 0 8px;
  padding-top:28px; border-top:1px solid var(--hair); }

/* The signpost to the blaze orange. It sits above sixteen boxes of ammunition, so a visitor who never
   scrolls still learns that the one thing the law obliges them to wear is stocked here. */
.season__flagline{
  display:flex; flex-wrap:wrap; align-items:center; gap:10px;
  margin:22px 0 0; padding:14px 18px;
  border:1px solid rgba(255,106,44,.45); border-left:4px solid var(--orange);
  border-radius:var(--r-lg); background:var(--orange-050);
  color:var(--text); line-height:1.55;
}
.season__flagline-tag{
  font-family:var(--cond); text-transform:uppercase; letter-spacing:.09em; font-weight:600;
  font-size:12px; color:var(--orange); white-space:nowrap;
  padding:3px 10px; border:1px solid rgba(255,106,44,.5); border-radius:99px;
}
.season__flagline a{ color:var(--orange); border-bottom:1px solid currentColor; white-space:nowrap; }
.season__flagline a:hover{ color:var(--white); border-bottom-color:var(--white); }
.season__gear-head{ scroll-margin-top:110px; }