.contact-page {
    padding-top: 0%;      /* room for the fixed header */
    background: var(--off-white);
    color: var(--black);
}

.contact-information {
    width: min(1100px, 88%);
    margin: auto;
    padding: 90px 0;

    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 75px;
}

.contact-heading {
    position: sticky;
    top: 130px;
    align-self: start;
}

.contact-heading span,
.location-heading span {
    display: inline-block;
    margin-bottom: 16px;

    color: var(--dark-text);

    font-family: var(--body-font);
    font-size: 0.75rem;
    font-weight: 700;

    letter-spacing: 3px;
}

.contact-heading h1,
.location-heading h2 {
    margin: 0;

    color: var(--black);

    font-family: var(--heading-font);
    font-size: clamp(3rem, 5vw, 4.5rem);
    font-weight: 400;

    line-height: 0.88;
}

.contact-heading > p {
    max-width: 430px;
    margin: 28px 0 0;

    color: var(--warm-brown);

    font-family: var(--body-font);
    font-size: 1.05rem;
    font-weight: 500;

    line-height: 1.6;
}

.contact-heading > p + p {
    margin-top: 14px;
}

.contact-details {
    border-top: 1px solid rgba(90, 64, 52, 0.2);
}

.contact-item {
    display: grid;
    grid-template-columns: 45px 1fr;
    gap: 20px;

    padding: 25px 0;

    border-bottom: 1px solid rgba(90, 64, 52, 0.2);
}

.contact-item-number {
    padding-top: 3px;

    color: var(--dark-text);

    font-family: var(--heading-font);
    font-size: 1rem;
}

.contact-item-label {
    display: block;
    margin-bottom: 7px;

    color: #776b64;

    font-family: var(--body-font);
    font-size: 0.72rem;
    font-weight: 700;

    letter-spacing: 2.5px;
}

.contact-item a,
.contact-item p {
    display: block;
    margin: 0;

    color: var(--black);

    font-family: var(--body-font);
    font-size: 1.15rem;
    font-weight: 600;

    line-height: 1.5;
    text-decoration: none;
}

.contact-item a {
    transition: color 0.25s ease;
}

.contact-item a:hover {
    color: var(--dark-text);
}

.contact-social-links {

    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.contact-social-links a {
    padding: 8px 14px;

    border: 1px solid rgba(90, 64, 52, 0.35);

    font-size: 0.95rem;

    transition:
        background 0.25s ease,
        color 0.25s ease,
        border-color 0.25s ease;
}

.contact-social-links a:hover {
    background: var(--black);
    border-color: var(--black);
    color: var(--white);
}

.contact-location {
    padding: 85px 6%;

    background: var(--black);
    color: var(--white);
}

.location-heading {
    width: min(1100px, 88%);
    margin: 0 auto 40px;
}

.location-heading h2 {
    color: var(--white);
}

.location-heading span {
    color: var(--copper);     /* was dark brown on black: unreadable */
}

.location-heading p {
    max-width: 520px;
    margin-top: 25px;

    color: rgba(255, 255, 255, 0.68);

    font-family: var(--body-font);
    font-size: 1.05rem;

    line-height: 1.6;
}

.location-card {
    width: min(1100px, 88%);
    margin: auto;
    padding: 55px;

    border: 1px solid rgba(255, 255, 255, 0.18);

    background:
        linear-gradient(
            135deg,
            rgba(90, 64, 52, 0.25),
            rgba(255, 255, 255, 0.03)
        );
}

.location-card-number {
    margin-bottom: 15px;

    color: var(--copper);

    font-family: var(--body-font);
    font-size: 0.75rem;
    font-weight: 700;

    letter-spacing: 3px;
}

.location-card h3 {
    margin-bottom: 15px;

    color: var(--white);

    font-family: var(--heading-font);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 400;
}

.location-card p {
    margin-bottom: 30px;

    color: rgba(255, 255, 255, 0.7);

    font-family: var(--body-font);
    font-size: 1.1rem;

    line-height: 1.5;
}

.location-button {
    display: inline-block;

    padding: 13px 22px;

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

    background: var(--copper);
    color: var(--black);

    font-family: var(--body-font);
    font-size: 0.9rem;
    font-weight: 700;

    letter-spacing: 1.5px;
    text-decoration: none;

    transition:
        background 0.25s ease,
        color 0.25s ease;
}

.location-button:hover {
    background: transparent;
    color: var(--copper);
}

.contact-footer {
    padding: 25px 6%;

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

    gap: 20px;

    background: var(--black);
    color: var(--white);
}

.contact-footer strong {
    display: block;
    margin-bottom: 3px;

    font-family: var(--body-font);
    font-size: 0.95rem;
    font-weight: 700;

    letter-spacing: 1.5px;
}

.contact-footer p {
    margin: 0;

    color: rgba(255, 255, 255, 0.6);

    font-family: var(--body-font);
    font-size: 0.85rem;
}

.contact-footer > a {
    color: var(--white);

    font-family: var(--body-font);
    font-size: 0.85rem;
    font-weight: 600;

    text-decoration: none;
    transition: color 0.25s ease;
}

.contact-footer > a:hover {
    color: var(--copper);     /* was dark brown on black: unreadable */
}

/* TABLET */

@media (max-width: 900px) {
    .contact-page {
        padding-top: 70px;
    }
}

@media (max-width: 800px) {

    .contact-information {
        grid-template-columns: 1fr;
        gap: 50px;
        padding: 70px 0;
    }

    .contact-heading {
        position: static;
    }

    .contact-heading > p {
        max-width: 650px;
    }

    .contact-location {
        padding: 70px 0;
    }

    .location-heading,
    .location-card {
        width: 88%;
    }

    .location-card {
        padding: 45px;
    }
}

/* MOBILE */

@media (max-width: 600px) {

    .contact-page {
        padding-top: 70px;
    }

    .contact-information {
        width: 88%;
        padding: 55px 0;
        gap: 45px;
    }

    .contact-heading span,
    .location-heading span {
        font-size: 0.68rem;
        letter-spacing: 2.5px;
    }

    .contact-heading h1,
    .location-heading h2 {
        font-size: clamp(3rem, 14vw, 4rem);
    }

    .contact-heading > p {
        font-size: 1rem;
        line-height: 1.55;
    }

    .contact-item {
        grid-template-columns: 35px 1fr;
        gap: 14px;
        padding: 21px 0;
    }

    .contact-item a,
    .contact-item p {
        font-size: 1rem;
    }

    .contact-location {
        padding: 55px 0;
    }

    .location-heading {
        margin-bottom: 30px;
    }

    .location-heading p {
        font-size: 1rem;
    }

    .location-card {
        padding: 35px 25px;
    }

    .location-card h3 {
        font-size: 2.2rem;
    }

    .location-card p {
        font-size: 1rem;
    }

    .location-button {
        width: 100%;
        text-align: center;
    }

    .contact-footer {
        padding: 22px 6%;

        flex-direction: column;
        align-items: flex-start;
    }
}

/* keyboard focus */
.contact-item a:focus-visible,
.location-button:focus-visible,
.contact-footer > a:focus-visible {
    outline: 2px solid var(--copper);
    outline-offset: 3px;
}

/* Contact page — Fix & Drive olive and neutral theme */
body.contact-site {
    --black: #262821;
    --white: #FCFCFC;
    --off-white: #FCFCFC;
    --warm-brown: #696258;
    --copper: #2D3B15;
    --dark-red: #2D3B15;
    --dark-text: #2D3B15;
    --heading-font: "Century Gothic", "Gabie Sans Serif", Arial, sans-serif;
    --body-font: "Century Gothic", "Gabie Sans Serif", Arial, sans-serif;
    background: #FCFCFC;
    color: #262821;
}
.contact-page { padding-top: 86px; background:#FCFCFC; color:#262821; }
.contact-information {
    width:min(1160px,88%);
    padding:90px 0 100px;
    grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
    gap:clamp(38px,7vw,92px);
}
.contact-heading { top:125px; }
.contact-heading span,.location-heading span {
    color:#2D3B15;
    font:700 .68rem/1.4 var(--body-font);
    letter-spacing:.18em;
}
.contact-heading h1,.location-heading h2 {
    color:#262821;
    font:700 clamp(3rem,6vw,5rem)/.98 var(--heading-font);
    letter-spacing:-.075em;
}
.contact-heading > p { color:#696258; font-size:.94rem; line-height:1.8; }
.contact-details {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 26px;
    border-top:1px solid rgba(45,59,21,.18);
}
.contact-item {
    grid-template-columns:30px minmax(0,1fr);
    gap:13px;
    padding:22px 0;
    border-bottom:1px solid rgba(45,59,21,.18);
}
.contact-item-number { color:#2D3B15; font:600 .78rem/1.5 var(--body-font); }
.contact-item-label { color:#696258; font:700 .62rem/1.4 var(--body-font); letter-spacing:.15em; }
.contact-item a,.contact-item p { color:#262821; font:500 .88rem/1.7 var(--body-font); overflow-wrap:anywhere; }
.contact-item a:hover { color:#2D3B15; }
.contact-social-links { gap:7px; }
.contact-social-links a { padding:7px 10px; border:1px solid rgba(45,59,21,.2); color:#262821; font-size:.75rem; }
.contact-social-links a:hover { border-color:#2D3B15; background:#2D3B15; color:#fff; }
.contact-location {
    padding:74px 6%;
    display:grid;
    grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
    gap:clamp(30px,6vw,80px);
    align-items:center;
    background:#f1f2ed;
    color:#262821;
}
.location-heading { width:min(1160px,100%); margin:0; }
.location-heading h2 { color:#262821; }
.location-heading p { max-width:420px; color:#696258; font-size:.9rem; line-height:1.8; }
.location-card {
    width:100%;
    margin:0;
    padding:clamp(28px,4vw,48px);
    border:1px solid rgba(45,59,21,.18);
    border-left:3px solid #2D3B15;
    background:#FCFCFC;
}
.location-card-number { color:#2D3B15; font:700 .66rem/1.4 var(--body-font); letter-spacing:.16em; }
.location-card h3 { color:#262821; font:700 clamp(1.8rem,3vw,2.6rem)/1.15 var(--heading-font); letter-spacing:-.05em; }
.location-card p { color:#696258; font-size:.92rem; line-height:1.7; }
.location-button {
    padding:12px 17px;
    border:1px solid #2D3B15;
    border-radius:2px;
    background:#2D3B15;
    color:#fff;
    font:700 .68rem/1.3 var(--body-font);
    letter-spacing:.1em;
}
.location-button:hover { background:transparent; color:#2D3B15; }
.contact-footer {
    padding:28px 6%;
    flex-wrap:wrap;
    background:#fff;
    border-top:1px solid rgba(45,59,21,.15);
    color:#262821;
}
.contact-footer strong { color:#2D3B15; font:700 .86rem var(--body-font); letter-spacing:.1em; }
.contact-footer p { color:#696258; font-size:.75rem; }
.contact-footer-links { display:flex; flex-wrap:wrap; gap:10px 20px; }
.contact-footer-links a { color:#696258; font-size:.72rem; text-decoration:none; }
.contact-footer-links a:hover,.contact-footer-links a[aria-current="page"] { color:#2D3B15; }
@media(max-width:900px) {
    .contact-page { padding-top:70px; }
    .contact-information { grid-template-columns:1fr; gap:34px; padding:60px 0 70px; }
    .contact-heading { position:static; }
    .contact-heading > p { max-width:650px; }
    .contact-location { grid-template-columns:1fr; gap:25px; padding:55px 6%; }
}
@media(max-width:600px) {
    .contact-information { width:90%; padding:48px 0 56px; }
    .contact-heading h1,.location-heading h2 { font-size:clamp(2.8rem,14vw,4rem); }
    .contact-heading > p { font-size:.88rem; }
    .contact-details { grid-template-columns:1fr; }
    .contact-item { padding:17px 0; }
    .contact-location { padding:48px 0; }
    .location-heading,.location-card { width:90%; margin-inline:auto; }
    .location-card { padding:26px 22px; }
    .contact-footer { align-items:flex-start; flex-direction:column; padding:25px 5%; }
    .contact-footer-links { gap:11px 16px; }
}
.contact-site .skip-link {
    position:absolute;
    top:-80px;
    left:16px;
    z-index:2000;
    padding:10px 16px;
    background:#2D3B15;
    color:#fff;
}
.contact-site .skip-link:focus { top:12px; }

/* Contact layout inspired by the supplied reference */
.contact-hero {
    width:min(1160px,88%);
    margin:0 auto;
    padding:74px 0 46px;
    display:grid;
    grid-template-columns:minmax(0,.95fr) minmax(330px,.9fr);
    align-items:center;
    gap:clamp(42px,8vw,100px);
}
.contact-hero-copy { max-width:530px; }
.contact-eyebrow { display:block; margin:0 0 14px; color:#2D3B15; font:700 .66rem var(--body-font); letter-spacing:.16em; }
.contact-hero h1 { margin:0; color:#262821; font:700 clamp(3.2rem,6vw,5rem)/.98 var(--heading-font); letter-spacing:-.08em; }
.contact-hero-copy > p { max-width:480px; margin:17px 0 24px; color:#696258; font-size:.9rem; line-height:1.75; }
.contact-quick-links { max-width:470px; padding-top:13px; border-top:1px solid rgba(45,59,21,.25); }
.contact-quick-links > * { display:block; margin:0; padding:7px 0; color:#262821; font-size:.78rem; line-height:1.55; text-decoration:none; }
.contact-quick-links > *:hover { color:#2D3B15; }
.contact-quick-links span { display:inline-block; min-width:88px; color:#2D3B15; font-size:.63rem; font-weight:700; letter-spacing:.12em; }
.contact-hero-photo { position:relative; width:min(100%,440px); aspect-ratio:1; justify-self:center; margin:0; overflow:hidden; border-radius:50%; background:#e7e8e1; }
.contact-hero-photo img { width:100%; height:100%; display:block; object-fit:cover; object-position:center; }
.contact-hero-photo figcaption { position:absolute; right:14px; bottom:14px; padding:10px 14px; background:rgba(252,252,252,.94); color:#2D3B15; font-size:.67rem; font-weight:600; letter-spacing:.04em; }
.contact-info-cards { width:min(1160px,88%); margin:0 auto; padding:22px 0 50px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.contact-info-card { min-width:0; min-height:186px; padding:23px 22px; background:#f0f1ea; }
.contact-card-index { display:block; margin-bottom:14px; color:#2D3B15; font-size:.61rem; font-weight:700; letter-spacing:.12em; }
.contact-info-card h2 { margin:0 0 12px; color:#262821; font:700 1.2rem/1.2 var(--heading-font); letter-spacing:-.035em; }
.contact-info-card > a:not(.contact-card-action) { display:block; width:fit-content; margin:5px 0; color:#55564f; font-size:.78rem; text-decoration:none; overflow-wrap:anywhere; }
.contact-info-card > a:not(.contact-card-action):hover { color:#2D3B15; }
.contact-info-card > p { margin:5px 0; color:#55564f; font-size:.78rem; line-height:1.55; }
.contact-info-card > p span,.contact-info-card > p strong { display:inline-block; }
.contact-info-card > p span { min-width:112px; }
.contact-info-card > p strong { color:#262821; font-weight:600; }
.contact-card-action { display:inline-flex; align-items:center; gap:10px; margin-top:9px; color:#2D3B15; font-size:.7rem; font-weight:700; text-decoration:none; }
.contact-card-action:hover { text-decoration:underline; text-underline-offset:3px; }
.contact-social-strip { width:min(1160px,88%); margin:0 auto; padding:18px 0 36px; display:flex; justify-content:space-between; align-items:center; gap:18px; border-top:1px solid rgba(45,59,21,.16); }
.contact-social-strip > span { color:#696258; font-size:.64rem; font-weight:700; letter-spacing:.13em; }
.contact-social-strip .contact-social-links { gap:8px; }
.contact-social-strip .contact-social-links a { padding:7px 11px; font-size:.7rem; }
@media(max-width:900px) {
    .contact-hero { width:90%; grid-template-columns:minmax(0,1fr) minmax(250px,.8fr); gap:28px; }
    .contact-hero-photo { width:min(100%,340px); }
    .contact-info-cards,.contact-social-strip { width:90%; }
    .contact-info-card { padding:20px 16px; }
    .contact-info-card > p span { min-width:0; margin-right:9px; }
}
@media(max-width:700px) {
    .contact-hero { grid-template-columns:1fr; gap:28px; padding:48px 0 30px; }
    .contact-hero-copy { max-width:560px; }
    .contact-hero-photo { width:min(76vw,340px); grid-row:2; }
    .contact-info-cards { grid-template-columns:1fr; gap:10px; padding-top:14px; }
    .contact-info-card { min-height:0; padding:21px; }
    .contact-social-strip { align-items:flex-start; flex-direction:column; }
}
@media(prefers-reduced-motion:reduce) {
    .contact-site * { scroll-behavior:auto!important; transition-duration:.01ms!important; }
}
/* Contact page contrast and header fit */
body.contact-site .contact-page { padding-top: 108px; }
body.contact-site .contact-hero {
    background: #FCFCFC !important;
    color: #262821;
}
body.contact-site .contact-hero h1 { color: #262821; }
body.contact-site .contact-hero-copy > p { color: #55564F; }
body.contact-site .contact-quick-links { border-color: rgba(45,59,21,.25); }
body.contact-site .contact-quick-links > * { color: #262821; }
body.contact-site .contact-quick-links span { color: #2D3B15; }
@media (max-width: 700px) {
    body.contact-site .contact-page { padding-top: 78px; }
}