:root {
    --brand-950: #07111f;
    --brand-900: #0b1b31;
    --brand-800: #0f2747;
    --brand-700: #174375;
    --brand-600: #2563a8;
    --brand-500: #3578d4;
    --brand-teal: #0f9f91;
    --brand-teal-soft: #d9f5f1;
    --surface: #f5f8fc;
    --surface-raised: #ffffff;
    --line: #dbe5f0;
    --copy: #132238;
    --copy-muted: #52657d;
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 24px;
    --shadow-card: 0 14px 38px rgba(15, 39, 71, .085);
    --shadow-card-hover: 0 22px 50px rgba(15, 39, 71, .14);
}

body {
    color: var(--copy);
    background: var(--surface);
}

::selection {
    color: #fff;
    background: var(--brand-600);
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid #62a5ff;
    outline-offset: 3px;
}

.skip-link {
    position: fixed;
    top: 10px;
    left: 14px;
    z-index: 9999;
    padding: 10px 16px;
    border-radius: 9px;
    color: #fff;
    background: var(--brand-950);
    font-weight: 750;
    text-decoration: none;
    transform: translateY(-160%);
    transition: transform .18s ease;
}

.skip-link:focus {
    transform: translateY(0);
}

.site-main-shell {
    overflow: clip;
}

.navbar {
    --nav-accent: #74e0d4;
    min-height: 78px;
    padding-block: 10px;
    background: var(--nav-surface);
    box-shadow: 0 10px 28px rgba(2, 8, 20, .14);
}

.logo a {
    align-items: center;
}

.logo a img {
    width: 44px;
    height: 44px;
    object-fit: contain;
    transition: width .24s ease, height .24s ease;
}

.logo a span {
    max-width: min(42vw, 320px);
    overflow: hidden;
    color: #fff;
    font-size: clamp(1.02rem, 2vw, 1.22rem);
    font-weight: 760;
    letter-spacing: -.015em;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-list {
    gap: clamp(11px, 1.55vw, 21px);
}

.nav-list li a {
    border-bottom: 0;
    border-radius: 8px;
    padding: 9px 7px;
    font-size: .9rem;
}

.nav-list li a:hover,
.nav-list li a[aria-current="page"] {
    border-bottom-color: transparent;
    color: #fff;
    background: rgba(116, 224, 212, .1);
}

.nav-list li a[aria-current="page"] {
    box-shadow: inset 0 -2px #3ec6b8;
}

.language-select {
    border-color: rgba(255, 255, 255, .22);
    border-radius: 9px;
    background-color: rgba(255, 255, 255, .06);
}

.site-footer {
    padding-top: 0;
    background: var(--brand-950);
    border-top: 1px solid rgba(129, 164, 205, .15);
}

.footer-container {
    padding-top: clamp(54px, 6vw, 76px);
}

.footer-col h3,
.footer-col h4 {
    color: #8bded5;
}

.footer-address {
    font-style: normal;
}

.footer-col ul li a:hover,
.footer-contact a:hover {
    color: #8bded5;
    padding-left: 0;
}

.footer-social a {
    color: #fff;
}

.footer-social a:hover {
    background: var(--brand-teal);
    transform: translateY(-2px);
}

/* Shared section language */
.sitelinks-hub {
    background: var(--surface);
}

.sitelinks-hub-inner,
.services-container,
.product-container,
.footer-container {
    width: min(1280px, calc(100% - 40px));
    max-width: 1280px;
}

.sitelink-card,
.product-card {
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
}

.sitelink-card {
    min-height: 124px;
    padding: 19px;
    background: #fff;
}

.sitelink-card:hover,
.sitelink-card:focus-visible,
.product-card:hover {
    border-color: #8ab5e7;
    box-shadow: var(--shadow-card-hover);
}

/* Expertise carousel */
.slider {
    --bg-primary: var(--brand-950);
    --bg-secondary: var(--brand-900);
    --accent: #5d9df2;
    --accent-secondary: #2dd4bf;
    min-height: 670px;
    background: var(--brand-950);
}

.slider::before {
    opacity: .32;
}

.slide-badge,
.tag {
    border-radius: 8px;
}

.img-box {
    border-color: rgba(130, 166, 211, .24);
    border-radius: 20px;
    box-shadow: 0 26px 60px rgba(0, 0, 0, .32);
}

.nav-btn,
.dot {
    transition-duration: .2s;
}

/* Services */
.our-services {
    padding: clamp(72px, 8vw, 112px) 0;
    background: #fff;
}

.services-header {
    max-width: 760px;
    margin: 0 auto 46px;
}

.our-services .section-tag {
    margin-bottom: 16px;
    padding: 7px 13px;
    border: 1px solid #aeddd8;
    border-radius: 999px;
    color: #08786d;
    background: #ecfbf8;
    box-shadow: none;
    font-size: .72rem;
    font-weight: 820;
    animation: none;
}

.our-services .services-title {
    margin-bottom: 14px;
    color: var(--brand-900);
    font-size: clamp(2rem, 4vw, 3.2rem);
    letter-spacing: -.04em;
    animation: none;
}

.our-services .services-subtitle {
    max-width: 690px;
    color: var(--copy-muted);
    font-size: 1.03rem;
    line-height: 1.75;
    animation: none;
}

.services-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-top: 0;
}

.our-services .service-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 27px 23px 24px;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: #fff;
    box-shadow: 0 9px 28px rgba(15, 39, 71, .065);
    cursor: default;
    overflow: hidden;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.our-services .service-card::before {
    height: 3px;
    background: linear-gradient(90deg, var(--brand-500), var(--brand-teal));
    transform: none;
}

.our-services .service-card::after {
    display: none;
}

.our-services .service-card:hover {
    transform: translateY(-3px);
    border-color: #a9c5e7;
    box-shadow: var(--shadow-card-hover);
}

.our-services .card-icon {
    width: 54px;
    height: 54px;
    margin-bottom: 21px;
    border: 1px solid #c8dcf5;
    border-radius: 13px;
    color: var(--brand-600);
    background: #eef5ff;
    box-shadow: none;
}

.our-services .card-icon svg {
    width: 28px;
    height: 28px;
}

.our-services .service-card:hover .card-icon {
    transform: none;
    box-shadow: none;
}

.our-services .card-title {
    margin-bottom: 11px;
    color: var(--brand-900);
    font-size: 1.24rem;
}

.our-services .service-card:hover .card-title {
    color: var(--brand-700);
}

.our-services .card-description {
    margin-bottom: 18px;
    color: var(--copy-muted);
    font-size: .91rem;
    line-height: 1.7;
}

.our-services .card-features {
    flex: 1;
    margin-bottom: 22px;
    padding-top: 14px;
    border-top: 1px solid #edf1f6;
}

.our-services .card-features li {
    padding: 7px 0 7px 25px;
    color: #354a63;
    font-size: .84rem;
}

.our-services .card-features li::before {
    content: "✓";
    width: 17px;
    height: 17px;
    color: #08786d;
    background: var(--brand-teal-soft);
    font-size: .68rem;
}

.our-services .service-card:hover .card-features li {
    padding-left: 25px;
}

.our-services .card-link {
    width: fit-content;
    gap: 8px;
    color: var(--brand-600);
    font-size: .88rem;
    font-weight: 750;
}

.our-services .card-link:hover {
    gap: 11px;
    color: var(--brand-800);
}

/* Products and clear pricing */
.product-section,
.products-price-section {
    background: var(--brand-950);
}

.product-section {
    padding-block: clamp(72px, 8vw, 104px);
}

.product-section-title {
    margin-bottom: 44px;
}

.product-section-title h2,
.products-price-section .sub-title {
    color: #8bded5;
}

.product-grid {
    gap: 18px;
}

.product-card {
    border-color: rgba(143, 177, 219, .18);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, .045);
    box-shadow: none;
}

.product-card:hover {
    transform: translateY(-3px);
    border-color: rgba(139, 222, 213, .5);
    box-shadow: 0 20px 42px rgba(0, 0, 0, .24);
}

.product-card-content h3 {
    color: #c8e2ff;
}

.product-btn {
    border-radius: 10px;
    color: #fff;
    background: var(--brand-600);
}

.products-price-section {
    padding: clamp(76px, 8vw, 110px) 20px;
    border-top: 1px solid rgba(143, 177, 219, .14);
}

.products-price-section .section-title {
    font-size: clamp(2rem, 4vw, 3rem);
    letter-spacing: -.035em;
}

.products-price-section .pricing-note {
    margin-bottom: 56px;
    color: #aebed2;
}

.products-price-section .sub-title {
    max-width: 1200px;
    margin: 62px auto 24px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(143, 177, 219, .18);
    font-size: 1.15rem;
    font-weight: 750;
    letter-spacing: .02em;
    text-align: left;
}

.products-price-section .price-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.products-price-section .price-card {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    padding: 28px 24px;
    border: 1px solid rgba(143, 177, 219, .19);
    border-radius: var(--radius-md);
    background: #0b192c;
    text-align: left;
    overflow: visible;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.products-price-section .price-card::before {
    display: none;
}

.products-price-section .price-card:hover {
    transform: translateY(-3px);
    border-color: rgba(93, 157, 242, .6);
    box-shadow: 0 20px 42px rgba(0, 0, 0, .28);
}

.products-price-section .popular {
    border-color: #3ec6b8;
    background: linear-gradient(155deg, rgba(20, 83, 91, .38), #0b192c 52%);
    transform: none;
}

.products-price-section .badge {
    width: fit-content;
    margin: -43px 0 17px;
    border: 1px solid #61d3c7;
    color: #052c2a;
    background: #8be4da;
    font-size: .68rem;
    font-weight: 820;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.products-price-section h4 {
    min-height: 48px;
    margin-bottom: 6px;
    color: #f4f8fd;
    font-size: 1.15rem;
    line-height: 1.35;
}

.products-price-section ul {
    flex: 1;
    margin: 16px 0 0;
    padding-top: 15px;
    border-top: 1px solid rgba(143, 177, 219, .13);
}

.products-price-section ul li {
    position: relative;
    margin: 0;
    padding: 7px 0 7px 23px;
    color: #c5d2e3;
    font-size: .87rem;
    line-height: 1.48;
}

.products-price-section ul li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #6dd8cd;
    font-weight: 800;
}

.products-price-section .price {
    margin: 23px 0 17px;
    color: #fff;
    font-size: clamp(1.35rem, 2.3vw, 1.75rem);
    letter-spacing: -.02em;
}

.products-price-section .price-btn {
    width: 100%;
    min-height: 46px;
    border: 1px solid rgba(115, 174, 249, .38);
    border-radius: 10px;
    color: #fff;
    background: #174d83;
    font-weight: 750;
}

.products-price-section .popular .price-btn {
    border-color: transparent;
    background: #12877c;
}

@media (max-width: 1120px) {
    .services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .sitelinks-hub-inner,
    .services-container,
    .product-container,
    .footer-container {
        width: min(100% - 30px, 760px);
    }

    .products-price-section .price-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .slider {
        min-height: 720px;
    }
}

@media (max-width: 640px) {
    .services-grid,
    .products-price-section .price-grid {
        grid-template-columns: 1fr;
    }

    .our-services .service-card {
        padding: 24px 20px 22px;
    }

    .products-price-section {
        padding-inline: 14px;
    }

    .products-price-section .sub-title {
        margin-top: 52px;
        text-align: center;
    }

    .products-price-section .price-card {
        padding: 26px 21px;
    }

    .products-price-section .badge {
        margin-top: -41px;
    }

    .slider {
        min-height: 700px;
    }
}

@media (hover: none) {
    .our-services .service-card:hover,
    .product-card:hover,
    .products-price-section .price-card:hover {
        transform: none;
    }
}

@media (min-width: 1700px) {
    .sitelinks-hub-inner,
    .services-container,
    .product-container,
    .footer-container {
        width: min(1460px, calc(100% - 80px));
        max-width: 1460px;
    }

    .services-grid {
        gap: 22px;
    }
}

@media (min-width: 2500px) {
    :root {
        --page-max: 1680px;
    }

    html {
        font-size: 20px;
    }

    .sitelinks-hub-inner,
    .services-container,
    .product-container,
    .footer-container {
        width: min(1680px, calc(100% - 120px));
        max-width: 1680px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}