* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
        :root {
            --bg: #0a0a0a;
            --card: #141414;
            --card-hover: #1a1a1a;
            --border: #1e1e1e;
            --accent: #06b6d4;
            --accent2: #8b5cf6;
            --text: #f0f0f0;
            --muted: #777;
            --green: #22c55e;
        }
        body { font-family: "Inter", -apple-system, sans-serif; background: var(--bg); color: var(--text); min-height: 100vh; display: flex; flex-direction: column; align-items: center; }
        .card { width: 100%; max-width: 420px; min-height: 100vh; }

        /* Hero */
        .hero { background: linear-gradient(160deg, rgba(12,18,32,0.92) 0%, rgba(22,32,50,0.88) 40%, rgba(12,18,32,0.95) 100%), url('hero-bg.jpg') center/cover no-repeat; padding: 40px 24px 28px; text-align: center; position: relative; overflow: hidden; }
        .hero::before { content: ''; position: absolute; top: -40%; left: -40%; width: 180%; height: 180%; background: radial-gradient(circle at 30% 50%, rgba(6,182,212,0.08) 0%, transparent 50%), radial-gradient(circle at 70% 30%, rgba(139,92,246,0.07) 0%, transparent 50%); animation: drift 10s ease-in-out infinite alternate; }
        .hero::after { content: '✦'; position: absolute; font-size: 10px; color: rgba(6,182,212,0.3); top: 20%; right: 15%; animation: sparkle 3s ease-in-out infinite; }
        @keyframes sparkle { 0%,100% { opacity: 0; transform: scale(0.5) rotate(0deg); } 50% { opacity: 1; transform: scale(1.2) rotate(180deg); } }
        @keyframes drift { 0% { transform: translate(-5%,-5%); } 100% { transform: translate(5%,5%); } }

        .badge { display: inline-flex; align-items: center; gap: 6px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 20px; padding: 5px 14px; font-size: 11px; font-weight: 600; letter-spacing: 0.04em; color: #aaa; margin-bottom: 20px; position: relative; z-index: 1; }
        .badge .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); animation: pulse 2s ease-in-out infinite; }
        @keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:0.3; } }
        .lang-bar { position: absolute; top: 12px; left: 16px; right: 16px; display: flex; justify-content: space-between; align-items: center; z-index: 10; gap: 8px; }
        .lang-bar button { background: transparent; border: 1px solid #06b6d4; color: #06b6d4; padding: 6px 14px; border-radius: 6px; font-size: 13px; font-weight: 700; cursor: pointer; transition: all 0.2s; min-height: 32px; min-width: 44px; }
        .lang-bar button.active { background: #06b6d4; color: #fff; border-color: #06b6d4; }

        .avatar-wrap { width: 110px; height: 110px; border-radius: 50%; background: conic-gradient(from 0deg, var(--accent), var(--accent2), var(--accent)); padding: 3px; margin: 0 auto 16px; position: relative; z-index: 1; animation: avatarSpin 4s linear infinite; }
        @keyframes avatarSpin { from { background: conic-gradient(from 0deg, var(--accent), var(--accent2), var(--accent)); } to { background: conic-gradient(from 360deg, var(--accent), var(--accent2), var(--accent)); } }
        .avatar-wrap img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 3px solid var(--bg); }

        .hero h1 { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; position: relative; z-index: 1; background: linear-gradient(135deg, #fff 0%, var(--accent) 50%, #fff 100%); background-size: 200% auto; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: nameShine 4s ease-in-out infinite; }
        @keyframes nameShine { 0%,100% { background-position: 0% center; } 50% { background-position: 200% center; } }
        .hero .subtitle { font-size: 13px; color: var(--accent); font-weight: 600; margin-top: 4px; position: relative; z-index: 1; }
        .hero .tagline { font-size: 12px; color: var(--muted); margin-top: 6px; position: relative; z-index: 1; }
        .lang-tag { display: inline-flex; align-items: center; gap: 4px; background: rgba(6,182,212,0.1); border: 1px solid rgba(6,182,212,0.2); border-radius: 12px; padding: 3px 10px; font-size: 11px; color: var(--accent); font-weight: 600; margin-top: 10px; position: relative; z-index: 1; }

        /* Stats bar */
        .stats { display: flex; justify-content: center; gap: 32px; padding: 16px 24px; border-bottom: 1px solid var(--border); }
        .stat { text-align: center; }
        .stat .num { font-size: 18px; font-weight: 800; color: var(--accent); }
        .stat .num.shimmer { background: linear-gradient(90deg, var(--accent) 0%, #fff 50%, var(--accent) 100%); background-size: 200% auto; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shimmer 3s linear infinite; }
        @keyframes shimmer { to { background-position: -200% center; } }
        .stat .label { font-size: 10px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.08em; margin-top: 2px; }

        /* Save Contact */
        .save-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: calc(100% - 48px); margin: -8px auto 0; padding: 14px; background: linear-gradient(135deg, var(--accent), #0891b2); color: #000; font-size: 15px; font-weight: 700; border: none; border-radius: 14px; cursor: pointer; position: relative; z-index: 2; box-shadow: 0 4px 24px rgba(6,182,212,0.3); transition: transform 0.15s; animation: saveBounce 3s ease-in-out infinite; }
        .save-btn:active { transform: scale(0.97); animation: none; }
        @keyframes saveBounce { 0%,85%,100% { transform: translateY(0); } 90% { transform: translateY(-4px); } 95% { transform: translateY(0); } }

        /* Quick Actions */
        .actions { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 24px 24px 12px; }
        .action { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 4px; background: var(--card); border: 1px solid var(--border); border-radius: 14px; text-decoration: none; color: var(--text); font-size: 11px; font-weight: 500; transition: all 0.15s; }
        .action:active { transform: scale(0.95); background: var(--card-hover); }
        .action .ic { font-size: 22px; height: 28px; display: flex; align-items: center; transition: transform 0.3s; }
        .action:hover .ic { transform: scale(1.2) translateY(-2px); }

        /* Links */
        .section-label { padding: 16px 24px 8px; font-size: 13px; font-weight: 700; color: #ddd; text-transform: uppercase; letter-spacing: 0.1em; position: relative; }
        .section-label::after { content: ''; position: absolute; bottom: 2px; left: 24px; width: 30px; height: 2px; background: var(--accent); border-radius: 2px; opacity: 0.5; }
        .links { padding: 0 24px 8px; display: flex; flex-direction: column; gap: 8px; }
        .link { display: flex; align-items: center; gap: 14px; padding: 14px 16px; background: var(--card); border: 1px solid var(--border); border-radius: 14px; text-decoration: none; color: var(--text); transition: all 0.15s; }
        .link:active { transform: scale(0.98); background: var(--card-hover); }
        .link:hover .li { transform: scale(1.15) rotate(5deg); transition: transform 0.3s; }
        .link:hover .arr { transform: translateX(4px); transition: transform 0.2s; }
        .link .li { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; overflow: hidden; }
        .link .li img { width: 28px; height: 28px; object-fit: contain; }
        .link .lt h3 { font-size: 14px; font-weight: 600; }
        .link .lt p { font-size: 11px; color: var(--muted); margin-top: 1px; }
        .link .arr { margin-left: auto; color: #333; font-size: 18px; }

        .bg-cyan { background: rgba(6,182,212,0.12); }
        .bg-green { background: rgba(34,197,94,0.12); }
        .bg-purple { background: rgba(139,92,246,0.12); }
        .bg-orange { background: rgba(249,115,22,0.12); }
        .bg-pink { background: rgba(236,72,153,0.12); }
        .bg-blue { background: rgba(59,130,246,0.12); }
        .bg-yellow { background: rgba(234,179,8,0.12); }

        /* Socials */
        .socials { display: flex; justify-content: center; gap: 12px; padding: 16px 24px; }
        .socials { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; padding: 16px 24px; }
        .soc { width: auto; height: auto; border-radius: 14px; display: flex; align-items: center; gap: 12px; padding: 14px 16px; font-size: 22px; text-decoration: none; border: 1px solid var(--border); background: var(--card); transition: all 0.15s; color: var(--text); }
        .soc:active { transform: scale(0.95); background: var(--card-hover); }
        .soc .soc-name { font-size: 13px; font-weight: 600; }
        .soc img.soc-icon { width: 24px; height: 24px; object-fit: contain; }

        /* Testimonial */
        .testimonial { margin: 8px 24px; padding: 20px; background: var(--card); border: 1px solid var(--border); border-radius: 14px; text-align: center; }
        .testimonial .stars { font-size: 16px; margin-bottom: 8px; }
        .testimonial .quote { font-size: 13px; color: #bbb; font-style: italic; line-height: 1.5; }
        .testimonial .author { font-size: 11px; color: var(--muted); margin-top: 8px; }

        /* Review Slider */
        .review-slider { margin: 8px 24px; padding: 20px; background: var(--card); border: 1px solid var(--border); border-radius: 14px; text-align: center; position: relative; min-height: 160px; }
        .review-card { animation: fadeIn 0.5s ease; }
        @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
        .review-card .stars { font-size: 14px; margin-bottom: 8px; }
        .review-card .quote { font-size: 13px; color: #bbb; font-style: italic; line-height: 1.5; }
        .review-card .author { font-size: 12px; color: var(--accent); margin-top: 10px; font-weight: 600; }
        .review-dots { display: flex; justify-content: center; gap: 6px; margin-top: 14px; }
        .review-dots .dot { width: 8px; height: 8px; border-radius: 50%; background: #333; cursor: pointer; transition: all 0.2s; }
        .review-dots .dot.active { background: var(--accent); width: 20px; border-radius: 4px; }

        /* AI Glow */
        @keyframes aiGlow { 0%,100% { box-shadow: 0 4px 24px rgba(139,92,246,0.4); } 50% { box-shadow: 0 8px 40px rgba(139,92,246,0.7), 0 0 20px rgba(139,92,246,0.3); } }

        /* Text HOME CTA */
        .cta-home { display: flex; align-items: center; justify-content: center; gap: 8px; width: calc(100% - 48px); margin: 12px auto; padding: 16px; background: linear-gradient(135deg, #22c55e, #16a34a); color: #fff; font-size: 15px; font-weight: 700; border: none; border-radius: 14px; cursor: pointer; text-decoration: none; text-align: center; animation: ctaPulse 1.8s ease-in-out infinite; position: relative; overflow: hidden; }
        .cta-home::before { content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: linear-gradient(45deg, transparent 30%, rgba(255,255,255,0.15) 50%, transparent 70%); animation: ctaSweep 2.5s ease-in-out infinite; }
        .cta-home:active { transform: scale(0.95); animation: none; }
        @keyframes ctaPulse { 0%,100% { box-shadow: 0 4px 20px rgba(34,197,94,0.3), 0 0 0 0 rgba(34,197,94,0.4); transform: scale(1); } 50% { box-shadow: 0 8px 40px rgba(34,197,94,0.6), 0 0 20px 4px rgba(34,197,94,0.3); transform: scale(1.04); } }
        @keyframes ctaSweep { 0% { transform: translateX(-100%) rotate(45deg); } 40%,100% { transform: translateX(100%) rotate(45deg); } }
        .cta-home .cta-sub { font-size: 11px; font-weight: 400; opacity: 0.9; }

        /* Lead Form Modal */
        .lead-fab { position: fixed; bottom: 20px; left: 20px; width: 44px; height: 44px; border-radius: 50%; background: var(--green); border: none; color: #fff; font-size: 20px; cursor: pointer; box-shadow: 0 4px 16px rgba(34,197,94,0.4); display: flex; align-items: center; justify-content: center; z-index: 100; animation: fabPulse 3s ease-in-out infinite; }
        .lead-fab:active { transform: scale(0.9); }
        .lead-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); z-index: 200; justify-content: center; align-items: flex-end; backdrop-filter: blur(4px); }
        .lead-overlay.show { display: flex; }
        .lead-modal { width: 100%; max-width: 420px; background: var(--card); border-top-left-radius: 20px; border-top-right-radius: 20px; padding: 24px; animation: slideUp 0.3s ease; }
        @keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
        .lead-modal .close-form { position: absolute; top: 16px; right: 20px; background: none; border: none; color: #999; font-size: 24px; cursor: pointer; }
        .lead-modal h3 { font-size: 16px; font-weight: 700; text-align: center; margin-bottom: 14px; color: var(--text); }
        .lead-modal input, .lead-modal textarea { width: 100%; padding: 12px 14px; margin-bottom: 10px; background: var(--bg); border: 1px solid var(--border); border-radius: 10px; color: var(--text); font-size: 14px; font-family: inherit; }
        .lead-modal textarea { resize: vertical; min-height: 70px; }
        .lead-modal .submit-btn { width: 100%; padding: 14px; background: var(--accent); color: #000; border: none; border-radius: 12px; font-size: 15px; font-weight: 700; cursor: pointer; }
        .lead-modal .form-msg { text-align: center; font-size: 13px; color: var(--green); margin-top: 10px; display: none; }

        /* QR Code */
        .qr-section { text-align: center; padding: 16px 24px; }
        .qr-btn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; background: var(--card); border: 1px solid var(--border); border-radius: 14px; color: var(--text); font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.15s; }
        .qr-btn:active { transform: scale(0.97); }
        .qr-modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.85); z-index: 200; justify-content: center; align-items: center; flex-direction: column; gap: 16px; }
        .qr-modal.show { display: flex; }
        .qr-modal img { width: 250px; height: 250px; border-radius: 16px; background: white; padding: 16px; }
        .qr-modal .close-qr { background: var(--accent); color: #000; border: none; padding: 10px 24px; border-radius: 10px; font-weight: 700; cursor: pointer; font-size: 14px; }

        /* Footer */
        .footer { text-align: center; padding: 24px; font-size: 11px; color: #333; }
        .footer a { color: var(--accent); text-decoration: none; font-weight: 600; }

        /* Share FAB */
        .fab { position: fixed; bottom: 20px; right: 20px; width: 44px; height: 44px; border-radius: 50%; background: var(--accent); border: none; color: #000; font-size: 18px; cursor: pointer; box-shadow: 0 4px 16px rgba(6,182,212,0.4); display: flex; align-items: center; justify-content: center; z-index: 100; animation: fabPulse 3s ease-in-out infinite; }
        .fab:active { transform: scale(0.9); animation: none; }
        @keyframes fabPulse { 0%,100% { box-shadow: 0 4px 16px rgba(6,182,212,0.4); } 50% { box-shadow: 0 4px 24px rgba(6,182,212,0.7), 0 0 12px rgba(6,182,212,0.3); } }

        /* Animations */
        .fi { opacity: 0; transform: translateY(16px); animation: fi 0.4s ease forwards; }
        @keyframes fi { to { opacity: 1; transform: translateY(0); } }
        .d1{animation-delay:.05s} .d2{animation-delay:.1s} .d3{animation-delay:.15s} .d4{animation-delay:.2s} .d5{animation-delay:.25s} .d6{animation-delay:.3s} .d7{animation-delay:.35s} .d8{animation-delay:.4s}

        /* Scroll-triggered staggered links */
        .scroll-reveal { opacity: 0; transform: translateY(20px); transition: opacity 0.4s ease, transform 0.4s ease; }
        .scroll-reveal.visible { opacity: 1; transform: translateY(0); }

        /* Star twinkle */
        @keyframes twinkle { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.5; transform: scale(1.3); } }
        .review-card .stars span { display: inline-block; animation: twinkle 1.5s ease-in-out infinite; }
        .review-card .stars span:nth-child(2) { animation-delay: 0.2s; }
        .review-card .stars span:nth-child(3) { animation-delay: 0.4s; }
        .review-card .stars span:nth-child(4) { animation-delay: 0.6s; }
        .review-card .stars span:nth-child(5) { animation-delay: 0.8s; }

        /* Confetti */
        .confetti-piece { position: fixed; width: 8px; height: 8px; border-radius: 2px; z-index: 300; pointer-events: none; animation: confettiFall 1.5s ease-out forwards; }
        @keyframes confettiFall { 0% { opacity: 1; transform: translateY(0) rotate(0deg); } 100% { opacity: 0; transform: translateY(80vh) rotate(720deg); } }
    
:focus-visible{outline:3px solid #f4c85f!important;outline-offset:3px}body{overflow-x:hidden}.lang-btn,.save-btn,.qr-btn,.close-qr,.fab,.lead-open,.lead-submit,.lead-dialog-close,.lead-success-close{cursor:pointer}.soc-icon{width:24px;height:24px;object-fit:contain}.review-dots button{width:8px;height:8px;border:0;border-radius:50%;background:#475569;padding:0}.review-dots button.active{background:#06b6d4}.fi{animation-duration:.28s!important}.review-card .stars span{animation-duration:3s!important}a,button{transition:transform .16s ease,filter .16s ease,background-color .16s ease,border-color .16s ease}a:active,button:active{transform:scale(.98)}.fab{bottom:max(18px,env(safe-area-inset-bottom))!important}.lead-request-wrap{padding:0 24px 18px}.lead-open{width:100%;min-height:48px;border-radius:14px;border:1px solid rgba(16,185,129,.5);background:rgba(16,185,129,.12);color:#d9fff0;font:700 14px/1 inherit;box-shadow:0 8px 24px rgba(16,185,129,.12)}.lead-dialog{width:min(calc(100% - 24px),440px);max-height:calc(100dvh - 24px);margin:auto;padding:0;border:1px solid rgba(34,211,238,.3);border-radius:22px;background:#0b1522;color:#f8fafc;box-shadow:0 28px 90px rgba(0,0,0,.68);overflow:auto;animation:leadIn .18s ease-out}.lead-dialog::backdrop{background:rgba(2,6,14,.78);backdrop-filter:blur(5px)}@keyframes leadIn{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}body.modal-open{overflow:hidden}.lead-dialog-close{position:sticky;float:right;top:12px;right:12px;z-index:2;width:38px;height:38px;margin:12px 12px 0 0;border-radius:50%;border:1px solid rgba(255,255,255,.14);background:#142337;color:#fff;font-size:24px;line-height:1}.lead-dialog-head{padding:30px 24px 12px}.lead-dialog-head h2{margin:4px 0 8px;font-size:25px;letter-spacing:-.03em}.lead-dialog-head>p:last-child{margin:0;color:#aebdca;font-size:13px}.lead-eyebrow{margin:0;color:#22d3ee!important;font-size:10px!important;font-weight:800;letter-spacing:.15em;text-transform:uppercase}.lead-form{display:grid;gap:13px;padding:10px 24px 26px}.lead-form>label:not(.consent){display:grid;gap:6px;color:#dbe7ee;font-size:12px;font-weight:700}.lead-form input:not([type=checkbox]),.lead-form select,.lead-form textarea{width:100%;min-height:46px;border:1px solid rgba(255,255,255,.14);border-radius:11px;background:#101f30;color:#f8fafc;padding:11px 12px;font:500 16px/1.35 inherit}.lead-form textarea{min-height:86px;resize:vertical}.lead-form input::placeholder,.lead-form textarea::placeholder{color:#78909e}.lead-form select:invalid{color:#78909e}.consent{display:flex;gap:10px;align-items:flex-start;color:#aebdca;font-size:11px;line-height:1.45}.consent input{width:17px;height:17px;min-width:17px;margin-top:2px;accent-color:#06b6d4}.consent a{color:#67e8f9}.sensitive-note{margin:0;padding:10px 11px;border-radius:10px;background:rgba(245,158,11,.08);color:#d8c7a4;font-size:10.5px;line-height:1.45}.lead-status{min-height:18px;margin:0;color:#fca5a5;font-size:12px;line-height:1.4}.lead-submit,.lead-success-close{min-height:48px;border:0;border-radius:12px;background:linear-gradient(135deg,#06b6d4,#22d3ee);color:#031018;font:800 14px/1 inherit}.lead-submit:disabled{opacity:.58;cursor:wait}.lead-success{padding:22px 28px 32px;text-align:center}.lead-success-icon{display:grid;place-items:center;width:54px;height:54px;margin:0 auto 15px;border-radius:50%;background:rgba(16,185,129,.16);color:#34d399;font-size:28px;font-weight:900}.lead-success h3{margin:0 0 8px;font-size:24px}.lead-success p{margin:0 0 20px;color:#b8c6cf;font-size:13px}.lead-success-close{width:100%}.hp{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}.network-links{padding:0 24px 16px;text-align:center}.network-links>p{margin:0 0 8px;border-top:1px solid var(--border);padding-top:16px;color:rgba(255,255,255,.28);font-size:10px;font-weight:700;letter-spacing:.08em}.network-links>div{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.network-links a{color:rgba(255,255,255,.48);font-size:11px;text-decoration:none}[hidden]{display:none!important}@media(max-width:360px){.lead-dialog-head,.lead-form{padding-left:18px;padding-right:18px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.shimmer{animation:none!important}}