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

:root {

    --rit-blue: #2e4a7d;
    --rit-sky-blue: #c8c6e8;
    --rit-dark-blue: #061a40;
    --rit-red: #ed202d;
    --rit-orange: #f39b23;

    --white: #ffffff;
    --text-dark: #17233d;

    --transition: all .35s ease;

}


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

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

html {
    scroll-behavior: smooth;
}

body {

    font-family: 'Poppins', sans-serif;

    color: var(--text-dark);

    overflow-x: hidden;

}

a {
    text-decoration: none;
}


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

.topbar {

position: relative;

top: 0;

left: 0;

width: 100%;

z-index: 100;

padding: 7px 0;

background: var(--rit-blue);

backdrop-filter: blur(5px);

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

.topbar-inner {

    display: flex;

    justify-content: space-between;

    align-items: center;

    color: #f5eee4;

    font-size: 13px;

    font-weight: 500;

}

.topbar-left {

    display: flex;

    align-items: center;

    gap: 30px;

}

.topbar-left a,
.topbar-left span {

color: #ffffff;

white-space: nowrap;
}

.topbar-left i,
.counselling-code i {

    color: var(--rit-sky-blue);

    margin-right: 7px;
}

.counselling-code {

    color: #ffffff;
}

.counselling-code strong {

    color: var(--rit-sky-blue);
}


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

.main-header {

position: absolute;

top: 52px;

left: 0;

width: 100%;

z-index: 99;

padding: 0;
}

.rit-navbar {

min-height: 72px;

border-radius: 0;
}


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

.rit-logo {

    display: flex;

    align-items: center;

    gap: 12px;

    min-width: 245px;

}

.rit-logo img {

width: 330px;

height: auto;

background: rgb(255 255 255 / 50%);

border-radius: 5px;
}

.logo-text {

    display: flex;

    flex-direction: column;

    line-height: 1.05;

}

.logo-text span {

    color: #eeeeee;

    font-size: 16px;

    font-weight: 700;

    letter-spacing: .5px;

}

.logo-text small {

    color: #c7a767;

    font-size: 12px;

    font-weight: 600;

    letter-spacing: 1px;

}


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

.rit-navbar .nav-link {

color: var(--rit-blue);

font-size: 13px;

font-weight: 600;

padding: 15px 13px !important;

transition: var(--transition);

white-space: nowrap;
}

.rit-navbar .nav-link:hover,
.rit-navbar .nav-link.active {

color: var(--rit-blue);
}

.rit-navbar .dropdown-toggle::after {

font-size: 14px;

margin-left: 2px;

vertical-align: 2px;
}

.dropdown-menu {

    min-width: 210px;

    padding: 8px;

    margin-top: 8px !important;

    background: var(--rit-blue);

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

    border-radius: 12px;

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

.dropdown-item {

    color: #d9dce4;

    font-size: 13px;

    padding: 3px 3px;

    border-radius: 7px;

    transition: var(--transition);
}

.dropdown-item:hover {

    color: var(--rit-blue);

    background: var(--rit-sky-blue);
}

/* =========================================================
   DESKTOP - 3 LEVEL HOVER
========================================================= */

@media (min-width: 1200px) {

    .hover-dropdown {
        position: relative;
    }

    .hover-dropdown:hover>.dropdown-menu {
        display: block;
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .hover-dropdown>.dropdown-menu {
        display: block;
        opacity: 0;
        visibility: hidden;
        transform: translateY(10px);

        transition:
            opacity .25s ease,
            transform .25s ease,
            visibility .25s ease;

        margin-top: 0 !important;
    }


    /* Level 2 */

    .dropdown-submenu {
        position: relative;
    }

    .dropdown-submenu>.dropdown-menu {

        top: -8px;
        left: 100%;

        margin-left: 5px;

        display: block;

        opacity: 0;
        visibility: hidden;

        transform: translateX(10px);

        transition:
            opacity .25s ease,
            transform .25s ease,
            visibility .25s ease;
    }

    .dropdown-submenu:hover>.dropdown-menu {

        opacity: 1;
        visibility: visible;

        transform: translateX(0);

    }


    /* Arrow */

    .dropdown-submenu>.dropdown-item {

        display: flex;

        align-items: center;

        justify-content: space-between;

        gap: 15px;

    }

    .dropdown-submenu>.dropdown-item i {

        font-size: 9px;

        transition: transform .25s ease;

    }

    .dropdown-submenu:hover>.dropdown-item i {

        transform: translateX(3px);

    }

}


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

@media (max-width: 1199px) {

    /* Main navigation */

    .navbar-collapse {

        max-height: calc(100vh - 130px);

        overflow-y: auto;

        overflow-x: hidden;

    }


    /* All dropdown menus */

    .rit-navbar .dropdown-menu {

        position: static !important;

        width: 100%;

        margin: 0 !important;

        padding: 0 0 0 15px;

        display: none;

        opacity: 1;

        visibility: visible;

        transform: none !important;

        background: transparent;

        border: 0;

        box-shadow: none;

    }


    /* Open submenu */

    .rit-navbar .dropdown-menu.show {

        display: block;

    }


    /* Dropdown item */

    .rit-navbar .dropdown-menu .dropdown-item {

        display: flex;

        align-items: center;

        justify-content: space-between;

        width: 100%;

        padding: 11px 12px;

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

        background: transparent;

        border-radius: 6px;

        font-size: 12px;

    }


    .rit-navbar .dropdown-menu .dropdown-item:hover {

        color: #fff;

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

    }


    /* Nested submenu */

    .rit-navbar .dropdown-submenu {

        position: relative;

    }


    .rit-navbar .dropdown-submenu>.dropdown-menu {

        position: static !important;

        padding-left: 15px;

        margin: 0 !important;

    }


    /* Arrow */

    .rit-navbar .dropdown-submenu>.dropdown-item i {

        font-size: 9px;

        transition: transform .25s ease;

    }


    /* Rotate arrow when open */

    .rit-navbar .dropdown-submenu.open>.dropdown-item i {

        transform: rotate(90deg);

    }


    /* Main dropdown arrow */

    .rit-navbar .nav-item.dropdown>.nav-link::after {

        transition: transform .25s ease;

    }


    .rit-navbar .nav-item.dropdown.open>.nav-link::after {

        transform: rotate(180deg);

    }

}

.navbar-collapse .navbar-nav {
    background: rgb(255 255 255 / 50%);
    border-radius: 5px;
}

@media (min-width: 1200px) {

    .navbar-nav>.nav-item:last-child .dropdown-menu .dropdown-submenu>.dropdown-menu {

        left: auto;

        right: 100%;

        margin-left: 0;

        margin-right: 5px;

        transform: translateX(-10px);

    }


    .navbar-nav>.nav-item:last-child .dropdown-submenu:hover>.dropdown-menu {

        transform: translateX(0);

    }

}


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

.hero-section {

position: relative;

width: 100%;

top: 0;

overflow: hidden;
}

.heroSwiper,
.hero-slide {

    width: 100%;

    height: 100%;

}

.hero-slide {

    position: relative;

    display: flex;

    align-items: center;

    background-size: cover;

    background-position: center;

}


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

.hero-overlay {

    position: absolute;

    inset: 0;

    background:

        linear-gradient(90deg,
            rgba(255, 255, 255, .96) 0%,
            rgba(255, 255, 255, .82) 27%,
            rgba(255, 255, 255, .25) 53%,
            rgba(0, 0, 0, .04) 100%);

}


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

.hero-content {

    position: relative;

    z-index: 5;

    width: 700px;

    max-width: 55%;

    padding-top: 70px;

}

.autonomous-label {

    display: flex;

    align-items: center;

    gap: 15px;

    margin-bottom: 20px;

}

.autonomous-label span {

    display: block;

    width: 38px;

    height: 2px;

    background: #db7517;

}

.autonomous-label div {

    padding: 6px 17px;

    border: 1px solid #e07b17;

    border-radius: 9px;

    color: #4b3424;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 1px;

}


/* =========================================================
   ACCREDITATION
========================================================= */

.accreditation {

    display: flex;

    align-items: center;

    gap: 20px;

    margin-bottom: 25px;

}

.accreditation-item {

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 8px;

}

.accreditation-item strong {

    color: #483529;

    font-size: 11px;

    font-weight: 700;

}

.accreditation-divider {

    height: 70px;

    width: 1px;

    background: rgba(87, 64, 46, .4);

}

.naac-badge {

    width: 80px;

    height: 55px;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 30px;

    font-weight: 800;

    color: #fff;

    background:
        linear-gradient(135deg,
            #b89d28,
            #6e5317);

    clip-path: polygon(50% 0,
            94% 25%,
            82% 82%,
            50% 100%,
            18% 82%,
            6% 25%);

}

.nba-text {

    font-size: 43px;

    line-height: 1;

    font-weight: 700;

    color: #35b8c4;

    letter-spacing: -4px;

}


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

.hero-content h1 {

    margin: 0 0 22px;

    font-family: 'Oswald', sans-serif;

    font-size: clamp(60px, 5vw, 92px);

    line-height: .95;

    font-weight: 700;

    letter-spacing: 1px;

    text-transform: uppercase;

}

.heading-blue,
.heading-red {

    display: block;

}

.heading-blue {

    color: #071e4d;

}

.heading-red {

    color: #ed202d;

}


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

.hero-content p {

    max-width: 700px;

    margin-bottom: 28px;

    color: #0a2857;

    font-size: 17px;

    line-height: 1.9;

    font-weight: 600;

}


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

.hero-buttons {

    display: flex;

    gap: 12px;

}

.btn-primary-custom {

    display: inline-flex;

    align-items: center;

    gap: 12px;

    padding: 13px 23px;

    color: #fff;

    background: var(--rit-blue);

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

    border-radius: 6px;

    font-size: 13px;

    font-weight: 600;

    transition: var(--transition);

}

.btn-primary-custom:hover {

    color: #fff;

    background: var(--rit-red);

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

    transform: translateY(-2px);

}

.btn-outline-custom {

    display: inline-flex;

    align-items: center;

    padding: 13px 23px;

    color: var(--rit-blue);

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

    border-radius: 6px;

    font-size: 13px;

    font-weight: 600;

    transition: var(--transition);

}

.btn-outline-custom:hover {

    color: #fff;

    background: var(--rit-blue);

}


/* =========================================================
   SWIPER
========================================================= */

.swiper-pagination {

    bottom: 30px !important;

    left: 30px !important;

    width: auto !important;

}

.swiper-pagination-bullet {

    width: 9px;

    height: 9px;

    background: #fff;

    opacity: .7;

}

.swiper-pagination-bullet-active {

    width: 30px;

    border-radius: 10px;

    opacity: 1;

    background: var(--rit-red);

}


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

.hero-navigation {

    position: absolute;

    z-index: 20;

    right: 35px;

    bottom: 30px;

    display: flex;

    gap: 8px;

}

.hero-navigation button {

    width: 45px;

    height: 45px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #fff;

    background: rgba(6, 31, 77, .72);

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

    border-radius: 50%;

    transition: var(--transition);

}

.hero-navigation button:hover {

    background: var(--rit-red);

}


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

.quick-section {

    position: relative;

    padding: 50px 0;

    background: #f7f8fa;

}

.quick-card {

    height: 100%;

    display: flex;

    align-items: center;

    gap: 15px;

    padding: 22px;

    background: #fff;

    border-radius: 14px;

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

    transition: var(--transition);

}

.quick-card:hover {

    transform: translateY(-6px);

    box-shadow: 0 15px 35px rgba(0, 0, 0, .10);

}

.quick-icon {

    width: 52px;

    min-width: 52px;

    height: 52px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #fff;

    background: var(--rit-blue);

    border-radius: 12px;

    font-size: 20px;

}

.quick-card h5 {

    margin-bottom: 5px;

    color: var(--rit-blue);

    font-size: 14px;

    font-weight: 700;

}

.quick-card p {

    margin: 0;

    color: #777;

    font-size: 11px;

    line-height: 1.5;

}


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

.navbar-toggler {

    padding: 7px 10px;

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

}

.navbar-toggler:focus {

    box-shadow: none;

}

.navbar-toggler-icon {

    filter: invert(1);

}


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

@media (max-width: 1600px) {

    .rit-navbar .nav-link {

padding-left: 9px !important;

padding-right: 9px !important;

font-size: 14px;

}

    .rit-logo {

        min-width: 280px;

    }

}


@media (max-width: 1399px) {

    .rit-logo {

        min-width: 210px;

    }

    .rit-logo img {

        width: 50px;
        height: 50px;

    }

    .logo-text span {

        font-size: 14px;

    }

    .rit-navbar .nav-link {

        padding-left: 7px !important;
        padding-right: 7px !important;

        font-size: 11px;

    }

    .hero-content {

        max-width: 58%;

    }

}


@media (max-width: 1199px) {

    .main-header {

        top: 48px;

    }

    .rit-navbar {

        border-radius: 14px;

    }

    .navbar-collapse {

        margin-top: 10px;

        padding: 15px;

        background: var(--rit-blue);

        border-radius: 12px;

    }

    .rit-navbar .nav-link {

        padding: 12px !important;

    }

    .hero-content {

        max-width: 65%;

    }

}


@media (max-width: 991px) {

    .topbar-left span {

        display: none;

    }

    .topbar-left {

        gap: 15px;

    }

    .hero-content {

        max-width: 70%;

    }

    .hero-content h1 {

        font-size: 65px;

    }

    .hero-content p {

        font-size: 14px;

    }

}


@media (max-width: 767px) {

    .topbar {

        padding: 9px 0;

    }

    .topbar-inner {

        justify-content: center;

    }

    .topbar-left a {

        font-size: 10px;

    }

    .topbar-left a:nth-child(2) {

        /* display: none; */

    }

    .counselling-code {

        display: none;

    }

    .main-header {

        top: 35px;

        padding: 0 10px;

    }

    .rit-navbar {

        padding: 8px 15px;

    }

    .rit-logo {

        min-width: auto;

    }

    .rit-logo img {

        width: 210px;

        height: auto;

    }

    .logo-text span {

        font-size: 12px;

    }

    .logo-text small {

        font-size: 9px;

    }

    .hero-section {

        min-height: auto;

        height: auto;
    }

    .hero-slide {

        align-items: flex-end;

        padding-bottom: 70px;

        background-position: 65% center;

    }

    .hero-overlay {

        background:

            linear-gradient(90deg,
                rgba(255, 255, 255, .94) 0%,
                rgba(255, 255, 255, .82) 65%,
                rgba(255, 255, 255, .25) 100%);

    }

    .hero-content {

        max-width: 100%;

        width: 100%;

        padding: 0 10px 20px;

    }

    .autonomous-label {

        gap: 8px;

        margin-bottom: 15px;

    }

    .autonomous-label span {

        width: 20px;

    }

    .autonomous-label div {

        font-size: 9px;

        padding: 5px 10px;

    }

    .accreditation {

        margin-bottom: 18px;

    }

    .naac-badge {

        width: 60px;

        height: 42px;

        font-size: 22px;

    }

    .nba-text {

        font-size: 32px;

    }

    .accreditation-item strong {

        font-size: 8px;

    }

    .accreditation-divider {

        height: 55px;

    }

    .hero-content h1 {

        font-size: clamp(43px, 12vw, 65px);

        margin-bottom: 15px;

    }

    .hero-content p {

        font-size: 12px;

        line-height: 1.65;

        max-width: 500px;

        margin-bottom: 18px;

    }

    .hero-buttons {

        flex-wrap: wrap;

    }

    .btn-primary-custom,
    .btn-outline-custom {

        padding: 10px 15px;

        font-size: 11px;

    }

    .hero-navigation {

        right: 15px;

        bottom: 20px;

    }

    .hero-navigation button {

        width: 38px;
        height: 38px;

        font-size: 12px;

    }

    .swiper-pagination {

        bottom: 30px !important;

        left: 15px !important;

    }

    .quick-section {

        padding: 35px 0;

    }

}


@media (max-width: 480px) {

    .topbar-left a {

        font-size: 9px;

    }

    .hero-content h1 {

        font-size: 42px;

    }

    .hero-content p {

        font-size: 11px;

    }

    .accreditation {

        gap: 10px;

    }

    .quick-card {

        padding: 18px;

    }

}

/* =========================================================
   TOP NAV 3 LEVEL MENU
========================================================= */
.topbar-menu .navbar-nav {
    display: flex;
    flex-direction: row;
    gap: 15px;
}

@media (min-width: 1200px) {

    .rit-menu {
        position: relative;
    }


    /* LEVEL 1 */

    .rit-menu>.dropdown-menu {

        display: block;

        position: absolute;

        top: 100%;

        left: 0;

        min-width: 230px;

        margin: 8px 0 0 !important;

        padding: 8px;

        opacity: 0;

        visibility: hidden;

        transform: translateY(12px);

        transition: all .25s ease;

        background: var(--rit-blue);

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

        border-radius: 12px;

        box-shadow: 0 20px 45px rgba(0, 0, 0, .25);

        z-index: 9999;

    }


    /* OPEN LEVEL 1 */

    .rit-menu:hover>.dropdown-menu {

        opacity: 1;

        visibility: visible;

        transform: translateY(0);

    }


    /* LEVEL 2 */

    .rit-menu .has-submenu {

        position: relative;

    }


    .rit-menu .has-submenu>.dropdown-menu {

        display: block;

        position: absolute;

        top: -8px;

        left: calc(100% + 5px);

        min-width: 230px;

        padding: 8px;

        margin: 0 !important;

        opacity: 0;

        visibility: hidden;

        transform: translateX(12px);

        transition: all .25s ease;

        background: rgba(15, 25, 43, .98);

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

        border-radius: 12px;

        box-shadow: 0 20px 45px rgba(0, 0, 0, .25);

        z-index: 10000;

    }


    /* OPEN LEVEL 2 */

    .rit-menu .has-submenu:hover>.dropdown-menu {

        opacity: 1;

        visibility: visible;

        transform: translateX(0);

    }


    /* MENU ITEMS */

    .rit-menu .dropdown-item {

        display: flex;

        align-items: center;

        justify-content: space-between;

        gap: 15px;

        padding: 3px 3px;

        color: #e7e9ee;

        font-size: 12px;

        font-weight: 500;

        border-radius: 7px;

        transition: all .25s ease;

    }


    .rit-menu .dropdown-item:hover {

        color: var(--rit-blue);

        background: var(--rit-sky-blue);

        padding-left: 5px;

    }


    /* ARROW */

    .rit-menu .has-submenu>.dropdown-item i {

        font-size: 8px;

        transition: transform .25s ease;

    }


    .rit-menu .has-submenu:hover>.dropdown-item i {

        transform: translateX(3px);

    }

}

@media (max-width: 1199px) {

    .rit-menu .dropdown-menu {

        position: static !important;

        display: none;

        width: 100%;

        margin: 0 !important;

        padding: 0 0 0 15px;

        background: transparent;

        border: 0;

        box-shadow: none;

        transform: none !important;

        opacity: 1;

        visibility: visible;

    }


    .rit-menu .dropdown-menu.show {

        display: block;

    }


    .rit-menu .dropdown-item {

        display: flex;

        align-items: center;

        justify-content: space-between;

        padding: 10px 12px;

        color: #ddd;

        font-size: 12px;

        background: transparent;

    }


    .rit-menu .dropdown-item:hover {

        color: #fff;

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

    }


    .rit-menu .has-submenu>.dropdown-menu {

        position: static !important;

        padding-left: 15px;

    }


    .rit-menu .has-submenu>.dropdown-item i {

        font-size: 8px;

        transition: transform .25s ease;

    }


    .rit-menu .has-submenu.open>.dropdown-item i {

        transform: rotate(90deg);

    }

}

@media (max-width: 991px) {
    .topbar-menu {
        display: none;
    }
}

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

.stats-section {

    padding: 40px 4%;

    background: #eef7ff;
}


/* =========================================================
   MAIN COUNTER BOX
========================================================= */

.stats-counter {

    position: relative;

    display: grid;

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

    max-width: 1765px;

    margin: auto;

    background: var(--rit-sky-blue);

    border: 1px solid #b3cbe3;

    border-radius: 22px;

    overflow: visible;

    box-shadow:
        0 18px 45px rgba(80, 60, 20, .08);
}


/* =========================================================
   STAT ITEM
========================================================= */

.stat-item {

    position: relative;

    min-height: 198px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    padding: 20px 15px;

    border-right: 1px solid #b3cbe3;

    text-align: center;
}

.stat-item:last-child {

    border-right: 0;

}


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

.stat-icon {

    position: relative;

    width: 60px;

    height: 60px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 10px;

    border-radius: 50%;

    color: #fff;

    font-size: 22px;

    z-index: 2;

}


/* Outer circular arc */

.stat-icon::before {

    content: "";

    position: absolute;

    inset: -8px;

    border-radius: 50%;

    border: 2px solid currentColor;

    border-left-color: transparent;

    border-bottom-color: transparent;

    transform: rotate(-35deg);

    opacity: .9;

}


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

.icon-blue {

    background: #092454;

    color: #092454;

}

.icon-green {

    background: #007b58;

    color: #007b58;

}

.icon-orange {

    background: #c94e06;

    color: #c94e06;

}

.icon-blue-light {

    background: #205bbb;

    color: #205bbb;

}

.icon-purple {

    background: #63229b;

    color: #63229b;

}

.icon-orange-dark {

    background: #c74b04;

    color: #c74b04;

}


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

.stat-number {

    color: #071d4c;

    font-size: 22px;

    line-height: 1.15;

    font-weight: 800;

    letter-spacing: -.5px;
}


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

.stat-line {

    width: 32px;

    height: 3px;

    margin: 8px 0 10px;

    border-radius: 5px;

    background: #e8a526;

}


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

.stat-title {

    color: #344052;

    font-size: 14px;

    line-height: 1.35;

    font-weight: 600;

}


/* =========================================================
   LEFT END CAP
========================================================= */

.stats-counter::before {

    content: "";

    position: absolute;

    z-index: 20;

    left: -1px;
    top: -1px;

    width: 15px;
    height: calc(100% + 2px);

    background: #082352;

    border-radius: 22px 0 0 22px;

}


/* =========================================================
   LEFT INWARD ARROW
========================================================= */

.stats-counter::after {

    content: "";

    position: absolute;

    z-index: 21;

    left: 14px;

    top: 50%;

    transform: translateY(-50%);

    width: 0;

    height: 0;

    border-top: 12px solid transparent;

    border-bottom: 12px solid transparent;

    border-left: 12px solid #082352;
}


/* =========================================================
   RIGHT END CAP
========================================================= */

.stats-item-last {
    position: relative;
}


/* =========================================================
   RIGHT END CAP
========================================================= */

.stat-item:last-child {

    position: relative;

    border-right: 0;

}


.stat-item:last-child::after {

    content: "";

    position: absolute;

    z-index: 20;

    right: -1px;
    top: -1px;

    width: 15px;
    height: calc(100% + 2px);

    background: #dda52d;

    border-radius: 0 22px 22px 0;

}


/* =========================================================
   RIGHT INWARD ARROW
========================================================= */

.stat-item:last-child::before {

    content: "";

    position: absolute;

    z-index: 21;

    right: 14px;

    top: 50%;

    transform: translateY(-50%);

    width: 0;

    height: 0;

    border-top: 12px solid transparent;

    border-bottom: 12px solid transparent;

    border-right: 12px solid #dda52d;
}


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

.stat-item {

    transition: all .3s ease;

}

.stat-item:hover .stat-icon {

    transform: translateY(-4px);

}

.stat-icon {

    transition: all .3s ease;

}

.stat-icon i {
    color: #fff !important;
}


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

@media (max-width: 1200px) {

    .stats-counter {

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

    }

    .stat-item:nth-child(3) {

        border-right: 0;

    }

    .stat-item:nth-child(-n+3) {

        border-bottom: 1px solid #eddcb9;

    }

}


/* =========================================================
   RESPONSIVE COUNTER
========================================================= */

.stats-counter {
    position: relative;
    overflow: visible !important;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    background: var(--rit-sky-blue);
    border: 1px solid #99bddf;
    border-radius: 22px;
}


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

.stat-item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 198px;
    padding: 20px 12px;
    text-align: center;
    border-right: 1px solid #99bddf;
}

.stat-item:last-child {
    border-right: 0;
}


/* =========================================================
   LEFT FULL HEIGHT STRIP
========================================================= */

.stats-counter::before {

    content: "";

    position: absolute;

    left: -1px;
    top: -1px;
    bottom: -1px;

    width: 13px;

    background: #082352;

    border-radius: 22px 0 0 22px;

    z-index: 50;
}


/* =========================================================
   LEFT CENTER ARROW
========================================================= */

.stats-counter::after {

    content: "";

    position: absolute;

    left: 0;

    top: 50%;

    transform: translateY(-50%);

    width: 0;
    height: 0;

    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;

    border-left: 12px solid #082352;

    z-index: 60;
}


/* =========================================================
   RIGHT FULL HEIGHT STRIP
========================================================= */

.stat-item:last-child::after {

    content: "";

    position: absolute;

    right: -1px;
    top: -1px;
    bottom: -1px;

    width: 13px;

    background: #dda52d;

    border-radius: 0 22px 22px 0;

    z-index: 50;
}


/* =========================================================
   RIGHT CENTER ARROW
========================================================= */

.stat-item:last-child::before {

    content: "";

    position: absolute;

    right: 0;

    top: 50%;

    transform: translateY(-50%);

    width: 0;
    height: 0;

    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;

    border-right: 12px solid #dda52d;

    z-index: 60;
}


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

@media (max-width: 1199px) {

    .stats-counter {

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

    }

    .stat-item {

        min-height: 180px;

    }

    /* Every 3rd column */

    .stat-item:nth-child(3) {
        border-right: 0;
    }

    /* Bottom row */

    .stat-item:nth-child(4),
    .stat-item:nth-child(5),
    .stat-item:nth-child(6) {

        border-bottom: 0;

    }

}


/* =========================================================
   MOBILE - 2 COLUMNS
========================================================= */

@media (max-width: 767px) {

    .stats-section {

        padding: 25px 15px;

    }


    .stats-counter {

        width: 100%;

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

        border-radius: 18px;

    }


    /* -----------------------------------------
       COUNTER ITEM
    ----------------------------------------- */

    .stat-item {

        min-height: 150px;

        padding: 15px 8px;

        border-right: 1px solid #ead9b8;

        border-bottom: 1px solid #ead9b8;

    }


    /* Right column */

    .stat-item:nth-child(even) {

        border-right: 0;

    }


    /* Last row */

    .stat-item:nth-child(5),
    .stat-item:nth-child(6) {

        border-bottom: 0;

    }


    /* -----------------------------------------
       ICON
    ----------------------------------------- */

    .stat-icon {

        width: 48px;
        height: 48px;

        margin-bottom: 8px;

        font-size: 17px;

    }


    .stat-icon::before {

        inset: -6px;

    }


    /* -----------------------------------------
       NUMBER
    ----------------------------------------- */

    .stat-number {

        font-size: 22px;

    }


    /* -----------------------------------------
       LINE
    ----------------------------------------- */

    .stat-line {

        width: 23px;

        height: 2px;

        margin: 6px 0 7px;

    }


    /* -----------------------------------------
       TITLE
    ----------------------------------------- */

    .stat-title {

        max-width: 125px;

        font-size: 10px;

        line-height: 1.35;

    }


    /* =====================================================
       LEFT FULL HEIGHT STRIP
    ===================================================== */

    .stats-counter::before {

        display: none;

    }


    /* =====================================================
       LEFT CENTER ARROW
    ===================================================== */

    .stats-counter::after {

        display: none;

    }

    .stat-item:last-child::before,
    .stat-item:last-child::after {
        display: none;
    }

}


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

@media (max-width: 380px) {

    .stat-item {

        min-height: 140px;

        padding: 13px 5px;

    }

    .stat-icon {

        width: 44px;
        height: 44px;

        font-size: 15px;

    }

    .stat-number {

        font-size: 20px;

    }

    .stat-title {

        font-size: 9px;

    }

}

/* =========================================================
   EVENTS + ANNOUNCEMENTS
========================================================= */

.events-news-section {

    padding: 40px 0;

    background: #eef7ff;
}


/* =========================================================
   COMMON
========================================================= */

.events-box,
.announcement-box {

    height: 100%;

    overflow: hidden;

    border-radius: 24px;

    box-shadow:
        0 18px 45px rgba(67, 48, 17, .08);

}


/* =========================================================
   EVENTS
========================================================= */

.events-box {

    background: var(--rit-sky-blue);
}


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

.events-header {

    min-height: 60px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 0 30px;

    background: linear-gradient(100deg, var(--rit-blue), var(--rit-sky-blue));
}


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

.announcement-header {

    min-height: 60px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 0 30px;

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


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

.section-heading {

    display: flex;

    align-items: center;

    gap: 15px;

}

.section-heading i {

    color: var(--rit-sky-blue);

    font-size: 21px;
}

.section-heading h3 {

    margin: 0;

    color: #fff;

    font-family: 'Oswald', sans-serif;

    font-size: 21px;

    font-weight: 500;

    letter-spacing: .8px;

    text-transform: uppercase;

}


/* =========================================================
   VIEW ALL
========================================================= */

.view-all {

    display: flex;

    align-items: center;

    gap: 9px;

    color: var(--rit-red);

    font-size: 13px;

    font-weight: 600;

    transition: all .3s ease;
}

.view-all i {

    color: var(--rit-red);

    font-size: 12px;
}

.view-all:hover {

    color: #e8a82c;

}


/* =========================================================
   EVENTS BODY
========================================================= */

.events-body {

    position: relative;

    min-height: 458px;

    padding: 15px;

    overflow: hidden;
}


/* =========================================================
   EVENT ROW
========================================================= */

.event-row {

    position: relative;

    display: grid;

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

    gap: 20px;

    align-items: center;

}


/* =========================================================
   SINGLE EVENT
========================================================= */

.event-single {

    grid-template-columns:
        75px 1fr;

}


/* =========================================================
   DATE
========================================================= */

.event-date {

    width: 70px;

    height: 70px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    background: #fff;

    border: 1px solid #9da5ab;

    border-radius: 15px;

    box-shadow:
        0 7px 20px rgba(82, 59, 18, .06);
}

.event-date span {

    color: var(--rit-blue);

    font-size: 13px;

    font-weight: 700;

    letter-spacing: .5px;
}

.event-date strong {

    color: #000000;

    font-size: 28px;

    line-height: 1;

    margin-top: 4px;
}


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

.event-content {

    min-width: 0;

}

.event-content h4 {

    margin: 0 0 7px;

    color: #1e293b;

    font-family: 'Oswald', sans-serif;

    font-size: 17px;

    font-weight: 500;

    letter-spacing: .5px;

}

.event-content p {

    margin: 0 0 7px;

    color: #697486;

    font-size: 14px;

    line-height: 1.5;

}

.event-content small {

    color: #8994a5;

    font-size: 12px;

    font-weight: 600;

}


/* =========================================================
   EVENT VERTICAL DIVIDER
========================================================= */

.event-divider {

    width: 1px;

    height: 94px;

    background: repeating-linear-gradient(to bottom, #9cc9f3 0, #9cc9f3 4px, transparent 4px, transparent 8px);
}


/* =========================================================
   HORIZONTAL SEPARATOR
========================================================= */

.event-separator {

    height: 1px;

    margin: 30px 0 30px;

    background: #9cc9f3;
}


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

.events-watermark {

    position: absolute;

    right: 35px;

    bottom: 12px;

    color: #edcd87;

    opacity: .18;

    transform: rotate(7deg);

}

.events-watermark i {

    font-size: 130px;

}


/* =========================================================
   ANNOUNCEMENT BODY
========================================================= */

.announcement-body {

    min-height: 458px;

    padding: 15px;

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


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

.announcement-slider {

    display: flex;

    flex-direction: column;

    gap: 19px;

}


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

.announcement-card {

    min-height: 120px;

    display: grid;

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

    gap: 20px;

    align-items: center;

    padding: 10px;

    background: var(--rit-dark-blue);

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

    border-radius: 18px;

    transition: all .35s ease;
}

.announcement-card:hover {

    border-color: rgba(230, 166, 42, .4);

    transform: translateY(-2px);

    background: #111d32;

}


/* =========================================================
   NEWS DATE
========================================================= */

.news-date {

    width: 74px;

    height: 78px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    background: var(--rit-blue);

    border: 1px solid rgb(168 213 255 / 30%);

    border-radius: 13px;
}

.news-date strong {

    color: var(--rit-sky-blue);

    font-size: 28px;

    line-height: 1;
}

.news-date span {

    margin-top: 5px;

    color: #ffffff;

    font-size: 11px;

    font-weight: 700;
}


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

.news-image {

    width: 74px;

    height: 78px;

    overflow: hidden;

    border-radius: 10px;

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

}

.news-image img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    transition: transform .4s ease;

}

.announcement-card:hover .news-image img {

    transform: scale(1.08);

}


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

.news-content {

    min-width: 0;

}

.news-content h4 {

    margin: 0 0 7px;

    color: #fff;

    font-family: 'Oswald', sans-serif;

    font-size: 16px;

    line-height: 1.25;

    font-weight: 500;

    letter-spacing: .4px;

}

.news-content p {

    margin: 0;

    color: #aab2bf;

    font-size: 12px;

    line-height: 1.55;

}


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

@media (max-width: 1199px) {

    .event-row {

        grid-template-columns:
            65px 1fr;

        gap: 15px;

    }

    .event-divider {

        display: none;

    }

    .event-row>.event-date:nth-of-type(2),
    .event-row>.event-content:nth-of-type(2) {

        display: none;

    }

}


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

@media (max-width: 767px) {

    .events-news-section {

        padding: 35px 0;

    }


    .events-header,
    .announcement-header {

        min-height: 65px;

        padding: 0 18px;

    }


    .section-heading {

        gap: 10px;

    }


    .section-heading i {

        font-size: 17px;

    }


    .section-heading h3 {

        font-size: 17px;

    }


    .view-all {

        font-size: 10px;

    }


    .events-body,
    .announcement-body {

        min-height: auto;

        padding: 20px 15px;

    }


    /* Event */

    .event-row {

        grid-template-columns: 60px 1fr;

        gap: 15px;

    }


    .event-date {

        width: 60px;

        height: 72px;

        border-radius: 12px;

    }


    .event-date span {

        font-size: 10px;

    }


    .event-date strong {

        font-size: 24px;

    }


    .event-content h4 {

        font-size: 14px;

    }


    .event-content p {

        font-size: 11px;

    }


    .event-content small {

        font-size: 10px;

    }


    /* Announcement */

    .announcement-slider {

        gap: 12px;

    }


    .announcement-card {

        grid-template-columns:
            55px 60px 1fr;

        gap: 10px;

        padding: 12px;

        min-height: 95px;

        border-radius: 13px;

    }


    .news-date {

        width: 55px;

        height: 60px;

    }


    .news-date strong {

        font-size: 21px;

    }


    .news-date span {

        font-size: 9px;

    }


    .news-image {

        width: 60px;

        height: 60px;

    }


    .news-content h4 {

        font-size: 12px;

    }


    .news-content p {

        font-size: 9px;

        line-height: 1.4;

    }


    .events-watermark {

        right: 10px;

        bottom: 5px;

    }

    .events-watermark i {

        font-size: 80px;

    }

}

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

.rit-events-section {

    position: relative;

    padding: 30px 0;

    background: #eef7ff;

    overflow: hidden;
}


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

.rit-events-wrapper {

    width: calc(100% - 10%);

    margin: auto;

    padding: 20px 20px;

    display: flex;

    gap: 35px;

    align-items: stretch;

    background: var(--rit-sky-blue);

    border: 1px solid #8ab8f3;

    border-radius: 32px;

    box-shadow:
        0 20px 50px rgba(78, 52, 12, .06);
}


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

.rit-events-intro {

position: relative;

flex: 0 0 350px;

min-height: 490px;

padding: 40px 32px;

overflow: hidden;

border-radius: 30px;

background: var(--rit-blue);

box-shadow:
        0 20px 35px rgba(39, 20, 5, .22);
}


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

.rit-events-logo {

    display: flex;

    align-items: center;

    gap: 12px;

    position: relative;

    z-index: 3;

}

.rit-events-logo img {

width: 100%;

height: auto;

background: #fff;

border-radius: 5px;
}

.rit-events-logo span {

    color: #fff;

    font-size: 12px;

    line-height: 1.25;

    font-weight: 700;

}


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

.rit-intro-line {

    width: 100%;

    height: 1px;

    margin: 27px 0 30px;

    background: rgb(168 213 255 / 50%);
}

.rit-intro-line::before {

    content: "";

    display: block;

    width: 75px;

    height: 2px;

    background: var(--rit-sky-blue);

    transform: translateY(-1px);
}


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

.rit-events-intro h2 {

    position: relative;

    z-index: 2;

    margin: 0 0 25px;

    font-family: "Oswald", sans-serif;

    font-size: 35px;

    line-height: 1.08;

    font-weight: 400;

    letter-spacing: .5px;

    text-transform: uppercase;

    color: #fff;
}

.rit-events-intro h2 span {

    color: var(--rit-sky-blue);

    display: inline;
}

.rit-events-intro h2 strong {

    color: #fff;

    display: block;

    font-weight: 500;

}


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

.rit-events-intro>p {

    position: relative;

    z-index: 2;

    max-width: 275px;

    margin: 0 0 30px;

    color: #ffffff;

    font-size: 14px;

    line-height: 1.8;
}


/* =========================================================
   VIEW ALL BUTTON
========================================================= */

.rit-view-events {

    position: relative;

    z-index: 5;

    width: 100%;

    min-height: 56px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 7px 8px 7px 22px;

    color: #1f1409;

    background: var(--rit-sky-blue);

    border-radius: 35px;

    font-size: 13px;

    font-weight: 700;

    transition: all .3s ease;
}

.rit-view-events:hover {

    color: #ffffff;

    background: #0e4496;

    transform: translateY(-2px);
}

.rit-view-events i {

    width: 40px;

    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: rgba(73, 42, 8, .13);

}


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

.rit-intro-watermark {

    position: absolute;

    right: -20px;

    bottom: -30px;

    color: #9c661a;

    opacity: .14;

    transform: rotate(-25deg);

}

.rit-intro-watermark i {

    font-size: 180px;

}


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

.rit-events-slider-wrap {

    position: relative;

    flex: 1;

    min-width: 0;

    padding: 3px 0;

}


/* =========================================================
   SWIPER
========================================================= */

.ritEventsSwiper {

    width: 100%;

    overflow: hidden;

    padding: 0 0 5px;

}

.ritEventsSwiper .swiper-wrapper {

    /* align-items: stretch; */
}


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

.ritEventsSwiper .swiper-slide {

    height: auto;
}


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

.rit-event-card {

    position: relative;

    height: 100%;

    min-height: 435px;

    padding: 14px 15px 18px;

    background: #edf6fe;

    border-radius: 28px;

    overflow: hidden;

    box-shadow:
        0 12px 30px rgba(78, 55, 18, .05);

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.rit-event-card:hover {

    transform: translateY(-5px);

    box-shadow:
        0 18px 40px rgba(78, 55, 18, .12);

}


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

.rit-event-image {

    position: relative;

    width: 100%;

    height: 198px;

    overflow: hidden;

    border-radius: 24px;

}

.rit-event-image img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    transition: transform .5s ease;

}

.rit-event-card:hover .rit-event-image img {

    transform: scale(1.05);

}


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

.rit-event-icon {

    position: absolute;

    top: 12px;

    left: 12px;

    width: 40px;

    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--rit-sky-blue);

    background: var(--rit-blue);

    border: 1px solid var(--rit-sky-blue);

    border-radius: 50%;

    font-size: 16px;
}


/* =========================================================
   META
========================================================= */

.rit-event-meta {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin: 14px 3px 10px;

}

.rit-event-category {

    padding: 7px 12px;

    color: var(--rit-blue);

    background: var(--rit-sky-blue);

    border-radius: 20px;

    font-size: 11px;

    font-weight: 700;
}

.rit-event-year {

    color: #2263c4;

    font-size: 12px;

    font-weight: 600;
}


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

.rit-event-card h3 {

    margin: 0 3px 12px;

    padding-right: 15px;

    color: var(--rit-blue);

    font-family: "Oswald", sans-serif;

    font-size: 17px;

    line-height: 1.35;

    font-weight: 500;

    text-transform: uppercase;
}


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

.rit-event-card p {

    margin: 0 3px;

    padding-right: 8px;

    color: #68615a;

    font-size: 13px;

    line-height: 1.65;

}


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

.rit-event-arrow {

    position: absolute;

    right: 17px;

    bottom: 19px;

    width: 36px;

    height: 36px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--rit-sky-blue);

    background: var(--rit-blue);

    border-radius: 50%;

    transition: all .3s ease;
}

.rit-event-arrow:hover {

    color: var(--rit-blue);

    background: var(--rit-sky-blue);

    transform: translateX(3px);
}


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

.rit-events-navigation {

    position: absolute;

    z-index: 10;

    right: 8px;

    bottom: -40px;

    display: flex;

    gap: 8px;
}

.rit-events-navigation button {

    width: 40px;

    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--rit-sky-blue);

    background: var(--rit-blue);

    border: 0;

    border-radius: 50%;

    transition: all .3s ease;
}

.rit-events-navigation button:hover {

    color: var(--rit-blue);

    background: var(--rit-sky-blue);

    border: 1px solid;
}


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

@media (max-width: 1199px) {

    .rit-events-wrapper {

        width: calc(100% - 30px);

        padding: 25px;

    }

    .rit-events-intro {

        flex: 0 0 280px;

        padding: 30px 25px;

    }

    .rit-events-intro h2 {

        font-size: 34px;

    }

    .ritEventsSwiper .swiper-slide {

        width: 300px;

    }

}


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

@media (max-width: 767px) {

    .rit-events-section {

        padding: 40px 0;

    }

    .rit-events-wrapper {

        width: calc(100% - 20px);

        padding: 15px;

        display: block;

        border-radius: 22px;

    }


    /* Intro */

    .rit-events-intro {

        min-height: auto;

        padding: 28px 23px;

        margin-bottom: 20px;

        border-radius: 22px;

    }

    .rit-events-logo img {

width: 100%;

height: auto;

}

    .rit-events-logo span {

        font-size: 10px;

    }

    .rit-intro-line {

        margin: 20px 0;

    }

    .rit-events-intro h2 {

font-size: 30px;

margin-bottom: 18px;

}

    .rit-events-intro>p {

        max-width: 100%;

        font-size: 12px;

        line-height: 1.7;

    }

    .rit-view-events {

        min-height: 50px;

    }


    /* Slider */

    .rit-events-slider-wrap {

        padding: 0;

    }

    .ritEventsSwiper {

        overflow: visible;

    }

    .ritEventsSwiper .swiper-slide {

        width: 285px;

    }

    .rit-event-card {

        min-height: 420px;

        border-radius: 22px;

    }

    .rit-event-image {

        height: 170px;

        border-radius: 18px;

    }


    /* Hide navigation on mobile */

    .rit-events-navigation {

        display: none;

    }

}


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

@media (max-width: 480px) {

    .ritEventsSwiper .swiper-slide {

        width: calc(100vw - 65px);

    }

    .rit-event-card {

        min-height: 400px;

    }

}

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

:root {

    --rit-cream: #A8D5FF;
    --rit-cream-dark: #8cc7ff;

    --rit-burgundy: #022252;
    --rit-burgundy-dark: #000e23;

    --rit-gold: #b97812;
    --rit-gold-light: #e5a934;

    --rit-text: #2b2928;
    --rit-muted: #716960;

    --rit-border: #ecd9b1;

}


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

.rit-about-section {

    position: relative;

    padding: 30px 0;

    overflow: hidden;

    background: #eef7ff;
}


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

.rit-about-glow {

    position: absolute;

    border-radius: 50%;

    filter: blur(70px);

    pointer-events: none;

    opacity: .35;

}

.rit-glow-one {

    width: 300px;
    height: 300px;

    left: -120px;
    top: 15%;

    background: rgba(218, 165, 66, .15);

    animation:
        ritGlowOne 8s ease-in-out infinite alternate;

}

.rit-glow-two {

    width: 250px;
    height: 250px;

    right: -80px;
    bottom: 5%;

    background: rgba(125, 45, 40, .12);

    animation:
        ritGlowTwo 10s ease-in-out infinite alternate;

}


@keyframes ritGlowOne {

    from {
        transform: translate(0, 0);
    }

    to {
        transform: translate(60px, 40px);
    }

}


@keyframes ritGlowTwo {

    from {
        transform: translate(0, 0);
    }

    to {
        transform: translate(-50px, -40px);
    }

}


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

.rit-about-content {

    opacity: 0;

    transform: translateX(-60px);

    animation:
        ritAboutContent 1s ease forwards;

}


@keyframes ritAboutContent {

    to {

        opacity: 1;

        transform: translateX(0);

    }

}


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

.rit-about-label {

    display: flex;

    align-items: center;

    gap: 9px;

    margin-bottom: 15px;

    color: var(--rit-blue);

    font-size: 14px;

    font-weight: 700;

    letter-spacing: 1px;

    text-transform: uppercase;
}

.rit-about-label span {

    width: 8px;

    height: 8px;

    background: var(--rit-blue);

    border-radius: 50%;

    animation: ritPulse 2s infinite;
}


@keyframes ritPulse {

    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.5);
        opacity: .55;
    }

}


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

.rit-about-title {

    margin-bottom: 10px;

    color: var(--rit-burgundy);

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

    font-size: 30px;

    line-height: 1.2;

    font-weight: 700;

    text-transform: uppercase;
}

.rit-about-title span {

    display: block;

}


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

.rit-about-mini-logo {

    margin: 20px 0 25px;

}

.rit-about-mini-logo img {

    width: 28px;

    height: 28px;

    object-fit: contain;

}


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

.rit-about-highlight {

    margin: 0 0 18px;

    color: #161414;

    font-size: 15px;

    line-height: 1.8;

    font-weight: 600;

    text-align: justify;
}


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

.rit-about-description {

    margin: 0;

    color: var(--rit-text);

    font-size: 15px;

    line-height: 1.8;

    text-align: justify;
}


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

.rit-about-features {

    display: flex;

    gap: 65px;

    margin-top: 38px;

}


.rit-about-feature {

    display: flex;

    align-items: center;

    gap: 15px;

}


.rit-feature-icon {

    width: 54px;

    height: 54px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    color: var(--rit-blue);

    background: var(--rit-cream);

    border-radius: 50%;

    font-size: 19px;

    transition: all .35s ease;
}


.rit-about-feature:hover .rit-feature-icon {

    color: #fff;

    background: var(--rit-blue);

    transform:
        translateY(-5px) rotate(-5deg);

    box-shadow:
        0 10px 25px rgba(185, 120, 18, .2);
}


.rit-about-feature h4 {

    margin: 0;

    color: #25201d;

    font-size: 15px;

    line-height: 1.4;

    font-weight: 700;

}


.rit-about-feature span {

    display: block;

    color: #25201d;

    font-size: 14px;

    font-weight: 700;

}


/* =========================================================
   ACCREDITATION BOX
========================================================= */

.rit-accreditation-box {

    min-height: 105px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-top: 40px;

    padding: 18px 28px;

    background: var(--rit-sky-blue);

    border: 1px solid #8eb3d6;

    border-radius: 28px;

    box-shadow:
        0 12px 30px rgba(87, 55, 15, .04);
}


.rit-accreditation-title {

    display: flex;

    flex-direction: column;

    gap: 5px;

}


.rit-accreditation-title small {

    color: #23598b;

    font-family: "Oswald", sans-serif;

    font-size: 13px;

    letter-spacing: 1.5px;
}


.rit-accreditation-title strong {

    color: #2b2623;

    font-size: 16px;

}


.rit-accreditation-logos {

    display: flex;

    gap: 18px;

}


.rit-accreditation-logo {

    width: 98px;

    height: 65px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #fff;

    border: 1px solid #93b3d1;

    border-radius: 15px;

    box-shadow:
        0 8px 18px rgba(60, 40, 10, .05);

    transition: all .35s ease;
}


.rit-accreditation-logo:hover {

    transform: translateY(-5px);

    box-shadow:
        0 12px 25px rgba(60, 40, 10, .12);

}


.rit-accreditation-logo img {

    max-width: 75px;

    max-height: 52px;

    object-fit: contain;

}


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

.rit-leadership-card {

    position: relative;

    padding: 18px 18px 25px;

    background: rgb(237 246 255);

    border: 3px solid #a8d5ff;

    border-radius: 32px;

    box-shadow:
        0 20px 50px rgba(74, 48, 12, .10);

    opacity: 0;

    transform:
        translateX(60px) rotate(1deg);

    animation:
        ritLeadershipIn 1s .25s ease forwards;
}


@keyframes ritLeadershipIn {

    to {

        opacity: 1;

        transform:
            translateX(0) rotate(0);

    }

}


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

.rit-leadership-image-wrap {

    position: relative;

    overflow: hidden;

    padding: 2px;

    border-radius: 24px;

}


.rit-leadership-image {

    width: 100%;

    height: auto;

    display: block;

    border-radius: 22px;

    object-fit: cover;

    transition:
        transform 1.2s ease,
        filter .6s ease;

}


.rit-leadership-card:hover .rit-leadership-image {

    transform: scale(1.025);

}


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

.rit-image-glow {

    position: absolute;

    inset: 0;

    z-index: 2;

    pointer-events: none;

    border-radius: 22px;

    box-shadow:
        inset 0 0 35px rgba(227, 166, 40, .25);

}


/* =========================================================
   CROWN
========================================================= */

.rit-crown {

    position: absolute;

    z-index: 5;

    top: -8px;

    left: 50%;

    width: 43px;

    height: 30px;

    display: flex;

    align-items: center;

    justify-content: center;

    transform: translateX(-50%);

    color: #ffd35c;

    background: #4b2605;

    border: 2px solid #d99a19;

    border-radius: 50%;

    font-size: 13px;

    box-shadow:
        0 0 15px rgba(223, 164, 40, .35);

    animation:
        ritCrownFloat 3s ease-in-out infinite;

}


@keyframes ritCrownFloat {

    0%,
    100% {
        transform: translateX(-50%) translateY(0);
    }

    50% {
        transform: translateX(-50%) translateY(-5px);
    }

}


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

.rit-leadership-caption {

    display: flex;

    gap: 13px;

    margin-top: 20px;

    padding: 0 12px;

}


.rit-caption-icon {

    flex-shrink: 0;

    color: var(--rit-blue);

    font-size: 21px;

    padding-top: 2px;
}


.rit-leadership-caption h3 {

    margin: 0 0 5px;

    color: #2c2520;

    font-size: 16px;

    font-weight: 700;

}


.rit-leadership-caption p {

    margin: 0;

    color: #766d63;

    font-size: 12px;

    line-height: 1.6;

}


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

.rit-card-corner {

    position: absolute;

    width: 40px;

    height: 40px;

    border-color: #dca12b;

    opacity: .6;

}


.corner-one {

    top: 10px;

    left: 10px;

    border-top: 1px solid;

    border-left: 1px solid;

    border-radius: 15px 0 0 0;

}


.corner-two {

    right: 10px;

    bottom: 10px;

    border-right: 1px solid;

    border-bottom: 1px solid;

    border-radius: 0 0 15px 0;

}


/* =========================================================
   SCROLL REVEAL
========================================================= */

.rit-about-section.reveal-ready .rit-about-content {

    animation: none;

    opacity: 0;

    transform: translateX(-60px);

}


.rit-about-section.reveal-ready .rit-leadership-card {

    animation: none;

    opacity: 0;

    transform: translateX(60px);

}


.rit-about-section.is-visible .rit-about-content {

    animation:
        ritAboutContent 1s ease forwards;

}


.rit-about-section.is-visible .rit-leadership-card {

    animation:
        ritLeadershipIn 1s .2s ease forwards;

}


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

@media (max-width: 1199px) {

    .rit-about-section {

        padding: 70px 0;

    }

    .rit-about-title {

        font-size: 52px;

    }

    .rit-about-highlight {

        font-size: 15px;

    }

    .rit-about-features {

        gap: 30px;

    }

}


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

@media (max-width: 991px) {

    .rit-about-section {

        padding: 60px 0;

    }

    .rit-about-title {

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

    }

    .rit-about-highlight {

        font-size: 14px;

    }

    .rit-about-description {

        font-size: 13px;

    }

    .rit-about-features {

        gap: 25px;

    }

    .rit-leadership-card {

        margin-top: 15px;

    }

}


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

@media (max-width: 575px) {

    .rit-about-section {

        padding: 45px 0;

    }

    .rit-about-label {

        margin-bottom: 18px;

        font-size: 11px;

    }

    .rit-about-title {

font-size: 25px;

line-height: 1.08;

letter-spacing: -1px;

}

    .rit-about-mini-logo {

        margin: 15px 0 18px;

    }

    .rit-about-highlight {

        font-size: 13px;

        line-height: 1.7;

    }

    .rit-about-description {

        font-size: 12px;

        line-height: 1.7;

    }


    /* Features */

    .rit-about-features {

        display: grid;

        grid-template-columns: 1fr 1fr;

        gap: 15px;

        margin-top: 28px;

    }

    .rit-about-feature {

        gap: 9px;

    }

    .rit-feature-icon {

        width: 43px;

        height: 43px;

        font-size: 15px;

    }

    .rit-about-feature h4,
    .rit-about-feature span {

        font-size: 11px;

    }


    /* Accreditation */

    .rit-accreditation-box {

        min-height: auto;

        flex-direction: column;

        align-items: flex-start;

        gap: 18px;

        margin-top: 28px;

        padding: 20px;

        border-radius: 20px;

    }

    .rit-accreditation-logos {

        width: 100%;

        justify-content: space-between;

    }


    .rit-accreditation-logo {

        width: 46%;

        height: 60px;

    }


    /* Leadership */

    .rit-leadership-card {

        padding: 10px 10px 18px;

        border-radius: 22px;

    }

    .rit-leadership-caption {

        margin-top: 15px;

        padding: 0 5px;

    }

    .rit-leadership-caption h3 {

        font-size: 13px;

    }

    .rit-leadership-caption p {

        font-size: 10px;

    }

}

/* =========================================================
   VISION & MISSION
========================================================= */

:root {

    --vm-navy: #022252;

    --vm-navy-light: #173d70;

    --vm-cream: #fff5dc;

    --vm-card: #fffdf8;

    --vm-border: #A8D5FF;

    --vm-text: #4b5b70;

    --vm-pink: #ed0876;
}


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

.rit-vision-mission {

    position: relative;

    overflow: hidden;

    padding: 30px 0 30px;

    background: #eef7ff;
}


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

.rit-vision-mission::before {

    content: "";

    position: absolute;

    width: 450px;
    height: 450px;

    right: -200px;
    top: 20%;

    border-radius: 50%;

    background: rgba(226, 191, 121, .12);

    filter: blur(70px);

    pointer-events: none;

    animation:
        vmBackgroundFloat 8s ease-in-out infinite alternate;

}


@keyframes vmBackgroundFloat {

    from {
        transform: translate(0, 0);
    }

    to {
        transform: translate(-50px, 25px);
    }

}


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

.vm-section-heading {

    margin-bottom: 15px;

    animation:
        vmHeadingReveal .8s ease both;
}


.vm-section-heading h2 {

    margin: 0;

    color: var(--vm-navy);

    font-family:
        "Oswald",
        sans-serif;

    font-size: 30px;

    line-height: 1;

    font-weight: 500;

    letter-spacing: 1px;
}


@keyframes vmHeadingReveal {

    from {

        opacity: 0;

        transform:
            translateY(25px);

    }

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


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

.vm-content {

    display: flex;

    flex-direction: column;

    gap: 20px;

}


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

.vm-card {

    position: relative;

    display: flex;

    align-items: flex-start;

    gap: 25px;

    padding: 15px;

    background: linear-gradient(145deg, rgba(255, 255, 255, .92), rgba(255, 252, 245, .88));

    border: 1px solid var(--vm-border);

    border-radius: 25px;

    box-shadow:

        0 12px 35px rgba(76, 58, 27, .055);

    transition:

        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}


/* Hover */

.vm-card:hover {

    transform:
        translateY(-5px);

    border-color:
        #cbdcf0;

    box-shadow:

        0 20px 45px rgba(2, 34, 82, .09);

}


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

.vm-vision-card {

    opacity: 0;

    animation:
        vmCardReveal .8s .2s ease forwards;

}


.vm-mission-card {

    opacity: 0;

    animation:
        vmCardReveal .8s .45s ease forwards;

}


@keyframes vmCardReveal {

    from {

        opacity: 0;

        transform:
            translateY(45px);

    }

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


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

.vm-icon {

    position: relative;

    flex: 0 0 70px;

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 20px;

    color: var(--vm-navy);

    font-size: 27px;

    transition:

        transform .4s ease,
        background .4s ease;

}


.vision-icon {

    background: #f2f6ff;

    border: 1px solid #cfddfa;

}


.mission-icon {

    background: #f2faf5;

    border: 1px solid #cdebdc;

}


/* Icon hover */

.vm-card:hover .vm-icon {

    transform:
        translateY(-5px) rotate(-4deg);

}


/* =========================================================
   ICON PULSE RING
========================================================= */

.vm-icon::after {

    content: "";

    position: absolute;

    inset: -5px;

    border-radius: inherit;

    border: 1px solid transparent;

    opacity: 0;

    transition: all .4s ease;

}


.vm-card:hover .vm-icon::after {

    border-color:
        rgba(2, 34, 82, .25);

    opacity: 1;

    animation:
        vmIconPulse 1.5s ease infinite;

}


@keyframes vmIconPulse {

    0% {
        transform: scale(.95);
        opacity: .7;
    }

    100% {
        transform: scale(1.12);
        opacity: 0;
    }

}


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

.vm-card-content {

    flex: 1;

    min-width: 0;

}


.vm-card-content h3 {

    margin: 3px 0 12px;

    color: var(--vm-navy);

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

    font-size: 22px;

    line-height: 1;

    font-weight: 700;
}


.vm-card-content p {

    margin: 0;

    color: var(--vm-text);

    font-size: 15px;

    line-height: 1.8;

}


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

.mission-intro {

    margin-bottom: 10px !important;

    color: #44556b !important;

    font-weight: 600;

}


/* =========================================================
   MISSION LIST
========================================================= */

.mission-list {

    margin: 0;

    padding: 0;

    list-style: none;

}


.mission-list li {

    position: relative;

    display: flex;

    align-items: flex-start;

    gap: 11px;

    margin-top: 13px;

    opacity: 0;

    animation:
        vmMissionItem .6s ease forwards;

}


.mission-list li:nth-child(1) {

    animation-delay: .8s;

}

.mission-list li:nth-child(2) {

    animation-delay: 1s;

}

.mission-list li:nth-child(3) {

    animation-delay: 1.2s;

}


@keyframes vmMissionItem {

    from {

        opacity: 0;

        transform:
            translateX(20px);

    }

    to {

        opacity: 1;

        transform:
            translateX(0);

    }

}


.mission-list li p {

    font-size: 14px;

    line-height: 1.65;

}


.mission-dot {

    flex: 0 0 8px;

    width: 8px;

    height: 8px;

    margin-top: 8px;

    border-radius: 50%;

    background: var(--vm-pink);

    box-shadow:
        0 0 0 4px rgba(237, 8, 118, .08);

}


/* =========================================================
   BUILDING AREA
========================================================= */

.vm-building-area {

    position: relative;

    min-height: 470px;

    display: flex;

    align-items: center;

    justify-content: center;
}


/* =========================================================
   BUILDING
========================================================= */

.vm-building {

    position: relative;

    z-index: 2;

    width: 100%;

    display: flex;

    justify-content: center;

    animation:
        vmBuildingReveal 1.2s .25s ease both;

}


.vm-building img {

    width: 100%;

    height: 400px;

    display: block;

    object-fit: cover;

    border-radius: 10px;
}


/* Hover building */

.vm-building-area:hover .vm-building img {

    opacity: .88;

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

    filter:

        grayscale(100%) contrast(.95) brightness(1.08);

}


/* =========================================================
   BUILDING ANIMATION
========================================================= */

@keyframes vmBuildingReveal {

    from {

        opacity: 0;

        transform:
            translateY(45px) scale(.94);

    }

    to {

        opacity: .72;

        transform:
            translateY(0) scale(1);

    }

}


/* =========================================================
   BUILDING GLOW
========================================================= */

.vm-building-glow {

    position: absolute;

    z-index: 1;

    width: 380px;
    height: 380px;

    top: 50%;
    left: 50%;

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

    border-radius: 50%;

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

    filter: blur(35px);

    animation:
        vmBuildingGlow 5s ease-in-out infinite alternate;

}


@keyframes vmBuildingGlow {

    from {

        opacity: .45;

        transform:
            translate(-50%, -50%) scale(.9);

    }

    to {

        opacity: .85;

        transform:
            translate(-50%, -50%) scale(1.1);

    }

}


/* =========================================================
   DECORATIVE CIRCLES
========================================================= */

.vm-circle {

    position: absolute;

    z-index: 1;

    border-radius: 50%;

    border: 1px solid rgba(2, 34, 82, .10);

}


.vm-circle-one {

    width: 260px;
    height: 260px;

    right: 5%;

    top: 12%;

    animation:
        vmCircleRotate 18s linear infinite;

}


.vm-circle-two {

    width: 180px;
    height: 180px;

    right: 16%;

    bottom: 10%;

    border-style: dashed;

    animation:
        vmCircleRotateReverse 14s linear infinite;

}


@keyframes vmCircleRotate {

    to {
        transform: rotate(360deg);
    }

}


@keyframes vmCircleRotateReverse {

    to {
        transform: rotate(-360deg);
    }

}


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

@media (max-width: 1199px) {

    .rit-vision-mission {

        padding: 65px 0;

    }


    .vm-card {

        padding: 25px;

        gap: 20px;

    }


    .vm-card-content h3 {

        font-size: 25px;

    }


    .vm-card-content p {

        font-size: 14px;

    }


    .vm-building-area {

        min-height: 450px;

    }

}


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

@media (max-width: 991px) {

    .rit-vision-mission {

        padding: 55px 0;

    }


    .vm-section-heading {

        margin-bottom: 25px;

    }


    .vm-building-area {

        min-height: auto;

        margin-top: 10px;

    }


    .vm-building img {

        max-width: 600px;

    }

}


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

@media (max-width: 575px) {

    .rit-vision-mission {

        padding: 45px 0;

    }


    .vm-section-heading h2 {

font-size: 30px;

}


    .vm-content {

        gap: 15px;

    }


    .vm-card {

        gap: 15px;

        padding: 20px;

        border-radius: 20px;

    }


    .vm-icon {

        flex: 0 0 52px;

        width: 52px;

        height: 52px;

        border-radius: 15px;

        font-size: 21px;

    }


    .vm-card-content h3 {

        margin-top: 1px;

        font-size: 23px;

    }


    .vm-card-content p {

        font-size: 12px;

        line-height: 1.7;

    }


    .mission-intro {

        font-size: 12px !important;

    }


    .mission-list li {

        gap: 9px;

    }


    .mission-list li p {

        font-size: 11px;

        line-height: 1.6;

    }


    .mission-dot {

        width: 7px;

        height: 7px;

        flex-basis: 7px;

        margin-top: 7px;

    }


    .vm-building-area {

        margin-top: 20px;

    }


    .vm-building img {

        max-width: 100%;

    }


    .vm-building-glow {

        width: 250px;
        height: 250px;

    }


    .vm-circle-one {

        width: 180px;
        height: 180px;

    }


    .vm-circle-two {

        width: 120px;
        height: 120px;

    }

}


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

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

    .rit-vision-mission *,
    .rit-vision-mission::before {

        animation: none !important;

        transition: none !important;

    }

}

/* =========================================================
   CCW INTEREST / COURSES SECTION
========================================================= */

:root {

    --ccw-blue: #022252;
    --ccw-light-blue: #A8D5FF;

    --ccw-cream: #fff7e3;
    --ccw-card: #ffffff;

    --ccw-text: #27364b;
    --ccw-muted: #68778a;

}


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

.ccw-interest-section {

    position: relative;

    padding: 0 0px 30px;

    overflow: hidden;

    background: #eef7ff;
}


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

.ccw-interest-section::before {

    content: "";

    position: absolute;

    width: 350px;
    height: 350px;

    left: -150px;
    bottom: -100px;

    border-radius: 50%;

    background:
        rgba(168, 213, 255, .18);

    filter: blur(60px);

    animation:
        ccwFloat 8s ease-in-out infinite alternate;

}


.ccw-interest-section::after {

    content: "";

    position: absolute;

    width: 220px;
    height: 220px;

    right: -80px;
    top: 80px;

    border-radius: 50%;

    border: 1px solid rgba(2, 34, 82, .08);

    animation:
        ccwRotate 20s linear infinite;

}


@keyframes ccwFloat {

    from {
        transform: translate(0, 0);
    }

    to {
        transform: translate(50px, -30px);
    }

}


@keyframes ccwRotate {

    to {
        transform: rotate(360deg);
    }

}


/* =========================================================
   MAIN LAYOUT
========================================================= */

.ccw-interest-layout {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        34% 66%;

    align-items: center;

    gap: 50px;

}


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

.ccw-interest-intro {

    padding-right: 20px;

    animation:
        ccwIntroReveal .9s ease both;

}


@keyframes ccwIntroReveal {

    from {

        opacity: 0;

        transform:
            translateX(-45px);

    }

    to {

        opacity: 1;

        transform:
            translateX(0);

    }

}


.ccw-interest-label {

    display: inline-block;

    margin-bottom: 18px;

    color: var(--ccw-blue);

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 2px;

}


.ccw-interest-label::before {

    content: "";

    display: inline-block;

    width: 8px;
    height: 8px;

    margin-right: 8px;

    background: var(--ccw-light-blue);

    border-radius: 50%;

}


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

.ccw-interest-intro h2 {

    margin: 0 0 25px;

    color: var(--ccw-blue);

    font-family:
        "Oswald",
        sans-serif;

    font-size: 40px;

    line-height: 1;

    font-weight: 500;

    letter-spacing: 1px;
}


.ccw-interest-intro h2 span {

    color: #427eb5;

}


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

.ccw-interest-intro>p {

    max-width: 420px;

    margin: 0;

    color: var(--ccw-muted);

    font-size: 14px;

    line-height: 1.8;

}


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

.ccw-interest-line {

    width: 80px;

    height: 3px;

    margin: 30px 0;

    background:
        linear-gradient(90deg,
            var(--ccw-blue),
            var(--ccw-light-blue));

    border-radius: 10px;

}


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

.ccw-interest-note {

    display: flex;

    align-items: center;

    gap: 13px;

}


.ccw-interest-note>i {

    width: 48px;
    height: 48px;

    display: flex;

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

    color: var(--ccw-blue);

    background:
        rgba(168, 213, 255, .35);

    border: 1px solid rgba(2, 34, 82, .10);

    border-radius: 14px;

    font-size: 18px;

}


.ccw-interest-note strong {

    display: block;

    color: var(--ccw-blue);

    font-size: 14px;

}


.ccw-interest-note span {

    display: block;

    margin-top: 3px;

    color: var(--ccw-muted);

    font-size: 11px;

}


/* =========================================================
   ACCORDION
========================================================= */

.ccw-course-accordion {

    width: 100%;

}


/* =========================================================
   ACCORDION ITEM
========================================================= */

.ccw-accordion-item {

    margin-bottom: 12px;

    overflow: hidden;

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

    border: 1px solid rgba(168, 213, 255, .75);

    border-radius: 18px;

    box-shadow:
        0 7px 25px rgba(2, 34, 82, .035);

    transition:
        background .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;

}


.ccw-accordion-item:hover {

    border-color:
        rgba(2, 34, 82, .22);

}


.ccw-accordion-item.active {

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

    border-color:
        rgba(2, 34, 82, .16);

    box-shadow:
        0 15px 35px rgba(2, 34, 82, .08);

}


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

.ccw-accordion-header {

    width: 100%;

    min-height: 82px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    padding: 14px 18px;

    color: var(--ccw-blue);

    background: transparent;

    border: 0;

    cursor: pointer;

    text-align: left;

}


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

.ccw-accordion-heading {

    display: flex;

    align-items: center;

    gap: 15px;

}


.ccw-accordion-number {

    width: 35px;

    color: #8a9eb5;

    font-family:
        "Oswald",
        sans-serif;

    font-size: 15px;

    font-weight: 500;

}


.ccw-accordion-icon {

    width: 48px;
    height: 48px;

    display: flex;

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

    color: var(--ccw-blue);

    background:
        rgba(168, 213, 255, .35);

    border: 1px solid rgba(168, 213, 255, .7);

    border-radius: 13px;

    font-size: 18px;

    transition: all .35s ease;

}


.ccw-accordion-title {

    color: var(--ccw-blue);

    font-size: 18px;

    font-weight: 700;

}


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

.ccw-accordion-item.active .ccw-accordion-icon {

    color: #fff;

    background:
        var(--ccw-blue);

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

    transform:
        rotate(-3deg);

}


.ccw-accordion-item.active .ccw-accordion-title {

    color: var(--ccw-blue);

}


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

.ccw-accordion-arrow {

    width: 40px;
    height: 40px;

    flex-shrink: 0;

    display: flex;

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

    color: var(--ccw-blue);

    background:
        rgba(168, 213, 255, .25);

    border-radius: 50%;

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

}


.ccw-accordion-arrow i {

    transition:
        transform .4s ease;

}


.ccw-accordion-item.active .ccw-accordion-arrow {

    color: #fff;

    background:
        var(--ccw-blue);

}


.ccw-accordion-item.active .ccw-accordion-arrow i {

    transform:
        rotate(45deg);

}


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

.ccw-accordion-content {

    display: grid;

    grid-template-rows: 0fr;

    transition:
        grid-template-rows .5s cubic-bezier(.4, 0, .2, 1);

}


.ccw-accordion-item.active .ccw-accordion-content {

    grid-template-rows: 1fr;

}


.ccw-course-grid {

    min-height: 0;

    overflow: hidden;

    display: grid;

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

    gap: 12px;

    padding: 0 18px;

    transition:
        padding .4s ease;

}


.ccw-accordion-item.active .ccw-course-grid {

    padding:
        5px 18px 18px;

}


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

.ccw-course-card {

    position: relative;

    min-height: 72px;

    display: flex;

    align-items: center;

    gap: 12px;

    padding: 10px 13px;

    color: var(--ccw-blue);

    background:
        linear-gradient(135deg,
            #f8fbff,
            #edf7ff);

    border: 1px solid #d9ecfb;

    border-radius: 13px;

    text-decoration: none;

    overflow: hidden;

    opacity: 0;

    transform:
        translateY(12px);

}


.ccw-accordion-item.active .ccw-course-card {

    animation:
        ccwCourseReveal .45s ease forwards;

}


.ccw-accordion-item.active .ccw-course-card:nth-child(1) {
    animation-delay: .05s;
}

.ccw-accordion-item.active .ccw-course-card:nth-child(2) {
    animation-delay: .10s;
}

.ccw-accordion-item.active .ccw-course-card:nth-child(3) {
    animation-delay: .15s;
}

.ccw-accordion-item.active .ccw-course-card:nth-child(4) {
    animation-delay: .20s;
}

.ccw-accordion-item.active .ccw-course-card:nth-child(5) {
    animation-delay: .25s;
}

.ccw-accordion-item.active .ccw-course-card:nth-child(6) {
    animation-delay: .30s;
}


@keyframes ccwCourseReveal {

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


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

.ccw-course-icon {

    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    display: flex;

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

    color: var(--ccw-blue);

    background:
        #fff;

    border: 1px solid #cde6f9;

    border-radius: 11px;

    transition: all .3s ease;

}


.ccw-course-card>span:nth-child(2) {

    flex: 1;

    color: var(--ccw-blue);

    font-size: 13px;

    font-weight: 700;

    line-height: 1.4;

}


.ccw-course-card>i {

    color: #77a9d2;

    font-size: 11px;

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

}


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

.ccw-course-card:hover {

    color: var(--ccw-blue);

    background:
        var(--ccw-blue);

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

    transform:
        translateY(-3px);

    box-shadow:
        0 10px 22px rgba(2, 34, 82, .14);

}


.ccw-course-card:hover .ccw-course-icon {

    color: var(--ccw-blue);

    background:
        var(--ccw-light-blue);

    border-color:
        var(--ccw-light-blue);

    transform:
        scale(1.05);

}


.ccw-course-card:hover>span:nth-child(2) {

    color: #fff;

}


.ccw-course-card:hover>i {

    color: var(--ccw-light-blue);

    transform:
        translateX(4px);

}


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

@media (max-width: 1100px) {

    .ccw-interest-layout {

        grid-template-columns:
            30% 70%;

        gap: 30px;

    }

    .ccw-interest-intro h2 {

        font-size: 45px;

    }

    .ccw-accordion-title {

        font-size: 16px;

    }

}


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

@media (max-width: 767px) {

    .ccw-interest-section {

padding: 30px 0;

}


    .ccw-interest-layout {

        display: block;

    }


    .ccw-interest-intro {

        padding-right: 0;

        margin-bottom: 30px;

    }


    .ccw-interest-intro h2 {

        font-size: 42px;

    }


    .ccw-interest-intro>p {

        max-width: 100%;

    }


    .ccw-interest-line {

        margin: 20px 0;

    }


    .ccw-accordion-header {

        min-height: 70px;

        padding: 10px 12px;

    }


    .ccw-accordion-heading {

        gap: 10px;

    }


    .ccw-accordion-number {

        display: none;

    }


    .ccw-accordion-icon {

        width: 42px;
        height: 42px;

        flex-basis: 42px;

    }


    .ccw-accordion-title {

        font-size: 15px;

    }


    .ccw-accordion-arrow {

        width: 34px;
        height: 34px;

    }


    .ccw-course-grid {

        grid-template-columns: 1fr;

        padding-left: 12px;
        padding-right: 12px;

    }


    .ccw-accordion-item.active .ccw-course-grid {

        padding:
            5px 12px 12px;

    }


    .ccw-course-card {

        min-height: 65px;

    }

}


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

@media (max-width: 450px) {

    .ccw-interest-intro h2 {

font-size: 30px;

}


    .ccw-interest-label {

        font-size: 11px;

    }


    .ccw-accordion-title {

        font-size: 14px;

    }


    .ccw-course-card>span:nth-child(2) {

        font-size: 12px;

    }

}

/* =========================================================
   PROMINENT RECRUITERS
========================================================= */

:root {

    --recruiter-cream: #fff6df;
    --recruiter-dark: #3b2112;
    --recruiter-gold: #d69b2d;
    --recruiter-gold-light: #e7b34b;

    --recruiter-card: #fffaf0;

}


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

.ccw-recruiters-section {

    position: relative;

    padding: 0 0px 30px;

    overflow: hidden;

    background: #eef7ff;
}


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

.ccw-recruiters-heading {

    text-align: center;

    max-width: 900px;

    margin: 0 auto 30px;

}


.ccw-recruiters-heading h2 {

    margin: 0;

    color: var(--rit-blue);

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

    font-size: 35px;

    line-height: 1.05;

    font-weight: 700;

    text-transform: uppercase;

    animation:
        recruiterHeadingIn .8s ease both;
}


@keyframes recruiterHeadingIn {

    from {

        opacity: 0;

        transform:
            translateY(-25px);

    }

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


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

.ccw-heading-divider {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 14px;

    margin: 15px auto 15px;
}


.ccw-heading-divider span {

    width: 130px;

    height: 1px;

    background: linear-gradient(90deg,
            transparent,
            var(--rit-blue));
}


.ccw-heading-divider span:last-child {

    background: linear-gradient(90deg, var(--rit-blue), transparent);
}


.ccw-heading-divider i {

    color: var(--rit-blue);

    font-size: 10px;

    transform: rotate(90deg);
}


.ccw-recruiters-heading p {

    margin: 0;

    color: #4e4a45;

    font-size: 15px;

    line-height: 1.8;

}


.bottom-divider {

    margin-top: 15px;

    margin-bottom: 15px;
}


/* =========================================================
   MAIN DARK PANEL
========================================================= */

.ccw-recruiters-box {

position: relative;

max-width: 1260px;

margin: auto;

padding: 27px;

background: linear-gradient(145deg, #082352, #95c0ff);

border-radius: 30px;

box-shadow: 0px 10px 9px rgba(61, 35, 13, .18);

animation:
        recruiterPanelIn 1s .2s ease both;
}


@keyframes recruiterPanelIn {

    from {

        opacity: 0;

        transform:
            translateY(35px) scale(.98);

    }

    to {

        opacity: 1;

        transform:
            translateY(0) scale(1);

    }

}


/* =========================================================
   INNER GOLD BORDER
========================================================= */

.ccw-recruiters-box::before {

    content: "";

    position: absolute;

    inset: 7px;

    pointer-events: none;

    border: 1px solid rgba(218, 158, 48, .18);

    border-radius: 25px;

}


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

.ccw-recruiter-grid {

    position: relative;

    z-index: 2;

    display: grid;

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

    gap: 16px;

}


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

.ccw-recruiter-card {

    position: relative;

    height: 115px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 15px;

    overflow: hidden;

    background:
        #fffaf0;

    border: 1px solid rgba(220, 195, 150, .35);

    border-radius: 20px;

    text-decoration: none;

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

    opacity: 0;

    transform:
        translateY(25px);

    animation:
        recruiterCardIn .55s ease forwards;

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        background .35s ease;

}


/* stagger */

.ccw-recruiter-card:nth-child(1) {
    animation-delay: .15s;
}

.ccw-recruiter-card:nth-child(2) {
    animation-delay: .20s;
}

.ccw-recruiter-card:nth-child(3) {
    animation-delay: .25s;
}

.ccw-recruiter-card:nth-child(4) {
    animation-delay: .30s;
}

.ccw-recruiter-card:nth-child(5) {
    animation-delay: .35s;
}

.ccw-recruiter-card:nth-child(6) {
    animation-delay: .40s;
}

.ccw-recruiter-card:nth-child(7) {
    animation-delay: .45s;
}

.ccw-recruiter-card:nth-child(8) {
    animation-delay: .50s;
}

.ccw-recruiter-card:nth-child(9) {
    animation-delay: .55s;
}

.ccw-recruiter-card:nth-child(10) {
    animation-delay: .60s;
}

.ccw-recruiter-card:nth-child(11) {
    animation-delay: .65s;
}

.ccw-recruiter-card:nth-child(12) {
    animation-delay: .70s;
}

.ccw-recruiter-card:nth-child(13) {
    animation-delay: .75s;
}

.ccw-recruiter-card:nth-child(14) {
    animation-delay: .80s;
}

.ccw-recruiter-card:nth-child(15) {
    animation-delay: .85s;
}

.ccw-recruiter-card:nth-child(16) {
    animation-delay: .90s;
}

.ccw-recruiter-card:nth-child(17) {
    animation-delay: .95s;
}

.ccw-recruiter-card:nth-child(18) {
    animation-delay: 1s;
}

.ccw-recruiter-card:nth-child(19) {
    animation-delay: 1.05s;
}

.ccw-recruiter-card:nth-child(20) {
    animation-delay: 1.10s;
}

.ccw-recruiter-card:nth-child(21) {
    animation-delay: 1.15s;
}


@keyframes recruiterCardIn {

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


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

.ccw-recruiter-card img {

    max-width: 85%;

    max-height: 70px;

    width: auto;

    height: auto;

    object-fit: contain;

    transition:
        transform .45s ease,
        filter .45s ease;

}


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

.ccw-recruiter-card:hover {

    transform:
        translateY(-7px);

    background: #ffffff;

    border-color:
        rgba(214, 155, 45, .55);

    box-shadow:
        0 15px 30px rgba(0, 0, 0, .18);

}


.ccw-recruiter-card:hover img {

    transform:
        scale(1.08);

}


/* =========================================================
   GOLD SHINE EFFECT
========================================================= */

.ccw-recruiter-card::after {

    content: "";

    position: absolute;

    top: 0;

    left: -120%;

    width: 60%;

    height: 100%;

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

    transform: skewX(-20deg);

    transition:
        left .7s ease;

}


.ccw-recruiter-card:hover::after {

    left: 140%;

}


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

@media (max-width: 1100px) {

    .ccw-recruiters-box {

        margin: 0 20px;

    }

    .ccw-recruiter-grid {

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

    }

}


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

@media (max-width: 767px) {

    .ccw-recruiters-section {

padding: 30px 0;

}

    .ccw-recruiters-heading {

        padding: 0 15px;

    }

    .ccw-recruiters-heading h2 {

        font-size: 34px;

    }

    .ccw-recruiters-heading p {

        font-size: 12px;

    }

    .ccw-heading-divider span {

        width: 70px;

    }

    .ccw-recruiters-box {

        margin: 0 12px;

        padding: 18px;

        border-radius: 22px;

    }

    .ccw-recruiter-grid {

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

        gap: 10px;

    }

    .ccw-recruiter-card {

        height: 90px;

        padding: 10px;

        border-radius: 14px;

    }

    .ccw-recruiter-card img {

        max-height: 55px;

    }

}


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

@media (max-width: 400px) {

    .ccw-recruiters-heading h2 {

font-size: 25px;

}

    .ccw-recruiters-box {

        padding: 12px;

    }

    .ccw-recruiter-grid {

        gap: 8px;

    }

    .ccw-recruiter-card {

        height: 78px;

    }

}

/* =========================================================
   RECRUITER SINGLE IMAGE SLIDER
========================================================= */

:root {

    --recruiter-blue: #022252;
    --recruiter-light: #A8D5FF;

    --recruiter-cream: #fff6df;

}


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

.recruiter-slider-section {

    position: relative;

    padding: 80px 0;

    overflow: hidden;

    background:
        linear-gradient(135deg,
            #fff9eb,
            #fff2d7);

}


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

.recruiter-slider-heading {

    max-width: 800px;

    margin: 0 auto 35px;

    text-align: center;

}


.recruiter-slider-heading span {

    display: inline-block;

    margin-bottom: 10px;

    color: #8c671f;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 2px;

}


.recruiter-slider-heading h2 {

    margin: 0 0 15px;

    color: #402719;

    font-family:
        "Playfair Display",
        Georgia,
        serif;

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

    font-weight: 700;

    line-height: 1.1;

}


.recruiter-slider-heading p {

    max-width: 650px;

    margin: auto;

    color: #62574b;

    font-size: 14px;

    line-height: 1.8;

}


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

.recruiter-slider-box {

    position: relative;

    max-width: 1100px;

    margin: auto;

    padding: 35px 80px 55px;

    background:
        linear-gradient(145deg,
            #422615,
            #2e1b0e);

    border-radius: 30px;

    box-shadow:
        0 25px 55px rgba(55, 32, 10, .18);

}


/* Inner border */

.recruiter-slider-box::before {

    content: "";

    position: absolute;

    inset: 8px;

    border: 1px solid rgba(221, 164, 49, .25);

    border-radius: 24px;

    pointer-events: none;

}


/* =========================================================
   SWIPER
========================================================= */

.recruiterSwiper {

    position: relative;

    overflow: hidden;

}


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

.recruiterSwiper .swiper-slide {

    display: flex;

    align-items: center;

    justify-content: center;

}


/* =========================================================
   SINGLE IMAGE CARD
========================================================= */

.recruiter-single-card {

    width: 100%;

    height: 431px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 19px;

    background: var(--rit-sky-blue);

    border: 1px solid rgba(225, 200, 155, .6);

    border-radius: 24px;

    transition:
        transform .5s ease,
        box-shadow .5s ease;
}


.recruiter-single-card:hover {

    transform:
        translateY(-5px);

    box-shadow:
        0 20px 40px rgba(0, 0, 0, .18);

}


.recruiter-single-card img {

    max-width: 100%;

    max-height: 380px;

    width: auto;

    height: auto;

    object-fit: cover;

    transition:
        transform .6s ease;
}


.recruiter-single-card:hover img {

    transform:
        scale(1.08);

}


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

.recruiter-prev,
.recruiter-next {

    width: 48px !important;

    height: 48px !important;

    margin-top: -24px !important;

    display: flex !important;

    align-items: center;

    justify-content: center;

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

    background: var(--recruiter-light);

    border-radius: 50%;

    transition:
        all .3s ease;

}


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

    color: #fff !important;

    background:
        var(--recruiter-blue);

    transform:
        scale(1.08);

}


.recruiter-prev {

    left: 15px !important;

}


.recruiter-next {

    right: 15px !important;

}


.recruiter-prev::after,
.recruiter-next::after {

    display: none;

}


.recruiter-prev i,
.recruiter-next i {

    font-size: 15px;

}


/* =========================================================
   PAGINATION
========================================================= */

.recruiter-pagination {

    bottom: 8px !important;

}


.recruiter-pagination .swiper-pagination-bullet {

    width: 8px;

    height: 8px;

    opacity: 1;

    background:
        rgba(168, 213, 255, .35);

    transition:
        all .3s ease;

}


.recruiter-pagination .swiper-pagination-bullet-active {

    width: 28px;

    border-radius: 10px;

    background:
        var(--recruiter-light);

}


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

@media (max-width: 767px) {

    .recruiter-slider-section {

        padding: 55px 0;

    }


    .recruiter-slider-heading {

        padding: 0 15px;

    }


    .recruiter-slider-heading h2 {

        font-size: 34px;

    }


    .recruiter-slider-heading p {

        font-size: 12px;

    }


    .recruiter-slider-box {

        margin: 0 15px;

        padding:
            25px 55px 50px;

        border-radius: 23px;

    }


    .recruiter-single-card {

        height: 240px;

        padding: 25px;

        border-radius: 18px;

    }


    .recruiter-single-card img {

        max-width: 80%;

        max-height: 150px;

    }


    .recruiter-prev,
    .recruiter-next {

        width: 38px !important;

        height: 38px !important;

        margin-top: -19px !important;

    }


    .recruiter-prev {

        left: 8px !important;

    }


    .recruiter-next {

        right: 8px !important;

    }

}


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

@media (max-width: 450px) {

    .recruiter-slider-box {

        padding:
            20px 48px 45px;

    }


    .recruiter-single-card {

        height: 190px;

    }


    .recruiter-single-card img {

        max-height: 110px;

    }

}

/* =========================================================
   PLACEMENT JOURNEY
========================================================= */

:root {
    --placement-blue: #022252;
    --placement-light-blue: #A8D5FF;
    --placement-gold: #c99528;
    --placement-gold-light: #e4c47d;
    --placement-cream: #fff6df;
    --placement-text: #4f4a43;
}


/* SECTION */

.placement-journey {

position: relative;

overflow: hidden;

padding: 30px 0 40px;

background: #ffffff;
}


/* soft background */

.placement-journey::before {

content: "";

position: absolute;

width: 450px;

height: 450px;

left: 50%;

top: 50%;

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

border-radius: 50%;

background: rgb(238 247 255);

filter: blur(60px);

pointer-events: none;
}


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

.placement-heading {

position: relative;

z-index: 2;

text-align: center;

margin-bottom: 30px;
}


.placement-heading h2 {

margin: 0 0 15px;

color: #21170f;

font-family:
        "Playfair Display",
        Georgia,
        serif;

font-size: 35px;

line-height: 1.1;

font-weight: 700;
}


.placement-heading p {

    margin: 0;

    color: #514b43;

    font-size: 15px;

}


/* =========================================================
   TIMELINE
========================================================= */

.placement-timeline {

position: relative;

z-index: 2;

display: flex;

align-items: flex-start;

justify-content: center;

margin: auto;
}


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

.placement-step {

    width: 165px;

    flex-shrink: 0;

    text-align: center;

    opacity: 0;

    transform:
        translateY(30px);

    animation:
        placementStepIn .7s ease forwards;

}


.placement-step:nth-of-type(1) {
    animation-delay: .1s;
}

.placement-step:nth-of-type(3) {
    animation-delay: .25s;
}

.placement-step:nth-of-type(5) {
    animation-delay: .4s;
}

.placement-step:nth-of-type(7) {
    animation-delay: .55s;
}

.placement-step:nth-of-type(9) {
    animation-delay: .7s;
}


@keyframes placementStepIn {

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


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

.placement-icon {

position: relative;

width: 76px;

height: 76px;

margin: 0 auto 15px;

display: flex;

align-items: center;

justify-content: center;

color: var(--rit-blue);

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

border: 2px solid        var(--rit-sky-blue);

border-radius: 50%;

font-size: 25px;

box-shadow:
        0 10px 25px
        rgba(145,105,32,.08);

transition:
        transform .4s ease,
        background .4s ease,
        color .4s ease,
        box-shadow .4s ease;
}


/* outer ring */

.placement-icon::before {

content: "";

position: absolute;

inset: -7px;

border: 1px solid #cce0f3;

border-radius: 50%;
}


/* icon hover */

.placement-step:hover
.placement-icon {

    color: #fff;

    background:
        var(--placement-blue);

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

    transform:
        translateY(-7px)
        scale(1.05);

    box-shadow:
        0 15px 30px
        rgba(2,34,82,.18);

}


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

.placement-step h3 {

    min-height: 43px;

    margin: 0 0 6px;

    color: #17120e;

    font-size: 15px;

    line-height: 1.3;

    font-weight: 700;

}


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

.placement-step p {

margin: 0;

color: #000000;

font-size: 12px;

line-height: 1.5;
}


/* =========================================================
   CONNECTOR
========================================================= */

.placement-connector {

width: 45px;

height: 1px;

flex-shrink: 0;

margin-top: 37px;

border-top: 2px dashed        var(--rit-sky-blue);

opacity: 0;

animation:
        connectorReveal .5s ease forwards;
}


.placement-connector:nth-of-type(2) {
    animation-delay: .3s;
}

.placement-connector:nth-of-type(4) {
    animation-delay: .45s;
}

.placement-connector:nth-of-type(6) {
    animation-delay: .6s;
}

.placement-connector:nth-of-type(8) {
    animation-delay: .75s;
}


@keyframes connectorReveal {

    from {
        opacity: 0;
        transform: scaleX(0);
    }

    to {
        opacity: 1;
        transform: scaleX(1);
    }

}


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

.placement-success {

    position: relative;

    width: 205px;

    min-height: 235px;

    flex-shrink: 0;

    margin-left: 5px;

    padding: 25px 20px;

    text-align: center;

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

    border: 1px solid
        #e6d7ba;

    border-radius: 18px;

    box-shadow:
        0 12px 30px
        rgba(70,48,15,.08);

    opacity: 0;

    transform:
        translateY(30px);

    animation:
        successCardIn .8s 1s ease forwards;

}


@keyframes successCardIn {

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


/* =========================================================
   SUCCESS CAP
========================================================= */

.success-cap {

    width: 75px;

    height: 65px;

    margin: 0 auto 10px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #191919;

    font-size: 46px;

}


.success-cap i {

    color: var(--placement-gold);

    filter:
        drop-shadow(
            0 5px 4px
            rgba(0,0,0,.12)
        );

}


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

.placement-success h3 {

    margin: 0 0 12px;

    color: var(--placement-gold);

    font-size: 13px;

    line-height: 1.45;

    font-weight: 800;

    letter-spacing: 1px;

}


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

.placement-success p {

    margin: 0;

    color: #63584d;

    font-size: 12px;

    line-height: 1.7;

}


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

.placement-success:hover {

    transform:
        translateY(-7px) !important;

    box-shadow:
        0 20px 40px
        rgba(70,48,15,.13);

    border-color:
        var(--placement-gold-light);

}


.placement-success:hover
.success-cap {

    animation:
        capBounce .8s ease;

}


@keyframes capBounce {

    0%,100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-8px);
    }

    70% {
        transform: translateY(-3px);
    }

}


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

@media (max-width: 1100px) {

    .placement-timeline {

        padding: 0 20px;

    }

    .placement-step {

        width: 135px;

    }

    .placement-connector {

        width: 25px;

    }

    .placement-success {

        width: 180px;

    }

}


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

@media (max-width: 767px) {

    .placement-journey {

padding: 30px 0;

}


    .placement-heading {

        margin-bottom: 35px;

        padding: 0 20px;

    }


    .placement-heading h2 {

font-size: 25px;

}


    .placement-heading p {

        font-size: 13px;

        line-height: 1.6;

    }


    /* vertical timeline */

    .placement-timeline {

        display: flex;

        flex-direction: column;

        align-items: center;

        padding: 0 20px;

    }


    .placement-step {

width: 100%;

max-width: 330px;

min-height: 65px;

display: grid;

grid-template-columns: 75px 1fr;

column-gap: 20px;

text-align: left;

}


    .placement-icon {

        grid-row: span 2;

        margin: 0;

    }


    .placement-step h3 {

align-self: end;

min-height: auto;

margin-bottom: 3px;

}


    .placement-step p {

        align-self: start;

    }


    /* vertical connector */

    .placement-connector {

width: 2px;

height: 35px;

margin: 0 0 0 -232px;

border-top: 0;

border-left:
            2px dashed
            #dfc17d;

}


    .placement-success {

        width: 100%;

        max-width: 330px;

        min-height: auto;

        margin: 10px 0 0;

    }

}


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

@media (max-width: 400px) {

    .placement-step {

max-width: 300px;

grid-template-columns: 65px 1fr;

gap: 15px;

}


    .placement-icon {

        width: 65px;
        height: 65px;

        font-size: 21px;

    }


    .placement-step h3 {

        font-size: 14px;

    }


    .placement-step p {

        font-size: 11px;

    }

}

/* =========================================================
   COLLAGE IMAGE SECTION
========================================================= */

:root {
    --collage-blue: #022252;
    --collage-light: #A8D5FF;
    --collage-cream: #fff6df;
    --collage-gold: #c99735;
}


/* SECTION */

.ccw-collage-section {
    position: relative;
    padding: 30px 0 40px;
    overflow: hidden;
    background: #e2f1ff;
}


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

.ccw-collage-heading {
    text-align: center;
    max-width: 700px;
    margin: 0 auto 45px;

    animation: collageHeading .8s ease both;
}

.ccw-collage-heading span {
    display: block;
    margin-bottom: 8px;

    color: var(--collage-blue);

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

    letter-spacing: 3px;
}

.ccw-collage-heading h2 {
    margin: 0 0 15px;
    color: var(--collage-blue);
    font-family:
        "Oswald",
        sans-serif;
    font-size: 35px;
    font-weight: 500;
    line-height: 1;
}

.ccw-collage-heading p {
    margin: 0;

    color: #637083;

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


@keyframes collageHeading {

    from {
        opacity: 0;
        transform: translateY(-25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


/* =========================================================
   COLLAGE
========================================================= */

.ccw-collage {

    position: relative;

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

    height: 600px;

    margin: auto;
}


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

.collage-img {

    position: absolute;

    overflow: hidden;

    background: #eee;

    border: 5px solid #fff;

    border-radius: 22px;

    box-shadow:
        0 18px 45px
        rgba(2,34,82,.15);

    opacity: 0;

    transform:
        translateY(40px)
        scale(.94);

    animation:
        collageImageIn .8s ease forwards;

}


/* image */

.collage-img img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

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


/* dark gradient */

.collage-img::after {

    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            transparent 50%,
            rgba(0,0,0,.55)
        );

    pointer-events: none;

}


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


/* MAIN */

.collage-main {

    left: 0;
    top: 0;

    width: 43%;
    height: 430px;

    z-index: 3;

    animation-delay: .1s;
}


/* TOP */

.collage-top {

    left: 45%;

    top: 0;

    width: 25%;
    height: 235px;

    z-index: 2;

    animation-delay: .25s;
}


/* TOP RIGHT */

.collage-top-right {

    right: 0;

    top: 0;

    width: 27%;

    height: 185px;

    z-index: 2;

    animation-delay: .35s;
}


/* CENTER */

.collage-center {

left: 45%;

top: 255px;

width: 25%;

height: 345px;

z-index: 2;

animation-delay: .45s;
}


/* BOTTOM LEFT */

.collage-bottom-left {

    left: 0;

    bottom: 0;

    width: 20%;

    height: 155px;

    z-index: 4;

    animation-delay: .55s;
}


/* BOTTOM CENTER */

.collage-bottom-center {

    left: 22%;

    bottom: 0;

    width: 21%;

    height: 155px;

    z-index: 4;

    animation-delay: .65s;
}


/* RIGHT */

.collage-right {

    right: 0;

    top: 205px;

    width: 27%;

    height: 195px;

    z-index: 3;

    animation-delay: .75s;
}


/* RIGHT BOTTOM */

.collage-right-bottom {

    right: 0;

    bottom: 0;

    width: 27%;

    height: 185px;

    z-index: 3;

    animation-delay: .85s;
}


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

@keyframes collageImageIn {

    from {
        opacity: 0;

        transform:
            translateY(45px)
            scale(.92);
    }

    to {
        opacity: 1;

        transform:
            translateY(0)
            scale(1);
    }

}


/* =========================================================
   FLOATING ANIMATION
========================================================= */

.collage-main {
    animation:
        collageImageIn .8s .1s ease forwards,
        collageFloat 7s 1s ease-in-out infinite;
}

.collage-top {
    animation:
        collageImageIn .8s .25s ease forwards,
        collageFloat 6s 1.2s ease-in-out infinite reverse;
}

.collage-top-right {
    animation:
        collageImageIn .8s .35s ease forwards,
        collageFloat 8s 1.3s ease-in-out infinite;
}

.collage-center {
    animation:
        collageImageIn .8s .45s ease forwards,
        collageFloat 7s 1.5s ease-in-out infinite reverse;
}


@keyframes collageFloat {

    0%, 100% {
        transform:
            translateY(0);
    }

    50% {
        transform:
            translateY(-8px);
    }

}


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

.collage-img:hover img {

    transform:
        scale(1.1);

    filter:
        saturate(1.12)
        contrast(1.04);
}


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

.collage-tag {

    position: absolute;

    left: 15px;
    bottom: 14px;

    z-index: 5;

    padding: 9px 15px;

    color: #fff;

    background:
        rgba(2,34,82,.92);

    border-radius: 20px;

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

    backdrop-filter:
        blur(8px);

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


.collage-img:hover .collage-tag {

    transform:
        translateY(-5px);

    background:
        #164d83;
}


/* =========================================================
   DECORATIVE GOLD DOT
========================================================= */

.ccw-collage::before {

    content: "";

    position: absolute;

    width: 80px;
    height: 80px;

    left: 41%;
    top: 43%;

    border-radius: 50%;

    border:
        2px dashed
        rgba(201,151,53,.3);

    animation:
        collageRotate 12s linear infinite;

    z-index: 1;
}


@keyframes collageRotate {

    to {
        transform:
            rotate(360deg);
    }

}


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

@media (max-width: 991px) {

    .ccw-collage {
        height: 520px;
    }

    .collage-main {
        width: 42%;
        height: 370px;
    }

    .collage-top {
        left: 44%;
        width: 27%;
        height: 200px;
    }

    .collage-top-right {
        width: 28%;
        height: 160px;
    }

    .collage-center {
        left: 44%;
        top: 220px;
        width: 40%;
        height: 300px;
    }

    .collage-right {
        top: 180px;
        width: 28%;
        height: 160px;
    }

    .collage-right-bottom {
        width: 28%;
        height: 160px;
    }

}


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

@media (max-width: 767px) {

    .ccw-collage-section {
        padding: 30px 0 30px;
    }

    .ccw-collage-heading {
        margin-bottom: 30px;
        padding: 0 15px;
    }

    .ccw-collage-heading h2 {
        font-size: 36px;
    }

    .ccw-collage {
        height: auto;

        display: grid;

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

        grid-template-rows:
            240px
            150px
            150px
            180px;

        gap: 8px;
    }


    /* Reset absolute positioning */

    .collage-img {
        position: relative;

        left: auto;
        right: auto;
        top: auto;
        bottom: auto;

        width: auto;
        height: auto;

        min-height: 0;

        border-width: 3px;

        border-radius: 15px;
    }


    .collage-main {
        grid-column: 1 / 3;
        grid-row: 1;
    }

    .collage-top {
        grid-column: 1;
        grid-row: 2;
    }

    .collage-top-right {
        grid-column: 2;
        grid-row: 2;
    }

    .collage-center {
        grid-column: 1 / 3;
        grid-row: 3;
    }

    .collage-bottom-left {
        grid-column: 1;
        grid-row: 4;
    }

    .collage-bottom-center {
        grid-column: 2;
        grid-row: 4;
    }

    .collage-right,
    .collage-right-bottom {
        display: none;
    }


    .collage-tag {
        left: 8px;
        bottom: 8px;

        padding: 7px 10px;

        font-size: 10px;
    }


    .ccw-collage::before {
        display: none;
    }

}


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

@media (max-width: 450px) {

    .ccw-collage-heading h2 {
        font-size: 31px;
    }

    .ccw-collage-heading p {
        font-size: 12px;
    }

    .ccw-collage {
        grid-template-rows:
            210px
            130px
            145px
            150px;
    }

}

/* =========================================================
   GRADUATION CHRONICLES
========================================================= */

:root {

    --grad-cream: #fff5dc;

    --grad-burgundy: #5b1018;

    --grad-burgundy-dark: #3f0b11;

    --grad-gold: #bd7818;

    --grad-gold-light: #d9b47a;

    --grad-text: #44372d;

}


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

.graduation-chronicles {

position: relative;

overflow: hidden;

padding: 30px 0 30px;

background: #eaf2ff;
}


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

.graduation-chronicles::before {

content: "";

position: absolute;

width: 500px;

height: 500px;

right: -150px;

top: -180px;

border-radius: 50%;

background: rgb(229 242 255);

filter: blur(40px);

pointer-events: none;
}


/* =========================================================
   ROW
========================================================= */

.graduation-row {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns: 48% 52%;

    align-items: center;

    gap: 20px;

}


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

.graduation-content {

    padding-left: 5px;

}


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

.legacy-label {

display: flex;

align-items: center;

gap: 12px;

margin-bottom: 10px;

color: var(--rit-blue);

font-size: 12px;

font-weight: 800;

letter-spacing: 1.5px;
}


.legacy-label span {

width: 25px;

height: 1px;

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


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

.graduation-title {

    position: relative;

    margin-bottom: 12px;

}


.graduation-title span {

position: relative;

z-index: 1;

display: block;

margin-bottom: 0px;

color: #3973ca;

font-family:
        "Brush Script MT",
        "Segoe Script",
        cursive;

font-size: 48px;

font-style: italic;

font-weight: 400;

line-height: 1;
}


.graduation-title h2 {

position: relative;

z-index: 2;

margin: 0;

color: var(--rit-blue);

font-family:
        "Playfair Display",
        Georgia,
        serif;

font-size: 40px;

font-weight: 700;

line-height: .95;

letter-spacing: -2px;
}


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

.graduation-divider {

    display: flex;

    align-items: center;

    gap: 18px;

    margin: 25px 0;

}


.graduation-divider > span {

flex: 1;

height: 1px;

background: #3b75cb;
}


.divider-logo {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 30px;

    height: 30px;

    font-size: 17px;

}


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

.graduation-description {

    max-width: 690px;

    margin: 0 0 28px;

    color: #493e34;

    font-size: 14px;

    line-height: 1.8;

}


/* =========================================================
   STATS
========================================================= */

.graduation-stats {

    display: grid;

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

    gap: 10px;

}


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

.graduation-stat {

min-height: 150px;

padding: 18px 10px;

display: flex;

flex-direction: column;

align-items: center;

justify-content: center;

text-align: center;

background: var(--rit-blue);

border: 1px solid
        #eadfc9;

border-radius: 16px;

box-shadow:
        0 8px 25px
        rgba(78,49,20,.05);

opacity: 0;

transform:
        translateY(25px);

animation:
        statReveal .7s ease forwards;

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


.graduation-stat:nth-child(1) {
    animation-delay: .15s;
}

.graduation-stat:nth-child(2) {
    animation-delay: .25s;
}

.graduation-stat:nth-child(3) {
    animation-delay: .35s;
}

.graduation-stat:nth-child(4) {
    animation-delay: .45s;
}


@keyframes statReveal {

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


/* Hover */

.graduation-stat:hover {

    transform:
        translateY(-8px);

    border-color:
        var(--grad-gold-light);

    box-shadow:
        0 18px 35px
        rgba(78,49,20,.12);

}


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

.stato-icon {

width: 38px;

height: 38px;

display: flex;

align-items: center;

justify-content: center;

margin-bottom: 12px;

color: var(--rit-blue);

background: var(--rit-sky-blue);

border-radius: 50%;

font-size: 15px;

box-shadow:
        0 5px 15px
        rgba(189,120,24,.25);

transition:
        transform .4s ease;
}


.graduation-stat:hover .stato-icon {

    transform:
        rotate(8deg)
        scale(1.1);

}


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

.stato-number {

color: var(--rit-sky-blue);

font-family:
        "Playfair Display",
        Georgia,
        serif;

font-size: 21px;

font-weight: 700;

line-height: 1.2;
}


.stato-number span {

color: var(--rit-sky-blue);

font-size: 15px;
}


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

.stato-title {

margin-top: 8px;

color: #ffffff;

font-size: 10px;

font-weight: 800;

line-height: 1.45;

letter-spacing: .3px;
}


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

.graduation-visual {

    position: relative;

    min-height: 480px;

    display: flex;

    align-items: center;

    justify-content: center;

}


/* =========================================================
   PHOTO WRAP
========================================================= */

.graduation-photo-wrap {

    position: relative;

    width: 88%;

    height: 370px;

    transform:
        rotate(-4deg);

}


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

.photo-layer {

    position: absolute;

    inset: 0;

    background:
        #fff;

    border-radius: 3px;

    box-shadow:
        0 15px 35px
        rgba(70,45,20,.08);

}


.layer-one {

    transform:
        translateY(14px)
        rotate(2deg);

}


.layer-two {

    transform:
        translateY(7px)
        rotate(-1deg);

}


/* =========================================================
   MAIN PHOTO
========================================================= */

.graduation-photo {

    position: relative;

    z-index: 3;

    width: 100%;

    height: 100%;

    overflow: hidden;

    background: #fff;

    padding: 5px;

    box-shadow:
        0 20px 45px
        rgba(65,43,20,.18);

}


.graduation-photo img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform 1s ease;

}


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

.graduation-photo-wrap:hover .graduation-photo img {

    transform:
        scale(1.06);

}


/* =========================================================
   FLOATING PHOTO
========================================================= */

.graduation-photo-wrap {

    animation:
        graduationFloat 6s ease-in-out infinite;

}


@keyframes graduationFloat {

    0%,
    100% {

        transform:
            rotate(-4deg)
            translateY(0);

    }

    50% {

        transform:
            rotate(-4deg)
            translateY(-9px);

    }

}


/* =========================================================
   BADGE
========================================================= */

.graduation-badge {

    position: absolute;

    z-index: 10;

    right: 14%;

    bottom: 5px;

    width: 55px;

    height: 55px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #fff;

    background:
        var(--grad-burgundy);

    border: 4px solid #fff;

    border-radius: 50%;

    box-shadow:
        0 12px 25px
        rgba(61,19,20,.25);

    font-size: 18px;

    animation:
        badgeFloat 3s ease-in-out infinite;

}


@keyframes badgeFloat {

    0%,
    100% {

        transform:
            translateY(0);

    }

    50% {

        transform:
            translateY(-7px);

    }

}


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

@media (max-width: 1100px) {

    .graduation-row {

        grid-template-columns:
            1fr 1fr;

    }

    .graduation-stats {

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

    }

    .graduation-photo-wrap {

        width: 95%;

        height: 320px;

    }

}


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

@media (max-width: 767px) {

    .graduation-chronicles {

padding: 30px 0 30px;

}


    .graduation-row {

        display: flex;

        flex-direction: column;

    }


    .graduation-content {

        width: 100%;

        padding: 0 15px;

    }


    .legacy-label {

        justify-content: center;

        font-size: 10px;

    }


    .graduation-title {

        text-align: center;

    }


    .graduation-title span {

font-size: 38px;

margin-bottom: 0px;

}


    .graduation-title h2 {

        font-size: 43px;

    }


    .graduation-description {

        text-align: center;

        font-size: 13px;

    }


    .graduation-stats {

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

        gap: 9px;

    }


    .graduation-stat {

        min-height: 135px;

    }


    .graduation-visual {

width: 100%;

min-height: 340px;

margin-top: 10px;

}


    .graduation-photo-wrap {

        width: 92%;

        height: 280px;

    }


    .graduation-badge {

        right: 8%;

        bottom: 0;

        width: 48px;

        height: 48px;

        font-size: 15px;

    }

}


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

@media (max-width: 400px) {

    .graduation-title span {

        font-size: 32px;

    }

    .graduation-title h2 {

        font-size: 37px;

    }

    .graduation-stat {

        min-height: 125px;

        padding: 12px 7px;

    }

    .stat-number {

        font-size: 18px;

    }

    .stat-title {

        font-size: 9px;

    }

    .graduation-photo-wrap {

        height: 230px;

    }

}

/* =========================================================
   GRADUATION FLIP AREA
========================================================= */

.graduation-flip-wrap {

    position: relative;

    width: 100%;

    max-width: 780px;

    height: 430px;

    margin: auto;

    display: flex;

    align-items: center;

    justify-content: center;

}


/* =========================================================
   SWIPER
========================================================= */

.graduation-flip-swiper {

    width: 90%;

    height: 350px;

    overflow: visible;

}


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

.graduation-flip-swiper .swiper-slide {

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: visible;

}


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

.graduation-slide-card {

    position: relative;

    width: 100%;

    height: 100%;

    padding: 5px;

    background: #fff;

    border-radius: 2px;

    box-shadow:
        0 25px 45px
        rgba(70, 40, 15, .22);

    transform:
        rotate(-4deg);

    transition:
        transform .5s ease,
        box-shadow .5s ease;

}


/* Image */

.graduation-slide-card img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

}


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

.graduation-slide-card::before {

    content: "";

    position: absolute;

    z-index: -1;

    left: 0;

    right: 0;

    bottom: -10px;

    height: 12px;

    background: #fff;

    border: 1px solid #eadfca;

    transform:
        rotate(1deg);

}


.graduation-slide-card::after {

    content: "";

    position: absolute;

    z-index: -2;

    left: 4px;

    right: 4px;

    bottom: -17px;

    height: 13px;

    background: #f8f1e4;

    border: 1px solid #e8dcc5;

    transform:
        rotate(2deg);

}


/* =========================================================
   SWIPER FLIP SHADOW
========================================================= */

.graduation-flip-swiper
.swiper-slide-shadow-left,
.graduation-flip-swiper
.swiper-slide-shadow-right {

    border-radius: 2px;

}


/* =========================================================
   FLOATING ANIMATION
========================================================= */

.graduation-flip-swiper {

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

}


@keyframes graduationImageFloat {

    0%,
    100% {

        transform:
            translateY(0);

    }

    50% {

        transform:
            translateY(-8px);

    }

}


/* =========================================================
   PAGINATION
========================================================= */

.graduation-pagination {

    bottom: -35px !important;

}


.graduation-pagination
.swiper-pagination-bullet {

    width: 7px;

    height: 7px;

    opacity: 1;

    background:
        #d8bd8c;

}


.graduation-pagination
.swiper-pagination-bullet-active {

    width: 25px;

    border-radius: 10px;

    background:
        #5b1018;

}


/* =========================================================
   GRADUATION BADGE
========================================================= */

.graduation-flip-badge {

position: absolute;

z-index: 20;

left: 50%;

bottom: 8px;

width: 55px;

height: 55px;

display: flex;

align-items: center;

justify-content: center;

color: #fff;

background: var(--rit-blue);

border: 4px solid #fff;

border-radius: 50%;

box-shadow:
        0 10px 25px
        rgba(70, 20, 20, .25);

transform:
        translateX(-50%);

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


.graduation-flip-badge i {

    font-size: 18px;

}


@keyframes graduationBadgeFloat {

    0%,
    100% {

        margin-bottom: 0;

    }

    50% {

        margin-bottom: 8px;

    }

}


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

.graduation-flip-wrap:hover
.graduation-flip-swiper {

    animation-play-state:
        paused;

}


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

@media (max-width: 991px) {

    .graduation-flip-wrap {

        height: 380px;

    }

    .graduation-flip-swiper {

        width: 92%;

        height: 310px;

    }

}


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

@media (max-width: 767px) {

    .graduation-flip-wrap {

        height: 330px;

        margin-top: 20px;

    }

    .graduation-flip-swiper {

        width: 92%;

        height: 245px;

    }

    .graduation-slide-card {

        transform:
            rotate(-3deg);

    }

    .graduation-flip-badge {

        width: 48px;

        height: 48px;

        bottom: 5px;

    }

    .graduation-flip-badge i {

        font-size: 15px;

    }

}


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

@media (max-width: 400px) {

    .graduation-flip-wrap {

        height: 290px;

    }

    .graduation-flip-swiper {

        height: 210px;

    }

}

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

:root {

    --journey-navy: #022252;
    --journey-blue: #A8D5FF;

    --journey-burgundy: #5b1018;
    --journey-gold: #c69b63;
    --journey-cream: #fff5dc;

}


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

.journey-section {

position: relative;

overflow: hidden;

padding: 20px 0 40px;

background: #eaf2ff;
}


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

.journey-heading {

display: flex;

align-items: center;

justify-content: center;

gap: 16px;

margin-bottom: 30px;
}


.journey-heading span {

width: 100%;

height: 1px;

background: #5077b1;
}


.journey-heading h2 {

margin: 0;

color: var(--rit-blue);

font-size: 13px;

font-weight: 800;

letter-spacing: 1.5px;

white-space: nowrap;
}


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

.journey-slider-wrap {

    position: relative;

    max-width: 1380px;

    margin: auto;

    padding: 0 45px;

}


/* =========================================================
   SWIPER
========================================================= */

.journeySwiper {

    width: 100%;

    overflow: hidden;

    padding:
        0 0 12px;

}


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

.journeySwiper .swiper-slide {

height: auto;

padding-top: 20px;
}


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

.journey-card {

position: relative;

height: 275px;

padding:
        36px 14px 12px;

text-align: center;

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

border: 1px solid #cddcf3;

border-radius: 18px;

box-shadow:
        0 12px 30px
        rgba(68,45,20,.06);

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


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

.journey-card:hover {

    transform:
        translateY(-8px);

    border-color:
        #dfc18e;

    box-shadow:
        0 22px 40px
        rgba(68,45,20,.12);

}


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

.journey-icon {

position: absolute;

z-index: 5;

top: -15px;

left: 50%;

width: 31px;

height: 31px;

display: flex;

align-items: center;

justify-content: center;

color: #fff;

background: var(--rit-blue);

border: 2px solid #3969b2;

border-radius: 50%;

transform:
        translateX(-50%);

box-shadow:
        0 5px 15px
        rgba(91,16,24,.18);

font-size: 11px;

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


.journey-card:hover .journey-icon {

    background:
        var(--journey-navy);

    transform:
        translateX(-50%)
        scale(1.15);

}


/* =========================================================
   YEAR
========================================================= */

.journey-year {

margin-bottom: 8px;

color: #4275c1;

font-family:
        "Playfair Display",
        Georgia,
        serif;

font-size: 20px;

font-weight: 700;

line-height: 1;
}


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

.journey-card h3 {

min-height: 19px;

margin: 0 0 8px;

color: var(--rit-blue);

font-family:
        "Oswald",
        sans-serif;

font-size: 12px;

font-weight: 600;

line-height: 1.35;

letter-spacing: .3px;
}


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

.journey-card p {

min-height: 50px;

margin:
        0 auto 12px;

color: #000000;

font-size: 11px;

line-height: 1.5;
}


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

.journey-image {

    position: relative;

    width: 100%;

    height: 110px;

    overflow: hidden;

    border-radius: 10px;

}


.journey-image img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform .7s ease;

}


.journey-card:hover
.journey-image img {

    transform:
        scale(1.08);

}


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

.journey-image::after {

    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(0,0,0,.12)
        );

    pointer-events: none;

}


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

.journey-prev,
.journey-next {

position: absolute;

top: 50%;

z-index: 20;

width: 40px;

height: 40px;

display: flex;

align-items: center;

justify-content: center;

padding: 0;

border: 0;

color: #fff;

background: var(--rit-blue);

border-radius: 50%;

transform:
        translateY(-50%);

cursor: pointer;

box-shadow:
        0 8px 20px
        rgba(91,16,24,.18);

transition:
        all .3s ease;
}


.journey-prev {

    left: 0;

}


.journey-next {

    right: 0;

}


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

    color:
        var(--journey-navy);

    background:
        var(--journey-blue);

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

}


.journey-prev i,
.journey-next i {

    font-size: 12px;

}


/* =========================================================
   DISABLED
========================================================= */

.journey-prev.swiper-button-disabled,
.journey-next.swiper-button-disabled {

    opacity: .45;

    cursor: default;

}


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

.journey-card {

    opacity: 0;

    transform:
        translateY(25px);

    animation:
        journeyCardReveal .7s ease forwards;

}


.swiper-slide:nth-child(1) .journey-card {
    animation-delay: .1s;
}

.swiper-slide:nth-child(2) .journey-card {
    animation-delay: .2s;
}

.swiper-slide:nth-child(3) .journey-card {
    animation-delay: .3s;
}

.swiper-slide:nth-child(4) .journey-card {
    animation-delay: .4s;
}

.swiper-slide:nth-child(5) .journey-card {
    animation-delay: .5s;
}

.swiper-slide:nth-child(6) .journey-card {
    animation-delay: .6s;
}


@keyframes journeyCardReveal {

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


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

@media (max-width: 1100px) {

    .journey-slider-wrap {

        padding:
            0 42px;

    }

}


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

@media (max-width: 767px) {

    .journey-section {

padding: 30px 0 30px;

}


    .journey-heading {

        margin-bottom: 35px;

        gap: 10px;

    }


    .journey-heading span {

        width: 55px;

    }


    .journey-heading h2 {

        font-size: 11px;

        letter-spacing: 1px;

    }


    .journey-slider-wrap {

        padding:
            0 42px;

    }


    .journey-card {

        height: 285px;

    }


    .journey-image {

        height: 120px;

    }


    .journey-prev,
    .journey-next {

        width: 36px;

        height: 36px;

    }

}


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

@media (max-width: 400px) {

    .journey-slider-wrap {

        padding:
            0 38px;

    }


    .journey-card {

        height: 280px;

    }

}

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

:root {

    --rit-navy: #022252;
    --rit-gold: #c9932d;
    --rit-gold-light: #e5c27e;
    --rit-cream: #fff5dc;
    --rit-text: #4f4a43;

}


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

.rit-footer {

position: relative;

overflow: hidden;

padding: 30px 0 30px;

background: var(--rit-blue);

color:
        var(--rit-text);
}


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

.rit-footer-watermark {

    position: absolute;

    z-index: 0;

    left: 50%;

    top: 50%;

    width: 380px;

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

    opacity: .035;

    pointer-events: none;

}


.rit-footer-watermark img {

    width: 100%;

    display: block;

    filter:
        grayscale(1);

}


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

.rit-footer .container {

position: relative;

z-index: 2;

margin: auto;

padding: 0 20px;
}


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

.rit-footer-grid {

    display: grid;

    grid-template-columns:
        1.35fr
        1fr
        1fr
        1.15fr;

    gap: 55px;

}


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

.rit-footer-logo {

    display: inline-flex;

    align-items: center;

    gap: 12px;

    text-decoration: none;

}


.rit-footer-logo img {

width: 100%;

height: auto;

object-fit: contain;

background: #fff;

border-radius: 5px;
}


.rit-footer-logo span {

    display: flex;

    flex-direction: column;

    color:
        var(--rit-navy);

}


.rit-footer-logo strong {

    font-size: 15px;

    line-height: 1.2;

    letter-spacing: .5px;

}


.rit-footer-logo small {

    margin-top: 2px;

    color:
        var(--rit-gold);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1px;

}


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

.rit-footer-line {

width: 48px;

height: 1px;

margin: 10px 0 10px;

background: var(--rit-sky-blue);
}


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

.rit-contact-list {

    margin: 0;

    padding: 0;

    list-style: none;

}


.rit-contact-list li {

display: flex;

align-items: flex-start;

gap: 12px;

margin-bottom: 14px;

color: #ffffff;

font-size: 14px;

letter-spacing: 1px;

font-weight: 500;

line-height: 1.55;
}


.rit-contact-list li i {

flex: 0 0 18px;

margin-top: 2px;

color: var(--rit-sky-blue);

font-size: 15px;

text-align: center;
}


.rit-contact-list a {

color: #ffffff;

text-decoration: none;

transition:
        color .3s ease;
}


.rit-contact-list a:hover {

color: var(--rit-sky-blue);
}


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

.rit-footer-title {

    display: flex;

    align-items: center;

    gap: 13px;

}


.rit-footer-title i {

color: var(--rit-sky-blue);

font-size: 13px;
}


.rit-footer-title h3 {

margin: 0;

color: var(--rit-sky-blue);

font-size: 13px;

font-weight: 800;

letter-spacing: 1px;
}


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

.rit-title-line {

width: 35px;

height: 2px;

margin: 10px 0 10px;

background: #ffffff;
}


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

.rit-footer-links {

    margin: 0;

    padding: 0;

    list-style: none;

}


.rit-footer-links li {

    margin-bottom: 13px;

}


.rit-footer-links a {

position: relative;

display: inline-block;

padding-left: 12px;

color: #ffffff;

font-size: 14px;

letter-spacing: 1px;

font-weight: 500;

line-height: 1.4;

text-decoration: none;

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


.rit-footer-links a::before {

content: "\f054";

font-family: "Font Awesome 6 Free";

position: absolute;

left: 0;

top: 0;

color: var(--rit-sky-blue);

font-weight: 700;
}


.rit-footer-links a:hover {

color: var(--rit-sky-blue);

transform:
        translateX(4px);
}


/* =========================================================
   HELP DESK CARD
========================================================= */

.rit-help-card {

display: flex;

align-items: center;

gap: 11px;

margin-top: 15px;

padding:
        10px 12px;

min-height: 60px;

border: 1px solid #b7d4ff;

border-radius: 11px;

color: var(--rit-sky-blue);

text-decoration: none;

transition:
        all .35s ease;
}


.rit-help-card:hover {

    transform:
        translateY(-4px);

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

    box-shadow:
        0 10px 25px
        rgba(80,50,10,.08);

}


.rit-help-icon {

width: 37px;

height: 37px;

display: flex;

align-items: center;

justify-content: center;

flex: 0 0 37px;

color: var(--rit-blue);

background: var(--rit-sky-blue);

border-radius: 50%;
}


.rit-help-content {

    display: flex;

    flex-direction: column;

    flex: 1;

}


.rit-help-content strong {

    font-size: 12px;

}


.rit-help-content small {

    margin-top: 2px;

    color:
        #83776b;

    font-size: 10px;

}


.rit-help-arrow {

color: var(--rit-sky-blue);

font-size: 13px;
}


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

.rit-social-icons {

display: flex;

align-items: center;

gap: 10px;
}


.rit-social-icons a {

width: 35px;

height: 35px;

display: flex;

align-items: center;

justify-content: center;

border: 1px solid #ddd2bc;

border-radius: 50%;

background: rgb(255 255 255 / 15%);

font-size: 14px;

text-decoration: none;

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


.rit-social-icons a:hover {

    transform:
        translateY(-5px);

}


.rit-social-icons .facebook {

    color: #1877f2;

}


.rit-social-icons .instagram {

    color: #e1306c;

}


.rit-social-icons .twitter {

    color: #111;

}


.rit-social-icons .linkedin {

    color: #0a66c2;

}


.rit-social-icons .youtube {

    color: #ff0000;

}


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

.rit-footer-quote {

    position: relative;

    min-height: 112px;

    padding:
        28px 20px 15px;

    overflow: hidden;

    border:
        1px solid #ead6a9;

    border-radius: 13px;

    background:
        rgba(255,248,230,.55);

}


.quote-mark {

    position: absolute;

    top: -3px;

    left: 18px;

    color:
        var(--rit-gold);

    font-family:
        Georgia, serif;

    font-size: 35px;

    line-height: 1;

}


.rit-footer-quote p {

    position: relative;

    z-index: 2;

    max-width: 260px;

    margin: 10px 0 12px;

    color:
        #41424a;

    font-size: 12px;

    font-weight: 700;

    line-height: 1.55;

}


.quote-line {

    width: 30px;

    height: 2px;

    background:
        var(--rit-gold);

}


.quote-watermark {

    position: absolute;

    right: -15px;

    bottom: -30px;

    width: 100px;

    opacity: .08;

}


.quote-watermark img {

    width: 100%;

}


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

.rit-footer-col {

    animation:
        footerReveal .7s ease both;

}


.rit-footer-col:nth-child(1) {
    animation-delay: .1s;
}

.rit-footer-col:nth-child(2) {
    animation-delay: .2s;
}

.rit-footer-col:nth-child(3) {
    animation-delay: .3s;
}

.rit-footer-col:nth-child(4) {
    animation-delay: .4s;
}


@keyframes footerReveal {

    from {

        opacity: 0;

        transform:
            translateY(20px);

    }

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


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

@media (max-width: 991px) {

    .rit-footer-grid {

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

        gap: 40px;

    }

}


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

@media (max-width: 600px) {

    .rit-footer {

padding: 30px 0 30px;

}


    .rit-footer-grid {

        grid-template-columns:
            1fr;

        gap: 32px;

    }


    .rit-footer-contact {

        max-width: 400px;

    }


    .rit-footer-watermark {

        width: 280px;

        opacity: .025;

    }


    .rit-social-icons {

        margin-bottom: 22px;

    }

}


/* =========================================================
   EXTRA SMALL
========================================================= */

@media (max-width: 400px) {

    .rit-footer .container {

        padding:
            0 16px;

    }

}

.map-view-box {
    align-items: center;
    gap: 16px;
    position: relative;
    display: flex;
    flex-direction: column;
}

.cyber-radar-container {
    background: #06080eb3;
    border: 1.5px solid #41bbd959;
    border-radius: 16px;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 160px;
    display: flex;
    position: relative;
    overflow: hidden;
    box-shadow: 0 0 25px #419cd914, inset 0 0 20px #4190d926;
}

.radar-grid {
    z-index: 1;
    background-image: linear-gradient(#d9a4410f 1px,#0000 1px),linear-gradient(90deg,#d9a4410f 1px,#0000 1px);
    background-position: 50%;
    background-size: 16px 16px;
    position: absolute;
    inset: 0
}

.radar-crosshairs {
    z-index: 1;
    position: absolute;
    inset: 0
}

.radar-crosshairs:before,.radar-crosshairs:after {
    content: "";
    background: #d9a44133;
    position: absolute
}

.radar-crosshairs:before {
    height: 1px;
    top: 40%;
    left: 0;
    right: 0
}

.radar-crosshairs:after {
    width: 1px;
    top: 0;
    bottom: 0;
    left: 55%
}

.radar-ring {
    z-index: 2;
    pointer-events: none;
    border: 1px dashed #41c2d940;
    border-radius: 50%;
    position: absolute;
    top: 40%;
    left: 55%;
    transform: translate(-50%,-50%)
}

.ring-outer {
    border-style: solid;
    border-color: #41bbd91f;
    width: 120px;
    height: 120px;
    animation: 20s linear infinite rotateClockwise
}

.ring-middle {
    border-style: dashed;
    width: 80px;
    height: 80px;
    animation: 12s linear infinite rotateCounterClockwise
}

.ring-inner {
    border-style: dotted;
    border-color: #41ced966;
    width: 40px;
    height: 40px;
    animation: 6s linear infinite rotateClockwise
}

.radar-sweep-line {
    transform-origin: 50%;
    z-index: 2;
    pointer-events: none;
    background: conic-gradient(#4196d940 0deg, #0000 90deg 360deg);
    border-radius: 50%;
    width: 150px;
    height: 150px;
    animation: 4s linear infinite radarSweepLine;
    position: absolute;
    top: 40%;
    left: 55%;
    transform: translate(-50%,-50%)rotate(0)
}

@keyframes rotateClockwise {
    0% {
        transform: translate(-50%,-50%)rotate(0)
    }

    to {
        transform: translate(-50%,-50%)rotate(360deg)
    }
}

@keyframes rotateCounterClockwise {
    0% {
        transform: translate(-50%,-50%)rotate(360deg)
    }

    to {
        transform: translate(-50%,-50%)rotate(0)
    }
}

@keyframes radarSweepLine {
    0% {
        transform: translate(-50%,-50%)rotate(0)
    }

    to {
        transform: translate(-50%,-50%)rotate(360deg)
    }
}

.radar-overlay-data {
    z-index: 3;
    pointer-events: none;
    flex-direction: column;
    gap: 2px;
    display: flex;
    position: absolute;
    bottom: 8px;
    left: 12px
}

.terminal-text {
    color: #00a1ff;
    letter-spacing: 1px;
    text-align: left;
    font-family: Courier New,Courier,monospace;
    font-size: .65rem;
    font-weight: 800;
    animation: 1.5s step-end infinite textBlink
}

.coords-text {
    color: #a3a3a3;
    text-align: left;
    font-family: Courier New,Courier,monospace;
    font-size: .62rem;
    font-weight: 600
}

@keyframes textBlink {
    0%,to {
        opacity: 1
    }

    50% {
        opacity: .3
    }
}

.neon-pin {
    color: #347aff;
    filter: drop-shadow(0 0 6px #34b8ff);
    animation: 1s ease-in-out infinite alternate bouncePin
}

@keyframes bouncePin {
    0% {
        transform: translate(-50%,-50%)translateY(0)
    }

    to {
        transform: translate(-50%,-50%)translateY(-6px)
    }
}

.map-pin-indicator {
    z-index: 4;
    position: absolute;
    top: 40%;
    left: 55%;
    transform: translate(-50%,-50%)
}

.map-radar-pulse {
    pointer-events: none;
    z-index: 2;
    background: #41b8d9;
    border-radius: 50%;
    width: 8px;
    height: 8px;
    position: absolute;
    top: 40%;
    left: 55%;
    transform: translate(-50%,-50%)
}

.map-radar-pulse:before,.map-radar-pulse:after {
    content: "";
    opacity: 0;
    border: 1.5px solid #4196d9;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    animation: 3s cubic-bezier(.1,.8,.3,1) infinite radarSweep;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%)
}

.map-radar-pulse:after {
    animation-delay: 1.5s
}

@keyframes radarSweep {
    0% {
        opacity: .8;
        width: 15px;
        height: 15px
    }

    50% {
        opacity: .4
    }

    to {
        opacity: 0;
        width: 140px;
        height: 140px
    }
}

.view-map-btn-new {
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    background: linear-gradient(135deg, #a8d5ff 0%, #0300ad 100%);
    border-radius: 50px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 28px;
    font-size: .85rem;
    font-weight: 900;
    text-decoration: none;
    transition: all .3s cubic-bezier(.175,.885,.32,1.275);
    display: inline-flex;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 15px #ff510059,inset 0 0 0 1px #ffffff1a
}

.view-map-btn-new:hover {
    transform: scale(1.04)translateY(-2px);
    box-shadow: 0 8px 25px rgb(153 194 248 / 58%), 0 0 10px #bcbeff;
}
/* =========================================================
   COPYRIGHT BAR
========================================================= */

.rit-copyright {

position: relative;

overflow: hidden;

background:
        #022252;

border-top: 1px solid rgb(168 213 255 / 34%);
}


/* =========================================================
   INNER
========================================================= */

.rit-copyright-inner {

min-height: 60px;

display: flex;

align-items: center;

justify-content: space-between;

gap: 25px;
}


/* =========================================================
   COPYRIGHT TEXT
========================================================= */

.rit-copyright-text {

display: flex;

align-items: center;

gap: 8px;

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

font-size: 14px;

font-weight: 500;

letter-spacing: 1px;
}


.rit-copyright-text i {

    color:
        #d4a23a;

    font-size: 13px;

}


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

.rit-copyright-links {

    display: flex;

    align-items: center;

    gap: 13px;

}


.rit-copyright-links a {

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

    font-size: 11px;

    font-weight: 500;

    text-decoration: none;

    transition:
        color .3s ease;

}


.rit-copyright-links a:hover {

    color:
        #d4a23a;

}


.rit-copyright-links span {

    width: 3px;

    height: 3px;

    background:
        #d4a23a;

    border-radius: 50%;

}


/* =========================================================
   DEVELOPED BY
========================================================= */

.rit-developed {

display: flex;

align-items: center;

gap: 5px;

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

font-size: 14px;

letter-spacing: 1px;
}


.rit-developed a {

color:
        #d4a23a;

font-size: 14px;

font-weight: 600;

text-decoration: none;
}


.rit-developed a:hover {

    color:
        #A8D5FF;

}


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

.rit-copyright::before {

content: "";

position: absolute;

top: 0;

left: 50%;

width: 80px;

height: 2px;

background: #a8d5ff;

transform:
        translateX(-50%);
}


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

@media (max-width: 991px) {

    .rit-copyright-inner {

        padding: 18px 0;

        flex-wrap: wrap;

        justify-content: center;

        text-align: center;

    }

}


@media (max-width: 600px) {

    .rit-copyright-inner {

        flex-direction: column;

        gap: 10px;

        padding: 20px 15px;

    }


    .rit-copyright-text {

        justify-content: center;

        line-height: 1.5;

    }


    .rit-copyright-links {

        flex-wrap: wrap;

        justify-content: center;

        gap: 8px 12px;

    }


    .rit-developed {

        justify-content: center;

    }

}

img.footer {
    width: 100px;
    margin-left: 5px;
    border-radius: 5px;
}