/* Utah Hockey article typography polish. Scoped to single posts only. */
body.utah-article-polish {
  --utah-article-content-width: min(820px, calc(100vw - 40px));
  --utah-article-media-width: min(960px, calc(100vw - 40px));
  --utah-article-body-size: 17px;
  --utah-article-mobile-body-size: 16px;
  --utah-article-line-height: 1.68;
}

body.utah-article-polish .site-main,
body.utah-article-polish main,
body.utah-article-polish .content-area {
  width: 100%;
}

body.utah-article-polish .entry-header,
body.utah-article-polish .page-header,
body.utah-article-polish article > header {
  width: var(--utah-article-content-width);
  max-width: var(--utah-article-content-width);
  margin-left: auto;
  margin-right: auto;
  padding-top: clamp(34px, 5vw, 72px);
  padding-bottom: clamp(18px, 3vw, 34px);
  text-align: center;
}

body.utah-article-polish .entry-title,
body.utah-article-polish h1.entry-title,
body.utah-article-polish article h1 {
  max-width: var(--utah-article-content-width);
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  line-height: 0.98;
  text-wrap: balance;
  font-size: clamp(38px, 5.2vw, 64px);
}

body.utah-article-polish .entry-meta,
body.utah-article-polish .post-meta,
body.utah-article-polish .posted-on,
body.utah-article-polish .byline,
body.utah-article-polish .cat-links {
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px;
  line-height: 1.5;
}

body.utah-article-polish .entry-content,
body.utah-article-polish .post-content,
body.utah-article-polish article .content,
body.utah-article-polish article > .wp-block-post-content {
  width: var(--utah-article-content-width);
  max-width: var(--utah-article-content-width);
  margin-left: auto;
  margin-right: auto;
  font-size: var(--utah-article-body-size);
  line-height: var(--utah-article-line-height);
}

body.utah-article-polish .entry-content p,
body.utah-article-polish .entry-content li,
body.utah-article-polish .entry-content td,
body.utah-article-polish .entry-content th,
body.utah-article-polish .entry-content figcaption,
body.utah-article-polish .post-content p,
body.utah-article-polish .post-content li {
  text-align: left;
}

body.utah-article-polish .entry-content > p,
body.utah-article-polish .entry-content > ul,
body.utah-article-polish .entry-content > ol,
body.utah-article-polish .entry-content > blockquote,
body.utah-article-polish .entry-content > .wp-block-quote,
body.utah-article-polish .entry-content > .wp-block-list {
  max-width: var(--utah-article-content-width);
  margin-left: auto;
  margin-right: auto;
}

body.utah-article-polish .entry-content > * + * {
  margin-top: clamp(18px, 2.4vw, 28px);
}

body.utah-article-polish .entry-content h2,
body.utah-article-polish .entry-content h3,
body.utah-article-polish .entry-content h4 {
  max-width: var(--utah-article-content-width);
  margin-left: auto;
  margin-right: auto;
  line-height: 1.08;
  text-wrap: balance;
}

body.utah-article-polish .entry-content figure,
body.utah-article-polish .entry-content .wp-block-image,
body.utah-article-polish .entry-content .wp-block-gallery,
body.utah-article-polish .entry-content .wp-caption,
body.utah-article-polish .entry-content > img,
body.utah-article-polish .post-thumbnail,
body.utah-article-polish .featured-image {
  max-width: var(--utah-article-media-width);
  margin-left: auto;
  margin-right: auto;
}

body.utah-article-polish .entry-content img,
body.utah-article-polish .post-content img,
body.utah-article-polish .wp-post-image,
body.utah-article-polish .post-thumbnail img,
body.utah-article-polish .featured-image img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}

body.utah-article-polish .entry-content a {
  text-decoration-thickness: 2px;
  text-underline-offset: 0.16em;
}

body.utah-article-polish .entry-content hr,
body.utah-article-polish .wp-block-separator {
  max-width: var(--utah-article-content-width);
  margin-left: auto;
  margin-right: auto;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.18);
}

body.utah-article-polish .entry-footer,
body.utah-article-polish .post-navigation,
body.utah-article-polish .nav-links {
  width: var(--utah-article-content-width);
  max-width: var(--utah-article-content-width);
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 760px) {
  body.utah-article-polish {
    --utah-article-content-width: calc(100vw - 28px);
    --utah-article-media-width: calc(100vw - 28px);
  }

  body.utah-article-polish .entry-header,
  body.utah-article-polish .page-header,
  body.utah-article-polish article > header {
    padding-top: 28px;
    padding-bottom: 18px;
  }

  body.utah-article-polish .entry-title,
  body.utah-article-polish h1.entry-title,
  body.utah-article-polish article h1 {
    font-size: clamp(34px, 10vw, 48px);
    text-align: left;
  }

  body.utah-article-polish .entry-meta,
  body.utah-article-polish .post-meta,
  body.utah-article-polish .posted-on,
  body.utah-article-polish .byline,
  body.utah-article-polish .cat-links {
    text-align: left;
  }

  body.utah-article-polish .entry-content,
  body.utah-article-polish .post-content,
  body.utah-article-polish article .content,
  body.utah-article-polish article > .wp-block-post-content {
    font-size: var(--utah-article-mobile-body-size);
    line-height: 1.66;
  }

  body.utah-article-polish .entry-content figure,
  body.utah-article-polish .entry-content .wp-block-image,
  body.utah-article-polish .entry-content .wp-block-gallery,
  body.utah-article-polish .entry-content .wp-caption,
  body.utah-article-polish .entry-content > img,
  body.utah-article-polish .post-thumbnail,
  body.utah-article-polish .featured-image {
    width: var(--utah-article-media-width);
    max-width: var(--utah-article-media-width);
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
  }

  body.utah-article-polish .entry-content img,
  body.utah-article-polish .post-content img,
  body.utah-article-polish .wp-post-image,
  body.utah-article-polish .post-thumbnail img,
  body.utah-article-polish .featured-image img {
    width: 100%;
    max-width: 100%;
    float: none !important;
  }
}