/* Feuille de style des pages SEO statiques — reprend les tokens visuels de l'app */
:root{
  --ink:#101418; --ink-2:#4E5764; --ink-3:#6B7480;
  --bg:#F6F7F9; --surface:#FFFFFF;
  --navy:#101B2E; --navy-2:#18253C;
  --line:#E7E9ED;
  --accent:#2456E5; --accent-2:#1B44BC; --accent-soft:#EEF2FE;
  --success:#0E9F6E; --success-soft:#E8F6F1;
  --r:13px; --r-lg:16px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Inter","Inter var",system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}
.wrap{max-width:720px;margin:0 auto;padding:0 20px}

header.hero{background:linear-gradient(180deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;padding:20px 0 40px}
.nav{display:flex;align-items:center;gap:10px;padding:14px 0 30px}
.nav img{width:32px;height:32px;border-radius:9px;display:block}
.nav b{font-size:18px;font-weight:600;letter-spacing:-.02em}
header.hero h1{font-size:30px;font-weight:600;letter-spacing:-.025em;line-height:1.25;margin:0 0 14px;max-width:520px}
header.hero p{font-size:16px;color:#B8C2D4;max-width:480px;margin:0}

.cta{display:inline-block;margin-top:24px;background:var(--accent);color:#fff;font-weight:500;font-size:15px;padding:14px 26px;border-radius:var(--r);transition:background .15s}
.cta:hover{background:var(--accent-2)}

main{padding:40px 0 60px}
main h2{font-size:22px;font-weight:600;letter-spacing:-.02em;margin:36px 0 12px}
main h2:first-child{margin-top:0}
main p{font-size:15.5px;color:var(--ink-2);margin:0 0 14px}
main ul{padding-left:20px;color:var(--ink-2);font-size:15.5px}
main li{margin-bottom:8px}

.cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}
@media(max-width:560px){.cards{grid-template-columns:1fr}}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px}
.card b{display:block;font-size:15px;margin-bottom:6px}
.card span{font-size:13.5px;color:var(--ink-3)}

.faq details{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:15px 18px;margin-bottom:10px}
.faq summary{font-weight:500;cursor:pointer;font-size:15px}
.faq p{margin-top:10px}

.metiers{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.metiers a{background:var(--accent-soft);color:var(--accent);font-size:13.5px;font-weight:500;padding:8px 14px;border-radius:99px}

footer{border-top:1px solid var(--line);padding:24px 0;text-align:center;font-size:12.5px;color:var(--ink-3)}
footer a{color:var(--ink-3);text-decoration:underline}