/* MODENA Advocatus : variables, échelle typographique et rythme vertical. */
:root {
  --font-serif:'Libre Caslon Display',Georgia,'Times New Roman',serif;
  --font-sans:'DM Sans',Arial,sans-serif;
  --ink:#10284d;
  --ink-2:#203858;
  --paper:#fff;
  --paper-2:#f1f3f5;
  --paper-3:#e4e8ec;
  --surface:#fff;
  --teal:#00799f;
  --teal-deep:#086681;
  --teal-soft:#a9dbea;
  --muted:#465365;
  --muted-dark:#d4dde7;
  --rule:#d8dde3;
  --rule-strong:#aebbc8;
  --rule-dark:#405371;
  --radius:0;
  --wrap:1120px;
  --gutter:clamp(20px,6.3vw,90px);
  --measure:70ch;
  /* Échelle unique : quatre niveaux de titre, trois de texte, deux de mention. */
  --fs-h1:clamp(40px,5vw,60px);
  --fs-h2:clamp(32px,3.6vw,42px);
  --fs-h3:clamp(26px,2.5vw,30px);
  --fs-h4:clamp(21px,1.9vw,24px);
  --fs-lead:18px;
  --fs-read:17px;
  --fs-text:16px;
  --fs-label:15px;
  --fs-mention:14px;
  /* Trois paliers d'espacement : entre sections, sous l'en-tête, entre un titre et son contenu. */
  --space-section:clamp(56px,7.5vw,96px);
  --space-masthead:clamp(36px,4.5vw,56px);
  --space-block:32px;
}
html { scroll-padding-top:120px; }
body { line-height:1.6; overflow-x:clip; }
h1,h2,h3,h4 { font-weight:400; letter-spacing:0; text-wrap:balance; }
h1 { font-size:var(--fs-h1); line-height:1.15; }
h2 { font-size:var(--fs-h2); line-height:1.16; }
h3 { font-size:var(--fs-h3); line-height:1.2; }
.wrap { width:calc(100% - 2 * var(--gutter)); max-width:var(--wrap); padding-inline:0; }
.wrap--narrow { max-width:var(--wrap); }
.wrap--narrow>* { max-width:820px; }
.section--paper { background:var(--paper-2); }
/* Surtitre : une ligne de texte, sans capitales ni trait. */
.kicker,.masthead__kicker,.hero__kicker,.comp-eyebrow,.team-note__eyebrow,.team-calm__eyebrow { margin:0 0 10px; font:500 var(--fs-label)/1.4 var(--font-sans); color:var(--teal-deep); }
/* Intertitres des listes de coordonnées et de liens. */
.cta-office h4,.aside__related h4,.site-footer__col h4 { font:600 var(--fs-label)/1.4 var(--font-sans); }
.lead { font-size:var(--fs-read); line-height:1.6; }
.sec-head { margin:0 auto 38px; }
.section__foot { margin-top:var(--space-block); }
.btn { border-radius:0; color:#fff; font-weight:400; padding:14px 25px; line-height:1.3; }
/* Un lien se reconnaît à son soulignement. */
.text-link,.press-note a,.reviews__summary a,.faq__answer a,.sources li a,.domain-links a,.legal a,.office__lines .office__maps,.cta-office a { color:var(--teal-deep); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; }
.text-link:hover,.press-note a:hover,.reviews__summary a:hover,.faq__answer a:hover,.sources li a:hover,.domain-links a:hover,.legal a:hover,.office__lines .office__maps:hover,.cta-office a:hover { color:var(--ink); }
.section__links { display:flex; gap:13px 28px; flex-wrap:wrap; }
.tel-link { font-weight:500; }

/* En-tête commun, blanc et typographique. */
#site-header { position:sticky; top:0; z-index:50; }
.site-header { position:static; background:#fff; border:0; backdrop-filter:none; }
.site-header__in { gap:24px; }
.wordmark { gap:8px; flex-shrink:0; }
.wordmark__logo { display:block; width:244px; max-width:100%; height:auto; }
.wordmark b { font-size:27px; font-weight:400; letter-spacing:0; white-space:nowrap; }
.mainnav { font-weight:400; white-space:nowrap; }
.mainnav a { color:var(--ink); border:0; }
.mainnav a:hover,.mainnav a.is-active { color:var(--teal); }
.header-actions { gap:18px; }
.header-tel { font-size:var(--fs-mention); font-weight:400; }
.header-actions .btn { padding:11px 14px; white-space:nowrap; }
.menu-toggle { font-weight:400; padding:9px 13px; }
.menu__panel { width:min(90vw,390px); }
.menu__top .wordmark b { font-size:23px; }
.menu__top .wordmark__logo { width:200px; }
.menu__nav a { font-size:var(--fs-h3); }

/* Accueil. */
.hero { background:#fff; color:var(--ink); }
.hero .hero__title { letter-spacing:0; }
.hero__actions .tel { font-weight:400; border:0; }
.facts { border-color:var(--rule); }
.facts__item dt { color:var(--ink); }
.facts__item dd { color:var(--muted); }

/* Équipe : les six portraits authentiques et leurs liens de profil. */
.team { grid-template-columns:repeat(3,minmax(0,1fr)); gap:39px 28px; }
.team__member { text-align:center; }
.portrait { aspect-ratio:4/4.6; border:0; }
.portrait img { object-position:center 25%; }
.team__name { font-family:var(--font-sans); color:var(--teal); line-height:1.5; font-weight:500; margin-top:18px; }
.team__role { font-weight:400; color:var(--ink); margin-top:5px; }
.team__focus { max-width:32ch; margin:10px auto 0; }
.team__member:hover .team__name { color:var(--teal-deep); text-decoration:underline; text-underline-offset:4px; }
body[data-page='accueil'] .team { gap:37px 24px; }

/* Références, avis et questions : conserver toute l'information. */
.reference__title { font-style:normal; }
.faq { max-width:820px; }
.faq summary { font-weight:400; }
.faq summary::after { font-size:18px; flex-shrink:0; }
.faq__answer { line-height:1.6; }
body[data-page='faq'] .sec-head { text-align:left; max-width:none; }

/* Pages internes. */
.masthead { color:var(--ink); margin:0 auto; }
.masthead .breadcrumb { line-height:1.8; color:var(--muted); }
.masthead .breadcrumb a { color:var(--teal); }
.masthead .breadcrumb a:hover { color:var(--ink); text-decoration:underline; }
.masthead__lead { color:var(--muted); }
.article h2 { line-height:1.22; }
.article h2:first-child { margin-top:0; }
.article ul li::before { width:4px; height:4px; top:.85em; }
.article .disclaimer { font-size:var(--fs-mention); border-color:var(--rule-strong); padding:21px 24px; }
.sources li a { font-weight:400; }
.aside { top:124px; }
.aside__box p { line-height:1.6; margin-bottom:23px; }
.aside__box .btn { padding-inline:10px; font-size:var(--fs-label); }
.aside__lines { gap:8px; margin-top:21px; }
.aside__lines a { font-size:var(--fs-mention); font-weight:400; max-width:100%; overflow-wrap:anywhere; }
.aside__related a { padding:12px 0; }
.member-portrait img { aspect-ratio:4/5; }
.domain-links a { max-width:100%; width:auto; }

/* Honoraires, contact et textes légaux. */
.fee__price small { font-size:20px; }
.fee__desc { line-height:1.6; }
.fee-notes li:last-child { border-bottom:0; }
.fee-notes li { line-height:1.6; padding:16px 0; }
.office p { line-height:1.6; }
.office__lines { gap:7px; }
.office__lines a { font-weight:400; max-width:100%; overflow-wrap:anywhere; }
.contact-form__intro { margin-bottom:25px; }
.field label { margin-bottom:7px; }
.field input,.field select,.field textarea { min-width:0; width:100%; border-radius:0; font-size:16px; }
.field input:focus,.field select:focus,.field textarea:focus { box-shadow:0 0 0 2px #00799f22; }
.form-note { line-height:1.6; }
.legal { max-width:820px; }
.legal h2 { font-size:var(--fs-h3); line-height:1.25; margin-top:40px; }
.legal h3 { font-size:var(--fs-h4); }
.legal>p,.legal>ul,.legal li { font-size:var(--fs-read); line-height:1.7; }
.legal__id { padding:26px 30px; }
.legal__updated { font-size:var(--fs-mention); }
.legal-table { font-size:var(--fs-label); }
.legal-table thead th { font-size:var(--fs-mention); font-weight:500; }
.legal-table th,.legal-table td { padding:15px; overflow-wrap:anywhere; }
.legal a { overflow-wrap:anywhere; }

/* Prise de rendez-vous et pied de page commun. */
.section--dark { background:var(--paper-2); color:var(--ink); }
.section--dark h1,.section--dark h2,.section--dark h3 { color:var(--ink); }
.section--dark :focus-visible { outline-color:var(--teal); }
.section--dark .lead { color:var(--muted); }
.section--dark .btn { color:#fff; }
.section--dark .btn:hover { background:var(--teal-deep); border-color:var(--teal-deep); color:#fff; }
.cta-office p { color:var(--muted); font-size:var(--fs-label); }
.cta-office a { color:var(--ink); font-weight:400; }
.cta-office a:hover { color:var(--teal); }
.site-footer { background:var(--ink); padding-top:53px; color:#fff; }
.site-footer .wordmark__logo { width:220px; filter:brightness(0) invert(1); }
.site-footer__in { grid-template-columns:1.7fr .8fr 1fr 1.1fr; gap:40px; padding-bottom:39px; }
.site-footer__brand p { line-height:1.6; color:var(--muted-dark); max-width:34ch; }
.site-footer__col a,.site-footer__col p { line-height:1.6; }
.site-footer__bottom { padding-block:23px; color:var(--muted-dark); }
.site-footer__legal { display:flex; flex-wrap:wrap; gap:4px 24px; }
.site-footer a:focus-visible,.aside__box a:focus-visible { outline-color:#fff; }

@media(max-width:1200px) {
  .header-tel { display:none; }
  .site-header__in { gap:22px; }
}
@media(max-width:960px) {
  :root { --gutter:28px; }
  html { scroll-padding-top:103px; }
  .team { grid-template-columns:repeat(2,minmax(0,1fr)); gap:35px 24px; }
  .quotes { grid-template-columns:1fr; max-width:700px; margin-inline:auto; }
  .references { grid-template-columns:1fr; }
  .contact { grid-template-columns:1fr; max-width:700px; }
  .aside { position:static; }
  body[data-page='equipe'] .aside { width:100%; max-width:360px; }
  .site-footer__in { grid-template-columns:1fr 1fr; gap:34px; }
}
@media(max-width:600px) {
  :root { --gutter:20px; --fs-lead:17px; --fs-read:16px; }
  .site-header__in { gap:15px; }
  .wordmark b { font-size:24px; }
  html { scroll-padding-top:96px; }
  .team,body[data-page='accueil'] .team { gap:29px 17px; }
  .portrait { aspect-ratio:4/5; }
  .team__name { margin-top:13px; line-height:1.5; }
  .team__focus { margin-top:8px; }
  .faq summary { gap:17px; }
  .masthead h1 { overflow-wrap:break-word; }
  .article .disclaimer { padding:19px; }
  .sources li a { overflow-wrap:anywhere; }
  .fee { grid-template-columns:1fr; }
  .fee__price { text-align:left; }
  .field-row { grid-template-columns:1fr; gap:0; }
  .legal__id { padding:21px; }
  .legal-table { font-size:var(--fs-mention); }
  .legal-table th,.legal-table td { padding:9px 8px; }
  .site-footer { padding-top:39px; }
  .site-footer__in { grid-template-columns:1fr; gap:28px; padding-bottom:30px; }
  .site-footer__brand p { max-width:39ch; }
  .site-footer__col h4 { margin-bottom:12px; }
  .site-footer__bottom { gap:12px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

/* Surfaces de navigation lisibles et utilisables au clavier. */
@media(min-width:1061px) {
  .mainnav a { display:inline-flex; align-items:center; min-height:44px; }
  .header-actions .btn { display:inline-flex; align-items:center; min-height:44px; }
}
@media(max-width:1060px) {
  .site-header__in { justify-content:space-between; }
  .header-actions { margin-left:auto; }
  .mainnav,.header-actions .btn { display:none; }
  .menu-toggle { min-width:44px; min-height:44px; font-size:var(--fs-label); }
}
:where(a,button,input,select,textarea):focus-visible { outline:3px solid var(--teal); outline-offset:3px; }

/* Encadré dans une fiche (citation du texte riche) : pré-rendez-vous, information à mettre en avant */
.article blockquote { margin:0 0 32px; padding:18px 22px; border-left:3px solid var(--teal); background:var(--paper-2); }
.article blockquote p { margin:0; }
.article blockquote a { color:var(--teal-deep); text-decoration:underline; text-underline-offset:3px; }

/* Sous-menu du menu principal (rubriques des actualités) : au survol et au clavier */
.mainnav__group { position:relative; display:flex; align-items:center; }
.mainnav__group > a::after { content:"▾"; margin-left:5px; font-size:13px; line-height:1; }
.mainnav__sub { position:absolute; top:100%; left:-18px; z-index:60; min-width:190px; margin:0; padding:8px 0; list-style:none; background:#fff; border:1px solid var(--rule); box-shadow:0 10px 24px rgba(16,40,77,.1); opacity:0; visibility:hidden; transition:opacity .15s ease; }
.mainnav__group:hover .mainnav__sub,.mainnav__group:focus-within .mainnav__sub { opacity:1; visibility:visible; }
.mainnav__sub a { display:block; padding:9px 18px; }
.menu__nav a.menu__sublink { padding-left:20px; font-size:20px; }
