/* Polices hebergees sur le site (licence OFL), aucun appel a Google */
@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(fonts/archivo-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Figtree";font-style:normal;font-weight:300 900;font-display:swap;src:url(fonts/figtree-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Ysmart : vert profond, pêche et ambre. Grotesque large pour les titres. */
:root{
  --ink:#0B1D17; --ink2:#12302A; --peach:#E9944A; --amber:#E9944A; --paper:#F4F1EC; --text:#EDEAE4; --mute:#9DB0A8; --line:rgba(237,234,228,.16);
  --display:"Archivo","Arial Black",Arial,sans-serif;
  --body:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--text);font:400 18px/1.6 var(--body);overflow-x:hidden}
img{max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--peach);outline-offset:3px}
.wrap{max-width:1272px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3{font-family:var(--display);font-stretch:112%;font-weight:800;margin:0;letter-spacing:-.035em;line-height:1.02;text-wrap:balance}
h2{font-size:clamp(2rem,4.4vw,3.8rem)}
.kicker{font:600 13px/1.5 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--peach);display:block}
.s-ink{background:var(--ink)} .s-ink2{background:var(--ink2)}
.s-light{background:var(--paper);color:var(--ink)} .s-light .kicker{color:#9A4F17}
.s-peach{background:var(--peach);color:var(--ink)} .s-peach .kicker{color:var(--ink)}
section.s{padding-block:112px}
@media(max-width:820px){section.s{padding-block:68px}}

/* logo */
.logo{display:inline-flex;align-items:center;gap:.26em;font:700 36px/1 var(--display);font-stretch:100%;letter-spacing:-.035em;text-decoration:none;color:var(--text)}
.logo .lm{height:1.2em;width:1.2em;flex:none;fill:currentColor}
.logo .lm .hl{fill:var(--amber)}
.logo span{padding-bottom:.08em}

/* boutons */
.pill{display:inline-flex;align-items:center;gap:.5em;background:var(--peach);color:var(--ink);font:600 15px/1 var(--body);padding:15px 24px;border-radius:999px;text-decoration:none;border:0;cursor:pointer;transition:transform .15s,background .15s}
.pill:hover{background:#fff;transform:translateY(-1px)}
.pill.ghost{background:none;color:var(--text);border:1.5px solid var(--line)}
.pill.ghost:hover{background:var(--ink2)}
.s-light .pill,.s-peach .pill{background:var(--ink);color:var(--paper)}
.s-light .pill:hover,.s-peach .pill:hover{background:#000}
@media(prefers-reduced-motion:reduce){.pill{transition:none}.pill:hover{transform:none}html{scroll-behavior:auto}}

/* en-tête */
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--ink)}
header.top::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--ink);z-index:31}
.bar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:18px;position:relative}
.menu{display:flex;gap:30px;align-items:center;font-size:15px;font-weight:500}
.menu a{text-decoration:none;color:var(--mute);transition:color .15s}
.menu a:hover,.menu a[aria-current]{color:var(--text)}
.menu a.pill{color:var(--ink);padding:12px 20px}
.menu a.pill:hover{color:var(--ink)}
.burger{display:none;background:none;border:1.5px solid var(--line);color:var(--text);border-radius:999px;padding:10px 16px;font:600 14px/1 var(--body);cursor:pointer}
@media(max-width:1020px){
  .burger{display:inline-block}
  .menu{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;background:var(--ink);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:8px 0 20px}
  .menu a{padding:14px 0;font-size:18px;width:100%}
  .menu a.pill{width:auto;margin-top:12px;padding:14px 22px}
  body.menu-open .menu{display:flex}
}

/* hero accueil */
.hero{padding-block:64px 88px}
.hero h1{font-size:clamp(2.3rem,6vw,5.3rem);max-width:15em;margin-block:22px 40px}
.hero h1 em{font-style:normal;color:var(--peach)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
.hero .big{font:800 clamp(1.4rem,2.4vw,2rem)/1.15 var(--display);font-stretch:108%;letter-spacing:-.025em;margin:0}
.hero .txt p{margin:0 0 16px;color:var(--mute);font-size:18px;max-width:34em}
.hero .acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}
@media(max-width:900px){.hero{padding-block:40px 56px}.hero-grid{grid-template-columns:1fr;gap:28px}}

/* titres de section */
.sh{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:48px;margin-bottom:56px;align-items:end}
.sh p{margin:0;color:var(--mute);max-width:34em;font-size:19px}
.s-light .sh p{color:#44564E}
@media(max-width:900px){.sh{grid-template-columns:1fr;gap:18px;margin-bottom:36px}}

/* expertises */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.card{background:var(--ink);border-radius:20px;padding:32px 30px 30px;display:flex;flex-direction:column;gap:14px;text-decoration:none;transition:transform .2s,box-shadow .2s;box-shadow:inset 0 0 0 1.5px transparent}
.card:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1.5px var(--peach)}
.card h3{font-size:1.55rem;letter-spacing:-.03em;line-height:1.05}
.card .tg{font-weight:600;color:var(--peach);line-height:1.4;font-size:17px}
.card p{margin:0;color:var(--mute);font-size:16px;line-height:1.55}
.card .go{margin-top:auto;padding-top:10px;font-weight:600;font-size:15px;color:var(--text)}
.more{margin-top:32px;display:flex;gap:12px 28px;flex-wrap:wrap;align-items:center}
.more a{font-weight:600;text-decoration:none;border-bottom:1.5px solid var(--peach);padding-bottom:3px}
.more a:hover{color:var(--peach)}
@media(max-width:1000px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.cards{grid-template-columns:1fr}}

/* enjeux (fond clair) */
.enj-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;margin-bottom:64px}
.enj-intro p{margin:0 0 16px;font-size:18px;color:#33443D}
.enj-intro h3{font-size:1.5rem;margin:12px 0 14px;letter-spacing:-.025em}
.enj-intro .conc{font:800 1.3rem/1.2 var(--display);font-stretch:108%;color:#9A4F17;margin-top:20px}
.enj-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1.5px solid var(--ink)}
.enj{padding:30px 28px 34px 0;border-bottom:1px solid rgba(11,29,23,.2)}
.enj h3{font-size:1.35rem;letter-spacing:-.025em;line-height:1.1;margin-bottom:14px}
.enj p{margin:0 0 12px;font-size:16px;color:#33443D}
.enj p:first-of-type{color:var(--ink);font-weight:500}
@media(max-width:1000px){.enj-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){.enj-intro{grid-template-columns:1fr;gap:12px;margin-bottom:40px}.enj-grid{grid-template-columns:1fr}.enj{padding-right:0}}

/* pour qui */
.who{border-top:1px solid var(--line)}
.who-row{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;padding-block:36px;border-bottom:1px solid var(--line)}
.who-row h3{font-size:clamp(1.4rem,2.4vw,2rem);letter-spacing:-.03em}
.who-row p{margin:0 0 12px;color:var(--mute)}
.who-row p:first-child{color:var(--text)}
@media(max-width:820px){.who-row{grid-template-columns:1fr;gap:14px;padding-block:28px}}

/* méthode */
.steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.step{background:var(--ink);border-radius:20px;padding:28px 24px 30px;min-height:300px;display:flex;flex-direction:column;justify-content:flex-start;gap:44px}
.step .n{font:800 15px/1 var(--display);font-stretch:118%;color:var(--amber);letter-spacing:.04em}
.step h3{font-size:1.35rem;margin-bottom:12px;letter-spacing:-.03em;line-height:1.08}
.step p{margin:0;color:var(--mute);font-size:15.5px;line-height:1.55}
.m-end{margin:40px 0 0;font:500 clamp(1.1rem,1.8vw,1.4rem)/1.4 var(--display);font-stretch:105%;max-width:36em}
@media(max-width:1100px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}.step{min-height:0}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}

/* références */
.refs h2{max-width:14em;margin-bottom:28px}
.refs .lead{font-size:19px;max-width:38em;margin:0 0 20px;color:var(--mute)}
.refnames{list-style:none;margin:36px 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px;font:800 clamp(1.5rem,3.4vw,3rem)/1.15 var(--display);font-stretch:112%;letter-spacing:-.035em}
.refnames li:not(:last-child)::after{content:"";display:inline-block;width:.2em;height:.2em;border-radius:50%;background:var(--amber);margin-left:14px;vertical-align:middle}
.refs p.end{margin:0 0 16px;color:var(--mute);max-width:38em}

/* Ambre */
.amb-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:80px;align-items:start}
.arch{position:relative;aspect-ratio:4/5;max-width:500px;width:100%;border-radius:999px 999px 14px 14px;overflow:hidden;background:var(--amber);position:sticky;top:110px}
.arch img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:68% 40%;display:block}
.arch::after{content:"";position:absolute;inset:auto 0 0 0;height:38%;background:linear-gradient(to top,rgba(11,29,23,.88),transparent)}
.arch .cap{position:absolute;left:22px;right:22px;bottom:20px;z-index:2;color:var(--text);display:grid;gap:4px}
.arch .cap b{font:800 20px/1.1 var(--display);font-stretch:112%;letter-spacing:-.02em;text-transform:uppercase}
.arch .cap span{font:600 13px/1.4 var(--body);letter-spacing:.06em}
.amb h2{font-size:clamp(1.9rem,3.8vw,3.3rem);margin-block:16px 28px}
.amb p{font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.6;margin:0 0 18px;max-width:36em}
@media(max-width:900px){.amb-grid{grid-template-columns:1fr;gap:36px}.arch{position:relative;top:0;max-width:420px}}

/* FAQ */
.faq{border-top:1px solid var(--line);max-width:900px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:24px 56px 24px 0;font:700 clamp(1.1rem,1.8vw,1.4rem)/1.25 var(--display);font-stretch:106%;letter-spacing:-.02em;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);font:400 32px/1 var(--body);color:var(--peach);transition:transform .2s}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq details p{margin:0 0 26px;color:var(--mute);max-width:44em}

/* contact (fond clair) */
.close h2{font-size:clamp(2.2rem,5.6vw,4.8rem);max-width:13em}
.close-row{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:start;margin-top:48px}
.close-row .txt p{margin:0 0 16px;font-size:19px;color:#33443D;max-width:28em}
.cf{display:grid;gap:22px}
.cf .f2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.cf label{display:grid;gap:8px;font:600 13px/1.2 var(--body);letter-spacing:.1em;text-transform:uppercase;color:#33443D}
.cf input,.cf select,.cf textarea{font:400 18px/1.4 var(--body);letter-spacing:0;text-transform:none;color:var(--ink);background:transparent;border:0;border-bottom:1.5px solid var(--ink);border-radius:0;padding:10px 0;width:100%}
.cf textarea{resize:vertical;min-height:120px}
.cf select{appearance:none;-webkit-appearance:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%230B1D17' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 4px center}
.cf input:focus,.cf select:focus,.cf textarea:focus{outline:0;border-bottom-color:#C9702C;box-shadow:0 1.5px 0 #C9702C}
.cf .invalid{border-bottom-color:#B3261E}
.cf .opt{text-transform:none;letter-spacing:0;font-weight:400;color:#5b6a63}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cf-act{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.cf-st{font-size:16px;color:#33443D}
.cf-st.err{color:#B3261E}
@media(max-width:900px){.close-row{grid-template-columns:1fr;gap:28px}.cf .f2{grid-template-columns:1fr}}

/* pages internes */
.phero{padding-block:56px 64px}
.crumb{font:500 14px/1.4 var(--body);color:var(--mute);margin-bottom:28px}
.crumb a{text-decoration:none;border-bottom:1px solid var(--line)} .crumb a:hover{color:var(--peach)}
.phero h1{font-size:clamp(2rem,4.8vw,4.2rem);max-width:17em;margin-block:18px 32px}
.phero .lead{font:800 clamp(1.3rem,2.2vw,1.8rem)/1.2 var(--display);font-stretch:108%;letter-spacing:-.025em;color:var(--peach);margin:0;max-width:26em}
.pbody{padding-block:20px 100px}
.pintro{display:grid;grid-template-columns:minmax(0,.55fr) minmax(0,1fr);gap:56px;padding-block:44px;border-top:1px solid var(--line)}
.pintro p,.pb p{margin:0 0 16px;font-size:19px;max-width:36em}
.pb{display:grid;grid-template-columns:minmax(0,.55fr) minmax(0,1fr);gap:56px;padding-block:44px;border-top:1px solid var(--line)}
.pb h2{font-size:clamp(1.5rem,2.4vw,2.1rem);letter-spacing:-.03em}
.plist{list-style:none;margin:0;padding:0;display:grid;gap:0}
.plist li{padding:16px 0 16px 34px;border-bottom:1px solid var(--line);position:relative;font-size:18px}
.plist li:first-child{border-top:1px solid var(--line)}
.plist li::before{content:"";position:absolute;left:0;top:26px;width:16px;height:2px;background:var(--amber)}
.others{display:flex;flex-wrap:wrap;gap:10px}
.others a{padding:12px 18px;border:1.5px solid var(--line);border-radius:999px;text-decoration:none;font-size:15px;font-weight:500;transition:background .15s,border-color .15s}
.others a:hover{background:var(--peach);border-color:var(--peach);color:var(--ink)}
@media(max-width:820px){.pintro,.pb{grid-template-columns:1fr;gap:18px;padding-block:32px}.phero{padding-block:36px 40px}}

/* pied de page */
footer.ft{border-top:1px solid var(--line);padding-block:64px 36px;color:var(--mute);font-size:15px}
.ft-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,.7fr);gap:48px;margin-bottom:48px}
.ft p{margin:14px 0 0;max-width:36em}
.ft h4{font:600 13px/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--peach);margin:0 0 14px}
.ft ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ft a{text-decoration:none} .ft a:hover{color:var(--text)}
.ft-bot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:24px;border-top:1px solid var(--line);font-size:14px}
.ft-bot nav{display:flex;gap:20px;flex-wrap:wrap}
@media(max-width:820px){.ft-grid{grid-template-columns:1fr;gap:32px}}