@charset "UTF-8";

/* ---- Polices ---- */
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:400; font-display:swap; src:url(assets/fonts/dm-sans-400.woff2) format('woff2'); }
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:500; font-display:swap; src:url(assets/fonts/dm-sans-500.woff2) format('woff2'); }
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:700; font-display:swap; src:url(assets/fonts/dm-sans-700.woff2) format('woff2'); }
@font-face { font-family:'Source Serif 4'; font-style:italic; font-weight:400; font-display:swap; src:url(assets/fonts/source-serif-4-italic.woff2) format('woff2'); }
/* Polices de repli aux métriques calées sur les vraies (mesurées sur le texte du site) : la permutation ne déplace rien */
@font-face { font-family:'DM Sans Fallback'; font-weight:400; src:local('Arial'); size-adjust:103.2%; ascent-override:96.13%; descent-override:30.04%; line-gap-override:0%; }
@font-face { font-family:'DM Sans Fallback'; font-weight:500; src:local('Arial'); size-adjust:104.96%; ascent-override:94.51%; descent-override:29.53%; line-gap-override:0%; }
@font-face { font-family:'DM Sans Fallback'; font-weight:700; src:local('Arial Bold'),local('Arial-BoldMT'); size-adjust:101.78%; ascent-override:97.46%; descent-override:30.46%; line-gap-override:0%; }
@font-face { font-family:'Source Serif Fallback'; font-style:italic; font-weight:400; src:local('Georgia Italic'),local('Georgia-Italic'); size-adjust:97.29%; ascent-override:106.49%; descent-override:34.43%; line-gap-override:0%; }

/* ---- Variables et base ---- */
:root { --paper:#f4f3ed; --ink:#262a26; --muted:#656960; --line:#d2d4c9; --accent:#d4e896; --dark:#29332a; --green:#477259; --serif:'Source Serif 4','Source Serif Fallback',Georgia,'Times New Roman',serif; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:'DM Sans','DM Sans Fallback',Arial,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
a,button,summary { -webkit-tap-highlight-color:transparent; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:2px solid #586e2e; outline-offset:6px; }
::selection { background:var(--accent); color:var(--ink); }
.wrap { max-width:1320px; margin-inline:auto; padding-inline:64px; }
.skip-link { position:fixed; top:8px; left:8px; z-index:10; background:var(--ink); color:white; padding:14px; transform:translateY(-150%); }
.skip-link:focus { transform:translateY(0); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.icon { width:18px; height:18px; flex-shrink:0; vertical-align:middle; }
.serif { font-family:var(--serif); font-style:italic; font-weight:400; letter-spacing:-.035em; }
html { scroll-behavior:smooth; scroll-padding-top:30px; scrollbar-color:#89967c var(--paper); }

/* ---- En-tête ---- */
.header { height:116px; display:flex; align-items:center; justify-content:space-between; }
.wordmark { font-size:38px; font-weight:700; letter-spacing:-.03em; }
.brand-dot { color:#778d4d; }
.header nav { display:flex; align-items:center; gap:36px; font-size:13px; }
.header nav>a { padding-block:12px; }
.header nav>a:hover { color:#657943; }
.nav-contact { border-bottom:1px solid var(--ink); }
.nav-contact span { margin-left:14px; }

/* ---- Hero ---- */
.hero { display:grid; grid-template-columns:1.05fr 1fr; gap:0 66px; padding-top:79px; align-items:center; }
.eyebrow { display:flex; align-items:center; gap:9px; margin:0 0 25px; font-size:10px; font-weight:700; letter-spacing:.165em; line-height:1.7; text-transform:uppercase; }
.status-dot { width:6px; height:6px; border-radius:50%; background:#67976b; box-shadow:0 0 0 4px #e6eee4; }
.hero h1 { margin:0 0 28px; font-size:clamp(58px,5.65vw,78px); font-weight:500; line-height:1.065; letter-spacing:-.055em; }
.hero h1 span { color:var(--green); }
.hero-description { max-width:430px; margin:0 0 31px; font-size:15px; line-height:1.85; color:var(--muted); }
.hero-actions { display:flex; flex-wrap:wrap; gap:21px; align-items:center; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:18px; padding:17px 19px; border-radius:7px; background:var(--ink); color:var(--paper); font-size:12px; font-weight:500; transition:transform .2s,background .2s; }
.button:hover { background:#29493c; transform:translateY(-2px); }
.button:active { transform:translateY(0); }
.text-link { display:inline-flex; align-items:center; gap:12px; font-size:11px; font-weight:500; white-space:nowrap; }
.text-link:hover { color:var(--green); }
.hero-note { display:flex; align-items:center; gap:10px; margin:30px 0 0; font-size:10px; color:var(--muted); }
.small-line { width:20px; height:1px; background:#99ae9e; }
.hero-art { position:relative; min-height:554px; border-radius:14px; background:#16332d; color:var(--accent); isolation:isolate; box-shadow:0 25px 55px -38px #19392b70; transform:rotate(1.2deg); }
.art-grid { position:absolute; inset:0; z-index:-1; border-radius:inherit; background-image:radial-gradient(#b2d7bb24 .7px,transparent .7px); background-size:19px 19px; -webkit-mask-image:linear-gradient(180deg,#0008,#000); mask-image:linear-gradient(180deg,#0008,#000); }
.art-topline { position:absolute; inset:25px 26px auto; display:flex; justify-content:space-between; color:#c8d7cd; font-size:8px; letter-spacing:.14em; text-transform:uppercase; pointer-events:none; }
.art-topline>span:first-child { display:flex; align-items:center; gap:6px; }
.art-dot { display:inline-block; width:4px; height:4px; border-radius:50%; background:var(--accent); }
.poster-stage { position:absolute; inset:0; border-radius:inherit; overflow:hidden; cursor:crosshair; touch-action:pan-y; }
.poster-stage.over { cursor:grab; }
.poster-stage.holding { cursor:grabbing; }
.poster-stage:focus-visible { outline:2px solid var(--accent); outline-offset:-8px; }
.sculpture { position:absolute; inset:6px 0 auto; width:100%; height:auto; }
.type-canvas { position:absolute; inset:0; width:100%; height:100%; opacity:0; pointer-events:none; }
.type-poster.is-ready .type-canvas { opacity:1; }
.type-poster.is-ready .poster-fallback { visibility:hidden; }
.art-caption { position:absolute; left:29px; right:27px; bottom:31px; display:flex; justify-content:space-between; align-items:center; color:#adbbaf; font-size:13px; line-height:1.65; pointer-events:none; }
.art-caption strong { font-weight:500; color:#edf4e9; }
.type-poster:not(.is-ready) .art-hint { display:none; }
.art-seal { display:flex; align-items:center; justify-content:center; width:40px; height:40px; padding:0; border:1px solid #c4dbc430; border-radius:50%; background:none; color:var(--accent); cursor:pointer; pointer-events:auto; transition:transform .3s,border-color .2s; }
.art-seal:hover { border-color:var(--accent); transform:rotate(-40deg); }
.art-seal[hidden] { display:none; }
.art-seal:focus-visible { outline-color:var(--accent); }
.floating-label { position:absolute; left:-31px; top:34%; display:flex; align-items:center; gap:9px; padding:13px 18px; background:#fff; color:#284132; border:1px solid #e2e9df; border-radius:7px; box-shadow:0 12px 30px #102a2414; font-size:11px; font-weight:500; transform:rotate(-1.2deg); pointer-events:none; }
.label-icon { display:inline-grid; place-items:center; width:20px; height:20px; border-radius:50%; background:#edf4e8; color:#4f7850; font-size:12px; }
.promise-strip { grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; gap:28px; margin-top:78px; padding:25px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.promise-strip>p { margin:0; font-size:11px; color:var(--muted); }
.promise-strip>div { display:flex; align-items:center; gap:24px; font-size:11px; font-weight:500; }
.strip-plus { font-size:16px; font-weight:400; color:#9bb199; }

/* ---- Sections et titres ---- */
.section { padding-top:100px; padding-bottom:100px; }
h2 { font-weight:400; font-size:44px; line-height:1.12; letter-spacing:-.03em; margin:24px 0 0; }
h3 { font-size:22px; letter-spacing:-.03em; font-weight:400; margin:0 0 13px; }
.section-heading h2 { margin-top:0; }

/* ---- Expertises ---- */
.expertise { display:grid; grid-template-columns:.85fr 1.45fr; gap:70px; }
.service { display:grid; grid-template-columns:1fr; gap:16px; border-top:1px solid var(--line); padding:27px 0 30px; }
.service:last-child { border-bottom:1px solid var(--line); }
.service p { font-size:14px; line-height:1.75; margin:0; color:var(--muted); max-width:460px; }
.service .service-note { font-size:12px; color:#586247; margin-top:17px; }

/* ---- À propos ---- */
.about-section { background:var(--dark); color:#f2f3e9; }
.about { display:grid; grid-template-columns:.85fr 1.45fr; gap:70px; }
.profile-caption { display:flex; flex-direction:column; gap:8px; font-size:12px; }
.profile-caption strong { font-size:15px; font-weight:400; margin-bottom:3px; }
.profile-caption>span { color:#b8c0b1; }
.about h2 { margin:0 0 32px; font-size:46px; }
.about-copy>p { color:#c3cbbd; font-size:15px; line-height:1.9; max-width:520px; margin:0 0 18px; }
.about-copy>p>a { text-decoration:underline; text-underline-offset:4px; color:#edf2e4; }
.approach { border-top:1px solid #596251; margin-top:35px; padding-top:25px; }
.approach>p { font-size:14px; line-height:1.8; color:#c3cbbd; margin:10px 0 0; }
.approach h3 { font-size:15px; font-weight:500; margin:0; }
.about-section :focus-visible { outline-color:var(--accent); }
.portrait { display:block; width:100%; max-width:280px; height:auto; border-radius:8px; margin-bottom:24px; }

/* ---- Contact ---- */
.contact { padding-top:95px; padding-bottom:95px; }
.contact-main { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:end; }
.contact h2 { font-size:72px; margin:25px 0 0; letter-spacing:-.03em; }
.contact-copy>p { max-width:340px; color:var(--muted); font-size:15px; line-height:1.8; margin:0 0 25px; }
.email { font-size:28px; letter-spacing:-.03em; display:flex; justify-content:space-between; border-bottom:1px solid var(--ink); padding-bottom:14px; max-width:420px; }
.email:hover { color:#5d713d; }
.copy-email { border:0; background:none; color:var(--muted); padding:12px 0; cursor:pointer; font-size:11px; text-decoration:underline; text-underline-offset:3px; min-height:44px; }
.copy-status { display:block; font-size:11px; min-height:16px; color:#53683b; }
.email,.back-top { align-items:center; }
.copy-email:hover,.back-top:hover { color:var(--ink); }

/* ---- Pied de page ---- */
.footer { display:flex; gap:38px; align-items:center; padding-top:27px; padding-bottom:35px; border-top:1px solid var(--line); position:relative; }
.footer>.wordmark { font-size:29px; }
.footer>p { font-size:10px; line-height:1.9; color:var(--muted); margin:0; }
.footer details { font-size:11px; margin-left:auto; }
.footer summary { cursor:pointer; padding:12px 0; }
.legal>p:last-child { margin-bottom:0; }
.legal a { text-decoration:underline; }
.back-top { font-size:11px; color:var(--muted); padding:12px 0; display:inline-flex; gap:8px; }
.legal { position:absolute; bottom:94px; right:64px; max-width:350px; padding:26px; background:var(--paper); border:1px solid var(--line); font-size:12px; line-height:1.8; z-index:3; }

@media (min-width:1300px) {
  .hero-art { min-height:565px; }
}

@media (max-width:1000px) {
  .wrap { padding-inline:36px; }
  .expertise,.about { gap:40px; grid-template-columns:.85fr 1.2fr; }
  h2,.about h2 { font-size:36px; }
  .header nav { gap:22px; }
  .contact h2 { font-size:62px; }
  .contact-main { gap:40px; }
  .email { font-size:25px; }
  .legal { right:36px; }
  .hero { gap:0 37px; padding-top:58px; }
  .hero h1 { font-size:64px; letter-spacing:-.047em; }
  .hero-art { min-height:487px; }
  .art-caption { bottom:24px; }
  .hero-actions { gap:18px; }
  .hero-actions .text-link { font-size:10px; }
}

@media (max-width:700px) {
  .wrap { padding-inline:24px; }
  .header { height:90px; }
  .wordmark { font-size:34px; }
  .header nav>a:not(.nav-contact) { display:none; }
  .nav-contact span { margin-left:8px; }
  .section { padding-block:64px; }
  .expertise,.about { grid-template-columns:1fr; gap:38px; }
  h2,.about h2 { font-size:40px; }
  .service { padding-block:24px; gap:10px; grid-template-columns:1fr; }
  .service h3 { font-size:21px; }
  .service .service-note { font-size:12px; line-height:1.8; }
  .profile-caption { font-size:11px; }
  .about h2 { margin-bottom:24px; }
  .about-copy>p { font-size:14px; }
  .contact-main { grid-template-columns:1fr; gap:32px; }
  .contact-copy>p { margin-bottom:20px; }
  .email { max-width:none; font-size:29px; }
  .footer { flex-wrap:wrap; gap:20px 26px; padding-block:26px; }
  .footer>p { margin-left:auto; text-align:right; }
  .footer details { margin-left:0; }
  .back-top { margin-left:auto; }
  .legal { left:24px; right:24px; bottom:80px; max-width:none; }
  .contact h2 { font-size:clamp(39px,11.7vw,60px); letter-spacing:-.03em; }
  .footer summary,.back-top { min-height:44px; }
  .header nav { font-size:12px; }
  .approach>p { font-size:14px; line-height:1.8; }
  .profile { display:grid; grid-template-columns:112px 1fr; align-items:center; gap:22px; }
  .portrait { margin-bottom:0; }
  .hero { grid-template-columns:1fr; gap:44px 0; padding-top:48px; }
  .hero h1 { font-size:clamp(52px,16vw,68px); letter-spacing:-.055em; }
  .hero-description { font-size:14px; max-width:470px; }
  .hero-actions { gap:20px; }
  .hero-actions .text-link { font-size:11px; }
  .hero-note { margin-top:24px; }
  .hero-art { min-height:0; aspect-ratio:1 / 1.18; width:100%; max-width:520px; margin-inline:auto; transform:rotate(.5deg); }
  .floating-label { display:none; }
  .art-caption { left:26px; bottom:25px; }
  .promise-strip { flex-direction:column; align-items:flex-start; gap:17px; margin-top:4px; padding:23px 0; }
  .promise-strip>div { width:100%; justify-content:space-between; gap:11px; }
}

/* ---- Articles (liste) ---- */
.articles-intro { max-width:620px; }
.articles-intro p { color:var(--muted); font-size:15px; line-height:1.85; margin-top:20px; }
.article-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:34px; margin-top:60px; }
.article-card { display:flex; flex-direction:column; border-top:1px solid var(--line); padding-top:26px; }
.article-card .article-meta { font-size:11px; color:var(--muted); letter-spacing:.04em; text-transform:uppercase; }
.article-card h3 { margin:14px 0 12px; font-size:21px; }
.article-card h3 a:hover { color:var(--green); }
.article-card p { font-size:14px; line-height:1.75; color:var(--muted); margin:0 0 18px; flex-grow:1; }
.article-card .text-link { font-size:11px; }

/* ---- Article (page individuelle) ---- */
.article-hero { padding-top:64px; padding-bottom:0; }
.article-hero .article-meta { font-size:11px; color:var(--muted); letter-spacing:.04em; text-transform:uppercase; display:flex; gap:14px; align-items:center; }
.article-hero h1 { margin:22px 0 0; font-size:clamp(36px,4.4vw,54px); font-weight:500; line-height:1.12; letter-spacing:-.04em; max-width:820px; }
.article-lede { max-width:640px; margin:26px 0 0; font-size:17px; line-height:1.8; color:var(--muted); }
.article-body { max-width:680px; padding-top:56px; padding-bottom:40px; }
.article-body p { font-size:15px; line-height:1.9; color:#3a3f37; margin:0 0 22px; }
.article-body h2 { font-size:28px; margin:48px 0 18px; }
.article-body a { text-decoration:underline; text-underline-offset:4px; color:var(--ink); }
.article-body a:hover { color:var(--green); }
.article-body ul { padding-left:22px; margin:0 0 22px; color:#3a3f37; font-size:15px; line-height:1.85; }
.article-cta { max-width:680px; margin-bottom:90px; padding:30px 32px; border-radius:10px; background:var(--dark); color:#f2f3e9; }
.article-cta p { margin:0 0 16px; font-size:14px; line-height:1.75; color:#c3cbbd; }
.article-cta a.button { background:var(--accent); color:var(--dark); }
.article-cta a.button:hover { background:#c3da7f; }
.breadcrumb { font-size:11px; color:var(--muted); padding-top:36px; }
.breadcrumb a:hover { color:var(--ink); }

/* ---- Teaser articles (accueil) ---- */
.articles-teaser { border-top:1px solid var(--line); }
.teaser-head { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; }

@media (max-width:1000px) {
  .article-grid { grid-template-columns:1fr 1fr; }
}

@media (max-width:700px) {
  .article-grid { grid-template-columns:1fr; margin-top:36px; }
  .article-body { padding-top:36px; }
  .article-cta { padding:24px; }
  .teaser-head { flex-direction:column; align-items:flex-start; gap:14px; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none!important; }
}