:root {
    --ink: #17231f;
    --paper: #f5f2ea;
    --lime: #c5e55a;
    --muted: #62706a;
    --line: #d9d7cf;
    --orange: #c96b2c;
    --white: #ffffff;
    --card: #faf8f2;
    --sans: Arial, Helvetica, sans-serif;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: var(--sans);
    line-height: 1.55;
}

img {
    max-width: 100%;
    height: auto;
}

a {
    color: inherit;
}

.skip-link {
    position: absolute;
    left: -9999px;
}

.skip-link:focus {
    left: 1rem;
    top: 1rem;
    z-index: 100;
    background: var(--white);
    padding: .6rem 1rem;
}


/* =========================
   HEADER
========================= */


.site-header {

    min-height: 78px;
    padding: 0 max(5vw, 1.2rem);

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-bottom: 1px solid var(--line);

    background: rgba(245, 242, 234, .92);

    backdrop-filter: blur(10px);

    position: sticky;
    top: 0;
    z-index: 50;
}


.brand {

    display:flex;
    align-items:center;
    gap:12px;

    color:var(--ink);
    text-decoration:none;

    font-weight:800;
    letter-spacing:.08em;

}


.brand small {

    display: block;

    font-size: .57rem;

    letter-spacing: .1em;

    font-weight: 500;
}


.brand-mark {

    width: 58px;
    height: 58px;

    display: block;

    object-fit: contain;

    border-radius: 50%;

    background: transparent;

}


nav {

    display: flex;

    align-items: center;

    gap: 1.4rem;
}


nav a {

    text-decoration: none;

    font-size: .86rem;

    font-weight: 700;
}


.nav-cta,
.button {

    background: var(--ink);

    color: var(--white) !important;

    padding: .78rem 1.05rem;

    border-radius: 4px;
}


.menu-button {

    display: none;
}



/* =========================
   GLOBAL SECTIONS
========================= */


.hero,
.section,
.intro,
.contact,
footer {

    padding-left: max(5vw, 1.2rem);
    padding-right: max(5vw, 1.2rem);

}


.hero {

    min-height: 680px;

    padding-top: 12vh;

    display: grid;

    align-content: center;

    background:
        linear-gradient(115deg,
            #e7e2d7 0%,
            #f5f2ea 55%,
            #c8d2a8 100%);
}


.eyebrow,
.section-label {

    font-size: .72rem;

    font-weight: 800;

    letter-spacing: .13em;

    color: #52631d;

    margin-bottom: 1.15rem;
}



.hero h1 {

    font-family: Georgia, serif;

    max-width: 900px;

    font-size: clamp(3rem, 7vw, 6.4rem);

    line-height: .98;

    letter-spacing: -.055em;

    margin: 0;

}



.lead {

    max-width: 660px;

    margin: 2rem 0;

    font-size: clamp(1.05rem, 2vw, 1.35rem);
}



.actions {

    display: flex;

    align-items: center;

    gap: 1.4rem;

    flex-wrap: wrap;

}


.button {

    display: inline-block;

    text-decoration: none;

    font-weight: bold;
}


.text-link {

    font-weight: bold;

    text-underline-offset: 4px;
}



/* =========================
 TRUST
========================= */


.trust-strip {

    display: flex;

    gap: clamp(1.5rem, 6vw, 6rem);

    margin: 8vh 0 0;

}


.trust-strip div {

    border-left: 1px solid #899080;

    padding-left: .9rem;

}


.trust-strip dt {

    font-family: Georgia, serif;

    font-size: 1.4rem;

    font-weight: bold;
}


.trust-strip dd {

    margin: 0;

    color: var(--muted);

    font-size: .8rem;
}



/* =========================
 TYPOGRAPHY
========================= */


.intro h2,
.section h2,
.contact h2 {

    font-family: Georgia, serif;

    font-size: clamp(2.1rem, 4.6vw, 4.25rem);

    line-height: 1.05;

    letter-spacing: -.04em;

    margin: 0 0 1.3rem;

}


.intro {

    display: grid;

    grid-template-columns: 1fr 2fr;

    gap: 6vw;

    padding-top: 8rem;

    padding-bottom: 8rem;

}


.intro p {

    max-width: 650px;

    font-size: 1.17rem;

}

/* =========================
   SECTIONS
========================= */


.section {

    padding-top: 7.5rem;
    padding-bottom: 7.5rem;

    border-top: 1px solid var(--line);

}


.section-heading {

    display: flex;

    justify-content: space-between;

    gap: 3rem;

    margin-bottom: 3rem;

}


.section-heading h2 {

    max-width: 720px;

}


.section-heading p {

    max-width: 330px;

    color: var(--muted);

}



/* =========================
   OFFER / BENEFITS
========================= */


.offer-grid,
.benefit-grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1rem;

}


.offer-grid article {

    min-height: 210px;

    padding: 1.6rem;

    background: var(--card);

    border: 1px solid var(--line);

}


.offer-grid h3,
.benefit-grid h3 {

    margin: 0 0 .8rem;

    font-size: 1.05rem;

}


.offer-grid p,
.benefit-grid p {

    color: var(--muted);

    font-size: .92rem;

}



.note {

    margin-top: 1rem;

    padding: 1.4rem 1.6rem;

    background: var(--lime);

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 1.6rem;

    flex-wrap: wrap;

}


.note a {

    font-weight: bold;

}




/* =========================
   APPLICATIONS
========================= */


.applications {

    background: #e9e3d7;

}


.tag-list {

    display: flex;

    flex-wrap: wrap;

    gap: .75rem;

    list-style: none;

    padding: 0;

    margin: 2rem 0 0;

}


.tag-list li {

    padding: .6rem .9rem;

    border: 1px solid #899080;

    border-radius: 99px;

    font-size: .9rem;

}



/* =========================
   DARK SECTION
========================= */


.dark {

    background: var(--ink);

    color: #f7f4ec;

}


.dark .section-label {

    color: var(--lime);

}


.benefit-grid article {

    padding: 1rem 1rem 0 0;

}


.benefit-grid span {

    color: var(--lime);

    font-size: .8rem;

    font-weight: bold;

}


.benefit-grid p {

    color: #b9c1bc;

}



/* =========================
 FAQ
========================= */


.faq {

    max-width: 1000px;

}


.faq details {

    border-top: 1px solid var(--line);

    padding: 1.25rem 0;

}


.faq summary {

    cursor: pointer;

    font-weight: bold;

}


.faq p {

    max-width: 700px;

    margin: 1rem 0 0;

    color: var(--muted);

}




/* =========================
 CONTACT
========================= */


.contact {

    background: var(--lime);

    padding-top: 7rem;

    padding-bottom: 7rem;

    display: grid;

    grid-template-columns: 2fr 1fr;

    gap: 5vw;

}


.contact p {

    max-width: 580px;

    font-size: 1.12rem;

}


.contact address {

    display: flex;

    flex-direction: column;

    gap: 1.2rem;

    font-style: normal;

    border-left: 1px solid #77913a;

    padding-left: 1.5rem;

}


.contact address a {

    color: var(--ink);

}



/* =========================
 FOOTER
========================= */


footer {

    background: var(--ink);

    color: #c8d0ca;

    padding-top: 3rem;

    padding-bottom: 2.5rem;

    display: flex;

    flex-direction: column;

    gap: 1.8rem;

}


.footer-brand {

    font-weight: 800;

    letter-spacing: .08em;

}


.footer-brand span {

    font-weight: 400;

}

.footer-legal {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .75rem 2rem;
    padding-top: 1.2rem;
    border-top: 1px solid rgba(255, 255, 255, .16);
    color: #e1e6e2;
    font-size: .84rem;
}

.footer-legal p {
    margin: 0;
}

.footer-legal a,
.footer-infrastructure a {
    color: var(--white);
    text-underline-offset: .2em;
}

.footer-infrastructure {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(0, 1.7fr);
    gap: clamp(1.5rem, 5vw, 5rem);
    padding-top: 2rem;
    border-top: 1px solid rgba(255, 255, 255, .16);
}

.footer-kicker {
    margin-bottom: .55rem;
    color: var(--lime);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.footer-infrastructure h2 {
    margin: 0;
    max-width: 430px;
    color: var(--white);
    font-family: Georgia, serif;
    font-size: clamp(1.35rem, 2.5vw, 2rem);
    line-height: 1.15;
}

.footer-infrastructure h2 span {
    display: block;
    margin-top: .35rem;
    color: #b9c1bc;
    font-family: var(--sans);
    font-size: .72rem;
    font-weight: 500;
    letter-spacing: .04em;
}

.footer-infrastructure-copy {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 2rem;
    color: #d6ddd8;
    font-size: .84rem;
    line-height: 1.6;
}

.footer-infrastructure-copy p {
    margin: 0;
}

.footer-infrastructure-copy strong {
    color: var(--white);
}



/* =========================
 LANGUAGE SWITCHER
========================= */


.footer-languages {

    width: 100%;

}


.language-grid {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    align-items: center;

    gap: 10px;

    max-width: 1400px;

    margin: auto;

    padding: 0;

    list-style: none;

}


.language-grid li {

    margin: 0;

}


.language-grid a {

    min-width: 58px;

    height: 34px;

    padding: 5px 10px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    border-radius: 18px;

    background: rgba(255, 255, 255, .06);

    color: #c8d0ca;

    text-decoration: none;

    font-size: .78rem;

    font-weight: 700;

    transition: .25s ease;

}


.language-grid img {

    width: 20px;

    height: 20px;

    border-radius: 50%;

    object-fit: cover;

}


.language-grid a:hover {

    transform: translateY(-2px);

    background: rgba(255, 255, 255, .15);

}


.language-grid .active {

    background: var(--lime);

    color: var(--ink);

}



/* =========================
 RESPONSIVE
========================= */


@media(max-width:1100px) {

    .offer-grid,
    .benefit-grid {

        grid-template-columns: repeat(2, 1fr);

    }

}



@media(max-width:760px) {


    .site-header {

        padding: 0 1.2rem;

    }

    .footer-infrastructure {
        grid-template-columns: 1fr;
    }

    .footer-infrastructure-copy {
        grid-template-columns: 1fr;
    }


    .menu-button {

        display: block;

        border: 1px solid var(--ink);

        background: transparent;

        padding: .5rem;

        cursor: pointer;

    }


    .site-header nav {

        display: none;

        position: absolute;

        left: 0;

        right: 0;

        top: 78px;

        padding: 1rem 1.2rem;

        flex-direction: column;

        align-items: flex-start;

        background: var(--paper);

        border-bottom: 1px solid var(--line);

    }


    .site-header nav.open {

        display: flex;

    }


    .hero {

        min-height: 620px;

    }


    .intro,
    .contact {

        grid-template-columns: 1fr;

        padding-top: 5rem;

        padding-bottom: 5rem;

    }


    .section-heading {

        display: block;

    }


    .contact address {

        border-left: 0;

        border-top: 1px solid #77913a;

        padding: 1.5rem 0 0;

    }


    .language-grid {

        gap: 8px;

    }


    .language-grid a {

        min-width: 52px;

        height: 30px;

        padding: 4px 8px;

    }


}



@media(max-width:460px) {


    .offer-grid,
    .benefit-grid {

        grid-template-columns: 1fr;

    }


    .hero h1 {

        font-size: 3.1rem;

    }


    .trust-strip {

        flex-wrap: wrap;

    }


    .trust-strip div {

        min-width: 42%;

    }


    .language-grid img {

        width: 18px;

        height: 18px;

    }


}

/* =========================
   PRIVACY POLICY
========================= */

.privacy-header { position: static; }
.privacy-back { font-weight: 700; text-decoration: none; }
.privacy-page { width: min(960px, calc(100% - 2.4rem)); margin: 0 auto; padding: clamp(3rem, 8vw, 6rem) 0; }
.privacy-intro { margin-bottom: 3rem; }
.privacy-intro h1 { margin: 0 0 1rem; font-family: Georgia, serif; font-size: clamp(2.5rem, 6vw, 4.8rem); line-height: 1.05; }
.privacy-intro > p:not(.privacy-date) { max-width: 700px; color: var(--muted); font-size: 1.1rem; }
.privacy-date { margin-top: 1.5rem; font-weight: 700; }
.privacy-page section { padding: 2rem 0; border-top: 1px solid var(--line); }
.privacy-page h2 { margin: 0 0 1rem; font-family: Georgia, serif; font-size: clamp(1.5rem, 3vw, 2rem); }
.privacy-page p, .privacy-page li { max-width: 820px; }
.privacy-page li + li { margin-top: .55rem; }
.privacy-table-wrap { overflow-x: auto; }
.privacy-page table { width: 100%; border-collapse: collapse; background: var(--card); }
.privacy-page th, .privacy-page td { padding: 1rem; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.privacy-page th { background: var(--ink); color: var(--white); }
.privacy-footer small a { color: inherit; }

@media (max-width: 620px) {
    .privacy-header .brand small { display: none; }
    .privacy-back { font-size: .8rem; }
    .privacy-page th, .privacy-page td { min-width: 180px; padding: .8rem; }
}