/* Contato: o card de canais acompanha o formulário dentro do hero.
   Cada canal repete o close-up de referência: ícone com o título laranja na
   primeira linha e, abaixo, o texto branco e o destaque laranja. O card fica
   compacto, sem esticar para acompanhar a altura do formulário. */
.page-contact .contact-sidebar {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 40px;
}

.page-contact .contact-sidebar .contact-card {
    height: auto;
    min-height: 0;
    padding: 26px 28px 28px;
    align-content: start;
    gap: 26px;
    background: rgba(0, 0, 0, .72);
    border-radius: 32px;
}

.page-contact .contact-card-row {
    display: grid;
    grid-template-columns: 1fr;
    align-items: start;
    gap: 4px;
}

.page-contact .contact-channel-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 6px;
}

.page-contact .contact-channel-head img {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    object-fit: contain;
}

.page-contact .contact-card h3 {
    margin: 0;
    color: var(--dudley-orange);
    font-size: 1.18rem;
    letter-spacing: .03em;
}

.page-contact .contact-intro h1,
.page-contact .contact-intro p {
    color: var(--dudley-white);
}

.page-contact .contact-channel-label {
    margin: 0;
    color: var(--dudley-white);
    font-size: 1rem;
    line-height: 1.35;
}

.page-contact .contact-channel-value {
    display: block;
    margin: 0;
    color: var(--dudley-orange);
    font-size: 1.06rem;
    font-weight: 700;
    line-height: 1.35;
}

.page-contact .contact-channel-link {
    width: fit-content;
    text-decoration: none;
    transition: color .2s ease;
}

.page-contact .contact-channel-link:hover,
.page-contact .contact-channel-link:focus-visible {
    color: var(--dudley-white);
    text-decoration: underline;
    text-underline-offset: 4px;
}

.page-contact .contact-submit {
    color: var(--dudley-black);
    text-transform: none;
}

.page-contact .contact-details {
    padding-top: 58px;
    padding-bottom: 46px;
}

.page-contact .location-card {
    display: flex;
    max-width: 820px;
    min-height: 0;
    flex-direction: column;
    align-items: flex-start;
    padding: 0;
    border: 0;
    border-radius: 0;
}

.page-contact .location-card h3 {
    color: var(--dudley-orange);
    font-size: 1.25rem;
    letter-spacing: .03em;
}

.page-contact .location-address {
    margin: 14px 0 0 40px;
    color: var(--dudley-white);
    font-size: 1rem;
    line-height: 1.5;
}

/* O botão precisa aparecer sobre o fundo preto: contorno branco cheio,
   texto em caixa alta e área de clique generosa logo abaixo do endereço. */
.page-contact .location-map-link {
    min-height: 52px;
    margin-top: 22px;
    padding: 14px 30px;
    color: var(--dudley-white);
    background: transparent;
    border: 2px solid var(--dudley-white);
    border-radius: var(--dudley-radius-sm);
    font-family: var(--font-display);
    font-size: .82rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.page-contact .location-map-link:hover,
.page-contact .location-map-link:focus-visible {
    color: var(--dudley-black);
    background: var(--dudley-white);
}

/* Mapa incorporado: fundo escuro enquanto o iframe carrega, para o bloco não
   piscar branco no meio da página. */
.page-contact .map-section {
    background: var(--dudley-panel);
}

.page-contact .map-section iframe {
    background: var(--dudley-panel);
}

@media (max-width: 991.98px) {
    .page-contact .contact-sidebar {
        gap: 34px;
    }

    .page-contact .contact-sidebar .contact-card {
        padding: 24px 24px 26px;
        gap: 24px;
    }
}

@media (max-width: 575.98px) {
    .page-contact .contact-sidebar .contact-card {
        padding: 22px;
        gap: 22px;
        border-radius: 26px;
    }

    .page-contact .contact-channel-head img {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
    }

    .page-contact .contact-card h3 {
        font-size: 1.05rem;
    }

    .page-contact .location-address {
        margin-left: 0;
    }

    .page-contact .location-map-link {
        width: 100%;
    }
}

/* Proporções do hero de referência, com estilos restritos à página Contato. */
.page-contact .site-contact-bar { display: none; }
.page-contact .header-main {
    width: 92%; max-width: 1325px; min-height: 112px; padding-top: 18px;
}
.page-contact .brand { width: 286px; }
.page-contact .nav-toggle img { width: 28px; height: 28px; }
.page-contact .contact-hero {
    min-height: 676px; padding-bottom: 18px;
    background-position: center top;
}
.page-contact .contact-hero-grid {
    width: 92%; max-width: 1325px;
    grid-template-columns: 40.4fr 54.8fr;
    gap: 5.2%; padding-top: 134px;
    align-items: stretch;
}
.page-contact .contact-sidebar { justify-content: space-between; gap: 40px; }
.page-contact .contact-intro h1 {
    max-width: none; font-size: clamp(20px, 2.15vw, 31px);
    line-height: 1.15; letter-spacing: 0;
}
.page-contact .contact-intro h1 span { color: var(--dudley-orange); }
.page-contact .contact-intro p {
    max-width: 300px; margin-top: 16px;
    font: 400 15px/1.2 Arial, sans-serif;
}
.page-contact .contact-sidebar .contact-card {
    padding: 18px 16px; gap: 26px; border-width: 1px;
    border-radius: 28px; background: rgba(0, 0, 0, .45);
}
.page-contact .contact-channel-head {
    flex-direction: column; align-items: flex-start; gap: 6px; margin-bottom: 2px;
}
.page-contact .contact-channel-head img { width: 34px; height: 34px; flex-basis: 34px; }
.page-contact .contact-card h3 { font-size: 18px; letter-spacing: 0; }
.page-contact .contact-channel-label,
.page-contact .contact-channel-value { font: 400 13px/1.2 Arial, sans-serif; }
.page-contact .contact-form {
    padding: 32px 36px 28px; border-width: 1px; border-radius: 28px;
    background: rgba(0, 0, 0, .65); box-shadow: none;
    font-family: Arial, sans-serif;
}
.page-contact .form-field { margin-bottom: 6px; }
.page-contact .form-field label { margin-bottom: 6px; font: 400 14px/1.15 Arial, sans-serif; }
.page-contact .form-row { gap: 16px; }
.page-contact .form-control {
    min-height: 44px; padding: 8px 12px; border-radius: 7px;
    font: 400 16px/1.25 Arial, sans-serif;
}
.page-contact textarea.form-control { height: 140px; min-height: 140px; }
.page-contact .form-consent { margin: 10px 0; }
.page-contact .form-consent label { font: 400 11px/1.3 Arial, sans-serif; gap: 6px; }
.page-contact .form-consent input { width: 14px; height: 14px; flex-basis: 14px; margin: 0; }
.page-contact .contact-submit {
    min-height: 44px; border-radius: 7px; font: 400 16px/1.2 Arial, sans-serif;
}
@media (max-width: 767.98px) {
    .page-contact .header-main { min-height: 100px; }
    .page-contact .brand { width: min(250px, 65vw); }
    .page-contact .contact-hero-grid { grid-template-columns: 1fr; padding-top: 124px; gap: 28px; }
    .page-contact .contact-intro h1 { font-size: clamp(19px, 4.7vw, 28px); }
    .page-contact .contact-intro p { max-width: 360px; }
    .page-contact .contact-sidebar { gap: 26px; }
    .page-contact .contact-form { padding: 26px 20px; }
    .page-contact .contact-hero { padding-bottom: 32px; }
}
