/* Shared SLTC visual and motion system. Brand orange and graphite remain the identity. */
:root {
    --premium-ink: #242424;
    --premium-charcoal: #343434;
    --premium-amber: #e99800;
    --premium-cream: #f8f6f1;
    --premium-line: #e5dfd2;
    --premium-shadow: 0 22px 55px rgba(33, 30, 23, .11);
    --premium-ease: cubic-bezier(.22, 1, .36, 1)
}

html {
    scroll-behavior: smooth
}

body {
    overflow-x: clip;
    -webkit-font-smoothing: antialiased
}

::selection {
    background: #e99800;
    color: #242424
}

:focus-visible {
    outline: 3px solid #e99800;
    outline-offset: 4px
}

a,
button {
    transition: color .24s ease, background-color .24s ease, border-color .24s ease, box-shadow .28s ease, transform .28s var(--premium-ease)
}

main {
    overflow: clip
}

main>section {
    isolation: isolate
}

main :is(h1, h2, h3) {
    text-wrap: balance
}

main :is(p, li) {
    text-wrap: pretty
}

/* A quiet graphic language shared by each page hero. */
:is(.about-hero, .vocational-hero, .corporate-hero, .partners-hero, .clients-hero, .faculty-hero, .gallery-hero, .news-hero, .contact-hero, .why-hero, .vision-hero, .board-hero, .management-hero, .operation-hero) {
    background-image: linear-gradient(205deg, rgba(233, 152, 0, .16) 0%, rgba(233, 152, 0, 0) 38%), linear-gradient(118deg, #2c2c2c 0%, #505050 67%, #686868 100%)
}

:is(.about-hero, .vocational-hero, .corporate-hero, .partners-hero, .clients-hero, .faculty-hero, .gallery-hero, .news-hero, .contact-hero)>.container {
    position: relative;
    z-index: 1
}

:is(.about-hero, .vocational-hero, .corporate-hero, .partners-hero, .clients-hero, .faculty-hero, .gallery-hero, .news-hero, .contact-hero) h1 {
    animation: premium-rise .8s var(--premium-ease) both
}

:is(.about-hero, .vocational-hero, .corporate-hero, .partners-hero, .clients-hero, .faculty-hero, .gallery-hero, .news-hero, .contact-hero) p {
    animation: premium-rise .9s .12s var(--premium-ease) both
}

@keyframes premium-rise {
    from {
        opacity: 0;
        transform: translate3d(0, 24px, 0)
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

/* Navigation, cards and links gain the same tactile behavior across pages. */
.main-menu>ul>li:focus-within>ul.submenu {
    opacity: 1;
    pointer-events: auto;
    transform: scaleY(1);
    visibility: visible
}

.main-menu .submenu {
    border-top: 3px solid var(--premium-amber);
    box-shadow: var(--premium-shadow);
    transition: opacity .25s ease, transform .32s var(--premium-ease), visibility .25s ease
}

.main-menu .submenu li a {
    font-size: 16px;
    line-height: 1.45;
    padding-top: 12px;
    padding-bottom: 12px
}

.main-menu>ul>li>a {
    font-weight: 650
}

.main-menu a[aria-current="page"] {
    color: #ffb32f
}

.sltc-footer a:hover {
    color: #ffbd47
}

:is(.about-path, .vocational-next-grid a, .faculty-type, .clients-sector-grid article, .corporate-step, .news-explore a, .contact-card, .gallery-item, .board-card, .management-card, .operation-card, .rs-facts-card) {
    transition: transform .3s var(--premium-ease), box-shadow .3s var(--premium-ease), border-color .3s ease, background-color .3s ease
}

@media(hover:hover) {
    :is(.about-path, .vocational-next-grid a, .faculty-type, .clients-sector-grid article, .corporate-step, .news-explore a, .contact-card, .gallery-item, .board-card, .management-card, .operation-card, .rs-facts-card):hover {
        transform: translateY(-5px);
        box-shadow: var(--premium-shadow)
    }
}

:is(.vocational-program-link, .about-inline-link, .faculty-links a) {
    transition: color .25s ease, border-color .25s ease, letter-spacing .25s ease
}

@media(hover:hover) {
    :is(.vocational-program-link, .about-inline-link, .faculty-links a):hover {
        letter-spacing: .015em
    }
}

/* Home hero uses its existing slide images as a layered editorial composition. */
.rs-banner-one .rs-banner-slide {
    position: relative;
    isolation: isolate
}

.rs-banner-one .rs-banner-slide::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(90deg, rgba(23, 26, 29, .77) 0%, rgba(34, 36, 38, .57) 45%, rgba(34, 36, 38, .1) 100%);
    pointer-events: none
}

.rs-banner-one .rs-banner-slide>.container-fluid {
    position: relative;
    z-index: 2
}

.rs-banner-one .rs-banner-sec-wrapper {
    max-width: 850px
}

.rs-banner-one .rs-banner-title {
    font-size: clamp(48px, 5.9vw, 88px);
    line-height: 1.02;
    letter-spacing: -.052em;
    text-wrap: balance;
    max-width: 900px;
    margin-bottom: 22px
}

.rs-banner-one .rs-banner-subtitle {
    font-size: clamp(14px, 1.1vw, 17px);
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase
}

.premium-hero-copy {
    max-width: 690px;
    color: #f4f4f4;
    font-size: clamp(18px, 1.55vw, 23px);
    line-height: 1.55;
    margin: 0 0 30px
}

.premium-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    align-items: center
}

.premium-hero-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 26px;
    padding: 16px 21px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 800;
    min-height: 54px
}

.premium-hero-actions .premium-primary {
    background: var(--premium-amber);
    color: #222
}

.premium-hero-actions .premium-secondary {
    border: 1px solid rgba(255, 255, 255, .65);
    color: #fff;
    background: rgba(255, 255, 255, .06);
    backdrop-filter: blur(8px)
}

.premium-hero-actions a:hover {
    transform: translateY(-3px)
}

.premium-hero-actions .premium-primary:hover {
    background: #ffb93d;
    color: #222
}

.premium-hero-actions .premium-secondary:hover {
    background: #fff;
    color: #222
}

.rs-about-one .section-title {
    letter-spacing: -.04em;
    max-width: 800px
}

.rs-about-one .rs-about-thumb img {
    border-radius: 6px;
    box-shadow: 0 22px 50px rgba(0, 0, 0, .15)
}

.rs-facts-area .rs-facts-banner {
    background: linear-gradient(120deg, #343434 0%, #595959 68%, #795514 100%)
}

/* Scroll reveals are enabled only after JS confirms support and the section is below view. */
.premium-reveal {
    transition: opacity .68s var(--premium-ease), transform .68s var(--premium-ease)
}

.premium-reveal.is-reveal-pending {
    opacity: 0;
    transform: translate3d(0, 26px, 0)
}

.premium-reveal.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0)
}

@media(max-width:767px) {
        .rs-banner-one .rs-banner-title {
        font-size: clamp(42px, 10vw, 62px)
    }

    .premium-hero-actions {
        gap: 10px
    }

    .premium-hero-actions a {
        width: 100%
    }

    .rs-banner-one .rs-banner-slide::before {
        background: linear-gradient(90deg, rgba(23, 26, 29, .82), rgba(23, 26, 29, .44))
    }
}

@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior: auto
    }

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important
    }

    .premium-reveal.is-reveal-pending {
        opacity: 1;
        transform: none
    }
}

.rs-banner-one .rs-banner-slide::before,
.rs-banner-one .rs-banner-slide>.container-fluid {
    z-index: 4
}

.rs-banner-one .rs-banner-content-wrapper {
    display: block;
    max-width: 900px;
    margin-top: clamp(80px, 11vh, 140px)
}

.rs-banner-one .rs-banner-wrapper {
    padding-top: 165px;
    padding-bottom: 120px
}

.rs-banner-one .rs-banner-large-title {
    display: none
}

.rs-facts-card-body h4,
.rs-facts-stat b {
    color: #292929
}

@media(max-width:767px) {
    .rs-banner-one .rs-banner-content-wrapper {
        margin-top: 55px;
        text-align: left
    }

    .rs-banner-one .rs-banner-wrapper {
        padding-top: 145px;
        padding-bottom: 115px
    }
}

.premium-snapshot {
    background: #e99800;
    color: #272727;
    position: relative;
    z-index: 3
}

.premium-snapshot-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr))
}

.premium-snapshot-grid>div {
    padding: 30px 38px;
    border-right: 1px solid rgba(39, 39, 39, .22)
}

.premium-snapshot-grid>div:last-child {
    border-right: 0
}

.premium-snapshot-grid span {
    display: block;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .16em;
    margin-bottom: 11px;
    color: #5c410c
}

.premium-snapshot-grid strong {
    display: block;
    font-size: clamp(26px, 2.2vw, 34px);
    line-height: 1.1;
    letter-spacing: -.04em
}

.premium-snapshot-grid p {
    font-size: 15px;
    line-height: 1.5;
    margin: 8px 0 0;
    color: #463511
}

@media(max-width:767px) {
    .premium-snapshot-grid {
        grid-template-columns: 1fr
    }

    .premium-snapshot-grid>div {
        padding: 22px 10px;
        border-right: 0;
        border-bottom: 1px solid rgba(39, 39, 39, .22)
    }
}

/* Keep the shared header on one line without clipping the logo or menu button. */
.rs-header-one .header-wrapper {
    padding-inline: clamp(18px, 2.2vw, 46px);
    gap: clamp(14px, 1.5vw, 30px)
}

.rs-header-one .header-left,
.rs-header-one .header-right {
    flex: 0 0 auto
}

.rs-header-one .header-logo {
    width: clamp(135px, 8vw, 160px)
}

.rs-header-one .header-menu {
    min-width: 0
}

.rs-header-one .main-menu>ul {
    display: flex;
    flex-wrap: nowrap;
    gap: clamp(12px, 1.05vw, 22px)
}

.rs-header-one .main-menu>ul>li {
    flex: 0 0 auto
}

.rs-header-one .main-menu>ul>li>a {
    white-space: nowrap;
    font-size: clamp(16px, .83vw, 17px);
    font-weight: 600
}

.rs-header-one .header-right {
    gap: clamp(12px, 1vw, 20px)
}

.rs-header-one .header-btn a {
    white-space: nowrap
}

@media(max-width:1399px) and (min-width:1200px) {
    .rs-header-one .header-wrapper {
        gap: 12px;
        padding-inline: 18px
    }

    .rs-header-one .header-logo {
        width: 135px
    }

    .rs-header-one .main-menu>ul {
        gap: 10px
    }

    .rs-header-one .main-menu>ul>li>a {
        font-size: 13px
    }

    .rs-header-one .header-btn {
        display: none
    }
}

@media(max-width:1199px) {
    .rs-header-one .header-menu {
        display: none
    }

    .rs-header-one .header-wrapper {
        justify-content: space-between
    }
}

@media(max-width:575px) {
    .rs-header-one .header-logo {
        width: 135px
    }
}

/* Stagger individual cards as they enter the viewport on every page. */
.premium-item-reveal{transition:opacity .65s var(--premium-ease),translate .65s var(--premium-ease);transition-delay:var(--premium-delay,0ms)}
.premium-item-reveal.is-reveal-pending{opacity:0;translate:0 24px}
.premium-item-reveal.is-visible{opacity:1;translate:0 0}
@media(prefers-reduced-motion:reduce){.premium-item-reveal.is-reveal-pending{opacity:1;translate:none}}
