.section { margin-block: 0 var(--abk-space-8); scroll-margin-top: var(--abk-space-6); }
.section:last-child { margin-bottom: 0; }
.section > .button { margin-top: var(--abk-space-6); }
.hero { display: grid; grid-template-columns: 1.1fr 0.9fr; align-items: center; gap: var(--abk-space-7); padding: var(--abk-space-8) 0; background: var(--abk-color-navy); color: var(--abk-color-white); }
/* A painted full-bleed surface keeps the shared main width and avoids 100vw overflow. */
.hero--full-width { margin-top: calc(-1 * var(--abk-space-6)); box-shadow: 0 0 0 100vmax var(--abk-color-navy); clip-path: inset(0 -100vmax); }
.hero h1, .hero .eyebrow { color: var(--abk-color-white); }
.hero__content > p:not(.eyebrow) { max-width: 38rem; color: var(--abk-color-white); font-size: 1.0625rem; }
.hero .button--secondary { border-color: var(--abk-color-white); color: var(--abk-color-white); }
.hero .button--secondary:hover { background: var(--abk-color-sky); color: var(--abk-color-navy); }
.hero :focus-visible { outline-color: var(--abk-color-white); }
.hero__media { min-height: 25rem; background: var(--abk-color-white); border-radius: var(--abk-radius-large); }
.hero__media--image { overflow: hidden; border: 1px solid rgb(255 255 255 / 24%); }
.hero__image { display: block; width: 100%; height: 100%; min-height: 25rem; object-fit: cover; }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--abk-space-3); margin-top: var(--abk-space-6); }
.card-grid--topics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.card-grid--categories, .card-grid--situations, .article-feed { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.article-card__media { aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--abk-radius-small); margin-bottom: var(--abk-space-5); }
.article-card__image { display: block; width: 100%; height: 100%; object-fit: cover; }
.article-card__media > .article-card__placeholder { display: grid; place-items: center; height: 100%; padding: var(--abk-space-4); text-align: center; }
.article-card--placeholder { box-shadow: none; border-style: dashed; }
.verification-notice { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: var(--abk-space-7); padding: var(--abk-space-7); border-radius: var(--abk-radius-large); background: var(--abk-color-navy); color: var(--abk-color-white); }
.verification-notice h2 { color: var(--abk-color-white); }
.verification-notice .eyebrow, .verification-notice .section-heading > p:last-child { color: #D8E3F2; }
.verification-notice ol { display: grid; grid-template-columns: 1fr; gap: var(--abk-space-4); margin: 0; padding-inline-start: 1.5rem; }
.verification-notice li { margin-top: 0; padding: var(--abk-space-5); border-radius: var(--abk-radius-card); background: rgb(0 0 0 / 14%); }
.verification-notice li::marker { color: #A9C8FF; font-weight: 800; }
.verification-notice :focus-visible { outline-color: var(--abk-color-white); }
.media-content { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: var(--abk-space-7); }
.media-content--reverse .media-placeholder, .media-content--reverse .media-visual { order: 2; }
.media-visual { min-height: 18rem; margin: 0; overflow: hidden; border: 1px solid var(--abk-color-border); border-radius: var(--abk-radius-card); background: var(--abk-color-white); }
.media-visual__image { display: block; width: 100%; height: 100%; min-height: 18rem; object-fit: cover; }
.media-content__copy > .button { margin-top: var(--abk-space-6); }
.media-content ul { margin-bottom: 0; }
.media-content li { padding: var(--abk-space-3) 0; border-bottom: 1px solid var(--abk-color-border); }
.section--jkn-prb, .section--documents, .section--categories, .section--situations, .section--articles, .section--faq, .section--quick-path { padding: var(--abk-space-7); border-radius: var(--abk-radius-large); }
.section--jkn-prb, .section--situations, .section--quick-path { background: var(--abk-color-sky); }
.section--documents { background: var(--abk-color-apricot); }
.section--jkn-prb .media-placeholder, .section--documents .media-placeholder, .section--jkn-prb .media-visual, .section--documents .media-visual { background: var(--abk-color-white); }
.section--categories, .section--articles, .section--faq { background: var(--abk-color-surface); }
.section--categories .service-card { box-shadow: none; }
.article-feed-slot { padding: var(--abk-space-6); border: 1px dashed #91A5BF; border-radius: var(--abk-radius-card); background: var(--abk-color-surface); color: var(--abk-color-muted); }
.transparency-checklist { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--abk-space-5); list-style: none; padding: 0; }
.transparency-checklist li { margin: 0; padding: var(--abk-space-5); border-top: 3px solid var(--abk-color-cobalt); background: var(--abk-color-sky); border-radius: 0 0 var(--abk-radius-card) var(--abk-radius-card); }
.section--faq { max-width: 56rem; margin-inline: auto; }
.section--disclaimer { padding: var(--abk-space-7); border: 1px solid #E3C5B1; border-radius: var(--abk-radius-large); background: var(--abk-color-apricot); }
.section--disclaimer .section-heading { margin-bottom: 0; max-width: 54rem; }
.section--quick-path .section-heading { max-width: 51rem; }
.branch-location, .contact-form-slot { padding: var(--abk-space-6); border: 1px solid var(--abk-color-border); border-radius: var(--abk-radius-card); }


/* Hero visual: preserve the 4:3 source composition without cropping the subject. */
.hero__media--image {
    min-height: 0;
    aspect-ratio: 4 / 3;
}
.hero__image {
    min-height: 0;
    object-position: 50% 50%;
}
@media (max-width: 1023px) {
    .hero__media--image {
        min-height: 0;
        aspect-ratio: 4 / 3;
    }
    .hero__image {
        min-height: 0;
    }
}
.section { margin-block: 0 var(--abk-space-8); scroll-margin-top: var(--abk-space-6); }
.section:last-child { margin-bottom: 0; }
.section > .button { margin-top: var(--abk-space-6); }
.hero { display: grid; grid-template-columns: 1.1fr 0.9fr; align-items: center; gap: var(--abk-space-7); padding: var(--abk-space-8) 0; background: var(--abk-color-navy); color: var(--abk-color-white); }
/* A painted full-bleed surface keeps the shared main width and avoids 100vw overflow. */
.hero--full-width { margin-top: calc(-1 * var(--abk-space-6)); box-shadow: 0 0 0 100vmax var(--abk-color-navy); clip-path: inset(0 -100vmax); }
.hero h1, .hero .eyebrow { color: var(--abk-color-white); }
.hero__content > p:not(.eyebrow) { max-width: 38rem; color: var(--abk-color-white); font-size: 1.0625rem; }
.hero .button--secondary { border-color: var(--abk-color-white); color: var(--abk-color-white); }
.hero .button--secondary:hover { background: var(--abk-color-sky); color: var(--abk-color-navy); }
.hero :focus-visible { outline-color: var(--abk-color-white); }
.hero__media { min-height: 25rem; background: var(--abk-color-white); border-radius: var(--abk-radius-large); }
.hero__media--image { overflow: hidden; border: 1px solid rgb(255 255 255 / 24%); }
.hero__image { display: block; width: 100%; height: 100%; min-height: 25rem; object-fit: cover; }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--abk-space-3); margin-top: var(--abk-space-6); }
.card-grid--topics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.card-grid--categories, .card-grid--situations, .article-feed { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.article-card__media { aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--abk-radius-small); margin-bottom: var(--abk-space-5); }
.article-card__image { display: block; width: 100%; height: 100%; object-fit: cover; }
.article-card__media > .article-card__placeholder { display: grid; place-items: center; height: 100%; padding: var(--abk-space-4); text-align: center; }
.article-card--placeholder { box-shadow: none; border-style: dashed; }
.verification-notice { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: var(--abk-space-7); padding: var(--abk-space-7); border-radius: var(--abk-radius-large); background: var(--abk-color-navy); color: var(--abk-color-white); }
.verification-notice h2 { color: var(--abk-color-white); }
.verification-notice .eyebrow, .verification-notice .section-heading > p:last-child { color: #D8E3F2; }
.verification-notice ol { display: grid; grid-template-columns: 1fr; gap: var(--abk-space-4); margin: 0; padding-inline-start: 1.5rem; }
.verification-notice li { margin-top: 0; padding: var(--abk-space-5); border-radius: var(--abk-radius-card); background: rgb(0 0 0 / 14%); }
.verification-notice li::marker { color: #A9C8FF; font-weight: 800; }
.verification-notice :focus-visible { outline-color: var(--abk-color-white); }
.media-content { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: var(--abk-space-7); }
.media-content--reverse .media-placeholder, .media-content--reverse .media-visual { order: 2; }
.media-visual { min-height: 18rem; margin: 0; overflow: hidden; border: 1px solid var(--abk-color-border); border-radius: var(--abk-radius-card); background: var(--abk-color-white); }
.media-visual__image { display: block; width: 100%; height: 100%; min-height: 18rem; object-fit: cover; }
.media-content__copy > .button { margin-top: var(--abk-space-6); }
.media-content ul { margin-bottom: 0; }
.media-content li { padding: var(--abk-space-3) 0; border-bottom: 1px solid var(--abk-color-border); }
.section--jkn-prb, .section--documents, .section--categories, .section--situations, .section--articles, .section--faq, .section--quick-path { padding: var(--abk-space-7); border-radius: var(--abk-radius-large); }
.section--jkn-prb, .section--situations, .section--quick-path { background: var(--abk-color-sky); }
.section--documents { background: var(--abk-color-apricot); }
.section--jkn-prb .media-placeholder, .section--documents .media-placeholder, .section--jkn-prb .media-visual, .section--documents .media-visual { background: var(--abk-color-white); }
.section--categories, .section--articles, .section--faq { background: var(--abk-color-surface); }
.section--categories .service-card { box-shadow: none; }
.article-feed-slot { padding: var(--abk-space-6); border: 1px dashed #91A5BF; border-radius: var(--abk-radius-card); background: var(--abk-color-surface); color: var(--abk-color-muted); }
.transparency-checklist { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--abk-space-5); list-style: none; padding: 0; }
.transparency-checklist li { margin: 0; padding: var(--abk-space-5); border-top: 3px solid var(--abk-color-cobalt); background: var(--abk-color-sky); border-radius: 0 0 var(--abk-radius-card) var(--abk-radius-card); }
.section--faq { max-width: 56rem; margin-inline: auto; }
.section--disclaimer { padding: var(--abk-space-7); border: 1px solid #E3C5B1; border-radius: var(--abk-radius-large); background: var(--abk-color-apricot); }
.section--disclaimer .section-heading { margin-bottom: 0; max-width: 54rem; }
.section--quick-path .section-heading { max-width: 51rem; }
.branch-location, .contact-form-slot { padding: var(--abk-space-6); border: 1px solid var(--abk-color-border); border-radius: var(--abk-radius-card); }


/* Hero visual: preserve the 4:3 source composition without cropping the subject. */
.hero__media--image {
    min-height: 0;
    aspect-ratio: 4 / 3;
}
.hero__image {
    min-height: 0;
    object-position: 50% 50%;
}
@media (max-width: 1023px) {
    .hero__media--image {
        min-height: 0;
        aspect-ratio: 4 / 3;
    }
    .hero__image {
        min-height: 0;
    }
}


.article-card--preview {
    padding: 0;
    overflow: hidden;
    border: 2px solid var(--abk-color-border);
    box-shadow: none;
}

.article-card--preview .article-card__media {
    margin-bottom: 0;
    border: 0;
    border-bottom: 1px solid var(--abk-color-border);
    border-radius: 0;
}

.article-card--preview .article-card__content {
    padding: var(--abk-space-5);
}

.article-card--preview .article-card__status {
    margin: 0 0 var(--abk-space-2);
    color: var(--abk-color-cobalt);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.article-card--preview .article-card__title {
    margin: 0 0 var(--abk-space-3);
    font-size: 1.125rem;
}

.article-card--preview .article-card__excerpt {
    margin: 0;
    color: var(--abk-color-muted);
}


/* Compact article presentation */
.section--articles {
    background: #fbf5e9;
    padding-block: clamp(3.25rem, 5vw, 4.75rem);
}

.articles-heading-row {
    align-items: end;
    display: flex;
    gap: 2rem;
    justify-content: space-between;
    margin-bottom: clamp(1.75rem, 3vw, 2.5rem);
}

.section--articles .section-heading {
    margin-bottom: 0;
    max-width: 46rem;
}

.article-index-link {
    align-items: center;
    color: #1469b8;
    display: inline-flex;
    font-weight: 700;
    gap: .45rem;
    text-decoration: none;
    white-space: nowrap;
}

.article-index-link:hover,
.article-index-link:focus-visible {
    color: #0b4f90;
    text-decoration: underline;
}

.section--articles .article-feed,
.article-hub__grid {
    gap: clamp(1.5rem, 2.5vw, 2rem);
}

.section--articles .article-card,
.article-hub .article-card {
    background: transparent;
    border: 0;
    box-shadow: none;
    min-height: 0;
    padding: 0;
}

.section--articles .article-card__media,
.article-hub .article-card__media {
    aspect-ratio: 16 / 9;
    background: #e8eef5;
    border-radius: 1rem;
    margin-bottom: 1rem;
    overflow: hidden;
}

.section--articles .article-card__image,
.article-hub .article-card__image {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.section--articles .article-card__title,
.article-hub .article-card__title {
    font-size: clamp(1.1rem, 1.5vw, 1.35rem);
    line-height: 1.3;
    margin: 0 0 .55rem;
}

.section--articles .article-card__title a,
.article-hub .article-card__title a {
    color: #0c3e55;
    text-decoration: none;
}

.section--articles .article-card__title a:hover,
.section--articles .article-card__title a:focus-visible,
.article-hub .article-card__title a:hover,
.article-hub .article-card__title a:focus-visible {
    color: #1469b8;
    text-decoration: underline;
}

.section--articles .article-card__date,
.article-hub .article-card__date {
    color: #587083;
    font-size: .9rem;
    margin: 0;
}

.article-hub {
    margin-inline: auto;
    max-width: 76rem;
    padding-block: clamp(2.75rem, 5vw, 4.75rem);
}

.article-hub__hero {
    max-width: 49rem;
}

.article-hub__hero h1,
.article-hub__listing h2 {
    color: #0c3e55;
}

.article-hub__topics {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    margin-top: 1.5rem;
}

.article-hub__topics a {
    background: #edf4ee;
    border: 1px solid #c9dfcc;
    border-radius: 999px;
    color: #155d46;
    font-size: .94rem;
    font-weight: 700;
    padding: .55rem .9rem;
    text-decoration: none;
}

.article-hub__topics a:hover,
.article-hub__topics a:focus-visible {
    background: #dbeee0;
    text-decoration: underline;
}

.article-hub__notice {
    background: #e9f2fb;
    border-left: .3rem solid #2f78c5;
    border-radius: .9rem;
    margin-block: clamp(2rem, 4vw, 3.5rem);
    max-width: 70rem;
    padding: clamp(1.25rem, 2.5vw, 1.8rem);
}

.article-hub__notice h2 {
    color: #0c3e55;
    font-size: clamp(1.25rem, 2vw, 1.6rem);
    margin: 0 0 .55rem;
}

.article-hub__notice p,
.article-hub__empty {
    margin: 0;
}

.article-hub__listing-heading {
    margin-bottom: 1.5rem;
}

.article-hub__listing-heading .ak-eyebrow {
    margin-bottom: .5rem;
}

@media (max-width: 767px) {
    .articles-heading-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .article-index-link {
        white-space: normal;
    }
}


/* Explicit compact article grid at mobile breakpoint. */
@media (max-width: 767px) {
    .section--articles .article-feed,
    .article-hub__grid {
        grid-template-columns: 1fr;
    }

    .section--articles .article-card__media,
    .article-hub .article-card__media {
        margin-bottom: .85rem;
    }
}
