:root{--fond:#04060F;--fond2:#16204a;--accent:#a8c7ff;--texte:#f4f1ea}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:#f7f6f3;color:#1d1d1f;font:18px/1.65 -apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
a{color:inherit}
.haut{background:linear-gradient(160deg,var(--fond),var(--fond2));color:var(--texte);padding:28px 20px 44px}
.haut .barre,.contenu{max-width:760px;margin:0 auto}
.marque{display:flex;align-items:center;gap:12px;font-weight:700;text-decoration:none;font-size:19px}
.marque img{width:44px;height:44px;border-radius:11px}
.haut h1{font-size:clamp(30px,6vw,46px);line-height:1.15;margin:30px 0 10px}
.haut p{opacity:.85;margin:0}
.bouton{display:inline-block;margin-top:22px;background:var(--accent);color:var(--fond);font-weight:700;padding:12px 22px;border-radius:999px;text-decoration:none}
.contenu{padding:34px 20px 70px}
.media{width:100%;max-width:420px;display:block;margin:0 auto 34px;border-radius:18px;background:#000}
.credit{text-align:center;font-size:13px;color:#888;margin:-22px 0 30px}
article h2{font-size:24px;margin:34px 0 8px}
.cartes{display:grid;gap:18px}
.carte{display:flex;gap:16px;background:#fff;border-radius:16px;padding:14px;text-decoration:none;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.carte img{width:96px;height:120px;object-fit:cover;border-radius:10px;flex:none}
.carte h3{margin:2px 0 6px;font-size:19px;line-height:1.3}.carte p{margin:0;font-size:15px;color:#555}
.date{font-size:14px;color:#777}
.appel{background:#fff;border-radius:18px;padding:22px;margin-top:40px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.appel .bouton{margin-top:12px}
footer{text-align:center;font-size:14px;color:#888;padding:0 20px 40px}