/* Finances Expat — socle du design system. Pilote : accueil, octobre 2026.
   Les autres pages n'importent pas encore ce fichier. Aucun moteur fonctionnel. */
:root {
  --fe-navy: #0b2538;
  --fe-navy-deep: #071c2c;
  --fe-forest: #144f45;
  --fe-forest-deep: #103d36;
  --fe-ivory: #faf8f4;
  --fe-white: #fffefd;
  --fe-beige: #eee8dc;
  --fe-beige-soft: #f4f0e7;
  --fe-text: #152f3f;
  --fe-muted: #52616b;
  --fe-line: #dedfd8;
  --fe-focus: #176a78;
  --fe-font-editorial: "Source Serif 4", Georgia, serif;
  --fe-font-ui: "Hanken Grotesk", system-ui, sans-serif;
  --fe-font-numbers: "IBM Plex Mono", monospace;
  --fe-space-1: .25rem;
  --fe-space-2: .5rem;
  --fe-space-3: .75rem;
  --fe-space-4: 1rem;
  --fe-space-5: 1.5rem;
  --fe-space-6: 2rem;
  --fe-space-7: 3rem;
  --fe-space-8: 4rem;
  --fe-radius-small: 5px;
  --fe-radius-card: 8px;
  --fe-radius-pill: 999px;
  --fe-shadow-card: 0 4px 18px rgb(11 37 56 / 4%);
  --fe-shadow-lift: 0 8px 28px rgb(11 37 56 / 9%);
  --fe-container: 1200px;
  --fe-reading: 65ch;
  --fe-gutter: clamp(20px, 4vw, 40px);
}

.fe-home,
.fe-home *,
.fe-home *::before,
.fe-home *::after { box-sizing: border-box; }

.fe-home {
  margin: 0;
  color: var(--fe-text);
  background: var(--fe-ivory);
  font-family: var(--fe-font-editorial);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.fe-home h1,
.fe-home h2,
.fe-home h3,
.fe-home p,
.fe-home figure,
.fe-home ol,
.fe-home ul { margin: 0; }

.fe-home h1,
.fe-home h2,
.fe-home h3 {
  color: var(--fe-navy);
  font-family: var(--fe-font-editorial);
  font-weight: 600;
  text-wrap: balance;
}

.fe-home a { color: var(--fe-forest); text-underline-offset: 4px; }
.fe-home a:hover { text-decoration-thickness: 2px; }
.fe-home img { display: block; max-width: 100%; height: auto; }
.fe-home svg { display: block; }
.fe-home button,
.fe-home input { font: inherit; }
.fe-home button { cursor: pointer; }
.fe-home :focus-visible { outline: 3px solid var(--fe-focus); outline-offset: 4px; }

.fe-container {
  width: min(var(--fe-container), calc(100% - 2 * var(--fe-gutter)));
  margin-inline: auto;
}

.fe-button {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: var(--fe-space-3);
  padding: 11px 23px;
  border: 1px solid var(--fe-forest);
  border-radius: var(--fe-radius-small);
  color: var(--fe-white);
  background: var(--fe-forest);
  font-family: var(--fe-font-editorial);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  text-decoration: none;
  transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.fe-home .fe-button { color: var(--fe-white); }
.fe-home .fe-button:hover { background: var(--fe-forest-deep); text-decoration: none; }
.fe-home .fe-button--outline { color: var(--fe-navy); background: rgb(255 254 253 / 70%); border-color: #81929a; }
.fe-home .fe-button--outline:hover { background: var(--fe-white); border-color: var(--fe-forest); }

.fe-card {
  min-width: 0;
  border: 1px solid var(--fe-line);
  border-radius: var(--fe-radius-card);
  background: var(--fe-white);
  box-shadow: var(--fe-shadow-card);
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

a.fe-card:hover,
.fe-card:focus-within { border-color: #a0b5ac; box-shadow: var(--fe-shadow-lift); }

.fe-icon-box {
  display: grid;
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  place-items: center;
  border-radius: var(--fe-radius-small);
  color: var(--fe-forest);
  background: var(--fe-beige-soft);
}

.fe-icon { width: 32px; height: 32px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.fe-eyebrow { color: var(--fe-forest); font-family: var(--fe-font-ui); font-size: 11px; font-weight: 700; letter-spacing: .09em; line-height: 1.4; text-transform: uppercase; }
.fe-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

@media (prefers-reduced-motion: reduce) {
  .fe-home *, .fe-home *::before, .fe-home *::after { animation-duration: 0s; transition-duration: 0s; scroll-behavior: auto; }
}