/* Shared layout contract: fluid by default, bounded on large screens. */
:root {
    --site-max-width: 1400px;
    --site-wide-max-width: 1600px;
    --site-gutter: 24px;
    --site-mobile-gutter: 16px;
    --site-nav-height: 76px;
    --shared-card-bg: linear-gradient(
        145deg,
        rgba(17, 29, 31, 0.60),
        rgba(4, 9, 11, 0.50)
    );
    --shared-card-bg-hover: linear-gradient(
        145deg,
        rgba(24, 42, 43, 0.67),
        rgba(5, 12, 14, 0.56)
    );
    --shared-card-border: rgba(220, 255, 247, 0.20);
    --shared-card-shadow:
        0 24px 60px rgba(0, 0, 0, 0.36),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html {
    min-width: 0 !important;
    overflow-x: hidden;
}

body {
    width: 100%;
    min-width: 0 !important;
    overflow-x: hidden;
    background-attachment: fixed !important;
    background-size: cover !important;
    background-position: center center !important;
}

img,
video,
svg {
    max-width: 100%;
}

.container,
.container-fluid-custom,
.container-xl-custom {
    width: 100% !important;
    min-width: 0 !important;
    max-width: var(--site-max-width) !important;
    margin-inline: auto !important;
    padding-inline: var(--site-gutter) !important;
    box-sizing: border-box;
}

.container-xl-custom {
    max-width: var(--site-wide-max-width) !important;
}

.premium-nav {
    padding: 14px 0;
    min-height: var(--site-nav-height);
}

.premium-nav > .container-fluid {
    width: 100%;
    max-width: var(--site-max-width);
    margin-inline: auto;
    padding-inline: var(--site-gutter) !important;
}

.nav-brand-premium {
    max-width: 52vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    letter-spacing: 0;
}

.premium-nav .navbar-nav {
    gap: 8px;
}

.premium-nav .nav-link-premium,
.premium-nav .btn-consult-capsule {
    letter-spacing: 0;
}

.page-header-premium {
    width: 100%;
    min-height: 380px;
    padding: 100px var(--site-gutter) 40px;
    background: transparent !important;
    background-attachment: scroll !important;
    box-sizing: border-box;
}

.page-header-content {
    width: 100%;
    max-width: 100%;
}

.page-header-premium h1,
.page-header-premium p {
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
    letter-spacing: 0;
}

.section-premium {
    width: 100%;
    box-sizing: border-box;
}

.rich-content-fluid,
.detail-content,
.contact-premium-value,
.premium-desc-text {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.detail-content table,
.detail-content pre {
    display: block;
    max-width: 100%;
    overflow-x: auto;
}

/* Keep every content surface on the same light, translucent business-card material. */
.giant-about-card-shell,
.glass-premium-card,
.unesco-stacked-card,
.contact-glass-card,
.premium-case-card,
.service-grid-card,
.news-giant-featured-card,
.news-grid-glass-card,
.stat-premium-card-wrapper,
.glass-body-舱,
.showcase-card {
    background: var(--shared-card-bg) !important;
    border: 1px solid var(--shared-card-border) !important;
    border-radius: 24px !important;
    box-shadow: var(--shared-card-shadow) !important;
    -webkit-backdrop-filter: blur(24px) saturate(135%) !important;
    backdrop-filter: blur(24px) saturate(135%) !important;
}

.giant-about-card-shell:hover,
.glass-premium-card:hover,
.unesco-stacked-card:hover,
.contact-glass-card:hover,
.premium-case-card:hover,
.service-grid-card:hover,
.news-giant-featured-card:hover,
.news-grid-glass-card:hover,
.stat-premium-card-wrapper:hover,
.showcase-card:hover {
    background: var(--shared-card-bg-hover) !important;
    border-color: rgba(220, 255, 247, 0.34) !important;
}

/* Cover images remain visible; the glass treatment comes from tint, border and shadow. */
.premium-case-card .case-card-bg-img-shell,
.service-grid-card .service-grid-card-bg,
.showcase-card .showcase-card-bg {
    display: block !important;
}

/* Use a translucent tint for legibility without blurring the cover image. */
.case-card-glass-mask,
.service-grid-card-mask {
    background: linear-gradient(
        to bottom,
        rgba(17, 29, 31, 0.04) 20%,
        rgba(4, 9, 11, 0.68) 100%
    ) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

.showcase-glass-overlay {
    background: linear-gradient(
        to bottom,
        rgba(17, 30, 31, 0.08),
        rgba(3, 8, 10, 0.58)
    ) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

.premium-case-card,
.service-grid-card,
.showcase-card {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

.news-giant-content-wrap,
.news-grid-body {
    background: transparent !important;
}

/* The homepage uses a full-viewport hero, but its content remains fluid. */
.home-page .hero-section > .container,
body:not(.business-page) .hero-section > .container {
    height: 100%;
}

.home-page .hero-section,
.home-page .video-background-shell,
.home-page .video-background-shell video {
    min-width: 0;
}

@media (max-width: 991.98px) {
    .premium-nav {
        background: rgba(11, 15, 8, 0.94) !important;
        padding: 10px 0;
    }

    .premium-nav > .container-fluid {
        padding-inline: var(--site-mobile-gutter) !important;
    }

    .premium-nav .navbar-toggler {
        display: block !important;
        width: 44px;
        height: 44px;
        padding: 8px;
        border-radius: 8px;
    }

    .premium-nav .toggler-premium .bi-list {
        display: block;
        color: #ffffff;
        font-size: 1.6rem;
        line-height: 1;
    }

    .premium-nav .nav-brand-premium {
        max-width: calc(100% - 60px);
        font-size: 16px !important;
    }

    .premium-nav .navbar-collapse:not(.show) {
        display: none !important;
    }

    .premium-nav .navbar-collapse.show {
        display: block !important;
        flex-basis: 100%;
        padding-top: 8px;
    }

    .premium-nav .navbar-nav {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 2px !important;
        width: 100%;
    }

    .premium-nav .nav-link-premium {
        display: block;
        padding: 10px 12px !important;
        font-size: 16px !important;
    }

    .premium-nav .nav-item.mt-3 {
        margin-top: 6px !important;
    }

    .premium-nav .btn-consult-capsule {
        display: block;
        width: 100%;
        min-height: 44px;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .home-page .hero-left-stage {
        left: 32px;
        right: 32px;
        top: 22% !important;
        max-width: none !important;
    }

    .home-page .hero-left-stage h1 {
        max-width: 100%;
        font-size: 4rem !important;
        line-height: 1.2;
        letter-spacing: 0;
    }

    .home-page .hero-bottom-control-center {
        left: 24px !important;
        right: 24px;
        bottom: 8vh !important;
        width: auto !important;
        transform: none !important;
    }

    .home-page .single-unified-capsule {
        width: 100%;
        max-width: 100%;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
        padding: 10px 16px;
        border-radius: 24px;
    }

    .home-page .capsule-redirect-link {
        flex: 1 0 100%;
        justify-content: center;
        padding: 4px 8px;
    }

    .home-page .capsule-v-line {
        display: none;
    }

    .home-page .btn-capsule-action {
        flex: 1 1 calc(50% - 4px);
        justify-content: center;
        min-height: 44px;
        padding-inline: 12px;
        letter-spacing: 0;
    }
}

@media (max-width: 767.98px) {
    :root {
        --site-gutter: var(--site-mobile-gutter);
    }

    html {
        font-size: 16px !important;
    }

    body {
        font-size: 16px !important;
        line-height: 1.7;
    }

    .page-header-premium {
        min-height: 280px;
        padding: 92px var(--site-mobile-gutter) 28px;
    }

    .page-header-premium h1 {
        font-size: 2rem !important;
        line-height: 1.25;
        margin-bottom: 10px;
    }

    .page-header-premium p {
        font-size: 0.95rem !important;
        line-height: 1.6;
    }

    .section-premium {
        padding: 64px 0;
    }

    .section-title-premium {
        margin-bottom: 32px;
    }

    .section-title-premium h2 {
        font-size: 1.75rem !important;
        line-height: 1.35;
        letter-spacing: 0;
    }

    .section-title-premium p {
        font-size: 0.95rem !important;
        letter-spacing: 0;
    }

    .home-page .hero-section,
    .home-page .video-background-shell,
    .home-page .video-background-shell video {
        height: 100svh !important;
        min-height: 0;
    }

    .home-page .hero-section > .container {
        height: 100%;
        min-height: 0;
        padding-inline: var(--site-mobile-gutter) !important;
    }

    .home-page .hero-left-stage {
        left: var(--site-mobile-gutter);
        right: var(--site-mobile-gutter);
        top: 23% !important;
        max-width: none !important;
    }

    .home-page .hero-left-stage.wait-for-video {
        transform: translateX(0) !important;
    }

    .home-page .hero-left-stage h1 {
        max-width: 100%;
        font-size: 2.35rem !important;
        line-height: 1.25;
        letter-spacing: 0;
        overflow-wrap: anywhere;
    }

    .home-page .chinese-group-wrap p {
        font-size: 1rem;
        line-height: 1.6;
        letter-spacing: 0;
    }

    .home-page .hero-bottom-control-center {
        left: var(--site-mobile-gutter) !important;
        right: var(--site-mobile-gutter);
        bottom: 24px !important;
        width: auto !important;
        transform: none !important;
    }

    .home-page .single-unified-capsule {
        width: 100%;
        max-width: 100%;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
        padding: 10px 12px;
        border-radius: 20px;
    }

    .home-page .capsule-redirect-link {
        flex: 1 0 100%;
        justify-content: center;
        padding: 4px 8px;
    }

    .home-page .capsule-v-line {
        display: none;
    }

    .home-page .btn-capsule-action {
        flex: 1 1 calc(50% - 4px);
        justify-content: center;
        min-height: 44px;
        padding-inline: 10px;
        letter-spacing: 0;
    }

    .about-page .giant-about-card-shell .row > [class*="col-"],
    .about-page .row > .col-6,
    .about-page .unesco-text-wrap .row > .col-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .about-page .giant-about-img-wrap {
        min-height: 240px;
    }

    .about-page .giant-about-text-content,
    .about-page .team-card-content-premium,
    .about-page .unesco-text-wrap,
    .about-page .brand-system-card-wrap {
        padding: 24px !important;
    }

    .about-page .team-card-image-premium {
        height: 220px;
    }

    .about-page .unesco-banner-img-wrap {
        height: 240px;
    }

    .contact-page .container-xl-custom .row > .col-3 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .contact-page .contact-glass-card {
        min-height: 0;
        padding: 36px 24px;
    }

    .contact-page .cta-premium-strip {
        padding: 64px 0 52px;
    }

    .contact-page .cta-premium-strip h2 {
        font-size: 1.65rem !important;
        letter-spacing: 0 !important;
    }

    .cases-page .premium-case-card {
        height: 360px;
    }

    .cases-page .case-card-glass-mask {
        padding: 24px;
    }

    .cases-page .case-card-glass-mask h4 {
        font-size: 1.35rem;
        line-height: 1.4;
    }

    .cases-page .case-card-glass-mask p {
        max-width: 100%;
        font-size: 0.95rem;
        line-height: 1.65;
        transform: none;
    }

    .cases-page .stats-premium-strip {
        padding: 72px 0;
    }

    .cases-page .stat-premium-number {
        font-size: 2.75rem;
    }

    .industries-page .service-grid-card {
        height: 360px;
    }

    .industries-page .service-grid-card-mask {
        padding: 24px;
    }

    .industries-page .service-grid-card h4 {
        font-size: 1.35rem;
        letter-spacing: 0;
    }

    .industries-page .service-grid-card p {
        color: rgba(255, 255, 255, 0.82);
        opacity: 1;
        transform: none;
        font-size: 0.95rem;
        line-height: 1.65;
    }

    .news-page .news-giant-img-wrap {
        height: 220px;
    }

    .news-page .news-giant-content-wrap,
    .news-page .news-grid-body {
        padding: 20px;
    }

    .news-page .news-giant-content-wrap h3 {
        font-size: 1.4rem;
    }

    .news-page .news-grid-glass-card {
        min-height: 0 !important;
    }

    .news-page .news-grid-img-wrap {
        height: 180px !important;
    }

    .business-page .page-header-premium,
    .capabilities-page .page-header-premium {
        min-height: 280px;
    }

    .business-page .showcase-card,
    .capabilities-page .showcase-card {
        height: 360px;
        min-height: 0;
    }

    .business-page .showcase-card-content h3,
    .capabilities-page .showcase-card-content h3 {
        display: block;
        white-space: normal;
        overflow: visible;
        font-size: 1.15rem;
        letter-spacing: 0;
        line-height: 1.45;
    }

    .business-page .showcase-glass-overlay,
    .capabilities-page .showcase-glass-overlay {
        padding: 20px 16px;
    }

    .glass-body-舱 {
        padding: 24px !important;
        border-radius: 18px;
    }

    .detail-header-premium {
        min-height: 260px;
        padding: 100px var(--site-mobile-gutter) 28px;
    }

    .detail-heading {
        font-size: 2rem !important;
        line-height: 1.3;
    }
}

@media (max-width: 359.98px) {
    .home-page .hero-left-stage h1 {
        font-size: 2rem !important;
        line-height: 1.22;
    }

    .home-page .hero-left-stage {
        top: 21% !important;
    }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .about-page .giant-about-card-shell .row > [class*="col-"],
    .about-page .unesco-text-wrap .row > .col-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .contact-page .container-xl-custom .row > .col-3 {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

@media (hover: none) {
    .industries-page .service-grid-card p,
    .cases-page .case-card-glass-mask p {
        opacity: 1;
        transform: none;
    }
}

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