/* ==========================================================================
   HERO BANNER
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@900&display=swap');
@keyframes fadeInUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@keyframes orbFloatA{0%,100%{transform:translate3d(var(--mx,0px),var(--my,0px),0) translate(-10%, -8%) scale(1)}50%{transform:translate3d(var(--mx,0px),var(--my,0px),0) translate(8%, 10%) scale(1.08)}}
@keyframes orbFloatB{0%,100%{transform:translate3d(calc(var(--mx,0px)*-1),calc(var(--my,0px)*-1),0) translate(12%, -6%) scale(1.02)}50%{transform:translate3d(calc(var(--mx,0px)*-1),calc(var(--my,0px)*-1),0) translate(-10%, 12%) scale(1.1)}}
@keyframes starDrift{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(-120px,70px,0)}}
@keyframes gridMove{0%{background-position:0 0, 0 0, 0 0}100%{background-position:0 0, 240px 0, 0 240px}}
@keyframes shimmer{0%,100%{opacity:.15}50%{opacity:.32}}
@keyframes orbitSpin{to{transform:translate3d(var(--mx,0px),var(--my,0px),0) rotate(360deg)}}
@keyframes planetSpin{to{transform:rotate(360deg)}}
@keyframes portalSpin{to{transform:translate3d(var(--mx,0px),var(--my,0px),0) rotate(360deg)}}
@keyframes portalPulse{0%,100%{opacity:.55;filter:blur(0px)}50%{opacity:.9;filter:blur(1px)}}
@keyframes scanSweep{0%{transform:translateY(-120%);opacity:0}10%{opacity:.45}60%{opacity:.18}100%{transform:translateY(120%);opacity:0}}
@keyframes meteorFly{0%{transform:translate3d(120%, -80%,0) rotate(18deg);opacity:0}8%{opacity:.9}60%{opacity:.25}100%{transform:translate3d(-140%, 140%,0) rotate(18deg);opacity:0}}
@keyframes borderRun{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes bgZoom{0%{transform:scale(1)}100%{transform:scale(1.15)}}

.hero-bg-media{position:absolute;inset:-5%;z-index:0;background:url('http://localhost/DichVuSEO247/wp-content/uploads/2026/03/Ai.jpg') center/cover;opacity:.35;animation:bgZoom 20s ease-in-out infinite alternate;pointer-events:none}
.hero-banner{position:relative;min-height:90vh;display:flex;align-items:center;justify-content:center;padding:4rem 1.5rem;overflow:hidden;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.hero-bg{position:absolute;inset:0;z-index:0;isolation:isolate;overflow:hidden;background:linear-gradient(-45deg,#0b1224,#111a2f,#0a1224,#102644);background-size:400% 400%;animation:gradientShift 14s ease infinite}
.hero-bg::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 80% 55% at 50% 0%,rgba(56,189,248,.20) 0%,transparent 55%),
    radial-gradient(circle at 20% 20%, rgba(168,85,247,.18), transparent 50%),
    radial-gradient(circle at 80% 15%, rgba(34,211,238,.14), transparent 48%),
    radial-gradient(circle at 10% 80%, rgba(56,189,248,.10), transparent 55%),
    radial-gradient(circle at 75% 75%, rgba(168,85,247,.10), transparent 55%);
  pointer-events:none;z-index:1;mix-blend-mode:screen;opacity:.95;
}
.hero-bg::after{
  content:'';position:absolute;inset:-1px;
  background-image:
    linear-gradient(rgba(2,6,23,.25), rgba(2,6,23,.75)),
    repeating-linear-gradient(to right, rgba(148,163,184,.14) 0, rgba(148,163,184,.14) 1px, transparent 1px, transparent 34px),
    repeating-linear-gradient(to bottom, rgba(148,163,184,.12) 0, rgba(148,163,184,.12) 1px, transparent 1px, transparent 34px);
  opacity:.26;z-index:2;pointer-events:none;animation:gridMove 10s linear infinite;
  mask-image:radial-gradient(circle at 50% 30%, rgba(0,0,0,.95) 0%, rgba(0,0,0,.25) 55%, rgba(0,0,0,0) 78%);
}
.hero-bg-stars{
  position:absolute;inset:-60px;
  background-image:
    radial-gradient(2px 2px at 20% 30%, rgba(255,255,255,.75), transparent 60%),
    radial-gradient(1px 1px at 70% 20%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(1.5px 1.5px at 40% 80%, rgba(255,255,255,.6), transparent 60%),
    radial-gradient(1px 1px at 85% 60%, rgba(255,255,255,.45), transparent 60%),
    radial-gradient(2px 2px at 10% 70%, rgba(255,255,255,.5), transparent 60%),
    radial-gradient(1.5px 1.5px at 55% 55%, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(1px 1px at 30% 15%, rgba(255,255,255,.4), transparent 60%),
    radial-gradient(2px 2px at 90% 12%, rgba(255,255,255,.35), transparent 60%);
  opacity:.35;z-index:0;animation:starDrift 22s linear infinite;filter:blur(.2px);pointer-events:none;
}
.hero-holo{
  position:absolute;inset:0;z-index:4;pointer-events:none;opacity:.22;
  background:
    repeating-linear-gradient(to bottom, rgba(34,211,238,.10) 0, rgba(34,211,238,.10) 1px, transparent 2px, transparent 6px),
    radial-gradient(circle at 50% 30%, rgba(56,189,248,.10), transparent 60%);
  mix-blend-mode:screen;
  mask-image:radial-gradient(circle at 50% 35%, rgba(0,0,0,.95) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,0) 80%);
}
.hero-scan{position:absolute;inset:-20%;z-index:5;pointer-events:none;background:linear-gradient(to bottom, transparent 0%, rgba(56,189,248,.35) 45%, rgba(168,85,247,.20) 55%, transparent 100%);opacity:0;filter:blur(0.3px);animation:scanSweep 4.8s ease-in-out infinite;}
.hero-meteors{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.9;}
.meteor{position:absolute;width:240px;height:2px;border-radius:9999px;background:linear-gradient(90deg, rgba(56,189,248,0), rgba(56,189,248,.85), rgba(255,255,255,.9), rgba(168,85,247,.0));filter:drop-shadow(0 0 14px rgba(56,189,248,.35));opacity:0;animation:meteorFly var(--md,6.5s) linear infinite;animation-delay:var(--dl,0s);}
.meteor.m1{top:18%;left:10%;--md:7.5s;--dl:0s}
.meteor.m2{top:38%;left:62%;--md:8.5s;--dl:1.6s;filter:drop-shadow(0 0 14px rgba(168,85,247,.35))}
.meteor.m3{top:62%;left:28%;--md:9s;--dl:3.1s;opacity:0}
.hero-portal{position:absolute;left:50%;top:44%;width:min(62vmin,620px);height:min(62vmin,620px);margin-left:calc(min(62vmin,620px) / -2);margin-top:calc(min(62vmin,620px) / -2);z-index:1;pointer-events:none;opacity:.95;transform:translateZ(0);filter:drop-shadow(0 0 28px rgba(56,189,248,.18));}
.hero-portal::before{content:'';position:absolute;inset:-2px;border-radius:9999px;background:conic-gradient(from 180deg,rgba(56,189,248,.0),rgba(56,189,248,.55),rgba(168,85,247,.35),rgba(34,211,238,.45),rgba(56,189,248,.0));animation:portalSpin 10.5s linear infinite;opacity:calc(.55 + var(--portal,0) * .35);mask-image:radial-gradient(circle at 50% 50%, transparent 58%, rgba(0,0,0,.95) 60%);}
.hero-portal::after{content:'';position:absolute;inset:10%;border-radius:9999px;background:radial-gradient(circle at 50% 50%, rgba(56,189,248,.22), rgba(56,189,248,0) 55%),radial-gradient(circle at 30% 60%, rgba(168,85,247,.18), rgba(168,85,247,0) 60%),radial-gradient(circle at 60% 35%, rgba(34,211,238,.14), rgba(34,211,238,0) 60%);animation:portalPulse 3.6s ease-in-out infinite;mix-blend-mode:screen;}
.hero-portal-core{position:absolute;left:50%;top:44%;width:min(16vmin,150px);height:min(16vmin,150px);margin-left:calc(min(16vmin,150px) / -2);margin-top:calc(min(16vmin,150px) / -2);border-radius:9999px;background:radial-gradient(circle at 40% 35%, rgba(255,255,255,.85), rgba(56,189,248,.35) 35%, rgba(56,189,248,0) 70%);opacity:.9;filter:blur(.3px) drop-shadow(0 0 35px rgba(56,189,248,.35));z-index:2;pointer-events:none;}
.hero-title{ text-shadow: 0 18px 50px rgba(0,0,0,.55); }
.hero-badge{ box-shadow: 0 0 26px rgba(56,189,248,.18); }
.hero-bg-orb{position:absolute;width:520px;height:520px;border-radius:9999px;filter:blur(38px);opacity:.7;z-index:0;pointer-events:none;mix-blend-mode:screen;}
.hero-bg-orb.orb-a{left:-160px;top:-190px;background:radial-gradient(circle at 30% 30%, rgba(56,189,248,.75), rgba(56,189,248,.0) 62%);animation:orbFloatA 9s ease-in-out infinite}
.hero-bg-orb.orb-b{right:-220px;bottom:-220px;background:radial-gradient(circle at 40% 40%, rgba(168,85,247,.65), rgba(168,85,247,.0) 62%);animation:orbFloatB 11s ease-in-out infinite}
.hero-bg-orb.orb-c{left:35%;top:55%;width:420px;height:420px;background:radial-gradient(circle at 45% 45%, rgba(34,211,238,.45), rgba(34,211,238,.0) 64%);opacity:.55;animation:orbFloatA 13s ease-in-out infinite}
.hero-orbits{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.95;transform:translateZ(0);}
.orbit{position:absolute;left:50%;top:50%;transform:translate3d(var(--mx,0px),var(--my,0px),0) rotate(0deg);transform-origin:center;border-radius:9999px;border:1px solid rgba(148,163,184,.12);box-shadow:inset 0 0 0 1px rgba(56,189,248,.05);filter:drop-shadow(0 0 18px rgba(56,189,248,.10));animation:orbitSpin var(--dur,18s) linear infinite;mix-blend-mode:screen;}
.orbit::before{content:'';position:absolute;inset:-1px;border-radius:inherit;background:conic-gradient(from 180deg, rgba(56,189,248,0), rgba(56,189,248,.22), rgba(168,85,247,.16), rgba(34,211,238,.18), rgba(56,189,248,0));opacity:.22;mask-image:radial-gradient(circle at 50% 50%, transparent 62%, rgba(0,0,0,.95) 63%);}
.planet{position:absolute;top:50%;left:calc(100% - var(--p,34px));width:var(--p,34px);height:var(--p,34px);margin-top:calc(var(--p,34px) / -2);border-radius:9999px;background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.55), rgba(255,255,255,0) 35%),radial-gradient(circle at 60% 70%, rgba(0,0,0,.35), rgba(0,0,0,0) 55%),radial-gradient(circle at 40% 45%, var(--c1,#38bdf8), var(--c2,#0ea5e9));box-shadow:0 0 22px rgba(56,189,248,.35),0 0 60px rgba(56,189,248,.18);filter:saturate(1.15) contrast(1.05);}
.planet::after{content:'';position:absolute;inset:-10px;border-radius:inherit;background:radial-gradient(circle at 50% 50%, rgba(255,255,255,.16), transparent 55%);opacity:.65;filter:blur(2px);}
.planet.ring::before{content:'';position:absolute;left:50%;top:50%;width:calc(var(--p,34px) * 1.9);height:calc(var(--p,34px) * 0.85);transform:translate(-50%,-50%) rotate(-18deg);border-radius:9999px;border:1px solid rgba(226,232,240,.22);box-shadow:0 0 20px rgba(168,85,247,.18);opacity:.75;}
.planet .spin{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(120deg, rgba(255,255,255,.10), transparent 55%),radial-gradient(circle at 70% 30%, rgba(255,255,255,.12), transparent 55%);opacity:.55;animation:planetSpin 6s linear infinite;}
.orbit.o1{width:min(64vmin,560px);height:min(64vmin,560px);margin-left:calc(min(64vmin,560px) / -2);margin-top:calc(min(64vmin,560px) / -2);--dur:22s}
.orbit.o2{width:min(48vmin,440px);height:min(48vmin,440px);margin-left:calc(min(48vmin,440px) / -2);margin-top:calc(min(48vmin,440px) / -2);--dur:16s;opacity:.78;animation-direction:reverse}
.orbit.o3{width:min(78vmin,680px);height:min(78vmin,680px);margin-left:calc(min(78vmin,680px) / -2);margin-top:calc(min(78vmin,680px) / -2);--dur:28s;opacity:.55;animation-timing-function:linear}
.planet.p1{--p:42px;--c1:#22d3ee;--c2:#0ea5e9}
.planet.p2{--p:28px;--c1:#a855f7;--c2:#4338ca;box-shadow:0 0 22px rgba(168,85,247,.32),0 0 60px rgba(168,85,247,.16)}
.planet.p3{--p:54px;--c1:#38bdf8;--c2:#1d4ed8}
.planet.p4{--p:22px;--c1:#f59e0b;--c2:#ef4444;box-shadow:0 0 18px rgba(245,158,11,.28),0 0 55px rgba(239,68,68,.10)}
.hero-noise{position:absolute;inset:0;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="120" height="120"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="2" stitchTiles="stitch"/></filter><rect width="120" height="120" filter="url(%23n)" opacity="0.35"/></svg>');opacity:.06;z-index:3;pointer-events:none;animation:shimmer 6s ease-in-out infinite;}
.hero-reveal{opacity:0;transform:translateY(28px);transition:opacity .65s ease,transform .65s ease}
.hero-reveal.visible{opacity:1;transform:translateY(0)}
.hero-reveal.d-1{transition-delay:.1s}.hero-reveal.d-2{transition-delay:.25s}.hero-reveal.d-3{transition-delay:.4s}.hero-reveal.d-4{transition-delay:.55s}.hero-reveal.d-5{transition-delay:.7s}.hero-reveal.d-6{transition-delay:.85s}.hero-reveal.d-7{transition-delay:1s}
.hero-inner{position:relative;z-index:1;max-width:1080px;margin:0 auto;text-align:center}
.hero-badge{display:inline-block;padding:.4rem 1rem;background:rgba(56,189,248,.2);color:#38bdf8;font-size:.875rem;font-weight:600;border-radius:9999px;margin-bottom:1.5rem;border:1px solid rgba(56,189,248,.3)}
.hero-title{font-family:'Montserrat',sans-serif;font-size:clamp(1.8rem,5vw,3.8rem);font-weight:900;color:#f1f5f9;line-height:1.2;margin:0 0 1.25rem;letter-spacing:-.02em;text-transform:uppercase}
@keyframes ggBlink{0%, 15% { filter: brightness(1.5) drop-shadow(0 0 15px currentColor); transform: translateY(-3px) scale(1.05); opacity: 1; }35%, 100% { filter: brightness(1) drop-shadow(0 0 0 transparent); transform: translateY(0) scale(1); opacity: 0.9; }}
.gg-text{display:inline-block; font-weight:900;}
.gg-text span{display:inline-block;animation:ggBlink 2.4s infinite;}
.gg-text .g1{color:#4285F4;animation-delay:0s}.gg-text .o1{color:#EA4335;animation-delay:0.15s}.gg-text .o2{color:#FBBC05;animation-delay:0.3s}.gg-text .g2{color:#4285F4;animation-delay:0.45s}.gg-text .l{color:#34A853;animation-delay:0.6s}.gg-text .e{color:#EA4335;animation-delay:0.75s}
.hero-desc{font-size:1.125rem;color:#94a3b8;line-height:1.7;margin:0 0 2rem;max-width:600px;margin-left:auto;margin-right:auto}
.hero-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-bottom:3rem}
.hero-banner .btn{display:inline-flex;align-items:center;justify-content:center;padding:.875rem 1.75rem;font-size:1rem;font-weight:700;border-radius:12px;text-decoration:none;cursor:pointer;border:none;position:relative;isolation:isolate;transform:translateZ(0);transition:transform .22s ease, box-shadow .22s ease, filter .22s ease;}
.hero-banner .btn::before{content:'';position:absolute;inset:-2px;border-radius:inherit;background:linear-gradient(90deg, rgba(56,189,248,.95), rgba(168,85,247,.75), rgba(34,211,238,.9), rgba(56,189,248,.95));background-size:200% 100%;opacity:0;transition:opacity .2s ease;z-index:-2;animation:borderRun 1.35s linear infinite;}
.hero-banner .btn::after{content:'';position:absolute;inset:0;border-radius:inherit;background:rgba(2,6,23,.18);z-index:-1;opacity:0;transition:opacity .22s ease;}
.hero-banner .btn:hover{transform:translateY(-4px) scale(1.05);filter:saturate(1.1) contrast(1.05);}
.hero-banner .btn:hover::before{opacity:1}
.hero-banner .btn:hover::after{opacity:1}
.hero-banner .btn:active{transform:translateY(-2px) scale(1.02)}
.hero-banner .btn-primary{background:#38bdf8;color:#0f172a;box-shadow:0 18px 38px rgba(56,189,248,.10)}
.hero-banner .btn-primary:hover{background:#7dd3fc;box-shadow:0 26px 70px rgba(0,0,0,.45),0 0 44px rgba(56,189,248,.28)}
.hero-banner .btn-secondary{background:transparent;color:#f1f5f9;border:2px solid rgba(255,255,255,.3)}
.hero-banner .btn-secondary:hover{border-color:rgba(56,189,248,.65);color:#e0f2fe;box-shadow:0 26px 70px rgba(0,0,0,.45),0 0 44px rgba(168,85,247,.18)}
.hero-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem 3rem}
.stat-item{display:flex;flex-direction:column;align-items:center;gap:.25rem}
.stat-number{font-size:2rem;font-weight:700;color:#38bdf8;line-height:1}
.stat-plus,.stat-number{display:inline}
.stat-label{font-size:.875rem;color:#94a3b8}

@media (max-width:640px){
  .hero-banner{min-height:auto;padding:3rem 1rem}
  .hero-stats{gap:1.5rem 2rem}
  .stat-number{font-size:1.75rem}
  .hero-bg{animation:none; --mx:0px; --my:0px;}
  .hero-bg::after{animation:none}
  .hero-bg-stars{animation:none;opacity:.18}
  .hero-bg-orb{animation:none;filter:blur(28px)}
  .hero-holo,.hero-scan,.hero-noise,.hero-meteors{display:none}
  .hero-orbits{inset:auto;top:50%;left:50%;width:min(82vw,460px);height:min(82vw,460px);transform:translate(-50%,-52%);opacity:.9;}
  .hero-orbits .orbit{left:50%;top:52%;transform:translate(-50%,-50%) rotate(0deg);transform-origin:50% 50%;}
  .hero-orbits .orbit.o1{width:min(60vw,360px);height:min(60vw,360px);}
  .hero-orbits .orbit.o2{width:min(48vw,290px);height:min(48vw,290px);}
  .hero-orbits .orbit.o3{width:min(70vw,420px);height:min(70vw,420px);}
}
@media (prefers-reduced-motion: reduce){
  .hero-bg,.hero-bg-media,.hero-bg-stars,.hero-bg::after,.hero-bg-orb,.hero-orbits,.orbit,.planet .spin,.hero-scan,.meteor,.hero-portal::before,.hero-portal::after{animation:none!important}
  .hero-scan{display:none}
}

/* ==========================================================================
   SERVICES SECTION
   ========================================================================== */
@keyframes svcBorderRun{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes svcShine{0%{transform:translateX(-140%) rotate(16deg);opacity:0}12%{opacity:.9}60%{opacity:.35}100%{transform:translateX(140%) rotate(16deg);opacity:0}}
.services-section{padding:5rem 1.5rem;background:#0f172a;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;position:relative;overflow:hidden;background:linear-gradient(-45deg, #0b1224, #111a2f, #0a1224, #102644);background-size:400% 400%;}
.services-section::before{content:'';position:absolute;inset:-1px;background:radial-gradient(ellipse 80% 55% at 50% 0%, rgba(56,189,248,.18) 0%, transparent 55%),radial-gradient(circle at 20% 20%, rgba(168,85,247,.12), transparent 55%),radial-gradient(circle at 80% 15%, rgba(34,211,238,.10), transparent 55%),repeating-linear-gradient(to right, rgba(148,163,184,.10) 0, rgba(148,163,184,.10) 1px, transparent 1px, transparent 34px),repeating-linear-gradient(to bottom, rgba(148,163,184,.08) 0, rgba(148,163,184,.08) 1px, transparent 1px, transparent 34px);opacity:.22;pointer-events:none;z-index:0;mask-image:radial-gradient(circle at 50% 25%, rgba(0,0,0,.95) 0%, rgba(0,0,0,.25) 60%, rgba(0,0,0,0) 85%);}
.services-section > *{position:relative;z-index:1}
.services-section .section-inner{max-width:1200px;margin:0 auto;width:100%;box-sizing:border-box}
.services-section .section-title{font-size:clamp(1.75rem,4vw,2.25rem);font-weight:700;color:#f1f5f9;text-align:center;margin:0 0 1rem;display:block;width:100%}
.services-section .section-desc{font-size:1.125rem;color:#94a3b8;text-align:center;max-width:700px;margin:0 auto 3rem;line-height:1.6}
.services-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}
.service-card{background:radial-gradient(circle at 18% 10%, rgba(168,85,247,.18), transparent 55%),radial-gradient(circle at 80% 0%, rgba(56,189,248,.16), transparent 55%),rgba(2,6,23,.92);border-radius:18px;padding:2rem;border:1px solid rgba(148,163,184,.22);position:relative;overflow:hidden;transform:translateZ(0);will-change:transform;transition:transform .18s ease, box-shadow .18s ease, filter .22s ease;}
.service-card::before{content:'';position:absolute;inset:-2px;border-radius:inherit;background:linear-gradient(90deg, rgba(56,189,248,.95), rgba(168,85,247,.75), rgba(34,211,238,.9), rgba(56,189,248,.95));background-size:200% 100%;opacity:0;z-index:-2;animation:svcBorderRun 1.35s linear infinite;}
.service-card::after{content:'';position:absolute;inset:1px;border-radius:calc(18px - 1px);background:rgba(2,6,23,.55);opacity:.55;z-index:-1;}
.service-card .svc-shine{position:absolute;top:-35%;left:-60%;width:70%;height:170%;background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.22) 40%, rgba(255,255,255,0) 70%);transform:translateX(-140%) rotate(16deg);opacity:0;pointer-events:none;filter:blur(1px);}
.service-card:hover{transform:translateY(-10px) scale(1.02);box-shadow:0 30px 80px rgba(0,0,0,.55), 0 0 55px rgba(56,189,248,.16);filter:saturate(1.12) contrast(1.05);}
.service-card:hover::before{opacity:1}
.service-card:hover .svc-shine{animation:svcShine .85s ease forwards}
.service-img{width:100%;height:180px;border-radius:12px;overflow:hidden;margin-bottom:1.5rem;position:relative}
.service-img img{width:100%;height:100%;object-fit:cover;transform:scale(1.05);transition:transform .4s ease}
.service-card:hover .service-img img{transform:scale(1)}
.services-section .reveal{opacity:0;transform:translateY(28px);transition:opacity .6s ease,transform .6s ease}
.services-section .reveal.visible{opacity:1;transform:translateY(0)}
.services-section .reveal-delay-1{transition-delay:.1s}.services-section .reveal-delay-2{transition-delay:.2s}.services-section .reveal-delay-3{transition-delay:.3s}.services-section .reveal-delay-4{transition-delay:.4s}.services-section .reveal-delay-5{transition-delay:.5s}.services-section .reveal-delay-6{transition-delay:.6s}
.service-card h3{font-size:1.25rem;font-weight:600;color:#f1f5f9;margin:0 0 .75rem}
.service-card p{font-size:.9375rem;color:#94a3b8;line-height:1.6;margin:0}

/* ==========================================================================
   STRENGTHS SECTION
   ========================================================================== */
.strengths-section{padding:5rem 1.5rem;background:#1e293b;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;position:relative;overflow:hidden;background:linear-gradient(-45deg, #0b1224, #111a2f, #0a1224, #102644);background-size:400% 400%;}
.strengths-section::before{content:'';position:absolute;inset:-1px;background:radial-gradient(ellipse 80% 55% at 50% 0%, rgba(56,189,248,.18) 0%, transparent 55%),radial-gradient(circle at 20% 20%, rgba(168,85,247,.12), transparent 55%),radial-gradient(circle at 80% 15%, rgba(34,211,238,.10), transparent 55%),repeating-linear-gradient(to right, rgba(148,163,184,.10) 0, rgba(148,163,184,.10) 1px, transparent 1px, transparent 34px),repeating-linear-gradient(to bottom, rgba(148,163,184,.08) 0, rgba(148,163,184,.08) 1px, transparent 1px, transparent 34px);opacity:.22;pointer-events:none;z-index:0;mask-image:radial-gradient(circle at 50% 25%, rgba(0,0,0,.95) 0%, rgba(0,0,0,.25) 60%, rgba(0,0,0,0) 85%);}
.strengths-section > *{position:relative;z-index:1}
.strengths-section .section-inner{max-width:1200px;margin:0 auto;width:100%;box-sizing:border-box}
.strengths-section .section-title{font-size:clamp(1.75rem,4vw,2.25rem);font-weight:700;color:#f1f5f9;text-align:center;margin:0 0 1rem;display:block;width:100%}
.strengths-section .section-desc{font-size:1.125rem;color:#94a3b8;text-align:center;max-width:700px;margin:0 auto 3rem;line-height:1.6}
.strengths-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.5rem}
.strengths-section{--glowA:rgba(56,189,248,.55);--glowB:rgba(168,85,247,.45);--glowC:rgba(34,211,238,.55)}
@keyframes marvelGlow{0%,100%{filter:drop-shadow(0 0 0 rgba(0,0,0,0))}50%{filter:drop-shadow(0 0 18px rgba(56,189,248,.22))}}
@keyframes shineSweep{0%{transform:translateX(-140%) rotate(18deg);opacity:0}15%{opacity:.85}60%{opacity:.35}100%{transform:translateX(140%) rotate(18deg);opacity:0}}
.strength-card{background:radial-gradient(circle at 20% 15%, rgba(168,85,247,.20), transparent 55%),radial-gradient(circle at 80% 0%, rgba(56,189,248,.18), transparent 55%),radial-gradient(circle at 10% 85%, rgba(34,211,238,.12), transparent 55%),rgba(2,6,23,.92);border-radius:18px;padding:2rem;text-align:center;border:1px solid rgba(148,163,184,.22);position:relative;overflow:hidden;transform:translateZ(0);will-change:transform;transition:transform .18s ease, box-shadow .18s ease, border-color .25s ease, filter .25s ease;animation:marvelGlow 5.5s ease-in-out infinite;}
.strength-card::before{content:'';position:absolute;inset:-1px;background:conic-gradient(from 180deg, rgba(56,189,248,.0), var(--glowA), rgba(56,189,248,0), var(--glowB), rgba(56,189,248,0), var(--glowC), rgba(56,189,248,0));opacity:0;transition:opacity .35s ease;pointer-events:none;}
.strength-card::after{content:'';position:absolute;inset:-40%;background:radial-gradient(circle at 35% 30%, rgba(56,189,248,.18), transparent 38%),radial-gradient(circle at 70% 65%, rgba(168,85,247,.16), transparent 44%),radial-gradient(circle at 40% 80%, rgba(34,211,238,.10), transparent 42%);opacity:.35;transform:rotate(-8deg);transition:opacity .35s ease, transform .35s ease;pointer-events:none;mix-blend-mode:screen;}
.strength-card .shine{content:'';position:absolute;top:-35%;left:-60%;width:70%;height:170%;background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.24) 40%, rgba(255,255,255,.0) 70%);transform:translateX(-140%) rotate(18deg);opacity:0;pointer-events:none;filter:blur(1px);}
.strength-card:hover{border-color:rgba(56,189,248,.55);box-shadow:0 26px 70px rgba(0,0,0,.55), 0 0 0 1px rgba(56,189,248,.22), 0 0 55px rgba(56,189,248,.16);filter:saturate(1.12) contrast(1.05);}
.strength-card:hover::before{opacity:.75}
.strength-card:hover::after{opacity:.55;transform:rotate(-6deg) scale(1.03)}
.strength-card:hover .shine{animation:shineSweep .85s ease forwards}
.strength-icon{font-size:2.5rem;margin-bottom:1rem;filter:drop-shadow(0 10px 18px rgba(0,0,0,.35))}
.strengths-section .rev{opacity:0;transform:translateY(28px);transition:opacity .6s ease,transform .6s ease}
.strengths-section .rev.visible{opacity:1;transform:translateY(0)}
.strengths-section .rev-1{transition-delay:.1s}.strengths-section .rev-2{transition-delay:.2s}.strengths-section .rev-3{transition-delay:.3s}.strengths-section .rev-4{transition-delay:.4s}
.strength-card h3{font-size:1.125rem;font-weight:600;color:#f1f5f9;margin:0 0 .5rem}
.strength-value{font-size:1.25rem;font-weight:700;color:#38bdf8;margin:0 0 1rem}
.strength-desc{font-size:.9375rem;color:#94a3b8;line-height:1.6;margin:0}

/* ==========================================================================
   CORE TEAM SECTION
   ========================================================================== */
.team-section { padding: 5rem 1.5rem; background: #0f172a; text-align: center; font-family: system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; position: relative; overflow: hidden; }
.team-section .section-title { font-size: clamp(1.75rem,4vw,2.25rem); font-weight: 700; color: #f1f5f9; margin: 0 0 1rem; }
.team-section .section-desc { font-size: 1.125rem; color: #94a3b8; max-width: 700px; margin: 0 auto 3rem; line-height: 1.6; }
.team-grid { display: flex; justify-content: center; gap: 2rem; flex-wrap: wrap; max-width: 1200px; margin: 0 auto; }
.team-card { background: rgba(15, 23, 42, 0.7); border: 1px solid rgba(56, 189, 248, 0.2); border-radius: 20px; padding: 2rem; width: 100%; max-width: 340px; position: relative; text-align: left; transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; box-shadow: 0 10px 30px rgba(0,0,0,0.3); }
.team-card.center-card { border-color: rgba(56, 189, 248, 0.5); box-shadow: 0 0 30px rgba(56, 189, 248, 0.15), 0 10px 30px rgba(0,0,0,0.4); transform: scale(1.03); }
.team-card:hover { transform: translateY(-10px); border-color: rgba(56, 189, 248, 0.7); box-shadow: 0 20px 40px rgba(0,0,0,0.5), 0 0 40px rgba(56, 189, 248, 0.2); }
.team-card.center-card:hover { transform: translateY(-10px) scale(1.03); }
.team-role { font-size: 0.8rem; font-weight: 700; color: #94a3b8; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: -30px; position: relative; z-index: 2; text-align: left; }
.team-img-wrap { width: 140px; height: 140px; border-radius: 50%; margin: 0 auto 1.5rem; border: 4px solid #1e293b; padding: 4px; position: relative; background: linear-gradient(135deg, rgba(56,189,248,1), rgba(168,85,247,1)); box-shadow: 0 0 20px rgba(56, 189, 248, 0.3); }
.team-img-wrap img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; border: 3px solid #0f172a; }
.team-card h3 { font-size: 1.5rem; font-weight: 700; color: #38bdf8; text-align: center; margin: 0 0 1.5rem; }
.team-skills { display: flex; flex-direction: column; gap: 0.75rem; }
.skill-row { display: flex; justify-content: space-between; align-items: center; font-size: 0.9rem; font-weight: 600; color: #e2e8f0; }
.skill-pct { color: #38bdf8; }
.skill-bar { height: 6px; background: rgba(255,255,255,0.1); border-radius: 99px; overflow: hidden; margin-bottom: 0.25rem; }
.skill-fill { height: 100%; background: linear-gradient(90deg, #38bdf8, #818cf8); border-radius: 99px; box-shadow: 0 0 10px rgba(56,189,248,0.5); }

/* ==========================================================================
   TESTIMONIALS SECTION
   ========================================================================== */
.testi-section { padding: 5rem 1.5rem; background: #0a0f1c; position: relative; overflow: hidden; font-family: system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; text-align: center; }
.testi-section .section-title { font-size: clamp(1.75rem,4vw,2.25rem); font-weight: 700; color: #f1f5f9; margin: 0 0 1rem; }
.testi-section .section-desc { font-size: 1.125rem; color: #94a3b8; max-width: 700px; margin: 0 auto 3rem; line-height: 1.6; }
.testi-slider-wrap { max-width: 1200px; margin: 0 auto; position: relative; padding: 0 20px; }
.testi-track { display: flex; gap: 1.5rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 1rem; -webkit-overflow-scrolling: touch; }
.testi-track::-webkit-scrollbar { display: none; }
.testi-card { min-width: 320px; width: 320px; background: #1e293b; border: 1px solid rgba(148,163,184,0.1); border-radius: 16px; padding: 2rem; scroll-snap-align: center; text-align: left; display: flex; flex-direction: column; transition: transform 0.3s ease; }
.testi-card:hover { transform: translateY(-5px); border-color: rgba(56, 189, 248, 0.4); box-shadow: 0 10px 30px rgba(0,0,0,0.5); }
.testi-head { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; }
.testi-avt { width: 48px; height: 48px; border-radius: 50%; background: linear-gradient(135deg, #38bdf8, #818cf8); display: flex; align-items: center; justify-content: center; font-size: 1.25rem; font-weight: 700; color: #fff; }
.testi-info h4 { margin: 0 0 0.25rem; font-size: 1.05rem; font-weight: 700; color: #f1f5f9; }
.testi-info p { margin: 0; font-size: 0.85rem; color: #94a3b8; }
.testi-quote { font-size: 0.95rem; color: #cbd5e1; line-height: 1.6; font-style: italic; margin: 0 0 1.5rem; flex-grow: 1; }
.testi-stars { color: #fbbf24; font-size: 1.2rem; letter-spacing: 2px; }
.testi-nav { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(15,23,42,0.8); border: 1px solid rgba(56,189,248,0.3); color: #38bdf8; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; cursor: pointer; z-index: 10; transition: all 0.3s ease; }
.testi-nav:hover { background: #38bdf8; color: #0f172a; }
.testi-nav.prev { left: 0px; }
.testi-nav.next { right: 0px; }

/* ==========================================================================
   CTA SECTION
   ========================================================================== */
.cta-section { padding: 5rem 1.5rem; background: #0b1224; font-family: system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
.cta-inner { max-width: 1200px; margin: 0 auto; background: radial-gradient(circle at 50% 0%, rgba(56,189,248,0.15), transparent 70%), #1e293b; border-radius: 24px; padding: 4rem; border: 1px solid rgba(56,189,248,0.2); box-shadow: 0 20px 50px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.1); position: relative; overflow: hidden; }
.cta-inner::before { content: ""; position: absolute; inset: 0; background: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><rect width=\"100\" height=\"100\" fill=\"none\"/><circle cx=\"50\" cy=\"50\" r=\"1\" fill=\"rgba(255,255,255,0.1)\"/></svg>"); z-index: 0; }
.cta-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 420px; gap: 4rem; align-items: center; }
.cta-content { text-align: left; }
.cta-content h2 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; color: #f1f5f9; margin: 1.5rem 0 1rem; line-height: 1.2; letter-spacing: -0.02em; }
.cta-content p { font-size: 1.125rem; color: #94a3b8; margin: 0 0 2rem; line-height: 1.6; }
.cta-list { list-style: none; padding: 0; margin: 0 0 2rem; display: flex; flex-direction: column; gap: 1rem; }
.cta-list li { display: flex; align-items: flex-start; gap: 1rem; font-size: 1.05rem; color: #cbd5e1; line-height: 1.5; }
.cta-list svg { flex-shrink: 0; margin-top: 2px; }

.cta-form-box { background: rgba(15, 23, 42, 0.8); border: 1px solid rgba(56,189,248,0.3); border-radius: 16px; padding: 2.5rem 2rem; box-shadow: 0 15px 35px rgba(0,0,0,0.4); backdrop-filter: blur(10px); }
.cta-form-title { font-size: 1.25rem; font-weight: 700; color: #fff; margin: 0 0 1.5rem; text-align: center; }
.demo-form-placeholder .form-group, .wpcf7-form p { margin-bottom: 1.25rem; text-align: left; }
.demo-form-placeholder label, .wpcf7-form label { display: block; font-size: 0.9rem; color: #cbd5e1; margin-bottom: 0.5rem; font-weight: 600; }
.wpcf7-form-control.wpcf7-text, .wpcf7-form-control.wpcf7-textarea { width: 100%; padding: 12px 16px; border-radius: 8px; border: 1px solid rgba(148, 163, 184, 0.2); background: #050B14; color: #fff; font-size: 1rem; transition: border-color 0.3s ease; box-sizing: border-box; font-family: inherit; }
.wpcf7-form-control.wpcf7-text:focus, .wpcf7-form-control.wpcf7-textarea:focus { border-color: #38bdf8; outline: none; }
.wpcf7-form-control.wpcf7-textarea { min-height: 100px; resize: vertical; }
.btn-submit, .wpcf7-submit { width: 100%; display: inline-flex; align-items: center; justify-content: center; padding: 1rem; font-size: 1.125rem; font-weight: 700; border-radius: 8px; text-decoration: none; cursor: pointer; border: none; background: #38bdf8; color: #0f172a; box-shadow: 0 10px 20px rgba(56,189,248,0.2); transition: all 0.3s ease; margin-top: 0.5rem; }
.btn-submit:hover, .wpcf7-submit:hover { transform: translateY(-2px); background: #7dd3fc; box-shadow: 0 15px 30px rgba(56,189,248,0.4); }
.form-notice { font-size: 0.8rem; color: #64748b; text-align: center; margin: 1rem 0 0; line-height: 1.5; }

@media (max-width: 992px) {
  .cta-grid { grid-template-columns: 1fr; gap: 3rem; }
  .cta-content { text-align: center; }
  .cta-content h2 { text-align: center; }
  .cta-list { margin: 0 auto 2rem; text-align: left; max-width: 500px; }
  .cta-form-box { margin: 0 auto; max-width: 500px; }
}

@media (max-width: 768px) {
  .team-card.center-card { transform: scale(1); }
  .team-card.center-card:hover { transform: translateY(-10px) scale(1); }
  .testi-nav { display: none; }
  .cta-inner { padding: 2.5rem 1.5rem; }
  .cta-list li { font-size: 0.95rem; }
  .cta-form-box { padding: 2rem 1.5rem; }
}