/* service_ai_ml.html — extracted internal + inline styles */

    /* ---- page + nav theming ---- */
    /* Same technique as the homepage hero: make the header transparent and pull the
       hero up beneath it, so the hero's OWN background (grid + orbs + #05060f) runs
       continuously behind the navbar. This removes the header/hero seam entirely. */
    .bg-ai-dark { background: transparent !important; position: relative; z-index: 4; }
    .ai-hero { margin-top: -120px; padding-top: 120px; }
    .bg-ai-dark .navbar .nav-link { color: rgba(255,255,255,.82) !important; }
    .bg-ai-dark .navbar .nav-link:hover { color:#fff !important; }
    .bg-ai-dark .navbar .social-muted a, .bg-ai-dark .navbar .tk-social a { color: rgba(255,255,255,.7) !important; }
    .bg-ai-dark .navbar .hamburger span,
    .bg-ai-dark .navbar .hamburger span:before,
    .bg-ai-dark .navbar .hamburger span:after { background:#fff !important; }

    /* ---- logo: use the real white logo, and keep it white on the sticky header ---- */
    /* Show the light (white) logo everywhere on this dark page; never the dark one.
       (Unlike the default sticky behaviour that swaps in the dark logo.) */
    .tk-logo-dark { display: none; }
    .tk-logo-light { display: inline-block; }
    .navbar-clone .tk-logo-dark { display: none; }
    .navbar-clone .tk-logo-light { display: inline-block; }

    /* The theme's sticky bar is translucent WHITE (.navbar-stick:not(.navbar-dark)),
       which would hide a white logo. Keep the sticky bar dark on this page so the
       white logo + nav links stay visible. Scoped here → this page only. */
    .navbar-clone.navbar-stick {
        background: rgba(5,6,15,.88) !important;
        -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
        box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.4) !important;
    }
    .navbar-clone .nav-link { color: rgba(255,255,255,.82) !important; }
    .navbar-clone .nav-link:hover { color:#fff !important; }
    .navbar-clone .social-muted a, .navbar-clone .tk-social a { color: rgba(255,255,255,.7) !important; }
    .navbar-clone .hamburger span,
    .navbar-clone .hamburger span:before,
    .navbar-clone .hamburger span:after { background:#fff !important; }

    /* ---- section base ---- */
    .ai-wrap { position:relative; background:#05060f; color:#a2a8c9; overflow:hidden; }
    .ai-wrap h1,.ai-wrap h2,.ai-wrap h3,.ai-wrap h4,.ai-wrap h5,.ai-wrap h6 { color:#fff; }
    .ai-wrap .lead { color:#aab0d0; }
    .ai-alt { background:#080a18; }
    .ai-eyebrow { letter-spacing:.16em; text-transform:uppercase; font-size:.78rem; font-weight:700; color:#7f88c4; }
    .ai-grad { background:linear-gradient(100deg,#a78bfa 0%,#22d3ee 55%,#60a5fa 100%);
        -webkit-background-clip:text; background-clip:text; color:transparent; }
    .ai-badge { display:inline-flex; align-items:center; gap:.5rem; background:rgba(139,92,246,.12);
        border:1px solid rgba(139,92,246,.4); color:#c4b5fd; border-radius:2rem; padding:.42rem 1.05rem; font-weight:600; font-size:.9rem; }
    .ai-dot { width:.5rem; height:.5rem; border-radius:50%; background:#a78bfa; box-shadow:0 0 0 0 rgba(167,139,250,.7); animation:aipulse 1.7s infinite; }
    @keyframes aipulse { 70%{box-shadow:0 0 0 .5rem rgba(167,139,250,0);} 100%{box-shadow:0 0 0 0 rgba(167,139,250,0);} }

    /* ---- backdrop fx ---- */
    .ai-grid-bg { position:absolute; inset:0; z-index:0; pointer-events:none;
        background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
        background-size:46px 46px;
        -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000 30%,transparent 72%);
        mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000 30%,transparent 72%); }
    .ai-orb { position:absolute; border-radius:50%; filter:blur(70px); opacity:.5; z-index:0; pointer-events:none; animation:aifloat 15s ease-in-out infinite; }
    @keyframes aifloat { 0%,100%{transform:translate(0,0);} 50%{transform:translate(24px,-32px);} }

    /* ---- buttons ---- */
    .ai-btn-primary { background:linear-gradient(100deg,#7c3aed,#2563eb); border:0; color:#fff; box-shadow:0 .8rem 2.2rem rgba(124,58,237,.45); }
    .ai-btn-primary:hover { color:#fff; filter:brightness(1.09); }
    .ai-btn-ghost { border:1px solid rgba(255,255,255,.28); color:#fff; }
    .ai-btn-ghost:hover { border-color:#fff; color:#fff; background:rgba(255,255,255,.06); }

    /* ---- glass cards ---- */
    .ai-card { background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.09); border-radius:1.25rem;
        backdrop-filter:blur(8px); transition:transform .35s ease, border-color .35s ease, box-shadow .35s ease; height:100%; }
    .ai-card:hover { transform:translateY(-.5rem); border-color:rgba(139,92,246,.55); box-shadow:0 1.6rem 3.6rem rgba(124,58,237,.24); }
    .ai-ic { width:3.2rem; height:3.2rem; border-radius:.9rem; display:flex; align-items:center; justify-content:center; font-size:1.35rem; color:#fff; }
    .g-violet{background:linear-gradient(135deg,#8b5cf6,#6d28d9);} .g-cyan{background:linear-gradient(135deg,#22d3ee,#0891b2);}
    .g-blue{background:linear-gradient(135deg,#60a5fa,#2563eb);} .g-pink{background:linear-gradient(135deg,#f472b6,#db2777);}
    .g-amber{background:linear-gradient(135deg,#fbbf24,#f59e0b);} .g-green{background:linear-gradient(135deg,#34d399,#059669);}
    .g-indigo{background:linear-gradient(135deg,#818cf8,#4338ca);} .g-red{background:linear-gradient(135deg,#fb7185,#e11d48);}

    /* ---- agent console mock ---- */
    .ai-console { background:linear-gradient(180deg,rgba(22,24,50,.92),rgba(9,10,24,.94)); border:1px solid rgba(255,255,255,.11);
        border-radius:1.3rem; box-shadow:0 2.6rem 6rem rgba(88,28,235,.4); overflow:hidden;
        font-family:'SFMono-Regular',ui-monospace,Menlo,Consolas,monospace; }
    .ai-console__bar { display:flex; align-items:center; gap:.4rem; padding:.75rem 1rem; background:rgba(255,255,255,.04); border-bottom:1px solid rgba(255,255,255,.08); }
    .ai-console__bar b { margin-left:.6rem; color:#8b93c9; font-size:.72rem; font-weight:600; }
    .ai-cdot { width:.6rem; height:.6rem; border-radius:50%; }
    .ai-console__body { padding:1.1rem 1.15rem; font-size:.78rem; line-height:1.75; }
    .ai-msg-u { background:rgba(96,165,250,.14); border:1px solid rgba(96,165,250,.3); color:#dbe6ff; border-radius:.7rem; padding:.5rem .7rem; margin-bottom:.7rem; }
    .ai-step { color:#8b93c9; margin:.2rem 0; }
    .ai-step.ok { color:#5eead4; }
    .ai-toolc { display:inline-block; color:#67e8f9; background:rgba(34,211,238,.1); border:1px solid rgba(34,211,238,.25);
        border-radius:.4rem; padding:.05rem .5rem; margin:.15rem 0; font-size:.72rem; }
    .ai-msg-a { margin-top:.7rem; color:#e7eaff; background:linear-gradient(100deg,rgba(139,92,246,.14),rgba(34,211,238,.1));
        border:1px solid rgba(139,92,246,.32); border-radius:.7rem; padding:.55rem .7rem; }
    .ai-cursor { display:inline-block; width:.5rem; height:.85rem; background:#a78bfa; vertical-align:-1px; animation:aiblink 1.1s steps(1) infinite; }
    @keyframes aiblink { 50%{opacity:0;} }

    /* ---- misc ---- */
    .ai-metric h3 { color:#fff; }
    .ai-hr { height:1px; border:0; background:linear-gradient(90deg,transparent,rgba(139,92,246,.6),transparent); }
    .ai-chip { display:inline-flex; align-items:center; gap:.45rem; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.11);
        color:#d7dbf0; border-radius:2rem; padding:.5rem 1rem; font-weight:600; font-size:.84rem; margin:.3rem; transition:border-color .3s; }
    .ai-chip:hover { border-color:rgba(34,211,238,.55); }
    .ai-loop { width:3.4rem; height:3.4rem; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
        color:#fff; font-size:1.2rem; box-shadow:0 .7rem 1.6rem rgba(124,58,237,.35); }
    .ai-ind { background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.09); border-radius:1rem; padding:1.1rem 1rem;
        text-align:center; transition:transform .3s, border-color .3s; height:100%; }
    .ai-ind:hover { transform:translateY(-.35rem); border-color:rgba(34,211,238,.45); }
    .ai-ind i { font-size:1.6rem; }
    .ai-node-num { font-size:1.05rem; font-weight:800; color:#fff; width:2.9rem; height:2.9rem; border-radius:50%;
        display:inline-flex; align-items:center; justify-content:center; box-shadow:0 .7rem 1.6rem rgba(124,58,237,.3); }
    /* dark FAQ accordion */
    .ai-wrap .accordion .card { background:transparent; }
    .ai-wrap .accordion-item { border:1px solid rgba(255,255,255,.09) !important; border-radius:.8rem !important; margin-bottom:.8rem; overflow:hidden; }
    .ai-wrap .accordion .card-header { background:transparent; }
    .ai-wrap .accordion-button, .ai-wrap .card-header button { color:#fff !important; background:transparent !important; box-shadow:none !important; }
    .ai-wrap .accordion .card-body p { color:#9aa0c0; }
    /* glass testimonial */
    .ai-wrap blockquote p { color:#c7cbe0; }
    .ai-wrap blockquote h5 { color:#fff; }

/* ---- generated classes for inline styles ---- */
.gen-1 { width:28rem;height:28rem;background:radial-gradient(circle,#7c3aed,transparent 70%);top:-9rem;left:-7rem; }
.gen-2 { width:24rem;height:24rem;background:radial-gradient(circle,#06b6d4,transparent 70%);bottom:-9rem;right:-5rem;animation-delay:-7s; }
.gen-3 { z-index:2; }
.gen-4 { width:20rem;height:20rem;background:radial-gradient(circle,#2563eb,transparent 70%);top:10%;left:15%;opacity:.35; }
.gen-5 { z-index:1; }
.gen-6 { background:#ff5f57; }
.gen-7 { background:#febc2e; }
.gen-8 { background:#28c840; }
.gen-9 { width:22rem;height:22rem;background:radial-gradient(circle,#7c3aed,transparent 70%);top:20%;right:-8rem;opacity:.3; }
.gen-10 { width:22rem;height:22rem;background:radial-gradient(circle,#06b6d4,transparent 70%);top:-6rem;left:-6rem;opacity:.3; }
.gen-11 { color:#67e8f9;font-size:1.3rem; }
.gen-12 { width:3.8rem;height:3.8rem; }
.gen-13 { width:22rem;height:22rem;background:radial-gradient(circle,#db2777,transparent 70%);bottom:-6rem;right:-6rem;opacity:.28; }
.gen-14 { font-family:inherit; }
.gen-15 { width:24rem;height:24rem;background:radial-gradient(circle,#2563eb,transparent 70%);top:10%;left:-8rem;opacity:.28; }
.gen-16 { font-size:2.4rem;font-weight:800; }
.gen-17 { width:26rem;height:26rem;background:radial-gradient(circle,#7c3aed,transparent 70%);top:-8rem;left:20%;opacity:.3; }
.gen-18 { height: 130px; }
