
@font-face{font-family:"Archivo";font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(/fonts/archivo.woff2) format("woff2")}
@font-face{font-family:"Public Sans";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/public-sans-400.woff2) format("woff2")}
@font-face{font-family:"Public Sans";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/public-sans-600.woff2) format("woff2")}
@font-face{font-family:"Public Sans";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/public-sans-700.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/jetbrains-mono-500.woff2) format("woff2")}
:root{--night:#0E0F12;--night2:#16181D;--line:#2A2D35;--paper:#F5F2EB;--paper2:#ECE7DC;--ink:#17181B;--mute:#5E5E5A;--mute-d:#A7A8A3;--amber:#FAC407;--amber-ink:#8A5A00;
--disp:"Archivo",system-ui,sans-serif;--body:"Public Sans",system-ui,sans-serif;--mono:"JetBrains Mono",ui-monospace,monospace}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.6 var(--body);-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:inherit}
.wrap{width:min(1180px,100% - 2.5rem);margin-inline:auto}
.skip{position:absolute;left:-9999px}.skip:focus{left:1rem;top:1rem;z-index:99;background:#fff;padding:.5rem 1rem}
h1,h2,h3{font-family:var(--disp);line-height:1.02;margin:0 0 .6em;letter-spacing:-.01em}
h1{font-size:clamp(2.5rem,6.2vw,5rem);font-weight:800;font-stretch:88%}
h2{font-size:clamp(2rem,4.2vw,3.25rem);font-weight:800;font-stretch:90%}
h3{font-size:1.35rem;font-weight:700;font-stretch:100%}
p{margin:0 0 1em}
.eyebrow{font:500 .78rem/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--amber-ink);margin-bottom:1rem;display:block}
.dark .eyebrow{color:var(--amber)}
.lead{font-size:1.2rem;max-width:40rem}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.9rem 1.35rem;border-radius:999px;font:700 1rem/1 var(--body);text-decoration:none;border:2px solid currentColor;white-space:nowrap}
.btn.solid{background:var(--amber);border-color:var(--amber);color:#17120A}
.btn.solid:hover{background:#FFD43B}
.btn.ghost:hover{background:rgba(255,255,255,.08)}
.btn:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
section{padding:clamp(4rem,9vw,7rem) 0}
.dark{background:var(--night);color:#ECEBE6}
/* header */
header.site{position:sticky;top:0;z-index:40;background:rgba(14,15,18,.92);backdrop-filter:blur(10px);color:#fff;border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;gap:1rem}
.brand{display:flex;align-items:center;text-decoration:none}.brand img{height:46px;width:auto}
.brand .mk{width:40px;height:40px;font-size:.9rem!important;border-radius:7px;background:#000;border:1.5px solid var(--amber);display:grid;place-items:center;font:800 1rem/1 var(--disp);font-stretch:115%;color:var(--amber);text-shadow:0 0 10px rgba(250,196,7,.8)}
.brand .wm{font:800 1.05rem/1 var(--disp);font-stretch:118%;letter-spacing:.06em;text-transform:uppercase}
.brand .wm small{display:block;font:500 .62rem/1.4 var(--mono);letter-spacing:.16em;color:var(--mute-d);margin-top:.2rem}
nav.main ul{list-style:none;margin:0;padding:0;display:flex;gap:1.6rem;align-items:center}
nav.main a{text-decoration:none;font-weight:600;font-size:.97rem;color:#D9D8D3}
nav.main a:hover,nav.main a[aria-current]{color:#fff}
nav.main .cta{background:var(--amber);color:#17120A;padding:.6rem 1rem;border-radius:999px}
.menu-btn{display:none;background:none;border:1px solid var(--line);color:#fff;border-radius:999px;padding:.5rem .9rem;font:600 .95rem var(--body);gap:.5rem;align-items:center}
.menu-btn .bars,.menu-btn .bars::before,.menu-btn .bars::after{display:block;width:16px;height:2px;background:#fff;position:relative;transition:.2s}
.menu-btn .bars::before,.menu-btn .bars::after{content:"";position:absolute}.menu-btn .bars::before{top:-5px}.menu-btn .bars::after{top:5px}
.menu-btn[aria-expanded=true] .bars{background:transparent}.menu-btn[aria-expanded=true] .bars::before{top:0;transform:rotate(45deg)}.menu-btn[aria-expanded=true] .bars::after{top:0;transform:rotate(-45deg)}
@media (max-width:860px){.menu-btn{display:inline-flex}
nav.main{position:absolute;left:0;right:0;top:68px;background:var(--night);border-bottom:1px solid var(--line);max-height:0;overflow:hidden;transition:max-height .3s}
nav.main.open{max-height:80vh}
nav.main ul{flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.25rem 1.25rem}
nav.main li a{display:block;padding:.9rem 0;border-bottom:1px solid var(--line);font-size:1.1rem}
nav.main .cta{margin-top:1rem;text-align:center;border-bottom:0}}
/* hero */
.hero{position:relative;overflow:hidden;padding:clamp(3.5rem,8vw,6.5rem) 0 clamp(3.5rem,7vw,5.5rem);
background:radial-gradient(1200px 500px at 75% 20%,rgba(250,196,7,.10),transparent 60%),
repeating-linear-gradient(0deg,transparent 0 33px,rgba(255,255,255,.025) 33px 34px),
repeating-linear-gradient(90deg,transparent 0 67px,rgba(255,255,255,.02) 67px 68px),var(--night)}
.hero .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hero h1{color:#fff}.hero h1 em{font-style:normal;color:var(--amber);text-shadow:0 0 28px rgba(250,196,7,.45)}
.hero .lead{color:#C9C8C2}
.hero .acts{display:flex;flex-wrap:wrap;gap:.8rem;margin:2rem 0 2.2rem}
.hero .facts{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;list-style:none;padding:0;margin:0;font:500 .8rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mute-d)}
.hero .facts li::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--amber);margin-right:.55rem;vertical-align:middle;box-shadow:0 0 8px var(--amber)}
/* mur d'enseignes */
.wall{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;padding:22px;border-radius:14px;background:linear-gradient(180deg,#1A1C21,#121317);border:1px solid var(--line);box-shadow:0 40px 80px -30px rgba(0,0,0,.7)}
.plate{--c:#fff;grid-column:span 3;position:relative;border-radius:8px;padding:1.15rem 1rem 1rem;background:#08090B;border:1px solid #23262D;text-align:center;
box-shadow:inset 0 0 0 1px rgba(255,255,255,.02),0 10px 24px -14px rgba(0,0,0,.9)}
.plate::before,.plate::after{content:"";position:absolute;top:-8px;width:2px;height:8px;background:#3A3D45}.plate::before{left:22%}.plate::after{right:22%}
.plate img{display:block;margin:0 auto;height:44px;width:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--c) 70%,transparent)) drop-shadow(0 0 18px color-mix(in srgb,var(--c) 35%,transparent))}
.plate span{display:block;margin-top:.55rem;font:500 .66rem/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#8E8F8A}
.plate.big{grid-column:1/-1;padding:1.4rem 1rem 1.2rem}.plate.big img{height:78px}
.plate.big.long img{height:56px}
.plate.third{grid-column:span 2;padding-inline:.5rem}.plate.third img{height:38px}
.plate.flick img{animation:flick 7s infinite}
@keyframes flick{0%,92%,100%{opacity:1}93%{opacity:.35}94%{opacity:1}96%{opacity:.5}97%{opacity:1}}
@media (prefers-reduced-motion:reduce){.plate.flick img{animation:none}}
.wall .ground{grid-column:1/-1;font:500 .7rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#6B6C68;text-align:center;padding-top:.4rem}
@media (max-width:960px){.hero .wrap{grid-template-columns:1fr}.wall{max-width:560px}}
@media (max-width:520px){.wall{gap:10px;padding:14px}.plate{padding:.9rem .5rem .8rem}.plate img,.plate.third img{height:34px}.plate.big img{height:60px}.plate.big.long img{height:44px}
.plate.third{grid-column:span 3}.plate.lastm{grid-column:1/-1}}
/* marques */
.head{display:flex;justify-content:space-between;align-items:end;gap:2rem;flex-wrap:wrap;margin-bottom:2.5rem}
.head p{max-width:34rem;color:var(--mute);margin:0}
.group-lbl{font:500 .78rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin:2.5rem 0 1rem;display:flex;align-items:center;gap:1rem}
.group-lbl::after{content:"";flex:1;height:1px;background:#D6D0C3}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;list-style:none;padding:0;margin:0}
.cards.three{grid-template-columns:repeat(3,1fr)}
.card{--c:#999;position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #E2DCCF;border-radius:12px;padding:1.4rem 1.3rem 1.2rem;text-decoration:none;transition:transform .2s,box-shadow .2s;height:100%}
.card::before{content:"";position:absolute;left:0;right:0;top:112px;height:3px;background:var(--c);z-index:1}
.card:hover{transform:translateY(-3px);box-shadow:0 18px 36px -22px rgba(0,0,0,.35)}
.card{padding-top:0;overflow:hidden}
.card .lg{display:flex;align-items:center;justify-content:center;height:112px;margin:0 -1.3rem 1.1rem;background:radial-gradient(120% 140% at 50% 0%,color-mix(in srgb,var(--c) 22%,#14161A),#0B0C0F 70%);border-bottom:1px solid #22252C}
.card .lg img{max-width:78%;max-height:70px;width:auto;height:auto}
.card .lg .neon{font:800 1.6rem/1 var(--disp);font-stretch:112%;letter-spacing:.03em;text-transform:uppercase;color:var(--c);text-shadow:0 0 6px color-mix(in srgb,var(--c) 85%,transparent),0 0 22px color-mix(in srgb,var(--c) 55%,transparent)}
.card .nm{font:800 1.25rem/1 var(--disp);font-stretch:108%;margin:0 0 .45rem}
.card .zn{font:500 .74rem/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin-bottom:.9rem}
.card .ds{font-size:.97rem;color:#3A3A37;flex:1}
.card .go{margin-top:1rem;font-weight:700;font-size:.92rem;display:flex;justify-content:space-between;border-top:1px solid #EEE9DF;padding-top:.85rem}
.card .go i{font-style:normal;color:var(--mute);font-weight:400}
@media (max-width:1020px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.cards.three{grid-template-columns:1fr}}
@media (max-width:560px){.cards{grid-template-columns:1fr}}
/* fonctionnement */
.chain{display:grid;grid-template-columns:repeat(3,1fr);gap:0;list-style:none;padding:0;margin:3rem 0 0;counter-reset:s}
.chain li{position:relative;padding:2rem 1.8rem 2rem 0;border-top:2px solid var(--line)}
.chain li::before{counter-increment:s;content:"0" counter(s);position:absolute;top:-1.05rem;left:0;background:var(--night);padding-right:.8rem;font:500 .9rem/2 var(--mono);color:var(--amber)}
.chain h3{color:#fff;margin-top:.6rem}.chain p{color:#BDBCB6;margin:0}
.chain .who{display:block;margin-top:1rem;font:500 .74rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute-d)}
@media (max-width:820px){.chain{grid-template-columns:1fr}.chain li{padding-right:0}}
.promise{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:3.5rem;list-style:none;padding:0}
.promise li{background:var(--night2);border:1px solid var(--line);border-radius:12px;padding:1.3rem}
.promise b{display:block;color:#fff;font-size:1.05rem;margin-bottom:.35rem}.promise span{color:#AFAEA8;font-size:.95rem}
@media (max-width:900px){.promise{grid-template-columns:1fr 1fr}}@media (max-width:520px){.promise{grid-template-columns:1fr}}
/* orienteur */
.finder{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.q{display:grid;gap:.6rem;margin:0 0 1.4rem;padding:0;border:0}
.q legend{font-weight:700;margin-bottom:.7rem;padding:0}
.opt{position:relative}
.opt input{position:absolute;opacity:0;width:1px;height:1px}
.opt label{display:flex;gap:.8rem;align-items:center;background:#fff;border:1.5px solid #DDD6C8;border-radius:10px;padding:.85rem 1rem;cursor:pointer;font-weight:600}
.opt label::before{content:"";width:18px;height:18px;border-radius:50%;border:2px solid #B9B2A3;flex:none}
.opt input:checked+label{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.opt input:checked+label::before{border:5px solid var(--ink)}
.opt input:focus-visible+label{outline:3px solid var(--amber);outline-offset:2px}
.finder select{width:100%;padding:.85rem 1rem;border:1.5px solid #DDD6C8;border-radius:10px;font:600 1rem var(--body);background:#fff}
.result{--c:var(--amber);background:var(--night);color:#ECEBE6;border-radius:16px;padding:clamp(1.6rem,4vw,2.6rem);position:sticky;top:90px}
.result .tag{font:500 .74rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mute-d)}
.result .nm{font:800 clamp(2rem,4vw,2.8rem)/1 var(--disp);font-stretch:110%;color:var(--c);text-shadow:0 0 8px color-mix(in srgb,var(--c) 70%,transparent),0 0 30px color-mix(in srgb,var(--c) 40%,transparent);margin:.8rem 0 1rem}
.result p{color:#C9C8C2}.result .nm img{height:72px;width:auto;max-width:100%;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--c) 55%,transparent))}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.result .acts{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.5rem}
.result .btn.solid{background:var(--c);border-color:var(--c);color:#0C0C0C}
@media (max-width:860px){.finder{grid-template-columns:1fr}.result{position:static}}
/* bandeau partenaires */
.band{background:var(--amber);color:#17120A;padding:clamp(3rem,6vw,4.5rem) 0}
.band .wrap{display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap}
.band h2{margin:0 0 .4rem;font-size:clamp(1.7rem,3.4vw,2.5rem)}.band p{margin:0;max-width:38rem}
.band .btn{border-color:#17120A}.band .btn:hover{background:#17120A;color:var(--amber)}
/* pages internes */
.phero{background:var(--night);color:#fff;padding:clamp(3rem,7vw,5rem) 0 clamp(2.5rem,5vw,3.5rem)}
.phero p{color:#C9C8C2;max-width:42rem;font-size:1.15rem;margin:0}
.crumbs{list-style:none;display:flex;gap:.5rem;padding:0;margin:0 0 1.5rem;font:500 .78rem var(--mono);color:var(--mute-d)}
.crumbs li+li::before{content:"/";margin-right:.5rem}.crumbs a{text-decoration:none}
.prose{max-width:46rem}.prose h2{font-size:1.6rem;margin-top:2rem}
.split{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
@media (max-width:860px){.split{grid-template-columns:1fr}}
.ticks{list-style:none;padding:0;margin:0 0 2rem;display:grid;gap:.7rem}
.ticks li{padding-left:1.8rem;position:relative}.ticks li::before{content:"";position:absolute;left:0;top:.45em;width:12px;height:12px;border-radius:3px;background:var(--amber)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem;list-style:none;padding:0;margin:0 0 2.5rem}
.grid2 li{background:#fff;border:1px solid #E2DCCF;border-radius:12px;padding:1.2rem}.grid2 b{display:block;margin-bottom:.3rem}
@media (max-width:620px){.grid2{grid-template-columns:1fr}}
/* formulaires */
form.f{display:grid;gap:1rem;background:#fff;border:1px solid #E2DCCF;border-radius:16px;padding:clamp(1.3rem,3vw,2rem)}
form.f .row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:620px){form.f .row{grid-template-columns:1fr}}
form.f label{display:block;font-weight:600;font-size:.93rem;margin-bottom:.35rem}
form.f input,form.f select,form.f textarea{width:100%;padding:.8rem .9rem;border:1.5px solid #D6CFC0;border-radius:9px;font:400 1rem var(--body);background:#FCFBF8;color:var(--ink)}
form.f textarea{min-height:8rem;resize:vertical}
form.f .btn{border:0;cursor:pointer;justify-content:center;width:100%}
.hp{position:absolute;left:-9999px}
.small{font-size:.85rem;color:var(--mute)}
.aside{background:var(--night);color:#ECEBE6;border-radius:16px;padding:1.6rem}
.aside .big{font:800 1.9rem/1.1 var(--disp);font-stretch:105%;color:var(--amber);text-decoration:none;display:block;margin:.3rem 0 1rem}
.aside p{color:#C9C8C2}.aside a{color:#fff}
/* footer */
footer.site{background:#08090B;color:#A7A8A3;padding:3.5rem 0 6rem;font-size:.95rem}
footer .cols{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:2.5rem}
footer b{color:#fff}footer ul{list-style:none;padding:0;margin:.8rem 0 0;display:grid;gap:.45rem}
footer a{text-decoration:none}footer a:hover{color:#fff;text-decoration:underline}
footer .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:.55rem;background:var(--c);box-shadow:0 0 6px var(--c)}
@media (max-width:760px){footer .cols{grid-template-columns:1fr}}
/* whatsapp + barre mobile */
.wa-float{position:fixed;right:18px;bottom:5.2rem;z-index:50;display:flex;align-items:center;gap:.5rem;background:#25D366;color:#06301A;text-decoration:none;font-weight:700;padding:.75rem 1.05rem;border-radius:999px;box-shadow:0 10px 24px -8px rgba(0,0,0,.45)}
.callbar{display:none}
@media (max-width:760px){.wa-float{display:none}
.callbar{display:grid;grid-template-columns:1fr 1fr 1.3fr;position:fixed;left:0;right:0;bottom:0;z-index:50;background:#08090B;border-top:1px solid var(--line)}
.callbar a{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:1rem .4rem;color:#fff;text-decoration:none;font-weight:700;font-size:.95rem;white-space:nowrap}
.callbar .w{color:#25D366}.callbar .d{background:var(--amber);color:#17120A}}
