/* pickleball-desktop-tier-1.0.css — Baseline / Rally / Circuit on a desktop, 22 Oct 2026.
   The home page's Desktop A Split (desktop-1.0.css) carried to the three size pages:
   hero words on the left, the moving picture on the right; each section's heading
   sticks on the left and its content sits on the right. Hero lines stay under 70ch.
   Everything is inside (min-width:1024px). Nothing changes below 1024 px. */
@media (min-width:1024px){
  :root{--dkmax:1200px}
  .wrap{max-width:var(--dkmax)!important;padding-inline:40px}
  .hero{padding:56px 0 72px}
  .hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:1fr auto auto 1fr;column-gap:64px}
  .hero .htext{grid-area:2 / 1}
  .hero .hfoot{grid-area:3 / 1}
  .hero .hvis{grid-area:1 / 2 / 5 / 3;align-self:center;min-width:0}
  .hero .hvis>:first-child{margin-top:0}
  .hero .lede{max-width:40ch;font-size:18px}
  .hero p{max-width:min(100%,60ch);margin-inline:auto}
  section{padding:88px 0}
  section .wrap{display:grid;grid-template-columns:minmax(260px,4fr) 8fr;column-gap:64px;align-items:start}
  section .wrap>.shead{position:sticky;top:96px;grid-row:1 / span 9;margin-bottom:0}
  section .wrap>.shead h2{font-size:clamp(32px,3vw,44px)}
  section .wrap>*:not(.shead){grid-column:2;min-width:0}
  #inside .cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
  #tiers .wrap{display:block}
  #tiers .wrap>.shead{position:static;margin-bottom:22px}
}
