/* ===========================================================================
   bv-contact.css — Page Contact : hero + 2 colonnes infos/form.
   =========================================================================== */

.bv-contact {
    padding-top: calc(var(--bv-header-h) + clamp(32px, 5vh, 64px));
    padding-bottom: clamp(48px, 8vh, 96px);
    padding-inline: var(--bv-page-margin);
}

.bv-contact__hero {
    max-width: 64ch;
    margin-bottom: clamp(48px, 8vh, 80px);
}
.bv-contact__breadcrumb {
    font-family: var(--bv-font-mono);
    font-size: var(--bv-fs-caption);
    color: var(--bv-text-muted);
    margin: 0 0 var(--bv-space-4) 0;
}
.bv-contact__title {
    font-family: var(--bv-font-display);
    font-size: var(--bv-fs-display);
    font-weight: 400;
    line-height: 1;
    letter-spacing: var(--bv-ls-display);
    color: var(--bv-text);
    margin: 0 0 var(--bv-space-5) 0;
}
.bv-contact__lead {
    font-size: var(--bv-fs-body-lg);
    line-height: var(--bv-lh-normal);
    color: var(--bv-text-muted);
    max-width: 56ch;
    margin: 0;
}

/* ─── Grille 2 colonnes ─────────────────────────────────────────────── */
.bv-contact__grid {
    display: grid;
    grid-template-columns: 5fr 7fr;
    gap: clamp(40px, 6vw, 80px);
    align-items: start;
}
@media (max-width: 880px) {
    .bv-contact__grid { grid-template-columns: 1fr; gap: 48px; }
}

/* ─── Colonne info ──────────────────────────────────────────────────── */
.bv-contact__info {
    display: flex;
    flex-direction: column;
    gap: clamp(28px, 5vh, 48px);
}
.bv-contact__info-block {
    display: flex;
    flex-direction: column;
    gap: var(--bv-space-2);
    border-top: 1px solid var(--bv-border);
    padding-top: var(--bv-space-4);
}
.bv-contact__info-block:first-child {
    border-top: none;
    padding-top: 0;
}
.bv-contact__info-block .bv-caption {
    margin: 0 0 var(--bv-space-2) 0;
}
.bv-contact__mail {
    font-family: var(--bv-font-display);
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    line-height: 1.1;
    letter-spacing: var(--bv-ls-tight);
    color: var(--bv-text);
    text-decoration: none;
    border-bottom: 1px solid var(--bv-border);
    padding-bottom: 4px;
    align-self: flex-start;
    transition: border-color var(--bv-d-normal) var(--bv-ease-out);
}
.bv-contact__mail:hover {
    border-bottom-color: var(--bv-text);
    opacity: 1;
}
.bv-contact__phone,
.bv-contact__line {
    font-family: var(--bv-font-body);
    font-size: var(--bv-fs-body);
    color: var(--bv-text);
    text-decoration: none;
    line-height: 1.6;
}
.bv-contact__line {
    display: inline-flex;
    align-items: center;
    gap: var(--bv-space-2);
    transition: gap var(--bv-d-normal) var(--bv-ease-out);
}
.bv-contact__line:hover { opacity: 1; gap: var(--bv-space-3); }
.bv-contact__line svg {
    width: 12px;
    height: 12px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.bv-contact__agent-name {
    font-family: var(--bv-font-body);
    font-weight: 500;
    margin: 0;
    color: var(--bv-text);
}
.bv-contact__placeholder {
    color: var(--bv-text-muted);
    font-style: italic;
    font-size: var(--bv-fs-body);
}
.bv-contact__social {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* ─── Form ──────────────────────────────────────────────────────────── */
.bv-contact__form-wrap {
    background: #fff;
    border: 1px solid var(--bv-border);
    padding: clamp(28px, 4vw, 48px);
}
.bv-contact__form {
    display: flex;
    flex-direction: column;
    gap: var(--bv-space-5);
}
.bv-contact__form > .bv-caption {
    margin: 0 0 var(--bv-space-2) 0;
}
.bv-contact__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--bv-space-4);
}
@media (max-width: 600px) {
    .bv-contact__row { grid-template-columns: 1fr; }
}
.bv-contact__field {
    display: flex;
    flex-direction: column;
    gap: var(--bv-space-2);
}
.bv-contact__field label {
    font-family: var(--bv-font-body);
    font-size: var(--bv-fs-micro);
    text-transform: uppercase;
    letter-spacing: var(--bv-ls-caps);
    font-weight: 500;
    color: var(--bv-text-muted);
}
.bv-contact__field label span {
    color: var(--bv-text);
}
.bv-contact__field input,
.bv-contact__field textarea {
    appearance: none;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--bv-border);
    padding: var(--bv-space-2) 0;
    font-family: var(--bv-font-body);
    font-size: var(--bv-fs-body);
    color: var(--bv-text);
    border-radius: 0;
    transition: border-color var(--bv-d-fast) ease;
}
.bv-contact__field input:focus,
.bv-contact__field textarea:focus {
    outline: none;
    border-bottom-color: var(--bv-text);
}
.bv-contact__field textarea {
    resize: vertical;
    min-height: 120px;
    line-height: 1.5;
}
.bv-contact__field input::placeholder,
.bv-contact__field textarea::placeholder {
    color: var(--bv-text-muted);
    opacity: 0.5;
}
.bv-contact__error {
    font-size: var(--bv-fs-micro);
    color: var(--bv-required, #c92e4a);
}
.bv-contact__error:empty { display: none; }

.bv-contact__form .bv-btn {
    align-self: flex-start;
    margin-top: var(--bv-space-3);
}
