/* ─── Contact — tokens custom non compilés en Tailwind v1 + gradients ── */

/* Hero background */
.contact-hero-bg {
    background-color: #151b2a;
    background-image:
        radial-gradient(ellipse 80% 60% at 70% 50%, rgba(249, 115, 22, .14) 0%, transparent 65%),
        radial-gradient(ellipse 50% 70% at 15% 80%, rgba(249, 115, 22, .07) 0%, transparent 60%);
}

/* Badge kicker */
.contact-badge {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    margin-bottom: 1.5rem;
    border-radius: 9999px;
    background-color: #2e3544;
    color: #f97316;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* H1 accent */
.contact-h1-accent {
    color: #f97316;
}

/* Hero subtitle */
.contact-hero-sub {
    color: #e0c0b1; /* on-surface-variant */
}

/* Form card */
.contact-form-card {
    background-color: #151b2a;
    border-radius: 0.75rem;
    padding: 2rem;
}
@media (min-width: 768px) {
    .contact-form-card { padding: 3rem; }
}

/* Trait orange sous le titre formulaire */
.contact-title-bar {
    height: 4px;
    width: 3rem;
    background-color: #f97316;
    border-radius: 9999px;
    margin-top: 0.75rem;
}

/* Champs de formulaire */
.contact-field {
    background-color: #070e1c;
    color: #dce2f6;
    border: none;
}
.contact-field::placeholder { color: #3a4155; }
.contact-field:focus {
    outline: none;
    box-shadow: 0 0 0 2px #f97316;
}
.contact-field option { background-color: #0c1321; color: #dce2f6; }

/* Bouton gradient envoi */
.contact-btn-send {
    background: linear-gradient(135deg, #ffb690 0%, #f97316 100%);
    color: #341100;
    box-shadow: 0 4px 20px rgba(249, 115, 22, .35);
    transition: transform .2s, box-shadow .2s;
}
.contact-btn-send:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(249, 115, 22, .45);
}
.contact-btn-send:active { transform: scale(.97); }

/* Sidebar card */
.contact-sidebar-card {
    background-color: #19202e;
    border-radius: 0.75rem;
    padding: 2rem;
    transition: background-color .2s;
}
.contact-sidebar-card:hover { background-color: #232a39; }

/* Icon box */
.contact-icon-box {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 0.5rem;
    background-color: #2e3544;
    color: #f97316;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Lien email + bouton doc */
.contact-link-orange {
    color: #ffb690;
    font-weight: 700;
    text-decoration: none;
    transition: text-decoration .15s;
}
.contact-link-orange:hover { text-decoration: underline; text-underline-offset: 4px; }

/* Bouton "Consulter la doc" */
.contact-doc-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #ffb690;
    font-weight: 700;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: gap .2s;
}
.contact-doc-btn:hover { gap: 0.75rem; }

/* Social buttons */
.contact-social-btn {
    width: 3rem;
    height: 3rem;
    border-radius: 0.5rem;
    background-color: #2e3544;
    color: #dce2f6;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: background-color .2s, color .2s;
}
.contact-social-btn:hover {
    background-color: #f97316;
    color: #341100;
}

/* Panneau accent bas de sidebar */
.contact-accent-panel {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #0c1321 0%, #19202e 50%, #1a1000 100%);
    border-radius: 0.75rem;
    min-height: 11rem;
    flex: 1;
    display: flex;
    align-items: flex-end;
    padding: 1.5rem;
}
.contact-accent-panel::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 70% 60% at 80% 30%, rgba(249, 115, 22, .18) 0%, transparent 70%),
        radial-gradient(ellipse 50% 50% at 20% 80%, rgba(249, 115, 22, .10) 0%, transparent 60%);
    pointer-events: none;
}
.contact-accent-label {
    position: relative;
    z-index: 1;
}
.contact-accent-label p:first-child {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: #f97316;
    margin-bottom: 0.25rem;
}
.contact-accent-label p:last-child {
    color: #ffffff;
    font-weight: 700;
    font-size: 0.875rem;
    line-height: 1.4;
}

/* Breadcrumb */
.contact-breadcrumb {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-bottom: 1.5rem;
    font-size: 0.75rem;
    color: #b9c7e0;
    flex-wrap: wrap;
}
.contact-breadcrumb a { color: #b9c7e0; text-decoration: none; transition: color .15s; }
.contact-breadcrumb a:hover { color: #f97316; }
.contact-breadcrumb .bc-current { color: #f97316; font-weight: 700; }