@font-face{font-family:'Nunito';font-style:normal;font-weight:800;font-display:swap;src:url('../fonts/nunito-latin-800-normal.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/manrope-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:300 800;font-display:swap;src:url('../fonts/Figtree-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Figtree';font-style:normal;font-weight:300 800;font-display:swap;src:url('../fonts/Figtree-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:300 700;font-display:swap;src:url('../fonts/Fraunces-Italic-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:300 700;font-display:swap;src:url('../fonts/Fraunces-Italic-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 700;font-display:swap;src:url('../fonts/Fraunces-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 700;font-display:swap;src:url('../fonts/Fraunces-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* ==========================================================================
   Optique Langoiran (site statique)
   Charte reprise de la V1 WordPress/Divi : bleu #014c6c, turquoise #02859c,
   Fraunces (titres h1/h2), Figtree (texte, menu, boutons) — typographie modernisée le 17/10/2026.
   ========================================================================== */
:root{
  --navy:#014c6c; --teal:#02859c; --btn:#034d6a; --hover:#00829c;
  --txt:#4d5d66; --grey:#f4f4f4; --light:#ededf8; --white:#fff;
  --f-txt:'Figtree',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --f-title:'Figtree',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --f-btn:'Figtree',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --f-display:'Fraunces',Georgia,'Times New Roman',serif;
  --wrap:1180px; --gut:clamp(1rem,4vw,2rem);
  --h-head:76px; --ease:cubic-bezier(.22,.61,.36,1);
  --shadow:0 10px 30px rgba(1,76,108,.12);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--f-txt);font-weight:400;font-size:clamp(1rem,.96rem + .22vw,1.1rem);line-height:1.7;color:var(--txt);font-optical-sizing:auto;background:var(--white);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy);text-decoration:none}
a:hover{color:var(--teal)}
h1,h2,h3,h4{font-family:var(--f-title);color:var(--navy);line-height:1.25;margin:0 0 .6em}
h1,h2{font-family:var(--f-display);font-optical-sizing:auto}
h2{font-size:clamp(2rem,1.2rem + 2.8vw,3.4rem);font-weight:450;line-height:1.05;letter-spacing:-.022em;text-align:center;text-wrap:balance}
h2 em{font-style:italic;font-weight:400;color:var(--teal)}
h3{font-size:clamp(1.15rem,1rem + .6vw,1.45rem);font-weight:700;letter-spacing:-.005em}
h4{font-size:clamp(1.15rem,1rem + .7vw,1.45rem);font-weight:700;color:var(--teal)}
p{margin:0 0 1em;text-wrap:pretty}
ul{margin:0 0 1em;padding-left:1.2em}
strong{font-weight:700}
:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--navy);color:#fff;padding:.6rem 1rem;z-index:200}
.skip:focus{left:0}
.wrap{width:min(100% - 2*var(--gut),var(--wrap));margin-inline:auto}
.section{padding-block:clamp(2rem,5vw,4rem)}
.section--grey{background:var(--grey)}
.center{text-align:center}

/* ---- En-tête : verre dépoli, menu « mise au point », statut d'ouverture ---- */
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(1.5) blur(16px);backdrop-filter:saturate(1.5) blur(16px);transition:box-shadow .4s var(--ease),background .4s}
.site-header.is-scrolled{box-shadow:0 8px 28px rgba(1,76,108,.10);background:rgba(255,255,255,.93)}
.site-header .bar{width:min(100% - 2*var(--gut),1360px);display:flex;align-items:center;gap:clamp(1rem,2.2vw,2rem);height:82px;transition:height .45s var(--ease)}
.site-header.is-scrolled .bar{height:62px}
.progress{position:absolute;left:0;right:0;bottom:0;height:2px;pointer-events:none}
.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--navy));transform:scaleX(var(--p,0));transform-origin:left}

/* Logo + reflet de lentille (passe une fois au chargement, puis au survol) */
.logo{position:relative;display:block;flex:none;line-height:0}
.logo img{height:72px;width:auto;transition:height .45s var(--ease)}
.site-header.is-scrolled .logo img{height:50px}
.glint{position:absolute;left:.4%;top:2.5%;width:29.6%;height:86%;overflow:hidden;border-radius:9%;pointer-events:none}
.glint::after{content:"";position:absolute;top:-20%;bottom:-20%;left:-60%;width:45%;transform:translateX(0) skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);opacity:0}
.glint.is-play::after,.logo:hover .glint::after{animation:glint 1.1s var(--ease) 1}
@keyframes glint{0%{opacity:0;transform:translateX(0) skewX(-18deg)}15%{opacity:1}100%{opacity:0;transform:translateX(420%) skewX(-18deg)}}

/* Menu : « mise au point » — au survol, les autres entrées se défocalisent */
.nav{position:relative;margin-left:auto}
.nav ul{display:flex;gap:clamp(1.1rem,2.3vw,2.2rem);list-style:none;margin:0;padding:0}
.nav a{display:block;white-space:nowrap;padding:.7rem 0;font-family:var(--f-title);font-weight:600;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--navy);transition:opacity .35s var(--ease),filter .35s var(--ease),color .3s}
.nav a[aria-current="page"]{color:var(--teal)}
@media (hover:hover){
  .nav ul:hover a{opacity:.4;filter:blur(.7px)}
  .nav ul a:hover,.nav ul a:focus-visible{opacity:1;filter:none;color:var(--teal)}
}
.nav-focus{position:absolute;left:0;bottom:2px;height:2px;width:0;border-radius:2px;background:linear-gradient(90deg,var(--teal),var(--navy));opacity:0;transition:transform .6s cubic-bezier(.65,0,.2,1),width .6s cubic-bezier(.65,0,.2,1),opacity .3s}
.nav-focus.is-on{opacity:1}

/* Statut d'ouverture (calculé selon les horaires habituels) */
.status{display:none;align-items:center;gap:.65rem;font-family:var(--f-title);color:var(--navy);white-space:nowrap}
.status .txt{display:flex;flex-direction:column;gap:.12rem;line-height:1.1}
.status .st-main{font-weight:700;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase}
.status .st-sub{font-weight:500;font-size:.74rem;letter-spacing:.01em;opacity:.72}
.status .dot{position:relative;width:8px;height:8px;border-radius:50%;background:#9aa7ad;flex:none}
.status[data-state="open"] .dot{background:#1fa971}
.status[data-state="open"] .dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:#1fa971;animation:ping 2.2s ease-out infinite}
.status[data-state="soon"] .dot{background:#e8a317}
@keyframes ping{0%{transform:scale(1);opacity:.55}80%,100%{transform:scale(3.2);opacity:0}}
.head-cta{display:none;flex:none;white-space:nowrap;align-items:center;gap:.55rem;font-family:var(--f-title);font-weight:700;font-size:.78rem;letter-spacing:.07em;text-transform:uppercase;color:#fff;background:var(--navy);padding:.7rem 1.15rem;border-radius:999px;transition:background .3s,transform .35s var(--ease)}
.head-cta svg{width:15px;height:15px;transition:transform .35s var(--ease)}
.head-cta:hover{background:var(--teal);color:#fff}
.head-cta:hover svg{transform:translateX(4px)}
@media (min-width:1000px){.head-cta{display:inline-flex}}
@media (min-width:1300px){.bar .status{display:inline-flex}}

/* Bouton menu (mobile) : deux traits asymétriques */
.nav-toggle{display:none;position:relative;width:46px;height:46px;margin-left:auto;padding:0;border:0;background:none;cursor:pointer;color:var(--navy)}
.nav-toggle::before,.nav-toggle::after{content:"";position:absolute;right:9px;height:2.5px;border-radius:2px;background:currentColor;transition:width .35s var(--ease)}
.nav-toggle::before{top:16px;width:28px}.nav-toggle::after{top:27px;width:17px}
.nav-toggle:hover::after{width:28px}
@media (max-width:999px){
  .nav,.bar .status{display:none!important}
  .nav-toggle{display:block}
}

/* Menu mobile : ouverture en « iris » depuis le bouton */
.menu-overlay{--bx:calc(100% - 32px);--by:46px;--r:160vmax;position:fixed;inset:0;z-index:150;display:flex;flex-direction:column;padding:0 var(--gut) 1.6rem;color:#fff;background:radial-gradient(circle at 100% 100%,#01859c 0%,#014c6c 70%);background-color:var(--navy);overflow-y:auto;visibility:hidden;clip-path:circle(0 at var(--bx) var(--by));transition:clip-path .8s cubic-bezier(.7,0,.2,1),visibility 0s .8s}
.menu-open .menu-overlay{visibility:visible;clip-path:circle(var(--r) at var(--bx) var(--by));transition:clip-path .8s cubic-bezier(.7,0,.2,1),visibility 0s}
.menu-open{overflow:hidden}
.mo-top{display:flex;align-items:center;justify-content:space-between;height:78px;flex:none}
.mo-top img{width:112px;height:auto}
.mo-close{position:relative;width:46px;height:46px;border:0;background:none;cursor:pointer;color:#fff}
.mo-close::before,.mo-close::after{content:"";position:absolute;left:10px;top:22px;width:26px;height:2.5px;border-radius:2px;background:currentColor}
.mo-close::before{transform:rotate(45deg)}.mo-close::after{transform:rotate(-45deg)}
.mo-nav{margin:auto 0;padding:1rem 0}
.mo-nav ol{list-style:none;margin:0;padding:0}
.mo-nav a{display:flex;align-items:baseline;gap:1rem;padding:.55rem 0;color:#fff;font-family:var(--f-display);font-weight:450;font-size:clamp(2rem,9vw,2.9rem);line-height:1.15;letter-spacing:-.01em;border-bottom:1px solid rgba(255,255,255,.16)}
.mo-nav a[aria-current="page"]{color:#9fe3ee}
.mo-nav .no{font-weight:500;font-size:.8rem;letter-spacing:.14em;opacity:.6;min-width:1.6em}
.mo-nav li,.mo-foot{opacity:0;transform:translateY(22px);transition:opacity .5s var(--ease),transform .6s var(--ease)}
.menu-open .mo-nav li,.menu-open .mo-foot{opacity:1;transform:none}
.menu-open .mo-nav li:nth-child(1){transition-delay:.38s}
.menu-open .mo-nav li:nth-child(2){transition-delay:.45s}
.menu-open .mo-nav li:nth-child(3){transition-delay:.52s}
.menu-open .mo-nav li:nth-child(4){transition-delay:.59s}
.menu-open .mo-nav li:nth-child(5){transition-delay:.66s}
.menu-open .mo-foot{transition-delay:.78s}
.mo-foot{flex:none;display:grid;gap:.7rem}
.mo-foot .status{display:inline-flex;color:#fff}
.mo-foot .status[data-state="open"] .dot,.mo-foot .status[data-state="open"] .dot::after{background:#4be0a4}
.mo-tel{font-family:var(--f-title);font-weight:700;font-size:1.5rem;color:#fff}
.mo-foot p{margin:0;font-size:.9rem;opacity:.8}
.mo-foot .btn{justify-self:start;background:#fff;border-color:#fff;color:var(--navy);margin-top:.4rem}
.mo-foot .btn:hover{background:#9fe3ee;border-color:#9fe3ee;color:var(--navy)}

/* ---- Bandeau titre des pages internes ---- */
.page-title{color:#fff;background-image:radial-gradient(circle at 100% 100%,#01859c 0%,#014c6c 100%);background-color:var(--navy);padding-block:clamp(2rem,5vw,3.6rem)}
.page-title .kicker{font-family:var(--f-title);letter-spacing:.22em;font-size:clamp(.7rem,.65rem + .3vw,.9rem);text-transform:uppercase;opacity:.85;margin:0}
.page-title h1{color:#fff;font-weight:450;font-size:clamp(2.6rem,1.4rem + 4.6vw,5rem);margin:.15em 0 0;line-height:1;letter-spacing:-.025em}
.page-title h1 span{display:block}

/* ---- Hero (accueil) : plein cadre, ouverture en iris, mise au point, lentille « photo suivante » ---- */
.hero{position:relative;background:#0b3a53;overflow:hidden;touch-action:pan-y;outline:0}
.hero-slides{position:relative;height:clamp(440px,calc(100vh - 82px),800px);height:clamp(440px,calc(100svh - 82px),800px);margin:0;padding:0;list-style:none}
.hero-slide{position:absolute;inset:0;z-index:1;clip-path:circle(0 at var(--cx,92%) var(--cy,86%))}
.hero-slide.is-active{z-index:3;clip-path:circle(150% at var(--cx,92%) var(--cy,86%));transition:clip-path 1.4s cubic-bezier(.7,0,.2,1)}
.hero-slide.is-leaving{z-index:2;clip-path:circle(150% at var(--cx,92%) var(--cy,86%))}
.hero-slide picture,.hero-slide img{display:block;width:100%;height:100%}
.hero-slide img{object-fit:cover;object-position:50% 58%;transform:scale(1);transition:filter 1.4s var(--ease);-webkit-user-drag:none;user-select:none}
.hero-slide img.hero-pos-l{object-position:30% 58%}.hero-slide img.hero-pos-r{object-position:70% 50%}.hero-slide img.hero-pos-f{object-position:50% 15%}
.hero-slide.is-active img{animation:kenburns 9s ease-out forwards}
.hero.is-switched .hero-slide.is-active img{animation:kenburns 9s ease-out forwards,focus-in 1.5s var(--ease) backwards}
.hero-slide.is-leaving img{animation:kenburns 9s ease-out forwards;filter:blur(12px)}
@keyframes kenburns{from{transform:scale(1.035)}to{transform:scale(1)}}
@keyframes focus-in{from{filter:blur(14px)}to{filter:blur(0)}}
.hero::after{content:"";position:absolute;inset:auto 0 0 0;height:52%;z-index:4;pointer-events:none;background:linear-gradient(to top,rgba(1,38,56,.68),rgba(1,38,56,.28) 45%,transparent)}
.hero-ui{position:absolute;inset:auto 0 0 0;z-index:5;pointer-events:none}
.hero-bar{width:min(100% - 2*var(--gut),1360px);display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;padding-bottom:clamp(1rem,2.6vw,2rem)}
.hero-caption{color:#fff;min-width:0}
.hero-count{display:block;font-family:var(--f-title);font-weight:600;font-size:.74rem;letter-spacing:.22em;font-variant-numeric:tabular-nums;opacity:.85;margin-bottom:.35rem}
.hero-title{display:block;font-family:var(--f-display);font-weight:450;font-size:clamp(1.8rem,1.1rem + 2.6vw,3.2rem);line-height:1.05;letter-spacing:-.02em;text-shadow:0 2px 18px rgba(1,38,56,.35)}
.hero-title.is-in{animation:cap-in .9s var(--ease) both}
@keyframes cap-in{from{opacity:0;transform:translateY(16px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.hero-ctrl{display:flex;align-items:center;gap:.8rem;pointer-events:auto}
.hero-prev{width:46px;height:46px;border-radius:50%;border:1.5px solid rgba(255,255,255,.7);background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;cursor:pointer;display:grid;place-items:center;transition:background .3s,color .3s,transform .3s var(--ease)}
.hero-prev svg{width:20px;height:20px}
.hero-prev:hover{background:#fff;color:var(--navy);transform:translateX(-2px)}
.hero-lens{position:relative;width:clamp(68px,7.4vw,92px);aspect-ratio:1;padding:0;border:0;border-radius:50%;background:none;cursor:pointer;color:#fff}
.hero-lens .ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.hero-lens .ring circle{fill:none;stroke-width:2.6}
.hero-lens .ring-bg{stroke:rgba(255,255,255,.4)}
.hero-lens .ring-fg{stroke:#fff;stroke-linecap:round;stroke-dasharray:226.2;stroke-dashoffset:226.2}
.hero-lens.is-run .ring-fg{animation:ring 6.5s linear forwards}
.hero.is-paused .hero-lens .ring-fg,.hero-lens:hover .ring-fg{animation-play-state:paused}
@keyframes ring{to{stroke-dashoffset:0}}
.lens-pic{position:absolute;inset:7%;border-radius:50%;overflow:hidden;box-shadow:0 6px 18px rgba(1,38,56,.35)}
.lens-pic img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease),filter .4s}
.lens-arrow{position:absolute;inset:7%;border-radius:50%;display:grid;place-items:center;background:rgba(1,76,108,.55);opacity:0;transition:opacity .3s}
.lens-arrow svg{width:26px;height:26px}
.hero-lens:hover .lens-pic img{transform:scale(1.12)}
.hero-lens:hover .lens-arrow,.hero-lens:focus-visible .lens-arrow{opacity:1}
@media (max-width:700px){
  .hero-slides{height:min(68svh,580px);height:min(68vh,580px);height:min(68svh,580px)}
  .hero-prev{width:42px;height:42px}
  .hero-slide img.hero-pos-f{object-position:50% 50%}
}
@media (prefers-reduced-motion:reduce){.hero-slide.is-active{transition:none}}

/* ---- Intro ---- */
.intro-sec{padding-block:clamp(3.5rem,8vw,7rem)}
.intro-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.intro-sec--home .intro-grid{align-items:center}
.intro-head{position:relative;isolation:isolate}
.intro-head .eyebrow{display:flex;align-items:center;gap:.9rem;margin:0 0 1.3rem;font-family:var(--f-title);font-weight:700;font-size:.76rem;letter-spacing:.24em;text-transform:uppercase;color:var(--teal)}
.intro-head .eyebrow::before{content:"";width:2.6rem;height:2px;background:var(--teal);transform-origin:left;transition:transform 1s var(--ease) .2s}
.js .intro-head:not(.is-in) .eyebrow::before{transform:scaleX(0)}
.intro-head h2{text-align:left;margin:0;font-size:clamp(2.6rem,1.2rem + 4.6vw,5rem);line-height:1}
.intro-head::before,.intro-head::after{content:"";position:absolute;z-index:-1;aspect-ratio:1;border-radius:50%;border:1px solid rgba(2,133,156,.32);pointer-events:none}
.intro-head::before{width:clamp(150px,17vw,250px);left:-9%;top:-34%}
.intro-head::after{width:clamp(150px,17vw,250px);left:calc(-9% + clamp(150px,17vw,250px) * .78);top:-34%}
.intro-body{padding-top:.4rem}
.intro-body .lead{font-family:var(--f-display);font-weight:400;font-size:clamp(1.4rem,1rem + 1.3vw,2rem);line-height:1.32;letter-spacing:-.012em;color:var(--navy);margin-bottom:1.6rem}
.intro-body .lead strong{font-weight:500}
.intro-body p{max-width:60ch}
@media (max-width:900px){.intro-grid{grid-template-columns:1fr}}
/* Titres : les mots passent du flou au net, l'un après l'autre */
.split-words .w{display:inline-block;white-space:pre}
.js .split-words .w{opacity:0;filter:blur(10px);transform:translateY(.32em);transition:opacity .9s var(--ease),filter .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i) * 70ms)}
.js .split-words.is-in .w{opacity:1;filter:none;transform:none}

/* ---- Cartes infos ---- */
.cards4{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1.4rem}
.card{background:#fff;border-radius:12px;padding:1.8rem 1.4rem;text-align:center;box-shadow:var(--shadow);transition:transform .35s var(--ease),box-shadow .35s}
.card:hover{transform:translateY(-6px);box-shadow:0 18px 38px rgba(1,76,108,.18)}
.card svg{width:54px;height:54px;color:var(--teal);margin:0 auto .8rem;display:block}
.card h3{color:var(--navy);font-size:1.15rem;margin-bottom:.6rem}
.card p{margin:0 0 .4rem;font-size:.95em;line-height:1.55}
.card a{font-weight:700}
.card .social{display:flex;gap:1rem;justify-content:center;margin-top:.4rem}

/* ---- Boutons ---- */
.btn{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--f-btn);font-weight:700;font-size:1.05rem;text-transform:uppercase;color:#fff;background:var(--navy);padding:.85rem 1.6rem;border:2px solid var(--navy);border-radius:999px;cursor:pointer;transition:background .3s,color .3s,transform .3s var(--ease)}
.btn:hover{background:var(--teal);border-color:var(--teal);color:#fff;transform:translateY(-2px)}
.btn--ghost{background:transparent;color:var(--btn)}
.btn--ghost:hover{background:var(--navy);border-color:var(--navy)}
.btn img,.btn svg{width:26px;height:26px}
.btn:not(.btn--ghost) img,.btn--ghost:hover img{filter:brightness(0) invert(1)}
.btn--ghost img.doctolib{width:auto;height:26px}
.btn--ghost:hover img.doctolib{filter:none}
.rdv{text-align:center}
.rdv h3{font-size:clamp(1.3rem,1rem + 1vw,1.8rem);margin-bottom:.4rem}
.rdv-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-top:1.2rem}

/* ---- Équipe ---- */
.section-lead{text-align:center;max-width:640px;margin:0 auto 1rem}

/* ---- Vidéo ---- */
.video{max-width:900px;margin-inline:auto;aspect-ratio:16/9;border-radius:10px;overflow:hidden;box-shadow:var(--shadow);background:#000}
.video iframe{width:100%;height:100%;border:0;display:block}

/* ---- Galerie ---- */
.gallery{position:relative}
/* Planche contact : fond bleu nuit, vues en 3:2, numéros de vue, viseur au survol */












.lb-count{position:absolute;bottom:1.1rem;left:0;right:0;margin:0;text-align:center;font-family:var(--f-title);font-weight:600;font-size:.85rem;letter-spacing:.2em;font-variant-numeric:tabular-nums;color:#fff}
.lightbox{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100%;height:100%}
.lightbox::backdrop{background:rgba(1,30,43,.92)}
.lightbox-inner{display:grid;place-items:center;width:100%;height:100%;padding:3.5rem 4rem 4.6rem}
.lightbox img{max-width:100%;max-height:100%;object-fit:contain;border-radius:4px}
.lightbox .round{position:absolute;border-color:#fff;background:rgba(255,255,255,.12);color:#fff}
.lightbox .round:hover{background:#fff;color:var(--navy)}
.lb-close{top:1rem;right:1rem}.lb-prev{left:1rem;top:50%;translate:0 -50%}.lb-next{right:1rem;top:50%;translate:0 -50%}
@media (max-width:600px){.lightbox-inner{padding:4rem .5rem 4.6rem}.lb-prev{left:.4rem}.lb-next{right:.4rem}}

/* ---- Avis ---- */















/* ---- Carte ---- */
.map{height:clamp(300px,45vw,440px);background:var(--grey)}
.map iframe{width:100%;height:100%;border:0;display:block}

/* ---- Blocs de contenu (pages internes) ---- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,5vw,4rem);align-items:center}
.split+.split{margin-top:clamp(2.5rem,6vw,4.5rem)}
.split--rev .split-media{order:2}
@media (max-width:820px){.split{grid-template-columns:1fr}.split--rev .split-media{order:0}}
.framed{position:relative;margin:0;padding:14px}
.framed::before,.framed::after{content:"";position:absolute;width:64px;height:64px;background:var(--navy);z-index:0}
.framed::before{top:0;left:0}.framed::after{bottom:0;right:0}
.framed img{position:relative;z-index:1;width:100%}
.split-text h2,.split-text h3.big{text-align:left;font-size:clamp(1.9rem,1.2rem + 2vw,2.7rem);color:#a5b9c2}
.split-text h2{color:var(--navy)}
.checks{list-style:none;padding:0}
.checks li{position:relative;padding-left:1.5rem;margin-bottom:.35rem}
.checks li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--teal)}
.sub{font-family:var(--f-title);font-weight:700;color:var(--teal);text-transform:uppercase;margin:0 0 .3rem}
.note{font-size:.9em;font-style:italic}
.quote{position:relative;margin:clamp(2.5rem,6vw,4.5rem) 0;min-height:280px;display:grid;place-items:center;text-align:center;color:#fff;overflow:hidden;border-radius:6px}
.quote img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.quote::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(1,76,108,.82),rgba(2,133,156,.7))}
.quote p{position:relative;z-index:1;margin:0;padding:2rem;font-family:var(--f-display);font-style:italic;font-weight:400;font-size:clamp(1.6rem,1rem + 2.2vw,2.8rem);letter-spacing:-.015em}
.cols3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.4rem;margin-top:2rem}
.cols3 .card{text-align:left}
.cols3 h3{color:var(--teal)}
.cols3 ul{margin:0;padding-left:1.1em}
.cols3 li{margin-bottom:.4rem}

/* Marques */
.brand-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;list-style:none;margin:2rem 0 0;padding:0}
.brand-grid li{background:#fff;border:1px solid #e6eaee;border-radius:10px;aspect-ratio:1;display:grid;place-items:center;padding:.6rem;transition:transform .35s var(--ease),box-shadow .35s}
.brand-grid li:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.brand-grid img{max-height:100%;object-fit:contain}
.more{text-align:center;font-family:var(--f-title);font-weight:700;color:var(--teal);font-size:1.2rem;margin-top:2rem}

/* Verres */
.lens .split-text h3{font-size:1.6rem;color:var(--teal);margin-bottom:.2rem}
.lens .lead{font-family:var(--f-title);font-weight:600;color:var(--navy)}
.lens img.round-img{border-radius:6px}
.lens-intro{max-width:900px;margin-inline:auto;text-align:center}
.lens-intro h2{font-size:clamp(1.6rem,1.1rem + 1.6vw,2.4rem)}
.activisu{display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:center}
.activisu img.logo-act{width:min(300px,70%);margin-bottom:1rem}
.activisu .tower{max-height:420px;width:auto}
@media (max-width:760px){.activisu{grid-template-columns:1fr}.activisu .tower{margin-inline:auto;max-height:320px}}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(1.5rem,5vw,4rem)}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr}}
.form{display:grid;gap:1rem}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:560px){.form .row{grid-template-columns:1fr}}
.form label{display:block;font-weight:600;color:var(--navy);font-size:.9rem;margin-bottom:.25rem}
.form input,.form select,.form textarea{width:100%;font:inherit;color:#333;padding:.75rem .9rem;border:1.5px solid #cfd8de;border-radius:8px;background:#fff;transition:border-color .25s,box-shadow .25s}
.form input:focus,.form select:focus,.form textarea:focus{outline:0;border-color:var(--teal);box-shadow:0 0 0 3px rgba(2,133,156,.18)}
.form textarea{min-height:150px;resize:vertical}
.form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-note{font-size:.85rem}
.form-msg{padding:1rem 1.2rem;border-radius:8px;font-weight:600}
.form-msg--ok{background:#e7f6ee;color:#157351}
.form-msg--err{background:#fdecec;color:#a12626}
.info-box{background:var(--grey);border-radius:12px;padding:1.8rem}
.info-box h3{margin-bottom:.8rem}
.info-box .tel{font-size:1.3rem;font-weight:700}
.hours{margin:0 0 1rem}
.hours dt{font-weight:700;color:var(--navy);text-transform:uppercase;font-size:.9rem}
.hours dd{margin:0 0 .6rem}

/* Page Instagram */
.linkpage{min-height:100vh;display:grid;place-items:center;padding:2rem var(--gut);background:var(--grey)}
.linkpage-box{width:min(100%,520px);background:#fff;border-radius:18px;padding:2rem 1.6rem;text-align:center;box-shadow:var(--shadow)}
.linkpage-box .logo img{height:90px;margin:0 auto 1rem}
.linkpage-box .btn{width:100%;justify-content:center;margin-top:.7rem}
.linkpage-box address{font-style:normal;margin-top:1.6rem}

/* ---- Pied de page ---- */















/* ---- Animations d'apparition ---- */
.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .reveal{opacity:1;transform:none}
}

/* ==========================================================================
   Modernisation, lot 2 : cartes d'infos + trio de photos (17/10/2026)
   ========================================================================== */
/* Icônes qui se dessinent à l'apparition puis au survol */
.cards4 .card svg *{stroke-dasharray:1;stroke-dashoffset:0}
.js .cards4 .card:not(.is-in) svg *{stroke-dashoffset:1}
.js .cards4 .card.is-in svg *{animation:draw-in 1.2s var(--ease) .25s backwards}
.cards4 .card:hover svg *{animation:draw-hover 1s var(--ease) backwards}
@keyframes draw-in{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes draw-hover{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
/* Horaires : la plage du jour est mise en évidence */
.hrs{position:relative;margin:0 -.7rem .35rem;padding:.55rem .7rem;border-radius:10px;transition:background .4s,box-shadow .4s}
.hrs.is-today{background:rgba(2,133,156,.1);box-shadow:inset 3px 0 0 var(--teal)}
.hrs.is-today::after{content:"Aujourd’hui";display:block;margin-top:.3rem;font-family:var(--f-title);font-weight:700;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}

/* Trio : les photos se mettent « au point » en apparaissant */
@keyframes mise-au-point{from{filter:blur(16px);transform:scale(1.1)}to{filter:blur(0);transform:scale(1)}}

/* ---- Bandeaux de titre : mise au point à l'arrivée, filigrane qui glisse au scroll (lot 3) ---- */
.page-title .kicker{animation:fade-in .9s var(--ease) .1s backwards}
.page-title h1 span{animation:rack 1.3s var(--ease) backwards}
.page-title h1 span:nth-child(1){animation-delay:.15s}
.page-title h1 span:nth-child(2){animation-delay:.33s}
@keyframes rack{from{opacity:0;filter:blur(14px);letter-spacing:.1em;transform:translateY(10px)}to{opacity:1;filter:blur(0);letter-spacing:0;transform:none}}
@keyframes fade-in{from{opacity:0}to{opacity:.85}}


/* ==========================================================================
   Lot 6 : marques, avis, pied de page (17/10/2026)
   ========================================================================== */
/* Marques : au survol, un logo « prend la mise au point », les autres se défocalisent */
.js .brand-grid li.reveal{transition:opacity .55s var(--ease),filter .55s var(--ease),transform .5s var(--ease),box-shadow .35s}
@media (hover:hover){
  .js .brand-grid:hover li.is-in{opacity:.38;filter:blur(.7px) saturate(.6)}
  .js .brand-grid li.is-in:hover{opacity:1;filter:none}
}
/* Avis : défilement lent, en pause au survol / au focus / sur demande */












/* Pied de page : plus aéré, horaires du jour, lunettes en filigrane */









/* ==========================================================================
   Lot 7 (v2, compacte) : section « informations » en une seule barre à 4 colonnes (17/10/2026)
   ========================================================================== */
.infos{padding-block:clamp(1.5rem,3vw,2.5rem)}
.infobar{display:grid;grid-template-columns:1.05fr 1.5fr 1.05fr 1fr;background:#fff;border:1px solid rgba(1,76,108,.1);border-radius:16px;box-shadow:0 10px 28px -20px rgba(1,76,108,.35);overflow:hidden}
.ib{padding:1.4rem 1.5rem 1.5rem;font-size:.93rem;line-height:1.55}
.ib+.ib{border-left:1px solid rgba(1,76,108,.1)}
.ib p{margin:0 0 .3rem}
.ib-h{display:flex;align-items:center;gap:.55rem;margin:0 0 .85rem;font-family:var(--f-title);font-weight:700;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.ib-h .ic{width:18px;height:18px;flex:none}
.ib a{color:var(--navy);font-weight:600}
.ib a:hover{color:var(--teal)}
.ib address{font-style:normal;color:var(--navy);font-weight:600;margin-bottom:.6rem}
.parking{display:flex;align-items:center;gap:.5rem}
.p-badge{display:grid;place-items:center;width:1.35rem;height:1.35rem;border-radius:5px;background:var(--navy);color:#fff;font:800 .75rem/1 var(--f-title)}
.ib-links{display:flex;flex-wrap:wrap;gap:.2rem 1rem;margin-top:.7rem!important}
.ib-links a,.soc{display:inline-flex;align-items:center;gap:.3rem;font-size:.85rem}
.ib-links .go{width:13px;height:13px;transition:transform .3s var(--ease)}
.ib-links a:hover .go{transform:translate(2px,-2px)}
.ib .tel{font-weight:700;color:var(--navy);white-space:nowrap}
.soc{gap:.55rem;font-size:.93rem}
.soc .ic{width:18px;height:18px;color:var(--teal)}
/* icônes dessinées à l'apparition */
.infobar svg *{stroke-dasharray:1;stroke-dashoffset:0}
.infobar .go *{stroke-dasharray:none}
.js .infobar:not(.is-in) svg.ic *{stroke-dashoffset:1}
.js .infobar.is-in svg.ic *{animation:draw-in 1.1s var(--ease) .25s backwards}
/* horaires : statut + frise fine */
.ib .status{display:inline-flex;margin-bottom:.7rem}
.ib .status .st-main{font-size:.66rem}
.ib .status .st-sub{font-size:.8rem}
.hrs--row{margin:0 -.6rem .25rem;padding:.5rem .6rem .6rem}
.hrs--row .lab{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:0 .8rem;margin:0 0 .4rem;font-size:.88rem;line-height:1.4}
.hrs--row .lab strong{color:var(--navy)}
.axis{position:relative;height:5px;border-radius:99px;background:rgba(1,76,108,.1)}
.axis .seg{position:absolute;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,var(--teal),var(--navy));transform-origin:left;transition:transform 1s var(--ease)}
.axis .seg.a{left:8.7%;width:30.43%}
.axis .seg.b{left:56.52%;width:39.13%}
.axis .seg.b.sat{width:30.43%}
.js .infobar:not(.is-in) .axis .seg{transform:scaleX(0)}
.js .infobar.is-in .axis .seg.b{transition-delay:.25s}
.axis .now{position:absolute;top:50%;left:var(--now,-10%);width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#fff;border:2.5px solid var(--teal);opacity:0;transition:left .8s var(--ease)}
.hrs--row.is-today .axis .now{opacity:1;animation:ping-ring 2.4s ease-out infinite}
.hrs--row.is-today .axis .now.is-off{opacity:0}
.hrs--row.is-today::after{margin-top:.3rem;font-size:.58rem}
@keyframes ping-ring{0%{box-shadow:0 0 0 0 rgba(2,133,156,.45)}80%,100%{box-shadow:0 0 0 9px rgba(2,133,156,0)}}
@media (max-width:1100px){.infobar{grid-template-columns:1fr 1fr}.ib:nth-child(3){border-left:0}.ib:nth-child(n+3){border-top:1px solid rgba(1,76,108,.1)}}
@media (max-width:620px){.infobar{grid-template-columns:1fr}.ib+.ib{border-left:0;border-top:1px solid rgba(1,76,108,.1)}}

/* Lot 7 (v3) : finitions de la barre d'informations */
.infobar{position:relative}
.infobar::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;z-index:1;background:linear-gradient(90deg,var(--teal),var(--navy));transform-origin:left;transition:transform 1.3s var(--ease) .1s}
.js .infobar:not(.is-in)::before{transform:scaleX(0)}
.ib{padding:1.6rem 1.6rem 1.55rem}
.ib-hours{background:linear-gradient(180deg,rgba(2,133,156,.055),rgba(2,133,156,0) 70%)}
.ib-h{margin-bottom:1rem}
.ib-h .ic{box-sizing:content-box;width:16px;height:16px;padding:6px;border-radius:50%;background:rgba(2,133,156,.1)}
.ib-addr address{font-size:1.02rem;line-height:1.45}
.ib-links{gap:.5rem .9rem;margin-top:.9rem!important;align-items:center}
.ib-links a:first-child{padding:.45rem .8rem;border-radius:999px;background:var(--navy);color:#fff;font-weight:700;font-size:.78rem;letter-spacing:.03em;transition:background .3s}
.ib-links a:first-child:hover{background:var(--teal);color:#fff}
.ib-links a:last-child{font-size:.82rem;font-weight:600;color:var(--txt);border-bottom:1px solid rgba(1,76,108,.25);padding-bottom:1px}
.ib-links a:last-child:hover{color:var(--teal);border-color:var(--teal)}
.ib .status{margin-bottom:.9rem}
.ib-contact .line{display:flex;align-items:center;flex-wrap:wrap;gap:.35rem;margin-bottom:.55rem}
.ib .tel{font-size:1.05rem;letter-spacing:.01em}
.copy{position:relative;display:inline-grid;place-items:center;width:26px;height:26px;padding:0;border:1px solid rgba(1,76,108,.18);border-radius:8px;background:#fff;color:var(--teal);cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.copy svg{grid-area:1/1;width:14px;height:14px;transition:opacity .2s,transform .3s var(--ease)}
.copy .i-ok{opacity:0;transform:scale(.4)}
.copy:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.copy.is-done{background:#1fa971;border-color:#1fa971;color:#fff}
.copy.is-done .i-copy{opacity:0;transform:scale(.4)}
.copy.is-done .i-ok{opacity:1;transform:none}
.ib-social .soc{display:flex;align-items:center;gap:.7rem;padding:.4rem 0;font-weight:600}
.ib-social .soc .ic{box-sizing:content-box;width:16px;height:16px;padding:7px;border-radius:50%;background:rgba(2,133,156,.1);transition:background .3s,color .3s}
.ib-social .soc:hover .ic{background:var(--teal);color:#fff}
.ib-social p{margin:0}
.ib-contact .line--mail{display:block}
.ib-contact .line--mail a{margin-right:.4rem;overflow-wrap:anywhere}
.ib-contact .line--mail .copy{vertical-align:middle}

/* Réseaux sociaux : deux icônes seules sous le titre */
.soc-icons{display:flex;gap:.7rem;margin-top:.2rem}
.soc-ico{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:1.5px solid rgba(1,76,108,.2);background:#fff;color:var(--teal);transition:background .3s,color .3s,border-color .3s,transform .35s var(--ease)}
.soc-ico .ic--lg{box-sizing:border-box;width:24px;height:24px;padding:0;background:none;border-radius:0}
.soc-ico:hover{background:var(--navy);border-color:var(--navy);color:#fff;transform:translateY(-3px)}
.ib-contact .line--mail a{font-size:.88rem;margin-right:.3rem}
.ib-contact .line--mail{white-space:nowrap}
@media (max-width:1100px){.ib-contact .line--mail a{font-size:.93rem}}
.soc-icons{justify-content:center}

/* ==========================================================================
   Lot 8 : bande « prise de rendez-vous » (compacte) (17/10/2026)
   ========================================================================== */
.rdv-sec{padding-block:clamp(2rem,4.5vw,3.4rem)}
.rdv-band{position:relative;overflow:hidden;isolation:isolate;display:flex;align-items:center;justify-content:space-between;gap:1.4rem 2.5rem;flex-wrap:wrap;padding:clamp(1.3rem,2.6vw,1.9rem) clamp(1.4rem,3vw,2.4rem);border-radius:18px;color:#fff;background:radial-gradient(circle at 100% 100%,#01859c 0%,#014c6c 62%)}
.rdv-band::before,.rdv-band::after{content:"";position:absolute;z-index:-1;aspect-ratio:1;width:230px;border-radius:50%;border:1px solid rgba(255,255,255,.12);top:50%;translate:0 -50%;pointer-events:none}
.rdv-band::before{right:150px}
.rdv-band::after{right:-30px}
.rdv-text{max-width:46ch}
.rdv-text h3{margin:0 0 .35rem;font-family:var(--f-display);font-weight:450;font-size:clamp(1.45rem,1.1rem + 1vw,2rem);letter-spacing:-.015em;color:#fff;line-height:1.1}
.rdv-text p{margin:0;font-size:.95rem;color:rgba(255,255,255,.86)}
.rdv-text strong{color:#fff}
.rdv-actions{display:flex;flex-wrap:wrap;gap:.7rem}
.rdv-call,.rdv-mail{display:inline-flex;align-items:center;gap:.65rem;height:46px;padding:0 1.15rem;border-radius:999px;font:700 .8rem/1 var(--f-title);letter-spacing:.08em;text-transform:uppercase;transition:background .3s,color .3s,border-color .3s,transform .35s var(--ease)}
.rdv-call .ic,.rdv-mail .ic{width:18px;height:18px;flex:none}
.rdv-call{position:relative;background:#fff;color:var(--navy);min-width:218px}
.rdv-call:hover{background:#e8f7fa;color:var(--navy);transform:translateY(-2px)}
.rdv-mail{border:1.5px solid rgba(255,255,255,.7);color:#fff}
.rdv-mail:hover{background:#fff;color:var(--navy);transform:translateY(-2px)}
.rdv-mail .go{width:15px;height:15px;transition:transform .35s var(--ease)}
.rdv-mail:hover .go{transform:translateX(4px)}
/* le libellé « Par téléphone » roule vers le numéro au survol */
.roll{position:relative;display:grid;height:1.1em;overflow:hidden;line-height:1.1}
.roll>span{grid-area:1/1;transition:transform .45s var(--ease),opacity .35s}
.roll .num{transform:translateY(110%);opacity:0;letter-spacing:.04em}
@media (hover:hover){
  .rdv-call:hover .lab{transform:translateY(-110%);opacity:0}
  .rdv-call:hover .num{transform:none;opacity:1}
}
/* point d'état (ouvert / fermé) sur le bouton */
.live{width:8px;height:8px;border-radius:50%;background:#9aa7ad;margin-left:auto;flex:none}
html[data-shop="open"] .live{background:#1fa971;animation:ping-ring-g 2.2s ease-out infinite}
html[data-shop="soon"] .live{background:#e8a317}
@keyframes ping-ring-g{0%{box-shadow:0 0 0 0 rgba(31,169,113,.5)}80%,100%{box-shadow:0 0 0 8px rgba(31,169,113,0)}}
@media (max-width:700px){
  .rdv-band::before{display:none}
  .rdv-actions{width:100%}
  .rdv-call,.rdv-mail{flex:1 1 100%;justify-content:center}
  .rdv-call .live{margin-left:.2rem}
}

/* Rythme des fonds (17/10/2026) : page blanche d'un seul tenant ; une seule zone teintée (les avis), dont le haut se fond en douceur */


/* ==========================================================================
   Lot 9 (v2) : trois photos en colonnes décalées, légendes sous l'image (17/10/2026)
   ========================================================================== */
.tcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2.6vw,2rem);align-items:start}
.tcard{margin:0}
.tcard .pic{position:relative;aspect-ratio:3/2;border-radius:16px;overflow:hidden;background:#dfe7ec;isolation:isolate}
.tcard .px{position:absolute;inset:-6% 0}
.tcard img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.tcard:hover img{transform:scale(1.05)}
/* coins de viseur au survol (même repère que la galerie) */
.tcard .pic::after{content:"";position:absolute;inset:14px;z-index:2;opacity:0;transform:scale(1.06);transition:opacity .4s,transform .6s var(--ease);pointer-events:none;background:
 linear-gradient(#fff,#fff) 0 0/20px 2px no-repeat,linear-gradient(#fff,#fff) 0 0/2px 20px no-repeat,
 linear-gradient(#fff,#fff) 100% 0/20px 2px no-repeat,linear-gradient(#fff,#fff) 100% 0/2px 20px no-repeat,
 linear-gradient(#fff,#fff) 0 100%/20px 2px no-repeat,linear-gradient(#fff,#fff) 0 100%/2px 20px no-repeat,
 linear-gradient(#fff,#fff) 100% 100%/20px 2px no-repeat,linear-gradient(#fff,#fff) 100% 100%/2px 20px no-repeat;filter:drop-shadow(0 0 3px rgba(1,38,56,.45))}
@media (hover:hover){.tcard:hover .pic::after{opacity:.95;transform:none}}
/* légende sous la photo : numéro en italique + titre, trait qui se trace au survol */
.tcard figcaption{display:flex;align-items:baseline;gap:.9rem;margin-top:1rem;padding-bottom:.9rem;position:relative}
.tcard figcaption::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(1,76,108,.18)}
.tcard figcaption::before{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:linear-gradient(90deg,var(--teal),var(--navy));transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease);z-index:1}
.tcard:hover figcaption::before{transform:scaleX(1)}
.tcard .n{font-family:var(--f-display);font-style:italic;font-size:1.15rem;color:var(--teal);min-width:1.7rem}
.tcard h3{margin:0;font-family:var(--f-display);font-weight:450;font-size:clamp(1.15rem,1rem + .6vw,1.45rem);letter-spacing:-.01em;color:var(--navy);line-height:1.15}
.tcard p{margin:.2rem 0 0;font-size:.9rem}
/* ouverture « en iris » à l'apparition (comme le slider), puis mise au point de la photo */
.js .tcard:not(.is-in) .pic{clip-path:circle(0% at 50% 50%)}
.js .tcard.is-in .pic{clip-path:circle(75% at 50% 50%);transition:clip-path 1.4s cubic-bezier(.7,0,.2,1) var(--d,0s)}
.js .tcard.is-in img{animation:mise-au-point 1.5s var(--ease) var(--d,0s) backwards}
.tcard:nth-child(2){--d:.15s}.tcard:nth-child(3){--d:.3s}
/* légère profondeur au défilement (navigateurs compatibles uniquement) */
@supports (animation-timeline: view()){
  .tcard .px{animation:tparallax linear both;animation-timeline:view();animation-range:entry 0% exit 100%}
}
@keyframes tparallax{from{transform:translateY(-4.5%)}to{transform:translateY(4.5%)}}
@media (max-width:760px){
  .tcards{grid-template-columns:1fr;max-width:520px;margin-inline:auto}
  .tcard .pic{aspect-ratio:4/3}
}

/* titres sur les photos, comme en V1 (étiquette centrée sur fond blanc translucide) */
.tcard .lab{position:absolute;z-index:3;left:50%;top:50%;translate:-50% -50%;padding:.75rem 1.4rem;background:rgba(255,255,255,.66);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.7);color:var(--navy);font:700 clamp(.78rem,.72rem + .3vw,.95rem)/1 var(--f-title);letter-spacing:.22em;text-transform:uppercase;white-space:nowrap;transition:opacity .45s var(--ease),transform .6s var(--ease)}
@media (hover:hover){.tcard:hover .lab{opacity:0;transform:scale(.94)}}

/* ==========================================================================
   Lot 11 : équipe — portraits animés + visionneuse (17/10/2026)
   ========================================================================== */
.team{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,3.5vw,2.8rem);max-width:760px;margin:2.2rem auto 0}
.member{text-align:center}
.m-btn{position:relative;display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;border-radius:50%;color:var(--teal)}
.m-pic{position:relative;display:block;aspect-ratio:1;border-radius:50%;overflow:hidden;background:#dfe7ec;box-shadow:0 18px 36px -20px rgba(1,76,108,.5)}
.m-pic img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}

/* anneau fin autour du portrait : se trace à l'apparition ; au survol un point en fait le tour (comme une mise au point) */
.m-ring{position:absolute;inset:-9px;width:calc(100% + 18px);height:calc(100% + 18px);transform:rotate(-90deg);pointer-events:none;overflow:visible}
.m-ring .rg{fill:none;stroke:currentColor;stroke-width:1;stroke-dasharray:1;stroke-dashoffset:0;opacity:.55;transition:opacity .4s,stroke-width .4s}
.m-ring .dot{fill:var(--navy);opacity:0;transition:opacity .3s}
.m-btn:hover .m-ring .rg,.m-btn:focus-visible .m-ring .rg{opacity:1;stroke-width:1.6}
.m-btn:hover .m-ring,.m-btn:focus-visible .m-ring{animation:ring-orbit 5s linear infinite}
.m-btn:hover .m-ring .dot,.m-btn:focus-visible .m-ring .dot{opacity:1}
@keyframes ring-orbit{to{transform:rotate(270deg)}}
/* reflet de lumière qui traverse le portrait au survol */
.m-glint{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:50%}
.m-glint::after{content:"";position:absolute;top:-20%;bottom:-20%;left:-60%;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg);opacity:0}
.m-btn:hover .m-glint::after,.m-btn:focus-visible .m-glint::after{animation:m-glint 1.1s var(--ease) 1}
@keyframes m-glint{0%{opacity:0;transform:translateX(0) skewX(-18deg)}15%{opacity:1}100%{opacity:0;transform:translateX(520%) skewX(-18deg)}}
/* petite loupe qui monte au survol (toujours visible sur tactile) */
.m-zoom{position:absolute;right:1%;bottom:3%;display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:50%;background:var(--navy);color:#fff;border:2px solid #fff;opacity:0;transform:translateY(8px) scale(.7);transition:opacity .35s,transform .5s var(--ease)}
.m-zoom svg{width:55%;height:55%}
.m-btn:hover .m-zoom,.m-btn:focus-visible .m-zoom{opacity:1;transform:none}
@media (hover:none){.m-zoom{opacity:.95;transform:none;width:2.1rem;height:2.1rem}}
/* nom : trait qui se trace sous le prénom au survol */
.m-name{margin:1.1rem 0 0}
.m-name span{position:relative;display:inline-block;font-family:var(--f-display);font-weight:450;font-size:clamp(1.15rem,1rem + .6vw,1.45rem);letter-spacing:-.01em;color:var(--navy);padding-bottom:.25rem}
.m-name span::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,var(--teal),var(--navy));transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.member:hover .m-name span::after,.member:focus-within .m-name span::after{transform:scaleX(1)}
/* apparition : ouverture en iris + mise au point, anneau qui se trace ; décalé d'un portrait à l'autre */
.js .member:not(.is-in) .m-pic{clip-path:circle(0% at 50% 50%)}
.js .member.is-in .m-pic{clip-path:circle(75% at 50% 50%);transition:clip-path 1.3s cubic-bezier(.7,0,.2,1) var(--d,0s)}
.js .member.is-in .m-pic img{animation:mise-au-point 1.4s var(--ease) var(--d,0s) backwards}
.js .member:not(.is-in) .m-ring .rg{stroke-dashoffset:1}
.js .member.is-in .m-ring .rg{animation:draw-in 1.6s var(--ease) calc(var(--d,0s) + .3s) backwards}
.member:nth-child(2){--d:.15s}.member:nth-child(3){--d:.3s}
/* visionneuse de l'équipe (portrait entier, en rectangle) */
.lightbox--team .lightbox-inner{padding:3rem 4rem 4.8rem}
.tb-fig{margin:0;display:grid;gap:1rem;justify-items:center;max-height:100%;min-height:0}
.tb-fig img{width:auto;height:auto;max-width:min(100%,620px);max-height:calc(100vh - 12.5rem);border-radius:14px;object-fit:contain;box-shadow:0 34px 70px -24px rgba(0,0,0,.65);border:6px solid #fff}
.tb-fig figcaption{text-align:center;color:#fff}
.tb-name{display:block;font-family:var(--f-display);font-weight:450;font-size:clamp(1.5rem,1.2rem + 1vw,2rem);letter-spacing:-.015em;line-height:1.1}
.tb-role{display:block;margin-top:.3rem;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;opacity:.75}
.tb-fig.swap-next{animation:tb-next .55s var(--ease)}
.tb-fig.swap-prev{animation:tb-prev .55s var(--ease)}
@keyframes tb-next{from{opacity:0;transform:translateX(34px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes tb-prev{from{opacity:0;transform:translateX(-34px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@media (max-width:600px){.lightbox--team .lightbox-inner{padding:3.5rem .6rem 4.8rem}.tb-fig img{max-height:calc(100vh - 14rem)}.team{gap:.8rem}}
.m-pic{box-shadow:none}
.m-btn{filter:drop-shadow(0 14px 16px rgba(1,76,108,.22))}

/* Netteté au repos (18/10/2026) : une fois l'animation d'apparition terminée, plus de clip-path ni d'animation sur les photos,
   et plus de filtre CSS sur le bouton (l'ombre passe par un pseudo-élément) -> rendu net sans survol. */
.m-btn{filter:none;isolation:isolate}
.m-btn::before{content:"";position:absolute;z-index:-1;left:10%;right:10%;bottom:-5%;height:16%;border-radius:50%;background:radial-gradient(ellipse at center,rgba(1,76,108,.32),transparent 70%);filter:blur(7px)}
.js .member.is-in.is-settled .m-pic,.js .tcard.is-in.is-settled .pic{clip-path:none;transition:none}
.js .member.is-in.is-settled .m-pic img,.js .tcard.is-in.is-settled img{animation:none}

/* ==========================================================================
   Lot 12 : vidéo hébergée (aperçu + icône lecture, la vidéo ne se charge qu'au clic) (18/10/2026)
   ========================================================================== */
.vplayer{position:relative;max-width:900px;margin:0 auto;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#0b3a53;box-shadow:0 26px 54px -28px rgba(1,76,108,.6)}
.v-facade{position:absolute;inset:0;display:block;cursor:pointer}
.v-facade img{width:100%;height:100%;object-fit:cover;transition:transform 1.6s var(--ease)}
.v-facade::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(circle at 50% 50%,rgba(1,38,56,.0) 0,rgba(1,38,56,.28) 100%),linear-gradient(to top,rgba(1,38,56,.5),transparent 50%);pointer-events:none}
.v-play{position:absolute;z-index:2;left:50%;top:50%;translate:-50% -50%;display:grid;place-items:center;width:clamp(70px,9vw,96px);aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.95);color:var(--navy);box-shadow:0 14px 34px -10px rgba(1,38,56,.6);transition:transform .5s var(--ease),background .3s}
.v-play .tri{width:36%;margin-left:7%}
.v-play::before,.v-play::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(255,255,255,.75);animation:v-ping 2.8s ease-out infinite}
.v-play::after{animation-delay:1.4s}
@keyframes v-ping{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.75);opacity:0}}
.v-badge{position:absolute;z-index:2;left:1rem;bottom:1rem;display:inline-flex;align-items:center;gap:.55rem;padding:.5rem .9rem .5rem .7rem;border-radius:999px;background:rgba(1,38,56,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.28);color:#fff;font:700 .74rem/1 var(--f-title);letter-spacing:.12em;text-transform:uppercase}
.v-badge svg{width:17px;height:17px}
.v-facade:hover img,.v-facade:focus-visible img{transform:scale(1.045)}
.v-facade:hover .v-play,.v-facade:focus-visible .v-play{transform:scale(1.09);background:#fff}
.vplayer video{position:absolute;inset:0;width:100%;height:100%;background:#000;object-fit:contain}

/* Galerie (18/10/2026) : photos en couleur et nettes dès le départ (plus de noir et blanc), sans recadrage forcé :
   colonnes à hauteurs libres, chaque photo garde ses proportions */







/* ==========================================================================
   Galerie (v3) : mosaïque compacte de 5 photos + « Voir les 16 photos » (18/10/2026)
   ========================================================================== */





/* au survol, la photo visée « prend la mise au point » : les autres s'estompent (opacité seulement : pas de filtre sur les photos) */

/* coins de viseur */









/* ==========================================================================
   Galerie (v4) : scène + bandeau de vignettes ; visionneuse corrigée (18/10/2026)
   ========================================================================== */
/* Visionneuse : la photo ENTIÈRE est toujours visible (centrée dans la fenêtre, jamais rognée) */
.lightbox-inner{position:relative}
.lightbox-inner>img{position:absolute;inset:3.4rem 4.6rem 4.8rem;margin:auto;width:auto;height:auto;max-width:calc(100% - 9.2rem);max-height:calc(100% - 8.2rem);object-fit:contain;border-radius:6px}
@media (max-width:600px){.lightbox-inner>img{inset:3.4rem .5rem 4.6rem;max-width:calc(100% - 1rem);max-height:calc(100% - 8rem)}}
/* Scène : la photo entière sur un fond « ambiant » (version floutée de la même photo) */

























/* ==========================================================================
   Galerie de l'accueil : pellicule plein écran (18/10/2026)
   ========================================================================== */
/* ---- A : pellicule plein écran (défilement horizontal, photos à leurs proportions) ---- */
.gxa-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.1rem}
.gxa-head .gx-tag{margin:0}
.gxa-ctrl{display:flex;align-items:center;gap:.6rem}
.gxa-bar{width:130px;height:3px;margin-right:.7rem;border-radius:2px;background:rgba(1,76,108,.15);overflow:hidden}
.gxa-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--navy));transform-origin:left;transform:scaleX(var(--p,.1))}
.gxa .round{width:42px;height:42px}
.gxa-track{--h:clamp(300px,40vw,520px);display:flex;gap:clamp(10px,1.4vw,16px);overflow-x:auto;scroll-snap-type:x proximity;padding:.4rem max(var(--gut),calc((100vw - 1180px) / 2)) 1.2rem;scroll-padding-inline:max(var(--gut),calc((100vw - 1180px) / 2));scrollbar-width:none;cursor:grab;outline:0}
.gxa-track::-webkit-scrollbar{display:none}
.gxa-track.is-drag{cursor:grabbing;scroll-snap-type:none}
.gxa-item{flex:0 0 auto;height:var(--h);padding:0;border:0;border-radius:14px;overflow:hidden;background:#dfe7ec;scroll-snap-align:start;cursor:inherit;transition:opacity .4s}
.gxa-item img{display:block;height:100%;width:auto;transition:transform 1.3s var(--ease);-webkit-user-drag:none;user-select:none}
.gxa-item:hover img{transform:scale(1.035)}
@media (hover:hover){.gxa-track:hover .gxa-item:not(:hover){opacity:.72}}
@supports (animation-timeline: view(inline)){
  .gxa-item{animation:gxa-in linear backwards;animation-timeline:view(inline);animation-range:entry 0% entry 90%}
}
@keyframes gxa-in{from{opacity:.3;transform:scale(.93)}to{opacity:1;transform:none}}

.gal-sec{padding-bottom:clamp(2rem,5vw,4rem)}
.gxa-head{justify-content:flex-end}

/* Pellicule (v2) : défilement continu, commandes sous la galerie (18/10/2026) */
.gxa-track.is-auto{scroll-snap-type:none;cursor:default}
.gxa-dock{display:flex;justify-content:center;margin-top:.4rem}
.gxa-nav{display:inline-flex;align-items:center;gap:.65rem;padding:.3rem;border-radius:999px;background:#fff;border:1px solid rgba(1,76,108,.12);box-shadow:0 14px 30px -18px rgba(1,76,108,.5)}
.gxa-nav button{display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:var(--navy);color:#fff;cursor:pointer;transition:background .3s,transform .35s var(--ease),box-shadow .3s}
.gxa-nav button svg{width:16px;height:16px}
.gxa-nav button:hover{background:var(--teal);transform:scale(1.07)}
.gxa-nav .gxa-prev:hover{transform:translateX(-2px) scale(1.07)}
.gxa-nav .gxa-next:hover{transform:translateX(2px) scale(1.07)}
.gxa-nav .gxa-bar{width:clamp(70px,11vw,115px);margin:0}
.gxa-sep{width:1px;height:26px;background:rgba(1,76,108,.16)}
.gxa-nav .gxa-play{background:transparent;color:var(--navy);box-shadow:inset 0 0 0 1.5px rgba(1,76,108,.3)}
.gxa-nav .gxa-play:hover{background:var(--navy);color:#fff}
.gxa-play svg{width:13px;height:13px}
.gxa-play .i-play{display:none}
.gxa-play[aria-pressed="true"] .i-play{display:block}
.gxa-play[aria-pressed="true"] .i-pause{display:none}
@media (max-width:700px){.gxa-nav{gap:.6rem}.gxa-nav button{width:32px;height:32px}}

/* ==========================================================================
   Avis Google (v2) : colonne d'infos + « mur » d'avis qui défile à la verticale (18/10/2026)
   ========================================================================== */
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.avis-sec{background:linear-gradient(180deg,#fff 0,var(--grey) 110px,var(--grey) 100%);padding-top:clamp(3.5rem,7vw,6rem)}
.avis-head{text-align:left}
.avis-head .eyebrow{display:flex;align-items:center;gap:.9rem;margin:0 0 1.1rem;font-family:var(--f-title);font-weight:700;font-size:.76rem;letter-spacing:.24em;text-transform:uppercase;color:var(--teal)}
.avis-head .eyebrow::before{content:"";width:2.6rem;height:2px;background:var(--teal)}
.avis-head h2{text-align:left;font-size:clamp(2rem,1.2rem + 2.8vw,3.3rem);margin-bottom:1.1rem}
.avis-head>p{max-width:46ch}
/* note : 5/5 + Google, le nombre d'avis en petit dessous */
.score{display:inline-flex;align-items:center;gap:1.2rem;margin:1.6rem 0;padding:1.1rem 1.7rem;background:#fff;border-radius:20px;border:1px solid rgba(1,76,108,.1);box-shadow:0 18px 40px -26px rgba(1,76,108,.5);text-align:left}
.score>.g{width:38px;height:38px;flex:none}
.score-note{display:flex;align-items:baseline;font-family:var(--f-display);color:var(--navy);line-height:.9;padding-right:1.2rem;border-right:1px solid rgba(1,76,108,.15)}
.score-note strong{font-weight:450;font-size:clamp(3.4rem,2.6rem + 3vw,4.4rem);letter-spacing:-.03em}
.score-note span{font-size:1.6rem;color:var(--teal);margin-left:.1rem}
.score-r{display:flex;flex-direction:column;gap:.4rem}
.score-w{font:800 1rem/1 var(--f-title);letter-spacing:.2em;color:var(--navy)}
.rv-stars{display:inline-block;color:#fbbc04;font-size:1.2rem;letter-spacing:.14em;line-height:1}
.rv-stars::before{content:"★★★★★"}
.score-sub{font-size:.9rem;color:var(--text)}
.score-sub b{color:var(--navy)}
/* mosaïque fixe : tous les avis visibles, aucun mouvement */
.avis-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}
.rv-grid{columns:2;column-gap:1.1rem}
.rv-grid .rv{break-inside:avoid;margin:0 0 1.1rem}
.rv-grid.is-in .rv{animation:rv-in .8s var(--ease) both}
.rv-grid.is-in .rv:nth-child(2){animation-delay:.1s}.rv-grid.is-in .rv:nth-child(3){animation-delay:.2s}.rv-grid.is-in .rv:nth-child(4){animation-delay:.3s}.rv-grid.is-in .rv:nth-child(5){animation-delay:.4s}.rv-grid.is-in .rv:nth-child(6){animation-delay:.5s}.rv-grid.is-in .rv:nth-child(7){animation-delay:.6s}
@keyframes rv-in{from{opacity:0;transform:translateY(18px)}}
@media (max-width:900px){
  .avis-grid{grid-template-columns:1fr}
  .rv-grid{columns:auto;display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-1.5rem;padding:.3rem 1.5rem 1rem}
  .rv-grid .rv{flex:none;width:min(82vw,330px);margin:0;scroll-snap-align:center}
}
.avis-cta{display:flex;flex-wrap:wrap;align-items:center;gap:.9rem 1.4rem}
.btn-avis{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 1.5rem;border-radius:999px;background:var(--navy);color:#fff;font:700 .85rem/1 var(--f-title);letter-spacing:.07em;text-transform:uppercase;box-shadow:0 14px 28px -14px rgba(1,76,108,.7);transition:background .3s,transform .35s var(--ease)}
.btn-avis svg{width:18px;height:18px;color:#fbbc04;fill:#fbbc04}
.btn-avis:hover{background:var(--teal);color:#fff;transform:translateY(-2px)}
.link-avis{display:inline-flex;align-items:center;gap:.35rem;font-weight:700;font-size:.9rem;color:var(--navy);border-bottom:1.5px solid rgba(1,76,108,.35);padding-bottom:2px}
.link-avis svg{width:14px;height:14px;transition:transform .3s var(--ease)}
.link-avis:hover{color:var(--teal);border-color:var(--teal)}
.link-avis:hover svg{transform:translate(2px,-2px)}
@media (max-width:560px){.score{flex-wrap:wrap;justify-content:center;gap:.8rem 1rem;padding:1rem 1.2rem}.score-note{padding-right:1rem}}
.rv{margin:0;padding:1.2rem 1.25rem 1.3rem;background:#fff;border-radius:16px;border:1px solid rgba(1,76,108,.08);box-shadow:0 10px 26px -20px rgba(1,76,108,.45)}
.rv header{display:flex;align-items:center;gap:.75rem;margin-bottom:.6rem}
.rv header div{flex:1;min-width:0;line-height:1.25}
.rv header b{display:block;color:var(--navy);font-size:.96rem;overflow-wrap:anywhere}
.rv header small{color:#7c8b93;font-size:.78rem}
.rv .g{width:20px;height:20px;flex:none}
.rv .rv-stars{font-size:.95rem;margin-bottom:.55rem}
.rv p{margin:0;font-size:.93rem;line-height:1.6}
.avatar{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;flex:none;color:#fff;font:700 1rem/1 var(--f-title)}
.a1{background:#02859c}.a2{background:#014c6c}.a3{background:#3a8f8a}.a4{background:#5d7fa3}.a5{background:#0f6a82}

/* ==========================================================================
   Pied de page (v2) : bande rendez-vous, 4 colonnes, nom en filigrane, bande du bas (18/10/2026)
   ========================================================================== */

.site-footer .wrap{position:relative;z-index:1}
.site-footer a{color:#fff;transition:color .25s}
.site-footer a:hover{color:#9fe3ee}
.site-footer p{margin:0 0 .35rem;font-size:.95rem;color:rgba(255,255,255,.86)}









.ft-brand img{width:clamp(190px,18vw,240px);height:auto;margin-bottom:1.2rem}


.site-footer h3{margin:0 0 1rem;font:700 .72rem/1 var(--f-title);letter-spacing:.22em;text-transform:uppercase;color:#9fe3ee}
.site-footer h3.ft-sub{margin-top:1.6rem}
.ft-nav ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.ft-nav a{display:inline-block;font-family:var(--f-display);font-size:1.15rem;transition:transform .3s var(--ease),color .25s}
.ft-nav a:hover{transform:translateX(5px)}
.site-footer .hrs{margin:0 -.8rem .5rem;padding:.55rem .8rem}
.site-footer .hrs.is-today{background:rgba(255,255,255,.09);box-shadow:inset 3px 0 0 #9fe3ee}
.site-footer .hrs.is-today::after{color:#9fe3ee}
.social-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.social-list a{display:inline-flex;align-items:center;gap:.55rem;padding:.55rem 1rem .55rem .8rem;border:1px solid rgba(255,255,255,.28);border-radius:999px;font-weight:600;font-size:.9rem;transition:background .3s,color .3s,transform .3s var(--ease)}
.social-list svg{width:20px;height:20px}
.social-list a:hover{background:#fff;color:var(--navy);transform:translateY(-2px)}










/* pied de page v3 (18/10/2026) : plus sobre, sans bande téléphone ni filigrane ; bande du bas foncée */
.site-footer{position:relative;overflow:hidden;color:#fff;background:radial-gradient(800px 460px at 92% 0,rgba(2,133,156,.4),transparent 62%),linear-gradient(180deg,#014c6c,#013d57)}
.site-footer::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,var(--teal),#9fe3ee 50%,var(--teal))}
.ft-grid{display:grid;grid-template-columns:1.3fr .8fr 1.2fr 1.2fr;gap:clamp(2rem,4vw,3.5rem);align-items:start;padding-block:clamp(3.2rem,6vw,4.6rem)}
.ft-brand{display:flex;flex-direction:column;align-items:flex-start}
.ft-brand .status{display:inline-flex;margin:.9rem 0 1.3rem;padding:.55rem .9rem;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#fff}
.ft-brand .status[data-state="open"] .dot,.ft-brand .status[data-state="open"] .dot::after{background:#4be0a4}
.ft-btn{display:inline-flex;align-items:center;gap:.7rem;padding:.85rem 1.35rem;border-radius:999px;background:#fff;color:var(--navy)!important;font:700 .78rem/1 var(--f-title);letter-spacing:.08em;text-transform:uppercase;transition:background .3s,transform .35s var(--ease)}
.ft-btn svg{width:16px;height:16px;transition:transform .35s var(--ease)}
.ft-btn:hover{background:#9fe3ee;transform:translateY(-2px)}
.ft-btn:hover svg{transform:translateX(4px)}
.copyright{position:relative;z-index:1;background:#012b3e;color:rgba(255,255,255,.78);padding-block:1.1rem;font-size:.85rem;border-top:1px solid rgba(255,255,255,.1)}
.ft-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1.5rem}
.copyright a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35);transition:color .25s,border-color .25s}
.copyright a:hover{color:#9fe3ee;border-color:#9fe3ee}
.copyright .ft-credit{display:inline-block;color:inherit;opacity:.85;border:0;text-decoration:none;transition:opacity .25s}
.copyright .ft-credit:hover{opacity:1;color:inherit;border:0;text-decoration:none}
.ft-credit .ic-n{font-family:'Nunito',sans-serif;font-weight:800;color:inherit}
.ft-credit .ic-a{font-family:'Manrope',sans-serif;font-weight:400;font-size:.8em;text-transform:uppercase;letter-spacing:.34em}
@media (max-width:1000px){.ft-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ft-grid{grid-template-columns:1fr}.ft-bar{flex-direction:column;align-items:flex-start}}
/* note 4,9 : chiffre plus petit, étoiles plus grandes (rangée remplie à 98 % = 4,9/5) */
.score-note strong{font-size:clamp(2.3rem,1.9rem + 1.6vw,3rem)}
.score-note span{font-size:1.2rem}
.rv-stars--lg{font-size:1.75rem;letter-spacing:.1em;background:linear-gradient(90deg,#fbbc04 98%,#e6dfc9 98%);-webkit-background-clip:text;background-clip:text;color:transparent}
.score-sub,.ft-btn{white-space:nowrap}

/* pied de page v4 : numéros + « mise au point » sur le menu, cartes horaires/contact, cercles de lentille, retour en haut */
.site-footer::after{content:"";position:absolute;right:-9%;top:-30%;width:clamp(300px,34vw,480px);aspect-ratio:1;border-radius:50%;border:1px solid rgba(255,255,255,.09);outline:1px solid rgba(255,255,255,.055);outline-offset:46px;pointer-events:none}
.ft-grid{align-items:stretch}
.ft-nav ul{gap:.2rem}
.ft-nav a{display:flex;align-items:baseline;gap:.8rem;padding:.3rem 0;font-size:1.2rem;transition:opacity .3s,filter .3s,transform .3s var(--ease),color .25s}
.ft-nav .no{font:700 .68rem/1 var(--f-title);letter-spacing:.14em;color:#9fe3ee}
.ft-nav ul:hover a:not(:hover),.ft-nav ul:focus-within a:not(:focus-visible){opacity:.4;filter:blur(1.1px)}
.ft-nav a:hover{transform:translateX(6px)}
.ft-card{padding:1.6rem 1.6rem 1.5rem;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.11);backdrop-filter:blur(2px)}
.ft-card .hrs{margin:0 -.7rem .4rem}
.ft-btn{position:relative;overflow:hidden;isolation:isolate}
.ft-btn::before{content:"";position:absolute;z-index:-1;left:1.1rem;top:50%;width:10px;height:10px;margin:-5px 0 0;border-radius:50%;background:#9fe3ee;transform:scale(0);transition:transform .55s var(--ease)}
.ft-btn:hover{background:#fff}
.ft-btn:hover::before{transform:scale(40)}
.ft-right{display:inline-flex;align-items:center;gap:.8rem}
.ft-up{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(255,255,255,.28)!important;border-radius:50%;transition:background .3s,transform .35s var(--ease)}
.ft-up svg{width:16px;height:16px}
.ft-up:hover{background:#fff;transform:translateY(-3px)}
.ft-up:hover svg{color:var(--navy)}
@media (max-width:1000px){.ft-card{padding:1.3rem}}
.ft-grid{grid-template-columns:minmax(210px,1.1fr) minmax(170px,.8fr) minmax(0,1.2fr) minmax(0,1.1fr)}
.ft-nav a{white-space:nowrap}
.ft-card h3{white-space:nowrap;letter-spacing:.16em}
@media (max-width:1180px){.ft-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ft-grid{grid-template-columns:1fr}}

/* Décor optique discret (accueil) : paires de ronds « lunettes » en trait fin sur les bords + filet avec point de visée (18/10/2026) */
.deco{position:relative;overflow:clip}
.deco>.wrap{position:relative;z-index:1}
.deco-line::after{content:"";position:absolute;top:0;left:50%;width:min(88%,1100px);height:12px;transform:translateX(-50%);pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(1,76,108,.2) 18%,rgba(1,76,108,.2) 82%,transparent) center/100% 1px no-repeat,
             radial-gradient(circle,rgba(2,133,156,.6) 0 2px,transparent 2.5px,transparent 4px,rgba(2,133,156,.45) 4.5px 5px,transparent 5.5px) center/12px 12px no-repeat}

/* avis v4 : une rangée horizontale (défilement manuel, sans mouvement automatique) + carte finale « Voir tous les avis sur Google » */
.avis-top{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(1.5rem,4vw,4rem);align-items:end}
.avis-top .avis-head{text-align:left}
.avis-top .avis-head h2{font-size:clamp(2rem,1.2rem + 2.6vw,3.1rem)}
.avis-side{display:flex;flex-direction:column;align-items:flex-start;gap:1.1rem}
.avis-side .score{margin:0}
.rv-rail{margin-top:clamp(1.8rem,3vw,2.6rem)}
.rv-row{display:flex;align-items:stretch;gap:1.1rem;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;
  padding:.6rem max(var(--gut),calc((100vw - var(--wrap)) / 2)) 1.2rem;scroll-padding-inline:max(var(--gut),calc((100vw - var(--wrap)) / 2));
  -webkit-mask-image:linear-gradient(90deg,#000 94%,transparent);mask-image:linear-gradient(90deg,#000 94%,transparent)}
.rv-row::-webkit-scrollbar{display:none}
.rv-row:focus-visible{outline:2px solid var(--teal);outline-offset:-2px}
.rv-row .rv{flex:none;width:clamp(270px,80vw,340px);margin:0;scroll-snap-align:start}
.rv-more{flex:none;width:clamp(240px,70vw,290px);scroll-snap-align:start;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:.6rem;padding:1.5rem;border-radius:16px;background:var(--navy);color:#fff;transition:background .3s,transform .35s var(--ease)}
.rv-more .g{width:34px;height:34px;padding:6px;border-radius:50%;background:#fff}
.rv-more b{font:600 1.35rem/1.2 var(--f-display);letter-spacing:-.01em}
.rv-more span{font-size:.88rem;color:rgba(255,255,255,.8)}
.rv-more i{display:grid;place-items:center;width:38px;height:38px;margin-top:.6rem;border-radius:50%;background:#fff;color:var(--navy);transition:transform .35s var(--ease)}
.rv-more i svg{width:18px;height:18px}
.rv-more:hover{background:var(--teal);color:#fff;transform:translateY(-3px)}
.rv-more:hover i{transform:translate(3px,-3px)}
.rv-nav{display:flex;justify-content:flex-end;gap:.6rem}
.rv-nav button{display:grid;place-items:center;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:var(--navy);color:#fff;cursor:pointer;transition:background .3s,transform .3s var(--ease)}
.rv-nav button svg{width:17px;height:17px}
.rv-nav button:hover{background:var(--teal);transform:scale(1.07)}
.rv-nav button:disabled{opacity:.35;cursor:default;transform:none;background:var(--navy)}
@media (max-width:900px){.avis-top{grid-template-columns:1fr}.rv-nav{display:none}}

.rv-nav{justify-content:space-between;align-items:center}
.rv-arrows{display:flex;gap:.6rem}
.avis-side{align-items:flex-start}
@media (max-width:900px){.rv-nav{display:flex;justify-content:center}.rv-arrows{display:none}}

/* ==========================================================================
   Bandeau de titre (v2, SVG net) + page Services à la charte de l'accueil (18/10/2026)
   ========================================================================== */
.page-title{position:relative;overflow:hidden;isolation:isolate;padding-block:clamp(2.6rem,6vw,4.6rem)}


.svc{padding-block:clamp(2.6rem,6vw,5rem)}











.svc-checks{list-style:none;margin:0 0 1.2rem;padding:0;display:grid;gap:.55rem}
.svc-checks li{position:relative;padding-left:2rem}
.svc-checks li::before{content:"";position:absolute;left:0;top:.18em;width:1.3rem;height:1.3rem;border-radius:50%;background:rgba(2,133,156,.13)}
.svc-checks li::after{content:"";position:absolute;left:.46rem;top:.4em;width:.36rem;height:.62rem;border:solid var(--teal);border-width:0 2px 2px 0;transform:rotate(45deg)}
.svc-sub{margin:1.6rem 0 .7rem;font:700 .8rem/1.2 var(--f-title);letter-spacing:.2em;text-transform:uppercase;color:var(--teal)}
.svc-badge{display:inline-block;margin:0 0 1.1rem;padding:.7rem 1.1rem;border-radius:12px;background:rgba(2,133,156,.1);border-left:3px solid var(--teal)}
.svc-badge strong{color:var(--navy);font-size:1.02rem}
.svc-quote{position:relative;margin:clamp(3rem,7vw,5.5rem) 0;min-height:clamp(240px,30vw,340px);display:grid;place-items:center;text-align:center;color:#fff;overflow:hidden;border-radius:26px;isolation:isolate}
.svc-quote img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 2.4s var(--ease)}
.svc-quote.is-in img{transform:none}
.svc-quote::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(120deg,rgba(1,76,108,.86),rgba(2,133,156,.7))}
.svc-quote p{margin:0;padding:2rem;max-width:20ch;font-family:var(--f-display);font-style:italic;font-weight:400;font-size:clamp(1.9rem,1.1rem + 3vw,3.4rem);line-height:1.12;letter-spacing:-.02em}











/* Services v3 : même langage que l'accueil (intro éditoriale, barre d'atouts, trio de photos, bande rendez-vous) */
.svc-bar{grid-template-columns:repeat(4,minmax(0,1fr))}
.svc-bar .sb{display:flex;align-items:center;gap:.9rem;padding:1.3rem 1.4rem}
.svc-bar .sb p{margin:0;font-weight:600;color:var(--navy);line-height:1.35}
.svc-bar .sb .ic{width:44px;height:44px;flex:none;padding:10px;border-radius:50%;background:rgba(2,133,156,.1);color:var(--teal)}
.svc-sante{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center;padding:clamp(1.6rem,3vw,2.4rem) clamp(1.5rem,3vw,2.6rem);border-radius:22px;background:linear-gradient(120deg,rgba(2,133,156,.1),rgba(2,133,156,.04));border:1px solid rgba(2,133,156,.18)}
.svc-sante h3{margin:0 0 1rem;font-family:var(--f-display);font-weight:450;font-size:clamp(1.5rem,1.1rem + 1.4vw,2.2rem);letter-spacing:-.015em;line-height:1.1;color:var(--navy)}
.svc-sante .svc-badge{margin:0;background:#fff}
.svc-sante .svc-checks{margin:0}
.svc-checks--sm{margin:1rem 0 0;font-size:.95rem}
.tcard .svc-checks{margin-bottom:0}
.svc-quote{margin-bottom:0}
@media (max-width:1000px){.svc-bar{grid-template-columns:repeat(2,minmax(0,1fr))}.svc-bar .sb:nth-child(3){border-left:0}.svc-bar .sb:nth-child(n+3){border-top:1px solid rgba(1,76,108,.1)}}
@media (max-width:620px){.svc-bar{grid-template-columns:1fr}.svc-bar .sb+.sb{border-left:0;border-top:1px solid rgba(1,76,108,.1)}.svc-sante{grid-template-columns:1fr}}
/* bandeau de titre compact : titre sur une seule ligne, lunettes plus discrètes */
.page-title{padding-block:clamp(1.5rem,3.2vw,2.5rem)}
.page-title h1{font-size:clamp(2.2rem,1.3rem + 3.6vw,3.9rem);margin-top:.1em}
.page-title h1 span{display:inline-block}
.page-title h1 span+span{margin-left:.26em}

/* barre d'atouts v2 : style éditorial (filets, grandes icônes en trait fin, Fraunces, numéros), plus de carte blanche ni de pastilles rondes */
.infobar.svc-bar{background:none;border:0;border-radius:0;box-shadow:none;overflow:visible;border-block:1px solid rgba(1,76,108,.2);counter-reset:sb}
.svc-bar .sb{position:relative;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:1.3rem;min-height:clamp(170px,15vw,210px);padding:2.2rem 1.7rem 2rem;counter-increment:sb;transition:background .5s}
.svc-bar .sb+.sb{border-left:1px solid rgba(1,76,108,.14)}
.svc-bar .sb::before{content:"0" counter(sb);position:absolute;top:1.2rem;right:1.5rem;font-family:var(--f-display);font-style:italic;font-size:1.05rem;color:rgba(2,133,156,.6)}
.svc-bar .sb::after{content:"";position:absolute;left:1.7rem;bottom:-1px;height:3px;width:0;background:linear-gradient(90deg,var(--teal),var(--navy));transition:width .7s var(--ease)}
.svc-bar .sb:hover{background:rgba(2,133,156,.045)}
.svc-bar .sb:hover::after{width:calc(100% - 3.4rem)}
.svc-bar .sb .ic{width:58px;height:58px;padding:0;border-radius:0;background:none;color:var(--teal);stroke-width:1.05;transition:transform .6s var(--ease)}
.svc-bar .sb:hover .ic{transform:translateY(-4px) scale(1.06)}
.svc-bar .sb p{font-family:var(--f-display);font-weight:450;font-size:clamp(1.2rem,1rem + .55vw,1.5rem);line-height:1.18;letter-spacing:-.012em;color:var(--navy)}
@media (max-width:1000px){.svc-bar .sb:nth-child(3){border-left:0}.svc-bar .sb:nth-child(n+3){border-top:1px solid rgba(1,76,108,.14)}}
@media (max-width:620px){.svc-bar .sb{flex-direction:row;align-items:center;justify-content:flex-start;min-height:0;padding:1.3rem 1.2rem}.svc-bar .sb+.sb{border-left:0;border-top:1px solid rgba(1,76,108,.14)}.svc-bar .sb .ic{width:46px;height:46px}.svc-bar .sb::before{top:.8rem}}
@media (max-width:620px){.svc-bar .sb::before{display:none}}
/* barre d'atouts v3 : colonnes centrées, sans numéros, icône dans une « lentille » à double contour */
.svc-bar .sb::before{display:none}
.svc-bar .sb{align-items:center;justify-content:center;text-align:center;gap:1.2rem;padding:2.2rem 1.4rem 2.1rem}
.svc-bar .sb::after{left:50%;transform:translateX(-50%)}
.svc-bar .sb:hover::after{width:44%}
.svc-bar .sb .ic{box-sizing:border-box;width:84px;height:84px;padding:21px;border-radius:50%;stroke-width:1.25;color:var(--teal);
  background:radial-gradient(circle at 32% 28%,#fff 0,rgba(2,133,156,.09) 70%);
  box-shadow:0 0 0 1px rgba(2,133,156,.4),0 0 0 7px #fff,0 0 0 8px rgba(2,133,156,.18),0 14px 26px -14px rgba(1,76,108,.45);
  transition:transform .6s var(--ease),box-shadow .5s,background .5s,color .4s}
.svc-bar .sb:hover .ic{transform:translateY(-4px);color:var(--navy);background:radial-gradient(circle at 32% 28%,#fff 0,rgba(2,133,156,.18) 75%);box-shadow:0 0 0 1px var(--teal),0 0 0 7px #fff,0 0 0 8px rgba(2,133,156,.35),0 18px 30px -14px rgba(1,76,108,.55)}
@media (max-width:620px){.svc-bar .sb{flex-direction:row;text-align:left;justify-content:flex-start;gap:1.2rem}.svc-bar .sb::after{display:none}.svc-bar .sb .ic{width:60px;height:60px;padding:15px;box-shadow:0 0 0 1px rgba(2,133,156,.4),0 0 0 5px #fff,0 0 0 6px rgba(2,133,156,.18)}}
.svc-bar .sb{justify-content:flex-start}
.svc-bar .sb p{min-height:2.4em;display:flex;align-items:flex-start;justify-content:center}
.svc-bar .sb .ic{padding:18px}
@media (max-width:620px){.svc-bar .sb p{min-height:0;justify-content:flex-start}.svc-bar .sb .ic{padding:14px}}
/* retouches : filet du haut de la barre d'atouts plus clair (turquoise de « chacun »), lunettes du bandeau plus petites donc lisibles */
.svc-bar::before{height:2px;background:linear-gradient(90deg,var(--teal),#5cbccb)}


/* lunettes du bandeau : entières, de la hauteur exacte du bandeau (elles touchent le haut et le bas), fondu en transparence vers la gauche */


/* lunettes du bandeau : entières, sans fondu, un peu plus transparentes */


/* ==========================================================================
   Marques (18/10/2026) : même langage que l'accueil et Services
   ========================================================================== */
.mq-intro{padding-bottom:clamp(2rem,5vw,3.5rem)}
.mq-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(2rem,6vw,5.5rem);align-items:center}
.mq-pic{position:relative;margin:0;border-radius:22px;overflow:hidden;aspect-ratio:1/1;background:#f1e4dc;box-shadow:0 30px 60px -38px rgba(1,76,108,.55)}
.mq-pic img{width:100%;height:100%;object-fit:cover}
.js .mq-pic.is-in{animation:mq-iris 1.4s cubic-bezier(.7,0,.2,1) backwards}
.js .mq-pic.is-in img{animation:mise-au-point 1.5s var(--ease) backwards}
@keyframes mq-iris{from{clip-path:circle(0% at 50% 50%)}to{clip-path:circle(75% at 50% 50%)}}
.mq-text .lead{font-family:var(--f-display);font-weight:400;font-size:clamp(1.4rem,1rem + 1.3vw,2rem);line-height:1.32;letter-spacing:-.012em;color:var(--navy);margin-bottom:1.5rem}
.mq-pull{margin:0 0 1.5rem;padding-left:1.2rem;border-left:3px solid var(--teal)}
.mq-pull strong{font-family:var(--f-display);font-style:italic;font-weight:400;font-size:clamp(1.25rem,1rem + 1vw,1.7rem);line-height:1.25;color:var(--teal)}
.mq-text p:last-child{max-width:56ch}
.mq-wall{padding-top:clamp(1rem,3vw,2rem)}
.mq-wall .brand-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(.7rem,1.4vw,1.1rem);margin:0}
.mq-wall .brand-grid li{flex:0 0 calc((100% - 5 * clamp(.7rem,1.4vw,1.1rem)) / 6);aspect-ratio:5/4;padding:1.1rem;border-radius:16px;border:1px solid rgba(1,76,108,.12);background:#fff;box-shadow:none;transition:opacity .55s var(--ease),filter .55s var(--ease),transform .5s var(--ease),border-color .35s,box-shadow .35s}
.mq-wall .brand-grid li:hover{border-color:var(--teal);box-shadow:0 18px 34px -24px rgba(1,76,108,.55);transform:translateY(-4px)}
.mq-wall .brand-grid img{width:100%;height:100%;object-fit:contain}
.mq-wall .more{margin:clamp(2rem,4vw,3rem) 0 0;text-align:center;font-family:var(--f-display);font-style:italic;font-weight:400;font-size:clamp(1.4rem,1.1rem + 1.2vw,2.1rem);letter-spacing:-.012em;color:var(--navy)}
.mq-wall .more::before,.mq-wall .more::after{content:"";display:inline-block;width:clamp(1.5rem,5vw,3.5rem);height:1px;margin:0 1rem;vertical-align:middle;background:linear-gradient(90deg,transparent,var(--teal))}
.mq-wall .more::after{transform:scaleX(-1)}
@media (max-width:1100px){.mq-wall .brand-grid li{flex-basis:calc((100% - 4 * clamp(.7rem,1.4vw,1.1rem)) / 5)}}
@media (max-width:900px){.mq-grid{grid-template-columns:1fr}.mq-pic{aspect-ratio:4/3}.mq-wall .brand-grid li{flex-basis:calc((100% - 3 * .8rem) / 4)}}
@media (max-width:640px){.mq-wall .brand-grid li{flex-basis:calc((100% - 2 * .7rem) / 3);padding:.7rem}}
@media (max-width:420px){.mq-wall .brand-grid li{flex-basis:calc((100% - .7rem) / 2)}}
.mq-wall .brand-grid li{position:relative;display:block;padding:0}
.mq-wall .brand-grid img{position:absolute;inset:1rem;width:calc(100% - 2rem);height:calc(100% - 2rem)}
@media (max-width:640px){.mq-wall .brand-grid li{aspect-ratio:3/2}.mq-wall .brand-grid img{inset:.6rem;width:calc(100% - 1.2rem);height:calc(100% - 1.2rem)}}
@media (max-width:640px){.mq-wall .brand-grid img{inset:.2rem;width:calc(100% - .4rem);height:calc(100% - .4rem);transform:scale(1.22)}}

/* Marques : titre avec les deux ronds (même signature que « La vue adaptée à chacun ») */
.mq-text .intro-head{margin-bottom:1.6rem}
.mq-text .intro-head h2{font-size:clamp(2rem,1.1rem + 2.6vw,3.5rem);line-height:1.08;text-align:left}
.mq-text .intro-head::before,.mq-text .intro-head::after{width:clamp(130px,13vw,200px);top:-30%}
.mq-text .intro-head::before{left:-6%}
.mq-text .intro-head::after{left:calc(-6% + clamp(130px,13vw,200px) * .78)}
.mq-text .lead{margin-bottom:1.2rem}
.mq-text .lead{font-size:clamp(1.15rem,.95rem + .7vw,1.5rem);line-height:1.38}
/* bandeau avec photo du magasin teintée (test sur Marques) : photo en niveaux de gris fondue dans le dégradé bleu */
.page-title--photo::after{content:"";position:absolute;inset:0;z-index:-2;background:var(--pt-img) center 42%/cover no-repeat;filter:grayscale(1) contrast(1.15);mix-blend-mode:luminosity;opacity:.42;pointer-events:none}
.page-title--marques{--pt-img:url('../img/galerie/photo-12-l.webp')}
.page-title--photo::after{opacity:.3;-webkit-mask-image:linear-gradient(90deg,transparent 18%,#000 78%);mask-image:linear-gradient(90deg,transparent 18%,#000 78%)}

/* bandeaux : photo du magasin teintée sur toutes les pages internes (les lunettes en filigrane ont été retirées) */
.page-title--services{--pt-img:url('../img/galerie/photo-01-m.webp')}
.page-title--verres{--pt-img:url('../img/galerie/photo-10-m.webp')}
.page-title--contact{--pt-img:url('../img/galerie/photo-16-m.webp')}
.page-title--marques{--pt-img:url('../img/galerie/photo-12-m.webp')}
.page-title--photo::after{background-position:center var(--pt-y,42%)}
.page-title--services{--pt-y:21%}

/* ==========================================================================
   Verres & vue (18/10/2026) : chapitres produit, sommaire, panneau ACTIVISU
   ========================================================================== */
.page-title--verres{--pt-y:41%}
.page-title--verres::after{opacity:.42;-webkit-mask-image:linear-gradient(90deg,transparent 6%,#000 58%);mask-image:linear-gradient(90deg,transparent 6%,#000 58%)}
.vv-intro{padding-bottom:clamp(1.5rem,3vw,2.5rem)}
.vv-intro .intro-head h2{font-size:clamp(2rem,1.1rem + 2.7vw,3.5rem);line-height:1.08}
.vv-intro .intro-head::before,.vv-intro .intro-head::after{width:clamp(130px,13vw,200px);top:-26%}
.vv-intro .intro-head::before{left:-6%}
.vv-intro .intro-head::after{left:calc(-6% + clamp(130px,13vw,200px) * .78)}
.vv-intro .intro-body .lead{font-size:clamp(1.2rem,.95rem + .9vw,1.65rem)}




















.vv-no{margin:0 0 .3rem;font-family:var(--f-display);font-style:italic;font-size:1.15rem;color:var(--teal)}
.vv-text h3{margin:0 0 1.1rem;font-family:var(--f-display);font-weight:450;font-size:clamp(2rem,1.2rem + 2.6vw,3.3rem);line-height:1.04;letter-spacing:-.02em;color:var(--navy)}
.vv-text h3::after{content:"";display:block;width:46px;height:3px;margin-top:.9rem;border-radius:3px;background:linear-gradient(90deg,var(--teal),var(--navy))}
.vv-text .lead{margin:0 0 1rem;font-family:var(--f-display);font-weight:400;font-size:clamp(1.2rem,.95rem + .9vw,1.6rem);line-height:1.3;letter-spacing:-.01em;color:var(--teal)}
.vv-text p{max-width:60ch}
.vv-text strong{color:var(--navy)}
.vv-benefits{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;margin:1.3rem 0 1.5rem}
.vv-b{display:flex;flex-direction:column;gap:.7rem;padding:1.15rem 1.2rem;border-radius:16px;background:rgba(2,133,156,.06);border:1px solid rgba(2,133,156,.2)}
.vv-b .ic{width:34px;height:34px;color:var(--teal)}
.vv-b p{margin:0;font-size:.92rem;line-height:1.5}
.vv-b strong{display:block;margin-bottom:.35rem;font:700 .74rem/1.35 var(--f-title);letter-spacing:.07em;color:var(--navy)}
.vv-btn{display:inline-flex;align-items:center;gap:.6rem;padding:.8rem 1.3rem;border:1.5px solid var(--navy);border-radius:999px;font:700 .78rem/1 var(--f-title);letter-spacing:.08em;text-transform:uppercase;color:var(--navy);transition:background .3s,color .3s,transform .35s var(--ease)}
.vv-btn .go{width:15px;height:15px;transition:transform .35s var(--ease)}
.vv-btn:hover{background:var(--navy);color:#fff;transform:translateY(-2px)}
.vv-btn:hover .go{transform:translate(3px,-3px)}
.vv-act{padding-block:clamp(2.4rem,5vw,4rem)}
.vv-act-panel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(1.5rem,4vw,3.5rem);align-items:center;padding:clamp(1.8rem,4vw,3.2rem);border-radius:26px;background:linear-gradient(120deg,rgba(2,133,156,.11),rgba(2,133,156,.04));border:1px solid rgba(2,133,156,.2)}
.vv-act-logo{width:clamp(170px,18vw,230px);height:auto;margin-bottom:1.3rem}
.vv-act-text h3{margin:0 0 .5rem;font-family:var(--f-display);font-weight:450;font-size:clamp(1.7rem,1.1rem + 2vw,2.6rem);line-height:1.1;letter-spacing:-.015em;color:var(--navy)}
.vv-act-text h4{margin:1.1rem 0 .6rem;font:700 .8rem/1 var(--f-title);letter-spacing:.22em;text-transform:uppercase;color:var(--teal)}
.vv-act-text p{max-width:64ch}
.vv-tower{position:relative;display:grid;place-items:center;width:clamp(230px,24vw,320px);aspect-ratio:1}
.vv-tower::before{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0,rgba(2,133,156,.16) 75%);box-shadow:0 0 0 1px rgba(2,133,156,.35),0 0 0 12px #fff,0 0 0 13px rgba(2,133,156,.2)}
.vv-tower img{position:relative;height:88%;width:auto}


.vv-tower{align-self:center;height:auto}
.vv-tower img{position:absolute;left:50%;top:6%;height:88%;width:auto;translate:-50% 0}
.vv-tower{width:clamp(250px,27vw,370px)}
.vv-tower img{top:4%;height:92%}

/* esperluette : police du texte courant (la « & » de Fraunces ressemble à un @) */
.amp{font-family:var(--f-title);font-style:normal;font-weight:500;font-size:.88em}
/* Verres & vue v2 : 4 cartes produit en grille 2 × 2, comme les cartes de Services */






















/* verres : « l'essentiel » en pastilles (faits issus des pages du fabricant, reformulés) */
.vv-tags{display:flex;flex-wrap:wrap;gap:.45rem;list-style:none;margin:0 0 1.1rem;padding:0}
.vv-tags li{padding:.38rem .75rem;border-radius:999px;background:rgba(2,133,156,.08);border:1px solid rgba(2,133,156,.2);font:600 .76rem/1.2 var(--f-title);color:var(--navy)}

/* Verres & vue v3 : barre de navigation « lentilles » (comme Services) + scène fixe / textes qui défilent */
.vv-intro{padding-bottom:clamp(1.2rem,2.5vw,2rem)}
.vv-barwrap{margin-top:clamp(1.8rem,4vw,3rem)}
.vv-bar{grid-template-columns:repeat(5,minmax(0,1fr))}
.vv-bar .sb{min-height:clamp(190px,16vw,230px);color:inherit}
.vv-bar .sb p{display:block;min-height:0;text-align:center;font-size:clamp(1.15rem,.95rem + .5vw,1.4rem)}
.vv-bar .sb small{display:block;margin-top:.45rem;font:700 .68rem/1.3 var(--f-title);letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.vv-chap{padding-block:clamp(2.4rem,5vw,4rem)}
.vv-story{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(2rem,6vw,5.5rem);align-items:start}
.vv-stage{position:sticky;top:112px;align-self:start}
.vv-stage-frame{position:relative;width:min(100%,calc((100vh - 190px) * .8));aspect-ratio:4/5;border-radius:26px;overflow:hidden;background:#e7eef1;box-shadow:0 34px 64px -40px rgba(1,76,108,.65);isolation:isolate}
.vv-stage-frame::after{content:"";position:absolute;inset:16px;z-index:3;pointer-events:none;opacity:.85;filter:drop-shadow(0 0 3px rgba(1,38,56,.45));background:
 linear-gradient(#fff,#fff) 0 0/22px 2px no-repeat,linear-gradient(#fff,#fff) 0 0/2px 22px no-repeat,
 linear-gradient(#fff,#fff) 100% 0/22px 2px no-repeat,linear-gradient(#fff,#fff) 100% 0/2px 22px no-repeat,
 linear-gradient(#fff,#fff) 0 100%/22px 2px no-repeat,linear-gradient(#fff,#fff) 0 100%/2px 22px no-repeat,
 linear-gradient(#fff,#fff) 100% 100%/22px 2px no-repeat,linear-gradient(#fff,#fff) 100% 100%/2px 22px no-repeat}
.vv-slide{position:absolute;inset:0;opacity:0;transform:scale(1.06);filter:blur(10px);transition:opacity .9s var(--ease),transform 1.3s var(--ease),filter .9s var(--ease)}
.vv-slide.is-on{opacity:1;transform:none;filter:none;z-index:1}
.vv-slide img{width:100%;height:100%;object-fit:cover;object-position:50% 25%}
.vv-slide--diagram{background:#fff}
.vv-slide--diagram img{object-fit:contain;padding:8%}
.vv-slide--diagram + *{}
.vv-rail{display:flex;align-items:center;justify-content:space-between;width:min(100%,calc((100vh - 190px) * .8));margin-top:1rem}
.vv-cap{font-family:var(--f-display);font-style:italic;font-size:1.05rem;color:var(--teal)}
.vv-dots{display:flex;gap:.45rem}
.vv-dots a{display:grid;place-items:center;min-width:2.3rem;height:2.3rem;border-radius:999px;border:1px solid rgba(1,76,108,.22);font:600 .78rem/1 var(--f-title);color:var(--navy);background:#fff;transition:background .3s,color .3s,border-color .3s}
.vv-dots a:hover{border-color:var(--teal)}
.vv-dots a.is-on{background:var(--navy);border-color:var(--navy);color:#fff}
.vv-step{padding-block:clamp(2rem,6vh,4rem);scroll-margin-top:100px;min-height:62vh;display:flex;flex-direction:column;justify-content:center}
.vv-step:first-child{padding-top:0}
.vv-step+.vv-step{border-top:1px solid rgba(1,76,108,.12)}
.vv-step-pic{display:none}
.vv-no span{font-family:var(--f-title);font-style:normal;font-weight:700;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--navy);opacity:.75}
@media (max-width:900px){
  .vv-story{grid-template-columns:1fr}
  .vv-stage{display:none}
  .vv-step{min-height:0}
  .vv-step-pic{display:block;aspect-ratio:16/10;border-radius:20px;overflow:hidden;margin-bottom:1.3rem;background:#e7eef1}
  .vv-step-pic img{width:100%;height:100%;object-fit:cover;object-position:50% 28%}
  .vv-step-pic--diagram{background:#fff;border:1px solid rgba(1,76,108,.1)}
  .vv-step-pic--diagram img{object-fit:contain}
  .vv-bar{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vv-bar .sb:nth-child(5){grid-column:1/-1}
  .vv-bar .sb:nth-child(n+3){border-top:1px solid rgba(1,76,108,.14)}
  .vv-bar .sb:nth-child(odd){border-left:0}
}
@media (max-width:560px){
  .vv-bar{grid-template-columns:1fr}
  .vv-bar .sb:nth-child(5){grid-column:auto}
  .vv-bar .sb+.sb{border-left:0;border-top:1px solid rgba(1,76,108,.14)}
}
@media (max-width:900px){.vv-bar .sb{min-height:0}}
@media (max-width:560px){.vv-bar .sb{flex-direction:row;justify-content:flex-start;text-align:left;padding:1rem 1.1rem}.vv-bar .sb p{text-align:left}.vv-bar .sb .ic{width:60px;height:60px;padding:14px}}

/* ==========================================================================
   Contact (18/10/2026) : titre à deux ronds, coordonnées en grandes lignes, formulaire à étiquettes flottantes,
   horaires en direct, carte dans une « lentille » ronde
   ========================================================================== */





.ct-lines{list-style:none;margin:0;padding:0;border-block:1px solid rgba(1,76,108,.18)}
.ct-lines li{position:relative;display:flex;align-items:center;gap:1.2rem;padding:1.15rem .4rem}
.ct-lines li+li{border-top:1px solid rgba(1,76,108,.12)}
.ct-lines .ic{flex:none;box-sizing:border-box;width:58px;height:58px;padding:14px;border-radius:50%;color:var(--teal);background:radial-gradient(circle at 32% 28%,#fff 0,rgba(2,133,156,.09) 70%);box-shadow:0 0 0 1px rgba(2,133,156,.4),0 0 0 5px #fff,0 0 0 6px rgba(2,133,156,.18)}
.ct-lines li>div{flex:1;min-width:0}
.ct-lines .lab{display:block;font:700 .68rem/1 var(--f-title);letter-spacing:.2em;text-transform:uppercase;color:var(--teal);margin-bottom:.4rem}
.ct-lines .val{display:block;font-family:var(--f-display);font-weight:450;font-size:clamp(1.2rem,.95rem + 1vw,1.7rem);line-height:1.2;letter-spacing:-.01em;color:var(--navy);overflow-wrap:anywhere;transition:color .25s}
.ct-lines a.val:hover{color:var(--teal)}
.ct-lines small{display:block;margin-top:.25rem;font-size:.86rem;color:#6b7b84}


.ct-form{position:relative;padding:clamp(1.6rem,3.2vw,2.6rem);border-radius:26px;background:#fff;border:1px solid rgba(1,76,108,.1);box-shadow:0 30px 60px -44px rgba(1,76,108,.6)}
.ct-form::before{content:"";position:absolute;left:clamp(1.6rem,3.2vw,2.6rem);right:clamp(1.6rem,3.2vw,2.6rem);top:0;height:3px;border-radius:0 0 3px 3px;background:linear-gradient(90deg,var(--teal),#5cbccb)}
.ct-form>.form-note:first-child{margin:0 0 1.2rem}
.ct-fields{display:grid;gap:1.15rem}
.ct-row{display:grid;grid-template-columns:1fr 1fr;gap:1.15rem}
.fld{position:relative}
.fld input,.fld textarea{width:100%;font:inherit;font-size:1rem;color:#233;padding:1.5rem .2rem .5rem;border:0;border-bottom:1.5px solid #c9d5db;border-radius:0;background:transparent;transition:border-color .3s}
.fld textarea{min-height:130px;resize:vertical;padding-top:1.7rem}
.fld label{position:absolute;left:.2rem;top:1.05rem;margin:0;font-weight:500;font-size:1rem;color:#6b7b84;pointer-events:none;transform-origin:left top;transition:transform .35s var(--ease),color .3s}
.fld input:focus,.fld textarea:focus{outline:0;border-color:transparent}
.fld::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,var(--teal),var(--navy));transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.fld:focus-within::after{transform:none}
.fld input:focus+label,.fld input:not(:placeholder-shown)+label,.fld textarea:focus+label,.fld textarea:not(:placeholder-shown)+label{transform:translateY(-.85rem) scale(.78);color:var(--teal);font-weight:700}
.fld input:user-invalid,.fld textarea:user-invalid{border-color:#c0392b}
.ct-subj{margin:0;padding:0;border:0;min-width:0;display:flex;flex-wrap:wrap;gap:.55rem}
.ct-subj legend{padding:0;margin-bottom:.6rem;font-weight:500;font-size:.85rem;color:var(--teal);font-weight:700}
.ct-subj label{display:block;margin:0;cursor:pointer}
.ct-subj input{position:absolute;opacity:0;pointer-events:none}
.ct-subj span{display:inline-block;padding:.6rem 1.05rem;border:1.5px solid rgba(1,76,108,.22);border-radius:999px;font:600 .88rem/1 var(--f-title);color:var(--navy);background:#fff;transition:background .3s,color .3s,border-color .3s,transform .3s var(--ease)}
.ct-subj label:hover span{border-color:var(--teal);transform:translateY(-1px)}
.ct-subj input:checked+span{background:var(--navy);border-color:var(--navy);color:#fff}
.ct-subj input:focus-visible+span{outline:2px solid var(--teal);outline-offset:2px}
.ct-form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ct-send{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;gap:.8rem;padding:1rem 1.8rem;border:0;border-radius:999px;background:var(--navy);color:#fff;font:700 .85rem/1 var(--f-title);letter-spacing:.09em;text-transform:uppercase;cursor:pointer;box-shadow:0 16px 30px -16px rgba(1,76,108,.75);transition:transform .35s var(--ease)}
.ct-send::before{content:"";position:absolute;z-index:-1;left:1.6rem;top:50%;width:10px;height:10px;margin:-5px 0 0;border-radius:50%;background:var(--teal);transform:scale(0);transition:transform .6s var(--ease)}
.ct-send:hover{transform:translateY(-2px)}
.ct-send:hover::before{transform:scale(40)}
.ct-send svg{width:18px;height:18px;transition:transform .35s var(--ease)}
.ct-send:hover svg{transform:translateX(4px)}
.ct-send:disabled{opacity:.6;cursor:wait}
.ct-hours{padding:1.7rem 1.6rem 1.5rem;border-radius:22px;background:linear-gradient(150deg,rgba(2,133,156,.1),rgba(2,133,156,.03));border:1px solid rgba(2,133,156,.2)}
.ct-h{display:flex;align-items:center;gap:.6rem;margin:0 0 1rem;font:700 .78rem/1.2 var(--f-title);letter-spacing:.16em;text-transform:uppercase;color:var(--teal)}
.ct-h .ic{width:20px;height:20px}
.ct-hours .status{display:inline-flex;margin:0 0 1.1rem;padding:.55rem .95rem;border-radius:999px;background:#fff;border:1px solid rgba(1,76,108,.12)}
.ct-hours .hrs--row{margin-inline:-.5rem}


.ct-eyebrow{display:flex;align-items:center;gap:.9rem;margin:0 0 1rem;font:700 .76rem/1 var(--f-title);letter-spacing:.24em;text-transform:uppercase;color:var(--teal)}
.ct-eyebrow::before{content:"";width:2.6rem;height:2px;background:var(--teal)}
.ct-addr{margin:0 0 1rem;font-family:var(--f-display);font-weight:450;font-size:clamp(1.9rem,1.2rem + 2.6vw,3.2rem);line-height:1.1;letter-spacing:-.02em;color:var(--navy)}
.ct-btns{display:flex;flex-wrap:wrap;align-items:center;gap:.9rem 1.5rem;margin-top:1.5rem!important}
.ct-btn{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 1.5rem;border-radius:999px;background:var(--navy);color:#fff;font:700 .8rem/1 var(--f-title);letter-spacing:.08em;text-transform:uppercase;box-shadow:0 14px 28px -14px rgba(1,76,108,.7);transition:background .3s,transform .35s var(--ease)}
.ct-btn:hover{background:var(--teal);color:#fff;transform:translateY(-2px)}
.ct-btn .go,.ct-link .go{width:15px;height:15px;transition:transform .3s var(--ease)}
.ct-btn:hover .go,.ct-link:hover .go{transform:translate(2px,-2px)}
.ct-link{display:inline-flex;align-items:center;gap:.35rem;font-weight:700;font-size:.9rem;color:var(--navy);border-bottom:1.5px solid rgba(1,76,108,.35);padding-bottom:2px}
.ct-link:hover{color:var(--teal);border-color:var(--teal)}







/* contact : éléments plus discrets (adresse et lentille réduites à la demande de Mickaël) */
.ct-addr{font-size:clamp(1.35rem,1.05rem + 1vw,1.9rem);line-height:1.2;margin-bottom:.9rem}






/* carte Contact : coordonnées GPS (pas de fiche Google), la carte remplit simplement la lentille */


/* Contact v4 : titre pleine largeur, grille infos / formulaire alignés, carte pleine largeur (18/10/2026) */
.ct-title{padding-bottom:clamp(1rem,2.5vw,2rem)}
.ct-title .intro-head h2{max-width:16ch}
.ct-main{padding-top:clamp(1rem,2.5vw,2rem);padding-bottom:clamp(2.5rem,6vw,4.5rem)}
.ct2-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}
.ct-lines--sm{margin:0 0 1.4rem}
.ct-lines--sm li{padding:.95rem .2rem;gap:1rem}
.ct-lines--sm .ic{width:46px;height:46px;padding:11px}
.ct-lines--sm .val{font-size:clamp(1.1rem,.95rem + .6vw,1.4rem)}
.ct-row{display:grid;grid-template-columns:1fr 1fr;gap:1.15rem}









@media (max-width:560px){.ct-row{grid-template-columns:1fr}}

/* Taille unique pour tous les H2 du site (18/10/2026) : une seule variable, valable partout */
:root{--h2-size:clamp(2.1rem,1rem + 3.7vw,4.1rem)}
main h2{font-size:var(--h2-size)!important;line-height:1.08!important}
/* contact : plus d'air sous le titre ; la colonne de gauche est calée en bas pour finir au même niveau que le formulaire */
.ct-title{padding-bottom:clamp(2.4rem,5vw,4.2rem)}
.ct-main{padding-top:clamp(1.6rem,3.2vw,2.8rem)}
.ct2-grid{align-items:stretch}
.ct2-info{align-self:end}
.ct-form{align-self:start}
@media (max-width:900px){.ct2-info{align-self:start}}
/* contact : carte bleutée au repos (teinte monochrome aux couleurs du site), elle reprend ses couleurs au survol */





/* teinte de la carte : bleu-gris doux (moins saturé que le turquoise du site) */


/* Contact v5 : adresse + petite lentille ronde discrète (carte en couleurs naturelles), alignées sur la grille de la page */
.ct2-where{padding-block:clamp(1.5rem,3vw,2.5rem) clamp(2.5rem,6vw,4.5rem)}
.ct2-where-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.ct2-card .ct-eyebrow{margin-bottom:.8rem}
.ct2-card .ct-addr{font-size:clamp(1.25rem,1.05rem + .7vw,1.6rem);margin-bottom:.8rem}
.ct2-card .ct-btns{margin-top:1.1rem!important}
.ct2-lens{width:clamp(190px,19vw,250px);aspect-ratio:1;border-radius:50%;overflow:hidden;background:#e7eef1;box-shadow:0 0 0 1px rgba(2,133,156,.45),0 0 0 8px #fff,0 0 0 9px rgba(2,133,156,.25),0 22px 40px -28px rgba(1,76,108,.6)}
.ct2-lens iframe{width:100%;height:100%;border:0;display:block}
@media (max-width:900px){
  .ct2-grid{grid-template-columns:1fr}
  .ct2-where-grid{grid-template-columns:1fr;justify-items:center;text-align:center}
  .ct2-card .ct-eyebrow{justify-content:center}.ct2-card .ct-btns{justify-content:center}.ct2-card .parking{justify-content:center}
  .ct2-lens{order:-1}
}
/* contact : rond à gauche (centré dans sa colonne), adresse à droite, dans l'axe du formulaire */
.ct2-where-grid .ct2-lens{order:-1;justify-self:center}
.ct2-where-grid .ct2-card{text-align:left;justify-self:start}
@media (max-width:900px){.ct2-where-grid .ct2-card{text-align:center;justify-self:center}}

/* Lien « Mentions légales » dans la bande sombre du bas + page Mentions légales (18/10/2026) */
.ft-left{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.4rem}
.copyright .ft-legal{font-weight:600}
.lp-legal{margin:1.6rem 0 0;font-size:.82rem;text-align:center}
.lp-legal a{color:inherit;opacity:.75;border-bottom:1px solid currentColor}
.page-title--legal{--pt-img:url('../img/galerie/photo-16-m.webp')}
.lg-title{padding-bottom:clamp(1rem,2.5vw,2rem)}
.lg-title .intro-head h2{max-width:18ch}
.lg-main{padding-top:clamp(1rem,2.5vw,2rem);padding-bottom:clamp(3rem,7vw,5.5rem)}
.lg-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}
.lg-toc{position:sticky;top:110px;padding:1.4rem 1.4rem 1.2rem;border-radius:20px;background:linear-gradient(150deg,rgba(2,133,156,.1),rgba(2,133,156,.03));border:1px solid rgba(2,133,156,.2)}
.lg-toc-h{margin:0 0 .8rem;font:700 .72rem/1 var(--f-title);letter-spacing:.2em;text-transform:uppercase;color:var(--teal)}
.lg-toc ol{list-style:none;margin:0;padding:0;counter-reset:lg;display:grid;gap:.15rem}
.lg-toc li{counter-increment:lg}
.lg-toc a{display:flex;gap:.7rem;align-items:baseline;padding:.4rem .3rem;border-radius:8px;font-size:.92rem;font-weight:600;color:var(--navy);transition:background .25s,color .25s}
.lg-toc a::before{content:"0" counter(lg);font-family:var(--f-display);font-style:italic;font-weight:400;font-size:.9rem;color:var(--teal)}
.lg-toc a:hover{background:rgba(255,255,255,.7);color:var(--teal)}
.lg-doc{max-width:760px}
.lg-art{padding-block:clamp(1.4rem,3vw,2rem);scroll-margin-top:100px}
.lg-art:first-child{padding-top:0}
.lg-art+.lg-art{border-top:1px solid rgba(1,76,108,.14)}
.lg-art h3{display:flex;align-items:baseline;gap:.9rem;margin:0 0 1.1rem;font-family:var(--f-display);font-weight:450;font-size:clamp(1.5rem,1.15rem + 1.1vw,2rem);letter-spacing:-.015em;line-height:1.15;color:var(--navy)}
.lg-art h3 span{font-size:.55em;font-style:italic;font-weight:400;color:var(--teal)}
.lg-art p{max-width:68ch}
.lg-art strong{color:var(--navy)}
.lg-dl{display:grid;grid-template-columns:minmax(150px,230px) minmax(0,1fr);margin:0 0 1.2rem;border-top:1px solid rgba(1,76,108,.1)}
.lg-dl dt,.lg-dl dd{margin:0;padding:.7rem 0;border-bottom:1px solid rgba(1,76,108,.1)}
.lg-dl dt{padding-right:1rem;font:700 .72rem/1.5 var(--f-title);letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.lg-dl dd{color:var(--navy);font-weight:500}
.lg-date{margin-top:1.4rem!important;font-style:italic;color:#6b7b84}
@media (max-width:900px){.lg-grid{grid-template-columns:1fr}.lg-toc{position:static}}
@media (max-width:560px){.lg-dl{grid-template-columns:1fr}.lg-dl dt{padding-bottom:0;border-bottom:0}.lg-dl dd{padding-top:.15rem}}

/* mentions légales : esperluette en Figtree (déjà .amp) et plus d'air entre le titre et le sommaire */
.lg-title{padding-bottom:clamp(2rem,4.5vw,3.6rem)}
.lg-main{padding-top:clamp(1.2rem,3vw,2.2rem)}

/* pied de page (18/10/2026) : « Mentions légales » discret ; statut du jour et bouton RDV sur la même largeur ; jour d'ouverture entouré d'un liseré blanc (plus de barre colorée sur un côté) */
.copyright .ft-legal{font-weight:400;font-size:.78rem;opacity:.6;border-bottom:0;text-decoration:none;transition:opacity .25s}
.copyright .ft-legal:hover{opacity:1;color:#fff;border-bottom:0;text-decoration:underline;text-underline-offset:3px}
.ft-cta{display:grid;gap:.7rem;width:max-content;max-width:100%;margin-top:.9rem}
.ft-cta .status{display:flex;justify-content:center;margin:0;width:auto}
.ft-cta .ft-btn{justify-content:center}
.site-footer .hrs{border:1px solid transparent;border-radius:12px}
.site-footer .hrs.is-today{background:rgba(255,255,255,.09);box-shadow:none;border-color:rgba(255,255,255,.75)}

/* Menu mobile (18/10/2026) : logo blanc centré, liens centrés, bloc du bas centré (statut, téléphone, bouton RDV, réseaux) */
.mo-top{position:relative;justify-content:center;height:92px}
.mo-top img{width:168px;height:auto;display:block}
.mo-close{position:absolute;right:-6px;top:23px}
.mo-nav{margin:auto 0;padding:.5rem 0;text-align:center}
.mo-nav li{width:min(300px,76%);margin-inline:auto}
.mo-nav li+li{border-top:1px solid rgba(255,255,255,.16)}
.mo-nav a{justify-content:center;gap:.9rem;padding:.8rem 0;border-bottom:0;font-size:clamp(1.9rem,8.4vw,2.6rem);transition:color .25s}
.mo-nav a:hover{color:#9fe3ee}
.mo-nav a[aria-current="page"]{font-style:italic}
.mo-nav .no{min-width:0;font-family:var(--f-title);font-style:normal;font-size:.7rem;letter-spacing:.16em;opacity:.55}
.mo-foot{justify-items:center;text-align:center;gap:.9rem}
.mo-foot .status{justify-self:center;padding:.55rem 1.1rem;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2)}
.mo-tel{font-family:var(--f-display);font-weight:450;font-size:1.9rem;letter-spacing:-.01em}
.mo-foot .mo-rdv{justify-self:center;width:100%;max-width:330px;display:inline-flex;align-items:center;justify-content:center;gap:.7rem;margin-top:.3rem;padding:1rem 1.4rem;border-radius:999px;font:700 .85rem/1 var(--f-title);letter-spacing:.09em;text-transform:uppercase}
.mo-rdv svg{width:17px;height:17px}
.mo-soc{display:flex!important;gap:.7rem;justify-content:center;margin:.4rem 0 0!important;opacity:1!important}
.mo-soc a{display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(255,255,255,.3);border-radius:50%;color:#fff;transition:background .3s,color .3s}
.mo-soc a:hover{background:#fff;color:var(--navy)}
.mo-soc svg{width:21px;height:21px}
.mo-legal{font-size:.74rem;color:rgba(255,255,255,.55);text-decoration:none}
.mo-legal:hover{color:#fff;text-decoration:underline}

/* Les deux ronds derrière les titres restent visibles sur mobile (identité visuelle), à taille réduite */
@media (max-width:900px){
  .intro-head::before,.intro-head::after{width:clamp(112px,34vw,150px)!important;top:-20%!important}
  .intro-head::before{left:-3%!important}
  .intro-head::after{left:calc(-3% + clamp(112px,34vw,150px) * .78)!important}
}
/* horaires du jour (accueil, contact) : liseré bleu autour de la période d'aujourd'hui, même fond clair ; plus de barre colorée d'un seul côté */
.hrs{border:1px solid transparent}
.hrs.is-today{box-shadow:none;border-color:var(--teal);border-radius:10px}
.hrs--row{border-radius:10px}

/* avis sur mobile : défilement automatique carte par carte, commandes (précédent / pause / suivant) centrées au-dessus du bouton */
.rv-play{display:none}
@media (max-width:900px){
  .rv-nav{flex-direction:column;align-items:center;gap:1.1rem}
  .rv-arrows{display:flex;order:-1;gap:.7rem}
  .rv-play{display:grid}
  .rv-play svg{width:15px;height:15px}
  .rv-play .i-play{display:none}
  .rv-play[aria-pressed="true"] .i-play{display:block}
  .rv-play[aria-pressed="true"] .i-pause{display:none}
}
@media (max-width:900px){.rv-row{align-items:flex-start}.rv-more{align-self:stretch}}

/* Pied de page — affichage mobile uniquement : tout centré, plus compact, complet (18/10/2026) */
@media (max-width:600px){
  .site-footer::after{display:none}
  .ft-grid{grid-template-columns:1fr;gap:1.3rem;padding-block:2.2rem 1.6rem;text-align:center}
  .ft-brand{align-items:center}
  .ft-brand img{width:176px;margin:0 auto .7rem}
  .site-footer p{font-size:.92rem}
  .ft-brand p{margin:0 0 .2rem}
  .ft-cta{margin:.9rem auto 0;width:min(100%,300px)}
  /* menu : liens sur une ligne qui passe à la ligne, sans numéros */
  .ft-nav h3{display:none}
  .ft-nav ul{display:flex;flex-wrap:wrap;justify-content:center;gap:.1rem 1.2rem}
  .ft-nav a{display:inline-block;padding:.25rem 0;font-size:1.08rem}
  .ft-nav .no{display:none}
  .ft-nav a:hover{transform:none}
  /* cartes horaires / contact : compactes, centrées */
  .ft-card{padding:1.1rem 1rem 1rem;text-align:center}
  .site-footer h3{margin-bottom:.7rem}
  .site-footer h3.ft-sub{margin-top:1rem}
  .ft-card .hrs{margin:0 0 .4rem;padding:.5rem .7rem}
  .ft-card p{margin-bottom:.25rem}
  .social-list{justify-content:center;gap:.5rem}
  .social-list a{padding:.45rem .9rem .45rem .7rem;font-size:.86rem}
  /* bande du bas : centrée, empilée */
  .ft-bar{align-items:center;justify-content:center;text-align:center;gap:.8rem}
  .ft-left{justify-content:center;gap:.3rem 1rem;font-size:.8rem}
  .ft-right{justify-content:center}
  .copyright{padding-block:1rem}
}
@media (max-width:600px){
  .ft-cta .status .txt{flex-direction:row;align-items:baseline;gap:.5rem}
  .ft-cta .status{padding:.6rem 1rem}
  .ft-card p{font-size:.88rem;line-height:1.5}
  .ft-card:first-of-type{padding-block:1rem .8rem}
  .ft-card .hrs{padding:.4rem .6rem;margin-bottom:.3rem}
  .ft-card .hrs strong{display:block}
  .ft-card p br:first-of-type{display:none}
  .ft-card a[href^="tel:"]{margin-right:.9rem}
  .ft-card h3{margin-bottom:.55rem}
  .ft-card .social-list{margin-top:.1rem}
  .ft-grid{gap:1rem}
}

/* mobile : menu du pied de page en liste verticale (alignée à gauche dans un bloc centré) ; nom du gérant sur sa propre ligne, jamais coupé */
.ft-name{white-space:nowrap}
@media (max-width:600px){
  .ft-nav ul{display:grid;justify-content:center;gap:.2rem;width:max-content;max-width:100%;margin-inline:auto;text-align:left}
  .ft-nav a{display:flex;align-items:baseline;gap:.8rem;font-size:1.15rem}
  .ft-nav .no{display:inline}
  .ft-name{display:block}
}
@media (max-width:600px){.ft-left{flex-direction:column;align-items:center;gap:.5rem}}
/* ACTIVISU® sur mobile : une seule colonne (texte puis tour dans son cercle), plus de colonne écrasée */
@media (max-width:900px){
  .vv-act-panel{grid-template-columns:minmax(0,1fr);padding:1.6rem 1.3rem 1.8rem;gap:1.6rem}
  .vv-act-text{min-width:0}
  .vv-act-logo{width:150px;margin-bottom:1rem}
  .vv-act-text h3{font-size:clamp(1.6rem,6.4vw,2rem)}
  .vv-tower{justify-self:center;width:min(240px,64vw);margin-top:.2rem}
}

/* SEO (18/10/2026) : H1 de l'accueil (même rendu que les H2), FAQ repliable, paragraphe de la page Marques */
h1.h2-like{font-family:var(--f-display);font-weight:450;letter-spacing:-.022em;text-align:left;text-wrap:balance;margin:0;color:var(--navy)}
h1.h2-like em{font-style:italic;font-weight:400;color:var(--teal)}
main h1.h2-like{font-size:var(--h2-size)!important;line-height:1.08!important}
.faq-sec{padding-block:clamp(2rem,5vw,3.6rem)}
.faq{max-width:900px;margin-inline:auto}
.faq-h{margin:0 0 1.4rem;font-family:var(--f-display);font-weight:450;font-size:clamp(1.7rem,1.2rem + 1.8vw,2.4rem);letter-spacing:-.018em;line-height:1.1;color:var(--navy)}
.faq-h em{font-style:italic;font-weight:400;color:var(--teal)}
.faq-list{display:grid;gap:.7rem}
.faq details{border:1px solid rgba(1,76,108,.14);border-radius:16px;background:#fff;transition:border-color .3s,box-shadow .3s}
.faq details[open]{border-color:rgba(2,133,156,.5);box-shadow:0 16px 34px -26px rgba(1,76,108,.55)}
.faq summary{position:relative;display:block;padding:1.05rem 3.2rem 1.05rem 1.3rem;cursor:pointer;list-style:none;font-family:var(--f-display);font-weight:450;font-size:clamp(1.05rem,.95rem + .5vw,1.28rem);line-height:1.3;color:var(--navy)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:1.3rem;top:50%;width:.55rem;height:.55rem;margin-top:-.4rem;border:solid var(--teal);border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform .35s var(--ease)}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:-.15rem}
.faq summary:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:16px}
.faq details p{margin:0;padding:0 1.3rem 1.2rem;max-width:70ch}
.mq-seo{max-width:70ch;margin:1.4rem auto 0;text-align:center;font-size:.92rem;color:#6b7b84}

/* Verres & vue : plus d air au-dessus du titre et des ronds */
.vv-intro{padding-top:clamp(5.5rem,11vw,9.5rem)}

/* Contact : plan agrandissable au clic (18/10/2026) */
.ct2-lens{position:relative}
.ct2-zoom{position:absolute;inset:0;z-index:2;width:100%;height:100%;border:0;border-radius:50%;background:transparent;cursor:zoom-in;color:#fff;display:flex;align-items:flex-end;justify-content:center;padding-bottom:12%}
.ct2-zoom svg{width:34px;height:34px;padding:8px;border-radius:50%;background:var(--navy);box-shadow:0 4px 12px -4px rgba(1,76,108,.6);transition:transform .3s var(--ease),background .3s}
.ct2-zoom:hover svg,.ct2-zoom:focus-visible svg{transform:scale(1.12);background:var(--teal)}
.map-modal{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:clamp(.8rem,3vw,2rem);background:rgba(1,43,62,.72);opacity:0;transition:opacity .35s var(--ease)}
.map-modal.is-open{opacity:1}
.map-modal-box{position:relative;width:min(1100px,100%);height:min(78vh,720px);border-radius:22px;overflow:hidden;background:#e7eef1;box-shadow:0 0 0 8px #fff,0 30px 70px -20px rgba(0,0,0,.6);transform:scale(.92);transition:transform .45s var(--ease)}
.map-modal.is-open .map-modal-box{transform:none}
.map-modal-box iframe{width:100%;height:100%;border:0;display:block}
.map-modal-close{position:absolute;top:.7rem;right:.7rem;z-index:2;width:42px;height:42px;border:0;border-radius:50%;background:var(--navy);color:#fff;font-size:1.5rem;line-height:1;cursor:pointer;box-shadow:0 4px 14px -4px rgba(0,0,0,.5)}
.map-modal-close:hover{background:var(--teal)}
.map-zoom{position:absolute;right:.7rem;bottom:1.6rem;z-index:2;display:flex;flex-direction:column;gap:.5rem}
.map-z{width:44px;height:44px;border:0;border-radius:50%;background:var(--navy);color:#fff;font:600 1.6rem/1 var(--f-text,inherit);cursor:pointer;box-shadow:0 4px 14px -4px rgba(0,0,0,.5);transition:background .25s,transform .25s}
.map-z:hover,.map-z:focus-visible{background:var(--teal);transform:scale(1.08)}

/* Avis : second bouton discret « Voir tous les avis » */
.rv-btns{display:inline-flex;align-items:center;gap:.9rem;flex-wrap:wrap}
.btn-avis-2{display:inline-flex;align-items:center;gap:.4rem;padding:.8rem 1.1rem;border-radius:999px;border:1px solid rgba(1,76,108,.28);color:var(--navy);font:600 .8rem/1 var(--f-title);letter-spacing:.06em;text-transform:uppercase;transition:border-color .3s,color .3s,background .3s}
.btn-avis-2 svg{width:14px;height:14px;transition:transform .3s var(--ease)}
.btn-avis-2:hover{border-color:var(--teal);color:var(--teal);background:rgba(2,133,156,.06)}
.btn-avis-2:hover svg{transform:translate(2px,-2px)}
@media (max-width:900px){.rv-btns{justify-content:center}}

/* Avis Google : réponse d'Optique Langoiran sous l'avis */
.rv-reply{margin:.9rem 0 0;padding:.75rem .9rem;background:rgba(2,133,156,.07);border-radius:12px}
.rv-reply b{display:block;margin:0 0 .25rem;font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--teal)}
.rv-reply p{font-size:.86rem;line-height:1.55;color:var(--text,#4d5d66)}

/* Page 404 : tableau d'acuité visuelle (optotypes qui rapetissent), mise au point ligne par ligne */
.nf{padding:clamp(2.2rem,5vw,4.5rem) 0 clamp(3rem,6vw,5.5rem)}
.nf-board{max-width:760px;margin:0 auto;padding:clamp(1.4rem,4vw,2.6rem) clamp(1rem,4vw,2.8rem);background:#fff;border:1px solid rgba(1,76,108,.1);border-radius:22px;box-shadow:0 26px 54px -34px rgba(1,76,108,.45);display:grid;gap:clamp(.7rem,1.8vw,1.2rem)}
.nf-row{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--navy);text-transform:uppercase}
.nf-row p,.nf-row h1{margin:0;font-weight:700;letter-spacing:.14em;line-height:1.1}
.nf-lab{position:absolute;left:0;top:50%;translate:0 -50%;font-size:.68rem;font-weight:600;letter-spacing:.06em;color:var(--teal);opacity:.7}
.nf-big{font-weight:800;font-size:clamp(5rem,20vw,10.5rem);letter-spacing:.02em!important;display:flex;align-items:center;gap:.04em}
.nf-lens{position:relative;display:inline-block;width:.74em;height:.74em;border-radius:50%;border:.045em solid var(--navy);box-shadow:0 0 0 .05em #fff,0 0 0 .07em var(--teal);background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.95),rgba(2,133,156,.16) 60%,rgba(2,133,156,.3))}
.nf-lens i{position:absolute;inset:18% auto auto 22%;width:20%;height:34%;border-radius:50%;background:rgba(255,255,255,.75);rotate:35deg}
.nf-r2 h1{font-family:var(--f-display);font-size:clamp(1.6rem,6vw,2.7rem);letter-spacing:.12em}
.nf-r3 p{font-size:clamp(.95rem,3vw,1.35rem)}
.nf-r4 p{font-size:clamp(.8rem,2.4vw,1.02rem)}
.nf-r5 p{font-size:clamp(.6rem,1.8vw,.74rem);letter-spacing:.1em;color:#6a7c86}
.nf-actions{display:grid;justify-items:center;gap:1.3rem;margin-top:clamp(1.6rem,3.5vw,2.4rem)}
.nf-links{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem .6rem}
.nf-links a{display:inline-block;padding:.42rem .95rem;border:1px solid rgba(1,76,108,.18);border-radius:999px;color:var(--navy);font-size:.88rem;text-decoration:none;transition:background .3s,color .3s,border-color .3s}
.nf-links a:hover,.nf-links a:focus-visible{background:var(--navy);border-color:var(--navy);color:#fff}
@keyframes nf-focus{from{opacity:0;filter:blur(14px)}to{opacity:1;filter:blur(0)}}
@media (prefers-reduced-motion:no-preference){
  .nf-row{animation:nf-focus 1.3s var(--ease) both}
  .nf-r2{animation-delay:.35s}.nf-r3{animation-delay:.7s}.nf-r4{animation-delay:1.05s}.nf-r5{animation-delay:1.4s}
  .nf-lens{animation:nf-spin-in 1.4s var(--ease) both}
}
@keyframes nf-spin-in{from{scale:.5;rotate:-90deg}to{scale:1;rotate:0deg}}
@media (max-width:560px){.nf-lab{display:none}}
