/* =============================================================
   SeoBackLinko.fr  Design Ultra-Moderne v2.0
   Animations | Glassmorphism | Gradients | Micro-interactions
   ============================================================= */

/* --- Variables --- */
:root {
    --primary:        #2563eb;
    --primary-dark:   #1d4ed8;
    --primary-light:  #eff6ff;
    --primary-glow:   rgba(37,99,235,.25);
    --accent:         #f97316;
    --accent-dark:    #ea6a0a;
    --accent-glow:    rgba(249,115,22,.25);
    --success:        #10b981;
    --warning:        #f59e0b;
    --danger:         #ef4444;
    --bg:             #ffffff;
    --bg-alt:         #f8fafc;
    --bg-dark:        #0a0f1e;
    --text:           #0f172a;
    --text-muted:     #64748b;
    --text-light:     #94a3b8;
    --border:         #e2e8f0;
    --shadow-sm:      0 1px 3px rgba(0,0,0,.06);
    --shadow:         0 4px 20px rgba(0,0,0,.07);
    --shadow-lg:      0 10px 40px rgba(0,0,0,.1);
    --shadow-xl:      0 25px 60px rgba(0,0,0,.15);
    --shadow-glow:    0 0 40px rgba(37,99,235,.15);
    --radius-sm:      6px;
    --radius:         14px;
    --radius-lg:      22px;
    --radius-full:    9999px;
    --transition:     .28s cubic-bezier(.4,0,.2,1);
    --transition-slow:.55s cubic-bezier(.4,0,.2,1);
    --font-main:      'Inter', system-ui, sans-serif;
    --font-heading:   'Poppins', 'Inter', sans-serif;
    --container:      1200px;
    --nav-h:          72px;
    --top-bar-h:      40px;
    --grad-primary:   linear-gradient(135deg,#2563eb 0%,#7c3aed 100%);
    --grad-accent:    linear-gradient(135deg,#f97316 0%,#ef4444 100%);
    --grad-dark:      linear-gradient(135deg,#0a0f1e 0%,#0f172a 100%);
    --grad-mesh:      radial-gradient(at 40% 20%,#dbeafe 0,transparent 50%),
                      radial-gradient(at 80% 0%,#ede9fe 0,transparent 50%),
                      radial-gradient(at 0% 50%,#fff7ed 0,transparent 50%);
}

/* --- Keyframes --- */
@keyframes fadeUp     { from{opacity:0;transform:translateY(32px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeIn     { from{opacity:0} to{opacity:1} }
@keyframes float      { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-14px)} }
@keyframes pulse      { 0%,100%{transform:scale(1)} 50%{transform:scale(1.05)} }
@keyframes gradShift  { 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }
@keyframes rotate     { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
@keyframes scaleIn    { from{opacity:0;transform:scale(.85)} to{opacity:1;transform:scale(1)} }
@keyframes shimmer    { 0%{background-position:-200% center} 100%{background-position:200% center} }
@keyframes glowPulse  { 0%,100%{box-shadow:0 0 20px rgba(37,99,235,.25)} 50%{box-shadow:0 0 50px rgba(37,99,235,.55)} }
@keyframes slideRight { from{opacity:0;transform:translateX(-36px)} to{opacity:1;transform:translateX(0)} }
@keyframes slideLeft  { from{opacity:0;transform:translateX(36px)} to{opacity:1;transform:translateX(0)} }
@keyframes countUp    { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }

/* --- Reveal (Intersection Observer) --- */
.reveal               { opacity:0; transform:translateY(40px); transition:opacity .7s ease,transform .7s ease; }
.reveal.reveal-left   { transform:translateX(-40px); }
.reveal.reveal-right  { transform:translateX(40px); }
.reveal.reveal-scale  { transform:scale(.9); opacity:0; }
.reveal.visible       { opacity:1; transform:none; }
.reveal-delay-1       { transition-delay:.1s; }
.reveal-delay-2       { transition-delay:.2s; }
.reveal-delay-3       { transition-delay:.3s; }
.reveal-delay-4       { transition-delay:.4s; }

/* --- Reset --- */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; }
body { font-family:var(--font-main); color:var(--text); background:var(--bg); line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img  { max-width:100%; height:auto; display:block; }
a    { color:var(--primary); text-decoration:none; transition:color var(--transition); }
a:hover { color:var(--primary-dark); }
ul,ol  { list-style:none; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }
input,textarea,select { font-family:inherit; }

/* Scrollbar */
::-webkit-scrollbar       { width:5px; }
::-webkit-scrollbar-track { background:#f1f5f9; }
::-webkit-scrollbar-thumb { background:var(--primary); border-radius:3px; }

/* --- Layout --- */
.container  { width:100%; max-width:var(--container); margin:0 auto; padding:0 20px; }
@media(min-width:768px)  { .container { padding:0 32px; } }
@media(min-width:1280px) { .container { padding:0 40px; } }
.section    { padding:90px 0; }
.section-sm { padding:55px 0; }
.section-lg { padding:110px 0; }
.section-header { text-align:center; max-width:720px; margin:0 auto 64px; }

.section-tag {
    display:inline-flex; align-items:center; gap:6px;
    background:linear-gradient(135deg,rgba(37,99,235,.1),rgba(124,58,237,.1));
    color:var(--primary); font-size:.75rem; font-weight:700;
    text-transform:uppercase; letter-spacing:.1em; padding:6px 18px;
    border-radius:var(--radius-full); margin-bottom:16px;
    border:1px solid rgba(37,99,235,.18);
}
.section-title {
    font-family:var(--font-heading); font-size:clamp(1.75rem,3.5vw,2.6rem);
    font-weight:800; line-height:1.18; color:var(--text); margin-bottom:18px;
    letter-spacing:-.02em;
}
.section-title span {
    background:var(--grad-primary); background-size:200% 200%;
    -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
    animation:gradShift 6s ease infinite;
}
.section-subtitle { font-size:1.05rem; color:var(--text-muted); line-height:1.75; }
.gradient-text { background:var(--grad-primary); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.gradient-text-accent { background:var(--grad-accent); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }

/* --- Buttons --- */
.btn {
    display:inline-flex; align-items:center; gap:9px; padding:13px 30px;
    border-radius:var(--radius-full); font-weight:600; font-size:.95rem;
    transition:all var(--transition); white-space:nowrap;
    position:relative; overflow:hidden; letter-spacing:.01em;
}
.btn::before {
    content:''; position:absolute; inset:0;
    background:rgba(255,255,255,.18); opacity:0;
    transition:opacity var(--transition);
}
.btn:hover::before { opacity:1; }
.btn:hover { transform:translateY(-3px); }
.btn:active { transform:translateY(-1px); }
.btn-primary {
    background:var(--grad-primary); background-size:200% 200%; color:#fff;
    box-shadow:0 4px 20px var(--primary-glow);
    animation:gradShift 5s ease infinite;
}
.btn-primary:hover { color:#fff; box-shadow:0 8px 32px rgba(37,99,235,.5); }
.btn-accent {
    background:var(--grad-accent); background-size:200% 200%; color:#fff;
    box-shadow:0 4px 20px var(--accent-glow);
}
.btn-accent:hover  { color:#fff; box-shadow:0 8px 32px rgba(249,115,22,.5); }
.btn-outline { background:transparent; color:var(--primary); border:2px solid var(--primary); }
.btn-outline:hover { background:var(--primary); color:#fff; }
.btn-white   { background:#fff; color:var(--primary); box-shadow:var(--shadow); }
.btn-white:hover { background:var(--primary-light); }
.btn-glass   { background:rgba(255,255,255,.15); backdrop-filter:blur(12px); color:#fff; border:1px solid rgba(255,255,255,.3); }
.btn-glass:hover { background:rgba(255,255,255,.28); color:#fff; }
.btn-sm  { padding:9px 20px; font-size:.875rem; }
.btn-lg  { padding:17px 42px; font-size:1.05rem; }
.btn-icon { width:44px; height:44px; padding:0; justify-content:center; border-radius:50%; }

/* --- Top Bar --- */
.top-bar {
    background:var(--bg-dark);
    color:#cbd5e1; font-size:.78rem; height:var(--top-bar-h);
    display:flex; align-items:center; position:sticky; top:0; z-index:1000;
    border-bottom:1px solid rgba(255,255,255,.05);
}
.top-bar .container { display:flex; justify-content:space-between; align-items:center; width:100%; }
.top-bar-left,.top-bar-right { display:flex; align-items:center; gap:18px; }
.top-bar a { color:#94a3b8; transition:color var(--transition); }
.top-bar a:hover { color:#fff; }
.top-bar span i,.top-bar a i { margin-right:5px; color:var(--primary); }
.top-shop-btn {
    background:var(--grad-accent); color:#fff !important;
    padding:4px 14px; border-radius:var(--radius-full); font-weight:700; font-size:.78rem;
    transition:all var(--transition);
}
.top-shop-btn:hover { transform:scale(1.06); box-shadow:0 4px 14px var(--accent-glow); }
@media(max-width:768px) { .top-bar-left { display:none; } }

/* --- Header / Navbar --- */
.main-header {
    position:sticky; top:var(--top-bar-h); z-index:999;
    background:rgba(255,255,255,.85); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px);
    border-bottom:1px solid rgba(226,232,240,.55); transition:all var(--transition);
}
.main-header.scrolled { box-shadow:0 4px 30px rgba(0,0,0,.08); background:rgba(255,255,255,.96); }
.navbar { display:flex; align-items:center; justify-content:space-between; height:var(--nav-h); gap:24px; }
.nav-logo img { height:44px; width:auto; transition:transform var(--transition); }
.nav-logo:hover img { transform:scale(1.05); }
.nav-menu { display:flex; align-items:center; gap:2px; }
.nav-link {
    display:flex; align-items:center; gap:5px; padding:8px 15px;
    border-radius:var(--radius-sm); font-weight:500; color:var(--text); font-size:.93rem;
    transition:all var(--transition); position:relative;
}
.nav-link::after {
    content:''; position:absolute; bottom:3px; left:15px; right:15px; height:2px;
    background:var(--grad-primary); border-radius:1px;
    transform:scaleX(0); transition:transform var(--transition);
}
.nav-link:hover::after,.nav-link.active::after { transform:scaleX(1); }
.nav-link:hover,.nav-link.active { color:var(--primary); background:var(--primary-light); }
.nav-link i { font-size:.7rem; transition:transform var(--transition); }
.has-dropdown:hover .nav-link i { transform:rotate(180deg); }
.has-dropdown { position:relative; }
.dropdown-menu {
    position:absolute; top:calc(100% + 12px); left:0;
    background:rgba(255,255,255,.97); backdrop-filter:blur(20px);
    border-radius:var(--radius); min-width:255px; padding:8px;
    box-shadow:0 20px 60px rgba(0,0,0,.12),0 0 0 1px rgba(226,232,240,.4);
    opacity:0; visibility:hidden; transform:translateY(-10px) scale(.97);
    transition:all var(--transition); z-index:100;
}
.has-dropdown:hover .dropdown-menu { opacity:1; visibility:visible; transform:translateY(0) scale(1); }
.dropdown-menu a { display:flex; align-items:center; gap:12px; padding:11px 14px; border-radius:var(--radius-sm); color:var(--text); font-size:.9rem; transition:all var(--transition); }
.dropdown-menu a i { color:var(--primary); width:18px; text-align:center; font-size:.95rem; }
.dropdown-menu a:hover { background:var(--primary-light); color:var(--primary); padding-left:18px; }
.hamburger { display:none; flex-direction:column; gap:5px; width:36px; padding:4px; }
.hamburger span { display:block; height:2.5px; width:100%; background:var(--text); border-radius:3px; transition:all .35s cubic-bezier(.4,0,.2,1); }
.hamburger.open span:nth-child(1) { transform:translateY(7.5px) rotate(45deg); background:var(--primary); }
.hamburger.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
.hamburger.open span:nth-child(3) { transform:translateY(-7.5px) rotate(-45deg); background:var(--primary); }
@media(max-width:1024px) {
    .hamburger { display:flex; }
    .nav-menu { position:fixed; top:calc(var(--top-bar-h)+var(--nav-h)); left:0; width:100%; background:rgba(255,255,255,.98); backdrop-filter:blur(20px); border-bottom:1px solid var(--border); flex-direction:column; align-items:flex-start; padding:16px 20px 24px; gap:2px; box-shadow:var(--shadow-xl); transform:translateY(-110%); opacity:0; visibility:hidden; transition:all .4s cubic-bezier(.4,0,.2,1); }
    .nav-menu.open { transform:translateY(0); opacity:1; visibility:visible; }
    .nav-menu li { width:100%; }
    .nav-link::after { display:none; }
    .dropdown-menu { position:static; box-shadow:none; border:none; background:var(--bg-alt); opacity:1; visibility:visible; transform:none; display:none; border-radius:var(--radius-sm); border-left:3px solid var(--primary); margin:4px 0 4px 16px; }
    .has-dropdown.open .dropdown-menu { display:block; }
    .nav-cta { margin-top:8px; }
}

/* --- Hero --- */
.hero {
    padding:90px 0 70px; min-height:88vh; display:flex; align-items:center;
    background:radial-gradient(at 40% 20%,#dbeafe 0,transparent 50%),
               radial-gradient(at 80% 0%,#ede9fe 0,transparent 50%),
               radial-gradient(at 0% 50%,#fff7ed 0,transparent 50%),#fff;
    position:relative; overflow:hidden;
}
.hero::before {
    content:''; position:absolute; width:700px; height:700px; border-radius:50%;
    background:radial-gradient(circle,rgba(37,99,235,.12) 0%,transparent 65%);
    top:-200px; right:-150px; animation:float 9s ease-in-out infinite;
}
.hero::after {
    content:''; position:absolute; width:500px; height:500px; border-radius:50%;
    background:radial-gradient(circle,rgba(249,115,22,.08) 0%,transparent 65%);
    bottom:-150px; left:-100px; animation:float 11s ease-in-out infinite reverse;
}
.hero-grid-bg {
    position:absolute; inset:0;
    background-image:linear-gradient(rgba(37,99,235,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.03) 1px,transparent 1px);
    background-size:60px 60px; z-index:0; pointer-events:none;
}
.hero-inner { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:70px; position:relative; z-index:1; }
.hero-badge {
    display:inline-flex; align-items:center; gap:8px;
    background:linear-gradient(135deg,rgba(37,99,235,.08),rgba(124,58,237,.08));
    color:var(--primary); font-size:.8rem; font-weight:700; padding:7px 18px;
    border-radius:var(--radius-full); margin-bottom:22px;
    border:1px solid rgba(37,99,235,.2); animation:fadeUp .6s ease both;
}
.hero-badge .badge-dot { width:7px; height:7px; background:#10b981; border-radius:50%; animation:pulse 1.5s infinite; }
.hero-title {
    font-family:var(--font-heading); font-size:clamp(2.2rem,4.8vw,3.6rem);
    font-weight:800; line-height:1.14; color:var(--text); margin-bottom:22px;
    letter-spacing:-.03em; animation:fadeUp .6s .1s ease both;
}
.hero-title span { background:var(--grad-primary); background-size:200% 200%; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; animation:gradShift 4s ease infinite; }
.hero-title .accent { background:var(--grad-accent); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero-description { font-size:1.12rem; color:var(--text-muted); line-height:1.82; margin-bottom:36px; animation:fadeUp .6s .2s ease both; }
.hero-cta { display:flex; flex-wrap:wrap; gap:14px; margin-bottom:44px; animation:fadeUp .6s .3s ease both; }
.hero-stats { display:flex; flex-wrap:wrap; gap:28px; padding-top:24px; border-top:1px solid var(--border); animation:fadeUp .6s .4s ease both; }
.stat-item strong { display:block; font-size:1.7rem; font-weight:800; background:var(--grad-primary); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; font-family:var(--font-heading); }
.stat-item span { font-size:.82rem; color:var(--text-muted); font-weight:500; }
.hero-img-wrap { position:relative; animation:fadeIn .8s .3s ease both; }
.hero-img-wrap img { width:100%; border-radius:var(--radius-lg); box-shadow:var(--shadow-xl); animation:float 6s ease-in-out infinite; }
.hero-badge-float {
    position:absolute; background:rgba(255,255,255,.92); backdrop-filter:blur(16px);
    border-radius:var(--radius); padding:12px 18px; box-shadow:var(--shadow-lg);
    display:flex; align-items:center; gap:10px; font-size:.85rem; font-weight:600;
    border:1px solid rgba(226,232,240,.5); animation:scaleIn .6s .6s ease both;
}
.hero-badge-float i { color:var(--accent); font-size:1.3rem; }
.hero-badge-float.pos1 { bottom:28px; left:-24px; }
.hero-badge-float.pos2 { top:24px; right:-24px; }
.hero-badge-float small { font-size:.72rem; color:var(--text-muted); font-weight:400; display:block; }
@media(max-width:900px) { .hero-inner { grid-template-columns:1fr; } .hero-img-wrap { display:none; } .hero { min-height:auto; } }

/* --- Partners --- */
.partners { padding:40px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:var(--bg-alt); }
.partners-title { font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--text-light); text-align:center; margin-bottom:22px; }
.partners-track { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:36px; }
.partners-track img { height:28px; width:auto; filter:grayscale(1) opacity(.4); transition:all var(--transition); }
.partners-track img:hover { filter:grayscale(0) opacity(1); transform:scale(1.12); }

/* --- Service cards --- */
.services-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; }
.service-card {
    background:var(--bg); border:1.5px solid var(--border); border-radius:var(--radius-lg);
    padding:36px 30px; transition:all var(--transition-slow); position:relative; overflow:hidden;
}
.service-card::after { content:''; position:absolute; top:0; left:0; width:100%; height:3px; background:var(--grad-primary); transform:scaleX(0); transform-origin:left; transition:transform var(--transition); }
.service-card:hover { transform:translateY(-9px); box-shadow:var(--shadow-xl); border-color:transparent; }
.service-card:hover::after { transform:scaleX(1); }
.service-icon { width:60px; height:60px; border-radius:var(--radius); background:linear-gradient(135deg,var(--primary-light),rgba(124,58,237,.08)); display:flex; align-items:center; justify-content:center; font-size:1.5rem; color:var(--primary); margin-bottom:22px; transition:all var(--transition); }
.service-card:hover .service-icon { background:var(--grad-primary); color:#fff; transform:scale(1.1) rotate(-6deg); box-shadow:0 8px 24px var(--primary-glow); }
.service-card h3 { font-size:1.12rem; font-weight:700; margin-bottom:10px; }
.service-card p  { color:var(--text-muted); font-size:.9rem; line-height:1.65; margin-bottom:20px; }
.service-list { font-size:.87rem; color:var(--text-muted); display:flex; flex-direction:column; gap:7px; }
.service-list li { display:flex; align-items:center; gap:8px; }
.service-list li::before { content:''; width:18px; height:18px; border-radius:50%; background:linear-gradient(135deg,#10b981,#059669); display:inline-flex; align-items:center; justify-content:center; font-size:.62rem; color:#fff; flex-shrink:0; font-weight:800; }
.service-card-link { display:inline-flex; align-items:center; gap:7px; font-size:.88rem; font-weight:600; color:var(--primary); margin-top:22px; transition:all var(--transition); }
.service-card-link i { transition:transform var(--transition); }
.service-card:hover .service-card-link i { transform:translateX(5px); }

/* --- Pricing --- */
.pricing-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; align-items:start; }
.pricing-card { background:var(--bg); border:1.5px solid var(--border); border-radius:var(--radius-lg); padding:38px 30px; transition:all var(--transition); position:relative; overflow:hidden; }
.pricing-card::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background:var(--grad-primary); transform:scaleX(0); transition:transform var(--transition); }
.pricing-card:hover { transform:translateY(-7px); box-shadow:var(--shadow-xl); border-color:rgba(37,99,235,.25); }
.pricing-card:hover::before { transform:scaleX(1); }
.pricing-card.popular { border-color:var(--primary); transform:scale(1.04); box-shadow:var(--shadow-xl),0 0 0 4px rgba(37,99,235,.08); background:linear-gradient(180deg,#fafbff 0%,#fff 100%); }
.pricing-card.popular::before { transform:scaleX(1); }
.pricing-card.popular:hover { transform:scale(1.04) translateY(-7px); }
.popular-badge { position:absolute; top:-14px; left:50%; transform:translateX(-50%); background:var(--grad-primary); color:#fff; font-size:.73rem; font-weight:700; padding:5px 22px; border-radius:var(--radius-full); text-transform:uppercase; letter-spacing:.06em; box-shadow:0 4px 14px var(--primary-glow); }
.pricing-tier  { font-size:.77rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--text-light); margin-bottom:10px; }
.pricing-name  { font-family:var(--font-heading); font-size:1.5rem; font-weight:800; margin-bottom:16px; }
.pricing-price { display:flex; align-items:baseline; gap:6px; margin-bottom:6px; }
.pricing-price .amount { font-size:2.6rem; font-weight:800; font-family:var(--font-heading); background:var(--grad-primary); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.pricing-price .old    { font-size:.95rem; color:var(--text-light); text-decoration:line-through; }
.pricing-price .period { font-size:.85rem; color:var(--text-muted); }
.pricing-desc { font-size:.88rem; color:var(--text-muted); margin-bottom:24px; padding-bottom:24px; border-bottom:1px solid var(--border); line-height:1.6; }
.pricing-features { display:flex; flex-direction:column; gap:11px; margin-bottom:30px; }
.pricing-features li { display:flex; align-items:center; gap:10px; font-size:.9rem; color:var(--text); }
.pricing-features li i { color:var(--success); font-size:.85rem; flex-shrink:0; }
.pricing-features li.disabled { color:var(--text-light); }
.pricing-features li.disabled i { color:var(--border); }
.pricing-card .btn { width:100%; justify-content:center; }

/* --- Testimonials --- */
.testimonials-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; }
.testimonial-card { background:var(--bg); border:1px solid var(--border); border-radius:var(--radius-lg); padding:30px; transition:all var(--transition-slow); position:relative; overflow:hidden; }
.testimonial-card::before { content:''; position:absolute; inset:0; background:var(--grad-primary); background-size:200% 200%; opacity:0; transition:opacity var(--transition-slow); z-index:0; }
.testimonial-card:hover { box-shadow:var(--shadow-lg); transform:translateY(-6px); border-color:transparent; }
.testimonial-card:hover::before { opacity:1; animation:gradShift 4s ease infinite; }
.testimonial-card>* { position:relative; z-index:1; }
.testi-stars { color:#f59e0b; font-size:.9rem; margin-bottom:14px; letter-spacing:2px; }
.testi-quote { font-size:2.5rem; line-height:1; color:var(--primary); opacity:.15; font-family:Georgia,serif; }
.testi-text  { font-size:.93rem; color:var(--text-muted); line-height:1.75; margin:8px 0 22px; font-style:italic; }
.testimonial-card:hover .testi-text  { color:rgba(255,255,255,.88); }
.testimonial-card:hover .testi-quote { color:#fff; opacity:.2; }
.testimonial-card:hover .testi-stars { color:#fde68a; }
.testi-author { display:flex; align-items:center; gap:12px; }
.testi-avatar { width:44px; height:44px; border-radius:50%; background:var(--grad-primary); display:flex; align-items:center; justify-content:center; font-weight:700; color:#fff; font-size:1rem; flex-shrink:0; }
.testi-name { font-weight:700; font-size:.9rem; }
.testi-role { font-size:.8rem; color:var(--text-muted); }
.testimonial-card:hover .testi-name,.testimonial-card:hover .testi-role { color:#fff; }

/* --- Stats --- */
.stats-section { background:var(--grad-dark); padding:72px 0; position:relative; overflow:hidden; }
.stats-section::before { content:''; position:absolute; inset:0; background:radial-gradient(circle at 20% 50%,rgba(37,99,235,.18) 0%,transparent 50%),radial-gradient(circle at 80% 50%,rgba(124,58,237,.12) 0%,transparent 50%); }
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:40px; position:relative; z-index:1; }
.stat-card { text-align:center; color:#fff; }
.stat-card .icon { width:54px; height:54px; border-radius:var(--radius); background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center; font-size:1.4rem; color:rgba(255,255,255,.7); margin:0 auto 18px; }
.stat-card .number { font-family:var(--font-heading); font-size:3.2rem; font-weight:800; line-height:1; margin-bottom:8px; background:linear-gradient(135deg,#fff,rgba(255,255,255,.75)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.stat-card .label { font-size:.9rem; color:rgba(255,255,255,.6); }

/* --- Badge bar --- */
.badge-bar { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:20px; padding:32px 0; }
.badge-item { display:flex; align-items:center; gap:12px; background:var(--bg); border:1px solid var(--border); padding:12px 22px; border-radius:var(--radius); transition:all var(--transition); box-shadow:var(--shadow-sm); }
.badge-item:hover { transform:translateY(-3px); box-shadow:var(--shadow); border-color:rgba(37,99,235,.3); }
.badge-item img { height:34px; width:auto; }
.badge-item span { font-size:.8rem; font-weight:600; color:var(--text-muted); }

/* --- Portfolio --- */
.portfolio-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:24px; }
.portfolio-card { border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow); transition:all var(--transition); }
.portfolio-card:hover { transform:translateY(-7px); box-shadow:var(--shadow-xl); }
.portfolio-img-wrap { position:relative; overflow:hidden; aspect-ratio:16/10; }
.portfolio-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.portfolio-card:hover .portfolio-img-wrap img { transform:scale(1.09); }
.portfolio-overlay { position:absolute; inset:0; background:linear-gradient(135deg,rgba(37,99,235,.8),rgba(124,58,237,.8)); display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity var(--transition); }
.portfolio-card:hover .portfolio-overlay { opacity:1; }
.portfolio-meta { padding:20px 22px; background:var(--bg); }
.portfolio-meta h3 { font-size:.97rem; font-weight:700; margin-bottom:4px; }
.portfolio-meta p  { font-size:.82rem; color:var(--text-muted); }

/* --- About --- */
.about-inner { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.about-img-wrap { position:relative; }
.about-img-wrap img { border-radius:var(--radius-lg); box-shadow:var(--shadow-xl); }
.about-img-badge { position:absolute; bottom:30px; right:-22px; background:rgba(255,255,255,.95); backdrop-filter:blur(12px); border-radius:var(--radius); padding:18px 22px; box-shadow:var(--shadow-lg); text-align:center; min-width:145px; border:1px solid rgba(226,232,240,.5); animation:float 4s ease-in-out infinite; }
.about-img-badge strong { font-size:2.2rem; font-weight:800; display:block; background:var(--grad-primary); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.about-img-badge span { font-size:.8rem; color:var(--text-muted); }
.about-content .section-tag { margin-bottom:12px; }
.about-list { display:flex; flex-direction:column; gap:16px; margin:26px 0 34px; }
.about-list-item { display:flex; gap:14px; }
.about-list-icon { width:42px; height:42px; border-radius:var(--radius-sm); background:linear-gradient(135deg,var(--primary-light),rgba(124,58,237,.08)); display:flex; align-items:center; justify-content:center; color:var(--primary); flex-shrink:0; transition:all var(--transition); }
.about-list-item:hover .about-list-icon { background:var(--grad-primary); color:#fff; }
.about-list-item h4 { font-weight:700; font-size:.95rem; margin-bottom:3px; }
.about-list-item p  { font-size:.87rem; color:var(--text-muted); }
@media(max-width:900px) { .about-inner { grid-template-columns:1fr; } .about-img-wrap { display:none; } }

/* --- FAQ --- */
.faq-list { display:flex; flex-direction:column; gap:12px; max-width:800px; margin:0 auto; }
.faq-item { border:1.5px solid var(--border); border-radius:var(--radius); overflow:hidden; transition:border-color var(--transition),box-shadow var(--transition); }
.faq-item.open { border-color:rgba(37,99,235,.3); box-shadow:0 4px 20px rgba(37,99,235,.1); }
.faq-question { width:100%; display:flex; justify-content:space-between; align-items:center; padding:20px 24px; font-weight:600; font-size:.97rem; background:var(--bg); transition:all var(--transition); text-align:left; }
.faq-question:hover { background:var(--primary-light); color:var(--primary); }
.faq-item.open .faq-question { background:var(--primary-light); color:var(--primary); }
.faq-q-icon { width:28px; height:28px; border-radius:50%; background:var(--primary-light); color:var(--primary); display:flex; align-items:center; justify-content:center; font-size:.8rem; flex-shrink:0; transition:all var(--transition); }
.faq-item.open .faq-q-icon { background:var(--primary); color:#fff; transform:rotate(180deg); }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .45s cubic-bezier(.4,0,.2,1); }
.faq-answer-inner { padding:0 24px 22px; font-size:.93rem; color:var(--text-muted); line-height:1.8; }
.faq-item.open .faq-answer { max-height:400px; }

/* --- CTA Band --- */
.cta-band { background:var(--grad-primary); background-size:200% 200%; animation:gradShift 7s ease infinite; padding:72px 0; position:relative; overflow:hidden; }
.cta-band::before { content:''; position:absolute; top:-50%; left:-50%; width:200%; height:200%; background:radial-gradient(circle,rgba(255,255,255,.06) 0%,transparent 60%); animation:rotate 20s linear infinite; }
.cta-inner { display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap; position:relative; z-index:1; }
.cta-text h2 { font-family:var(--font-heading); font-size:clamp(1.5rem,3vw,2.2rem); font-weight:800; color:#fff; margin-bottom:8px; }
.cta-text p  { color:rgba(255,255,255,.8); }
.cta-btns { display:flex; gap:14px; flex-wrap:wrap; }

/* --- Contact --- */
.contact-layout { display:grid; grid-template-columns:1fr 1.6fr; gap:60px; align-items:start; }
.contact-info-box { background:var(--grad-primary); background-size:200% 200%; animation:gradShift 7s ease infinite; border-radius:var(--radius-lg); padding:44px 34px; color:#fff; position:relative; overflow:hidden; }
.contact-info-box::before { content:''; position:absolute; bottom:-80px; right:-80px; width:280px; height:280px; border-radius:50%; background:rgba(255,255,255,.05); }
.contact-info-box h3 { font-size:1.6rem; font-weight:700; margin-bottom:10px; position:relative; }
.contact-info-box p  { opacity:.85; margin-bottom:34px; position:relative; }
.contact-detail-list { display:flex; flex-direction:column; gap:20px; margin-bottom:34px; position:relative; }
.contact-detail { display:flex; align-items:flex-start; gap:14px; }
.contact-detail-icon { width:44px; height:44px; border-radius:var(--radius-sm); background:rgba(255,255,255,.15); backdrop-filter:blur(8px); display:flex; align-items:center; justify-content:center; font-size:1.1rem; flex-shrink:0; border:1px solid rgba(255,255,255,.2); transition:all var(--transition); }
.contact-detail:hover .contact-detail-icon { background:rgba(255,255,255,.28); }
.contact-detail strong { display:block; font-size:.88rem; opacity:.75; }
.contact-detail a,.contact-detail span { font-size:.97rem; color:#fff; }
.contact-social { display:flex; gap:10px; position:relative; }
.contact-social a { width:40px; height:40px; border-radius:50%; background:rgba(255,255,255,.15); display:flex; align-items:center; justify-content:center; color:#fff; border:1px solid rgba(255,255,255,.2); transition:all var(--transition); }
.contact-social a:hover { background:rgba(255,255,255,.3); transform:scale(1.1); }
.contact-form-box { background:var(--bg); border:1px solid var(--border); border-radius:var(--radius-lg); padding:44px 38px; box-shadow:var(--shadow-lg); }
.contact-form-box h3 { font-size:1.35rem; font-weight:700; margin-bottom:6px; }
.contact-form-box p  { color:var(--text-muted); font-size:.9rem; margin-bottom:30px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media(max-width:600px) { .form-grid { grid-template-columns:1fr; } }
.form-group { display:flex; flex-direction:column; gap:7px; }
.form-group.full { grid-column:1/-1; }
.form-group label { font-size:.84rem; font-weight:600; color:var(--text); }
.form-group input,.form-group textarea,.form-group select { padding:12px 16px; border:1.5px solid var(--border); border-radius:var(--radius-sm); font-size:.95rem; color:var(--text); background:var(--bg); transition:all var(--transition); outline:none; width:100%; }
.form-group input:focus,.form-group textarea:focus,.form-group select:focus { border-color:var(--primary); box-shadow:0 0 0 4px rgba(37,99,235,.08); background:#fafcff; }
.form-group textarea { resize:vertical; min-height:130px; }
.form-notice { font-size:.8rem; color:var(--text-muted); margin-top:12px; }
@media(max-width:900px) { .contact-layout { grid-template-columns:1fr; } }

/* --- Footer --- */
.footer-newsletter { background:var(--grad-primary); background-size:200% 200%; animation:gradShift 8s ease infinite; padding:44px 0; position:relative; overflow:hidden; }
.newsletter-inner { display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap; position:relative; }
.newsletter-text h3 { color:#fff; font-size:1.25rem; font-weight:700; margin-bottom:5px; }
.newsletter-text p  { color:rgba(255,255,255,.8); font-size:.9rem; }
.newsletter-form { display:flex; gap:10px; flex:1; max-width:480px; }
.newsletter-form input { flex:1; padding:12px 18px; border-radius:var(--radius-full); border:1px solid rgba(255,255,255,.3); background:rgba(255,255,255,.15); color:#fff; font-size:.95rem; outline:none; backdrop-filter:blur(8px); transition:all var(--transition); }
.newsletter-form input::placeholder { color:rgba(255,255,255,.6); }
.newsletter-form input:focus { background:rgba(255,255,255,.25); border-color:rgba(255,255,255,.5); }
.newsletter-form .btn { white-space:nowrap; }
.main-footer { background:var(--bg-dark); }
.footer-main { padding:70px 0 42px; }
.footer-grid { display:grid; grid-template-columns:1.8fr 1fr 1fr 1.3fr; gap:44px; }
@media(max-width:1024px) { .footer-grid { grid-template-columns:1fr 1fr; } }
@media(max-width:600px)  { .footer-grid { grid-template-columns:1fr; } }
.footer-brand p { font-size:.88rem; color:#94a3b8; line-height:1.75; margin:16px 0 20px; }
.footer-social { display:flex; gap:10px; }
.footer-social a { width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.07); display:flex; align-items:center; justify-content:center; color:#94a3b8; font-size:.88rem; border:1px solid rgba(255,255,255,.08); transition:all var(--transition); }
.footer-social a:hover { background:var(--primary); color:#fff; border-color:var(--primary); transform:translateY(-2px); }
.footer-title { color:#f1f5f9; font-weight:700; font-size:.95rem; margin-bottom:20px; padding-bottom:10px; border-bottom:1px solid rgba(255,255,255,.07); }
.footer-links { display:flex; flex-direction:column; gap:9px; }
.footer-links a { color:#94a3b8; font-size:.88rem; display:flex; align-items:center; gap:8px; transition:all var(--transition); }
.footer-links a i { font-size:.6rem; color:var(--primary); }
.footer-links a:hover { color:#fff; padding-left:4px; }
.footer-contact { display:flex; flex-direction:column; gap:12px; }
.footer-contact li { display:flex; align-items:flex-start; gap:12px; font-size:.88rem; color:#94a3b8; }
.footer-contact li i { color:var(--primary); margin-top:3px; flex-shrink:0; }
.footer-contact a { color:#94a3b8; }
.footer-contact a:hover { color:#fff; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.06); padding:22px 0; }
.footer-bottom .container { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; }
.footer-bottom p { color:#94a3b8; font-size:.83rem; }
.footer-bottom p strong { color:#e2e8f0; }
.footer-legal { display:flex; gap:18px; flex-wrap:wrap; }
.footer-legal a { color:#94a3b8; font-size:.83rem; transition:color var(--transition); }
.footer-legal a:hover { color:#fff; }

/* --- Scroll top --- */
.scroll-top { position:fixed; bottom:30px; right:30px; width:46px; height:46px; border-radius:50%; background:var(--grad-primary); color:#fff; box-shadow:0 4px 20px var(--primary-glow); display:flex; align-items:center; justify-content:center; font-size:.9rem; opacity:0; visibility:hidden; transform:translateY(16px); transition:all var(--transition); z-index:500; border:2px solid rgba(255,255,255,.25); }
.scroll-top.visible { opacity:1; visibility:visible; transform:translateY(0); }
.scroll-top:hover { transform:translateY(-4px); box-shadow:0 8px 32px rgba(37,99,235,.5); }

/* --- Alerts --- */
.alert { padding:14px 18px; border-radius:var(--radius-sm); font-size:.93rem; display:flex; align-items:center; gap:10px; margin-bottom:20px; }
.alert-success { background:#f0fdf4; color:#15803d; border:1px solid #bbf7d0; }
.alert-error   { background:#fef2f2; color:#b91c1c; border:1px solid #fecaca; }
.alert-info    { background:var(--primary-light); color:var(--primary); border:1px solid #bfdbfe; }
.alert-warning { background:#fffbeb; color:#b45309; border:1px solid #fde68a; }

/* --- Page hero (service pages) --- */
.page-hero { padding:72px 0 54px; background:radial-gradient(at 40% 20%,#dbeafe 0,transparent 50%),radial-gradient(at 80% 0%,#ede9fe 0,transparent 50%),radial-gradient(at 0% 50%,#fff7ed 0,transparent 50%),#fff; border-bottom:1px solid var(--border); position:relative; overflow:hidden; }
.page-hero::before { content:''; position:absolute; top:-80px; right:-80px; width:400px; height:400px; border-radius:50%; background:radial-gradient(circle,rgba(37,99,235,.08) 0%,transparent 70%); }
.page-hero-inner { position:relative; z-index:1; }
.breadcrumb { display:flex; align-items:center; gap:8px; font-size:.82rem; color:var(--text-muted); margin-bottom:18px; flex-wrap:wrap; }
.breadcrumb a { color:var(--text-muted); transition:color var(--transition); }
.breadcrumb a:hover { color:var(--primary); }
.breadcrumb i { font-size:.6rem; }
.page-hero h1 { font-family:var(--font-heading); font-size:clamp(1.9rem,4vw,3rem); font-weight:800; margin-bottom:18px; line-height:1.18; letter-spacing:-.02em; }
.page-hero h1 span { background:var(--grad-primary); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.page-hero p { font-size:1.05rem; color:var(--text-muted); max-width:620px; line-height:1.75; }

/* --- Glassmorphism --- */
.glass-card { background:rgba(255,255,255,.75); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,.5); border-radius:var(--radius-lg); box-shadow:var(--shadow); }

/* --- Utils --- */
.text-center    { text-align:center; }
.mt-4  { margin-top:16px; }
.mt-8  { margin-top:32px; }
.mb-4  { margin-bottom:16px; }
.mb-8  { margin-bottom:32px; }
.bg-alt { background:var(--bg-alt); }
.d-flex { display:flex; }
.gap-3 { gap:12px; }
.justify-center { justify-content:center; }
.flex-wrap { flex-wrap:wrap; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }
.chip { display:inline-flex; align-items:center; gap:5px; padding:4px 12px; border-radius:var(--radius-full); font-size:.78rem; font-weight:600; background:var(--primary-light); color:var(--primary); border:1px solid rgba(37,99,235,.15); }
.glow-on-hover:hover { animation:glowPulse 1.5s ease-in-out infinite; }

/* --- Old reveal classes (compat) --- */
.fade-up   { animation:fadeUp .6s ease both; }
.fade-up-2 { animation:fadeUp .6s .15s ease both; }
.fade-up-3 { animation:fadeUp .6s .3s ease both; }