/* =============================================
   NETCHIFFRES — Mobile Responsive Styles
   Breakpoint: 768px
   ============================================= */

/* ── HAMBURGER BUTTON (hidden on desktop) ── */
.nav-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  flex-shrink: 0;
}
.nav-hamburger span {
  display: block;
  width: 22px;
  height: 1.5px;
  background: var(--black);
  transition: transform 0.22s ease, opacity 0.22s ease;
  transform-origin: center;
}
.nav-hamburger.active span:nth-child(1),
nav.nav-open .nav-hamburger span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
nav.nav-open .nav-hamburger span:nth-child(2) { opacity: 0; transform: scaleX(0); }
nav.nav-open .nav-hamburger span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

@media (max-width: 768px) {

  /* ── GLOBAL ── */
  :root {
    --gutter: 20px;
    --nav-h: 60px;
  }

  /* ── NAV ── */
  .nav-hamburger { display: flex; }

  .nav-links {
    display: none;
    position: fixed;
    top: var(--nav-h);
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--white);
    z-index: 998;
    flex-direction: column;
    overflow-y: auto;
    padding: 8px 0 40px;
    border-top: 1px solid var(--gray-200);
  }

  nav.nav-open .nav-links { display: flex; }

  .nav-links > li {
    height: auto;
    width: 100%;
    border-bottom: 1px solid var(--gray-100);
  }
  .nav-links > li > a {
    display: block;
    height: auto;
    padding: 18px var(--gutter);
    font-size: 13px;
    letter-spacing: 2px;
    color: var(--black);
  }
  .nav-cta-link {
    margin: 16px var(--gutter) 0 !important;
    display: block !important;
    text-align: center;
    padding: 16px !important;
  }
  .dropdown { display: none !important; }
  .chevron { display: none !important; }

  /* ── FOOTER ── */
  footer.main-footer {
    flex-direction: column;
    gap: 20px;
    padding: 28px var(--gutter);
    align-items: flex-start;
  }
  .footer-links { flex-wrap: wrap; gap: 16px; }
  .page-badge { display: none; }

  /* ══════════════════════════════
     INDEX.HTML
  ══════════════════════════════ */

  /* Hero */
  .hero {
    grid-template-columns: 1fr !important;
    min-height: auto !important;
  }
  .hero-left {
    padding: 48px var(--gutter) 40px !important;
    border-right: none !important;
    border-bottom: 1px solid var(--gray-200);
  }
  .hero-right {
    height: 260px !important;
  }
  .hero h1 { font-size: clamp(36px, 9vw, 52px) !important; letter-spacing: -1px !important; }

  /* Ticker — 2 colonnes sur mobile */
  .ticker {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    align-items: start !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  .ticker-sep { display: none !important; }
  .ticker-item {
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 4px !important;
    padding: 20px var(--gutter) !important;
    border-bottom: 1px solid var(--gray-200);
    white-space: nowrap;
  }
  .ticker > .ticker-item:nth-child(9) {
    grid-column: 1 / -1;
    border-bottom: none !important;
  }
  .ticker-num { font-size: 22px !important; letter-spacing: 0 !important; }
  .ticker-label { font-size: 9px !important; letter-spacing: 1px !important; }

  /* Intro split */
  .intro {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  .intro-text {
    padding: 48px var(--gutter) 40px !important;
    border-right: none !important;
    border-bottom: 1px solid var(--gray-200);
  }
  .intro-pillars {
    padding: 40px var(--gutter) 48px !important;
  }

  /* Services preview */
  .services-grid {
    grid-template-columns: 1fr !important;
  }
  .service-cell {
    border-right: none !important;
    border-bottom: 1px solid var(--gray-200);
  }

  /* Refs strip */
  .refs-strip {
    grid-template-columns: 1fr !important;
    padding: 0 var(--gutter) !important;
    gap: 0 !important;
  }
  .ref-card {
    border-right: none !important;
    border-bottom: 1px solid var(--gray-200);
  }
  .refs-preview { padding: 48px 0 !important; }
  .services-preview { padding: 48px 0 !important; }

  /* Before/after */
  .ba-grid {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  .before-after { padding: 48px var(--gutter) !important; }

  /* CTA band */
  .cta-band {
    grid-template-columns: 1fr !important;
    padding: 48px var(--gutter) !important;
    gap: 24px !important;
  }

  /* Niels section */
  .niels-grid,
  .histoire-section,
  [class*="-grid"]:not(.refs-grid):not(.services-grid):not(.partenaires-grid):not(.form-grid):not(.ba-grid) {
    grid-template-columns: 1fr !important;
  }

  /* ══════════════════════════════
     PRESTATIONS.HTML
  ══════════════════════════════ */

  .page-header {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding: 40px var(--gutter) 36px !important;
  }

  .service-row {
    grid-template-columns: 40px 1fr !important;
    gap: 16px !important;
    padding: 36px 0 !important;
  }
  .s-right {
    grid-column: 2 !important;
  }
  .s-num { font-size: 32px !important; }
  .s-illus { width: 52px !important; height: 52px !important; margin-bottom: 12px !important; }

  .process { padding: 48px var(--gutter) !important; }
  .process-header {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    margin-bottom: 40px !important;
  }
  .process-steps {
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
  }

  .partenaires-inner {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
  .partenaires-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
  }

  /* ══════════════════════════════
     HISTOIRE.HTML
  ══════════════════════════════ */

  .histoire {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    padding: 0 !important;
  }
  .histoire-visual {
    position: relative !important;
    top: auto !important;
    height: 320px !important;
    border-left: none !important;
    overflow: hidden;
  }
  .histoire-photo {
    aspect-ratio: unset !important;
    height: 100%;
  }
  .histoire-content {
    padding: 40px var(--gutter) !important;
    border-right: none !important;
  }

  .entreprise-inner {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  .entreprise-body {
    padding: 40px var(--gutter) !important;
    border-left: none !important;
    border-top: 1px solid var(--gray-200);
  }
  .entreprise-left { padding: 40px var(--gutter) !important; }

  .adn { padding: 48px var(--gutter) !important; }
  .adn-header {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    margin-bottom: 40px !important;
  }
  .adn-pillars {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  .adn-pillar {
    border-right: none !important;
    border-bottom: 1px solid var(--gray-200);
    padding: 24px 0 !important;
  }

  /* Timeline */
  .timeline { padding: 0 var(--gutter) !important; }

  /* ══════════════════════════════
     REFERENCES.HTML
  ══════════════════════════════ */

  .page-header-right { display: none; }

  .stats-row {
    grid-template-columns: 1fr 1fr !important;
  }
  .stat-cell {
    padding: 20px var(--gutter) !important;
  }
  .stat-cell:nth-child(2) { border-right: none !important; }
  .stat-n { font-size: 28px !important; }

  .filter-bar {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    height: auto !important;
    padding: 0 !important;
    flex-wrap: nowrap;
  }
  .filter-btn {
    padding: 14px 16px !important;
    white-space: nowrap;
    border-right: none !important;
    border-bottom: 2px solid transparent;
    flex-shrink: 0;
  }

  .refs-section { padding: 0 var(--gutter) !important; }
  .refs-grid {
    grid-template-columns: 1fr !important;
    gap: 1px !important;
    background: var(--gray-200);
  }
  .ref-card {
    background: var(--white);
  }
  .ref-photo { height: 200px !important; }

  /* ══════════════════════════════
     CONTACT.HTML
  ══════════════════════════════ */

  .contact-page {
    grid-template-columns: 1fr !important;
    min-height: auto !important;
  }
  .contact-left {
    padding: 48px var(--gutter) 40px !important;
    border-right: none !important;
    border-bottom: 1px solid var(--gray-200);
  }
  .contact-right {
    padding: 48px var(--gutter) 56px !important;
  }

  .form-grid {
    grid-template-columns: 1fr !important;
  }
  .form-submit {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 16px !important;
  }
  .btn-submit { text-align: center; }

  .contact-bottom {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding: 32px var(--gutter) !important;
  }

} /* end @media 768px */