/* ------------------------------------------------------------------
   legal.css — Privacy Policy / Cookie Policy / Terms & Conditions pages,
   the contact-form consent note, and the site-wide cookie-consent banner.
   Palette unchanged: site teal #006380 on white / soft grey.
   ------------------------------------------------------------------ */

.legal-page {
    background: #eef4f5;
    color: #3d4a4d;
    line-height: 1.75;
    -webkit-font-smoothing: antialiased;
}

/* ---------- Page header band ---------- */
.legal-head {
    position: relative;
    background: linear-gradient(160deg, #00778f 0%, #006380 55%, #00566f 100%);
    color: #fff;
    /* top padding clears the site's position:fixed <header> (css/header.css) */
    padding: 124px 0 46px;
    overflow: hidden;
}
.legal-head::after {
    content: "";
    position: absolute;
    right: -80px;
    top: -80px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .05);
}
.legal-head-inner {
    position: relative;
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 24px;
}
.legal-breadcrumb {
    font-size: 13px;
    letter-spacing: .2px;
    margin-bottom: 14px;
    color: rgba(255, 255, 255, .78);
}
.legal-breadcrumb a {
    color: rgba(255, 255, 255, .78);
    text-decoration: none;
}
.legal-breadcrumb a:hover { color: #fff; text-decoration: underline; }
.legal-breadcrumb span { margin: 0 8px; opacity: .5; }
.legal-breadcrumb .current { color: #fff; }

.legal-head h1 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: clamp(26px, 4vw, 36px);
    line-height: 1.2;
    margin: 0;
}
.legal-head h1::after {
    content: "";
    display: block;
    width: 54px;
    height: 4px;
    border-radius: 4px;
    background: #7fd6c6;
    margin-top: 16px;
}
.legal-lede {
    margin: 16px 0 0;
    max-width: 640px;
    font-size: 15.5px;
    color: rgba(255, 255, 255, .9);
}

/* ---------- Layout: sticky TOC + content ---------- */
.legal-shell {
    max-width: 1120px;
    margin: 0 auto;
    padding: 44px 24px 72px;
}
.legal-layout {
    display: grid;
    grid-template-columns: 244px minmax(0, 1fr);
    gap: 44px;
    align-items: start;
}

.legal-toc {
    position: sticky;
    top: 96px;
    font-size: 13.5px;
}
.legal-toc-title {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 11px;
    font-weight: 700;
    color: #6d8388;
    margin: 0 0 12px;
    padding-left: 14px;
}
.legal-toc ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border-left: 2px solid #d7e3e5;
}
.legal-toc li { margin: 0; }
.legal-toc a {
    display: block;
    padding: 7px 14px;
    margin-left: -2px;
    border-left: 2px solid transparent;
    color: #5a6b6e;
    text-decoration: none;
    transition: color .15s, border-color .15s, background .15s;
}
.legal-toc a:hover { color: #006380; background: #e4eef0; }
.legal-toc a.is-active {
    color: #006380;
    font-weight: 600;
    border-left-color: #006380;
    background: #e4eef0;
}

/* Mobile "On this page" disclosure — hidden on desktop */
.legal-toc-mobile { display: none; }

/* ---------- Content card ---------- */
.legal-card {
    background: #fff;
    border: 1px solid #e3ecee;
    border-radius: 16px;
    box-shadow: 0 18px 40px rgba(0, 60, 75, .07);
    padding: 44px 52px;
    max-width: 780px;
}

.legal-card > .legal-intro {
    font-size: 16px;
    color: #334043;
}

.legal-card h2 {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #084c5e;
    margin: 0 0 12px;
    padding-top: 30px;
    margin-top: 30px;
    border-top: 1px solid #eaf0f1;
    scroll-margin-top: 96px;
}
.legal-card h2.no-rule {
    border-top: 0;
    padding-top: 0;
    margin-top: 0;
}

.legal-card p { margin: 0 0 14px; font-size: 15px; }
.legal-card ul {
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}
.legal-card li {
    position: relative;
    padding-left: 22px;
    margin-bottom: 9px;
    font-size: 15px;
}
.legal-card li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 10px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #4aa6b0;
}

.legal-card a {
    color: #006380;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid rgba(0, 99, 128, .35);
}
.legal-card a:hover { border-bottom-color: #006380; }

/* Contact / address callout */
.legal-address {
    margin: 6px 0 4px;
    background: #f1f7f8;
    border: 1px solid #dcebed;
    border-left: 4px solid #006380;
    border-radius: 8px;
    padding: 18px 20px;
    font-size: 14.5px;
    line-height: 1.7;
    white-space: pre-line;
}

/* Related pages */
.legal-related {
    margin-top: 34px;
    padding-top: 22px;
    border-top: 1px solid #eaf0f1;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}
.legal-related .legal-related-label {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .6px;
    color: #6d8388;
    font-weight: 700;
    margin-right: 4px;
}
.legal-related a {
    display: inline-block;
    padding: 7px 16px;
    border: 1px solid #cddee0;
    border-radius: 30px;
    font-size: 13.5px;
    font-weight: 600;
    color: #006380;
    text-decoration: none;
    transition: background .15s, color .15s, border-color .15s;
}
.legal-related a:hover {
    background: #006380;
    border-color: #006380;
    color: #fff;
}

/* ---------- Responsive ---------- */
@media (max-width: 992px) {
    .legal-layout { grid-template-columns: 1fr; gap: 22px; }
    .legal-toc { display: none; }
    .legal-toc-mobile {
        display: block;
        background: #fff;
        border: 1px solid #e3ecee;
        border-radius: 12px;
        padding: 4px 6px;
        margin-bottom: 18px;
    }
    .legal-toc-mobile summary {
        list-style: none;
        cursor: pointer;
        padding: 12px 14px;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        font-size: 13px;
        text-transform: uppercase;
        letter-spacing: .8px;
        color: #084c5e;
    }
    .legal-toc-mobile summary::-webkit-details-marker { display: none; }
    .legal-toc-mobile summary::after { content: "  +"; color: #6d8388; }
    .legal-toc-mobile[open] summary::after { content: "  –"; }
    .legal-toc-mobile ul { list-style: none; margin: 0; padding: 4px 6px 10px; }
    .legal-toc-mobile a {
        display: block;
        padding: 8px 12px;
        border-radius: 8px;
        color: #5a6b6e;
        text-decoration: none;
        font-size: 14px;
    }
    .legal-toc-mobile a:hover { background: #e4eef0; color: #006380; }
    .legal-card { max-width: none; }
}
@media (max-width: 600px) {
    .legal-head { padding: 104px 0 34px; }
    .legal-shell { padding: 24px 16px 56px; }
    .legal-card { padding: 26px 22px; border-radius: 14px; }
}

@media print {
    .legal-head { color: #000; background: none; padding: 0 0 12px; }
    .legal-head h1::after, .legal-breadcrumb, .legal-toc, .legal-toc-mobile,
    #cookieConsentBanner, header, footer { display: none !important; }
    .legal-card { box-shadow: none; border: 0; padding: 0; }
}

/* ---------- Contact-form consent note ---------- */
.form-consent-note {
    font-size: 13px;
    line-height: 1.5;
    text-align: center;
    margin: 14px auto 0;
    max-width: 460px;
    color: inherit;
    opacity: .9;
}
.form-consent-note a {
    text-decoration: underline;
    font-weight: 600;
    color: inherit;
}

/* The cookie-consent banner (#cookieConsentBanner) and the footer legal links
   (.footer-legal-links) are styled by self-contained <style> blocks injected by
   js/script.js and inside each footer.html, so they also work on the products/
   and eIFU/ sub-sites which do not load this stylesheet. */
