/* La Savane · feuille de style */
:root{
  --sage:#C7D5BB; --sage-l:#E4EADA; --sky:#E6E4BF; --sun:#F5DD9C; --sun-l:#FBEFCB;
  --terra:#B4532A; --terra-d:#8F3E1C; --blue:#2C6E8A;
  --ivory:#FCF5E3; --paper:#FFFAEE; --ink:#2E1C10; --ink-2:#4A3422; --muted:#6E5A43; --line:#E5D3A8;
  --gold:#C08A37; --gold-2:#E2B86A; --gold-3:#9A6A26;
  --deep:#3A2414; --deep-2:#4A2E1A; --cream:#F6EAD2; --cream-2:#D9C6A4;
  --wa:#2B5E46;
  --bg:var(--ivory); --surface:var(--paper); --text:var(--ink);
  --serif:'Cormorant Garamond',Garamond,'Times New Roman',serif;
  --deco:'Cinzel Decorative','Cinzel',Georgia,serif;
  --script:'Great Vibes','Brush Script MT',cursive;
  --sans:'Jost','Helvetica Neue',Arial,sans-serif;
  --goldtext:linear-gradient(180deg,#E7C27A 0%,#C8913A 55%,#9A6A26 100%);
  --skygrad:linear-gradient(180deg,#C9D7BD 0%,#E6E4BF 48%,#F6DE9E 100%);
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
/* Le site garde sa palette de marque claire, même en mode sombre */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --bg:#FCF5E3; --surface:#FFFAEE; --text:#2E1C10; --ink:#2E1C10; --ink-2:#4A3422; --muted:#6E5A43; --line:#E5D3A8; color-scheme:light; }
}
:root[data-theme="dark"]{ --bg:#FCF5E3; --surface:#FFFAEE; --text:#2E1C10; --ink:#2E1C10; --ink-2:#4A3422; --muted:#6E5A43; --line:#E5D3A8; color-scheme:light; }
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 120px); scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }
*,*::before,*::after{box-sizing:border-box}
body{margin:0; background:var(--bg); color:var(--text); font-family:var(--sans); font-weight:400; font-size:17px; line-height:1.7; -webkit-font-smoothing:antialiased}
img{max-width:100%; height:auto; display:block}
a{color:inherit}
button{font:inherit; color:inherit; cursor:pointer}
:focus-visible{outline:2px solid var(--gold); outline-offset:3px}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px}
h1,h2,h3{font-family:var(--serif); font-weight:500; line-height:1.1; margin:0; letter-spacing:-.005em}
h2{font-size:clamp(34px,4vw,50px)}
h3{font-weight:600}
p{margin:0}
section{padding:104px 0}
.eyebrow{font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.28em; text-transform:uppercase; color:var(--gold-3); margin-bottom:18px; display:flex; align-items:center; gap:14px}
.eyebrow::before{content:""; width:28px; height:1px; background:currentColor}
.lead-muted{color:var(--muted); max-width:60ch; font-size:18px; font-weight:300; margin-top:18px}
.note{margin-top:28px; color:var(--muted); font-size:15px}
.note a{color:var(--gold-3); text-decoration:underline; text-underline-offset:4px}
.skip{position:absolute; left:-999px; top:8px; background:var(--ink); color:var(--ivory); padding:10px 16px; z-index:100}
.skip:focus{left:8px}

/* Logo texte, identique au visuel */
.mark{display:inline-flex; align-items:baseline; gap:6px; text-decoration:none; line-height:1}
.mark .la,.mark .sv{background:var(--goldtext); -webkit-background-clip:text; background-clip:text; color:transparent}
.mark .la{font-family:var(--script); font-size:38px; padding:0 2px}
.mark .sv{font-family:var(--deco); font-weight:700; font-size:26px; letter-spacing:.02em}

/* Boutons */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:15px 28px; border-radius:0; font-family:var(--sans); font-weight:500; font-size:13px; letter-spacing:.16em; text-transform:uppercase; text-decoration:none; border:1px solid transparent; line-height:1.2; background:none; transition:background .2s, color .2s, border-color .2s}
.btn svg{width:17px; height:17px; flex:none}
.btn-gold{background:var(--ink); color:var(--ivory); border-color:var(--ink)}
.btn-gold:hover{background:var(--gold-3); border-color:var(--gold-3)}
.btn-line{border-color:var(--ink); color:var(--ink)}
.btn-line:hover{background:var(--ink); color:var(--ivory)}
.btn-wa{background:var(--wa); color:#fff; border-color:var(--wa)}
.btn-wa:hover{background:#1F4734}
.btn-dark{border-color:var(--ink); color:var(--ink)}
.btn-dark:hover{background:var(--ink); color:var(--ivory)}
.row-btns{display:flex; flex-wrap:wrap; gap:14px; margin-top:32px}
.link-arrow{display:inline-block; margin-top:28px; font-size:13px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-3); text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:4px}
.link-arrow:hover{color:var(--ink)}

/* Barre des métiers */
.universe{background:var(--deep); color:var(--cream-2); font-size:12px; letter-spacing:.14em; text-transform:uppercase}
.universe .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:42px; flex-wrap:wrap}
.universe .we{margin:0}
.universe .we strong{color:var(--gold-2); font-weight:500}
.universe nav{display:flex; gap:28px; flex-wrap:wrap}
.universe nav a{text-decoration:none; color:var(--cream)}
.universe nav a:hover,.universe nav a[aria-current="page"]{color:var(--gold-2)}
@media (max-width:760px){ .universe .wrap{justify-content:center; padding-top:10px; padding-bottom:10px; text-align:center} .universe nav{gap:16px; justify-content:center} }

/* En-tête */
.top{position:sticky; top:env(safe-area-inset-top,0px); z-index:30; background:color-mix(in srgb,var(--bg) 94%,transparent); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border-bottom:1px solid var(--line)}
.top .wrap{display:flex; align-items:center; justify-content:space-between; gap:20px; height:84px}
.nav{display:flex; align-items:center; gap:34px}
.nav a.link{text-decoration:none; font-size:13px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-2); white-space:nowrap; padding:6px 0; border-bottom:1px solid transparent}
.nav a.link:hover,.nav a.link[aria-current="page"]{color:var(--gold-3); border-bottom-color:var(--gold)}
.nav .btn{padding:12px 20px; white-space:nowrap}
.sel-btn{display:inline-flex; align-items:center; gap:8px; padding:9px 12px; border:1px solid var(--line); background:none; color:var(--ink-2); font-size:13px}
.sel-btn:hover{border-color:var(--gold); color:var(--gold-3)}
.sel-btn svg{width:17px; height:17px}
.sel-btn .count{min-width:20px; height:20px; border-radius:999px; background:var(--gold); color:#fff; display:inline-grid; place-items:center; font-size:11px; padding:0 6px}
.burger{display:none; border:1px solid var(--line); background:none; color:var(--ink); width:44px; height:42px; place-items:center}
.burger svg{width:22px; height:22px}
.mnav{display:none; border-top:1px solid var(--line); background:var(--bg)}
.mnav.open{display:block}
.mnav ul{list-style:none; margin:0; padding:8px 28px 22px}
.mnav a{display:block; padding:14px 0; text-decoration:none; font-size:14px; letter-spacing:.14em; text-transform:uppercase; border-bottom:1px solid var(--line)}
@media (max-width:1020px){ .nav .link{display:none} .burger{display:grid} }
@media (min-width:1021px){ .mnav.open{display:none} }
@media (max-width:560px){ .nav .btn-gold{display:none} .mark .sv{font-size:22px} .mark .la{font-size:32px} }

/* Accueil */
.hero{padding:0; background:var(--bg)}
.hero .wrap{display:grid; grid-template-columns:1.15fr .85fr; gap:80px; align-items:center; padding-top:96px; padding-bottom:110px}
.hero h1{font-size:clamp(46px,6vw,78px); font-weight:400; line-height:1.02; color:var(--ink); margin:0 0 28px}
.hero h1 em{font-style:italic; color:var(--gold-3)}
.hero p.lead{font-size:19px; font-weight:300; color:var(--muted); max-width:46ch}
.hero .actions{display:flex; flex-wrap:wrap; gap:14px; margin-top:40px}
.hero figure{margin:0; justify-self:end; width:100%; max-width:380px; padding:14px; border:1px solid var(--gold-2); background:var(--surface)}
.hero figure img{width:100%}
@media (max-width:900px){ .hero .wrap{grid-template-columns:1fr; gap:48px; padding-top:56px; padding-bottom:72px} .hero figure{justify-self:start; max-width:280px} }

/* Bandeau des métiers */
.trades{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--surface)}
.trades .wrap{display:grid; grid-template-columns:repeat(4,1fr)}
.trades div{padding:30px 28px; border-left:1px solid var(--line)}
.trades div:first-child{border-left:0; padding-left:0}
.trades strong{display:block; font-family:var(--serif); font-size:24px; font-weight:600; color:var(--ink)}
.trades span{font-size:15px; font-weight:300; color:var(--muted)}
@media (max-width:900px){ .trades .wrap{grid-template-columns:1fr 1fr} .trades div{padding:22px 16px 22px 0; border-left:0; border-top:1px solid var(--line)} }

/* Espaces professionnels */
.choose{padding-bottom:56px}
.unis{display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:52px}
.uni{display:block; text-decoration:none; color:var(--ink)}
.uni img{width:100%; aspect-ratio:4/5; object-fit:cover; transition:opacity .3s}
.uni:hover img{opacity:.88}
.uni span{display:block; padding-top:22px; border-top:1px solid var(--gold); margin-top:18px}
.uni strong{display:block; font-family:var(--serif); font-size:30px; font-weight:500; line-height:1.1}
.uni small{display:block; font-size:15px; font-weight:300; color:var(--muted); margin-top:6px}
.uni em{display:inline-block; margin-top:16px; font-style:normal; font-size:12px; font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-3)}
@media (max-width:900px){ .unis{grid-template-columns:1fr; gap:40px} .uni img{aspect-ratio:16/10} }

/* Familles */
.families{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin-top:52px}
a.family{display:block; text-decoration:none; color:var(--ink); position:relative}
.family img,.family .noimg{width:100%; aspect-ratio:1/1; object-fit:cover}
.family .noimg{display:grid; place-items:center; text-align:center; background:var(--deep-2); color:var(--gold-2); font-family:var(--serif); font-style:italic; font-size:22px; padding:20px}
.family span{display:block; padding-top:16px}
.family strong{display:block; font-family:var(--serif); font-size:24px; font-weight:600}
.family small{font-size:14px; font-weight:300; color:var(--muted)}
.family:hover strong{color:var(--gold-3)}
@media (max-width:900px){ .families{grid-template-columns:1fr 1fr} }

/* Sections sombres */
.partner{background:var(--deep); color:var(--cream)}
.partner h2,.partner h3{color:#F6EFE2}
.partner .eyebrow{color:var(--gold-2)}
.partner .lead-muted{color:var(--cream-2)}
.partner .link-arrow{color:var(--gold-2)}
.teaser{display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center}
.teaser .pics{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.teaser .pics img{width:100%; aspect-ratio:3/4; object-fit:cover}
.teaser .pics img:last-child{margin-top:48px}
@media (max-width:900px){ .teaser{grid-template-columns:1fr; gap:40px} }
.pledges{display:grid; grid-template-columns:repeat(3,1fr); gap:40px; margin-top:0}
.pledges div{border-top:1px solid var(--gold); padding-top:22px}
.pledges strong{display:block; font-family:var(--serif); font-size:26px; font-weight:500; color:#F6EFE2}
.pledges span{color:var(--cream-2); font-weight:300}
.ggroup{margin-top:80px}
.ggroup h3{font-family:var(--serif); font-size:34px; font-weight:500; margin-bottom:24px}
.gallery{display:grid; gap:18px}
.g-bissap{grid-template-columns:2fr 1fr 1fr}
.g-cajou{grid-template-columns:1fr 1fr}
.gallery .full{grid-column:1/-1}
.gallery figure{margin:0; position:relative; overflow:hidden; height:360px}
.gallery img{width:100%; height:100%; object-fit:cover}
.gallery figcaption{position:absolute; left:0; right:0; bottom:0; padding:40px 18px 14px; font-size:12px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:#fff; background:linear-gradient(transparent,rgba(15,11,8,.75))}
.g-detail{grid-template-columns:minmax(0,560px)}
.gallery.g-detail figure{height:auto; aspect-ratio:466/490}
@media (max-width:900px){ .pledges{grid-template-columns:1fr; gap:28px} .g-bissap,.g-cajou{grid-template-columns:1fr 1fr} .gallery figure{height:230px} .gallery .wide{grid-column:1/-1} }

/* Services */
.svc-wide{display:grid; grid-template-columns:repeat(4,1fr); margin-top:52px; border-top:1px solid var(--ink)}
.svc{padding:30px 26px 10px 0}
.svc + .svc{padding-left:26px; border-left:1px solid var(--line)}
.svc .num{font-family:var(--serif); font-style:italic; font-size:20px; color:var(--gold)}
.svc h3{font-size:26px; margin:6px 0 10px}
.svc p{color:var(--muted); font-size:16px; font-weight:300}
@media (max-width:900px){ .svc-wide{grid-template-columns:1fr 1fr} .svc,.svc + .svc{padding:24px 14px 20px 0; border-left:0; border-bottom:1px solid var(--line)} }

/* En-tête de page intérieure */
.page-hero{padding:72px 0 76px; border-bottom:1px solid var(--line)}
.page-hero .wrap{display:grid; grid-template-columns:1fr auto; gap:72px; align-items:center}
.page-hero h1{font-size:clamp(42px,5.2vw,68px); font-weight:400; line-height:1.04; margin:0 0 22px}
.page-hero p.lead{font-size:19px; font-weight:300; color:var(--muted); max-width:54ch}
.page-hero .pic{width:380px; aspect-ratio:4/5; overflow:hidden}
.page-hero .pic img{width:100%; height:100%; object-fit:cover}
.page-hero .btn-line{border-color:var(--ink); color:var(--ink)}
@media (max-width:900px){ .page-hero .wrap{grid-template-columns:1fr; gap:40px} .page-hero .pic{width:100%; max-width:460px; aspect-ratio:4/3} }
.crumbs{font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-bottom:28px}
.crumbs a{color:var(--muted); text-decoration:none}
.crumbs a:hover{color:var(--gold-3)}
.crumbs span[aria-hidden]{margin:0 10px; color:var(--gold)}

/* Espace métier */
.space-body{display:grid; grid-template-columns:.85fr 1.15fr; gap:72px}
.space-body h2{font-size:36px !important}
.offer-list{list-style:none; margin:0; padding:0; border-top:1px solid var(--ink)}
.offer-list li{padding:20px 0; border-bottom:1px solid var(--line); color:var(--muted); font-weight:300}
.offer-list li strong{display:block; font-family:var(--serif); font-size:22px; font-weight:600; color:var(--ink); margin-bottom:2px}
.ideas-box{grid-column:1/-1; background:var(--surface); border:1px solid var(--line); padding:40px 44px}
.ideas-box h3{font-size:32px; font-weight:500; margin-bottom:22px}
.ideas-box ul{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:18px 48px; color:var(--muted); font-weight:300}
.ideas-box strong{display:block; font-family:var(--serif); font-size:21px; font-weight:600; color:var(--ink)}
@media (max-width:900px){ .space-body{grid-template-columns:1fr; gap:56px} .ideas-box{padding:28px} .ideas-box ul{grid-template-columns:1fr} }

/* Vignettes produit */
.mini-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:24px}
.mini{display:block; text-decoration:none; color:var(--ink)}
.mini .ph{aspect-ratio:1/1; background:var(--deep-2); position:relative; overflow:hidden}
.mini .ph img{width:100%; height:100%; object-fit:cover}
.mini .ph .noimg{position:absolute; inset:0; display:grid; place-items:center; text-align:center; padding:12px; color:var(--gold-2); font-family:var(--serif); font-style:italic; font-size:19px}
.mini strong{display:block; font-family:var(--serif); font-size:20px; font-weight:600; margin-top:12px; line-height:1.2}
.mini small{display:block; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-3); margin-top:4px}
a.mini:hover strong{color:var(--gold-3)}

/* Catalogue */
.catalog-sec{padding-top:56px}
.toolbar{display:flex; flex-wrap:wrap; gap:18px; align-items:center; justify-content:space-between; padding-bottom:22px; border-bottom:1px solid var(--line)}
.chips{display:flex; flex-wrap:wrap; gap:6px 26px}
.chip{border:0; background:none; padding:6px 0; font-size:13px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); border-bottom:1px solid transparent}
.chip:hover{color:var(--ink)}
.chip[aria-pressed="true"]{color:var(--ink); border-bottom-color:var(--gold)}
.search{position:relative; flex:0 1 300px}
.search input{width:100%; font:inherit; font-size:15px; font-weight:300; padding:10px 4px 10px 30px; border:0; border-bottom:1px solid var(--ink-2); background:transparent; color:var(--text)}
.search input:focus{outline:none; border-bottom-color:var(--gold)}
.search svg{position:absolute; left:2px; top:50%; transform:translateY(-50%); width:17px; height:17px; color:var(--muted)}
.results{font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-top:22px}
.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:48px 28px; margin-top:28px}
.card{display:flex; flex-direction:column}
.card[hidden]{display:none}
.card .ph{aspect-ratio:1/1; background:var(--deep-2); position:relative; overflow:hidden}
.card .ph img{width:100%; height:100%; object-fit:cover}
.card .ph .noimg{position:absolute; inset:0; display:grid; place-items:center; color:var(--gold-2); font-family:var(--serif); font-style:italic; font-size:24px; padding:16px; text-align:center}
.fav{position:absolute; top:14px; right:14px; width:40px; height:40px; border-radius:50%; border:0; background:rgba(255,253,248,.95); display:grid; place-items:center; color:var(--gold-3)}
.fav svg{width:18px; height:18px}
.fav[aria-pressed="true"] svg path{fill:var(--gold-3)}
.card .body{padding-top:18px; display:flex; flex-direction:column; gap:8px; flex:1}
.card .fam{font-size:11px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-3)}
.card h3{font-size:26px; font-weight:500}
.card p{color:var(--muted); font-size:15px; font-weight:300}
.tags{display:flex; flex-wrap:wrap; gap:4px 16px; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-2)}
.tags span + span::before{content:"·"; margin-right:16px; color:var(--gold)}
.card .acts{margin-top:auto; padding-top:12px}
.card .acts a{font-size:12px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--gold); padding-bottom:3px}
.card .acts a:hover{color:var(--gold-3)}
.empty{padding:40px 0; color:var(--muted)}

/* Contact */
.contact-cards{display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--ink); border-bottom:1px solid var(--line)}
.contact-cards a{display:block; padding:26px 26px 26px 0; text-decoration:none}
.contact-cards a + a{padding-left:26px; border-left:1px solid var(--line)}
.contact-cards strong{display:block; font-family:var(--serif); font-size:24px; font-weight:600}
.contact-cards span{color:var(--muted); font-weight:300; font-size:15px}
.contact-cards a:hover strong{color:var(--gold-3)}
@media (max-width:900px){ .contact-cards{grid-template-columns:1fr} .contact-cards a,.contact-cards a + a{padding:20px 0; border-left:0; border-bottom:1px solid var(--line)} }
.contact-grid{display:grid; grid-template-columns:1.2fr .8fr; gap:48px; align-items:start}
@media (max-width:900px){ .contact-grid{grid-template-columns:1fr} }
.panel{background:var(--surface); border:1px solid var(--line); padding:44px}
.panel h2{font-size:34px !important}
.small{font-size:14px; font-weight:300; color:var(--muted); margin-top:16px}
.field{display:flex; flex-direction:column; gap:8px; margin-bottom:22px}
.field label{font-size:11px; font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-2)}
.field input,.field select,.field textarea{font:inherit; font-size:16px; font-weight:300; color:var(--text); background:transparent; border:0; border-bottom:1px solid var(--cream-2); border-radius:0; padding:10px 0; width:100%}
.field select{appearance:none; -webkit-appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%); background-position:calc(100% - 12px) 55%,calc(100% - 7px) 55%; background-size:5px 5px; background-repeat:no-repeat}
.field textarea{min-height:110px; resize:vertical; border:1px solid var(--line); padding:12px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--gold)}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:28px}
@media (max-width:640px){ .grid2{grid-template-columns:1fr; gap:0} .panel{padding:28px} }
.callback{background:var(--deep); color:var(--cream); padding:44px}
.callback h3{font-family:var(--serif); font-size:34px; font-weight:500; color:#F6EFE2}
.callback p{color:var(--cream-2); font-weight:300; font-size:15px; margin:10px 0 28px}
.callback .field label{color:var(--cream-2)}
.callback .field input,.callback .field select{color:#F6EFE2; border-bottom-color:#5A4D3F}
.callback .field select option{color:#1F1A14}
.callback .btn-gold{background:var(--gold); border-color:var(--gold); color:#1F1A14}
.callback .btn-gold:hover{background:var(--gold-2); border-color:var(--gold-2)}
@media (max-width:640px){ .callback{padding:28px} }

/* Magasins */
.shops-sec{padding-top:72px}
.shops{display:grid; grid-template-columns:1fr 1fr; gap:28px}
.shop{border:1px solid var(--line); background:var(--surface); padding:44px}
.shop h2{font-size:42px !important; font-weight:400}
.shop address{font-style:normal; font-size:18px; font-weight:300; margin:14px 0 26px; color:var(--muted)}
.shop a{font-size:12px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--gold); padding-bottom:3px}
@media (max-width:900px){ .shops{grid-template-columns:1fr} .shop{padding:30px} }

/* Bandeau final */
.cta3{background:var(--deep-2); color:var(--cream)}
.cta3 .wrap{display:grid; grid-template-columns:repeat(3,1fr)}
.cta3 a{display:block; padding:48px 32px; text-decoration:none; border-left:1px solid #3A3027}
.cta3 a:first-child{border-left:0; padding-left:0}
.cta3 strong{display:block; font-family:var(--serif); font-size:28px; font-weight:500; color:#F6EFE2}
.cta3 span{color:var(--cream-2); font-weight:300; font-size:15px; display:block; margin:8px 0 18px}
.cta3 em{font-style:normal; font-size:12px; font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-2)}
.cta3 a:hover strong{color:var(--gold-2)}
@media (max-width:900px){ .cta3 .wrap{grid-template-columns:1fr} .cta3 a,.cta3 a:first-child{padding:30px 0; border-left:0; border-top:1px solid #3A3027} }

footer{background:var(--deep); color:var(--cream); padding:72px 0 44px}
.fcols{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px}
.fcols h4{font-family:var(--sans); font-size:11px; font-weight:500; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-2); margin:0 0 18px}
.fcols ul{list-style:none; margin:0; padding:0; display:grid; gap:10px; font-size:15px; font-weight:300}
.fcols a{text-decoration:none; color:var(--cream)}
.fcols a:hover{color:var(--gold-2)}
.fcols p{color:var(--cream-2); font-size:15px; font-weight:300; margin-top:16px; max-width:34ch}
footer .mark .la{font-size:44px}
footer .mark .sv{font-size:30px}
.legal{margin-top:56px; padding-top:24px; border-top:1px solid #3A3027; font-size:12px; letter-spacing:.08em; color:#8E826F}
@media (max-width:900px){ .fcols{grid-template-columns:1fr 1fr} }

/* Sélection */
.drawer{position:fixed; inset:0; z-index:50; display:none}
.drawer.open{display:block}
.drawer .scrim{position:absolute; inset:0; background:rgba(15,11,8,.5)}
.drawer aside{position:absolute; top:0; right:0; bottom:0; width:min(440px,100%); background:var(--bg); color:var(--text); display:flex; flex-direction:column; padding:calc(env(safe-area-inset-top,0px) + 32px) 32px calc(env(safe-area-inset-bottom,0px) + 28px)}
.drawer header{display:flex; align-items:center; justify-content:space-between}
.drawer h3{font-size:34px; font-weight:500}
.drawer .close{border:0; background:none; font-size:30px; line-height:1; padding:4px 8px; color:var(--muted)}
.drawer .intro{color:var(--muted); font-weight:300; font-size:15px; margin:10px 0 22px}
.drawer ul{list-style:none; margin:0; padding:0; overflow:auto; flex:1; border-top:1px solid var(--ink)}
.drawer li{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 0; border-bottom:1px solid var(--line); font-family:var(--serif); font-size:20px; font-weight:600}
.drawer li button{border:0; background:none; font-family:var(--sans); color:var(--gold-3); font-size:11px; font-weight:500; letter-spacing:.16em; text-transform:uppercase}
.drawer .none{font-family:var(--sans); font-weight:300; font-size:15px; color:var(--muted); padding:20px 0}
.drawer .foot{display:grid; gap:10px; padding-top:22px}

/* Pages légales et 404 */
.legal-text{max-width:760px}
.legal-text h2{font-size:30px; margin:44px 0 12px}
.legal-text p{color:var(--muted); font-weight:300}
.todo{background:#F6E7BF; color:#5A4300; padding:1px 6px; font-weight:500}
.notfound{text-align:center; padding:140px 0}
.notfound .eyebrow{justify-content:center}
.notfound h1{font-size:clamp(42px,6vw,72px); font-weight:400}
.notfound p{color:var(--muted); font-weight:300; margin:18px 0 32px}

/* Mode aperçu */
body[data-bundle] .page{display:none}
body[data-bundle] .page.active{display:block}
h1,h2,h3,.mini strong,.drawer li,.svc .num{font-variant-numeric:lining-nums}

/* ===== Couleurs inspirées du visuel ===== */
.mark .la{padding:.12em .14em .1em .28em; margin-left:-.28em; line-height:1.15}
.mark .sv{padding:.08em .04em}
.btn-gold{background:var(--terra); border-color:var(--terra); color:#fff}
.btn-gold:hover{background:var(--terra-d); border-color:var(--terra-d); color:#fff}
.btn-line,.btn-dark{border-color:var(--ink); color:var(--ink); background:rgba(255,250,238,.55)}
.btn-line:hover,.btn-dark:hover{background:var(--ink); color:var(--paper)}
.top{background:rgba(252,245,227,.94)}
.hero{background:var(--skygrad)}
.hero h1 em{color:var(--terra)}
.hero figure{background:var(--paper); border-color:var(--gold)}
.page-hero{background:var(--skygrad); border-bottom:0}
.page-hero .btn-line{background:rgba(255,250,238,.6)}
.trades{background:var(--paper)}
.choose{background:var(--sage-l)}
.tint-gold{background:var(--sun-l)}
.tint-sage{background:var(--sage-l)}
.eyebrow{color:var(--terra)}
.uni em,.card .fam,.mini small{color:var(--terra)}
.link-arrow{color:var(--terra)}
.note a{color:var(--blue)}
.chip[aria-pressed="true"]{border-bottom-color:var(--terra)}
.card .acts a{border-bottom-color:var(--terra)}
.fav{color:var(--terra)}
.fav[aria-pressed="true"] svg path{fill:var(--terra)}
.sel-btn .count{background:var(--terra)}
.svc .num{color:var(--terra)}
.shop a{border-bottom-color:var(--terra)}
.universe{background:var(--deep)}
.partner,.callback,footer{background:var(--deep)}
.cta3{background:var(--deep-2)}
.callback .btn-gold{background:var(--sun); border-color:var(--sun); color:var(--ink)}
.callback .btn-gold:hover{background:#fff; border-color:#fff}
.family .noimg,.card .ph .noimg,.mini .ph .noimg,.family .noimg{background:var(--sage); color:var(--deep)}
.card .ph,.mini .ph{background:var(--sage)}
.crumbs span[aria-hidden]{color:var(--terra)}

/* Carte du monde */
.world{background:var(--paper); border-bottom:1px solid var(--line)}
.world-head{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:end}
.world-head h2 em{font-style:italic; color:var(--terra)}
.world-head .lead-muted{margin-top:0}
.map-wrap{position:relative; margin-top:56px}
.worldmap{width:100%; height:auto; display:block}
.worldmap .land circle{fill:#C9D3BC}
.worldmap .fr .pin{fill:var(--terra); stroke:#fff; stroke-width:4}
.worldmap .fr .pulse{fill:none; stroke:var(--terra); stroke-width:3; transform-origin:0 0; animation:pulse 2.6s ease-out infinite}
.worldmap .fr .p2{animation-delay:1.3s}
@keyframes pulse{0%{transform:scale(.6); opacity:.9}100%{transform:scale(3.2); opacity:0}}
@media (prefers-reduced-motion: reduce){ .worldmap .fr .pulse{animation:none; opacity:.35; transform:scale(1.8)} }
.map-tag{position:absolute; left:calc(50.6% + 22px); top:calc(24% - 70px); background:var(--ink); color:var(--paper); padding:10px 16px; display:flex; align-items:baseline; gap:10px; white-space:nowrap}
.map-tag .dot{width:8px; height:8px; border-radius:50%; background:var(--terra); align-self:center}
.map-tag strong{font-family:var(--serif); font-size:20px; font-weight:600}
.map-tag small{font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-2)}
.world-facts{display:grid; grid-template-columns:repeat(3,1fr); margin-top:48px; border-top:1px solid var(--ink)}
.world-facts div{padding:24px 24px 0 0}
.world-facts div + div{padding-left:24px; border-left:1px solid var(--line)}
.world-facts strong{display:block; font-family:var(--serif); font-size:24px; font-weight:600}
.world-facts span{color:var(--muted); font-weight:300; font-size:16px}
@media (max-width:900px){
  .world-head{grid-template-columns:1fr; gap:20px}
  .map-tag{left:auto; right:0; top:-14px; padding:8px 12px}
  .map-tag strong{font-size:17px}
  .world-facts{grid-template-columns:1fr}
  .world-facts div,.world-facts div + div{padding:20px 0; border-left:0; border-bottom:1px solid var(--line)}
}
.worldmap .land circle{fill:#B7C4A6}
@media (max-width:900px){
  .map-wrap{margin-top:36px}
  .map-tag{position:static; display:inline-flex; margin-top:16px}
}

.worldmap .africa circle{fill:var(--gold)}
.map-legend{display:flex; align-items:center; gap:10px; margin-top:18px; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted)}
.map-legend span{width:12px; height:12px; border-radius:50%; display:inline-block}
.map-legend .sw-fr{background:var(--terra)}
.map-legend .sw-af{background:var(--gold); margin-left:14px}

/* Carte en couleurs */
.worldmap .r-am circle{fill:#7FA8B8}
.worldmap .r-eu circle{fill:#9BB487}
.worldmap .r-as circle{fill:#E2A77B}
.worldmap .r-oc circle{fill:#86B9AC}
.worldmap .r-af circle{fill:#C8902F; r:5.2px}
.map-legend .sw-af{background:#C8902F}

/* Barre de recherche */
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.hsearch{position:relative; flex:1 1 260px; max-width:320px; display:flex; align-items:center; border:1px solid var(--line); background:var(--paper); height:42px}
.hsearch:focus-within{border-color:var(--gold)}
.hsearch svg{width:17px; height:17px; margin-left:12px; color:var(--muted); flex:none}
.hsearch input{flex:1; min-width:0; border:0; background:transparent; font:inherit; font-size:14px; font-weight:300; color:var(--ink); padding:0 10px; height:100%}
.hsearch input:focus{outline:none}
.hsearch button{border:0; border-left:1px solid var(--line); background:none; height:100%; padding:0 14px; font-size:11px; font-weight:500; letter-spacing:.16em; color:var(--terra)}
.hsearch button:hover{background:var(--terra); color:#fff}
.nav{gap:26px}
@media (max-width:1180px){ .nav a.link{letter-spacing:.1em} .nav{gap:20px} }
@media (max-width:760px){
  .top .wrap{flex-wrap:wrap; height:auto; padding-top:12px; padding-bottom:12px; row-gap:10px}
  .hsearch{order:3; flex:1 1 100%; max-width:none}
}
.hsearch{max-width:280px}
@media (max-width:1320px){ .nav a.link[href="partenaire.html"]{display:none} }
@media (max-width:1100px){ .nav .link{display:none} .burger{display:grid} }
@media (min-width:1101px){ .mnav.open{display:none} }
.nav a.link[href="partenaire.html"]{display:none}
.hsearch{min-width:140px}
.hsearch input{width:100%}

/* ===== Palette blanc et beige pour tout le site ===== */
:root{ --ivory:#FBF8F2; --paper:#FFFFFF; --beige:#F3EADB; --beige-2:#EADFCB; --line:#E6DAC4; --accent:#9A6A26; --bg:#FBF8F2; --surface:#FFFFFF; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --bg:#FBF8F2; --surface:#FFFFFF; --line:#E6DAC4; } }
:root[data-theme="dark"]{ --bg:#FBF8F2; --surface:#FFFFFF; --line:#E6DAC4; }
body{background:var(--bg)}
.top{background:rgba(255,255,255,.95)}
.universe{background:var(--beige); color:var(--muted); border-bottom:1px solid var(--line)}
.universe .we strong,.universe nav a:hover,.universe nav a[aria-current="page"]{color:var(--accent)}
.universe nav a{color:var(--ink-2)}
.hero,.page-hero{background:linear-gradient(180deg,#FFFFFF 0%,#F6EFE3 100%)}
.hero h1 em,.world-head h2 em{color:var(--accent)}
.hero figure{background:#fff; border-color:var(--beige-2)}
.trades{background:#fff}
.choose,.tint-sage,.shops-sec.tint-sage{background:var(--beige)}
.tint-gold{background:#FFFFFF}
.world{background:#fff}
.eyebrow,.uni em,.card .fam,.mini small,.link-arrow,.svc .num,.crumbs span[aria-hidden]{color:var(--accent)}
.chip[aria-pressed="true"],.card .acts a,.shop a{border-bottom-color:var(--accent)}
.fav,.fav[aria-pressed="true"] svg path{color:var(--accent); fill:none}
.fav[aria-pressed="true"] svg path{fill:var(--accent)}
.sel-btn .count{background:var(--accent)}
.btn-gold{background:var(--ink); border-color:var(--ink); color:#fff}
.btn-gold:hover{background:var(--accent); border-color:var(--accent); color:#fff}
.btn-line,.btn-dark{background:#fff}
.hsearch button{color:var(--accent)}
.hsearch button:hover{background:var(--ink); color:#fff}
/* sections autrefois foncées */
.partner{background:var(--beige); color:var(--ink)}
.partner h2,.partner h3,.pledges strong{color:var(--ink)}
.partner .eyebrow,.partner .link-arrow{color:var(--accent)}
.partner .lead-muted,.pledges span{color:var(--muted)}
.pledges div{border-top-color:var(--accent)}
.ggroup h3{color:var(--ink)}
.callback{background:var(--beige); color:var(--ink); border:1px solid var(--line)}
.callback h3{color:var(--ink)}
.callback p,.callback .field label{color:var(--muted)}
.callback .field input,.callback .field select{color:var(--ink); border-bottom-color:#CDBB9C}
.callback .btn-gold{background:var(--ink); border-color:var(--ink); color:#fff}
.callback .btn-gold:hover{background:var(--accent); border-color:var(--accent)}
.cta3{background:#fff; color:var(--ink); border-top:1px solid var(--line)}
.cta3 a{border-left-color:var(--line)}
.cta3 strong{color:var(--ink)}
.cta3 span{color:var(--muted)}
.cta3 em{color:var(--accent)}
.cta3 a:hover strong{color:var(--accent)}
footer{background:var(--beige); color:var(--ink); border-top:1px solid var(--line)}
.fcols h4{color:var(--accent)}
.fcols a{color:var(--ink-2)}
.fcols a:hover{color:var(--accent)}
.fcols p{color:var(--muted)}
.legal{border-top-color:var(--line); color:var(--muted)}
@media (max-width:900px){ .cta3 a,.cta3 a:first-child{border-top-color:var(--line)} }
/* vignettes sans photo */
.family .noimg,.card .ph .noimg,.mini .ph .noimg{background:var(--beige-2); color:var(--accent)}
.card .ph,.mini .ph{background:var(--beige)}
/* carte */
.map-tag{background:#fff; color:var(--ink); border:1px solid var(--line)}
.map-tag small{color:var(--accent)}
.worldmap .fr .pin{fill:var(--accent)}
.worldmap .fr .pulse{stroke:var(--accent)}
.map-legend .sw-fr{background:var(--accent)}
.shop{background:#fff}
.panel{background:#fff}
.drawer aside{background:#fff}
.mnav{background:#fff}
.btn-wa{background:var(--ink); border-color:var(--ink); color:#fff}
.btn-wa:hover{background:var(--accent); border-color:var(--accent)}

/* ===== Blanc, beige et doré ===== */
:root{ --accent:#B07F2E; --goldbtn:#B8893E; --goldbtn-d:#94692A; --line:#E8D9B8; }
.btn-gold,.btn-wa,.callback .btn-gold{background:var(--goldbtn); border-color:var(--goldbtn); color:#fff}
.btn-gold:hover,.btn-wa:hover,.callback .btn-gold:hover{background:var(--goldbtn-d); border-color:var(--goldbtn-d); color:#fff}
.btn-line,.btn-dark{border-color:var(--goldbtn); color:var(--goldbtn-d); background:#fff}
.btn-line:hover,.btn-dark:hover{background:var(--goldbtn); color:#fff}
.hsearch:focus-within{border-color:var(--goldbtn)}
.hsearch button:hover{background:var(--goldbtn); color:#fff}
.sel-btn .count{background:var(--goldbtn)}
.nav a.link:hover,.nav a.link[aria-current="page"]{color:var(--accent); border-bottom-color:var(--goldbtn)}
.trades strong,.world-facts strong{color:var(--goldbtn-d)}
.svc-wide,.offer-list,.world-facts,.contact-cards,.drawer ul{border-top-color:var(--goldbtn)}
.uni span{border-top-color:var(--goldbtn)}
.pledges div{border-top-color:var(--goldbtn)}
.hero figure{border-color:var(--goldbtn)}
.shop,.panel{border-top:3px solid var(--goldbtn)}
.ideas-box{border-color:var(--line); border-top:3px solid var(--goldbtn)}
.universe{background:#fff; border-bottom:1px solid var(--line)}
.universe .we strong{color:var(--accent)}
footer{border-top:3px solid var(--goldbtn)}
/* carte en beige et doré */
.worldmap .r-am circle,.worldmap .r-eu circle,.worldmap .r-as circle,.worldmap .r-oc circle,.worldmap .land circle{fill:#E3D5BB}
.worldmap .r-af circle,.worldmap .africa circle{fill:#C8913A}
.worldmap .fr .pin{fill:#8C6427}
.worldmap .fr .pulse{stroke:#8C6427}
.map-legend .sw-fr{background:#8C6427}
.map-legend .sw-af{background:#C8913A}
/* Carte très colorée */
.worldmap .r-am circle{fill:#2E8BC0}
.worldmap .r-eu circle{fill:#3FA34D}
.worldmap .r-as circle{fill:#E8672E}
.worldmap .r-oc circle{fill:#14A39A}
.worldmap .r-af circle{fill:#F2B124}
.worldmap .fr .pin{fill:#C0392B}
.worldmap .fr .pulse{stroke:#C0392B}
.map-legend .sw-fr{background:#C0392B}
.map-legend .sw-af{background:#F2B124}

/* Produits cliquables */
.card .ph .open-prod{display:block; width:100%; height:100%; border:0; padding:0; background:none; cursor:pointer}
.card .ph .open-prod img{transition:transform .4s ease}
.card .ph .open-prod:hover img{transform:scale(1.04)}
@media (prefers-reduced-motion: reduce){ .card .ph .open-prod img{transition:none} .card .ph .open-prod:hover img{transform:none} }
.card h3 .open-prod.link{border:0; background:none; padding:0; font:inherit; color:inherit; text-align:left; cursor:pointer}
.card h3 .open-prod.link:hover{color:var(--accent)}
.card .acts{display:flex; flex-wrap:wrap; gap:18px; align-items:center}
.card .acts .more{border:0; background:none; padding:0 0 3px; font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); border-bottom:1px solid var(--accent); cursor:pointer}
.card .tags{display:none}
/* Fenêtre produit */
.pmodal{position:fixed; inset:0; z-index:60; display:none}
.pmodal.open{display:grid; place-items:center; padding:24px}
.pmodal .scrim{position:absolute; inset:0; background:rgba(31,26,20,.45)}
.pbox{position:relative; background:#fff; width:min(980px,100%); max-height:calc(100vh - 48px); overflow:auto; display:grid; grid-template-columns:1fr 1fr; border-top:3px solid var(--goldbtn)}
.pbox .close{position:absolute; top:10px; right:12px; z-index:2; border:0; background:rgba(255,255,255,.9); font-size:30px; line-height:1; padding:4px 10px; color:var(--muted); cursor:pointer}
.pm-img{background:var(--beige)}
.pm-img img{width:100%; height:100%; object-fit:cover; aspect-ratio:1/1}
.pm-info{padding:40px 40px 36px}
.pm-info .fam{font-size:11px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:var(--accent)}
.pm-info h2{font-size:clamp(30px,3.4vw,42px) !important; font-weight:500; margin:8px 0 14px}
.pm-info p{color:var(--muted); font-weight:300}
.pm-info h3{font-family:var(--sans); font-size:11px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-2); margin:26px 0 10px}
.pm-tags{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px}
.pm-tags li{border:1px solid var(--line); padding:6px 14px; font-size:14px}
.pm-list{margin:0; padding-left:18px; color:var(--muted); font-weight:300}
.pm-list li{margin:4px 0}
.pm-info .row-btns{margin-top:30px}
@media (max-width:760px){ .pbox{grid-template-columns:1fr} .pm-img img{aspect-ratio:4/3} .pm-info{padding:28px 24px} }
.cta3 strong{text-wrap:balance}
.cta3 strong{white-space:nowrap; font-size:clamp(19px,1.95vw,25px); text-wrap:initial}
.cta3 a{padding-left:26px; padding-right:26px}
.cta3 a:first-child{padding-left:0}
@media (max-width:900px){ .cta3 strong{font-size:24px; white-space:normal} }
.cta3 strong,.cta3 span{white-space:nowrap}
.cta3 span{font-size:clamp(12px,1.12vw,15px)}
@media (max-width:900px){ .cta3 strong{font-size:clamp(18px,6vw,24px); white-space:nowrap} .cta3 span{font-size:clamp(12px,3.9vw,15px)} }
.world-facts strong{white-space:nowrap; font-size:clamp(18px,1.8vw,24px)}
@media (max-width:900px){ .world-facts strong{font-size:clamp(18px,5.6vw,24px)} }
.world-head h2{max-width:16ch}
.world-head h2{max-width:none}
.world-head{grid-template-columns:1.35fr .65fr}
@media (max-width:900px){ .world-head{grid-template-columns:1fr} }
.pm-note{font-size:13px !important; margin-top:18px; color:var(--muted)}
#pm-allerg{color:var(--ink-2); font-weight:400}