/* SMG news routes for olerrelo.com — the listing (/news/, categories) and the three post
   layouts. Colours and type come from the Elementor kit's global variables, with the kit's
   own values (read 2026-10-19) as fallbacks: Primary #005AAB, Secondary #006DAB, Footer
   #2C405B, Grey Field #F6F6F6, Muted Blue #EDF7FF, gold buttons #D99600→#B17901, Montserrat.
   Floors from the SMG Design Standard: body 16px, tap targets 48px, AA contrast — the kit's
   14px/#7A7A7A body is below both, so the article column sets its own. Spacing on the
   4/8px grid. Scoped to main.smg-news so nothing here reaches an Elementor page.

   The main column is FULL WIDTH and every band paints edge to edge ("Cover", Lee 2026-10-20);
   the words inside stay on the site's 1140px content width (Hello Elementor's own figure).
   Hello's theme.css pins `body:not([class*="elementor-page-"]) .site-main` to 1140px at the
   same specificity as `main.site-main.smg-news` and loads after it, so the selector here
   carries `body` to outrank it — read in the browser 2026-10-20, not guessed. */

body main.site-main.smg-news {
  --sn-primary: var(--e-global-color-primary, #005AAB);
  --sn-secondary: var(--e-global-color-secondary, #006DAB);
  --sn-navy: var(--e-global-color-69c15e0, #2C405B);
  --sn-field: var(--e-global-color-71940d5, #F6F6F6);
  --sn-tint: var(--e-global-color-26f0567, #EDF7FF);
  /* The head band: the kit's Muted Blue let down 10% toward white (Lee 2026-10-20) — #EDF7FF
     becomes #EFF8FF. The quick-answer box keeps the tint itself, as he asked. */
  --sn-band: #EFF8FF;
  --sn-band: color-mix(in srgb, var(--sn-tint) 90%, #fff);
  --sn-text: #333333;
  --sn-muted: #595959;
  --sn-hairline: #D9E2EC;
  --sn-gold: #D99600;
  --sn-gold-dark: #B17901;
  --sn-radius: 14px;
  --sn-max: 1140px;
  --sn-narrow: 760px;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  font-family: var(--e-global-typography-text-font-family, "Montserrat"), sans-serif;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--sn-text);
}
.smg-news *, .smg-news *::before, .smg-news *::after { box-sizing: border-box; }
.smg-news .smg-news-container { max-width: var(--sn-max); margin: 0 auto; padding: 0 24px; }
.smg-news .smg-news-narrow { max-width: var(--sn-narrow); }
.smg-news a { color: var(--sn-secondary); }
.smg-news a:focus-visible { outline: 3px solid var(--sn-gold); outline-offset: 2px; }

/* The head band — full bleed: the background is on the band, the words in the container. */
.smg-news .smg-news-head { background: var(--sn-band); padding: 48px 0 40px; }
.smg-news .smg-news-eyebrow { margin: 0 0 8px; font-size: .8125rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--sn-secondary); }
.smg-news .smg-news-h1 { margin: 0; font-family: var(--e-global-typography-primary-font-family, "Montserrat"), sans-serif; font-size: 2.25rem; font-weight: 900; line-height: 1.15; color: var(--sn-primary); }
.smg-news .smg-news-h2 { margin: 0 0 24px; font-family: var(--e-global-typography-primary-font-family, "Montserrat"), sans-serif; font-size: 1.5rem; font-weight: 900; line-height: 1.2; color: var(--sn-primary); }
.smg-news .smg-news-lead { margin: 16px 0 0; font-size: 1.125rem; line-height: 1.55; color: var(--sn-muted); }
.smg-news .smg-news-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin: 16px 0 0; font-size: .9375rem; color: var(--sn-muted); }
.smg-news .smg-news-meta a { font-weight: 700; text-decoration: none; }
.smg-news .smg-news-meta a:hover { text-decoration: underline; }

/* The listing */
.smg-news .smg-news-listing { padding: 48px 0 64px; }
.smg-news .smg-news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; }
.smg-news .smg-news-card { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--sn-hairline); border-radius: var(--sn-radius); overflow: hidden; transition: box-shadow .2s ease, transform .2s ease; }
.smg-news .smg-news-card:hover { box-shadow: 0 12px 32px rgba(44, 64, 91, .14); transform: translateY(-2px); }
.smg-news .smg-news-card-media { display: block; aspect-ratio: 16 / 9; background: var(--sn-field); }
.smg-news .smg-news-card-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.smg-news .smg-news-card-placeholder { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, var(--sn-tint), var(--sn-field)); }
.smg-news .smg-news-card-body { display: flex; flex-direction: column; flex: 1 1 auto; padding: 20px 24px 24px; }
.smg-news .smg-news-card-meta { display: flex; flex-wrap: wrap; gap: 4px 8px; margin: 0 0 8px; font-size: .8125rem; color: var(--sn-muted); }
.smg-news .smg-news-card-kicker { font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--sn-secondary); }
.smg-news .smg-news-card-title { margin: 0 0 8px; font-family: var(--e-global-typography-primary-font-family, "Montserrat"), sans-serif; font-size: 1.1875rem; font-weight: 800; line-height: 1.3; color: var(--sn-primary); }
.smg-news .smg-news-card-title a { display: block; padding: 8px 0; margin: -8px 0; color: inherit; text-decoration: none; }
.smg-news .smg-news-card-title a::after { content: ""; position: absolute; inset: 0; }
.smg-news .smg-news-card:hover .smg-news-card-title a { text-decoration: underline; }
.smg-news .smg-news-card-excerpt { margin: 0 0 16px; font-size: .9375rem; color: var(--sn-muted); }
.smg-news .smg-news-card-more { margin: auto 0 0; font-weight: 700; }
.smg-news .smg-news-card-more a { position: relative; z-index: 1; display: inline-flex; align-items: center; min-height: 48px; text-decoration: none; }
.smg-news .smg-news-card-more a:hover { text-decoration: underline; }
.smg-news .smg-news-empty { margin: 0 0 24px; }

/* Pagination — pills, 48px each */
.smg-news .smg-news-pagination { margin-top: 48px; }
.smg-news .smg-news-pagination .screen-reader-text { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.smg-news .smg-news-pagination .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.smg-news .smg-news-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; padding: 0 16px; border: 1px solid var(--sn-hairline); border-radius: 24px; background: #fff; color: var(--sn-secondary); font-weight: 700; text-decoration: none; }
.smg-news .smg-news-pagination a.page-numbers:hover, .smg-news .smg-news-pagination .page-numbers.current { background: var(--sn-primary); border-color: var(--sn-primary); color: #fff; }
.smg-news .smg-news-pagination .page-numbers.dots { border-color: transparent; background: none; color: var(--sn-muted); }

/* Buttons — the kit's gold */
.smg-news .smg-news-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 24px; border-radius: var(--sn-radius); background: linear-gradient(180deg, var(--sn-gold) 28%, var(--sn-gold-dark) 57%); color: #fff; font-weight: 700; text-decoration: none; box-shadow: 4px 4px 10px -6px #533A00; }
.smg-news .smg-news-btn:hover { filter: brightness(1.06); color: #fff; }

/* The article column */
.smg-news .smg-news-article { padding: 40px 0 56px; }
.smg-news .smg-news-figure { margin: 0 0 32px; }
.smg-news .smg-news-figure img { display: block; width: 100%; height: auto; border-radius: var(--sn-radius); }
.smg-news .smg-news-prose { font-size: 1.0625rem; line-height: 1.7; }
.smg-news .smg-news-prose > * + * { margin-top: 1.25em; }
.smg-news .smg-news-prose p { margin: 0 0 1.25em; }
.smg-news .smg-news-prose h2, .smg-news .smg-news-prose h3 { font-family: var(--e-global-typography-primary-font-family, "Montserrat"), sans-serif; font-weight: 800; line-height: 1.25; color: var(--sn-primary); margin: 2em 0 .75em; }
.smg-news .smg-news-prose h2 { font-size: 1.5rem; }
.smg-news .smg-news-prose h3 { font-size: 1.25rem; }
.smg-news .smg-news-prose img { max-width: 100%; height: auto; border-radius: var(--sn-radius); }
.smg-news .smg-news-prose ul, .smg-news .smg-news-prose ol { padding-left: 1.5em; }
.smg-news .smg-news-prose blockquote { margin: 1.5em 0; padding: 16px 24px; border-left: 4px solid var(--sn-primary); background: var(--sn-field); border-radius: 0 var(--sn-radius) var(--sn-radius) 0; }
.smg-news .smg-pl-dateline { margin: 0 0 1.25em; color: var(--sn-muted); }
.smg-news .smg-pl-dateline strong { color: var(--sn-text); letter-spacing: .04em; }
.smg-news .smg-pl-about { margin: 40px 0 0; padding: 24px; border-left: 4px solid var(--sn-primary); border-radius: var(--sn-radius); background: var(--sn-field); }
.smg-news .smg-pl-about h2 { margin: 0 0 12px; font-size: 1.125rem; }
.smg-news .smg-pl-about p { margin: 0 0 12px; font-size: 1rem; }
.smg-news .smg-pl-about p:last-child { margin-bottom: 0; }
/* Three classes: the prose paragraph rule above carries a type selector and would
   otherwise zero this margin (measured 0px on 2026-10-20). */
.smg-news .smg-news-prose .smg-pl-contact { margin: 24px 0 0; font-size: 1rem; }
.smg-news .smg-pl-contact a { font-weight: 700; }

/* The way back */
.smg-news .smg-news-back { margin: 32px 0 0; }

/* Video FAQ */
.smg-news .smg-pl-video { position: relative; margin: 0 0 32px; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--sn-radius); background: #000; }
.smg-news .smg-pl-video img, .smg-news .smg-pl-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.smg-news .smg-pl-video img { object-fit: cover; }
.smg-news .smg-pl-video-poster { position: absolute; inset: 0; display: block; }
.smg-news .smg-pl-video-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: inline-flex; align-items: center; gap: 8px; min-height: 56px; padding: 0 24px 0 16px; border: 0; border-radius: 28px; background: linear-gradient(180deg, var(--sn-gold) 28%, var(--sn-gold-dark) 57%); color: #fff; font: inherit; font-weight: 700; cursor: pointer; box-shadow: 0 8px 24px rgba(0, 0, 0, .35); }
.smg-news .smg-pl-video-play:hover, .smg-news .smg-pl-video-play:focus-visible { filter: brightness(1.06); outline: 3px solid #fff; outline-offset: 2px; }
.smg-news .smg-pl-video-duration { position: absolute; right: 12px; bottom: 12px; margin: 0; padding: 4px 10px; border-radius: 16px; background: rgba(0, 0, 0, .7); color: #fff; font-size: .875rem; font-weight: 700; }
.smg-news .smg-pl-qa { margin: 0 0 32px; padding: 24px; border-radius: var(--sn-radius); background: var(--sn-tint); }
.smg-news .smg-pl-qa-label { margin: 0 0 8px; font-size: .8125rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--sn-secondary); }
.smg-news .smg-pl-qa-q { margin: 0 0 12px; font-family: var(--e-global-typography-primary-font-family, "Montserrat"), sans-serif; font-size: 1.25rem; font-weight: 800; line-height: 1.3; color: var(--sn-primary); }
.smg-news .smg-pl-qa-a { margin: 0 0 12px; font-size: 1.0625rem; }
.smg-news .smg-pl-qa-a:last-child { margin-bottom: 0; }
.smg-news .smg-pl-transcript { margin: 32px 0 0; border: 1px solid var(--sn-hairline); border-radius: var(--sn-radius); background: #fff; }
.smg-news .smg-pl-transcript summary { display: flex; align-items: center; justify-content: space-between; min-height: 56px; padding: 12px 20px; cursor: pointer; font-weight: 700; color: var(--sn-primary); list-style: none; }
.smg-news .smg-pl-transcript summary::-webkit-details-marker { display: none; }
.smg-news .smg-pl-transcript summary::after { content: "+"; font-size: 1.5rem; color: var(--sn-secondary); }
.smg-news .smg-pl-transcript[open] summary::after { content: "\2013"; }
.smg-news .smg-pl-transcript-body { padding: 0 20px 20px; }
.smg-news .smg-pl-transcript-body p { margin: 0 0 1em; }
.smg-news .smg-pl-transcript-body p:last-child { margin-bottom: 0; }

/* More from News */
.smg-news .smg-news-more { padding: 48px 0 64px; background: var(--sn-field); }
.smg-news .smg-news-more-all { margin: 32px 0 0; text-align: center; }

@media (max-width: 1024px) {
  .smg-news .smg-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .smg-news .smg-news-container { padding: 0 16px; }
  .smg-news .smg-news-head { padding: 32px 0 28px; }
  .smg-news .smg-news-h1 { font-size: 1.75rem; }
  .smg-news .smg-news-grid { grid-template-columns: 1fr; gap: 24px; }
  .smg-news .smg-news-listing { padding: 32px 0 48px; }
  .smg-news .smg-news-article { padding: 32px 0 48px; }
  .smg-news .smg-pl-qa, .smg-news .smg-pl-about { padding: 20px; }
  .smg-news .smg-pl-video-play span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .smg-news .smg-pl-video-play { min-width: 56px; padding: 0; justify-content: center; }
  .smg-news .smg-news-btn { width: 100%; }
}