/*
Theme Name: Cabinet Khedhir
Theme URI: https://example.com/cabinet-khedhir
Author: rim megdiche
Description: Thème WordPress du Cabinet Khedhir — identité visuelle premium, bilingue FR/AR.
Version: 3.1.0
Text Domain: cabinet-khedhir
*/

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&display=swap');

:root{
  --ink:#171717;
  --ink-soft:#2a2a2a;
  --gold:#aa8650;
  --gold-dark:#8f6c3a;
  --cream:#f6f3ee;
  --paper:#ffffff;
  --sand:#ded8cf;
  --line:#e8e2d9;
  --muted:#66615b;
  --success:#eef8f1;
  --success-line:#b8dfc1;
  --error:#fff0f0;
  --error-line:#e4b9b9;
  --shadow:0 18px 45px rgba(23,23,23,.08);
  --shadow-strong:0 24px 55px rgba(23,23,23,.16);
}

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  font-family:Inter,Arial,sans-serif;
  background:var(--cream);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,h4,h5,.serif{
  font-family:'Cormorant Garamond',serif;
  letter-spacing:-.01em;
}

a{
  color:inherit;
  text-decoration:none;
}

img{
  display:block;
  max-width:100%;
  height:auto;
}

.container{
  width:100%;
  max-width:1120px;
  margin:0 auto;
  padding:0 24px;
}

.wide{
  max-width:1280px;
}

.section{
  padding:96px 0;
}

.bg-white{
  background:var(--paper);
}

.bg-ink{
  background:var(--ink);
  color:#fff;
}

.center{
  text-align:center;
}

.eyebrow{
  margin:0 0 12px;
  color:var(--gold);
  font-size:14px;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
}

.heading{
  margin:0 0 20px;
  font-size:clamp(38px,5vw,60px);
  line-height:1.06;
}

.lead{
  color:var(--muted);
  font-size:17px;
  line-height:1.8;
}

.light{
  color:rgba(255,255,255,.74);
}

/* Boutons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:14px 26px;
  border:1px solid transparent;
  border-radius:0;
  font-weight:600;
  letter-spacing:.02em;
  cursor:pointer;
  transition:background-color .25s,border-color .25s,color .25s,transform .25s;
}

.btn-gold{
  background:var(--ink);
  border-color:var(--ink);
  color:#fff;
}

.btn-gold:hover{
  background:var(--gold);
  border-color:var(--gold);
  color:#fff;
  transform:translateY(-1px);
}

.btn-outline{
  background:transparent;
  border-color:var(--ink);
  color:var(--ink);
}

.btn-outline:hover{
  background:var(--ink);
  color:#fff;
}

.button-row{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}

/* Header */
.site-header{
  position:fixed;
  inset:0 0 auto;
  z-index:1000;
  padding:16px 0;
  background:rgba(246,243,238,.94);
  border-bottom:1px solid rgba(23,23,23,.06);
  backdrop-filter:blur(14px);
  transition:padding .3s,background-color .3s,box-shadow .3s;
}

.site-header.scrolled,
.site-header.inner{
  padding:10px 0;
  background:rgba(246,243,238,.98);
  box-shadow:0 10px 30px rgba(23,23,23,.08);
}

body.admin-bar .site-header{
  top:32px;
}

.nav-wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.header-brand{
  display:flex;
  align-items:center;
  flex:0 0 auto;
  min-width:0;
}

.header-brand .brand{
  display:inline-flex;
  align-items:center;
  gap:14px;
  width:auto;
  color:var(--ink);
  white-space:nowrap;
}

.header-custom-logo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 72px;
  width:72px;
  height:72px;
  overflow:hidden;
  padding:4px;
  background:#fff;
  border:1px solid var(--line);
}

.header-custom-logo img,
.header-custom-logo img.custom-logo,
.header-brand img.custom-logo{
  display:block!important;
  width:64px!important;
  height:64px!important;
  min-width:64px!important;
  min-height:64px!important;
  max-width:64px!important;
  max-height:64px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  object-fit:contain!important;
  object-position:center!important;
}

.brand-mark{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border:1px solid var(--gold);
  border-radius:50%;
  color:var(--gold);
  font-family:serif;
  font-size:24px;
}

.brand-text{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  line-height:1.08;
}

.brand-text strong,
.brand strong{
  display:block;
  color:var(--ink);
  font-family:'Cormorant Garamond',serif;
  font-size:23px;
  white-space:nowrap;
}

.brand-text small,
.brand small{
  display:block;
  margin-top:5px;
  color:var(--gold);
  font-size:9px;
  letter-spacing:.22em;
  text-transform:uppercase;
  white-space:nowrap;
}

.menu{
  display:flex;
  flex:1;
  align-items:center;
  justify-content:center;
  gap:22px;
  margin:0;
  padding:0;
  list-style:none;
}

.menu li{
  white-space:nowrap;
}

.menu a{
  color:rgba(23,23,23,.82);
  font-size:14px;
  transition:color .2s;
}

.menu a:hover,
.current-menu-item>a{
  color:var(--gold);
}

.menu-toggle{
  display:none;
  margin-left:auto;
  padding:0;
  border:0;
  background:none;
  color:var(--ink);
  font-size:27px;
  cursor:pointer;
}

.header-cta{
  flex:0 0 auto;
  white-space:nowrap;
}

/* Langues */
.language-switcher ul,
.language-switcher li{
  margin:0;
  padding:0;
  list-style:none;
}

.language-switcher ul{
  display:flex;
  gap:10px;
}

.language-switcher a{
  color:var(--ink)!important;
  font-weight:600;
  transition:color .2s;
}

.language-switcher a:hover,
.language-switcher .current-lang a,
.language-switcher .pll-current-language a{
  color:var(--gold)!important;
}

/* Hero avec photo */
.hero{
    position:relative;
    display:flex;
    align-items:center;
    min-height:100vh;
    overflow:hidden;
    background:#171717;
    color:#fff;
}

.hero::before{
    content:'';
    position:absolute;
    inset:0;
    z-index:0;
    background:
        linear-gradient(
            90deg,
            rgba(17,17,17,.95) 0%,
            rgba(17,17,17,.80) 35%,
            rgba(17,17,17,.45) 65%,
            rgba(17,17,17,.15) 100%
        ),
        url("http://youssrakhedhiravocat.com/wp-content/uploads/2026/08/5e8969c6-b731-47f9-a2c7-d01a3e6393eb.jpg")
                   center / cover no-repeat;

}

.hero-content{
  position:relative;
  z-index:2;
  max-width:760px;
  padding-top:120px;
  padding-bottom:130px;
}

.hero h1{
  margin:0 0 26px;
  color:#fff;
  font-size:clamp(52px,7vw,82px);
  line-height:1.01;
}

.hero p{
  color:rgba(255,255,255,.76);
  font-size:18px;
  line-height:1.75;
}

.hero .btn-outline{
  border-color:rgba(255,255,255,.8);
  color:#fff;
}

.hero .btn-outline:hover{
  background:#fff;
  color:var(--ink);
}

.hero-strip{
  position:absolute;
  right:0;
  bottom:0;
  left:0;
  z-index:3;
  background:rgba(17,17,17,.88);
  border-top:1px solid rgba(255,255,255,.12);
}

.strip-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
}

.strip-item{
  padding:22px 16px;
  border-inline-end:1px solid rgba(255,255,255,.1);
  color:rgba(255,255,255,.82);
  font-size:13px;
}

.strip-item b{
  margin-inline-end:8px;
  color:var(--gold);
}

/* Bannières pages internes */
.page-hero{
  position:relative;
  overflow:hidden;
  padding:150px 0 72px;
  background:var(--ink);
  color:#fff;
}

.page-hero.image::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(23,23,23,.76),rgba(23,23,23,.90)),
    var(--bg) center/cover;
  opacity:.95;
}

.page-hero .container{
  position:relative;
}

.page-hero h1{
  margin:0;
  font-size:clamp(48px,6vw,68px);
}

/* Grilles */
.grid-2{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
  gap:80px;
  align-items:start;
}

.grid-3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}

.grid-4{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}

/* Cartes */
.card{
  padding:30px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:0;
  box-shadow:none;
  transition:border-color .3s,box-shadow .3s,transform .3s;
}

.card:hover{
  border-color:var(--gold);
  box-shadow:var(--shadow);
  transform:translateY(-4px);
}

.card h3{
  margin:15px 0 8px;
  font-size:25px;
}

.icon,
.contact-icon{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border-radius:50%;
  background:#f0ece5;
  color:var(--gold);
  font-size:23px;
}


/* Listes */
.checklist{
  margin:0;
  padding:0;
  list-style:none;
}

.checklist li{
  position:relative;
  margin:14px 0;
  padding-inline-start:20px;
}

.checklist li::before{
  content:'';
  position:absolute;
  top:9px;
  inset-inline-start:0;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--gold);
}

/* Médiation */
.quote-section{
  position:relative;
  background:
    linear-gradient(rgba(23,23,23,.90),rgba(23,23,23,.90)),
    url('http://youssrakhedhiravocat.com/wp-content/uploads/2026/08/136718e0-ce30-457d-8f7e-a89c58bd9511.jpg') center/cover;
  color:#fff;
}

.facts{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
}

.fact{
  padding-inline-start:16px;
  border-inline-start:1px solid var(--gold);
}

.fact p{
  margin:3px 0;
  color:rgba(255,255,255,.62);
  font-size:14px;
}

/* Formulaires */
.form-box{
  padding:36px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
}

.field{
  margin-bottom:20px;
}

.field label{
  display:block;
  margin-bottom:8px;
  font-size:14px;
  font-weight:600;
}

.field input,
.field select,
.field textarea{
  width:100%;
  padding:13px 14px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--ink);
  font:inherit;
}

.field input:focus,
.field select:focus,
.field textarea:focus{
  outline:none;
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(170,134,80,.10);
}

.mode-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}

.mode-option input{
  display:none;
}

.mode-option span{
  display:block;
  height:100%;
  padding:22px;
  background:#fff;
  border:1px solid var(--line);
  cursor:pointer;
}

.mode-option input:checked+span{
  background:rgba(170,134,80,.08);
  border-color:var(--gold);
  box-shadow:0 5px 14px rgba(23,23,23,.08);
}

.step-title{
  margin:0 0 20px;
  font-family:'Cormorant Garamond',serif;
  font-size:27px;
}

.step-num{
  display:inline-grid;
  place-items:center;
  width:32px;
  height:32px;
  margin-inline-end:10px;
  border-radius:50%;
  background:var(--ink);
  color:#fff;
  font-family:Inter,sans-serif;
  font-size:14px;
}

.slots{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}

.slot input{
  display:none;
}

.slot span{
  display:block;
  padding:10px;
  border:1px solid var(--line);
  text-align:center;
  cursor:pointer;
}

.slot input:checked+span{
  background:var(--ink);
  border-color:var(--ink);
  color:#fff;
}

.notice{
  margin:18px 0;
  padding:16px;
  background:#f1ede6;
  border-inline-start:4px solid var(--gold);
}

.success{
  margin-bottom:24px;
  padding:22px;
  background:var(--success);
  border:1px solid var(--success-line);
}

.error{
  margin-bottom:20px;
  padding:14px;
  background:var(--error);
  border:1px solid var(--error-line);
}

/* Contact */
.contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:50px;
}

.contact-item{
  display:flex;
  gap:14px;
  margin:22px 0;
}

.contact-icon{
  flex:0 0 44px;
  width:44px;
  height:44px;
}

.map{
  width:100%;
  height:260px;
  border:0;
}

/* Pages légales */
.legal-copy{
  max-width:780px;
  margin:auto;
}

.legal-copy h2{
  margin-top:36px;
  font-size:28px;
}

.wp-content p{
  line-height:1.8;
}

/* Footer */
.site-footer{
  padding:72px 0 24px;
  background:#111;
  color:rgba(255,255,255,.68);
}

.footer-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1.2fr 1fr;
  gap:40px;
}

.site-footer .brand{
  color:#fff;
}

.site-footer .brand strong{
  color:#fff;
}

.site-footer h3,
.site-footer h4{
  margin:0 0 20px;
  color:#fff;
  font-size:20px;
}

.site-footer ul{
  margin:0;
  padding:0;
  list-style:none;
}

.site-footer li{
  margin:10px 0;
}

.site-footer a{
  transition:color .2s;
}

.site-footer a:hover{
  color:var(--gold);
}

.site-footer .footer-logo,
.site-footer .custom-logo-link,
.site-footer .footer-brand-logo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto!important;
  height:auto!important;
  max-width:110px;
  overflow:hidden;
}

.site-footer .footer-logo img,
.site-footer .custom-logo-link img,
.site-footer img.custom-logo{
  display:block!important;
  width:96px!important;
  height:96px!important;
  min-width:96px!important;
  min-height:96px!important;
  max-width:96px!important;
  max-height:96px!important;
  margin:0!important;
  padding:0!important;
  object-fit:contain!important;
  object-position:center!important;
}

.footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-top:50px;
  padding-top:24px;
  border-top:1px solid rgba(255,255,255,.1);
  font-size:12px;
}

/* RTL */
html[dir="rtl"] body{
  direction:rtl;
}

html[dir="rtl"] .nav-wrap,
html[dir="rtl"] .header-brand .brand,
html[dir="rtl"] .contact-item{
  direction:rtl;
}

html[dir="rtl"] .field input[dir="ltr"],
html[dir="rtl"] .field code,
html[dir="rtl"] a[href^="tel:"],
html[dir="rtl"] a[href^="mailto:"]{
  direction:ltr;
  text-align:left;
}

/* Responsive */
@media(max-width:1180px){
  .menu{
    gap:14px;
  }

  .menu a{
    font-size:13px;
  }

  .header-cta{
    padding:12px 18px;
    font-size:13px;
  }

  .brand-text strong,
  .brand strong{
    font-size:20px;
  }
}

@media(max-width:980px){
  .menu{
    display:none;
    position:absolute;
    top:82px;
    left:24px;
    right:24px;
    flex-direction:column;
    align-items:flex-start;
    padding:22px;
    background:var(--cream);
    border:1px solid var(--line);
    box-shadow:var(--shadow);
  }

  .menu.open{
    display:flex;
  }

  .menu a{
    color:var(--ink)!important;
  }

  .menu-toggle{
    display:block;
  }

  .header-cta{
    display:none;
  }

  .grid-2,
  .contact-grid{
    grid-template-columns:1fr;
  }



  .grid-3{
    grid-template-columns:repeat(2,1fr);
  }

  .grid-4,
  .strip-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .footer-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .mode-grid{
    grid-template-columns:1fr;
  }

  .hero{
    padding-top:90px;
  }

  .hero-strip{
    position:relative;
    margin-top:55px;
  }

  .section{
    padding:72px 0;
  }
}

@media(max-width:782px){
  body.admin-bar .site-header{
    top:46px;
  }
}

@media(max-width:768px){
  .header-brand .brand{
    gap:10px;
  }

  .header-custom-logo{
    flex-basis:58px;
    width:58px;
    height:58px;
    padding:3px;
  }

  .header-custom-logo img,
  .header-custom-logo img.custom-logo,
  .header-brand img.custom-logo{
    width:52px!important;
    height:52px!important;
    min-width:52px!important;
    min-height:52px!important;
    max-width:52px!important;
    max-height:52px!important;
  }

  .brand-text strong,
  .brand strong{
    font-size:18px;
  }

  .brand-text small,
  .brand small{
    font-size:8px;
    letter-spacing:.16em;
  }

  .site-footer .footer-logo img,
  .site-footer .custom-logo-link img,
  .site-footer img.custom-logo{
    width:82px!important;
    height:82px!important;
    min-width:82px!important;
    min-height:82px!important;
    max-width:82px!important;
    max-height:82px!important;
  }
}

@media(max-width:600px){
  body.admin-bar .site-header{
    top:0;
  }

  .site-header{
    position:sticky;
  }
}

@media(max-width:560px){
  .container{
    padding:0 18px;
  }

  .grid-3,
  .grid-4,
  .footer-grid,
  .facts{
    grid-template-columns:1fr;
  }

  .slots{
    grid-template-columns:repeat(3,1fr);
  }

  .section{
    padding:58px 0;
  }

  .hero{
    min-height:auto;
  }

  .hero-content{
    padding-top:110px;
    padding-bottom:70px;
  }

  .hero h1{
    font-size:48px;
  }

  .button-row .btn{
    width:100%;
  }

  .page-hero{
    padding-top:125px;
  }

  .footer-bottom{
    display:block;
  }

  .footer-bottom span{
    display:block;
    margin-top:8px;
  }


}

/* ==========================================
   PHOTO PRINCIPALE — SECTIONS EN DEUX COLONNES
========================================== */

.portrait{
  display:block;
  width:100%;
  max-width:none;
  height:760px;
  object-fit:cover;
  object-position:center top;
  margin:0;
  border-radius:10px;
  box-shadow:0 25px 60px rgba(0,0,0,.15);
  transition:transform .35s ease, box-shadow .35s ease;
}

.portrait:hover{
  transform:translateY(-4px);
  box-shadow:0 34px 72px rgba(0,0,0,.20);
}

/* Sous-titre À propos de la page d’accueil uniquement */
.home-lawyer-heading .lead{
  font-weight:700;
  color:#171717;
}

/* Sécurité anti-déformation du logo */
.custom-logo{
  object-fit:contain!important;
  object-position:center!important;
}

/* ===========================
   TABLETTE
=========================== */

@media(max-width:980px){
  .grid-2,
  .contact-grid{
    grid-template-columns:1fr;
  }

  .portrait{
    width:100%;
    max-width:650px;
    height:650px;
    margin:0 auto 40px;
    object-fit:cover;
    object-position:center top;
  }
}

/* ===========================
   MOBILE
=========================== */

@media(max-width:560px){
  .portrait{
    width:100%;
    max-width:none;
    height:500px;
    margin:0 auto 30px;
    object-fit:cover;
    object-position:center top;
  }
}