/* ==========================================================================
   SAI International Admissions Landing Page Styles
   ========================================================================== */


/* Global Reset */

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

html,
body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    width: 100%;
}


/* Variables */

:root {
    --sai-primary: #cc554d;
    --sai-primary-dark: #a83f39;
    --sai-bg-main: #ffffff;
    --sai-bg-alt: #f5f5f5;
    --sai-bg-card: #ffffff;
    --sai-text-main: #202020;
    --sai-text-sec: #666666;
    --sai-border: #e6e6e6;
    --sai-font-heading: 'DM Serif Display', serif;
    --sai-font-body: 'Plus Jakarta Sans', sans-serif;
    --sai-font-display: 'Bebas Neue', sans-serif;
    --sai-radius: 16px;
    --sai-radius-lg: 22px;
    --sai-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    --sai-shadow-hover: 0 20px 40px rgba(0, 0, 0, 0.1);
    --sai-transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}


/* Reset within wrapper */

.sai-admission-page {
    font-family: var(--sai-font-body);
    color: var(--sai-text-main);
    background-color: var(--sai-bg-main);
    line-height: 1.6;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

.sai-admission-page * {
    box-sizing: border-box;
}

.sai-admission-page h1,
.sai-admission-page h2,
.sai-admission-page h3,
.sai-admission-page h4,
.sai-admission-page h5,
.sai-admission-page h6 {
    font-family: var(--sai-font-heading);
    margin-top: 0;
    font-weight: normal;
    color: var(--sai-text-main);
}

.sai-admission-page p {
    margin-top: 0;
    color: var(--sai-text-sec);
}

.sai-admission-page a {
    text-decoration: none;
    color: inherit;
    transition: var(--sai-transition);
}

.sai-admission-page img {
    max-width: 100%;
    height: auto;
    display: block;
}


/* Container */

.sai-admission-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}


/* Helper Classes */

.text-center {
    text-align: center;
}


/* Buttons */

.sai-admission-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-family: var(--sai-font-body);
    font-weight: 600;
    font-size: 1rem;
    padding: 8px 20px;
    border-radius: 50px;
    cursor: pointer;
    transition: var(--sai-transition);
    text-align: center;
    border: none;
}

.sai-admission-btn-primary {
    background-color: var(--sai-primary);
    color: #fff !important;
}

.sai-admission-btn-primary:hover {
    background-color: var(--sai-primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(204, 85, 77, 0.3);
}

.sai-admission-btn-outline {
    background-color: transparent;
    color: var(--sai-primary);
    border: 1.5px solid var(--sai-primary);
}

.sai-admission-btn-outline:hover {
    background-color: var(--sai-primary);
    color: #fff !important;
}

.sai-admission-btn-white {
    background-color: #fff;
    color: var(--sai-primary) !important;
}

.sai-admission-btn-white:hover {
    background-color: var(--sai-bg-alt);
    transform: translateY(-2px);
}

.sai-admission-btn-transparent {
    background-color: rgba(255, 255, 255, 0.1);
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.sai-admission-btn-transparent:hover {
    background-color: #fff;
    color: var(--sai-primary) !important;
}

.sai-admission-btn-full {
    width: 100%;
}


/* 1. Header */

.sai-admission-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    transition: var(--sai-transition);
    padding: 12px 0;
      background: #ffffff5c;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08);
}

.sai-admission-header.scrolled {
    background: #ffffff;
    padding: 10px 0;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.sai-admission-header-container {
    width: 100%;
    padding: 0 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 28px;
}

.sai-admission-logo img {
    height: 70px;
    width: auto;
}

.sai-admission-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 10px 20px;
    flex-wrap: wrap;
    justify-content: center;
}

.sai-admission-nav a {
    color: var(--sai-text-main);
    font-weight: 600;
    font-size: 19px;
    letter-spacing: 0.3px;
}

.sai-admission-header.scrolled .sai-admission-nav a {
    color: var(--sai-text-main);
}

.sai-admission-nav a:hover {
    color: var(--sai-primary) !important;
}

.sai-admission-header-actions {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-shrink: 0;
}

.sai-admission-call-icon {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--sai-text-main);
    font-weight: 600;
}

.sai-admission-header.scrolled .sai-admission-call-icon {
    color: var(--sai-text-main);
}

.sai-admission-hamburger {
    display: none;
    background: none;
    border: none;
    color: #fff;
    cursor: pointer;
}

.sai-admission-header.scrolled .sai-admission-hamburger {
    color: var(--sai-text-main);
}


/* Compact desktop navigation for MacBook and other laptop-width screens. */

@media (min-width: 1200px) and (max-width: 1440px) {
    .sai-admission-header-container {
        padding-inline: 28px;
        gap: 18px;
    }
    .sai-admission-logo img {
        width: 116px !important;
        height: auto !important;
    }
    .sai-admission-nav {
        flex: 1 1 auto;
        min-width: 0;
    }
    .sai-admission-nav ul {
        flex-wrap: nowrap;
        gap: 14px;
    }
    .sai-admission-nav a {
        display: block;
        font-size: 14px;
        letter-spacing: 0;
        white-space: nowrap;
    }
    .sai-admission-header-actions {
        gap: 14px;
    }
    .sai-admission-call-icon {
        gap: 6px;
        font-size: 14px;
        white-space: nowrap;
    }
    .sai-admission-header-actions .sai-admission-btn {
        padding-inline: 17px;
        font-size: 14px;
        white-space: nowrap;
    }
}


/* Mobile Nav */

@media (max-width: 1199px) {
    .sai-admission-nav {
        position: fixed;
        top: 0;
        right: -100%;
        width: 300px;
        height: 100vh;
        background: #fff;
        box-shadow: -5px 0 30px rgba(0, 0, 0, 0.1);
        transition: var(--sai-transition);
        padding: 80px 30px;
        overflow-y: auto;
    }
    .sai-admission-nav.active {
        right: 0;
    }
    .sai-admission-nav ul {
        flex-direction: column;
        gap: 20px;
        flex-wrap: nowrap;
    }
    .sai-admission-nav a {
        color: var(--sai-text-main) !important;
        font-size: 1.1rem;
    }
    .sai-admission-call-icon {
        display: none;
    }
    .sai-admission-hamburger {
        display: block;
        position: relative;
        color: var(--sai-text-main);
    }
    .sai-admission-header-actions .sai-admission-btn {
        display: none;
    }
}


/* 2. Hero Banner */

.sai-admission-hero {
    position: relative;
    min-height: 0;
    height: min(960px, 56.25vw);
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    display: flex;
    align-items: center;
    padding-top: 0;
    overflow: hidden;
}

.sai-admission-hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.sai-admission-hero-bg picture {
    display: block;
    width: 100%;
    height: 100%;
}

.sai-admission-hero-bg img.sai-admission-parallax-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: none;
    animation: saiHeroZoom 18s ease-in-out infinite alternate;
}

@media (max-width: 600px) {
    .sai-admission-header,
    .sai-admission-header.scrolled {
        padding: 7px 0;
    }
    .sai-admission-header-container {
        padding: 0 16px;
        gap: 12px;
    }
    .sai-admission-logo {
        display: block;
        flex: 0 0 auto;
        margin: 0;
    }
    .sai-admission-logo img {
        width: 112px !important;
        height: auto !important;
    }
    .sai-admission-header-actions {
        margin-left: auto;
        gap: 0;
    }
    .sai-admission-hamburger {
        width: 42px;
        height: 42px;
        padding: 8px;
        margin: 0;
    }
    .sai-admission-hamburger svg {
        width: 25px;
        height: 25px;
    }
    .sai-admission-hero {
        height: min(145vw, 700px);
        min-height: 0;
        aspect-ratio: auto;
    }
    .sai-admission-hero-bg,
    .sai-admission-hero-bg picture {
        height: 100%;
        background: #ffffff;
    }
    .sai-admission-hero-bg img.sai-admission-parallax-bg {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center top;
        animation: none;
    }
    .sai-admission-hero-overlay {
        background: none;
    }
}

@keyframes saiHeroZoom {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.06);
    }
}

.sai-admission-hero-overlay {
    position: absolute;
    inset: 0;
    background: none;
}

.sai-admission-hero-huge-text {
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    text-align: center;
    width: 100%;
}

.sai-admission-hero-huge-text h1 {
    font-family: var(--sai-font-display);
    font-size: clamp(2rem, 7vw, 11rem);
    color: rgba(255, 255, 255, 0.12);
    margin: 0;
    line-height: 1;
    letter-spacing: 2px;
    white-space: nowrap;
    overflow: hidden;
    max-width: 100%;
}

.sai-admission-hero-huge-text p {
    font-family: var(--sai-font-body);
    color: rgba(255, 255, 255, 0.6);
    font-size: clamp(1rem, 2vw, 1.5rem);
    letter-spacing: 4px;
    font-weight: 600;
    margin-top: 20px;
}

.sai-admission-hero-students {
    position: absolute;
    bottom: -5%;
    right: 5%;
    width: 55%;
    z-index: 3;
    pointer-events: none;
    animation: saiStudentFloat 6s ease-in-out infinite;
}

@keyframes saiStudentFloat {
    0%,
    100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-15px);
    }
}

.sai-admission-floating-students {
    width: 100%;
    height: auto;
    filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.3));
}

.sai-admission-hero-container {
    position: relative;
    z-index: 4;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 100px 24px 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
}

.sai-admission-hero-content {
    flex: 1;
    max-width: 600px;
    color: #fff;
}

.sai-admission-badge {
    display: inline-block;
    background: var(--sai-primary);
    color: #fff;
    padding: 6px 16px;
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 24px;
}

.sai-admission-seo-heading {
    font-size: clamp(2.5rem, 5vw, 4.5rem);
    line-height: 1.1;
    color: #fff;
    margin-bottom: 24px;
}

.sai-admission-hero-desc {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 40px;
    max-width: 500px;
}

.sai-admission-hero-buttons {
    display: flex;
    gap: 16px;
    margin-bottom: 48px;
}

.sai-admission-trust-indicators {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.sai-admission-trust-indicators span {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.8);
}

.sai-admission-trust-indicators i {
    color: var(--sai-primary);
    width: 18px;
    height: 18px;
}


/* Form Popup */

.sai-form-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    backdrop-filter: blur(5px);
}

.sai-form-overlay.active {
    opacity: 1;
    visibility: visible;
}

.sai-admission-hero-form-wrapper {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.9);
    width: 92%;
    max-width: 600px;
    height: auto;
    background: #fff;
    padding: 44px 44px 40px;
    max-height: 90dvh;
    overflow-y: auto;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.2);
    z-index: 1001;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    border-radius: var(--sai-radius-lg);
}

.sai-admission-hero-form-wrapper.active {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%) scale(1);
}

.sai-sticky-enquiry-btn {
    position: fixed;
    top: 50%;
    right: -50px;
    bottom: auto;
    transform: translateY(-50%) rotate(-90deg);
    background: var(--sai-primary);
    color: #fff;
    border: none;
    padding: 12px 24px;
    border-radius: 8px 8px 0 0;
    font-family: var(--sai-font-body);
    font-weight: 700;
    font-size: 1rem;
    cursor: pointer;
    z-index: 1000;
    transition: background-color .25s ease, box-shadow .25s ease;
    letter-spacing: 1px;
    box-shadow: 0 8px 24px rgba(168, 63, 57, 0.3);
}

.sai-sticky-enquiry-btn:hover {
    right: -50px;
    background: var(--sai-primary-dark);
    transform: translateY(-50%) rotate(-90deg);
}

.sai-close-enquiry-btn {
    position: absolute;
    top: 16px;
    right: 16px;
    background: var(--sai-bg-alt);
    border: none;
    cursor: pointer;
    color: var(--sai-text-main);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    transition: var(--sai-transition);
}

.sai-close-enquiry-btn:hover {
    background: #e6e6e6;
    color: var(--sai-primary);
}

.sai-admission-form h3 {
    font-family: var(--sai-font-body);
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.sai-admission-form>p {
    font-size: 0.9rem;
    line-height: 1.7;
    margin-bottom: 24px;
    color: var(--sai-text-sec);
}

.sai-admission-form-group {
    margin-bottom: 14px;
}

.sai-admission-form input,
.sai-admission-form textarea,
.sai-admission-form select {
    width: 100%;
    min-height: 50px;
    padding: 14px 16px;
    border: 1px solid var(--sai-border);
    border-radius: var(--sai-radius);
    font-family: var(--sai-font-body);
    font-size: 0.9rem;
    color: var(--sai-text-main);
    background: #fafafa;
    transition: var(--sai-transition);
}

.sai-admission-form input:focus,
.sai-admission-form textarea:focus,
.sai-admission-form select:focus {
    outline: none;
    border-color: var(--sai-primary);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(204, 85, 77, 0.1);
}

.sai-admission-form textarea {
    display: block;
    resize: vertical;
    min-height: 96px;
}

.sai-admission-privacy-text {
    font-size: 0.75rem;
    text-align: center;
    margin-top: 16px;
    color: #999;
}

.sai-admission-form-success,
.sai-admission-form-error {
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 20px;
    font-size: 0.9rem;
}

.sai-admission-form-success {
    background: #edf7ed;
    color: #1e4620;
}

.sai-admission-form-error {
    background: #fdeded;
    color: #5f2120;
}


/* Form h2 */

.sai-admission-form h2 {
    font-family: var(--sai-font-body);
    font-size: 1.875rem;
    line-height: 1.3;
    letter-spacing: -0.6px;
    padding-right: 24px;
    font-weight: 700;
    margin-bottom: 12px;
    color: var(--sai-text-main);
}

.sai-admission-form .sai-admission-btn-full {
    min-height: 50px;
    margin-top: 6px;
    padding: 14px 20px;
    border-radius: 14px;
}


/* Custom Dropdown */

.sai-custom-select-wrap {
    position: relative;
}

.sai-custom-select {
    position: relative;
    user-select: none;
}

.sai-custom-select__trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 50px;
    padding: 14px 16px;
    line-height: 20px;
    border: 1px solid var(--sai-border);
    border-radius: var(--sai-radius);
    background: #fafafa;
    cursor: pointer;
    font-family: var(--sai-font-body);
    font-size: 0.9rem;
    color: #999;
    transition: var(--sai-transition);
}

.sai-custom-select.selected .sai-custom-select__trigger {
    color: var(--sai-text-main);
}

.sai-custom-select.open .sai-custom-select__trigger {
    border-color: var(--sai-primary);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(204, 85, 77, 0.1);
}

.sai-select-arrow {
    width: 18px;
    height: 18px;
    color: #999;
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

.sai-custom-select.open .sai-select-arrow {
    transform: rotate(180deg);
    color: var(--sai-primary);
}

.sai-custom-select__options {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid var(--sai-border);
    border-radius: var(--sai-radius);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
    z-index: 100;
    max-height: 180px;
    overflow-y: auto;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.sai-custom-select.open .sai-custom-select__options {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.sai-option {
    padding: 10px 14px;
    font-family: var(--sai-font-body);
    font-size: 0.9rem;
    color: var(--sai-text-main);
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
}

.sai-option:hover {
    background: rgba(204, 85, 77, 0.07);
    color: var(--sai-primary);
}

.sai-option.active {
    background: var(--sai-primary);
    color: #fff;
    font-weight: 600;
}


/* Scrollbar for dropdown */

.sai-custom-select__options::-webkit-scrollbar {
    width: 4px;
}

.sai-custom-select__options::-webkit-scrollbar-track {
    background: #f5f5f5;
    border-radius: 10px;
}

.sai-custom-select__options::-webkit-scrollbar-thumb {
    background: var(--sai-primary);
    border-radius: 10px;
}

@media (max-width: 991px) {
    .sai-admission-hero-overlay {
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.8) 100%);
    }
    .sai-admission-hero-students {
        width: 90%;
        right: auto;
        left: 50%;
        transform: translateX(-50%);
        bottom: 0;
        animation: none;
        opacity: 0.4;
    }
    .sai-admission-hero-container {
        flex-direction: column;
        padding-top: 40px;
    }
    .sai-admission-hero-content {
        text-align: center;
        max-width: 100%;
    }
    .sai-admission-hero-desc {
        margin: 0 auto 30px;
    }
    .sai-admission-hero-buttons {
        justify-content: center;
    }
    .sai-admission-trust-indicators {
        justify-content: center;
        margin-bottom: 40px;
    }
    .sai-admission-hero-form-wrapper {
        padding: 44px 24px 28px;
    }
}

@media (max-width: 576px) {
    .sai-admission-hero-overlay {
        background: none;
    }
    .sai-admission-form h2 {
        font-size: 1.625rem;
    }
    .sai-admission-seo-heading {
        font-size: 2rem;
    }
    .sai-admission-hero-buttons {
        flex-direction: column;
    }
    .sai-admission-hero-huge-text h1 {
        font-size: 5rem;
    }
}


/* Common Section Styles */

.sai-admission-page section {
    padding: 100px 0;
}

.sai-admission-section-label {
    display: inline-block;
    color: var(--sai-primary);
    font-weight: 700;
    font-size: 0.85rem;
    letter-spacing: 2px;
    margin-bottom: 16px;
    text-transform: uppercase;
}

.sai-admission-section-title {
    font-size: clamp(2rem, 4vw, 3rem);
    margin-bottom: 24px;
    line-height: 1.2;
}

.sai-admission-section-subtitle {
    font-size: 1.1rem;
    max-width: 700px;
    margin-bottom: 48px;
}


/* 8. Results */

.sai-admission-results {
    background: var(--sai-bg-alt);
}

.sai-admission-results-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.sai-admission-achiever-card {
    background: #fff;
    border-radius: var(--sai-radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: var(--sai-shadow);
}

.sai-admission-achiever-card img {
    width: 100%;
    height: 300px;
    object-fit: contain;
}

.achiever-info {
    padding: 30px;
}

.achiever-info .badge {
    display: inline-block;
    background: rgba(204, 85, 77, 0.1);
    color: var(--sai-primary);
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 700;
    margin-bottom: 16px;
}

.achiever-info h3 {
    font-family: var(--sai-font-body);
    font-size: 1.5rem;
    margin-bottom: 8px;
}

.result-stat-box {
    background: #fff;
    padding: 40px;
    border-radius: var(--sai-radius-lg);
    box-shadow: var(--sai-shadow);
    margin-bottom: 24px;
    border-left: 4px solid var(--sai-primary);
}

.result-stat-box h4 {
    font-family: var(--sai-font-heading);
    font-size: 2rem;
    margin-bottom: 10px;
}

@media (max-width: 991px) {
    .sai-admission-results-grid {
        grid-template-columns: 1fr;
    }
}


/* 9. Global */

.sai-admission-global {
    background: #fff url('data:image/svg+xml;utf8,<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg"><defs><pattern id="dots" width="20" height="20" patternUnits="userSpaceOnUse"><circle cx="2" cy="2" r="1" fill="%23e6e6e6"/></pattern></defs><rect width="100%" height="100%" fill="url(%23dots)"/></svg>');
}

.sai-admission-global-content {
    background: #fff;
    padding: 50px;
    border-radius: var(--sai-radius-lg);
    box-shadow: var(--sai-shadow);
}

.sai-admission-global-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.sai-admission-global-list li {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 1.2rem;
    font-weight: 600;
}

.sai-admission-global-list i {
    color: var(--sai-primary);
    width: 32px;
    height: 32px;
}

@media (max-width: 768px) {
    .sai-admission-global-list {
        grid-template-columns: 1fr;
    }
}


/* 10. Awards */

.sai-admission-awards-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.sai-admission-award-card {
    text-align: center;
    padding: 40px 20px;
    background: var(--sai-bg-alt);
    border-radius: var(--sai-radius-lg);
    transition: var(--sai-transition);
}

.sai-admission-award-card:hover {
    background: #fff;
    box-shadow: var(--sai-shadow);
}

.sai-admission-award-card i {
    color: var(--sai-primary);
    width: 48px;
    height: 48px;
    margin-bottom: 20px;
}

.sai-admission-award-card h3 {
    font-family: var(--sai-font-body);
    font-size: 1.2rem;
    margin-bottom: 10px;
}

@media (max-width: 991px) {
    .sai-admission-awards-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .sai-admission-awards-grid {
        grid-template-columns: 1fr;
    }
}


/* 11. Testimonials */

.sai-admission-testimonials {
    background: var(--sai-bg-alt);
}

.sai-admission-testimonial-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.sai-admission-testimonial-card {
    background: #fff;
    padding: 40px;
    border-radius: var(--sai-radius-lg);
    box-shadow: var(--sai-shadow);
    border-top: 4px solid var(--sai-primary);
    position: relative;
    display: flex;
    flex-direction: column;
}

.quote-mark {
    font-family: var(--sai-font-heading);
    font-size: 6rem;
    color: var(--sai-bg-alt);
    position: absolute;
    top: -20px;
    left: 20px;
    line-height: 1;
}

.sai-admission-testimonial-card .review {
    font-size: 1.1rem;
    font-style: italic;
    margin-top: 30px;
    margin-bottom: 30px;
    flex-grow: 1;
}

.parent-info h4 {
    font-family: var(--sai-font-body);
    margin-bottom: 4px;
}

.parent-info p {
    font-size: 0.85rem;
    margin: 0;
}

@media (max-width: 991px) {
    .sai-admission-testimonial-grid {
        grid-template-columns: 1fr;
    }
}


/* 12. Process */

.sai-admission-timeline {
    display: flex;
    justify-content: space-between;
    position: relative;
    margin-top: 60px;
}

.sai-admission-timeline::before {
    content: '';
    position: absolute;
    top: 30px;
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--sai-border);
    z-index: 1;
}

.timeline-step {
    position: relative;
    z-index: 2;
    text-align: center;
    width: 15%;
}

.step-circle {
    width: 60px;
    height: 60px;
    background: #fff;
    border: 2px solid var(--sai-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--sai-primary);
    margin: 0 auto 20px;
    transition: var(--sai-transition);
}

.timeline-step:hover .step-circle {
    background: var(--sai-primary);
    color: #fff;
}

.timeline-step h4 {
    font-family: var(--sai-font-body);
    font-size: 1rem;
    margin-bottom: 8px;
}

.timeline-step p {
    font-size: 0.85rem;
}

@media (max-width: 991px) {
    .sai-admission-timeline {
        flex-direction: column;
        gap: 30px;
    }
    .sai-admission-timeline::before {
        top: 0;
        left: 30px;
        width: 2px;
        height: 100%;
    }
    .timeline-step {
        width: 100%;
        display: flex;
        align-items: center;
        text-align: left;
        gap: 20px;
    }
    .step-circle {
        margin: 0;
        flex-shrink: 0;
    }
    .timeline-step h4 {
        margin-bottom: 4px;
    }
}


/* 13. FAQ */

.sai-admission-faq {
    background: var(--sai-bg-alt);
}

.sai-admission-accordion {
    max-width: 800px;
    margin: 0 auto;
}

.accordion-item {
    background: #fff;
    border-radius: var(--sai-radius);
    margin-bottom: 16px;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.02);
}

.accordion-header {
    width: 100%;
    padding: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: none;
    font-family: var(--sai-font-body);
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--sai-text-main);
    cursor: pointer;
    text-align: left;
}

.accordion-header i {
    transition: transform 0.3s;
}

.accordion-item.active .accordion-header i {
    transform: rotate(180deg);
}

.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    padding: 0 24px;
}

.accordion-item.active .accordion-content {
    padding-bottom: 24px;
}


/* Animations */

.fade-in-up {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-in-up.visible {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    * {
        animation: none !important;
        transition: none !important;
    }
}


/* =========================================================
   SAI - WHY CHOOSE SECTION
   ========================================================= */

.sai-why-choose {
    width: 100%;
    position: relative;
    overflow: hidden;
    padding: 85px 0 90px;
    background: #ffffff;
}

.sai-container {
    width: min(1810px, calc(100% - 100px));
    margin: 0 auto;
}


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

.sai-heading {
    text-align: center;
    margin-bottom: 48px;
}

.sai-eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 42px;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 5px;
    color: #243653;
    margin-bottom: 18px;
}

.sai-eyebrow span {
    display: block;
    width: 68px;
    height: 1px;
    background: #243653;
}

.sai-heading h2 {
    margin: 0;
    padding: 0;
    font-size: 53px;
    line-height: 1.05;
    font-weight: 500;
    letter-spacing: -2px;
    color: #101e3b;
}

.sai-belonging {
    display: inline-block;
    margin-left: 8px;
    color: #e64d43;
    /* Only Belonging gets a special font */
    font-family: "Brush Script MT", "Segoe Script", cursive;
    font-weight: 400;
    font-size: 1.08em;
    letter-spacing: -1px;
    transform: rotate(-3deg);
}

.sai-heading p {
    margin: 24px 0 0;
    font-size: 19px;
    line-height: 1.5;
    font-weight: 400;
    color: #53637d;
}


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

.sai-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}


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

.sai-stat-card {
    min-height: 215px;
    display: flex;
    align-items: center;
    padding: 32px 38px;
    border: 1px solid;
    border-radius: 20px;
    position: relative;
    overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.sai-stat-card::after {
    content: "";
    position: absolute;
    width: 115px;
    height: 115px;
    right: -35px;
    top: -35px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.38);
}

.sai-stat-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 35px rgba(20, 40, 70, 0.08);
}


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

.sai-card-pink {
    background: #fff8f8;
    border-color: #f5d9d9;
}

.sai-card-blue {
    background: #f5faff;
    border-color: #d9e9f7;
}

.sai-card-orange {
    background: #fffbf5;
    border-color: #f5e3c7;
}

.sai-card-green {
    background: #f5fbf9;
    border-color: #d8eee8;
}

.sai-card-coral {
    background: #fff8f7;
    border-color: #f3dada;
}

.sai-card-purple {
    background: #f8f8ff;
    border-color: #deddf4;
}


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

.sai-icon {
    width: 140px;
    height: 140px;
    flex: 0 0 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    position: relative;
    z-index: 2;
}

.sai-icon svg {
    width: 72px;
    height: 72px;
}


/* Icon colours */

.sai-card-pink .sai-icon {
    background: #fdeaea;
    color: #e33f32;
}

.sai-card-blue .sai-icon {
    background: #e8f4ff;
    color: #152b4d;
}

.sai-card-orange .sai-icon {
    background: #fff0dc;
    color: #e26b16;
}

.sai-card-green .sai-icon {
    background: #e3f5ee;
    color: #08703f;
}

.sai-card-coral .sai-icon {
    background: #fde8e6;
    color: #df493c;
}

.sai-card-purple .sai-icon {
    background: #ebeaff;
    color: #19284a;
}


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

.sai-stat-content {
    position: relative;
    z-index: 2;
    flex: 1;
    min-width: 0;
    margin-left: 38px;
}

.sai-number {
    font-size: 50px;
    line-height: 1;
    font-weight: 600;
    color: #142542;
    margin-bottom: 14px;
    letter-spacing: -1.5px;
}

.sai-description {
    width: 100%;
    font-size: 19px;
    line-height: 1.4;
    font-weight: 400;
    color: #435573;
}

.sai-small {
    margin-top: 8px;
    font-size: 15px;
    line-height: 1.3;
    color: #53637d;
}


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


/* Preserve the three-column desktop layout without squeezing card content. */

@media (min-width: 901px) and (max-width: 1440px) {
    .sai-why-choose {
        padding: 64px 0 72px;
    }
    .sai-container {
        width: calc(100% - 64px);
    }
    .sai-heading {
        margin-bottom: 38px;
    }
    .sai-heading h2 {
        font-size: 46px;
    }
    .sai-heading p {
        margin-top: 20px;
        font-size: 17px;
    }
    .sai-stats-grid {
        gap: 20px;
    }
    .sai-stat-card {
        min-height: 205px;
        padding: 26px 24px;
    }
    .sai-icon {
        width: 104px;
        height: 104px;
        flex-basis: 104px;
    }
    .sai-icon svg {
        width: 54px;
        height: 54px;
    }
    .sai-stat-content {
        margin-left: 22px;
    }
    .sai-number {
        font-size: 44px;
        margin-bottom: 12px;
    }
    .sai-description {
        font-size: 16px;
    }
    .sai-small {
        font-size: 13px;
    }
}

@media (max-width: 1200px) {
    .sai-container {
        width: calc(100% - 60px);
    }
    .sai-stat-card {
        padding: 28px;
    }
    .sai-icon {
        width: 110px;
        height: 110px;
        flex-basis: 110px;
    }
    .sai-icon svg {
        width: 58px;
        height: 58px;
    }
    .sai-stat-content {
        margin-left: 25px;
    }
    .sai-description {
        font-size: 16px;
    }
}

@media (max-width: 900px) {
    .sai-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .sai-heading h2 {
        font-size: 48px;
    }
}

@media (max-width: 600px) {
    .sai-why-choose {
        padding: 0px 0;
    }
    .sai-container {
        width: calc(100% - 32px);
    }
    .sai-eyebrow {
        gap: 15px;
        font-size: 11px;
        letter-spacing: 3px;
    }
    .sai-eyebrow span {
        width: 35px;
    }
    .sai-heading h2 {
        font-size: 38px;
        line-height: 1.1;
        letter-spacing: -1px;
    }
    .sai-belonging {
        margin-left: 3px;
    }
    .sai-heading p {
        font-size: 15px;
        margin-top: 18px;
    }
    .sai-stats-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .sai-stat-card {
        min-height: 170px;
        padding: 25px;
        border-radius: 16px;
    }
    .sai-icon {
        width: 90px;
        height: 90px;
        flex-basis: 90px;
    }
    .sai-icon svg {
        width: 48px;
        height: 48px;
    }
    .sai-stat-content {
        margin-left: 20px;
    }
    .sai-number {
        font-size: 40px;
        margin-bottom: 9px;
    }
    .sai-description {
        font-size: 14px;
    }
    .sai-small {
        font-size: 12px;
    }
}


/* =========================================
   SAI INTERNATIONAL - ABOUT US
========================================= */

.sai-about {
    --sai-accent: #cc554d;
    --sai-dark: #142235;
    --sai-cream: #f8f5ef;
    --sai-white: #ffffff;
    position: relative;
    width: 100%;
    min-height: 650px;
    overflow: hidden;
    isolation: isolate;
    background: var(--sai-cream);
    display: flex;
    align-items: stretch;
}


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

.sai-about__image {
    position: absolute;
    inset: 0;
    z-index: -4;
}

.sai-about__image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    object-position: right center;
}


/* =========================================
   LEFT CONTENT IMAGE BLEND
========================================= */

.sai-about__overlay {
    position: absolute;
    inset: 0;
    z-index: -3;
    pointer-events: none;
    background: linear-gradient(90deg, var(--sai-cream) 0%, var(--sai-cream) 40%, rgba(248, 245, 239, 0.96) 44%, rgba(248, 245, 239, 0.75) 49%, rgba(248, 245, 239, 0.35) 55%, rgba(248, 245, 239, 0) 64%);
}


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

.sai-about__content {
    position: relative;
    width: 58%;
    max-width: 760px;
    padding: clamp(70px, 7vw, 105px) 0 75px clamp(45px, 7vw, 120px);
    z-index: 5;
}


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

.sai-about__label {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
}

.sai-about__label span {
    color: var(--sai-dark);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 5px;
}

.sai-about__label i {
    display: block;
    width: 48px;
    height: 2px;
    background: var(--sai-accent);
}


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

.sai-about__heading-wrap {
    position: relative;
    isolation: isolate;
}

.sai-about__school-name {
    display: inline-block;
    max-width: 100%;
    margin-top: 24px;
    padding: 12px 20px;
    border-left: 3px solid var(--sai-accent);
    border-radius: 0 8px 8px 0;
    background: rgba(204, 85, 77, 0.07);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(19px, 1.65vw, 28px);
    font-style: italic;
    font-weight: 400;
    letter-spacing: 0.025em;
    line-height: 1.5;
    color: var(--sai-accent);
}

.sai-about__title {
    max-width: 790px;
    margin: 0;
    color: var(--sai-dark);
    font-size: 52px;
    font-weight: 500;
    line-height: 0.98;
    letter-spacing: 1px;
}

.sai-about__title span {
    display: block;
    margin-top: 7px;
    color: var(--sai-accent);
    font-style: normal;
    font-weight: 500;
}


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

.sai-about__description {
    width: min(650px, 100%);
    margin-top: 34px;
}

.sai-about__description p {
    margin: 0 0 17px;
    color: #283544;
    font-size: 19px;
    line-height: 1.65;
    font-weight: 400;
}


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

.sai-about__stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(110px, 1fr));
    max-width: 700px;
    margin-top: 35px;
}

.sai-stat {
    position: relative;
    padding: 0 18px;
    text-align: center;
    border-right: 1px solid rgba(20, 34, 53, 0.20);
}

.sai-stat:first-child {
    padding-left: 0;
}

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


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

.sai-stat__icon {
    height: 28px;
    margin-bottom: 5px;
    color: var(--sai-dark);
    font-size: 26px;
    line-height: 1;
}


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

.sai-stat strong {
    display: block;
    color: var(--sai-dark);
    font-size: 22px;
    line-height: 1.1;
    font-weight: 600;
}


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

.sai-stat span {
    display: block;
    margin-top: 5px;
    color: #263442;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
}


/* =========================================
   STAT SUBTITLE
========================================= */

.sai-stat small {
    display: block;
    margin-top: 4px;
    color: #6c747b;
    font-size: 9px;
    line-height: 1.3;
}


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

.sai-about__button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 35px;
    min-width: 195px;
    margin-top: 34px;
    padding: 17px 21px;
    color: #ffffff;
    background: var(--sai-accent);
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    border-radius: 2px;
    transition: transform 0.35s ease, background 0.35s ease, box-shadow 0.35s ease;
}

.sai-about__button b {
    font-size: 19px;
    font-weight: 400;
    line-height: 1;
    transition: transform 0.35s ease;
}

.sai-about__button:hover {
    background: #b94740;
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.14);
}

.sai-about__button:hover b {
    transform: translateX(5px);
}


/* =========================================
   RIGHT HANDWRITTEN TEXT
========================================= */

.sai-about__right-text {
    position: absolute;
    top: 34px;
    right: 9%;
    z-index: 3;
    pointer-events: none;
}

.sai-about__script {
    color: rgba(117, 86, 58, 0.46);
    font-size: clamp(38px, 3.5vw, 62px);
    line-height: 0.9;
    transform: rotate(-7deg);
}


/* =========================================
   VERTICAL WORDS
========================================= */

.sai-about__vertical {
    position: absolute;
    top: 32px;
    left: 340px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding-left: 19px;
    border-left: 2px solid var(--sai-accent);
    white-space: nowrap;
}

.sai-about__vertical span {
    color: var(--sai-dark);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 2px;
}


/* =========================================
   BETTER WORLD MESSAGE
========================================= */

.sai-about__message {
    position: absolute;
    right: 28px;
    bottom: 55px;
    z-index: 5;
    width: 105px;
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #ffffff;
    text-align: center;
}

.sai-about__message span {
    margin-bottom: 5px;
    font-size: 13px;
}

.sai-about__message strong {
    font-size: 18px;
    line-height: 1.25;
    letter-spacing: 2px;
    font-weight: 500;
}

.sai-about__message i {
    width: 30px;
    height: 2px;
    margin-top: 12px;
    background: var(--sai-accent);
}


/* =========================================
   DECORATIVE CURVE
========================================= */

.sai-about__curve {
    position: absolute;
    top: 0;
    right: 4%;
    width: 340px;
    height: 100%;
    z-index: 2;
    pointer-events: none;
    overflow: visible;
}

.sai-about__curve path {
    fill: none;
    stroke: rgba(204, 85, 77, 0.55);
    stroke-width: 1.2;
}


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

.sai-about__right-text::after {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    top: 56px;
    right: -48px;
    border-radius: 50%;
    background: var(--sai-accent);
}


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

@media (max-width: 1200px) {
    .sai-about {
        min-height: 700px;
    }
    .sai-about__content {
        width: 62%;
        padding-left: 55px;
    }
    .sai-about__title {
        font-size: clamp(48px, 5vw, 72px);
    }
    .sai-about__right-text {
        right: 8%;
    }
    .sai-about__vertical {
        left: 260px;
    }
    .sai-about__message {
        right: 15px;
    }
}


/* MacBook/laptop layout: keep copy inside the cream panel, away from the photo. */

@media (min-width: 901px) and (max-width: 1440px) {
    .sai-about {
        min-height: 620px;
    }
    .sai-about__image img {
        object-fit: cover;
        object-position: 58% center;
    }
    .sai-about__overlay {
        background: linear-gradient(90deg, var(--sai-cream) 0%, var(--sai-cream) 43%, rgba(248, 245, 239, 0.98) 47%, rgba(248, 245, 239, 0.82) 52%, rgba(248, 245, 239, 0.25) 60%, rgba(248, 245, 239, 0) 67%);
    }
    .sai-about__content {
        width: 48%;
        max-width: 650px;
        padding: 58px 28px 58px clamp(42px, 6vw, 82px);
    }
    .sai-about__label {
        margin-bottom: 16px;
    }
    .sai-about__title {
        max-width: 560px;
        font-size: clamp(38px, 3.25vw, 47px);
        line-height: 1.04;
        letter-spacing: 0;
    }
    .sai-about__school-name {
        margin-top: 19px;
        padding: 9px 15px;
        font-size: clamp(15px, 1.35vw, 19px);
    }
    .sai-about__description {
        width: 100%;
        max-width: 555px;
        margin-top: 26px;
    }
    .sai-about__description p {
        margin-bottom: 13px;
        font-size: 15px;
        line-height: 1.55;
    }
}


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

@media (max-width: 900px) {
    .sai-about {
        min-height: auto;
        display: block;
        background: var(--sai-cream);
    }
    .sai-about__image {
        position: relative;
        width: 100%;
        height: 450px;
    }
    .sai-about__overlay {
        display: none;
    }
    .sai-about__content {
        width: 100%;
        max-width: none;
        padding: 55px 35px 65px;
    }
    .sai-about__title {
        max-width: 800px;
        font-size: clamp(48px, 8vw, 70px);
    }
    .sai-about__description {
        max-width: 700px;
    }
    .sai-about__right-text,
    .sai-about__message,
    .sai-about__curve {
        display: none;
    }
}


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

@media (max-width: 650px) {
    .sai-about__image {
        height: 330px;
    }
    .sai-about__content {
        padding: 42px 22px 50px;
    }
    .sai-about__label {
        margin-bottom: 17px;
    }
    .sai-about__label span {
        font-size: 10px;
        letter-spacing: 4px;
    }
    .sai-about__label i {
        width: 35px;
    }
    .sai-about__title {
        font-size: clamp(42px, 12vw, 58px);
        line-height: 0.98;
        letter-spacing: -2px;
    }
    .sai-about__description {
        margin-top: 27px;
    }
    .sai-about__description p {
        font-size: 14px;
        line-height: 1.65;
    }
    .sai-about__stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px 0;
        margin-top: 30px;
    }
    .sai-stat {
        padding: 0 10px;
    }
    .sai-stat:nth-child(2) {
        border-right: 0;
    }
    .sai-stat:nth-child(3),
    .sai-stat:nth-child(4) {
        padding-top: 20px;
        border-top: 1px solid rgba(20, 34, 53, 0.16);
    }
    .sai-stat strong {
        font-size: 20px;
    }
    .sai-stat span {
        font-size: 11px;
    }
    .sai-stat small {
        font-size: 8px;
    }
    .sai-about__button {
        width: 100%;
        max-width: 210px;
        margin-top: 30px;
    }
}


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

@media (max-width: 420px) {
    .sai-about__image {
        height: 280px;
    }
    .sai-about__content {
        padding-left: 18px;
        padding-right: 18px;
    }
    .sai-about__title {
        font-size: 39px;
    }
    .sai-about__stats {
        gap: 20px 0;
    }
    .sai-stat strong {
        font-size: 18px;
    }
}


/* ========================================================================== 
   NEW FULL-WIDTH FOOTER
   ========================================================================== */

.sai-new-footer {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    overflow: hidden;
    color: #f7f3ef;
    background: #130f0d;
    font-family: var(--sai-font-body);
}

.sai-new-footer__backdrop {
    position: absolute;
    inset: 0;
    background: url("images/section-bg.png") center/cover no-repeat;
    transform: scale(1.02);
}

.sai-new-footer__shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(16, 12, 10, .98) 0%, rgba(16, 12, 10, .92) 38%, rgba(16, 12, 10, .53) 67%, rgba(16, 12, 10, .73) 100%);
}

.sai-new-footer__content {
    position: relative;
    z-index: 1;
    min-height: 520px;
    display: grid;
    grid-template-columns: 1.05fr 1.25fr 1.15fr 1.55fr;
    gap: 40px;
    max-width: 1800px;
    margin: 0 auto;
    padding: 72px max(6vw, 48px) 82px;
}

.sai-new-footer__brand,
.sai-new-footer__contact,
.sai-new-footer__promise {
    border-right: 1px solid rgba(220, 152, 132, .42);
    padding-right: 40px;
}

.sai-new-footer__logo {
    display: block;
    width: 255px;
    max-width: 100%;
    height: auto;
    filter: none;
}

.sai-new-footer__motto {
    margin: 27px 0 27px;
    color: #d4ccc8;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 7px;
    white-space: nowrap;
}

.sai-new-footer__motto span {
    color: #d75c50;
    margin: 0 10px;
}

.sai-new-footer__rule {
    display: block;
    width: 61px;
    height: 2px;
    margin: 0 0 24px;
    background: #d75c50;
}

.sai-new-footer__intro {
    max-width: 320px;
    margin: 0 0 30px;
    color: #d4ccc8;
    font-size: 16px;
    line-height: 1.62;
}

.sai-new-footer__socials {
    display: flex;
    gap: 17px;
}

.sai-new-footer__socials a {
    display: grid;
    place-items: center;
    width: 47px;
    height: 47px;
    border: 1px solid rgba(255, 255, 255, .62);
    border-radius: 50%;
    color: #fff;
    font-size: 20px;
    transition: .25s ease;
}

.sai-new-footer__socials a:hover {
    background: #d75c50;
    border-color: #d75c50;
    transform: translateY(-3px);
}

.sai-new-footer__contact h2,
.sai-new-footer__promise h2 {
    margin: 0;
    color: #fff;
    font-family: var(--sai-font-heading);
    font-weight: 400;
}

.sai-new-footer__contact h2 {
    font-size: 33px;
}

.sai-new-footer__contact .sai-new-footer__rule {
    margin-top: 17px;
}

.sai-new-footer__contact>a {
    display: flex;
    align-items: center;
    gap: 22px;
    margin: 17px 0;
    color: #ddd6d2;
    font-size: 15px;
    line-height: 1.5;
}

.sai-new-footer__contact>a span {
    display: grid;
    place-items: center;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    border: 1.5px solid #dc6657;
    border-radius: 50%;
    color: #fff;
    font-size: 20px;
}

.sai-new-footer__contact>a:hover {
    color: #fff;
}

.sai-new-footer__contact b {
    margin-left: auto;
    color: #fff;
    font-size: 19px;
}

.sai-new-footer__promise {
    display: flex;
    align-items: center;
}

.sai-new-footer__promise-card {
    width: 100%;
    max-width: 290px;
    min-height: 330px;
    padding: 29px;
    border: 1px solid rgba(210, 142, 121, .23);
    border-radius: 12px;
    background: rgba(17, 13, 11, .24);
}

.sai-new-footer__promise-card>.fa-graduation-cap {
    display: grid;
    place-items: center;
    width: 70px;
    height: 70px;
    border: 2px solid rgba(255, 255, 255, .18);
    border-radius: 50%;
    color: #dc6657;
    font-size: 31px;
}

.sai-new-footer__promise h2 {
    margin: 19px 0;
    font-size: 31px;
    line-height: 1.1;
}

.sai-new-footer__promise h2 em {
    display: block;
    color: #de6556;
    font-style: normal;
}

.sai-new-footer__promise-card p {
    color: #d4ccc8;
    font-size: 12px;
    letter-spacing: 5px;
    line-height: 2.1;
}

.sai-new-footer__vision {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding-bottom: 6px;
}

.sai-new-footer__vision p {
    margin: 0;
    padding-right: 24px;
    border-right: 3px solid #d75c50;
    color: #d0c6c1;
    font-size: 12px;
    line-height: 2.35;
    letter-spacing: 4px;
    text-align: right;
}

.sai-new-footer__vision strong {
    color: #fff;
    font-weight: 500;
}

.sai-new-footer__bottom {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 24px;
    align-items: center;
    min-height: 105px;
    padding: 20px max(6vw, 48px);
    border-top: 1px solid rgba(255, 255, 255, .2);
    background: rgba(14, 11, 9, .83);
}

.sai-new-footer__bottom p {
    margin: 0;
    color: #d0c8c4;
    font-size: 13px;
}

.sai-new-footer__bottom>span {
    color: #a69b96;
    font-size: 11px;
    letter-spacing: 7px;
    white-space: nowrap;
}

.sai-new-footer__bottom>span::before,
.sai-new-footer__bottom>span::after {
    display: inline-block;
    width: 48px;
    height: 1px;
    margin: 0 28px 4px;
    background: #a9564b;
    content: "";
}

.sai-new-footer__bottom nav {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 20px;
}

.sai-new-footer__bottom a {
    color: #ded6d1;
    font-size: 13px;
    white-space: nowrap;
}

.sai-new-footer__bottom a+a {
    border-left: 1px solid rgba(255, 255, 255, .35);
    padding-left: 20px;
}

.sai-new-footer__bottom button {
    width: 58px;
    height: 58px;
    margin-left: 14px;
    border: 0;
    border-radius: 50%;
    background: #d75c50;
    color: #fff;
    font-size: 28px;
    cursor: pointer;
}

@media (max-width:1200px) {
    .sai-new-footer__content {
        grid-template-columns: 1fr 1.2fr;
        padding: 60px 7vw;
    }
    .sai-new-footer__brand,
    .sai-new-footer__contact {
        border-right: 0;
    }
    .sai-new-footer__promise {
        border-top: 1px solid rgba(220, 152, 132, .42);
        padding-top: 35px;
    }
    .sai-new-footer__vision {
        border-top: 1px solid rgba(220, 152, 132, .42);
        padding-top: 35px;
        min-height: 250px;
    }
    .sai-new-footer__bottom {
        grid-template-columns: 1fr;
        text-align: center;
    }
    .sai-new-footer__bottom nav {
        justify-content: center;
    }
}

@media (max-width:700px) {
    .sai-new-footer__content {
        display: block;
        padding: 52px 25px;
    }
    .sai-new-footer__brand,
    .sai-new-footer__contact,
    .sai-new-footer__promise {
        border: 0;
        padding: 0 0 40px;
        margin-bottom: 40px;
        border-bottom: 1px solid rgba(220, 152, 132, .35);
    }
    .sai-new-footer__logo {
        width: 220px;
    }
    .sai-new-footer__motto {
        font-size: 10px;
        letter-spacing: 4px;
    }
    .sai-new-footer__motto span {
        margin: 0 5px;
    }
    .sai-new-footer__intro {
        font-size: 14px;
    }
    .sai-new-footer__contact h2 {
        font-size: 29px;
    }
    .sai-new-footer__contact>a {
        font-size: 13px;
        gap: 13px;
    }
    .sai-new-footer__contact>a span {
        flex-basis: 45px;
        width: 45px;
        height: 45px;
        font-size: 16px;
    }
    .sai-new-footer__promise-card {
        max-width: 100%;
    }
    .sai-new-footer__vision {
        justify-content: flex-start;
        border: 0;
        padding: 0;
        min-height: auto;
    }
    .sai-new-footer__vision p {
        text-align: left;
        border-right: 0;
        border-left: 3px solid #d75c50;
        padding: 0 0 0 17px;
    }
    .sai-new-footer__bottom {
        padding: 28px 25px;
    }
    .sai-new-footer__bottom>span {
        font-size: 9px;
        letter-spacing: 3px;
    }
    .sai-new-footer__bottom>span::before,
    .sai-new-footer__bottom>span::after {
        width: 22px;
        margin: 0 9px 3px;
    }
    .sai-new-footer__bottom nav {
        flex-wrap: wrap;
        gap: 12px;
    }
    .sai-new-footer__bottom a {
        font-size: 11px;
    }
    .sai-new-footer__bottom a+a {
        padding-left: 12px;
    }
    .sai-new-footer__bottom button {
        width: 45px;
        height: 45px;
        margin-left: 5px;
    }
}


/* =========================================
   SAI FOUNDER SECTION
   ========================================= */

.sai-founder-section {
    width: 100%;
    position: relative;
    overflow: hidden;
    background: #faf8f3;
    padding: 0;
}

.sai-founder-wrap {
    width: 100%;
    min-height: auto;
    position: relative;
    display: grid;
    grid-template-columns: 44% 56%;
    overflow: hidden;
}


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

.founder-bg-circle {
    position: absolute;
    width: 650px;
    height: 650px;
    left: -170px;
    top: -110px;
    border-radius: 50%;
    background: #c9554b;
    opacity: 0.96;
    z-index: 0;
}

.founder-bg-circle-2 {
    width: 570px;
    height: 570px;
    left: 240px;
    top: 110px;
    background: #f0ddd5;
    opacity: 0.55;
    z-index: 0;
}


/* =========================================
   LEFT VISUAL
   ========================================= */

.founder-visual {
    position: relative;
    min-height: auto;
    display: flex;
    align-items: flex-end;
    z-index: 2;
    padding-top: 0;
    margin-top: 40px;
}

.founder-red-shape {
    position: absolute;
    width: 570px;
    height: 570px;
    left: -130px;
    top: 70px;
    border-radius: 50%;
    background: #bd5048;
    z-index: 1;
}

.founder-image {
    position: relative;
    z-index: 3;
    left: 0;
    bottom: 0;
    width: min(720px, 105%);
    height: 600px;
    object-fit: contain;
    object-position: left bottom;
    filter: saturate(0.96);
}


/* =========================================
   SIDE HANDWRITTEN NOTE
   ========================================= */

.founder-side-note {
    position: absolute;
    left: 32px;
    top: 205px;
    z-index: 5;
    color: #fff;
    font-size: 28px;
    line-height: 1.05;
    transform: rotate(-7deg);
    opacity: 0.95;
}

.founder-side-note span {
    display: block;
    width: 130px;
    height: 2px;
    margin-top: 15px;
    background: #fff;
    transform: rotate(-3deg);
}


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

.founder-quote-card {
    position: absolute;
    z-index: 7;
    left: 28%;
    bottom: 40px;
    width: 430px;
    padding: 30px 42px 27px;
    background: rgba(255, 252, 247, 0.96);
    box-shadow: 0 18px 45px rgba(31, 45, 65, 0.12);
    border-radius: 3px;
}

.quote-mark {
    position: absolute;
    left: 15px;
    top: 10px;
    font-size: 70px;
    line-height: 1;
    color: #d9b9b2;
}

.founder-quote-card p {
    position: relative;
    margin: 0 0 12px;
    padding-left: 25px;
    font-size: 19px;
    line-height: 1.3;
    color: #263852;
    font-family: Georgia, serif;
    font-style: italic;
}

.founder-quote-card strong {
    display: block;
    padding-left: 25px;
    font-size: 18px;
    line-height: 1.35;
    color: #c95349;
    font-family: Georgia, serif;
    font-style: italic;
}

.quote-author {
    margin-top: 18px;
    margin-left: 25px;
    font-family: Georgia, serif;
    font-style: italic;
    font-size: 15px;
    color: #56647a;
}

.quote-line {
    width: 75px;
    height: 2px;
    margin-left: 25px;
    margin-top: 8px;
    background: #c95349;
    transform: rotate(-5deg);
}


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

.founder-content {
    position: relative;
    z-index: 5;
    padding: 55px 6% 50px 5%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}


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

.founder-top-label {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 38px;
    margin-bottom: 25px;
    font-size: 14px;
    letter-spacing: 5px;
    color: #4d5b70;
}

.founder-top-label span {
    width: 70px;
    height: 1px;
    background: #8c9299;
}


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

.founder-title {
    margin: 0;
    text-align: left;
    font-size: 52PX;
    line-height: 0.98;
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 500;
    color: #162640;
}

.founder-title span {
    color: #c95349;
    display: inline;
}


/* =========================================
   SUBTITLE
   ========================================= */

.founder-subtitle {
    text-align: left;
    margin-top: 22px;
    font-size: 13px;
    letter-spacing: 6px;
    color: #6a7180;
}


/* =========================================
   COPY
   ========================================= */

.founder-copy {
    display: flex;
    margin-top: 55px;
    max-width: 720px;
}

.founder-accent-line {
    flex: 0 0 3px;
    height: 240px;
    margin-right: 27px;
    background: #ce574c;
}

.founder-text {
    max-width: 650px;
}

.founder-text p {
    margin: 0 0 27px;
    font-size: 19px;
    line-height: 1.6;
    color: #53647d;
}

.founder-text .founder-intro {
    font-size: 19px;
    line-height: 1.55;
    color: #293c59;
}


/* =========================================
   VALUES
   ========================================= */

.founder-values {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    max-width: 720px;
    margin-top: 8px;
}

.founder-value {
    min-height: 100px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: flex-start;
    position: relative;
}

.founder-value:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 5px;
    width: 1px;
    height: 70px;
    background: #ddd6cf;
}

.value-icon {
    width: 58px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 9px;
    border-radius: 50%;
    background: #fae7e3;
    color: #ce5146;
}

.value-icon svg {
    width: 29px;
    height: 29px;
}

.founder-value span {
    font-size: 14px;
    line-height: 1.25;
    color: #3f5068;
}


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

.founder-cta {
    width: 345px;
    min-height: 57px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 25px;
    padding: 6px 7px 6px 25px;
    text-decoration: none;
    background: #d55449;
    border-radius: 40px;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.founder-cta:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(197, 79, 69, 0.22);
}

.cta-arrow {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff;
    color: #d55449;
    font-size: 25px;
}


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

.founder-links {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 19px;
    font-size: 14px;
}

.founder-links a {
    color: #56647a;
    text-decoration: none;
    transition: color 0.2s ease;
}

.founder-links a:hover {
    color: #d55449;
}

.founder-links i {
    width: 1px;
    height: 16px;
    background: #c95349;
}


/* =========================================
   SIGNATURE
   ========================================= */

.founder-signature {
    position: absolute;
    right: 11%;
    bottom: 42px;
    font-family: "Brush Script MT", "Segoe Script", cursive;
    font-size: 28px;
    color: #37465d;
    transform: rotate(-4deg);
}

.founder-signature span {
    display: block;
    width: 85px;
    height: 2px;
    margin-left: 65px;
    margin-top: 2px;
    background: #ce554b;
    transform: rotate(-3deg);
}


/* =========================================
   RIGHT HANDWRITTEN NOTE
   ========================================= */

.founder-right-note {
    position: absolute;
    right: 3%;
    top: 195px;
    z-index: 4;
    font-family: "Brush Script MT", "Segoe Script", cursive;
    font-size: 38px;
    line-height: 1.05;
    color: #dfb2a9;
    transform: rotate(-4deg);
    text-align: center;
}


/* =========================================
   CAMPUS LINE ART
   ========================================= */

.founder-campus-line {
    position: absolute;
    right: -30px;
    bottom: -15px;
    width: 390px;
    height: 230px;
    opacity: 0.32;
    z-index: 1;
}


/* MacBook/laptop: give the copy room and remove the overlapping decoration. */

@media (min-width: 1201px) and (max-width: 1440px) {
    .sai-founder-wrap {
        grid-template-columns: 43% 57%;
    }
    .founder-visual {
        margin-top: 24px;
    }
    .founder-image {
        width: 100%;
        height: 560px;
    }
    .founder-content {
        padding: 46px 4% 42px 3.5%;
    }
    .founder-top-label {
        gap: 28px;
        margin-bottom: 20px;
        font-size: 12px;
    }
    .founder-top-label span {
        width: 58px;
    }
    .founder-title {
        font-size: 44px;
        line-height: 1.02;
    }
    .founder-subtitle {
        margin-top: 17px;
        font-size: 11px;
        letter-spacing: 4px;
        line-height: 1.5;
    }
    .founder-copy {
        max-width: 680px;
        margin-top: 34px;
    }
    .founder-accent-line {
        height: auto;
        min-height: 190px;
        margin-right: 21px;
    }
    .founder-text p,
    .founder-text .founder-intro {
        margin-bottom: 20px;
        font-size: 16px;
        line-height: 1.5;
    }
    .founder-values {
        margin-top: 4px;
    }
    .value-icon {
        width: 52px;
        height: 52px;
    }
    .founder-value span {
        font-size: 12px;
    }
    .founder-right-note {
        display: none;
    }
}

.campus-building {
    position: absolute;
    bottom: 0;
    border: 2px solid #8c9299;
    background: transparent;
}

.building-one {
    width: 135px;
    height: 130px;
    right: 185px;
}

.building-two {
    width: 170px;
    height: 180px;
    right: 15px;
}

.building-three {
    width: 95px;
    height: 100px;
    right: 330px;
}

.campus-building::before {
    content: "";
    position: absolute;
    left: 15px;
    right: 15px;
    top: 25px;
    height: 80px;
    background: repeating-linear-gradient( to right, transparent 0, transparent 16px, #8c9299 17px, #8c9299 19px, transparent 20px);
}

.campus-building::after {
    content: "";
    position: absolute;
    left: -12px;
    right: -12px;
    top: -18px;
    height: 20px;
    border-top: 2px solid #8c9299;
}


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

@media (max-width: 1200px) {
    .sai-founder-wrap {
        grid-template-columns: 42% 58%;
    }
    .founder-content {
        padding-left: 2%;
        padding-right: 5%;
    }
    .founder-title {
        font-size: 50px;
    }
    .founder-copy {
        margin-top: 40px;
    }
    .founder-text p {
        font-size: 15px;
    }
    .founder-quote-card {
        left: 18%;
        width: 390px;
    }
    .founder-right-note {
        display: none;
    }
    .founder-campus-line {
        opacity: 0.2;
    }
}


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

@media (max-width: 850px) {
    .sai-founder-wrap {
        display: block;
        min-height: auto;
        padding-bottom: 48px;
    }
    .founder-visual {
        /* The portrait includes the founder's face and lectern, so it needs a
           dedicated full-height frame on mobile instead of being cropped. */
        height: 560px;
        min-height: 560px;
        margin-top: 0;
        overflow: hidden;
    }
    .founder-red-shape {
        width: 500px;
        height: 500px;
        left: -170px;
        top: 40px;
    }
    .founder-image {
        width: 100%;
        height: 520px;
        object-position: left bottom;
    }
    .founder-side-note {
        left: 25px;
        top: 125px;
        font-size: 23px;
    }
    .founder-quote-card {
        left: 20px;
        bottom: 20px;
        width: calc(100% - 40px);
        padding: 25px 25px 22px;
    }
    .founder-content {
        padding: 42px 25px 0;
    }
    .founder-top-label {
        gap: 15px;
        font-size: 11px;
        letter-spacing: 3px;
    }
    .founder-top-label span {
        width: 40px;
    }
    .founder-title {
        font-size: 43px;
        line-height: 1.02;
    }
    .founder-title span {
        display: block;
    }
    .founder-subtitle {
        font-size: 10px;
        letter-spacing: 3px;
        line-height: 1.5;
    }
    .founder-copy {
        margin-top: 35px;
    }
    .founder-accent-line {
        height: auto;
        min-height: 250px;
        margin-right: 18px;
    }
    .founder-text p,
    .founder-text .founder-intro {
        font-size: 15px;
    }
    .founder-values {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px 0;
        margin-top: 20px;
    }
    .founder-value:nth-child(2)::after {
        display: none;
    }
    .founder-cta {
        width: 100%;
        margin-top: 30px;
    }
    .founder-links {
        flex-wrap: wrap;
    }
    .founder-signature {
        position: static;
        margin-top: 30px;
        text-align: right;
    }
    .founder-campus-line {
        display: none;
    }
}


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

@media (max-width: 480px) {
    .founder-visual {
        height: 520px;
        min-height: 520px;
    }
    .founder-red-shape {
        width: 410px;
        height: 410px;
        left: -170px;
        top: 30px;
    }
    .founder-image {
        width: 100%;
        height: 490px;
    }
    .founder-side-note {
        font-size: 19px;
    }
    .founder-quote-card {
        padding: 21px;
    }
    .founder-quote-card p {
        font-size: 16px;
    }
    .founder-quote-card strong {
        font-size: 15px;
    }
    .founder-title {
        margin-top: 20px;
        font-size: 31px;
    }
    .founder-copy {
        gap: 0;
    }
    .founder-text p,
    .founder-text .founder-intro {
        font-size: 14px;
    }
    .founder-values {
        gap: 20px 0;
    }
    .founder-value span {
        font-size: 12px;
    }
    .value-icon {
        width: 50px;
        height: 50px;
    }
    .founder-links {
        font-size: 12px;
        gap: 9px;
    }
}


/* =====================================================
   PLACEMENTS & PATHWAYS
===================================================== */

.placements-pathways {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 80px 0 70px;
    background: #fff;
    color: #102f55;
}


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

.pp-dots {
    position: absolute;
    width: 90px;
    height: 90px;
    opacity: .45;
    background-image: radial-gradient( #8da3bc 1.5px, transparent 1.5px);
    background-size: 14px 14px;
    pointer-events: none;
}

.pp-dots-left {
    left: 10px;
    top: 160px;
}

.pp-dots-right {
    right: 20px;
    top: 55px;
}


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

.pp-container {
    width: min(1500px, calc(100% - 70px));
    margin: 0 auto;
    position: relative;
    z-index: 2;
}


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

.pp-heading {
    text-align: center;
    margin-bottom: 35px;
}

.pp-eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-bottom: 15px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 4px;
    color: #183b61;
}

.pp-eyebrow span {
    width: 80px;
    height: 2px;
    background: #e32e36;
}

.pp-heading h2 {
    margin: 0 0 12px;
    color: #102f55;
    font-size: 53px;
    line-height: 1.15;
    font-weight: 500;
}

.pp-heading h2 strong {
    color: #cc554d;
    font-weight: 500;
}

.pp-heading p {
    max-width: 850px;
    margin: auto;
    color: #365579;
    font-size: 17px;
    line-height: 1.6;
}


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

.pp-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    max-width: 1050px;
    margin: 0 auto 35px;
}

.pp-stat {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-height: 75px;
}

.pp-stat:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 15px;
    width: 1px;
    height: 45px;
    background: #d5dfe9;
}

.pp-stat-icon {
    width: 62px;
    height: 62px;
    flex: 0 0 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 8px 25px rgba(25, 55, 90, .08);
    font-size: 25px;
}

.pp-stat strong {
    display: block;
    font-size: 25px;
    line-height: 1;
    color: #102f55;
}

.pp-stat span {
    display: block;
    margin-top: 5px;
    font-size: 14px;
    color: #536c88;
}


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

.pp-logo-row {
    position: relative;
    display: grid;
    grid-template-columns: 310px 1fr 65px;
    align-items: stretch;
    min-height: 145px;
    margin-bottom: 18px;
    overflow: hidden;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 10px 35px rgba(30, 65, 100, .08);
}


/* =====================================================
   LEFT TITLE AREA
===================================================== */

.pp-row-title {
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #123b68;
    color: #ffffff;
}

.pp-row-title::after {
    content: "";
    position: absolute;
    right: -45px;
    top: 0;
    width: 90px;
    height: 100%;
    background: #ffffff;
    clip-path: polygon( 50% 0, 100% 0, 100% 100%, 0 100%);
}

.pp-row-image {
    position: absolute;
    inset: 0;
    opacity: .25;
}

.pp-row-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pp-row-title-content {
    position: relative;
    z-index: 2;
    padding: 20px 30px;
}

.pp-row-title-content small {
    display: block;
    font-size: 16px;
    line-height: 1.25;
    font-weight: 500;
}

.pp-row-title-content h3 {
    margin-top: 5px;
    font-size: 40px;
    line-height: 1;
    font-weight: 600;
}


/* =====================================================
   GLOBAL ROW TITLE
===================================================== */

.pp-global-row .pp-row-title {
    background: #edf5ff;
    color: #173c65;
}

.pp-global-row .pp-row-title::after {
    background: #ffffff;
}

.pp-global-row .pp-row-title {
    background: linear-gradient(90deg, #f7fcff 0%, #e7f4ff 100%);
}

.pp-global-row {
    grid-template-columns: 310px 1fr 65px;
}

.pp-global-row .pp-row-title-content {
    padding: 29px 16px 20px 132px;
}

.pp-global-row .pp-row-title-content h3 {
    font-size: 36px;
}

.pp-global-row .pp-row-title-content::before {
    content: "";
    position: absolute;
    left: 112px;
    top: 31px;
    width: 2px;
    height: 62px;
    background: #e32e36;
}

.pp-global-art {
    position: absolute;
    left: -23px;
    top: 17px;
    width: 122px;
    height: 122px;
}

.pp-global-art img {
    width: 100%;
    height: 100%;
    display: block;
}

.pp-global-art span {
    position: absolute;
    top: 21px;
    right: -3px;
    color: #2585d2;
    font-size: 20px;
    line-height: 1;
}


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

.pp-industry-row .pp-row-title {
    background: #142f52;
}


/* =====================================================
   LOGO VIEWPORT
   IMPORTANT:
   JS TRACK WILL MOVE INSIDE THIS AREA
===================================================== */

.pp-logos {
    position: relative;
    display: block;
    min-width: 0;
    overflow: hidden;
    padding: 18px 0;
}


/* =====================================================
   MOVING TRACK
===================================================== */

.pp-logo-track {
    display: flex;
    align-items: center;
    width: max-content;
    height: 100%;
    will-change: transform;
}


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

   Desktop:
   4 logos visible at one time

   Logo area available approx:
   1060px
   1060 / 4 = 265px

   So each logo gets 265px
===================================================== */

.pp-logo-track .pp-logo {
    width: 265px;
    min-width: 265px;
    flex: 0 0 265px;
    height: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 15px;
    border-right: 1px solid #edf0f4;
    transition: transform .3s ease, opacity .3s ease;
    box-sizing: border-box;
}


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

.pp-logo-track .pp-logo img {
    width: 105px;
    height: 90px;
    object-fit: contain;
    display: block;
    transition: transform .3s ease;
}


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

.pp-logo-track .pp-logo span {
    display: none;
    max-width: 130px;
    text-align: center;
    color: #183a60;
    font-size: 12px;
    line-height: 1.15;
    font-weight: 600;
}


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

.pp-logo-track .pp-logo:hover {
    transform: translateY(-5px);
}

.pp-logo-track .pp-logo:hover img {
    transform: scale(1.06);
}


/* =====================================================
   THIRD ROW — 6 LOGOS

   Same viewport.
   Six logos will move continuously.
===================================================== */

.pp-six-logos {
    display: block;
}


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

.pp-arrow {
    align-self: center;
    justify-self: center;
    width: 42px;
    height: 42px;
    border: 1px solid #cfdcea;
    border-radius: 50%;
    background: #ffffff;
    color: #e32e36;
    font-size: 25px;
    line-height: 1;
    cursor: pointer;
    transition: .3s ease;
    position: relative;
    z-index: 5;
}

.pp-arrow:hover {
    background: #e32e36;
    color: #ffffff;
    border-color: #e32e36;
    transform: translateX(3px);
}


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

.pp-india-row {
    border-left: 7px solid #e32e36;
}

.pp-global-row {
    border-right: 7px solid #286cc2;
}

.pp-industry-row {
    border-left: 7px solid #e32e36;
}


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

.pp-bottom-line {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 32px;
    color: #60758d;
    font-size: 19px;
    font-weight: 500;
    letter-spacing: 3px;
}

.pp-bottom-line span {
    width: 55px;
    height: 2px;
    background: #e32e36;
}

.pp-bottom-line b {
    color: #e32e36;
    font-size: 14px;
}


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

@media (max-width: 1200px) {
    .pp-container {
        width: min(95%, 1000px);
    }
    .pp-logo-row {
        grid-template-columns: 250px 1fr 55px;
    }
    .pp-row-title-content h3 {
        font-size: 34px;
    }
    .pp-row-title-content small {
        font-size: 14px;
    }
    /*
       Tablet:
       approx 3 logos visible
    */
    .pp-logo-track .pp-logo {
        width: 230px;
        min-width: 230px;
        flex-basis: 230px;
    }
    .pp-logo-track .pp-logo img {
        width: 90px;
        height: 75px;
    }
    .pp-logo-track .pp-logo span {
        font-size: 10px;
    }
}


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

@media (max-width: 767px) {
    .placements-pathways {
        padding: 70px 0 55px;
        scroll-margin-top: 76px;
    }
    .pp-container {
        width: calc(100% - 28px);
    }
    .pp-heading {
        margin-bottom: 28px;
        padding-inline: 5px;
    }
    /* Heading */
    .pp-eyebrow {
        font-size: 10px;
        letter-spacing: 2px;
        line-height: 1.4;
    }
    .pp-eyebrow span {
        width: 35px;
    }
    .pp-heading h2 {
        font-size: clamp(30px, 9vw, 38px);
        line-height: 1.12;
    }
    .pp-heading h2 strong {
        display: block;
    }
    .pp-heading p {
        font-size: 14px;
    }
    /* Stats */
    .pp-stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
        margin-bottom: 30px;
    }
    .pp-stat {
        justify-content: flex-start;
    }
    .pp-stat:nth-child(2)::after {
        display: none;
    }
    .pp-stat:nth-child(4)::after {
        display: none;
    }
    .pp-stat-icon {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
        font-size: 20px;
    }
    .pp-stat strong {
        font-size: 20px;
    }
    .pp-stat span {
        font-size: 11px;
    }
    /* Logo row */
    .pp-logo-row {
        display: block;
        min-height: auto;
        margin-bottom: 16px;
        overflow: hidden;
        border-radius: 17px;
    }
    /* Title */
    .pp-row-title {
        min-height: 120px;
        width: 100%;
    }
    .pp-row-title::after {
        display: none;
    }
    .pp-row-title-content {
        padding: 20px 22px;
    }
    .pp-row-title-content h3 {
        margin-bottom: 0;
        font-size: 31px;
    }
    /*
       Mobile logo viewport
    */
    .pp-logos {
        width: 100%;
        overflow: hidden;
        padding: 8px 0;
    }
    /*
       2–3 logos visible
    */
    .pp-logo-track .pp-logo {
        width: calc((100vw - 28px) / 3);
        min-width: calc((100vw - 28px) / 3);
        flex-basis: calc((100vw - 28px) / 3);
        height: 98px;
        padding: 8px 5px;
    }
    .pp-logo-track .pp-logo img {
        width: min(72px, 75%);
        height: 60px;
    }
    .pp-logo-track .pp-logo span {
        font-size: 10px;
    }
    /* Arrow hidden */
    .pp-arrow {
        display: none;
    }
    .pp-global-row {
        border-right-width: 6px;
    }
    .pp-global-art {
        left: 8px;
        top: 13px;
        width: 94px;
        height: 94px;
    }
    .pp-global-row .pp-row-title-content {
        padding: 22px 14px 18px 120px;
    }
    .pp-global-row .pp-row-title-content::before {
        left: 103px;
        top: 25px;
        height: 58px;
    }
    .pp-global-row .pp-row-title-content h3 {
        font-size: 30px;
    }
    /* Bottom */
    .pp-bottom-line {
        font-size: 8px;
        letter-spacing: 1.5px;
    }
    .pp-bottom-line span {
        width: 25px;
    }
}


/* =========================================================
   TAKE A TOUR SECTION
   ========================================================= */

.tour-section {
    width: 100%;
    background: #ffffff;
    padding: 50px 5% 50px;
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
}


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

.tour-top {
    text-align: center;
    margin: 0 auto;
}

.tour-label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
    color: #cc554d;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 6px;
    margin-bottom: 18px;
}

.tour-label span {
    width: 55px;
    height: 1px;
    background: #cc554d;
}

.tour-top h2 {
    margin: 0;
    color: #17243a;
    font-size: 53px;
    line-height: .98;
    font-weight: 500;
    letter-spacing: 1px;
}

.tour-top h2 em {
    color: #cc554d;
    font-style: normal;
}

.tour-top p {
    margin: 25px auto 0;
    color: #687181;
    font-size: 19px;
    line-height: 1.65;
}


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

.tour-features {
    width: 100%;
    max-width: 1180px;
    margin: 48px auto 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tour-feature {
    display: flex;
    align-items: center;
    gap: 15px;
}

.feature-icon {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #fff3f1;
    border: 1px solid #f1d6d2;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #cc554d;
    font-size: 0;
    transition: transform .25s ease, background-color .25s ease, color .25s ease;
}

.feature-icon::before {
    font-family: "Font Awesome 6 Free";
    font-size: 21px;
    font-weight: 900;
}

.tour-feature:nth-of-type(1) .feature-icon::before {
    content: "\f19c";
}

.tour-feature:nth-of-type(3) .feature-icon::before {
    content: "\f0c3";
}

.tour-feature:nth-of-type(5) .feature-icon::before {
    content: "\e533";
}

.tour-feature:nth-of-type(7) .feature-icon::before {
    content: "\f185";
}

.tour-feature:hover .feature-icon {
    background: #cc554d;
    color: #ffffff;
    transform: translateY(-3px);
}

.tour-feature strong {
    display: block;
    color: #273249;
    font-size: 15px;
    letter-spacing: 1px;
    margin-bottom: 5px;
}

.tour-feature span {
    display: block;
    color: #7c8491;
    font-size: 16px;
}

.feature-divider {
    width: 1px;
    height: 55px;
    background: #cc554d;
    opacity: .55;
}


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

.tour-gallery {
    width: 100%;
    max-width: 1450px;
    margin: 0 auto;
    height: 350px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tour-gallery::before {
    content: "";
    position: absolute;
    left: 7%;
    right: 7%;
    top: 50%;
    height: 2px;
    background: linear-gradient(90deg, transparent 0%, rgba(204, 85, 77, .35) 8%, rgba(204, 85, 77, .55) 50%, rgba(204, 85, 77, .35) 92%, transparent 100%);
    z-index: 0;
}


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

.tour-card {
    position: absolute;
    width: 260px;
    height: 220px;
    padding: 10px 10px 14px;
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 15px 40px rgba(23, 36, 58, .10);
    box-sizing: border-box;
    z-index: 1;
}

.tour-card-image {
    width: 100%;
    height: 170px;
    overflow: hidden;
    border-radius: 5px;
}

.tour-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .5s ease;
}

.tour-card:hover .tour-card-image img {
    transform: scale(1.05);
}

.card-number {
    position: absolute;
    left: 18px;
    top: 14px;
    color: #566071;
    font-size: 8px;
    letter-spacing: 2px;
    z-index: 3;
    background: rgba(255, 255, 255, .9);
    padding: 3px 5px;
    border-radius: 3px;
}

.tour-card-title {
    color: #4d5768;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 1px;
    padding: 11px 3px 0;
}


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

.tour-card-1 {
    left: 1%;
    transform: rotate(4deg);
}

.tour-card-2 {
    left: 20%;
    transform: rotate(2deg);
    z-index: 2;
}

.tour-card-3 {
    right: 20%;
    transform: rotate(-2deg);
    z-index: 2;
}

.tour-card-4 {
    right: 1%;
    transform: rotate(-4deg);
}


/* =========================================================
   CENTER TOUR BUTTON
   ========================================================= */

.tour-cta {
    position: relative;
    width: 280px;
    height: 280px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    text-decoration: none;
    cursor: pointer;
}

.tour-cta::before {
    content: "";
    position: absolute;
    width: 275px;
    height: 275px;
    border-radius: 50%;
    border: 1px solid rgba(204, 85, 77, .25);
}

.tour-cta::after {
    content: "";
    position: absolute;
    width: 245px;
    height: 245px;
    border-radius: 50%;
    border: 1px solid rgba(204, 85, 77, .20);
}

.tour-circle {
    width: 205px;
    height: 205px;
    border-radius: 50%;
    background: #cc554d;
    border: 10px solid #f8dfdc;
    outline: 5px solid #ffffff;
    box-shadow: 0 15px 40px rgba(204, 85, 77, .22);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    position: relative;
    z-index: 5;
    transition: .4s ease;
}

.tour-circle:hover {
    transform: scale(1.05);
}

.tour-small-text {
    font-size: 19px;
    line-height: 1.1;
}

.tour-main-text {
    font-size: 44px;
    line-height: 1;
    margin-top: 3px;
    font-weight: 500;
}

.tour-play {
    width: 43px;
    height: 43px;
    margin-top: 15px;
    border: 2px solid #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    padding-left: 2px;
    box-sizing: border-box;
}


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

.tour-bottom-note {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 28px;
    color: #cc554d;
    font-size: 19px;
    font-style: italic;
    text-align: center;
    line-height: 1.05;
    z-index: 12;
}

.tour-bottom-note span {
    display: block;
}


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

@media (max-width: 1100px) {
    .tour-section {
        padding-left: 3%;
        padding-right: 3%;
    }
    .tour-card {
        width: 260px;
        height: 215px;
    }
    .tour-card-image {
        height: 165px;
    }
    .tour-card-1 {
        left: -2%;
    }
    .tour-card-4 {
        right: -2%;
    }
    .tour-card-2 {
        left: 22%;
    }
    .tour-card-3 {
        right: 22%;
    }
}


/* MacBook/laptop sizing for the feature row and layered tour gallery. */

@media (min-width: 901px) and (max-width: 1440px) {
    .tour-section {
        padding: 42px 4% 46px;
    }
    .tour-label {
        margin-bottom: 15px;
    }
    .tour-top h2 {
        font-size: clamp(39px, 3.35vw, 48px);
        line-height: 1.05;
        letter-spacing: 0;
    }
    .tour-top p {
        max-width: 900px;
        margin-top: 19px;
        font-size: 16px;
        line-height: 1.5;
    }
    .tour-features {
        max-width: 1080px;
        margin: 36px auto 34px;
        gap: 18px;
    }
    .tour-feature {
        min-width: 0;
        gap: 11px;
    }
    .feature-icon {
        width: 48px;
        height: 48px;
        flex: 0 0 48px;
    }
    .feature-icon::before {
        font-size: 18px;
    }
    .tour-feature strong {
        font-size: 12px;
        white-space: nowrap;
    }
    .tour-feature span {
        font-size: 13px;
        white-space: nowrap;
    }
    .feature-divider {
        height: 46px;
    }
    .tour-gallery {
        max-width: 1180px;
        height: 290px;
    }
    .tour-card {
        width: 220px;
        height: 185px;
        padding: 8px 8px 11px;
    }
    .tour-card-image {
        height: 142px;
    }
    .tour-card-title {
        padding-top: 8px;
        font-size: 12px;
    }
    .tour-card-1 {
        left: 0;
    }
    .tour-card-2 {
        left: 20%;
    }
    .tour-card-3 {
        right: 20%;
    }
    .tour-card-4 {
        right: 0;
    }
    .tour-cta {
        width: 230px;
        height: 230px;
    }
    .tour-cta::before {
        width: 225px;
        height: 225px;
    }
    .tour-cta::after {
        width: 202px;
        height: 202px;
    }
    .tour-circle {
        width: 170px;
        height: 170px;
        border-width: 8px;
    }
    .tour-small-text {
        font-size: 15px;
    }
    .tour-main-text {
        font-size: 36px;
    }
    .tour-play {
        width: 36px;
        height: 36px;
        margin-top: 11px;
    }
}


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

@media (max-width: 767px) {
    .tour-section {
        padding: 65px 20px 20px;
    }
    .tour-label {
        gap: 12px;
        font-size: 9px;
        letter-spacing: 3px;
    }
    .tour-label span {
        width: 30px;
    }
    .tour-top h2 {
        font-size: 40px;
        letter-spacing: -1px;
    }
    .tour-top p {
        font-size: 14px;
    }
    .tour-features {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
        margin-top: 40px;
        margin-bottom: 35px;
    }
    .feature-divider {
        display: none;
    }
    .tour-feature {
        gap: 10px;
    }
    .feature-icon {
        width: 45px;
        height: 45px;
        font-size: 0;
        flex-shrink: 0;
    }
    .feature-icon::before {
        font-size: 19px;
    }
    .tour-feature strong {
        font-size: 9px;
    }
    .tour-feature span {
        font-size: 11px;
    }
    .tour-gallery {
        height: auto;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 15px;
        /* Reserve the button's full height plus a clear gap below the cards. */
        padding-bottom: 235px;
    }
    .tour-card {
        position: relative;
        width: 100%;
        height: 180px;
        left: auto !important;
        right: auto !important;
        transform: none !important;
    }
    .tour-card-image {
        height: 130px;
    }
    .tour-card-title {
        font-size: 8px;
        letter-spacing: 2px;
    }
    .tour-cta {
        position: absolute;
        left: 50%;
        bottom: 20px;
        transform: translateX(-50%);
        width: 190px;
        height: 190px;
    }
    .tour-cta::before {
        width: 185px;
        height: 185px;
    }
    .tour-cta::after {
        width: 165px;
        height: 165px;
    }
    .tour-circle {
        width: 140px;
        height: 140px;
        border-width: 7px;
    }
    .tour-small-text {
        font-size: 14px;
    }
    .tour-main-text {
        font-size: 31px;
    }
    .tour-play {
        width: 32px;
        height: 32px;
        margin-top: 8px;
        font-size: 9px;
    }
    .tour-bottom-note {
        display: none;
    }
}


/* =========================================================
   LEARNING @ 360
   ========================================================= */

.learning360 {
    width: 100%;
    background: #ffffff;
    padding: 40px 5% 40px;
    box-sizing: border-box;
    overflow: hidden;
}

.learning360-inner {
    width: 100%;
    max-width: 1420px;
    margin: 0 auto;
}


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

.learning360-header {
    margin-bottom: 45px;
}

.learning360-kicker {
    display: flex;
    align-items: center;
    gap: 15px;
    color: #cc554d;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 2px;
    margin-bottom: 17px;
}

.learning360-kicker span {
    width: 45px;
    height: 1px;
    background: #cc554d;
}

.learning360-header h2 {
    margin: 0;
    color: #18253b;
    font-size: 53px;
    line-height: 1.02;
    font-weight: 500;
    letter-spacing: 1px;
}

.learning360-header p {
    margin: 22px 0 0;
    color: #66758b;
    font-size: 19px;
    line-height: 1.6;
}


/* =========================================================
   TABS
   ========================================================= */

.learning360-tabs {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}

.learning360-tab {
    width: 100%;
    min-height: 82px;
    border: 1px solid #e1e6ed;
    border-radius: 14px;
    background: #ffffff;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 15px 25px;
    cursor: pointer;
    text-align: left;
    transition: background .35s ease, border-color .35s ease, transform .35s ease, box-shadow .35s ease;
}

.learning360-tab:hover {
    border-color: #d9aaa5;
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(24, 37, 59, .07);
}

.learning360-tab.active {
    background: #cc554d;
    border-color: #cc554d;
    box-shadow: 0 14px 30px rgba(204, 85, 77, .16);
}

.learning360-tab.active .tab-copy strong,
.learning360-tab.active .tab-copy small,
.learning360-tab.active .tab-icon {
    color: #ffffff;
}

.tab-icon {
    width: 52px;
    height: 52px;
    flex-shrink: 0;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff3f1;
    color: #cc554d;
    transition: .3s ease;
}

.learning360-tab.active .tab-icon {
    background: rgba(255, 255, 255, .15);
}

.tab-icon svg {
    width: 27px;
    height: 27px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tab-copy {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.tab-copy strong {
    color: #18253b;
    font-size: 19px;
    font-weight: 500;
}

.tab-copy small {
    color: #758196;
    font-size: 15px;
}


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

.learning360-panel {
    width: 100%;
    min-height: 560px;
    border: 1px solid #e4e8ee;
    border-radius: 24px;
    background: #ffffff;
    display: grid;
    grid-template-columns: 48% 52%;
    overflow: hidden;
    box-shadow: 0 20px 55px rgba(24, 37, 59, .055);
}


/* =========================================================
   LEFT LIST
   ========================================================= */

.learning360-list {
    padding: 38px 40px;
    display: flex;
    align-items: stretch;
    box-sizing: border-box;
}


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

.learning360-tab-content {
    width: 100%;
    display: none;
    flex-direction: column;
    justify-content: center;
}

.learning360-tab-content.active {
    display: flex;
}


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

.learning-item {
    min-height: 105px;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 18px 5px 18px 0;
    border-bottom: 1px solid #e6eaf0;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
    transition: padding .35s ease, background .35s ease;
}

.learning-item:last-child {
    border-bottom: none;
}

.learning-item::before {
    content: "";
    position: absolute;
    left: -40px;
    top: 0;
    bottom: 0;
    width: 4px;
    background: transparent;
    border-radius: 0 4px 4px 0;
    transition: .3s ease;
}

.learning-item.active {
    padding-left: 18px;
    background: linear-gradient( 90deg, #fff5f3, rgba(255, 255, 255, 0));
}

.learning-item.active::before {
    background: #cc554d;
}


/* =========================================================
   ITEM ICON / NUMBER
   ========================================================= */

.learning-item-icon {
    width: 55px;
    height: 55px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #f3f6f9;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #66758b;
    transition: .3s ease;
}

.learning-item.active .learning-item-icon {
    background: #fff0ed;
    color: #cc554d;
}

.learning-item-icon span {
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 1px;
}


/* =========================================================
   ITEM TEXT
   ========================================================= */

.learning-item-text {
    flex: 1;
}

.learning-item-text h3 {
    margin: 0 0 6px;
    color: #1a2941;
    font-size: 23px;
    font-weight: 500;
    line-height: 1.25;
    transition: color .3s ease;
}

.learning-item.active .learning-item-text h3 {
    color: #cc554d;
}

.learning-item-text p {
    margin: 0;
    color: #788497;
    font-size: 16px;
    line-height: 1.55;
    max-width: 470px;
}


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

.learning-item-arrow {
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    border: 1px solid #cbd3dd;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #5e6b7f;
    font-size: 18px;
    transition: .35s ease;
}

.learning-item.active .learning-item-arrow {
    border-color: #cc554d;
    color: #cc554d;
    transform: rotate(0deg);
}

.learning-item:hover .learning-item-arrow {
    transform: translateX(4px);
}


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

.learning360-image {
    min-height: 560px;
    padding: 28px;
    box-sizing: border-box;
    background: #f7f9fb;
}

.learning360-image-wrap {
    width: 100%;
    height: 100%;
    min-height: 504px;
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    background: #e9edf1;
}

.learning360-image-wrap img {
    width: 100%;
    height: 100%;
    min-height: 504px;
    object-fit: cover;
    display: block;
    transition: opacity .3s ease, transform .55s ease;
}

.learning360-image-wrap img.changing {
    opacity: .2;
    transform: scale(1.025);
}


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

.learning360-image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient( 180deg, rgba(18, 31, 49, .02) 45%, rgba(18, 31, 49, .68) 100%);
    pointer-events: none;
}


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

.learning360-image-label {
    position: absolute;
    left: 30px;
    bottom: 28px;
    color: #ffffff;
    z-index: 3;
}

.learning360-image-label span {
    display: block;
    font-size: 9px;
    letter-spacing: 3px;
    margin-bottom: 7px;
    opacity: .85;
}

.learning360-image-label strong {
    display: block;
    font-size: 25px;
    font-weight: 500;
}


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

.learning360-image-number {
    position: absolute;
    right: 25px;
    top: 24px;
    padding: 8px 12px;
    background: rgba(255, 255, 255, .92);
    border-radius: 30px;
    color: #27354b;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 2px;
    z-index: 4;
}


/* =========================================================
   BOTTOM CTA
   ========================================================= */

.learning360-bottom {
    display: flex;
    justify-content: center;
    margin-top: 35px;
}

.learning360-cta {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    color: #cc554d;
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
    transition: .3s ease;
}

.learning360-cta span {
    padding-bottom: 7px;
    border-bottom: 1px solid #cc554d;
}

.learning360-cta i {
    width: 43px;
    height: 43px;
    border: 1px solid #cc554d;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
    font-size: 18px;
    transition: .3s ease;
}

.learning360-cta:hover i {
    background: #cc554d;
    color: #ffffff;
    transform: translateX(5px);
}


/* Compact two-column presentation for MacBook/laptop viewports. */

@media (min-width: 1051px) and (max-width: 1440px) {
    .learning360 {
        padding: 32px 5% 36px;
    }
    .learning360-header {
        margin-bottom: 30px;
    }
    .learning360-kicker {
        margin-bottom: 13px;
        font-size: 12px;
    }
    .learning360-header h2 {
        font-size: clamp(40px, 3.4vw, 48px);
        line-height: 1.04;
        letter-spacing: 0;
    }
    .learning360-header p {
        margin-top: 17px;
        font-size: 16px;
        line-height: 1.5;
    }
    .learning360-tabs {
        gap: 10px;
        margin-bottom: 16px;
    }
    .learning360-tab {
        min-height: 66px;
        gap: 13px;
        padding: 10px 18px;
        border-radius: 12px;
    }
    .tab-icon {
        width: 43px;
        height: 43px;
    }
    .tab-icon svg {
        width: 22px;
        height: 22px;
    }
    .tab-copy {
        gap: 3px;
    }
    .tab-copy strong {
        font-size: 16px;
    }
    .tab-copy small {
        font-size: 12px;
    }
    .learning360-panel {
        min-height: 410px;
        grid-template-columns: 49% 51%;
        border-radius: 20px;
    }
    .learning360-list {
        padding: 22px 28px;
    }
    .learning-item {
        min-height: 82px;
        gap: 13px;
        padding: 12px 3px 12px 0;
    }
    .learning-item::before {
        left: -28px;
    }
    .learning-item.active {
        padding-left: 12px;
    }
    .learning-item-icon {
        width: 45px;
        height: 45px;
    }
    .learning-item-icon span {
        font-size: 12px;
    }
    .learning-item-text h3 {
        margin-bottom: 4px;
        font-size: 18px;
    }
    .learning-item-text p {
        font-size: 12px;
        line-height: 1.4;
    }
    .learning-item-arrow {
        width: 35px;
        height: 35px;
        font-size: 15px;
    }
    .learning360-image {
        min-height: 410px;
        padding: 20px;
    }
    .learning360-image-wrap,
    .learning360-image-wrap img {
        min-height: 370px;
    }
    .learning360-image-label {
        left: 23px;
        bottom: 21px;
    }
    .learning360-image-label strong {
        font-size: 21px;
    }
    .learning360-image-number {
        right: 18px;
        top: 18px;
    }
    .learning360-bottom {
        margin-top: 25px;
    }
}


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

@media (max-width: 1050px) {
    .learning360 {
        padding-left: 4%;
        padding-right: 4%;
    }
    .learning360-panel {
        grid-template-columns: 1fr;
    }
    .learning360-image {
        min-height: 420px;
    }
    .learning360-image-wrap,
    .learning360-image-wrap img {
        min-height: 420px;
    }
}


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

@media (max-width: 700px) {
    .learning360 {
        padding: 25px 18px 20px;
    }
    .learning360-header {
        margin-bottom: 32px;
    }
    .learning360-kicker {
        font-size: 9px;
        letter-spacing: 3px;
    }
    .learning360-kicker span {
        width: 30px;
    }
    .learning360-header h2 {
        font-size: 39px;
        letter-spacing: -1px;
    }
    .learning360-header p {
        font-size: 14px;
    }
    /* TABS */
    .learning360-tabs {
        grid-template-columns: 1fr;
        gap: 8px;
        margin-bottom: 15px;
    }
    .learning360-tab {
        min-height: 68px;
        padding: 10px 16px;
        border-radius: 12px;
    }
    .tab-icon {
        width: 43px;
        height: 43px;
    }
    .tab-icon svg {
        width: 22px;
        height: 22px;
    }
    .tab-copy strong {
        font-size: 15px;
    }
    .tab-copy small {
        font-size: 11px;
    }
    /* PANEL */
    .learning360-panel {
        border-radius: 18px;
        grid-template-columns: 1fr;
    }
    /* LIST */
    .learning360-list {
        padding: 22px 22px 10px;
    }
    .learning-item {
        min-height: 92px;
        gap: 12px;
        padding: 15px 0;
    }
    .learning-item::before {
        left: -22px;
    }
    .learning-item.active {
        padding-left: 12px;
    }
    .learning-item-icon {
        width: 43px;
        height: 43px;
    }
    .learning-item-text h3 {
        font-size: 17px;
    }
    .learning-item-text p {
        font-size: 14px;
    }
    .learning-item-arrow {
        width: 34px;
        height: 34px;
        font-size: 15px;
    }
    /* IMAGE */
    .learning360-image {
        min-height: 330px;
        padding: 12px;
    }
    .learning360-image-wrap,
    .learning360-image-wrap img {
        min-height: 300px;
    }
    .learning360-image-wrap {
        border-radius: 13px;
    }
    .learning360-image-label {
        left: 20px;
        bottom: 20px;
    }
    .learning360-image-label strong {
        font-size: 21px;
    }
    .learning360-image-number {
        right: 15px;
        top: 15px;
    }
    .learning360-bottom {
        margin-top: 25px;
    }
}

.heade {
    color: #cc554d;
}


/* =========================================================
   NATIONAL ACHIEVERS
   ========================================================= */

.achievers-modern {
    width: 100%;
    background: #ffffff;
    padding: 85px 0 80px;
    overflow: hidden;
    box-sizing: border-box;
}

.achievers-modern-inner {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
}


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

.achievers-modern-header {
    width: 100%;
    max-width: 1370px;
    margin: 0 auto 45px;
    padding: 0 30px;
    box-sizing: border-box;
}

.achievers-modern-kicker {
    display: flex;
    align-items: center;
    gap: 16px;
    color: #cc554d;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 2px;
    margin-bottom: 18px;
}

.achievers-modern-kicker span {
    width: 55px;
    height: 1px;
    background: #cc554d;
}

.achievers-modern-title-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
}

.achievers-modern-title-row h2 {
    margin: 0;
    color: #19263c;
    font-size: 53px;
    line-height: .98;
    font-weight: 500;
    letter-spacing: 1px;
}

.achievers-modern-title-row h2 em {
    color: #cc554d;
    font-style: normal;
}

.achievers-modern-title-row p {
    margin: 20px 0 0;
    color: #718096;
    font-size: 19px;
    line-height: 1.6;
}


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

.achievers-controls {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 18px;
}

.achievers-counter {
    display: flex;
    align-items: baseline;
    gap: 6px;
    color: #9ba6b6;
    font-size: 16px;
}

.achievers-counter strong {
    color: #cc554d;
    font-size: 34px;
    font-weight: 500;
    line-height: 1;
}

.achievers-arrows {
    display: flex;
    gap: 10px;
}

.achiever-arrow {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    border: 1px solid #dce2e9;
    background: #ffffff;
    color: #536177;
    font-size: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all .3s ease;
}

.achiever-arrow:hover {
    background: #cc554d;
    border-color: #cc554d;
    color: #ffffff;
    transform: translateY(-2px);
}

.achiever-next {
    background: #cc554d;
    border-color: #cc554d;
    color: #ffffff;
}


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

.achievers-modern-slider {
    width: 100%;
    height: 510px;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
}


/*
Soft fade on extreme left/right
*/

.achievers-modern-slider::before,
.achievers-modern-slider::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 10%;
    z-index: 20;
    pointer-events: none;
}

.achievers-modern-slider::before {
    left: 0;
    background: linear-gradient( 90deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
}

.achievers-modern-slider::after {
    right: 0;
    background: linear-gradient( 270deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
}


/* =========================================================
   TRACK
   ========================================================= */

.achievers-track {
    width: 100%;
    height: 100%;
    position: relative;
}


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

.achiever-slide {
    position: absolute;
    width: 720px;
    height: 450px;
    top: 25px;
    left: 50%;
    transform: translateX(-50%) scale(.72);
    opacity: 0;
    z-index: 1;
    pointer-events: none;
    transition: transform .75s cubic-bezier(.77, 0, .18, 1), opacity .55s ease, left .75s cubic-bezier(.77, 0, .18, 1);
}


/* =========================================================
   MAIN CENTER
   ========================================================= */

.achiever-slide.active {
    left: 50%;
    transform: translateX(-50%) scale(1);
    opacity: 1;
    z-index: 10;
    pointer-events: auto;
}


/* =========================================================
   PREVIOUS
   ========================================================= */

.achiever-slide.prev {
    left: 16%;
    transform: translateX(-50%) rotate(-5deg) scale(.72);
    opacity: .65;
    z-index: 4;
}


/* =========================================================
   NEXT
   ========================================================= */

.achiever-slide.next {
    left: 84%;
    transform: translateX(-50%) rotate(5deg) scale(.72);
    opacity: .65;
    z-index: 4;
}


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

.achiever-slide-image {
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #f5f6f8;
    border-radius: 15px;
    box-shadow: 0 25px 65px rgba(25, 38, 60, .14);
    box-sizing: border-box;
}

.achiever-slide-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform .7s ease;
}


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

.achiever-slide.active:hover .achiever-slide-image img {
    transform: scale(1.015);
}


/* =========================================================
   SIDE CARD SHADOW
   ========================================================= */

.achiever-slide.prev .achiever-slide-image,
.achiever-slide.next .achiever-slide-image {
    box-shadow: 0 18px 45px rgba(25, 38, 60, .10);
}


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

.achievers-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-top: 22px;
}

.achiever-dot {
    width: 9px;
    height: 9px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: #d3dae3;
    cursor: pointer;
    transition: width .3s ease, background .3s ease, transform .3s ease;
}

.achiever-dot:hover {
    transform: scale(1.25);
}

.achiever-dot.active {
    width: 28px;
    border-radius: 10px;
    background: #cc554d;
}


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

@media (max-width: 1200px) {
    .achiever-slide {
        width: 650px;
        height: 410px;
    }
    .achievers-modern-slider {
        height: 465px;
    }
    .achiever-slide.prev {
        left: 10%;
    }
    .achiever-slide.next {
        left: 90%;
    }
}


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

@media (max-width: 700px) {
    .achievers-modern {
        padding: 30px 0 65px;
    }
    .achievers-modern-header {
        padding: 0 20px;
        margin-bottom: 30px;
    }
    .achievers-modern-kicker {
        font-size: 9px;
        letter-spacing: 3px;
    }
    .achievers-modern-kicker span {
        width: 32px;
    }
    .achievers-modern-title-row {
        display: block;
    }
    .achievers-modern-title-row h2 {
        font-size: 41px;
        letter-spacing: -1px;
    }
    .achievers-modern-title-row p {
        font-size: 14px;
    }
    .achievers-controls {
        margin-top: 22px;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
    .achievers-counter strong {
        font-size: 28px;
    }
    .achiever-arrow {
        width: 44px;
        height: 44px;
        font-size: 18px;
    }
    /* MOBILE SLIDER */
    .achievers-modern-slider {
        height: min(58vw, 320px);
        overflow: hidden;
    }
    .achiever-slide {
        width: 82vw;
        max-width: 500px;
        height: auto;
        aspect-ratio: 730 / 450;
        top: 10px;
        opacity: 0;
    }
    /*
    Center
    */
    .achiever-slide.active {
        left: 50%;
        transform: translateX(-50%) scale(1);
        opacity: 1;
    }
    /*
    Left peek
    */
    .achiever-slide.prev {
        left: -4%;
        transform: translateX(-50%) rotate(-4deg) scale(.72);
        opacity: .25;
    }
    /*
    Right peek
    */
    .achiever-slide.next {
        left: 104%;
        transform: translateX(-50%) rotate(4deg) scale(.72);
        opacity: .25;
    }
    .achiever-slide-image {
        border-radius: 12px;
        box-shadow: 0 18px 40px rgba(25, 38, 60, .11);
    }
    .achiever-slide-image img {
        object-fit: contain;
    }
    .achievers-modern-slider::before,
    .achievers-modern-slider::after {
        width: 5%;
    }
    .achievers-dots {
        margin-top: 12px;
    }
}


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

@media (max-width: 420px) {
    .achievers-modern-title-row h2 {
        font-size: 36px;
    }
    .achiever-slide {
        width: 88vw;
        height: auto;
        aspect-ratio: 730 / 450;
    }
    .achievers-modern-slider {
        height: 58vw;
    }
}


/* =========================================================
   SAI AWARDS SECTION
   COMPLETE CSS
   ========================================================= */

.sai-awards-section {
    width: 100%;
    background: #ffffff;
    padding: 40px 0 40px;
    overflow: hidden;
    box-sizing: border-box;
}

.sai-awards-container {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    box-sizing: border-box;
}


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

.sai-awards-header {
    width: 100%;
    max-width: 1370px;
    margin: 0 auto 46px;
    padding: 0 30px;
    box-sizing: border-box;
}

.sai-awards-eyebrow {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 16px;
    color: #cf554c;
    font-family: "Poppins", sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 4px;
    text-transform: uppercase;
}

.sai-awards-eyebrow span {
    display: block;
    width: 50px;
    height: 1px;
    background: #cf554c;
}

.sai-awards-header h2 {
    margin: 0;
    color: #192a44;
    font-size: 53px;
    font-weight: 500;
    line-height: .98;
    letter-spacing: 1px;
}

.sai-awards-header h2 em {
    color: #cf554c;
    font-style: normal;
    font-weight: 400;
}

.sai-awards-header p {
    max-width: 760px;
    margin: 20px 0 0;
    color: #687b94;
    font-size: 19px;
    font-weight: 400;
    line-height: 1.65;
}


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

.sai-awards-slider {
    position: relative;
    width: 100%;
    height: 365px;
    overflow: hidden;
    box-sizing: border-box;
}


/* =========================================================
   TRACK
   ========================================================= */

.sai-awards-track {
    position: relative;
    width: 100%;
    height: 100%;
}


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

.sai-awards-slide {
    position: absolute;
    top: 0;
    left: 50%;
    width: 90%;
    max-width: 1325px;
    height: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    transform: translateX(-50%) translateY(0) scale(.72);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: left .85s cubic-bezier(.76, 0, .24, 1), transform .85s cubic-bezier(.76, 0, .24, 1), opacity .55s ease;
    z-index: 1;
    box-sizing: border-box;
}


/* =========================================================
   ACTIVE CENTER SLIDE
   ========================================================= */

.sai-awards-slide.active {
    left: 50%;
    transform: translateX(-50%) translateY(0) scale(1);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    z-index: 10;
}


/* =========================================================
   PREVIOUS TILTED SLIDE
   ========================================================= */

.sai-awards-slide.award-prev {
    left: -25%;
    transform: translateX(-50%) rotate(-4deg) scale(.72);
    opacity: .55;
    visibility: visible;
    pointer-events: none;
    z-index: 4;
}


/* =========================================================
   NEXT TILTED SLIDE
   ========================================================= */

.sai-awards-slide.award-next {
    left: 125%;
    transform: translateX(-50%) rotate(4deg) scale(.72);
    opacity: .55;
    visibility: visible;
    pointer-events: none;
    z-index: 4;
}


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

.sai-award-card {
    position: relative;
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: 43% 57%;
    align-items: center;
    padding: 13px;
    background: #ffffff;
    border: 1px solid #cad7e6;
    border-radius: 21px;
    box-sizing: border-box;
    overflow: hidden;
    box-shadow: 0 8px 28px rgba(25, 42, 68, .035);
    transition: box-shadow .35s ease, border-color .35s ease;
}

.sai-award-card:hover {
    border-color: #c3d0df;
    box-shadow: 0 18px 45px rgba(25, 42, 68, .09);
}


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

.sai-award-image {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 335px;
    overflow: hidden;
    background: #f3f5f7;
    border-radius: 14px;
}

.sai-award-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    transition: transform .7s cubic-bezier(.22, .61, .36, 1);
}

.sai-award-card:hover .sai-award-image img {
    transform: scale(1.025);
}


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

.sai-award-content {
    width: 100%;
    padding: 20px 28px 20px 32px;
    box-sizing: border-box;
}

.sai-award-year {
    display: block;
    margin-bottom: 47px;
    color: #627895;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 21px;
    font-weight: 400;
    line-height: 1;
}

.sai-award-content h3 {
    margin: 0;
    color: #d05249;
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(23px, 2vw, 30px);
    font-weight: 500;
    line-height: 1.18;
    letter-spacing: -.4px;
}

.sai-award-line {
    width: 42px;
    height: 2px;
    margin: 19px 0 18px;
    background: #cf554c;
}

.sai-award-content p {
    max-width: 390px;
    margin: 0;
    color: #64758b;
    font-family: "Poppins", sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.6;
}


/* =========================================================
   SIDE TILT PREVIEW
   ========================================================= */


/*
   These are ONLY background preview frames.
   The actual previous/next groups are handled
   by .award-prev and .award-next.
*/

.sai-awards-side-preview {
    position: absolute;
    top: 40px;
    width: 215px;
    height: 285px;
    background: #ffffff;
    border: 1px solid #e5eaf0;
    border-radius: 15px;
    box-shadow: 0 14px 38px rgba(25, 42, 68, .045);
    opacity: .55;
    pointer-events: none;
    z-index: 0;
}

.sai-awards-side-preview.left {
    left: -105px;
    transform: rotate(-4deg);
}

.sai-awards-side-preview.right {
    right: -105px;
    transform: rotate(4deg);
}


/* =========================================================
   BOTTOM AREA
   ========================================================= */

.sai-awards-bottom {
    width: 90%;
    max-width: 1325px;
    margin: 12px auto 0;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    box-sizing: border-box;
}


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

.sai-awards-view {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 15px;
    color: #cc554d;
    background: #fff4f1;
    border-radius: 7px;
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: background .3s ease, color .3s ease, transform .3s ease;
}

.sai-awards-view b {
    display: inline-block;
    font-size: 18px;
    font-weight: 400;
    transition: transform .3s ease;
}

.sai-awards-view:hover {
    color: #ffffff;
    background: #cf554c;
    transform: translateY(-2px);
}

.sai-awards-view:hover b {
    transform: translate(3px, -3px);
}


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

.sai-awards-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.sai-awards-dots button {
    width: 9px;
    height: 9px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #cbd7e6;
    cursor: pointer;
    transition: width .3s ease, height .3s ease, background .3s ease, transform .3s ease;
}

.sai-awards-dots button:hover {
    transform: scale(1.25);
}

.sai-awards-dots button.active {
    width: 11px;
    height: 11px;
    background: #cf554c;
}


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

.sai-awards-nav {
    justify-self: end;
    display: flex;
    align-items: center;
    gap: 12px;
}

.sai-awards-nav button {
    width: 53px;
    height: 53px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #4f6178;
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 50%;
    font-family: Arial, sans-serif;
    font-size: 23px;
    line-height: 1;
    cursor: pointer;
    transition: background .3s ease, color .3s ease, border-color .3s ease, transform .3s ease;
}

.sai-awards-nav button:hover {
    color: #ffffff;
    background: #cf554c;
    border-color: #cf554c;
    transform: translateY(-2px);
}


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

@media (min-width: 1600px) {
    .sai-awards-container {
        max-width: 1600px;
    }
    .sai-awards-header {
        max-width: 1450px;
    }
    .sai-awards-slide,
    .sai-awards-bottom {
        max-width: 1400px;
    }
}


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

@media (max-width: 1200px) {
    .sai-awards-header {
        padding: 0 35px;
    }
    .sai-awards-slide {
        width: 88%;
    }
    .sai-award-card {
        grid-template-columns: 45% 55%;
    }
    .sai-award-content {
        padding-left: 24px;
        padding-right: 20px;
    }
    .sai-award-year {
        margin-bottom: 30px;
    }
    .sai-award-content h3 {
        font-size: 23px;
    }
    .sai-award-content p {
        font-size: 12px;
    }
    .sai-awards-side-preview {
        display: none;
    }
}


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

@media (max-width: 900px) {
    .sai-awards-section {
        padding-top: 60px;
    }
    .sai-awards-header {
        margin-bottom: 35px;
    }
    .sai-awards-header h2 {
        font-size: 52px;
    }
    .sai-awards-slider {
        height: 330px;
    }
    .sai-awards-slide {
        width: 92%;
    }
    .sai-award-image {
        min-height: 300px;
    }
    .sai-award-content {
        padding: 18px;
    }
    .sai-award-year {
        font-size: 18px;
        margin-bottom: 25px;
    }
    .sai-award-content h3 {
        font-size: 21px;
    }
}


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

@media (max-width: 700px) {
    .sai-awards-section {
        padding: 55px 0 20px;
    }
    .sai-awards-header {
        padding: 0 20px;
        margin-bottom: 32px;
    }
    .sai-awards-eyebrow {
        gap: 11px;
        font-size: 8px;
        letter-spacing: 2.7px;
    }
    .sai-awards-eyebrow span {
        width: 32px;
    }
    .sai-awards-header h2 {
        font-size: 39px;
        line-height: 1;
    }
    .sai-awards-header p {
        font-size: 13px;
        line-height: 1.6;
    }
    /* -----------------------------------------
       MOBILE SLIDER
       ----------------------------------------- */
    .sai-awards-slider {
        height: 565px;
        overflow: hidden;
    }
    .sai-awards-slide {
        top: 0;
        width: 88%;
        height: 540px;
        grid-template-columns: 1fr;
        gap: 12px;
        transform: translateX(-50%) translateY(25px) scale(.88);
    }
    .sai-awards-slide.active {
        left: 50%;
        transform: translateX(-50%) translateY(0) scale(1);
    }
    .sai-awards-slide.award-prev {
        left: -55%;
        transform: translateX(-50%) rotate(-3deg) scale(.72);
        opacity: .25;
    }
    .sai-awards-slide.award-next {
        left: 155%;
        transform: translateX(-50%) rotate(3deg) scale(.72);
        opacity: .25;
    }
    /* -----------------------------------------
       MOBILE CARD
       ----------------------------------------- */
    .sai-award-card {
        height: 260px;
        min-height: 260px;
        grid-template-columns: 44% 56%;
        padding: 8px;
        border-radius: 15px;
    }
    .sai-award-image {
        height: 244px;
        min-height: 244px;
        border-radius: 10px;
    }
    .sai-award-content {
        padding: 13px;
    }
    .sai-award-year {
        margin-bottom: 18px;
        font-size: 15px;
    }
    .sai-award-content h3 {
        font-size: 17px;
        line-height: 1.2;
    }
    .sai-award-line {
        width: 30px;
        margin: 11px 0;
    }
    .sai-award-content p {
        font-size: 10px;
        line-height: 1.5;
    }
    /* -----------------------------------------
       BOTTOM
       ----------------------------------------- */
    .sai-awards-bottom {
        width: 88%;
        margin-top: 5px;
        grid-template-columns: 1fr auto;
        row-gap: 18px;
    }
    .sai-awards-view {
        padding: 10px 12px;
        font-size: 12px;
    }
    .sai-awards-nav {
        grid-column: 2;
    }
    .sai-awards-nav button {
        width: 44px;
        height: 44px;
        font-size: 19px;
    }
    .sai-awards-dots {
        grid-column: 1 / -1;
        grid-row: 2;
    }
}


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

@media (max-width: 430px) {
    .sai-awards-header h2 {
        font-size: 32px;
        line-height: 1.2;
    }
    .sai-awards-header p {
        font-size: 16px;
    }
    .sai-awards-slide {
        width: 92%;
    }
    .sai-award-card {
        grid-template-columns: 42% 58%;
    }
    .sai-award-image {
        height: 235px;
        min-height: 235px;
    }
    .sai-award-content {
        padding: 11px;
    }
    .sai-award-year {
        font-size: 13px;
        margin-bottom: 15px;
    }
    .sai-award-content h3 {
        font-size: 15px;
    }
    .sai-award-content p {
        font-size: 9px;
    }
}


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

@media (prefers-reduced-motion: reduce) {
    .sai-awards-slide,
    .sai-award-image img,
    .sai-award-card,
    .sai-awards-nav button,
    .sai-awards-view,
    .sai-award-line {
        transition: none !important;
    }
}


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

.trust-section {
    width: 100%;
    min-height: 780px;
    background: #ffffff;
    position: relative;
    overflow: hidden;
    padding: 55px 0 60px;
    color: #172b46;
}


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

.decor {
    position: absolute;
    pointer-events: none;
    z-index: 0;
}

.decor-top {
    width: 430px;
    height: 430px;
    right: -120px;
    top: -200px;
    border: 58px solid rgba(223, 87, 76, 0.09);
    border-radius: 50%;
}

.decor-bottom {
    width: 380px;
    height: 380px;
    left: -285px;
    bottom: -210px;
    border: 55px solid rgba(220, 230, 238, 0.32);
    border-radius: 50%;
}


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

.trust-header {
    width: min(1400px, 86%);
    margin: 0 auto;
    position: relative;
    z-index: 5;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.header-left {
    position: relative;
}

.eyebrow {
    display: flex;
    align-items: center;
    gap: 25px;
    font-size: 17px;
    line-height: 1;
    letter-spacing: 1px;
    font-weight: 500;
    color: #d9574d;
    margin-bottom: 20px;
}

.eyebrow span {
    width: 61px;
    height: 2px;
    display: block;
    background: #d9574d;
}

.header-left h2 {
    margin: 0;
    font-size: 53px;
    line-height: 1.08;
    font-weight: 400;
    letter-spacing: 1px;
    color: #182c47;
}

.header-left h2 em {
    color: #d9574d;
    font-style: italic;
    font-weight: 400;
}

.red-underline {
    position: absolute;
    left: 653px;
    top: 94px;
    width: 330px;
    height: 40px;
    transform: rotate(-2deg);
}

.red-underline span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 6px;
    border-radius: 100%;
    background: #d9574d;
}

.red-underline span:first-child {
    top: 8px;
}

.red-underline span:last-child {
    top: 25px;
    width: 88%;
    left: 12px;
}


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

.header-description {
    margin-top: 45px;
    color: #667a94;
    font-size: 17px;
    line-height: 1.55;
    letter-spacing: .1px;
}


/* =========================================
   HANDWRITTEN TEXT
========================================= */

.handwritten {
    position: absolute;
    right: -75px;
    top: -35px;
    width: 190px;
    font-style: italic;
    font-size: 30px;
    line-height: 1.02;
    color: #8293aa;
    transform: rotate(-8deg);
}

.handwritten span {
    margin-left: 17px;
}

.handwritten small {
    font-size: 26px;
    margin-left: 5px;
}

.hand-line {
    width: 75px;
    height: 3px;
    margin: 13px 0 0 58px;
    background: #8293aa;
    border-radius: 50%;
    transform: rotate(-3deg);
}


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

.testimonial-slider {
    width: 100%;
    height: 415px;
    position: relative;
    z-index: 3;
    margin-top: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* =========================================
   MAIN TESTIMONIAL
========================================= */

.main-testimonial {
    width: min(1475px, 74%);
    height: 415px;
    display: grid;
    grid-template-columns: 44% 56%;
    background: #ffffff;
    border-radius: 25px;
    overflow: hidden;
    box-shadow: 0 12px 45px rgba(39, 67, 97, 0.08);
    position: relative;
    z-index: 4;
    transition: transform .45s ease, opacity .45s ease;
}


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

.testimonial-video {
    height: 100%;
    position: relative;
    overflow: hidden;
}

.main-video-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.video-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient( to top, rgba(8, 25, 45, .18), transparent 40%);
}


/* =========================================
   MAIN PLAY BUTTON
========================================= */

.main-play {
    width: 72px;
    height: 72px;
    border: 0;
    border-radius: 50%;
    background: #e1544b;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 7px 20px rgba(208, 70, 63, .25);
    transition: .25s ease;
}

.main-play:hover {
    transform: translate(-50%, -50%) scale(1.08);
}

.main-play span {
    width: 0;
    height: 0;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-left: 16px solid white;
    margin-left: 4px;
}


/* =========================================
   VIDEO DURATION
========================================= */

.video-duration {
    position: absolute;
    left: 24px;
    bottom: 23px;
    padding: 8px 14px;
    border-radius: 20px;
    background: rgba(37, 43, 51, .82);
    color: white;
    font-size: 14px;
    font-weight: 600;
}


/* =========================================
   LOCATION
========================================= */

.school-location {
    position: absolute;
    right: 22px;
    bottom: 22px;
    height: 38px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 15px 0 10px;
    background: rgba(255, 255, 255, .96);
    border-radius: 22px;
    color: #2d405a;
    font-size: 14px;
    font-weight: 500;
    box-shadow: 0 4px 15px rgba(0, 0, 0, .08);
}

.location-icon {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.location-icon svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: #d9574d;
    stroke-width: 2;
}


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

.testimonial-content {
    position: relative;
    padding: 52px 75px 40px 80px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.quote-mark {
    position: absolute;
    left: 77px;
    top: 25px;
    font-size: 86px;
    line-height: .8;
    color: #f5b7b0;
    font-weight: bold;
}

.testimonial-text {
    max-width: 720px;
    margin: 0;
    font-size: clamp(22px, 1.55vw, 29px);
    line-height: 1.27;
    color: #172b46;
}

.small-line {
    width: 76px;
    height: 3px;
    background: #d9574d;
    margin-top: 24px;
    margin-bottom: 22px;
}

.parent-name {
    margin: 0;
    font-size: 36px;
    line-height: 1;
    color: #d9574d;
    font-weight: 500;
}

.parent-role {
    margin: 9px 0 0;
    color: #70839b;
    font-size: 18px;
}


/* =========================================
   SIDE PREVIEW CARDS
========================================= */

.side-card {
    width: 180px;
    height: 290px;
    position: absolute;
    z-index: 1;
    border-radius: 18px;
    overflow: hidden;
    opacity: .72;
    box-shadow: 0 8px 30px rgba(38, 64, 91, .10);
    transition: .4s ease;
}

.side-card-left {
    left: -18px;
    transform: rotate(7deg);
}

.side-card-right {
    right: -18px;
    transform: rotate(-7deg);
}

.side-image {
    width: 100%;
    height: 100%;
    position: relative;
}

.side-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(.05);
}

.side-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, .25);
}


/* =========================================
   SIDE PLAY
========================================= */

.side-play {
    width: 43px;
    height: 43px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
    border: 3px solid white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.side-play span {
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 10px solid white;
    margin-left: 3px;
}


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

.slider-arrow {
    width: 85px;
    height: 85px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    border-radius: 50%;
    background: white;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 5px 25px rgba(39, 64, 91, .08);
    transition: transform .25s ease, box-shadow .25s ease;
}

.slider-arrow:hover {
    box-shadow: 0 8px 30px rgba(39, 64, 91, .15);
}

.arrow-left {
    left: 7.2%;
}

.arrow-right {
    right: 7.2%;
}

.slider-arrow svg {
    width: 30px;
    height: 30px;
    fill: none;
    stroke: #182c47;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}


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

.slider-dots {
    position: relative;
    z-index: 5;
    margin-top: 52px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 9px;
}

.dot {
    width: 12px;
    height: 12px;
    border: 0;
    border-radius: 50%;
    padding: 0;
    background: #d2dce8;
    cursor: pointer;
    transition: .25s ease;
}

.dot.active {
    background: #d9574d;
    transform: scale(1.05);
}


/* =========================================
   VIDEO MODAL
========================================= */

.video-modal {
    position: fixed;
    inset: 0;
    background: rgba(10, 22, 37, .88);
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 30px;
}

.video-modal.active {
    display: flex;
}

.video-modal iframe {
    width: min(1000px, 95vw);
    aspect-ratio: 16 / 9;
    max-height: 85vh;
    border: 0;
    border-radius: 15px;
    outline: none;
}

.video-close {
    position: absolute;
    right: 35px;
    top: 25px;
    width: 50px;
    height: 50px;
    border: 0;
    border-radius: 50%;
    background: white;
    color: #172b46;
    font-size: 28px;
    cursor: pointer;
}


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

@media (max-width: 1500px) {
    .trust-header {
        width: 82%;
    }
    .main-testimonial {
        width: 72%;
    }
    .arrow-left {
        left: 8%;
    }
    .arrow-right {
        right: 8%;
    }
    .red-underline {
        left: 600px;
    }
}

@media (max-width: 1200px) {
    .trust-section {
        min-height: auto;
        padding-bottom: 55px;
    }
    .trust-header {
        width: 88%;
    }
    .header-left h2 {
        font-size: 48px;
    }
    .header-description {
        font-size: 15px;
    }
    .handwritten {
        display: none;
    }
    .red-underline {
        left: 480px;
        top: 90px;
        width: 270px;
    }
    .main-testimonial {
        width: 78%;
        grid-template-columns: 45% 55%;
    }
    .testimonial-content {
        padding-left: 50px;
        padding-right: 45px;
    }
    .quote-mark {
        left: 47px;
    }
    .testimonial-text {
        font-size: 23px;
    }
    .side-card {
        width: 150px;
        height: 250px;
    }
    .arrow-left {
        left: 5%;
    }
    .arrow-right {
        right: 5%;
    }
}

@media (max-width: 900px) {
    .trust-section {
        padding-top: 45px;
    }
    .trust-header {
        width: 88%;
        display: block;
        text-align: center;
    }
    .eyebrow {
        justify-content: center;
        font-size: 14px;
        letter-spacing: 2px;
    }
    .eyebrow span {
        width: 40px;
    }
    .header-left h2 {
        font-size: 42px;
    }
    .header-description {
        margin-top: 20px;
    }
    .red-underline {
        display: none;
    }
    .testimonial-slider {
        margin-top: 45px;
        height: auto;
    }
    .main-testimonial {
        width: 88%;
        height: auto;
        min-height: 600px;
        grid-template-columns: 1fr;
    }
    .testimonial-video {
        height: 330px;
    }
    .testimonial-content {
        min-height: 280px;
        padding: 55px 45px 45px;
    }
    .quote-mark {
        left: 42px;
        top: 20px;
    }
    .testimonial-text {
        font-size: 22px;
    }
    .side-card {
        display: none;
    }
    .slider-arrow {
        width: 58px;
        height: 58px;
    }
    .slider-arrow svg {
        width: 23px;
        height: 23px;
    }
    .arrow-left {
        left: 2%;
    }
    .arrow-right {
        right: 2%;
    }
    .slider-dots {
        margin-top: 30px;
    }
}

@media (max-width: 600px) {
    .trust-section {
        padding: 35px 0 45px;
    }
    .trust-header {
        width: 90%;
    }
    .header-left h2 {
        font-size: 35px;
        line-height: 1.15;
    }
    .header-description {
        font-size: 14px;
    }
    .testimonial-slider {
        margin-top: 35px;
    }
    .main-testimonial {
        width: 88%;
        border-radius: 18px;
    }
    .testimonial-video {
        height: 270px;
    }
    .main-play {
        width: 60px;
        height: 60px;
    }
    .testimonial-content {
        padding: 50px 25px 35px;
    }
    .quote-mark {
        left: 24px;
        font-size: 65px;
    }
    .testimonial-text {
        font-size: 19px;
        line-height: 1.4;
    }
    .small-line {
        margin-top: 18px;
        margin-bottom: 17px;
    }
    .parent-name {
        font-size: 29px;
    }
    .parent-role {
        font-size: 14px;
    }
    .school-location {
        right: 12px;
        bottom: 12px;
        font-size: 11px;
        padding-right: 10px;
    }
    .video-duration {
        left: 12px;
        bottom: 12px;
        font-size: 11px;
        padding: 7px 10px;
    }
    .slider-arrow {
        width: 46px;
        height: 46px;
    }
    .slider-arrow svg {
        width: 19px;
        height: 19px;
    }
    .arrow-left {
        left: 0;
    }
    .arrow-right {
        right: 0;
    }
    .dot {
        width: 9px;
        height: 9px;
    }
    .slider-dots {
        gap: 7px;
    }
}


/* =========================================================
   SIRS GLOBAL RECOGNITION
========================================================= */

.sirs-global-section {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #ffffff;
    color: #241a17;
    padding: 85px 5% 70px;
}

.sirs-global-container {
    position: relative;
    z-index: 2;
    max-width: 1500px;
    margin: 0 auto;
}


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

.sirs-global-bg-circle {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(204, 85, 77, 0.07);
    pointer-events: none;
}

.sirs-circle-one {
    width: 600px;
    height: 600px;
    right: -300px;
    top: -250px;
}

.sirs-circle-two {
    width: 420px;
    height: 420px;
    left: -250px;
    bottom: -250px;
}


/* =========================================================
   TOP AREA
========================================================= */

.sirs-global-top {
    display: grid;
    grid-template-columns: minmax(620px, 1.15fr) minmax(500px, 0.85fr);
    gap: 50px;
    align-items: center;
}


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

.sirs-global-content {
    padding-right: 20px;
}

.sirs-global-eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 17px;
    color: #cc554d;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2.5px;
}

.sirs-global-eyebrow span {
    width: 72px;
    height: 1px;
    background: #cc554d;
}

.sirs-global-content h2 {
    margin: 0;
    font-size: 53px;
    line-height: 0.98;
    font-weight: 400;
    letter-spacing: 1px;
}

.sirs-global-content h2 span {
    color: #cc554d;
}

.sirs-global-content>p {
    max-width: 570px;
    margin: 25px 0 30px;
    color: #66717d;
    font-size: 19px;
    line-height: 1.65;
}


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

.sirs-global-stats {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 25px;
}

.sirs-global-stat {
    display: flex;
    align-items: center;
    gap: 11px;
}

.sirs-stat-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff3f1;
    color: #cc554d;
}

.sirs-stat-icon svg {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sirs-global-stat strong {
    display: block;
    color: #cc554d;
    font-size: 25px;
    line-height: 1;
}

.sirs-global-stat span {
    display: block;
    margin-top: 5px;
    color: #606b76;
    font-size: 14px;
    letter-spacing: 1px;
    white-space: nowrap;
}

.sirs-stat-divider {
    width: 1px;
    height: 48px;
    background: #eaded9;
}


/* =========================================================
   GLOBE AREA
========================================================= */

.sirs-global-globe-area {
    position: relative;
    height: 550px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sirs-global-globe-image {
    display: block;
    width: min(540px, 100%);
    height: auto;
    max-height: 100%;
    object-fit: contain;
    transform: translateX(-145px) scale(1.28);
    transform-origin: center;
}

.sirs-globe {
    position: relative;
    width: min(540px, 100%);
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient( circle at 35% 30%, rgba(255, 255, 255, 0.9), rgba(255, 245, 242, 0.8) 45%, rgba(204, 85, 77, 0.08) 75%, transparent 76%);
    border: 1px solid rgba(204, 85, 77, 0.15);
    box-shadow: inset 0 0 80px rgba(204, 85, 77, 0.04);
}

.sirs-globe::before {
    content: "";
    position: absolute;
    inset: 7%;
    border-radius: 50%;
    border: 1px dashed rgba(204, 85, 77, 0.16);
    animation: sirs-globe-spin 25s linear infinite;
}

.sirs-globe::after {
    content: "";
    position: absolute;
    left: 7%;
    right: 7%;
    top: 50%;
    height: 1px;
    background: rgba(204, 85, 77, 0.10);
}


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

.sirs-globe-inner {
    position: absolute;
    inset: 3%;
    overflow: hidden;
    border-radius: 50%;
    background: url("images/home/world-globe-map.svg") center / contain no-repeat;
}

.sirs-globe-grid {
    position: absolute;
    border: 1px solid rgba(204, 85, 77, 0.09);
    border-radius: 50%;
}

.sirs-globe-grid.horizontal {
    width: 100%;
    height: 43%;
    left: 0;
    top: 28%;
}

.sirs-globe-grid.horizontal.two {
    width: 100%;
    height: 75%;
    left: 0;
    top: 12%;
}

.sirs-globe-grid.vertical {
    width: 43%;
    height: 100%;
    left: 28%;
    top: 0;
}

.sirs-globe-grid.vertical.two {
    width: 75%;
    height: 100%;
    left: 12%;
    top: 0;
}


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

.sirs-globe-dots {
    position: absolute;
    inset: 13%;
    opacity: 0;
    background-image: radial-gradient( circle, rgba(204, 85, 77, 0.35) 1.4px, transparent 1.7px);
    background-size: 9px 9px;
    border-radius: 50%;
    mask-image: radial-gradient( ellipse, black 30%, transparent 72%);
    -webkit-mask-image: radial-gradient( ellipse, black 30%, transparent 72%);
}


/* =========================================================
   LOCATION LABELS
========================================================= */

.sirs-location {
    position: absolute;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(204, 85, 77, 0.15);
    border-radius: 7px;
    box-shadow: 0 8px 22px rgba(70, 40, 30, 0.06);
    color: #2e2927;
    font-size: 11px;
    font-weight: 600;
}

.sirs-location i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #cc554d;
    box-shadow: 0 0 0 4px rgba(204, 85, 77, 0.12);
}


/* India */

.sirs-location.india {
    right: 27%;
    top: 43%;
}


/* UK */

.sirs-location.uk {
    left: 23%;
    top: 28%;
}


/* Europe */

.sirs-location.europe {
    left: 45%;
    top: 18%;
}


/* Canada */

.sirs-location.canada {
    left: 8%;
    top: 36%;
}


/* USA */

.sirs-location.usa {
    left: 16%;
    top: 60%;
}


/* Asia */

.sirs-location.asia {
    right: 7%;
    top: 48%;
}


/* Australia */

.sirs-location.australia {
    right: 16%;
    bottom: 18%;
}


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

.sirs-global-quote {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 30px;
    border-left: 1px solid #eaded9;
}

.sirs-quote-mark {
    color: #f7d9d5;
    font-size: 80px;
    line-height: 0.5;
    height: 45px;
}

.sirs-global-quote h3 {
    margin: 0;
    font-size: 37px;
    line-height: 1.08;
    font-weight: 400;
    letter-spacing: -1px;
}

.sirs-global-quote h3 span {
    color: #cc554d;
}

.sirs-quote-line {
    width: 45px;
    height: 1px;
    margin: 22px 0 16px;
    background: #cc554d;
}

.sirs-global-quote p {
    max-width: 210px;
    margin: 0 0 25px;
    color: #66717d;
    font-size: 14px;
    line-height: 1.55;
}

.sirs-global-link {
    display: flex;
    align-items: center;
    gap: 12px;
    width: fit-content;
    text-decoration: none;
    color: #241a17;
    font-size: 13px;
    font-weight: 600;
}

.sirs-link-circle {
    width: 55px;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #cc554d;
    border-radius: 50%;
    color: #cc554d;
    font-size: 23px;
    transition: background 0.3s ease, color 0.3s ease, transform 0.3s ease;
}

.sirs-global-link:hover .sirs-link-circle {
    background: #cc554d;
    color: #ffffff;
    transform: translateX(4px);
}


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

.sirs-partners-section {
    margin-top: 35px;
}

.sirs-partners-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 20px;
}

.sirs-partners-header>div:first-child>span {
    display: block;
    margin-bottom: 6px;
    color: #cc554d;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 1px;
}

.sirs-partners-header h3 {
    margin: 0;
    font-size: 30px;
    font-weight: 400;
}

.sirs-partners-arrows {
    display: flex;
    gap: 8px;
}

.sirs-partners-arrows button {
    width: 39px;
    height: 39px;
    border: 1px solid #ded3ce;
    border-radius: 50%;
    background: #ffffff;
    color: #382b27;
    cursor: pointer;
    font-size: 18px;
    transition: 0.3s ease;
}

.sirs-partners-arrows button:hover {
    background: #cc554d;
    border-color: #cc554d;
    color: #ffffff;
}


/* =========================================================
   PARTNER WINDOW
========================================================= */

.sirs-partners-window {
    width: 100%;
    overflow: hidden;
}

.sirs-partners-track {
    display: flex;
    gap: 15px;
    width: max-content;
    transition: transform 0.55s cubic-bezier(.22, .61, .36, 1);
    will-change: transform;
}

.sirs-partner-card {
    width: 215px;
    height: 170px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 18px;
    border: 1px solid #eee5e1;
    border-radius: 80px;
    background: #ffffff;
    box-shadow: 0 7px 22px rgba(50, 30, 20, 0.035);
    transition: transform 0.3s ease, border-color 0.3s ease;
}

.sirs-partner-card:hover {
    transform: translateY(-4px);
    border-color: rgba(204, 85, 77, 0.35);
}

.sirs-partner-card img {
    display: block;
    max-width: 100%;
    max-height: 100px;
    width: auto;
    height: auto;
    object-fit: contain;
}


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

.sirs-partner-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 7px;
    margin-top: 18px;
}

.sirs-partner-dots span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ded7d3;
    transition: width 0.3s ease, background 0.3s ease;
}

.sirs-partner-dots span.active {
    width: 24px;
    border-radius: 10px;
    background: #cc554d;
}


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

.sirs-global-features {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin-top: 52px;
    border-top: 1px solid #e9dfda;
    border-bottom: 1px solid #e9dfda;
}

.sirs-global-feature {
    display: flex;
    align-items: center;
    gap: 15px;
    min-height: 125px;
    padding: 20px 30px;
    border-right: 1px solid #e9dfda;
}

.sirs-global-feature:first-child {
    padding-left: 0;
}

.sirs-global-feature:last-child {
    border-right: none;
}

.sirs-feature-icon {
    width: 52px;
    height: 52px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff4f2;
    color: #cc554d;
}

.sirs-feature-icon svg {
    width: 23px;
    height: 23px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sirs-global-feature h4 {
    margin: 0;
    font-size: 18px;
    line-height: 1.12;
    font-weight: 500;
}

.sirs-global-feature p {
    margin: 7px 0 0;
    color: #7b736e;
    font-size: 11px;
    line-height: 1.4;
}


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

@keyframes sirs-globe-spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}


/* MacBook/laptop: keep the globe in its column and all three stats readable. */

@media (min-width: 1201px) and (max-width: 1440px) {
    .sirs-global-section {
        padding: 55px 5% 52px;
    }
    .sirs-global-top {
        grid-template-columns: minmax(0, 52%) minmax(0, 48%);
        gap: 12px;
    }
    .sirs-global-content {
        min-width: 0;
        padding-right: 18px;
    }
    .sirs-global-content h2 {
        font-size: 45px;
        line-height: 1;
        letter-spacing: 0;
    }
    .sirs-global-content>p {
        max-width: 540px;
        margin: 22px 0 24px;
        font-size: 16px;
        line-height: 1.55;
    }
    .sirs-global-stats {
        width: 100%;
        gap: 14px;
        margin-top: 20px;
    }
    .sirs-global-stat {
        min-width: 0;
        gap: 9px;
    }
    .sirs-stat-icon {
        width: 42px;
        height: 42px;
        flex: 0 0 42px;
    }
    .sirs-stat-icon svg {
        width: 21px;
        height: 21px;
    }
    .sirs-global-stat strong {
        font-size: 21px;
    }
    .sirs-global-stat span {
        font-size: 11px;
        letter-spacing: .4px;
    }
    .sirs-stat-divider {
        height: 42px;
    }
    .sirs-global-globe-area {
        min-width: 0;
        height: 440px;
    }
    .sirs-global-globe-image {
        width: min(470px, 100%);
        max-height: 440px;
        transform: none;
    }
    .sirs-partners-section {
        margin-top: 24px;
    }
    .sirs-partners-header {
        margin-bottom: 16px;
    }
    .sirs-partners-header>div:first-child>span {
        font-size: 13px;
    }
    .sirs-partners-header h3 {
        font-size: 26px;
    }
    .sirs-partner-card {
        width: 190px;
        height: 125px;
        border-radius: 62px;
    }
    .sirs-partner-card img {
        max-height: 78px;
    }
    .sirs-partner-dots {
        margin-top: 14px;
    }
}


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

@media (max-width: 1200px) {
    .sirs-global-section {
        padding-left: 30px;
        padding-right: 30px;
    }
    .sirs-global-top {
        grid-template-columns: 1fr 1fr;
        gap: 15px;
    }
    .sirs-global-globe-image {
        width: min(410px, 100%);
        transform: none;
    }
    .sirs-global-content {
        padding-right: 10px;
    }
    .sirs-global-stats {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
    }
    .sirs-global-stat {
        min-width: 0;
    }
    .sirs-global-stat span {
        font-size: 11px;
        white-space: normal;
    }
    .sirs-stat-divider {
        display: none;
    }
    .sirs-global-quote {
        display: none;
    }
    .sirs-global-globe-area {
        height: 440px;
    }
    .sirs-globe {
        width: 410px;
    }
    .sirs-global-features {
        grid-template-columns: repeat(2, 1fr);
    }
    .sirs-global-feature:nth-child(2) {
        border-right: none;
    }
    .sirs-global-feature:nth-child(1),
    .sirs-global-feature:nth-child(2) {
        border-bottom: 1px solid #e9dfda;
    }
}


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

@media (max-width: 700px) {
    .sirs-global-section {
        padding: 25px 18px 50px;
    }
    .sirs-global-top {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }
    .sirs-global-content {
        width: 100%;
        padding: 0;
    }
    .sirs-global-eyebrow {
        font-size: 11px;
        letter-spacing: 1.8px;
    }
    .sirs-global-eyebrow span {
        width: 50px;
    }
    .sirs-global-content h2 {
        font-size: 47px;
        letter-spacing: -1.5px;
    }
    .sirs-global-content>p {
        margin-top: 20px;
        font-size: 14px;
        line-height: 1.6;
    }
    .sirs-global-stats {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 7px;
        margin-top: 25px;
    }
    .sirs-global-stat {
        flex-direction: column;
        align-items: flex-start;
        gap: 7px;
    }
    .sirs-stat-icon {
        width: 40px;
        height: 40px;
    }
    .sirs-global-stat strong {
        font-size: 21px;
    }
    .sirs-global-stat span {
        font-size: 9px;
        white-space: normal;
    }
    .sirs-stat-divider {
        display: none;
    }
    .sirs-global-globe-area {
        width: 100%;
        height: 350px;
        margin-top: 20px;
    }
    .sirs-globe {
        width: 315px;
    }
    .sirs-location {
        padding: 5px 8px;
        font-size: 9px;
    }
    .sirs-location.india {
        right: 18%;
    }
    .sirs-location.canada {
        left: 4%;
    }
    .sirs-location.usa {
        left: 8%;
    }
    .sirs-location.australia {
        right: 8%;
    }
    .sirs-partners-section {
        margin-top: 40px;
    }
    .sirs-partners-header h3 {
        font-size: 21px;
    }
    .sirs-partners-header>div:first-child>span {
        font-size: 9px;
    }
    .sirs-partner-card {
        /* Fit two complete partner logos in the mobile viewport. */
        width: calc((100vw - 48px) / 2);
        height: 95px;
    }
    .sirs-partners-track {
        gap: 12px;
    }
    .sirs-global-features {
        grid-template-columns: 1fr;
        margin-top: 40px;
    }
    .sirs-global-feature,
    .sirs-global-feature:first-child {
        min-height: 100px;
        padding: 18px 0;
        border-right: none;
        border-bottom: 1px solid #e9dfda;
    }
    .sirs-global-feature:last-child {
        border-bottom: none;
    }
    .sirs-global-feature h4 {
        font-size: 17px;
    }
}


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

@media (max-width: 420px) {
    .sirs-global-content h2 {
        font-size: 39px;
    }
    .sirs-global-globe-area {
        height: 300px;
    }
    .sirs-globe {
        width: 275px;
    }
    .sirs-location.europe {
        left: 39%;
    }
    .sirs-location.uk {
        left: 17%;
    }
    .sirs-location.asia {
        right: 0;
    }
    .sirs-partners-header {
        align-items: center;
    }
    .sirs-partners-header h3 {
        font-size: 18px;
    }
    .sirs-partners-arrows button {
        width: 34px;
        height: 34px;
    }
}

.sai-footer-wrap {
    padding: 0px 0;
    background: #e8e9e2;
}

.sai-footer,
.sai-footer * {
    box-sizing: border-box;
}

.sai-footer {
    --footer-image: url("images/footer-bg.png");
    position: relative;
    isolation: isolate;
    width: 100%;
    max-width: none;
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid #26353c;
    border-radius: 0;
    color: #fff;
    background: #09121a;
    box-shadow: 0 28px 55px rgb(0 0 0 / 30%);
    font-family: Arial, Helvetica, sans-serif;
}

.sai-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background-image: var(--footer-image);
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
}

.sai-footer::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: radial-gradient(ellipse 540px 300px at top left, rgb(5 13 21 / 85%) 0%, rgb(5 13 21 / 48%) 40%, transparent 100%), linear-gradient(180deg, rgb(5 13 21 / 28%) 0%, rgb(5 13 21 / 18%) 25%, rgb(5 13 21 / 78%) 48%, #080e14 82%);
}

.sai-footer a {
    color: inherit;
    text-decoration: none;
}

.sai-footer a:focus-visible {
    outline: 2px solid #f7cf91;
    outline-offset: 5px;
}

.sai-footer-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding: 28px 32px;
    min-height: 320px;
}

.sai-footer-brand {
    display: flex;
    align-items: center;
    gap: 10px;
}

.sai-footer-logo {
    display: block;
    width: 180px;
    max-width: 100%;
    height: auto;
}

.sai-footer-badge {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border: 1.5px solid #f1dfbf;
    border-radius: 50%;
    font-size: 18px;
    font-weight: 700;
    color: #f1dfbf;
    flex-shrink: 0;
}

.sai-footer-brand-name {
    font-size: 11px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 1.7px;
}

.sai-footer-tagline {
    margin: 5px 0 0;
    max-width: 270px;
    color: #f1dfbf;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.6;
    text-align: right;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.sai-footer-columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 34px;
    padding: 0 32px 24px;
}

.sai-footer-columns>* {
    min-width: 0;
}

.sai-footer-heading {
    margin: 0 0 13px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgb(255 255 255 / 15%);
    text-align: center;
    color: #fff;
    font-size: 19px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.sai-footer-links {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 9px;
}

.sai-footer-links a,
.sai-footer-address {
    color: #c3c8cd;
    font-size: 17px;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

.sai-footer-links a:hover {
    color: #f7cf91;
}

.sai-footer-address {
    margin: 0;
    font-style: normal;
}

.sai-footer-contact-row {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0;
}

.sai-footer-contact-row>* {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding: 0 18px;
}

.sai-footer-contact-row>*+* {
    border-left: 1px solid rgb(255 255 255 / 38%);
}

.sai-footer-contact-row i {
    flex-shrink: 0;
}

@media (max-width: 1000px) {
    .sai-footer-contact-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
    }
    .sai-footer-contact-row>* {
        padding: 0;
    }
    .sai-footer-contact-row>*+* {
        border-left: 0;
    }
}

.sai-footer .sai-footer-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-height: 44px;
    margin-top: 16px;
    padding: 10px 18px;
    border: 1px solid rgb(255 255 255 / 65%);
    border-radius: 30px;
    color: #fff;
    font-size: 12px;
    transition: background 180ms ease, color 180ms ease;
}

.sai-footer .sai-footer-button:hover {
    background: #f1dfbf;
    color: #09121a;
}


/* Copyright line above the large brand name */

.sai-footer-copyright {
    margin: 12px 32px 0;
    padding: 18px 0 20px;
    border-top: 1px solid rgb(255 255 255 / 18%);
    color: #c3c8cd;
    font-size: 18px;
    line-height: 1.7;
    letter-spacing: 0.3px;
    text-align: center;
}

.sai-footer-wordmark {
    margin: 0;
    padding: 0 12px;
    line-height: 0;
    opacity: 0.3;
    user-select: none;
}

.sai-footer-socials {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    padding: 0 20px 18px;
}

.sai-footer-socials a {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid rgb(255 255 255 / 22%);
    border-radius: 50%;
    background: rgb(255 255 255 / 6%);
    color: #fff;
    font-size: 18px;
}

.sai-footer-socials a:hover,
.sai-footer-socials a:focus-visible {
    background: #cf514b;
    border-color: #cf514b;
}

.sai-footer-wordmark svg {
    display: block;
    width: 100%;
    height: auto;
}

@media (min-width: 1100px) {
    .sai-footer-top {
        min-height: 390px;
    }
}

@media (max-width: 680px) {
    .sai-footer-wrap {
        padding: 0;
        background: #09121a;
    }
    .sai-footer {
        border: 0;
        box-shadow: none;
    }
    .sai-footer-top {
        /* The logo block is not rendered here, so don't reserve a large blank area. */
        min-height: 150px;
        padding: 0;
    }
    .sai-footer-brand-name {
        display: none;
    }
    .sai-footer-logo {
        width: 130px;
    }
    .sai-footer-tagline {
        max-width: 185px;
        font-size: 10px;
    }
    .sai-footer-columns {
        grid-template-columns: minmax(0, 1fr);
        gap: 26px 20px;
        padding: 0 24px 22px;
    }
    .sai-footer-contact {
        grid-column: 1 / -1;
        text-align: center;
    }
    .sai-footer-links,
    .sai-footer-contact-row {
        align-items: center;
    }
    .sai-footer-contact-row > * {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
    .sai-footer-copyright {
        margin: 0 24px;
        padding: 16px 0 20px;
        font-size: 11px;
    }
    .sai-footer-wordmark {
        padding: 0 6px;
    }
    .sai-footer::after {
        background: radial-gradient(ellipse 320px 230px at top left, rgb(5 13 21 / 85%) 0%, rgb(5 13 21 / 48%) 40%, transparent 100%), linear-gradient(180deg, rgb(5 13 21 / 15%) 0%, rgb(5 13 21 / 65%) 30%, #080e14 60%);
    }
}

@media (prefers-reduced-motion: reduce) {
    .sai-footer .sai-footer-button {
        transition: none;
    }
}