
/* Cérésiani Avocats — charte : noir, marine #182E4B, crème #EEECE8, beige #DFDCD4, taupe #D1CCC1.
   Titres CoFo Raffine Medium ; corps Helvetica Neue. Mobile d'abord. */
@font-face{font-family:"CoFo Raffine";src:url("fonts/CoFoRaffine-Medium.woff") format("woff");font-weight:500;font-style:normal;font-display:swap}
:root{
  --noir:#000;--marine:#182E4B;--creme:#EEECE8;--beige:#DFDCD4;--taupe:#D1CCC1;
  --bg:var(--creme);--bg-alt:var(--beige);--fg:#111;--fg-soft:#4a4944;--rule:#c8c2b4;
  --band:var(--marine);--band-fg:var(--creme);--band-soft:#c6cdd8;--band-rule:#34496a;
  --accent:var(--marine);--accent-fg:var(--creme);
  --display:"CoFo Raffine","Cormorant Garamond",Georgia,"Times New Roman",serif;
  --body:"Helvetica Neue",Helvetica,Arial,"Liberation Sans",sans-serif;
  --gl:max(16px,env(safe-area-inset-left,0px));--gr:max(16px,env(safe-area-inset-right,0px));
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#13253d;--bg-alt:#182E4B;--fg:var(--creme);--fg-soft:#c6cdd8;--rule:#34496a;
  --band:#0d1a2c;--band-fg:var(--creme);--band-soft:#aeb8c6;--band-rule:#2b3f5e;--accent:var(--creme);--accent-fg:var(--marine);color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#13253d;--bg-alt:#182E4B;--fg:var(--creme);--fg-soft:#c6cdd8;--rule:#34496a;
  --band:#0d1a2c;--band-fg:var(--creme);--band-soft:#aeb8c6;--band-rule:#2b3f5e;--accent:var(--creme);--accent-fg:var(--marine);color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--bg)}
@media (min-width:900px){body{padding-bottom:0}}
h1,h2{font-family:var(--display);font-weight:500;line-height:1.1;margin:0;text-wrap:balance;letter-spacing:.005em}
h3,h4{font-family:var(--body);font-weight:600;line-height:1.25;margin:0;text-wrap:balance}
h1{font-size:clamp(2.4rem,6vw,3.6rem)}
h2{font-size:clamp(1.9rem,4vw,2.5rem)}
h3{font-size:1.2rem}
p{margin:0}
a{color:inherit}
ul{margin:0;padding-left:1.1rem}
li{margin:.25rem 0}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:1120px;margin-inline:auto;padding-left:var(--gl);padding-right:var(--gr)}
.narrow{max-width:66ch}
.stack{display:grid;gap:1rem}
.gap1{gap:1rem}.gap2{gap:2rem}
.eyebrow{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-soft)}
.band .eyebrow{color:var(--band-soft)}
.lead{font-size:1.12rem;line-height:1.5;color:var(--fg-soft)}
.band .lead{color:var(--band-soft)}
section{padding-block:3.25rem}
.band{background:var(--band);color:var(--band-fg)}
.alt{background:var(--bg-alt)}
.prose p+p,.prose ul+p,.prose p+ul{margin-top:.8rem}
.prose a{text-decoration:underline;text-underline-offset:3px}
.prose strong{font-weight:600}
.skip{position:absolute;left:-999px}.skip:focus{position:fixed;left:16px;top:16px;background:var(--bg);padding:.5rem;z-index:50}

/* En-tête */
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--bg);border-bottom:1px solid var(--rule)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:66px}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none}
.brand svg,.brand img{height:50px;width:auto}
.brand .logo-dark{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .brand .logo-light{display:none}:root:not([data-theme="light"]) .brand .logo-dark{display:block}}
:root[data-theme="dark"] .brand .logo-light{display:none}:root[data-theme="dark"] .brand .logo-dark{display:block}
nav.main{display:none;gap:1.4rem;font-size:.9rem}
nav.main>a{text-decoration:none;color:var(--fg-soft);padding-block:.35rem;border-bottom:1px solid transparent;white-space:nowrap}
nav.main>a[aria-current],nav.main>a:hover{color:var(--fg);border-bottom-color:var(--fg)}
.menu-btn{background:none;border:1px solid var(--rule);color:var(--fg);font:inherit;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;padding:.55rem .9rem;cursor:pointer}
.drawer{border-top:1px solid var(--rule);background:var(--bg);max-height:calc(100vh - 66px - env(safe-area-inset-top,0px));overflow:auto}
.drawer nav{display:grid;padding-block:.4rem 1rem}
.drawer a{text-decoration:none;padding:.75rem 0;border-bottom:1px solid var(--rule);font-size:1.05rem}
.drawer a.sub{font-size:.95rem;color:var(--fg-soft);padding:.55rem 0 .55rem 1.2rem}
.drawer a:last-child{border-bottom:0}
@media (min-width:900px){nav.main{display:flex}.menu-btn{display:none}.drawer{display:none!important}}

/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;background:var(--accent);color:var(--accent-fg);text-decoration:none;text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;padding:1rem 1.4rem;border:1px solid var(--accent);min-width:0;cursor:pointer;font-family:var(--body)}
.btn.ghost{background:transparent;color:inherit;border-color:currentColor}
.cta-row{display:flex;flex-wrap:wrap;gap:.8rem}
@media (max-width:600px){.cta-row .btn{flex:1 1 100%}}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* Barre mobile fixe */
.mobile-bar{position:fixed;left:0;right:0;bottom:0;z-index:35;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--rule);border-top:1px solid var(--rule);padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
.mobile-bar a{background:var(--accent);color:var(--accent-fg);text-decoration:none;text-align:center;padding:1rem .5rem;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase}
.mobile-bar a.second{background:var(--bg);color:var(--fg)}
@media (min-width:900px){.mobile-bar{display:none}}

/* Accueil */
.hero{padding-block:3.5rem 3rem}
.hero-grid{display:grid;gap:2rem;align-items:center}
@media (min-width:860px){.hero-grid{grid-template-columns:1.1fr .9fr;gap:3rem}.hero{padding-block:4.5rem}}
.hero h1{font-size:clamp(2.3rem,6vw,4.2rem)}
.hero .slogan{font-family:var(--body);font-weight:500;font-size:clamp(1.15rem,2.4vw,1.5rem);line-height:1.35}
.hero img{width:100%;aspect-ratio:4/5;object-fit:cover}
.families{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule)}
.families>a{background:var(--bg);padding:1.5rem 1.3rem;text-decoration:none;display:grid;gap:.6rem;align-content:start}
.families>a:hover h3{text-decoration:underline;text-underline-offset:4px}
.families .list{color:var(--fg-soft);font-size:.95rem;line-height:1.6}
@media (min-width:720px){.families{grid-template-columns:repeat(3,1fr)}}
.two{display:grid;gap:2rem}
@media (min-width:860px){.two{grid-template-columns:1fr 1fr;gap:3rem;align-items:center}}
.proof{display:grid;gap:1.4rem}
@media (min-width:720px){.proof{grid-template-columns:repeat(3,1fr)}}
.proof>div{border-top:1px solid var(--band-soft);padding-top:1rem;display:grid;gap:.5rem;align-content:start}
.proof strong{font-family:var(--body);font-size:1.1rem;font-weight:600}
.alt .proof>div,.plain .proof>div{border-top-color:var(--rule)}
.cards{display:grid;gap:1.4rem}
@media (min-width:720px){.cards{grid-template-columns:repeat(3,1fr)}}
@media (min-width:720px){.cards.two-col{grid-template-columns:repeat(2,1fr)}}
.card{border-top:1px solid var(--rule);padding-top:1rem;display:grid;gap:.5rem;align-content:start;text-decoration:none}
.card time,.card .k{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-soft)}
.card h3{font-size:1.15rem}
.card p{color:var(--fg-soft)}
a.card:hover h3{text-decoration:underline;text-underline-offset:4px}
.band .card{border-top-color:var(--band-rule)}
.band .card p,.band .card .k{color:var(--band-soft)}
.photo-band{aspect-ratio:2/1;max-width:100%;overflow:hidden}
.photo-band img{width:100%;height:100%;object-fit:cover}
@media (max-width:600px){.photo-band{aspect-ratio:4/3}}

/* Pages intérieures */
.page-head{padding-block:3rem 2.2rem;border-bottom:1px solid var(--rule)}
.crumbs{font-size:.8rem;color:var(--fg-soft);display:flex;flex-wrap:wrap;gap:.4rem}
.crumbs a{text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.domain-grid{display:grid;gap:2.5rem}
@media (min-width:900px){.domain-grid{grid-template-columns:minmax(0,1fr) 300px;gap:4rem;align-items:start}}
.aside{display:grid;gap:1.4rem;position:sticky;top:calc(80px + env(safe-area-inset-top,0px))}
.box{border:1px solid var(--rule);padding:1.3rem;display:grid;gap:.6rem}
.box h3{font-size:1.1rem}
.box .big{font-family:var(--body);font-size:1.2rem;font-weight:600}
.sections{display:grid;gap:2.2rem}
.sections>div{display:grid;gap:.7rem}
.sections h2{font-family:var(--body);font-weight:600;font-size:1.35rem;line-height:1.3}
.faq{display:grid;gap:0;border-top:1px solid var(--rule)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{cursor:pointer;padding:1rem 0;font-family:var(--body);font-weight:600;font-size:1.02rem;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--fg-soft);font-family:var(--body)}
.faq details[open] summary::after{content:"–"}
.faq .a{padding:0 0 1.1rem;color:var(--fg-soft)}
.steps{display:grid;gap:1.5rem;counter-reset:s}
.steps>div{display:grid;gap:.4rem;border-top:1px solid var(--rule);padding-top:1rem}
.steps>div::before{counter-increment:s;content:counter(s,decimal-leading-zero);font-family:var(--display);font-size:1.6rem;color:var(--fg-soft)}
@media (min-width:720px){.steps{grid-template-columns:repeat(2,1fr)}}
.team{display:grid;gap:2.5rem}
.member{display:grid;gap:1.2rem}
@media (min-width:760px){.member{grid-template-columns:260px minmax(0,1fr);align-items:start}.member.no-photo{grid-template-columns:minmax(0,1fr);border-top:1px solid var(--rule);padding-top:2rem}.member.lead-member{grid-template-columns:380px minmax(0,1fr)}}
.member img{width:100%;aspect-ratio:4/5;object-fit:cover}
.member .role{font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-soft)}
.figure-ph{aspect-ratio:4/5;background:var(--bg-alt);border:1px solid var(--rule);display:grid;place-items:center;color:var(--fg-soft);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;text-align:center;padding:1rem}
.contact-grid{display:grid;gap:2rem}
@media (min-width:860px){.contact-grid{grid-template-columns:1fr 1fr;align-items:start}}
.copy{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}
.copy button{font:inherit;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;background:none;border:1px solid var(--rule);color:inherit;padding:.3rem .6rem;cursor:pointer}
.consent{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--band);color:var(--band-fg);padding:1.1rem 1.2rem;display:grid;gap:.9rem;box-shadow:0 -6px 24px rgba(0,0,0,.18)}
.consent p{max-width:70ch;font-size:.92rem;line-height:1.55;margin:0}
.consent a{color:inherit}
.consent-actions{display:flex;gap:.7rem;flex-wrap:wrap}
.consent .btn{padding:.7rem 1.2rem}
@media(min-width:860px){.consent{grid-template-columns:1fr auto;align-items:center;padding:1.2rem 2rem}}
@media(max-width:859px){.consent{bottom:56px}}
form{display:grid;gap:1rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
label{display:grid;gap:.35rem;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-soft)}
label.inline{display:flex;align-items:flex-start;gap:.6rem;text-transform:none;letter-spacing:0;font-size:.95rem;color:var(--fg)}
input,textarea,select{font:inherit;font-size:1rem;padding:.85rem;border:1px solid var(--rule);background:var(--bg);color:var(--fg);width:100%;min-width:0;border-radius:0}
textarea{min-height:140px;resize:vertical}
.note{font-size:.85rem;color:var(--fg-soft)}
.legal h3{margin-top:1.2rem}
.legal p{font-size:.95rem}
.todo{color:var(--fg-soft);font-style:italic}
.anchors{display:flex;flex-wrap:wrap;gap:.5rem}
.anchors a{text-decoration:none;border:1px solid var(--rule);padding:.45rem .8rem;font-size:.85rem}
.situations{display:grid;gap:1.6rem}
@media (min-width:760px){.situations{grid-template-columns:repeat(2,1fr)}}
.situation{border-top:1px solid var(--rule);padding-top:1rem;display:grid;gap:.5rem;scroll-margin-top:90px}
.situation .first{font-size:.92rem;color:var(--fg-soft)}
.quote{font-family:var(--display);font-size:clamp(1.7rem,3vw,2.1rem);line-height:1.25}
.avis-grid{display:grid;gap:1.4rem}
@media (min-width:720px){.avis-grid{grid-template-columns:repeat(2,1fr)}}
.avis{border-top:1px solid var(--rule);padding-top:1rem;display:grid;gap:.6rem}
.avis p{color:var(--fg-soft)}
.avis .who{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-soft)}
.article{max-width:68ch}
.article h2{font-family:var(--body);font-weight:600;font-size:1.3rem;line-height:1.3;margin-top:1.8rem}
.article p{margin-top:.9rem}
.article em{font-style:italic}
.article hr{border:0;border-top:1px solid var(--rule);margin:1.6rem 0}
.article blockquote{margin:1rem 0;padding-left:1rem;border-left:2px solid var(--rule);color:var(--fg-soft)}

/* Pied */
footer.site{background:var(--band);color:var(--band-fg);padding-block:3rem 2rem}
.foot{display:grid;gap:2rem}
@media (min-width:720px){.foot{grid-template-columns:1.6fr 1fr 1fr 1fr}}
.foot h4{font-family:var(--body);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--band-soft);margin-bottom:.6rem;font-weight:400}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem;font-size:.95rem}
.foot a{text-decoration:none}
.foot a:hover{text-decoration:underline}
.foot .mono{width:48px;height:auto}
.colophon{margin-top:2.5rem;padding-top:1rem;border-top:1px solid var(--band-rule);font-size:.8rem;color:var(--band-soft);display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;justify-content:space-between}
@media (prefers-reduced-motion:no-preference){.drawer{animation:fade .2s ease}}
@keyframes fade{from{opacity:0}to{opacity:1}}
