@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;font-stretch:75% 100%;src:url(../fonts/bricolage-grotesque-vietnamese-standard-normal.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;font-stretch:75% 100%;src:url(../fonts/bricolage-grotesque-latin-ext-standard-normal.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;font-stretch:75% 100%;src:url(../fonts/bricolage-grotesque-latin-standard-normal.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:DM Sans Variable;font-style:normal;font-display:swap;font-weight:100 1000;src:url(../fonts/dm-sans-latin-ext-wght-normal.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:DM Sans Variable;font-style:normal;font-display:swap;font-weight:100 1000;src:url(../fonts/dm-sans-latin-wght-normal.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--paper:#fffbf9;--ink:#422f36;--purple:#7b62b8;--orange:#f05136;--yellow:#f6d732;--pink:#f26a90;--blue:#a9ddec;--display:"Bricolage Grotesque Variable", sans-serif;--body:"DM Sans Variable", sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);font-family:var(--body);margin:0}button,input,textarea{font:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}img{display:block}h1,h2,h3,p{margin:0}em{font-style:normal}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.page-shell{background:var(--paper);width:100%;margin-inline:auto;overflow:clip}.eyebrow{background:var(--yellow);min-height:32px;color:var(--ink);text-transform:uppercase;letter-spacing:2.16px;white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;padding:6px 20px;font-size:12px;font-weight:800;display:inline-flex}.pill-button{white-space:nowrap;border:2px solid #0000;border-radius:999px;justify-content:center;align-items:center;gap:14px;min-height:61px;padding:0 29px;font-size:16px;font-weight:800;transition:transform .2s,box-shadow .2s;display:inline-flex}.pill-button:hover,.pill-button:focus-visible{transform:translateY(-3px);box-shadow:0 9px 22px #422f3624}.pill-button--yellow{background:var(--yellow);color:var(--ink)}.pill-button--outline{color:#fff;background:0 0;border-color:#fff}:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}.hero{z-index:2;height:694px;position:relative}.hero-panel{background:var(--purple);color:#fff;border-radius:50px;height:738px;position:absolute;inset:37px 41px auto 44px}.site-header{z-index:5;height:60px;color:var(--ink);background:#fff;border-radius:999px;justify-content:space-between;align-items:center;padding:0 39px;display:flex;position:absolute;top:26px;left:102px;right:101px}.brand{color:var(--purple);font-family:var(--display);letter-spacing:-1.2px;font-size:28px;font-weight:800;line-height:1}.desktop-nav{align-items:center;gap:30px;font-size:14px;font-weight:500;display:flex}.desktop-nav a:hover{color:var(--purple)}.nav-dropdown{position:relative}.nav-dropdown>summary{cursor:pointer;white-space:nowrap;align-items:center;gap:6px;list-style:none;display:inline-flex}.nav-dropdown>summary::-webkit-details-marker{display:none}.nav-dropdown>summary:after{content:"⌄";font-size:17px;line-height:.6;transition:transform .2s;display:inline-block;transform:translateY(-2px)}.nav-dropdown[open]>summary:after{transform:translateY(1px)rotate(180deg)}.nav-dropdown>summary:hover,.nav-dropdown>summary.is-active{color:var(--purple)}.nav-dropdown>summary.is-active{font-weight:800}.nav-dropdown-panel{z-index:30;width:272px;color:var(--ink);background:#fff;border:1px solid #eee3e1;border-radius:18px;gap:1px;padding:10px;font-size:14px;font-weight:500;display:grid;position:absolute;top:calc(100% + 18px);left:-18px;box-shadow:0 18px 36px #422f3629}.nav-dropdown-panel a{white-space:normal;border-radius:9px;justify-content:space-between;align-items:center;min-height:39px;padding:8px 11px;display:flex}.nav-dropdown-panel a:hover,.nav-dropdown-panel a:focus-visible{color:var(--purple);background:#f6f0fa}.nav-dropdown-panel .nav-dropdown-overview{border-bottom:1px solid #e8dddf;border-radius:0;margin-bottom:4px;font-weight:800}.nav-mobile-group>summary{cursor:pointer;list-style:none}.nav-mobile-group>summary::-webkit-details-marker{display:none}.nav-mobile-submenu{border-left:2px solid #e5d9e9;gap:2px;padding:1px 0 9px 9px;display:grid}.nav-mobile-submenu a{font-size:13px;line-height:1.3}.nav-mobile-submenu a:hover,.nav-mobile-submenu a:focus-visible{color:var(--purple)}.nav-mobile-list>a[aria-current=page]{color:var(--purple);font-weight:800}.mobile-nav{display:none}.hero-content h1{z-index:1;width:calc(100% - 290px);font-family:var(--display);letter-spacing:-2.4px;text-transform:uppercase;white-space:nowrap;text-align:center;font-size:124px;font-weight:800;line-height:102px;position:absolute;top:226px;left:145px}.hero-content h1 em{color:var(--yellow)}.hero-sticker{z-index:2;font-family:var(--display);letter-spacing:-1.5px;text-transform:uppercase;white-space:nowrap;border-radius:100px;padding:5px 26px 8px;font-size:48px;font-weight:800;line-height:1;display:inline-block;position:absolute}.sticker-design{background:var(--orange);color:#fff;top:176px;left:880px;transform:rotate(-11deg)}.sticker-dev{background:var(--pink);color:#241b20;top:408px;left:21px;transform:rotate(7deg)}.sticker-acquisition{color:var(--purple);background:#fff;top:415px;right:79px;transform:rotate(-7deg)}.hero-intro{text-align:center;width:520px;font-size:18px;font-weight:500;line-height:28px;position:absolute;top:469px;left:50%;transform:translate(-50%)}.hero-actions{align-items:center;gap:12px;display:flex;position:absolute;top:596px;left:50%;transform:translate(-50%)}.services{min-height:1190px;padding:225px 0 110px;position:relative}.services-heading{text-align:center}.services-heading h2{font-family:var(--display);letter-spacing:-1.92px;text-transform:uppercase;margin-top:14px;font-size:96px;font-weight:800;line-height:.9}.services-heading p{margin-top:22px;font-size:18px;font-weight:500}.service-list{width:1152px;max-width:90%;margin:22px auto 0}.service-row{border-bottom:1px solid #c9bdbe}.service-row summary{letter-spacing:-1px;text-transform:uppercase;cursor:pointer;grid-template-columns:114px 1fr;align-items:center;min-height:143px;font-size:36px;font-weight:500;list-style:none;display:grid}.service-row summary::-webkit-details-marker{display:none}.service-plus{font-size:34px;font-weight:500;line-height:1;transition:transform .2s}.service-row[open] .service-plus{transform:rotate(45deg)}.service-row p{max-width:800px;padding:0 25px 28px 114px;font-size:18px;line-height:1.45}.service-detail-link{border-bottom:2px solid;align-items:center;gap:10px;margin:0 0 28px 114px;padding-bottom:4px;font-size:15px;font-weight:800;display:inline-flex}.service-detail-link:hover{color:var(--purple)}.process{height:537px;position:relative}.process-heading{text-align:center;position:absolute;top:0;left:50%;transform:translate(-50%)}.process-heading h2{font-family:var(--display);letter-spacing:-2px;text-transform:uppercase;white-space:nowrap;margin-top:24px;font-size:96px;font-weight:800;line-height:.9}.process-heading h2 em{color:var(--orange)}.process-dotted{width:900px;height:97px;position:absolute;top:340px;left:267px}.process-curved-arrow{width:78px;height:35px;position:absolute;top:223px;left:526px}.process-arrow-head{width:18px;height:18px;position:absolute;top:241px;left:592px;transform:rotate(45deg)}.process-cards{grid-template-columns:repeat(3,1fr);align-items:center;gap:27px;width:870px;display:grid;position:absolute;top:303px;left:292px}.process-card{border-radius:34px;height:260px;padding:29px 28px;box-shadow:0 20px 35px -23px #422f3659}.process-card--orange{color:#fff;background:#d43b22;transform:rotate(-3deg)}.process-card--yellow{background:var(--yellow);color:var(--ink);transform:rotate(2deg)}.process-card--purple{background:var(--purple);color:#fff;transform:rotate(-2deg)}.process-card-top{justify-content:space-between;align-items:start;display:flex}.process-card-top strong{font-family:var(--display);font-size:60px;font-weight:800;line-height:.9}.card-symbol{background:#fff8ef;border-radius:50%;place-items:center;width:56px;height:56px;display:grid}.process-card h3{font-family:var(--display);text-transform:uppercase;letter-spacing:-.48px;margin-top:17px;font-size:24px;font-weight:800;line-height:1}.process-card p{margin-top:11px;font-size:14px;line-height:19px}.interlude{height:461px;position:relative}.wave-ribbon{width:1690px;height:235px;position:absolute;left:50%;transform:translate(-50%)}.interlude--first .wave-ribbon{top:43px}.wave-ribbon>img,.wave-ribbon>svg{width:100%;height:100%;position:absolute;inset:0}.wave-ribbon>svg path{fill:none}.wave-ribbon text{fill:#fff;font-family:var(--body);letter-spacing:1px;font-size:27px;font-weight:500}.interlude-star{font-size:46px;line-height:1;position:absolute;top:300px;right:10%}.work-intro{height:289px;padding-left:147px}.work-intro h2{font-family:var(--display);letter-spacing:-1.8px;text-transform:uppercase;margin-top:19px;font-size:90px;font-weight:800;line-height:.96}.work-intro h2 em{color:var(--orange)}.project{position:relative;overflow:hidden}.project-topline{z-index:5;text-transform:uppercase;letter-spacing:2.2px;justify-content:space-between;font-size:12px;font-weight:500;display:flex;position:absolute;top:128px;left:69px;right:70px}.project h2{z-index:3;font-family:var(--display);text-transform:uppercase;letter-spacing:-3px;font-weight:800;position:absolute}.project-visual{position:absolute;overflow:hidden}.project-visual>img{object-fit:cover;width:100%;height:100%}.visual-arrow{background:var(--orange);border-radius:50%;place-items:center;width:80px;height:80px;display:grid;position:absolute;bottom:34px;right:34px}.visual-arrow img{width:34px;height:34px}.project--auberge .visual-arrow{background:var(--purple)}.project--manchots .visual-arrow{background:var(--blue)}.project--tour .visual-arrow{background:var(--ink)}.project-cutout{z-index:4;pointer-events:none;object-fit:contain;position:absolute}.project-bottom{grid-template-columns:37% 43% 1fr;align-items:start;gap:10px;display:grid;position:absolute;bottom:124px;left:69px;right:73px}.project-tags{flex-wrap:wrap;gap:7px;display:flex}.project-tags span{letter-spacing:1.1px;text-transform:uppercase;white-space:nowrap;border:1px solid;border-radius:100px;padding:8px 12px;font-size:12px;line-height:1}.project-bottom p{max-width:550px;font-size:18px;line-height:28px}.project-link{color:inherit;white-space:nowrap;background:0 0;border:0;border-bottom:2px solid;place-self:end;align-items:center;gap:10px;padding:0 0 4px;font-size:16px;font-weight:700;display:inline-flex}.project-link img{width:20px;height:20px}.project-link:hover{opacity:.72}.project--gustus{background:var(--orange);color:#fff9f0;height:1358px}.project--gustus h2{font-size:176px;line-height:.86;top:181px;left:69px}.project-visual--gustus{border-radius:24px;height:653px;top:463px;left:69px;right:73px}.project-cutout--eclair{width:390px;height:390px;top:208px;right:-80px;transform:rotate(12deg)}.project--gustus.is-in-view .project-cutout--eclair{animation:.3s linear forwards eclair-tilt}@keyframes eclair-tilt{0%{transform:rotate(12deg)}to{transform:rotate(-8deg)}}.project--gustus .project-bottom{bottom:124px}.project--gustus .project-bottom p{max-width:505px}.project--auberge{background:var(--purple);color:#fff9f0;height:1108px}.project--auberge h2{max-width:760px;font-size:116px;line-height:.93;top:375px;left:69px}.project-visual--auberge{border-radius:270px 270px 18px 18px;width:553px;height:693px;top:184px;left:815px}.project-cutout--plat{width:320px;height:300px;top:742px;left:605px}.project--auberge .project-bottom{display:block;inset:610px 73px auto 77px}.project--auberge .project-bottom p{max-width:665px;margin-top:27px}.project--auberge .project-link{position:absolute;top:365px;right:0}.project--manchots{background:var(--blue);color:#212d5e;height:1292px}.project--manchots h2{white-space:nowrap;font-size:160px;line-height:.9;top:189px;left:145px}.project-visual--manchots{height:810px;top:270px;left:69px;right:73px;transform:rotate(-1deg)}.project-visual--manchots>img{object-fit:cover}.project-cutout--ice{width:260px;height:260px;top:370px;right:-18px}.project--manchots .project-bottom{bottom:95px}.project--tour{background:var(--yellow);height:1219px;color:var(--ink)}.project-visual--tour{height:556px;top:181px;left:69px;right:73px}.project--tour h2{white-space:nowrap;transform-origin:0;font-size:158px;line-height:.95;top:770px;left:69px;transform:scaleX(1.1)}.project--tour .project-bottom{bottom:198px}.project-cutout--bulles{width:330px;height:190px;bottom:39px;right:213px}.approach{height:1174px;position:relative}.approach-heading{position:absolute;top:173px;left:141px;right:90px}.approach-heading h2{font-family:var(--display);letter-spacing:-1.92px;text-transform:uppercase;white-space:nowrap;margin-top:21px;font-size:96px;font-weight:800;line-height:.9}.approach-heading h2 em{font-weight:400}.approach-changing-word{transition:opacity .25s,transform .25s;display:inline-block}.approach-changing-word.is-changing{opacity:0;transform:translateY(-.18em)}.approach-lead{margin-top:24px;font-size:26px;font-weight:800}.approach-copy{margin-top:26px;font-size:18px;line-height:28px}.approach-cards{grid-template-columns:repeat(4,1fr);gap:22px;display:grid;position:absolute;top:545px;left:37px;right:72px}.approach-card{z-index:1;border-radius:32px;height:324px;padding:28px;position:relative;box-shadow:0 20px 40px -20px #422f3659}.approach-card--purple{background:var(--purple);color:#fff;transform:rotate(-5deg)translateY(36px)}.approach-card--pink{color:var(--ink);background:#efa5b9}.approach-card--yellow{background:var(--yellow);color:var(--ink);transform:rotate(4deg)translateY(21px)}.approach-card--orange{background:var(--orange);color:#fff;transform:rotate(-1deg)translateY(11px)}.approach-card strong{font-family:var(--display);font-size:60px;font-weight:800;line-height:1;display:block}.approach-card h3{max-width:260px;font-family:var(--display);text-transform:uppercase;letter-spacing:-.48px;margin-top:22px;font-size:24px;font-weight:800;line-height:1}.approach-card p{margin-top:12px;font-size:14px;line-height:20px}.approach-art{z-index:2;pointer-events:none;object-fit:contain;position:absolute}.approach-art--designer{width:243px;height:243px;top:746px;left:106px}.approach-art--device{width:199px;height:179px;top:510px;left:498px}.approach-art--envelope{width:218px;height:218px;top:778px;left:781px}.approach-art--hands{width:242px;height:242px;top:440px;left:1160px}.wave-ribbon--second{z-index:3;top:905px}.team{height:1133px;position:relative}.team h2{width:1150px;font-family:var(--display);letter-spacing:-2.4px;text-transform:uppercase;text-align:center;font-size:90px;font-weight:800;line-height:1.13;position:absolute;top:139px;left:146px}.team h2 em{color:#81777b}.team h2.scroll-reveal{opacity:0;transition:opacity .9s}.team h2.scroll-reveal.is-visible{opacity:1}.team-cards{grid-template-columns:repeat(3,367px);gap:41px;display:grid;position:absolute;top:480px;left:128px;right:124px}.team-card{background:#fff;border-radius:5px;height:440px;padding:28px;position:relative;box-shadow:2px 4px 3px #0000003b}.team-card--anais{transform:rotate(-4deg)translateY(35px)}.team-card--benjamin{transform:rotate(.2deg)}.team-card--julia{transform:rotate(3deg)translateY(12px)}.team-photo{background:#d9d9d9;height:281px}.team-card h3{font-family:var(--body);text-transform:uppercase;letter-spacing:1px;margin-top:22px;font-size:15px;font-weight:900;line-height:20px}.team-card--anais h3{color:#876300}.team-card p{margin-top:10px;font-size:16px;font-weight:500;line-height:22px}.team-role{z-index:2;letter-spacing:2px;text-transform:uppercase;white-space:nowrap;border-radius:100px;padding:9px 20px;font-size:12px;font-weight:800;position:absolute;top:55px;left:-25px}.team-role--yellow{background:var(--yellow);color:var(--ink)}.team-role--pink{background:var(--pink);color:#241b20;top:35px}.team-role--orange{background:var(--orange);color:#241b20;top:245px;left:215px}.team-role--purple{background:var(--purple);color:#fff;left:230px}.contact{background:var(--purple);color:#fff;border-radius:50px;flex-direction:column;justify-content:center;align-items:center;width:1152px;height:593px;margin-left:144px;display:flex}.contact h2{font-family:var(--display);letter-spacing:-1.92px;text-transform:uppercase;text-align:center;font-size:96px;font-weight:800;line-height:.9}.contact h2 em{color:var(--yellow)}.contact p{margin-top:33px;font-size:30px;font-weight:700}.contact-button{text-transform:uppercase;border:0;margin-top:41px;box-shadow:0 5px #422f362e}.contact-button img{width:20px;height:20px}.site-footer{height:440px;padding:64px 144px 0;position:relative}.footer-main{border-top:1px solid #d8d0d2;justify-content:space-between;align-items:center;padding-top:43px;display:flex}.footer-logo{font-family:var(--display);color:#151515;letter-spacing:-2px;font-size:48px;font-weight:800}.footer-socials{gap:9px;display:flex}.footer-socials a{color:#241b20;border-radius:50%;place-items:center;width:44px;height:44px;font-size:26px;font-weight:700;display:grid}.footer-socials a:first-child{background:var(--pink)}.footer-socials a:last-child{background:var(--orange);font-family:Arial,sans-serif;font-size:24px}.footer-socials img{width:16px;height:16px}.site-footer>p{text-align:center;color:#66575d;margin-top:18px;font-size:14px;line-height:20px}.footer-watermark{text-align:center;width:1916px;font-family:var(--display);letter-spacing:-1.44px;text-transform:uppercase;white-space:nowrap;color:#7b62b817;font-size:290px;font-weight:800;line-height:1;position:absolute;top:281px;left:-207px}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}@media (width<=1360px){.page-shell{overflow:hidden}.hero,.services,.process,.interlude,.work-intro,.project,.approach,.team,.site-footer{height:auto}.hero{padding:16px}.hero-panel{border-radius:32px;height:auto;min-height:660px;padding:22px;position:relative;inset:auto}.site-header{width:100%;height:60px;padding-inline:24px;position:relative;inset:auto}.desktop-nav{gap:14px;font-size:12px}.hero-content{text-align:center;min-height:510px;padding-top:92px;position:relative}.hero-content h1{letter-spacing:-.025em;white-space:normal;width:100%;font-size:clamp(55px,8.6vw,105px);line-height:.9;position:relative;inset:auto}.hero-sticker{font-size:clamp(22px,3.6vw,40px)}.sticker-design{top:40px;left:auto;right:6%}.sticker-dev{top:235px;left:0}.sticker-acquisition{top:250px;right:2%}.hero-intro{width:auto;margin-top:110px;position:relative;inset:auto;transform:none}.hero-actions{flex-wrap:wrap;justify-content:center;margin-top:36px;position:relative;inset:auto;transform:none}.services{min-height:0;padding:130px 7% 100px}.services-heading h2,.process-heading h2,.approach-heading h2,.contact h2{font-size:clamp(58px,8vw,96px)}.service-list{width:100%;max-width:100%}.service-row summary{grid-template-columns:65px 1fr;min-height:110px;font-size:clamp(24px,4vw,36px)}.service-row p{padding-left:65px}.service-detail-link{margin-left:65px}.process{padding:50px 5% 70px}.process-heading,.process-cards{position:relative;inset:auto;transform:none}.process-dotted,.process-curved-arrow,.process-arrow-head{display:none}.process-cards{gap:16px;width:100%;margin-top:55px}.process-card{height:275px}.interlude{height:330px}.interlude--first .wave-ribbon{top:55px}.interlude-star{display:none}.work-intro{padding:0 7% 60px}.work-intro h2{font-size:clamp(57px,8vw,90px)}.project{min-height:820px;padding:100px 5% 70px}.project-topline{top:55px;left:5%;right:5%}.project h2{font-size:clamp(72px,11vw,125px);line-height:.85;position:relative;inset:auto}.project-visual{aspect-ratio:1.85;border-radius:20px;width:100%;height:auto;margin-top:25px;position:relative;inset:auto;transform:none}.project-visual--auberge{aspect-ratio:auto;border-radius:240px 240px 18px 18px;width:48%;height:620px;margin-left:auto}.project--auberge h2{font-size:clamp(70px,9vw,110px);position:absolute;top:340px;left:5%}.project--tour h2{transform:none}.project-cutout--eclair{width:260px;height:260px;top:140px}.project-cutout--plat{width:210px;height:210px;top:525px;left:47%}.project-cutout--ice{width:190px;height:190px;top:170px}.project-cutout--bulles{width:240px;height:160px;bottom:0;right:15%}.project-bottom,.project--auberge .project-bottom,.project--tour .project-bottom{grid-template-columns:1fr 1.5fr auto;gap:20px;margin-top:34px;display:grid;position:relative;inset:auto}.project--gustus .project-bottom,.project--manchots .project-bottom{bottom:auto}.project-bottom p,.project--auberge .project-bottom p{margin:0}.project--auberge .project-link{position:relative;inset:auto}.approach{padding:100px 5% 170px}.approach-heading,.approach-cards{position:relative;inset:auto}.approach-heading h2{white-space:normal}.approach-cards{grid-template-columns:repeat(2,1fr);gap:24px;margin-top:60px;display:grid}.approach-card{transform:none}.approach-art{display:none}.wave-ribbon--second{top:auto;bottom:0}.team{padding:80px 5% 140px}.team h2{width:auto;font-size:clamp(58px,7vw,90px);position:relative;inset:auto}.team-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:35px 20px;max-width:820px;margin:100px auto 0;position:relative;inset:auto}.team-card{justify-self:center;width:min(100%,367px);height:440px}.team-card--julia{grid-column:1/-1}.team-photo{height:260px}.team-role{font-size:10px}.team-role--orange,.team-role--purple{left:auto;right:-10px}.contact{width:90%;height:520px;margin:0 auto}.site-footer{padding:64px 5% 180px}.footer-watermark{width:120%;font-size:22vw;top:220px;left:-10%}}@media (width<=700px){.hero{padding:12px}.hero-panel{border-radius:28px;min-height:700px;padding:12px}.site-header{height:56px;padding-inline:20px}.brand{font-size:25px}.desktop-nav{display:none}.mobile-nav{display:block;position:relative}.mobile-nav summary{cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:44px;height:44px;list-style:none;display:flex}.mobile-nav summary::-webkit-details-marker{display:none}.mobile-nav summary span{background:var(--ink);width:24px;height:2px;display:block}.mobile-nav nav{background:#fff;border-radius:17px;gap:5px;width:min(318px,100vw - 48px);max-height:min(76vh,610px);padding:15px;display:grid;position:absolute;top:50px;right:-12px;overflow-y:auto;box-shadow:0 15px 30px #00000024}.mobile-nav nav a{align-items:center;min-height:44px;padding:8px;display:flex}.hero-content{min-height:590px;padding-top:126px}.hero-content h1{letter-spacing:-1px;white-space:nowrap;width:100%;font-size:clamp(28px,8.8vw,48px);line-height:.95}.hero-sticker{padding:4px 14px;font-size:clamp(21px,6vw,30px)}.sticker-design{top:64px;right:4%}.sticker-dev{top:260px;left:-2%}.sticker-acquisition{top:18px;left:4%;right:auto}.hero-intro{margin-top:145px;font-size:16px;line-height:25px}.hero-actions{flex-direction:column;gap:10px;margin-top:26px}.pill-button{width:min(100%,320px);min-height:54px;font-size:14px}.services{padding:85px 6%}.services-heading h2,.process-heading h2,.approach-heading h2,.contact h2{font-size:clamp(46px,12vw,66px)}.services-heading p{font-size:16px}.service-list{margin-top:40px}.service-row summary{grid-template-columns:40px 1fr;min-height:90px;font-size:clamp(20px,5.2vw,29px)}.service-row p{padding-left:40px;font-size:16px}.service-detail-link{margin-left:40px}.process{padding:45px 6% 80px}.process-cards{flex-direction:column;gap:18px;margin-top:45px;display:flex}.process-dotted,.process-curved-arrow,.process-arrow-head{display:none}.process-card{width:min(100%,340px);height:auto;min-height:260px;transform:rotate(0)}.process-card:first-child{transform:rotate(-3deg)}.process-card:nth-child(2){transform:rotate(2deg)}.process-card:nth-child(3){transform:rotate(-2deg)}.interlude{height:250px}.wave-ribbon{width:900px;height:160px;left:50%}.interlude-star{display:none}.work-intro{padding:0 6% 45px}.work-intro h2{font-size:clamp(45px,10vw,70px)}.project{min-height:0;padding:75px 6% 80px}.project-topline{letter-spacing:1.5px;font-size:10px;top:35px;left:6%;right:6%}.project h2{letter-spacing:-2px;font-size:clamp(58px,13vw,90px)}.project--manchots h2{white-space:normal;font-size:clamp(49px,11.5vw,78px)}.project--tour h2{white-space:normal;margin-top:22px;font-size:clamp(52px,11vw,78px)}.project-visual{aspect-ratio:1.5}.project-visual--gustus{margin-top:25px}.project-visual--auberge{aspect-ratio:.78;width:70%;height:auto;margin-top:25px}.project--auberge h2{z-index:5;font-size:clamp(42px,11vw,62px);position:relative;inset:auto}.project-cutout--eclair{width:160px;height:160px;top:180px;right:-35px}.project-cutout--plat{width:150px;height:150px;top:340px;left:6%}.project-cutout--ice{width:130px;height:130px;top:170px;right:-20px}.project-cutout--bulles{width:180px;height:110px;bottom:-20px;right:0}.project-bottom,.project--auberge .project-bottom,.project--tour .project-bottom{flex-direction:column;gap:18px;margin-top:28px;display:flex}.project-bottom p,.project--auberge .project-bottom p{font-size:16px;line-height:24px}.project-link{align-self:flex-start;min-height:44px}.project-tags span{font-size:10px}.approach{padding:85px 6% 150px}.approach-lead{font-size:21px}.approach-copy{font-size:16px;line-height:24px}.approach-cards{flex-direction:column;align-items:center;gap:18px;display:flex}.approach-card{width:min(100%,340px);height:300px}.approach-card--purple{transform:rotate(-3deg)}.approach-card--pink{transform:rotate(2deg)}.approach-card--yellow{transform:rotate(3deg)}.approach-card--orange{transform:rotate(-2deg)}.approach-card:after{content:"";pointer-events:none;background-position:50%;background-repeat:no-repeat;background-size:contain;display:block;position:absolute}.approach-card--purple:after{background-image:url(../assets/optimized/designer.webp);width:145px;height:145px;bottom:-23px;right:-10px}.approach-card--pink:after{background-image:url(../assets/optimized/device.webp);width:115px;height:115px;top:-20px;right:-5px}.approach-card--yellow:after{background-image:url(../assets/optimized/vers-le-contact.webp);width:125px;height:125px;bottom:-25px;right:-10px}.approach-card--orange:after{background-image:url(../assets/optimized/abstract-business-hands.webp);width:125px;height:125px;top:-30px;right:-15px}.team{padding:65px 6% 110px}.team h2{font-size:clamp(40px,8.5vw,60px)}.team-cards{flex-direction:column;align-items:center;gap:45px;margin-top:70px;display:flex}.team-card{width:min(100%,367px);height:auto;min-height:415px}.team-card--julia{grid-column:auto}.team-photo{height:clamp(210px,68vw,260px)}.team-role--orange,.team-role--purple{left:auto;right:0}.contact{border-radius:32px;width:calc(100% - 24px);height:450px;padding:30px 12px}.contact p{text-align:center;font-size:23px}.contact-button{margin-top:30px}.site-footer{padding:45px 6% 170px}.footer-main{padding-top:30px}.footer-logo{font-size:38px}.footer-watermark{font-size:25vw;top:225px}}:is(.mobile-nav,.detail-mobile-nav,.contact-mobile-nav) .nav-mobile-group>summary{flex-direction:row;justify-content:space-between;align-items:center;gap:12px;width:100%;height:auto;min-height:44px;padding:8px;font-size:14px;font-weight:800;display:flex}:is(.mobile-nav,.detail-mobile-nav,.contact-mobile-nav) .nav-mobile-group>summary span{background:0 0;width:auto;height:auto;font-size:18px;line-height:1;transition:transform .2s;display:inline}:is(.mobile-nav,.detail-mobile-nav,.contact-mobile-nav) .nav-mobile-group[open]>summary span{transform:rotate(180deg)}:is(.mobile-nav,.detail-mobile-nav,.contact-mobile-nav) .nav-mobile-group>.nav-mobile-submenu{display:grid}@media (width<=360px){.sticker-acquisition{top:18px}.hero-intro{margin-top:190px}.eyebrow{letter-spacing:1.5px;padding-inline:14px;font-size:10px}.approach-heading h2 em{display:block}}@media (width>=701px) and (width<=850px){.process-card{height:330px}}@media (width>=1441px){.page-shell{--wide-inset:calc((100vw - 1440px) / 2)}.hero-panel{left:44px;right:44px}.site-header{width:1237px;left:calc(50% - 618px);right:auto}.hero-content h1{width:1150px;left:calc(50% - 575px)}.sticker-design{left:calc(50% + 160px)}.sticker-dev{left:calc(50% - 699px)}.sticker-acquisition{right:calc(50% - 641px)}.process-dotted{left:calc(50% - 450px)}.process-cards{left:calc(50% - 435px)}.process-curved-arrow{left:calc(50% - 194px)}.process-arrow-head{left:calc(50% - 128px)}.wave-ribbon{width:max(1690px,100vw + 250px)}.work-intro{padding-left:calc(var(--wide-inset) + 147px)}.project-topline{left:calc(var(--wide-inset) + 69px);right:calc(var(--wide-inset) + 70px)}.project--gustus h2,.project--auberge h2,.project--tour h2{left:calc(var(--wide-inset) + 69px)}.project--manchots h2{left:calc(var(--wide-inset) + 145px)}.project-visual--gustus,.project-visual--manchots,.project-visual--tour{left:calc(var(--wide-inset) + 69px);right:calc(var(--wide-inset) + 73px)}.project-visual--auberge{left:calc(var(--wide-inset) + 815px)}.project-cutout--eclair{right:calc(var(--wide-inset) - 80px)}.project-cutout--ice{right:calc(var(--wide-inset) - 18px)}.project-cutout--plat{left:calc(var(--wide-inset) + 605px)}.project-cutout--bulles{right:calc(var(--wide-inset) + 213px)}.project-bottom{left:calc(var(--wide-inset) + 69px);right:calc(var(--wide-inset) + 73px)}.project--auberge .project-bottom{left:calc(var(--wide-inset) + 77px);right:calc(var(--wide-inset) + 73px)}.approach-heading{left:calc(var(--wide-inset) + 141px);right:calc(var(--wide-inset) + 90px)}.approach-cards{left:calc(var(--wide-inset) + 37px);right:calc(var(--wide-inset) + 72px)}.approach-art--designer{left:calc(var(--wide-inset) + 106px)}.approach-art--device{left:calc(var(--wide-inset) + 498px)}.approach-art--envelope{left:calc(var(--wide-inset) + 781px)}.approach-art--hands{left:calc(var(--wide-inset) + 1160px)}.team h2{left:50%;transform:translate(-50%)}.team-cards{width:1188px;left:50%;right:auto;transform:translate(-50%)}.contact{margin-inline:auto}.site-footer{padding-left:calc(var(--wide-inset) + 144px);padding-right:calc(var(--wide-inset) + 144px)}.footer-watermark{left:50%;transform:translate(-50%)}}:is(.site-header,.detail-header,.contact-header){isolation:isolate}:is(.desktop-nav,.detail-nav,.contact-nav) .nav-dropdown{position:static}:is(.desktop-nav,.detail-nav,.contact-nav) .nav-dropdown>summary{min-height:44px}:is(.desktop-nav,.detail-nav,.contact-nav) .nav-dropdown[open]>summary{color:var(--purple)}.nav-mega{z-index:50;width:min(952px,100vw - 56px);color:var(--ink);background:#fffdfa;border:1px solid #eadfe3;border-radius:26px;padding:23px;animation:.22s ease-out both nav-arrive;position:absolute;top:calc(100% + 14px);left:50%;transform:translate(-50%);box-shadow:0 25px 64px #422f3630}.nav-mega--services{width:min(790px,100vw - 56px)}.nav-mega:before{content:"";height:16px;position:absolute;top:-15px;left:0;right:0}.nav-mega-heading{justify-content:space-between;align-items:end;gap:20px;padding:0 2px 19px;display:flex}.nav-mega-heading>div{gap:8px;display:grid}.nav-mega-kicker{color:var(--purple);letter-spacing:.18em;font-size:10px;font-weight:800;line-height:1}.nav-mega-heading strong{font-family:var(--display);letter-spacing:-.025em;text-transform:uppercase;font-size:27px;font-weight:800;line-height:.95}.nav-mega-heading>a{white-space:nowrap;border-bottom:1px solid;align-items:center;gap:12px;padding-bottom:4px;font-size:12px;font-weight:800;display:inline-flex}.nav-mega-heading>a:hover{color:var(--purple)}.nav-service-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.nav-service-card{background:#fff;border:1px solid #e9e0df;border-radius:16px;grid-template-columns:42px minmax(0,1fr) 14px;align-items:center;gap:10px;min-height:91px;padding:13px;transition:background .2s,border-color .2s,transform .2s;display:grid}.nav-service-card:hover,.nav-service-card:focus-visible{background:#f4eef9;border-color:#baa8d4;transform:translateY(-2px)}.nav-service-icon{width:42px;height:42px;color:var(--purple);background:#eee6f7;border-radius:12px;flex:0 0 42px;place-items:center;display:grid}.nav-service-icon svg{width:23px;height:23px;display:block}.nav-service-copy{gap:4px;min-width:0;display:grid}.nav-service-copy strong{font-size:13px;font-weight:800;line-height:1.15}.nav-service-copy small{color:#76686e;font-size:10px;font-weight:500;line-height:1.2}.nav-service-arrow{place-self:start end;font-size:15px}.nav-case-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;display:grid}.nav-case-card{min-width:0;color:var(--ink);display:block}.nav-case-image{aspect-ratio:1;background:#e9e4e2;border-radius:13px;display:block;position:relative;overflow:hidden}.nav-case-image img{object-fit:cover;width:100%;height:100%;transition:transform .4s;display:block}.nav-case-card:hover img,.nav-case-card:focus-visible img{transform:scale(1.06)}.nav-case-card--orange .nav-case-image{background:var(--orange)}.nav-case-card--yellow .nav-case-image{background:var(--yellow)}.nav-case-card--purple .nav-case-image{background:var(--purple)}.nav-case-card--blue .nav-case-image{background:var(--blue)}.nav-case-image-arrow{background:#fff;border-radius:50%;place-items:center;width:31px;height:31px;font-size:17px;line-height:1;display:grid;position:absolute;bottom:9px;right:9px}.nav-case-caption{gap:3px;padding:11px 2px 0;display:grid}.nav-case-caption strong{font-family:var(--display);text-transform:uppercase;font-size:17px;font-weight:800;line-height:1}.nav-case-caption small{color:#76686e;letter-spacing:.09em;text-transform:uppercase;font-size:10px;font-weight:700;line-height:1.2}.nav-case-card:hover .nav-case-caption strong{color:var(--purple)}@keyframes nav-arrive{0%{opacity:0;translate:0 -8px}to{opacity:1;translate:0}}@media (width<=1080px){.contact-hero:has(.contact-mobile-nav[open]){overflow:visible}:is(.site-header .desktop-nav,.detail-header .detail-nav,.contact-header .contact-nav){display:none}:is(.site-header .mobile-nav,.detail-header .detail-mobile-nav,.contact-header .contact-mobile-nav){display:block;position:relative}:is(.site-header .mobile-nav,.detail-header .detail-mobile-nav,.contact-header .contact-mobile-nav)>summary{cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:44px;height:44px;list-style:none;display:flex}:is(.site-header .mobile-nav,.detail-header .detail-mobile-nav,.contact-header .contact-mobile-nav)>summary::-webkit-details-marker{display:none}:is(.site-header .mobile-nav,.detail-header .detail-mobile-nav,.contact-header .contact-mobile-nav)>summary span{background:var(--ink);width:24px;height:2px;display:block}:is(.site-header .mobile-nav,.detail-header .detail-mobile-nav,.contact-header .contact-mobile-nav)>.nav-mobile-list{z-index:80;overscroll-behavior:contain;width:min(365px,100vw - 24px);max-height:min(72dvh,620px);color:var(--ink);background:#fffdfa;border:1px solid #eadfe3;border-radius:20px;gap:3px;padding:15px;display:grid;position:absolute;top:calc(100% + 7px);right:-32px;overflow-y:auto;box-shadow:0 22px 52px #422f3633}:is(.site-header .mobile-nav,.detail-header .detail-mobile-nav,.contact-header .contact-mobile-nav) .nav-mobile-group>summary{border-radius:11px;flex-direction:row;justify-content:space-between;align-items:center;width:100%;min-height:50px;padding:9px 11px;font-size:16px;font-weight:800;display:flex}.nav-mobile-group[open]>summary{color:var(--purple);background:#f4eef9}:is(.site-header .mobile-nav,.detail-header .detail-mobile-nav,.contact-header .contact-mobile-nav) .nav-mobile-group>summary span{background:0 0;width:auto;height:auto;font-size:21px}:is(.site-header .mobile-nav,.detail-header .detail-mobile-nav,.contact-header .contact-mobile-nav) .nav-mobile-group>.nav-mobile-submenu{border:0;margin:4px 0 10px;padding:0;display:grid}.nav-mobile-services{gap:5px}:is(.site-header .mobile-nav,.detail-header .detail-mobile-nav,.contact-header .contact-mobile-nav) .nav-mobile-service{background:#fff;border:1px solid #efe7e8;border-radius:11px;grid-template-columns:37px minmax(0,1fr) 16px;align-items:center;gap:10px;min-height:51px;padding:5px 8px;font-size:13px;font-weight:700;display:grid}.nav-mobile-service .nav-service-icon{border-radius:9px;width:37px;height:37px}.nav-mobile-service .nav-service-icon svg{width:20px;height:20px}.nav-mobile-arrow{justify-self:end;font-size:16px}:is(.site-header .mobile-nav,.detail-header .detail-mobile-nav,.contact-header .contact-mobile-nav) .nav-mobile-cases{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}:is(.site-header .mobile-nav,.detail-header .detail-mobile-nav,.contact-header .contact-mobile-nav) .nav-mobile-cases>.nav-case-card{min-height:0;padding:0;display:block}.nav-mobile-cases .nav-case-image{border-radius:10px;width:100%}.nav-mobile-cases .nav-case-caption{min-height:39px;padding:7px 1px 0}.nav-mobile-cases .nav-case-caption strong{font-size:13px;line-height:1.07}:is(.site-header .mobile-nav,.detail-header .detail-mobile-nav,.contact-header .contact-mobile-nav) .nav-mobile-overview{border-bottom:1px solid #d8cbd0;border-radius:0;grid-column:1/-1;justify-content:space-between;align-items:center;min-height:40px;padding:5px 8px;font-size:12px;font-weight:800;display:flex}.nav-mobile-list>a{border-radius:11px;min-height:48px;padding:8px 11px;font-size:15px;font-weight:700}.nav-mobile-list>a:hover,.nav-mobile-list>a:focus-visible{background:#f4eef9}}@media (prefers-reduced-motion:reduce){.nav-mega{animation:none}.nav-service-card,.nav-case-image img{transition:none}.nav-service-card:hover,.nav-case-card:hover img{transform:none}}

.proposed-testimonial[data-astro-cid-hvvsfv7j]{background:var(--proposal-surface,#f1ebf7);width:min(1152px,100%);color:var(--ink);border-radius:32px;margin:24px auto 0;padding:clamp(32px,5vw,64px)}.proposed-testimonial__status[data-astro-cid-hvvsfv7j]{width:fit-content;max-width:100%;color:var(--proposal-accent,#624691);letter-spacing:.025em;border:1px solid;border-radius:999px;padding:9px 14px;font-size:12px;font-weight:800;line-height:1.35}blockquote[data-astro-cid-hvvsfv7j]{margin:27px 0 22px}blockquote[data-astro-cid-hvvsfv7j] p[data-astro-cid-hvvsfv7j]{max-width:980px;font-family:var(--display);letter-spacing:-.025em;font-size:clamp(26px,3.3vw,45px);font-weight:800;line-height:1.08}.proposed-testimonial__note[data-astro-cid-hvvsfv7j]{border-top:1px solid #422f3633;padding-top:15px;font-size:14px;line-height:1.45}@media (width<=760px){.proposed-testimonial[data-astro-cid-hvvsfv7j]{border-radius:26px;margin-top:16px;padding:29px 23px 32px}.proposed-testimonial__status[data-astro-cid-hvvsfv7j]{font-size:11px}blockquote[data-astro-cid-hvvsfv7j]{margin:28px 0 25px}blockquote[data-astro-cid-hvvsfv7j] p[data-astro-cid-hvvsfv7j]{font-size:clamp(25px,7.8vw,35px)}}

.tv-proposed-testimonial{--proposal-accent:#644b9e;--proposal-surface:#eee8f8}.tv-hero{color:#fffaf5;background:#34282e;border-radius:48px;flex-direction:column;min-height:770px;padding:154px 7.5% 39px;display:flex;position:relative;overflow:hidden}.tv-hero:before{content:"";aspect-ratio:1;pointer-events:none;border:1px solid #ffffff24;border-radius:50%;width:720px;position:absolute;inset:auto -13% -70% auto;box-shadow:0 0 0 90px #ffffff06,0 0 0 190px #ffffff05}.tv-hero-top,.tv-hero-bottom{z-index:2;letter-spacing:.11em;text-transform:uppercase;justify-content:space-between;align-items:center;gap:20px;font-size:12px;font-weight:800;display:flex;position:relative}.tv-hero-stage{z-index:1;flex:1;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);align-items:center;gap:1%;display:grid;position:relative}.tv-hero-copy{z-index:2;padding:50px 0 55px;position:relative}.tv-hero-copy>p{color:#ead6b4;letter-spacing:.14em;text-transform:uppercase;margin-bottom:23px;font-size:14px;font-weight:800}.tv-hero h1{font-family:var(--display);letter-spacing:-.055em;text-transform:uppercase;white-space:nowrap;font-size:clamp(88px,9.8vw,143px);font-weight:800;line-height:.78}.tv-hero h1 em{color:var(--yellow)}.tv-hero-copy>strong{max-width:520px;margin-top:45px;font-size:clamp(23px,2.25vw,32px);line-height:1.22;display:block}.tv-hero-art{min-width:0;height:480px;position:relative}.tv-hero-orbit{aspect-ratio:1;background:#e9cfaa;border-radius:50%;width:85%;position:absolute;top:2%;left:9%;box-shadow:inset 0 0 0 30px #ffffff1c,0 0 0 21px #e9cfaa1c}.tv-hero-art img{z-index:1;filter:drop-shadow(0 25px 20px #0c080954);width:126%;height:auto;position:absolute;top:23%;left:-11%;transform:rotate(-8deg)}.tv-hero-stamp{z-index:2;background:var(--purple);color:#fff;width:126px;height:126px;font-family:var(--display);text-align:center;text-transform:uppercase;border-radius:50%;place-items:center;font-size:21px;font-weight:800;line-height:.98;display:grid;position:absolute;bottom:-2%;right:-2%;transform:rotate(13deg)}.tv-hero-bottom{border-top:1px solid #ffffff80;padding-top:17px}.tv-hero-bottom span:last-child{font-size:24px;line-height:1}.tv-intro{grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr);align-items:end;gap:12% 7%;width:min(1152px,100%);margin:auto;padding:136px 0 144px;display:grid}.tv-intro .detail-kicker{grid-column:1/-1}.tv-intro h2,.tv-journey h2,.tv-method h2,.tv-faq h2{font-family:var(--display);letter-spacing:-.039em;text-transform:uppercase;font-size:clamp(54px,6.3vw,89px);font-weight:800;line-height:.92}.tv-intro h2 em{color:var(--orange)}.tv-intro p{max-width:585px;padding-bottom:4px;font-size:clamp(19px,2vw,26px);font-weight:600;line-height:1.4}.tv-journey{background:#eee8f8;border-radius:42px;padding:88px 7.5% 90px}.tv-journey-head{grid-template-columns:minmax(0,1fr) minmax(0,.45fr);align-items:end;gap:0 8%;display:grid}.tv-journey-head .detail-kicker{grid-column:1/-1}.tv-journey h2{margin-top:22px}.tv-journey h2 em{color:var(--purple)}.tv-journey-head>p{max-width:330px;padding-bottom:4px;font-size:18px;line-height:1.45}.tv-journey-search{border:2px solid var(--ink);width:min(890px,100%);min-height:86px;box-shadow:12px 12px 0 var(--yellow);background:#fff;border-radius:100px;align-items:center;gap:20px;margin:62px auto 0;padding:13px 17px 13px 27px;display:flex;transform:rotate(-2deg)}.tv-journey-search>span{font-family:var(--display);font-size:42px;line-height:1}.tv-journey-search strong{flex:1;font-size:clamp(17px,2.2vw,30px);font-weight:700;line-height:1.15}.tv-journey-search b{background:var(--orange);color:#fff;border-radius:50%;flex:none;place-items:center;width:55px;height:55px;font-size:30px;font-weight:500;line-height:1;display:grid}.tv-page-preview{background:#fff;border-radius:20px;width:min(1080px,100%);margin:80px auto 0;padding:11px 11px 15px;box-shadow:0 35px 70px #5342742e}.tv-page-preview-bar{align-items:center;gap:6px;height:31px;padding:0 7px 9px;display:flex}.tv-page-preview-bar i{background:#c9c0c6;border-radius:50%;width:7px;height:7px}.tv-page-preview-bar span{color:#877d80;margin-inline:auto;padding-right:34px;font-size:10px;font-weight:700}.tv-page-preview>img{border-radius:10px;width:100%;height:auto}.tv-page-preview figcaption{justify-content:space-between;align-items:center;gap:20px;padding:16px 8px 2px;font-size:13px;display:flex}.tv-page-preview figcaption span{font-weight:700}.tv-page-preview figcaption a{border-bottom:1px solid;padding-bottom:3px;font-weight:800}.tv-page-preview figcaption a:hover{color:var(--purple)}.tv-method{grid-template-columns:minmax(0,.73fr) minmax(0,1fr);gap:10%;width:min(1152px,100%);margin:auto;padding:145px 0 148px;display:grid}.tv-method h2{margin-top:25px}.tv-method h2 em{color:var(--orange)}.tv-method-list{border-top:1px solid #cbbfc3;align-self:end}.tv-method-list article{border-bottom:1px solid #cbbfc3;grid-template-columns:50px minmax(0,.45fr) minmax(0,1fr);align-items:start;gap:12px;padding:27px 0;display:grid}.tv-method-list article>span{color:var(--purple);font-family:var(--display);font-size:29px;font-weight:800;line-height:1}.tv-method-list h3{font-family:var(--display);text-transform:uppercase;font-size:clamp(22px,2.1vw,28px);line-height:1}.tv-method-list p{font-size:15px;line-height:1.45}.tv-result{background:var(--yellow);border-radius:42px;padding:60px 7.5% 68px}.tv-result-top{letter-spacing:.08em;text-transform:uppercase;justify-content:space-between;align-items:center;gap:25px;font-size:12px;font-weight:800;display:flex}.tv-result-main{grid-template-columns:minmax(0,.78fr) minmax(0,1fr);align-items:end;gap:6%;margin-top:38px;display:grid}.tv-result h2{color:var(--purple);font-family:var(--display);letter-spacing:-.085em;white-space:nowrap;font-size:clamp(135px,19vw,260px);line-height:.76}.tv-result-main p{max-width:580px;padding-bottom:7px;font-size:clamp(23px,2.7vw,37px);font-weight:700;line-height:1.15}.tv-result-main strong{color:var(--purple)}.tv-result-foot{border-top:1px solid #422f3659;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);align-items:end;gap:10%;margin-top:58px;padding-top:23px;display:grid}.tv-result-foot p{max-width:520px;font-size:19px;font-weight:600;line-height:1.4}.tv-result-foot small{max-width:520px;font-size:12px;line-height:1.5}.tv-faq{grid-template-columns:minmax(0,.74fr) minmax(0,1fr);gap:9%;width:min(1152px,100%);margin:auto;padding:125px 0 130px;display:grid}.tv-faq h2{margin-top:24px;font-size:clamp(49px,5.5vw,76px)}.tv-faq h2 em{color:var(--purple)}.tv-faq-list{border-top:1px solid #d1c7cb}.tv-faq-list details{border-bottom:1px solid #d1c7cb}.tv-faq-list summary{cursor:pointer;min-height:83px;font-family:var(--display);text-transform:uppercase;grid-template-columns:minmax(0,1fr) 31px;align-items:center;gap:15px;padding:17px 0;font-size:clamp(18px,1.7vw,23px);font-weight:800;line-height:1.15;list-style:none;display:grid}.tv-faq-list summary::-webkit-details-marker{display:none}.tv-faq-list summary b{background:var(--yellow);width:31px;height:31px;font-family:var(--body);border-radius:50%;place-items:center;font-size:23px;font-weight:400;line-height:1;transition:transform .2s;display:grid}.tv-faq-list details[open] summary b{transform:rotate(45deg)}.tv-faq-list details p{max-width:600px;padding:0 40px 23px 0;font-size:15px;line-height:1.5}.tv-contact{background:#34282e}@media (width<=1080px){.tv-hero{padding-inline:6%}.tv-hero h1{font-size:clamp(78px,10vw,115px)}.tv-hero-art{height:400px}.tv-intro,.tv-method,.tv-faq{padding-inline:5%}.tv-journey,.tv-result{padding-inline:6%}}@media (width<=760px){.tv-hero{border-radius:28px;min-height:760px;padding:119px 26px 27px}.tv-hero-top>span:last-child{display:none}.tv-hero-stage{flex-direction:column-reverse;justify-content:end;align-items:stretch;gap:0;display:flex}.tv-hero-art{width:min(100%,330px);height:290px;margin:15px auto 0}.tv-hero-orbit{width:68%;top:0;left:16%}.tv-hero-art img{width:100%;top:26%;left:1%}.tv-hero-stamp{width:78px;height:78px;font-size:13px;bottom:5%;right:0}.tv-hero-copy{padding:0 0 28px}.tv-hero-copy>p{margin-bottom:17px;font-size:11px}.tv-hero h1{font-size:clamp(56px,12.8vw,88px)}.tv-hero-copy>strong{max-width:400px;margin-top:26px;font-size:20px}.tv-intro{padding:98px 15px 105px;display:block}.tv-intro h2{margin-top:27px}.tv-intro p{margin-top:29px;font-size:19px}.tv-journey{border-radius:28px;padding:73px 23px 72px}.tv-journey-head{display:block}.tv-journey h2{font-size:clamp(48px,10.7vw,70px)}.tv-journey-head>p{max-width:500px;margin-top:22px;font-size:16px}.tv-journey-search{min-height:64px;box-shadow:7px 7px 0 var(--yellow);gap:12px;margin-top:43px;padding:8px 9px 8px 14px}.tv-journey-search>span{font-size:31px}.tv-journey-search strong{font-size:15px}.tv-journey-search b{width:42px;height:42px;font-size:24px}.tv-page-preview{border-radius:13px;margin-top:56px;padding:6px 6px 11px}.tv-page-preview-bar{height:21px;padding-bottom:4px}.tv-page-preview-bar span{padding-right:23px;font-size:7px}.tv-page-preview>img{border-radius:7px}.tv-page-preview figcaption{padding:12px 6px 2px;font-size:11px;display:block}.tv-page-preview figcaption a{margin-top:9px;display:inline-block}.tv-method{padding:108px 15px 113px;display:block}.tv-method h2{font-size:clamp(50px,11vw,70px)}.tv-method-list{margin-top:50px}.tv-method-list article{grid-template-columns:44px 1fr;gap:5px 13px;padding:23px 0}.tv-method-list p{grid-column:2}.tv-result{border-radius:28px;padding:52px 27px 58px}.tv-result-top{display:block}.tv-result-top>span:last-child{margin-top:11px;display:block}.tv-result-main{margin-top:47px;display:block}.tv-result h2{font-size:clamp(120px,35vw,210px)}.tv-result-main p{margin-top:27px;font-size:27px}.tv-result-foot{margin-top:41px;display:block}.tv-result-foot p{font-size:17px}.tv-result-foot small{margin-top:21px;display:block}.tv-faq{padding:105px 15px 111px;display:block}.tv-faq h2{margin-top:25px}.tv-faq-list{margin-top:45px}.tv-faq-list summary{font-size:19px}}@media (width<=400px){.tv-hero{min-height:710px}.tv-hero-art{height:250px}.tv-hero h1{font-size:clamp(49px,12.5vw,61px)}.tv-journey-search strong{font-size:13px}.tv-journey-search>span{font-size:26px}.tv-journey-search b{width:36px;height:36px}.tv-result h2{font-size:clamp(100px,34vw,135px)}}@media (prefers-reduced-motion:reduce){.tv-faq-list summary b{transition:none}}

.detail-skip{z-index:20;background:var(--yellow);color:var(--ink);border-radius:12px;padding:12px 18px;font-weight:800;position:absolute;top:-80px;left:24px}.detail-skip:focus{top:16px}.detail-shell{width:100%;margin-inline:auto;padding:37px 44px 40px;overflow:clip}.detail-header{z-index:10;min-height:60px;color:var(--ink);background:#fff;border-radius:999px;justify-content:space-between;align-items:center;margin:0 7.5% -86px;padding:0 39px;display:flex;position:relative;box-shadow:0 7px 24px #422f3612}.detail-brand,.detail-footer-brand{color:var(--purple);font-family:var(--display);letter-spacing:-1.2px;font-size:28px;font-weight:800;line-height:1}.detail-nav{align-items:center;gap:30px;font-size:14px;font-weight:500;display:flex}.detail-nav a{transition:color .2s}.detail-nav a:hover,.detail-nav a.is-active{color:var(--purple)}.detail-nav a.is-active{font-weight:800}.detail-mobile-nav{display:none}.detail-footer{border-top:1px solid #d9cfd1;justify-content:space-between;align-items:end;gap:24px;width:min(1152px,100%);margin:100px auto 0;padding-top:28px;display:flex}.detail-footer p{font-size:14px;line-height:1.5}.detail-footer>a:last-child{font-size:14px;font-weight:800}.detail-kicker{letter-spacing:.14em;text-transform:uppercase;align-items:center;gap:10px;font-size:12px;font-weight:800;line-height:1.3;display:inline-flex}.detail-kicker:before{content:"";background:currentColor;border-radius:50%;width:9px;height:9px}.detail-section-title{font-family:var(--display);letter-spacing:-.025em;text-transform:uppercase;font-size:clamp(48px,6.2vw,88px);font-weight:800;line-height:.95}.detail-contact{background:var(--purple);color:#fff;border-radius:42px;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:40px;min-height:360px;padding:68px 7.5%;display:grid}.detail-contact h2{max-width:820px;font-family:var(--display);letter-spacing:-.025em;text-transform:uppercase;margin-top:22px;font-size:clamp(46px,6.7vw,90px);font-weight:800;line-height:.92}.detail-contact h2 em{color:var(--yellow)}.detail-contact .pill-button{align-self:end}@media (width<=1080px){.detail-shell{padding:22px}.detail-header{margin:0 5% -82px;padding-inline:25px}.detail-nav{gap:15px;font-size:12px}.detail-contact{gap:26px;padding:58px 6%}}@media (width<=760px){.detail-shell{padding:12px 12px 30px}.detail-header{min-height:56px;margin:0 12px -68px;padding:0 20px}.detail-brand{font-size:25px}.detail-nav{display:none}.detail-mobile-nav{display:block;position:relative}.detail-mobile-nav summary{cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:44px;height:44px;list-style:none;display:flex}.detail-mobile-nav summary::-webkit-details-marker{display:none}.detail-mobile-nav summary span{background:var(--ink);width:24px;height:2px}.detail-mobile-nav nav{background:#fff;border-radius:18px;gap:3px;width:min(318px,100vw - 48px);max-height:min(76vh,610px);padding:15px;display:grid;position:absolute;top:51px;right:-10px;overflow-y:auto;box-shadow:0 15px 30px #422f3629}.detail-mobile-nav nav a{align-items:center;min-height:44px;padding:7px 9px;display:flex}.detail-contact{border-radius:28px;grid-template-columns:1fr;min-height:0;padding:54px 27px}.detail-contact .pill-button{justify-self:start}.detail-footer{flex-wrap:wrap;margin-top:65px}.detail-footer p{order:3;width:100%}}@media (width<=400px){.detail-contact h2{font-size:clamp(34px,10vw,40px)}.detail-contact .pill-button{white-space:normal;text-align:center;width:100%;min-width:0;padding-inline:14px;font-size:13px}}@media (prefers-reduced-motion:reduce){.detail-nav a{transition:none}}

/* ==========================================================================
   Version 4 — pages services longues + études de cas enrichies
   S'ajoute après illustrations.css. Préfixes : sl- (services), cs- (études de cas).
   ========================================================================== */

/* Accueil : le nouveau titre est plus long que l'ancien */
.hero-content h1 { font-size: 112px; line-height: 96px; }
@media (max-width: 1360px) { .hero-content h1 { font-size: clamp(58px, 7.6vw, 104px); line-height: .9; } }
@media (max-width: 700px) { .hero-content h1 { font-size: clamp(34px, 10vw, 58px); } }
@media (min-width: 1361px) { .hero-intro { width: 640px; top: 536px; } }
@media (max-width: 1360px) { .hero-intro { max-width: 620px; margin-inline: auto; } }
@media (max-width: 700px) { .hero-intro { width: auto; } }

/* Les mentions à compléter ressortent dans la maquette */
.sl-todo {
  padding: 0 5px; border-radius: 5px; border-bottom: 2px dashed #d43b22;
  background: #fff3c4; color: #a42a14; font-weight: 800;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}

/* ---------- Services : le constat ---------- */
.sl-intro {
  display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 34px 8%;
  width: min(1152px, 100%); margin: auto; padding: 135px 0 125px;
}
.sl-intro .detail-kicker { grid-column: 1 / -1; }
.sl-intro h2, .sl-forwho h2, .sl-budget h2, .sl-included h2, .sl-proof h2, .cs-why h2, .cs-gallery h2 {
  font-family: var(--display); font-weight: 800; letter-spacing: -.035em; line-height: .95; text-transform: uppercase;
}
.sl-intro h2 { font-size: clamp(42px, 5vw, 70px); }
.sl-intro h2 em { color: var(--purple); }
.sl-intro-copy p { font-size: 18px; line-height: 1.65; }
.sl-intro-copy p + p { margin-top: 18px; }
.sl-intro-copy strong { font-weight: 800; }

/* ---------- Services : ce qui est compris ---------- */
.sl-included { padding: 105px 7.5% 112px; border-radius: 42px; background: var(--ink); color: #fff; }
.sl-included-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .6fr); align-items: end; gap: 26px 8%; }
.sl-included-head .detail-kicker { grid-column: 1 / -1; }
.sl-included h2 { font-size: clamp(42px, 5vw, 70px); }
.sl-included h2 em { color: var(--yellow); }
.sl-included-head p { font-size: 17px; line-height: 1.55; color: #f1e8ec; }
.sl-included-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 60px; }
.sl-included-item { padding: 26px 24px 28px; border-radius: 24px; background: rgb(255 255 255 / 7%); border: 1px solid rgb(255 255 255 / 16%); }
.sl-check { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--yellow); color: var(--ink); }
.sl-check svg { width: 20px; height: 20px; }
.sl-included-item h3 { margin-top: 18px; font-family: var(--display); font-size: 22px; line-height: 1.05; font-weight: 800; letter-spacing: -.01em; text-transform: uppercase; }
.sl-included-item p { margin-top: 10px; font-size: 16px; line-height: 1.5; color: #f1e8ec; }

/* ---------- Services : pour qui ---------- */
.sl-forwho { width: min(1152px, 100%); margin: auto; padding: 130px 0 120px; }
.sl-forwho h2 { margin-top: 24px; font-size: clamp(42px, 5vw, 70px); }
.sl-forwho h2 em { color: #d43b22; }
.sl-forwho-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-top: 56px; }
.sl-forwho-card { display: flex; flex-direction: column; gap: 22px; min-height: 250px; padding: 28px 28px 32px; border-radius: 28px; box-shadow: 0 18px 32px -24px rgb(66 47 54 / 40%); }
.sl-forwho-card:nth-child(1) { background: #fff; transform: rotate(-1.5deg); }
.sl-forwho-card:nth-child(2) { background: var(--yellow); transform: rotate(1deg) translateY(10px); }
.sl-forwho-card:nth-child(3) { background: #f3c5d2; transform: rotate(-.8deg); }
.sl-forwho-card b { font-family: var(--display); font-size: 46px; line-height: 1; font-weight: 800; }
.sl-forwho-card p { font-size: 20px; line-height: 1.38; font-weight: 600; }

/* ---------- Services : budget et délais ---------- */
.sl-budget { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: 40px 8%; width: min(1152px, 100%); margin: auto; padding: 130px 0 40px; }
.sl-budget h2 { margin-top: 24px; font-size: clamp(40px, 4.4vw, 62px); }
.sl-budget h2 em { color: var(--purple); }
.sl-budget-copy p { margin-top: 22px; font-size: 17px; line-height: 1.6; }
.sl-price-list { align-self: start; border-top: 2px solid var(--ink); }
.sl-price-row { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .85fr) minmax(0, .7fr); gap: 18px; align-items: start; padding: 24px 0; border-bottom: 1px solid rgb(66 47 54 / 28%); }
.sl-price-row h3 { font-family: var(--display); font-size: 21px; line-height: 1.05; font-weight: 800; text-transform: uppercase; }
.sl-price-row h3 small { display: block; margin-top: 8px; font-family: var(--body); font-size: 14px; line-height: 1.4; font-weight: 500; text-transform: none; }
.sl-price-row .sl-price { font-family: var(--display); font-size: 20px; line-height: 1.2; font-weight: 800; }
.sl-price-row .sl-delay { font-size: 15px; line-height: 1.4; font-weight: 700; }
.sl-price-row .sl-label { display: block; margin-bottom: 4px; font-family: var(--body); font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; opacity: .75; }

/* ---------- Services : la preuve ---------- */
.sl-proof { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); align-items: center; gap: 40px 6%; margin-top: 90px; padding: 56px 7.5%; border-radius: 42px; background: var(--yellow); color: var(--ink); }
.sl-proof-media { display: grid; gap: 16px; }
.sl-proof-media img { width: 100%; height: auto; border-radius: 18px; box-shadow: 0 24px 44px -26px rgb(66 47 54 / 60%); }
.sl-proof h2 { margin-top: 20px; font-size: clamp(36px, 3.8vw, 54px); }
.sl-proof p { margin-top: 18px; font-size: 18px; line-height: 1.55; }
.sl-proof-metric { display: block; margin-top: 22px; font-family: var(--display); font-size: clamp(54px, 6vw, 84px); line-height: .85; font-weight: 800; letter-spacing: -.05em; }
.sl-proof-metric small { display: block; margin-top: 10px; font-family: var(--body); font-size: 15px; line-height: 1.4; font-weight: 600; letter-spacing: 0; }
.sl-proof-link { display: inline-flex; align-items: center; gap: 10px; margin-top: 26px; padding-bottom: 4px; border-bottom: 2px solid currentColor; font-size: 16px; font-weight: 800; }
.sl-proof--purple { background: var(--purple); color: #fff; }
.sl-proof--blue { background: #a9ddec; color: #212d5e; }

/* ---------- Études de cas : pourquoi ça marche ---------- */
.cs-why { width: min(1152px, 100%); margin: auto; padding: 130px 0 40px; }
.cs-why-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .55fr); align-items: end; gap: 26px 8%; }
.cs-why-head .detail-kicker { grid-column: 1 / -1; }
.cs-why h2 { font-size: clamp(42px, 5vw, 70px); }
.cs-why h2 em { color: var(--purple); }
.cs-why-head p { font-size: 17px; line-height: 1.55; }
.cs-why-list { display: grid; gap: 70px; margin-top: 70px; }
.cs-why-item { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); align-items: center; gap: 30px 7%; }
.cs-why-item:nth-child(even) { grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); }
.cs-why-item:nth-child(even) .cs-why-shot { order: 2; }
.cs-why-shot { position: relative; display: grid; place-items: center; min-height: 260px; padding: 34px; border-radius: 24px; background: var(--shot-bg, #f3ece8); box-shadow: 0 26px 50px -30px rgb(66 47 54 / 55%); }
.cs-why-shot img { width: auto; max-width: 100%; height: auto; max-height: 300px; border-radius: 8px; box-shadow: 0 18px 34px -18px rgb(0 0 0 / 55%); }
.cs-why-shot .cs-zoom { position: absolute; top: -16px; right: 18px; display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border-radius: 999px; background: var(--yellow); font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.cs-why-text b { font-family: var(--display); font-size: 46px; line-height: 1; font-weight: 800; color: #d43b22; }
.cs-why-text h3 { margin-top: 12px; font-family: var(--display); font-size: clamp(26px, 2.6vw, 36px); line-height: 1; font-weight: 800; letter-spacing: -.02em; text-transform: uppercase; }
.cs-why-text p { margin-top: 14px; font-size: 17px; line-height: 1.6; }

/* ---------- Études de cas : galerie ---------- */
.cs-gallery { margin-top: 110px; padding: 100px 7.5% 105px; border-radius: 42px; background: #eee6f7; }
.cs-gallery-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .55fr); align-items: end; gap: 26px 8%; }
.cs-gallery-head .detail-kicker { grid-column: 1 / -1; }
.cs-gallery h2 { font-size: clamp(42px, 5vw, 70px); }
.cs-gallery h2 em { color: var(--purple); }
.cs-gallery-head p { font-size: 17px; line-height: 1.55; }
.cs-gallery-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, .5fr) minmax(0, .5fr); align-items: start; gap: 26px; margin-top: 60px; }
.cs-browser { padding: 10px 10px 0; border-radius: 18px; background: #fff; box-shadow: 0 30px 60px -32px rgb(46 31 84 / 55%); }
.cs-browser-bar { display: flex; align-items: center; gap: 6px; height: 26px; padding: 0 6px; }
.cs-browser-bar i { width: 9px; height: 9px; border-radius: 50%; background: #e2d9dd; }
.cs-browser-bar span { margin: 0 auto; padding: 2px 26px; border-radius: 6px; background: #f4eff1; font-size: 11px; color: #6e6065; }
.cs-browser-screen { height: 560px; overflow: hidden; border-radius: 10px 10px 0 0; }
.cs-browser-screen .cs-placeholder { min-height: 100%; }
.cs-browser-screen img { width: 100%; height: auto; }
.cs-phone { padding: 9px; border-radius: 34px; background: #2a1f24; box-shadow: 0 30px 50px -28px rgb(46 31 84 / 60%); }
.cs-phone:nth-child(3) { margin-top: 60px; }
.cs-phone-screen { aspect-ratio: 9 / 19.5; overflow: hidden; border-radius: 26px; background: #fff; }
.cs-phone-screen img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.cs-placeholder {
  display: grid; place-content: center; gap: 10px; height: 100%; min-height: 220px; padding: 18px; text-align: center;
  background: repeating-linear-gradient(135deg, #f6f1f3 0 14px, #efe7eb 14px 28px); color: #6e6065;
  font-size: 12px; line-height: 1.4; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
.cs-placeholder b { display: inline-block; justify-self: center; padding: 5px 10px; border-radius: 6px; border: 1.5px dashed #d43b22; background: #fff; color: #a42a14; font-size: 10px; }
.cs-gallery-note { margin-top: 26px; font-size: 14px; line-height: 1.5; }

@media (max-width: 1080px) {
  .sl-included-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sl-price-row { grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); }
  .sl-price-row .sl-delay { grid-column: 2; }
  .cs-gallery-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .cs-browser { grid-column: 1 / -1; }
  .cs-phone:nth-child(3) { margin-top: 0; }
}

@media (max-width: 760px) {
  .sl-intro, .sl-budget, .sl-included-head, .cs-why-head, .cs-gallery-head { grid-template-columns: 1fr; }
  .sl-intro { padding: 80px 6px 70px; }
  .sl-intro-copy p { font-size: 17px; }
  .sl-included { padding: 70px 24px 74px; border-radius: 28px; }
  .sl-included h2, .sl-budget h2, .sl-intro h2 { font-size: min(44px, 8.2vw); }
  .sl-included-grid { grid-template-columns: 1fr; margin-top: 40px; }
  .sl-forwho { padding: 80px 6px 70px; }
  .sl-forwho-grid { grid-template-columns: 1fr; gap: 16px; margin-top: 36px; }
  .sl-forwho-card, .sl-forwho-card:nth-child(n) { min-height: 0; transform: none; }
  .sl-forwho-card p { font-size: 18px; }
  .sl-budget { padding: 80px 6px 20px; gap: 30px; }
  .sl-price-row { grid-template-columns: 1fr; gap: 10px; }
  .sl-price-row .sl-delay { grid-column: auto; }
  .sl-proof { grid-template-columns: 1fr; margin-top: 60px; padding: 34px 24px 40px; border-radius: 28px; }
  .cs-why { padding: 80px 6px 20px; }
  .cs-why-list { gap: 50px; margin-top: 44px; }
  .cs-why-item { grid-template-columns: 1fr; }
  .cs-why-item:nth-child(even) { grid-template-columns: 1fr; }
  .cs-why-item:nth-child(even) .cs-why-shot { order: 0; }
  .cs-why-shot { min-height: 170px; padding: 22px 16px; border-radius: 20px; }
  .cs-gallery { margin-top: 70px; padding: 70px 22px 74px; border-radius: 28px; }
  .cs-browser-screen { height: 320px; }
}

/* ==========================================================================
   v5 · Accueil : nouvelle arrivée (texte à gauche, preuves à droite)
   ========================================================================== */
.hero.hero--v5 { height: auto; }
.hero--v5 .hero-panel { overflow: hidden; }
.hero5 { position: relative; display: grid; grid-template-columns: minmax(0, 640px) minmax(0, 1fr); align-items: center; gap: 30px; text-align: left; }
.hero5-copy { position: relative; z-index: 3; }
.hero5-kicker { display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px 8px 12px; border-radius: 999px; background: rgb(255 255 255 / 14%); font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hero5-kicker i { width: 9px; height: 9px; border-radius: 50%; background: var(--yellow); box-shadow: 0 0 0 4px rgb(246 215 50 / 25%); }
.hero5 h1 {
  position: static; inset: auto; width: auto; white-space: normal; text-align: left; z-index: auto;
  margin: 26px 0 0; font-family: var(--display); font-size: 88px; line-height: .87; font-weight: 800;
  letter-spacing: -.035em; text-transform: uppercase; text-wrap: balance;
}
.hero5 h1 em { color: var(--yellow); font-style: normal; }
.hero5-intro { max-width: 470px; margin-top: 28px; font-size: 19px; line-height: 1.5; font-weight: 500; }
.hero5-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.hero5-actions .pill-button img { width: 20px; height: 20px; }
.hero5-team { display: flex; align-items: center; gap: 16px; margin-top: 34px; }
.hero5-faces { display: flex; flex: none; }
.hero5-faces > * { width: 52px; height: 52px; border-radius: 50%; border: 3px solid var(--purple); object-fit: cover; object-position: center 20%; background: var(--yellow); }
.hero5-faces > * + * { margin-left: -14px; }
.hero5-faces b { display: grid; place-items: center; font-family: var(--display); font-size: 22px; font-weight: 800; color: var(--ink); }
.hero5-team p { max-width: 330px; font-size: 15px; line-height: 1.4; }
.hero5-team strong { display: block; font-weight: 800; }

/* Visuel : un vrai site, un mobile, deux résultats */
.hero5-visual { position: relative; height: 560px; }
.hero5-browser {
  position: absolute; top: 46px; left: 0; width: 100%; margin: 0; padding: 0 0 6px; border-radius: 16px;
  background: #fff; box-shadow: 0 40px 70px -30px rgb(30 16 60 / 70%); transform: rotate(-2.5deg);
}
.hero5-bar { display: flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; }
.hero5-bar i { width: 9px; height: 9px; border-radius: 50%; background: #e2d9dd; }
.hero5-bar span { margin: 0 auto; padding: 3px 22px; border-radius: 6px; background: #f4eff1; color: #6e6065; font-size: 11px; font-weight: 600; }
.hero5-browser img { display: block; width: calc(100% - 12px); height: auto; margin: 0 6px; border-radius: 8px; }
.hero5-phone {
  position: absolute; z-index: 2; left: 60%; top: 214px; width: 172px; margin: 0; padding: 7px; border-radius: 30px; background: #1f1720;
  box-shadow: 0 30px 50px -22px rgb(20 10 40 / 75%); transform: rotate(5deg);
}
.hero5-phone img { display: block; width: 100%; height: auto; border-radius: 24px; }
.hero5-stat { position: absolute; z-index: 4; display: grid; gap: 4px; padding: 16px 20px 18px; border-radius: 20px; color: var(--ink); box-shadow: 0 24px 40px -22px rgb(20 10 40 / 65%); }
.hero5-stat b { font-family: var(--display); font-size: 46px; line-height: .9; font-weight: 800; letter-spacing: -.04em; }
.hero5-stat span { font-size: 13px; line-height: 1.3; font-weight: 700; }
.hero5-stat--yellow { left: -34px; top: 330px; width: 224px; background: var(--yellow); transform: rotate(-4deg); }
.hero5-stat--white { right: -26px; top: -8px; width: 232px; background: #fff; transform: rotate(4deg); }
.hero5-search { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; padding: 7px 12px; border-radius: 999px; border: 1.5px solid #e4dde0; font-size: 12px !important; font-weight: 600 !important; color: #5d4f55; }
.hero5-search::before { content: ""; width: 11px; height: 11px; border: 2px solid currentColor; border-radius: 50%; flex: none; }

/* Bandeau clients sous le contenu */
.hero5-clients { position: relative; z-index: 3; display: flex; align-items: center; gap: 28px; margin-top: 40px; padding: 22px 0 26px; border-top: 1px solid rgb(255 255 255 / 25%); }
.hero5-clients > span { flex: none; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; opacity: .8; }
.hero5-clients ul { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: 0; padding: 0; list-style: none; }
.hero5-clients li { font-family: var(--display); font-size: 17px; font-weight: 800; letter-spacing: -.02em; text-transform: uppercase; }
.hero5-clients li + li::before { content: "✳"; margin-right: 16px; color: var(--yellow); font-size: 16px; vertical-align: 3px; }

/* ---------- Grand écran (maquette 1440) : mêmes repères que l'en-tête ---------- */
@media (min-width: 1361px) {
  .hero.hero--v5 { padding: 37px 41px 0 44px; }
  .hero--v5 .hero-panel { position: relative; inset: auto; height: auto; min-height: 0; padding: 0; }
  .hero--v5 .hero-content.hero5 { min-height: 0; padding: 150px 101px 0 102px; }
  .hero--v5 .hero5-clients { margin: 34px 101px 0 102px; }
}

/* ---------- Tablette / petit ordinateur ---------- */
@media (max-width: 1360px) {
  .hero--v5 .hero-content.hero5 { min-height: 0; padding: 54px 2% 0; grid-template-columns: minmax(0, 1fr) minmax(0, .95fr); }
  .hero5 h1 { font-size: clamp(54px, 6.4vw, 86px); }
  .hero5-visual { height: 470px; }
  .hero5-phone { width: 140px; top: 170px; }
  .hero5-stat--yellow { top: 270px; left: -10px; }
  .hero5-stat--white { right: -6px; }
  .hero5-clients { margin-inline: 2%; }
}
@media (max-width: 1000px) {
  .hero--v5 .hero-content.hero5 { grid-template-columns: 1fr; }
  .hero5-visual { height: 560px; max-width: 640px; }
  .hero5-phone { width: 160px; top: 230px; }
  .hero5-clients { flex-direction: column; align-items: flex-start; gap: 12px; }
}

/* ---------- Téléphone ---------- */
@media (max-width: 700px) {
  .hero--v5 .hero-content.hero5 { padding: 34px 6px 0; gap: 18px; }
  .hero5-kicker { font-size: 11px; padding: 7px 12px 7px 10px; }
  .hero5 h1 { margin-top: 18px; font-size: clamp(40px, 12.4vw, 56px); white-space: normal; }
  .hero5-intro { font-size: 16px; margin-top: 18px; }
  .hero5-actions { flex-direction: column; gap: 10px; margin-top: 24px; }
  .hero5-actions .pill-button { width: 100%; }
  .hero5-team { margin-top: 24px; gap: 12px; }
  .hero5-faces > * { width: 44px; height: 44px; }
  .hero5-team p { font-size: 13px; }
  .hero5-visual { height: 400px; margin-top: 16px; }
  .hero5-browser { top: 40px; border-radius: 12px; }
  .hero5-bar { height: 22px; }
  .hero5-bar span { font-size: 9px; padding: 2px 12px; }
  .hero5-phone { left: auto; right: 4%; top: 150px; width: 110px; padding: 5px; border-radius: 22px; }
  .hero5-phone img { border-radius: 18px; }
  .hero5-stat { padding: 12px 14px 14px; border-radius: 16px; }
  .hero5-stat b { font-size: 32px; }
  .hero5-stat span { font-size: 11px; }
  .hero5-stat--yellow { left: -4px; top: 250px; width: 168px; }
  .hero5-stat--white { right: -4px; top: -14px; width: 180px; }
  .hero5-search { font-size: 10px !important; padding: 5px 9px; }
  .hero5-clients { margin-top: 16px; padding: 18px 6px 22px; }
  .hero5-clients li { font-size: 17px; }
  .hero5-clients ul { gap: 6px 14px; }
  .hero5-clients li + li::before { margin-right: 14px; font-size: 12px; }
}

/* ==========================================================================
   v5 · Études de cas : un modèle commun pour les quatre projets
   ========================================================================== */
.cs5 { --cs-bg: #2b1c18; --cs-soft: #f4ebe4; --cs-accent: var(--yellow); }
.cs5--gustus { --cs-bg: #2e1d14; --cs-soft: #f5ece3; }
.cs5--tour { --cs-bg: #3d3c2c; --cs-soft: #f2eee0; --cs-accent: #e2bf4f; }
.cs5--auberge { --cs-bg: #151312; --cs-soft: #f1ece6; }
.cs5--manchots { --cs-bg: #20435c; --cs-soft: #e6f3f8; --cs-accent: #a9ddec; }

.cs5 .detail-kicker { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.cs5 .detail-kicker::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.cs5 :is(.cs5-story, .cs5-anatomy, .cs5-mobile, .cs5-next) h2 { font-family: var(--display); font-size: clamp(42px, 5vw, 72px); line-height: .9; font-weight: 800; letter-spacing: -.04em; text-transform: uppercase; }
.cs5 :is(.cs5-story, .cs5-anatomy, .cs5-next) h2 em { font-style: normal; color: var(--purple); }

/* ---------- Hero ---------- */
.cs5-hero.cs5-hero { display: block; padding: 0; background: var(--cs-bg); color: #fff; min-height: 0; }
.cs5-hero-bg { position: absolute; inset: 0; }
.cs5-hero-bg img { width: 100%; height: 100%; object-fit: cover; opacity: .34; filter: saturate(.9); }
.cs5-hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--cs-bg) 18%, rgb(0 0 0 / 0%) 75%), linear-gradient(0deg, var(--cs-bg) 0%, rgb(0 0 0 / 0%) 45%); }
.cs5-hero-in { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: center; gap: 30px 50px; padding: 150px 7.5% 80px; }
.cs5-hero-copy .detail-kicker { color: var(--cs-accent); }
.cs5-hero h1 { margin-top: 22px; font-family: var(--display); font-size: clamp(64px, 7.6vw, 118px); line-height: .82; font-weight: 800; letter-spacing: -.05em; text-transform: uppercase; }
.cs5-hero h1 em { font-style: normal; color: var(--yellow); }
.cs5--auberge .cs5-hero h1 { font-size: clamp(54px, 5.4vw, 76px); }
.cs5-lead { max-width: 470px; margin-top: 26px; font-size: 21px; line-height: 1.4; font-weight: 600; }
.cs5-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 26px 0 0; padding: 0; list-style: none; }
.cs5-tags li { padding: 7px 14px; border-radius: 999px; border: 1.5px solid rgb(255 255 255 / 45%); font-size: 13px; font-weight: 800; }
.cs5-visit { display: inline-flex; align-items: center; gap: 10px; margin-top: 30px; padding: 15px 24px; border-radius: 999px; background: var(--yellow); color: var(--ink); font-size: 15px; font-weight: 800; }
.cs5-hero-visual { position: relative; min-height: 520px; }
.cs5-browser { position: relative; margin: 0; padding: 0 6px 6px; border-radius: 16px; background: #fff; box-shadow: 0 44px 80px -36px rgb(0 0 0 / 80%); }
.cs5-browser-bar { display: flex; align-items: center; gap: 6px; height: 32px; padding: 0 8px; }
.cs5-browser-bar i { width: 9px; height: 9px; border-radius: 50%; background: #e2d9dd; }
.cs5-browser-bar span { margin: 0 auto; padding: 3px 24px; border-radius: 6px; background: #f4eff1; color: #6e6065; font-size: 11px; font-weight: 600; }
.cs5-browser img { display: block; width: 100%; height: auto; border-radius: 9px; }
.cs5-hero-visual .cs5-browser { position: absolute; top: 20px; left: 0; width: 100%; transform: rotate(-2deg); }
.cs5-phone { margin: 0; padding: 7px; border-radius: 32px; background: #19121a; box-shadow: 0 34px 60px -26px rgb(0 0 0 / 80%); }
.cs5-phone img { display: block; width: 100%; height: auto; aspect-ratio: 390 / 664; border-radius: 26px; object-fit: cover; object-position: top center; }
.cs5-hero-visual .cs5-phone { position: absolute; right: -2%; bottom: -10px; z-index: 2; width: 31%; transform: rotate(4deg); }
.cs5-hero-seal { position: absolute; z-index: 3; left: -28px; bottom: 6px; display: grid; place-items: center; width: 150px; height: 150px; border-radius: 50%; background: var(--yellow); color: var(--ink); text-align: center; font-family: var(--display); font-size: 38px; line-height: .9; font-weight: 800; letter-spacing: -.04em; transform: rotate(-10deg); box-shadow: 0 20px 40px -20px rgb(0 0 0 / 70%); }
.cs5-hero-seal small { display: block; max-width: 104px; margin: 4px auto 0; font-family: var(--body); font-size: 11px; line-height: 1.2; font-weight: 800; letter-spacing: 0; }

/* ---------- Fiche projet ---------- */
.cs5-facts { width: min(1152px, 100%); margin: 0 auto; padding: 46px 0 0; }
.cs5-facts dl { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 0; border-top: 2px solid var(--ink); }
.cs5-facts dl > div { padding: 18px 18px 6px 0; border-right: 1px solid rgb(66 47 54 / 18%); }
.cs5-facts dl > div + div { padding-left: 18px; }
.cs5-facts dl > div:last-child { border-right: 0; }
.cs5-facts dt { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; opacity: .6; }
.cs5-facts dd { margin: 8px 0 0; font-size: 17px; line-height: 1.35; font-weight: 700; }
.cs5-facts dd a { border-bottom: 2px solid var(--yellow); }

/* ---------- Résultat ---------- */
.cs5-metric { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 20px 60px; width: min(1152px, 100%); margin: 70px auto 0; padding: 50px 60px; border-radius: 36px; background: var(--yellow); }
.cs5-metric b { font-family: var(--display); font-size: clamp(90px, 11vw, 168px); line-height: .78; font-weight: 800; letter-spacing: -.06em; }
.cs5-metric p { font-family: var(--display); font-size: clamp(26px, 2.6vw, 38px); line-height: 1.05; font-weight: 700; letter-spacing: -.02em; }
.cs5-metric small { display: block; margin-top: 14px; font-family: var(--body); font-size: 14px; line-height: 1.45; font-weight: 600; letter-spacing: 0; opacity: .8; }

/* ---------- Le point de départ ---------- */
.cs5-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: 40px 7%; width: min(1152px, 100%); margin: 0 auto; padding: 120px 0 40px; }
.cs5-story .detail-kicker { margin-bottom: 22px; }
.cs5-story-copy p { margin-top: 20px; font-size: 18px; line-height: 1.6; }
.cs5-goals { display: grid; gap: 0; margin: 34px 0 0; padding: 0; list-style: none; counter-reset: goal; border-top: 1px solid rgb(66 47 54 / 22%); }
.cs5-goals li { display: grid; grid-template-columns: 54px minmax(0, 1fr); align-items: baseline; padding: 16px 0; border-bottom: 1px solid rgb(66 47 54 / 22%); font-size: 17px; line-height: 1.4; font-weight: 700; counter-increment: goal; }
.cs5-goals li::before { content: "0" counter(goal); font-family: var(--display); font-size: 24px; font-weight: 800; color: var(--orange); }
.cs5-mosaic { position: relative; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 250px 250px; gap: 14px; }
.cs5-mosaic img { width: 100%; height: 100%; object-fit: cover; border-radius: 22px; }
.cs5-mosaic img:first-child { grid-row: 1 / 3; }
.cs5-mosaic figcaption { position: absolute; right: 18px; bottom: -18px; padding: 9px 16px; border-radius: 999px; background: var(--ink); color: #fff; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }

/* ---------- Anatomie d'une page ---------- */
.cs5-anatomy { margin-top: 110px; padding: 100px 7.5% 110px; border-radius: 42px; background: var(--cs-soft); }
.cs5-anatomy-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .55fr); align-items: end; gap: 24px 8%; }
.cs5-anatomy-head .detail-kicker { grid-column: 1 / -1; }
.cs5-anatomy-head p { font-size: 17px; line-height: 1.55; }
.cs5-anatomy-body { display: grid; grid-template-columns: 540px minmax(0, 1fr); gap: 0 70px; margin-top: 60px; }
.cs5-page { position: relative; align-self: start; }
.cs5-page .cs5-browser { box-shadow: 0 40px 70px -40px rgb(40 20 30 / 55%); }
.cs5-page-shot { position: relative; }
.cs5-pin { position: absolute; z-index: 2; display: grid; place-items: center; width: 38px; height: 38px; margin: -19px 0 0 -19px; border-radius: 50%; background: var(--orange); color: #fff; font-family: var(--display); font-size: 17px; font-weight: 800; box-shadow: 0 0 0 6px rgb(240 81 54 / 25%), 0 8px 16px -6px rgb(0 0 0 / 50%); }
.cs5-notes { position: relative; }
.cs5-note { position: absolute; left: 0; right: 0; display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 0 18px; transform: translateY(-20px); }
.cs5-note::before { content: ""; position: absolute; top: 19px; left: -70px; width: 64px; border-top: 2px dashed rgb(240 81 54 / 55%); }
.cs5-note b { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--ink); color: #fff; font-family: var(--display); font-size: 18px; font-weight: 800; }
.cs5-note h3 { font-family: var(--display); font-size: 26px; line-height: 1; font-weight: 800; letter-spacing: -.02em; text-transform: uppercase; }
.cs5-note p { grid-column: 2; margin-top: 10px; font-size: 16px; line-height: 1.55; }

/* ---------- Sur téléphone ---------- */
.cs5-mobile { margin-top: 24px; padding: 100px 7.5% 110px; border-radius: 42px; background: var(--cs-bg); color: #fff; }
.cs5-mobile-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .55fr); align-items: end; gap: 24px 8%; }
.cs5-mobile-head .detail-kicker { grid-column: 1 / -1; color: var(--cs-accent); }
.cs5 .cs5-mobile h2 em { font-style: normal; color: var(--yellow); }
.cs5-mobile-head p { font-size: 17px; line-height: 1.55; opacity: .9; }
.cs5-phones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; margin-top: 64px; padding: 0 4%; }
.cs5-phones figure { margin: 0; }
.cs5-phones figure:nth-child(2) { margin-top: 60px; }
.cs5-phones figcaption { margin-top: 22px; font-size: 15px; line-height: 1.45; }
.cs5-phones figcaption strong { display: block; margin-bottom: 4px; font-family: var(--display); font-size: 21px; font-weight: 800; letter-spacing: -.01em; text-transform: uppercase; color: var(--yellow); }

/* ---------- Projet suivant ---------- */
.cs5-next { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: center; gap: 30px 60px; width: min(1152px, 100%); margin: 110px auto 0; padding: 0 0 20px; }
.cs5 .cs5-next h2 { font-size: clamp(40px, 4.6vw, 66px); }
.cs5-next p { margin-top: 18px; font-size: 17px; line-height: 1.5; }
.cs5-next-link { display: inline-flex; align-items: center; gap: 10px; margin-top: 26px; padding: 15px 24px; border-radius: 999px; background: var(--ink); color: #fff; font-size: 15px; font-weight: 800; }
.cs5-next-card { display: block; transform: rotate(1.5deg); }
.cs5-next-card .cs5-browser { box-shadow: 0 40px 70px -40px rgb(40 20 30 / 60%); }

/* ---------- Ajustements des blocs repris (FAQ, proposition de témoignage) ---------- */
.cs5-keep { margin-top: 90px; }

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  .cs5-hero-in { grid-template-columns: 1fr; padding: 130px 6% 70px; }
  .cs5-hero-visual { min-height: 480px; max-width: 760px; }
  .cs5-facts { padding-inline: 4%; }
  .cs5-facts dl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cs5-facts dl > div:nth-child(3) { border-right: 0; }
  .cs5-facts dl > div:nth-child(4) { padding-left: 0; }
  .cs5-metric { margin-inline: 4%; width: auto; }
  .cs5-story { padding-inline: 4%; grid-template-columns: 1fr; }
  .cs5-anatomy-body { grid-template-columns: 400px minmax(0, 1fr); gap: 0 50px; }
  .cs5-note::before { left: -50px; width: 44px; }
  .cs5-next { padding-inline: 4%; }
}
@media (max-width: 760px) {
  .cs5-hero-in { padding: 112px 22px 46px; gap: 26px; }
  .cs5-hero h1 { font-size: clamp(52px, 15vw, 70px); }
  .cs5-lead { font-size: 18px; margin-top: 18px; }
  .cs5-visit { width: 100%; justify-content: center; }
  .cs5-hero-visual { min-height: 300px; }
  .cs5-hero-visual .cs5-browser { top: 6px; }
  .cs5-hero-visual .cs5-phone { width: 34%; bottom: -14px; padding: 5px; border-radius: 22px; }
  .cs5-hero-visual .cs5-phone img { border-radius: 17px; }
  .cs5-hero-seal { width: 108px; height: 108px; left: -8px; bottom: -6px; font-size: 28px; }
  .cs5-hero-seal small { font-size: 9px; }
  .cs5-facts { padding: 34px 10px 0; }
  .cs5-facts dl { grid-template-columns: 1fr 1fr; }
  .cs5-facts dl > div, .cs5-facts dl > div + div { padding: 14px 10px 10px 0; border-right: 0; border-bottom: 1px solid rgb(66 47 54 / 18%); }
  .cs5-facts dl > div:last-child { grid-column: 1 / -1; }
  .cs5-facts dd { font-size: 15px; }
  .cs5-metric { grid-template-columns: 1fr; margin: 40px 0 0; padding: 34px 26px; border-radius: 28px; }
  .cs5-story { padding: 80px 10px 20px; }
  .cs5-story-copy p { font-size: 17px; }
  .cs5-mosaic { grid-template-rows: 170px 170px; gap: 10px; }
  .cs5-anatomy, .cs5-mobile { padding: 70px 22px 74px; border-radius: 28px; }
  .cs5-anatomy { margin-top: 70px; }
  .cs5-anatomy-head, .cs5-mobile-head { grid-template-columns: 1fr; }
  .cs5-anatomy-body { grid-template-columns: 1fr; margin-top: 40px; }
  .cs5-pin { width: 30px; height: 30px; margin: -15px 0 0 -15px; font-size: 14px; }
  .cs5-notes { display: grid; gap: 26px; margin-top: 40px; }
  .cs5-note { position: static; transform: none; }
  .cs5-note::before { display: none; }
  .cs5-note h3 { font-size: 22px; }
  .cs5-phones { grid-template-columns: 1fr; gap: 50px; padding: 0 12%; margin-top: 44px; }
  .cs5-phones figure:nth-child(2) { margin-top: 0; }
  .cs5-next { grid-template-columns: 1fr; margin-top: 80px; padding-inline: 10px; }
}


/* ==========================================================================
   v6 · Rédaction de contenu, pages par ville, études de cas étoffées
   ========================================================================== */

/* ---------- Menu : 7e service sur toute la largeur ---------- */
.nav-service-card--wide { grid-column: 1 / -1; min-height: 70px; }

/* ---------- Accueil : carte « Rédaction de contenu » en largeur ---------- */
.home-services-card--wide { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, .62fr) minmax(0, 1.38fr); align-items: stretch; }
.home-services-card--wide .home-services-card-art { display: grid; place-items: center; min-height: 0; height: 100%; }
.home-services-card--wide .home-services-card-art img { width: 210px; height: 210px; object-fit: contain; }
.home-services-card--wide .home-services-card-body { display: flex; flex-direction: column; justify-content: center; padding: 34px 44px; }
.home-services-card--wide .home-services-card-link { margin-top: 26px; }
.home-services-card--wide .home-services-card-body h3 { font-size: clamp(28px, 2.6vw, 38px); }
.home-services-card--wide .home-services-card-body p { max-width: 520px; font-size: 17px; }
.home-services-card--content .home-services-card-category { background: var(--purple); color: #fff; }

/* ---------- Pied de page : « Près de chez vous » ---------- */
.v6-areas { display: grid; grid-template-columns: minmax(0, .9fr) repeat(3, minmax(0, 1fr)); gap: 30px 44px; width: min(1152px, calc(100% - 48px)); margin: 100px auto 0; padding: 44px 0 6px; border-top: 2px solid var(--ink); color: var(--ink); }
.v6-areas-head h2 { font-family: var(--display); font-size: 34px; line-height: .92; font-weight: 800; letter-spacing: -.03em; text-transform: uppercase; }
.v6-areas-head h2 em { font-style: normal; color: var(--purple); }
.v6-areas-head p { margin-top: 14px; font-size: 15px; line-height: 1.5; opacity: .8; }
.v6-areas h3 { margin-bottom: 14px; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.v6-areas ul { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.v6-areas li a { font-size: 15px; font-weight: 600; border-bottom: 1.5px solid transparent; }
.v6-areas li a:hover { border-color: currentColor; }
.v6-areas li a.is-ready::after { content: " ●"; color: var(--orange); font-size: 9px; vertical-align: 2px; }
.page-shell .v6-areas { margin-bottom: 10px; }

/* ---------- Études de cas : le site en images ---------- */
.cs6-gallery { margin-top: 24px; padding: 100px 7.5% 110px; border-radius: 42px; background: var(--cs-soft); }
.cs6-gallery-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .55fr); align-items: end; gap: 24px 8%; }
.cs6-gallery-head .detail-kicker { grid-column: 1 / -1; }
.cs6-gallery-head p { font-size: 17px; line-height: 1.55; }
.cs6-bento { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); grid-template-rows: auto auto; gap: 24px; margin-top: 56px; }
.cs6-bento .cs5-browser { box-shadow: 0 30px 60px -36px rgb(40 20 30 / 55%); }
.cs6-bento .cs5-browser:first-child { grid-row: 1 / 3; display: flex; flex-direction: column; }
.cs6-bento .cs5-browser:first-child img { flex: 1; height: 100%; min-height: 0; object-fit: cover; object-position: top left; }
.cs6-scroll { display: grid; grid-template-columns: minmax(0, 1fr) 330px; align-items: center; gap: 30px 60px; margin-top: 70px; }
.cs6-scroll-screen { height: 640px; overflow-y: auto; border-radius: 9px; scrollbar-width: thin; }
.cs6-scroll-screen img { display: block; width: 100%; height: auto; }
.cs6-scroll-copy h3 { margin-top: 18px; font-family: var(--display); font-size: 40px; line-height: .92; font-weight: 800; letter-spacing: -.03em; text-transform: uppercase; }
.cs6-scroll-copy p { margin-top: 16px; font-size: 16px; line-height: 1.55; }
.cs6-scroll-copy .cs6-hint { display: inline-flex; align-items: center; gap: 10px; margin-top: 22px; padding: 10px 16px; border-radius: 999px; background: #fff; font-size: 13px; font-weight: 800; }

/* ---------- Études de cas : bande de mobiles ---------- */
.cs6-strip { margin-top: 90px; padding: 0 4%; }
.cs6-strip > p { font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--cs-accent); }
.cs6-strip-row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; margin-top: 22px; }
.cs6-strip-row .cs5-phone { padding: 5px; border-radius: 22px; }
.cs6-strip-row .cs5-phone img { border-radius: 18px; }
.cs6-strip-row .cs5-phone:nth-child(even) { margin-top: 34px; }

/* ---------- Études de cas : ce qu'on a livré ---------- */
.cs6-delivered { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 30px 7%; width: min(1152px, 100%); margin: 110px auto 0; }
.cs6-delivered h2 { margin-top: 20px; font-family: var(--display); font-size: clamp(40px, 4.6vw, 64px); line-height: .9; font-weight: 800; letter-spacing: -.04em; text-transform: uppercase; }
.cs6-delivered h2 em { font-style: normal; color: var(--purple); }
.cs6-pages { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.cs6-pages li { padding: 10px 16px; border-radius: 999px; background: #fff; border: 1.5px solid rgb(66 47 54 / 16%); font-size: 15px; font-weight: 700; }
.cs6-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin-top: 30px; border-top: 1px solid rgb(66 47 54 / 22%); }
.cs6-meta div { padding: 16px 16px 0 0; }
.cs6-meta dt { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; opacity: .6; }
.cs6-meta dd { margin: 6px 0 0; font-size: 17px; font-weight: 700; }
.cs6-meta dd a { border-bottom: 2px solid var(--yellow); }

/* ---------- Pages par ville ---------- */
.cs5-facts--4 dl { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1080px) { .cs5-facts--4 dl { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cs5--city { --cs-bg: var(--purple); --cs-soft: #efe9f8; --cs-accent: var(--yellow); }
.cs5--city .cs5-hero.cs5-hero { background: var(--purple); }
.city6-hero .cs5-hero-copy .detail-kicker { color: var(--yellow); }
.city6-hero .cs5-hero h1, .city6-hero h1 { font-size: clamp(56px, 6.2vw, 96px); }
.city6-hero .cs5-visit + .city6-more { display: inline-flex; margin: 30px 0 0 10px; padding: 13px 22px; border-radius: 999px; border: 2px solid rgb(255 255 255 / 70%); color: #fff; font-size: 15px; font-weight: 800; }
.city6-fan { position: relative; min-height: 520px; }
.city6-fan .cs5-browser { position: absolute; width: 74%; }
.city6-fan .cs5-browser:nth-child(1) { top: 0; left: 24%; transform: rotate(5deg); }
.city6-fan .cs5-browser:nth-child(2) { top: 92px; left: 12%; transform: rotate(-1deg); }
.city6-fan .cs5-browser:nth-child(3) { top: 196px; left: 0; transform: rotate(-5deg); }
.city6-pin { position: absolute; z-index: 4; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; background: var(--yellow); color: var(--ink); font-size: 13px; font-weight: 800; box-shadow: 0 14px 26px -14px rgb(0 0 0 / 60%); }
.city6-pin::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--orange); }
.city6-search { position: absolute; z-index: 4; right: -10px; top: -10px; width: 300px; padding: 18px; border-radius: 22px; background: #fff; color: var(--ink); box-shadow: 0 30px 50px -26px rgb(0 0 0 / 70%); transform: rotate(3deg); }
.city6-search-bar { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 999px; border: 1.5px solid #e2dbe0; font-size: 13px; font-weight: 600; }
.city6-search-bar::before { content: ""; width: 12px; height: 12px; border: 2px solid currentColor; border-radius: 50%; }
.city6-result { margin-top: 12px; padding: 10px 12px; border-radius: 12px; }
.city6-result b { display: block; font-size: 14px; }
.city6-result i { display: block; height: 7px; margin-top: 7px; border-radius: 4px; background: #ece6ea; }
.city6-result i + i { width: 70%; }
.city6-result--you { background: #fff6cf; outline: 2px solid var(--yellow); }
.city6-result--you b::after { content: "N°1"; float: right; padding: 2px 8px; border-radius: 999px; background: var(--ink); color: #fff; font-size: 11px; }

.city6-local { margin-top: 110px; padding: 100px 7.5% 110px; border-radius: 42px; background: var(--cs-soft); }
.city6-local-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .6fr); align-items: end; gap: 24px 8%; }
.city6-local-head .detail-kicker { grid-column: 1 / -1; }
.city6-local-head p { font-size: 17px; line-height: 1.55; }
.city6-local-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 54px; }
.city6-local-grid article { padding: 30px 32px 32px; border-radius: 24px; background: #fff; }
.city6-local-grid b { font-family: var(--display); font-size: 40px; line-height: 1; font-weight: 800; color: var(--orange); }
.city6-local-grid h3 { margin-top: 14px; font-family: var(--display); font-size: 26px; line-height: 1; font-weight: 800; letter-spacing: -.02em; text-transform: uppercase; }
.city6-local-grid p { margin-top: 12px; font-size: 16px; line-height: 1.55; }

.city6-cases { width: min(1152px, 100%); margin: 110px auto 0; }
.city6-cases-grid { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 26px; margin-top: 44px; }
.city6-case { display: block; }
.city6-case .cs5-browser { box-shadow: 0 30px 50px -34px rgb(40 20 30 / 60%); transition: transform .2s; }
.city6-case:hover .cs5-browser { transform: translateY(-4px); }
.city6-case h3 { margin-top: 20px; font-family: var(--display); font-size: 26px; line-height: 1; font-weight: 800; letter-spacing: -.02em; text-transform: uppercase; }
.city6-case small { display: block; margin-top: 6px; font-size: 13px; font-weight: 700; opacity: .65; }
.city6-case p { margin-top: 10px; font-size: 15px; line-height: 1.5; }
.city6-case span { display: inline-block; margin-top: 12px; border-bottom: 2px solid var(--yellow); font-size: 14px; font-weight: 800; }

.city6-steps { width: min(1152px, 100%); margin: 110px auto 0; }
.city6-steps ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 26px; margin: 44px 0 0; padding: 0; list-style: none; counter-reset: st; }
.city6-steps li { padding-top: 22px; border-top: 3px solid var(--ink); counter-increment: st; }
.city6-steps li::before { content: "0" counter(st); font-family: var(--display); font-size: 44px; line-height: 1; font-weight: 800; color: var(--purple); }
.city6-steps h3 { margin-top: 12px; font-family: var(--display); font-size: 24px; line-height: 1; font-weight: 800; text-transform: uppercase; }
.city6-steps p { margin-top: 10px; font-size: 15px; line-height: 1.55; }

.city6-near { width: min(1152px, 100%); margin: 90px auto 0; }
.city6-near ul { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0 0; padding: 0; list-style: none; }
.city6-near a { display: inline-block; padding: 11px 18px; border-radius: 999px; border: 1.5px solid rgb(66 47 54 / 25%); font-size: 15px; font-weight: 700; }
.city6-near a.is-main { background: var(--ink); color: #fff; border-color: var(--ink); }
.cs5 :is(.city6-local, .city6-cases, .city6-steps, .city6-near, .cs6-gallery) h2 { font-family: var(--display); font-size: clamp(40px, 4.8vw, 68px); line-height: .9; font-weight: 800; letter-spacing: -.04em; text-transform: uppercase; }
.cs5 :is(.city6-local, .city6-cases, .city6-steps, .city6-near, .cs6-gallery) h2 em { font-style: normal; color: var(--purple); }

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  .v6-areas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .v6-areas-head { grid-column: 1 / -1; }
  .cs6-scroll { grid-template-columns: 1fr; }
  .cs6-delivered { padding-inline: 4%; grid-template-columns: 1fr; }
  .city6-steps ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .city6-cases, .city6-steps, .city6-near { padding-inline: 4%; }
}
@media (max-width: 760px) {
  .home-services-card--wide { grid-template-columns: 1fr; }
  .home-services-card--wide .home-services-card-art { min-height: 200px; }
  .home-services-card--wide .home-services-card-body { padding: 24px; }
  .v6-areas { grid-template-columns: 1fr 1fr; gap: 26px 20px; margin-top: 70px; width: calc(100% - 32px); }
  .v6-areas-head h2 { font-size: 28px; }
  .v6-areas li a { font-size: 14px; }
  .cs6-gallery { padding: 70px 22px 74px; border-radius: 28px; }
  .cs6-gallery-head { grid-template-columns: 1fr; }
  .cs6-bento { grid-template-columns: 1fr; margin-top: 36px; }
  .cs6-bento .cs5-browser:first-child { grid-row: auto; }
  .cs6-scroll-screen { height: 460px; }
  .cs6-scroll-copy h3 { font-size: 32px; }
  .cs6-strip { margin-top: 60px; padding: 0; }
  .cs6-strip-row { grid-template-columns: repeat(5, 150px); overflow-x: auto; padding-bottom: 10px; }
  .cs6-strip-row .cs5-phone:nth-child(even) { margin-top: 0; }
  .cs6-delivered { margin-top: 70px; padding-inline: 10px; }
  .cs6-pages li { font-size: 13px; padding: 8px 12px; }
  .city6-fan { min-height: 300px; }
  .city6-fan .cs5-browser:nth-child(2) { top: 56px; }
  .city6-fan .cs5-browser:nth-child(3) { top: 112px; }
  .city6-search { width: 220px; padding: 12px; right: -6px; }
  .city6-hero .cs5-visit + .city6-more { margin: 12px 0 0; width: 100%; justify-content: center; }
  .city6-local { padding: 70px 22px 74px; border-radius: 28px; margin-top: 70px; }
  .city6-local-head { grid-template-columns: 1fr; }
  .city6-local-grid { grid-template-columns: 1fr; margin-top: 34px; }
  .city6-local-grid article { padding: 24px; }
  .city6-cases { margin-top: 70px; padding-inline: 10px; }
  .city6-cases-grid { grid-template-columns: 1fr; }
  .city6-steps { margin-top: 70px; padding-inline: 10px; }
  .city6-steps ol { grid-template-columns: 1fr; }
  .city6-near { padding-inline: 10px; }
}

/* On compact phones, the long métier noun must not set the grid's min-content width. */
@media (max-width: 400px) {
  .city6-hero .cs5-hero-in { grid-template-columns: minmax(0, 1fr); }
  .city6-hero .cs5-hero-copy,
  .city6-hero .cs5-hero-visual { min-width: 0; }
  .city6-hero h1 { font-size: clamp(40px, 11.5vw, 46px); }
}

/* ==========================================================================
   v7 · Témoignages validés, annonce Google Ads des pages ville
   ========================================================================== */

/* Témoignages : signés par le client */
.proposed-testimonial .proposed-testimonial__status { border-color: currentColor !important; background: transparent !important; color: inherit !important; opacity: .75; }
.proposed-testimonial .proposed-testimonial__note { font-size: 17px !important; font-weight: 800 !important; opacity: 1 !important; }
.proposed-testimonial .proposed-testimonial__note::before { content: "— "; }

/* Pages ville Google Ads : exemple d'annonce */
.city7-ad { position: absolute; z-index: 4; right: -12px; top: -14px; width: 320px; padding: 18px 20px 20px; border-radius: 22px; background: #fff; color: var(--ink); box-shadow: 0 30px 50px -26px rgb(0 0 0 / 70%); transform: rotate(3deg); }
.city7-ad small { display: block; font-size: 12px; color: #5d4f55; }
.city7-ad small b { color: var(--ink); }
.city7-ad strong { display: block; margin-top: 6px; color: #3d33a8; font-size: 18px; line-height: 1.25; font-weight: 700; }
.city7-ad p { margin-top: 6px; font-size: 13px; line-height: 1.45; color: #4b3f44; }
.city7-ad-tag { position: absolute; top: -12px; left: 18px; padding: 4px 10px; border-radius: 999px; background: var(--yellow); font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.cs5--ads { --cs-soft: #fdf3d6; }
.cs5--seo { --cs-soft: #e8f4f9; }

@media (max-width: 760px) {
  .city7-ad { width: 230px; padding: 14px 14px 16px; right: -6px; }
  .city7-ad strong { font-size: 15px; }
  .city7-ad p { font-size: 12px; }
}

/* ==========================================================================
   v8 · Citations en anglais, deux offres de rédaction, rubans sur toutes les pages,
   études de cas avec pages entières, nouvelles vignettes
   ========================================================================== */

/* ---------- Rubans ---------- */
.v8-ribbon { position: relative; width: 100vw; height: 300px; margin-inline: calc(50% - 50vw); overflow: hidden; pointer-events: none; }
.v8-wave { position: absolute; top: 34px; left: 50%; width: max(1690px, 100vw + 250px); height: 235px; transform: translateX(-50%); }
.v8-wave > img, .v8-wave > svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.v8-wave > svg path { fill: none; }
.v8-wave text { fill: #fff; font-family: var(--body); font-size: 27px; font-weight: 500; letter-spacing: 1px; }
.v8-ribbon--yellow text, .v8-home-rib--yellow text { fill: #422f36; }
.v8-ribbon--blue text { fill: #22305f; }
.cs5 .v8-ribbon { margin-block: 24px; }
.cs5--city .v8-ribbon { margin-block: 0; }

/* ---------- Citations des pages services : en anglais, sur deux lignes, sans texte à droite ---------- */
.v8-quote { display: block !important; }
.v8-quote > :is(h2, p)[lang="en"] { display: block; max-width: none !important; width: auto !important; margin-top: 18px; white-space: nowrap; }
.v8-quote > :is(h2, p)[lang="en"] em { display: inline; }

/* ---------- Menu : 8 services, 4 colonnes ---------- */
.nav-mega--services { width: min(1040px, 100vw - 56px); }
.nav-mega--services .nav-service-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* ---------- Accueil : 3 + 3 + 2 cartes centrées ---------- */
@media (min-width: 981px) {
  .home-services-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .home-services-grid > .home-services-card { grid-column: span 2; }
  .home-services-grid > .home-services-card:nth-child(7) { grid-column: 2 / span 2; }
}
.home-services-card--content .home-services-card-category { background: var(--purple); color: #fff; }

/* ---------- Études de cas : pages entières ---------- */
.cs8-full { margin-top: 24px; padding: 100px 7.5% 110px; border-radius: 42px; background: var(--cs-soft); }
.cs8-full-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .55fr); align-items: end; gap: 24px 8%; }
.cs8-full-head .detail-kicker { grid-column: 1 / -1; }
.cs8-full-head p { font-size: 17px; line-height: 1.55; }
.cs5 .cs8-full h2 { font-family: var(--display); font-size: clamp(42px, 5vw, 72px); line-height: .9; font-weight: 800; letter-spacing: -.04em; text-transform: uppercase; }
.cs5 .cs8-full h2 em { font-style: normal; color: var(--purple); }
.cs8-full-body { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 0 64px; margin-top: 60px; align-items: start; }
.cs8-full-copy h3 { font-family: var(--display); font-size: 30px; line-height: .95; font-weight: 800; letter-spacing: -.02em; text-transform: uppercase; }
.cs8-full-copy > p { margin-top: 16px; font-size: 16px; line-height: 1.55; }
.cs8-full-copy ol { margin: 24px 0 0; padding: 0; list-style: none; counter-reset: cs8; }
.cs8-full-copy li { counter-increment: cs8; display: grid; grid-template-columns: 36px minmax(0, 1fr); padding: 13px 0; border-top: 1px solid rgb(66 47 54 / 16%); font-size: 15px; line-height: 1.4; font-weight: 600; }
.cs8-full-copy li::before { content: "0" counter(cs8); font-weight: 800; color: var(--purple); }
.cs8-full-copy > a { display: inline-flex; gap: 8px; margin-top: 24px; padding-bottom: 3px; border-bottom: 1.5px solid currentColor; font-size: 14px; font-weight: 800; }
.cs8-full-pages { display: flex; align-items: flex-start; gap: 36px; }
.cs8-page { flex: 1 1 0; min-width: 0; max-width: 620px; margin: 0; }
.cs8-page .cs5-browser { box-shadow: 0 40px 70px -40px rgb(40 20 30 / 55%); }
.cs8-page figcaption { margin-top: 16px; font-size: 14px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }

/* ---------- Études de cas : 4 écrans mobiles choisis ---------- */
.cs8-phones { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 34px; padding: 0; }
.cs8-phones figure:nth-child(2), .cs8-phones figure:nth-child(4) { margin-top: 60px; }
.cs8-phones figcaption strong { font-size: 19px; }

@media (max-width: 1100px) {
  .cs8-full-body { grid-template-columns: 1fr; gap: 40px; }
  .cs8-phones { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .v8-ribbon { height: 200px; }
  .v8-wave { top: 20px; width: 900px; height: 160px; }
  .v8-quote > :is(h2, p)[lang="en"] { white-space: normal; }
  .cs8-full { padding: 70px 22px 74px; border-radius: 28px; }
  .cs8-full-head { grid-template-columns: 1fr; }
  .cs8-full-pages { flex-direction: column; gap: 40px; }
  .cs8-page { max-width: none; width: 100%; }
  .cs8-phones { grid-template-columns: 1fr; padding: 0 12%; gap: 50px; }
  .cs8-phones figure:nth-child(2), .cs8-phones figure:nth-child(4) { margin-top: 0; }
}

/* ==========================================================================
   v9 · Blog (sections « À lire », page Blog, pages article), service e-commerce,
   menu 3 × 3, accueil 3 × 3, vignettes projets plus grandes, études de cas en pages entières
   ========================================================================== */

:root { --v9-paper: #fffbf9; }
.v9-c-orange { --c: #f05136; --tint: #fff0e8; --on: #fffbf9; --accent: #f05136; }
.v9-c-pink   { --c: #f26a90; --tint: #fde8ee; --on: #422f36; --accent: #d9416c; }
.v9-c-yellow { --c: #f6d732; --tint: #fdf6cf; --on: #422f36; --accent: #b8860b; }
.v9-c-purple { --c: #7b62b8; --tint: #eee8f8; --on: #fffbf9; --accent: #7b62b8; }
.v9-c-blue   { --c: #a9ddec; --tint: #e8f5f8; --on: #212d5e; --accent: #276d84; }

/* ---------- Menu : 9 services, 3 colonnes ---------- */
.nav-mega--services { width: min(940px, 100vw - 56px); }
.nav-mega--services .nav-service-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.detail-nav > a.v9-nav-blog { position: relative; }

/* ---------- Accueil : 3 × 3 ---------- */
@media (min-width: 981px) {
  .home-services-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-services-grid > .home-services-card,
  .home-services-grid > .home-services-card:nth-child(7) { grid-column: auto; }
}
.home-services-card--commerce .home-services-card-category { background: var(--pink); color: #fff; }

/* ---------- Accueil : vignettes projets plus grandes ---------- */
.hpc-small-image { height: auto !important; aspect-ratio: 1110 / 720 !important; object-fit: cover; }

/* ---------- Études de cas : le site en entier, page après page ---------- */
.cs9-full .cs8-full-head h2 em { color: var(--purple); }
.cs9-wall { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 34px; align-items: start; margin-top: 64px; }
.cs9-page { margin: 0 0 40px; }
.cs9-page .cs5-browser { box-shadow: 0 30px 60px -38px rgb(40 20 30 / 60%); }
.cs9-page .cs5-browser img { width: 100%; height: auto; }
.cs9-page figcaption { display: flex; justify-content: space-between; gap: 12px; margin-top: 14px; font-size: 13px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.cs9-page figcaption small { font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; opacity: .6; }
.cs9-visit { display: inline-flex; gap: 8px; margin-top: 8px; padding-bottom: 3px; border-bottom: 1.5px solid currentColor; font-size: 15px; font-weight: 800; }

/* ---------- Petit titre (même style que le reste du site, y compris sur l'accueil) ---------- */
:is(.v9-blog, .v9-bhero, .v9-featured, .v9-toc, .v9-aservice, .v9-theme, .cs9-full) .detail-kicker { display: flex; align-items: center; gap: 10px; font-family: var(--body); font-size: 12px; font-weight: 800; letter-spacing: .14em; line-height: 1.3; text-transform: uppercase; }
:is(.v9-blog, .v9-bhero, .v9-featured, .v9-toc, .v9-aservice, .v9-theme, .cs9-full) .detail-kicker::before { content: ""; flex: none; width: 9px; height: 9px; border-radius: 50%; background: currentColor; }

/* ---------- Cartes article ---------- */
.v9-posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.v9-post { display: flex; flex-direction: column; min-width: 0; border-radius: 30px; background: #fff; color: var(--ink); text-decoration: none;
  box-shadow: 0 1px 0 rgb(66 47 54 / 6%), 0 28px 60px -42px rgb(66 47 54 / 55%); transition: transform .22s, box-shadow .22s; }
.v9-post:hover { transform: translateY(-5px); box-shadow: 0 1px 0 rgb(66 47 54 / 6%), 0 34px 70px -40px rgb(66 47 54 / 60%); }
.v9-post-art { position: relative; display: grid; place-items: center; aspect-ratio: 16 / 11; margin: 10px 10px 0; border-radius: 22px; background: var(--c); overflow: hidden; }
.v9-post-art::after { content: ""; position: absolute; inset: auto -20% -55% -20%; height: 80%; border-radius: 50%; background: rgb(255 255 255 / 14%); }
.v9-post-art img { position: relative; z-index: 1; width: 64%; height: auto; filter: drop-shadow(0 18px 22px rgb(40 20 30 / 18%)); transition: transform .35s cubic-bezier(.2, .9, .3, 1.3); }
.v9-post:hover .v9-post-art img { transform: translateY(-6px) rotate(-3deg) scale(1.03); }
.v9-tag { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px 6px; border-radius: 99px; background: #fff; color: var(--ink); font-size: 11px; font-weight: 800; letter-spacing: .09em; line-height: 1; text-transform: uppercase; }
.v9-tag::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--c); }
.v9-post-art .v9-tag { position: absolute; z-index: 2; left: 16px; top: 16px; }
.v9-post-body { display: flex; flex: 1; flex-direction: column; gap: 12px; padding: 22px 26px 26px; }
.v9-post-meta { font-size: 12px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; opacity: .55; }
.v9-post h3 { margin: 0; font-family: var(--display); font-size: 24px; font-weight: 800; line-height: 1.04; letter-spacing: -.03em; }
.v9-post p { margin: 0; font-size: 15px; line-height: 1.5; opacity: .78; }
.v9-post-link { display: inline-flex; align-self: flex-start; gap: 8px; margin-top: auto; padding: 10px 0 3px; border-bottom: 1.5px solid currentColor; font-size: 14px; font-weight: 800; }

/* ---------- Section « À lire sur le blog » ---------- */
.v9-blog { width: min(1152px, 100%); margin: 0 auto; padding: 120px 0 130px; }
.v9-blog-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .62fr); align-items: end; gap: 24px 8%; margin-bottom: 56px; }
.v9-blog-head .detail-kicker { grid-column: 1 / -1; margin: 0; }
.v9-blog h2, .v9-theme-head h2, .v9-bhero h1, .v9-aservice h2 { margin: 0; font-family: var(--display); font-size: clamp(46px, 5.4vw, 78px); font-weight: 800; line-height: .88; letter-spacing: -.045em; text-transform: uppercase; }
.v9-blog h2 em { font-style: normal; color: var(--purple); }
.v9-blog-head p { margin: 0 0 14px; font-size: 17px; line-height: 1.55; }
.v9-blog-all { display: inline-flex; gap: 8px; padding-bottom: 3px; border-bottom: 1.5px solid currentColor; font-size: 15px; font-weight: 800; }
.v9-blog-head > div { display: grid; gap: 14px; justify-items: start; }

/* ---------- Page Blog ---------- */
.v9-bhero { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .62fr); gap: 40px 6%; align-items: center; margin-top: 18px; padding: 110px 7.5% 96px; border-radius: 42px; background: var(--purple); color: #fffbf9; overflow: hidden; }
.v9-bhero .detail-kicker { color: #fffbf9; }
.v9-bhero h1 { margin-top: 26px; font-size: clamp(60px, 7.4vw, 112px); }
.v9-bhero h1 em { font-style: normal; color: var(--yellow); }
.v9-bhero p { max-width: 560px; margin: 28px 0 0; font-size: 19px; line-height: 1.55; }
.v9-bhero-art { justify-self: center; width: min(420px, 100%); }
.v9-bhero-art img { width: 100%; height: auto; filter: drop-shadow(0 30px 40px rgb(30 15 40 / 35%)); }
.v9-chips { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.v9-chips a { display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px 11px; border-radius: 99px; background: rgb(255 251 249 / 14%); color: #fffbf9; font-size: 14px; font-weight: 700; }
.v9-chips a::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--c, #fffbf9); }
.v9-chips a.is-on { background: #fffbf9; color: var(--ink); }
.v9-featured { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: 0; width: min(1152px, 100%); margin: 90px auto 0; border-radius: 34px; background: #fff; color: var(--ink);
  box-shadow: 0 1px 0 rgb(66 47 54 / 6%), 0 34px 70px -46px rgb(66 47 54 / 55%); overflow: hidden; }
.v9-featured .v9-post-art { aspect-ratio: auto; min-height: 460px; margin: 12px; }
.v9-featured .v9-post-art img { width: 56%; }
.v9-featured-body { display: flex; flex-direction: column; gap: 18px; justify-content: center; padding: 48px 56px 48px 40px; }
.v9-featured-body .detail-kicker { margin: 0; }
.v9-featured h2 { margin: 0; font-family: var(--display); font-size: 44px; font-weight: 800; line-height: 1; letter-spacing: -.035em; }
.v9-featured p { margin: 0; font-size: 17px; line-height: 1.55; opacity: .8; }
.v9-theme { width: min(1152px, 100%); margin: 0 auto; padding: 96px 0 0; }
.v9-theme-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .62fr); gap: 18px 8%; align-items: end; margin-bottom: 40px; padding-top: 34px; border-top: 1.5px solid var(--ink); }
.v9-theme-head h2 { margin-top: 18px; font-size: clamp(40px, 4.4vw, 62px); }
.v9-theme-head p { margin: 0 0 10px; font-size: 17px; line-height: 1.5; }
.v9-theme-head a { display: inline-flex; gap: 8px; padding-bottom: 3px; border-bottom: 1.5px solid currentColor; font-size: 14px; font-weight: 800; }
.v9-theme-head > div:last-child { display: grid; gap: 12px; justify-items: start; }
.v9-blogpage .v8-ribbon { margin-block: 70px -20px; }
.v9-blogpage-end { height: 120px; }

/* ---------- Pages article ---------- */
.v9-ahero { margin-top: 18px; padding: 150px 7.5% 80px; border-radius: 42px; background: var(--c); color: var(--on); }
.v9-crumbs { display: flex; gap: 10px; font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.v9-crumbs a { color: inherit; opacity: .8; }
.v9-crumbs span { opacity: .5; }
.v9-ahero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .5fr); gap: 40px 6%; align-items: center; margin-top: 54px; }
.v9-ahero h1 { margin: 26px 0 0; font-family: var(--display); font-size: clamp(42px, 4.6vw, 66px); font-weight: 800; line-height: .98; letter-spacing: -.04em; }
@media (max-width: 359px) {
  .v9-ahero-grid > * { min-width: 0; }
  .v9-ahero h1 { font-size: clamp(36px, 11.25vw, 40px); }
}
.v9-ahero-lead { max-width: 640px; margin: 26px 0 0; font-size: 20px; line-height: 1.5; }
.v9-ahero-meta { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: 34px; padding-top: 22px; border-top: 1px solid currentColor; font-size: 14px; font-weight: 700; }
.v9-ahero-meta span { opacity: .85; }
.v9-ahero-art { display: grid; place-items: center; aspect-ratio: 1; border-radius: 34px; background: rgb(255 255 255 / 16%); }
.v9-ahero-art img { width: 84%; height: auto; filter: drop-shadow(0 26px 30px rgb(40 20 30 / 22%)); }
.v9-abody { display: grid; grid-template-columns: 270px minmax(0, 740px); justify-content: center; gap: 0 90px; width: min(1152px, 100%); margin: 0 auto; padding: 96px 0 40px; }
.v9-toc { align-self: start; }
.v9-toc .detail-kicker { margin: 0 0 18px; }
.v9-toc ol { margin: 0; padding: 0; list-style: none; counter-reset: toc; }
.v9-toc li { counter-increment: toc; display: grid; grid-template-columns: 30px minmax(0, 1fr); padding: 11px 0; border-top: 1px solid rgb(66 47 54 / 14%); font-size: 14px; line-height: 1.35; font-weight: 600; }
.v9-toc li::before { content: counter(toc, decimal-leading-zero); font-weight: 800; color: var(--accent); }
.v9-toc a { color: inherit; }
.v9-toc-cta { margin-top: 30px; padding: 24px; border-radius: 24px; background: var(--tint); }
.v9-toc-cta small { display: block; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; opacity: .65; }
.v9-toc-cta strong { display: block; margin: 8px 0 14px; font-family: var(--display); font-size: 22px; line-height: 1.05; letter-spacing: -.02em; }
.v9-toc-cta a { display: inline-flex; gap: 8px; padding-bottom: 2px; border-bottom: 1.5px solid currentColor; font-size: 14px; font-weight: 800; }
.v9-prose { min-width: 0; font-size: 19px; line-height: 1.68; color: var(--ink); }
.v9-prose > * + * { margin-top: 22px; }
.v9-prose > p.v9-intro { font-size: 22px; line-height: 1.55; font-weight: 500; }
.v9-prose h2 { margin-top: 70px; font-family: var(--display); font-size: 38px; font-weight: 800; line-height: 1.02; letter-spacing: -.035em; scroll-margin-top: 110px; }
.v9-prose h2 + * { margin-top: 20px; }
.v9-prose a { color: inherit; text-decoration: underline; text-decoration-color: var(--c); text-decoration-thickness: 3px; text-underline-offset: 3px; }
.v9-prose strong { font-weight: 750; }
.v9-prose ul, .v9-prose ol { margin-left: 0; padding-left: 0; list-style: none; }
.v9-prose li { position: relative; padding-left: 36px; }
.v9-prose li + li { margin-top: 12px; }
.v9-prose ul > li::before { content: ""; position: absolute; left: 6px; top: .62em; width: 11px; height: 11px; border-radius: 50%; background: var(--c); }
.v9-prose ol { counter-reset: ol; }
.v9-prose ol > li { counter-increment: ol; }
.v9-prose ol > li::before { content: counter(ol); position: absolute; left: 0; top: .18em; display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; background: var(--c); color: var(--on); font-size: 13px; font-weight: 800; line-height: 1; }
.v9-tip { padding: 26px 30px; border-radius: 24px; background: var(--tint); font-size: 17px; line-height: 1.6; }
.v9-tip strong { display: block; margin-bottom: 6px; font-family: var(--display); font-size: 21px; letter-spacing: -.02em; }
.v9-quote { margin: 46px 0 !important; padding: 0 0 0 30px; border-left: 6px solid var(--c); font-family: var(--display); font-size: 31px; font-weight: 700; line-height: 1.18; letter-spacing: -.025em; }
.v9-table { overflow-x: auto; border-radius: 20px; border: 1px solid rgb(66 47 54 / 14%); }
.v9-table table { width: 100%; border-collapse: collapse; font-size: 16px; line-height: 1.45; }
.v9-table th { padding: 15px 18px; background: var(--ink); color: #fffbf9; text-align: left; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; }
.v9-table td { padding: 15px 18px; border-top: 1px solid rgb(66 47 54 / 12%); vertical-align: top; }
.v9-table tr:nth-child(even) td { background: rgb(66 47 54 / 3%); }
.v9-fig { margin: 46px 0 !important; }
.v9-fig-ph { position: relative; display: grid; place-items: center; aspect-ratio: 3 / 2; border-radius: 28px; background: var(--tint); overflow: hidden; }
.v9-fig-ph::before { content: ""; position: absolute; inset: 18px; border: 2px dashed rgb(66 47 54 / 18%); border-radius: 20px; }
.v9-fig-ph div { position: relative; display: grid; justify-items: center; gap: 12px; max-width: 70%; text-align: center; }
.v9-fig-ph svg { width: 54px; height: 54px; color: var(--accent); }
.v9-fig-ph b { font-size: 13px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.v9-fig-ph small { font-size: 13px; line-height: 1.4; opacity: .6; }
.v9-fig-img { border-radius: 28px; background: var(--tint); overflow: hidden; }
.v9-fig-img img { display: block; width: 100%; height: auto; }
.v9-fig figcaption { margin-top: 14px; font-size: 15px; line-height: 1.5; font-style: italic; opacity: .75; }
.v9-keep { margin-top: 70px !important; padding: 40px 44px; border-radius: 30px; background: var(--c); color: var(--on); }
.v9-keep h2 { margin: 0 0 18px !important; font-size: 30px !important; }
.v9-keep ul { margin: 0; }
.v9-keep li::before { background: var(--on) !important; opacity: .9; }
.v9-afaq h2 { margin-bottom: 20px; }
.v9-afaq details { border-top: 1.5px solid var(--ink); }
.v9-afaq details:last-child { border-bottom: 1.5px solid var(--ink); }
.v9-afaq summary { display: flex; justify-content: space-between; gap: 20px; padding: 20px 0; font-family: var(--display); font-size: 21px; font-weight: 700; line-height: 1.2; letter-spacing: -.015em; cursor: pointer; list-style: none; }
.v9-afaq summary::-webkit-details-marker { display: none; }
.v9-afaq summary b { font-size: 26px; line-height: 1; }
.v9-afaq details p { margin: 0 0 22px; font-size: 17px; line-height: 1.6; }
.v9-aservice { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 30px 6%; align-items: end; width: min(1152px, 100%); margin: 60px auto 0; padding: 70px 7.5%; border-radius: 42px; background: var(--ink); color: #fffbf9; }
.v9-aservice .detail-kicker { grid-column: 1 / -1; margin: 0; color: #fffbf9; }
.v9-aservice h2 { font-size: clamp(40px, 4.6vw, 64px); }
.v9-aservice h2 em { font-style: normal; color: var(--yellow); }
.v9-aservice p { max-width: 560px; margin: 20px 0 0; font-size: 17px; line-height: 1.55; opacity: .85; }
.v9-aservice .pill-button { white-space: nowrap; }
.v9-article .v8-ribbon { margin-block: 40px -30px; }

@media (max-width: 1100px) {
  .v9-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v9-abody { grid-template-columns: minmax(0, 1fr); gap: 50px; padding-inline: 4%; }
  .v9-toc { position: static; }
  .cs9-wall { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .v9-posts { grid-template-columns: 1fr; }
  .v9-blog { width: calc(100% - 32px); padding: 90px 0 100px; }
  .v9-blog-head, .v9-theme-head, .v9-bhero, .v9-ahero-grid, .v9-featured, .v9-aservice { grid-template-columns: 1fr; }
  .v9-bhero { padding: 80px 22px 70px; border-radius: 28px; }
  .v9-featured { width: calc(100% - 32px); }
  .v9-featured .v9-post-art { min-height: 280px; }
  .v9-featured-body { padding: 30px 24px 34px; }
  .v9-featured h2 { font-size: 32px; }
  .v9-theme { width: calc(100% - 32px); padding-top: 70px; }
  .v9-ahero { padding: 50px 22px 60px; border-radius: 28px; }
  .v9-ahero-art { max-width: 320px; }
  .v9-prose { font-size: 17.5px; }
  .v9-prose h2 { font-size: 30px; margin-top: 54px; }
  .v9-quote { font-size: 25px; }
  .v9-keep { padding: 30px 24px; }
  .v9-aservice { width: calc(100% - 32px); padding: 56px 24px; border-radius: 28px; }
  .cs9-wall { grid-template-columns: 1fr; }
}

/* ---------- Compositions ordinateur + téléphone sans fond ---------- */
.sl-proof-media img.v9-devices { box-shadow: none; border-radius: 0; }
.hpc-small-image { background: transparent; }

/* Keep the blog title and artwork inside the hero on 320–400px screens. */
@media (max-width: 400px) {
  .v9-bhero { grid-template-columns: minmax(0, 1fr); }
  .v9-bhero > div:first-child,
  .v9-bhero-art { min-width: 0; }
  .v9-bhero-art { max-width: 100%; }
  .v9-bhero h1 { font-size: clamp(40px, 11.5vw, 46px); }
}

/* ==========================================================================
   v9.3 · retours du 12 octobre : logo, flèches dessinées, fils redessinés,
   pied de page légal, pages légales, études de cas complétées
   ========================================================================== */

/* ---------- logo */
.brand, .detail-brand, .contact-brand { display: inline-flex; align-items: center; line-height: 0; }
.v92-logo { display: block; height: 38px; width: auto; }
.footer-logo { display: inline-flex; line-height: 0; }
.footer-logo .v92-logo { height: 80.5px; }
.detail-footer-brand, .contact-footer-brand { display: inline-flex; line-height: 0; }
.detail-footer-brand .v92-logo, .contact-footer-brand .v92-logo { height: 44px; }
.footer-watermark { text-transform: none !important; letter-spacing: -.04em !important; }

/* ---------- pied de page : mentions légales */
.v92-legal { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 22px; margin-top: 16px; font-size: 14px; line-height: 20px; }
.v92-legal a { color: inherit; text-decoration: underline; text-decoration-color: rgb(66 47 54 / 30%); text-underline-offset: 3px; }
.v92-legal a:hover { text-decoration-color: currentColor; }
.site-footer .footer-main { justify-content: center !important; }
.detail-footer, .contact-footer { flex-wrap: wrap; }
.detail-footer .v92-legal, .contact-footer .v92-legal { order: 9; width: 100%; justify-content: flex-start; margin-top: 4px; padding-top: 16px; border-top: 1px solid rgb(66 47 54 / 12%); color: #66575d; }
.detail-footer .v92-legal span, .contact-footer .v92-legal span { margin-right: auto; }

/* ---------- flèche dessinée (même dessin partout) */
.v92-arrow { display: block; width: 100%; height: auto; overflow: visible; }
.v92-join { display: grid; place-items: center; color: var(--ink, #422f36); }
.v92-join svg { width: 96px; }
.v92-join--down svg { transform: rotate(8deg) translateY(10px); }
.v92-join--up svg { transform: rotate(-8deg) translateY(-10px); }

/* accueil : « On avance, ensemble » */
.process { height: 600px; }
.process .process-dotted, .process .process-curved-arrow, .process .process-arrow-head { display: none !important; }
.process .process-cards { grid-template-columns: minmax(0, 1fr) 104px minmax(0, 1fr) 104px minmax(0, 1fr); gap: 0; width: 1120px; left: calc(50% - 560px); }
.process .process-cards .v92-join svg { width: 96px; }
.process .process-card { width: auto; }

/* services : flèches entre les cartes */
.ms-ux-journey-row { grid-template-columns: minmax(0, 1fr) 96px minmax(0, 1fr) 96px minmax(0, 1fr) !important; gap: 10px !important; }
.mock-software-flow-track { grid-template-columns: minmax(0, 1fr) 96px minmax(0, 1.08fr) 96px minmax(0, 1fr) !important; gap: 10px !important; }
.ms-ux-journey-join.v92-join, .mock-software-flow-arrow.v92-join { font-size: 0; transform: none; }
.ms-ux-journey-join.v92-join { color: var(--orange); }
.mock-software-flow-arrow.v92-join { color: var(--purple); }

/* ---------- fils redessinés (GEO, SEO, rédaction) */
.v92-fil { display: grid; grid-template-columns: minmax(0, 1fr) 110px minmax(0, 1fr) 110px minmax(0, 1fr); align-items: center; margin-top: 56px; }
.v92-fil-step { position: relative; display: flex; align-items: center; gap: 16px; min-height: 118px; padding: 24px 26px; border-radius: 28px; font-family: var(--display); font-size: clamp(22px, 2.2vw, 31px); font-weight: 800; line-height: 1.02; letter-spacing: -.01em; text-transform: uppercase; box-shadow: 0 22px 36px -26px rgb(66 47 54 / 55%); }
.v92-fil-step i { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: rgb(255 255 255 / 70%); color: var(--ink, #422f36); font-style: normal; font-size: 18px; }
.v92-fil-step:nth-child(1) { background: var(--yellow); color: var(--ink, #422f36); transform: rotate(-2deg); }
.v92-fil-step:nth-child(3) { background: var(--pink); color: var(--ink, #422f36); transform: translateY(14px) rotate(1.5deg); }
.v92-fil-step:nth-child(5) { background: var(--purple); color: #fffbf9; transform: rotate(-1deg); }
.v92-fil-step:nth-child(5) i { background: rgb(255 255 255 / 92%); }
.v92-fil .v92-join { color: var(--ink, #422f36); }
.v92-fil .v92-join svg { width: 100px; }
.geo-flow .v92-fil { margin-top: 34px; }
.mseo-measure .v92-fil { margin-top: 64px; }

/* ---------- méthode développement / e-commerce : étiquettes en français */
.ms-web-method-art { width: 330px !important; }
.ms-web-method-art span { width: auto !important; padding: 0 16px; font-size: 20px !important; white-space: nowrap; }

/* ---------- UX : la preuve, l'Auberge en grand */
.v92-proof-big .sl-proof-media img.v9-devices { width: 118%; max-width: none; margin-left: -9%; }

/* ---------- études de cas : notes complétées (photo, témoignage) */
.v92-ana-photo { position: absolute; left: 70px; right: 0; margin: 0; transform: translateY(-20px); }
.v92-ana-photo img { display: block; width: 74%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 26px; transform: rotate(-1.5deg); box-shadow: 0 30px 50px -30px rgb(40 20 30 / 60%); }
.v92-ana-photo figcaption { max-width: 74%; margin-top: 16px; font-size: 15px; line-height: 1.5; opacity: .75; }
.v92-ana-quote { position: absolute; left: 70px; right: 0; margin: 0; padding: 32px 34px 28px; border-radius: 28px; background: var(--ink, #422f36); color: #fffbf9; transform: translateY(-20px) rotate(1deg); }
.v92-ana-quote::before { content: "“"; position: absolute; top: -34px; left: 26px; font-family: var(--display); font-size: 120px; line-height: 1; color: var(--yellow); }
.v92-ana-quote p { margin: 0; font-family: var(--display); font-size: 21px; font-weight: 700; line-height: 1.2; letter-spacing: -.01em; }
.v92-ana-quote cite { display: block; margin-top: 18px; font-style: normal; font-size: 14px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--yellow); }

/* ---------- formulaire : budget */
.contact-fields .v92-half { grid-column: span 1 !important; }

/* ---------- pages légales */
.v92-legal-page { padding: 150px 0 40px; }
.v92-legal-hero { width: min(1152px, 90%); margin: 0 auto; padding-bottom: 50px; border-bottom: 2px solid var(--ink, #422f36); }
.v92-legal-hero h1 { margin: 18px 0 0; font-family: var(--display); font-size: clamp(56px, 7vw, 104px); font-weight: 800; line-height: .9; letter-spacing: -.03em; text-transform: uppercase; }
.v92-legal-hero h1 em { font-style: normal; color: var(--purple); }
.v92-legal-hero p { max-width: 640px; margin: 26px 0 0; font-size: 19px; line-height: 1.55; }
.v92-legal-body { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 0 70px; width: min(1152px, 90%); margin: 60px auto 0; }
.v92-legal-toc { align-self: start; padding: 26px; border-radius: 26px; background: #fff; font-size: 15px; line-height: 1.5; }
.v92-legal-toc b { display: block; margin-bottom: 10px; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.v92-legal-toc ol { margin: 0; padding-left: 20px; } .v92-legal-toc li + li { margin-top: 6px; }
.v92-legal-toc a { color: inherit; }
.v92-legal-prose h2 { margin: 0 0 16px; font-family: var(--display); font-size: 30px; font-weight: 800; line-height: 1.05; text-transform: uppercase; letter-spacing: -.01em; }
.v92-legal-prose section + section { margin-top: 46px; padding-top: 40px; border-top: 1px solid rgb(66 47 54 / 14%); }
.v92-legal-prose p, .v92-legal-prose li { font-size: 17px; line-height: 1.65; }
.v92-legal-prose p { margin: 0 0 12px; }
.v92-legal-prose ul { margin: 0 0 12px; padding-left: 22px; }
.v92-legal-prose .v92-legal-note { margin-top: 46px; padding: 22px 26px; border-radius: 22px; background: #fdf6cf; font-size: 15px; }

/* ==========================================================================
   Titres en pleine largeur (retour du 12 octobre) : un titre en deux parties
   tient sur deux lignes, sur toute la largeur, au lieu de s'empiler en colonne.
   ========================================================================== */
@media (min-width: 1000px) {
  /* accueil, sections « Sur le blog », bandeau de contact */
  .home-services-intro { display: block; }
  .v9-blog-head { grid-template-columns: minmax(0, 1fr) auto; }
  .detail-contact h2 { max-width: none; }
  .mads-journey-title { display: block; }

  /* titres de tête de section : sur toute la ligne, le texte dessous */
  .sl-intro h2 { grid-column: 1 / -1; }
  .sl-intro .sl-intro-copy { grid-column: 1 / -1; columns: 2; column-gap: 7%; margin-top: 10px; }
  .sl-intro .sl-intro-copy p { break-inside: avoid; }
  .sl-included-head h2, .city6-local-head h2, .ms-ux-note h2 { grid-column: 1 / -1; }
  .sl-included-head p, .city6-local-head p { grid-column: 1; max-width: 680px; }
  .ms-ux-note p { grid-column: 1 / -1; max-width: 680px; }
  .geo-measure > div { grid-column: 1 / -1; }

  /* questions fréquentes : le titre en haut, les questions dessous */
  :is(.ms-service-faq, .mservice-faq, .mock-software-faq, .geo-faq, .gv-faq, .tv-faq) { grid-template-columns: minmax(0, 1fr) !important; row-gap: 44px !important; }

  /* méthode, histoire, preuve, projet suivant, héros : le bloc titre s'ouvre (display: contents),
     le surtitre et le titre prennent toute la largeur, le reste garde ses deux colonnes */
  :is(.ms-service-method-intro, .mseo-method-intro, .mock-software-method-heading, .geo-method-head, .mads-method-head,
      .cs5-story-copy, .sl-proof > div:not(.sl-proof-media), .cs5-next > div, .mseo-hero-copy, .geo-hero-copy,
      .city6-hero .cs5-hero-copy, .av2-hero .cs5-hero-copy, .v9-bhero > div:first-child, .v9-ahero-grid > div:first-child) { display: contents; }
  :is(.ms-service-method, .mseo-method, .mock-software-method, .geo-method, .mads-method, .cs5-story, .sl-proof, .cs5-next,
      .mseo-hero-grid, .geo-hero-grid, .city6-hero .cs5-hero-in, .av2-hero .cs5-hero-in, .v9-bhero, .v9-ahero-grid) {
    grid-template-rows: auto auto auto auto auto auto 1fr !important; row-gap: 0 !important; align-items: start !important; }
  :is(.ms-service-method-intro, .mseo-method-intro, .mock-software-method-heading, .geo-method-head, .mads-method-head,
      .cs5-story-copy, .sl-proof > div:not(.sl-proof-media), .cs5-next > div, .mseo-hero-copy, .geo-hero-copy,
      .city6-hero .cs5-hero-copy, .av2-hero .cs5-hero-copy, .v9-bhero > div:first-child, .v9-ahero-grid > div:first-child) > :is(.detail-kicker, .v9-tag) {
    grid-column: 1 / -1; grid-row: 1; justify-self: start; }
  :is(.ms-service-method-intro, .mseo-method-intro, .mock-software-method-heading, .geo-method-head, .mads-method-head,
      .cs5-story-copy, .sl-proof > div:not(.sl-proof-media), .cs5-next > div, .mseo-hero-copy, .geo-hero-copy,
      .city6-hero .cs5-hero-copy, .av2-hero .cs5-hero-copy, .v9-bhero > div:first-child, .v9-ahero-grid > div:first-child) > :is(h1, h2) {
    grid-column: 1 / -1; grid-row: 2; max-width: none; margin-bottom: 44px; }
  :is(.ms-service-method-intro, .mseo-method-intro, .mock-software-method-heading, .geo-method-head, .mads-method-head,
      .cs5-story-copy, .sl-proof > div:not(.sl-proof-media), .cs5-next > div, .mseo-hero-copy, .geo-hero-copy,
      .city6-hero .cs5-hero-copy, .av2-hero .cs5-hero-copy, .v9-bhero > div:first-child, .v9-ahero-grid > div:first-child) > :not(.detail-kicker):not(.v9-tag):not(h1):not(h2) {
    grid-column: 1; }
  /* la colonne de droite démarre sous le titre */
  :is(.ms-service-steps, .mseo-step-list, .mock-software-step-list, .geo-steps, .mads-step-list, .cs5-mosaic, .cs5-next-card,
      .mseo-hero-art, .geo-hero-art, .city6-hero .cs5-hero-visual, .av2-hero .cs5-hero-visual, .v9-bhero-art, .v9-ahero-art) {
    grid-column: 2 !important; grid-row: 3 / 8 !important; }
  .sl-proof > .sl-proof-media { grid-column: 1 !important; grid-row: 3 / 8 !important; }
  .sl-proof > div:not(.sl-proof-media) > :not(.detail-kicker):not(h2) { grid-column: 2; }
  .v9-bhero .v9-chips { grid-row: 8; grid-column: 1 / -1; }
  /* héros : le titre ne doit pas sortir de la page */
  .mseo-hero-copy h1, .geo-hero-copy h1 { margin-bottom: 18px; }
}
@media (min-width: 1000px) {
  .detail-contact { grid-template-columns: minmax(0, 1fr) !important; }
  .detail-contact h2 { font-size: clamp(46px, 5.6vw, 80px); }
  .detail-contact .pill-button { justify-self: start; }
}
@media (min-width: 1000px) {
  .mseo-hero-copy > h1, .geo-hero-copy > h1 { grid-row: 1 !important; }
  .mseo-hero-art, .geo-hero-art { grid-row: 2 / 8 !important; }
}

/* v9.4 : nous quatre, l'équipe à quatre, l'audit express, les pages par métier */

/* ---------- l'équipe à quatre */
.team-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px; }
.team-card { height: auto; min-height: 500px; padding: 24px; }
.team-card p { font-size: 15px; line-height: 21px; }
.team-photo { position: relative; height: 236px; overflow: hidden; }
.team-photo > img { width: 100%; height: 100%; object-fit: cover; }
.team-photo--anais { background: #d8b9c4; }
.team-photo--anais > img { object-position: center 30%; }
.team-card--anais { transform: rotate(-3deg) translateY(30px); }
.team-card--benjamin { transform: rotate(.6deg); }
.team-card--julia { transform: rotate(-1.4deg) translateY(18px); }
.team-card--noam { transform: rotate(3deg) translateY(6px); }
.team-card--noam h3 { color: #2b6f86; }
.team-role--blue { background: var(--blue); color: var(--ink); }
.team-role--orange { top: 226px; left: auto; right: -16px; }
.team-role--purple { left: auto; right: -16px; }
.team-role--blue { left: auto; right: -16px; top: 55px; }
.v94-nophoto { position: absolute; inset: 0; display: grid; place-items: center; background: var(--blue); }
.v94-nophoto b { font-family: var(--display); font-size: 150px; font-weight: 800; line-height: 1; color: #fffbf9; letter-spacing: -.04em; text-shadow: 0 6px 0 rgb(66 47 54 / 12%); }
.v94-chip { position: absolute; z-index: 2; left: 12px; bottom: 12px; padding: 7px 11px 6px; border-radius: 99px; background: #fffbf9; color: var(--ink); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; box-shadow: 0 6px 14px -8px rgb(40 20 30 / 50%); }
/* portrait illustré au survol (en attendant les images : un aplat de couleur et l'objet du métier) */
.v94-illu { position: absolute; inset: 0; z-index: 3; display: grid; place-items: center; opacity: 0; transform: scale(1.04); transition: opacity .35s ease, transform .35s ease; pointer-events: none; }
.v94-illu img.v94-object { width: 74%; height: auto; filter: drop-shadow(0 16px 18px rgb(40 20 30 / 22%)); }
.v94-illu--anais { background: var(--yellow); }
.v94-illu--benjamin { background: var(--pink); }
.v94-illu--julia { background: var(--purple); }
.v94-illu--noam { background: var(--orange); }
.v94-illu--julia .v94-chip, .v94-illu--noam .v94-chip { background: #fffbf9; }
.team-card:hover .v94-illu, .team-card:focus-within .v94-illu { opacity: 1; transform: none; }
.v94-hover-hint { position: absolute; top: 334px; left: 50%; transform: translateX(-50%); font-size: 13px; font-weight: 700; opacity: .65; white-space: nowrap; }
@media (width<=1360px) {
  .team-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team-card--julia { grid-column: auto; }
  .v94-hover-hint { position: static; transform: none; display: block; margin-top: 18px; text-align: center; }
}
@media (width<=700px) { .team-photo { height: clamp(210px, 68vw, 260px); } }

/* ---------- héros : quatre visages */
.hero5-faces img[src*="noam-face"] { object-position: center 30%; }
.team-photo--noam { background: #111; }
.team-photo--noam > img { object-position: center 18%; }

/* ---------- audit express */
.v94-audit { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 56px; align-items: center; width: min(1152px, calc(100% - 48px)); margin: 0 auto 110px; padding: 60px 64px; border-radius: 50px; background: #fff; color: var(--ink); box-shadow: 0 0 0 2px var(--ink), 8px 10px 0 var(--ink); }
.v94-audit .detail-kicker, .v94-kick { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.v94-kick::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--orange); }
.v94-audit h2 { margin: 18px 0 0; font-family: var(--display); font-size: 64px; font-weight: 800; line-height: .92; letter-spacing: -.03em; text-transform: uppercase; }
.v94-audit h2 em { font-style: normal; color: var(--purple); }
.v94-audit-copy > p { margin: 20px 0 0; max-width: 500px; font-size: 18px; line-height: 1.5; }
.v94-audit-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 28px; }
.v94-audit-form label { display: grid; gap: 7px; font-size: 13px; font-weight: 800; }
.v94-audit-form input { width: 100%; padding: 15px 18px; border: 2px solid #e4d8d4; border-radius: 18px; background: #fffbf9; color: var(--ink); font-family: var(--body); font-size: 16px; }
.v94-audit-form input::placeholder { color: #9b8d92; }
.v94-audit-form .pill-button { grid-column: 1 / -1; justify-self: start; margin-top: 6px; border: 0; cursor: pointer; font-family: var(--body); }
.v94-audit-form small { grid-column: 1 / -1; font-size: 12px; line-height: 1.45; opacity: .65; }
.v94-report { position: relative; padding: 30px 30px 26px; border-radius: 30px; background: #f3ece8; }
.v94-report > img { position: absolute; top: -78px; right: -34px; width: 210px; height: auto; transform: rotate(6deg); filter: drop-shadow(0 18px 20px rgb(40 20 30 / 18%)); }
.v94-report h3 { margin: 0; font-family: var(--display); font-size: 22px; font-weight: 800; text-transform: uppercase; letter-spacing: -.01em; }
.v94-report > p { margin: 6px 0 18px; font-size: 14px; opacity: .7; }
.v94-report ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.v94-report li { display: grid; grid-template-columns: 30px 1fr auto; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 16px; background: #fff; font-size: 15px; font-weight: 700; }
.v94-report li i { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; font-style: normal; font-size: 15px; font-weight: 800; }
.v94-report li .ok { background: #d9f0e0; color: #1d6b3a; }
.v94-report li .ko { background: #fde0d9; color: #b23a1f; }
.v94-report li .mid { background: #fdf3c4; color: #7c6200; }
.v94-report li span { font-size: 12px; font-weight: 700; opacity: .6; }
.v94-report-foot { display: flex; align-items: center; gap: 12px; margin-top: 18px; font-size: 13px; line-height: 1.35; }
.v94-report-foot .hero5-faces > * { width: 38px; height: 38px; border-width: 2px; border-color: #f3ece8; }
.v94-report-foot .hero5-faces > * + * { margin-left: -11px; }
@media (width<=1100px) { .v94-audit { grid-template-columns: 1fr; padding: 44px 32px; } .v94-report > img { width: 150px; top: -50px; right: -10px; } }
@media (width<=700px) { .v94-audit { width: calc(100% - 24px); border-radius: 32px; padding: 34px 22px; } .v94-audit h2 { font-size: 40px; } .v94-audit-form { grid-template-columns: 1fr; } }

/* ---------- « Près de chez vous » : quatre colonnes, la tête au-dessus */
.v6-areas.v94-areas { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.v94-areas .v6-areas-head { grid-column: 1 / -1; display: flex; align-items: end; justify-content: space-between; gap: 40px; }
.v94-areas .v6-areas-head p { max-width: 460px; margin: 0; }
@media (width<=700px) { .v6-areas.v94-areas { grid-template-columns: 1fr 1fr; } .v94-areas .v6-areas-head { display: block; } .v94-areas .v6-areas-head p { margin-top: 14px; } }

/* ---------- pages par métier : le visuel du haut */
.v94-mvis { position: relative; min-height: 560px; }
.v94-serp { position: absolute; top: 40px; left: 0; width: 470px; padding: 22px 22px 18px; border-radius: 26px; background: #fff; color: var(--ink); box-shadow: 0 34px 60px -30px rgb(40 20 30 / 55%), 0 0 0 1px rgb(66 47 54 / 6%); transform: rotate(-2deg); }
.v94-serp-bar { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-radius: 999px; border: 1.5px solid #e2dbe0; font-size: 15px; font-weight: 700; }
.v94-serp-bar::before { content: ""; flex: none; width: 13px; height: 13px; border: 2.5px solid currentColor; border-radius: 50%; }
.v94-res { display: grid; grid-template-columns: 28px 1fr; gap: 4px 12px; margin-top: 14px; padding: 14px; border-radius: 18px; }
.v94-res i { grid-row: span 4; width: 28px; height: 28px; border-radius: 50%; background: #ebe3e0; }
.v94-res b { font-size: 15px; line-height: 1.25; }
.v94-res small { font-size: 12px; opacity: .55; }
.v94-res u { display: block; height: 8px; border-radius: 9px; background: #efe8e5; text-decoration: none; }
.v94-res u + u { width: 70%; }
.v94-res--you { background: #fff8d6; box-shadow: inset 0 0 0 2px var(--yellow); }
.v94-res--you i { background: var(--purple); }
.v94-res--you b::after { content: "C’est vous"; margin-left: 8px; padding: 3px 8px 2px; border-radius: 99px; background: var(--yellow); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; vertical-align: 2px; }
.v94-mform { position: absolute; right: 0; bottom: 0; width: 270px; padding: 22px 20px 20px; border-radius: 26px; background: var(--ink); color: #fffbf9; box-shadow: 0 34px 60px -28px rgb(40 20 30 / 70%); transform: rotate(3deg); }
.v94-mform strong { display: block; font-family: var(--display); font-size: 20px; font-weight: 800; line-height: 1; text-transform: uppercase; }
.v94-mform span { display: block; margin-top: 12px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; opacity: .7; }
.v94-mform u { display: block; height: 34px; margin-top: 6px; border-radius: 12px; background: rgb(255 251 249 / 12%); text-decoration: none; }
.v94-mform em { display: block; margin-top: 16px; padding: 12px; border-radius: 99px; background: var(--yellow); color: var(--ink); font-style: normal; font-size: 14px; font-weight: 800; text-align: center; }
.v94-mvis > img { position: absolute; top: 432px; left: 10px; width: 150px; height: auto; transform: rotate(-8deg); filter: drop-shadow(0 18px 20px rgb(40 20 30 / 20%)); }
.v94-mvis .city6-pin { z-index: 5; }
@media (width<=1100px) { .v94-mvis { min-height: 520px; } }
@media (width<=700px) { .v94-mvis { min-height: 470px; } .v94-serp { width: 92%; } .v94-mform { width: 220px; } .v94-mvis > img { width: 120px; left: 10px; top: 320px; } }

/* ---------- pages par métier : le plan du site */
.v94-plan { align-self: center; padding: 30px; border-radius: 30px; background: #f3ece8; }
.v94-plan > span { display: block; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; opacity: .65; }
.v94-plan ol { display: grid; gap: 10px; margin: 16px 0 0; padding: 0; list-style: none; counter-reset: p; }
.v94-plan li { counter-increment: p; display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-radius: 18px; background: #fff; font-family: var(--display); font-size: 21px; font-weight: 800; text-transform: uppercase; letter-spacing: -.01em; }
.v94-plan li::before { content: counter(p, decimal-leading-zero); display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 50%; background: var(--c, var(--yellow)); color: var(--ink); font-family: var(--body); font-size: 13px; }
.v94-plan li:nth-child(4n+2) { --c: var(--pink); } .v94-plan li:nth-child(4n+3) { --c: var(--blue); } .v94-plan li:nth-child(4n+4) { --c: #cbbdea; }
.v94-plan li:first-child { margin-left: 0; } .v94-plan li:nth-child(2) { margin-left: 22px; } .v94-plan li:nth-child(3) { margin-left: 10px; } .v94-plan li:nth-child(4) { margin-left: 30px; } .v94-plan li:nth-child(5) { margin-left: 6px; } .v94-plan li:nth-child(6) { margin-left: 24px; }
.v94-plan small { display: block; margin-top: 14px; font-size: 13px; opacity: .7; }
@media (min-width: 1000px) { .cs5-story > .v94-plan { grid-column: 2 !important; grid-row: 3 / 8 !important; } }
/* héros de l'accueil : « Des sites qui font sonner le téléphone. » sur trois lignes */
@media (min-width: 1361px) { .hero5 { grid-template-columns: minmax(0, 690px) minmax(0, 1fr); } }
/* bas du héros : les quatre, avec leur métier */
.v94-crew { margin-top: 34px; }
.v94-crew p { margin: 0 0 12px; font-size: 13px; font-weight: 700; letter-spacing: .02em; opacity: .82; }
.v94-crew ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.v94-crew li { display: flex; align-items: center; gap: 10px; padding: 5px 16px 5px 5px; border-radius: 99px; background: rgb(255 255 255 / 12%); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 20%); }
.v94-crew img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; object-position: center 22%; border: 2px solid var(--yellow); background: var(--yellow); }
.v94-crew b { display: block; font-size: 14px; font-weight: 800; line-height: 1.1; }
.v94-crew small { display: block; margin-top: 1px; font-size: 12px; font-weight: 600; line-height: 1.2; opacity: .78; }
@media (width<=700px) { .v94-crew li { padding-right: 12px; } .v94-crew img { width: 34px; height: 34px; } }

/* ---------- pages métier (v9.5) : l'histoire, mieux composée */
.v94-mstory .cs5-story-copy p.v94-lead { margin-top: 0; font-size: 25px; line-height: 1.45; font-weight: 500; letter-spacing: -.005em; }
.v94-answer { margin-top: 28px; padding: 26px 30px 30px; border-radius: 28px; background: var(--yellow); color: var(--ink); }
.v94-answer > span { display: inline-block; padding: 7px 13px 6px; border-radius: 99px; background: var(--ink); color: #fffbf9; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.v94-mstory .cs5-story-copy .v94-answer p { margin-top: 14px; font-size: 19px; line-height: 1.55; }
.v94-answer strong { font-weight: 800; }
@media (width<=700px) { .v94-mstory .cs5-story-copy p.v94-lead { font-size: 20px; } .v94-answer { padding: 22px; } .v94-mstory .cs5-story-copy .v94-answer p { font-size: 17px; } }

/* ce que vos clients tapent */
.v94-search { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 64px; align-items: center; width: min(1152px, calc(100% - 48px)); margin: 120px auto 0; padding: 70px 70px 74px; border-radius: 50px; background: var(--ink); color: #fffbf9; }
.v94-search .v94-kick { color: #fffbf9; }
.v94-search h2 { margin: 18px 0 0; font-family: var(--display); font-size: clamp(42px, 5vw, 66px); font-weight: 800; line-height: .92; letter-spacing: -.035em; text-transform: uppercase; }
.v94-search h2 em { font-style: normal; color: var(--yellow); }
.v94-search p { margin: 22px 0 0; max-width: 450px; font-size: 19px; line-height: 1.55; opacity: .88; }
.v94-queries { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.v94-queries li { display: flex; align-items: center; gap: 14px; padding: 17px 24px; border-radius: 99px; background: #fff; color: var(--ink); font-size: 18px; font-weight: 700; box-shadow: 0 20px 34px -22px rgb(0 0 0 / 70%); }
.v94-queries li::before { content: ""; flex: none; width: 13px; height: 13px; border: 2.5px solid currentColor; border-radius: 50%; }
.v94-queries li:nth-child(odd) { transform: rotate(-1.2deg) translateX(-6px); }
.v94-queries li:nth-child(even) { transform: rotate(1deg) translateX(16px); }
.v94-queries li:first-child { background: var(--yellow); }
.v94-search small { display: block; margin-top: 18px; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; opacity: .6; text-align: right; }
@media (width<=1000px) { .v94-search { grid-template-columns: 1fr; padding: 48px 32px; gap: 36px; } }
@media (width<=700px) { .v94-search { width: calc(100% - 24px); border-radius: 32px; padding: 38px 20px; } .v94-queries li { font-size: 15px; padding: 14px 18px; } }

/* titres des nouvelles sections */
.v94-h2 { margin: 0; font-family: var(--display); font-size: clamp(42px, 5vw, 72px); font-weight: 800; line-height: .9; letter-spacing: -.04em; text-transform: uppercase; }
.v94-h2 em { font-style: normal; color: var(--purple); }
.v94-ba .detail-kicker, .v94-deliver .detail-kicker { margin-bottom: 22px; }

/* avant, après */
.v94-ba { width: min(1152px, calc(100% - 48px)); margin: 130px auto 0; }
.v94-ba-labels, .v94-ba-row { display: grid; grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr); align-items: stretch; }
.v94-ba-labels { margin-top: 44px; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.v94-ba-labels span:first-child { opacity: .55; }
.v94-ba-row { margin-top: 12px; }
.v94-ba-row > div { display: flex; align-items: flex-start; gap: 14px; padding: 24px 26px; border-radius: 24px; font-size: 18px; font-weight: 600; line-height: 1.45; }
.v94-ba-row i { display: grid; place-items: center; flex: none; width: 30px; height: 30px; border-radius: 50%; font-style: normal; font-size: 16px; font-weight: 800; }
.v94-before { background: #f3ece8; color: #6f6267; }
.v94-before i { background: #e4d8d4; color: #8a7a80; }
.v94-after { background: var(--yellow); color: var(--ink); }
.v94-after i { background: var(--ink); color: var(--yellow); }
.v94-ba-arrow { display: grid; place-items: center; font-size: 26px; font-weight: 800; color: var(--purple); }
@media (width<=700px) { .v94-ba-labels { display: none; } .v94-ba-row { grid-template-columns: 1fr; gap: 8px; } .v94-ba-arrow { transform: rotate(90deg); } }

/* ce qu'on livre */
.v94-deliver { width: min(1152px, calc(100% - 48px)); margin: 130px auto 0; }
.v94-deliver ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 44px 0 0; padding: 0; list-style: none; }
.v94-deliver li { display: grid; grid-template-columns: 40px 1fr; gap: 6px 16px; padding: 26px 26px 28px; border-radius: 26px; background: #fff; box-shadow: 0 0 0 1px rgb(66 47 54 / 8%); }
.v94-deliver li:nth-child(-n+2) { background: #eee8f8; box-shadow: none; }
.v94-deliver li i { grid-row: span 2; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--yellow); font-style: normal; font-weight: 800; }
.v94-deliver li b { font-family: var(--display); font-size: 21px; font-weight: 800; line-height: 1.05; text-transform: uppercase; letter-spacing: -.01em; }
.v94-deliver li span { font-size: 16px; line-height: 1.5; }
@media (width<=1000px) { .v94-deliver ul { grid-template-columns: 1fr 1fr; } }
@media (width<=700px) { .v94-deliver ul { grid-template-columns: 1fr; } }

/* illustrations Codex (dès qu'elles sont livrées) */
.v94-mvis > img.v94-mvis-art { top: 380px; left: -10px; width: 230px; transform: rotate(-4deg); }
.city6-local-grid article .v94-card-art { display: block; width: 110px; height: 110px; margin: -10px 0 8px -6px; object-fit: contain; }
@media (min-width: 1001px) { .v94-search { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); } .v94-search h2 { font-size: 58px; } }
/* portraits illustrés (Codex) au survol */
.v94-illu img.v94-portrait { width: 100%; height: 100%; object-fit: cover; object-position: center 12%; }
/* bas du héros : l'ancien style, sur une ligne chacun */
.hero5-team.v94-team { margin-top: 36px; gap: 18px; }
.v94-team .hero5-faces > * { width: 54px; height: 54px; }
.v94-team .hero5-faces > * + * { margin-left: -15px; }
.v94-team p { max-width: none; font-size: 15px; line-height: 1.45; }
.v94-team strong { font-size: 16px; }
@media (width<=700px) { .v94-team p { font-size: 13px; } .v94-team .hero5-faces > * { width: 44px; height: 44px; } }
@media (width<=359px) {
  .hero5-team.v94-team { flex-direction: column; align-items: flex-start; gap: 10px; }
  .v94-team p { font-size: 14px; }
}
.team-photo { z-index: 1; }
.v94-mvis > img.v94-mvis-art { top: 392px; left: -26px; width: 240px; }
/* l'équipe : quatre cartes de même hauteur, centrées */
.team-cards { align-items: stretch; }
.team-card { height: 470px; min-height: 0; text-align: center; }
.team-card h3 { margin-top: 24px; }
.team-card p { margin-top: 12px; }
.team-card--anais { transform: rotate(-2deg); }
.team-card--benjamin { transform: rotate(1.2deg); }
.team-card--julia { transform: rotate(-1.2deg); }
.team-card--noam { transform: rotate(2deg); }
@media (width<=700px) { .team-card { height: auto; min-height: 430px; } }


.rp-page { min-height: 100%; background: var(--paper); color: var(--ink); font-family: var(--body); }
.rp-board { padding: 90px 88px 110px; }
.rp-intro h1, .rp-variant-head h2 { margin: 0; font-family: var(--display); font-weight: 800; text-transform: uppercase; letter-spacing: -.03em; }
.rp-intro h1 { font-size: 84px; line-height: .9; } .rp-intro h1 em, .rp-variant-head h2 em { font-style: normal; color: var(--purple); }
.rp-variant-head h2 { font-size: 46px; line-height: .95; }
.rp-kick { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 18px; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.rp-kick::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--orange); }
.rp-intro { display: grid; grid-template-columns: 1.15fr 1fr; gap: 60px; align-items: end; padding-bottom: 46px; border-bottom: 2px solid var(--ink); }
.rp-intro p { margin: 0; font-size: 19px; line-height: 1.55; }
.rp-rules { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 36px 0 0; }
.rp-rule { padding: 20px 22px; border-radius: 22px; background: #fff; font-size: 15px; line-height: 1.45; }
.rp-rule b { display: block; margin-bottom: 6px; font-family: var(--display); font-size: 15px; text-transform: uppercase; letter-spacing: .02em; }
.rp-variant { margin-top: 84px; }
.rp-variant-head { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: end; margin-bottom: 34px; }
.rp-variant-head p { margin: 0; font-size: 17px; line-height: 1.55; }
.rp-badge { display: inline-block; margin-left: 12px; padding: 7px 12px 6px; border-radius: 99px; background: var(--yellow); font-family: var(--body); font-size: 12px; font-weight: 800; letter-spacing: .08em; vertical-align: middle; }
.rp-stage { display: flex; flex-wrap: wrap; gap: 44px 34px; align-items: flex-start; padding: 54px 44px; border-radius: 36px; background: #f3ece8; overflow: hidden; }
.rp-stage--dark { background: #e9e0f4; }
.rp-step { flex: none; display: grid; gap: 14px; justify-items: start; }
.rp-step > small { font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; opacity: .6; }


/* ---------- éléments communs */
.rp-card { position: relative; width: 340px; padding: 26px 24px 24px; border-radius: 28px; background: #fffbf9; color: var(--ink); font-family: var(--body);
  box-shadow: 0 34px 60px -32px rgb(40 20 30 / 60%), 0 0 0 1px rgb(66 47 54 / 8%); }
.rp-x { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 50%; background: #f1e8e4; color: var(--ink); font-size: 18px; line-height: 1; cursor: pointer; }
.rp-tag { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px 6px; border-radius: 99px; background: var(--yellow); font-size: 11px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.rp-title { margin: 14px 0 0; font-family: var(--display); font-size: 30px; font-weight: 800; line-height: .95; letter-spacing: -.02em; text-transform: uppercase; }
.rp-title em { font-style: normal; color: var(--purple); }
.rp-text { margin: 12px 0 0; font-size: 15px; line-height: 1.5; }
.rp-faces { display: inline-flex; flex: none; }
.rp-faces > * { width: 34px; height: 34px; margin-left: -9px; border: 2px solid #fffbf9; border-radius: 50%; object-fit: cover; object-position: center 12%; }
.rp-faces > :first-child { margin-left: 0; }
.rp-faces b { display: grid; place-items: center; background: var(--yellow); font-family: var(--display); font-size: 15px; }
.rp-who { display: flex; align-items: center; gap: 10px; margin-top: 16px; font-size: 13px; line-height: 1.35; }
.rp-btn { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; margin-top: 18px; padding: 15px 18px; border: 0; border-radius: 99px; background: var(--yellow); color: var(--ink);
  font-family: var(--body); font-size: 15px; font-weight: 800; cursor: pointer; box-shadow: inset 0 -3px 0 rgb(66 47 54 / 14%); }
.rp-btn--ink { background: var(--ink); color: #fffbf9; }
.rp-link { margin-top: 12px; border: 0; background: none; color: inherit; font-family: var(--body); font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.rp-art { position: absolute; width: 98px; height: auto; pointer-events: none; filter: drop-shadow(0 12px 14px rgb(40 20 30 / 18%)); }
.rp-label { display: block; margin: 16px 0 8px; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; opacity: .65; }
.rp-days { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.rp-day { display: grid; gap: 2px; justify-items: center; padding: 9px 0 8px; border: 1.5px solid #e4d8d4; border-radius: 16px; background: #fff; color: var(--ink); font-family: var(--body); cursor: pointer; }
.rp-day small { font-size: 11px; font-weight: 700; text-transform: uppercase; opacity: .65; }
.rp-day b { font-family: var(--display); font-size: 20px; line-height: 1; }
.rp-day[aria-pressed="true"] { border-color: var(--purple); background: var(--purple); color: #fffbf9; }
.rp-day[aria-pressed="true"] small { opacity: .85; }
.rp-seg { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; border-radius: 18px; background: #f1e8e4; }
.rp-seg button { padding: 10px 6px 9px; border: 0; border-radius: 14px; background: transparent; color: var(--ink); font-family: var(--body); font-size: 13px; font-weight: 800; line-height: 1.2; cursor: pointer; }
.rp-seg button small { display: block; font-size: 11px; font-weight: 600; opacity: .65; }
.rp-seg button[aria-pressed="true"] { background: var(--yellow); box-shadow: 0 6px 12px -8px rgb(66 47 54 / 50%); }
.rp-slots { display: flex; flex-wrap: wrap; gap: 6px; }
.rp-slot { padding: 9px 12px 8px; border: 1.5px solid #e4d8d4; border-radius: 99px; background: #fff; color: var(--ink); font-family: var(--body); font-size: 13px; font-weight: 700; cursor: pointer; }
.rp-slot[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: #fffbf9; }
.rp-top { display: flex; align-items: center; gap: 10px; }
.rp-back { display: grid; place-items: center; width: 30px; height: 30px; border: 0; border-radius: 50%; background: #f1e8e4; color: var(--ink); font-size: 15px; cursor: pointer; }
.rp-dots { display: flex; gap: 5px; margin-left: auto; margin-right: 42px; }
.rp-dots i { width: 22px; height: 5px; border-radius: 9px; background: #e4d8d4; } .rp-dots i.on { background: var(--purple); }
.rp-field { display: grid; gap: 6px; margin-top: 12px; }
.rp-field span { font-size: 12px; font-weight: 800; }
.rp-input { display: flex; align-items: center; gap: 8px; padding: 12px 14px; border: 1.5px solid #e4d8d4; border-radius: 16px; background: #fff; font-size: 15px; }
.rp-input em { font-style: normal; font-weight: 800; opacity: .7; }
.rp-input input, .rp-input textarea { width: 100%; border: 0; outline: 0; background: none; color: var(--ink); font-family: var(--body); font-size: 15px; resize: none; }
.rp-sum { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding: 11px 14px; border-radius: 16px; background: #eee8f8; font-size: 13px; font-weight: 700; }
.rp-sum button { margin-left: auto; border: 0; background: none; color: var(--purple); font-family: var(--body); font-size: 12px; font-weight: 800; text-decoration: underline; cursor: pointer; }
.rp-legal { margin: 10px 0 0; font-size: 11px; line-height: 1.45; opacity: .65; }
.rp-done { text-align: center; }
.rp-done img { width: 150px; height: auto; margin: -6px auto 0; display: block; }
.rp-launcher { display: inline-flex; align-items: center; gap: 10px; padding: 8px 18px 8px 8px; border: 0; border-radius: 99px; background: var(--ink); color: #fffbf9; font-family: var(--body); font-size: 14px; font-weight: 800;
  box-shadow: 0 18px 30px -16px rgb(40 20 30 / 70%); cursor: pointer; }
.rp-launcher i { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--yellow); color: var(--ink); font-style: normal; }

/* ---------- B : la conversation */
.rpB { width: 360px; border-radius: 28px; overflow: hidden; background: #fffbf9; box-shadow: 0 34px 60px -32px rgb(40 20 30 / 60%), 0 0 0 1px rgb(66 47 54 / 8%); }
.rpB-head { position: relative; display: flex; align-items: center; gap: 12px; padding: 18px 20px; background: var(--purple); color: #fffbf9; }
.rpB-head .rp-faces > * { border-color: var(--purple); }
.rpB-head { padding-right: 56px; } .rpB-head strong { display: block; font-family: var(--display); font-size: 15px; text-transform: uppercase; letter-spacing: -.01em; }
.rpB-head small { font-size: 12px; opacity: .85; }
.rpB-head .rp-x { top: 50%; transform: translateY(-50%); background: rgb(255 255 255 / 18%); color: #fff; }
.rpB-body { display: grid; gap: 10px; padding: 18px 16px 16px; }
.rpB-msg { max-width: 82%; padding: 11px 14px; border-radius: 18px 18px 18px 6px; background: #fff; font-size: 14px; line-height: 1.4; box-shadow: 0 0 0 1px rgb(66 47 54 / 8%); }
.rpB-me { justify-self: end; padding: 9px 14px; border-radius: 18px 18px 6px 18px; background: var(--yellow); font-size: 14px; font-weight: 800; }
.rpB-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.rpB-send { display: flex; gap: 8px; align-items: center; margin-top: 4px; }
.rpB-send .rp-input { flex: 1; padding: 10px 14px; border-radius: 99px; }
.rpB-send button { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--purple); color: #fff; font-size: 18px; }
.rpB-bubble { display: inline-flex; align-items: center; gap: 12px; padding: 10px 18px 10px 10px; border-radius: 99px; background: #fff; color: var(--ink); font-size: 14px; font-weight: 800;
  box-shadow: 0 18px 30px -16px rgb(40 20 30 / 55%), 0 0 0 1px rgb(66 47 54 / 8%); }
.rpB-bubble small { display: block; font-size: 12px; font-weight: 600; opacity: .65; }

/* ---------- C : le ticket et le planning */
.rpC-ticket { position: relative; width: 360px; padding: 24px 26px 22px; border-radius: 22px; background: var(--ink); color: #fffbf9;
  -webkit-mask: radial-gradient(circle 12px at 0 62%, #0000 98%, #000) , radial-gradient(circle 12px at 100% 62%, #0000 98%, #000); -webkit-mask-composite: source-in; mask-composite: intersect; }
.rpC-ticket::after { content: ""; position: absolute; left: 22px; right: 22px; top: 62%; border-top: 2px dashed rgb(255 251 249 / 25%); }
.rpC-big { display: flex; align-items: baseline; gap: 10px; font-family: var(--display); text-transform: uppercase; }
.rpC-big b { font-size: 64px; line-height: .8; color: var(--yellow); letter-spacing: -.04em; }
.rpC-big span { font-size: 18px; line-height: 1; letter-spacing: .02em; }
.rpC-ticket p { margin: 12px 0 0; font-size: 14px; line-height: 1.45; opacity: .85; }
.rpC-ticket .rp-btn { margin-top: 30px; }
.rpC-plan { width: 440px; }
.rpC-grid { display: grid; grid-template-columns: 74px repeat(5, 1fr); gap: 6px; margin-top: 14px; }
.rpC-grid > small { align-self: center; font-size: 11px; font-weight: 800; text-transform: uppercase; opacity: .6; }
.rpC-grid > span { display: grid; justify-items: center; font-size: 11px; font-weight: 800; text-transform: uppercase; opacity: .7; }
.rpC-grid > span b { font-family: var(--display); font-size: 18px; opacity: 1; }
.rpC-cell { height: 46px; border: 1.5px dashed #d9ccc7; border-radius: 14px; background: #fff; }
.rpC-cell.on { border: 0; background: var(--yellow); box-shadow: inset 0 -3px 0 rgb(66 47 54 / 14%); display: grid; place-items: center; font-weight: 800; }
.rpC-cell.off { border-style: solid; background: repeating-linear-gradient(-45deg, #f1e8e4 0 6px, #fff 6px 12px); }
.rpC-row { display: flex; gap: 8px; align-items: center; margin-top: 14px; }
.rpC-row .rp-input { flex: 1; }
.rpC-row .rp-btn { width: auto; margin: 0; padding: 14px 18px; white-space: nowrap; }
.rpC-confirm { width: 360px; display: flex; align-items: center; gap: 16px; padding: 18px 20px; border-radius: 22px; background: #fffbf9; box-shadow: 0 34px 60px -32px rgb(40 20 30 / 60%); }
.rpC-confirm i { display: grid; place-items: center; flex: none; width: 52px; height: 52px; border-radius: 50%; background: var(--yellow); font-style: normal; font-size: 24px; font-weight: 800; }
.rpC-confirm strong { display: block; font-family: var(--display); font-size: 18px; text-transform: uppercase; }
.rpC-confirm span { font-size: 13px; line-height: 1.4; }

/* ---------- D : la pastille */
.rpD { position: relative; width: 150px; height: 150px; }
.rpD svg.ring { position: absolute; inset: 0; animation: rp-spin 18s linear infinite; }
.rpD text { font-family: var(--display); font-size: 13.5px; font-weight: 800; letter-spacing: .14em; fill: var(--ink); }
.rpD-core { position: absolute; inset: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--purple); color: #fff; box-shadow: 0 14px 26px -14px rgb(40 20 30 / 70%); }
.rpD-disc { position: absolute; inset: 0; border-radius: 50%; background: var(--yellow); box-shadow: 0 24px 40px -24px rgb(40 20 30 / 65%); }
@keyframes rp-spin { to { transform: rotate(360deg); } }
.rpD-tip { position: relative; max-width: 220px; padding: 14px 16px; border-radius: 18px 18px 6px 18px; background: #fff; font-size: 14px; font-weight: 700; line-height: 1.35; box-shadow: 0 18px 30px -18px rgb(40 20 30 / 60%); }

/* ---------- mobile */
.rp-phone { position: relative; width: 300px; height: 620px; padding: 12px; border-radius: 44px; background: #1d1519; box-shadow: 0 30px 60px -30px rgb(40 20 30 / 70%); }
.rp-screen { position: relative; height: 100%; border-radius: 34px; overflow: hidden; background: #7b62b8; }
.rp-screen .rp-mhero { padding: 64px 22px 0; color: #fffbf9; font-family: var(--display); font-size: 34px; font-weight: 800; line-height: .92; text-transform: uppercase; letter-spacing: -.03em; }
.rp-screen .rp-mhero em { font-style: normal; color: var(--yellow); }
.rp-screen .rp-mtext { padding: 14px 22px; color: #fffbf9; font-size: 13px; line-height: 1.45; opacity: .9; }
.rp-mbar { position: absolute; left: 10px; right: 10px; bottom: 10px; display: flex; align-items: center; gap: 10px; padding: 10px 10px 10px 12px; border-radius: 22px; background: #fffbf9; box-shadow: 0 16px 30px -14px rgb(0 0 0 / 50%); font-size: 13px; font-weight: 800; color: var(--ink); }
.rp-mi { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--yellow); font-style: normal; }
.rp-mbar .rp-btn { width: auto; margin: 0 0 0 auto; padding: 10px 14px; font-size: 12px; }
.rp-sheet { position: absolute; left: 0; right: 0; bottom: 0; padding: 14px 18px 20px; border-radius: 28px 28px 0 0; background: #fffbf9; color: var(--ink); box-shadow: 0 -20px 40px -20px rgb(0 0 0 / 50%); }
.rp-sheet::before { content: ""; display: block; width: 44px; height: 5px; margin: 0 auto 12px; border-radius: 9px; background: #ddd0cb; }
.rp-scrim { position: absolute; inset: 0; background: rgb(29 21 25 / 45%); }

/* ---------- prototype en situation */
.rp-demo { position: relative; height: 900px; overflow: hidden; background: var(--paper); }
.rp-demo .hero { pointer-events: none; }
.rp-dock { position: absolute; right: 30px; bottom: 30px; z-index: 50; display: grid; justify-items: end; }
.rp-help { position: absolute; left: 30px; bottom: 30px; z-index: 50; display: flex; align-items: center; gap: 12px; padding: 12px 14px 12px 18px; border-radius: 18px; background: #fff; box-shadow: 0 0 0 1px rgb(66 47 54 / 10%); font-size: 13px; }
.rp-help button { padding: 9px 14px; border: 0; border-radius: 99px; background: var(--ink); color: #fffbf9; font-family: var(--body); font-size: 12px; font-weight: 800; cursor: pointer; }

/* ---------- accroches */
.acc-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 34px 30px; margin-top: 46px; }
.acc-item small { display: block; margin-bottom: 12px; font-size: 13px; font-weight: 800; letter-spacing: .06em; }
.acc-item small b { display: inline-grid; place-items: center; width: 26px; height: 26px; margin-right: 8px; border-radius: 50%; background: var(--ink); color: #fff; font-family: var(--display); }
.acc-frame { position: relative; width: 616px; height: 320px; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 44px -28px rgb(40 20 30 / 60%); }
.acc-scale { position: absolute; top: 0; left: 0; width: 1440px; transform: scale(.4278); transform-origin: 0 0; }
.acc-item p { margin: 12px 0 0; font-size: 15px; line-height: 1.5; }

.rp-page [hidden] { display: none !important; }
.rp-faces b.rp-m { background: var(--blue); }
.rp-intro--solo { grid-template-columns: 1fr; gap: 20px; align-items: start; }
.rp-intro--solo h1 { font-size: 84px; }
.rp-intro--solo p { max-width: 780px; }
.rp-screen .rp-mhero { font-size: 30px; }
.rp-nav { display: flex; gap: 8px; margin-top: 22px; }
.rp-nav span { padding: 8px 14px 7px; border-radius: 99px; background: #fff; font-size: 13px; font-weight: 800; box-shadow: 0 0 0 1.5px #e4d8d4; }
.rp-nav span.on { background: var(--ink); color: #fffbf9; box-shadow: none; }
.rp-sec { display: flex; align-items: baseline; gap: 14px; margin: 70px 0 22px; }
.rp-sec h2 { margin: 0; font-family: var(--display); font-size: 34px; font-weight: 800; text-transform: uppercase; letter-spacing: -.02em; }
.rp-sec p { margin: 0; font-size: 15px; opacity: .7; }
.rp-frame { border-radius: 30px; overflow: hidden; box-shadow: 0 0 0 2px var(--ink); }
.rp-board .rp-demo { height: 900px; }
.rp-scale { width: 1440px; transform: scale(.8778); transform-origin: 0 0; }
.rp-frame--demo { height: 790px; }
/* B : une question à la fois */
.rpB-body .rp-slot { font-size: 13px; }
.rpB-msg strong { font-weight: 800; }
.rpB-body .rpB-send button { cursor: pointer; }
/* C : cases cliquables */
button.rpC-cell { display: grid; place-items: center; padding: 0; color: var(--ink); font-family: var(--body); font-size: 16px; font-weight: 800; cursor: pointer; }
button.rpC-cell::after { content: "✓"; opacity: 0; }
button.rpC-cell[aria-pressed="true"] { border: 0; background: var(--yellow); box-shadow: inset 0 -3px 0 rgb(66 47 54 / 14%); }
button.rpC-cell[aria-pressed="true"]::after { opacity: 1; }
.rpC-dock { display: grid; gap: 14px; justify-items: end; }
/* D : la pastille cliquable */
button.rpD { border: 0; padding: 0; background: none; cursor: pointer; }
.rpD-wrap { display: flex; align-items: flex-end; gap: 14px; }

.v94-dock { position: absolute; z-index: 60; top: 870px; right: 30px; transform: translateY(-100%); display: grid; justify-items: end; font-family: var(--body); color: var(--ink); text-align: left; }
.v94-dock [hidden] { display: none !important; }

/* Production-only behavior for the reference callback design. */
.v94-dock[data-rappel-live] {
  position: fixed;
  z-index: 1000;
  top: auto;
  right: 30px;
  bottom: 30px;
  transform: none;
}
.v94-dock[data-rappel-live][hidden] { display: none !important; }
.v94-dock[data-rappel-live].is-over-contact-form .rp-launcher { display: none; }
@media (prefers-reduced-motion: no-preference) {
  .v94-dock[data-rappel-live].is-ringing .rp-launcher i {
    position: relative;
    transform-origin: 50% 65%;
    animation: nq-callback-ring .58s ease-in-out .18s 5;
  }
  .v94-dock[data-rappel-live].is-ringing .rp-launcher i::after {
    content: '';
    position: absolute;
    inset: -5px;
    border: 2px solid var(--yellow);
    border-radius: 50%;
    pointer-events: none;
    animation: nq-callback-pulse 1s ease-out .2s 3;
  }
  @keyframes nq-callback-ring {
    0%, 100% { transform: rotate(0deg); }
    18%, 55% { transform: rotate(-23deg) translateX(-1px); }
    37%, 76% { transform: rotate(23deg) translateX(1px); }
  }
  @keyframes nq-callback-pulse {
    0% { opacity: .9; transform: scale(.75); }
    100% { opacity: 0; transform: scale(1.55); }
  }
}
.rp-form-status {
  margin: 12px 0 0;
  font-size: 13px;
  line-height: 1.4;
}
.rp-form-status[data-error] { color: #b7331d; }
.nq-context-link { color: inherit; text-decoration: none; }
.nq-context-link:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

/* Accessible text contrast while retaining the export's shapes and typography. */
.home-services-card--commerce .home-services-card-category,
.contact-sticker,
.mseo-sheet-content > span { color: #251418; }

.hpc-count > span,
.v94-ba-labels span:first-child,
.cs5-facts dt,
.cs6-meta dt,
.city6-case small { color: #7b6870; opacity: 1; }

.v9-post-meta { color: #857078; opacity: 1; }

.v94-audit-form small,
.v94-report li span { color: #806b74; opacity: 1; }

.v94-plan > span,
.cs9-page figcaption small { color: #775f68; opacity: 1; }

.mseo-ingredients-list article > span { color: #7457ac; }
.hero--v5 .hero5-bar span { color: #4e3f49; }

/* This oversized wordmark is an incidental decorative graphic. */
.footer-watermark::before { content: 'nous quatre'; }

@media (max-width: 700px) {
  .v94-dock[data-rappel-live] { right: 12px; bottom: 12px; }
  .v94-dock[data-rappel-live] .rp-card { width: min(340px, calc(100vw - 24px)); }
}

/* On narrow Ads landings, keep the hero's two links tappable before showing the floating call CTA. */
@media (max-width: 360px) {
  .v94-dock[data-rappel-live].is-over-hero-actions .rp-launcher { display: none; }
}