{"id":13,"date":"2026-03-19T00:00:00","date_gmt":"2026-03-19T00:00:00","guid":{"rendered":"https:\/\/www.leanmain.nl\/?page_id=2"},"modified":"2026-03-20T07:46:21","modified_gmt":"2026-03-20T07:46:21","slug":"homepagina","status":"publish","type":"page","link":"https:\/\/leanmain-mijndomein.co.nl\/","title":{"rendered":"Homepagina"},"content":{"rendered":"\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\" \/>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin \/>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Syne:wght@400;600;700;800&#038;family=Inter:wght@300;400;500;600&#038;display=swap\" rel=\"stylesheet\" \/>\n\n<style>\n*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }\n\n    :root {\n      --indigo-950: #0f0c29;\n      --indigo-900: #1a1740;\n      --indigo-800: #2d2a6e;\n      --indigo-600: #4f46e5;\n      --indigo-500: #6366f1;\n      --indigo-400: #818cf8;\n      --yellow: #f5c400;\n      --yellow-soft: rgba(245,196,0,0.12);\n      --white: #ffffff;\n    }\n\n    html { scroll-behavior: smooth; }\n\n    body {\n      font-family: 'Inter', sans-serif;\n      background: var(--indigo-950);\n      color: var(--white);\n      overflow-x: hidden;\n    }\n\n    \/* NAV *\/\n    nav {\n      position: fixed;\n      top: 0; left: 0; right: 0;\n      z-index: 100;\n      padding: 1.3rem 6%;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      transition: all 0.3s ease;\n    }\n\n    nav.scrolled {\n      background: rgba(15,12,41,0.95);\n      backdrop-filter: blur(16px);\n      padding: 0.85rem 6%;\n      border-bottom: 1px solid rgba(255,255,255,0.07);\n    }\n\n    .nav-logo {\n      font-family: 'Syne', sans-serif;\n      font-size: 1.25rem;\n      font-weight: 800;\n      color: white;\n      text-decoration: none;\n      display: flex;\n      align-items: center;\n      gap: 0.7rem;\n      letter-spacing: -0.3px;\n    }\n\n    .nav-logo img {\n      width: 32px;\n      height: 32px;\n      border-radius: 7px;\n      object-fit: cover;\n    }\n\n    .nav-logo-fallback {\n      width: 32px;\n      height: 32px;\n      background: var(--yellow);\n      border-radius: 7px;\n      display: none;\n      align-items: center;\n      justify-content: center;\n      font-size: 1rem;\n      flex-shrink: 0;\n    }\n\n    .nav-links {\n      display: flex;\n      gap: 2.2rem;\n      list-style: none;\n      align-items: center;\n    }\n\n    .nav-links a {\n      color: rgba(255,255,255,0.6);\n      text-decoration: none;\n      font-size: 0.88rem;\n      font-weight: 500;\n      transition: color 0.2s;\n    }\n\n    .nav-links a:hover { color: white; }\n\n    .nav-cta {\n      background: var(--yellow) !important;\n      color: #1a1740 !important;\n      padding: 0.55rem 1.35rem !important;\n      border-radius: 7px;\n      font-weight: 700 !important;\n      transition: opacity 0.2s !important;\n    }\n\n    .nav-cta:hover { opacity: 0.88 !important; }\n\n    .hamburger {\n      display: none;\n      flex-direction: column;\n      gap: 5px;\n      cursor: pointer;\n      padding: 4px;\n    }\n\n    .hamburger span {\n      width: 22px;\n      height: 2px;\n      background: white;\n      border-radius: 2px;\n      display: block;\n    }\n\n    \/* HERO *\/\n    #home {\n      min-height: 100vh;\n      display: grid;\n      grid-template-columns: 1fr 1fr;\n      align-items: center;\n      gap: 4rem;\n      padding: 8rem 6% 5rem;\n      position: relative;\n      overflow: hidden;\n    }\n\n    .hero-bg-grid {\n      position: absolute;\n      inset: 0;\n      background-image:\n        linear-gradient(rgba(99,102,241,0.065) 1px, transparent 1px),\n        linear-gradient(90deg, rgba(99,102,241,0.065) 1px, transparent 1px);\n      background-size: 64px 64px;\n      mask-image: radial-gradient(ellipse 90% 90% at 30% 50%, black 20%, transparent 100%);\n    }\n\n    .hero-glow {\n      position: absolute;\n      width: 600px;\n      height: 600px;\n      background: radial-gradient(circle, rgba(99,102,241,0.18) 0%, transparent 65%);\n      top: 0; left: -100px;\n      pointer-events: none;\n    }\n\n    .hero-yellow-glow {\n      position: absolute;\n      width: 300px;\n      height: 300px;\n      background: radial-gradient(circle, rgba(245,196,0,0.08) 0%, transparent 70%);\n      bottom: 10%; right: 10%;\n      pointer-events: none;\n    }\n\n    .hero-text { position: relative; }\n\n    .hero-title {\n      font-family: 'Syne', sans-serif;\n      font-size: clamp(2.8rem, 5.5vw, 5rem);\n      font-weight: 800;\n      line-height: 1.06;\n      letter-spacing: -1.5px;\n      margin-bottom: 1.5rem;\n      animation: fadeUp 0.9s ease both;\n    }\n\n    .hero-title .outline {\n      color: transparent;\n      -webkit-text-stroke: 2px rgba(255,255,255,0.3);\n    }\n\n    .hero-title .yellow { color: var(--yellow); }\n\n    .hero-sub {\n      font-size: 1.1rem;\n      color: rgba(255,255,255,0.57);\n      max-width: 500px;\n      line-height: 1.78;\n      margin-bottom: 2.5rem;\n      animation: fadeUp 0.9s 0.15s ease both;\n    }\n\n    .hero-actions {\n      display: flex;\n      gap: 1rem;\n      flex-wrap: wrap;\n      animation: fadeUp 0.9s 0.25s ease both;\n    }\n\n    .btn-yellow {\n      background: var(--yellow);\n      color: var(--indigo-900);\n      padding: 0.9rem 2.1rem;\n      border-radius: 8px;\n      text-decoration: none;\n      font-weight: 700;\n      font-size: 0.95rem;\n      transition: all 0.25s;\n      border: none;\n      cursor: pointer;\n      display: inline-block;\n    }\n\n    .btn-yellow:hover {\n      background: #ffd000;\n      transform: translateY(-2px);\n      box-shadow: 0 12px 36px rgba(245,196,0,0.35);\n    }\n\n    .btn-outline {\n      background: transparent;\n      color: white;\n      padding: 0.9rem 2.1rem;\n      border-radius: 8px;\n      text-decoration: none;\n      font-weight: 600;\n      font-size: 0.95rem;\n      transition: all 0.25s;\n      border: 1px solid rgba(255,255,255,0.2);\n      display: inline-block;\n    }\n\n    .btn-outline:hover {\n      border-color: rgba(255,255,255,0.5);\n      background: rgba(255,255,255,0.04);\n    }\n\n    .hero-pillars {\n      display: flex;\n      gap: 0.75rem;\n      margin-top: 3.5rem;\n      flex-wrap: wrap;\n      animation: fadeUp 0.9s 0.35s ease both;\n    }\n\n    .pillar {\n      display: flex;\n      align-items: center;\n      gap: 0.55rem;\n      background: rgba(255,255,255,0.05);\n      border: 1px solid rgba(255,255,255,0.09);\n      border-radius: 8px;\n      padding: 0.55rem 1rem;\n      font-size: 0.82rem;\n      color: rgba(255,255,255,0.72);\n      font-weight: 500;\n    }\n\n    .pillar-dot {\n      width: 7px;\n      height: 7px;\n      border-radius: 50%;\n      flex-shrink: 0;\n    }\n\n    .hero-visual {\n      position: relative;\n      animation: fadeIn 1.1s 0.2s ease both;\n    }\n\n    .hero-img-frame {\n      position: relative;\n      border-radius: 20px;\n      overflow: hidden;\n      border: 1px solid rgba(255,255,255,0.1);\n      box-shadow: 0 30px 80px rgba(0,0,0,0.5);\n    }\n\n    .hero-img-frame img {\n      width: 100%;\n      display: block;\n      object-fit: cover;\n      max-height: 480px;\n    }\n\n    .hero-img-overlay {\n      position: absolute;\n      inset: 0;\n      background: linear-gradient(135deg, rgba(15,12,41,0.3) 0%, transparent 60%);\n    }\n\n    .hero-img-badge {\n      position: absolute;\n      bottom: 1.5rem;\n      left: 1.5rem;\n      background: rgba(15,12,41,0.88);\n      backdrop-filter: blur(10px);\n      border: 1px solid rgba(255,255,255,0.12);\n      border-radius: 12px;\n      padding: 0.9rem 1.2rem;\n      display: flex;\n      align-items: center;\n      gap: 0.8rem;\n    }\n\n    .hero-img-badge img {\n      width: 32px;\n      height: 32px;\n      border-radius: 7px;\n      object-fit: cover;\n    }\n\n    .hero-img-badge-fallback {\n      width: 32px;\n      height: 32px;\n      background: var(--yellow);\n      border-radius: 7px;\n      display: none;\n      align-items: center;\n      justify-content: center;\n      font-size: 1rem;\n    }\n\n    .hero-img-badge-text strong {\n      display: block;\n      font-family: 'Syne', sans-serif;\n      font-size: 0.88rem;\n      font-weight: 700;\n      color: white;\n      line-height: 1;\n    }\n\n    .hero-img-badge-text span {\n      font-size: 0.75rem;\n      color: rgba(255,255,255,0.45);\n    }\n\n    .hero-glow-frame {\n      position: absolute;\n      inset: -20px;\n      background: radial-gradient(ellipse at 50% 50%, rgba(99,102,241,0.15) 0%, transparent 70%);\n      pointer-events: none;\n      z-index: -1;\n    }\n\n    \/* TECH STRIP *\/\n    .tech-strip {\n      border-top: 1px solid rgba(255,255,255,0.06);\n      border-bottom: 1px solid rgba(255,255,255,0.06);\n      padding: 2rem 6%;\n      background: rgba(255,255,255,0.02);\n    }\n\n    .tech-strip-inner {\n      max-width: 1200px;\n      margin: 0 auto;\n      display: flex;\n      align-items: center;\n      gap: 2.5rem;\n      flex-wrap: wrap;\n    }\n\n    .tech-strip-label {\n      font-size: 0.78rem;\n      color: rgba(255,255,255,0.35);\n      font-weight: 500;\n      text-transform: uppercase;\n      letter-spacing: 0.1em;\n      white-space: nowrap;\n    }\n\n    .tech-logos {\n      display: flex;\n      align-items: center;\n      gap: 2rem;\n      flex-wrap: wrap;\n    }\n\n    .tech-logo-item {\n      display: flex;\n      align-items: center;\n      gap: 0.6rem;\n      opacity: 0.65;\n      transition: opacity 0.2s;\n    }\n\n    .tech-logo-item:hover { opacity: 1; }\n\n    .tech-logo-item img {\n      height: 28px;\n      width: auto;\n      filter: brightness(0) invert(1);\n      object-fit: contain;\n    }\n\n    .tech-logo-otys img {\n      height: 32px;\n      filter: none;\n      border-radius: 6px;\n    }\n\n    .tech-logo-item span {\n      font-family: 'Syne', sans-serif;\n      font-size: 0.9rem;\n      font-weight: 700;\n      color: rgba(255,255,255,0.65);\n    }\n\n    .tech-logo-fallback {\n      width: 32px;\n      height: 32px;\n      background: var(--yellow);\n      border-radius: 6px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-size: 1rem;\n    }\n\n    \/* SHARED *\/\n    .section-wrap { padding: 9rem 6%; }\n\n    .inner {\n      max-width: 1200px;\n      margin: 0 auto;\n    }\n\n    .eyebrow {\n      display: inline-block;\n      color: var(--yellow);\n      font-size: 0.75rem;\n      font-weight: 700;\n      text-transform: uppercase;\n      letter-spacing: 0.14em;\n      margin-bottom: 1rem;\n    }\n\n    .h2 {\n      font-family: 'Syne', sans-serif;\n      font-size: clamp(1.9rem, 3.8vw, 3rem);\n      font-weight: 800;\n      line-height: 1.13;\n      letter-spacing: -0.5px;\n      margin-bottom: 1.3rem;\n    }\n\n    .lead {\n      font-size: 1.05rem;\n      color: rgba(255,255,255,0.55);\n      line-height: 1.78;\n      max-width: 520px;\n    }\n\n    \/* OVER ONS *\/\n    #over-ons {\n      background: rgba(255,255,255,0.02);\n      border-top: 1px solid rgba(255,255,255,0.07);\n      border-bottom: 1px solid rgba(255,255,255,0.07);\n    }\n\n    .over-grid {\n      display: grid;\n      grid-template-columns: 1fr 1fr;\n      gap: 6rem;\n      align-items: center;\n    }\n\n    .checklist {\n      list-style: none;\n      display: flex;\n      flex-direction: column;\n      gap: 0.9rem;\n      margin-top: 2rem;\n    }\n\n    .checklist li {\n      display: flex;\n      align-items: flex-start;\n      gap: 0.85rem;\n      font-size: 0.96rem;\n      color: rgba(255,255,255,0.73);\n      line-height: 1.5;\n    }\n\n    .check-icon {\n      width: 22px;\n      height: 22px;\n      min-width: 22px;\n      background: rgba(245,196,0,0.15);\n      border-radius: 50%;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: var(--yellow);\n      font-size: 0.68rem;\n      font-weight: 700;\n      margin-top: 1px;\n    }\n\n    .origin-card {\n      background: linear-gradient(145deg, var(--indigo-800) 0%, var(--indigo-900) 100%);\n      border: 1px solid rgba(255,255,255,0.09);\n      border-radius: 22px;\n      padding: 2.5rem;\n      position: relative;\n      overflow: hidden;\n    }\n\n    .origin-card::before {\n      content: '';\n      position: absolute;\n      top: 0; left: 0; right: 0;\n      height: 2px;\n      background: linear-gradient(90deg, var(--yellow), var(--indigo-400), transparent);\n    }\n\n    .origin-card-glow {\n      position: absolute;\n      width: 250px; height: 250px;\n      background: radial-gradient(circle, rgba(245,196,0,0.1) 0%, transparent 70%);\n      top: -60px; right: -30px;\n      pointer-events: none;\n    }\n\n    .origin-logo-row {\n      display: flex;\n      align-items: center;\n      gap: 1rem;\n      margin-bottom: 2rem;\n    }\n\n    .origin-logo-row img {\n      width: 48px;\n      height: 48px;\n      border-radius: 10px;\n      object-fit: cover;\n    }\n\n    .origin-logo-fallback {\n      width: 48px;\n      height: 48px;\n      background: var(--yellow);\n      border-radius: 10px;\n      display: none;\n      align-items: center;\n      justify-content: center;\n      font-size: 1.5rem;\n      flex-shrink: 0;\n    }\n\n    .origin-logo-text .brand {\n      font-family: 'Syne', sans-serif;\n      font-size: 1.2rem;\n      font-weight: 800;\n      color: white;\n      line-height: 1;\n    }\n\n    .origin-logo-text .sub {\n      font-size: 0.72rem;\n      color: rgba(255,255,255,0.38);\n      letter-spacing: 0.1em;\n      text-transform: uppercase;\n      margin-top: 3px;\n    }\n\n    .origin-pillars {\n      display: flex;\n      flex-direction: column;\n      gap: 0.9rem;\n    }\n\n    .origin-pillar {\n      display: flex;\n      align-items: flex-start;\n      gap: 1rem;\n      padding: 1.1rem 1.2rem;\n      background: rgba(255,255,255,0.04);\n      border: 1px solid rgba(255,255,255,0.07);\n      border-radius: 12px;\n      transition: all 0.2s;\n    }\n\n    .origin-pillar.main-pillar {\n      background: rgba(245,196,0,0.07);\n      border-color: rgba(245,196,0,0.2);\n    }\n\n    .origin-pillar:hover {\n      background: rgba(255,255,255,0.07);\n      border-color: rgba(255,255,255,0.12);\n    }\n\n    .origin-pillar.main-pillar:hover {\n      background: rgba(245,196,0,0.12);\n      border-color: rgba(245,196,0,0.3);\n    }\n\n    .op-icon {\n      width: 40px;\n      height: 40px;\n      min-width: 40px;\n      border-radius: 10px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-size: 1.1rem;\n      margin-top: 1px;\n    }\n\n    .op-icon.lean { background: rgba(245,196,0,0.15); }\n    .op-icon.ai   { background: rgba(99,102,241,0.18); }\n    .op-icon.main { background: rgba(245,196,0,0.2); }\n\n    .op-text strong {\n      display: block;\n      font-family: 'Syne', sans-serif;\n      font-size: 1rem;\n      font-weight: 800;\n      color: white;\n      margin-bottom: 3px;\n    }\n\n    .main-pillar .op-text strong { color: var(--yellow); font-size: 1.1rem; }\n\n    .op-text span {\n      font-size: 0.83rem;\n      color: rgba(255,255,255,0.48);\n      line-height: 1.5;\n    }\n\n    .main-pillar .op-text span { color: rgba(255,255,255,0.6); }\n\n    \/* DIENSTEN *\/\n    .diensten-header {\n      display: flex;\n      justify-content: space-between;\n      align-items: flex-end;\n      margin-bottom: 4rem;\n      gap: 2rem;\n      flex-wrap: wrap;\n    }\n\n    .diensten-header .lead { max-width: 360px; text-align: right; }\n\n    .diensten-grid {\n      display: grid;\n      grid-template-columns: repeat(3, 1fr);\n      gap: 1.5rem;\n    }\n\n    .dienst-card {\n      background: rgba(255,255,255,0.032);\n      border: 1px solid rgba(255,255,255,0.07);\n      border-radius: 20px;\n      padding: 2.2rem 2rem;\n      transition: all 0.3s ease;\n      cursor: default;\n      display: flex;\n      flex-direction: column;\n    }\n\n    .dienst-card:hover { transform: translateY(-5px); }\n\n    .dienst-card.ai-card:hover {\n      background: rgba(99,102,241,0.08);\n      border-color: rgba(99,102,241,0.25);\n    }\n\n    .dienst-card.otys-card:hover {\n      background: rgba(245,196,0,0.05);\n      border-color: rgba(245,196,0,0.2);\n    }\n\n    .dienst-card.rapport-card:hover {\n      background: rgba(129,140,248,0.06);\n      border-color: rgba(129,140,248,0.2);\n    }\n\n    .d-icon {\n      width: 52px;\n      height: 52px;\n      border-radius: 13px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-size: 1.4rem;\n      margin-bottom: 1.4rem;\n    }\n\n    .d-icon.yellow { background: rgba(245,196,0,0.15); }\n    .d-icon.indigo { background: rgba(99,102,241,0.15); }\n    .d-icon.light  { background: rgba(255,255,255,0.07); }\n\n    .dienst-tech-logos {\n      display: flex;\n      align-items: center;\n      gap: 0.6rem;\n      margin-bottom: 1.2rem;\n    }\n\n    .dienst-tech-logos img {\n      height: 22px;\n      width: auto;\n      border-radius: 5px;\n      object-fit: cover;\n      opacity: 0.8;\n    }\n\n    .dienst-tech-fallback {\n      height: 22px;\n      padding: 0 6px;\n      background: var(--yellow);\n      border-radius: 5px;\n      display: none;\n      align-items: center;\n      justify-content: center;\n      font-size: 0.65rem;\n      font-weight: 700;\n      color: var(--indigo-900);\n    }\n\n    .openai-logo-wrap {\n      height: 22px;\n      width: 22px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      opacity: 0.6;\n    }\n\n    .openai-logo-wrap img {\n      height: 18px;\n      width: 18px;\n      filter: brightness(0) invert(1);\n      border-radius: 0;\n    }\n\n    .dienst-card h3 {\n      font-family: 'Syne', sans-serif;\n      font-size: 1.12rem;\n      font-weight: 700;\n      margin-bottom: 0.75rem;\n      line-height: 1.2;\n    }\n\n    .dienst-card p {\n      font-size: 0.9rem;\n      color: rgba(255,255,255,0.5);\n      line-height: 1.72;\n      flex-grow: 1;\n    }\n\n    .dienst-points {\n      list-style: none;\n      margin-top: 1.3rem;\n      display: flex;\n      flex-direction: column;\n      gap: 0.5rem;\n    }\n\n    .dienst-points li {\n      font-size: 0.82rem;\n      color: rgba(255,255,255,0.52);\n      display: flex;\n      align-items: flex-start;\n      gap: 0.55rem;\n      line-height: 1.45;\n    }\n\n    .dienst-points li::before {\n      content: '\\2192';\n      color: var(--yellow);\n      font-size: 0.75rem;\n      margin-top: 1px;\n      flex-shrink: 0;\n    }\n\n    \/* WERKWIJZE *\/\n    #werkwijze {\n      background: rgba(255,255,255,0.018);\n      border-top: 1px solid rgba(255,255,255,0.07);\n      border-bottom: 1px solid rgba(255,255,255,0.07);\n    }\n\n    .werkwijze-head {\n      text-align: center;\n      margin-bottom: 5.5rem;\n    }\n\n    .werkwijze-head .lead { margin: 0 auto; text-align: center; }\n\n    .stappen {\n      display: grid;\n      grid-template-columns: repeat(4, 1fr);\n      gap: 1.5rem;\n      position: relative;\n    }\n\n    .stappen::before {\n      content: '';\n      position: absolute;\n      top: 27px;\n      left: calc(12.5% + 20px);\n      right: calc(12.5% + 20px);\n      height: 1px;\n      background: linear-gradient(90deg, transparent, rgba(245,196,0,0.3) 20%, rgba(245,196,0,0.3) 80%, transparent);\n    }\n\n    .stap { text-align: center; padding: 0 0.75rem; }\n\n    .stap-nr {\n      width: 54px;\n      height: 54px;\n      margin: 0 auto 1.5rem;\n      background: var(--indigo-900);\n      border: 2px solid var(--yellow);\n      border-radius: 50%;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-family: 'Syne', sans-serif;\n      font-weight: 800;\n      font-size: 1rem;\n      color: var(--yellow);\n      position: relative;\n      z-index: 1;\n    }\n\n    .stap h3 {\n      font-family: 'Syne', sans-serif;\n      font-size: 1rem;\n      font-weight: 700;\n      margin-bottom: 0.6rem;\n    }\n\n    .stap p {\n      font-size: 0.85rem;\n      color: rgba(255,255,255,0.45);\n      line-height: 1.65;\n    }\n\n    .stap-meta {\n      display: inline-block;\n      background: rgba(245,196,0,0.1);\n      border: 1px solid rgba(245,196,0,0.2);\n      color: var(--yellow);\n      font-size: 0.72rem;\n      font-weight: 600;\n      padding: 0.25rem 0.65rem;\n      border-radius: 100px;\n      margin-bottom: 0.75rem;\n    }\n\n    \/* CONTACT *\/\n    .contact-grid {\n      display: grid;\n      grid-template-columns: 1fr 1.5fr;\n      gap: 7rem;\n      align-items: start;\n    }\n\n    .contact-info .lead { margin-bottom: 2.5rem; }\n\n    .c-detail {\n      display: flex;\n      align-items: center;\n      gap: 0.9rem;\n      color: rgba(255,255,255,0.65);\n      font-size: 0.93rem;\n      margin-bottom: 1rem;\n    }\n\n    .c-icon {\n      width: 38px;\n      height: 38px;\n      min-width: 38px;\n      background: rgba(245,196,0,0.12);\n      border-radius: 9px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-size: 0.9rem;\n    }\n\n    .contact-form-card {\n      background: rgba(255,255,255,0.03);\n      border: 1px solid rgba(255,255,255,0.07);\n      border-radius: 20px;\n      padding: 2.5rem;\n    }\n\n    .form-row {\n      display: grid;\n      grid-template-columns: 1fr 1fr;\n      gap: 1rem;\n    }\n\n    .fgroup { margin-bottom: 1.2rem; }\n\n    .fgroup label {\n      display: block;\n      font-size: 0.82rem;\n      font-weight: 500;\n      color: rgba(255,255,255,0.58);\n      margin-bottom: 0.45rem;\n    }\n\n    .fgroup input,\n    .fgroup textarea,\n    .fgroup select {\n      width: 100%;\n      background: rgba(255,255,255,0.05);\n      border: 1px solid rgba(255,255,255,0.1);\n      border-radius: 8px;\n      color: white;\n      padding: 0.75rem 1rem;\n      font-family: 'Inter', sans-serif;\n      font-size: 0.93rem;\n      outline: none;\n      transition: border-color 0.2s, background 0.2s;\n      -webkit-appearance: none;\n    }\n\n    .fgroup input::placeholder,\n    .fgroup textarea::placeholder { color: rgba(255,255,255,0.22); }\n\n    .fgroup input:focus,\n    .fgroup textarea:focus,\n    .fgroup select:focus {\n      border-color: var(--yellow);\n      background: rgba(245,196,0,0.04);\n    }\n\n    .fgroup textarea { height: 115px; resize: vertical; }\n    .fgroup select option { background: var(--indigo-900); }\n\n    .form-btn {\n      width: 100%;\n      background: var(--yellow);\n      color: var(--indigo-900);\n      border: none;\n      padding: 1rem;\n      border-radius: 8px;\n      font-family: 'Inter', sans-serif;\n      font-size: 0.97rem;\n      font-weight: 700;\n      cursor: pointer;\n      transition: all 0.25s;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      gap: 0.5rem;\n    }\n\n    .form-btn:hover {\n      background: #ffd000;\n      transform: translateY(-2px);\n      box-shadow: 0 12px 36px rgba(245,196,0,0.3);\n    }\n\n    .form-success {\n      display: none;\n      text-align: center;\n      padding: 2rem;\n      color: var(--yellow);\n      font-family: 'Syne', sans-serif;\n      font-weight: 700;\n      font-size: 1.05rem;\n    }\n\n    \/* FOOTER *\/\n    footer {\n      border-top: 1px solid rgba(255,255,255,0.07);\n      padding: 2.2rem 6%;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      flex-wrap: wrap;\n      gap: 1rem;\n    }\n\n    .footer-brand {\n      display: flex;\n      align-items: center;\n      gap: 0.7rem;\n      font-family: 'Syne', sans-serif;\n      font-size: 1rem;\n      font-weight: 800;\n      color: white;\n      text-decoration: none;\n    }\n\n    .footer-brand img {\n      width: 26px;\n      height: 26px;\n      border-radius: 6px;\n      object-fit: cover;\n    }\n\n    .footer-logo-fallback {\n      width: 26px;\n      height: 26px;\n      background: var(--yellow);\n      border-radius: 6px;\n      display: none;\n      align-items: center;\n      justify-content: center;\n      font-size: 0.85rem;\n    }\n\n    .footer-copy {\n      font-size: 0.82rem;\n      color: rgba(255,255,255,0.3);\n    }\n\n    \/* ANIMATIONS *\/\n    .reveal {\n      opacity: 0;\n      transform: translateY(26px);\n      transition: opacity 0.7s ease, transform 0.7s ease;\n    }\n\n    .reveal.in { opacity: 1; transform: translateY(0); }\n    .reveal[data-delay=\"1\"] { transition-delay: 0.08s; }\n    .reveal[data-delay=\"2\"] { transition-delay: 0.16s; }\n    .reveal[data-delay=\"3\"] { transition-delay: 0.24s; }\n    .reveal[data-delay=\"4\"] { transition-delay: 0.32s; }\n\n    @keyframes fadeUp {\n      from { opacity: 0; transform: translateY(24px); }\n      to   { opacity: 1; transform: translateY(0); }\n    }\n\n    @keyframes fadeIn {\n      from { opacity: 0; }\n      to   { opacity: 1; }\n    }\n\n    \/* RESPONSIVE *\/\n    @media (max-width: 1024px) {\n      #home {\n        grid-template-columns: 1fr;\n        min-height: auto;\n        padding-top: 9rem;\n        padding-bottom: 4rem;\n      }\n      .hero-visual { display: none; }\n      .nav-links { display: none; }\n      .hamburger { display: flex; }\n      .over-grid { grid-template-columns: 1fr; gap: 3rem; }\n      .diensten-grid { grid-template-columns: 1fr; }\n      .stappen { grid-template-columns: 1fr 1fr; }\n      .stappen::before { display: none; }\n      .contact-grid { grid-template-columns: 1fr; gap: 3.5rem; }\n      .form-row { grid-template-columns: 1fr; }\n      .diensten-header .lead { text-align: left; }\n    }\n\n    @media (max-width: 580px) {\n      .section-wrap { padding: 5.5rem 5%; }\n      .stappen { grid-template-columns: 1fr; }\n      .hero-title { font-size: 2.6rem; letter-spacing: -0.5px; }\n      .hero-pillars { gap: 0.5rem; }\n      footer { flex-direction: column; text-align: center; }\n    }\n\n    .mobile-nav-open .nav-links {\n      display: flex !important;\n      flex-direction: column;\n      position: fixed;\n      top: 0; left: 0; right: 0; bottom: 0;\n      background: rgba(15,12,41,0.98);\n      align-items: center;\n      justify-content: center;\n      gap: 2.5rem;\n      z-index: 99;\n    }\n\n    .mobile-nav-open .nav-links a {\n      font-family: 'Syne', sans-serif;\n      font-size: 1.8rem;\n      font-weight: 800;\n    }\n\n    .mobile-nav-open .nav-cta {\n      background: var(--yellow) !important;\n      color: var(--indigo-900) !important;\n    }\n<\/style>\n\n<!-- NAV -->\n<nav id=\"nav\">\n  <a href=\"\/#home\" class=\"nav-logo\">\n    <img decoding=\"async\" src=\"\/wp-content\/uploads\/logoleanmain.png\" alt=\"Leanmain\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex';\" \/>\n    <div class=\"nav-logo-fallback\">&#x1F7E1;<\/div>\n    Leanmain\n  <\/a>\n  <ul class=\"nav-links\" id=\"navLinks\">\n    <li><a href=\"\/#over-ons\" onclick=\"closeNav()\">Over ons<\/a><\/li>\n    <li><a href=\"\/#diensten\" onclick=\"closeNav()\">Diensten<\/a><\/li>\n    <li><a href=\"\/#werkwijze\" onclick=\"closeNav()\">Werkwijze<\/a><\/li>\n    <li><a href=\"\/#contact\" class=\"nav-cta\" onclick=\"closeNav()\">Plan een gesprek<\/a><\/li>\n  <\/ul>\n  <div class=\"hamburger\" id=\"hamburger\" onclick=\"toggleNav()\">\n    <span><\/span><span><\/span><span><\/span>\n  <\/div>\n<\/nav>\n\n<!-- HERO -->\n<section id=\"home\">\n  <div class=\"hero-bg-grid\"><\/div>\n  <div class=\"hero-glow\"><\/div>\n  <div class=\"hero-yellow-glow\"><\/div>\n\n  <div class=\"hero-text\">\n    <h1 class=\"hero-title\">\n      Uw team werft.<br>\n      <span class=\"outline\">Wij regelen<\/span><br>\n      de <span class=\"yellow\">rest.<\/span>\n    <\/h1>\n\n    <p class=\"hero-sub\">\n      Uw mensen zijn aangenomen om te werven. Niet om systemen te beheren. Leanmain zorgt dat OTYS werkt, AI het werk verlicht en rapportages echt iets zeggen.\n    <\/p>\n\n    <div class=\"hero-actions\">\n      <a href=\"\/#contact\" class=\"btn-yellow\">Plan een gratis gesprek &#x2192;<\/a>\n      <a href=\"\/#diensten\" class=\"btn-outline\">Wat wij doen<\/a>\n    <\/div>\n\n    <div class=\"hero-pillars\">\n      <div class=\"pillar\">\n        <div class=\"pillar-dot\" style=\"background:var(--yellow);\"><\/div>\n        Lean\n      <\/div>\n      <div class=\"pillar\">\n        <div class=\"pillar-dot\" style=\"background:var(--indigo-400);\"><\/div>\n        AI\n      <\/div>\n      <div class=\"pillar\">\n        <div class=\"pillar-dot\" style=\"background:rgba(255,255,255,0.5);\"><\/div>\n        Main\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div class=\"hero-visual\">\n    <div class=\"hero-glow-frame\"><\/div>\n    <div class=\"hero-img-frame\">\n      <img decoding=\"async\" src=\"\/wp-content\/uploads\/workspace.png\" alt=\"Recruiter aan het werk met OTYS op meerdere schermen\" \/>\n      <div class=\"hero-img-overlay\"><\/div>\n      <div class=\"hero-img-badge\">\n        <img decoding=\"async\" src=\"\/wp-content\/uploads\/logoleanmain.png\" alt=\"Leanmain\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex';\" \/>\n        <div class=\"hero-img-badge-fallback\">&#x1F7E1;<\/div>\n        <div class=\"hero-img-badge-text\">\n          <strong>OTYS specialist<\/strong>\n          <span>Beheer en optimalisatie<\/span>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- TECH STRIP -->\n<div class=\"tech-strip\">\n  <div class=\"tech-strip-inner\">\n    <span class=\"tech-strip-label\">Wij werken met<\/span>\n    <div class=\"tech-logos\">\n      <div class=\"tech-logo-item tech-logo-otys\">\n        <img decoding=\"async\" src=\"\/wp-content\/uploads\/logoleanmain.png\" alt=\"OTYS\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex';\" \/>\n        <div class=\"tech-logo-fallback\" style=\"height:32px;width:32px;\">&#x1F7E1;<\/div>\n        <span>OTYS<\/span>\n      <\/div>\n      <div class=\"tech-logo-item\">\n        <div class=\"openai-logo-wrap\">\n          <img decoding=\"async\" src=\"\/wp-content\/uploads\/openai-logo.png\" alt=\"OpenAI\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='block';\" \/>\n          <span style=\"display:none;font-size:1.1rem;\">&#x26AB;<\/span>\n        <\/div>\n        <span>OpenAI<\/span>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<!-- OVER ONS -->\n<section id=\"over-ons\" class=\"section-wrap\">\n  <div class=\"inner over-grid\">\n    <div class=\"reveal\">\n      <span class=\"eyebrow\">Wie wij zijn<\/span>\n      <h2 class=\"h2\">Lean. AI. Main.<br>Dat is Leanmain.<\/h2>\n      <p class=\"lead\">\n        Leanmain is ontstaan vanuit drie overtuigingen. Lean: elimineer wat niet bijdraagt. AI: zet technologie in als versneller. Main: uw hoofdzaak is werving. Alles wat daarvan afleidt regelen wij.\n      <\/p>\n      <ul class=\"checklist\">\n        <li><span class=\"check-icon\">&#x2713;<\/span> Uw medewerkers focussen volledig op werven<\/li>\n        <li><span class=\"check-icon\">&#x2713;<\/span> OTYS werkt zoals het hoort, zonder dat u er naar omkijkt<\/li>\n        <li><span class=\"check-icon\">&#x2713;<\/span> AI neemt het repetitieve werk over<\/li>\n        <li><span class=\"check-icon\">&#x2713;<\/span> Rapportages die u helpen sturen op feiten<\/li>\n        <li><span class=\"check-icon\">&#x2713;<\/span> Geen eenmalig project, maar een doorlopend partnerschap<\/li>\n        <li><span class=\"check-icon\">&#x2713;<\/span> Periodiek op locatie om zaken direct op te pakken<\/li>\n      <\/ul>\n    <\/div>\n\n    <div class=\"reveal\" data-delay=\"2\">\n      <div class=\"origin-card\">\n        <div class=\"origin-card-glow\"><\/div>\n        <div class=\"origin-logo-row\">\n          <img decoding=\"async\" src=\"\/wp-content\/uploads\/logoleanmain.png\" alt=\"Leanmain\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex';\" \/>\n          <div class=\"origin-logo-fallback\">&#x1F7E1;<\/div>\n          <div class=\"origin-logo-text\">\n            <div class=\"brand\">Leanmain<\/div>\n            <div class=\"sub\">Uw OTYS en AI partner<\/div>\n          <\/div>\n        <\/div>\n        <div class=\"origin-pillars\">\n          <div class=\"origin-pillar\">\n            <div class=\"op-icon lean\">&#x1F3C3;<\/div>\n            <div class=\"op-text\">\n              <strong>Lean<\/strong>\n              <span>Elimineer verspilling. Meer bereiken met minder moeite.<\/span>\n            <\/div>\n          <\/div>\n          <div class=\"origin-pillar\">\n            <div class=\"op-icon ai\">&#x1F916;<\/div>\n            <div class=\"op-text\">\n              <strong>AI<\/strong>\n              <span>Slimme technologie als versneller binnen uw recruitmentproces.<\/span>\n            <\/div>\n          <\/div>\n          <div class=\"origin-pillar main-pillar\">\n            <div class=\"op-icon main\">&#x1F3AF;<\/div>\n            <div class=\"op-text\">\n              <strong>Main<\/strong>\n              <span>Uw hoofdzaak is werven. Dat is wat uw mensen moeten doen. Al het andere regelen wij zodat uw team hier volledig op kan focussen.<\/span>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- DIENSTEN -->\n<section id=\"diensten\" class=\"section-wrap\">\n  <div class=\"inner\">\n    <div class=\"diensten-header\">\n      <div class=\"reveal\">\n        <span class=\"eyebrow\">Wat wij doen<\/span>\n        <h2 class=\"h2\">Drie diensten.<br>Een doel.<\/h2>\n      <\/div>\n      <p class=\"lead reveal\" data-delay=\"2\">\n        Alles wat uw team afleidt van werven nemen wij over.\n      <\/p>\n    <\/div>\n\n    <div class=\"diensten-grid\">\n\n      <!-- AI Assistenten -->\n      <div class=\"dienst-card ai-card reveal\" data-delay=\"1\">\n        <div class=\"d-icon indigo\">&#x1F916;<\/div>\n        <div class=\"dienst-tech-logos\">\n          <div class=\"openai-logo-wrap\" style=\"opacity:0.5;\">\n            <img decoding=\"async\" src=\"\/wp-content\/uploads\/openai-logo.png\" alt=\"OpenAI\" onerror=\"this.style.display='none';\" \/>\n          <\/div>\n          <span style=\"font-size:0.72rem;color:rgba(255,255,255,0.35);\">Powered by OpenAI<\/span>\n        <\/div>\n        <h3>AI Assistenten<\/h3>\n        <p>Slimme AI assistenten die het schrijf en administratiewerk overnemen. Uw recruiters houden tijd over voor wat echt telt: mensen vinden en binden.<\/p>\n        <ul class=\"dienst-points\">\n          <li>Vacatureteksten schrijven op maat<\/li>\n          <li>Kandidaatvoorstellen in uw huisstijl<\/li>\n          <li>Kennismakingsgesprekverslagen automatisch<\/li>\n          <li>Kandidaatprofielen en referenties<\/li>\n          <li>EU AI Act conforme CV verwerking<\/li>\n          <li>Verwerking van opdrachtgeversinformatie<\/li>\n        <\/ul>\n      <\/div>\n\n      <!-- OTYS Beheer -->\n      <div class=\"dienst-card otys-card reveal\" data-delay=\"2\">\n        <div class=\"d-icon yellow\">&#x2699;&#xFE0F;<\/div>\n        <div class=\"dienst-tech-logos\">\n          <img decoding=\"async\" src=\"\/wp-content\/uploads\/logoleanmain.png\" alt=\"OTYS\" style=\"height:22px;width:22px;border-radius:5px;object-fit:cover;opacity:0.7;\"\n               onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex';\" \/>\n          <div class=\"dienst-tech-fallback\">OTYS<\/div>\n          <span style=\"font-size:0.72rem;color:rgba(255,255,255,0.35);\">OTYS specialist<\/span>\n        <\/div>\n        <h3>OTYS Beheer en Doorontwikkeling<\/h3>\n        <p>Wij beheren OTYS volledig zodat uw medewerkers zich niet bezig hoeven te houden met het systeem en volledig kunnen focussen op werven.<\/p>\n        <ul class=\"dienst-points\">\n          <li>Workflows met de juiste automatische mails<\/li>\n          <li>Inrichting van het klantportaal<\/li>\n          <li>Koppelingen met de juiste jobboards<\/li>\n          <li>Statusbeheer zodat iedereen weet waar een kandidaat staat<\/li>\n          <li>Dashboard dat echt werkt voor uw medewerkers<\/li>\n          <li>Overzichtelijke werkruimte zonder dubbele informatie<\/li>\n        <\/ul>\n      <\/div>\n\n      <!-- Rapportages -->\n      <div class=\"dienst-card rapport-card reveal\" data-delay=\"3\">\n        <div class=\"d-icon light\">&#x1F4CA;<\/div>\n        <div style=\"height:22px;margin-bottom:1.2rem;\"><\/div>\n        <h3>Rapportages die Werken<\/h3>\n        <p>Geen rapporten die in een map belanden. Een overzicht dat u in een oogopslag vertelt wat u moet weten zodat u stuurt op feiten.<\/p>\n        <ul class=\"dienst-points\">\n          <li>Inzicht in herkomst van kandidaten<\/li>\n          <li>Hoeveel kandidaten op gesprek en hoeveel gaan door<\/li>\n          <li>Conversie van eerste contact tot plaatsing<\/li>\n          <li>Doorlooptijden per fase zichtbaar<\/li>\n          <li>Een op een inzicht in uw volledige pipeline<\/li>\n          <li>Exporteerbaar voor directie of bestuur<\/li>\n        <\/ul>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- WERKWIJZE -->\n<section id=\"werkwijze\" class=\"section-wrap\">\n  <div class=\"inner\">\n    <div class=\"werkwijze-head reveal\">\n      <span class=\"eyebrow\">Hoe wij werken<\/span>\n      <h2 class=\"h2\">Van gesprek naar resultaat<\/h2>\n      <p class=\"lead\">In vier stappen van kennismaking naar een organisatie die volledig focust op werven.<\/p>\n    <\/div>\n\n    <div class=\"stappen\">\n      <div class=\"stap reveal\" data-delay=\"1\">\n        <div class=\"stap-nr\">01<\/div>\n        <span class=\"stap-meta\">30 minuten online<\/span>\n        <h3>Kennismaking<\/h3>\n        <p>We bespreken waar u nu staat en wat u wilt bereiken. Gratis en vrijblijvend.<\/p>\n      <\/div>\n      <div class=\"stap reveal\" data-delay=\"2\">\n        <div class=\"stap-nr\">02<\/div>\n        <span class=\"stap-meta\">Op locatie<\/span>\n        <h3>Analyse<\/h3>\n        <p>We komen langs en duiken live in uw OTYS omgeving. We brengen in kaart wat er beter kan.<\/p>\n      <\/div>\n      <div class=\"stap reveal\" data-delay=\"3\">\n        <div class=\"stap-nr\">03<\/div>\n        <span class=\"stap-meta\">Halve dag op locatie<\/span>\n        <h3>Aanpak<\/h3>\n        <p>We pakken de eerste verbeterpunten direct op en stellen samen de aanpak vast voor de komende periode.<\/p>\n      <\/div>\n      <div class=\"stap reveal\" data-delay=\"4\">\n        <div class=\"stap-nr\">04<\/div>\n        <span class=\"stap-meta\">Doorlopend<\/span>\n        <h3>Partnerschap<\/h3>\n        <p>We blijven aan boord. Periodiek op locatie, altijd bereikbaar. U werft. Wij zorgen dat alles werkt en blijft groeien.<\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- CONTACT -->\n<section id=\"contact\" class=\"section-wrap\">\n  <div class=\"inner\">\n    <div class=\"contact-grid\">\n      <div class=\"contact-info reveal\">\n        <span class=\"eyebrow\">Neem contact op<\/span>\n        <h2 class=\"h2\">Laat uw team focussen op werven.<\/h2>\n        <p class=\"lead\">Een gesprek van 30 minuten is genoeg om te weten of wij iets voor u kunnen betekenen. Gratis en zonder verplichtingen.<\/p>\n        <div class=\"c-detail\" style=\"margin-top:2rem;\">\n          <div class=\"c-icon\">&#x2709;&#xFE0F;<\/div>\n          <span>info@leanmain.nl<\/span>\n        <\/div>\n      <\/div>\n\n      <div class=\"contact-form-card reveal\" data-delay=\"2\">\n        <form id=\"contactForm\">\n          <div class=\"form-row\">\n            <div class=\"fgroup\">\n              <label for=\"voornaam\">Voornaam<\/label>\n              <input type=\"text\" id=\"voornaam\" name=\"voornaam\" placeholder=\"Jan\" required \/>\n            <\/div>\n            <div class=\"fgroup\">\n              <label for=\"achternaam\">Achternaam<\/label>\n              <input type=\"text\" id=\"achternaam\" name=\"achternaam\" placeholder=\"de Vries\" required \/>\n            <\/div>\n          <\/div>\n          <div class=\"fgroup\">\n            <label for=\"organisatie\">Organisatie<\/label>\n            <input type=\"text\" id=\"organisatie\" name=\"organisatie\" placeholder=\"Naam van uw organisatie\" \/>\n          <\/div>\n          <div class=\"fgroup\">\n            <label for=\"email\">E-mailadres<\/label>\n            <input type=\"email\" id=\"email\" name=\"email\" placeholder=\"jan@organisatie.nl\" required \/>\n          <\/div>\n          <div class=\"fgroup\">\n            <label for=\"dienst\">Waar kunt u hulp bij gebruiken?<\/label>\n            <select id=\"dienst\" name=\"dienst\">\n              <option value=\"\" disabled selected>Kies een optie<\/option>\n              <option>AI Assistenten<\/option>\n              <option>OTYS Beheer en Doorontwikkeling<\/option>\n              <option>Rapportages en Dashboards<\/option>\n              <option>Alles van het bovenstaande<\/option>\n              <option>Ik weet het nog niet<\/option>\n            <\/select>\n          <\/div>\n          <div class=\"fgroup\">\n            <label for=\"bericht\">Toelichting (optioneel)<\/label>\n            <textarea id=\"bericht\" name=\"bericht\" placeholder=\"Vertel ons kort over uw situatie...\"><\/textarea>\n          <\/div>\n          <button type=\"submit\" class=\"form-btn\">\n            Verstuur bericht &#x2192;\n          <\/button>\n        <\/form>\n        <div class=\"form-success\" id=\"formSuccess\">\n          &#x2713; Bedankt! We nemen zo snel mogelijk contact met u op.\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- FOOTER -->\n<footer>\n  <a href=\"\/#home\" class=\"footer-brand\">\n    <img decoding=\"async\" src=\"\/wp-content\/uploads\/logoleanmain.png\" alt=\"Leanmain\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex';\" \/>\n    <div class=\"footer-logo-fallback\">&#x1F7E1;<\/div>\n    Leanmain\n  <\/a>\n  <div class=\"footer-copy\">&#169; 2025 Leanmain &middot; Lean. AI. Main.<\/div>\n<\/footer>\n\n<script>\n  \/\/ Navbar scroll\n  const nav = document.getElementById('nav');\n  window.addEventListener('scroll', () => {\n    nav.classList.toggle('scrolled', window.scrollY > 60);\n  }, { passive: true });\n\n  \/\/ Mobile nav\n  function toggleNav() { document.body.classList.toggle('mobile-nav-open'); }\n  function closeNav()  { document.body.classList.remove('mobile-nav-open'); }\n\n  \/\/ Scroll reveal\n  (function() {\n    const obs = new IntersectionObserver(function(entries) {\n      entries.forEach(function(e) { if (e.isIntersecting) e.target.classList.add('in'); });\n    }, { threshold: 0.1 });\n    document.querySelectorAll('.reveal').forEach(function(el) { obs.observe(el); });\n  })();\n\n  \/\/ Smooth scroll\n  document.querySelectorAll('a[href^=\"#\"]').forEach(function(a) {\n    a.addEventListener('click', function(e) {\n      var t = document.querySelector(a.getAttribute('href'));\n      if (t) { e.preventDefault(); window.scrollTo({ top: t.getBoundingClientRect().top + window.scrollY - 80, behavior: 'smooth' }); }\n    });\n  });\n\n  \/\/ Contact form\n  document.getElementById('contactForm').addEventListener('submit', function(e) {\n    e.preventDefault();\n    var f = this;\n    var body = encodeURIComponent(\n      'Naam: ' + f.voornaam.value + ' ' + f.achternaam.value + '\\n' +\n      'Organisatie: ' + f.organisatie.value + '\\n' +\n      'E-mail: ' + f.email.value + '\\n' +\n      'Vraag over: ' + f.dienst.value + '\\n\\n' +\n      'Toelichting:\\n' + f.bericht.value\n    );\n    window.location.href = 'mailto:info@leanmain.nl?subject=' + encodeURIComponent('Contactverzoek via Leanmain') + '&body=' + body;\n    f.style.display = 'none';\n    document.getElementById('formSuccess').style.display = 'block';\n  });\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>&#x1F7E1; Leanmain Over ons Diensten Werkwijze Plan een gesprek Uw team werft. Wij regelen de rest. Uw mensen zijn aangenomen om te werven. Niet om systemen te beheren. Leanmain zorgt dat OTYS werkt, AI het werk verlicht en rapportages echt iets zeggen. Plan een gratis gesprek &#x2192; Wat wij doen Lean AI Main &#x1F7E1; OTYS [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-13","page","type-page","status-publish","hentry"],"post_meta_fields":{"_wp_page_template":["default","default"],"_edit_lock":["1773992799:1"]},"_links":{"self":[{"href":"https:\/\/leanmain-mijndomein.co.nl\/index.php?rest_route=\/wp\/v2\/pages\/13","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/leanmain-mijndomein.co.nl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/leanmain-mijndomein.co.nl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/leanmain-mijndomein.co.nl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/leanmain-mijndomein.co.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=13"}],"version-history":[{"count":2,"href":"https:\/\/leanmain-mijndomein.co.nl\/index.php?rest_route=\/wp\/v2\/pages\/13\/revisions"}],"predecessor-version":[{"id":20,"href":"https:\/\/leanmain-mijndomein.co.nl\/index.php?rest_route=\/wp\/v2\/pages\/13\/revisions\/20"}],"wp:attachment":[{"href":"https:\/\/leanmain-mijndomein.co.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=13"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}