/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 6,000+ five-star reviews! It's ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It's fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.11.18.1766079437
Updated: 2025-12-18 17:37:17
*/

/* ========================================
   SNAPSHIFT STRATEGIES CUSTOM CSS
   Modern, Clean, Bold Design
======================================== */

/* --- SMOOTH SCROLLING & BASE ANIMATIONS --- */
html {
    scroll-behavior: smooth;
}

* {
    transition: all 0.3s ease;
}

/* --- CUSTOM ANIMATIONS --- */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* --- BUTTON STYLES --- */
.wp-block-button__link,
.ast-button,
button[type="submit"] {
    background-color: #FFCD57 !important;
    color: #1a1f4d !important;
    font-weight: 700 !important;
    border-radius: 50px !important;
    padding: 14px 32px !important;
    border: none !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 4px 15px rgba(255, 205, 87, 0.3);
}

.wp-block-button__link:hover,
.ast-button:hover,
button[type="submit"]:hover {
    background-color: #1a1f4d !important;
    color: #FFCD57 !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(26, 31, 77, 0.4);
}

/* --- ANIMATED HERO LOGOMARK --- */
.wp-block-cover:first-of-type {
    position: relative;
    overflow: hidden;
}

.wp-block-cover:first-of-type::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 800px;
    height: 800px;
    background-image: url('https://snapshiftstrategies.com/wp-content/uploads/2025/12/SnapShift-Icon.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.15;
    animation: slowRotate 30s linear infinite;
    z-index: 1;
    filter: brightness(1.2);
}

.wp-block-cover__inner-container {
    position: relative;
    z-index: 2;
}

@keyframes slowRotate {
    from {
        transform: translate(-50%, -50%) rotate(0deg);
    }
    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

/* --- HERO TEXT ANIMATIONS --- */
.hero-animate {
    animation: fadeInUp 1s ease-out;
}

.hero-animate-delay {
    animation: fadeInUp 1s ease-out 0.3s both;
}

.hero-animate-delay-2 {
    animation: fadeInUp 1s ease-out 0.6s both;
}

/* --- TIGHTEN HERO HEADLINE --- */
.wp-block-cover h1 {
    line-height: 0.98 !important;
    margin-bottom: 0 !important;
}

/* --- ANIMATED GRADIENT OVERLAY --- */
.wp-block-cover:first-of-type .wp-block-cover__background::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(26,31,77,0.3), rgba(124,63,143,0.5), rgba(90,45,111,0.4), rgba(26,31,77,0.3));
    background-size: 400% 400%;
    animation: gradientShift 20s ease infinite;
    z-index: 1;
}

@keyframes gradientShift {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/* --- FLOATING PARTICLES EFFECT --- */
.wp-block-cover:first-of-type::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        radial-gradient(circle, rgba(26,31,77,0.4) 2px, transparent 2px),
        radial-gradient(circle, rgba(185,82,159,0.5) 3px, transparent 3px),
        radial-gradient(circle, rgba(58,65,120,0.3) 1.5px, transparent 1.5px),
        radial-gradient(circle, rgba(185,82,159,0.4) 2.5px, transparent 2.5px),
        radial-gradient(circle, rgba(26,31,77,0.3) 2px, transparent 2px),
        radial-gradient(circle, rgba(147,91,150,0.4) 2px, transparent 2px),
        radial-gradient(circle, rgba(58,65,120,0.3) 1.5px, transparent 1.5px),
        radial-gradient(circle, rgba(185,82,159,0.4) 2.5px, transparent 2.5px),
        radial-gradient(circle, rgba(26,31,77,0.35) 2px, transparent 2px),
        radial-gradient(circle, rgba(147,91,150,0.3) 2px, transparent 2px);
    background-size: 350px 500px, 280px 420px, 220px 380px, 420px 580px, 310px 490px, 270px 410px, 390px 530px, 330px 460px, 250px 440px, 400px 550px;
    background-position: 0 0, 120px 80px, 280px 150px, 60px 340px, 380px 220px, 200px 420px, 90px 260px, 320px 100px, 180px 380px, 240px 50px;
    animation: particleFloat 15s ease-in-out infinite;
    z-index: 1;
    pointer-events: none;
}

@keyframes particleFloat {
    0% {
        transform: translateY(0) translateX(0);
    }
    25% {
        transform: translateY(-30px) translateX(25px);
    }
    50% {
        transform: translateY(-60px) translateX(-15px);
    }
    75% {
        transform: translateY(-90px) translateX(30px);
    }
    100% {
        transform: translateY(-120px) translateX(-5px);
    }
}



/* --- SERVICE BLOCKS STYLING --- */
.service-block {
    padding: 20px !important;
}


.service-block h3:first-of-type {
    margin: 0 0 15px 0 !important;
    line-height: 1 !important;
    font-size: 80px !important;
    color: #b9529f !important;
    opacity: 0.6 !important;
    text-align: center !important;
}

/* --- FINAL CTA SECTION --- */
.cta-section {
    position: relative;
    overflow: visible !important;
}

.cta-section::before {
    content: '';
    position: absolute;
    top: 50%;
    right: 5%;
    transform: translateY(-50%);
    width: 600px;
    height: 600px;
    background-image: url('https://snapshiftstrategies.com/wp-content/uploads/2025/12/SnapShift-Icon.png');
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.2;
    z-index: 0;
    filter: brightness(1.5);
}

.cta-section .wp-block-cover__inner-container {
    position: relative;
    z-index: 2;
}

.cta-section h2 {
    animation: fadeInUp 1.2s ease-out 0.3s both;
}

.cta-section p {
    animation: fadeInUp 1.2s ease-out 0.5s both;
}

.cta-section .wp-block-button {
    animation: fadeInUp 1.2s ease-out 0.7s both;
}




/* --- ANIMATED STAT COUNTERS --- */
.stat-counter {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease;
}

.stat-counter.animated {
    opacity: 1;
    transform: translateY(0);
}

.counter-number {
    font-variant-numeric: tabular-nums;
}


/* --- BUTTON STYLES --- */
.wp-block-button__link,
.ast-button,
button[type="submit"] {
    background-color: #FFCD57 !important;
    color: #1a1f4d !important;
    font-weight: 700 !important;
    border-radius: 50px !important;
    padding: 14px 32px !important;
    border: none !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 4px 15px rgba(255, 205, 87, 0.3);
    white-space: normal !important;
    width: auto !important;
    min-width: 200px !important;
}

.wp-block-button__link:hover,
.ast-button:hover,
button[type="submit"]:hover {
    background-color: #1a1f4d !important;
    color: #FFCD57 !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(26, 31, 77, 0.4);
}

/* Mobile button fix */
@media (max-width: 768px) {
    .wp-block-button__link,
    .ast-button,
    button[type="submit"] {
        width: 100% !important;
        padding: 16px 20px !important;
        font-size: 14px !important;
    }
}

/* Center buttons on mobile */
@media (max-width: 768px) {
    .wp-block-button {
        margin: 0 auto !important;
        display: flex !important;
        justify-content: center !important;
        width: 100% !important;
    }
    
    .wp-block-buttons {
        justify-content: center !important;
        align-items: center !important;
        display: flex !important;
    }
    
    .wp-block-button__link,
    .ast-button,
    button[type="submit"] {
        width: 90% !important;
        max-width: 350px !important;
        padding: 16px 20px !important;
        font-size: 14px !important;
        margin: 0 auto !important;
        display: block !important;
        text-align: center !important;
    }
    
    .wp-block-cover .wp-block-button {
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* --- REFINED STAT BOXES --- */
.stat-box {
    border-radius: 24px !important;
    max-width: 750px !important;
    margin: 0 auto !important;
    padding: 50px 40px !important;
}

.stat-box h2,
.stat-box h3 {
    font-size: 72px !important;
}

.stat-box p {
    font-size: 18px !important;
}