/* Inscription freelance (etapes) */
.fre2 .fla-card { max-width: 520px; }

/* Barre d'etapes */
.fre2-steps { display: flex; align-items: center; gap: .5rem; margin: 0 0 1.2rem; font-size: .8rem; font-weight: 600; color: #6B7570; }
.fre2-step { display: flex; align-items: center; gap: .4rem; white-space: nowrap; }
.fre2-step span { width: 1.7rem; height: 1.7rem; flex-shrink: 0; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: #ECE6DA; color: #6B7570; font-size: .78rem; }
.fre2-step.is-current { color: var(--fy-ink, #1C2B24); }
.fre2-step.is-current span { background: var(--fy-ink, #1C2B24); color: #fff; }
.fre2-step.is-done { color: var(--fy-emerald, #0F766E); }
.fre2-step.is-done span { background: var(--fy-emerald, #0F766E); color: #fff; }
.fre2-line { flex: 1; min-width: 12px; height: 2px; background: #E2DCCF; }
.fre2-line.is-done { background: var(--fy-emerald, #0F766E); }
.fre2-ref { margin: -.6rem 0 1rem; font-size: .78rem; color: #6B7570; }

/* Formulaire */
.fre2-invite { display: flex; align-items: center; gap: .6rem; padding: .75rem .9rem; margin-bottom: 1rem; border-radius: 12px; background: #FFF4E0; border: 1px solid #F3D48A; color: #5C4710; font-size: .9rem; }
.fre2-invite i { font-size: 1.2rem; color: #B45309; }
.fre2-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.05rem; }
.fre2-help { display: block; margin-top: .35rem; font-size: .78rem; color: #6B7570; }
.fre2-prefix { padding-right: .55rem; border-right: 1.5px solid #DDD6C8; font-weight: 700; color: var(--fy-ink, #1C2B24); white-space: nowrap; }
.fre2-ref-toggle summary { display: flex; align-items: center; gap: .4rem; min-height: 44px; list-style: none; cursor: pointer; font-weight: 600; font-size: .9rem; color: var(--fy-emerald, #0F766E); }
.fre2-ref-toggle summary::-webkit-details-marker { display: none; }
.fre2-ref-toggle .fla-input { margin-top: .3rem; }
.fre2-ref-toggle input { text-transform: uppercase; letter-spacing: .05em; }
.fre2-back { display: inline-flex; align-items: center; gap: .4rem; margin-top: 1rem; font-size: .9rem; font-weight: 600; color: #4A5550; text-decoration: none; }
.fre2-back:hover { color: var(--fy-ink, #1C2B24); }

/* Avantages et etapes suivantes */
.fre2-aside h2 { margin-bottom: 1.3rem; }
.fre2-benefits, .fre2-next { list-style: none; padding: 0; margin: 0; display: grid; gap: .85rem; }
.fre2-benefits li, .fre2-next li { display: flex; align-items: flex-start; gap: .7rem; }
.fre2-benefits i { width: 2.1rem; height: 2.1rem; flex-shrink: 0; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, .16); }
.fre2-benefits strong, .fre2-next strong { display: block; font-size: .95rem; }
.fre2-benefits span, .fre2-next small { display: block; font-size: .85rem; opacity: .85; }
.fre2-next li > span { width: 1.9rem; height: 1.9rem; flex-shrink: 0; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; border: 1.5px solid rgba(255, 255, 255, .5); font-weight: 700; font-size: .85rem; }
.fre2-next li.is-now > span { background: #fff; color: var(--fy-ink, #1C2B24); border-color: #fff; }
.fre2-mobile-list { display: none; }

/* Mobile et tablette */
@media (max-width: 991px) {
    .fre2 .fla-main { flex-direction: column; align-items: center; }
    .fre2-aside-list { display: none; }
    .fre2-aside h2 { margin-bottom: 0; }
    .fre2-mobile-list { display: block; width: 100%; max-width: 520px; margin-top: 2rem; padding: 1.2rem; border-radius: 14px; background: #fff; border: 1px solid #E2DCCF; }
    .fre2-mobile-title { font-family: 'Fraunces', serif; font-size: 1.25rem; margin: 0 0 1rem; }
    .fre2-mobile-list .fre2-benefits i { background: var(--fy-emerald-light, #E6F4F1); color: var(--fy-emerald, #0F766E); }
    .fre2-mobile-list .fre2-benefits span, .fre2-mobile-list .fre2-next small { color: #5B6661; opacity: 1; }
    .fre2-mobile-list .fre2-next li > span { border-color: #DDD6C8; color: #4A5550; }
    .fre2-mobile-list .fre2-next li.is-now > span { background: var(--fy-ink, #1C2B24); color: #fff; border-color: var(--fy-ink, #1C2B24); }
}
@media (max-width: 575px) {
    .fre2-row2 { grid-template-columns: 1fr; }
    .fre2-steps { gap: .35rem; font-size: .72rem; }
    .fre2-line { min-width: 8px; }
}
@media (max-width: 380px) {
    .fre2-step { font-size: 0; gap: 0; }
    .fre2-step span { font-size: .78rem; }
}
