/* ============================================================================
   contact.css — enquiry form and the confirmation page.
   ========================================================================= */

.ct__grid {
    display: grid;
    gap: clamp(2rem, 5vw, 4rem);
    align-items: start;
}

@media (min-width: 900px) {
    .ct__grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, .85fr); }
}

.ct__heading {
    font-size: var(--step-2);
    margin-bottom: var(--sp-6);
}

.ct__form .notice { margin-bottom: var(--sp-5); }

/* Two fields side by side once there is room, stacked when there is not. */
.ct__row {
    display: grid;
    gap: 0 var(--sp-5);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
}

.ct__privacy {
    margin-top: var(--sp-5);
    max-width: 46ch;
    font-size: var(--step--2);
    color: var(--ink-muted);
}

.ct__aside { display: grid; gap: var(--sp-4); }

.ct__card .eyebrow { margin-bottom: var(--sp-3); }

.ct__card-title {
    font-size: var(--step-1);
    margin-bottom: var(--sp-3);
}

.ct__card .link { margin-top: var(--sp-4); }
.ct__card .cluster { margin-top: var(--sp-4); }


/* ── Confirmation page ──────────────────────────────────────────────────── */

.ct-sent__inner { text-align: center; }

.ct-sent__tick {
    display: grid;
    place-items: center;
    width: 5rem;
    height: 5rem;
    margin: 0 auto var(--sp-6);
    border-radius: 50%;
    background: var(--ok-wash);
    color: var(--ok);
}

.ct-sent__tick svg { width: 2.6rem; height: 2.6rem; }

.ct-sent__inner .lead { margin: var(--sp-4) auto 0; }

.ct-sent__actions { justify-content: center; margin-top: var(--sp-7); }