/* ===== VARIÁVEIS ===== */
:root {
  --glass-bg: rgba(31,41,55,0.7);
  --glass-border: rgba(255,255,255,0.1);
  --gradient-primary: linear-gradient(135deg, #6366f1, #06b6d4);
  --gradient-glow: linear-gradient(135deg, rgba(99,102,241,0.3), rgba(6,182,212,0.3));
  --shadow-glow: 0 0 20px rgba(99,102,241,0.4);
  --shadow-glow-lg: 0 0 40px rgba(99,102,241,0.6);
  --transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
  --container-padding: 2rem;
}

/* ===== BASE ===== */
*,::before,::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{line-height:1.7;overflow-x:hidden}
a{transition:var(--transition)}
img{max-width:100%;height:auto;display:block}
ul{list-style:none}

/* ===== CONTAINER PERSONALIZADO ===== */
.site-container {
  max-width: 1400px;
  margin: 0 auto;
  padding-left: var(--container-padding);
  padding-right: var(--container-padding);
  width: 100%;
}

/* ===== GLASSMORPHISM ===== */
.glass {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: 1.25rem;
  box-shadow: 0 8px 32px rgba(0,0,0,0.3);
}

/* ===== BACKGROUND ANIMADO ===== */
.bg-animation{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.bg-orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:0.15;animation:float 20s infinite ease-in-out}
.orb-1{width:600px;height:600px;background:#6366f1;top:-200px;left:-200px}
.orb-2{width:500px;height:500px;background:#06b6d4;bottom:-150px;right:-150px;animation-delay:-5s}
.orb-3{width:400px;height:400px;background:#f59e0b;top:50%;left:50%;transform:translate(-50%,-50%);animation-delay:-10s}
@keyframes float{0%,100%{transform:translate(0,0)}25%{transform:translate(30px,-30px)}50%{transform:translate(-20px,20px)}75%{transform:translate(20px,30px)}}
.bg-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(99,102,241,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(99,102,241,0.03) 1px,transparent 1px);background-size:50px 50px;animation:gridMove 30s linear infinite}
@keyframes gridMove{0%{background-position:0 0}100%{background-position:50px 50px}}

/* ===== PARTICLES CONTAINER ===== */
.particles-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}
.particle {
  position: absolute;
  width: 4px;
  height: 4px;
  background: linear-gradient(135deg, #6366f1, #06b6d4);
  border-radius: 50%;
  opacity: 0;
  animation: particleFloat 15s infinite;
  box-shadow: 0 0 10px rgba(99, 102, 241, 0.5);
}
.particle:nth-child(1) { left: 10%; animation-delay: 0s; }
.particle:nth-child(2) { left: 20%; animation-delay: 2s; }
.particle:nth-child(3) { left: 30%; animation-delay: 4s; }
.particle:nth-child(4) { left: 40%; animation-delay: 1s; }
.particle:nth-child(5) { left: 50%; animation-delay: 3s; }
.particle:nth-child(6) { left: 60%; animation-delay: 5s; }
.particle:nth-child(7) { left: 70%; animation-delay: 2.5s; }
.particle:nth-child(8) { left: 80%; animation-delay: 4.5s; }
.particle:nth-child(9) { left: 90%; animation-delay: 1.5s; }
.particle:nth-child(10) { left: 15%; animation-delay: 3.5s; }
@keyframes particleFloat {
  0% { transform: translateY(100vh) scale(0); opacity: 0; }
  10% { opacity: 0.6; }
  90% { opacity: 0.6; }
  100% { transform: translateY(-100vh) scale(1); opacity: 0; }
}

/* ===== SCROLL PROGRESS BAR ===== */
.scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  background: linear-gradient(90deg, #6366f1, #06b6d4);
  z-index: 9999;
  width: 0%;
  transition: width 0.1s;
  box-shadow: 0 0 10px rgba(99, 102, 241, 0.5);
}

/* ===== REVEAL ANIMATIONS ===== */
.reveal { opacity: 0; transform: translateY(30px); transition: all 0.6s ease; }
.reveal.active { opacity: 1; transform: translateY(0); }

.reveal-up { opacity: 0; transform: translateY(50px); transition: all 0.8s cubic-bezier(0.5, 0, 0, 1); }
.reveal-up.active { opacity: 1; transform: translateY(0); }

.reveal-left { opacity: 0; transform: translateX(-50px); transition: all 0.8s cubic-bezier(0.5, 0, 0, 1); }
.reveal-left.active { opacity: 1; transform: translateX(0); }

.reveal-right { opacity: 0; transform: translateX(50px); transition: all 0.8s cubic-bezier(0.5, 0, 0, 1); }
.reveal-right.active { opacity: 1; transform: translateX(0); }

.reveal-scale { opacity: 0; transform: scale(0.8); transition: all 0.8s cubic-bezier(0.5, 0, 0, 1); }
.reveal-scale.active { opacity: 1; transform: scale(1); }

.reveal-rotate { opacity: 0; transform: rotateY(15deg); transition: all 0.8s cubic-bezier(0.5, 0, 0, 1); }
.reveal-rotate.active { opacity: 1; transform: rotateY(0); }

/* ===== TILT 3D EFFECT ===== */
.tilt-card {
  transform-style: preserve-3d;
  transform: perspective(1000px);
  transition: transform 0.3s ease;
}
.tilt-card:hover {
  transform: perspective(1000px) rotateX(5deg) rotateY(5deg) scale3d(1.02, 1.02, 1.02);
}
.tilt-content { transform: translateZ(20px); }

/* ===== GLOW PULSE AVANÇADO ===== */
.glow-pulse { position: relative; }
.glow-pulse::before {
  content: '';
  position: absolute;
  inset: -2px;
  background: linear-gradient(135deg, #6366f1, #06b6d4, #6366f1);
  border-radius: inherit;
  z-index: -1;
  animation: glowRotate 3s linear infinite;
  background-size: 200% 200%;
}
.glow-pulse::after {
  content: '';
  position: absolute;
  inset: 0;
  background: inherit;
  border-radius: inherit;
  z-index: -1;
  filter: blur(20px);
  animation: glowPulse 2s ease-in-out infinite;
}
@keyframes glowRotate {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
@keyframes glowPulse {
  0%, 100% { opacity: 0.3; transform: scale(1); }
  50% { opacity: 0.6; transform: scale(1.1); }
}

/* ===== SHIMMER EFFECT ===== */
.shimmer { position: relative; overflow: hidden; }
.shimmer::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);
  animation: shimmer 2s infinite;
}
@keyframes shimmer { 100% { left: 100%; } }

/* ===== FLOATING ELEMENTS AVANÇADO ===== */
.floating-advanced { animation: floatAdvanced 6s ease-in-out infinite; }
.floating-advanced.delay-1 { animation-delay: 0s; }
.floating-advanced.delay-2 { animation-delay: 1.5s; }
.floating-advanced.delay-3 { animation-delay: 3s; }
@keyframes floatAdvanced {
  0%, 100% { transform: translateY(0px) rotate(0deg); }
  25% { transform: translateY(-20px) rotate(2deg); }
  50% { transform: translateY(-10px) rotate(0deg); }
  75% { transform: translateY(-25px) rotate(-2deg); }
}

/* ===== GRADIENT SHIFT ANIMADO ===== */
.gradient-shift {
  background: linear-gradient(-45deg, #6366f1, #06b6d4, #f59e0b, #6366f1);
  background-size: 400% 400%;
  animation: gradientShift 15s ease infinite;
}
@keyframes gradientShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ===== MORPHING SHAPE ===== */
.morph-shape {
  animation: morph 8s ease-in-out infinite;
  border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
}
@keyframes morph {
  0%, 100% { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; }
  50% { border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%; }
}

/* ===== TEXT REVEAL LETTER BY LETTER ===== */
.text-reveal { display: inline-flex; overflow: hidden; }
.text-reveal span {
  opacity: 0;
  transform: translateY(50px);
  animation: revealLetter 0.5s forwards;
}
@keyframes revealLetter {
  to { opacity: 1; transform: translateY(0); }
}

/* ===== HOVER LIFT COM SOMBRA DINÂMICA ===== */
.hover-lift { transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
.hover-lift:hover {
  transform: translateY(-8px) scale(1.02);
  box-shadow: 0 20px 40px rgba(99, 102, 241, 0.3), 0 0 60px rgba(99, 102, 241, 0.1);
}

/* ===== RIPPLE EFFECT ===== */
.ripple { position: relative; overflow: hidden; }
.ripple::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  transform: translate(-50%, -50%);
  transition: width 0.6s, height 0.6s;
}
.ripple:active::before {
  width: 300px;
  height: 300px;
}

/* ===== PARALLAX SUAVE ===== */
.parallax-element { will-change: transform; }

/* ===== BORDER ANIMADA ===== */
.border-animated { position: relative; }
.border-animated::before {
  content: '';
  position: absolute;
  inset: 0;
  border: 2px solid transparent;
  border-radius: inherit;
  background: linear-gradient(135deg, #6366f1, #06b6d4) border-box;
  -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: borderRotate 3s linear infinite;
  background-size: 200% 200%;
}
@keyframes borderRotate {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ===== FADE IN SEQUENCIAL ===== */
.fade-sequential > * {
  opacity: 0;
  animation: fadeInSeq 0.6s forwards;
}
.fade-sequential > *:nth-child(1) { animation-delay: 0.1s; }
.fade-sequential > *:nth-child(2) { animation-delay: 0.2s; }
.fade-sequential > *:nth-child(3) { animation-delay: 0.3s; }
.fade-sequential > *:nth-child(4) { animation-delay: 0.4s; }
.fade-sequential > *:nth-child(5) { animation-delay: 0.5s; }
@keyframes fadeInSeq {
  to { opacity: 1; transform: translateY(0); }
}

/* ===== GLOW TRAIL (RASTRO DE LUZ) ===== */
.glow-trail { position: relative; }
.glow-trail::after {
  content: '';
  position: absolute;
  inset: 0;
  background: inherit;
  filter: blur(20px);
  opacity: 0;
  animation: glowTrail 2s ease-out infinite;
}
@keyframes glowTrail {
  0% { opacity: 0.6; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.5); }
}

/* ===== SLIDE UP COM STAGGER ===== */
.stagger-container > * {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.6s cubic-bezier(0.5, 0, 0, 1);
}
.stagger-container.active > *:nth-child(1) { opacity: 1; transform: translateY(0); transition-delay: 0.1s; }
.stagger-container.active > *:nth-child(2) { opacity: 1; transform: translateY(0); transition-delay: 0.2s; }
.stagger-container.active > *:nth-child(3) { opacity: 1; transform: translateY(0); transition-delay: 0.3s; }
.stagger-container.active > *:nth-child(4) { opacity: 1; transform: translateY(0); transition-delay: 0.4s; }
.stagger-container.active > *:nth-child(5) { opacity: 1; transform: translateY(0); transition-delay: 0.5s; }

/* ===== MAGNETIC BUTTON ===== */
.magnetic-btn { transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); }

/* ===== TYPOGRAPHY ANIMATIONS ===== */
.typing-effect {
  overflow: hidden;
  border-right: 3px solid #6366f1;
  white-space: nowrap;
  animation: typing 3.5s steps(40, end), blink-caret 0.75s step-end infinite;
  display: inline-block;
}
@keyframes typing { from { width: 0 } to { width: 100% } }
@keyframes blink-caret { from, to { border-color: transparent } 50% { border-color: #6366f1; } }

/* ===== CONNECTOR LINES ===== */
.connector-line {
  position: absolute;
  height: 2px;
  background: linear-gradient(90deg, transparent, #6366f1, transparent);
  opacity: 0;
  animation: lineExpand 2s ease-out forwards;
}
@keyframes lineExpand {
  0% { width: 0; opacity: 0; }
  50% { opacity: 0.6; }
  100% { width: 100%; opacity: 0.3; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1200px) {
  .hero-title { font-size: 2.25rem; }
  .section-title { font-size: 1.875rem; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 1024px) {
  .about-grid, .contact-grid { grid-template-columns: 1fr; gap: 3rem; }
  .footer-bottom { flex-direction: column; text-align: center; }
}
@media (max-width: 768px) {
  :root { --container-padding: 1.5rem; }
  .header-container { padding: 0 1.5rem; }
  .nav-list {
    position: fixed;
    top: 80px;
    left: 0;
    right: 0;
    background: #111827;
    flex-direction: column;
    padding: 1.5rem;
    gap: 1rem;
    box-shadow: 0 10px 25px rgba(0,0,0,0.5);
    transform: translateY(-150%);
    transition: var(--transition);
    z-index: 999;
  }
  .nav-list.active { transform: translateY(0); }
  .mobile-toggle { display: flex; }
  .hero { padding: 0rem 0 4rem; }
  .hero-title { font-size: 1.875rem; }
  .hero-subtitle { font-size: 1.125rem; }
  .hero-actions { flex-direction: column; align-items: center; }
  .hero-stats { grid-template-columns: 1fr; gap: 1rem; }
  .section { padding: 2rem 0; }
  .section-title { font-size: 1.5rem; }
  .form-row { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; text-align: center; }
  .footer-certifications { justify-content: center; }
  .back-to-top { bottom: 1rem; right: 1rem; width: 56px; height: 56px; }
  .logo-image { height: 35px; }
  .services-grid { grid-template-columns: 1fr; }
  .typing-effect { white-space: normal; border-right: none; animation: none; }
  .particle { width: 3px; height: 3px; }
}
@media (max-width: 480px) {
  .hero-title { font-size: 1.5rem; }
  .section-title { font-size: 1.25rem; }
  .btn-lg { width: 100%; }
  .goto-card { padding: 1.5rem; }
}
@media (max-width: 1100px) {
  .services-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html { scroll-behavior: auto; }
}

/* ===== HEADER ===== */
.header{position:fixed;top:0;left:0;right:0;z-index:1000;padding:1rem 0;transition:var(--transition)}
.header.scrolled{padding:0.5rem 0;background:rgba(17,24,39,0.95);box-shadow:0 10px 25px rgba(0,0,0,0.5)}
.header-container{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.logo{display:flex;align-items:center;gap:6px;font-size:1.25rem;font-weight:800;color:#f9fafb;position:relative;text-decoration:none}
.logo-image{height:40px;width:auto;object-fit:contain;transition:var(--transition);filter:drop-shadow(0 0 8px rgba(6,182,212,0.3))}
.logo:hover .logo-image{transform:scale(1.05);filter:drop-shadow(0 0 12px rgba(6,182,212,0.5))}
.logo-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;background:var(--gradient-primary);border-radius:50%;filter:blur(20px);opacity:0.3;animation:pulse 3s infinite;z-index:-1}
@keyframes pulse{0%,100%{box-shadow:var(--shadow-glow)}50%{box-shadow:var(--shadow-glow-lg)}}

/* ===== NAV ===== */
.nav-list{display:flex;align-items:center;gap:1.5rem}
.nav-link{font-weight:500;color:#d1d5db;padding:0.5rem 0;position:relative;transition:var(--transition)}
.nav-link:hover,.nav-link.active{color:#f9fafb}
.nav-link.active::after,.nav-link:hover::after{content:'';position:absolute;bottom:-4px;left:0;right:0;height:2px;background:var(--gradient-primary);border-radius:9999px}
.nav-link.featured{color:#06b6d4;font-weight:600;background:rgba(6,182,212,0.1);padding:0.25rem 0.75rem;border-radius:9999px}
.nav-dropdown{position:relative}
.dropdown-menu{position:absolute;top:100%;left:0;min-width:260px;background:#111827;border:1px solid var(--glass-border);border-radius:0.75rem;padding:0.5rem;box-shadow:0 10px 25px rgba(0,0,0,0.5);opacity:0;visibility:hidden;transform:translateY(10px);transition:all 0.3s ease;z-index:1001}
.nav-dropdown:hover .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown-item{display:flex;align-items:center;gap:0.5rem;padding:0.75rem 1rem;color:#9ca3af;font-size:0.875rem;transition:var(--transition);border-radius:0.5rem}
.dropdown-item:hover,.dropdown-item.active{background:rgba(99,102,241,0.1);color:#6366f1}
.mobile-toggle{display:none;width:40px;height:40px;position:relative;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.hamburger,.hamburger::before,.hamburger::after{content:'';width:24px;height:2px;background:#f9fafb;border-radius:2px;transition:var(--transition)}
.hamburger::before{position:absolute;top:-8px}.hamburger::after{position:absolute;top:8px}
.mobile-toggle.active .hamburger{background:transparent}
.mobile-toggle.active .hamburger::before{transform:rotate(45deg);top:0}
.mobile-toggle.active .hamburger::after{transform:rotate(-45deg);top:0}

/* ===== BUTTONS ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;padding:0.75rem 1.5rem;font-weight:600;font-size:1rem;border-radius:0.75rem;transition:var(--transition);position:relative;overflow:hidden}
.btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);transition:var(--transition)}
.btn:hover::before{left:100%}
.btn-primary{background:var(--gradient-primary);color:#f9fafb;box-shadow:0 4px 6px rgba(0,0,0,0.4),var(--shadow-glow)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(0,0,0,0.5),var(--shadow-glow-lg)}
.btn-outline{background:transparent;color:#6366f1;border:2px solid #6366f1}
.btn-outline:hover{background:#6366f1;color:#f9fafb;box-shadow:var(--shadow-glow)}
.btn-lg{padding:1rem 2rem;font-size:1.125rem}
.btn-sm{padding:0.5rem 1rem;font-size:0.875rem}
.btn-block{width:100%}
.glow-effect{box-shadow:var(--shadow-glow)}.glow-effect:hover{box-shadow:var(--shadow-glow-lg);transform:translateY(-2px)}

/* ===== HERO ===== */
.hero{position:relative;padding:0rem 0 5rem;min-height:91vh;display:flex;align-items:center;overflow:hidden}
.hero-content{position:relative;z-index:2;text-align:center;max-width:900px;margin:0 auto}
.hero-badge{display:inline-flex;align-items:center;gap:0.5rem;padding:0.5rem 1rem;background:rgba(99,102,241,0.15);border:1px solid rgba(99,102,241,0.3);color:#818cf8;font-size:0.875rem;font-weight:500;border-radius:9999px;margin-bottom:1.5rem;animation:fadeInUp 0.6s ease}
.hero-title{font-size:3rem;font-weight:800;color:#f9fafb;margin-bottom:1.5rem;line-height:1.1;animation:fadeInUp 0.6s ease 0.1s both}
.hero-subtitle{font-size:1.25rem;color:#d1d5db;margin-bottom:2rem;max-width:700px;margin:0 auto;animation:fadeInUp 0.6s ease 0.2s both}
.hero-actions{display:flex;gap:1rem;justify-content:center;margin-bottom:2rem;margin-top:2rem;flex-wrap:wrap;animation:fadeInUp 0.6s ease 0.3s both}
.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;padding:1.5rem;max-width:700px;margin:0 auto;animation:fadeInUp 0.6s ease 0.4s both}
.stat-card{padding:1rem;text-align:center;position:relative;overflow:hidden}
.stat-number{display:block;font-size:1.875rem;font-weight:800;color:#6366f1;margin-bottom:0.25rem;position:relative;z-index:1}
.stat-number-noCount{display:block;font-size:1.875rem;font-weight:800;color:#6366f1;margin-bottom:0.25rem;position:relative;z-index:1}
.stat-label{font-size:0.875rem;color:#9ca3af;position:relative;z-index:1}
.stat-glow{position:absolute;inset:0;background:var(--gradient-glow);opacity:0.1;border-radius:0.75rem;filter:blur(20px)}
.hero-float{position:absolute;font-size:2rem;color:#6366f1;opacity:0.2;animation:floatElement 6s infinite ease-in-out}
.float-1{top:20%;left:10%}.float-2{top:60%;right:15%;animation-delay:-2s}.float-3{bottom:20%;left:20%;animation-delay:-4s}
@keyframes floatElement{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}
@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}100%{opacity:1;transform:translateY(0)}}

/* ===== SECTIONS ===== */
.section{padding:3rem 0}
.section-header{margin-bottom:4rem;max-width:800px}
.section-tag{display:inline-flex;align-items:center;gap:0.5rem;padding:0.5rem 1rem;background:rgba(99,102,241,0.15);border:1px solid rgba(99,102,241,0.3);color:#818cf8;font-size:0.875rem;font-weight:600;border-radius:9999px;margin-bottom:1rem}
.section-title{font-size:2.25rem;font-weight:800;color:#f9fafb;margin-bottom:1rem;line-height:1.2}
.section-description{font-size:1.125rem;color:#d1d5db}
.text-center{text-align:center}
.text-gradient{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.gradient-animated{background:linear-gradient(135deg,#6366f1,#06b6d4,#6366f1);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 8s ease infinite}
@keyframes gradientShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

/* ===== SERVICES GRID ===== */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;max-width:1400px;margin:0 auto;padding:0 var(--container-padding)}
.service-card{padding:2rem;position:relative;transition:var(--transition);overflow:hidden;display:flex;flex-direction:column;cursor:pointer}
.service-card:hover{transform:translateY(-8px);border-color:#6366f1;box-shadow:0 10px 25px rgba(0,0,0,0.5),var(--shadow-glow)}
.service-card-glow{position:absolute;inset:0;background:var(--gradient-glow);opacity:0;transition:var(--transition);border-radius:1.25rem}
.service-card:hover .service-card-glow{opacity:0.1}
.service-card.featured{border:2px solid #6366f1;background:linear-gradient(135deg,rgba(99,102,241,0.1),rgba(6,182,212,0.1))}
.service-badge{position:absolute;top:1rem;right:1rem;padding:0.25rem 0.75rem;background:var(--gradient-primary);color:#f9fafb;font-size:0.75rem;font-weight:600;border-radius:9999px;display:flex;align-items:center;gap:0.25rem}
.service-icon-wrapper{position:relative;margin-bottom:1.5rem}
.service-icon{width:72px;height:72px;display:flex;align-items:center;justify-content:center;background:var(--gradient-primary);color:#f9fafb;border-radius:1.25rem;font-size:1.5rem;position:relative;z-index:2;transition:var(--transition);box-shadow:0 4px 12px rgba(99,102,241,0.3)}
.service-card:hover .service-icon{transform:scale(1.1)}
.service-icon.gradient-border{border:3px solid transparent;background:var(--gradient-primary) padding-box,var(--gradient-primary) border-box}
.service-icon-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:96px;height:96px;border:2px solid #6366f1;border-radius:50%;opacity:0.3;animation:pulseRing 2s infinite}
.service-icon-ring.animated{animation:pulseRing 1.5s infinite}
@keyframes pulseRing{0%{transform:translate(-50%,-50%) scale(0.8);opacity:0.5}100%{transform:translate(-50%,-50%) scale(1.5);opacity:0}}
.service-title{font-size:1.25rem;font-weight:700;color:#f9fafb;margin-bottom:0.75rem}
.service-desc{color:#d1d5db;margin-bottom:1rem;font-size:0.875rem;line-height:1.6}
.service-features{margin-bottom:1.5rem}
.service-features li{display:flex;align-items:flex-start;gap:0.5rem;font-size:0.875rem;color:#d1d5db;margin-bottom:0.5rem}
.service-features i{color:#10b981;margin-top:3px}
.service-cta{display:inline-flex;align-items:center;gap:0.5rem;font-weight:600;color:#6366f1;font-size:0.875rem;transition:var(--transition);margin-top:auto}
.service-cta i{transition:all 0.15s ease-in-out}
.service-cta:hover{color:#818cf8}.service-cta:hover i{transform:translateX(4px)}
.service-cta.featured{color:#06b6d4}

/* ===== ABOUT ===== */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.about-text{color:#d1d5db;margin-bottom:1rem}
.about-text strong{color:#f9fafb}
.about-highlights{margin:2rem 0;display:grid;gap:1rem}
.highlight-card{display:flex;gap:1rem;padding:1rem;align-items:flex-start;transition:var(--transition)}
.highlight-card:hover{transform:translateX(8px)}
.highlight-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--gradient-primary);color:#f9fafb;border-radius:0.75rem;font-size:1.125rem;flex-shrink:0}
.highlight-card strong{display:block;color:#f9fafb;margin-bottom:0.25rem}
.highlight-card span{font-size:0.875rem;color:#9ca3af}
.about-visual{position:relative}
.about-card{padding:0;position:relative;overflow:hidden}
.about-card-glow{position:absolute;inset:0;background:var(--gradient-glow);opacity:0.1;border-radius:1.25rem;filter:blur(30px)}
.about-image-placeholder{background:#1f2937;aspect-ratio:4/3;width:100%;min-height:100%;border-radius:1.25rem;display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;color:#9ca3af;gap:0.75rem;overflow:hidden}
.about-image{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.about-badge{position:absolute;bottom:1rem;left:1rem;background:var(--glass-bg);padding:0.75rem 1rem;border-radius:0.75rem;display:flex;flex-direction:column;align-items:center;gap:0.15rem;border:1px solid var(--glass-border)}
.badge-number{font-size:1.5rem;font-weight:800;color:#6366f1}
.badge-text{font-size:0.875rem;color:#9ca3af}
.float-stat{position:absolute;padding:0.75rem 1rem;display:flex;align-items:center;gap:0.75rem;animation:floatStat 4s infinite ease-in-out}
.float-stat:nth-child(2){top:20%;right:-20px;animation-delay:-1s}
.float-stat:nth-child(3){bottom:20%;right:-20px;animation-delay:-2s}
@keyframes floatStat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.float-stat i{font-size:1.25rem;color:#06b6d4}
.float-stat strong{display:block;font-size:1.125rem;font-weight:700;color:#f9fafb}
.float-stat span{font-size:0.75rem;color:#9ca3af}

/* ===== GOTO CTA ===== */
.goto-cta{background:linear-gradient(135deg,#0f172a,#1e293b)}
.goto-card{padding:2.5rem;text-align:center;position:relative;overflow:hidden;max-width:900px;margin:0 auto}
.goto-card-glow{position:absolute;inset:0;background:var(--gradient-glow);opacity:0.15;border-radius:1.75rem;filter:blur(40px)}
.goto-logo{display:flex;flex-direction:column;align-items:center;gap:0.75rem;margin-bottom:1.5rem}
.goto-logo i{color:#06b6d4;animation:pulse 2s infinite}
.goto-partner{font-size:0.875rem;color:#9ca3af;background:rgba(6,182,212,0.1);padding:0.25rem 0.75rem;border-radius:9999px;border:1px solid rgba(6,182,212,0.3)}
.goto-card h3{font-size:1.5rem;font-weight:700;color:#f9fafb;margin-bottom:1rem}
.goto-desc{color:#d1d5db;margin-bottom:2rem;font-size:1.125rem;max-width:700px;margin:0 auto}
.goto-features{display:flex;flex-wrap:wrap;justify-content:center;gap:0.75rem;margin-bottom:2rem}
.feature-tag{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 1rem;background:rgba(99,102,241,0.1);border:1px solid rgba(99,102,241,0.3);color:#d1d5db;font-size:0.875rem;border-radius:9999px;transition:var(--transition)}
.feature-tag:hover{background:rgba(99,102,241,0.2);border-color:#6366f1;color:#f9fafb}
.feature-tag i{color:#10b981}

/* ===== TESTIMONIALS ===== */
.testimonials-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:2rem;margin-bottom:4rem}
.testimonial-card{padding:1.5rem;position:relative;transition:var(--transition)}
.testimonial-card:hover{transform:translateY(-4px)}
.testimonial-card-glow{position:absolute;inset:0;background:var(--gradient-glow);opacity:0.05;border-radius:1.25rem;filter:blur(20px)}
.testimonial-rating{color:#f59e0b;margin-bottom:1rem}
.testimonial-text{font-style:italic;color:#d1d5db;margin-bottom:1rem;line-height:1.8}
.testimonial-author{display:flex;align-items:center;gap:0.75rem}
.author-avatar{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--gradient-primary);color:#f9fafb;border-radius:9999px;font-size:1.125rem}
.testimonial-author strong{display:block;color:#f9fafb;font-weight:600}
.testimonial-author span{font-size:0.875rem;color:#9ca3af}
.clients-section{text-align:center;margin-top:3rem}
.clients-label{color:#9ca3af;margin-bottom:1.5rem;font-size:0.875rem}
.logo-marquee{overflow:hidden;mask:linear-gradient(90deg,transparent,black 20%,black 80%,transparent)}
.logo-track{display:flex;gap:2rem;animation:marquee 30s linear infinite}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.logo-item{padding:1rem;display:flex;align-items:center;justify-content:center;color:#9ca3af;opacity:0.6;transition:var(--transition);min-width:120px}
.logo-item:hover{opacity:1;color:#6366f1;transform:scale(1.1)}

/* ===== CONTACT ===== */
.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:3rem;align-items:start}
.contact-text{color:#d1d5db;margin-bottom:2rem}
.contact-details{margin-bottom:2rem}
.contact-item{display:flex;gap:1rem;margin-bottom:1rem}
.contact-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--gradient-primary);color:#f9fafb;border-radius:0.75rem;font-size:1.125rem;flex-shrink:0}
.contact-item strong{display:block;color:#f9fafb;margin-bottom:0.25rem}
.contact-item span{color:#9ca3af;font-size:0.875rem;line-height:1.6}
.contact-item a{color:#06b6d4;transition:var(--transition)}.contact-item a:hover{color:#22d3ee}
.social-links{display:flex;gap:0.75rem}
.social-link{width:48px;height:48px;display:flex;align-items:center;justify-content:center;color:#f9fafb;transition:var(--transition);font-size:1.125rem}
.social-link:hover{background:var(--gradient-primary);transform:translateY(-4px);box-shadow:var(--shadow-glow)}
.contact-form-wrapper{padding:2rem;position:relative;overflow:hidden}
.contact-form-glow{position:absolute;inset:0;background:var(--gradient-glow);opacity:0.05;border-radius:1.25rem;filter:blur(30px)}
.form-header{text-align:center;margin-bottom:1.5rem}
.form-header h3{font-size:1.25rem;font-weight:700;color:#f9fafb;margin-bottom:0.5rem}
.form-header p{color:#9ca3af;font-size:0.875rem}
.contact-form{display:flex;flex-direction:column;gap:1rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form-group label{display:block;font-weight:500;color:#d1d5db;margin-bottom:0.5rem;font-size:0.875rem}
.form-group .required{color:#ef4444}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:0.75rem 1rem;background:rgba(31,41,55,0.5);border:1px solid var(--glass-border);border-radius:0.75rem;font-size:1rem;color:#f9fafb;transition:var(--transition)}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#6366f1;background:rgba(31,41,55,0.8);box-shadow:0 0 0 3px rgba(99,102,241,0.2)}
.form-group select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%239ca3af' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10l-5 5z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center}
.form-consent{display:flex;gap:0.5rem;align-items:flex-start}
.form-consent input{margin-top:4px}
.form-consent label{font-size:0.875rem;color:#9ca3af}
.form-consent a{color:#6366f1;text-decoration:underline}
.form-note{color:#9ca3af;font-size:0.75rem;text-align:center;margin-top:0.5rem}

/* ===== FOOTER ===== */
.footer{background:#111827;border-top:1px solid var(--glass-border);padding:4rem 0 2rem;position:relative;overflow:hidden}
.footer-glow{position:absolute;top:0;left:0;right:0;height:1px;background:var(--gradient-primary);opacity:0.5}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2rem;margin-bottom:3rem}
.footer-brand .logo{color:#f9fafb;margin-bottom:1rem}
.footer-desc{margin-bottom:1.5rem;color:#d1d5db;line-height:1.7}
.footer-certifications{display:flex;gap:0.75rem;flex-wrap:wrap}
.cert-badge{display:flex;align-items:center;gap:0.25rem;padding:0.25rem 0.75rem;background:rgba(99,102,241,0.1);border:1px solid rgba(99,102,241,0.3);color:#9ca3af;font-size:0.75rem;border-radius:9999px}
.cert-badge .microsoft-logo{width:0.875rem;height:0.875rem;flex:0 0 auto}
.footer-links h4,.footer-legal h4{color:#f9fafb;font-weight:600;margin-bottom:1rem;display:flex;align-items:center;gap:0.5rem}
.footer-links ul,.footer-legal ul{display:flex;flex-direction:column;gap:0.5rem}
.footer-links a,.footer-legal a{display:flex;align-items:center;gap:0.5rem;color:#9ca3af;font-size:0.875rem;transition:var(--transition)}
.footer-links a:hover,.footer-legal a:hover{color:#6366f1;transform:translateX(4px)}
.footer-links i,.footer-legal i{font-size:0.75rem;opacity:0.7}
.footer-bottom{padding-top:2rem;border-top:1px solid var(--glass-border);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.footer-bottom p{font-size:0.875rem;color:#9ca3af}
.footer-bottom strong{color:#d1d5db}
.footer-disclaimer{opacity:0.7}
.footer-social{display:flex;gap:0.75rem}
.footer-social a{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#1f2937;color:#d1d5db;border-radius:0.75rem;transition:var(--transition)}
.footer-social a:hover{background:var(--gradient-primary);color:#f9fafb;transform:translateY(-2px)}

/* ===== BACK TO TOP ===== */
.back-to-top{position:fixed;bottom:1.5rem;right:1.5rem;width:56px;height:56px;display:flex;align-items:center;justify-content:center;color:#f9fafb;font-size:1.125rem;border-radius:9999px;transition:var(--transition);opacity:0;visibility:hidden;z-index:999}
.back-to-top.visible{opacity:1;visibility:visible}
.back-to-top:hover{background:var(--gradient-primary);transform:translateY(-4px);box-shadow:var(--shadow-glow)}

/* ===== CONTACT MOBILE POLISH ===== */
@media (max-width: 768px) {
  .contact.section {
    padding: 3.5rem 0;
  }

  .contact-grid {
    grid-template-columns: 1fr;
    gap: 1.75rem;
  }

  .contact-info .section-title {
    font-size: 1.75rem;
    line-height: 1.18;
  }

  .contact-text {
    font-size: 0.95rem;
    margin-bottom: 1.5rem;
  }

  .contact-details {
    display: grid;
    gap: 0.875rem;
    margin-bottom: 1.5rem;
  }

  .contact-item {
    align-items: flex-start;
    gap: 0.875rem;
    margin-bottom: 0;
    padding: 1rem;
    background: rgba(31,41,55,0.55);
    border: 1px solid var(--glass-border);
    border-radius: 0.875rem;
  }

  .contact-icon {
    width: 42px;
    height: 42px;
    border-radius: 0.75rem;
    font-size: 1rem;
  }

  .contact-item span {
    font-size: 0.82rem;
    overflow-wrap: anywhere;
  }

  .social-links {
    justify-content: center;
  }

  .contact-form-wrapper {
    padding: 1.25rem;
    border-radius: 1rem;
  }

  .form-header h3 {
    font-size: 1.125rem;
  }

  .form-header p,
  .form-note {
    font-size: 0.8rem;
  }

  .form-row {
    grid-template-columns: 1fr;
    gap: 0.875rem;
  }

  .contact-form {
    gap: 0.875rem;
  }

  .form-group input,
  .form-group select,
  .form-group textarea {
    min-height: 48px;
    padding: 0.8rem 0.875rem;
    font-size: 1rem;
  }

  .form-group textarea {
    min-height: 128px;
  }

  .form-consent {
    padding: 0.875rem;
    background: rgba(31,41,55,0.45);
    border: 1px solid var(--glass-border);
    border-radius: 0.875rem;
  }

  .form-consent label {
    font-size: 0.78rem;
    line-height: 1.5;
  }
}

@media (max-width: 480px) {
  .contact-info .section-tag {
    max-width: 100%;
  }

  .contact-info .section-title {
    font-size: 1.5rem;
  }

  .contact-item {
    padding: 0.875rem;
  }

  .contact-form-wrapper {
    padding: 1rem;
  }

  .social-link {
    width: 44px;
    height: 44px;
  }
}

.cert-badge i { color: #f59e0b; }

/* ===== GLOBAL MOBILE HARDENING ===== */
@media (max-width: 900px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  :root {
    --container-padding: 1rem;
  }

  .site-container {
    max-width: 100%;
    padding-left: var(--container-padding);
    padding-right: var(--container-padding);
  }

  .glass {
    border-radius: 1rem;
  }

  .section {
    padding: 3.5rem 0;
  }

  .section-header {
    margin-bottom: 2rem;
  }

  .section-tag {
    max-width: 100%;
    align-items: center;
    white-space: normal;
  }

  .section-title,
  .hero-title {
    overflow-wrap: anywhere;
  }

  .section-title {
    font-size: 1.75rem;
    line-height: 1.18;
  }

  .section-description {
    font-size: 0.98rem;
  }

  .btn,
  .btn-lg {
    width: 100%;
    min-height: 48px;
    padding: 0.875rem 1rem;
    text-align: center;
  }

  .header {
    padding: 0.75rem 0;
  }

  .header-container {
    padding-left: 1rem;
    padding-right: 1rem;
    gap: 0.75rem;
  }

  .logo {
    min-width: 0;
  }

  .logo-text {
    font-size: 1.05rem;
  }

  .logo-image {
    height: 34px;
  }

  .mobile-toggle {
    display: flex;
    flex-shrink: 0;
  }

  .nav {
    margin-left: auto;
  }

  .nav-list {
    position: fixed;
    top: 68px;
    left: 1rem;
    right: 1rem;
    width: auto;
    max-height: calc(100vh - 88px);
    overflow-y: auto;
    align-items: stretch;
    gap: 0.375rem;
    padding: 1rem;
    background: rgba(17,24,39,0.98);
    border: 1px solid var(--glass-border);
    border-radius: 1rem;
    box-shadow: 0 20px 50px rgba(0,0,0,0.45);
    transform: translateY(-130%);
    z-index: 1200;
  }

  .nav-list.active {
    transform: translateY(0);
  }

  .nav-list li,
  .nav-dropdown {
    width: 100%;
  }

  .nav-link {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 0.875rem;
    border-radius: 0.75rem;
  }

  .nav-link::after {
    display: none;
  }

  .nav-link:hover,
  .nav-link.active,
  .nav-link.featured {
    background: rgba(99,102,241,0.12);
  }

  .dropdown-menu {
    position: static;
    min-width: 0;
    width: 100%;
    opacity: 1;
    visibility: visible;
    transform: none;
    margin-top: 0.25rem;
    padding: 0.35rem;
    background: rgba(10,14,23,0.55);
    box-shadow: none;
  }

  .dropdown-item {
    width: 100%;
    min-height: 42px;
  }

  .hero {
    min-height: auto;
    padding: 2rem 0 3rem;
    align-items: flex-start;
  }

  .hero-content {
    width: 100%;
    padding: 0 1rem;
  }

  .hero-title {
    font-size: 2rem;
    line-height: 1.12;
  }

  .hero-subtitle {
    font-size: 1rem;
    line-height: 1.65;
  }

  .hero-actions {
    gap: 0.75rem;
    margin: 1.5rem 0;
  }

  .hero-stats {
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 420px;
    padding: 0;
    gap: 0.75rem;
  }

  .hero-float {
    display: none;
  }

  .services-grid,
  .about-grid,
  .contact-grid,
  .testimonials-grid,
  .footer-grid {
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 100%;
    gap: 1rem;
    padding-left: 0;
    padding-right: 0;
  }

  .service-card,
  .testimonial-card,
  .contact-form-wrapper,
  .goto-card {
    padding: 1.25rem;
  }

  .service-badge {
    position: static;
    width: fit-content;
    margin-left: auto;
    margin-bottom: 0.75rem;
  }

  .service-icon-wrapper {
    min-height: 86px;
    margin-bottom: 1rem;
  }

  .service-title {
    font-size: 1.125rem;
  }

  .service-desc,
  .service-features li,
  .testimonial-text,
  .about-text {
    font-size: 0.9rem;
  }

  .about-visual {
    display: grid;
    gap: 0.75rem;
  }

  .about-image-placeholder {
    aspect-ratio: 16 / 10;
  }

  .about-badge {
    bottom: 0.75rem;
    left: 0.75rem;
    padding: 0.6rem 0.75rem;
  }

  .badge-number {
    font-size: 1.25rem;
  }

  .badge-text {
    font-size: 0.75rem;
  }

  .about-visual > .float-stat {
    position: static;
    transform: none;
    animation: none;
    width: 100%;
  }

  .highlight-card,
  .testimonial-author,
  .contact-item {
    align-items: flex-start;
  }

  .highlight-card {
    padding: 0.875rem;
  }

  .highlight-icon,
  .contact-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
  }

  .testimonials-grid {
    margin-bottom: 2rem;
  }

  .testimonial-author {
    min-width: 0;
  }

  .testimonial-author div {
    min-width: 0;
  }

  .testimonial-author strong,
  .testimonial-author span,
  .contact-item span,
  .footer-desc,
  .footer-disclaimer {
    overflow-wrap: anywhere;
  }

  .logo-marquee {
    mask: none;
  }

  .logo-track {
    gap: 0.75rem;
  }

  .logo-item {
    min-width: 78px;
    padding: 0.75rem;
  }

  .contact-form-wrapper {
    width: 100%;
  }

  .form-row {
    grid-template-columns: 1fr;
  }

  .form-group input,
  .form-group select,
  .form-group textarea {
    max-width: 100%;
  }

  .footer {
    padding: 3rem 0 2rem;
  }

  .footer-grid,
  .footer-brand,
  .footer-links,
  .footer-legal {
    text-align: left;
  }

  .footer-brand .logo {
    justify-content: flex-start;
  }

  .footer-certifications {
    justify-content: flex-start;
    gap: 0.5rem;
  }

  .cert-badge {
    min-height: 32px;
  }

  .footer-bottom {
    text-align: center;
  }

  .footer-social {
    justify-content: center;
  }
}

@media (max-width: 480px) {
  :root {
    --container-padding: 0.875rem;
  }

  .section {
    padding: 3rem 0;
  }

  .section-title,
  .contact-info .section-title {
    font-size: 1.45rem;
  }

  .hero-title {
    font-size: 1.65rem;
  }

  .hero-badge,
  .section-tag {
    font-size: 0.78rem;
    padding: 0.45rem 0.75rem;
  }

  .service-card,
  .testimonial-card,
  .contact-form-wrapper,
  .goto-card {
    padding: 1rem;
  }

  .contact-item {
    padding: 0.875rem;
  }

  .footer-certifications {
    flex-direction: column;
    align-items: stretch;
  }

  .cert-badge {
    justify-content: center;
  }
}