/* Centre de santé des Quais — feuille de style (V1)
   Charte : beige #F3EDE2 · sauge #7A8F6E · bois #A47551 · olive #4E5D44 · linéale Jost */
@font-face{font-family:"Cormorant Garamond";src:url(fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Jost;src:url(fonts/jost-latin-300-normal.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:Jost;src:url(fonts/jost-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Jost;src:url(fonts/jost-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Jost;src:url(fonts/jost-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
:root{--beige:#F3EDE2;--beige-2:#EAE1D1;--sauge:#7A8F6E;--sauge-deep:#5C7051;--sauge-soft:#E3E8DC;--bois:#A47551;--bois-deep:#7E5639;--olive:#4E5D44;--ink:#33402D;--body:#4A5346;--muted:#6F7768;--card:#FFFDF9;--line:#E2D9C8;--radius:14px;--shadow:0 10px 30px -18px rgba(60,55,40,.35)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:Jost,"Helvetica Neue",Arial,sans-serif;font-weight:400;font-size:17px;line-height:1.65;color:var(--body);background:var(--beige)}
img{max-width:100%;height:auto;display:block}
a{color:var(--sauge-deep)}
a:hover{color:var(--bois-deep)}
:focus-visible{outline:3px solid var(--bois);outline-offset:2px;border-radius:4px}
h1,h2,h3,h4{color:var(--olive);font-weight:500;line-height:1.2;margin:0 0 .5em}
h1,h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;letter-spacing:0}
h1{font-size:clamp(2.2rem,5.6vw,3.5rem);line-height:1.1}
h2{font-size:clamp(1.7rem,3.6vw,2.4rem)}
h3{font-size:1.2rem}
p{margin:0 0 1em}
.container{width:min(1160px,100% - 40px);margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--olive);color:#fff;padding:8px 14px;z-index:100}
.skip:focus{left:10px;top:10px}
.kicker{display:inline-block;text-transform:uppercase;letter-spacing:.22em;font-size:.76rem;font-weight:500;color:var(--bois);margin-bottom:14px}
.lead{font-size:1.15rem;color:var(--body);max-width:60ch}
.ph{background:repeating-linear-gradient(135deg,rgba(164,117,81,.10) 0 6px,rgba(164,117,81,.18) 6px 12px);outline:1px dashed var(--bois);border-radius:3px;padding:0 3px}
.v1-banner{background:var(--olive);color:#F3EDE2;font-size:.82rem;text-align:center;padding:6px 12px;letter-spacing:.02em}
/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 24px;border-radius:999px;font:500 1rem/1.2 Jost,Arial,sans-serif;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.btn-main{background:var(--sauge-deep);color:#fff}
.btn-main:hover{background:var(--olive);color:#fff}
.btn-outline{border-color:var(--sauge-deep);color:var(--sauge-deep);background:transparent}
.btn-outline:hover{background:var(--sauge-deep);color:#fff}
.btn-wood{background:var(--bois);color:#fff}
.btn-wood:hover{background:var(--bois-deep);color:#fff}
.btn svg{width:18px;height:18px}
.tel-off{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:.95rem}
/* En-tête */
.site-header{position:sticky;top:0;z-index:50;background:rgba(243,237,226,.96);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px}
.brand img{height:58px;width:auto}
.main-nav{display:none;gap:4px;align-items:center}
.main-nav>a,.nav-item>a{display:block;padding:10px 12px;color:var(--ink);text-decoration:none;font-size:.97rem;border-radius:8px}
.main-nav>a:hover,.nav-item>a:hover,.main-nav a[aria-current=page]{color:var(--sauge-deep);background:var(--sauge-soft)}
.nav-item{position:relative}
.dropdown{position:absolute;top:100%;left:0;min-width:260px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:8px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s}
.nav-item:hover .dropdown,.nav-item:focus-within .dropdown{opacity:1;visibility:visible;transform:none}
.dropdown a{display:flex;justify-content:space-between;gap:10px;padding:9px 12px;border-radius:8px;color:var(--ink);text-decoration:none;font-size:.95rem}
.dropdown a:hover{background:var(--beige)}
.dropdown .soon,.tag-soon{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--bois);border:1px solid var(--bois);border-radius:999px;padding:1px 8px;white-space:nowrap;align-self:center}
.header-cta{display:flex;align-items:center;gap:10px}
.header-cta .btn{display:none}
.header-tel{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;min-width:46px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--olive);text-decoration:none;font-weight:600;white-space:nowrap}
.header-tel svg{width:18px;height:18px}
.header-tel span{display:none}
.header-tel:hover{background:var(--sauge-soft);color:var(--sauge-deep)}
.mobile-nav a.mn-tel{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px;border:1px solid var(--olive);border-radius:10px;color:var(--olive);font-weight:600}
.mobile-nav a.mn-tel svg{width:18px;height:18px}
@media(min-width:1300px){.header-tel span{display:inline}.header-tel{border:0;background:none;padding:0 6px}}
.burger{width:46px;height:46px;border:1px solid var(--line);background:var(--card);border-radius:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;cursor:pointer}
.burger span{width:20px;height:2px;background:var(--olive);transition:.2s}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-nav{display:none;position:fixed;inset:76px 0 0 0;background:var(--beige);z-index:49;overflow-y:auto;padding:16px 20px 120px}
.mobile-nav.open{display:block}
.mobile-nav a{display:block;padding:12px 4px;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line);font-size:1.05rem}
.mobile-nav .mn-title{margin:18px 0 4px;text-transform:uppercase;letter-spacing:.18em;font-size:.75rem;color:var(--bois)}
.mobile-nav .mn-sub a{padding-left:14px;font-size:.98rem}
.mobile-nav .btn{margin-top:18px;width:100%;color:#fff;border-bottom:0}
@media(min-width:1080px){.main-nav{display:flex}.burger{display:none}.header-cta .btn{display:inline-flex}.mobile-nav{display:none!important}}
/* Hero */
.hero{padding:44px 0 56px;background:linear-gradient(180deg,var(--beige) 0,var(--beige-2) 100%)}
.hero-grid{display:grid;gap:32px;align-items:center}
.hero h1 em{font-style:normal;color:var(--sauge-deep)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0 14px}
.hero-photo{border-radius:22px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/3}
.hero-photo img{width:100%;height:100%;object-fit:cover}
.hero-note{font-size:.88rem;color:var(--muted)}
@media(min-width:900px){.hero{padding:72px 0 80px}.hero-grid{grid-template-columns:1.05fr 1fr;gap:56px}.hero-photo{aspect-ratio:5/5.4}}
.info-strip{list-style:none;margin:36px 0 0;padding:0;display:grid;gap:12px}
.info-strip li{display:flex;gap:12px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;font-size:.95rem}
.info-strip svg{flex:none;width:22px;height:22px;color:var(--sauge-deep);margin-top:2px}
@media(min-width:700px){.info-strip{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.info-strip{grid-template-columns:repeat(4,1fr)}}
/* Sections */
section{padding:64px 0}
.section-alt{background:var(--card);border-block:1px solid var(--line)}
.section-sauge{background:var(--sauge-soft)}
.section-head{max-width:720px;margin-bottom:36px}
.section-head.center{text-align:center;margin-inline:auto}
/* Tuiles spécialités */
.pole-title{display:flex;align-items:center;gap:14px;margin:8px 0 18px}
.pole-title h3{margin:0;font-size:1.35rem}
.pole-title .line{flex:1;height:1px;background:var(--line)}
.tiles{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));margin-bottom:40px}
.tile{position:relative;display:flex;flex-direction:column;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px 22px;text-decoration:none;color:var(--body);transition:transform .2s,box-shadow .2s,border-color .2s}
.tile:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--sauge);color:var(--body)}
.tile .ico{width:48px;height:48px;border-radius:50%;background:var(--sauge-soft);display:grid;place-items:center;color:var(--sauge-deep)}
.tile .ico svg{width:26px;height:26px}
.tile h4{margin:0;font-size:1.12rem;color:var(--olive)}
.tile p{margin:0;font-size:.95rem}
.tile .more{margin-top:auto;font-size:.9rem;color:var(--bois-deep);font-weight:500}
.tile.is-soon{background:transparent;border-style:dashed}
.tile.is-soon .ico{background:var(--beige-2);color:var(--bois)}
.tile .tag-soon{position:absolute;top:18px;right:18px}
/* Engagements / étapes */
.cards3{display:grid;gap:18px}
@media(min-width:800px){.cards3{grid-template-columns:repeat(3,1fr)}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:26px}
.card .num{display:inline-block;font-size:.8rem;letter-spacing:.2em;color:var(--bois);margin-bottom:8px}
.split{display:grid;gap:36px;align-items:center}
@media(min-width:900px){.split{grid-template-columns:1fr 1fr;gap:64px}}
.photo{border-radius:20px;overflow:hidden;box-shadow:var(--shadow)}
.photo img{width:100%;aspect-ratio:4/3;object-fit:cover}
.photo-credit{font-size:.75rem;color:var(--muted);margin-top:6px}
.checks{list-style:none;padding:0;margin:0 0 1.2em}
.checks li{position:relative;padding-left:30px;margin-bottom:10px}
.checks li::before{content:"";position:absolute;left:2px;top:.55em;width:14px;height:8px;border-left:2px solid var(--sauge-deep);border-bottom:2px solid var(--sauge-deep);transform:rotate(-45deg)}
/* Bandeau infos */
.band{background:var(--olive);color:#F3EDE2;padding:44px 0}
.band h2{color:#fff}
.band a{color:#fff}
.band-grid{display:grid;gap:20px;align-items:center}
@media(min-width:850px){.band-grid{grid-template-columns:1.4fr 1fr}}
.band .btn-outline{border-color:#F3EDE2;color:#F3EDE2}
.band .btn-outline:hover{background:#F3EDE2;color:var(--olive)}
/* Page intérieure */
.page-hero{padding:40px 0 36px;background:var(--beige-2);border-bottom:1px solid var(--line)}
.page-hero-grid{display:grid;gap:28px;align-items:center}
@media(min-width:900px){.page-hero-grid{grid-template-columns:1.2fr 1fr;gap:48px}.page-hero{padding:56px 0 52px}}
.crumbs{font-size:.85rem;color:var(--muted);margin-bottom:16px}
.crumbs a{color:var(--muted)}
.content-grid{display:grid;gap:40px;padding:52px 0 64px}
@media(min-width:960px){.content-grid{grid-template-columns:minmax(0,1fr) 330px;gap:56px}}
.prose{max-width:720px}
.prose h2{font-size:1.75rem;margin-top:1.4em}
.prose h2:first-child{margin-top:0}
.prose ul{padding-left:1.2em}
.prose li{margin-bottom:.45em}
.aside{display:flex;flex-direction:column;gap:18px}
.aside-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.aside-card h3{font-size:1.1rem}
.aside-card .btn{width:100%;margin-top:6px}
.aside-links{list-style:none;padding:0;margin:0}
.aside-links a{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);font-size:.95rem}
.aside-links a.current{color:var(--sauge-deep);font-weight:500}
.soon-box{background:var(--card);border:1.5px dashed var(--bois);border-radius:var(--radius);padding:22px 24px;margin-bottom:28px}
.soon-box strong{color:var(--bois-deep)}
/* FAQ */
.faq{max-width:820px;width:100%}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:12px;margin-bottom:10px}
.faq summary{cursor:pointer;list-style:none;padding:18px 52px 18px 20px;font-weight:500;color:var(--olive);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:1.4rem;color:var(--bois)}
.faq details[open] summary::after{content:"–"}
.faq .faq-body{padding:0 20px 18px}
/* Tableaux & infos */
.info-table{width:100%;border-collapse:collapse;background:var(--card);border-radius:12px;overflow:hidden}
.info-table th,.info-table td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--line)}
.info-table th{color:var(--olive);font-weight:500;width:40%}
.grid2{display:grid;gap:20px}
@media(min-width:800px){.grid2{grid-template-columns:1fr 1fr}}
.map-box{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px;display:flex;flex-direction:column;gap:10px}
/* Pied de page */
footer{background:#3E4A37;color:#E7E0D2;padding:52px 0 110px;font-size:.93rem}
footer a{color:#E7E0D2}
footer h4{color:#fff;font-size:.8rem;text-transform:uppercase;letter-spacing:.18em;margin-bottom:12px}
.footer-grid{display:grid;gap:30px}
@media(min-width:800px){.footer-grid{grid-template-columns:1.3fr 1fr 1fr 1fr}footer{padding-bottom:40px}}
.footer-brand img{height:60px;width:auto;background:var(--beige);border-radius:10px;padding:6px 10px;margin-bottom:14px}
.footer-bottom{margin-top:36px;padding-top:20px;border-top:1px solid rgba(255,255,255,.15);font-size:.82rem;color:#C9C2B3}
/* Barre mobile */
.mobile-bar{position:fixed;bottom:0;left:0;right:0;z-index:60;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(243,237,226,.97);border-top:1px solid var(--line)}
.mobile-bar a,.mobile-bar span{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:999px;text-decoration:none;font-weight:500}
.mb-call{border:1.5px solid var(--sauge-deep);color:var(--sauge-deep)}
.mb-call.off{border-color:var(--line);color:var(--muted);font-size:.85rem;text-align:center;line-height:1.2}
.mb-rdv{background:var(--sauge-deep);color:#fff}
.mobile-bar svg{width:18px;height:18px}
@media(min-width:800px){.mobile-bar{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.map-box h2 svg,.card h3 svg,.card h2 svg,.map-box p svg{width:1.2em;height:1.2em;vertical-align:-.22em;color:var(--sauge-deep);display:inline-block}