/* ============================================================
   JAOUHAR & PARTNERS — INNER PAGES VISUAL LAYER (v7)
   Brings every page other than index.html onto the editorial
   design language of the home page (home-v6.css).

   Loaded by the 20 inner pages, AFTER style-v5.css.
   Scoped to body.inner, mirroring how home-v6.css scopes to body.home.

   The token block below is a deliberate copy of the one in home-v6.css —
   the two files must stay in sync. If you change a palette value here,
   change it in home-v6.css too (and vice versa).

   NOTE ON TOKENS: v5 uses --ink / --text as *text* colours in some rules
   and as *background* colours in others. They are kept DARK here and the
   handful of background usages are overridden explicitly.
   Don't "fix" --ink to a light value.
   ============================================================ */

/* ===== 1. PALETTE & TYPE =================================== */
body.inner{
  --f-paper:#FAF9F6;
  --f-paper-2:#F1F0EB;
  --f-white:#FFFFFF;
  --f-ink:#15191A;
  --f-ink-soft:#3A3F3D;
  --f-muted:#6B6E6A;
  --f-blue-deep:#132F4F;   /* serif headline */
  --f-blue:#2E72B8;        /* rules, accents */
  --hairline:rgba(21,25,26,.14);
  --rule:rgba(21,25,26,.085);   /* list dividers — lighter than section edges */
  --hairline-soft:rgba(21,25,26,.08);
  --hdr:76px;
  --gutter:clamp(24px,8.5vw,168px);  /* shared left/right page margin */
  --sp-y:clamp(58px,8.2vh,96px);    /* section half-gap */
  --sp-head:clamp(46px,6.2vh,72px); /* heading stack -> content it introduces */

  --sans:'Inter','Hanken Grotesk',-apple-system,BlinkMacSystemFont,'Helvetica Neue',sans-serif;
  --serif:'Playfair Display',Georgia,'Times New Roman',serif;

  /* v5 variable overrides */
  --ink:#15191A;
  --ink-2:#1F2422;
  --blue:#132F4F;
  --blue-light:#2E72B8;
  --blue-pale:#EDF2F8;
  --gold:#2E72B8;
  --gold-light:#2E72B8;
  --cream:#F1F0EB;
  --cream-2:#F1F0EB;
  --paper:#FAF9F6;
  --text:#15191A;
  --muted:#6B6E6A;
  --line:rgba(21,25,26,.14);
  --line-dark:rgba(21,25,26,.14);
  --on-dark-muted:#6B6E6A;
  --shadow-sm:none;
  --shadow-md:0 18px 44px -30px rgba(21,25,26,.3);
  --shadow-lg:0 30px 70px -40px rgba(21,25,26,.28);

  font-family:var(--sans);
  background:var(--f-paper);
  color:var(--f-ink);
}
body.inner h1,body.inner h2,body.inner h3{font-family:var(--serif);font-weight:400;}
body.inner h4,body.inner h5,body.inner .btn,body.inner nav.mainnav a{font-family:var(--sans);}
body.inner ::selection{background:var(--f-blue-deep);color:#fff;}
body.inner .eyebrow{
  font-size:12px;letter-spacing:.11em;font-weight:700;
  color:var(--f-ink);text-transform:uppercase;
}
body.inner .skip-link{background:var(--f-blue-deep);}

/* ===== 2. HEADER — identical treatment to the home page ===== */
body.inner header{
  position:fixed;top:0;left:0;right:0;
  height:var(--hdr);padding:0 clamp(20px,2.6vw,40px);
  background:rgba(250,249,246,.92);
  backdrop-filter:blur(16px) saturate(1.3);
  -webkit-backdrop-filter:blur(16px) saturate(1.3);
  box-shadow:none;
  border-bottom:1px solid var(--hairline);
  justify-content:space-between;   /* inner pages keep the logo — no .edge-brand */
  transition:height .4s var(--ease),background .4s ease,border-color .4s ease;
}
body.inner header.scrolled{height:64px;}
/* logo.png is a light mark — invert it for the light header */
body.inner .brand img{height:44px;width:auto;object-fit:contain;filter:brightness(0);opacity:.92;}
body.inner header.scrolled .brand img{height:38px;}
body.inner .header-right{gap:clamp(16px,1.8vw,28px);}

body.inner nav.mainnav{gap:clamp(16px,1.7vw,28px);}
body.inner nav.mainnav a{
  font-size:14.5px;letter-spacing:0;font-weight:400;text-transform:none;
  color:var(--f-muted);padding-bottom:2px;transition:color .25s ease;
}
body.inner nav.mainnav a:hover,
body.inner nav.mainnav a.active{color:var(--f-ink);}
body.inner nav.mainnav a::after{display:none;}
body.inner nav.mainnav a svg.caret{width:10px;height:10px;opacity:.6;}

/* CTA reads as one more nav item, not a button */
body.inner header .btn-fill{
  background:transparent;color:var(--f-muted);border:none;box-shadow:none;
  padding:0;font-size:14.5px;letter-spacing:0;font-weight:400;text-transform:none;
}
body.inner header .btn-fill:hover{background:transparent;color:var(--f-ink);transform:none;}
body.inner header .btn-fill svg{width:12px;height:12px;}

body.inner .lang>summary{
  border:none;color:var(--f-muted);padding:4px 2px;
  font-size:14.5px;letter-spacing:0;font-weight:400;
}
body.inner .lang>summary:hover{color:var(--f-ink);}
body.inner .lang .flag{width:18px;height:12px;}
body.inner .lang-menu{
  background:#fff;border:1px solid var(--hairline);border-radius:2px;
  box-shadow:0 22px 55px -28px rgba(21,25,26,.4);
}
body.inner .lang-menu a{color:var(--f-ink-soft);border-radius:0;}
body.inner .lang-menu a:hover{background:var(--f-paper-2);color:var(--f-ink);}
body.inner .lang-menu a[aria-current="true"]{color:var(--f-blue-deep);}

/* mega-menu */
body.inner .nav-panel-inner{
  background:#fff;border:1px solid var(--hairline);border-top:2px solid var(--f-blue);
  box-shadow:0 30px 70px -34px rgba(21,25,26,.38);
}
body.inner .nav-col-title{color:var(--f-blue-deep);border-bottom-color:var(--hairline);}
body.inner nav.mainnav .nav-panel a{color:var(--f-ink-soft);font-size:13.5px;}
body.inner nav.mainnav .nav-panel a:hover{background:var(--f-paper-2);color:var(--f-ink);}
body.inner nav.mainnav .nav-panel a.nav-panel-all{color:var(--f-blue-deep);}
body.inner nav.mainnav .nav-panel a.nav-panel-all:hover{background:transparent;color:var(--f-blue);}

/* mobile nav */
body.inner .mobile-nav-panel{background:var(--f-paper);}
body.inner .burger span{background:var(--f-ink);}
body.inner .mobile-nav-panel nav a{color:var(--f-ink);border-bottom-color:var(--hairline);font-family:var(--serif);text-transform:none;}
body.inner .m-sub>summary{color:var(--f-ink);font-family:var(--serif);text-transform:none;}
body.inner .m-sub-title{color:var(--f-blue-deep);}
body.inner .mobile-nav-panel .m-sub-panel a{color:var(--f-muted);border-left-color:var(--hairline);font-family:var(--sans);}
body.inner .mobile-nav-panel .m-sub-panel a:hover{color:var(--f-ink);border-left-color:var(--f-blue);}
body.inner .mobile-nav-panel .m-sub-panel a.m-sub-all{color:var(--f-blue-deep);}
body.inner .mobile-nav-panel .btn-fill{
  background:var(--f-blue-deep);color:#fff;border-color:var(--f-blue-deep);
  padding:15px 22px;font-size:13px;
}

/* ===== 3. BUTTONS — the home page's understated language ==== */
body.inner .btn-fill{
  background:var(--f-blue-deep);color:#fff;border-radius:0;
  border:1px solid var(--f-blue-deep);box-shadow:none;
  font-size:12.5px;letter-spacing:.09em;font-weight:600;padding:15px 26px;
}
body.inner .btn-fill:hover{background:var(--f-blue);border-color:var(--f-blue);transform:none;box-shadow:none;}
body.inner .btn-outline,body.inner .btn-ghost{
  background:transparent;color:var(--f-blue-deep);border:1px solid var(--hairline);
  border-radius:0;font-size:12.5px;letter-spacing:.09em;font-weight:600;padding:15px 26px;
}
body.inner .btn-outline:hover,body.inner .btn-ghost:hover{
  background:transparent;color:var(--f-blue);border-color:var(--f-blue);transform:none;
}

/* ===== 4. PAGE HERO — light editorial band ==================
   v5 rendered this as a near-black slab. The home page opens on paper,
   so inner pages do too: same serif scale, same hairline rule. */
body.inner .page-hero{
  background:var(--f-paper);color:var(--f-ink);
  padding:calc(var(--hdr) + clamp(50px,7vh,88px)) var(--gutter) clamp(42px,5.4vh,68px);
  border-bottom:1px solid var(--hairline);
}
body.inner .page-hero .crumb{
  font-size:12px;letter-spacing:.05em;text-transform:none;
  color:var(--f-muted);margin-bottom:26px;display:flex;gap:9px;align-items:center;flex-wrap:wrap;
}
body.inner .page-hero .crumb a{color:var(--f-muted);border-bottom:1px solid transparent;transition:color .25s ease,border-color .25s ease;}
body.inner .page-hero .crumb a:hover{color:var(--f-blue-deep);border-bottom-color:var(--f-blue);}
body.inner .page-hero .crumb span{opacity:.4;}
body.inner .page-hero .eyebrow{color:var(--f-ink);}
body.inner .page-hero h1{
  font-family:var(--serif);
  font-size:clamp(32px,3.6vw,54px);font-weight:400;
  line-height:1.1;letter-spacing:-.008em;
  color:var(--f-blue-deep);margin:20px 0 0;
  max-width:19ch;text-wrap:balance;
}
body.inner .page-hero .rule{
  width:min(100%,420px);height:1px;background:var(--f-blue);
  margin:26px 0 0;border-radius:0;
}
body.inner .page-hero p{
  color:var(--f-muted);max-width:52ch;
  font-size:16.5px;line-height:1.6;font-weight:400;margin-top:22px;
}

/* ===== 5. SHARED CONTENT TYPOGRAPHY ========================= */
body.inner .exp-body h2,
body.inner .cabinet-left h2,
body.inner .contact-info h2,
body.inner .contact-form-box h2{
  font-family:var(--serif);
  font-size:clamp(24px,2.4vw,34px);font-weight:400;
  letter-spacing:-.005em;line-height:1.16;color:var(--f-blue-deep);margin:0;
}
body.inner .exp-body .rule,
body.inner .cabinet-left .rule,
body.inner .contact-info .rule{
  width:min(100%,240px);height:1px;background:var(--f-blue);
  margin:22px 0 24px;border-radius:0;
}
body.inner .exp-body p,
body.inner .cabinet-left p{
  font-size:15.5px;line-height:1.75;color:var(--f-ink-soft);max-width:68ch;
}

/* ===== 6. EXPERTISE PAGES — body + aside ==================== */
body.inner .exp-page{
  display:grid;
  grid-template-columns:minmax(0,1.85fr) minmax(0,1fr);
  gap:clamp(36px,4.8vw,88px);
  padding:var(--sp-y) var(--gutter);
  align-items:start;
  background:var(--f-paper);
}
body.inner .exp-body{display:flex;flex-direction:column;gap:var(--sp-head);}
body.inner .exp-body>section{margin:0;padding:0;background:none;border:none;}
body.inner .exp-body>section+section{
  padding-top:var(--sp-head);border-top:1px solid var(--rule);
}
body.inner .exp-body p+p{margin-top:18px;}

/* checked list -> hairline-ruled index, same gesture as the home lists */
/* v5 lays this out as a 2-column grid of rounded cards — flatten it back
   to the single hairline-ruled index used everywhere else. */
body.inner .exp-points{
  display:block;margin:0;padding:0;
  border-top:1px solid var(--rule);
}
body.inner .exp-points li{
  position:relative;
  display:grid;grid-template-columns:auto minmax(0,1fr);
  align-items:baseline;gap:clamp(12px,1.4vw,20px);
  padding:clamp(15px,1.3vw,21px) 0;
  background:none;border:none;border-radius:0;box-shadow:none;
  border-bottom:1px solid var(--rule);
  font-size:15.5px;line-height:1.6;color:var(--f-ink);
}
body.inner .exp-points li:hover{
  background:none;box-shadow:none;transform:none;
}
body.inner .exp-points li::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:var(--f-blue);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease);
}
body.inner .exp-points li:hover::after{transform:scaleX(1);}
body.inner .exp-points li .tick{
  width:15px;height:15px;flex-shrink:0;
  color:var(--f-blue);opacity:.5;transition:opacity .3s ease;
}
body.inner .exp-points li:hover .tick{opacity:1;}
body.inner .exp-points li span{transition:transform .35s var(--ease);}
body.inner .exp-points li:hover span{transform:translateX(5px);}

/* --- FAQ --- */
body.inner .faq{background:none;padding:0;border:none;}
body.inner .faq h2{
  font-family:var(--serif);font-size:clamp(24px,2.4vw,34px);
  font-weight:400;color:var(--f-blue-deep);letter-spacing:-.005em;
}
body.inner .faq details{
  border:none;border-bottom:1px solid var(--rule);border-radius:0;
  background:none;margin:0;padding:0;
}
body.inner .faq details:first-of-type{border-top:1px solid var(--rule);}
body.inner .faq summary{
  position:relative;
  padding:clamp(18px,1.6vw,25px) 44px clamp(18px,1.6vw,25px) 0;
  font-family:var(--serif);
  font-size:clamp(16px,1.35vw,19.5px);font-weight:400;letter-spacing:-.005em;
  color:var(--f-ink);background:none;line-height:1.35;
  cursor:pointer;list-style:none;
  transition:color .3s ease;
}
body.inner .faq summary::-webkit-details-marker{display:none;}
body.inner .faq summary:hover{color:var(--f-blue-deep);}
/* thin + / − marker, drawn in CSS so no new SVG is needed in the markup */
/* v5 draws a rotated chevron here using borders — reset both before
   redrawing the marker as a thin + that becomes a - when open. */
body.inner .faq summary::after,
body.inner .faq summary::before{
  content:'';position:absolute;right:6px;top:50%;
  border:none;transform:none;
  background:var(--f-blue);transition:transform .4s var(--ease),opacity .3s ease;
}
body.inner .faq summary::before{width:15px;height:1px;margin-top:-.5px;}
body.inner .faq summary::after{width:1px;height:15px;margin-top:-7.5px;right:13px;}
body.inner .faq details[open] summary{color:var(--f-blue-deep);}
body.inner .faq details[open] summary::after{transform:rotate(90deg);opacity:0;}
body.inner .faq .faq-a{
  padding:0 44px clamp(20px,1.9vw,28px) 0;
  font-size:15px;line-height:1.75;color:var(--f-muted);max-width:70ch;
  background:none;border:none;
}

/* --- aside --- */
body.inner .exp-aside{
  display:flex;flex-direction:column;gap:clamp(28px,3vw,42px);
  position:sticky;top:calc(var(--hdr) + clamp(26px,4.5vh,54px));
  align-self:start;
}
body.inner .aside-cta,
body.inner .aside-box{
  background:none;border:none;border-radius:0;box-shadow:none;padding:0;
  border-top:1px solid var(--hairline);padding-top:clamp(22px,2vw,30px);
}
body.inner .aside-cta h4,
body.inner .aside-box h4{
  font-family:var(--serif);font-size:20px;font-weight:400;
  letter-spacing:-.005em;text-transform:none;
  color:var(--f-blue-deep);margin:0 0 14px;
}
body.inner .aside-cta p{font-size:14.5px;line-height:1.65;color:var(--f-muted);margin-bottom:24px;}
body.inner .aside-links{margin:0;padding:0;border-top:1px solid var(--rule);}
body.inner .aside-links li{margin:0;}
body.inner .aside-links li a{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:13px 0;border-bottom:1px solid var(--rule);
  font-size:14.5px;line-height:1.45;color:var(--f-ink);background:none;
  transition:color .3s ease;
}
body.inner .aside-links li a:hover{color:var(--f-blue-deep);background:none;padding-left:0;}
body.inner .aside-links li a svg{
  width:13px;height:13px;flex-shrink:0;color:rgba(21,25,26,.25);
  transition:transform .35s var(--ease),color .3s ease;
}
body.inner .aside-links li a:hover svg{transform:translateX(4px);color:var(--f-blue);}
body.inner .aside-all{
  display:inline-flex;align-items:center;gap:9px;margin-top:20px;
  font-size:14px;font-weight:500;color:var(--f-blue-deep);
  border-bottom:1px solid var(--f-blue);padding-bottom:4px;
  transition:gap .35s var(--ease),color .3s ease;
}
body.inner .aside-all svg{width:13px;height:13px;}
body.inner .aside-all:hover{gap:15px;color:var(--f-blue);}

/* ===== 7. CLOSING BAND (exp-band) — mirrors home .cta-band === */
body.inner .exp-band{
  background:var(--f-white);color:var(--f-ink);
  border-top:1px solid var(--hairline);
  padding:var(--sp-y) var(--gutter);
  text-align:left;
}
body.inner .exp-band .eyebrow{color:var(--f-ink);}
body.inner .exp-band h2{
  font-family:var(--serif);
  font-size:clamp(30px,3.4vw,48px);font-weight:400;
  letter-spacing:-.005em;line-height:1.12;color:var(--f-blue-deep);margin:22px 0 0;
  max-width:18ch;
}
body.inner .exp-band .rule{
  width:min(100%,300px);height:1px;background:var(--f-blue);margin:26px 0 0;
}
body.inner .exp-band p{
  font-size:16px;line-height:1.65;color:var(--f-muted);
  margin:24px auto 0 0;   /* v5 centres with `margin:0 auto` */
  max-width:46ch;
}
body.inner .exp-band-actions{
  display:flex;flex-wrap:wrap;gap:16px;margin-top:32px;justify-content:flex-start;
}

/* ===== 8. CABINET PAGE ====================================== */
body.inner .cabinet{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
  gap:clamp(36px,4.8vw,88px);
  padding:var(--sp-y) var(--gutter);
  align-items:start;background:var(--f-paper);
}
body.inner .cabinet-left p+p{margin-top:18px;}
body.inner .cabinet-left .more{
  display:inline-flex;align-items:center;gap:10px;margin-top:32px;
  font-size:14.5px;font-weight:500;letter-spacing:0;text-transform:none;
  color:var(--f-blue-deep);border-bottom:1px solid var(--f-blue);padding-bottom:4px;
  transition:gap .35s var(--ease),color .3s ease;
}
body.inner .cabinet-left .more svg{width:14px;height:14px;}
body.inner .cabinet-left .more:hover{gap:15px;color:var(--f-blue);}

body.inner .cabinet-card{
  background:none;border:none;border-radius:0;box-shadow:none;padding:0;
  display:flex;flex-direction:column;gap:0;
  border-top:1px solid var(--rule);
}
body.inner .cabinet-item{
  position:relative;
  display:grid;grid-template-columns:auto minmax(0,1fr);
  align-items:start;gap:clamp(14px,1.6vw,22px);
  padding:clamp(20px,1.7vw,28px) 0;
  border-bottom:1px solid var(--rule);background:none;
}
body.inner .cabinet-item::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:var(--f-blue);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease);
}
body.inner .cabinet-item:hover::after{transform:scaleX(1);}
body.inner .cabinet-item .icon{
  width:22px;height:22px;flex-shrink:0;margin:0;
  background:none;border:none;border-radius:0;
  color:var(--f-blue-deep);opacity:.45;transition:opacity .3s ease;
}
body.inner .cabinet-item:hover .icon{background:none;color:var(--f-blue-deep);opacity:1;transform:none;}
body.inner .cabinet-item .icon svg{width:22px;height:22px;}
body.inner .cabinet-item h4{
  font-family:var(--serif);
  font-size:clamp(16px,1.4vw,20px);font-weight:400;letter-spacing:-.005em;
  text-transform:none;color:var(--f-ink);margin:0 0 8px;
  transition:color .3s ease;
}
body.inner .cabinet-item:hover h4{color:var(--f-blue-deep);}
body.inner .cabinet-item p{font-size:14.5px;line-height:1.65;color:var(--f-muted);}

/* ===== 9. ÉQUIPE — portrait index ===========================
   .portrait carries data-initials; the monogram is drawn in CSS and the
   <img> simply covers it once a real photo exists at that filename.
   The markup uses onerror="this.remove()" so a missing file degrades to
   the monogram instead of a broken-image icon. */
body.inner .equipe{
  background:var(--f-white);
  border-top:1px solid var(--hairline);
  padding:var(--sp-y) var(--gutter);
}
body.inner .equipe-head{max-width:640px;margin-bottom:var(--sp-head);}
body.inner .equipe-head h2{
  font-family:var(--serif);
  font-size:clamp(29px,3.4vw,46px);font-weight:400;
  letter-spacing:-.008em;line-height:1.1;color:var(--f-blue-deep);margin:20px 0 0;
}
body.inner .equipe-head .rule{
  width:min(100%,300px);height:1px;background:var(--f-blue);margin:26px 0 0;
}
body.inner .equipe-head p{
  font-size:15.5px;line-height:1.65;color:var(--f-muted);margin-top:24px;max-width:52ch;
}
body.inner .equipe-grid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(24px,2.8vw,44px);
}
body.inner .membre{margin:0;display:flex;flex-direction:column;}
body.inner .membre .portrait{
  position:relative;aspect-ratio:3/4;overflow:hidden;
  background:var(--f-paper-2);
  border-bottom:1px solid var(--hairline);
}
/* monogram placeholder — sits under the photo */
body.inner .membre .portrait::before{
  content:attr(data-initials);
  position:absolute;inset:0;z-index:0;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-size:clamp(34px,3.4vw,52px);font-weight:400;
  letter-spacing:.02em;color:var(--f-blue-deep);opacity:.22;
}
body.inner .membre .portrait img{
  position:relative;z-index:1;
  width:100%;height:100%;object-fit:cover;object-position:center top;
  filter:grayscale(1) contrast(1.06) brightness(.99);
  transition:filter .5s var(--ease),transform .7s var(--ease);
}
body.inner .membre:hover .portrait img{filter:grayscale(0) contrast(1) brightness(1);transform:scale(1.03);}
/* the accent hairline gesture, reused */
body.inner .membre .portrait::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;z-index:2;
  background:var(--f-blue);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease);
}
body.inner .membre:hover .portrait::after{transform:scaleX(1);}
body.inner .membre figcaption{padding-top:18px;}
body.inner .membre h3{
  font-family:var(--serif);
  font-size:clamp(17px,1.5vw,21px);font-weight:400;letter-spacing:-.005em;
  color:var(--f-ink);margin:0;transition:color .3s ease;
}
body.inner .membre:hover h3{color:var(--f-blue-deep);}
body.inner .membre .role{
  font-size:11px;letter-spacing:.13em;font-weight:700;text-transform:uppercase;
  color:var(--f-blue);margin-top:9px;
}
body.inner .membre .bio{
  font-size:14px;line-height:1.65;color:var(--f-muted);margin-top:12px;
}
body.inner .membre.is-placeholder h3{color:var(--f-muted);font-style:italic;}

/* ===== 10. HORAIRES — 24h/24, 7j/7 ========================== */
body.inner .dispo-24,
body.inner .fcol p.dispo-24,
body.inner .contact-list .item .sub.dispo-24{
  display:inline-flex;align-items:center;gap:8px;
  font-size:11px;letter-spacing:.13em;font-weight:700;text-transform:uppercase;
  color:var(--f-blue);
}
body.inner .dispo-24::before{
  content:'';width:6px;height:6px;border-radius:50%;
  background:var(--f-blue);flex-shrink:0;
  box-shadow:0 0 0 0 rgba(46,114,184,.55);
  animation:dispoPulse 2.4s var(--ease) infinite;
}
@keyframes dispoPulse{
  0%{box-shadow:0 0 0 0 rgba(46,114,184,.5);}
  70%{box-shadow:0 0 0 7px rgba(46,114,184,0);}
  100%{box-shadow:0 0 0 0 rgba(46,114,184,0);}
}
@media (prefers-reduced-motion:reduce){
  body.inner .dispo-24::before{animation:none;}
}

/* ===== 11. EXPERTISES INDEX PAGE ============================ */
body.inner .expertise-row{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(32px,4vw,72px);
  padding:var(--sp-y) var(--gutter);
  background:var(--f-paper);align-items:start;
}
/* DOM order is .exp-col-inner then .exp-photo (v5 laid the column out as a
   horizontal card); the image belongs on top once it stacks. */
body.inner .exp-col{
  background:none;border:none;border-radius:0;overflow:visible;
  display:flex;flex-direction:column;box-shadow:none;
}
body.inner .exp-col:hover{box-shadow:none;transform:none;}
body.inner .exp-col-inner{padding:0;}
body.inner .exp-col h3{
  font-family:var(--serif);
  font-size:clamp(22px,2.2vw,30px);font-weight:400;letter-spacing:-.005em;
  text-transform:none;color:var(--f-blue-deep);margin:0 0 26px;
}
body.inner .exp-photo{
  order:-1;
  width:100%;height:clamp(150px,18vw,230px);
  margin-bottom:28px;overflow:hidden;
}
body.inner .exp-photo::before{display:none;}
body.inner .exp-photo img{filter:grayscale(1) contrast(1.08) brightness(.97);}
body.inner .exp-col:hover .exp-photo img{transform:scale(1.04);}
body.inner .exp-list{border-top:1px solid var(--rule);}
body.inner .exp-list li{margin:0;}
body.inner .exp-list li a{
  position:relative;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:clamp(14px,1.25vw,20px) 0;border-bottom:1px solid var(--rule);
  font-size:clamp(15px,1.25vw,17.5px);line-height:1.35;color:var(--f-ink);
  background:none;border-radius:0;
  transition:color .3s ease;
}
body.inner .exp-list li a::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:var(--f-blue);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease);
}
body.inner .exp-list li a:hover{color:var(--f-blue-deep);background:none;padding-left:0;}
body.inner .exp-list li a:hover::after{transform:scaleX(1);}
body.inner .exp-list li a svg{width:14px;height:14px;color:rgba(21,25,26,.22);}
body.inner .exp-list li a:hover svg{color:var(--f-blue);transform:translateX(4px);}
body.inner .exp-voir{
  display:inline-flex;align-items:center;gap:9px;margin-top:22px;
  font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;
  color:var(--f-blue-deep);border-bottom:1px solid var(--f-blue);padding-bottom:4px;
  transition:gap .35s var(--ease),color .3s ease;
}
body.inner .exp-voir:hover{gap:15px;color:var(--f-blue);}
body.inner .innov-list{border-top:1px solid var(--rule);}
body.inner .innov-list li{
  padding:14px 0;margin:0;border-bottom:1px solid var(--rule);
  border-radius:0;font-size:15px;color:var(--f-ink);
}
body.inner .innov-list li:hover{background:none;padding-left:0;color:var(--f-blue-deep);}
body.inner .innov-list li .icon{color:var(--f-blue);opacity:.55;}
body.inner .innov-list li:hover .icon{opacity:1;}

/* --- secteurs (shared with the home page's editorial index) --- */
body.inner .secteurs{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.85fr);
  gap:clamp(36px,4.8vw,88px);
  padding:var(--sp-y) var(--gutter);
  align-items:start;
  background:var(--f-white);border-top:1px solid var(--hairline);
}
body.inner .secteurs-head{
  max-width:none;margin-bottom:0;align-self:start;
  position:sticky;top:calc(var(--hdr) + clamp(26px,4.5vh,54px));
}
body.inner .secteurs-head h2{
  font-family:var(--serif);
  font-size:clamp(26px,2.7vw,38px);font-weight:400;
  letter-spacing:-.005em;line-height:1.16;color:var(--f-blue-deep);margin:22px 0 0;
}
body.inner .secteurs-head .rule{
  width:min(100%,300px);height:1px;margin:26px 0 0;background:var(--f-blue);
}
body.inner .secteurs-head p{
  font-size:15px;line-height:1.65;color:var(--f-muted);margin-top:24px;max-width:42ch;
}
body.inner .secteur-grid{display:flex;flex-direction:column;gap:0;background:none;border:none;}
body.inner .secteur-card{
  position:relative;
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;gap:clamp(14px,1.8vw,26px);
  padding:clamp(18px,1.45vw,25px) 0;
  border:none;border-bottom:1px solid var(--rule);
  background:none;box-shadow:none;border-radius:0;
}
body.inner .secteur-card:hover{background:none;transform:none;box-shadow:none;}
body.inner .secteur-card:first-child{padding-top:0;}
body.inner .secteur-card:last-child{border-bottom:none;}
body.inner .secteur-card::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:var(--f-blue);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease);
}
body.inner .secteur-card:hover::after{transform:scaleX(1);}
body.inner .secteur-card .icon{
  width:21px;height:21px;margin:0;flex-shrink:0;
  background:none;border:none;border-radius:0;
  color:var(--f-blue-deep);opacity:.45;transition:opacity .3s ease;
}
body.inner .secteur-card .icon svg{width:21px;height:21px;}
body.inner .secteur-card:hover .icon{background:none;border:none;color:var(--f-blue-deep);opacity:1;transform:none;}
body.inner .secteur-card h4{
  font-family:var(--serif);
  font-size:clamp(16px,1.4vw,20px);font-weight:400;letter-spacing:-.005em;
  text-transform:none;color:var(--f-ink);line-height:1.3;
  transition:transform .35s var(--ease),color .3s ease;
}
body.inner .secteur-card:hover h4{transform:translateX(7px);color:var(--f-blue-deep);}
body.inner .secteur-cta{
  margin:0;padding:0;font-size:0;letter-spacing:0;
  color:rgba(21,25,26,.28);
  transition:color .3s ease,transform .35s var(--ease);
}
body.inner .secteur-cta svg{width:17px;height:17px;}
body.inner .secteur-card:hover .secteur-cta{color:var(--f-blue);transform:translateX(5px);}

/* ===== 12. MÉTHODE (cabinet page) — home's index layout ===== */
body.inner .methode{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.85fr);
  gap:clamp(36px,4.8vw,88px);
  padding:var(--sp-y) var(--gutter);
  align-items:start;
  background:var(--f-paper);border-top:1px solid var(--hairline);
}
body.inner .methode-head{
  max-width:none;margin-bottom:0;align-self:start;
  position:sticky;top:calc(var(--hdr) + clamp(26px,4.5vh,54px));
}
body.inner .methode-head h2{
  font-family:var(--serif);
  font-size:clamp(26px,2.7vw,38px);font-weight:400;
  letter-spacing:-.005em;line-height:1.16;color:var(--f-blue-deep);margin:22px 0 0;
}
body.inner .methode-head .rule{
  width:min(100%,300px);height:1px;margin:26px 0 0;background:var(--f-blue);
}
body.inner .methode-head p{
  font-size:15px;line-height:1.65;color:var(--f-muted);margin-top:24px;max-width:42ch;
}
body.inner .methode-steps{display:flex;flex-direction:column;gap:0;}
body.inner .methode-steps::before{display:none;}
body.inner .methode-step{
  position:relative;
  display:grid;
  grid-template-columns:clamp(50px,4.4vw,76px) minmax(0,1fr);
  grid-template-rows:auto auto;
  gap:2px clamp(16px,2.2vw,34px);
  padding:clamp(21px,1.75vw,30px) 0;
  border:none;border-bottom:1px solid var(--rule);
}
body.inner .methode-step:first-child{padding-top:0;}
body.inner .methode-step:last-child{border-bottom:none;}
body.inner .methode-step::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:var(--f-blue);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease);
}
body.inner .methode-step:hover::after{transform:scaleX(1);}
body.inner .methode-step .num{
  grid-column:1;grid-row:1 / span 2;
  width:auto;height:auto;border:none;background:none;border-radius:0;display:block;
  font-family:var(--serif);font-size:clamp(21px,1.95vw,29px);font-weight:400;
  color:var(--f-blue);opacity:.42;line-height:1.15;transition:opacity .3s ease;
}
body.inner .methode-step:hover .num{background:none;border:none;color:var(--f-blue);opacity:1;transform:none;}
body.inner .methode-step h4{
  grid-column:2;grid-row:1;
  font-family:var(--serif);
  font-size:clamp(16px,1.4vw,20px);font-weight:400;letter-spacing:-.005em;
  text-transform:none;color:var(--f-ink);margin:0 0 9px;transition:color .3s ease;
}
body.inner .methode-step:hover h4{color:var(--f-blue-deep);}
body.inner .methode-step p{
  grid-column:2;grid-row:2;
  font-size:14.5px;line-height:1.65;color:var(--f-muted);max-width:62ch;
}

/* ===== 13. ACTUALITÉ ======================================== */
body.inner .actu-section{padding:var(--sp-y) var(--gutter);background:var(--f-paper);}
body.inner .actu-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:clamp(24px,4vw,64px);flex-wrap:wrap;
  margin-bottom:var(--sp-head);
}
body.inner .actu-head h2{
  font-family:var(--serif);
  font-size:clamp(29px,3.4vw,46px);font-weight:400;
  letter-spacing:-.008em;line-height:1.1;color:var(--f-blue-deep);margin:0;
}
body.inner .actu-head .toutes{
  font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;
  color:var(--f-blue-deep);border-bottom:1px solid var(--f-blue);padding-bottom:4px;
  transition:gap .35s var(--ease),color .3s ease;
}
body.inner .actu-head .toutes svg{width:14px;height:14px;}
body.inner .actu-head .toutes:hover{gap:15px;color:var(--f-blue);}
body.inner .actu-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(26px,3vw,48px);
}
body.inner .actu-card{
  flex-direction:column;background:none;border:none;border-radius:0;
  box-shadow:none;overflow:visible;
  border-top:1px solid var(--rule);padding-top:0;
  position:relative;
}
body.inner .actu-card:hover{background:none;box-shadow:none;transform:none;}
body.inner .actu-card::after{
  content:'';position:absolute;left:0;right:0;top:-1px;height:1px;
  background:var(--f-blue);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease);
}
body.inner .actu-card:hover::after{transform:scaleX(1);}
/* DOM order is .txt then .photo (v5 laid the card out horizontally);
   the image belongs on top in the stacked layout. */
body.inner .actu-card .photo{
  order:-1;
  width:100%;height:clamp(160px,15vw,210px);flex-shrink:0;overflow:hidden;margin-top:22px;
}
body.inner .actu-card .photo img{filter:grayscale(1) contrast(1.08) brightness(.97);}
body.inner .actu-card:hover .photo img{transform:scale(1.04);}
body.inner .actu-card .txt{padding:20px 0 26px;gap:0;justify-content:flex-start;}
body.inner .actu-card .date{
  background:none;border-radius:0;padding:0;
  font-size:11px;letter-spacing:.13em;font-weight:700;text-transform:uppercase;
  color:var(--f-blue);
}
body.inner .actu-card h4{
  font-family:var(--serif);
  font-size:clamp(17px,1.5vw,21px);font-weight:400;letter-spacing:-.005em;
  line-height:1.3;color:var(--f-ink);margin-top:12px;transition:color .3s ease;
}
body.inner .actu-card:hover h4{color:var(--f-blue-deep);}
body.inner .actu-card .lire{
  font-size:13.5px;font-weight:500;letter-spacing:0;text-transform:none;
  color:var(--f-blue-deep);margin-top:16px;
}
body.inner .actu-card .lire svg{width:13px;height:13px;}
body.inner .actu-card:hover .lire{gap:11px;color:var(--f-blue);}

/* ===== 14. CONTACT ========================================== */
body.inner .contact-wrap{
  max-width:none;margin:0;
  padding:var(--sp-y) var(--gutter);
  grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  gap:clamp(36px,4.8vw,88px);align-items:start;
  background:var(--f-paper);
}
body.inner .contact-info>p,
body.inner .contact-form-box>p{
  color:var(--f-muted);font-size:15.5px;line-height:1.7;margin-bottom:34px;max-width:46ch;
}
body.inner .contact-list{gap:0;border-top:1px solid var(--rule);}
/* v5 re-declares .contact-list .item as a rounded card further down the file
   (§ "contact" second block) — every one of those properties is reset here. */
body.inner .contact-list .item{
  position:relative;
  display:flex;align-items:flex-start;
  gap:clamp(14px,1.6vw,22px);
  padding:clamp(18px,1.6vw,25px) 0;
  background:none;border:none;border-radius:0;box-shadow:none;
  border-bottom:1px solid var(--rule);
}
body.inner .contact-list a.item:hover{
  background:none;border-color:transparent;box-shadow:none;transform:none;
}
body.inner .contact-list .item::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:var(--f-blue);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease);
}
body.inner .contact-list .item:hover::after{transform:scaleX(1);}
body.inner .contact-list .item .icon{
  width:22px;height:22px;border:none;border-radius:0;background:none;
  color:var(--f-blue-deep);opacity:.45;transition:opacity .3s ease;
}
body.inner .contact-list a.item:hover .icon{
  background:none;border-color:transparent;color:var(--f-blue-deep);opacity:1;transform:none;
}
body.inner .contact-list .item:hover .icon{opacity:1;}
body.inner .contact-list .item .icon svg{width:22px;height:22px;}
body.inner .contact-list .item h5,
body.inner .contact-list .item .lbl{
  font-size:11px;letter-spacing:.13em;font-weight:700;text-transform:uppercase;
  color:var(--f-ink);margin-bottom:9px;display:block;
}
body.inner .contact-list .item .val{
  font-family:var(--serif);font-size:17.5px;font-weight:400;color:var(--f-ink);
  display:block;line-height:1.35;transition:color .3s ease;
}
body.inner .contact-list a.item:hover .val{color:var(--f-blue-deep);}
body.inner .contact-list .item .sub{
  display:block;font-size:13.5px;line-height:1.6;color:var(--f-muted);margin-top:7px;
}
body.inner .contact-list .item .go{
  width:14px;height:14px;flex-shrink:0;color:rgba(21,25,26,.22);align-self:center;
}
body.inner .contact-list a.item:hover .go{color:var(--f-blue);transform:translateX(4px);}

/* the "sur rendez-vous" note — v5 renders it as a near-black slab */
body.inner .contact-note{
  display:flex;align-items:flex-start;
  gap:clamp(14px,1.6vw,22px);
  background:none;color:var(--f-ink);
  border:none;border-top:1px solid var(--hairline);
  padding:26px 0 0;margin-top:34px;
}
body.inner .contact-note .icon{
  width:22px;height:22px;flex-shrink:0;border-radius:0;background:none;
  color:var(--f-blue-deep);opacity:.75;
}
body.inner .contact-note .icon svg{width:22px;height:22px;}
body.inner .contact-note h5{
  font-size:11px;letter-spacing:.13em;font-weight:700;text-transform:uppercase;
  color:var(--f-ink);margin-bottom:10px;
}
body.inner .contact-note p{font-size:14px;line-height:1.7;color:var(--f-muted);margin-top:0;}

body.inner .contact-form-box{
  background:var(--f-white);border:1px solid var(--hairline);border-radius:0;
  box-shadow:none;padding:clamp(28px,3vw,46px);
}
body.inner .form-head{margin-bottom:30px;}
body.inner .cform{display:flex;flex-direction:column;gap:20px;}
body.inner .cform .row{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
body.inner .cform .field{display:flex;flex-direction:column;gap:8px;}
body.inner .cform label{
  font-size:11px;letter-spacing:.13em;font-weight:700;text-transform:uppercase;color:var(--f-ink);
}
body.inner .cform .req{color:var(--f-blue);}
body.inner .cform input,
body.inner .cform select,
body.inner .cform textarea{
  font-family:var(--sans);font-size:15px;color:var(--f-ink);
  background:var(--f-paper);
  border:1px solid var(--hairline);border-radius:0;
  padding:13px 14px;
  transition:border-color .25s ease,background .25s ease;
}
body.inner .cform input:focus,
body.inner .cform select:focus,
body.inner .cform textarea:focus{
  outline:none;border-color:var(--f-blue);background:var(--f-white);
}
body.inner .cform textarea{min-height:130px;resize:vertical;}
body.inner .cform .btn-fill{justify-content:center;margin-top:6px;}
body.inner .cform-note{
  display:flex;align-items:flex-start;gap:10px;
  font-size:13px;line-height:1.6;color:var(--f-muted);margin-top:18px;
}
body.inner .cform-note svg{width:15px;height:15px;flex-shrink:0;color:var(--f-blue);opacity:.7;margin-top:2px;}

/* map — v5 fixes the section to height:400px, which fights the padding below */
body.inner .contact-map{
  height:auto;background:var(--f-paper);
  border-top:none;
  padding:0 var(--gutter) var(--sp-y);
}
body.inner .contact-map iframe{
  display:block;width:100%;height:clamp(300px,42vh,430px);
  border:1px solid var(--hairline);
  filter:grayscale(1) contrast(1.05);transition:filter .5s var(--ease);
}
body.inner .contact-map:hover iframe{filter:grayscale(0);}

/* ===== 15. FOOTER =========================================== */
body.inner footer{background:var(--f-paper-2);color:var(--f-ink);}
body.inner footer::before{height:1px;background:var(--hairline);}
body.inner .footer-top{padding:var(--sp-y) var(--gutter);gap:clamp(28px,3.4vw,48px);}
body.inner .fcol .icon{
  width:22px;height:22px;background:none;border-radius:0;border:none;
  color:var(--f-blue-deep);opacity:.75;
}
body.inner .fcol:hover .icon{background:none;color:var(--f-blue-deep);opacity:1;transform:none;}
body.inner .fcol .icon svg{width:22px;height:22px;}
body.inner .fcol h5{
  font-size:11px;letter-spacing:.13em;font-weight:700;color:var(--f-ink);
  margin-bottom:12px;text-transform:uppercase;
}
body.inner .fcol p,body.inner .fcol a{font-size:14.5px;line-height:1.65;font-weight:400;color:var(--f-muted);}
body.inner .fcol a{border-bottom:1px solid transparent;padding-bottom:1px;transition:color .3s ease,border-color .3s ease;}
body.inner .fcol a:hover{color:var(--f-blue-deep);border-bottom-color:var(--f-blue);}
body.inner .footer-bottom{
  border-top:1px solid var(--hairline);
  padding:22px var(--gutter);
  font-size:13px;letter-spacing:0;color:var(--f-muted);
}
body.inner .footer-bottom .links a{
  border-bottom:1px solid transparent;padding-bottom:1px;
  transition:color .3s ease,border-color .3s ease;
}
body.inner .footer-bottom .links a:hover{color:var(--f-blue);border-bottom-color:var(--f-blue);}

/* ===== 16. BACK TO TOP ====================================== */
body.inner .back-to-top{
  width:42px;height:42px;border-radius:0;
  background:#fff;border:1px solid var(--hairline);color:var(--f-ink);
  box-shadow:0 18px 44px -24px rgba(21,25,26,.45);
}
body.inner .back-to-top:hover{background:var(--f-blue-deep);border-color:var(--f-blue-deep);color:#fff;}

/* ===== 17. RESPONSIVE ======================================= */
@media (max-width:1024px){
  body.inner .exp-page,
  body.inner .cabinet,
  body.inner .secteurs,
  body.inner .methode,
  body.inner .contact-wrap{
    grid-template-columns:1fr;gap:clamp(34px,5vh,52px);
  }
  body.inner .exp-aside,
  body.inner .secteurs-head,
  body.inner .methode-head{position:static;max-width:none;}
  body.inner .exp-aside{
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
    gap:clamp(26px,3vw,40px);align-items:start;
  }
  body.inner .expertise-row{grid-template-columns:1fr;}
  body.inner .equipe-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  body.inner .actu-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (max-width:768px){
  body.inner .actu-grid{grid-template-columns:1fr;}
  body.inner .exp-aside{grid-template-columns:1fr;}
  body.inner .cform .row{grid-template-columns:1fr;}
}

@media (max-width:640px){
  body.inner{--hdr:66px;--gutter:24px;}
  body.inner .brand img{height:28px;}
  body.inner .page-hero{padding-top:calc(var(--hdr) + 40px);}
  body.inner .page-hero h1{font-size:clamp(28px,7.4vw,36px);max-width:none;}
  body.inner .page-hero p{font-size:15.5px;}
  body.inner .equipe-grid{grid-template-columns:1fr;gap:34px;}
  body.inner .membre .portrait{aspect-ratio:4/3;}
  body.inner .exp-band-actions{flex-direction:column;align-items:stretch;}
  body.inner .exp-band-actions .btn{justify-content:center;}
  body.inner .exp-band h2{max-width:none;}
}

/* ===== 18. LIST TAILS =======================================
   Every ruled index above ends on a hairline, and the element that
   follows it (a section divider, the aside CTA, the contact note)
   opens with one too. Drop the trailing rule so they don't double up —
   the same treatment .secteur-card / .methode-step already get. */
body.inner .exp-points li:last-child,
body.inner .aside-links li:last-child a,
body.inner .exp-list li:last-child a,
body.inner .innov-list li:last-child,
body.inner .contact-list .item:last-of-type,
body.inner .cabinet-item:last-child{
  border-bottom:none;
}

/* ===== 19. LANGUAGE PICKER SPACING ==========================
   See the matching note in home-v6.css — v5's `margin-left:-12px` assumed a
   CTA sat between the nav and the picker. */
body.inner .header-right>.lang{margin-left:clamp(4px,1vw,16px);}

/* ===== NUMERALS — one face everywhere ======================
   See the matching note in home-v6.css. The contact list's .val was serif,
   which put the phone number and the 24h/24 hours in Playfair; the whole
   .val switches to Inter so the list stays typographically uniform rather
   than mixing faces row to row. */
body.inner .methode-step .num{
  font-family:var(--sans);
  font-weight:700;
  letter-spacing:.05em;
  font-variant-numeric:tabular-nums;
}
body.inner .contact-list .item .val{
  font-family:var(--sans);
  font-size:16.5px;font-weight:500;letter-spacing:.01em;
  font-variant-numeric:tabular-nums;
}
body.inner .fcol p,
body.inner .fcol a{font-variant-numeric:tabular-nums;}