/* Linear Design System — Kelie Corp Shared Styles */
/* Linear Design System — keliecorp.com */
        :root {
            --lbg: #0b1120;
            --lpanel: #111827;
            --lsurf: #1e293b;
            --lelev: #334155;
            --ltxt: #f1f5f9;
            --ltxt2: #cbd5e1;
            --ltxt3: #94a3b8;
            --ltxt4: #64748b;
            --laccent: #6366f1;
            --lhover: #818cf8;
            --llight: #a5b4fc;
            --lbd: rgba(148,163,184,0.12);
            --lbds: rgba(148,163,184,0.06);
            --lr6: 6px;
            --lr8: 8px;
            --lr12: 12px;
            --lglow: rgba(99,102,241,0.08);
        }
        * { margin: 0; padding: 0; box-sizing: border-box; }
        html { font-size: 16px; scroll-behavior: smooth; }
        body {
            font-family: 'Inter', system-ui, -apple-system, sans-serif;
            font-feature-settings: 'cv01', 'ss03';
            background: var(--lbg);
            color: var(--ltxt);
            line-height: 1.6;
            -webkit-font-smoothing: antialiased;
        }
        a { color: var(--lhover); text-decoration: none; }
        a:hover { color: var(--llight); }
        .container { max-width: 1120px; margin: 0 auto; padding: 0 24px; }

        /* Navigation */
        .lnav {
            position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
            background: rgba(11,17,32,0.85);
            backdrop-filter: blur(20px);
            border-bottom: 1px solid var(--lbds);
            padding: 0 24px;
        }
        .lnav-inner { max-width: 1120px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; height: 64px; }
        .lnav .logo { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ltxt); font-weight: 500; font-size: 1rem; letter-spacing: -0.01em; }
        .lnav .nav { display: flex; align-items: center; gap: 2px; }
        .lnav .nav a { padding: 6px 14px; color: var(--ltxt2); text-decoration: none; font-size: 0.875rem; font-weight: 500; border-radius: var(--lr6); transition: all .15s; letter-spacing: -0.01em; }
        .lnav .nav a:hover { color: var(--ltxt); background: rgba(255,255,255,0.04); }
        .lnav .nav-cta { background: var(--laccent); color: #fff !important; padding: 6px 16px !important; font-weight: 500 !important; border-radius: var(--lr6) !important; }
        .lnav .nav-cta:hover { background: var(--lhover) !important; }

        /* Hero */
        .lhero { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 120px 24px 80px; position: relative; overflow: hidden; background: var(--lbg); }
        .lhero-glow { position: absolute; top: 30%; left: 50%; width: 800px; height: 800px; transform: translate(-50%,-50%); background: radial-gradient(circle,var(--lglow) 0%,transparent 70%); pointer-events: none; }
        .lhero-content { max-width: 800px; margin: 0 auto; text-align: center; position: relative; z-index: 1; }
        .lhero-badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; background: rgba(255,255,255,0.04); border: 1px solid var(--lbd); border-radius: 9999px; font-size: .8125rem; color: var(--ltxt3); font-weight: 500; letter-spacing: -.01em; margin-bottom: 32px; }
        .lhero-badge-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--laccent); display: inline-block; }
        .lhero-title { font-size: clamp(2rem,5vw,3.5rem); font-weight: 510; line-height: 1.1; letter-spacing: -.03em; color: var(--ltxt); margin-bottom: 20px; }
        .lhero-title-accent { background: linear-gradient(135deg,var(--ltxt),var(--llight)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
        .lhero-subtitle { font-size: clamp(1rem,2.5vw,1.125rem); font-weight: 400; line-height: 1.6; color: var(--ltxt3); margin-bottom: 40px; letter-spacing: -.01em; max-width: 600px; margin-left: auto; margin-right: auto; }
        .lhero-btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
        .lbtn-p { display: inline-flex; align-items: center; gap: 8px; padding: 10px 24px; background: var(--laccent); color: #fff; font-size: .9375rem; font-weight: 500; border-radius: var(--lr6); transition: all .15s; letter-spacing: -.01em; }
        .lbtn-p:hover { background: var(--lhover); color: #fff !important; }
        .lbtn-g { display: inline-flex; align-items: center; gap: 8px; padding: 10px 24px; background: rgba(255,255,255,0.02); color: var(--ltxt2); font-size: .9375rem; font-weight: 500; border-radius: var(--lr6); border: 1px solid var(--lbd); transition: all .15s; letter-spacing: -.01em; }
        .lbtn-g:hover { background: rgba(255,255,255,0.04); color: var(--ltxt) !important; }

        /* Stats */
        .lstats { display: flex; align-items: center; justify-content: center; gap: 40px; margin-top: 60px; }
        .lstat { text-align: center; }
        .lstat-num { font-size: 1.5rem; font-weight: 510; color: var(--ltxt); letter-spacing: -.02em; }
        .lstat-label { font-size: .8125rem; color: var(--ltxt4); margin-top: 4px; }
        .lstat-dv { width: 1px; height: 40px; background: var(--lbds); }

        /* Sections */
        .lsection { padding: 100px 0; border-top: 1px solid var(--lbds); }
        .lsection-hdr { text-align: center; margin-bottom: 56px; }
        .lsection-lbl { font-size: .75rem; font-weight: 510; color: var(--lhover); letter-spacing: .05em; text-transform: uppercase; margin-bottom: 12px; display: inline-block; }
        .lsection-title { font-size: clamp(1.5rem,3vw,2rem); font-weight: 510; letter-spacing: -.02em; color: var(--ltxt); margin-bottom: 12px; }
        .lsection-desc { font-size: 1rem; color: var(--ltxt3); max-width: 500px; margin: 0 auto; }

        /* Cards */
        .lgrid { display: grid; grid-template-columns: repeat(auto-fill,minmax(300px,1fr)); gap: 16px; }
        .lcard { background: rgba(255,255,255,0.02); border: 1px solid var(--lbd); border-radius: var(--lr12); padding: 28px; transition: all .2s; }
        .lcard:hover { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.12); }
        .lcard-icon { width: 40px; height: 40px; margin-bottom: 16px; }
        .lcard h3 { font-size: 1.125rem; font-weight: 590; color: var(--ltxt); letter-spacing: -.01em; margin-bottom: 8px; }
        .lcard p { font-size: .875rem; color: var(--ltxt3); line-height: 1.6; margin-bottom: 16px; }
        .lcard-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
        .lcard-tag { padding: 3px 10px; background: rgba(255,255,255,0.04); border: 1px solid var(--lbd); border-radius: 9999px; font-size: .75rem; font-weight: 500; color: var(--ltxt2); }
        .lcard-ft { padding-top: 16px; border-top: 1px solid var(--lbds); font-size: .8125rem; color: var(--ltxt4); line-height: 1.6; }
        .lcard-price { font-size: .875rem; font-weight: 590; color: var(--llight); margin-bottom: 12px; }
        .lcard-steps { font-size: .75rem; color: var(--ltxt3); line-height: 1.6; }
        .lcard-steps strong { color: var(--ltxt2); font-weight: 510; }

        /* Why Us */
        .lwhy-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(260px,1fr)); gap: 16px; max-width: 900px; margin: 0 auto; }
        .lwhy { background: rgba(255,255,255,0.02); border: 1px solid var(--lbd); border-radius: var(--lr12); padding: 28px 24px; text-align: center; transition: all .2s; }
        .lwhy:hover { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.12); }
        .lwhy-icon { font-size: 1.75rem; margin-bottom: 12px; }
        .lwhy h3 { font-size: .9375rem; font-weight: 590; color: var(--ltxt); margin-bottom: 8px; letter-spacing: -.01em; }
        .lwhy p { font-size: .8125rem; color: var(--ltxt3); line-height: 1.7; }

        /* About */
        .labout { padding-top: 40px; border-top: 1px solid var(--lbds); }
        .labout-text { color: var(--ltxt3); font-size: .9375rem; line-height: 1.8; margin-bottom: 32px; max-width: 700px; margin-left: auto; margin-right: auto; text-align: center; }
        .labout-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; max-width: 700px; margin: 0 auto 28px; }
        .labout-stat { background: rgba(255,255,255,0.02); border: 1px solid var(--lbd); border-radius: var(--lr8); padding: 24px; text-align: center; }
        .labout-stat-num { font-size: 1.75rem; font-weight: 590; color: var(--laccent); margin-bottom: 4px; }
        .labout-stat-lbl { font-size: .8125rem; color: var(--ltxt4); }
        .labout-cta { background: rgba(255,255,255,0.02); border: 1px solid var(--lbd); border-radius: var(--lr8); padding: 24px; text-align: center; max-width: 700px; margin: 0 auto; }
        .labout-cta p { color: var(--ltxt3); font-size: .875rem; line-height: 1.8; margin-bottom: 16px; }
        .labout-cta strong { color: var(--ltxt2); }

        /* Tech */
        .ltech-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(110px,1fr)); gap: 12px; }
        .ltech { background: rgba(255,255,255,0.02); border: 1px solid var(--lbd); border-radius: var(--lr8); padding: 20px 12px; text-align: center; transition: all .2s; }
        .ltech:hover { background: rgba(255,255,255,0.04); }
        .ltech-icon { font-size: 1.5rem; margin-bottom: 8px; }
        .ltech-lbl { font-size: .8125rem; font-weight: 500; color: var(--ltxt2); }
        .ltech-desc { font-size: .6875rem; color: var(--ltxt4); margin-top: 2px; }

        /* FAQ */
        .lfaq { max-width: 700px; margin: 0 auto; }
        .lfaq-item { border-bottom: 1px solid var(--lbds); }
        .lfaq-q { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 20px 0; background: none; border: none; color: var(--ltxt2); font-size: .9375rem; font-weight: 500; cursor: pointer; text-align: left; letter-spacing: -.01em; }
        .lfaq-q:hover { color: var(--ltxt); }
        .lfaq-q svg { width: 16px; height: 16px; transition: transform .2s; flex-shrink: 0; }
        .lfaq-q.open svg { transform: rotate(180deg); }
        .lfaq-a { max-height: 0; overflow: hidden; transition: max-height .3s; }
        .lfaq-a-inner { padding: 0 0 20px; font-size: .875rem; color: var(--ltxt3); line-height: 1.7; }

        /* Contact */
        .lcontact-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(200px,1fr)); gap: 12px; max-width: 700px; margin: 0 auto; }
        .lcontact { background: rgba(255,255,255,0.02); border: 1px solid var(--lbd); border-radius: var(--lr8); padding: 24px; text-align: center; transition: all .2s; cursor: pointer; }
        .lcontact:hover { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.12); }
        .lcontact-icon { font-size: 1.5rem; margin-bottom: 8px; }
        .lcontact-lbl { font-size: .75rem; color: var(--ltxt4); }
        .lcontact-val { font-size: .9375rem; font-weight: 500; color: var(--ltxt2); margin-top: 4px; }

        /* Footer */
        .lfooter { text-align: center; padding: 48px 24px; border-top: 1px solid var(--lbds); }
        .lfooter-brand { font-weight: 500; color: var(--ltxt2); margin-bottom: 16px; }
        .lfooter-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 16px; margin-bottom: 16px; }
        .lfooter-links a { font-size: .8125rem; color: var(--ltxt3); }
        .lfooter-links a:hover { color: var(--ltxt); }
        .lfooter-copy { font-size: .75rem; color: var(--ltxt4); }
        .lfooter-copy a { color: var(--ltxt4); }

        /* Mobile */
        @media (max-width: 768px) {
            .lnav .nav a:not(.nav-cta) { display: none; }
            .lhero { padding: 100px 20px 60px; }
            .lstats { gap: 24px; }
            .labout-grid { grid-template-columns: 1fr; }
            .lcontact-grid { grid-template-columns: 1fr; }
        }

        /* Hamburger */
        .ham { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 8px; }
        .ham span { display: block; width: 22px; height: 2px; background: var(--ltxt2); border-radius: 2px; transition: all .2s; }
        @media (max-width: 768px) { .ham { display: flex; } }
