:root{--nuit:#16406B;--lac:#2E6EDB;--orange:#FF7A2F;--soleil:#FFC53D;--vert:#1FA07A;--nuage:#F4F7FB;--encre:#12263A;--gris:#5A6B80;--radius:10px;--shadow:0 10px 30px rgba(22,64,107,.10);}
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Inter',system-ui,sans-serif;color:var(--encre);background:#fff;line-height:1.6;}
h1,h2,h3{font-family:'Montserrat',sans-serif;font-weight:800;line-height:1.15;}
a{color:var(--lac);text-decoration:none;}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px;}
header{background:linear-gradient(135deg,var(--nuit) 0%,#1d4f8f 100%);color:#fff;padding:16px 0;position:sticky;top:0;z-index:10;box-shadow:0 4px 20px rgba(0,0,0,.18);}
.header-in{display:flex;align-items:center;justify-content:space-between;}
.logo{font-family:'Montserrat';font-weight:800;font-size:24px;letter-spacing:-.5px;color:#fff;}
.logo .dot{color:var(--orange);}
nav a{color:#fff;opacity:.9;margin-left:18px;font-weight:500;font-size:15px;}
nav a:hover{opacity:1;}
.page{padding:48px 0 60px;}
.page h1{font-size:clamp(28px,4vw,40px);margin-bottom:10px;}
.page .sub{color:var(--gris);font-size:17px;margin-bottom:30px;max-width:760px;}
.card{background:var(--nuage);border-radius:var(--radius);padding:22px;border:1px solid #e6edf5;margin-bottom:14px;}
.card h3{font-size:18px;margin-bottom:6px;}
.card .meta{font-size:14px;color:var(--gris);margin-bottom:8px;}
.contact{font-size:15px;margin-top:8px;background:#fff;border-radius:8px;padding:12px;display:inline-block;border:1px solid #e6edf5;}
.badge-check{display:inline-block;background:var(--vert);color:#fff;font-size:12px;font-weight:700;border-radius:20px;padding:3px 10px;margin-right:8px;}
.badge-pending{display:inline-block;background:var(--soleil);color:#000;font-size:12px;font-weight:700;border-radius:20px;padding:3px 10px;}
.btn{display:inline-block;background:var(--orange);color:#fff;padding:13px 26px;border-radius:12px;font-weight:700;font-size:15px;transition:.2s;border:none;cursor:pointer;}
.btn:hover{background:#ff8f52;transform:translateY(-2px);}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;}
.pagination{font-size:14px;color:var(--gris);margin-top:20px;}
.pager{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:26px;font-size:14px}
.pager .pag-navbox{white-space:nowrap}
.pager a.pag-nav{display:inline-block;padding:8px 14px;border:1px solid #dfe7f1;border-radius:9px;color:var(--lac);background:#fff;font-weight:600}
.pager a.pag-nav:hover{border-color:var(--lac)}
.pager .pag-nav.off{opacity:.35;pointer-events:none}
.pager .pag-chain{display:inline-flex;align-items:center;gap:3px;background:var(--nuage);border:1px solid #e6edf5;border-radius:12px;padding:5px 14px;flex-wrap:wrap;justify-content:center}
.pager .pag-chain a,.pager .pag-chain .pag-cur{display:inline-block;min-width:28px;text-align:center;padding:4px 7px;border-radius:8px;color:var(--nuit);font-weight:600;font-size:14px}
.pager .pag-chain a:hover{background:#fff}
.pager .pag-chain .pag-cur{background:var(--orange);color:#fff;font-weight:800}
.pager .pag-arr{color:var(--gris);opacity:.55;font-size:12px}
.pager .pag-dots{color:var(--gris);padding:0 3px}
footer{background:var(--nuit);color:#c9d8ea;padding:40px 0 26px;margin-top:20px;}
footer h5{color:#fff;font-family:'Montserrat';margin-bottom:12px;font-size:15px;}
footer a{color:#c9d8ea;font-size:14px;display:block;margin-bottom:6px;}
footer a:hover{color:var(--soleil);}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px;}
.foot-bottom{margin-top:26px;border-top:1px solid rgba(255,255,255,.15);padding-top:16px;font-size:13px;opacity:.8;}
@media(max-width:820px){nav{display:none}.foot-grid{grid-template-columns:1fr}}
.searchbar{width:100%;padding:16px;border-radius:12px;border:2px solid #dfe7f1;font-size:16px;margin-bottom:24px;}
.metier-link{background:#fff;padding:14px 20px;border-radius:10px;border:1px solid #dfe7f1;display:flex;justify-content:space-between;align-items:center;font-weight:700;color:var(--nuit);margin-bottom:10px;transition:.15s;}
.metier-link:hover{border-color:var(--lac);transform:translateX(3px);}
.metier-link .n{color:var(--orange);font-weight:800;font-size:18px;}