/* ————————————————————————————————————————————————————————————
   Page 18 — « Rejoindre le réseau » : formulaire de candidature
   Couleurs alignées sur celles du site (style.css) :
   --orange #E65B33 / --acajou #3A120F / --noir #111
   --peche #FCE9DC / --grisclair #ececec / --grisfonce #555
   ———————————————————————————————————————————————————————————— */

/* Carte globale du formulaire */
#rejoindre .rejoindre-card {
    max-width: 980px;
    margin: 0 auto;
    background: var(--blanc, #fff);
    border: 1px solid rgba(58, 18, 15, 0.12);
    border-radius: 1.5rem;
    box-shadow: 0 20px 60px rgba(58, 18, 15, 0.08);
    padding: 32px;
}
@media (min-width: 768px) {
    #rejoindre .rejoindre-card { padding: 48px; }
}

#rejoindre .rejoindre-intro {
    max-width: 680px;
    margin: 0 auto 40px;
    text-align: center;
    font-size: 1em;
    line-height: 1.6;
    color: var(--grisfonce, #555);
}

/* Groupes de champs */
.rejoindre-groupe { padding: 28px 0; border-top: 1px solid rgba(58, 18, 15, 0.1); }
.rejoindre-groupe:first-of-type { border-top: 0; padding-top: 0; }

.rejoindre-groupe-titre {
    display: flex;
    align-items: center;
    gap: .7rem;
    margin: 0 0 6px;
    font-family: 'Kufam', sans-serif;
    font-size: 1.1rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--acajou, #3A120F);
}
.rejoindre-groupe-titre::before {
    content: '';
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--orange, #E65B33);
}
.rejoindre-groupe-aide {
    margin: 0 0 22px;
    font-size: .9rem;
    line-height: 1.55;
    color: var(--grisfonce, #555);
}

/* Champs de saisie */
.rejoindre-champs { display: grid; grid-template-columns: 1fr; gap: 18px; }
@media (min-width: 720px) {
    .rejoindre-champs { grid-template-columns: 1fr 1fr; }
}

.rejoindre-champ { display: flex; flex-direction: column; gap: .5rem; }
.rejoindre-champ.pleine-largeur { grid-column: 1 / -1; }

.rejoindre-champ label,
.rejoindre-picker-titre {
    font-size: .92rem;
    font-weight: 600;
    color: var(--acajou, #3A120F);
}
.rejoindre-champ label { margin: 0; }
.requis { color: var(--orange, #E65B33); }

.rejoindre-champ input[type="text"],
.rejoindre-champ input[type="email"],
.rejoindre-champ input[type="tel"],
.rejoindre-champ textarea {
    width: 100%;
    min-height: 52px;
    padding: 12px 14px;
    border: 1px solid rgba(58, 18, 15, 0.25);
    border-radius: .65rem;
    background: #fff;
    font-family: 'Source Serif', serif;
    font-size: 1rem;
    line-height: 1.3;
    color: var(--noir, #111);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.rejoindre-champ textarea { min-height: 140px; resize: vertical; }
.rejoindre-champ input:hover,
.rejoindre-champ textarea:hover { border-color: rgba(230, 91, 51, 0.55); }
.rejoindre-champ input:focus,
.rejoindre-champ textarea:focus {
    outline: none;
    border-color: var(--orange, #E65B33);
    box-shadow: 0 0 0 .25rem rgba(230, 91, 51, 0.18);
}
.rejoindre-champ .form-text {
    margin: -4px 0 0;
    font-size: .82rem;
    line-height: 1.45;
    color: var(--grisfonce, #555);
}

/* Sélecteur en cartes (domaine / sous-domaine) */
.rejoindre-picker { margin: 0; padding: 0; border: 0; min-width: 0; }
.rejoindre-picker + .rejoindre-picker { margin-top: 28px; }

.rejoindre-picker-titre { padding: 0; margin: 0 0 4px; }
.rejoindre-picker-aide {
    margin: 0 0 14px;
    font-size: .85rem;
    line-height: 1.5;
    color: var(--grisfonce, #555);
}

.rejoindre-cartes { display: grid; grid-template-columns: 1fr; gap: 10px; }
@media (min-width: 640px)  { .rejoindre-cartes { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .rejoindre-cartes { grid-template-columns: 1fr 1fr 1fr; } }

.rejoindre-carte {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: 14px 16px;
    border: 1px solid rgba(58, 18, 15, 0.18);
    border-radius: .8rem;
    background: #fff;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.rejoindre-carte:hover { border-color: rgba(230, 91, 51, 0.55); }
.rejoindre-carte:focus-within { outline: 2px solid var(--orange, #E65B33); outline-offset: 2px; }
.rejoindre-carte:has(input:checked) {
    border-color: var(--orange, #E65B33);
    background: #fff8f3;
    box-shadow: 0 0 0 3px rgba(230, 91, 51, 0.12);
}
.rejoindre-carte input[type="radio"] {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin: .15rem 0 0;
    accent-color: var(--orange, #E65B33);
}
.rejoindre-carte-contenu { display: block; }
.rejoindre-carte-titre { display: block; font-size: .95rem; font-weight: 600; line-height: 1.35; color: var(--acajou, #3A120F); }
.rejoindre-carte-texte {
    display: block;
    margin-top: .15rem;
    font-size: .82rem;
    line-height: 1.45;
    color: var(--grisfonce, #555);
}

.rejoindre-sous-groupe { margin-top: 16px; }
.rejoindre-sous-groupe[hidden] { display: none; }
.rejoindre-sous-titre {
    margin: 0 0 10px;
    font-family: 'Kufam', sans-serif;
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--orange, #E65B33);
}

.rejoindre-vide { margin: 0; font-size: .9rem; line-height: 1.5; color: var(--grisfonce, #555); }

/* Captcha + consentement */
.rejoindre-captcha .titre {
    display: block;
    margin-bottom: .6rem;
    font-size: .92rem;
    font-weight: 600;
    color: var(--acajou, #3A120F);
}
.rejoindre-captcha .h-captcha { min-height: 78px; }

.rejoindre-consent {
    display: flex;
    align-items: flex-start;
    gap: .7rem;
    margin-top: 22px;
    padding: 14px 16px;
    border-radius: .8rem;
    background: var(--grisclair, #ececec);
}
.rejoindre-consent input[type="checkbox"] {
    flex-shrink: 0;
    width: 1.2rem;
    height: 1.2rem;
    margin: .1rem 0 0;
    accent-color: var(--orange, #E65B33);
}
.rejoindre-consent label {
    margin: 0;
    font-size: .85rem;
    line-height: 1.5;
    color: var(--noir, #111);
}

.rejoindre-actions { margin-top: 28px; }

/* Message de succès */
.rejoindre-succes {
    max-width: 680px;
    margin: 0 auto;
    padding: 40px 32px;
    text-align: center;
    background: var(--peche, #FCE9DC);
    border: 1px solid rgba(230, 91, 51, 0.35);
    border-radius: 1.25rem;
}
.rejoindre-succes p { margin: 0; line-height: 1.6; }
.rejoindre-succes strong {
    display: block;
    margin-bottom: .5rem;
    font-family: 'Kufam', sans-serif;
    font-size: 1.3rem;
    color: var(--acajou, #3A120F);
}

/* Erreurs */
.rejoindre-erreurs {
    max-width: 980px;
    margin: 0 auto 24px;
    padding: 18px 22px;
    background: #fff5f5;
    border: 1px solid rgba(194, 15, 15, 0.35);
    border-radius: 1rem;
    color: var(--error, #c20f0f);
}
.rejoindre-erreurs p { margin: 0 0 8px; }
.rejoindre-erreurs ul { margin: 0; padding-left: 18px; }
.rejoindre-erreurs li { font-size: .93rem; line-height: 1.5; }