*{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:'Inter',sans-serif;color:#0F172A;background:#fff;overflow-x:hidden;}
  h1,h2,h3,.font-serif{font-family:'Playfair Display',serif;}
  .glass-nav{background: rgba(255,255,255,0.85);backdrop-filter: blur(12px);border-bottom: 1px solid rgba(0,0,0,0.05);transition: all .3s ease;}
  .glass-nav.scrolled{background: rgba(255,255,255,0.98);box-shadow: 0 4px 20px rgba(0,0,0,0.06);}
  @media (max-width: 768px) {.glass-nav {background: #ffffff !important;backdrop-filter: none !important;}}
  .hero-bg {background-image: linear-gradient(135deg, rgba(15,23,42,0.65) 0%, rgba(0,0,0,0.55) 100%), url('https://paymegpt.com/api/landing-pages/images/coding-agent-assets%2F36%2F1778041175828_hero_section.webp');background-size: cover;background-position: center;background-attachment: fixed;background-repeat: no-repeat;}
  @media (max-width: 768px) {.hero-bg {background-attachment: scroll;}}
  .hero-text-shadow {text-shadow: 1px 1px 4px rgba(0,0,0,0.7);}
  @keyframes fadeInUp{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}
  @keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
  @keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
  @keyframes scrollDown{0%{transform:translateY(0);opacity:1;}100%{transform:translateY(14px);opacity:0;}}
  @keyframes shimmer{0%{background-position:-200% 0;}100%{background-position:200% 0;}}
  .animate-fadeInUp{animation: fadeInUp .9s ease-out forwards;}
  .delay-1{animation-delay:.15s; opacity:0;}
  .delay-2{animation-delay:.3s; opacity:0;}
  .delay-3{animation-delay:.45s; opacity:0;}
  .float{animation: float 4s ease-in-out infinite;}
  .reveal{opacity:0; transform:translateY(40px); transition: all .8s cubic-bezier(.2,.7,.3,1);}
  .reveal.visible{opacity:1; transform:translateY(0);}
  .promo-badge{background: linear-gradient(90deg, #C9A646, #E5C77A, #C9A646);background-size: 200% 100%;animation: shimmer 4s linear infinite;}
  .card-hover{transition: all .4s cubic-bezier(.2,.7,.3,1);}
  .card-hover:hover{transform: translateY(-6px);box-shadow: 0 20px 40px rgba(15,23,42,0.12);}
  .card-3d{transition: transform .4s ease, box-shadow .4s ease;}
  .card-3d:hover{transform: perspective(1000px) rotateX(2deg) rotateY(-2deg) translateY(-4px);box-shadow: 0 30px 50px rgba(15,23,42,0.15);}
  .btn-primary{background: #E30613;color:#fff;transition: all .3s ease;position:relative;overflow:hidden;}
  .btn-primary::after{content:'';position:absolute; inset:0;background: linear-gradient(120deg, transparent, rgba(255,255,255,.25), transparent);transform: translateX(-100%);transition: transform .6s;}
  .btn-primary:hover{background:#B8050F; transform: translateY(-2px); box-shadow: 0 12px 24px rgba(227,6,19,.35);}
  .btn-primary:hover::after{transform: translateX(100%);}
  .btn-outline{border:1.5px solid #fff; color:#fff; background: transparent;transition: all .3s ease;}
  .btn-outline:hover{background:#fff; color:#0F172A; transform: translateY(-2px);}
  .btn-ghost{border:1.5px solid #0F172A; color:#0F172A; background:transparent;transition: all .3s ease;}
  .btn-ghost:hover{background:#0F172A; color:#fff; transform: translateY(-2px);}
  .gallery-item{position:relative; overflow:hidden; border-radius:16px;cursor:pointer;}
  .gallery-item img{transition: transform .8s cubic-bezier(.2,.7,.3,1);}
  .gallery-item:hover img{transform: scale(1.08);}
  .gallery-item .overlay{position:absolute; inset:0;background: linear-gradient(180deg, transparent 40%, rgba(15,23,42,.85));display:flex; flex-direction:column; justify-content:flex-end;padding: 24px;opacity: 1;transition: opacity .4s;}
  .gallery-item .overlay h3,.gallery-item .overlay p {color: white !important;text-shadow: 1px 1px 2px rgba(0,0,0,0.5);}
  .scroll-dot{width:5px; height:10px; background:#fff; border-radius:3px;animation: scrollDown 1.6s ease-in-out infinite;}
  .acc-content{max-height:0; overflow:hidden; transition: max-height .4s ease;}
  .acc-item.open .acc-content{max-height:300px;}
  .acc-item.open .acc-icon{transform: rotate(45deg);}
  .acc-icon{transition: transform .3s ease;}
  .float-wa {position: fixed;bottom: 24px;left: 24px;z-index: 60;width: 56px;height: 56px;border-radius: 50%;background: #25D366;color: white;display: flex;align-items: center;justify-content: center;box-shadow: 0 6px 16px rgba(0,0,0,0.2);transition: transform 0.25s, box-shadow 0.25s;text-decoration: none;}
  .float-wa:hover {transform: scale(1.08);box-shadow: 0 10px 24px rgba(37,211,102,0.4);}
  .float-wa svg {width: 30px;height: 30px;fill: white;}
  .go-top {position: fixed;bottom: 130px;right: 24px;width: 44px;height: 44px;background: rgba(0,0,0,0.4);backdrop-filter: blur(6px);color: white;border-radius: 50%;display: flex;align-items: center;justify-content: center;cursor: pointer;opacity: 0;visibility: hidden;transition: all 0.3s ease;z-index: 55;font-size: 26px;font-weight: bold;text-decoration: none;border: 1px solid rgba(255,255,255,0.3);}
  .go-top:hover {background: #E30613;transform: translateY(-3px);}
  .go-top.show {opacity: 1;visibility: visible;}
  @media (max-width: 768px) {.go-top {bottom: 180px;right: 20px;width: 40px;height: 40px;font-size: 22px;}}
  .lightbox{position:fixed; inset:0; background:rgba(0,0,0,.92);z-index:100; display:none; align-items:center; justify-content:center;padding: 20px;}
  .lightbox.active{display:flex; animation: fadeIn .3s ease;}
  .lightbox img{max-width:95%; max-height:90vh; border-radius:12px;}
  .lightbox-close{position:absolute; top:24px; right:24px;width:48px; height:48px; border-radius:50%;background:rgba(255,255,255,.15); color:#fff;display:flex; align-items:center; justify-content:center;cursor:pointer; transition:.2s;}
  .lightbox-close:hover{background:rgba(255,255,255,.3);}
  .parallax{transition: transform .15s linear;}
  .trust-item{display:flex; flex-direction:column; align-items:center; text-align:center;padding: 12px;}
  .accent-line{width:60px; height:3px; background:#E30613; border-radius:2px;margin-bottom: 20px;}
  .navy-bg{background: linear-gradient(135deg, #0F172A 0%, #1e293b 100%);position:relative;overflow:hidden;}
  .navy-bg::before{content:'';position:absolute; top:-50%; right:-20%;width:600px; height:600px;background: radial-gradient(circle, rgba(227,6,19,.18), transparent 70%);pointer-events:none;}
  .mobile-menu {position: fixed;top: 0;right: 0;bottom: 0;width: 280px;max-width: 80%;background-color: #ffffff;box-shadow: -5px 0 25px rgba(0,0,0,0.15);transform: translateX(100%);transition: transform 0.3s ease;z-index: 1000;overflow-y: auto;}
  .mobile-menu.open { transform: translateX(0); }
  .menu-overlay {position: fixed;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0,0,0,0.4);z-index: 999;display: none;}
  .menu-overlay.active { display: block; }
  .filter-btn{padding: 8px 18px; border-radius: 999px;border:1.5px solid #e5e7eb; background:#fff;font-size:14px; font-weight:500;transition: all .25s ease;cursor:pointer;}
  .filter-btn.active{background:#E30613; color:#fff; border-color:#E30613;box-shadow: 0 6px 14px rgba(227,6,19,.2);}
  .filter-btn:hover:not(.active){border-color:#0F172A; transform: translateY(-1px);}
  .filters-wrap::-webkit-scrollbar{display:none;}
  .filters-wrap{-ms-overflow-style:none; scrollbar-width:none;}
  .logo-img{ filter: drop-shadow(0 2px 6px rgba(0,0,0,.1)); }