:root {
    --cass-navy: #002e5f;
    --cass-blue: #00aee6;
    --cass-ink: #182536;
    --cass-surface: #f5f7fa;
}

html { scroll-behavior: smooth; }

body {
    color: var(--cass-ink);
    background: #fff;
}

/* Shared header */
.header {
    height: 72px;
    padding: 0 5vw;
    background: transparent;
    box-shadow: none;
    transition: background .2s ease, box-shadow .2s ease;
}

.site-subpage .header,
.header.header-scrolled {
    background: #fff;
    box-shadow: 0 4px 18px rgba(0, 30, 62, .18);
}

.header .logo {
    display: flex;
    align-items: center;
    width: 210px;
    height: 56px;
}

.header .logo::after {
    content: none;
}

.site-home .header:not(.header-scrolled) .logo::after { color: #fff; }

.header .logo img,
.site-subpage .header .logo img {
    width: 100%;
    height: 52px;
    object-fit: contain;
    object-position: left center;
    display: block;
}

.header .navbar ul {
    gap: 4px;
    margin: 0;
}

.header .navbar ul li { margin: 0; }

.header .navbar ul li a {
    display: block;
    padding: 10px 13px;
    color: #fff;
    font-size: 1.35rem;
    font-weight: 600;
    letter-spacing: .02em;
    text-decoration: none;
}

.site-subpage .header .navbar ul li a,
.header.header-scrolled .navbar ul li a { color: var(--cass-navy); }

.header .navbar ul li a:hover,
.header .navbar ul li a:focus {
    color: #fff;
    background: rgba(255,255,255,.14);
    border-radius: 6px;
    text-decoration: none;
}

.header .fa-bars {
    color: #fff;
    font-size: 2.3rem;
}

/* Shared product search sits in the site header on every page. */
.site-product-search { position: relative; z-index: 120; flex: 0 0 auto; margin-left: 12px; }
.site-search-toggle { width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.62); border-radius: 50%; color: #fff; background: rgba(255,255,255,.08); font-size: 1.55rem; cursor: pointer; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.site-subpage .site-search-toggle, .header.header-scrolled .site-search-toggle { border-color: rgba(0,46,95,.2); color: var(--cass-navy); background: #fff; }
.site-search-toggle:hover, .site-search-toggle:focus-visible, .site-subpage .site-search-toggle:hover { border-color: var(--cass-blue); color: #fff; background: var(--cass-navy); outline: none; }
.site-search-panel { position: absolute; top: calc(100% + 14px); right: 0; width: min(410px, calc(100vw - 32px)); padding: 20px; border: 1px solid rgba(0,46,95,.12); border-radius: 12px; background: #fff; box-shadow: 0 16px 38px rgba(0,30,62,.2); }
.site-search-panel[hidden] { display: none !important; }
.site-search-form label { display: block; margin: 0 0 8px; color: var(--cass-navy); font-size: 1.45rem; font-weight: 700; text-transform: none; }
.site-search-input-wrap { min-height: 48px; display: flex; align-items: center; gap: 6px; padding: 0 10px 0 13px; border: 1px solid #cbd5df; border-radius: 8px; background: #fff; }
.site-search-input-wrap:focus-within { border-color: var(--cass-blue); box-shadow: 0 0 0 3px rgba(0,174,230,.14); }
.site-search-input-wrap input { width: 100%; min-width: 0; height: 46px; border: 0; outline: 0; color: var(--cass-ink); background: transparent; font: 400 1.3rem 'Poppins', sans-serif; text-transform: none; }
.site-search-input-wrap input::placeholder { color: #7a8794; opacity: 1; }
.site-search-input-wrap button { width: 30px; height: 30px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 6px; color: var(--cass-navy); background: #e8f7fc; cursor: pointer; }
.site-search-input-wrap button[hidden] { display: none !important; }
.site-search-form > p { margin: 8px 0 0; color: #667085; font-size: 1.1rem; line-height: 1.5; text-transform: none; }
.site-search-form .site-search-summary { margin-top: 14px; color: var(--cass-navy); font-weight: 700; }
.site-search-results { max-height: min(360px, 55vh); margin-top: 8px; overflow-y: auto; }
.site-search-result { display: flex; flex-direction: column; gap: 2px; padding: 10px 9px; border-top: 1px solid #edf0f3; color: var(--cass-navy); text-decoration: none !important; text-transform: none; }
.site-search-result:hover, .site-search-result:focus-visible { border-radius: 6px; color: var(--cass-navy); background: #f1f9fc; }
.site-search-result strong { font-size: 1.25rem; font-weight: 700; text-transform: none; }
.site-search-result span { color: #667085; font-size: 1.05rem; text-transform: none; }
.site-search-hint, .site-search-empty { margin: 12px 0 0 !important; color: #667085 !important; font-size: 1.15rem !important; line-height: 1.5; text-transform: none; }

.site-subpage .header .fa-bars,
.header.header-scrolled .fa-bars { color: var(--cass-navy); }

/* Give fixed navigation breathing room on non-home pages. */
.site-subpage .products-section { padding-top: 120px !important; }
.site-subpage .product-detail-main { padding-top: 125px !important; }

/* Shared footer */
.footer,
.product-page-footer {
    margin: 0;
    background: var(--cass-navy);
    color: #fff;
}

.footer .footer-top {
    padding: 48px 0 26px;
    background: var(--cass-navy);
    border-top: 4px solid var(--cass-blue);
}

.footer .footer-top h4 {
    margin: 0 0 16px;
    padding-bottom: 10px;
    color: #fff;
    font-size: 1.45rem;
    letter-spacing: .08em;
}

.footer .footer-top h4::before { border-bottom-color: var(--cass-blue); }
.footer .footer-top .footer-links ul li { border-bottom-color: rgba(255,255,255,.2); }
.footer .footer-top .footer-links ul a,
.footer .footer-top .footer-contact p { color: rgba(255,255,255,.9); }
.footer .footer-top .footer-links ul a:hover { color: #fff; }

.footer .copyright,
.product-page-footer p {
    margin: 0;
    padding: 20px 0;
    color: rgba(255,255,255,.78);
    font-size: 1.25rem;
}

.product-page-footer {
    border-top: 4px solid var(--cass-blue);
    text-align: center;
}
.product-page-footer a { color: rgba(255,255,255,.9); text-decoration: underline; }
.product-page-footer a:hover { color: #fff; }

/* Consistent contact footer across the public site. */
.site-footer { margin: 0; border-top: 4px solid var(--cass-blue); background: var(--cass-navy); color: #fff; }
.site-footer-main { width: min(1140px, calc(100% - 48px)); margin: 0 auto; padding: 30px 0 26px; display: grid; grid-template-columns: 1.15fr 1fr .8fr; gap: 36px; }
.site-footer-main > * { min-width: 0; }
.site-footer-brand img { display: block; width: 210px; max-width: 100%; height: 54px; object-fit: contain; object-position: left center; }
.site-footer-brand p { margin: 12px 0 0; color: rgba(255,255,255,.78); font-size: 1.25rem; line-height: 1.6; }
.site-footer-contact h2, .site-footer-links h2 { margin: 0 0 10px; color: #fff; font-size: 1.4rem; font-weight: 700; letter-spacing: .04em; text-transform: none; }
.site-footer-contact address, .site-footer-contact a, .site-footer-links a { display: block; margin: 0 0 6px; color: rgba(255,255,255,.88); font-size: 1.25rem; font-style: normal; line-height: 1.55; text-decoration: none; text-transform: none; }
.site-footer-contact a[href^="mailto:"] { overflow-wrap: anywhere; }
.site-footer-contact a:hover, .site-footer-links a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.site-footer-bottom { border-top: 1px solid rgba(255,255,255,.18); }
.site-footer-bottom p { width: min(1140px, calc(100% - 48px)); margin: 0 auto; padding: 14px 0; color: rgba(255,255,255,.76); font-size: 1.15rem; line-height: 1.5; }

@media (max-width: 1000px) {
    .header { height: 64px; padding: 0 24px; }
    .header .logo { width: 150px; height: 48px; }
    .header .navbar {
        top: -120%;
        background: var(--cass-navy);
        border: 0;
        box-shadow: 0 8px 20px rgba(0, 30, 62, .18);
    }
    .header .navbar ul { padding: 14px 0; }
    .header .navbar ul li { margin: 0; width: 100%; text-align: center; }
    .header .navbar ul li a,
    .site-subpage .header .navbar ul li a,
    .header.header-scrolled .navbar ul li a { color: #fff; font-size: 1.6rem; }
    .header .nav-toggle { top: 64px; }
    .site-product-search { position: absolute; top: 10px; right: 72px; margin: 0; }
    .site-search-toggle { width: 40px; height: 40px; }
    .site-search-panel { top: calc(100% + 14px); right: -54px; }
    .site-subpage .products-section { padding-top: 94px !important; }
    .site-subpage .product-detail-main { padding-top: 94px !important; }
}

@media (max-width: 700px) {
    .site-footer-main { width: calc(100% - 36px); grid-template-columns: 1fr 1fr; gap: 22px; padding: 26px 0 20px; }
    .site-footer-brand { grid-column: 1 / -1; }
    .site-footer-bottom p { width: calc(100% - 36px); }
}