/*
Theme Name: Bixol
Theme URI: http://demo.casethemes.net/bixol/
Author: Case-Themes
Author URI: https://themeforest.net/user/case-themes/portfolio/
Description: Cleaning Services WordPress theme is a modern, clean and professional WordPress theme which is specially created to spread and represent your cleaning services business to your potential customers. <b>Bixol</b> theme is fully responsive, and it looks attractive on all types of screens and devices. It comes with a lot of user-friendly and customizable features those will help you to create a robust website to achieve the main goal of online business.   
Version: 1.7.0
License: ThemeForest
License URI: https://themeforest.net/licenses
Text Domain: bixol
Tags: cleaner, cleaning, cleaning agency, cleaning business, cleaning company, cleaning service, building, floor cleaning, house cleaning, window cleaning, housekeeping, washing, maintenance, janitor
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

        :root {
            --primary-emerald: #059669;
            --secondary-teal: #0d9488;
            --accent-cyan: #06b6d4;
            --light-mint: #d1fae5;
            --soft-blue: #e0f2fe;
            --neutral-slate: #64748b;
            --deep-charcoal: #1e293b;
            --pure-white: #ffffff;
            --whisper-gray: #f8fafc;
            --shadow-subtle: rgba(0, 0, 0, 0.08);
            --shadow-medium: rgba(0, 0, 0, 0.12);
            --shadow-bold: rgba(0, 0, 0, 0.18);
        }
        
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        body {
            background-color: var(--whisper-gray);
            color: var(--deep-charcoal);
            line-height: 1.7;
            overflow-x: hidden;
        }
        
        /* Hero Section Styles */
        .blog-hero-wrapper {
            background: linear-gradient(135deg, var(--primary-emerald) 0%, var(--secondary-teal) 100%);
            padding: 120px 0 80px;
            position: relative;
            overflow: hidden;
        }
        
        .blog-hero-wrapper::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: url('data:image/svg+xml,<svg width="60" height="60" viewBox="0 0 60 60" xmlns="http://www.w3.org/2000/svg"><circle cx="30" cy="30" r="1.5" fill="rgba(255,255,255,0.1)"/></svg>');
            opacity: 0.3;
        }
        
        .blog-hero-container {
            position: relative;
            z-index: 2;
        }
        
        .blog-main-heading {
            font-family: 'Playfair Display', serif;
            font-size: 3.5rem;
            font-weight: 900;
            color: var(--pure-white);
            line-height: 1.2;
            margin-bottom: 24px;
            text-shadow: 2px 4px 8px rgba(0, 0, 0, 0.2);
            animation: slideInUp 0.8s ease-out;
        }
        
        .blog-meta-description {
            font-size: 1.25rem;
            color: var(--light-mint);
            font-weight: 400;
            max-width: 900px;
            margin: 0 auto 32px;
            animation: slideInUp 0.8s ease-out 0.2s backwards;
        }
        
        .blog-hero-badge {
            display: inline-block;
            background: rgba(255, 255, 255, 0.2);
            backdrop-filter: blur(10px);
            padding: 8px 20px;
            border-radius: 50px;
            color: var(--pure-white);
            font-size: 0.9rem;
            font-weight: 600;
            animation: slideInUp 0.8s ease-out 0.4s backwards;
        }
        
        /* Introduction Section */
        .blog-intro-section {
            padding: 80px 0;
            background-color: var(--pure-white);
        }
        
        .blog-intro-content {
            max-width: 900px;
            margin: 0 auto;
            font-size: 1.15rem;
            line-height: 1.9;
            color: var(--neutral-slate);
        }
        
        .blog-intro-content p {
            margin-bottom: 24px;
        }
        
        .blog-intro-highlight {
            font-weight: 600;
            color: var(--primary-emerald);
        }
        
        /* Content Section Styles */
        .blog-content-section {
            padding: 100px 0;
            background-color: var(--whisper-gray);
        }
        
        .blog-section-card {
            background: var(--pure-white);
            border-radius: 24px;
            padding: 48px;
            margin-bottom: 60px;
            box-shadow: 0 4px 20px var(--shadow-subtle);
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            border: 1px solid rgba(5, 150, 105, 0.1);
        }
        
        .blog-section-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 12px 40px var(--shadow-medium);
        }
        
        .blog-section-header {
            display: flex;
            align-items: center;
            gap: 20px;
            margin-bottom: 32px;
        }
        
        .blog-section-icon-wrapper {
            width: 70px;
            height: 70px;
            background: linear-gradient(135deg, var(--primary-emerald), var(--secondary-teal));
            border-radius: 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            box-shadow: 0 8px 16px rgba(5, 150, 105, 0.25);
        }
        
        .blog-section-icon {
            font-size: 32px;
            color: var(--pure-white);
        }
        
        .blog-section-title {
            font-family: 'Playfair Display', serif;
            font-size: 2rem;
            font-weight: 700;
            color: var(--deep-charcoal);
            margin: 0;
        }
        
        .blog-section-image {
            width: 100%;
            height: 400px;
            object-fit: cover;
            border-radius: 16px;
            margin-bottom: 32px;
            box-shadow: 0 8px 24px var(--shadow-subtle);
        }
        
        .blog-section-text {
            font-size: 1.1rem;
            line-height: 1.9;
            color: var(--neutral-slate);
            margin-bottom: 24px;
        }
        
        .blog-feature-list {
            list-style: none;
            padding: 0;
            margin: 24px 0;
        }
        
        .blog-feature-item {
            display: flex;
            align-items: flex-start;
            gap: 16px;
            padding: 16px 0;
            border-bottom: 1px solid rgba(5, 150, 105, 0.1);
        }
        
        .blog-feature-item:last-child {
            border-bottom: none;
        }
        
        .blog-feature-icon {
            color: var(--primary-emerald);
            font-size: 20px;
            margin-top: 4px;
            flex-shrink: 0;
        }
        
        .blog-feature-text {
            font-size: 1.05rem;
            color: var(--neutral-slate);
            line-height: 1.7;
        }
        
        /* Final Thoughts Section */
        .blog-final-section {
            background: linear-gradient(135deg, var(--deep-charcoal) 0%, #334155 100%);
            padding: 100px 0;
            position: relative;
            overflow: hidden;
        }
        
        .blog-final-section::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: url('data:image/svg+xml,<svg width="80" height="80" viewBox="0 0 80 80" xmlns="http://www.w3.org/2000/svg"><rect x="0" y="0" width="2" height="2" fill="rgba(255,255,255,0.05)"/></svg>');
        }
        
        .blog-final-container {
            position: relative;
            z-index: 2;
        }
        
        .blog-final-heading {
            font-family: 'Playfair Display', serif;
            font-size: 2.5rem;
            font-weight: 700;
            color: var(--pure-white);
            margin-bottom: 32px;
            text-align: center;
        }
        
        .blog-final-content {
            max-width: 900px;
            margin: 0 auto;
            font-size: 1.15rem;
            line-height: 1.9;
            color: #e2e8f0;
        }
        
        .blog-final-content p {
            margin-bottom: 24px;
        }
        
        .blog-final-highlight {
            color: var(--light-mint);
            font-weight: 600;
        }
        
        /* Footer */
        .blog-footer-wrapper {
            background-color: #0f172a;
            color: var(--pure-white);
            padding: 48px 0;
            text-align: center;
        }
        
        .blog-footer-text {
            font-size: 1rem;
            color: #94a3b8;
            margin: 0;
        }
        
        .blog-footer-brand {
            font-family: 'Playfair Display', serif;
            font-size: 1.8rem;
            font-weight: 700;
            color: var(--primary-emerald);
            margin-bottom: 16px;
        }
        
        /* Animations */
        @keyframes slideInUp {
            from {
                opacity: 0;
                transform: translateY(40px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
        
        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }
        
        /* Responsive Design */
        @media (max-width: 768px) {
            .blog-main-heading {
                font-size: 2.2rem;
            }
            
            .blog-meta-description {
                font-size: 1.1rem;
            }
            
            .blog-section-card {
                padding: 32px 24px;
            }
            
            .blog-section-title {
                font-size: 1.6rem;
            }
            
            .blog-section-image {
                height: 250px;
            }
            
            .blog-section-icon-wrapper {
                width: 60px;
                height: 60px;
            }
            
            .blog-section-icon {
                font-size: 28px;
            }
        }
        
        /* Scroll Animation */
        .animate-on-scroll {
            opacity: 0;
            transform: translateY(30px);
            transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .animate-on-scroll.visible {
            opacity: 1;
            transform: translateY(0);
        }