:root {
    --ec-contact-ink: #123b4a;
    --ec-contact-body: #26383d;
    --ec-contact-muted: #587078;
    --ec-contact-teal: #5ce1e6;
    --ec-contact-orange: #ff8a3d;
    --ec-contact-orange-hover: #ed7024;
    --ec-contact-aqua: #f3fafa;
    --ec-contact-aqua-strong: #dff8f8;
    --ec-contact-white: #fff;
    --ec-contact-line: #cfe2e2;
    --ec-contact-radius: 24px;
    --ec-contact-shadow: 0 18px 48px rgba(18, 59, 74, .13);
}

body.page-template-page-template-ec-contact,
body.page-template-page-template-ec-contact-php {
    background: var(--ec-contact-white) !important;
}

body.page-template-page-template-ec-contact #page,
body.page-template-page-template-ec-contact-php #page,
body.page-template-page-template-ec-contact #content > .ast-container,
body.page-template-page-template-ec-contact-php #content > .ast-container {
    max-width: none !important;
    width: 100% !important;
}

body.page-template-page-template-ec-contact #content > .ast-container,
body.page-template-page-template-ec-contact-php #content > .ast-container {
    display: block !important;
    padding: 0 !important;
}

.ec-site-header + .ec-contact,
.ec-contact {
    color: var(--ec-contact-body);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    line-height: 1.6;
    margin: 0 !important;
    overflow: hidden;
    width: 100%;
}

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

.ec-contact h1,
.ec-contact h2,
.ec-contact h3,
.ec-contact p { margin: 0; }

.ec-contact h1,
.ec-contact h2,
.ec-contact h3 {
    color: var(--ec-contact-ink);
    font-family: Georgia, "Times New Roman", serif;
    line-height: 1.05;
}

.ec-contact h1 { font-size: clamp(2.45rem, 4vw, 4.15rem); letter-spacing: -.04em; }
.ec-contact h2 { font-size: clamp(2rem, 3.5vw, 3.2rem); letter-spacing: -.03em; }
.ec-contact h3 { font-size: clamp(1.35rem, 2vw, 1.8rem); }

.ec-contact-wrap {
    margin-inline: auto;
    max-width: 1240px;
    padding-inline: 24px;
}

.ec-contact-kicker {
    color: var(--ec-contact-ink);
    font-size: .74rem;
    font-weight: 900;
    letter-spacing: .14em;
    margin-bottom: 12px !important;
    text-transform: uppercase;
}

.ec-contact-hero {
    background: var(--ec-contact-ink);
    color: var(--ec-contact-white);
    padding: 34px 0 38px;
}

.ec-contact-hero__grid {
    align-items: center;
    display: grid;
    gap: 46px;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
}

.ec-contact-hero h1 { color: var(--ec-contact-white); }
.ec-contact-hero .ec-contact-kicker { color: var(--ec-contact-teal); }

.ec-contact-breadcrumb {
    align-items: center;
    color: var(--ec-contact-aqua-strong);
    display: flex;
    font-size: .78rem;
    gap: 8px;
    margin-bottom: 18px;
}

.ec-contact-breadcrumb a { color: var(--ec-contact-aqua-strong); text-decoration: none; }
.ec-contact-breadcrumb a:hover,
.ec-contact-breadcrumb a:focus { color: var(--ec-contact-orange); }

.ec-contact-hero__copy {
    color: var(--ec-contact-aqua-strong);
    font-size: 1.06rem;
    margin-top: 18px !important;
    max-width: 650px;
}

.ec-contact-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
}

.ec-contact-button {
    align-items: center;
    border: 2px solid transparent;
    border-radius: 999px;
    display: inline-flex;
    font-size: .88rem;
    font-weight: 900;
    justify-content: center;
    min-height: 50px;
    padding: 11px 23px;
    text-decoration: none;
    transition: background .2s, color .2s, transform .2s;
}

.ec-contact-button:hover,
.ec-contact-button:focus { transform: translateY(-2px); }
.ec-contact-button--primary { background: var(--ec-contact-orange); color: var(--ec-contact-ink); }
.ec-contact-button--primary:hover,
.ec-contact-button--primary:focus { background: var(--ec-contact-orange-hover); color: var(--ec-contact-white); }
.ec-contact-button--ghost { border-color: var(--ec-contact-white); color: var(--ec-contact-white); }
.ec-contact-button--ghost:hover,
.ec-contact-button--ghost:focus { background: var(--ec-contact-white); color: var(--ec-contact-ink); }

.ec-contact-trust {
    border-top: 1px solid rgba(255, 255, 255, .22);
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    list-style: none;
    margin: 24px 0 0;
    padding: 18px 0 0;
}

.ec-contact-trust li { display: flex; flex-direction: column; }
.ec-contact-trust strong { color: var(--ec-contact-white); font-size: .9rem; }
.ec-contact-trust span { color: var(--ec-contact-aqua-strong); font-size: .72rem; }

.ec-contact-hero__visual {
    border-radius: var(--ec-contact-radius);
    box-shadow: var(--ec-contact-shadow);
    height: 470px;
    overflow: visible;
    position: relative;
}

.ec-contact-hero__visual picture {
    border-radius: var(--ec-contact-radius);
    display: block;
    height: 100%;
    overflow: hidden;
}

.ec-contact-hero__visual img { display: block; height: 100%; object-fit: cover; width: 100%; }

.ec-contact-hero__note {
    background: var(--ec-contact-white);
    border-top: 5px solid var(--ec-contact-teal);
    border-radius: 18px;
    bottom: 22px;
    box-shadow: var(--ec-contact-shadow);
    color: var(--ec-contact-ink);
    display: flex;
    flex-direction: column;
    left: -28px;
    padding: 15px 20px;
    position: absolute;
}

.ec-contact-hero__note strong { font-family: Georgia, "Times New Roman", serif; }
.ec-contact-hero__note span { color: var(--ec-contact-muted); font-size: .72rem; margin-top: 2px; }

.ec-contact-section { padding: 72px 0; }
.ec-contact-section--aqua { background: var(--ec-contact-aqua); }
.ec-contact-section--white { background: var(--ec-contact-white); }

.ec-contact-heading {
    align-items: end;
    display: flex;
    gap: 60px;
    justify-content: space-between;
}

.ec-contact-heading > div { max-width: 760px; }
.ec-contact-heading > p { color: var(--ec-contact-muted); max-width: 390px; }

.ec-contact-paths {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 36px;
}

.ec-contact-path {
    background: var(--ec-contact-white);
    border: 1px solid var(--ec-contact-line);
    border-radius: var(--ec-contact-radius);
    display: flex;
    flex-direction: column;
    min-height: 360px;
    padding: 28px;
}

.ec-contact-path--featured { border-top: 7px solid var(--ec-contact-orange); padding-top: 22px; }
.ec-contact-icon {
    align-items: center;
    background: var(--ec-contact-aqua-strong);
    border-radius: 50%;
    display: flex;
    height: 62px;
    justify-content: center;
    margin-left: auto;
    width: 62px;
}

.ec-contact-icon svg { fill: none; height: 31px; stroke: var(--ec-contact-ink); stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; width: 31px; }
.ec-contact-path__number { color: var(--ec-contact-ink); font-size: .7rem; font-weight: 900; margin-top: -42px !important; }
.ec-contact-path h3 { margin-top: 38px; }
.ec-contact-path > p:not(.ec-contact-path__number) { color: var(--ec-contact-muted); font-size: .92rem; margin-top: 12px !important; }
.ec-contact-path > a { color: var(--ec-contact-ink); font-size: .84rem; font-weight: 900; margin-top: auto; padding-top: 22px; text-decoration: none; }
.ec-contact-path > a:hover,
.ec-contact-path > a:focus { color: var(--ec-contact-orange-hover); }

.ec-contact-estimate { background: var(--ec-contact-ink); color: var(--ec-contact-white); padding: 72px 0; }
.ec-contact-estimate__grid { align-items: start; display: grid; gap: 70px; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); }
.ec-contact-estimate h2 { color: var(--ec-contact-white); }
.ec-contact-estimate .ec-contact-kicker { color: var(--ec-contact-teal); }
.ec-contact-estimate__content > p:not(.ec-contact-kicker) { color: var(--ec-contact-aqua-strong); font-size: 1.02rem; margin-top: 18px !important; }

.ec-contact-checklist { list-style: none; margin: 28px 0 0; padding: 0; }
.ec-contact-checklist li { align-items: start; border-bottom: 1px solid rgba(255,255,255,.16); color: var(--ec-contact-white); display: flex; gap: 11px; padding: 12px 0; }
.ec-contact-checklist span { align-items: center; background: var(--ec-contact-teal); border-radius: 50%; color: var(--ec-contact-ink); display: inline-flex; flex: 0 0 auto; font-size: .72rem; font-weight: 900; height: 22px; justify-content: center; margin-top: 1px; width: 22px; }

.ec-contact-direct { display: grid; gap: 10px; margin-top: 28px; }
.ec-contact-direct p { display: flex; flex-direction: column; }
.ec-contact-direct span { color: var(--ec-contact-aqua-strong); font-size: .72rem; }
.ec-contact-direct a { color: var(--ec-contact-white); font-weight: 800; overflow-wrap: anywhere; text-decoration: none; }
.ec-contact-direct a:hover,
.ec-contact-direct a:focus { color: var(--ec-contact-orange); }

.ec-contact-form-shell {
    background: var(--ec-contact-white);
    border-radius: var(--ec-contact-radius);
    box-shadow: var(--ec-contact-shadow);
    color: var(--ec-contact-body);
    padding: 30px;
}

.ec-contact-form-shell > p { color: var(--ec-contact-muted); font-size: .88rem; margin-top: 7px !important; }
.ec-contact-form-shell > small { color: var(--ec-contact-muted); display: block; font-size: .68rem; margin-top: 10px; }
.ec-contact-form-shell .wpcf7 { margin-top: 20px; }
.ec-contact-form-shell .wpcf7-form { display: grid; gap: 13px 15px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ec-contact-form-shell .wpcf7-form > p { margin: 0; }
.ec-contact-form-shell .wpcf7-form > p:has(textarea),
.ec-contact-form-shell .wpcf7-form > p:has(input[type="submit"]),
.ec-contact-form-shell .wpcf7-response-output { grid-column: 1 / -1; }
.ec-contact-form-shell label { color: var(--ec-contact-ink); display: block; font-size: .75rem; font-weight: 800; }
.ec-contact-form-shell input:not([type="submit"]),
.ec-contact-form-shell select,
.ec-contact-form-shell textarea {
    background: var(--ec-contact-aqua);
    border: 1px solid var(--ec-contact-line);
    border-radius: 10px;
    color: var(--ec-contact-body);
    font: inherit;
    margin-top: 5px;
    padding: 10px 12px;
    width: 100%;
}

.ec-contact-form-shell input:not([type="submit"]),
.ec-contact-form-shell select { height: 44px; }
.ec-contact-form-shell textarea { height: 92px; min-height: 92px; resize: vertical; }
.ec-contact-form-shell input:focus,
.ec-contact-form-shell select:focus,
.ec-contact-form-shell textarea:focus { border-color: var(--ec-contact-teal); box-shadow: 0 0 0 3px rgba(92,225,230,.25); outline: 0; }
.ec-contact-form-shell input[type="submit"] {
    background: var(--ec-contact-orange);
    border: 0;
    border-radius: 999px;
    color: var(--ec-contact-ink);
    cursor: pointer;
    font-size: .86rem;
    font-weight: 900;
    min-height: 48px;
    padding: 11px 22px;
    width: 100%;
}
.ec-contact-form-shell input[type="submit"]:hover,
.ec-contact-form-shell input[type="submit"]:focus { background: var(--ec-contact-orange-hover); color: var(--ec-contact-white); }
.ec-contact-form-shell .wpcf7-spinner { display: none; }
.ec-contact-form-shell .wpcf7-not-valid-tip { font-size: .72rem; margin-top: 3px; }
.ec-contact-form-shell .wpcf7-response-output { font-size: .78rem; margin: 0 !important; padding: 8px 10px !important; }

.ec-contact-process { align-items: start; display: grid; gap: 80px; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
.ec-contact-process > div > p:not(.ec-contact-kicker),
.ec-contact-faq-grid > div > p:not(.ec-contact-kicker) { color: var(--ec-contact-muted); font-size: 1.02rem; margin-top: 18px !important; }
.ec-contact-steps { list-style: none; margin: 0; padding: 0; }
.ec-contact-steps li { border-bottom: 1px solid var(--ec-contact-line); display: grid; gap: 18px; grid-template-columns: 48px minmax(0, 1fr); padding: 18px 0; }
.ec-contact-steps li:first-child { padding-top: 0; }
.ec-contact-steps li > span { align-items: center; background: var(--ec-contact-teal); border-radius: 50%; color: var(--ec-contact-ink); display: flex; font-size: .72rem; font-weight: 900; height: 44px; justify-content: center; width: 44px; }
.ec-contact-steps strong { color: var(--ec-contact-ink); }
.ec-contact-steps p { color: var(--ec-contact-muted); font-size: .9rem; margin-top: 3px !important; }

.ec-contact-area-grid { align-items: stretch; display: grid; gap: 38px; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); }
.ec-contact-area-copy { padding: 16px 0; }
.ec-contact-area-copy > p:not(.ec-contact-kicker) { color: var(--ec-contact-muted); margin-top: 18px !important; }
.ec-contact-actions--dark .ec-contact-button--primary { color: var(--ec-contact-ink); }
.ec-contact-text-link { color: var(--ec-contact-ink); font-size: .84rem; font-weight: 900; padding: 10px 5px; text-decoration: none; }
.ec-contact-text-link:hover,
.ec-contact-text-link:focus { color: var(--ec-contact-orange-hover); }
.ec-contact-area-copy address { border-top: 1px solid var(--ec-contact-line); color: var(--ec-contact-muted); font-size: .86rem; font-style: normal; margin-top: 26px; padding-top: 20px; }
.ec-contact-area-copy address strong { color: var(--ec-contact-ink); }
.ec-contact-map { border-radius: var(--ec-contact-radius); box-shadow: var(--ec-contact-shadow); min-height: 420px; overflow: hidden; }
.ec-contact-map iframe { border: 0; display: block; height: 100%; min-height: 420px; width: 100%; }

.ec-contact-faq-grid { align-items: start; display: grid; gap: 80px; grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); }
.ec-contact-faqs details { border-bottom: 1px solid var(--ec-contact-line); padding: 18px 0; }
.ec-contact-faqs details:first-child { padding-top: 0; }
.ec-contact-faqs summary { color: var(--ec-contact-ink); cursor: pointer; font-family: Georgia, "Times New Roman", serif; font-size: 1.25rem; font-weight: 700; list-style: none; padding-right: 42px; position: relative; }
.ec-contact-faqs summary::-webkit-details-marker { display: none; }
.ec-contact-faqs summary::after { align-items: center; background: var(--ec-contact-aqua-strong); border-radius: 50%; content: "+"; display: flex; font-family: Inter, sans-serif; font-size: 1.1rem; height: 30px; justify-content: center; position: absolute; right: 0; top: -2px; width: 30px; }
.ec-contact-faqs details[open] summary::after { content: "–"; }
.ec-contact-faqs details p { color: var(--ec-contact-muted); font-size: .92rem; margin-top: 12px !important; padding-right: 42px; }

.ec-contact-final { background: var(--ec-contact-ink); color: var(--ec-contact-white); padding: 58px 0; }
.ec-contact-final__inner { align-items: center; display: grid; gap: 60px; grid-template-columns: minmax(0, 1fr) auto; }
.ec-contact-final h2,
.ec-contact-final p { color: var(--ec-contact-white); }
.ec-contact-final .ec-contact-kicker { color: var(--ec-contact-teal); }
.ec-contact-final p:not(.ec-contact-kicker) { color: var(--ec-contact-aqua-strong); margin-top: 12px !important; }
.ec-contact-final .ec-contact-actions { margin-top: 0; }

@media (max-width: 960px) {
    .ec-contact-hero__grid,
    .ec-contact-estimate__grid,
    .ec-contact-process,
    .ec-contact-area-grid,
    .ec-contact-faq-grid { gap: 42px; grid-template-columns: 1fr; }
    .ec-contact-hero__visual { height: 430px; }
    .ec-contact-heading { align-items: start; flex-direction: column; gap: 14px; }
    .ec-contact-paths { grid-template-columns: 1fr; }
    .ec-contact-path { min-height: 280px; }
    .ec-contact-final__inner { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .ec-contact-wrap { padding-inline: 18px; }
    .ec-contact h1 { font-size: clamp(2.2rem, 10vw, 3rem); }
    .ec-contact h2 { font-size: clamp(1.85rem, 8vw, 2.55rem); }
    .ec-contact-hero { padding: 24px 0 30px; }
    .ec-contact-hero__visual { height: 340px; }
    .ec-contact-hero__note { bottom: 14px; left: 14px; }
    .ec-contact-trust { gap: 10px; }
    .ec-contact-trust strong { font-size: .78rem; }
    .ec-contact-trust span { font-size: .65rem; }
    .ec-contact-section,
    .ec-contact-estimate { padding: 54px 0; }
    .ec-contact-actions { align-items: stretch; flex-direction: column; }
    .ec-contact-path { padding: 24px; }
    .ec-contact-form-shell { padding: 24px 18px; }
    .ec-contact-form-shell .wpcf7-form { grid-template-columns: 1fr; }
    .ec-contact-map,
    .ec-contact-map iframe { min-height: 340px; }
    .ec-contact-final .ec-contact-actions { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .ec-contact-button { transition: none; }
}

/* Keep the Contact page personal while avoiding another repetition of the van image. */
.ec-contact-hero__visual img{object-position:center 42%}