.nav{
      position:sticky;top:0;z-index:100;
      backdrop-filter:blur(16px);
      background:rgba(255,255,255,.88);
      border-bottom:1px solid rgba(15,23,42,.06);
      overflow:visible;
    }
    .nav-inner{
      min-height:84px;
      display:grid;
      grid-template-columns:auto 1fr auto;
      align-items:center;
      gap:18px;
      overflow:visible;
    }

    .nav-links{
      display:flex;align-items:center;justify-content:center;gap:8px;
      min-width:0;position:relative;overflow:visible;
    }

    .nav-link,.mega-trigger{
      display:inline-flex;align-items:center;gap:10px;
      min-height:48px;
      padding:0 16px;border-radius:14px;
      font-size:15px;font-weight:700;color:#223047;
      transition:.22s ease;
      border:1px solid transparent;
      background:transparent;
      cursor:pointer;
      font-family:inherit;
      white-space:nowrap;
    }
    .nav-link:hover,.mega-trigger:hover,.mega-item.is-open>.mega-trigger{
      background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(247,251,255,.9));
      border-color:rgba(37,99,235,.12);
      color:var(--blue);
      box-shadow:0 12px 26px rgba(15,23,42,.05);
    }

    .mega-item{
      position:relative;
      display:flex;
      align-items:center;
    }
    .mega-item::after{
      content:"";
      position:absolute;
      top:100%;
      left:0;
      width:100%;
      height:22px;
    }
    .mega-caret{font-size:12px;transition:transform .22s ease;color:#6b7a92}
    .mega-item.is-open .mega-caret{transform:rotate(180deg)}

    .mega-panel{
      position:absolute;
      top:calc(100% + 12px);
      left:50%;
      transform:translateX(-50%) translateY(10px);
      width:min(1180px, calc(100vw - 32px));
      opacity:0;
      visibility:hidden;
      pointer-events:none;
      transition:opacity .24s ease, transform .24s ease, visibility .24s ease;
      z-index:120;
    }
    .mega-item.align-left .mega-panel{
      left:0;
      transform:translateX(0) translateY(10px);
      width:min(780px, calc(100vw - 32px));
    }
    .mega-item:hover .mega-panel,
    .mega-item.is-open .mega-panel{
      opacity:1;
      visibility:visible;
      pointer-events:auto;
      transform:translateX(-50%) translateY(0);
    }
    .mega-item.align-left:hover .mega-panel,
    .mega-item.align-left.is-open .mega-panel{
      transform:translateX(0) translateY(0);
    }

    .mega-shell{
      position:relative;
      border-radius:30px;
      overflow:hidden;
      background:#fff;
      border:1px solid rgba(15,23,42,.08);
      box-shadow:var(--shadow-lg);
      isolation:isolate;
    }
    .mega-shell::before{
      content:"";
      position:absolute;inset:0;
      background:
        radial-gradient(circle at 8% 14%, rgba(37,99,235,.14), transparent 0 20%),
        radial-gradient(circle at 94% 16%, rgba(6,182,212,.12), transparent 0 22%),
        radial-gradient(circle at 72% 100%, rgba(214,166,74,.14), transparent 0 22%),
        linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
      z-index:-1;
    }

    .mega-grid{
      display:grid;
      grid-template-columns:280px 1.05fr 340px;
      min-height:420px;
    }

    .mega-side{
      padding:26px;
      border-right:1px solid rgba(15,23,42,.06);
      background:linear-gradient(180deg, rgba(248,251,255,.92), rgba(255,255,255,.82));
    }
    .mega-kicker{
      display:inline-flex;align-items:center;gap:8px;
      padding:8px 12px;border-radius:999px;
      font-size:12px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;
      color:var(--blue);
      background:rgba(37,99,235,.08);
      border:1px solid rgba(37,99,235,.08);
      margin-bottom:16px;
    }
    .mega-side h3{font-size:30px;line-height:1.02;letter-spacing:-.045em;margin-bottom:14px}
    .mega-side p{font-size:15px;color:var(--muted);line-height:1.72;margin-bottom:18px}
    .mega-pills{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
    .mega-pills span{
      padding:9px 12px;border-radius:999px;font-size:12px;font-weight:700;
      color:#223047;background:#fff;border:1px solid rgba(15,23,42,.07);
    }
    .mega-maincta{
      display:inline-flex;align-items:center;gap:10px;
      padding:14px 16px;border-radius:16px;
      color:#fff;font-weight:800;
      background:linear-gradient(135deg,var(--blue),var(--cyan));
      box-shadow:0 18px 30px rgba(37,99,235,.22);
    }

    .mega-links{
      padding:18px;
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:14px;
      align-content:start;
    }
    .mega-card{
      position:relative;
      display:block;
      min-height:144px;
      padding:20px;
      border-radius:22px;
      background:rgba(255,255,255,.92);
      border:1px solid rgba(15,23,42,.07);
      box-shadow:0 14px 26px rgba(15,23,42,.04);
      transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    }
    .mega-card:hover,.mega-card.is-active{
      transform:translateY(-3px);
      border-color:rgba(37,99,235,.18);
      box-shadow:0 18px 40px rgba(37,99,235,.10);
    }
    .mega-card small{
      display:inline-flex;
      margin-bottom:8px;
      font-size:12px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--blue);
    }
    .mega-card strong{display:block;font-size:22px;line-height:1.05;letter-spacing:-.03em;margin-bottom:8px}
    .mega-card p{color:var(--muted);font-size:14px;line-height:1.62}
    .mega-card .mini-list{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px}
    .mega-card .mini-list span{
      padding:7px 10px;border-radius:999px;
      background:rgba(248,251,255,.96);
      border:1px solid rgba(15,23,42,.06);
      font-size:12px;font-weight:700;color:#32415c;
    }

    .mega-highlight{
      padding:18px 18px 18px 0;
      display:flex;align-items:stretch;
    }
    .highlight-card{
      position:relative;
      flex:1;
      border-radius:26px;
      overflow:hidden;
      color:#fff;
      background:linear-gradient(135deg,#1d4ed8 0%, #0f8fc7 48%, #d6a64a 100%);
      padding:26px;
      display:flex;flex-direction:column;justify-content:flex-end;
      box-shadow:0 24px 42px rgba(15,23,42,.12);
    }
    .highlight-card::before{
      content:"";
      position:absolute;inset:0;
      background:
        radial-gradient(circle at top left, rgba(255,255,255,.24), transparent 0 28%),
        radial-gradient(circle at bottom right, rgba(255,255,255,.14), transparent 0 26%);
      pointer-events:none;
    }
    .highlight-top{margin-bottom:auto;position:relative;z-index:1}
    .highlight-label{
      display:inline-flex;padding:8px 12px;border-radius:999px;
      font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
      background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.16);
      margin-bottom:14px;
    }
    .highlight-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:relative;z-index:1}
    .metric{
      padding:14px;border-radius:18px;background:rgba(255,255,255,.12);
      border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(8px)
    }
    .metric strong{display:block;font-size:22px;line-height:1;margin-bottom:6px}
    .metric span{font-size:13px;color:rgba(255,255,255,.88)}
    .highlight-card h4{position:relative;z-index:1;font-size:30px;line-height:1.02;letter-spacing:-.04em;margin-top:18px;margin-bottom:10px}
    .highlight-card p{position:relative;z-index:1;color:rgba(255,255,255,.92);font-size:15px;line-height:1.7}

    .mini-mega .mega-grid{
      grid-template-columns:240px 1fr;
      min-height:320px;
    }
    .mini-mega .mega-links{
      grid-template-columns:1fr 1fr;
      padding:22px;
    }

    .nav-cta{
      display:inline-flex;align-items:center;justify-content:center;
      min-height:48px;padding:0 18px;border-radius:14px;
      color:#fff;font-weight:800;
      background:linear-gradient(135deg,var(--blue),var(--cyan));
      box-shadow:0 18px 30px rgba(37,99,235,.18);
      white-space:nowrap;
    }

    .mobile-toggle,.mobile-menu{display:none}
    .brand{display:flex;align-items:center;position:relative;z-index:3}
    .brand-logo{height:40px;width:auto;display:block}
    @media (max-width: 720px) {
    }


    /* ── Footer ── */
    .site-footer {
      background: #fff;
      border-top: 1px solid rgba(15,23,42,.08);
      padding: 40px 0 0;
      font-family: Inter, sans-serif;
    }
    .footer-top {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 20px;
      padding-bottom: 32px;
    }
    .footer-logos {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 24px;
      flex-wrap: wrap;
    }
    .footer-logo-sam  { height: 56px; width: auto; display: block; }
    .footer-logo-cid  { height: 52px; width: auto; display: block; opacity: .85; transition: opacity .18s; }
    .footer-logo-cid:hover { opacity: 1; }
    .footer-sep {
      width: 1px; height: 28px;
      background: rgba(15,23,42,.12);
    }
    .footer-mentions {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 6px 18px;
      font-size: 13px;
      color: #5b6880;
      line-height: 1.7;
    }
    .footer-mentions a {
      color: #2563eb;
      text-decoration: none;
    }
    .footer-mentions a:hover { text-decoration: underline; }
    .footer-mentions .pipe { color: rgba(15,23,42,.18); }
    .footer-bottom {
      border-top: 1px solid rgba(15,23,42,.07);
      padding: 14px 0;
      text-align: center;
      font-size: 12px;
      color: #94a3b8;
    }
    @media (max-width: 600px) {
      .footer-mentions { flex-direction: column; gap: 2px; }
      .footer-mentions .pipe { display: none; }
    }


    /* ═══════════════════════════════════════
       RESPONSIVE MOBILE — breakpoints 1040 / 768 / 480
    ═══════════════════════════════════════ */

    

    @media (max-width: 768px) {
      .method-grid, .service-card-campaign, .modal-grid { grid-template-columns: 1fr !important; }
    
      /* Conteneur */
      .container { width: calc(100% - 24px) !important; }

      /* Section spacing */
      .section, .hero { padding: 48px 0 !important; }

      /* Toutes les grilles → 1 colonne */
      .hero-grid,
      .split,
      .solution-grid,
      .ecosystem-grid,
      .value-grid,
      .mini-grid,
      .usecases,
      .module-grid,
      .stack,
      .cards-grid,
      .footer-inner,
      .form-grid,
      .tarif-grid,
      .pricing-grid,
      .features-grid,
      .steps-grid,
      .highlight-metrics,
      .mega-links { grid-template-columns: 1fr !important; }

      /* Textes */
      h1, .hero-title   { font-size: clamp(32px, 8vw, 52px) !important; }
      h2, .section-title { font-size: clamp(24px, 6vw, 36px) !important; }
      .section-desc, p  { font-size: 15px !important; }

      /* Hero */
      .hero-card, .hero-visual { border-radius: 20px; padding: 24px !important; }
      .hero-notes { flex-wrap: wrap; gap: 8px; }
      .hero-actions { flex-direction: column; gap: 10px; }
      .hero-actions a, .hero-actions button,
      .btn-primary, .btn-secondary { width: 100%; justify-content: center; }

      /* Cards */
      .module-card, .usecase, .solution-card,
      .stack-card, .panel, .card { padding: 20px !important; }

      /* Tabs / pills */
      .mega-pills, .hero-notes, .mini-list { flex-wrap: wrap; }

      /* Forms */
      .field.full, .field { grid-column: span 1 !important; }
      .checkbox-grid { grid-template-columns: 1fr 1fr !important; }
      input, select, textarea { font-size: 16px !important; } /* évite zoom iOS */

      /* Nav inner */
      .nav-inner { grid-template-columns: auto auto !important; }

      /* Footer */
      .footer-logos { flex-direction: column; gap: 16px; }
      .footer-sep   { width: 40px; height: 1px; }
    }

    @media (max-width: 480px) {
      .section, .hero { padding: 36px 0 !important; }
      .hero-card, .hero-visual { padding: 18px !important; }
      .module-card, .usecase { padding: 16px !important; }
      h1, .hero-title { font-size: 28px !important; letter-spacing: -.03em !important; }
      h2, .section-title { font-size: 22px !important; }
      .checkbox-grid { grid-template-columns: 1fr !important; }
      .highlight-metrics { grid-template-columns: 1fr 1fr !important; }
      .mega-links { grid-template-columns: 1fr !important; }
      .footer-logo-sam { height: 30px !important; }
      .footer-logo-cid { height: 26px !important; }
    }


    @media (max-width:1040px){
      .nav-links { display: none !important; }
      .nav-cta   { display: none !important; }
      .mobile-toggle {
        display: inline-flex !important;
        align-items: center; justify-content: center;
        min-height: 48px; padding: 0 16px; border-radius: 14px;
        border: 1px solid rgba(15,23,42,.08);
        background: #fff; font-weight: 800; color: #223047;
        box-shadow: 0 12px 24px rgba(15,23,42,.05);
        font-family: inherit; cursor: pointer;
      }
      .mobile-menu {
        display: none;
        padding: 0 0 18px;
        border-top: 1px solid rgba(15,23,42,.06);
        background: rgba(255,255,255,.97);
        backdrop-filter: blur(12px);
      }
      .mobile-menu.is-open { display: block; }
      .mobile-menu-inner  { display: grid; gap: 10px; padding-top: 16px; }
      .mobile-card {
        display: block; padding: 16px 18px; border-radius: 18px;
        background: #fff; border: 1px solid rgba(15,23,42,.07);
        box-shadow: 0 12px 24px rgba(15,23,42,.04);
        text-decoration: none; color: inherit;
      }
      .mobile-card small {
        display: block; color: var(--blue);
        font-size: 11px; font-weight: 800; letter-spacing: .08em;
        text-transform: uppercase; margin-bottom: 5px;
      }
      .mobile-card strong { display: block; font-size: 17px; line-height: 1.1; margin-bottom: 4px; }
      .mobile-card span   { display: block; color: var(--muted); font-size: 13px; line-height: 1.55; }
      .mobile-subgrid     { display: grid; gap: 10px; padding-left: 14px; }
      .nav-inner          { grid-template-columns: auto auto !important; justify-content: space-between; }
    }


    @media (max-width: 768px) {
      .mega-grid { grid-template-columns: 1fr !important; min-height: auto !important; }
      .mega-side  { border-right: none; border-bottom: 1px solid rgba(15,23,42,.06); }
      .mega-highlight { display: none !important; }
    }


/* Lightbox */
    .lightbox {
      position: fixed; inset: 0;
      background: rgba(0, 0, 0, .92);
      backdrop-filter: blur(8px);
      z-index: 10000;
      display: none;
      align-items: center;
      justify-content: center;
      animation: lb-fade-in .25s ease;
    }
    .lightbox.is-open { display: flex; }
    @keyframes lb-fade-in {
      from { opacity: 0; }
      to   { opacity: 1; }
    }
    .lightbox-stage {
      position: relative;
      max-width: 92vw;
      max-height: 88vh;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }
    .lightbox-img {
      max-width: 92vw;
      max-height: 78vh;
      object-fit: contain;
      border-radius: 8px;
      box-shadow: 0 20px 80px rgba(0, 0, 0, .8);
      animation: lb-zoom-in .35s cubic-bezier(.2, .9, .3, 1);
    }
    @keyframes lb-zoom-in {
      from { opacity: 0; transform: scale(.9); }
      to   { opacity: 1; transform: scale(1); }
    }
    .lightbox-caption {
      margin-top: 18px;
      color: rgba(255, 255, 255, .85);
      font-size: 14px;
      text-align: center;
      max-width: 80vw;
      line-height: 1.5;
    }
    .lightbox-counter {
      margin-top: 8px;
      color: rgba(255, 255, 255, .55);
      font-size: 12px;
      letter-spacing: .15em;
      text-transform: uppercase;
    }
    .lightbox-close,
    .lightbox-prev,
    .lightbox-next {
      position: absolute;
      width: 48px; height: 48px;
      border-radius: 50%;
      background: rgba(255, 255, 255, .12);
      border: 1px solid rgba(255, 255, 255, .18);
      color: #fff;
      font-size: 20px;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background .2s, transform .2s;
      backdrop-filter: blur(8px);
    }
    .lightbox-close:hover,
    .lightbox-prev:hover,
    .lightbox-next:hover {
      background: rgba(255, 255, 255, .22);
      transform: scale(1.05);
    }
    .lightbox-close {
      top: 24px; right: 24px;
      font-size: 22px;
    }
    .lightbox-prev { left: 24px;  top: 50%; transform: translateY(-50%); }
    .lightbox-next { right: 24px; top: 50%; transform: translateY(-50%); }
    .lightbox-prev:hover,
    .lightbox-next:hover { transform: translateY(-50%) scale(1.05); }
    .lightbox-prev[disabled],
    .lightbox-next[disabled] {
      opacity: .25; cursor: not-allowed; pointer-events: none;
    }
    body.lightbox-open { overflow: hidden; }
    @media (max-width: 600px) {
      .lightbox-prev, .lightbox-next, .lightbox-close {
        width: 40px; height: 40px; font-size: 17px;
      }
      .lightbox-close { top: 12px; right: 12px; }
      .lightbox-prev  { left:  10px; }
      .lightbox-next  { right: 10px; }
      .lightbox-img { max-height: 70vh; }
    }