/* FoundYou : système visuel commun des pages publiques et institutionnelles.
   Fond bleu nuit, texte blanc cassé, cartes distinctes du fond par une bordure colorée discrète et un halo très
   diffus. Jamais de néon. Les accents ont un sens : information (bleu / cyan), confiance (vert-bleu),
   institutionnel (bleu-vert), tarification (ambre doux), danger (rouge, seulement si utile). */
:root{
  --fy-bg:#06101f; --fy-bg-deep:#0b1a33; --fy-surface:rgba(255,255,255,0.055); --fy-surface-2:rgba(255,255,255,0.08);
  --fy-text:#eef2f7; --fy-soft:#c9d5e4; --fy-muted:#93a5bb;
  --fy-info:#7cc4ff; --fy-cyan:#5fd4e6; --fy-trust:#4cc9a0; --fy-inst:#6fb3d9; --fy-price:#f2b45a; --fy-danger:#f08080;
  --fy-line-info:rgba(124,196,255,0.42); --fy-line-trust:rgba(76,201,160,0.46); --fy-line-inst:rgba(111,179,217,0.44);
  --fy-line-price:rgba(242,180,90,0.46); --fy-line-danger:rgba(240,128,128,0.45); --fy-line:rgba(160,195,235,0.22);
  --fy-on-green:#04140e;
  /* Accents par offre et par famille (texte ≥ 5,9:1 sur le fond des cartes) */
  --fy-mint:#62d6a8; --fy-amber:#f2b45a; --fy-guardian:#6fc3f4; --fy-violet:#b9a3f7; --fy-rose:#f2a5c0; --fy-orange:#f5a46b;
  --fy-radius:16px; --fy-radius-sm:12px; --fy-max:1080px; --fy-gutter:24px; --fy-section:64px;
  --fy-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
*{ box-sizing:border-box; }
body.fy{ margin:0; min-height:100vh; font-family:var(--fy-font); font-size:16px; line-height:1.65; color:var(--fy-text);
  background:linear-gradient(180deg,#050c19 0%,var(--fy-bg) 40%,var(--fy-bg-deep) 100%); }
:where(.fy) a{ color:var(--fy-info); }
.fy :focus-visible{ outline:2px solid var(--fy-cyan); outline-offset:2px; border-radius:6px; }
.fy-wrap{ max-width:var(--fy-max); margin:0 auto; padding:0 var(--fy-gutter); }
.fy h1{ font-size:clamp(32px,4.6vw,52px); line-height:1.12; margin:0 0 16px; }
.fy h2{ font-size:clamp(24px,3vw,32px); line-height:1.25; margin:0 0 12px; }
.fy h3{ font-size:18px; line-height:1.35; margin:0 0 8px; }
.fy-eyebrow{ display:inline-block; font-size:13px; font-weight:700; letter-spacing:1.3px; text-transform:uppercase; color:var(--fy-cyan); margin-bottom:12px; }
.fy-lead{ font-size:18px; color:var(--fy-soft); max-width:720px; }
.fy-note{ font-size:13px; color:var(--fy-muted); }

/* Cartes : contour coloré subtil, halo très diffus, survol discret */
.fy-card{ background:var(--fy-surface); border:1px solid var(--fy-line); border-radius:var(--fy-radius); padding:24px;
  box-shadow:0 1px 0 rgba(255,255,255,0.04) inset, 0 12px 32px -18px rgba(0,0,0,0.6); transition:border-color .2s, transform .2s, box-shadow .2s; }
.fy-card.info{ border-color:var(--fy-line-info); box-shadow:0 1px 0 rgba(255,255,255,0.04) inset, 0 14px 36px -22px rgba(124,196,255,0.35); }
.fy-card.trust{ border-color:var(--fy-line-trust); box-shadow:0 1px 0 rgba(255,255,255,0.04) inset, 0 14px 36px -22px rgba(76,201,160,0.32); }
.fy-card.inst{ border-color:var(--fy-line-inst); box-shadow:0 1px 0 rgba(255,255,255,0.04) inset, 0 14px 36px -22px rgba(111,179,217,0.32); }
.fy-card.price{ border-color:var(--fy-line-price); box-shadow:0 1px 0 rgba(255,255,255,0.04) inset, 0 14px 36px -22px rgba(242,180,90,0.30); }
.fy-card.danger{ border-color:var(--fy-line-danger); }

/* Variantes d'accent : la couleur ne touche que la bordure, un liseré haut, un halo très léger et les petits
   éléments (étiquette, coches, séparateur) via --accent. Le fond reste sombre et commun à toutes les cartes. */
.fy-card.cyan    { --accent:var(--fy-cyan);     --accent-line:rgba(95,212,230,0.42);  --accent-glow:rgba(95,212,230,0.30); }
.fy-card.violet  { --accent:var(--fy-violet);   --accent-line:rgba(185,163,247,0.42); --accent-glow:rgba(185,163,247,0.28); }
.fy-card.orange  { --accent:var(--fy-orange);   --accent-line:rgba(245,164,107,0.44); --accent-glow:rgba(245,164,107,0.26); }
.fy-card.free       { --accent:var(--fy-mint);     --accent-line:rgba(98,214,168,0.50);  --accent-glow:rgba(98,214,168,0.30); }
.fy-card.protection { --accent:var(--fy-amber);    --accent-line:rgba(242,180,90,0.50);  --accent-glow:rgba(242,180,90,0.28); }
.fy-card.guardian   { --accent:var(--fy-guardian); --accent-line:rgba(111,195,244,0.50); --accent-glow:rgba(111,195,244,0.30); }
.fy-card.guardian-plus { --accent:var(--fy-violet); --accent-line:rgba(185,163,247,0.52); --accent-glow:rgba(185,163,247,0.30); }
.fy-card.resident   { --accent:var(--fy-rose);     --accent-line:rgba(242,165,192,0.52); --accent-glow:rgba(242,165,192,0.28); }
.fy-card:is(.cyan, .violet, .orange, .free, .protection, .guardian, .guardian-plus, .resident){
  border-color:var(--accent-line);
  box-shadow:inset 0 3px 0 0 var(--accent-line), 0 1px 0 rgba(255,255,255,0.04) inset, 0 14px 36px -22px var(--accent-glow); }
.fy-card.hover:hover{ transform:translateY(-2px); background:var(--fy-surface-2); }
.fy-card p, .fy-card li{ color:var(--fy-soft); }

/* Boutons : même rayon et hauteur partout. Hiérarchie :
   primaire = vert FoundYou, texte bleu nuit (contraste 9,15:1, AAA) ; secondaire = fond sombre, bordure visible,
   texte clair (15,4:1) ; tertiaire = lien discret souligné au survol (10,2:1) ; danger = rouge, seulement si utile.
   Chaque bouton porte un libellé explicite : l'action ne dépend jamais de la couleur seule. */
.fy-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:46px; padding:0 22px; border-radius:var(--fy-radius-sm);
  font:700 15px/1.2 var(--fy-font); text-decoration:none; cursor:pointer; border:1px solid transparent; transition:background .2s, border-color .2s, box-shadow .2s; text-align:center; }
.fy-btn:focus-visible{ outline:3px solid #ffffff; outline-offset:3px; }
/* :is(:link, :visited, :hover, :focus, :active) : aucun état de lien (visité, survolé, actif) ne change la couleur du texte */
.fy-btn-primary, .fy-btn-trust,
.fy-btn-primary:is(:link, :visited, :hover, :focus, :active), .fy-btn-trust:is(:link, :visited, :hover, :focus, :active){
  background:var(--fy-trust); color:var(--fy-on-green); border-color:#3fb58e; text-decoration:none; }
.fy-btn-primary:hover, .fy-btn-trust:hover{ background:#5ad6ad; box-shadow:0 6px 18px -10px rgba(76,201,160,0.6); }
.fy-btn-primary:active, .fy-btn-trust:active{ background:#3fb58e; }
.fy-btn-secondary, .fy-btn-secondary:is(:link, :visited, :hover, :focus, :active){
  background:#101b2c; color:var(--fy-text); border-color:rgba(160,195,235,0.38); text-decoration:none; }
.fy-btn-secondary:hover{ border-color:var(--fy-info); }
.fy-btn-tertiary, .fy-btn-tertiary:is(:link, :visited, :hover, :focus, :active){ background:none; color:var(--fy-info); padding:0 6px; min-height:auto; font-weight:600; }
.fy-btn-tertiary:hover{ text-decoration:underline; }
.fy-btn-danger, .fy-btn-danger:is(:link, :visited, :hover, :focus, :active){ background:none; color:var(--fy-danger); border-color:var(--fy-line-danger); }
.fy-btn[disabled], .fy-btn[aria-disabled="true"]{ opacity:.55; cursor:not-allowed; }

/* Navigation et pied de page */
.fy-nav{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:16px var(--fy-gutter);
  border-bottom:1px solid var(--fy-line); background:rgba(6,16,31,0.92); backdrop-filter:blur(10px); position:sticky; top:0; z-index:50; }
.fy-brand{ display:flex; align-items:center; gap:10px; color:var(--fy-text); text-decoration:none; font-weight:700; font-size:18px; }
.fy-brand img{ width:36px; height:36px; border-radius:8px; object-fit:contain; }
.fy-nav-links{ display:flex; gap:20px; flex-wrap:wrap; }
.fy-nav-links a{ color:var(--fy-muted); text-decoration:none; font-size:15px; }
.fy-nav-links a:hover, .fy-nav-links a[aria-current="page"]{ color:var(--fy-text); }
.fy-footer{ border-top:1px solid var(--fy-line); padding:32px var(--fy-gutter); text-align:center; color:var(--fy-muted); font-size:14px; }
.fy-footer a{ color:var(--fy-info); text-decoration:none; margin:0 8px; }

/* Badges d'état : toujours un texte, jamais la couleur seule */
.fy-badge{ display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:999px; font-size:12px; font-weight:600; border:1px solid var(--fy-line); }
.fy-badge::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }
.fy-badge.ok{ color:var(--fy-trust); border-color:var(--fy-line-trust); }
.fy-badge.info{ color:var(--fy-info); border-color:var(--fy-line-info); }
.fy-badge.warn{ color:var(--fy-price); border-color:var(--fy-line-price); }
.fy-badge.off{ color:var(--fy-muted); }
.fy-badge.danger{ color:var(--fy-danger); border-color:var(--fy-line-danger); }

/* Pages juridiques : lecture confortable, sommaire, sections en cartes */
.fy-doc{ display:grid; grid-template-columns:240px minmax(0,1fr); gap:32px; align-items:start; padding:40px 0 64px; }
.fy-toc{ position:sticky; top:84px; font-size:14px; }
.fy-toc ol{ list-style:none; margin:0; padding:0; display:grid; gap:4px; }
.fy-toc a{ color:var(--fy-muted); text-decoration:none; display:block; padding:5px 10px; border-radius:8px; border-left:2px solid transparent; }
.fy-toc a:hover{ color:var(--fy-text); border-left-color:var(--fy-line-info); background:var(--fy-surface); }
.fy-doc section{ background:var(--fy-surface); border:1px solid var(--fy-line); border-left:3px solid var(--fy-line-info); border-radius:var(--fy-radius); padding:24px 26px; margin-bottom:18px; scroll-margin-top:90px; }
.fy-doc section.trust{ border-color:rgba(76,201,160,0.24); border-left-color:var(--fy-line-trust); }
.fy-doc section.inst{ border-color:rgba(111,179,217,0.24); border-left-color:var(--fy-line-inst); }
.fy-doc section.info{ border-color:rgba(124,196,255,0.22); border-left-color:var(--fy-line-info); }
.fy-doc section.cyan{ border-color:rgba(95,212,230,0.22); border-left-color:rgba(95,212,230,0.55); }
.fy-doc section.price{ border-color:rgba(242,180,90,0.22); border-left-color:var(--fy-line-price); }
.fy-doc section h2{ font-size:21px; }
.fy-doc section h3{ font-size:16px; margin-top:16px; }
.fy-doc p, .fy-doc li{ color:var(--fy-soft); }
.fy-doc ul{ padding-left:20px; }
.fy-doc table{ width:100%; border-collapse:collapse; font-size:14px; margin:10px 0; }
.fy-doc th, .fy-doc td{ text-align:left; padding:9px 10px; border-bottom:1px solid var(--fy-line); vertical-align:top; }
.fy-doc th{ color:var(--fy-muted); font-weight:600; font-size:13px; }
.fy-callout{ border:1px solid var(--fy-line-price); background:rgba(242,180,90,0.07); border-radius:var(--fy-radius-sm); padding:12px 14px; color:var(--fy-soft); font-size:14px; }

@media (max-width:860px){
  .fy-doc{ grid-template-columns:1fr; padding-top:24px; }
  .fy-toc{ position:static; }
  .fy-toc ol{ grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); }
}
@media (max-width:560px){ :root{ --fy-gutter:16px; --fy-section:44px; } .fy-card{ padding:20px; } .fy-doc section{ padding:18px; } .fy-doc table{ font-size:13px; } }
@media (prefers-reduced-motion:reduce){ .fy-card, .fy-btn{ transition:none; } .fy-card.hover:hover{ transform:none; } }
