/* FRG NEWSMATIC — BEGIN: responsive article cards and related posts (1.1) */
/* Related posts: consistent two-column cards, image above title, no text wrapping. */
body.single #theme-content .primary-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    align-items: start;
}
body.single #theme-content .primary-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap > article {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    padding: 0;
    flex: none;
    border: 0;
}
body.single #theme-content .primary-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap > article figure.post-thumb-wrap {
    display: block;
    float: none;
    width: 100%;
    max-width: 100%;
    margin: 0 0 10px;
    padding: 0;
    flex: none;
    overflow: hidden;
    aspect-ratio: 16 / 9;
}
body.single #theme-content .primary-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap > article figure.post-thumb-wrap img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
body.single #theme-content .primary-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap > article .post-element {
    display: block;
    width: 100%;
    min-width: 0;
    padding: 0;
    margin: 0;
    flex: none;
}
body.single #theme-content .primary-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap > article .post-title {
    font-size: 17px;
    line-height: 1.4;
    margin: 0 0 8px;
    overflow-wrap: anywhere;
}
body.single #theme-content .primary-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap > article .post-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 10px;
}
/* Home/archive: only change card layout on phone-sized viewports. */
@media (max-width: 767px) {
    body.home.post-layout--one #theme-content .primary-content article.post,
    body.blog.post-layout--one #theme-content .primary-content article.post,
    body.archive.post-layout--one #theme-content .primary-content article.post {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: 0 0 18px;
        margin: 0 0 18px;
        width: 100%;
        min-width: 0;
    }
    body.home.post-layout--one #theme-content .primary-content article.post > figure.post-thumb-wrap,
    body.blog.post-layout--one #theme-content .primary-content article.post > figure.post-thumb-wrap,
    body.archive.post-layout--one #theme-content .primary-content article.post > figure.post-thumb-wrap {
        display: block;
        flex: none;
        width: 100%;
        max-width: 100%;
        margin: 0 0 12px;
        aspect-ratio: 16 / 9;
        overflow: hidden;
    }
    body.home.post-layout--one #theme-content .primary-content article.post > figure.post-thumb-wrap > a,
    body.blog.post-layout--one #theme-content .primary-content article.post > figure.post-thumb-wrap > a,
    body.archive.post-layout--one #theme-content .primary-content article.post > figure.post-thumb-wrap > a {
        display: block;
        width: 100%;
        height: 100%;
    }
    body.home.post-layout--one #theme-content .primary-content article.post > figure.post-thumb-wrap img,
    body.blog.post-layout--one #theme-content .primary-content article.post > figure.post-thumb-wrap img,
    body.archive.post-layout--one #theme-content .primary-content article.post > figure.post-thumb-wrap img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    body.home.post-layout--one #theme-content .primary-content article.post > .post-element,
    body.blog.post-layout--one #theme-content .primary-content article.post > .post-element,
    body.archive.post-layout--one #theme-content .primary-content article.post > .post-element {
        display: block;
        flex: none;
        width: 100%;
        min-width: 0;
        margin: 0;
        padding: 0;
    }
    body.home.post-layout--one #theme-content .primary-content article.post .post-title,
    body.blog.post-layout--one #theme-content .primary-content article.post .post-title,
    body.archive.post-layout--one #theme-content .primary-content article.post .post-title {
        font-size: 18px;
        line-height: 1.4;
        margin: 0 0 8px;
        overflow-wrap: anywhere;
    }
    body.home.post-layout--one #theme-content .primary-content article.post .post-excerpt,
    body.blog.post-layout--one #theme-content .primary-content article.post .post-excerpt,
    body.archive.post-layout--one #theme-content .primary-content article.post .post-excerpt {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        line-clamp: 3;
        overflow: hidden;
        max-height: 4.8em;
        line-height: 1.6;
        margin: 8px 0;
        overflow-wrap: anywhere;
    }
    body.home.post-layout--one #theme-content .primary-content article.post .post-excerpt p,
    body.blog.post-layout--one #theme-content .primary-content article.post .post-excerpt p,
    body.archive.post-layout--one #theme-content .primary-content article.post .post-excerpt p {
        margin: 0;
    }
    body.single #theme-content .primary-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap {
        grid-template-columns: 1fr;
        gap: 18px;
    }
}
/* FRG NEWSMATIC — END */

/* FRG NEWSMATIC 1.2: robust archive/category mobile layout.
   The previous rules required post-layout--one on BODY, which may be absent. */
@media (max-width: 767px) {
  body.archive #theme-content .primary-content .news-list-wrap > article.post,
  body.category #theme-content .primary-content .news-list-wrap > article.post {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    gap: 0 !important;
    margin: 0 0 22px !important;
    padding: 0 0 18px !important;
    clear: both;
  }
  body.archive #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap,
  body.category #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap {
    float: none !important;
    display: block !important;
    position: relative;
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    margin: 0 0 12px !important;
  }
  body.archive #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap > a,
  body.category #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap > a {
    display: block;
    width: 100%;
    height: 100%;
  }
  body.archive #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap img,
  body.category #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
  }
  body.archive #theme-content .primary-content .news-list-wrap > article.post > .post-element,
  body.category #theme-content .primary-content .news-list-wrap > article.post > .post-element {
    display: block !important;
    float: none !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  body.archive #theme-content .primary-content .news-list-wrap > article.post .post-title,
  body.category #theme-content .primary-content .news-list-wrap > article.post .post-title {
    font-size: 18px;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }
  body.archive #theme-content .primary-content .news-list-wrap > article.post .post-excerpt,
  body.category #theme-content .primary-content .news-list-wrap > article.post .post-excerpt {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
    max-height: 4.8em;
    line-height: 1.6;
    overflow-wrap: anywhere;
  }
}

/* FRG NEWSMATIC 1.2: fix related post thumbnails and text columns. */
body.single #theme-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 22px !important;
}
body.single #theme-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap > article {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.single #theme-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap > article > figure.post-thumb-wrap {
  display: block !important;
  float: none !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  margin: 0 0 10px !important;
}
body.single #theme-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap > article > figure.post-thumb-wrap img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}
body.single #theme-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap > article > .post-element {
  display: block !important;
  float: none !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
@media (max-width: 767px) {
  body.single #theme-content .single-related-posts-section-wrap.layout--list .single-related-posts-wrap {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 18px !important;
  }
}

/* FRG News 1.2 — ONLY the featured image-overlay banner on phones.
   Keep width unchanged; make each image tile approximately 20% taller.
   Regular article cards and desktop layout are deliberately untouched. */
@media (max-width: 767px) {
  .newsmatic-section.banner-layout--five .main-banner-wrap article.slide-item,
  .newsmatic-section.banner-layout--five .main-banner-wrap article.slide-item figure.post-thumb,
  .newsmatic-section.banner-layout--five .main-banner-trailing-posts .post-item,
  .newsmatic-section.banner-layout--five .main-banner-trailing-posts .post-item figure.post-thumb {
    aspect-ratio: 2.12 / 1 !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden;
  }
  .newsmatic-section.banner-layout--five .main-banner-wrap article.slide-item figure.post-thumb img,
  .newsmatic-section.banner-layout--five .main-banner-trailing-posts .post-item figure.post-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
  .newsmatic-section.banner-layout--five .main-banner-wrap .main-banner-slider {
    height: auto !important;
  }
}
/* Readable spacing for the new view counter in post metadata. */
.post-meta .frg-post-views,
.entry-meta .frg-post-views { display: inline-block; margin-inline-start: 7px; }


/* FRG News 1.3 — restore white mobile page background. */
@media (max-width: 767px) {
  /* Search results: center full-width thumbnails and text. */
  body.search #theme-content .news-list-post-wrap > article.list-item {
    display: flex !important; flex-direction: column !important;
    width: 100% !important; min-width: 0 !important;
  }
  body.search #theme-content .news-list-post-wrap > article.list-item > figure.post-thumb-wrap {
    float: none !important; width: 100% !important; max-width: 100% !important;
    margin: 0 auto 12px !important; height: auto !important;
  }
  body.search #theme-content .news-list-post-wrap > article.list-item > figure.post-thumb-wrap img {
    display: block !important; width: 100% !important; height: auto !important;
    max-width: 100% !important; margin: 0 auto !important;
  }
  body.search #theme-content .news-list-post-wrap > article.list-item > .post-element {
    float: none !important; width: 100% !important; min-width: 0 !important;
    padding: 0 !important; margin: 0 !important;
  }
}
/* Some Font Awesome versions lack fa-x-twitter: draw a readable X label. */
.frg-social-icons .fa-x-twitter::before { content: "X"; font-family: Arial, sans-serif; font-weight: 700; }

/* FRG News 1.3.1: hide the envelope icon in Random Post label. */
.random-news-element .title-icon,
.random-news-element .fa-envelope,
.random-news-element .fa-envelope-open { display: none !important; }

/* FRG News 1.3.2: Windows "Stretch" behavior for thumbnails in the main
   home-page article list only. No cropping, no blank margins. Aspect ratios
   may change when the source differs from the thumbnail box. */
body.home #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap img,
body.blog #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap img {
    width: 100% !important;
    height: 100% !important;
    object-fit: fill !important;
}

/* FRG News 1.4: mobile light palette, isolated from explicitly dark mode. */
@media (max-width: 767px) {
  html:has(body.newsmatic_main_body) { color-scheme: light; }
  body.newsmatic_main_body {
    --site-bk-color: #f8f9fa;
    --main-bk-color: #fff;
    color-scheme: light;
    background-color: #f8f9fa !important;
  }
  body.newsmatic_main_body #page,
  body.newsmatic_main_body #theme-content,
  body.newsmatic_main_body #theme-content .site-main,
  body.newsmatic_main_body #theme-content .primary-content,
  body.newsmatic_main_body #theme-content .newsmatic-container {
    background-color: #fff !important;
  }
  body.newsmatic_dark_mode { color-scheme: dark; }
  /* Main banner five: 20% taller on phones; no effect on archives or desktop. */
  #main-banner-section.banner-layout--five .main-banner-wrap article.slide-item,
  #main-banner-section.banner-layout--five .main-banner-trailing-posts article.post-item {
    aspect-ratio: 1.77 / 1 !important;
    height: auto !important;
  }
  #main-banner-section.banner-layout--five .main-banner-wrap article.slide-item figure.post-thumb,
  #main-banner-section.banner-layout--five .main-banner-trailing-posts article.post-item figure.post-thumb {
    aspect-ratio: 1.77 / 1 !important;
    height: 100% !important;
  }
}
/* Main homepage list only: preserve all pixels, fill allocated box (distortion allowed). */
body.home #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap img,
body.blog #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap img,
body.home #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap a img,
body.blog #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap a img {
  width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
}
/* Thumbnail must have a definite display area, including desktop. */
body.home #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap > a,
body.blog #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap > a {
  display: block;
  width: 100%;
  height: 100%;
}

/* FRG News 1.5.10 — desktop HOME main feed only.
   Grid rows take their height from the text column. Thumbnail fills that same
   height and width without cropping. This block is ignored by IE11; its
   separately tested IE layout keeps its own rules. */
@media screen and (min-width: 768px) {
  @supports (display: grid) {
    body.home #theme-content .primary-content .news-list-wrap > article.post,
    body.blog #theme-content .primary-content .news-list-wrap > article.post {
      display: grid !important;
      grid-template-columns: 35% minmax(0, 1fr) !important;
      column-gap: 20px !important;
      align-items: stretch !important;
    }
    body.home #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap,
    body.blog #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap {
      position: relative !important;
      display: block !important;
      width: 100% !important;
      height: auto !important;
      min-height: 110px !important;
      padding: 0 !important;
      margin: 0 !important;
      align-self: stretch !important;
      overflow: hidden !important;
      box-sizing: border-box !important;
    }
    body.home #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap > a,
    body.blog #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap > a {
      position: absolute !important;
      top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important;
      display: block !important;
      width: 100% !important;
      height: 100% !important;
      overflow: hidden !important;
    }
    body.home #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap img,
    body.blog #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap img,
    body.home #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap:hover img,
    body.blog #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap:hover img {
      position: absolute !important;
      display: block !important;
      top: 0 !important; left: 0 !important;
      width: 100% !important;
      height: 100% !important;
      max-width: none !important;
      object-fit: fill !important;
      transform: none !important;
      -webkit-transform: none !important;
      animation: none !important;
    }
    body.home #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap .post-categories,
    body.blog #theme-content .primary-content .news-list-wrap > article.post > figure.post-thumb-wrap .post-categories {
      position: absolute !important; z-index: 2;
    }
    body.home #theme-content .primary-content .news-list-wrap > article.post > .post-element,
    body.blog #theme-content .primary-content .news-list-wrap > article.post > .post-element {
      min-width: 0 !important;
      width: auto !important;
      margin: 0 !important;
    }
  }
}


/* FRG News 1.5.13 — complete source image and correct positioning.
   The theme's generic rule positions images at top:50% and translates them
   upward; removing the transform without resetting top caused half-images
   in 1.5.12. Keep the original tile layout, not the broken CSS overlay. */
@media screen and (min-width: 768px) {
  /* Full source images in the main featured banner (all active layouts). */
  body #main-banner-section figure.post-thumb {
    position: relative;
    overflow: hidden;
  }
  body #main-banner-section figure.post-thumb > a {
    display: block;
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    width: 100%; height: 100%;
  }
  body #main-banner-section figure.post-thumb > a > img {
    display: block !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    max-width: none !important;
    object-fit: fill !important;
    transform: none !important;
    -webkit-transform: none !important;
  }

  /* Bottom carousel: retain its tile height and replace the entire visible
     tile with the source image. No extra whitespace above the photo. */
  body .news-carousel.layout--three article.carousel-item figure.post-thumb-wrap {
    position: relative !important;
    padding: 0 !important;
    aspect-ratio: 16 / 9;
    overflow: hidden !important;
  }
  body .news-carousel.layout--three article.carousel-item figure.post-thumb-wrap > a {
    display: block !important;
    position: absolute !important;
    top: 0; right: 0; bottom: 0; left: 0;
    width: 100% !important; height: 100% !important;
  }
  body .news-carousel.layout--three article.carousel-item figure.post-thumb-wrap > a > img {
    display: block !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    max-width: none !important;
    object-fit: fill !important;
    transform: none !important;
    -webkit-transform: none !important;
  }

  /* Search results: their thumbnails previously shifted 50% down and
     revealed only the lower-right part after the transform was cleared. */
  body.search #theme-content .news-list-post-wrap article.list-item figure.post-thumb-wrap {
    position: relative !important;
    padding: 0 !important;
    aspect-ratio: 16 / 9;
    overflow: hidden !important;
  }
  body.search #theme-content .news-list-post-wrap article.list-item figure.post-thumb-wrap > a {
    display: block !important;
    position: absolute !important;
    top: 0; right: 0; bottom: 0; left: 0;
    width: 100% !important; height: 100% !important;
  }
  body.search #theme-content .news-list-post-wrap article.list-item figure.post-thumb-wrap > a > img {
    display: block !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    max-width: none !important;
    object-fit: fill !important;
    transform: none !important;
    -webkit-transform: none !important;
  }
  /* Category and archive cards: restore all pixels, without changing layout. */
  body.archive #theme-content .primary-content article.post figure.post-thumb-wrap img {
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    object-fit: fill !important;
    transform: none !important; -webkit-transform: none !important;
  }
}


/* FRG News 1.5.14: mobile-only bottom carousel full-frame images.
   1.5.13 corrected this widget at >=768px; mobile continued inheriting
   top:50%, translate(-50%,-50%) and object-fit:cover from main.css.
   The carousel template already supplies the original, uncropped source. */
@media screen and (max-width: 767px) {
  body .news-carousel.layout--three article.carousel-item figure.post-thumb-wrap {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    aspect-ratio: 16 / 9;
    overflow: hidden !important;
  }
  body .news-carousel.layout--three article.carousel-item figure.post-thumb-wrap > a {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }
  body .news-carousel.layout--three article.carousel-item figure.post-thumb-wrap > a > img,
  body .news-carousel.layout--three article.carousel-item figure.post-thumb-wrap:hover > a > img {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: fill !important;
    transform: none !important;
    -webkit-transform: none !important;
    animation: none !important;
  }
}

/* FRG News 1.5.16 — uncropped related thumbnails on ALL screen widths.
   PHP supplies the full source. Override original theme's 70% padding,
   image centering and cover so the complete photo stays visible.
   Scope strictly to single-post related cards; preserve every other block. */
body.single #theme-content .primary-content
.single-related-posts-section-wrap.layout--list
.single-related-posts-wrap > article > figure.post-thumb-wrap {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  padding: 0 !important;
  padding-bottom: 0 !important;
  margin: 0 0 10px !important;
  aspect-ratio: 16 / 9;
  overflow: hidden !important;
}
body.single #theme-content .primary-content
.single-related-posts-section-wrap.layout--list
.single-related-posts-wrap > article > figure.post-thumb-wrap > .post-thumbnail {
  position: absolute !important;
  display: block !important;
  inset: 0 !important;
  top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important; margin: 0 !important;
}
body.single #theme-content .primary-content
.single-related-posts-section-wrap.layout--list
.single-related-posts-wrap > article > figure.post-thumb-wrap > .post-thumbnail > img,
body.single #theme-content .primary-content
.single-related-posts-section-wrap.layout--list
.single-related-posts-wrap > article > figure.post-thumb-wrap:hover > .post-thumbnail > img {
  position: absolute !important;
  display: block !important;
  top: 0 !important; left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: fill !important;
  transform: none !important;
  -webkit-transform: none !important;
  animation: none !important;
}