/* =====================================================================
   M2 Secrétariat — v7 : corrections et finitions (version clair / sombre)
   ===================================================================== */

/* ---- Titres « écho » : plus nets et plus rapides (fini le flou qui traîne) ---- */
@keyframes v7-echo{ 0%{ opacity:0; filter:blur(8px); transform:translate3d(-.18em,.12em,0); } 60%{ opacity:1; filter:blur(.5px); } 100%{ opacity:1; filter:none; transform:none; } }
.echo.echo-go .w{ animation:v7-echo .75s cubic-bezier(.2,.8,.2,1) both !important; animation-delay:calc(.05s + var(--i) * 38ms) !important; }
.echo.echo-done .w{ animation:none !important; opacity:1 !important; filter:none !important; transform:none !important; text-shadow:none !important; }

/* ---- Zoom de la promesse : une vraie carte photo dès le départ, puis plein écran ---- */
.zoom-sec{ height:185vh !important; }
.zoom-box{ overflow:hidden; isolation:isolate; display:flex; align-items:center; justify-content:center; box-shadow:0 60px 120px -40px rgba(63,194,166,.45); }
.zoom-photo{ position:absolute; inset:0; z-index:-1; transform:scale(calc(1 / var(--zsx, 1)), calc(1 / var(--zsy, 1))); }
.zoom-photo img{ width:100%; height:100%; object-fit:cover; object-position:50% 30%; transform:scale(calc(1.18 - var(--zt, 0) * .18)); }
.zoom-photo::after{ content:""; position:absolute; inset:0; background:radial-gradient(120% 120% at 30% 20%, rgba(185,237,224,.9) 0%, rgba(63,194,166,.88) 45%, rgba(42,158,138,.92) 100%); opacity:calc(.15 + var(--zt, 0) * .8); }
.zoom-icon{ z-index:1; background:rgba(3,17,14,.35); backdrop-filter:blur(6px); }
.zoom-icon svg{ stroke:#fff !important; }
.zoom-text{ position:relative; z-index:1; }
@media (max-width:900px){ .zoom-sec{ height:auto !important; } .zoom-photo{ transform:none; } .zoom-photo::after{ opacity:.9; } }

/* ---- En-tête : accès clients regroupés dans un menu ---- */
.acc-menu{ position:relative; }
.acc-btn{ display:inline-flex !important; align-items:center; gap:8px; }
.acc-btn svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; }
.acc-btn::after{ content:""; width:7px; height:7px; border-right:1.6px solid currentColor; border-bottom:1.6px solid currentColor; transform:translateY(-2px) rotate(45deg); transition:transform .3s; margin-left:2px; }
.acc-menu.open .acc-btn::after{ transform:translateY(2px) rotate(225deg); }
.acc-pop{ position:absolute; right:0; top:calc(100% + 10px); min-width:250px; padding:8px; border-radius:16px; background:rgba(11,30,26,.97); border:1px solid rgba(255,255,255,.1); box-shadow:0 30px 60px -20px rgba(0,0,0,.7); opacity:0; visibility:hidden; transform:translateY(-6px); transition:.25s cubic-bezier(.2,.8,.2,1); z-index:80; }
.acc-menu.open .acc-pop, .acc-menu:focus-within .acc-pop{ opacity:1; visibility:visible; transform:none; }
.acc-pop a{ display:block; padding:11px 14px; border-radius:10px; text-decoration:none; color:#EAF2EF; }
.acc-pop a:hover, .acc-pop a:focus-visible{ background:rgba(63,194,166,.12); outline:none; }
.acc-pop b{ display:block; font-weight:600; font-size:14.5px; } .acc-pop small{ display:block; font-size:12.5px; opacity:.6; margin-top:2px; }
.nav-links .m-only{ display:none; }
@media (max-width:1100px){ .acc-btn span{ display:none; } .acc-btn::after{ display:none; } }
@media (max-width:900px){ .acc-menu{ display:none; } nav.menu-open .nav-links .m-only{ display:block; } }

/* ---- Événements passés : grisés automatiquement ---- */
.event-card.past{ opacity:.45; } .event-card.past .event-date-inline::after{ content:" · passé"; font-size:.75em; opacity:.7; }
html[lang="en"] .event-card.past .event-date-inline::after{ content:" · past"; }

/* ---- petites finitions ---- */
img{ max-width:100%; }
:focus-visible{ outline:2px solid #3FC2A6; outline-offset:3px; }
::selection{ background:#3FC2A6; color:#03110E; }
@media (prefers-reduced-motion: reduce){ .echo .w{ animation:none !important; opacity:1 !important; filter:none !important; } }

/* ---- Pages intérieures : bandeau sombre cohérent avec l'accueil ---- */
html body section.v7-hero.v7-hero{ position:relative; overflow:hidden; background:radial-gradient(80% 120% at 85% 0%, rgba(63,194,166,.22), transparent 60%), radial-gradient(60% 90% at 0% 100%, rgba(63,194,166,.12), transparent 60%), #0B1E1A !important; color:#EAF2EF; padding:clamp(56px, 8vw, 110px) 0 clamp(52px, 7vw, 96px) !important; text-align:left !important; border-bottom:1px solid rgba(255,255,255,.06); }
.v7-hero::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size:56px 56px; mask-image:radial-gradient(70% 80% at 70% 30%, #000, transparent); pointer-events:none; }
.v7-hero::after{ content:""; position:absolute; left:-10%; right:-10%; bottom:-2px; height:120px; background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'><path d='M0 70 C 150 70 180 20 260 60 S 380 110 470 60 S 560 0 640 62 S 760 100 850 64 S 980 30 1060 66 S 1160 70 1200 70' fill='none' stroke='%233FC2A6' stroke-opacity='.5' stroke-width='2'/><path d='M0 80 C 160 80 200 40 290 72 S 420 110 500 74 S 610 30 690 76 S 800 104 900 78 S 1010 50 1090 78 S 1170 80 1200 80' fill='none' stroke='%233FC2A6' stroke-opacity='.18' stroke-width='6'/></svg>") center/100% 100% no-repeat; animation:v7-wave 9s ease-in-out infinite alternate; pointer-events:none; opacity:.8; }
@keyframes v7-wave{ from{ transform:translateX(-3%); } to{ transform:translateX(3%); } }
.v7-hero .wrap{ position:relative; z-index:1; max-width:1180px; }
.v7-hero h1{ color:#fff !important; font-size:clamp(40px, 5.6vw, 78px) !important; line-height:1.02 !important; letter-spacing:-.04em !important; max-width:16ch; margin:14px 0 18px !important; text-align:left !important; }
.v7-hero p:not(.v7-crumbs){ color:rgba(234,242,239,.75) !important; font-size:clamp(16px, 1.4vw, 19px) !important; max-width:60ch; margin:0 !important; text-align:left !important; }
.v7-hero .eyebrow{ color:#3FC2A6 !important; font-family:var(--mono); text-align:left !important; justify-content:flex-start !important; }
.v7-crumbs{ font-family:var(--mono); font-size:12.5px !important; color:rgba(234,242,239,.55) !important; margin:0 0 26px !important; } .v7-crumbs a{ color:#3FC2A6; text-decoration:none; } .v7-crumbs a:hover{ text-decoration:underline; }
main{ padding-top:clamp(40px, 5vw, 70px); }
/* le tiroir d'événements du blog ne s'affiche plus sous le pied de page */
.events-drawer:not(.active){ visibility:hidden; }
.v7-hero-photo{ position:absolute; z-index:1; right:max(32px, calc(50vw - 560px)); top:50%; width:min(34vw, 430px); aspect-ratio:4/3; margin:0; transform:translateY(-50%) rotate(2deg); border-radius:22px; overflow:hidden; border:1px solid rgba(255,255,255,.12); box-shadow:0 40px 80px -30px rgba(0,0,0,.8), 0 0 0 8px rgba(63,194,166,.06); animation:v7-float 7s ease-in-out infinite; }
.v7-hero-photo img{ width:100%; height:100%; object-fit:cover; filter:saturate(.9) contrast(1.02); }
.v7-hero-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(160deg, rgba(63,194,166,.18), transparent 50%, rgba(11,30,26,.35)); }
@keyframes v7-float{ 50%{ transform:translateY(calc(-50% - 10px)) rotate(1deg); } }
@media (max-width:1000px){ .v7-hero-photo{ display:none; } }
.v7-main .services-grid{ grid-template-columns:repeat(3, 1fr) !important; } @media (max-width:820px){ .v7-main .services-grid{ grid-template-columns:1fr 1fr !important; } } @media (max-width:520px){ .v7-main .services-grid{ grid-template-columns:1fr !important; } }
.acc-pop b, .acc-pop small{ font-family:var(--sans); }
/* menu mobile des pages intérieures (même rendu que l'accueil) */
.v7-burger{ display:none; width:42px; height:42px; border-radius:50%; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.04); cursor:pointer; place-items:center; }
.v7-burger svg{ width:20px; height:20px; fill:none; stroke:#EAF2EF; stroke-width:1.8; }
@media (max-width:900px){
  .v7-burger{ display:grid; }
  nav .nav-links{ display:none; }
  nav.menu-open .nav-links{ display:flex !important; position:absolute; top:100%; left:0; right:0; flex-direction:column; gap:0; padding:10px 24px 20px; background:rgba(11,30,26,.97); border-bottom:1px solid rgba(255,255,255,.08); }
  nav.menu-open .nav-links a{ padding:13px 4px; font-size:16px; color:#EAF2EF; border-bottom:1px solid rgba(255,255,255,.08); }
  nav.menu-open .nav-links .m-only{ display:block; }
  nav .nav-cta .btn-primary{ padding:9px 14px; font-size:13px; }
  nav .phone-pill{ display:none; }
}
@media (max-width:600px){ nav .nav-cta .btn-primary{ display:none; } nav .nav-cta{ gap:8px; } nav .logo-mark{ height:28px; } }

/* =====================================================================
   v7.1 — montée en gamme visuelle
   ===================================================================== */

/* ---- Héros : la carte de routage devient lisible (plus grande, texte plus gros) ---- */
@media (min-width:1101px){
  .hero-v .hero-grid{ grid-template-columns:1fr 1fr !important; gap:56px !important; }
  .flow-card{ padding:24px 26px !important; }
  .flow-map{ zoom:1.14; }
  .flow-head strong{ font-size:15.5px; }
  .flow-log div{ font-size:12.5px !important; grid-template-columns:52px 1fr auto !important; }
}

/* ---- Zoom : plus d'écran noir vide avant la promesse ---- */
@media (min-width:901px){
  .zoom-sec{ margin-top:-26vh; }
  .zoom-sticky{ pointer-events:none; }
  .zoom-box{ pointer-events:auto; }
}

/* ---- Parcours : le téléphone sonne vraiment à l'étape 1 ---- */
.story-stage .phone-body{ position:relative; }
.ring-viz{ position:absolute; left:0; right:0; top:8%; display:flex; flex-direction:column; align-items:center; text-align:center; gap:4px; opacity:0; transform:translateY(-10px) scale(.97); transition:opacity .45s ease, transform .55s cubic-bezier(.2,.8,.2,1); pointer-events:none; }
.story-stage[data-step="1"] .ring-viz{ opacity:1; transform:none; }
.rv-rings{ position:relative; width:118px; height:118px; display:grid; place-items:center; margin-bottom:14px; }
.rv-rings i{ position:absolute; inset:0; border-radius:50%; border:1.5px solid rgba(63,194,166,.55); animation:rv-ring 2.4s cubic-bezier(.2,.6,.3,1) infinite; }
.rv-rings i:nth-child(2){ animation-delay:.8s; } .rv-rings i:nth-child(3){ animation-delay:1.6s; }
@keyframes rv-ring{ from{ transform:scale(.55); opacity:1; } to{ transform:scale(1.35); opacity:0; } }
.rv-ico{ width:64px; height:64px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(135deg,#8EE3CF,#2A9E8A); box-shadow:0 0 40px -6px rgba(63,194,166,.8); animation:rv-shake 1.2s ease-in-out infinite; }
.rv-ico svg{ width:28px; height:28px; fill:none; stroke:#03110E; stroke-width:1.9; }
@keyframes rv-shake{ 0%,55%,100%{ transform:rotate(0); } 60%{ transform:rotate(-12deg); } 68%{ transform:rotate(11deg); } 76%{ transform:rotate(-8deg); } 84%{ transform:rotate(5deg); } }
.ring-viz b{ font-family:var(--sans); font-size:20px; font-weight:600; color:#EAF2EF; letter-spacing:-.01em; }
.ring-viz small{ font-family:var(--mono); font-size:12px; color:rgba(234,242,239,.55); }
.rv-acts{ display:flex; gap:56px; margin-top:22px; }
.rv-acts span{ width:52px; height:52px; border-radius:50%; display:grid; place-items:center; }
.rv-acts svg{ width:22px; height:22px; fill:none; stroke:#fff; stroke-width:2; }
.rv-no{ background:rgba(229,87,87,.85); } .rv-yes{ background:#2FB58F; box-shadow:0 0 0 0 rgba(47,181,143,.6); animation:rv-pulse 1.6s ease-out infinite; }
@keyframes rv-pulse{ to{ box-shadow:0 0 0 16px rgba(47,181,143,0); } }
@media (max-width:900px){ .rv-rings{ width:92px; height:92px; } .rv-ico{ width:52px; height:52px; } .rv-acts{ margin-top:14px; } }

/* ---- Agence : cartes avec pictos et survol ---- */
.ag-card{ position:relative; border:1px solid rgba(16,40,36,.08); transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s, border-color .35s; }
.ag-card:hover{ transform:translateY(-4px); box-shadow:0 24px 44px -26px rgba(16,60,52,.45); border-color:rgba(63,194,166,.45); }
.ag-ico{ width:42px; height:42px; border-radius:12px; display:grid; place-items:center; margin-bottom:16px; background:rgba(63,194,166,.12); color:#1E8C77; }
.ag-ico svg{ width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linejoin:round; stroke-linecap:round; }
html[data-theme="dark"] .ag-card{ border-color:rgba(255,255,255,.08); }

/* ---- Appel à l'action final, avant le pied de page ---- */
.final-cta{ position:relative; overflow:hidden; padding:clamp(80px,10vw,140px) 0 !important; background:radial-gradient(70% 90% at 90% 10%, rgba(63,194,166,.25), transparent 60%), radial-gradient(60% 80% at 0% 100%, rgba(48,127,128,.25), transparent 60%), #0B1E1A !important; color:#EAF2EF; border-top:1px solid rgba(255,255,255,.06); }
.fc-waves{ position:absolute; inset:auto -10% 8% -10%; height:220px; opacity:.85; pointer-events:none; background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 220' preserveAspectRatio='none'><path d='M0 120 C 120 120 160 40 240 110 S 360 200 450 110 S 540 20 620 112 S 760 190 850 116 S 980 50 1060 118 S 1160 120 1200 120' fill='none' stroke='%233FC2A6' stroke-opacity='.55' stroke-width='2'/><path d='M0 140 C 140 140 210 70 300 130 S 430 200 510 134 S 620 60 700 136 S 820 190 920 138 S 1030 90 1100 138 S 1180 140 1200 140' fill='none' stroke='%233FC2A6' stroke-opacity='.16' stroke-width='10'/><path d='M0 100 C 160 100 220 60 320 96 S 470 140 560 98 S 700 50 790 100 S 930 140 1020 100 S 1150 90 1200 100' fill='none' stroke='%238EE3CF' stroke-opacity='.25' stroke-width='1'/></svg>") center/100% 100% no-repeat; animation:v7-wave 10s ease-in-out infinite alternate; mask-image:linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent); }
.fc-inner{ position:relative; z-index:1; display:grid; grid-template-columns:1.25fr .75fr; gap:64px; align-items:center; }
.fc-live{ display:inline-flex; align-items:center; gap:10px; padding:7px 14px; border-radius:30px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.04); font-family:var(--mono); font-size:12.5px; color:rgba(234,242,239,.8); }
.fc-live i{ width:8px; height:8px; border-radius:50%; background:#3FC2A6; box-shadow:0 0 0 0 rgba(63,194,166,.7); animation:rv-pulse 1.8s ease-out infinite; }
.fc-live.off i{ background:#E0A458; animation:none; }
.final-cta h2{ color:#fff !important; font-size:clamp(40px,5.4vw,76px) !important; line-height:1.02 !important; letter-spacing:-.045em !important; margin:22px 0 20px !important; max-width:15ch; }
.final-cta h2 em{ font-family:var(--serif, 'Source Serif 4', serif); font-weight:400; font-style:italic; letter-spacing:-.02em; color:#8EE3CF !important; -webkit-text-fill-color:#8EE3CF; }
.final-cta p{ color:rgba(234,242,239,.72) !important; font-size:clamp(16px,1.35vw,19px); max-width:52ch; margin:0 0 34px !important; }
.fc-ctas{ display:flex; flex-wrap:wrap; align-items:center; gap:18px 28px; }
.fc-phone{ display:inline-flex; align-items:center; gap:14px; color:#fff !important; text-decoration:none; }
.fc-phone-ico{ width:50px; height:50px; border-radius:50%; display:grid; place-items:center; border:1px solid rgba(63,194,166,.5); background:rgba(63,194,166,.08); transition:background .3s, transform .3s; }
.fc-phone:hover .fc-phone-ico{ background:rgba(63,194,166,.25); transform:rotate(-12deg); }
.fc-phone-ico svg{ width:22px; height:22px; fill:none; stroke:#3FC2A6; stroke-width:1.8; }
.fc-phone small{ display:block; font-family:var(--mono); font-size:11.5px; color:rgba(234,242,239,.55); }
.fc-phone b{ display:block; font-family:var(--sans); font-size:24px; font-weight:600; letter-spacing:.01em; }
.fc-proof{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.fc-proof li{ padding:22px 20px; border-radius:18px; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.08); backdrop-filter:blur(6px); transition:border-color .3s, transform .3s; }
.fc-proof li:hover{ border-color:rgba(63,194,166,.45); transform:translateY(-3px); }
.fc-proof b{ display:block; font-family:var(--sans); font-size:34px; font-weight:600; letter-spacing:-.03em; color:#8EE3CF; line-height:1; margin-bottom:8px; }
.fc-proof span{ font-size:13.5px; color:rgba(234,242,239,.65); line-height:1.4; display:block; }
@media (max-width:900px){ .fc-inner{ grid-template-columns:1fr; gap:40px; } .fc-waves{ height:140px; bottom:2%; } }
@media (max-width:420px){ .fc-proof li{ padding:16px 14px; } .fc-proof b{ font-size:28px; } .fc-phone b{ font-size:21px; } }

/* ---- Pied de page : grande signature en filigrane ---- */
footer{ position:relative; overflow:hidden; }
.foot-word{ font-family:var(--sans); font-weight:700; font-size:clamp(44px,10.6vw,168px); line-height:.8; letter-spacing:-.055em; white-space:nowrap; text-align:center; margin:44px 0 -.14em; color:transparent; -webkit-text-stroke:1px rgba(63,194,166,.28); background:linear-gradient(180deg, rgba(63,194,166,.16), transparent 75%); -webkit-background-clip:text; background-clip:text; user-select:none; pointer-events:none; }
.foot-word span{ color:rgba(63,194,166,.2); -webkit-text-stroke:0; }
@media (prefers-reduced-motion: reduce){ .rv-rings i, .rv-ico, .rv-yes, .fc-waves, .fc-live i{ animation:none !important; } }

/* =====================================================================
   v7.2 — palette « Forêt profonde » : transitions douces sombre / clair
   ===================================================================== */
html:root body > section#services.lt, html:root body > section.testi-sec.lt{ position:relative; z-index:2; border-radius:44px 44px 0 0; margin-top:-44px; box-shadow:0 -1px 0 rgba(63,194,166,.45), 0 -40px 90px -30px rgba(63,194,166,.35); }
html:root body > section.engage-sec, html:root body > section.final-cta{ position:relative; z-index:2; border-radius:44px 44px 0 0; margin-top:-44px; background-color:#0B1E1A !important; box-shadow:0 -1px 0 rgba(63,194,166,.35); }
html:root body.lt-page main.v7-main{ position:relative; z-index:2; border-radius:44px 44px 0 0; margin-top:-44px; background:#EEF5F1; box-shadow:0 -1px 0 rgba(63,194,166,.45), 0 -40px 90px -30px rgba(63,194,166,.35); }
@media (max-width:700px){
  html:root body > section#services.lt, html:root body > section.testi-sec.lt, html:root body > section.engage-sec, html:root body > section.final-cta, html:root body.lt-page main.v7-main{ border-radius:28px 28px 0 0; margin-top:-28px; }
}

/* ---- v7.3 — promesse : bandeau compact (plus de photo ni de long défilement) ---- */
.promise-sec{ position:relative; z-index:1; padding:30px 0 110px !important; }
.promise-card{ position:relative; overflow:hidden; isolation:isolate; text-align:center; padding:clamp(56px,7vw,96px) clamp(24px,5vw,72px); border-radius:32px; color:#03110E;
  background:radial-gradient(90% 140% at 15% 0%, #C9F2E7 0%, #6FD8C0 38%, #2FAE93 78%, #238C77 100%);
  box-shadow:0 50px 100px -50px rgba(63,194,166,.65), inset 0 1px 0 rgba(255,255,255,.5); }
.promise-card::before{ content:""; position:absolute; inset:0; z-index:-1; background-image:radial-gradient(rgba(3,17,14,.13) 1px, transparent 1.2px); background-size:18px 18px; mask-image:radial-gradient(70% 80% at 50% 40%, transparent 30%, #000); }
.pc-waves{ position:absolute; z-index:-1; left:-10%; right:-10%; bottom:-10px; height:150px; opacity:.55; background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 150' preserveAspectRatio='none'><path d='M0 90 C 140 90 180 30 270 80 S 400 140 490 82 S 590 20 680 84 S 800 130 900 86 S 1030 40 1110 88 S 1180 90 1200 90' fill='none' stroke='%2303110E' stroke-opacity='.35' stroke-width='1.6'/><path d='M0 104 C 160 104 220 60 310 98 S 450 140 540 100 S 660 50 750 102 S 880 136 970 104 S 1100 74 1200 104' fill='none' stroke='%23ffffff' stroke-opacity='.45' stroke-width='5'/></svg>") center/100% 100% no-repeat; animation:v7-wave 9s ease-in-out infinite alternate; }
.pc-k{ display:inline-block; font-family:var(--mono); font-size:13px; letter-spacing:.04em; padding:6px 14px; border-radius:30px; background:rgba(3,17,14,.08); border:1px solid rgba(3,17,14,.14); margin-bottom:24px; }
.promise-card h2{ font-family:var(--sans); color:#03110E !important; font-size:clamp(32px,5vw,72px) !important; line-height:1.03 !important; letter-spacing:-.04em !important; font-weight:700; max-width:17ch; margin:0 auto !important; }
.promise-card h2 em{ font-family:var(--serif); font-style:italic; font-weight:400; letter-spacing:-.01em; color:#0B4A3F; }
.pc-btn{ margin-top:34px; background:#03110E !important; color:#8EE3CF !important; border-radius:40px; box-shadow:0 14px 30px -12px rgba(3,17,14,.6) !important; }
.pc-btn:hover{ background:#0F2A24 !important; }
@media (max-width:600px){ .promise-sec{ padding:16px 0 80px !important; } .promise-card{ border-radius:24px; } }
.promise-sec::before, .promise-sec::after{ display:none !important; content:none !important; }

/* ---- v7.4 — secteurs : sélecteur interactif (liste + grande scène) ---- */
.sp{ display:grid; grid-template-columns:minmax(300px,.82fr) 1.18fr; gap:36px; align-items:stretch; margin-top:12px; }
.sp-list{ display:flex; flex-direction:column; gap:8px; }
.sp-item{ position:relative; overflow:hidden; display:grid; grid-template-columns:44px 1fr 36px; align-items:center; gap:12px; text-align:left; width:100%; padding:20px 20px 20px 18px; border-radius:18px; border:1px solid transparent; background:transparent; cursor:pointer; color:var(--ink); font:inherit; transition:background .35s, border-color .35s, box-shadow .35s, transform .35s cubic-bezier(.2,.8,.2,1); }
.sp-item:hover{ background:rgba(255,255,255,.55); }
.sp-item.is-on{ background:#fff; border-color:rgba(11,115,99,.18); box-shadow:0 22px 44px -28px rgba(11,60,52,.45); transform:translateX(6px); }
.sp-num{ font-family:var(--mono); font-size:12.5px; color:var(--muted); letter-spacing:.04em; transition:color .3s; }
.sp-item.is-on .sp-num{ color:#0B7363; }
.sp-txt b{ display:block; font-family:var(--sans); font-weight:600; font-size:clamp(17px,1.45vw,21px); letter-spacing:-.02em; line-height:1.2; }
.sp-txt small{ display:block; margin-top:3px; font-family:var(--mono); font-size:12px; color:var(--muted); }
.sp-go{ width:36px; height:36px; border-radius:50%; display:grid; place-items:center; background:rgba(11,115,99,.08); opacity:.0; transform:translateX(-8px); transition:.35s cubic-bezier(.2,.8,.2,1); }
.sp-go svg{ width:16px; height:16px; fill:none; stroke:#0B7363; stroke-width:2; }
.sp-item:hover .sp-go{ opacity:.6; transform:none; }
.sp-item.is-on .sp-go{ opacity:1; transform:none; background:#0B7363; } .sp-item.is-on .sp-go svg{ stroke:#fff; }
.sp-bar{ position:absolute; left:18px; right:18px; bottom:0; height:2px; border-radius:2px; background:rgba(11,115,99,.12); overflow:hidden; opacity:0; }
.sp-bar::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg,#3FC2A6,#0B7363); transform:scaleX(0); transform-origin:left; }
.sp.auto .sp-item.is-on .sp-bar{ opacity:1; }
.sp.auto .sp-item.is-on .sp-bar::after{ animation:sp-prog var(--sp-dur,7s) linear forwards; }
.sp.paused .sp-item.is-on .sp-bar::after{ animation-play-state:paused; }
@keyframes sp-prog{ to{ transform:scaleX(1); } }

.sp-stage{ position:relative; min-height:600px; border-radius:30px; overflow:hidden; background:#0B1E1A; box-shadow:0 50px 100px -50px rgba(11,40,34,.65); isolation:isolate; }
.sp-panel{ position:absolute; inset:0; display:flex; align-items:flex-end; opacity:0; visibility:hidden; transition:opacity .6s ease, visibility 0s .6s; }
.sp-panel[hidden]{ display:flex; }
.sp-panel.is-on{ opacity:1; visibility:visible; transition:opacity .6s ease; z-index:1; }
.sp-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transform:scale(1.08); transition:transform 7s cubic-bezier(.2,.6,.2,1); filter:saturate(1.02); }
.sp-panel.is-on .sp-img{ transform:scale(1); }
.sp-panel::after{ content:""; position:absolute; inset:0; z-index:0; background:linear-gradient(0deg, rgba(11,30,26,.97) 0%, rgba(11,30,26,.86) 34%, rgba(11,30,26,.25) 66%, rgba(11,30,26,.05) 100%), linear-gradient(90deg, rgba(11,30,26,.45), transparent 60%); }
.sp-body{ position:relative; z-index:1; padding:clamp(26px,3.4vw,44px); color:#EAF2EF; width:100%; }
.sp-body > *{ opacity:0; transform:translateY(14px); transition:opacity .5s, transform .6s cubic-bezier(.2,.8,.2,1); }
.sp-panel.is-on .sp-body > *{ opacity:1; transform:none; }
.sp-panel.is-on .sp-body > :nth-child(2){ transition-delay:.06s; } .sp-panel.is-on .sp-body > :nth-child(3){ transition-delay:.12s; } .sp-panel.is-on .sp-body > :nth-child(4){ transition-delay:.18s; } .sp-panel.is-on .sp-body > :nth-child(5){ transition-delay:.24s; } .sp-panel.is-on .sp-body > :nth-child(6){ transition-delay:.3s; }
.sp-eb{ display:inline-block; font-family:var(--mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:#8EE3CF; padding:5px 12px; border-radius:30px; border:1px solid rgba(142,227,207,.35); background:rgba(11,30,26,.4); backdrop-filter:blur(6px); }
.sp-body h3{ font-family:var(--sans); color:#fff !important; font-size:clamp(26px,2.6vw,38px) !important; line-height:1.08 !important; letter-spacing:-.035em !important; margin:14px 0 10px !important; max-width:20ch; }
.sp-body p{ color:rgba(234,242,239,.78) !important; font-size:16px; line-height:1.55; max-width:52ch; margin:0 0 18px !important; }
.sp-checks{ list-style:none; padding:0; margin:0 0 18px; display:flex; flex-wrap:wrap; gap:8px; }
.sp-checks li{ display:inline-flex; align-items:center; gap:7px; padding:7px 12px; border-radius:30px; font-size:13.5px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); color:#EAF2EF; }
.sp-checks svg{ width:14px; height:14px; fill:none; stroke:#3FC2A6; stroke-width:2.6; }
.sp-call{ position:absolute; top:clamp(20px,3vw,36px); right:clamp(20px,3vw,36px); width:min(320px,46%); display:flex; flex-direction:column; gap:8px; padding:14px; border-radius:18px; background:rgba(11,30,26,.62); border:1px solid rgba(255,255,255,.12); backdrop-filter:blur(12px); box-shadow:0 30px 60px -30px rgba(0,0,0,.6); }
.sp-panel.is-on .sp-call{ opacity:1; transform:none; transition-delay:.35s; }
.sp-line{ font-size:13px; line-height:1.4; padding:9px 12px; border-radius:12px; background:rgba(255,255,255,.07); color:#EAF2EF; }
.sp-line.in{ border-left:2px solid rgba(142,227,207,.7); }
.sp-line.ok{ background:rgba(63,194,166,.2); color:#B9EDE0; font-family:var(--mono); font-size:12px; }
.sp-line.warn{ background:rgba(224,164,88,.18); color:#F3D3A6; font-family:var(--mono); font-size:12px; }
.sp-ctas{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px; }
.sp-ctas .btn{ border-radius:40px; }
.sp-more{ color:#8EE3CF !important; font-family:var(--sans); font-weight:600; font-size:14.5px; text-decoration:none; }
.sp-more:hover{ text-decoration:underline; }
html body > section.lt.secteurs:not(.zz){ padding-bottom:110px !important; }
@media (max-width:1100px){ .sp-call{ display:none; } }
@media (max-width:900px){
  .sp{ grid-template-columns:1fr; gap:16px; }
  .sp-list{ flex-direction:row; overflow-x:auto; scroll-snap-type:x mandatory; gap:8px; margin:0 -20px; padding:4px 20px 8px; scrollbar-width:none; }
  .sp-list::-webkit-scrollbar{ display:none; }
  .sp-item{ flex:0 0 auto; width:auto; grid-template-columns:auto; padding:11px 16px; border-radius:40px; border-color:rgba(11,115,99,.18); background:rgba(255,255,255,.6); scroll-snap-align:start; }
  .sp-item.is-on{ transform:none; background:#0B7363; color:#fff; }
  .sp-num, .sp-go, .sp-txt small{ display:none; }
  .sp-txt b{ font-size:15px; white-space:nowrap; }
  .sp-bar{ left:14px; right:14px; bottom:4px; } .sp.auto .sp-item.is-on .sp-bar{ background:rgba(255,255,255,.25); } .sp-item.is-on .sp-bar::after{ background:#fff; }
  .sp-stage{ min-height:0; border-radius:24px; }
  .sp-panel{ position:relative; display:none; flex-direction:column; align-items:stretch; }
  .sp-panel.is-on{ display:flex; }
  .sp-img{ position:relative; height:230px; }
  .sp-panel::after{ background:linear-gradient(0deg, #0B1E1A 0%, #0B1E1A calc(100% - 230px), rgba(11,30,26,.1) calc(100% - 60px), transparent 100%); }
  .sp-body{ margin-top:-60px; }
}
@media (prefers-reduced-motion: reduce){ .sp-img{ transition:none; transform:none !important; } .sp-bar::after{ animation:none !important; } }
.sp-body{ position:static; } .sp-body > *{ position:relative; z-index:1; }
.sp-body > .sp-call{ position:absolute; z-index:2; }
.sp-list{ justify-content:center; }
.sp-note{ margin:14px 0 0 18px; font-size:14.5px; color:var(--muted); }
.sp-note a{ color:#0B7363; font-weight:600; text-decoration:none; font-family:var(--sans); } .sp-note a:hover{ text-decoration:underline; }
@media (max-width:900px){ .sp-note{ display:none; } .sp-body{ position:relative; } }
@media (max-width:900px){ .sp-panel:not(.is-on){ display:none !important; } }

/* ---- v7.5 — agence : la vraie façade, mise en avant ---- */
html body > section.lt#agence:not(.zz){ padding:100px 0 !important; }
.ag-split{ display:grid; grid-template-columns:minmax(280px,.8fr) 1.2fr; gap:clamp(36px,5vw,72px); align-items:center; }
.ag-photo{ position:relative; margin:0; border-radius:28px; overflow:hidden; aspect-ratio:2/3; max-height:640px; box-shadow:0 50px 90px -45px rgba(11,40,34,.6), 0 0 0 10px rgba(255,255,255,.6); transform:rotate(-1.2deg); transition:transform .6s cubic-bezier(.2,.8,.2,1); }
.ag-photo:hover{ transform:rotate(0) scale(1.01); }
.ag-photo img{ width:100%; height:100%; object-fit:cover; object-position:50% 40%; }
.ag-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(11,30,26,.35), transparent 22%); pointer-events:none; }
.ag-photo figcaption{ position:absolute; z-index:1; top:16px; left:16px; }
.ag-live{ display:inline-flex; align-items:center; gap:8px; padding:7px 13px; border-radius:30px; background:rgba(11,30,26,.72); backdrop-filter:blur(8px); color:#EAF2EF; font-family:var(--mono); font-size:12px; border:1px solid rgba(255,255,255,.14); }
.ag-live i{ width:7px; height:7px; border-radius:50%; background:#3FC2A6; box-shadow:0 0 0 0 rgba(63,194,166,.7); animation:rv-pulse 1.8s ease-out infinite; }
.ag-side .section-head{ margin-bottom:0; }
.ag-side > div[style*="grid"]{ grid-template-columns:1fr 1fr !important; margin-top:26px !important; gap:14px !important; }
.ag-addr{ display:flex; align-items:center; gap:14px; margin-top:24px; padding:16px 18px; border-radius:18px; background:#fff; border:1px solid rgba(11,115,99,.14); }
.ag-pin{ flex:0 0 44px; height:44px; border-radius:12px; display:grid; place-items:center; background:#0B7363; }
.ag-pin svg{ width:22px; height:22px; fill:none; stroke:#fff; stroke-width:1.8; }
.ag-addr b{ display:block; font-family:var(--sans); font-size:17px; font-weight:600; color:var(--ink); }
.ag-addr small{ display:block; color:var(--muted); font-size:14px; margin-top:2px; }
.ag-ctas{ display:flex; flex-wrap:wrap; gap:12px; margin-top:22px; }
.ag-ctas .btn{ border-radius:40px; }
.ag-map{ border:1px solid rgba(11,115,99,.35) !important; color:#0B7363 !important; background:transparent !important; }
.ag-map:hover{ background:rgba(11,115,99,.08) !important; }
@media (max-width:900px){ .ag-split{ grid-template-columns:1fr; } .ag-photo{ max-width:420px; width:100%; margin:0 auto; transform:none; aspect-ratio:4/5; } }
@media (max-width:480px){ .ag-side > div[style*="grid"]{ grid-template-columns:1fr !important; } }
/* page Assistance administrative : façade en portrait dans le bandeau */
.v7-hero-photo.v7-hero-agence{ aspect-ratio:3/4; width:min(26vw,330px); }
.v7-hero-photo.v7-hero-agence img{ object-position:50% 40%; }

/* ---- v7.6 — promesse : la façade de l'agence dans le bandeau ---- */
@media (min-width:901px){
  .promise-card{ display:grid; grid-template-columns:1.25fr .75fr; grid-template-areas:"k ph" "h ph" "b ph"; column-gap:clamp(32px,5vw,72px); align-content:center; text-align:left; padding:clamp(48px,5vw,72px) clamp(36px,5vw,72px); }
  .promise-card .pc-k{ grid-area:k; justify-self:start; }
  .promise-card h2{ grid-area:h; margin:0 !important; max-width:15ch; font-size:clamp(32px,4.2vw,64px) !important; }
  .promise-card .pc-btn{ grid-area:b; justify-self:start; align-self:start; }
  .pc-photo{ grid-area:ph; align-self:center; }
}
.pc-photo{ position:relative; margin:0; width:100%; max-width:330px; justify-self:center; aspect-ratio:2/3; border-radius:24px; overflow:hidden; transform:rotate(2.5deg); box-shadow:0 40px 70px -30px rgba(3,17,14,.65), 0 0 0 8px rgba(255,255,255,.35); transition:transform .6s cubic-bezier(.2,.8,.2,1); animation:pc-float 7s ease-in-out infinite; }
.pc-photo:hover{ transform:rotate(0) scale(1.02); animation-play-state:paused; }
.pc-photo img{ width:100%; height:100%; object-fit:cover; object-position:50% 40%; }
.pc-photo figcaption{ position:absolute; top:14px; left:14px; }
@keyframes pc-float{ 50%{ transform:rotate(1.5deg) translateY(-8px); } }
@media (max-width:900px){ .pc-photo{ max-width:240px; margin:34px auto 0; transform:rotate(2deg); } }
@media (prefers-reduced-motion: reduce){ .pc-photo{ animation:none; } }
@media (min-width:901px){ .promise-card .pc-k{ align-self:end; margin-bottom:22px; } .promise-card h2{ align-self:center; } .promise-card .pc-btn{ margin-top:30px; } .promise-card{ grid-template-rows:1fr auto 1fr; } }

/* ---- v7.8 — le mot du dirigeant ---- */
.ceo{ display:grid; grid-template-columns:1.1fr .9fr; align-items:stretch; margin:8px 0 28px; border-radius:30px; overflow:hidden; background:#0B1E1A; color:#EAF2EF; box-shadow:0 50px 100px -55px rgba(11,40,34,.7); }
.ceo-photo{ position:relative; margin:0; min-height:420px; overflow:hidden; }
.ceo-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:58% 35%; transition:transform 1.4s cubic-bezier(.2,.8,.2,1); }
.ceo:hover .ceo-photo img{ transform:scale(1.03); }
.ceo-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, transparent 55%, rgba(11,30,26,.9) 100%); }
.ceo-tag{ position:absolute; z-index:1; left:18px; bottom:18px; }
.ceo-text{ position:relative; padding:clamp(32px,4vw,56px); display:flex; flex-direction:column; justify-content:center; }
.ceo-text::before{ content:"“"; position:absolute; top:-10px; right:28px; font-family:var(--serif); font-size:200px; line-height:1; color:rgba(63,194,166,.14); pointer-events:none; }
.ceo-eb{ font-family:var(--mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:#8EE3CF; }
.ceo blockquote{ margin:16px 0 24px; font-family:var(--serif); font-style:italic; font-size:clamp(20px,1.75vw,26px); line-height:1.42; color:#fff; letter-spacing:-.01em; }
.ceo-sign{ display:flex; flex-direction:column; gap:2px; padding-left:14px; border-left:2px solid #3FC2A6; margin-bottom:26px; }
.ceo-sign b{ font-family:var(--sans); font-weight:600; font-size:16px; color:#fff; }
.ceo-sign span{ font-family:var(--mono); font-size:12px; color:rgba(234,242,239,.55); }
.ceo-ctas{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px; }
.ceo-ctas .btn{ border-radius:40px; }
.ceo-phone{ color:#8EE3CF !important; font-family:var(--sans); font-weight:600; font-size:17px; text-decoration:none; letter-spacing:.01em; }
.ceo-phone:hover{ text-decoration:underline; }
@media (max-width:900px){ .ceo{ grid-template-columns:1fr; border-radius:24px; } .ceo-photo{ min-height:260px; } .ceo-photo::after{ background:linear-gradient(180deg, transparent 55%, rgba(11,30,26,.95) 100%); } }
/* dirigeant : placé en fin de page, fondu photo / texte sans couture */
html body > section.lt.ceo-sec:not(.zz){ padding:20px 0 110px !important; }
.ceo{ margin:0; }
.ceo-photo::after{ background:linear-gradient(90deg, rgba(11,30,26,0) 40%, rgba(11,30,26,.55) 72%, #0B1E1A 100%) !important; }
@media (max-width:900px){ .ceo-photo::after{ background:linear-gradient(180deg, rgba(11,30,26,0) 45%, #0B1E1A 100%) !important; } }

/* =====================================================================
   v7.11 — ouverture : grand nom brillant + téléphone qui bat + chiffres,
   qui se transforme au défilement en « Bienvenue chez M2 Secrétariat »
   ===================================================================== */
html body section.intro#intro{ display:block !important; min-height:0 !important; height:215svh; padding:0 !important; overflow:visible !important; }
.intro-stick{ position:sticky; top:77px; height:calc(100svh - 77px); display:grid; place-items:center; overflow:hidden; padding:24px 20px 40px; }
.intro-stick > *{ grid-area:1 / 1; }
.intro-stick > .intro-glow{ position:absolute; inset:0; }
.intro-b{ position:relative; display:flex; flex-direction:column; align-items:center; width:100%; opacity:var(--bq,0); transform:scale(calc(.9 + var(--bq,0) * .1)); will-change:opacity, transform; }
.intro:not(.b-on) .intro-b{ pointer-events:none; }
.intro-inner{ transform:none !important; opacity:1 !important; }
.intro-b .intro-scroll{ position:relative; bottom:auto; margin-top:34px; }
/* les animations d'entrée du « Bienvenue » attendent son apparition */
.intro:not(.b-on) :is(.intro-mark img, .intro-title .ch, .intro-tag, .intro-cta, .intro-hello .w){ animation:none !important; }
.intro:not(.b-on) :is(.intro-title .ch, .intro-tag, .intro-cta, .intro-hello .w){ opacity:0 !important; }
.intro.b-on .intro-cta{ animation-delay:.9s !important; }

.opener{ position:relative; z-index:2; width:100%; display:flex; flex-direction:column; align-items:center; text-align:center; opacity:var(--ao,1); transform:translateY(calc(var(--ap,0) * -70px)) scale(calc(1 + var(--ap,0) * .18)); filter:blur(calc(var(--ap,0) * 10px)); will-change:opacity, transform, filter; }
.intro.b-on .opener{ pointer-events:none; }
.op-ecg{ position:absolute; left:-20px; right:-20px; top:calc(50% - 150px); width:calc(100% + 40px); height:120px; z-index:-1; overflow:visible; opacity:.9; }
.op-ecg path{ fill:none; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
.op-ecg .e0{ stroke:rgba(63,194,166,.16); stroke-width:1.5; }
.op-ecg .e1{ stroke:#3FC2A6; stroke-width:2.4; filter:drop-shadow(0 0 6px rgba(63,194,166,.9)); stroke-dasharray:180 1400; animation:op-ecg 2.4s linear infinite; }
@keyframes op-ecg{ from{ stroke-dashoffset:180; } to{ stroke-dashoffset:-1400; } }
.op-phone{ position:relative; width:118px; height:118px; display:grid; place-items:center; margin-bottom:18px; }
.op-phone i{ position:absolute; inset:0; border-radius:50%; border:1.5px solid rgba(63,194,166,.6); opacity:0; animation:op-ring 2.4s cubic-bezier(.2,.6,.3,1) infinite; }
.op-phone i:nth-child(2){ animation-delay:.18s; } .op-phone i:nth-child(3){ animation-delay:1.2s; }
@keyframes op-ring{ 0%{ transform:scale(.6); opacity:.9; } 70%,100%{ transform:scale(1.9); opacity:0; } }
.op-ico{ width:86px; height:86px; border-radius:50%; display:grid; place-items:center; background:radial-gradient(circle at 35% 30%, #B9EDE0, #3FC2A6 55%, #1E8C77); box-shadow:0 0 0 8px rgba(63,194,166,.12), 0 0 60px rgba(63,194,166,.7); animation:op-beat 1.2s ease-in-out infinite; }
.op-ico svg{ width:38px; height:38px; fill:none; stroke:#03110E; stroke-width:1.8; }
@keyframes op-beat{ 0%,100%{ transform:scale(1); } 12%{ transform:scale(1.14); } 24%{ transform:scale(.98); } 36%{ transform:scale(1.09); } 52%{ transform:scale(1); } }
.op-ring{ font-family:var(--mono); font-size:13px; letter-spacing:.06em; color:#8EE3CF; margin:0 0 10px; }
.op-ring::after{ content:""; display:inline-block; width:6px; height:6px; border-radius:50%; background:#3FC2A6; margin-left:8px; vertical-align:2px; animation:rv-pulse 1.2s ease-out infinite; }
.op-title{ display:flex; align-items:baseline; justify-content:center; gap:.18em; font-family:var(--sans); font-size:clamp(46px,11.2vw,190px); line-height:.9; letter-spacing:-.05em; white-space:nowrap; }
.op-title .b{ font-weight:700; background:linear-gradient(100deg, #3FC2A6 0%, #3FC2A6 38%, #E9FFF8 50%, #3FC2A6 62%, #3FC2A6 100%); background-size:260% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:op-shine 4.2s ease-in-out infinite; filter:drop-shadow(0 0 28px rgba(63,194,166,.45)); }
.op-title .l{ font-weight:600; background:linear-gradient(100deg, #DCEBE6 0%, #DCEBE6 38%, #FFFFFF 50%, #8EE3CF 56%, #DCEBE6 64%, #DCEBE6 100%); background-size:260% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:op-shine 4.2s ease-in-out infinite .15s; }
@keyframes op-shine{ 0%{ background-position:120% 0; } 55%,100%{ background-position:-40% 0; } }
.op-sub{ margin:18px 0 0; color:rgba(234,242,239,.7); font-size:clamp(15px,1.3vw,18px); }
.op-stats{ list-style:none; margin:clamp(28px,4vh,46px) 0 0; padding:0; display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:0; border:1px solid rgba(255,255,255,.09); border-radius:20px; background:rgba(255,255,255,.03); backdrop-filter:blur(8px); width:min(980px,100%); }
.op-stats li{ padding:18px 14px; display:flex; flex-direction:column; gap:4px; align-items:center; }
.op-stats li + li{ border-left:1px solid rgba(255,255,255,.08); }
.op-stats b{ font-family:var(--sans); font-weight:600; font-size:clamp(24px,2.4vw,36px); letter-spacing:-.03em; color:#fff; font-variant-numeric:tabular-nums; }
.op-stats li:first-child b{ color:#8EE3CF; }
.op-stats span:not(.op-n){ font-size:13px; color:rgba(234,242,239,.6); }
.op-hint{ margin-top:clamp(22px,3.5vh,40px); display:flex; flex-direction:column; align-items:center; gap:10px; font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:rgba(234,242,239,.55); }
.op-hint i{ width:1.5px; height:34px; background:linear-gradient(180deg,#3FC2A6,transparent); animation:scroll-cue 1.8s ease-in-out infinite; transform-origin:top; }
@media (max-width:760px){
  html body section.intro#intro{ height:200svh; }
  .op-stats{ grid-template-columns:1fr 1fr; }
  .op-stats li:nth-child(3){ border-left:0; } .op-stats li:nth-child(n+3){ border-top:1px solid rgba(255,255,255,.08); }
  .op-phone{ width:92px; height:92px; } .op-ico{ width:68px; height:68px; } .op-ico svg{ width:30px; height:30px; }
  .op-title{ flex-direction:column; align-items:center; gap:0; font-size:clamp(46px,15vw,84px); }
  .op-ecg{ top:calc(50% - 210px); }
}
@media (max-height:700px) and (min-width:761px){ .op-stats li{ padding:12px; } .op-phone{ width:90px; height:90px; margin-bottom:8px; } .op-ico{ width:64px; height:64px; } }
@media (prefers-reduced-motion: reduce){
  html body section.intro#intro{ height:auto; } .intro-stick{ position:relative; top:0; height:auto; display:block; }
  .opener{ display:none; } .intro-b{ opacity:1; transform:none; }
}
.intro-b .intro-scroll{ display:none !important; }
@media (max-width:760px){ .op-title{ font-size:clamp(40px,12.2vw,84px); } }
.op-ecg{ top:-1px !important; }
.op-ecg .e1{ stroke-dasharray:220 1600; animation-duration:2.4s; }
@media (max-width:760px){ .op-ecg{ top:-14px !important; } }
@media (max-width:760px) and (max-height:740px){ .op-sub{ display:none; } .op-stats li{ padding:10px 8px; } .op-ring{ margin-bottom:4px; } .op-hint{ margin-top:14px; } }
.op-hint{ margin-top:clamp(34px,6vh,64px) !important; }

/* ---- v7.12 — ouverture plein écran, effacée d'un seul défilement ---- */
html body section.intro#intro{ height:auto !important; }
.intro-stick{ position:relative !important; top:0 !important; height:auto !important; min-height:calc(100svh - 77px); }
.intro-b{ opacity:1 !important; transform:none !important; }
html.op-lock, html.op-lock body{ overflow:hidden !important; }
.opener{ position:fixed !important; inset:0; z-index:2000; justify-content:center; padding:20px; cursor:pointer; opacity:1 !important; transform:none !important; filter:none !important;
  background:radial-gradient(70% 60% at 50% 42%, rgba(63,194,166,.18), transparent 70%), radial-gradient(120% 90% at 50% 120%, rgba(48,127,128,.28), transparent 60%), #0B1E1A;
  transition:opacity .7s ease, transform .75s cubic-bezier(.6,0,.3,1), filter .7s ease; }
.opener.op-out{ opacity:0 !important; transform:scale(1.12) !important; filter:blur(12px) !important; pointer-events:none; }
.opener .op-ecg{ top:calc(50% - 140px) !important; }
.op-hint{ cursor:pointer; }
@media (max-width:760px){ .opener .op-ecg{ top:calc(50% - 150px) !important; } }
@media (prefers-reduced-motion: reduce){ .opener{ display:flex !important; transition:opacity .3s; } .opener.op-out{ transform:none !important; filter:none !important; } }

/* ---- v7.15 — agence : une photo par service (sans doublon de la façade) ---- */
.ag-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:34px; }
.ag-card2{ background:#fff; border-radius:22px; overflow:hidden; border:1px solid rgba(11,115,99,.1); display:flex; flex-direction:column; transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s, border-color .4s; }
.ag-card2:hover{ transform:translateY(-6px); box-shadow:0 30px 50px -30px rgba(11,60,52,.5); border-color:rgba(63,194,166,.45); }
.ag-media{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.ag-media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s cubic-bezier(.2,.8,.2,1); }
.ag-card2:hover .ag-media img{ transform:scale(1.06); }
.ag-body{ padding:20px 22px 24px; }
.ag-body h3{ font-family:var(--sans); font-size:17px !important; font-weight:600; margin:0 0 6px !important; color:var(--ink); letter-spacing:-.01em; }
.ag-body p{ margin:0 !important; color:var(--muted); font-size:14.5px; line-height:1.5; }
/* visuels de marque UPS / Vinted */
.ag-ups, .ag-vinted{ display:grid; place-items:center; isolation:isolate; }
.ag-ups{ background:radial-gradient(90% 90% at 30% 20%, #5A3B2C 0%, #351C15 60%, #24130E 100%); }
.ag-vinted{ background:radial-gradient(90% 90% at 30% 20%, #19A3AD 0%, #007782 60%, #005A62 100%); }
.ag-logo{ position:relative; z-index:2; width:44%; max-width:120px; aspect-ratio:1; display:grid; place-items:center; transition:transform .5s cubic-bezier(.2,.8,.2,1); }
.ag-logo svg{ width:100%; height:100%; }
.ag-ups .ag-logo svg{ fill:#FFB500; filter:drop-shadow(0 10px 22px rgba(0,0,0,.4)); }
.ag-vinted .ag-logo svg{ fill:#fff; filter:drop-shadow(0 10px 22px rgba(0,0,0,.25)); }
.ag-card2:hover .ag-logo{ transform:scale(1.08) rotate(-3deg); }
.ag-box{ position:absolute; z-index:1; width:62%; right:-12%; bottom:-14%; fill:none; stroke-width:1.4; stroke-linejoin:round; opacity:.32; transform:rotate(-12deg); }
.ag-ups .ag-box{ stroke:#FFB500; } .ag-vinted .ag-box{ stroke:#fff; }
.ag-media::before{ content:""; position:absolute; inset:0; z-index:0; background-image:radial-gradient(rgba(255,255,255,.12) 1px, transparent 1.3px); background-size:16px 16px; mask-image:radial-gradient(80% 80% at 50% 50%, #000, transparent); }
.ag-media:not(.ag-ups):not(.ag-vinted)::before{ display:none; }
.ag-badge{ position:absolute; z-index:3; left:14px; top:14px; padding:6px 12px; border-radius:30px; font-family:var(--mono); font-size:11.5px; letter-spacing:.04em; background:rgba(0,0,0,.28); color:#fff; border:1px solid rgba(255,255,255,.18); backdrop-filter:blur(6px); }
.ag-foot{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:18px; margin-top:22px; }
.ag-foot .ag-addr{ margin-top:0; flex:1 1 420px; }
.ag-foot .ag-ctas{ margin-top:0; }
@media (max-width:1000px){ .ag-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .ag-grid{ grid-template-columns:1fr; } .ag-media{ aspect-ratio:16/9; } .ag-foot .ag-addr{ flex-basis:100%; } }

/* ---- v7.16 — Services : un seul bloc, bascule « À distance » / « Sur place » ---- */
.svc-switch{ position:relative; display:inline-grid; grid-template-columns:1fr 1fr; margin:6px 0 30px; padding:5px; border-radius:40px; background:#fff; border:1px solid rgba(11,115,99,.16); box-shadow:0 14px 30px -22px rgba(11,60,52,.5); }
.sw-pill{ position:absolute; top:5px; bottom:5px; left:5px; width:calc(50% - 5px); border-radius:40px; background:linear-gradient(135deg,#0B7363,#0E8C78); box-shadow:0 8px 20px -8px rgba(11,115,99,.7); transition:transform .45s cubic-bezier(.2,.8,.2,1); }
.svc-switch.is-agence .sw-pill{ transform:translateX(100%); }
.sw-btn{ position:relative; z-index:1; display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:12px 24px; border:0; background:none; border-radius:40px; cursor:pointer; font-family:var(--sans); font-weight:600; font-size:15px; color:var(--ink); transition:color .35s; white-space:nowrap; }
.sw-btn svg{ width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.9; }
.sw-btn.is-on{ color:#fff; }
.sw-btn:focus-visible{ outline:2px solid #3FC2A6; outline-offset:2px; }
.svc-pane{ animation:sw-in .55s cubic-bezier(.2,.8,.2,1); }
.svc-pane[hidden]{ display:none !important; }
@keyframes sw-in{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }
.sw-x[hidden]{ display:none !important; }
/* 5 cartes « sur place » : 3 + 2 */
#agence .ag-grid{ grid-template-columns:repeat(6,1fr); margin-top:0; }
#agence .ag-card2{ grid-column:span 2; }
#agence .ag-card2:nth-child(n+4){ grid-column:span 3; }
#agence .ag-card2:nth-child(n+4) .ag-media{ aspect-ratio:16/7; }
.ag-price{ position:absolute; left:14px; bottom:14px; padding:6px 12px; border-radius:30px; background:#fff; color:#0B7363; font-family:var(--sans); font-weight:700; font-size:13px; box-shadow:0 10px 20px -10px rgba(0,0,0,.4); }
.ag-link{ display:inline-block; margin-top:10px; color:#0B7363 !important; font-family:var(--sans); font-weight:600; font-size:14px; text-decoration:none; }
.ag-link:hover{ text-decoration:underline; }
@media (max-width:1000px){ #agence .ag-grid{ grid-template-columns:1fr 1fr; } #agence .ag-card2, #agence .ag-card2:nth-child(n+4){ grid-column:auto; } #agence .ag-card2:nth-child(n+4) .ag-media{ aspect-ratio:4/3; } #agence .ag-card2:last-child{ grid-column:1 / -1; } #agence .ag-card2:last-child .ag-media{ aspect-ratio:16/7; } }
@media (max-width:520px){ #agence .ag-grid{ grid-template-columns:1fr; } #agence .ag-card2 .ag-media, #agence .ag-card2:nth-child(n+4) .ag-media, #agence .ag-card2:last-child .ag-media{ aspect-ratio:16/9; } .svc-switch{ display:grid; width:100%; } .sw-btn{ padding:11px 10px; font-size:14px; } }
/* dirigeant : conclut la partie « Qui sommes-nous » */
#equipe .ceo{ margin-top:28px; }
/* dirigeant : dans le pied de page, au-dessus de la grande signature */
footer .ceo-foot{ margin:8px 0 36px; background:#0B1E1A; border:1px solid rgba(255,255,255,.07); box-shadow:none; }
footer .ceo-foot .ceo-photo{ min-height:340px; }
footer .ceo-foot blockquote{ font-size:clamp(18px,1.5vw,22px); }
@media (max-width:900px){ footer .ceo-foot .ceo-photo{ min-height:240px; } }
.ubicentrex-modal-alt a.ubi-open{ display:inline-block; margin-left:6px; padding:8px 16px; border-radius:30px; background:#0B7363; color:#fff !important; text-decoration:none !important; }
/* façade : bien droite (plus de rotation) */
.pc-photo{ transform:none !important; animation:pc-float2 7s ease-in-out infinite !important; }
.pc-photo:hover{ transform:scale(1.02) !important; }
@keyframes pc-float2{ 50%{ transform:translateY(-8px); } }
@media (prefers-reduced-motion: reduce){ .pc-photo{ animation:none !important; } }
.v7-hero-photo.v7-hero-agence{ transform:translateY(-50%) !important; animation:v7-float-straight 7s ease-in-out infinite !important; }
@keyframes v7-float-straight{ 50%{ transform:translateY(calc(-50% - 10px)); } }
/* diaporama services : le texte ne se superpose plus pendant le fondu */
.svc-slide .svc-text{ transition:opacity .25s ease, transform .5s ease; }
.svc-slide:not(.active) .svc-text{ opacity:0; transform:translateY(10px); }
.svc-slide.active .svc-text{ opacity:1; transform:none; transition:opacity .5s ease .55s, transform .6s cubic-bezier(.2,.8,.2,1) .55s; }
.svc-slide[data-bg*="permanence-m2"]{ background-position:30% 35% !important; }
@media (max-width:700px){ .svc-slide[data-bg*="permanence-m2"]{ background-position:12% 30% !important; } }
.svc-slide[data-bg*="permanence-m2"]{ background-position:center 40% !important; } @media (max-width:700px){ .svc-slide[data-bg*="permanence-m2"]{ background-position:20% 40% !important; } }