/*
 * Elementor compatibility layer for the converted In3 company profile.
 *
 * The original template was written with semantic elements as direct children.
 * Elementor adds a widget/container wrapper around each of those elements and
 * also supplies 10px container padding.  These rules neutralise only that
 * generated chrome while leaving the original design classes editable.
 */

html:has(body.in3-elementor-home) {
    font-size: 17px;
}

body.in3-elementor-home {
    font-family: "Space Grotesk", sans-serif;
    padding-top: 0;
}

body.in3-elementor-home h1,
body.in3-elementor-home h2,
body.in3-elementor-home h3,
body.in3-elementor-home h4,
body.in3-elementor-home h5,
body.in3-elementor-home h6 {
    font-family: "Space Grotesk", serif;
}

body.in3-elementor-home .elementor-element {
    --widgets-spacing: 0px;
}

body.in3-elementor-home .elementor-widget {
    margin-block-end: 0;
}

/* Keep the scroll progress indicator as thin as it is in the PHP template.
 * Elementor converts it into a container and otherwise adds 10px padding. */
body.in3-elementor-home .site-progress.elementor-element {
    display: block;
    height: 3px;
    min-height: 0;
    padding: 0;
}

/* Do not let the logged-in WordPress admin bar cover the indicator. */
body.admin-bar.in3-elementor-home .site-progress.elementor-element {
    top: 32px;
}

body.admin-bar.in3-elementor-home .in3-main-navbar {
    top: 32px !important;
}

@media (max-width: 782px) {
    body.admin-bar.in3-elementor-home .site-progress.elementor-element {
        top: 46px;
    }

    body.admin-bar.in3-elementor-home .in3-main-navbar {
        top: 46px !important;
    }
}

body.in3-elementor-home .footer-grid > .e-con {
    padding: 0;
}

body.in3-elementor-home .footer-grid > .footer-brand-col {
    padding-right: 2rem;
}

body.in3-elementor-home .footer-copyright {
    padding: 3rem 0 0;
}

/* Match the theme's effective Bootstrap container used by the PHP page. */
body.in3-elementor-home .container {
    max-width: 1140px;
    padding-right: .75rem;
    padding-left: .75rem;
}

body.in3-elementor-home .nav-links {
    padding-left: 0;
}

/* Elementor renders HTML widgets as `display: contents`. In the navigation
 * that flattens the logo and every menu item into the same flex row, leaving
 * the first link flush against the company name. Restore the two intended
 * flex items: logo on the left and navigation on the right. */
body.in3-elementor-home .nav-container > .elementor-widget-html.logo,
body.in3-elementor-home .nav-container > .elementor-widget-html.nav-links {
    display: block;
    min-width: 0;
}

body.in3-elementor-home .nav-container > .elementor-widget-html.logo {
    flex: 0 0 auto;
}

body.in3-elementor-home .nav-container > .elementor-widget-html.nav-links {
    flex: 0 1 auto;
    margin-left: 2rem;
}

body.in3-elementor-home .nav-container {
    width: 100%;
    max-width: none;
    padding-right: clamp(1.5rem, 4vw, 4rem);
    padding-left: clamp(1.5rem, 4vw, 4rem);
}

/* Keep the full desktop navigation readable on laptop-sized viewports. */
@media (min-width: 769px) and (max-width: 1200px) {
    body.in3-elementor-home .logo-img-small {
        width: 40px;
        height: 40px;
    }

    body.in3-elementor-home .logo-title {
        font-size: .78rem;
    }

    body.in3-elementor-home .logo-subtitle {
        font-size: .48rem;
    }

    body.in3-elementor-home .nav-container > .elementor-widget-html.nav-links {
        margin-left: 1.5rem;
    }

    body.in3-elementor-home ul.nav-links {
        gap: .65rem;
    }

    body.in3-elementor-home ul.nav-links a:not(.btn),
    body.in3-elementor-home ul.nav-links .btn {
        font-size: .72rem;
    }

    body.in3-elementor-home ul.nav-links .btn {
        padding: .55rem .8rem;
    }

    body.in3-elementor-home .in3-language-switcher,
    body.in3-elementor-home .in3-language-menu > summary {
        min-width: 68px;
    }

    body.in3-elementor-home .in3-language-menu > summary {
        height: 36px;
        padding: 0 .6rem;
    }
}

@media (max-width: 768px) {
    body.in3-elementor-home .nav-container > .elementor-widget-html.nav-links {
        display: contents;
        margin-left: 0;
    }
}

@media (min-width: 993px) {
    body.in3-elementor-home .in3-language-menu {
        min-width: 115px;
    }

    body.in3-elementor-home .footer-grid {
        min-height: 322px;
    }

    body.in3-elementor-home .roadmap-diagram > .road-step {
        min-height: 430px;
    }
}

/* Elementor's default container padding must not become part of the design. */
body.in3-elementor-home #home,
body.in3-elementor-home .pillars-grid,
body.in3-elementor-home .vision-mission-grid,
body.in3-elementor-home .principles-grid,
body.in3-elementor-home .expertise-grid,
body.in3-elementor-home .solutions-grid,
body.in3-elementor-home .workflow-steps,
body.in3-elementor-home .principal-grid,
body.in3-elementor-home .industries-grid,
body.in3-elementor-home .applications-grid,
body.in3-elementor-home .architecture-stack,
body.in3-elementor-home .services-grid,
body.in3-elementor-home .reasons-grid,
body.in3-elementor-home .quality-grid,
body.in3-elementor-home .framework-grid,
body.in3-elementor-home .lifecycle-steps,
body.in3-elementor-home .footer-grid,
body.in3-elementor-home .section-header,
body.in3-elementor-home .fw-header,
body.in3-elementor-home .service-header,
body.in3-elementor-home .principle-header,
body.in3-elementor-home .in3-story-brand,
body.in3-elementor-home .inquiry-direct,
body.in3-elementor-home .step-icon,
body.in3-elementor-home .step-num,
body.in3-elementor-home .step-title {
    padding: 0;
}

/* Restore layouts whose direction is otherwise replaced by Elementor vars. */
body.in3-elementor-home .nav-container,
body.in3-elementor-home .workflow-steps,
body.in3-elementor-home .lifecycle-steps,
body.in3-elementor-home .footer-links,
body.in3-elementor-home .partnership-flow,
body.in3-elementor-home .section-header,
body.in3-elementor-home .principle-header,
body.in3-elementor-home .fw-header,
body.in3-elementor-home .service-header,
body.in3-elementor-home .roadmap-diagram,
body.in3-elementor-home .arch-layer,
body.in3-elementor-home .in3-hero-actions,
body.in3-elementor-home .in3-hero-proof,
body.in3-elementor-home .in3-story-brand,
body.in3-elementor-home .inquiry-direct {
    flex-direction: row;
}

/* Product-story articles are block cards in the PHP template. Elementor
 * converts them to flex containers, so restore their vertical reading flow. */
body.in3-elementor-home .in3-product-story {
    display: block;
}

body.in3-elementor-home .workflow-steps > .step,
body.in3-elementor-home .lifecycle-steps > .step {
    flex: 1 1 0;
    width: auto;
}

body.in3-elementor-home .lifecycle-steps {
    padding: 3rem;
}

body.in3-elementor-home .lifecycle-steps > .life-step {
    display: block;
    flex: 1 1 0;
    width: auto;
    padding: 0;
}

body.in3-elementor-home .lifecycle-steps .life-step .elementor-heading-title {
    line-height: 40px;
}

body.in3-elementor-home .workflow-steps > .step {
    display: block;
}

body.in3-elementor-home .workflow-steps .step-icon,
body.in3-elementor-home .workflow-steps .step-title {
    display: block;
}

body.in3-elementor-home .workflow-steps .step-num {
    display: block;
    width: auto;
    min-width: 0;
}

body.in3-elementor-home .workflow-steps .step-num > .elementor-widget-text-editor,
body.in3-elementor-home .workflow-steps .step-title > .elementor-widget-text-editor {
    display: inline;
    width: auto;
}

body.in3-elementor-home .architecture-diagram .layer-num {
    display: block;
    width: auto;
    min-width: 0;
    padding: 0;
}

body.in3-elementor-home .architecture-diagram .layer-num > .elementor-widget-text-editor {
    display: inline;
    width: auto;
}

body.in3-elementor-home .architecture-diagram .layer-content {
    display: block;
    flex: 0 1 auto;
    width: auto;
    min-width: 0;
    padding: 0;
}

body.in3-elementor-home .architecture-diagram .layer-content .elementor-heading-title {
    line-height: 40px;
}

body.in3-elementor-home .roadmap-diagram > .road-step {
    display: block;
    flex: 1 1 0;
    width: auto;
}

body.in3-elementor-home .roadmap-diagram .road-num {
    display: block;
    width: auto;
    min-width: 0;
    padding: 0;
}

body.in3-elementor-home .roadmap-diagram .road-num > .elementor-widget-text-editor {
    display: inline;
    width: auto;
}

body.in3-elementor-home .roadmap-diagram .road-step .elementor-heading-title {
    line-height: 40px;
}

body.in3-elementor-home .roadmap-diagram .road-step li:last-child {
    margin-bottom: 0;
}

/* The source cards are block layouts. Elementor's flex wrapper stretched the
 * inline icon background into a wide rectangle instead of the original tile. */
body.in3-elementor-home .pillar-card,
body.in3-elementor-home .principle-card,
body.in3-elementor-home .expertise-card,
body.in3-elementor-home .solution-card,
body.in3-elementor-home .service-card,
body.in3-elementor-home .reason-card,
body.in3-elementor-home .fw-card {
    display: block;
}

body.in3-elementor-home .expertise-card > i,
body.in3-elementor-home .solution-card > i {
    display: inline-block;
    width: auto;
}

body.in3-elementor-home .expertise-card .elementor-heading-title,
body.in3-elementor-home .solution-card .elementor-heading-title,
body.in3-elementor-home .principle-card .elementor-heading-title,
body.in3-elementor-home .service-card .elementor-heading-title,
body.in3-elementor-home .reason-card .elementor-heading-title,
body.in3-elementor-home .fw-card .elementor-heading-title,
body.in3-elementor-home .industry-card .elementor-heading-title {
    line-height: 40px;
}

body.in3-elementor-home .pillar-card .elementor-heading-title {
    line-height: 50px;
}

/*
 * HTML widgets contain the original element verbatim.  Removing only the
 * generated outer box restores direct-child grid/flex behaviour and prevents
 * duplicated class styling (notably icons, navigation and lists).
 */
body.in3-elementor-home .elementor-widget-html {
    display: contents;
}

body.in3-elementor-home .elementor-widget-html::before,
body.in3-elementor-home .elementor-widget-html::after {
    content: none !important;
}

/* Transfer non-inherited design roles from heading widgets to their H tags. */
body.in3-elementor-home .elementor-widget-heading.section-title > .elementor-heading-title,
body.in3-elementor-home .elementor-widget-heading.red-title > .elementor-heading-title {
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    line-height: inherit;
    margin: 0;
}

body.in3-elementor-home .elementor-widget-heading.section-title > .elementor-heading-title {
    color: var(--c-navy-dark);
}

body.in3-elementor-home .elementor-widget-heading.red-title > .elementor-heading-title {
    color: var(--c-red);
    text-transform: inherit;
}

body.in3-elementor-home .elementor-widget-heading.brand-name {
    margin: 0 0 .5rem;
}

body.in3-elementor-home .elementor-widget-heading.brand-name > .elementor-heading-title {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    line-height: inherit;
    margin: 0;
}

body.in3-elementor-home .logo-img-medium {
    flex: none;
    width: 80px;
    height: 80px;
    padding: 0;
}

body.in3-elementor-home .section-header > .elementor-widget-heading.section-title,
body.in3-elementor-home .section-header > .elementor-widget-heading.section-title > .elementor-heading-title {
    width: auto;
    flex: 0 1 auto;
}

@media (max-width: 992px) {
    body.in3-elementor-home .workflow-steps,
    body.in3-elementor-home .lifecycle-steps {
        flex-direction: column;
    }
}
