/* Front-facing redesign layer: scoped to public pages only */

:root {
    --front-radius-lg: 24px;
    --front-radius-md: 18px;
    --front-shadow-soft: 0 14px 40px rgba(13, 31, 67, 0.08);
    --front-shadow-hover: 0 24px 50px rgba(13, 31, 67, 0.15);
}

body.front-refresh {
    background: radial-gradient(circle at 0 0, rgba(35, 87, 150, 0.1), transparent 33%),
        radial-gradient(circle at 100% 0, rgba(20, 107, 97, 0.08), transparent 30%),
        #f6f9fc;
    color: #203047;
}

.front-refresh .navbar-top,
.front-refresh .navbar-bottom {
    backdrop-filter: blur(10px);
}

.front-refresh .navbar-bottom {
    background: rgba(255, 255, 255, 0.85);
    border-bottom: 1px solid rgba(19, 57, 90, 0.08);
}

.front-refresh .hero-section,
.front-refresh .banner-section {
    position: relative;
    overflow: hidden;
}

.front-refresh .hero-content,
.front-refresh .banner-content {
    position: relative;
    z-index: 1;
}

.front-refresh .hero-content {
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--front-radius-lg);
    padding: clamp(1.15rem, 2.2vw, 2rem);
    backdrop-filter: blur(9px);
}

.front-refresh .banner-title,
.front-refresh .hero-title {
    text-wrap: balance;
    letter-spacing: -0.02em;
}

.front-refresh .feature-item,
.front-refresh .service-item,
.front-refresh .plan__item,
.front-refresh .blog__item,
.front-refresh .contact-wrapper,
.front-refresh .counter-item,
.front-refresh .clients-item,
.front-refresh .widget,
.front-refresh .about__item,
.front-refresh .how-it-wrapper,
.front-refresh .accordion-item {
    border-radius: var(--front-radius-md);
    border: 1px solid rgba(20, 62, 96, 0.1);
    box-shadow: var(--front-shadow-soft);
    background: #fff;
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.front-refresh .feature-item:hover,
.front-refresh .service-item:hover,
.front-refresh .plan__item:hover,
.front-refresh .blog__item:hover,
.front-refresh .counter-item:hover,
.front-refresh .clients-item:hover,
.front-refresh .widget:hover,
.front-refresh .accordion-item:hover {
    transform: translateY(-4px);
    box-shadow: var(--front-shadow-hover);
    border-color: rgba(20, 62, 96, 0.2);
}

.front-refresh .service-item,
.front-refresh .feature-item {
    height: 100%;
    overflow: hidden;
}

.front-refresh .service-item__icon,
.front-refresh .feature-item__icon,
.front-refresh .counter-icon {
    width: 64px;
    height: 64px;
    border-radius: 16px;
    background: linear-gradient(140deg, rgba(27, 91, 151, 0.12), rgba(28, 159, 138, 0.1));
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.front-refresh .service-item__icon img,
.front-refresh .feature-item__icon img {
    max-width: 32px;
    max-height: 32px;
    object-fit: contain;
}

.front-refresh .about-thumb .thumb,
.front-refresh .how-it-img,
.front-refresh .blog__item-img,
.front-refresh .app-img {
    border-radius: var(--front-radius-lg);
    overflow: hidden;
}

.front-refresh .about-thumb .thumb img,
.front-refresh .how-it-img img,
.front-refresh .blog__item-img img {
    width: 100%;
    display: block;
    object-fit: cover;
}

.front-refresh .how-it-header {
    border-top-left-radius: var(--front-radius-md);
    border-top-right-radius: var(--front-radius-md);
}

.front-refresh .how-it-body {
    border-bottom-left-radius: var(--front-radius-md);
    border-bottom-right-radius: var(--front-radius-md);
}

.front-refresh .pricing-checkbox .nav--tabs {
    border-radius: 999px;
    background: rgba(17, 64, 108, 0.08);
    display: inline-flex;
    padding: 0.4rem;
    gap: 0.35rem;
}

.front-refresh .pricing-checkbox .nav--tabs li a {
    border-radius: 999px;
}

.front-refresh .plan__item-header .right {
    border-radius: 14px;
}

.front-refresh .plan__item-body ul li {
    border-color: rgba(20, 62, 96, 0.08);
}

.front-refresh .blog__item-content,
.front-refresh .blog__details,
.front-refresh .widget-body,
.front-refresh .contact-wrapper,
.front-refresh .about__item {
    line-height: 1.75;
}

.front-refresh .blog__item-details .blog__item-content {
    padding: 1.25rem 1.5rem 0.35rem;
}

.front-refresh .blog__item-details .blog__details {
    padding: 0 1.5rem 1.6rem;
}

.front-refresh .blog__item-details .blog__details > :first-child {
    margin-top: 0;
}

.front-refresh .blog__item-details .blog__details > :last-child {
    margin-bottom: 0;
}

.front-refresh .blog-sidebar .widget-header {
    border-top-left-radius: var(--front-radius-md);
    border-top-right-radius: var(--front-radius-md);
}

.front-refresh .contact__item,
.front-refresh .latest-posts li a,
.front-refresh .archive-links li a {
    border-radius: 14px;
}

.front-refresh .mapouter iframe,
.front-refresh #gmap_canvas {
    width: 100% !important;
    min-height: 300px;
    border-radius: var(--front-radius-md);
}

.front-refresh .form--control {
    border-radius: 14px;
    border: 1px solid rgba(22, 67, 103, 0.18);
    background: #fbfdff;
    min-height: 50px;
}

.front-refresh textarea.form--control {
    min-height: 140px;
}

.front-refresh .form--control:focus {
    border-color: rgba(22, 67, 103, 0.4);
    box-shadow: 0 0 0 0.2rem rgba(22, 67, 103, 0.12);
}

.front-refresh .pagination {
    justify-content: center;
    gap: 0.45rem;
}

.front-refresh .pagination .page-item .page-link,
.front-refresh .pagination li a,
.front-refresh .pagination li span {
    border-radius: 12px;
    border: 1px solid rgba(20, 62, 96, 0.14);
    min-width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.front-refresh .accordion-wrapper {
    display: grid;
    gap: 0.85rem;
}

.front-refresh .counter-title,
.front-refresh .service-item__cont-title,
.front-refresh .feature-item__cont-title,
.front-refresh .blog__item-content-title,
.front-refresh .contact__item-cont-title {
    letter-spacing: -0.01em;
}

.front-refresh .clients-slider {
    border-radius: var(--front-radius-lg);
    overflow: hidden;
}

.front-refresh .read-more {
    font-weight: 700;
}

.front-refresh .toTopBtn {
    box-shadow: 0 12px 30px rgba(11, 35, 73, 0.3);
}

@media (max-width: 991.98px) {
    .front-refresh .hero-content,
    .front-refresh .banner-content {
        text-align: left;
    }

    .front-refresh .hero-content {
        padding: 1rem;
    }

    .front-refresh .blog-sidebar {
        padding-left: 0 !important;
    }
}

@media (max-width: 575.98px) {
    .front-refresh .pricing-checkbox .nav--tabs {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        border-radius: 16px;
    }

    .front-refresh .pricing-checkbox .nav--tabs li a {
        text-align: center;
    }

    .front-refresh .feature-item,
    .front-refresh .service-item,
    .front-refresh .plan__item,
    .front-refresh .blog__item,
    .front-refresh .contact-wrapper,
    .front-refresh .counter-item,
    .front-refresh .clients-item,
    .front-refresh .widget,
    .front-refresh .about__item,
    .front-refresh .how-it-wrapper,
    .front-refresh .accordion-item {
        border-radius: 14px;
    }

    .front-refresh .blog__item-details .blog__item-content {
        padding: 1rem 1rem 0.25rem;
    }

    .front-refresh .blog__item-details .blog__details {
        padding: 0 1rem 1.1rem;
    }
}