/**
 * CADMasters Corporate Frontend — Professional engineering consultancy presentation
 * CMS + Theme Manager driven. Loaded after engineering-ui.css.
 */

:root {
    --cm-section-gap: var(--section-medium, 4rem);
    --cm-section-gap-sm: var(--section-small, 2rem);
    --cm-section-gap-lg: var(--section-large, 6rem);
    --cm-card-radius: var(--card-radius, var(--radius-md, 12px));
    --cm-header-height: var(--header-height, var(--theme-header-height, 80px));
    --cm-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --cm-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ── Global layout rhythm ── */
.cm-engineering-ui .cm-main {
    overflow-x: clip;
}

.cm-engineering-ui .section-block {
    padding: var(--cm-section-gap) 0;
}

.cm-engineering-ui .section-block.section-block--compact {
    padding: var(--cm-section-gap-sm) 0;
}

.cm-engineering-ui .section-block.section-block--intro {
    background: linear-gradient(180deg, var(--cm-white) 0%, var(--cm-steel-50) 100%);
}

.cm-engineering-ui .section-block__content.row {
    --bs-gutter-x: 1.75rem;
    --bs-gutter-y: 1.75rem;
}

.cm-engineering-ui .section-block:nth-child(even):not(.alt-bg):not(.section-block--intro):not(.cta-band) {
    background: var(--cm-white);
}

/* ── Sticky header — always visible (legacy classic header) ── */
.cm-engineering-ui .site-nav:not(.site-header--premium),
.cm-engineering-ui .site-header:not(.site-header--premium) {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1030;
    min-height: var(--cm-header-height);
    transition:
        background 0.35s var(--cm-ease-out),
        box-shadow 0.35s var(--cm-ease-out),
        border-color 0.35s var(--cm-ease-out),
        padding 0.35s var(--cm-ease-out);
}

.cm-engineering-ui .cm-main {
    padding-top: 0;
}

.cm-engineering-ui .site-header--classic .navbar-nav .nav-link::before {
    display: none;
}

.cm-engineering-ui .site-nav:not(.site-header--premium) .navbar-nav .nav-link {
    font-size: 0.9375rem;
    font-weight: 500;
    letter-spacing: 0.01em;
    padding: 0.5rem 0.85rem !important;
    position: relative;
}

.cm-engineering-ui .site-nav:not(.site-header--premium) .navbar-nav .nav-link::before {
    content: '';
    position: absolute;
    left: 0.85rem;
    right: 0.85rem;
    bottom: 0.15rem;
    height: 2px;
    background: var(--cm-accent);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s var(--cm-ease-out);
}

.cm-engineering-ui .site-nav:not(.site-header--premium) .navbar-nav .nav-link:hover::before,
.cm-engineering-ui .site-nav:not(.site-header--premium) .navbar-nav .nav-link.active::before {
    transform: scaleX(1);
}

.cm-engineering-ui .site-nav:not(.site-header--premium).site-nav--over-hero:not(.site-nav--scrolled):not(.header-scrolled) .btn-login {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.45);
    background: transparent;
}

.cm-engineering-ui .site-nav:not(.site-header--premium).site-nav--over-hero:not(.site-nav--scrolled):not(.header-scrolled) .btn-login:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

/* ── Hero — split engineering layout ── */
.cm-engineering-ui .hero-section {
    position: relative;
    isolation: isolate;
}

.cm-engineering-ui .hero-section--split {
    background: linear-gradient(135deg, var(--cm-charcoal) 0%, #0c2f6e 48%, #0a2347 100%);
}

.cm-engineering-ui .hero-section--split .hero-content {
    position: relative;
    z-index: 2;
}

.cm-engineering-ui .hero-section--split .hero-title {
    max-width: 14ch;
    line-height: var(--hero-heading-line-height, 1.15);
    margin-bottom: var(--hero-spacing, 1.25rem);
    font-size: var(--hero-title-size, var(--hero-heading-size, var(--hero-heading-size-base, clamp(2.25rem, 5vw, 3.5rem))));
    font-weight: var(--hero-heading-weight, 700);
}

.cm-engineering-ui .hero-section--split .hero-description {
    max-width: 650px;
    font-size: var(--hero-subtitle-size, clamp(1.05rem, 2vw, 1.2rem));
    line-height: 1.7;
}

.cm-engineering-ui .hero-visual {
    position: relative;
    border-radius: var(--cm-card-radius);
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(255, 255, 255, 0.12);
}

.cm-engineering-ui .hero-visual::before {
    content: '';
    position: absolute;
    inset: 0;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: inherit;
    pointer-events: none;
    z-index: 2;
}

.cm-engineering-ui .hero-visual::after {
    content: '';
    position: absolute;
    bottom: -1.5rem;
    right: -1.5rem;
    width: 40%;
    height: 40%;
    background: var(--cm-accent);
    opacity: 0.15;
    border-radius: var(--cm-card-radius);
    z-index: -1;
}

.cm-engineering-ui .hero-visual .cm-media--hero,
.cm-engineering-ui .hero-visual .media-presenter {
    height: 100%;
    min-height: 0;
}

.cm-engineering-ui .hero-visual .cm-media--hero .cm-media__img {
    width: 100%;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    object-fit: cover;
    transition: transform 0.8s var(--cm-ease-out);
}

.cm-engineering-ui .hero-section:hover .hero-visual .cm-media__img {
    transform: scale(1.03);
}

.cm-engineering-ui .hero-label {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--cm-accent);
    margin-bottom: 1rem;
}

.cm-engineering-ui .hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.875rem;
    margin-top: 2rem;
}

.cm-engineering-ui .hero-actions .hero-btn {
    min-width: 10.5rem;
}

/* ── Intro / company section ── */
.cm-engineering-ui .cm-intro-panel {
    position: relative;
}

.cm-engineering-ui .cm-intro-panel__media {
    border-radius: var(--cm-card-radius);
    overflow: hidden;
    box-shadow: var(--cm-shadow-lg);
}

.cm-engineering-ui .cm-intro-panel__media .cm-media__img {
    width: 100%;
    min-height: clamp(280px, 36vw, 420px);
    object-fit: cover;
}

.cm-engineering-ui .cm-intro-panel__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.85rem;
    background: rgba(0, 174, 239, 0.1);
    color: var(--cm-blue);
    border-radius: 999px;
    font-size: 0.8125rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.cm-engineering-ui .content-prose {
    font-size: 1.0625rem;
    color: var(--cm-steel-600);
    line-height: 1.75;
}

.cm-engineering-ui .content-prose p:last-child {
    margin-bottom: 0;
}

/* ── Section headers ── */
.cm-engineering-ui .section-header {
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.cm-engineering-ui .section-header--center .section-header__description {
    margin-left: auto;
    margin-right: auto;
}

.cm-engineering-ui .section-header__label {
    display: inline-block;
    margin-bottom: 0.75rem;
    font-size: 0.75rem;
}

.cm-engineering-ui .section-header__title {
    margin-bottom: 0.75rem;
}

/* ── Card design system — equal height ── */
.cm-engineering-ui .cm-card,
.cm-engineering-ui .team-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    border-radius: var(--cm-card-radius);
    border: 1px solid var(--cm-steel-200);
    background: var(--cm-white);
    overflow: hidden;
    transition:
        transform 0.35s var(--cm-ease-out),
        box-shadow 0.35s var(--cm-ease-out),
        border-color 0.35s var(--cm-ease-out);
}

.cm-engineering-ui .cm-card .card-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    padding: 1.5rem;
}

.cm-engineering-ui .cm-card .card-text {
    flex: 1 1 auto;
    color: var(--cm-steel-600);
    line-height: 1.65;
    margin-bottom: 1rem;
}

.cm-engineering-ui .cm-card .card-link {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.9375rem;
}

.cm-engineering-ui .cm-card__media {
    overflow: hidden;
    position: relative;
}

.cm-engineering-ui .cm-card .card-img-top,
.cm-engineering-ui .cm-card .cm-card__media .cm-media__img {
    height: 220px;
    width: 100%;
    object-fit: cover;
    transition: transform 0.55s var(--cm-ease-out);
}

.cm-engineering-ui .cm-card--project .card-img-top,
.cm-engineering-ui .cm-card--project .cm-card__media .cm-media__img {
    height: 240px;
}

.cm-engineering-ui .cm-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.12);
    border-color: rgba(0, 174, 239, 0.3);
}

.cm-engineering-ui .cm-card:hover .cm-media__img,
.cm-engineering-ui .cm-card:hover .card-img-top {
    transform: scale(1.08);
}

.cm-engineering-ui .cm-card-icon-wrap {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(145deg, var(--cm-steel-100), var(--cm-steel-50));
}

.cm-engineering-ui .cm-card-icon {
    width: 4rem;
    height: 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 1rem;
    background: var(--cm-white);
    color: var(--cm-blue);
    font-size: 1.75rem;
    box-shadow: var(--cm-shadow-card);
}

/* ── Why choose / statistics ── */
.cm-engineering-ui .cm-stat-card {
    height: 100%;
    text-align: left;
    padding: 1.75rem;
    border-radius: var(--cm-card-radius);
    border: 1px solid var(--cm-steel-200);
    background: var(--cm-white);
    transition: transform 0.35s var(--cm-ease-out), box-shadow 0.35s var(--cm-ease-out);
}

.cm-engineering-ui .cm-stat-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--cm-shadow-lg);
}

.cm-engineering-ui .cm-stat-card__icon {
    margin: 0 0 1.25rem;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 0.75rem;
    background: linear-gradient(135deg, rgba(11, 61, 145, 0.1), rgba(0, 174, 239, 0.15));
}

/* ── Inner page headers ── */
.cm-engineering-ui .cms-page-header.page-header,
.cm-engineering-ui .page-header.cms-page-header {
    background: linear-gradient(135deg, var(--cm-charcoal) 0%, #0c2f6e 100%);
    padding: calc(var(--cm-header-height) + 2.5rem) 0 clamp(2.5rem, 5vw, 3.5rem);
}

.cm-engineering-ui .cms-page-header .hero-title,
.cm-engineering-ui .page-header h1 {
    font-size: clamp(2rem, 4.5vw, 3rem);
    font-weight: 800;
    color: #fff;
    margin-bottom: 0.75rem;
}

.cm-engineering-ui .cms-page-header .hero-description,
.cm-engineering-ui .page-header .lead {
    max-width: 42rem;
    color: rgba(255, 255, 255, 0.85);
}

.cm-engineering-ui .breadcrumb {
    --bs-breadcrumb-divider-color: rgba(255, 255, 255, 0.45);
}

.cm-engineering-ui .page-header .breadcrumb-item a,
.cm-engineering-ui .cms-page-header .breadcrumb-item a {
    color: rgba(255, 255, 255, 0.75);
}

.cm-engineering-ui .page-header .breadcrumb-item.active,
.cm-engineering-ui .cms-page-header .breadcrumb-item.active {
    color: rgba(255, 255, 255, 0.95);
}

/* ── CTA band ── */
.cm-engineering-ui .cta-band {
    background: linear-gradient(135deg, var(--cm-charcoal) 0%, #0a2d6b 55%, #062347 100%);
    padding: clamp(4rem, 8vw, 6rem) 0;
}

.cm-engineering-ui .cta-band h2 {
    color: #fff;
    max-width: 20ch;
    margin-left: auto;
    margin-right: auto;
}

.cm-engineering-ui .cta-band .lead {
    max-width: 36rem;
    margin-left: auto;
    margin-right: auto;
    color: rgba(255, 255, 255, 0.8) !important;
}

/* ── Footer ── */
.cm-engineering-ui .site-footer {
    background: linear-gradient(180deg, #0a1628 0%, var(--cm-charcoal) 100%);
}

.cm-engineering-ui .site-footer .footer-brand {
    font-family: var(--cm-font-display);
    font-weight: 800;
    font-size: 1.25rem;
}

.cm-engineering-ui .site-footer a {
    color: rgba(255, 255, 255, 0.72);
    text-decoration: none;
    transition: color 0.25s ease;
}

/* ── Scroll animations ── */
.cm-engineering-ui.cm-animations-enabled [data-aos] {
    will-change: transform, opacity;
}

.cm-engineering-ui .cm-reveal:not(.cm-reveal--visible):not(.aos-animate) {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.65s var(--cm-ease-out), transform 0.65s var(--cm-ease-out);
}

.cm-engineering-ui .cm-reveal.cm-reveal--visible,
.cm-engineering-ui .cm-reveal.aos-animate {
    opacity: 1;
    transform: none;
}

.cm-engineering-ui.cm-page-transitions .cm-main {
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.45s var(--cm-ease-out), transform 0.45s var(--cm-ease-out);
}

.cm-engineering-ui.cm-page-transitions.cm-page-ready .cm-main {
    opacity: 1;
    transform: none;
}

/* ── Image lazy load reveal ── */
.cm-engineering-ui .cm-media:not(.cm-media--loaded) .cm-media__img {
    opacity: 0;
    transform: scale(1.02);
}

.cm-engineering-ui .cm-media.cm-media--loaded .cm-media__img {
    opacity: 1;
    transform: none;
    transition: opacity 0.5s var(--cm-ease-out), transform 0.5s var(--cm-ease-out);
}

/* ── Section footer actions ── */
.cm-engineering-ui .section-block__actions {
    margin-top: clamp(2rem, 4vw, 3rem);
    text-align: center;
}

.cm-engineering-ui .btn-outline-steel {
    border: 1px solid var(--cm-steel-300);
    color: var(--cm-steel-700);
    background: transparent;
    padding: 0.65rem 1.5rem;
    border-radius: var(--cm-radius);
    font-weight: 600;
}

.cm-engineering-ui .btn-outline-steel:hover {
    border-color: var(--cm-blue);
    color: var(--cm-blue);
    background: rgba(11, 61, 145, 0.04);
}

/* ── Responsive ── */
@media (max-width: 991.98px) {
    .cm-engineering-ui .hero-section--split .hero-title {
        max-width: none;
    }

    .cm-engineering-ui .hero-section:first-child {
        padding-top: calc(var(--cm-header-height) + 1.25rem);
    }

    .cm-engineering-ui .site-nav .navbar-collapse.show,
    .cm-engineering-ui .site-nav .navbar-collapse.collapsing {
        max-height: calc(100vh - var(--cm-header-height));
        overflow-y: auto;
    }
}

@media (max-width: 767.98px) {
    .cm-engineering-ui .section-block {
        padding: var(--cm-section-gap-sm) 0;
    }

    .cm-engineering-ui .cm-card .card-img-top,
    .cm-engineering-ui .cm-card .cm-card__media .cm-media__img {
        height: 200px;
    }

    .cm-engineering-ui .hero-actions .hero-btn {
        width: 100%;
        min-width: 0;
    }
}

@media (min-width: 1920px) {
    .cm-engineering-ui .container {
        max-width: min(var(--theme-container-width, 1320px), 88vw);
    }
}

@media (prefers-reduced-motion: reduce) {
    .cm-engineering-ui .cm-card:hover,
    .cm-engineering-ui .cm-stat-card:hover,
    .cm-engineering-ui .hero-section:hover .hero-visual .cm-media__img {
        transform: none;
    }

    .cm-engineering-ui .cm-reveal:not(.cm-reveal--visible):not(.aos-animate) {
        opacity: 1;
        transform: none;
    }
}