.article-directory,
.booking-panel {
    margin: 0 0 32px;
    padding: clamp(16px, 4vw, 28px);
    background: #eef7fb;
    color: #133246;
}

.article-directory {
    scroll-margin-top: 100px;
}

.article-directory h2,
.booking-panel h2 {
    margin: 0 0 12px;
    color: inherit;
    font-size: clamp(20px, 3vw, 26px);
    line-height: 1.35;
}

.article-directory ul {
    margin: 0;
    padding-inline-start: 1.35em;
    list-style: disc;
}

.article-directory a {
    display: block;
    padding: 5px 0;
    color: #075477;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.booking-panel {
    margin-top: 28px;
}

.booking-panel p {
    margin: 0 0 16px;
    font-size: 16px;
    line-height: 1.65;
}

a.booking-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px;
    padding: 10px 16px;
    background: #005779;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
    text-decoration: none;
}

a.booking-button:hover,
a.booking-button:focus-visible {
    background: #003a54;
    color: #fff;
}

a.booking-button:focus-visible,
.article-directory a:focus-visible,
.fixedQuickLink .link:focus-visible {
    outline: 3px solid #c94d12;
    outline-offset: 2px;
}

a.booking-float {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 40;
    min-height: 56px;
    box-shadow: 0 4px 16px rgba(19, 50, 70, 0.25);
}

.booking-float span:last-child {
    white-space: nowrap;
}

@media (min-width: 1201px) {
    .fixedQuickLink {
        padding-bottom: 90px;
    }

    footer .unitLinkBox {
        margin-inline-end: 160px;
    }
}

@media (max-width: 1200px) {
    body {
        padding-bottom: calc(60px + env(safe-area-inset-bottom, 0px));
    }

    a.booking-float {
        right: 0;
        bottom: 0;
        left: 0;
        min-height: 60px;
        padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
        box-shadow: 0 -4px 16px rgba(19, 50, 70, 0.2);
    }
}

.article-entry + .article-entry {
    margin-top: 56px;
    padding-top: 40px;
    border-top: 4px solid #e1f3fb;
}

.articleTitle a {
    color: #075477;
    text-decoration: underline;
    text-decoration-thickness: 0.06em;
    text-underline-offset: 0.16em;
}

.articleTitle a:hover {
    color: #003a54;
}

a.contact-panel {
    display: grid;
    justify-items: start;
    gap: 6px;
    margin-bottom: 28px;
    padding: 20px;
    background: #005779;
    color: #fff;
    line-height: 1.45;
    text-decoration: none;
}

a.contact-panel:hover,
a.contact-panel:focus-visible {
    background: #003a54;
    color: #fff;
}

.articleTitle a:focus-visible,
a.contact-panel:focus-visible {
    outline: 3px solid #c94d12;
    outline-offset: 3px;
}

.contact-panel-title {
    font-size: 19px;
    font-weight: 700;
}

.contact-panel-phone {
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 700;
    white-space: nowrap;
}

.contact-panel-note {
    font-size: 15px;
}


.article-preview {
    margin: 24px 0;
}

.article-preview img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 1;
    object-fit: cover;
}

.article-preview p {
    margin: 16px 0 0;
    color: #334650;
    font-size: 17px;
    line-height: 1.65;
}

@media (max-width: 600px) {
    .article-preview img {
        aspect-ratio: 2 / 1;
    }
}

