/* Présentation du service et des outils, conservant la charte belge. */
:root{--green:#0e5a50;--green-dark:#103c40;--ink:#182d34;--muted:#5b6f73;--line:#dbe7e5;--mint:#e6f5ef;--background:#f7faf9}
body{background:radial-gradient(circle at 12% 5%,#e6f3ed 0,transparent 26%),radial-gradient(circle at 90% 30%,#eef4fb 0,transparent 25%),var(--background)}
.header{background:#ffffffde;backdrop-filter:blur(12px);border-bottom:1px solid #d8e5e0;box-shadow:0 8px 26px #163d3508}
.brand-icon{background:linear-gradient(145deg,#0a5f59,#0b394b);box-shadow:0 8px 18px #0b4f4c36;border-radius:13px}
.brand{color:#122e36}.brand-small{color:#526d6c}
.primary{background:linear-gradient(135deg,#0b665b,#114653);box-shadow:0 5px 14px #115b4c20;font-weight:750}
.primary:hover:not(:disabled){background:linear-gradient(135deg,#084c46,#0e3543);box-shadow:0 9px 20px #115b4c30}
.quota-strip{background:linear-gradient(90deg,#0b4349,#0c5d53 55%,#124958);color:#fff;border:0;letter-spacing:.01em;box-shadow:0 3px 15px #073c4027}
.quota-strip a{color:#ffe3a0;text-underline-offset:3px}
.quota-offer,.promo-free,.promo-inline{display:inline-flex;align-items:center;gap:6px;font-weight:850;letter-spacing:.02em}
.quota-offer{background:#fff2c8;color:#21423b;border-radius:999px;padding:4px 12px;margin-right:6px;animation:offerBlink 1.8s ease-in-out infinite}
.promo-free{background:#fff2cf;color:#76501c;border:1px solid #f4d992;padding:8px 14px;border-radius:999px;font-size:13px;margin-bottom:15px;box-shadow:0 5px 15px #b7831e18;animation:offerBlink 1.8s ease-in-out infinite}
@keyframes offerBlink{0%,100%{opacity:1;box-shadow:0 0 0 0 #f2c55c55}50%{opacity:.58;box-shadow:0 0 0 7px #f2c55c14}}
.hero{position:relative;isolation:isolate;padding:55px clamp(26px,5vw,70px);margin:26px 0 22px;gap:clamp(26px,5vw,74px);border:1px solid #d7e8e1;border-radius:30px;background:linear-gradient(125deg,#ffffffec 0%,#f1fbf7ed 55%,#dbece7d9 100%);box-shadow:0 22px 60px #173f3620;overflow:hidden}
.hero:before{content:"";position:absolute;inset:auto -80px -180px auto;width:430px;height:430px;border:70px solid #ffffff52;border-radius:50%;z-index:-1}
.hero:after{content:"";position:absolute;width:260px;height:5px;left:0;top:0;background:linear-gradient(90deg,#151a1b 0 32%,#f3c64b 32% 66%,#d74742 66%);border-radius:0 8px 8px 0}
.hero h1{font-size:clamp(40px,4.4vw,62px);font-weight:800;letter-spacing:-.055em;line-height:1.04;color:#183039;margin-bottom:18px}
.hero h1 em{color:#087966}.hero p{font-size:17px;color:#496164;line-height:1.65}
.eyebrow{font-weight:850;color:#0a6960;letter-spacing:.12em}
.hero-image-actions{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0 17px}
.hero-image-actions .btn{border-color:#a8d3c4;color:#0a655a;background:#fff;font-size:13px;padding:10px 13px;box-shadow:0 5px 12px #174e3c10}
.hero-image-actions .btn:hover{background:#eaf7f0}
.trustline{gap:10px}.trustline span{background:#fff;border:1px solid #dce9e3;border-radius:10px;padding:8px 11px;color:#31514c;font-weight:700}
.quick-start{background:radial-gradient(circle at 90% 15%,#1c827454,transparent 34%),linear-gradient(145deg,#123d48,#0a6457);color:#fff;border:1px solid #2f706b;border-radius:24px;padding:31px;box-shadow:0 20px 35px #12494138;overflow:hidden}
.quick-start:after{content:"";position:absolute;width:190px;height:190px;border:1px solid #ffffff2d;border-radius:50%;right:-55px;bottom:-115px;box-shadow:0 0 0 28px #ffffff0a}
.quick-start h2{color:#fff;font-size:27px;font-weight:780;max-width:270px}.quick-start p{color:#d6ece9;max-width:300px}
.quick-start .quick-tag{color:#ffe39d;font-weight:800}.quick-start .tool-icon{background:#ffffffdf;color:#0b6559;width:58px;height:58px;border-radius:16px;box-shadow:0 10px 20px #051f1e35}
.quick-start .btn.primary{background:#fff;color:#0d554d;box-shadow:0 8px 18px #021f1e42;position:relative;z-index:1}
.quick-start .btn.primary:hover{background:#fff1c9;color:#0b4b46}
.pricing-summary{background:linear-gradient(100deg,#fff8e6,#ecf7f2);border:1px solid #e7dbad;border-radius:14px;padding:16px 22px;box-shadow:0 7px 18px #8c6a1a0d}
.promo-inline{color:#865916;animation:offerBlink 1.8s ease-in-out infinite}
.tools-top{margin-top:17px}.filter{border:1px solid transparent;font-weight:720}.filter.active{background:#0b665b;box-shadow:0 5px 13px #0b665b31}.filter:hover:not(.active){background:#fff;border-color:#d4e3dd}
.tool-grid{gap:18px}.tool-card{border-radius:18px;padding:22px;min-height:242px;border:1px solid #dce8e3;box-shadow:0 5px 20px #183b3210;overflow:hidden;transition:transform .22s,box-shadow .22s,border-color .22s}
.tool-card:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#096a60,#74b9a6)}
.tool-card[data-category="organiser"]:before{background:linear-gradient(90deg,#d97a5d,#f1b487)}
.tool-card[data-category="convertir"]:before{background:linear-gradient(90deg,#497dbc,#8fb8e7)}
.tool-card[data-category="images"]:before{background:linear-gradient(90deg,#ce8640,#f3c081)}
.tool-card[data-category="modifier"]:before{background:linear-gradient(90deg,#795bab,#b29bdf)}
.tool-card:hover{transform:translateY(-5px);border-color:#93baae;box-shadow:0 17px 35px #0d48352a}
.tool-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.tool-type{font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:#758985;font-weight:850;white-space:nowrap}
.tool-card .tool-icon{width:54px;height:54px;border-radius:15px;box-shadow:inset 0 1px 0 #fff8,0 8px 15px #174e3c12;position:relative;margin-bottom:5px}
.tool-card .tool-icon:after{content:attr(data-format);position:absolute;bottom:-7px;right:-14px;background:#fff;color:#264a53;border:1px solid #d9e7e2;border-radius:5px;padding:2px 4px;font-size:8px;line-height:1;font-weight:900;letter-spacing:.04em;box-shadow:0 3px 8px #153d3823}
.tool-card .tool-icon svg{width:27px;height:27px;stroke-width:2}
.tool-card h3{font-size:18px;font-weight:780;margin:16px 0 7px;color:#1a3439}
.tool-card p{color:#647879;line-height:1.48}.tool-card-action{margin-top:auto;padding-top:17px;color:#0b675c;font-size:12px;font-weight:850;display:flex;justify-content:space-between;align-items:center}
.tool-card-action span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#e9f5ef;font-size:18px;transition:transform .2s}.tool-card:hover .tool-card-action span{transform:translate(2px,-2px)}
.tool-card .tiny-tag{right:24px;top:90px;background:#fff4d9;color:#926018;font-weight:800;border-radius:999px;padding:3px 9px}
.work-title .tool-icon{border-radius:16px;box-shadow:0 9px 17px #123e341c}
.panel,.chart-box{box-shadow:0 5px 22px #173d340a}
@media(max-width:780px){.hero{padding:29px 24px;gap:25px;margin-top:15px}.hero h1{font-size:clamp(40px,8vw,56px)}.quick-start{padding:24px}.tool-card{min-height:220px}.quota-strip{line-height:1.65}}
@media(max-width:490px){.hero{padding:24px 20px;border-radius:20px}.hero h1{font-size:40px}.hero p{font-size:15px}.hero .eyebrow{font-size:10px;letter-spacing:.08em}.hero-image-actions .btn{font-size:12px}.promo-free{font-size:11px}.tool-card{padding:18px;min-height:215px}.tool-card .tiny-tag{top:82px;right:14px}.quota-strip{font-size:12px;padding:8px 10px}}
@media(prefers-reduced-motion:reduce){.quota-offer,.promo-free,.promo-inline{animation:none}.tool-card,.tool-card-action span{transition:none}}
.generated-code{display:block;font-size:clamp(2.6rem,7vw,4.5rem);font-weight:850;letter-spacing:.22em;line-height:1.25;color:#075b50;font-variant-numeric:tabular-nums;text-align:center;padding:12px 4px}.generated-code+.small-note{display:block;text-align:center}.admin-invite-row form{display:inline}