/* AGMTW type scale: defaults and hand-tuned pieces. The size/weight/font/grey
   remapping itself is done by agmtw-type-scale.js on the site's own rules.
   Rollback: delete mu-plugins/agmtw-type-scale.php. */

/* Zero-specificity defaults: only apply where no theme rule sets a size. */
:where(body){font-size:17px}
:where(h1){font-size:40px}
:where(h2){font-size:26px}
:where(h3){font-size:20px}
:where(h4){font-size:17px}
:where(h5){font-size:15px}
:where(h6){font-size:13px}
@media (max-width:760px){:where(h1){font-size:32px}}

/* 4. Body text line height */
.fv-cexcerpt,.v4s p,.entry-content p{line-height:1.55}

/* 8. Secondary greys on dark */
.fv-ovl-year,.fv-ovl-type,.v4s-eyebrow,.aw-card-stats,.v4s-score .t,.v4s-facts-line span,.v4s-dek,.footer-copyright p{color:#bdbcb6 !important}
.fv-ovl-sep{color:rgba(255,255,255,.45) !important}

/* 9. Secondary grey on light */
.v4s-fact dt{color:#5a5955 !important}

/* 10. Logos and tap targets */
.fv-slogo-h{height:26px !important}
.fv-action-btn{min-height:44px !important}
.pl-scope .pl-tab,.pl-scope .pl-geo-more,.pl-scope .pl-svc-find input,.pl-scope .pl-edit,.pl-scope .pl-btn{min-height:44px !important}
@media (min-width:761px){
  #pl-onb .pl-svcs{grid-template-columns:repeat(auto-fill,minmax(116px,1fr)) !important}
  #pl-onb .pl-svc{height:52px !important}
}

/* 5. Step questions ("Which streaming services do you have?") at 20px Display */
.pl-scope .pl-q{font-size:20px !important;font-family:AtypBLDisplay, Helvetica, Arial, sans-serif !important;font-weight:700 !important}

/* Card titles: same 26px on phones as desktop, so they stand above the 17px excerpt */
@media (max-width:760px){
  body #fv-grid .fv-ctitle, body #fv-grid .fv-ctitle a{font-size:26px !important}
}

/* Title page hero: only the title is big */
.v4s-tags .v4s-serial{font-size:13px !important}
.v4s-tags .v4s-serial b{font-size:13px !important}
.v4s-hero-main .v4s-credit{font-size:15px !important}
.v4s-hero-main .v4s-dek{font-size:17px !important}
.v4s-facts-line span{font-size:15px !important}
.v4s-score .n{font-size:40px !important}
@media (max-width:760px){
  .v4s-score .n{font-size:26px !important}
}

/* Phones: clear hierarchy on the homepage setup steps */
@media (max-width:760px){
  /* 1. Step questions sit well below the 32px H1 */
  #pl-onb.pl-scope .pl-q{font-size:17px !important}
  /* 2. Controls in quiet text, not bold Display */
  body #pl-onb.pl-scope .pl-svc-find input,body #pl-onb.pl-scope .pl-geo-m,body #pl-onb.pl-scope .pl-geo-m select,body #pl-onb.pl-scope .pl-more-m,body #pl-onb.pl-scope .pl-later{font-family:AtypV3, Helvetica, Arial, sans-serif !important;font-weight:450 !important}
  body #pl-onb.pl-scope .pl-geo-m select{font-weight:550 !important}
  /* 4. Step 2 collapses to one grey line until step 1 is done */
  #pl-onb .pl-card[data-mode="locked"]{padding:10px 14px !important}
  #pl-onb .pl-card[data-mode="locked"] .pl-q{font-family:AtypV3, Helvetica, Arial, sans-serif !important;font-size:15px !important;font-weight:550 !important;color:var(--pl-muted) !important}
  #pl-onb .pl-card[data-mode="locked"] .pl-num{width:24px !important;height:24px !important;min-width:24px !important;font-size:13px !important}
}

/* Country dropdown was dark-on-dark in dark mode */
html.pl-dark #pl-onb .pl-geo-m select{color:var(--pld-text, #f1f0ec) !important;border-color:var(--pld-line, #3a3a38) !important}
html.pl-dark #pl-onb .pl-geo-m select option{color:#10100f}
