/**
 * Surf News 3.1 — Editorial homepage foundation.
 *
 * This stylesheet is loaded after the legacy global stylesheet and is the
 * single source of truth for front-page layout and presentation.
 */

/* ================================================================
   01. HOMEPAGE VARIABLES
   ================================================================ */
.surf-site--front {
  --surf-home-accent: var(--surf-block-title-color, var(--surf-accent, #8b0000));
  --surf-home-rule: #111;
  --surf-home-soft-rule: #d8d2c8;
  --surf-home-surface: #f7f5f1;
  --surf-home-highlight: #e9e4da;
  --surf-home-title-size: 16px;
  --surf-home-gap: clamp(1rem, 2vw, 1.5rem);
}

/* ================================================================
   02. ADVERTISEMENTS
   ================================================================ */
.surf-header-banner {
  width: 100%;
  padding: 1rem 0;
}

.surf-header-banner__inner {
  text-align: center;
}

.surf-header-banner__inner > div,
.surf-header-banner__inner .block,
.surf-header-banner__inner .block-simpleads,
.surf-header-banner__inner .content,
.surf-header-banner__inner .field,
.surf-header-banner__inner .field__item,
.surf-header-banner__inner .simpleads,
.surf-header-banner__inner .simpleads-advertisement,
.surf-header-banner__inner .slick-list,
.surf-header-banner__inner .slick-track,
.surf-header-banner__inner .slick-slide,
.surf-header-banner__inner .slick-slide > div {
  width: auto;
  max-width: 100%;
  margin-inline: auto;
}

.surf-header-banner__inner .slick-track {
  display: flex;
  justify-content: center;
}

.surf-header-banner__inner .slick-slide { float: none; }

.surf-header-banner__inner :is(a, picture, iframe, object) {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
}

.surf-header-banner__inner img,
.surf-header-banner__inner .simpleads img,
.surf-header-banner__inner .simpleads-advertisement img {
  display: block;
  width: auto !important;
  max-width: 100% !important;
  height: auto;
  margin-inline: auto;
}

/* Flag Ad currently uses SimpleAds block 14. */
#block-surf-news-simpleads-14 img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  margin-inline: auto;
}

/* Homepage banner below the lead package keeps its configured/intrinsic size. */
.surf-home-banner,
.surf-home-banner__inner,
.surf-home-banner__inner > div,
.surf-home-banner__inner .block {
  width: 100%;
  text-align: center;
}

.surf-home-banner__inner :is(a, picture, iframe) {
  display: block;
  max-width: 100%;
  margin-inline: auto;
}

.surf-home-banner__inner img,
.surf-home-banner__inner .simpleads img,
.surf-home-banner__inner .simpleads-advertisement img {
  display: block;
  width: auto !important;
  max-width: 100% !important;
  height: auto;
  margin-inline: auto;
}

/* ================================================================
   03. BLOCK TITLES
   ================================================================ */
/*
 * Covers direct Drupal block headings such as the rendered Latest News H2,
 * ordinary block-title classes, Poll headings and View header headings.
 * Article headlines are intentionally excluded.
 */
.surf-site--front .surf-main--front :is(
  .block.views-element-container > h2,
  .block > h2,
  h2.block-title,
  .block-title,
  .poll-view > h2,
  .view > header > h2,
  .view-header > h2
) {
  display: block !important;
  margin: 0 0 .85rem !important;
  padding: 0 0 .48rem !important;
  border: 0 !important;
  border-bottom: 1px solid currentColor !important;
  background: transparent !important;
  color: var(--surf-home-accent) !important;
  font-family: var(--surf-sans, Arial, Helvetica, sans-serif) !important;
  font-size: var(--surf-home-title-size) !important;
  font-style: normal !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: .075em !important;
  text-align: left !important;
  text-transform: uppercase !important;
}

/* ================================================================
   04. TAXONOMY LABELS
   ================================================================ */
.surf-site--front :is(
  .surf-story-card__kicker,
  .surf-story-card__kicker--above-media,
  .views-field-field-post-category,
  .views-field-field-category,
  .views-field-field-section
) {
  color: var(--surf-accent, #8b0000);
  font-family: var(--surf-sans, Arial, Helvetica, sans-serif);
  font-size: .76rem;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: .09em;
  text-transform: uppercase;
}

/* Latest News taxonomy labels: no line above; a single 1px line below. */
.surf-latest :is(.views-row, .surf-story-card) {
  border-top: 0 !important;
}

.surf-latest :is(
  .surf-story-card__kicker,
  .surf-story-card__kicker--above-media,
  .views-field-field-post-category,
  .views-field-field-category,
  .views-field-field-section
) {
  margin: 0 0 .7rem !important;
  padding: 0 0 .42rem !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--surf-home-rule) !important;
}

/* Category Top Story 1 and 2 use the same below-label rule. */
.surf-front-card--history :is(.views-row, .surf-story-card),
.surf-front-card--weekly :is(.views-row, .surf-story-card),
.surf-front-community-cell :is(.views-row, .surf-story-card) {
  border-top: 0 !important;
}

.surf-front-card--history :is(
  .surf-story-card__kicker,
  .surf-story-card__kicker--above-media,
  .views-field-field-post-category,
  .views-field-field-category,
  .views-field-field-section
),
.surf-front-card--weekly :is(
  .surf-story-card__kicker,
  .surf-story-card__kicker--above-media,
  .views-field-field-post-category,
  .views-field-field-category,
  .views-field-field-section
),
.surf-front-community-cell :is(
  .surf-story-card__kicker,
  .surf-story-card__kicker--above-media,
  .views-field-field-post-category,
  .views-field-field-category,
  .views-field-field-section
) {
  margin: 0 0 .65rem !important;
  padding: 0 0 .42rem !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--surf-home-rule) !important;
}

/* Breaking News uses one 1px lower rule. */
.surf-breaking,
.surf-breaking__inner,
.surf-breaking__label {
  border-top: 0 !important;
}

.surf-breaking { border-bottom: 0 !important; }
.surf-breaking__inner { border-bottom: 1px solid var(--surf-home-rule) !important; }

/* ================================================================
   05. LEAD PACKAGE
   ================================================================ */
.surf-front-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.55fr) minmax(0, 1fr);
  gap: var(--surf-home-gap);
  align-items: start;
}

/* Centre lead byline label and value remain inline as one metadata line. */
.surf-front-hero__centre .views-field-field-by {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .28em;
  margin-top: .55rem;
  font-family: var(--surf-sans, Arial, Helvetica, sans-serif);
  font-size: .78rem;
  font-style: italic;
  font-weight: 650;
  line-height: 1.3;
}

.surf-front-hero__centre .views-field-field-by :is(.views-label, .field-content) {
  display: inline;
  margin: 0;
  padding: 0;
  font: inherit;
}

/* ================================================================
   06. NEWS AND SPORTS PACKAGES
   ================================================================ */
.surf-home-section-wrap { margin-top: clamp(1.5rem, 3vw, 2.5rem); }

.surf-home-section {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, .28fr);
  gap: var(--surf-home-gap);
  align-items: start;
  padding-block: clamp(1rem, 2vw, 1.6rem);
}

.surf-home-section--ads-first {
  grid-template-columns: minmax(220px, .28fr) minmax(0, 1fr);
}

.surf-home-section__content,
.surf-home-section__ads { min-width: 0; }

/* ================================================================
   07. CATEGORY TOP STORIES AND POLL
   ================================================================ */
.surf-front-row--cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  background: transparent !important;
}

.surf-front-card {
  min-width: 0;
  padding: clamp(1.25rem, 2.3vw, 2rem);
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

.surf-front-card + .surf-front-card {
  border-left: 1px solid var(--surf-home-soft-rule);
}

.surf-front-card--poll .poll-view {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent !important;
  box-shadow: none !important;
}

.surf-front-card--poll :is(.poll-view-form, .poll, .vote-form, fieldset, .fieldset-wrapper) {
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
}

.surf-front-card--poll :is(#edit-choice, [id^="edit-choice"]) {
  display: grid;
  gap: .55rem;
}

.surf-front-card--poll .js-form-type-radio {
  position: relative;
  margin: 0;
}

.surf-front-card--poll input.form-radio {
  position: absolute;
  top: 50%;
  left: .85rem;
  width: 16px;
  height: 16px;
  margin: 0;
  transform: translateY(-50%);
  accent-color: var(--surf-home-accent);
}

.surf-front-card--poll label.option {
  display: flex;
  align-items: center;
  min-height: 44px;
  margin: 0;
  padding: .65rem .8rem .65rem 2.55rem;
  border: 1px solid var(--surf-home-soft-rule);
  border-radius: 3px;
  background: #fff;
  color: var(--surf-ink);
  font: 700 .9rem/1.2 var(--surf-sans);
  cursor: pointer;
}

.surf-front-card--poll input.form-radio:checked + label.option {
  border-color: var(--surf-home-accent);
  box-shadow: inset 3px 0 0 var(--surf-home-accent);
}

.surf-front-card--poll .form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin: .9rem 0 0;
}

.surf-front-card--poll .form-actions .form-submit {
  min-height: 38px;
  margin: 0;
  padding: .65rem .9rem;
  border: 1px solid var(--surf-ink);
  border-radius: 2px;
  background: var(--surf-ink);
  color: #fff;
  font: 800 .7rem/1 var(--surf-sans);
  letter-spacing: .07em;
  text-transform: uppercase;
}

.surf-front-card--poll .form-actions input[value="View results"] {
  background: transparent;
  color: var(--surf-ink);
}

/* ================================================================
   08. OP-ED, MULTIMEDIA AND MOST POPULAR
   ================================================================ */
.surf-front-row--editorial {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr) minmax(0, 1fr);
  align-items: stretch;
  background: var(--surf-home-surface);
}

.surf-front-panel {
  min-width: 0;
  padding: clamp(1.25rem, 2.3vw, 2rem);
  background: var(--surf-home-surface);
}

.surf-front-panel + .surf-front-panel {
  border-left: 1px solid var(--surf-home-soft-rule);
}

.surf-front-panel--photos {
  background: linear-gradient(
    to bottom,
    var(--surf-home-highlight) 0%,
    #efebe4 55%,
    var(--surf-home-surface) 100%
  );
}

.surf-front-panel--photos img {
  display: block;
  width: 100%;
  height: auto;
}

/* Op-Ed and Most Popular share exactly the same list rhythm and headlines. */
.surf-front-panel--opinion :is(.views-row, article, .surf-story-card),
.surf-front-panel--popular :is(.views-row, article, .surf-story-card) {
  margin: 0;
  padding: .8rem 0;
  border-top: 0 !important;
  border-bottom: 1px solid var(--surf-home-soft-rule);
}

.surf-front-panel--opinion :is(.views-row, article, .surf-story-card):first-child,
.surf-front-panel--popular :is(.views-row, article, .surf-story-card):first-child {
  padding-top: 0;
}

.surf-front-panel--opinion :is(.views-row, article, .surf-story-card):last-child,
.surf-front-panel--popular :is(.views-row, article, .surf-story-card):last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.surf-front-panel--opinion :is(h2, h3, .views-field-title, .surf-story-card__title),
.surf-front-panel--popular :is(h2, h3, .views-field-title, .surf-story-card__title) {
  margin: 0;
  color: var(--surf-ink);
  font-family: var(--surf-serif, Georgia, "Times New Roman", serif);
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: normal;
  text-transform: none;
}

.surf-front-panel--opinion :is(h2, h3, .views-field-title, .surf-story-card__title) a,
.surf-front-panel--popular :is(h2, h3, .views-field-title, .surf-story-card__title) a {
  color: inherit;
  text-decoration: none;
}

/* ================================================================
   09. OBITUARY ROW
   ================================================================ */
.surf-front-row--community {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: var(--surf-home-surface);
}

.surf-front-community-cell {
  min-width: 0;
  padding-inline: clamp(.75rem, 1.5vw, 1.35rem);
}

.surf-front-community-cell:first-child { padding-left: 0; }
.surf-front-community-cell:last-child { padding-right: 0; }
.surf-front-community-cell + .surf-front-community-cell {
  border-left: 1px solid var(--surf-home-soft-rule);
}

/* ================================================================
   10. LATEST NEWS
   ================================================================ */
.surf-latest .surf-story-card__summary,
.surf-latest .views-field-body,
.surf-latest .views-field-field-subhead,
.surf-latest .views-field-field-summary {
  display: none !important;
}

/* ================================================================
   11. NEWSLETTER AND E-EDITION
   ================================================================ */
.surf-front-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid var(--surf-home-rule);
  background: var(--surf-home-surface);
}

.surf-front-pair > div {
  min-width: 0;
  padding: clamp(1.5rem, 3vw, 2.5rem);
}

.surf-front-pair > div + div {
  border-left: 1px solid var(--surf-home-soft-rule);
}

/* ================================================================
   12. RESPONSIVE
   ================================================================ */
@media (max-width: 900px) {
  .surf-front-hero,
  .surf-home-section,
  .surf-home-section--ads-first,
  .surf-front-row--cards,
  .surf-front-row--editorial {
    grid-template-columns: 1fr;
  }

  .surf-front-card + .surf-front-card,
  .surf-front-panel + .surf-front-panel {
    border-top: 1px solid var(--surf-home-soft-rule);
    border-left: 0;
  }

  .surf-front-row--community {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .surf-front-community-cell { padding: 1rem; }
  .surf-front-community-cell:nth-child(odd) { border-left: 0; }
}

@media (max-width: 640px) {
  .surf-front-row--community,
  .surf-front-pair {
    grid-template-columns: 1fr;
  }

  .surf-front-community-cell,
  .surf-front-community-cell:first-child,
  .surf-front-community-cell:last-child {
    padding: 1.25rem 0;
  }

  .surf-front-community-cell + .surf-front-community-cell,
  .surf-front-pair > div + div {
    border-top: 1px solid var(--surf-home-soft-rule);
    border-left: 0;
  }
}

/* ================================================================
   13. DIRECT DRUPAL BLOCK HEADING CORRECTION — 3.1.1
   ================================================================
   Drupal Views renders region titles as a direct H2 child of the block.
   These explicit selectors intentionally outrank legacy and site-level CSS.
*/
html body .surf-site.surf-site--front main.surf-main.surf-main--front section.surf-shell .views-element-container.contextual-region > h2,
html body .surf-site.surf-site--front main.surf-main.surf-main--front section.surf-shell .block.views-element-container > h2,
html body .surf-site.surf-site--front main.surf-main.surf-main--front section.surf-shell .block > h2:first-child,
html body .surf-site.surf-site--front main.surf-main.surf-main--front section.surf-shell h2.block-title {
  display: block !important;
  margin: 0 0 .85rem !important;
  padding: 0 0 .5rem !important;
  border: 0 !important;
  border-bottom: 1px solid currentColor !important;
  background: transparent !important;
  color: var(--surf-block-title-color, var(--surf-accent, #8b0000)) !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 16px !important;
  font-style: normal !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: .075em !important;
  text-align: left !important;
  text-transform: uppercase !important;
}

/* Exact live Latest News block selector supplied from page source. */
html body .surf-site.surf-site--front #block-surf-news-views-block-surf-cms-latest-news-block-1 > h2 {
  margin: 0 0 .85rem !important;
  padding: 0 0 .5rem !important;
  border: 0 !important;
  border-bottom: 1px solid currentColor !important;
  color: var(--surf-block-title-color, var(--surf-accent, #8b0000)) !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: .075em !important;
  text-transform: uppercase !important;
}


/* ================================================================
   14. NEWSLETTER FEATURE, MASTHEAD ALIGNMENT AND FLAG AD — 3.1.2
   ================================================================ */

/* Three-part masthead: small flag ad, centred publication logo, search. */
.surf-header__main {
  display: grid;
  grid-template-columns: minmax(120px, .75fr) minmax(320px, 2fr) minmax(260px, .9fr);
  align-items: center;
  gap: clamp(1rem, 2.5vw, 2.25rem);
  min-height: 118px;
}

.surf-header__flag-ad,
.surf-header__brand,
.surf-header__account {
  min-width: 0;
  align-self: center;
}

.surf-header__flag-ad {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.surf-header__flag-ad:empty {
  display: block;
}

.surf-header__flag-ad img,
.surf-header__flag-ad picture,
.surf-header__flag-ad iframe {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0;
}

.surf-header__brand {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
}

.surf-header__brand .block,
.surf-header__brand .content,
.surf-header__brand a {
  margin: 0;
}

.surf-header__account {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin: 0;
}

.surf-header__search {
  width: min(100%, 360px);
  margin: 0;
  transform: none !important;
}

.surf-header__search form,
.surf-header-search-form,
.surf-header__search .container-inline {
  margin: 0 !important;
}

/* Newsletter card restored as a clear subscription callout. */
.surf-front-pair__newsletter {
  position: relative;
  overflow: hidden;
  background: var(--surf-home-highlight, #f5f1ea);
}

.surf-front-pair__newsletter::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: var(--surf-block-title-color, var(--surf-accent, #8b0000));
}

.surf-front-pair__newsletter > .region,
.surf-front-pair__newsletter .block,
.surf-front-pair__newsletter form {
  width: 100%;
  margin: 0;
}

.surf-front-pair__newsletter p,
.surf-front-pair__newsletter .form-item {
  margin: .65rem 0;
}

.surf-front-pair__newsletter label {
  display: block;
  margin-bottom: .35rem;
  font-family: var(--surf-sans, Arial, Helvetica, sans-serif);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.surf-front-pair__newsletter input[type="email"],
.surf-front-pair__newsletter input[type="text"] {
  width: 100%;
  min-height: 48px;
  padding: .75rem .9rem;
  border: 1px solid var(--surf-home-rule, #222);
  border-radius: 0;
  background: #fff;
  color: var(--surf-ink, #111);
  font-family: var(--surf-sans, Arial, Helvetica, sans-serif);
  font-size: 1rem;
}

.surf-front-pair__newsletter input[type="email"]:focus,
.surf-front-pair__newsletter input[type="text"]:focus {
  outline: 2px solid var(--surf-block-title-color, var(--surf-accent, #8b0000));
  outline-offset: 2px;
}

.surf-front-pair__newsletter input[type="submit"],
.surf-front-pair__newsletter button[type="submit"] {
  min-height: 46px;
  padding: .75rem 1.25rem;
  border: 1px solid var(--surf-ink, #111);
  border-radius: 0;
  background: var(--surf-ink, #111);
  color: #fff;
  font-family: var(--surf-sans, Arial, Helvetica, sans-serif);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .075em;
  text-transform: uppercase;
  cursor: pointer;
}

.surf-front-pair__newsletter input[type="submit"]:hover,
.surf-front-pair__newsletter button[type="submit"]:hover {
  border-color: var(--surf-block-title-color, var(--surf-accent, #8b0000));
  background: var(--surf-block-title-color, var(--surf-accent, #8b0000));
}

.surf-front-pair__newsletter .description {
  color: var(--surf-muted, #666);
  font-size: .85rem;
  line-height: 1.45;
}

@media (max-width: 1000px) {
  .surf-header__main {
    grid-template-columns: minmax(100px, .55fr) minmax(280px, 1.6fr) minmax(220px, .85fr);
    gap: 1rem;
  }
}

@media (max-width: 800px) {
  .surf-header__main {
    grid-template-columns: 1fr;
    min-height: 0;
    padding-block: .8rem;
    text-align: center;
  }

  .surf-header__flag-ad {
    display: none;
  }

  .surf-header__brand,
  .surf-header__account {
    justify-content: center;
  }

  .surf-header__search {
    width: min(100%, 420px);
  }
}


/* Sprint 1 Masthead */
.surf-header__identity{padding:.5rem 0 1rem;text-align:center;border-top:1px solid #ddd}
.surf-header__date{font-size:.9rem;letter-spacing:.04em;color:#666}
.surf-header__slogan{margin-top:.25rem;font-size:.85rem;font-style:italic;color:#777}
.is-sticky .surf-header__identity,.is-sticky .surf-header-banner{display:none}

/* ================================================================
   15. SURF NEWS 3.2.2 — FRONT-PAGE EDITORIAL POLISH
   Final cascade layer for hierarchy, rhythm, media and responsive detail.
   ================================================================ */

.surf-site--front {
  --surf-home-section-space: clamp(1.5rem, 3.4vw, 3rem);
  --surf-home-content-space: clamp(1rem, 2vw, 1.65rem);
  --surf-home-column-rule: #cec8bd;
  --surf-home-copy: #292929;
}

/* Keep the front page compact above the fold while giving later decks room. */
.surf-main--front {
  padding-top: clamp(.85rem, 1.8vw, 1.4rem);
}

.surf-main--front > .surf-shell {
  margin-inline: auto;
}

.surf-main--front > .surf-shell + .surf-shell {
  margin-top: var(--surf-home-section-space) !important;
}

/* Lead package: one strong editorial unit with restrained column dividers. */
.surf-front-hero {
  gap: 0;
  padding-block: 0 clamp(1.25rem, 2.5vw, 2rem);
  border-bottom: 1px solid var(--surf-home-rule);
}

.surf-front-hero > div {
  min-width: 0;
  padding-inline: clamp(1rem, 2vw, 1.6rem);
}

.surf-front-hero > div:first-child { padding-left: 0; }
.surf-front-hero > div:last-child { padding-right: 0; }
.surf-front-hero > div + div { border-left: 1px solid var(--surf-home-column-rule); }

.surf-front-hero a,
.surf-home-section a,
.surf-front-row a,
.surf-front-editorial-extra a {
  text-decoration-thickness: 1px;
  text-underline-offset: .16em;
}

.surf-front-hero :is(h2, h3, .surf-story-card__title) a:hover,
.surf-home-section :is(h2, h3, .surf-story-card__title) a:hover,
.surf-front-row :is(h2, h3, .surf-story-card__title) a:hover,
.surf-front-editorial-extra :is(h2, h3, .surf-story-card__title) a:hover {
  color: var(--surf-home-accent);
  text-decoration: underline;
}

/* Images share consistent newspaper cropping and never stretch. */
.surf-site--front :is(
  .surf-front-hero,
  .surf-home-section,
  .surf-front-row,
  .surf-front-editorial-extra
) img {
  max-width: 100%;
  height: auto;
}

.surf-front-hero__centre .surf-story-card__media img,
.surf-front-hero__centre .views-field-field-image img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.surf-front-hero__centre :is(.surf-story-card__summary, .views-field-body, .views-field-field-subhead) {
  max-width: 68ch;
  color: var(--surf-home-copy);
  font-size: clamp(1rem, 1.2vw, 1.08rem);
  line-height: 1.48;
}

/* Metadata is quieter and consistent throughout the front page. */
.surf-site--front :is(
  .surf-story-card__meta,
  .views-field-created,
  .views-field-field-by,
  .views-field-uid,
  time
) {
  color: var(--surf-muted, #666);
  font-family: var(--surf-sans, Arial, Helvetica, sans-serif);
  font-size: .76rem;
  line-height: 1.35;
}

/* News and sports packages read as complete editorial decks. */
.surf-home-section-wrap {
  padding-top: 0;
  border-top: 2px solid var(--surf-home-rule);
}

.surf-home-section {
  gap: clamp(1.2rem, 2.5vw, 2rem);
  padding-block: var(--surf-home-content-space) 0 !important;
  border-top: 0 !important;
}

.surf-home-section__ads {
  align-self: start;
  padding-left: clamp(1rem, 2vw, 1.6rem);
  border-left: 1px solid var(--surf-home-column-rule);
}

.surf-home-section--ads-first .surf-home-section__ads {
  padding-right: clamp(1rem, 2vw, 1.6rem);
  padding-left: 0;
  border-right: 1px solid var(--surf-home-column-rule);
  border-left: 0;
}

.surf-home-section__ads :is(.block, .content) { margin: 0; }
.surf-home-section__ads img {
  display: block;
  width: auto !important;
  max-width: 100% !important;
  margin-inline: auto;
}

/* Lower decks use one rhythm and avoid card-like decoration. */
.surf-front-row--cards,
.surf-front-row--editorial,
.surf-front-row--community,
.surf-front-pair {
  border-top: 2px solid var(--surf-home-rule);
}

.surf-front-card,
.surf-front-panel,
.surf-front-community-cell,
.surf-front-pair > div {
  padding-block: clamp(1.25rem, 2.5vw, 2rem);
}

.surf-front-row--cards :is(h2, h3, .surf-story-card__title),
.surf-front-row--community :is(h2, h3, .surf-story-card__title) {
  margin: .2rem 0 .45rem;
  font-family: var(--surf-serif, Georgia, serif);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -.018em;
}

.surf-front-row--cards :is(.surf-story-card__summary, .views-field-body),
.surf-front-row--community :is(.surf-story-card__summary, .views-field-body) {
  color: var(--surf-home-copy);
  line-height: 1.45;
}

/* Latest and Opinion become easy-to-scan newspaper lists. */
.surf-front-editorial-extra {
  padding-top: var(--surf-home-content-space);
  border-top: 2px solid var(--surf-home-rule) !important;
}

.surf-front-editorial-extra .view-content,
.surf-front-editorial-extra .views-infinite-scroll-content-wrapper {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: clamp(1.25rem, 2.5vw, 2rem);
}

.surf-front-editorial-extra .views-row {
  min-width: 0;
  padding: .9rem 0 !important;
  border-bottom: 1px solid var(--surf-home-soft-rule) !important;
}

.surf-front-editorial-extra :is(h2, h3, .surf-story-card__title) {
  margin: .15rem 0 .35rem;
  font-family: var(--surf-serif, Georgia, serif);
  font-size: clamp(1.05rem, 1.35vw, 1.3rem);
  line-height: 1.15;
  letter-spacing: -.012em;
}

/* Calendar, newsletter and e-edition share a deliberate closing rhythm. */
.surf-calendar,
.surf-front-pair {
  padding-top: var(--surf-home-content-space);
}

.surf-front-pair__edition {
  background: #fff;
}

.surf-front-pair__edition img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 440px;
  margin-inline: auto;
  object-fit: contain;
}

/* Prevent empty regions from leaving visual boxes in common layouts. */
.surf-front-hero > div:empty,
.surf-home-section__ads:empty,
.surf-front-card:empty,
.surf-front-panel:empty,
.surf-front-community-cell:empty,
.surf-front-pair > div:empty {
  display: none;
}

/* Tablet: lead remains editorial, lower decks simplify cleanly. */
@media (max-width: 1000px) {
  .surf-front-hero {
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.45fr);
  }

  .surf-front-hero__right {
    grid-column: 1 / -1;
    margin-top: 1.25rem;
    padding: 1.25rem 0 0;
    border-top: 1px solid var(--surf-home-column-rule);
    border-left: 0 !important;
  }

  .surf-front-editorial-extra .view-content,
  .surf-front-editorial-extra .views-infinite-scroll-content-wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Mobile: remove decorative vertical rules and preserve reading order. */
@media (max-width: 760px) {
  .surf-main--front { padding-top: .65rem; }

  .surf-front-hero {
    display: block;
    padding-bottom: .75rem;
  }

  .surf-front-hero > div,
  .surf-front-hero > div:first-child,
  .surf-front-hero > div:last-child {
    padding: 1rem 0;
    border-left: 0;
  }

  .surf-front-hero > div + div {
    border-top: 1px solid var(--surf-home-column-rule);
  }

  .surf-front-hero__right { margin-top: 0; }

  .surf-home-section__ads,
  .surf-home-section--ads-first .surf-home-section__ads {
    padding: 1rem 0 0;
    border: 0;
    border-top: 1px solid var(--surf-home-column-rule);
  }

  .surf-home-section--ads-first .surf-home-section__content { order: 1; }
  .surf-home-section--ads-first .surf-home-section__ads { order: 2; }

  .surf-front-editorial-extra .view-content,
  .surf-front-editorial-extra .views-infinite-scroll-content-wrapper {
    grid-template-columns: 1fr;
  }

  .surf-front-card,
  .surf-front-panel,
  .surf-front-community-cell,
  .surf-front-pair > div {
    padding-inline: 0;
  }
}

/* Surf News 3.2.32: front-page Community Calendar cards. */
.surf-site--front .surf-calendar {
  padding-bottom: clamp(1.4rem, 3vw, 2.25rem);
  border-bottom: 2px solid var(--surf-ink, #111) !important;
}

.surf-site--front .surf-calendar .view-content,
.surf-site--front .surf-calendar .views-view-responsive-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(.85rem, 2vw, 1.35rem) !important;
  align-items: stretch;
}

.surf-site--front .surf-calendar .view-content > .views-view-responsive-grid {
  grid-column: 1 / -1;
  width: 100%;
}

.surf-site--front .surf-calendar :is(.views-row, .views-view-responsive-grid__item) {
  grid-column: auto !important;
  min-width: 0;
  height: 100%;
}

.surf-site--front .surf-calendar :is(.views-row, .views-view-responsive-grid__item-inner) {
  position: relative;
  display: flex !important;
  min-height: 150px;
  flex-direction: column;
  gap: .65rem;
  padding: 1.15rem 1.15rem 1.2rem 1.35rem;
  border: 1px solid #dedbd4 !important;
  border-top: 4px solid var(--surf-accent, #8b0000) !important;
  background: #faf9f6 !important;
  box-shadow: 0 7px 20px rgba(28, 25, 20, .06) !important;
}

.surf-site--front .surf-calendar :is(.views-row, .views-view-responsive-grid__item-inner)::before {
  content: "Calendar";
  color: var(--surf-accent, #8b0000);
  font: 800 .66rem/1 var(--surf-sans, Arial, sans-serif);
  letter-spacing: .1em;
  text-transform: uppercase;
}

.surf-site--front .surf-calendar .views-field-title {
  order: 1;
  margin: 0;
  font: 700 clamp(1.25rem, 2vw, 1.7rem)/1.08 var(--surf-serif, Georgia, serif);
  letter-spacing: -.018em;
}

.surf-site--front .surf-calendar .views-field-title a {
  color: var(--surf-ink, #111);
  text-decoration: none;
}

.surf-site--front .surf-calendar .views-field-title a:hover,
.surf-site--front .surf-calendar .views-field-title a:focus-visible {
  color: var(--surf-accent, #8b0000);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.surf-site--front .surf-calendar :is(
  [class*="views-field-field-event-date"],
  [class*="views-field-field-date"],
  [class*="field--name-field-event-date"],
  [class*="field--name-field-date"]
) {
  order: 2;
  margin-top: auto;
  padding-top: .75rem;
  border-top: 1px solid #dedbd4;
  color: #555;
  font: 700 .82rem/1.4 var(--surf-sans, Arial, sans-serif);
}

.surf-site--front .surf-calendar :is(
  [class*="views-field-field-location"],
  [class*="views-field-field-address"],
  [class*="field--name-field-location"],
  [class*="field--name-field-address"]
) {
  order: 2;
  color: #666;
  font-size: .82rem;
}

.surf-site--front .surf-calendar :is(
  [class*="views-field-body"],
  [class*="views-field-field-summary"],
  [class*="field--name-body"],
  [class*="field--name-field-summary"]
) {
  order: 2;
  color: #555;
  font: 400 .9rem/1.45 var(--surf-serif, Georgia, serif);
}

.surf-site--front .surf-calendar .view-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 1rem;
}

.surf-site--front .surf-calendar .view-footer a {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  padding: .65rem 1rem;
  border: 1px solid var(--surf-ink, #111);
  background: var(--surf-ink, #111);
  color: #fff;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-decoration: none;
  text-transform: uppercase;
}

.surf-site--front .surf-calendar .view-footer a:hover,
.surf-site--front .surf-calendar .view-footer a:focus-visible {
  border-color: var(--surf-accent, #8b0000);
  background: var(--surf-accent, #8b0000);
}

@media (max-width: 900px) {
  .surf-site--front .surf-calendar .view-content,
  .surf-site--front .surf-calendar .views-view-responsive-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 560px) {
  .surf-site--front .surf-calendar .view-content,
  .surf-site--front .surf-calendar .views-view-responsive-grid {
    grid-template-columns: 1fr !important;
  }
  .surf-site--front .surf-calendar :is(.views-row, .views-view-responsive-grid__item-inner) {
    min-height: 0;
  }
  .surf-site--front .surf-calendar .view-footer { justify-content: stretch; }
  .surf-site--front .surf-calendar .view-footer a { justify-content: center; width: 100%; }
}

/* ================================================================
   16. EDITORIAL SURFACE SIMPLIFICATION — 3.2.3
   ================================================================
   Normal editorial content belongs on the newspaper page, not inside
   dashboard-style cards. Promotional and utility modules retain a quiet
   paper tint so their different purpose remains immediately legible.
*/

/* Remove decorative containers from standard homepage editorial regions. */
.surf-site--front :is(
  .surf-front-hero,
  .surf-home-section,
  .surf-home-section__content,
  .surf-front-row--cards,
  .surf-front-row--editorial,
  .surf-front-row--community,
  .surf-front-card,
  .surf-front-panel,
  .surf-front-community-cell,
  .surf-front-editorial-extra,
  .surf-latest,
  .surf-opinion,
  .surf-calendar
) {
  background: transparent !important;
  background-image: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Multimedia remains visually important through scale and imagery, not tint. */
.surf-site--front .surf-front-panel--photos {
  background: transparent !important;
  background-image: none !important;
}

/* Drupal blocks and Views inside editorial regions should not recreate cards. */
.surf-site--front :is(
  .surf-front-hero,
  .surf-home-section__content,
  .surf-front-row--cards,
  .surf-front-row--editorial,
  .surf-front-row--community,
  .surf-front-editorial-extra,
  .surf-latest,
  .surf-opinion,
  .surf-calendar
) :is(.block, .view, .views-row, article, .surf-story-card) {
  background: transparent;
  border-radius: 0;
  box-shadow: none;
}

/* Keep structure newspaper-like: spacing and fine rules instead of panels. */
.surf-site--front .surf-front-row--editorial,
.surf-site--front .surf-front-row--community,
.surf-site--front .surf-front-row--cards {
  background: #fff !important;
}

.surf-site--front .surf-front-card + .surf-front-card,
.surf-site--front .surf-front-panel + .surf-front-panel,
.surf-site--front .surf-front-community-cell + .surf-front-community-cell {
  border-color: var(--surf-home-soft-rule, #d9d9d4);
}

/* Opinion and popular lists use only a quiet row divider. */
.surf-site--front .surf-front-panel--opinion :is(.views-row, article, .surf-story-card),
.surf-site--front .surf-front-panel--popular :is(.views-row, article, .surf-story-card) {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Promotional close: subtle paper tints distinguish action-oriented modules. */
.surf-site--front .surf-front-pair {
  gap: 0;
  background: transparent !important;
}

.surf-site--front .surf-front-pair__newsletter {
  background: var(--surf-home-highlight, #f5f1ea) !important;
}

.surf-site--front .surf-front-pair__edition {
  background: var(--surf-home-surface, #f7f7f4) !important;
}

.surf-site--front .surf-front-pair__newsletter,
.surf-site--front .surf-front-pair__edition {
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Poll is interactive utility content; retain controls but remove outer card. */
.surf-site--front .surf-front-card--poll {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Sidebar advertising should float in its rail rather than appear carded. */
.surf-site--front .surf-home-section__ads :is(.block, .content, article) {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

@media (max-width: 760px) {
  .surf-site--front .surf-front-pair__newsletter,
  .surf-site--front .surf-front-pair__edition {
    padding-inline: 1.1rem;
  }
}

/* ================================================================
   SURF NEWS 3.2.4 — EDITORIAL REFINEMENTS
   Section transitions, utility modules, popular ranking and footer.
   ================================================================ */

/* A clear newspaper rule marks the transition from News into Sports. */
.surf-site--front .surf-home-section-wrap + .surf-home-section-wrap {
  margin-top: clamp(2rem, 4vw, 3.5rem);
  padding-top: clamp(1.4rem, 2.5vw, 2.25rem);
  border-top: 1px solid var(--surf-home-rule, #222);
}

/* Give the advertising/utility rail a consistent editorial rhythm. */
.surf-site--front .surf-home-section__ads > .region,
.surf-site--front .surf-home-section__ads .region {
  display: grid;
  gap: clamp(1rem, 1.8vw, 1.4rem);
}

.surf-site--front .surf-home-section--ads-first .surf-home-section__ads {
  padding-right: clamp(1rem, 2vw, 1.6rem);
  border-right: 1px solid var(--surf-home-soft-rule, #d9d9d4);
}

/* Newsletter and E-Edition are companion utility modules. */
.surf-site--front :is(.surf-newsletter, .surf-eedition),
.surf-site--front :is(.surf-front-pair__newsletter, .surf-front-pair__edition) {
  background: var(--surf-home-highlight, #f5f1ea) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.surf-site--front :is(.surf-newsletter, .surf-eedition) {
  padding: clamp(1rem, 1.8vw, 1.35rem);
}

.surf-site--front .surf-front-pair__newsletter::before,
.surf-site--front .surf-newsletter::before {
  content: none !important;
  display: none !important;
}

/* Most Popular is a distinct ranked editorial component. */
.surf-site--front .surf-front-panel--popular {
  padding: clamp(1.15rem, 2vw, 1.65rem) !important;
  background: var(--surf-home-highlight, #f5f1ea) !important;
  background-image: none !important;
}

.surf-site--front .surf-front-panel--popular :is(.block > h2, .block-title, .view-header h2) {
  margin: 0 0 .15rem;
  padding: 0 0 .65rem;
  border-bottom: 1px solid var(--surf-home-accent, #8b0000);
  color: var(--surf-home-accent, #8b0000);
  font-family: var(--surf-sans, Arial, Helvetica, sans-serif);
  font-size: .82rem;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.surf-site--front .surf-front-panel--popular :is(.view-content, .item-list > ul) {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: surf-popular;
}

.surf-site--front .surf-front-panel--popular :is(.views-row, .item-list > ul > li, article, .surf-story-card) {
  position: relative;
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr);
  gap: .75rem;
  align-items: start;
  min-height: 0;
  margin: 0 !important;
  padding: .72rem 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--surf-home-soft-rule, #d9d9d4) !important;
  counter-increment: surf-popular;
}

.surf-site--front .surf-front-panel--popular :is(.views-row, .item-list > ul > li, article, .surf-story-card)::before {
  content: counter(surf-popular);
  grid-column: 1;
  color: var(--surf-home-accent, #8b0000);
  font-family: var(--surf-serif, Georgia, "Times New Roman", serif);
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.05;
  font-variant-numeric: lining-nums tabular-nums;
}

.surf-site--front .surf-front-panel--popular :is(.views-row, .item-list > ul > li, article, .surf-story-card) > * {
  grid-column: 2;
  min-width: 0;
}

.surf-site--front .surf-front-panel--popular :is(.views-row, .item-list > ul > li, article, .surf-story-card):last-child {
  border-bottom: 0 !important;
}

.surf-site--front .surf-front-panel--popular :is(h2, h3, .views-field-title, .surf-story-card__title) {
  font-size: 1rem;
  line-height: 1.25;
  font-weight: 600;
}

.surf-site--front .surf-front-panel--popular a:hover {
  color: var(--surf-home-accent, #8b0000);
  text-decoration: none;
}

/* Premium charcoal footer: strong closure without the harshness of black. */
.surf-footer {
  margin-top: clamp(2.5rem, 5vw, 4.5rem);
  padding: clamp(2.75rem, 5vw, 4rem) 0 1.5rem;
  border-top: 0;
  background: #222;
  color: #f5f5f2;
}

.surf-footer :is(h2, h3, h4, .block-title, strong) {
  color: #fff;
}

.surf-footer :is(p, li, .description, .form-item, .copyright) {
  color: #c7c7c3;
}

.surf-footer a {
  color: #eee;
  text-decoration: none;
}

.surf-footer a:hover,
.surf-footer a:focus-visible {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.surf-footer__top {
  margin-bottom: 1.75rem;
  padding-bottom: 1.75rem;
  border-bottom: 1px solid #4a4a48;
}

.surf-footer input[type="email"],
.surf-footer input[type="text"] {
  background: #fff;
  color: #111;
  border-color: #777;
}

.surf-footer :is(input[type="submit"], button[type="submit"]) {
  border-color: var(--surf-accent, #8b0000);
  background: var(--surf-accent, #8b0000);
  color: #fff;
}

@media (max-width: 760px) {
  .surf-site--front .surf-home-section--ads-first .surf-home-section__ads {
    padding-right: 0;
    border-right: 0;
  }

  .surf-site--front .surf-front-panel--popular :is(.views-row, .item-list > ul > li, article, .surf-story-card) {
    grid-template-columns: 1.75rem minmax(0, 1fr);
    gap: .55rem;
  }
}


/* ================================================================
   SURF NEWS 3.2.5 — FRONT PAGE COMPLETION
   Lighter popular panel, tighter ranking metadata and footer regions.
   ================================================================ */

/* Keep Most Popular distinct, but quieter than the promotional panels. */
.surf-site--front .surf-front-panel--popular {
  background: #f7f7f5 !important;
}

/* Compact the title, taxonomy and date into a crisp ranked list. */
.surf-site--front .surf-front-panel--popular :is(.views-row, .item-list > ul > li, article, .surf-story-card) {
  row-gap: 0 !important;
  padding-block: .58rem !important;
}

.surf-site--front .surf-front-panel--popular :is(
  h2, h3, h4,
  .views-field-title,
  .views-field-title .field-content,
  .surf-story-card__title
) {
  margin: 0 !important;
  line-height: 1.18 !important;
}

.surf-site--front .surf-front-panel--popular :is(
  .views-field-field-section,
  .views-field-field-category,
  .views-field-field-tags,
  .views-field-created,
  .views-field-changed,
  .surf-story-card__kicker,
  .surf-story-card__meta,
  .field--type-entity-reference,
  .node__meta
) {
  margin: .14rem 0 0 !important;
  padding: 0 !important;
  font-size: .69rem !important;
  line-height: 1.2 !important;
}

.surf-site--front .surf-front-panel--popular :is(
  .views-field-field-section,
  .views-field-field-category,
  .views-field-field-tags,
  .surf-story-card__kicker,
  .field--type-entity-reference
) {
  color: var(--surf-home-accent, #8b0000);
  font-family: var(--surf-sans, Arial, Helvetica, sans-serif);
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.surf-site--front .surf-front-panel--popular :is(
  .views-field-created,
  .views-field-changed,
  .surf-story-card__meta,
  .node__meta
) {
  color: #70706c;
  font-family: var(--surf-sans, Arial, Helvetica, sans-serif);
  letter-spacing: .045em;
  text-transform: uppercase;
}

/* Three equal footer columns above a full-width legal/copyright region. */
.surf-footer__columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.5rem, 4vw, 4rem);
  align-items: start;
}

.surf-footer__column:empty {
  display: block;
  min-height: 1px;
}

.surf-footer__column > .region {
  display: grid;
  gap: 1.4rem;
}

.surf-footer__column :is(h2, h3, h4, .block-title) {
  margin: 0 0 .8rem;
  font-family: var(--surf-sans, Arial, Helvetica, sans-serif);
  font-size: .75rem;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.surf-footer__column :is(ul, ol) {
  margin: 0;
  padding: 0;
  list-style: none;
}

.surf-footer__column li + li {
  margin-top: .35rem;
}

.surf-footer__bottom {
  margin-top: clamp(2rem, 4vw, 3rem);
  padding-top: 1.15rem;
  border-top: 1px solid #4a4a48;
  font-size: .75rem;
}

.surf-footer__bottom > .region {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .65rem 2rem;
  align-items: center;
}

.surf-footer__bottom :is(p, ul, ol) {
  margin: 0;
}

@media (max-width: 760px) {
  .surf-footer__columns {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .surf-footer__column {
    padding-block: 1.25rem;
    border-bottom: 1px solid #3d3d3b;
  }

  .surf-footer__column:first-child {
    padding-top: 0;
  }

  .surf-footer__column:last-child {
    border-bottom: 0;
  }

  .surf-footer__bottom > .region {
    display: grid;
    justify-content: start;
  }
}

/* Keep breaking-news headlines within narrow screens. */
@media (max-width: 800px) {
  .surf-breaking__content .views-row a {
    white-space: normal;
    overflow-wrap: anywhere;
  }
}