/* ===== DESIGN TOKENS ===== */
:root {
    --bg: #0a0a1a;
    --bg-2: #12122a;
    --surface: rgba(255, 255, 255, 0.06);
    --surface-2: rgba(255, 255, 255, 0.1);
    --glass: rgba(255, 255, 255, 0.08);
    --glass-border: rgba(255, 255, 255, 0.12);
    --ink: #f0f0ff;
    --ink-soft: rgba(240, 240, 255, 0.7);
    --purple: #6C5CE7;
    --purple-light: #A29BFE;
    --teal: #00CEC9;
    --teal-light: #55EFC4;
    --gold: #FDCB6E;
    --pink: #FD79A8;
    --gradient-main: linear-gradient(135deg, #6C5CE7, #00CEC9);
    --gradient-warm: linear-gradient(135deg, #FDCB6E, #FD79A8);
    --radius-xl: 24px;
    --radius-lg: 18px;
    --radius-md: 12px;
    --shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
    --shadow-glow: 0 0 40px rgba(108, 92, 231, 0.3);
}

/* ===== RESET & BASE ===== */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    color: var(--ink);
    font-family: 'Inter', sans-serif;
    line-height: 1.65;
    background: var(--bg);
    overflow-x: hidden;
}

h1,
h2,
h3,
h4,
.brand {
    font-family: 'Outfit', 'Inter', sans-serif;
    letter-spacing: -0.02em;
}

h1,
h2,
h3,
h4,
p {
    margin: 0;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
    display: block;
}

.container {
    width: min(1180px, 92vw);
    margin: 0 auto;
}

/* ===== ANIMATIONS ===== */
@keyframes float {

    0%,
    100% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(-20px)
    }
}

@keyframes float2 {

    0%,
    100% {
        transform: translateY(0) rotate(0deg)
    }

    50% {
        transform: translateY(-14px) rotate(3deg)
    }
}

@keyframes pulse-ring {
    0% {
        transform: scale(1);
        opacity: .6
    }

    100% {
        transform: scale(2.5);
        opacity: 0
    }
}

@keyframes spin-slow {
    to {
        transform: rotate(360deg)
    }
}

@keyframes ticker-scroll {
    to {
        transform: translateX(-50%)
    }
}

@keyframes shimmer {
    0% {
        background-position: -200% 0
    }

    100% {
        background-position: 200% 0
    }
}

@keyframes glow-pulse {

    0%,
    100% {
        opacity: .5
    }

    50% {
        opacity: 1
    }
}

@keyframes orbit {
    to {
        transform: rotate(360deg)
    }
}

@keyframes fade-in-up {
    from {
        opacity: 0;
        transform: translateY(30px)
    }

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

.fade-up {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity .7s cubic-bezier(.22, 1, .36, 1), transform .7s cubic-bezier(.22, 1, .36, 1);
}

.fade-up.visible {
    opacity: 1;
    transform: translateY(0);
}

.fade-up.delay-1 {
    transition-delay: .12s;
}

.fade-up.delay-2 {
    transition-delay: .24s;
}

.fade-up.delay-3 {
    transition-delay: .36s;
}

/* ===== PARTICLES ===== */
.bg-particles {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.particle {
    position: absolute;
    border-radius: 50%;
    background: var(--gradient-main);
    opacity: .12;
    animation: float 8s ease-in-out infinite;
}

.p1 {
    width: 6px;
    height: 6px;
    top: 12%;
    left: 8%;
    animation-delay: 0s
}

.p2 {
    width: 4px;
    height: 4px;
    top: 28%;
    left: 82%;
    animation-delay: 1s;
    background: var(--teal)
}

.p3 {
    width: 8px;
    height: 8px;
    top: 55%;
    left: 15%;
    animation-delay: 2s;
    background: var(--pink)
}

.p4 {
    width: 5px;
    height: 5px;
    top: 72%;
    left: 70%;
    animation-delay: 3s
}

.p5 {
    width: 3px;
    height: 3px;
    top: 40%;
    left: 50%;
    animation-delay: 4s;
    background: var(--gold)
}

.p6 {
    width: 7px;
    height: 7px;
    top: 85%;
    left: 30%;
    animation-delay: 1.5s
}

.p7 {
    width: 4px;
    height: 4px;
    top: 18%;
    left: 60%;
    animation-delay: 2.5s;
    background: var(--teal-light)
}

.p8 {
    width: 6px;
    height: 6px;
    top: 65%;
    left: 90%;
    animation-delay: 3.5s;
    background: var(--purple-light)
}

.gradient-orbs {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: .18;
}

.orb-1 {
    width: 500px;
    height: 500px;
    top: -10%;
    left: -10%;
    background: var(--purple);
    animation: float 12s ease-in-out infinite
}

.orb-2 {
    width: 400px;
    height: 400px;
    bottom: -5%;
    right: -5%;
    background: var(--teal);
    animation: float 15s ease-in-out infinite 2s
}

.orb-3 {
    width: 300px;
    height: 300px;
    top: 40%;
    left: 50%;
    background: var(--pink);
    animation: float 10s ease-in-out infinite 4s
}

/* ===== HEADER ===== */
.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    padding: 16px 0;
    background: rgba(10, 10, 26, 0.4);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--glass-border);
    transition: all .4s ease;
}

.site-header.scrolled {
    padding: 10px 0;
    background: rgba(10, 10, 26, 0.85);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.3);
}

.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 1.1rem;
    font-weight: 800;
    color: #fff;
}

.brand-icon {
    width: 32px;
    height: 32px;
    flex-shrink: 0;
}

.brand-icon svg {
    width: 100%;
    height: 100%;
}

.topnav {
    display: flex;
    align-items: center;
    gap: 24px;
}

.topnav a {
    font-weight: 600;
    font-size: .92rem;
    color: var(--ink-soft);
    position: relative;
    padding: 4px 0;
    transition: color .3s;
}

.topnav a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--gradient-main);
    border-radius: 2px;
    transition: width .3s;
}

.topnav a:hover {
    color: #fff;
}

.topnav a:hover::after {
    width: 100%;
}

.topbar-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    border-radius: 999px;
    background: var(--surface-2);
    border: 1px solid var(--glass-border);
    font-weight: 700;
    font-size: .92rem;
    color: #fff;
    transition: all .3s;
}

.topbar-cta:hover {
    background: rgba(108, 92, 231, 0.2);
    border-color: var(--purple);
}

.pulse-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--teal-light);
    position: relative;
}

.pulse-dot::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 50%;
    border: 2px solid var(--teal-light);
    animation: pulse-ring 2s ease-out infinite;
}

/* ===== HERO ===== */
.hero {
    position: relative;
    z-index: 1;
    padding: 160px 0 100px;
    overflow: hidden;
}

.hero-bg-shapes {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.hero-shape {
    position: absolute;
    border-radius: 50%;
}

.shape-1 {
    width: 600px;
    height: 600px;
    top: -200px;
    right: -150px;
    background: radial-gradient(circle, rgba(108, 92, 231, 0.2), transparent 70%);
    animation: float 8s ease-in-out infinite;
}

.shape-2 {
    width: 400px;
    height: 400px;
    bottom: -100px;
    left: -100px;
    background: radial-gradient(circle, rgba(0, 206, 201, 0.15), transparent 70%);
    animation: float 10s ease-in-out infinite 2s;
}

.shape-3 {
    width: 200px;
    height: 200px;
    top: 30%;
    left: 45%;
    background: radial-gradient(circle, rgba(253, 203, 110, 0.1), transparent 70%);
    animation: float2 6s ease-in-out infinite 1s;
}

.hero-ring {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(108, 92, 231, 0.15);
}

.ring-1 {
    width: 500px;
    height: 500px;
    top: -50px;
    right: -100px;
    animation: spin-slow 30s linear infinite
}

.ring-2 {
    width: 350px;
    height: 350px;
    bottom: 0;
    left: -80px;
    animation: spin-slow 25s linear infinite reverse;
    border-color: rgba(0, 206, 201, 0.1)
}

.hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 40px;
    align-items: center;
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .85rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--teal-light);
}

.eyebrow-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--teal-light);
    box-shadow: 0 0 10px var(--teal);
}

h1 {
    margin-top: 18px;
    font-size: clamp(2.2rem, 5.5vw, 3.8rem);
    line-height: 1.08;
    font-weight: 900;
}

.gradient-text {
    background: var(--gradient-main);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-text {
    margin-top: 20px;
    max-width: 540px;
    font-size: 1.12rem;
    color: var(--ink-soft);
    line-height: 1.7;
}

/* ===== BUTTONS ===== */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    border-radius: 999px;
    font-weight: 700;
    font-size: .95rem;
    padding: 14px 28px;
    cursor: pointer;
    transition: all .3s cubic-bezier(.22, 1, .36, 1);
    position: relative;
    overflow: hidden;
}

.btn::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
    transform: translateX(-100%);
    transition: transform .5s;
}

.btn:hover::before {
    transform: translateX(100%);
}

.btn-arrow {
    width: 18px;
    height: 18px;
    transition: transform .3s;
}

.btn:hover .btn-arrow {
    transform: translateX(4px);
}

.btn-primary {
    background: var(--gradient-main);
    color: #fff;
    box-shadow: 0 8px 30px rgba(108, 92, 231, 0.4);
}

.btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 40px rgba(108, 92, 231, 0.5);
}

.btn-glass {
    background: var(--surface-2);
    color: #fff;
    border: 1px solid var(--glass-border);
    backdrop-filter: blur(10px);
}

.btn-glass:hover {
    background: var(--surface);
    border-color: rgba(255, 255, 255, 0.2);
    transform: translateY(-3px);
}

.hero-actions {
    margin-top: 36px;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

/* ===== HERO STATS ===== */
.hero-stats {
    margin-top: 48px;
    display: flex;
    gap: 20px;
}

.hero-stat {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    border-radius: var(--radius-md);
    background: var(--surface);
    border: 1px solid var(--glass-border);
    backdrop-filter: blur(10px);
    transition: all .3s;
}

.hero-stat:hover {
    background: var(--surface-2);
    border-color: var(--purple);
    transform: translateY(-2px);
}

.stat-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(108, 92, 231, 0.15);
    display: grid;
    place-items: center;
    color: var(--purple-light);
}

.stat-icon svg {
    width: 20px;
    height: 20px;
}

.hero-stat strong {
    display: block;
    font-size: 1.15rem;
    font-weight: 800;
    color: #fff;
}

.hero-stat span {
    font-size: .78rem;
    color: var(--ink-soft);
}

/* ===== HERO PANEL ===== */
.hero-panel {
    position: relative;
    padding: 36px;
    border-radius: var(--radius-xl);
    background: var(--glass);
    border: 1px solid var(--glass-border);
    backdrop-filter: blur(20px);
    box-shadow: var(--shadow);
    overflow: hidden;
}

.panel-glow {
    position: absolute;
    top: -50%;
    right: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle at 70% 30%, rgba(108, 92, 231, 0.08), transparent 50%);
    animation: glow-pulse 4s ease-in-out infinite;
}

.panel-title {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 1.25rem;
    font-weight: 800;
    position: relative;
    z-index: 1;
}

.panel-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--gradient-main);
    display: grid;
    place-items: center;
    font-size: 1.2rem;
    color: #fff;
    box-shadow: 0 8px 20px rgba(108, 92, 231, 0.3);
}

.panel-list {
    margin-top: 22px;
    display: grid;
    gap: 14px;
    position: relative;
    z-index: 1;
}

.panel-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: var(--ink-soft);
    font-size: .96rem;
    line-height: 1.5;
}

.list-check {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    margin-top: 2px;
    border-radius: 6px;
    background: rgba(0, 206, 201, 0.15);
    display: grid;
    place-items: center;
    color: var(--teal-light);
}

.list-check svg {
    width: 12px;
    height: 12px;
}

.panel-badge {
    margin-top: 24px;
    padding: 12px 18px;
    border-radius: var(--radius-md);
    background: rgba(85, 239, 196, 0.08);
    border: 1px solid rgba(85, 239, 196, 0.2);
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .88rem;
    font-weight: 600;
    color: var(--teal-light);
    position: relative;
    z-index: 1;
}

.badge-pulse {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--teal-light);
    box-shadow: 0 0 12px var(--teal);
    animation: glow-pulse 2s ease-in-out infinite;
}

/* ===== TICKER ===== */
.ticker {
    padding: 16px 0;
    overflow: hidden;
    background: var(--surface);
    border-top: 1px solid var(--glass-border);
    border-bottom: 1px solid var(--glass-border);
    position: relative;
    z-index: 1;
}

.ticker-track {
    display: flex;
    gap: 40px;
    white-space: nowrap;
    animation: ticker-scroll 20s linear infinite;
    width: max-content;
}

.ticker-track span {
    font-weight: 700;
    font-size: .9rem;
    color: var(--ink-soft);
    letter-spacing: .05em;
    text-transform: uppercase;
}
/* ===== SECTIONS COMMON ===== */
.section { position:relative;padding:100px 0;z-index:1; }
.section-header { text-align:center;max-width:640px;margin:0 auto; }
.section h2 { font-size:clamp(1.6rem,4vw,2.6rem);line-height:1.15;font-weight:800; }
.section-tag {
  display:inline-block;padding:6px 16px;border-radius:999px;
  font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--purple-light);background:rgba(108,92,231,0.12);
  border:1px solid rgba(108,92,231,0.2);margin-bottom:14px;
}
.section-tag--light { color:var(--teal-light);background:rgba(0,206,201,0.12);border-color:rgba(0,206,201,0.2); }
.section-lead { margin-top:14px;color:var(--ink-soft);font-size:1.06rem;max-width:600px; }
.section-header .section-lead { margin-left:auto;margin-right:auto; }
.brand-pro {
  display:inline-block;margin-right:8px;padding:3px 12px;border-radius:999px;
  font-size:.7em;letter-spacing:.1em;font-weight:900;vertical-align:middle;
  color:#fff;background:var(--gradient-main);
  box-shadow:0 4px 14px rgba(108,92,231,0.3);
}

/* ===== SERVICES ===== */
.services-section { padding-top:80px; }
.services-section::before {
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,var(--bg),var(--bg-2),var(--bg));
}
.service-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:40px; }
.service-card {
  position:relative;padding:36px;border-radius:var(--radius-xl);
  background:var(--glass);border:1px solid var(--glass-border);
  backdrop-filter:blur(20px);overflow:hidden;
  transition:all .4s cubic-bezier(.22,1,.36,1);
  cursor:default;
}
.service-card:hover { border-color:rgba(108,92,231,0.3); }
.card-shine {
  position:absolute;inset:0;border-radius:inherit;
  pointer-events:none;transition:background .3s;
}
.card-icon-wrap { margin-bottom:20px; }
.card-icon {
  width:56px;height:56px;border-radius:14px;
  background:rgba(108,92,231,0.1);
  display:grid;place-items:center;
}
.card-icon svg { width:32px;height:32px; }
.service-card h3 { font-size:1.3rem;font-weight:800;margin-bottom:16px; }
.service-card ul { display:grid;gap:10px; }
.service-card li {
  padding-left:20px;position:relative;color:var(--ink-soft);font-size:.95rem;
}
.service-card li::before {
  content:'';position:absolute;left:0;top:9px;
  width:8px;height:8px;border-radius:50%;
  background:var(--gradient-main);
}
.card-tag {
  display:inline-block;margin-top:20px;padding:5px 14px;border-radius:999px;
  font-size:.76rem;font-weight:700;letter-spacing:.05em;
  color:var(--purple-light);background:rgba(108,92,231,0.12);
  border:1px solid rgba(108,92,231,0.2);
}
.card-tag--teal { color:var(--teal-light);background:rgba(0,206,201,0.1);border-color:rgba(0,206,201,0.2); }

/* ===== FEATURES ===== */
.features { display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px; }
.feature-card {
  padding:28px;border-radius:var(--radius-lg);
  background:var(--surface);border:1px solid var(--glass-border);
  transition:all .3s;position:relative;overflow:hidden;
}
.feature-card:hover { border-color:rgba(108,92,231,0.3);transform:translateY(-4px); }
.feature-card::after {
  content:'';position:absolute;bottom:0;left:0;right:0;height:3px;
  background:var(--gradient-main);opacity:0;transition:opacity .3s;
}
.feature-card:hover::after { opacity:1; }
.feature-number {
  font-size:2.8rem;font-weight:900;line-height:1;
  background:var(--gradient-main);-webkit-background-clip:text;
  -webkit-text-fill-color:transparent;background-clip:text;opacity:.3;
}
.feature-card h4 { margin-top:10px;font-size:1.08rem;font-weight:700; }
.feature-card p { margin-top:8px;color:var(--ink-soft);font-size:.92rem; }

/* ===== CALCULATOR ===== */
.calculator-section {
  overflow:hidden;
  background:linear-gradient(160deg,#1a0a3e,#0d2137,#0a2a2a);
}
.calc-bg-decor { position:absolute;inset:0;pointer-events:none; }
.calc-ring {
  position:absolute;border-radius:50%;
  border:1px solid rgba(108,92,231,0.1);
}
.calc-ring-1{width:500px;height:500px;top:-100px;right:-100px;animation:spin-slow 35s linear infinite}
.calc-ring-2{width:350px;height:350px;bottom:-50px;left:-80px;animation:spin-slow 28s linear infinite reverse;border-color:rgba(0,206,201,0.1)}
.calc-dots {
  position:absolute;inset:0;
  background:radial-gradient(circle,rgba(255,255,255,0.03) 1px,transparent 1px);
  background-size:30px 30px;
}
.calc-header { text-align:center;margin-bottom:40px; }
.calc-header h2 { color:#fff; }
.calc-intro { margin-top:10px;font-weight:600;color:rgba(255,255,255,0.7);font-size:1.05rem; }
.lead-form {
  max-width:800px;margin:0 auto;padding:36px;
  border-radius:var(--radius-xl);
  background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);
  backdrop-filter:blur(20px);
  box-shadow:0 20px 60px rgba(0,0,0,0.3);
}
.form-grid { display:grid;grid-template-columns:1fr 1fr;gap:24px; }
.form-col { display:grid;gap:16px;align-content:start; }
.form-label { display:grid;gap:8px; }
.label-text { font-size:.9rem;font-weight:600;color:rgba(255,255,255,0.8); }
.lead-form input,.lead-form select {
  width:100%;padding:13px 16px;border-radius:var(--radius-md);
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.06);color:#fff;
  font:inherit;font-size:.95rem;
  transition:all .3s;
}
.lead-form input::placeholder { color:rgba(255,255,255,0.3); }
.lead-form select { appearance:none;cursor:pointer; }
.lead-form select option { background:#1a1a2e;color:#fff; }
.select-wrap { position:relative; }
.select-wrap::after {
  content:'▾';position:absolute;right:14px;top:50%;transform:translateY(-50%);
  color:rgba(255,255,255,0.4);pointer-events:none;font-size:.8rem;
}
.select-wrap select { padding-right:36px; }
.lead-form input:focus,.lead-form select:focus {
  outline:none;border-color:var(--purple);
  box-shadow:0 0 0 3px rgba(108,92,231,0.2);
}
.switch-row {
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;min-height:50px;color:rgba(255,255,255,0.8);font-weight:600;font-size:.9rem;
}
.switch { position:relative;width:52px;height:28px;flex-shrink:0; }
.switch input { position:absolute;inset:0;opacity:0;cursor:pointer;z-index:1; }
.slider {
  position:absolute;inset:0;border-radius:999px;
  background:rgba(255,255,255,0.15);transition:all .3s;
}
.slider::before {
  content:'';position:absolute;top:3px;left:3px;
  width:22px;height:22px;border-radius:50%;
  background:#fff;box-shadow:0 2px 6px rgba(0,0,0,0.2);
  transition:transform .3s;
}
.switch input:checked+.slider { background:var(--purple); }
.switch input:checked+.slider::before { transform:translateX(24px); }
.btn-submit {
  grid-column:1/-1;margin-top:8px;
  width:100%;max-width:400px;justify-self:center;
  background:var(--gradient-warm);color:#fff;font-size:1rem;
  box-shadow:0 8px 30px rgba(253,121,168,0.3);
}
.btn-submit:hover { transform:translateY(-3px);box-shadow:0 12px 40px rgba(253,121,168,0.4); }

/* ===== REVIEWS ===== */
.reviews-section::before {
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,var(--bg-2),var(--bg));
}
.review-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px; }
.review-card {
  position:relative;padding:32px;border-radius:var(--radius-xl);
  background:var(--glass);border:1px solid var(--glass-border);
  backdrop-filter:blur(20px);overflow:hidden;
  display:grid;align-content:start;gap:14px;
  transition:all .4s cubic-bezier(.22,1,.36,1);cursor:default;
}
.review-card:hover { border-color:rgba(108,92,231,0.3); }
.review-glow { position:absolute;inset:0;border-radius:inherit;pointer-events:none;transition:background .3s; }
.review-stamp {
  display:inline-block;width:fit-content;padding:4px 12px;border-radius:999px;
  font-size:.7rem;font-weight:800;letter-spacing:.08em;
  color:var(--purple-light);background:rgba(108,92,231,0.12);
  border:1px solid rgba(108,92,231,0.25);
}
.review-stamp--teal { color:var(--teal-light);background:rgba(0,206,201,0.1);border-color:rgba(0,206,201,0.2); }
.review-stamp--gold { color:var(--gold);background:rgba(253,203,110,0.1);border-color:rgba(253,203,110,0.2); }
.review-head { display:flex;align-items:center;gap:14px; }
.review-avatar {
  width:52px;height:52px;flex-shrink:0;border-radius:14px;
  background:var(--gradient-main);display:grid;place-items:center;
  font-size:.82rem;font-weight:800;color:#fff;
  box-shadow:0 6px 18px rgba(108,92,231,0.3);
}
.review-avatar--teal { background:linear-gradient(135deg,var(--teal),var(--teal-light));box-shadow:0 6px 18px rgba(0,206,201,0.3); }
.review-avatar--gold { background:linear-gradient(135deg,var(--gold),var(--pink));box-shadow:0 6px 18px rgba(253,203,110,0.3); }
.review-card h3 { font-size:1.05rem;font-weight:700; }
.review-company { margin-top:2px;font-size:.84rem;color:var(--ink-soft); }
.review-tag {
  display:inline-block;width:fit-content;padding:5px 12px;border-radius:999px;
  font-size:.78rem;font-weight:700;
  color:var(--purple-light);background:rgba(108,92,231,0.1);
  border:1px solid rgba(108,92,231,0.15);
}
.review-tag--teal { color:var(--teal-light);background:rgba(0,206,201,0.08);border-color:rgba(0,206,201,0.15); }
.review-tag--gold { color:var(--gold);background:rgba(253,203,110,0.08);border-color:rgba(253,203,110,0.15); }
.review-card p { color:var(--ink-soft);font-size:.92rem;line-height:1.6; }
.review-stars { color:var(--gold);font-size:1.1rem;letter-spacing:3px;margin-top:4px; }

/* ===== CTA ===== */
.cta-section { padding:60px 0; }
.cta-card {
  position:relative;overflow:hidden;
  padding:60px;border-radius:var(--radius-xl);
  background:linear-gradient(135deg,rgba(108,92,231,0.15),rgba(0,206,201,0.1));
  border:1px solid rgba(108,92,231,0.2);
  backdrop-filter:blur(20px);
  display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center;
}
.cta-shapes { position:absolute;inset:0;pointer-events:none; }
.cta-shape { position:absolute;border-radius:50%; }
.cta-shape-1{width:300px;height:300px;top:-100px;right:-50px;background:radial-gradient(circle,rgba(108,92,231,0.12),transparent);animation:float 8s ease-in-out infinite}
.cta-shape-2{width:200px;height:200px;bottom:-60px;left:-40px;background:radial-gradient(circle,rgba(0,206,201,0.1),transparent);animation:float 10s ease-in-out infinite 2s}
.cta-shape-3{width:150px;height:150px;top:50%;left:60%;background:radial-gradient(circle,rgba(253,203,110,0.08),transparent);animation:float2 6s ease-in-out infinite}
.cta-content { position:relative;z-index:1; }
.cta-kicker {
  font-size:.82rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--teal-light);margin-bottom:12px;
}
.cta-card h2 { font-size:clamp(1.6rem,3.5vw,2.4rem);line-height:1.15; }
.cta-highlight {
  display:inline-block;padding:2px 12px;border-radius:8px;
  background:var(--gradient-main);-webkit-background-clip:text;
  -webkit-text-fill-color:transparent;background-clip:text;
}
.cta-lead { margin:18px 0 28px;color:var(--ink-soft);font-size:1.05rem;max-width:500px; }
.btn-cta {
  background:var(--gradient-main);color:#fff;
  box-shadow:0 8px 30px rgba(108,92,231,0.35);
}
.btn-cta:hover { transform:translateY(-3px);box-shadow:0 12px 40px rgba(108,92,231,0.5); }
.cta-visual { position:relative;z-index:1;display:grid;place-items:center; }
.cta-circle-outer {
  width:200px;height:200px;border-radius:50%;
  background:conic-gradient(var(--purple),var(--teal),var(--teal-light),var(--purple));
  padding:6px;animation:spin-slow 8s linear infinite;
}
.cta-circle-inner {
  width:100%;height:100%;border-radius:50%;
  background:var(--bg);display:grid;place-items:center;
  animation:spin-slow 8s linear infinite reverse;
}
.cta-percent { font-size:2.8rem;font-weight:900;background:var(--gradient-main);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1; }
.cta-pct-label { font-size:.82rem;color:var(--ink-soft);font-weight:600; }

/* ===== VIDEO ===== */
.video-section::before { content:'';position:absolute;inset:0;z-index:-1;background:var(--bg-2); }
.video-placeholder {
  margin-top:32px;border-radius:var(--radius-xl);
  border:1px dashed rgba(255,255,255,0.15);
  background:var(--surface);backdrop-filter:blur(10px);
  min-height:320px;display:grid;place-items:center;
  text-align:center;padding:40px;color:var(--ink-soft);
  position:relative;overflow:hidden;
  transition:border-color .3s;
}
.video-placeholder:hover { border-color:rgba(108,92,231,0.3); }
.video-play {
  width:72px;height:72px;margin-bottom:16px;
  color:var(--purple-light);transition:all .3s;
}
.video-play svg { width:100%;height:100%; }
.video-placeholder:hover .video-play { color:var(--teal-light);transform:scale(1.1); }

/* ===== FOOTER ===== */
.footer {
  position:relative;z-index:1;padding:60px 0 0;overflow:hidden;
  background:linear-gradient(180deg,var(--bg),#06061a);
}
.footer-shapes { position:absolute;inset:0;pointer-events:none; }
.footer-shape { position:absolute;border-radius:50%; }
.fs-1{width:400px;height:400px;top:-100px;left:-100px;background:radial-gradient(circle,rgba(108,92,231,0.08),transparent);animation:float 12s ease-in-out infinite}
.fs-2{width:300px;height:300px;bottom:-80px;right:-80px;background:radial-gradient(circle,rgba(0,206,201,0.06),transparent);animation:float 15s ease-in-out infinite 3s}
.footer-card {
  position:relative;z-index:1;padding:40px;
  border-radius:var(--radius-xl);
  background:var(--glass);border:1px solid var(--glass-border);
  backdrop-filter:blur(20px);
}
.footer-grid {
  display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:32px;
}
.footer-title {
  display:flex;align-items:center;gap:12px;
  font-size:1.5rem;font-weight:800;color:#fff;
}
.brand-icon--light { width:36px;height:36px; }
.brand-icon--light svg { width:100%;height:100%; }
.footer-text { margin-top:10px;color:var(--ink-soft);max-width:320px; }
.footer-col h3 { font-size:1rem;font-weight:700;color:rgba(255,255,255,0.9);margin-bottom:16px; }
.contacts-list { display:grid;gap:14px; }
.contacts-list a {
  display:inline-flex;align-items:center;gap:10px;
  font-weight:600;font-size:.92rem;color:var(--ink-soft);
  transition:color .3s;
}
.contacts-list a:hover { color:#fff; }
.contact-icon {
  width:34px;height:34px;border-radius:10px;flex-shrink:0;
  background:rgba(108,92,231,0.12);
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--purple-light);transition:all .3s;
}
.contact-icon svg { width:16px;height:16px; }
.contacts-list a:hover .contact-icon { background:rgba(108,92,231,0.25);color:#fff; }
.footer-links { display:grid;gap:10px; }
.footer-links a { color:var(--ink-soft);font-size:.92rem;transition:color .3s; }
.footer-links a:hover { color:#fff; }
.footer-bottom {
  margin-top:32px;padding-top:20px;
  border-top:1px solid var(--glass-border);
  display:flex;justify-content:space-between;gap:14px;
  color:rgba(255,255,255,0.4);font-size:.85rem;
}

/* ===== MODAL ===== */
body.modal-open { overflow:hidden; }
.callback-modal { position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:16px; }
.callback-modal[hidden] { display:none; }
.callback-modal__backdrop { position:absolute;inset:0;background:rgba(0,0,0,0.6);backdrop-filter:blur(8px); }
.callback-modal__dialog {
  position:relative;width:min(500px,100%);
  border-radius:var(--radius-xl);
  background:var(--bg-2);border:1px solid var(--glass-border);
  padding:36px;box-shadow:0 24px 60px rgba(0,0,0,0.5);
}
.callback-modal__close {
  position:absolute;right:14px;top:14px;
  width:36px;height:36px;border:0;border-radius:10px;
  display:grid;place-items:center;
  background:var(--surface);color:var(--ink-soft);cursor:pointer;
  transition:all .3s;
}
.callback-modal__close svg { width:18px;height:18px; }
.callback-modal__close:hover { background:rgba(253,121,168,0.15);color:var(--pink); }
.callback-modal h2 { font-size:1.5rem;font-weight:800; }
.callback-modal p { margin:10px 0 0;color:var(--ink-soft); }
.callback-form { margin-top:20px;display:grid;gap:14px; }
.callback-form .form-label { display:grid;gap:6px; }
.callback-form .label-text { font-size:.9rem;font-weight:600;color:rgba(255,255,255,0.7); }
.callback-form input {
  width:100%;padding:13px 16px;border-radius:var(--radius-md);
  border:1px solid var(--glass-border);background:var(--surface);
  color:#fff;font:inherit;transition:all .3s;
}
.callback-form input:focus { outline:none;border-color:var(--purple);box-shadow:0 0 0 3px rgba(108,92,231,0.2); }
.callback-form__submit { margin-top:4px; }

/* ===== RESPONSIVE ===== */
@media(max-width:1024px) {
  .hero-grid,.service-grid,.review-grid,.features,.cta-card .cta-content+.cta-visual { grid-template-columns:1fr; }
  .service-grid,.review-grid,.features { grid-template-columns:1fr; }
  .hero-grid { gap:32px; }
  .hero { padding:140px 0 80px; }
  .cta-card { grid-template-columns:1fr;text-align:center;padding:40px; }
  .cta-lead { margin-left:auto;margin-right:auto; }
  .cta-visual { margin-top:20px; }
  .footer-grid { grid-template-columns:1fr 1fr;gap:24px; }
  .footer-brand { grid-column:1/-1; }
  .form-grid { grid-template-columns:1fr; }
  .topnav { display:none; }
  .hero-stats { flex-wrap:wrap; }
}
@media(max-width:640px) {
  .hero { padding:120px 0 60px; }
  .hero-panel,.service-card,.review-card,.lead-form,.footer-card { padding:24px; }
  .btn { width:100%;justify-content:center; }
  .hero-actions { width:100%; }
  .hero-stats { flex-direction:column; }
  .cta-card { padding:28px; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column;align-items:flex-start; }
  .cta-circle-outer { width:150px;height:150px; }
  .cta-percent { font-size:2rem; }
}