/* Language switcher — base */
#lang-switcher{ display:flex; gap:4px; font-family:Arial,Helvetica,sans-serif; }
#lang-switcher button{
  border:0; cursor:pointer; border-radius:999px; background:transparent;
  font-weight:700; line-height:1; transition:.2s;
}
#lang-switcher button.active{ background:#1c9ad6; color:#fff; }

/* Inline in the top-bar, on the RIGHT of the social icons (after LinkedIn), same line */
#lang-switcher.inline{
  display:inline-flex; vertical-align:middle; align-items:center; gap:3px; margin-left:14px;
}
#lang-switcher.inline button{ min-width:30px; height:24px; padding:0 8px; color:#cbd5e1; font-size:13px; }
#lang-switcher.inline button:hover{ background:rgba(255,255,255,.15); color:#fff; }
/* the social <ul> may use display:table on some layouts; keep our item inline there too */
.top-bar-area .social ul{ white-space:nowrap; }

/* Fixed fallback (top-right) for pages with no top-bar social block */
#lang-switcher.floating{
  position:fixed; z-index:99999; top:16px; right:16px; padding:5px;
  background:rgba(17,24,39,.92); border-radius:999px;
  box-shadow:0 6px 22px rgba(0,0,0,.25); backdrop-filter:blur(6px);
}
#lang-switcher.floating button{ min-width:38px; height:32px; padding:0 10px; color:#e5e7eb; font-size:14px; }
#lang-switcher.floating button:hover{ background:rgba(255,255,255,.12); color:#fff; }
/* --- Homepage: remove the "SE SENTIR VALORISÉ", "Être à la pointe", "Partenaires" blocks --- */
html.ifcar-home .about-style-one-area,
html.ifcar-home .choose-us-style-one-area,
html.ifcar-home .partner-style-one-area{ display:none !important; }

/* --- Footer navigation (mirrors the header menu) --- */
.footer-item .ifcar-fnav{ list-style:none; margin:0; padding:0; }
.footer-item .ifcar-fnav li{ margin-bottom:12px; }
.footer-item .ifcar-fnav a{ display:inline-flex; align-items:flex-start; gap:9px;
  color:#aeb9c6; font-size:15px; line-height:1.4; transition:color .25s ease, transform .25s ease; }
.footer-item .ifcar-fnav a::before{ content:"›"; color:#8cc63f; font-weight:700; font-size:18px; line-height:1.1; transition:color .25s ease; }
.footer-item .ifcar-fnav a:hover{ color:#fff; transform:translateX(4px); }
.footer-item .ifcar-fnav a:hover::before{ color:#1c9ad6; }
/* the social icons kept in the first footer column */
.footer-item .footer-social{ margin-top:24px; }

/* --- Footer: make it more compact on desktop (was pt-70 / pb-120 = too tall) --- */
@media (min-width:992px){
  footer .f-items{ padding-top:26px !important; padding-bottom:26px !important; }
  footer .footer-item .footer-social{ margin-top:10px !important; }
  footer .footer-item .ifcar-fnav li{ margin-bottom:6px !important; }
  footer .f-item.about p{ margin-bottom:9px !important; font-size:13px !important; line-height:1.55 !important; }
  footer .opening-hours{ margin-top:6px !important; }
  footer .opening-hours h5{ margin-bottom:7px !important; }
  footer .opening-hours li{ padding:4px 0 !important; }
  footer .f-item.about .logo{ max-width:150px !important; margin-bottom:10px !important; }
  footer .footer-item h4.widget-title{ margin-bottom:12px !important; }
  footer .footer-bottom{ padding:9px 0 !important; }
}

/* --- Homepage: remove Popular Projects + Testimonials --- */
html.ifcar-home .project-style-one-area,
html.ifcar-home .testimonial-style-one-area{ display:none !important; }

/* --- "Rencontrez nos experts": auto-rotating experts grid (5 at a time) --- */
.ifcar-experts-area{ padding:10px 0 100px; }
.ifcar-experts{ display:flex; flex-wrap:wrap; justify-content:center; gap:30px 26px; margin-top:20px; }
@keyframes ifcarSpin{ to{ transform:rotate(360deg); } }

/* --- HOME "Nos références": 3D rotating CIRCULAR badges of client logos --- */
.ifcar-cube{ width:230px; max-width:80%; height:230px; margin:0 auto 26px; perspective:1200px; }   /* hold 2s, quick flip */
.ifcar-cube-fc{ position:absolute; width:100%; height:100%; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:transparent; border-radius:50%;         /* clip fill-logos to a circle, no frame */
  border:0; backface-visibility:hidden; box-shadow:none; }
.ifcar-logo{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; }
.ifcar-logo-img{ max-width:90%; max-height:82%; object-fit:contain; }
/* logo whose image has its own solid bg -> fill the whole circle (clipped) */
.ifcar-logo.fill{ width:100%; height:100%; }
.ifcar-logo.fill .ifcar-logo-img{ max-width:100%; max-height:100%; width:100%; height:100%; object-fit:cover; }
/* category titles back to the dark heading colour */
html.ifcar-home .process-style-one h4{ color:#1d2027 !important; margin-top:6px; }
/* redesigned reference cards (icon + title + underline + logo carousel + dots) */
html.ifcar-home .process-style-one-area .site-heading .sub-heading{ color:#1c9ad6 !important; -webkit-text-fill-color:#1c9ad6 !important; background:none !important; }
.ifcar-ref-sub{ max-width:660px; margin:16px auto 0; font-size:16px; line-height:1.65; color:#7a8899; text-align:center; }
html.ifcar-home .process-style-one{ background:#fff; border-radius:22px; padding:36px 26px 30px; box-shadow:0 18px 50px rgba(20,40,80,.07);
  text-align:center; height:100%; transition:transform .4s ease, box-shadow .4s ease; }
html.ifcar-home .process-style-one:hover{ transform:translateY(-8px); box-shadow:0 30px 64px rgba(20,40,80,.13); }
.ifcar-ref-ic{ display:inline-flex; align-items:center; justify-content:center; width:64px; height:64px; border-radius:50%;
  background:linear-gradient(135deg,#29abe2,#1c76c9); color:#fff; font-size:26px; box-shadow:0 12px 26px rgba(28,154,214,.34); margin-bottom:18px; transition:transform .4s ease; }
.process-style-one:hover .ifcar-ref-ic{ transform:rotate(-6deg) scale(1.08); }
html.ifcar-home .process-style-one .ifcar-ref-t{ color:#12234d !important; font-size:19px; font-weight:800; line-height:1.3; margin:0 0 12px !important;
  min-height:70px; padding-bottom:0 !important; border-bottom:0 !important; text-align:center;
  display:flex; align-items:flex-end; justify-content:center; }   /* reserve 2 lines + text bottom-aligned so the green underlines line up across cards */
.ifcar-ref-ul{ display:block; width:44px; height:4px; border-radius:3px; margin:0 auto 8px; background:linear-gradient(90deg,#8cc63f,#c5e08a); }
/* steady circular frame — logos cross-fade inside it, the frame never moves */
.ifcar-ref-carousel{ position:relative; width:236px; max-width:82%; aspect-ratio:1/1; margin:8px auto 0; overflow:hidden;
  display:flex; align-items:center; justify-content:center; border-radius:50%;
  background:radial-gradient(circle at 50% 45%, #ffffff 62%, #eef4fb 100%);
  box-shadow:inset 0 0 0 1px #eaf0f7, 0 20px 46px rgba(20,40,80,.09); }
.ifcar-ref-arw, .ifcar-ref-dots{ display:none !important; }   /* no arrows / no dots */

/* --- ABOUT "Solutions" section: intro line (replaces the eyebrow) + 3 animated cards --- */
/* hide the old big heading; turn the eyebrow into a readable intro sentence */
html.ifcar-page-about-us .process-style-one-area .site-heading h2.title{ display:none !important; }
html.ifcar-page-about-us .process-style-one-area .site-heading .sub-heading{
  text-transform:none !important; letter-spacing:0 !important;
  font-size:clamp(24px,3.2vw,42px) !important; font-weight:800 !important; line-height:1.25 !important;
  max-width:920px; margin:0 auto !important; display:inline-block;
  background:none !important; -webkit-text-fill-color:#1c2b4a !important; color:#1c2b4a !important;
}
html.ifcar-page-about-us .process-style-one-area .site-heading .sub-heading span{ color:#1c9ad6 !important; -webkit-text-fill-color:#1c9ad6 !important; }
html.ifcar-page-about-us .process-style-one-area .site-heading .sub-heading::before,
html.ifcar-page-about-us .process-style-one-area .site-heading .sub-heading::after{ display:none !important; }
@keyframes ifcarSolIn{ to{ opacity:1; transform:translateY(0); } }

/* --- ABOUT "Pourquoi IFCAR Solutions": 4 animated atout cards --- */
.ifcar-atouts-area{ background:#fbfdff !important; }
.ifcar-atouts-head{ text-align:center; margin-bottom:50px; }
.ifcar-atouts-eyebrow{ display:inline-flex; align-items:center; gap:14px; text-transform:uppercase; letter-spacing:2px; font-weight:800; font-size:14px;
  background:linear-gradient(90deg,#1c9ad6,#8cc63f); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:#1c9ad6; margin-bottom:16px; }
.ifcar-atouts-eyebrow i{ display:block; width:46px; height:3px; border-radius:3px; background:linear-gradient(90deg,#1c9ad6,#8cc63f); }
.ifcar-atouts-title{ font-size:clamp(26px,3.2vw,42px); font-weight:800; line-height:1.25; color:#1c2b4a; margin:0 auto; max-width:900px; text-transform:uppercase; letter-spacing:.5px; }
.ifcar-atouts-title span{ color:#1c9ad6; }
/* number badge — gradient tab, top-left corner */
.ifcar-atout-num{ position:absolute; left:0; top:0; min-width:58px; height:44px; padding:0 16px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#1c9ad6,#8cc63f); color:#fff; font-weight:800; font-size:19px; letter-spacing:.5px;
  border-radius:20px 0 20px 0; box-shadow:0 8px 18px rgba(28,154,214,.26); transition:transform .4s ease; }

/* ===== ABOUT "Prendre rendez-vous" CTA banner (replaces testimonials) ===== */
.ifcar-cta-area{ background:#f2f6fb !important; }
.ifcar-cta-box{ display:flex; align-items:center; gap:34px; background:#fff; border-radius:26px; padding:34px 42px;
  box-shadow:0 26px 70px rgba(20,40,80,.10); position:relative; overflow:hidden;
  opacity:0; transform:translateY(40px); transition:none; }
.ifcar-cta-area.in .ifcar-cta-box{ animation:ifcarSolIn .7s cubic-bezier(.2,.7,.3,1) forwards; }
.ifcar-cta-box::after{ content:""; position:absolute; right:-60px; top:-60px; width:320px; height:320px; border-radius:50%;
  background:radial-gradient(circle,rgba(140,198,63,.10),transparent 70%); pointer-events:none; }
.ifcar-cta-emblem{ flex:0 0 auto; width:104px; height:100px;
  background:url(/assets/tpl/logo.png) no-repeat; background-size:300px auto; background-position:-6px -4px; }
.ifcar-cta-emblem img{ display:none; }
/* qui-sommes-nous (about) banner: use icon.svg as the emblem instead of the logo crop */
html.ifcar-page-about-us .ifcar-cta-emblem{ background:url(/assets/img/grp/icon.svg) center/contain no-repeat !important; }
.ifcar-cta-mid{ flex:1 1 auto; min-width:0; }
.ifcar-cta-title{ margin:0 0 8px; font-size:clamp(20px,2.1vw,27px); font-weight:800; line-height:1.28; color:#1c2b4a; }
.ifcar-cta-title .b{ color:#1c9ad6; } .ifcar-cta-title .g{ color:#7fbf2f; }
.ifcar-cta-sub{ margin:0 0 16px; font-size:15px; color:#6a7889; }
.ifcar-cta-checks{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 20px; font-size:15px; font-weight:600; color:#334155; }
.ifcar-cta-checks span{ display:inline-flex; align-items:center; gap:8px; position:relative; }
.ifcar-cta-checks span + span::before{ content:""; position:absolute; left:-11px; top:3px; bottom:3px; width:1px; background:#e2e9f1; }
.ifcar-cta-checks i{ color:#3aaf3f; font-size:16px; }
.ifcar-cta-right{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:12px; padding-left:36px; border-left:1px solid #eef2f6; }
.ifcar-cta-btn{ position:relative; overflow:hidden; display:inline-flex; align-items:center; gap:12px; white-space:nowrap;
  padding:16px 34px; border-radius:40px; background:linear-gradient(90deg,#1c9ad6,#7fbf2f); background-size:180% 100%; background-position:0 0;
  color:#fff !important; font-weight:700; font-size:16px; text-decoration:none;
  box-shadow:0 14px 30px rgba(28,154,214,.32); transition:transform .35s ease, box-shadow .35s ease, background-position .5s ease; }
.ifcar-cta-btn i{ transition:transform .35s ease; }
.ifcar-cta-btn::before{ content:""; position:absolute; top:0; left:-120%; width:60%; height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent); transform:skewX(-18deg); }
.ifcar-cta-btn:hover{ transform:translateY(-4px); box-shadow:0 22px 46px rgba(28,154,214,.42); background-position:100% 0; color:#fff !important; }
.ifcar-cta-btn:hover i{ transform:translateX(6px); }
.ifcar-cta-btn:hover::before{ left:130%; transition:left .8s ease; }
.ifcar-cta-note{ display:inline-flex; align-items:center; gap:7px; font-size:13.5px; color:#8a96a3; }
.ifcar-cta-note i{ color:#1c9ad6; }
@media (max-width:991px){ .ifcar-cta-box{ flex-direction:column; text-align:center; gap:22px; padding:32px 26px; }
  .ifcar-cta-right{ padding-left:0; border-left:0; } .ifcar-cta-checks{ justify-content:center; } .ifcar-cta-title br{ display:none; } }

/* ===== Recrutement > "Groupes et entreprises privés" — page title card ===== */
.ifcar-recr-hero{ position:relative; background:#ffffff; padding:60px 0; min-height:0 !important; overflow:hidden; }
.ifcar-recr-hero::before, .ifcar-recr-hero::after{ display:none !important; }   /* no navy/green corners, no dotted squares */
.ifcar-recr-card{ position:relative; z-index:2; background:none; box-shadow:none; border-radius:0;
  display:flex; align-items:center; gap:44px; padding:0; }

/* ===== Recrutement "Approche par annonce" — process + missions + CTA ===== */
.ifcar-recr2-area{ background:#fff; padding:20px 0 80px; }
.ifcar-mi{ display:flex; align-items:center; gap:16px; opacity:0; transform:translateX(-18px); }
.ifcar-recr2-area.in .ifcar-mi{ animation:ifcarMiIn .55s ease forwards; }
@keyframes ifcarMiIn{ to{ opacity:1; transform:translateX(0); } }

/* ===== ABOUT "L'ADN d'IFCAR" infographic ===== */
.ifcar-adn-area{ background:#f7fafc; padding:80px 0 70px; overflow:hidden; }
.ifcar-adn-grid{ display:grid; grid-template-columns:1fr 220px 1.15fr; gap:30px; align-items:center; }
/* left */
.ifcar-adn-eyebrow{ display:block; text-transform:uppercase; letter-spacing:2px; font-weight:800; font-size:14px; color:#8cc63f; margin-bottom:14px; }
.ifcar-adn-title{ font-size:clamp(38px,4.4vw,62px); font-weight:800; line-height:1.02; color:#1c2b4a; margin:0 0 8px; }
.ifcar-adn-title span{ color:#8cc63f; }
.ifcar-adn-title::after{ content:""; display:block; width:56px; height:4px; border-radius:3px; background:linear-gradient(90deg,#1c9ad6,#8cc63f); margin:22px 0 0; }
.ifcar-adn-intro{ color:#5a6a7a; font-size:16px; line-height:1.75; margin:24px 0 26px; max-width:340px; }
.ifcar-adn-stat{ display:flex; align-items:center; gap:16px; background:#fff; border-radius:16px; padding:16px 20px; box-shadow:0 12px 34px rgba(20,40,80,.06); margin-bottom:16px; max-width:360px;
  opacity:0; transform:translateX(-26px); transition:transform .45s ease, box-shadow .35s ease; }
.ifcar-adn-area.in .ifcar-adn-stat{ animation:ifcarAdnLeft .6s ease forwards; }
.ifcar-adn-area.in .ifcar-adn-stat:nth-child(6){ animation-delay:.12s; }
.ifcar-adn-stat:hover{ transform:translateY(-5px) !important; box-shadow:0 20px 44px rgba(20,40,80,.13); }
.ifcar-adn-stat .ic{ flex:0 0 52px; width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:rgba(140,198,63,.14); color:#8cc63f; font-size:20px; transition:transform .4s ease;
  animation:ifcarIcFloat 3.4s ease-in-out infinite; }
.ifcar-adn-stat:hover .ic{ animation-play-state:paused; transform:scale(1.12) rotate(-6deg); }
.ifcar-adn-stat h5{ margin:0 0 3px; font-size:19px; font-weight:800; color:#1c2b4a; }
.ifcar-adn-stat h5 b{ color:#8cc63f; }
.ifcar-adn-stat p{ margin:0; font-size:13.5px; line-height:1.5; color:#6a7889; }
/* center DNA */
.ifcar-adn-dna{ display:flex; flex-direction:column; align-items:center; text-align:center; }
.ifcar-adn-cap b{ display:block; font-size:22px; font-weight:800; color:#8cc63f; }
.ifcar-adn-cap.bot b{ color:#2b3f9b; }
.ifcar-adn-cap span{ font-size:13px; color:#5a6a7a; line-height:1.4; }
.ifcar-adn-cap.top{ margin-bottom:6px; } .ifcar-adn-cap.bot{ margin-top:6px; }
.ifcar-adn-helix{ position:relative; width:190px; height:440px; }
.ifcar-dna-svg{ width:100%; height:100%; display:block; }
/* strands draw in once, then the bright flow + rung pulse run forever */
.ifcar-adn-area.in .ifcar-dna-main{ stroke-dasharray:1400; stroke-dashoffset:1400; animation:ifcarDnaDraw 2.2s ease forwards; }
.ifcar-adn-area.in .ifcar-dna-main:nth-of-type(2){ animation-delay:.15s; }
.ifcar-dna-flow{ animation:ifcarDnaFlow 1.5s linear infinite; }        /* continuous energy flowing down */
.ifcar-dna-flow.f2{ animation-duration:1.9s; animation-direction:reverse; }
.ifcar-dna-rung{ transform-origin:center; animation:ifcarRungPulse 2.4s ease-in-out infinite; }
.ifcar-dna-letter{ position:absolute; left:50%; margin-left:-26px; margin-top:-26px; width:52px; height:52px; border-radius:50%;
  background:#fff; box-shadow:0 8px 22px rgba(20,40,80,.16); display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:22px; z-index:2; opacity:0;
  animation:ifcarDnaFloat 3.4s ease-in-out infinite; transition:transform .3s ease, box-shadow .35s ease, opacity .5s ease; }
.ifcar-adn-area.in .ifcar-dna-letter{ opacity:1; }
.ifcar-dna-letter.d1{ color:#8cc63f; animation-delay:-.2s; transition-delay:.35s; } .ifcar-dna-letter.d2{ color:#25b3a6; animation-delay:-1.1s; transition-delay:.5s; }
.ifcar-dna-letter.d3{ color:#1c9ad6; animation-delay:-2s; transition-delay:.65s; } .ifcar-dna-letter.d4{ color:#7b5cc4; animation-delay:-2.7s; transition-delay:.8s; }
.ifcar-dna-letter.d5{ color:#2b3f9b; animation-delay:-3.3s; transition-delay:.95s; }
.ifcar-dna-letter:hover{ animation-play-state:paused; transform:scale(1.2) translateY(-3px); box-shadow:0 14px 30px rgba(20,40,80,.28); }
/* right cards */
.ifcar-adn-card{ position:relative; display:flex; align-items:center; gap:18px; background:#fff; border-radius:16px; padding:20px 26px 20px 22px;
  box-shadow:0 12px 34px rgba(20,40,80,.06); margin-bottom:16px; overflow:hidden;
  opacity:0; transform:translateX(30px); }
.ifcar-adn-area.in .ifcar-adn-card{ animation:ifcarAdnRight .6s ease forwards; }
.ifcar-adn-card::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--adnc,#1c9ad6); transform:scaleY(0); transform-origin:top; transition:transform .4s ease; }
.ifcar-adn-card:hover{ transform:translateY(-6px) !important; box-shadow:0 22px 48px rgba(20,40,80,.14); }
.ifcar-adn-card:hover::before{ transform:scaleY(1); }
.ifcar-adn-cic{ flex:0 0 62px; width:62px; height:62px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:color-mix(in srgb, var(--adnc) 13%, #fff); color:var(--adnc); font-size:24px; transition:transform .4s ease;
  animation:ifcarIcPulse 3s ease-in-out infinite; }
.ifcar-adn-card:hover .ifcar-adn-cic{ animation-play-state:paused; transform:rotate(-8deg) scale(1.12); }
.ifcar-adn-ctx{ flex:1; }
.ifcar-adn-ctx h4{ margin:0 0 5px; font-size:18px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; color:var(--adnc); }
.ifcar-adn-ctx p{ margin:0; font-size:13.5px; line-height:1.55; color:#6a7889; }
.ifcar-adn-cnum{ flex:0 0 auto; padding-left:18px; margin-left:6px; border-left:2px solid #eef2f6; font-size:30px; font-weight:800; color:var(--adnc); opacity:.85; }
.ifcar-adn-card.c1{ --adnc:#7fbf2f; } .ifcar-adn-card.c2{ --adnc:#25b3a6; } .ifcar-adn-card.c3{ --adnc:#1c9ad6; }
.ifcar-adn-card.c4{ --adnc:#7b5cc4; } .ifcar-adn-card.c5{ --adnc:#2b3f9b; }
@keyframes ifcarAdnLeft{ to{ opacity:1; transform:translateX(0); } }
@keyframes ifcarAdnRight{ to{ opacity:1; transform:translateX(0); } }
@keyframes ifcarDnaDraw{ to{ stroke-dashoffset:0; } }
@keyframes ifcarDnaFlow{ to{ stroke-dashoffset:-96; } }         /* energy flows down the strand */
@keyframes ifcarRungPulse{ 0%,100%{ opacity:.45; } 50%{ opacity:1; } }
@keyframes ifcarDnaFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-8px); } }
@keyframes ifcarIcPulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.08); } }
@keyframes ifcarIcFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-5px); } }
@media (max-width:1100px){ .ifcar-adn-grid{ grid-template-columns:1fr; gap:34px; } .ifcar-adn-dna{ order:3; } .ifcar-adn-intro{ max-width:none; } }

/* --- "Prenez rendez-vous" CTA (inside the Accompagnement individuel tab) --- */
.ifcar-rdv-wrap{ margin:34px 0 6px; text-align:center; width:100%; }
.ifcar-rdv-btn{
  display:inline-flex; align-items:center; gap:9px; justify-content:center;
  padding:16px 36px; border-radius:50px; text-decoration:none;
  background:linear-gradient(90deg,#1c9ad6,#8cc63f);
  color:#fff; font-size:17px; font-weight:600; letter-spacing:.2px;
  box-shadow:0 12px 30px rgba(28,154,214,.32);
  transition:transform .25s ease, box-shadow .25s ease, filter .25s ease;
}
.ifcar-rdv-btn:hover{ transform:translateY(-3px); box-shadow:0 16px 40px rgba(28,154,214,.45); filter:brightness(1.04); color:#fff; }
.ifcar-rdv-btn i{ transition:transform .25s ease; }
.ifcar-rdv-btn:hover i{ transform:translateX(4px); }
/* rotator: a 1-line window; the stacked words translate up on a loop */
.ifcar-rdv-rot{ display:inline-block; height:1.35em; line-height:1.35em; overflow:hidden; vertical-align:bottom; text-align:left; }
.ifcar-rdv-rot b{ display:block; font-weight:800; color:#fff; animation:ifcarWords 6.6s cubic-bezier(.86,0,.07,1) infinite; }
@keyframes ifcarWords{
  0%,27%   { transform:translateY(0); }
  33%,60%  { transform:translateY(-1.35em); }
  66%,93%  { transform:translateY(-2.70em); }
  100%     { transform:translateY(-4.05em); }
}

/* --- Two-tone brand accents (harmonious blue + green from the logo) ---
   Blue = CTAs / links / structure (theme --color-primary).
   Green = section eyebrows + content icons, so no single colour dominates. */
.sub-title{ color:#8cc63f !important; }
i[class*="flaticon-"]{ color:#8cc63f !important; }

/* --- Social: keep only Facebook, LinkedIn, Instagram (hide Twitter & Pinterest) --- */
li:has(i.fa-twitter), li:has(i.fa-pinterest-p),
li:has(i.fa-twitter-square), li:has(i.fa-pinterest){ display:none !important; }

/* --- Give the menu column more room (drop the offset, widen it) so the long
   French menu fits on ONE line at the desktop breakpoint (>=1200). --- */
/* The body is locked to a fixed 1440px design width from 1024px up (lockScale in
   i18n.js), so keep the FULL desktop menu (no hamburger) from 1024px up — every
   laptop/monitor from 1300px to TV shows the same design, just scaled. Below 1300
   the template's native collapsed/hamburger menu takes over (handled separately). */
@media (min-width:1300px){
  /* shrink the logo + button columns so the 6-item menu fits on one line */
  .navbar .col-xl-2.col-lg-3{ -ms-flex:0 0 12% !important; flex:0 0 12% !important; max-width:12% !important; }
  .navbar .col-xl-3.col-md-6{ -ms-flex:0 0 22% !important; flex:0 0 22% !important; max-width:22% !important; }
  .navbar .col-xl-6.offset-xl-1{
    -ms-flex:0 0 66% !important; flex:0 0 66% !important;
    max-width:66% !important; margin-left:0 !important;
    padding-left:52px !important;
  }
  nav.navbar .button a{ white-space:nowrap !important; }
  #navbar-menu .navbar-nav{ display:-ms-flexbox !important; display:flex !important; -ms-flex-direction:row !important; flex-direction:row !important; -ms-flex-pack:center !important; justify-content:center !important; -ms-flex-align:center !important; align-items:center !important; -ms-flex-wrap:nowrap !important; flex-wrap:nowrap !important; white-space:nowrap !important; width:100% !important; }
  #navbar-menu .navbar-nav > li{ float:none !important; display:-ms-flexbox !important; display:flex !important; -ms-flex:0 0 auto !important; flex:0 0 auto !important; }
  nav.navbar #navbar-menu .navbar-nav > li > a{ font-size:11px !important; padding-left:11px !important; padding-right:11px !important; white-space:nowrap !important; }
}
/* Mobile (hamburger up to 1299): expand a dropdown's submenu inline when tapped (li.open) */
@media (max-width:1299px){
  #navbar-menu .navbar-nav > li.dropdown > .dropdown-menu,
  nav.navbar.validnavs .navbar-nav > li.dropdown > ul.dropdown-menu{ display:none !important; }
  #navbar-menu .navbar-nav > li.dropdown.open > .dropdown-menu,
  nav.navbar.validnavs .navbar-nav > li.dropdown.open > ul.dropdown-menu{ display:block !important; position:static !important; float:none !important; width:100% !important; box-shadow:none !important; }
}
/* --- Menu text (base; desktop tightens it above) --- */
#navbar-menu .navbar-nav > li > a{ font-size:15px !important; padding-left:7px !important; padding-right:7px !important; letter-spacing:0 !important; }
.navbar-nav > li{ white-space:nowrap !important; }

/* --- Top-level hover: brand blue (no underline — like the original template) --- */
#navbar-menu .navbar-nav > li > a{ transition:color .2s ease !important; }
#navbar-menu .navbar-nav > li:hover > a,
#navbar-menu .navbar-nav > li > a:hover,
#navbar-menu .navbar-nav > li.active > a{ color:#1c9ad6 !important; }

/* --- Submenu hover animation (clearly shows the item you're on) --- */
#navbar-menu .dropdown-menu{ padding:6px 0 !important; overflow:hidden; }
#navbar-menu .dropdown-menu > li > a{
  position:relative; display:block; padding:7px 16px 7px 20px !important; line-height:1.35 !important;
  transition:color .25s ease, background-color .25s ease, padding-left .25s ease !important;
}
#navbar-menu .dropdown-menu > li > a::before{
  content:""; position:absolute; left:0; top:6px; bottom:6px; width:3px; border-radius:0 3px 3px 0;
  background:linear-gradient(180deg,#29abe2,#0e6cb0);
  transform:scaleY(0); transform-origin:center; transition:transform .28s ease;
}
#navbar-menu .dropdown-menu > li > a:hover{
  color:#1c9ad6 !important; background-color:rgba(28,154,214,.10) !important; padding-left:30px !important;
}
#navbar-menu .dropdown-menu > li > a:hover::before{ transform:scaleY(1); }
.navbar-nav .dropdown-toggle .fa-angle-down, .navbar-nav .dropdown-toggle::after{ margin-left:2px; }

/* --- Footer logo sizing only (header logo left at the original template size/position) --- */
.footer-logo img, .footer .logo, footer img.logo{
  height:82px !important; max-height:82px !important; width:auto !important;
}

/* ============ SULTIN-STYLE HEADER (homepage, transparent over hero) ============ */
html.ifcar-home .top-bar-area{ background:#0f2338 !important; border-bottom:1px solid rgba(255,255,255,.12); }
/* idea2: thin vertical separators in the navy topbar (email | phone, social | langs) */
.top-bar-area ul.item-flex > li + li{ border-left:1px solid rgba(255,255,255,.26) !important; padding-left:22px !important; margin-left:10px !important; }
.top-bar-area .social #lang-switcher{ border-left:1px solid rgba(255,255,255,.26) !important; padding-left:15px !important; margin-left:9px !important; }
/* topbar email + phone: same small size as the menu, with matching small icons */
.top-bar-area ul.item-flex > li,
.top-bar-area ul.item-flex > li > a{ font-size:13px !important; }
.top-bar-area ul.item-flex > li > a i,
.top-bar-area ul.item-flex > li i{ font-size:15px !important; }
/* move email + phone to the LEFT of the topbar (just after the logo box), not centered */
.top-bar-area .col-xl-6.offset-xl-3{ margin-left:175px !important; }
.top-bar-area ul.item-flex{ -ms-flex-pack:start !important; justify-content:flex-start !important; }
/* push the social icons + language switcher to the FAR RIGHT edge of the topbar */
.top-bar-area .col-xl-3.text-end{ transform:translateX(222px) !important; }
/* NOTE: white box kept as the ORIGINAL template geometry (no overrides).
   Header logo enlarged to roughly the original logo footprint, positioned the same
   way (left, same vertical centre) — only the size grows, layout unchanged. */
.navbar-header img.logo{
  height:56px !important; max-height:56px !important; width:auto !important;
  position:relative !important; top:0 !important;   /* default: centred in the navbar (inner pages) */
}
/* Homepage only: raise the logo so it sits centred inside the white angled box. */
html.ifcar-home .navbar:not(.sticked) .navbar-header img.logo{ top:-36px !important; }
/* Shorter menu row (home): trim the vertical padding of the nav links + button so the
   white menu band is more compact. */
html.ifcar-home nav.navbar:not(.sticked) #navbar-menu .navbar-nav > li > a{ padding-top:8px !important; padding-bottom:8px !important; }
/* About page: remove the "À propos" title banner (heading + breadcrumb + image). */
.ifcar-page-about-us .breadcrumb-area{ display:none !important; }
/* Hide the "Accueil › Page" breadcrumb trail on EVERY page (template pages + custom heroes). */
ul.breadcrumb, .rech-crumb, .ig-crumb, .fc-crumb, .sm-crumb, .cons-crumb, .form-crumb{ display:none !important; }
/* About page: keep the decorative "X" but shift it left into the margin so it no
   longer overlaps the "Des solutions" text; remove the founder block. */
.ifcar-page-about-us img[src*="anim-2"]{ transform:translate(-42px,-10px) !important; }
.ifcar-page-about-us .owner-info{ display:none !important; }
/* Sticky navbar (scrolled -> class "sticked"): no white box / no top-bar above, so
   drop the upward offset and shrink the logo so it sits fully inside the 88px bar.
   NOTE: match ONLY .sticked (the navbar always carries "navbar-sticky on"). */
.navbar.sticked .navbar-header img.logo{
  height:60px !important; max-height:60px !important; top:0 !important;
}
/* Unified sticky navbar for ALL pages (HOME included). Now that page scrolling works
   again (the body height/overflow fix above), the template's native fixed sticky
   positions correctly at top:0 — so the HOME uses the SAME sticky as Qui sommes-nous
   et al. Slide it down on appear. The old standalone #ifcar-sbar hack is retired. */
@keyframes ifcarStickyDown{ 0%{ transform:translateY(-105%); } 100%{ transform:translateY(0); } }
nav.navbar.sticked{
  animation:ifcarStickyDown .5s cubic-bezier(.22,.61,.36,1) both !important;
  box-shadow:0 8px 26px -10px rgba(12,34,68,.22) !important; background:#fff !important;
}
#ifcar-sbar{ display:none !important; }
/* Accueil 2 (/home2): show ONLY header → hero → confiance → NOS DOMAINES D'EXPERTISE,
   exactly like the mockup — hide every section below the expertise cards + the footer. */
html.ifcar-acc2 .team-style-one-area,
html.ifcar-acc2 .ifcar-experts-area,
html.ifcar-acc2 .request-call-back-area,
html.ifcar-acc2 .ifcar-hero2-area,
html.ifcar-acc2 .home-blog-area,
html.ifcar-acc2 .ifcar-hcontact-area,
html.ifcar-acc2 .c2-field,
html.ifcar-acc2 .c2-area,
html.ifcar-acc2 footer,
html.ifcar-acc2 .footer-area{ display:none !important; }
/* White box (non-sticky): shorter + centred vertically on the logo so the logo
   sits in the MIDDLE of the box (not dropped to the bottom). */
html.ifcar-home .navbar:not(.sticked) .navbar-header::after{
  transform:none !important; top:-58px !important; bottom:auto !important; height:104px !important;
}
html.ifcar-home .navbar:not(.sticked) .navbar-header::before{
  display:none !important;
}

/* ============ SULTIN SLIDER — faithful port (homepage) ============ */
/* title font from the Sultin template */
@font-face{ font-family:"Dancing Script"; font-style:normal; font-weight:700; font-display:swap;
  src:url(/assets/fonts/script/dancing-script.woff2) format("woff2"); }
@font-face{ font-family:"DM Sans"; font-style:normal; font-weight:100 1000; font-display:swap;
  src:url(/assets/fonts/dmsans/dmsans-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:"DM Sans"; font-style:normal; font-weight:100 1000; font-display:swap;
  src:url(/assets/fonts/dmsans/dmsans-latinext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
/* Circle button (arrow) that expands rightward into a pill revealing the text on hover.
   The circle stays anchored on the left (no jump), text slides out to the right. */
.ifcar-sultin-slider .iss-btn{ display:inline-flex; align-items:center; text-decoration:none; }

/* --- Hero: ONE static photo + shape (built once by JS), only the text cycles --- */
/* (removed a background-image override that pointed at a never-shipped slide.png —
   the visible hero is the .ifcar-sultin-slider layered on top, so this only caused a 404) */

/* static layer holds the photo (+ its shapes); it never re-fades */
.ifcar-hero-static{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.ifcar-hero-static .banner-thumb{
  display:block !important; position:absolute; inset:0;
  transition:none !important; transform-origin:center;
  animation:ifcarZoomOnce 20s ease-out forwards !important;   /* zoom ONCE, then hold */
}
@keyframes ifcarZoomOnce{ from{transform:scale(1)} to{transform:scale(1.12)} }
/* pin the right-side blue shape (bottom-right), it appears once and stays */
.ifcar-hero-static .banner-shape-bg{
  display:block !important; position:absolute !important;
  right:0 !important; left:auto !important; bottom:0 !important; top:auto !important;
  width:50% !important; height:auto !important; margin:0 !important; z-index:1;
}
.ifcar-hero-static .banner-shape-bg img{ width:100% !important; height:auto !important; }

/* once the static layer exists, hide the per-slide photo/shape and let text sit on top */
.ifcar-hero-ready .banner-fade .swiper-slide .banner-thumb,
.ifcar-hero-ready .banner-fade .swiper-slide .banner-shape-bg{ display:none !important; }
.ifcar-hero-ready .banner-fade{ position:relative; z-index:2; }
.ifcar-hero-ready .banner-fade .swiper,
.ifcar-hero-ready .banner-fade .swiper-slide,
.ifcar-hero-ready .banner-fade .banner-thumb{ background:transparent !important; }

/* reserve heading height (tallest = 3 lines) so nothing shifts between slides */
.banner-fade .swiper-slide .content h2{ min-height:3.3em; }

/* the "Nos services" button: reserved position (no move) + does not re-animate */
.banner-fade .swiper-slide .content > .button{ opacity:1 !important; animation:none !important; }

/* SIMPLE text transition: pure cross-fade only (no movement -> no shake).
   Swiper's crossFade handles the fade; a tiny opacity ease keeps it soft. */
.banner-fade .swiper-slide .content > h4,
.banner-fade .swiper-slide .content > h2{ transition:opacity .6s ease; }

/* --- Arabic: keep LTR layout, right-align & RTL-shape body text only --- */
/* Body copy + headings read right-to-left without reordering the grid/decorations */
html.lang-ar p,
html.lang-ar h1, html.lang-ar h2, html.lang-ar h3,
html.lang-ar h4, html.lang-ar h5, html.lang-ar h6,
html.lang-ar blockquote, html.lang-ar figcaption,
html.lang-ar .heading, html.lang-ar .title, html.lang-ar .sub-title,
html.lang-ar .content, html.lang-ar .item-content, html.lang-ar dd, html.lang-ar dt{
  direction:rtl; text-align:right;
}
/* centered blocks stay centered */
html.lang-ar .text-center, html.lang-ar .text-center *{ text-align:center!important; }
/* ============================================================================
   POLICES ARABES — auto-hébergées (aucun appel extérieur, cf. site 100 % statique)
     Titres      : Noto Kufi Arabic — Bold (700)
     Sous-titres : Noto Kufi Arabic — SemiBold (600)
     Paragraphes : IBM Plex Sans Arabic — Regular (400)
   ⚠️ `unicode-range` limité aux blocs arabes : c'est ce qui protège le design. Les
   fragments LATINS qui restent dans une page arabe (IFCAR SOLUTIONS, EEP, e-mails,
   numéros, dates) continuent d'être rendus par la police du gabarit — la charte latine
   ne bouge pas d'un pixel, seul l'arabe change de dessin.
   Le fichier Noto est VARIABLE : un seul fichier couvre 600 et 700.
   ============================================================================ */
@font-face{
  font-family:"Noto Kufi Arabic";
  src:url("/assets/fonts/noto-kufi-arabic-var.woff2") format("woff2");
  font-weight:100 900; font-style:normal; font-display:swap;
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,
                U+200C-200E,U+2010-2011,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC;
}
@font-face{
  font-family:"IBM Plex Sans Arabic";
  src:url("/assets/fonts/ibm-plex-sans-arabic-400.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
  unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,
                U+200C-200E,U+2010-2011,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC;
}

/* Paragraphes — posé sur body, donc hérité par tout ce qui n'est ni titre ni sous-titre
   (texte courant, menu, boutons, champs, listes). Les polices du gabarit restent EN REPLI
   derrière : elles reprennent la main sur tout ce qui n'est pas arabe. */
html.lang-ar body{ font-family:"IBM Plex Sans Arabic","Segoe UI","Tahoma","Arial",sans-serif; }
/* …mais l'héritage ne suffit pas : le gabarit repose `font-family` DIRECTEMENT sur `p`,
   `span`, `b`, `a`, `button`. Il faut donc les reprendre un par un.
   ⚠️ `span` et `b` sont exclus quand ils portent une classe d'ICÔNE : Font Awesome et
   flaticon dessinent leurs glyphes AVEC la police, leur imposer une autre famille les
   remplacerait par des carrés. (Les icônes Phosphor `.ph`, elles, sont des masques CSS —
   insensibles à la police — mais on les exclut aussi, par principe.)
   ⚠️ UN SEUL `:not(a,b,c)` et pas une chaîne `:not(a):not(b):not(c)` : chaque `:not()`
   enchaîné ajoute sa spécificité, la règle pesait alors plus lourd que celles des titres
   et des surtitres plus bas — les surtitres repassaient en police de paragraphe. */
html.lang-ar p, html.lang-ar li, html.lang-ar td, html.lang-ar th,
html.lang-ar dd, html.lang-ar dt, html.lang-ar blockquote, html.lang-ar figcaption,
html.lang-ar label, html.lang-ar input, html.lang-ar textarea, html.lang-ar select,
html.lang-ar a, html.lang-ar button, html.lang-ar strong, html.lang-ar em,
html.lang-ar b:not(.fas,.far,.fab,.fal,.fad,[class^="fa-"],[class*=" fa-"],[class*="flaticon"],.ph),
html.lang-ar span:not(.fas,.far,.fab,.fal,.fad,[class^="fa-"],[class*=" fa-"],[class*="flaticon"],.ph){
  font-family:"IBM Plex Sans Arabic","Outfit","Segoe UI","Tahoma",sans-serif !important;
}

/* Titres — Bold. `!important` : le gabarit impose ses propres familles et graisses (jusqu'à
   900) sur la plupart de ces sélecteurs, sans quoi rien ne s'appliquerait. */
/* ⚠️ `html.lang-ar.lang-ar` (classe répétée) et pas `html.lang-ar` : la règle des paragraphes
   ci-dessus contient un `:not(...)`, qui compte pour une classe — elle pèse donc plus lourd
   qu'un simple `html.lang-ar [class*="…"]` et gagnait sur les surtitres. La classe répétée
   remet les titres devant sans toucher à la règle des paragraphes. */
html.lang-ar.lang-ar h1, html.lang-ar.lang-ar h2,
html.lang-ar.lang-ar .title, html.lang-ar.lang-ar .heading,
html.lang-ar.lang-ar [class*="-h1"], html.lang-ar.lang-ar [class*="-h2"],
html.lang-ar.lang-ar [class*="-title"]:not([class*="sub-title"]):not(.widget-title){
  font-family:"Noto Kufi Arabic","IBM Plex Sans Arabic","Segoe UI",sans-serif !important;
  font-weight:700 !important;
}
/* Sous-titres — SemiBold. Les surtitres (`-eyebrow`, `.ifcar-mtitle`) en font partie :
   ce sont les intitulés courts posés au-dessus des titres de page. */
html.lang-ar.lang-ar h3, html.lang-ar.lang-ar h4, html.lang-ar.lang-ar h5, html.lang-ar.lang-ar h6,
html.lang-ar.lang-ar .sub-title, html.lang-ar.lang-ar .widget-title,
html.lang-ar.lang-ar [class*="sub-title"], html.lang-ar.lang-ar [class*="-eyebrow"],
html.lang-ar.lang-ar .ifcar-mtitle{
  font-family:"Noto Kufi Arabic","IBM Plex Sans Arabic","Segoe UI",sans-serif !important;
  font-weight:600 !important;
}
/* keep emails / phones / latin fragments readable inside Arabic text */
html.lang-ar a[href^="mailto:"], html.lang-ar a[href^="tel:"]{ direction:ltr; unicode-bidi:embed; display:inline-block; }

/* ============================================================================
   Minimal anti-FOUC cover (NO branded loader).
   A plain white cover that fades out fast the instant the IFCAR content is built
   — no logo, no spinner. It prevents the raw-template flash without looking like a
   loading screen. The zoom is pre-applied in a small <head> inline script (per page)
   so there is NO layout-settle glitch ("small on the left") under the cover.
   ============================================================================ */
#preloader{ display:none !important; }   /* safety net: any leftover template preloader */
html:not(.ifcar-ready) body{ overflow:hidden !important; }   /* no scroll while the cover is up */
/* CRITICAL scroll fix: the template forces body{height:100vh; overflow:auto}, which under the
   zoom-lock turns <body> into a viewport-height INNER scroll container so the document can't
   scroll (sticky never triggers). Let the body grow to full content height. */
html.ifcar-ready body{ height:auto !important; min-height:auto !important; overflow:visible !important; }
/* Cover that hides the raw template until our transforms are in place.
   HOME (html.ifcar-home): a branded loader = white + IFCAR logo + spinner.
   OTHER pages: a plain white cover only, revealed fast (see i18n.js) so they
   never look stuck; no logo/spinner there. Both fade out on .ifcar-ready. */
html::before{
  content:""; position:fixed; inset:0; z-index:2147483645; background:#ffffff;
  opacity:1; pointer-events:auto; transition:opacity .35s ease;
  animation:ifcarCloakFallback .1s linear 2.4s forwards;   /* safety reveal if JS dies */
}
/* HOME only: logo + spinner */
html.ifcar-home::before{
  background:#ffffff url("/assets/tpl/logo.png") no-repeat center 43%;
  background-size:210px auto;
}
html.ifcar-home::after{
  content:""; position:fixed; z-index:2147483646;
  left:50%; top:calc(43% + 82px); width:36px; height:36px; margin-left:-18px;
  border:3px solid #e6edf5; border-top-color:#1c9ad6; border-radius:50%;
  opacity:1; pointer-events:none; transition:opacity .35s ease;
  animation:ifcarSpin .75s linear infinite, ifcarCloakFallback .1s linear 2.4s forwards;
}
html.ifcar-ready::before, html.ifcar-ready::after{ opacity:0 !important; visibility:hidden !important; pointer-events:none !important; }
@keyframes ifcarCloakFallback{ to{ opacity:0; visibility:hidden; } }
@keyframes ihSwoosh{ to{ stroke-dashoffset:0; } }
@keyframes ihShine{ 0%{left:-60%} 55%,100%{left:145%} }
@keyframes ihFloat{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-11px) } }
/* responsive */
@media (max-width:991px){
  .ifcar-hero2-top{ grid-template-columns:1fr; gap:60px; padding:56px 0 30px; }
  .ih-title{ font-size:42px; }
  .ih-photo img{ height:420px; }
  .ih-badge{ width:230px; }
  .ifcar-hero2-bar{ grid-template-columns:1fr 1fr; gap:26px; padding:30px 30px; }
  .ih-quote{ grid-column:1 / -1; padding-left:0; }
  .ih-quote::before{ display:none; }
  .ih-quote-mark{ left:0; }
}

/* ===== Contact page redesign (/contact-us) ===== */
html.ifcar-page-contact-us .maps-area{ display:none !important; }
@keyframes c2Dots{ 0%,100%{ opacity:.35 } 50%{ opacity:.7 } }
.c2-sub{ color:#c4d0e2; font-size:14.5px; line-height:1.7; margin:0 0 26px; max-width:410px; }
.c2-form-head{ display:flex; align-items:flex-start; gap:18px; margin-bottom:26px; }
@keyframes c2Bob{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)} }
.c2-form-head h3{ color:#0c2244; font-size:26px; font-weight:800; margin:6px 0 0; }
.c2-form-underline{ display:block; width:70px; height:3px; border-radius:3px; background:#8cc63f; margin:8px 0 12px; }
.c2-form-head p{ color:#6b7b90; font-size:14px; line-height:1.6; margin:0; }
.c2-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.c2-field{ position:relative; margin-bottom:0; }
.c2-select, .c2-area{ margin-top:16px; }
.c2-field>i:first-child{ position:absolute; left:16px; top:50%; transform:translateY(-50%); color:#9aa7b8; font-size:15px; z-index:1; pointer-events:none; }
.c2-field input, .c2-field select, .c2-field textarea{ width:100%; border:1.5px solid #e3e8ef; border-radius:12px; background:#fbfcfe; padding:16px 16px 16px 44px; font-size:15px; color:#0c2244; outline:none; transition:border-color .2s, box-shadow .2s, background .2s; font-family:inherit; }
.c2-area textarea{ padding-left:16px; resize:vertical; min-height:130px; display:block; }
.c2-select select{ padding-left:16px; appearance:none; -webkit-appearance:none; cursor:pointer; }
.c2-field input:focus, .c2-field select:focus, .c2-field textarea:focus{ border-color:#8cc63f; box-shadow:0 0 0 3px rgba(140,198,63,.16); background:#fff; }
.c2-field label{ position:absolute; left:44px; top:50%; transform:translateY(-50%); color:#9aa7b8; font-size:15px; pointer-events:none; transition:all .17s ease; }
.c2-area label, .c2-select label{ left:16px; }
.c2-area label{ top:20px; transform:none; }
.c2-field label em{ color:#e0483b; font-style:normal; }
.c2-field input:focus + label, .c2-field input:not(:placeholder-shown) + label,
.c2-field textarea:focus + label, .c2-field textarea:not(:placeholder-shown) + label,
.c2-select select:focus + label, .c2-select select:valid + label{ top:-9px; left:12px; transform:none; font-size:11.5px; color:#6fb62e; background:#fff; padding:0 6px; }
.c2-select select:required:invalid{ color:#9aa7b8; }
.c2-select>i.fa-chevron-down{ position:absolute; right:18px; top:50%; transform:translateY(-50%); color:#9aa7b8; pointer-events:none; }
.c2-check{ display:flex; align-items:flex-start; gap:11px; margin:20px 0 24px; color:#6b7b90; font-size:13.5px; line-height:1.5; cursor:pointer; position:relative; }
.c2-check input{ position:absolute; opacity:0; width:0; height:0; }
.c2-check span{ flex:0 0 auto; width:20px; height:20px; border:1.6px solid #cfd8e3; border-radius:6px; margin-top:1px; position:relative; transition:all .2s; }
.c2-check input:checked + span{ background:#8cc63f; border-color:#8cc63f; }
.c2-check input:checked + span::after{ content:""; position:absolute; left:6px; top:2px; width:5px; height:10px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg); }
.c2-submit{ position:relative; overflow:hidden; display:inline-flex; align-items:center; gap:10px; border:0; cursor:pointer; padding:16px 30px; border-radius:50px; background:linear-gradient(120deg,#8cc63f,#6fb62e); color:#fff; font-weight:800; font-size:15.5px; box-shadow:0 14px 30px -10px rgba(140,198,63,.7); transition:transform .25s, box-shadow .25s; }
.c2-submit:hover{ transform:translateY(-3px); box-shadow:0 20px 42px -10px rgba(140,198,63,.9); }
.c2-submit .fa-arrow-right{ transition:transform .25s; }
.c2-submit:hover .fa-arrow-right{ transform:translateX(5px); }
.c2-submit::after{ content:""; position:absolute; top:0; left:-60%; width:34%; height:100%; transform:skewX(-20deg); background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.5),rgba(255,255,255,0)); animation:ihShine 3.6s ease-in-out infinite; }
.c2-ok{ display:none; margin-top:22px; padding:16px 20px; border-radius:12px; background:#eaf7dd; color:#4e8a1e; font-weight:600; }
.c2-form.sent .c2-grid, .c2-form.sent .c2-select, .c2-form.sent .c2-area, .c2-form.sent .c2-check, .c2-form.sent .c2-actions{ display:none; }
.c2-form.sent .c2-ok{ display:block; }
@keyframes c2ItemIn{ from{ opacity:0; transform:translateX(-14px) } to{ opacity:1; transform:none } }
/* responsive */
@media (max-width:991px){
  .ifcar-contact2{ grid-template-columns:1fr; }
  .c2-info, .c2-form-wrap{ padding:40px 30px; }
  .c2-grid{ grid-template-columns:1fr; }
  .c2-actions{ flex-direction:column; align-items:stretch; }
  .c2-callback{ justify-content:center; }
}

/* ===== HOME "Nos domaines" > Recrutement: ifcarjob.com boost banner (light) ===== */
.ifcar-job-boost-wrap{ margin-top:34px; }
.ifcar-job-boost{ position:relative; overflow:hidden; border-radius:18px; padding:16px 26px;
  background:linear-gradient(120deg,#ffffff 0%,#f5f9fd 100%); isolation:isolate;
  box-shadow:0 18px 44px -22px rgba(12,34,68,.28), inset 0 0 0 1px #eef2f7; }
/* flowing lines on the right */
.ijb-lines{ position:absolute; right:0; top:0; width:52%; height:100%; z-index:0; pointer-events:none; }
.ijb-lines path{ fill:none; stroke:#dbe4ef; stroke-width:1.6; stroke-linecap:round; stroke-dasharray:6 10;
  animation:ijbFlow 9s linear infinite; }
.ijb-lines path:nth-child(2){ animation-duration:12s; }
.ijb-lines path:nth-child(3){ animation-duration:7.5s; stroke:#e4ebf3; }
@keyframes ijbFlow{ to{ stroke-dashoffset:-160; } }
.ijb-lines-dot{ fill:#8cc63f; animation:ijbDotPulse 2.4s ease-in-out infinite; }
@keyframes ijbDotPulse{ 0%,100%{ opacity:.5; r:3.5px } 50%{ opacity:1; r:5px } }
/* layout */
.ijb-inner{ position:relative; z-index:2; display:flex; align-items:center; gap:20px; }
/* rocket + rotating arcs */
.ijb-rocket-wrap{ flex:0 0 auto; position:relative; width:78px; height:78px; }
.ijb-ring{ position:absolute; inset:6px; border-radius:50%; border:1.6px dashed #cfdae7;
  animation:ijbSpin 16s linear infinite; }
.ijb-arcs{ position:absolute; inset:0; width:100%; height:100%; overflow:visible;
  animation:ijbSpin 5.5s linear infinite; transform-origin:50% 50%; }
@keyframes ijbSpin{ to{ transform:rotate(360deg); } }
.ijb-rocket{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:48px; height:48px;
  border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 22px -8px rgba(45,155,240,.5), inset 0 0 0 1px #eef2f7;
  animation:ijbBob 3s ease-in-out infinite; z-index:2; }
.ijb-rocket i{ color:#1c9ad6; font-size:20px; transform:rotate(45deg); }
@keyframes ijbBob{ 0%,100%{ transform:translate(-50%,-50%) } 50%{ transform:translate(-50%,-58%) } }
.ijb-dot{ position:absolute; left:50%; bottom:11px; transform:translateX(-50%); width:8px; height:8px;
  border-radius:50%; background:#8cc63f; box-shadow:0 0 0 4px rgba(140,198,63,.18); z-index:3;
  animation:ijbDotPulse 2.2s ease-in-out infinite; }
/* text */
.ijb-txt{ flex:1 1 auto; min-width:0; }
.ijb-eyebrow{ display:inline-flex; align-items:center; gap:7px; font-size:11px; font-weight:800;
  letter-spacing:.13em; text-transform:uppercase; color:#1c9ad6; margin-bottom:7px; }
.ijb-eyebrow i{ color:#8cc63f; font-size:13px; }
.ijb-title{ color:#0c2244; font-size:18px; line-height:1.28; font-weight:800; margin:0; }
.ijb-title em{ font-style:normal; color:#6fb62e; position:relative; white-space:nowrap; }
.ijb-title em:after{ content:""; position:absolute; left:0; right:0; bottom:-4px; height:3px; border-radius:3px;
  background:#8cc63f; transform:scaleX(0); transform-origin:left; animation:ijbUnder 4.5s ease-in-out infinite; }
@keyframes ijbUnder{ 0%,12%{ transform:scaleX(0); transform-origin:left } 34%,74%{ transform:scaleX(1); transform-origin:left } 92%,100%{ transform:scaleX(0); transform-origin:right } }
/* CTA */
.ijb-cta{ flex:0 0 auto; position:relative; overflow:hidden; display:inline-flex; align-items:center; gap:12px;
  padding:12px 24px; border-radius:50px; white-space:nowrap; text-decoration:none; font-weight:800; font-size:14px;
  color:#fff; background:linear-gradient(120deg,#8cc63f,#6fb62e); box-shadow:0 14px 30px -10px rgba(140,198,63,.7);
  transition:transform .25s ease, box-shadow .25s ease; }
.ijb-cta:hover{ transform:translateY(-3px); box-shadow:0 20px 42px -10px rgba(140,198,63,.9); color:#fff; }
.ijb-cta i{ transition:transform .25s ease; }
.ijb-cta:hover i{ transform:translateX(5px); }
.ijb-shine{ position:absolute; top:0; left:-60%; width:38%; height:100%; transform:skewX(-20deg);
  background:linear-gradient(100deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.55) 50%, rgba(255,255,255,0) 100%);
  animation:ijbShine 3.4s ease-in-out infinite; }
@keyframes ijbShine{ 0%{ left:-60% } 55%,100%{ left:140% } }
@media (max-width:767px){
  .ifcar-job-boost{ padding:26px 22px; }
  .ijb-lines{ display:none; }
  .ijb-inner{ flex-direction:column; text-align:center; gap:18px; }
  .ijb-eyebrow{ justify-content:center; }
  .ijb-title{ font-size:19px; }
}

/* ===== HOME contact section (replaces .home-blog-area "Un besoin ? Une demande ?") ===== */
.ifcar-hcontact-area{ background:#eef3f9 !important; }
.ifcar-hcontact-area::before, .ifcar-hcontact-area::after{ display:none !important; content:none !important; }
.ifcar-hcontact{ display:grid; grid-template-columns:.92fr 1.08fr; gap:40px; align-items:stretch; }
/* left */
.hc-left{ position:relative; opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; }
.ifcar-hcontact.in .hc-left{ opacity:1; transform:none; }
.hc-dots{ position:absolute; top:-6px; left:-8px; width:120px; height:96px; opacity:.5; pointer-events:none; background-image:radial-gradient(rgba(28,154,214,.5) 1.5px, transparent 1.6px); background-size:15px 15px; animation:c2Dots 6s ease-in-out infinite; }
.hc-eyebrow{ display:inline-block; color:#6fb62e; font-weight:800; letter-spacing:.14em; text-transform:uppercase; font-size:13px; margin-bottom:14px; position:relative; z-index:1; }
.hc-title{ color:#0c2244; font-size:36px; line-height:1.15; font-weight:800; margin:0 0 16px; position:relative; z-index:1; }
.hc-underline{ display:block; width:60px; height:4px; border-radius:4px; background:#8cc63f; margin-bottom:20px; }
.hc-sub{ color:#5b6b7f; font-size:15px; line-height:1.7; margin:0 0 26px; max-width:440px; }
.hc-card{ background:#fff; border-radius:18px; padding:8px 24px; box-shadow:0 22px 50px -30px rgba(12,34,68,.35); }
.hc-list{ list-style:none; margin:0; padding:0; }
.hc-list li{ display:flex; align-items:center; gap:16px; padding:15px 0; border-bottom:1px solid #eef2f7; }
.hc-list li:last-child{ border-bottom:0; }
.hc-ic{ flex:0 0 auto; width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#8cc63f,#6fb62e); box-shadow:0 8px 16px -6px rgba(140,198,63,.6); transition:transform .25s; }
.hc-list li:hover .hc-ic{ transform:scale(1.08); }
.hc-ic i{ color:#fff; font-size:17px; }
.hc-list b{ display:block; color:#8fa0b4; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; margin-bottom:2px; }
.hc-list div>span{ color:#0c2244; font-size:14.5px; font-weight:600; }
.hc-callback{ display:flex; align-items:center; gap:16px; margin-top:20px; padding:20px 24px; border-radius:16px; background:linear-gradient(120deg,#0a1e3d,#0c2748); box-shadow:0 20px 46px -24px rgba(10,30,61,.6); }
.hc-cb-ic{ flex:0 0 auto; width:48px; height:48px; border-radius:50%; background:rgba(140,198,63,.16); display:flex; align-items:center; justify-content:center; color:#8cc63f; font-size:19px; animation:c2Bob 3s ease-in-out infinite; }
.hc-cb-txt{ flex:1 1 auto; min-width:0; }
.hc-cb-txt b{ display:block; color:#fff; font-size:15px; font-weight:700; }
.hc-cb-txt span{ display:block; color:#a9b7cc; font-size:12.5px; margin-top:2px; }
.hc-cb-btn{ flex:0 0 auto; display:inline-flex; align-items:center; gap:8px; background:#fff; color:#0c2244; font-weight:800; font-size:13.5px; padding:11px 20px; border-radius:50px; text-decoration:none; white-space:nowrap; transition:transform .2s, box-shadow .2s; }
.hc-cb-btn:hover{ transform:translateY(-2px); box-shadow:0 12px 24px -8px rgba(0,0,0,.35); color:#0c2244; }
.hc-cb-btn i{ transition:transform .2s; }
.hc-cb-btn:hover i{ transform:translateX(4px); }
/* right white card (reuses .c2-form* field styles) */
.hc-right{ background:#fff; border-radius:24px; padding:44px 42px; box-shadow:0 34px 80px -44px rgba(12,34,68,.42); opacity:0; transform:translateY(26px); transition:opacity .7s ease .14s, transform .7s ease .14s; }
.ifcar-hcontact.in .hc-right{ opacity:1; transform:none; }
.hc-form-ic{ flex:0 0 auto; position:relative; width:64px; height:64px; border-radius:50%; background:#eaf5db; display:flex; align-items:center; justify-content:center; }
.hc-form-ic::before{ content:""; position:absolute; inset:-6px; border-radius:50%; border:1.5px dashed #b9d98c; animation:ijbSpin 12s linear infinite; }
.hc-form-ic i{ color:#6fb62e; font-size:24px; animation:hcPlane 3s ease-in-out infinite; }
@keyframes hcPlane{ 0%,100%{ transform:translate(0,0) rotate(0) } 50%{ transform:translate(2px,-4px) rotate(-8deg) } }
.hc-actions{ display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.hc-note{ display:flex; align-items:center; gap:12px; max-width:280px; color:#8090a3; font-size:12.5px; line-height:1.5; }
.hc-note-ic{ flex:0 0 auto; width:46px; height:46px; border-radius:50%; background:#eef7e3; display:flex; align-items:center; justify-content:center; color:#8cc63f; font-size:18px; }
/* entrance stagger for the contact rows */
.ifcar-hcontact.in .hc-list li{ animation:c2ItemIn .5s ease backwards; }
.ifcar-hcontact.in .hc-list li:nth-child(1){ animation-delay:.28s }
.ifcar-hcontact.in .hc-list li:nth-child(2){ animation-delay:.35s }
.ifcar-hcontact.in .hc-list li:nth-child(3){ animation-delay:.42s }
.ifcar-hcontact.in .hc-list li:nth-child(4){ animation-delay:.49s }
.ifcar-hcontact.in .hc-list li:nth-child(5){ animation-delay:.56s }
.ifcar-hcontact.in .hc-list li:nth-child(6){ animation-delay:.63s }
@media (max-width:991px){
  .ifcar-hcontact{ grid-template-columns:1fr; gap:30px; }
  .hc-right{ padding:36px 26px; }
  .hc-title{ font-size:30px; }
  .hc-actions{ flex-direction:column; align-items:flex-start; }
  .c2-grid{ grid-template-columns:1fr; }
}

/* ===== HOME new hero — DARK navy design (mockup) ===== */
html.ifcar-home .ifcar-hero3-area{ background:radial-gradient(1100px 560px at 14% 24%, #163470 0%, rgba(22,52,112,0) 60%), linear-gradient(135deg,#0a1830 0%,#0c2244 55%,#091428 100%) !important; }
.ifcar-hero3-area{ position:relative; overflow:hidden; }
.ifcar-hero3-area::before{ display:block !important; content:"" !important; position:absolute; left:-170px; top:-170px; width:540px; height:540px; border-radius:50%; border:1px solid rgba(120,170,235,.13); box-shadow:0 0 0 62px rgba(120,170,235,.045); pointer-events:none; }
.ifcar-hero3-area::after{ display:none !important; content:none !important; }
.ifcar-hero3{ position:relative; padding:150px 0 70px; z-index:1; }
.ifcar-hero3 .container{ max-width:1240px; }
.h3-grid{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
/* left */
.h3-left{ opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; }
.ifcar-hero3.in .h3-left{ opacity:1; transform:none; }
.h3-eyebrow{ display:inline-flex; align-items:center; gap:16px; color:#aeb9cc; font-weight:800; letter-spacing:.18em; text-transform:uppercase; font-size:13px; margin-bottom:16px; }
.h3-eyebrow::after{ content:""; width:46px; height:3px; border-radius:3px; background:linear-gradient(90deg,#8cc63f,#6fb62e); }
.h3-title{ color:#ffffff; font-size:48px; line-height:1.12; font-weight:800; letter-spacing:-.01em; margin:0 0 20px; }
.h3-accent{ background:linear-gradient(90deg,#1c9ad6 0%,#48b3ec 45%,#8cc63f 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.h3-underline{ display:block; width:70px; height:4px; border-radius:4px; background:linear-gradient(90deg,#1c9ad6,#8cc63f); margin-bottom:24px; }
.h3-sub{ color:#c2cee0; font-size:16px; line-height:1.8; max-width:530px; margin:0 0 34px; }
.h3-sub b{ color:#ffffff; font-weight:700; }
.h3-stats{ display:flex; flex-wrap:wrap; gap:20px 0; }
.h3-stat{ display:flex; align-items:center; gap:12px; padding:0 20px; }
.h3-stat:first-child{ padding-left:0; }
.h3-stat:not(:last-child){ border-right:1px solid rgba(255,255,255,.12); }
.h3-stat-ic{ flex:0 0 auto; width:48px; height:48px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:21px; color:#fff; box-shadow:0 12px 26px -12px rgba(0,0,0,.65); }
.h3-stat-ic.blue{ background:linear-gradient(135deg,#1c9ad6,#178bc4); }
.h3-stat-ic.green{ background:linear-gradient(135deg,#8cc63f,#5fa021); }
.h3-stat-t b{ display:block; font-size:25px; font-weight:800; color:#ffffff; line-height:1; }
.h3-stat-t span{ display:block; color:#9fb0c8; font-size:13px; margin-top:4px; }
/* right */
.h3-right{ opacity:0; transform:translateX(30px); transition:opacity .8s ease .12s, transform .8s ease .12s; }
.ifcar-hero3.in .h3-right{ opacity:1; transform:none; }
.h3-conf{ position:relative; text-align:center; color:#ffffff; font-size:30px; font-weight:800; margin:0 0 36px; text-transform:uppercase; letter-spacing:.04em; }
.h3-conf span{ background:linear-gradient(90deg,#1c9ad6,#8cc63f); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.h3-conf::after{ content:""; display:block; width:64px; height:4px; border-radius:4px; background:linear-gradient(90deg,#1c9ad6,#8cc63f); margin:15px auto 0; }
.h3-refs{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.h3-ref{ position:relative; display:flex; flex-direction:column; align-items:center; }
.h3-ref:not(:last-child)::before{ content:""; position:absolute; right:-10px; top:2px; height:120px; width:1px; background:rgba(255,255,255,.13); }
.h3-ref-ic{ display:flex; align-items:center; justify-content:center; height:46px; margin-bottom:12px; font-size:32px; }
.ifcar-hero3 .h3-ref-ic i{ background:linear-gradient(135deg,#1c9ad6,#8cc63f); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent !important; }
.h3-ref-cat{ text-align:center; color:#d8e2f0; font-weight:700; font-size:12px; line-height:1.35; margin-bottom:20px; min-height:34px; text-transform:uppercase; letter-spacing:.02em; display:flex; align-items:flex-start; justify-content:center; }
.h3-ref-circle{ position:relative; width:100%; aspect-ratio:1/1; border-radius:50%; background:#fff; overflow:hidden; box-shadow:0 22px 48px -18px rgba(0,0,0,.6); }
.h3-ref-circle::before{ content:""; position:absolute; inset:0; border-radius:50%; padding:3px; background:linear-gradient(135deg,#1c9ad6,#8cc63f); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; z-index:4; pointer-events:none; }
.h3-ref-ring{ display:none !important; }
/* ---- logos rotate as faces of a 3D cube/prism, centred inside the circle ---- */
.h3-ref-circle .ifcar-cube3{ position:absolute !important; top:50% !important; left:50% !important; width:74% !important; height:74% !important; transform:translate(-50%,-50%) !important; z-index:2; perspective:620px; }
.ifcar-cube3-in{ position:relative; width:100%; height:100%; transform-style:preserve-3d; }
.ic3-fc{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.ic3-fc img, .ic3-fc > *{ max-width:92% !important; max-height:76% !important; width:auto !important; height:auto !important; object-fit:contain; margin:auto !important; }
/* ALL circles rotate on the SAME 3s beat (da9a wahda): they start together (no delay)
   and every flip lands on a 3s boundary, so the 3 columns turn simultaneously. */
.ifcar-cube3.n2 .ic3-fc:nth-child(1){ transform:rotateY(0deg); }
.ifcar-cube3.n2 .ic3-fc:nth-child(2){ transform:rotateY(180deg); }
.ifcar-cube3.n2 .ifcar-cube3-in{ animation:ic3flip 6s cubic-bezier(.66,0,.34,1) infinite; }
@keyframes ic3flip{ 0%,40%{transform:rotateY(0deg)} 50%,90%{transform:rotateY(180deg)} 100%{transform:rotateY(360deg)} }
.ifcar-cube3.n3 .ic3-fc:nth-child(1){ transform:rotateY(0deg)   translateZ(34px); }
.ifcar-cube3.n3 .ic3-fc:nth-child(2){ transform:rotateY(120deg) translateZ(34px); }
.ifcar-cube3.n3 .ic3-fc:nth-child(3){ transform:rotateY(240deg) translateZ(34px); }
.ifcar-cube3.n3 .ifcar-cube3-in{ animation:ic3spin 9s cubic-bezier(.66,0,.34,1) infinite; }
@keyframes ic3spin{ 0%,26.6%{transform:rotateY(0deg)} 33.3%,60%{transform:rotateY(-120deg)} 66.6%,93.3%{transform:rotateY(-240deg)} 100%{transform:rotateY(-360deg)} }
/* >3 logos : même flip, mais piloté en JS (setupLogoSeq) sur 2 faces recyclées, pour
   enchaîner une liste illimitée de logos avec une durée propre à chacun. */
.ifcar-seq .ifcar-cube3-in{ transition:transform .8s cubic-bezier(.66,0,.34,1); }
/* Zone d'affichage élargie (les PNG sont détourés au plus près, sans marge interne).
   Le wrapper occupe toute la face et centre le logo ; la TAILLE du logo est posée en
   inline par fitSeqLogo() (même aire optique pour tous), d'où les max-* neutralisés. */
.h3-ref-circle .ifcar-seq, .ifcar-trust-circle .ifcar-seq{ width:86% !important; height:86% !important; }
.ifcar-seq .ic3-fc{ display:flex !important; align-items:center !important; justify-content:center !important; }
.ifcar-seq .ic3-fc .ifcar-logo{ width:100% !important; height:100% !important; max-width:none !important; max-height:none !important; margin:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; }
.ifcar-seq .ic3-fc .ifcar-logo-img{ max-width:none !important; max-height:none !important; margin:0 !important; object-fit:contain; }
.ifcar-seq .ic3-fc.sq-a{ transform:rotateY(0deg); }
.ifcar-seq .ic3-fc.sq-b{ transform:rotateY(180deg); }
@media (prefers-reduced-motion:reduce){ .ifcar-cube3-in{ animation:none !important; } .ifcar-seq .ifcar-cube3-in{ transition:none !important; } }
/* Remove the scroll-to-top progress button on every page */
.to-top-progress{ display:none !important; }
/* Topbar rebuilt as one full-width flex row: left = email + mobile + Fixe + Fax,
   right = social icons + language switcher. Everything stays on one visible line. */
.top-bar-area .container{ max-width:100% !important; width:100% !important; padding-left:30px !important; padding-right:30px !important; }
.top-bar-area .container > .row{ position:relative !important; display:flex !important; flex-wrap:nowrap !important; align-items:center !important; width:100% !important; margin:0 !important; min-height:44px; }
.top-bar-area .container > .row > [class*="col-xl-6"]{ flex:0 1 auto !important; min-width:0 !important; max-width:calc(100% - 230px) !important; width:auto !important; margin:0 !important; padding-left:270px !important; padding-right:0 !important; }
/* pin the social + language switcher to the right edge so they always stay on-screen.
   home/home2 use col-xl-3; the 15 inner pages use col-lg-5 for the same (right) column. */
.top-bar-area .container > .row > [class*="col-xl-3"],
.top-bar-area .container > .row > [class*="col-lg-5"]{ position:absolute !important; right:0 !important; top:50% !important; transform:translateY(-50%) !important; flex:0 0 auto !important; max-width:none !important; width:auto !important; margin:0 !important; padding:0 !important; }
.top-bar-area .item-flex{ display:flex !important; flex-wrap:nowrap !important; justify-content:flex-start !important; gap:20px; align-items:center; }
.top-bar-area .item-flex li{ white-space:nowrap; margin-left:0 !important; }
.top-bar-area .item-flex li i{ font-size:15px !important; margin-right:8px !important; }
.top-bar-area .social ul{ display:flex; align-items:center; gap:14px; margin:0; }
.top-bar-area .social li{ margin-left:0 !important; }
/* ===== Sticky "Ils nous font confiance" trust badge (recrutement sector pages) ===== */
/* Floating card that stays visible through the whole scroll, showing the sector's
   client logos with the SAME rotating cube animation as the Accueil. */
.ifcar-trust{ position:fixed; right:24px; bottom:24px; z-index:1200; width:158px; background:#fff; border-radius:20px; padding:15px 13px 17px; text-align:center; box-shadow:0 26px 60px -20px rgba(12,34,68,.45), 0 0 0 1px #eef2f7; opacity:0; transform:translateY(22px) scale(.94); transition:opacity .6s ease, transform .6s cubic-bezier(.2,.85,.25,1); }
.ifcar-trust.in{ opacity:1; transform:none; }
.ifcar-trust-t{ display:block; font-size:11px; font-weight:800; letter-spacing:.07em; line-height:1.4; text-transform:uppercase; margin-bottom:12px; background:linear-gradient(90deg,#1c9ad6,#62C414); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.ifcar-trust-circle{ position:relative; width:116px; height:116px; margin:0 auto; border-radius:50%; background:#fff; overflow:hidden; box-shadow:0 14px 30px -16px rgba(12,34,68,.42), inset 0 0 0 1px #f0f4f9; }
.ifcar-trust-circle::after{ content:""; position:absolute; inset:0; border-radius:50%; padding:3px; background:linear-gradient(135deg,#1c9ad6,#62C414); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; z-index:3; pointer-events:none; }
.ifcar-trust-circle .ifcar-cube3{ position:absolute !important; top:50% !important; left:50% !important; width:74% !important; height:74% !important; transform:translate(-50%,-50%) !important; z-index:2; perspective:620px; }
.ifcar-trust-close{ position:absolute; top:-9px; right:-9px; width:23px; height:23px; border-radius:50%; border:none; background:#fff; box-shadow:0 5px 14px -3px rgba(12,34,68,.4); color:#5b6b7f; font-size:15px; line-height:1; cursor:pointer; display:grid; place-items:center; z-index:5; transition:transform .25s ease, color .25s ease; }
.ifcar-trust-close:hover{ transform:scale(1.14); color:#1c9ad6; }
@media (max-width:1050px){ .ifcar-trust{ width:132px; right:16px; bottom:16px; padding:12px 10px 14px; } .ifcar-trust-circle{ width:98px; height:98px; } .ifcar-trust-t{ font-size:10px; } }
@media (max-width:640px){ .ifcar-trust{ display:none !important; } }
/* header: dark menu text over the light home hero */
html.ifcar-home nav.navbar .navbar-nav > li > a{ color:#0c2244 !important; }
html.ifcar-home nav.navbar .navbar-nav > li.active > a{ color:#1c9ad6 !important; }
/* responsive */
@media (max-width:991px){
  .ifcar-hero3{ padding:140px 0 50px; }
  .h3-grid{ grid-template-columns:1fr; gap:42px; }
  .h3-title{ font-size:36px; }
}
@media (max-width:575px){
  .h3-title{ font-size:28px; }
  .h3-refs{ gap:10px; }
  .h3-ref-cat{ font-size:10.5px; min-height:44px; }
  .h3-stats{ gap:18px; }
}

/* ===== HOME hero fixes (constrain container, colors, circle size) ===== */
.ifcar-hero3-area{ min-height:auto !important; height:auto !important; }
.ifcar-hero3 > .container{ max-width:1240px !important; width:100% !important; margin-left:auto !important; margin-right:auto !important; padding-left:15px; padding-right:15px; }
.h3-left, .h3-right{ min-width:0; }
.ifcar-hero3 .h3-title, .ifcar-hero3 .h3-title *{ color:#0c2244 !important; }
.ifcar-hero3 .h3-accent{ color:#6fb62e !important; }
/* "ILS NOUS FONT CONFIANCE" -> match "NOS DOMAINES D'EXPERTISE": all navy, ExtraBold 800 */
.ifcar-hero3 .h3-conf{ color:#0c2244 !important; font-weight:800 !important; letter-spacing:.02em !important; }
.ifcar-hero3 .h3-conf span{ color:#6fb62e !important; -webkit-text-fill-color:#6fb62e !important; }
.ifcar-hero3 .h3-eyebrow{ color:#6fb62e !important; }
.ifcar-hero3 .h3-ref-cat{ color:#173a6b !important; }
.ifcar-hero3 .h3-sub{ color:#5b6b7f !important; }
.ifcar-hero3 .h3-sub b{ color:#0c2244 !important; }
.ifcar-hero3 .h3-stat-t b{ color:#0c2244 !important; }
.ifcar-hero3 .h3-stat-t span{ color:#7a889b !important; }
.h3-refs{ align-items:start; }
.h3-ref-circle{ max-width:195px; margin:0 auto; }

/* ===== HOME hero fixes v2: round circles, compact stats ===== */
.h3-ref-circle{ width:178px !important; height:178px !important; max-width:100%; aspect-ratio:auto !important; flex:0 0 auto; }
.h3-stats{ gap:16px 26px; }
.h3-stat-ic{ width:42px; height:42px; font-size:18px; border-radius:12px; }
.h3-stat-t b{ font-size:21px; }
.h3-stat-t span{ font-size:12px; }
.h3-conf{ font-size:26px; }
@media (max-width:991px){ .h3-ref-circle{ width:140px !important; height:140px !important; } }
@media (max-width:575px){ .h3-ref-circle{ width:120px !important; height:120px !important; } }

/* ===== HOME hero fixes v3: unhide the confiance h2, stats in one row ===== */
.ifcar-hero3 .h3-conf{ visibility:visible !important; }
.ifcar-hero3 .h3-stats{ display:grid !important; grid-template-columns:repeat(4,1fr); gap:22px 16px; }
.ifcar-hero3 .h3-stat{ align-items:flex-start; }
.ifcar-hero3 .h3-stat-t b{ white-space:nowrap; }
@media (max-width:575px){ .ifcar-hero3 .h3-stats{ grid-template-columns:repeat(2,1fr); } }

/* ===== HOME hero fixes v4: force the confiance heading fully visible ===== */
.ifcar-hero3 .h3-conf{ opacity:1 !important; transform:none !important; visibility:visible !important; font-size:26px !important; line-height:1.25 !important; }

/* ===== HOME "Nos services" (4 cards, injected after the hero) ===== */
.ifcar-svc4-area{ background:#fff; position:relative; padding-bottom:40px !important; }
/* navy wave under the cards removed */
.ifcar-svc4-area::after{ display:none !important; }
.ifcar-svc4{ position:relative; z-index:1; }
.svc4-head{ text-align:center; margin-bottom:44px; }
.svc4-title{ color:#0c2244; font-size:34px; font-weight:800; margin:0; }
.svc4-title span{ color:#6fb62e; }
.svc4-underline{ display:inline-block; width:56px; height:4px; border-radius:4px; background:#8cc63f; margin-top:14px; }
.svc4-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
.svc4-card{ position:relative; background:#fff; border:1px solid #eaf0f7; border-radius:18px; padding:32px 26px 28px; box-shadow:0 18px 44px -30px rgba(12,34,68,.4); transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  opacity:0; transform:translateY(28px); }
.ifcar-svc4.in .svc4-card{ opacity:1; transform:none; transition:opacity .6s ease, transform .6s ease, box-shadow .3s ease; }
.ifcar-svc4.in .svc4-card:nth-child(1){ transition-delay:.05s; }
.ifcar-svc4.in .svc4-card:nth-child(2){ transition-delay:.15s; }
.ifcar-svc4.in .svc4-card:nth-child(3){ transition-delay:.25s; }
.ifcar-svc4.in .svc4-card:nth-child(4){ transition-delay:.35s; }
.svc4-card:hover{ transform:translateY(-8px); box-shadow:0 30px 60px -28px rgba(12,34,68,.5); }
.svc4-ic{ display:flex; align-items:center; justify-content:center; width:64px; height:64px; border-radius:50%; margin-bottom:22px; font-size:26px; color:#fff; transition:transform .3s ease; }
.svc4-card:hover .svc4-ic{ transform:translateY(-4px) scale(1.06); }
.svc4-card.blue .svc4-ic{ background:linear-gradient(135deg,#1c3a63,#0c2244); box-shadow:0 12px 24px -8px rgba(12,34,68,.55); }
.svc4-card.green .svc4-ic{ background:linear-gradient(135deg,#8cc63f,#6fb62e); box-shadow:0 12px 24px -8px rgba(140,198,63,.7); }
.svc4-t{ font-size:19px; font-weight:800; margin:0 0 12px; }
.svc4-card.blue .svc4-t{ color:#0c2244; } /* Recrutement + Conseil titles -> navy (same as Conseil) */
.svc4-card.green .svc4-t{ color:#6fb62e; }
/* idea2: 3rd card (Conseil) title in navy */
.svc4-grid .svc4-card:nth-child(3) .svc4-t{ color:#0c2244; }
.svc4-d{ color:#5b6b7f; font-size:14px; line-height:1.7; margin:0 0 20px; }
.svc4-more{ display:inline-flex; align-items:center; gap:8px; font-weight:800; font-size:13.5px; text-decoration:none; }
.svc4-card.blue .svc4-more, .svc4-card.green .svc4-more{ color:#1c9ad6 !important; } /* all "En savoir plus" -> blue */
.svc4-more i{ transition:transform .25s ease; }
.svc4-more:hover i{ transform:translateX(5px); }
@media (max-width:991px){ .svc4-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:575px){ .svc4-grid{ grid-template-columns:1fr; } .svc4-title{ font-size:27px; } }

/* ===== HOME hero v5: unhide paragraph, compact spacing (match v1 mockup) ===== */
.ifcar-hero3 .h3-sub{ visibility:visible !important; }
.ifcar-hero3 .h3-eyebrow, .ifcar-hero3 .h3-title, .ifcar-hero3 .h3-underline, .ifcar-hero3 .h3-stats, .ifcar-hero3 .h3-ref-cat, .ifcar-hero3 .h3-conf, .ifcar-hero3 .svc4-title{ visibility:visible !important; }
.ifcar-hero3{ padding:132px 0 54px !important; }
.ifcar-hero3 .h3-title{ font-size:50px !important; line-height:1.1 !important; margin-bottom:20px !important; max-width:380px; }
.ifcar-hero3 .h3-sub{ margin:0 0 26px !important; }
.ifcar-hero3 .h3-stats{ margin-top:6px; gap:20px 18px; }
.ifcar-hero3 .h3-stat-t span{ font-size:11.5px; line-height:1.3; }
.h3-grid{ align-items:center; }
/* pull "Nos services" up closer to the hero */
.ifcar-svc4-area{ padding-top:56px !important; padding-bottom:70px !important; }
.svc4-head{ margin-bottom:36px; }

/* ===== HOME hero v6: fully reveal the paragraph (template sets opacity:0/transform on banner p) ===== */
.ifcar-hero3 .h3-sub{ opacity:1 !important; transform:none !important; visibility:visible !important; }

/* ===== HOME: fit hero + "Nos services" in one screen (no scroll) ===== */
.ifcar-hero3{ padding:116px 0 26px !important; }
.ifcar-hero3 .h3-eyebrow{ margin-bottom:9px !important; font-size:12px !important; }
.ifcar-hero3 .h3-title{ font-size:35px !important; line-height:1.13 !important; margin-bottom:13px !important; }
.ifcar-hero3 .h3-underline{ margin-bottom:15px !important; width:56px; height:4px; }
.ifcar-hero3 .h3-sub{ font-size:13.5px !important; line-height:1.6 !important; margin:0 0 16px !important; max-width:485px; }
.ifcar-hero3 .h3-stats{ margin-top:2px !important; gap:12px 16px !important; }
.ifcar-hero3 .h3-stat-ic{ width:40px; height:40px; font-size:17px; border-radius:12px; }
.ifcar-hero3 .h3-stat-t b{ font-size:20px; }
.ifcar-hero3 .h3-stat-t span{ font-size:11px; }
.ifcar-hero3 .h3-conf{ font-size:23px !important; margin-bottom:18px !important; }
.ifcar-hero3 .h3-ref-cat{ font-size:11.5px !important; min-height:28px; margin-bottom:10px; }
.h3-ref-circle{ width:126px !important; height:126px !important; }
/* Nos services compact */
.ifcar-svc4-area{ padding-top:30px !important; padding-bottom:34px !important; }
.svc4-head{ margin-bottom:22px !important; }
.svc4-title{ font-size:27px !important; }
.svc4-underline{ margin-top:9px !important; }
.svc4-grid{ gap:18px !important; }
.svc4-card{ padding:20px 20px 18px !important; }
.svc4-ic{ width:50px !important; height:50px !important; font-size:21px !important; margin-bottom:14px !important; }
.svc4-t{ font-size:16.5px !important; margin-bottom:8px !important; }
.svc4-d{ font-size:12.5px !important; line-height:1.55 !important; margin-bottom:12px !important; }
.svc4-more{ font-size:12.5px !important; }

/* ===== HOME: tighten further so the whole "Nos services" is above the fold ===== */
.ifcar-hero3{ padding:82px 0 20px !important; }
.ifcar-hero3 .h3-sub{ margin:0 0 13px !important; }
.ifcar-svc4-area{ padding-top:22px !important; padding-bottom:30px !important; }
.svc4-head{ margin-bottom:16px !important; }
.svc4-d{ margin-bottom:10px !important; }

/* ===== HOME: single uniform background across hero + Nos services (no colour difference) ===== */
html.ifcar-home .ifcar-hero3-area{ background:#eef3f9 !important; }
/* NOS DOMAINES D'EXPERTISE section -> white background */
.ifcar-svc4-area{ background:#ffffff !important; }

/* ===== Compact the Accueil first screen: hero + confiance + NOS DOMAINES fit with no scroll ===== */
html.ifcar-home .ifcar-hero3{ padding:54px 0 14px !important; }
html.ifcar-home .h3-eyebrow{ margin-bottom:7px !important; }
html.ifcar-home .ifcar-hero3 .h3-title{ font-size:40px !important; line-height:1.08 !important; margin-bottom:12px !important; }
html.ifcar-home .h3-underline{ margin-bottom:12px !important; height:4px !important; }
html.ifcar-home .ifcar-hero3 .h3-sub{ font-size:14px !important; line-height:1.5 !important; margin-bottom:16px !important; }
html.ifcar-home .h3-stats{ gap:10px 22px !important; }
html.ifcar-home .h3-stat-ic{ width:38px !important; height:38px !important; font-size:16px !important; }
html.ifcar-home .ifcar-hero3 .h3-conf{ font-size:24px !important; margin-top:0 !important; margin-bottom:26px !important; }
html.ifcar-home .h3-conf::after{ margin-top:11px !important; }
html.ifcar-home .h3-ref-ic{ height:42px !important; font-size:30px !important; margin-bottom:10px !important; }
html.ifcar-home .h3-ref-cat{ min-height:50px !important; margin-bottom:16px !important; font-size:12.5px !important; align-items:flex-start !important; }
html.ifcar-home .h3-ref-circle{ width:162px !important; height:162px !important; }
/* nudge the whole confiance block down to fill the empty space under the circles */
html.ifcar-home .h3-right{ padding-top:10px !important; }
html.ifcar-home .ifcar-svc4-area{ padding-top:8px !important; padding-bottom:12px !important; }
html.ifcar-home .svc4-head{ margin-bottom:14px !important; }
html.ifcar-home .ifcar-hero3 .svc4-title, html.ifcar-home .svc4-title{ font-size:23px !important; }
html.ifcar-home .svc4-underline{ margin-top:10px !important; }
html.ifcar-home .svc4-card{ padding:15px 15px 13px !important; }
html.ifcar-home .svc4-ic{ width:44px !important; height:44px !important; font-size:18px !important; margin-bottom:9px !important; }
html.ifcar-home .svc4-t{ font-size:15px !important; margin-bottom:5px !important; }
html.ifcar-home .svc4-d{ font-size:11.5px !important; line-height:1.45 !important; margin-bottom:9px !important; }
html.ifcar-home .svc4-more{ font-size:12px !important; }

/* width-scaling fills the viewport, so full-width section backgrounds span the screen
   natively — no letterbox / centring hacks needed. */
html.ifcar-home{ overflow-x:hidden; }
html.ifcar-home nav.navbar:not(.sticked){
  left:calc(0px - var(--lb, 0px)) !important;
  width:calc(100% + 2 * var(--lb, 0px)) !important;
}

/* ===== HOME: enlarge + lower the "Ils nous font confiance" block to fill the right column ===== */
.ifcar-hero3 .h3-conf{ font-size:28px !important; margin-top:6px !important; margin-bottom:34px !important; }
.ifcar-hero3 .h3-ref-cat{ font-size:13px !important; min-height:36px; margin-bottom:18px !important; }
.h3-ref-circle{ width:182px !important; height:182px !important; }
.h3-refs{ gap:22px !important; }

/* ===== Header: topbar + logo-box diagonal shape share ONE solid colour ===== */
.top-bar-area.top-bar-style-one, .top-bar-area{ background-color:#0f2338 !important; }
.navbar-header::before{ background-color:#0c2244 !important; }
/* ===== Menu: green underline on hover ===== */
#navbar-menu .navbar-nav > li > a{ position:relative; }
#navbar-menu .navbar-nav > li > a::after{ content:""; position:absolute; left:6px; right:6px; top:50%; bottom:auto; height:2px; border-radius:2px; background:#1c9ad6; transform:translateY(13px) scaleX(0); transform-origin:center; transition:transform .25s ease; }
#navbar-menu .navbar-nav > li:hover > a::after{ transform:translateY(13px) scaleX(1); }
/* uppercase menu + persistent green underline & green text on the active item (idea2 design) */
#navbar-menu .navbar-nav > li > a{ text-transform:uppercase !important; letter-spacing:.01em !important; font-weight:600 !important; }
/* active item = BLUE text + persistent BLUE underline (the .active class sits on the <a>) */
#navbar-menu .navbar-nav > li.active > a::after,
#navbar-menu .navbar-nav > li > a.active::after{ transform:translateY(13px) scaleX(1) !important; background:#1c9ad6 !important; }
#navbar-menu .navbar-nav > li.active > a,
#navbar-menu .navbar-nav > li > a.active,
html.ifcar-home nav.navbar .navbar-nav > li.active > a,
html.ifcar-home nav.navbar .navbar-nav > li > a.active{ color:#1c9ad6 !important; }
/* ===== "Prendre Conseil" button: UPPERCASE + turns green on hover ===== */
.navbar .button > a, nav.navbar .button a{ text-transform:uppercase !important; letter-spacing:.03em !important; }
/* smaller "Prendre Conseil" button (beat the template's high-specificity rule) */
.navbar .attr-right .attr-nav li.button a,
.navbar .button > a, nav.navbar .button a{ font-size:13px !important; padding:10px 24px !important; border-radius:7px !important; }
/* white background behind the menu row (home, non-sticky) */
html.ifcar-home nav.navbar:not(.sticked){ background:#ffffff !important; }
.navbar .button > a{ transition:background-color .25s ease, box-shadow .25s ease !important; }
.navbar .button > a:hover{ background-color:#8cc63f !important; color:#fff !important; }

/* stronger override for the Prendre Conseil button hover (beats template bg) */
html body nav.navbar .button > a:hover,
html body nav.navbar .button a:hover{ background-color:#8cc63f !important; background-image:none !important; color:#fff !important; border-color:#8cc63f !important; }

/* button hover: the expanding ::after fill overlay is what shows on hover -> make it green */
.navbar .button > a::after, .navbar .button a::after{ background:#8cc63f !important; background-color:#8cc63f !important; }
.navbar .button > a:hover, .navbar .button a:hover{ color:#ffffff !important; }

/* ===== HOME: remove NOS DOMAINES D'EXPERTISE + NOS RÉFÉRENCES sections and their decorative shapes ===== */
html.ifcar-home .services-style-one-area,
html.ifcar-home .process-style-one-area{ display:none !important; }
html.ifcar-home .triangle-shape,
html.ifcar-home .center-shape,
html.ifcar-home .large-shape{ display:none !important; }

/* ===== /home2 "Accueil 2": 3-column dashboard hero ===== */
html.ifcar-page-home2 .banner-area.ifcar-h2-area{ background:#eef3f9 !important; min-height:auto !important; height:auto !important; }
html.ifcar-page-home2 .ifcar-h2-area::before, html.ifcar-page-home2 .ifcar-h2-area::after{ display:none !important; content:none !important; }
/* hide every other template section on home2 */
html.ifcar-page-home2 .feature-style-one-area,
html.ifcar-page-home2 .services-style-two-area,
html.ifcar-page-home2 .partner-style-one-area,
html.ifcar-page-home2 .about-style-two-area,
html.ifcar-page-home2 .faq-style-one-area,
html.ifcar-page-home2 .testimonials-style-two-area,
html.ifcar-page-home2 .project-style-two-area,
html.ifcar-page-home2 .contact-style-one-area,
html.ifcar-page-home2 .fun-factor-style-one-area,
html.ifcar-page-home2 .home-blog-area{ display:none !important; }
/* readable dark menu on the light home2 hero */
html.ifcar-page-home2 nav.navbar .navbar-nav > li > a{ color:#0c2244 !important; }
html.ifcar-page-home2 nav.navbar .navbar-nav > li.active > a{ color:#1c9ad6 !important; }
.ifcar-h2{ padding:116px 0 58px; }
.ifcar-h2 .h2-inner{ max-width:1340px; margin:0 auto; padding:0 26px; display:grid; grid-template-columns:.95fr 1.35fr 1fr; gap:28px; align-items:start; }
/* shared eyebrow */
.ifcar-h2 .h2-eyebrow{ display:inline-block; position:relative; font-weight:800; letter-spacing:.14em; text-transform:uppercase; font-size:13px; padding-bottom:12px; margin-bottom:18px; }
.ifcar-h2 .h2-eyebrow.green{ color:#6fb62e; } .ifcar-h2 .h2-eyebrow.blue{ color:#1c9ad6; }
.ifcar-h2 .h2-eyebrow::after{ content:""; position:absolute; left:0; bottom:0; width:30px; height:3px; border-radius:3px; background:currentColor; }
.ifcar-h2 .h2-eyebrow.center{ display:block; text-align:center; }
.ifcar-h2 .h2-eyebrow.center::after{ left:50%; transform:translateX(-50%); }
/* left: WHO WE ARE */
.h2-who{ opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; }
.ifcar-h2.in .h2-who{ opacity:1; transform:none; }
.h2-title{ color:#0c2244; font-size:36px; line-height:1.16; font-weight:800; margin:0 0 18px; }
.h2-title span{ color:#6fb62e; }
.h2-underline{ display:block; width:56px; height:4px; border-radius:4px; background:#8cc63f; margin-bottom:22px; }
.h2-sub{ color:#5b6b7f; font-size:15px; line-height:1.7; margin:0 0 20px; }
.h2-list{ list-style:none; margin:0; padding:0; }
.h2-list li{ display:flex; align-items:center; gap:14px; padding:15px 0; border-bottom:1px solid #e2e8f0; color:#0c2244; font-weight:700; font-size:16px; }
.h2-list li:last-child{ border-bottom:0; }
.h2-li-ic{ flex:0 0 auto; width:34px; text-align:center; color:#6fb62e; font-size:20px; }
/* center: CLIENTS / TRUST */
.h2-clients{ position:relative; overflow:hidden; background:#fff; border-radius:22px; padding:34px 30px; box-shadow:0 30px 70px -40px rgba(12,34,68,.45); opacity:0; transform:translateY(26px); transition:opacity .7s ease .12s, transform .7s ease .12s; }
.ifcar-h2.in .h2-clients{ opacity:1; transform:none; }
.h2-clients::after{ content:""; position:absolute; top:0; left:-45%; width:32%; height:100%; transform:skewX(-20deg); pointer-events:none; background:linear-gradient(100deg,rgba(255,255,255,0),rgba(140,198,63,.10),rgba(255,255,255,0)); animation:h2Shine 6.5s ease-in-out infinite; }
@keyframes h2Shine{ 0%{ left:-45% } 60%,100%{ left:135% } }
.h2-cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:26px; position:relative; z-index:1; }
.h2-col{ text-align:center; }
.h2-cat{ display:block; color:#173a6b; font-weight:700; font-size:12.5px; line-height:1.3; min-height:34px; }
.h2-cat-line{ display:block; width:32px; height:3px; border-radius:3px; background:#e2e8f0; margin:9px auto 18px; }
.h2-circles{ display:flex; flex-direction:column; gap:16px; align-items:center; }
.h2c-circle{ position:relative; width:94px; height:94px; border-radius:50%; background:#fff; overflow:hidden; display:flex; align-items:center; justify-content:center; box-shadow:0 12px 26px -16px rgba(12,34,68,.5), inset 0 0 0 1px #eef2f7; transition:transform .25s, box-shadow .25s; }
.h2c-circle:hover{ transform:translateY(-4px) scale(1.05); box-shadow:0 20px 40px -16px rgba(12,34,68,.6), inset 0 0 0 1px #e2eaf3; }
.h2c-circle img{ max-width:76%; max-height:60%; object-fit:contain; position:relative; z-index:1; }
.h2c-ph{ position:absolute; color:#cbd6e4; font-size:26px; z-index:0; }
.ifcar-h2.in .h2c-circle{ animation:h2Pop .5s ease backwards; }
.ifcar-h2.in .h2-col:nth-child(1) .h2c-circle:nth-child(1){ animation-delay:.30s } .ifcar-h2.in .h2-col:nth-child(1) .h2c-circle:nth-child(2){ animation-delay:.38s } .ifcar-h2.in .h2-col:nth-child(1) .h2c-circle:nth-child(3){ animation-delay:.46s } .ifcar-h2.in .h2-col:nth-child(1) .h2c-circle:nth-child(4){ animation-delay:.54s }
.ifcar-h2.in .h2-col:nth-child(2) .h2c-circle:nth-child(1){ animation-delay:.38s } .ifcar-h2.in .h2-col:nth-child(2) .h2c-circle:nth-child(2){ animation-delay:.46s } .ifcar-h2.in .h2-col:nth-child(2) .h2c-circle:nth-child(3){ animation-delay:.54s } .ifcar-h2.in .h2-col:nth-child(2) .h2c-circle:nth-child(4){ animation-delay:.62s }
.ifcar-h2.in .h2-col:nth-child(3) .h2c-circle:nth-child(1){ animation-delay:.46s } .ifcar-h2.in .h2-col:nth-child(3) .h2c-circle:nth-child(2){ animation-delay:.54s } .ifcar-h2.in .h2-col:nth-child(3) .h2c-circle:nth-child(3){ animation-delay:.62s } .ifcar-h2.in .h2-col:nth-child(3) .h2c-circle:nth-child(4){ animation-delay:.70s }
@keyframes h2Pop{ from{ opacity:0; transform:scale(.7) } to{ opacity:1; transform:none } }
/* right: NOS SERVICES */
.h2-services{ opacity:0; transform:translateY(26px); transition:opacity .7s ease .24s, transform .7s ease .24s; }
.ifcar-h2.in .h2-services{ opacity:1; transform:none; }
.h2-svc-list{ display:flex; flex-direction:column; gap:15px; margin-top:20px; }
.h2-svc-card{ display:flex; align-items:center; gap:15px; background:#fff; border-radius:16px; padding:18px 20px; box-shadow:0 20px 46px -32px rgba(12,34,68,.42); text-decoration:none; transition:transform .25s, box-shadow .25s; }
.h2-svc-card:hover{ transform:translateY(-4px); box-shadow:0 28px 56px -30px rgba(12,34,68,.5); }
.h2-svc-ic{ flex:0 0 auto; width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:22px; }
.h2-svc-card.blue .h2-svc-ic{ background:linear-gradient(135deg,#1c9ad6,#166fb8); }
.h2-svc-card.green .h2-svc-ic{ background:linear-gradient(135deg,#8cc63f,#6fb62e); }
.h2-svc-t{ flex:1 1 auto; min-width:0; }
.h2-svc-t h4{ margin:0 0 5px; font-size:16px; font-weight:800; }
.h2-svc-card.blue .h2-svc-t h4{ color:#1c9ad6; } .h2-svc-card.green .h2-svc-t h4{ color:#6fb62e; }
.h2-svc-t p{ margin:0; color:#5b6b7f; font-size:12.5px; line-height:1.55; }
.h2-svc-arw{ flex:0 0 auto; color:#9aa7b8; transition:transform .25s, color .25s; }
.h2-svc-card:hover .h2-svc-arw{ transform:translateX(5px); }
.h2-svc-card.blue:hover .h2-svc-arw{ color:#1c9ad6; } .h2-svc-card.green:hover .h2-svc-arw{ color:#6fb62e; }
/* responsive */
@media (max-width:1100px){ .ifcar-h2 .h2-inner{ grid-template-columns:1fr; gap:34px; } .ifcar-h2{ padding:130px 0 50px; } }
@media (max-width:575px){ .h2-cols{ grid-template-columns:1fr; } .h2-title{ font-size:30px; } .h2c-circle{ width:84px; height:84px; } }

/* ===== home2 fixes: reveal hidden title/text, force round logo circles ===== */
.ifcar-h2 .h2-title, .ifcar-h2 .h2-sub, .ifcar-h2 .h2-list, .ifcar-h2 .h2-list li,
.ifcar-h2 h2, .ifcar-h2 h4, .ifcar-h2 p{ visibility:visible !important; opacity:1 !important; transform:none !important; }
.h2c-circle{ width:94px !important; height:94px !important; aspect-ratio:1/1 !important; flex:0 0 auto; }
@media (max-width:575px){ .h2c-circle{ width:84px !important; height:84px !important; } }

/* ===== home2 header parity with the main Accueil (topbar injected + navbar below it) ===== */
html.ifcar-page-home2 nav.navbar:not(.sticked){ top:50px !important; }
html.ifcar-page-home2 nav.navbar li.contact{ display:none !important; }

/* home2 injected topbar = fixed overlay so it never disturbs the navbar DOM/layout */

/* home2: push hero content below the fixed topbar (50) + navbar (~88) */
html.ifcar-page-home2 .ifcar-h2{ padding-top:150px !important; }

/* ===== home2 header: match the main Accueil's white-box + logo exactly ===== */
html.ifcar-page-home2 .navbar-header::before,
html.ifcar-page-home2 .navbar-header::after{ height:104px !important; }
html.ifcar-page-home2 nav.navbar .logo{ position:relative !important; top:-48px !important; }

/* home2 topbar = absolute overlay at document top (scrolls away; no flow push, robust) */
html.ifcar-page-home2 .ifcar-h2-topbar{ position:absolute !important; top:0 !important; left:0 !important; right:0 !important; width:100% !important; z-index:20 !important; }

/* home2: sticky navbar sits flush at the top like the main Accueil */
html.ifcar-page-home2 nav.navbar.sticked{ top:0 !important; }

/* home2: keep the navbar in place (absolute) so it scrolls away cleanly — no floating sticky bar */
html.ifcar-page-home2 nav.navbar,
html.ifcar-page-home2 nav.navbar.sticked{ position:absolute !important; top:50px !important; box-shadow:none !important; }

/* home2: force the white logo box + slate shape via stable selectors (independent of any class revert) */
html.ifcar-page-home2 .navbar-header::after{ background:#ffffff !important; }
html.ifcar-page-home2 .navbar-header::before{ background:#0c2244 !important; }

/* ===== home2 header: STATIC FLOW (bulletproof) — topbar + navbar stack in normal flow, zero absolute positioning ===== */
html.ifcar-page-home2 .ifcar-h2-topbar{ position:static !important; width:auto !important; z-index:auto !important; }
html.ifcar-page-home2 nav.navbar,
html.ifcar-page-home2 nav.navbar.sticked,
html.ifcar-page-home2 nav.navbar:not(.sticked){ position:static !important; top:auto !important; left:auto !important; right:auto !important; transform:none !important; box-shadow:none !important; }
html.ifcar-page-home2 nav.navbar .logo{ position:relative !important; top:0 !important; }
html.ifcar-page-home2 .ifcar-h2{ padding-top:34px !important; }

/* ===== home2: header (topbar + logo + menu) removed per request — content only ===== */
html.ifcar-page-home2 .top-bar-area,
html.ifcar-page-home2 .ifcar-h2-topbar,
html.ifcar-page-home2 nav.navbar,
html.ifcar-page-home2 header{ display:none !important; }
html.ifcar-page-home2 .ifcar-h2{ padding-top:56px !important; }

/* ===== home2: hide the floating lang switcher + animated "back to Accueil" home button ===== */
html.ifcar-page-home2 #lang-switcher{ display:none !important; }
.ifcar-h2-home{ position:fixed; top:22px; right:26px; z-index:200; display:inline-flex; align-items:center; height:56px; border-radius:50px; text-decoration:none; overflow:hidden;
  background:linear-gradient(135deg,#1c9ad6,#166fb8); color:#fff !important; box-shadow:0 14px 32px -8px rgba(28,154,214,.7);
  transition:box-shadow .3s ease, transform .3s ease; }
.ifcar-h2-home i{ flex:0 0 auto; width:56px; height:56px; display:flex; align-items:center; justify-content:center; font-size:21px; transition:transform .35s ease; }
.ifcar-h2-home .ifcar-h2-home-t{ max-width:0; opacity:0; white-space:nowrap; font-weight:800; font-size:15px; letter-spacing:.01em; overflow:hidden; transition:max-width .32s ease, opacity .32s ease, padding .32s ease; }
.ifcar-h2-home:hover{ transform:translateY(-3px); box-shadow:0 20px 44px -8px rgba(28,154,214,.92); color:#fff !important; }
.ifcar-h2-home:hover .ifcar-h2-home-t{ max-width:130px; opacity:1; padding-right:24px; }
.ifcar-h2-home:hover i{ transform:scale(1.12) rotate(-6deg); }
.ifcar-h2-home::before{ content:""; position:absolute; inset:0; border-radius:50px; pointer-events:none; animation:ifcarHomePulse 2.2s ease-out infinite; }
@keyframes ifcarHomePulse{ 0%{ box-shadow:0 0 0 0 rgba(28,154,214,.5) } 70%,100%{ box-shadow:0 0 0 18px rgba(28,154,214,0) } }
@media (max-width:575px){ .ifcar-h2-home{ top:14px; right:14px; height:50px; } .ifcar-h2-home i{ width:50px; height:50px; } }

/* ================= MOBILE — Accueil (match the mockup) ================= */
@media (max-width:767px){
  /* hero: centered */
  .ifcar-hero3 .h3-grid{ text-align:center; }
  .ifcar-hero3 .h3-left{ text-align:center; }
  .ifcar-hero3 .h3-eyebrow{ display:inline-block; }
  .ifcar-hero3 .h3-title{ font-size:33px !important; }
  .ifcar-hero3 .h3-underline{ margin-left:auto !important; margin-right:auto !important; }
  .ifcar-hero3 .h3-sub{ margin-left:auto !important; margin-right:auto !important; max-width:100% !important; }
  /* stats: 4 across, icon stacked on top, centered, with dividers */
  .ifcar-hero3 .h3-stats{ display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:0 !important; margin-top:22px; }
  .ifcar-hero3 .h3-stat{ flex-direction:column !important; align-items:center !important; text-align:center; gap:8px; padding:4px 6px; }
  .ifcar-hero3 .h3-stat + .h3-stat{ border-left:1px solid #dbe4ef; }
  .ifcar-hero3 .h3-stat-ic{ width:44px !important; height:44px !important; font-size:19px !important; }
  .ifcar-hero3 .h3-stat-t{ min-width:0; }
  .ifcar-hero3 .h3-stat-t b{ font-size:18px !important; white-space:nowrap; }
  .ifcar-hero3 .h3-stat-t span{ font-size:10px !important; line-height:1.25; }
  /* confiance: 3 circles across (fit the width) */
  .ifcar-hero3 .h3-conf{ text-align:center; margin-top:34px; }
  .ifcar-hero3 .h3-refs{ grid-template-columns:repeat(3,1fr) !important; gap:8px !important; }
  .ifcar-hero3 .h3-ref-circle{ width:100% !important; height:auto !important; max-width:110px; aspect-ratio:1/1 !important; }
  .ifcar-hero3 .h3-ref-cat{ font-size:10px !important; min-height:40px; }
  /* Nos services: 2 x 2 grid */
  .svc4-grid{ grid-template-columns:1fr 1fr !important; gap:14px !important; }
  .svc4-card{ padding:18px 16px 16px !important; }
  .svc4-ic{ width:46px !important; height:46px !important; font-size:19px !important; }
  .svc4-t{ font-size:15px !important; }
  .svc4-d{ font-size:12px !important; }
}

/* ================= MOBILE — header (logo left + button + hamburger right) ================= */
@media (max-width:767px){
  nav.navbar{ position:relative !important; top:0 !important; min-height:66px; background:#fff !important; }
  nav.navbar .container{ display:block !important; width:100% !important; max-width:100% !important; }
  nav.navbar .navbar-header{ position:static !important; display:block !important; height:66px; }
  nav.navbar .navbar-header::before, nav.navbar .navbar-header::after{ display:none !important; }
  /* logo left (force over the desktop "poke-up" rules) */
  nav.navbar .navbar-header .navbar-brand{ position:absolute !important; left:14px !important; top:11px !important; right:auto !important; bottom:auto !important; transform:none !important; margin:0 !important; padding:0 !important; width:auto !important; }
  nav.navbar .navbar-header .navbar-brand img.logo{ height:44px !important; width:auto !important; max-width:160px !important; object-fit:contain; object-position:left center; position:static !important; top:auto !important; left:auto !important; transform:none !important; }
  /* hamburger far right */
  nav.navbar .navbar-header .navbar-toggle{ position:absolute !important; right:14px; top:16px; background:transparent; border:0; font-size:24px; color:#0c2244; padding:2px 4px; z-index:3; }
  /* CTA before the hamburger */
  nav.navbar .navbar-header .ifcar-m-cta{ position:absolute !important; right:58px; top:16px; display:inline-flex !important; align-items:center; white-space:nowrap; background:linear-gradient(120deg,#1c9ad6,#166fb8); color:#fff !important; font-weight:800; font-size:12.5px; line-height:1; padding:10px 15px; border-radius:50px; text-decoration:none; box-shadow:0 8px 20px -8px rgba(28,154,214,.7); z-index:3; }
}

/* mobile CTA hidden on desktop, shown only in the mobile header */
.ifcar-m-cta{ display:none; }
@media (max-width:767px){ nav.navbar .navbar-header .ifcar-m-cta{ display:inline-flex !important; } }

/* mobile: confiance heading smaller + tidy circles (match V1-mobile) */
@media (max-width:767px){
  .ifcar-hero3 .h3-conf{ font-size:23px !important; margin-top:28px !important; margin-bottom:20px !important; }
  .ifcar-hero3 .h3-ref-cat{ font-size:10.5px !important; min-height:38px; margin-bottom:10px; }
  .ifcar-hero3 .h3-refs{ grid-template-columns:repeat(3,1fr) !important; gap:8px !important; align-items:start; }
  .ifcar-hero3 .h3-ref-circle{ width:100% !important; max-width:none !important; height:auto !important; aspect-ratio:1/1 !important; }
}

/* Home hero eyebrow "IFCAR SOLUTIONS" -> same blue as "Membres de l'équipe" */
.ifcar-hero3 .h3-eyebrow{ color:#1c9ad6 !important; }

/* Home hero eyebrow "IFCAR SOLUTIONS" -> solid green with a short dash to the right (idea2) */
.ifcar-hero3 .h3-eyebrow{
  display:inline-flex !important; align-items:center !important;
  background:none !important; -webkit-text-fill-color:#6fb62e !important; color:#6fb62e !important;
}
/* marge LOGIQUE : cf. .ifcar-mtitle::after — en arabe le trait passe à gauche du texte,
   un `margin-left` mettait l'espace du mauvais côté et collait le trait au surtitre. */
.ifcar-hero3 .h3-eyebrow::after{ content:""; display:inline-block; width:34px; height:3px; border-radius:3px; background:#8cc63f; margin-inline-start:12px; }

/* Home "Nos domaines d'expertise" heading -> solid navy (idea2) */
.svc4-title{
  display:inline-block !important;
  background:none !important;
  -webkit-text-fill-color:#0c2244 !important; color:#0c2244 !important;
}
/* "D'EXPERTISE" in green */
.svc4-title span{ -webkit-text-fill-color:#6fb62e !important; color:#6fb62e !important; }

/* "Nos domaines d'expertise" heading: uppercase + green underline centered BELOW it */
.svc4-title{ text-transform:uppercase !important; letter-spacing:.02em !important; }
.svc4-head .svc4-underline{ display:block !important; width:60px !important; height:4px !important; margin:14px auto 0 !important; background:#8cc63f !important; border-radius:4px; }

/* home2 left eyebrow "IFCAR SOLUTIONS" -> same blue→green gradient as the Accueil eyebrow */
.h2-eyebrow-grad{
  background:linear-gradient(90deg,#1c9ad6 0%,#8cc63f 100%) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
}
.h2-eyebrow-grad::after{ display:block !important; background:#1c9ad6 !important; }

/* home2 "Ils nous font confiance" -> "confiance" in green */
.h2-clients .h2-eyebrow .h2-grn{ color:#8cc63f !important; -webkit-text-fill-color:#8cc63f !important; }

/* =====================================================================
   Businessman value-prop hero — replaces the "Vous méritez le meilleur
   partenaire RH" band (.request-call-back-area -> .ifcar-nhero-area).
   ===================================================================== */
html.ifcar-home .ifcar-nhero-area{ background:linear-gradient(180deg,#f6fafd 0%,#e9f1f8 100%) !important; padding:60px 0 !important; margin:0 !important; min-height:auto !important; height:auto !important; overflow:hidden; position:relative; }
html.ifcar-home .ifcar-nhero-area::before, html.ifcar-home .ifcar-nhero-area::after{ display:none !important; }
html.ifcar-home .ifcar-nhero{ position:relative; }
html.ifcar-home .ifcar-nhero > .container{ max-width:1240px !important; position:relative; z-index:2; }
html.ifcar-home .ifcar-nhero, html.ifcar-home .ifcar-nhero *{ box-sizing:border-box; }

html.ifcar-home .nh-grid{ display:grid !important; grid-template-columns:1.06fr .94fr; gap:34px; align-items:center !important; }
/* Neutralise any template flex/slide-reveal (stretched children / visibility:hidden <p>). */
html.ifcar-home .ifcar-nhero *{ visibility:visible !important; }
html.ifcar-home .ifcar-nhero .nh-left{ display:block !important; height:auto !important; align-self:center !important; }
html.ifcar-home .ifcar-nhero .nh-left > *{ height:auto !important; min-height:0 !important; flex:0 0 auto !important; }
html.ifcar-home .ifcar-nhero .nh-right{ align-self:center !important; }

/* left column */
html.ifcar-home .nh-left{ min-width:0; }
html.ifcar-home .nh-eyebrow{ display:flex; align-items:center; gap:12px; color:#6fb62e !important; font-size:14px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; margin:0 0 18px; }
html.ifcar-home .nh-eb-line{ width:40px; height:3px; border-radius:2px; background:#6fb62e; display:inline-block; }
html.ifcar-home .nh-title{ color:#0c2244 !important; font-size:52px; line-height:1.04; font-weight:800; margin:0 0 20px !important; letter-spacing:-.015em; }
html.ifcar-home .nh-title .nh-accent{ color:#1c9ad6 !important; }
html.ifcar-home .nh-title .nh-dot{ color:#6fb62e !important; }
html.ifcar-home .nh-tags{ display:flex; align-items:center; gap:14px; margin:0 0 20px; flex-wrap:wrap; }
html.ifcar-home .nh-tags span{ color:#0c2244 !important; font-size:20px; font-weight:800; }
html.ifcar-home .nh-tags i{ width:8px; height:8px; border-radius:50%; background:#6fb62e; display:inline-block; }
html.ifcar-home .nh-sub{ color:#54657c !important; font-size:16px; line-height:1.62; max-width:520px; margin:0 0 28px !important; }
html.ifcar-home .nh-cta{ display:inline-flex; align-items:center; gap:14px; background:#1c9ad6; color:#fff !important; font-size:16px; font-weight:700; padding:17px 34px; border-radius:40px; text-decoration:none; box-shadow:0 18px 32px -12px rgba(28,154,214,.6); transition:transform .25s ease, box-shadow .25s, background-color .25s; }
html.ifcar-home .nh-cta i{ transition:transform .3s ease; }
html.ifcar-home .nh-cta:hover{ background:#178bc4; transform:translateY(-2px); box-shadow:0 22px 38px -12px rgba(28,154,214,.72); }
html.ifcar-home .nh-cta:hover i{ transform:translateX(5px); }
html.ifcar-home .nh-badges{ display:flex; gap:24px; margin-top:34px; }
html.ifcar-home .nh-badge{ display:flex; align-items:center; gap:12px; }
html.ifcar-home .nh-badge + .nh-badge{ padding-left:24px; border-left:1px solid #d6e0ec; }
html.ifcar-home .nh-badge-ic{ width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:18px; flex:0 0 auto; }
html.ifcar-home .nh-badge-ic.green{ background:rgba(111,182,46,.13); color:#6fb62e; }
html.ifcar-home .nh-badge-ic.blue{ background:rgba(28,154,214,.13); color:#1c9ad6; }
html.ifcar-home .nh-badge-t{ color:#0c2244 !important; font-size:14px; font-weight:700; line-height:1.25; }

/* right column — full businessman-on-blue-circle graphic (self-contained) */
html.ifcar-home .nh-right{ min-width:0; display:flex; justify-content:center; align-items:flex-end; position:relative; }
html.ifcar-home .nh-stage{ position:relative; width:500px; max-width:100%; display:flex; justify-content:center; }
html.ifcar-home .nh-man{ position:relative; display:block; width:100%; max-width:490px; height:auto; z-index:2; }
html.ifcar-home .nh-ring{ position:absolute; left:-4px; top:56px; width:124px; height:124px; border:2px solid #c9d9e8; border-radius:50%; z-index:1; }
html.ifcar-home .nh-dots{ position:absolute; right:-4px; top:10px; width:118px; height:88px; z-index:1;
  background-image:radial-gradient(#9fc3e0 1.6px, transparent 1.7px); background-size:15px 15px; opacity:.7; }

/* stats card */
html.ifcar-home .nh-stats{ margin-top:36px; background:#fff; border-radius:22px; box-shadow:0 34px 74px -34px rgba(12,34,68,.34); display:grid; grid-template-columns:repeat(4,1fr); padding:26px 12px; position:relative; z-index:2; }
html.ifcar-home .nh-stat{ display:flex; align-items:center; gap:16px; justify-content:center; padding:6px 16px; }
html.ifcar-home .nh-stat + .nh-stat{ border-left:1px solid #eef2f7; }
html.ifcar-home .nh-stat-ic{ width:56px; height:56px; border-radius:16px; display:flex; align-items:center; justify-content:center; font-size:22px; flex:0 0 auto; }
html.ifcar-home .nh-stat-ic.blue{ background:rgba(28,154,214,.11); color:#1c9ad6; }
html.ifcar-home .nh-stat-ic.green{ background:rgba(111,182,46,.13); color:#6fb62e; }
html.ifcar-home .nh-stat-b{ display:flex; flex-direction:column; min-width:0; }
html.ifcar-home .nh-stat-b b{ font-size:33px; font-weight:800; line-height:1; letter-spacing:-.01em; }
html.ifcar-home .nh-stat-b b.blue{ color:#1c9ad6 !important; }
html.ifcar-home .nh-stat-b b.green{ color:#6fb62e !important; }
html.ifcar-home .nh-stat-b span{ color:#54657c !important; font-size:13px; margin-top:5px; line-height:1.3; }

/* WOW entrance + ambient motion (root gets .in via setupHero2 on scroll into view) */
html.ifcar-home .ifcar-nhero .nh-left > *{ opacity:0; transform:translateY(22px); transition:opacity .6s ease, transform .6s cubic-bezier(.22,.61,.36,1); }
html.ifcar-home .ifcar-nhero.in .nh-left > *{ opacity:1; transform:none; }
html.ifcar-home .ifcar-nhero.in .nh-eyebrow{ transition-delay:.05s; }
html.ifcar-home .ifcar-nhero.in .nh-title{ transition-delay:.14s; }
html.ifcar-home .ifcar-nhero.in .nh-tags{ transition-delay:.26s; }
html.ifcar-home .ifcar-nhero.in .nh-sub{ transition-delay:.38s; }
html.ifcar-home .ifcar-nhero.in .nh-cta{ transition-delay:.5s; }
html.ifcar-home .ifcar-nhero.in .nh-badges{ transition-delay:.62s; }
html.ifcar-home .ifcar-nhero .nh-right{ opacity:0; transform:scale(.92); transition:opacity .8s ease .28s, transform .85s cubic-bezier(.22,.61,.36,1) .28s; }
html.ifcar-home .ifcar-nhero.in .nh-right{ opacity:1; transform:none; }
html.ifcar-home .ifcar-nhero .nh-stats{ opacity:0; transform:translateY(26px); transition:opacity .7s ease .55s, transform .7s cubic-bezier(.22,.61,.36,1) .55s; }
html.ifcar-home .ifcar-nhero.in .nh-stats{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  html.ifcar-home .nh-man{ animation:none !important; }
  html.ifcar-home .ifcar-nhero .nh-left > *, html.ifcar-home .ifcar-nhero .nh-right, html.ifcar-home .ifcar-nhero .nh-stats{ transition:none !important; opacity:1 !important; transform:none !important; }
}
@media (max-width:991px){
  html.ifcar-home .nh-grid{ grid-template-columns:1fr; gap:26px; }
  html.ifcar-home .nh-right{ order:-1; }
  html.ifcar-home .nh-stage{ width:330px; }
  html.ifcar-home .nh-man{ max-width:330px; }
  html.ifcar-home .nh-title{ font-size:38px; }
  html.ifcar-home .nh-stats{ grid-template-columns:repeat(2,1fr); gap:10px 0; }
  html.ifcar-home .nh-stat:nth-child(3){ border-left:0; }
}
@media (max-width:575px){
  html.ifcar-home .nh-stats{ grid-template-columns:1fr; }
  html.ifcar-home .nh-stat + .nh-stat{ border-left:0; border-top:1px solid #eef2f7; }
  html.ifcar-home .nh-badges{ flex-wrap:wrap; gap:14px; }
  html.ifcar-home .nh-badge + .nh-badge{ padding-left:0; border-left:0; }
}

/* =====================================================================
   Home accent words: turn the green highlight words on the Accueil
   ("performantes", "confiance", "d'expertise") into the same blue→green
   gradient used by the section eyebrows / "Membres de l'équipe".
   Placed last so it overrides the earlier solid-green !important rules.
   ===================================================================== */
.h3-eyebrow, .ifcar-hero3 .h3-eyebrow,
.h3-accent, .ifcar-hero3 .h3-accent,
.h3-conf span, .ifcar-hero3 .h3-conf span,
.svc4-title span{
  background:linear-gradient(90deg,#1c9ad6 0%,#8cc63f 100%) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
}
/* keep the little dash after the "IFCAR SOLUTIONS" eyebrow solid (not clipped) */
.ifcar-hero3 .h3-eyebrow::after{ -webkit-text-fill-color:initial !important; }

/* "Ils nous font confiance" category icons -> same navy as the Recrutement
   icon in "Nos domaines d'expertise" (.svc4-card.blue .svc4-ic gradient). */
.h3-ref-ic, .h3-ref-ic i,
.ifcar-hero3 .h3-ref-ic, .ifcar-hero3 .h3-ref-ic i{
  background:linear-gradient(135deg,#1c3a63,#0c2244) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
}

/* "Nos domaines d'expertise": Recrutement + Conseil (blue cards) -> blue title
   + blue icon circle; ALL "En savoir plus" -> the navy of the old Recrutement icon. */
.svc4-card.blue .svc4-ic{
  background:linear-gradient(135deg,#29abe2,#1c76c9) !important;
  box-shadow:0 12px 24px -8px rgba(28,154,214,.5) !important;
}
.svc4-card.blue .svc4-t,
.svc4-grid .svc4-card:nth-child(3) .svc4-t{ color:#1c9ad6 !important; }
.svc4-card.blue .svc4-more, .svc4-card.green .svc4-more, .svc4-more{ color:#0c2244 !important; }

/* "PLUS DE 18 ANS D'EXPERTISE RH" + "CONTACTEZ-NOUS" eyebrows -> same blue→green
   gradient as the "Nos experts" eyebrow (.sub-heading / --bg-gradient-secondary). */
html.ifcar-home .nh-eyebrow, .c2-eyebrow, .hc-eyebrow{
  background:linear-gradient(90deg,#1c9ad6 0%,#8cc63f 100%) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
}
html.ifcar-home .nh-eyebrow .nh-eb-line{ background:linear-gradient(90deg,#1c9ad6,#8cc63f) !important; -webkit-text-fill-color:initial !important; }

/* "Réserver un diagnostic gratuit" -> same shine sweep as "Envoyer le message". */
html.ifcar-home .nh-cta{ position:relative; overflow:hidden; }
html.ifcar-home .nh-cta::after{
  content:""; position:absolute; top:0; left:-60%; width:34%; height:100%;
  transform:skewX(-20deg); pointer-events:none;
  background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.5),rgba(255,255,255,0));
  animation:ihShine 3.6s ease-in-out infinite;
}

/* Contact coordinates icons (ICE, Téléphone, Fax…) -> alternate blue / green.
   Home uses .hc-ic (buildContactForm); /contact-us page uses .c2-ic. */
.c2-list li:nth-child(odd) .c2-ic,
.hc-list li:nth-child(odd) .hc-ic{ background:linear-gradient(135deg,#29abe2,#1c76c9) !important; box-shadow:0 8px 18px -6px rgba(28,154,214,.55) !important; }
.c2-list li:nth-child(even) .c2-ic,
.hc-list li:nth-child(even) .hc-ic{ background:linear-gradient(135deg,#8cc63f,#6fb62e) !important; box-shadow:0 8px 18px -6px rgba(140,198,63,.6) !important; }

/* =====================================================================
   About "Notre promesse" — orbital SOLUTIONS hub (replaces the 3 cards).
   ===================================================================== */
.ifcar-promise-area{ position:relative; overflow:hidden; }
.ifcar-promise-area .ifcar-sol-card, .ifcar-promise-area .process-style-one{ display:none !important; }
.ifcar-promise{ position:relative; }
.ifcar-promise-head{ max-width:780px; margin:0 auto; text-align:center; }
.ifcar-promise-eyebrow{ display:inline-block; text-transform:uppercase; letter-spacing:.16em; font-weight:800; font-size:13px;
  background:linear-gradient(90deg,#8cc63f,#6fb62e); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.ifcar-promise-eyebrow::after{ content:""; display:block; width:34px; height:3px; border-radius:3px; margin:11px auto 20px; background:linear-gradient(90deg,#8cc63f,#6fb62e); }
.ifcar-promise-title{ color:#0c2244; font-weight:800; font-size:34px; line-height:1.3; margin:0; }
.ifcar-promise-title span{ background:linear-gradient(90deg,#29abe2,#1c9ad6); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.ifcar-promise-title::after{ content:""; display:block; width:40px; height:3px; border-radius:3px; margin:18px auto 0; background:linear-gradient(90deg,#29abe2,#1c9ad6); }
.ifcar-promise-sub{ max-width:640px; margin:22px auto 0; color:#5b6b7f; font-size:16px; line-height:1.75; }

/* responsive: stack the hub into a simple vertical list */
@media (max-width:1199px){
  .ifcar-promise-title{ font-size:26px; }
  .ifcar-hub{ width:auto; height:auto; max-width:560px; margin-top:20px; }
  .ifcar-hub-svg{ display:none; }
  .hub-core{ position:relative; left:auto; top:auto; transform:none !important; opacity:1; margin:0 auto 30px; }
  .hub-ic{ position:relative; left:auto !important; top:auto !important; transform:none !important; opacity:1; margin:0 auto 12px; flex:0 0 auto; }
  .hub-txt{ position:relative; left:auto !important; right:auto; top:auto; width:auto !important; text-align:center !important; transform:none !important; opacity:1; margin:0 auto 34px; max-width:420px; }
  .hub-txt .hub-num{ margin:0 auto 4px; }
  .ifcar-hub{ display:flex; flex-direction:column; align-items:center; }
  /* order: core, then 01 icon+text, 02, 03 */
  .hub-core{ order:0; } .pi1{ order:1; } .pt1{ order:2; } .pi2{ order:3; } .pt2{ order:4; } .pi3{ order:5; } .pt3{ order:6; }
}

/* =====================================================================
   About "NOS ATOUTS" — POURQUOI IFCAR SOLUTIONS (4 animated columns).
   Overrides the older .ifcar-atout(s)-* styling (this block comes later).
   ===================================================================== */
.ifcar-atouts-area{ background:#fbfdff !important; position:relative; overflow:hidden; }
.ifcar-atouts-head{ text-align:center; margin-bottom:56px; }
.ifcar-atouts-eyebrow{ display:inline-flex; align-items:center; gap:14px; text-transform:uppercase; letter-spacing:.22em; font-weight:800; font-size:13px;
  background:none !important; -webkit-text-fill-color:#243b5e !important; color:#243b5e !important; margin-bottom:16px; }
.ifcar-atouts-eyebrow i{ display:block; width:40px; height:2px; border-radius:2px; background:#1c9ad6 !important; }
.ifcar-atouts-eyebrow i:last-of-type{ background:#8cc63f !important; }
.ifcar-atouts-title{ font-size:clamp(28px,3.4vw,46px); font-weight:800; line-height:1.18; color:#0c2244; margin:0 auto; max-width:960px; text-transform:uppercase; letter-spacing:.01em; }
.ifcar-atouts-title span{ color:inherit; }
.ifcar-atouts-title .t-blue{ color:#1c9ad6 !important; } .ifcar-atouts-title .t-green{ color:#6fb62e !important; }
.ifcar-atouts-conn{ display:block; width:120px; height:2px; border-radius:2px; margin:20px auto 0; position:relative; background:linear-gradient(90deg,#1c9ad6,#8cc63f); }
.ifcar-atouts-conn::before, .ifcar-atouts-conn::after{ content:""; position:absolute; top:50%; width:9px; height:9px; border-radius:50%; transform:translateY(-50%); }
.ifcar-atouts-conn::before{ left:-4px; background:#1c9ad6; } .ifcar-atouts-conn::after{ right:-4px; background:#8cc63f; }
.ifcar-atouts-sub{ max-width:620px; margin:24px auto 0; color:#5b6b7f; font-size:16px; line-height:1.7; }
.ifcar-atouts-row{ align-items:flex-start; }

/* per-column accent colour */
.at-col{ --ac:#6fb62e; }
.at-col.blue{ --ac:#1c9ad6; } .at-col.teal{ --ac:#14a89e; } .at-col.green{ --ac:#6fb62e; }

/* number + circle + arc + end-dot */
.at-top{ position:relative; width:100%; height:190px; }
.at-num{ position:absolute; left:0; top:2px; font-size:72px; font-weight:800; line-height:1; color:transparent; -webkit-text-stroke:2px var(--ac); }
.at-circle{ position:absolute; left:82px; top:56px; width:104px; height:104px; border-radius:50%; background:#fff;
  box-shadow:0 20px 42px -16px rgba(20,40,80,.28); display:flex; align-items:center; justify-content:center; }
.at-circle i{ font-size:36px; color:var(--ac); }
.at-arc{ position:absolute; left:0; top:0; width:214px; height:190px; max-width:none; color:var(--ac); overflow:visible; }
.at-enddot{ position:absolute; left:196px; top:126px; width:13px; height:13px; border-radius:50%; background:var(--ac); }

/* title + bullets */
.at-title{ margin:8px 0 16px; font-size:17px; font-weight:800; text-transform:uppercase; letter-spacing:.02em; color:var(--ac); }
.at-title::after{ content:""; display:block; width:38px; height:3px; border-radius:3px; margin-top:11px; background:var(--ac); }
.at-list{ list-style:none; margin:0; padding:0; }
.at-list li{ display:flex; gap:11px; margin-bottom:16px; font-size:14.5px; line-height:1.6; color:#5a6a7a; }
.at-dot{ flex:0 0 auto; width:9px; height:9px; border-radius:50%; margin-top:7px; background:var(--ac); }

/* wow reveal */
.ifcar-atouts-head > *{ opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s cubic-bezier(.22,.61,.36,1); }
.ifcar-atouts.in .ifcar-atouts-head > *{ opacity:1; transform:none; }
.ifcar-atouts.in .ifcar-atouts-eyebrow{ transition-delay:.05s; }
.ifcar-atouts.in .ifcar-atouts-title{ transition-delay:.15s; }
.ifcar-atouts.in .ifcar-atouts-conn{ transition-delay:.25s; }
.ifcar-atouts.in .ifcar-atouts-sub{ transition-delay:.35s; }
.at-col{ opacity:0; transform:translateY(36px); transition:opacity .6s ease var(--ad,0s), transform .6s cubic-bezier(.22,.7,.3,1) var(--ad,0s); }
.ifcar-atouts.in .at-col{ opacity:1; transform:none; }
.at-circle{ opacity:0; transform:scale(.6); transition:opacity .5s ease, transform .55s cubic-bezier(.22,1.3,.36,1); transition-delay:calc(var(--ad,0s) + .18s); }
.ifcar-atouts.in .at-circle{ opacity:1; transform:scale(1); }
.at-arc path{ stroke-dasharray:230; stroke-dashoffset:230; transition:stroke-dashoffset 1s ease; transition-delay:calc(var(--ad,0s) + .3s); }
.ifcar-atouts.in .at-arc path{ stroke-dashoffset:0; }
.at-enddot{ opacity:0; transition:opacity .3s ease; transition-delay:calc(var(--ad,0s) + 1s); }
.ifcar-atouts.in .at-enddot{ opacity:1; }
.at-col:hover .at-circle{ transform:translateY(-5px) scale(1.05); }
@media (prefers-reduced-motion:reduce){ .at-col,.at-circle,.at-arc path,.at-enddot,.ifcar-atouts-head > *{ transition:none !important; opacity:1 !important; transform:none !important; stroke-dashoffset:0 !important; } }

/* =====================================================================
   RECRUTEMENT page (/services-details/1) — full rebuild to match the
   "GROUPES ET ENTREPRISES PRIVÉES" mockup. Overrides older .ifcar-recr*.
   ===================================================================== */
.ifcar-recr-hero{ position:relative; overflow:hidden; display:flex; align-items:center; min-height:410px !important; padding:0 !important; background:#F9F9F8 !important; }
.ifcar-recr-hero::after{ content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg,#F9F9F8 36%, rgba(249,249,248,.92) 46%, rgba(249,249,248,.4) 54%, rgba(249,249,248,0) 62%); }
/* RTL: mirror the hero — photo to the left, solid gradient + text on the right */
[dir="rtl"] .ifcar-recr-hero .rh-bg{ right:auto; left:0; }
[dir="rtl"] .ifcar-recr-hero::after{ background:linear-gradient(270deg,#F9F9F8 36%, rgba(249,249,248,.92) 46%, rgba(249,249,248,.4) 54%, rgba(249,249,248,0) 62%); }

.ifcar-recr2-area{ background:#fff !important; padding:74px 0 84px !important; }
.rmis{ position:relative; display:flex; align-items:center; gap:18px; padding:8px 26px 8px 0; }
/* faint chevron/arrow outline behind each mission */
.rmis::before{ content:""; position:absolute; left:74px; right:-6px; top:0; bottom:0; border:1.5px solid #edf1f6; border-radius:8px;
  clip-path:polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%); z-index:0; }
/* green dot on the centre dotted line, aligned with each left-column row */
.rmis:nth-child(-n+3)::after{ content:""; position:absolute; right:-30px; top:50%; transform:translateY(-50%); width:11px; height:11px; border-radius:50%; background:#6fb62e; box-shadow:0 0 0 4px #fff; z-index:2; }
.rmis{ opacity:0; transform:translateY(16px); transition:opacity .5s ease var(--md,0s), transform .5s ease var(--md,0s); }

@media (max-width:991px){
  .ifcar-recr-hero{ min-height:auto !important; padding:46px 0 !important; }
  .ifcar-recr-hero::after{ background:linear-gradient(90deg,#F9F9F8 6%, rgba(249,249,248,.85) 46%, rgba(249,249,248,.6) 100%); }
  .rmis:nth-child(-n+3)::after{ display:none; }
}

/* CONTACTEZ-NOUS (home) — make the whole block a bit more compact */
html.ifcar-home .ifcar-hcontact-area{ padding-top:72px !important; padding-bottom:72px !important; }
.ifcar-hcontact{ max-width:1120px; margin:0 auto; gap:34px !important; }
.hc-title{ font-size:30px !important; margin-bottom:12px !important; }
.hc-sub{ font-size:14px !important; margin-bottom:20px !important; }
.hc-card{ padding:4px 22px !important; }
.hc-list li{ padding:11px 0 !important; gap:14px !important; }
.hc-ic{ width:40px !important; height:40px !important; }
.hc-ic i{ font-size:15px !important; }
.hc-list b{ font-size:10.5px !important; }
.hc-list div>span{ font-size:13.5px !important; }
.hc-right{ padding:32px 32px !important; }
.hc-form-ic{ width:54px !important; height:54px !important; }
.hc-form-ic i{ font-size:21px !important; }
/* CONTACTEZ-NOUS (home) — shrink the whole "Envoyez-nous un message" form (desktop only, home only) */
@media (min-width:992px){
  .ifcar-hcontact{ grid-template-columns:1.14fr .86fr !important; }
  .hc-right{ padding:26px 26px !important; }
  .hc-right .hc-form-ic{ width:46px !important; height:46px !important; }
  .hc-right .hc-form-ic i{ font-size:18px !important; }
  .hc-right .c2-form-head{ gap:13px !important; margin-bottom:16px !important; }
  .hc-right .c2-form-head h3{ font-size:20px !important; }
  .hc-right .c2-form-underline{ margin:6px 0 9px !important; }
  .hc-right .c2-form-head p{ font-size:12.5px !important; line-height:1.5 !important; }
  .hc-right .c2-grid{ gap:12px !important; margin-bottom:12px !important; }
  .hc-right .c2-select, .hc-right .c2-area{ margin-top:12px !important; }
  .hc-right .c2-field input, .hc-right .c2-field select, .hc-right .c2-field textarea{ padding:12px 14px 12px 42px !important; font-size:14px !important; border-radius:10px !important; }
  .hc-right .c2-field>i:first-child{ font-size:14px !important; }
  .hc-right .c2-field label{ font-size:14px !important; }
  .hc-right .c2-area textarea{ min-height:88px !important; }
  .hc-right .c2-check{ margin:12px 0 16px !important; font-size:12.5px !important; }
  .hc-right .hc-actions{ gap:16px !important; }
  .hc-right .c2-submit{ padding:12px 24px !important; font-size:14px !important; }
  .hc-right .hc-note{ font-size:11.5px !important; max-width:250px !important; }
  .hc-right .hc-note-ic{ width:40px !important; height:40px !important; font-size:15px !important; }
}

/* ADN section: gradient eyebrow + "IFCAR" (like "nos experts"), + more compact */
.ifcar-adn-eyebrow, .ifcar-adn-title span{
  background:linear-gradient(90deg,#1c9ad6,#8cc63f) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
}
.ifcar-adn-area{ padding:54px 0 48px !important; }
.ifcar-adn-grid{ gap:26px !important; grid-template-columns:1fr 176px 1.1fr !important; }
.ifcar-adn-title{ font-size:clamp(30px,3.3vw,46px) !important; }
.ifcar-adn-title::after{ margin-top:15px !important; }
.ifcar-adn-intro{ font-size:14.5px !important; line-height:1.65 !important; margin:18px 0 20px !important; }
.ifcar-adn-stat{ padding:12px 16px !important; margin-bottom:13px !important; }
.ifcar-adn-stat .ic{ flex:0 0 46px !important; width:46px !important; height:46px !important; }
.ifcar-adn-stat h5{ font-size:17px !important; }
.ifcar-adn-stat p{ font-size:12.5px !important; }
.ifcar-adn-helix{ width:150px !important; height:366px !important; }
.ifcar-adn-cap b{ font-size:19px !important; }
.ifcar-adn-card{ padding:15px 22px 15px 18px !important; gap:14px !important; }
.ifcar-adn-cic{ flex:0 0 52px !important; width:52px !important; height:52px !important; }
.ifcar-adn-ctx h4{ font-size:16px !important; }
.ifcar-adn-ctx p{ font-size:12.5px !important; }
.ifcar-adn-cnum{ font-size:26px !important; }

/* Qui sommes-nous — remove decorative diagonal shapes on the "Des solutions pour
   votre développement" (about-style-one) section */
.about-style-one-area .thumb-shape-bottom,
.about-style-one-area .shape-animated-left,
.about-style-one-area .shape-animated-right,
.about-style-one-area .thumb-shape-top{ display:none !important; }

/* NOTRE PROMESSE: hide the template large chevron shape + make the block smaller */
.ifcar-promise-area .large-shape, .process-style-one-area .large-shape{ display:none !important; }
.ifcar-promise-area{ padding-top:54px !important; padding-bottom:34px !important; }
.ifcar-promise-title{ font-size:28px !important; }
.ifcar-promise-sub{ font-size:15px !important; margin-top:16px !important; }

/* NOS ATOUTS: numbers faded-solid like NOTRE PROMESSE (not outline) + whole section smaller */
.at-num{ color:var(--ac) !important; -webkit-text-stroke:0 !important; opacity:.4 !important; }
.ifcar-atouts-area{ padding-top:54px !important; padding-bottom:52px !important; }
.ifcar-atouts-head{ margin-bottom:36px !important; }
.ifcar-atouts-title{ font-size:clamp(24px,2.9vw,38px) !important; }
.ifcar-atouts-sub{ font-size:15px !important; margin-top:18px !important; }
.at-top{ transform:scale(.84); transform-origin:top left; height:156px !important; }
.at-title{ font-size:15.5px !important; margin-top:0 !important; }
.at-title::after{ margin-top:9px !important; }
.at-list li{ font-size:13.5px !important; margin-bottom:13px !important; }
.at-dot{ margin-top:6px !important; }

/* NOS ATOUTS eyebrow -> blue->green gradient (like "nos experts") */
.ifcar-atouts-eyebrow{
  background:linear-gradient(90deg,#1c9ad6,#8cc63f) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
}

/* =====================================================================
   ARABIC RTL (html[dir=rtl]) — flip body content to the right, but keep
   the header/nav in its working LTR layout (a full RTL flip breaks the
   theme's absolute/offset header decorations).
   ===================================================================== */
[dir="rtl"] body{ text-align:right; }
/* only the language switcher stays LTR (FR / EN / ع pills) */
[dir="rtl"] #lang-switcher{ direction:ltr; }

/* ===== Arabic: header stays exactly like FRENCH (LTR) — logo left, topbar (email/phone
   left, social/lang right), "Prendre Conseil" button right. ONLY the nav MENU flows RTL. ===== */
[dir="rtl"] .top-bar-area, [dir="rtl"] nav.navbar, [dir="rtl"] .navbar-area,
[dir="rtl"] .navbar-header, [dir="rtl"] .attr-nav, [dir="rtl"] .attr-right{ direction:ltr !important; }
[dir="rtl"] #navbar-menu, [dir="rtl"] #navbar-menu .navbar-nav{ direction:rtl !important; }
/* the header itself carries dir="ltr" (set in JS) so the logo-box renders exactly like FR;
   the nav menu carries dir="rtl". */

/* =====================================================================
   NOTRE PROMESSE — 3-card redesign (circle+arc, "— 01 —", title, chevron).
   Replaces the orbital hub. Appended last so it wins.
   ===================================================================== */
.ifcar-promise-area .ifcar-hub{ display:none !important; }
.ifcar-promise-title{ font-size:clamp(28px,3.2vw,40px) !important; transform:none !important; }
.ipr-cards{ position:relative; display:grid; grid-template-columns:repeat(3,1fr); background:#fff; border-radius:22px; margin-top:26px;
  box-shadow:0 34px 80px -44px rgba(20,40,80,.34); overflow:hidden; }
.ipr-card{ --ac:#1c9ad6; position:relative; text-align:center; padding:46px 34px 52px; }
.ipr-card.blue{ --ac:#1c9ad6; } .ipr-card.green{ --ac:#6fb62e; } .ipr-card.teal{ --ac:#16a89c; }
.ipr-card + .ipr-card{ border-left:1px solid #eef2f7; }
.ipr-card::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:6px; background:var(--ac); }
.ipr-ic-wrap{ position:relative; width:112px; height:112px; margin:0 auto 28px; color:var(--ac); }
.ipr-arc{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.ipr-arc circle{ stroke-dasharray:206 289; stroke-dashoffset:206; transition:stroke-dashoffset 1.1s ease calc(var(--cd,0s) + .3s); }
.ipr-card.blue .ipr-arc{ transform:rotate(-140deg); } .ipr-card.green .ipr-arc{ transform:rotate(-90deg); } .ipr-card.teal .ipr-arc{ transform:rotate(-40deg); }
.ipr-ic{ position:absolute; inset:9px; border-radius:50%; background:#fff; box-shadow:0 16px 32px -14px rgba(20,40,80,.28);
  display:flex; align-items:center; justify-content:center; font-size:34px; color:var(--ac); transition:transform .4s ease; }
.ipr-card:hover .ipr-ic{ transform:scale(1.07); }
.ipr-num{ display:flex; align-items:center; justify-content:center; gap:14px; font-size:40px; font-weight:800; color:var(--ac); line-height:1; margin-bottom:16px; }
.ipr-num::before, .ipr-num::after{ content:""; width:22px; height:2px; border-radius:2px; background:var(--ac); opacity:.8; }
.ipr-t{ margin:0; font-size:19px; font-weight:800; color:#0c2244; }
.ipr-t span{ color:var(--ac); }
.ipr-line{ display:block; width:36px; height:3px; border-radius:3px; background:var(--ac); margin:13px auto 16px; }
.ipr-d{ margin:0 auto; max-width:290px; color:#5b6b7f; font-size:14px; line-height:1.7; }
.ipr-chev{ position:absolute; left:50%; bottom:0; transform:translateX(-50%); width:46px; height:30px; background:var(--ac);
  border-radius:14px 14px 0 0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:13px; z-index:1; }
/* reveal */
.ifcar-promise-head > *{ opacity:0; transform:translateY(20px); transition:opacity .7s ease, transform .7s cubic-bezier(.22,.61,.36,1); }
.ifcar-promise.in .ifcar-promise-head > *{ opacity:1; transform:none; }
.ifcar-promise.in .ifcar-promise-title{ transition-delay:.1s; } .ifcar-promise.in .ifcar-promise-sub{ transition-delay:.3s; }
.ipr-card{ opacity:0; transform:translateY(32px); transition:opacity .6s ease var(--cd,0s), transform .6s cubic-bezier(.22,.7,.3,1) var(--cd,0s); }
.ifcar-promise.in .ipr-card{ opacity:1; transform:none; }
.ifcar-promise.in .ipr-arc circle{ stroke-dashoffset:0; }
.ipr-chev{ opacity:0; transform:translate(-50%,10px); transition:opacity .5s ease, transform .5s ease; transition-delay:calc(var(--cd,0s) + .5s); }
.ifcar-promise.in .ipr-chev{ opacity:1; transform:translateX(-50%); }
@media (max-width:860px){ .ipr-cards{ grid-template-columns:1fr; } .ipr-card + .ipr-card{ border-left:0; border-top:1px solid #eef2f7; } }

/* NOTRE PROMESSE — gradient eyebrow (like nos experts) + a bit more compact */
.ifcar-promise-eyebrow{
  background:linear-gradient(90deg,#1c9ad6,#8cc63f) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
}
.ifcar-promise-area{ padding-top:52px !important; padding-bottom:44px !important; }
.ifcar-promise-title{ font-size:clamp(23px,2.7vw,34px) !important; }
.ifcar-promise-sub{ font-size:14px !important; margin-top:14px !important; }
.ipr-cards{ margin-top:22px !important; }
.ipr-card{ padding:36px 28px 42px !important; }
.ipr-ic-wrap{ width:94px !important; height:94px !important; margin-bottom:22px !important; }
.ipr-ic{ font-size:28px !important; }
.ipr-num{ font-size:34px !important; margin-bottom:12px !important; }
.ipr-t{ font-size:17px !important; }
.ipr-line{ margin:11px auto 14px !important; }
.ipr-d{ font-size:13px !important; max-width:260px !important; }

/* keep centered headings centered in Arabic (they're text-align:center in French) */
[dir="rtl"] .site-heading, [dir="rtl"] .site-heading.text-center, [dir="rtl"] .text-center,
[dir="rtl"] .ifcar-promise-head, [dir="rtl"] .svc4-head, [dir="rtl"] .ifcar-atouts-head,
[dir="rtl"] .h3-conf, [dir="rtl"] .ipr-card, [dir="rtl"] .ipr-num, [dir="rtl"] .ipr-t, [dir="rtl"] .ipr-d,
[dir="rtl"] .rstep, [dir="rtl"] .at-title, [dir="rtl"] .rappr-head{ text-align:center !important; }

/* AR: shift the nav menu a bit to the right (visual only, doesn't disturb the CTA) */
html[dir="rtl"] nav.navbar #navbar-menu .navbar-nav{ position:relative !important; left:80px !important; }
html[dir="rtl"] nav.navbar .attr-nav, html[dir="rtl"] nav.navbar .attr-right{ position:relative !important; z-index:6 !important; }

/* AR: centre the Équipe + Experts headings; make the businessman + contact eyebrows
   use the same font as the "Nos experts" (.sub-heading) eyebrow (weight 600, no tracking). */
[dir="rtl"] .team-style-one-area .site-heading, [dir="rtl"] .team-style-one-area .site-heading *,
[dir="rtl"] .ifcar-experts-area .site-heading, [dir="rtl"] .ifcar-experts-area .site-heading *{ text-align:center !important; }
[dir="rtl"] .nh-eyebrow, [dir="rtl"] .hc-eyebrow, html[dir="rtl"].ifcar-home .nh-eyebrow{
  font-weight:600 !important; letter-spacing:normal !important; text-transform:none !important; }

/* AR fix: Bootstrap offset-lg-2 hard-codes margin-left, which un-centres the Équipe
   + Experts heading columns under RTL. Neutralise it with auto side margins so the
   col-8 stays centred (16.66% each side) like in French. */
[dir="rtl"] .team-style-one-area .row > [class*="offset-"],
[dir="rtl"] .ifcar-experts-area .row > [class*="offset-"]{
  margin-left:auto !important; margin-right:auto !important; }

/* AR (Qui sommes-nous): match ADN / Promesse / Atouts eyebrows to the "Membres de
   l'équipe" (.sub-heading) font — weight 600, no letter-spacing (Arabic letters
   shouldn't be tracked apart). */
[dir="rtl"] .ifcar-adn-eyebrow,
[dir="rtl"] .ifcar-promise-eyebrow,
[dir="rtl"] .ifcar-atouts-eyebrow{
  font-weight:600 !important; letter-spacing:normal !important; }

/* AR: centre the "POURQUOI IFCAR SOLUTIONS" title (it was inheriting text-align:right)
   and slightly enlarge the ADN / Promesse / Atouts eyebrows. */
[dir="rtl"] .ifcar-atouts-title{ text-align:center !important; }
[dir="rtl"] .ifcar-adn-eyebrow,
[dir="rtl"] .ifcar-promise-eyebrow,
[dir="rtl"] .ifcar-atouts-eyebrow{ font-size:17px !important; }

/* AR home hero: right-align the description paragraph (نساعد المقاولات…) */
/* AR hero paragraph. Desktop: right-hugging, flush with the title/eyebrow — done the
   same way the eyebrow works (inline-block + parent text-align:right), which is robust
   in Safari (margin-left:auto is not). Mobile: centered. */
html[dir="rtl"] .ifcar-hero3 .h3-sub{
  display:inline-block !important; max-width:485px !important;
  margin-left:0 !important; margin-right:0 !important; text-align:right !important; }
@media (max-width:767px){
  html[dir="rtl"] .ifcar-hero3 .h3-sub{
    display:block !important; max-width:100% !important; text-align:center !important;
    margin-left:auto !important; margin-right:auto !important; }
}

/* Section 2 (recrutement "Approche par annonce") header — centered with dividers,
   matching section2.png: gradient eyebrow + green underline, title + dotted gradient rule. */
.ifcar-recr2-area .rappr-head{ text-align:center !important; }

/* Recrutement hero eyebrow "NOS OFFRES DE RECRUTEMENT" → blue→green gradient,
   matching the "NOTRE APPROCHE RECRUTEMENT" eyebrow. */
.ifcar-recr-hero .rh-eyebrow{
  background:linear-gradient(90deg,#1c9ad6,#8cc63f); -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent; }

/* Recrutement timeline — a blue highlight travels from circle to circle on a loop,
   with an expanding ring pulse (the "waw"). 5 steps × 1.4s = 7s loop. */
.rsteps .rstep-circ, .rsteps .rstep-num, .rsteps .rstep-circ::after, .rsteps .rstep-circ::before{
  animation-duration:7s; animation-iteration-count:infinite; animation-timing-function:ease-in-out; }
@keyframes rstepGlowCirc{
  0%,100%{ border-color:#e2e8f0; box-shadow:none; transform:translateY(0) scale(1); }
  3%{ border-color:#1c9ad6; box-shadow:0 16px 34px -12px rgba(28,154,214,.5); transform:translateY(-7px) scale(1.06); }
  17%{ border-color:#1c9ad6; box-shadow:0 16px 34px -12px rgba(28,154,214,.5); transform:translateY(-5px) scale(1.05); }
  22%{ border-color:#e2e8f0; box-shadow:none; transform:translateY(0) scale(1); }
}
@keyframes rstepGlowNum{ 0%,100%{ color:#a7b3c1; } 4%,17%{ color:#1c9ad6; } 22%{ color:#a7b3c1; } }
@keyframes rstepGlowDot{ 0%,100%{ background:#d3dce6; } 4%,17%{ background:#1c9ad6; } 22%{ background:#d3dce6; } }
@keyframes rstepRing{ 0%{ opacity:0; transform:scale(.85); } 4%{ opacity:.55; transform:scale(1); } 16%{ opacity:0; transform:scale(1.42); } 100%{ opacity:0; transform:scale(1.42); } }
@keyframes m3In{ from{ opacity:0; transform:translateY(16px);} to{ opacity:1; transform:none;} }

/* Section 3 — tidy: give the text column more room so descriptions end above the rail
   (no line crossing the text at desktop widths), keep circles prominent. */
.m3-circ{ width:94px !important; height:94px !important; }

/* Section 3 surtitle "NOTRE APPROCHE RECRUTEMENT" — match section 2's eyebrow:
   site font, weight 800, .16em tracking, blue→green gradient (single). */
.xm-sec .xm-surt{ font-family:Outfit,"Outfit Fallback",sans-serif !important; font-weight:800 !important; font-size:17px !important; letter-spacing:.16em !important;
  background:linear-gradient(90deg,#1c9ad6,#8cc63f) !important; -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important; }

/* fix: gradient must span only the surtitle text (was spanning the full-width box,
   showing only the teal middle). Make it inline-block + centred. */
.xm-sec .xm-surt{ left:50% !important; right:auto !important; transform:translateX(-50%); display:inline-block !important; white-space:nowrap; }
/* Recrutement section 6 CTA: white background + roomier padding (was cramped) */
.ifcar-recr-cta.ifcar-cta-area{ background:#fff !important; padding:64px 0 90px !important; }
/* ================= INGÉNIERIE DE FORMATION — custom page ================= */
.ig-hero, .ig-main, .ig-cta{ font-family:Outfit,"Outfit Fallback",Arial,sans-serif; }
.ig-hero .container, .ig-main .container, .ig-cta .container{ max-width:1200px; margin:0 auto; padding:0 26px; }
/* ---- HERO ---- */
.ig-hero{ position:relative; background:#fff !important; padding:26px 0 54px !important; min-height:0 !important; display:block !important; overflow:visible; }
.ig-hero::before, .ig-hero::after{ display:none !important; }
.ig-crumb{ display:flex; align-items:center; gap:9px; font-size:13.5px; color:#8a96a3; margin-bottom:30px; flex-wrap:wrap; }
.ig-crumb a{ color:#8a96a3; text-decoration:none; } .ig-crumb a:hover{ color:#1c9ad6; }
.ig-crumb b{ color:#1c9ad6; font-weight:600; } .ig-crumb i{ color:#62C414; }
.ig-hero-grid{ display:grid; grid-template-columns:0.7fr 1.55fr; gap:34px; align-items:center; }
.ig-hero-left{ min-width:0; }
.ig-eyebrow{ display:inline-block; text-transform:uppercase; letter-spacing:.16em; font-weight:800; font-size:14px; color:#62C414; margin-bottom:18px; }
.ig-h1{ margin:0; font-weight:800; font-size:clamp(32px,3.6vw,46px); line-height:1.12; color:#0c2244; letter-spacing:-.01em; }
.ig-h1 .g{ color:#1c9ad6; }
.ig-hero-deco{ display:flex; align-items:center; gap:12px; margin:22px 0 24px; }
.ig-hero-deco .l{ width:56px; height:3px; border-radius:3px; background:#1c9ad6; } .ig-hero-deco .d{ width:11px; height:11px; border-radius:50%; background:#1c9ad6; } .ig-hero-deco .r{ width:56px; height:3px; border-radius:3px; background:#62C414; }
.ig-hero-p{ margin:0 0 16px; color:#4a5a6b; font-size:16px; line-height:1.75; max-width:520px; }
.ig-hero-right{ min-width:0; position:relative; }
/* soft pulsing glow behind the blob */
.ig-hero-right::before{ content:""; position:absolute; z-index:0; top:8%; left:8%; right:2%; bottom:8%; border-radius:50%;
  background:radial-gradient(60% 60% at 55% 45%, rgba(28,154,214,.16), rgba(98,196,20,.10) 55%, rgba(28,154,214,0) 75%);
  filter:blur(26px); animation:igGlow 6s ease-in-out infinite; }
.ig-hero-card{ position:relative; z-index:1; background:transparent; border:0; box-shadow:none; border-radius:0; overflow:visible;
  transform-origin:60% 50%;
  animation:igHeroIn 1.1s cubic-bezier(.19,1,.22,1) both, igFloat 6.5s ease-in-out 1.1s infinite; }
.ig-hero-card img{ display:block; width:100%; height:auto; object-fit:contain; }
@keyframes igHeroIn{ 0%{ opacity:0; transform:translateX(46px) scale(.9) rotate(1.4deg); } 100%{ opacity:1; transform:translateX(0) scale(1) rotate(0); } }
@keyframes igFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-14px); } }
@keyframes igGlow{ 0%,100%{ opacity:.55; transform:scale(1); } 50%{ opacity:1; transform:scale(1.06); } }
@media (prefers-reduced-motion:reduce){ .ig-hero-card{ animation:igHeroIn 1.1s cubic-bezier(.19,1,.22,1) both; } .ig-hero-right::before{ animation:none; } }
/* ---- FEATURES ---- */
.ig-main{ display:block; }
.ig-feats{ background:#f5f8fc; padding:40px 0; }
.ig-feats-row{ display:flex; align-items:stretch; }
.ig-feat{ flex:1; text-align:center; padding:6px 26px; }
.ig-feat-sep{ width:1px; background:#dde5ef; margin:6px 0; }
.ig-feat-ic{ display:inline-flex; margin-bottom:14px; }
.ig-svg{ display:block; width:56px; height:56px; }
.ig-svg-plain{ width:48px; height:48px; }
.ig-feat b{ display:block; color:#0c2244; font-weight:800; font-size:16px; margin-bottom:8px; }
.ig-feat p{ margin:0; color:#6a7889; font-size:13.5px; line-height:1.6; }
/* ---- section heads ---- */
.ig-head{ text-align:center; margin-bottom:40px; }
.ig-h2{ margin:0; font-weight:800; font-size:clamp(26px,2.6vw,32px); color:#0c2244; }
.ig-h2-deco{ display:flex; align-items:center; justify-content:center; gap:12px; margin-top:14px; }
.ig-h2-deco .l{ width:70px; height:3px; border-radius:3px; background:#1c9ad6; } .ig-h2-deco .d{ width:11px; height:11px; border-radius:50%; background:#1c9ad6; } .ig-h2-deco .r{ width:70px; height:3px; border-radius:3px; background:#62C414; }
/* ---- PROCESS ---- */
.ig-proc{ background:#fff; padding:70px 0; }
.ig-proc-row{ display:flex; align-items:stretch; gap:6px; }
.ig-pcard{ position:relative; flex:1; background:#fff; border:1px solid #e7edf5; border-radius:16px; padding:34px 18px 26px; text-align:center; box-shadow:0 20px 40px -30px rgba(12,34,68,.4); transition:transform .3s ease, box-shadow .3s ease; }
.ig-pcard:hover{ transform:translateY(-5px); box-shadow:0 28px 50px -28px rgba(12,34,68,.5); }
.ig-pnum{ position:absolute; top:-16px; left:50%; transform:translateX(-50%); width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:13px; box-shadow:0 6px 14px -4px rgba(12,34,68,.5); }
.ig-pnum.b{ background:#1c9ad6; } .ig-pnum.g{ background:#62C414; }
.ig-pic{ display:inline-flex; margin:2px 0 14px; }
.ig-pic .ig-svg{ width:64px; height:64px; }
.ig-pcard b{ display:block; color:#0c2244; font-weight:800; font-size:15px; margin-bottom:10px; }
.ig-pcard p{ margin:0; color:#6a7889; font-size:13px; line-height:1.6; }
.ig-proc-arr{ flex:0 0 auto; display:flex; align-items:center; align-self:center; }
/* ---- FORMATS + DOMAINS ---- */
.ig-fd{ background:#fff; padding:20px 0 70px; }
.ig-fd-grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; }
.ig-h3{ margin:0; font-weight:800; font-size:24px; color:#0c2244; }
.ig-h3-line{ display:block; width:60px; height:3px; border-radius:3px; background:linear-gradient(90deg,#1c9ad6,#62C414); margin:12px 0 26px; }
.ig-fmt-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.ig-fmt{ display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; background:#fff; border:1px solid #e7edf5; border-radius:14px; padding:20px 10px; transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.ig-fmt-ic .ig-svg{ width:52px; height:52px; }
.ig-fmt:hover{ transform:translateY(-4px); border-color:#cfe0f5; box-shadow:0 18px 34px -24px rgba(12,34,68,.4); }
.ig-fmt span:last-child{ color:#0c2244; font-weight:700; font-size:13.5px; }
.ig-dom-list{ list-style:none; margin:6px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:20px 26px; }
.ig-dom-list li{ display:flex; align-items:center; gap:12px; color:#33465c; font-weight:600; font-size:15px; }
.ig-dom-list li svg{ flex:0 0 auto; }
/* ---- ENGAGEMENTS ---- */
.ig-engs{ background:#fff; padding:20px 0 76px; border-top:1px solid #eef2f7; }
.ig-eng-row{ display:flex; align-items:stretch; }
.ig-eng{ flex:1; text-align:center; padding:6px 22px; }
.ig-eng-sep{ width:1px; background:#e4ebf3; margin:10px 0; }
.ig-eng-ic{ display:inline-flex; margin-bottom:12px; }
.ig-eng-ic .ig-svg{ width:60px; height:60px; }
.ig-eng b{ display:block; color:#0c2244; font-weight:800; font-size:16px; margin-bottom:8px; }
.ig-eng p{ margin:0; color:#6a7889; font-size:13px; line-height:1.6; }
/* ---- CTA ---- */
.ig-cta{ background:#fff; padding:10px 0 60px; }
/* ---- RTL ---- */
[dir="rtl"] .ig-hero-p, [dir="rtl"] .ig-eyebrow, [dir="rtl"] .ig-h1{ text-align:right; }
[dir="rtl"] .ig-crumb{ flex-direction:row-reverse; }
[dir="rtl"] .ig-dom-list li{ flex-direction:row-reverse; text-align:right; }
[dir="rtl"] .ig-proc-arr svg{ transform:scaleX(-1); }
/* ---- responsive ---- */
@media (max-width:980px){
  .ig-hero-grid{ grid-template-columns:1fr; gap:32px; }
  .ig-feats-row{ flex-wrap:wrap; } .ig-feat{ flex:1 1 45%; padding:16px; } .ig-feat-sep{ display:none; }
  .ig-proc-row{ flex-wrap:wrap; } .ig-pcard{ flex:1 1 45%; margin-top:20px; } .ig-proc-arr{ display:none; }
  .ig-fd-grid{ grid-template-columns:1fr; gap:40px; }
  .ig-eng-row{ flex-wrap:wrap; } .ig-eng{ flex:1 1 45%; padding:18px; } .ig-eng-sep{ display:none; }
  .ig-cta-box{ flex-direction:column; text-align:center; }
}
@media (max-width:560px){
  .ig-feat, .ig-eng, .ig-pcard, .ig-fmt{ flex-basis:100% !important; }
  .ig-fmt-grid{ grid-template-columns:1fr 1fr; } .ig-dom-list{ grid-template-columns:1fr; }
}
/* Section titles -> same blue→green gradient as the "Nos experts" eyebrow on Accueil.
   inline-block so the gradient box hugs the text width (full blue→green range) like the eyebrow,
   instead of spanning the whole block and leaving the centered text in the teal middle. */
.ig-eyebrow, .ig-h2, .ig-h3{
  display:inline-block;
  background:linear-gradient(90deg,#1c9ad6 0%,#8cc63f 100%) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
}
/* ================= FORMATION CONTINUE INTRA-ENTREPRISE — custom page ================= */
.fc-hero, .fc-main, .fc-cta{ font-family:Outfit,"Outfit Fallback",Arial,sans-serif; }
.fc-hero .container, .fc-main .container, .fc-cta .container{ max-width:1200px; margin:0 auto; padding:0 26px; }
.fc-svg{ display:block; width:45px; height:45px; }
/* ---- HERO ---- */
.fc-hero{ position:relative; background:#fff !important; padding:26px 0 44px !important; min-height:0 !important; display:block !important; overflow:visible; }
.fc-hero::before, .fc-hero::after{ display:none !important; }
.fc-crumb{ display:flex; align-items:center; gap:9px; font-size:13.5px; color:#8a96a3; margin-bottom:30px; flex-wrap:wrap; }
.fc-crumb a{ color:#8a96a3; text-decoration:none; } .fc-crumb a:hover{ color:#1c9ad6; }
.fc-crumb b{ color:#1c9ad6; font-weight:600; } .fc-crumb i{ color:#62C414; }
.fc-hero-grid{ display:grid; grid-template-columns:0.72fr 1.5fr; gap:36px; align-items:center; }
.fc-hero-left{ min-width:0; }
.fc-eyebrow{ display:inline-block; text-transform:uppercase; letter-spacing:.16em; font-weight:800; font-size:14px; color:#62C414; margin-bottom:16px; }
.fc-h1{ margin:0; font-weight:800; font-size:clamp(34px,4vw,52px); line-height:1.08; color:#0c2244; letter-spacing:-.01em; text-transform:uppercase; }
.fc-hero-deco{ display:flex; align-items:center; gap:12px; margin:20px 0 22px; }
.fc-hero-deco .l{ width:56px; height:3px; border-radius:3px; background:#1c9ad6; } .fc-hero-deco .d{ width:11px; height:11px; border-radius:50%; background:#1c9ad6; } .fc-hero-deco .r{ width:56px; height:3px; border-radius:3px; background:#62C414; }
.fc-hero-p{ margin:0 0 16px; color:#4a5a6b; font-size:16px; line-height:1.75; max-width:520px; }
.fc-hero-right{ min-width:0; position:relative; }
.fc-hero-right::before{ content:""; position:absolute; z-index:0; top:8%; left:8%; right:2%; bottom:8%; border-radius:50%;
  background:radial-gradient(60% 60% at 55% 45%, rgba(28,154,214,.16), rgba(98,196,20,.10) 55%, rgba(28,154,214,0) 75%);
  filter:blur(26px); animation:fcGlow 6s ease-in-out infinite; }
.fc-hero-card{ position:relative; z-index:1; background:transparent; border:0; box-shadow:none; overflow:visible;
  transform-origin:60% 50%; animation:fcHeroIn 1.1s cubic-bezier(.19,1,.22,1) both, fcFloat 6.5s ease-in-out 1.1s infinite; }
.fc-hero-card img{ display:block; width:100%; height:auto; object-fit:contain; }
@keyframes fcHeroIn{ 0%{ opacity:0; transform:translateX(46px) scale(.9) rotate(1.4deg); } 100%{ opacity:1; transform:translateX(0) scale(1) rotate(0); } }
@keyframes fcFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-14px); } }
@keyframes fcGlow{ 0%,100%{ opacity:.55; transform:scale(1); } 50%{ opacity:1; transform:scale(1.06); } }
@media (prefers-reduced-motion:reduce){ .fc-hero-card{ animation:fcHeroIn 1.1s cubic-bezier(.19,1,.22,1) both; } .fc-hero-right::before{ animation:none; } }
/* ---- FEATURES ---- */
.fc-main{ display:block; }
.fc-feats{ background:#f5f8fc; padding:36px 0; }
.fc-feats-row{ display:flex; align-items:stretch; }
.fc-feat{ flex:1; text-align:center; padding:6px 26px; }
.fc-feat-sep{ width:1px; background:#dde5ef; margin:6px 0; }
.fc-feat-ic{ display:inline-flex; margin-bottom:10px; } .fc-feat-ic .fc-svg{ width:52px; height:52px; }
.fc-feat b{ display:block; color:#0c2244; font-weight:800; font-size:16px; margin-bottom:8px; }
.fc-feat p{ margin:0; color:#6a7889; font-size:13.5px; line-height:1.6; }
/* ---- section heads ---- */
.fc-head{ text-align:center; margin-bottom:40px; }
.fc-h2{ margin:0; font-weight:800; font-size:clamp(26px,2.6vw,32px); color:#0c2244; }
.fc-h2-left{ text-align:left; }
.fc-h2-deco{ display:flex; align-items:center; justify-content:center; gap:12px; margin-top:14px; }
.fc-h2-deco-left{ justify-content:flex-start; margin-bottom:40px; }
.fc-h2-deco .l{ width:70px; height:3px; border-radius:3px; background:#1c9ad6; } .fc-h2-deco .d{ width:11px; height:11px; border-radius:50%; background:#1c9ad6; } .fc-h2-deco .r{ width:70px; height:3px; border-radius:3px; background:#62C414; }
/* ---- PROCESS ---- */
.fc-proc{ background:#fff; padding:66px 0; }
.fc-proc-row{ display:flex; align-items:stretch; gap:6px; }
.fc-pcard{ position:relative; flex:1; background:#fff; border:1px solid #e7edf5; border-radius:16px; padding:34px 18px 26px; text-align:center; box-shadow:0 20px 40px -30px rgba(12,34,68,.4); transition:transform .3s ease, box-shadow .3s ease; }
.fc-pcard:hover{ transform:translateY(-5px); box-shadow:0 28px 50px -28px rgba(12,34,68,.5); }
.fc-pnum{ position:absolute; top:-16px; left:50%; transform:translateX(-50%); width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:13px; box-shadow:0 6px 14px -4px rgba(12,34,68,.5); }
.fc-pnum.b{ background:#1c9ad6; } .fc-pnum.g{ background:#62C414; }
.fc-pic{ display:inline-flex; margin:2px 0 14px; } .fc-pic .fc-svg{ width:62px; height:62px; }
.fc-pcard b{ display:block; color:#0c2244; font-weight:800; font-size:15px; margin-bottom:10px; }
.fc-pcard p{ margin:0; color:#6a7889; font-size:13px; line-height:1.6; }
.fc-proc-arr{ flex:0 0 auto; display:flex; align-items:center; align-self:center; }
/* ---- DOMAINES + FORMATS ---- */
.fc-di{ background:#fff; padding:14px 0 66px; }
.fc-di-grid{ display:grid; grid-template-columns:1.5fr 1fr; gap:48px; align-items:start; }
.fc-h3{ margin:0; font-weight:800; font-size:24px; color:#0c2244; }
.fc-h3-line{ display:block; width:60px; height:3px; border-radius:3px; background:linear-gradient(90deg,#1c9ad6,#62C414); margin:12px 0 26px; }
.fc-dom-grid{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; }
.fc-dom{ display:flex; align-items:center; gap:12px; background:#fff; border:1px solid #e7edf5; border-radius:14px; padding:16px 14px; transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.fc-dom:hover{ transform:translateY(-3px); border-color:#cfe0f5; box-shadow:0 16px 30px -22px rgba(12,34,68,.4); }
.fc-dom-ic{ flex:0 0 auto; display:inline-flex; } .fc-dom-ic .fc-svg{ width:44px; height:44px; }
.fc-dom-t{ color:#0c2244; font-weight:700; font-size:14px; line-height:1.35; }
.fc-fmt-box{ background:linear-gradient(160deg,#f2f7ff,#eaf2ff); border:1px solid #dbe8fb; border-radius:20px; padding:30px 30px; }
.fc-fmt-title{ margin:0 0 20px; font-weight:800; font-size:20px; color:#0c2244; }
.fc-fmt-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:16px; }
.fc-fmt-list li{ display:flex; align-items:center; gap:12px; color:#33465c; font-weight:600; font-size:15px; }
.fc-fmt-list li svg{ flex:0 0 auto; }
/* ---- POINTS DE FORCE ---- */
.fc-pfs{ background:#f5f8fc; padding:56px 0 66px; }
.fc-pf-grid{ display:grid; grid-template-columns:1.55fr 1fr; gap:44px; align-items:center; }
.fc-pf-row{ display:flex; align-items:stretch; }
.fc-pf{ flex:1; text-align:center; padding:6px 14px; }
.fc-pf-sep{ width:1px; background:#dde5ef; margin:10px 0; }
.fc-pf-ic{ display:inline-flex; margin-bottom:12px; } .fc-pf-ic .fc-svg{ width:52px; height:52px; }
.fc-pf b{ display:block; color:#0c2244; font-weight:800; font-size:14px; margin-bottom:8px; line-height:1.3; }
.fc-pf p{ margin:0; color:#6a7889; font-size:12.5px; line-height:1.55; }
.fc-pf-img{ border-radius:18px; overflow:hidden; box-shadow:0 34px 64px -34px rgba(12,34,68,.5); border:5px solid #fff; }
.fc-pf-img img{ display:block; width:100%; height:100%; object-fit:cover; aspect-ratio:4/3.4; }
/* ---- CTA ---- */
.fc-cta{ background:#f5f8fc; padding:0 0 56px; }
/* ---- RTL ---- */
[dir="rtl"] .fc-hero-p, [dir="rtl"] .fc-eyebrow, [dir="rtl"] .fc-h1{ text-align:right; }
[dir="rtl"] .fc-crumb{ flex-direction:row-reverse; }
[dir="rtl"] .fc-dom, [dir="rtl"] .fc-fmt-list li{ flex-direction:row-reverse; text-align:right; }
[dir="rtl"] .fc-h2-left, [dir="rtl"] .fc-h3{ text-align:right; }
[dir="rtl"] .fc-h2-deco-left{ justify-content:flex-end; }
[dir="rtl"] .fc-proc-arr svg{ transform:scaleX(-1); }
/* ---- responsive ---- */
@media (max-width:980px){
  .fc-hero-grid{ grid-template-columns:1fr; gap:30px; }
  .fc-feats-row{ flex-wrap:wrap; } .fc-feat{ flex:1 1 45%; padding:16px; } .fc-feat-sep{ display:none; }
  .fc-proc-row{ flex-wrap:wrap; } .fc-pcard{ flex:1 1 45%; margin-top:20px; } .fc-proc-arr{ display:none; }
  .fc-di-grid{ grid-template-columns:1fr; gap:36px; }
  .fc-pf-grid{ grid-template-columns:1fr; gap:32px; }
  .fc-pf-row{ flex-wrap:wrap; } .fc-pf{ flex:1 1 45%; padding:16px; } .fc-pf-sep{ display:none; }
  .fc-cta-box{ flex-direction:column; text-align:center; }
}
@media (max-width:560px){
  .fc-feat, .fc-pf, .fc-pcard{ flex-basis:100% !important; }
  .fc-dom-grid{ grid-template-columns:1fr; }
}
/* FC page titles -> same blue→green gradient as the "Nos experts" eyebrow on Accueil.
   inline-block so the gradient box hugs the text width (full blue→green range). */
.fc-eyebrow, .fc-h2, .fc-h3, .fc-fmt-title{
  display:inline-block;
  background:linear-gradient(90deg,#1c9ad6 0%,#8cc63f 100%) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
}
/* ================= SÉMINAIRES INTERENTREPRISES ET GRAND PUBLIC — custom page ================= */
.sm-hero, .sm-main, .sm-cta{ font-family:Outfit,"Outfit Fallback",Arial,sans-serif; }
.sm-hero .container, .sm-main .container, .sm-cta .container{ max-width:1200px; margin:0 auto; padding:0 26px; }
.sm-svg{ display:block; width:48px; height:48px; }
/* ---- HERO ---- */
.sm-hero{ position:relative; background:#fff !important; padding:26px 0 44px !important; min-height:0 !important; display:block !important; overflow:visible; }
.sm-hero::before, .sm-hero::after{ display:none !important; }
.sm-crumb{ display:flex; align-items:center; gap:9px; font-size:13.5px; color:#8a96a3; margin-bottom:30px; flex-wrap:wrap; }
.sm-crumb a{ color:#8a96a3; text-decoration:none; } .sm-crumb a:hover{ color:#1c9ad6; }
.sm-crumb b{ color:#1c9ad6; font-weight:600; } .sm-crumb i{ color:#62C414; }
.sm-hero-grid{ display:grid; grid-template-columns:0.82fr 1.4fr; gap:36px; align-items:center; }
.sm-hero-left{ min-width:0; }
.sm-eyebrow{ display:inline-block; text-transform:uppercase; letter-spacing:.16em; font-weight:800; font-size:14px; color:#62C414; margin-bottom:16px; }
.sm-h1{ margin:0; font-weight:800; font-size:clamp(30px,3.4vw,44px); line-height:1.1; color:#0c2244; letter-spacing:-.01em; text-transform:uppercase; }
.sm-hero-deco{ display:flex; align-items:center; gap:12px; margin:20px 0 22px; }
.sm-hero-deco .l{ width:56px; height:3px; border-radius:3px; background:#1c9ad6; } .sm-hero-deco .d{ width:11px; height:11px; border-radius:50%; background:#1c9ad6; } .sm-hero-deco .r{ width:56px; height:3px; border-radius:3px; background:#62C414; }
.sm-hero-p{ margin:0 0 16px; color:#4a5a6b; font-size:16px; line-height:1.75; max-width:520px; }
.sm-hero-right{ min-width:0; position:relative; }
.sm-hero-right::before{ content:""; position:absolute; z-index:0; top:8%; left:8%; right:2%; bottom:8%; border-radius:50%;
  background:radial-gradient(60% 60% at 55% 45%, rgba(28,154,214,.16), rgba(98,196,20,.10) 55%, rgba(28,154,214,0) 75%);
  filter:blur(26px); animation:smGlow 6s ease-in-out infinite; }
.sm-hero-card{ position:relative; z-index:1; background:transparent; overflow:visible;
  transform-origin:60% 50%; animation:smHeroIn 1.1s cubic-bezier(.19,1,.22,1) both, smFloat 6.5s ease-in-out 1.1s infinite; }
.sm-hero-card img{ display:block; width:100%; height:auto; object-fit:contain; }
@keyframes smHeroIn{ 0%{ opacity:0; transform:translateX(46px) scale(.9) rotate(1.4deg); } 100%{ opacity:1; transform:translateX(0) scale(1) rotate(0); } }
@keyframes smFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-14px); } }
@keyframes smGlow{ 0%,100%{ opacity:.55; transform:scale(1); } 50%{ opacity:1; transform:scale(1.06); } }
@media (prefers-reduced-motion:reduce){ .sm-hero-card{ animation:smHeroIn 1.1s cubic-bezier(.19,1,.22,1) both; } .sm-hero-right::before{ animation:none; } }
/* ---- FEATURES ---- */
.sm-main{ display:block; }
.sm-feats{ background:#f5f8fc; padding:34px 0; }
.sm-feats-row{ display:flex; align-items:stretch; }
.sm-feat{ flex:1; text-align:center; padding:6px 22px; display:flex; flex-direction:column; align-items:center; }
.sm-feat-sep{ width:1px; background:#dde5ef; margin:6px 0; }
.sm-feat-ic{ display:inline-flex; margin-bottom:10px; } .sm-feat-ic .sm-svg{ width:57px; height:57px; }
.sm-feat b{ display:block; color:#0c2244; font-weight:800; font-size:15px; line-height:1.35; max-width:180px; }
/* ---- section heads ---- */
.sm-head{ text-align:center; margin-bottom:40px; }
.sm-h2{ margin:0; font-weight:800; font-size:clamp(26px,2.6vw,32px); color:#0c2244; }
.sm-h2-deco{ display:flex; align-items:center; justify-content:center; gap:12px; margin-top:14px; }
.sm-h2-deco .l{ width:70px; height:3px; border-radius:3px; background:#1c9ad6; } .sm-h2-deco .d{ width:11px; height:11px; border-radius:50%; background:#1c9ad6; } .sm-h2-deco .r{ width:70px; height:3px; border-radius:3px; background:#62C414; }
/* ---- PROCESS ---- */
.sm-proc{ background:#fff; padding:60px 0; }
.sm-proc-row{ display:flex; align-items:stretch; gap:6px; }
.sm-pcard{ position:relative; flex:1; background:#fff; border:1px solid #e7edf5; border-radius:16px; padding:34px 16px 26px; text-align:center; box-shadow:0 20px 40px -30px rgba(12,34,68,.4); transition:transform .3s ease, box-shadow .3s ease; }
.sm-pcard:hover{ transform:translateY(-5px); box-shadow:0 28px 50px -28px rgba(12,34,68,.5); }
.sm-pnum{ position:absolute; top:-16px; left:50%; transform:translateX(-50%); width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:13px; box-shadow:0 6px 14px -4px rgba(12,34,68,.5); }
.sm-pnum.b{ background:#1c9ad6; } .sm-pnum.g{ background:#62C414; }
.sm-pic{ display:inline-flex; margin:2px 0 14px; } .sm-pic .sm-svg{ width:72px; height:72px; }
.sm-pcard b{ display:block; color:#0c2244; font-weight:800; font-size:15px; margin-bottom:10px; }
.sm-pcard p{ margin:0; color:#6a7889; font-size:13px; line-height:1.6; }
.sm-proc-arr{ flex:0 0 auto; display:flex; align-items:center; align-self:center; }
/* ---- THÉMATIQUES + POURQUOI ---- */
.sm-tp{ background:#fff; padding:14px 0 62px; }
.sm-tp-grid{ display:grid; grid-template-columns:1.6fr 1fr; gap:48px; align-items:start; }
.sm-h3{ margin:0; font-weight:800; font-size:24px; color:#0c2244; }
.sm-h3-line{ display:block; width:60px; height:3px; border-radius:3px; background:linear-gradient(90deg,#1c9ad6,#62C414); margin:12px 0 26px; }
.sm-theme-grid{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; }
.sm-theme{ display:flex; align-items:center; gap:11px; background:#fff; border:1px solid #e7edf5; border-radius:14px; padding:14px 12px; transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.sm-theme:hover{ transform:translateY(-3px); border-color:#cfe0f5; box-shadow:0 16px 30px -22px rgba(12,34,68,.4); }
.sm-theme-ic{ flex:0 0 auto; display:inline-flex; } .sm-theme-ic .sm-svg{ width:42px; height:42px; }
.sm-theme-t{ color:#0c2244; font-weight:700; font-size:13.5px; line-height:1.3; }
.sm-pq-box{ background:linear-gradient(160deg,#f2f7ff,#eaf2ff); border:1px solid #dbe8fb; border-radius:20px; padding:30px 30px; }
.sm-pq-title{ margin:0 0 20px; font-weight:800; font-size:20px; color:#1c9ad6; }
.sm-pq-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:16px; }
.sm-pq-list li{ display:flex; align-items:center; gap:12px; color:#33465c; font-weight:600; font-size:14.5px; }
.sm-pq-list li svg{ flex:0 0 auto; }
/* ---- ATOUTS ---- */
.sm-atouts{ background:#f5f8fc; padding:52px 0 62px; }
.sm-atout-row{ display:flex; align-items:stretch; }
.sm-atout{ flex:1; text-align:center; padding:6px 16px; }
.sm-atout-sep{ width:1px; background:#dde5ef; margin:10px 0; }
.sm-atout-ic{ display:inline-flex; margin-bottom:12px; } .sm-atout-ic .sm-svg{ width:60px; height:60px; }
.sm-atout b{ display:block; color:#0c2244; font-weight:800; font-size:14.5px; margin-bottom:8px; line-height:1.3; }
.sm-atout p{ margin:0; color:#6a7889; font-size:12.5px; line-height:1.55; }
/* ---- CTA ---- */
.sm-cta{ background:#f5f8fc; padding:0 0 56px; }
/* ---- RTL ---- */
[dir="rtl"] .sm-hero-p, [dir="rtl"] .sm-eyebrow, [dir="rtl"] .sm-h1{ text-align:right; }
[dir="rtl"] .sm-crumb{ flex-direction:row-reverse; }
[dir="rtl"] .sm-theme, [dir="rtl"] .sm-pq-list li{ flex-direction:row-reverse; text-align:right; }
[dir="rtl"] .sm-h3{ text-align:right; }
[dir="rtl"] .sm-proc-arr svg{ transform:scaleX(-1); }
/* ---- responsive ---- */
@media (max-width:980px){
  .sm-hero-grid{ grid-template-columns:1fr; gap:30px; }
  .sm-feats-row{ flex-wrap:wrap; } .sm-feat{ flex:1 1 45%; padding:16px; } .sm-feat-sep{ display:none; }
  .sm-proc-row{ flex-wrap:wrap; } .sm-pcard{ flex:1 1 45%; margin-top:20px; } .sm-proc-arr{ display:none; }
  .sm-tp-grid{ grid-template-columns:1fr; gap:36px; }
  .sm-atout-row{ flex-wrap:wrap; } .sm-atout{ flex:1 1 30%; padding:16px; } .sm-atout-sep{ display:none; }
  .sm-cta-box{ flex-direction:column; text-align:center; }
}
@media (max-width:560px){
  .sm-feat, .sm-pcard{ flex-basis:100% !important; } .sm-atout{ flex-basis:45% !important; }
  .sm-theme-grid{ grid-template-columns:1fr; }
}
/* SÉMINAIRES page titles -> same blue→green gradient as the "Nos experts" eyebrow on Accueil.
   inline-block so the gradient box hugs the text width. h1 stays navy. */
.sm-eyebrow, .sm-h2, .sm-h3, .sm-pq-title{
  display:inline-block;
  background:linear-gradient(90deg,#1c9ad6 0%,#8cc63f 100%) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
}
/* ================= CONSEIL RH & ACCOMPAGNEMENT STRATÉGIQUE — custom page ================= */
.cons-hero, .cons-main, .cons-cta{ font-family:Outfit,"Outfit Fallback",Arial,sans-serif; }
.cons-hero .container, .cons-main .container, .cons-cta .container{ max-width:1200px; margin:0 auto; padding:0 26px; }
@keyframes consHeroIn{ 0%{ opacity:0; transform:translateX(46px) scale(.9) rotate(1.4deg); } 100%{ opacity:1; transform:translateX(0) scale(1) rotate(0); } }
@keyframes consFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-14px); } }
@keyframes consGlow{ 0%,100%{ opacity:.55; transform:scale(1); } 50%{ opacity:1; transform:scale(1.06); } }
/* ---- section heads ---- */
.cons-main{ display:block; background:#fff; }
/* ---- CTA ---- */
.cons-cta{ background:#fff; padding:0 0 56px; }
/* ---- responsive ---- */
@media (max-width:980px){
  .cons-hero-grid{ grid-template-columns:1fr; gap:28px; }
  .cons-stats{ gap:16px; } .cons-stat{ flex:1 1 44%; }
  .cons-proc-row{ flex-wrap:wrap; gap:24px; } .cons-pcard{ flex:1 1 45%; } .cons-proc-row .cons-dots{ display:none; }
  .cons-di-grid{ grid-template-columns:1fr; gap:34px; }
  .cons-meth-row{ flex-wrap:wrap; gap:18px; } .cons-mcard{ flex:1 1 45%; } .cons-meth-row .cons-dots{ display:none; }
  .cons-eng-row{ flex-wrap:wrap; } .cons-eng{ flex:1 1 30%; padding:16px; } .cons-eng-sep{ display:none; }
  .cons-cta-box{ flex-direction:column; text-align:center; }
}
/* ================= ACCOMPAGNEMENT INDIVIDUEL — custom page ================= */
.acc-hero, .acc-main{ font-family:Outfit,"Outfit Fallback",Arial,sans-serif; }
.acc-hero .container, .acc-main .container{ max-width:1200px; margin:0 auto; padding:0 26px; }
@keyframes accHeroIn{ 0%{ opacity:0; transform:translateX(46px) scale(.9) rotate(1.4deg); } 100%{ opacity:1; transform:translateX(0) scale(1) rotate(0); } }
@keyframes accFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-14px); } }
@keyframes accGlow{ 0%,100%{ opacity:.55; transform:scale(1); } 50%{ opacity:1; transform:scale(1.06); } }
/* ---- section heads ---- */
.acc-main{ display:block; background:#fff; }
.acc-main section{ padding:24px 0; }
.acc-tem{ background:#f5f8fc; border:1px solid #eef2f7; border-radius:14px; padding:24px 24px 20px; display:flex; flex-direction:column; }
.acc-tem p{ margin:0 0 18px; color:#4a5a6b; font-size:13.5px; line-height:1.65; font-style:italic; flex:1; }
/* ---- responsive ---- */
@media (max-width:980px){
  .acc-hero-grid{ grid-template-columns:1fr; gap:28px; }
  .acc-obj-row, .acc-pub-row{ flex-wrap:wrap; } .acc-obj{ flex:1 1 30%; } .acc-pub{ flex:1 1 45%; } .acc-obj-sep, .acc-pub-sep{ display:none; }
  .acc-sol-grid{ grid-template-columns:1fr 1fr; }
  .acc-dem-row{ flex-wrap:wrap; } .acc-dcard{ flex:1 1 30%; }
  .acc-tem-row{ grid-template-columns:1fr; }
  .acc-form-grid{ grid-template-columns:1fr; gap:28px; }
}
/* ===== ACCOMPAGNEMENT: gradient titles, blue→green button, form wow animations ===== */
/* titles gradient (like "Nos experts" on Accueil) */
.acc-eyebrow, .acc-h2, .acc-h3{
  display:inline-block;
  background:linear-gradient(90deg,#1c9ad6 0%,#8cc63f 100%) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
}
/* DEMANDER UN ACCOMPAGNEMENT: blue by default, slides to green on hover + shine (like Prendre conseil) */
.acc-hero-btn{
  background:#1c9ad6 !important;
  position:relative; overflow:hidden;
  box-shadow:0 16px 30px -12px rgba(28,154,214,.5);
  transition:background-position .5s cubic-bezier(.2,.7,.2,1), box-shadow .3s ease, transform .3s ease;
}
@keyframes accShine{ 0%{ left:-60%; } 55%,100%{ left:130%; } }
@keyframes accPulse{ 0%,100%{ box-shadow:0 16px 30px -12px rgba(12,27,62,.5), 0 0 0 0 rgba(98,196,20,.5); } 50%{ box-shadow:0 16px 30px -12px rgba(12,27,62,.5), 0 0 0 8px rgba(98,196,20,0); } }
/* Témoignages: continuous WOW — shimmer sweep over the quote text + gentle staggered float + quote pulse */
.acc-tem{ animation:temFloat 5s ease-in-out infinite; }
.acc-tem:nth-child(2){ animation-delay:.9s; }
.acc-tem:nth-child(3){ animation-delay:1.8s; }
@keyframes temFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-8px); } }
@keyframes temQuote{ 0%,100%{ transform:scale(1); opacity:.8; } 50%{ transform:scale(1.14); opacity:1; } }
.acc-tem p{
  background:linear-gradient(100deg,#4a5a6b 0%,#4a5a6b 42%,#7cbf42 49%,#1c9ad6 54%,#4a5a6b 62%,#4a5a6b 100%);
  background-size:230% 100%; background-position:190% 0;
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
  animation:temShimmer 5s linear infinite;
}
.acc-tem:nth-child(2) p{ animation-delay:.8s; }
.acc-tem:nth-child(3) p{ animation-delay:1.6s; }
@keyframes temShimmer{ 0%{ background-position:190% 0; } 100%{ background-position:-90% 0; } }
@media (prefers-reduced-motion:reduce){ .acc-tem, .acc-tem-q, .acc-tem p{ animation:none !important; } .acc-tem p{ -webkit-text-fill-color:#4a5a6b; color:#4a5a6b; } }
/* Témoignages: replace shimmer with a clean rotating SPOTLIGHT wow (one card highlighted at a time, looping) */
.acc-tem p{ background:none !important; -webkit-text-fill-color:#4a5a6b !important; color:#4a5a6b !important; animation:none !important; }
.acc-tem{ animation:temSpot 9s ease-in-out infinite !important; will-change:transform, box-shadow; }
.acc-tem:nth-child(1){ animation-delay:0s !important; }
.acc-tem:nth-child(2){ animation-delay:3s !important; }
.acc-tem:nth-child(3){ animation-delay:6s !important; }
@keyframes temSpot{
  0%{ transform:translateY(0) scale(1); box-shadow:0 12px 30px -24px rgba(12,34,68,.25); border-color:#eef2f7; }
  6%{ transform:translateY(-12px) scale(1.04); box-shadow:0 30px 56px -22px rgba(28,154,214,.42); border-color:#8cc63f; }
  20%{ transform:translateY(-12px) scale(1.04); box-shadow:0 30px 56px -22px rgba(28,154,214,.42); border-color:#8cc63f; }
  30%,100%{ transform:translateY(0) scale(1); box-shadow:0 12px 30px -24px rgba(12,34,68,.25); border-color:#eef2f7; }
}
/* accent bar that lights up on the active card */
.acc-tem{ position:relative; overflow:hidden; }
.acc-tem::before{ content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:linear-gradient(90deg,#1c9ad6,#8cc63f); transform:scaleX(0); transform-origin:left; animation:temBar 9s ease-in-out infinite; }
.acc-tem:nth-child(1)::before{ animation-delay:0s; }
.acc-tem:nth-child(2)::before{ animation-delay:3s; }
.acc-tem:nth-child(3)::before{ animation-delay:6s; }
@keyframes temBar{ 0%{ transform:scaleX(0); } 6%{ transform:scaleX(1); } 20%{ transform:scaleX(1); } 27%,100%{ transform:scaleX(0); transform-origin:right; } }
@media (prefers-reduced-motion:reduce){ .acc-tem, .acc-tem::before{ animation:none !important; } }
/* ================= FORMATION (hub des 3 approches) — custom page ================= */
.form-hero, .form-main, .form-cta{ font-family:Outfit,"Outfit Fallback",Arial,sans-serif; }
.form-hero .container, .form-main .container, .form-cta .container{ max-width:1200px; margin:0 auto; padding:0 26px; }
.form-svg{ display:block; width:60px; height:60px; }
/* ---- HERO ---- */
.form-hero{ position:relative; background:#fff !important; padding:26px 0 34px !important; min-height:0 !important; display:block !important; overflow:visible; }
.form-hero::before, .form-hero::after{ display:none !important; }
.form-crumb{ display:flex; align-items:center; gap:9px; font-size:13.5px; color:#8a96a3; margin-bottom:26px; flex-wrap:wrap; }
.form-crumb a{ color:#8a96a3; text-decoration:none; } .form-crumb a:hover{ color:#1c9ad6; }
.form-crumb b{ color:#1c9ad6; font-weight:600; } .form-crumb i{ color:#62C414; }
.form-hero-grid{ display:grid; grid-template-columns:0.85fr 1.35fr; gap:36px; align-items:center; }
.form-hero-left{ min-width:0; }
.form-eyebrow{ display:inline-block; text-transform:uppercase; letter-spacing:.15em; font-weight:800; font-size:14px; color:#62C414; margin-bottom:14px; }
.form-h1{ margin:0; font-weight:800; font-size:clamp(30px,3.4vw,45px); line-height:1.14; letter-spacing:-.01em; }
.form-h1 .n{ color:#0c2244; } .form-h1 .g{ color:#1c9ad6; }
.form-hero-deco{ display:flex; align-items:center; gap:12px; margin:20px 0 20px; }
.form-hero-deco .l{ width:56px; height:3px; border-radius:3px; background:#1c9ad6; } .form-hero-deco .d{ width:11px; height:11px; border-radius:50%; background:#1c9ad6; } .form-hero-deco .r{ width:56px; height:3px; border-radius:3px; background:#62C414; }
.form-hero-p{ margin:0; color:#4a5a6b; font-size:15.5px; line-height:1.75; max-width:500px; }
.form-hero-right{ min-width:0; position:relative; }
.form-hero-right::before{ content:""; position:absolute; z-index:0; top:8%; left:8%; right:2%; bottom:8%; border-radius:50%;
  background:radial-gradient(60% 60% at 55% 45%, rgba(28,154,214,.16), rgba(98,196,20,.09) 55%, rgba(28,154,214,0) 75%);
  filter:blur(26px); animation:formGlow 6s ease-in-out infinite; }
.form-hero-card{ position:relative; z-index:1; background:transparent; overflow:visible;
  transform-origin:60% 50%; animation:formHeroIn 1.1s cubic-bezier(.19,1,.22,1) both, formFloat 6.5s ease-in-out 1.1s infinite; }
.form-hero-card img{ display:block; width:100%; height:auto; object-fit:contain; }
@keyframes formHeroIn{ 0%{ opacity:0; transform:translateX(46px) scale(.9) rotate(1.4deg); } 100%{ opacity:1; transform:translateX(0) scale(1) rotate(0); } }
@keyframes formFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-14px); } }
@keyframes formGlow{ 0%,100%{ opacity:.55; transform:scale(1); } 50%{ opacity:1; transform:scale(1.06); } }
@media (prefers-reduced-motion:reduce){ .form-hero-card{ animation:formHeroIn 1.1s cubic-bezier(.19,1,.22,1) both; } .form-hero-right::before{ animation:none; } }
/* ---- hero features ---- */
.form-feats{ display:flex; align-items:stretch; margin-top:30px; }
.form-feat{ flex:1; text-align:center; padding:6px 20px; }
.form-feat-sep{ width:1px; background:#dde5ef; margin:6px 0; }
.form-feat-ic{ display:inline-flex; margin-bottom:9px; } .form-feat-ic .form-svg{ width:54px; height:54px; }
.form-feat b{ display:block; color:#0c2244; font-weight:800; font-size:13.5px; line-height:1.35; }
/* ---- APPROCHES ---- */
.form-main{ display:block; background:#fff; }
.form-appr{ padding:56px 0 60px; }
.form-head{ text-align:center; margin-bottom:40px; }
.form-h2{ margin:0; font-weight:800; font-size:clamp(24px,2.6vw,32px); color:#0c2244; }
.form-h2-deco{ display:flex; align-items:center; justify-content:center; gap:12px; margin-top:14px; }
.form-h2-deco .l{ width:52px; height:3px; border-radius:3px; background:#1c9ad6; } .form-h2-deco .d{ width:10px; height:10px; border-radius:50%; background:#1c9ad6; } .form-h2-deco .r{ width:52px; height:3px; border-radius:3px; background:#62C414; }
.form-sub{ margin:18px auto 0; color:#5b6b7f; font-size:15px; max-width:640px; }
/* ---- STRIP ---- */
.form-strip{ display:flex; align-items:stretch; background:#f5f8fc; border-radius:16px; padding:22px 10px; margin-top:26px; }
.form-strip-i{ flex:1; text-align:center; padding:6px 12px; }
.form-strip-ic{ display:inline-flex; margin-bottom:10px; } .form-strip-ic .form-svg{ width:56px; height:56px; }
.form-strip-i b{ display:block; color:#0c2244; font-weight:800; font-size:13.5px; line-height:1.35; }
/* ---- CTA ---- */
.form-cta{ background:#fff; padding:0 0 56px; }
/* ---- RTL ---- */
[dir="rtl"] .form-hero-p, [dir="rtl"] .form-eyebrow, [dir="rtl"] .form-h1{ text-align:right; }
[dir="rtl"] .form-crumb{ flex-direction:row-reverse; }
/* ---- responsive ---- */
@media (max-width:980px){
  .form-hero-grid{ grid-template-columns:1fr; gap:28px; }
  .form-feats{ flex-wrap:wrap; } .form-feat{ flex:1 1 45%; padding:14px; } .form-feat-sep{ display:none; }
  .form-cards{ grid-template-columns:1fr; max-width:460px; margin:0 auto; }
  .form-strip{ flex-wrap:wrap; } .form-strip-i{ flex:1 1 30%; padding:14px; }
  .form-cta-box{ flex-direction:column; text-align:center; }
}
@media (max-width:560px){
  .form-feat, .form-strip-i{ flex-basis:45% !important; }
}
/* FORMATION hub titles -> same blue→green gradient as the "Nos experts" eyebrow on Accueil */
.form-eyebrow, .form-h2{
  display:inline-block;
  background:linear-gradient(90deg,#1c9ad6 0%,#8cc63f 100%) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  -webkit-text-fill-color:transparent !important; color:transparent !important;
}
/* ================= RECRUTEMENT (hub des 3 approches) — custom page ================= */
.rech-hero, .rech-main, .rech-cta{ font-family:Outfit,"Outfit Fallback",Arial,sans-serif; }
.rech-hero .container, .rech-main .container, .rech-cta .container{ max-width:1200px; margin:0 auto; padding:0 26px; }
.rech-svg{ display:block; width:56px; height:56px; }
/* ---- HERO ---- */
.rech-hero{ position:relative; background:#fff !important; padding:26px 0 34px !important; min-height:0 !important; display:block !important; overflow:visible; }
.rech-hero::before, .rech-hero::after{ display:none !important; }
.rech-crumb{ display:flex; align-items:center; gap:9px; font-size:13.5px; color:#8a96a3; margin-bottom:24px; flex-wrap:wrap; }
.rech-crumb a{ color:#8a96a3; text-decoration:none; } .rech-crumb a:hover{ color:#1c9ad6; }
.rech-crumb b{ color:#1c9ad6; font-weight:600; } .rech-crumb i{ color:#62C414; }
.rech-hero-grid{ display:grid; grid-template-columns:0.92fr 1.15fr; gap:40px; align-items:center; }
.rech-hero-left{ min-width:0; }
.rech-eyebrow{ display:inline-block; text-transform:uppercase; letter-spacing:.15em; font-weight:800; font-size:14px; color:#62C414; margin-bottom:14px; }
.rech-h1{ margin:0; font-weight:800; font-size:clamp(32px,3.7vw,50px); line-height:1.1; letter-spacing:-.01em; }
.rech-h1 .n{ color:#0c2244; } .rech-h1 .g{ color:#62C414; }
.rech-hero-deco{ display:flex; align-items:center; gap:12px; margin:20px 0 20px; }
.rech-hero-deco .l{ width:56px; height:3px; border-radius:3px; background:#1c9ad6; } .rech-hero-deco .d{ width:11px; height:11px; border-radius:50%; background:#1c9ad6; } .rech-hero-deco .r{ width:56px; height:3px; border-radius:3px; background:#62C414; }
.rech-hero-p{ margin:0; color:#4a5a6b; font-size:15.5px; line-height:1.75; max-width:460px; }
.rech-hero-right{ position:relative; min-width:0; display:flex; justify-content:flex-end; }
.rech-hero-photo{ position:relative; width:100%; max-width:600px; border-radius:0; overflow:visible; box-shadow:none; background:none; animation:rechIn 1s cubic-bezier(.19,1,.22,1) both; }
.rech-hero-photo img{ display:block; width:100%; height:auto; object-fit:contain; aspect-ratio:auto; }
@keyframes rechIn{ 0%{ opacity:0; transform:translateY(20px) scale(.97); } 100%{ opacity:1; transform:none; } }
.rech-job{ position:absolute; right:-6px; bottom:-18px; width:210px; background:#fff; border-radius:16px; padding:18px 18px 16px; box-shadow:0 26px 50px -24px rgba(12,34,68,.5); text-align:center; animation:rechInJob 1.1s .3s cubic-bezier(.19,1,.22,1) both, rechJobFloat 3.6s ease-in-out 1.5s infinite, rechJobGlow 2.8s ease-in-out 1.5s infinite; }
@keyframes rechJobFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-8px); } }
@keyframes rechJobGlow{ 0%,100%{ box-shadow:0 26px 50px -24px rgba(12,34,68,.5), 0 0 0 0 rgba(98,196,20,.5); } 50%{ box-shadow:0 30px 56px -22px rgba(12,34,68,.55), 0 0 0 12px rgba(98,196,20,0); } }
.rech-job-ic{ display:inline-flex; width:44px; height:44px; margin-bottom:8px; } .rech-job-ic svg{ width:100%; height:100%; }
.rech-job p{ margin:0 0 12px; color:#33465c; font-size:12.5px; line-height:1.45; font-weight:600; }
.rech-job-btn{ position:relative; overflow:hidden; display:inline-flex; align-items:center; gap:8px; background:linear-gradient(90deg,#7fbf2f,#62C414,#7fbf2f); background-size:200% 100%; color:#fff !important; font-weight:800; font-size:12.5px; padding:11px 16px; border-radius:30px; text-decoration:none; box-shadow:0 12px 24px -10px rgba(98,196,20,.55); transition:transform .3s ease, box-shadow .3s ease; animation:rechJobBtnFlow 4s ease-in-out infinite, rechJobBtnPulse 2.2s ease-in-out infinite; }
.rech-job-btn::after{ content:""; position:absolute; top:0; left:-70%; width:45%; height:100%; transform:skewX(-20deg); background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.6),rgba(255,255,255,0)); animation:rechJobShine 3s ease-in-out infinite; }
.rech-job-btn:hover{ animation-play-state:paused; transform:translateY(-2px) scale(1.03); color:#fff !important; box-shadow:0 18px 32px -10px rgba(98,196,20,.7); } .rech-job-btn i{ font-size:11px; position:relative; z-index:1; transition:transform .3s ease; }
.rech-job-btn:hover i{ transform:translateX(3px); }
.rech-job-btn span, .rech-job-btn>*{ position:relative; z-index:1; }
@keyframes rechJobBtnFlow{ 0%,100%{ background-position:0% 50%; } 50%{ background-position:100% 50%; } }
@keyframes rechJobBtnPulse{ 0%,100%{ transform:translateY(0) scale(1); } 50%{ transform:translateY(-1px) scale(1.035); } }
@keyframes rechJobShine{ 0%{ left:-70%; } 55%,100%{ left:135%; } }
@keyframes rechInJob{ 0%{ opacity:0; transform:translateY(16px) scale(.92); } 100%{ opacity:1; transform:none; } }
/* ---- hero features ---- */
.rech-feats{ display:flex; align-items:stretch; margin-top:34px; }
.rech-feat{ flex:1; text-align:center; padding:6px 18px; }
.rech-feat-sep{ width:1px; background:#dde5ef; margin:6px 0; }
.rech-feat-ic{ display:inline-flex; margin-bottom:9px; } .rech-feat-ic .rech-svg{ width:52px; height:52px; }
.rech-feat b{ display:block; color:#0c2244; font-weight:800; font-size:13.5px; line-height:1.35; }
/* ---- APPROCHES ---- */
.rech-main{ display:block; background:#fff; }
.rech-appr{ padding:52px 0 60px; }
.rech-head{ text-align:center; margin-bottom:40px; }
.rech-h2{ margin:0; font-weight:800; font-size:clamp(24px,2.6vw,32px); color:#0c2244; }
.rech-h2-deco{ display:flex; align-items:center; justify-content:center; gap:12px; margin-top:14px; }
.rech-h2-deco .l{ width:52px; height:3px; border-radius:3px; background:#1c9ad6; } .rech-h2-deco .d{ width:10px; height:10px; border-radius:50%; background:#1c9ad6; } .rech-h2-deco .r{ width:52px; height:3px; border-radius:3px; background:#62C414; }
.rech-sub{ margin:18px auto 0; color:#5b6b7f; font-size:15px; max-width:600px; }
.rech-cards{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:22px; }
.rech-card{ display:block; position:relative; background:#fff; border:1px solid #e7edf5; border-radius:18px; padding:36px 26px 30px; text-align:center; box-shadow:0 24px 46px -32px rgba(12,34,68,.4); transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease; overflow:hidden; text-decoration:none; }
.rech-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px; }
.rech-card-b::before{ background:linear-gradient(90deg,#1c9ad6,#29abe2); } .rech-card-g::before{ background:linear-gradient(90deg,#62C414,#8cc63f); }
.rech-card:hover{ transform:translateY(-8px); box-shadow:0 34px 62px -28px rgba(12,34,68,.5); }
.rech-card-b:hover{ border-color:#bcd8fb; } .rech-card-g:hover{ border-color:#cfe8b0; }
.rech-cic{ display:inline-flex; align-items:center; justify-content:center; margin-bottom:16px; }
.rech-cic svg{ width:48px; height:48px; }
/* recrutement approach cards: standalone big icons (no circle background) */
.rech-card .rech-cic{ width:auto; height:auto; background:none; border-radius:0; }
.rech-card .rech-cic .rech-svg{ width:190px; height:190px; }
@keyframes rechIcoFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-7px); } }
.rech-card:hover .rech-cic .rech-svg{ animation:rechIcoFloat 2.4s ease-in-out infinite; }
.rech-ctitle{ display:block; color:#0c2244; font-weight:800; font-size:18px; line-height:1.25; margin-bottom:0; min-height:48px; }
.rech-cdiv{ display:block; width:60px; height:3px; border-radius:3px; background:#e2e9f4; margin:18px auto 20px; }
.rech-clist{ list-style:none; margin:0 0 22px; padding:0; display:flex; flex-direction:column; gap:13px; text-align:left; max-width:230px; margin-left:auto; margin-right:auto; }
.rech-clist li{ display:flex; align-items:center; gap:11px; color:#33465c; font-weight:600; font-size:14.5px; }
.rech-clist li svg{ flex:0 0 auto; }
.rech-cmore{ display:inline-flex; align-items:center; gap:8px; font-weight:800; font-size:13.5px; text-transform:uppercase; letter-spacing:.03em; opacity:0; transform:translateY(6px); transition:opacity .3s ease, transform .3s ease; }
.rech-card-b .rech-cmore{ color:#1c9ad6; } .rech-card-g .rech-cmore{ color:#62C414; }
.rech-card:hover .rech-cmore{ opacity:1; transform:translateY(0); }
.rech-cmore i{ transition:transform .3s ease; } .rech-card:hover .rech-cmore i{ transform:translateX(4px); }
/* ---- STRIP ---- */
.rech-strip{ display:flex; align-items:stretch; margin-top:36px; }
.rech-strip-i{ flex:1; text-align:center; padding:6px 12px; position:relative; }
.rech-strip-i:not(:last-child)::after{ content:""; position:absolute; right:0; top:16px; bottom:16px; width:1px; background:#e4ebf3; }
.rech-strip-ic{ display:inline-flex; margin-bottom:10px; } .rech-strip-ic .rech-svg{ width:56px; height:56px; }
.rech-strip-i b{ display:block; color:#0c2244; font-weight:800; font-size:13px; line-height:1.35; }
/* ---- CTA ---- */
.rech-cta{ background:#fff; padding:14px 0 56px; }
/* ---- "Parlons de vos besoins" banner rebuilt from the mockup (animated CTA) ---- */
.rcb{ display:flex; align-items:center; gap:40px; background:#fff; border:1px solid #eef2f7; border-radius:26px; padding:34px 48px; box-shadow:0 42px 84px -46px rgba(12,34,68,.5); position:relative; overflow:hidden; }
.rcb-illu-wrap{ flex:0 0 auto; }
.rcb-illu{ width:152px; height:auto; display:block; animation:rcbFloat 4.2s ease-in-out infinite; }
.rcb-mid{ flex:1 1 auto; min-width:0; }
.rcb-title{ margin:0 0 12px; color:#0c2244; font-weight:800; font-size:clamp(24px,2.5vw,35px); line-height:1.12; letter-spacing:-.01em; }
.rcb-title .b{ color:#1c9ad6; }
.rcb-title .g{ color:#62C414; }
.rcb-sub{ margin:0 0 20px; color:#5b6b7f; font-size:15.5px; line-height:1.6; max-width:560px; }
.rcb-feats{ display:flex; flex-wrap:wrap; gap:14px 32px; }
.rcb-feat{ display:inline-flex; align-items:center; gap:9px; color:#0c2244; font-weight:700; font-size:15px; }
.rcb-fic{ width:26px; height:26px; flex:0 0 auto; }
.rcb-right{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:13px; }
.rcb-btn{ position:relative; overflow:hidden; display:inline-flex; align-items:center; gap:14px; padding:20px 42px; border-radius:50px;
  background:linear-gradient(90deg,#1c9ad6,#3aab8f,#62C414); background-size:220% 100%; color:#fff !important; font-weight:800; font-size:19px; text-decoration:none; white-space:nowrap;
  box-shadow:0 20px 42px -14px rgba(28,154,214,.6); animation:rcbFlow 5s ease-in-out infinite, rcbPulse 2.4s ease-in-out infinite; }
.rcb-arw{ width:24px; height:24px; transition:transform .3s ease; }
.rcb-btn::after{ content:""; position:absolute; top:0; left:-60%; width:36%; height:100%; transform:skewX(-20deg);
  background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.55),rgba(255,255,255,0)); animation:rcbShine 3.2s ease-in-out infinite; }
.rcb-btn:hover{ animation-play-state:paused; transform:translateY(-3px); box-shadow:0 30px 56px -14px rgba(28,154,214,.78); }
.rcb-btn:hover .rcb-arw{ transform:translateX(6px); }
.rcb-guar{ display:inline-flex; align-items:center; gap:8px; color:#6b7b90; font-size:14px; font-weight:600; }
.rcb-lock{ width:18px; height:18px; flex:0 0 auto; }
@keyframes rcbFlow{ 0%,100%{ background-position:0% 50%; } 50%{ background-position:100% 50%; } }
@keyframes rcbPulse{ 0%,100%{ transform:translateY(0) scale(1); } 50%{ transform:translateY(-2px) scale(1.025); } }
@keyframes rcbShine{ 0%{ left:-60%; } 55%,100%{ left:130%; } }
@keyframes rcbFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-8px); } }
@media (max-width:991px){
  .rcb{ flex-direction:column; text-align:center; padding:30px 26px; gap:24px; }
  .rcb-sub{ margin-left:auto; margin-right:auto; }
  .rcb-feats{ justify-content:center; }
}
/* titles gradient (like Nos experts) */
.rech-eyebrow, .rech-h2{ background:linear-gradient(90deg,#1c9ad6 0%,#8cc63f 100%) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:transparent !important; }
.rech-eyebrow{ display:inline-block; } .rech-h2{ display:inline-block; }
/* ---- RTL ---- */
[dir="rtl"] .rech-hero-p, [dir="rtl"] .rech-eyebrow, [dir="rtl"] .rech-h1{ text-align:right; }
[dir="rtl"] .rech-crumb{ flex-direction:row-reverse; }
[dir="rtl"] .rech-clist{ text-align:right; } [dir="rtl"] .rech-clist li{ flex-direction:row-reverse; }
/* ---- responsive ---- */
@media (max-width:980px){
  .rech-hero-grid{ grid-template-columns:1fr; gap:44px; }
  .rech-feats{ flex-wrap:wrap; } .rech-feat{ flex:1 1 45%; padding:14px; } .rech-feat-sep{ display:none; }
  .rech-cards{ grid-template-columns:1fr; max-width:460px; margin:0 auto; }
  .rech-panel{ grid-template-columns:1fr; text-align:center; gap:20px; } .rech-panel-ic{ margin:0 auto; } .rech-panel-tx{ border:0; padding:0; }
  .rech-strip{ flex-wrap:wrap; } .rech-strip-i{ flex:1 1 30%; padding:14px; } .rech-strip-i::after{ display:none; }
  .rech-cta-box{ flex-direction:column; text-align:center; }
}
@media (max-width:560px){
  .rech-feat, .rech-strip-i{ flex-basis:45% !important; } .rech-ctitle{ min-height:0; }
  .rech-job{ position:static; width:auto; margin-top:20px; }
}
/* ================= GROUPES ET ENTREPRISES PRIVÉS (Recrutement National & International) ================= */
.grp-hero, .grp-main, .grp-cta{ font-family:Outfit,"Outfit Fallback",Arial,sans-serif; }
.grp-hero .container, .grp-main .container, .grp-cta .container{ max-width:1200px; margin:0 auto; padding:0 26px; }
.grp-svg{ display:block; width:56px; height:56px; }
.grp-inl{ display:inline-flex; width:52px; height:52px; } .grp-inl svg{ width:100%; height:100%; }
/* ---- HERO ---- */
.grp-hero{ position:relative; background:#fff !important; padding:24px 0 30px !important; min-height:0 !important; display:block !important; overflow:visible; }
.grp-hero::before, .grp-hero::after{ display:none !important; }
.grp-hero-grid{ display:grid; grid-template-columns:0.9fr 1.2fr; gap:40px; align-items:center; }
.grp-hero-left{ min-width:0; }
.grp-eyebrow{ display:inline-block; text-transform:uppercase; letter-spacing:.15em; font-weight:800; font-size:13.5px; color:#62C414; margin-bottom:12px; }
.grp-h1{ margin:0 0 10px; font-weight:800; font-size:clamp(28px,3.3vw,42px); line-height:1.12; color:#0c2244; letter-spacing:-.01em; }
.grp-hero-sub{ margin:0 0 20px; color:#1c9ad6; font-weight:800; font-size:clamp(16px,1.6vw,19px); }
.grp-hero-p{ margin:0 0 14px; color:#4a5a6b; font-size:14px; line-height:1.7; max-width:540px; }
.grp-hero-right{ min-width:0; position:relative; }
.grp-hero-right::before{ content:""; position:absolute; z-index:0; top:8%; left:8%; right:2%; bottom:8%; border-radius:50%;
  background:radial-gradient(60% 60% at 55% 45%, rgba(28,154,214,.14), rgba(98,196,20,.08) 55%, rgba(28,154,214,0) 75%); filter:blur(26px); animation:grpGlow 6s ease-in-out infinite; }
.grp-hero-card{ position:relative; z-index:1; background:transparent; overflow:visible; transform-origin:60% 50%; animation:grpHeroIn 1.1s cubic-bezier(.19,1,.22,1) both, grpFloat 6.5s ease-in-out 1.1s infinite; }
.grp-hero-card img{ display:block; width:100%; height:auto; object-fit:contain; }
@keyframes grpHeroIn{ 0%{ opacity:0; transform:translateX(40px) scale(.92); } 100%{ opacity:1; transform:none; } }
@keyframes grpFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-12px); } }
@keyframes grpGlow{ 0%,100%{ opacity:.5; transform:scale(1); } 50%{ opacity:1; transform:scale(1.06); } }
@media (prefers-reduced-motion:reduce){ .grp-hero-card{ animation:grpHeroIn 1.1s cubic-bezier(.19,1,.22,1) both; } .grp-hero-right::before{ animation:none; } }
/* ---- STATS ---- */
.grp-stats{ display:flex; align-items:center; gap:14px; margin-top:26px; background:#f7fafd; border:1px solid #eef3f9; border-radius:16px; padding:22px 18px; flex-wrap:wrap; }
.grp-stat{ flex:1; display:flex; align-items:center; gap:12px; min-width:170px; }
.grp-stat:not(:last-child){ border-right:1px solid #e4ebf3; padding-right:14px; }
.grp-stat-ic{ flex:0 0 auto; display:inline-flex; } .grp-stat-ic .grp-svg{ width:52px; height:52px; }
.grp-stat-tx b.num{ display:block; color:#62C414; font-weight:800; font-size:24px; line-height:1; }
.grp-stat-tx span{ display:block; color:#0c2244; font-weight:700; font-size:13px; line-height:1.3; margin-top:3px; }
.grp-stat-tx b.num + span{ color:#6a7889; font-weight:600; }
/* ---- section heads ---- */
.grp-main{ display:block; background:#fff; }
.grp-main section{ padding:44px 0; }
.grp-head{ text-align:center; margin-bottom:36px; }
.grp-h2{ margin:0; font-weight:800; font-size:clamp(23px,2.4vw,30px); color:#0c2244; }
.grp-hdeco{ display:flex; align-items:center; justify-content:center; gap:6px; margin-top:10px; }
.grp-hdeco .l{ width:26px; height:3px; border-radius:3px; background:#1c9ad6; } .grp-hdeco .r{ width:26px; height:3px; border-radius:3px; background:#62C414; }
.grp-sub{ margin:16px auto 0; color:#5b6b7f; font-size:14.5px; line-height:1.6; max-width:680px; }
/* ---- TALENT ACQUISITION cards ---- */
.grp-ta-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.grp-ta-card{ background:#fff; border:1px solid #e7edf5; border-radius:16px; padding:26px 22px; box-shadow:0 20px 42px -32px rgba(12,34,68,.4); transition:transform .3s ease, box-shadow .3s ease; }
.grp-ta-card:hover{ transform:translateY(-5px); box-shadow:0 28px 52px -28px rgba(12,34,68,.5); }
.grp-ta-top{ display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.grp-ta-ic{ flex:0 0 auto; width:56px; height:56px; border-radius:50%; border:2.5px solid; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.grp-ta-ic.g{ border-color:#8cc63f; } .grp-ta-ic.b{ border-color:#1c9ad6; }
.grp-ta-ic .grp-svg{ width:44px; height:44px; }
.grp-ta-num{ font-weight:800; font-size:30px; } .grp-ta-num.g{ color:#62C414; } .grp-ta-num.b{ color:#1c9ad6; }
.grp-ta-title{ display:block; color:#0c2244; font-weight:800; font-size:16px; line-height:1.25; margin-bottom:14px; min-height:40px; }
.grp-ta-desc{ margin:0; color:#6a7889; font-size:13.5px; line-height:1.65; }
.grp-ta-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.grp-ta-list li{ position:relative; padding-left:18px; color:#4a5a6b; font-size:13.5px; line-height:1.4; }
.grp-ta-list li::before{ content:""; position:absolute; left:0; top:7px; width:7px; height:7px; border-radius:50%; }
.grp-ta-list.g li::before{ background:#62C414; } .grp-ta-list.b li::before{ background:#1c9ad6; }
/* ---- TOOLS ---- */
.grp-tools-row{ display:flex; align-items:stretch; gap:6px; }
.grp-tool{ flex:1; display:flex; align-items:flex-start; gap:16px; background:linear-gradient(180deg,#f7fafd,#fff); border:1px solid #eef3f9; border-radius:16px; padding:26px 22px; }
.grp-tool-ic{ flex:0 0 auto; width:48px; height:48px; } .grp-tool-ic svg{ width:100%; height:100%; }
.grp-tool-tx b{ display:block; color:#0c2244; font-weight:800; font-size:16px; margin-bottom:8px; line-height:1.2; }
/* GROUPES "Nos outils de recrutement": card titles in uppercase */
.grp-tools .grp-tool-tx b{ text-transform:uppercase; }
.grp-tool-tx p{ margin:0; color:#6a7889; font-size:13px; line-height:1.6; }
.grp-tool-arr{ flex:0 0 auto; align-self:center; color:#c3cede; font-size:18px; }
/* ---- MÉTHODOLOGIE ---- */
.grp-meth-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px 20px; position:relative; }
.grp-mcard{ text-align:center; position:relative; padding:0 6px; }
.grp-mtop{ display:flex; flex-direction:column; align-items:center; margin-bottom:12px; }
.grp-mnum{ font-weight:800; font-size:22px; margin-bottom:10px; } .grp-mnum.g{ color:#62C414; } .grp-mnum.b{ color:#1c9ad6; }
.grp-mic{ width:62px; height:62px; border-radius:50%; border:2px solid; display:flex; align-items:center; justify-content:center; overflow:hidden; background:#fff; }
.grp-mic.g{ border-color:#cfe8b0; } .grp-mic.b{ border-color:#bcd8fb; }
.grp-mic .grp-svg{ width:48px; height:48px; }
.grp-mcard > b{ display:block; color:#0c2244; font-weight:800; font-size:14px; margin-bottom:8px; line-height:1.3; }
.grp-mcard p{ margin:0; color:#6a7889; font-size:12px; line-height:1.55; }
/* ---- POURQUOI ---- */
.grp-pq-grid{ display:grid; grid-template-columns:1.25fr 1fr; gap:44px; align-items:center; }
.grp-pq-list{ display:flex; flex-direction:column; gap:22px; }
.grp-pq-i{ display:flex; align-items:flex-start; gap:16px; }
.grp-pq-ic{ flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:52px; height:52px; border-radius:50%; background:#f3f6ff; } .grp-pq-ic .grp-svg{ width:40px; height:40px; } .grp-pq-ic .grp-inl{ width:38px; height:38px; }
.grp-pq-tx b{ display:block; color:#0c2244; font-weight:800; font-size:15px; margin-bottom:5px; }
.grp-pq-tx p{ margin:0; color:#6a7889; font-size:13px; line-height:1.6; }
.grp-pq-img{ position:relative; }
.grp-pq-img img{ display:block; width:100%; height:auto; object-fit:contain; }
/* ---- CTA ---- */
.grp-cta{ background:#fff; padding:8px 0 56px; }
/* ---- "Confiez-nous vos recrutements stratégiques" banner (groupes) rebuilt from mockup ---- */
.gcb{ display:flex; align-items:center; gap:40px; background:#fff; border:1px solid #eef2f7; border-radius:26px; padding:34px 48px; box-shadow:0 42px 84px -46px rgba(12,34,68,.5); position:relative; overflow:hidden; }
.gcb-illu-wrap{ flex:0 0 auto; }
.gcb-illu{ width:160px; height:auto; display:block; animation:rcbFloat 4.2s ease-in-out infinite; }
.gcb-mid{ flex:1 1 auto; min-width:0; }
.gcb-title{ margin:0 0 12px; color:#0c2244; font-weight:800; font-size:clamp(24px,2.4vw,34px); line-height:1.12; letter-spacing:-.01em; }
.gcb-title .b{ color:#1c9ad6; }
.gcb-title .g{ color:#62C414; }
.gcb-sub{ margin:0 0 20px; color:#5b6b7f; font-size:15.5px; line-height:1.6; max-width:520px; }
.gcb-feats{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 22px; }
.gcb-feat{ display:inline-flex; align-items:center; gap:9px; color:#0c2244; font-weight:700; font-size:15px; }
.gcb-fic{ width:26px; height:26px; flex:0 0 auto; }
.gcb-fdiv{ width:1px; height:22px; background:#dde5ef; }
.gcb-right{ flex:0 0 auto; display:flex; flex-direction:column; align-items:stretch; gap:14px; min-width:300px; }
.gcb-btn{ position:relative; overflow:hidden; display:inline-flex; align-items:center; justify-content:space-between; gap:20px; padding:18px 30px; border-radius:50px; font-weight:800; font-size:16.5px; text-decoration:none; white-space:nowrap; transition:transform .3s ease, box-shadow .3s ease, background .3s ease, border-color .3s ease; }
.gcb-arw{ width:22px; height:22px; flex:0 0 auto; transition:transform .3s ease; }
.gcb-btn.g{ background:linear-gradient(90deg,#1c9ad6,#3aab8f,#62C414); background-size:220% 100%; color:#fff !important; box-shadow:0 18px 38px -14px rgba(28,154,214,.55); animation:rcbFlow 5s ease-in-out infinite; }
.gcb-btn.g::after{ content:""; position:absolute; top:0; left:-60%; width:36%; height:100%; transform:skewX(-20deg); background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.5),rgba(255,255,255,0)); animation:rcbShine 3.4s ease-in-out infinite; }
.gcb-btn.g:hover{ transform:translateY(-3px); box-shadow:0 26px 50px -14px rgba(28,154,214,.72); }
.gcb-btn.o{ background:#fff; color:#0c2244 !important; border:2px solid #cfe0f7; }
.gcb-btn.o .gcb-arw{ color:#1c9ad6; }
.gcb-btn.o:hover{ transform:translateY(-3px); border-color:#1c9ad6; box-shadow:0 20px 40px -18px rgba(28,154,214,.4); }
.gcb-btn:hover .gcb-arw{ transform:translateX(5px); }
.gcb-guar{ display:inline-flex; align-items:center; justify-content:center; gap:8px; color:#6b7b90; font-size:14px; font-weight:600; margin-top:2px; }
.gcb-lock{ width:18px; height:18px; flex:0 0 auto; }
@media (max-width:991px){
  .gcb{ flex-direction:column; text-align:center; padding:30px 24px; gap:22px; }
  .gcb-sub{ margin-left:auto; margin-right:auto; }
  .gcb-feats{ justify-content:center; }
  .gcb-fdiv{ display:none; }
  .gcb-right{ width:100%; min-width:0; }
}
/* titles gradient */
.grp-eyebrow, .grp-h2{ display:inline-block; background:linear-gradient(90deg,#1c9ad6 0%,#8cc63f 100%) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:transparent !important; }
/* ---- RTL ---- */
[dir="rtl"] .grp-eyebrow, [dir="rtl"] .grp-h1, [dir="rtl"] .grp-hero-sub, [dir="rtl"] .grp-hero-p{ text-align:right; }
[dir="rtl"] .grp-stat, [dir="rtl"] .grp-tool, [dir="rtl"] .grp-pq-i{ flex-direction:row-reverse; text-align:right; }
[dir="rtl"] .grp-ta-list li{ padding-left:0; padding-right:18px; } [dir="rtl"] .grp-ta-list li::before{ left:auto; right:0; }
/* ---- responsive ---- */
@media (max-width:980px){
  .grp-hero-grid{ grid-template-columns:1fr; gap:28px; }
  .grp-stats{ flex-wrap:wrap; } .grp-stat{ flex:1 1 45%; } .grp-stat:not(:last-child){ border-right:0; }
  .grp-ta-grid{ grid-template-columns:1fr 1fr; }
  .grp-tools-row{ flex-wrap:wrap; } .grp-tool{ flex:1 1 100%; } .grp-tool-arr{ display:none; }
  .grp-meth-grid{ grid-template-columns:1fr 1fr; }
  .grp-pq-grid{ grid-template-columns:1fr; gap:30px; }
  .grp-cta-box{ flex-direction:column; text-align:center; } .grp-cta-btns{ width:100%; } .grp-cta-btn{ min-width:0; justify-content:center; }
}
@media (max-width:560px){ .grp-ta-grid, .grp-meth-grid{ grid-template-columns:1fr; } .grp-stat{ flex-basis:100%; } }
/* ================= ÉTABLISSEMENTS PUBLICS (Organisation des concours) — extends grp- ================= */
.pub-hero .grp-hero-grid{ align-items:flex-start; }
.pub-hero .grp-h1{ font-size:clamp(26px,3vw,38px); }
.pub-hp{ display:flex; align-items:flex-start; gap:14px; margin-bottom:14px; }
.pub-hp-ic{ flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:50%; background:#f3f6ff; margin-top:2px; }
.pub-hp-ic .grp-inl{ width:34px; height:34px; } .pub-hp-ic .grp-svg{ width:34px; height:34px; }
.pub-hp p{ margin:0; color:#4a5a6b; font-size:13px; line-height:1.65; }
.pub-hero-photo{ position:relative; z-index:1; background:transparent; overflow:visible; transform-origin:60% 50%; animation:grpHeroIn 1.1s cubic-bezier(.19,1,.22,1) both, grpFloat 6.5s ease-in-out 1.1s infinite; }
.pub-hero-photo img{ display:block; width:100%; height:auto; object-fit:contain; }
/* prestations: 8 cards, 4 per row */
.pub-prest-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.pub-prest .grp-ta-title{ min-height:44px; }
.pub-prest .grp-ta-list li{ font-size:12.5px; }
.grp-inl2{ display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; } .grp-inl2 svg{ width:100%; height:100%; }
.grp-ta-ic .grp-inl2{ width:40px; height:40px; }
/* tools: 5 cards */
.pub-tools-sec{ padding:44px 0; background:#fff; }
.pub-tools-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.pub-tool{ background:linear-gradient(180deg,#f7fafd,#fff); border:1px solid #eef3f9; border-radius:16px; padding:24px 20px; box-shadow:0 18px 38px -30px rgba(12,34,68,.4); }
.pub-tool .grp-tool-ic{ display:inline-flex; width:46px; height:46px; margin-bottom:16px; } .pub-tool .grp-tool-ic svg{ width:100%; height:100%; }
.pub-tool-t{ display:block; color:#0c2244; font-weight:800; font-size:14.5px; line-height:1.3; margin-bottom:14px; min-height:38px; }
.pub-tool-list{ list-style:none; margin:0; padding-top:14px; border-top:1px solid #edf1f7; display:flex; flex-direction:column; gap:9px; }
.pub-tool-list li{ position:relative; padding-left:16px; color:#4a5a6b; font-size:12px; line-height:1.4; }
.pub-tool-list li::before{ content:""; position:absolute; left:0; top:6px; width:6px; height:6px; border-radius:50%; background:#62C414; }
/* panels */
.pub-panels-sec{ padding:20px 0 44px; background:#fff; }
.pub-panels{ display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start; }
.pub-panel{ border-radius:18px; padding:34px 32px; }
.pub-panel-confid{ background:#f5f8fc; }
.pub-panel-eng{ background:#eef3fb; }
.pub-panel-head{ display:flex; align-items:center; gap:16px; margin-bottom:18px; }
.pub-panel-ic{ flex:0 0 auto; width:62px; height:62px; border-radius:50%; display:flex; align-items:center; justify-content:center; } .pub-panel-ic svg{ width:34px; height:34px; }
.pub-panel-ic.green{ background:#62C414; } .pub-panel-ic.blue{ background:#1c9ad6; }
.pub-panel-h{ margin:0; font-weight:800; font-size:20px; color:#0c2244; line-height:1.2; }
.pub-panel-lead{ margin:0 0 16px; color:#4a5a6b; font-size:14px; line-height:1.6; }
.pub-confid-list{ list-style:none; margin:0 0 20px; padding:0; display:flex; flex-direction:column; gap:11px; }
.pub-confid-list li{ position:relative; padding-left:18px; color:#33465c; font-size:13.5px; line-height:1.5; }
.pub-confid-list li::before{ content:""; position:absolute; left:0; top:7px; width:7px; height:7px; border-radius:50%; background:#62C414; }
.pub-panel-note{ margin:0; color:#4c8a1e; font-weight:700; font-size:13.5px; line-height:1.6; }
.pub-eng-list{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:16px 18px; }
.pub-eng-list li{ display:flex; align-items:center; gap:11px; color:#33465c; font-weight:600; font-size:13.5px; line-height:1.3; }
.pub-eng-list li svg{ flex:0 0 auto; }
/* responsive */
@media (max-width:980px){
  .pub-prest-grid{ grid-template-columns:1fr 1fr; }
  .pub-tools-grid{ grid-template-columns:1fr 1fr 1fr; }
  .pub-panels{ grid-template-columns:1fr; }
}
@media (max-width:560px){ .pub-prest-grid, .pub-tools-grid{ grid-template-columns:1fr; } .pub-eng-list{ grid-template-columns:1fr; } }

/* ===== Accompagnement — testimonials carousel (rebuilt from mockup, auto-rotating) ===== */
.acct-head{ text-align:center; max-width:820px; margin:0 auto 42px; }
.acct-eyebrow{ display:inline-block; font-weight:800; letter-spacing:.12em; text-transform:uppercase; font-size:14px; color:#0c2244; }
.acct-eyebrow .b{ color:#1c9ad6; } .acct-eyebrow .g{ color:#62C414; }
.acct-deco{ display:flex; align-items:center; justify-content:center; gap:8px; margin:14px 0 22px; }
.acct-deco i{ width:46px; height:3px; border-radius:3px; } .acct-deco .l{ background:#1c9ad6; } .acct-deco .r{ background:#62C414; }
.acct-deco b{ width:9px; height:9px; border-radius:50%; background:#1c9ad6; }
.acct-title{ font-size:clamp(34px,4vw,54px); font-weight:800; color:#0c2244; letter-spacing:-.02em; margin:0 0 14px; }
.acct-sub{ color:#5b6b7f; font-size:16px; line-height:1.7; margin:0; }
.acct-carousel{ position:relative; display:flex; align-items:center; gap:16px; max-width:1200px; margin:0 auto; }
.acct-view{ overflow:hidden; flex:1 1 auto; padding:24px 6px; }
.acct-track{ display:flex; gap:26px; transition:transform .6s cubic-bezier(.5,.05,.2,1); will-change:transform; }
.acct-card{ flex:0 0 calc((100% - 52px)/3); box-sizing:border-box; background:#fff; border:1.5px solid #e7edf5; border-radius:20px; padding:32px 26px; box-shadow:0 22px 44px -30px rgba(12,34,68,.4); display:flex; flex-direction:column; transition:transform .5s ease, box-shadow .5s ease, border-color .5s ease; }
.acct-q{ font-family:Georgia,"Times New Roman",serif; font-size:60px; line-height:.55; color:#1c9ad6; height:34px; }
.acct-card.acct-client .acct-q{ color:#62C414; }
.acct-stars{ display:flex; justify-content:center; gap:5px; color:#ffb400; font-size:15px; margin:8px 0 18px; }
.acct-tx{ color:#33465c; font-size:14.5px; line-height:1.75; text-align:center; margin:0 0 22px; flex:1 1 auto; }
.acct-div{ display:block; height:1px; background:#e7edf5; margin:0 0 18px; }
.acct-role{ display:flex; align-items:center; gap:12px; }
.acct-role-ic{ width:38px; height:38px; border-radius:50%; background:#e9f4fc; color:#1c9ad6; display:flex; align-items:center; justify-content:center; font-size:15px; flex:0 0 auto; }
.acct-card.acct-client .acct-role-ic{ background:#eef7e0; color:#62C414; }
.acct-role b{ font-weight:800; letter-spacing:.05em; font-size:13px; color:#1c9ad6; text-transform:uppercase; }
.acct-card.acct-client .acct-role b{ color:#62C414; }
.acct-card.is-active{ border-color:#1c9ad6; transform:translateY(-8px) scale(1.03); box-shadow:0 40px 66px -30px rgba(28,154,214,.5); animation:acctGlow 3s ease-in-out infinite; }
@keyframes acctGlow{ 0%,100%{ box-shadow:0 40px 66px -30px rgba(28,154,214,.5); } 50%{ box-shadow:0 44px 72px -28px rgba(98,196,20,.5); } }
.acct-arrow{ flex:0 0 auto; width:48px; height:48px; border-radius:50%; border:1.5px solid #e0e7f1; background:#fff; color:#1c9ad6; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:15px; box-shadow:0 12px 26px -16px rgba(12,34,68,.5); transition:all .25s ease; }
.acct-arrow:hover{ background:#1c9ad6; color:#fff; border-color:#1c9ad6; transform:scale(1.09); }
.acct-dots{ display:flex; justify-content:center; gap:9px; margin-top:28px; }
.acct-dots span{ width:9px; height:9px; border-radius:50%; background:#cfdae7; cursor:pointer; transition:all .25s ease; }
.acct-dots span.on{ width:28px; border-radius:5px; background:linear-gradient(90deg,#1c9ad6,#62C414); }
@media (max-width:900px){
  .acct-card{ flex-basis:calc((100% - 26px)/2); }
  .acct-view{ padding:18px 4px; }
}

/* Témoignages eyebrow: full blue -> green gradient */
.acct-eyebrow{ background:linear-gradient(90deg,#1c9ad6,#62C414); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.acct-eyebrow .b, .acct-eyebrow .g{ color:inherit; -webkit-text-fill-color:transparent; }

/* Uniform banner-icon size (160px) + continuous float across every icon.svg banner */
.gcb-illu, .rcb-illu{ width:160px !important; height:auto !important; }
html.ifcar-page-about-us .ifcar-cta-emblem{ width:160px !important; height:140px !important; animation:rcbFloat 4.2s ease-in-out infinite; }

/* All section/hero titles UPPERCASE on service pages (recrutement → accompagnement).
   Excludes Accueil, home2 and qui-sommes-nous; keeps the CTA banner titles (gcb/rcb) mixed-case as in their mockups. */
html.ifcar-page-recrutement :is(h1,h2,h3,h4):not(.gcb-title):not(.rcb-title),
html.ifcar-page-groupes-et-entreprises-prives :is(h1,h2,h3,h4):not(.gcb-title):not(.rcb-title),
html.ifcar-page-etablissements-et-entreprises-publics :is(h1,h2,h3,h4):not(.gcb-title):not(.rcb-title),
html.ifcar-page-services-details-1 :is(h1,h2,h3,h4):not(.gcb-title):not(.rcb-title),
html.ifcar-page-formation :is(h1,h2,h3,h4):not(.gcb-title):not(.rcb-title),
html.ifcar-page-formation-continue-intra-entreprise :is(h1,h2,h3,h4):not(.gcb-title):not(.rcb-title),
html.ifcar-page-ingenierie-de-formation :is(h1,h2,h3,h4):not(.gcb-title):not(.rcb-title),
html.ifcar-page-seminaires-de-formation-interentreprises-et-grand-public :is(h1,h2,h3,h4):not(.gcb-title):not(.rcb-title),
html.ifcar-page-conseil :is(h1,h2,h3,h4):not(.gcb-title):not(.rcb-title):not(.cx-h1):not(.cx-dom-t):not(.cx-cta-t),
html.ifcar-page-accompagnement-individuel :is(h1,h2,h3,h4):not(.gcb-title):not(.rcb-title):not(.ax-h1):not(.ax-cta-t){ text-transform:uppercase !important; }
/* le panneau « Nos références » est injecté dans <body> : il ne doit pas hériter de la
   mise en majuscules des titres de ces pages. */
#ifcarRefs .ifcar-refs-title, #ifcarRefs .ifcar-refs-cat, #ifcarRefs .ifcar-refs-lead{ text-transform:none !important; }

/* recrutement: "talent" blue, ifcarjob button blue (like Prendre conseil), "Découvrir" always visible */
.rech-h1 .g{ color:#1c9ad6 !important; }
.rech-job-btn{ background:#1c9ad6 !important; box-shadow:0 12px 24px -10px rgba(28,154,214,.5) !important; }
.rech-job-btn:hover{ background:#8cc63f !important; box-shadow:0 18px 32px -10px rgba(140,198,63,.6) !important; }
.rech-cmore{ opacity:1 !important; transform:none !important; }

/* formation "Nos approches" cards now reuse the recrutement card design — size their icons like the rech ones */
.rech-card .rech-cic img{ width:190px !important; height:190px !important; }

/* ===== Phosphor icon system (brand blue->green gradient, big, scales with text) ===== */
.ph{ display:inline-block; width:1em; height:1em; background:linear-gradient(135deg,#1c9ad6,#62C414);
  -webkit-mask:var(--pi) center/contain no-repeat; mask:var(--pi) center/contain no-repeat; vertical-align:middle; }
/* recrutement hero feats + approach strip: big icons */
.rech-feat-ic .ph{ width:3em; height:3em; }
.rech-strip-ic .ph{ width:2.8em; height:2.8em; }

/* coop page: size the new Phosphor icons inside its badges/circles/tool logos */
.coopx .ic .ph{ width:26px; height:26px; }
.coopx .badge .ph{ width:28px; height:28px; }
.coopx .circle .ph{ width:28px; height:28px; }
.coopx .fic .ph{ width:26px; height:26px; }
.coopx .tool .logo{ background:#f3f6ff !important; border:1px solid #e7edf5 !important; }
.coopx .tool .logo .ph{ width:34px; height:34px; }

/* Nos outils (groupes/établissements): size the unified Phosphor tool icons */
.grp-tool-ic .ph{ width:44px; height:44px; }

/* National & International globe icon (grp) */
.grp-inl .ph{ width:100%; height:100%; }

/* ===== Apparition au défilement : arrivée latérale alternée + micro-zoom (moteur : initScrollReveal, i18n.js) ===== */
/* Chaque bloc arrive d'un côté, le suivant de l'autre (--rvx posé par initScrollReveal). */
.ifcar-reveal{ opacity:0; transform:translateX(var(--rvx,-70px)) scale(.96);
  transition:opacity .75s cubic-bezier(.22,.7,.24,1), transform .75s cubic-bezier(.22,.7,.24,1); }
.ifcar-reveal.ifcar-in{ opacity:1; transform:none; }
/* cartes d'une même grille : une sur deux depuis la gauche, l'autre depuis la droite,
   le tout en cascade (--rvd) */
.ifcar-rvc{ opacity:0; transform:translateX(var(--rvx,-56px)) scale(.96);
  transition:opacity .66s cubic-bezier(.22,.7,.24,1) var(--rvd,0ms), transform .66s cubic-bezier(.22,.7,.24,1) var(--rvd,0ms); }
.ifcar-rvg.ifcar-in .ifcar-rvc{ opacity:1; transform:none; }
/* Le glissement latéral ne doit pas créer de barre horizontale. ⚠️ NE PAS mettre ce clip
   sur <body> : l'Accueil applique `body{width:1440px;zoom:…}` et la combinaison
   clip + zoom fait que le navigateur ne peint plus rien (page blanche, DOM intact). */
.wrapper, .ifcar-above-footer{ overflow-x:clip; }
/* héritage du glissement latéral : on garde le clip, il évite toute barre horizontale */
.rech-main, .grp-main, .coopx, .form-main, .acc-main, .cons-main, .ig-main, .fc-main, .sm-main, .ijr, .sgp, .ifcar-promise-area{ overflow-x:clip; }
@media (prefers-reduced-motion:reduce){
  .ifcar-reveal, .ifcar-reveal.ifcar-in, .ifcar-rvc, .ifcar-rvg.ifcar-in .ifcar-rvc{
    opacity:1 !important; transform:none !important; transition:none !important; } }

/* IFCARJOB — VIP menu item (first in Recruitment dropdown) */
/* whole menu incl. dropdown -> UPPERCASE + smaller text */
.navbar-nav .dropdown-menu li a{ text-transform:uppercase !important; font-size:12px !important; letter-spacing:.01em !important; }
/* current sub-page: highlight it inside the open dropdown so you see exactly where you are */
#navbar-menu .navbar-nav .dropdown-menu li a.active,
nav.navbar.validnavs ul.nav ul.dropdown-menu li a.active:not(.ifcar-vip){ color:#1c9ad6 !important; font-weight:700 !important; background:rgba(28,154,214,.07) !important; box-shadow:inset 3px 0 0 #1c9ad6 !important; }

/* recrutement "Nos approches": 4th card = IFCARJOB (logo + green flag) — 4-col ONLY on recrutement (formation keeps 3) */
.rech-main .rech-cards{ grid-template-columns:repeat(4,1fr) !important; gap:18px !important; }
.rech-card-ijb .rech-cic{ min-height:190px; display:flex; align-items:center; justify-content:center; }
.rech-card .rech-cic .rech-ijb-logo{ width:200px !important; height:auto !important; max-height:130px; }
@media (max-width:1100px){ .rech-main .rech-cards{ grid-template-columns:1fr 1fr !important; } }

/* recrutement/formation approach cards: bottom-align the "Découvrir" link across all cards */
.rech-card{ display:flex !important; flex-direction:column; align-items:center; }
.rech-card .rech-cmore{ margin-top:auto; }

/* formation "Nos approches": 4 cards (added Séminaires grand public) */
.form-main .rech-cards{ grid-template-columns:repeat(4,1fr) !important; gap:18px !important; }
@media (max-width:1100px){ .form-main .rech-cards{ grid-template-columns:1fr 1fr !important; } }

/* grand public page: section titles (NOTRE APPROCHE and below) -> blue->green gradient */
.sgp-sec, .sgp-h3, .sgp-pq-t, .sgp-banner-t{ background:linear-gradient(90deg,#1c9ad6,#62C414); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.sgp-sec .b, .sgp-sec .g, .sgp-h3 .b, .sgp-h3 .g, .sgp-banner-t .g{ -webkit-text-fill-color:transparent; color:transparent; }

/* ===== HOME hero: DARK navy theme (mockup "Generated image 1 (10)") — FINAL override, wins over all v2..v6 light rules ===== */
html.ifcar-home .ifcar-hero3-area{ background:radial-gradient(1100px 560px at 14% 24%, #163470 0%, rgba(22,52,112,0) 60%), linear-gradient(135deg,#0a1830 0%,#0c2244 55%,#091428 100%) !important; }
html.ifcar-home .ifcar-hero3 .h3-title, html.ifcar-home .ifcar-hero3 .h3-title *{ color:#ffffff !important; -webkit-text-fill-color:#ffffff !important; }
html.ifcar-home .ifcar-hero3 .h3-title .h3-accent, html.ifcar-home .ifcar-hero3 .h3-accent{ background:linear-gradient(90deg,#1c9ad6 0%,#48b3ec 45%,#8cc63f 100%) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:transparent !important; }
html.ifcar-home .ifcar-hero3 .h3-underline{ background:linear-gradient(90deg,#1c9ad6,#8cc63f) !important; }
html.ifcar-home .ifcar-hero3 .h3-eyebrow{ color:#aeb9cc !important; display:inline-flex !important; align-items:center; gap:16px; }
html.ifcar-home .ifcar-hero3 .h3-eyebrow::after{ content:"" !important; width:46px; height:3px; border-radius:3px; background:linear-gradient(90deg,#8cc63f,#6fb62e) !important; }
html.ifcar-home .ifcar-hero3 .h3-sub{ color:#c2cee0 !important; }
html.ifcar-home .ifcar-hero3 .h3-sub b{ color:#ffffff !important; }
html.ifcar-home .ifcar-hero3 .h3-stat-t b{ color:#ffffff !important; }
html.ifcar-home .ifcar-hero3 .h3-stat-t span{ color:#9fb0c8 !important; }
html.ifcar-home .ifcar-hero3 .h3-stat-ic{ color:#ffffff !important; box-shadow:0 12px 26px -12px rgba(0,0,0,.65) !important; }
html.ifcar-home .ifcar-hero3 .h3-stat-ic.blue{ background:linear-gradient(135deg,#1c9ad6,#178bc4) !important; }
html.ifcar-home .ifcar-hero3 .h3-stat-ic.green{ background:linear-gradient(135deg,#8cc63f,#5fa021) !important; }
html.ifcar-home .ifcar-hero3 .h3-stat{ padding:0 16px; }
html.ifcar-home .ifcar-hero3 .h3-stat:first-child{ padding-left:0; }
html.ifcar-home .ifcar-hero3 .h3-stat:not(:last-child){ border-right:none !important; }
html.ifcar-home .ifcar-hero3 .h3-conf{ color:#ffffff !important; }
html.ifcar-home .ifcar-hero3 .h3-conf span{ background:linear-gradient(90deg,#1c9ad6,#8cc63f) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:transparent !important; }
html.ifcar-home .ifcar-hero3 .h3-conf::after{ background:linear-gradient(90deg,#1c9ad6,#8cc63f) !important; }
html.ifcar-home .ifcar-hero3 .h3-ref-cat{ color:#d8e2f0 !important; }
html.ifcar-home .ifcar-hero3 .h3-ref-ic i{ background:linear-gradient(135deg,#1c9ad6,#8cc63f) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:transparent !important; }
html.ifcar-home .ifcar-hero3 .h3-ref:not(:last-child)::before{ background:rgba(255,255,255,.13) !important; }
html.ifcar-home .ifcar-hero3 .h3-ref-circle::before{ content:"" !important; position:absolute; inset:0; border-radius:50%; padding:3px; background:linear-gradient(135deg,#1c9ad6,#8cc63f) !important; -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; z-index:4; pointer-events:none; }

/* ===== HOME hero stats -> bordered dark box (mockup image.png) ===== */
html.ifcar-home .ifcar-hero3 .h3-stats{ background:rgba(255,255,255,.045) !important; border:1px solid rgba(255,255,255,.11) !important; border-radius:16px !important; padding:16px 6px !important; margin-top:26px !important; box-shadow:0 20px 46px -30px rgba(0,0,0,.7) !important; }
html.ifcar-home .ifcar-hero3 .h3-stats{ gap:0 !important; height:auto !important; min-height:0 !important; align-self:start !important; align-content:start !important; grid-template-rows:auto !important; grid-auto-rows:min-content !important; }
html.ifcar-home .ifcar-hero3 .h3-stat{ height:auto !important; align-self:start !important; }
html.ifcar-home .ifcar-hero3 .h3-stat-t{ height:auto !important; align-self:start !important; }
html.ifcar-home .ifcar-hero3 .h3-stat{ padding:2px 12px !important; min-width:0 !important; gap:9px !important; position:relative !important; }
html.ifcar-home .ifcar-hero3 .h3-stat-t{ min-width:0 !important; }
html.ifcar-home .ifcar-hero3 .h3-stat-t b{ white-space:normal !important; }
html.ifcar-home .ifcar-hero3 .h3-stat-ic{ width:40px !important; height:40px !important; font-size:16px !important; }
/* dividers: short + vertically centered, so the rounded corners read equal top & bottom */
html.ifcar-home .ifcar-hero3 .h3-stat:not(:last-child){ border-right:none !important; }
html.ifcar-home .ifcar-hero3 .h3-stat:not(:last-child)::after{ content:"" !important; position:absolute !important; right:0 !important; top:50% !important; transform:translateY(-50%) !important; width:1px !important; height:58% !important; background:rgba(255,255,255,.13) !important; }

/* ===== HOME hero — left decorative shapes (mockup image.png): curved blue->green line, dot field, facet ===== */
html.ifcar-home .ifcar-hero3 > .container{ position:relative !important; z-index:2 !important; }
html.ifcar-home .ifcar-hero3 .h3-deco{ position:absolute !important; inset:0 !important; z-index:0 !important; pointer-events:none !important; overflow:hidden !important; }
html.ifcar-home .ifcar-hero3 .h3-deco-line{ position:absolute; left:0; top:0; width:300px; height:100%; opacity:.85; }
html.ifcar-home .ifcar-hero3 .h3-deco-dots{ position:absolute; left:-30px; top:-50px; width:280px; height:150%;
  background-image:radial-gradient(rgba(130,170,225,.42) 1.1px, transparent 1.7px); background-size:20px 20px;
  transform:rotate(-16deg); transform-origin:top left;
  -webkit-mask:linear-gradient(115deg,#000 0%, rgba(0,0,0,.55) 32%, transparent 66%); mask:linear-gradient(115deg,#000 0%, rgba(0,0,0,.55) 32%, transparent 66%); opacity:.75; }
html.ifcar-home .ifcar-hero3 .h3-deco-facet{ position:absolute; left:0; top:0; width:240px; height:180px; background:linear-gradient(135deg, rgba(120,165,225,.10), rgba(120,165,225,0) 62%); clip-path:polygon(0 0, 100% 0, 0 100%); }
html.ifcar-home .ifcar-hero3 .h3-deco-facet::after{ content:""; position:absolute; left:0; top:0; width:250px; height:1.5px; background:linear-gradient(90deg, rgba(120,170,235,.35), transparent); transform:rotate(36deg); transform-origin:top left; }

/* ===== HOME "NOS DOMAINES D'EXPERTISE" -> DARK navy, continuous with hero (mockup image.png) ===== */
html.ifcar-home .ifcar-svc4-area{ background:linear-gradient(180deg,#0a1c3b 0%,#0b2044 100%) !important; }
html.ifcar-home .ifcar-svc4-area::before, html.ifcar-home .ifcar-svc4-area::after{ display:none !important; }
html.ifcar-home .svc4-title{ color:#ffffff !important; -webkit-text-fill-color:#ffffff !important; background:none !important; }
html.ifcar-home .svc4-title span{ background:linear-gradient(90deg,#1c9ad6,#8cc63f) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:transparent !important; }
html.ifcar-home .svc4-underline{ background:linear-gradient(90deg,#1c9ad6,#8cc63f) !important; }
html.ifcar-home .svc4-card{ background:rgba(255,255,255,.035) !important; border:1px solid rgba(255,255,255,.10) !important; box-shadow:0 22px 46px -32px rgba(0,0,0,.75) !important; }
html.ifcar-home .svc4-card:hover{ border-color:rgba(28,154,214,.5) !important; box-shadow:0 30px 60px -28px rgba(0,0,0,.85) !important; }
html.ifcar-home .svc4-ic{ border-radius:14px !important; }
html.ifcar-home .svc4-card.blue .svc4-ic{ background:linear-gradient(135deg,#1c9ad6,#178bc4) !important; box-shadow:0 12px 24px -8px rgba(28,154,214,.6) !important; }
html.ifcar-home .svc4-card.green .svc4-ic{ background:linear-gradient(135deg,#8cc63f,#6fb62e) !important; box-shadow:0 12px 24px -8px rgba(140,198,63,.6) !important; }
html.ifcar-home .svc4-card.blue .svc4-t, html.ifcar-home .svc4-grid .svc4-card:nth-child(3) .svc4-t{ color:#1c9ad6 !important; }
html.ifcar-home .svc4-card.green .svc4-t{ color:#8cc63f !important; }
html.ifcar-home .svc4-d{ color:#aab8cc !important; }
html.ifcar-home .svc4-card.blue .svc4-more{ color:#1c9ad6 !important; }
html.ifcar-home .svc4-card.green .svc4-more{ color:#8cc63f !important; }

/* ===== HOME hero + "Nos domaines" — ONE looping video background behind both (video 12421439) ===== */
html.ifcar-home .ifcar-hero-wrap{ position:relative !important; overflow:hidden !important; background:#07101f !important; }
html.ifcar-home .ifcar-hero-video{ position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; object-fit:cover !important; z-index:0 !important; pointer-events:none !important; }
html.ifcar-home .ifcar-hero-wrap::before{ content:"" !important; position:absolute !important; inset:0 !important; z-index:1 !important; pointer-events:none !important; background:linear-gradient(105deg, rgba(6,13,26,.72) 0%, rgba(8,17,34,.58) 46%, rgba(8,17,34,.46) 100%) !important; }
/* sections ride ABOVE the video + overlay, backgrounds now transparent */
html.ifcar-home .ifcar-hero3-area, html.ifcar-home .ifcar-svc4-area{ background:transparent !important; position:relative !important; z-index:2 !important; }
/* drop the old flat-navy decorations (the video now provides the particle texture) */
html.ifcar-home .ifcar-hero3-area::before{ display:none !important; }
html.ifcar-home .ifcar-hero3 .h3-deco-dots, html.ifcar-home .ifcar-hero3 .h3-deco-facet, html.ifcar-home .ifcar-hero3 .h3-deco-line{ display:none !important; }
/* Les deux interrupteurs qui neutralisaient l'animation d'entrée du héros et tout le
   scroll-reveal ont été retirés : ils avaient été posés parce que le moteur du gabarit
   re-rendait le DOM et rejouait l'animation ("kaymchi o y3awad yji"). Ce moteur a disparu,
   les nœuds ne sont plus recréés, donc plus de rejeu. Moteur : initScrollReveal() (i18n.js). */

/* ============================================================================
   Dropdown menu — refonte élégante (pro)
   ============================================================================ */
#navbar-menu .dropdown-menu{
  min-width:322px !important; padding:10px !important; border-radius:16px !important;
  background:#fff !important; border:1px solid rgba(12,34,68,.05) !important;
  box-shadow:0 28px 62px -22px rgba(12,34,68,.32), 0 8px 20px -10px rgba(12,34,68,.14) !important;
  overflow:hidden;
}
#navbar-menu .dropdown-menu::before{
  content:""; position:absolute; left:0; right:0; top:0; height:3px;
  background:linear-gradient(90deg,#1c9ad6,#62C414);
}
#navbar-menu .dropdown-menu > li{ margin:1px 0; }
#navbar-menu .dropdown-menu > li > a{
  position:relative; display:flex !important; align-items:center; gap:12px;
  padding:11px 16px 11px 13px !important; border-radius:11px !important;
  font-size:12px !important; font-weight:700 !important; line-height:1.3 !important;
  color:#0c2244 !important; letter-spacing:.01em !important;
  transition:background-color .28s ease, color .22s ease, transform .24s ease !important;
}
/* leading diamond marker */
#navbar-menu .dropdown-menu > li > a::before{
  content:""; position:static; flex:0 0 auto; width:9px; height:9px; border-radius:3px;
  background:#d9e3ef; transform:rotate(45deg) scale(.86);
  transition:background .28s ease, transform .28s ease, box-shadow .28s ease;
}
#navbar-menu .dropdown-menu > li > a:hover{
  background:linear-gradient(90deg, rgba(28,154,214,.11), rgba(98,196,20,.06)) !important;
  color:#1c9ad6 !important; transform:translateX(3px); padding-left:13px !important;
}
#navbar-menu .dropdown-menu > li > a:hover::before{
  background:linear-gradient(135deg,#1c9ad6,#62C414); transform:rotate(45deg) scale(1.05);
  box-shadow:0 4px 9px -2px rgba(28,154,214,.55);
}
/* ---- Arabe : sens d'ouverture et largeur des sous-menus ----
   Le gabarit ancre le sous-menu à GAUCHE du parent (left:0), donc en RTL il se déployait
   à l'opposé du sens de lecture : pour atteindre un sous-élément, le curseur devait passer
   sous « Accueil » / « Qui sommes-nous ». Le survol changeait alors d'entrée de 1er niveau
   et le menu se refermait AVANT l'arrivée — 3 sous-menus sur 4 étaient inatteignables.
   Ancré au bord DROIT, il se déploie vers la gauche, juste sous son parent.
   La largeur fixe (322 px) coupait par ailleurs « الاستراتيجية والتنظيم ومواكبة الموارد
   البشرية » sur deux lignes, seul de sa liste : la boîte se dimensionne sur son plus long
   intitulé pour que les quatre entrées gardent la même allure. */
[dir="rtl"] #navbar-menu .dropdown-menu{
  left:auto !important; right:0 !important;
  min-width:322px !important; width:max-content !important; max-width:min(560px,44vw) !important;
}
[dir="rtl"] #navbar-menu .dropdown-menu > li > a{ white-space:nowrap; }
/* Fermeture retardée. La boîte arabe est bien plus large que son parent : pour viser un
   intitulé long, le curseur descend EN DIAGONALE et sort de l'entrée par le côté — il survole
   alors l'entrée voisine, toujours dans la barre, et le sous-menu se refermait avant d'être
   atteint. 260 ms couvrent le trajet. L'ouverture, elle, reste immédiate. Réglage limité au
   RTL : en français la boîte s'aligne sous son parent, le trajet est droit, rien à corriger. */
[dir="rtl"] nav.navbar.validnavs ul.nav > li.dropdown > ul.dropdown-menu{ transition-delay:.26s !important; }
[dir="rtl"] nav.navbar.validnavs ul.nav > li.dropdown:hover > ul.dropdown-menu{ transition-delay:0s !important; }

/* active sub-item */
#navbar-menu .navbar-nav .dropdown-menu li a.active{
  background:linear-gradient(90deg, rgba(28,154,214,.12), rgba(98,196,20,.06)) !important;
  color:#1c9ad6 !important; box-shadow:none !important;
}
#navbar-menu .navbar-nav .dropdown-menu li a.active::before{ background:linear-gradient(135deg,#1c9ad6,#62C414) !important; }
/* smooth entrance (slide + fade) */
nav.navbar.validnavs .navbar-nav > li.dropdown > ul.dropdown-menu{
  transform:translateY(9px) !important;
  transition:opacity .3s ease, visibility .3s ease, transform .34s cubic-bezier(.2,.85,.25,1) !important;
}
nav.navbar.validnavs .navbar-nav > li.dropdown:hover > ul.dropdown-menu{ transform:translateY(0) !important; }

/* Conseil hero title: keep natural case (not uppercase) */
.cx-h1{ text-transform:none !important; }

/* ===== CONSEIL — refinements requested ===== */
/* 1) eyebrow "CONSEIL" gradient blue-green */
.cx-eyebrow{ background:linear-gradient(90deg,#1c9ad6,#62C414) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:transparent !important; }
.cx-eyebrow::after{ background:linear-gradient(90deg,#1c9ad6,#62C414) !important; }
/* 3) hero image: no frame, alone, bigger */
.cx-hero-grid{ grid-template-columns:1fr 1.15fr !important; gap:36px !important; }
.cx-hero-blob{ border:none !important; border-radius:0 !important; overflow:visible !important; box-shadow:none !important; max-width:none !important; width:100% !important; animation:none !important; }
.cx-hero-blob img{ width:100% !important; height:auto !important; }
/* 4) section titles (NOS DOMAINES → NOTRE MÉTHODOLOGIE) gradient blue-green */
.cx-h2, .cx-panel-t{ background:linear-gradient(90deg,#1c9ad6,#62C414) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:transparent !important; }
.cx-h2 span, .cx-panel-t span{ -webkit-text-fill-color:transparent !important; color:transparent !important; background:none !important; }
/* 5) domain card titles in black */
.cx-dom-t, .cx-dom-t .b, .cx-dom-t .g{ color:#0c2244 !important; }

/* CONSEIL gradient titles: fit the gradient to the text width (else centered text only shows the middle teal) */
.cx-h2, .cx-panel-t{ display:inline-block !important; }

/* Stratégie RH page: animate hero image + alternate solution card titles blue/green */
html.ifcar-page-strategie-organisation-accompagnement-rh .cx-hero-blob{ animation:cxFloat 6.5s ease-in-out infinite !important; }
.sx-sol-grid .sx-sol-card:nth-child(1) .sx-sol-t, .sx-sol-grid .sx-sol-card:nth-child(3) .sx-sol-t{ background:none !important; -webkit-text-fill-color:#1c9ad6 !important; color:#1c9ad6 !important; }
.sx-sol-grid .sx-sol-card:nth-child(2) .sx-sol-t{ background:none !important; -webkit-text-fill-color:#62C414 !important; color:#62C414 !important; }
html.ifcar-page-audit-diagnostic-rh .cx-hero-blob{ animation:cxFloat 6.5s ease-in-out infinite !important; }

html.ifcar-page-emplois-competences-carrieres .cx-hero-blob{ animation:cxFloat 6.5s ease-in-out infinite !important; }

html.ifcar-page-performance-evaluation-remuneration .cx-hero-blob{ animation:cxFloat 6.5s ease-in-out infinite !important; }

/* Accompagnement CTA buttons: continuous flowing gradient + shine sweep (match the other banners) */
.ax-btn.blu{ background:linear-gradient(90deg,#1c9ad6,#54bbe8,#1c9ad6) !important; background-size:220% 100% !important; animation:axBtnFlow 5s ease-in-out infinite !important; }
.ax-btn.grn{ background:linear-gradient(90deg,#62C414,#8cc63f,#62C414) !important; background-size:220% 100% !important; animation:axBtnFlow 5s ease-in-out infinite !important; }
.ax-btn::after{ content:""; position:absolute; top:0; left:-60%; width:36%; height:100%; z-index:0; transform:skewX(-20deg); background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.5),rgba(255,255,255,0)); animation:axBtnShine 3.4s ease-in-out infinite; pointer-events:none; }
.ax-btn > span, .ax-btn > .ax-arw{ position:relative; z-index:1; }
@keyframes axBtnFlow{ 0%,100%{ background-position:0 50%; } 50%{ background-position:100% 50%; } }
@keyframes axBtnShine{ 0%{ left:-60%; } 55%,100%{ left:135%; } }

html.ifcar-page-etudiants-jeunes-diplomes .st-hero-blob{ animation:stFloat 6.5s ease-in-out infinite !important; }

/* Étudiants & Jeunes Diplômés: all section titles = full blue-green gradient */
html.ifcar-page-etudiants-jeunes-diplomes .st-h2,
html.ifcar-page-salaries-cadres-managers .st-h2,
html.ifcar-page-professionnels-en-transition .st-h2,
html.ifcar-page-seniors-seconde-carriere .st-h2{ background:linear-gradient(90deg,#1c9ad6,#62C414) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:transparent !important; }
html.ifcar-page-etudiants-jeunes-diplomes .st-h2 span, html.ifcar-page-etudiants-jeunes-diplomes .st-h2 .b, html.ifcar-page-etudiants-jeunes-diplomes .st-h2 .g,
html.ifcar-page-salaries-cadres-managers .st-h2 span, html.ifcar-page-salaries-cadres-managers .st-h2 .b, html.ifcar-page-salaries-cadres-managers .st-h2 .g,
html.ifcar-page-professionnels-en-transition .st-h2 span, html.ifcar-page-professionnels-en-transition .st-h2 .b, html.ifcar-page-professionnels-en-transition .st-h2 .g,
html.ifcar-page-seniors-seconde-carriere .st-h2 span, html.ifcar-page-seniors-seconde-carriere .st-h2 .b, html.ifcar-page-seniors-seconde-carriere .st-h2 .g{ -webkit-text-fill-color:transparent !important; color:transparent !important; background:none !important; }

/* Salariés, Cadres & Managers */
html.ifcar-page-salaries-cadres-managers .st-hero-blob{ animation:stFloat 6.5s ease-in-out infinite !important; }

/* ---- Professionnels en Transition ---- */
html.ifcar-page-professionnels-en-transition .st-hero-blob{ animation:stFloat 6.5s ease-in-out infinite !important; }
/* 8 solutions sur 4 colonnes (le gabarit .st-* est en 3 colonnes) */
html.ifcar-page-professionnels-en-transition .st-sol-grid{ grid-template-columns:repeat(4,1fr) !important; gap:16px !important; }
html.ifcar-page-professionnels-en-transition .st-sol-card{ padding:20px 16px !important; gap:13px !important; }
html.ifcar-page-professionnels-en-transition .st-sol-ic{ width:48px !important; height:48px !important; }
html.ifcar-page-professionnels-en-transition .st-sol-ic .ph{ width:24px !important; height:24px !important; }
html.ifcar-page-professionnels-en-transition .st-sol-card b{ font-size:13px !important; }
@media(max-width:1050px){ html.ifcar-page-professionnels-en-transition .st-sol-grid{ grid-template-columns:1fr 1fr !important; } }
@media(max-width:640px){ html.ifcar-page-professionnels-en-transition .st-sol-grid{ grid-template-columns:1fr !important; } }

/* ---- Seniors & Seconde Carrière ---- */
html.ifcar-page-seniors-seconde-carriere .st-hero-blob{ animation:stFloat 6.5s ease-in-out infinite !important; }
/* 5 objectifs (le gabarit en prévoit 6) */
html.ifcar-page-seniors-seconde-carriere .st-obj-row{ grid-template-columns:repeat(5,1fr) !important; }
/* 7 solutions sur 4 colonnes, la dernière carte occupe 2 colonnes */
html.ifcar-page-seniors-seconde-carriere .st-sol-grid{ grid-template-columns:repeat(4,1fr) !important; gap:16px !important; }
html.ifcar-page-seniors-seconde-carriere .st-sol-card{ padding:20px 16px !important; gap:13px !important; }
html.ifcar-page-seniors-seconde-carriere .st-sol-ic{ width:48px !important; height:48px !important; }
html.ifcar-page-seniors-seconde-carriere .st-sol-ic .ph{ width:24px !important; height:24px !important; }
html.ifcar-page-seniors-seconde-carriere .st-sol-card b{ font-size:13px !important; }
html.ifcar-page-seniors-seconde-carriere .st-sol-card:nth-child(7){ grid-column:span 2 !important; }
@media(max-width:1050px){ html.ifcar-page-seniors-seconde-carriere .st-obj-row{ grid-template-columns:1fr 1fr 1fr !important; } html.ifcar-page-seniors-seconde-carriere .st-sol-grid{ grid-template-columns:1fr 1fr !important; } }
@media(max-width:640px){ html.ifcar-page-seniors-seconde-carriere .st-obj-row{ grid-template-columns:1fr !important; } html.ifcar-page-seniors-seconde-carriere .st-sol-grid{ grid-template-columns:1fr !important; } html.ifcar-page-seniors-seconde-carriere .st-sol-card:nth-child(7){ grid-column:auto !important; } }

/* Titre de page (kicker du hero) = libellé du menu / sous-menu, en dégradé bleu -> vert.
   Posé par menuEyebrow() dans i18n.js sur .rech-/.grp-/.cx-/.st-eyebrow, .ijr-brand, etc. */
.ifcar-mtitle{ background:linear-gradient(90deg,#1c9ad6,#62C414) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:transparent !important; display:inline-block !important; }
.ifcar-mtitle *{ -webkit-text-fill-color:transparent !important; color:transparent !important; background:none !important; }
/* TAILLE UNIQUE pour le titre de page des 20 pages Recrutement → Accompagnement : chaque
   famille de hero avait la sienne (12,5 / 13 / 13,5 / 14 / 15,5 px, et 26 px sur IFCARJOB).
   Les marges, elles, restent propres à chaque hero (certains H1 portent déjà leur écart). */
.ifcar-mtitle{ font-size:14px !important; letter-spacing:.15em !important; }
/* IFCARJOB : son kicker .ijr-brand n'a pas de text-transform, contrairement aux autres pages.
   Il était aussi en 26px — c'était le logotype "IFCARJOB" d'origine, avant que menuEyebrow()
   n'en fasse le titre de page (d'où la marge basse ramenée au gabarit commun). */
.ijr-brand.ifcar-mtitle{ text-transform:uppercase !important; margin-bottom:14px !important; }

/* Footer « Nos domaines » : la liste vient de toutes les sous-pages du menu, sur 2 colonnes. */
.footer-item .ifcar-fnav.two{ column-count:2; column-gap:24px; }
.footer-item .ifcar-fnav.two li{ break-inside:avoid; -webkit-column-break-inside:avoid; }
.footer-item .ifcar-fnav.two a{ font-size:13.5px; }
/* … et cette colonne est centrée (titre + liens). */
.footer-item.ifcar-fcol-domains{ text-align:center; }
.footer-item.ifcar-fcol-domains .widget-title{ text-align:center; }
/* le bloc de liens est centré dans la colonne, mais les liens restent alignés entre eux */
.footer-item.ifcar-fcol-domains .ifcar-fnav.two{ max-width:390px; margin:0 auto; text-align:left; }
.footer-item.ifcar-fcol-domains .ifcar-fnav.two li{ text-align:left; }

/* Conseil + ses sous-pages (.cx-h1), Accompagnement individuel (.ax-h1) et ses
   sous-pages (.st-h1) : titres de hero en majuscules, comme les pages Formation. */
.cx-h1, .ax-h1, .st-h1{ text-transform:uppercase !important; }

/* ===== Footer "rideau" (même principe que transdev.com) =====
   Le footer reste fixé au bas de la fenêtre, DERRIÈRE la page ; le contenu défile par-dessus
   et le découvre en fin de scroll. Posé par setupFooterReveal() dans i18n.js, qui ajoute
   .ifcar-above-footer à tous les blocs situés avant le footer et réserve sa hauteur. */
html.ifcar-frev footer{ position:fixed !important; left:0 !important; right:0 !important; bottom:0 !important; top:auto !important; width:auto !important; z-index:0 !important; }
html.ifcar-frev .ifcar-above-footer{ position:relative; z-index:1; }

/* ===== Photos de hero : une seule taille sur toutes les pages Recrutement -> Accompagnement
   (gabarit = celle de « Formation Inter-Entreprise », 701 × 526). Les PNG sont détourés
   (versions -cut) : plus de rectangle blanc, la photo seule sur le fond de la page.
   object-fit:contain -> aucune déformation si le format source diffère. ===== */
.rech-hero-photo > img,
.ijr-blob > img,
.pub-hero-photo > img,
.grp-hero-card > img,
.coopx .hero-img > img,
.form-hero-card > img,
.ig-hero-card > img,
.fc-hero-card > img,
.sm-hero-card > img,
.sgp-blob > img,
.cx-hero-blob > img,
.ax-hero-blob > img,
.st-hero-blob > img{
  width:701px !important; height:526px !important; max-width:100% !important;
  object-fit:contain !important; display:block !important; margin:0 auto !important;
  background:none !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; padding:0 !important;
}
/* les conteneurs ne doivent plus dessiner de cadre / de fond derrière la photo */
.rech-hero-photo, .ijr-blob, .pub-hero-photo, .grp-hero-card, .coopx .hero-img,
.form-hero-card, .ig-hero-card, .fc-hero-card, .sm-hero-card, .sgp-blob,
.cx-hero-blob, .ax-hero-blob, .st-hero-blob{
  background:none !important; border:0 !important; box-shadow:none !important; overflow:visible !important;
}
/* …et la colonne qui la porte fait la même largeur partout (gabarit .sm-hero-grid :
   1fr | 701px, gouttière 36px), sinon la photo restait bridée par sa colonne.
   Au-dessus de 1100 px seulement : en dessous, les grilles passent en 1 colonne. */
@media (min-width:1100px){
  .rech-hero-grid, .ijr-hero-grid, .grp-hero-grid, .form-hero-grid, .ig-hero-grid,
  .fc-hero-grid, .sm-hero-grid, .sgp-hero-grid, .cx-hero-grid, .ax-hero-grid,
  .st-hero-grid, .coopx .hero-grid{
    grid-template-columns:minmax(0,1fr) 701px !important; column-gap:36px !important;
  }
}
/* ces trois porte-photos étaient plafonnés à 600 px, la photo n'atteignait pas 701 */
.rech-hero-photo, .ax-hero-blob, .st-hero-blob{ max-width:701px !important; width:701px !important; }

/* ===== Photos de hero : le HAUT de la photo aligné sur le HAUT du titre de page =====
   Les grilles de hero étaient de deux sortes : align-items:center (la photo, plus haute que
   le texte, remontait AU-DESSUS du titre) ou align-items par défaut = stretch (la colonne
   s'étirait et la photo se recentrait dedans, donc DESCENDAIT sous le titre). D'une page à
   l'autre l'écart photo/titre allait de -94 px à +114 px, ce qui donnait l'impression de
   photos de tailles différentes. On cale tout en haut : le haut de la photo tombe sur le
   haut du kicker, qui est la première ligne du titre de page (posée par menuEyebrow()).
   La taille, elle, est déjà unifiée à 701 × 526 par le bloc précédent. */
@media (min-width:1100px){
  .rech-hero-grid, .ijr-hero-grid, .grp-hero-grid, .pub-hero-grid, .form-hero-grid,
  .ig-hero-grid, .fc-hero-grid, .sm-hero-grid, .sgp-hero-grid, .cx-hero-grid,
  .ax-hero-grid, .st-hero-grid, .coopx .hero-grid{ align-items:start !important; }

  .rech-hero-right, .grp-hero-media, .form-hero-media{ align-items:flex-start !important; }

  .rech-hero-photo, .ijr-blob, .pub-hero-photo, .grp-hero-card, .coopx .hero-img,
  .form-hero-card, .ig-hero-card, .fc-hero-card, .sm-hero-card, .sgp-blob,
  .cx-hero-blob, .ax-hero-blob, .st-hero-blob{
    align-self:start !important; margin-top:0 !important; padding-top:0 !important;
  }
  /* le kicker ouvre le bloc texte : pas de marge au-dessus, sinon le titre part plus bas */
  .rech-eyebrow, .grp-eyebrow, .coopx .eyebrow, .form-eyebrow, .ig-eyebrow, .fc-eyebrow,
  .sm-eyebrow, .sgp-eyebrow, .cx-eyebrow, .ax-eyebrow, .st-eyebrow, .ijr-brand{
    margin-top:0 !important;
  }
}

/* ---- …et on aligne le haut VISIBLE de la photo, pas le haut de sa boîte ----------------
   Les PNG détourés ont chacun une marge transparente différente au-dessus du sujet (16 à
   55 px une fois rendus) : à boîtes alignées, les photos paraissaient encore commencer à
   des hauteurs différentes. Chaque valeur ci-dessous = l'écart mesuré entre le premier
   pixel opaque de la photo et le haut du kicker, animations figées (tools/inktop.js).
   À refaire si une photo de hero est remplacée. */
@media (min-width:1100px){
  html.ifcar-page-recrutement .rech-hero-photo{ margin-top:-32px !important; }
  html.ifcar-page-ifcarjob .ijr-blob{ margin-top:-32px !important; }
  html.ifcar-page-etablissements-et-entreprises-publics .pub-hero-photo{ margin-top:-25px !important; }
  html.ifcar-page-groupes-et-entreprises-prives .grp-hero-card{ margin-top:-36px !important; }
  .coopx .hero-img{ margin-top:-19px !important; }            /* page Coopération (classe racine services-details-1) */
  html.ifcar-page-formation .form-hero-card{ margin-top:-18px !important; }
  html.ifcar-page-ingenierie-de-formation .ig-hero-card{ margin-top:-55px !important; }
  html.ifcar-page-formation-continue-intra-entreprise .fc-hero-card{ margin-top:-21px !important; }
  html.ifcar-page-seminaires-de-formation-interentreprises .sm-hero-card{ margin-top:-16px !important; }
  html.ifcar-page-seminaires-de-formation-grand-public .sgp-blob{ margin-top:-17px !important; }
  html.ifcar-page-conseil .cx-hero-blob{ margin-top:-42px !important; }
  html.ifcar-page-strategie-organisation-accompagnement-rh .cx-hero-blob{ margin-top:-6px !important; }
  html.ifcar-page-audit-diagnostic-rh .cx-hero-blob{ margin-top:-17px !important; }
  html.ifcar-page-emplois-competences-carrieres .cx-hero-blob{ margin-top:-16px !important; }
  html.ifcar-page-performance-evaluation-remuneration .cx-hero-blob{ margin-top:-14px !important; }
  html.ifcar-page-accompagnement-individuel .ax-hero-blob{ margin-top:-26px !important; }
  html.ifcar-page-etudiants-jeunes-diplomes .st-hero-blob{ margin-top:-23px !important; }
  html.ifcar-page-salaries-cadres-managers .st-hero-blob{ margin-top:-10px !important; }
  html.ifcar-page-professionnels-en-transition .st-hero-blob{ margin-top:-31px !important; }
  html.ifcar-page-seniors-seconde-carriere .st-hero-blob{ margin-top:-40px !important; }
}

/* ===== Qui sommes-nous — section « Des solutions pour votre développement » / « Notre mission »
   Elle était la seule de la page restée sur le `default-padding` du gabarit (120 px en haut ET
   en bas), alors que toutes ses voisines tournent autour de 50 px : d'où un grand vide au-dessus
   et au-dessous, la section paraissait démesurée par rapport à son contenu.
   On l'aligne sur le rythme de la page. Le contenu lui-même (texte + photo + carte de
   statistiques) n'est pas touché : les 80 px sous la photo sont nécessaires, la carte
   `.about-card` est en position:absolute;bottom:-80px et déborde volontairement. */
html.ifcar-page-about-us .about-style-one-area{
  padding-top:54px !important; padding-bottom:48px !important;
}
/* …et la colonne de texte était centrée verticalement sur la colonne image (`.row.align-center`
   du gabarit) : la photo commençait en haut de la rangée, le titre 103 px plus bas, d'où un grand
   blanc au-dessus de « DES SOLUTIONS POUR VOTRE DÉVELOPPEMENT ». On cale les deux colonnes en
   haut, comme les photos de hero : le titre part au même niveau que la photo. */
@media (min-width:992px){
  html.ifcar-page-about-us .about-style-one-area .row.align-center{ align-items:flex-start !important; }
}

/* ===== « Membres de l'équipe » — carte portrait (design IFCAR) =====
   12 membres, 4 à la fois, transition vers les 4 suivants toutes les 4 s (en pause au survol).
   La carte est un portrait 4:5 : le nom et la fonction sont posés SUR la photo, sur un voile
   sombre dégradé. Au survol la photo zoome, un voile bleu→vert de la charte monte par-dessus,
   un reflet balaie la carte, un liseré blanc se dessine et le trait sous le nom s'allonge.
   Le bloc texte réserve 2 lignes de fonction : les cartes gardent la même hauteur d'un groupe
   à l'autre (un seul intitulé tient sur 2 lignes). */
.ifcar-tm-col{ opacity:0; transform:translateY(28px);
  transition:opacity .55s ease, transform .55s ease; }
.ifcar-tm-col.show{ opacity:1; transform:none; }
.ifcar-team-rot.leaving .ifcar-tm-col{
  opacity:0 !important; transform:translateY(-22px) !important; transition-delay:0s !important; }
.ifcar-tm-col:nth-child(1){ transition-delay:0s; }
.ifcar-tm-col:nth-child(2){ transition-delay:.09s; }
.ifcar-tm-col:nth-child(3){ transition-delay:.18s; }
.ifcar-tm-col:nth-child(4){ transition-delay:.27s; }

.tmx{ position:relative; display:block; aspect-ratio:4/5; border-radius:18px; overflow:hidden;
  background:#0c2244; isolation:isolate;
  box-shadow:0 12px 28px -16px rgba(12,34,68,.5);
  transition:transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s ease; }
.tmx-ph{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .8s cubic-bezier(.2,.7,.2,1); }
/* voile sombre permanent : garantit la lisibilité du texte quelle que soit la photo */
.tmx-veil{ position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(to top, rgba(9,26,52,.94) 0%, rgba(9,26,52,.74) 26%,
                                     rgba(9,26,52,.12) 56%, rgba(9,26,52,0) 76%); }
/* voile de marque, révélé au survol */
.tmx-tint{ position:absolute; inset:0; z-index:1; pointer-events:none; opacity:0;
  /* teinte volontairement légère au-dessus du visage : la photo doit rester lisible */
  background:linear-gradient(to top, rgba(28,154,214,.78) 0%, rgba(28,154,214,.34) 30%,
                                     rgba(140,198,63,.14) 58%, rgba(140,198,63,0) 80%);
  transition:opacity .5s ease; }
/* reflet qui balaie la carte */
.tmx-shine{ position:absolute; top:-60%; left:0; width:45%; height:220%; z-index:2;
  pointer-events:none; transform:rotate(18deg) translateX(-180%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.30), transparent); }
/* liseré qui se dessine */
.tmx::after{ content:""; position:absolute; inset:0; z-index:3; border-radius:18px;
  pointer-events:none; box-shadow:inset 0 0 0 0 rgba(255,255,255,0);
  transition:box-shadow .45s ease; }

.tmx-body{ position:absolute; left:0; right:0; bottom:0; z-index:3; padding:0 20px 20px; color:#fff; }
.tmx-body::before{ content:""; display:block; width:34px; height:3px; border-radius:3px;
  margin:0 0 12px; background:linear-gradient(90deg,#1c9ad6,#8cc63f);
  transition:width .45s cubic-bezier(.2,.7,.2,1); }
.tmx-body h4{ margin:0; font-size:17px; line-height:1.25; font-weight:700; color:#fff; }
.tmx-fn{ display:block; margin-top:6px; min-height:36px;
  font-size:12.5px; line-height:1.45; font-weight:500; color:#d3e7f6; }

/* ---- survol ---- */
.tmx:hover{ transform:translateY(-10px); box-shadow:0 32px 54px -22px rgba(28,154,214,.6); }
.tmx:hover .tmx-ph{ transform:scale(1.09); }
.tmx:hover .tmx-tint{ opacity:1; }
.tmx:hover .tmx-shine{ transition:transform .9s ease; transform:rotate(18deg) translateX(420%); }
.tmx:hover::after{ box-shadow:inset 0 0 0 2px rgba(255,255,255,.9); }
.tmx:hover .tmx-body::before{ width:78px; }

/* ==========================================================================
   HERO DES PAGES « Qui sommes-nous » → dernière sous-page Accompagnement :
   même traitement partout, calqué sur la page STRATÉGIE, ORGANISATION &
   ACCOMPAGNEMENT RH (famille `.cx-*`, la seule qui l'avait déjà) :
     1. le SURTITRE porte un court trait dégradé à sa DROITE (`.cx-eyebrow::after`) ;
     2. le TITRE de page a une taille unique — il allait de 38 à 54 px selon la
        famille de hero (38 grp · 42 cx · 44 sm/ax · 45 form · 46 ig/st · 50 rech/ijr
        · 52 fc · 54 sgp) ;
     3. ses mots mis en valeur sont TOUS en BLEU (certains étaient verts) ;
     4. un trait dégradé le souligne (`.cx-h1-line`), ajouté là où il manquait.
   ⚠️ Aucun `h1` nu n'est visé : sur /qui-sommes-nous et /ifcarjob le premier <h1>
   du document est celui du fil d'ariane du gabarit (blanc, centré) — il ne doit pas
   bouger. On ne cible que les titres de hero, par leur classe.
   ========================================================================== */

/* --- 1) trait dégradé à droite du surtitre ------------------------------- */
/* `.ifcar-mtitle` est posée par menuEyebrow() sur les 20 pages Recrutement →
   Accompagnement ; `.ifcar-adn-eyebrow` est le surtitre propre à Qui sommes-nous. */
/* ⚠️ Le trait SUIT LE TEXTE (inline), il n'est pas calé sur le bord droit du bloc.
   En absolu (`right:0`), un surtitre qui passe à la ligne — « STRATÉGIE, ORGANISATION &
   ACCOMPAGNEMENT RH » sur deux lignes — laissait le trait à 57 px de la fin du texte,
   centré entre les deux lignes : il paraissait détaché. Pour un surtitre court, le rendu
   est identique à avant (l'écart valait déjà 10 px). */
.ifcar-mtitle, .ifcar-adn-eyebrow{
  position:relative !important; display:inline-block !important; padding-right:0 !important; }
.ifcar-mtitle::after, .ifcar-adn-eyebrow::after,
.cx-hero-left .cx-eyebrow::after{
  content:""; position:static; display:inline-block; width:30px; height:2px;
  /* marge LOGIQUE : `margin-left` est physique, et en arabe le trait se place à la GAUCHE
     du texte — les 10 px tombaient alors du côté opposé et le trait était collé au titre. */
  margin-inline-start:10px; vertical-align:middle; border-radius:2px; transform:none;
  background:linear-gradient(90deg,#1c9ad6,#62C414) !important;
  -webkit-text-fill-color:initial; }
/* CX_STYLE (injecté dans le corps de page) réserve 40 px à droite pour son trait absolu */
.cx-hero-left .cx-eyebrow{ padding-right:0 !important; }

/* --- 2) taille unique du titre de page ----------------------------------- */
/* `clamp` plutôt qu'une valeur fixe : au-dessus de ~1435 px tout le monde est à
   38 px, et en dessous les titres rétrécissent ENSEMBLE — une taille fixe aurait
   débordé des heros sur les écrans étroits (le desktop est aussi servi aux tablettes).
   38 px et non 42 : titres raccourcis d'un cran à la demande (2026-08-22). */
.rech-h1, .ijr-h1, .grp-h1, .form-h1, .ig-h1, .fc-h1, .sm-h1, .sgp-h1,
.cx-h1, .ax-h1, .st-h1, .coopx h1, .ifcar-adn-title{
  font-size:clamp(28px, 2.65vw, 38px) !important; }

/* --- 3) les mots mis en valeur, tous en bleu ----------------------------- */
/* `background:none` + `-webkit-text-fill-color` : certains de ces mots sont des
   textes en DÉGRADÉ clippé (Qui sommes-nous), une simple `color` ne suffirait pas. */
.rech-h1 .g, .ijr-h1 .g, .grp-h1 .g, .form-h1 .g, .ig-h1 .g, .fc-h1 .g,
.sm-h1 .g, .sgp-h1 .g, .cx-h1 .g, .ax-h1 .g, .st-h1 .g, .coopx h1 .g,
.rech-h1 .b, .ijr-h1 .b, .grp-h1 .b, .form-h1 .b, .ig-h1 .b, .fc-h1 .b,
.sm-h1 .b, .sgp-h1 .b, .cx-h1 .b, .ax-h1 .b, .st-h1 .b, .coopx h1 .b,
.ifcar-adn-title span{
  color:#1c9ad6 !important; -webkit-text-fill-color:#1c9ad6 !important;
  background:none !important; }

/* --- 4) trait dégradé sous le titre, là où il manquait ------------------- */
/* Les familles rech / form / ig / fc / sm / sgp ont déjà leur `*-hero-deco`, et la
   famille cx son `.cx-h1-line` : on ne complète que les autres, avec les mêmes
   dimensions (64 × 4 px, mêmes marges). */
.grp-h1::after, .ijr-h1::after, .ax-h1::after, .st-h1::after, .coopx h1::after{
  content:""; display:block; width:64px; height:4px; border-radius:4px;
  background:linear-gradient(90deg,#1c9ad6,#62C414); margin:16px 0 18px; }

/* --- 5) un seul modèle de trait : celui de Conseil ----------------------- */
/* Cinq heros (Recrutement, Formation, Ingénierie, Formation continue, Séminaires
   interentreprises) et celui des Séminaires grand public utilisaient un AUTRE trait :
   deux segments (bleu / vert) séparés par un point, sur ~411 px de large. Ils prennent
   maintenant exactement le trait de Conseil (`.cx-h1-line`) : une seule barre dégradée
   de 64 × 4 px. On restyle le conteneur et on masque ses trois morceaux, plutôt que de
   toucher au balisage des heros dans i18n.js.
   ⚠️ `.sgp-sdeco` (le trait des TITRES DE SECTION de la page Grand public) n'est pas
   visé : seul le trait du hero change. */
.rech-hero-deco, .form-hero-deco, .ig-hero-deco, .fc-hero-deco, .sm-hero-deco,
.sgp .sgp-deco{
  display:block !important; width:64px !important; height:4px !important;
  border-radius:4px !important; gap:0 !important;
  background:linear-gradient(90deg,#1c9ad6,#62C414) !important;
  margin:16px 0 18px !important; }
.rech-hero-deco > *, .form-hero-deco > *, .ig-hero-deco > *, .fc-hero-deco > *,
.sm-hero-deco > *, .sgp .sgp-deco > *{ display:none !important; }

/* ANTI-FLASH DE LANGUE — le <head> de chaque page pose html.i18n-boot quand la langue
   mémorisée n'est pas le français ; i18n.js la retire dès que apply() a traduit le DOM
   (et un setTimeout de secours dans le <head> la retire au bout de 2 s). */
html.i18n-boot body > * { visibility: hidden !important; }

/* ============================================================================
   ARABE / RTL — compléments (2026-08-22)
   Le gabarit garde volontairement un EN-TÊTE en LTR (ses décors absolus ne
   survivent pas au miroir) ; tout le corps, lui, passe en RTL. Ce bloc corrige
   ce que le simple dir="rtl" ne retourne pas tout seul.
   ========================================================================== */

/* 1) Débordement horizontal de 556 px : l'en-tête forcé en LTR dans un document
      RTL crée un dépassement fantôme. `clip` sur l'axe X seulement, pour que les
      menus déroulants continuent de sortir verticalement. */
html[dir="rtl"] nav.navbar{
  overflow-x:clip;              /* tue le dépassement fantôme de 556 px */
  top:0 !important;             /* la boîte remonte jusqu'en haut de la page… */
  padding-top:50px !important;  /* …mais le contenu reste à sa place */
  background-clip:content-box !important;  /* le blanc ne peint que la barre, pas le bandeau */
  pointer-events:none;          /* la zone agrandie ne doit pas voler les clics du bandeau */
}
html[dir="rtl"] nav.navbar > *{ pointer-events:auto; }
/*    ⚠ Pourquoi cette gymnastique plutôt qu'un simple `overflow-x:clip` :
      le logo déborde d'environ 36 px AU-DESSUS de la barre de nav (il empiète volontairement
      sur le bandeau sombre). La spec dit que seul l'axe X est rogné, mais Safari rogne aussi
      la verticale quand `body` porte un `zoom` — ce que fait lockScale() dès 1300 px — et le
      haut du logo disparaît. `overflow-clip-margin` ne corrige rien : WebKit ne l'implémente
      pas. La parade est donc d'agrandir la BOÎTE de la nav jusqu'en haut de page : le logo se
      retrouve à l'intérieur, il n'y a plus rien à rogner verticalement. Le `padding-top` garde
      le contenu à sa hauteur d'origine, `background-clip:content-box` empêche le blanc de
      recouvrir le bandeau, et `pointer-events` rend au bandeau ses clics. */
html[dir="rtl"] nav.navbar.sticked{
  top:0 !important; padding-top:0 !important; background-clip:border-box !important;
}
/*    `html.ifcar-home nav.navbar:not(.sticked){background:#fff !important}` (plus haut) est un
      RACCOURCI `background` : il remet background-clip à border-box et le blanc recouvrait alors
      le bandeau. On repasse derrière avec une spécificité au moins égale. */
html[dir="rtl"] body nav.navbar:not(.sticked){ background-clip:content-box !important; }


/* 2) Puces de listes : le rond passe à droite et le retrait avec lui. */
html[dir="rtl"] .pub-tool-list li,
html[dir="rtl"] .pub-confid-list li{ padding-left:0; padding-right:18px; }
html[dir="rtl"] .pub-tool-list li::before,
html[dir="rtl"] .pub-confid-list li::before{ left:auto; right:0; }

/* 3) Flèches « vers la suite » : en arabe elles doivent pointer vers la gauche. */
html[dir="rtl"] .ifcar-rdv-btn .fa-arrow-right,
html[dir="rtl"] .hc-cb-btn .fa-arrow-right,
html[dir="rtl"] .c2-submit .fa-arrow-right,
html[dir="rtl"] .nh-cta .fa-arrow-right,
html[dir="rtl"] .ctc-send .ph,
html[dir="rtl"] .ifcar-rdv-btn .ph{ transform:scaleX(-1); }

/* 4) Formulaire de contact : icône, étiquette flottante et retrait miroités. */
html[dir="rtl"] .c2-field>i:first-child{ left:auto; right:16px; }
html[dir="rtl"] .c2-field input,
html[dir="rtl"] .c2-field select,
html[dir="rtl"] .c2-field textarea{ padding-left:16px; padding-right:44px; text-align:right; }
html[dir="rtl"] .c2-field label{ left:auto; right:44px; }
html[dir="rtl"] .c2-area label{ left:auto; right:16px; }

/* 5) Valeurs latines (téléphone, fax, ICE, e-mail, adresse) : elles doivent
      rester lues de gauche à droite, sinon « +212 5 37 » se retourne. */
html[dir="rtl"] .hc-info-v,
html[dir="rtl"] .ctc-info-v,
html[dir="rtl"] [data-noi18n]{ direction:ltr; unicode-bidi:isolate; text-align:right; }


/* ==========================================================================
   EN-TÊTE — MAQUETTE « menu.png » (bureau, ≥ 1300 px)

   Mesures relevées sur la maquette, ramenées à la largeur de conception de
   1440 px (le corps est verrouillé à 1440 et zoomé, cf. lockScale) :
     · bandeau sombre 54 px, rangée de menu 62 px (bas de l'en-tête à 116) ;
     · bloc blanc du logo collé au bord gauche, 205 × 116, logo ≈ 72 px de haut ;
     · menu de 216 à 1051 px, chaque lien précédé de son icône bicolore
       (bleu #0b6bb5 + vert IFCAR) ; recherche 1067 → 1215 ; bouton 181 × 50 ;
       30 px de marge à droite.

   Le DOM du gabarit n'est PAS modifié (il est figé dans 28 pages par
   bake_menu.js) : tout passe par cette feuille. Deux structures coexistent —
     · l'accueil : nav > .container > .row > [col logo][col menu][col bouton] ;
     · toutes les autres pages : nav > .container.d-flex > [.navbar-header]
       [#navbar-menu][.attr-right], sans colonnes.
   Chaque règle de mise en page existe donc en deux versions.

   La pastille de recherche est placée par JavaScript (placeSearchPill) au
   milieu de l'espace LIBRE entre le dernier lien et le bouton, et masquée
   s'il reste moins de 86 px. Le menu se réserve donc 178 px à droite : la
   pastille y tombe exactement où la maquette la met. Ses marges restent au
   script — aucune règle `!important` ici ne doit les toucher.

   Spécificité : chaque règle commence par `html body` et porte `!important`
   pour passer devant les nombreuses règles `!important` plus haut. Rien ne
   change sous 1300 px (menu hamburger du gabarit).
   ========================================================================== */
@media (min-width:1300px){

  /* ---- Conteneur pleine largeur, bord gauche au logo, 30 px à droite ----- */
  html body nav.navbar > .container{
    max-width:none !important; width:100% !important; margin:0 !important;
    padding:0 30px 0 0 !important;
  }
  /* accueil : la rangée Bootstrap devient une seule ligne flex */
  html body nav.navbar > .container > .row{
    display:flex !important; flex-wrap:nowrap !important; align-items:center !important; margin:0 !important;
  }
  /* pages intérieures : le conteneur est lui-même la ligne */
  html body nav.navbar > .container.d-flex{
    display:flex !important; flex-wrap:nowrap !important; align-items:center !important;
    justify-content:flex-start !important;
  }

  /* ---- Zone du logo : 205 px, logo centré dedans --------------------------- */
  html body nav.navbar > .container > .row > .col-xl-2,
  html body nav.navbar > .container.d-flex > .navbar-header{
    flex:0 0 205px !important; width:205px !important; max-width:205px !important;
    margin:0 !important; padding:0 !important; align-self:stretch !important;
    display:flex !important; align-items:center !important; justify-content:center !important;
  }
  html body nav.navbar > .container > .row > .col-xl-2 > .navbar-header{
    margin:0 !important; padding:0 !important; width:100% !important;
    display:flex !important; align-items:center !important; justify-content:center !important;
  }
  html body nav.navbar .navbar-header .navbar-brand{
    margin:0 !important; padding:0 !important; float:none !important; display:block !important; height:auto !important;
  }

  /* ---- Zone du menu : du logo au bouton, 178 px gardés pour la recherche -- */
  html body nav.navbar > .container > .row > .col-xl-6,
  html body nav.navbar > .container.d-flex > #navbar-menu{
    flex:1 1 auto !important; max-width:none !important; min-width:0 !important; width:auto !important;
    margin:0 !important; padding:0 178px 0 11px !important;
  }
  html body nav.navbar > .container.d-flex > #navbar-menu{ display:flex !important; align-items:center !important; }
  html body nav.navbar > .container > .row > .col-xl-6 > #navbar-menu{ width:100% !important; padding:0 !important; }

  /* ---- Zone du bouton : à sa taille --------------------------------------- */
  html body nav.navbar > .container > .row > .col-xl-3,
  html body nav.navbar > .container.d-flex > .attr-right{
    flex:0 0 auto !important; max-width:none !important; width:auto !important;
    margin:0 !important; padding:0 !important;
  }

  /* ---- Le menu : réparti sur toute sa zone -------------------------------- */
  html body nav.navbar #navbar-menu .navbar-nav{
    display:flex !important; justify-content:space-between !important; align-items:center !important;
    gap:10px !important; width:100% !important; margin:0 !important; float:none !important;
    position:static !important; left:auto !important;
  }
  html body nav.navbar #navbar-menu .navbar-nav > li > a{
    display:inline-flex !important; align-items:center !important; gap:9px !important;
    padding:12px 0 !important; font-size:10.5px !important; font-weight:800 !important;
    letter-spacing:.005em !important; line-height:1.2 !important;
  }

  /* ---- Icônes bicolores ------------------------------------------------------
     Propriétés séparées, pas le raccourci `background` : en `!important`, le
     raccourci remettait `background-image:none` et, plus spécifique que les
     règles par lien, effaçait toutes les icônes. */
  html body nav.navbar #navbar-menu .navbar-nav > li > a::before{
    content:"" !important; display:block !important; flex:none !important;
    width:22px !important; height:22px !important;
    background-position:center !important; background-size:contain !important; background-repeat:no-repeat !important;
    transition:transform .32s cubic-bezier(.2, 1.5, .4, 1) !important;
  }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/"]::before{ background-image:url(/assets/img/menu/accueil.svg?v=2) !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/qui-sommes-nous"]::before{ background-image:url(/assets/img/menu/qui-sommes-nous.svg?v=2) !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/recrutement"]::before{ background-image:url(/assets/img/menu/recrutement.svg?v=2) !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/formation"]::before{ background-image:url(/assets/img/menu/formation.svg?v=2) !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/conseil"]::before{ background-image:url(/assets/img/menu/conseil.svg?v=2) !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/accompagnement-individuel"]::before{ background-image:url(/assets/img/menu/accompagnement-individuel.svg?v=2) !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/blog"]::before{ background-image:url(/assets/img/menu/blog.svg?v=2) !important; }
  /* au survol, l'icône se soulève d'un cran */
  html body nav.navbar #navbar-menu .navbar-nav > li:hover > a::before{ transform:translateY(-2px) scale(1.08) !important; }

  /* ---- Soulignement : sous le LIBELLÉ seul, pas sous l'icône --------------- */
  html body nav.navbar #navbar-menu .navbar-nav > li > a::after{
    left:31px !important; right:0 !important; height:3px !important; border-radius:3px !important;
    transform:translateY(14px) scaleX(0) !important;
  }
  html body nav.navbar #navbar-menu .navbar-nav > li:hover > a::after,
  html body nav.navbar #navbar-menu .navbar-nav > li.active > a::after,
  html body nav.navbar #navbar-menu .navbar-nav > li > a.active::after{
    transform:translateY(14px) scaleX(1) !important;
  }
  /* en arabe, l'icône passe à droite du libellé : le trait suit */
  html[dir="rtl"] body nav.navbar #navbar-menu .navbar-nav > li > a::after{ left:0 !important; right:31px !important; }

  /* ---- Bouton et pastille de recherche ------------------------------------ */
  html body nav.navbar .attr-right .attr-nav li.button > a{
    width:181px !important; height:50px !important; padding:0 !important;
    display:inline-flex !important; align-items:center !important; justify-content:center !important;
    font-size:13.5px !important; border-radius:8px !important;
  }
  html body nav.navbar .ifcar-srch-btn{ width:148px !important; height:43px !important; }

  /* ---- Accueil (hors défilement) : bloc blanc + bandeau --------------------- */
  html.ifcar-home body nav.navbar:not(.sticked){ top:54px !important; }
  html.ifcar-home body nav.navbar:not(.sticked) > .container > .row{ height:62px !important; }
  html.ifcar-home body nav.navbar:not(.sticked) .navbar-header{ position:relative !important; height:62px !important; }
  /* Le bloc blanc : un rectangle net de 205 × 116 qui remonte dans le bandeau
     (le gabarit dessinait un parallélogramme incliné de 500 % de large). */
  html.ifcar-home body nav.navbar:not(.sticked) .navbar-header::after{
    content:"" !important; display:block !important; position:absolute !important;
    left:0 !important; right:auto !important; top:-54px !important; bottom:auto !important;
    width:205px !important; height:116px !important;
    transform:none !important; background:#fff !important; z-index:-1 !important;
  }
  html.ifcar-home body nav.navbar:not(.sticked) .navbar-header img.logo{
    height:72px !important; max-height:72px !important; width:auto !important; top:-27px !important;
  }
  /* En arabe, la nav est étirée jusqu'en haut de page (contournement Safari,
     voir plus haut) : on décale son CONTENU de 54 px au lieu de la boîte. */
  html.ifcar-home[dir="rtl"] body nav.navbar:not(.sticked){ top:0 !important; padding-top:54px !important; }

  /* Bandeau de l'accueil : commence au bord du bloc blanc, finit à 30 px. */
  html.ifcar-home body .top-bar-area > .container{
    max-width:none !important; width:100% !important; padding:0 30px 0 233px !important;
  }
  html.ifcar-home body .top-bar-area > .container > .row{
    display:flex !important; flex-wrap:nowrap !important; justify-content:space-between !important;
    align-items:center !important; margin:0 !important;
  }
  /* `position:static` : une règle plus haut épinglait le groupe de droite en
     absolu à 22 px du haut, il tombait 14 px plus bas que l'e-mail. */
  html.ifcar-home body .top-bar-area > .container > .row > div{
    flex:0 1 auto !important; max-width:none !important; width:auto !important;
    margin:0 !important; padding:0 !important; transform:none !important; align-self:center !important;
    position:static !important; top:auto !important; right:auto !important; left:auto !important;
  }

  /* ---- Bandeau : texte et icônes un cran plus grands (maquette : +10 %) ---- */
  html body .top-bar-area ul.item-flex > li,
  html body .top-bar-area ul.item-flex > li > a{ font-size:14px !important; }
  html body .top-bar-area ul.item-flex > li > a i,
  html body .top-bar-area ul.item-flex > li i{ font-size:18px !important; margin-right:8px !important; }

  /* ---- Pages intérieures et barre collante : logo dans la rangée ---------- */
  html body nav.navbar .navbar-header img.logo{ height:64px !important; max-height:64px !important; width:auto !important; }
  html body nav.navbar.sticked .navbar-header img.logo{ height:58px !important; max-height:58px !important; top:0 !important; }
}


/* ==========================================================================
   EN-TÊTE COMPACT — ÉCRANS DE 768 À 1299 px (version bureau)

   Qui arrive ici : une fenêtre de portable réduite, et surtout TOUS LES iPad —
   iPadOS se présente comme un Mac, il reçoit donc la version bureau, en
   paysage à 1024–1194 px et en portrait à 768–834 px.

   Avant ce bloc, sur cette tranche :
     · 1200–1299 : le bouton ☰ était caché SOUS le logo (le logo, remonté de
       36 px pour l'accueil large, retombait pile dessus) ;
     · 992–1199 : le bandeau débordait, les réseaux sociaux par-dessus le fax ;
     · partout : le ☰ ne faisait rien — son script est parti avec React
       (rebranché dans i18n.js, wireSideNav).

   La barre devient une rangée simple et identique sur toutes les pages :
   [☰] [logo] … [bouton], dans le flux, au lieu d'être posée en absolu sur le
   héros comme sur grand écran. Les deux structures du gabarit (accueil en
   colonnes, autres pages en .container.d-flex) sont traitées.
   ========================================================================== */
@media (min-width:768px) and (max-width:1299px){

  /* ---- La barre : dans le flux, une seule rangée de 76 px ------------------ */
  html body nav.navbar:not(.sticked){
    position:relative !important; top:0 !important; padding-top:0 !important;
    background:#fff !important; background-clip:border-box !important;
    box-shadow:0 10px 24px -20px rgba(12, 34, 68, .45) !important; overflow:visible !important;
  }
  html body nav.navbar > .container{
    max-width:none !important; width:100% !important; margin:0 !important; padding:0 24px !important;
  }
  html body nav.navbar > .container > .row,
  html body nav.navbar > .container.d-flex{
    display:flex !important; flex-wrap:nowrap !important; align-items:center !important;
    justify-content:space-between !important; margin:0 !important; height:76px !important; min-height:76px !important;
  }
  /* accueil : colonne du logo extensible, colonne du menu sans largeur (le menu
     est un panneau fixe, sa colonne n'a rien à occuper), colonne du bouton à sa taille */
  html body nav.navbar > .container > .row > .col-xl-2{
    flex:1 1 auto !important; max-width:none !important; width:auto !important; padding:0 !important;
  }
  html body nav.navbar > .container > .row > .col-xl-6{
    flex:0 0 0 !important; width:0 !important; max-width:0 !important; margin:0 !important; padding:0 !important;
  }
  html body nav.navbar > .container > .row > .col-xl-3,
  html body nav.navbar > .container.d-flex > .attr-right{
    flex:0 0 auto !important; max-width:none !important; width:auto !important; margin:0 !important; padding:0 !important;
  }

  /* ---- [☰] [logo] ----------------------------------------------------------- */
  html body nav.navbar .navbar-header{
    display:flex !important; align-items:center !important; gap:16px !important;
    margin:0 !important; padding:0 !important; width:auto !important; height:auto !important;
    position:static !important; float:none !important;
  }
  html body nav.navbar .navbar-header::before,
  html body nav.navbar .navbar-header::after{ display:none !important; }
  html body nav.navbar .navbar-header .navbar-toggle{
    order:-1 !important; display:inline-flex !important; align-items:center !important; justify-content:center !important;
    width:44px !important; height:44px !important; margin:0 !important; padding:0 !important; float:none !important;
    position:static !important; border:1px solid #dbe4ef !important; border-radius:11px !important;
    background:#fff !important; color:#0c2244 !important; font-size:19px !important; line-height:1 !important;
    cursor:pointer !important; transition:border-color .2s, background-color .2s, color .2s !important;
  }
  html body nav.navbar .navbar-header .navbar-toggle:hover,
  html body nav.navbar .navbar-header .navbar-toggle[aria-expanded="true"]{
    border-color:#1c9ad6 !important; background:#eef7fd !important; color:#1c9ad6 !important;
  }
  /* Le gabarit centre le logo par `top:50%; left:50%; transform:translate(-50%,-50%)` :
     en position statique, il ne restait que la translation, qui sortait le logo
     de la barre par le haut. */
  html body nav.navbar .navbar-header .navbar-brand{
    position:static !important; margin:0 !important; padding:0 !important; float:none !important;
    height:auto !important; display:block !important; transform:none !important; top:auto !important; left:auto !important;
  }
  /* :not(.sticked) / .sticked + .navbar-brand : assez spécifique pour passer devant
     le « top:-36px » de l'accueil large (html.ifcar-home .navbar:not(.sticked) …). */
  html body nav.navbar:not(.sticked) .navbar-header .navbar-brand img.logo,
  html body nav.navbar.sticked .navbar-header .navbar-brand img.logo{
    height:50px !important; max-height:50px !important; width:auto !important; position:relative !important; top:0 !important;
  }
  /* le petit bouton « Prendre conseil » des téléphones : ici le grand suffit */
  html body nav.navbar .navbar-header .ifcar-m-cta{ display:none !important; }

  /* ---- Bouton ---------------------------------------------------------------- */
  html body nav.navbar .attr-right .attr-nav li.button > a{
    height:46px !important; padding:0 22px !important; display:inline-flex !important;
    align-items:center !important; border-radius:8px !important; font-size:13px !important; white-space:nowrap !important;
  }
}

/* ---- Bandeau de 992 à 1299 px : une rangée flex, sans les décalages figés ----
   Les `margin-left:175px` et `translateX(222px)` plus haut sont calculés pour
   1440 px ; plus étroit, ils faisaient chevaucher les deux moitiés. */
@media (min-width:992px) and (max-width:1299px){
  html body .top-bar-area > .container{
    max-width:none !important; width:100% !important; margin:0 !important; padding:0 24px !important;
  }
  html body .top-bar-area > .container > .row{
    display:flex !important; flex-wrap:nowrap !important; justify-content:space-between !important;
    align-items:center !important; margin:0 !important;
  }
  /* `[class*="col-"]` : le sélecteur d'attribut fait passer cette règle devant
     `.top-bar-area .container > .row > [class*="col-xl-6"]{padding-left:270px}`. */
  html body .top-bar-area > .container > .row > [class*="col-"]{
    flex:0 1 auto !important; max-width:none !important; width:auto !important; margin:0 !important;
    padding:0 !important; transform:none !important; position:static !important;
    top:auto !important; right:auto !important; left:auto !important;
  }
}
/* sous 1150 px, le second numéro et le fax laissent la place */
@media (min-width:992px) and (max-width:1149px){
  html body .top-bar-area ul.item-flex > li.ifcar-fixe,
  html body .top-bar-area ul.item-flex > li.ifcar-fax{ display:none !important; }
}

/* ==========================================================================
   PANNEAU LATÉRAL (menu ☰) — toutes largeurs sous 1300 px
   Ouvert par wireSideNav (i18n.js) qui pose `.show` sur #navbar-menu, `.on` sur
   le voile et `ifcar-nav-ouverte` sur <html>.
   ========================================================================== */
@media (max-width:1299px){
  /* Voile sous le panneau. Il est SOUS la barre (z 99 < 100) : le panneau vit
     dans la barre, un voile plus haut l'aurait recouvert. */
  .ifcar-nav-voile{
    position:fixed; inset:0; z-index:99; background:rgba(8, 20, 40, .48);
    -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
    opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease;
  }
  .ifcar-nav-voile.on{ opacity:1; visibility:visible; }
  html.ifcar-nav-ouverte, html.ifcar-nav-ouverte body{ overflow:hidden !important; }

  /* Sous 1300 px, la barre n'est pas collante (elle défile avec la page, comme
     avant), mais elle reçoit quand même `.sticked` dès 30 px de défilement — et
     avec lui l'animation `ifcarStickyDown`, donc un `transform`. Un ancêtre
     transformé devient le repère des éléments `position:fixed` : le panneau se
     calait alors sur la barre au lieu de l'écran, décalé de 35 px et coupé en
     bas. Sans transform, il reste plein écran. */
  html body nav.navbar.sticked{ animation:none !important; transform:none !important; }

  /* le panneau : 340 px, glisse depuis la gauche */
  html body nav.navbar #navbar-menu.collapse-mobile{
    position:fixed !important; top:0 !important; bottom:0 !important; left:0 !important;
    width:340px !important; max-width:86vw !important; height:100vh !important; height:100dvh !important;
    margin:0 !important; padding:22px 22px 32px !important; overflow-y:auto !important;
    background:#fff !important; z-index:9999 !important;
    box-shadow:22px 0 60px -24px rgba(8, 20, 40, .45) !important;
    transform:translateX(-110%) !important; transition:transform .42s cubic-bezier(.2, .8, .2, 1) !important;
    display:block !important; visibility:visible !important;
  }
  html body nav.navbar #navbar-menu.collapse-mobile.show{ transform:none !important; }

  /* logo du panneau : à sa proportion (il était étiré sur 340 px) */
  html body nav.navbar #navbar-menu > img{
    display:block !important; height:46px !important; width:auto !important; max-width:70% !important;
    object-fit:contain !important; margin:0 0 26px !important;
  }
  /* bouton de fermeture : en haut à droite, au-dessus du logo */
  html body nav.navbar #navbar-menu > .navbar-toggle{
    position:absolute !important; top:26px !important; right:20px !important; z-index:2 !important;
    width:38px !important; height:38px !important; border:1px solid #dbe4ef !important; border-radius:50% !important;
    background:#fff !important; color:#0c2244 !important; display:grid !important; place-items:center !important;
    line-height:1 !important; padding:0 !important; transition:transform .25s, border-color .2s, color .2s !important;
  }
  html body nav.navbar #navbar-menu > .navbar-toggle:hover{ border-color:#1c9ad6 !important; color:#1c9ad6 !important; transform:rotate(90deg) !important; }

  /* liens : icône · libellé · (flèche si sous-menu) */
  html body nav.navbar #navbar-menu .navbar-nav{ display:block !important; margin:0 !important; float:none !important; width:100% !important; position:static !important; left:auto !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li{ display:block !important; float:none !important; border-bottom:1px solid #eef2f7 !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a{
    display:flex !important; align-items:center !important; gap:12px !important;
    padding:14px 34px 14px 2px !important; font-size:13px !important; font-weight:700 !important;
    text-transform:uppercase !important; letter-spacing:.01em !important; color:#0c2244 !important;
    line-height:1.3 !important; position:relative !important; background:none !important;
  }
  html body nav.navbar #navbar-menu .navbar-nav > li.active > a,
  html body nav.navbar #navbar-menu .navbar-nav > li > a.active{ color:#1c9ad6 !important; }
  /* plus de soulignement dans le panneau : la couleur suffit */
  html body nav.navbar #navbar-menu .navbar-nav > li > a::after{ display:none !important; }

  /* icônes bicolores (les mêmes que sur grand écran) */
  html body nav.navbar #navbar-menu .navbar-nav > li > a::before{
    content:"" !important; display:block !important; flex:none !important; width:22px !important; height:22px !important;
    position:static !important; transform:none !important; margin:0 !important;
    background-position:center !important; background-size:contain !important; background-repeat:no-repeat !important;
  }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/"]::before{ background-image:url(/assets/img/menu/accueil.svg?v=2) !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/qui-sommes-nous"]::before{ background-image:url(/assets/img/menu/qui-sommes-nous.svg?v=2) !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/recrutement"]::before{ background-image:url(/assets/img/menu/recrutement.svg?v=2) !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/formation"]::before{ background-image:url(/assets/img/menu/formation.svg?v=2) !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/conseil"]::before{ background-image:url(/assets/img/menu/conseil.svg?v=2) !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/accompagnement-individuel"]::before{ background-image:url(/assets/img/menu/accompagnement-individuel.svg?v=2) !important; }
  html body nav.navbar #navbar-menu .navbar-nav > li > a[href="/blog"]::before{ background-image:url(/assets/img/menu/blog.svg?v=2) !important; }

  /* Flèche des sous-menus. Le gabarit la dessinait en `::before` (police Font
     Awesome) — la place est prise par l'icône, elle passe donc en image de fond,
     et pivote quand le sous-menu est ouvert. La zone de la flèche est aussi la
     zone qui déplie : le reste du lien mène à la page (wireMobileMenu). */
  html body nav.navbar #navbar-menu .navbar-nav > li.dropdown > a{
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230c2244' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") right 8px center / 16px 16px no-repeat !important;
  }
  html body nav.navbar #navbar-menu .navbar-nav > li.dropdown.open > a{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c9ad6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
    color:#1c9ad6 !important;
  }

  /* sous-menus dépliés : en retrait sous l'icône */
  html body nav.navbar #navbar-menu .navbar-nav > li.dropdown.open > .dropdown-menu{
    display:block !important; position:static !important; float:none !important; width:100% !important;
    margin:0 0 10px !important; padding:4px 0 6px 34px !important; border:0 !important; box-shadow:none !important;
    background:transparent !important; opacity:1 !important; visibility:visible !important; transform:none !important;
    animation:ifcarSousMenu .28s ease both !important;
  }
  @keyframes ifcarSousMenu{ from{ opacity:0; transform:translateY(-4px); } }
  html body nav.navbar #navbar-menu .dropdown-menu > li > a{
    display:block !important; padding:9px 4px !important; font-size:12.5px !important; font-weight:600 !important;
    color:#33445f !important; text-transform:none !important; background:none !important; border:0 !important;
  }
  html body nav.navbar #navbar-menu .dropdown-menu > li > a::before{ display:none !important; }
  html body nav.navbar #navbar-menu .dropdown-menu > li > a:hover{ color:#1c9ad6 !important; }

  /* En arabe, une règle plus haut décale la liste du menu de 80 px
     (`html[dir="rtl"] nav.navbar #navbar-menu .navbar-nav{left:80px}`, faite
     pour le menu en ligne) : dans le panneau, elle poussait les libellés hors
     du cadre. Même spécificité + `body` pour passer devant. */
  html[dir="rtl"] body nav.navbar #navbar-menu .navbar-nav{ position:static !important; left:auto !important; right:auto !important; }
  html[dir="rtl"] body nav.navbar #navbar-menu.collapse-mobile{ direction:rtl !important; }
  /* le logo est à droite en arabe : le × passe à gauche */
  html[dir="rtl"] body nav.navbar #navbar-menu > .navbar-toggle{ right:auto !important; left:20px !important; }
  /* Les sous-menus arabes du grand écran ont une largeur minimale de 322 px
     (`[dir="rtl"] #navbar-menu .dropdown-menu`) : dans le panneau, ils
     débordaient par la gauche. Ici, la largeur du panneau, et retour à la ligne. */
  html[dir="rtl"] body nav.navbar #navbar-menu .navbar-nav > li.dropdown.open > .dropdown-menu{
    min-width:0 !important; max-width:none !important; width:100% !important; right:auto !important; left:auto !important;
  }
  html[dir="rtl"] body nav.navbar #navbar-menu .dropdown-menu > li > a{ white-space:normal !important; text-align:right !important; }
  /* en arabe, le libellé est à droite : l'icône suit, la flèche passe à gauche */
  html[dir="rtl"] body nav.navbar #navbar-menu .navbar-nav > li > a{ padding:14px 2px 14px 34px !important; }
  html[dir="rtl"] body nav.navbar #navbar-menu .navbar-nav > li.dropdown > a{ background-position:left 8px center !important; transform:none !important; }
  html[dir="rtl"] body nav.navbar #navbar-menu .navbar-nav > li.dropdown > a{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230c2244' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15 6-6 6 6 6'/%3E%3C/svg%3E") !important; }
  html[dir="rtl"] body nav.navbar #navbar-menu .navbar-nav > li.dropdown.open > .dropdown-menu{ padding:4px 34px 6px 0 !important; }
  html[dir="rtl"] body nav.navbar #navbar-menu .navbar-nav > li.dropdown.open > a{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c9ad6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important; }
}

/* ---- Sous-menus au survol : maintien pendant le trajet (wireMenuAim, i18n.js) ----
   `ifcar-garde` garde ouvert le sous-menu qu'on est en train de rejoindre ;
   `ifcar-vise` empêche les voisins survolés en chemin de s'ouvrir par-dessus. */
@media (min-width:1300px){
  html body #navbar-menu .navbar-nav > li.dropdown.ifcar-garde > ul.dropdown-menu{
    opacity:1 !important; visibility:visible !important; top:100% !important;
    transform:translateY(0) !important; transition-delay:0s !important;
  }
  html body #navbar-menu .navbar-nav.ifcar-vise > li.dropdown:not(.ifcar-garde):hover > ul.dropdown-menu{
    opacity:0 !important; visibility:hidden !important; transition-delay:0s !important;
  }
}