/* =====================================================
   TIME4U2 · Verre translucide clair
   ===================================================== */
:root{
  --white:#FFFFFF; --soft:#F5F8FC; --soft-2:#EBF1F8; --line:#E3EAF3;
  --blue:#2B6CB0; --blue-d:#1F4E85; --teal:#319795; --teal-d:#276F6E; --orange:#DD6B20;
  --ink:#0F1B33; --ink-2:#48566E; --ink-3:#7686A0; --red:#C53030; --green:#2F855A;
  --blue-soft:#EAF2FB; --teal-soft:#E4F6F5; --orange-soft:#FFF1E6; --green-soft:#E7F6EE; --red-soft:#FDECEC;
  --blue-t:#1F4E85; --teal-t:#1F6F6D; --orange-t:#B4530F; --green-t:#22693F; --red-t:#A32424;
  --shadow:0 8px 30px rgba(15,27,51,.07); --shadow-lg:0 26px 64px rgba(15,27,51,.16);
  --glass:rgba(255,255,255,.74); --glass-strong:rgba(255,255,255,.9);
  --edge:inset 0 1px 0 rgba(255,255,255,.95), inset 0 0 0 1px rgba(255,255,255,.5);
  --blur:blur(22px) saturate(180%);
  --r-xl:32px; --r-lg:24px; --radius:18px;
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text",Inter,"Segoe UI",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);color:var(--ink);background:#fff;line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}
img,svg,video{max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
.container{width:min(1180px,100% - 32px);margin-inline:auto}
h1,h2,h3,h4{line-height:1.14;letter-spacing:-.028em}
h2{font-size:clamp(1.8rem,4.2vw,2.7rem);font-weight:800}
h3{font-size:1.1rem;font-weight:700}
.eyebrow{display:inline-block;color:var(--teal-t);font-weight:700;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:.6rem}
.lead{color:var(--ink-2);font-size:1.1rem;max-width:60ch}
section{padding:64px 0}
.i{width:1.15em;height:1.15em;vertical-align:-.2em;stroke-width:2}
.muted{color:var(--ink-3)}
[hidden]{display:none!important}

/* Cartes blanches */
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.5rem;box-shadow:var(--shadow);position:relative}
.glass{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:var(--edge),0 10px 30px rgba(15,27,51,.12);border:1px solid rgba(255,255,255,.7)}

/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.78rem 1.4rem;border-radius:999px;font-weight:600;font-size:.95rem;transition:transform .2s cubic-bezier(.3,1.4,.6,1),box-shadow .2s,background .2s;border:1px solid transparent;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}.btn:active{transform:scale(.97)}
.btn-primary,.btn-teal,.btn-orange{color:#fff}
.btn-primary{background:linear-gradient(180deg,#4F98E8,#2B6CB0);box-shadow:0 8px 20px rgba(43,108,176,.30),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-teal{background:linear-gradient(180deg,#43BDB8,#2A8583);box-shadow:0 8px 20px rgba(49,151,149,.28),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-orange{background:linear-gradient(180deg,#FF9450,#DD6B20);box-shadow:0 8px 20px rgba(221,107,32,.28),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-ghost{background:#fff;border-color:var(--line);color:var(--ink);box-shadow:0 2px 8px rgba(15,27,51,.05)}
.btn-ghost:hover{border-color:var(--blue);color:var(--blue-t)}
.btn-danger{background:var(--red-soft);color:var(--red-t);border-color:#F6CACA}.btn-danger:hover{background:#F9D5D5}
.btn-ok{background:var(--green-soft);color:var(--green-t);border-color:#BFE6CF}.btn-ok:hover{background:#D2EFDE}
.btn-sm{padding:.4rem .9rem;font-size:.82rem}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.btn-lg{padding:.95rem 1.7rem;font-size:1rem}

/* Navigation */
header.top{position:sticky;top:0;z-index:50;padding-top:max(10px,env(safe-area-inset-top))}
.nav{display:flex;align-items:center;justify-content:space-between;height:62px;gap:1rem;padding:0 12px 0 14px;border-radius:999px;background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:var(--edge),0 8px 30px rgba(15,27,51,.10);border:1px solid var(--line)}
.logo{display:flex;align-items:center;gap:.6rem;font-weight:800;font-size:1.2rem;letter-spacing:-.03em}
.logo-mark{width:36px;height:36px;border-radius:12px;background:linear-gradient(140deg,#4F98E8,#319795);display:grid;place-items:center;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 6px 14px rgba(43,108,176,.30)}
.logo small{display:block;font-size:.6rem;font-weight:600;color:var(--ink-3);letter-spacing:.05em;margin-top:-4px}
.nav-links{display:none;gap:.2rem;font-weight:500;font-size:.92rem;color:var(--ink-2)}
.nav-links a{padding:.45rem .9rem;border-radius:999px;transition:.2s}
.nav-links a:hover{background:var(--soft);color:var(--blue-t)}
.nav-cta{display:flex;gap:.5rem;align-items:center}
.burger{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--soft)}
.mobile-menu{display:none;margin-top:8px;padding:.6rem 1.2rem;border-radius:var(--r-lg);background:var(--glass-strong);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--line);box-shadow:var(--shadow)}
.mobile-menu.open{display:block}
.mobile-menu a{display:block;padding:.7rem 0;font-weight:500;color:var(--ink-2)}
@media(min-width:900px){.nav-links{display:flex}.burger,.mobile-menu{display:none!important}}
.bell{position:relative;width:40px;height:40px;border-radius:50%;background:var(--soft);display:grid;place-items:center}
.bell .dotn{position:absolute;top:-3px;right:-3px;min-width:18px;height:18px;border-radius:999px;background:var(--orange);color:#fff;font-size:.68rem;font-weight:700;display:grid;place-items:center;padding:0 4px;border:2px solid #fff}

/* Hero */
.hero{padding:48px 0 40px}
.hero-grid{display:grid;gap:3rem;align-items:center}
.swiss-badge{display:inline-flex;align-items:center;gap:.55rem;background:#fff;border:1px solid var(--line);padding:.35rem .95rem .35rem .4rem;border-radius:999px;font-size:.82rem;font-weight:600;box-shadow:var(--shadow);margin-bottom:1.3rem}
.swiss-flag{width:22px;height:22px;border-radius:7px;background:#D52B1E;display:grid;place-items:center;position:relative}
.swiss-flag::before,.swiss-flag::after{content:"";position:absolute;background:#fff}
.swiss-flag::before{width:12px;height:4px}.swiss-flag::after{width:4px;height:12px}
.hero h1{font-size:clamp(2.4rem,6.2vw,4rem);font-weight:800;margin-bottom:1.2rem;letter-spacing:-.04em}
.hero h1 em{font-style:normal;background:linear-gradient(90deg,#2B6CB0,#319795 60%,#3AB6B0);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.9rem 0 1.6rem}
.trust{display:flex;flex-wrap:wrap;gap:.5rem}
.trust span{display:inline-flex;gap:.4rem;align-items:center;background:var(--soft);padding:.35rem .8rem;border-radius:999px;font-size:.82rem;font-weight:500;color:var(--ink-2)}
.trust .i{color:var(--teal-t)}
.hero-visual{position:relative;padding:0 0 26px}
.photo{border-radius:var(--r-xl);overflow:hidden;box-shadow:0 26px 60px rgba(15,27,51,.18),0 0 0 1px var(--line);position:relative;background:var(--soft-2)}
.photo img{width:100%;height:100%;object-fit:cover;display:block}
.hero-photo{aspect-ratio:4/3.4}
.float{position:absolute;display:flex;gap:.7rem;align-items:center;padding:.7rem 1rem .7rem .7rem;border-radius:22px;font-size:.85rem;line-height:1.3;animation:bob 6s ease-in-out infinite;z-index:2}
.float b{display:block;font-size:.88rem}.float small{color:var(--ink-2);font-size:.75rem}
.f1{top:14px;left:-6px}.f2{bottom:0;right:-4px;animation-delay:-2s}.f3{bottom:46px;left:14px;animation-delay:-4s}
@keyframes bob{50%{transform:translateY(-8px)}}
@media(max-width:600px){.f1{left:10px}.f2{right:10px}.f3{display:none}}
.fi{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:none;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.55)}
.fi.teal{background:linear-gradient(180deg,#43BDB8,#2A8583)}.fi.green{background:linear-gradient(180deg,#54C384,#2F855A)}.fi.orange{background:linear-gradient(180deg,#FF9450,#DD6B20)}.fi.blue{background:linear-gradient(180deg,#4F98E8,#2B6CB0)}
@media(min-width:960px){.hero-grid{grid-template-columns:1fr 1.05fr}}

/* Tags & avatars */
.tag{font-size:.7rem;font-weight:700;padding:.18rem .6rem;border-radius:999px;white-space:nowrap;border:1px solid transparent;display:inline-flex;align-items:center;gap:.25rem}
.tag-teal{background:var(--teal-soft);color:var(--teal-t);border-color:#BFE6E4}
.tag-orange{background:var(--orange-soft);color:var(--orange-t);border-color:#F8D3B4}
.tag-blue{background:var(--blue-soft);color:var(--blue-t);border-color:#C7DCF3}
.tag-grey{background:var(--soft-2);color:var(--ink-2)}
.tag-green{background:var(--green-soft);color:var(--green-t);border-color:#BFE6CF}
.tag-red{background:var(--red-soft);color:var(--red-t);border-color:#F6CACA}
.avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;flex:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}

/* Sections */
.center{text-align:center}.center .lead{margin-inline:auto}
.grid-2{display:grid;gap:1.4rem;margin-top:2.4rem}
@media(min-width:800px){.grid-2{grid-template-columns:1fr 1fr}}
.offer{display:flex;flex-direction:column;gap:.9rem;padding:.9rem .9rem 1.6rem;border-radius:var(--r-xl)}
.offer>*:not(.offer-img){margin-inline:.8rem}
.offer-img{position:relative;height:210px;border-radius:calc(var(--r-xl) - 10px);overflow:hidden}
.offer-img img{width:100%;height:100%;object-fit:cover;display:block}
.offer-img .glass{position:absolute;left:12px;bottom:12px;border-radius:999px;padding:.4rem .85rem;font-size:.8rem;font-weight:700;display:flex;gap:.4rem;align-items:center}
.offer ul{list-style:none;display:grid;gap:.5rem;color:var(--ink-2);font-size:.95rem}
.offer li{display:flex;gap:.6rem}.offer li .i{color:var(--teal-t);flex:none;margin-top:.25rem}
.offer.pro li .i{color:var(--orange-t)}
.price{font-size:1.5rem;font-weight:800;letter-spacing:-.03em}.price small{font-size:.85rem;font-weight:500;color:var(--ink-3)}

/* Vidéo */
.video-grid{display:grid;gap:1.4rem;margin-top:2.2rem;align-items:start}
@media(min-width:960px){.video-grid{grid-template-columns:1.6fr 1fr}}
.video-frame{aspect-ratio:16/9;background:#0F1B33;border-radius:var(--r-xl)}
.video-frame video{width:100%;height:100%;object-fit:cover;display:block;background:#0F1B33}
.vf-fallback{position:absolute;inset:0;background:#0F1B33}
.vf-slide{position:absolute;inset:0;opacity:0;transition:opacity 1s ease}
.vf-slide.on{opacity:1}
.vf-slide img{transform:scale(1.02);transition:transform 6s ease-out}
.vf-slide.on img{transform:scale(1.10)}
.vf-cap{position:absolute;left:16px;right:16px;bottom:16px;border-radius:22px;padding:.8rem 1.1rem;display:flex;gap:.8rem;align-items:center}
.vf-cap b{display:block}.vf-cap span{font-size:.85rem;color:var(--ink-2)}
.vf-badge{position:absolute;top:14px;left:14px;z-index:3;border-radius:999px;padding:.3rem .8rem;font-size:.75rem;font-weight:700;display:flex;gap:.4rem;align-items:center}
.scenes{list-style:none;display:grid;gap:.8rem}
.scene{display:flex;gap:.9rem;align-items:flex-start;padding:1rem 1.1rem;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);transition:.3s;cursor:pointer}
.scene.on{border-color:var(--blue);box-shadow:0 10px 30px rgba(43,108,176,.18)}
.scene .n{width:34px;height:34px;border-radius:50%;background:var(--soft-2);color:var(--ink-2);display:grid;place-items:center;font-weight:700;flex:none;transition:.3s}
.scene.on .n{background:linear-gradient(180deg,#4F98E8,#2B6CB0);color:#fff}
.scene h3{font-size:1rem;margin-bottom:.15rem}.scene p{font-size:.88rem;color:var(--ink-2);line-height:1.5}

.steps{display:grid;gap:1rem;margin-top:2.4rem}
@media(min-width:800px){.steps{grid-template-columns:repeat(4,1fr)}}
.step p{color:var(--ink-2);font-size:.93rem}
.step-n{width:40px;height:40px;border-radius:50%;background:linear-gradient(180deg,#4F98E8,#2B6CB0);color:#fff;display:grid;place-items:center;font-weight:700;margin-bottom:.9rem;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 6px 14px rgba(43,108,176,.28)}

/* Bento photos */
.bento{display:grid;gap:14px;grid-template-columns:repeat(2,1fr);grid-auto-rows:190px;margin-top:2.4rem}
.bento .photo{border-radius:var(--r-lg)}
.bento .photo img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.bento .photo:hover img{transform:scale(1.05)}
.cap{position:absolute;left:12px;right:12px;bottom:12px;padding:.65rem .9rem;border-radius:20px;font-size:.82rem;line-height:1.35;color:var(--ink);background:var(--glass-strong);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:var(--edge),0 8px 24px rgba(15,27,51,.18)}
.cap b{display:block;font-size:.9rem}.cap span{color:var(--ink-2)}
@media(min-width:900px){
  .bento{grid-template-columns:repeat(4,1fr);grid-auto-rows:220px}
  .b1{grid-column:1/3;grid-row:1}.b2{grid-column:3;grid-row:1/3}.b3{grid-column:4;grid-row:1}
  .b4{grid-column:1/3;grid-row:2}.b5{grid-column:4;grid-row:2}
}
.ai-note{margin-top:1rem;font-size:.78rem;color:var(--ink-3);text-align:center}

/* Carte */
.map-wrap{display:grid;gap:1.2rem;margin-top:2rem}
@media(min-width:960px){.map-wrap{grid-template-columns:330px 1fr}}
.filters{display:grid;gap:1.1rem;align-content:start}
label.l,.filters label{font-size:.82rem;font-weight:600;color:var(--ink-2);display:block;margin-bottom:.4rem}
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:3px;background:var(--soft-2);padding:4px;border-radius:999px}
.seg button{padding:.48rem .6rem;border-radius:999px;font-size:.78rem;font-weight:600;color:var(--ink-2);transition:.25s;white-space:nowrap}
.seg button.on{background:#fff;color:var(--blue-t);box-shadow:0 2px 8px rgba(15,27,51,.14)}
input[type=range]{width:100%;accent-color:var(--teal)}
select,input[type=text],input[type=email],input[type=password],input[type=date],input[type=time],input[type=number],input[type=tel],input[type=search],textarea{width:100%;padding:.75rem 1rem;border:1px solid var(--line);border-radius:14px;font:inherit;background:#fff;color:var(--ink);box-shadow:inset 0 1px 2px rgba(15,27,51,.05)}
select:focus,input:focus,textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(43,108,176,.14)}
.map-box{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-lg),0 0 0 1px var(--line);position:relative;min-height:440px;background:var(--soft-2)}
#map{position:absolute;inset:0}
.results{max-height:230px;overflow:auto;display:grid;gap:.5rem;padding-right:.2rem}
.res{display:flex;gap:.6rem;align-items:center;padding:.55rem .7rem;border-radius:16px;font-size:.85rem;cursor:pointer;text-align:left;width:100%;background:var(--soft);border:1px solid var(--line);transition:.2s}
.res:hover{transform:translateX(2px);border-color:var(--blue)}
.res .avatar{width:34px;height:34px;font-size:.8rem}
.res small{display:block;color:var(--ink-3);font-size:.75rem}
.pin{width:30px;height:30px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);border:2.5px solid #fff;box-shadow:0 4px 12px rgba(0,0,0,.35);cursor:pointer}
.pin.fam{background:linear-gradient(135deg,#43BDB8,#2A8583)}.pin.bs{background:linear-gradient(135deg,#FF9450,#DD6B20)}
.map-count{position:absolute;left:14px;top:14px;z-index:3;border-radius:999px;padding:.35rem .9rem;font-size:.8rem;font-weight:600;background:var(--glass-strong);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:var(--edge),0 6px 18px rgba(15,27,51,.16)}
.legend{display:flex;gap:1rem;font-size:.8rem;color:var(--ink-2);margin-top:.5rem}
.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:.35rem}
.maplibregl-popup-content{border-radius:18px!important;font-family:inherit;padding:12px 15px!important;box-shadow:0 12px 32px rgba(15,27,51,.22)!important}
.maplibregl-ctrl-group{border-radius:14px!important;overflow:hidden}

/* Charte */
.charter-grid{display:grid;gap:1rem;margin-top:2.4rem}
@media(min-width:700px){.charter-grid{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.charter-grid{grid-template-columns:repeat(4,1fr)}}
.pt{padding:1.5rem 1.3rem 1.3rem;transition:transform .3s cubic-bezier(.3,1.3,.6,1);overflow:hidden}
.pt:hover{transform:translateY(-6px)}
.pt-n{position:absolute;top:.6rem;right:1.1rem;font-size:2.6rem;font-weight:800;color:var(--soft-2);line-height:1;letter-spacing:-.05em}
.pt-ic{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(180deg,#4F98E8,#2B6CB0);color:#fff;margin-bottom:1rem;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 8px 16px rgba(43,108,176,.24)}
.pt:nth-child(even) .pt-ic{background:linear-gradient(180deg,#43BDB8,#2A8583);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 8px 16px rgba(49,151,149,.24)}
.pt h3{margin-bottom:.4rem;font-size:1.02rem}
.pt p{font-size:.9rem;color:var(--ink-2);line-height:1.55}
.pledge{margin-top:1.6rem;display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;border-radius:var(--r-xl);padding:1.6rem 1.9rem;background:linear-gradient(135deg,#2B6CB0,#319795);color:#fff;box-shadow:0 18px 40px rgba(43,108,176,.28)}
.pledge p{max-width:60ch;opacity:.95}

/* FAQ */
.faq{max-width:820px;margin:2rem auto 0;display:grid;gap:.7rem}
.faq details{background:#fff;border:1px solid var(--line);border-radius:20px;padding:1rem 1.3rem;box-shadow:var(--shadow)}
.faq summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.4rem;color:var(--blue);transition:.2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{color:var(--ink-2);margin-top:.6rem;font-size:.95rem}

/* Footer */
footer{padding:24px 0 max(28px,env(safe-area-inset-bottom));font-size:.9rem;color:var(--ink-2)}
.foot-box{border-radius:var(--r-xl);padding:2rem;background:var(--soft);border:1px solid var(--line)}
.foot{display:grid;gap:2rem}
@media(min-width:800px){.foot{grid-template-columns:1.5fr 1fr 1fr}}
footer h4{color:var(--ink);margin-bottom:.7rem;font-size:.95rem}
footer a{display:block;padding:.15rem 0;color:var(--ink-2)}footer a:hover{color:var(--blue-t)}
.copy{border-top:1px solid var(--line);margin-top:1.6rem;padding-top:1.1rem;font-size:.8rem;color:var(--ink-3)}

/* Modales */
.overlay{position:fixed;inset:0;background:rgba(15,27,51,.35);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;display:none;align-items:center;justify-content:center;padding:16px}
.overlay.open{display:flex}
.modal{background:#fff;border-radius:32px;width:min(480px,100%);max-height:92vh;overflow:auto;padding:1.9rem;box-shadow:var(--shadow-lg);border:1px solid var(--line);position:relative;animation:pop .3s cubic-bezier(.2,1.2,.4,1)}
.modal.wide{width:min(660px,100%)}
@keyframes pop{from{transform:translateY(16px) scale(.94);opacity:0}}
.modal .x{position:absolute;top:1rem;right:1rem;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--ink-2);background:var(--soft-2)}
.modal .x:hover{background:var(--line)}
.field{margin-top:1rem}.field label,.field>span.l{display:block;font-size:.83rem;font-weight:600;margin-bottom:.35rem;color:var(--ink-2)}
.hint{font-size:.78rem;color:var(--ink-3);margin-top:.4rem}
.err{color:var(--red-t);font-size:.83rem;margin-top:.6rem;min-height:1.2em}
.demo-box{background:var(--soft);border:1px dashed var(--line);border-radius:16px;padding:.75rem 1rem;font-size:.8rem;color:var(--ink-2);margin-top:1rem}
.demo-box button{color:var(--blue-t);font-weight:600;text-decoration:underline}
.checks{display:flex;flex-wrap:wrap;gap:.5rem}
.checks label{display:inline-flex;gap:.4rem;align-items:center;padding:.4rem .8rem;border:1px solid var(--line);border-radius:999px;font-size:.85rem;font-weight:500;cursor:pointer;background:#fff;margin:0;color:var(--ink)}
.checks input{accent-color:var(--teal)}
.stars{display:flex;gap:.2rem;font-size:2rem;color:#E1B12C}
.stars label{cursor:pointer;margin:0;font-size:2rem;color:#D9E0EA;line-height:1}
.stars input{display:none}
.stars label.on{color:#E8A317}
.star-r{color:#E8A317;letter-spacing:1px;font-size:.9rem}
.stars button{font-size:2rem;line-height:1;color:#D9E0EA;transition:.15s}.stars button.on{color:#E8A317}.stars button:hover{transform:scale(1.15)}

/* ============ Espaces connectés ============ */
.view{display:none}.view.active{display:block}
.dash{min-height:calc(100vh - 80px);padding:26px 0 70px}
.app{display:grid;gap:1.4rem}
@media(min-width:980px){.app{grid-template-columns:250px 1fr;align-items:start}}
.side{display:flex;gap:.3rem;overflow-x:auto;padding:.5rem;border-radius:var(--r-lg);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
@media(min-width:980px){.side{flex-direction:column;position:sticky;top:88px;padding:.7rem}}
.side .who-box{display:none;align-items:center;gap:.7rem;padding:.6rem .6rem 1rem;border-bottom:1px solid var(--line);margin-bottom:.4rem}
@media(min-width:980px){.side .who-box{display:flex}}
.side button.tabbtn{display:flex;align-items:center;gap:.7rem;padding:.65rem .95rem;border-radius:14px;font-weight:600;font-size:.9rem;color:var(--ink-2);text-align:left;white-space:nowrap;transition:.2s}
.side button.tabbtn:hover{background:var(--soft)}
.side button.tabbtn.on{background:var(--blue-soft);color:var(--blue-t)}
.side .badge{margin-left:auto;background:var(--orange);color:#fff;border-radius:999px;font-size:.68rem;padding:0 .45rem;min-width:18px;height:18px;display:grid;place-items:center;font-weight:700}
.main{min-width:0}
section.main{padding:0}
.page-head{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;margin-bottom:1.3rem}
.page-head h2{font-size:clamp(1.5rem,3.4vw,2.1rem)}
.page-head .sub{color:var(--ink-3);font-size:.92rem;margin-top:.15rem}
.row-actions{display:flex;flex-wrap:wrap;gap:.6rem}
.kpis{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:1.2rem}
.kpi{display:flex;flex-direction:column;gap:.3rem;padding:1.3rem}
.kpi .lab{font-size:.78rem;color:var(--ink-3);font-weight:600;display:flex;gap:.4rem;align-items:center}
.kpi .val{font-size:2rem;font-weight:800;letter-spacing:-.04em;line-height:1.15}
.kpi .sub{font-size:.78rem;color:var(--ink-3)}
.dots{display:flex;gap:.45rem;margin:.3rem 0}
.dot{width:36px;height:36px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;color:#fff;transition:.3s;background:var(--soft)}
.dot.full{background:linear-gradient(180deg,#43BDB8,#2A8583);border-color:#fff;box-shadow:0 6px 14px rgba(49,151,149,.3)}
.bar{height:9px;border-radius:99px;background:var(--soft-2);overflow:hidden}
.bar>i{display:block;height:100%;background:linear-gradient(90deg,#43BDB8,#4F98E8);border-radius:99px;transition:width .5s cubic-bezier(.3,1.2,.5,1)}
.grid-main{display:grid;gap:1.2rem}
@media(min-width:1100px){.grid-main.g21{grid-template-columns:1.7fr 1fr}}
.card>h3{display:flex;gap:.5rem;align-items:center;margin-bottom:1rem;justify-content:space-between}
.card>h3 .l{display:flex;gap:.5rem;align-items:center}
.list{display:grid;gap:.7rem}
.item{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center;justify-content:space-between;padding:.9rem 1.1rem;border-radius:20px;background:var(--soft);border:1px solid var(--line)}
.item .meta{min-width:0;flex:1 1 220px}
.item .meta b{display:block;font-size:.93rem}.item .meta span{font-size:.8rem;color:var(--ink-3);display:block}
.item .acts{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}
.empty{text-align:center;color:var(--ink-3);padding:1.6rem;font-size:.9rem}
.pills{display:flex;gap:4px;padding:4px;border-radius:999px;background:var(--soft-2);overflow-x:auto;width:max-content;max-width:100%;margin-bottom:1rem}
.pills button{padding:.45rem 1rem;font-weight:600;font-size:.84rem;color:var(--ink-2);border-radius:999px;white-space:nowrap;transition:.25s}
.pills button.on{background:#fff;color:var(--blue-t);box-shadow:0 2px 8px rgba(15,27,51,.14)}
.two{display:grid;gap:.8rem;grid-template-columns:1fr 1fr}
.three{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
.checklist{display:grid;gap:.55rem;font-size:.9rem}
.checklist div{display:flex;gap:.55rem;align-items:center}
.checklist .ok{color:var(--green-t)}.checklist .wait{color:var(--orange-t)}
.banner{display:flex;gap:.8rem;align-items:center;padding:.9rem 1.2rem;border-radius:20px;margin-bottom:1.2rem;font-size:.9rem;border:1px solid}
.banner.info{background:var(--blue-soft);border-color:#C7DCF3;color:var(--blue-t)}
.banner.warn{background:var(--orange-soft);border-color:#F8D3B4;color:var(--orange-t)}
.banner.bad{background:var(--red-soft);border-color:#F6CACA;color:var(--red-t)}
.banner .grow{flex:1}
.admin-banner{background:linear-gradient(135deg,#0F1B33,#26355C);color:#fff;border-radius:999px;padding:.7rem 1.2rem;display:flex;gap:.6rem;align-items:center;font-size:.85rem;margin-bottom:1.2rem;box-shadow:0 12px 30px rgba(15,27,51,.25)}
.admin-banner .i{color:#FFB27A}
.chart{display:flex;align-items:flex-end;gap:.6rem;height:200px;padding-top:1rem}
.chart .col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:.3rem;font-size:.72rem;color:var(--ink-3)}
.chart .b{width:100%;max-width:56px;background:linear-gradient(180deg,#4F98E8,#319795);border-radius:14px 14px 5px 5px;min-height:4px;transition:height .6s cubic-bezier(.3,1.2,.5,1)}
.chart .col b{color:var(--ink);font-size:.75rem}
table{width:100%;border-collapse:collapse;font-size:.88rem}
th{text-align:left;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);padding:.6rem .7rem;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:.7rem;border-bottom:1px solid var(--line);vertical-align:middle}
tr:last-child td{border-bottom:0}
.tbl{overflow-x:auto}
.num{text-align:right;font-variant-numeric:tabular-nums}
.searchbar{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1rem}
.searchbar>*{flex:1 1 160px}
.people{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.person{display:flex;flex-direction:column;gap:.7rem;padding:1.2rem}
.person .top{display:flex;gap:.8rem;align-items:center}
.person .top b{display:block}.person .top span{font-size:.8rem;color:var(--ink-3)}
.person p{font-size:.88rem;color:var(--ink-2)}
.person .foot-a{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:auto}
/* Messagerie */
.chat{display:grid;gap:1rem}
@media(min-width:800px){.chat{grid-template-columns:270px 1fr}}
.threads{display:grid;gap:.4rem;align-content:start}
.thread{display:flex;gap:.7rem;align-items:center;padding:.65rem .7rem;border-radius:16px;text-align:left;width:100%;transition:.2s}
.thread:hover{background:var(--soft)}.thread.on{background:var(--blue-soft)}
.thread .avatar{width:38px;height:38px;font-size:.82rem}
.thread b{display:block;font-size:.88rem}.thread>div{min-width:0;flex:1}.thread small{color:var(--ink-3);font-size:.75rem;display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.thread .badge{margin-left:auto;background:var(--orange);color:#fff;border-radius:999px;font-size:.68rem;min-width:18px;height:18px;display:grid;place-items:center;font-weight:700}
.chatbox{display:flex;flex-direction:column;height:480px;padding:0;overflow:hidden}
.chathead{padding:.9rem 1.2rem;border-bottom:1px solid var(--line);display:flex;gap:.7rem;align-items:center}
.msgs{flex:1;overflow:auto;padding:1rem 1.2rem;display:flex;flex-direction:column;gap:.5rem;background:var(--soft)}
.msg{max-width:78%;padding:.55rem .95rem;border-radius:20px;font-size:.9rem;line-height:1.45}
.msg.me{align-self:flex-end;background:linear-gradient(180deg,#4F98E8,#2B6CB0);color:#fff;border-bottom-right-radius:6px}
.msg.them{align-self:flex-start;background:#fff;border:1px solid var(--line);border-bottom-left-radius:6px}
.msg small{display:block;font-size:.66rem;opacity:.7;margin-top:.15rem}
.chatform{display:flex;gap:.6rem;padding:.8rem;border-top:1px solid var(--line)}
.chatform input{flex:1}
/* Calendrier */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal .dow{font-size:.72rem;font-weight:700;color:var(--ink-3);text-align:center;padding:.3rem 0;text-transform:uppercase}
.cal .day{aspect-ratio:1/.9;border-radius:14px;background:var(--soft);border:1px solid var(--line);padding:.35rem;font-size:.8rem;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;text-align:left;transition:.2s;min-height:52px}
.cal .day:hover{border-color:var(--blue)}
.cal .day.off{opacity:.35}.cal .day.today{border-color:var(--teal);box-shadow:0 0 0 2px rgba(49,151,149,.25)}
.cal .day.sel{background:var(--blue-soft);border-color:var(--blue)}
.cal .day .dts{display:flex;gap:3px;flex-wrap:wrap}
.cal .day .dts i{width:7px;height:7px;border-radius:50%;background:var(--teal)}
.cal .day .dts i.pro{background:var(--orange)}.cal .day .dts i.give{background:var(--blue)}
/* Switch */
.switch{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--line)}
.switch:last-child{border-bottom:0}
.switch b{display:block;font-size:.92rem}.switch span{font-size:.8rem;color:var(--ink-3)}
.switch input{appearance:none;-webkit-appearance:none;width:50px;height:30px;border-radius:999px;background:var(--soft-2);position:relative;cursor:pointer;transition:.25s;flex:none;border:1px solid var(--line);padding:0;box-shadow:none}
.switch input::after{content:"";position:absolute;top:2px;left:2px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(15,27,51,.3);transition:.25s}
.switch input:checked{background:var(--teal);border-color:var(--teal)}
.switch input:checked::after{transform:translateX(20px)}
.charter-check{display:grid;gap:.5rem}
.charter-check label{display:flex;gap:.7rem;align-items:flex-start;padding:.7rem .9rem;border-radius:16px;background:var(--soft);border:1px solid var(--line);cursor:pointer;font-size:.88rem;margin:0}
.charter-check input{accent-color:var(--teal);margin-top:.25rem;width:auto}
.charter-check b{display:block;color:var(--ink)}.charter-check span{color:var(--ink-2);font-size:.82rem}
.toast-wrap{position:fixed;bottom:max(18px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:300;display:grid;gap:.5rem;width:min(430px,calc(100% - 24px))}
.toast{background:rgba(15,27,51,.92);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:#fff;padding:.8rem 1.15rem;border-radius:999px;font-size:.88rem;box-shadow:0 16px 40px rgba(15,27,51,.35);animation:pop .3s cubic-bezier(.2,1.2,.4,1);display:flex;gap:.6rem;align-items:center}
.toast.warn{background:rgba(196,84,16,.95)}.toast.ok{background:rgba(31,111,109,.95)}
.hide-sm{display:none}@media(min-width:600px){.hide-sm{display:inline}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ===== Verre translucide clair (teintes chaudes, sans bleu) ===== */
:root{--soft:rgba(255,255,255,.5);--soft-2:rgba(140,115,90,.10);--line:rgba(140,115,90,.18);--ink:#231F1B;--ink-2:#5C554D;--ink-3:#8C8377;--shadow:0 12px 40px rgba(120,80,40,.10)}
body{background:#FBF7F2}
body::before{content:"";position:fixed;inset:-10%;z-index:-2;background:
  radial-gradient(46vmax 46vmax at 8% 6%,rgba(255,196,160,.55),transparent 62%),
  radial-gradient(44vmax 44vmax at 94% 10%,rgba(255,228,166,.55),transparent 62%),
  radial-gradient(46vmax 46vmax at 82% 96%,rgba(255,186,200,.42),transparent 62%),
  radial-gradient(40vmax 40vmax at 4% 90%,rgba(196,234,212,.50),transparent 62%),
  linear-gradient(180deg,#FFFDFB,#FAF3EA)}
body::after{content:"";position:fixed;z-index:-1;width:46vmax;height:46vmax;left:30%;top:30%;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.75),transparent 65%);filter:blur(30px);opacity:.6;animation:drift 26s ease-in-out infinite alternate;pointer-events:none}
@keyframes drift{to{transform:translate(-18vmax,12vmax) scale(1.15)}}
.card,.side,.faq details,.scene,.foot-box,.mobile-menu{background:linear-gradient(135deg,rgba(255,255,255,.72),rgba(255,255,255,.34) 50%,rgba(255,255,255,.56));-webkit-backdrop-filter:blur(26px) saturate(185%);backdrop-filter:blur(26px) saturate(185%);border:1px solid rgba(255,255,255,.8);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 0 0 1px rgba(255,255,255,.45),0 14px 44px rgba(120,80,40,.10),0 2px 8px rgba(120,80,40,.05)}
.modal{background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,255,255,.76));-webkit-backdrop-filter:blur(40px) saturate(190%);backdrop-filter:blur(40px) saturate(190%);border:1px solid rgba(255,255,255,.85);box-shadow:inset 0 1px 0 #fff,0 40px 90px rgba(90,60,30,.25)}
.nav{background:linear-gradient(135deg,rgba(255,255,255,.7),rgba(255,255,255,.4));border:1px solid rgba(255,255,255,.85);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 10px 34px rgba(120,80,40,.12)}
.glass,.cap,.map-count{background:linear-gradient(135deg,rgba(255,255,255,.8),rgba(255,255,255,.5));border:1px solid rgba(255,255,255,.85)}
.item,.res,.trust span,.thread:hover,.burger,.bell,.scene .n,.cal .day,.dot,.charter-check label,.demo-box{background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.85);box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
.dot.full{background:linear-gradient(180deg,#43BDB8,#2A8583);border-color:#fff}
.scene.on .n{background:linear-gradient(180deg,#4F98E8,#2B6CB0)}
.thread.on{background:rgba(255,255,255,.8)}
.swiss-badge{background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(18px) saturate(170%);backdrop-filter:blur(18px) saturate(170%);border:1px solid rgba(255,255,255,.85);box-shadow:inset 0 1px 0 #fff,0 8px 24px rgba(120,80,40,.10)}
.btn-ghost{background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(16px) saturate(170%);backdrop-filter:blur(16px) saturate(170%);border-color:rgba(255,255,255,.85);box-shadow:inset 0 1px 0 #fff,0 4px 14px rgba(120,80,40,.10)}
.seg,.pills{background:rgba(140,115,90,.12)}
.seg button.on,.pills button.on,.tabs button.on{background:rgba(255,255,255,.9)}
select,input[type=text],input[type=email],input[type=password],input[type=date],input[type=time],input[type=number],input[type=tel],input[type=search],textarea{background:rgba(255,255,255,.66);border:1px solid rgba(255,255,255,.9);box-shadow:inset 0 1px 3px rgba(120,80,40,.10),0 1px 0 rgba(255,255,255,.7);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.checks label,.stars{background:rgba(255,255,255,.6)}
.msgs{background:rgba(255,255,255,.3)}.msg.them{background:rgba(255,255,255,.85);border-color:rgba(255,255,255,.9)}
.chathead,.chatform{border-color:rgba(140,115,90,.15)}
.overlay{background:rgba(70,45,20,.22);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%)}
.map-box{background:#F3ECE3;box-shadow:0 22px 56px rgba(120,80,40,.16),0 0 0 1px rgba(255,255,255,.8)}
.photo{box-shadow:0 26px 60px rgba(120,80,40,.20),0 0 0 1px rgba(255,255,255,.8)}
.pt-n{color:rgba(255,255,255,.85)}
.hero h1 em{background:linear-gradient(90deg,#2A8583,#5FB39A 55%,#D98A4A);-webkit-background-clip:text;background-clip:text;color:transparent}
.pledge{background:linear-gradient(135deg,rgba(42,133,131,.92),rgba(95,179,154,.88));box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 18px 40px rgba(42,133,131,.25)}
.toast{background:rgba(35,31,27,.9)}
.admin-banner{background:linear-gradient(135deg,rgba(35,31,27,.9),rgba(70,58,46,.85))}
.banner.info{background:rgba(255,255,255,.6);border-color:rgba(255,255,255,.9);color:var(--ink)}
.side button.tabbtn.on{background:rgba(255,255,255,.92);color:var(--teal-t);box-shadow:inset 0 1px 0 #fff,0 4px 14px rgba(120,80,40,.12)}
.scene.on{border-color:var(--teal)}

/* ===== Application installable (PWA) ===== */
html{-webkit-text-size-adjust:100%}
body{-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}
button,a,select,input,label,summary{touch-action:manipulation}
html.standalone [data-install]{display:none!important}
html.standalone #appmobile{display:none}
.pwa-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:max(16px,env(safe-area-inset-bottom));z-index:250;width:min(540px,calc(100% - 24px));display:flex;gap:.8rem;align-items:center;padding:.85rem 1rem .85rem 1.1rem;border-radius:26px;background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,255,255,.78));-webkit-backdrop-filter:blur(30px) saturate(190%);backdrop-filter:blur(30px) saturate(190%);border:1px solid rgba(255,255,255,.9);box-shadow:inset 0 1px 0 #fff,0 18px 50px rgba(90,60,30,.28);animation:pop .35s cubic-bezier(.2,1.2,.4,1);font-size:.9rem}
.pwa-bar .grow{flex:1;line-height:1.35}.pwa-bar b{display:block}
.pwa-bar .x2{width:32px;height:32px;border-radius:50%;background:rgba(140,115,90,.12);display:grid;place-items:center;flex:none}
.howto{margin:.6rem 0 0 1.2rem;display:grid;gap:.5rem;color:var(--ink-2);font-size:.95rem}
.howto li::marker{font-weight:700;color:var(--teal-t)}
.app-grid .card h3{margin-bottom:.4rem}

/* ===== Carte : mode sombre, puces avec photo au survol ===== */
.avatar.av-photo{background-size:cover;background-position:center;box-shadow:0 0 0 2px #fff,0 4px 12px rgba(35,31,27,.22)}
.map-box{isolation:isolate}
.map-box.dark{background:#0F1A1E;box-shadow:0 30px 70px rgba(10,20,25,.5),0 0 0 1px rgba(255,255,255,.10),0 0 70px rgba(47,181,174,.13)}
.map-box.dark::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 110px rgba(4,10,13,.6);background:linear-gradient(180deg,rgba(4,10,13,.28),transparent 22%)}
.map-count,.map-theme{position:absolute;z-index:4}
.map-box.dark .map-count,.map-box.dark .map-theme{background:linear-gradient(135deg,rgba(28,42,48,.82),rgba(16,26,30,.72));color:#E8F3F1;border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 10px 28px rgba(0,0,0,.4)}
.map-theme{left:14px;bottom:14px;display:flex;gap:3px;padding:4px;border-radius:999px;background:var(--glass-strong);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:var(--edge),0 8px 24px rgba(15,27,51,.18)}
.map-theme button{display:inline-flex;align-items:center;gap:.35rem;padding:.4rem .8rem;border-radius:999px;font-size:.78rem;font-weight:600;color:var(--ink-2);transition:.25s}
.map-box.dark .map-theme button{color:#9DB3B1}
.map-theme button.on{background:#fff;color:var(--ink);box-shadow:0 2px 8px rgba(15,27,51,.2)}
.map-box.dark .map-theme button.on{background:linear-gradient(180deg,#43BDB8,#2A8583);color:#fff;box-shadow:0 4px 14px rgba(47,181,174,.4)}
.map-box.dark .maplibregl-ctrl-group{background:rgba(22,34,39,.82)!important;border:1px solid rgba(255,255,255,.14);box-shadow:0 10px 28px rgba(0,0,0,.4)!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.map-box.dark .maplibregl-ctrl-group button+button{border-top:1px solid rgba(255,255,255,.12)}
.map-box.dark .maplibregl-ctrl-icon{filter:invert(1) brightness(1.3)}
.map-box.dark .maplibregl-ctrl-group button:hover{background:rgba(255,255,255,.08)}
.map-box.dark .maplibregl-ctrl-attrib{background:rgba(16,26,30,.65)!important;color:#8AA09E;border-radius:10px 0 0 0}
.map-box.dark .maplibregl-ctrl-attrib a{color:#9DB8B5}
.maplibregl-ctrl-top-right{z-index:4}

/* Puce de localisation */
.pin-wrap{width:36px;height:46px;cursor:pointer;outline:none;filter:drop-shadow(0 8px 10px rgba(0,0,0,.45))}
.pin-wrap svg{display:block;width:36px;height:46px;overflow:visible;transform-origin:50% 100%;transition:transform .3s cubic-bezier(.3,1.6,.6,1)}
.pin-wrap .pin-body{stroke:#fff;stroke-width:2.5;stroke-linejoin:round}
.pin-wrap.fam .pin-body{fill:#2FB5AE}.pin-wrap.bs .pin-body{fill:#F28A47}
.map-box.dark .pin-wrap.fam{filter:drop-shadow(0 0 9px rgba(47,181,174,.75)) drop-shadow(0 8px 8px rgba(0,0,0,.5))}
.map-box.dark .pin-wrap.bs{filter:drop-shadow(0 0 9px rgba(242,138,71,.75)) drop-shadow(0 8px 8px rgba(0,0,0,.5))}
.pin-wrap:hover,.pin-wrap:focus-visible,.pin-wrap.open{z-index:30}
.pin-wrap:hover svg,.pin-wrap:focus-visible svg,.pin-wrap.open svg{transform:scale(1.2) translateY(-2px)}
.pin-wrap:focus-visible svg{filter:drop-shadow(0 0 0 #fff)}

/* Carte photo au survol */
.pin-card{position:absolute;left:50%;bottom:calc(100% + 12px);width:236px;text-align:left;color:var(--ink);white-space:normal;
  opacity:0;pointer-events:none;transform:translate(calc(-50% + var(--dx,0px)),10px) scale(.94);transform-origin:50% 100%;
  transition:opacity .18s ease,transform .3s cubic-bezier(.2,1.25,.4,1);
  filter:drop-shadow(0 22px 34px rgba(0,0,0,.5))}
.pin-card::after{content:"";position:absolute;left:calc(50% + var(--ax,0px));bottom:-6px;width:16px;height:16px;background:#fff;transform:translateX(-50%) rotate(45deg);border-radius:0 0 5px 0}
.pc-inner{position:relative;z-index:1;background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(255,251,246,.96));border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.9)}
.pin-wrap:hover .pin-card,.pin-wrap:focus-visible .pin-card{opacity:1;transform:translate(calc(-50% + var(--dx,0px)),0) scale(1)}
.pin-wrap.open .pin-card{display:none}
.pin-wrap.below .pin-card{bottom:auto;top:calc(100% + 12px);transform-origin:50% 0;transform:translate(calc(-50% + var(--dx,0px)),-10px) scale(.94)}
.pin-wrap.below:hover .pin-card,.pin-wrap.below:focus-visible .pin-card{transform:translate(calc(-50% + var(--dx,0px)),0) scale(1)}
.pin-wrap.below .pin-card::after{bottom:auto;top:-6px;border-radius:5px 0 0 0}
.pc-photo{position:relative;height:138px;background:var(--soft-2);overflow:hidden}
.pc-photo img{width:100%;height:100%;object-fit:cover;display:block;user-select:none}
.pc-photo::after{content:"";position:absolute;inset:auto 0 0 0;height:60%;background:linear-gradient(180deg,transparent,rgba(20,14,8,.5));pointer-events:none}
.pc-photo.ph{display:grid;place-items:center;font-size:2.6rem;font-weight:800;color:#fff;letter-spacing:-.03em}
.pc-photo.ph.fam{background:linear-gradient(135deg,#43BDB8,#2A8583)}.pc-photo.ph.bs{background:linear-gradient(135deg,#FF9450,#DD6B20)}
.pc-tag{position:absolute;left:10px;bottom:10px;z-index:2;font-size:.68rem;font-weight:700;padding:.22rem .65rem;border-radius:999px;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 4px 12px rgba(0,0,0,.3)}
.pc-tag.fam{background:rgba(31,124,122,.94)}.pc-tag.bs{background:rgba(204,90,20,.95)}
.pc-body{padding:.75rem 1rem .95rem;display:grid;gap:.15rem;line-height:1.35}
.pc-body b{font-size:1rem;letter-spacing:-.01em}
.pc-area{font-size:.78rem;color:var(--ink-3)}.pc-note{font-size:.8rem;color:var(--ink-2)}
.pc-rate{font-size:.78rem;color:var(--ink-3);margin-top:.15rem}
.pc-cta{margin-top:.6rem;padding:.6rem 1rem;border-radius:999px;font-weight:600;font-size:.88rem;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 6px 16px rgba(0,0,0,.2);transition:transform .2s}
.pc-cta:hover{transform:translateY(-1px)}
.pc-cta.fam{background:linear-gradient(180deg,#43BDB8,#2A8583)}.pc-cta.bs{background:linear-gradient(180deg,#FF9450,#DD6B20)}

/* Fenêtre au clic (aussi utilisée sur mobile) */
.pin-popup .maplibregl-popup-content{padding:0!important;width:250px;border-radius:22px!important;overflow:hidden;background:rgba(255,255,255,.97)!important;box-shadow:0 28px 70px rgba(0,0,0,.5)!important}
.pin-popup .maplibregl-popup-close-button{top:8px;right:8px;width:28px;height:28px;border-radius:50%;background:rgba(20,14,8,.55);color:#fff;font-size:18px;line-height:26px;padding:0;z-index:3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.pin-popup .maplibregl-popup-close-button:hover{background:rgba(20,14,8,.8)}
.pin-popup.maplibregl-popup-anchor-bottom .maplibregl-popup-tip{border-top-color:rgba(255,255,255,.97)}
.pin-popup.maplibregl-popup-anchor-top .maplibregl-popup-tip{border-bottom-color:rgba(255,255,255,.97)}
@media(max-width:600px){.map-box{min-height:520px}.map-theme button{padding:.4rem .65rem}}
@media(hover:none){.pin-card{display:none}}

/* Repli raster en mode sombre : le fond gris est inversé, puis teinté turquoise */
.map-box.filter-dark .maplibregl-canvas{filter:invert(1) hue-rotate(180deg) brightness(.92) contrast(.95) saturate(.5)}
.map-box.filter-dark::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(160deg,rgba(24,72,80,.5),rgba(10,38,46,.3) 55%,rgba(30,60,60,.45));mix-blend-mode:screen}
/* Cercle de rayon */
.radius-ring{position:absolute;left:0;top:0;border-radius:50%;pointer-events:none;border:2px dashed #2B6CB0;background:radial-gradient(circle,rgba(43,108,176,.05),rgba(49,151,149,.10) 75%,rgba(49,151,149,.16))}
.map-box.dark .radius-ring{border-color:#6FE3DA;background:radial-gradient(circle,rgba(47,181,174,.05),rgba(47,181,174,.12) 75%,rgba(47,181,174,.22));box-shadow:0 0 34px rgba(47,181,174,.4),inset 0 0 46px rgba(47,181,174,.16)}

/* Drapeau suisse sur le logo */
.logo-mark{position:relative;overflow:visible}
.logo-mark::after{content:"";position:absolute;right:-6px;bottom:-6px;width:17px;height:17px;border-radius:5px;box-shadow:0 0 0 2px #fff,0 3px 8px rgba(35,31,27,.3);
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' fill='%23D52B1E'/%3E%3Cpath fill='%23fff' d='M13 6h6v7h7v6h-7v7h-6v-7H6v-6h7z'/%3E%3C/svg%3E") center/cover no-repeat}
.logo{gap:.85rem}
.logo-mark::after{right:-7px;bottom:-7px}

/* Icône de l'application */
.app-ico{border-radius:22%;display:block;box-shadow:0 8px 22px rgba(43,108,176,.3),0 0 0 1px rgba(255,255,255,.7)}
.app-ico.sm{width:44px;height:44px;flex:none;border-radius:12px;box-shadow:0 4px 12px rgba(43,108,176,.28)}
.app-ico.lg{width:88px;height:88px;margin:0 auto .9rem;border-radius:22px}

/* ===== Verre renforcé : plus de transparence, flou plus profond, superpositions visibles ===== */
body::before{background:
  radial-gradient(44vmax 44vmax at 6% 8%,rgba(255,182,140,.78),transparent 62%),
  radial-gradient(42vmax 42vmax at 96% 8%,rgba(255,222,140,.72),transparent 62%),
  radial-gradient(46vmax 46vmax at 84% 94%,rgba(255,170,190,.62),transparent 62%),
  radial-gradient(40vmax 40vmax at 4% 92%,rgba(170,228,200,.68),transparent 62%),
  radial-gradient(34vmax 34vmax at 48% 42%,rgba(214,196,255,.42),transparent 64%),
  linear-gradient(180deg,#FFFDFB,#FAF1E6)}
.card,.side,.faq details,.scene,.foot-box,.mobile-menu{
  background:linear-gradient(135deg,rgba(255,255,255,.44),rgba(255,255,255,.12) 52%,rgba(255,255,255,.28));
  -webkit-backdrop-filter:blur(36px) saturate(210%);backdrop-filter:blur(36px) saturate(210%);
  border:1px solid rgba(255,255,255,.72);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.98),inset 1px 0 0 rgba(255,255,255,.65),inset 0 0 0 1px rgba(255,255,255,.22),inset 0 -1px 0 rgba(120,80,40,.06),0 20px 56px rgba(120,80,40,.13),0 2px 8px rgba(120,80,40,.05)}
.nav{background:linear-gradient(135deg,rgba(255,255,255,.5),rgba(255,255,255,.16));-webkit-backdrop-filter:blur(36px) saturate(210%);backdrop-filter:blur(36px) saturate(210%);border:1px solid rgba(255,255,255,.75);box-shadow:inset 0 1px 0 rgba(255,255,255,.98),0 14px 44px rgba(120,80,40,.14)}
.modal{background:linear-gradient(135deg,rgba(255,255,255,.62),rgba(255,255,255,.34));-webkit-backdrop-filter:blur(48px) saturate(220%);backdrop-filter:blur(48px) saturate(220%);border:1px solid rgba(255,255,255,.8);box-shadow:inset 0 1px 0 #fff,0 44px 100px rgba(90,60,30,.28)}
.overlay{background:rgba(70,45,20,.16);-webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%)}
.glass,.cap,.map-count,.pwa-bar{background:linear-gradient(135deg,rgba(255,255,255,.58),rgba(255,255,255,.26));-webkit-backdrop-filter:blur(30px) saturate(220%);backdrop-filter:blur(30px) saturate(220%);border:1px solid rgba(255,255,255,.78)}
.item,.res,.trust span,.thread:hover,.burger,.bell,.scene .n,.cal .day,.dot,.charter-check label,.demo-box,.checks label,.stars{background:rgba(255,255,255,.30);border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.85)}
.thread.on,.res:hover{background:rgba(255,255,255,.52)}
.msgs{background:rgba(255,255,255,.14)}.msg.them{background:rgba(255,255,255,.62)}
.swiss-badge,.btn-ghost{background:rgba(255,255,255,.4);-webkit-backdrop-filter:blur(20px) saturate(190%);backdrop-filter:blur(20px) saturate(190%);border-color:rgba(255,255,255,.8)}
.seg,.pills,.tabs{background:rgba(140,115,90,.10)}
.seg button.on,.pills button.on,.tabs button.on,.side button.tabbtn.on{background:rgba(255,255,255,.66);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 1px 0 #fff,0 4px 14px rgba(120,80,40,.12)}
select,input[type=text],input[type=email],input[type=password],input[type=date],input[type=time],input[type=number],input[type=tel],input[type=search],textarea{background:rgba(255,255,255,.42);border:1px solid rgba(255,255,255,.85)}
.banner.info{background:rgba(255,255,255,.34)}
.pc-inner{background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,251,246,.84));-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}
.toast{background:rgba(35,31,27,.72);-webkit-backdrop-filter:blur(26px) saturate(180%);backdrop-filter:blur(26px) saturate(180%)}
.app-grid .card>h3{justify-content:flex-start;gap:.6rem}