/* =========================================================
   2CAN PRODUCTION
   ========================================================= */

:root {
    --production-accent: #3D8BFF;
    --production-purple: #A45CFF;
}


/* =========================================================
   HERO
   ========================================================= */

.production-hero {
    position: relative;

    min-height: 100vh;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding:
        150px
        max(5vw, 35px)
        45px;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 78% 42%,
            rgba(61, 139, 255, .09),
            transparent 27%
        ),
        radial-gradient(
            circle at 20% 70%,
            rgba(164, 92, 255, .035),
            transparent 25%
        ),
        #070709;
}


/* GRID BACKGROUND */

.production-hero::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}


/* BLUE GLOW */

.production-hero::after {
    content: "";

    position: absolute;

    width: 600px;
    height: 600px;

    right: -240px;
    top: 18%;

    border-radius: 50%;

    pointer-events: none;

    background:
        rgba(61, 139, 255, .045);

    filter: blur(100px);
}


/* =========================================================
   GRID
   ========================================================= */

.production-hero__grid {
    position: relative;
    z-index: 2;

    width: min(1500px, 100%);

    margin: auto;

    display: grid;

    grid-template-columns:
        minmax(0, .95fr)
        minmax(500px, 1.05fr);

    gap: clamp(70px, 8vw, 140px);

    align-items: center;
}


/* =========================================================
   CONTENT
   ========================================================= */

.production-hero__content {
    max-width: 760px;
}


/* EYEBROW */

.production-hero__eyebrow {
    display: flex;
    align-items: center;

    gap: 13px;

    margin-bottom: 31px;

    color: #62626c;

    font-size: 7px;
    font-weight: 700;

    letter-spacing: .17em;
}

.production-hero__eyebrow span:first-child {
    color: var(--production-accent);
}

.production-hero__eyebrow i {
    width: 35px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            var(--production-accent),
            rgba(61, 139, 255, .1)
        );
}


/* =========================================================
   TITLE
   ========================================================= */

.production-hero__title {
    margin: 0;

    font-size: clamp(55px, 5.6vw, 92px);
    font-weight: 500;

    line-height: .94;
    letter-spacing: -.065em;
}

.production-hero__title > span {
    display: block;

    color: #f0f0f3;
}

.production-hero__title > strong {
    display: block;

    margin-top: 10px;

    color: var(--production-accent);

    font-weight: 500;
}


/* =========================================================
   LEAD
   ========================================================= */

.production-hero__lead {
    max-width: 680px;

    margin: 34px 0 0;

    color: #898992;

    font-size: 16px;
    line-height: 1.72;
}


/* STATEMENT */

.production-hero__statement {
    margin: 22px 0 0;

    color: #686871;

    font-size: 12px;
}

.production-hero__statement strong {
    color: #b6b6bd;

    font-weight: 500;
}


/* =========================================================
   BUTTONS
   ========================================================= */

.production-hero__actions {
    display: flex;
    flex-wrap: wrap;

    gap: 10px;

    margin-top: 36px;
}

.production-button {
    min-height: 53px;

    display: inline-flex;
    align-items: center;
    justify-content: space-between;

    gap: 28px;

    padding: 0 19px;

    font-size: 6px;
    font-weight: 700;

    letter-spacing: .14em;

    text-decoration: none;

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease;
}

.production-button span {
    font-size: 13px;
}


/* PRIMARY */

.production-button--primary {
    min-width: 230px;

    color: #06070a;

    border: 1px solid var(--production-accent);

    background: var(--production-accent);
}

.production-button--primary:hover {
    color: var(--production-accent);

    background: transparent;
}


/* SECONDARY */

.production-button--secondary {
    min-width: 245px;

    color: #8c8c95;

    border: 1px solid rgba(255, 255, 255, .11);

    background: rgba(255, 255, 255, .015);
}

.production-button--secondary:hover {
    color: #d0d0d6;

    border-color: rgba(61, 139, 255, .35);
}


/* =========================================================
   TAGS
   ========================================================= */

.production-hero__tags {
    display: flex;
    flex-wrap: wrap;

    gap: 7px;

    margin-top: 33px;
}

.production-hero__tags span {
    padding: 6px 8px;

    border: 1px solid rgba(255, 255, 255, .07);

    color: #505059;

    font-size: 5px;
    font-weight: 700;

    letter-spacing: .13em;
}


/* =========================================================
   SYSTEM VISUAL
   ========================================================= */

.production-hero__visual {
    position: relative;
}

.production-system {
    position: relative;

    border: 1px solid rgba(255, 255, 255, .095);

    background:
        rgba(5, 5, 8, .78);

    box-shadow:
        0 40px 100px rgba(0, 0, 0, .25);
}


/* =========================================================
   SYSTEM HEADER
   ========================================================= */

.production-system__header {
    min-height: 58px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 0 20px;

    border-bottom: 1px solid rgba(255, 255, 255, .075);

    color: #494951;

    font-size: 6px;
    font-weight: 700;

    letter-spacing: .15em;
}

.production-system__header > div {
    display: flex;
    align-items: center;

    gap: 8px;
}

.production-system__header i,
.production-system__footer i {
    width: 5px;
    height: 5px;

    display: block;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .7);
}


/* =========================================================
   WORKSPACE
   ========================================================= */

.production-system__workspace {
    position: relative;

    padding: 35px;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        );

    background-size: 30px 30px;
}


/* =========================================================
   NODES
   ========================================================= */

.production-system__source {
    min-height: 115px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .08);

    background: #08080b;
}

.production-system__node-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 22px;

    color: #494952;

    font-size: 6px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-system__node-head i {
    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: #505059;
}

.production-system__source > strong {
    color: #a5a5ad;

    font-size: 18px;
    font-weight: 500;

    letter-spacing: -.02em;
}

.production-system__source > small {
    margin-top: 6px;

    color: #46464e;

    font-size: 5px;
    font-weight: 700;

    letter-spacing: .13em;
}


/* PRODUCTION NODE */

.production-system__source--production {
    border-color: rgba(61, 139, 255, .16);

    background:
        radial-gradient(
            circle at 80% 30%,
            rgba(61, 139, 255, .055),
            transparent 40%
        ),
        #08080b;
}

.production-system__source--production
.production-system__node-head i {
    background: var(--production-accent);

    box-shadow:
        0 0 9px rgba(61, 139, 255, .55);
}


/* =========================================================
   CONNECTION
   ========================================================= */

.production-system__connection {
    min-height: 63px;

    display: grid;

    grid-template-columns: 75px 1fr;

    align-items: center;

    color: #414149;

    font-size: 5px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-system__connection > div {
    position: relative;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .15),
            rgba(61, 139, 255, .65)
        );
}

.production-system__connection > div i {
    position: absolute;

    right: 0;
    top: -3px;

    width: 6px;
    height: 6px;

    border-top: 1px solid var(--production-accent);
    border-right: 1px solid var(--production-accent);

    transform: rotate(45deg);
}


/* =========================================================
   2CAN CORE
   ========================================================= */

.production-system__core {
    border: 1px solid rgba(61, 139, 255, .28);

    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(61, 139, 255, .1),
            transparent 40%
        ),
        #08080b;
}

.production-system__core-head {
    min-height: 45px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 0 17px;

    border-bottom: 1px solid rgba(61, 139, 255, .12);

    color: #555560;

    font-size: 5px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-system__core-head small {
    color: var(--production-accent);

    font: inherit;
}


/* CORE MAIN */

.production-system__core-main {
    min-height: 145px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 22px;
}

.production-system__core-main > span {
    color: #55555e;

    font-size: 6px;
    font-weight: 700;

    letter-spacing: .14em;
}

.production-system__core-main > strong {
    margin-top: 8px;

    color: var(--production-accent);

    font-size: 35px;
    font-weight: 500;

    letter-spacing: -.045em;
}

.production-system__core-main > small {
    margin-top: 9px;

    color: #4b4b54;

    font-size: 5px;
    font-weight: 700;

    letter-spacing: .13em;
}


/* CORE STATUS */

.production-system__core-status {
    min-height: 42px;

    display: flex;
    align-items: center;

    gap: 8px;

    padding: 0 18px;

    border-top: 1px solid rgba(61, 139, 255, .12);

    color: #51515a;

    font-size: 5px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-system__core-status i {
    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .7);
}


/* =========================================================
   LOWER LAYER
   ========================================================= */

.production-system__lower {
    min-height: 90px;

    display: flex;
    align-items: center;

    margin-top: 30px;

    padding: 0 18px;

    border: 1px solid rgba(255, 255, 255, .065);

    background: rgba(6, 6, 9, .75);
}

.production-system__lower > div {
    min-width: 105px;

    display: flex;
    flex-direction: column;
}

.production-system__lower small {
    color: #414149;

    font-size: 5px;
    font-weight: 700;

    letter-spacing: .12em;
}

.production-system__lower strong {
    margin-top: 7px;

    color: #777780;

    font-size: 9px;
    font-weight: 500;
}

.production-system__lower > i {
    flex: 1;

    height: 1px;

    margin: 0 12px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .25),
            rgba(164, 92, 255, .2)
        );
}


/* =========================================================
   SYSTEM FOOTER
   ========================================================= */

.production-system__footer {
    min-height: 56px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 0 20px;

    border-top: 1px solid rgba(255, 255, 255, .075);

    color: #484850;

    font-size: 6px;
    font-weight: 700;

    letter-spacing: .14em;
}

.production-system__footer > div {
    display: flex;
    align-items: center;

    gap: 8px;
}


/* =========================================================
   HERO BOTTOM
   ========================================================= */

.production-hero__bottom {
    position: relative;
    z-index: 2;

    width: min(1500px, 100%);

    display: flex;
    align-items: center;

    gap: 20px;

    margin: 75px auto 0;

    color: #3f3f47;

    font-size: 5px;
    font-weight: 700;

    letter-spacing: .15em;
}

.production-hero__bottom > div {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .35),
            rgba(255, 255, 255, .025)
        );
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

    .production-hero {
        min-height: auto;

        padding-top: 135px;
    }

    .production-hero__grid {
        grid-template-columns: 1fr;

        gap: 70px;
    }

    .production-hero__content {
        max-width: 850px;
    }

    .production-hero__visual {
        max-width: 760px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .production-hero {
        padding:
            115px
            20px
            35px;
    }

    .production-hero__eyebrow {
        font-size: 6px;
    }

    .production-hero__title {
        font-size: clamp(48px, 14vw, 66px);
    }

    .production-hero__lead {
        font-size: 14px;
    }

    .production-hero__actions {
        flex-direction: column;
    }

    .production-button {
        width: 100%;
    }

    .production-system__workspace {
        padding: 20px;
    }

    .production-system__lower {
        align-items: stretch;
        flex-direction: column;

        gap: 0;

        padding: 15px;
    }

    .production-system__lower > div {
        min-height: 60px;

        justify-content: center;
    }

    .production-system__lower > i {
        flex: none;

        width: 1px;
        height: 20px;

        margin: 0 0 0 5px;

        background:
            linear-gradient(
                to bottom,
                rgba(61, 139, 255, .3),
                rgba(164, 92, 255, .2)
            );
    }

    .production-hero__bottom {
        margin-top: 50px;
    }

}
/* =========================================================
   PRODUCTION / SHARED
   ========================================================= */

.production-section-shell {
    position: relative;
    z-index: 2;

    width: min(1500px, 90%);

    margin: 0 auto;
}

.production-section-meta {
    display: flex;
    align-items: center;

    gap: 12px;

    padding-top: 7px;

    color: #505059;

    font-size: 7px;
    font-weight: 700;
    letter-spacing: .17em;
}

.production-section-meta span {
    color: var(--production-accent);
}

.production-section-meta i {
    width: 28px;
    height: 1px;

    background: rgba(61, 139, 255, .45);
}

.production-section-meta strong {
    font: inherit;
}

.production-section-eyebrow {
    margin: 0 0 20px;

    color: var(--production-accent);

    font-size: 7px;
    font-weight: 700;
    letter-spacing: .17em;
}

/* =========================================================
   02 / PROBLEM
   ========================================================= */

.production-problem {
    position: relative;

    padding: 145px 0 135px;

    overflow: hidden;

    border-top: 1px solid rgba(255, 255, 255, .055);

    background:
        radial-gradient(
            circle at 78% 30%,
            rgba(61, 139, 255, .045),
            transparent 26%
        ),
        #08080a;
}

.production-problem::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}


/* =========================================================
   HEADER
   ========================================================= */

.production-problem__header {
    display: grid;

    grid-template-columns:
        minmax(190px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-bottom: 82px;
}

.production-problem__intro {
    max-width: 1050px;
}

.production-problem__intro h2 {
    margin: 0;

    color: #f2f2f4;

    font-size: clamp(48px, 5vw, 82px);
    font-weight: 500;

    line-height: .98;
    letter-spacing: -.055em;
}

.production-problem__intro h2 span {
    color: var(--production-accent);
}

.production-problem__intro > p:last-child {
    max-width: 780px;

    margin: 31px 0 0;

    color: #898992;

    font-size: 17px;
    line-height: 1.72;
}


/* =========================================================
   DIAGRAM
   ========================================================= */

.production-problem__diagram {
    border: 1px solid rgba(255, 255, 255, .09);

    background: rgba(5, 5, 8, .72);
}

.production-problem__diagram-head {
    min-height: 62px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 0 24px;

    border-bottom: 1px solid rgba(255, 255, 255, .075);

    color: #4c4c55;

    font-size: 7px;
    font-weight: 700;
    letter-spacing: .16em;
}

.production-problem__diagram-head > div {
    display: flex;
    align-items: center;

    gap: 9px;
}

.production-problem__diagram-head i {
    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .65);
}


/* =========================================================
   MAIN FLOW
   ========================================================= */

.production-problem__flow {
    display: grid;

    grid-template-columns:
        minmax(180px, 1fr)
        80px
        minmax(180px, 1fr)
        80px
        minmax(180px, 1fr);

    align-items: stretch;

    padding: 40px;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        );

    background-size: 32px 32px;
}


/* =========================================================
   ZONE
   ========================================================= */

.production-problem__zone {
    min-height: 290px;

    display: flex;
    flex-direction: column;

    padding: 22px;

    border: 1px solid rgba(255, 255, 255, .085);

    background: #08080b;
}

.production-problem__zone-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    color: #494952;

    font-size: 6px;
    font-weight: 700;
    letter-spacing: .14em;
}

.production-problem__zone-head span {
    color: var(--production-accent);
}

.production-problem__zone-head small {
    font: inherit;
}

.production-problem__zone-main {
    margin: auto 0;
}

.production-problem__zone-main > span {
    color: #484850;

    font-size: 6px;
    font-weight: 700;
    letter-spacing: .13em;
}

.production-problem__zone-main > strong {
    display: block;

    margin-top: 9px;

    color: #c1c1c8;

    font-size: 27px;
    font-weight: 500;

    letter-spacing: -.035em;
}

.production-problem__zone-main p {
    max-width: 260px;

    margin: 14px 0 0;

    color: #686871;

    font-size: 11px;
    line-height: 1.65;
}

.production-problem__zone-tags {
    display: flex;
    flex-wrap: wrap;

    gap: 5px;
}

.production-problem__zone-tags span {
    padding: 5px 7px;

    border: 1px solid rgba(255, 255, 255, .065);

    color: #484850;

    font-size: 5px;
    font-weight: 700;

    letter-spacing: .1em;
}


/* =========================================================
   GAP
   ========================================================= */

.production-problem__zone--gap {
    position: relative;

    border-color: rgba(61, 139, 255, .26);

    background:
        radial-gradient(
            circle at 75% 30%,
            rgba(61, 139, 255, .085),
            transparent 43%
        ),
        #08080b;
}

.production-problem__zone--gap
.production-problem__zone-main > strong {
    color: var(--production-accent);

    font-size: 45px;
}

.production-problem__gap-status {
    display: flex;
    align-items: center;

    gap: 8px;

    margin-top: 22px;

    color: var(--production-accent);

    font-size: 5px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-problem__gap-status i {
    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .65);
}


/* =========================================================
   FLOOR
   ========================================================= */

.production-problem__zone--floor {
    background:
        radial-gradient(
            circle at 80% 25%,
            rgba(164, 92, 255, .045),
            transparent 42%
        ),
        #08080b;
}


/* =========================================================
   CONNECTORS
   ========================================================= */

.production-problem__connector {
    display: flex;
    flex-direction: column;
    justify-content: center;

    gap: 12px;

    padding: 0 10px;

    color: #414149;

    font-size: 5px;
    font-weight: 700;

    text-align: center;

    letter-spacing: .1em;
}

.production-problem__connector > div {
    position: relative;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .15),
            rgba(61, 139, 255, .65)
        );
}

.production-problem__connector > div i {
    position: absolute;

    right: 0;
    top: -3px;

    width: 6px;
    height: 6px;

    border-top: 1px solid var(--production-accent);
    border-right: 1px solid var(--production-accent);

    transform: rotate(45deg);
}


/* =========================================================
   RETURN FLOW
   ========================================================= */

.production-problem__return {
    display: grid;

    grid-template-columns: 220px 1fr;

    align-items: center;

    gap: 30px;

    min-height: 110px;

    padding: 20px 40px;

    border-top: 1px solid rgba(255, 255, 255, .075);
}

.production-problem__return-label {
    display: flex;
    flex-direction: column;

    gap: 7px;
}

.production-problem__return-label span {
    color: var(--production-accent);

    font-size: 6px;
    font-weight: 700;
    letter-spacing: .14em;
}

.production-problem__return-label small {
    color: #44444c;

    font-size: 5px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-problem__return-line {
    display: flex;
    align-items: center;

    gap: 16px;

    color: #55555e;

    font-size: 6px;
    font-weight: 700;

    letter-spacing: .12em;
}

.production-problem__return-line i {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(164, 92, 255, .2),
            rgba(61, 139, 255, .5)
        );
}


/* =========================================================
   QUESTIONS
   ========================================================= */

.production-problem__questions {
    margin-top: 55px;
}

.production-problem__questions-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 16px;

    color: #494951;

    font-size: 6px;
    font-weight: 700;

    letter-spacing: .14em;
}

.production-problem__questions-meta span {
    color: var(--production-accent);
}

.production-problem__questions-meta small {
    font: inherit;
}

.production-problem__questions-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);

    gap: 1px;

    background: rgba(255, 255, 255, .07);
}

.production-problem__questions-grid article {
    min-height: 170px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    padding: 20px;

    background: #08080a;
}

.production-problem__questions-grid article > span {
    color: var(--production-accent);

    font-size: 7px;
    font-weight: 700;
}

.production-problem__questions-grid p {
    max-width: 240px;

    margin: 0;

    color: #777780;

    font-size: 14px;
    line-height: 1.5;
}

.production-problem__questions-grid strong {
    display: block;

    color: #b8b8bf;

    font-weight: 500;
}


/* =========================================================
   BRIDGE
   ========================================================= */

.production-problem__bridge {
    margin-top: 55px;

    border: 1px solid rgba(61, 139, 255, .18);

    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(61, 139, 255, .045),
            transparent 35%
        ),
        #07070a;
}

.production-problem__bridge-meta {
    min-height: 55px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 0 22px;

    border-bottom: 1px solid rgba(255, 255, 255, .07);

    color: #4c4c55;

    font-size: 6px;
    font-weight: 700;

    letter-spacing: .14em;
}

.production-problem__bridge-meta > span {
    color: var(--production-accent);
}

.production-problem__bridge-meta > div {
    display: flex;
    align-items: center;

    gap: 8px;
}

.production-problem__bridge-meta i {
    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 9px rgba(61, 139, 255, .55);
}

.production-problem__bridge-content {
    min-height: 175px;

    display: flex;
    align-items: center;

    padding: 30px 40px;
}

.production-problem__bridge-content > div {
    min-width: 180px;

    display: flex;
    flex-direction: column;
}

.production-problem__bridge-content small {
    color: #484850;

    font-size: 5px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-problem__bridge-content strong {
    margin-top: 8px;

    color: #96969f;

    font-size: 14px;
    font-weight: 500;
}

.production-problem__bridge-core {
    padding: 24px;

    border: 1px solid rgba(61, 139, 255, .25);

    background: rgba(61, 139, 255, .035);
}

.production-problem__bridge-core strong {
    color: var(--production-accent);
}

.production-problem__bridge-line {
    flex: 1;

    height: 1px;

    margin: 0 22px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .2),
            rgba(61, 139, 255, .65),
            rgba(61, 139, 255, .2)
        );
}


/* =========================================================
   STATEMENT
   ========================================================= */

.production-problem__statement {
    display: grid;

    grid-template-columns:
        minmax(200px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-top: 65px;

    padding-top: 35px;

    border-top: 1px solid rgba(255, 255, 255, .075);
}

.production-problem__statement > span {
    color: var(--production-accent);

    font-size: 7px;
    font-weight: 700;

    letter-spacing: .16em;
}

.production-problem__statement p {
    max-width: 850px;

    margin: 0;

    color: #92929b;

    font-size: clamp(20px, 2vw, 29px);
    line-height: 1.45;

    letter-spacing: -.025em;
}

.production-problem__statement strong {
    color: #d1d1d6;

    font-weight: 500;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

    .production-problem {
        padding: 110px 0;
    }

    .production-problem__header {
        grid-template-columns: 1fr;

        gap: 34px;

        margin-bottom: 60px;
    }

    .production-problem__flow {
        grid-template-columns: 1fr;

        padding: 25px;
    }

    .production-problem__zone {
        min-height: 230px;
    }

    .production-problem__connector {
        min-height: 75px;

        align-items: center;
    }

    .production-problem__connector > div {
        width: 1px;
        height: 35px;

        background:
            linear-gradient(
                to bottom,
                rgba(61, 139, 255, .15),
                rgba(61, 139, 255, .65)
            );
    }

    .production-problem__connector > div i {
        right: -3px;
        top: auto;
        bottom: 0;

        transform: rotate(135deg);
    }

    .production-problem__questions-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .production-problem__bridge-content {
        flex-direction: column;

        align-items: stretch;

        gap: 0;
    }

    .production-problem__bridge-line {
        flex: none;

        width: 1px;
        height: 35px;

        margin: 0 0 0 20px;
    }

    .production-problem__statement {
        grid-template-columns: 1fr;

        gap: 20px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .production-problem {
        padding: 90px 0 75px;
    }

    .production-problem__intro h2 {
        font-size: clamp(42px, 12vw, 58px);
    }

    .production-problem__intro > p:last-child {
        font-size: 15px;
    }

    .production-problem__diagram-head {
        padding: 0 15px;

        font-size: 6px;
    }

    .production-problem__flow {
        padding: 17px;
    }

    .production-problem__return {
        grid-template-columns: 1fr;

        gap: 20px;

        padding: 25px 18px;
    }

    .production-problem__return-line {
        overflow-x: auto;
    }

    .production-problem__return-line i {
        flex: 0 0 30px;
    }

    .production-problem__questions-grid {
        grid-template-columns: 1fr;
    }

    .production-problem__questions-grid article {
        min-height: 135px;
    }

    .production-problem__bridge-content {
        padding: 25px 18px;
    }

    .production-problem__bridge-content > div {
        min-width: 0;
    }

    .production-problem__statement {
        margin-top: 50px;
    }

}

/* =========================================================
   PRODUCTION / READABILITY PASS
   ========================================================= */

/* główne opisy */

.production-problem__intro > p:last-child {
    color: #a8a8b2;
}

.production-problem__zone-main p {
    color: #90909b;
    font-size: 13px;
    line-height: 1.7;
}


/* małe techniczne etykiety */

.production-problem__zone-head {
    color: #70707b;
}

.production-problem__zone-main > span {
    color: #6f6f79;
}

.production-problem__diagram-head {
    color: #696974;
}

.production-problem__connector {
    color: #656570;
}


/* NEXO / PRODUKCJA */

.production-problem__zone-main > strong {
    color: #dedee3;
}


/* tagi */

.production-problem__zone-tags span {
    color: #73737e;

    border-color: rgba(255, 255, 255, .11);
}


/* process gap */

.production-problem__gap-status {
    font-size: 6px;
}

.production-problem__zone--gap
.production-problem__zone-main > span {
    color: #777783;
}


/* feedback */

.production-problem__return-label small {
    color: #686873;
}

.production-problem__return-line {
    color: #74747f;
}


/* =========================================================
   QUESTIONS — ważniejsza część
   ========================================================= */

.production-problem__questions-meta {
    color: #666671;
}

.production-problem__questions-grid article {
    min-height: 145px;

    padding: 24px;
}

.production-problem__questions-grid p {
    color: #a0a0aa;

    font-size: 16px;
    line-height: 1.5;
}

.production-problem__questions-grid strong {
    margin-top: 3px;

    color: #e0e0e4;

    font-size: 17px;
}


/* =========================================================
   FINAL BRIDGE
   ========================================================= */

.production-problem__bridge-meta {
    color: #696974;
}

.production-problem__bridge-content small {
    color: #6d6d78;
}

.production-problem__bridge-content strong {
    color: #b8b8c1;

    font-size: 16px;
}

.production-problem__bridge-core strong {
    color: var(--production-accent);
}


/* trochę wyraźniejsze linie systemu */

.production-problem__bridge-line {
    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .18),
            rgba(61, 139, 255, .75),
            rgba(61, 139, 255, .18)
        );
}
/* =========================================================
   PRODUCTION / TYPOGRAPHY SCALE
   Desktop readability pass
   ========================================================= */

/* ---------------------------------------------------------
   GLOBAL TECH LABELS
   --------------------------------------------------------- */

.production-section-meta,
.production-section-eyebrow {
    font-size: 9px;
}

.production-problem__diagram-head {
    font-size: 9px;
}

.production-problem__zone-head {
    font-size: 8px;
}

.production-problem__zone-main > span {
    font-size: 8px;
}

.production-problem__connector {
    font-size: 7px;
}


/* ---------------------------------------------------------
   MAIN SYSTEM CARDS
   --------------------------------------------------------- */

.production-problem__zone-main > strong {
    font-size: 32px;
}

.production-problem__zone-main p {
    font-size: 14px;
    line-height: 1.7;
}

.production-problem__zone-tags span {
    padding: 6px 8px;

    font-size: 7px;
}


/* ---------------------------------------------------------
   PROCESS GAP
   --------------------------------------------------------- */

.production-problem__gap-status {
    font-size: 8px;
}

.production-problem__zone--gap
.production-problem__zone-main > strong {
    font-size: 52px;
}


/* ---------------------------------------------------------
   FEEDBACK
   --------------------------------------------------------- */

.production-problem__return-label span {
    font-size: 8px;
}

.production-problem__return-label small {
    font-size: 7px;
}

.production-problem__return-line {
    font-size: 8px;
}


/* ---------------------------------------------------------
   QUESTIONS
   --------------------------------------------------------- */

.production-problem__questions-meta {
    font-size: 8px;
}

.production-problem__questions-grid article > span {
    font-size: 9px;
}

.production-problem__questions-grid p {
    font-size: 17px;
    line-height: 1.5;
}

.production-problem__questions-grid strong {
    font-size: 18px;
}


/* ---------------------------------------------------------
   2CAN BRIDGE
   --------------------------------------------------------- */

.production-problem__bridge-meta {
    font-size: 8px;
}

.production-problem__bridge-content small {
    font-size: 7px;
}

.production-problem__bridge-content strong {
    font-size: 17px;
}

.production-problem__bridge-core strong {
    font-size: 18px;
}


/* ---------------------------------------------------------
   FINAL STATEMENT
   --------------------------------------------------------- */

.production-problem__statement > span {
    font-size: 9px;
}


/* =========================================================
   HERO TYPOGRAPHY FIX
   ========================================================= */

.production-hero__eyebrow {
    font-size: 9px;
}

.production-hero__statement {
    font-size: 14px;
}

.production-button {
    font-size: 9px;
}

.production-hero__tags span {
    font-size: 9px;
}

.production-system__header,
.production-system__footer {
    font-size: 9px;
}

.production-system__node-head {
    font-size: 9px;
}

.production-system__source > small {
    font-size: 9px;
}

.production-system__connection {
    font-size: 9px;
}

.production-system__core-head {
    font-size: 12px;
}

.production-system__core-main > span {
    font-size: 12px;
}

.production-system__core-main > small {
    font-size: 9px;
}

.production-system__core-status {
    font-size: 9px;
}

.production-system__lower small {
    font-size: 9px;
}

.production-system__lower strong {
    font-size: 12px;
}

.production-hero__bottom {
    font-size: 9px;
}
.production-problem__questions-grid article {
    min-height: 130px;
}

/* =========================================================
   03 / SYSTEM
   ========================================================= */

.production-system-section {
    position: relative;

    padding: 145px 0 135px;

    overflow: hidden;

    border-top: 1px solid rgba(255, 255, 255, .055);

    background:
        radial-gradient(
            circle at 48% 42%,
            rgba(61, 139, 255, .055),
            transparent 28%
        ),
        #070709;
}

.production-system-section::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}


/* =========================================================
   HEADER
   ========================================================= */

.production-system-section__header {
    display: grid;

    grid-template-columns:
        minmax(190px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-bottom: 80px;
}

.production-system-section__intro {
    max-width: 1050px;
}

.production-system-section__intro h2 {
    margin: 0;

    color: #f1f1f4;

    font-size: clamp(48px, 5vw, 82px);
    font-weight: 500;

    line-height: .98;
    letter-spacing: -.055em;
}

.production-system-section__intro h2 span {
    color: var(--production-accent);
}

.production-system-section__intro > p:last-child {
    max-width: 790px;

    margin: 31px 0 0;

    color: #a2a2ac;

    font-size: 17px;
    line-height: 1.72;
}


/* =========================================================
   ARCHITECTURE
   ========================================================= */

.production-architecture {
    border: 1px solid rgba(255, 255, 255, .09);

    background: rgba(5, 5, 8, .76);
}

.production-architecture__head {
    min-height: 62px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 0 24px;

    border-bottom: 1px solid rgba(255, 255, 255, .075);

    color: #73737d;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .14em;
}

.production-architecture__head > span {
    color: var(--production-accent);
}

.production-architecture__head > div {
    display: flex;
    align-items: center;

    gap: 9px;
}

.production-architecture__head i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .65);
}


/* =========================================================
   WORKSPACE
   ========================================================= */

.production-architecture__workspace {
    padding: 40px;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        );

    background-size: 32px 32px;
}


/* =========================================================
   LAYERS
   ========================================================= */

.production-architecture__layer {
    padding: 26px;

    border: 1px solid rgba(255, 255, 255, .085);

    background: #08080b;
}

.production-architecture__layer-meta {
    display: flex;
    align-items: center;

    gap: 15px;

    margin-bottom: 26px;
}

.production-architecture__layer-meta > span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
}

.production-architecture__layer-meta > div {
    display: flex;
    flex-direction: column;

    gap: 5px;
}

.production-architecture__layer-meta small {
    color: #696974;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__layer-meta strong {
    color: #c4c4cb;

    font-size: 17px;
    font-weight: 500;
}


/* =========================================================
   BUSINESS
   ========================================================= */

.production-architecture__business {
    display: grid;

    grid-template-columns:
        minmax(220px, .75fr)
        minmax(0, 1.25fr);

    gap: 18px;
}

.production-architecture__nexo {
    min-height: 155px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 24px;

    border: 1px solid rgba(61, 139, 255, .16);

    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(61, 139, 255, .055),
            transparent 42%
        ),
        #07070a;
}

.production-architecture__nexo small {
    color: #70707a;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__nexo strong {
    margin-top: 9px;

    color: #e0e0e5;

    font-size: 32px;
    font-weight: 500;
}

.production-architecture__nexo span {
    margin-top: 8px;

    color: #74747f;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .12em;
}


/* BUSINESS DATA */

.production-architecture__business-data {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 1px;

    background: rgba(255, 255, 255, .07);
}

.production-architecture__business-data > div {
    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 22px;

    background: #09090c;
}

.production-architecture__business-data small {
    color: #696974;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .12em;
}

.production-architecture__business-data strong {
    margin-top: 9px;

    color: #b2b2bb;

    font-size: 17px;
    font-weight: 500;
}


/* =========================================================
   VERTICAL FLOW
   ========================================================= */

.production-architecture__vertical-flow {
    min-height: 95px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 11px;

    color: #74747e;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__vertical-flow > div {
    position: relative;

    width: 1px;
    height: 37px;

    background:
        linear-gradient(
            to bottom,
            rgba(61, 139, 255, .2),
            rgba(61, 139, 255, .75)
        );
}

.production-architecture__vertical-flow > div i {
    position: absolute;

    left: -3px;
    bottom: 0;

    width: 7px;
    height: 7px;

    border-right: 1px solid var(--production-accent);
    border-bottom: 1px solid var(--production-accent);

    transform: rotate(45deg);
}


/* =========================================================
   CORE
   ========================================================= */

.production-architecture__core {
    padding: 27px;

    border: 1px solid rgba(61, 139, 255, .28);

    background:
        radial-gradient(
            circle at 50% 35%,
            rgba(61, 139, 255, .075),
            transparent 35%
        ),
        #07070a;
}

.production-architecture__core-meta {
    display: flex;
    align-items: center;

    gap: 15px;

    margin-bottom: 30px;
}

.production-architecture__core-meta > span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
}

.production-architecture__core-meta > div {
    display: flex;
    flex-direction: column;

    gap: 5px;
}

.production-architecture__core-meta small {
    color: #72727d;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__core-meta strong {
    color: var(--production-accent);

    font-size: 17px;
    font-weight: 500;
}


/* =========================================================
   CORE SYSTEM
   ========================================================= */

.production-architecture__core-system {
    display: grid;

    grid-template-columns:
        minmax(150px, .75fr)
        minmax(50px, .35fr)
        minmax(280px, 1.25fr)
        minmax(50px, .35fr)
        minmax(150px, .75fr);

    align-items: center;

    gap: 12px;
}

.production-architecture__core-side {
    display: flex;
    flex-direction: column;

    padding: 20px;
}

.production-architecture__core-side small {
    color: #70707b;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__core-side strong {
    margin-top: 8px;

    color: #c2c2c9;

    font-size: 17px;
    font-weight: 500;
}

.production-architecture__core-side span {
    margin-top: 6px;

    color: #696974;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .11em;
}


/* CORE LINES */

.production-architecture__core-line {
    position: relative;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .2),
            rgba(61, 139, 255, .75)
        );
}

.production-architecture__core-line i {
    position: absolute;

    right: 0;
    top: -3px;

    width: 7px;
    height: 7px;

    border-top: 1px solid var(--production-accent);
    border-right: 1px solid var(--production-accent);

    transform: rotate(45deg);
}


/* =========================================================
   ENGINE
   ========================================================= */

.production-architecture__engine {
    min-height: 230px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 27px;

    border: 1px solid rgba(61, 139, 255, .28);

    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(61, 139, 255, .11),
            transparent 45%
        ),
        #08080c;
}

.production-architecture__engine-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 24px;
}

.production-architecture__engine-head span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;

    letter-spacing: .15em;
}

.production-architecture__engine-head i {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 12px rgba(61, 139, 255, .75);
}

.production-architecture__engine > small {
    color: #73737e;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__engine > strong {
    margin-top: 8px;

    color: var(--production-accent);

    font-size: 31px;
    font-weight: 500;

    letter-spacing: -.035em;
}

.production-architecture__engine p {
    max-width: 310px;

    margin: 13px 0 0;

    color: #92929c;

    font-size: 13px;
    line-height: 1.65;
}

.production-architecture__engine-status {
    display: flex;
    align-items: center;

    gap: 8px;

    margin-top: 23px;

    color: #767681;

    font-size: 8px;
    font-weight: 700;

    letter-spacing: .12em;
}

.production-architecture__engine-status i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .7);
}


/* =========================================================
   FUNCTIONS
   ========================================================= */

.production-architecture__functions {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1px;

    margin-top: 28px;

    background: rgba(61, 139, 255, .14);
}

.production-architecture__functions > div {
    min-height: 105px;

    display: grid;

    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;

    column-gap: 14px;

    align-content: center;

    padding: 20px;

    background: #08080b;
}

.production-architecture__functions span {
    grid-row: 1 / 3;

    color: var(--production-accent);

    font-size: 12px;
    font-weight: 700;
}

.production-architecture__functions small {
    color: #696974;

    font-size: 12px ;
    font-weight: 700;

    letter-spacing: .12em;
}

.production-architecture__functions strong {
    margin-top: 5px;

    color: #bcbcc4;

    font-size: 14px;
    font-weight: 500;
}


/* =========================================================
   SHOP FLOOR
   ========================================================= */

.production-architecture__floor-grid {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1px;

    background: rgba(255, 255, 255, .07);
}

.production-architecture__floor-grid article {
    min-height: 150px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 22px;

    background: #09090c;
}

.production-architecture__floor-grid small {
    color: #70707a;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .12em;
}

.production-architecture__floor-grid strong {
    margin-top: 9px;

    color: #c5c5cc;

    font-size: 17px;
    font-weight: 500;
}

.production-architecture__floor-grid span {
    margin-top: 8px;

    color: #666671;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .11em;
}


/* =========================================================
   FEEDBACK
   ========================================================= */

.production-architecture__feedback {
    display: grid;

    grid-template-columns: 330px 1fr;

    gap: 45px;

    align-items: center;

    margin-top: 35px;

    padding: 27px;

    border: 1px solid rgba(164, 92, 255, .13);

    background:
        rgba(164, 92, 255, .018);
}

.production-architecture__feedback > div:first-child {
    display: flex;
    flex-direction: column;

    gap: 7px;
}

.production-architecture__feedback small {
    color: var(--production-purple);

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__feedback strong {
    color: #bcbcc5;

    font-size: 17px;
    font-weight: 500;
}

.production-architecture__feedback-flow {
    display: flex;
    align-items: center;

    gap: 12px;

    color: #777782;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .1em;
}

.production-architecture__feedback-flow i {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(164, 92, 255, .25),
            rgba(61, 139, 255, .55)
        );
}

.production-architecture__feedback-flow strong {
    color: #d0d0d5;

    font-size: 12px;
    font-weight: 700;
}


/* =========================================================
   FINAL FLOW
   ========================================================= */

.production-system-section__flow {
    min-height: 95px;

    display: flex;
    align-items: center;

    gap: 20px;

    margin-top: 45px;

    padding: 0 27px;

    border: 1px solid rgba(255, 255, 255, .075);

    background: rgba(6, 6, 9, .65);

    color: #91919b;

    font-size: 10px;
    font-weight: 700;

    letter-spacing: .12em;
}

.production-system-section__flow strong {
    color: var(--production-accent);

    font: inherit;
}

.production-system-section__flow i {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .2),
            rgba(61, 139, 255, .65)
        );
}


/* =========================================================
   STATEMENT
   ========================================================= */

.production-system-section__statement {
    display: grid;

    grid-template-columns:
        minmax(200px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-top: 65px;

    padding-top: 35px;

    border-top: 1px solid rgba(255, 255, 255, .075);
}

.production-system-section__statement > span {
    color: var(--production-accent);

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .15em;
}

.production-system-section__statement p {
    max-width: 900px;

    margin: 0;

    color: #9898a2;

    font-size: clamp(20px, 2vw, 29px);
    line-height: 1.48;

    letter-spacing: -.025em;
}

.production-system-section__statement strong {
    color: #d2d2d7;

    font-weight: 500;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

    .production-system-section {
        padding: 110px 0;
    }

    .production-system-section__header {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-architecture__business {
        grid-template-columns: 1fr;
    }

    .production-architecture__core-system {
        grid-template-columns: 1fr;
    }

    .production-architecture__core-line {
        width: 1px;
        height: 35px;

        margin-left: 30px;
    }

    .production-architecture__core-line i {
        top: auto;
        right: -3px;
        bottom: 0;

        transform: rotate(135deg);
    }

    .production-architecture__functions,
    .production-architecture__floor-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .production-architecture__feedback {
        grid-template-columns: 1fr;
    }

    .production-system-section__statement {
        grid-template-columns: 1fr;

        gap: 20px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .production-system-section {
        padding: 90px 0 75px;
    }

    .production-system-section__intro h2 {
        font-size: clamp(42px, 12vw, 58px);
    }

    .production-system-section__intro > p:last-child {
        font-size: 15px;
    }

    .production-architecture__workspace {
        padding: 17px;
    }

    .production-architecture__business-data {
        grid-template-columns: 1fr;
    }

    .production-architecture__business-data > div {
        min-height: 90px;
    }

    .production-architecture__core {
        padding: 18px;
    }

    .production-architecture__functions,
    .production-architecture__floor-grid {
        grid-template-columns: 1fr;
    }

    .production-architecture__functions > div {
        min-height: 90px;
    }

    .production-architecture__floor-grid article {
        min-height: 115px;
    }

    .production-architecture__feedback {
        gap: 25px;

        padding: 20px;
    }

    .production-architecture__feedback-flow {
        align-items: flex-start;
        flex-direction: column;
    }

    .production-architecture__feedback-flow i {
        flex: none;

        width: 1px;
        height: 20px;

        margin-left: 4px;
    }

    .production-system-section__flow {
        align-items: flex-start;
        flex-direction: column;

        gap: 10px;

        padding: 22px;
    }

    .production-system-section__flow i {
        flex: none;

        width: 1px;
        height: 18px;

        margin-left: 4px;
    }

}

/* =========================================================
   03 / SYSTEM
   ========================================================= */

.production-system-section {
    position: relative;

    padding: 145px 0 135px;

    overflow: hidden;

    border-top: 1px solid rgba(255, 255, 255, .055);

    background:
        radial-gradient(
            circle at 48% 42%,
            rgba(61, 139, 255, .055),
            transparent 28%
        ),
        #070709;
}

.production-system-section::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}


/* =========================================================
   HEADER
   ========================================================= */

.production-system-section__header {
    display: grid;

    grid-template-columns:
        minmax(190px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-bottom: 80px;
}

.production-system-section__intro {
    max-width: 1050px;
}

.production-system-section__intro h2 {
    margin: 0;

    color: #f1f1f4;

    font-size: clamp(48px, 5vw, 82px);
    font-weight: 500;

    line-height: .98;
    letter-spacing: -.055em;
}

.production-system-section__intro h2 span {
    color: var(--production-accent);
}

.production-system-section__intro > p:last-child {
    max-width: 790px;

    margin: 31px 0 0;

    color: #a2a2ac;

    font-size: 17px;
    line-height: 1.72;
}


/* =========================================================
   ARCHITECTURE
   ========================================================= */

.production-architecture {
    border: 1px solid rgba(255, 255, 255, .09);

    background: rgba(5, 5, 8, .76);
}

.production-architecture__head {
    min-height: 62px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 0 24px;

    border-bottom: 1px solid rgba(255, 255, 255, .075);

    color: #73737d;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: .14em;
}

.production-architecture__head > span {
    color: var(--production-accent);
}

.production-architecture__head > div {
    display: flex;
    align-items: center;

    gap: 9px;
}

.production-architecture__head i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .65);
}


/* =========================================================
   WORKSPACE
   ========================================================= */

.production-architecture__workspace {
    padding: 40px;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        );

    background-size: 32px 32px;
}


/* =========================================================
   LAYERS
   ========================================================= */

.production-architecture__layer {
    padding: 26px;

    border: 1px solid rgba(255, 255, 255, .085);

    background: #08080b;
}

.production-architecture__layer-meta {
    display: flex;
    align-items: center;

    gap: 15px;

    margin-bottom: 26px;
}

.production-architecture__layer-meta > span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
}

.production-architecture__layer-meta > div {
    display: flex;
    flex-direction: column;

    gap: 5px;
}

.production-architecture__layer-meta small {
    color: #696974;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__layer-meta strong {
    color: #c4c4cb;

    font-size: 15px;
    font-weight: 500;
}


/* =========================================================
   BUSINESS
   ========================================================= */

.production-architecture__business {
    display: grid;

    grid-template-columns:
        minmax(220px, .75fr)
        minmax(0, 1.25fr);

    gap: 18px;
}

.production-architecture__nexo {
    min-height: 155px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 24px;

    border: 1px solid rgba(61, 139, 255, .16);

    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(61, 139, 255, .055),
            transparent 42%
        ),
        #07070a;
}

.production-architecture__nexo small {
    color: #70707a;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__nexo strong {
    margin-top: 9px;

    color: #e0e0e5;

    font-size: 32px;
    font-weight: 500;
}

.production-architecture__nexo span {
    margin-top: 8px;

    color: #74747f;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .12em;
}


/* BUSINESS DATA */

.production-architecture__business-data {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 1px;

    background: rgba(255, 255, 255, .07);
}

.production-architecture__business-data > div {
    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 22px;

    background: #09090c;
}

.production-architecture__business-data small {
    color: #696974;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .12em;
}

.production-architecture__business-data strong {
    margin-top: 9px;

    color: #b2b2bb;

    font-size: 15px;
    font-weight: 500;
}


/* =========================================================
   VERTICAL FLOW
   ========================================================= */

.production-architecture__vertical-flow {
    min-height: 95px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 11px;

    color: #74747e;

    font-size: 8px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__vertical-flow > div {
    position: relative;

    width: 1px;
    height: 37px;

    background:
        linear-gradient(
            to bottom,
            rgba(61, 139, 255, .2),
            rgba(61, 139, 255, .75)
        );
}

.production-architecture__vertical-flow > div i {
    position: absolute;

    left: -3px;
    bottom: 0;

    width: 7px;
    height: 7px;

    border-right: 1px solid var(--production-accent);
    border-bottom: 1px solid var(--production-accent);

    transform: rotate(45deg);
}


/* =========================================================
   CORE
   ========================================================= */

.production-architecture__core {
    padding: 27px;

    border: 1px solid rgba(61, 139, 255, .28);

    background:
        radial-gradient(
            circle at 50% 35%,
            rgba(61, 139, 255, .075),
            transparent 35%
        ),
        #07070a;
}

.production-architecture__core-meta {
    display: flex;
    align-items: center;

    gap: 15px;

    margin-bottom: 30px;
}

.production-architecture__core-meta > span {
    color: var(--production-accent);

    font-size: 12px;
    font-weight: 700;
}

.production-architecture__core-meta > div {
    display: flex;
    flex-direction: column;

    gap: 5px;
}

.production-architecture__core-meta small {
    color: #72727d;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__core-meta strong {
    color: var(--production-accent);

    font-size: 16px;
    font-weight: 500;
}


/* =========================================================
   CORE SYSTEM
   ========================================================= */

.production-architecture__core-system {
    display: grid;

    grid-template-columns:
        minmax(150px, .75fr)
        minmax(50px, .35fr)
        minmax(280px, 1.25fr)
        minmax(50px, .35fr)
        minmax(150px, .75fr);

    align-items: center;

    gap: 12px;
}

.production-architecture__core-side {
    display: flex;
    flex-direction: column;

    padding: 20px;
}

.production-architecture__core-side small {
    color: #70707b;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__core-side strong {
    margin-top: 8px;

    color: #c2c2c9;

    font-size: 17px;
    font-weight: 500;
}

.production-architecture__core-side span {
    margin-top: 6px;

    color: #696974;

    font-size: 8px;
    font-weight: 700;

    letter-spacing: .11em;
}


/* CORE LINES */

.production-architecture__core-line {
    position: relative;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .2),
            rgba(61, 139, 255, .75)
        );
}

.production-architecture__core-line i {
    position: absolute;

    right: 0;
    top: -3px;

    width: 7px;
    height: 7px;

    border-top: 1px solid var(--production-accent);
    border-right: 1px solid var(--production-accent);

    transform: rotate(45deg);
}


/* =========================================================
   ENGINE
   ========================================================= */

.production-architecture__engine {
    min-height: 230px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 27px;

    border: 1px solid rgba(61, 139, 255, .28);

    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(61, 139, 255, .11),
            transparent 45%
        ),
        #08080c;
}

.production-architecture__engine-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 24px;
}

.production-architecture__engine-head span {
    color: var(--production-accent);

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .15em;
}

.production-architecture__engine-head i {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 12px rgba(61, 139, 255, .75);
}

.production-architecture__engine > small {
    color: #73737e;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__engine > strong {
    margin-top: 8px;

    color: var(--production-accent);

    font-size: 31px;
    font-weight: 500;

    letter-spacing: -.035em;
}

.production-architecture__engine p {
    max-width: 310px;

    margin: 13px 0 0;

    color: #92929c;

    font-size: 13px;
    line-height: 1.65;
}

.production-architecture__engine-status {
    display: flex;
    align-items: center;

    gap: 8px;

    margin-top: 23px;

    color: #767681;

    font-size: 8px;
    font-weight: 700;

    letter-spacing: .12em;
}

.production-architecture__engine-status i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .7);
}


/* =========================================================
   FUNCTIONS
   ========================================================= */

.production-architecture__functions {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1px;

    margin-top: 28px;

    background: rgba(61, 139, 255, .14);
}

.production-architecture__functions > div {
    min-height: 105px;

    display: grid;

    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;

    column-gap: 14px;

    align-content: center;

    padding: 20px;

    background: #08080b;
}

.production-architecture__functions span {
    grid-row: 1 / 3;

    color: var(--production-accent);

    font-size: 11px;
    font-weight: 700;
}

.production-architecture__functions small {
    color: #696974;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .12em;
}

.production-architecture__functions strong {
    margin-top: 5px;

    color: #bcbcc4;

    font-size: 14px;
    font-weight: 500;
}


/* =========================================================
   SHOP FLOOR
   ========================================================= */

.production-architecture__floor-grid {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1px;

    background: rgba(255, 255, 255, .07);
}

.production-architecture__floor-grid article {
    min-height: 150px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 22px;

    background: #09090c;
}

.production-architecture__floor-grid small {
    color: #70707a;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .12em;
}

.production-architecture__floor-grid strong {
    margin-top: 9px;

    color: #c5c5cc;

    font-size: 17px;
    font-weight: 500;
}

.production-architecture__floor-grid span {
    margin-top: 8px;

    color: #666671;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .11em;
}


/* =========================================================
   FEEDBACK
   ========================================================= */

.production-architecture__feedback {
    display: grid;

    grid-template-columns: 330px 1fr;

    gap: 45px;

    align-items: center;

    margin-top: 35px;

    padding: 27px;

    border: 1px solid rgba(164, 92, 255, .13);

    background:
        rgba(164, 92, 255, .018);
}

.production-architecture__feedback > div:first-child {
    display: flex;
    flex-direction: column;

    gap: 7px;
}

.production-architecture__feedback small {
    color: var(--production-purple);

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .13em;
}

.production-architecture__feedback strong {
    color: #bcbcc5;

    font-size: 17px;
    font-weight: 500;
}

.production-architecture__feedback-flow {
    display: flex;
    align-items: center;

    gap: 12px;

    color: #777782;

    font-size: 8px;
    font-weight: 700;

    letter-spacing: .1em;
}

.production-architecture__feedback-flow i {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(164, 92, 255, .25),
            rgba(61, 139, 255, .55)
        );
}

.production-architecture__feedback-flow strong {
    color: #d0d0d5;

    font-size: 11px;
    font-weight: 700;
}


/* =========================================================
   FINAL FLOW
   ========================================================= */

.production-system-section__flow {
    min-height: 95px;

    display: flex;
    align-items: center;

    gap: 20px;

    margin-top: 45px;

    padding: 0 27px;

    border: 1px solid rgba(255, 255, 255, .075);

    background: rgba(6, 6, 9, .65);

    color: #91919b;

    font-size: 10px;
    font-weight: 700;

    letter-spacing: .12em;
}

.production-system-section__flow strong {
    color: var(--production-accent);

    font: inherit;
}

.production-system-section__flow i {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .2),
            rgba(61, 139, 255, .65)
        );
}


/* =========================================================
   STATEMENT
   ========================================================= */

.production-system-section__statement {
    display: grid;

    grid-template-columns:
        minmax(200px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-top: 65px;

    padding-top: 35px;

    border-top: 1px solid rgba(255, 255, 255, .075);
}

.production-system-section__statement > span {
    color: var(--production-accent);

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .15em;
}

.production-system-section__statement p {
    max-width: 900px;

    margin: 0;

    color: #9898a2;

    font-size: clamp(23px, 2vw, 29px);
    line-height: 1.48;

    letter-spacing: -.025em;
}

.production-system-section__statement strong {
    color: #d2d2d7;

    font-weight: 500;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

    .production-system-section {
        padding: 110px 0;
    }

    .production-system-section__header {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-architecture__business {
        grid-template-columns: 1fr;
    }

    .production-architecture__core-system {
        grid-template-columns: 1fr;
    }

    .production-architecture__core-line {
        width: 1px;
        height: 35px;

        margin-left: 30px;
    }

    .production-architecture__core-line i {
        top: auto;
        right: -3px;
        bottom: 0;

        transform: rotate(135deg);
    }

    .production-architecture__functions,
    .production-architecture__floor-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .production-architecture__feedback {
        grid-template-columns: 1fr;
    }

    .production-system-section__statement {
        grid-template-columns: 1fr;

        gap: 20px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .production-system-section {
        padding: 90px 0 75px;
    }

    .production-system-section__intro h2 {
        font-size: clamp(42px, 12vw, 58px);
    }

    .production-system-section__intro > p:last-child {
        font-size: 17px;
    }

    .production-architecture__workspace {
        padding: 17px;
    }

    .production-architecture__business-data {
        grid-template-columns: 1fr;
    }

    .production-architecture__business-data > div {
        min-height: 90px;
    }

    .production-architecture__core {
        padding: 18px;
    }

    .production-architecture__functions,
    .production-architecture__floor-grid {
        grid-template-columns: 1fr;
    }

    .production-architecture__functions > div {
        min-height: 90px;
    }

    .production-architecture__floor-grid article {
        min-height: 115px;
    }

    .production-architecture__feedback {
        gap: 25px;

        padding: 20px;
    }

    .production-architecture__feedback-flow {
        align-items: flex-start;
        flex-direction: column;
    }

    .production-architecture__feedback-flow i {
        flex: none;

        width: 1px;
        height: 20px;

        margin-left: 4px;
    }

    .production-system-section__flow {
        align-items: flex-start;
        flex-direction: column;

        gap: 10px;

        padding: 22px;
    }

    .production-system-section__flow i {
        flex: none;

        width: 1px;
        height: 18px;

        margin-left: 4px;
    }

}

/* =========================================================
   04 / PRODUKCJA
   ========================================================= */

.production-execution {
    position: relative;

    padding: 145px 0 135px;

    overflow: hidden;

    border-top: 1px solid rgba(255, 255, 255, .055);

    background:
        radial-gradient(
            circle at 72% 42%,
            rgba(61, 139, 255, .05),
            transparent 28%
        ),
        #08080a;
}

.production-execution::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}


/* =========================================================
   HEADER
   ========================================================= */

.production-execution__header {
    display: grid;

    grid-template-columns:
        minmax(190px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-bottom: 80px;
}

.production-execution__intro {
    max-width: 1050px;
}

.production-execution__intro h2 {
    margin: 0;

    color: #f1f1f4;

    font-size: clamp(48px, 5vw, 82px);
    font-weight: 500;

    line-height: .98;
    letter-spacing: -.055em;
}

.production-execution__intro h2 span {
    color: var(--production-accent);
}

.production-execution__intro > p:last-child {
    max-width: 790px;

    margin: 31px 0 0;

    color: #a3a3ad;

    font-size: 17px;
    line-height: 1.72;
}


/* =========================================================
   ENGINE
   ========================================================= */

.production-execution__engine {
    border: 1px solid rgba(255, 255, 255, .09);

    background: rgba(5, 5, 8, .76);
}

.production-execution__engine-head {
    min-height: 64px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 0 24px;

    border-bottom: 1px solid rgba(255, 255, 255, .075);

    color: #777782;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .14em;
}

.production-execution__engine-head > span {
    color: var(--production-accent);
}

.production-execution__engine-head > div {
    display: flex;
    align-items: center;

    gap: 9px;
}

.production-execution__engine-head i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .65);
}


/* =========================================================
   WORKSPACE
   ========================================================= */

.production-execution__workspace {
    padding: 40px;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        );

    background-size: 32px 32px;
}


/* =========================================================
   START
   ========================================================= */

.production-execution__start {
    display: grid;

    grid-template-columns: 240px 1fr;

    gap: 30px;

    align-items: center;

    min-height: 120px;

    padding: 25px;

    border: 1px solid rgba(255, 255, 255, .08);

    background: #08080b;
}

.production-execution__start-meta {
    display: flex;
    flex-direction: column;

    gap: 7px;
}

.production-execution__start-meta span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
}

.production-execution__start-meta small {
    color: #74747f;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-execution__start-content {
    display: flex;
    align-items: center;

    gap: 22px;
}

.production-execution__start-content > div {
    min-width: 180px;

    display: flex;
    flex-direction: column;

    gap: 7px;
}

.production-execution__start-content small {
    color: #74747f;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-execution__start-content strong {
    color: #c8c8cf;

    font-size: 18px;
    font-weight: 500;
}

.production-execution__start-content > i {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .2),
            rgba(61, 139, 255, .7)
        );
}


/* =========================================================
   MAIN FLOW
   ========================================================= */

.production-execution__flow {
    display: grid;

    grid-template-columns:
        minmax(190px, 1fr)
        65px
        minmax(190px, 1fr)
        65px
        minmax(190px, 1fr)
        65px
        minmax(190px, 1fr);

    align-items: stretch;

    margin-top: 35px;
}


/* =========================================================
   STEP
   ========================================================= */

.production-execution__step {
    min-height: 340px;

    display: flex;
    flex-direction: column;

    padding: 23px;

    border: 1px solid rgba(255, 255, 255, .085);

    background: #08080b;
}

.production-execution__step--active {
    border-color: rgba(61, 139, 255, .3);

    background:
        radial-gradient(
            circle at 75% 25%,
            rgba(61, 139, 255, .09),
            transparent 42%
        ),
        #08080b;
}

.production-execution__step-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    color: #74747f;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .13em;
}

.production-execution__step-head span {
    color: var(--production-accent);

    font-size: 10px;
}

.production-execution__step-head small {
    font: inherit;
}


/* ICON */

.production-execution__step-icon {
    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-top: 32px;

    border: 1px solid rgba(61, 139, 255, .2);

    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;

    background: rgba(61, 139, 255, .025);
}


/* CONTENT */

.production-execution__step-content {
    margin-top: 27px;
}

.production-execution__step-content h3 {
    margin: 0;

    color: #d0d0d6;

    font-size: 22px;
    font-weight: 500;

    letter-spacing: -.025em;
}

.production-execution__step-content p {
    margin: 13px 0 0;

    color: #92929c;

    font-size: 14px;
    line-height: 1.65;
}


/* STATUS */

.production-execution__step-status {
    display: flex;
    align-items: center;

    gap: 8px;

    margin-top: auto;
    padding-top: 25px;

    color: #777782;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
}

.production-execution__step-status i {
    width: 6px;
    height: 6px;

    flex: 0 0 6px;

    border-radius: 50%;

    background: #656570;
}

.production-execution__step--active
.production-execution__step-status i {
    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .7);
}


/* =========================================================
   CONNECTORS
   ========================================================= */

.production-execution__connector {
    display: flex;
    flex-direction: column;
    justify-content: center;

    gap: 12px;

    padding: 0 9px;

    color: #70707a;

    font-size: 9px;
    font-weight: 700;
    text-align: center;

    letter-spacing: .1em;
}

.production-execution__connector > div {
    position: relative;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .18),
            rgba(61, 139, 255, .7)
        );
}

.production-execution__connector > div i {
    position: absolute;

    right: 0;
    top: -3px;

    width: 7px;
    height: 7px;

    border-top: 1px solid var(--production-accent);
    border-right: 1px solid var(--production-accent);

    transform: rotate(45deg);
}


/* =========================================================
   SHOP FLOOR
   ========================================================= */

.production-execution__floor {
    display: grid;

    grid-template-columns: 250px 1fr;

    gap: 30px;

    margin-top: 35px;

    padding: 27px;

    border: 1px solid rgba(255, 255, 255, .08);

    background:
        rgba(6, 6, 9, .8);
}

.production-execution__floor-label {
    display: flex;
    flex-direction: column;
    justify-content: center;

    gap: 8px;
}

.production-execution__floor-label span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
}

.production-execution__floor-label small {
    color: #72727d;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
}

.production-execution__floor-grid {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1px;

    background: rgba(255, 255, 255, .07);
}

.production-execution__floor-grid > div {
    min-height: 105px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 18px;

    background: #08080b;
}

.production-execution__floor-grid small {
    color: #73737e;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
}

.production-execution__floor-grid strong {
    margin-top: 8px;

    color: #bdbdc5;

    font-size: 16px;
    font-weight: 500;
}


/* =========================================================
   FEEDBACK
   ========================================================= */

.production-execution__feedback {
    display: grid;

    grid-template-columns: 240px 1fr;

    gap: 30px;

    align-items: center;

    margin-top: 20px;

    padding: 26px;

    border: 1px solid rgba(164, 92, 255, .14);

    background:
        rgba(164, 92, 255, .018);
}

.production-execution__feedback-meta {
    display: flex;
    flex-direction: column;

    gap: 7px;
}

.production-execution__feedback-meta span {
    color: var(--production-purple);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
}

.production-execution__feedback-meta small {
    color: #74747f;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
}

.production-execution__feedback-line {
    display: flex;
    align-items: center;

    gap: 15px;

    color: #80808a;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-execution__feedback-line strong {
    color: #b9b9c1;

    font: inherit;
}

.production-execution__feedback-line i {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(164, 92, 255, .25),
            rgba(61, 139, 255, .55)
        );
}


/* =========================================================
   TWO WORLDS
   ========================================================= */

.production-execution__worlds {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        150px
        minmax(0, 1fr);

    align-items: stretch;

    margin-top: 55px;
}

.production-execution__worlds > article {
    min-height: 220px;

    display: grid;

    grid-template-columns: 70px 1fr;

    gap: 20px;

    padding: 30px;

    border: 1px solid rgba(255, 255, 255, .08);

    background: #08080a;
}

.production-execution__worlds-active {
    border-color: rgba(61, 139, 255, .2) !important;

    background:
        radial-gradient(
            circle at 80% 25%,
            rgba(61, 139, 255, .06),
            transparent 40%
        ),
        #08080a !important;
}

.production-execution__world-number {
    color: var(--production-accent);

    font-size: 11px;
    font-weight: 700;
}

.production-execution__worlds small {
    color: #74747f;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .13em;
}

.production-execution__worlds h3 {
    margin: 15px 0 0;

    color: #d0d0d6;

    font-size: 23px;
    font-weight: 500;

    letter-spacing: -.025em;
}

.production-execution__worlds p {
    max-width: 420px;

    margin: 14px 0 0;

    color: #92929c;

    font-size: 14px;
    line-height: 1.65;
}


/* LINK */

.production-execution__world-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 14px;

    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .13em;
}

.production-execution__world-link i {
    width: 80px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .15),
            var(--production-accent),
            rgba(61, 139, 255, .15)
        );
}


/* =========================================================
   STATEMENT
   ========================================================= */

.production-execution__statement {
    display: grid;

    grid-template-columns:
        minmax(200px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-top: 65px;

    padding-top: 35px;

    border-top: 1px solid rgba(255, 255, 255, .075);
}

.production-execution__statement > span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .15em;
}

.production-execution__statement p {
    max-width: 900px;

    margin: 0;

    color: #9b9ba5;

    font-size: clamp(20px, 2vw, 29px);
    line-height: 1.48;

    letter-spacing: -.025em;
}

.production-execution__statement strong {
    color: #d3d3d8;

    font-weight: 500;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

    .production-execution {
        padding: 110px 0;
    }

    .production-execution__header {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-execution__flow {
        grid-template-columns: 1fr;
    }

    .production-execution__connector {
        min-height: 75px;

        align-items: center;
    }

    .production-execution__connector > div {
        width: 1px;
        height: 35px;

        background:
            linear-gradient(
                to bottom,
                rgba(61, 139, 255, .18),
                rgba(61, 139, 255, .7)
            );
    }

    .production-execution__connector > div i {
        right: -3px;
        top: auto;
        bottom: 0;

        transform: rotate(135deg);
    }

    .production-execution__floor {
        grid-template-columns: 1fr;
    }

    .production-execution__worlds {
        grid-template-columns: 1fr;
    }

    .production-execution__world-link {
        min-height: 90px;
    }

    .production-execution__world-link i {
        width: 1px;
        height: 45px;
    }

    .production-execution__statement {
        grid-template-columns: 1fr;

        gap: 20px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .production-execution {
        padding: 90px 0 75px;
    }

    .production-execution__intro h2 {
        font-size: clamp(42px, 12vw, 58px);
    }

    .production-execution__intro > p:last-child {
        font-size: 15px;
    }

    .production-execution__workspace {
        padding: 17px;
    }

    .production-execution__start {
        grid-template-columns: 1fr;
    }

    .production-execution__start-content {
        align-items: flex-start;
        flex-direction: column;
    }

    .production-execution__start-content > i {
        flex: none;

        width: 1px;
        height: 25px;

        margin-left: 4px;
    }

    .production-execution__step {
        min-height: 300px;
    }

    .production-execution__floor-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .production-execution__feedback {
        grid-template-columns: 1fr;
    }

    .production-execution__feedback-line {
        align-items: flex-start;
        flex-direction: column;
    }

    .production-execution__feedback-line i {
        flex: none;

        width: 1px;
        height: 20px;

        margin-left: 4px;
    }

    .production-execution__worlds > article {
        grid-template-columns: 45px 1fr;

        padding: 22px;
    }

}

/* =========================================================
   05 / MODULES
   ========================================================= */

.production-modules {
    position: relative;

    padding: 145px 0 135px;

    overflow: hidden;

    border-top: 1px solid rgba(255, 255, 255, .055);

    background:
        radial-gradient(
            circle at 50% 35%,
            rgba(61, 139, 255, .055),
            transparent 28%
        ),
        #070709;
}

.production-modules::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}


/* =========================================================
   HEADER
   ========================================================= */

.production-modules__header {
    display: grid;

    grid-template-columns:
        minmax(190px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-bottom: 80px;
}

.production-modules__intro {
    max-width: 1050px;
}

.production-modules__intro h2 {
    margin: 0;

    color: #f1f1f4;

    font-size: clamp(48px, 5vw, 82px);
    font-weight: 500;

    line-height: .98;
    letter-spacing: -.055em;
}

.production-modules__intro h2 span {
    color: var(--production-accent);
}

.production-modules__intro > p:last-child {
    max-width: 820px;

    margin: 31px 0 0;

    color: #a3a3ad;

    font-size: 17px;
    line-height: 1.72;
}


/* =========================================================
   PLATFORM
   ========================================================= */

.production-modules__platform {
    border: 1px solid rgba(255, 255, 255, .09);

    background: rgba(5, 5, 8, .76);
}

.production-modules__platform-head {
    min-height: 64px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 0 24px;

    border-bottom: 1px solid rgba(255, 255, 255, .075);

    color: #777782;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .14em;
}

.production-modules__platform-head > span {
    color: var(--production-accent);
}

.production-modules__platform-head > div {
    display: flex;
    align-items: center;

    gap: 9px;
}

.production-modules__platform-head i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .7);
}


/* =========================================================
   WORKSPACE
   ========================================================= */

.production-modules__workspace {
    padding: 40px;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        );

    background-size: 32px 32px;
}


/* =========================================================
   CORE
   ========================================================= */

.production-modules__core {
    display: grid;

    grid-template-columns:
        220px
        minmax(0, 1fr)
        auto;

    gap: 35px;

    align-items: center;

    min-height: 190px;

    padding: 30px;

    border: 1px solid rgba(61, 139, 255, .3);

    background:
        radial-gradient(
            circle at 55% 45%,
            rgba(61, 139, 255, .09),
            transparent 38%
        ),
        #08080c;
}

.production-modules__core-meta {
    display: flex;
    flex-direction: column;

    gap: 12px;

    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .13em;
}

.production-modules__core-meta > div {
    display: flex;
    align-items: center;

    gap: 8px;

    color: #7c7c87;

    font-size: 9px;
}

.production-modules__core-meta i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .7);
}

.production-modules__core-content small {
    color: #7b7b86;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .13em;
}

.production-modules__core-content > strong {
    display: block;

    margin-top: 8px;

    color: #e0e0e5;

    font-size: 32px;
    font-weight: 500;

    letter-spacing: -.035em;
}

.production-modules__core-content > strong span {
    color: var(--production-accent);
}

.production-modules__core-content p {
    max-width: 570px;

    margin: 13px 0 0;

    color: #9696a0;

    font-size: 14px;
    line-height: 1.65;
}

.production-modules__core-tags {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;

    gap: 7px;
}

.production-modules__core-tags span {
    padding: 7px 9px;

    border: 1px solid rgba(61, 139, 255, .18);

    color: #83838e;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}


/* =========================================================
   MODULE GRID
   ========================================================= */

.production-modules__grid {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1px;

    margin-top: 30px;

    background: rgba(255, 255, 255, .075);
}

.production-module {
    min-height: 345px;

    display: flex;
    flex-direction: column;

    padding: 24px;

    background: #08080b;
}

.production-module--primary {
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(61, 139, 255, .08),
            transparent 42%
        ),
        #08080b;
}

.production-module--transport {
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(61, 139, 255, .055),
            transparent 42%
        ),
        #08080b;
}

.production-module--data,
.production-module--integration {
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(164, 92, 255, .045),
            transparent 42%
        ),
        #08080b;
}


/* HEAD */

.production-module__head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    color: #7b7b86;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-module__head span {
    color: var(--production-accent);

    font-size: 10px;
}

.production-module__head small {
    font: inherit;
}


/* SYMBOL */

.production-module__symbol {
    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-top: 30px;

    border: 1px solid rgba(61, 139, 255, .2);

    color: var(--production-accent);

    background: rgba(61, 139, 255, .025);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
}


/* TEXT */

.production-module h3 {
    margin: 27px 0 0;

    color: #d0d0d6;

    font-size: 22px;
    font-weight: 500;

    letter-spacing: -.025em;
}

.production-module p {
    margin: 13px 0 0;

    color: #92929d;

    font-size: 14px;
    line-height: 1.65;
}


/* TAGS */

.production-module__tags {
    display: flex;
    flex-wrap: wrap;

    gap: 6px;

    margin-top: auto;
    padding-top: 25px;
}

.production-module__tags span {
    padding: 6px 8px;

    border: 1px solid rgba(255, 255, 255, .085);

    color: #797984;

    font-size: 9px;
    font-weight: 700;

    letter-spacing: .09em;
}


/* =========================================================
   CONNECTION MAP
   ========================================================= */

.production-modules__map {
    display: grid;

    grid-template-columns: 300px 1fr;

    gap: 45px;

    align-items: center;

    margin-top: 50px;

    padding: 30px;

    border: 1px solid rgba(255, 255, 255, .08);

    background: #08080a;
}

.production-modules__map-label {
    display: flex;
    flex-direction: column;

    gap: 8px;
}

.production-modules__map-label small {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .13em;
}

.production-modules__map-label strong {
    color: #bdbdc5;

    font-size: 16px;
    font-weight: 500;
    line-height: 1.45;
}

.production-modules__map-flow {
    display: flex;
    align-items: center;

    gap: 13px;

    color: #858590;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .09em;
}

.production-modules__map-flow strong {
    color: var(--production-accent);

    font: inherit;
}

.production-modules__map-flow i {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .2),
            rgba(61, 139, 255, .65)
        );
}


/* =========================================================
   DATA
   ========================================================= */

.production-modules__data {
    display: grid;

    grid-template-columns:
        170px
        minmax(0, 1fr)
        auto;

    gap: 35px;

    align-items: center;

    margin-top: 20px;

    padding: 28px 30px;

    border: 1px solid rgba(164, 92, 255, .14);

    background: rgba(164, 92, 255, .018);
}

.production-modules__data > div:first-child {
    display: flex;
    flex-direction: column;

    gap: 6px;
}

.production-modules__data small {
    color: var(--production-purple);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-modules__data > div:first-child strong {
    color: #d0d0d6;

    font-size: 18px;
    font-weight: 500;
}

.production-modules__data p {
    max-width: 720px;

    margin: 0;

    color: #9696a0;

    font-size: 14px;
    line-height: 1.65;
}

.production-modules__data p strong {
    color: #c9c9d0;

    font-weight: 500;
}

.production-modules__data-status {
    display: flex;
    align-items: center;

    gap: 8px;

    color: #858590;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-modules__data-status i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .7);
}


/* =========================================================
   STATEMENT
   ========================================================= */

.production-modules__statement {
    display: grid;

    grid-template-columns:
        minmax(200px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-top: 65px;

    padding-top: 35px;

    border-top: 1px solid rgba(255, 255, 255, .075);
}

.production-modules__statement > span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .15em;
}

.production-modules__statement p {
    max-width: 900px;

    margin: 0;

    color: #9b9ba5;

    font-size: clamp(20px, 2vw, 29px);
    line-height: 1.48;

    letter-spacing: -.025em;
}

.production-modules__statement strong {
    color: #d3d3d8;

    font-weight: 500;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

    .production-modules {
        padding: 110px 0;
    }

    .production-modules__header {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-modules__core {
        grid-template-columns: 1fr;
    }

    .production-modules__core-tags {
        justify-content: flex-start;
    }

    .production-modules__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .production-modules__map {
        grid-template-columns: 1fr;
    }

    .production-modules__data {
        grid-template-columns: 1fr;
    }

    .production-modules__statement {
        grid-template-columns: 1fr;

        gap: 20px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .production-modules {
        padding: 90px 0 75px;
    }

    .production-modules__intro h2 {
        font-size: clamp(42px, 12vw, 58px);
    }

    .production-modules__intro > p:last-child {
        font-size: 15px;
    }

    .production-modules__workspace {
        padding: 17px;
    }

    .production-modules__core {
        padding: 22px;
    }

    .production-modules__grid {
        grid-template-columns: 1fr;
    }

    .production-module {
        min-height: 315px;
    }

    .production-modules__map {
        padding: 22px;
    }

    .production-modules__map-flow {
        align-items: flex-start;
        flex-direction: column;
    }

    .production-modules__map-flow i {
        flex: none;

        width: 1px;
        height: 20px;

        margin-left: 4px;
    }

    .production-modules__data {
        padding: 22px;
    }

}

/* =========================================================
   06 / PROCESS FLOW
   ========================================================= */

.production-flow {
    position: relative;

    padding: 145px 0 135px;

    overflow: hidden;

    border-top: 1px solid rgba(255, 255, 255, .055);

    background:
        radial-gradient(
            circle at 52% 35%,
            rgba(61, 139, 255, .05),
            transparent 31%
        ),
        #060608;
}

.production-flow::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}


/* =========================================================
   HEADER
   ========================================================= */

.production-flow__header {
    display: grid;

    grid-template-columns:
        minmax(190px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-bottom: 80px;
}

.production-flow__intro {
    max-width: 1050px;
}

.production-flow__intro h2 {
    margin: 0;

    color: #f1f1f4;

    font-size: clamp(48px, 5vw, 82px);
    font-weight: 500;

    line-height: .98;
    letter-spacing: -.055em;
}

.production-flow__intro h2 span {
    color: var(--production-accent);
}

.production-flow__intro > p:last-child {
    max-width: 820px;

    margin: 31px 0 0;

    color: #a3a3ad;

    font-size: 17px;
    line-height: 1.72;
}


/* =========================================================
   TERMINAL
   ========================================================= */

.production-flow__terminal {
    border: 1px solid rgba(255, 255, 255, .09);

    background: rgba(5, 5, 8, .8);
}

.production-flow__terminal-head {
    min-height: 64px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 25px;

    padding: 0 24px;

    border-bottom: 1px solid rgba(255, 255, 255, .075);
}

.production-flow__terminal-head > div:first-child {
    display: flex;
    align-items: center;

    gap: 18px;
}

.production-flow__terminal-head span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
}

.production-flow__terminal-head small {
    color: #70707b;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-flow__terminal-status {
    display: flex;
    align-items: center;

    gap: 8px;

    color: #7e7e89;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
}

.production-flow__terminal-status i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .75);
}


/* =========================================================
   SOURCE
   ========================================================= */

.production-flow__source {
    display: grid;

    grid-template-columns:
        210px
        minmax(0, 1fr)
        auto;

    gap: 35px;

    align-items: center;

    margin: 38px 38px 0;

    padding: 28px;

    border: 1px solid rgba(61, 139, 255, .22);

    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(61, 139, 255, .065),
            transparent 40%
        ),
        #08080b;
}

.production-flow__source-meta {
    display: flex;
    flex-direction: column;

    gap: 7px;
}

.production-flow__source-meta span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-flow__source-meta small {
    color: #73737e;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-flow__source-main small {
    color: #787883;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-flow__source-main strong {
    display: block;

    margin-top: 5px;

    color: #dadade;

    font-size: 23px;
    font-weight: 500;

    letter-spacing: -.025em;
}

.production-flow__source-main p {
    margin: 8px 0 0;

    color: #91919c;

    font-size: 13px;
    line-height: 1.55;
}

.production-flow__source-tags {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;

    gap: 6px;
}

.production-flow__source-tags span {
    padding: 6px 9px;

    border: 1px solid rgba(61, 139, 255, .17);

    color: #81818c;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}


/* =========================================================
   START
   ========================================================= */

.production-flow__start {
    height: 80px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 5px;
}

.production-flow__start span {
    color: #70707b;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-flow__start i {
    width: 1px;
    height: 17px;

    background: rgba(61, 139, 255, .45);
}

.production-flow__start strong {
    color: var(--production-accent);

    font-size: 13px;
    font-weight: 400;
}


/* =========================================================
   MAIN TRACK
   ========================================================= */

.production-flow__track {
    display: grid;

    grid-template-columns:
        minmax(145px, 1fr)
        52px
        minmax(145px, 1fr)
        52px
        minmax(145px, 1fr)
        52px
        minmax(145px, 1fr)
        52px
        minmax(145px, 1fr)
        52px
        minmax(145px, 1fr);

    align-items: stretch;

    margin: 0 38px;
}


/* =========================================================
   STEP
   ========================================================= */

.production-flow__step {
    min-width: 0;
    min-height: 300px;

    display: flex;
    flex-direction: column;

    padding: 19px;

    border: 1px solid rgba(255, 255, 255, .085);

    background: #08080b;
}

.production-flow__step--active {
    border-color: rgba(61, 139, 255, .45);

    background:
        radial-gradient(
            circle at 50% 25%,
            rgba(61, 139, 255, .13),
            transparent 48%
        ),
        #090b10;
}

.production-flow__step--transport {
    border-color: rgba(61, 139, 255, .2);
}

.production-flow__step--delivery {
    background:
        radial-gradient(
            circle at 50% 25%,
            rgba(164, 92, 255, .065),
            transparent 48%
        ),
        #08080b;
}

.production-flow__step-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 8px;

    color: #74747f;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .09em;
}

.production-flow__step-head span {
    color: var(--production-accent);

    font-size: 10px;
}

.production-flow__step-head small {
    font: inherit;
}

.production-flow__icon {
    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-top: 28px;

    border: 1px solid rgba(61, 139, 255, .2);

    color: var(--production-accent);

    background: rgba(61, 139, 255, .025);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-flow__step h3 {
    margin: 22px 0 0;

    color: #ceced4;

    font-size: 19px;
    font-weight: 500;

    letter-spacing: -.02em;
}

.production-flow__step p {
    margin: 10px 0 0;

    color: #8f8f9a;

    font-size: 12px;
    line-height: 1.62;
}

.production-flow__step-footer {
    margin-top: auto;
    padding-top: 20px;

    color: #73737e;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}


/* =========================================================
   CONNECTORS
   ========================================================= */

.production-flow__connector {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 9px;

    min-width: 0;
}

.production-flow__connector > span {
    color: #696974;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-flow__connector > div {
    width: 100%;

    display: flex;
    align-items: center;
}

.production-flow__connector i {
    flex: 1;

    height: 1px;

    background: rgba(61, 139, 255, .35);
}

.production-flow__connector b {
    color: var(--production-accent);

    font-size: 13px;
    font-weight: 400;
}

.production-flow__connector strong {
    color: #8c8c97;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}


/* =========================================================
   PHYSICAL FLOW
   ========================================================= */

.production-flow__physical {
    display: grid;

    grid-template-columns:
        140px
        minmax(70px, .3fr)
        minmax(0, 1fr);

    gap: 25px;

    align-items: center;

    margin: 30px 38px 0;

    padding: 20px 24px;

    border-top: 1px solid rgba(255, 255, 255, .07);
    border-bottom: 1px solid rgba(255, 255, 255, .07);
}

.production-flow__physical > span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-flow__physical > div {
    display: flex;
    align-items: center;
}

.production-flow__physical > div i {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .15),
            rgba(61, 139, 255, .7)
        );
}

.production-flow__physical > div strong {
    color: var(--production-accent);

    font-size: 13px;
    font-weight: 400;
}

.production-flow__physical p {
    margin: 0;

    color: #858590;

    font-size: 9px;
    font-weight: 700;

    letter-spacing: .08em;

    text-align: right;
}

.production-flow__physical p b {
    margin: 0 8px;

    color: var(--production-accent);

    font-weight: 400;
}


/* =========================================================
   FEEDBACK
   ========================================================= */

.production-flow__feedback {
    margin: 30px 38px 38px;

    padding: 27px;

    border: 1px solid rgba(164, 92, 255, .17);

    background:
        radial-gradient(
            circle at 75% 50%,
            rgba(164, 92, 255, .055),
            transparent 40%
        ),
        rgba(164, 92, 255, .012);
}

.production-flow__feedback-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 30px;
}

.production-flow__feedback-head > div {
    display: flex;
    flex-direction: column;

    gap: 7px;
}

.production-flow__feedback-head small {
    color: var(--production-purple);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-flow__feedback-head strong {
    color: #bcbcc4;

    font-size: 15px;
    font-weight: 500;
}

.production-flow__feedback-head > span {
    color: #73737e;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-flow__feedback-track {
    display: flex;
    align-items: center;

    margin-top: 27px;
}

.production-flow__feedback-track > div {
    min-width: 105px;

    display: flex;
    flex-direction: column;

    gap: 5px;

    padding: 12px;

    border: 1px solid rgba(255, 255, 255, .075);

    background: #08080b;
}

.production-flow__feedback-track > div span {
    color: #a1a1ab;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-flow__feedback-track > div small {
    color: #696974;

    font-size: 9px;
    font-weight: 600;
    letter-spacing: .07em;
}

.production-flow__feedback-track > i {
    flex: 1;

    min-width: 12px;
    height: 1px;

    background: rgba(164, 92, 255, .3);
}

.production-flow__feedback-track
.production-flow__feedback-core {
    border-color: rgba(164, 92, 255, .4);

    background: rgba(164, 92, 255, .045);
}

.production-flow__feedback-core span {
    color: var(--production-purple) !important;
}


/* =========================================================
   LAYERS
   ========================================================= */

.production-flow__layers {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        180px
        minmax(0, 1fr);

    gap: 1px;

    margin-top: 50px;

    background: rgba(255, 255, 255, .075);
}

.production-flow__layers article {
    min-height: 220px;

    padding: 30px;

    background: #08080b;
}

.production-flow__layers article > span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-flow__layers h3 {
    margin: 28px 0 0;

    color: #cacad1;

    font-size: 21px;
    font-weight: 500;

    letter-spacing: -.02em;
}

.production-flow__layers p {
    max-width: 480px;

    margin: 13px 0 0;

    color: #90909a;

    font-size: 13px;
    line-height: 1.65;
}

.production-flow__layers-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 13px;

    background:
        radial-gradient(
            circle,
            rgba(61, 139, 255, .08),
            transparent 65%
        ),
        #09090d;
}

.production-flow__layers-center span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-flow__layers-center strong {
    color: #8d8d98;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .09em;
}

.production-flow__layers-center i {
    width: 1px;
    height: 25px;

    background: rgba(61, 139, 255, .3);
}


/* =========================================================
   STATEMENT
   ========================================================= */

.production-flow__statement {
    display: grid;

    grid-template-columns:
        minmax(200px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-top: 65px;
    padding-top: 35px;

    border-top: 1px solid rgba(255, 255, 255, .075);
}

.production-flow__statement > span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .15em;
}

.production-flow__statement p {
    max-width: 930px;

    margin: 0;

    color: #9b9ba5;

    font-size: clamp(20px, 2vw, 29px);
    line-height: 1.48;

    letter-spacing: -.025em;
}

.production-flow__statement strong {
    color: #d3d3d8;

    font-weight: 500;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1250px) {

    .production-flow__track {
        grid-template-columns: repeat(3, 1fr);

        gap: 1px;

        background: rgba(255, 255, 255, .07);
    }

    .production-flow__connector {
        display: none;
    }

    .production-flow__step {
        min-height: 290px;
    }

}


@media (max-width: 1000px) {

    .production-flow {
        padding: 110px 0;
    }

    .production-flow__header {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-flow__source {
        grid-template-columns: 1fr;
    }

    .production-flow__source-tags {
        justify-content: flex-start;
    }

    .production-flow__feedback-track {
        display: grid;

        grid-template-columns: repeat(3, 1fr);

        gap: 1px;

        background: rgba(164, 92, 255, .15);
    }

    .production-flow__feedback-track > i {
        display: none;
    }

    .production-flow__feedback-track > div {
        min-width: 0;
    }

    .production-flow__layers {
        grid-template-columns: 1fr;
    }

    .production-flow__layers-center {
        min-height: 130px;

        flex-direction: row;
    }

    .production-flow__layers-center i {
        width: 25px;
        height: 1px;
    }

    .production-flow__statement {
        grid-template-columns: 1fr;

        gap: 20px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .production-flow {
        padding: 90px 0 75px;
    }

    .production-flow__intro h2 {
        font-size: clamp(42px, 12vw, 58px);
    }

    .production-flow__intro > p:last-child {
        font-size: 15px;
    }

    .production-flow__terminal-head {
        align-items: flex-start;
        flex-direction: column;

        padding: 20px;
    }

    .production-flow__terminal-head > div:first-child {
        align-items: flex-start;
        flex-direction: column;

        gap: 6px;
    }

    .production-flow__source {
        margin: 20px 16px 0;

        padding: 22px;
    }

    .production-flow__track {
        grid-template-columns: 1fr;

        margin: 0 16px;
    }

    .production-flow__step {
        min-height: 260px;
    }

    .production-flow__physical {
        grid-template-columns: 1fr;

        margin: 25px 16px 0;
    }

    .production-flow__physical > div {
        display: none;
    }

    .production-flow__physical p {
        line-height: 1.8;
        text-align: left;
    }

    .production-flow__feedback {
        margin: 25px 16px 20px;

        padding: 20px;
    }

    .production-flow__feedback-head {
        flex-direction: column;
    }

    .production-flow__feedback-track {
        grid-template-columns: 1fr;
    }

    .production-flow__layers article {
        min-height: auto;
    }

}

/* =========================================================
   07 / INTEGRATIONS
   ========================================================= */

.production-integrations {
    position: relative;

    padding: 145px 0 135px;

    overflow: hidden;

    border-top: 1px solid rgba(255, 255, 255, .055);

    background:
        radial-gradient(
            circle at 50% 43%,
            rgba(61, 139, 255, .055),
            transparent 31%
        ),
        #070709;
}

.production-integrations::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}


/* =========================================================
   HEADER
   ========================================================= */

.production-integrations__header {
    display: grid;

    grid-template-columns:
        minmax(190px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-bottom: 80px;
}

.production-integrations__intro {
    max-width: 1050px;
}

.production-integrations__intro h2 {
    margin: 0;

    color: #f1f1f4;

    font-size: clamp(48px, 5vw, 82px);
    font-weight: 500;

    line-height: .98;
    letter-spacing: -.055em;
}

.production-integrations__intro h2 span {
    color: var(--production-accent);
}

.production-integrations__intro > p:last-child {
    max-width: 820px;

    margin: 31px 0 0;

    color: #a3a3ad;

    font-size: 17px;
    line-height: 1.72;
}


/* =========================================================
   MAP
   ========================================================= */

.production-integrations__map {
    border: 1px solid rgba(255, 255, 255, .09);

    background: rgba(5, 5, 8, .82);
}

.production-integrations__map-head {
    min-height: 64px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 25px;

    padding: 0 24px;

    border-bottom: 1px solid rgba(255, 255, 255, .075);
}

.production-integrations__map-head > div:first-child {
    display: flex;
    align-items: center;

    gap: 18px;
}

.production-integrations__map-head span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
}

.production-integrations__map-head small {
    color: #71717c;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
}

.production-integrations__status {
    display: flex;
    align-items: center;

    gap: 8px;

    color: #7e7e89;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-integrations__status i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .75);
}


/* =========================================================
   WORKSPACE
   ========================================================= */

.production-integrations__workspace {
    display: grid;

    grid-template-columns:
        minmax(250px, 1fr)
        100px
        minmax(260px, .9fr)
        100px
        minmax(250px, 1fr);

    align-items: stretch;

    padding: 38px;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .014) 1px,
            transparent 1px
        );

    background-size: 32px 32px;
}


/* =========================================================
   SIDES
   ========================================================= */

.production-integrations__side {
    min-width: 0;

    padding: 22px;

    border: 1px solid rgba(255, 255, 255, .085);

    background: rgba(8, 8, 11, .96);
}

.production-integrations__side--ot {
    border-color: rgba(61, 139, 255, .14);
}

.production-integrations__side-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 15px;

    margin-bottom: 24px;
}

.production-integrations__side-head > div {
    display: flex;
    flex-direction: column;

    gap: 7px;
}

.production-integrations__side-head span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
}

.production-integrations__side-head strong {
    color: #bdbdc5;

    font-size: 15px;
    font-weight: 500;
}

.production-integrations__side-head > small {
    color: #686873;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .09em;
}


/* =========================================================
   NODE
   ========================================================= */

.production-integration-node {
    display: grid;

    grid-template-columns:
        52px
        minmax(0, 1fr)
        auto;

    gap: 15px;

    align-items: center;

    min-height: 130px;

    padding: 16px 0;

    border-top: 1px solid rgba(255, 255, 255, .065);
}

.production-integration-node__icon {
    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(61, 139, 255, .19);

    color: var(--production-accent);

    background: rgba(61, 139, 255, .025);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
}

.production-integration-node small {
    color: #696974;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .09em;
}

.production-integration-node h3 {
    margin: 5px 0 0;

    color: #c7c7ce;

    font-size: 16px;
    font-weight: 500;
}

.production-integration-node p {
    margin: 7px 0 0;

    color: #858590;

    font-size: 11px;
    line-height: 1.55;
}

.production-integration-node > span {
    padding: 5px 7px;

    border: 1px solid rgba(255, 255, 255, .075);

    color: #74747f;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .07em;
}


/* =========================================================
   BUS
   ========================================================= */

.production-integrations__bus {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 12px;

    min-width: 0;
}

.production-integrations__bus > span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;

    letter-spacing: .08em;
    text-align: center;
}

.production-integrations__bus > small {
    color: #686873;

    font-size: 9px;
    font-weight: 700;

    letter-spacing: .07em;
    text-align: center;
}

.production-integrations__bus-line {
    width: 100%;

    display: flex;
    align-items: center;
}

.production-integrations__bus-line i {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .15),
            rgba(61, 139, 255, .65)
        );
}

.production-integrations__bus-line b {
    color: var(--production-accent);

    font-size: 14px;
    font-weight: 400;
}


/* =========================================================
   CORE
   ========================================================= */

.production-integrations__core {
    position: relative;

    display: flex;
    flex-direction: column;

    min-width: 0;

    padding: 23px;

    border: 1px solid rgba(61, 139, 255, .42);

    background:
        radial-gradient(
            circle at 50% 38%,
            rgba(61, 139, 255, .13),
            transparent 43%
        ),
        #090b10;

    box-shadow:
        inset 0 0 50px rgba(61, 139, 255, .025);
}

.production-integrations__core-top {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;
}

.production-integrations__core-top > span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
}

.production-integrations__core-top > div {
    display: flex;
    align-items: center;

    gap: 6px;

    color: #757580;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-integrations__core-top i {
    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 9px rgba(61, 139, 255, .8);
}

.production-integrations__core-main {
    margin-top: 55px;
}

.production-integrations__core-main small {
    color: #74747f;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
}

.production-integrations__core-main > strong {
    display: block;

    margin-top: 8px;

    color: #d7d7dd;

    font-size: clamp(24px, 2vw, 31px);
    font-weight: 500;

    line-height: 1;
    letter-spacing: -.035em;
}

.production-integrations__core-main > strong span {
    display: block;

    margin-top: 4px;

    color: var(--production-accent);
}

.production-integrations__core-main p {
    margin: 17px 0 0;

    color: #92929d;

    font-size: 12px;
    line-height: 1.65;
}


/* STACK */

.production-integrations__core-stack {
    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 1px;

    margin-top: 38px;

    background: rgba(61, 139, 255, .16);
}

.production-integrations__core-stack > div {
    min-height: 70px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    gap: 5px;

    padding: 12px;

    background: #08090d;
}

.production-integrations__core-stack span {
    color: #aaaab3;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-integrations__core-stack small {
    color: #686873;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .07em;
}


/* CORE FOOTER */

.production-integrations__core-footer {
    display: grid;

    grid-template-columns:
        auto
        1fr
        auto
        1fr
        auto;

    gap: 8px;

    align-items: center;

    margin-top: auto;
    padding-top: 30px;
}

.production-integrations__core-footer span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
}

.production-integrations__core-footer strong {
    color: #8e8e99;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .07em;
}

.production-integrations__core-footer i {
    height: 1px;

    background: rgba(61, 139, 255, .28);
}


/* =========================================================
   PROTOCOLS
   ========================================================= */

.production-integrations__protocols {
    display: grid;

    grid-template-columns:
        290px
        minmax(0, 1fr);

    gap: 45px;

    align-items: center;

    margin: 0 38px 38px;

    padding: 27px;

    border: 1px solid rgba(164, 92, 255, .15);

    background:
        radial-gradient(
            circle at 80% 50%,
            rgba(164, 92, 255, .045),
            transparent 40%
        ),
        rgba(164, 92, 255, .012);
}

.production-integrations__protocols-title {
    display: flex;
    flex-direction: column;

    gap: 7px;
}

.production-integrations__protocols-title small {
    color: var(--production-purple);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
}

.production-integrations__protocols-title strong {
    color: #b8b8c0;

    font-size: 14px;
    font-weight: 500;
    line-height: 1.45;
}

.production-integrations__protocol-list {
    display: flex;
    align-items: center;
}

.production-integrations__protocol-list span {
    white-space: nowrap;

    color: #858590;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .07em;
}

.production-integrations__protocol-list i {
    flex: 1;

    min-width: 15px;
    height: 1px;

    margin: 0 12px;

    background: rgba(164, 92, 255, .24);
}


/* =========================================================
   WORLDS
   ========================================================= */

.production-integrations__worlds {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        100px
        minmax(0, 1fr)
        100px
        minmax(0, 1fr);

    align-items: stretch;

    margin-top: 50px;
}

.production-integrations__worlds article {
    min-height: 225px;

    padding: 29px;

    border: 1px solid rgba(255, 255, 255, .075);

    background: #08080b;
}

.production-integrations__worlds-core {
    border-color: rgba(61, 139, 255, .28) !important;

    background:
        radial-gradient(
            circle at 50% 40%,
            rgba(61, 139, 255, .075),
            transparent 55%
        ),
        #08090d !important;
}

.production-integrations__worlds article > span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
}

.production-integrations__worlds article > small {
    display: block;

    margin-top: 5px;

    color: #6f6f7a;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-integrations__worlds h3 {
    margin: 29px 0 0;

    color: #c9c9d0;

    font-size: 20px;
    font-weight: 500;
}

.production-integrations__worlds p {
    max-width: 330px;

    margin: 11px 0 0;

    color: #8d8d98;

    font-size: 12px;
    line-height: 1.65;
}


/* WORLD LINK */

.production-integrations__world-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 9px;
}

.production-integrations__world-link span {
    color: #74747f;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-integrations__world-link i {
    width: 100%;
    height: 1px;

    background: rgba(61, 139, 255, .3);
}

.production-integrations__world-link b {
    color: var(--production-accent);

    font-size: 13px;
    font-weight: 400;
}


/* =========================================================
   STATEMENT
   ========================================================= */

.production-integrations__statement {
    display: grid;

    grid-template-columns:
        minmax(200px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-top: 65px;
    padding-top: 35px;

    border-top: 1px solid rgba(255, 255, 255, .075);
}

.production-integrations__statement > span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .15em;
}

.production-integrations__statement p {
    max-width: 930px;

    margin: 0;

    color: #9b9ba5;

    font-size: clamp(20px, 2vw, 29px);
    line-height: 1.48;

    letter-spacing: -.025em;
}

.production-integrations__statement strong {
    color: #d3d3d8;

    font-weight: 500;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1200px) {

    .production-integrations__workspace {
        grid-template-columns:
            minmax(220px, 1fr)
            65px
            minmax(230px, .9fr)
            65px
            minmax(220px, 1fr);

        padding: 25px;
    }

}


@media (max-width: 1000px) {

    .production-integrations {
        padding: 110px 0;
    }

    .production-integrations__header {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-integrations__workspace {
        grid-template-columns: 1fr;

        gap: 18px;
    }

    .production-integrations__bus {
        min-height: 75px;
    }

    .production-integrations__bus-line {
        width: 1px;
        height: 25px;

        flex-direction: column;
    }

    .production-integrations__bus-line i {
        width: 1px;
        height: 100%;
    }

    .production-integrations__core-main {
        margin-top: 35px;
    }

    .production-integrations__protocols {
        grid-template-columns: 1fr;
    }

    .production-integrations__worlds {
        grid-template-columns: 1fr;

        gap: 1px;

        background: rgba(255, 255, 255, .07);
    }

    .production-integrations__world-link {
        min-height: 70px;

        flex-direction: row;
    }

    .production-integrations__world-link i {
        width: 35px;
    }

    .production-integrations__statement {
        grid-template-columns: 1fr;

        gap: 20px;
    }

}


@media (max-width: 650px) {

    .production-integrations {
        padding: 90px 0 75px;
    }

    .production-integrations__intro h2 {
        font-size: clamp(42px, 12vw, 58px);
    }

    .production-integrations__intro > p:last-child {
        font-size: 15px;
    }

    .production-integrations__map-head {
        align-items: flex-start;
        flex-direction: column;

        padding: 20px;
    }

    .production-integrations__map-head > div:first-child {
        align-items: flex-start;
        flex-direction: column;

        gap: 6px;
    }

    .production-integrations__workspace {
        padding: 16px;
    }

    .production-integrations__side {
        padding: 19px;
    }

    .production-integration-node {
        grid-template-columns:
            48px
            minmax(0, 1fr);
    }

    .production-integration-node > span {
        display: none;
    }

    .production-integrations__protocols {
        margin: 0 16px 20px;

        padding: 21px;
    }

    .production-integrations__protocol-list {
        align-items: flex-start;
        flex-direction: column;

        gap: 12px;
    }

    .production-integrations__protocol-list i {
        width: 1px;
        height: 13px;
        min-width: 0;

        margin: 0 0 0 4px;
    }

}

/* =========================================================
   08 / DATA & AI
   ========================================================= */

.production-intelligence {
    position: relative;

    padding: 145px 0 135px;

    overflow: hidden;

    border-top: 1px solid rgba(255, 255, 255, .055);

    background:
        radial-gradient(
            circle at 67% 48%,
            rgba(164, 92, 255, .045),
            transparent 28%
        ),
        radial-gradient(
            circle at 40% 35%,
            rgba(61, 139, 255, .035),
            transparent 30%
        ),
        #060608;
}

.production-intelligence::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .01) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .01) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}


/* =========================================================
   HEADER
   ========================================================= */

.production-intelligence__header {
    display: grid;

    grid-template-columns:
        minmax(190px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-bottom: 80px;
}

.production-intelligence__intro {
    max-width: 1050px;
}

.production-intelligence__intro h2 {
    margin: 0;

    color: #f1f1f4;

    font-size: clamp(48px, 5vw, 82px);
    font-weight: 500;

    line-height: .98;
    letter-spacing: -.055em;
}

.production-intelligence__intro h2 span {
    color: var(--production-accent);
}

.production-intelligence__intro > p:last-child {
    max-width: 820px;

    margin: 31px 0 0;

    color: #a3a3ad;

    font-size: 17px;
    line-height: 1.72;
}


/* =========================================================
   PANEL
   ========================================================= */

.production-intelligence__panel {
    border: 1px solid rgba(255, 255, 255, .09);

    background: rgba(5, 5, 8, .8);
}

.production-intelligence__panel-head {
    min-height: 64px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 25px;

    padding: 0 24px;

    border-bottom: 1px solid rgba(255, 255, 255, .075);
}

.production-intelligence__panel-head > div:first-child {
    display: flex;
    align-items: center;

    gap: 18px;
}

.production-intelligence__panel-head span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
}

.production-intelligence__panel-head small {
    color: #70707b;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
}

.production-intelligence__status {
    display: flex;
    align-items: center;

    gap: 8px;

    color: #7e7e89;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-intelligence__status i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 10px rgba(61, 139, 255, .75);
}


/* =========================================================
   SOURCES
   ========================================================= */

.production-intelligence__sources {
    display: flex;
    align-items: center;

    margin: 38px;

    padding: 23px;

    border: 1px solid rgba(255, 255, 255, .07);

    background: #08080b;
}

.production-intelligence__source {
    min-width: 120px;

    display: flex;
    flex-direction: column;

    gap: 5px;
}

.production-intelligence__source small {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
}

.production-intelligence__source span {
    color: #a4a4ae;

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-intelligence__source strong {
    color: #666671;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .07em;
}

.production-intelligence__sources > i {
    flex: 1;

    height: 1px;

    margin: 0 20px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .12),
            rgba(61, 139, 255, .55)
        );
}


/* =========================================================
   CORE
   ========================================================= */

.production-intelligence__core {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        280px
        minmax(260px, .8fr);

    gap: 45px;

    align-items: center;

    margin: 0 38px 38px;

    padding: 45px;

    border: 1px solid rgba(61, 139, 255, .18);

    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(61, 139, 255, .075),
            transparent 30%
        ),
        #08080b;
}


/* LEFT */

.production-intelligence__core-left small {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-intelligence__core-left h3 {
    margin: 18px 0 0;

    color: #d0d0d6;

    font-size: 27px;
    font-weight: 500;

    letter-spacing: -.03em;
}

.production-intelligence__core-left p {
    max-width: 450px;

    margin: 16px 0 0;

    color: #91919b;

    font-size: 13px;
    line-height: 1.68;
}


/* CENTER */

.production-intelligence__core-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.production-intelligence__core-ring {
    position: relative;

    width: 205px;
    height: 205px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(61, 139, 255, .28);
    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(61, 139, 255, .11),
            rgba(61, 139, 255, .02) 48%,
            transparent 70%
        );
}

.production-intelligence__core-ring::before {
    content: "";

    position: absolute;

    width: 165px;
    height: 165px;

    border: 1px dashed rgba(61, 139, 255, .17);
    border-radius: 50%;
}

.production-intelligence__core-ring span {
    position: relative;

    color: #8a8a95;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .13em;
}

.production-intelligence__core-ring strong {
    position: relative;

    margin-top: 6px;

    color: var(--production-accent);

    font-size: 27px;
    font-weight: 500;

    letter-spacing: -.03em;
}

.production-intelligence__core-ring small {
    position: relative;

    margin-top: 6px;

    color: #666671;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}


/* RIGHT */

.production-intelligence__core-right {
    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 1px;

    background: rgba(255, 255, 255, .07);
}

.production-intelligence__core-right > div {
    min-height: 95px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    gap: 7px;

    padding: 17px;

    background: #09090c;
}

.production-intelligence__core-right span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .09em;
}

.production-intelligence__core-right strong {
    color: #a9a9b2;

    font-size: 11px;
    font-weight: 500;
}


/* =========================================================
   CAPABILITIES
   ========================================================= */

.production-intelligence__capabilities {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1px;

    margin-top: 50px;

    background: rgba(255, 255, 255, .075);
}

.production-intelligence__capabilities article {
    min-height: 300px;

    display: flex;
    flex-direction: column;

    padding: 26px;

    background: #08080b;
}

.production-intelligence__capabilities article > span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-intelligence__cap-icon {
    width: 52px;
    height: 52px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-top: 31px;

    border: 1px solid rgba(61, 139, 255, .19);

    color: var(--production-accent);

    background: rgba(61, 139, 255, .025);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
}

.production-intelligence__capabilities h3 {
    margin: 28px 0 0;

    color: #c9c9d0;

    font-size: 18px;
    font-weight: 500;

    letter-spacing: -.02em;
}

.production-intelligence__capabilities p {
    margin: 12px 0 0;

    color: #8e8e99;

    font-size: 12px;
    line-height: 1.65;
}


/* =========================================================
   AI
   ========================================================= */

.production-intelligence__ai {
    margin-top: 50px;

    padding: 35px;

    border: 1px solid rgba(164, 92, 255, .18);

    background:
        radial-gradient(
            circle at 85% 50%,
            rgba(164, 92, 255, .065),
            transparent 35%
        ),
        #08080b;
}

.production-intelligence__ai-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 30px;
}

.production-intelligence__ai-head > div {
    display: flex;
    flex-direction: column;

    gap: 9px;
}

.production-intelligence__ai-head small {
    color: var(--production-purple);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-intelligence__ai-head h3 {
    margin: 0;

    color: #cacad1;

    font-size: 22px;
    font-weight: 500;
}

.production-intelligence__ai-head > span {
    color: #777782;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}


/* AI FLOW */

.production-intelligence__ai-flow {
    display: flex;
    align-items: center;

    margin-top: 37px;
}

.production-intelligence__ai-flow > div {
    flex: 0 0 150px;

    min-height: 105px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    gap: 5px;

    padding: 15px;

    border: 1px solid rgba(255, 255, 255, .075);

    background: #09090c;
}

.production-intelligence__ai-flow small {
    color: #696974;

    font-size: 9px;
    font-weight: 700;
}

.production-intelligence__ai-flow span {
    color: var(--production-purple);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-intelligence__ai-flow strong {
    color: #a8a8b1;

    font-size: 11px;
    font-weight: 500;
}

.production-intelligence__ai-flow > i {
    flex: 1;

    min-width: 15px;
    height: 1px;

    background: rgba(164, 92, 255, .27);
}

.production-intelligence__ai-future {
    border-color: rgba(164, 92, 255, .36) !important;

    background: rgba(164, 92, 255, .04) !important;
}


/* AI NOTE */

.production-intelligence__ai-note {
    display: grid;

    grid-template-columns:
        auto
        minmax(0, 1fr)
        80px
        auto
        minmax(0, 1fr);

    gap: 18px;

    align-items: center;

    margin-top: 30px;
    padding-top: 25px;

    border-top: 1px solid rgba(255, 255, 255, .065);
}

.production-intelligence__ai-note span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-intelligence__ai-note
.production-intelligence__ai-future-label {
    color: var(--production-purple);
}

.production-intelligence__ai-note p {
    margin: 0;

    color: #858590;

    font-size: 11px;
    line-height: 1.55;
}

.production-intelligence__ai-note i {
    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .2),
            rgba(164, 92, 255, .3)
        );
}


/* =========================================================
   STATEMENT
   ========================================================= */

.production-intelligence__statement {
    display: grid;

    grid-template-columns:
        minmax(200px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-top: 65px;
    padding-top: 35px;

    border-top: 1px solid rgba(255, 255, 255, .075);
}

.production-intelligence__statement > span {
    color: var(--production-purple);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .15em;
}

.production-intelligence__statement p {
    max-width: 930px;

    margin: 0;

    color: #9b9ba5;

    font-size: clamp(20px, 2vw, 29px);
    line-height: 1.48;

    letter-spacing: -.025em;
}

.production-intelligence__statement strong {
    color: #d3d3d8;

    font-weight: 500;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

    .production-intelligence {
        padding: 110px 0;
    }

    .production-intelligence__header {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-intelligence__core {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-intelligence__capabilities {
        grid-template-columns: repeat(2, 1fr);
    }

    .production-intelligence__ai-flow {
        display: grid;

        grid-template-columns: repeat(5, 1fr);

        gap: 1px;

        background: rgba(164, 92, 255, .14);
    }

    .production-intelligence__ai-flow > div {
        min-width: 0;

        width: auto;
    }

    .production-intelligence__ai-flow > i {
        display: none;
    }

    .production-intelligence__statement {
        grid-template-columns: 1fr;

        gap: 20px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .production-intelligence {
        padding: 90px 0 75px;
    }

    .production-intelligence__intro h2 {
        font-size: clamp(42px, 12vw, 58px);
    }

    .production-intelligence__intro > p:last-child {
        font-size: 15px;
    }

    .production-intelligence__panel-head {
        align-items: flex-start;
        flex-direction: column;

        padding: 20px;
    }

    .production-intelligence__panel-head > div:first-child {
        align-items: flex-start;
        flex-direction: column;

        gap: 6px;
    }

    .production-intelligence__sources {
        align-items: stretch;
        flex-direction: column;

        margin: 20px 16px;

        gap: 12px;
    }

    .production-intelligence__sources > i {
        width: 1px;
        height: 14px;
        flex: none;

        margin: 0 0 0 4px;
    }

    .production-intelligence__core {
        margin: 0 16px 20px;

        padding: 24px;
    }

    .production-intelligence__core-ring {
        width: 180px;
        height: 180px;
    }

    .production-intelligence__core-ring::before {
        width: 145px;
        height: 145px;
    }

    .production-intelligence__core-right {
        grid-template-columns: 1fr;
    }

    .production-intelligence__capabilities {
        grid-template-columns: 1fr;
    }

    .production-intelligence__capabilities article {
        min-height: 260px;
    }

    .production-intelligence__ai {
        padding: 22px;
    }

    .production-intelligence__ai-head {
        flex-direction: column;
    }

    .production-intelligence__ai-flow {
        grid-template-columns: 1fr;
    }

    .production-intelligence__ai-note {
        grid-template-columns: 1fr;

        gap: 10px;
    }

    .production-intelligence__ai-note i {
        width: 1px;
        height: 20px;

        margin-left: 4px;
    }

}

/* =========================================================
   09 / DEDICATED PLATFORM
   ========================================================= */

.production-dedicated {
    position: relative;

    padding: 145px 0 135px;

    overflow: hidden;

    border-top: 1px solid rgba(255, 255, 255, .055);

    background:
        radial-gradient(
            circle at 75% 40%,
            rgba(61, 139, 255, .045),
            transparent 30%
        ),
        #070709;
}

.production-dedicated::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .011) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .011) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}


/* =========================================================
   HEADER
   ========================================================= */

.production-dedicated__header {
    display: grid;

    grid-template-columns:
        minmax(190px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-bottom: 80px;
}

.production-dedicated__intro {
    max-width: 1050px;
}

.production-dedicated__intro h2 {
    margin: 0;

    color: #f1f1f4;

    font-size: clamp(48px, 5vw, 82px);
    font-weight: 500;

    line-height: .98;
    letter-spacing: -.055em;
}

.production-dedicated__intro h2 span {
    color: var(--production-accent);
}

.production-dedicated__intro > p:last-child {
    max-width: 820px;

    margin: 31px 0 0;

    color: #a3a3ad;

    font-size: 17px;
    line-height: 1.72;
}


/* =========================================================
   PATHS
   ========================================================= */

.production-dedicated__paths {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        100px
        minmax(0, 1fr);

    align-items: stretch;
}

.production-dedicated__path {
    min-height: 560px;

    display: flex;
    flex-direction: column;

    padding: 35px;

    border: 1px solid rgba(255, 255, 255, .085);

    background:
        radial-gradient(
            circle at 80% 15%,
            rgba(61, 139, 255, .035),
            transparent 35%
        ),
        #08080b;
}

.production-dedicated__path--custom {
    border-color: rgba(61, 139, 255, .32);

    background:
        radial-gradient(
            circle at 78% 18%,
            rgba(61, 139, 255, .11),
            transparent 38%
        ),
        #080a0f;
}


/* PATH HEAD */

.production-dedicated__path-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;
}

.production-dedicated__path-head span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
}

.production-dedicated__path-head small {
    color: #73737e;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}


/* SYMBOL */

.production-dedicated__path-symbol {
    width: 64px;
    height: 64px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-top: 50px;

    border: 1px solid rgba(61, 139, 255, .22);

    color: var(--production-accent);

    background: rgba(61, 139, 255, .025);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-dedicated__path--custom
.production-dedicated__path-symbol {
    border-color: rgba(61, 139, 255, .45);

    box-shadow:
        0 0 35px rgba(61, 139, 255, .05);
}


/* CONTENT */

.production-dedicated__path-content {
    margin-top: 36px;
}

.production-dedicated__path-content small {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-dedicated__path-content h3 {
    margin: 12px 0 0;

    color: #d0d0d6;

    font-size: 28px;
    font-weight: 500;

    letter-spacing: -.035em;
}

.production-dedicated__path-content p {
    max-width: 520px;

    margin: 16px 0 0;

    color: #92929c;

    font-size: 14px;
    line-height: 1.68;
}


/* MODULES */

.production-dedicated__modules {
    display: flex;
    flex-wrap: wrap;

    gap: 7px;

    margin-top: 34px;
}

.production-dedicated__modules span {
    padding: 7px 9px;

    border: 1px solid rgba(255, 255, 255, .08);

    color: #797984;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-dedicated__path--custom
.production-dedicated__modules span {
    border-color: rgba(61, 139, 255, .14);
}


/* PATH FOOTER */

.production-dedicated__path-footer {
    display: grid;

    grid-template-columns:
        auto
        1fr
        auto;

    gap: 15px;

    align-items: center;

    margin-top: auto;
    padding-top: 40px;
}

.production-dedicated__path-footer span,
.production-dedicated__path-footer strong {
    color: #7c7c87;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-dedicated__path-footer strong {
    color: var(--production-accent);
}

.production-dedicated__path-footer i {
    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .15),
            rgba(61, 139, 255, .6)
        );
}


/* =========================================================
   OR
   ========================================================= */

.production-dedicated__or {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 15px;
}

.production-dedicated__or i {
    width: 1px;
    height: 90px;

    background:
        linear-gradient(
            rgba(255, 255, 255, .04),
            rgba(61, 139, 255, .25)
        );
}

.production-dedicated__or span {
    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(61, 139, 255, .2);
    border-radius: 50%;

    color: var(--production-accent);

    background: #08080b;

    font-size: 9px;
    font-weight: 700;
}


/* =========================================================
   PROCESS
   ========================================================= */

.production-dedicated__process {
    display: grid;

    grid-template-columns:
        270px
        minmax(0, 1fr);

    gap: 55px;

    align-items: center;

    margin-top: 50px;

    padding: 32px;

    border: 1px solid rgba(255, 255, 255, .08);

    background: #08080b;
}

.production-dedicated__process-label {
    display: flex;
    flex-direction: column;

    gap: 9px;
}

.production-dedicated__process-label small {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-dedicated__process-label strong {
    color: #bcbcc4;

    font-size: 16px;
    font-weight: 500;
    line-height: 1.45;
}


/* FLOW */

.production-dedicated__process-flow {
    display: flex;
    align-items: center;
}

.production-dedicated__process-flow > div {
    min-width: 105px;

    display: flex;
    flex-direction: column;

    gap: 5px;
}

.production-dedicated__process-flow > div span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
}

.production-dedicated__process-flow > div small {
    color: #676772;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-dedicated__process-flow > div strong {
    color: #a8a8b1;

    font-size: 12px;
    font-weight: 500;
}

.production-dedicated__process-flow > i {
    flex: 1;

    min-width: 15px;
    height: 1px;

    margin: 0 13px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .15),
            rgba(61, 139, 255, .45)
        );
}

.production-dedicated__process-final strong {
    color: var(--production-accent) !important;
}


/* =========================================================
   ARCHITECTURE
   ========================================================= */

.production-dedicated__architecture {
    display: grid;

    grid-template-columns:
        minmax(280px, .75fr)
        minmax(0, 1.25fr);

    gap: 65px;

    align-items: center;

    margin-top: 20px;

    padding: 38px;

    border: 1px solid rgba(61, 139, 255, .12);

    background:
        radial-gradient(
            circle at 75% 50%,
            rgba(61, 139, 255, .05),
            transparent 35%
        ),
        #08080b;
}


/* COPY */

.production-dedicated__architecture-copy small {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-dedicated__architecture-copy h3 {
    max-width: 450px;

    margin: 14px 0 0;

    color: #c9c9d0;

    font-size: 23px;
    font-weight: 500;

    letter-spacing: -.025em;
}

.production-dedicated__architecture-copy p {
    max-width: 510px;

    margin: 14px 0 0;

    color: #8f8f99;

    font-size: 13px;
    line-height: 1.68;
}


/* MAP */

.production-dedicated__architecture-map {
    display: flex;
    align-items: center;
}

.production-dedicated__architecture-map > div {
    min-width: 90px;

    display: flex;
    flex-direction: column;

    gap: 5px;

    padding: 14px;

    border: 1px solid rgba(255, 255, 255, .075);

    background: #09090c;
}

.production-dedicated__architecture-map span {
    color: #a3a3ad;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .07em;
}

.production-dedicated__architecture-map small {
    color: #656570;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
}

.production-dedicated__architecture-map > i {
    flex: 1;

    min-width: 12px;
    height: 1px;

    background: rgba(61, 139, 255, .25);
}

.production-dedicated__architecture-map
.production-dedicated__architecture-core {
    border-color: rgba(61, 139, 255, .4);

    background: rgba(61, 139, 255, .045);
}

.production-dedicated__architecture-core span {
    color: var(--production-accent);
}


/* =========================================================
   DIFFERENT
   ========================================================= */

.production-dedicated__different {
    display: grid;

    grid-template-columns:
        minmax(200px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-top: 50px;

    padding: 50px;

    border: 1px solid rgba(61, 139, 255, .18);

    background:
        linear-gradient(
            110deg,
            rgba(61, 139, 255, .045),
            transparent 48%
        ),
        #08080b;
}

.production-dedicated__different-index {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
}

.production-dedicated__different-copy > span {
    color: #71717c;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-dedicated__different-copy p {
    max-width: 800px;

    margin: 14px 0 0;

    color: #a1a1ab;

    font-size: clamp(22px, 2.2vw, 34px);
    line-height: 1.35;

    letter-spacing: -.035em;
}

.production-dedicated__different-copy strong {
    display: block;

    max-width: 850px;

    margin-top: 17px;

    color: #d0d0d6;

    font-size: clamp(22px, 2.2vw, 34px);
    font-weight: 500;
    line-height: 1.35;

    letter-spacing: -.035em;
}


/* =========================================================
   STATEMENT
   ========================================================= */

.production-dedicated__statement {
    display: grid;

    grid-template-columns:
        minmax(200px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-top: 65px;
    padding-top: 35px;

    border-top: 1px solid rgba(255, 255, 255, .075);
}

.production-dedicated__statement > span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .15em;
}

.production-dedicated__statement p {
    max-width: 930px;

    margin: 0;

    color: #9b9ba5;

    font-size: clamp(20px, 2vw, 29px);
    line-height: 1.48;

    letter-spacing: -.025em;
}

.production-dedicated__statement strong {
    color: #d3d3d8;

    font-weight: 500;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

    .production-dedicated {
        padding: 110px 0;
    }

    .production-dedicated__header {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-dedicated__process {
        grid-template-columns: 1fr;

        gap: 30px;
    }

    .production-dedicated__architecture {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-dedicated__statement {
        grid-template-columns: 1fr;

        gap: 20px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .production-dedicated {
        padding: 90px 0 75px;
    }

    .production-dedicated__intro h2 {
        font-size: clamp(42px, 12vw, 58px);
    }

    .production-dedicated__intro > p:last-child {
        font-size: 15px;
    }

    .production-dedicated__paths {
        grid-template-columns: 1fr;
    }

    .production-dedicated__path {
        min-height: 500px;

        padding: 25px;
    }

    .production-dedicated__or {
        min-height: 100px;

        flex-direction: row;
    }

    .production-dedicated__or i {
        width: 70px;
        height: 1px;
    }

    .production-dedicated__process {
        padding: 23px;
    }

    .production-dedicated__process-flow {
        align-items: flex-start;
        flex-direction: column;

        gap: 0;
    }

    .production-dedicated__process-flow > i {
        flex: none;

        width: 1px;
        height: 22px;
        min-width: 0;

        margin: 8px 0 8px 4px;
    }

    .production-dedicated__architecture {
        padding: 24px;
    }

    .production-dedicated__architecture-map {
        align-items: flex-start;
        flex-direction: column;
    }

    .production-dedicated__architecture-map > div {
        width: 100%;
    }

    .production-dedicated__architecture-map > i {
        flex: none;

        width: 1px;
        height: 18px;
        min-width: 0;

        margin-left: 15px;
    }

    .production-dedicated__different {
        grid-template-columns: 1fr;

        gap: 25px;

        padding: 28px;
    }

}

/* =========================================================
   10 / 2CAN EDGE
   ========================================================= */

.production-edge {
    position: relative;
    padding: 145px 0 135px;
    overflow: hidden;

    border-top: 1px solid rgba(255, 255, 255, .055);

    background:
        radial-gradient(
            circle at 50% 42%,
            rgba(61, 139, 255, .055),
            transparent 32%
        ),
        #060608;
}

.production-edge::before {
    content: "";
    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .011) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .011) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}


/* =========================================================
   HEADER
   ========================================================= */

.production-edge__header {
    display: grid;

    grid-template-columns:
        minmax(190px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-bottom: 80px;
}

.production-edge__intro {
    max-width: 1050px;
}

.production-edge__intro h2 {
    margin: 0;

    color: #f1f1f4;

    font-size: clamp(48px, 5vw, 82px);
    font-weight: 500;

    line-height: .98;
    letter-spacing: -.055em;
}

.production-edge__intro h2 span {
    color: var(--production-accent);
}

.production-edge__intro > p:last-child {
    max-width: 820px;

    margin: 31px 0 0;

    color: #a3a3ad;

    font-size: 17px;
    line-height: 1.72;
}


/* =========================================================
   ARCHITECTURE
   ========================================================= */

.production-edge__architecture {
    border: 1px solid rgba(255, 255, 255, .085);

    background: rgba(6, 6, 9, .82);
}

.production-edge__architecture-head {
    min-height: 65px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 25px;

    padding: 0 25px;

    border-bottom: 1px solid rgba(255, 255, 255, .07);
}

.production-edge__architecture-head > div:first-child {
    display: flex;
    align-items: center;

    gap: 18px;
}

.production-edge__architecture-head span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .13em;
}

.production-edge__architecture-head small {
    color: #6d6d78;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-edge__architecture-status {
    display: flex;
    align-items: center;

    gap: 8px;

    color: #7d7d88;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-edge__architecture-status i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 12px rgba(61, 139, 255, .75);
}


/* =========================================================
   DIAGRAM
   ========================================================= */

.production-edge__diagram {
    display: grid;

    grid-template-columns:
        minmax(210px, .8fr)
        minmax(320px, 1.1fr)
        minmax(270px, 1fr);

    gap: 65px;

    align-items: center;

    min-height: 570px;

    padding: 65px 55px;
}


/* =========================================================
   INPUT
   ========================================================= */

.production-edge__input {
    display: grid;

    grid-template-columns: 1fr 70px;

    gap: 20px 15px;

    align-items: center;
}

.production-edge__side-label {
    grid-column: 1 / -1;

    margin-bottom: 10px;

    color: #686873;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-edge__port {
    min-height: 92px;

    display: flex;
    align-items: center;

    gap: 15px;

    padding: 17px;

    border: 1px solid rgba(255, 255, 255, .075);

    background: #09090c;
}

.production-edge__port > span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
}

.production-edge__port > div {
    display: flex;
    flex-direction: column;

    gap: 5px;
}

.production-edge__port small {
    color: #70707b;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-edge__port strong {
    color: #b2b2bb;

    font-size: 12px;
    font-weight: 500;
}

.production-edge__line {
    display: flex;
    flex-direction: column;

    gap: 7px;
}

.production-edge__line i {
    position: relative;

    width: 100%;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .12),
            rgba(61, 139, 255, .75)
        );
}

.production-edge__line i::after {
    content: "";

    position: absolute;

    right: -1px;
    top: -2px;

    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: var(--production-accent);
}

.production-edge__line span {
    align-self: flex-end;

    color: #666671;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}


/* =========================================================
   DEVICE
   ========================================================= */

.production-edge__device {
    position: relative;

    min-height: 400px;

    display: flex;
    flex-direction: column;

    padding: 22px;

    border: 1px solid rgba(61, 139, 255, .36);

    background:
        radial-gradient(
            circle at 50% 40%,
            rgba(61, 139, 255, .1),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            #0c1119,
            #07090e 70%
        );

    box-shadow:
        0 0 80px rgba(61, 139, 255, .035),
        inset 0 0 40px rgba(61, 139, 255, .025);
}

.production-edge__device::before,
.production-edge__device::after {
    content: "";

    position: absolute;

    width: 20px;
    height: 20px;

    pointer-events: none;
}

.production-edge__device::before {
    top: -1px;
    left: -1px;

    border-top: 1px solid var(--production-accent);
    border-left: 1px solid var(--production-accent);
}

.production-edge__device::after {
    right: -1px;
    bottom: -1px;

    border-right: 1px solid var(--production-accent);
    border-bottom: 1px solid var(--production-accent);
}


/* DEVICE TOP */

.production-edge__device-top {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;
}

.production-edge__device-top span {
    color: #d8d8dd;

    font-size: 12px;
    font-weight: 700;
    letter-spacing: .13em;
}

.production-edge__device-top small {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}


/* LED */

.production-edge__device-status {
    display: flex;

    gap: 6px;

    margin-top: 18px;
}

.production-edge__device-status i {
    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: rgba(255, 255, 255, .13);
}

.production-edge__device-status i:first-child {
    background: var(--production-accent);

    box-shadow:
        0 0 9px rgba(61, 139, 255, .8);
}


/* CENTER */

.production-edge__device-center {
    flex: 1;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    text-align: center;
}

.production-edge__device-center small {
    color: #73737e;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .13em;
}

.production-edge__device-center strong {
    margin-top: 10px;

    color: var(--production-accent);

    font-size: clamp(30px, 3vw, 45px);
    font-weight: 500;

    letter-spacing: -.045em;
}

.production-edge__device-center span {
    margin-top: 8px;

    color: #8b8b96;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}


/* SERVICES */

.production-edge__device-services {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1px;

    background: rgba(61, 139, 255, .12);
}

.production-edge__device-services > div {
    min-height: 58px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    gap: 3px;

    padding: 8px;

    background: #080b10;
}

.production-edge__device-services span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
}

.production-edge__device-services small {
    color: #5f5f6a;

    font-size: 9px;
    font-weight: 700;
}


/* FOOTER */

.production-edge__device-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 15px;

    margin-top: 18px;
}

.production-edge__device-footer span,
.production-edge__device-footer strong {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-edge__device-footer span {
    color: #62626d;
}

.production-edge__device-footer strong {
    color: #8d8d98;
}


/* =========================================================
   OUTPUT
   ========================================================= */

.production-edge__output {
    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 1px;

    background: rgba(255, 255, 255, .07);
}

.production-edge__output .production-edge__side-label {
    grid-column: 1 / -1;

    margin: 0;
    padding: 0 0 12px;

    background: #060608;
}

.production-edge__endpoint {
    min-height: 105px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    gap: 12px;

    padding: 16px;

    background: #09090c;
}

.production-edge__endpoint > span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-edge__endpoint > div {
    display: flex;
    flex-direction: column;

    gap: 4px;
}

.production-edge__endpoint strong {
    color: #aaaab3;

    font-size: 10px;
    font-weight: 700;
}

.production-edge__endpoint small {
    color: #686873;

    font-size: 9px;
}


/* =========================================================
   CONNECTION
   ========================================================= */

.production-edge__connection {
    display: grid;

    grid-template-columns:
        auto
        1fr
        auto
        1fr
        auto;

    gap: 18px;

    align-items: center;

    margin: 0 55px 45px;
    padding-top: 25px;

    border-top: 1px solid rgba(255, 255, 255, .06);
}

.production-edge__connection span,
.production-edge__connection strong {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
}

.production-edge__connection span {
    color: #666671;
}

.production-edge__connection strong {
    color: var(--production-accent);
}

.production-edge__connection i {
    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .12),
            rgba(61, 139, 255, .5)
        );
}


/* =========================================================
   DELIVERY
   ========================================================= */

.production-edge__delivery {
    margin-top: 50px;

    padding: 35px;

    border: 1px solid rgba(255, 255, 255, .08);

    background: #08080b;
}

.production-edge__delivery-head small {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-edge__delivery-head h3 {
    margin: 10px 0 0;

    color: #c9c9d0;

    font-size: 23px;
    font-weight: 500;

    letter-spacing: -.025em;
}

.production-edge__delivery-flow {
    display: flex;
    align-items: flex-start;

    margin-top: 38px;
}

.production-edge__delivery-flow > div {
    flex: 0 0 155px;

    display: flex;
    flex-direction: column;

    gap: 5px;
}

.production-edge__delivery-flow > div > span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
}

.production-edge__delivery-flow small {
    color: #656570;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-edge__delivery-flow strong {
    color: #aaaab3;

    font-size: 12px;
    font-weight: 500;
}

.production-edge__delivery-flow p {
    margin: 8px 0 0;

    color: #777782;

    font-size: 10px;
    line-height: 1.55;
}

.production-edge__delivery-flow > i {
    flex: 1;

    min-width: 20px;
    height: 1px;

    margin: 20px 17px 0;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .12),
            rgba(61, 139, 255, .5)
        );
}

.production-edge__delivery-final strong {
    color: var(--production-accent);
}


/* =========================================================
   LOCAL
   ========================================================= */

.production-edge__local {
    display: grid;

    grid-template-columns:
        minmax(300px, .8fr)
        minmax(0, 1.2fr);

    gap: 65px;

    align-items: center;

    margin-top: 20px;

    padding: 40px;

    border: 1px solid rgba(61, 139, 255, .13);

    background:
        radial-gradient(
            circle at 72% 50%,
            rgba(61, 139, 255, .05),
            transparent 38%
        ),
        #08080b;
}

.production-edge__local-copy small {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-edge__local-copy h3 {
    max-width: 500px;

    margin: 14px 0 0;

    color: #cacad1;

    font-size: 25px;
    font-weight: 500;
    line-height: 1.2;

    letter-spacing: -.03em;
}

.production-edge__local-copy p {
    max-width: 510px;

    margin: 15px 0 0;

    color: #8c8c97;

    font-size: 13px;
    line-height: 1.68;
}


/* MAP */

.production-edge__local-map {
    display: flex;
    align-items: center;
}

.production-edge__local-map > div {
    min-width: 85px;

    display: flex;
    flex-direction: column;

    gap: 4px;

    padding: 14px;

    border: 1px solid rgba(255, 255, 255, .075);

    background: #09090c;
}

.production-edge__local-map span {
    color: #9d9da7;

    font-size: 9px;
    font-weight: 700;
}

.production-edge__local-map small {
    color: #62626d;

    font-size: 9px;
    font-weight: 700;
}

.production-edge__local-map > i {
    flex: 1;

    min-width: 10px;
    height: 1px;

    background: rgba(61, 139, 255, .28);
}

.production-edge__local-map
.production-edge__local-core {
    min-width: 115px;

    align-items: center;

    border-color: rgba(61, 139, 255, .42);

    background: rgba(61, 139, 255, .045);
}

.production-edge__local-core span {
    color: #777782;
}

.production-edge__local-core strong {
    color: var(--production-accent);

    font-size: 14px;
    font-weight: 500;
}


/* =========================================================
   PLATFORM
   ========================================================= */

.production-edge__platform {
    display: grid;

    grid-template-columns:
        1fr
        50px
        1fr
        80px
        1fr;

    gap: 15px;

    align-items: center;

    margin-top: 50px;
}

.production-edge__platform > div:not(.production-edge__platform-or) {
    min-height: 125px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    gap: 6px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .075);

    background: #08080b;
}

.production-edge__platform small {
    color: #666671;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
}

.production-edge__platform strong {
    color: #b5b5bd;

    font-size: 14px;
    font-weight: 500;
}

.production-edge__platform span {
    color: #74747f;

    font-size: 10px;
}

.production-edge__platform-or {
    display: flex;
    align-items: center;
    justify-content: center;

    color: #666671;

    font-size: 9px;
    font-weight: 700;
}

.production-edge__platform > i {
    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .12),
            rgba(61, 139, 255, .55)
        );
}

.production-edge__platform
.production-edge__platform-result {
    border-color: rgba(61, 139, 255, .36);

    background: rgba(61, 139, 255, .035);
}

.production-edge__platform-result strong {
    color: var(--production-accent);
}


/* =========================================================
   STATEMENT
   ========================================================= */

.production-edge__statement {
    display: grid;

    grid-template-columns:
        minmax(200px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-top: 65px;
    padding-top: 35px;

    border-top: 1px solid rgba(255, 255, 255, .075);
}

.production-edge__statement > span {
    color: var(--production-accent);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .15em;
}

.production-edge__statement p {
    max-width: 930px;

    margin: 0;

    color: #9b9ba5;

    font-size: clamp(20px, 2vw, 29px);
    line-height: 1.48;

    letter-spacing: -.025em;
}

.production-edge__statement strong {
    color: #d3d3d8;

    font-weight: 500;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

    .production-edge {
        padding: 110px 0;
    }

    .production-edge__header {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-edge__diagram {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-edge__input {
        grid-template-columns: 1fr;
    }

    .production-edge__line {
        display: none;
    }

    .production-edge__output {
        grid-template-columns: repeat(2, 1fr);
    }

    .production-edge__delivery-flow {
        display: grid;

        grid-template-columns: repeat(5, 1fr);

        gap: 1px;

        background: rgba(61, 139, 255, .12);
    }

    .production-edge__delivery-flow > div {
        min-width: 0;

        padding: 15px;

        background: #08080b;
    }

    .production-edge__delivery-flow > i {
        display: none;
    }

    .production-edge__local {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .production-edge__statement {
        grid-template-columns: 1fr;

        gap: 20px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .production-edge {
        padding: 90px 0 75px;
    }

    .production-edge__intro h2 {
        font-size: clamp(42px, 12vw, 58px);
    }

    .production-edge__intro > p:last-child {
        font-size: 15px;
    }

    .production-edge__architecture-head {
        align-items: flex-start;
        flex-direction: column;

        padding: 20px;
    }

    .production-edge__architecture-head > div:first-child {
        align-items: flex-start;
        flex-direction: column;

        gap: 6px;
    }

    .production-edge__diagram {
        min-height: 0;

        padding: 30px 16px;
    }

    .production-edge__device {
        min-height: 370px;
    }

    .production-edge__device-services {
        grid-template-columns: repeat(2, 1fr);
    }

    .production-edge__output {
        grid-template-columns: 1fr;
    }

    .production-edge__connection {
        grid-template-columns: 1fr;

        gap: 10px;

        margin: 0 16px 25px;
    }

    .production-edge__connection i {
        width: 1px;
        height: 18px;
    }

    .production-edge__delivery {
        padding: 23px;
    }

    .production-edge__delivery-flow {
        grid-template-columns: 1fr;
    }

    .production-edge__local {
        padding: 24px;
    }

    .production-edge__local-map {
        align-items: stretch;
        flex-direction: column;
    }

    .production-edge__local-map > div {
        width: 100%;
    }

    .production-edge__local-map > i {
        flex: none;

        width: 1px;
        height: 18px;

        margin-left: 15px;
    }

    .production-edge__platform {
        grid-template-columns: 1fr;

        gap: 10px;
    }

    .production-edge__platform-or {
        min-height: 30px;
    }

    .production-edge__platform > i {
        width: 1px;
        height: 25px;

        margin: auto;
    }

}

/* =========================================================
   11 / FAQ
   ========================================================= */

.production-faq {
    position: relative;

    padding: 140px 0 130px;

    border-top: 1px solid rgba(255, 255, 255, .055);

    background: #070709;
}

.production-faq__header {
    display: grid;

    grid-template-columns:
        minmax(190px, .55fr)
        minmax(0, 1.45fr);

    gap: 70px;

    margin-bottom: 75px;
}

.production-faq__intro {
    max-width: 1050px;
}

.production-faq__intro h2 {
    margin: 0;

    color: #f1f1f4;

    font-size: clamp(48px, 5vw, 82px);
    font-weight: 500;

    line-height: .98;
    letter-spacing: -.055em;
}

.production-faq__intro h2 span {
    color: var(--production-accent);
}

.production-faq__intro > p:last-child {
    max-width: 700px;

    margin: 30px 0 0;

    color: #9696a0;

    font-size: 16px;
    line-height: 1.7;
}


/* LIST */

.production-faq__list {
    border-top: 1px solid rgba(255, 255, 255, .09);
}

.production-faq__item {
    border-bottom: 1px solid rgba(255, 255, 255, .09);
}

.production-faq__item summary {
    position: relative;

    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr)
        40px;

    gap: 25px;

    align-items: center;

    min-height: 105px;

    padding: 0 20px;

    cursor: pointer;

    list-style: none;

    transition:
        background .3s ease,
        padding-left .3s ease;
}

.production-faq__item summary::-webkit-details-marker {
    display: none;
}

.production-faq__item summary:hover {
    padding-left: 27px;

    background: rgba(61, 139, 255, .018);
}

.production-faq__item summary > span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;

    letter-spacing: .1em;
}

.production-faq__item summary strong {
    color: #c8c8cf;

    font-size: clamp(17px, 1.5vw, 22px);
    font-weight: 500;

    letter-spacing: -.02em;
}


/* PLUS */

.production-faq__item summary > i {
    position: relative;

    width: 24px;
    height: 24px;

    justify-self: end;
}

.production-faq__item summary > i::before,
.production-faq__item summary > i::after {
    content: "";

    position: absolute;

    top: 50%;
    left: 50%;

    background: #777782;

    transform: translate(-50%, -50%);

    transition:
        transform .3s ease,
        background .3s ease;
}

.production-faq__item summary > i::before {
    width: 15px;
    height: 1px;
}

.production-faq__item summary > i::after {
    width: 1px;
    height: 15px;
}

.production-faq__item[open] summary > i::after {
    transform:
        translate(-50%, -50%)
        rotate(90deg);
}

.production-faq__item[open] summary > i::before,
.production-faq__item[open] summary > i::after {
    background: var(--production-accent);
}


/* ANSWER */

.production-faq__answer {
    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr)
        40px;

    gap: 25px;

    padding: 0 20px 38px;
}

.production-faq__answer p {
    grid-column: 2;

    max-width: 850px;

    margin: 0;

    color: #898994;

    font-size: 14px;
    line-height: 1.75;
}


/* OPEN */

.production-faq__item[open] summary strong {
    color: #e0e0e4;
}


/* MOBILE */

@media (max-width: 1050px) {

    .production-faq {
        padding: 110px 0;
    }

    .production-faq__header {
        grid-template-columns: 1fr;

        gap: 35px;
    }

}

@media (max-width: 650px) {

    .production-faq {
        padding: 90px 0 75px;
    }

    .production-faq__intro h2 {
        font-size: clamp(42px, 12vw, 58px);
    }

    .production-faq__item summary {
        grid-template-columns:
            35px
            minmax(0, 1fr)
            30px;

        gap: 12px;

        min-height: 90px;

        padding: 0 5px;
    }

    .production-faq__item summary:hover {
        padding-left: 5px;
    }

    .production-faq__answer {
        grid-template-columns:
            35px
            minmax(0, 1fr);

        gap: 12px;

        padding: 0 5px 30px;
    }

    .production-faq__answer p {
        font-size: 13px;
    }

}

/* =========================================================
   12 / CONTACT
   ========================================================= */

.production-contact {
    position: relative;

    padding: 80px 0 55px;

    overflow: hidden;

    border-top: 1px solid rgba(255, 255, 255, .07);

    background:
        radial-gradient(
            circle at 68% 42%,
            rgba(61, 139, 255, .09),
            transparent 30%
        ),
        radial-gradient(
            circle at 82% 70%,
            rgba(164, 92, 255, .045),
            transparent 25%
        ),
        #060608;
}

.production-contact::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .012) 1px,
            transparent 1px
        );

    background-size: 72px 72px;
}


/* TOP */

.production-contact__top {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;
}

.production-contact__status {
    display: flex;
    align-items: center;

    gap: 9px;

    color: #777782;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .13em;
}

.production-contact__status i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--production-accent);

    box-shadow:
        0 0 12px rgba(61, 139, 255, .8);
}


/* MAIN */

.production-contact__main {
    max-width: 1150px;

    margin-top: 100px;
}

.production-contact__main h2 {
    margin: 0;

    color: #f2f2f5;

    font-size: clamp(60px, 7.5vw, 125px);
    font-weight: 500;

    line-height: .9;
    letter-spacing: -.065em;
}

.production-contact__main h2 span {
    color: var(--production-accent);
}

.production-contact__main > p:last-child {
    max-width: 700px;

    margin: 38px 0 0;

    color: #9797a1;

    font-size: 16px;
    line-height: 1.7;
}


/* ACTIONS */

.production-contact__actions {
    display: grid;

    grid-template-columns:
        minmax(0, 1.4fr)
        minmax(300px, .6fr);

    gap: 1px;

    margin-top: 75px;

    background: rgba(255, 255, 255, .08);
}

.production-contact__actions a {
    position: relative;

    min-height: 145px;

    display: grid;

    grid-template-columns:
        minmax(120px, .45fr)
        minmax(0, 1fr)
        50px;

    gap: 25px;

    align-items: center;

    padding: 30px;

    text-decoration: none;

    transition:
        background .35s ease,
        border-color .35s ease;
}

.production-contact__primary {
    background:
        linear-gradient(
            110deg,
            rgba(61, 139, 255, .09),
            rgba(61, 139, 255, .025)
        ),
        #080a0f;
}

.production-contact__secondary {
    background: #08080b;
}

.production-contact__actions a:hover {
    background: rgba(61, 139, 255, .075);
}

.production-contact__actions a > span {
    color: var(--production-accent);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .12em;
}

.production-contact__actions a > strong {
    color: #d1d1d7;

    font-size: clamp(16px, 1.7vw, 25px);
    font-weight: 500;

    letter-spacing: -.025em;
}

.production-contact__actions a > i {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    border: 1px solid rgba(61, 139, 255, .22);
    border-radius: 50%;

    color: var(--production-accent);

    font-size: 18px;
    font-style: normal;

    transition:
        transform .35s ease,
        border-color .35s ease;
}

.production-contact__actions a:hover > i {
    transform: translateX(4px);

    border-color: rgba(61, 139, 255, .55);
}


/* FOOTER FLOW */

.production-contact__footer {
    display: grid;

    grid-template-columns:
        auto 1fr
        auto 1fr
        auto 1fr
        auto 1fr
        auto;

    gap: 17px;

    align-items: center;

    margin-top: 80px;
    padding-top: 28px;

    border-top: 1px solid rgba(255, 255, 255, .07);
}

.production-contact__footer span,
.production-contact__footer strong {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
}

.production-contact__footer span {
    color: #60606b;
}

.production-contact__footer strong {
    color: var(--production-accent);
}

.production-contact__footer i {
    height: 1px;

    background:
        linear-gradient(
            90deg,
            rgba(61, 139, 255, .08),
            rgba(61, 139, 255, .35)
        );
}


/* TABLET */

@media (max-width: 900px) {

    .production-contact__actions {
        grid-template-columns: 1fr;
    }

}


/* MOBILE */

@media (max-width: 650px) {

    .production-contact {
        padding: 65px 0 40px;
    }

    .production-contact__top {
        align-items: flex-start;
        flex-direction: column;
    }

    .production-contact__main {
        margin-top: 75px;
    }

    .production-contact__main h2 {
        font-size: clamp(55px, 16vw, 80px);
    }

    .production-contact__main > p:last-child {
        font-size: 14px;
    }

    .production-contact__actions {
        margin-top: 55px;
    }

    .production-contact__actions a {
        min-height: 125px;

        grid-template-columns:
            1fr
            42px;

        gap: 10px;

        padding: 23px;
    }

    .production-contact__actions a > span {
        grid-column: 1 / -1;
    }

    .production-contact__footer {
        grid-template-columns: 1fr;

        gap: 12px;

        margin-top: 55px;
    }

    .production-contact__footer i {
        width: 1px;
        height: 12px;
    }

}

/* footer */
.footer p,
.footer p span,
.footer a[href="/polityka-prywatnosci/"],
.footer a[href="/cookies/"] {
    color: #9a9aa3;
}