 :root {
    --blue: #1A4FD6;
    --blue-dark: #0F3599;
    --blue-light: #EEF3FF;
    --blue-mid: #DBEAFE;
    --blue-accent: #3B6EF8;
    --black: #0A0D14;
    --ink: #1C2233;
    --slate: #4A5568;
    --muted: #8492A6;
    --border: #E2E8F0;
    --border-blue: #C7D7FA;
    --white: #FFFFFF;
    --offwhite: #F8FAFF;
    --success: #0D9A60;
  }

  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; }

  body {
    background: var(--white);
    color: var(--ink);
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 16px;
    line-height: 1.65;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
  }

  nav {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 100;
    padding: 0 60px;
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--border);
    transition: box-shadow 0.3s;
  }

  nav.scrolled { box-shadow: 0 4px 24px rgba(26,79,214,0.07); }

  /* Hamburger */
  .nav-toggle {
    display: none;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    padding: 6px;
    background: none;
    border: none;
  }

  .nav-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--ink);
    border-radius: 2px;
    transition: all 0.3s;
  }

  .nav-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle.open span:nth-child(2) { opacity: 0; }
  .nav-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  /* Mobile nav panel */
  .nav-mobile {
    display: none;
    position: fixed;
    top: 68px; left: 0; right: 0;
    background: white;
    border-bottom: 1px solid var(--border);
    padding: 16px 20px 24px;
    z-index: 99;
    box-shadow: 0 8px 24px rgba(0,0,0,0.08);
    flex-direction: column;
    gap: 4px;
  }

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

  .nav-mobile a {
    display: block;
    color: var(--slate);
    text-decoration: none;
    font-size: 15px;
    font-weight: 500;
    padding: 12px 14px;
    border-radius: 9px;
    transition: all 0.18s;
  }

  .nav-mobile a:hover { color: var(--blue); background: var(--blue-light); }

  .nav-mobile .nav-cta {
    background: var(--blue) !important;
    color: white !important;
    font-weight: 600 !important;
    text-align: center;
    margin-top: 8px;
  }

  .logo {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 800;
    font-size: 22px;
    letter-spacing: -0.6px;
    color: var(--black);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 9px;
  }

  .logo img {
    height: 32px;
    width: auto;
    display: block;
  }

  .logo-mark {
    width: 30px; height: 30px;
    background: var(--blue);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 800;
    font-size: 15px;
    color: white;
  }

  .nav-links {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
  }

  .nav-links a {
    color: var(--slate);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    padding: 7px 14px;
    border-radius: 7px;
    transition: all 0.18s;
  }

  .nav-links a:hover { color: var(--blue); background: var(--blue-light); }

  .nav-cta {
    background: var(--blue) !important;
    color: white !important;
    padding: 9px 22px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    margin-left: 8px;
  }

  .nav-cta:hover {
    background: var(--blue-dark) !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(26,79,214,0.25) !important;
    color: white !important;
  }

  /* HERO */
  .hero {
    padding: 90px 3px 24px;
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 72px;
    align-items: center;
  }

  .hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--blue-light);
    border: 1px solid var(--border-blue);
    border-radius: 100px;
    padding: 7px 16px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--blue);
    margin-bottom: 28px;
    animation: fadeUp 0.7s ease both;
  }

  .badge-dot {
    width: 6px; height: 6px;
    background: var(--blue);
    border-radius: 50%;
    animation: pulse 2s ease-in-out infinite;
  }

  @keyframes pulse {
    0%,100% { opacity:1; transform:scale(1); }
    50% { opacity:0.35; transform:scale(0.7); }
  }

  .hero h1 {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 800;
    font-size: clamp(34px, 4.8vw, 58px);
    line-height: 1.06;
    letter-spacing: -0.03em;
    color: var(--black);
    animation: fadeUp 0.7s 0.08s ease both;
  }

  .hero h1 .hl { color: var(--blue); position: relative; }

  .hero-sub {
    font-size: 17px;
    color: var(--slate);
    margin-top: 20px;
    line-height: 1.72;
    font-weight: 400;
    max-width: 480px;
    animation: fadeUp 0.7s 0.16s ease both;
  }

  .hero-actions {
    display: flex;
    gap: 12px;
    margin-top: 38px;
    flex-wrap: wrap;
    animation: fadeUp 0.7s 0.24s ease both;
  }

  .btn-primary {
    background: var(--blue);
    color: white;
    padding: 14px 30px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s;
    box-shadow: 0 4px 16px rgba(26,79,214,0.22);
  }

  .btn-primary:hover {
    background: var(--blue-dark);
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(26,79,214,0.3);
  }

  .btn-ghost {
    background: white;
    color: var(--ink);
    padding: 14px 30px;
    border-radius: 10px;
    font-weight: 500;
    font-size: 15px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1.5px solid var(--border);
    transition: all 0.2s;
  }

  .btn-ghost:hover { border-color: var(--blue); color: var(--blue); background: var(--blue-light); }

  .hero-trust {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 26px;
    font-size: 13px;
    color: var(--muted);
    animation: fadeUp 0.7s 0.32s ease both;
  }

  .trust-faces { display: flex; }

  .trust-face {
    width: 219px; height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .trust-face:first-child { margin-left: 0; }

  .hero-right { animation: fadeUp 0.7s 0.2s ease both; }

  .hero-right img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 16px;
  }

  .app-window {
    background: white;
    border: 1.5px solid var(--border);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 20px 70px rgba(26,79,214,0.10), 0 4px 16px rgba(0,0,0,0.05);
    position: relative;
  }

  .app-window::before {
    content: '';
    position: absolute;
    top: 0; left: 15%; right: 15%; height: 2px;
    background: linear-gradient(90deg, transparent, var(--blue), transparent);
    opacity: 0.5;
  }

  .app-titlebar {
    background: var(--offwhite);
    border-bottom: 1px solid var(--border);
    padding: 13px 20px;
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .win-dots { display: flex; gap: 6px; }
  .win-dot { width: 10px; height: 10px; border-radius: 50%; }
  .win-dot:nth-child(1) { background: #FC5F57; }
  .win-dot:nth-child(2) { background: #FDBC2E; }
  .win-dot:nth-child(3) { background: #33C748; }

  .win-label { flex: 1; text-align: center; font-size: 12px; font-weight: 600; color: var(--muted); }

  .win-status {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 600;
    color: var(--success);
    background: rgba(13,154,96,0.08);
    padding: 3px 9px;
    border-radius: 20px;
  }

  .win-status::before { content: ''; width: 5px; height: 5px; background: var(--success); border-radius: 50%; }

  .app-body { display: flex; }

  .app-sidebar {
    width: 52px;
    background: var(--offwhite);
    border-right: 1px solid var(--border);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 14px 0;
  }

  .s-icon {
    width: 34px; height: 34px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    cursor: pointer;
  }

  .s-icon.active { background: var(--blue); }
  .s-icon:not(.active) { color: var(--muted); }
  .s-icon:not(.active):hover { background: var(--blue-light); }

  .chat-panel {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 18px 18px 0;
    gap: 12px;
    min-height: 280px;
    overflow: hidden;
  }

  .msg {
    display: flex;
    gap: 9px;
    align-items: flex-start;
    opacity: 0;
    transform: translateY(6px);
    animation: msgIn 0.45s ease forwards;
  }

  .msg:nth-child(1) { animation-delay: 1.0s; }
  .msg:nth-child(2) { animation-delay: 1.9s; }
  .msg:nth-child(3) { animation-delay: 2.7s; }
  .msg:nth-child(4) { animation-delay: 3.4s; }

  @keyframes msgIn { to { opacity:1; transform:translateY(0); } }

  .msg-av {
    width: 28px; height: 28px;
    border-radius: 7px;
    flex-shrink: 0;
    font-size: 10px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .msg-av.u { background: var(--blue-light); color: var(--blue); border: 1px solid var(--border-blue); }
  .msg-av.a { background: var(--blue); color: white; }

  .msg-bub {
    padding: 9px 13px;
    border-radius: 11px;
    font-size: 13px;
    line-height: 1.5;
    max-width: 88%;
    text-align: left;
  }

  .msg.user .msg-bub { background: var(--blue-light); border: 1px solid var(--border-blue); color: var(--ink); }
  .msg.ai .msg-bub { background: var(--offwhite); border: 1px solid var(--border); color: var(--ink); }

  .mhl { color: var(--blue); font-weight: 600; }

  .chat-input-row {
    border-top: 1px solid var(--border);
    padding: 11px 18px;
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 12px;
  }

  .chat-input-mock {
    flex: 1;
    background: var(--offwhite);
    border: 1.5px solid var(--border);
    border-radius: 8px;
    padding: 9px 13px;
    font-size: 13px;
    color: var(--muted);
    font-family: 'Plus Jakarta Sans', sans-serif;
  }

  .send-btn {
    width: 32px; height: 32px;
    background: var(--blue);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }

  /* LOGOS */
  .logos-band {
    background: var(--white);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    padding: 2px 60px;
    text-align: center;
  }

  .logos-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--muted);
    margin-bottom: 22px;
  }

  .logos-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 44px;
    flex-wrap: wrap;
  }

  .l-pill {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--slate);
    opacity: 0.55;
    transition: opacity 0.2s;
  }

  .l-pill:hover { opacity: 1; }

  .l-ico {
    width: 26px; height: 26px;
    background: var(--border);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
  }

  /* SECTION */
  .sw { padding: 108px 60px; max-width: 1280px; margin: 0 auto; }

  .slabel {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--blue);
    margin-bottom: 16px;
  }

  .slabel::before { content: ''; width: 20px; height: 2px; background: var(--blue); border-radius: 1px; }

  h2 {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 800;
    font-size: clamp(28px, 3.8vw, 48px);
    line-height: 1.08;
    letter-spacing: -0.025em;
    color: var(--black);
  }

  h2 .bl { color: var(--blue); }

  .ssub {
    font-size: 17px;
    color: var(--slate);
    max-width: 520px;
    margin-top: 14px;
    line-height: 1.7;
  }

  /* FEATURES */
  .feat-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-top: 60px;
  }

  .fc {
    background: white;
    border: 1.5px solid var(--border);
    border-radius: 16px;
    padding: 38px 34px;
    transition: all 0.25s;
    position: relative;
    overflow: hidden;
  }

  .fc:hover {
    border-color: var(--blue);
    transform: translateY(-3px);
    box-shadow: 0 14px 44px rgba(26,79,214,0.08);
  }

  .fc.blue {
    background: var(--blue);
    border-color: var(--blue);
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 56px;
    align-items: center;
  }

  .fc.blue:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 56px rgba(26,79,214,0.25);
  }

  .fic {
    width: 48px; height: 48px;
    background: var(--blue-light);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    margin-bottom: 22px;
  }

  .fc.blue .fic { background: rgba(255,255,255,0.14); }

  .ft {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 700;
    font-size: 19px;
    color: var(--black);
    margin-bottom: 11px;
    letter-spacing: -0.02em;
  }

  .fc.blue .ft { color: white; font-size: 24px; }

  .fd { font-size: 14.5px; color: var(--slate); line-height: 1.65; }
  .fc.blue .fd { color: rgba(255,255,255,0.72); font-size: 15px; }

  .ftags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 20px; }

  .ftag {
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.2);
    color: rgba(255,255,255,0.82);
    padding: 4px 11px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 500;
  }

  .fvis {
    background: rgba(255,255,255,0.09);
    border: 1px solid rgba(255,255,255,0.14);
    border-radius: 12px;
    padding: 22px;
  }

  .cr {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 9px 13px;
    background: rgba(255,255,255,0.06);
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,0.09);
    margin-bottom: 9px;
    font-size: 13px;
    color: rgba(255,255,255,0.78);
  }

  .cs {
    font-size: 11px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 4px;
    background: rgba(0,200,80,0.14);
    color: #4dde90;
  }

  .cs.warn { background: rgba(253,188,46,0.14); color: #FDBC2E; }

  /* STEPS */
  .steps-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    margin-top: 60px;
    position: relative;
  }

  .steps-line {
    position: absolute;
    top: 34px; left: 10%; right: 10%;
    height: 1.5px;
    background: linear-gradient(90deg, var(--blue-mid), var(--blue), var(--blue-mid));
  }

  .step { padding: 0 18px; text-align: center; position: relative; }

  .step-c {
    width: 68px; height: 68px;
    background: white;
    border: 2px solid var(--border);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 22px;
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 800;
    font-size: 22px;
    color: var(--blue);
    position: relative;
    z-index: 1;
    transition: all 0.3s;
  }

  .step:hover .step-c {
    background: var(--blue);
    border-color: var(--blue);
    color: white;
    box-shadow: 0 8px 22px rgba(26,79,214,0.25);
    transform: scale(1.07);
  }

  .step-t { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 700; font-size: 16px; color: var(--black); margin-bottom: 9px; }
  .step-d { font-size: 13.5px; color: var(--muted); line-height: 1.6; }

  /* USE CASES */
  .tabs-nav {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 32px;
    border-bottom: 2px solid var(--border);
    padding-bottom: 0;
  }

  .tab-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: var(--muted);
    padding: 9px 16px;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all 0.2s;
    border-radius: 6px 6px 0 0;
  }

  .tab-btn:hover { color: var(--blue); }
  .tab-btn.active { color: var(--blue); border-bottom-color: var(--blue); font-weight: 600; }

  .tab-panel { display: none; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
  .tab-panel.active { display: grid; }

  .tab-content h3 {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--black);
    margin-bottom: 12px;
    letter-spacing: -0.02em;
  }

  .tab-content p { color: var(--slate); font-size: 15px; line-height: 1.7; margin-bottom: 22px; }

  .use-list { list-style: none; display: flex; flex-direction: column; gap: 11px; }

  .use-list li {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    font-size: 14.5px;
    color: var(--ink);
    line-height: 1.5;
  }

  .uch {
    width: 19px; height: 19px;
    background: var(--blue-light);
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--blue);
    font-size: 9px;
    font-weight: 700;
    margin-top: 2px;
  }

  .tab-visual {
    background: var(--offwhite);
    border: 1.5px solid var(--border);
    border-radius: 14px;
    padding: 24px;
  }

  .mc {
    background: white;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 9px;
    display: flex;
    align-items: center;
    gap: 11px;
    transition: border-color 0.2s;
    cursor: pointer;
  }

  .mc:hover { border-color: var(--blue); }
  .mc:last-child { margin-bottom: 0; }

  .mc-ico {
    width: 32px; height: 32px;
    background: var(--blue-light);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    flex-shrink: 0;
  }

  .mc-info { flex: 1; }
  .mc-t { font-weight: 600; color: var(--black); font-size: 13px; }
  .mc-s { font-size: 12px; color: var(--muted); margin-top: 2px; }
  .mc-a { color: var(--blue); font-size: 13px; }

  /* SECURITY */
  .sec-wrap {
    background: var(--black);
    padding: 108px 60px;
  }

  .sec-inner {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 72px;
    align-items: center;
  }

  .sec-wrap .slabel { color: #7ba7f7; }
  .sec-wrap .slabel::before { background: #7ba7f7; }
  .sec-wrap h2 { color: white; }
  .sec-wrap h2 .bl { color: #7ba7f7; }
  .sec-wrap .ssub { color: #6a7590; }

  .sec-grid2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 40px;
  }

  .scard {
    background: #12162A;
    border: 1px solid #252D44;
    border-radius: 12px;
    padding: 22px;
    transition: border-color 0.3s;
  }

  .scard:hover { border-color: #3B6EF8; }
  .sc-ico { font-size: 20px; margin-bottom: 10px; }
  .sc-t { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 700; font-size: 14px; color: white; margin-bottom: 7px; }
  .sc-d { font-size: 13px; color: #505878; line-height: 1.55; }

  .sec-vis {
    background: #0C1020;
    border: 1px solid #252D44;
    border-radius: 16px;
    padding: 30px;
    position: relative;
    overflow: hidden;
  }

  .sec-vis::before {
    content: '';
    position: absolute;
    top: 0; left: 20%; right: 20%; height: 1px;
    background: linear-gradient(90deg, transparent, #3B6EF8, transparent);
  }

  .fl-label { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: #505878; font-weight: 600; margin-bottom: 20px; }

  .fl-item {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #12162A;
    border: 1px solid #252D44;
    border-radius: 10px;
    padding: 13px 14px;
    margin-bottom: 9px;
    font-size: 13px;
    color: #b0b8d0;
    transition: border-color 0.2s;
  }

  .fl-item:hover { border-color: #3B6EF8; }
  .fl-ico { font-size: 16px; width: 24px; text-align: center; }

  .fl-badge {
    margin-left: auto;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 4px;
    letter-spacing: 0.04em;
  }

  .fl-badge.g { background: rgba(13,154,96,0.12); color: #4dde90; }
  .fl-badge.b { background: rgba(59,110,248,0.12); color: #7ba7f7; }

  .fl-conn { width: 2px; height: 10px; background: #252D44; margin: 0 auto 9px 30px; }

  .no-data {
    margin-top: 18px;
    background: rgba(13,154,96,0.07);
    border: 1px solid rgba(13,154,96,0.18);
    border-radius: 9px;
    padding: 13px 15px;
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 13px;
    color: #4dde90;
    font-weight: 500;
  }

  /* CTA */
  .cta-wrap {
    background: var(--blue);
    padding: 108px 60px;
    text-align: center;
    position: relative;
    overflow: hidden;
  }

  .cta-wrap::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 60% 80% at 20% 50%, rgba(255,255,255,0.04) 0%, transparent 60%);
  }

  .cta-wrap h2 { color: white; max-width: 600px; margin: 0 auto; font-size: clamp(30px, 4.5vw, 54px); position: relative; }
  .cta-wrap p { color: rgba(255,255,255,0.68); font-size: 17px; margin: 18px auto 0; max-width: 460px; font-weight: 400; position: relative; }

  .cta-btns {
    display: flex;
    gap: 12px;
    justify-content: center;
    margin-top: 42px;
    flex-wrap: wrap;
    position: relative;
  }

  .btn-white {
    background: white;
    color: var(--blue);
    padding: 14px 34px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 15px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s;
    box-shadow: 0 4px 20px rgba(0,0,0,0.12);
  }

  .btn-white:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(0,0,0,0.18); }

  .btn-ow {
    background: transparent;
    color: white;
    padding: 14px 34px;
    border-radius: 10px;
    font-weight: 500;
    font-size: 15px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1.5px solid rgba(255,255,255,0.33);
    transition: all 0.2s;
  }

  .btn-ow:hover { background: rgba(255,255,255,0.09); border-color: rgba(255,255,255,0.55); }

  .cta-note { color: rgba(255,255,255,0.48); font-size: 13px; margin-top: 20px; position: relative; }

  /* FOOTER */
  footer {
    background: var(--white);
    border-top: 1px solid var(--border);
    padding: 68px 60px 38px;
  }

  .foot-top {
    display: grid;
    grid-template-columns: 2.2fr 1fr 1fr 1fr;
    gap: 56px;
    margin-bottom: 56px;
  }

  .foot-desc { color: var(--slate); font-size: 14px; line-height: 1.65; max-width: 280px; margin-top: 13px; }

  .foot-col-t {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--black);
    margin-bottom: 16px;
  }

  .foot-links { list-style: none; display: flex; flex-direction: column; gap: 9px; }
  .foot-links a { color: var(--slate); text-decoration: none; font-size: 14px; transition: color 0.2s; }
  .foot-links a:hover { color: var(--blue); }

  footer img {
    max-width: 100%;
    height: auto;
    display: inline-block;
  }

  .foot-bot {
    border-top: 1px solid var(--border);
    padding-top: 26px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 13px;
    color: var(--muted);
  }

  @keyframes fadeUp {
    from { opacity:0; transform:translateY(20px); }
    to { opacity:1; transform:translateY(0); }
  }

  .reveal { opacity:0; transform:translateY(22px); transition: opacity 0.65s ease, transform 0.65s ease; }
  .reveal.visible { opacity:1; transform:translateY(0); }
  .rd1 { transition-delay: 0.1s; }
  .rd2 { transition-delay: 0.2s; }

  /* ══════════════════════════════════════════
     PROBLÈME / SOLUTION — SECTION CHOC
  ══════════════════════════════════════════ */
  .problem-wrap {
    background: var(--offwhite);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    padding: 100px 60px;
  }

  .problem-inner {
    max-width: 1280px;
    margin: 0 auto;
  }

  .problem-headline {
    text-align: center;
    margin-bottom: 64px;
  }

  .problem-headline .slabel { justify-content: center; }

  .punch-quote {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 800;
    font-size: clamp(22px, 3.2vw, 38px);
    color: var(--black);
    text-align: center;
    max-width: 820px;
    margin: 24px auto 0;
    line-height: 1.2;
    letter-spacing: -0.025em;
  }

  .punch-quote .accent { color: var(--blue); }

  .vs-grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 32px;
    align-items: start;
    margin-top: 56px;
  }

  .vs-col {
    background: white;
    border: 1.5px solid var(--border);
    border-radius: 16px;
    padding: 36px 32px;
  }

  .vs-col.bad { border-color: #FECACA; background: #FFFAFA; }
  .vs-col.good { border-color: #BBF7D0; background: #F0FDF4; }

  .vs-title {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 700;
    font-size: 17px;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .vs-col.bad .vs-title { color: #DC2626; }
  .vs-col.good .vs-title { color: #16A34A; }

  .vs-items { list-style: none; display: flex; flex-direction: column; gap: 14px; }

  .vs-items li {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    font-size: 14.5px;
    color: var(--ink);
    line-height: 1.5;
  }

  .vs-dot-bad {
    width: 18px; height: 18px;
    background: #FEE2E2;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #DC2626;
    font-size: 10px;
    font-weight: 700;
    margin-top: 2px;
  }

  .vs-dot-good {
    width: 18px; height: 18px;
    background: #DCFCE7;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #16A34A;
    font-size: 10px;
    font-weight: 700;
    margin-top: 2px;
  }

  .vs-divider {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-top: 80px;
    gap: 12px;
  }

  .vs-arrow {
    width: 44px; height: 44px;
    background: var(--blue);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 18px;
    font-weight: 700;
    box-shadow: 0 8px 24px rgba(26,79,214,0.25);
  }

  .vs-vs {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 800;
    font-size: 13px;
    color: var(--muted);
    letter-spacing: 0.08em;
  }

  /* ══════════════════════════════════════════
     ALTERNATING SECTIONS — IMAGE + TEXTE
  ══════════════════════════════════════════ */
  .alt-section {
    padding: 100px 60px;
    max-width: 1280px;
    margin: 0 auto;
  }

  .alt-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 72px;
    align-items: center;
    margin-bottom: 100px;
  }

  .alt-row:last-child { margin-bottom: 0; }

  .alt-row.reverse .alt-visual { order: -1; }

  .alt-content .slabel { margin-bottom: 14px; }

  .alt-content h3 {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 800;
    font-size: clamp(26px, 3.2vw, 40px);
    line-height: 1.1;
    letter-spacing: -0.025em;
    color: var(--black);
    margin-bottom: 18px;
  }

  .alt-content h3 .bl { color: var(--blue); }

  .alt-content p {
    font-size: 16px;
    color: var(--slate);
    line-height: 1.75;
    margin-bottom: 28px;
  }

  .alt-list { list-style: none; display: flex; flex-direction: column; gap: 14px; margin-bottom: 32px; }

  .alt-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 15px;
    color: var(--ink);
    line-height: 1.5;
  }

  .alt-check {
    width: 22px; height: 22px;
    background: var(--blue-light);
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--blue);
    font-size: 10px;
    font-weight: 700;
    margin-top: 1px;
  }

  /* Visual mockups for alternating sections */
  .alt-visual {
    position: relative;
  }

  .visual-card {
    background: white;
    border: 1.5px solid var(--border);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 24px 64px rgba(26,79,214,0.10), 0 4px 16px rgba(0,0,0,0.04);
    position: relative;
  }

  .visual-card img {
    width: 100%;
    height: auto;
    display: block;
  }

  .visual-card::before {
    content: '';
    position: absolute;
    top: 0; left: 20%; right: 20%; height: 2px;
    background: linear-gradient(90deg, transparent, var(--blue), transparent);
    opacity: 0.4;
  }

  .vc-header {
    background: var(--offwhite);
    border-bottom: 1px solid var(--border);
    padding: 14px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .vc-dots { display: flex; gap: 5px; }
  .vc-dot { width: 8px; height: 8px; border-radius: 50%; }
  .vc-dot:nth-child(1) { background: #FC5F57; }
  .vc-dot:nth-child(2) { background: #FDBC2E; }
  .vc-dot:nth-child(3) { background: #33C748; }

  .vc-title { flex: 1; text-align: center; font-size: 11px; font-weight: 600; color: var(--muted); letter-spacing: 0.02em; }

  .vc-body { padding: 24px; }

  /* Governance mockup */
  .gov-stat-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
    margin-bottom: 18px;
  }

  .gov-stat {
    background: var(--offwhite);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 14px;
    text-align: center;
  }

  .gov-stat-num {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 800;
    font-size: 24px;
    color: var(--blue);
    letter-spacing: -0.02em;
    line-height: 1;
  }

  .gov-stat-label { font-size: 11px; color: var(--muted); margin-top: 4px; font-weight: 500; }

  .gov-policy {
    background: var(--offwhite);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 11px;
    font-size: 13px;
    color: var(--ink);
  }

  .gov-policy:last-child { margin-bottom: 0; }

  .gov-policy-ico {
    width: 30px; height: 30px;
    background: var(--blue-light);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
  }

  .gov-policy-info { flex: 1; }
  .gov-policy-name { font-weight: 600; font-size: 12.5px; color: var(--black); }
  .gov-policy-sub { font-size: 11px; color: var(--muted); margin-top: 1px; }

  .gov-policy-badge {
    font-size: 10px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 4px;
    letter-spacing: 0.04em;
  }

  .gov-badge-on { background: rgba(13,154,96,0.10); color: #0D9A60; }
  .gov-badge-off { background: rgba(220,38,38,0.08); color: #DC2626; }

  /* Knowledge base mockup */
  .kb-search {
    background: var(--offwhite);
    border: 1.5px solid var(--border);
    border-radius: 8px;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 18px;
    font-size: 13px;
    color: var(--muted);
  }

  .kb-folders {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 16px;
  }

  .kb-folder {
    background: var(--offwhite);
    border: 1.5px solid var(--border);
    border-radius: 10px;
    padding: 14px;
    cursor: pointer;
    transition: border-color 0.2s;
  }

  .kb-folder:hover { border-color: var(--blue); }
  .kb-folder.active { border-color: var(--blue); background: var(--blue-light); }

  .kb-folder-ico { font-size: 20px; margin-bottom: 6px; }
  .kb-folder-name { font-size: 12px; font-weight: 600; color: var(--black); }
  .kb-folder-count { font-size: 11px; color: var(--muted); margin-top: 2px; }

  .kb-file {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    background: var(--offwhite);
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-bottom: 7px;
    font-size: 12.5px;
    color: var(--ink);
    cursor: pointer;
    transition: border-color 0.2s;
  }

  .kb-file:hover { border-color: var(--blue); }
  .kb-file:last-child { margin-bottom: 0; }
  .kb-file-ico { font-size: 14px; }
  .kb-file-name { flex: 1; font-weight: 500; }
  .kb-file-type { font-size: 10px; color: var(--muted); background: var(--border); padding: 2px 6px; border-radius: 3px; font-weight: 600; letter-spacing: 0.05em; }

  /* Interface multi-models mockup */
  .mm-model-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 16px;
  }

  .mm-model {
    border: 1.5px solid var(--border);
    border-radius: 10px;
    padding: 14px;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .mm-model.selected { border-color: var(--blue); background: var(--blue-light); }
  .mm-model:hover:not(.selected) { border-color: var(--border-blue); }

  .mm-model-ico {
    width: 32px; height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
    background: var(--offwhite);
  }

  .mm-model.selected .mm-model-ico { background: rgba(26,79,214,0.12); }

  .mm-model-name { font-size: 12.5px; font-weight: 600; color: var(--black); }
  .mm-model-desc { font-size: 11px; color: var(--muted); margin-top: 1px; }

  .mm-switch-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--muted);
    margin-bottom: 10px;
  }

  .mm-benefit {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 13px;
    background: var(--offwhite);
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-bottom: 7px;
    font-size: 12.5px;
    color: var(--ink);
  }

  .mm-benefit:last-child { margin-bottom: 0; }
  .mm-benefit-ico { color: var(--blue); font-size: 14px; }

  /* ══════════════════════════════════════════
     SUITE D'OUTILS IA
  ══════════════════════════════════════════ */
  .suite-wrap {
    background: var(--blue);
    padding: 100px 60px;
    position: relative;
    overflow: hidden;
  }

  .suite-wrap::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 60% 80% at 80% 20%, rgba(255,255,255,0.04) 0%, transparent 60%);
  }

  .suite-inner {
    max-width: 1280px;
    margin: 0 auto;
    position: relative;
  }

  .suite-wrap .slabel { color: rgba(255,255,255,0.6); }
  .suite-wrap .slabel::before { background: rgba(255,255,255,0.4); }
  .suite-wrap h2 { color: white; }
  .suite-wrap .ssub { color: rgba(255,255,255,0.65); max-width: 580px; }

  .suite-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-top: 52px;
  }

  .suite-tool {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.14);
    border-radius: 14px;
    padding: 22px 18px;
    text-align: center;
    transition: all 0.25s;
    cursor: pointer;
  }

  .suite-tool:hover {
    background: rgba(255,255,255,0.14);
    border-color: rgba(255,255,255,0.3);
    transform: translateY(-3px);
  }

  .suite-tool-ico { font-size: 26px; margin-bottom: 10px; }

  .suite-tool-name {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 700;
    font-size: 14px;
    color: white;
    margin-bottom: 5px;
  }

  .suite-tool-desc { font-size: 12px; color: rgba(255,255,255,0.55); line-height: 1.45; }

  /* ══════════════════════════════════════════
     FAQ
  ══════════════════════════════════════════ */
  .faq-wrap {
    padding: 100px 60px;
    max-width: 1280px;
    margin: 0 auto;
  }

  .faq-layout {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 72px;
    margin-top: 56px;
    align-items: start;
  }

  .faq-sidebar h3 {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 800;
    font-size: 28px;
    color: var(--black);
    line-height: 1.2;
    margin-bottom: 16px;
    letter-spacing: -0.02em;
  }

  .faq-sidebar p { font-size: 15px; color: var(--slate); line-height: 1.7; margin-bottom: 28px; }

  .faq-list { display: flex; flex-direction: column; gap: 0; }

  .faq-item {
    border-bottom: 1px solid var(--border);
  }

  .faq-item:first-child { border-top: 1px solid var(--border); }

  .faq-q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 4px;
    cursor: pointer;
    gap: 16px;
    user-select: none;
  }

  .faq-q-text {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: var(--black);
    line-height: 1.4;
  }

  .faq-icon {
    width: 28px; height: 28px;
    background: var(--blue-light);
    border: 1px solid var(--border-blue);
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--blue);
    font-size: 16px;
    font-weight: 300;
    transition: all 0.25s;
  }

  .faq-item.open .faq-icon {
    background: var(--blue);
    color: white;
    transform: rotate(45deg);
  }

  .faq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease, padding 0.2s ease;
    padding: 0 4px;
  }

  .faq-item.open .faq-a {
    max-height: 300px;
    padding-bottom: 20px;
  }

  .faq-a p {
    font-size: 15px;
    color: var(--slate);
    line-height: 1.75;
  }

  /* ══════════════════════════════════════════
     CONTACT FORM
  ══════════════════════════════════════════ */
  .contact-wrap {
    background: var(--offwhite);
    border-top: 1px solid var(--border);
    padding: 100px 60px;
  }

  .contact-inner {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 80px;
    align-items: start;
  }

  .contact-info h2 { font-size: clamp(26px, 3vw, 40px); }
  .contact-info .ssub { max-width: 420px; }

  .contact-benefits {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 36px;
  }

  .contact-benefits li {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 15px;
    color: var(--ink);
    font-weight: 500;
  }

  .cb-ico {
    width: 38px; height: 38px;
    background: var(--blue-light);
    border: 1px solid var(--border-blue);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
  }

  .contact-form-card {
    background: white;
    border: 1.5px solid var(--border);
    border-radius: 20px;
    padding: 44px 40px;
    box-shadow: 0 8px 40px rgba(26,79,214,0.07);
    position: relative;
    overflow: hidden;
  }

  .contact-form-card::before {
    content: '';
    position: absolute;
    top: 0; left: 20%; right: 20%; height: 2px;
    background: linear-gradient(90deg, transparent, var(--blue), transparent);
    opacity: 0.5;
  }

  .form-title {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 700;
    font-size: 22px;
    color: var(--black);
    margin-bottom: 6px;
    letter-spacing: -0.02em;
  }

  .form-subtitle {
    font-size: 14px;
    color: var(--muted);
    margin-bottom: 32px;
  }

  .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 16px;
  }

  .form-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 16px;
  }

  .form-group:last-of-type { margin-bottom: 0; }

  .form-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--ink);
    letter-spacing: 0.01em;
  }

  .form-input, .form-select, .form-textarea {
    background: var(--offwhite);
    border: 1.5px solid var(--border);
    border-radius: 9px;
    padding: 11px 14px;
    font-size: 14px;
    color: var(--ink);
    font-family: 'Plus Jakarta Sans', sans-serif;
    transition: border-color 0.2s, box-shadow 0.2s;
    outline: none;
    width: 100%;
  }

  .form-input:focus, .form-select:focus, .form-textarea:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(26,79,214,0.08);
    background: white;
  }

  .form-input::placeholder, .form-textarea::placeholder { color: var(--muted); }

  .form-textarea { resize: vertical; min-height: 110px; line-height: 1.55; }

  .form-select { appearance: none; cursor: pointer; background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238492A6' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 38px; }

  .form-submit {
    width: 100%;
    background: var(--blue);
    color: white;
    border: none;
    padding: 14px 28px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 15px;
    font-family: 'Plus Jakarta Sans', sans-serif;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s;
    margin-top: 24px;
    box-shadow: 0 4px 16px rgba(26,79,214,0.2);
  }

  .form-submit:hover {
    background: var(--blue-dark);
    transform: translateY(-1px);
    box-shadow: 0 8px 24px rgba(26,79,214,0.3);
  }

  .form-note {
    text-align: center;
    font-size: 12px;
    color: var(--muted);
    margin-top: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
  }

  /* Success message */
  .form-success {
    display: none;
    text-align: center;
    padding: 40px 20px;
  }

  .form-success.show { display: block; }

  .form-success-ico { font-size: 48px; margin-bottom: 16px; }

  .form-success h3 {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 700;
    font-size: 22px;
    color: var(--black);
    margin-bottom: 10px;
  }

  .form-success p { font-size: 15px; color: var(--slate); }

  /* ══════════════════════════════════════════
     RESPONSIVE
  ══════════════════════════════════════════ */
  @media (max-width: 960px) {
    nav { padding: 0 20px; }
    .nav-links { display: none; }
    .nav-toggle { display: flex; }
    .hero { grid-template-columns: 1fr; padding: 100px 20px 60px; gap: 40px; }
    .hero-right { order: -1; }
    .hero h1 { font-size: clamp(28px, 7vw, 44px); }
    .hero-sub { max-width: 100%; }
    .hero-trust { flex-wrap: wrap; }
    .trust-face { width: auto; }
    .feat-grid { grid-template-columns: 1fr; }
    .fc.blue { grid-column: span 1; grid-template-columns: 1fr; gap: 28px; }
    .steps-grid { grid-template-columns: 1fr 1fr; }
    .steps-line { display: none; }
    .tab-panel.active { grid-template-columns: 1fr; }
    .sec-inner { grid-template-columns: 1fr; }
    .sec-grid2 { grid-template-columns: 1fr; }
    .foot-top { grid-template-columns: 1fr 1fr; }
    .foot-bot { flex-direction: column; gap: 8px; text-align: center; }
    .sw, footer { padding-left: 20px; padding-right: 20px; }
    footer { padding: 48px 20px 28px; }
    .logos-band { padding: 24px 20px; }
    .logos-row { gap: 20px; }
    .sec-wrap { padding: 80px 20px; }
    .cta-wrap { padding: 80px 20px; }
    .problem-wrap { padding: 70px 20px; }
    .vs-grid { grid-template-columns: 1fr; }
    .vs-divider { flex-direction: row; padding-top: 0; }
    .alt-section { padding: 60px 20px; }
    .alt-row { grid-template-columns: 1fr; gap: 36px; margin-bottom: 60px; }
    .alt-row.reverse .alt-visual { order: 0; }
    .suite-wrap { padding: 70px 20px; }
    .suite-grid { grid-template-columns: repeat(2, 1fr); }
    .faq-wrap { padding: 70px 20px; }
    .faq-layout { grid-template-columns: 1fr; gap: 40px; }
    .contact-wrap { padding: 70px 20px; }
    .contact-inner { grid-template-columns: 1fr; gap: 48px; }
    .contact-form-card { padding: 32px 24px; }
    .form-row { grid-template-columns: 1fr; }
    .mm-model-row { grid-template-columns: 1fr; }
    .kb-folders { grid-template-columns: 1fr 1fr; }
    .gov-stat-row { grid-template-columns: 1fr 1fr 1fr; }
  }

  @media (max-width: 480px) {
    .hero { padding: 90px 16px 48px; }
    .hero-actions { flex-direction: column; }
    .btn-primary, .btn-ghost { width: 100%; justify-content: center; }
    .suite-grid { grid-template-columns: repeat(2, 1fr); }
    .steps-grid { grid-template-columns: 1fr; }
    .foot-top { grid-template-columns: 1fr; gap: 32px; }
    .vs-col { padding: 24px 20px; }
    .contact-form-card { padding: 24px 16px; }
    .faq-wrap { padding: 56px 16px; }
    .problem-wrap { padding: 56px 16px; }
    .alt-section { padding: 48px 16px; }
    .cta-wrap { padding: 64px 16px; }
    .sec-wrap { padding: 64px 16px; }
    .gov-stat-row { grid-template-columns: 1fr 1fr; }
    .suite-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  }
