:root{--accent:#4f46e5;--accent-2:#7b2ff7;--bg:#;--card:#fff;--text:#0f1724;--muted:#64748b;--radius-sm:8px;--radius:14px;--radius-lg:20px;--max-width:1100px;--shadow-sm:0 4px 12px rgba(15,23,36,.06);--shadow:0 6px 18px rgba(15,23,36,.08);--shadow-lg:0 12px 32px rgba(15,23,36,.12);--glass:rgba(255,255,255,.75);--transition-fast:.2s ease;--transition:.28s ease;--transition-slow:.45s ease}
*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Cambria,"Times New Roman",serif;background:var(--bg);color:var(--text);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
button{font-family:Cambria,"Times New Roman",serif;inherit;cursor:pointer}
.container{max-width:var(--max-width);margin:auto;padding:12px 10px}
.text-center{text-align:center}.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mt-3{margin-top:24px}
::selection{background:var(--accent);color:#fff}

/* HEADER */
header{position:sticky;top:0;z-index:1100;background:rgba(255,255,255,.65);backdrop-filter:blur(12px);border-bottom:1px solid rgba(15,23,36,.06);transition:.3s}
header.scrolled{box-shadow:0 10px 30px rgba(0,0,0,.12)}
.nav-wrap{max-width:var(--max-width);margin:auto;padding:12px 14px;display:flex;align-items:center;justify-content:space-between}
.brand{font-size:20px;font-weight:800;color:var(--accent);letter-spacing:.4px}
.brand span{background:linear-gradient(90deg,var(--accent),var(--accent-2));-webkit-background-clip:text;color:transparent}
nav.nav{display:flex;gap:10px}
.nav-links{display:flex;gap:6px}
.nav-links a{padding:4px 10px;border-radius:5px;font-weight:500;position:relative;transition:.3s}
.nav-links a:hover:after{width:60%}
.nav-links a:hover,.nav-links a.active{background:var(--accent);color:#fff}
.nav-cta .btn{margin-left:14px;padding:10px 22px}
.menu-toggle{display:none;border:0;background:0;font-size:22px;padding:8px;color:var(--text)}
.cursor { animation: blink 1s infinite; } @keyframes blink { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } }
.hero-text { font-size: 22px; line-height: 1.8; color: #fff; font-family:Cambria,"Times New Roman"; } 
.word-container { display: inline-block; overflow: hidden; height: 28px; } #slide-word { display: inline-block; color: yellow; font-weight: 600; 
animation: slideUp 0.5s ease; } @keyframes slideUp { from { transform: translateY(100%); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.actions { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 25px; } 
.badge { background: white; color: #2563eb; padding: 10px 20px; border-radius: 30px; font-size: 16px; font-weight: 500; border: 2px solid #2563eb; animation: pulseGlow 2s infinite; transition: 0.3s; } /* hover pe solid color */ 
.badge:hover { background: #2563eb; color: white; }

@media(max-width:900px){
.menu-toggle{display:inline-flex}
.nav-links{position:absolute;top:70px;right:20px;width:220px;background:var(--card);border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.18);flex-direction:column;padding:12px;display:none}
.nav-links.open{display:flex}
}

/* HERO */
.hero{position:relative;padding:50px 20px;text-align:center;color:#fff;overflow:hidden;background:linear-gradient(135deg,#5f6ee2,#8b5cf6,#10b981);background-size:300% 300%;animation:gradientMove 10s infinite}
@keyframes gradientMove{0%{background-position:0 50%}50%{background-position:100% 50%}100%{background-position:0 50%}}
.hero:before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.25);backdrop-filter:blur(6px)}
.hero .container{max-width:1000px;margin:auto;position:relative;z-index:2}
.hero h1{font-size:clamp(32px,6vw,58px);font-weight:900;margin-bottom:50px}
.hero p{font-size:18px;margin-bottom:54px;opacity:.95}
.btn{display:inline-block;padding:13px 30px;border-radius:999px;background:linear-gradient(90deg,#10b981,#3b82f6,#8b5cf6);color:#fff;font-weight:700;box-shadow:0 10px 26px rgba(0,0,0,.3);transition:.3s}
.btn:hover{transform:translateY(-4px) scale(1.03)}
.btn.secondary{background:#fff;color:var(--accent);border:2px solid var(--accent)}
.hero .actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* SECTIONS */
section{padding:60px 20px}
h2{font-size:24px;color:var(--accent);margin-bottom:12px;font-weight:700}
.service-grid,.project-grid,.blog-grid,.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:18px}
.card{background:;padding:20px;border-radius:12px;box-shadow:var(--shadow);transition:.28s;text-align:left}
.card:hover{transform:translateY(-6px);box-shadow:0 12px 32px rgba(15,23,36,.09)}
.card .icon-wrapper{font-size:28px;color:var(--accent);margin-bottom:14px}
.card h3{font-size:18px;margin-bottom:8px}
.card p{color:var(--muted);font-size:14px}

/* TESTIMONIAL */
.testimonial-section{padding:80px 20px;background:}
.testimonial-container{max-width:820px;margin:auto;text-align:center}
.testimonial-card{background:rgba(255,255,255,.8);backdrop-filter:blur(10px);padding:30px;border-radius:18px;box-shadow:0 12px 30px rgba(0,0,0,.1)}
.stars{color:#fbbf24;font-size:24px;margin-bottom:16px}
.testimonial-text{font-style:italic;font-size:18px;margin-bottom:22px}
.client-info{display:flex;gap:14px;justify-content:center}
.client-avatar{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#7b2ff7,#f107a3);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700}
.controls{margin-top:20px;display:flex;gap:12px;justify-content:center}
.dot{width:12px;height:12px;border-radius:50%;background:#e5e7eb;cursor:pointer}
.dot.active{background:var(--accent);transform:scale(1.3)}

/* FORM */
form{max-width:680px;margin:auto;display:grid;gap:16px}
input,textarea,select{font-family:Cambria,"Times New Roman",serif;width:100%;padding:14px 12px;border-radius:12px;border:1px solid #e6e9ef}
input:focus,textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 4px rgba(79,70,229,.12)}
textarea{min-height:130px}
button[type=submit]{padding:14px;border-radius:12px;border:0;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;font-weight:700}
button:hover{transform:translateY(-2px)}

/* FOOTER */
footer{background:linear-gradient(180deg,var(--accent-2),var(--accent));color:#fff;padding:50px 20px}
.footer-container{max-width:var(--max-width);margin:auto;display:flex;gap:30px;flex-wrap:wrap;justify-content:space-between}
.footer-links a{position:}
.footer-links a:after{content:"";position:absolute;left:0;bottom:-4px;width:0;height:2px;background:#fff;transition:.3s}
.footer-links a:hover:after{width:100%}
.footer-links .p-link a, .footer-links .p-link span{ color:#; text-decoration:none; font-size:15px; line-height:2; display:inline-flex; align-items:center; gap:8px; transition:.3s; } .footer-links .p-link a:hover{ color:#fff; transform:translateX(4px); } .footer-links i{ color:#; font-size:14px; }
.footer-bottom{text-align:center;margin-top:24px;font-size:14px}

/* WHATSAPP */
.whatsapp-float{position:fixed;bottom:26px;right:26px;width:62px;height:62px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px rgba(0,0,0,.25);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.6)}70%{box-shadow:0 0 0 18px transparent}}
