.expertise.section{padding-top:100px;padding-bottom:100px;background:transparent;border-radius:0;display:grid;grid-template-columns:1fr 1.05fr;gap:6%;align-items:center}
.expertise .section-top{text-align:left}.expertise .section-top h2{font-size:clamp(34px,3.3vw,50px);line-height:1.15;margin:0 0 42px;letter-spacing:-.055em}.expertise .section-top .muted{color:#142c46}
.service-choice{border-bottom:1px solid #dde4ee;position:relative}.service-choice button{width:100%;display:flex;align-items:center;gap:14px;text-align:left;border:0;background:none;padding:23px 0;color:#7a899c;font-weight:650;font-size:17px;line-height:1.4}.service-choice button[aria-expanded=true]{color:#142c46}.service-choice button .choice-icon{font-size:19px;width:24px;color:#8a79d5}.service-choice button .choice-plus{margin-left:auto;font-size:23px;font-weight:400}.choice-body{padding:0 28px 23px 38px}.choice-body p{font-size:14px;line-height:1.8;color:#536980;margin:0 0 15px}.choice-body ul{list-style:none;padding:0;margin:0;display:flex;gap:6px 16px;flex-wrap:wrap;font-size:11px;color:#65768b}.choice-body li:before{content:'· ';color:#8371ce}.service-choice:after{content:'';position:absolute;bottom:-1px;left:0;height:2px;width:100%;background:linear-gradient(90deg,#11b6c4,#a79efd);transform:scaleX(0);transform-origin:left;transition:transform .75s cubic-bezier(.22,1,.36,1)}.service-choice.active:after{transform:scaleX(1)}
.showcase-contact{display:inline-flex;align-items:center;gap:22px;font-size:12px;font-weight:650;margin-top:26px;color:#244b76}
.service-stage{position:relative;isolation:isolate;min-width:0;aspect-ratio:1/1.08;border-radius:36px;background:#234b76;overflow:hidden;box-shadow:0 20px 60px #1c4b7810;display:grid;place-items:center;padding:42px 30px}
.stage-gradient{position:absolute;inset:0;z-index:-1;transition:opacity 1s ease;opacity:0;background:radial-gradient(ellipse at 0% 55%,#ffd1d6,transparent 62%),radial-gradient(ellipse at 100% 45%,#5ca5ec,transparent 64%),radial-gradient(ellipse at 60% 110%,#c4a9ff,transparent 65%),linear-gradient(150deg,#173958,#386caa 45%,#c4b6f5)}.stage-gradient.on{opacity:1}.stage-gradient:nth-child(2){background:radial-gradient(ellipse at 0 70%,#ffb899,transparent 60%),radial-gradient(ellipse at 100% 40%,#ec9bbc,transparent 62%),radial-gradient(ellipse at 60% 110%,#f2d5a1,transparent 65%),linear-gradient(140deg,#64334f,#a65e80 45%,#e9b8c4)}.stage-gradient:nth-child(3){background:radial-gradient(ellipse at 0 70%,#d9e5a2,transparent 60%),radial-gradient(ellipse at 100% 40%,#6bd4bb,transparent 62%),radial-gradient(ellipse at 65% 110%,#9bc5ed,transparent 65%),linear-gradient(145deg,#174b4b,#3d8d81 55%,#c7e3c0)}
.demo-scene{width:100%;position:relative;color:#17314d;animation:scene-arrive .7s cubic-bezier(.22,1,.36,1) both}.demo-sheet{background:#fffffff5;border:1px solid #fff;border-radius:24px;padding:27px;box-shadow:0 22px 55px #19365525,0 0 0 5px #ffffff38;position:relative}.demo-sheet h3{font-size:23px;letter-spacing:-.7px;font-weight:650;margin:0 0 24px;line-height:1.2}.demo-label{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:#77839a;margin:0 0 12px}.map-inputs{display:grid;grid-template-columns:1fr 1fr;gap:10px}.map-inputs span{background:#f0edf9;padding:16px 10px;border-radius:12px;font-size:12px;text-align:center}.map-flow{display:block;width:100%;height:58px;fill:none;stroke:#a79efd;stroke-width:2;stroke-dasharray:200;stroke-dashoffset:200;animation:draw-flow 1.3s ease .3s forwards}.map-result{background:linear-gradient(110deg,#e2f7f6,#ece7fc);border:1px solid #d7e5ef;border-radius:14px;padding:20px;font-weight:650;text-align:center;font-size:18px;animation:result-arrive .7s ease .8s both}.map-result small{display:block;font-size:11px;font-weight:400;margin-top:7px;color:#5e7088}.demo-caption{position:relative;margin:22px auto 0;width:max-content;max-width:95%;padding:13px 18px;background:#fff;border-radius:12px;box-shadow:0 12px 30px #19365512;font-size:12px;animation:result-arrive .7s ease 1.2s both}
.demo-browser-bar{display:flex;gap:5px;border-bottom:1px solid #e4e7ee;padding-bottom:16px;margin-bottom:19px}.demo-browser-bar i{width:6px;height:6px;border-radius:50%;background:#d5dce6}.demo-brand{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:700;margin-bottom:18px}.demo-brand span{width:25px;height:25px;border-radius:8px;background:linear-gradient(130deg,#eea28d,#ac79a9)}.demo-web-hero{background:linear-gradient(125deg,#fbe1cf,#ecc9e1);padding:25px 20px;border-radius:14px}.demo-web-hero strong{display:block;font-size:24px;line-height:1.2;max-width:210px}.demo-web-hero em{display:inline-block;background:#fff;border-radius:8px;padding:10px 13px;margin-top:18px;font-size:10px;font-style:normal;animation:result-arrive .7s ease .7s both}.touchpoints{display:flex;justify-content:space-between;gap:8px;margin-top:18px}.touchpoints span{border:1px solid #e7dfea;border-radius:8px;padding:10px;font-size:10px;animation:result-arrive .7s ease .4s both}.touchpoints span:nth-child(2){animation-delay:.6s}.touchpoints span:nth-child(3){animation-delay:.8s}
.activation-step{display:flex;align-items:center;gap:14px;padding:15px 0;border-bottom:1px solid #e3ece9;font-size:14px;animation:result-arrive .65s ease both}.activation-step:nth-of-type(2){animation-delay:.35s}.activation-step:nth-of-type(3){animation-delay:.7s}.activation-step b{display:grid;place-items:center;border-radius:50%;background:#e3f4ed;color:#347964;width:32px;height:32px;font-size:13px}.activation-step small{display:block;font-size:10px;color:#6e8190;margin-top:5px}.loop-path{width:100%;height:55px;fill:none;stroke:#5aa58b;stroke-width:2;stroke-dasharray:400;stroke-dashoffset:400;animation:draw-flow 1.4s ease 1s forwards}.loop-note{text-align:center;font-size:12px;color:#397361;margin:0}
@keyframes scene-arrive{from{opacity:0;transform:translateY(22px) scale(.98)}to{opacity:1;transform:none}}@keyframes result-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes draw-flow{to{stroke-dashoffset:0}}
@media(max-width:1000px){.expertise.section{gap:5%;padding-left:28px;padding-right:28px}.service-stage{padding:32px 20px}.demo-sheet{padding:20px}.demo-sheet h3{font-size:20px}.service-choice button{font-size:15px}.choice-body{padding-left:0}}
@media(max-width:750px){.expertise.section{display:flex;flex-direction:column;gap:35px;padding:65px 8px}.showcase-copy{width:100%;padding:0 12px}.expertise .section-top h2{font-size:35px;margin-bottom:26px}.service-stage{width:100%;max-width:510px;aspect-ratio:auto;min-height:480px;border-radius:28px}.demo-scene{max-width:390px}.service-choice button{padding:19px 0}.choice-body p{font-size:14px}.demo-sheet{padding:25px}.demo-sheet h3{font-size:22px}}
@media(prefers-reduced-motion:reduce){.demo-scene,.demo-scene *{animation:none!important;stroke-dashoffset:0}.stage-gradient,.service-choice:after{transition:none}}
/* Titres éditoriaux et parcours piloté par le défilement. */
.expertise.section{display:block;padding-top:85px;padding-bottom:85px;position:relative}
.showcase-sticky{display:grid;grid-template-columns:1fr 1.05fr;gap:6%;align-items:center}
.expertise .section-top h2{font-size:clamp(23px,2.3vw,33px);font-weight:500;line-height:1.2;margin-bottom:28px;color:#657b94}.expertise .section-top .muted{color:inherit}
.service-choice{border-color:#e5eaf1}.service-choice button{font-family:'Plus Jakarta Sans',sans-serif;font-size:clamp(25px,2.7vw,39px);font-weight:600;letter-spacing:-.055em;line-height:1.16;padding:22px 0;color:#96a3b4;transition:color .4s}
.service-choice button[aria-expanded=true]{color:#173959}.service-choice:nth-of-type(3) button[aria-expanded=true]{color:#89506e}.service-choice:nth-of-type(4) button[aria-expanded=true]{color:#347b66}
.service-choice button .choice-plus{font-size:22px;color:#9aa9ba;margin-left:auto;letter-spacing:0}.choice-body{padding:0 24px 25px 0}.choice-body p{font-size:15px;line-height:1.75;max-width:430px}.choice-body ul{display:grid;grid-template-columns:1fr;gap:10px;font-size:16px;line-height:1.45;margin-top:20px}.choice-body li{display:flex;align-items:baseline;gap:11px;padding:0;background:none;border-radius:0;color:#173959;font-weight:600}.choice-body li:before{content:'✓';flex:0 0 19px;align-self:center;display:grid;place-items:center;width:19px;height:19px;border-radius:50%;background:#e7f5f6;color:#16818d;font-size:12px;font-weight:700;line-height:1}.service-choice:nth-of-type(3) .choice-body li:before{background:#f8ebf2;color:#985377}.service-choice:nth-of-type(4) .choice-body li:before{background:#e7f5ed;color:#347b66}.showcase-contact{margin-top:24px}
.expertise.scroll-story{height:calc(var(--story-height) + var(--story-travel) + 80px);padding-top:40px;padding-bottom:40px}
.scroll-story .showcase-sticky{position:sticky;top:var(--story-top,110px);min-height:var(--story-height)}
@media(max-width:850px){.showcase-sticky{display:flex;flex-direction:column;gap:30px}.expertise.section{padding:65px 8px}.showcase-copy{width:100%;padding:0 12px}.expertise .section-top h2{font-size:25px}.service-choice button{font-size:30px}.choice-body p{font-size:14px}.service-stage{max-width:510px;width:100%}.showcase-contact{margin-bottom:8px}}

/* Respiration entre le bandeau et les services, sans modifier le parcours sticky. */
.expertise.section{margin-top:55px}@media(max-width:850px){.expertise.section{margin-top:30px}}

/* Séparation franche sur desktop avant la séquence des services. */
@media(min-width:851px){.expertise.section{margin-top:60px}}

/* Chaque axe reprend la palette de sa scène. */
.service-choice{--axis-gradient:linear-gradient(110deg,#147e9c 0%,#3267c8 48%,#8057ba 100%)}
.service-choice:nth-of-type(3){--axis-gradient:linear-gradient(110deg,#8d477d 0%,#b14973 50%,#b56436 100%)}
.service-choice:nth-of-type(4){--axis-gradient:linear-gradient(110deg,#347b50 0%,#178177 52%,#247999 100%)}
.service-choice .choice-title{min-width:0;padding-bottom:.08em;margin-bottom:-.08em;background:none;color:#96a3b4;-webkit-text-fill-color:currentColor}
.service-choice button[aria-expanded=true] .choice-title{background-image:var(--axis-gradient);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
@media(prefers-reduced-motion:reduce){.service-choice .choice-title{transition:none}}
@media(forced-colors:active){.service-choice button .choice-title{background:none;color:ButtonText;-webkit-text-fill-color:ButtonText;opacity:1}}
/* A quieter editorial navigation: one clear active axis, fewer competing marks. */
.showcase-copy{padding-right:2%}
.expertise .section-top h2{font-size:clamp(20px,1.7vw,25px);line-height:1.4;font-weight:450;letter-spacing:-.035em;margin-bottom:32px;color:#657b94}
.service-choice{border-bottom:1px solid #e9edf2}
.service-choice:after{display:none}
.service-choice button{font-size:clamp(23px,2.1vw,30px);font-weight:550;letter-spacing:-.04em;line-height:1.3;padding:23px 0;gap:20px}
.service-choice button .choice-plus{font-size:18px;font-weight:400;color:#a4afbc}
.service-choice button[aria-expanded=true]{padding-bottom:14px}
.choice-body{padding:0 30px 28px 0}
.choice-body p{font-size:15px;line-height:1.7;max-width:390px;margin:0 0 18px;color:#617287}
.choice-body ul{display:grid;grid-template-columns:1fr;gap:5px;margin:0;font-size:14px;line-height:1.6;max-width:420px}
.choice-body li{display:inline;color:#28445d;font-weight:550;padding:0;background:none}
.choice-body li:before{content:none;display:none}
.choice-body li+li:before{content:none;display:none}
.showcase-contact{font-size:13px;font-weight:600;gap:13px;margin-top:28px;color:#28445d}
.showcase-contact span{transition:transform .25s ease}
.showcase-contact:hover span{transform:translateX(4px)}
@media(max-width:850px){.showcase-copy{padding:0 12px}.expertise .section-top h2{font-size:21px;margin-bottom:22px}.service-choice button{font-size:25px;padding:20px 0}.choice-body{padding-right:12px;padding-bottom:24px}.choice-body ul{font-size:14px;max-width:360px}}
@media(prefers-reduced-motion:reduce){.showcase-contact span{transition:none}}
