/* =======================================
   ABENAKI conseil — Styles communs
   ======================================= */

/* Reset */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
img { max-width:100%; height:auto; display:block; }
a { text-decoration:none; }
button { cursor:pointer; font-family:inherit; }

/* === LOGO (toujours identique) === */
.logo { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.logo .mark { display:flex; gap:2.5px; align-items:center; padding-right:10px; border-right:1.5px solid #d0ccc4; }
.logo .mark .b { border-radius:2px; }
.logo .name { font-family:'Sora',sans-serif; font-weight:600; font-size:16px; letter-spacing:0.08em; color:#3a4f63; line-height:1; }
.logo .sub { font-family:'DM Sans',sans-serif; font-weight:400; font-size:8.5px; letter-spacing:0.20em; color:#a0b0be; margin-top:1px; }

/* === HAMBURGER === */
.hamburger {
  display:none; background:none; border:none; padding:8px;
  flex-direction:column; gap:5px; cursor:pointer; z-index:200;
}
.hamburger span { display:block; width:24px; height:2px; background:#2c3e50; border-radius:2px; transition:all 0.3s; }

/* === NAV MOBILE === */
.mobile-overlay {
  display:none; position:fixed; top:0; left:0; right:0; bottom:0;
  background:rgba(0,0,0,0.4); z-index:90; opacity:0; transition:opacity 0.3s;
}
.mobile-overlay.active { display:block; opacity:1; }

/* === SVG ICONS pour services === */
.svc-svg { width:22px; height:22px; flex-shrink:0; }

/* === SECTIONS COMMUNES === */
/* Références clients */
.ref-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(180px, 1fr));
  gap:24px;
  align-items:stretch;
}
.ref-item {
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px;
  padding:32px 24px; text-align:center;
  border-radius:14px; transition:all 0.3s;
  box-shadow:0 2px 8px rgba(15,23,42,0.04);
  min-height:160px;
}
.ref-item:hover { transform:translateY(-4px); box-shadow:0 8px 24px rgba(15,23,42,0.12); }
.ref-item img {
  max-height:64px;
  max-width:140px;
  width:auto;
  height:auto;
  object-fit:contain;
  filter:none;
  transition:all 0.3s;
  mix-blend-mode:multiply;
}
.ref-item:hover img { transform:scale(1.05); }
.ref-item .ref-name { font-size:13px; font-weight:500; margin-top:4px; }
.ref-item .ref-placeholder {
  width:100px; height:64px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:600; letter-spacing:0.06em;
}

/* Technos */
.techno-category { margin-bottom:32px; }
.techno-category h3 {
  font-size:13px; letter-spacing:0.1em; text-transform:uppercase;
  margin-bottom:14px; font-weight:500;
}
.techno-grid {
  display:flex; flex-wrap:wrap; gap:12px;
}
.techno-chip {
  display:flex; align-items:center; gap:10px;
  padding:10px 18px; border-radius:10px;
  font-size:14px; font-weight:400; transition:all 0.2s;
}
.techno-chip img { width:24px; height:24px; object-fit:contain; flex-shrink:0; }

/* === FLASH MESSAGES === */
.flash-msg {
  padding:14px 20px; border-radius:10px; margin-bottom:20px;
  font-size:14px; animation:fadeIn 0.4s ease;
}
.flash-msg.success { background:#eaf7f1; color:#1a7a4c; }
.flash-msg.error { background:#fef0ed; color:#c94d3a; }

/* === RESPONSIVE === */
@media (max-width: 1024px) {
  .svc-grid-4 { grid-template-columns:repeat(2, 1fr) !important; }
}

@media (max-width: 768px) {
  /* Nav */
  .nav-links {
    position:fixed !important; top:0; right:-100%; width:280px; height:100vh;
    flex-direction:column !important; padding:80px 32px 32px !important;
    gap:20px !important; z-index:100; transition:right 0.3s ease;
    box-shadow:-4px 0 24px rgba(0,0,0,0.1);
  }
  .nav-links.open { right:0; }
  .nav-links a { font-size:16px !important; }
  .hamburger { display:flex; }

  /* Hero */
  .hero-grid-2 { grid-template-columns:1fr !important; gap:40px !important; }
  .hero-padding { padding:120px 24px 60px !important; }

  /* Services */
  .svc-grid-4, .svc-grid-2 { grid-template-columns:1fr !important; }
  .section-padding { padding:60px 24px !important; }

  /* About */
  .about-grid-2 { grid-template-columns:1fr !important; gap:40px !important; }

  /* Contact form */
  .contact-grid-2 { grid-template-columns:1fr !important; }

  /* Stats */
  .stats-grid-4 { grid-template-columns:repeat(2, 1fr) !important; }

  /* Références */
  .ref-grid { grid-template-columns:repeat(auto-fill, minmax(110px, 1fr)); gap:16px; }
  .ref-item img { filter:grayscale(0%) !important; }

  /* Techno */
  .techno-grid { gap:8px; }
  .techno-chip { padding:6px 12px; font-size:12px; }

  /* Services list (theme 4) */
  .svc-list-item { grid-template-columns:36px 1fr !important; }
  .svc-list-item .svc-arrow { display:none !important; }

  /* Footer */
  .footer-flex { flex-direction:column; gap:8px; }
}

@media (max-width: 480px) {
  .hero-padding { padding:100px 16px 48px !important; }
  .section-padding { padding:48px 16px !important; }
  h1 { font-size:28px !important; line-height:1.2 !important; }
  .stats-grid-4 { grid-template-columns:1fr 1fr !important; gap:12px !important; }
  .ref-grid { grid-template-columns:repeat(auto-fill, minmax(90px, 1fr)); }
}

/* === ANIMATIONS === */
@keyframes fadeIn { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
@keyframes pulse { 0%,100%{opacity:1;} 50%{opacity:0.4;} }
