/* ===== SKY EXPERTISE CONSULTING — style global =====
   Palette : bleu nuit #0E1A38 / or #C9A227 / ivoire #F7F5F0
   Modifier les couleurs ici : */
:root{
  --navy:#0E1A38;
  --navy-2:#16244C;
  --gold:#C9A227;
  --gold-2:#D4AF37;
  --ivory:#F7F5F0;
  --text:#232936;
  --muted:#5C6470;
  --white:#FFFFFF;
  --radius:14px;
  --shadow:0 10px 30px rgba(14,26,56,.12);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Source Sans 3','Segoe UI',Arial,sans-serif;color:var(--text);background:var(--ivory);line-height:1.65;font-size:17px}
h1,h2,h3,h4{font-family:'Playfair Display',Georgia,serif;color:var(--navy);line-height:1.25}
img{max-width:100%;display:block}
a{color:var(--gold);text-decoration:none}
.container{max-width:1150px;margin:0 auto;padding:0 22px}

/* ===== En-tête ===== */
header{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(14,26,56,.97);box-shadow:0 2px 14px rgba(0,0,0,.25)}
.nav{display:flex;align-items:center;justify-content:space-between;height:88px;max-width:1250px;margin:0 auto;padding:0 22px}
.brand{display:flex;align-items:center;gap:15px;color:var(--white)}
.brand .logo{width:58px;height:58px;flex:0 0 58px;border:2px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-weight:700;color:var(--gold);font-size:20px;letter-spacing:1px;box-shadow:0 0 0 4px rgba(201,162,39,.13)}
.brand b{font-family:'Playfair Display',serif;font-size:24px;letter-spacing:.5px;line-height:1.15}
.brand small{display:block;color:var(--gold);font-size:12.5px;letter-spacing:1.7px;text-transform:uppercase;margin-top:2px}
nav ul{display:flex;gap:26px;list-style:none;align-items:center}
nav li{display:flex;align-items:center}
nav a{display:inline-flex;align-items:center;color:#E8E6E0;font-size:15.5px;font-weight:600;letter-spacing:.3px;line-height:1.2;padding:6px 2px;border-bottom:2px solid transparent;transition:.25s}
nav a:hover,nav a.actif{color:var(--gold);border-bottom-color:var(--gold)}
.btn-nav{background:var(--gold);color:var(--navy)!important;padding:11px 22px!important;border-radius:30px;border:none!important;font-weight:700;white-space:nowrap;box-shadow:0 4px 12px rgba(201,162,39,.25)}
.btn-nav:hover{background:var(--gold-2);box-shadow:0 6px 16px rgba(201,162,39,.35);transform:translateY(-1px)}
.burger{display:none;background:none;border:none;color:var(--white);font-size:28px;cursor:pointer}

/* ===== Héro ===== */
.hero{background:linear-gradient(140deg,var(--navy) 0%,var(--navy-2) 55%,#1E3061 100%);color:var(--white);padding:186px 0 90px;position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;right:-120px;top:-120px;width:480px;height:480px;border:1px solid rgba(201,162,39,.25);border-radius:50%}
.hero::before{content:"";position:absolute;right:-40px;top:-40px;width:480px;height:480px;border:1px solid rgba(201,162,39,.15);border-radius:50%}
.hero .sur-titre{color:var(--gold);letter-spacing:3px;text-transform:uppercase;font-size:14px;font-weight:700;margin-bottom:18px}
.hero h1{color:var(--white);font-size:46px;max-width:820px;margin-bottom:16px}
.hero h1 em{color:var(--gold-2);font-style:normal}
.hero .slogan{font-size:22px;color:#D9D6CE;max-width:700px;margin-bottom:30px;font-style:italic}
.badges{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:36px}
.badge{border:1px solid rgba(201,162,39,.55);color:#F0E6C8;padding:8px 16px;border-radius:30px;font-size:14px;background:rgba(201,162,39,.08)}
.cta-groupe{display:flex;flex-wrap:wrap;gap:16px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 30px;border-radius:34px;font-weight:700;font-size:16.5px;transition:.25s;border:2px solid transparent}
.btn-or{background:var(--gold);color:var(--navy)}
.btn-or:hover{background:var(--gold-2);transform:translateY(-2px)}
.btn-blanc{border-color:rgba(255,255,255,.7);color:var(--white)}
.btn-blanc:hover{background:rgba(255,255,255,.12)}
.btn-wa{background:#25D366;color:#fff}
.btn-wa:hover{background:#1EBE5A;transform:translateY(-2px)}

/* ===== Barre de confiance ===== */
.confiance{background:var(--navy);border-top:1px solid rgba(201,162,39,.3);padding:26px 0}
.confiance .container{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center}
.confiance .chiffre{font-family:'Playfair Display',serif;font-size:30px;color:var(--gold-2);font-weight:700}
.confiance .libelle{color:#C9CDD6;font-size:14px}

/* ===== Sections ===== */
section{padding:72px 0}
.sur-titre{color:var(--gold);letter-spacing:3px;text-transform:uppercase;font-size:13.5px;font-weight:700;margin-bottom:10px}
h2.titre{font-size:34px;margin-bottom:14px}
.intro{color:var(--muted);max-width:760px;margin-bottom:42px;font-size:18px}
.centre{text-align:center}
.centre .intro{margin-left:auto;margin-right:auto}
.filet{width:70px;height:3px;background:var(--gold);margin:18px 0 26px;border:none}
.centre .filet{margin-left:auto;margin-right:auto}
.fond-blanc{background:var(--white)}
.fond-navy{background:var(--navy);color:#D9D6CE}
.fond-navy h2,.fond-navy h3{color:var(--white)}

/* ===== Cartes services ===== */
.grille{display:grid;gap:26px}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.carte{background:var(--white);border-radius:var(--radius);padding:34px 28px;box-shadow:var(--shadow);border-top:4px solid var(--gold);transition:.3s}
.carte:hover{transform:translateY(-6px)}
.carte .icone{font-size:34px;margin-bottom:16px}
.carte h3{font-size:20.5px;margin-bottom:10px}
.carte p{color:var(--muted);font-size:15.5px}
.carte .lien{display:inline-block;margin-top:14px;font-weight:700;font-size:15px}

/* ===== Galerie ===== */
.galerie{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.galerie figure{position:relative;border-radius:var(--radius);overflow:hidden;cursor:pointer;box-shadow:var(--shadow);background:var(--white)}
.galerie img{width:100%;height:250px;object-fit:cover;transition:.4s}
.galerie figure:hover img{transform:scale(1.06)}
.galerie figcaption{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(transparent,rgba(14,26,56,.92));color:#fff;padding:34px 16px 12px;font-size:14.5px}
.galerie figcaption b{color:var(--gold-2)}
.etiquette{position:absolute;top:12px;left:12px;background:var(--gold);color:var(--navy);font-size:12px;font-weight:700;padding:4px 12px;border-radius:20px;letter-spacing:.5px}
.etiquette.jud{background:var(--navy);color:var(--gold-2);border:1px solid var(--gold)}

/* Documents (pages de garde) */
.galerie.docs img{object-fit:contain;background:#EDEBE4;height:330px}

/* ===== Lightbox ===== */
.lightbox{display:none;position:fixed;inset:0;background:rgba(10,15,30,.94);z-index:200;align-items:center;justify-content:center;flex-direction:column;padding:30px}
.lightbox.ouverte{display:flex}
.lightbox img{max-width:92vw;max-height:82vh;border-radius:8px;object-fit:contain}
.lightbox .legende{color:#E8E6E0;margin-top:14px;font-size:15.5px;text-align:center}
.lightbox .fermer{position:absolute;top:18px;right:26px;background:none;border:none;color:#fff;font-size:40px;cursor:pointer}
.lightbox .fleche{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.12);border:none;color:#fff;font-size:34px;width:54px;height:54px;border-radius:50%;cursor:pointer}
.lightbox .prec{left:18px}.lightbox .suiv{right:18px}

/* ===== Provinces / périple ===== */
.provinces{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;counter-reset:prov}
.province{background:var(--white);border-left:4px solid var(--gold);border-radius:10px;padding:16px 18px;box-shadow:var(--shadow);display:flex;align-items:center;gap:14px}
.province::before{counter-increment:prov;content:counter(prov,decimal-leading-zero);font-family:'Playfair Display',serif;color:var(--gold);font-size:22px;font-weight:700}
.province b{display:block;color:var(--navy)}
.province small{color:var(--muted)}

/* ===== Témoignage ===== */
.temoignage{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);padding:44px;max-width:820px;margin:0 auto;position:relative}
.temoignage::before{content:"\201C";position:absolute;top:-28px;left:30px;font-family:Georgia,serif;font-size:110px;color:var(--gold)}
.temoignage blockquote{font-size:19px;font-style:italic;color:#3A4150;margin-bottom:22px}
.temoignage .auteur{display:flex;align-items:center;gap:14px}
.temoignage .avatar{width:52px;height:52px;border-radius:50%;background:var(--navy);color:var(--gold-2);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:19px}
.temoignage .auteur b{color:var(--navy)}
.temoignage .auteur small{display:block;color:var(--muted)}

/* ===== Étapes ===== */
.etapes{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.etape{text-align:center;padding:0 8px}
.etape .num{width:58px;height:58px;margin:0 auto 14px;border-radius:50%;background:var(--navy);color:var(--gold-2);display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-size:24px;font-weight:700;border:2px solid var(--gold)}
.etape h3{font-size:18px;margin-bottom:8px}
.etape p{font-size:14.5px;color:var(--muted)}

/* ===== FAQ ===== */
.faq{max-width:820px;margin:0 auto}
.faq details{background:var(--white);border-radius:10px;margin-bottom:12px;box-shadow:var(--shadow);overflow:hidden}
.faq summary{cursor:pointer;padding:19px 24px;font-weight:700;color:var(--navy);font-size:16.5px;list-style:none;display:flex;justify-content:space-between;align-items:center}
.faq summary::after{content:"+";color:var(--gold);font-size:24px;font-weight:400}
.faq details[open] summary::after{content:"–"}
.faq .reponse{padding:0 24px 20px;color:var(--muted);font-size:15.5px}

/* ===== Tableaux ===== */
table{width:100%;border-collapse:collapse;background:var(--white);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
th{background:var(--navy);color:var(--gold-2);padding:14px 18px;text-align:left;font-size:15px;letter-spacing:.5px}
td{padding:13px 18px;border-bottom:1px solid #ECEAE3;font-size:15.5px}
tr:last-child td{border-bottom:none}

/* ===== Formulaire ===== */
form{display:grid;gap:16px}
label{font-weight:700;color:var(--navy);font-size:15px}
input,select,textarea{width:100%;padding:13px 15px;border:1.5px solid #D8D4C9;border-radius:9px;font-family:inherit;font-size:15.5px;background:var(--white)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold)}

/* ===== Contact ===== */
.coordonnees{display:grid;gap:14px}
.coordonnee{display:flex;gap:14px;align-items:flex-start;background:var(--white);padding:18px 20px;border-radius:10px;box-shadow:var(--shadow)}
.coordonnee .ic{font-size:22px}
.coordonnee b{color:var(--navy);display:block}
.coordonnee a{font-weight:600}

/* ===== Pied de page ===== */
footer{background:#0A1329;color:#B9BEC9;padding:56px 0 24px;font-size:15px}
footer h4{color:var(--gold-2);font-size:17px;margin-bottom:14px}
footer .grille{margin-bottom:34px}
footer a{color:#D5D9E2}
footer a:hover{color:var(--gold-2)}
footer ul{list-style:none}
footer li{margin-bottom:8px}
.copyright{border-top:1px solid rgba(255,255,255,.12);padding-top:20px;text-align:center;font-size:13.5px;color:#7C8494}

/* ===== WhatsApp flottant ===== */
.wa-flottant{position:fixed;bottom:24px;right:24px;z-index:150;width:60px;height:60px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 22px rgba(0,0,0,.35);transition:.3s}
.wa-flottant:hover{transform:scale(1.1)}
.wa-flottant svg{width:32px;height:32px;fill:#fff}

/* ===== Bandeau interne (pages) ===== */
.bandeau{background:linear-gradient(140deg,var(--navy),#1E3061);color:var(--white);padding:166px 0 60px}
.bandeau h1{color:var(--white);font-size:38px}
.bandeau p{color:#CBD0DB;max-width:720px;margin-top:10px;font-size:18px}
.fil{color:var(--gold-2);font-size:14px;margin-bottom:14px;letter-spacing:.5px}
.fil a{color:#C9CDD6}

/* ===== Galerie compacte à filtres (page Réalisations) ===== */
.barre-filtres{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 10px}
.filtre{background:var(--white);border:1.5px solid #DCD8CC;color:var(--navy);border-radius:30px;padding:9px 20px;font:600 15px/1 'Source Sans 3',Arial,sans-serif;cursor:pointer;transition:.22s}
.filtre:hover{border-color:var(--gold)}
.filtre[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:var(--gold-2)}
.filtre:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.compteur-ref{color:var(--muted);font-size:15px;margin:0 0 26px}
.compteur-ref b{color:var(--navy)}

.mosaique{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.mosaique figure{position:relative;margin:0;border-radius:12px;overflow:hidden;background:var(--white);box-shadow:0 6px 18px rgba(14,26,56,.10);cursor:pointer;transition:.28s;border:1px solid #E7E3D9}
.mosaique figure:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(14,26,56,.18)}
.mosaique figure:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.mosaique img{width:100%;height:228px;object-fit:cover;object-position:top center;background:#EDEBE4;transition:.4s}
.mosaique .doc img{object-fit:contain;object-position:top center;padding:4px}
.mosaique figcaption{padding:12px 14px 14px;font-size:13.8px;color:var(--muted);line-height:1.45;border-top:1px solid #F0EDE5}
.mosaique figcaption b{display:block;color:var(--navy);font-size:14.6px;font-family:'Playfair Display',serif;margin-bottom:2px}
.mosaique figure[hidden]{display:none}
.puce{position:absolute;top:10px;left:10px;background:var(--gold);color:var(--navy);font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px;letter-spacing:.4px;z-index:2}
.puce.jud{background:var(--navy);color:var(--gold-2);border:1px solid var(--gold)}
.puce.pub{background:#1E5B4F;color:#EAF6F1}
.vide-filtre{color:var(--muted);padding:26px 0;font-style:italic}

/* ===== Bandeau de preuve chiffrée ===== */
.preuves{background:var(--white);border-top:1px solid #EBE7DC;border-bottom:1px solid #EBE7DC;padding:34px 0}
.preuves .container{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;text-align:center}
.preuves .n{font-family:'Playfair Display',serif;font-size:38px;color:var(--navy);font-weight:700;line-height:1}
.preuves .n span{color:var(--gold)}
.preuves .l{color:var(--muted);font-size:14.5px;margin-top:6px;letter-spacing:.3px}

/* ===== Accessibilité ===== */
.saut-contenu{position:absolute;left:-9999px;top:0;background:var(--gold);color:var(--navy);padding:12px 22px;font-weight:700;border-radius:0 0 10px 0;z-index:300}
.saut-contenu:focus{left:0}
a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
header a:focus-visible,header button:focus-visible{outline-color:var(--gold-2)}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* ===== Note confidentialité ===== */
.note-confid{background:#FBF7EA;border:1px solid var(--gold);border-radius:10px;padding:16px 20px;font-size:14.5px;color:#6B5D20;margin:26px 0}

/* ===== Responsive ===== */
/* Navigation : compactée puis basculée en menu burger avant tout chevauchement */
@media(max-width:1120px){
  nav ul{gap:15px}
  nav a{font-size:14.6px}
  .btn-nav{padding:10px 17px!important}
}
@media(max-width:900px){
  nav ul{position:absolute;top:100%;left:0;right:0;background:var(--navy);flex-direction:column;align-items:stretch;padding:18px 22px 24px;gap:4px;display:none;box-shadow:0 12px 20px rgba(0,0,0,.3)}
  nav ul.ouvert{display:flex}
  nav li{width:100%}
  nav a{width:100%;justify-content:center;font-size:16px;padding:12px 2px}
  .btn-nav{margin-top:10px;padding:13px 22px!important}
  .burger{display:block}
}
@media(max-width:960px){
  .g3,.g4,.galerie,.provinces{grid-template-columns:repeat(2,1fr)}
  .preuves .container{grid-template-columns:repeat(2,1fr);gap:26px}
  .preuves .n{font-size:32px}
  .etapes{grid-template-columns:repeat(2,1fr)}
  .confiance .container{grid-template-columns:repeat(2,1fr);gap:18px}
  .hero h1{font-size:36px}
}
@media(max-width:680px){
  .nav{height:82px}
  .brand .logo{width:48px;height:48px;flex:0 0 48px;font-size:17px}
  .brand b{font-size:19px}
  .brand small{font-size:10.5px;letter-spacing:1.2px}
  .g2,.g3,.g4,.galerie,.provinces,.etapes{grid-template-columns:1fr}
  .mosaique{grid-template-columns:repeat(2,1fr);gap:12px}
  .mosaique img{height:170px}
  .mosaique figcaption{font-size:12.6px;padding:10px 11px 12px}
  .mosaique figcaption b{font-size:13.4px}
  .filtre{padding:8px 15px;font-size:14px}
  .hero{padding:140px 0 60px}
  .hero h1{font-size:29px}
  .hero .slogan{font-size:18px}
  h2.titre{font-size:27px}
  .temoignage{padding:30px 22px}
  .bandeau h1{font-size:29px}
  .confiance .container{grid-template-columns:repeat(2,1fr)}
}