:root{
  --selector-bg:#f3f7f5;
  --selector-surface:#ffffff;
  --selector-ink:#10261f;
  --selector-muted:#52655d;
  --selector-green:#0f8442;
  --selector-green-dark:#075d35;
  --selector-green-bright:#18b85c;
  --selector-mint:#edf8f1;
  --selector-line:#d8e5de;
  --selector-dark:#032b22;
  --selector-shadow:0 18px 48px rgba(6,55,39,.09);
  --selector-shell:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--selector-bg)}
body.trade-selector-page{margin:0;background:var(--selector-bg);color:var(--selector-ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}
.trade-selector-page a{color:inherit}
.selector-shell{width:min(calc(100% - 40px),var(--selector-shell));margin-inline:auto}
.selector-skip-link{position:fixed;left:14px;top:10px;z-index:4000;transform:translateY(-160%);padding:10px 14px;border-radius:10px;background:#fff;color:var(--selector-green-dark);font-weight:800;box-shadow:0 8px 22px rgba(0,0,0,.16);transition:transform .18s ease}
.selector-skip-link:focus{transform:none}
.sr-only-selector{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}

/* Hero : contraste fort et priorité à l’action */
.selector-hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#02271f 0%,#06452f 58%,#0b7540 100%);color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}
.selector-hero::before,.selector-hero::after{content:"";position:absolute;border-radius:999px;pointer-events:none;filter:blur(2px)}
.selector-hero::before{width:460px;height:460px;right:-130px;top:-240px;background:radial-gradient(circle,rgba(73,224,125,.20),rgba(73,224,125,0) 68%)}
.selector-hero::after{width:380px;height:380px;left:-190px;bottom:-250px;background:radial-gradient(circle,rgba(255,255,255,.10),rgba(255,255,255,0) 68%)}
.selector-hero-inner{position:relative;z-index:1;padding:70px 0 78px;text-align:center}
.selector-kicker{display:inline-flex;margin:0 0 18px;padding:8px 12px;border:1px solid rgba(151,242,181,.26);border-radius:999px;background:rgba(255,255,255,.08);color:#bdf3cf;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.selector-hero h1{max-width:920px;margin:0 auto;font-size:clamp(38px,6vw,68px);line-height:.98;letter-spacing:-.055em;font-weight:900}
.selector-hero h1 span{color:#8ce8ad}
.selector-lead{max-width:760px;margin:22px auto 0;color:#d8ebe2;font-size:18px;line-height:1.65}
.selector-proof{display:flex;justify-content:center;gap:12px 22px;flex-wrap:wrap;margin:26px auto 0;color:#eaf7ef;font-size:13px;font-weight:700}
.selector-proof span{display:inline-flex;align-items:center;gap:7px}.selector-proof strong{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#dff7e7;color:#08763d;font-size:12px}
.searchbox{position:relative;max-width:790px;margin:30px auto 0;display:flex;align-items:center;gap:10px;padding:8px 10px 8px 14px;border:1px solid rgba(255,255,255,.28);border-radius:16px;background:#fff;box-shadow:0 18px 44px rgba(0,0,0,.22);color:var(--selector-ink)}
.searchbox:focus-within{outline:3px solid rgba(105,226,147,.35);outline-offset:3px}
.search-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--selector-mint);color:var(--selector-green-dark);font-size:24px;line-height:1}
.searchbox input{min-width:0;flex:1;border:0;outline:0;padding:13px 4px;background:transparent;color:var(--selector-ink);font:700 16px/1.35 inherit}
.searchbox input::placeholder{color:#7a8d85;font-weight:500}
.searchbox kbd{padding:8px 10px;border:0;border-radius:9px;background:#f0f6f3;color:#4b6258;font:800 11px/1 inherit;white-space:nowrap}

/* Filtres */
.selector-controls{position:relative;z-index:3;margin-top:-28px}
.selector-controls-card{padding:24px;border:1px solid var(--selector-line);border-radius:22px;background:#fff;box-shadow:var(--selector-shadow)}
.selector-controls-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:18px}
.selector-overline{margin:0 0 5px;color:var(--selector-green-dark);font-size:11px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.selector-controls h2{margin:0;font-size:23px;letter-spacing:-.025em}
.result-summary{margin:0;color:var(--selector-muted);font-size:13px;font-weight:800;text-align:right}
.categories{display:flex;gap:9px;flex-wrap:wrap}
.catbtn{appearance:none;display:inline-flex;align-items:center;gap:7px;min-height:42px;padding:9px 13px;border:1px solid #dbe7e1;border-radius:12px;background:#f8fbf9;color:#28453a;cursor:pointer;font:800 13px/1.2 inherit;transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease}
.catbtn:hover{transform:translateY(-1px);border-color:#a7ccb8;background:#f0f9f4}
.catbtn:focus-visible{outline:3px solid rgba(15,132,66,.22);outline-offset:2px}
.catbtn.active{border-color:var(--selector-green-dark);background:var(--selector-green-dark);color:#fff;box-shadow:0 8px 20px rgba(7,93,53,.16)}
.catbtn-count{display:inline-grid;place-items:center;min-width:24px;height:22px;padding:0 6px;border-radius:999px;background:rgba(16,38,31,.07);font-size:10px}
.catbtn.active .catbtn-count{background:rgba(255,255,255,.16);color:#fff}

/* Catalogue */
.selector-catalogue{padding:38px 0 72px}
.section{margin:0 0 20px;padding:0;border:1px solid var(--selector-line);border-radius:22px;background:#fff;box-shadow:0 10px 30px rgba(6,55,39,.045);overflow:hidden}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 22px;border-bottom:1px solid var(--selector-line);background:linear-gradient(90deg,#f3faf6 0%,#fff 72%)}
.section-title-wrap{display:flex;align-items:center;gap:12px}
.section-icon{display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border:1px solid #d9eadf;border-radius:12px;background:#fff;font-size:19px;box-shadow:0 5px 16px rgba(6,55,39,.05)}
.section-head h2{margin:0;font-size:20px;line-height:1.2;letter-spacing:-.02em}
.section-head p{margin:4px 0 0;color:var(--selector-muted);font-size:12px}
.section-count{display:inline-flex;padding:7px 10px;border-radius:999px;background:#e7f6ed;color:var(--selector-green-dark);font-size:11px;font-weight:900;white-space:nowrap}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:14px}
.card{position:relative;min-height:128px;padding:18px;border:1px solid #e2ebe6;border-radius:15px;background:#fff;text-decoration:none;display:flex;flex-direction:column;justify-content:space-between;gap:16px;overflow:hidden;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease}
.card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--selector-green-bright),var(--selector-green-dark));opacity:.75}
.card:hover{transform:translateY(-2px);border-color:#a7d4b9;background:#fbfefc;box-shadow:0 12px 26px rgba(6,78,45,.09)}
.card:focus-visible{outline:3px solid rgba(15,132,66,.22);outline-offset:2px}
.card.is-starting{pointer-events:none;opacity:.68}
.card-copy h3{margin:0;color:#122b22;font-size:17px;line-height:1.28;letter-spacing:-.015em}
.card-copy p{margin:7px 0 0;color:#63766e;font-size:12.5px;line-height:1.45}
.card-action{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--selector-green-dark);font-size:12px;font-weight:900}
.card-action-arrow{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--selector-mint);font-size:15px;transition:transform .18s ease,background .18s ease}
.card:hover .card-action-arrow{transform:translateX(2px);background:#dff3e7}
.empty{text-align:center;padding:58px 24px;border:1px solid var(--selector-line);border-radius:22px;background:#fff}
.empty[hidden]{display:none!important}.empty>span{display:grid;place-items:center;width:52px;height:52px;margin:0 auto 14px;border-radius:14px;background:var(--selector-mint);color:var(--selector-green-dark);font-size:30px}.empty h2{margin:0;font-size:22px}.empty p{max-width:520px;margin:10px auto 20px;color:var(--selector-muted);line-height:1.6}.empty button{border:0;border-radius:11px;padding:12px 16px;background:var(--selector-green-dark);color:#fff;font:850 13px/1 inherit;cursor:pointer}
.selector-help{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:28px;padding:22px;border:1px solid #cfe2d8;border-radius:18px;background:#eef8f2}.selector-help>div{display:flex;align-items:flex-start;gap:14px}.help-icon{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border-radius:50%;background:var(--selector-green-dark);color:#fff;font-weight:900}.selector-help strong{display:block;margin:1px 0 5px}.selector-help p{margin:0;color:#587067;line-height:1.55;font-size:13px}.selector-help>a{flex:0 0 auto;color:var(--selector-green-dark);font-size:13px;font-weight:900;text-decoration:none}

/* Footer de conversion : volontairement compact */
.selector-footer{background:#03241f;color:#dbece5;border-top:1px solid rgba(255,255,255,.06)}
.selector-footer-inner{display:grid;grid-template-columns:190px 1fr auto;align-items:center;gap:28px;min-height:150px;padding:34px 0}
.selector-footer-brand img{display:block;width:180px;height:auto}.selector-footer p{margin:0;max-width:560px;color:#b8d0c6;font-size:13px;line-height:1.6}.selector-footer nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px 14px}.selector-footer nav a{color:#e7f4ee;text-decoration:none;font-size:12px;font-weight:800}.selector-footer nav a:hover{text-decoration:underline}

@media(max-width:900px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .selector-footer-inner{grid-template-columns:170px 1fr}.selector-footer nav{grid-column:1/-1;justify-content:flex-start}
}
@media(max-width:700px){
  .selector-shell{width:min(calc(100% - 24px),var(--selector-shell))}
  .selector-hero-inner{padding:48px 0 60px}.selector-hero h1{font-size:clamp(34px,11vw,48px)}.selector-lead{font-size:16px}.selector-proof{justify-content:flex-start;text-align:left;max-width:560px}.searchbox kbd{display:none}
  .selector-controls{margin-top:-20px}.selector-controls-card{padding:18px;border-radius:18px}.selector-controls-head{display:block}.result-summary{margin-top:8px;text-align:left}.categories{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.categories::-webkit-scrollbar{display:none}.catbtn{flex:0 0 auto}
  .cards{grid-template-columns:1fr;gap:10px;padding:10px}.card{min-height:112px;padding:16px}.section{border-radius:18px}.section-head{padding:16px}.section-icon{width:38px;height:38px;flex-basis:38px}.section-head h2{font-size:18px}
  .selector-help{display:block}.selector-help>a{display:inline-flex;margin-top:16px}.selector-footer-inner{display:block;padding:30px 0}.selector-footer-brand img{width:165px}.selector-footer p{margin-top:16px}.selector-footer nav{justify-content:flex-start;margin-top:18px}
}
@media(max-width:430px){
  .selector-hero-inner{padding-top:38px}.selector-kicker{font-size:10px}.selector-hero h1{font-size:36px}.selector-lead{font-size:15px}.selector-proof{font-size:12px}.searchbox{margin-top:24px;border-radius:14px}.searchbox input{font-size:15px}.section-count{display:none}.card-copy h3{font-size:16px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.card,.catbtn,.card-action-arrow,.selector-skip-link{transition:none!important}}