:root { --navy:#1f3a5f; --navy-light:#2c4a6e; --ink:#1a1a1a; --muted:#5a6672; --bg:#fafafa; --card:#fff; --line:#e6e9ed; }
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; color:var(--ink); background:var(--bg); line-height:1.6; }
a { color:var(--navy); text-decoration:none; }
a:hover { text-decoration:underline; }
.wrap { max-width:1080px; margin:0 auto; padding:0 24px; }

/* ===== Header ===== */
.site-header { background:var(--navy); color:#fff; padding:40px 24px 36px; }
.site-header .wrap { max-width:1080px; margin:0 auto; }
.site-header h1 { font-size:2rem; letter-spacing:.5px; font-weight:700; }
.site-header .role { font-size:1.05rem; color:#c9d6e4; margin-top:6px; font-weight:500; }
.site-header .contact { margin-top:12px; font-size:.92rem; }
.site-header .contact a { color:#a9c3dd; border-bottom:1px solid #5b7a99; padding-bottom:1px; }
.site-header .contact a:hover { color:#fff; border-color:#fff; text-decoration:none; }
.site-header .contact span { color:#7f93a6; margin:0 8px; }

/* ===== Fil d'ariane ===== */
.breadcrumb { background:#eef2f7; border-bottom:1px solid var(--line); padding:12px 0; }
.breadcrumb .wrap { max-width:1080px; margin:0 auto; }
.breadcrumb a { color:var(--navy); font-weight:600; font-size:.9rem; }
.breadcrumb span { color:var(--muted); font-size:.9rem; }

main { max-width:1080px; margin:0 auto; padding:34px 24px 64px; }
.intro { font-size:1.05rem; color:var(--muted); max-width:66ch; margin-bottom:6px; }
.intro strong { color:var(--ink); }

.section-title { font-size:1.2rem; color:var(--navy); text-transform:uppercase; letter-spacing:1.5px; margin:26px 0 16px; border-bottom:2px solid var(--navy); padding-bottom:6px; display:inline-block; }

/* ===== Grille accueil ===== */
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:24px; margin-top:6px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 1px 3px rgba(0,0,0,.04); transition:box-shadow .2s ease, transform .2s ease; }
.card:hover { box-shadow:0 8px 24px rgba(31,58,95,.12); transform:translateY(-2px); text-decoration:none; }
.card .img { aspect-ratio:4/3; overflow:hidden; background:#eee; }
.card .img img { width:100%; height:100%; object-fit:cover; object-position:center; display:block; transition:transform .35s ease; }
.card:hover .img img { transform:scale(1.04); }
.card .body { padding:16px 20px 18px; display:flex; flex-direction:column; flex:1; }
.card h3 { font-size:1.05rem; color:var(--navy); font-weight:700; line-height:1.3; }
.card .meta { font-size:.78rem; color:var(--muted); text-transform:uppercase; letter-spacing:.6px; margin:5px 0 10px; font-weight:600; }
.card p { font-size:.88rem; color:#3d4750; }
.card .more { margin-top:12px; font-size:.82rem; font-weight:700; color:var(--navy); }

/* ===== Page projet ===== */
.project-head { border-bottom:1px solid var(--line); padding-bottom:18px; margin-bottom:26px; }
.project-head h2 { font-size:1.7rem; color:var(--navy); font-weight:700; }
.project-head .meta { font-size:.85rem; color:var(--muted); text-transform:uppercase; letter-spacing:.7px; margin-top:6px; font-weight:600; }
.project-head p.desc { margin-top:14px; color:#3d4750; max-width:72ch; }
.sub-title { font-size:1.05rem; color:var(--navy); font-weight:700; text-transform:uppercase; letter-spacing:1px; margin:26px 0 14px; }

/* galerie */
.gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; }
.gallery figure { background:var(--card); border:1px solid var(--line); border-radius:8px; overflow:hidden; }
.gallery figure img { width:100%; height:100%; object-fit:cover; display:block; }
.gallery figcaption { padding:8px 12px; font-size:.82rem; color:var(--muted); text-align:center; background:#fff; }
.gallery.tall figure img { aspect-ratio:3/4; }
.gallery.wide figure img { aspect-ratio:4/3; }

/* vidéo */
.video-wrap { max-width:860px; margin:0 auto; }
.video-wrap video { width:100%; border-radius:10px; background:#000; box-shadow:0 4px 16px rgba(0,0,0,.15); }

/* À propos */
.about { margin-top:40px; padding-top:24px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:32px; }
.about .col { flex:1 1 280px; }
.about h2 { font-size:1.02rem; color:var(--navy); text-transform:uppercase; letter-spacing:1px; margin-bottom:10px; }
.about p, .about li { font-size:.9rem; color:#3d4750; }
.about ul { list-style:none; }
.about li { padding:3px 0; }
.cv-link { display:inline-block; margin-top:12px; background:var(--navy); color:#fff; padding:9px 16px; border-radius:6px; font-size:.88rem; font-weight:600; }
.cv-link:hover { background:var(--navy-light); text-decoration:none; }

footer { text-align:center; color:var(--muted); font-size:.82rem; padding:20px 24px 40px; }
footer a { color:var(--navy); }

@media (max-width:640px){ .site-header h1{font-size:1.55rem;} .grid,.gallery{grid-template-columns:1fr;} .project-head h2{font-size:1.4rem;} }