/*
 * UTMoody — Large Screen / Wide Monitor Scaling
 * Applied to all pages. Fluid typography + container expansion at ≥ 1601px.
 * All existing mobile/tablet breakpoints are untouched.
 */

/* ── Fluid container widths ─────────────────────────────────────────────── */
@media(min-width:1601px){

  /* Shared header */
  .hdr-inner{
    max-width: min(2000px, calc(100% - 80px)) !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
  .hdr-link{ font-size:13px }
  .hdr-brand-title{ font-size: clamp(15px,1.1vw,22px) }

  /* ── HOME PAGE ──────────────────────────────────────────────────────── */
  .hp-hero,
  .hp-chips,
  .hp-divider,
  .hp-section,
  .hp-footer-inner,
  .hp-engine-inner{
    max-width: min(2000px, calc(100% - 80px)) !important;
    padding-left:  40px !important;
    padding-right: 40px !important;
  }
  .hp-hero        { padding-top:80px !important; padding-bottom:56px !important; gap:64px !important }
  .hp-section     { padding-top:60px !important; padding-bottom:60px !important }

  /* Home hero text */
  .hp-hero-title  { font-size: clamp(90px, 7.5vw, 200px) !important }
  .hp-hero-desc   { font-size: clamp(15px, 1.1vw, 20px) !important; max-width:680px !important; line-height:1.7 !important }
  .hp-hero-brand  { font-size: clamp(16px, 1.2vw, 26px) !important }

  /* Home hero inventory grid */
  .hp-hero-inventory{ width:780px !important; gap:16px !important }

  /* Home section labels */
  .hp-section-title  { font-size:14px !important; letter-spacing:.2em !important }
  .hp-dc-group-label { font-size: clamp(21px, 1.6vw, 32px) !important }

  /* Home pathway cards */
  .hp-pathways     { gap:28px !important }
  .hp-pathway      { padding:44px 36px !important; gap:14px !important }
  .hp-pathway-icon { font-size:36px !important }
  .hp-pathway-name { font-size: clamp(36px, 2.5vw, 52px) !important }
  .hp-pathway-desc { font-size: clamp(13px, 0.9vw, 17px) !important; line-height:1.65 !important }
  .hp-pathway-label{ font-size:13px !important }
  .hp-pathway-arrow{ font-size:12px !important; padding-top:20px !important }

  /* ── SHOP PAGE ──────────────────────────────────────────────────────── */
  .page{
    max-width: min(2000px, calc(100% - 80px)) !important;
    padding-left:  40px !important;
    padding-right: 40px !important;
  }
  /* Shop card grid — more columns at wide */
  .grid{ grid-template-columns: repeat(5, 1fr) !important }

  /* ── FARM + MLB TODAY (shared layout classes) ───────────────────────── */
  .hero-wrap,
  .hero-divider,
  .rank-tabs,
  .farm-search-wrap,
  .farm-wrap,
  .team30-wrap,
  .page-tabs,
  .section,
  footer{
    max-width: min(2000px, calc(100% - 80px)) !important;
    padding-left:  40px !important;
    padding-right: 40px !important;
  }
  /* Farm table fills its wider container */
  .farm-wrap{ overflow-x: auto }
  .farm-table{ font-size: clamp(13px, 0.9vw, 15px) !important }
  .farm-table th{ font-size: clamp(9px, 0.65vw, 12px) !important; padding:10px 16px !important }
  .farm-table td{ padding:10px 16px !important }
  .hero{ max-width: min(2000px, calc(100% - 80px)) !important; padding-left:40px !important; padding-right:40px !important }
  .hero-wrap{ padding-top:56px !important; padding-bottom:36px !important; gap:60px !important }

  /* Farm/MLB Today hero text */
  .hero-title  { font-size: clamp(64px, 5.5vw, 140px) !important }
  .hero-desc   { font-size: clamp(13px, 0.95vw, 17px) !important; max-width:600px !important; line-height:1.7 !important }
  .hero-subtitle{ font-size: clamp(13px, 0.95vw, 17px) !important }

  /* Farm table */
  .farm-table-wrap{ overflow-x:auto }
  .farm-table td,
  .farm-table th { font-size: clamp(13px, 0.9vw, 16px) !important }

  /* MLB Today section headings */
  .section-title { font-size: clamp(18px, 1.4vw, 26px) !important }

  /* Prospect watch panel */
  .watch-card-title { font-size: clamp(18px, 1.4vw, 26px) !important }
}

/* ── Very wide (≥ 2001px) — push further ───────────────────────────────── */
@media(min-width:2001px){
  .hdr-inner,
  .hp-hero,.hp-chips,.hp-divider,.hp-section,.hp-footer-inner,.hp-engine-inner,
  .page,
  .hero-wrap,.hero-divider,.rank-tabs,.farm-search-wrap,.farm-wrap,.team30-wrap,
  .page-tabs,.section,footer,.hero{
    max-width: min(2400px, calc(100% - 120px)) !important;
    padding-left:  60px !important;
    padding-right: 60px !important;
  }
  .hp-hero-title { font-size: clamp(110px, 8vw, 240px) !important }
  .hp-pathway-name{ font-size: clamp(40px, 2.8vw, 64px) !important }
  .hp-hero-inventory{ width:940px !important; gap:20px !important }
  .grid{ grid-template-columns: repeat(6, 1fr) !important }
}
