{"id":9,"date":"2024-10-03T18:40:06","date_gmt":"2024-10-03T18:40:06","guid":{"rendered":"https:\/\/aspiredigitalsolutions.in\/about-us\/"},"modified":"2026-07-08T21:35:44","modified_gmt":"2026-07-08T16:05:44","slug":"about-us","status":"publish","type":"page","link":"https:\/\/aspiredigitalsolutions.in\/ar\/about-us\/","title":{"rendered":"About Us"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"9\" class=\"elementor elementor-9\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-77991d93 e-con-full e-flex e-con e-parent\" data-id=\"77991d93\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3645d20 e-con-full e-flex e-con e-parent\" data-id=\"3645d20\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6f37fd3 elementor-widget elementor-widget-html\" data-id=\"6f37fd3\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.2\/gsap.min.js\"><\/script>\r\n\r\n<style>\r\n    \/* Premium Modern Font *\/\r\n    @import url('https:\/\/fonts.googleapis.com\/css2?family=Outfit:wght@300;400;600;700;800&display=swap');\r\n\r\n    :root {\r\n        --dm-bg: #0f172a;\r\n        --dm-primary: #3b82f6; \/* Marketing Blue *\/\r\n        --dm-accent: #10b981;  \/* Growth Green *\/\r\n        --text-white: #ffffff;\r\n    }\r\n\r\n    \/* --- CONTAINER --- *\/\r\n    .digital-hero-wrapper {\r\n        position: relative;\r\n        width: 100%;\r\n        height: 85vh;\r\n        overflow: hidden;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        background: var(--dm-bg);\r\n        font-family: 'Outfit', sans-serif;\r\n        color: var(--text-white);\r\n    }\r\n\r\n    \/* --- VIDEO BACKGROUND (Marketing Specific) --- *\/\r\n    .bg-video-wrap {\r\n        position: absolute;\r\n        top: 0; left: 0; width: 100%; height: 100%;\r\n        z-index: 1;\r\n    }\r\n    \r\n    .bg-video {\r\n        width: 100%;\r\n        height: 100%;\r\n        object-fit: cover;\r\n        \/* Thoda dark kiya taki text clear dikhe *\/\r\n        filter: brightness(0.4) contrast(1.2); \r\n        transform: scale(1.1); \/* Zoom effect ke liye ready *\/\r\n    }\r\n\r\n    \/* --- OVERLAY (Modern Gradient) --- *\/\r\n    .hero-overlay {\r\n        position: absolute;\r\n        top: 0; left: 0; width: 100%; height: 100%;\r\n        z-index: 2;\r\n        \/* Blue to Transparent Gradient for depth *\/\r\n        background: linear-gradient(135deg, rgba(15, 23, 42, 0.9) 0%, rgba(59, 130, 246, 0.3) 100%);\r\n    }\r\n\r\n    \/* --- HERO CONTENT --- *\/\r\n    .hero-content {\r\n        position: relative;\r\n        z-index: 10;\r\n        text-align: center;\r\n        max-width: 900px;\r\n        padding: 0 20px;\r\n    }\r\n\r\n    \/* Pill Label *\/\r\n    .pill-label {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 8px;\r\n        background: rgba(255, 255, 255, 0.1);\r\n        border: 1px solid rgba(255, 255, 255, 0.2);\r\n        padding: 8px 20px;\r\n        border-radius: 50px;\r\n        backdrop-filter: blur(10px);\r\n        margin-bottom: 25px;\r\n        transform: translateY(50px);\r\n        opacity: 0;\r\n    }\r\n    .pill-dot {\r\n        width: 8px; height: 8px;\r\n        background-color: var(--dm-accent);\r\n        border-radius: 50%;\r\n        box-shadow: 0 0 10px var(--dm-accent);\r\n    }\r\n    .pill-text {\r\n        font-size: 0.85rem;\r\n        font-weight: 600;\r\n        letter-spacing: 1px;\r\n        text-transform: uppercase;\r\n        color: white;\r\n    }\r\n\r\n    \/* Main Heading *\/\r\n    .hero-heading {\r\n        font-size: clamp(3rem, 7vw, 6rem);\r\n        font-weight: 800;\r\n        line-height: 1.1;\r\n        margin: 0 0 20px 0;\r\n        letter-spacing: -1px;\r\n        background: linear-gradient(to right, #ffffff, #93c5fd);\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n        transform: translateY(50px);\r\n        opacity: 0;\r\n    }\r\n\r\n    \/* Subtitle *\/\r\n    .hero-desc {\r\n        font-size: clamp(1.1rem, 2vw, 1.3rem);\r\n        font-weight: 300;\r\n        color: rgba(255, 255, 255, 0.9);\r\n        max-width: 700px;\r\n        margin: 0 auto 40px;\r\n        line-height: 1.6;\r\n        transform: translateY(50px);\r\n        opacity: 0;\r\n    }\r\n\r\n    \/* CTA Button *\/\r\n    .hero-btn {\r\n        display: inline-block;\r\n        background: var(--text-white);\r\n        color: var(--dm-primary);\r\n        padding: 16px 40px;\r\n        font-size: 1rem;\r\n        font-weight: 700;\r\n        border-radius: 50px;\r\n        text-decoration: none;\r\n        transition: transform 0.3s ease, box-shadow 0.3s ease;\r\n        transform: translateY(50px);\r\n        opacity: 0;\r\n    }\r\n    .hero-btn:hover {\r\n        transform: translateY(-5px);\r\n        box-shadow: 0 15px 30px rgba(0,0,0,0.2);\r\n    }\r\n\r\n<\/style>\r\n\r\n<div class=\"digital-hero-wrapper\" id=\"dmHero\">\r\n    \r\n    <div class=\"bg-video-wrap\">\r\n        <video class=\"bg-video\" autoplay muted loop playsinline>\r\n            <source src=\"https:\/\/videos.pexels.com\/video-files\/3130182\/3130182-hd_1920_1080_30fps.mp4\" type=\"video\/mp4\">\r\n        <\/video>\r\n    <\/div>\r\n\r\n    <div class=\"hero-overlay\"><\/div>\r\n\r\n    <div class=\"hero-content\">\r\n        \r\n        <div class=\"pill-label\">\r\n            <span class=\"pill-dot\"><\/span>\r\n            <span class=\"pill-text\">#1 Digital Agency<\/span>\r\n        <\/div>\r\n\r\n        <h1 class=\"hero-heading\">Scale Your Business<br>With Real Data.<\/h1>\r\n\r\n        <p class=\"hero-desc\">We turn clicks into customers using advanced SEO, paid strategies, and data-driven marketing campaigns.<\/p>\r\n\r\n        <a href=\"#contact\" class=\"hero-btn\">Start Growing Today<\/a>\r\n\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n<script>\r\n    document.addEventListener(\"DOMContentLoaded\", function() {\r\n        \r\n        \/\/ Timeline Animation\r\n        const tl = gsap.timeline({ delay: 0.2 });\r\n\r\n        \/\/ 1. Video Effect: Zoom Out slowly (Cinematic)\r\n        gsap.to(\".bg-video\", { \r\n            scale: 1.0, \r\n            duration: 10, \r\n            ease: \"none\" \r\n        });\r\n\r\n        \/\/ 2. Text Reveal (Staggered Upward Motion)\r\n        tl.to(\".pill-label\", { y: 0, opacity: 1, duration: 0.8, ease: \"power3.out\" })\r\n          .to(\".hero-heading\", { y: 0, opacity: 1, duration: 0.8, ease: \"power3.out\" }, \"-=0.6\")\r\n          .to(\".hero-desc\", { y: 0, opacity: 1, duration: 0.8, ease: \"power3.out\" }, \"-=0.6\")\r\n          .to(\".hero-btn\", { y: 0, opacity: 1, duration: 0.8, ease: \"back.out(1.7)\" }, \"-=0.6\");\r\n\r\n        \/\/ 3. Mouse Move Parallax (3D Text Effect)\r\n        const hero = document.getElementById('dmHero');\r\n        const content = document.querySelector('.hero-content');\r\n\r\n        hero.addEventListener('mousemove', (e) => {\r\n            const x = (window.innerWidth \/ 2 - e.pageX) \/ 40;\r\n            const y = (window.innerHeight \/ 2 - e.pageY) \/ 40;\r\n\r\n            gsap.to(content, {\r\n                x: x,\r\n                y: y,\r\n                duration: 1,\r\n                ease: \"power2.out\"\r\n            });\r\n        });\r\n    });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-e1201d5 e-con-full e-flex e-con e-parent\" data-id=\"e1201d5\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ede81e4 elementor-widget elementor-widget-html\" data-id=\"ede81e4\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n<style>\r\n    \/* Google Fonts *\/\r\n    @import url('https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600&display=swap');\r\n\r\n    :root {\r\n        --news-bg: #ffffff;\r\n        --news-text: #0f172a;\r\n        --news-border: #e2e8f0;\r\n        --news-grad: linear-gradient(135deg, #536dfe 0%, #ff6b81 100%);\r\n    }\r\n\r\n    \/* --- TICKER WRAPPER --- *\/\r\n    .aspire-ticker-wrap {\r\n        font-family: 'Poppins', sans-serif;\r\n        width: 100%;\r\n        background: var(--news-bg);\r\n        border-top: 1px solid var(--news-border);\r\n        border-bottom: 1px solid var(--news-border);\r\n        height: 50px; \/* Fixed Height *\/\r\n        display: flex;\r\n        align-items: center;\r\n        overflow: hidden;\r\n        position: relative;\r\n        box-shadow: 0 4px 10px rgba(0,0,0,0.05);\r\n    }\r\n\r\n    \/* --- STATIC LABEL (Our Services) --- *\/\r\n    .aspire-ticker-label {\r\n        background: var(--news-grad);\r\n        color: white;\r\n        height: 100%;\r\n        padding: 0 20px;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        font-size: 0.9rem;\r\n        font-weight: 600;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n        position: relative;\r\n        z-index: 2;\r\n        flex-shrink: 0;\r\n        clip-path: polygon(0 0, 100% 0, 90% 100%, 0% 100%);\r\n        padding-right: 30px;\r\n    }\r\n\r\n    \/* --- SCROLL CONTAINER --- *\/\r\n    .aspire-ticker-container {\r\n        flex-grow: 1;\r\n        overflow: hidden;\r\n        white-space: nowrap;\r\n        position: relative;\r\n        \/* Edges Fade Effect *\/\r\n        mask-image: linear-gradient(to right, transparent, black 2%, black 98%, transparent);\r\n        -webkit-mask-image: linear-gradient(to right, transparent, black 2%, black 98%, transparent);\r\n    }\r\n\r\n    \/* --- MOVING TRACK (SLOW SPEED) --- *\/\r\n    .aspire-ticker-track {\r\n        display: inline-block;\r\n        padding-left: 100%; \/* Starts from outside *\/\r\n        \/* Changed from 30s to 80s for Slow & Smooth flow *\/\r\n        animation: ticker-scroll 80s linear infinite;\r\n        will-change: transform; \/* Optimization for smoothness *\/\r\n    }\r\n\r\n    \/* Pause on Hover *\/\r\n    .aspire-ticker-wrap:hover .aspire-ticker-track {\r\n        animation-play-state: paused;\r\n    }\r\n\r\n    @keyframes ticker-scroll {\r\n        0% { transform: translate3d(0, 0, 0); }\r\n        100% { transform: translate3d(-100%, 0, 0); }\r\n    }\r\n\r\n    \/* --- ITEM DESIGN --- *\/\r\n    .ticker-item {\r\n        display: inline-block;\r\n        padding: 0 30px; \/* Thoda gap badhaya hai *\/\r\n        color: var(--news-text);\r\n        font-size: 0.95rem;\r\n        font-weight: 500;\r\n        text-decoration: none;\r\n        position: relative;\r\n        transition: color 0.3s ease;\r\n    }\r\n\r\n    .ticker-item:hover {\r\n        color: #536dfe;\r\n    }\r\n\r\n    .ticker-item i {\r\n        color: #ff6b81;\r\n        margin-right: 8px;\r\n        font-size: 0.9rem;\r\n    }\r\n\r\n    \/* Separator Dot *\/\r\n    .ticker-item::after {\r\n        content: \"\u2022\";\r\n        color: #cbd5e1;\r\n        position: absolute;\r\n        right: 0;\r\n        top: 50%;\r\n        transform: translateY(-50%);\r\n        font-size: 1.2rem;\r\n    }\r\n    \r\n    .ticker-item:last-child::after { content: \"\"; }\r\n\r\n    \/* Responsive *\/\r\n    @media (max-width: 600px) {\r\n        .aspire-ticker-label {\r\n            font-size: 0.75rem;\r\n            padding: 0 15px;\r\n            padding-right: 25px;\r\n        }\r\n        .ticker-item {\r\n            font-size: 0.85rem;\r\n            padding: 0 15px;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"aspire-ticker-wrap\">\r\n    \r\n    <div class=\"aspire-ticker-label\">\r\n        Our Services\r\n    <\/div>\r\n\r\n    <div class=\"aspire-ticker-container\">\r\n        <div class=\"aspire-ticker-track\">\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/seo\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-search\"><\/i> SEO Optimization\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/google-ads\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-bullseye\"><\/i> Google Ads (PPC)\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/web-development\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-code\"><\/i> Website Development\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/social-media-marketing\/\" class=\"ticker-item\">\r\n                <i class=\"fab fa-instagram\"><\/i> Social Media Marketing\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/branding\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-award\"><\/i> Branding Strategy\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/email-marketing\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-envelope\"><\/i> Email Marketing\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/graphic-designing\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-pen-nib\"><\/i> Graphic Designing\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/content-marketing\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-file-alt\"><\/i> Content Marketing\r\n            <\/a>\r\n\r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/seo\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-search\"><\/i> SEO Optimization\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/google-ads\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-bullseye\"><\/i> Google Ads (PPC)\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/web-development\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-code\"><\/i> Website Development\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/social-media-marketing\/\" class=\"ticker-item\">\r\n                <i class=\"fab fa-instagram\"><\/i> Social Media Marketing\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/branding\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-award\"><\/i> Branding Strategy\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/email-marketing\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-envelope\"><\/i> Email Marketing\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/graphic-designing\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-pen-nib\"><\/i> Graphic Designing\r\n            <\/a>\r\n            \r\n            <a href=\"https:\/\/aspiredigitalsolutions.in\/services\/content-marketing\/\" class=\"ticker-item\">\r\n                <i class=\"fas fa-file-alt\"><\/i> Content Marketing\r\n            <\/a>\r\n\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-9785541 e-con-full e-flex e-con e-parent\" data-id=\"9785541\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d864e38 elementor-widget elementor-widget-html\" data-id=\"d864e38\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Outfit:wght@300;400;600;700;800&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    \/* --- CSS VARIABLES --- *\/\r\n    .aspire-hero-section {\r\n        --primary-color: #536dfe; \/* Aspire Blue *\/\r\n        --secondary-color: #ff6b81; \/* Aspire Pink\/Red *\/\r\n        --text-dark: #1e293b;\r\n        --text-light: #64748b;\r\n        --bg-gradient: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);\r\n        --blob-shadow: rgba(83, 109, 254, 0.25);\r\n        font-family: 'Outfit', sans-serif;\r\n    }\r\n\r\n    \/* --- CONTAINER SETUP --- *\/\r\n    .aspire-hero-wrapper {\r\n        display: flex;\r\n        justify-content: center;\r\n        align-items: center;\r\n        padding: 80px 20px;\r\n        background: var(--bg-gradient);\r\n        overflow: hidden; \/* Keeps animations inside *\/\r\n        position: relative;\r\n    }\r\n\r\n    \/* Background Decoration (Optional Subtle Circle) *\/\r\n    .aspire-hero-wrapper::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: -10%; right: -5%;\r\n        width: 600px; height: 600px;\r\n        background: radial-gradient(circle, rgba(83, 109, 254, 0.05) 0%, transparent 70%);\r\n        border-radius: 50%;\r\n        z-index: 0;\r\n        pointer-events: none;\r\n    }\r\n\r\n    .aspire-container {\r\n        max-width: 1200px;\r\n        width: 100%;\r\n        display: grid;\r\n        grid-template-columns: 1fr 1fr;\r\n        gap: 60px;\r\n        align-items: center;\r\n        position: relative;\r\n        z-index: 1;\r\n    }\r\n\r\n    \/* --- LEFT SIDE: TEXT CONTENT --- *\/\r\n    .aspire-text-col {\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: flex-start;\r\n    }\r\n\r\n    \/* 1. Badge (Pill Shape) *\/\r\n    .aspire-badge {\r\n        display: inline-block;\r\n        background: rgba(83, 109, 254, 0.1);\r\n        color: var(--primary-color);\r\n        font-weight: 700;\r\n        font-size: 14px;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1.5px;\r\n        padding: 10px 22px;\r\n        border-radius: 50px;\r\n        margin-bottom: 25px;\r\n        border: 1px solid rgba(83, 109, 254, 0.2);\r\n    }\r\n\r\n    \/* 2. Heading *\/\r\n    .aspire-heading {\r\n        font-size: clamp(2.5rem, 5vw, 3.8rem); \/* Responsive Text *\/\r\n        font-weight: 800;\r\n        color: var(--text-dark);\r\n        line-height: 1.15;\r\n        margin: 0 0 25px 0;\r\n        letter-spacing: -1px;\r\n    }\r\n\r\n    \/* 3. Description *\/\r\n    .aspire-desc {\r\n        font-size: 1.125rem;\r\n        color: var(--text-light);\r\n        line-height: 1.7;\r\n        margin-bottom: 40px;\r\n        max-width: 520px;\r\n        font-weight: 400;\r\n    }\r\n\r\n    \/* 4. Button *\/\r\n    .aspire-btn {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 10px;\r\n        background: var(--text-dark);\r\n        color: #fff;\r\n        padding: 16px 36px;\r\n        border-radius: 50px;\r\n        text-decoration: none;\r\n        font-weight: 600;\r\n        font-size: 16px;\r\n        transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);\r\n        box-shadow: 0 10px 25px rgba(0,0,0,0.1);\r\n    }\r\n    \r\n    .aspire-btn:hover {\r\n        background: var(--primary-color);\r\n        transform: translateY(-4px);\r\n        box-shadow: 0 20px 40px rgba(83, 109, 254, 0.3);\r\n    }\r\n\r\n    \/* --- RIGHT SIDE: IMAGE BLOB & ANIMATION --- *\/\r\n    .aspire-image-col {\r\n        display: flex;\r\n        justify-content: center;\r\n        align-items: center;\r\n        perspective: 1000px; \/* Essential for 3D Tilt *\/\r\n    }\r\n\r\n    .aspire-image-wrapper {\r\n        position: relative;\r\n        width: 100%;\r\n        max-width: 550px;\r\n        aspect-ratio: 1 \/ 1; \/* Keeps it square\/circle *\/\r\n        \r\n        \/* 1. MASKING (The Blob Shape) *\/\r\n        border-radius: 60% 40% 30% 70% \/ 60% 30% 70% 40%;\r\n        overflow: hidden;\r\n        \r\n        \/* 2. CSS ANIMATIONS (Morph & Float) *\/\r\n        animation: \r\n            blob-morph 8s ease-in-out infinite alternate,\r\n            blob-float 6s ease-in-out infinite;\r\n        \r\n        \/* 3. STYLING *\/\r\n        box-shadow: 0 25px 50px -12px var(--blob-shadow);\r\n        transition: transform 0.1s ease-out; \/* Smooth JS Tilt *\/\r\n        background: #fff; \/* Fallback *\/\r\n        will-change: border-radius, transform;\r\n    }\r\n\r\n    \/* Image Inside Blob *\/\r\n    .aspire-image-wrapper img {\r\n        width: 100%;\r\n        height: 100%;\r\n        object-fit: cover;\r\n        transform: scale(1.1); \/* Prevents white edges during morph *\/\r\n        display: block;\r\n    }\r\n\r\n    \/* --- ANIMATION KEYFRAMES --- *\/\r\n    \r\n    \/* Morphing Shape *\/\r\n    @keyframes blob-morph {\r\n        0% { border-radius: 60% 40% 30% 70% \/ 60% 30% 70% 40%; }\r\n        33% { border-radius: 40% 60% 70% 30% \/ 50% 60% 30% 60%; }\r\n        66% { border-radius: 30% 60% 70% 40% \/ 50% 30% 60% 40%; }\r\n        100% { border-radius: 60% 40% 30% 70% \/ 60% 40% 30% 70%; }\r\n    }\r\n\r\n    \/* Floating Up & Down *\/\r\n    @keyframes blob-float {\r\n        0%, 100% { transform: translateY(0); }\r\n        50% { transform: translateY(-25px); }\r\n    }\r\n\r\n    \/* --- MOBILE RESPONSIVE --- *\/\r\n    @media (max-width: 968px) {\r\n        .aspire-hero-wrapper {\r\n            padding: 60px 20px;\r\n        }\r\n        .aspire-container {\r\n            grid-template-columns: 1fr; \/* Stack vertically *\/\r\n            text-align: center;\r\n            gap: 50px;\r\n        }\r\n        .aspire-text-col {\r\n            align-items: center; \/* Center align text *\/\r\n        }\r\n        .aspire-desc {\r\n            margin: 0 auto 30px auto;\r\n        }\r\n        .aspire-image-wrapper {\r\n            max-width: 400px; \/* Smaller image on mobile *\/\r\n            margin: 0 auto;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"aspire-hero-section\">\r\n    <div class=\"aspire-hero-wrapper\">\r\n        <div class=\"aspire-container\">\r\n            \r\n            <div class=\"aspire-text-col\">\r\n                <span class=\"aspire-badge\">Who We Are<\/span>\r\n                \r\n                <h2 class=\"aspire-heading\">\r\n                    Today is the perfect time to grow your brand.\r\n                <\/h2>\r\n                \r\n                <p class=\"aspire-desc\">\r\n                    Now is the ideal time to engage with your audience online and expand your brand\u2019s reach through strategic, data-driven digital solutions tailored for your growth.\r\n                <\/p>\r\n                \r\n                <a href=\"https:\/\/aspiredigitalsolutions.in\/contact-us\/\" class=\"aspire-btn\">\r\n                    Start Your Journey <i class=\"fas fa-arrow-right\"><\/i>\r\n                <\/a>\r\n            <\/div>\r\n\r\n            <div class=\"aspire-image-col\">\r\n                <div class=\"aspire-image-wrapper\" id=\"aspireTiltCard\">\r\n                    <img decoding=\"async\" src=\"https:\/\/aspiredigitalsolutions.in\/wp-content\/uploads\/2025\/03\/Branding-Services-1.webp\" alt=\"Aspire Digital Branding\">\r\n                <\/div>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0\/css\/all.min.css\">\r\n\r\n<script>\r\n    document.addEventListener(\"DOMContentLoaded\", function() {\r\n        \r\n        \/\/ --- 3D TILT LOGIC ---\r\n        const card = document.getElementById('aspireTiltCard');\r\n        const container = document.querySelector('.aspire-image-col');\r\n\r\n        if(card && container) {\r\n            \r\n            container.addEventListener('mousemove', (e) => {\r\n                \/\/ Calculate mouse position relative to center\r\n                const rect = container.getBoundingClientRect();\r\n                const x = e.clientX - rect.left; \r\n                const y = e.clientY - rect.top;\r\n                \r\n                \/\/ Sensitivity (Higher number = less movement)\r\n                const xAxis = (rect.width \/ 2 - x) \/ 20; \r\n                const yAxis = (rect.height \/ 2 - y) \/ 20;\r\n                \r\n                \/\/ Apply rotation\r\n                card.style.transform = `rotateY(${xAxis}deg) rotateX(${yAxis}deg) scale(1.05)`;\r\n            });\r\n\r\n            \/\/ Reset Animation when mouse leaves\r\n            container.addEventListener('mouseleave', () => {\r\n                card.style.transform = `rotateY(0deg) rotateX(0deg) scale(1)`;\r\n                card.style.transition = 'transform 0.6s ease';\r\n            });\r\n\r\n            \/\/ Remove transition on enter to make it snappy\r\n            container.addEventListener('mouseenter', () => {\r\n                card.style.transition = 'none';\r\n            });\r\n        }\r\n    });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-12f47de e-con-full e-flex e-con e-parent\" data-id=\"12f47de\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7717e0f elementor-widget elementor-widget-html\" data-id=\"7717e0f\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0\/css\/all.min.css\" rel=\"stylesheet\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;700;800&family=Outfit:wght@400;600;700&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    \/* --- SCOPED CSS --- *\/\r\n    :root {\r\n        --ads-blue: #7C8BA1;      \/* Soft Slate Blue for subtle typography *\/\r\n        --ads-dark: #2A2135;      \/* Deep Plum-Slate for crisp text contrast *\/\r\n        --ads-light: #FBF9FC;     \/* Ultra Light Tinted Background *\/\r\n        --ads-text: #4A3E56;      \/* Polished Body Text Color *\/\r\n        --ads-gray: #6B5E78;      \/* Soft Accent Muted Hue *\/\r\n        --ads-accent: #E5A4CD;    \/* Pastel Orchid Pink for primary buttons *\/\r\n        --ads-accent-hover: #D48BB9; \r\n    }\r\n\r\n    .ads-auth-wrapper {\r\n        font-family: 'Manrope', sans-serif !important;\r\n        margin: 0;\r\n        background: var(--ads-light);\r\n        color: var(--ads-text);\r\n        padding-top: 0px; \r\n        line-height: 1.6;\r\n    }\r\n    \r\n    .ads-auth-wrapper * { box-sizing: border-box; }\r\n\r\n    \/* --- HERO SECTION WITH IMAGE GRADIENT MATCH --- *\/\r\n    .ads-auth-hero {\r\n        background: linear-gradient(135deg, #FFF9ED 0%, #E3E6FB 25%, #F5D3EC 60%, #F9C3E3 100%);\r\n        color: var(--ads-dark);\r\n        padding: 80px 20px 60px;\r\n        position: relative;\r\n        overflow: hidden;\r\n    }\r\n\r\n    .ads-auth-container {\r\n        max-width: 1200px;\r\n        margin: 0 auto;\r\n        position: relative;\r\n        z-index: 2;\r\n    }\r\n\r\n    .ads-auth-hero-grid {\r\n        display: grid;\r\n        grid-template-columns: 350px 1fr;\r\n        gap: 60px;\r\n        align-items: center;\r\n    }\r\n\r\n    \/* --- SLIDESHOW CSS --- *\/\r\n    .ads-auth-img-box {\r\n        position: relative;\r\n        width: 100%;\r\n        border-radius: 20px;\r\n        box-shadow: 0 20px 45px rgba(229, 164, 205, 0.15); \/* Soft pink matching shadow *\/\r\n        border: 4px solid #FFFFFF; \/* High-contrast crisp white frame *\/\r\n        transition: 0.3s;\r\n        overflow: hidden;\r\n        line-height: 0; \r\n        font-size: 0;\r\n    }\r\n    \r\n    .ads-auth-img-box:hover { \r\n        transform: translateY(-5px); \r\n        border-color: var(--ads-accent); \r\n    }\r\n    \r\n    .ads-auth-img {\r\n        width: 100%;\r\n        border-radius: 20px;\r\n        display: block; \r\n        object-fit: cover;\r\n    }\r\n\r\n    .img-1 { \r\n        position: relative; \r\n        height: auto; \r\n        z-index: 1;\r\n        animation: fadeLoop 12s linear infinite;\r\n        animation-delay: 0s;\r\n    }\r\n\r\n    .img-2, .img-3 { \r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        height: 100%; \r\n        z-index: 2;\r\n        opacity: 0; \r\n        animation: fadeLoop 12s linear infinite;\r\n    }\r\n    \r\n    .img-2 { animation-delay: 4s; }\r\n    .img-3 { animation-delay: 8s; }\r\n\r\n    @keyframes fadeLoop {\r\n        0% { opacity: 0; }\r\n        10% { opacity: 1; }\r\n        35% { opacity: 1; } \r\n        45% { opacity: 0; }\r\n        100% { opacity: 0; }\r\n    }\r\n\r\n    \/* --- CONTENT INTERFACE STYLING --- *\/\r\n    .ads-auth-content h1 {\r\n        font-family: 'Outfit', sans-serif;\r\n        font-size: 48px;\r\n        margin: 0 0 10px 0;\r\n        line-height: 1.1;\r\n        color: var(--ads-dark);\r\n    }\r\n    \r\n    .ads-auth-subtitle {\r\n        font-size: 20px;\r\n        color: var(--ads-gray);\r\n        font-weight: 700;\r\n        margin-bottom: 20px;\r\n        display: block;\r\n        font-family: 'Outfit', sans-serif;\r\n        line-height: normal;\r\n        letter-spacing: 0.5px;\r\n    }\r\n\r\n    .ads-auth-bio {\r\n        font-size: 16px;\r\n        line-height: 1.8;\r\n        color: var(--ads-text);\r\n        margin-bottom: 30px;\r\n        max-width: 700px;\r\n        font-weight: 500;\r\n    }\r\n\r\n    .ads-auth-socials {\r\n        display: flex;\r\n        gap: 15px;\r\n        align-items: center;\r\n        flex-wrap: wrap; \r\n    }\r\n    .ads-auth-social-btn {\r\n        width: 45px; height: 45px;\r\n        border-radius: 50%;\r\n        background: #FFFFFF;\r\n        display: flex; align-items: center; justify-content: center;\r\n        color: var(--ads-dark) !important; text-decoration: none !important;\r\n        transition: 0.3s; border: 1px solid rgba(255, 255, 255, 0.8);\r\n        font-size: 18px;\r\n        box-shadow: 0 4px 12px rgba(229, 164, 205, 0.1);\r\n    }\r\n    .ads-auth-social-btn:hover { \r\n        background: var(--ads-accent); \r\n        border-color: var(--ads-accent); \r\n        color: white !important; \r\n        transform: translateY(-3px); \r\n        box-shadow: 0 6px 15px rgba(229, 164, 205, 0.3);\r\n    }\r\n\r\n    \/* --- LEARN MORE BUTTON --- *\/\r\n    .ads-auth-learn-btn {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        height: 45px;\r\n        padding: 0 25px;\r\n        border-radius: 50px;\r\n        background: var(--ads-accent);\r\n        color: white !important;\r\n        font-size: 14px;\r\n        font-weight: 700;\r\n        text-decoration: none !important;\r\n        font-family: 'Outfit', sans-serif;\r\n        transition: 0.3s;\r\n        border: 1px solid var(--ads-accent);\r\n        margin-left: 5px;\r\n        box-shadow: 0 4px 15px rgba(229, 164, 205, 0.25);\r\n    }\r\n    .ads-auth-learn-btn:hover {\r\n        background: #FFFFFF;\r\n        color: var(--ads-accent) !important;\r\n        border-color: var(--ads-accent);\r\n        transform: translateY(-3px);\r\n        box-shadow: 0 6px 20px rgba(229, 164, 205, 0.15);\r\n    }\r\n\r\n    \/* --- MINIMALIST LIGHT STATS BAR --- *\/\r\n    .ads-auth-stats-bar {\r\n        background: #FFFFFF; \r\n        padding: 30px 20px;\r\n        color: var(--ads-dark);\r\n        margin-top: -40px;\r\n        position: relative;\r\n        z-index: 3;\r\n        border-radius: 0 0 20px 20px;\r\n        box-shadow: 0 15px 40px rgba(74, 62, 86, 0.05);\r\n        border: 1px solid rgba(0, 0, 0, 0.02);\r\n    }\r\n    .ads-auth-stats-grid {\r\n        max-width: 1200px;\r\n        margin: 0 auto;\r\n        display: grid;\r\n        grid-template-columns: repeat(4, 1fr);\r\n        gap: 20px;\r\n    }\r\n    .ads-auth-stat-item {\r\n        text-align: center;\r\n        border-right: 1px solid #EAE5ED;\r\n    }\r\n    .ads-auth-stat-item:last-child { border: none; }\r\n    .ads-auth-stat-num { font-size: 32px; font-weight: 800; font-family: 'Outfit', sans-serif; display: block; color: var(--ads-dark);}\r\n    .ads-auth-stat-label { font-size: 14px; opacity: 0.8; text-transform: uppercase; letter-spacing: 1px; color: var(--ads-gray);}\r\n\r\n    \/* RESPONSIVE *\/\r\n    @media (max-width: 900px) {\r\n        .ads-auth-hero-grid { grid-template-columns: 1fr; text-align: center; gap: 30px; }\r\n        .ads-auth-img-box { max-width: 350px; margin: 0 auto; }\r\n        .ads-auth-socials { justify-content: center; }\r\n        .ads-auth-stats-grid { grid-template-columns: 1fr 1fr; gap: 30px; }\r\n        .ads-auth-stat-item { border: none; }\r\n        .ads-auth-content h1 { font-size: 36px; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"ads-auth-wrapper\">\r\n    <section class=\"ads-auth-hero\">\r\n        <div class=\"ads-auth-container\">\r\n            <div class=\"ads-auth-hero-grid\">\r\n                \r\n                <div class=\"ads-auth-img-box\">\r\n                    <img decoding=\"async\" src=\"https:\/\/aspiredigitalsolutions.in\/wp-content\/uploads\/2026\/01\/Rehan-Laptop-shot.webp\" \r\n                         alt=\"Mohammed Rehan SEO and Google Ads expert working on laptop\" \r\n                         class=\"ads-auth-img img-1\">\r\n\r\n                    <img decoding=\"async\" src=\"https:\/\/aspiredigitalsolutions.in\/wp-content\/uploads\/2026\/01\/Rehan-Studio-headshot.webp\" \r\n                         alt=\"Mohammed Rehan SEO and Google Ads expert studio headshot\" \r\n                         class=\"ads-auth-img img-2\">\r\n\r\n                    <img decoding=\"async\" src=\"https:\/\/aspiredigitalsolutions.in\/wp-content\/uploads\/2026\/01\/Rehan-Using-Laptop.webp\" \r\n                         alt=\"Mohammed Rehan founder of Aspire Digital Solutions working on laptop\" \r\n                         class=\"ads-auth-img img-3\">\r\n                <\/div>\r\n\r\n                <div class=\"ads-auth-content\">\r\n                    <span class=\"ads-auth-subtitle\">Founder & Strategist<\/span>\r\n                    <h1>Mohammed Rehan<\/h1>\r\n                    <p style=\"font-size: 18px; color: var(--ads-gray); font-weight:600; margin-bottom:15px;\">SEO & Google Ads Expert<\/p>\r\n                    <div class=\"ads-auth-bio\">\r\n                        Mohammed Rehan is an experienced digital marketing expert with over 7 years of professional experience in driving search visibility, lead generation, and revenue growth. Founder of Aspire Digital Solutions, he serves clients across India, UK, USA, and the Middle East.\r\n                    <\/div>\r\n                    <div class=\"ads-auth-socials\">\r\n                        <a href=\"https:\/\/www.linkedin.com\/company\/aspire-digital-solution\/\" target=\"_blank\" class=\"ads-auth-social-btn\" rel=\"noopener\"><i class=\"fab fa-linkedin-in\"><\/i><\/a>\r\n                        <a href=\"https:\/\/www.instagram.com\/aspiredigitalsolution?igsh=MWZwYzI2cjR0d3I4MQ==\" target=\"_blank\" class=\"ads-auth-social-btn\" rel=\"noopener\"><i class=\"fab fa-instagram\"><\/i><\/a>\r\n                        <a href=\"https:\/\/www.facebook.com\/share\/17u1fikfR5\/?mibextid=wwXIfr\" target=\"_blank\" class=\"ads-auth-social-btn\" rel=\"noopener\"><i class=\"fab fa-facebook-f\"><\/i><\/a>\r\n                        <a href=\"https:\/\/youtube.com\/@aspiredigitalsolutions-k1j?si=Fi088aMNyBcGTb0N\" target=\"_blank\" class=\"ads-auth-social-btn\" rel=\"noopener\"><i class=\"fab fa-youtube\"><\/i><\/a>\r\n                        \r\n                        <a href=\"https:\/\/www.imdb.com\/name\/nm16511664\/\" target=\"_blank\" class=\"ads-auth-social-btn\" title=\"IMDb Profile\" rel=\"noopener\">\r\n                            <i class=\"fab fa-imdb\"><\/i>\r\n                        <\/a>\r\n\r\n                        <a href=\"https:\/\/www.crunchbase.com\/person\/rehan-mohammed-2e62\" target=\"_blank\" class=\"ads-auth-social-btn\" title=\"Crunchbase Profile\" rel=\"noopener\">\r\n                            <i class=\"fas fa-building\"><\/i>\r\n                        <\/a>\r\n\r\n                        <a href=\"https:\/\/arisetimes.in\/spotlight\/mohammed-rehan-builds-a-steady-track-record\/\" target=\"_blank\" class=\"ads-auth-social-btn\" title=\"Featured in Arise Times\" rel=\"noopener\">\r\n                            <i class=\"fas fa-newspaper\"><\/i>\r\n                        <\/a>\r\n\r\n                        <!-- LEARN MORE BUTTON -->\r\n                        <a href=\"https:\/\/aspiredigitalsolutions.in\/mohammed-rehan\" class=\"ads-auth-learn-btn\">\r\n                            Learn More <i class=\"fas fa-arrow-right\" style=\"margin-left:8px; font-size:12px;\"><\/i>\r\n                        <\/a>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <div class=\"ads-auth-stats-bar\">\r\n        <div class=\"ads-auth-stats-grid\">\r\n            <div class=\"ads-auth-stat-item\">\r\n                <span class=\"ads-auth-stat-num\">7+<\/span>\r\n                <span class=\"ads-auth-stat-label\">Years Experience<\/span>\r\n            <\/div>\r\n            <div class=\"ads-auth-stat-item\">\r\n                <span class=\"ads-auth-stat-num\">500%<\/span>\r\n                <span class=\"ads-auth-stat-label\">Traffic Growth<\/span>\r\n            <\/div>\r\n            <div class=\"ads-auth-stat-item\">\r\n                <span class=\"ads-auth-stat-num\">2000+<\/span>\r\n                <span class=\"ads-auth-stat-label\">Leads Generated<\/span>\r\n            <\/div>\r\n            <div class=\"ads-auth-stat-item\">\r\n                <span class=\"ads-auth-stat-num\">4<\/span>\r\n                <span class=\"ads-auth-stat-label\">Countries Served<\/span>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5fec03d e-con-full e-flex e-con e-parent\" data-id=\"5fec03d\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-799aa77 elementor-widget elementor-widget-html\" data-id=\"799aa77\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    \/* --- Scoped CSS Variables --- *\/\r\n    .aspire-premium-widget {\r\n        --primary: #2563eb;       \/* Brand Blue *\/\r\n        --dark: #0f172a;          \/* Dark Slate *\/\r\n        --light-bg: #f8fafc;      \/* Background *\/\r\n        --card-bg: #ffffff;       \/* Card White *\/\r\n        --sidebar-bg: #eff6ff;    \/* Light Blue Accent *\/\r\n        --text-grey: #64748b;\r\n        --border-color: #e2e8f0;\r\n        --shadow: 0 10px 40px -10px rgba(0,0,0,0.08);\r\n        font-family: 'Poppins', sans-serif;\r\n        box-sizing: border-box;\r\n        line-height: 1.6;\r\n        background-color: var(--light-bg);\r\n        padding: 60px 20px;\r\n    }\r\n\r\n    .aspire-premium-widget * {\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    \/* --- Main Container --- *\/\r\n    .aspire-box {\r\n        max-width: 1150px;\r\n        margin: 0 auto;\r\n        background: var(--card-bg);\r\n        border-radius: 20px;\r\n        padding: 50px;\r\n        box-shadow: var(--shadow);\r\n        border: 1px solid rgba(255,255,255,0.5);\r\n    }\r\n\r\n    \/* --- Header Section --- *\/\r\n    .aspire-head {\r\n        text-align: center;\r\n        max-width: 700px;\r\n        margin: 0 auto 50px auto;\r\n    }\r\n\r\n    .aspire-badge {\r\n        display: inline-block;\r\n        background: rgba(37, 99, 235, 0.1);\r\n        color: var(--primary);\r\n        font-size: 0.8rem;\r\n        font-weight: 700;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1.5px;\r\n        padding: 8px 16px;\r\n        border-radius: 50px;\r\n        margin-bottom: 15px;\r\n    }\r\n\r\n    .aspire-title {\r\n        font-size: clamp(2rem, 4vw, 2.8rem); \/* Fluid Text *\/\r\n        color: var(--dark);\r\n        font-weight: 700;\r\n        line-height: 1.2;\r\n        margin: 0;\r\n    }\r\n\r\n    \/* --- Content Layout (Grid) --- *\/\r\n    .aspire-layout {\r\n        display: grid;\r\n        grid-template-columns: 1.2fr 1.5fr; \/* Text | Sidebar *\/\r\n        gap: 50px;\r\n        align-items: center;\r\n    }\r\n\r\n    \/* --- Left: Text Content --- *\/\r\n    .aspire-content h3 {\r\n        font-size: 1.5rem;\r\n        color: var(--dark);\r\n        margin-bottom: 20px;\r\n        font-weight: 600;\r\n    }\r\n\r\n    .aspire-content p {\r\n        color: var(--text-grey);\r\n        font-size: 1.05rem;\r\n        margin-bottom: 25px;\r\n    }\r\n\r\n    .aspire-btn-primary {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 10px;\r\n        background-color: var(--dark);\r\n        color: white;\r\n        padding: 14px 35px;\r\n        border-radius: 8px;\r\n        text-decoration: none;\r\n        font-weight: 600;\r\n        transition: all 0.3s ease;\r\n        border: 2px solid transparent;\r\n    }\r\n\r\n    .aspire-btn-primary:hover {\r\n        background-color: transparent;\r\n        color: var(--dark);\r\n        border-color: var(--dark);\r\n        transform: translateY(-2px);\r\n    }\r\n\r\n    \/* --- Right: Sidebar Row --- *\/\r\n    .aspire-row-card {\r\n        background: var(--sidebar-bg);\r\n        border: 1px solid #dbeafe;\r\n        border-radius: 16px;\r\n        padding: 35px;\r\n        \r\n        \/* Flexbox for Row Layout *\/\r\n        display: flex; \r\n        flex-direction: row; \r\n        align-items: flex-start;\r\n        gap: 40px;\r\n        \r\n        position: relative;\r\n        overflow: hidden;\r\n    }\r\n\r\n    \/* Decorative Circle in BG *\/\r\n    .aspire-row-card::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: -50px; right: -50px;\r\n        width: 150px; height: 150px;\r\n        background: rgba(37, 99, 235, 0.05);\r\n        border-radius: 50%;\r\n        z-index: 0;\r\n    }\r\n\r\n    \/* Section 1: Stats *\/\r\n    .aspire-stats-group {\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 25px;\r\n        min-width: 140px;\r\n        border-right: 1px solid rgba(37, 99, 235, 0.15); \/* Divider *\/\r\n        padding-right: 30px;\r\n        position: relative;\r\n        z-index: 1;\r\n    }\r\n\r\n    .stat-unit h4 {\r\n        font-size: 2.2rem;\r\n        color: var(--primary);\r\n        font-weight: 700;\r\n        margin: 0;\r\n        line-height: 1;\r\n    }\r\n\r\n    .stat-unit span {\r\n        font-size: 0.9rem;\r\n        color: var(--text-grey);\r\n        font-weight: 500;\r\n        display: block;\r\n        margin-top: 5px;\r\n    }\r\n\r\n    \/* Section 2: Services *\/\r\n    .aspire-services-group {\r\n        flex-grow: 1;\r\n        position: relative;\r\n        z-index: 1;\r\n    }\r\n\r\n    .aspire-services-group h5 {\r\n        font-size: 1rem;\r\n        color: var(--dark);\r\n        margin: 0 0 15px 0;\r\n        font-weight: 700;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    .tag-cloud {\r\n        display: flex;\r\n        flex-wrap: wrap;\r\n        gap: 10px;\r\n    }\r\n\r\n    .aspire-tag {\r\n        background: white;\r\n        color: var(--text-grey);\r\n        padding: 8px 16px;\r\n        border-radius: 6px;\r\n        font-size: 0.85rem;\r\n        font-weight: 500;\r\n        border: 1px solid #e2e8f0;\r\n        transition: all 0.2s ease;\r\n        box-shadow: 0 2px 5px rgba(0,0,0,0.02);\r\n        cursor: default;\r\n    }\r\n\r\n    .aspire-tag:hover {\r\n        color: var(--primary);\r\n        border-color: var(--primary);\r\n        transform: translateY(-2px);\r\n        box-shadow: 0 4px 10px rgba(37, 99, 235, 0.15);\r\n    }\r\n\r\n    \/* --- Responsive Breakpoints --- *\/\r\n    @media (max-width: 992px) {\r\n        .aspire-layout {\r\n            grid-template-columns: 1fr;\r\n            gap: 40px;\r\n        }\r\n    }\r\n\r\n    @media (max-width: 600px) {\r\n        .aspire-box { padding: 30px 20px; }\r\n        \r\n        .aspire-row-card {\r\n            flex-direction: column;\r\n            gap: 30px;\r\n            padding: 25px;\r\n        }\r\n\r\n        .aspire-stats-group {\r\n            flex-direction: row;\r\n            justify-content: space-between;\r\n            width: 100%;\r\n            border-right: none;\r\n            border-bottom: 1px solid rgba(37, 99, 235, 0.15);\r\n            padding-right: 0;\r\n            padding-bottom: 25px;\r\n        }\r\n\r\n        .stat-unit h4 { font-size: 1.8rem; }\r\n        \r\n        .aspire-btn-primary { width: 100%; justify-content: center; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"aspire-premium-widget\">\r\n    <div class=\"aspire-box\">\r\n        \r\n        <div class=\"aspire-head\">\r\n            <span class=\"aspire-badge\">Digital Excellence<\/span>\r\n            <h2 class=\"aspire-title\">Aspire Digital Solutions<\/h2>\r\n        <\/div>\r\n\r\n        <div class=\"aspire-layout\">\r\n            \r\n            <div class=\"aspire-content\">\r\n                <h3>Driving Business Growth<\/h3>\r\n                <p>\r\n                    Serving clients across <strong>India, the UK, the USA, and the Middle East<\/strong>, we have built a trusted reputation for delivering results-driven digital marketing and SEO solutions. Our team is passionate about tailoring high-performance strategies to meet the unique growth requirements of every business.\r\n                <\/p>\r\n                <p>\r\n                    Whether you're a local service provider in <strong>Bangalore and Mysore<\/strong> or a brand scaling internationally, our data-driven approach helps you build long-lasting relationships and achieve measurable revenue growth.\r\n                <\/p>\r\n                <a href=\"#contact\" class=\"aspire-btn-primary\">Connect With Us &rarr;<\/a>\r\n            <\/div>\r\n\r\n            <div class=\"aspire-row-card\">\r\n                \r\n                <div class=\"aspire-stats-group\">\r\n                    <div class=\"stat-unit\">\r\n                        <h4>7+<\/h4>\r\n                        <span>Years Experience<\/span>\r\n                    <\/div>\r\n                    <div class=\"stat-unit\">\r\n                        <h4>4<\/h4>\r\n                        <span>Key Global Markets<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"aspire-services-group\">\r\n                    <h5>Our Expertise<\/h5>\r\n                    <div class=\"tag-cloud\">\r\n                        <span class=\"aspire-tag\">SEO<\/span>\r\n                        <span class=\"aspire-tag\">PPC<\/span>\r\n                        <span class=\"aspire-tag\">Web Dev<\/span>\r\n                        <span class=\"aspire-tag\">Branding<\/span>\r\n                        <span class=\"aspire-tag\">Social Media<\/span>\r\n                        <span class=\"aspire-tag\">Strategy<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1262a8d e-con-full e-flex e-con e-parent\" data-id=\"1262a8d\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-161831d elementor-widget elementor-widget-html\" data-id=\"161831d\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\r\n    \/* Google Fonts *\/\r\n    @import url('https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');\r\n\r\n    \/* Scoped Wrapper *\/\r\n    .aspire-stats-wrapper {\r\n        \/* --- COLORS --- *\/\r\n        --primary-blue: #536dfe;\r\n        --accent-pink: #ff6b81;\r\n        --text-white: #ffffff;\r\n        --text-gray: #e2e8f0;\r\n        --bg-glass: rgba(255, 255, 255, 0.08);\r\n        --gradient: linear-gradient(135deg, #536dfe 0%, #ff6b81 100%);\r\n        --shadow-soft: 0 8px 32px 0 rgba(0, 0, 0, 0.4);\r\n        \r\n        font-family: 'Poppins', sans-serif;\r\n        padding: 90px 20px;\r\n        width: 100%; \r\n        text-align: center;\r\n        \r\n        \/* --- BACKGROUND IMAGE --- *\/\r\n        background-image: \r\n            linear-gradient(to bottom, rgba(5, 10, 25, 0.9), rgba(5, 10, 25, 0.95)), \r\n            url('https:\/\/images.unsplash.com\/photo-1557683316-973673baf926?q=80&w=2029&auto=format&fit=crop');\r\n        background-size: cover;\r\n        background-position: center;\r\n        background-attachment: fixed; \/* Parallax on Desktop *\/\r\n    }\r\n\r\n    .aspire-container-inner {\r\n        max-width: 1200px;\r\n        margin: 0 auto;\r\n    }\r\n\r\n    \/* --- HEADING STYLE (PURE WHITE) --- *\/\r\n    .aspire-section-heading {\r\n        font-size: clamp(2rem, 5vw, 3.5rem); \/* Responsive Font Size *\/\r\n        font-weight: 700;\r\n        color: #ffffff !important; \r\n        margin-bottom: 70px;\r\n        position: relative;\r\n        display: inline-block;\r\n        line-height: 1.2;\r\n        text-shadow: 0 4px 15px rgba(0,0,0,0.5);\r\n        padding: 0 10px; \/* Prevent text touching edges on small screens *\/\r\n    }\r\n\r\n    \/* Gradient Underline *\/\r\n    .aspire-section-heading::after {\r\n        content: '';\r\n        position: absolute;\r\n        bottom: -20px;\r\n        left: 50%;\r\n        transform: translateX(-50%);\r\n        width: 100px;\r\n        height: 6px;\r\n        background: var(--gradient);\r\n        border-radius: 10px;\r\n        box-shadow: 0 0 20px rgba(83, 109, 254, 0.6);\r\n    }\r\n\r\n    \/* --- GRID LAYOUT --- *\/\r\n    .aspire-stats-grid {\r\n        display: grid;\r\n        \/* Intelligent wrapping: Minimum 240px wide, or 1fr *\/\r\n        grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));\r\n        gap: 30px;\r\n        text-align: center;\r\n    }\r\n\r\n    \/* --- GLASS CARD STYLE --- *\/\r\n    .aspire-stat-card {\r\n        background: var(--bg-glass);\r\n        backdrop-filter: blur(12px);\r\n        -webkit-backdrop-filter: blur(12px);\r\n        border: 1px solid rgba(255, 255, 255, 0.1);\r\n        box-shadow: var(--shadow-soft);\r\n        \r\n        padding: 50px 30px;\r\n        border-radius: 24px;\r\n        transition: all 0.4s ease;\r\n        position: relative;\r\n        overflow: hidden;\r\n        z-index: 1;\r\n    }\r\n\r\n    \/* Top Gradient Line *\/\r\n    .aspire-stat-card::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; left: 0; width: 100%; height: 4px;\r\n        background: var(--gradient);\r\n        transform: scaleX(0);\r\n        transform-origin: left;\r\n        transition: transform 0.4s ease;\r\n    }\r\n\r\n    \/* Hover Effects *\/\r\n    .aspire-stat-card:hover {\r\n        transform: translateY(-15px);\r\n        background: rgba(255, 255, 255, 0.12);\r\n        border-color: rgba(255, 255, 255, 0.3);\r\n        box-shadow: 0 20px 50px rgba(0,0,0,0.5);\r\n    }\r\n\r\n    .aspire-stat-card:hover::before {\r\n        transform: scaleX(1);\r\n    }\r\n\r\n    \/* --- NUMBER STYLE --- *\/\r\n    .aspire-stat-number {\r\n        font-size: clamp(2.5rem, 5vw, 4rem); \/* Responsive Number *\/\r\n        font-weight: 800;\r\n        margin-bottom: 10px;\r\n        line-height: 1;\r\n        \r\n        background: var(--gradient);\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n        display: inline-block;\r\n        filter: drop-shadow(0 5px 15px rgba(83, 109, 254, 0.3));\r\n    }\r\n\r\n    .aspire-suffix {\r\n        font-size: 0.5em; \r\n        vertical-align: super;\r\n        margin-left: 5px;\r\n        opacity: 1;\r\n        -webkit-text-fill-color: #ff6b81;\r\n    }\r\n\r\n    \/* TITLE STYLE *\/\r\n    .aspire-stat-title {\r\n        font-size: 1.2rem;\r\n        color: var(--text-gray);\r\n        font-weight: 500;\r\n        text-transform: uppercase;\r\n        letter-spacing: 2px;\r\n        margin-top: 10px;\r\n    }\r\n\r\n    \/* --- RESPONSIVE MEDIA QUERIES --- *\/\r\n    \r\n    \/* Tablet (Max Width 1024px) *\/\r\n    @media (max-width: 1024px) {\r\n        .aspire-stats-wrapper {\r\n            padding: 70px 20px;\r\n        }\r\n        .aspire-stat-card {\r\n            padding: 40px 20px; \/* Slightly less padding *\/\r\n        }\r\n    }\r\n\r\n    \/* Mobile (Max Width 767px) *\/\r\n    @media (max-width: 767px) {\r\n        .aspire-stats-wrapper {\r\n            padding: 60px 15px;\r\n            \/* Disable fixed background on mobile for better performance *\/\r\n            background-attachment: scroll; \r\n        }\r\n\r\n        .aspire-section-heading {\r\n            margin-bottom: 50px;\r\n            font-size: 2rem; \/* Smaller heading on mobile *\/\r\n        }\r\n\r\n        .aspire-section-heading::after {\r\n            width: 70px; \/* Smaller underline *\/\r\n            bottom: -15px;\r\n        }\r\n\r\n        .aspire-stats-grid {\r\n            gap: 20px; \/* Smaller gap between cards *\/\r\n            grid-template-columns: 1fr; \/* Force 1 column on very small screens if needed, otherwise minmax handles it *\/\r\n        }\r\n\r\n        .aspire-stat-card {\r\n            padding: 30px 20px; \/* Compact card *\/\r\n        }\r\n\r\n        .aspire-stat-number {\r\n            font-size: 3rem; \/* Readable size for mobile *\/\r\n        }\r\n\r\n        .aspire-stat-title {\r\n            font-size: 1rem;\r\n            letter-spacing: 1px;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"aspire-stats-wrapper\">\r\n    <div class=\"aspire-container-inner\">\r\n    \r\n        <h2 class=\"aspire-section-heading\">Why Choose Aspire Digital Solutions?<\/h2>\r\n\r\n        <div class=\"aspire-stats-grid\">\r\n            \r\n            <div class=\"aspire-stat-card\">\r\n                <div class=\"aspire-stat-number\" data-target=\"1\">0<span class=\"aspire-suffix\">K+<\/span><\/div>\r\n                <div class=\"aspire-stat-title\">Happy Clients<\/div>\r\n            <\/div>\r\n\r\n            <div class=\"aspire-stat-card\">\r\n                <div class=\"aspire-stat-number\" data-target=\"2\">0<span class=\"aspire-suffix\">K+<\/span><\/div>\r\n                <div class=\"aspire-stat-title\">Projects Done<\/div>\r\n            <\/div>\r\n\r\n            <div class=\"aspire-stat-card\">\r\n                <div class=\"aspire-stat-number\" data-target=\"4.9\" data-decimal=\"true\">0<\/div>\r\n                <div class=\"aspire-stat-title\">Client Ratings<\/div>\r\n            <\/div>\r\n\r\n            <div class=\"aspire-stat-card\">\r\n                <div class=\"aspire-stat-number\" data-target=\"7\">0<span class=\"aspire-suffix\">+<\/span><\/div>\r\n                <div class=\"aspire-stat-title\">Years Experience<\/div>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\n    document.addEventListener(\"DOMContentLoaded\", () => {\r\n        const counters = document.querySelectorAll('.aspire-stat-number');\r\n        \r\n        const animateCounters = (entries, observer) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    const counter = entry.target;\r\n                    const target = parseFloat(counter.getAttribute('data-target'));\r\n                    const isDecimal = counter.getAttribute('data-decimal') === 'true';\r\n                    \r\n                    const suffixSpan = counter.querySelector('.aspire-suffix');\r\n                    const suffixHTML = suffixSpan ? suffixSpan.outerHTML : ''; \r\n                    \r\n                    let count = 0;\r\n                    const duration = 2000;\r\n                    const steps = 60;\r\n                    const increment = target \/ steps;\r\n                    \r\n                    let currentStep = 0;\r\n\r\n                    const timer = setInterval(() => {\r\n                        currentStep++;\r\n                        count += increment;\r\n\r\n                        if (currentStep >= steps) {\r\n                            counter.innerHTML = target + suffixHTML;\r\n                            clearInterval(timer);\r\n                        } else {\r\n                            if(isDecimal) {\r\n                                counter.innerHTML = count.toFixed(1) + suffixHTML;\r\n                            } else {\r\n                                counter.innerHTML = Math.ceil(count) + suffixHTML;\r\n                            }\r\n                        }\r\n                    }, duration \/ steps);\r\n                    \r\n                    observer.unobserve(counter);\r\n                }\r\n            });\r\n        };\r\n\r\n        const observer = new IntersectionObserver(animateCounters, {\r\n            threshold: 0.2 \/\/ Start animation a bit earlier on mobile\r\n        });\r\n\r\n        counters.forEach(counter => observer.observe(counter));\r\n    });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f66e9da e-con-full e-flex e-con e-parent\" data-id=\"f66e9da\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-fd1a6ed elementor-widget elementor-widget-html\" data-id=\"fd1a6ed\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<script type=\"application\/ld+json\">\r\n{\r\n  \"@context\": \"https:\/\/schema.org\",\r\n  \"@type\": \"AboutPage\",\r\n  \"mainEntity\": {\r\n    \"@type\": \"Organization\",\r\n    \"name\": \"Aspire Digital Solutions\",\r\n    \"url\": \"https:\/\/aspiredigitalsolutions.in\/\",\r\n    \"logo\": \"https:\/\/aspiredigitalsolutions.in\/wp-content\/uploads\/2024\/04\/cropped-Untitled-design-2.png\",\r\n    \"email\": \"info@aspiredigitalsolutions.in\",\r\n    \"address\": {\r\n      \"@type\": \"PostalAddress\",\r\n      \"streetAddress\": \"3\/D, 7th Cross Rd, Subhasnagara, Rajendra Nagar\",\r\n      \"addressLocality\": \"Mysuru\",\r\n      \"addressRegion\": \"Karnataka\",\r\n      \"postalCode\": \"570007\",\r\n      \"addressCountry\": \"IN\"\r\n    },\r\n    \"sameAs\": [\r\n      \"https:\/\/www.facebook.com\/aspiredigitalsolutions\"\r\n    ]\r\n  }\r\n}\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>#1 Digital Agency Scale Your BusinessWith Real Data. We turn clicks into customers using advanced SEO, paid strategies, and data-driven marketing campaigns. Start Growing Today Our Services SEO Optimization Google Ads (PPC) Website Development Social Media Marketing Branding Strategy Email Marketing Graphic Designing Content Marketing SEO Optimization Google Ads (PPC) Website Development Social Media Marketing [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"class_list":["post-9","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/aspiredigitalsolutions.in\/ar\/wp-json\/wp\/v2\/pages\/9","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aspiredigitalsolutions.in\/ar\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/aspiredigitalsolutions.in\/ar\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/aspiredigitalsolutions.in\/ar\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/aspiredigitalsolutions.in\/ar\/wp-json\/wp\/v2\/comments?post=9"}],"version-history":[{"count":78,"href":"https:\/\/aspiredigitalsolutions.in\/ar\/wp-json\/wp\/v2\/pages\/9\/revisions"}],"predecessor-version":[{"id":20022,"href":"https:\/\/aspiredigitalsolutions.in\/ar\/wp-json\/wp\/v2\/pages\/9\/revisions\/20022"}],"wp:attachment":[{"href":"https:\/\/aspiredigitalsolutions.in\/ar\/wp-json\/wp\/v2\/media?parent=9"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}