:root {
    --brand-red: #cf020e;
    --brand-dark: #9c020b;
    --bs-primary: var(--brand-red);
    --bs-primary-rgb: 207, 2, 14;
    --bs-link-color: var(--brand-red);
    --bs-link-color-rgb: 207, 2, 14;
    --bs-link-hover-color: var(--brand-dark);
    --bs-link-hover-color-rgb: 156, 2, 11;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    margin: 0;
    color: #333;
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--brand-red);
}

h1 {
    margin-bottom: 1.25rem;
    font-size: clamp(1.8rem, 3vw, 2.25rem);
}

main {
    flex: 1;
    padding-bottom: 2.5rem;
}

.site-header {
    padding-top: 1.25rem;
    padding-bottom: 1.5rem;
}

.site-header .navbar {
    background: #f5f5f5;
    border: 1px solid #dedede;
    border-radius: .375rem;
}

.navbar-brand {
    color: var(--brand-red);
    font-size: clamp(1rem, 2.4vw, 1.25rem);
    font-weight: 500;
}

.navbar-brand:hover, .navbar-brand:focus {
    color: var(--brand-dark);
}

.navbar-nav .nav-link {
    padding: .5rem .75rem;
    border-radius: .25rem;
}

.navbar-nav .nav-link.active {
    color: var(--brand-dark);
    background-color: #fbe9ea;
}

.navbar-toggler {
    padding: .35rem .55rem;
}

.skip-link {
    position: absolute;
    top: .5rem;
    left: .5rem;
    z-index: 1100;
    padding: .5rem 1rem;
    color: white;
    background: var(--brand-dark);
}

:focus-visible {
    outline: 3px solid var(--brand-red);
    outline-offset: 3px;
}

#main-content:focus {
    outline: none;
}

.site-footer {
    padding: 1.25rem 0;
    color: #595959;
    background: #f5f5f5;
    border-top: 1px solid #e4e4e4;
}

.site-footer p:first-child {
    flex-shrink: 0;
}

.site-logo {
    max-width: 180px;
}

.accreditation-image {
    width: 100%;
    max-width: 520px;
}

.list-group-item {
    padding: .875rem 1rem;
}

.list-group-item-action:hover, .list-group-item-action:focus {
    background: #fff6f6;
}

.accordion {
    --bs-accordion-active-color: var(--brand-dark);
    --bs-accordion-active-bg: #fbe9ea;
    --bs-accordion-btn-focus-box-shadow: 0 0 0 .25rem rgba(207, 2, 14, .2);
}

.accordion-button {
    color: var(--brand-red);
    font-weight: 500;
}

.accordion-button:not(.collapsed)::after {
    filter: hue-rotate(140deg) saturate(1.8);
}

.accordion-collapse {
    scroll-margin-top: 1rem;
}

.btn-primary {
    --bs-btn-bg: var(--brand-red);
    --bs-btn-border-color: var(--brand-red);
    --bs-btn-hover-bg: var(--brand-dark);
    --bs-btn-hover-border-color: var(--brand-dark);
    --bs-btn-active-bg: var(--brand-dark);
    --bs-btn-active-border-color: var(--brand-dark);
    --bs-btn-disabled-bg: var(--brand-red);
    --bs-btn-disabled-border-color: var(--brand-red);
    --bs-btn-focus-shadow-rgb: 207, 2, 14;
}

.btn-outline-primary {
    --bs-btn-color: var(--brand-red);
    --bs-btn-border-color: var(--brand-red);
    --bs-btn-hover-bg: var(--brand-red);
    --bs-btn-hover-border-color: var(--brand-red);
    --bs-btn-active-bg: var(--brand-dark);
    --bs-btn-active-border-color: var(--brand-dark);
    --bs-btn-disabled-color: var(--brand-red);
    --bs-btn-disabled-border-color: var(--brand-red);
    --bs-btn-focus-shadow-rgb: 207, 2, 14;
}

.form-control:focus {
    border-color: #df737a;
    box-shadow: 0 0 0 .25rem rgba(207, 2, 14, .15);
}

.work-gallery {
    max-width: 960px;
    margin: 0 auto;
}

.work-gallery .carousel-inner {
    border: 1px solid #dedede;
    border-radius: .375rem;
}

.work-image {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: contain;
    background: #f0f0f0;
}

.work-gallery .carousel-caption {
    position: static;
    padding: 1rem;
    min-height: 6.5rem;
    color: #333;
    background: #f8f8f8;
    text-align: left;
}

.work-gallery .carousel-caption > :last-child {
    margin-bottom: 0;
}

.gallery-controls {
    padding-top: 1rem;
}

@media (max-width: 991.98px) {
    .navbar-collapse {
        padding-top: .75rem;
    }
}

@media (max-width: 575.98px) {
    .site-header {
        padding-top: .75rem;
        padding-bottom: 1.25rem;
    }

    .lead {
        font-size: 1.125rem;
    }

    .site-logo {
        max-width: 150px;
    }

    .site-footer .small {
        font-size: .8125rem;
    }
}