css
/* =========================================================
   INDUSTRIAL WEBSITE
   PRIMARY   : #00335e
   SECONDARY : #c2c2c3
   FONT      : Aptos Serif, Georgia, serif
========================================================= */

:root {

    --primary: #00335e;
    --primary-dark: #002541;
    --secondary: #c2c2c3;

    --white: #ffffff;
    --black: #111111;

    --light: #f5f6f7;
    --border: #dedfe0;
    --text: #555b61;

    --container: 1240px;

}


/* =========================================================
   RESET
========================================================= */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "Aptos Serif", Georgia, serif;
    background: var(--white);
    color: var(--black);
    line-height: 1.7;
    overflow-x: hidden;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    font-family: inherit;
}

img {
    max-width: 100%;
    display: block;
}


/* =========================================================
   CONTAINER
========================================================= */

.container {
    width: min(92%, var(--container));
    margin: auto;
}

/* =========================================================
   RELI SLEEVE
   PREMIUM INDUSTRIAL HEADER

   PRIMARY : #0b4375
   RED     : #e53237
   GREY    : #6f767d
   FONT    : Aptos Serif / Georgia
========================================================= */


/* =========================================================
   ROOT
========================================================= */

:root {

    --wdm-primary: #0b4375;
    --wdm-primary-dark: #062f53;
    --wdm-primary-light: #eef5f9;

    --wdm-red: #e53237;
    --wdm-red-dark: #c9272d;
    --wdm-red-light: #fff1f1;

    --wdm-grey: #6f767d;
    --wdm-grey-light: #f3f5f6;

    --wdm-white: #ffffff;
    --wdm-black: #15191d;

    --wdm-border: rgba(11, 67, 117, 0.13);

    --wdm-shadow:
        0 7px 28px rgba(11, 67, 117, 0.09);

    --wdm-shadow-hover:
        0 14px 38px rgba(11, 67, 117, 0.17);

    --wdm-font:
        "Aptos Serif",
        Georgia,
        serif;
}


/* =========================================================
   RESET
========================================================= */

.wdm-header,
.wdm-header *,
.wdm-header *::before,
.wdm-header *::after {

    box-sizing: border-box;
}


.wdm-header a {

    text-decoration: none;
}


.wdm-header button {

    font-family: var(--wdm-font);
}


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

.wdm-header {

    position: sticky;

    top: 0;
    left: 0;

    width: 100%;

    z-index: 9999;

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

    border-bottom:
        1px solid var(--wdm-border);

    box-shadow:
        var(--wdm-shadow);

    backdrop-filter:
        blur(12px);

    -webkit-backdrop-filter:
        blur(12px);

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


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

.wdm-header.wdm-scrolled {

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

    box-shadow:
        0 12px 38px
        rgba(11, 67, 117, 0.16);
}


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

.wdm-header-container {

    width:
        min(1200px, 92%);

    min-height:
        108px;

    margin:
        0 auto;

    display:
        flex;

    align-items:
        center;

    gap:
        25px;
}


/* =========================================================
   LOGO
========================================================= */

.wdm-logo {

    width:
        185px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex-shrink:
        0;

    position:
        relative;

    z-index:
        10;
}


.wdm-logo img {

    width:
        185px;

    height:
        auto;

    max-height:
        100px;

    display:
        block;

    object-fit:
        contain;

    transition:
        transform 0.4s ease;
}


.wdm-logo:hover img {

    transform:
        scale(1.04);
}


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

.wdm-header-right {

    flex:
        1;

    min-width:
        0;

    display:
        flex;

    flex-direction:
        column;
}


/* =========================================================
   TOP CONTACT BAR
========================================================= */

.wdm-header-top {

    min-height:
        48px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        flex-end;

    gap:
        20px;

    border-bottom:
        1px solid var(--wdm-border);
}


/* =========================================================
   CONTACT ITEMS
========================================================= */

.wdm-contact-item {

    display:
        flex;

    align-items:
        center;

    gap:
        8px;

    color:
        var(--wdm-grey);

    font-family:
        var(--wdm-font);

    font-size:
        13px;

    font-weight:
        600;

    white-space:
        nowrap;

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


.wdm-contact-item:hover {

    color:
        var(--wdm-primary);

    transform:
        translateY(-1px);
}


/* =========================================================
   CONTACT ICON
========================================================= */

.wdm-contact-item i {

    width:
        32px;

    height:
        32px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        var(--wdm-primary);

    background:
        var(--wdm-primary-light);

    border:
        1px solid
        rgba(11, 67, 117, 0.14);

    border-radius:
        50%;

    font-size:
        12px;

    transition:
        all 0.3s ease;
}


.wdm-contact-item:hover i {

    background:
        var(--wdm-primary);

    color:
        #ffffff;

    transform:
        translateY(-2px);
}


/* =========================================================
   SOCIAL
========================================================= */

.wdm-social {

    display:
        flex;

    align-items:
        center;

    gap:
        7px;

    margin-left:
        3px;
}


.wdm-social a {

    width:
        32px;

    height:
        32px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    background:
        var(--wdm-primary);

    color:
        #ffffff;

    border-radius:
        50%;

    font-size:
        12px;

    transition:
        all 0.3s ease;
}


.wdm-social a:hover {

    background:
        var(--wdm-red);

    transform:
        translateY(-3px);

    box-shadow:
        0 7px 18px
        rgba(229, 50, 55, 0.22);
}


/* =========================================================
   MAIN NAVIGATION
========================================================= */

.wdm-main-nav {

    min-height:
        59px;

    width:
        100%;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        32px;
}


/* =========================================================
   NORMAL NAV LINKS
========================================================= */

.wdm-nav-link {

    position:
        relative;

    height:
        59px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        var(--wdm-primary);

    font-family:
        var(--wdm-font);

    font-size:
        16px;

    font-weight:
        700;

    white-space:
        nowrap;

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


.wdm-nav-link:hover {

    color:
        var(--wdm-red);

    transform:
        translateY(-1px);
}


/* =========================================================
   ACTIVE LINK
========================================================= */

.wdm-nav-link.active {

    color:
        var(--wdm-primary);
}


.wdm-nav-link.active::after {

    content:
        "";

    position:
        absolute;

    left:
        0;

    right:
        0;

    bottom:
        0;

    height:
        3px;

    background:
        var(--wdm-red);

    border-radius:
        5px 5px 0 0;
}


/* =========================================================
   DROPDOWN WRAPPER
========================================================= */

.wdm-nav-dropdown {

    position:
        relative;

    height:
        59px;

    display:
        flex;

    align-items:
        center;
}


/* =========================================================
   DROPDOWN BUTTON
========================================================= */

.wdm-dropdown-btn {

    height:
        59px;

    padding:
        0;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        7px;

    background:
        transparent;

    border:
        none;

    color:
        var(--wdm-primary);

    font-family:
        var(--wdm-font);

    font-size:
        16px;

    font-weight:
        700;

    cursor:
        pointer;

    transition:
        color 0.3s ease;
}


.wdm-dropdown-btn:hover {

    color:
        var(--wdm-red);
}


/* =========================================================
   DROPDOWN ARROW
========================================================= */

.wdm-dropdown-btn i {

    color:
        var(--wdm-grey);

    font-size:
        10px;

    transition:
        transform 0.3s ease;
}


/* Desktop arrow */

.wdm-nav-dropdown:hover
.wdm-dropdown-btn i {

    transform:
        rotate(180deg);
}


/* =========================================================
   DROPDOWN MENU
========================================================= */

.wdm-dropdown-menu {

    position:
        absolute;

    top:
        calc(100% + 1px);

    left:
        50%;

    width:
        245px;

    padding:
        10px;

    background:
        #ffffff;

    border-top:
        3px solid
        var(--wdm-red);

    border-radius:
        0 0 8px 8px;

    box-shadow:
        0 18px 40px
        rgba(11, 67, 117, 0.17);

    opacity:
        0;

    visibility:
        hidden;

    transform:
        translate(-50%, 10px);

    transition:
        opacity 0.25s ease,
        visibility 0.25s ease,
        transform 0.25s ease;

    z-index:
        10000;
}


/* Desktop hover */

@media (min-width: 901px) {

    .wdm-nav-dropdown:hover
    .wdm-dropdown-menu {

        opacity:
            1;

        visibility:
            visible;

        transform:
            translate(-50%, 0);
    }

}


/* =========================================================
   DROPDOWN LINKS
========================================================= */

.wdm-dropdown-menu a {

    display:
        block;

    padding:
        12px 14px;

    color:
        var(--wdm-primary);

    font-family:
        var(--wdm-font);

    font-size:
        14px;

    font-weight:
        600;

    border-radius:
        5px;

    transition:
        background 0.25s ease,
        color 0.25s ease,
        padding-left 0.25s ease;
}


.wdm-dropdown-menu a:hover {

    background:
        var(--wdm-primary-light);

    color:
        var(--wdm-red);

    padding-left:
        20px;
}


/* =========================================================
   GET QUOTE
========================================================= */

.wdm-header-quote {

    min-width:
        125px;

    height:
        44px;

    padding:
        0 20px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        8px;

    background:
        var(--wdm-red);

    color:
        #ffffff;

    font-family:
        var(--wdm-font);

    font-size:
        14px;

    font-weight:
        800;

    border-radius:
        5px;

    white-space:
        nowrap;

    box-shadow:
        0 7px 18px
        rgba(229, 50, 55, 0.20);

    transition:
        background 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.wdm-header-quote:hover {

    background:
        var(--wdm-primary);

    color:
        #ffffff;

    transform:
        translateY(-2px);

    box-shadow:
        0 10px 25px
        rgba(11, 67, 117, 0.25);
}


.wdm-header-quote span {

    font-size:
        17px;

    transition:
        transform 0.3s ease;
}


.wdm-header-quote:hover span {

    transform:
        translateX(4px);
}


/* =========================================================
   MOBILE MENU BUTTON
========================================================= */

.wdm-menu-toggle {

    display:
        none;

    width:
        44px;

    height:
        44px;

    margin-left:
        auto;

    padding:
        0;

    border:
        none;

    border-radius:
        5px;

    background:
        var(--wdm-primary);

    cursor:
        pointer;

    align-items:
        center;

    justify-content:
        center;

    flex-direction:
        column;

    gap:
        5px;
}


.wdm-menu-toggle span {

    width:
        21px;

    height:
        2px;

    background:
        #ffffff;

    border-radius:
        3px;

    transition:
        all 0.3s ease;
}


/* =========================================================
   HAMBURGER ACTIVE
========================================================= */

.wdm-menu-toggle.active
span:nth-child(1) {

    transform:
        translateY(7px)
        rotate(45deg);
}


.wdm-menu-toggle.active
span:nth-child(2) {

    opacity:
        0;
}


.wdm-menu-toggle.active
span:nth-child(3) {

    transform:
        translateY(-7px)
        rotate(-45deg);
}


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

@media (max-width: 1100px) {

    .wdm-header-container {

        width:
            94%;

        gap:
            18px;
    }


    .wdm-logo {

        width:
            140px;
    }


    .wdm-logo img {

        width:
            135px;
    }


    .wdm-main-nav {

        gap:
            22px;
    }


    .wdm-nav-link,
    .wdm-dropdown-btn {

        font-size:
            14px;
    }


    .wdm-contact-item {

        font-size:
            12px;
    }


    .wdm-header-top {

        gap:
            12px;
    }


    .wdm-header-quote {

        min-width:
            110px;

        padding:
            0 14px;

        font-size:
            13px;
    }

}


/* =========================================================
   MOBILE / SMALL TABLET
========================================================= */

@media (max-width: 900px) {

    .wdm-header-container {

        min-height:
            78px;
    }


    .wdm-logo {

        width:
            auto;
    }


    .wdm-logo img {

        width:
            130px;

        max-height:
            75px;
    }


    .wdm-menu-toggle {

        display:
            flex;
    }


    .wdm-header-quote {

        display:
            none;
    }


    /* MOBILE PANEL */

    .wdm-header-right {

        position:
            absolute;

        top:
            78px;

        left:
            0;

        right:
            0;

        width:
            100%;

        padding:
            15px 20px 20px;

        display:
            none;

        background:
            #ffffff;

        border-top:
            1px solid var(--wdm-border);

        box-shadow:
            0 15px 35px
            rgba(11, 67, 117, 0.15);

        animation:
            wdmMenuSlide 0.3s ease;
    }


    .wdm-header-right.wdm-menu-open {

        display:
            block;
    }


    @keyframes wdmMenuSlide {

        from {

            opacity:
                0;

            transform:
                translateY(-10px);
        }

        to {

            opacity:
                1;

            transform:
                translateY(0);
        }

    }


    /* CONTACT */

    .wdm-header-top {

        min-height:
            auto;

        padding-bottom:
            14px;

        justify-content:
            flex-start;

        flex-wrap:
            wrap;

        gap:
            10px 16px;
    }


    .wdm-contact-item {

        font-size:
            12px;
    }


    .wdm-contact-item i {

        width:
            30px;

        height:
            30px;
    }


    .wdm-social {

        margin-left:
            0;
    }


    .wdm-social a {

        width:
            30px;

        height:
            30px;
    }


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

    .wdm-main-nav {

        min-height:
            auto;

        width:
            100%;

        display:
            flex;

        flex-direction:
            column;

        align-items:
            stretch;

        justify-content:
            flex-start;

        gap:
            0;

        padding-top:
            8px;
    }


    .wdm-nav-link {

        width:
            100%;

        height:
            auto;

        min-height:
            48px;

        padding:
            12px 5px;

        justify-content:
            flex-start;

        border-bottom:
            1px solid var(--wdm-border);
    }


    .wdm-nav-link.active::after {

        display:
            none;
    }


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

    .wdm-nav-dropdown {

        width:
            100%;

        height:
            auto;

        display:
            block;
    }


    .wdm-dropdown-btn {

        width:
            100%;

        height:
            48px;

        justify-content:
            space-between;

        border-bottom:
            1px solid var(--wdm-border);
    }


    /* IMPORTANT:
       JS adds this class when clicked */

    .wdm-dropdown-btn.wdm-dropdown-active i {

        transform:
            rotate(180deg);
    }


    .wdm-dropdown-menu {

        position:
            static;

        width:
            100%;

        display:
            none;

        padding:
            5px 0 5px 15px;

        background:
            var(--wdm-grey-light);

        border:
            none;

        border-left:
            3px solid
            var(--wdm-red);

        border-radius:
            0;

        box-shadow:
            none;

        opacity:
            1;

        visibility:
            visible;

        transform:
            none;
    }


    .wdm-dropdown-menu.wdm-dropdown-open {

        display:
            block;
    }


    .wdm-dropdown-menu a {

        padding:
            11px 12px;
    }


    .wdm-dropdown-menu a:hover {

        padding-left:
            17px;
    }

}


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

@media (max-width: 600px) {

    .wdm-header-container {

        width:
            92%;

        min-height:
            72px;

        gap:
            10px;
    }


    .wdm-logo img {

        width:
            120px;

        max-height:
            68px;
    }


    .wdm-menu-toggle {

        width:
            42px;

        height:
            42px;
    }


    .wdm-header-right {

        top:
            72px;

        padding:
            12px 15px 18px;
    }


    /* MOBILE CONTACT GRID */

    .wdm-header-top {

        display:
            grid;

        grid-template-columns:
            1fr 1fr;

        gap:
            8px;
    }


    .wdm-contact-item {

        font-size:
            10px;

        gap:
            5px;

        min-width:
            0;
    }


    .wdm-contact-item span {

        overflow:
            hidden;

        text-overflow:
            ellipsis;

        white-space:
            nowrap;
    }


    .wdm-contact-item i {

        width:
            27px;

        height:
            27px;

        min-width:
            27px;

        font-size:
            10px;
    }


    /* SOCIAL */

    .wdm-social {

        grid-column:
            1 / -1;

        justify-content:
            flex-start;

        padding-top:
            3px;
    }


    .wdm-social a {

        width:
            29px;

        height:
            29px;

        font-size:
            11px;
    }


    .wdm-nav-link {

        font-size:
            14px;
    }


    .wdm-dropdown-btn {

        font-size:
            14px;
    }

}


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

@media (max-width: 400px) {

    .wdm-header-container {

        width:
            92%;
    }


    .wdm-logo img {

        width:
            108px;
    }


    .wdm-contact-item {

        font-size:
            9px;
    }


    .wdm-contact-item i {

        width:
            25px;

        height:
            25px;

        min-width:
            25px;
    }


    .wdm-menu-toggle {

        width:
            40px;

        height:
            40px;
    }

}


/* =========================================================
   ACCESSIBILITY
========================================================= */

.wdm-nav-link:focus-visible,
.wdm-dropdown-btn:focus-visible,
.wdm-header-quote:focus-visible,
.wdm-menu-toggle:focus-visible,
.wdm-social a:focus-visible,
.wdm-contact-item:focus-visible {

    outline:
        3px solid
        rgba(229, 50, 55, 0.25);

    outline-offset:
        3px;
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .wdm-header,
    .wdm-header *,
    .wdm-header *::before,
    .wdm-header *::after {

        animation:
            none !important;

        transition:
            none !important;
    }

}
/* =========================================================
   RELI SLEEVE
   PREMIUM 3D ANODE HERO SLIDER

   BRAND COLORS
   #e53237 = RED
   #0b4375 = DEEP BLUE
========================================================= */

:root {

    --reli-red: #e53237;
    --reli-blue: #0b4375;

    --reli-blue-dark: #062b4d;
    --reli-blue-deep: #041b30;

    --reli-white: #ffffff;
    --reli-light: #f4f7fa;

    --reli-grey: #c8d1d9;

    --reli-glass: rgba(255,255,255,0.08);
    --reli-border: rgba(255,255,255,0.20);
}


/* =========================================================
   RESET
========================================================= */

.reli-hero *,
.reli-hero *::before,
.reli-hero *::after {
    box-sizing: border-box;
}


.reli-hero {
    position: relative;
    width: 100%;
    overflow: hidden;

    font-family:
        "Aptos Serif",
        Georgia,
        serif;

    background: var(--reli-blue-deep);
}


/* =========================================================
   SLIDER
========================================================= */

.reli-slider {
    position: relative;

    width: 100%;
    height: 580px;

    overflow: hidden;
}


/* =========================================================
   SLIDES
========================================================= */

.reli-slide {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    opacity: 0;
    visibility: hidden;

    overflow: hidden;

    transition:
        opacity 0.9s ease,
        visibility 0.9s ease;
}


.reli-slide.active {

    opacity: 1;
    visibility: visible;

    z-index: 5;
}


/* =========================================================
   BACKGROUND
========================================================= */

.reli-bg {

    position: absolute;

    inset: -2%;

    width: 104%;
    height: 104%;

    background-size: cover;
    background-position: center;

    transform: scale(1.05);

    transition:
        transform 8s ease;
}


.reli-slide.active .reli-bg {

    transform: scale(1.12);
}


/* =========================================================
   PREMIUM BLUE + RED OVERLAY
========================================================= */

.reli-overlay {

    position: absolute;

    inset: 0;

    z-index: 1;

    background:

        linear-gradient(
            90deg,

            rgba(4,27,48,0.98) 0%,

            rgba(11,67,117,0.94) 32%,

            rgba(11,67,117,0.72) 58%,

            rgba(4,27,48,0.35) 100%
        );


    pointer-events: none;
}


/* RED LIGHT EDGE */

.reli-overlay::after {

    content: "";

    position: absolute;

    right: 0;
    top: 0;

    width: 42%;

    height: 100%;

    background:

        radial-gradient(
            circle at 75% 50%,
            rgba(229,50,55,0.28),
            transparent 62%
        );

    pointer-events: none;
}


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

.reli-grid {

    position: absolute;

    inset: 0;

    z-index: 2;

    opacity: 0.14;

    background-image:

        linear-gradient(
            rgba(255,255,255,0.08) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,0.08) 1px,
            transparent 1px
        );

    background-size: 55px 55px;

    mask-image:
        linear-gradient(
            90deg,
            black,
            transparent 80%
        );

    pointer-events: none;
}


/* =========================================================
   MAIN CONTAINER
========================================================= */

.reli-container {

    position: relative;

    z-index: 10;

    width: 90%;

    max-width: 1420px;

    height: 100%;

    margin: 0 auto;

    display: flex;

    align-items: center;

    justify-content: space-between;
}


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

.reli-content {

    position: relative;

    z-index: 15;

    width: 56%;

    padding-top: 0;
}


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

.reli-small-title {

    position: relative;

    display: inline-flex;

    align-items: center;

    gap: 14px;

    margin-bottom: 17px;

    padding-left: 52px;

    color: var(--reli-white);

    font-family:
        "Aptos Serif",
        Georgia,
        serif;

    font-size: 13px;

    font-weight: 600;

    letter-spacing: 3px;

    text-transform: uppercase;
}


.reli-small-title::before {

    content: "";

    position: absolute;

    left: 0;

    top: 50%;

    width: 38px;

    height: 2px;

    background:
        linear-gradient(
            90deg,
            var(--reli-red),
            var(--reli-white)
        );

    transform:
        translateY(-50%);
}


/* =========================================================
   MAIN HEADING
========================================================= */

.reli-content h1 {

    margin: 0 0 18px;

    color: var(--reli-white);

    font-family:
        "Aptos Serif",
        Georgia,
        serif;

    font-size:
        clamp(
            42px,
            5vw,
            68px
        );

    font-weight: 600;

    line-height: 1.02;

    letter-spacing: -1.5px;

    text-shadow:
        0 8px 30px rgba(0,0,0,0.25);
}


.reli-content h1 span {

    display: block;

    color: var(--reli-red);

    margin-top: 5px;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.reli-description {

    max-width: 650px;

    margin: 0 0 25px;

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

    font-family:
        "Aptos Serif",
        Georgia,
        serif;

    font-size: 16px;

    line-height: 1.65;
}


.reli-description strong {

    color: var(--reli-white);

    font-weight: 700;
}


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

.reli-features {

    display: flex;

    align-items: center;

    margin-bottom: 25px;

    gap: 0;
}


.reli-feature {

    display: flex;

    align-items: center;

    min-height: 46px;

    padding:
        0 15px;

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


.reli-feature:first-child {

    padding-left: 0;
}


.reli-feature:last-child {

    border-right: none;
}


/* =========================================================
   FEATURE ICON
========================================================= */

.reli-feature-icon {

    width: 34px;
    height: 34px;

    margin-right: 9px;

    display: flex;

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

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

    border-radius: 50%;

    color: var(--reli-white);

    font-size: 14px;

    transition:
        all 0.3s ease;
}


.reli-feature:hover
.reli-feature-icon {

    background: var(--reli-red);

    border-color: var(--reli-red);

    transform:
        rotate(10deg)
        scale(1.08);
}


/* =========================================================
   FEATURE TEXT
========================================================= */

.reli-feature strong,
.reli-feature span {

    display: block;

    font-family:
        "Aptos Serif",
        Georgia,
        serif;

    color: var(--reli-white);
}


.reli-feature strong {

    font-size: 12px;

    font-weight: 700;

    line-height: 1.3;
}


.reli-feature span {

    font-size: 11px;

    opacity: 0.78;

    line-height: 1.3;
}


/* =========================================================
   PREMIUM BUTTON
========================================================= */

.reli-button {

    position: relative;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 14px;

    padding:
        13px 24px;

    overflow: hidden;

    background: var(--reli-red);

    color: var(--reli-white);

    text-decoration: none;

    font-family:
        "Aptos Serif",
        Georgia,
        serif;

    font-size: 14px;

    font-weight: 600;

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

    border-radius: 4px;

    box-shadow:
        0 12px 30px
        rgba(229,50,55,0.25);

    transition:
        all 0.35s ease;
}


.reli-button::before {

    content: "";

    position: absolute;

    left: -100%;

    top: 0;

    width: 100%;

    height: 100%;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,0.25),
            transparent
        );

    transition:
        left 0.6s ease;
}


.reli-button:hover::before {

    left: 100%;
}


.reli-button:hover {

    background: var(--reli-blue);

    transform:
        translateY(-4px);

    box-shadow:
        0 15px 35px
        rgba(11,67,117,0.40);
}


.reli-button span {

    font-size: 20px;

    line-height: 1;

    transition:
        transform 0.3s ease;
}


.reli-button:hover span {

    transform:
        translateX(5px);
}


/* =========================================================
   PRODUCT AREA
========================================================= */

.reli-product {

    position: absolute;

    right: -1%;

    bottom: 0;

    width: 47%;

    height: 90%;

    display: flex;

    align-items: center;

    justify-content: center;

    z-index: 8;

    pointer-events: none;
}


/* =========================================================
   PRODUCT IMAGE
========================================================= */

.reli-product img {

    position: relative;

    z-index: 5;

    width: auto;

    max-width: 70%;

    max-height: 390px;

    object-fit: contain;

    filter:
        drop-shadow(
            0 25px 30px
            rgba(0,0,0,0.50)
        );

    animation:
        reliProductFloat
        5s
        ease-in-out
        infinite;

    transition:
        transform 0.8s ease;
}


/* =========================================================
   PRODUCT FLOAT
========================================================= */

@keyframes reliProductFloat {

    0% {

        transform:
            translateY(0)
            rotate(0deg);
    }

    50% {

        transform:
            translateY(-12px)
            rotate(1.2deg);
    }

    100% {

        transform:
            translateY(0)
            rotate(0deg);
    }
}


/* =========================================================
   PRODUCT GLOW
========================================================= */

.reli-product-glow {

    position: absolute;

    width: 390px;

    height: 390px;

    border-radius: 50%;

    background:

        radial-gradient(
            circle,

            rgba(229,50,55,0.28) 0%,

            rgba(11,67,117,0.22) 38%,

            rgba(255,255,255,0.06) 55%,

            transparent 72%
        );

    filter:
        blur(8px);

    z-index: 1;

    animation:
        reliGlowPulse
        4s
        ease-in-out
        infinite;
}


@keyframes reliGlowPulse {

    0%,
    100% {

        transform:
            scale(0.92);

        opacity: 0.65;
    }

    50% {

        transform:
            scale(1.08);

        opacity: 1;
    }
}


/* =========================================================
   PRODUCT RING
========================================================= */

.reli-product-ring {

    position: absolute;

    width: 430px;

    height: 430px;

    border-radius: 50%;

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

    box-shadow:

        0 0 0 1px
        rgba(229,50,55,0.08),

        inset 0 0 60px
        rgba(229,50,55,0.05);

    animation:
        reliRingRotate
        18s
        linear
        infinite;
}


.reli-product-ring::before {

    content: "";

    position: absolute;

    inset: 30px;

    border-radius: 50%;

    border:
        1px dashed
        rgba(229,50,55,0.30);
}


@keyframes reliRingRotate {

    from {

        transform:
            rotate(0deg);
    }

    to {

        transform:
            rotate(360deg);
    }
}


/* =========================================================
   ORBIT
========================================================= */

.reli-product-orbit {

    position: absolute;

    width: 480px;

    height: 190px;

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

    border-radius: 50%;

    transform:
        rotate(-18deg);

    animation:
        reliOrbit
        8s
        linear
        infinite;
}


.reli-product-orbit span {

    position: absolute;

    top: 50%;

    left: -5px;

    width: 10px;

    height: 10px;

    border-radius: 50%;

    background: var(--reli-red);

    box-shadow:
        0 0 20px
        var(--reli-red);

    transform:
        translateY(-50%);
}


@keyframes reliOrbit {

    from {

        transform:
            rotate(-18deg);
    }

    to {

        transform:
            rotate(342deg);
    }
}


/* =========================================================
   SLIDE NUMBER
========================================================= */

.reli-slide-number {

    position: absolute;

    right: 42px;

    bottom: 34px;

    z-index: 25;

    display: flex;

    align-items: center;

    gap: 10px;

    color: var(--reli-white);
}


.reli-slide-number span {

    font-size: 25px;

    font-weight: 600;
}


.reli-slide-number i {

    width: 35px;

    height: 1px;

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


.reli-slide-number small {

    font-size: 11px;

    opacity: 0.65;
}


/* =========================================================
   ARROWS
========================================================= */

.reli-prev,
.reli-next {

    position: absolute;

    top: 50%;

    z-index: 30;

    width: 48px;

    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

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

    border-radius: 50%;

    background:
        rgba(11,67,117,0.65);

    backdrop-filter:
        blur(8px);

    color: var(--reli-white);

    font-size: 19px;

    cursor: pointer;

    transform:
        translateY(-50%);

    transition:
        all 0.35s ease;
}


.reli-prev {

    left: 22px;
}


.reli-next {

    right: 22px;
}


.reli-prev:hover,
.reli-next:hover {

    background: var(--reli-red);

    border-color: var(--reli-red);

    transform:
        translateY(-50%)
        scale(1.08);

    box-shadow:
        0 10px 25px
        rgba(229,50,55,0.30);
}


/* =========================================================
   DOTS
========================================================= */

.reli-dots {

    position: absolute;

    left: 50%;

    bottom: 22px;

    z-index: 30;

    display: flex;

    align-items: center;

    gap: 8px;

    transform:
        translateX(-50%);
}


.reli-dot {

    width: 9px;

    height: 9px;

    padding: 0;

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

    border-radius: 20px;

    background: transparent;

    cursor: pointer;

    transition:
        all 0.35s ease;
}


.reli-dot.active {

    width: 30px;

    background: var(--reli-red);

    border-color: var(--reli-red);

    box-shadow:
        0 0 12px
        rgba(229,50,55,0.50);
}


/* =========================================================
   PROGRESS
========================================================= */

.reli-progress {

    position: absolute;

    left: 0;

    bottom: 0;

    width: 100%;

    height: 2px;

    z-index: 30;

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


.reli-progress span {

    display: block;

    width: 33.333%;

    height: 100%;

    background:
        linear-gradient(
            90deg,
            var(--reli-red),
            #ff6b70
        );

    transform-origin: left;

    animation:
        reliProgress
        6s
        linear
        infinite;
}


@keyframes reliProgress {

    from {

        transform:
            scaleX(0);
    }

    to {

        transform:
            scaleX(1);
    }
}


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

@media (max-width: 1100px) {

    .reli-slider {

        height: 500px;
    }


    .reli-container {

        width: 92%;
    }


    .reli-content {

        width: 60%;
    }


    .reli-content h1 {

        font-size: 50px;
    }


    .reli-description {

        font-size: 14px;

        max-width: 530px;
    }


    .reli-product {

        width: 44%;

        right: -2%;
    }


    .reli-product img {

        max-width: 68%;

        max-height: 320px;
    }


    .reli-product-ring {

        width: 350px;

        height: 350px;
    }


    .reli-product-orbit {

        width: 400px;
    }
}


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

@media (max-width: 900px) {

    .reli-slider {

        height: 470px;
    }


    .reli-content {

        width: 63%;
    }


    .reli-content h1 {

        font-size: 43px;
    }


    .reli-feature {

        padding-left: 8px;

        padding-right: 8px;
    }


    .reli-feature-icon {

        width: 30px;

        height: 30px;

        font-size: 12px;
    }


    .reli-product {

        width: 43%;
    }


    .reli-product img {

        max-height: 290px;
    }


    .reli-product-ring {

        width: 310px;

        height: 310px;
    }
}


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

@media (max-width: 768px) {

    .reli-slider {

        height: 650px;
    }


    .reli-container {

        width: 90%;

        align-items: flex-start;

        justify-content: center;
    }


    .reli-content {

        width: 100%;

        padding-top: 55px;

        text-align: center;
    }


    .reli-small-title {

        padding-left: 0;

        font-size: 10px;

        letter-spacing: 2px;

        justify-content: center;
    }


    .reli-small-title::before {

        display: none;
    }


    .reli-content h1 {

        font-size: 36px;

        line-height: 1.10;

        margin-bottom: 15px;
    }


    .reli-description {

        max-width: 470px;

        margin:
            0 auto 20px;

        font-size: 13px;

        line-height: 1.55;
    }


    /* Hide feature bar */

    .reli-features {

        display: none;
    }


    .reli-button {

        padding:
            12px 21px;

        font-size: 13px;
    }


    /* PRODUCT */

    .reli-product {

        width: 70%;

        height: 42%;

        right: 15%;

        bottom: 45px;
    }


    .reli-product img {

        max-width: 72%;

        max-height: 190px;
    }


    .reli-product-ring {

        width: 230px;

        height: 230px;
    }


    .reli-product-orbit {

        width: 280px;

        height: 120px;
    }


    .reli-product-glow {

        width: 220px;

        height: 220px;
    }


    /* ARROWS */

    .reli-prev,
    .reli-next {

        width: 36px;

        height: 36px;

        font-size: 15px;
    }


    .reli-prev {

        left: 9px;
    }


    .reli-next {

        right: 9px;
    }


    .reli-slide-number {

        display: none;
    }


    .reli-dots {

        bottom: 18px;
    }
}


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

@media (max-width: 480px) {

    .reli-slider {

        height: 610px;
    }


    .reli-content {

        padding-top: 45px;
    }


    .reli-small-title {

        font-size: 9px;

        letter-spacing: 1.3px;
    }


    .reli-content h1 {

        font-size: 30px;

        line-height: 1.12;
    }


    .reli-description {

        max-width: 350px;

        font-size: 12.5px;
    }


    .reli-button {

        padding:
            11px 18px;

        font-size: 12px;
    }


    .reli-product {

        width: 72%;

        right: 14%;

        bottom: 42px;
    }


    .reli-product img {

        max-width: 75%;

        max-height: 165px;
    }


    .reli-product-ring {

        width: 200px;

        height: 200px;
    }


    .reli-product-glow {

        width: 190px;

        height: 190px;
    }


    .reli-product-orbit {

        width: 245px;

        height: 105px;
    }
}


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

@media (max-width: 360px) {

    .reli-slider {

        height: 570px;
    }


    .reli-content {

        padding-top: 40px;
    }


    .reli-content h1 {

        font-size: 27px;
    }


    .reli-description {

        font-size: 12px;
    }


    .reli-product {

        bottom: 35px;
    }


    .reli-product img {

        max-height: 145px;
    }


    .reli-product-ring {

        width: 175px;

        height: 175px;
    }
}

/* =========================================================
   RELI SLEEVE
   PREMIUM PRODUCTS + MATERIALS
   LIGHT INDUSTRIAL VERSION

   COLORS:
   BLUE  #0b4375
   RED   #e53237

   FONT:
   Aptos Serif / Georgia / Serif
========================================================= */


.reli-products-premium,
.reli-products-premium * {

    font-family:
        "Aptos Serif",
        Georgia,
        serif;
}


/* =========================================================
   MAIN SECTION
========================================================= */

.reli-products-premium {

    position: relative;

    width: 100%;

    overflow: hidden;

    padding:
        105px 0
        75px;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f7fafc 48%,
            #ffffff 100%
        );

    color: #0b4375;
}


/* =========================================================
   LIGHT BACKGROUND GRID
========================================================= */

.reli-products-grid {

    position: absolute;

    inset: 0;

    background-image:

        linear-gradient(
            rgba(11,67,117,.025) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(11,67,117,.025) 1px,
            transparent 1px
        );

    background-size:
        70px 70px;

    mask-image:
        linear-gradient(
            to bottom,
            transparent,
            black 10%,
            black 90%,
            transparent
        );

    pointer-events: none;
}


/* =========================================================
   SOFT BLUE LIGHT
========================================================= */

.reli-products-premium::before {

    content: "";

    position: absolute;

    width: 650px;
    height: 650px;

    top: -360px;
    right: -270px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(11,67,117,.055),
            transparent 68%
        );

    pointer-events: none;
}


/* =========================================================
   SOFT RED LIGHT
========================================================= */

.reli-products-premium::after {

    content: "";

    position: absolute;

    width: 500px;
    height: 500px;

    left: -280px;
    bottom: -280px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(229,50,55,.045),
            transparent 70%
        );

    pointer-events: none;
}


/* =========================================================
   CONTAINER
========================================================= */

.reli-products-container {

    position: relative;

    z-index: 2;

    width:
        min(
            1420px,
            calc(100% - 70px)
        );

    margin: 0 auto;
}


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

.reli-products-heading {

    display: grid;

    grid-template-columns:
        1fr
        430px;

    gap: 70px;

    align-items: end;

    margin-bottom: 62px;
}


/* =========================================================
   KICKER
========================================================= */

.reli-products-kicker {

    display: flex;

    align-items: center;

    gap: 12px;

    color: #0b4375;

    font-family: Arial, sans-serif;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 3px;

    text-transform: uppercase;
}


.reli-products-kicker i {

    display: block;

    width: 42px;
    height: 2px;

    background: #e53237;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.reli-products-heading-left h2 {

    margin:
        17px 0 0;

    color: #0b4375;

    font-size:
        clamp(
            55px,
            7vw,
            100px
        );

    line-height: .86;

    font-weight: 500;

    letter-spacing: -5px;
}


.reli-products-heading-left h2 span {

    display: block;

    color: #e53237;

    font-style: italic;
}


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

.reli-products-heading-right {

    padding-bottom: 5px;
}


.reli-products-heading-right > span {

    display: block;

    margin-bottom: 15px;

    color: #0b4375;

    font-family: Arial, sans-serif;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 3px;
}


.reli-products-heading-right p {

    margin: 0;

    max-width: 430px;

    color: #687985;

    font-family: Arial, sans-serif;

    font-size: 14px;

    line-height: 1.75;
}



/* =========================================================
   PRODUCT SECTION BLOCK
========================================================= */

.reli-products-section-block {

    position: relative;
}



/* =========================================================
   PRODUCT SUB HEADING
========================================================= */

.reli-products-subheading {

    display: grid;

    grid-template-columns:
        1fr
        430px;

    gap: 60px;

    align-items: end;

    margin-bottom: 30px;

    padding-bottom: 23px;

    border-bottom:
        1px solid
        #dce5eb;
}


.reli-products-subheading > div > span {

    display: block;

    margin-bottom: 10px;

    color: #e53237;

    font-family: Arial, sans-serif;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 2.5px;

    text-transform: uppercase;
}


.reli-products-subheading h3 {

    margin: 0;

    color: #0b4375;

    font-size: 40px;

    line-height: 1;

    font-weight: 400;

    letter-spacing: -1.5px;
}


.reli-products-subheading h3 strong {

    color: #e53237;

    font-weight: 600;

    font-style: italic;
}


.reli-products-subheading > p {

    margin: 0;

    color: #71818d;

    font-family: Arial, sans-serif;

    font-size: 13px;

    line-height: 1.65;
}



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

.reli-products-cards {

    display: grid;

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

    gap: 22px;
}



/* =========================================================
   PRODUCT CARD
========================================================= */

.reli-product-card {

    position: relative;

    background: #ffffff;

    border:
        1px solid
        #dce5eb;

    overflow: hidden;

    transition:
        transform .5s
        cubic-bezier(.2,.8,.2,1),

        box-shadow .5s ease,

        border-color .5s ease;
}


.reli-product-card:hover {

    transform:
        translateY(-8px);

    border-color:
        rgba(11,67,117,.25);

    box-shadow:
        0 22px 55px
        rgba(11,67,117,.12);
}



/* =========================================================
   RED TOP LINE
========================================================= */

.reli-product-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 0;
    height: 3px;

    background: #e53237;

    z-index: 10;

    transition:
        width .5s ease;
}


.reli-product-card:hover::before {

    width: 100%;
}



/* =========================================================
   NUMBER
========================================================= */

.reli-product-number {

    position: absolute;

    top: 17px;
    left: 18px;

    z-index: 8;

    width: 40px;
    height: 40px;

    display: flex;

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

    background:
        rgba(
            255,
            255,
            255,
            .96
        );

    border:
        1px solid
        rgba(11,67,117,.10);

    color: #0b4375;

    font-family: Arial, sans-serif;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1px;

    box-shadow:
        0 7px 20px
        rgba(11,67,117,.07);
}



/* =========================================================
   IMAGE AREA
========================================================= */

.reli-product-image {

    position: relative;

    height: 410px;

    overflow: hidden;

    display: flex;

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

    background:
        linear-gradient(
            145deg,
            #f8fafc 0%,
            #edf3f7 100%
        );
}



/* =========================================================
   IMAGE CIRCLE
========================================================= */

.reli-product-image-bg {

    position: absolute;

    width: 355px;
    height: 355px;

    border-radius: 50%;

    border:
        1px solid
        rgba(11,67,117,.09);

    background:
        radial-gradient(
            circle,
            rgba(11,67,117,.065),
            transparent 68%
        );

    transition:
        transform .8s ease,

        border-color .5s ease;
}


/* =========================================================
   INNER TECHNICAL RING
========================================================= */

.reli-product-image-bg::before {

    content: "";

    position: absolute;

    inset: 28px;

    border-radius: 50%;

    border:
        1px dashed
        rgba(229,50,55,.16);
}


/* =========================================================
   RED TECHNICAL DETAIL
========================================================= */

.reli-product-image-bg::after {

    content: "";

    position: absolute;

    width: 10px;
    height: 10px;

    top: 23px;
    right: 58px;

    border-radius: 50%;

    background: #e53237;

    box-shadow:
        0 0 0 6px
        rgba(229,50,55,.07),

        0 0 20px
        rgba(229,50,55,.16);
}



/* =========================================================
   PRODUCT IMAGE
========================================================= */

.reli-product-image img {

    position: relative;

    z-index: 3;

    width: 94%;

    max-width: 430px;

    height: 365px;

    object-fit: contain;

    transform:
        scale(1.04);

    filter:
        drop-shadow(
            0 24px 25px
            rgba(11,67,117,.14)
        );

    transition:
        transform .7s
        cubic-bezier(.2,.8,.2,1),

        filter .5s ease;
}


.reli-product-card:hover
.reli-product-image img {

    transform:
        scale(1.12)
        translateY(-5px);

    filter:
        drop-shadow(
            0 30px 35px
            rgba(11,67,117,.20)
        );
}


.reli-product-card:hover
.reli-product-image-bg {

    transform:
        scale(1.07);

    border-color:
        rgba(11,67,117,.17);
}



/* =========================================================
   PRODUCT LABEL
========================================================= */

.reli-product-label {

    position: absolute;

    top: 20px;
    right: 20px;

    z-index: 8;

    padding:
        7px 11px;

    background: #0b4375;

    color: #ffffff;

    font-family: Arial, sans-serif;

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 2px;

    text-transform: uppercase;
}



/* =========================================================
   IMAGE ARROW
========================================================= */

.reli-product-arrow {

    position: absolute;

    right: 17px;
    bottom: 17px;

    z-index: 8;

    width: 43px;
    height: 43px;

    display: flex;

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

    border-radius: 50%;

    background: #ffffff;

    color: #0b4375;

    font-family: Arial, sans-serif;

    font-size: 20px;

    box-shadow:
        0 8px 22px
        rgba(11,67,117,.10);

    transition:
        background .35s ease,

        color .35s ease,

        transform .35s ease;
}


.reli-product-card:hover
.reli-product-arrow {

    background: #e53237;

    color: #ffffff;

    transform:
        rotate(45deg);
}



/* =========================================================
   PRODUCT INFO
========================================================= */

.reli-product-info {

    padding:
        23px
        25px
        24px;

    min-height: 205px;

    background: #ffffff;

    border-top:
        1px solid
        #edf1f4;
}



/* =========================================================
   CATEGORY
========================================================= */

.reli-product-category {

    display: block;

    margin-bottom: 8px;

    color: #e53237;

    font-family: Arial, sans-serif;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 2.3px;

    text-transform: uppercase;
}



/* =========================================================
   PRODUCT NAME
========================================================= */

.reli-product-info h3 {

    margin: 0;

    color: #0b4375;

    font-size: 28px;

    line-height: 1.05;

    font-weight: 400;

    letter-spacing: -.8px;
}


.reli-product-info h3 strong {

    display: inline;

    color: #0b4375;

    font-weight: 700;
}



/* =========================================================
   DESCRIPTION
========================================================= */

.reli-product-info p {

    margin:
        12px 0
        17px;

    max-width: 470px;

    color: #70808e;

    font-family: Arial, sans-serif;

    font-size: 12px;

    line-height: 1.55;
}



/* =========================================================
   PRODUCT LINK
========================================================= */

.reli-product-link {

    display: inline-flex;

    align-items: center;

    gap: 13px;

    padding-bottom: 6px;

    color: #0b4375;

    text-decoration: none;

    font-family: Arial, sans-serif;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 2px;

    position: relative;
}


.reli-product-link::after {

    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 100%;
    height: 1px;

    background: #e53237;

    transform:
        scaleX(0);

    transform-origin: left;

    transition:
        transform .4s ease;
}


.reli-product-link i {

    font-family: Arial, sans-serif;

    font-size: 15px;

    font-style: normal;

    transition:
        transform .35s ease,

        color .35s ease;
}


.reli-product-card:hover
.reli-product-link::after {

    transform:
        scaleX(1);
}


.reli-product-card:hover
.reli-product-link i {

    color: #e53237;

    transform:
        translateX(5px);
}



/* =========================================================
   MATERIAL DIVIDER
========================================================= */

.reli-material-divider {

    display: grid;

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

    align-items: center;

    gap: 25px;

    margin:
        72px 0
        52px;
}


.reli-material-divider div {

    height: 1px;

    background:
        #d8e2e9;
}


.reli-material-divider span {

    color: #0b4375;

    font-family: Arial, sans-serif;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 2.5px;

    white-space: nowrap;
}



/* =========================================================
   MATERIAL SECTION
========================================================= */

.reli-materials-section {

    position: relative;
}



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

.reli-materials-subheading {

    display: grid;

    grid-template-columns:
        1fr
        430px;

    gap: 60px;

    align-items: end;

    margin-bottom: 30px;

    padding-bottom: 23px;

    border-bottom:
        1px solid
        #dce5eb;
}


.reli-materials-subheading > div > span {

    display: block;

    margin-bottom: 10px;

    color: #e53237;

    font-family: Arial, sans-serif;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 2.5px;

    text-transform: uppercase;
}


.reli-materials-subheading h3 {

    margin: 0;

    color: #0b4375;

    font-size: 40px;

    line-height: 1;

    font-weight: 400;

    letter-spacing: -1.5px;
}


.reli-materials-subheading h3 strong {

    color: #e53237;

    font-weight: 600;

    font-style: italic;
}


.reli-materials-subheading > p {

    margin: 0;

    color: #71818d;

    font-family: Arial, sans-serif;

    font-size: 13px;

    line-height: 1.65;
}



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

.reli-materials-grid {

    display: grid;

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

    gap: 15px;
}



/* =========================================================
   MATERIAL CARD
========================================================= */

.reli-material-card {

    position: relative;

    min-height: 160px;

    display: flex;

    align-items: center;

    padding:
        25px
        50px
        25px
        62px;

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

    border:
        1px solid
        #dbe5ec;

    color: #0b4375;

    text-decoration: none;

    overflow: hidden;

    transition:
        transform .45s
        cubic-bezier(.2,.8,.2,1),

        box-shadow .45s ease,

        border-color .45s ease;
}


.reli-material-card::before {

    content: "";

    position: absolute;

    left: 0;
    top: 0;

    width: 3px;
    height: 0;

    background: #e53237;

    transition:
        height .45s ease;
}


.reli-material-card:hover {

    transform:
        translateY(-6px);

    border-color:
        rgba(11,67,117,.23);

    box-shadow:
        0 18px 40px
        rgba(11,67,117,.11);
}


.reli-material-card:hover::before {

    height: 100%;
}



/* =========================================================
   MATERIAL INDEX
========================================================= */

.reli-material-index {

    position: absolute;

    left: 19px;
    top: 22px;

    width: 29px;
    height: 29px;

    display: flex;

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

    border-radius: 50%;

    background: #ffffff;

    border:
        1px solid
        #dce5eb;

    color: #0b4375;

    font-family: Arial, sans-serif;

    font-size: 9px;

    font-weight: 700;

    box-shadow:
        0 5px 15px
        rgba(11,67,117,.07);
}



/* =========================================================
   MATERIAL MAIN
========================================================= */

.reli-material-main {

    min-width: 0;
}


.reli-material-main > span {

    display: block;

    margin-bottom: 8px;

    color: #e53237;

    font-family: Arial, sans-serif;

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 2px;

    text-transform: uppercase;
}


.reli-material-main h4 {

    margin: 0;

    color: #0b4375;

    font-size: 21px;

    line-height: 1.12;

    font-weight: 500;

    letter-spacing: -.5px;
}


.reli-material-main p {

    margin:
        10px 0 0;

    color: #71818d;

    font-family: Arial, sans-serif;

    font-size: 11px;

    line-height: 1.4;
}


.reli-material-main p strong {

    color: #0b4375;

    font-weight: 700;
}



/* =========================================================
   MATERIAL ARROW
========================================================= */

.reli-material-arrow {

    position: absolute;

    right: 17px;
    bottom: 17px;

    width: 32px;
    height: 32px;

    display: flex;

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

    border-radius: 50%;

    background: #ffffff;

    color: #0b4375;

    font-family: Arial, sans-serif;

    font-size: 15px;

    box-shadow:
        0 5px 15px
        rgba(11,67,117,.08);

    transition:
        background .35s ease,

        color .35s ease,

        transform .35s ease;
}


.reli-material-card:hover
.reli-material-arrow {

    background: #e53237;

    color: #ffffff;

    transform:
        rotate(45deg);
}



/* =========================================================
   BOTTOM INFORMATION BAR
========================================================= */

.reli-products-bottom {

    display: grid;

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

    align-items: center;

    gap: 24px;

    margin-top: 42px;

    padding-top: 19px;

    border-top:
        1px solid
        #dce4ea;

    color: #87949f;

    font-family: Arial, sans-serif;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 2px;
}


.reli-products-bottom-line {

    height: 1px;

    background:
        #dce4ea;
}


.reli-products-bottom strong {

    color: #0b4375;
}


.reli-products-bottom p {

    margin: 0;
}



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

@media (max-width: 1150px) {

    .reli-products-heading {

        grid-template-columns:
            1fr
            360px;

        gap: 40px;
    }


    .reli-products-subheading,
    .reli-materials-subheading {

        grid-template-columns:
            1fr
            360px;

        gap: 40px;
    }


    .reli-products-cards {

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


    .reli-materials-grid {

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


    .reli-product-image {

        height: 390px;
    }


    .reli-product-image img {

        width: 92%;

        height: 350px;
    }

}



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

@media (max-width: 760px) {

    .reli-products-premium {

        padding:
            75px 0
            55px;
    }


    .reli-products-container {

        width:
            calc(100% - 32px);
    }


    .reli-products-heading {

        display: block;

        margin-bottom: 48px;
    }


    .reli-products-heading-left h2 {

        font-size: 57px;

        letter-spacing: -3px;
    }


    .reli-products-heading-right {

        margin-top: 30px;
    }


    .reli-products-heading-right p {

        font-size: 14px;
    }


    .reli-products-subheading,
    .reli-materials-subheading {

        display: block;

        margin-bottom: 25px;
    }


    .reli-products-subheading > p,
    .reli-materials-subheading > p {

        margin-top: 20px;

        font-size: 13px;
    }


    .reli-products-subheading h3,
    .reli-materials-subheading h3 {

        font-size: 35px;

        letter-spacing: -1px;
    }


    .reli-products-cards {

        grid-template-columns: 1fr;

        gap: 18px;
    }


    .reli-product-image {

        height: 370px;
    }


    .reli-product-image img {

        width: 94%;

        height: 335px;

        max-width: 430px;
    }


    .reli-product-image-bg {

        width: 310px;
        height: 310px;
    }


    .reli-product-info {

        min-height: auto;

        padding:
            22px
            22px
            23px;
    }


    .reli-product-info h3 {

        font-size: 27px;
    }


    .reli-product-info p {

        margin:
            10px 0
            15px;

        font-size: 12px;
    }


    .reli-material-divider {

        margin:
            55px 0
            40px;
    }


    .reli-materials-grid {

        grid-template-columns: 1fr;

        gap: 12px;
    }


    .reli-material-card {

        min-height: 130px;
    }


    .reli-products-bottom {

        grid-template-columns:
            1fr
            1fr;

        row-gap: 13px;
    }


    .reli-products-bottom-line {

        display: none;
    }


    .reli-products-bottom p {

        text-align: right;
    }

}



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

@media (max-width: 480px) {

    .reli-products-heading-left h2 {

        font-size: 49px;
    }


    .reli-products-subheading h3,
    .reli-materials-subheading h3 {

        font-size: 31px;
    }


    .reli-product-image {

        height: 335px;
    }


    .reli-product-image img {

        width: 96%;

        height: 305px;
    }


    .reli-product-image-bg {

        width: 275px;
        height: 275px;
    }


    .reli-product-info {

        padding:
            20px
            19px
            21px;
    }


    .reli-product-info h3 {

        font-size: 25px;
    }


    .reli-product-info p {

        font-size: 11.5px;

        line-height: 1.5;
    }


    .reli-material-card {

        min-height: 120px;

        padding-left: 58px;
    }


    .reli-material-main h4 {

        font-size: 20px;
    }


    .reli-products-bottom {

        font-size: 8px;

        letter-spacing: 1.2px;
    }

}



/* =========================================================
   REDUCE MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .reli-product-card,
    .reli-product-image img,
    .reli-product-image-bg,
    .reli-product-arrow,
    .reli-product-link,
    .reli-product-link::after,
    .reli-material-card,
    .reli-material-arrow {

        transition: none !important;
    }

}
/* =========================================================
   RELI SLEEVE
   ABOUT US - NEW PREMIUM DESIGN

   BRAND:
   BLUE  #0b4375
   RED   #e53237

   FONT:
   Aptos Serif / Georgia / Serif

   STYLE:
   Premium / Editorial / Industrial
========================================================= */


/* =========================================================
   GLOBAL
========================================================= */

.reli-about-new,
.reli-about-new * {
    box-sizing: border-box;

    font-family:
        "Aptos Serif",
        Georgia,
        serif;
}


/* =========================================================
   MAIN SECTION
========================================================= */

.reli-about-new {
    position: relative;

    width: 100%;

    padding:
        105px 0
        90px;

    overflow: hidden;

    background:
        linear-gradient(
            120deg,
            #0c3556 0%,
            #10466e 52%,
            #0b4375 100%
        );

    color: #ffffff;
}


/* =========================================================
   CONTAINER
========================================================= */

.reli-about-new-container {
    width:
        min(
            1420px,
            calc(100% - 80px)
        );

    margin: 0 auto;
}


/* =========================================================
   TOP BAR
========================================================= */

.reli-about-new-top {
    display: flex;

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

    padding-bottom: 20px;

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


/* =========================================================
   TOP LEFT
========================================================= */

.reli-about-new-top-left {
    display: flex;

    align-items: center;

    gap: 14px;
}


.reli-about-new-top-left span {
    width: 38px;
    height: 2px;

    display: block;

    background: #e53237;
}


.reli-about-new-top-left p {
    margin: 0;

    color: rgba(255,255,255,.90);

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 3px;
}


/* =========================================================
   TOP RIGHT
========================================================= */

.reli-about-new-top-right {
    display: flex;

    align-items: center;

    gap: 14px;
}


.reli-about-new-top-right strong {
    color: #e53237;

    font-size: 18px;

    font-weight: 700;
}


.reli-about-new-top-right small {
    color:
        rgba(
            255,
            255,
            255,
            .50
        );

    font-size: 9px;

    letter-spacing: 2px;
}


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

.reli-about-new-main {
    display: grid;

    grid-template-columns:
        .95fr
        1.05fr;

    gap: 80px;

    align-items: center;

    padding:
        75px 0
        80px;
}


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

.reli-about-new-content {
    max-width: 650px;
}


/* =========================================================
   EYEBROW
========================================================= */

.reli-about-new-eyebrow {
    position: relative;

    padding-left: 20px;

    margin-bottom: 25px;

    color: #e53237;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 3px;
}


.reli-about-new-eyebrow::before {
    content: "";

    position: absolute;

    left: 0;
    top: 50%;

    width: 3px;
    height: 100%;

    background: #e53237;

    transform:
        translateY(-50%);
}


/* =========================================================
   MAIN HEADING
========================================================= */

.reli-about-new-content h2 {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            58px,
            6vw,
            96px
        );

    line-height: .92;

    font-weight: 400;

    letter-spacing: -4px;
}


.reli-about-new-content h2 span {
    display: block;

    color: #e53237;

    font-weight: 700;

    font-style: italic;
}


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

.reli-about-new-intro {
    max-width: 570px;

    margin:
        38px 0
        22px;

    color:
        rgba(
            255,
            255,
            255,
            .90
        );

    font-size: 18px;

    line-height: 1.75;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.reli-about-new-description {
    max-width: 570px;

    margin: 0;

    color:
        rgba(
            255,
            255,
            255,
            .58
        );

    font-size: 14px;

    line-height: 1.85;
}


/* =========================================================
   BUTTON
========================================================= */

.reli-about-new-button {
    display: inline-flex;

    align-items: center;

    gap: 20px;

    margin-top: 38px;

    padding:
        12px
        0;

    text-decoration: none;

    color: #ffffff;

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

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 2px;

    transition:
        color .3s ease,
        border-color .3s ease;
}


.reli-about-new-button b {
    display: flex;

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

    width: 34px;
    height: 34px;

    background: #e53237;

    color: #ffffff;

    font-family: Arial, sans-serif;

    font-size: 17px;

    font-weight: 400;

    transition:
        transform .35s ease,
        background .35s ease;
}


.reli-about-new-button:hover {
    color: #ffffff;

    border-color: #e53237;
}


.reli-about-new-button:hover b {
    transform:
        translate(
            5px,
            -4px
        );

    background: #ffffff;

    color: #e53237;
}


/* =========================================================
   IMAGE AREA
========================================================= */

.reli-about-new-image-area {
    position: relative;

    padding-right: 25px;
}


/* =========================================================
   IMAGE
========================================================= */

.reli-about-new-image {
    position: relative;

    height: 560px;

    overflow: hidden;

    background: #dce5ec;
}


.reli-about-new-image::after {
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(4,27,45,.02),
            rgba(4,27,45,.40)
        );
}


.reli-about-new-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform .8s
        cubic-bezier(.2,.8,.2,1);
}


.reli-about-new-image-area:hover
.reli-about-new-image img {
    transform: scale(1.04);
}


/* =========================================================
   IMAGE CAPTION
========================================================= */

.reli-about-new-image-caption {
    position: absolute;

    z-index: 3;

    left: 28px;
    bottom: 28px;

    display: flex;

    align-items: flex-end;

    gap: 18px;
}


.reli-about-new-image-caption > span {
    color: #e53237;

    font-size: 48px;

    line-height: .8;

    font-weight: 700;
}


.reli-about-new-image-caption div {
    display: flex;

    flex-direction: column;

    gap: 4px;
}


.reli-about-new-image-caption strong {
    color: #ffffff;

    font-size: 13px;

    letter-spacing: 2px;
}


.reli-about-new-image-caption small {
    color:
        rgba(
            255,
            255,
            255,
            .65
        );

    font-size: 8px;

    letter-spacing: 2px;
}


/* =========================================================
   RED BAR
========================================================= */

.reli-about-new-red-bar {
    position: absolute;

    z-index: 4;

    right: 0;
    bottom: 40px;

    width: 7px;
    height: 150px;

    background: #e53237;
}


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

.reli-about-new-statement {
    display: grid;

    grid-template-columns:
        70px
        1fr
        1fr;

    gap: 45px;

    align-items: center;

    padding:
        45px 0;

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

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


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

.reli-about-new-statement-number {
    color: #e53237;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 2px;
}


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

.reli-about-new-statement-title span {
    display: block;

    margin-bottom: 12px;

    color:
        rgba(
            255,
            255,
            255,
            .45
        );

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 3px;
}


.reli-about-new-statement-title h3 {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            30px,
            3vw,
            46px
        );

    line-height: 1;

    font-weight: 400;

    letter-spacing: -1px;
}


.reli-about-new-statement-title h3 em {
    color: #e53237;

    font-style: italic;
}


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

.reli-about-new-statement-text {
    padding-left: 35px;

    border-left:
        1px solid
        rgba(255,255,255,.20);
}


.reli-about-new-statement-text p {
    max-width: 470px;

    margin: 0;

    color:
        rgba(
            255,
            255,
            255,
            .62
        );

    font-size: 14px;

    line-height: 1.8;
}


/* =========================================================
   STRENGTHS
========================================================= */

.reli-about-new-strengths {
    display: grid;

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

    margin-top: 55px;

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

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


/* =========================================================
   STRENGTH ITEM
========================================================= */

.reli-about-new-strength {
    position: relative;

    display: grid;

    grid-template-columns:
        35px
        1fr;

    gap: 15px;

    min-height: 185px;

    padding:
        30px 25px;

    border-right:
        1px solid
        rgba(255,255,255,.13);

    transition:
        background .35s ease;
}


.reli-about-new-strength:first-child {
    padding-left: 0;
}


.reli-about-new-strength:last-child {
    border-right: none;
}


.reli-about-new-strength:hover {
    background:
        rgba(
            255,
            255,
            255,
            .045
        );
}


/* =========================================================
   STRENGTH NUMBER
========================================================= */

.reli-about-new-strength-number {
    color: #e53237;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1px;
}


/* =========================================================
   STRENGTH HEADING
========================================================= */

.reli-about-new-strength h4 {
    margin: 0 0 12px;

    color: #ffffff;

    font-size: 21px;

    font-weight: 500;

    letter-spacing: -.3px;
}


/* =========================================================
   STRENGTH TEXT
========================================================= */

.reli-about-new-strength p {
    max-width: 210px;

    margin: 0;

    color:
        rgba(
            255,
            255,
            255,
            .52
        );

    font-size: 12px;

    line-height: 1.7;
}


/* =========================================================
   PLUS
========================================================= */

.reli-about-new-strength > b {
    position: absolute;

    right: 20px;
    bottom: 20px;

    color:
        rgba(
            255,
            255,
            255,
            .25
        );

    font-family: Arial, sans-serif;

    font-size: 20px;

    font-weight: 300;

    transition:
        color .3s ease,
        transform .3s ease;
}


.reli-about-new-strength:hover > b {
    color: #e53237;

    transform: rotate(90deg);
}


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

.reli-about-new-footer {
    display: grid;

    grid-template-columns:
        auto
        1fr
        auto;

    align-items: center;

    gap: 25px;

    padding-top: 30px;
}


.reli-about-new-footer > div:first-child {
    display: flex;

    align-items: center;

    gap: 18px;
}


.reli-about-new-footer strong {
    color: #ffffff;

    font-size: 11px;

    letter-spacing: 2px;
}


.reli-about-new-footer span {
    color:
        rgba(
            255,
            255,
            255,
            .38
        );

    font-size: 8px;

    letter-spacing: 2px;
}


.reli-about-new-footer-line {
    height: 1px;

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


.reli-about-new-footer p {
    margin: 0;

    color:
        rgba(
            255,
            255,
            255,
            .42
        );

    font-size: 10px;

    font-style: italic;
}


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

@media (max-width: 1100px) {

    .reli-about-new-container {
        width:
            min(
                92%,
                950px
            );
    }


    .reli-about-new-main {
        grid-template-columns:
            1fr
            1fr;

        gap: 45px;
    }


    .reli-about-new-image {
        height: 500px;
    }


    .reli-about-new-strengths {
        grid-template-columns:
            1fr 1fr;
    }


    .reli-about-new-strength:nth-child(2) {
        border-right: none;
    }


    .reli-about-new-strength:nth-child(-n+2) {
        border-bottom:
            1px solid
            rgba(255,255,255,.13);
    }


    .reli-about-new-strength:first-child {
        padding-left: 25px;
    }

}


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

@media (max-width: 800px) {

    .reli-about-new {
        padding:
            80px 0
            65px;
    }


    .reli-about-new-container {
        width: 90%;
    }


    .reli-about-new-main {
        grid-template-columns: 1fr;

        padding:
            60px 0
            65px;

        gap: 55px;
    }


    .reli-about-new-content {
        max-width: 700px;
    }


    .reli-about-new-image-area {
        max-width: 700px;
    }


    .reli-about-new-image {
        height: 470px;
    }


    .reli-about-new-statement {
        grid-template-columns:
            50px
            1fr;

        gap: 25px;
    }


    .reli-about-new-statement-text {
        grid-column:
            2 / -1;

        padding-left: 0;

        padding-top: 20px;

        border-left: none;

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

}


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

@media (max-width: 600px) {

    .reli-about-new {
        padding:
            65px 0
            50px;
    }


    .reli-about-new-container {
        width: 90%;
    }


    .reli-about-new-top-left p {
        font-size: 9px;

        letter-spacing: 2px;
    }


    .reli-about-new-top-left span {
        width: 28px;
    }


    .reli-about-new-top-right small {
        display: none;
    }


    .reli-about-new-main {
        padding:
            50px 0
            55px;
    }


    .reli-about-new-content h2 {
        font-size: 54px;

        letter-spacing: -2px;
    }


    .reli-about-new-intro {
        margin-top: 30px;

        font-size: 16px;
    }


    .reli-about-new-description {
        font-size: 13px;
    }


    .reli-about-new-image {
        height: 380px;
    }


    .reli-about-new-image-caption {
        left: 20px;
        bottom: 20px;
    }


    .reli-about-new-image-caption > span {
        font-size: 38px;
    }


    .reli-about-new-red-bar {
        width: 5px;

        height: 100px;

        bottom: 25px;
    }


    .reli-about-new-statement {
        display: block;

        padding:
            35px 0;
    }


    .reli-about-new-statement-number {
        margin-bottom: 25px;
    }


    .reli-about-new-statement-title h3 {
        font-size: 34px;
    }


    .reli-about-new-statement-text {
        margin-top: 25px;

        padding-top: 20px;
    }


    .reli-about-new-strengths {
        grid-template-columns: 1fr;

        margin-top: 40px;
    }


    .reli-about-new-strength,
    .reli-about-new-strength:nth-child(2) {
        min-height: 150px;

        border-right: none;

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


    .reli-about-new-strength:last-child {
        border-bottom: none;
    }


    .reli-about-new-strength:first-child {
        padding-left: 20px;
    }


    .reli-about-new-strength p {
        max-width: 270px;
    }


    .reli-about-new-footer {
        display: block;

        padding-top: 25px;
    }


    .reli-about-new-footer-line {
        display: none;
    }


    .reli-about-new-footer p {
        margin-top: 12px;
    }

}


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

@media (max-width: 400px) {

    .reli-about-new-content h2 {
        font-size: 46px;
    }


    .reli-about-new-image {
        height: 320px;
    }


    .reli-about-new-statement-title h3 {
        font-size: 30px;
    }


    .reli-about-new-strength h4 {
        font-size: 19px;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .reli-about-new *,
    .reli-about-new::before,
    .reli-about-new::after {

        transition: none !important;

        animation: none !important;
    }

}


/* =========================================================
   RELI SLEEVE
   ANODES APPLICATIONS
   PREMIUM INDUSTRIAL DESIGN

   COLORS:
   BLUE  #0b4375
   RED   #e53237

   FONT:
   Aptos Serif / Georgia / Serif
========================================================= */


/* =========================================================
   GLOBAL
========================================================= */

.reli-anodes-app,
.reli-anodes-app * {
    box-sizing: border-box;

    font-family:
        "Aptos Serif",
        Georgia,
        serif;
}


/* =========================================================
   MAIN SECTION
========================================================= */

.reli-anodes-app {
    position: relative;

    width: 100%;

    padding:
        115px 0
        95px;

    background: #f3f6f8;

    color: #0b4375;

    overflow: hidden;
}


/* =========================================================
   CONTAINER
========================================================= */

.reli-anodes-app-container {
    width:
        min(
            1420px,
            calc(100% - 80px)
        );

    margin: 0 auto;
}


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

.reli-anodes-app-header {
    display: grid;

    grid-template-columns:
        1.2fr
        .8fr;

    gap: 100px;

    align-items: end;

    padding-bottom: 65px;

    border-bottom:
        1px solid
        rgba(11,67,117,.18);
}


/* =========================================================
   KICKER
========================================================= */

.reli-anodes-app-kicker {
    display: flex;

    align-items: center;

    gap: 14px;

    color: #0b4375;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 3px;
}


.reli-anodes-app-kicker span {
    width: 42px;
    height: 2px;

    background: #e53237;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.reli-anodes-app-heading h2 {
    max-width: 780px;

    margin:
        22px 0 0;

    color: #0b4375;

    font-size:
        clamp(
            55px,
            7vw,
            102px
        );

    line-height: .88;

    font-weight: 400;

    letter-spacing: -5px;
}


.reli-anodes-app-heading h2 em {
    display: block;

    color: #e53237;

    font-style: italic;

    font-weight: 700;
}


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

.reli-anodes-app-intro {
    padding-left: 30px;

    border-left:
        2px solid
        rgba(229,50,55,.65);
}


.reli-anodes-app-intro > span {
    display: block;

    margin-bottom: 18px;

    color: #e53237;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 2.5px;
}


.reli-anodes-app-intro p {
    max-width: 420px;

    margin: 0;

    color: #607487;

    font-size: 15px;

    line-height: 1.85;
}


/* =========================================================
   APPLICATION LIST
========================================================= */

.reli-anodes-app-list {
    display: grid;

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

    gap: 20px;

    padding-top: 45px;
}


/* =========================================================
   CARD
========================================================= */

.reli-anodes-app-card {
    position: relative;

    background: #ffffff;

    border:
        1px solid
        #dce4ea;

    overflow: hidden;

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


.reli-anodes-app-card:hover {
    transform: translateY(-8px);

    border-color:
        rgba(11,67,117,.30);

    box-shadow:
        0 25px 60px
        rgba(11,67,117,.12);
}


/* =========================================================
   IMAGE
========================================================= */

.reli-anodes-app-image {
    position: relative;

    height: 300px;

    display: flex;

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

    overflow: hidden;

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


.reli-anodes-app-image img {
    position: relative;

    z-index: 2;

    width: 85%;
    height: 245px;

    object-fit: contain;

    filter:
        drop-shadow(
            0 18px 22px
            rgba(11,67,117,.16)
        );

    transition:
        transform .65s
        cubic-bezier(.2,.8,.2,1);
}


.reli-anodes-app-card:hover
.reli-anodes-app-image img {
    transform:
        scale(1.09)
        translateY(-5px);
}


/* =========================================================
   IMAGE TOP NUMBER
========================================================= */

.reli-anodes-app-number {
    position: absolute;

    z-index: 5;

    left: 18px;
    top: 18px;

    width: 38px;
    height: 38px;

    display: flex;

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

    background: #0b4375;

    color: #ffffff;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1px;
}


/* =========================================================
   IMAGE TAG
========================================================= */

.reli-anodes-app-image-tag {
    position: absolute;

    z-index: 5;

    right: 18px;
    top: 18px;

    padding:
        8px 11px;

    background: #ffffff;

    color: #0b4375;

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.8px;

    box-shadow:
        0 5px 18px
        rgba(0,0,0,.06);
}


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

.reli-anodes-app-content {
    padding:
        27px 27px 30px;
}


/* =========================================================
   CATEGORY
========================================================= */

.reli-anodes-app-content > span {
    display: block;

    margin-bottom: 13px;

    color: #e53237;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 2px;
}


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

.reli-anodes-app-content h3 {
    margin: 0;

    color: #0b4375;

    font-size: 28px;

    line-height: 1.05;

    font-weight: 400;

    letter-spacing: -1px;
}


.reli-anodes-app-content h3 strong {
    display: block;

    font-weight: 700;
}


/* =========================================================
   CARD TEXT
========================================================= */

.reli-anodes-app-content p {
    min-height: 92px;

    margin:
        17px 0 23px;

    color: #687a89;

    font-size: 13px;

    line-height: 1.75;
}


/* =========================================================
   CARD LINK
========================================================= */

.reli-anodes-app-content a {
    display: inline-flex;

    align-items: center;

    gap: 16px;

    padding-bottom: 9px;

    color: #0b4375;

    text-decoration: none;

    border-bottom:
        1px solid
        #cbd5dc;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.8px;

    transition:
        border-color .3s ease,
        color .3s ease;
}


.reli-anodes-app-content a b {
    display: flex;

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

    width: 27px;
    height: 27px;

    background: #e53237;

    color: #ffffff;

    font-family: Arial, sans-serif;

    font-size: 14px;

    font-weight: 400;

    transition:
        transform .3s ease,
        background .3s ease;
}


.reli-anodes-app-content a:hover {
    color: #e53237;

    border-color: #e53237;
}


.reli-anodes-app-content a:hover b {
    transform:
        translate(
            4px,
            -4px
        );

    background: #0b4375;
}


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

.reli-anodes-app-bottom {
    display: grid;

    grid-template-columns:
        1fr
        1fr;

    gap: 80px;

    align-items: end;

    margin-top: 70px;

    padding-top: 40px;

    border-top:
        1px solid
        rgba(11,67,117,.18);
}


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

.reli-anodes-app-bottom-title > span {
    display: block;

    margin-bottom: 13px;

    color: #e53237;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 3px;
}


.reli-anodes-app-bottom-title h3 {
    max-width: 600px;

    margin: 0;

    color: #0b4375;

    font-size:
        clamp(
            32px,
            4vw,
            55px
        );

    line-height: 1;

    font-weight: 400;

    letter-spacing: -2px;
}


.reli-anodes-app-bottom-title h3 em {
    color: #e53237;

    font-style: italic;

    font-weight: 700;
}


/* =========================================================
   BOTTOM TEXT
========================================================= */

.reli-anodes-app-bottom > p {
    max-width: 520px;

    margin: 0;

    color: #687a89;

    font-size: 14px;

    line-height: 1.85;
}


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

@media (max-width: 1100px) {

    .reli-anodes-app-container {
        width: 92%;
    }


    .reli-anodes-app-header {
        gap: 50px;
    }


    .reli-anodes-app-list {
        grid-template-columns:
            repeat(2, 1fr);
    }


    .reli-anodes-app-image {
        height: 330px;
    }

}


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

@media (max-width: 800px) {

    .reli-anodes-app {
        padding:
            85px 0
            70px;
    }


    .reli-anodes-app-header {
        grid-template-columns: 1fr;

        gap: 35px;

        padding-bottom: 50px;
    }


    .reli-anodes-app-heading h2 {
        font-size: 65px;

        letter-spacing: -3px;
    }


    .reli-anodes-app-intro {
        max-width: 600px;

        padding-left: 20px;
    }


    .reli-anodes-app-bottom {
        grid-template-columns: 1fr;

        gap: 30px;
    }

}


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

@media (max-width: 600px) {

    .reli-anodes-app {
        padding:
            65px 0
            55px;
    }


    .reli-anodes-app-container {
        width: 90%;
    }


    .reli-anodes-app-list {
        grid-template-columns: 1fr;

        gap: 18px;

        padding-top: 35px;
    }


    .reli-anodes-app-heading h2 {
        font-size: 53px;

        letter-spacing: -2px;
    }


    .reli-anodes-app-intro p {
        font-size: 14px;
    }


    .reli-anodes-app-image {
        height: 320px;
    }


    .reli-anodes-app-image img {
        width: 82%;
        height: 260px;
    }


    .reli-anodes-app-content {
        padding:
            25px 23px 28px;
    }


    .reli-anodes-app-content h3 {
        font-size: 27px;
    }


    .reli-anodes-app-content p {
        min-height: auto;

        font-size: 13px;
    }


    .reli-anodes-app-bottom {
        margin-top: 50px;

        padding-top: 30px;
    }


    .reli-anodes-app-bottom-title h3 {
        font-size: 34px;
    }

}


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

@media (max-width: 400px) {

    .reli-anodes-app-heading h2 {
        font-size: 45px;
    }


    .reli-anodes-app-image {
        height: 290px;
    }


    .reli-anodes-app-image img {
        height: 235px;
    }


    .reli-anodes-app-content h3 {
        font-size: 25px;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .reli-anodes-app *,
    .reli-anodes-app::before,
    .reli-anodes-app::after {

        transition: none !important;

        animation: none !important;
    }

}

 /* =========================================================
   RELI SLEEVE
   PREMIUM LIGHT INDUSTRIES / ANODE APPLICATIONS
   COLORS:
   BLUE  : #0b4375
   RED   : #e53237
   FONT  : Aptos Serif, Georgia, serif
========================================================= */


/* =========================================================
   FONT
========================================================= */

.reli-industries-section,
.reli-industries-section * {
    font-family: "Aptos Serif", Georgia, serif;
}


/* =========================================================
   MAIN SECTION
========================================================= */

.reli-industries-section {
    position: relative;

    padding: 95px 0 85px;

    background:
        linear-gradient(
            135deg,
            #f7f9fb 0%,
            #eef4f8 48%,
            #f9fbfc 100%
        );

    overflow: hidden;
}


/* =========================================================
   SUBTLE BACKGROUND GRID
========================================================= */

.reli-industries-grid-bg {
    position: absolute;

    inset: 0;

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

    background-size: 65px 65px;

    opacity: 0.7;

    pointer-events: none;
}


/* =========================================================
   TOP RED LIGHT
========================================================= */

.reli-industries-section::before {
    content: "";

    position: absolute;

    width: 620px;
    height: 620px;

    top: -350px;
    right: -250px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(229,50,55,0.10) 0%,
            rgba(229,50,55,0.035) 35%,
            transparent 70%
        );

    pointer-events: none;
}


/* =========================================================
   LOWER BLUE LIGHT
========================================================= */

.reli-industries-section::after {
    content: "";

    position: absolute;

    width: 600px;
    height: 600px;

    left: -350px;
    bottom: -360px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(11,67,117,0.09) 0%,
            rgba(11,67,117,0.025) 38%,
            transparent 70%
        );

    pointer-events: none;
}


/* =========================================================
   BACKGROUND WATERMARK
========================================================= */

.reli-industries-bg-text {
    position: absolute;

    right: -20px;
    bottom: 25px;

    font-size: clamp(100px, 15vw, 240px);

    font-weight: 700;

    line-height: 0.8;

    letter-spacing: -10px;

    color: rgba(11,67,117,0.045);

    white-space: nowrap;

    pointer-events: none;

    user-select: none;
}


/* =========================================================
   WRAPPER
========================================================= */

.reli-industries-wrapper {
    position: relative;

    z-index: 3;

    width: min(1350px, 90%);

    margin: auto;
}


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

.reli-industries-header {
    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap: 70px;

    margin-bottom: 45px;
}


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

.reli-industries-title {
    padding-left: 22px;

    border-left: 4px solid #e53237;
}


/* =========================================================
   KICKER
========================================================= */

.reli-industries-kicker {
    display: block;

    margin-bottom: 10px;

    color: #e53237;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 3px;
}


/* =========================================================
   HEADING
========================================================= */

.reli-industries-title h2 {
    margin: 0;

    color: #0b4375;

    font-size: clamp(43px, 5vw, 68px);

    font-weight: 400;

    line-height: 0.95;

    letter-spacing: -2.5px;
}


/* =========================================================
   HEADING HIGHLIGHT
========================================================= */

.reli-industries-title h2 strong {
    color: #e53237;

    font-weight: 700;
}


/* =========================================================
   INTRO AREA
========================================================= */

.reli-industries-intro {
    display: flex;

    align-items: flex-start;

    gap: 18px;

    max-width: 475px;
}


/* =========================================================
   INTRO RED LINE
========================================================= */

.reli-industries-line {
    flex: 0 0 42px;

    width: 42px;
    height: 2px;

    margin-top: 9px;

    background: #e53237;

    position: relative;

    overflow: hidden;
}


/* =========================================================
   MOVING LINE
========================================================= */

.reli-industries-line::after {
    content: "";

    position: absolute;

    left: -100%;
    top: 0;

    width: 100%;
    height: 100%;

    background: #0b4375;

    animation:
        reliIndustryLine 3s ease-in-out infinite;
}


@keyframes reliIndustryLine {

    0% {
        left: -100%;
    }

    45% {
        left: 100%;
    }

    100% {
        left: 100%;
    }

}


/* =========================================================
   INTRO TEXT
========================================================= */

.reli-industries-intro p {
    margin: 0;

    color: #53697b;

    font-size: 14px;

    line-height: 1.8;
}


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

.reli-industries-cards {
    display: grid;

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

    grid-auto-rows: 215px;

    gap: 14px;
}


/* =========================================================
   CARD
========================================================= */

.reli-industry-card {
    position: relative;

    display: block;

    overflow: hidden;

    text-decoration: none;

    background: #ffffff;

    isolation: isolate;

    border: 1px solid rgba(11,67,117,0.12);

    box-shadow:
        0 10px 30px rgba(11,67,117,0.08);

    transition:
        transform 0.6s cubic-bezier(.16,1,.3,1),
        box-shadow 0.6s ease,
        border-color 0.5s ease;
}


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


/* ROW 01 */

.reli-industry-card:nth-child(1) {
    grid-column: span 4;
}

.reli-industry-card:nth-child(2) {
    grid-column: span 4;
}

.reli-industry-card:nth-child(3) {
    grid-column: span 4;
}


/* ROW 02 */

.reli-industry-card:nth-child(4) {
    grid-column: span 3;
}

.reli-industry-card:nth-child(5) {
    grid-column: span 3;
}

.reli-industry-card:nth-child(6) {
    grid-column: span 6;
}


/* ROW 03 */

.reli-industry-card:nth-child(7) {
    grid-column: span 4;
}

.reli-industry-card:nth-child(8) {
    grid-column: span 4;
}

.reli-industry-card:nth-child(9) {
    grid-column: span 4;
}


/* =========================================================
   IMAGE
========================================================= */

.reli-industry-card img {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transform: scale(1.02);

    filter:
        saturate(0.86)
        brightness(0.92);

    transition:
        transform 1s cubic-bezier(.16,1,.3,1),
        filter 0.7s ease;
}


/* =========================================================
   IMAGE HOVER
========================================================= */

.reli-industry-card:hover img {
    transform: scale(1.10);

    filter:
        saturate(1.08)
        brightness(0.98)
        contrast(1.03);
}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.reli-industry-overlay {
    position: absolute;

    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,0.02) 5%,
            rgba(6,35,58,0.12) 35%,
            rgba(3,28,49,0.84) 100%
        );

    transition:
        background 0.6s ease;
}


/* =========================================================
   HOVER OVERLAY
========================================================= */

.reli-industry-card:hover .reli-industry-overlay {
    background:
        linear-gradient(
            180deg,
            rgba(11,67,117,0.05) 0%,
            rgba(7,47,78,0.28) 40%,
            rgba(3,26,46,0.92) 100%
        );
}


/* =========================================================
   NUMBER
========================================================= */

.reli-industry-number {
    position: absolute;

    top: 20px;
    left: 22px;

    z-index: 3;

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

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 2px;

    transition:
        color 0.4s ease,
        transform 0.4s ease;
}


/* =========================================================
   NUMBER RED LINE
========================================================= */

.reli-industry-number::after {
    content: "";

    display: inline-block;

    width: 20px;
    height: 1px;

    margin-left: 8px;

    vertical-align: middle;

    background: #e53237;

    transition:
        width 0.4s ease;
}


.reli-industry-card:hover .reli-industry-number {
    color: #ffffff;

    transform: translateX(3px);
}


.reli-industry-card:hover .reli-industry-number::after {
    width: 32px;
}


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

.reli-industry-content {
    position: absolute;

    z-index: 3;

    left: 24px;
    right: 20px;
    bottom: 23px;
}


/* =========================================================
   CATEGORY
========================================================= */

.reli-industry-content span {
    display: block;

    margin-bottom: 7px;

    color: #ff5257;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 2.6px;
}


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

.reli-industry-content h3 {
    margin: 0;

    max-width: 80%;

    color: #ffffff;

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

    font-weight: 400;

    line-height: 1.05;

    letter-spacing: -0.5px;

    transition:
        transform 0.5s cubic-bezier(.16,1,.3,1);
}


.reli-industry-card:hover .reli-industry-content h3 {
    transform: translateY(-3px);
}


/* =========================================================
   DESCRIPTION
========================================================= */

.reli-industry-content p {
    max-width: 430px;

    margin: 9px 0 0;

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

    font-size: 11px;

    line-height: 1.55;

    opacity: 0;

    transform: translateY(10px);

    transition:
        opacity 0.45s ease,
        transform 0.5s ease;
}


.reli-industry-card:hover .reli-industry-content p {
    opacity: 1;

    transform: translateY(0);
}


/* =========================================================
   ARROW
========================================================= */

.reli-industry-content i {
    position: absolute;

    right: 0;
    bottom: 0;

    width: 40px;
    height: 40px;

    display: flex;

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

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

    border-radius: 50%;

    color: #ffffff;

    font-size: 17px;

    font-style: normal;

    opacity: 0;

    transform:
        translateX(12px)
        rotate(-20deg);

    transition:
        opacity 0.4s ease,
        transform 0.5s ease,
        background 0.4s ease,
        border-color 0.4s ease;
}


/* =========================================================
   ARROW HOVER
========================================================= */

.reli-industry-card:hover .reli-industry-content i {
    opacity: 1;

    transform:
        translateX(0)
        rotate(0deg);
}


.reli-industry-content i:hover {
    background: #e53237;

    border-color: #e53237;
}


/* =========================================================
   CARD SHINE
========================================================= */

.reli-industry-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: -120%;

    width: 60%;
    height: 100%;

    z-index: 5;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,0.28),
            transparent
        );

    transform: skewX(-18deg);

    transition:
        left 0.9s ease;

    pointer-events: none;
}


.reli-industry-card:hover::before {
    left: 140%;
}


/* =========================================================
   RED BOTTOM ACCENT
========================================================= */

.reli-industry-card::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 100%;
    height: 3px;

    z-index: 6;

    background: #e53237;

    transform: scaleX(0);

    transform-origin: left;

    transition:
        transform 0.5s ease;
}


.reli-industry-card:hover::after {
    transform: scaleX(1);
}


/* =========================================================
   CARD HOVER
========================================================= */

.reli-industry-card:hover {
    transform: translateY(-7px);

    border-color: rgba(229,50,55,0.45);

    box-shadow:
        0 25px 50px rgba(11,67,117,0.16);
}


/* =========================================================
   ENTRANCE ANIMATION
========================================================= */

@keyframes reliIndustryReveal {

    from {
        opacity: 0;

        transform:
            translateY(28px);
    }

    to {
        opacity: 1;

        transform:
            translateY(0);
    }

}


.reli-industry-card {
    animation:
        reliIndustryReveal 0.8s ease both;
}


.reli-industry-card:nth-child(1) {
    animation-delay: .05s;
}

.reli-industry-card:nth-child(2) {
    animation-delay: .10s;
}

.reli-industry-card:nth-child(3) {
    animation-delay: .15s;
}

.reli-industry-card:nth-child(4) {
    animation-delay: .20s;
}

.reli-industry-card:nth-child(5) {
    animation-delay: .25s;
}

.reli-industry-card:nth-child(6) {
    animation-delay: .30s;
}

.reli-industry-card:nth-child(7) {
    animation-delay: .35s;
}

.reli-industry-card:nth-child(8) {
    animation-delay: .40s;
}

.reli-industry-card:nth-child(9) {
    animation-delay: .45s;
}


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

@media (max-width: 1000px) {

    .reli-industries-section {
        padding: 80px 0;
    }


    .reli-industries-header {
        gap: 40px;
    }


    .reli-industries-cards {
        grid-template-columns:
            repeat(6, 1fr);

        grid-auto-rows: 200px;
    }


    .reli-industry-card:nth-child(n) {
        grid-column: span 2;
    }


    .reli-industry-card:nth-child(7),
    .reli-industry-card:nth-child(8),
    .reli-industry-card:nth-child(9) {
        grid-column: span 2;
    }

}


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

@media (max-width: 650px) {

    .reli-industries-section {
        padding: 65px 0;
    }


    .reli-industries-wrapper {
        width: 92%;
    }


    .reli-industries-header {
        flex-direction: column;

        align-items: flex-start;

        gap: 22px;

        margin-bottom: 32px;
    }


    .reli-industries-title {
        padding-left: 16px;

        border-left-width: 3px;
    }


    .reli-industries-title h2 {
        font-size: 43px;

        letter-spacing: -1px;
    }


    .reli-industries-intro {
        max-width: 100%;
    }


    .reli-industries-intro p {
        font-size: 13px;

        line-height: 1.7;
    }


    .reli-industries-cards {
        grid-template-columns: 1fr 1fr;

        grid-auto-rows: 205px;

        gap: 10px;
    }


    .reli-industry-card:nth-child(n) {
        grid-column: span 1;
    }


    .reli-industry-card:nth-child(3),
    .reli-industry-card:nth-child(6),
    .reli-industry-card:nth-child(9) {
        grid-column: span 2;
    }


    .reli-industry-content {
        left: 17px;

        right: 15px;

        bottom: 17px;
    }


    .reli-industry-content h3 {
        font-size: 20px;
    }


    .reli-industry-content span {
        font-size: 8px;

        letter-spacing: 1.8px;
    }


    .reli-industry-content p {
        display: none;
    }


    .reli-industry-content i {
        width: 32px;
        height: 32px;

        font-size: 14px;
    }


    .reli-industry-number {
        top: 15px;

        left: 17px;
    }

}


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

@media (max-width: 420px) {

    .reli-industries-section {
        padding: 55px 0;
    }


    .reli-industries-title h2 {
        font-size: 38px;
    }


    .reli-industries-cards {
        grid-auto-rows: 180px;

        gap: 8px;
    }


    .reli-industry-content {
        left: 14px;

        bottom: 14px;
    }


    .reli-industry-content h3 {
        font-size: 18px;
    }


    .reli-industry-content i {
        width: 29px;
        height: 29px;

        font-size: 12px;
    }


    .reli-industries-bg-text {
        font-size: 85px;

        letter-spacing: -5px;
    }

}


/* =========================================================
   REDUCE MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .reli-industries-line::after {
        animation: none;
    }


    .reli-industry-card {
        animation: none;
    }


    .reli-industry-card,
    .reli-industry-card img,
    .reli-industry-overlay,
    .reli-industry-content h3,
    .reli-industry-content p,
    .reli-industry-content i,
    .reli-industry-card::before,
    .reli-industry-card::after {
        transition: none;
    }

}
/* =========================================================
   RELI SLEEVE
   PREMIUM ANODE PRODUCTS SLIDER
   COLORS:
   #0b4375 - Deep Blue
   #e53237 - Red
   FONT:
   Aptos Serif, Georgia, serif
========================================================= */


/* =========================================================
   ROOT
========================================================= */

:root {
    --reli-blue: #0b4375;
    --reli-blue-dark: #062b4d;
    --reli-blue-deep: #041d34;
    --reli-red: #e53237;
    --reli-white: #ffffff;
    --reli-light: #dce7ef;
    --reli-muted: #91a7b9;
    --reli-border: rgba(255,255,255,0.10);
}


/* =========================================================
   SECTION
========================================================= */

.reli-products-section {
    position: relative;
    overflow: hidden;
    padding: 110px 0 90px;
    background:
        linear-gradient(
            135deg,
            #061f36 0%,
            #082c4c 48%,
            #071f35 100%
        );
    color: var(--reli-white);
    font-family: "Aptos Serif", Georgia, serif;
}


/* =========================================================
   SUBTLE GRID BACKGROUND
========================================================= */

.reli-products-section::before {
    content: "";
    position: absolute;
    inset: 0;

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

    background-size: 55px 55px;
    pointer-events: none;
    opacity: 0.45;
}


/* =========================================================
   BLUE LIGHT
========================================================= */

.reli-products-section::after {
    content: "";
    position: absolute;

    width: 550px;
    height: 550px;

    top: -220px;
    right: -180px;

    background: radial-gradient(
        circle,
        rgba(11,67,117,0.55),
        transparent 68%
    );

    pointer-events: none;
}


/* =========================================================
   WATERMARK
========================================================= */

.reli-products-bg-text {
    position: absolute;
    top: 30px;
    right: -20px;

    font-family: "Aptos Serif", Georgia, serif;
    font-size: clamp(90px, 15vw, 230px);
    font-weight: 700;

    line-height: 1;
    letter-spacing: -8px;

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

    pointer-events: none;
    user-select: none;

    white-space: nowrap;
}


/* =========================================================
   WRAPPER
========================================================= */

.reli-products-wrapper {
    position: relative;
    z-index: 2;

    width: min(1380px, 92%);
    margin: 0 auto;
}


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

.reli-products-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 50px;
    margin-bottom: 55px;
}


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

.reli-products-title {
    max-width: 720px;
}


.reli-products-title .reli-products-kicker {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    margin-bottom: 17px;

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

    letter-spacing: 3px;
    text-transform: uppercase;

    color: #e53237;
}


.reli-products-title .reli-products-kicker::before {
    content: "";
    width: 35px;
    height: 2px;

    background: var(--reli-red);
}


.reli-products-title h2 {
    margin: 0;

    font-size: clamp(42px, 5vw, 72px);
    line-height: 0.98;

    font-weight: 500;
    letter-spacing: -2.5px;

    color: var(--reli-white);
}


.reli-products-title h2 strong {
    display: block;

    color: var(--reli-red);
    font-weight: 600;
}


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

.reli-products-intro {
    width: min(420px, 100%);

    display: flex;
    gap: 18px;

    padding-bottom: 5px;
}


.reli-products-intro .reli-products-line {
    flex: 0 0 2px;

    height: 72px;

    background: linear-gradient(
        to bottom,
        var(--reli-red),
        rgba(229,50,55,0.15)
    );
}


.reli-products-intro p {
    margin: 0;

    color: #a9bac8;

    font-size: 15px;
    line-height: 1.8;

    font-weight: 400;
}


/* =========================================================
   CONTROLS
========================================================= */

.reli-products-controls {
    display: flex;
    align-items: center;
    gap: 10px;
}


.reli-products-controls button {
    position: relative;

    width: 54px;
    height: 54px;

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

    color: #ffffff;

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

    font-family: Arial, sans-serif;
    font-size: 22px;

    cursor: pointer;

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


.reli-products-controls button:hover {
    background: var(--reli-red);
    border-color: var(--reli-red);

    color: #ffffff;

    transform: translateY(-3px);
}


/* =========================================================
   SLIDER
========================================================= */

.reli-products-slider {
    position: relative;

    width: 100%;

    overflow: hidden;
}


.reli-products-track {
    display: flex;

    gap: 25px;

    transition:
        transform 0.75s cubic-bezier(.77,0,.18,1);

    will-change: transform;
}


/* =========================================================
   PRODUCT CARD
========================================================= */

.reli-product-card {
    position: relative;

    flex: 0 0 calc((100% - 50px) / 3);

    min-width: 0;

    height: 525px;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #103c60,
            #071d31
        );

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

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


.reli-product-card:hover {
    transform: translateY(-10px);

    border-color: rgba(229,50,55,0.55);

    box-shadow:
        0 25px 55px rgba(0,0,0,0.35),
        0 0 35px rgba(11,67,117,0.22);
}


/* =========================================================
   TOP RED LINE
========================================================= */

.reli-product-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 0;
    height: 3px;

    background: var(--reli-red);

    z-index: 10;

    transition: width 0.5s ease;
}


.reli-product-card:hover::before {
    width: 100%;
}


/* =========================================================
   NUMBER
========================================================= */

.reli-product-number {
    position: absolute;

    top: 22px;
    left: 24px;

    z-index: 5;

    font-family: Arial, sans-serif;

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

    letter-spacing: 2px;

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


.reli-product-number::after {
    content: "";

    display: inline-block;

    width: 28px;
    height: 1px;

    margin-left: 10px;

    vertical-align: middle;

    background: var(--reli-red);
}


/* =========================================================
   IMAGE AREA
========================================================= */

.reli-product-image {
    position: absolute;

    inset: 0;

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

    padding: 55px 35px 170px;

    overflow: hidden;
}


/* =========================================================
   IMAGE
========================================================= */

.reli-product-image img {
    position: relative;

    z-index: 3;

    width: 100%;
    height: 100%;

    object-fit: contain;

    filter:
        drop-shadow(0 25px 22px rgba(0,0,0,0.45));

    transition:
        transform 0.75s cubic-bezier(.2,.7,.2,1),
        filter 0.5s ease;
}


.reli-product-card:hover .reli-product-image img {
    transform: scale(1.08) translateY(-7px);

    filter:
        drop-shadow(0 30px 28px rgba(0,0,0,0.55));
}


/* =========================================================
   IMAGE GLOW
========================================================= */

.reli-product-glow {
    position: absolute;

    width: 310px;
    height: 310px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(11,67,117,0.65) 0%,
            rgba(11,67,117,0.25) 40%,
            transparent 72%
        );

    filter: blur(8px);

    transition:
        transform 0.6s ease,
        opacity 0.6s ease;
}


.reli-product-card:hover .reli-product-glow {
    transform: scale(1.15);

    opacity: 0.9;
}


/* =========================================================
   RED LIGHT ACCENT
========================================================= */

.reli-product-image::after {
    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    right: -80px;
    top: -70px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(229,50,55,0.18),
            transparent 70%
        );

    transition: transform 0.6s ease;
}


.reli-product-card:hover .reli-product-image::after {
    transform: scale(1.4);
}


/* =========================================================
   BOTTOM INFO PANEL
========================================================= */

.reli-product-info {
    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    z-index: 6;

    padding: 27px 28px 26px;

    background:
        linear-gradient(
            to top,
            rgba(4,20,34,0.98) 0%,
            rgba(4,20,34,0.94) 75%,
            rgba(4,20,34,0.05) 100%
        );

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

    transform: translateY(0);

    transition:
        background 0.4s ease;
}


.reli-product-card:hover .reli-product-info {
    background:
        linear-gradient(
            to top,
            rgba(4,20,34,1) 0%,
            rgba(4,20,34,0.96) 80%,
            rgba(4,20,34,0.10) 100%
        );
}


/* =========================================================
   CATEGORY
========================================================= */

.reli-product-info > span {
    display: block;

    margin-bottom: 8px;

    font-family: Arial, sans-serif;

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

    letter-spacing: 2.5px;

    text-transform: uppercase;

    color: var(--reli-red);
}


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

.reli-product-info h3 {
    margin: 0;

    max-width: 80%;

    font-size: 25px;
    line-height: 1.15;

    font-weight: 500;

    color: #ffffff;

    transition:
        color 0.35s ease;
}


.reli-product-card:hover .reli-product-info h3 {
    color: #ffffff;
}


/* =========================================================
   PRODUCT ARROW
========================================================= */

.reli-product-arrow {
    position: absolute;

    right: 27px;
    bottom: 27px;

    width: 43px;
    height: 43px;

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

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

    color: #ffffff;

    font-size: 19px;

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


.reli-product-card:hover .reli-product-arrow {
    background: var(--reli-red);
    border-color: var(--reli-red);

    transform: rotate(45deg);
}


/* =========================================================
   BOTTOM BAR
========================================================= */

.reli-products-bottom {
    display: flex;

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

    margin-top: 34px;

    padding-top: 20px;

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


.reli-products-count {
    display: flex;
    align-items: baseline;
    gap: 12px;
}


.reli-products-count strong {
    font-family: Arial, sans-serif;

    font-size: 18px;

    color: var(--reli-red);
}


.reli-products-count span {
    font-family: Arial, sans-serif;

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

    letter-spacing: 2px;

    color: #7f94a5;
}


/* =========================================================
   BOTTOM DECORATIVE LINE
========================================================= */

.reli-products-bottom::after {
    content: "";

    width: 90px;
    height: 2px;

    background:
        linear-gradient(
            90deg,
            var(--reli-red),
            transparent
        );
}


/* =========================================================
   CARD REVEAL
========================================================= */

@keyframes reliProductReveal {

    from {
        opacity: 0;
        transform: translateY(35px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


.reli-product-card {
    animation: reliProductReveal 0.8s ease both;
}


.reli-product-card:nth-child(1) {
    animation-delay: 0.05s;
}

.reli-product-card:nth-child(2) {
    animation-delay: 0.12s;
}

.reli-product-card:nth-child(3) {
    animation-delay: 0.19s;
}

.reli-product-card:nth-child(4) {
    animation-delay: 0.26s;
}

.reli-product-card:nth-child(5) {
    animation-delay: 0.33s;
}

.reli-product-card:nth-child(6) {
    animation-delay: 0.40s;
}


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

@media (max-width: 1100px) {

    .reli-products-section {
        padding: 90px 0 75px;
    }

    .reli-products-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 30px;
    }

    .reli-products-intro {
        max-width: 600px;
    }

    .reli-products-controls {
        align-self: flex-end;
    }

    .reli-product-card {
        flex: 0 0 calc((100% - 25px) / 2);
        height: 500px;
    }

}


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

@media (max-width: 700px) {

    .reli-products-section {
        padding: 75px 0 60px;
    }


    .reli-products-wrapper {
        width: 90%;
    }


    .reli-products-bg-text {
        top: 45px;
        right: -40px;

        font-size: 90px;
        letter-spacing: -5px;
    }


    .reli-products-title h2 {
        font-size: 43px;
        letter-spacing: -1.5px;
    }


    .reli-products-title .reli-products-kicker {
        font-size: 10px;
        letter-spacing: 2px;
    }


    .reli-products-header {
        margin-bottom: 35px;
        gap: 25px;
    }


    .reli-products-intro {
        width: 100%;
    }


    .reli-products-intro p {
        font-size: 14px;
        line-height: 1.7;
    }


    .reli-products-intro .reli-products-line {
        height: 65px;
    }


    .reli-products-controls {
        align-self: flex-start;
    }


    .reli-products-controls button {
        width: 48px;
        height: 48px;
    }


    .reli-product-card {
        flex: 0 0 100%;
        height: 480px;
    }


    .reli-product-image {
        padding:
            50px
            25px
            160px;
    }


    .reli-product-info {
        padding:
            24px
            22px
            23px;
    }


    .reli-product-info h3 {
        font-size: 22px;
    }


    .reli-product-arrow {
        right: 22px;
        bottom: 22px;

        width: 39px;
        height: 39px;
    }


    .reli-products-bottom {
        margin-top: 25px;
    }

}


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

@media (max-width: 420px) {

    .reli-products-title h2 {
        font-size: 37px;
    }


    .reli-product-card {
        height: 450px;
    }


    .reli-product-image {
        padding:
            45px
            20px
            155px;
    }


    .reli-product-number {
        left: 18px;
        top: 18px;
    }


    .reli-product-info {
        padding:
            21px
            18px
            21px;
    }


    .reli-product-info h3 {
        font-size: 20px;
    }


    .reli-product-arrow {
        right: 18px;
        bottom: 19px;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .reli-product-card,
    .reli-product-image img,
    .reli-product-glow,
    .reli-product-arrow,
    .reli-product-card::before,
    .reli-products-track {
        animation: none !important;
        transition: none !important;
    }

}

/* =========================================================
   RELI SLEEVE
   PREMIUM WE PROVIDE SECTION
   3 COLUMN × 2 ROW
   COLORS:
   #0b4375 - Deep Blue
   #e53237 - Red
   FONT:
   Aptos Serif, Georgia, serif
========================================================= */

.reli-provide-new {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #ffffff;
    color: #0b4375;
    padding: 115px 0 90px;
    font-family: "Aptos Serif", Georgia, serif;
}


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

.reli-provide-new-grid {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .38;

    background-image:
        linear-gradient(
            rgba(11, 67, 117, .045) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(11, 67, 117, .045) 1px,
            transparent 1px
        );

    background-size: 65px 65px;
}


/* =========================================================
   WATERMARK
========================================================= */

.reli-provide-new-watermark {
    position: absolute;
    top: 40px;
    right: -30px;

    font-size: clamp(100px, 16vw, 250px);
    line-height: .8;

    font-weight: 700;
    letter-spacing: -10px;

    color: rgba(11, 67, 117, .035);

    pointer-events: none;
    user-select: none;
}


/* =========================================================
   CONTAINER
========================================================= */

.reli-provide-new-container {
    position: relative;
    width: min(1380px, calc(100% - 60px));
    margin: 0 auto;
}


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

.reli-provide-new-header {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 70px;

    align-items: end;

    margin-bottom: 65px;
}


/* LABEL */

.reli-provide-new-label {
    display: flex;
    align-items: center;
    gap: 14px;

    color: #e53237;

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

    letter-spacing: 2.5px;
    text-transform: uppercase;
}

.reli-provide-new-label span {
    width: 42px;
    height: 2px;
    background: #e53237;
    display: block;
}


/* HEADING */

.reli-provide-new-heading-wrap {
    max-width: 850px;
}

.reli-provide-new-heading-wrap h2 {
    margin: 0 0 20px;

    font-size: clamp(52px, 6vw, 88px);
    line-height: .95;

    font-weight: 600;
    letter-spacing: -3px;

    color: #0b4375;
}

.reli-provide-new-heading-wrap h2 strong {
    color: #e53237;
    font-weight: 600;
}

.reli-provide-new-heading-wrap p {
    max-width: 760px;

    margin: 0;

    font-family: "Aptos Serif", Georgia, serif;

    font-size: 18px;
    line-height: 1.8;

    color: #5c6872;
}


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

.reli-provide-new-grid-layout {
    display: grid;

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

    border-top: 1px solid rgba(11, 67, 117, .18);
    border-left: 1px solid rgba(11, 67, 117, .18);
}


/* =========================================================
   CARD
========================================================= */

.reli-provide-new-card {
    position: relative;

    min-height: 365px;

    padding: 35px 35px 32px;

    background: rgba(255, 255, 255, .94);

    border-right: 1px solid rgba(11, 67, 117, .18);
    border-bottom: 1px solid rgba(11, 67, 117, .18);

    overflow: hidden;

    transition:
        background .35s ease,
        transform .35s ease,
        box-shadow .35s ease;
}


/* TOP */

.reli-provide-new-card-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;

    margin-bottom: 55px;
}


/* NUMBER */

.reli-provide-new-number {
    font-family: "Aptos Serif", Georgia, serif;

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

    color: #e53237;

    letter-spacing: 1px;
}


/* ICON */

.reli-provide-new-icon {
    width: 62px;
    height: 62px;

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

    border: 1px solid rgba(11, 67, 117, .22);

    color: #0b4375;

    font-size: 23px;

    background: #ffffff;

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


/* CONTENT */

.reli-provide-new-content {
    position: relative;
    z-index: 2;
}


/* SMALL LABEL */

.reli-provide-new-small {
    display: block;

    margin-bottom: 10px;

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

    letter-spacing: 2px;

    color: #e53237;
}


/* TITLE */

.reli-provide-new-content h3 {
    margin: 0 0 17px;

    font-size: clamp(27px, 2.3vw, 34px);
    line-height: 1.1;

    font-weight: 600;

    color: #0b4375;
}


/* PARAGRAPH */

.reli-provide-new-content p {
    max-width: 370px;

    margin: 0;

    font-family: "Aptos Serif", Georgia, serif;

    font-size: 16px;
    line-height: 1.75;

    color: #68737d;
}


/* =========================================================
   BOTTOM LINE
========================================================= */

.reli-provide-new-line {
    position: absolute;

    left: 35px;
    right: 35px;
    bottom: 0;

    height: 3px;

    background: #e53237;

    transform: scaleX(0);
    transform-origin: left;

    transition: transform .4s ease;
}


/* =========================================================
   ARROW
========================================================= */

.reli-provide-new-arrow {
    position: absolute;

    right: 30px;
    bottom: 27px;

    width: 40px;
    height: 40px;

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

    color: #0b4375;

    font-size: 13px;

    border: 1px solid rgba(11, 67, 117, .16);

    background: #ffffff;

    transition:
        background .35s ease,
        color .35s ease,
        transform .35s ease;
}


/* =========================================================
   HOVER
========================================================= */

.reli-provide-new-card:hover {
    background: #f5f9fc;

    transform: translateY(-7px);

    box-shadow:
        0 18px 45px rgba(11, 67, 117, .10);
}

.reli-provide-new-card:hover .reli-provide-new-icon {
    background: #0b4375;
    color: #ffffff;
    border-color: #0b4375;

    transform: rotate(-5deg);
}

.reli-provide-new-card:hover .reli-provide-new-line {
    transform: scaleX(1);
}

.reli-provide-new-card:hover .reli-provide-new-arrow {
    background: #e53237;
    color: #ffffff;
    border-color: #e53237;

    transform: translate(3px, -3px);
}


/* =========================================================
   FOOTER STRIP
========================================================= */

.reli-provide-new-footer {
    min-height: 92px;

    display: grid;

    grid-template-columns: 1fr 2fr 100px;

    align-items: center;

    border: 1px solid rgba(11, 67, 117, .18);
    border-top: none;

    padding: 0 35px;

    background: #0b4375;

    color: #ffffff;
}


/* BRAND */

.reli-provide-new-footer-brand {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 1px;
}

.reli-provide-new-footer-brand span {
    color: #e53237;
}


/* TEXT */

.reli-provide-new-footer-text {
    text-align: center;

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

    letter-spacing: 2px;

    color: rgba(255, 255, 255, .78);
}

.reli-provide-new-footer-text b {
    margin: 0 12px;
    color: #e53237;
}


/* RS */

.reli-provide-new-footer-mark {
    justify-self: end;

    width: 55px;
    height: 55px;

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

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

    color: #ffffff;

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

    letter-spacing: 2px;
}


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

@media (max-width: 1050px) {

    .reli-provide-new {
        padding: 90px 0 70px;
    }

    .reli-provide-new-container {
        width: min(94%, 900px);
    }

    .reli-provide-new-header {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .reli-provide-new-grid-layout {
        grid-template-columns: repeat(2, 1fr);
    }

    .reli-provide-new-card {
        min-height: 350px;
    }

    .reli-provide-new-footer {
        grid-template-columns: 1fr;
        gap: 15px;

        text-align: center;

        padding: 25px;
    }

    .reli-provide-new-footer-brand,
    .reli-provide-new-footer-mark {
        justify-self: center;
    }

}


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

@media (max-width: 650px) {

    .reli-provide-new {
        padding: 70px 0 55px;
    }

    .reli-provide-new-container {
        width: calc(100% - 30px);
    }

    .reli-provide-new-header {
        margin-bottom: 45px;
    }

    .reli-provide-new-heading-wrap h2 {
        font-size: 48px;
        letter-spacing: -2px;
    }

    .reli-provide-new-heading-wrap p {
        font-size: 16px;
        line-height: 1.7;
    }

    .reli-provide-new-grid-layout {
        grid-template-columns: 1fr;
    }

    .reli-provide-new-card {
        min-height: auto;
        padding: 30px 25px 35px;
    }

    .reli-provide-new-card-top {
        margin-bottom: 38px;
    }

    .reli-provide-new-content h3 {
        font-size: 29px;
    }

    .reli-provide-new-content p {
        max-width: none;
        font-size: 15px;
        line-height: 1.7;
    }

    .reli-provide-new-line {
        left: 25px;
        right: 25px;
    }

    .reli-provide-new-footer {
        padding: 25px 18px;
    }

    .reli-provide-new-footer-text {
        line-height: 2;
    }

    .reli-provide-new-footer-text b {
        display: none;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .reli-provide-new-card,
    .reli-provide-new-icon,
    .reli-provide-new-arrow,
    .reli-provide-new-line {
        transition: none;
    }

}

/* =========================================================
   RELI SLEEVE
   PREMIUM ABOUT US PAGE
   COLOR: #0b4375 + #e53237
   FONT: Aptos Serif, Georgia, serif
   LIGHT / PREMIUM INDUSTRIAL DESIGN
========================================================= */


/* =========================================================
   ROOT
========================================================= */

.rs-about-main {
    --rs-blue: #0b4375;
    --rs-blue-dark: #12314a;
    --rs-blue-deep: #092f52;
    --rs-red: #e53237;

    --rs-light: #f5f8fa;
    --rs-light-2: #eaf1f6;
    --rs-white: #ffffff;

    --rs-text: #183042;
    --rs-muted: #687783;
    --rs-border: rgba(11, 67, 117, 0.14);

    position: relative;
    width: 100%;
    overflow: hidden;

    font-family: "Aptos Serif", Georgia, serif;
    color: var(--rs-text);
    background: var(--rs-white);
}

.rs-about-main *,
.rs-about-main *::before,
.rs-about-main *::after {
    box-sizing: border-box;
}

.rs-about-main img {
    display: block;
    max-width: 100%;
}

.rs-about-main a {
    text-decoration: none;
    color: inherit;
}


/* =========================================================
   COMMON SECTION KICKER
========================================================= */

.rs-about-section-kicker {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 12px;

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
    color: var(--rs-red);

    text-transform: uppercase;
}

.rs-about-section-kicker::before {
    content: "";
    width: 28px;
    height: 2px;
    background: var(--rs-red);
}


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

.rs-about-hero {
    position: relative;
    min-height: 680px;

    display: flex;
    align-items: center;

    overflow: hidden;

    background:
        linear-gradient(
            90deg,
            rgba(7, 43, 73, 0.94) 0%,
            rgba(11, 67, 117, 0.84) 43%,
            rgba(11, 67, 117, 0.48) 70%,
            rgba(18, 49, 74, 0.18) 100%
        ),
        url("assets/images/about-us.jpg") center center / cover no-repeat;

    isolation: isolate;
}


/* subtle technical grid */

.rs-about-hero::before {
    content: "";
    position: absolute;
    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: 70px 70px;

    opacity: 0.45;
    pointer-events: none;
}


/* right side light */

.rs-about-hero::after {
    content: "";
    position: absolute;

    width: 600px;
    height: 600px;

    right: -220px;
    top: 50%;
    transform: translateY(-50%);

    background: radial-gradient(
        circle,
        rgba(229, 50, 55, 0.18),
        transparent 68%
    );

    pointer-events: none;
}


.rs-about-hero-bg {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            120deg,
            transparent 45%,
            rgba(255,255,255,0.06) 45.2%,
            transparent 45.5%
        );

    pointer-events: none;
}


.rs-about-hero-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(3, 31, 53, 0.42),
            transparent 65%
        );

    pointer-events: none;
}


/* architectural lines */

.rs-about-hero-line {
    position: absolute;
    display: block;

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

    pointer-events: none;
}

.rs-about-hero-line-one {
    width: 1px;
    height: 72%;
    right: 19%;
    top: 14%;
}

.rs-about-hero-line-two {
    width: 34%;
    height: 1px;
    right: 5%;
    bottom: 17%;
}


/* hero inner */

.rs-about-hero-inner {
    position: relative;
    z-index: 3;

    width: min(1280px, 90%);
    margin: auto;

    display: grid;
    grid-template-columns: 90px minmax(0, 780px);
    gap: 55px;

    padding: 100px 0;
}


/* hero index */

.rs-about-hero-index {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    padding-top: 10px;

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

.rs-about-hero-index span {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 2px;

    color: var(--rs-red);
}

.rs-about-hero-index small {
    margin-top: 12px;

    writing-mode: vertical-rl;

    font-size: 9px;
    letter-spacing: 3px;
    font-weight: 700;

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


/* hero content */

.rs-about-hero-content {
    max-width: 820px;
}

.rs-about-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 14px;

    margin-bottom: 24px;

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;

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

.rs-about-eyebrow i {
    width: 34px;
    height: 1px;

    background: var(--rs-red);
}


.rs-about-hero-content h1 {
    margin: 0;

    font-size: clamp(48px, 6vw, 82px);
    line-height: 0.98;
    font-weight: 400;
    letter-spacing: -2.5px;

    color: var(--rs-white);
}

.rs-about-hero-content h1 strong {
    display: block;

    color: #dceaf4;
    font-weight: 400;
}


.rs-about-hero-content > p {
    max-width: 720px;

    margin: 34px 0 0;

    font-size: 17px;
    line-height: 1.85;

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


/* hero stats */

.rs-about-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0;

    margin-top: 55px;
}

.rs-about-hero-meta > div {
    min-width: 160px;

    padding: 0 35px;

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

.rs-about-hero-meta > div:first-child {
    padding-left: 0;
    border-left: 0;
}

.rs-about-hero-meta strong {
    display: block;

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

    color: var(--rs-white);
}

.rs-about-hero-meta span {
    display: block;

    margin-top: 7px;

    font-size: 9px;
    letter-spacing: 2px;
    font-weight: 700;

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


/* =========================================================
   COMPANY STORY
========================================================= */

.rs-about-company {
    position: relative;

    padding: 125px 0;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f5f8fa 100%
        );
}


.rs-about-company-wrap {
    width: min(1280px, 90%);
    margin: auto;

    display: grid;
    grid-template-columns: 70px minmax(340px, 0.9fr) minmax(450px, 1.1fr);

    gap: 55px;

    align-items: start;
}


/* number */

.rs-about-company-number {
    padding-top: 8px;

    border-top: 1px solid var(--rs-border);
}

.rs-about-company-number span {
    display: block;

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

    color: var(--rs-red);
}

.rs-about-company-number small {
    display: block;

    margin-top: 12px;

    font-size: 8px;
    letter-spacing: 2px;
    font-weight: 700;

    color: var(--rs-muted);
}


/* image */

.rs-about-company-image {
    position: relative;

    min-height: 590px;

    overflow: hidden;

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

.rs-about-company-image::after {
    content: "";

    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            transparent 35%,
            rgba(5, 31, 51, 0.75) 100%
        );
}


.rs-about-company-image img {
    width: 100%;
    height: 590px;

    object-fit: cover;

    filter: saturate(0.85);
    transition: transform 0.8s ease;
}

.rs-about-company-image:hover img {
    transform: scale(1.04);
}


.rs-about-image-frame {
    position: absolute;

    z-index: 3;

    inset: 18px;

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

    pointer-events: none;
}


.rs-about-image-label {
    position: absolute;

    z-index: 4;

    left: 35px;
    bottom: 32px;

    color: var(--rs-white);
}

.rs-about-image-label span {
    display: block;

    margin-bottom: 5px;

    font-size: 9px;
    letter-spacing: 3px;

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

.rs-about-image-label strong {
    font-size: 20px;
    letter-spacing: 1px;
    font-weight: 400;
}


/* company content */

.rs-about-company-content {
    padding-top: 8px;
}

.rs-about-company-content h2 {
    max-width: 600px;

    margin: 22px 0 30px;

    font-size: clamp(38px, 4vw, 58px);
    line-height: 1.08;
    font-weight: 400;
    letter-spacing: -1.5px;

    color: var(--rs-blue);
}

.rs-about-company-content h2 strong {
    font-weight: 400;
    color: var(--rs-red);
}


.rs-about-company-content p {
    margin: 0 0 22px;

    font-size: 15px;
    line-height: 1.9;

    color: var(--rs-muted);
}

.rs-about-company-content .rs-about-company-lead {
    font-size: 16px;
    color: #50616d;
}


/* button */

.rs-about-primary-btn {
    display: inline-flex;
    align-items: center;
    gap: 30px;

    margin-top: 18px;
    padding: 16px 20px 16px 22px;

    color: var(--rs-white);
    background: var(--rs-blue);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;

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

.rs-about-primary-btn i {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 30px;
    height: 30px;

    font-size: 16px;
    font-style: normal;

    background: var(--rs-red);
}

.rs-about-primary-btn:hover {
    background: var(--rs-red);
    transform: translateY(-3px);
}


/* =========================================================
   EVOLUTION
========================================================= */

.rs-about-evolution {
    position: relative;

    padding: 120px 0;

    background:
        linear-gradient(
            135deg,
            #edf4f8,
            #f8fafb
        );

    overflow: hidden;
}


.rs-about-evolution-bg {
    position: absolute;

    right: -70px;
    top: 40px;

    font-size: clamp(130px, 18vw, 280px);
    line-height: 1;

    font-weight: 700;

    color: rgba(11,67,117,0.035);

    pointer-events: none;
}


.rs-about-evolution-wrap {
    position: relative;
    z-index: 2;

    width: min(1200px, 90%);
    margin: auto;
}


.rs-about-evolution-head {
    max-width: 850px;

    margin-bottom: 65px;
}

.rs-about-evolution-head h2 {
    margin: 20px 0;

    font-size: clamp(40px, 5vw, 66px);
    line-height: 1.05;
    font-weight: 400;

    color: var(--rs-blue);
}

.rs-about-evolution-head h2 strong {
    font-weight: 400;
    color: var(--rs-red);
}

.rs-about-evolution-head p {
    max-width: 760px;

    margin: 0;

    font-size: 16px;
    line-height: 1.85;

    color: var(--rs-muted);
}


/* cards */

.rs-about-evolution-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    border-top: 1px solid var(--rs-border);
    border-bottom: 1px solid var(--rs-border);
}


.rs-about-evolution-card {
    position: relative;

    min-height: 350px;

    padding: 35px;

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

    border-right: 1px solid var(--rs-border);

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

.rs-about-evolution-card:last-child {
    border-right: 0;
}

.rs-about-evolution-card:hover {
    background: var(--rs-white);
    transform: translateY(-6px);
}


.rs-about-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.rs-about-card-top span {
    font-size: 12px;
    font-weight: 700;

    color: var(--rs-red);
}

.rs-about-card-top i {
    width: 30px;
    height: 1px;

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


.rs-about-evolution-card h3 {
    margin: 70px 0 20px;

    font-size: 19px;
    line-height: 1.3;
    font-weight: 500;
    letter-spacing: 1px;

    color: var(--rs-blue);
}

.rs-about-evolution-card p {
    margin: 0;

    font-size: 14px;
    line-height: 1.8;

    color: var(--rs-muted);
}


/* active card */

.rs-about-evolution-card-active {
    background: var(--rs-blue);
}

.rs-about-evolution-card-active h3 {
    color: var(--rs-white);
}

.rs-about-evolution-card-active p {
    color: rgba(255,255,255,0.72);
}

.rs-about-evolution-card-active .rs-about-card-top i {
    background: var(--rs-red);
}

.rs-about-new-tag {
    position: absolute;

    left: 35px;
    bottom: 28px;

    padding: 7px 10px;

    font-size: 8px;
    font-weight: 700;
    letter-spacing: 2px;

    color: var(--rs-white);
    background: var(--rs-red);
}


/* =========================================================
   INDUSTRIAL FOUNDATION
========================================================= */

.rs-about-foundation {
    position: relative;

    padding: 125px 0;

    background: var(--rs-white);
}


.rs-about-foundation-wrap {
    width: min(1200px, 90%);
    margin: auto;

    display: grid;
    grid-template-columns: 0.85fr 1.15fr;

    gap: 110px;
}


.rs-about-foundation-intro {
    position: sticky;
    top: 80px;

    height: fit-content;
}


.rs-about-foundation-intro h2 {
    margin: 20px 0;

    font-size: clamp(42px, 5vw, 65px);
    line-height: 1.05;
    font-weight: 400;

    color: var(--rs-blue);
}

.rs-about-foundation-intro h2 strong {
    display: block;

    color: var(--rs-red);
    font-weight: 400;
}

.rs-about-foundation-intro p {
    max-width: 440px;

    margin: 0;

    font-size: 15px;
    line-height: 1.85;

    color: var(--rs-muted);
}


/* list */

.rs-about-foundation-list {
    border-top: 1px solid var(--rs-border);
}


.rs-about-foundation-row {
    display: grid;
    grid-template-columns: 55px 1fr 30px;
    gap: 25px;

    align-items: start;

    padding: 28px 0;

    border-bottom: 1px solid var(--rs-border);

    transition:
        padding-left 0.3s ease,
        background 0.3s ease;
}

.rs-about-foundation-row:hover {
    padding-left: 12px;
}


.rs-about-foundation-row > span {
    font-size: 11px;
    font-weight: 700;

    color: var(--rs-red);
}


.rs-about-foundation-row h3 {
    margin: 0 0 8px;

    font-size: 17px;
    letter-spacing: 1px;
    font-weight: 500;

    color: var(--rs-blue);
}

.rs-about-foundation-row p {
    max-width: 620px;

    margin: 0;

    font-size: 14px;
    line-height: 1.7;

    color: var(--rs-muted);
}


.rs-about-foundation-row > strong {
    font-size: 21px;
    font-weight: 300;

    color: var(--rs-red);
}


/* =========================================================
   SOLUTIONS
========================================================= */

.rs-about-solutions {
    position: relative;

    padding: 120px 0;

    background:
        linear-gradient(
            135deg,
            #f4f8fa,
            #eaf1f6
        );
}


.rs-about-solutions-wrap {
    width: min(1200px, 90%);
    margin: auto;
}


.rs-about-solutions-header {
    display: grid;
    grid-template-columns: 1fr 0.65fr;
    gap: 80px;

    align-items: end;

    margin-bottom: 65px;
}

.rs-about-solutions-header h2 {
    max-width: 700px;

    margin: 20px 0 0;

    font-size: clamp(40px, 5vw, 64px);
    line-height: 1.05;
    font-weight: 400;

    color: var(--rs-blue);
}

.rs-about-solutions-header h2 strong {
    color: var(--rs-red);
    font-weight: 400;
}

.rs-about-solutions-header > p {
    margin: 0;

    font-size: 15px;
    line-height: 1.85;

    color: var(--rs-muted);
}


/* solution grid */

.rs-about-solutions-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 1px;

    background: var(--rs-border);

    border: 1px solid var(--rs-border);
}


.rs-about-solution-card {
    position: relative;

    min-height: 260px;

    padding: 32px;

    background: var(--rs-white);

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

.rs-about-solution-card:hover {
    background: var(--rs-blue);
    transform: translateY(-4px);
}

.rs-about-solution-card > span {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;

    color: var(--rs-red);
}

.rs-about-solution-card h3 {
    margin: 42px 0 13px;

    font-size: 17px;
    line-height: 1.3;
    font-weight: 500;
    letter-spacing: 1px;

    color: var(--rs-blue);
}

.rs-about-solution-card p {
    margin: 0;

    font-size: 13px;
    line-height: 1.75;

    color: var(--rs-muted);
}

.rs-about-solution-card a {
    position: absolute;

    left: 32px;
    bottom: 27px;

    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1.8px;

    color: var(--rs-red);
}


/* hover */

.rs-about-solution-card:hover h3,
.rs-about-solution-card:hover p,
.rs-about-solution-card:hover a {
    color: var(--rs-white);
}

.rs-about-solution-card:hover > span {
    color: #ff767a;
}


/* =========================================================
   APPROACH
========================================================= */

.rs-about-approach {
    position: relative;

    padding: 125px 0;

    background: var(--rs-white);
}


.rs-about-approach-wrap {
    width: min(1250px, 90%);
    margin: auto;

    display: grid;
    grid-template-columns: 75px 1fr 0.65fr;

    gap: 55px;
}


.rs-about-approach-number {
    border-top: 1px solid var(--rs-border);

    padding-top: 10px;
}

.rs-about-approach-number span {
    font-size: 14px;
    font-weight: 700;

    color: var(--rs-red);
}

.rs-about-approach-number small {
    display: block;

    margin-top: 12px;

    font-size: 8px;
    letter-spacing: 2px;

    color: var(--rs-muted);
}


.rs-about-approach-content h2 {
    margin: 20px 0 25px;

    font-size: clamp(42px, 5vw, 65px);
    line-height: 1.05;
    font-weight: 400;

    color: var(--rs-blue);
}

.rs-about-approach-content h2 strong {
    color: var(--rs-red);
    font-weight: 400;
}

.rs-about-approach-content p {
    max-width: 680px;

    margin: 0 0 20px;

    font-size: 15px;
    line-height: 1.9;

    color: var(--rs-muted);
}


/* points */

.rs-about-approach-points {
    align-self: end;

    border-top: 1px solid var(--rs-border);
}


.rs-about-approach-points > div {
    display: grid;
    grid-template-columns: 35px 1fr;

    gap: 10px;

    padding: 20px 0;

    border-bottom: 1px solid var(--rs-border);
}

.rs-about-approach-points span {
    font-size: 9px;
    font-weight: 700;

    color: var(--rs-red);
}

.rs-about-approach-points strong {
    font-size: 12px;
    letter-spacing: 1.5px;

    color: var(--rs-blue);
}

.rs-about-approach-points p {
    grid-column: 2;

    margin: -3px 0 0;

    font-size: 12px;
    line-height: 1.5;

    color: var(--rs-muted);
}


/* =========================================================
   GLOBAL
========================================================= */

.rs-about-global {
    position: relative;

    min-height: 620px;

    display: flex;
    align-items: center;

    overflow: hidden;

    background: var(--rs-blue-dark);
}


.rs-about-global-bg {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(8, 45, 76, 0.97) 0%,
            rgba(11, 67, 117, 0.84) 52%,
            rgba(11, 67, 117, 0.52) 100%
        ),
        url("assets/images/about-us.jpg") center / cover no-repeat;

    opacity: 0.92;
}


.rs-about-global-overlay {
    position: absolute;
    inset: 0;

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

    background-size: 70px 70px;
}


.rs-about-global-wrap {
    position: relative;
    z-index: 3;

    width: min(1200px, 90%);
    margin: auto;

    display: grid;
    grid-template-columns: 1fr 280px;

    gap: 100px;

    align-items: center;
}


.rs-about-global-content {
    max-width: 760px;
}

.rs-about-global-content .rs-about-section-kicker {
    color: #ff6a6e;
}

.rs-about-global-content h2 {
    margin: 20px 0 28px;

    font-size: clamp(42px, 5vw, 68px);
    line-height: 1.04;
    font-weight: 400;

    color: var(--rs-white);
}

.rs-about-global-content h2 strong {
    color: #dceaf4;
    font-weight: 400;
}

.rs-about-global-content p {
    max-width: 720px;

    margin: 0 0 18px;

    font-size: 15px;
    line-height: 1.85;

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


/* global button */

.rs-about-global-btn {
    display: inline-flex;
    align-items: center;
    gap: 30px;

    margin-top: 20px;
    padding: 15px 18px 15px 22px;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;

    color: var(--rs-white);
    background: var(--rs-red);

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

.rs-about-global-btn i {
    font-size: 18px;
    font-style: normal;
}

.rs-about-global-btn:hover {
    background: var(--rs-white);
    color: var(--rs-blue);

    transform: translateY(-3px);
}


/* global side */

.rs-about-global-side {
    position: relative;

    padding: 40px 0 40px 45px;

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

.rs-about-global-side span {
    display: block;

    font-size: 9px;
    letter-spacing: 3px;
    font-weight: 700;

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

.rs-about-global-side strong {
    display: block;

    margin: 25px 0 8px;

    font-size: 76px;
    line-height: 0.9;
    font-weight: 400;

    color: var(--rs-white);
}

.rs-about-global-side p {
    margin: 0;

    font-size: 10px;
    line-height: 1.7;
    letter-spacing: 2px;
    font-weight: 700;

    color: var(--rs-red);
}

.rs-about-global-side small {
    display: block;

    margin-top: 45px;

    font-size: 8px;
    letter-spacing: 2px;

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


/* =========================================================
   SIMPLE REVEAL ANIMATION
========================================================= */

.rs-about-main .rs-about-hero-content,
.rs-about-main .rs-about-company-content,
.rs-about-main .rs-about-evolution-head,
.rs-about-main .rs-about-foundation-intro,
.rs-about-main .rs-about-solutions-header,
.rs-about-main .rs-about-approach-content,
.rs-about-main .rs-about-global-content {
    animation: rsAboutFadeUp 0.9s ease both;
}


.rs-about-main .rs-about-hero-meta {
    animation: rsAboutFadeUp 1s ease 0.15s both;
}


@keyframes rsAboutFadeUp {
    from {
        opacity: 0;
        transform: translateY(25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


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

@media (max-width: 1100px) {

    .rs-about-hero-inner {
        grid-template-columns: 60px 1fr;
        gap: 35px;
    }

    .rs-about-company-wrap {
        grid-template-columns: 50px 0.9fr 1.1fr;
        gap: 35px;
    }

    .rs-about-foundation-wrap {
        gap: 60px;
    }

    .rs-about-approach-wrap {
        grid-template-columns: 55px 1fr;
        gap: 35px;
    }

    .rs-about-approach-points {
        grid-column: 2;
        margin-top: 30px;
    }

    .rs-about-global-wrap {
        gap: 60px;
    }
}


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

@media (max-width: 850px) {

    .rs-about-hero {
        min-height: 620px;
    }

    .rs-about-hero-inner {
        width: 88%;
        grid-template-columns: 1fr;
    }

    .rs-about-hero-index {
        display: none;
    }

    .rs-about-company-wrap {
        grid-template-columns: 1fr;
    }

    .rs-about-company-number {
        display: none;
    }

    .rs-about-company-image {
        min-height: 480px;
    }

    .rs-about-company-image img {
        height: 480px;
    }

    .rs-about-company-content {
        padding-top: 25px;
    }

    .rs-about-evolution-grid {
        grid-template-columns: 1fr;
    }

    .rs-about-evolution-card {
        min-height: auto;
        border-right: 0;
        border-bottom: 1px solid var(--rs-border);
    }

    .rs-about-evolution-card:last-child {
        border-bottom: 0;
    }

    .rs-about-evolution-card h3 {
        margin-top: 45px;
    }

    .rs-about-foundation-wrap {
        grid-template-columns: 1fr;
    }

    .rs-about-foundation-intro {
        position: relative;
        top: auto;
    }

    .rs-about-solutions-header {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .rs-about-solutions-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .rs-about-global-wrap {
        grid-template-columns: 1fr;
    }

    .rs-about-global-side {
        padding: 25px 0 0;
        border-left: 0;
        border-top: 1px solid rgba(255,255,255,0.22);
    }

    .rs-about-global-side strong {
        font-size: 60px;
    }
}


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

@media (max-width: 600px) {

    .rs-about-hero {
        min-height: 650px;

        background:
            linear-gradient(
                90deg,
                rgba(7,43,73,0.94),
                rgba(11,67,117,0.72)
            ),
            url("assets/images/about-us.jpg") center / cover no-repeat;
    }

    .rs-about-hero-inner {
        padding: 80px 0;
    }

    .rs-about-hero-content h1 {
        font-size: clamp(42px, 12vw, 58px);
        letter-spacing: -1.5px;
    }

    .rs-about-hero-content > p {
        font-size: 14px;
        line-height: 1.75;
    }

    .rs-about-hero-meta {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;

        margin-top: 40px;
    }

    .rs-about-hero-meta > div {
        min-width: 0;
        padding: 0 0 0 18px;
        border-left: 1px solid rgba(255,255,255,0.2);
    }

    .rs-about-hero-meta > div:first-child {
        padding-left: 0;
        border-left: 0;
    }

    .rs-about-company,
    .rs-about-evolution,
    .rs-about-foundation,
    .rs-about-solutions,
    .rs-about-approach {
        padding: 80px 0;
    }

    .rs-about-company-image {
        min-height: 380px;
    }

    .rs-about-company-image img {
        height: 380px;
    }

    .rs-about-company-content h2,
    .rs-about-evolution-head h2,
    .rs-about-foundation-intro h2,
    .rs-about-solutions-header h2,
    .rs-about-approach-content h2,
    .rs-about-global-content h2 {
        font-size: 40px;
    }

    .rs-about-company-content p,
    .rs-about-evolution-head p,
    .rs-about-foundation-intro p,
    .rs-about-solutions-header > p,
    .rs-about-approach-content p,
    .rs-about-global-content p {
        font-size: 14px;
        line-height: 1.8;
    }

    .rs-about-evolution-card {
        padding: 28px;
    }

    .rs-about-solutions-grid {
        grid-template-columns: 1fr;
    }

    .rs-about-solution-card {
        min-height: 235px;
    }

    .rs-about-approach-wrap {
        grid-template-columns: 1fr;
    }

    .rs-about-approach-number {
        display: none;
    }

    .rs-about-approach-points {
        grid-column: auto;
    }

    .rs-about-global {
        min-height: auto;
        padding: 85px 0;
    }

    .rs-about-global-side {
        margin-top: 25px;
    }

    .rs-about-global-side strong {
        font-size: 58px;
    }

    .rs-about-global-side small {
        margin-top: 30px;
    }
}


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

@media (max-width: 420px) {

    .rs-about-hero-inner,
    .rs-about-company-wrap,
    .rs-about-evolution-wrap,
    .rs-about-foundation-wrap,
    .rs-about-solutions-wrap,
    .rs-about-approach-wrap,
    .rs-about-global-wrap {
        width: 90%;
    }

    .rs-about-hero-content h1 {
        font-size: 39px;
    }

    .rs-about-hero-meta {
        grid-template-columns: 1fr;
    }

    .rs-about-hero-meta > div {
        padding-left: 15px !important;
        border-left: 1px solid rgba(255,255,255,0.2) !important;
    }

    .rs-about-company-image,
    .rs-about-company-image img {
        height: 330px;
        min-height: 330px;
    }

    .rs-about-company-content h2,
    .rs-about-evolution-head h2,
    .rs-about-foundation-intro h2,
    .rs-about-solutions-header h2,
    .rs-about-approach-content h2,
    .rs-about-global-content h2 {
        font-size: 34px;
    }

    .rs-about-foundation-row {
        grid-template-columns: 35px 1fr;
        gap: 15px;
    }

    .rs-about-foundation-row > strong {
        display: none;
    }

    .rs-about-primary-btn,
    .rs-about-global-btn {
        width: 100%;
        justify-content: space-between;
    }

    .rs-about-global-side strong {
        font-size: 50px;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .rs-about-main *,
    .rs-about-main *::before,
    .rs-about-main *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}


/* =========================================================
   RELI SLEEVE - PRODUCT PAGE
   JACKET ANODES
   PREMIUM LIGHT INDUSTRIAL DESIGN
   FONT: Aptos Serif, Georgia, serif
========================================================= */

:root {
    --reli-blue: #0b4375;
    --reli-blue-dark: #07345c;
    --reli-blue-light: #eaf3f9;

    --reli-red: #e53237;
    --reli-red-light: #fff0f1;

    --reli-white: #ffffff;
    --reli-light: #f7f9fb;
    --reli-border: #dfe6eb;

    --reli-text: #253746;
    --reli-muted: #687782;

    --reli-shadow: 0 18px 45px rgba(11, 67, 117, 0.09);

    --reli-radius: 3px;
}


/* =========================================================
   RESET
========================================================= */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "Aptos Serif", Georgia, serif;
    color: var(--reli-text);
    background: #ffffff;
    line-height: 1.75;
}

img {
    max-width: 100%;
    display: block;
}

a {
    text-decoration: none;
    color: inherit;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}


/* =========================================================
   CONTAINER
========================================================= */

.rs-product-container {
    width: min(1380px, calc(100% - 50px));
    margin: 0 auto;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.rs-product-breadcrumb {
    padding: 18px 0;
    background: #f7f9fb;
    border-bottom: 1px solid var(--reli-border);
}

.rs-product-breadcrumb .rs-product-container {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
}

.rs-product-breadcrumb a {
    font-size: 12px;
    color: var(--reli-blue);
    transition: 0.3s ease;
}

.rs-product-breadcrumb a:hover {
    color: var(--reli-red);
}

.rs-product-breadcrumb span {
    color: #a3adb4;
    font-size: 12px;
}

.rs-product-breadcrumb strong {
    color: var(--reli-text);
    font-size: 12px;
    font-weight: 600;
}


/* =========================================================
   MAIN PAGE
========================================================= */

.rs-product-page {
    padding: 65px 0 100px;
    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f9fbfc 100%
        );
}


/* =========================================================
   9 : 3 LAYOUT
========================================================= */

.rs-product-layout {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(280px, 1fr);
    gap: 48px;
    align-items: start;
}

.rs-product-main {
    min-width: 0;
}


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

.rs-product-header {
    margin-bottom: 38px;
}

.rs-product-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    color: var(--reli-red);

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;

    margin-bottom: 14px;
}

.rs-product-kicker::before {
    content: "";
    width: 30px;
    height: 2px;
    background: var(--reli-red);
}

.rs-product-header h1 {
    max-width: 1000px;

    color: var(--reli-blue);

    font-size: clamp(38px, 5vw, 67px);
    line-height: 1.04;
    font-weight: 600;
    letter-spacing: -1.8px;

    margin-bottom: 23px;
}

.rs-product-header h1 span {
    display: block;
    color: var(--reli-text);
    font-size: 0.62em;
    line-height: 1.2;
    margin-top: 8px;
    letter-spacing: -0.5px;
}

.rs-product-lead {
    max-width: 930px;

    color: #536570;

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


/* =========================================================
   PRODUCT IMAGE
   REDUCED IMAGE SIZE
========================================================= */

.rs-product-image-box {
    position: relative;

    min-height: 410px;

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

    overflow: hidden;

    background:
        radial-gradient(
            circle at 50% 45%,
            rgba(11, 67, 117, 0.08),
            transparent 48%
        ),
        linear-gradient(
            135deg,
            #f4f8fb,
            #ffffff
        );

    border: 1px solid var(--reli-border);

    margin-bottom: 58px;
}

.rs-product-image-box::before {
    content: "";

    position: absolute;

    width: 46%;
    height: 1px;

    background: var(--reli-red);

    left: 0;
    top: 28px;

    opacity: 0.7;
}

.rs-product-image-box::after {
    content: "";

    position: absolute;

    width: 1px;
    height: 45%;

    background: var(--reli-blue);

    right: 28px;
    bottom: 0;

    opacity: 0.12;
}

.rs-product-image-box img {
    width: min(58%, 540px);
    height: auto;

    max-height: 370px;

    object-fit: contain;

    position: relative;
    z-index: 2;

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

.rs-product-image-box:hover img {
    transform: scale(1.035);
}

.rs-product-image-label {
    position: absolute;

    left: 28px;
    bottom: 25px;

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

    z-index: 3;
}

.rs-product-image-label span {
    width: 36px;
    height: 36px;

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

    background: var(--reli-red);
    color: #ffffff;

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

.rs-product-image-label strong {
    color: var(--reli-blue);

    font-size: 12px;
    letter-spacing: 1.6px;
}


/* =========================================================
   GENERAL PRODUCT SECTION
========================================================= */

.rs-product-section {
    position: relative;

    padding: 0 0 52px;
    margin-bottom: 50px;

    border-bottom: 1px solid var(--reli-border);
}

.rs-product-section:last-of-type {
    border-bottom: 0;
}

.rs-product-section-number {
    display: block;

    color: var(--reli-red);

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;

    margin-bottom: 9px;
}

.rs-product-section h2 {
    color: var(--reli-blue);

    font-size: clamp(27px, 3vw, 38px);
    line-height: 1.15;
    font-weight: 600;

    margin-bottom: 20px;
}

.rs-product-section h3 {
    color: var(--reli-blue);

    font-size: 20px;
    line-height: 1.3;

    margin: 28px 0 13px;
}

.rs-product-section p {
    max-width: 1000px;

    color: #536570;

    font-size: 15px;
    line-height: 1.85;

    margin-bottom: 17px;
}


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

.rs-product-intro strong {
    color: var(--reli-blue);
}


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

.rs-feature-grid {
    display: grid;

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

    gap: 14px;

    margin-top: 27px;
}

.rs-feature-card {
    min-height: 145px;

    padding: 22px 18px;

    background: #ffffff;

    border: 1px solid var(--reli-border);

    position: relative;

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

.rs-feature-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 28px;
    height: 2px;

    background: var(--reli-red);
}

.rs-feature-card:hover {
    transform: translateY(-4px);

    border-color: rgba(11, 67, 117, 0.25);

    box-shadow: var(--reli-shadow);
}

.rs-feature-card span {
    display: block;

    color: var(--reli-red);

    font-size: 10px;
    letter-spacing: 1.4px;
    font-weight: 700;

    margin-bottom: 9px;
}

.rs-feature-card h3 {
    color: var(--reli-blue);

    font-size: 16px;

    margin: 0 0 7px;
}

.rs-feature-card p {
    color: var(--reli-muted);

    font-size: 12px;
    line-height: 1.65;

    margin: 0;
}


/* =========================================================
   TECHNICAL DATA TABLE
========================================================= */

.rs-spec-table-wrap,
.rs-composition-table-wrap {
    width: 100%;

    overflow-x: auto;

    margin-top: 25px;

    border: 1px solid var(--reli-border);
    background: #ffffff;
}

.rs-spec-table,
.rs-composition-table {
    width: 100%;

    border-collapse: collapse;

    min-width: 650px;
}

.rs-spec-table th,
.rs-spec-table td,
.rs-composition-table th,
.rs-composition-table td {
    padding: 13px 16px;

    text-align: left;

    border-bottom: 1px solid var(--reli-border);

    font-size: 13px;

    vertical-align: middle;
}

.rs-spec-table th,
.rs-composition-table th {
    background: #edf4f8;

    color: var(--reli-blue);

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

    letter-spacing: 0.5px;

    text-transform: uppercase;
}

.rs-spec-table td:first-child,
.rs-composition-table td:first-child {
    color: var(--reli-blue);

    font-weight: 600;
}

.rs-spec-table tbody tr:last-child td,
.rs-composition-table tbody tr:last-child td {
    border-bottom: 0;
}

.rs-spec-table tbody tr:hover td,
.rs-composition-table tbody tr:hover td {
    background: #fafcfd;
}


/* =========================================================
   GRADE / STANDARD BADGES
========================================================= */

.rs-grade-grid {
    display: grid;

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

    gap: 14px;

    margin-top: 25px;
}

.rs-grade-card {
    padding: 20px;

    background: #ffffff;

    border: 1px solid var(--reli-border);

    position: relative;
}

.rs-grade-card::after {
    content: "";

    position: absolute;

    right: 0;
    bottom: 0;

    width: 28px;
    height: 2px;

    background: var(--reli-red);
}

.rs-grade-card span {
    display: block;

    color: var(--reli-red);

    font-size: 10px;
    letter-spacing: 1.5px;
    font-weight: 700;

    margin-bottom: 7px;
}

.rs-grade-card strong {
    display: block;

    color: var(--reli-blue);

    font-size: 15px;
    line-height: 1.45;
}

.rs-grade-card p {
    font-size: 11px;
    line-height: 1.55;

    margin: 7px 0 0;
}


/* =========================================================
   TECHNICAL NOTE
========================================================= */

.rs-note-box {
    position: relative;

    margin-top: 24px;

    padding: 20px 22px 20px 25px;

    background: #f4f8fb;

    border-left: 3px solid var(--reli-red);
}

.rs-note-box strong {
    display: block;

    color: var(--reli-blue);

    font-size: 13px;

    margin-bottom: 5px;
}

.rs-note-box p {
    color: #5d6e78;

    font-size: 12px;
    line-height: 1.7;

    margin: 0;
}


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

.rs-application-grid {
    display: grid;

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

    gap: 12px;

    margin-top: 23px;
}

.rs-application-grid > div {
    padding: 18px 20px;

    background: #ffffff;

    border: 1px solid var(--reli-border);

    position: relative;
}

.rs-application-grid > div::before {
    content: "";

    position: absolute;

    width: 4px;
    height: 28px;

    left: 0;
    top: 19px;

    background: var(--reli-red);
}

.rs-application-grid strong {
    display: block;

    color: var(--reli-blue);

    font-size: 14px;

    margin-bottom: 5px;
}

.rs-application-grid span {
    color: var(--reli-muted);

    font-size: 12px;
    line-height: 1.55;
}


/* =========================================================
   CHECK LIST
========================================================= */

.rs-check-list {
    display: grid;

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

    gap: 11px 25px;

    margin-top: 22px;
}

.rs-check-list div {
    position: relative;

    padding-left: 25px;

    color: #536570;

    font-size: 13px;
}

.rs-check-list div::before {
    content: "✓";

    position: absolute;

    left: 0;
    top: 1px;

    color: var(--reli-red);

    font-weight: 700;
}


/* =========================================================
   COMPANY REVIEW
========================================================= */

.rs-product-review {
    display: grid;

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

    gap: 25px;

    padding: 30px;

    background:
        linear-gradient(
            135deg,
            #f2f7fa,
            #ffffff
        );

    border: 1px solid var(--reli-border);
}

.rs-review-mark {
    width: 70px;
    height: 70px;

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

    background: var(--reli-blue);

    color: #ffffff;

    font-size: 24px;
    font-weight: 600;
}

.rs-product-review h3 {
    margin: 0 0 9px;

    color: var(--reli-blue);

    font-size: 22px;
}

.rs-product-review p {
    margin: 0;

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


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

.rs-product-faq {
    margin-top: 22px;

    border-top: 1px solid var(--reli-border);
}

.rs-faq-item {
    border-bottom: 1px solid var(--reli-border);
}

.rs-faq-question {
    width: 100%;

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

    gap: 20px;

    padding: 18px 0;

    background: transparent;

    border: 0;

    color: var(--reli-blue);

    font-family: inherit;

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

    text-align: left;

    cursor: pointer;
}

.rs-faq-question span {
    width: 28px;
    height: 28px;

    flex: 0 0 28px;

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

    border: 1px solid var(--reli-border);

    color: var(--reli-red);

    font-size: 18px;

    transition: 0.3s ease;
}

.rs-faq-answer {
    max-height: 0;

    overflow: hidden;

    transition:
        max-height 0.4s ease,
        padding 0.4s ease;
}

.rs-faq-answer p {
    padding-bottom: 0;

    font-size: 13px;

    opacity: 0;

    transition: opacity 0.3s ease;
}

.rs-faq-item.active .rs-faq-answer {
    max-height: 300px;
}

.rs-faq-item.active .rs-faq-answer p {
    opacity: 1;

    padding-bottom: 18px;
}

.rs-faq-item.active .rs-faq-question span {
    transform: rotate(45deg);

    background: var(--reli-red);

    color: #ffffff;

    border-color: var(--reli-red);
}


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

.rs-product-cta {
    padding: 32px;

    background: #edf4f8;

    border: 1px solid var(--reli-border);

    display: flex;

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

    gap: 30px;
}

.rs-product-cta h3 {
    margin: 0 0 6px;

    color: var(--reli-blue);

    font-size: 25px;
}

.rs-product-cta p {
    margin: 0;

    color: var(--reli-muted);

    font-size: 13px;
}

.rs-product-cta a {
    flex-shrink: 0;

    display: inline-flex;
    align-items: center;
    gap: 13px;

    padding: 13px 20px;

    background: var(--reli-red);

    color: #ffffff;

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

    letter-spacing: 0.5px;

    transition: 0.3s ease;
}

.rs-product-cta a:hover {
    background: var(--reli-blue);

    transform: translateY(-2px);
}


/* =========================================================
   SIDEBAR
   NO PRODUCT IMAGES
========================================================= */

.rs-product-sidebar {
    position: sticky;
    top: 30px;
}

.rs-sidebar-card {
    background: #ffffff;

    border: 1px solid var(--reli-border);
}


/* =========================================================
   SIDEBAR ENQUIRY
========================================================= */

.rs-sidebar-enquiry {
    padding: 26px;

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

    border-top: 3px solid var(--reli-red);
}

.rs-sidebar-enquiry > span {
    color: var(--reli-red);

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

    letter-spacing: 1.8px;
}

.rs-sidebar-enquiry h3 {
    color: var(--reli-blue);

    font-size: 24px;
    line-height: 1.25;

    margin: 11px 0 10px;
}

.rs-sidebar-enquiry p {
    color: var(--reli-muted);

    font-size: 12px;
    line-height: 1.65;

    margin-bottom: 20px;
}

.rs-sidebar-enquiry > a {
    display: flex;

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

    padding: 12px 14px;

    background: var(--reli-blue);

    color: #ffffff;

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

    transition: 0.3s ease;
}

.rs-sidebar-enquiry > a:hover {
    background: var(--reli-red);
}

.rs-sidebar-enquiry > a span {
    color: #ffffff;
    font-size: 17px;
}


/* =========================================================
   SIDEBAR PRODUCT RANGE
========================================================= */

.rs-sidebar-products {
    padding: 28px 0;
}

.rs-sidebar-title {
    padding: 0 0 18px;

    border-bottom: 1px solid var(--reli-border);
}

.rs-sidebar-title span {
    display: block;

    color: var(--reli-red);

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

    letter-spacing: 1.7px;

    margin-bottom: 5px;
}

.rs-sidebar-title h3 {
    color: var(--reli-blue);

    font-size: 21px;
    line-height: 1.3;
}


/* TEXT ONLY PRODUCT NAVIGATION */

.rs-sidebar-product {
    display: grid;

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

    align-items: center;

    gap: 12px;

    padding: 16px 0;

    border-bottom: 1px solid var(--reli-border);

    transition: 0.3s ease;
}

.rs-sidebar-product strong {
    display: block;

    color: var(--reli-blue);

    font-size: 13px;
    line-height: 1.4;

    transition: 0.3s ease;
}

.rs-sidebar-product span {
    display: block;

    color: #84909a;

    font-size: 10px;

    margin-top: 4px;
}

.rs-sidebar-product b {
    color: var(--reli-red);

    font-size: 18px;

    transition: transform 0.3s ease;
}

.rs-sidebar-product:hover b {
    transform: translateX(4px);
}

.rs-sidebar-product:hover strong {
    color: var(--reli-red);
}

.rs-sidebar-product.active {
    padding-left: 12px;

    border-left: 3px solid var(--reli-red);

    background: #faf1f2;
}


/* =========================================================
   SIDEBAR QUICK LINKS
========================================================= */

.rs-sidebar-links {
    padding-top: 25px;
}

.rs-sidebar-links > span {
    display: block;

    color: var(--reli-red);

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

    letter-spacing: 1.7px;

    margin-bottom: 8px;
}

.rs-sidebar-links a {
    display: flex;

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

    padding: 11px 0;

    border-bottom: 1px solid var(--reli-border);

    color: var(--reli-blue);

    font-size: 12px;

    transition: 0.3s ease;
}

.rs-sidebar-links a:hover {
    color: var(--reli-red);

    padding-left: 5px;
}

.rs-sidebar-links a b {
    color: var(--reli-red);
}


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

@media (max-width: 1100px) {

    .rs-product-container {
        width: min(100% - 35px, 1100px);
    }

    .rs-product-layout {
        grid-template-columns:
            minmax(0, 1fr) 300px;

        gap: 32px;
    }

    .rs-product-image-box {
        min-height: 380px;
    }

    .rs-product-image-box img {
        width: min(60%, 500px);
        max-height: 340px;
    }

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

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


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

@media (max-width: 850px) {

    .rs-product-page {
        padding: 50px 0 75px;
    }

    .rs-product-layout {
        grid-template-columns: 1fr;
    }

    .rs-product-sidebar {
        position: relative;
        top: auto;

        display: grid;

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

        gap: 28px;
    }

    .rs-sidebar-enquiry {
        grid-column: 1 / -1;
    }

    .rs-sidebar-products,
    .rs-sidebar-links {
        padding-top: 0;
    }

    .rs-product-image-box {
        min-height: 370px;
    }

    .rs-product-image-box img {
        width: min(58%, 470px);
    }
}


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

@media (max-width: 650px) {

    .rs-product-container {
        width: calc(100% - 28px);
    }

    .rs-product-breadcrumb {
        padding: 14px 0;
    }

    .rs-product-page {
        padding: 38px 0 60px;
    }

    .rs-product-header h1 {
        font-size: 38px;
        letter-spacing: -1px;
    }

    .rs-product-header h1 span {
        font-size: 0.62em;
    }

    .rs-product-lead {
        font-size: 15px;
    }

    .rs-product-image-box {
        min-height: 310px;

        margin-bottom: 45px;
    }

    .rs-product-image-box img {
        width: 76%;
        max-height: 270px;
    }

    .rs-product-image-label {
        left: 16px;
        bottom: 17px;
    }

    .rs-product-image-label span {
        width: 30px;
        height: 30px;
    }

    .rs-product-image-label strong {
        font-size: 10px;
    }

    .rs-product-section {
        padding-bottom: 40px;
        margin-bottom: 40px;
    }

    .rs-product-section h2 {
        font-size: 28px;
    }

    .rs-feature-grid,
    .rs-grade-grid,
    .rs-application-grid,
    .rs-check-list {
        grid-template-columns: 1fr;
    }

    .rs-product-review {
        grid-template-columns: 1fr;

        padding: 23px;
    }

    .rs-review-mark {
        width: 55px;
        height: 55px;
    }

    .rs-product-cta {
        flex-direction: column;

        align-items: flex-start;

        padding: 25px;
    }

    .rs-product-sidebar {
        grid-template-columns: 1fr;
    }

    .rs-sidebar-enquiry {
        grid-column: auto;
    }

    .rs-spec-table,
    .rs-composition-table {
        min-width: 620px;
    }
}


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

@media (max-width: 430px) {

    .rs-product-header h1 {
        font-size: 33px;
    }

    .rs-product-image-box {
        min-height: 280px;
    }

    .rs-product-image-box img {
        width: 82%;
    }

    .rs-product-cta a {
        width: 100%;

        justify-content: space-between;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        transition: none !important;
        animation: none !important;
    }
}


/* =========================================================
   RELI SLEEVE — PREMIUM INDUSTRIAL FOOTER
   BLUE: #0b4375
   RED:  #e53237
   FONT: Aptos Serif / Georgia
========================================================= */

:root {
    --reli-footer-blue: #0b4375;
    --reli-footer-blue-dark: #062c4d;
    --reli-footer-blue-deep: #041d33;
    --reli-footer-blue-light: #15588c;

    --reli-footer-red: #e53237;
    --reli-footer-white: #ffffff;
    --reli-footer-muted: #aebdcb;

    --reli-footer-border: rgba(255, 255, 255, 0.13);

    --reli-footer-font: "Aptos Serif", Georgia, serif;
}


/* =========================================================
   FOOTER BASE
========================================================= */

.reli-footer,
.reli-footer * {
    box-sizing: border-box;
    font-family: var(--reli-footer-font);
}

.reli-footer {
    position: relative;
    width: 100%;
    overflow: hidden;
    isolation: isolate;

    color: var(--reli-footer-white);

    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(21, 88, 140, 0.25),
            transparent 28%
        ),
        linear-gradient(
            125deg,
            var(--reli-footer-blue-deep) 0%,
            var(--reli-footer-blue-dark) 48%,
            #082e50 100%
        );
}


/* =========================================================
   TOP ACCENT
========================================================= */

.reli-footer-top-accent {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;

    width: 100%;
    height: 4px;

    background: linear-gradient(
        90deg,
        transparent,
        var(--reli-footer-blue-light) 22%,
        var(--reli-footer-red) 50%,
        var(--reli-footer-blue-light) 78%,
        transparent
    );
}


/* =========================================================
   BACKGROUND ORBITS
========================================================= */

.reli-footer-orbit {
    position: absolute;
    z-index: -1;

    border: 1px solid rgba(255, 255, 255, 0.055);
    border-radius: 50%;

    pointer-events: none;
}

.reli-footer-orbit-one {
    top: -260px;
    right: -170px;

    width: 580px;
    height: 580px;

    box-shadow:
        0 0 0 45px rgba(255, 255, 255, 0.018),
        0 0 0 90px rgba(255, 255, 255, 0.012);
}

.reli-footer-orbit-two {
    bottom: 80px;
    left: -280px;

    width: 500px;
    height: 500px;

    box-shadow:
        0 0 0 45px rgba(255, 255, 255, 0.016),
        0 0 0 90px rgba(255, 255, 255, 0.01);
}


/* =========================================================
   MAIN CONTAINER
========================================================= */

.reli-footer-container {
    position: relative;
    width: min(1320px, 92%);
    margin: 0 auto;
    padding: 76px 0 42px;
}


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

.reli-footer-main {
    display: grid;

    grid-template-columns:
        minmax(0, 1.25fr)
        minmax(0, 0.72fr)
        minmax(0, 0.95fr)
        minmax(0, 1.25fr);

    gap: 42px;

    padding-bottom: 56px;
}


/* =========================================================
   BRAND COLUMN
========================================================= */

.reli-footer-brand {
    min-width: 0;
    max-width: 360px;
}


/* LOGO */

.reli-footer-logo {
    display: inline-flex;
    align-items: center;
    gap: 13px;

    max-width: 100%;
    margin-bottom: 25px;

    color: var(--reli-footer-white);
    text-decoration: none;

    transition: transform 0.35s ease;
}

.reli-footer-logo:hover {
    transform: translateY(-3px);
}


/* CUSTOM SYMBOL */

.reli-logo-mark {
    position: relative;

    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 3px;

    width: 45px;
    height: 43px;

    padding: 5px;

    border-left: 2px solid var(--reli-footer-red);
    border-bottom: 2px solid rgba(255, 255, 255, 0.75);
}

.reli-logo-mark span {
    display: block;

    width: 9px;

    background: linear-gradient(
        180deg,
        #ffffff,
        #9eafbd
    );

    transform: skewY(-20deg);
}

.reli-logo-mark span:nth-child(1) {
    height: 19px;
}

.reli-logo-mark span:nth-child(2) {
    height: 29px;
    background: var(--reli-footer-red);
}

.reli-logo-mark span:nth-child(3) {
    height: 23px;
}


/* LOGO TEXT */

.reli-logo-text {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.reli-logo-text strong {
    display: block;

    color: #ffffff;

    font-size: clamp(23px, 2vw, 30px);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: 0.3px;
}

.reli-logo-text strong span {
    color: #e53237;
}

.reli-logo-text small {
    display: block;

    color: #aebdcb;

    font-family: Arial, sans-serif;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 3px;
}


/* BRAND LINE */

.reli-footer-brand-line {
    display: block;

    width: 70px;
    height: 2px;

    margin-bottom: 21px;

    background: linear-gradient(
        90deg,
        var(--reli-footer-red),
        rgba(229, 50, 55, 0.1)
    );
}


/* DESCRIPTION */

.reli-footer-description {
    margin: 0;

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

    font-size: 13px;
    line-height: 1.95;
    letter-spacing: 0.1px;
}


/* =========================================================
   SOCIAL LINKS
========================================================= */

.reli-footer-social {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;

    margin-top: 25px;
}

.reli-footer-social a {
    position: relative;

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

    width: 39px;
    height: 39px;

    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 50%;

    color: #ffffff;
    background: rgba(255, 255, 255, 0.025);

    font-size: 13px;
    text-decoration: none;

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

.reli-footer-social a:hover {
    color: #ffffff;
    background: var(--reli-footer-red);
    border-color: var(--reli-footer-red);

    transform: translateY(-4px);
}


/* BRAND NOTE */

.reli-footer-brand-note {
    display: flex;
    align-items: center;
    gap: 9px;

    margin-top: 28px;

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

    font-family: Arial, sans-serif;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 1.3px;
    line-height: 1.7;
}

.reli-footer-status-dot {
    position: relative;

    width: 7px;
    height: 7px;
    flex-shrink: 0;

    border-radius: 50%;
    background: var(--reli-footer-red);

    box-shadow: 0 0 12px rgba(229, 50, 55, 0.45);
}


/* =========================================================
   COLUMN HEADINGS
========================================================= */

.reli-footer-column {
    min-width: 0;
}

.reli-footer-heading {
    margin-bottom: 26px;
}

.reli-footer-eyebrow {
    display: block;

    margin-bottom: 8px;

    color: #e76a6e;

    font-family: Arial, sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
}

.reli-footer-heading h3 {
    margin: 0;

    color: #ffffff;

    font-size: 20px;
    font-weight: 600;
    line-height: 1.4;
}

.reli-footer-heading-line {
    position: relative;
    display: block;

    width: 43px;
    height: 2px;

    margin-top: 15px;

    overflow: hidden;
    background: rgba(255, 255, 255, 0.15);
}

.reli-footer-heading-line::after {
    content: "";

    position: absolute;
    inset: 0;

    background: var(--reli-footer-red);

    transform: translateX(-100%);
    animation: reliFooterLineMove 4s ease-in-out infinite;
}

@keyframes reliFooterLineMove {
    0%, 100% {
        transform: translateX(-100%);
    }

    45%, 65% {
        transform: translateX(0);
    }
}


/* =========================================================
   FOOTER LINKS
========================================================= */

.reli-footer-links {
    display: flex;
    flex-direction: column;
    gap: 15px;

    list-style: none;
    margin: 0;
    padding: 0;
}

.reli-footer-links li {
    margin: 0;
    padding: 0;
}

.reli-footer-links a {
    position: relative;

    display: inline-block;

    padding-left: 0;

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

    font-size: 13px;
    line-height: 1.65;
    text-decoration: none;

    overflow-wrap: anywhere;

    transition:
        color 0.3s ease,
        padding-left 0.3s ease;
}

.reli-footer-links a::before {
    content: "";

    position: absolute;
    top: 50%;
    left: 0;

    width: 0;
    height: 2px;

    background: var(--reli-footer-red);

    transform: translateY(-50%);

    transition: width 0.3s ease;
}

.reli-footer-links a:hover {
    padding-left: 15px;
    color: #ffffff;
}

.reli-footer-links a:hover::before {
    width: 8px;
}


/* =========================================================
   PRODUCT NOTE
========================================================= */

.reli-footer-product-note {
    display: flex;
    align-items: flex-start;
    gap: 11px;

    margin-top: 26px;
    padding: 15px 13px;

    border-left: 2px solid var(--reli-footer-red);
    background: rgba(255, 255, 255, 0.045);
}

.reli-footer-product-note-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 29px;

    width: 29px;
    height: 29px;

    color: #ffffff;
    background: rgba(229, 50, 55, 0.17);

    font-size: 12px;
}

.reli-footer-product-note p {
    margin: 0;

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

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


/* =========================================================
   CONTACT DETAILS
========================================================= */

.reli-footer-contact-column {
    min-width: 0;
}

.reli-footer-contact-item {
    display: flex;
    align-items: flex-start;
    gap: 13px;

    margin-bottom: 23px;
}

.reli-footer-contact-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 35px;

    width: 35px;
    height: 35px;

    margin-top: 1px;

    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 50%;

    color: #ffffff;
    background: rgba(255, 255, 255, 0.035);

    font-size: 12px;

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

.reli-footer-contact-item:hover .reli-footer-contact-icon {
    color: #ffffff;
    background: var(--reli-footer-red);
    border-color: var(--reli-footer-red);

    transform: translateY(-2px);
}

.reli-footer-contact-content {
    min-width: 0;
    flex: 1;
}

.reli-footer-contact-label {
    display: block;

    margin-bottom: 6px;

    color: #ffffff;

    font-family: Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.reli-footer-contact-content p {
    margin: 0;

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

    font-size: 12px;
    line-height: 1.85;

    overflow-wrap: anywhere;
}

.reli-footer-contact-content a {
    color: inherit;
    text-decoration: none;

    transition: color 0.3s ease;
}

.reli-footer-contact-content a:hover {
    color: #ffffff;
}


/* =========================================================
   CTA STRIP
========================================================= */

.reli-footer-cta {
    position: relative;

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

    padding: 30px 34px;
    margin-bottom: 12px;

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

    background:
        linear-gradient(
            110deg,
            rgba(11, 67, 117, 0.88),
            rgba(7, 42, 73, 0.92)
        );

    overflow: hidden;
}

.reli-footer-cta::before {
    content: "";

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

    width: 3px;
    height: 100%;

    background: var(--reli-footer-red);
}

.reli-footer-cta-decoration {
    position: absolute;
    right: 15%;
    top: -95px;

    width: 200px;
    height: 200px;

    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 50%;

    pointer-events: none;
}

.reli-footer-cta-content {
    position: relative;
    z-index: 1;

    min-width: 0;
}

.reli-footer-cta-content > span {
    display: block;

    margin-bottom: 9px;

    color: #e76a6e;

    font-family: Arial, sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 2px;
}

.reli-footer-cta h3 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(19px, 2vw, 25px);
    font-weight: 500;
    line-height: 1.5;
}

.reli-footer-cta h3 strong {
    color: #ffffff;
    font-weight: 700;
}

.reli-footer-cta-content p {
    margin: 9px 0 0;

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

    font-size: 12px;
    line-height: 1.7;
}

.reli-footer-cta-button {
    position: relative;
    z-index: 1;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;

    flex: 0 0 auto;

    min-width: 155px;
    padding: 14px 19px;

    border: 1px solid var(--reli-footer-red);

    color: #ffffff;
    background: var(--reli-footer-red);

    font-size: 12px;
    font-weight: 600;
    text-decoration: none;

    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}

.reli-footer-cta-button i {
    transition: transform 0.3s ease;
}

.reli-footer-cta-button:hover {
    color: #ffffff;
    background: transparent;

    transform: translateY(-3px);
}

.reli-footer-cta-button:hover i {
    transform: translateX(4px);
}


/* =========================================================
   BOTTOM BAR
========================================================= */

.reli-footer-bottom {
    position: relative;

    border-top: 1px solid rgba(255, 255, 255, 0.09);
    background: rgba(0, 0, 0, 0.13);
}

.reli-footer-bottom-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    width: min(1320px, 92%);
    min-height: 68px;

    margin: 0 auto;
}

.reli-footer-bottom-inner > p {
    margin: 0;

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

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

.reli-footer-bottom-links {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 13px;
}

.reli-footer-bottom-links a,
.reli-footer-back-top {
    color: rgba(255, 255, 255, 0.55);

    font-size: 11px;
    text-decoration: none;

    transition: color 0.3s ease;
}

.reli-footer-bottom-links a:hover,
.reli-footer-back-top:hover {
    color: #ffffff;
}

.reli-footer-bottom-links span {
    width: 3px;
    height: 3px;

    border-radius: 50%;
    background: var(--reli-footer-red);
}

.reli-footer-back-top {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    white-space: nowrap;
}

.reli-footer-back-top i {
    color: var(--reli-footer-red);
}


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

@media (max-width: 1100px) {

    .reli-footer-main {
        grid-template-columns: 1.2fr 0.8fr 1fr;
        gap: 42px 35px;
    }

    .reli-footer-brand {
        max-width: 100%;
        grid-column: 1 / -1;
    }

    .reli-footer-description {
        max-width: 600px;
    }

    .reli-footer-contact-column {
        grid-column: auto;
    }

    .reli-footer-bottom-inner {
        flex-wrap: wrap;
        padding: 20px 0;
    }

}


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

@media (max-width: 760px) {

    .reli-footer-container {
        padding-top: 58px;
    }

    .reli-footer-main {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 42px 30px;
        padding-bottom: 40px;
    }

    .reli-footer-brand {
        grid-column: 1 / -1;
    }

    .reli-footer-contact-column {
        grid-column: 1 / -1;
    }

    .reli-footer-contact-column .reli-footer-contact-item {
        max-width: 520px;
    }

    .reli-footer-cta {
        align-items: flex-start;
        flex-direction: column;
        gap: 22px;

        padding: 27px 24px;
    }

    .reli-footer-cta-button {
        min-width: 180px;
    }

    .reli-footer-bottom-inner {
        justify-content: center;
        text-align: center;
    }

}


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

@media (max-width: 520px) {

    .reli-footer-container {
        width: 90%;
        padding-top: 48px;
        padding-bottom: 30px;
    }

    .reli-footer-main {
        grid-template-columns: minmax(0, 1fr);
        gap: 36px;
        padding-bottom: 35px;
    }

    .reli-footer-brand {
        grid-column: auto;
    }

    .reli-footer-logo {
        gap: 11px;
    }

    .reli-logo-mark {
        width: 40px;
        height: 39px;
    }

    .reli-logo-text strong {
        font-size: 25px;
    }

    .reli-logo-text small {
        font-size: 8px;
        letter-spacing: 2.5px;
    }

    .reli-footer-description {
        font-size: 12px;
        line-height: 1.9;
    }

    .reli-footer-heading {
        margin-bottom: 22px;
    }

    .reli-footer-heading h3 {
        font-size: 19px;
    }

    .reli-footer-links {
        gap: 13px;
    }

    .reli-footer-links a {
        font-size: 13px;
    }

    .reli-footer-contact-item {
        gap: 11px;
        margin-bottom: 21px;
    }

    .reli-footer-contact-content p {
        font-size: 12px;
    }

    .reli-footer-cta {
        padding: 24px 19px;
        margin-bottom: 0;
    }

    .reli-footer-cta h3 {
        font-size: 20px;
    }

    .reli-footer-cta-content p {
        font-size: 12px;
    }

    .reli-footer-cta-button {
        width: 100%;
    }

    .reli-footer-bottom-inner {
        width: 90%;
        flex-direction: column;
        gap: 13px;

        padding: 20px 0;
    }

    .reli-footer-bottom-inner > p {
        font-size: 10px;
    }

    .reli-footer-bottom-links {
        gap: 10px;
    }

    .reli-footer-bottom-links a,
    .reli-footer-back-top {
        font-size: 10px;
    }

}


/* =========================================================
   ACCESSIBILITY
========================================================= */

.reli-footer a:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 4px;
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .reli-footer *,
    .reli-footer *::before,
    .reli-footer *::after {
        animation: none !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }

}