:root{
--parch:#F3EDE1; --paper:#FBF8F2; --ink:#16233D; --soft:#4A5670;
--blue:#3D5A98; --deep:#2B4275; --pale:#C9D6EC; --brass:#A8813A;
--wa:#128C4B; --wad:#0E7340; --line:#DCD2C0;
--serif:"Frank Ruhl Libre",Georgia,serif; --sans:"Heebo",system-ui,Arial,sans-serif;
--gap:clamp(1.25rem,4vw,2.5rem);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
section[id]{scroll-margin-block-start:5.25rem}
body{margin:0;background:var(--parch);color:var(--ink);font-family:var(--sans);
font-size:1.1875rem;line-height:1.65;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;height:auto}
a{color:var(--deep)}
.wrap{width:100%;max-width:72rem;margin-inline:auto;padding-inline:var(--gap)}
.narrow{max-width:52rem}
h1,h2,h3{font-family:var(--serif);font-weight:700;line-height:1.18;margin:0 0 .6em}
h1{font-size:clamp(2.3rem,6.2vw,3.9rem);max-width:15ch;letter-spacing:-.015em}
h2{font-size:clamp(1.7rem,3.6vw,2.45rem);max-width:24ch;position:relative;padding-block-start:1.4rem}
h2::before{content:"";position:absolute;top:0;inset-inline-start:0;width:2.75rem;height:3px;
background:var(--brass);border-radius:2px}
h3{font-size:1.2rem;margin-bottom:.3em}
p{margin:0 0 1em;max-width:66ch}
.skip{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);
white-space:nowrap;top:0;inset-inline-start:0;z-index:99;background:var(--ink);color:#fff}
.skip:focus{width:auto;height:auto;overflow:visible;clip-path:none;padding:.75rem 1.25rem}
:where(a,button,summary):focus-visible{outline:3px solid var(--brass);outline-offset:3px;border-radius:2px}

.head{position:sticky;top:0;z-index:40;background:rgba(243,237,225,.95);
backdrop-filter:blur(8px);border-block-end:1px solid var(--line)}
.head-in{display:flex;align-items:center;gap:1rem;min-height:4.4rem;flex-wrap:nowrap}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:inherit;flex:0 0 auto}
.brand span{display:flex;flex-direction:column;line-height:1.1}
.brand strong{font-family:var(--serif);font-size:1.2rem}
.brand small{font-size:.8rem;color:var(--soft)}
.nav-d{display:flex;gap:clamp(.8rem,1.7vw,1.35rem);margin-inline:auto;flex-wrap:nowrap;flex:0 0 auto}
.nav-d a{color:var(--ink);text-decoration:none;font-size:.98rem;padding-block:.3rem;border-block-end:2px solid transparent;white-space:nowrap}
.nav-d a:hover{border-block-end-color:var(--brass)}
.head-r{display:flex;align-items:center;gap:.7rem;margin-inline-start:auto;flex:0 0 auto}
.langs{display:flex;gap:.15rem}
.langs a,.cur{font-size:.9rem;padding:.3rem .5rem;border-radius:4px;text-decoration:none}
.langs a{color:var(--soft)}
.langs a:hover{background:#0000000d;color:var(--ink)}
.cur{background:var(--pale);color:var(--deep);font-weight:700}
.nav-m{display:none;position:relative}
.nav-m>summary{list-style:none;cursor:pointer;width:2.75rem;height:2.75rem;display:flex;
flex-direction:column;justify-content:center;gap:5px;padding:0 .55rem}
.nav-m>summary::-webkit-details-marker{display:none}
.nav-m>summary span{display:block;height:2px;background:var(--ink);border-radius:2px}
.nav-m nav{position:absolute;inset-inline-end:0;top:calc(100% + .5rem);background:var(--paper);
border:1px solid var(--line);border-radius:10px;padding:.5rem;min-width:13rem;display:flex;
flex-direction:column;box-shadow:0 12px 28px #16233d1f}
.nav-m nav a{padding:.7rem .9rem;text-decoration:none;color:var(--ink);border-radius:6px}
.nav-m nav a:hover{background:var(--parch)}

.btn{display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;font-weight:700;
font-size:1.0625rem;line-height:1.2;padding:.95rem 1.35rem;border-radius:8px;border:2px solid transparent;
transition:background-color .15s,border-color .15s}
.btn svg{width:1.25em;height:1.25em;flex:0 0 auto}
.wa{background:var(--deep);color:#fff}
.wa:hover{background:var(--ink)}
.wa svg{color:#25D366}
.ln{color:var(--deep);border-color:var(--blue)}
.ln:hover{background:#3d5a9814}
.sm{padding:.55rem .9rem;font-size:.95rem}
.ctas{display:flex;flex-wrap:wrap;gap:.75rem;margin-block-start:1.75rem}

.hero{padding-block:clamp(2.5rem,6vw,4.5rem) 0;overflow-x:clip}
.hero-in{display:grid;gap:clamp(1.5rem,4vw,3.25rem);grid-template-columns:1.2fr .8fr;align-items:center}
.lede{font-size:clamp(1.1rem,1.9vw,1.28rem);color:var(--soft);max-width:52ch}
.place{display:flex;align-items:center;gap:.45rem;color:var(--deep);font-size:1rem;margin-block-start:1rem}
.place svg{width:1.1em;height:1.1em;flex:0 0 auto}
.portrait{margin:0}
.portrait{position:relative}
.portrait::before{content:"";position:absolute;inset-block:1.5rem -1.5rem;inset-inline-start:1.5rem;
inset-inline-end:-1.5rem;background:var(--pale);border-radius:16px}
.portrait img{width:100%;border-radius:16px;display:block;position:relative;box-shadow:0 20px 44px #16233d2e}
.wing-h{color:var(--blue);margin-block-start:clamp(1.75rem,4vw,2.75rem);line-height:0}
.wing{width:100%;height:clamp(52px,8vw,90px);display:block}
.wing path{stroke-dasharray:2600;stroke-dashoffset:2600;animation:d 2.4s cubic-bezier(.35,.1,.25,1) .2s forwards}
@keyframes d{to{stroke-dashoffset:0}}
.rule-h{color:var(--line);line-height:0;padding-block:.5rem}
.rule{width:100%;height:24px;display:block}

.arrive{background:var(--paper);border-block:1px solid var(--line);padding-block:clamp(2.5rem,6vw,4rem);
margin-block-start:clamp(1rem,3vw,2rem)}
.quotes{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;gap:1rem}
.quotes li{font-family:var(--serif);font-size:clamp(1.15rem,2.2vw,1.45rem);line-height:1.45;
border-inline-start:3px solid var(--brass);padding-inline-start:1rem;color:var(--ink)}
.after{margin-block-start:1.75rem;color:var(--soft)}

.band{padding-block:clamp(2.75rem,6.5vw,4.5rem)}
.band.alt{background:var(--paper);border-block:1px solid var(--line)}
.intro{color:var(--soft);max-width:58ch}
.sig{display:flex;flex-direction:column;gap:.1rem;margin-block-start:1.5rem;
border-inline-start:3px solid var(--blue);padding-inline-start:.9rem}
.sig strong{font-family:var(--serif);font-size:1.15rem}
.sig span{font-size:.95rem;color:var(--soft)}

.ways{display:grid;gap:1.75rem;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));margin-block-start:2rem}
.way h3{color:var(--deep)}
.way p{font-size:1.0625rem;color:var(--soft);margin:0}

.cares{display:grid;gap:0;margin-block-start:2rem}
.care{padding-block:1.75rem;border-block-start:1px solid var(--line)}
.care:first-child{border-block-start:none;padding-block-start:0}
.care h3{font-size:1.35rem;color:var(--deep)}
.care p{color:var(--soft);margin:0}

.hes p{font-size:clamp(1.0625rem,1.8vw,1.2rem)}
.hes p:nth-of-type(2){font-family:var(--serif);color:var(--deep);
border-inline-start:3px solid var(--brass);padding-inline-start:1rem}

.quote-b{background:var(--paper);border-block:1px solid var(--line)}
.q{margin:0 0 1.25rem}
.q blockquote{margin:0;border-inline-start:4px solid var(--pale);padding-inline-start:1.25rem}
.q blockquote p{font-family:var(--serif);font-size:clamp(1.08rem,2vw,1.32rem);line-height:1.6;max-width:58ch}
.q figcaption{margin-block-start:.9rem;font-size:.95rem;color:var(--soft)}
.lnk{color:var(--deep);text-underline-offset:3px}

.cabinet{margin:2rem 0 0}
.cabinet img{width:100%;border-radius:14px;display:block;box-shadow:0 14px 32px #16233d1f}
.cabinet figcaption{margin-block-start:.65rem;font-size:.9rem;color:var(--soft);max-width:60ch}
.prat{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));margin-block-start:2rem}
.prat h3{font-family:var(--sans);font-size:1.05rem;color:var(--deep)}
.prat p{font-size:1.0312rem;color:var(--soft);margin:0}

.nom{background:var(--paper);border-block:1px solid var(--line);position:relative;overflow:hidden}
.nom::after{content:"";position:absolute;inset-block-start:8%;inset-inline-end:-3rem;width:22rem;height:22rem;
background:url(/assets/logo-512.png) no-repeat center/contain;opacity:.07;pointer-events:none}
.nom .wrap{position:relative;z-index:1}
.nom p:first-of-type{font-family:var(--serif);font-size:clamp(1.15rem,2.2vw,1.45rem);color:var(--ink)}
.nom p{color:var(--soft)}

.form-b{background:var(--pale)}
.form-b h2::before{background:var(--deep)}
.form-b p{color:#2C3A57}
.form-b .ln{border-color:var(--deep);color:var(--deep)}
.form-b .ln:hover{background:#2b427514}
.contact{background:var(--deep);color:var(--paper)}
.contact h2{color:#fff}
.contact .intro{color:#dfe6f5}
.contact .ln{color:#fff;border-color:#ffffff66}
.contact .ln:hover{background:#ffffff1a;border-color:#fff}

.foot{background:var(--ink);color:#E8E3D8;padding-block:clamp(2.75rem,5vw,3.75rem) 1.5rem;font-size:1rem}
.foot a{color:#fff;text-underline-offset:3px}
.foot-g{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.foot-g h3{font-family:var(--sans);font-size:.95rem;color:var(--pale);margin-block-end:.6rem;padding:0}
.foot-g h3::before{display:none}
.foot-g p{margin:0 0 .35rem}
.mut{color:#A9B2C4;font-size:.95rem}
.foot-l{display:flex;gap:.9rem;margin-block-start:.7rem}
.foot-b{margin-block-start:2rem;padding-block-start:1.25rem;border-block-start:1px solid #ffffff26}
.foot-b p{margin:0;font-size:.9rem;color:#A9B2C4}

@media (max-width:71.5rem){
.nav-d{display:none} .nav-m{display:block} .head-in{min-height:4rem}
.langs{gap:.1rem}
.langs a,.cur{padding:.3rem .42rem;font-size:.88rem}
.hero-in{grid-template-columns:1fr}
.portrait{max-width:22rem;margin-inline:auto}
}
@media (max-width:42rem){
.head-r .sm span{display:none}
.head-r .sm{padding:.6rem .7rem}
.head-r{gap:.45rem}
}
@media (max-width:34rem){
.btn{width:100%;justify-content:center}
.head-r .sm{width:auto}
.brand small{display:none}
.brand strong{font-size:1.05rem}
.head-in{gap:.5rem}
}
@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto} .wing path{animation:none;stroke-dashoffset:0}
*{transition-duration:.01ms !important}
}
@media print{.head,.ctas,.wing-h,.rule-h{display:none}body{background:#fff;font-size:11pt}}

.vary{font-size:.9rem;color:var(--soft);margin-block-start:.25rem}

/* --- zones tactiles : 44px minimum, recommandation d'accessibilite --- */
.langs a,.cur{display:inline-flex;align-items:center;justify-content:center;
min-height:2.75rem;min-width:2.5rem}
.nav-m>summary{min-height:2.75rem;min-width:2.75rem;box-sizing:border-box}
.nav-m nav a{min-height:2.75rem;display:flex;align-items:center}
.foot-g p a{display:inline-block;padding-block:.45rem}
.lnk{display:inline-block;padding-block:.5rem}
.form-b h2::before{background:var(--deep)}

@media (max-width:23.5rem){
.brand span{display:none}
.head-in{gap:.4rem}
.langs a,.cur{min-width:2.25rem;padding-inline:.3rem}
}

/* --- dernieres zones tactiles portees a 44px --- */
.head-r .sm{min-height:2.75rem}
.foot-g p a,.foot-l a{display:inline-flex;align-items:center;min-height:2.75rem}

/* --- barre d'action du bas : mobile uniquement, volontairement discrete --- */
.dock{display:none}
@media (max-width:71.5rem){
  .dock{
    display:block;position:fixed;inset-inline:0;bottom:0;z-index:35;
    padding:.45rem var(--gap) calc(.45rem + env(safe-area-inset-bottom,0px));
    background:rgba(251,248,242,.92);backdrop-filter:blur(10px);
    border-block-start:1px solid var(--line);
    transform:translateY(0);transition:transform .22s ease,opacity .22s ease;opacity:1;
  }
  .dock--off{transform:translateY(115%);opacity:0;pointer-events:none}
  .dock-a{
    display:flex;align-items:center;justify-content:center;gap:.5rem;
    min-height:2.75rem;padding:.5rem 1rem;border-radius:999px;
    background:var(--deep);color:#fff;text-decoration:none;
    font-size:.94rem;font-weight:700;max-width:15.5rem;margin-inline:auto;
  }
  .dock-a svg{width:1.2em;height:1.2em;color:#25D366;flex:0 0 auto}
  /* la barre remplace le bouton de l'en-tete : celui-ci disparait */
  .head-r .sm{display:none}
  /* le pied de page ne doit pas passer sous la barre */
  .foot{padding-block-end:calc(4.5rem + env(safe-area-inset-bottom,0px))}
}
@media (prefers-reduced-motion:reduce){.dock{transition:none}}
@media print{.dock{display:none}}


/* --- carrousel de temoignages --- */
.carou{margin-block-start:1.5rem}
.carou-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;
scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth}
.carou-track::-webkit-scrollbar{display:none}
.carou-track>.q{flex:0 0 100%;scroll-snap-align:start;padding-inline-end:.5rem}
.carou-nav{display:flex;gap:.25rem;justify-content:center;margin-block-start:.5rem}
.carou-dot{width:2.75rem;height:2.75rem;padding:0;border:0;background:none;cursor:pointer;
display:inline-flex;align-items:center;justify-content:center}
.carou-dot::before{content:"";width:9px;height:9px;border-radius:50%;
background:var(--line);transition:background .2s ease,transform .2s ease}
.carou-dot[aria-current="true"]::before{background:var(--blue);transform:scale(1.25)}
@media (prefers-reduced-motion:reduce){.carou-track{scroll-behavior:auto}
.carou-dot::before{transition:none}}

/* --- surtitre, liens discrets, reassurance --- */
.eyebrow{font-size:.92rem;font-weight:700;letter-spacing:.01em;color:var(--brass);
margin:0 0 .75rem;max-width:none}
.under-cta{margin:.6rem 0 0;font-size:1rem}
.under-cta a{color:var(--deep);text-underline-offset:3px;display:inline-flex;
align-items:center;min-height:2.75rem}
.reassure{margin:.9rem 0 0;font-size:.95rem;color:var(--soft);max-width:44ch}
.care .under-cta{margin-block-start:.9rem}

/* --- petit portrait rond, mobile uniquement --- */
.avatar{display:none;width:84px;height:84px;border-radius:50%;object-fit:cover;
box-shadow:0 8px 20px #16233d26;margin-block-end:1rem}
@media (max-width:71.5rem){
  .avatar{display:block}
  .portrait{display:none}
}

/* --- photo du cabinet dans « qui je suis » --- */
#moi .cabinet{margin-block-start:2rem}

/* --- pages par motif --- */
.contact .also{margin:.9rem 0 0;font-size:1rem;color:#dfe6f5}
.contact .also a{color:#fff;text-underline-offset:3px;display:inline-flex;align-items:center;min-height:2.75rem}
.contact .also span{opacity:.85}

/* liens du menu large : 44px, tablettes en paysage */
.nav-d a{display:inline-flex;align-items:center;min-height:2.75rem}
