/*
Theme Name: Twenty Thirteen
Theme URI: https://wordpress.org/themes/twentythirteen/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: The 2013 theme for WordPress takes us back to the blog, featuring a full range of post formats, each displayed beautifully in their own unique way. Design details abound, starting with a vibrant color scheme and matching header images, beautiful typography and icons, and a flexible layout that looks great on any device, big or small.
Version: 4.4
Tested up to: 6.8
Requires at least: 3.6
Requires PHP: 5.2.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, one-column, two-columns, right-sidebar, custom-header, custom-menu, editor-style, featured-images, footer-widgets, microformats, post-formats, rtl-language-support, sticky-post, translation-ready, accessibility-ready, block-patterns
Text Domain: twentythirteen

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.
*/


/**
 * Table of Contents:
 *
 * 1.0 - Reset
 * 2.0 - Repeatable Patterns
 * 3.0 - Basic Structure
 * 4.0 - Header
 *   4.1 - Site Header
 *   4.2 - Navigation
 * 5.0 - Content
 *   5.1 - Entry Header
 *   5.2 - Entry Meta
 *   5.3 - Entry Content
 *   5.4 - Galleries
 *   5.5 - Post Formats
 *   5.6 - Attachments
 *   5.7 - Post/Paging Navigation
 *   5.8 - Author Bio
 *   5.9 - Archives
 *   5.10 - Search Results/No posts
 *   5.11 - 404
 *   5.12 - Comments
 *   5.13 - Multisite
 * 6.0 - Sidebar
 *   6.1 - Widgets
 * 7.0 - Footer
 * 8.0 - Media Queries
 * 9.0 - Print
 * ----------------------------------------------------------------------------
 */


/**
 * 1.0 Reset
 *
 * Modified from Normalize.css to provide cross-browser consistency and a smart
 * default styling of HTML elements.
 *
 * @see http://git.io/normalize
 * ----------------------------------------------------------------------------
 */

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
}

:root {
            --fibovil-green: #4CAF50;
            --fibovil-blue: #007BFF;
            --fibovil-dark-blue: #0A3D62;
            --fibovil-light-gray: #f8f9fa;
            --fibovil-text-color: #333;
            --fibovil-heading-color: #222;
            --font-family-inter: 'Inter', sans-serif;
            --section-padding: 6rem 0;
            --border-radius-lg: 1.5rem;
            --box-shadow-light: 0 4px 20px rgba(0,0,0,0.08);
            --box-shadow-medium: 0 8px 30px rgba(0,0,0,0.12);
        }
.highlight {
    color: var(--fibovil-blue);
    font-weight: 700;
}
.highlight-green{
    color: var(--fibovil-green);
    font-weight: 700;
}
        body {
            font-family: var(--font-family-inter);
            color: var(--fibovil-text-color);
            line-height: 1.6;
            background-color: #f0f2f5;
        }

        h1, h2, h3, h4, h5, h6 {
            color: var(--fibovil-heading-color);
            font-weight: 700;
        }

        section {
            padding: var(--section-padding);
            margin-bottom: 2rem;
            border-radius: var(--border-radius-lg);
            overflow: hidden;
        }

        .btn-primary {
            background-color: var(--fibovil-blue);
            border-color: var(--fibovil-blue);
            border-radius: 0.75rem;
            padding: 0.85rem 1.8rem;
            font-weight: 600;
            transition: all 0.3s ease;
            box-shadow: 0 4px 10px rgba(0, 123, 255, 0.2);
        }

        .btn-primary:hover {
            background-color: var(--fibovil-dark-blue);
            border-color: var(--fibovil-dark-blue);
            transform: translateY(-2px);
            box-shadow: 0 6px 15px rgba(0, 123, 255, 0.3);
        }

        .btn-outline-primary {
            color: var(--fibovil-blue);
            border-color: var(--fibovil-blue);
            border-radius: 0.75rem;
            padding: 0.85rem 1.8rem;
            font-weight: 600;
            transition: all 0.3s ease;
        }

        .btn-outline-primary:hover {
            background-color: var(--fibovil-blue);
            color: #fff;
            transform: translateY(-2px);
            box-shadow: 0 4px 10px rgba(0, 123, 255, 0.2);
        }

        .btn-outline-light {
            border-color: #fff;
			background-color: var(--fibovil-green);
            color: #fff;
            border-radius: 0.75rem;
            padding: 0.85rem 1.8rem;
            font-weight: 600;
            transition: all 0.3s ease;
        }

        .btn-outline-light:hover {
            background-color: var(--fibovil-dark-blue);
            color: #fff;
            transform: translateY(-2px);
            box-shadow: 0 4px 10px rgba(255, 255, 255, 0.2);
        }

        .navbar {
            background-color: #fff;
            box-shadow: 0 4px 10px rgba(0,0,0,0.08);
            padding-top: 1rem;
            padding-bottom: 1rem;
            border-bottom-left-radius: var(--border-radius-lg);
            border-bottom-right-radius: var(--border-radius-lg);
        }

        .navbar-brand img {
            max-height: 55px;
            border-radius: 0.5rem;
        }

        .nav-link {
            font-weight: 500;
            color: var(--fibovil-dark-blue) !important;
            margin-left: 1.2rem;
            transition: color 0.3s ease, transform 0.2s ease;
        }

        .nav-link:hover {
            color: var(--fibovil-blue) !important;
            transform: translateY(-2px);
        }

        @media (max-width: 991.98px) {
            .navbar-collapse {
                background-color: #fff;
                border-radius: 0 0 var(--border-radius-lg) var(--border-radius-lg);
                box-shadow: 0 8px 15px rgba(0,0,0,0.1);
                padding: 1rem;
                margin-top: 0.5rem;
            }

            .navbar-nav .nav-item {
                margin-bottom: 0.5rem;
            }

            .navbar-nav .nav-link {
                padding: 0.75rem 1rem;
                margin-left: 0;
                border-radius: 0.5rem;
                transition: background-color 0.3s ease, color 0.3s ease;
            }

            .navbar-nav .nav-link:hover {
                background-color: var(--fibovil-light-gray);
                color: var(--fibovil-blue) !important;
            }
        }

        .banner-section {
            /* background: linear-gradient(rgb(204 214 193), rgb(35 97 142)), url(images/fabovil-banner-bg.p) no-repeat center center; */
            background: linear-gradient(rgb(28 41 48), rgb(35 97 142));
            background-size: cover;
            background-position: center;
            color: #fff;
            padding: 6rem 0;
            text-align: left;
            border-radius: var(--border-radius-lg);
            margin-top: 1.5rem;
            position: relative;
            z-index: 1;
            display: flex;
            align-items: center;
            min-height: 600px;
        }

        .banner-section h1 {
            font-size: calc(2rem + 2vw);
            margin-bottom: 1.5rem;
            color: #fff;
            text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
        }

        .banner-section p.lead {
            font-size: calc(1rem + 0.8vw);
            margin-bottom: 3rem;
            opacity: 0.95;
        }

        .banner-form-wrapper {
            background-color: rgba(255, 255, 255, 0.2);
            padding: 2.5rem;
            border-radius: 1.5rem;
            box-shadow: 0 8px 30px rgba(0,0,0,0.2);
            backdrop-filter: blur(5px);
            border: 1px solid rgba(255, 255, 255, 0.3);
        }

        .banner-form-wrapper .form-label {
            color: #fff;
            font-weight: 500;
			width: 100%;
        }

        .banner-form-wrapper .form-control {
            background-color: rgba(255, 255, 255, 0.9);
            border: 1px solid rgba(255, 255, 255, 0.5);
            color: var(--fibovil-dark-blue);
        }

        .banner-form-wrapper .form-control::placeholder {
            color: #666;
            opacity: 0.8;
        }
		.banner-form-wrapper textarea.wpcf7-form-control.wpcf7-textarea {
height: 100px;
}
		.banner-form-wrapper input.wpcf7-form-control.wpcf7-submit {
    width: 100%;
    border: none;
    color: #fff;
}

        .banner-form-wrapper .form-control:focus {
            background-color: #fff;
            border-color: var(--fibovil-green);
            box-shadow: 0 0 0 0.25rem rgba(76, 175, 80, 0.25);
        }

        .feature-card {
            background-color: #fff;
            border-radius: 1.5rem;
            padding: 2.5rem;
            box-shadow: var(--box-shadow-light);
            text-align: center;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            border: 1px solid rgba(0,0,0,0.05);
        }

        .feature-card:hover {
            transform: translateY(-12px);
            box-shadow: var(--box-shadow-medium);
        }

        .feature-card .icon {
            font-size: calc(3rem + 1vw);
            color: var(--fibovil-green);
            margin-bottom: 1.8rem;
            animation: bounceIn 0.8s ease-out;
        }

        .feature-card h3 {
            font-size: calc(1.5rem + 0.5vw);
            margin-bottom: 1.2rem;
            color: var(--fibovil-dark-blue);
        }

        .about-us-section {
            background-color: var(--fibovil-light-gray);
            box-shadow: var(--box-shadow-light);
            border-radius: var(--border-radius-lg);
        }

        .about-us-section img {
            border-radius: 1.5rem;
            box-shadow: var(--box-shadow-medium);
        }

        .about-us-section ul {
            list-style: none;
            padding-left: 0;
            margin-top: 1.5rem;
        }

        .about-us-section ul li {
            margin-bottom: 0.8rem;
            font-size: calc(0.95rem + 0.05vw);
            color: var(--fibovil-text-color);
        }

        .about-us-section ul li i {
            color: var(--fibovil-green);
            margin-right: 0.8rem;
        }

        .what-we-offer-section {
            background-color: #fff;
            box-shadow: var(--box-shadow-light);
            border-radius: var(--border-radius-lg);
        }

        .offer-item {
            background-color: var(--fibovil-light-gray);
            border-radius: 1rem;
            padding: 2rem;
            text-align: center;
            box-shadow: 0 2px 10px rgba(0,0,0,0.05);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }

        .offer-item:hover {
            transform: translateY(-8px);
            box-shadow: 0 6px 15px rgba(0,0,0,0.1);
        }

        .offer-item .icon-wrapper {
            width: calc(4rem + 1vw);
            height: calc(4rem + 1vw);
            border-radius: 50%;
            background: linear-gradient(45deg, var(--fibovil-blue), var(--fibovil-green));
            display: flex;
            justify-content: center;
            align-items: center;
            margin-bottom: 1rem;
            box-shadow: 0 4px 10px rgba(0, 123, 255, 0.3);
            transition: all 0.3s ease;
        }

        .offer-item:hover .icon-wrapper {
            transform: scale(1.1);
            box-shadow: 0 6px 15px rgba(0, 123, 255, 0.5);
        }

        .offer-item .icon-wrapper i {
            font-size: calc(2.5rem + 0.5vw);
            color: #fff;
            margin: 0;
        }

        .offer-item h4 {
            font-size: calc(1.3rem + 0.2vw);
            margin-bottom: 0.75rem;
            color: var(--fibovil-dark-blue);
        }

        .range-section {
            background-color: #fff;
            box-shadow: var(--box-shadow-light);
            border-radius: var(--border-radius-lg);
        }

        /* .range-item {
            background-color: var(--fibovil-light-gray);
            border-radius: 1rem;
            padding: 1.8rem;
            margin-bottom: 1.5rem;
            box-shadow: 0 2px 10px rgba(0,0,0,0.05);
            transition: transform 0.3s ease, background-image 0.5s ease, background-color 0.5s ease;
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            position: relative;
            overflow: hidden;
        }

        .range-item::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0);
            transition: background-color 0.5s ease;
            z-index: 1;
        }

        .range-item:hover {
            transform: translateY(-5px);
            background-size: cover;
            background-position: center;
            color: #fff;
        }

        .range-item:hover::before {
            background-color: rgba(0, 0, 0, 0.5);
        }

        .range-item img {
            max-width: 100px;
            height: auto;
            border-radius: 0.5rem;
            margin-bottom: 1rem;
            transition: opacity 0.5s ease;
            z-index: 2;
        }

        .range-item:hover img {
            opacity: 0;
        }

        .range-item h4, .range-item p {
            position: relative;
            z-index: 2;
            transition: color 0.5s ease;
        }

        .range-item:hover h4, .range-item:hover p {
            color: #fff;
        }

        .range-item h4 {
            color: var(--fibovil-dark-blue);
            margin-bottom: 0.75rem;
            font-size: calc(1.2rem + 0.1vw);
            text-align: center;
        }

        .range-item p {
            text-align: center;
        } */
         .range-item {
    background-color: var(--fibovil-light-gray);
    background-size: cover;
    background-position: center;
    border-radius: 1rem;
    padding: 1.8rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    color: #fff;
    transition: transform 0.3s ease, background-image 0.5s ease, background-color 0.5s ease;
}

.range-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Always show overlay */
    transition: background-color 0.5s ease;
    z-index: 1;
}

.range-item img {
    max-width: 100px;
    height: auto;
    border-radius: 0.5rem;
    margin-bottom: 1rem;
    transition: opacity 0.5s ease;
    opacity: 0; /* Always hidden */
    z-index: 2;
}

.range-item h4,
.range-item p {
    position: relative;
    z-index: 2;
    color: #fff;
    transition: color 0.5s ease;
    text-align: center;
}

.range-item h4 {
    margin-bottom: 0.75rem;
    font-size: calc(1.2rem + 0.1vw);
}


        .cta-counters-section {
            background: linear-gradient(135deg, #011524 0%, #205389 50%, var(--fibovil-green) 100%);
            background-size: 200% 200%;
            animation: gradientAnimation 10s ease infinite;
            color: #fff;
            text-align: center;
            border-radius: var(--border-radius-lg);
            padding: var(--section-padding);
            box-shadow: var(--box-shadow-medium);
        }

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

        .cta-counters-section h2 {
            color: #fff;
            font-size: calc(2.2rem + 1vw);
            margin-bottom: 2rem;
            text-shadow: 1px 1px 3px rgba(0,0,0,0.2);
        }

        .counter-item {
            margin-bottom: 2rem;
        }

        .counter-item .count {
            font-size: calc(3rem + 1vw);
            font-weight: 700;
            color: var(--fibovil-green);
            display: block;
            line-height: 1;
            margin-bottom: 0.5rem;
            text-shadow: 1px 1px 3px rgba(0,0,0,0.2);
        }

        .counter-item .label {
            font-size: calc(1rem + 0.1vw);
            opacity: 0.9;
        }

        .franchise-section {
            background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('images/why-fibovil-bg.avif') no-repeat center center;
            background-size: cover;
            color: #fff;
            border-radius: var(--border-radius-lg);
            box-shadow: var(--box-shadow-medium);
        }

        .franchise-section h2 {
            color: #fff;
            font-size: calc(2.2rem + 1vw);
            margin-bottom: 1.5rem;
            text-shadow: 1px 1px 3px rgba(0,0,0,0.2);
        }

        .why-us-item {
            background-color: rgba(255, 255, 255, 0.9); /* Slightly opaque white background */
            border-radius: 1rem;
            padding: 1.5rem;
            text-align: center;
            box-shadow: 0 4px 15px rgba(0,0,0,0.1);
            transition: all 0.3s ease;
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            color: var(--fibovil-dark-blue); /* Text color for readability */
        }

        .why-us-item:hover {
            transform: translateY(-8px);
            box-shadow: 0 8px 25px rgba(0,0,0,0.2);
            background-color: #fff; /* Solid white on hover */
        }

        .why-us-item .why-us-icon {
            font-size: calc(2.5rem + 0.5vw); /* Scaled icon size */
            color: var(--fibovil-blue); /* Blue icon color */
            margin-bottom: 1rem;
            transition: color 0.3s ease;
        }

        .why-us-item:hover .why-us-icon {
            color: var(--fibovil-green); /* Green icon on hover */
        }

        .why-us-item .why-us-title {
            font-size: calc(1rem + 0.2vw); /* Scaled title size */
            font-weight: 600;
            margin-bottom: 0;
            color: var(--fibovil-dark-blue);
        }


        .product-carousel-section {
            background-color: var(--fibovil-light-gray);
            box-shadow: var(--box-shadow-light);
            border-radius: var(--border-radius-lg);
        }

        .product-card {
            background-color: #fff;
            border-radius: 1.5rem;
            padding: 1.8rem;
            box-shadow: var(--box-shadow-light);
            text-align: center;
            margin: 1rem;
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            border: 1px solid rgba(0,0,0,0.05);
        }

        .product-card:hover {
            transform: translateY(-8px);
            box-shadow: var(--box-shadow-medium);
        }

        .product-card img {
            max-width: 100%;
            height: 300px;
            object-fit: contain;
            margin-bottom: 1.2rem;
            border-radius: 0.75rem;
        }

        .product-card h4 {
            font-size: calc(1.2rem + 0.15vw);
            color: var(--fibovil-dark-blue);
            margin-bottom: 0.6rem;
        }

        .product-card p {
            font-size: calc(0.9rem + 0.05vw);
            color: #666;
            flex-grow: 1;
        }

        .owl-nav button {
            background-color: var(--fibovil-blue) !important;
            color: #fff !important;
            border-radius: 50% !important;
            width: 45px !important;
            height: 45px !important;
            font-size: 1.5rem !important;
            line-height: 45px !important;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            box-shadow: 0 4px 10px rgba(0, 123, 255, 0.3);
            transition: all 0.3s ease;
        }

        .owl-nav button.owl-prev {
            left: -20px;
        }
        .owl-nav button.owl-next {
            right: -20px;
        }
        .owl-nav button:hover {
            background-color: var(--fibovil-dark-blue) !important;
            transform: translateY(-50%) scale(1.05) !important;
        }

        .contact-section {
            background-color: #fff;
            box-shadow: var(--box-shadow-light);
            border-radius: var(--border-radius-lg);
        }

        .contact-info {
            background: linear-gradient(to bottom right, var(--fibovil-dark-blue), var(--fibovil-blue));
            color: #fff;
            padding: 2.5rem;
            border-radius: 1.5rem;
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            box-shadow: var(--box-shadow-medium);
        }

        .contact-info i {
            font-size: calc(1.5rem + 0.3vw);
            margin-right: 1.2rem;
            color: var(--fibovil-green);
        }

        .contact-info p {
            font-size: calc(1rem + 0.1vw);
        }

        .contact-form {
            background-color: var(--fibovil-light-gray);
            padding: 2.5rem;
            border-radius: 1.5rem;
            box-shadow: var(--box-shadow-light);
            border: 1px solid rgba(0,0,0,0.05);
        }

        .form-control {
            border-radius: 0.75rem;
            padding: 0.85rem;
            border: 1px solid #ddd;
            transition: border-color 0.3s ease, box-shadow 0.3s ease;
        }

        .form-control:focus {
            border-color: var(--fibovil-blue);
            box-shadow: 0 0 0 0.25rem rgba(0, 123, 255, 0.25);
        }

        .footer-section {
            background-color: var(--fibovil-dark-blue);
            color: #fff;
            padding: 3.5rem 0;
            font-size: calc(0.9rem + 0.05vw);
            border-top-left-radius: var(--border-radius-lg);
            border-top-right-radius: var(--border-radius-lg);
            margin-top: 2rem;
        }

        .footer-section a {
            color: #fff;
            text-decoration: none;
            transition: color 0.3s ease;
        }

        .footer-section a:hover {
            color: var(--fibovil-green);
        }

        .footer-section .footer-logo {
            max-height: 60px;
            margin-bottom: 1rem;
            border-radius: 0.5rem;
        }

        .footer-section .list-unstyled li {
            margin-bottom: 0.5rem;
        }
        .footer-section .list-unstyled li a {
            position: relative;
            padding-left: 15px;
        }
        .footer-section .list-unstyled li a::before {
            content: '\203A';
            position: absolute;
            left: 0;
            color: var(--fibovil-green);
            transition: transform 0.2s ease;
        }
        .footer-section .list-unstyled li a:hover::before {
            transform: translateX(5px);
        }


        .social-icons a {
            font-size: calc(1.5rem + 0.3vw);
            margin-right: 1.2rem;
            transition: transform 0.3s ease, color 0.3s ease;
        }

        .social-icons a:hover {
            transform: translateY(-3px);
            color: var(--fibovil-green);
        }

        @media (max-width: 992px) {
            .banner-section {
                text-align: center;
                padding: 4rem 0;
                min-height: auto;
            }
            .banner-section .col-md-6 {
                margin-bottom: 2rem;
            }
            .banner-form-wrapper {
                margin-top: 2rem;
            }
            .banner-section h1 {
                font-size: calc(2rem + 2vw);
            }
            .banner-section p {
                font-size: calc(1rem + 0.5vw);
            }
            .feature-card, .product-card, .offer-item {
                margin-bottom: 1.5rem;
            }
            .about-us-section .col-md-6, .contact-section .col-md-6 {
                margin-bottom: 2rem;
            }
            .contact-info {
                margin-bottom: 2rem;
            }
            .owl-nav button {
                width: 40px !important;
                height: 40px !important;
                font-size: 1.2rem !important;
                line-height: 40px !important;
            }
            .owl-nav button.owl-prev {
                left: 0px;
            }
            .owl-nav button.owl-next {
                right: 0px;
            }
        }

        @media (max-width: 768px) {
            section {
                padding: 4rem 0;
                margin-bottom: 1.5rem;
            }
        }

        @keyframes bounceIn {
            0% {
                opacity: 0;
                transform: scale(0.3);
            }
            50% {
                opacity: 1;
                transform: scale(1.05);
            }
            70% {
                transform: scale(0.9);
            }
            100% {
                transform: scale(1);
            }
        }

		/* modal form css */
		div#contactModal input.wpcf7-form-control.wpcf7-submit, section#contact input.wpcf7-form-control.wpcf7-submit{
    width: 100%;
    border: none;
    color: #fff;
}
div#contactModal .form-label,section#contact .form-label{
    width: 100%;
}
div#contactModal textarea.form-control,section#contact textarea.form-control{
	height: 130px;
}

#sequence {
    width: 100%;
    float: left;
    background: var(--fibovil-green);
    position: fixed;
    bottom: 0px;
    z-index: 100;
    padding: 5px 0;
    color: #ffffff !important;
    margin: 0 !important;
}

#sequence a {
    width: 33.3333%;
    float: left;
    text-align: center;
    padding: 5px 0;
    font-size: 15px;
    color: #ffffff !important;
    font-weight: 600;
    text-decoration: none !important;
}
#sequence a:not(:last-child) {
border-right: 1px solid;
}

/* breadcrumb css */
.page-breadcrumb {
    background: linear-gradient(135deg, var(--fibovil-green) 0%, var(--fibovil-blue) 100%);
    padding: 40px 0;
    color: #fff;
    position: relative;
    overflow: hidden;
    margin-top: 15px;
}

.page-breadcrumb::before {
    content: "";
    position: absolute;
    top: -50px;
    right: -50px;
    width: 200px;
    height: 200px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
}

.page-breadcrumb::after {
    content: "";
    position: absolute;
    bottom: -80px;
    left: -80px;
    width: 250px;
    height: 250px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
}

.page-breadcrumb span.breadcrumb_new a,
.page-breadcrumb span.breadcrumb_new {
    color: #fff;
}

.page-breadcrumb .extraa {
    margin: 54px 0;
}
@media (max-width:767px){
.page-breadcrumb {
    padding: 30px 0;
}
.page-breadcrumb .extraa {
    margin: 15px 0;
}
.page-breadcrumb::before {
    width: 150px;
    height: 150px;
}

.page-breadcrumb::after {
    width: 170px;
    height: 170px;
}

}

/* thank you page csss */
        

        .thank-you-container {
            background-color: #fff;
            border-radius: var(--border-radius-lg);
            box-shadow: var(--box-shadow-medium);
            padding: 3rem 2rem;
            text-align: center;
            max-width: 600px;
            margin: 0 auto;
        }
.thank-you-container .btn-primary {
            background-color: var(--fibovil-blue);
            border: 1px solid var(--fibovil-blue);
            border-radius: 0.75rem;
            padding: 0.85rem 1.8rem;
            font-weight: 600;
            color: #fff;
            transition: all 0.3s ease;
            box-shadow: 0 4px 10px rgba(0, 123, 255, 0.2);
            cursor: pointer;
            position: relative;
            overflow: hidden;
        }

        .thank-you-container .btn-primary:hover {
            background-color: var(--fibovil-dark-blue);
            border-color: var(--fibovil-dark-blue);
            transform: translateY(-2px);
            box-shadow: 0 6px 15px rgba(0, 123, 255, 0.3);
        }

        .thank-you-container .btn-primary:active {
            transform: translateY(0);
            box-shadow: 0 2px 5px rgba(0, 123, 255, 0.1);
        }

        .thank-you-container .btn-outline-primary {
            background-color: transparent;
            color: var(--fibovil-blue);
            border: 1px solid var(--fibovil-blue);
            border-radius: 0.75rem;
            padding: 0.85rem 1.8rem;
            font-weight: 600;
            transition: all 0.3s ease;
            cursor: pointer;
        }

        .thank-you-container .btn-outline-primary:hover {
            background-color: var(--fibovil-blue);
            color: #fff;
            border-color: var(--fibovil-blue);
            transform: translateY(-2px);
            box-shadow: 0 4px 10px rgba(0, 123, 255, 0.2);
        }

        .thank-you-container .btn-outline-light {
            border-color: #fff;
            background-color: var(--fibovil-green);
            color: #fff;
            border-radius: 0.75rem;
            padding: 0.85rem 1.8rem;
            font-weight: 600;
            transition: all 0.3s ease;
        }

        .thank-you-container .btn-outline-light:hover {
            background-color: var(--fibovil-dark-blue);
            color: #fff;
            transform: translateY(-2px);
            box-shadow: 0 4px 10px rgba(255, 255, 255, 0.2);
        }
        .thank-you-container .checkmark-circle {
            stroke-dasharray: 166;
            stroke-dashoffset: 166;
            stroke-width: 2;
            stroke-miterlimit: 10;
            stroke: var(--fibovil-green);
            fill: none;
            animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
        }

        .thank-you-container .checkmark-check {
            transform-origin: 50% 50%;
            stroke-dasharray: 48;
            stroke-dashoffset: 48;
            stroke-width: 2;
            stroke-miterlimit: 10;
            stroke: var(--fibovil-green);
            fill: none;
            animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards, scale 0.3s ease-in-out 1.2s both;
        }

        @keyframes stroke {
            100% {
                stroke-dashoffset: 0;
            }
        }

        @keyframes scale {
            0%, 100% {
                transform: none;
            }
            50% {
                transform: scale3d(1.1, 1.1, 1);
            }
        }

        .thank-you-container .checkmark-svg {
            width: 100px;
            height: 100px;
            border-radius: 50%;
            display: block;
            margin: 0 auto 2rem;
            box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
        }