/* =====================================================
   REDSPY MEDIA CENTRE
   AREAS OF EXPERTISE
===================================================== */

.media-expertise {
    position: relative;
    padding: 100px 0 110px;
    background: #ffffff;
}


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

.media-expertise-title {
    max-width: 900px;
    margin: 0 auto 65px;
    text-align: center;
}

.media-expertise-title > span {
    display: block;
    margin-bottom: 18px;

    color: #c9a441;

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

    letter-spacing: 4px;
    text-transform: uppercase;
}

.media-expertise-title h2 {
    margin: 0 auto 24px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(38px, 4.2vw, 58px);

    line-height: 1.12;
    font-weight: 700;
}

.media-expertise-title p {
    max-width: 760px;

    margin: 0 auto;

    color: #667085;

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


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

.media-expertise-grid {

    display: grid;

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

    gap: 24px;

    max-width: 1180px;

    margin: 0 auto;
}


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

.media-expertise-card {

    position: relative;

    min-height: 300px;

    padding: 36px 32px 32px;

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

    border: 1px solid #e7dfca;

    border-radius: 14px;

    overflow: hidden;

    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.055);

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


/* Gold top accent */

.media-expertise-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a,
            #8f6d20
        );

    transform: scaleX(0.25);

    transform-origin: left;

    transition:
        transform 0.35s ease;
}


/* Decorative circle */

.media-expertise-card::after {

    content: "";

    position: absolute;

    width: 130px;
    height: 130px;

    right: -65px;
    bottom: -65px;

    border-radius: 50%;

    border: 1px solid rgba(201, 164, 65, 0.18);

    pointer-events: none;
}


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

.media-expertise-card:hover {

    transform: translateY(-8px);

    border-color: #c9a441;

    box-shadow:
        0 20px 45px rgba(0, 0, 0, 0.12);
}

.media-expertise-card:hover::before {
    transform: scaleX(1);
}


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

.media-expertise-icon {

    display: flex;

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

    width: 58px;
    height: 58px;

    margin-bottom: 24px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #160507,
            #310a10
        );

    border: 1px solid #c9a441;

    color: #d5b65a;

    font-size: 21px;

    box-shadow:
        0 8px 20px rgba(0, 0, 0, 0.12);
}


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

.media-expertise-number {

    position: absolute;

    top: 25px;
    right: 28px;

    color: rgba(201, 164, 65, 0.22);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 42px;

    font-weight: 700;

    line-height: 1;
}


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

.media-expertise-card h3 {

    margin: 0 0 13px;

    color: #171717;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 24px;

    line-height: 1.2;

    font-weight: 700;
}


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

.media-expertise-card p {

    margin: 0;

    color: #667085;

    font-size: 15.5px;

    line-height: 1.65;
}


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

@media (max-width: 950px) {

    .media-expertise {

        padding: 80px 0 90px;

    }

    .media-expertise-grid {

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

        gap: 20px;

    }

}


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

@media (max-width: 600px) {

    .media-expertise {

        padding: 65px 0 75px;

    }

    .media-expertise-title {

        margin-bottom: 45px;

    }

    .media-expertise-title h2 {

        font-size: 35px;

    }

    .media-expertise-title p {

        font-size: 15px;

    }

    .media-expertise-grid {

        grid-template-columns: 1fr;

        gap: 18px;

    }

    .media-expertise-card {

        min-height: auto;

        padding: 30px 26px;

    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   MEDIA PRESENCE
====================================================== */

.media-presence {
    position: relative;
    padding: 100px 0 110px;
    background: #ffffff;
}


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

.media-presence-title {
    max-width: 900px;
    margin: 0 auto 65px;
    text-align: center;
}

.media-presence-title > span {
    display: block;
    margin-bottom: 18px;

    color: #c9a441;

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

    letter-spacing: 4px;
    text-transform: uppercase;
}

.media-presence-title h2 {
    max-width: 900px;

    margin: 0 auto 24px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(38px, 4.2vw, 58px);

    line-height: 1.12;
    font-weight: 700;
}

.media-presence-title p {
    max-width: 760px;

    margin: 0 auto;

    color: #667085;

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


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

.media-presence-grid {
    display: grid;

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

    gap: 24px;

    max-width: 1180px;

    margin: 0 auto;
}


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

.media-presence-card {
    position: relative;

    min-height: 280px;

    padding: 36px 34px 34px;

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

    border: 1px solid #e7dfca;

    border-radius: 14px;

    overflow: hidden;

    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.055);

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


/* =====================================================
   GOLD TOP ACCENT
====================================================== */

.media-presence-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a,
            #8f6d20
        );

    transform: scaleX(0.25);

    transform-origin: left;

    transition:
        transform 0.35s ease;
}


/* =====================================================
   DECORATIVE CIRCLE
====================================================== */

.media-presence-card::after {
    content: "";

    position: absolute;

    width: 150px;
    height: 150px;

    right: -75px;
    bottom: -75px;

    border-radius: 50%;

    border: 1px solid
        rgba(201, 164, 65, 0.18);

    pointer-events: none;
}


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

.media-presence-card:hover {
    transform: translateY(-8px);

    border-color: #c9a441;

    box-shadow:
        0 20px 45px rgba(0, 0, 0, 0.12);
}

.media-presence-card:hover::before {
    transform: scaleX(1);
}


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

.media-presence-icon {
    display: flex;

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

    width: 58px;
    height: 58px;

    margin-bottom: 24px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #160507,
            #310a10
        );

    border: 1px solid #c9a441;

    color: #d5b65a;

    font-size: 21px;

    box-shadow:
        0 8px 20px rgba(0, 0, 0, 0.12);
}


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

.media-presence-number {
    position: absolute;

    top: 25px;
    right: 28px;

    color:
        rgba(201, 164, 65, 0.22);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 42px;

    font-weight: 700;

    line-height: 1;
}


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

.media-presence-card h3 {
    margin: 0 0 13px;

    color: #171717;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 25px;

    line-height: 1.2;

    font-weight: 700;
}


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

.media-presence-card p {
    max-width: 500px;

    margin: 0;

    color: #667085;

    font-size: 15.5px;

    line-height: 1.65;
}


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

@media (max-width: 950px) {

    .media-presence {
        padding: 80px 0 90px;
    }

    .media-presence-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 20px;
    }
}


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

@media (max-width: 600px) {

    .media-presence {
        padding: 65px 0 75px;
    }

    .media-presence-title {
        margin-bottom: 45px;
    }

    .media-presence-title h2 {
        font-size: 35px;
    }

    .media-presence-title p {
        font-size: 15px;
    }

    .media-presence-grid {
        grid-template-columns: 1fr;

        gap: 18px;
    }

    .media-presence-card {
        min-height: auto;

        padding: 30px 26px;
    }

    .media-presence-card h3 {
        font-size: 23px;
    }
}

/* =====================================================
   REDSPY MEDIA CENTRE
   PUBLIC SPEAKING
====================================================== */

.public-speaking {
    position: relative;

    padding: 105px 0 115px;

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


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

.public-speaking-wrapper {

    display: grid;

    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(380px, 0.85fr);

    gap: 75px;

    align-items: center;

    max-width: 1180px;

    margin: 0 auto;
}


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

.public-speaking-content {
    position: relative;
}


.public-speaking-eyebrow {

    display: inline-block;

    margin-bottom: 18px;

    color: #c9a441;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 4px;

    text-transform: uppercase;
}


.public-speaking-content h2 {

    max-width: 760px;

    margin: 0 0 25px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(38px, 4vw, 56px);

    line-height: 1.12;

    font-weight: 700;
}


.public-speaking-intro {

    max-width: 760px;

    margin: 0 0 30px;

    color: #667085;

    font-size: 16.5px;

    line-height: 1.75;
}


/* =====================================================
   ENGAGEMENT LIST
====================================================== */

.public-speaking-list {

    display: grid;

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

    gap: 15px 30px;

    margin: 0;

    padding: 0;

    list-style: none;
}


.public-speaking-list li {

    display: flex;

    align-items: center;

    gap: 11px;

    color: #252525;

    font-size: 15.5px;

    line-height: 1.5;
}


.public-speaking-list li i {

    flex: 0 0 auto;

    color: #c9a441;

    font-size: 16px;
}


/* =====================================================
   RIGHT VISUAL
====================================================== */

.public-speaking-visual {

    position: relative;

    min-height: 480px;

    display: flex;

    align-items: center;

    justify-content: center;
}


/* =====================================================
   PREMIUM FRAME
====================================================== */

.public-speaking-frame {

    position: relative;

    width: 100%;

    min-height: 460px;

    padding: 55px 45px;

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    overflow: hidden;

    border-radius: 18px;

    background:
        radial-gradient(
            circle at 75% 20%,
            rgba(201,164,65,0.20),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #110407 0%,
            #25070d 48%,
            #100306 100%
        );

    border: 1px solid rgba(201,164,65,0.65);

    box-shadow:
        0 25px 55px rgba(0,0,0,0.18);
}


/* =====================================================
   GOLD BORDER DETAIL
====================================================== */

.public-speaking-frame::before {

    content: "";

    position: absolute;

    inset: 12px;

    border: 1px solid
        rgba(201,164,65,0.22);

    border-radius: 12px;

    pointer-events: none;
}


/* =====================================================
   MICROPHONE ICON
====================================================== */

.public-speaking-icon {

    position: absolute;

    top: 55px;

    left: 45px;

    width: 88px;

    height: 88px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #c9a441,
            #8f6d20
        );

    color: #180507;

    font-size: 34px;

    box-shadow:
        0 15px 35px rgba(0,0,0,0.30);
}


/* =====================================================
   VISUAL TEXT
====================================================== */

.public-speaking-visual-text {

    position: relative;

    z-index: 2;

    max-width: 380px;
}


.public-speaking-visual-text span {

    display: block;

    margin-bottom: 15px;

    color: #d5b65a;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 3px;

    text-transform: uppercase;
}


.public-speaking-visual-text h3 {

    margin: 0 0 20px;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(36px, 4vw, 50px);

    line-height: 1.08;

    font-weight: 700;
}


.public-speaking-visual-text p {

    max-width: 330px;

    margin: 0;

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

    font-size: 14.5px;

    line-height: 1.7;
}


/* =====================================================
   DECORATIVE GOLD CIRCLE
====================================================== */

.public-speaking-decoration {

    position: absolute;

    width: 260px;

    height: 260px;

    right: -90px;

    top: -90px;

    border-radius: 50%;

    border: 1px solid
        rgba(201,164,65,0.22);

    box-shadow:
        0 0 0 35px
        rgba(201,164,65,0.035),
        0 0 0 70px
        rgba(201,164,65,0.025);

    pointer-events: none;
}


/* =====================================================
   SECOND DECORATIVE LINE
====================================================== */

.public-speaking-frame::after {

    content: "";

    position: absolute;

    left: 45px;

    bottom: 38px;

    width: 80px;

    height: 3px;

    background:
        linear-gradient(
            90deg,
            #c9a441,
            transparent
        );
}


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

@media (max-width: 950px) {

    .public-speaking {

        padding: 85px 0 95px;
    }


    .public-speaking-wrapper {

        grid-template-columns: 1fr;

        gap: 50px;
    }


    .public-speaking-content h2 {

        max-width: 850px;
    }


    .public-speaking-intro {

        max-width: 850px;
    }


    .public-speaking-visual {

        max-width: 650px;

        width: 100%;

        margin: 0 auto;
    }
}


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

@media (max-width: 600px) {

    .public-speaking {

        padding: 65px 0 75px;
    }


    .public-speaking-wrapper {

        gap: 40px;
    }


    .public-speaking-content h2 {

        font-size: 35px;
    }


    .public-speaking-intro {

        font-size: 15px;
    }


    .public-speaking-list {

        grid-template-columns: 1fr;

        gap: 13px;
    }


    .public-speaking-visual {

        min-height: 390px;
    }


    .public-speaking-frame {

        min-height: 390px;

        padding: 35px 28px;
    }


    .public-speaking-icon {

        top: 35px;

        left: 28px;

        width: 70px;

        height: 70px;

        font-size: 27px;
    }


    .public-speaking-visual-text h3 {

        font-size: 36px;
    }


    .public-speaking-frame::after {

        left: 28px;

        bottom: 25px;
    }
}

/* =====================================================
   REDSPY MEDIA CENTRE
   FEATURED YOUTUBE INSIGHTS
   PREMIUM TWO-COLUMN LAYOUT
====================================================== */

.youtube-insights {

    position: relative;

    padding: 105px 0 115px;

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


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

.youtube-insights-title {

    max-width: 850px;

    margin: 0 auto 65px;

    text-align: center;
}


.youtube-insights-title > span {

    display: block;

    margin-bottom: 18px;

    color: #c9a441;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 4px;

    text-transform: uppercase;
}


.youtube-insights-title h2 {

    margin: 0 0 24px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(38px, 4.2vw, 58px);

    line-height: 1.12;

    font-weight: 700;
}


.youtube-insights-title p {

    max-width: 800px;

    margin: 0 auto;

    color: #667085;

    font-size: 17px;

    line-height: 1.75;
}


/* =====================================================
   TWO COLUMN GRID
====================================================== */

.youtube-feature-grid {

    display: grid;

    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(350px, 0.65fr);

    gap: 50px;

    align-items: stretch;

    max-width: 1180px;

    margin: 0 auto;
}


/* =====================================================
   VIDEO COLUMN
====================================================== */

.youtube-video-column {

    min-width: 0;
}


.youtube-video-card {

    position: relative;

    overflow: hidden;

    background: #100306;

    border-radius: 16px;

    border: 1px solid
        rgba(201,164,65,0.55);

    box-shadow:
        0 22px 50px
        rgba(0,0,0,0.16);
}


/* =====================================================
   VIDEO FRAME
====================================================== */

.youtube-video-frame {

    position: relative;

    width: 100%;

    aspect-ratio: 16 / 9;

    overflow: hidden;

    background: #080808;
}


.youtube-video-frame iframe {

    position: absolute;

    inset: 0;

    width: 100%;

    height: 100%;

    display: block;

    border: 0;
}


/* Gold video accent */

.youtube-video-card::before {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    z-index: 3;

    width: 100%;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a,
            #8f6d20
        );
}


/* =====================================================
   RIGHT ANALYSIS PANEL
====================================================== */

.youtube-analysis-column {

    position: relative;

    display: flex;

    flex-direction: column;

    justify-content: center;

    padding: 45px 38px;

    overflow: hidden;

    border-radius: 16px;

    background:
        linear-gradient(
            145deg,
            #120406 0%,
            #28080e 55%,
            #100305 100%
        );

    border: 1px solid
        rgba(201,164,65,0.55);

    box-shadow:
        0 20px 45px
        rgba(0,0,0,0.15);
}


/* Decorative circle */

.youtube-analysis-column::after {

    content: "";

    position: absolute;

    width: 260px;

    height: 260px;

    right: -130px;

    top: -130px;

    border-radius: 50%;

    border: 1px solid
        rgba(201,164,65,0.18);

    box-shadow:
        0 0 0 35px
        rgba(201,164,65,0.025),
        0 0 0 70px
        rgba(201,164,65,0.018);

    pointer-events: none;
}


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

.youtube-analysis-eyebrow {

    position: relative;

    z-index: 2;

    display: block;

    margin-bottom: 16px;

    color: #d5b65a;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 3px;

    text-transform: uppercase;
}


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

.youtube-analysis-column h3 {

    position: relative;

    z-index: 2;

    margin: 0 0 20px;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

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

    line-height: 1.12;

    font-weight: 700;
}


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

.youtube-analysis-column > p {

    position: relative;

    z-index: 2;

    margin: 0 0 28px;

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

    font-size: 15px;

    line-height: 1.75;
}


/* =====================================================
   TOPIC LIST
====================================================== */

.youtube-topic-list {

    position: relative;

    z-index: 2;

    display: flex;

    flex-direction: column;

    gap: 12px;

    margin-bottom: 30px;
}


.youtube-topic {

    display: flex;

    align-items: center;

    gap: 13px;

    padding-bottom: 12px;

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

    font-size: 14px;

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


.youtube-topic i {

    width: 30px;

    color: #d5b65a;

    font-size: 15px;

    text-align: center;
}


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

.youtube-watch-button {

    position: relative;

    z-index: 2;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    width: fit-content;

    padding: 14px 22px;

    color: #170407;

    background:
        linear-gradient(
            135deg,
            #d5b65a,
            #b9912e
        );

    border-radius: 999px;

    font-size: 14px;

    font-weight: 700;

    text-decoration: none;

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


.youtube-watch-button:hover {

    color: #170407;

    transform: translateY(-3px);

    box-shadow:
        0 10px 25px
        rgba(201,164,65,0.25);
}


.youtube-watch-button .fa-youtube {

    font-size: 18px;
}


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

@media (max-width: 950px) {

    .youtube-insights {

        padding: 85px 0 95px;
    }


    .youtube-feature-grid {

        grid-template-columns: 1fr;

        gap: 35px;
    }


    .youtube-analysis-column {

        min-height: 420px;
    }
}


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

@media (max-width: 600px) {

    .youtube-insights {

        padding: 65px 0 75px;
    }


    .youtube-insights-title {

        margin-bottom: 45px;
    }


    .youtube-insights-title h2 {

        font-size: 35px;
    }


    .youtube-insights-title p {

        font-size: 15px;
    }


    .youtube-analysis-column {

        padding: 35px 27px;

        min-height: auto;
    }


    .youtube-analysis-column h3 {

        font-size: 32px;
    }


    .youtube-analysis-column > p {

        font-size: 14.5px;
    }


    .youtube-watch-button {

        width: 100%;
    }
}

/* =====================================================
   REDSPY MEDIA CENTRE
   MEDIA IMPACT
   PREMIUM TWO-COLUMN LAYOUT
====================================================== */

.media-impact {

    position: relative;

    padding: 110px 0 115px;

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


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

.media-impact-grid {

    display: grid;

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

    gap: 70px;

    align-items: center;

    max-width: 1180px;

    margin: 0 auto;
}


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

.media-impact-content {

    position: relative;

    padding: 10px 0;
}


.media-impact-eyebrow {

    display: block;

    margin-bottom: 16px;

    color: #c9a441;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 4px;

    text-transform: uppercase;
}


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

.media-impact-content h2 {

    max-width: 650px;

    margin: 0 0 25px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(38px, 4vw, 56px);

    line-height: 1.1;

    font-weight: 700;
}


/* =====================================================
   INTRODUCTION
====================================================== */

.media-impact-intro {

    max-width: 650px;

    margin: 0 0 30px;

    color: #667085;

    font-size: 16px;

    line-height: 1.8;
}


/* =====================================================
   IMPACT LIST
====================================================== */

.media-impact-list {

    display: grid;

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

    gap: 13px 25px;

    max-width: 650px;

    margin: 0 0 30px;

    padding: 0;

    list-style: none;
}


.media-impact-list li {

    display: flex;

    align-items: center;

    gap: 10px;

    color: #252525;

    font-size: 15px;

    font-weight: 500;
}


.media-impact-list li i {

    flex-shrink: 0;

    color: #b38b2c;

    font-size: 15px;
}


/* =====================================================
   CLOSING NOTE
====================================================== */

.media-impact-note {

    display: flex;

    align-items: flex-start;

    gap: 13px;

    max-width: 620px;

    margin-top: 25px;

    padding: 18px 20px;

    background:
        linear-gradient(
            135deg,
            #fffdf7,
            #f8f4e9
        );

    border-left: 3px solid #c9a441;

    color: #596273;

    font-size: 14px;

    line-height: 1.65;
}


.media-impact-note i {

    flex-shrink: 0;

    margin-top: 3px;

    color: #c9a441;

    font-size: 17px;
}


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

.media-impact-visual {

    position: relative;

    width: 100%;
}


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

.media-impact-image-wrap {

    position: relative;

    overflow: hidden;

    width: 100%;

    aspect-ratio: 4 / 4.3;

    background: #160507;

    border-radius: 18px;

    border: 1px solid
        rgba(201,164,65,0.65);

    box-shadow:
        0 25px 55px
        rgba(0,0,0,0.16);
}


/* Gold outer accent */

.media-impact-image-wrap::before {

    content: "";

    position: absolute;

    z-index: 4;

    top: 14px;

    left: 14px;

    right: 14px;

    bottom: 14px;

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

    border-radius: 12px;

    pointer-events: none;
}


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

.media-impact-image-wrap img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center;

    transition:
        transform 0.7s ease;
}


.media-impact-image-wrap:hover img {

    transform: scale(1.04);
}


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

.media-impact-image-overlay {

    position: absolute;

    inset: 0;

    z-index: 2;

    background:
        linear-gradient(
            180deg,
            rgba(12,2,4,0.02) 35%,
            rgba(12,2,4,0.78) 100%
        );

    pointer-events: none;
}


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

.media-impact-caption {

    position: absolute;

    z-index: 5;

    left: 32px;

    right: 32px;

    bottom: 30px;

    display: flex;

    flex-direction: column;

    gap: 7px;
}


.media-impact-caption span {

    color: #d5b65a;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 3px;

    text-transform: uppercase;
}


.media-impact-caption strong {

    max-width: 400px;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 24px;

    line-height: 1.25;
}


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

@media (max-width: 950px) {

    .media-impact {

        padding: 85px 0 95px;
    }


    .media-impact-grid {

        grid-template-columns: 1fr;

        gap: 45px;
    }


    .media-impact-content {

        max-width: 800px;

        margin: 0 auto;
    }


    .media-impact-visual {

        max-width: 650px;

        margin: 0 auto;
    }


    .media-impact-image-wrap {

        aspect-ratio: 16 / 11;
    }
}


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

@media (max-width: 600px) {

    .media-impact {

        padding: 65px 0 75px;
    }


    .media-impact-content h2 {

        font-size: 35px;
    }


    .media-impact-intro {

        font-size: 15px;

        line-height: 1.7;
    }


    .media-impact-list {

        grid-template-columns: 1fr;

        gap: 11px;
    }


    .media-impact-image-wrap {

        aspect-ratio: 4 / 4.6;

        border-radius: 14px;
    }


    .media-impact-caption {

        left: 27px;

        right: 27px;

        bottom: 25px;
    }


    .media-impact-caption strong {

        font-size: 21px;
    }


    .media-impact-note {

        font-size: 13.5px;

        padding: 16px;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   FEATURED ARTICLES & INSIGHTS
   PREMIUM ARTICLE GRID
====================================================== */

.media-articles {

    position: relative;

    padding: 110px 0 120px;

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


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

.media-articles-title {

    max-width: 900px;

    margin: 0 auto 65px;

    text-align: center;
}


.media-articles-title > span {

    display: block;

    margin-bottom: 18px;

    color: #c9a441;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 4px;

    text-transform: uppercase;
}


.media-articles-title h2 {

    max-width: 850px;

    margin: 0 auto 24px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(38px, 4.2vw, 58px);

    line-height: 1.12;

    font-weight: 700;
}


.media-articles-title p {

    max-width: 800px;

    margin: 0 auto;

    color: #667085;

    font-size: 17px;

    line-height: 1.75;
}


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

.media-articles-grid {

    display: grid;

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

    gap: 28px;

    max-width: 1180px;

    margin: 0 auto;
}


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

.media-article-card {

    position: relative;

    overflow: hidden;

    display: flex;

    flex-direction: column;

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

    border: 1px solid #e6dfce;

    border-radius: 16px;

    box-shadow:
        0 12px 35px
        rgba(0,0,0,0.06);

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


.media-article-card:hover {

    transform: translateY(-8px);

    border-color: #c9a441;

    box-shadow:
        0 22px 50px
        rgba(0,0,0,0.13);
}


/* =====================================================
   GOLD TOP ACCENT
====================================================== */

.media-article-card::before {

    content: "";

    position: absolute;

    z-index: 5;

    top: 0;

    left: 0;

    width: 100%;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a,
            #8f6d20
        );

    transform:
        scaleX(0.35);

    transform-origin: left;

    transition:
        transform 0.35s ease;
}


.media-article-card:hover::before {

    transform: scaleX(1);
}


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

.media-article-image {

    position: relative;

    width: 100%;

    aspect-ratio: 16 / 9;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            #160507,
            #310a10
        );
}


.media-article-image img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform 0.6s ease;
}


.media-article-card:hover
.media-article-image img {

    transform: scale(1.05);
}


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

.media-article-image::after {

    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(10,2,4,0.02) 45%,
            rgba(10,2,4,0.55) 100%
        );

    pointer-events: none;
}


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

.media-article-category {

    position: absolute;

    z-index: 3;

    left: 18px;

    bottom: 17px;

    padding: 7px 12px;

    color: #171006;

    background: #d5b65a;

    border-radius: 999px;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.5px;

    text-transform: uppercase;
}


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

.media-article-content {

    position: relative;

    display: flex;

    flex-direction: column;

    flex: 1;

    padding: 30px 28px 27px;
}


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

.media-article-number {

    position: absolute;

    top: 23px;

    right: 25px;

    color:
        rgba(201,164,65,0.18);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 38px;

    font-weight: 700;

    line-height: 1;
}


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

.media-article-content h3 {

    max-width: 90%;

    margin: 0 0 15px;

    color: #171717;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 23px;

    line-height: 1.25;

    font-weight: 700;
}


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

.media-article-content p {

    margin: 0 0 23px;

    color: #667085;

    font-size: 14.5px;

    line-height: 1.7;
}


/* =====================================================
   READ LINK
====================================================== */

.media-article-link {

    display: inline-flex;

    align-items: center;

    gap: 9px;

    margin-top: auto;

    width: fit-content;

    color: #8f6d20;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 0.5px;

    text-decoration: none;

    transition:
        gap 0.25s ease,
        color 0.25s ease;
}


.media-article-link:hover {

    color: #5f4210;

    gap: 13px;
}


.media-article-link i {

    font-size: 12px;
}


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

@media (max-width: 950px) {

    .media-articles {

        padding: 85px 0 95px;
    }


    .media-articles-grid {

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

        gap: 22px;
    }
}


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

@media (max-width: 600px) {

    .media-articles {

        padding: 65px 0 75px;
    }


    .media-articles-title {

        margin-bottom: 45px;
    }


    .media-articles-title h2 {

        font-size: 35px;
    }


    .media-articles-title p {

        font-size: 15px;
    }


    .media-articles-grid {

        grid-template-columns: 1fr;

        gap: 20px;
    }


    .media-article-content {

        padding: 27px 24px 25px;
    }


    .media-article-content h3 {

        font-size: 22px;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   MEDIA INTERVIEWS — FINAL PREMIUM LAYOUT
====================================================== */

.media-interviews {
    position: relative;
    width: 100%;
    padding: 110px 0 120px;
    background: linear-gradient(
        180deg,
        #faf9f6 0%,
        #ffffff 100%
    );
}


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

.media-interviews .media-interviews-title {
    width: 100%;
    max-width: 900px;
    margin: 0 auto 65px;
    text-align: center;
}


.media-interviews .media-interviews-title > span {
    display: block;
    margin-bottom: 18px;

    color: #c9a441;

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

    letter-spacing: 4px;
    text-transform: uppercase;
}


.media-interviews .media-interviews-title h2 {
    max-width: 850px;

    margin: 0 auto 24px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(38px, 4.2vw, 58px);

    line-height: 1.12;

    font-weight: 700;
}


.media-interviews .media-interviews-title p {
    max-width: 780px;

    margin: 0 auto;

    color: #667085;

    font-size: 17px;

    line-height: 1.75;
}


/* =====================================================
   TWO COLUMN LAYOUT
====================================================== */

.media-interviews .media-interviews-layout {
    display: grid;

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

    gap: 60px;

    width: 100%;
    max-width: 1180px;

    margin: 0 auto;

    align-items: center;
}


/* =====================================================
   VIDEO COLUMN
====================================================== */

.media-interviews .media-interview-video {
    width: 100%;
    min-width: 0;
}


.media-interviews .media-video-frame {
    position: relative;

    width: 100%;

    aspect-ratio: 16 / 9;

    overflow: hidden;

    background: #100305;

    border: 1px solid #c9a441;

    border-radius: 16px;

    box-shadow:
        0 20px 55px rgba(0, 0, 0, 0.15);
}


.media-interviews .media-video-frame::before {
    content: "";

    position: absolute;

    z-index: 3;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a,
            #8f6d20
        );

    pointer-events: none;
}


.media-interviews .media-video-frame iframe {
    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    border: 0;
}


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

.media-interviews .media-interview-content {
    width: 100%;

    padding: 10px 0;
}


.media-interviews .media-interview-label {
    display: block;

    margin-bottom: 16px;

    color: #c9a441;

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

    letter-spacing: 3px;

    text-transform: uppercase;
}


.media-interviews .media-interview-content h3 {
    margin: 0 0 22px;

    color: #171717;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(32px, 3.2vw, 45px);

    line-height: 1.15;

    font-weight: 700;
}


.media-interviews .media-interview-content p {
    margin: 0 0 17px;

    color: #667085;

    font-size: 15.5px;

    line-height: 1.75;
}


/* =====================================================
   PROFESSIONAL POINTS
====================================================== */

.media-interviews .media-interview-points {
    display: grid;

    grid-template-columns: 1fr;

    gap: 10px;

    margin: 26px 0 30px;

    padding: 0;

    list-style: none;
}


.media-interviews .media-interview-points li {
    display: flex;

    align-items: center;

    gap: 10px;

    color: #292929;

    font-size: 14px;

    line-height: 1.5;
}


.media-interviews .media-interview-points i {
    color: #b08a2e;

    font-size: 15px;
}


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

.media-interviews .media-interview-button {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    padding: 14px 24px;

    color: #ffffff !important;

    background:
        linear-gradient(
            135deg,
            #8f1026,
            #b01732
        );

    border-radius: 999px;

    font-size: 13px;

    font-weight: 700;

    text-decoration: none;

    box-shadow:
        0 8px 22px rgba(143, 16, 38, 0.20);

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


.media-interviews .media-interview-button:hover {
    color: #ffffff !important;

    transform: translateY(-2px);

    box-shadow:
        0 12px 28px rgba(143, 16, 38, 0.30);
}


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

@media (max-width: 950px) {

    .media-interviews {
        padding: 85px 0 95px;
    }

    .media-interviews .media-interviews-layout {
        grid-template-columns: 1fr;

        gap: 45px;

        max-width: 800px;
    }

}


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

@media (max-width: 600px) {

    .media-interviews {
        padding: 65px 0 75px;
    }

    .media-interviews .media-interviews-title {
        margin-bottom: 45px;
    }

    .media-interviews .media-interviews-title h2 {
        font-size: 35px;
    }

    .media-interviews .media-interviews-title p {
        font-size: 15px;
    }

    .media-interviews .media-interviews-layout {
        gap: 35px;
    }

    .media-interviews .media-interview-content h3 {
        font-size: 32px;
    }

    .media-interviews .media-video-frame {
        border-radius: 12px;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   EDITORIAL HIGHLIGHTS
   PREMIUM TOPIC GRID
====================================================== */

.editorial-highlights {

    position: relative;

    width: 100%;

    padding: 110px 0 120px;

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


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

.editorial-highlights-title {

    max-width: 900px;

    margin: 0 auto 65px;

    text-align: center;
}


.editorial-highlights-title > span {

    display: block;

    margin-bottom: 18px;

    color: #c9a441;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 4px;

    text-transform: uppercase;
}


.editorial-highlights-title h2 {

    max-width: 850px;

    margin: 0 auto 24px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(38px, 4.2vw, 58px);

    line-height: 1.12;

    font-weight: 700;
}


.editorial-highlights-title p {

    max-width: 760px;

    margin: 0 auto;

    color: #667085;

    font-size: 17px;

    line-height: 1.75;
}


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

.editorial-highlights-grid {

    display: grid;

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

    gap: 24px;

    width: 100%;

    max-width: 1180px;

    margin: 0 auto;
}


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

.editorial-card {

    position: relative;

    min-height: 285px;

    padding: 34px 30px 30px;

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

    border: 1px solid #e7dfca;

    border-radius: 14px;

    overflow: hidden;

    box-shadow:
        0 10px 30px
        rgba(0, 0, 0, 0.055);

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


/* =====================================================
   GOLD TOP ACCENT
====================================================== */

.editorial-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a,
            #8f6d20
        );

    transform: scaleX(0.25);

    transform-origin: left;

    transition:
        transform 0.35s ease;
}


/* =====================================================
   DECORATIVE GOLD CIRCLE
====================================================== */

.editorial-card::after {

    content: "";

    position: absolute;

    width: 140px;
    height: 140px;

    right: -70px;
    bottom: -70px;

    border-radius: 50%;

    border: 1px solid
        rgba(201, 164, 65, 0.18);

    pointer-events: none;
}


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

.editorial-card:hover {

    transform: translateY(-8px);

    border-color: #c9a441;

    box-shadow:
        0 20px 45px
        rgba(0, 0, 0, 0.12);
}


.editorial-card:hover::before {

    transform: scaleX(1);
}


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

.editorial-card-number {

    position: absolute;

    top: 24px;
    right: 27px;

    color:
        rgba(201, 164, 65, 0.20);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 42px;

    font-weight: 700;

    line-height: 1;
}


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

.editorial-card-icon {

    display: flex;

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

    width: 58px;
    height: 58px;

    margin-bottom: 24px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #160507,
            #310a10
        );

    border: 1px solid #c9a441;

    color: #d5b65a;

    font-size: 20px;

    box-shadow:
        0 8px 20px
        rgba(0, 0, 0, 0.12);
}


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

.editorial-card h3 {

    position: relative;

    margin: 0 0 13px;

    color: #171717;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 24px;

    line-height: 1.2;

    font-weight: 700;
}


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

.editorial-card p {

    position: relative;

    margin: 0;

    color: #667085;

    font-size: 15.5px;

    line-height: 1.65;
}


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

@media (max-width: 950px) {

    .editorial-highlights {

        padding: 85px 0 95px;
    }


    .editorial-highlights-grid {

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

        gap: 20px;
    }

}


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

@media (max-width: 600px) {

    .editorial-highlights {

        padding: 65px 0 75px;
    }


    .editorial-highlights-title {

        margin-bottom: 45px;
    }


    .editorial-highlights-title h2 {

        font-size: 35px;
    }


    .editorial-highlights-title p {

        font-size: 15px;
    }


    .editorial-highlights-grid {

        grid-template-columns: 1fr;

        gap: 18px;
    }


    .editorial-card {

        min-height: auto;

        padding: 30px 26px;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   FOUNDER TESTIMONIAL
====================================================== */

.founder-testimonial {

    position: relative;

    width: 100%;

    padding: 90px 0 105px;

    background: #ffffff;
}


/* =====================================================
   TESTIMONIAL BOX
====================================================== */

.founder-testimonial-box {

    position: relative;

    max-width: 1180px;

    margin: 0 auto;

    padding: 65px 90px 60px;

    background:
        linear-gradient(
            145deg,
            #160507 0%,
            #26090e 55%,
            #120305 100%
        );

    border: 1px solid #8f6d20;

    border-radius: 16px;

    overflow: hidden;

    text-align: center;

    box-shadow:
        0 20px 55px
        rgba(0, 0, 0, 0.16);
}


/* =====================================================
   GOLD TOP LINE
====================================================== */

.founder-testimonial-box::before {

    content: "";

    position: absolute;

    top: 0;
    left: 50%;

    width: 180px;
    height: 4px;

    transform: translateX(-50%);

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a,
            #8f6d20
        );
}


/* =====================================================
   DECORATIVE CIRCLE
====================================================== */

.founder-testimonial-box::after {

    content: "";

    position: absolute;

    width: 260px;
    height: 260px;

    right: -130px;
    bottom: -130px;

    border-radius: 50%;

    border: 1px solid
        rgba(201, 164, 65, 0.18);

    pointer-events: none;
}


/* =====================================================
   QUOTATION MARK
====================================================== */

.testimonial-quote-mark {

    position: relative;

    margin-bottom: 12px;

    color: #d5b65a;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 82px;

    line-height: 0.7;

    font-weight: 700;
}


/* =====================================================
   TESTIMONIAL TEXT
====================================================== */

.founder-testimonial-box blockquote {

    position: relative;

    max-width: 900px;

    margin: 0 auto 32px;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(21px, 2.1vw, 28px);

    line-height: 1.65;

    font-style: italic;

    font-weight: 400;
}


/* =====================================================
   AUTHOR
====================================================== */

.testimonial-author {

    position: relative;

    z-index: 2;
}


.testimonial-author h3 {

    margin: 0 0 7px;

    color: #d5b65a;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 22px;

    letter-spacing: 1.5px;

    font-weight: 700;
}


.testimonial-author p {

    margin: 0 0 6px;

    color: #ffffff;

    font-size: 15px;

    line-height: 1.6;
}


.testimonial-author span {

    display: block;

    color: #c9bfa9;

    font-size: 14px;

    line-height: 1.6;
}


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

@media (max-width: 900px) {

    .founder-testimonial {

        padding: 75px 0 85px;
    }


    .founder-testimonial-box {

        padding: 55px 55px 50px;
    }


    .founder-testimonial-box blockquote {

        font-size: 21px;
    }

}


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

@media (max-width: 600px) {

    .founder-testimonial {

        padding: 60px 0 70px;
    }


    .founder-testimonial-box {

        padding: 48px 25px 42px;

        border-radius: 12px;
    }


    .testimonial-quote-mark {

        font-size: 68px;
    }


    .founder-testimonial-box blockquote {

        font-size: 18px;

        line-height: 1.65;
    }


    .testimonial-author h3 {

        font-size: 20px;
    }


    .testimonial-author p,
    .testimonial-author span {

        font-size: 13px;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   PROFESSIONAL RECOGNITION
====================================================== */

.recognition-grid {

    display: grid;

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

    gap: 22px;

    max-width: 1180px;

    margin: 65px auto 0;
}


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

.recognition-card {

    position: relative;

    min-height: 290px;

    padding: 34px 28px 30px;

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

    border: 1px solid #e7dfca;

    border-radius: 14px;

    overflow: hidden;

    box-shadow:
        0 10px 30px
        rgba(0, 0, 0, 0.055);

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


/* =====================================================
   GOLD TOP ACCENT
====================================================== */

.recognition-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a,
            #8f6d20
        );

    transform:
        scaleX(0.3);

    transform-origin: left;

    transition:
        transform 0.35s ease;
}


/* =====================================================
   DECORATIVE CIRCLE
====================================================== */

.recognition-card::after {

    content: "";

    position: absolute;

    width: 120px;
    height: 120px;

    right: -60px;
    bottom: -60px;

    border-radius: 50%;

    border: 1px solid
        rgba(201, 164, 65, 0.18);

    pointer-events: none;
}


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

.recognition-card:hover {

    transform:
        translateY(-8px);

    border-color:
        #c9a441;

    box-shadow:
        0 20px 45px
        rgba(0, 0, 0, 0.12);
}


.recognition-card:hover::before {

    transform:
        scaleX(1);
}


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

.recognition-number {

    position: absolute;

    top: 22px;
    right: 24px;

    color:
        rgba(201, 164, 65, 0.20);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 38px;

    font-weight: 700;

    line-height: 1;
}


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

.recognition-icon {

    display: flex;

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

    width: 58px;
    height: 58px;

    margin-bottom: 25px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #160507,
            #310a10
        );

    border:
        1px solid #c9a441;

    color:
        #d5b65a;

    font-size: 20px;

    box-shadow:
        0 8px 20px
        rgba(0, 0, 0, 0.12);
}


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

.recognition-card h3 {

    margin:
        0 0 13px;

    color:
        #171717;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 23px;

    line-height: 1.2;

    font-weight: 700;

    text-transform: capitalize;
}


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

.recognition-card p {

    margin: 0;

    color:
        #667085;

    font-size: 15px;

    line-height: 1.65;
}


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

@media (max-width: 1000px) {

    .recognition-grid {

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

        gap: 20px;

        margin-top: 50px;
    }

}


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

@media (max-width: 600px) {

    .recognition-grid {

        grid-template-columns: 1fr;

        gap: 18px;

        margin-top: 40px;
    }


    .recognition-card {

        min-height: auto;

        padding: 30px 26px;
    }


    .recognition-number {

        font-size: 34px;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   PROFESSIONAL PROFILE
====================================================== */

.media-profile {

    position: relative;

    padding:
        105px 0
        110px;

    background: #ffffff;
}


/* =====================================================
   TWO COLUMN WRAPPER
====================================================== */

.media-profile-wrapper {

    display: grid;

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

    gap: 75px;

    align-items: center;

    max-width: 1180px;

    margin: 0 auto;
}


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

.media-profile-image {

    position: relative;

    overflow: hidden;

    border-radius: 16px;

    border:
        1px solid #e7dfca;

    background: #f7f5f0;

    box-shadow:
        0 18px 45px
        rgba(0, 0, 0, 0.10);
}


.media-profile-image::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 5px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a,
            #8f6d20
        );

    z-index: 2;
}


.media-profile-image img {

    display: block;

    width: 100%;

    height: 520px;

    object-fit: cover;

    object-position: center;

    transition:
        transform 0.6s ease;
}


.media-profile-image:hover img {

    transform:
        scale(1.035);
}


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

.media-profile-content {

    max-width: 650px;
}


.media-profile-label {

    display: block;

    margin-bottom: 18px;

    color: #c9a441;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 4px;

    text-transform: uppercase;
}


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

.media-profile-content h2 {

    margin:
        0 0 25px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(38px, 4vw, 54px);

    line-height: 1.12;

    font-weight: 700;
}


/* =====================================================
   PARAGRAPHS
====================================================== */

.media-profile-content p {

    margin:
        0 0 18px;

    color: #667085;

    font-size: 16px;

    line-height: 1.75;
}


/* =====================================================
   PROFILE LIST
====================================================== */

.media-profile-list {

    display: grid;

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

    gap:
        13px 25px;

    margin:
        28px 0 0;

    padding: 0;

    list-style: none;
}


.media-profile-list li {

    display: flex;

    align-items: flex-start;

    gap: 9px;

    color: #202020;

    font-size: 15px;

    line-height: 1.5;
}


.media-profile-list li i {

    flex-shrink: 0;

    margin-top: 3px;

    color: #b18a2d;

    font-size: 15px;
}


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

@media (max-width: 950px) {

    .media-profile {

        padding:
            85px 0
            90px;
    }


    .media-profile-wrapper {

        grid-template-columns:
            1fr;

        gap: 45px;

        max-width: 760px;
    }


    .media-profile-content {

        max-width: none;
    }


    .media-profile-image img {

        height: 500px;
    }

}


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

@media (max-width: 600px) {

    .media-profile {

        padding:
            65px 0
            75px;
    }


    .media-profile-wrapper {

        gap: 35px;
    }


    .media-profile-image img {

        height: 420px;
    }


    .media-profile-content h2 {

        font-size: 35px;

        line-height: 1.15;
    }


    .media-profile-content p {

        font-size: 15px;

        line-height: 1.7;
    }


    .media-profile-list {

        grid-template-columns: 1fr;

        gap: 12px;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   PUBLIC ENGAGEMENT STATISTICS
====================================================== */

.media-stats-grid {

    display: grid;

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

    gap: 24px;

    max-width: 1080px;

    margin: 65px auto 0;
}


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

.media-stat-card {

    position: relative;

    padding: 42px 30px 38px;

    text-align: center;

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

    border:
        1px solid #e7dfca;

    border-radius: 14px;

    overflow: hidden;

    box-shadow:
        0 10px 30px
        rgba(0, 0, 0, 0.055);

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


/* =====================================================
   GOLD TOP LINE
====================================================== */

.media-stat-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a,
            #8f6d20
        );

    transform:
        scaleX(0.3);

    transform-origin: center;

    transition:
        transform 0.35s ease;
}


/* =====================================================
   DECORATIVE CIRCLE
====================================================== */

.media-stat-card::after {

    content: "";

    position: absolute;

    width: 120px;
    height: 120px;

    right: -60px;
    bottom: -60px;

    border-radius: 50%;

    border:
        1px solid
        rgba(201, 164, 65, 0.16);

    pointer-events: none;
}


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

.media-stat-card:hover {

    transform:
        translateY(-7px);

    border-color:
        #c9a441;

    box-shadow:
        0 20px 40px
        rgba(0, 0, 0, 0.11);
}


.media-stat-card:hover::before {

    transform:
        scaleX(1);
}


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

.media-stat-number {

    margin-bottom: 10px;

    color: #171717;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

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

    line-height: 1;

    font-weight: 700;
}


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

.media-stat-label {

    color:
        #667085;

    font-size: 15px;

    line-height: 1.5;

    letter-spacing: 0.3px;
}


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

@media (max-width: 800px) {

    .media-stats-grid {

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

        gap: 20px;

        margin-top: 50px;
    }

}


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

@media (max-width: 560px) {

    .media-stats-grid {

        grid-template-columns: 1fr;

        gap: 18px;

        margin-top: 40px;
    }


    .media-stat-card {

        padding:
            35px 25px;
    }


    .media-stat-number {

        font-size: 52px;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   PUBLIC ENGAGEMENT
====================================================== */

.media-engagement-grid {

    display: grid;

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

    gap: 24px;

    max-width: 1120px;

    margin: 65px auto 0;
}


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

/* First three cards */

.media-engagement-card:nth-child(1),
.media-engagement-card:nth-child(2),
.media-engagement-card:nth-child(3) {

    grid-column: span 2;
}


/* Last two cards centred */

.media-engagement-card:nth-child(4) {

    grid-column: 2 / span 2;
}

.media-engagement-card:nth-child(5) {

    grid-column: 4 / span 2;
}


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

.media-engagement-card {

    position: relative;

    min-height: 260px;

    padding: 34px 30px 30px;

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

    border:
        1px solid #e7dfca;

    border-radius: 14px;

    overflow: hidden;

    box-shadow:
        0 10px 30px
        rgba(0, 0, 0, 0.055);

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


/* =====================================================
   GOLD TOP ACCENT
====================================================== */

.media-engagement-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a,
            #8f6d20
        );

    transform:
        scaleX(0.25);

    transform-origin: left;

    transition:
        transform 0.35s ease;
}


/* =====================================================
   DECORATIVE CIRCLE
====================================================== */

.media-engagement-card::after {

    content: "";

    position: absolute;

    width: 130px;
    height: 130px;

    right: -65px;
    bottom: -65px;

    border-radius: 50%;

    border:
        1px solid
        rgba(201, 164, 65, 0.17);

    pointer-events: none;
}


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

.media-engagement-card:hover {

    transform:
        translateY(-8px);

    border-color:
        #c9a441;

    box-shadow:
        0 20px 45px
        rgba(0, 0, 0, 0.11);
}


.media-engagement-card:hover::before {

    transform:
        scaleX(1);
}


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

.media-engagement-icon {

    display: flex;

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

    width: 56px;
    height: 56px;

    margin-bottom: 24px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #160507,
            #310a10
        );

    border:
        1px solid #c9a441;

    color:
        #d5b65a;

    font-size: 20px;

    box-shadow:
        0 8px 20px
        rgba(0, 0, 0, 0.12);
}


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

.media-engagement-number {

    position: absolute;

    top: 24px;
    right: 25px;

    color:
        rgba(201, 164, 65, 0.22);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 40px;

    font-weight: 700;

    line-height: 1;
}


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

.media-engagement-card h3 {

    margin:
        0 0 12px;

    color:
        #171717;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        24px;

    line-height:
        1.2;

    font-weight:
        700;
}


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

.media-engagement-card p {

    margin: 0;

    color:
        #667085;

    font-size:
        15px;

    line-height:
        1.65;
}


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

@media (max-width: 900px) {

    .media-engagement-grid {

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


    .media-engagement-card:nth-child(1),
    .media-engagement-card:nth-child(2),
    .media-engagement-card:nth-child(3),
    .media-engagement-card:nth-child(4),
    .media-engagement-card:nth-child(5) {

        grid-column: auto;
    }


    .media-engagement-card:nth-child(5) {

        grid-column:
            1 / -1;

        max-width:
            calc(50% - 10px);

        width: 100%;

        justify-self:
            center;
    }

}


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

@media (max-width: 600px) {

    .media-engagement-grid {

        grid-template-columns: 1fr;

        gap: 18px;

        margin-top: 45px;
    }


    .media-engagement-card:nth-child(5) {

        grid-column: auto;

        max-width: none;
    }


    .media-engagement-card {

        min-height: auto;

        padding:
            30px 26px;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   OUR KNOWLEDGE MISSION
====================================================== */

.media-knowledge-mission {

    position: relative;

    padding: 100px 0 110px;

    background: #ffffff;

    overflow: hidden;
}


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

.media-knowledge-container {

    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;

    display: grid;

    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(360px, 0.85fr);

    gap: 70px;

    align-items: center;
}


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

.media-knowledge-content {

    position: relative;

    padding-right: 20px;
}


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

.media-knowledge-icon {

    display: flex;

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

    width: 58px;
    height: 58px;

    margin-bottom: 20px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #160507,
            #310a10
        );

    border: 1px solid #c9a441;

    color: #d5b65a;

    font-size: 21px;

    box-shadow:
        0 10px 25px
        rgba(0, 0, 0, 0.12);
}


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

.media-knowledge-label {

    display: block;

    margin-bottom: 14px;

    color: #c9a441;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 3.5px;

    text-transform: uppercase;
}


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

.media-knowledge-content h2 {

    margin:
        0 0 22px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(38px, 4vw, 56px);

    line-height:
        1.1;

    font-weight:
        700;
}


/* =====================================================
   PARAGRAPH
====================================================== */

.media-knowledge-content p {

    max-width: 720px;

    margin: 0 0 30px;

    color: #667085;

    font-size: 16px;

    line-height: 1.8;
}


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

.media-knowledge-btn {

    display: inline-flex;

    align-items: center;

    gap: 13px;

    padding:
        16px 25px;

    background:
        linear-gradient(
            135deg,
            #8f0f20,
            #b51c32
        );

    color: #ffffff;

    text-decoration: none;

    font-size: 14px;

    font-weight: 700;

    border-radius: 30px;

    box-shadow:
        0 10px 25px
        rgba(143, 15, 32, 0.20);

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


.media-knowledge-btn i {

    font-size: 13px;

    transition:
        transform 0.3s ease;
}


.media-knowledge-btn:hover {

    transform:
        translateY(-3px);

    box-shadow:
        0 15px 30px
        rgba(143, 15, 32, 0.28);
}


.media-knowledge-btn:hover i {

    transform:
        translateX(4px);
}


/* =====================================================
   RIGHT PREMIUM PANEL
====================================================== */

.media-knowledge-panel {

    position: relative;

    min-height: 420px;

    padding: 38px 35px;

    background:
        linear-gradient(
            145deg,
            #160507 0%,
            #28090f 55%,
            #120305 100%
        );

    border-radius: 18px;

    border:
        1px solid
        rgba(201, 164, 65, 0.55);

    overflow: hidden;

    box-shadow:
        0 25px 55px
        rgba(0, 0, 0, 0.16);
}


/* Gold glow */

.media-knowledge-panel::before {

    content: "";

    position: absolute;

    width: 250px;
    height: 250px;

    right: -100px;
    top: -100px;

    border-radius: 50%;

    border:
        1px solid
        rgba(213, 182, 90, 0.25);

    box-shadow:
        0 0 0 30px
        rgba(213, 182, 90, 0.025),
        0 0 0 60px
        rgba(213, 182, 90, 0.02);

    pointer-events: none;
}


/* =====================================================
   PANEL TOP
====================================================== */

.media-knowledge-panel-top {

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding-bottom: 24px;

    margin-bottom: 32px;

    border-bottom:
        1px solid
        rgba(213, 182, 90, 0.22);
}


.media-knowledge-panel-top span {

    color: #d5b65a;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 4px;
}


.media-knowledge-panel-top i {

    color: #d5b65a;

    font-size: 22px;
}


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

.media-knowledge-panel-title {

    margin-bottom: 34px;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 30px;

    line-height: 1.2;
}


.media-knowledge-panel-title strong {

    display: block;

    margin-top: 4px;

    color: #d5b65a;

    font-weight: 700;
}


/* =====================================================
   POINTS
====================================================== */

.media-knowledge-points {

    display: flex;

    flex-direction: column;

    gap: 23px;
}


.media-knowledge-point {

    display: flex;

    align-items: flex-start;

    gap: 16px;
}


.media-knowledge-point-icon {

    flex: 0 0 auto;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 42px;
    height: 42px;

    border-radius: 50%;

    background:
        rgba(201, 164, 65, 0.10);

    border:
        1px solid
        rgba(201, 164, 65, 0.45);

    color: #d5b65a;

    font-size: 15px;
}


.media-knowledge-point strong {

    display: block;

    margin-bottom: 4px;

    color: #ffffff;

    font-size: 15px;

    font-weight: 600;
}


.media-knowledge-point small {

    display: block;

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

    font-size: 13px;

    line-height: 1.5;
}


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

@media (max-width: 900px) {

    .media-knowledge-container {

        grid-template-columns: 1fr;

        gap: 45px;
    }


    .media-knowledge-content {

        padding-right: 0;
    }


    .media-knowledge-panel {

        max-width: 650px;

        width: 100%;

        margin: 0 auto;
    }

}


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

@media (max-width: 600px) {

    .media-knowledge-mission {

        padding:
            70px 0 80px;
    }


    .media-knowledge-container {

        padding:
            0 18px;

        gap: 35px;
    }


    .media-knowledge-content h2 {

        font-size: 36px;
    }


    .media-knowledge-content p {

        font-size: 15px;

        line-height: 1.7;
    }


    .media-knowledge-panel {

        min-height: auto;

        padding:
            30px 25px;
    }


    .media-knowledge-panel-title {

        font-size: 27px;
    }


    .media-knowledge-btn {

        width: 100%;

        justify-content: center;

        text-align: center;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   MEDIA COLLABORATION
====================================================== */

.media-collaboration {

    position: relative;

    padding: 105px 0 115px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fcfbf8 100%
        );

    overflow: hidden;
}


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

.media-collaboration-container {

    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;

    display: grid;

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

    gap: 70px;

    align-items: center;
}


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

.media-collaboration-content {

    position: relative;

    padding-right: 15px;
}


.media-collaboration-label {

    display: block;

    margin-bottom: 18px;

    color: #c9a441;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 3.5px;

    text-transform: uppercase;
}


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

.media-collaboration-content h2 {

    margin: 0 0 24px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

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

    line-height: 1.08;

    font-weight: 700;
}


.media-collaboration-content h2 span {

    display: block;

    color: #8f1022;
}


/* =====================================================
   PARAGRAPH
====================================================== */

.media-collaboration-content p {

    max-width: 540px;

    margin: 0 0 32px;

    color: #667085;

    font-size: 16px;

    line-height: 1.8;
}


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

.media-collaboration-btn {

    display: inline-flex;

    align-items: center;

    gap: 13px;

    padding:
        16px 25px;

    background:
        linear-gradient(
            135deg,
            #8f0f20,
            #b51c32
        );

    color: #ffffff;

    text-decoration: none;

    font-size: 14px;

    font-weight: 700;

    border-radius: 30px;

    box-shadow:
        0 10px 25px
        rgba(143, 15, 32, 0.20);

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


.media-collaboration-btn i {

    font-size: 13px;

    transition:
        transform 0.3s ease;
}


.media-collaboration-btn:hover {

    transform:
        translateY(-3px);

    box-shadow:
        0 15px 30px
        rgba(143, 15, 32, 0.28);
}


.media-collaboration-btn:hover i {

    transform:
        translateX(4px);
}


/* =====================================================
   RIGHT CARD GRID
====================================================== */

.media-collaboration-grid {

    display: grid;

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

    gap: 18px;
}


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

.media-collaboration-card {

    position: relative;

    min-height: 185px;

    padding:
        25px 23px;

    display: flex;

    gap: 17px;

    background: #ffffff;

    border:
        1px solid
        #e7dfca;

    border-radius: 13px;

    overflow: hidden;

    box-shadow:
        0 8px 25px
        rgba(0, 0, 0, 0.045);

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


/* Gold top line */

.media-collaboration-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 45px;
    height: 3px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a
        );

    transition:
        width 0.3s ease;
}


.media-collaboration-card:hover {

    transform:
        translateY(-6px);

    border-color:
        #c9a441;

    box-shadow:
        0 18px 35px
        rgba(0, 0, 0, 0.10);
}


.media-collaboration-card:hover::before {

    width: 100%;
}


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

.media-collaboration-icon {

    flex: 0 0 auto;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 45px;
    height: 45px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #160507,
            #310a10
        );

    border:
        1px solid
        #c9a441;

    color:
        #d5b65a;

    font-size: 16px;

    box-shadow:
        0 7px 16px
        rgba(0, 0, 0, 0.10);
}


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

.media-collaboration-number {

    display: block;

    margin-bottom: 5px;

    color:
        rgba(201, 164, 65, 0.65);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1px;
}


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

.media-collaboration-card h3 {

    margin: 0 0 9px;

    color: #171717;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 20px;

    line-height: 1.2;

    font-weight: 700;
}


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

.media-collaboration-card p {

    margin: 0;

    color: #667085;

    font-size: 13.5px;

    line-height: 1.55;
}


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

@media (max-width: 950px) {

    .media-collaboration {

        padding:
            85px 0 95px;
    }


    .media-collaboration-container {

        grid-template-columns: 1fr;

        gap: 45px;
    }


    .media-collaboration-content {

        padding-right: 0;

        max-width: 750px;

        margin: 0 auto;

        text-align: center;
    }


    .media-collaboration-content p {

        margin-left: auto;

        margin-right: auto;
    }


    .media-collaboration-grid {

        max-width: 750px;

        width: 100%;

        margin: 0 auto;
    }

}


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

@media (max-width: 600px) {

    .media-collaboration {

        padding:
            70px 0 80px;
    }


    .media-collaboration-container {

        padding:
            0 18px;
    }


    .media-collaboration-content h2 {

        font-size: 36px;
    }


    .media-collaboration-content p {

        font-size: 15px;

        line-height: 1.7;
    }


    .media-collaboration-grid {

        grid-template-columns: 1fr;

        gap: 15px;
    }


    .media-collaboration-card {

        min-height: auto;

        padding:
            23px 20px;
    }


    .media-collaboration-btn {

        width: 100%;

        justify-content: center;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   PROFESSIONAL REPUTATION
====================================================== */

.media-reputation {

    position: relative;

    padding: 105px 0 115px;

    background: #ffffff;

    overflow: hidden;
}


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

.media-reputation-container {

    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;
}


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

.media-reputation-header {

    max-width: 850px;

    margin: 0 auto 65px;

    text-align: center;
}


.media-reputation-label {

    display: block;

    margin-bottom: 18px;

    color: #c9a441;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 3.5px;

    text-transform: uppercase;
}


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

.media-reputation-header h2 {

    margin: 0 0 24px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(40px, 4.2vw, 58px);

    line-height: 1.1;

    font-weight: 700;
}


.media-reputation-header h2 span {

    display: block;
}


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

.media-reputation-header p {

    max-width: 760px;

    margin: 0 auto;

    color: #667085;

    font-size: 16px;

    line-height: 1.8;
}


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

.media-reputation-grid {

    display: grid;

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

    gap: 22px;

    max-width: 1050px;

    margin: 0 auto;
}


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

.media-reputation-card {

    position: relative;

    min-height: 245px;

    padding: 32px 32px 30px;

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

    border:
        1px solid
        #e7dfca;

    border-radius: 15px;

    overflow: hidden;

    box-shadow:
        0 10px 30px
        rgba(0, 0, 0, 0.045);

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


/* =====================================================
   GOLD TOP ACCENT
====================================================== */

.media-reputation-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 55px;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a
        );

    transition:
        width 0.35s ease;
}


.media-reputation-card:hover::before {

    width: 100%;
}


/* =====================================================
   DECORATIVE CIRCLE
====================================================== */

.media-reputation-card::after {

    content: "";

    position: absolute;

    width: 150px;
    height: 150px;

    right: -80px;
    bottom: -80px;

    border-radius: 50%;

    border:
        1px solid
        rgba(201, 164, 65, 0.16);

    pointer-events: none;
}


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

.media-reputation-card:hover {

    transform:
        translateY(-7px);

    border-color:
        #c9a441;

    box-shadow:
        0 20px 45px
        rgba(0, 0, 0, 0.10);
}


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

.media-reputation-number {

    position: absolute;

    top: 24px;
    right: 27px;

    color:
        rgba(201, 164, 65, 0.22);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 42px;

    line-height: 1;

    font-weight: 700;
}


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

.media-reputation-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 55px;
    height: 55px;

    margin-bottom: 22px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #160507,
            #310a10
        );

    border:
        1px solid
        #c9a441;

    color:
        #d5b65a;

    font-size: 19px;

    box-shadow:
        0 8px 20px
        rgba(0, 0, 0, 0.12);
}


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

.media-reputation-card h3 {

    position: relative;

    margin: 0 0 12px;

    color: #171717;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 24px;

    line-height: 1.2;

    font-weight: 700;
}


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

.media-reputation-card p {

    position: relative;

    max-width: 440px;

    margin: 0;

    color: #667085;

    font-size: 15px;

    line-height: 1.65;
}


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

@media (max-width: 800px) {

    .media-reputation {

        padding:
            85px 0 95px;
    }


    .media-reputation-header {

        margin-bottom: 50px;
    }


    .media-reputation-grid {

        grid-template-columns: 1fr;

        max-width: 650px;
    }

}


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

@media (max-width: 600px) {

    .media-reputation {

        padding:
            70px 0 80px;
    }


    .media-reputation-container {

        padding:
            0 18px;
    }


    .media-reputation-header h2 {

        font-size: 36px;
    }


    .media-reputation-header p {

        font-size: 15px;

        line-height: 1.7;
    }


    .media-reputation-card {

        min-height: auto;

        padding:
            28px 25px;
    }


    .media-reputation-card h3 {

        font-size: 22px;
    }


    .media-reputation-card p {

        font-size: 14.5px;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   REQUEST AN INTERVIEW CTA
====================================================== */

.media-interview-cta {

    position: relative;

    padding: 90px 0;

    background:
        linear-gradient(
            120deg,
            #160507 0%,
            #23080d 48%,
            #100304 100%
        );

    overflow: hidden;
}


/* =====================================================
   DECORATIVE GOLD GLOW
====================================================== */

.media-interview-cta::before {

    content: "";

    position: absolute;

    width: 420px;
    height: 420px;

    top: -250px;
    right: -120px;

    border-radius: 50%;

    border:
        1px solid
        rgba(201, 164, 65, 0.22);

    box-shadow:
        0 0 80px
        rgba(201, 164, 65, 0.08);

    pointer-events: none;
}


.media-interview-cta::after {

    content: "";

    position: absolute;

    width: 280px;
    height: 280px;

    bottom: -190px;
    left: -120px;

    border-radius: 50%;

    border:
        1px solid
        rgba(201, 164, 65, 0.12);

    pointer-events: none;
}


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

.media-interview-cta-container {

    position: relative;

    z-index: 2;

    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;

    display: grid;

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

    gap: 70px;

    align-items: center;
}


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

.media-interview-cta-content {

    max-width: 850px;
}


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

.media-interview-cta-label {

    display: inline-block;

    margin-bottom: 20px;

    color: #d5b65a;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 3.5px;

    text-transform: uppercase;
}


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

.media-interview-cta-content h2 {

    margin: 0 0 25px;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(38px, 4.2vw, 58px);

    line-height: 1.08;

    font-weight: 700;
}


.media-interview-cta-content h2 span {

    display: block;

    color: #d5b65a;
}


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

.media-interview-cta-content p {

    max-width: 800px;

    margin: 0 0 32px;

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

    font-size: 16px;

    line-height: 1.8;
}


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

.media-interview-cta-button {

    display: inline-flex;

    align-items: center;

    gap: 13px;

    padding:
        15px 25px;

    border-radius: 50px;

    background:
        linear-gradient(
            135deg,
            #c9a441,
            #e0c56d
        );

    color: #160507;

    font-size: 15px;

    font-weight: 700;

    text-decoration: none;

    box-shadow:
        0 10px 25px
        rgba(0,0,0,0.25);

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


.media-interview-cta-button i {

    font-size: 13px;

    transition:
        transform 0.3s ease;
}


.media-interview-cta-button:hover {

    transform:
        translateY(-3px);

    box-shadow:
        0 15px 32px
        rgba(0,0,0,0.35);
}


.media-interview-cta-button:hover i {

    transform:
        translateX(4px);
}


/* =====================================================
   SIDE PANEL
====================================================== */

.media-interview-cta-side {

    position: relative;

    padding-left: 38px;

    border-left:
        1px solid
        rgba(201,164,65,0.45);
}


/* =====================================================
   SIDE MARK
====================================================== */

.media-interview-cta-mark {

    display: flex;

    flex-direction: column;

    gap: 7px;

    margin-bottom: 25px;
}


.media-interview-cta-mark span {

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

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 3px;
}


.media-interview-cta-mark span:first-child {

    color: #d5b65a;
}


/* =====================================================
   GOLD LINE
====================================================== */

.media-interview-cta-line {

    width: 65px;

    height: 2px;

    margin-bottom: 22px;

    background:
        linear-gradient(
            90deg,
            #c9a441,
            transparent
        );
}


/* =====================================================
   SIDE TEXT
====================================================== */

.media-interview-cta-side p {

    margin: 0;

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

    font-size: 14px;

    line-height: 1.8;
}


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

@media (max-width: 850px) {

    .media-interview-cta {

        padding: 75px 0;
    }


    .media-interview-cta-container {

        grid-template-columns: 1fr;

        gap: 45px;
    }


    .media-interview-cta-side {

        padding-left: 0;

        padding-top: 28px;

        border-left: none;

        border-top:
            1px solid
            rgba(201,164,65,0.35);
    }


    .media-interview-cta-mark {

        flex-direction: row;

        flex-wrap: wrap;

        gap: 8px 20px;
    }

}


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

@media (max-width: 600px) {

    .media-interview-cta {

        padding:
            65px 0;
    }


    .media-interview-cta-container {

        padding:
            0 18px;
    }


    .media-interview-cta-content h2 {

        font-size: 36px;

        line-height: 1.12;
    }


    .media-interview-cta-content p {

        font-size: 15px;

        line-height: 1.7;
    }


    .media-interview-cta-button {

        padding:
            14px 22px;

        font-size: 14px;
    }


    .media-interview-cta-side {

        padding-top: 25px;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   PUBLIC AWARENESS / CLOSING SECTION
====================================================== */

.media-awareness {

    position: relative;

    padding: 105px 0 110px;

    background: #ffffff;

    overflow: hidden;
}


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

.media-awareness::before {

    content: "";

    position: absolute;

    width: 360px;
    height: 360px;

    right: -180px;
    top: 50%;

    transform: translateY(-50%);

    border-radius: 50%;

    border:
        1px solid
        rgba(201,164,65,0.12);

    pointer-events: none;
}


.media-awareness::after {

    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    left: -90px;
    bottom: -90px;

    border-radius: 50%;

    background:
        rgba(201,164,65,0.035);

    pointer-events: none;
}


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

.media-awareness-container {

    position: relative;

    z-index: 2;

    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;

    display: grid;

    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(320px, 0.65fr);

    gap: 85px;

    align-items: center;
}


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

.media-awareness-content {

    max-width: 760px;
}


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

.media-awareness-label {

    display: inline-block;

    margin-bottom: 20px;

    color: #c9a441;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 3.5px;

    text-transform: uppercase;
}


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

.media-awareness-content h2 {

    margin: 0 0 25px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(38px, 4.3vw, 58px);

    line-height: 1.1;

    font-weight: 700;
}


.media-awareness-content h2 span {

    display: block;

    color: #7d111d;
}


/* =====================================================
   PARAGRAPHS
====================================================== */

.media-awareness-content p {

    max-width: 760px;

    margin: 0 0 17px;

    color: #667085;

    font-size: 16px;

    line-height: 1.8;
}


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

.media-awareness-button {

    display: inline-flex;

    align-items: center;

    gap: 12px;

    margin-top: 14px;

    padding:
        15px 27px;

    border-radius: 50px;

    background:
        linear-gradient(
            135deg,
            #9f1725,
            #b51d2c
        );

    color: #ffffff;

    font-size: 15px;

    font-weight: 700;

    text-decoration: none;

    box-shadow:
        0 10px 25px
        rgba(126,17,29,0.20);

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


.media-awareness-button i {

    font-size: 13px;

    transition:
        transform 0.3s ease;
}


.media-awareness-button:hover {

    transform:
        translateY(-3px);

    box-shadow:
        0 15px 30px
        rgba(126,17,29,0.28);
}


.media-awareness-button:hover i {

    transform:
        translateX(4px);
}


/* =====================================================
   RIGHT VISUAL AREA
====================================================== */

.media-awareness-visual {

    position: relative;

    display: flex;

    justify-content: center;

    align-items: center;

    min-height: 360px;
}


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

.media-awareness-card {

    position: relative;

    width: 100%;

    max-width: 360px;

    min-height: 330px;

    padding: 45px 38px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    background:
        linear-gradient(
            145deg,
            #160507 0%,
            #300a10 100%
        );

    border-radius: 18px;

    border:
        1px solid
        rgba(201,164,65,0.55);

    box-shadow:
        0 25px 55px
        rgba(0,0,0,0.16);

    overflow: hidden;
}


/* =====================================================
   GOLD DECORATIVE BORDER
====================================================== */

.media-awareness-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #e0c56d,
            #8f6d20
        );
}


.media-awareness-card::after {

    content: "";

    position: absolute;

    width: 190px;
    height: 190px;

    right: -95px;
    bottom: -95px;

    border-radius: 50%;

    border:
        1px solid
        rgba(201,164,65,0.18);
}


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

.media-awareness-icon {

    width: 62px;
    height: 62px;

    display: flex;

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

    margin-bottom: 25px;

    border-radius: 50%;

    background:
        rgba(201,164,65,0.10);

    border:
        1px solid
        rgba(201,164,65,0.65);

    color: #d5b65a;

    font-size: 22px;
}


/* =====================================================
   SMALL LABEL
====================================================== */

.media-awareness-small {

    margin-bottom: 13px;

    color: #d5b65a;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 3px;
}


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

.media-awareness-card h3 {

    margin: 0;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 32px;

    line-height: 1.15;

    font-weight: 700;
}


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

.media-awareness-divider {

    width: 65px;

    height: 2px;

    margin: 25px 0 20px;

    background:
        linear-gradient(
            90deg,
            #c9a441,
            transparent
        );
}


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

.media-awareness-card p {

    max-width: 270px;

    margin: 0;

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

    font-size: 13px;

    line-height: 1.7;
}


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

@media (max-width: 850px) {

    .media-awareness {

        padding:
            80px 0 90px;
    }


    .media-awareness-container {

        grid-template-columns: 1fr;

        gap: 55px;
    }


    .media-awareness-content {

        max-width: 850px;
    }


    .media-awareness-visual {

        min-height: auto;
    }

}


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

@media (max-width: 600px) {

    .media-awareness {

        padding:
            65px 0 75px;
    }


    .media-awareness-container {

        padding:
            0 18px;
    }


    .media-awareness-content h2 {

        font-size: 36px;

        line-height: 1.12;
    }


    .media-awareness-content p {

        font-size: 15px;

        line-height: 1.7;
    }


    .media-awareness-card {

        min-height: 300px;

        padding:
            38px 30px;
    }


    .media-awareness-card h3 {

        font-size: 29px;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   EXPLORE MORE / NAVIGATION
====================================================== */

.media-explore {

    position: relative;

    padding: 105px 0 115px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fcfbf8 100%
        );

    overflow: hidden;
}


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

.media-explore::before {

    content: "";

    position: absolute;

    width: 360px;
    height: 360px;

    left: -180px;
    top: 45%;

    border-radius: 50%;

    border:
        1px solid
        rgba(201,164,65,0.12);

    pointer-events: none;
}


.media-explore::after {

    content: "";

    position: absolute;

    width: 220px;
    height: 220px;

    right: -110px;
    bottom: -110px;

    border-radius: 50%;

    background:
        rgba(201,164,65,0.035);

    pointer-events: none;
}


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

.media-explore-container {

    position: relative;

    z-index: 2;

    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;
}


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

.media-explore-intro {

    max-width: 850px;

    margin: 0 auto 65px;

    text-align: center;
}


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

.media-explore-label {

    display: inline-block;

    margin-bottom: 18px;

    color: #c9a441;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 4px;

    text-transform: uppercase;
}


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

.media-explore-intro h2 {

    margin: 0 0 25px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(38px, 4.2vw, 58px);

    line-height: 1.1;

    font-weight: 700;
}


.media-explore-intro h2 span {

    display: block;

    color: #7d111d;
}


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

.media-explore-intro p {

    max-width: 800px;

    margin: 0 auto;

    color: #667085;

    font-size: 16px;

    line-height: 1.8;
}


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

.media-explore-grid {

    display: grid;

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

    gap: 24px;
}


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

.media-explore-card {

    position: relative;

    min-height: 320px;

    padding: 35px 32px 30px;

    background: #ffffff;

    border:
        1px solid
        #e7dfca;

    border-radius: 15px;

    text-decoration: none;

    overflow: hidden;

    box-shadow:
        0 10px 30px
        rgba(0,0,0,0.045);

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


/* =====================================================
   GOLD TOP LINE
====================================================== */

.media-explore-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8f6d20,
            #d5b65a,
            #8f6d20
        );

    transform:
        scaleX(0.25);

    transform-origin: left;

    transition:
        transform 0.35s ease;
}


/* =====================================================
   DECORATIVE CIRCLE
====================================================== */

.media-explore-card::after {

    content: "";

    position: absolute;

    width: 140px;
    height: 140px;

    right: -70px;
    bottom: -70px;

    border-radius: 50%;

    border:
        1px solid
        rgba(201,164,65,0.16);

    pointer-events: none;
}


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

.media-explore-card:hover {

    transform:
        translateY(-8px);

    border-color:
        #c9a441;

    box-shadow:
        0 20px 45px
        rgba(0,0,0,0.10);
}


.media-explore-card:hover::before {

    transform:
        scaleX(1);
}


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

.media-explore-icon {

    display: flex;

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

    width: 58px;
    height: 58px;

    margin-bottom: 25px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #160507,
            #310a10
        );

    border:
        1px solid
        #c9a441;

    color: #d5b65a;

    font-size: 20px;

    box-shadow:
        0 8px 20px
        rgba(0,0,0,0.10);
}


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

.media-explore-number {

    position: absolute;

    top: 27px;
    right: 28px;

    color:
        rgba(201,164,65,0.20);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 40px;

    font-weight: 700;

    line-height: 1;
}


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

.media-explore-card h3 {

    margin: 0 0 14px;

    color: #171717;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 24px;

    line-height: 1.2;

    font-weight: 700;
}


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

.media-explore-card p {

    margin: 0 0 25px;

    color: #667085;

    font-size: 15px;

    line-height: 1.65;
}


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

.media-explore-link {

    display: inline-flex;

    align-items: center;

    gap: 9px;

    color: #8f6d20;

    font-size: 14px;

    font-weight: 700;

    transition:
        color 0.3s ease;
}


.media-explore-link i {

    font-size: 12px;

    transition:
        transform 0.3s ease;
}


.media-explore-card:hover
.media-explore-link {

    color: #7d111d;
}


.media-explore-card:hover
.media-explore-link i {

    transform:
        translateX(4px);
}


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

@media (max-width: 900px) {

    .media-explore {

        padding:
            80px 0 90px;
    }


    .media-explore-grid {

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


    .media-explore-card:last-child {

        grid-column:
            1 / -1;

        max-width:
            calc(50% - 10px);

        margin: 0 auto;

        width: 100%;
    }

}


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

@media (max-width: 600px) {

    .media-explore {

        padding:
            65px 0 75px;
    }


    .media-explore-container {

        padding:
            0 18px;
    }


    .media-explore-intro {

        margin-bottom: 45px;
    }


    .media-explore-intro h2 {

        font-size: 36px;

        line-height: 1.12;
    }


    .media-explore-intro p {

        font-size: 15px;

        line-height: 1.7;
    }


    .media-explore-grid {

        grid-template-columns: 1fr;

        gap: 18px;
    }


    .media-explore-card {

        min-height: auto;

        padding:
            30px 26px;
    }


    .media-explore-card:last-child {

        grid-column: auto;

        max-width: none;

        margin: 0;
    }

}

/* =====================================================
   REDSPY MEDIA CENTRE
   OFFICIAL YOUTUBE CHANNELS
====================================================== */

.youtube-channels {

    position: relative;

    padding: 110px 0 120px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfaf7 100%
        );

    overflow: hidden;
}


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

.youtube-channels::before {

    content: "";

    position: absolute;

    width: 430px;
    height: 430px;

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

    border-radius: 50%;

    border:
        1px solid
        rgba(201,164,65,0.10);

    pointer-events: none;
}


.youtube-channels::after {

    content: "";

    position: absolute;

    width: 260px;
    height: 260px;

    left: -130px;
    bottom: -130px;

    border-radius: 50%;

    background:
        rgba(125,17,29,0.025);

    pointer-events: none;
}


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

.youtube-container {

    position: relative;

    z-index: 2;

    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;
}


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

.youtube-intro {

    max-width: 820px;

    margin: 0 auto 65px;

    text-align: center;
}


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

.youtube-label {

    display: inline-block;

    margin-bottom: 18px;

    color: #c9a441;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 4px;

    text-transform: uppercase;
}


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

.youtube-intro h2 {

    margin: 0 0 25px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(40px, 4.5vw, 60px);

    line-height: 1.08;

    font-weight: 700;
}


.youtube-intro h2 span {

    display: block;

    color: #7d111d;
}


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

.youtube-intro p {

    max-width: 800px;

    margin: 0 auto;

    color: #667085;

    font-size: 16px;

    line-height: 1.8;
}


/* =====================================================
   TWO COLUMN GRID
====================================================== */

.youtube-grid {

    display: grid;

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

    gap: 28px;

    max-width: 1000px;

    margin: 0 auto;
}


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

.youtube-card {

    position: relative;

    min-height: 360px;

    padding: 36px;

    background: #ffffff;

    border:
        1px solid
        #e4dcc8;

    border-radius: 16px;

    overflow: hidden;

    box-shadow:
        0 12px 35px
        rgba(0,0,0,0.055);

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


/* =====================================================
   GOLD TOP BORDER
====================================================== */

.youtube-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8d6a1d,
            #d8b85d,
            #8d6a1d
        );

    transform:
        scaleX(0.20);

    transform-origin: left;

    transition:
        transform 0.4s ease;
}


/* =====================================================
   DECORATIVE GOLD CIRCLE
====================================================== */

.youtube-card::after {

    content: "";

    position: absolute;

    width: 190px;
    height: 190px;

    right: -100px;
    bottom: -100px;

    border-radius: 50%;

    border:
        1px solid
        rgba(201,164,65,0.15);

    pointer-events: none;
}


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

.youtube-card:hover {

    transform:
        translateY(-9px);

    border-color:
        #c9a441;

    box-shadow:
        0 22px 50px
        rgba(0,0,0,0.11);
}


.youtube-card:hover::before {

    transform:
        scaleX(1);
}


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

.youtube-card-top {

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    margin-bottom: 30px;
}


/* =====================================================
   YOUTUBE ICON
====================================================== */

.youtube-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 64px;
    height: 64px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #170508,
            #3a0a12
        );

    border:
        1px solid
        #c9a441;

    color: #d5b65a;

    font-size: 25px;

    box-shadow:
        0 10px 24px
        rgba(0,0,0,0.12);

    transition:
        transform 0.35s ease;
}


.youtube-card:hover .youtube-icon {

    transform:
        scale(1.08)
        rotate(-3deg);
}


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

.youtube-channel-number {

    color:
        rgba(201,164,65,0.22);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 42px;

    font-weight: 700;

    line-height: 1;
}


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

.youtube-card-label {

    display: block;

    margin-bottom: 10px;

    color: #b28a29;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 2.5px;

    text-transform: uppercase;
}


/* =====================================================
   CHANNEL NAME
====================================================== */

.youtube-card h3 {

    margin: 0 0 15px;

    color: #151515;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 30px;

    line-height: 1.15;

    text-transform: none;
}


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

.youtube-card p {

    max-width: 430px;

    margin: 0 0 28px;

    color: #667085;

    font-size: 15px;

    line-height: 1.7;
}


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

.youtube-button {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    padding:
        13px 22px;

    border-radius: 30px;

    background:
        #7d111d;

    color: #ffffff;

    font-size: 14px;

    font-weight: 700;

    text-decoration: none;

    box-shadow:
        0 7px 18px
        rgba(125,17,29,0.18);

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


.youtube-button i {

    font-size: 11px;

    transition:
        transform 0.3s ease;
}


.youtube-button:hover {

    background:
        #5f0c15;

    transform:
        translateY(-2px);

    box-shadow:
        0 10px 24px
        rgba(125,17,29,0.25);
}


.youtube-button:hover i {

    transform:
        translateX(4px);
}


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

@media (max-width: 800px) {

    .youtube-channels {

        padding:
            85px 0 95px;
    }


    .youtube-grid {

        gap: 20px;
    }


    .youtube-card {

        padding: 30px;

        min-height: 350px;
    }

}


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

@media (max-width: 650px) {

    .youtube-channels {

        padding:
            70px 0 80px;
    }


    .youtube-container {

        padding:
            0 18px;
    }


    .youtube-intro {

        margin-bottom: 45px;
    }


    .youtube-intro h2 {

        font-size: 36px;

        line-height: 1.12;
    }


    .youtube-intro p {

        font-size: 15px;

        line-height: 1.7;
    }


    .youtube-grid {

        grid-template-columns: 1fr;

        gap: 18px;
    }


    .youtube-card {

        min-height: auto;

        padding: 28px 25px;
    }


    .youtube-card h3 {

        font-size: 27px;
    }


    .youtube-channel-number {

        font-size: 36px;
    }

}

/* =====================================================
   RELATED SERVICES
====================================================== */

.related-services {

    position: relative;

    padding: 110px 0 120px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #faf9f6 100%
        );

    overflow: hidden;
}


/* Decorative background */

.related-services::before {

    content: "";

    position: absolute;

    width: 420px;
    height: 420px;

    top: -210px;
    left: -210px;

    border-radius: 50%;

    border:
        1px solid
        rgba(201,164,65,0.10);

    pointer-events: none;
}


.related-services-container {

    position: relative;

    z-index: 2;

    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;
}


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

.related-services-intro {

    max-width: 800px;

    margin: 0 auto 65px;

    text-align: center;
}


.related-services-label {

    display: inline-block;

    margin-bottom: 18px;

    color: #c9a441;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 4px;

    text-transform: uppercase;
}


.related-services-intro h2 {

    margin: 0;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(40px, 4.5vw, 58px);

    line-height: 1.08;

    font-weight: 700;
}


.related-services-intro h2 span {

    display: block;

    color: #7d111d;
}


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

.related-services-grid {

    display: grid;

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

    gap: 24px;

    max-width: 1080px;

    margin: 0 auto;
}


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

.related-service-card {

    position: relative;

    display: flex;

    gap: 22px;

    min-height: 230px;

    padding: 30px;

    background: #ffffff;

    border:
        1px solid
        #e5ddca;

    border-radius: 15px;

    text-decoration: none;

    overflow: hidden;

    box-shadow:
        0 10px 30px
        rgba(0,0,0,0.045);

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


/* Gold top accent */

.related-service-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 55px;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #8c691d,
            #d9b85b
        );

    transition:
        width 0.35s ease;
}


/* Decorative number */

.related-service-number {

    position: absolute;

    top: 20px;

    right: 24px;

    color:
        rgba(201,164,65,0.18);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 30px;

    font-weight: 700;
}


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

.related-service-card:hover {

    transform:
        translateY(-8px);

    border-color:
        #c9a441;

    box-shadow:
        0 20px 45px
        rgba(0,0,0,0.10);
}


.related-service-card:hover::before {

    width: 100%;
}


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

.related-service-icon {

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 54px;
    height: 54px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #27070b,
            #480d16
        );

    border:
        1px solid
        #c9a441;

    color:
        #d8b85c;

    font-size: 19px;

    box-shadow:
        0 8px 18px
        rgba(0,0,0,0.10);

    transition:
        transform 0.35s ease;
}


.related-service-card:hover
.related-service-icon {

    transform:
        scale(1.08)
        rotate(-3deg);
}


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

.related-service-content {

    position: relative;

    padding-top: 3px;

    flex: 1;
}


.related-service-content h3 {

    margin: 0 0 12px;

    color: #171717;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 22px;

    line-height: 1.2;
}


.related-service-content p {

    margin: 0 0 20px;

    color: #667085;

    font-size: 14px;

    line-height: 1.65;
}


/* =====================================================
   EXPLORE LINK
====================================================== */

.related-service-link {

    display: inline-flex;

    align-items: center;

    gap: 8px;

    color:
        #7d111d;

    font-size: 13px;

    font-weight: 700;

    transition:
        color 0.3s ease;
}


.related-service-link i {

    font-size: 10px;

    transition:
        transform 0.3s ease;
}


.related-service-card:hover
.related-service-link {

    color:
        #a98427;
}


.related-service-card:hover
.related-service-link i {

    transform:
        translateX(5px);
}


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

@media (max-width: 950px) {

    .related-services-grid {

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

    }

}


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

@media (max-width: 650px) {

    .related-services {

        padding:
            75px 0 85px;
    }


    .related-services-container {

        padding:
            0 18px;
    }


    .related-services-intro {

        margin-bottom: 45px;
    }


    .related-services-intro h2 {

        font-size: 36px;

        line-height: 1.12;
    }


    .related-services-grid {

        grid-template-columns: 1fr;

        gap: 18px;
    }


    .related-service-card {

        min-height: auto;

        padding: 26px 24px;
    }


    .related-service-content h3 {

        font-size: 21px;
    }

}

/* =====================================================
   KNOWLEDGE SHARING FEATURE
====================================================== */

.knowledge-feature {

    position: relative;

    padding: 115px 0 125px;

    background:
        linear-gradient(
            135deg,
            #fbfaf7 0%,
            #ffffff 55%,
            #faf8f3 100%
        );

    overflow: hidden;
}


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

.knowledge-feature::before {

    content: "";

    position: absolute;

    width: 500px;
    height: 500px;

    left: -260px;
    top: -180px;

    border-radius: 50%;

    border:
        1px solid
        rgba(201,164,65,0.10);

    pointer-events: none;
}


.knowledge-feature::after {

    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    right: -150px;
    bottom: -150px;

    border-radius: 50%;

    background:
        rgba(125,17,29,0.025);

    pointer-events: none;
}


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

.knowledge-feature-container {

    position: relative;

    z-index: 2;

    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;

    display: grid;

    grid-template-columns:
        0.92fr 1.08fr;

    gap: 70px;

    align-items: center;
}


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

.knowledge-feature-content {

    position: relative;
}


/* =====================================================
   QUOTE MARK
====================================================== */

.knowledge-quote-mark {

    color:
        #c9a441;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 76px;

    line-height: 0.55;

    height: 35px;

    margin-bottom: 20px;
}


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

.knowledge-feature-content h2 {

    margin: 0 0 24px;

    color: #111111;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(38px, 4vw, 54px);

    line-height: 1.08;

    font-weight: 700;
}


.knowledge-feature-content h2 span {

    display: block;

    color:
        #7d111d;
}


/* =====================================================
   PARAGRAPH
====================================================== */

.knowledge-feature-content > p {

    margin: 0;

    max-width: 560px;

    color:
        #667085;

    font-size: 16px;

    line-height: 1.85;
}


/* =====================================================
   FEATURE POINTS
====================================================== */

.knowledge-feature-points {

    display: flex;

    flex-direction: column;

    gap: 13px;

    margin-top: 30px;
}


.knowledge-point {

    display: flex;

    align-items: center;

    gap: 12px;

    color:
        #2b2b2b;

    font-size: 14px;

    font-weight: 600;
}


.knowledge-point i {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 22px;
    height: 22px;

    border-radius: 50%;

    background:
        #7d111d;

    color:
        #ffffff;

    font-size: 9px;
}


/* =====================================================
   VIDEO SIDE
====================================================== */

.knowledge-feature-video {

    position: relative;
}


/* =====================================================
   VIDEO FRAME
====================================================== */

.knowledge-video-frame {

    position: relative;

    width: 100%;

    aspect-ratio: 16 / 9;

    overflow: hidden;

    border-radius: 14px;

    background:
        #100609;

    border:
        1px solid
        rgba(201,164,65,0.45);

    box-shadow:
        0 25px 60px
        rgba(0,0,0,0.16);
}


/* Gold frame */

.knowledge-video-frame::before {

    content: "";

    position: absolute;

    inset: 0;

    border:
        1px solid
        rgba(216,184,92,0.30);

    border-radius: 14px;

    z-index: 2;

    pointer-events: none;
}


.knowledge-video-frame iframe {

    width: 100%;

    height: 100%;

    display: block;

    border: 0;
}


/* =====================================================
   VIDEO CAPTION
====================================================== */

.knowledge-video-caption {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    margin-top: 18px;

    padding:
        0 4px;
}


.knowledge-video-caption span {

    color:
        #b28a29;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 2.5px;

    white-space: nowrap;
}


.knowledge-video-caption strong {

    color:
        #222222;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 16px;

    font-weight: 700;

    text-align: right;
}


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

@media (max-width: 900px) {

    .knowledge-feature {

        padding:
            90px 0 100px;
    }


    .knowledge-feature-container {

        grid-template-columns: 1fr;

        gap: 50px;

        max-width: 850px;
    }


    .knowledge-feature-content {

        max-width: 720px;

        margin: 0 auto;

        text-align: center;
    }


    .knowledge-feature-content > p {

        margin-left: auto;

        margin-right: auto;
    }


    .knowledge-feature-points {

        align-items: center;
    }


    .knowledge-feature-video {

        max-width: 760px;

        width: 100%;

        margin: 0 auto;
    }

}


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

@media (max-width: 600px) {

    .knowledge-feature {

        padding:
            75px 0 85px;
    }


    .knowledge-feature-container {

        padding:
            0 18px;

        gap: 40px;
    }


    .knowledge-quote-mark {

        font-size: 62px;

        margin-bottom: 12px;
    }


    .knowledge-feature-content h2 {

        font-size: 35px;

        line-height: 1.12;
    }


    .knowledge-feature-content > p {

        font-size: 15px;

        line-height: 1.75;
    }


    .knowledge-feature-points {

        align-items: flex-start;

        text-align: left;
    }


    .knowledge-video-caption {

        flex-direction: column;

        align-items: flex-start;

        gap: 7px;
    }


    .knowledge-video-caption strong {

        text-align: left;

        font-size: 15px;
    }

}