/* ==========================================================================
   Cabinet Alaoui Mhammedi : surcharges du template Lexicon
   (chargé après style.css)
   ========================================================================== */

/* Couleurs de l'identité visuelle (logo AMA : bleu marine + or) */
:root {
  --theme-color1: #b3945a;
  --theme-color1-rgb: 179, 148, 90;
  --theme-color2: #12233c;
  --theme-color2-rgb: 18, 35, 60;
  --theme-color3: #8a7350;
  --theme-color3-rgb: 138, 115, 80;
  --headings-color: #12233c;
  --theme-color-dark: #0b1729;
}
.footer-logo { width: 150px; height: auto; }

/* Le template met les titres en "capitalize" : inadapté au français/arabe */
.feature-block .title,
.feature-block-two .title,
.sec-title .title,
.h4, .h5, .h6 { text-transform: none; }

/* Le template ne stylise que les champs text/email du formulaire de la page avocat */
.team-contact-form input[type=tel] { background-color: #fff; color: #111; }

/* Placeholders lisibles sur fond clair (le template les force en blanc) */
input::placeholder, textarea::placeholder { color: #8a8f94; opacity: 1; }
.contact-section input::placeholder,
.contact-section textarea::placeholder { color: #8a8f94; }

.sec-lead { max-width: 820px; margin: 18px auto 0; }
.sec-title:not(.text-center) .sec-lead { margin-inline: 0; }
.sec-title.light .sec-lead, .sec-title.light .sec-lead p { color: rgba(255, 255, 255, .78); }
.text-stack p:last-child { margin-bottom: 0; }
.text-stack p + p { margin-top: 14px; }

/* ------------------------------------------------------------------- Logo */
/* Monogramme AMA seul dans les menus (le nom figure déjà dans le titre et le pied de page) */
.brand-logo { display: inline-flex; align-items: center; text-decoration: none; }
.main-header .logo .brand-mark-img,
.mobile-menu .nav-logo .brand-mark-img { display: block; width: auto; max-width: none; max-height: none; flex-shrink: 0; }
.main-header .header-lower .logo .brand-mark-img { height: 74px; transition: transform .3s ease; }
.main-header .header-lower .logo a:hover .brand-mark-img { transform: scale(1.04); }
.sticky-header .logo .brand-mark-img { height: 46px; }
.mobile-menu .nav-logo .brand-mark-img { height: 52px; }
.main-header .logo { min-width: 0; }
.header-style-one .header-lower .main-box { min-width: 0; }
.header-style-one .header-lower .inner-container { gap: 16px; }
@media (max-width: 1023.98px) {
  .main-header .header-lower .logo .brand-mark-img { height: 58px; }
  .header-style-one .header-lower .inner-container { padding-block: 14px; }
}
@media (max-width: 575.98px) {
  .main-header .header-lower .logo .brand-mark-img { height: 50px; }
  .header-style-one .header-lower .inner-container { padding-block: 12px; }
  .mobile-nav-toggler { margin-inline-start: 0; }
}

/* ------------------------------------------------------- Langues / header */
.lang-switch { display: flex; align-items: center; gap: 4px; list-style: none; margin: 0; padding: 0; margin-inline-start: 24px; }
.lang-switch li a {
  display: inline-block; min-width: 34px; padding: 3px 8px; border-radius: 20px; text-align: center;
  font-size: 13px; font-weight: 600; line-height: 1.4; color: inherit; border: 1px solid rgba(179, 148, 90, .5);
  transition: all .25s ease;
}
.lang-switch li a:hover, .lang-switch li a.active { background: var(--theme-color1); color: #fff; border-color: var(--theme-color1); }
.header-top .top-right .inner { display: flex; align-items: center; }
.lang-switch-mobile { display: none; }
.mobile-lang { padding: 10px 25px 30px; }
.mobile-lang .lang-switch { margin: 0; }
.mobile-lang .lang-switch li a { color: #fff; }
/* Le sélecteur de langue de la barre du haut suffit tant qu'elle est affichée (≥ 1024 px) */
@media (max-width: 1023.98px) {
  .lang-switch-mobile { display: block; }
  .lang-switch-mobile .lang-switch { margin: 0 12px 0 0; }
}
@media (max-width: 575.98px) {
  .lang-switch-mobile { display: none; }
  .header-style-one .outer-box .btn-style-two { display: none; }
}
.main-header .main-menu .navigation > li > ul > li > a { white-space: normal; }

/* Menu principal en flex : une seule ligne, et en arabe « Accueil » reste à côté du logo
   (le float:left du template inversait l'ordre en RTL) */
.header-lower .main-menu .navigation,
.sticky-header .main-menu .navigation { display: flex; flex-wrap: nowrap; align-items: center; column-gap: 20px; }
.header-lower .main-menu .navigation > li,
.sticky-header .main-menu .navigation > li { float: none; margin: 0; }
.header-lower .main-menu .navigation > li > a,
.sticky-header .main-menu .navigation > li > a { white-space: nowrap; }
@media (max-width: 1399.98px) {
  .header-lower .main-menu .navigation,
  .sticky-header .main-menu .navigation { column-gap: 4px; }
}
@media (max-width: 1199.98px) {
  .header-lower .main-menu .navigation > li > a,
  .sticky-header .main-menu .navigation > li > a { font-size: 15px; padding-inline: 7px; }
  .header-style-one .header-lower .main-box { gap: 18px; }
}
/* Entre 1024 et 1199 px, le menu complet occupe la largeur : « Contact » y figure déjà */
@media (min-width: 1024px) and (max-width: 1199.98px) {
  .header-style-one .header-lower .outer-box .btn-style-two { display: none; }
}

/* Barre du haut : marges logiques (RTL) et numéros jamais coupés */
.header-style-one .header-top .list-style-one li { margin-right: 0; margin-inline-end: 60px; white-space: nowrap; }
.header-style-one .header-top .list-style-one li:last-child { margin-inline-end: 0; }
.header-style-one .header-top .list-style-one li i { margin-right: 0; margin-inline-end: 10px; }
@media (max-width: 1399.98px) {
  .header-style-one .header-top .list-style-one li { margin-inline-end: 32px; }
}
@media (max-width: 1199.98px) {
  .header-style-one .header-top .list-style-one li { margin-inline-end: 20px; font-size: 13px; }
  .header-style-one .header-top .lang-switch { margin-inline-start: 16px; }
}

/* -------------------------------------------------------- WhatsApp flottant */
.whatsapp-float {
  position: fixed; z-index: 999; bottom: 24px; inset-inline-start: 24px;
  width: 56px; height: 56px; border-radius: 50%; background: #25d366; color: #fff;
  display: flex; align-items: center; justify-content: center; font-size: 30px;
  box-shadow: 0 8px 24px rgba(37, 211, 102, .35); transition: transform .25s ease;
}
.whatsapp-float:hover { color: #fff; transform: scale(1.08); }
@media (max-width: 575.98px) {
  .whatsapp-float { width: 48px; height: 48px; font-size: 25px; bottom: 16px; inset-inline-start: 16px; }
}

/* -------------------------------------------------------------- Boutons */
.btn-whatsapp, .btn-outline {
  display: inline-flex; align-items: center; gap: 10px; padding: 14px 26px; border-radius: 50px;
  font-weight: 500; line-height: 1.2; transition: all .25s ease;
}
.btn-whatsapp { background: #25d366; color: #fff; }
.btn-whatsapp:hover { background: #1ebe5a; color: #fff; }
.btn-whatsapp i { font-size: 20px; }
.btn-outline { border: 1px solid var(--theme-color1); color: var(--theme-color2); }
.btn-outline:hover { background: var(--theme-color1); color: #fff; }
.btn-outline.light { color: #fff; border-color: rgba(255, 255, 255, .6); }
.btn-outline.light:hover { background: #fff; color: var(--theme-color2); border-color: #fff; }
.contact-btns { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

/* ------------------------------------------------------------------ Hero */
/* Simple et moderne : texte sur fond bleu nuit à gauche, grand portrait à droite
   qui se fond dans le fond. Sur mobile, la photo passe au-dessus du texte. */
.hero-v2 {
  --hero-container: 960px;
  position: relative; overflow: hidden; isolation: isolate; background: var(--theme-color-dark);
}
@media (min-width: 1200px) { .hero-v2 { --hero-container: 1140px; } }
@media (min-width: 1400px) { .hero-v2 { --hero-container: 1320px; } }
.hero-v2:before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: radial-gradient(55% 75% at 0% 100%, rgba(179, 148, 90, .16), transparent 65%);
}
[dir="rtl"] .hero-v2:before { background: radial-gradient(55% 75% at 100% 100%, rgba(179, 148, 90, .16), transparent 65%); }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 45%); min-height: clamp(600px, calc(100svh - 132px), 860px); }

/* Texte : aligné sur le bord gauche des conteneurs du reste de la page */
.hero-copy {
  align-self: center; padding-block: 90px;
  padding-inline-start: max(15px, calc((100vw - var(--hero-container)) / 2 + 12px));
  padding-inline-end: clamp(32px, 5vw, 80px);
}
.hero-eyebrow {
  display: inline-flex; align-items: center; gap: 14px; color: var(--theme-color1); font-family: var(--heading-font-family);
  font-size: 16px; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 22px;
}
.hero-eyebrow:before { content: ""; width: 40px; height: 1px; background: currentColor; flex-shrink: 0; }
.hero-v2 .hero-title { color: #fff; font-size: clamp(34px, 4.1vw, 64px); line-height: 1.12; letter-spacing: -.01em; max-width: 680px; margin: 0 0 22px; }
.hero-services { color: rgba(255, 255, 255, .75); font-size: 18px; margin-bottom: 38px; }
.hero-btns { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.hero-stats { list-style: none; display: flex; gap: 48px; margin: 52px 0 0; padding: 26px 0 0; border-top: 1px solid rgba(255, 255, 255, .12); }
.hero-stats li { display: flex; flex-direction: column; gap: 6px; max-width: 220px; }
.hero-stats .num { font-family: var(--heading-font-family); font-size: 42px; line-height: 1; color: var(--theme-color1); }
.hero-stats .lbl { color: rgba(255, 255, 255, .7); font-size: 14px; line-height: 1.45; }

/* Photo : pleine hauteur, fondu vers le texte, léger zoom d'apparition */
.hero-media { position: relative; overflow: hidden; }
.hero-media img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 20%;
  animation: heroReveal 1.6s cubic-bezier(.2, .7, .2, 1) both;
}
.hero-media:after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(90deg, var(--theme-color-dark) 0%, rgba(11, 23, 41, 0) 30%),
    linear-gradient(0deg, rgba(11, 23, 41, .6) 0%, rgba(11, 23, 41, 0) 32%);
}
[dir="rtl"] .hero-media:after {
  background:
    linear-gradient(270deg, var(--theme-color-dark) 0%, rgba(11, 23, 41, 0) 30%),
    linear-gradient(0deg, rgba(11, 23, 41, .6) 0%, rgba(11, 23, 41, 0) 32%);
}
@keyframes heroReveal { from { opacity: 0; transform: scale(1.06); } to { opacity: 1; transform: none; } }
.hero-name-card {
  position: absolute; z-index: 2; bottom: 36px; inset-inline-end: 36px; display: flex; flex-direction: column; gap: 3px;
  padding: 14px 20px; border-radius: 14px; border-inline-start: 3px solid var(--theme-color1);
  background: rgba(11, 23, 41, .72); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.hero-name-card .name { color: #fff; font-family: var(--heading-font-family); font-size: 18px; line-height: 1.3; }
.hero-name-card .role { color: var(--theme-color1); font-size: 13.5px; line-height: 1.4; }

/* Points forts juste après le hero : cartes complètes, sans le chevauchement ni la découpe (mask) du template */
.hero-v2 + .feature-section { padding-top: 100px; }
.hero-v2 + .feature-section .feature-outer { margin-top: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hero-v2 + .feature-section .feature-block .inner-block {
  max-width: none; height: 100%; background: #fff; border: 1px solid rgba(18, 35, 60, .09);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.hero-v2 + .feature-section .feature-block .inner-block:before { display: none; }
.hero-v2 + .feature-section .feature-block .inner-block:hover { transform: translateY(-6px); box-shadow: 0 24px 50px rgba(18, 35, 60, .1); border-color: var(--theme-color1); }
.hero-v2 + .feature-section .feature-block .icon { width: 84px; height: 84px; margin-bottom: 30px; }
.hero-v2 + .feature-section .feature-block .icon.fa-icon i { font-size: 38px; }

@media (prefers-reduced-motion: reduce) {
  .hero-media img { animation: none; }
}
@media (max-width: 1199.98px) {
  .hero-v2 + .feature-section .feature-outer { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero-v2 + .feature-section .feature-block:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .hero-stats { gap: 32px; }
  .hero-stats .num { font-size: 38px; }
}
@media (max-width: 991.98px) {
  .hero-grid { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .hero-media { order: -1; height: min(56svh, 560px); }
  .hero-media:after { background: linear-gradient(0deg, var(--theme-color-dark) 0%, rgba(11, 23, 41, 0) 42%); }
  [dir="rtl"] .hero-media:after { background: linear-gradient(0deg, var(--theme-color-dark) 0%, rgba(11, 23, 41, 0) 42%); }
  .hero-media img { object-position: center 18%; }
  .hero-name-card { bottom: 64px; inset-inline-end: auto; inset-inline-start: 24px; }
  .hero-copy { position: relative; z-index: 2; padding: 0 24px 72px; margin-top: -24px; }
  .hero-v2 + .feature-section { padding-top: 70px; }
}
@media (max-width: 767.98px) {
  .hero-v2 + .feature-section .feature-outer { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .hero-v2 + .feature-section .feature-block .inner-block { padding: 30px 26px; }
  .hero-v2 + .feature-section .feature-block .icon { width: 72px; height: 72px; margin-bottom: 20px; }
  .hero-v2 + .feature-section .feature-block .icon.fa-icon i { font-size: 32px; }
}
@media (max-width: 575.98px) {
  .hero-media { height: min(50svh, 440px); }
  .hero-name-card { bottom: 44px; inset-inline-start: 15px; padding: 10px 14px; }
  .hero-name-card .name { font-size: 15px; }
  .hero-name-card .role { font-size: 12px; }
  .hero-copy { padding: 0 15px 60px; margin-top: -12px; }
  .hero-eyebrow { font-size: 13px; letter-spacing: .08em; gap: 10px; margin-bottom: 16px; }
  .hero-eyebrow:before { width: 26px; }
  .hero-services { font-size: 15px; margin-bottom: 28px; }
  .hero-btns > * { flex: 1 1 100%; justify-content: center; }
  .hero-stats { gap: 24px; margin-top: 38px; padding-top: 22px; }
  .hero-stats .num { font-size: 34px; }
  .hero-stats .lbl { font-size: 13px; }
}

/* Icônes Font Awesome à la place des icônes images du template */
.feature-block .icon.fa-icon { display: flex; align-items: center; justify-content: center; }
.feature-block .icon.fa-icon i { font-size: 44px; line-height: 1; }
.feature-block-two .icon.fa-icon i { color: var(--theme-color1); font-size: 42px; }
.feature-block-two .inner-block:hover .icon.fa-icon i { color: #fff; }
.feature-block-two .text p { margin-bottom: 10px; }
.feature-block-two.cta-block { display: block; height: 100%; }
.feature-block-two.cta-block .inner-block { height: 100%; background: var(--theme-color2); }
.feature-block-two.cta-block .title { color: #fff; }
.experience-two .count-box, .experience-one .count-box { white-space: nowrap; }
.about-section-two .about-info-outer { height: 100%; }

/* ------------------------------------------------------ Cartes domaines */
.practice-card {
  position: relative; display: flex; flex-direction: column; height: 100%;
  padding: 38px 34px 32px; border-radius: 24px; background: #fff;
  border: 1px solid rgba(18, 35, 60, .08); transition: all .3s ease; overflow: hidden;
}
.practice-card:hover { transform: translateY(-6px); box-shadow: 0 24px 50px rgba(18, 35, 60, .12); border-color: var(--theme-color1); }
.practice-num { position: absolute; top: 28px; inset-inline-end: 30px; font-family: var(--heading-font-family); font-size: 15px; color: rgba(18, 35, 60, .35); }
.practice-icon {
  width: 72px; height: 72px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: rgba(179, 148, 90, .14); color: var(--theme-color1); font-size: 32px; margin-bottom: 26px; transition: all .3s ease;
}
.practice-card:hover .practice-icon { background: var(--theme-color1); color: #fff; }
.practice-title { display: block; color: var(--theme-color2); margin-bottom: 12px; font-size: 22px; line-height: 1.35; }
.practice-text { display: block; color: var(--text-color); flex: 1; margin-bottom: 22px; }
.practice-more { color: var(--theme-color1); font-weight: 500; display: inline-flex; align-items: center; gap: 8px; }
.practice-card.dark { background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .12); backdrop-filter: blur(4px); }
.practice-card.dark .practice-title { color: #fff; }
.practice-card.dark .practice-text { color: rgba(255, 255, 255, .7); }
.practice-card.dark .practice-num { color: rgba(255, 255, 255, .35); }
.practice-card.dark:hover { background: rgba(255, 255, 255, .1); }
.practice-home .outer-box { padding-bottom: 60px; }
.practice-home .bottom-box { margin-top: 50px; }
.practice-list-section { padding: 120px 0; }
@media (max-width: 767.98px) { .practice-list-section { padding: 80px 0; } }

/* -------------------------------------------------------- Section avocat */
.lawyer-section { padding: 120px 0; background: var(--theme-color-lighter); }
.lawyer-photo { position: relative; border-radius: 30px; overflow: hidden; }
.lawyer-photo img { width: 100%; aspect-ratio: 4 / 4.4; object-fit: cover; }
.lawyer-badge {
  position: absolute; inset-inline: 20px; bottom: 20px; display: flex; align-items: center; gap: 14px;
  padding: 16px 20px; border-radius: 18px; background: rgba(18, 35, 60, .88); color: #fff; font-size: 15px;
}
.lawyer-badge i { color: var(--theme-color1); font-size: 28px; }
.lawyer-role { color: var(--theme-color3); font-family: var(--heading-font-family); font-size: 18px; margin-bottom: 20px; }
.credential-list, .check-list { list-style: none; padding: 0; margin: 24px 0 34px; display: grid; gap: 12px; }
.credential-list li, .check-list li { display: flex; gap: 12px; align-items: baseline; color: var(--theme-color2); }
.credential-list i, .check-list i { color: var(--theme-color1); }
.check-list { margin: 0; }
@media (max-width: 767.98px) { .lawyer-section { padding: 80px 0; } }

/* -------------------------------------------------------- Pages internes */
.text-section { padding: 110px 0; }
.text-section + .text-section { padding-top: 0; }
@media (max-width: 767.98px) { .text-section { padding: 70px 0; } }
.about-content2.static .text-stack p { margin-bottom: 0; }
.rounded-image { border-radius: 30px; overflow: hidden; }
.rounded-image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

.mission-band { position: relative; padding: 130px 0; overflow: hidden; }
.mission-band .bg-image { position: absolute; inset: 0; }
.mission-band .bg-image img { width: 100%; height: 100%; object-fit: cover; }
.mission-band .bg-image:after { content: ""; position: absolute; inset: 0; background: rgba(10, 22, 40, .86); }
.mission-band .container { position: relative; }
.mission-text p { color: rgba(255, 255, 255, .8); font-size: 18px; }

/* Bandeau de contact : carte bleu nuit, photo du bureau fondue à droite, trois tuiles de contact */
.cta-band { padding: 100px 0; }
.cta-card {
  position: relative; overflow: hidden; isolation: isolate; border-radius: 30px; padding: 64px 60px 56px;
  background: radial-gradient(60% 90% at 0% 100%, rgba(179, 148, 90, .18), transparent 60%), var(--theme-color-dark);
  box-shadow: 0 30px 70px rgba(11, 23, 41, .18);
}
.cta-card-photo { position: absolute; z-index: -1; inset-block: 0; inset-inline-end: 0; width: 46%; }
.cta-card-photo img { width: 100%; height: 100%; object-fit: cover; opacity: .55; }
.cta-card-photo:after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--theme-color-dark) 0%, rgba(11, 23, 41, .35) 100%); }
[dir="rtl"] .cta-card-photo:after { background: linear-gradient(270deg, var(--theme-color-dark) 0%, rgba(11, 23, 41, .35) 100%); }
.cta-card-text { max-width: 640px; margin: 44px auto; text-align: center; }
.cta-eyebrow {
  display: inline-flex; align-items: center; gap: 12px; margin-bottom: 16px; color: var(--theme-color1);
  font-family: var(--heading-font-family); font-size: 15px; letter-spacing: .1em; text-transform: uppercase;
}
[dir="rtl"] .cta-eyebrow { letter-spacing: 0; }
.cta-card-text .title { color: #fff; font-size: clamp(28px, 3vw, 44px); line-height: 1.22; margin-bottom: 16px; }
.cta-card-text p { color: rgba(255, 255, 255, .74); margin: 0; }
.cta-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.cta-tile {
  display: flex; align-items: center; gap: 16px; min-width: 0; padding: 20px 22px; border-radius: 18px;
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); transition: all .3s ease;
}
.cta-tile:hover { transform: translateY(-4px); background: rgba(255, 255, 255, .1); border-color: var(--theme-color1); }
.cta-tile-icon {
  width: 52px; height: 52px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  font-size: 21px; color: #fff; background: var(--theme-color1); transition: transform .3s ease;
}
.cta-tile.is-whatsapp .cta-tile-icon { background: #25d366; font-size: 25px; }
.cta-tile.is-email .cta-tile-icon { background: transparent; border: 1px solid var(--theme-color1); color: var(--theme-color1); }
.cta-tile:hover .cta-tile-icon { transform: scale(1.08); }
.cta-tile-body { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.cta-tile-label { color: rgba(255, 255, 255, .62); font-size: 13px; line-height: 1.4; }
.cta-tile-value { color: #fff; font-size: 16px; font-weight: 500; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cta-tile-arrow { color: var(--theme-color1); font-size: 15px; flex-shrink: 0; opacity: .7; transition: all .3s ease; }
.cta-tile:hover .cta-tile-arrow { opacity: 1; }
@media (max-width: 1199.98px) {
  .cta-tiles { grid-template-columns: minmax(0, 1fr); max-width: 560px; }
  .cta-card-photo { width: 55%; }
}
@media (max-width: 767.98px) {
  .cta-band { padding: 70px 0; }
  .cta-card { padding: 40px 22px 24px; border-radius: 24px; }
  .cta-card-photo { width: 100%; }
  .cta-card-photo img { opacity: .22; }
  .cta-card-text { margin-bottom: 30px; }
  .cta-tile { padding: 16px; gap: 14px; }
  .cta-tile-icon { width: 46px; height: 46px; font-size: 19px; }
}

.area-hero { position: relative; border-radius: 24px; overflow: hidden; }
.area-hero img { aspect-ratio: 16 / 8; object-fit: cover; }
.area-hero-icon {
  position: absolute; bottom: 20px; inset-inline-start: 20px; width: 70px; height: 70px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; background: var(--theme-color1); color: #fff; font-size: 30px;
}
.services-details__content .blockquote-one { margin: 30px 0; }
.sidebar-service-list li.current a, .sidebar-service-list li a.current { color: var(--theme-color1); }

.credentials-box { padding: 36px; border-radius: 24px; background: var(--theme-color2); }
.credentials-box .h4 { color: #fff; }
.credentials-box ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 18px; }
.credentials-box li { display: flex; gap: 16px; align-items: center; color: rgba(255, 255, 255, .85); }
.credentials-box i { width: 48px; height: 48px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: rgba(179, 148, 90, .15); color: var(--theme-color1); font-size: 22px; }
.blockquote-one.thesis { font-style: italic; }
.team-details__top-img img { width: 100%; border-radius: 24px; aspect-ratio: 1; object-fit: cover; }
.team-details-contact a { color: var(--text-color); }

.steps-section { padding: 0 0 110px; }
.step-card .inner-block { height: 100%; }
.trust-box { padding: 50px; border-radius: 24px; background: var(--theme-color-lighter); border-inline-start: 4px solid var(--theme-color1); }
@media (max-width: 575.98px) { .trust-box { padding: 30px; } }

.form-privacy { margin-top: 10px; padding: 20px 24px; border-radius: 16px; background: var(--theme-color-lighter); }
.form-privacy p { font-size: 14px; margin-bottom: 6px; }
.form-privacy p:last-child { margin-bottom: 0; }
/* Page contact : formulaire dans une carte */
.contact-form-card { padding: 44px 40px 40px; border-radius: 26px; background: #fff; border: 1px solid rgba(18, 35, 60, .08); box-shadow: 0 24px 60px rgba(18, 35, 60, .07); }
.contact-form-card .form-privacy { margin-top: 22px; }
/* Coordonnées : cartes avec icône ronde dorée (au lieu des carrés bleu nuit du template) */
.contact-details__right { height: 100%; }
.contact-details__info { display: grid; gap: 14px; }
.contact-details__info li {
  gap: 18px; align-items: flex-start; padding: 18px 20px; border-radius: 18px;
  background: var(--theme-color-lighter); border: 1px solid transparent; transition: all .3s ease;
}
.contact-details__info li:hover { background: #fff; border-color: var(--theme-color1); box-shadow: 0 16px 40px rgba(18, 35, 60, .08); }
.contact-details__info li .icon { width: 52px; height: 52px; border-radius: 50%; background: rgba(179, 148, 90, .16); color: var(--theme-color1); }
.contact-details__info li .icon span { font-size: 20px; }
.contact-details__info li:hover .icon { background: var(--theme-color1); color: #fff; }
.contact-details__info li .text { margin-left: 0; min-width: 0; }
.contact-details__info li .text span { font-size: 15px; line-height: 1.6; display: block; }
.contact-details__info li .text a { font-size: 17px; color: var(--theme-color2); font-weight: 500; }
.contact-details__info li:hover .text a { color: var(--theme-color1); }
.contact-details__info a { color: var(--theme-color2); }
/* Plan d'accès : texte + boutons et carte dans une même carte */
.map-block { padding: 10px 0 110px; }
.map-card { padding: 14px; border-radius: 30px; background: var(--theme-color-lighter); }
.map-intro-inner { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; justify-content: space-between; padding: 26px 26px 28px; }
.map-intro-inner > div:first-child { max-width: 560px; }
.map-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 10px; color: var(--theme-color1); font-size: 14px; font-weight: 500; }
.map-frame { border-radius: 22px; overflow: hidden; background: #e8eaee; }
.map-frame .map { display: block; width: 100%; height: 460px; border: 0; }
@media (max-width: 991.98px) {
  .contact-form-card { padding: 32px 24px; }
}
@media (max-width: 767.98px) {
  .map-block { padding-bottom: 80px; }
  .map-card { padding: 10px; border-radius: 24px; }
  .map-intro-inner { padding: 18px 14px 20px; }
  .map-frame { border-radius: 18px; }
  .map-frame .map { height: 340px; }
}

/* Pages domaines : interventions en grille de cartes, numéro de l'encadré sur une ligne */
.services-details__content .check-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.services-details__content .check-list li {
  align-items: flex-start; padding: 16px 18px; border-radius: 14px; line-height: 1.5;
  background: var(--theme-color-lighter); border: 1px solid transparent; transition: border-color .3s ease;
}
.services-details__content .check-list li:hover { border-color: rgba(179, 148, 90, .6); }
.services-details__content .check-list li i {
  width: 26px; height: 26px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  font-size: 12px; color: #fff; background: var(--theme-color1); margin-top: 1px;
}
.help-contact a { white-space: nowrap; font-size: clamp(20px, 2vw, 26px); }
@media (max-width: 767.98px) {
  .services-details__content .check-list { grid-template-columns: minmax(0, 1fr); }
}
.contact-lead { color: rgba(255, 255, 255, .78); margin-top: 16px; }

.footer-style-one .footer-info .info a { display: flex; align-items: center; gap: 10px; }
.footer-style-one .footer-info .info a i { color: var(--theme-color1); width: 16px; }
.footer-areas { columns: 2; column-gap: 24px; }
.footer-areas li { break-inside: avoid; }
.footer-tagline { opacity: .7; }
.footer-style-one .footer-top .btn-get-in { text-align: center; padding: 0 18px; line-height: 1.3; }
@media (max-width: 575.98px) { .footer-areas { columns: 1; } }

/* ==========================================================================
   Arabe (RTL)
   ========================================================================== */
[dir="rtl"] {
  --body-font-family: "Noto Naskh Arabic", "Noto Kufi Arabic", Tahoma, sans-serif;
  --heading-font-family: "Noto Kufi Arabic", Tahoma, sans-serif;
  --body-font-size: 17px;
  --body-line-height: 1.9;
  --line-height-heading-h1: 1.35;
  --line-height-heading-h2: 1.45;
  --h1-font-size: 60px;
  --h2-font-size: 40px;
  --h3-font-size: 26px;
  --h4-font-size: 21px;
}
[dir="rtl"] body { text-align: right; }
[dir="rtl"] h1, [dir="rtl"] .h1, [dir="rtl"] h2, [dir="rtl"] .h2, [dir="rtl"] h3, [dir="rtl"] .h3,
[dir="rtl"] h4, [dir="rtl"] .h4, [dir="rtl"] h5, [dir="rtl"] .h5, [dir="rtl"] h6, [dir="rtl"] .h6 { letter-spacing: 0; }
[dir="rtl"] .text, [dir="rtl"] p { letter-spacing: 0 !important; }
[dir="rtl"] .text-center { text-align: center !important; }
[dir="rtl"] .hero-eyebrow { letter-spacing: 0; text-transform: none; }
[dir="rtl"] .hero-v2 .hero-title { font-size: clamp(30px, 3.7vw, 56px); line-height: 1.45; letter-spacing: 0; }
[dir="rtl"] .lang-switch li a[lang="ar"] { font-family: var(--heading-font-family); }
[dir="rtl"] .lang-switch-mobile .lang-switch { margin: 0 0 0 12px; }

/* Flèches et chevrons pointant vers la gauche en arabe */
/* (on retourne le glyphe ::before pour ne pas écraser les transform du template) */
[dir="rtl"] .fa-arrow-up-right::before, [dir="rtl"] .fa-arrow-right::before,
[dir="rtl"] .fa-angle-right::before { display: inline-block; transform: scaleX(-1); }

/* Éléments positionnés en absolu par le template */
[dir="rtl"] .feature-block-two .number { right: auto; left: 40px; }
[dir="rtl"] .page-breadcrumb { direction: rtl; }
/* Séparateurs du fil d'Ariane : côté gauche et chevron vers la gauche en arabe */
[dir="rtl"] .page-breadcrumb li { margin-right: 0; padding-right: 0; margin-left: 12px; padding-left: 13px; }
[dir="rtl"] .page-breadcrumb li:after { right: auto; left: -6px; content: "\f104"; }
[dir="rtl"] .page-breadcrumb li:last-child { margin-left: 0; padding-left: 0; }
[dir="rtl"] .accordion-box .block .acc-btn { padding-right: 30px; padding-left: 70px; text-align: right; }
[dir="rtl"] .accordion-box .block .acc-btn .icon { right: auto; left: 30px; }
[dir="rtl"] .about-list li i, [dir="rtl"] .credential-list li i { margin-right: 0; margin-left: 10px; }
[dir="rtl"] .main-header .main-menu .navigation > li.dropdown > ul { left: auto; right: 0; text-align: right; }
[dir="rtl"] .main-header .main-menu .navigation > li > ul > li > ul { left: auto; right: 100%; }
[dir="rtl"] .mobile-menu .navigation li > a { text-align: right; }
/* Tiroir mobile : logo à droite (la croix restait par-dessus), icônes de contact à droite */
[dir="rtl"] .mobile-menu .nav-logo { text-align: right; }
[dir="rtl"] .contact-list-one li { padding-left: 0; padding-right: 54px; }
[dir="rtl"] .contact-list-one li .icon { left: auto; right: 0; }
[dir="rtl"] .mobile-menu .navigation li.dropdown .dropdown-btn { right: auto; left: 0; }
[dir="rtl"] .contact-details__info li { text-align: right; }
[dir="rtl"] .footer-style-one .footer-info .info a { direction: rtl; justify-content: flex-start; }
[dir="rtl"] input, [dir="rtl"] textarea { text-align: right; }
[dir="rtl"] input[type="email"], [dir="rtl"] input[type="tel"] { direction: rtl; }

/* ----------------------------------------------- Correctifs après rendu */
.sec-title .sub-title { text-transform: none; }
.contact-section .image-column .contact-info-outer { flex-direction: column; gap: 22px; }
.contact-section .image-column .contact-info { max-width: none; align-items: flex-start; }
.contact-section .image-column .contact-info .info .text a { color: var(--theme-color1); }
.contact-section .image-column .contact-info .info .text + .text { margin-top: 4px; }
.footer-style-one .user-links li a { text-transform: none; }
.mobile-menu .navigation li > a { text-transform: none; }
.about-content2 .sub-title, .page-breadcrumb li, .page-breadcrumb li a { text-transform: none; }
.service-details-help .help-title { font-size: 28px; line-height: 1.3; }
.footer-brand .title { color: #fff; margin-bottom: 10px; letter-spacing: .02em; }
.footer-brand-line { color: var(--theme-color1); font-size: 16px; }
.page-wrapper { overflow-x: clip; }
/* Le contenu suit l'en-tête dans le flux (ScrollSmoother, qui le fixait en haut de l'écran, est désactivé au build) */
#smooth-wrapper { position: relative; }

/* Liste latérale des domaines : l'icône ne doit pas recouvrir le texte */
.sidebar-service-list li a { padding-block: 17px; padding-inline: 24px 80px; font-size: 17px; }
[dir="rtl"] .sidebar-service-list li a i { right: auto; left: 20px; }

/* ----------------------------------------------------- Galerie page avocat */
.gallery-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.gallery-item { display: block; border-radius: 18px; overflow: hidden; }
.gallery-item img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center top; transition: transform .5s ease; }
.gallery-item:hover img { transform: scale(1.05); }
@media (max-width: 991.98px) { .gallery-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 575.98px) { .gallery-grid { grid-template-columns: repeat(2, 1fr); } }
.team-details__top-img img { aspect-ratio: 4 / 5; object-position: center top; }
.lawyer-photo img { object-position: center top; }
.page-title { background-size: cover; background-position: center; }
/* Interligne proportionnel : sur mobile le titre passe à 34 px mais gardait l'interligne du h1 desktop */
.page-title .title { line-height: 1.18; max-width: 980px; margin-inline: auto; }
[dir="rtl"] .page-title .title { line-height: 1.5; }
.page-title:before { background: rgba(10, 22, 40, .78) !important; opacity: 1 !important; }
.contact-section .image-column .image:after { content: ""; position: absolute; inset: 0; background: rgba(10, 22, 40, .74); }
.contact-section .image-column .content-outer { position: relative; z-index: 2; }

/* FAQ (accueil) : sur petit écran, le masque du template réduit la photo à une bande
   recouverte par l'encadré ; on montre la photo entière et l'encadré la chevauche légèrement */
@media (max-width: 767.98px) {
  .faqs-section .images-column .image { -webkit-mask-image: none; mask-image: none; height: auto; border-radius: 24px; overflow: hidden; }
  .faqs-section .images-column .image img { height: auto; aspect-ratio: 4 / 3.6; object-position: center 25%; }
  .faqs-section .images-column .inner-column .shape1 { display: none; }
  .faqs-section .images-column .content-box { position: relative; inset: auto; width: auto; max-width: none; margin: -64px 14px 0; padding: 30px 26px; }
}

/* ------------------------------------------------------------ Page « Le cabinet » */
/* Étiquette au-dessus du titre (le template les plaçait côte à côte, séparés de 147 px) */
.about-section { padding-bottom: 90px; }
.about-section .sec-title { display: block; max-width: 900px; }
.about-section .sec-title .sub-title { max-width: none; width: auto; margin: 0 0 18px; }
/* Carte d'histoire : texte lisible sur le bleu nuit, titre aligné avec son icône */
.about-content2.static { height: 100%; }
.about-content2.static .text-stack p { color: rgba(255, 255, 255, .8); }
.about-content2 .sub-title { align-items: flex-start; justify-content: flex-start; text-align: start; }
.about-content2 .sub-title .icon { flex-shrink: 0; margin-top: 7px; }
/* Compteur : couleurs du cabinet (le template l'affichait en vert) */
.experience-one .count-box, .experience-one .count-title { color: var(--theme-color2); }
/* Transmission : moins de vide entre les sections, texte centré face à l'image, bouton détaché */
.about-section + .text-section { padding-top: 40px; }
.about-section + .text-section .row { align-items: center; }
.text-stack + .btn-style-one { margin-top: 32px; }
.text-section + .why-choose-us-section { padding-top: 20px; }
/* Valeurs : photo moins haute, cadrée sur le visage */
.why-choose-us-section .images-column .image { height: auto; aspect-ratio: 4 / 4.2; max-height: 560px; }
.why-choose-us-section .images-column .image img { object-position: center 20%; }
@media (max-width: 991.98px) {
  .about-section { padding-bottom: 60px; }
  .about-section + .text-section { padding-top: 20px; }
  .text-section + .why-choose-us-section { padding-top: 10px; }
}
@media (max-width: 575.98px) {
  .about-content2 { padding: 28px 24px; }
  .why-choose-us-section .images-column .image { aspect-ratio: 4 / 3.8; }
}

/* ------------------------------------------------- Galerie « Le cabinet en images » */
.office-gallery { padding: 0 0 120px; }
.masonry-gallery { columns: 4 240px; column-gap: 16px; }
.masonry-item { position: relative; display: block; margin-bottom: 16px; border-radius: 18px; overflow: hidden; break-inside: avoid; background: var(--theme-color-lighter); }
.masonry-item img { display: block; width: 100%; height: auto; transition: transform .6s ease; }
.masonry-item:after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(8, 18, 33, .82), rgba(8, 18, 33, 0) 55%); opacity: 0; transition: opacity .35s ease; }
.masonry-caption {
  position: absolute; z-index: 1; inset-inline: 18px; bottom: 16px; color: #fff; font-family: var(--heading-font-family);
  font-size: 16px; line-height: 1.35; opacity: 0; transform: translateY(8px); transition: all .35s ease;
}
.masonry-item:hover img { transform: scale(1.05); }
.masonry-item:hover:after, .masonry-item:focus-visible:after { opacity: 1; }
.masonry-item:hover .masonry-caption, .masonry-item:focus-visible .masonry-caption { opacity: 1; transform: none; }
/* Écrans tactiles : légende toujours visible */
@media (hover: none) {
  .masonry-item:after, .masonry-caption { opacity: 1; transform: none; }
  .masonry-caption { font-size: 14px; inset-inline: 12px; bottom: 10px; }
}
@media (max-width: 767.98px) {
  .office-gallery { padding-bottom: 80px; }
  .masonry-gallery { columns: 2; column-gap: 10px; }
  .masonry-item { margin-bottom: 10px; border-radius: 14px; }
}

/* ==========================================================================
   Mobile : listes de cartes en carrousels horizontaux (défilement par glissement)
   au lieu d'empiler 12 cartes les unes sous les autres. CSS scroll-snap natif,
   points de position ajoutés par custom.js. Tablette et desktop inchangés.
   ========================================================================== */
@media (max-width: 767.98px) {
  .practice-home .row.g-4,
  .practice-list-section .row.g-4,
  .why-choose-us-two .col-xl-8 > .row,
  .steps-section .row,
  .hero-v2 + .feature-section .feature-outer,
  .gallery-grid,
  .masonry-gallery {
    display: flex; flex-wrap: nowrap; gap: 14px; overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x mandatory; scroll-padding-inline: 15px; overscroll-behavior-x: contain;
    margin-inline: -15px; padding: 6px 15px 4px; scrollbar-width: none; -webkit-overflow-scrolling: touch;
    columns: auto; --bs-gutter-x: 0; --bs-gutter-y: 0;
  }
  .practice-home .row.g-4::-webkit-scrollbar,
  .practice-list-section .row.g-4::-webkit-scrollbar,
  .why-choose-us-two .col-xl-8 > .row::-webkit-scrollbar,
  .steps-section .row::-webkit-scrollbar,
  .hero-v2 + .feature-section .feature-outer::-webkit-scrollbar,
  .gallery-grid::-webkit-scrollbar,
  .masonry-gallery::-webkit-scrollbar { display: none; }
  /* chaque carte occupe ~84 % de l'écran : la suivante dépasse et invite à glisser */
  .practice-home .row.g-4 > *,
  .practice-list-section .row.g-4 > *,
  .why-choose-us-two .col-xl-8 > .row > *,
  .steps-section .row > *,
  .hero-v2 + .feature-section .feature-outer > * {
    flex: 0 0 84%; max-width: 84%; width: auto; padding: 0; margin: 0; scroll-snap-align: start;
  }
  .why-choose-us-two .feature-block-two, .why-choose-us-two .feature-block-two .inner-block { height: 100%; }
  /* galeries : vignettes de hauteur égale */
  .gallery-grid > .gallery-item { flex: 0 0 68%; scroll-snap-align: start; }
  .masonry-gallery > .masonry-item { flex: 0 0 78%; height: 300px; margin: 0; scroll-snap-align: start; }
  .masonry-gallery > .masonry-item img { height: 100%; object-fit: cover; }

  /* points de position */
  .m-swipe-dots { display: flex; justify-content: center; gap: 7px; margin-top: 18px; }
  .m-swipe-dots button {
    width: 8px; height: 8px; padding: 0; border: 0; border-radius: 8px; cursor: pointer;
    background: rgba(18, 35, 60, .2); transition: all .3s ease;
  }
  .m-swipe-dots button.active { width: 24px; background: var(--theme-color1); }
  .practice-home .m-swipe-dots button { background: rgba(255, 255, 255, .3); }
  .practice-home .m-swipe-dots button.active { background: var(--theme-color1); }

  /* pages domaines : la liste latérale des 12 domaines devient une rangée de pastilles */
  .sidebar-service-list ul {
    display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none;
    margin-inline: -15px; padding: 2px 15px 6px;
  }
  .sidebar-service-list ul::-webkit-scrollbar { display: none; }
  .sidebar-service-list ul li { flex: 0 0 auto; margin: 0; scroll-snap-align: start; }
  .sidebar-service-list ul li a { white-space: nowrap; padding: 12px 18px; font-size: 15px; border-radius: 30px; }
  .sidebar-service-list ul li a i { display: none; }
}
@media (min-width: 768px) {
  .m-swipe-dots { display: none; }
}

/* Votre height: 100% (colonnes alignées) ne sert que sur desktop : sur mobile les colonnes sont empilées */
@media (max-width: 1199.98px) {
  .about-section-two .about-info-outer { height: auto; }
}
/* Cadre photo vidé (photo de la plaque retirée) : ne pas laisser un bloc blanc */
.experience-two .expe-image:empty { display: none; }

/* En-tête : le menu est aligné à droite dès le départ (comme dans l'en-tête collant) ; en arabe il passe à gauche */
@media (min-width: 1024px) {
  .header-style-one .header-lower .main-box { flex: 1; }
  .header-style-one .header-lower .main-box .nav-outer { margin-inline-start: auto; }
}

/* Accueil, formulaire de contact : centré verticalement dans sa colonne, bouton d'envoi centré */
.contact-section .form-column { display: flex; flex-direction: column; justify-content: center; }
.contact-section .form-outer { width: 100%; max-width: 620px; margin-inline: auto; }
.contact-section .contact-form .form-group:last-child { text-align: center; }