/* ============================================================
   Singulr — page institutionnelle « Fédération souveraine
   européenne » (/federation.html)
   Surcouche additive par-dessus /home.css + /home-ext.css.
   Réutilise tokens, animations et composants existants
   (hero, badge, stats, missions-grid/mission-card, steps,
   now-chain, beyond-note, finalcta).
   N'introduit QUE les composants propres à cette page.
   Aucun token redéfini.
   ============================================================ */

/* ---------- communs européens (cartes forges, repris de la home) ---------- */
.fed{padding:6rem 2rem}
.fed-inner{margin:0 auto;max-width:72rem}
.fed-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1rem;margin-top:3rem}
.fed-card{padding:1.5rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-2);transition:border-color .3s,transform .4s var(--ease)}
.fed-card:hover{border-color:var(--line-2);transform:translateY(-3px)}
.fed-card--hl{border-color:var(--accent);background:var(--accent-tint)}
.fed-code{display:inline-block;font-family:var(--mono);font-size:.72rem;font-weight:600;letter-spacing:.14em;color:var(--accent);border:1px solid var(--line-2);border-radius:7px;padding:.25rem .55rem;margin-bottom:.9rem}
.fed-name{font-family:var(--mono);font-weight:600;color:var(--ink);font-size:1rem}
.fed-desc{font-size:.9rem;color:var(--ink-2);line-height:1.55;margin-top:.5rem}

/* ---------- 4e étape du parcours (steps de home.css n'a que nth 2,3) ---------- */
.steps .step:nth-child(4){--d:.3s}

/* ---------- lien contextuel de maillage (accent, sans impact sur l'espacement) ---------- */
.ilink{color:var(--accent);transition:opacity .2s var(--ease)}
.ilink:hover{opacity:.78}

/* ---------- phrase de bascule mise en avant (« Pourquoi maintenant ») ---------- */
.punch{margin:3rem auto 0;max-width:40rem;text-align:center;font-size:clamp(1.4rem,3.2vw,2rem);font-weight:600;letter-spacing:-.02em;line-height:1.25;color:var(--ink);text-wrap:balance}
.punch span{color:var(--accent)}
.now-intro{margin-top:1.25rem;max-width:46rem;color:var(--ink-2);font-size:1.05rem;line-height:1.7;display:flex;flex-direction:column;gap:.85rem}
.now-intro strong{color:var(--ink);font-weight:600}

/* ============================================================
   CE QUE LA FÉDÉRATION N'EST PAS — cartes à croix sobre
   ============================================================ */
.not-sec{padding:6rem 2rem}
.not-inner{margin:0 auto;max-width:72rem}
.not-grid{margin-top:3rem;display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
@media(min-width:760px){.not-grid{grid-template-columns:repeat(4,1fr)}}
.not-card{display:flex;flex-direction:column;align-items:flex-start;gap:1.1rem;padding:1.6rem;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface)}
.not-x{display:flex;align-items:center;justify-content:center;width:2.4rem;height:2.4rem;border-radius:999px;background:rgba(239,67,81,.10);color:var(--rouge);flex:none}
.not-label{font-weight:600;color:var(--ink);font-size:1rem}
.not-note{margin:2.5rem auto 0;max-width:44rem;text-align:center;font-size:1.05rem;line-height:1.65;color:var(--ink-2)}

/* ============================================================
   NOTRE COMBAT — panneau central fort + flux vertical
   ============================================================ */
.combat{padding:6rem 2rem}
.combat-inner{position:relative;overflow:hidden;margin:0 auto;max-width:64rem;border-radius:calc(var(--radius) + 6px);border:1px solid var(--line-2);background:var(--surface);padding:clamp(2rem,5vw,4rem)}
.combat-title{position:relative;z-index:1;font-size:clamp(1.6rem,3.6vw,2.4rem);font-weight:600;letter-spacing:-.02em;line-height:1.15;color:var(--ink);max-width:24ch}
.combat-text{position:relative;z-index:1;margin-top:1.5rem;max-width:48rem;color:var(--ink-2);font-size:1.05rem;line-height:1.7;display:flex;flex-direction:column;gap:1rem}
.combat-text strong{color:var(--ink);font-weight:600}
.flow{position:relative;z-index:1;margin:2.75rem 0 0;display:flex;flex-direction:column;align-items:flex-start;gap:.6rem}
.flow-node{display:inline-flex;align-items:center;gap:.6rem;padding:.75rem 1.2rem;border-radius:12px;border:1px solid var(--line-2);background:var(--bg-2);font-weight:600;color:var(--ink-2)}
.flow-node--hl{border-color:var(--accent);color:var(--ink);background:var(--accent-tint)}
.flow-arrow{margin-left:1.25rem;color:var(--accent)}

/* ============================================================
   QUI PEUT REJOINDRE — deux colonnes (utilisateurs / partenaires)
   ============================================================ */
.who{padding:6rem 2rem}
.who-inner{margin:0 auto;max-width:64rem}
.who-grid{margin-top:3rem;display:grid;grid-template-columns:1fr;gap:1rem}
@media(min-width:760px){.who-grid{grid-template-columns:1fr 1fr}}
.who-card{display:flex;flex-direction:column;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);padding:2rem}
.who-card--partner{border-color:var(--accent);background:var(--accent-tint)}
.who-ico{display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;border-radius:13px;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line);color:var(--accent);margin-bottom:1.25rem}
.who-h{font-size:1.3rem;font-weight:600;letter-spacing:-.02em;color:var(--ink)}
.who-tags{margin:1.25rem 0;display:flex;flex-wrap:wrap;gap:.5rem}
.who-tag{font-size:.85rem;color:var(--ink-2);border:1px solid var(--line-2);border-radius:999px;padding:.35rem .8rem}
.who-text{margin-top:auto;color:var(--ink-2);font-size:.97rem;line-height:1.6}

/* ============================================================
   ROADMAP — communs numériques (livrés / à venir)
   ============================================================ */
.road{margin-top:3rem;display:grid;grid-template-columns:1fr;gap:1rem}
@media(min-width:560px){.road{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.road{grid-template-columns:repeat(4,1fr)}}
.road-mark--next svg{display:block}
.road-item{display:flex;align-items:center;gap:1rem;padding:1.5rem;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface)}
.road-item--next{border-style:dashed}
.road-mark{display:flex;align-items:center;justify-content:center;width:2.2rem;height:2.2rem;border-radius:999px;flex:none}
.road-mark--done{background:var(--accent-soft);color:var(--accent)}
.road-mark--next{background:var(--bg-2);color:var(--ink-3);box-shadow:inset 0 0 0 1px var(--line);font-family:var(--mono);font-weight:600}
.road-label{font-weight:600;color:var(--ink);font-size:1rem}
.road-state{font-family:var(--mono);font-size:.74rem;letter-spacing:.06em;color:var(--ink-3);margin-top:.15rem}
