@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/plus-jakarta-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/plus-jakarta-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/plus-jakarta-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/plus-jakarta-sans-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/plus-jakarta-sans-latin-800-normal.woff2) format('woff2')}
@font-face{font-family:'Sora';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/sora-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Sora';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/sora-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Sora';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/sora-latin-700-normal.woff2) format('woff2')}
/* ASTEC Informatique — feuille de style du site */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#F8FAFC}
.wrap{min-height:100vh;display:flex;flex-direction:column;font-family:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;color:#0F172A;font-size:16px;line-height:1.55;background-color:#F8FAFC}
img{max-width:100%}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:#0F172A;color:#FFFFFF!important;padding:10px 16px;border-radius:8px;text-decoration:none;font-weight:700}
.skip:focus{top:12px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* --- Styles issus de la maquette --- */
a{color:#C2410C}a:hover{color:#9A3412}
a:focus-visible,button:focus-visible{outline:3px solid #F97316;outline-offset:2px}
h1,h2,h3{font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-weight:800}
.nav-link{color:#1E293B;text-decoration:none;padding:8px 2px;border-bottom:2px solid transparent}
.nav-link:hover{color:#C2410C;border-bottom-color:#F97316}
.burger{display:none;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #CBD5E1;border-radius:8px;background:#FFFFFF;color:#0F172A;cursor:pointer;padding:0}
header nav{gap:2px 26px!important;font-size:15px!important;align-items:center}
.dd{position:relative}
.dd-btn{display:flex;align-items:center;gap:7px;font:inherit;font-weight:600;color:#1E293B;background:none;border:0;border-bottom:2px solid transparent;padding:8px 2px;cursor:pointer}
.dd-btn::after{content:"";width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.dd:hover .dd-btn,.dd.cur .dd-btn{color:#C2410C}.dd.cur .dd-btn{border-bottom-color:#F97316}
.dd-menu{display:none;position:absolute;top:100%;left:-12px;min-width:210px;padding:8px;background:#FFFFFF;border:1px solid #E2E8F0;border-radius:10px;box-shadow:0 14px 34px rgba(15,23,42,.14);flex-direction:column;z-index:60}
.dd.open .dd-menu{display:flex}
.dd-menu .nav-link{padding:9px 10px;border-bottom:0;border-radius:6px}
.dd-menu .nav-link:hover,.dd-menu .nav-link[aria-current]{background:#FFF7ED}
@media (max-width:1240px){header>div{padding:6px 16px!important;gap:8px 10px!important}header img{height:42px!important}.burger{display:flex;order:3}header>div>div{order:2;margin-left:auto;gap:10px!important}header nav{display:none!important;order:5;width:100%;flex-direction:column;gap:0!important;padding-bottom:8px}header.open nav{display:flex!important}header nav .nav-link{padding:12px 4px;border-bottom:1px solid #E2E8F0}header nav{align-items:stretch!important}header nav .dd-btn{pointer-events:none;padding:14px 4px 2px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#64748B;border:0}header nav .dd-btn::after{display:none}header nav .dd-menu{display:flex;position:static;min-width:0;padding:0;border:0;box-shadow:none;border-radius:0}header nav .dd-menu .nav-link{padding:12px 4px;border-bottom:1px solid #E2E8F0;border-radius:0;background:none}}
@media (max-width:600px){.pg-accueil h1{font-size:34px!important}.hero>div{padding-top:36px!important;padding-bottom:40px!important}.viz{display:none!important}}
.in-1{animation:astec-in .7s cubic-bezier(.2,.7,.2,1) both}
.in-2{animation:astec-in .8s .15s cubic-bezier(.2,.7,.2,1) both}
@keyframes astec-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.hero{background:linear-gradient(135deg,#0F172A 0%,#16223A 55%,#2A3A52 100%);color:#FFFFFF}
.hero .hl{color:#F97316}
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.14);color:#E2E8F0;text-decoration:none;font-weight:600;font-size:14px;transition:border-color .2s,color .2s}
.chip:hover{border-color:#F97316;color:#FFFFFF}
.chip::after{content:"";width:6px;height:6px;border-right:2px solid #F97316;border-top:2px solid #F97316;transform:rotate(45deg)}
.ring{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.07)}
.float{animation:fl 4s ease-in-out infinite}.float2{animation:fl 4s 1.6s ease-in-out infinite}
@keyframes fl{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.bar{height:6px;border-radius:3px;background:#F97316;transform-origin:left center;animation:bar 3.2s ease-in-out infinite alternate}
.bar2{animation-duration:4.4s}
@keyframes bar{from{transform:scaleX(.55)}to{transform:scaleX(1)}}
.dot{width:8px;height:8px;border-radius:50%;background:#22C55E;box-shadow:0 0 0 0 rgba(34,197,94,.6);animation:dot 2s infinite}
@keyframes dot{70%{box-shadow:0 0 0 9px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.stat{text-align:center}
@media (prefers-reduced-motion: reduce){.float,.float2,.bar,.dot{animation:none}}
.hl{color:#EA580C}
.hdr-tel{color:#334155;text-decoration:none;font-weight:600;font-size:14px}
.btn-contact{display:inline-flex;align-items:center;gap:8px;background:#C2410C;color:#FFFFFF!important;text-decoration:none;font-weight:700;font-size:14px;padding:10px 20px;border-radius:999px;box-shadow:0 8px 20px rgba(234,88,12,.28)}
.btn-contact:hover{background:#9A3412}
@media (min-width:1241px){header nav .top,header nav .dd-btn{font-size:13px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#475569}header nav .top[aria-current],header nav .dd.cur .dd-btn{color:#C2410C;border-bottom-color:#F97316}header nav .top:hover,header nav .dd:hover .dd-btn{color:#C2410C}.dd-menu{border-radius:14px;top:calc(100% + 6px)}.dd-menu::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}.dd-menu .nav-link{font-size:15px;font-weight:600}}
.dd-menu .nav-link[aria-current]{color:#C2410C}
.pt{background:#FFFFFF;border:1px solid #E8EDF3;border-top:3px solid #E2E8F0;border-radius:16px;padding:10px 15px;box-shadow:0 2px 10px rgba(15,23,42,.04);transition:border-color .2s}
.pt:hover{border-top-color:#F97316}
.pt-t{margin:0;font-weight:700;font-size:15px;color:#0F172A;line-height:1.35}
.pt-d{margin:2px 0 0;color:#64748B;font-size:14px;line-height:1.42}
.mo{border-radius:24px!important}
.pt-link{display:block;text-decoration:none}.pt-link .pt-t::after{content:" →";color:#C2410C}.pt-link:hover{border-color:#F97316}
.lk-card{text-decoration:none;color:inherit;transition:border-color .2s}.lk-card:hover{border-color:#F97316!important}
@media (max-width:600px){header>div>div a{font-size:14px!important}header>div>div a[href^="Contact"]{padding:9px 12px!important}h1{font-size:30px!important}main>div{padding-top:20px!important;padding-bottom:24px!important}}
@media (prefers-reduced-motion: reduce){.in-1,.in-2{animation:none}}
.mo{margin:0;background:#0F172A;border-radius:16px;overflow:hidden;box-shadow:0 20px 50px rgba(15,23,42,.25);color:#E2E8F0}
.mo-view{position:relative}
.mo{position:relative}
.mo-tap{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;background:transparent;cursor:pointer;z-index:2}
.mo-tap:focus-visible{outline:3px solid #F97316;outline-offset:-3px}
.mo.is-paused .mo-tap::before{content:"";position:absolute;left:50%;top:38%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(15,23,42,.8);border:2px solid #F97316}
.mo.is-paused .mo-tap::after{content:"";position:absolute;left:50%;top:38%;margin:-12px 0 0 -6px;border-style:solid;border-width:12px 0 12px 20px;border-color:transparent transparent transparent #FFFFFF}
.mo-size{display:block;width:100%;height:auto;visibility:hidden}
.mo-capsize{height:112px}
.mo-sc{position:absolute;inset:0;display:flex;flex-direction:column;opacity:0;animation:mo-sc 30s linear infinite both;animation-delay:var(--o)}
.mo-sc>svg{display:block;width:100%;height:auto;flex:none}
.mo-cap{flex:1;margin:0;padding:10px 18px;background:#0B1220;border-top:1px solid #1E293B;font-size:17px;line-height:1.38;color:#F1F5F9}
.mo-cap span{display:block;font-family:'Sora',sans-serif;font-size:13px;font-weight:600;color:#FB923C;margin-bottom:3px}
.mo.is-paused,.mo.is-paused *{animation-play-state:paused!important}
.s0{--o:0s}.s1{--o:6s}.s2{--o:12s}.s3{--o:18s}.s4{--o:24s}
.t0{--j:.25s}.t1{--j:.65s}.t2{--j:1.05s}.t3{--j:1.45s}.t4{--j:1.85s}.t5{--j:2.25s}.t6{--j:2.65s}.t7{--j:3.05s}.t8{--j:3.45s}.t9{--j:3.85s}.t10{--j:4.25s}.t11{--j:4.65s}
.mo svg *{transform-box:fill-box;transform-origin:center}
.mo .e{animation-duration:30s;animation-iteration-count:infinite;animation-fill-mode:both;animation-timing-function:cubic-bezier(.2,.75,.25,1);animation-delay:calc(var(--o) + var(--j))}
.pop{animation-name:mo-pop}.up{animation-name:mo-up}.dn{animation-name:mo-dn}.lf{animation-name:mo-lf}.rt{animation-name:mo-rt}.fd{animation-name:mo-fd}.draw{animation-name:mo-draw}.grow{animation-name:mo-grow}.growy{animation-name:mo-growy}.unv{animation-name:mo-unv}
.mo svg .grow{transform-origin:left center}.mo svg .growy{transform-origin:center bottom}.mo svg .unv{transform-origin:right center}
.lp-pulse{animation:mo-pulse 1.8s ease-in-out infinite}.lp-blink{animation:mo-blink 1.1s ease-in-out infinite}.lp-ring{animation:mo-ring 1.2s ease-in-out infinite}.lp-flow{stroke-dasharray:7 9;animation:mo-flow .9s linear infinite}.lp-wave{animation:mo-wave 1.8s ease-out infinite}.lp-wave2{animation:mo-wave 1.8s .6s ease-out infinite}.lp-wave3{animation:mo-wave 1.8s 1.2s ease-out infinite}.lp-spin{animation:mo-spin 3s linear infinite}.lp-float{animation:mo-float 2.6s ease-in-out infinite}
.c-or{color:#F97316}.c-gr{color:#22C55E}.c-rd{color:#EF4444}.c-sk{color:#38BDF8}.c-sl{color:#64748B}.c-dk{color:#334155}.c-wh{color:#F1F5F9}
@keyframes mo-sc{0%{opacity:0}1.2%{opacity:1}20%{opacity:1}21.2%{opacity:0}100%{opacity:0}}
@keyframes mo-pop{0%{opacity:0;transform:scale(.3)}1.6%{opacity:1;transform:scale(1.08)}2.4%,100%{opacity:1;transform:scale(1)}}
@keyframes mo-up{0%{opacity:0;transform:translateY(26px)}2.2%,100%{opacity:1;transform:translateY(0)}}
@keyframes mo-dn{0%{opacity:0;transform:translateY(-26px)}2.2%,100%{opacity:1;transform:translateY(0)}}
@keyframes mo-lf{0%{opacity:0;transform:translateX(-46px)}2.2%,100%{opacity:1;transform:translateX(0)}}
@keyframes mo-rt{0%{opacity:0;transform:translateX(46px)}2.2%,100%{opacity:1;transform:translateX(0)}}
@keyframes mo-fd{0%{opacity:0}2%,100%{opacity:1}}
@keyframes mo-draw{0%{stroke-dashoffset:1}4%,100%{stroke-dashoffset:0}}
@keyframes mo-grow{0%{transform:scaleX(0)}4%,100%{transform:scaleX(1)}}
@keyframes mo-growy{0%{transform:scaleY(0)}3%,100%{transform:scaleY(1)}}
@keyframes mo-unv{0%{transform:scaleX(1)}6%,100%{transform:scaleX(0)}}
@keyframes mo-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}
@keyframes mo-blink{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes mo-ring{0%,60%,100%{transform:rotate(0deg)}10%{transform:rotate(-14deg)}20%{transform:rotate(12deg)}30%{transform:rotate(-9deg)}40%{transform:rotate(6deg)}}
@keyframes mo-flow{to{stroke-dashoffset:-16}}
@keyframes mo-wave{0%{opacity:.9;transform:scale(.5)}100%{opacity:0;transform:scale(1.7)}}
@keyframes mo-spin{to{transform:rotate(360deg)}}
@keyframes mo-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@media (max-width:600px){.mo-cap{font-size:15px;padding:8px 12px}.mo-capsize{height:130px}}
@media (prefers-reduced-motion: reduce){.mo .e{animation-name:mo-fd!important}.mo .lp-pulse,.mo .lp-blink,.mo .lp-ring,.mo .lp-flow,.mo .lp-wave,.mo .lp-wave2,.mo .lp-wave3,.mo .lp-spin,.mo .lp-float{animation:none!important}}
.go-w{animation-name:mo-go-w}
@keyframes mo-go-w{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%{opacity:1;transform:translate(-330px,6px)}5.8%,100%{opacity:0;transform:translate(-330px,6px)}}
.mo{position:relative;margin:0;background:#0F172A;border-radius:16px;overflow:hidden;box-shadow:0 20px 50px rgba(15,23,42,.25);color:#E2E8F0}
.go-bx{animation-name:mo-go-bx}
@keyframes mo-go-bx{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%{opacity:1;transform:translate(-210px,-10px)}5.8%,100%{opacity:0;transform:translate(-210px,-10px)}}
.go-sp{animation-name:mo-go-sp}.go-tr{animation-name:mo-go-tr}.go-bk{animation-name:mo-go-bk}
@keyframes mo-go-sp{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%{opacity:1;transform:translate(0,170px)}5.8%,100%{opacity:0;transform:translate(0,170px)}}
@keyframes mo-go-tr{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%{opacity:1;transform:translate(190px,42px)}5.8%,100%{opacity:0;transform:translate(190px,42px)}}
@keyframes mo-go-bk{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%{opacity:1;transform:translate(240px,6px)}5.8%,100%{opacity:0;transform:translate(240px,6px)}}
.in-3{animation:astec-in .8s .3s cubic-bezier(.2,.7,.2,1) both}
@media (prefers-reduced-motion: reduce){.in-1,.in-2,.in-3{animation:none}}
.go-c{animation-name:mo-go-c}.go-t1{animation-name:mo-go-t1}.go-t2{animation-name:mo-go-t2}
@keyframes mo-go-c{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%{opacity:1;transform:translate(-100px,-75px)}5.8%,100%{opacity:0;transform:translate(-100px,-75px)}}
@keyframes mo-go-t1{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%{opacity:1;transform:translate(184px,0)}5.8%,100%{opacity:0;transform:translate(184px,0)}}
@keyframes mo-go-t2{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%{opacity:1;transform:translate(-186px,0)}5.8%,100%{opacity:0;transform:translate(-186px,0)}}
.m36 .mo-sc{animation:mo-sc6 36s linear infinite both;animation-delay:var(--o)}
.m36 .e{animation-duration:36s}
.s5{--o:30s}
@keyframes mo-sc6{0%{opacity:0}1%{opacity:1}16.67%{opacity:1}17.67%{opacity:0}100%{opacity:0}}
.go-i1{animation-name:mo-go-i1}
@keyframes mo-go-i1{0%{opacity:0;transform:translate(0,0) scale(1)}.8%{opacity:1;transform:translate(0,0) scale(1)}5%{opacity:1;transform:translate(355px,65px) scale(.35)}5.8%,100%{opacity:0;transform:translate(355px,65px) scale(.35)}}
.go-i2{animation-name:mo-go-i2}
@keyframes mo-go-i2{0%{opacity:0;transform:translate(0,0) scale(1)}.8%{opacity:1;transform:translate(0,0) scale(1)}5%{opacity:1;transform:translate(355px,15px) scale(.35)}5.8%,100%{opacity:0;transform:translate(355px,15px) scale(.35)}}
.go-i3{animation-name:mo-go-i3}
@keyframes mo-go-i3{0%{opacity:0;transform:translate(0,0) scale(1)}.8%{opacity:1;transform:translate(0,0) scale(1)}5%{opacity:1;transform:translate(355px,-35px) scale(.35)}5.8%,100%{opacity:0;transform:translate(355px,-35px) scale(.35)}}
.go-i4{animation-name:mo-go-i4}
@keyframes mo-go-i4{0%{opacity:0;transform:translate(0,0) scale(1)}.8%{opacity:1;transform:translate(0,0) scale(1)}5%{opacity:1;transform:translate(355px,-85px) scale(.35)}5.8%,100%{opacity:0;transform:translate(355px,-85px) scale(.35)}}
.gs-sim{animation-name:mo-gs-sim}.gs-num{animation-name:mo-gs-num}.go-d1{animation-name:mo-go-d1}.go-d2{animation-name:mo-go-d2}.go-d3{animation-name:mo-go-d3}.go-d4{animation-name:mo-go-d4}
@keyframes mo-gs-sim{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%,100%{opacity:1;transform:translate(105px,-150px)}}
@keyframes mo-gs-num{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%,100%{opacity:1;transform:translate(340px,0)}}
@keyframes mo-go-d1{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%{opacity:1;transform:translate(238px,82px)}5.8%,100%{opacity:0;transform:translate(238px,82px)}}
@keyframes mo-go-d2{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%{opacity:1;transform:translate(238px,-97px)}5.8%,100%{opacity:0;transform:translate(238px,-97px)}}
@keyframes mo-go-d3{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%{opacity:1;transform:translate(-238px,82px)}5.8%,100%{opacity:0;transform:translate(-238px,82px)}}
@keyframes mo-go-d4{0%{opacity:0;transform:translate(0,0)}.8%{opacity:1;transform:translate(0,0)}5%{opacity:1;transform:translate(-238px,-97px)}5.8%,100%{opacity:0;transform:translate(-238px,-97px)}}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #F97316;outline-offset:2px}

/* --- Navigation sans rechargement --- */
header.site-header{view-transition-name:site-header}
#app{view-transition-name:app}
#app.is-leaving{opacity:0;transform:translateY(6px);transition:opacity .16s ease,transform .16s ease}
#app.is-entering{animation:app-in .32s cubic-bezier(.2,.7,.2,1) both}
@keyframes app-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
::view-transition-old(app){animation:vt-out .16s ease both}
::view-transition-new(app){animation:vt-in .3s cubic-bezier(.2,.7,.2,1) both}
@keyframes vt-out{to{opacity:0;transform:translateY(6px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(10px)}}
.nprogress{position:fixed;left:0;top:0;height:3px;width:0;background:#F97316;z-index:200;transition:width .25s ease,opacity .2s ease;opacity:0}
.nprogress.on{opacity:1;width:70%}
.nprogress.done{opacity:0;width:100%}
@media (prefers-reduced-motion: reduce){#app.is-leaving,#app.is-entering{transition:none;animation:none}::view-transition-old(app),::view-transition-new(app){animation:none}}

/* --- Menus déroulants : ouverture pilotée par script, un seul à la fois --- */
.dd-btn[aria-expanded="true"]{color:#C2410C}
.dd-btn[aria-expanded="true"]::after{transform:translateY(1px) rotate(225deg)}
.dd-menu .nav-link:focus-visible{outline-offset:-2px}

/* --- Formulaire de contact --- */
#contact-form input:focus-visible,#contact-form textarea:focus-visible,#contact-form select:focus-visible{outline:3px solid #F97316;outline-offset:1px}
.form-status:empty{display:none}
.form-status.ok,.form-status.err,.form-status.wait,.form-status>span{display:block;padding:12px 14px;border-radius:10px;font-weight:600;font-size:15px}
.form-status.ok,.form-status>.ok{background:#DCFCE7;color:#14532D;border:1px solid #86EFAC}
.form-status.err,.form-status>.err{background:#FEE2E2;color:#7F1D1D;border:1px solid #FCA5A5}
.form-status.wait{background:#F1F5F9;color:#334155;border:1px solid #CBD5E1}
#contact-form button[disabled]{opacity:.6;cursor:wait}

/* --- Mentions légales --- */
.legal h2{font-size:20px;margin:28px 0 8px}
.legal p{margin:0 0 8px;color:#334155}
.optout{font:inherit;font-weight:700;color:#C2410C;background:#FFF7ED;border:1px solid #FDBA74;border-radius:999px;padding:4px 14px;cursor:pointer}
.optout:hover{border-color:#C2410C}.optout:focus-visible{outline:3px solid #F97316;outline-offset:2px}
.optout-state{display:block;font-size:14px;color:#64748B;margin-top:4px}

/* --- Vidéos : bouton pause visible, pause hors écran --- */
.mo-pp{position:absolute;right:12px;top:12px;z-index:3;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(15,23,42,.72);color:#FFFFFF;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;opacity:.75;transition:opacity .2s,border-color .2s}
.mo-pp svg{width:14px;height:14px;fill:currentColor}
.mo-pp .i-play{display:none}
.mo.is-paused .mo-pp .i-play{display:block}.mo.is-paused .mo-pp .i-pause{display:none}
.mo:hover .mo-pp,.mo-pp:focus-visible{opacity:1;border-color:#F97316}
.mo-pp:focus-visible{outline:3px solid #F97316;outline-offset:2px}
.mo.is-offscreen,.mo.is-offscreen *{animation-play-state:paused!important}

/* --- Références clients --- */
.refs{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.ref{display:flex;flex-direction:column;gap:8px;background:#FFFFFF;border:1px solid #E8EDF3;border-radius:16px;padding:8px;box-shadow:0 2px 10px rgba(15,23,42,.04);min-width:0;transition:border-color .2s,box-shadow .2s}
.ref:hover{border-color:#FDBA74;box-shadow:0 8px 22px rgba(15,23,42,.08)}
.ref-logo{height:80px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#FFFFFF;padding:5px 6px;box-sizing:border-box;overflow:hidden}
.ref-logo.dark{background:#0F172A}
.ref-logo img{display:block;width:100%;height:100%;object-fit:contain}
.ref-mono{background:var(--h,#334155);color:#FFFFFF;font-family:'Sora',sans-serif;font-weight:700;font-size:26px;letter-spacing:.04em}
.ref-txt{display:flex;flex-direction:column;min-width:0;padding:0 6px 4px}
.ref-txt strong{font-size:14px;line-height:1.3;color:#0F172A;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ref-txt small{font-size:12.5px;color:#64748B;margin-top:2px}
@media (max-width:1180px){.refs{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:1180px) and (min-width:761px){.ref-logo{height:84px}}
@media (max-width:760px){.refs{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.ref-logo{height:72px}}