/* -----------------------------------------------------------------------------
   Reset & Base — Bulma overrides and base element defaults
----------------------------------------------------------------------------- */
body {
    font-family: 'Montserrat', sans-serif;
    background: var(--primary-bg);
    -webkit-font-smoothing: antialiased;
}

hr {
    background-color: var(--neutral-200) !important;
    height: 1px;
}

/* --- GLOBAL MOBILE CONTAINER PADDING ---
   Bulma default is 0.75rem which is too tight on phones.
   This gives consistent 1.25rem margin from screen edges across all sections. */
@media screen and (max-width: 768px) {
    .container {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }
}

/* --- GLOBAL MOBILE SECTION CENTERING ---
   In 2-column split sections (is-vcentered, not card grids), center headings and CTAs when columns stack. */
@media screen and (max-width: 768px) {
    .columns.is-vcentered:not(.is-multiline) > .column h1,
    .columns.is-vcentered:not(.is-multiline) > .column h2,
    .columns.is-vcentered:not(.is-multiline) > .column h3,
    .columns.is-vcentered:not(.is-multiline) > .column .title,
    .columns.is-vcentered:not(.is-multiline) > .column .subtitle,
    .columns.is-vcentered:not(.is-multiline) > .column .hero-h1,
    .columns.is-vcentered:not(.is-multiline) > .column .hero-body-text,
    .columns.is-vcentered:not(.is-multiline) > .column .hero-tagline {
        text-align: center;
    }
    .columns.is-vcentered:not(.is-multiline) > .column .hero-body-text {
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
    .columns.is-vcentered:not(.is-multiline) > .column .hero-tagline {
        border-left: none;
        border-bottom: 1px solid var(--primary-green);
        padding-left: 0;
        padding-bottom: 6px;
        display: inline-block;
    }
    .columns.is-vcentered:not(.is-multiline) > .column .buttons,
    .columns.is-vcentered:not(.is-multiline) > .column .hero-info-footer {
        justify-content: center;
    }
}

/* --- GLOBAL MOBILE HERO TAG ROWS ---
   .hero-tag-row = flex tag/pill rows in hero sections (justify-content not set inline).
   .hero-logo-row = logo+divider+label rows in software page heroes. */
@media screen and (max-width: 768px) {
    .hero-tag-row { justify-content: center; }
    .hero-logo-row { justify-content: center; }
}

/* --- GLOBAL MOBILE HERO EYEBROW / BREADCRUMB CENTERING ---
   All page-specific hero tagline/label/eyebrow classes: center and convert border-left → border-bottom. */
@media screen and (max-width: 768px) {
    .lrn-hero-tagline,
    .sw-hero-label,
    .hw-hero-tagline,
    .cs-hero-tagline,
    .ab-hero-label,
    .of-hero-eyebrow,
    .eco-eyebrow,
    .eng-hero-tagline,
    .ov-super-eyebrow {
        text-align: center;
        border-left: none !important;
        border-bottom: 1px solid var(--primary-green);
        padding-left: 0 !important;
        padding-bottom: 6px;
        display: inline-block;
    }
}