/* ===== 00-fonts.css ===== */
/* excelia-audit.fr staging: Joomla 6, Cassiopeia Extended. Built from assets/excelia-audit/css/*.css by scripts/build-excelia-audit-assets.mjs.
   :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) stands for the content wrappers the Bootstrap 3 rules of the source are scoped to (see the build script). */
@import url("/eplus/eplus.css");
@import url("/eplus-config/config.css");
@import url("/eplus/lib/genericons/genericons.css");
@import url("https://fonts.googleapis.com/css?family=Roboto:400&display=swap");

@font-face { font-family: "metropolisregular"; src: url("../fonts/metropolis-regular-webfont.ttf") format("truetype"); font-weight: normal; font-style: normal; font-display: swap; }

:root { --orange: #f79a46; --gris: #4c4c4c; --violet: #7683e5; --orange-dark: #f57f15; }

/* ===== 10-base.css ===== */
/* ---------------------------------------------------------------------------------------------------------------
   Base: the source's theme.exceliapreset.css rules the pages use, rebuilt for Cassiopeia. The source is a Bootstrap 3
   page (Buildr/ZGF): root font-size 16 px, body metropolisregular 16/1.4, headings Roboto 700. Cassiopeia's own Bootstrap 5
   grid classes share the names the content uses (container, row, col-*), so the BS3 rules are carried here and scoped to
   the content wrappers: banner, top-a, main component, bottom-a, bottom-b and the footer.
   --------------------------------------------------------------------------------------------------------------- */
html, body { overflow-x: clip; }
html { width: 100% !important; height: auto; font-size: 16px; font-weight: 300; color: #4c4c4c; -webkit-tap-highlight-color: transparent; }
body { height: auto; min-height: 0; display: block; position: static; margin: 0; font-family: "metropolisregular", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 16px; font-weight: 300; line-height: 1.4em; color: #4c4c4c; background: #fff; }
*, *::before, *::after { box-sizing: border-box; }
a { color: var(--orange); text-decoration: none; background: transparent; }
a:hover, a:focus { color: var(--violet); text-decoration: none; }
a:not([class]), a:not([class]):hover, a[class=""] { text-decoration: none; }
img { max-width: 100%; vertical-align: middle; border: 0; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: Roboto, sans-serif; font-weight: 700; color: #4c4c4c; text-rendering: optimizelegibility; clear: both; margin-top: 0; line-height: 1.4em; }
h1 { margin-bottom: 0.67em; } h2 { margin-bottom: 0.83em; } h3 { margin-bottom: 1em; } h4 { margin-bottom: 1.33em; } h5 { margin-bottom: 1.67em; } h6 { margin-bottom: 2.33em; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: 700; color: #4c4c4c; }
h1, .h1 { font-size: 2.7em; }
h2, .h2 { font-size: 2.5em; }
h3, .h3 { font-size: 1.7em; }
h4, .h4 { font-size: 1.25em; }
p { margin: 0 0 15px; line-height: 1.4em; }
b, strong { font-weight: bold; }
ul, ol { margin: 0 0 30px 16px; padding: 0; }
.center { text-align: center; }
.justify { text-align: justify; }
i.iconHid { visibility: hidden; }
.fas, .far, .fab, .fa-solid, .fa-regular, .fa-brands { margin-right: 4px; }
.fa-2x { font-size: 2em; }
.fa-3x { font-size: 3em; }
.btn { display: inline-block; color: #fff; background: var(--orange); border: 1px solid var(--orange-dark); padding: 10px; border-radius: 0; box-shadow: none; text-shadow: none; margin: 0 10px 10px 0; font-size: inherit; font-weight: 300; text-align: inherit; vertical-align: baseline; transition: 0.2s ease-in; }
.btn:is(a, button) { line-height: inherit; }
p.btn { line-height: 1.4em; }
.btn:hover, .btn:focus { color: #fff; background: var(--violet); border: 1px solid #6170e1; text-decoration: none; }
.btn span { color: #fff; display: inline-block; }

/* ---- Bootstrap 3 grid, scoped (breakpoints 768 / 992 / 1200, 15 px gutters) ---- */
:where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .container { display: block; width: auto; max-width: 100%; margin: 0 auto; padding: 0 15px; clear: both; }
:where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .container::before, :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .container::after, :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .row::before, :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .row::after { content: ""; display: table; line-height: 0; }
:where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .container::after, :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .row::after { clear: both; }
:where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .row { display: block; flex-wrap: nowrap; margin: 0; clear: both; --bs-gutter-x: 0; }
:where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .row > * { width: auto; max-width: none; margin-top: 0; padding: 0 15px; flex-shrink: initial; }
:where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) [class*="col-"] { position: relative; min-height: 1px; padding: 0 15px; width: auto; flex: none; }
@media (min-width: 768px) { :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .container { width: 750px; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) [class*="col-sm-"] { float: left; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-sm-12 { width: 100%; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-sm-9 { width: 75%; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-sm-8 { width: 66.6667%; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-sm-7 { width: 58.3333%; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-sm-6 { width: 50%; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-sm-5 { width: 41.6667%; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-sm-4 { width: 33.3333%; } }
@media (min-width: 992px) { :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .container { width: 970px; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) [class*="col-md-"] { float: left; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-md-12 { width: 100%; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-md-6 { width: 50%; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-md-5 { width: 41.6667%; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-md-4 { width: 33.3333%; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-md-3 { width: 25%; } }
@media (min-width: 1200px) { :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .container { width: 1170px; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) [class*="col-lg-"] { float: left; } :where(.container-banner, .container-top-a, .container-component, .container-bottom-a, .container-bottom-b, footer.container-footer) .col-lg-4 { width: 33.3333%; } }
/* the component area: main .container has no padding and fills the column (theme: main .container { padding: 0; width: 100% }) */
main .container { padding: 0; width: 100%; }

/* ---- Cassiopeia's grid: the source has single full-width rows ---- */
.site-grid { display: block; margin: 0; padding: 0; }
.site-grid > .grid-child { display: block; max-width: none; width: 100%; }
.site-grid > .container-component { padding: 0; margin: 0; }
.container-component > * + *, .container-component > :first-child { margin-top: 0; }
#system-message-container:empty { display: none; }
main { display: block; }
.com-content-article, .item-page, .com-content-article__body { margin: 0; padding: 0; }
.container-banner, .container-top-a, .container-top-b, .container-bottom-a, .container-bottom-b, .container-debug { margin: 0; padding: 0; }
.site-grid > .container-bottom-a { display: flow-root; }
.container-top-a > *, .container-bottom-a > *, .container-bottom-b > *, .container-banner > * { margin-top: 0; }
.moduletable { margin: 0; padding: 0; border: 0; }
@media print { header.container-header, footer.container-footer, .ex-drawer, .ex-totop, .wa_agent, .clicktocallmod { display: none !important; } }

/* ===== 20-header.css ===== */
/* ---------------------------------------------------------------------------------------------------------------
   Header. Source: #navwrap (desktop, white, 80 px, padding 0 2%: logo col-4 + flat right-aligned navbar, which wraps to two
   lines in 788-1099) and #toolbar (phone/tablet, orange, fixed) with a Slidebars push drawer. Cassiopeia's header plays
   both roles; user.js adds the hamburger, the drawer, the sticky spacer and the back-to-top.
   --------------------------------------------------------------------------------------------------------------- */
header.container-header { display: flex; flex-wrap: nowrap; align-items: flex-start; width: 100%; max-width: none; height: auto; min-height: 0; margin: 0; padding: 0 2%; border: 0; background: #fff !important; background-image: none !important; box-shadow: none; position: relative; z-index: 10; color: #4c4c4c; }
header.container-header > .grid-child { max-width: none; margin: 0; padding: 0; }
header.container-header > .grid-child:first-child { flex: 0 0 33.3333%; width: 33.3333%; }
header.container-header .navbar-brand { display: block; margin: 15px 0; padding: 0; }
header.container-header .navbar-brand a { display: block; line-height: 0; }
header.container-header .navbar-brand img { display: inline; width: auto; max-width: 100%; height: auto; vertical-align: middle; }
header.container-header > .container-nav { flex: 0 0 66.6667%; width: 66.6667%; display: block; padding: 0; margin: 0; text-align: right; }
header.container-header .container-nav nav, header.container-header .container-nav .moduletable { margin: 0; padding: 0; display: block; }
header.container-header .mod-menu { display: block; margin: 0; padding: 15px 0; list-style: none; text-align: right; font-family: "metropolisregular", sans-serif; }
header.container-header .mod-menu > li { display: inline-block; position: relative; margin: 0; padding: 0; line-height: 50px; list-style: none; vertical-align: top; z-index: 10; }
header.container-header .mod-menu > li + li { margin: 0; }
header.container-header .mod-menu > li::after { content: none; }
header.container-header .mod-menu a { display: block; margin: 0; padding: 0 15px; background: transparent; border: 0; font-family: "metropolisregular", sans-serif; font-size: 16px; font-weight: 100; line-height: 50px; color: #333; text-decoration: none; white-space: normal; }
header.container-header .mod-menu > li:hover > a, header.container-header .mod-menu > li > a:focus-visible { color: var(--violet); background: transparent; }
header.container-header .mod-menu > li.active > a, header.container-header .mod-menu > li.current > a { color: var(--violet); }
header.container-header .mod-menu > li.active:hover > a { color: #eee; }
@media (min-width: 788px) and (max-width: 1280px) { header.container-header .mod-menu a { font-size: 14px; } }

/* fixed state: at the first scroll pixel, same height, shadow, spacer holds the place */
html.ex-fixed header.container-header { position: fixed !important; top: 0; left: 0; right: 0; width: 100%; box-shadow: rgba(0, 0, 0, 0.06) 0 0 4px 2px; }
.ex-sticky-fill { display: none; width: 100%; }
html.ex-fixed .ex-sticky-fill { display: block; }

/* hamburger and drawer are phone/tablet only */
.ex-toggle, .ex-drawer { display: none; }

/* ---- phone / tablet toolbar: up to 787 px (deviation 1: the source shows no header at exactly 787 px) ---- */
@media (max-width: 787px) {
  header.container-header { position: fixed !important; top: 0; left: 0; width: 100%; padding: 0; background: var(--orange) !important; color: #fff; display: block; box-shadow: none; }
  header.container-header::after { content: ""; display: table; clear: both; }
  header.container-header > .grid-child:first-child { float: left; width: 82.6667%; margin-left: 0; margin-top: 0; }
  header.container-header > .container-nav { display: none; }
  header.container-header .navbar-brand { margin: 0; padding: 0 0 15px; }
  header.container-header .navbar-brand img { display: block; width: 100%; height: auto; }
  .ex-sticky-fill { display: block; height: 1px; }
  .ex-toggle { display: block; float: right; box-sizing: border-box; min-width: 35px; height: 44px; margin: 0 10px 10px 0; padding: 10px; border: 1px solid #fff; border-radius: 0; background: transparent; color: #fff; font-size: 14.4px; line-height: 22.4px; cursor: pointer; transition: 0.4s; }
  .ex-toggle:hover, .ex-toggle:focus-visible { color: var(--violet); border-color: var(--violet); }
  .ex-toggle:focus:not(:focus-visible) { outline: none; }
  .ex-toggle .fa-solid { margin: 0; }
}
/* the toolbar container is 80% wide from 621 to 787 px, 95% up to 620 px, centred; the logo takes 82.67% of it */
@media (min-width: 621px) and (max-width: 787px) { header.container-header { padding: 0 10%; } }
@media (max-width: 620px) { header.container-header { padding: 0 2.5%; } }

/* ---- push drawer (Slidebars, from the right) ---- */
@media (max-width: 787px) {
  body > *:not(.ex-drawer):not(script):not(style):not(link) { transition: transform 400ms; }
  html.ex-drawer-open body > *:not(.ex-drawer):not(script):not(style):not(link) { transform: translateX(calc(-1 * var(--ex-drawer-w, 55%))); }
  .ex-drawer { display: block; position: fixed; top: 0; right: 0; height: 100%; width: var(--ex-drawer-w, 55%); overflow-y: auto; z-index: 1; background: var(--orange-dark); visibility: hidden; transition: visibility 0s linear 400ms; }
  html.ex-drawer-open .ex-drawer { visibility: visible; transition-delay: 0s; }
  .ex-drawer__close { position: absolute; top: 10px; right: 10px; z-index: 1; padding: 0; border: 0; background: transparent; color: #fff; font-size: 16px; line-height: 22.4px; cursor: pointer; }
  .ex-drawer__close:hover, .ex-drawer__close:focus-visible { color: #666; }
  .ex-drawer__close .fa-solid { margin: 0; }
  .ex-drawer__body { padding: 60px 30px; color: #fff; clear: both; }
  .ex-drawer__menu { list-style: none; margin: 0 0 30px; padding: 0; border-bottom: 1px solid rgba(0, 0, 0, 0.1); width: 100%; }
  .ex-drawer__menu li { display: block; margin: 0; padding: 4px 0; list-style: none; border-top: 1px solid rgba(0, 0, 0, 0.1); }
  .ex-drawer__menu li:first-child { border-top: 0; }
  .ex-drawer__menu a { display: block; padding: 10px 0; color: #eee; font-family: "metropolisregular", sans-serif; font-size: 16px; line-height: 22.4px; text-decoration: none; }
  .ex-drawer__menu li.active a { color: var(--violet); }
  .ex-drawer__menu a:hover, .ex-drawer__menu a:focus-visible { color: var(--violet); }
}
@media (max-width: 480px) { :root { --ex-drawer-w: 55%; } }
@media (min-width: 481px) { :root { --ex-drawer-w: 65%; } }
@media (min-width: 992px) { :root { --ex-drawer-w: 45%; } }

/* ---- back to top (>= 768 px, hidden on phones as the source's hidden-phone): orange button bottom right, shown after 200 px ---- */
.ex-totop { display: none; position: fixed; right: 0; bottom: 0; z-index: 10; box-sizing: border-box; width: 52px; height: 44.4px; padding: 0; margin: 0 10px 10px 0; border: 1px solid var(--orange-dark); background: var(--orange); color: #fff; cursor: pointer; font-size: 16px; line-height: 42px; text-align: center; opacity: 0; transition: opacity 0.3s, background 0.2s ease-in; }
.ex-totop .fa-solid { margin: 0; }
.ex-totop:hover, .ex-totop:focus-visible { background: var(--violet); border-color: #6170e1; color: #fff; }
@media (min-width: 768px) { .ex-totop { display: block; visibility: hidden; } .ex-totop.ex-show { opacity: 1; visibility: visible; } }

/* ===== 30-layout.css ===== */
/* ---------------------------------------------------------------------------------------------------------------
   Page rows (Buildr: #bannerwrap, #grid2wrap, #mainwrap, #belowwrap, #grid5wrap, #grid6wrap) on Cassiopeia's positions:
   banner, top-a, component (main), bottom-a (Karene module, then the CTA band), bottom-b (home Actualites + references),
   footer. The source's .zen-container is 90% wide (max 1300) above 787 px, 80% up to 787, 95% up to 620.
   --------------------------------------------------------------------------------------------------------------- */
/* banner row: 3 px violet rule under it, images fill the width */
.container-banner { position: relative; z-index: 2; width: 100%; background: var(--violet); border: 0; margin: 0; padding: 0 0 3px; }
.container-banner > * { margin: 0; padding: 0; position: static; }
.container-banner img { display: block; width: 100%; height: auto; max-width: 100%; }
.ex-banner, .ex-slideshow { display: block; width: 100%; }
.ex-banner img { display: block; width: 100%; height: auto; }

/* home slideshow (zentools2 owl, no controls): two slides slide horizontally */
.ex-slideshow { position: relative; overflow: hidden; }
.ex-slideshow__track { display: flex; flex-wrap: nowrap; width: 100%; will-change: transform; }
.ex-slide { flex: 0 0 100%; width: 100%; min-width: 0; }
.ex-slide img { display: block; width: 100%; height: auto; }

/* round overlay (module 121) */
.round { position: absolute; z-index: 10; background: rgba(153, 153, 153, 0.69); border-radius: 50%; height: 400px; width: 400px; bottom: 5%; right: 5%; vertical-align: middle; }
.inside { margin-top: 50%; transform: translateY(-50%); text-align: center; line-height: initial; font-size: 0.7em; }
.round h1, .inside h1 { color: #fff; }
.round p { color: #fff; }
.round .btn { font-weight: bold; font-size: 1.5em; margin: 0 10px 10px 0; padding: 10px; }
.round .btn a { color: #fff; }
.round .btn a:hover { color: #fff !important; }

/* home block (top-a): padded row, container 90% (max 1300), fade-in once on load */
.container-top-a { clear: both; padding: 30px max(8.6%, calc((100% - 1300px) / 2)); background: #fff; animation: ex-fade-in 1s both; }
.container-top-a > * { margin-bottom: 15px; }
@keyframes ex-fade-in { 0% { opacity: 0; } 100% { opacity: 1; } }

.bg-orange { background: var(--orange); margin: 20px auto; float: right; }
.bg-orange h4 { color: #fff; text-align: center; margin: auto; font-size: 25px; font-weight: 100; padding: 10px; }
.btn.grey { background: var(--gris); border-color: var(--gris); text-transform: uppercase; font-size: large; padding: 10px 30px; float: right; color: #fff; }
.btn.grey:hover { background: var(--violet); border-color: #6170e1; }
.karene p { position: absolute; z-index: 1; margin-left: -4vw; }
.karene img { height: 360px; width: auto; }
.karene { margin-bottom: 75px; }
.bg-motif { background-image: url("/images/bg/fond-kz-blanc.jpg"); padding: 4vh 7vw; z-index: 0; position: relative; float: right; height: 280px; }
.bg-motif .btn.grey { position: absolute; bottom: -2vh; right: 2vw; }
.bg-motif p { position: relative; text-align: justify; margin-left: 15%; }
.bg-motif h3 { margin-left: 15%; }
.moduletable h3 { text-transform: initial; }
.bloc { text-align: justify; padding: 5%; background: 0% 0% / cover #ddd; margin: auto 2%; width: 46%; font-size: 16px; line-height: 22px; height: 350px; border-bottom: 5px solid; }
.bloc h3 { text-align: center; margin: 30px auto; }
.bloc.audit { border-color: var(--orange); background-image: url("/images/bg/excelia-audit.jpg"); }
.bloc.conseils { border-color: var(--violet); background-image: url("/images/bg/excelia-conseil.jpg"); }
@media (max-width: 1280px) { .bg-motif h3, .bg-motif p { margin-left: 20%; } }
.bg-motif.kar { height: fit-content; }

/* component row (#mainwrap): transparent, paper backgrounds per page class */
main { position: relative; color: #4c4c4c; }
main article, main .com-content-article { position: relative; z-index: 1; }
.kzag .container-component { background: url("/images/bg/nous-connaitre-fond-blanc.jpg") right top / auto; }
.contact .container-component, .missions .container-component { background: url("/images/bg/fond-excelia-missions.jpg") right bottom / cover no-repeat; }
.kzag .karene { margin-top: 100px; }
.kzag .justify { width: 60%; margin: auto; }
h1.center { text-align: center; border-bottom: 1px solid; width: 40%; margin: 20px auto 50px; }

/* CTA band (#grid5wrap): full-bleed picture behind the module, 30 px above and below */
.cta-contact { position: relative; z-index: 0; margin: 30px auto; }
.cta-contact::before { content: ""; display: block; line-height: 1; position: absolute; z-index: -1; top: -30px; bottom: -30px; left: 50%; width: 100vw; margin-left: -50vw; background: url("/images/temp/bandeau-contact.jpg") left center / contain no-repeat; }
.cta-contact h4 { color: #fff; }
.cta-contact .bg-orange { float: left; padding: 0; }
.cta-contact a.btn.grey { margin: 27.5px auto; text-align: center; float: right; background: var(--gris); color: #fff; border-color: var(--gris); }
@media (max-width: 1125px) { .cta-contact::before { background-size: cover; } }

/* mission cards */
.bgBlocOrange { background-color: var(--orange); color: #fff; padding: 30px; text-align: left; }
.bgBlocViolet { background-color: var(--violet); color: #fff; padding: 30px; text-align: left; margin-bottom: 10px; }
.bgBlocViolet ul { margin-bottom: 0; }
.bgBlocViolet h3 { color: #fff; }
.cardExc { margin: 5%; background: #fff; padding: 10%; text-align: justify; border-bottom: 5px solid; }
.col-md-12 .cardExc { padding: 5%; }
.cardExc h2 { margin-top: 0; text-transform: uppercase; font-size: 1.5em; }
.cardExc h3 { font-size: 20px; }
.missions h1, .missions h2 { text-align: center; margin: 20px auto; }
.missions .cardExc h2 { margin-top: 0; }
.audit h2 { color: var(--violet); }
.audit .cardExc { border-color: var(--violet); height: fit-content; min-height: 530px; }
.conseil h2 { color: var(--orange); }
.conseil .cardExc { border-color: var(--orange); }

/* Actualites (home) and references (bottom-b: #grid6wrap, padded 30 px 0, container 90%) */
.container-bottom-b { clear: both; padding: 30px max(5%, calc((100% - 1300px) / 2)); }
.container-bottom-b > * { margin-bottom: 15px; }
.container-bottom-b h3 { text-align: center; padding-bottom: 15px; border-bottom: 1px solid #eee; margin: 0 0 10px; font-size: 1.7em; line-height: normal; text-transform: initial; }
.container-bottom-b h3 > span { font-weight: inherit; }
/* module chrome ex-title (templates/cassiopeia_extended/html/layouts/chromes/ex-title.php): .moduletable > .module-inner > .zen-module-title > h3 > span + .zen-module-body */
.container-bottom-b .zen-module-title { margin-bottom: 10px; }
.container-bottom-b .zen-module-title h3 { margin: 0; line-height: normal; padding-bottom: 15px; }
.container-bottom-b .card, .container-bottom-b .card-body { border: 0; background: transparent; padding: 0; margin: 0; }
.container-bottom-b .card-header { background: transparent; border: 0; padding: 0; }
.container-bottom-b > * + * { margin-top: 30px; }

/* references carousel (zentools2 owl): 3 logos (2 up to 620 px), round violet prev/next buttons */
.ex-carousel { position: relative; width: 100%; }
.ex-carousel__viewport { overflow: hidden; position: relative; width: 100%; }
.ex-carousel__track { display: flex; flex-wrap: nowrap; will-change: transform; }
.ex-carousel__item { flex: 0 0 auto; padding: 0 30px 40px 0; }
.ex-carousel__item a, .ex-carousel__item img { display: block; max-width: 100%; height: auto; }
.ex-carousel__nav { margin-top: 10px; text-align: center; }
.ex-carousel__nav button { display: inline-block; margin: 5px; padding: 3px 10px; border: 0; border-radius: 30px; background: var(--violet); color: #fff; font-size: 12px; line-height: 20px; opacity: 0.5; cursor: pointer; }
.ex-carousel__nav button:hover, .ex-carousel__nav button:focus-visible { opacity: 1; }
.ex-carousel__prev::before { content: "\2039"; font-size: 18px; font-weight: bold; line-height: 18px; }
.ex-carousel__next::before { content: "\203A"; font-size: 18px; font-weight: bold; line-height: 18px; }

/* Actualites headlines on home: flex row, 300 px columns, justified titles */
.flex { display: flex; }
.flex.evenly { justify-content: space-evenly; }
.filactus div { max-width: 300px; }
.container-bottom-b .filactus h3 { font-size: large; text-align: justify !important; line-height: 1.4em; }
p.readNext a { color: var(--violet); }
p.readNext a:hover { color: var(--orange) !important; }

/* tablet and phone: the home blocks stack (source media: max-width 1125 px, height <= 2001 px) */
@media only screen and (max-width: 1125px) and (max-height: 2001px) {
  h1, .h1 { font-size: xx-large; } h2, .h2 { font-size: x-large; }
  .filactus { flex-flow: column; margin: auto; }
  .bg-motif h3 { text-align: center; margin: auto !important; }
  .bg-motif p { margin: auto !important; padding: 10px; }
  .round { height: 200px; border-radius: 0; background: rgba(0, 0, 0, 0.35); display: block; bottom: 80px; }
  .inside { margin: 185px auto; padding-bottom: 30px; width: 100%; }
  .bloc { width: auto; clear: both; height: unset; }
  .karene { width: auto; height: auto; }
  .bg-orange { float: none; height: auto; width: auto; clear: both; position: relative; }
  .bg-motif { width: auto; height: initial; padding: 20px; float: none; position: relative; }
  .karene img { width: auto; height: auto; clear: both; position: relative; }
  .karene p { position: relative; }
  .bg-motif .btn.grey { position: relative; width: 100%; margin: 30px auto; clear: both; bottom: auto; display: block; right: auto; }
}
@media screen and (max-width: 787px) { .container-top-a { padding-left: 13.2%; padding-right: 13.2%; } .container-bottom-b { padding-left: 10%; padding-right: 10%; } }
@media screen and (max-width: 620px) { .container-top-a { padding-left: 6.3%; padding-right: 6.3%; } .container-bottom-b { padding-left: 2.5%; padding-right: 2.5%; } }
/* below 787 px the CTA column keeps the grid's 15 px bottom margin (the source drops it from 787 up) */
@media (max-width: 786.98px) { .cta-contact { margin-bottom: 45px; } .cta-contact::before { bottom: -45px; } }
/* Karene module (the source's #belowwrap row): its container sits in the 90% / 80% / 95% zen-container and keeps the grid's 15 px bottom margin */
.container-bottom-a .container:not(.cta-contact) { max-width: 90%; margin-bottom: 15px; }
@media screen and (max-width: 787px) { .container-bottom-a .container:not(.cta-contact) { max-width: 80%; } }
@media screen and (max-width: 620px) { .container-bottom-a .container:not(.cta-contact) { max-width: 95%; } }
/* bottom-a modules are separate rows on the source: their margins add up instead of collapsing */
.container-bottom-a > * { display: flow-root; margin-bottom: 0; }

/* ===== 40-footer.css ===== */
/* Footer (#footerwrap): dark grey, circles picture bottom right, 30 px above and below, 30 px margin above, 90% text size */
footer.container-footer { display: block; clear: both; width: 100%; max-width: none; margin: 30px 0 0; padding: 30px 0; border: 0; background: var(--gris) url("/images/temp/cercles-footer.png") right bottom no-repeat !important; color: #fff; font-size: 90%; position: relative; }
footer.container-footer > .grid-child { display: block; max-width: none; width: 100%; margin: 0; padding: 0; }
footer.container-footer p, footer.container-footer h1 { color: #fff; }
footer.container-footer a { color: #fff; }
footer.container-footer a:hover, footer.container-footer a:focus { color: var(--orange); }
footer.container-footer a.btn:hover { color: #fff; }
footer.container-footer .moduletable, footer.container-footer > .grid-child > div { margin: 0; padding: 0; }
footer.container-footer ul { margin-bottom: 30px; }
footer.container-footer li { list-style-type: none; line-height: 30px; }
footer.container-footer i { color: var(--orange); margin: 0 5px; line-height: 1; vertical-align: -0.125em; }
footer.container-footer i.fa-2x { display: inline-block; width: 30px; margin-bottom: 1.7px; text-align: center; }
.valign img { margin-top: 10%; transform: translateY(-10%); text-align: center; }
footer.container-footer .container { margin: 0 auto; }
/* copyright */
footer.container-footer > .grid-child > * + * p { text-align: center; }
/* the "Etre rappele" module sits between the footer block and the copyright on the source and adds its 30 px module gap */
@media (min-width: 621px) { body:has(.wa_agent) footer.container-footer > .grid-child > :last-child { margin-top: 30px; } }

/* ===== 50-widget.css ===== */
/* "Etre rappele" widget (missions pages): fixed panel bottom right plus a round phone button.
   Rebuilt without animate.css or jQuery: slideInUp / slideOutDown keyframes are local, user.js toggles the classes. */
/* the source shows the widget at every width: its module class hidden-phones only clips the empty wrapper, not the fixed panel */
div.clicktocallmod { bottom: 5%; right: 0; position: fixed; z-index: 99999; width: auto !important; }
div.clicktocallmod > button.clicktocallmodbuttonflat { border-radius: 50%; border: 1px solid var(--orange-dark); height: 60px !important; width: 60px !important; padding: 0 !important; line-height: 60px !important; background: var(--orange); color: #fff; cursor: pointer; margin: 0 10px 10px 0; }
div.clicktocallmod > button.clicktocallmodbuttonflat:hover { box-shadow: rgba(45, 62, 79, 0.3) 0 8px 25px -5px; transition: 0.3s; background: var(--violet); }
.wa_agent { position: fixed; box-shadow: rgba(0, 0, 0, 0.3) 0 0 30px; border-radius: 10px; font-size: 14px; width: 15%; display: block !important; height: auto !important; z-index: 9999999 !important; bottom: 90px !important; background: #fff !important; box-sizing: content-box !important; animation-duration: 1s; animation-fill-mode: both; }
.wa_agent.boxright { right: 15px; }
.wa_agent.slideInUp { animation-name: ex-slide-in-up; }
.wa_agent.slideOutDown { animation-name: ex-slide-out-down; }
.wa_agent:not(.show) { visibility: hidden; }
.wa_agent h1, .wa_agent h2 { font-size: large; font-weight: 700; margin: 0 0 5px !important; }
.wa_agent p, .wa_agent span { font-size: 14px; line-height: 130%; }
.wa_agent_header { border-radius: 10px; padding: 20px; display: block; text-align: left; background-position: center top; background-color: var(--orange); }
.wa_agent_header h1, .wa_agent_header h2 { color: #fff; }
.wa_agent_header p { color: #fff; }
.greeting { text-align: center; }
.greeting h1 { text-transform: uppercase; }
.greeting p { line-height: 25px; }
.greeting i, button#was_trigagents i { color: #fff !important; }
.close_chat { display: block; height: 40px; width: 40px !important; position: absolute; padding: 10px 0 5px; box-sizing: border-box; top: 10px; right: 10px; cursor: pointer; text-align: center; border-radius: 8px; }
.close_chat:hover { background-color: rgba(0, 0, 0, 0.15); }
span.close_chat * { color: #fff; }
a.btn.clickmecall i { color: #fff !important; }
.clickmecall { font-weight: bold; padding: 10px; font-size: 18px; display: block; letter-spacing: 2px; background: var(--violet); margin: 20px 5%; border-color: var(--violet); border-radius: 0; width: auto !important; color: #fff !important; }
.clickmecall:hover { text-decoration: none !important; }
@media (max-width: 1280px) { .wa_agent.boxright.slideInUp.show { width: unset; } }
@media (max-width: 360px) { .wa_agent { bottom: 0; left: 0; right: 0; width: 100% !important; max-width: 100% !important; } }
@keyframes ex-slide-in-up { 0% { transform: translate3d(0, 100%, 0); visibility: visible; } 100% { transform: translate3d(0, 0, 0); } }
@keyframes ex-slide-out-down { 0% { transform: translate3d(0, 0, 0); } 100% { visibility: hidden; transform: translate3d(0, 100%, 0); } }
@media (prefers-reduced-motion: reduce) { .wa_agent { animation-duration: 0.01s; } }

/* ===== 60-expertplus.css ===== */
/* Expert+ blocks as the source theme styles them (custom.css): headline cards, news list, domain tiles, search, figures */
.cardZcont { padding: 0 2%; text-align: justify; }
.cardZoom .image img { width: 225px; height: 140px; object-fit: cover; }
.cardZoom .image { min-width: 225px; }
.cardZoom { background-image: url("/images/bg/fond-kz-blanc.jpg"); padding: 30px; margin-bottom: 30px; }
.cardZcont h4 { margin: 0; }
.cardZcont h4 a { text-transform: uppercase; font-size: 17px; color: var(--orange); }
.fRight { float: right; margin: 0; }
a.btn.savPlus { border: none; padding: 5px 30px; text-transform: uppercase; }
ul.module-eplus li { background-image: url("/images/bg/fond-kz-blanc.jpg"); padding: 30px; margin-bottom: 30px; }
ul.module-eplus.chiffres li { background: none; margin: 0; padding: 5px 0; border-bottom: 1px solid var(--orange); }
.module-eplus { padding-left: 0; }
.module-eplus li { list-style: none; padding: 2px 8px; color: #000; letter-spacing: 0.2px; margin-bottom: 7px; }
.module-eplus > li { padding-top: 10px; padding-bottom: 10px; }
.juridique { background-image: url("/images/domaines/juridique.jpg"); }
.social { background-image: url("/images/domaines/social.jpg"); }
.patrimoine { background-image: url("/images/domaines/patrimoine.jpg"); }
.fiscal { background-image: url("/images/domaines/fiscal.jpg"); }
.domaine .btn { display: block; width: 211px; height: 200px; margin: 30px auto; padding: 0; }
.domaine .btn span { position: absolute; bottom: 15%; text-align: center; margin: auto; width: 210px; color: var(--violet); font-weight: bold; }
a.btn.juridique:hover { background-image: url("/images/domaines/juridique.jpg"); }
a.btn.social:hover { background-image: url("/images/domaines/social.jpg"); }
a.btn.fiscal:hover { background-image: url("/images/domaines/fiscal.jpg"); }
a.btn.patrimoine:hover { background-image: url("/images/domaines/patrimoine.jpg"); }
.domaine a.btn:hover span { color: var(--violet) !important; }
.col-sm-4 h3 { text-align: center; margin-left: 16px; }
.lookfor > fieldset { border: none; margin: 0; max-width: 100%; padding: 0; }
.lookfor input { display: inline-block; width: 89%; padding: 0 2px; font-family: "raleway light"; margin-bottom: 0; line-height: 50px; height: 36px; border: 1px solid #4c4c4c; border-radius: 0; background: #fff; color: #4c4c4c; }
.lookfor button { height: 36px; width: 36px; padding: 0; background: var(--orange); border: none; color: #fff; font-size: 18px; }
form.lookfor { width: 50%; margin: auto; }
#eplus-container { position: relative; }
#eplus-container li { list-style-type: none; }
.liste-dossiers .uk-width-large-1-1 { width: 46%; float: left; margin: 2%; border-bottom: 4px solid var(--orange); min-height: 505px; }
@media only screen and (max-width: 1125px) and (max-height: 2001px) { .wrap-resume.flex { flex-flow: column; } .cardZoom .image img { width: 100%; } }
/* Bootstrap 5 hides .collapse that is not .show; Expert+ uses label.collapse as its accordion toggle */
label.collapse:not(.show) { display: block; }
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak, .ng-hide { display: none !important; }

/* ===== 70-form.css ===== */
/* RSForm forms 4 (contact, "Contactez-nous !") and 5 ("Etre rappele"): the source's look (dark 1 px fields, violet button on the contact
   form, centred 70% column) in the modern RSForm style: 48 px fields, visible focus ring, clear error states. Fields, placeholders and
   wording are unchanged. Scoped to form#userForm so RSForm's own stylesheet, which loads after this file, does not win. */
form#userForm.formResponsive { margin: 30px auto; padding: 0; color: #4c4c4c; font-family: "metropolisregular", sans-serif; }
form#userForm.contactForm { width: 70%; }
form#userForm.formResponsive h2 { text-align: center; margin: 0 0 30px; }
form#userForm.formResponsive .formControlLabel, form#userForm.formResponsive label.formControlLabel { display: none !important; }
form#userForm.formResponsive .formControls, form#userForm.formResponsive .formHorizontal .formControls { margin-left: 0; }
form#userForm.formResponsive .rsform-block { margin-bottom: 10px; }
form#userForm.formResponsive .formRow { width: 100%; }
form#userForm.formResponsive .formRow [class*="formSpan"] { box-sizing: border-box; }
form#userForm.formResponsive input[type="text"],
form#userForm.formResponsive input[type="email"],
form#userForm.formResponsive input[type="number"],
form#userForm.formResponsive input[type="tel"],
form#userForm.formResponsive textarea {
  display: block; width: 100% !important; max-width: 100%; box-sizing: border-box; height: auto; min-height: 48px; margin: 0; padding: 12px 14px;
  background: #fff; border: 1px solid #4c4c4c; border-radius: 0; box-shadow: none; color: #4c4c4c;
  font-family: "metropolisregular", sans-serif; font-size: 14px; line-height: 22px; transition: border-color 0.2s, box-shadow 0.2s;
}
form#userForm.formResponsive textarea { min-height: 96px; resize: vertical; }
form#userForm.contactForm input[type="text"], form#userForm.contactForm textarea { border-color: #000; }
form#userForm.formResponsive input::placeholder, form#userForm.formResponsive textarea::placeholder { color: #757575; opacity: 1; }
form#userForm.formResponsive input[type="text"]:focus-visible, form#userForm.formResponsive textarea:focus-visible,
form#userForm.formResponsive input[type="tel"]:focus-visible, form#userForm.formResponsive input[type="email"]:focus-visible {
  outline: 3px solid var(--violet); outline-offset: 1px; border-color: var(--violet);
}
form#userForm.formResponsive .formError, form#userForm.formResponsive .formNoError { display: none; }
form#userForm.formResponsive .formError { display: block; margin: 6px 0 3px; color: #b3261e; font-size: 13px; font-weight: bold; }
form#userForm.formResponsive .rsform-error, form#userForm.formResponsive input[aria-invalid="true"], form#userForm.formResponsive textarea[aria-invalid="true"] { border-color: #b3261e; }
form#userForm.formResponsive p.formDescription { margin: 0; }
form#userForm.formResponsive .formRed { color: #b3261e; font-weight: bold; }

/* consent checkbox */
form#userForm.formResponsive fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
form#userForm.formResponsive .rsform-type-checkboxgroup label { display: flex; align-items: flex-start; gap: 10px; margin: 0; padding: 0; font-size: 14px; line-height: 22px; color: #4c4c4c; cursor: pointer; }
form#userForm.contactForm .rsform-type-checkboxgroup input[type="checkbox"] { order: 2; }
form#userForm.formResponsive input[type="checkbox"] { width: 18px; height: 18px; min-height: 0; margin: 2px 0 0; flex: 0 0 auto; accent-color: var(--violet); }
form#userForm.formResponsive input[type="checkbox"]:focus-visible { outline: 3px solid var(--violet); outline-offset: 2px; }

/* submit: violet block on the contact form (source "ENVOYER"), site orange on the call-back form */
form#userForm.formResponsive button[type="submit"], form#userForm.formResponsive input[type="submit"] {
  display: inline-block; min-height: 48px; padding: 12px 30px; border: 1px solid #6170e1; border-radius: 0; background: var(--violet); color: #fff;
  font-family: "metropolisregular", sans-serif; font-size: 20px; font-weight: bold; letter-spacing: 1px; text-transform: uppercase; text-shadow: none; box-shadow: none; cursor: pointer; transition: background 0.2s;
}
form#userForm.formResponsive button[type="submit"]:hover, form#userForm.formResponsive input[type="submit"]:hover { background: var(--orange); border-color: var(--orange-dark); color: #fff; }
form#userForm.formResponsive button[type="submit"]:focus-visible { outline: 3px solid var(--violet); outline-offset: 2px; }
form#userForm.contactForm button[type="submit"] { width: 100%; }
@media (max-width: 650px) { form#userForm.contactForm { width: 100%; } form#userForm.contactForm button[type="submit"] { margin-top: 10px; } }
form#userForm:not(.contactForm) { width: auto; }
form#userForm:not(.contactForm) h2 { text-align: left; }
form#userForm:not(.contactForm) .formControls { margin-left: 22%; }
@media (max-width: 650px) { form#userForm:not(.contactForm) .formControls { margin-left: 0; } }
form#userForm:not(.contactForm) .rsform-block-nom input, form#userForm:not(.contactForm) .rsform-block-tel input { max-width: 300px; }
form#userForm:not(.contactForm) button[type="submit"] { font-size: 16px; letter-spacing: 0; text-transform: none; background: var(--orange); border-color: var(--orange-dark); }
form#userForm:not(.contactForm) button[type="submit"]:hover { background: var(--violet); border-color: #6170e1; }

/* ===== 80-pages.css ===== */
/* Component row (#mainwrap) padding and the pages that render Joomla components: login, legal text, call-back form heading.
   The source's zen-container is 90% wide (max 1300) above 787 px, 80% up to 787, 95% up to 620; articles that use .container
   (missions, nous connaitre, actualites) fill it (main .container { padding: 0; width: 100% }). */
.site-grid > .container-component { padding: 16px max(5%, calc((100% - 1300px) / 2)) 15px; }
@media screen and (max-width: 787px) { .site-grid > .container-component { padding-left: 10%; padding-right: 10%; } }
@media screen and (max-width: 620px) { .site-grid > .container-component { padding-left: 2.5%; padding-right: 2.5%; } }
.com-content-article__body, .com-content-article { margin: 0; }
/* the article keeps its first heading margin inside (source: the heading sits 20 px below main) */
.com-content-article__body { display: flow-root; }

/* login (/espace-client): full-width labelled fields, orange "Connexion", "Se rappeler de moi" on the right, plain links */
.com-users-login form { margin: 0 0 30px; padding: 0; border: 0; background: transparent; }
.com-users-login fieldset { border: 0; margin: 0; padding: 0; }
.com-users-login .control-group { margin: 0 0 20px; }
.com-users-login .control-label { width: auto; float: none; text-align: left; padding: 0; margin: 0; }
.com-users-login label { display: block; margin: 0 10px 5px 0; padding: 4px 8px; font-size: 90%; font-weight: 400; color: #4c4c4c; }
.com-users-login .controls { margin: 0; }
.com-users-login input.form-control { display: block; width: 100%; height: 30px; min-height: 30px; margin: 0 0 10px; padding: 6px 12px; border: 1px solid #4c4c4c; border-radius: 0; background: #fff; box-shadow: none; color: #4c4c4c; font-size: 1em; line-height: 2em; }
.com-users-login input.form-control:focus-visible { outline: 3px solid var(--violet); outline-offset: 1px; }
.com-users-login .input-group { display: block; }
.com-users-login .input-password-toggle, .com-users-login .plg_system_webauthn_login_button { display: none; }
.com-users-login__remember { float: right; margin: 7px 0 0; }
.com-users-login__remember .form-check { padding: 0; min-height: 0; }
.com-users-login__remember .form-check .form-check-input { appearance: auto; width: 13px; height: 13px; margin: 0 4px 0 0; border: 0; opacity: 1; vertical-align: middle; }
.com-users-login__remember label { display: inline-block; }
.com-users-login__remember label { margin: 0 10px 10px 0; }
.com-users-login__submit { clear: none; float: left; margin: 0; }
.com-users-login__submit .btn-primary { font-weight: 300; text-align: center; color: #fff; background: var(--orange); border: 1px solid var(--orange-dark); padding: 10px; border-radius: 0; font-size: 16px; line-height: 22.4px; }
.com-users-login__submit .btn-primary:hover { background: var(--violet); border-color: #6170e1; }
.com-users-login__options { clear: both; display: block; margin: 30px 0; padding: 0; list-style: none; border: 0; line-height: 22.4px; }
.com-users-login__options a.list-group-item { display: inline; padding: 0; border: 0; background: transparent; color: #4c4c4c; font-size: 14.4px; position: static; }
.com-users-login__options a.list-group-item:hover { color: var(--violet); }
.com-users-login__options a.list-group-item + a.list-group-item::before { content: "/"; color: #555; margin: 0 10px; }
.com-users-login__options a.list-group-item { margin-right: 0; }
