/* BETONIX Visual V4 — Modern Cinematic + Clean Professional + Interactive Technical */
:root {
    --v4-navy: #071b2b;
    --v4-navy-2: #0b2638;
    --v4-orange: #ff6a21;
    --v4-orange-dark: #e95412;
    --v4-cyan: #38c8df;
    --v4-paper: #f5f7f8;
    --v4-ink: #0b2030;
}

body { font-size: 15px; }

/* Compact, reference-like public navigation */
.site-header-v1 { box-shadow: 0 8px 28px rgba(4, 24, 38, .07); }
.site-utility { background: #071b2b; }
.site-utility .container { min-height: 25px; }
.site-utility a { color: #ff9461; }
.site-header-v1 .navbar { min-height: 65px; padding: .28rem 0; }
.site-header-v1 .navbar-brand img { width: 142px; }
.site-header-v1 .nav-link { padding: .65rem .48rem !important; font-size: .72rem; font-weight: 700; letter-spacing: -.01em; }
.site-header-v1 .nav-link:after { right: .48rem; bottom: .32rem; left: .48rem; background: var(--v4-orange); }
.nav-actions { gap: 6px; }
.nav-icon-action, .theme-switch { width: 34px; height: 34px; }
.theme-labrix .btn-brand,
.btn-brand { color: #fff; border-color: var(--v4-orange); background: var(--v4-orange); box-shadow: 0 10px 24px rgba(255, 106, 33, .22); }
.theme-labrix .btn-brand:hover,
.btn-brand:hover,
.btn-brand:focus { color: #fff; border-color: var(--v4-orange-dark); background: var(--v4-orange-dark); }
.site-header-v1 .btn-brand { padding: .6rem .85rem; border-radius: 7px; font-size: .72rem; }

html[data-color-mode="dark"] .site-header-v1 { border-bottom-color: rgba(255,255,255,.08); background: rgba(5, 22, 34, .97); }
html[data-color-mode="dark"] .site-header-v1 .nav-link,
html[data-color-mode="dark"] .site-header-v1 .login-link { color: #e8f0f4; }
html[data-color-mode="dark"] .nav-icon-action,
html[data-color-mode="dark"] .theme-switch { color: #e8f0f4; border-color: rgba(255,255,255,.15); background: rgba(255,255,255,.04); }

/* A: cinematic infrastructure opening */
.theme-labrix .hero-carousel { min-height: 760px; background: var(--v4-navy); }
.theme-labrix .hero-slide-inner { min-height: 760px; padding-top: 54px; padding-bottom: 196px; }
.theme-labrix .hero-slide:before { background-position: center, center, center; }
.theme-labrix .hero-slide--cinematic-v4:before {
    background-image:
        linear-gradient(90deg, rgba(3, 16, 27, .98) 0%, rgba(3, 17, 29, .92) 31%, rgba(3, 17, 29, .49) 55%, rgba(3, 17, 29, .08) 80%),
        linear-gradient(0deg, rgba(3, 15, 26, .58), transparent 48%),
        var(--hero-image);
    background-position: center, center, center;
}
.theme-labrix .hero-carousel .hero-content { max-width: 650px; }
.theme-labrix .hero-carousel .hero-content h1,
.theme-labrix .hero-carousel .hero-content h2 { max-width: 680px; margin: 14px 0 18px; font-size: clamp(2.7rem, 4.6vw, 4.65rem); font-weight: 750; line-height: .99; letter-spacing: -.055em; }
.theme-labrix .hero-carousel .hero-content h1 > span { display: block; }
.theme-labrix .hero-carousel .hero-content h1 em,
.theme-labrix .hero-carousel .hero-content h2 em { display: block; color: var(--v4-orange); font-style: normal; }
.theme-labrix .hero-carousel .eyebrow { margin-bottom: 12px; padding: 0; color: #78d8e7; border: 0; border-radius: 0; background: transparent; font-size: .66rem; letter-spacing: .2em; }
.theme-labrix .hero-carousel .hero-content > p { max-width: 590px; margin: 0; color: #c2d1d8; font-size: 1rem; line-height: 1.55; }
.theme-labrix .hero-actions { gap: 10px; margin-top: 23px; }
.theme-labrix .hero-actions .btn { min-height: 43px; padding: .63rem 1rem; border-radius: 7px; font-size: .82rem; }
.theme-labrix .hero-stats { display: grid; max-width: 610px; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-top: 30px; padding-top: 18px; border-color: rgba(255,255,255,.19); }
.theme-labrix .hero-stats > div { padding-right: 17px; }
.theme-labrix .hero-stats > div + div { padding-left: 17px; border-left: 1px solid rgba(255,255,255,.13); }
.theme-labrix .hero-stats strong { color: #fff; font-size: 1.05rem; }
.theme-labrix .hero-stats span { color: #9eb0ba; font-size: .63rem; line-height: 1.3; }
.hero-sector-rail { position: absolute; right: 22px; bottom: 208px; display: flex; flex-direction: column; gap: 3px; padding: 13px 16px; color: #fff; border-left: 2px solid var(--v4-orange); background: rgba(3, 17, 29, .58); font-size: .68rem; font-weight: 800; letter-spacing: .12em; line-height: 1.35; backdrop-filter: blur(8px); }
.theme-labrix .hero-carousel-controls { right: max(20px, calc((100vw - 1240px)/2)); bottom: 127px; left: auto; width: auto; }
.hero-carousel-controls .hero-dots { display: none; }
.hero-arrows button { width: 36px; height: 36px; border-color: rgba(255,255,255,.28); background: rgba(4,24,37,.52); }

/* Six technical modules embedded in the opening, as in concept A */
.hero-domain-strip { bottom: 18px; gap: 7px; }
.hero-domain-strip > a { min-height: 91px; gap: 10px; padding: 13px 12px; border-radius: 5px; border-color: rgba(139, 180, 198, .28); background: rgba(6, 29, 44, .82); box-shadow: none; }
.hero-domain-strip > a:hover,
.hero-domain-strip > a:focus-visible { border-color: var(--v4-orange); background: rgba(10, 41, 60, .96); transform: translateY(-3px); }
.hero-domain-icon { width: 34px; height: 34px; color: #78d8e7; border-radius: 5px; background: rgba(56, 200, 223, .08); }
.hero-domain-strip strong { font-size: .76rem; }
.hero-domain-strip small { color: #91a7b2; font-size: .58rem; }
.labrix-marquee { display: none; }

/* B: clean professional trust strip */
.v4-trustbar { color: var(--v4-ink); border-bottom: 1px solid #dfe6e9; background: #fff; }
.v4-trustbar .container { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.v4-trustbar .container > div { display: flex; min-height: 94px; align-items: center; justify-content: center; gap: 12px; padding: 18px; }
.v4-trustbar .container > div + div { border-left: 1px solid #e4eaed; }
.v4-trust-icon { display: grid; width: 38px; height: 38px; place-items: center; color: var(--v4-orange); border: 1px solid #dce5e9; border-radius: 50%; }
.v4-trust-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.v4-trustbar p { margin: 0; line-height: 1.25; }
.v4-trustbar strong, .v4-trustbar small { display: block; }
.v4-trustbar strong { font-size: .78rem; }
.v4-trustbar small { margin-top: 4px; color: #758892; font-size: .64rem; }
html[data-color-mode="dark"] .v4-trustbar { color: #eef5f7; border-color: #183848; background: #092332; }
html[data-color-mode="dark"] .v4-trustbar .container > div + div { border-color: #183848; }
html[data-color-mode="dark"] .v4-trust-icon { border-color: #2a4b5a; }

/* Compact editorial content cards, closer to concept B */
.theme-labrix .section { padding: 76px 0; }
.theme-labrix .section-heading { margin-bottom: 26px; }
.theme-labrix .section-heading .eyebrow { padding: 0; color: var(--v4-orange); border: 0; border-radius: 0; font-size: .64rem; }
.theme-labrix .section-heading h2,
.theme-labrix .service-offers-heading h2 { font-size: clamp(2rem, 3.2vw, 3.2rem); font-weight: 650; }
.theme-labrix .public-article-card,
.theme-labrix .knowledge-result-card { border: 1px solid var(--v1-line); border-radius: 8px; box-shadow: 0 10px 28px rgba(8, 31, 47, .06); }

/* C: interactive technical command surface */
.theme-labrix .technical { position: relative; margin: 12px 18px; overflow: hidden; color: #edf7fa; border: 1px solid #183c52; border-radius: 14px; background:
    linear-gradient(rgba(19, 72, 99, .16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(19, 72, 99, .16) 1px, transparent 1px),
    radial-gradient(circle at 75% 35%, rgba(0, 153, 204, .17), transparent 34%),
    #061c2b;
    background-size: 34px 34px, 34px 34px, auto, auto;
}
.theme-labrix .technical:before { content: ""; position: absolute; right: 4%; bottom: -15%; width: 46%; height: 100%; opacity: .22; background: linear-gradient(135deg, transparent 18%, #1d9ac5 18.3%, transparent 18.8%, transparent 39%, #1d9ac5 39.3%, transparent 39.8%); transform: skewX(-10deg); pointer-events: none; }
.theme-labrix .technical .container { position: relative; z-index: 1; }
.theme-labrix .technical .section-heading h2 { color: #fff; }
.theme-labrix .technical .section-heading p { color: #9db4c0; }
.theme-labrix .technical .section-heading a { color: #76d9e8; }
.theme-labrix .technical-grid { gap: 10px; }
.theme-labrix .technical-card { min-height: 205px; padding: 23px; color: #eaf3f6; border: 1px solid rgba(121, 180, 207, .2); border-radius: 7px; background: rgba(8, 39, 57, .84); box-shadow: none; backdrop-filter: blur(5px); }
.theme-labrix .technical-card.featured { color: #fff; border-color: rgba(255, 106, 33, .58); background: linear-gradient(125deg, rgba(255,106,33,.22), rgba(8,39,57,.9) 55%); }
.theme-labrix .technical-card > span { color: #73d5e4; }
.theme-labrix .technical-card h3 { margin: 22px 0 9px; color: #fff; }
.theme-labrix .technical-card p,
.theme-labrix .technical-card.featured p { color: #9eb4bf; }
.theme-labrix .technical-card a,
.theme-labrix .technical-card.featured a { color: #ff9664; }

/* Make the remaining public system feel like the same design family */
.theme-labrix .expertise-card.expertise-card-v2,
.theme-labrix .service-offer-card,
.solution-partner-card { border-radius: 10px; }
.theme-labrix .expertise-media { height: 210px; }
.theme-labrix .expertise-card-body { min-height: 220px; padding: 24px; }
.theme-labrix .cta { color: #fff; border-radius: 12px; background: linear-gradient(115deg, #0b2c42, #103b51); box-shadow: 0 24px 55px rgba(3,24,38,.18); }
.theme-labrix .cta h2 { color: #fff; }
.theme-labrix .cta p { color: #a9c0ca; }
.theme-labrix .cta .btn-outline-brand { color: #fff; border-color: rgba(255,255,255,.3); }

@media (max-width: 1199.98px) {
    .site-header-v1 .nav-link { font-size: .8rem; }
    .hero-sector-rail { display: none; }
}

@media (max-width: 991.98px) {
    .theme-labrix .hero-carousel { min-height: 865px; }
    .theme-labrix .hero-slide-inner { min-height: 865px; padding-top: 58px; padding-bottom: 300px; }
    .theme-labrix .hero-carousel-controls { right: 20px; bottom: 217px; }
    .hero-domain-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .hero-domain-strip > a { min-height: 80px; }
}

@media (max-width: 767.98px) {
    .site-header-v1 .navbar { min-height: 60px; }
    .site-header-v1 .navbar-brand img { width: 126px; }
    .theme-labrix .hero-carousel { min-height: 920px; }
    .theme-labrix .hero-slide-inner { min-height: 920px; padding-top: 48px; padding-bottom: 350px; }
    .theme-labrix .hero-slide--cinematic-v4:before { background-image: linear-gradient(90deg, rgba(3,16,27,.95), rgba(3,17,29,.72)), linear-gradient(0deg, rgba(3,15,26,.7), transparent 55%), var(--hero-image); background-position: center, center, 64% center; }
    .theme-labrix .hero-carousel .hero-content h1,
    .theme-labrix .hero-carousel .hero-content h2 { font-size: clamp(2.35rem, 10.6vw, 3.45rem); }
    .theme-labrix .hero-carousel .hero-content > p { font-size: .91rem; }
    .theme-labrix .hero-stats { grid-template-columns: repeat(2, minmax(0,1fr)); row-gap: 14px; }
    .theme-labrix .hero-stats > div:nth-child(3) { padding-left: 0; border-left: 0; }
    .theme-labrix .hero-carousel-controls { bottom: 268px; }
    .hero-domain-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hero-domain-strip > a { min-height: 76px; }
    .v4-trustbar .container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .v4-trustbar .container > div { justify-content: flex-start; min-height: 78px; }
    .v4-trustbar .container > div:nth-child(3) { border-top: 1px solid #e4eaed; border-left: 0; }
    .v4-trustbar .container > div:nth-child(4) { border-top: 1px solid #e4eaed; }
    html[data-color-mode="dark"] .v4-trustbar .container > div:nth-child(3),
    html[data-color-mode="dark"] .v4-trustbar .container > div:nth-child(4) { border-top-color: #183848; }
    .theme-labrix .section { padding: 60px 0; }
    .theme-labrix .technical { margin: 7px; }
}

@media (max-width: 420px) {
    .theme-labrix .hero-carousel { min-height: 970px; }
    .theme-labrix .hero-slide-inner { min-height: 970px; padding-bottom: 372px; }
    .theme-labrix .hero-actions .btn { width: 100%; }
    .theme-labrix .hero-carousel-controls { bottom: 290px; }
    .hero-domain-strip strong { font-size: .7rem; }
    .v4-trustbar .container > div { padding: 13px 9px; }
}

@media (prefers-reduced-motion: reduce) {
    .hero-domain-strip > a { transition: none; }
}
