/* ========================================================
   COILHOOK PRODUCT DETAIL V2
   PART 1: BASE + BUTTONS + HERO
   ======================================================== */

.pd-page {
    --pd-blue: #0c53a5;
    --pd-blue-deep: #06417d;
    --pd-navy: #022041;
    --pd-navy-deep: #011629;
    --pd-text: #2f4051;
    --pd-muted: #687585;
    --pd-line: #cbd4dd;
    --pd-soft: #edf1f4;
    --pd-soft-light: #f7f9fc;
    --pd-white: #ffffff;

    width: 100%;
    overflow: hidden;
    color: var(--pd-text);
    background: #ffffff;
    font-family:
        Shabnam,
        Tahoma,
        Arial,
        sans-serif;
}

.pd-page *,
.pd-page *::before,
.pd-page *::after {
    box-sizing: border-box;
}

.pd-page a {
    text-decoration: none;
}

.pd-page img {
    max-width: 100%;
}

.pd-shell {
    width: min(
        100%,
        1540px
    );
    margin-inline: auto;
    padding-inline:
        clamp(
            20px,
            4.8vw,
            88px
        );
}

.pd-section {
    padding-block:
        clamp(
            88px,
            8vw,
            138px
        );
}

.pd-kicker,
.pd-industrial-gallery__kicker {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--pd-blue);
    font-size: 12px;
    font-weight: 950;
    letter-spacing: 0.085em;
    line-height: 1.5;
    direction: ltr;
    text-transform: uppercase;
}

.pd-kicker::before,
.pd-industrial-gallery__kicker::before {
    content: "";
    width: 45px;
    height: 2px;
    background: currentColor;
}

.pd-kicker--light {
    color: #8cc7f7;
}

.pd-head {
    max-width: 930px;
    margin-bottom:
        clamp(
            43px,
            5vw,
            72px
        );
}

.pd-head h2,
.pd-split h2,
.pd-applications h2,
.pd-specs h2,
.pd-catalog h2,
.pd-rfq h2,
.pd-final h2 {
    margin: 14px 0 0;
    color: var(--pd-navy);
    font-size:
        clamp(
            31px,
            3.35vw,
            52px
        );
    font-weight: 950;
    line-height: 1.42;
    letter-spacing: -0.035em;
}

.pd-head p,
.pd-split p,
.pd-applications p,
.pd-specs p,
.pd-catalog p,
.pd-rfq p,
.pd-final p {
    margin: 15px 0 0;
    color: var(--pd-muted);
    font-size: 15px;
    font-weight: 550;
    line-height: 2.1;
}

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

.pd-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.pd-btn {
    min-height: 52px;
    padding-inline: 24px;
    border: 1px solid transparent;
    border-radius: 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--pd-navy);
    background: #ffffff;
    font-size: 13px;
    font-weight: 900;
    transition:
        color 0.22s ease,
        background-color 0.22s ease,
        border-color 0.22s ease,
        transform 0.22s ease,
        box-shadow 0.22s ease;
}

.pd-btn:hover,
.pd-btn:focus-visible {
    transform: translateY(-3px);
}

.pd-btn--primary {
    color: #ffffff;
    border-color: var(--pd-blue);
    background: var(--pd-blue);
    box-shadow:
        0 15px 34px
        rgba(12, 83, 165, 0.21);
}

.pd-btn--primary:hover,
.pd-btn--primary:focus-visible {
    border-color: var(--pd-navy);
    background: var(--pd-navy);
}

.pd-btn--light {
    color: var(--pd-navy);
    border-color: #ffffff;
    background: #ffffff;
}

.pd-btn--outline {
    color: var(--pd-navy);
    border-color:
        rgba(2, 32, 65, 0.27);
    background: transparent;
}

.pd-btn--outline:hover,
.pd-btn--outline:focus-visible {
    color: var(--pd-blue);
    border-color: var(--pd-blue);
    background: #ffffff;
}

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

.pd-hero {
    position: relative;
    min-height: 790px;
    overflow: hidden;
    isolation: isolate;
    display: flex;
    align-items: center;
    background:
        linear-gradient(
            112deg,
            #e9eef2 0%,
            #f8fafc 43%,
            #ffffff 100%
        );
}

.pd-hero::before {
    content: "";
    position: absolute;
    z-index: 4;
    top: 0;
    right: 0;
    width: 5px;
    height: 100%;
    background: var(--pd-blue);
}

.pd-hero::after {
    content: "";
    position: absolute;
    z-index: 4;
    right: 0;
    bottom: 0;
    left: 0;
    height: 3px;
    background:
        linear-gradient(
            90deg,
            var(--pd-blue) 0 32%,
            rgba(2, 32, 65, 0.15) 32%
        );
}

.pd-hero__bg {
    position: absolute;
    z-index: 0;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(
            rgba(2, 32, 65, 0.04)
            1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(2, 32, 65, 0.04)
            1px,
            transparent 1px
        );
    background-size:
        92px 92px,
        92px 92px;
}

.pd-hero__bg::before {
    content: "ENGINEERED LIFTING";
    position: absolute;
    top: 34px;
    left: 2vw;
    color:
        rgba(2, 32, 65, 0.035);
    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;
    font-size:
        clamp(
            62px,
            9vw,
            156px
        );
    font-weight: 950;
    letter-spacing: -0.065em;
    white-space: nowrap;
    direction: ltr;
}

.pd-hero__grid {
    position: relative;
    z-index: 3;
    min-height: 790px;
    padding-block:
        clamp(
            82px,
            7vw,
            118px
        );
    display: grid;
    grid-template-columns:
        minmax(500px, 1.02fr)
        minmax(480px, 0.98fr);
    grid-template-areas:
        "visual content";
    align-items: center;
    gap:
        clamp(
            58px,
            7vw,
            125px
        );
    direction: ltr;
}

.pd-hero__content {
    grid-area: content;
    max-width: 770px;
    direction: rtl;
}

.pd-pill {
    min-height: 37px;
    padding-inline: 15px;
    border: 1px solid
        rgba(12, 83, 165, 0.24);
    border-radius: 2px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--pd-blue-deep);
    background:
        rgba(255, 255, 255, 0.83);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.055em;
    direction: ltr;
}

.pd-pill i {
    color: var(--pd-blue);
}

.pd-hero h1 {
    max-width: 740px;
    margin: 25px 0 0;
    color: var(--pd-navy);
    font-size:
        clamp(
            39px,
            3.85vw,
            59px
        );
    font-weight: 950;
    line-height: 1.34;
    letter-spacing: -0.044em;
}

.pd-hero h1::after {
    content: "";
    display: block;
    width: 98px;
    height: 4px;
    margin-top: 20px;
    background: var(--pd-blue);
}

.pd-lead {
    max-width: 710px;
    margin: 23px 0 0;
    color: #273e54;
    font-size:
        clamp(
            18px,
            1.55vw,
            24px
        );
    font-weight: 850;
    line-height: 1.95;
}

.pd-desc {
    max-width: 715px;
    margin: 14px 0 0;
    color: var(--pd-muted);
    font-size: 15px;
    line-height: 2.1;
}

.pd-hero .pd-actions {
    margin-top: 30px;
}

.pd-keywords {
    max-width: 715px;
    margin-top: 34px;
    padding-top: 23px;
    border-top: 1px solid var(--pd-line);
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.pd-keywords span {
    min-height: 31px;
    padding-inline: 10px;
    border: 1px solid
        rgba(2, 32, 65, 0.14);
    border-radius: 2px;
    display: inline-flex;
    align-items: center;
    color: #5d6d7c;
    background:
        rgba(255, 255, 255, 0.62);
    font-size: 10px;
    font-weight: 800;
    direction: ltr;
}

.pd-hero__visual {
    grid-area: visual;
    position: relative;
    min-height: 640px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    box-shadow: none;
    direction: ltr;
}

.pd-product-stage {
    position: relative;
    width: 100%;
    min-height: 620px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    box-shadow: none;
}

/*
 * فقط دو خط فنی پشت رندر؛
 * بدون دایره، هاله یا سایه زمینی.
 */

.pd-product-stage::before,
.pd-product-stage::after {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
}

.pd-product-stage::before {
    top: 7%;
    bottom: 7%;
    left: 50%;
    width: 1px;
    background:
        linear-gradient(
            transparent,
            rgba(12, 83, 165, 0.22),
            transparent
        );
}

.pd-product-stage::after {
    top: 50%;
    right: 7%;
    left: 7%;
    height: 1px;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(12, 83, 165, 0.22),
            transparent
        );
}

.pd-product-stage img {
    position: relative;
    z-index: 3;
    display: block;
    width: min(
        100%,
        690px
    );
    height: auto;
    max-height: 635px;
    object-fit: contain;
    border: 0;
    outline: 0;
    background: transparent;
    box-shadow: none;
    transform:
        perspective(1300px)
        rotateY(-3deg)
        rotateX(1deg)
        translateY(-5px);
    filter:
        drop-shadow(
            0 8px 8px
            rgba(2, 32, 65, 0.17)
        )
        drop-shadow(
            0 23px 22px
            rgba(2, 32, 65, 0.24)
        )
        drop-shadow(
            0 40px 36px
            rgba(2, 32, 65, 0.16)
        );
    transition:
        transform 0.34s ease,
        filter 0.34s ease;
}

.pd-product-stage:hover img {
    transform:
        perspective(1300px)
        rotateY(-1deg)
        rotateX(0)
        translateY(-14px)
        scale(1.025);
    filter:
        drop-shadow(
            0 9px 9px
            rgba(2, 32, 65, 0.19)
        )
        drop-shadow(
            0 27px 25px
            rgba(2, 32, 65, 0.27)
        )
        drop-shadow(
            0 45px 40px
            rgba(2, 32, 65, 0.18)
        );
}

/* END PRODUCT DETAIL V2 PART 1 */

/* ========================================================
   PRODUCT DETAIL V2 PART 2
   INTRO + FEATURES + APPLICATIONS
   ======================================================== */

/* ========================================================
   PRODUCT INTRO
   ======================================================== */

.pd-intro {
    position: relative;
    background: #ffffff;
}

.pd-intro::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 31%;
    height: 1px;
    background: var(--pd-blue);
}

.pd-split {
    display: grid;
    grid-template-columns:
        minmax(330px, 0.72fr)
        minmax(0, 1.28fr);
    align-items: start;
    gap:
        clamp(
            55px,
            8vw,
            130px
        );
}

.pd-split > div:first-child {
    position: sticky;
    top: 130px;
    padding-top: 5px;
}

.pd-split h2 {
    max-width: 570px;
}

.pd-rich {
    position: relative;
    padding:
        7px 0
        7px
        clamp(
            0px,
            2vw,
            20px
        );

    padding-right:
        clamp(
            27px,
            4vw,
            61px
        );

    border-right:
        3px solid
        var(--pd-blue);
}

.pd-rich::before {
    content: "";
    position: absolute;
    top: 0;
    right: -3px;
    width: 3px;
    height: 48px;
    background: var(--pd-navy);
}

.pd-rich > p:first-child {
    max-width: 820px;
    margin-top: 0;
    color: #34495e;
    font-size:
        clamp(
            17px,
            1.45vw,
            20px
        );
    font-weight: 750;
    line-height: 2.12;
}

.pd-rich > p:nth-child(2) {
    margin-top: 23px;
    color: var(--pd-navy);
    font-size: 14px;
    font-weight: 900;
}

.pd-chip-list {
    margin-top: 25px;
    display: grid;
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    border-top:
        1px solid
        var(--pd-line);

    border-right:
        1px solid
        var(--pd-line);
}

.pd-chip-list span {
    position: relative;
    min-height: 58px;
    padding:
        13px 16px;

    border-left:
        1px solid
        var(--pd-line);

    border-bottom:
        1px solid
        var(--pd-line);

    display: flex;
    align-items: center;
    gap: 10px;

    color: #3c5165;
    background: #f8fafb;

    font-size: 13px;
    font-weight: 850;

    transition:
        color 0.22s ease,
        background-color 0.22s ease;
}

.pd-chip-list span:hover {
    color: #ffffff;
    background: var(--pd-blue);
}

.pd-chip-list i {
    color: var(--pd-blue);
    font-size: 12px;
}

.pd-chip-list span:hover i {
    color: #ffffff;
}

/* ========================================================
   PRODUCT FEATURES
   ======================================================== */

.pd-features {
    position: relative;
    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #edf1f4 0%,
            #f8fafb 100%
        );
}

.pd-features::before {
    content: "ENGINEERING FEATURES";
    position: absolute;
    top: 32px;
    left: 2.5vw;

    color:
        rgba(
            2,
            32,
            65,
            0.035
        );

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size:
        clamp(
            54px,
            8vw,
            138px
        );

    font-weight: 950;
    letter-spacing: -0.055em;
    white-space: nowrap;
    direction: ltr;
    pointer-events: none;
}

.pd-features > .pd-shell {
    position: relative;
    z-index: 2;
}

.pd-feature-grid {
    display: grid;
    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );
    gap: 16px;
}

.pd-feature-card {
    position: relative;
    min-height: 278px;
    padding: 32px;
    overflow: hidden;

    border:
        1px solid
        #c5ced7;

    border-radius: 2px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f8fafb
        );

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.pd-feature-card::before {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;

    width: 54px;
    height: 3px;

    background:
        var(--pd-blue);

    transition:
        width 0.25s ease;
}

.pd-feature-card::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;

    width: 28px;
    height: 28px;

    border-top:
        1px solid
        rgba(
            12,
            83,
            165,
            0.35
        );

    border-left:
        1px solid
        rgba(
            12,
            83,
            165,
            0.35
        );
}

.pd-feature-card:hover {
    border-color:
        rgba(
            12,
            83,
            165,
            0.5
        );

    transform:
        translateY(-7px);

    box-shadow:
        0 29px 70px
        rgba(
            2,
            32,
            65,
            0.13
        );
}

.pd-feature-card:hover::before {
    width: 100%;
}

.pd-feature-card > i {
    width: 60px;
    height: 60px;

    border:
        1px solid
        rgba(
            12,
            83,
            165,
            0.23
        );

    border-radius: 2px;

    display: grid;
    place-items: center;

    color: var(--pd-blue);
    background: #f1f5f8;

    font-size: 21px;

    transition:
        color 0.23s ease,
        background-color 0.23s ease,
        border-color 0.23s ease;
}

.pd-feature-card:hover > i {
    color: #ffffff;
    border-color: var(--pd-blue);
    background: var(--pd-blue);
}

.pd-feature-card h3 {
    margin: 29px 0 0;

    color: var(--pd-navy);

    font-size: 19px;
    font-weight: 900;
    line-height: 1.75;
}

.pd-feature-card p {
    margin: 10px 0 0;

    color: var(--pd-muted);

    font-size: 14px;
    font-weight: 550;
    line-height: 2;
}

/* ========================================================
   PRODUCT APPLICATIONS
   ======================================================== */

.pd-applications {
    position: relative;
    overflow: hidden;

    color: #ffffff;

    background:
        linear-gradient(
            120deg,
            #01162a 0%,
            #022041 55%,
            #06427f 100%
        );
}

.pd-applications::before {
    content: "";
    position: absolute;
    inset: 0;

    opacity: 0.36;

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

    background-size:
        68px 68px;
}

.pd-applications::after {
    content: "APPLICATIONS";
    position: absolute;
    left: 2.5vw;
    bottom: 8px;

    color:
        rgba(
            255,
            255,
            255,
            0.035
        );

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size:
        clamp(
            65px,
            10vw,
            165px
        );

    font-weight: 950;
    letter-spacing: -0.055em;
    white-space: nowrap;
    direction: ltr;
    pointer-events: none;
}

.pd-applications__grid {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(
            340px,
            0.73fr
        )
        minmax(
            0,
            1.27fr
        );

    align-items: center;

    gap:
        clamp(
            55px,
            8vw,
            125px
        );
}

.pd-applications h2,
.pd-applications p {
    color: #ffffff;
}

.pd-applications h2 {
    max-width: 600px;
}

.pd-applications p {
    max-width: 600px;

    color:
        rgba(
            255,
            255,
            255,
            0.75
        );
}

.pd-applications .pd-kicker {
    color: #8cc8f8;
}

.pd-app-list {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

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

    border-right:
        1px solid
        rgba(
            255,
            255,
            255,
            0.17
        );
}

.pd-app-list span {
    min-height: 69px;
    padding: 15px 18px;

    border-left:
        1px solid
        rgba(
            255,
            255,
            255,
            0.17
        );

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

    display: flex;
    align-items: center;
    gap: 10px;

    color:
        rgba(
            255,
            255,
            255,
            0.86
        );

    background:
        rgba(
            255,
            255,
            255,
            0.035
        );

    font-size: 14px;
    font-weight: 850;

    transition:
        color 0.22s ease,
        background-color 0.22s ease;
}

.pd-app-list span:hover {
    color: var(--pd-navy);
    background: #ffffff;
}

.pd-app-list i {
    color: #72b8ef;
    font-size: 12px;
}

.pd-app-list span:hover i {
    color: var(--pd-blue);
}

/* ========================================================
   PART 2 RESPONSIVE
   ======================================================== */

@media (max-width: 1120px) {
    .pd-split,
    .pd-applications__grid {
        grid-template-columns: 1fr;
    }

    .pd-split > div:first-child {
        position: static;
    }

    .pd-rich {
        max-width: 920px;
    }
}

@media (max-width: 800px) {
    .pd-chip-list,
    .pd-feature-grid,
    .pd-app-list {
        grid-template-columns: 1fr;
    }

    .pd-feature-card {
        min-height: auto;
    }

    .pd-rich {
        padding-right: 22px;
    }

    .pd-features::before,
    .pd-applications::after {
        display: none;
    }
}

/* END PRODUCT DETAIL V2 PART 2 */

/* ========================================================
   PRODUCT DETAIL V2 PART 3
   SPECS + STANDARDS + INDUSTRIAL GALLERY + LIGHTBOX
   ======================================================== */

/* ========================================================
   TECHNICAL SPECIFICATIONS
   ======================================================== */

.pd-specs {
    position: relative;
    overflow: hidden;
    background: #eef2f5;
}

.pd-specs::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(
                2,
                32,
                65,
                0.035
            )
            1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(
                2,
                32,
                65,
                0.035
            )
            1px,
            transparent 1px
        );

    background-size:
        72px 72px;
}

.pd-specs__box {
    position: relative;
    z-index: 2;

    padding-inline: 0;

    overflow: hidden;

    border:
        1px solid
        #bec8d2;

    border-radius: 2px;

    display: grid;

    grid-template-columns:
        minmax(
            350px,
            0.8fr
        )
        minmax(
            0,
            1.2fr
        );

    background: #ffffff;

    box-shadow:
        0 25px 70px
        rgba(
            2,
            32,
            65,
            0.1
        );
}

.pd-specs__box > div:first-child {
    position: relative;

    padding:
        clamp(
            43px,
            5vw,
            76px
        );

    overflow: hidden;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #011629 0%,
            #022041 57%,
            #06427f 100%
        );
}

.pd-specs__box > div:first-child::before {
    content: "TECHNICAL DATA";

    position: absolute;
    left: 20px;
    bottom: 5px;

    color:
        rgba(
            255,
            255,
            255,
            0.045
        );

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size:
        clamp(
            42px,
            6vw,
            100px
        );

    font-weight: 950;
    letter-spacing: -0.05em;

    white-space: nowrap;
    direction: ltr;
    pointer-events: none;
}

.pd-specs__box > div:first-child > * {
    position: relative;
    z-index: 2;
}

.pd-specs__box > div:first-child h2,
.pd-specs__box > div:first-child p {
    color: #ffffff;
}

.pd-specs__box > div:first-child p {
    color:
        rgba(
            255,
            255,
            255,
            0.75
        );
}

.pd-spec-list {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    align-content: stretch;

    background: #ffffff;
}

.pd-spec-list span {
    position: relative;

    min-height: 74px;

    padding:
        16px 20px
        16px 45px;

    border-left:
        1px solid
        var(--pd-line);

    border-bottom:
        1px solid
        var(--pd-line);

    display: flex;
    align-items: center;

    color: #34495d;
    background: #ffffff;

    font-size: 13px;
    font-weight: 850;

    transition:
        color 0.22s ease,
        background-color 0.22s ease;
}

.pd-spec-list span::after {
    content: "";

    position: absolute;
    left: 19px;
    top: 50%;

    width: 8px;
    height: 8px;

    transform:
        translateY(-50%);

    background:
        var(--pd-blue);
}

.pd-spec-list span:hover {
    color: #ffffff;
    background: var(--pd-blue);
}

.pd-spec-list span:hover::after {
    background: #ffffff;
}

.pd-spec-list span:nth-last-child(-n + 2) {
    border-bottom: 0;
}

/* ========================================================
   STANDARDS
   ======================================================== */

.pd-standards {
    position: relative;
    overflow: hidden;
    background: #ffffff;
}

.pd-standards::before {
    content: "INTERNATIONAL STANDARDS";

    position: absolute;
    top: 25px;
    left: 2vw;

    color:
        rgba(
            2,
            32,
            65,
            0.035
        );

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size:
        clamp(
            50px,
            7vw,
            125px
        );

    font-weight: 950;
    letter-spacing: -0.055em;

    white-space: nowrap;
    direction: ltr;
    pointer-events: none;
}

.pd-standards > .pd-shell {
    position: relative;
    z-index: 2;
}

.pd-standard-list {
    display: grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        );

    border-top:
        1px solid
        var(--pd-line);

    border-right:
        1px solid
        var(--pd-line);
}

.pd-standard-list span {
    position: relative;

    min-height: 112px;
    padding: 20px;

    border-left:
        1px solid
        var(--pd-line);

    border-bottom:
        1px solid
        var(--pd-line);

    display: grid;
    place-items: center;

    overflow: hidden;

    color: var(--pd-navy);
    background: #f8fafb;

    font-size: 16px;
    font-weight: 950;
    text-align: center;
    direction: ltr;

    transition:
        color 0.22s ease,
        background-color 0.22s ease,
        transform 0.22s ease;
}

.pd-standard-list span::before {
    content: "";

    position: absolute;
    right: 0;
    bottom: 0;

    width: 28px;
    height: 3px;

    background:
        var(--pd-blue);

    transition:
        width 0.22s ease;
}

.pd-standard-list span:hover {
    color: #ffffff;
    background: var(--pd-blue);
}

.pd-standard-list span:hover::before {
    width: 100%;
    background: #ffffff;
}

/* ========================================================
   INDUSTRIAL GALLERY
   ======================================================== */

.pd-industrial-gallery {
    position: relative;
    overflow: hidden;

    padding:
        clamp(
            80px,
            7vw,
            108px
        )
        0;

    color: var(--pd-navy);

    background:
        radial-gradient(
            circle,
            rgba(
                12,
                83,
                165,
                0.1
            )
            1px,
            transparent 1.7px
        ),
        linear-gradient(
            90deg,
            rgba(
                2,
                32,
                65,
                0.04
            )
            1px,
            transparent 1px
        ),
        linear-gradient(
            180deg,
            rgba(
                2,
                32,
                65,
                0.04
            )
            1px,
            transparent 1px
        ),
        #f7f9fc;

    background-size:
        24px 24px,
        96px 96px,
        96px 96px,
        cover;
}

.pd-industrial-gallery__word {
    position: absolute;
    left: 3vw;
    top: 37px;

    color:
        rgba(
            2,
            32,
            65,
            0.045
        );

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size:
        clamp(
            58px,
            9vw,
            160px
        );

    font-weight: 950;
    letter-spacing: -0.045em;

    direction: ltr;
    white-space: nowrap;

    pointer-events: none;
}

.pd-industrial-gallery__head {
    position: relative;
    z-index: 2;

    width:
        min(
            94%,
            1560px
        );

    margin:
        0 auto 32px;

    text-align: right;
}

.pd-industrial-gallery__kicker {
    margin-bottom: 12px;
}

.pd-industrial-gallery h2 {
    max-width: 900px;

    margin: 0;

    color: var(--pd-navy);

    font-size:
        clamp(
            32px,
            3.4vw,
            54px
        );

    font-weight: 950;
    line-height: 1.35;
}

.pd-industrial-gallery__desc {
    max-width: 760px;

    margin:
        14px 0 0;

    color: #2f2e2c;

    font-size: 15px;
    font-weight: 650;
    line-height: 2.1;
}

.pd-industrial-gallery__stage {
    position: relative;
    z-index: 2;

    width: 100%;
    margin-top: 34px;
}

.pd-industrial-gallery__rail {
    padding:
        0 18px;

    overflow-x: auto;
    overflow-y: hidden;

    display: flex;
    align-items: stretch;

    gap: 18px;

    direction: ltr;

    scroll-snap-type:
        x mandatory;

    scroll-behavior:
        smooth;

    scrollbar-width:
        none;

    cursor: grab;
    user-select: none;
    touch-action:
        pan-y;
}

.pd-industrial-gallery__rail::-webkit-scrollbar {
    display: none;
}

.pd-industrial-gallery__rail.is-dragging {
    cursor: grabbing;

    scroll-snap-type:
        none;

    scroll-behavior:
        auto;
}

.pd-industrial-gallery__slide {
    flex: 0 0 auto;

    height: 340px;

    padding: 0;
    margin: 0;

    direction: rtl;

    scroll-snap-align:
        start;
}

.pd-industrial-gallery__slide--slim {
    width: 22vw;
    min-width: 300px;
}

.pd-industrial-gallery__slide--normal {
    width: 28vw;
    min-width: 380px;
}

.pd-industrial-gallery__slide--wide {
    width: 36vw;
    min-width: 500px;
}

.pd-industrial-gallery__frame {
    position: relative;

    display: block;

    width: 100%;
    height: 100%;

    padding: 0;
    overflow: hidden;

    border:
        1px solid
        #d3dde7;

    border-radius: 0;

    cursor: zoom-in;

    background: #ffffff;

    box-shadow:
        0 15px 35px
        rgba(
            2,
            32,
            65,
            0.08
        );
}

.pd-industrial-gallery__frame::before {
    content: "";

    position: absolute;
    z-index: 2;

    inset: 14px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.3
        );

    pointer-events: none;
}

.pd-industrial-gallery__frame::after {
    content: "";

    position: absolute;
    z-index: 3;

    right: 0;
    bottom: 0;

    width: 64px;
    height: 4px;

    background:
        var(--pd-blue);

    transition:
        width 0.28s ease;
}

.pd-industrial-gallery__frame:hover::after {
    width: 100%;
}

.pd-industrial-gallery__frame img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    pointer-events: none;

    transition:
        transform 0.3s ease,
        filter 0.3s ease;
}

.pd-industrial-gallery__frame:hover img {
    transform:
        scale(1.045);

    filter:
        contrast(1.03)
        saturate(1.03);
}

/* ========================================================
   GALLERY NAVIGATION BUTTONS
   ======================================================== */

.pd-industrial-gallery__btn {
    position: absolute;
    top: 50%;
    z-index: 7;

    width: 58px;
    height: 58px;

    padding: 0;

    transform:
        translateY(-50%);

    border:
        1px solid
        #d3dde7;

    border-radius: 0;

    display: grid;
    place-items: center;

    cursor: pointer;

    color: var(--pd-navy);

    background:
        rgba(
            255,
            255,
            255,
            0.96
        );

    box-shadow:
        0 12px 35px
        rgba(
            2,
            32,
            65,
            0.15
        );

    transition:
        color 0.22s ease,
        background-color 0.22s ease,
        border-color 0.22s ease,
        transform 0.22s ease;
}

.pd-industrial-gallery__btn:hover,
.pd-industrial-gallery__btn:focus-visible {
    color: #ffffff;
    border-color: var(--pd-blue);
    background: var(--pd-blue);

    transform:
        translateY(-50%)
        scale(1.05);
}

.pd-industrial-gallery__prev {
    left: 5vw;
}

.pd-industrial-gallery__next {
    right: 5vw;
}

.pd-industrial-gallery__btn svg {
    width: 22px;
    height: 22px;

    fill: none;
    stroke: currentColor;
    stroke-width: 2.6;
}

/* ========================================================
   GALLERY LIGHTBOX
   ======================================================== */

.pd-gallery-lightbox {
    position: fixed;
    z-index: 99999;

    inset: 0;

    padding: 34px;

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

    color: #ffffff;

    background:
        rgba(
            2,
            32,
            65,
            0.95
        );

    backdrop-filter:
        blur(5px);
}

.pd-gallery-lightbox.is-open {
    display: flex;
}

.pd-gallery-lightbox__image-wrap {
    position: relative;

    max-width: 94vw;
    max-height: 88vh;

    overflow: auto;

    cursor: zoom-in;
}

.pd-gallery-lightbox__image-wrap.is-zoomed {
    cursor: zoom-out;
}

.pd-gallery-lightbox__image {
    display: block;

    max-width: 94vw;
    max-height: 88vh;

    object-fit: contain;

    background: transparent;

    box-shadow:
        0 34px 90px
        rgba(
            0,
            0,
            0,
            0.44
        );

    transform-origin:
        center center;

    transition:
        transform 0.25s ease;
}

.pd-gallery-lightbox__image-wrap.is-zoomed
.pd-gallery-lightbox__image {
    transform:
        scale(1.5);
}

.pd-gallery-lightbox__hint {
    position: absolute;
    z-index: 4;

    left: 24px;
    bottom: 22px;

    padding:
        9px 14px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.18
        );

    color: #ffffff;

    background:
        rgba(
            255,
            255,
            255,
            0.1
        );

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

.pd-gallery-lightbox__close,
.pd-gallery-lightbox__prev,
.pd-gallery-lightbox__next {
    position: absolute;
    z-index: 5;

    width: 58px;
    height: 58px;

    padding: 0;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.2
        );

    border-radius: 0;

    display: grid;
    place-items: center;

    cursor: pointer;

    color: #ffffff;

    background:
        rgba(
            255,
            255,
            255,
            0.08
        );

    font-size: 28px;
    font-weight: 900;

    transition:
        color 0.22s ease,
        background-color 0.22s ease,
        transform 0.22s ease;
}

.pd-gallery-lightbox__close:hover,
.pd-gallery-lightbox__prev:hover,
.pd-gallery-lightbox__next:hover {
    color: var(--pd-navy);
    background: #ffffff;
}

.pd-gallery-lightbox__close {
    top: 24px;
    right: 24px;
}

.pd-gallery-lightbox__close:hover {
    transform:
        rotate(90deg);
}

.pd-gallery-lightbox__prev {
    left: 28px;
    top: 50%;

    transform:
        translateY(-50%);
}

.pd-gallery-lightbox__next {
    right: 28px;
    top: 50%;

    transform:
        translateY(-50%);
}

/* ========================================================
   PART 3 RESPONSIVE
   ======================================================== */

@media (max-width: 1120px) {
    .pd-specs__box {
        grid-template-columns: 1fr;
    }

    .pd-standard-list {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }

    .pd-industrial-gallery__slide {
        height: 310px;
    }

    .pd-industrial-gallery__slide--slim {
        width: 30vw;
        min-width: 280px;
    }

    .pd-industrial-gallery__slide--normal {
        width: 38vw;
        min-width: 340px;
    }

    .pd-industrial-gallery__slide--wide {
        width: 48vw;
        min-width: 430px;
    }
}

@media (max-width: 800px) {
    .pd-spec-list {
        grid-template-columns: 1fr;
    }

    .pd-spec-list span {
        border-left: 0;
    }

    .pd-spec-list span:nth-last-child(-n + 2) {
        border-bottom:
            1px solid
            var(--pd-line);
    }

    .pd-spec-list span:last-child {
        border-bottom: 0;
    }

    .pd-standard-list {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

    .pd-industrial-gallery {
        padding:
            76px 0;
    }

    .pd-industrial-gallery__slide {
        height: 260px;
    }

    .pd-industrial-gallery__slide--slim {
        width: 44vw;
        min-width: 260px;
    }

    .pd-industrial-gallery__slide--normal {
        width: 58vw;
        min-width: 310px;
    }

    .pd-industrial-gallery__slide--wide {
        width: 72vw;
        min-width: 380px;
    }
}

@media (max-width: 560px) {
    .pd-standard-list {
        grid-template-columns: 1fr;
    }

    .pd-industrial-gallery__word {
        display: none;
    }

    .pd-industrial-gallery__rail {
        gap: 12px;
        padding:
            0 12px;
    }

    .pd-industrial-gallery__slide,
    .pd-industrial-gallery__slide--slim,
    .pd-industrial-gallery__slide--normal,
    .pd-industrial-gallery__slide--wide {
        width: 82vw;
        min-width: 82vw;
        height: 240px;
    }

    .pd-industrial-gallery__btn {
        width: 48px;
        height: 48px;
    }

    .pd-industrial-gallery__btn svg {
        width: 18px;
        height: 18px;
    }

    .pd-gallery-lightbox {
        padding: 18px;
    }

    .pd-gallery-lightbox__close,
    .pd-gallery-lightbox__prev,
    .pd-gallery-lightbox__next {
        width: 48px;
        height: 48px;
    }

    .pd-gallery-lightbox__prev {
        left: 10px;
    }

    .pd-gallery-lightbox__next {
        right: 10px;
    }

    .pd-gallery-lightbox__hint {
        display: none;
    }
}

/* END PRODUCT DETAIL V2 PART 3 */

/* ========================================================
   PRODUCT DETAIL V2 PART 4
   CATALOG + FAQ + RFQ + FINAL CTA
   ======================================================== */

/* ========================================================
   PRODUCT CATALOG
   ======================================================== */

.pd-catalog {
    position: relative;
    overflow: hidden;

    padding-block:
        clamp(
            68px,
            6vw,
            102px
        );

    color: #ffffff;

    background:
        linear-gradient(
            120deg,
            #01162a 0%,
            #022041 56%,
            #0c53a5 100%
        );
}

.pd-catalog::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

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

    background-size:
        62px 62px;
}

.pd-catalog::after {
    content: "PRODUCT CATALOG";

    position: absolute;
    left: 2vw;
    bottom: -5px;

    color:
        rgba(
            255,
            255,
            255,
            0.04
        );

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size:
        clamp(
            58px,
            8vw,
            145px
        );

    font-weight: 950;
    letter-spacing: -0.055em;

    white-space: nowrap;
    direction: ltr;
    pointer-events: none;
}

.pd-catalog__box {
    position: relative;
    z-index: 2;

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

    gap:
        clamp(
            35px,
            5vw,
            72px
        );
}

.pd-catalog__box > div:first-child {
    max-width: 780px;
}

.pd-catalog h2,
.pd-catalog p {
    color: #ffffff;
}

.pd-catalog p {
    color:
        rgba(
            255,
            255,
            255,
            0.76
        );
}

.pd-catalog .pd-kicker {
    color: #8cc8f8;
}

.pd-catalog .pd-actions {
    flex: 0 0 auto;
}

.pd-catalog .pd-btn--outline {
    color: #ffffff;

    border-color:
        rgba(
            255,
            255,
            255,
            0.48
        );

    background:
        rgba(
            255,
            255,
            255,
            0.04
        );
}

.pd-catalog .pd-btn--outline:hover,
.pd-catalog .pd-btn--outline:focus-visible {
    color: var(--pd-navy);
    border-color: #ffffff;
    background: #ffffff;
}



/* ========================================================
   FAQ
   ======================================================== */

.pd-faq {
    position: relative;
    overflow: hidden;
    background: #ffffff;
}

.pd-faq::before {
    content: "FREQUENTLY ASKED QUESTIONS";

    position: absolute;
    top: 25px;
    left: 2vw;

    color:
        rgba(
            2,
            32,
            65,
            0.032
        );

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size:
        clamp(
            45px,
            6.5vw,
            118px
        );

    font-weight: 950;
    letter-spacing: -0.055em;

    white-space: nowrap;
    direction: ltr;
    pointer-events: none;
}

.pd-faq > .pd-shell {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(
            300px,
            0.72fr
        )
        minmax(
            0,
            1.28fr
        );

    align-items: start;

    gap:
        clamp(
            55px,
            8vw,
            125px
        );
}

.pd-faq .pd-head {
    position: sticky;
    top: 125px;
    margin: 0;
}

.pd-faq-list {
    border-top:
        1px solid
        var(--pd-line);
}

.pd-faq-item {
    border-bottom:
        1px solid
        var(--pd-line);

    background: #ffffff;

    transition:
        background-color 0.22s ease;
}

.pd-faq-item[open] {
    background: #f8fafb;
}

.pd-faq-item summary {
    min-height: 91px;

    padding:
        20px 4px;

    cursor: pointer;
    list-style: none;

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

    gap: 22px;

    color: var(--pd-navy);

    font-size: 16px;
    font-weight: 900;
    line-height: 1.9;
}

.pd-faq-item summary::-webkit-details-marker {
    display: none;
}

.pd-faq-item summary::after {
    content: "+";

    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    border:
        1px solid
        var(--pd-line);

    border-radius: 0;

    display: grid;
    place-items: center;

    color: var(--pd-blue);
    background: #ffffff;

    font-family:
        Arial,
        sans-serif;

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

    transition:
        color 0.22s ease,
        background-color 0.22s ease,
        border-color 0.22s ease,
        transform 0.22s ease;
}

.pd-faq-item summary:hover::after {
    color: #ffffff;
    border-color: var(--pd-blue);
    background: var(--pd-blue);
}

.pd-faq-item[open] summary::after {
    color: #ffffff;
    border-color: var(--pd-blue);
    background: var(--pd-blue);

    transform:
        rotate(45deg);
}

.pd-faq-item p {
    max-width: 850px;

    margin: 0;

    padding:
        0 4px
        30px 62px;

    color: var(--pd-muted);

    font-size: 15px;
    font-weight: 550;
    line-height: 2.08;
}

/* ========================================================
   REQUEST FOR QUOTATION
   ======================================================== */

.pd-rfq {
    position: relative;
    overflow: hidden;
    background: #eef2f5;
}

.pd-rfq::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(
                2,
                32,
                65,
                0.035
            )
            1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(
                2,
                32,
                65,
                0.035
            )
            1px,
            transparent 1px
        );

    background-size:
        74px 74px;
}

.pd-rfq__grid {
    position: relative;
    z-index: 2;

    padding-inline: 0;

    overflow: hidden;

    border:
        1px solid
        #bdc7d1;

    border-radius: 2px;

    display: grid;

    grid-template-columns:
        minmax(
            350px,
            0.82fr
        )
        minmax(
            0,
            1.18fr
        );

    background: #ffffff;

    box-shadow:
        0 28px 76px
        rgba(
            2,
            32,
            65,
            0.11
        );
}

.pd-rfq__grid > div {
    position: relative;
    overflow: hidden;

    padding:
        clamp(
            43px,
            5vw,
            77px
        );

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #01162a 0%,
            #022041 57%,
            #06427f 100%
        );
}

.pd-rfq__grid > div::before {
    content: "RFQ";

    position: absolute;
    left: 22px;
    bottom: -10px;

    color:
        rgba(
            255,
            255,
            255,
            0.055
        );

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size:
        clamp(
            85px,
            10vw,
            170px
        );

    font-weight: 950;
    letter-spacing: -0.055em;

    direction: ltr;
    pointer-events: none;
}

.pd-rfq__grid > div > * {
    position: relative;
    z-index: 2;
}

.pd-rfq__grid > div h2,
.pd-rfq__grid > div p {
    color: #ffffff;
}

.pd-rfq__grid > div p {
    color:
        rgba(
            255,
            255,
            255,
            0.76
        );
}

.pd-rfq__grid > div .pd-kicker {
    color: #8cc8f8;
}

/* ========================================================
   RFQ FORM
   ======================================================== */

.pd-form {
    padding:
        clamp(
            34px,
            4vw,
            59px
        );

    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 16px;

    background: #ffffff;
}

.pd-form input,
.pd-form select,
.pd-form textarea {
    width: 100%;
    min-height: 54px;

    padding-inline: 15px;

    border:
        1px solid
        #c2ccd6;

    border-radius: 1px;

    outline: 0;

    color: var(--pd-navy);
    background: #ffffff;

    font-family: inherit;
    font-size: 13px;
    font-weight: 600;

    transition:
        border-color 0.22s ease,
        box-shadow 0.22s ease,
        background-color 0.22s ease;
}

.pd-form input::placeholder,
.pd-form textarea::placeholder {
    color: #82909e;
}

.pd-form textarea {
    grid-column:
        1 / -1;

    min-height: 132px;

    padding-block: 15px;

    resize: vertical;
}

.pd-form input:hover,
.pd-form select:hover,
.pd-form textarea:hover {
    border-color:
        rgba(
            12,
            83,
            165,
            0.5
        );
}

.pd-form input:focus,
.pd-form select:focus,
.pd-form textarea:focus {
    border-color:
        var(--pd-blue);

    background: #fafdff;

    box-shadow:
        0 0 0 3px
        rgba(
            12,
            83,
            165,
            0.1
        );
}

.pd-form button {
    grid-column:
        1 / -1;

    min-height: 57px;

    border:
        1px solid
        var(--pd-blue);

    border-radius: 1px;

    cursor: pointer;

    color: #ffffff;
    background: var(--pd-blue);

    font-family: inherit;
    font-size: 14px;
    font-weight: 900;

    box-shadow:
        0 14px 32px
        rgba(
            12,
            83,
            165,
            0.18
        );

    transition:
        background-color 0.22s ease,
        border-color 0.22s ease,
        transform 0.22s ease,
        box-shadow 0.22s ease;
}

.pd-form button:hover,
.pd-form button:focus-visible {
    border-color: var(--pd-navy);
    background: var(--pd-navy);

    transform:
        translateY(-2px);

    box-shadow:
        0 18px 40px
        rgba(
            2,
            32,
            65,
            0.22
        );
}

/* ========================================================
   FINAL CTA
   ======================================================== */

.pd-final {
    position: relative;

    padding-block:
        clamp(
            78px,
            7vw,
            116px
        );

    overflow: hidden;

    color: #ffffff;

    background:
        linear-gradient(
            118deg,
            #01162a 0%,
            #022041 67%,
            #063f78 100%
        );
}

.pd-final::before {
    content: "";

    position: absolute;
    inset: 0;

    opacity: 0.55;

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

    background-size:
        58px 58px;
}

.pd-final::after {
    content: "MORE THAN MOTION";

    position: absolute;
    left: 2vw;
    bottom: -10px;

    color:
        rgba(
            255,
            255,
            255,
            0.04
        );

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size:
        clamp(
            57px,
            8vw,
            146px
        );

    font-weight: 950;
    letter-spacing: -0.055em;

    white-space: nowrap;
    direction: ltr;
    pointer-events: none;
}

.pd-final__box {
    position: relative;
    z-index: 2;

    max-width: 1060px;
}

.pd-final__box > span {
    color: #8cc8f8;

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.09em;

    direction: ltr;
}

.pd-final h2,
.pd-final p {
    color: #ffffff;
}

.pd-final p {
    max-width: 800px;

    color:
        rgba(
            255,
            255,
            255,
            0.75
        );
}

.pd-final__actions {
    margin-top: 32px;

    display: flex;
    flex-wrap: wrap;

    gap: 10px;
}

.pd-final__actions a {
    min-height: 52px;

    padding-inline: 24px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.55
        );

    border-radius: 2px;

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

    color: #ffffff;

    background:
        rgba(
            255,
            255,
            255,
            0.025
        );

    font-size: 13px;
    font-weight: 900;

    transition:
        color 0.22s ease,
        background-color 0.22s ease,
        border-color 0.22s ease,
        transform 0.22s ease;
}

.pd-final__actions a:first-child {
    border-color: var(--pd-blue);
    background: var(--pd-blue);
}

.pd-final__actions a:hover,
.pd-final__actions a:focus-visible {
    color: var(--pd-navy);

    border-color: #ffffff;
    background: #ffffff;

    transform:
        translateY(-3px);
}

/* END PRODUCT DETAIL V2 PART 4 */

/* ========================================================
   PRODUCT DETAIL V2 PART 5
   FINAL RESPONSIVE SYSTEM
   ======================================================== */

/* ========================================================
   LARGE DESKTOP
   ======================================================== */

@media (min-width: 1500px) {
    .pd-hero__grid {
        grid-template-columns:
            minmax(540px, 1.04fr)
            minmax(520px, 0.96fr);
    }

    .pd-product-stage img {
        width:
            min(
                100%,
                720px
            );
    }

    .pd-industrial-gallery__slide {
        height: 370px;
    }
}

/* ========================================================
   LAPTOP
   ======================================================== */

@media (
    min-width: 1121px
)
and (
    max-width: 1380px
) {
    .pd-shell {
        padding-inline:
            clamp(
                30px,
                4vw,
                58px
            );
    }

    .pd-hero__grid {
        grid-template-columns:
            minmax(440px, 0.96fr)
            minmax(500px, 1.04fr);

        gap:
            clamp(
                38px,
                5vw,
                72px
            );
    }

    .pd-hero h1 {
        font-size:
            clamp(
                37px,
                3.4vw,
                50px
            );
    }

    .pd-lead {
        font-size:
            clamp(
                17px,
                1.45vw,
                21px
            );
    }

    .pd-product-stage img {
        width:
            min(
                100%,
                590px
            );

        max-height:
            570px;
    }

    .pd-feature-card {
        padding: 27px;
    }

    .pd-industrial-gallery__slide {
        height: 320px;
    }
}

/* ========================================================
   TABLET AND SMALL LAPTOP
   ======================================================== */

@media (max-width: 1120px) {
    .pd-page {
        overflow-x: hidden;
    }

    .pd-shell {
        width: 100%;

        padding-inline:
            clamp(
                22px,
                5vw,
                52px
            );
    }

    .pd-section {
        padding-block:
            clamp(
                76px,
                9vw,
                110px
            );
    }

    .pd-hero,
    .pd-hero__grid {
        min-height: auto;
    }

    .pd-hero__grid {
        padding-block:
            78px 58px;

        grid-template-columns:
            minmax(0, 1fr);

        grid-template-areas:
            "content"
            "visual";

        gap: 44px;

        direction: rtl;
    }

    .pd-hero__content {
        width: 100%;
        max-width: 900px;
    }

    .pd-hero h1 {
        max-width: 820px;

        font-size:
            clamp(
                39px,
                5.7vw,
                56px
            );
    }

    .pd-lead,
    .pd-desc,
    .pd-keywords {
        max-width: 840px;
    }

    .pd-hero__visual {
        width: 100%;
        min-height: 520px;
    }

    .pd-product-stage {
        min-height: 500px;
    }

    .pd-product-stage img {
        width:
            min(
                100%,
                600px
            );

        max-height: 520px;
    }

    .pd-split,
    .pd-applications__grid,
    .pd-specs__box,
    .pd-rfq__grid {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .pd-split > div:first-child,
    .pd-faq .pd-head {
        position: static;
    }

    .pd-rich {
        max-width: 960px;
    }

    .pd-feature-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

    .pd-specs__box > div:first-child,
    .pd-rfq__grid > div {
        min-height: auto;
    }

    .pd-standard-list {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }

    .pd-faq > .pd-shell {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .pd-faq .pd-head {
        max-width: 760px;
        margin-bottom: 38px;
    }

    .pd-catalog__box {
        align-items: flex-start;
        flex-direction: column;
    }

    .pd-catalog .pd-actions {
        width: 100%;
    }

    .pd-industrial-gallery__slide {
        height: 310px;
    }

    .pd-industrial-gallery__slide--slim {
        width: 30vw;
        min-width: 280px;
    }

    .pd-industrial-gallery__slide--normal {
        width: 38vw;
        min-width: 340px;
    }

    .pd-industrial-gallery__slide--wide {
        width: 48vw;
        min-width: 430px;
    }
}

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

@media (max-width: 800px) {
    .pd-shell {
        padding-inline: 20px;
    }

    .pd-section {
        padding-block: 76px;
    }

    .pd-head {
        margin-bottom: 38px;
    }

    .pd-head h2,
    .pd-split h2,
    .pd-applications h2,
    .pd-specs h2,
    .pd-catalog h2,
    .pd-rfq h2,
    .pd-final h2,
    .pd-industrial-gallery h2 {
        font-size:
            clamp(
                29px,
                7vw,
                42px
            );

        line-height: 1.45;
    }

    .pd-hero__grid {
        padding-block:
            65px 45px;

        gap: 31px;
    }

    .pd-hero__bg::before {
        font-size: 70px;
        top: 28px;
    }

    .pd-hero h1 {
        max-width: 100%;

        font-size:
            clamp(
                34px,
                8.7vw,
                47px
            );

        line-height: 1.42;
    }

    .pd-lead {
        font-size: 18px;
        line-height: 1.95;
    }

    .pd-desc {
        font-size: 14px;
        line-height: 2;
    }

    .pd-actions {
        width: 100%;

        flex-direction: column;
        align-items: stretch;
    }

    .pd-btn {
        width: 100%;
    }

    .pd-keywords {
        margin-top: 26px;
        padding-top: 19px;
    }

    .pd-hero__visual {
        min-height: 400px;
    }

    .pd-product-stage {
        min-height: 380px;
    }

    .pd-product-stage img {
        width:
            min(
                100%,
                450px
            );

        max-height: 400px;

        transform:
            none;
    }

    .pd-product-stage:hover img {
        transform:
            translateY(-7px)
            scale(1.015);
    }

    .pd-chip-list,
    .pd-feature-grid,
    .pd-app-list,
    .pd-spec-list {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .pd-feature-card {
        min-height: auto;
    }

    .pd-applications__grid {
        gap: 38px;
    }

    .pd-spec-list span {
        border-left: 0;
    }

    .pd-spec-list span:nth-last-child(-n + 2) {
        border-bottom:
            1px solid
            var(--pd-line);
    }

    .pd-spec-list span:last-child {
        border-bottom: 0;
    }

    .pd-standard-list {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

    .pd-industrial-gallery {
        padding:
            76px 0;
    }

    .pd-industrial-gallery__head {
        width: auto;
        margin-inline: 20px;
    }

    .pd-industrial-gallery__slide {
        height: 260px;
    }

    .pd-industrial-gallery__slide--slim {
        width: 44vw;
        min-width: 260px;
    }

    .pd-industrial-gallery__slide--normal {
        width: 58vw;
        min-width: 310px;
    }

    .pd-industrial-gallery__slide--wide {
        width: 72vw;
        min-width: 380px;
    }

    .pd-catalog__box {
        gap: 30px;
    }

    .pd-form {
        grid-template-columns:
            minmax(0, 1fr);

        padding:
            28px 21px;
    }

    .pd-form textarea,
    .pd-form button {
        grid-column: auto;
    }

    .pd-final__actions {
        width: 100%;

        flex-direction: column;
    }

    .pd-final__actions a {
        width: 100%;
    }
}

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

@media (max-width: 560px) {
    .pd-shell {
        padding-inline: 16px;
    }

    .pd-section {
        padding-block: 64px;
    }

    .pd-kicker,
    .pd-industrial-gallery__kicker {
        gap: 9px;

        font-size: 10px;
    }

    .pd-kicker::before,
    .pd-industrial-gallery__kicker::before {
        width: 32px;
    }

    .pd-head h2,
    .pd-split h2,
    .pd-applications h2,
    .pd-specs h2,
    .pd-catalog h2,
    .pd-rfq h2,
    .pd-final h2,
    .pd-industrial-gallery h2 {
        font-size:
            clamp(
                27px,
                8vw,
                36px
            );
    }

    .pd-hero {
        min-height: auto;
    }

    .pd-hero::before {
        width: 3px;
    }

    .pd-hero__grid {
        padding-block:
            54px 38px;

        gap: 24px;
    }

    .pd-hero__bg::before {
        display: none;
    }

    .pd-pill {
        min-height: 34px;

        padding-inline: 11px;

        font-size: 9px;
    }

    .pd-hero h1 {
        margin-top: 19px;

        font-size:
            clamp(
                31px,
                9.3vw,
                39px
            );

        line-height: 1.5;
    }

    .pd-hero h1::after {
        width: 72px;
        height: 3px;

        margin-top: 16px;
    }

    .pd-lead {
        margin-top: 18px;

        font-size: 16px;
    }

    .pd-desc {
        font-size: 13px;
    }

    .pd-keywords {
        display: none;
    }

    .pd-hero__visual {
        min-height: 340px;
    }

    .pd-product-stage {
        min-height: 320px;
    }

    .pd-product-stage::before {
        top: 10%;
        bottom: 10%;
    }

    .pd-product-stage::after {
        right: 0;
        left: 0;
    }

    .pd-product-stage img {
        width:
            min(
                100%,
                350px
            );

        max-height: 335px;
    }

    .pd-rich {
        padding-right: 18px;
    }

    .pd-chip-list span {
        min-height: 53px;
    }

    .pd-feature-card {
        padding: 25px 22px;
    }

    .pd-feature-card > i {
        width: 52px;
        height: 52px;
    }

    .pd-feature-card h3 {
        margin-top: 22px;
    }

    .pd-app-list span,
    .pd-spec-list span {
        min-height: 61px;
    }

    .pd-specs__box > div:first-child,
    .pd-rfq__grid > div {
        padding:
            35px 24px;
    }

    .pd-standard-list {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .pd-standard-list span {
        min-height: 86px;
    }

    .pd-industrial-gallery {
        padding:
            66px 0;
    }

    .pd-industrial-gallery__word {
        display: none;
    }

    .pd-industrial-gallery__head {
        margin-inline: 16px;
    }

    .pd-industrial-gallery__rail {
        gap: 12px;
        padding:
            0 12px;
    }

    .pd-industrial-gallery__slide,
    .pd-industrial-gallery__slide--slim,
    .pd-industrial-gallery__slide--normal,
    .pd-industrial-gallery__slide--wide {
        width: 82vw;
        min-width: 82vw;
        height: 240px;
    }

    .pd-industrial-gallery__btn {
        width: 46px;
        height: 46px;
    }

    .pd-industrial-gallery__prev {
        left: 10px;
    }

    .pd-industrial-gallery__next {
        right: 10px;
    }

    .pd-industrial-gallery__btn svg {
        width: 18px;
        height: 18px;
    }

    .pd-gallery-lightbox {
        padding: 14px;
    }

    .pd-gallery-lightbox__close,
    .pd-gallery-lightbox__prev,
    .pd-gallery-lightbox__next {
        width: 46px;
        height: 46px;
    }

    .pd-gallery-lightbox__close {
        top: 12px;
        right: 12px;
    }

    .pd-gallery-lightbox__prev {
        left: 6px;
    }

    .pd-gallery-lightbox__next {
        right: 6px;
    }

    .pd-gallery-lightbox__hint {
        display: none;
    }

    .pd-faq-item summary {
        min-height: 78px;

        padding:
            17px 0;

        font-size: 14px;
    }

    .pd-faq-item summary::after {
        flex-basis: 36px;

        width: 36px;
        height: 36px;
    }

    .pd-faq-item p {
        padding:
            0 0 25px;

        font-size: 14px;
    }

    .pd-catalog,
    .pd-final {
        padding-block: 64px;
    }

    .pd-catalog::after,
    .pd-final::after,
    .pd-faq::before,
    .pd-standards::before {
        display: none;
    }

    .pd-form {
        gap: 12px;
    }

    .pd-form input,
    .pd-form textarea {
        font-size: 12px;
    }
}

/* ========================================================
   VERY SMALL MOBILE
   ======================================================== */

@media (max-width: 380px) {
    .pd-shell {
        padding-inline: 13px;
    }

    .pd-hero h1 {
        font-size: 29px;
    }

    .pd-lead {
        font-size: 15px;
    }

    .pd-product-stage img {
        max-height: 300px;
    }

    .pd-industrial-gallery__slide,
    .pd-industrial-gallery__slide--slim,
    .pd-industrial-gallery__slide--normal,
    .pd-industrial-gallery__slide--wide {
        width: 86vw;
        min-width: 86vw;
        height: 220px;
    }
}

/* ========================================================
   ACCESSIBILITY AND REDUCED MOTION
   ======================================================== */

@media (prefers-reduced-motion: reduce) {
    .pd-page *,
    .pd-page *::before,
    .pd-page *::after {
        scroll-behavior: auto !important;
        animation: none !important;
        transition-duration: 0.01ms !important;
    }
}

/* END PRODUCT DETAIL V2 PART 5 */

/* ========================================================
   PRODUCT GALLERY PREMIUM V2.1
   Taller / Cleaner / More Industrial
   ======================================================== */

.pd-industrial-gallery {
    padding:
        clamp(
            105px,
            8vw,
            145px
        )
        0
        clamp(
            110px,
            8vw,
            150px
        );

    background:
        radial-gradient(
            circle,
            rgba(12, 83, 165, 0.11)
            1px,
            transparent 1.65px
        ),
        linear-gradient(
            90deg,
            rgba(2, 32, 65, 0.045)
            1px,
            transparent 1px
        ),
        linear-gradient(
            180deg,
            rgba(2, 32, 65, 0.045)
            1px,
            transparent 1px
        ),
        linear-gradient(
            180deg,
            #f8fafc 0%,
            #edf2f6 100%
        );

    background-size:
        24px 24px,
        96px 96px,
        96px 96px,
        cover;
}

.pd-industrial-gallery::before {
    content: "";

    position: absolute;
    top: 0;
    right: 0;

    width: 34%;
    height: 4px;

    background: var(--pd-blue);
}

.pd-industrial-gallery::after {
    content: "";

    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(2, 32, 65, 0.22),
            transparent
        );
}

.pd-industrial-gallery__word {
    top: 33px;

    color:
        rgba(
            2,
            32,
            65,
            0.055
        );

    font-size:
        clamp(
            68px,
            10vw,
            178px
        );
}

.pd-industrial-gallery__head {
    width:
        min(
            calc(100% - 80px),
            1540px
        );

    margin:
        0 auto 48px;

    padding-right: 24px;

    border-right:
        4px solid
        var(--pd-blue);
}

.pd-industrial-gallery__kicker {
    margin-bottom: 14px;

    font-size: 13px;
}

.pd-industrial-gallery h2 {
    max-width: 980px;

    font-size:
        clamp(
            36px,
            3.7vw,
            59px
        );

    line-height: 1.38;
}

.pd-industrial-gallery__desc {
    max-width: 830px;

    margin-top: 16px;

    color: #465a6d;

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

.pd-industrial-gallery__stage {
    margin-top: 50px;

    padding-block: 13px;
}

.pd-industrial-gallery__stage::before,
.pd-industrial-gallery__stage::after {
    content: "";

    position: absolute;
    z-index: 1;

    right: 4vw;
    left: 4vw;

    height: 1px;

    pointer-events: none;
}

.pd-industrial-gallery__stage::before {
    top: 0;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(12, 83, 165, 0.3),
            transparent
        );
}

.pd-industrial-gallery__stage::after {
    bottom: 0;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(2, 32, 65, 0.18),
            transparent
        );
}

.pd-industrial-gallery__rail {
    gap: 24px;

    padding:
        18px
        clamp(
            24px,
            4vw,
            70px
        )
        28px;
}

/*
 * ارتفاع اصلی گالری در دسکتاپ
 */

.pd-industrial-gallery__slide {
    height: 430px;
}

.pd-industrial-gallery__slide--slim {
    width: 25vw;
    min-width: 340px;
}

.pd-industrial-gallery__slide--normal {
    width: 32vw;
    min-width: 440px;
}

.pd-industrial-gallery__slide--wide {
    width: 42vw;
    min-width: 590px;
}

.pd-industrial-gallery__frame {
    border:
        1px solid
        #c5d0da;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #edf2f6 100%
        );

    box-shadow:
        0 18px 42px
        rgba(
            2,
            32,
            65,
            0.11
        ),
        0 4px 12px
        rgba(
            2,
            32,
            65,
            0.06
        );

    transition:
        border-color 0.28s ease,
        box-shadow 0.28s ease,
        transform 0.28s ease;
}

.pd-industrial-gallery__frame::before {
    inset: 17px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.48
        );
}

.pd-industrial-gallery__frame::after {
    width: 78px;
    height: 4px;
}

.pd-industrial-gallery__frame:hover {
    border-color:
        rgba(
            12,
            83,
            165,
            0.7
        );

    transform:
        translateY(-7px);

    box-shadow:
        0 30px 70px
        rgba(
            2,
            32,
            65,
            0.17
        ),
        0 8px 20px
        rgba(
            2,
            32,
            65,
            0.08
        );
}

.pd-industrial-gallery__frame img {
    filter:
        contrast(1.01)
        saturate(0.98);

    transition:
        transform 0.38s ease,
        filter 0.38s ease;
}

.pd-industrial-gallery__frame:hover img {
    transform:
        scale(1.055);

    filter:
        contrast(1.05)
        saturate(1.06);
}

/*
 * تصویر اول هر گالری معمولاً رندر محصول است.
 * بدون Crop و با پس‌زمینه مهندسی نمایش داده شود.
 */

.pd-industrial-gallery__frame[data-index="0"] {
    background:
        linear-gradient(
            rgba(2, 32, 65, 0.035)
            1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(2, 32, 65, 0.035)
            1px,
            transparent 1px
        ),
        linear-gradient(
            145deg,
            #ffffff,
            #edf2f6
        );

    background-size:
        54px 54px,
        54px 54px,
        cover;
}

.pd-industrial-gallery__frame[data-index="0"] img {
    padding:
        clamp(
            28px,
            3vw,
            52px
        );

    object-fit: contain;

    filter:
        drop-shadow(
            0 8px 8px
            rgba(2, 32, 65, 0.15)
        )
        drop-shadow(
            0 22px 21px
            rgba(2, 32, 65, 0.22)
        )
        drop-shadow(
            0 38px 33px
            rgba(2, 32, 65, 0.14)
        );
}

.pd-industrial-gallery__frame[data-index="0"]:hover img {
    transform:
        translateY(-7px)
        scale(1.035);

    filter:
        drop-shadow(
            0 9px 9px
            rgba(2, 32, 65, 0.18)
        )
        drop-shadow(
            0 26px 24px
            rgba(2, 32, 65, 0.26)
        )
        drop-shadow(
            0 44px 38px
            rgba(2, 32, 65, 0.17)
        );
}

/* ========================================================
   PREMIUM GALLERY BUTTONS
   ======================================================== */

.pd-industrial-gallery__btn {
    width: 64px;
    height: 64px;

    border:
        1px solid
        rgba(
            2,
            32,
            65,
            0.18
        );

    color: var(--pd-navy);

    background:
        rgba(
            255,
            255,
            255,
            0.97
        );

    box-shadow:
        0 18px 45px
        rgba(
            2,
            32,
            65,
            0.2
        );
}

.pd-industrial-gallery__btn::before {
    content: "";

    position: absolute;
    inset: 6px;

    border:
        1px solid
        rgba(
            12,
            83,
            165,
            0.13
        );

    pointer-events: none;
}

.pd-industrial-gallery__btn:hover,
.pd-industrial-gallery__btn:focus-visible {
    border-color: var(--pd-blue);

    color: #ffffff;
    background: var(--pd-blue);

    box-shadow:
        0 22px 50px
        rgba(
            12,
            83,
            165,
            0.32
        );
}

.pd-industrial-gallery__btn svg {
    width: 24px;
    height: 24px;
}

/* ========================================================
   GALLERY PREMIUM RESPONSIVE
   ======================================================== */

@media (min-width: 1500px) {
    .pd-industrial-gallery__slide {
        height: 470px;
    }

    .pd-industrial-gallery__slide--slim {
        min-width: 390px;
    }

    .pd-industrial-gallery__slide--normal {
        min-width: 500px;
    }

    .pd-industrial-gallery__slide--wide {
        min-width: 660px;
    }
}

@media (
    min-width: 1121px
)
and (
    max-width: 1380px
) {
    .pd-industrial-gallery__slide {
        height: 390px;
    }

    .pd-industrial-gallery__slide--slim {
        width: 28vw;
        min-width: 320px;
    }

    .pd-industrial-gallery__slide--normal {
        width: 36vw;
        min-width: 400px;
    }

    .pd-industrial-gallery__slide--wide {
        width: 48vw;
        min-width: 530px;
    }
}

@media (max-width: 1120px) {
    .pd-industrial-gallery__head {
        width:
            calc(100% - 48px);
    }

    .pd-industrial-gallery__slide {
        height: 350px;
    }

    .pd-industrial-gallery__slide--slim {
        width: 36vw;
        min-width: 300px;
    }

    .pd-industrial-gallery__slide--normal {
        width: 48vw;
        min-width: 390px;
    }

    .pd-industrial-gallery__slide--wide {
        width: 61vw;
        min-width: 500px;
    }
}

@media (max-width: 800px) {
    .pd-industrial-gallery {
        padding:
            82px 0 90px;
    }

    .pd-industrial-gallery__head {
        width:
            calc(100% - 40px);

        margin-bottom: 34px;

        padding-right: 17px;
    }

    .pd-industrial-gallery__stage {
        margin-top: 32px;
    }

    .pd-industrial-gallery__rail {
        gap: 16px;
        padding:
            14px 18px 24px;
    }

    .pd-industrial-gallery__slide {
        height: 310px;
    }

    .pd-industrial-gallery__slide--slim {
        width: 58vw;
        min-width: 310px;
    }

    .pd-industrial-gallery__slide--normal {
        width: 72vw;
        min-width: 390px;
    }

    .pd-industrial-gallery__slide--wide {
        width: 82vw;
        min-width: 440px;
    }

    .pd-industrial-gallery__btn {
        width: 54px;
        height: 54px;
    }
}

@media (max-width: 560px) {
    .pd-industrial-gallery {
        padding:
            70px 0 78px;
    }

    .pd-industrial-gallery__head {
        width:
            calc(100% - 32px);

        margin-inline: 16px;

        padding-right: 14px;
    }

    .pd-industrial-gallery__desc {
        font-size: 14px;
    }

    .pd-industrial-gallery__rail {
        gap: 14px;
        padding:
            12px 12px 22px;
    }

    .pd-industrial-gallery__slide,
    .pd-industrial-gallery__slide--slim,
    .pd-industrial-gallery__slide--normal,
    .pd-industrial-gallery__slide--wide {
        width: 88vw;
        min-width: 88vw;
        height: 285px;
    }

    .pd-industrial-gallery__frame[data-index="0"] img {
        padding: 25px;
    }

    .pd-industrial-gallery__btn {
        width: 48px;
        height: 48px;
    }

    .pd-industrial-gallery__prev {
        left: 7px;
    }

    .pd-industrial-gallery__next {
        right: 7px;
    }

    .pd-industrial-gallery__btn svg {
        width: 19px;
        height: 19px;
    }
}

/* END PRODUCT GALLERY PREMIUM V2.1 */

/* ========================================================
   APPLICATIONS LIGHT INDUSTRIAL V2.2
   Clean Light Background + Dark Typography
   ======================================================== */

.pd-applications {
    position: relative;
    overflow: hidden;

    color: var(--pd-text);

    background:
        linear-gradient(
            rgba(2, 32, 65, 0.038)
            1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(2, 32, 65, 0.038)
            1px,
            transparent 1px
        ),
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f4f7f9 52%,
            #edf2f6 100%
        ) !important;

    background-size:
        74px 74px,
        74px 74px,
        cover !important;
}

/*
 * خط آبی بالای سکشن
 */

.pd-applications::before {
    content: "";

    position: absolute;
    inset: auto;
    top: 0;
    right: 0;

    width: 34%;
    height: 4px;

    opacity: 1;

    background:
        var(--pd-blue) !important;
}

/*
 * نوشته بزرگ انگلیسی در پس‌زمینه
 */

.pd-applications::after {
    content: "APPLICATIONS";

    position: absolute;
    left: 2.5vw;
    bottom: -8px;

    color:
        rgba(
            2,
            32,
            65,
            0.035
        );

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size:
        clamp(
            66px,
            10vw,
            165px
        );

    font-weight: 950;
    letter-spacing: -0.055em;

    white-space: nowrap;
    direction: ltr;

    pointer-events: none;
}

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

.pd-applications__grid {
    position: relative;
    z-index: 2;

    grid-template-columns:
        minmax(
            350px,
            0.76fr
        )
        minmax(
            0,
            1.24fr
        );

    align-items: center;

    gap:
        clamp(
            58px,
            8vw,
            128px
        );
}

.pd-applications__grid > div:first-child {
    position: relative;

    padding:
        clamp(
            30px,
            4vw,
            55px
        );

    border:
        1px solid
        #c5d0da;

    border-right:
        4px solid
        var(--pd-blue);

    background:
        rgba(
            255,
            255,
            255,
            0.86
        );

    box-shadow:
        0 22px 60px
        rgba(
            2,
            32,
            65,
            0.08
        );
}

.pd-applications__grid > div:first-child::before {
    content: "";

    position: absolute;
    top: 0;
    left: 0;

    width: 38px;
    height: 38px;

    border-top:
        1px solid
        rgba(
            12,
            83,
            165,
            0.32
        );

    border-left:
        1px solid
        rgba(
            12,
            83,
            165,
            0.32
        );
}

/* ========================================================
   APPLICATIONS TYPOGRAPHY
   ======================================================== */

.pd-applications .pd-kicker {
    color:
        var(--pd-blue) !important;
}

.pd-applications h2 {
    max-width: 620px;

    margin-top: 15px;

    color:
        var(--pd-navy) !important;

    font-size:
        clamp(
            32px,
            3.35vw,
            52px
        );

    font-weight: 950;
    line-height: 1.42;
}

.pd-applications p {
    max-width: 620px;

    margin-top: 17px;

    color:
        #596b7d !important;

    font-size: 15px;
    font-weight: 600;
    line-height: 2.1;
}

/* ========================================================
   APPLICATION ITEMS
   ======================================================== */

.pd-app-list {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 14px;

    border: 0;
}

.pd-app-list span {
    position: relative;

    min-height: 76px;

    padding:
        17px 20px;

    overflow: hidden;

    border:
        1px solid
        #c7d1db;

    border-radius: 2px;

    display: flex;
    align-items: center;

    gap: 12px;

    color:
        #34495d !important;

    background:
        rgba(
            255,
            255,
            255,
            0.94
        ) !important;

    font-size: 14px;
    font-weight: 850;

    box-shadow:
        0 10px 28px
        rgba(
            2,
            32,
            65,
            0.055
        );

    transition:
        color 0.24s ease,
        background-color 0.24s ease,
        border-color 0.24s ease,
        transform 0.24s ease,
        box-shadow 0.24s ease;
}

.pd-app-list span::before {
    content: "";

    position: absolute;
    right: 0;
    bottom: 0;

    width: 45px;
    height: 3px;

    background:
        var(--pd-blue);

    transition:
        width 0.24s ease;
}

.pd-app-list span:hover {
    color:
        #ffffff !important;

    border-color:
        var(--pd-blue);

    background:
        var(--pd-blue) !important;

    transform:
        translateY(-5px);

    box-shadow:
        0 20px 48px
        rgba(
            12,
            83,
            165,
            0.2
        );
}

.pd-app-list span:hover::before {
    width: 100%;

    background:
        #ffffff;
}

.pd-app-list i {
    flex:
        0 0 38px;

    width: 38px;
    height: 38px;

    border:
        1px solid
        rgba(
            12,
            83,
            165,
            0.2
        );

    display: grid;
    place-items: center;

    color:
        var(--pd-blue) !important;

    background:
        #eef4f9;

    font-size: 12px;

    transition:
        color 0.24s ease,
        background-color 0.24s ease,
        border-color 0.24s ease;
}

.pd-app-list span:hover i {
    color:
        var(--pd-blue) !important;

    border-color:
        #ffffff;

    background:
        #ffffff;
}

/* ========================================================
   APPLICATIONS RESPONSIVE
   ======================================================== */

@media (max-width: 1120px) {
    .pd-applications__grid {
        grid-template-columns:
            minmax(0, 1fr);

        gap: 40px;
    }

    .pd-applications__grid > div:first-child {
        max-width: 900px;
    }
}

@media (max-width: 800px) {
    .pd-app-list {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .pd-applications__grid > div:first-child {
        padding:
            32px 25px;
    }
}

@media (max-width: 560px) {
    .pd-applications::after {
        display: none;
    }

    .pd-applications__grid > div:first-child {
        padding:
            27px 20px;

        border-right-width: 3px;
    }

    .pd-applications h2 {
        font-size:
            clamp(
                27px,
                8vw,
                36px
            );
    }

    .pd-applications p {
        font-size: 14px;
    }

    .pd-app-list span {
        min-height: 67px;

        padding:
            14px 15px;
    }

    .pd-app-list i {
        flex-basis: 35px;

        width: 35px;
        height: 35px;
    }
}

/* END APPLICATIONS LIGHT INDUSTRIAL V2.2 */

/* ========================================================
   PRODUCT CATALOG TECHNICAL V2.3 PART 1
   SECTION + LAYOUT + DOCUMENT VISUAL
   ======================================================== */

.pd-catalog--technical {
    position: relative;
    overflow: hidden;
    isolation: isolate;

    padding-block:
        clamp(
            90px,
            8vw,
            135px
        );

    color: #ffffff;

    background:
        linear-gradient(
            124deg,
            #011629 0%,
            #022041 54%,
            #08467f 100%
        );
}

.pd-catalog--technical::before {
    content: "";

    position: absolute;
    z-index: 0;

    inset: 0;

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

    background-size:
        82px 82px,
        82px 82px;

    pointer-events: none;
}

.pd-catalog--technical::after {
    content: "TECHNICAL CATALOG";

    position: absolute;
    z-index: 0;

    left: 2vw;
    bottom: -17px;

    color:
        rgba(
            255,
            255,
            255,
            0.027
        );

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size:
        clamp(
            72px,
            10vw,
            170px
        );

    font-weight: 950;
    line-height: 1;
    letter-spacing: -0.07em;

    direction: ltr;
    white-space: nowrap;

    pointer-events: none;
}

.pd-catalog__technical-bg {
    position: absolute;
    z-index: 0;

    inset: 0;

    pointer-events: none;
}

.pd-catalog__technical-bg::before {
    content: "";

    position: absolute;

    top: 0;
    right: 0;

    width: 38%;
    height: 5px;

    background: #60b9ff;
}

.pd-catalog__technical-bg::after {
    content: "";

    position: absolute;

    top: 12%;
    bottom: 12%;
    left: 46%;

    width: 1px;

    background:
        linear-gradient(
            transparent,
            rgba(
                255,
                255,
                255,
                0.13
            ),
            transparent
        );
}

.pd-catalog__layout {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(
            390px,
            0.82fr
        )
        minmax(
            0,
            1.18fr
        );

    grid-template-areas:
        "visual content";

    align-items: center;

    gap:
        clamp(
            65px,
            8vw,
            135px
        );

    direction: ltr;
}

.pd-catalog__visual {
    grid-area: visual;

    position: relative;

    min-height: 570px;

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

    direction: ltr;
}

.pd-catalog__visual::before,
.pd-catalog__visual::after {
    content: "";

    position: absolute;
    z-index: 0;

    pointer-events: none;
}

.pd-catalog__visual::before {
    top: 6%;
    bottom: 6%;
    left: 50%;

    width: 1px;

    background:
        linear-gradient(
            transparent,
            rgba(
                112,
                192,
                255,
                0.3
            ),
            transparent
        );
}

.pd-catalog__visual::after {
    top: 50%;
    right: 3%;
    left: 3%;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(
                112,
                192,
                255,
                0.3
            ),
            transparent
        );
}

.pd-catalog-document {
    position: relative;
    z-index: 2;

    width:
        min(
            86%,
            430px
        );

    min-height: 540px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.22
        );

    border-radius: 2px;

    display: grid;

    grid-template-rows:
        auto
        1fr
        auto;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #e9eef3 100%
        );

    box-shadow:
        0 22px 30px
        rgba(
            0,
            0,
            0,
            0.2
        ),
        0 48px 90px
        rgba(
            0,
            0,
            0,
            0.3
        );

    transform:
        perspective(1300px)
        rotateY(5deg)
        translateY(-4px);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}

.pd-catalog-document::before {
    content: "";

    position: absolute;
    z-index: 5;

    top: 0;
    right: 0;

    width: 100px;
    height: 5px;

    background: var(--pd-blue);
}

.pd-catalog-document::after {
    content: "";

    position: absolute;
    z-index: 5;

    top: 17px;
    right: 17px;
    bottom: 17px;
    left: 17px;

    border:
        1px solid
        rgba(
            2,
            32,
            65,
            0.075
        );

    pointer-events: none;
}

.pd-catalog__visual:hover
.pd-catalog-document {
    transform:
        perspective(1300px)
        rotateY(2deg)
        translateY(-13px);

    box-shadow:
        0 28px 36px
        rgba(
            0,
            0,
            0,
            0.22
        ),
        0 58px 105px
        rgba(
            0,
            0,
            0,
            0.34
        );
}

.pd-catalog-document__head {
    position: relative;
    z-index: 6;

    min-height: 76px;

    padding:
        22px
        25px;

    border-bottom:
        1px solid
        #c6d0da;

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

    gap: 15px;

    direction: ltr;
}

.pd-catalog-document__head span {
    min-width: 53px;
    min-height: 31px;

    padding-inline: 10px;

    border-radius: 2px;

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

    color: #ffffff;
    background: var(--pd-blue);

    font-family:
        Inter,
        Arial,
        sans-serif;

    font-size: 11px;
    font-weight: 950;
    letter-spacing: 0.06em;
}

.pd-catalog-document__head small {
    color: var(--pd-navy);

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.075em;
}

.pd-catalog-document__render {
    position: relative;
    z-index: 3;

    min-height: 375px;

    padding:
        34px
        38px;

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

    background-image:
        linear-gradient(
            rgba(
                2,
                32,
                65,
                0.034
            )
            1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(
                2,
                32,
                65,
                0.034
            )
            1px,
            transparent 1px
        );

    background-size:
        52px 52px,
        52px 52px;
}

.pd-catalog-document__render img {
    display: block;

    width: 100%;
    height: 350px;

    object-fit: contain;

    background: transparent;

    filter:
        drop-shadow(
            0 8px 8px
            rgba(
                2,
                32,
                65,
                0.16
            )
        )
        drop-shadow(
            0 23px 22px
            rgba(
                2,
                32,
                65,
                0.24
            )
        )
        drop-shadow(
            0 39px 34px
            rgba(
                2,
                32,
                65,
                0.15
            )
        );

    transition:
        transform 0.35s ease,
        filter 0.35s ease;
}

.pd-catalog__visual:hover
.pd-catalog-document__render img {
    transform:
        translateY(-7px)
        scale(1.025);

    filter:
        drop-shadow(
            0 10px 9px
            rgba(
                2,
                32,
                65,
                0.18
            )
        )
        drop-shadow(
            0 28px 26px
            rgba(
                2,
                32,
                65,
                0.28
            )
        )
        drop-shadow(
            0 46px 39px
            rgba(
                2,
                32,
                65,
                0.18
            )
        );
}

.pd-catalog-document__foot {
    position: relative;
    z-index: 6;

    min-height: 80px;

    padding:
        20px
        25px;

    border-top:
        1px solid
        #c6d0da;

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

    direction: ltr;
}

.pd-catalog-document__foot strong {
    color: var(--pd-navy);

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size: 17px;
    font-weight: 950;
    line-height: 1.4;
}

.pd-catalog-document__foot span {
    margin-top: 4px;

    color: var(--pd-blue);

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.1em;
}

/* END PRODUCT CATALOG TECHNICAL V2.3 PART 1 */

/* ========================================================
   PRODUCT CATALOG TECHNICAL V2.3 PART 2
   CONTENT + STATUS + FEATURES + ACTIONS
   ======================================================== */

.pd-catalog__content {
    grid-area: content;

    position: relative;

    max-width: 790px;

    direction: rtl;
}

.pd-catalog__content::before {
    content: "";

    position: absolute;

    top: -26px;
    right: -28px;

    width: 40px;
    height: 40px;

    border-top:
        1px solid
        rgba(
            112,
            192,
            255,
            0.44
        );

    border-right:
        1px solid
        rgba(
            112,
            192,
            255,
            0.44
        );

    pointer-events: none;
}

.pd-catalog__eyebrow {
    min-height: 38px;

    padding-inline: 14px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.2
        );

    border-radius: 2px;

    display: inline-flex;
    align-items: center;

    gap: 9px;

    color: #9fd5ff;

    background:
        rgba(
            255,
            255,
            255,
            0.055
        );

    font-family:
        Inter,
        Montserrat,
        Arial,
        sans-serif;

    font-size: 9px;
    font-weight: 950;
    letter-spacing: 0.075em;

    direction: ltr;
}

.pd-catalog__eyebrow i {
    color: #70c0ff;

    font-size: 13px;
}

.pd-catalog--technical h2 {
    max-width: 760px;

    margin: 22px 0 0;

    color: #ffffff;

    font-size:
        clamp(
            35px,
            3.8vw,
            57px
        );

    font-weight: 950;
    line-height: 1.48;
    letter-spacing: -0.04em;
}

.pd-catalog--technical h2::after {
    content: "";

    display: block;

    width: 92px;
    height: 4px;

    margin-top: 21px;

    background: #60b9ff;
}

.pd-catalog__content > p {
    max-width: 730px;

    margin: 22px 0 0;

    color:
        rgba(
            255,
            255,
            255,
            0.74
        );

    font-size: 15px;
    font-weight: 550;
    line-height: 2.12;
}

/* ========================================================
   CATALOG STATUS
   ======================================================== */

.pd-catalog__status {
    max-width: 650px;

    margin-top: 29px;

    padding:
        16px
        18px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.17
        );

    border-right:
        4px solid
        #60b9ff;

    border-radius: 2px;

    display: flex;
    align-items: center;

    gap: 14px;

    background:
        rgba(
            255,
            255,
            255,
            0.07
        );

    box-shadow:
        0 16px 40px
        rgba(
            0,
            0,
            0,
            0.14
        );
}

.pd-catalog__status > i {
    flex:
        0 0
        auto;

    width: 43px;
    height: 43px;

    border:
        1px solid
        rgba(
            112,
            192,
            255,
            0.3
        );

    border-radius: 2px;

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

    color: #70c0ff;

    background:
        rgba(
            112,
            192,
            255,
            0.08
        );

    font-size: 16px;
}

.pd-catalog__status div {
    min-width: 0;
}

.pd-catalog__status span {
    display: block;

    color:
        rgba(
            255,
            255,
            255,
            0.56
        );

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

.pd-catalog__status strong {
    display: block;

    margin-top: 4px;

    color: #ffffff;

    font-size: 12px;
    font-weight: 900;
    line-height: 1.7;
}

/* ========================================================
   CATALOG FEATURES
   ======================================================== */

.pd-catalog__features {
    max-width: 730px;

    margin-top: 20px;

    display: grid;

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

    gap: 9px;
}

.pd-catalog__features > span {
    min-height: 64px;

    padding:
        12px
        14px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.14
        );

    border-radius: 2px;

    display: flex;
    align-items: center;

    gap: 10px;

    color:
        rgba(
            255,
            255,
            255,
            0.82
        );

    background:
        rgba(
            255,
            255,
            255,
            0.045
        );

    font-size: 11px;
    font-weight: 800;
    line-height: 1.7;

    transition:
        border-color 0.24s ease,
        background-color 0.24s ease,
        transform 0.24s ease;
}

.pd-catalog__features > span:hover {
    border-color:
        rgba(
            112,
            192,
            255,
            0.46
        );

    background:
        rgba(
            112,
            192,
            255,
            0.09
        );

    transform:
        translateY(-3px);
}

.pd-catalog__features i {
    flex:
        0 0
        auto;

    color: #70c0ff;

    font-size: 14px;
}

/* ========================================================
   CATALOG ACTIONS
   ======================================================== */

.pd-catalog__actions {
    margin-top: 30px;

    display: flex;
    flex-wrap: wrap;
    align-items: center;

    gap: 10px;
}

.pd-catalog__actions .pd-btn {
    min-height: 54px;

    padding-inline: 23px;

    gap: 9px;
}

.pd-catalog__actions .pd-btn--light {
    color: var(--pd-navy);

    border-color: #ffffff;
    background: #ffffff;

    box-shadow:
        0 17px 40px
        rgba(
            0,
            0,
            0,
            0.2
        );
}

.pd-catalog__actions .pd-btn--light:hover,
.pd-catalog__actions .pd-btn--light:focus-visible {
    color: #ffffff;

    border-color: var(--pd-blue);
    background: var(--pd-blue);

    transform: translateY(-3px);
}

.pd-catalog__actions .pd-btn--outline {
    color: #ffffff;

    border-color:
        rgba(
            255,
            255,
            255,
            0.45
        );

    background:
        rgba(
            255,
            255,
            255,
            0.035
        );
}

.pd-catalog__actions .pd-btn--outline:hover,
.pd-catalog__actions .pd-btn--outline:focus-visible {
    color: var(--pd-navy);

    border-color: #ffffff;
    background: #ffffff;

    transform: translateY(-3px);
}

/* END PRODUCT CATALOG TECHNICAL V2.3 PART 2 */

/* ========================================================
   PRODUCT CATALOG TECHNICAL V2.3 PART 3
   RESPONSIVE + FINAL POLISH
   ======================================================== */

@media (max-width: 1180px) {
    .pd-catalog__layout {
        grid-template-columns:
            minmax(
                330px,
                0.78fr
            )
            minmax(
                0,
                1.22fr
            );

        gap:
            clamp(
                45px,
                6vw,
                78px
            );
    }

    .pd-catalog__visual {
        min-height: 520px;
    }

    .pd-catalog-document {
        width:
            min(
                92%,
                405px
            );

        min-height: 500px;
    }

    .pd-catalog-document__render {
        min-height: 340px;
    }

    .pd-catalog-document__render img {
        height: 315px;
    }

    .pd-catalog--technical h2 {
        font-size:
            clamp(
                33px,
                3.5vw,
                49px
            );
    }
}

@media (max-width: 980px) {
    .pd-catalog--technical {
        padding-block:
            85px
            95px;
    }

    .pd-catalog__technical-bg::after {
        display: none;
    }

    .pd-catalog__layout {
        grid-template-columns:
            minmax(
                0,
                1fr
            );

        grid-template-areas:
            "content"
            "visual";

        gap: 55px;

        direction: rtl;
    }

    .pd-catalog__content {
        max-width: 850px;
    }

    .pd-catalog__visual {
        min-height: 540px;
    }

    .pd-catalog-document {
        width:
            min(
                76%,
                430px
            );
    }

    .pd-catalog__status {
        max-width: 730px;
    }

    .pd-catalog__features {
        max-width: 760px;
    }
}

@media (max-width: 800px) {
    .pd-catalog--technical::after {
        display: none;
    }

    .pd-catalog__technical-bg::before {
        width: 55%;
        height: 4px;
    }

    .pd-catalog__content::before {
        top: -20px;
        right: -12px;

        width: 30px;
        height: 30px;
    }

    .pd-catalog--technical h2 {
        font-size:
            clamp(
                30px,
                7vw,
                42px
            );

        line-height: 1.52;
    }

    .pd-catalog__content > p {
        font-size: 14px;
    }

    .pd-catalog__features {
        grid-template-columns:
            minmax(
                0,
                1fr
            );

        gap: 8px;
    }

    .pd-catalog__features > span {
        min-height: 56px;
    }

    .pd-catalog__actions {
        width: 100%;

        flex-direction: column;
        align-items: stretch;
    }

    .pd-catalog__actions .pd-btn {
        width: 100%;
    }

    .pd-catalog__visual {
        min-height: 510px;
    }

    .pd-catalog-document {
        width:
            min(
                88%,
                410px
            );

        min-height: 485px;

        transform: none;
    }

    .pd-catalog__visual:hover
    .pd-catalog-document {
        transform:
            translateY(-7px);
    }

    .pd-catalog-document__render {
        min-height: 325px;
    }

    .pd-catalog-document__render img {
        height: 300px;
    }
}

@media (max-width: 560px) {
    .pd-catalog--technical {
        padding-block:
            68px
            76px;
    }

    .pd-catalog__technical-bg::before {
        width: 70%;
        height: 3px;
    }

    .pd-catalog__layout {
        gap: 36px;
    }

    .pd-catalog__content::before {
        display: none;
    }

    .pd-catalog__eyebrow {
        min-height: 34px;

        padding-inline: 11px;

        font-size: 8px;
        letter-spacing: 0.05em;
    }

    .pd-catalog--technical h2 {
        margin-top: 18px;

        font-size:
            clamp(
                27px,
                8vw,
                35px
            );

        line-height: 1.58;
    }

    .pd-catalog--technical h2::after {
        width: 70px;
        height: 3px;

        margin-top: 16px;
    }

    .pd-catalog__content > p {
        margin-top: 17px;

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

    .pd-catalog__status {
        margin-top: 23px;

        padding:
            14px
            13px;

        border-right-width: 3px;

        gap: 11px;
    }

    .pd-catalog__status > i {
        width: 38px;
        height: 38px;

        font-size: 14px;
    }

    .pd-catalog__status strong {
        font-size: 11px;
    }

    .pd-catalog__features {
        margin-top: 14px;
    }

    .pd-catalog__features > span {
        min-height: 52px;

        padding:
            10px
            12px;

        font-size: 10px;
    }

    .pd-catalog__actions {
        margin-top: 23px;
    }

    .pd-catalog__actions .pd-btn {
        min-height: 51px;

        padding-inline: 16px;

        font-size: 11px;
    }

    .pd-catalog__visual {
        min-height: 430px;
    }

    .pd-catalog__visual::before,
    .pd-catalog__visual::after {
        opacity: 0.7;
    }

    .pd-catalog-document {
        width: 94%;

        min-height: 420px;
    }

    .pd-catalog-document::after {
        top: 12px;
        right: 12px;
        bottom: 12px;
        left: 12px;
    }

    .pd-catalog-document__head {
        min-height: 64px;

        padding:
            17px
            18px;
    }

    .pd-catalog-document__head span {
        min-width: 48px;
        min-height: 28px;

        font-size: 10px;
    }

    .pd-catalog-document__head small {
        font-size: 8px;
    }

    .pd-catalog-document__render {
        min-height: 278px;

        padding:
            22px
            25px;
    }

    .pd-catalog-document__render img {
        height: 260px;
    }

    .pd-catalog-document__foot {
        min-height: 68px;

        padding:
            16px
            18px;
    }

    .pd-catalog-document__foot strong {
        font-size: 14px;
    }

    .pd-catalog-document__foot span {
        font-size: 8px;
    }
}

@media (max-width: 390px) {
    .pd-catalog__eyebrow {
        max-width: 100%;

        font-size: 7px;
    }

    .pd-catalog--technical h2 {
        font-size: 26px;
    }

    .pd-catalog__visual {
        min-height: 400px;
    }

    .pd-catalog-document {
        min-height: 395px;
    }

    .pd-catalog-document__render {
        min-height: 255px;
    }

    .pd-catalog-document__render img {
        height: 235px;
    }
}

/* END PRODUCT CATALOG TECHNICAL V2.3 PART 3 */