/*  
Theme Name: فرازنو
Theme URI: https://farazno.com
Description: فرازنو|شبکه تبلیغات هوشمند
Version: 1.0
Author: میهن فراز توسعه یاس
Author URI: https://mihanfaraz.com
*/

@font-face{font-family:iransansweb;src:url(https://farazno.com/fonts/IRANSansWeb_Medium.woff2) format('woff2'),url(https://farazno.com/fonts/IRANSansWeb_Medium.ttf) format('truetype');font-weight:100}/* IE6–8 */
@font-face{font-family:iransansweb;src:url(https://farazno.com/fonts/IRANSansWeb_Medium.woff2) format('woff2'),url(https://farazno.com/fonts/IRANSansWeb_Medium.ttf) format('truetype');font-weight:200}/* FF3.6+, IE9, Chrome6+, Saf5.1+*/
@font-face{font-family:iransansweb;src:url(https://farazno.com/fonts/IRANSansWeb_Medium.woff2) format('woff2'),url(https://farazno.com/fonts/IRANSansWeb_Medium.ttf) format('truetype');font-weight:300}/* FF3.6+, IE9, Chrome6+, Saf5.1+*/
@font-face{font-family:iransansweb;src:url(https://farazno.com/fonts/IRANSansWeb_Medium.woff2) format('woff2'),url(https://farazno.com/fonts/IRANSansWeb_Medium.ttf) format('truetype');font-weight:400}/* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
@font-face{font-family:iransansweb;src:url(https://farazno.com/fonts/IRANSansWeb_Medium.woff2) format('woff2'),url(https://farazno.com/fonts/IRANSansWeb_Medium.ttf) format('truetype');font-weight:500}
@font-face{font-family:iransansweb;src:url(https://farazno.com/fonts/IRANSansWebNoEn_Medium.woff2) format('woff2'),url(https://farazno.com/fonts/IRANSansWebNoEn_Medium.ttf) format('truetype');font-weight:500}
@font-face{font-family:iransansweb;src:url(https://farazno.com/fonts/IRANSansMonoSpacedNum_Medium.woff) format('woff'),url(https://farazno.com/fonts/IRANSansMonoSpacedNum_Medium.ttf) format('truetype');font-weight:500}
@font-face{font-family:iransansweb;src:url(https://farazno.com/fonts/IRANSansMonoSpacedNum_Bold.woff) format('woff'),url(https://farazno.com/fonts/IRANSansMonoSpacedNum_Bold.ttf) format('truetype');font-weight:700}
@font-face{font-family:iransansweb;src:url(https://farazno.com/fonts/IRANSansWeb_Bold.woff2) format('woff2'),url(https://farazno.com/fonts/IRANSansWeb_Bold.ttf) format('truetype');font-weight:700}
@font-face{font-family:iransansweb;src:url(https://farazno.com/fonts/IRANSansWeb_Bold.woff2) format('woff2'),url(https://farazno.com/fonts/IRANSansWeb_Bold.ttf) format('truetype');font-weight:900}
.wp-block-nextpage>span {  

font-family: iransansweb !important;
font-weight: revert-layer;
}
* {
  outline: none !important;
}

body.rtl {
	font-family: iransansweb;
}
body{font-family:iransansweb;font-size:16px;}
#tinymce{font-family: iransansweb; font-size:13px;font-weight: normal;}

 body {
            box-sizing: border-box;
            font-family: 'iransansweb', sans-serif;
            direction: rtl;
            text-align: right;
            margin: 0;
            padding: 0;
            line-height: 1.6;
        }
        
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        :root {
            --purple-50: #faf5ff;
            --purple-100: #f3e8ff;
            --purple-200: #e9d5ff;
            --purple-300: #d8b4fe;
            --purple-400: #c084fc;
            --purple-500: #a855f7;
            --purple-600: #9333ea;
            --purple-700: #7c3aed;
            --purple-800: #6b21a8;
            --purple-900: #581c87;
            --purple: #8b5cf6;
            --white: #ffffff;
            --gray: #6c757d;
            --light-gray: #f8f9fa;
            --dark: #212529;
            --accent-color: #ff6b35;
        }
        
        .bg-primary-gradient {
            background: linear-gradient(135deg, var(--purple-600), var(--purple-800));
        }
        
        .bg-primary-transparent {
            background: rgba(139, 92, 246, 0.1);
        }
        
        .shadow-primary {
            box-shadow: 0 4px 15px rgba(139, 92, 246, 0.3);
        }
        
        .btn-wave {
            position: relative;
            overflow: hidden;
        }
        
        .btn-wave::before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 0;
            height: 0;
            background: rgba(255, 255, 255, 0.2);
            border-radius: 50%;
            transform: translate(-50%, -50%);
            transition: width 0.6s, height 0.6s;
        }
        
        .btn-wave:hover::before {
            width: 300px;
            height: 300px;
        }
        
        /* Dark mode styles */
        [data-theme="dark"] {
            --white: #1a1a1a;
            --light-gray: #2d2d2d;
            --dark: #ffffff;
            --gray: #a0a0a0;
        }
        
        [data-theme="dark"] .header {
            background: #1a1a1a;
            border-bottom: 1px solid #333;
        }
        
        [data-theme="dark"] .hero {
            background: linear-gradient(135deg, var(--purple-700), var(--purple-900));
        }
        
        [data-theme="dark"] .about {
            background: #2d2d2d;
        }
        
        [data-theme="dark"] .services {
            background: #1a1a1a;
        }
        
        [data-theme="dark"] .clients {
            background: linear-gradient(135deg, var(--purple-200), var(--purple-300));
        }
        
        [data-theme="dark"] .contact {
            background: #1a1a1a;
        }
        
        [data-theme="dark"] .service-card,
        [data-theme="dark"] .testimonial-card,
        [data-theme="dark"] .client-logo,
        [data-theme="dark"] .contact-item,
        [data-theme="dark"] .contact-form {
            background: #2d2d2d;
            border: 1px solid #444;
        }
        
        [data-theme="dark"] .form-control {
            background: #1a1a1a;
            border-color: #444;
            color: var(--dark);
        }
        
        /* Top Bar */
        .top-bar {
            background: var(--bg-primary-transparent);
            padding: 0.5rem 5%;
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            z-index: 1001;
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 0.9rem;
        }
        
        .top-bar-left {
            display: flex;
            align-items: center;
            gap: 1rem;
        }
        
        .top-bar-right {
            display: flex;
            align-items: center;
            gap: 1rem;
        }
        
        .theme-toggle {
            background: none;
            border: none;
            color: #581c87;
            font-size: 1.2rem;
            cursor: pointer;
            padding: 0.5rem;
            border-radius: 50%;
            transition: all 0.3s ease;
        }
        
        .theme-toggle:hover {
            background: rgba(139, 92, 246, 0.1);
            transform: scale(1.1);
        }
        
        .auth-buttons {
            display: flex;
            gap: 0.5rem;
        }
        
        .btn-sm {
            padding: 0.4rem 1rem;
            font-size: 0.85rem;
            border-radius: 20px;
        }
        
        /* Header */
        .header {
            background: var(--white);
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            z-index: 1000;
        }
        
        .navbar {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 1rem 5%;
            max-width: 1200px;
            margin: 0 auto;
        }
        
        .logo {
            font-size: 2rem;
            font-weight: bold;
            color: var(--purple-600);
            text-decoration: none;
        }
        
        .nav-menu {
            display: flex;
            list-style: none;
            gap: 2.5rem;
        }
        
        .nav-menu a {
            text-decoration: none;
            color: var(--dark);
            font-weight: 500;
            font-size: 1.1rem;
            transition: color 0.3s ease;
        }
        
        .nav-menu a:hover {
            color: var(--purple-600);
        }
        
        .header-actions {
            display: flex;
            align-items: center;
            gap: 1rem;
        }
        
        .menu-toggle {
            display: none;
            flex-direction: column;
            cursor: pointer;
        }
        
        .menu-toggle span {
            width: 25px;
            height: 3px;
            background: var(--dark);
            margin: 3px 0;
            transition: 0.3s;
            font-family: iransansweb
        }
        
        /* Hero Section */
        .hero {
            background: linear-gradient(135deg, #4c1d95 0%, #581c87 100%);
            color: var(--white);
            padding: 180px 5% 200px;
            text-align: right;
            position: relative;
            overflow: hidden;
        }
        
        .hero::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="20" cy="20" r="2" fill="rgba(255,255,255,0.1)"/><circle cx="80" cy="40" r="1.5" fill="rgba(255,255,255,0.1)"/><circle cx="40" cy="80" r="1" fill="rgba(255,255,255,0.1)"/></svg>');
        }
        
        /* Professional Animated Advertising Background */
        .hero::after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 800" fill="none"><defs><linearGradient id="adGrad1" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" style="stop-color:rgba(255,255,255,0.15)"/><stop offset="100%" style="stop-color:rgba(255,255,255,0.08)"/></linearGradient><linearGradient id="adGrad2" x1="0%" y1="0%" x2="100%" y2="0%"><stop offset="0%" style="stop-color:rgba(255,107,53,0.4)"/><stop offset="100%" style="stop-color:rgba(255,107,53,0.15)"/></linearGradient><linearGradient id="adGrad3" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" style="stop-color:rgba(139,92,246,0.3)"/><stop offset="100%" style="stop-color:rgba(139,92,246,0.1)"/></linearGradient></defs><g class="ad-elements"><rect x="80" y="60" width="320" height="180" rx="12" fill="var(--wpr-bg-9e839988-ebd6-4871-affd-87d48d9a09df)" opacity="0.7"><animateTransform attributeName="transform" type="translate" values="0,0; 25,-15; 0,0" dur="4s" repeatCount="indefinite"/></rect><circle cx="240" cy="150" r="45" fill="rgba(255,255,255,0.15)"><animate attributeName="r" values="45; 55; 45" dur="3s" repeatCount="indefinite"/></circle><path d="M215 135 L240 150 L215 165 V135Z" fill="rgba(255,107,53,0.9)"><animateTransform attributeName="transform" type="scale" values="1; 1.2; 1" dur="2s" repeatCount="indefinite"/></path><rect x="1200" y="250" width="240" height="120" rx="8" fill="url(%23adGrad2)" opacity="0.8"><animateTransform attributeName="transform" type="translate" values="0,0; -20,8; 0,0" dur="5s" repeatCount="indefinite"/></rect><circle cx="1320" cy="310" r="30" fill="rgba(255,255,255,0.25)"><animate attributeName="opacity" values="0.25; 0.6; 0.25" dur="2.5s" repeatCount="indefinite"/></circle><rect x="1280" y="280" width="80" height="6" rx="3" fill="rgba(255,255,255,0.7)"/><rect x="1280" y="295" width="65" height="4" rx="2" fill="rgba(255,255,255,0.5)"/><rect x="1280" y="305" width="70" height="4" rx="2" fill="rgba(255,255,255,0.5)"/><g transform="translate(500,380)"><rect width="480" height="240" rx="15" fill="rgba(255,255,255,0.08)" stroke="rgba(255,255,255,0.25)" stroke-width="2"><animate attributeName="opacity" values="0.08; 0.2; 0.08" dur="6s" repeatCount="indefinite"/></rect><circle cx="80" cy="80" r="40" fill="rgba(255,107,53,0.4)"><animate attributeName="cy" values="80; 70; 80" dur="3s" repeatCount="indefinite"/></circle><rect x="140" y="50" width="280" height="12" rx="6" fill="rgba(255,255,255,0.4)"/><rect x="140" y="70" width="240" height="8" rx="4" fill="rgba(255,255,255,0.25)"/><rect x="140" y="85" width="200" height="8" rx="4" fill="rgba(255,255,255,0.25)"/><rect x="140" y="120" width="280" height="60" rx="8" fill="rgba(139,92,246,0.25)"><animate attributeName="opacity" values="0.25; 0.5; 0.25" dur="4s" repeatCount="indefinite"/></rect></g><g transform="translate(40,520)"><rect width="180" height="120" rx="12" fill="rgba(255,255,255,0.12)"><animateTransform attributeName="transform" type="rotate" values="0; 3; -3; 0" dur="8s" repeatCount="indefinite"/></rect><circle cx="90" cy="60" r="25" fill="rgba(255,107,53,0.5)"><animate attributeName="r" values="25; 30; 25" dur="2s" repeatCount="indefinite"/></circle><path d="M80 50 L90 60 L80 70 V50Z" fill="rgba(255,255,255,0.95)"/></g><g transform="translate(1300,120)"><rect width="160" height="100" rx="8" fill="rgba(255,255,255,0.15)"><animate attributeName="opacity" values="0.15; 0.4; 0.15" dur="3s" repeatCount="indefinite"/></rect><circle cx="40" cy="50" r="20" fill="rgba(255,107,53,0.6)"/><rect x="70" y="30" width="70" height="5" rx="2.5" fill="rgba(255,255,255,0.5)"/><rect x="70" y="42" width="60" height="5" rx="2.5" fill="rgba(255,255,255,0.4)"/><rect x="70" y="54" width="50" height="5" rx="2.5" fill="rgba(255,255,255,0.4)"/></g><g transform="translate(250,580)"><path d="M0 30 Q80 0 160 30 T320 30" stroke="rgba(255,255,255,0.4)" stroke-width="3" fill="none"><animate attributeName="opacity" values="0.4; 0.8; 0.4" dur="4s" repeatCount="indefinite"/></path><circle cx="0" cy="30" r="6" fill="rgba(255,107,53,0.7)"><animateMotion dur="8s" repeatCount="indefinite"><mpath href="%23path1"/></animateMotion></circle><path id="path1" d="M0 30 Q80 0 160 30 T320 30" opacity="0"/></g><g transform="translate(1050,450)"><rect width="120" height="80" rx="8" fill="rgba(255,255,255,0.1)" stroke="rgba(255,255,255,0.25)" stroke-width="2"><animateTransform attributeName="transform" type="translate" values="0,0; 8,-5; 0,0" dur="6s" repeatCount="indefinite"/></rect><circle cx="30" cy="40" r="12" fill="rgba(139,92,246,0.5)"><animate attributeName="fill" values="rgba(139,92,246,0.5); rgba(255,107,53,0.5); rgba(139,92,246,0.5)" dur="3s" repeatCount="indefinite"/></circle><rect x="50" y="25" width="55" height="3" rx="1.5" fill="rgba(255,255,255,0.6)"/><rect x="50" y="32" width="45" height="3" rx="1.5" fill="rgba(255,255,255,0.5)"/><rect x="50" y="39" width="40" height="3" rx="1.5" fill="rgba(255,255,255,0.5)"/><rect x="50" y="46" width="55" height="3" rx="1.5" fill="rgba(255,255,255,0.4)"/></g><g transform="translate(150,100)"><rect width="200" height="100" rx="10" fill="url(%23adGrad3)" opacity="0.6"><animateTransform attributeName="transform" type="scale" values="1; 1.05; 1" dur="7s" repeatCount="indefinite"/></rect><circle cx="50" cy="50" r="18" fill="rgba(255,255,255,0.8)"/><path d="M45 45 L50 50 L45 55 V45Z" fill="rgba(139,92,246,0.8)"/><rect x="80" y="30" width="100" height="6" rx="3" fill="rgba(255,255,255,0.6)"/><rect x="80" y="42" width="80" height="4" rx="2" fill="rgba(255,255,255,0.4)"/><rect x="80" y="52" width="90" height="4" rx="2" fill="rgba(255,255,255,0.4)"/></g></g></svg>') no-repeat center center;
            background-size: cover;
            animation: backgroundPulse 10s ease-in-out infinite;
            z-index: 1;
        }
        
        @keyframes backgroundPulse {
            0%, 100% {
                opacity: 0.8;
                transform: scale(1);
            }
            50% {
                opacity: 1;
                transform: scale(1.02);
            }
        }
        
        .hero-content {
            max-width: 800px;
            margin-top: -150px;
            position: relative;
            z-index: 2;
        }
        
        .hero h1 {
            font-size: 4.5rem;
            font-weight: bold;
            margin-bottom: 1.5rem;
            line-height: 1.2;
        }
        
        .hero p {
            font-size: 1.4rem;
            margin-bottom: 2.5rem;
            opacity: 0.9;
            max-width: 900px;
            margin-left: auto;
            margin-right: auto;
        }
        
        .cta-buttons {
            display: flex;
            gap: 1rem;
            justify-content: flex-start;
            flex-wrap: wrap;
        }
        
        .btn {
            padding: 12px 30px;
            border-radius: 25px;
            text-decoration: none;
            font-weight: bold;
            transition: all 0.3s ease;
            border: 2px solid transparent;
            cursor: pointer;
            font-size: 1rem;
        }
        
        .btn-primary {
            background: linear-gradient(135deg, var(--purple-600), var(--purple-800));
            color: var(--white);
            border: none;
        }
        
        .btn-primary:hover {
            background: linear-gradient(135deg, var(--purple-700), var(--purple-900));
            transform: translateY(-2px);
        }
        
        .btn-outline {
            background: transparent;
            color: var(--white);
            border: 2px solid var(--white);
        }
        
        .btn-outline:hover {
            background: var(--white);
            color: var(--purple-600);
        }
        
        /* Floating Icons */
        .floating-icons {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            pointer-events: none;
        }
        
        .floating-icon {
            position: absolute;
            width: 60px;
            height: 60px;
            background: rgba(255,255,255,0.1);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--white);
            font-size: 1.5rem;
            animation: float 6s ease-in-out infinite;
        }
        
        .floating-icon:nth-child(1) {
            top: 20%;
            right: 10%;
            animation-delay: 0s;
        }
        
        .floating-icon:nth-child(2) {
            top: 60%;
            left: 15%;
            animation-delay: 2s;
        }
        
        .floating-icon:nth-child(3) {
            top: 30%;
            left: 20%;
            animation-delay: 4s;
        }
        
        .floating-icon:nth-child(4) {
            top: 70%;
            right: 20%;
            animation-delay: 1s;
        }
        
        @keyframes float {
            0%, 100% {
                transform: translateY(0px) rotate(0deg);
            }
            50% {
                transform: translateY(-20px) rotate(180deg);
            }
        }
        
        /* About Section */
        .about {
            padding: 80px 5%;
            background: var(--light-gray);
        }
        
        .container {
            max-width: 1200px;
            margin: auto;
        }
        
        .section-title {
            text-align: center;
            font-size: 2.5rem;
            font-weight: bold;
            color: var(--dark);
            margin-bottom: 3rem;
            position: relative;
        }
        
        .section-title::after {
            content: '';
            position: absolute;
            bottom: -10px;
            left: 50%;
            transform: translateX(-50%);
            width: 60px;
            height: 4px;
            background: var(--accent-color);
            border-radius: 2px;
        }
        
        .about-content {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            align-items: center;
        }
        
        .about-text h3 {
            font-size: 1.8rem;
            color: #6c00ce;
            margin-bottom: 1rem;
        }
        
        .about-text p {
            color: var(--gray);
            margin-bottom: 1.5rem;
            line-height: 1.8;
        }
        
        .about-features {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
            margin-top: 2rem;
        }
        
        .feature-item {
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }
        
        .feature-item i {
            color: #af69ee;
            font-size: 1.2rem;
        }
        
        .about-visual {
            text-align: center;
        }
        
        .about-icon {
            width: 200px;
            height: 200px;
            background: linear-gradient(135deg, var(--purple-600), var(--purple-800));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto;
            color: var(--white);
            font-size: 4rem;
            transition: all 0.5s ease;
            animation: rotate 8s linear infinite, glow 4s ease-in-out infinite alternate;
            position: relative;
            overflow: hidden;
        }
        
        .about-icon:hover {
            transform: scale(1.1);
            animation-play-state: paused;
        }
        
        .about-icon::before {
            content: '';
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: linear-gradient(45deg, transparent, rgba(255,255,255,0.1), transparent);
            animation: shine 3s ease-in-out infinite;
        }
        
        /* Faraz Animation Styles */
        .faraz-animation-container {
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 2rem;
        }
        
        .faraz-main-animation {
            max-width: 100%;
            height: auto;
            filter: drop-shadow(0 10px 30px rgba(139, 92, 246, 0.3));
            transition: all 0.5s ease;
        }
        
        .faraz-main-animation:hover {
            transform: scale(1.05);
            filter: drop-shadow(0 15px 40px rgba(139, 92, 246, 0.4));
        }
        
        .floating-ads {
            animation: floatGroup 8s ease-in-out infinite;
        }
        
        @keyframes floatGroup {
            0%, 100% {
                transform: translateY(0px);
            }
            50% {
                transform: translateY(-10px);
            }
        }
        
        .data-flow {
            animation: dataFlowPulse 6s ease-in-out infinite;
        }
        
        @keyframes dataFlowPulse {
            0%, 100% {
                opacity: 0.6;
            }
            50% {
                opacity: 0.9;
            }
        }
        
        .performance-indicators {
            animation: performanceBounce 4s ease-in-out infinite;
        }
        
        @keyframes performanceBounce {
            0%, 100% {
                transform: translateY(0px);
            }
            25% {
                transform: translateY(-5px);
            }
            75% {
                transform: translateY(5px);
            }
        }
        
        @keyframes rotate {
            0% {
                transform: rotate(0deg);
            }
            100% {
                transform: rotate(360deg);
            }
        }
        
        @keyframes glow {
            0% {
                box-shadow: 0 0 20px rgba(139, 92, 246, 0.3);
            }
            100% {
                box-shadow: 0 0 40px rgba(139, 92, 246, 0.6), 0 0 60px rgba(139, 92, 246, 0.3);
            }
        }
        
        @keyframes shine {
            0% {
                transform: translateX(-100%) translateY(-100%) rotate(45deg);
            }
            50% {
                transform: translateX(100%) translateY(100%) rotate(45deg);
            }
            100% {
                transform: translateX(-100%) translateY(-100%) rotate(45deg);
            }
        }
        
        /* Services Section */
        .services {
            padding: 80px 5%;
            background: var(--white);
        }
        
        /* Why Choose Us Section */
        .why-choose-us {
            padding: 80px 5%;
            background: var(--white);
            position: relative;
            overflow: hidden;
        }
        
        .why-choose-us::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="20" cy="20" r="1" fill="rgba(139,92,246,0.1)"/><circle cx="80" cy="40" r="1.5" fill="rgba(139,92,246,0.1)"/><circle cx="40" cy="80" r="1" fill="rgba(139,92,246,0.1)"/></svg>');
            z-index: 1;
        }
        
        .why-choose-us .container {
            position: relative;
            z-index: 2;
        }
        
        .why-choose-intro {
            text-align: center;
            max-width: 800px;
            margin: 0 auto 3rem;
        }
        
        .why-choose-intro p {
            font-size: 1.1rem;
            color: var(--gray);
            line-height: 1.8;
        }
        
        .why-choose-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 2rem;
            margin-top: 3rem;
        }
        
        .why-choose-card {
            background: rgba(255, 255, 255, 0.9);
            border-radius: 20px;
            padding: 3rem 2.5rem;
            text-align: center;
            box-shadow: 0 10px 30px rgba(139, 92, 246, 0.1);
            transition: all 0.4s ease;
            backdrop-filter: blur(10px);
            position: relative;
            overflow: hidden;
        }
        
        .why-choose-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
            transition: left 0.6s ease;
        }
        
        .why-choose-card:hover::before {
            left: 100%;
        }
        
        .why-choose-card:hover {
            transform: translateY(-15px);
            box-shadow: 0 20px 40px rgba(139, 92, 246, 0.2);
            border-color: var(--purple-200);
        }
        
        .why-choose-icon {
            width: 120px;
            height: 120px;
            background: linear-gradient(135deg, var(--purple-600), var(--purple-800));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 2rem;
            color: var(--white);
            transition: all 0.4s ease;
            position: relative;
            overflow: hidden;
        }
        
        .why-choose-icon::after {
            content: '';
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: linear-gradient(45deg, transparent, rgba(255,255,255,0.2), transparent);
            animation: iconRotate 3s linear infinite;
        }
        
        /* Individual icon animations */
        .why-choose-card:nth-child(1) .why-choose-icon {
            animation: pulse 3s ease-in-out infinite, teamFloat 4s ease-in-out infinite;
        }
        
        .why-choose-card:nth-child(2) .why-choose-icon {
            animation: pulse 3s ease-in-out infinite, strategyRotate 5s ease-in-out infinite;
        }
        
        .why-choose-card:nth-child(3) .why-choose-icon {
            animation: pulse 3s ease-in-out infinite, resultsBounce 3.5s ease-in-out infinite;
        }
        
        .why-choose-card:nth-child(4) .why-choose-icon {
            animation: pulse 3s ease-in-out infinite, supportGlow 4s ease-in-out infinite alternate;
        }
        
        @keyframes teamFloat {
            0%, 100% { transform: translateY(0px) scale(1); }
            50% { transform: translateY(-8px) scale(1.05); }
        }
        
        @keyframes strategyRotate {
            0%, 100% { transform: rotate(0deg) scale(1); }
            25% { transform: rotate(5deg) scale(1.02); }
            75% { transform: rotate(-5deg) scale(1.02); }
        }
        
        @keyframes resultsBounce {
            0%, 100% { transform: scale(1) translateY(0px); }
            30% { transform: scale(1.08) translateY(-5px); }
            60% { transform: scale(0.95) translateY(2px); }
        }
        
        @keyframes supportGlow {
            0% { 
                box-shadow: 0 0 20px rgba(139, 92, 246, 0.3);
                transform: scale(1);
            }
            100% { 
                box-shadow: 0 0 40px rgba(139, 92, 246, 0.6), 0 0 60px rgba(255, 107, 53, 0.3);
                transform: scale(1.05);
            }
        }
        
        .why-choose-card:hover .why-choose-icon {
            transform: scale(1.1) rotate(10deg);
            box-shadow: 0 15px 30px rgba(139, 92, 246, 0.4);
        }
        
        @keyframes iconRotate {
            0% {
                transform: rotate(0deg);
            }
            100% {
                transform: rotate(360deg);
            }
        }
        
        .why-choose-card h3 {
            color: var(--dark);
            margin-bottom: 1.5rem;
            font-size: 1.6rem;
            font-weight: 600;
        }
        
        .why-choose-card p {
            color: var(--gray);
            line-height: 1.8;
            font-size: 1.1rem;
        }
        
        .services-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 2rem;
            margin-top: 3rem;
        }
        
        .service-card {
            background: var(--white);
            border-radius: 15px;
            padding: 2rem;
            text-align: center;
            box-shadow: 0 5px 20px rgba(0,0,0,0.1);
            transition: all 0.3s ease;
            border: 2px solid transparent;
        }
        
        .service-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
        }
        
        .service-card h3 {
            color: var(--dark);
            margin-bottom: 1.5rem;
            font-size: 1.6rem;
            font-weight: 600;
        }
        
        .service-icon {
            width: 80px;
            height: 80px;
            background: linear-gradient(135deg, var(--purple-600), var(--purple-800));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1.5rem;
            color: var(--white);
            font-size: 2rem;
            transition: all 0.4s ease;
            animation: pulse 3s ease-in-out infinite;
            position: relative;
            overflow: hidden;
        }
        
        .service-icon:hover {
            transform: scale(1.1) rotate(10deg);
            box-shadow: 0 10px 25px rgba(139, 92, 246, 0.4);
        }
        
        .service-icon::before {
            content: '';
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: linear-gradient(45deg, transparent, rgba(255,255,255,0.2), transparent);
            animation: iconShine 2s ease-in-out infinite;
        }
        
        @keyframes pulse {
            0%, 100% {
                transform: scale(1);
                box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.4);
            }
            50% {
                transform: scale(1.05);
                box-shadow: 0 0 0 10px rgba(139, 92, 246, 0);
            }
        }
        
        @keyframes iconShine {
            0% {
                transform: translateX(-100%) translateY(-100%) rotate(45deg);
            }
            50% {
                transform: translateX(100%) translateY(100%) rotate(45deg);
            }
            100% {
                transform: translateX(-100%) translateY(-100%) rotate(45deg);
            }
        }
        
        /* Custom animated icons for services */
        .service-icon.banner-icon {
            animation: pulse 3s ease-in-out infinite, bannerWave 4s ease-in-out infinite;
        }
        
        .service-icon.click-icon {
            animation: pulse 3s ease-in-out infinite, clickBounce 2s ease-in-out infinite;
        }
        
        .service-icon.video-icon {
            animation: pulse 3s ease-in-out infinite, videoPlay 3s ease-in-out infinite;
        }
        
        .service-icon.native-icon {
            animation: pulse 3s ease-in-out infinite, nativeFloat 5s ease-in-out infinite;
        }
        
        .service-icon.auction-icon {
            animation: pulse 3s ease-in-out infinite, auctionGlow 2.5s ease-in-out infinite alternate;
        }
        
        @keyframes bannerWave {
            0%, 100% { transform: scale(1) rotateY(0deg); }
            50% { transform: scale(1.02) rotateY(5deg); }
        }
        
        @keyframes clickBounce {
            0%, 100% { transform: scale(1) translateY(0); }
            50% { transform: scale(1.1) translateY(-3px); }
        }
        
        @keyframes videoPlay {
            0%, 100% { transform: scale(1); }
            25% { transform: scale(1.05); }
            75% { transform: scale(0.98); }
        }
        
        @keyframes nativeFloat {
            0%, 100% { transform: scale(1) rotate(0deg); }
            33% { transform: scale(1.02) rotate(2deg); }
            66% { transform: scale(0.98) rotate(-2deg); }
        }
        
        @keyframes auctionGlow {
            0% { 
                box-shadow: 0 0 20px rgba(255, 107, 53, 0.3);
                background: linear-gradient(135deg, var(--purple-600), var(--purple-800));
            }
            100% { 
                box-shadow: 0 0 30px rgba(255, 107, 53, 0.6);
                background: linear-gradient(135deg, var(--purple-700), var(--purple-900));
            }
        }
        
        .service-card h4 {
            color: var(--dark);
            margin-bottom: 1rem;
            font-size: 1.3rem;
        }
        
        .service-card p {
            color: var(--gray);
            margin-bottom: 1.5rem;
            line-height: 1.6;
        }
        
        .service-features {
            list-style: none;
            text-align: right;
        }
        
        .service-features li {
            margin-bottom: 0.5rem;
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }
        
        .service-features i {
            color: #af69ee;
        }
        
        .via-purple-800 {
  --tw-gradient-to:rgb(107 33 168 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops:var(--tw-gradient-from), #6b21a8 var(--tw-gradient-via-position), var(--tw-gradient-to)
}
.to-blue-600 {
  --tw-gradient-to:#2563eb var(--tw-gradient-to-position)
}
.to-cyan-500 {
  --tw-gradient-to:#06b6d4 var(--tw-gradient-to-position)
}
.to-emerald-500 {
  --tw-gradient-to:#10b981 var(--tw-gradient-to-position)
}
.to-fuchsia-600 {
  --tw-gradient-to:#c026d3 var(--tw-gradient-to-position)
}
.to-green-600 {
  --tw-gradient-to:#16a34a var(--tw-gradient-to-position)
}
.to-indigo-600 {
  --tw-gradient-to:#4f46e5 var(--tw-gradient-to-position)
}
.to-indigo-900 {
  --tw-gradient-to:#312e81 var(--tw-gradient-to-position)
}
.to-orange-500 {
  --tw-gradient-to:#f97316 var(--tw-gradient-to-position)
}
.to-orange-600 {
  --tw-gradient-to:#ea580c var(--tw-gradient-to-position)
}
.to-pink-400 {
  --tw-gradient-to:#f472b6 var(--tw-gradient-to-position)
}
.to-purple-500 {
  --tw-gradient-to:#a855f7 var(--tw-gradient-to-position)
}
.to-purple-600 {
  --tw-gradient-to:#9333ea var(--tw-gradient-to-position)
}
.to-purple-700 {
  --tw-gradient-to:#7e22ce var(--tw-gradient-to-position)
}
.to-purple-800 {
  --tw-gradient-to:#6b21a8 var(--tw-gradient-to-position)
}
.to-red-500 {
  --tw-gradient-to:#ef4444 var(--tw-gradient-to-position)
}
.to-violet-500 {
  --tw-gradient-to:#8b5cf6 var(--tw-gradient-to-position)
}
.to-violet-700 {
  --tw-gradient-to:#6d28d9 var(--tw-gradient-to-position)
}
.fill-current {
  fill:currentColor
}
        /* Clients Section */
        .clients {
            padding: 80px 5%;
            background: linear-gradient(135deg, #8847c2, #430177);
            color: var(--dark);
            position: relative;
            overflow: hidden;
        }
        
        .clients::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="20" cy="20" r="1" fill="rgba(255,255,255,0.1)"/><circle cx="80" cy="40" r="1.5" fill="rgba(255,255,255,0.1)"/><circle cx="40" cy="80" r="1" fill="rgba(255,255,255,0.1)"/></svg>');
        }
        
        .clients .section-title {
            color: #fff;
        }
        
        .clients .section-title::after {
            background: var(--accent-color);
        }
        
        .clients p {
            text-align: center;
            color: #fff;
            margin-bottom: 2rem;
        }
        
        .clients-slider {
            overflow: hidden;
            margin-top: 3rem;
            position: relative;
            z-index: 2;
        }
        
        .clients-track {
            display: flex;
            animation: slide 20s linear infinite;
        }
        
        .client-logo {
            min-width: 150px;
            height: 100px;
            background: rgba(255,255,255,0.95);
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 1rem;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            transition: all 0.3s ease;
            font-weight: bold;
            color: var(--purple-600);
        }
        
        .client-logo:hover {
            transform: scale(1.05);
            box-shadow: 0 5px 20px rgba(255,255,255,0.3);
        }
        
        @keyframes slide {
            0% {
                transform: translateX(0);
            }
            100% {
                transform: translateX(-50%);
            }
        }
        
        /* Testimonials */
        .testimonials {
            margin-top: 4rem;
            position: relative;
            z-index: 2;
        }
        
        .testimonials h3 {
            text-align: center;
            margin: 4rem 0 2rem;
            color: #fff;
            font-size: 2rem;
        }
        
        .testimonials-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
            gap: 2rem;
            margin-top: 2rem;
        }
        
        .testimonial-card {
            background: rgba(255,255,255,0.95);
            border-radius: 15px;
            padding: 2rem;
            box-shadow: 0 5px 20px rgba(0,0,0,0.1);
            transition: all 0.3s ease;
            border: 2px solid transparent;
        }
        
        .testimonial-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
        }
        
        .stars {
            display: flex;
            gap: 0.2rem;
            margin-bottom: 1rem;
            color: #ffc107;
            font-size: 1.2rem;
        }
        
        .testimonial-content p {
            color: var(--gray);
            line-height: 1.6;
            margin-bottom: 1.5rem;
            font-style: italic;
        }
        
        .testimonial-author {
            display: flex;
            align-items: center;
            gap: 1rem;
        }
        
        .author-avatar {
            width: 50px;
            height: 50px;
            background: var(--purple-100);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--purple-600);
            font-size: 1.5rem;
        }
        
        .author-info h5 {
            color: var(--dark);
            margin-bottom: 0.2rem;
            font-size: 1.1rem;
        }
        
        .author-info span {
            color: var(--gray);
            font-size: 0.9rem;
            font-family: iransansweb
        }
        
        /* Blog Section */
        .blog {
            padding: 80px 5%;
            background: var(--light-gray);
        }
        
        .blog-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 2rem;
            margin-top: 3rem;
        }
        
        .blog-card {
            background: var(--white);
            border-radius: 15px;
            padding: 0;
            box-shadow: 0 5px 20px rgba(0,0,0,0.1);
            transition: all 0.3s ease;
            border: 2px solid transparent;
            cursor: pointer;
            overflow: hidden;
        }
        
        .blog-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
        }
        
        .blog-image {
            width: 100%;
            height: 200px;
            border-radius: 0;
            overflow: hidden;
            margin-bottom: 1.5rem;
            transition: all 0.4s ease;
        }
        
        .blog-image:hover {
            transform: scale(1.02);
        }
        
        .blog-image svg {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        

        
        .blog-card h3 {
            color: var(--dark);
            margin-bottom: 1rem;
            font-size: 1.3rem;
            text-align: center;
            padding: 0 2rem;
        }
        
        .blog-card p {
            color: var(--gray);
            margin-bottom: 1.5rem;
            line-height: 1.6;
            text-align: center;
            padding: 0 2rem;
        }
        
        .blog-meta {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 1rem 2rem 2rem;
            border-top: 1px solid #e9ecef;
            font-size: 0.9rem;
            color: var(--gray);
            margin-top: 1rem;
        }
        
        .blog-meta span {
            display: flex;
            font-family: iransansweb;
            align-items: center;
            gap: 0.3rem;
        }
        
        .blog-meta i {
            color: var(--purple-600);
        }

        /* Contact Section */
        .contact {
            padding: 80px 5%;
            background: var(--white);
        }
        
        .contact-content {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            margin-top: 3rem;
        }
        
        .contact-info {
            display: grid;
            gap: 2rem;
        }
        
        .contact-item {
            display: flex;
            align-items: center;
            gap: 1rem;
            padding: 1.5rem;
            background: var(--light-gray);
            border-radius: 10px;
        }
        
        .contact-item-icon {
            width: 50px;
            height: 50px;
            background: var(--purple-600);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--white);
            font-size: 1.2rem;
        }
        
        .contact-item-content h4 {
            color: var(--dark);
            margin-bottom: 0.5rem;
        }
        
        .contact-item-content p {
            color: var(--gray);
            margin: 0;
        }
        
        .contact-form {
            background: var(--light-gray);
            padding: 2rem;
            border-radius: 15px;
        }
        
        .form-group {
            margin-bottom: 1.5rem;
        }
        
        .form-group label {
            display: block;
            margin-bottom: 0.5rem;
            color: var(--dark);
            font-weight: 500;
        }
        
        .form-control {
            width: 100%;
            padding: 12px 15px;
            border: 2px solid #e9ecef;
            border-radius: 8px;
            font-size: 1rem;
            transition: all 0.3s ease;
            font-family: iransansweb;
        }
        
        .form-control:focus {
            outline: none;
            border-color: var(--purple-600);
            box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.1);
        }
        
        .form-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
        }
        
        textarea.form-control {
            resize: vertical;
            min-height: 120px;
        }
        
        .error-message {
            color: #dc3545;
            font-size: 0.875rem;
            margin-top: 0.25rem;
            display: none;
        }
        
        .error-message.show {
            display: block;
        }
        
        .form-control.error {
            border-color: #dc3545;
            box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
        }
        
        .submit-status {
            margin-top: 1rem;
            padding: 0.75rem;
            border-radius: 5px;
            display: none;
        }
        
        .submit-status.success {
            background-color: #d4edda;
            color: #155724;
            border: 1px solid #c3e6cb;
            display: block;
        }
        
        .submit-status.error {
            background-color: #f8d7da;
            color: #721c24;
            border: 1px solid #f5c6cb;
            display: block;
        }
        
        /* Footer */
        .footer {
            background: var(--purple-900);
            color: var(--white);
            padding: 50px 5% 20px;
        }
        
        .footer-content {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 2rem;
            margin-bottom: 2rem;
        }
        
        .footer-section h4 {
            margin-bottom: 1rem;
            color: var(--white);
        }
        
        .footer-section p {
            color: rgba(255,255,255,0.8);
            line-height: 1.6;
        }
        
        .footer-section ul {
            list-style: none;
        }
        
        .footer-section ul li {
            margin-bottom: 0.5rem;
        }
        
        .footer-section ul li a {
            color: rgba(255,255,255,0.8);
            text-decoration: none;
            transition: color 0.3s ease;
        }
        
        .footer-section ul li a:hover {
            color: var(--white);
        }
        
        .social-links {
            display: flex;
            gap: 1rem;
            margin-top: 1rem;
        }
        
        .social-link {
            width: 40px;
            height: 40px;
            background: rgba(255,255,255,0.1);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--white);
            text-decoration: none;
            transition: all 0.3s ease;
        }
        
        .social-link:hover {
            background: var(--accent-color);
            transform: translateY(-2px);
        }
        
        .newsletter-form {
            margin-top: 1rem;
        }
        
        .newsletter-input-group {
            display: flex;
            gap: 0.5rem;
            margin-top: 1rem;
        }
        
        .newsletter-input {
            flex: 1;
            padding: 0.8rem;
            border: none;
            border-radius: 5px;
            font-family: iransansweb;
            font-size: 0.9rem;
        }
        
        .newsletter-btn {
            padding: 0.8rem 1.5rem;
            background: linear-gradient(135deg, var(--purple-600), var(--purple-800));
            color: white;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            font-family: inherit;
            font-weight: 500;
            transition: all 0.3s ease;
            box-shadow: 0 4px 15px rgba(139, 92, 246, 0.3);
        }
        
        .newsletter-btn:hover {
            background: linear-gradient(135deg, var(--purple-700), var(--purple-900));
            transform: translateY(-2px);
            box-shadow: 0 6px 20px rgba(139, 92, 246, 0.4);
        }
        
        .enamad-container {
            display: flex;
            justify-content: center;
            margin-top: 1rem;
        }
        
        .enamad-logo {
            width: 120px;
            height: 120px;
            background: var(--white);
            border-radius: 15px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
            transition: all 0.3s ease;
        }
        
        .enamad-logo:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 25px rgba(255, 107, 53, 0.3);
        }
        
        .footer-bottom {
            border-top: 1px solid rgba(255,255,255,0.2);
            padding-top: 1rem;
            text-align: center;
            color: rgba(255,255,255,0.8);
        }
        
        /* Responsive Design */
        @media (max-width: 768px) {
            .navbar {
                padding: 2rem 5%;
            }
            
            .logo {
                font-size: 2.5rem;
            }
            
            .nav-menu {
                display: none;
                position: absolute;
                top: 100%;
                left: 0;
                right: 0;
                background: var(--white);
                flex-direction: column;
                padding: 1rem;
                box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            }
            
            .nav-menu.active {
                display: flex;
            }
            
            .header-actions .auth-buttons {
                display: none;
            }
            
            .header-actions .theme-toggle {
                margin-left: 1rem;
            }
            
            .menu-toggle {
                display: flex;
            }
            
            .hero {
                padding: 100px 5% 80px;
            }
            
            .hero h1 {
                font-size: 2.5rem;
            }
            
            .hero p {
                font-size: 1.1rem;
            }
            
            .cta-buttons {
                flex-direction: column;
                align-items: flex-start;
            }
            
            .about-content {
                grid-template-columns: 1fr;
                gap: 2rem;
            }
            
            .about-features {
                grid-template-columns: 1fr;
            }
            
            .contact-content {
                grid-template-columns: 1fr;
                gap: 2rem;
            }
            
            .form-row {
                grid-template-columns: 1fr;
            }
            
            .floating-icon {
                display: none;
            }
            
            .blog-grid {
                grid-template-columns: 1fr;
            }
            
            .why-choose-grid {
                grid-template-columns: 1fr;
                gap: 1.5rem;
            }
            
            .why-choose-card {
                padding: 2.5rem 2rem;
            }
            
            .why-choose-icon {
                width: 100px;
                height: 100px;
            }
            
            .newsletter-input-group {
                flex-direction: column;
            }
        }