/* ==========================================================================
   VERND — page title banner on article pages
   --------------------------------------------------------------------------
   The kind template hides the whole #sp-page-title section on article views
   (theme.scss: `.view-article { .sp-module-content-top, #sp-page-title { display: none } }`),
   so the Helix "Enable Page Title" menu option produced nothing there —
   no background image, no alternative title, no subtitle, no breadcrumbs.
   Restore it, matching the old site's behaviour.
   ========================================================================== */

.view-article #sp-page-title {
    display: block;
}

/* The .sp-module-content-top half of that rule is intentionally left alone. */

/* --------------------------------------------------------------------------
   Light-on-dark treatment when the menu item sets a background image/colour.
   The `sp-page-title-has-bg` class is added in templates/kind/features/title.php.
   -------------------------------------------------------------------------- */

.sp-page-title.sp-page-title-has-bg {
    position: relative;
    background-attachment: fixed;
}

.sp-page-title.sp-page-title-has-bg::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    pointer-events: none;
}

.sp-page-title.sp-page-title-has-bg > .container {
    position: relative;
    z-index: 1;
}

.sp-page-title.sp-page-title-has-bg .sp-page-title-heading,
.sp-page-title.sp-page-title-has-bg .sp-page-title-sub-heading {
    color: #fff;
}

/* Breadcrumbs sit inside the banner via <jdoc:include name="breadcrumb" />.
   Centre them under the headings — the template only styles their colours. */

.sp-page-title .breadcrumb {
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 20px;
}

.sp-page-title .mod-breadcrumbs__divider,
.sp-page-title .breadcrumb .divider {
    color: rgba(255, 255, 255, 0.6);
    margin: 0 8px;
}

/* ==========================================================================
   VERND — the grey contact band (emergency numbers / logo / email + phone)
   --------------------------------------------------------------------------
   The same section is copied onto nine SP Page Builder pages: 109, 2010–2016
   and 2019. Each copy carries the CSS class `vernd-contact-band` on its row,
   set in the builder under Row → Advanced → CSS Class, so these rules reach
   every copy. If the section is duplicated onto a new page, add that class
   to the new row and it is covered too.

   Layout, spacing and alignment live in each page's builder settings, NOT
   here — edit those in SP Page Builder. These rules only clean up markup the
   builder's fields cannot reach, and only while the columns are stacked.

   This file loads BEFORE the builder's inline <style> block, and the builder
   styles addon text with #id selectors, so the overrides below need
   !important to land. That is the reason for it, not a shortcut.
   ========================================================================== */

@media (max-width: 991.98px) {

    /* The emergency-number list is centred below 992px. Default bullets and
       their indent would hang off to the left of the centred text. */
    .vernd-contact-band .sppb-addon-text-block ul {
        list-style: none;
        padding-left: 0;
        margin-left: 0;
    }

    /* The phone number is authored as <h2 ...><span style="font-size:14pt">,
       so it renders ~19px next to the 14px email address. Level the two up
       while they are stacked. The span carries an inline style, so it needs
       !important of its own. Replacing that <h2> with plain text in the
       "Vernd fangahjálp" feature would make this whole block unnecessary. */
    .vernd-contact-band .sppb-addon-feature .sppb-addon-text h2 {
        font-size: inherit !important;
        line-height: inherit !important;
        margin: 0 !important;
    }

    .vernd-contact-band .sppb-addon-feature .sppb-addon-text h2 span {
        font-size: inherit !important;
    }
}
