/* MC2R — charte 2026 : Spectral / Space Grotesk / IBM Plex Mono · #26333A #9A8763 #F4F2EC */
@font-face { font-family:'Spectral'; font-weight:400; font-display:swap; src:url('/assets/fonts/spectral-400-latin.woff2') format('woff2'); }
@font-face { font-family:'Spectral'; font-weight:500; font-display:swap; src:url('/assets/fonts/spectral-500-latin.woff2') format('woff2'); }
@font-face { font-family:'Space Grotesk'; font-weight:400 700; font-display:swap; src:url('/assets/fonts/space-grotesk-latin.woff2') format('woff2'); }
@font-face { font-family:'IBM Plex Mono'; font-weight:400; font-display:swap; src:url('/assets/fonts/plex-mono-400-latin.woff2') format('woff2'); }
@font-face { font-family:'IBM Plex Mono'; font-weight:500; font-display:swap; src:url('/assets/fonts/plex-mono-500-latin.woff2') format('woff2'); }

* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { font-family:'Space Grotesk',system-ui,sans-serif; background:#f4f2ec; color:#26333a; line-height:1.6; }
a { color:inherit; text-decoration:none; }
img { display:block; }

.mono { font-family:'IBM Plex Mono',monospace; letter-spacing:0.16em; text-transform:uppercase; color:#9a8763; font-size:12px; }
.wrap { max-width:1200px; margin:0 auto; padding:0 40px; }

/* Header */
header { position:sticky; top:0; z-index:50; background:rgba(244,242,236,0.92); backdrop-filter:blur(10px); border-bottom:1px solid #e4dfd4; }
.hd { display:flex; align-items:center; justify-content:space-between; padding:16px 40px; max-width:1200px; margin:0 auto; }
.brand { display:flex; align-items:center; gap:12px; }
.brand img { width:46px; height:46px; border-radius:9px; object-fit:cover; }
.brand-name { font-family:'Spectral',serif; font-size:23px; font-weight:500; line-height:1.1; }
.brand-sub { font-family:'IBM Plex Mono',monospace; font-size:9px; letter-spacing:0.13em; color:#9a8763; text-transform:uppercase; }
nav { display:flex; gap:30px; align-items:center; }
nav a { font-size:14.5px; font-weight:500; color:#3d4a52; border-bottom:2px solid transparent; padding-bottom:4px; }
nav a.on { color:#26333a; font-weight:600; border-bottom-color:#9a8763; }
.btn { display:inline-block; background:#26333a; color:#fff; font-size:15px; font-weight:600; padding:14px 26px; border-radius:9px; border:none; cursor:pointer; font-family:inherit; }
.btn-ghost { background:transparent; border:1px solid #d0c8b8; color:#26333a; }
.btn-gold { background:#b7a984; color:#1c272d; }
.hd .btn { padding:11px 22px; font-size:14px; }

/* Hero */
.hero { padding:110px 40px 96px; text-align:center; background:radial-gradient(1100px 520px at 50% -10%, rgba(154,135,99,0.20), transparent 70%); }
.hero h1 { font-family:'Spectral',serif; font-weight:400; font-size:clamp(36px,6vw,68px); line-height:1.06; letter-spacing:-0.02em; margin:26px auto; max-width:900px; }
.hero h1 em { color:#9a8763; font-style:italic; }
.hero p { font-size:19px; color:#55636b; margin:0 auto 40px; max-width:600px; }
.hero-cta { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* Bande 4 temps */
.band { background:#26333a; }
.band-grid { display:grid; grid-template-columns:repeat(4,1fr); max-width:1200px; margin:0 auto; }
.band-cell { padding:34px 44px; border-right:1px solid rgba(255,255,255,0.12); }
.band-cell:last-child { border-right:none; }
.band-cell b { display:block; font-family:'Spectral',serif; font-weight:400; font-size:25px; color:#fff; }
.band-cell span { font-size:13px; color:#b0aa9a; }

/* Sections */
section.blk { max-width:1200px; margin:0 auto; padding:80px 40px 40px; }
section.blk h2 { font-family:'Spectral',serif; font-weight:400; font-size:clamp(28px,4vw,42px); margin:14px 0 42px; max-width:600px; }
.cards { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.cards-3 { grid-template-columns:repeat(3,1fr); }
.card { background:#fff; border:1px solid #e8e2d6; border-radius:12px; padding:34px; }
.card .num { font-family:'IBM Plex Mono',monospace; color:#9a8763; font-size:14px; }
.card h3 { font-family:'Spectral',serif; font-weight:500; font-size:22px; margin:14px 0 8px; }
.card p { font-size:15px; color:#63707c; }
.card-dark { background:#26333a; border:none; border-radius:12px; padding:40px; }
.card-dark .tag { font-family:'IBM Plex Mono',monospace; color:#b7a984; font-size:13px; letter-spacing:0.1em; }
.card-dark h3 { font-family:'Spectral',serif; font-weight:400; font-size:27px; color:#fff; margin:14px 0 10px; }
.card-dark p { font-size:15px; line-height:1.65; color:#a9b3ba; }

/* CTA bandeau */
.cta { max-width:1200px; margin:0 auto; padding:56px 40px 100px; }
.cta-in { background:linear-gradient(120deg,#2c3a42,#1c272d); border-radius:16px; padding:60px; display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap; }
.cta-in h2 { font-family:'Spectral',serif; font-weight:400; font-size:clamp(26px,4vw,38px); color:#fff; margin:0 0 10px; }
.cta-in p { color:#b6b1a4; font-size:15px; font-family:'IBM Plex Mono',monospace; }

/* Pages internes */
.page-head { max-width:1000px; margin:0 auto; padding:96px 40px 40px; }
.page-head h1 { font-family:'Spectral',serif; font-weight:400; font-size:clamp(34px,5vw,56px); line-height:1.1; letter-spacing:-0.02em; margin:22px 0 24px; max-width:760px; }
.page-head p.lead { font-size:19px; line-height:1.65; color:#55636b; max-width:660px; }

/* Liste démarche (services) */
.steps { max-width:1200px; margin:0 auto; padding:40px 40px 20px; }
.step { display:grid; grid-template-columns:80px 1fr 1.3fr; gap:30px; padding:30px 0; border-top:1px solid #ded8cc; align-items:baseline; }
.step:last-child { border-bottom:1px solid #ded8cc; }
.step .num { font-family:'IBM Plex Mono',monospace; color:#9a8763; font-size:14px; }
.step h3 { font-family:'Spectral',serif; font-weight:400; font-size:25px; }
.step p { font-size:15px; color:#5a6b73; }

/* À propos */
.about-2col { max-width:1000px; margin:0 auto; padding:20px 40px 60px; display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
.portrait { aspect-ratio:4/4.4; border-radius:14px; background:repeating-linear-gradient(135deg,#eae6dd 0 14px,#e1dcd0 14px 28px); border:1px solid #ddd7ca; display:flex; align-items:flex-end; padding:22px; }
.portrait span { font-family:'IBM Plex Mono',monospace; font-size:12px; color:#a2977f; }
.portrait-photo { width:100%; aspect-ratio:4/4.4; object-fit:cover; border-radius:14px; border:1px solid #ddd7ca; filter:grayscale(1); }
.about-2col h2 { font-family:'Spectral',serif; font-weight:400; font-size:32px; margin-bottom:18px; }
.about-2col p { font-size:16px; line-height:1.7; color:#55636b; margin-bottom:16px; }

/* Contact */
.contact-grid { max-width:1200px; margin:0 auto; padding:20px 40px 100px; display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:start; }
.c-item { margin-bottom:26px; }
.c-item .mono { display:block; font-size:11px; letter-spacing:0.14em; margin-bottom:8px; }
.c-item a, .c-item div.v { font-size:17px; }
.c-item a { border-bottom:1px solid #d0c8b8; }
form { background:#fff; border:1px solid #e8e2d6; border-radius:16px; padding:40px; display:flex; flex-direction:column; gap:18px; }
form .row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
label { display:flex; flex-direction:column; gap:7px; font-size:13px; color:#55636b; }
input, textarea { font-family:inherit; font-size:15px; padding:12px 14px; border:1px solid #ddd7ca; border-radius:8px; background:#faf9f5; }
textarea { resize:vertical; }
.mention { font-size:12px; color:#7b8790; line-height:1.55; }
.mention a { border-bottom:1px solid #d0c8b8; }

/* Fiches missions */
.card-link { display:flex; flex-direction:column; gap:14px; }
.card-link .more { font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#b7a984; margin-top:auto; }
.card-link:hover .more { color:#fff; }
.fiche { max-width:860px; margin:0 auto; padding:20px 40px 40px; }
.fiche h2 { font-family:'Spectral',serif; font-weight:500; font-size:26px; margin:44px 0 14px; }
.fiche p { font-size:16px; line-height:1.7; color:#55636b; margin-bottom:14px; }
.fiche ul { padding-left:22px; margin-bottom:14px; }
.fiche li { font-size:15.5px; line-height:1.65; color:#55636b; margin-bottom:8px; }
.fiche strong { color:#26333a; }
.fiche .encadre { background:#fff; border:1px solid #e8e2d6; border-radius:12px; padding:26px 30px; margin:10px 0; }
.fiche .encadre p, .fiche .encadre li { margin-bottom:8px; }
.fiche-steps { display:flex; flex-direction:column; margin:10px 0; }
.fiche-step { display:grid; grid-template-columns:56px 1fr; gap:18px; padding:18px 0; border-top:1px solid #ded8cc; }
.fiche-step:last-child { border-bottom:1px solid #ded8cc; }
.fiche-step .num { font-family:'IBM Plex Mono',monospace; color:#9a8763; font-size:14px; padding-top:3px; }
.fiche-step h3 { font-family:'Spectral',serif; font-weight:500; font-size:19px; margin-bottom:4px; }
.fiche-step p { font-size:15px; margin-bottom:0; }
.crumb { font-family:'IBM Plex Mono',monospace; font-size:12px; color:#9a8763; }
.crumb a { border-bottom:1px solid #d0c8b8; }

/* Pages légales */
.legal { max-width:860px; margin:0 auto; padding:80px 40px 90px; }
.legal h1 { font-family:'Spectral',serif; font-weight:400; font-size:clamp(32px,5vw,46px); margin:22px 0 34px; }
.legal h2 { font-family:'Spectral',serif; font-weight:500; font-size:24px; margin:38px 0 12px; }
.legal p, .legal li { font-size:15.5px; color:#55636b; margin-bottom:12px; }
.legal ul { padding-left:22px; }
.legal strong { color:#26333a; }
.legal .card { padding:28px 32px; margin:18px 0; }
.legal .card p { margin-bottom:6px; }
.legal .maj { font-family:'IBM Plex Mono',monospace; font-size:12px; color:#9a8763; margin-top:40px; }
.legal a { border-bottom:1px solid #d0c8b8; }

/* Footer */
footer { background:#26333a; color:#c7ccc9; }
.ft { max-width:1200px; margin:0 auto; padding:56px 40px; display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; }
.ft h4 { font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:#b7a984; margin-bottom:16px; font-weight:500; }
.ft .col { display:flex; flex-direction:column; gap:11px; font-size:14.5px; }
.ft p { font-size:14px; color:#9aa5a3; max-width:280px; }
.ft .fb { display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.ft .fb img { width:42px; height:42px; border-radius:8px; }
.ft .fb b { font-family:'Spectral',serif; font-size:22px; color:#fff; font-weight:400; }
.ft-bar { border-top:1px solid rgba(255,255,255,0.1); }
.ft-bar .in { max-width:1200px; margin:0 auto; padding:22px 40px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:12.5px; color:#8b9694; font-family:'IBM Plex Mono',monospace; }
.ft-bar a { border-bottom:1px solid rgba(139,150,148,0.4); }

/* Responsive */
@media (max-width: 900px) {
  .wrap, .hd, section.blk, .steps, .cta, .page-head, .contact-grid, .legal, .ft { padding-left:22px; padding-right:22px; }
  .hd { flex-wrap:wrap; gap:12px; }
  nav { gap:18px; flex-wrap:wrap; }
  .hero { padding:70px 22px 60px; }
  .band-grid { grid-template-columns:1fr 1fr; }
  .band-cell { border-right:none; border-bottom:1px solid rgba(255,255,255,0.12); padding:26px 30px; }
  .cards, .cards-3 { grid-template-columns:1fr; }
  .step { grid-template-columns:1fr; gap:6px; padding:22px 0; }
  .about-2col, .contact-grid { grid-template-columns:1fr; }
  .cta-in { padding:36px 28px; }
  .ft { grid-template-columns:1fr; }
  form .row { grid-template-columns:1fr; }
}
