html{scroll-behavior:smooth}
body{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f8fafc;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:#0b1220}
.font900{font-weight:900}.font800{font-weight:800}.font700{font-weight:700}
::selection{background:#071D36;color:#fff}
h1,h2,h3{letter-spacing:-.045em}p{letter-spacing:-.01em}

/* Glass + nav */
.glass{background:rgba(255,255,255,.72);backdrop-filter:saturate(180%) blur(22px);-webkit-backdrop-filter:saturate(180%) blur(22px);box-shadow:0 1px 0 rgba(15,23,42,.06)}

/* Brand logo */
.brand-logo-link{display:inline-flex;align-items:center;isolation:isolate}
.brand-logo-shell{display:flex;height:3.4rem;width:5rem;align-items:center;justify-content:center;overflow:hidden;border-radius:1.25rem;background:linear-gradient(180deg,#fff,#f1f5f9);box-shadow:0 14px 30px rgba(7,29,54,.13),inset 0 0 0 1px rgba(7,29,54,.08)}
.brand-logo-img{height:100%;width:100%;object-fit:contain;object-position:center;transform:scale(1.02)}

/* Gradient words */
.text-gradient{background:linear-gradient(120deg,#2563eb,#22c55e 60%,#0ea5e9);-webkit-background-clip:text;background-clip:text;color:transparent}
.text-gradient-blue{background:linear-gradient(120deg,#2563eb,#0ea5e9);-webkit-background-clip:text;background-clip:text;color:transparent}

/* Backgrounds */
.bg-mesh{background:
  radial-gradient(800px 400px at 8% -5%,rgba(37,99,235,.18),transparent 60%),
  radial-gradient(700px 360px at 100% 5%,rgba(34,197,94,.15),transparent 60%),
  radial-gradient(600px 360px at 50% 110%,rgba(7,29,54,.16),transparent 60%),
  linear-gradient(180deg,#f8fafc,#fff 60%,#f8fafc)}
.hero-grid{background-image:
  linear-gradient(rgba(7,29,54,.06) 1px,transparent 1px),
  linear-gradient(90deg,rgba(7,29,54,.06) 1px,transparent 1px);
  background-size:48px 48px}
.cta-gradient{background:linear-gradient(135deg,#071D36 0%,#0f3a86 50%,#2563eb 100%)}
.dark-gradient{background:linear-gradient(160deg,#0b1220 0%,#0f1d36 60%,#1e3a8a 100%)}
.dot-pattern{background-image:radial-gradient(rgba(255,255,255,.18) 1px,transparent 1px);background-size:18px 18px}

/* Wave dividers */
.wave{display:block;width:100%;height:64px}

/* Reveal animations */
.reveal{opacity:0;transform:translateY(28px) scale(.985);filter:blur(4px);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1),filter .8s cubic-bezier(.22,1,.36,1)}
.reveal.visible{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}
.delay-1{transition-delay:.06s}.delay-2{transition-delay:.12s}.delay-3{transition-delay:.18s}.delay-4{transition-delay:.24s}.delay-5{transition-delay:.3s}.delay-6{transition-delay:.36s}

.floating{animation:float 6.5s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}

/* WhatsApp floating */
.pulse-ring{background:#25D366!important;box-shadow:0 0 0 0 rgba(37,211,102,.55),0 18px 45px rgba(37,211,102,.32);animation:pulse-ring 2.4s infinite;transition:transform .25s ease}
.pulse-ring:hover{transform:translateY(-4px) scale(1.06)}
@keyframes pulse-ring{70%{box-shadow:0 0 0 22px rgba(37,211,102,0),0 18px 45px rgba(37,211,102,.32)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0),0 18px 45px rgba(37,211,102,.32)}}

/* FAQ */
.faq-panel{max-height:0;overflow:hidden;transition:max-height .35s ease}
.faq-item.open .faq-panel{max-height:280px}
.faq-item.open .faq-icon{transform:rotate(45deg)}
.faq-icon{transition:transform .25s ease}

/* Cards */
.premium-card,.card-hover,.service-card{background:linear-gradient(180deg,#fff,rgba(248,250,252,.92));box-shadow:0 10px 30px rgba(7,29,54,.06),inset 0 1px 0 rgba(255,255,255,.86);border:1px solid rgba(15,23,42,.07);transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1),border-color .35s ease,background .35s ease;will-change:transform}
.premium-card:hover,.card-hover:hover,.service-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 28px 75px rgba(7,29,54,.16),inset 0 1px 0 rgba(255,255,255,.95);border-color:rgba(37,99,235,.25);background:#fff}

.service-card{position:relative;overflow:hidden;border-radius:1.5rem}
.service-card:before{content:"";position:absolute;inset:0 0 auto;height:4px;background:linear-gradient(90deg,#071D36,#2563eb,#22c55e);opacity:.9}
.service-tag{display:inline-flex;border-radius:999px;background:rgba(37,99,235,.08);padding:.4rem .75rem;color:#071D36;font-size:.7rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.service-icon{display:inline-flex;height:3.25rem;width:3.25rem;align-items:center;justify-content:center;border-radius:1rem;background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(34,197,94,.12));color:#071D36;box-shadow:inset 0 0 0 1px rgba(37,99,235,.18)}
.service-card:hover .service-icon{background:linear-gradient(135deg,#2563eb,#22c55e);color:#fff}
.service-list{margin-top:1rem;display:grid;gap:.45rem;color:#334155;font-size:.85rem;font-weight:700}
.service-list li{display:flex;align-items:center;gap:.5rem}
.service-list li:before{content:"";height:.4rem;width:.4rem;flex:0 0 .4rem;border-radius:999px;background:#22c55e}

/* Process timeline */
.step-card{position:relative;background:#fff;border:1px solid rgba(15,23,42,.07);border-radius:1.5rem;padding:1.5rem;box-shadow:0 10px 30px rgba(7,29,54,.05);transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s ease,border-color .3s ease}
.step-card:hover{transform:translateY(-6px) scale(1.02);box-shadow:0 26px 60px rgba(7,29,54,.14);border-color:rgba(37,99,235,.25)}
.step-num{position:absolute;top:-.85rem;left:1.25rem;display:inline-flex;height:2rem;min-width:2rem;align-items:center;justify-content:center;padding:0 .55rem;border-radius:999px;background:linear-gradient(135deg,#071D36,#2563eb);color:#fff;font-size:.75rem;font-weight:900;letter-spacing:.08em;box-shadow:0 12px 24px rgba(37,99,235,.35)}

/* Dashboard mock */
.dashboard-shadow{box-shadow:0 38px 110px rgba(7,29,54,.28)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;border-radius:9999px;padding:1rem 1.65rem;font-weight:900;letter-spacing:.005em;transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s ease,background .28s ease,border-color .28s ease;will-change:transform}
.btn svg{height:1.1rem;width:1.1rem}
.btn-primary{background:linear-gradient(135deg,#071D36,#2563eb);color:#fff;box-shadow:0 18px 42px rgba(37,99,235,.35)}
.btn-primary:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 26px 60px rgba(37,99,235,.42)}
.btn-success{background:linear-gradient(135deg,#16a34a,#22c55e);color:#fff;box-shadow:0 18px 42px rgba(34,197,94,.35)}
.btn-success:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 26px 60px rgba(34,197,94,.42)}
.btn-light{background:#fff;color:#0b1220;border:1px solid rgba(15,23,42,.12);box-shadow:0 10px 28px rgba(15,23,42,.06)}
.btn-light:hover{transform:translateY(-3px) scale(1.04);border-color:#2563eb;color:#2563eb;box-shadow:0 18px 42px rgba(37,99,235,.18)}
.btn-ghost-on-dark{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.25)}
.btn-ghost-on-dark:hover{transform:translateY(-3px) scale(1.04);background:rgba(255,255,255,.18)}

/* legacy buttons reuse */
.premium-button,a.bg-primary,button.bg-primary,a.bg-secondary,button.bg-secondary{box-shadow:0 16px 40px rgba(7,29,54,.22);transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s ease,background .28s ease}
.premium-button:hover,a.bg-primary:hover,button.bg-primary:hover,a.bg-secondary:hover,button.bg-secondary:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 24px 60px rgba(7,29,54,.28)}
.premium-button-light{box-shadow:0 12px 30px rgba(7,29,54,.08);transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s ease,border-color .28s ease}
.premium-button-light:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 20px 48px rgba(7,29,54,.14)}

/* Avatars */
.avatar{display:inline-flex;height:3rem;width:3rem;align-items:center;justify-content:center;border-radius:9999px;font-weight:900;color:#fff;letter-spacing:.02em;box-shadow:0 8px 20px rgba(15,23,42,.18)}
.avatar-1{background:linear-gradient(135deg,#2563eb,#0ea5e9)}
.avatar-2{background:linear-gradient(135deg,#22c55e,#16a34a)}
.avatar-3{background:linear-gradient(135deg,#071D36,#1e3a8a)}
.star{color:#f59e0b}

/* Trust badges */
.trust-badge{display:inline-flex;align-items:center;gap:.45rem;border-radius:9999px;padding:.45rem .85rem;background:#fff;border:1px solid rgba(15,23,42,.08);box-shadow:0 6px 18px rgba(15,23,42,.06);font-size:.78rem;font-weight:800;color:#0b1220}
.trust-badge svg{height:.95rem;width:.95rem;color:#22c55e}

/* Inputs */
input,textarea,select{transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;background:#fff}
input:focus,textarea:focus,select:focus{box-shadow:0 0 0 4px rgba(37,99,235,.12);border-color:#2563eb!important;transform:translateY(-1px)}

/* Mobile */
@media (max-width:640px){
  .brand-logo-shell{height:3rem;width:4.4rem}
  h1,h2,h3{letter-spacing:-.035em}
  .btn{width:100%;padding:1.1rem 1.5rem}
  .premium-button,.premium-button-light,a.bg-primary,button.bg-primary{width:100%;justify-content:center;padding-top:1rem;padding-bottom:1rem}
}

@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none;filter:none}
}