:root {
    --public-bg: #f6f8fb;
    --public-surface: #ffffff;
    --public-text: #1f2937;
    --public-muted: #64748b;
    --public-primary: #155e75;
    --public-primary-hover: #164e63;
    --public-primary-soft: #e6f3f6;
    --public-border: #dfe5ec;
    --public-shadow: 0 10px 28px rgba(15, 23, 42, .07);
}

body {
    background: var(--public-bg) !important;
    color: var(--public-text) !important;
    letter-spacing: 0 !important;
}

.hero-section {
    background: #0f3f4d !important;
    color: #fff !important;
    padding: 72px 0 !important;
}

.section-padding {
    padding: 56px 0 !important;
}

.card,
.card-hover,
.pricing-card,
.feature-card {
    border: 1px solid var(--public-border) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 14px rgba(15, 23, 42, .05) !important;
}

.card-hover:hover {
    transform: translateY(-2px) !important;
    box-shadow: var(--public-shadow) !important;
}

.btn,
.form-control,
.form-select {
    border-radius: 7px !important;
}

.btn-primary {
    background: var(--public-primary) !important;
    border-color: var(--public-primary) !important;
    color: #fff !important;
    padding: .75rem 1.1rem !important;
}

.btn-primary:hover {
    background: var(--public-primary-hover) !important;
    border-color: var(--public-primary-hover) !important;
    transform: translateY(-1px) !important;
    box-shadow: none !important;
}

.text-gradient {
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
    color: var(--public-primary) !important;
}

.section-title::after {
    background: var(--public-primary) !important;
    border-radius: 0 !important;
}

.footer {
    background: #111827 !important;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--public-primary) !important;
    box-shadow: 0 0 0 .2rem rgba(21, 94, 117, .12) !important;
}

.site-shell {
    width: min(1180px, calc(100% - 32px));
    margin-inline: auto;
}

.site-nav {
    position: sticky;
    top: 0;
    z-index: 1040;
    background: rgba(255, 255, 255, .97) !important;
    border-bottom: 1px solid #d8e0ea;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .05);
}

.site-nav .site-shell {
    min-height: 72px;
}

.site-nav .site-brand {
    color: #182434 !important;
    font-size: 1.35rem !important;
    font-weight: 900 !important;
    padding: .25rem 0 !important;
}

.site-brand-mark {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #0f3f4d;
    color: #fff;
    margin-left: .55rem;
}

.site-brand-logo {
    display: block;
    width: 48px;
    height: 48px;
    object-fit: contain;
    object-position: right center;
}

.site-nav .nav-link {
    color: #314155 !important;
    font-size: .92rem;
    font-weight: 700;
    padding: .7rem .8rem !important;
}

.site-nav .nav-link:hover,
.site-nav .nav-link.active {
    color: #0f3f4d !important;
}

.site-nav .site-nav-action {
    border: 1px solid #0f3f4d;
    color: #0f3f4d !important;
    border-radius: 8px;
    padding: .6rem .95rem !important;
}

.site-nav .site-nav-action:hover {
    background: #0f3f4d;
    color: #fff !important;
}

.site-footer {
    background: #101827 !important;
    color: #dbe7f1;
    padding: 54px 0 20px;
}

.site-footer-grid {
    display: grid;
    grid-template-columns: 1.2fr 2fr 1fr;
    gap: 2rem;
    margin-bottom: 2rem;
}

.site-footer h3,
.site-footer h4 {
    color: #fff;
    font-weight: 950;
    margin-bottom: 1rem;
}

.site-footer-logo {
    display: block;
    width: 184px;
    max-width: 100%;
    height: 58px;
    object-fit: contain;
    object-position: right center;
    margin-bottom: 1rem;
    filter: brightness(0) invert(1);
}

.site-footer-symbol {
    width: 82px;
    height: 82px;
    filter: none;
}

.site-footer p,
.site-footer a {
    color: #b8c7d6;
    text-decoration: none;
    line-height: 1.9;
    font-size: .92rem;
}

.site-footer a:hover {
    color: #fff;
}

.site-footer-links {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.site-footer ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.site-footer li {
    margin-bottom: .45rem;
}

.site-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, .12);
    padding-top: 1rem;
    color: #8ea3b7;
    font-size: .88rem;
    text-align: center;
}

@media (max-width: 991px) {
    .site-footer-grid {
        grid-template-columns: 1fr;
    }

    .site-footer-links {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .site-shell {
        width: min(100% - 22px, 1180px);
    }

    .site-footer-links {
        grid-template-columns: 1fr;
    }
}

/* Classic landing page treatment for / */
.navbar.navbar-light {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: rgba(255, 255, 255, .96) !important;
    border-bottom: 1px solid #d8dee6;
    box-shadow: 0 6px 20px rgba(15, 23, 42, .05);
}

.navbar.navbar-light .container {
    min-height: 76px;
}

.navbar-brand {
    color: #12263a !important;
    font-size: 1.45rem !important;
    font-weight: 800 !important;
}

.navbar-brand i {
    color: #9a6a1f !important;
}

.navbar-light .navbar-nav .nav-link {
    color: #334155 !important;
    font-size: .93rem;
    font-weight: 650;
    padding: .65rem .85rem !important;
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus {
    color: #0f3f4d !important;
}

.hero-section {
    position: relative;
    min-height: auto !important;
    padding: 96px 0 82px !important;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, .98) 0%, rgba(255, 255, 255, .92) 48%, rgba(246, 248, 251, .78) 100%),
        repeating-linear-gradient(135deg, rgba(15, 63, 77, .045) 0 1px, transparent 1px 18px) !important;
    border-bottom: 1px solid #d8dee6;
}

.hero-section::before {
    content: "";
    position: absolute;
    inset: 0;
    border-top: 4px solid #0f3f4d;
    pointer-events: none;
}

.hero-section .container {
    position: relative;
}

.hero-content {
    max-width: 690px;
    padding: 28px 0 !important;
}

.hero-title {
    color: #12263a !important;
    font-size: clamp(2.8rem, 6vw, 5.3rem) !important;
    line-height: 1.05 !important;
    margin-bottom: 1rem !important;
    font-weight: 900 !important;
}

.hero-subtitle {
    color: #0f3f4d !important;
    font-size: clamp(1.25rem, 2.2vw, 1.85rem) !important;
    font-weight: 800 !important;
    margin-bottom: 1rem !important;
}

.hero-description {
    color: #475569 !important;
    font-size: 1.12rem !important;
    max-width: 560px;
    margin-bottom: 2rem !important;
}

.service-categories-preview {
    gap: .75rem !important;
    margin-top: 2rem !important;
}

.category-preview {
    background: #fff !important;
    border: 1px solid #d8dee6;
    border-radius: 6px !important;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .06) !important;
    padding: .8rem 1rem !important;
}

.category-preview:hover {
    transform: translateY(-2px) !important;
    border-color: #b08a3c;
}

.category-preview i {
    color: #9a6a1f !important;
    font-size: 1.15rem !important;
}

.category-preview span {
    color: #12263a !important;
    font-size: .92rem;
}

.phone-mockup,
.app-screenshot {
    background: #12263a !important;
    border: 1px solid #243b53;
    border-radius: 14px !important;
    box-shadow: 0 24px 48px rgba(15, 23, 42, .18) !important;
}

.phone-screen,
.screenshot-content {
    border-radius: 9px !important;
    border: 1px solid #e2e8f0;
}

.app-header {
    border-bottom-color: #d8dee6 !important;
}

.service-item-app,
.feature-item {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0;
    border-radius: 6px !important;
}

.service-item-app:hover,
.feature-item:hover {
    background: #eef6f8 !important;
}

.service-item-app i,
.feature-item i {
    color: #0f3f4d !important;
}

.services-section,
.popular-services,
.about-section {
    padding: 76px 0 !important;
}

.services-section {
    background: #f6f8fb !important;
}

.popular-services,
.about-section {
    background: #fff !important;
}

.section-title {
    color: #12263a !important;
    font-size: clamp(1.8rem, 3vw, 2.45rem) !important;
    font-weight: 850 !important;
    margin-bottom: 3.2rem !important;
}

.section-title::after {
    width: 72px !important;
    height: 2px !important;
    background: #b08a3c !important;
    border-radius: 0 !important;
}

.services-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1.15rem !important;
}

.service-category-card,
.popular-service-item {
    background: #fff !important;
    border: 1px solid #d8dee6 !important;
    border-radius: 7px !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .055) !important;
}

.service-category-card {
    padding: 1.35rem !important;
}

.service-category-card:hover,
.popular-service-item:hover {
    transform: translateY(-2px) !important;
    border-color: #b08a3c !important;
    box-shadow: 0 14px 30px rgba(15, 23, 42, .08) !important;
}

.category-title {
    color: #12263a !important;
    border-bottom: 1px solid #d8dee6 !important;
    font-size: 1.08rem !important;
    padding-bottom: .8rem !important;
}

.service-link {
    color: #475569 !important;
    border-radius: 5px !important;
    padding: .48rem .65rem !important;
}

.service-link:hover {
    background: #f1f5f9 !important;
    color: #0f3f4d !important;
    transform: translateX(-2px) !important;
}

.popular-services-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1rem !important;
}

.popular-service-item {
    min-height: 150px;
    justify-content: center;
}

.popular-service-item .service-icon {
    background: #eef6f8 !important;
    border: 1px solid #cfe4ea;
    width: 56px !important;
    height: 56px !important;
}

.popular-service-item .service-icon i {
    color: #0f3f4d !important;
}

.popular-service-item .service-name {
    color: #12263a !important;
}

.additional-links {
    gap: .65rem !important;
}

.additional-link {
    background: #fff !important;
    color: #334155 !important;
    border: 1px solid #d8dee6;
    border-radius: 999px !important;
}

.additional-link:hover,
.additional-link[style] {
    background: #0f3f4d !important;
    border-color: #0f3f4d !important;
    color: #fff !important;
}

.about-text {
    color: #475569 !important;
    line-height: 2 !important;
}

.footer {
    background: #12263a !important;
    border-top: 4px solid #b08a3c;
}

.footer-title {
    color: #e8c77b !important;
}

.footer-list a,
.footer-bottom p {
    color: #cbd5e1 !important;
}

.footer-list a:hover {
    color: #fff !important;
}

.contact-info {
    background: rgba(255, 255, 255, .06) !important;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 7px !important;
}

.contact-info i {
    color: #e8c77b !important;
}

@media (max-width: 991px) {
    .navbar.navbar-light .container {
        min-height: 64px;
    }

    .hero-section {
        padding: 70px 0 56px !important;
    }

    .hero-content {
        text-align: center;
        margin-inline: auto;
    }

    .hero-description {
        margin-inline: auto;
    }

    .service-categories-preview {
        justify-content: center;
    }

    .hero-image {
        margin-top: 2rem;
    }

    .services-grid,
    .popular-services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 576px) {
    .services-grid,
    .popular-services-grid {
        grid-template-columns: 1fr !important;
    }

    .category-preview {
        width: 100%;
        justify-content: center;
    }
}
