/* ================================================================
   UMECI — FEUILLE DE STYLE COMMUNE
   Modifiez ce fichier pour changer le design de TOUT le site.
================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  --bleu:        #1B3A6B;
  --bleu-clair:  #020810;
  --or:          #C8A84B;
  --or-clair:    #E8C96A;
  --blanc:       #FFFFFF;
  --creme:       #F8F7F4;
  --gris-clair:  #F0EEE9;
  --gris:        #6B6B6B;
  --anthracite:  #2D2D2D;
  --font-titre:  'Playfair Display', Georgia, serif;
  --font-corps:  'Inter', system-ui, sans-serif;
  --radius:      8px;
  --ombre:       0 4px 24px rgba(27,58,107,0.10);
  --ombre-forte: 0 8px 40px rgba(27,58,107,0.18);
  --max-w:       1200px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--font-corps); color: var(--anthracite); background: var(--blanc); line-height: 1.7; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }

/* ── TOPBAR ─────────────────────────────────────────────────── */
.topbar { background: var(--bleu); color: rgba(255,255,255,.85); font-size:.78rem; padding:6px 0; }
.topbar-inner { max-width:var(--max-w); margin:0 auto; padding:0 24px; display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; }
.topbar a { color:var(--or-clair); }
.topbar a:hover { text-decoration:underline; }
.topbar-social { display:flex; gap:12px; }
.topbar-social a { display:flex; align-items:center; gap:4px; color:rgba(255,255,255,.75); font-size:.78rem; transition:color .2s; }
.topbar-social a:hover { color:var(--or-clair); }

/* ── NAVIGATION ─────────────────────────────────────────────── */
header { position:sticky; top:0; z-index:100; background:var(--blanc); box-shadow:0 2px 16px rgba(0,0,0,.08); }
nav { max-width:var(--max-w); margin:0 auto; padding:0 24px; display:flex; align-items:center; gap:24px; height:72px; }
.logo-wrap { display:flex; align-items:center; gap:12px; flex-shrink:0; }
.logo-icon { width:52px; height:52px; background:var(--bleu); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--or); font-family:var(--font-titre); font-size:1rem; font-weight:700; line-height:1.1; text-align:center; }
.logo-text { line-height:1.2; }
.logo-text strong { display:block; font-family:var(--font-titre); font-size:1.05rem; color:var(--bleu); font-weight:700; }
.logo-text span { font-size:.7rem; color:var(--gris); letter-spacing:.04em; text-transform:uppercase; }
.nav-links { display:flex; align-items:center; gap:2px; margin-left:auto; }
.nav-links > li { position:relative; }
.nav-links > li > a { display:block; padding:8px 13px; font-size:.83rem; font-weight:500; color:var(--anthracite); border-radius:var(--radius); transition:background .2s,color .2s; white-space:nowrap; }
.nav-links > li > a:hover, .nav-links > li > a.active { background:var(--creme); color:var(--bleu); }
.dropdown > a::after { content:' ▾'; font-size:.65rem; }
.dropdown-menu { display:none; position:absolute; top:100%; left:0; background:var(--blanc); border:1px solid #e8e4dc; border-radius:var(--radius); box-shadow:var(--ombre-forte); min-width:230px; padding:8px 0; z-index:200; }
.dropdown:hover .dropdown-menu { display:block; }
.dropdown-menu li a { display:block; padding:9px 20px; font-size:.83rem; color:var(--anthracite); transition:background .15s,color .15s; }
.dropdown-menu li a:hover { background:var(--creme); color:var(--bleu); }
.btn-nav { margin-left:8px; background:var(--or) !important; color:var(--bleu) !important; font-weight:600 !important; border-radius:var(--radius) !important; padding:9px 18px !important; }
.btn-nav:hover { background:var(--or-clair) !important; }
.nav-toggle { display:none; flex-direction:column; gap:5px; cursor:pointer; margin-left:auto; padding:4px; background:none; border:none; }
.nav-toggle span { width:24px; height:2px; background:var(--bleu); border-radius:2px; transition:all .3s; }

/* ── HERO PAGE INTÉRIEURE ────────────────────────────────────── */
.page-hero { background:linear-gradient(135deg,var(--bleu) 0%,#0D2248 100%); color:var(--blanc); padding:60px 24px; position:relative; overflow:hidden; }
.page-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(circle at 70% 50%,rgba(200,168,75,.12) 0%,transparent 60%); }
.page-hero-inner { max-width:var(--max-w); margin:0 auto; position:relative; }
.breadcrumb { font-size:.78rem; color:rgba(255,255,255,.55); margin-bottom:12px; }
.breadcrumb a { color:var(--or-clair); }
.breadcrumb span::before { content:' / '; }
.page-hero h1 { font-family:var(--font-titre); font-size:clamp(1.8rem,3.5vw,2.8rem); font-weight:700; margin-bottom:12px; line-height:1.2; }
.page-hero p { color:rgba(255,255,255,.75); font-size:1.05rem; max-width:600px; }

/* ── LAYOUT COMMUN ───────────────────────────────────────────── */
.page-body { max-width:var(--max-w); margin:0 auto; padding:60px 24px; }
.page-body-two { display:grid; grid-template-columns:1fr 280px; gap:40px; max-width:var(--max-w); margin:0 auto; padding:60px 24px; align-items:start; }
.sidebar { display:flex; flex-direction:column; gap:20px; }
.sidebar-card { background:var(--creme); border-radius:12px; padding:24px; border:1px solid #e8e4dc; }
.sidebar-card h4 { font-family:var(--font-titre); font-size:1rem; color:var(--bleu); margin-bottom:14px; padding-bottom:10px; border-bottom:2px solid var(--or); }
.sidebar-links { display:flex; flex-direction:column; gap:6px; }
.sidebar-links a { font-size:.85rem; color:var(--anthracite); padding:7px 12px; border-radius:6px; transition:background .15s,color .15s; display:flex; align-items:center; gap:8px; }
.sidebar-links a:hover, .sidebar-links a.active { background:var(--bleu); color:var(--blanc); }
.sidebar-cta { background:var(--bleu); color:var(--blanc); border-radius:12px; padding:24px; text-align:center; }
.sidebar-cta h4 { font-family:var(--font-titre); color:var(--or-clair); margin-bottom:10px; }
.sidebar-cta p { font-size:.83rem; color:rgba(255,255,255,.7); margin-bottom:16px; }

/* ── SECTION LABEL / TITRE ───────────────────────────────────── */
section { padding:80px 24px; }
.section-inner { max-width:var(--max-w); margin:0 auto; }
.section-label { font-size:.72rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--or); margin-bottom:10px; }
.section-title { font-family:var(--font-titre); font-size:clamp(1.6rem,3vw,2.4rem); font-weight:700; color:var(--bleu); margin-bottom:16px; line-height:1.25; }
.section-sub { font-size:1rem; color:var(--gris); max-width:580px; margin-bottom:48px; }

/* ── CONTENU TEXTE ───────────────────────────────────────────── */
.prose h2 { font-family:var(--font-titre); font-size:1.5rem; color:var(--bleu); margin:32px 0 14px; }
.prose h3 { font-family:var(--font-titre); font-size:1.15rem; color:var(--bleu); margin:24px 0 10px; }
.prose p { color:var(--gris); margin-bottom:16px; line-height:1.8; }
.prose ul { margin:12px 0 20px 20px; }
.prose ul li { color:var(--gris); margin-bottom:8px; list-style:disc; }
.prose blockquote { border-left:4px solid var(--or); padding:16px 20px; background:var(--creme); border-radius:0 8px 8px 0; margin:24px 0; font-style:italic; color:var(--bleu); font-family:var(--font-titre); font-size:1.05rem; }
.info-box { background:var(--creme); border:1px solid #e8e4dc; border-radius:12px; padding:24px; margin:24px 0; }
.info-box h4 { color:var(--bleu); font-weight:600; margin-bottom:10px; }

/* ── BOUTONS ─────────────────────────────────────────────────── */
.btn { display:inline-block; padding:12px 28px; border-radius:var(--radius); font-size:.9rem; font-weight:600; transition:all .2s; cursor:pointer; border:2px solid transparent; }
.btn-primary { background:var(--or); color:var(--bleu); border-color:var(--or); }
.btn-primary:hover { background:var(--or-clair); border-color:var(--or-clair); transform:translateY(-1px); }
.btn-bleu { background:var(--bleu); color:var(--blanc); border-color:var(--bleu); }
.btn-bleu:hover { background:var(--bleu-clair); transform:translateY(-1px); }
.btn-outline { background:transparent; color:var(--bleu); border-color:var(--bleu); }
.btn-outline:hover { background:var(--bleu); color:var(--blanc); }
.btn-or-outline { background:transparent; color:var(--blanc); border-color:rgba(255,255,255,.45); }
.btn-or-outline:hover { border-color:var(--blanc); background:rgba(255,255,255,.08); }

/* ── CARDS ───────────────────────────────────────────────────── */
.card { background:var(--creme); border:1px solid #e8e4dc; border-radius:16px; padding:28px; transition:transform .25s,box-shadow .25s; }
.card:hover { transform:translateY(-4px); box-shadow:var(--ombre-forte); }
.card-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.card-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.card-grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.card h3 { font-family:var(--font-titre); font-size:1.05rem; color:var(--bleu); margin-bottom:10px; }
.card p { font-size:.85rem; color:var(--gris); }

/* ── BADGE ───────────────────────────────────────────────────── */
.badge { display:inline-block; background:rgba(27,58,107,.08); color:var(--bleu); font-size:.72rem; font-weight:600; padding:3px 10px; border-radius:100px; }
.badge-or { background:rgba(200,168,75,.15); color:#8B6914; }
.badge-vert { background:rgba(34,139,34,.1); color:#1a6b1a; }

/* ── TABLE ───────────────────────────────────────────────────── */
.table-umeci { width:100%; border-collapse:collapse; font-size:.88rem; }
.table-umeci th { background:var(--bleu); color:var(--blanc); padding:12px 16px; text-align:left; font-weight:500; }
.table-umeci td { padding:11px 16px; border-bottom:1px solid #eee; }
.table-umeci tr:last-child td { border-bottom:none; }
.table-umeci tr:hover td { background:var(--creme); }

/* ── ACCORDÉON ───────────────────────────────────────────────── */
.accordion-item { border:1px solid #e8e4dc; border-radius:var(--radius); margin-bottom:8px; overflow:hidden; }
.accordion-btn { width:100%; display:flex; justify-content:space-between; align-items:center; padding:16px 20px; background:var(--blanc); border:none; cursor:pointer; font-family:var(--font-corps); font-size:.9rem; font-weight:600; color:var(--bleu); transition:background .2s; }
.accordion-btn:hover { background:var(--creme); }
.accordion-btn .icon { transition:transform .3s; font-size:.8rem; }
.accordion-btn.open .icon { transform:rotate(180deg); }
.accordion-body { display:none; padding:16px 20px; background:var(--creme); font-size:.88rem; color:var(--gris); line-height:1.8; }
.accordion-body.open { display:block; }

/* ── DEVISE BANDEAU ──────────────────────────────────────────── */
.devise-bandeau { background:var(--or); color:var(--bleu); text-align:center; padding:14px 24px; font-family:var(--font-titre); font-style:italic; font-size:1rem; font-weight:600; }

/* ── CHIFFRES ─────────────────────────────────────────────────── */
.chiffres { background:linear-gradient(135deg,var(--bleu) 0%,#0D2248 100%); color:var(--blanc); padding:60px 24px; }
.chiffres-inner { max-width:var(--max-w); margin:0 auto; display:grid; grid-template-columns:repeat(4,1fr); gap:32px; text-align:center; }
.chiffre-num { font-family:var(--font-titre); font-size:3rem; font-weight:700; color:var(--or-clair); line-height:1; }
.chiffre-label { font-size:.82rem; color:rgba(255,255,255,.65); text-transform:uppercase; letter-spacing:.06em; margin-top:8px; }

/* ── FOOTER ──────────────────────────────────────────────────── */
footer { background:#0D1F3C; color:rgba(255,255,255,.65); padding:60px 24px 0; }
.footer-inner { max-width:var(--max-w); margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px; padding-bottom:48px; border-bottom:1px solid rgba(255,255,255,.08); }
.footer-brand p { font-size:.85rem; margin:16px 0 20px; line-height:1.7; }
.footer-social { display:flex; gap:10px; }
.social-btn { width:36px; height:36px; border-radius:8px; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; font-size:.9rem; color:rgba(255,255,255,.75); transition:background .2s,color .2s; }
.social-btn:hover { background:var(--or); color:var(--bleu); }
.footer-col h4 { font-size:.75rem; font-weight:600; text-transform:uppercase; letter-spacing:.1em; color:var(--or-clair); margin-bottom:16px; }
.footer-links { display:flex; flex-direction:column; gap:8px; }
.footer-links a { font-size:.85rem; color:rgba(255,255,255,.55); transition:color .2s; }
.footer-links a:hover { color:var(--blanc); }
.footer-bottom { max-width:var(--max-w); margin:0 auto; display:flex; justify-content:space-between; align-items:center; padding:20px 0; font-size:.78rem; gap:16px; flex-wrap:wrap; }
.footer-bottom a { color:var(--or-clair); }

/* ── FORMULAIRE ──────────────────────────────────────────────── */
.form-group { margin-bottom:16px; }
.form-group label { display:block; font-size:.8rem; font-weight:600; color:var(--bleu); margin-bottom:6px; }
.form-group input, .form-group select, .form-group textarea { width:100%; padding:10px 14px; border:1.5px solid #ddd; border-radius:var(--radius); font-family:var(--font-corps); font-size:.88rem; color:var(--anthracite); background:var(--blanc); transition:border-color .2s; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline:none; border-color:var(--bleu); }
.form-group textarea { resize:vertical; min-height:110px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }

/* ── RESPONSIF ───────────────────────────────────────────────── */
@media (max-width:1024px) {
  .card-grid-3 { grid-template-columns:1fr 1fr; }
  .card-grid-4 { grid-template-columns:1fr 1fr; }
  .chiffres-inner { grid-template-columns:1fr 1fr; }
  .footer-inner { grid-template-columns:1fr 1fr; }
  .page-body-two { grid-template-columns:1fr; }
}
@media (max-width:768px) {
  .nav-links { display:none; }
  .nav-links.open { display:flex; flex-direction:column; position:absolute; top:72px; left:0; right:0; background:var(--blanc); padding:16px; box-shadow:var(--ombre-forte); gap:4px; z-index:999; }
  .nav-toggle { display:flex; }
  header { position:relative; }
  .card-grid-2, .card-grid-3, .card-grid-4 { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; }
  .footer-inner { grid-template-columns:1fr; }
  .dropdown-menu { position:static; box-shadow:none; border:none; background:var(--gris-clair); }
}

/* Menu : 10 onglets — resserrement sur écrans moyens, hamburger sous 1240px */
@media (max-width:1400px) {
  nav { gap:12px; }
  .nav-links > li > a { padding:8px 7px; font-size:.78rem; }
  .btn-nav, .nav-links .btn-rouge { margin-left:4px; padding:8px 12px !important; }
}
@media (max-width:1240px) {
  .nav-links { display:none; }
  .nav-links.open { display:flex; flex-direction:column; align-items:stretch; position:absolute; top:72px; left:0; right:0; background:var(--blanc); padding:16px; box-shadow:var(--ombre-forte); gap:4px; z-index:999; }
  .nav-toggle { display:flex; }
  header { position:relative; }
}