html { scroll-behavior: smooth; }
html, body { margin:0; width:100%; max-width:100%; }
body { font-family: 'Poppins', Arial, sans-serif; background:#fff; color:#1a1a18; }
.wrap { max-width: 1200px; margin: 0 auto; background:#fff; }

.site-nav { display:flex; flex-wrap:nowrap; justify-content:space-between; align-items:center; padding:10px 16px; border-bottom:0.5px solid #e2e2df; width:100%; box-sizing:border-box; position:sticky; top:0; background:#E6F1FB; z-index:100; transition: box-shadow 0.2s ease; }
.site-nav.scrolled { box-shadow: 0 2px 10px rgba(0,0,0,0.06); }
.logo { display:inline-flex; align-items:center; text-decoration:none; }
.logo img { height:64px; width:auto; display:block; }
.navlinks { display:flex; flex-wrap:nowrap; gap:32px; font-size:18px; align-items:center; }
.navlinks a { color:#555; text-decoration:none; white-space:nowrap; padding:6px 4px; border-radius:6px; transition: background-color 0.15s, color 0.15s; }
.navlinks a:hover { color:#185FA5; background-color:#fff; }
.cta { background:#fff; color:#185FA5 !important; border:2px solid #378ADD; padding:10px 22px; border-radius:999px; font-size:16px; cursor:pointer; transition: transform 0.15s ease, background-color 0.15s ease, color 0.15s ease; }
.cta:hover { background:#378ADD; color:#fff !important; transform: translateY(-1px); }

.langues-switch { display:flex; gap:6px; align-items:center; }
.langues-switch a { display:flex; opacity:0.4; filter:grayscale(60%); transition: opacity 0.15s ease, filter 0.15s ease; }
.langues-switch a svg { display:block; border-radius:3px; }
.langues-switch a.actif { opacity:1; filter:none; }
.langues-switch a:hover { opacity:1; }

.hero { padding: 48px; display:flex; align-items:center; gap:40px; flex-wrap:wrap; }
.hero-text { flex: 1 1 320px; min-width:280px; }
.kicker { font-size:34px; color:#378ADD; font-weight:600; margin:0 0 16px; line-height:1.3; }
h1 { font-size:28px; font-weight:600; margin:0 0 16px; line-height:1.3; }
p.desc { font-size:18px; color:#555; line-height:1.7; margin:0 0 20px; max-width:480px; }
.btns { display:flex; gap:12px; }
.btn-primary { background:#378ADD; color:#fff; border:none; padding:10px 18px; border-radius:6px; font-size:14px; cursor:pointer; transition: transform 0.15s ease, background-color 0.15s ease; }
.btn-primary:hover { background:#185FA5; transform: translateY(-1px); }
.btn-secondary { background:#fff; color:#1a1a18; border:0.5px solid #ccc; padding:10px 18px; border-radius:6px; font-size:14px; cursor:pointer; transition: transform 0.15s ease, border-color 0.15s ease; }
.btn-secondary:hover { border-color:#888; transform: translateY(-1px); }
.photo-wrap { flex: 0 0 380px; display:flex; justify-content:center; }
.photo-wrap img { width:380px; height:380px; object-fit:cover; border-radius:12px; border:0.5px solid #e2e2df; }

.chiffres-cles { display:flex; justify-content:space-around; flex-wrap:wrap; gap:16px; padding:20px 32px; background:#fafaf9; border-top:0.5px solid #e2e2df; border-bottom:0.5px solid #e2e2df; }
.chiffre { text-align:center; }
.chiffre-valeur { font-size:20px; font-weight:600; margin:0; }
.chiffre-label { font-size:13px; color:#555; margin:0; }

.services { padding: 40px 0; }
.services-titre { font-size:18px; font-weight:600; margin:0 0 20px; padding:0 48px; }
.services-grille { padding: 0 48px; display:grid; grid-template-columns: repeat(2, 1fr); gap:24px; }
@media (max-width: 640px) { .services-grille { grid-template-columns: 1fr; } }

.cta-bandeau { margin:0 48px 48px; background:#E6F1FB; border-radius:12px; padding:32px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; }
.cta-bandeau-titre { font-weight:600; font-size:17px; margin:0 0 4px; color:#0C447C; }
.cta-bandeau-texte { font-size:14px; color:#185FA5; margin:0; }
.cta-bandeau .btn-primary { text-decoration:none; display:inline-block; }

.contact-section { margin:0 48px 48px; background:#E6F1FB; border-radius:12px; padding:32px; display:flex; gap:40px; flex-wrap:wrap; }
.contact-form-bloc { flex:1 1 320px; min-width:280px; }
.contact-alt-bloc { flex:0 0 220px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:12px; padding-left:24px; border-left:1px solid rgba(24,95,165,0.2); }
.contact-alt-titre { font-size:14px; color:#185FA5; margin:0; }
.contact-form { display:flex; flex-direction:column; gap:12px; max-width:420px; }
.contact-modal-contenu { padding:32px; }
.contact-modal-contenu .cta-bandeau-titre { color:#1a1a18; }
.contact-modal-contenu .cta-bandeau-texte { color:#555; }
.contact-form input, .contact-form textarea {
  padding:10px 14px; border:0.5px solid #ccc; border-radius:6px; font-size:14px;
  font-family:inherit; resize:vertical; box-sizing:border-box;
}
.contact-honeypot { position:absolute; left:-9999px; opacity:0; height:0; width:0; }
.contact-statut { padding:10px 14px; border-radius:6px; font-size:14px; margin:0 0 16px; }
.contact-statut-ok { background:#DFF5E6; color:#1D7A44; }
.contact-statut-erreur { background:#FBE6E6; color:#B23A48; }

.contact-succes { text-align:center; padding:24px 12px 12px; }
.contact-succes-titre { font-size:18px; font-weight:600; margin:0 0 6px; color:#1a1a18; }
.contact-succes-texte { font-size:14px; color:#666; margin:0 0 20px; }
.contact-succes-check {
  width:40px; height:40px; border-radius:50%; background:#1D7A44; border:none;
  display:inline-flex; align-items:center; justify-content:center; cursor:pointer;
  transition: transform 0.15s ease, background-color 0.15s ease;
}
.contact-succes-check:hover { background:#155e35; transform: scale(1.08); }
@media (max-width: 640px) {
  .contact-alt-bloc { border-left:none; border-top:1px solid rgba(24,95,165,0.2); padding-left:0; padding-top:20px; align-items:flex-start; }
}
.service-card { background:#fafaf9; border:0.5px solid #e2e2df; border-radius:12px; padding:2rem; display:flex; flex-direction:column; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.service-card:hover { transform: translateY(-4px); box-shadow: 0 8px 20px rgba(0,0,0,0.06); }
.service-icon-badge { width:auto; min-width:52px; height:52px; border-radius:10px; background:#fff; border:0.5px solid #e2e2df; display:flex; align-items:center; justify-content:center; gap:10px; padding:0 12px; margin-bottom:16px; }
.service-icon-badge img { width:28px; height:28px; }
.service-titre { font-weight:600; font-size:18px; margin:0 0 8px; }
.service-desc { font-size:15px; color:#555; margin:0; line-height:1.7; }
.service-points { list-style:none; margin:12px 0 0; padding:0; }
.service-points li { font-size:14px; color:#555; padding-left:20px; position:relative; margin-bottom:6px; line-height:1.5; }
.service-points li::before { content:"✓"; position:absolute; left:0; color:#185FA5; font-weight:600; }
.service-lien { display:inline-flex; align-items:center; gap:6px; margin-top:16px; font-size:14px; font-weight:600; color:#185FA5; text-decoration:none; }
.service-lien:hover { color:#0C447C; }
.service-lien i { font-size:16px; }

.site-footer { padding:20px 32px; border-top:0.5px solid #e2e2df; font-size:13px; color:#888; text-align:center; }
.site-footer a { color:#888; }
.site-footer a:hover { color:#185FA5; }

.page-texte { max-width:720px; margin:0 auto; padding:48px 24px; line-height:1.7; color:#333; }
.page-titre { font-size:26px; font-weight:600; margin:0 0 24px; }
.page-texte h2 { font-size:17px; font-weight:600; margin:32px 0 8px; }
.page-texte p { margin:0 0 8px; font-size:16px; }

.cookie-bandeau {
  position:fixed; bottom:0; left:0; right:0; z-index:200;
  background:#fff; border-top:0.5px solid #e2e2df; box-shadow:0 -4px 16px rgba(0,0,0,0.06);
  padding:16px 24px; display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:12px;
}
.cookie-bandeau p { margin:0; font-size:14px; color:#555; max-width:600px; }
.cookie-bandeau a { color:#185FA5; }
.cookie-boutons { display:flex; gap:10px; flex-shrink:0; }

.modal-overlay {
  display:none; position:fixed; inset:0; z-index:300;
  background:rgba(26,26,24,0.5);
  align-items:center; justify-content:center; padding:24px;
}
.modal-overlay.ouverte { display:flex; }
.modal-fenetre {
  position:relative; background:#fff; border-radius:12px;
  width:100%; max-width:760px; max-height:800px;
  box-shadow:0 20px 50px rgba(0,0,0,0.3); overflow:hidden;
}
.modal-fenetre.modal-rdv { height:85vh; }
.modal-corps { width:100%; height:100%; overflow-y:auto; box-sizing:border-box; }
.modal-corps iframe { width:100%; height:100%; border:none; display:block; }
.modal-fermer {
  position:absolute; top:8px; right:12px; z-index:1;
  background:none; border:none; font-size:28px; line-height:1; color:#888; cursor:pointer;
}
.modal-fermer:hover { color:#1a1a18; }

.tooltip { position:relative; }
.tooltip::after {
  content: attr(data-tooltip);
  position:absolute; bottom:135%; left:50%; transform:translateX(-50%) translateY(4px);
  background:#185FA5; color:#fff; padding:8px 16px; border-radius:999px;
  font-size:14px; font-weight:600; white-space:nowrap; z-index:10; line-height:1.3;
  opacity:0; pointer-events:none;
  transition: opacity 0.2s ease, transform 0.2s ease;
  box-shadow: 0 6px 16px rgba(12,68,124,0.25);
}
.tooltip::before {
  content:"";
  position:absolute; bottom:125%; left:50%; transform:translateX(-50%) translateY(4px);
  border:5px solid transparent; border-top-color:#185FA5;
  opacity:0; transition: opacity 0.2s ease, transform 0.2s ease;
}
.tooltip:hover::after, .tooltip:hover::before {
  opacity:1; transform:translateX(-50%) translateY(0);
}

.projets-wrap { max-width:1200px; margin:0 auto; padding:48px; }
.projets-intro { color:#555; font-size:16px; max-width:640px; margin:0 0 32px; line-height:1.6; }
.projets-grille { display:grid; grid-template-columns:repeat(2, 1fr); gap:24px; }
@media (max-width: 640px) { .projets-grille { grid-template-columns:1fr; } }
.projet-card { position:relative; background:#fafaf9; border:0.5px solid #e2e2df; border-radius:12px; padding:2rem; display:flex; flex-direction:column; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.projet-card:hover { transform: translateY(-4px); box-shadow: 0 8px 20px rgba(0,0,0,0.06); }
.projet-tag { position:absolute; top:20px; right:20px; font-size:11px; font-weight:600; background:#E6F1FB; color:#185FA5; padding:3px 10px; border-radius:999px; }
.projet-demo { font-size:13px; color:#888; font-style:italic; margin:16px 0 0; }
.projet-image { margin:0 0 16px; border-radius:8px; overflow:hidden; border:0.5px solid #e2e2df; }
.projet-image img { width:100%; display:block; }

.reveal { opacity:0; transform: translateY(16px); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal-visible { opacity:1; transform: translateY(0); }
.services-grille .reveal:nth-child(2) { transition-delay: 0.1s; }
.services-grille .reveal:nth-child(3) { transition-delay: 0.2s; }
.services-grille .reveal:nth-child(4) { transition-delay: 0.3s; }
