/* ==== dssa-hero-fit ==== */
/* laptop heights: compact the rhythm so everything fits above the fold */
@media (max-height:900px) {
    #dssa-hero .dh-slide {
        padding-top: 18px;
        padding-bottom: 58px
    }

    #dssa-hero .dh-title {
        margin-bottom: 10px
    }

    #dssa-hero .dh-lead {
        font-size: clamp(1.15rem,1.7vw,1.4rem);
        margin-bottom: 10px
    }

    #dssa-hero .dh-small {
        font-size: 1rem;
        line-height: 1.6;
        margin-bottom: 16px
    }

    #dssa-hero .dh-cta {
        margin-bottom: 16px
    }

    #dssa-hero .dh-btn {
        padding: 13px 30px;
        font-size: 1rem
    }

    #dssa-hero .dh-chip {
        padding: 14px 16px
    }

        #dssa-hero .dh-chip p {
            font-size: .92rem
        }

    #dssa-hero .dh-fig {
        height: min(62vh,520px)
    }

    #dssa-hero .dh-dots {
        bottom: 16px
    }
}

@media (max-height:760px) {
    #dssa-hero .dh-chips {
        display: none
    }
    /* smallest laptops: keep the message, drop the chips */
    #dssa-hero .dh-fig {
        height: min(58vh,440px)
    }
}

/* ==== dssa-hero-css ==== */
ss3-force-full-width {
    display: none !important
}

#dssa-hero {
    --navy: #072c43;
    --navy2: #0b3a56;
    --gold: #bf9445;
    --goldb: #ffb606;
    position: relative;
    width: 100%;
    min-height: calc(100vh - var(--dh-header,90px));
    background: radial-gradient(circle at 85% 15%,rgba(191,148,69,.16),transparent 45%), radial-gradient(circle at 8% 85%,rgba(24,144,215,.10),transparent 40%), linear-gradient(150deg,#061f30 0%,var(--navy) 45%,var(--navy2) 100%);
    overflow: hidden;
    font-family: 'Poppins',sans-serif
}

    #dssa-hero::before {
        content: "";
        position: absolute;
        inset: 0;
        opacity: .05;
        background-image: radial-gradient(rgba(255,255,255,.9) 1px,transparent 1px);
        background-size: 26px 26px
    }
    /* floating gold orbs */
    #dssa-hero .dh-orb {
        position: absolute;
        border-radius: 50%;
        filter: blur(60px);
        opacity: .35;
        pointer-events: none
    }

    #dssa-hero .dh-orb1 {
        width: 420px;
        height: 420px;
        background: var(--gold);
        top: -140px;
        right: -100px;
        animation: dhFloat 11s ease-in-out infinite
    }

    #dssa-hero .dh-orb2 {
        width: 300px;
        height: 300px;
        background: #1890d7;
        bottom: -120px;
        left: -80px;
        animation: dhFloat 14s ease-in-out infinite reverse
    }

@keyframes dhFloat {
    0%,100% {
        transform: translate(0,0)
    }

    50% {
        transform: translate(-40px,30px)
    }
}

.dh-slide {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    gap: 34px;
    align-items: center;
    max-width: 1560px;
    margin: 0 auto;
    padding: 26px 56px 66px;
    opacity: 0;
    visibility: hidden;
    transition: opacity .7s ease,visibility .7s;
    z-index: 1
}

    .dh-slide.dh-active {
        opacity: 1;
        visibility: visible;
        z-index: 2
    }

#dssa-hero {
    display: flex
}
    /* give the absolute slides a sized stage */
    #dssa-hero .dh-stage {
        position: relative;
        flex: 1;
        min-height: calc(100vh - var(--dh-header,90px))
    }

.dh-copy {
    color: #fff;
    max-width: none
}

.dh-crest {
    width: auto;
    max-width: 100%;
    height: auto;
    margin-bottom: 16px
}

.dh-title {
    font-size: clamp(2.5rem,4.6vw,4rem);
    line-height: 1.1;
    font-weight: 800;
    color: #fff;
    margin: 0 0 18px
}

    .dh-title .dh-gold-w {
        color: var(--goldb)
    }

.dh-lead {
    font-size: clamp(1.35rem,2vw,1.7rem);
    line-height: 1.55;
    color: rgba(255,255,255,.97);
    font-weight: 600;
    margin: 0 0 16px
}

.dh-small {
    font-size: 1.18rem;
    line-height: 1.75;
    color: rgba(255,255,255,.78);
    margin: 0 0 28px;
    max-width: 680px
}

.dh-cta {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 24px
}

.dh-btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 16px 40px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 1.12rem;
    text-decoration: none;
    transition: transform .25s ease,box-shadow .25s ease,background .25s ease;
    cursor: pointer
}

.dh-gold {
    background: linear-gradient(120deg,var(--goldb),var(--gold));
    color: #2a2205;
    box-shadow: 0 10px 26px rgba(255,182,6,.35)
}

    .dh-gold:hover {
        transform: translateY(-3px) scale(1.03);
        box-shadow: 0 16px 34px rgba(255,182,6,.5);
        color: #2a2205
    }

.dh-ghost {
    border: 2px solid rgba(255,255,255,.55);
    color: #fff
}

    .dh-ghost:hover {
        background: rgba(255,255,255,.12);
        transform: translateY(-3px);
        color: #fff
    }

.dh-chips {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    max-width: none
}

.dh-chip {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 22px 24px;
    border-radius: 18px;
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.14);
    backdrop-filter: blur(8px)
}

    .dh-chip i {
        color: var(--goldb);
        font-size: 1.6rem;
        margin-top: 4px
    }

    .dh-chip p {
        margin: 0;
        font-size: 1.1rem;
        line-height: 1.65;
        color: rgba(255,255,255,.95)
    }

.dh-chip-gold {
    background: linear-gradient(135deg,rgba(191,148,69,.28),rgba(191,148,69,.12));
    border-color: rgba(255,182,6,.35)
}

.dh-fig {
    position: relative;
    height: min(74vh,660px);
    margin: 0;
    border-radius: 26px;
    overflow: hidden;
    box-shadow: 0 30px 70px rgba(0,0,0,.45);
    border: 1px solid rgba(255,255,255,.12)
}

.dh-fig-bg {
    position: absolute;
    inset: 0;
    background: url('../../Assets/wp-content/uploads/2026/01/bg-59737c68-1f7b-42c8-b785-09162d5fd8e4-1.png') center/cover no-repeat;
    animation: dhKen 16s ease-in-out infinite alternate
}

@keyframes dhKen {
    from {
        transform: scale(1)
    }

    to {
        transform: scale(1.09)
    }
}

.dh-fig::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top,rgba(7,44,67,.55),transparent 55%)
}

.dh-fig-img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    transform: none !important;
    object-fit: cover;
    object-position: top center;
    z-index: 2;
    filter: drop-shadow(0 18px 40px rgba(0,0,0,.5))
}

/* entrance choreography */
.dh-active .dh-crest, .dh-active .dh-title, .dh-active .dh-lead, .dh-active .dh-small,
.dh-active .dh-cta, .dh-active .dh-chips {
    animation: dhUp .8s cubic-bezier(.16,1,.3,1) both
}

.dh-active .dh-title {
    animation-delay: .08s
}

.dh-active .dh-lead {
    animation-delay: .18s
}

.dh-active .dh-small {
    animation-delay: .26s
}

.dh-active .dh-cta {
    animation-delay: .34s
}

.dh-active .dh-chips {
    animation-delay: .44s
}

.dh-active .dh-fig {
    animation: dhFig .9s cubic-bezier(.16,1,.3,1) both .15s
}

@keyframes dhUp {
    from {
        opacity: 0;
        transform: translateY(34px)
    }

    to {
        opacity: 1;
        transform: none
    }
}

@keyframes dhFig {
    from {
        opacity: 0;
        transform: translateX(60px) scale(.96)
    }

    to {
        opacity: 1;
        transform: none
    }
}

/* controls */
.dh-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.3);
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(6px);
    color: #fff;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all .25s ease
}

    .dh-nav:hover {
        background: var(--goldb);
        border-color: var(--goldb);
        color: #2a2205;
        transform: translateY(-50%) scale(1.12)
    }

.dh-prev {
    left: 26px
}

.dh-next {
    right: 26px
}

.dh-dots {
    position: absolute;
    bottom: 26px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    display: flex;
    gap: 10px
}

.dh-dot {
    width: 10px;
    height: 10px;
    border-radius: 20px;
    border: 0;
    background: rgba(255,255,255,.35);
    cursor: pointer;
    transition: all .3s ease;
    padding: 0
}

    .dh-dot.dh-on {
        width: 34px;
        background: var(--goldb)
    }

.dh-progress {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 3px;
    background: linear-gradient(90deg,var(--gold),var(--goldb));
    width: 0;
    z-index: 6;
    transition: none
}

@media (max-width:1024px) {
    .dh-slide {
        grid-template-columns: 1fr;
        padding: 26px 22px 70px;
        overflow-y: auto
    }

    .dh-fig {
        display: none
    }

    .dh-copy {
        max-width: 640px;
        margin: 0 auto;
        text-align: center
    }

    .dh-cta {
        justify-content: center
    }

    .dh-chips {
        margin: 0 auto
    }

    .dh-crest {
        height: 84px
    }
}

@media (max-height:800px) {
    .dh-crest {
        height: 64px;
        margin-bottom: 8px
    }

    .dh-small {
        font-size: 1.02rem;
        margin-bottom: 16px
    }

    .dh-title {
        margin-bottom: 10px
    }

    .dh-chip {
        padding: 14px 18px
    }

        .dh-chip p {
            font-size: .98rem
        }

    .dh-cta {
        margin-bottom: 16px
    }

    .dh-fig {
        height: min(66vh,520px)
    }
}

/* ==== dssa-quote-fix ==== */
html body .edublink-section-heading .sub-heading blockquote::before,
html body .sub-heading blockquote::before,
html body blockquote::before {
    content: "" !important;
    display: inline-block !important;
    width: 34px;
    height: 34px;
    background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"%3E%3Cpath fill="%23bf9445" d="M464 256h-80v-64c0-35.3 28.7-64 64-64h8c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24h-8c-88.4 0-160 71.6-160 160v240c0 26.5 21.5 48 48 48h128c26.5 0 48-21.5 48-48V304c0-26.5-21.5-48-48-48zm-288 0H96v-64c0-35.3 28.7-64 64-64h8c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24h-8C71.6 32 0 103.6 0 192v240c0 26.5 21.5 48 48 48h128c26.5 0 48-21.5 48-48V304c0-26.5-21.5-48-48-48z"/%3E%3C/svg%3E') no-repeat center / contain !important;
    font-size: 0 !important;
    line-height: 1 !important;
    margin-bottom: 10px;
}

html body .edublink-section-heading .sub-heading blockquote::after,
html body .sub-heading blockquote::after {
    content: none !important;
}

/* ==== dssa-polish ==== */
html {
    scroll-behavior: smooth
}

/* --- hero entrance --- */
@keyframes dssaHeroIn {
    0% {
        opacity: 0;
        transform: translateY(34px)
    }

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

.dssa-hero-anim {
    animation: dssaHeroIn .9s cubic-bezier(.16,1,.3,1) both
}

/* --- scroll reveal --- */
.dssa-reveal {
    opacity: 0;
    transform: translateY(42px);
    transition: opacity .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1)
}

    .dssa-reveal.dssa-inview {
        opacity: 1;
        transform: none
    }

/* --- hover polish --- */
.edublink-category-2 {
    transition: transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease
}

    .edublink-category-2:hover {
        transform: translateY(-9px);
        box-shadow: 0 22px 45px rgba(7,44,67,.22)
    }

a.edublink-button-item, .wp-block-button__link, button.edublink-mailchimp-subscribe-btn {
    transition: transform .25s ease,box-shadow .25s ease !important
}

    a.edublink-button-item:hover, .wp-block-button__link:hover, button.edublink-mailchimp-subscribe-btn:hover {
        transform: translateY(-3px);
        box-shadow: 0 14px 30px rgba(7,44,67,.25)
    }

.elementor-image-carousel-wrapper .swiper-slide-image {
    filter: grayscale(.55);
    transition: filter .4s ease,transform .4s ease
}

.elementor-image-carousel-wrapper .swiper-slide:hover .swiper-slide-image {
    filter: grayscale(0);
    transform: scale(1.06)
}

.eb-testimonial-thumb .nav-thumb img {
    transition: transform .35s ease,box-shadow .35s ease
}

.eb-testimonial-thumb .nav-thumb:hover img {
    transform: scale(1.1);
    box-shadow: 0 12px 26px rgba(7,44,67,.28)
}

.elementor-social-icon {
    transition: transform .28s cubic-bezier(.34,1.56,.64,1) !important
}

    .elementor-social-icon:hover {
        transform: translateY(-5px) scale(1.12)
    }

.nextend-arrow {
    transition: transform .25s ease,opacity .25s ease
}

    .nextend-arrow:hover {
        transform: scale(1.15)
    }
/* sticky header shadow once scrolling */
header.site-header {
    transition: box-shadow .3s ease
}

    header.site-header.dssa-scrolled {
        box-shadow: 0 6px 24px rgba(7,44,67,.14)
    }

@media (prefers-reduced-motion: reduce) {
    .dssa-reveal {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important
    }

    .dssa-hero-anim {
        animation: none !important
    }
}

/* ==== dssa-orig-anim ==== */
@keyframes edublink--slide-up {
    from {
        opacity: 0;
        transform: translateY(60px)
    }

    to {
        opacity: 1;
        transform: none
    }
}

@keyframes edublink--slide-left {
    from {
        opacity: 0;
        transform: translateX(80px)
    }

    to {
        opacity: 1;
        transform: none
    }
}

@keyframes edublink--slide-right {
    from {
        opacity: 0;
        transform: translateX(-80px)
    }

    to {
        opacity: 1;
        transform: none
    }
}

@keyframes edublink--fancy {
    from {
        opacity: 0;
        transform: perspective(700px) rotateX(7deg) translateY(50px) scale(.96)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.dssa-orig-wait {
    opacity: 0
}

.dssa-orig-run {
    animation-duration: .95s;
    animation-timing-function: cubic-bezier(.16,1,.3,1);
    animation-fill-mode: both;
    opacity: 1
}

    .dssa-orig-run.edublink--slide-up {
        animation-name: edublink--slide-up
    }

    .dssa-orig-run.edublink--slide-left {
        animation-name: edublink--slide-left
    }

    .dssa-orig-run.edublink--slide-right {
        animation-name: edublink--slide-right
    }

    .dssa-orig-run.edublink--fancy {
        animation-name: edublink--fancy;
        animation-duration: 1.15s
    }

@media (prefers-reduced-motion: reduce) {
    .dssa-orig-wait {
        opacity: 1 !important
    }

    .dssa-orig-run {
        animation: none !important
    }
}

/* ==== dssa-responsive-fix ==== */
/* keep rows wrappable */
.edublink-row, [class*="eb-post"] .edublink-row {
    display: flex;
    flex-wrap: wrap
}

/* tablets: 2 cards per row */
@media (max-width: 991px) {
    .edublink-col-md-6:not(.swiper-slide) {
        flex: 0 0 50% !important;
        max-width: 50% !important;
        width: 50% !important
    }
}
/* phones: single column, full width cards */
@media (max-width: 767px) {
    [class*="edublink-col-"]:not(.swiper-slide) {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    .swiper-slide[class*="edublink-col-"] {
        flex: none !important
    }

    .eb-post-one-single-grid, .eb-post-one-single-grid .inner {
        width: 100% !important;
        max-width: 100% !important;
    }

        .eb-post-one-single-grid .thumbnail img,
        .eb-blog-post-wrapper .thumbnail img {
            width: 100% !important;
            height: auto !important;
        }

    .blog-meta {
        flex-wrap: wrap
    }
    /* section paddings breathe less on phones */
    .elementor-section .elementor-container {
        padding-left: 8px;
        padding-right: 8px
    }
}
/* never allow sideways scroll from any frozen desktop width */
html, body {
    overflow-x: hidden !important
}

/* ==== dssa-snap-css ==== */
@media (max-width: 767px) {
    .dssa-snap {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 14px;
        padding: 4px 8px 18px;
        transform: none !important; /* kill any frozen slider offset */
        scrollbar-width: none;
    }

        .dssa-snap::-webkit-scrollbar {
            display: none
        }

        .dssa-snap > * {
            flex: 0 0 94% !important;
            max-width: 94% !important;
            width: 94% !important;
            scroll-snap-align: center;
            transform: none !important;
            margin: 0 !important;
        }

            .dssa-snap > * img {
                width: 100% !important;
                height: auto !important
            }
}

/* ==== dssa-mobile-final ==== */
@media (max-width: 767px) {
    /* The theme's own grid says 2-per-row on small screens (edublink-col-sm-6).
     Overrule it with maximum priority: */
    html body [class*="edublink-col-sm-"]:not(.swiper-slide),
    html body [class*="edublink-col-md-"]:not(.swiper-slide),
    html body [class*="edublink-col-lg-"]:not(.swiper-slide) {
        flex: 0 0 100% !important;
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
    }
    /* snap rows: one full card per screen, native swipe */
    html body .dssa-snap {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch;
        gap: 14px !important;
        transform: none !important;
        scrollbar-width: none;
    }

        html body .dssa-snap::-webkit-scrollbar {
            display: none
        }

        html body .dssa-snap > * {
            flex: 0 0 100% !important;
            width: 100% !important;
            min-width: 100% !important;
            max-width: 100% !important;
            transform: none !important;
            margin: 0 !important;
            scroll-snap-align: center;
        }
}

/* ==== dssa-grid-fix ==== */
html body .dssa-grid-row {
    display: flex !important;
    flex-wrap: wrap !important;
    transform: none !important
}
/* tablet: exactly 2 per row, third wraps below */
@media (min-width:768px) and (max-width:991px) {
    html body .dssa-grid-row > [class*="edublink-col-"]:not(.swiper-slide),
    html body .dssa-grid-row > * {
        flex: 0 0 50% !important;
        width: 50% !important;
        max-width: 50% !important;
        min-width: 0 !important;
    }
}
/* desktop: 3 per row as designed */
@media (min-width:992px) {
    html body .dssa-grid-row > [class*="edublink-col-"]:not(.swiper-slide) {
        flex: 0 0 33.3333% !important;
        width: 33.3333% !important;
        max-width: 33.3333% !important;
        min-width: 0 !important;
    }
}
/* phone: single column unless the snap slider takes it */
@media (max-width:767px) {
    html body .dssa-grid-row:not(.dssa-snap) > * {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* ==== dssa-articles-navy-css ==== */
/* background now comes from the theme's own CSS for section 6aeaa0c (the original navy image) */
.dssa-articles-navy .edublink-section-heading .pre-heading,
.dssa-articles-navy .edublink-section-heading .heading,
.dssa-articles-navy .edublink-section-heading h2,
.dssa-articles-navy .edublink-section-heading h3 {
    color: #ffffff !important
}

.dssa-articles-navy .title-shape i {
    color: #ffb606 !important
}

.dssa-articles-navy .sub-heading {
    color: rgba(255,255,255,.75) !important
}

.dssa-articles-navy .eb-post-style-5 .inner {
    background: #ffffff;
    border-radius: 14px
}

/* ==== dssa-card-polish ==== */
/* identical cards: photos stretched to one fixed height */
.eb-post-style-5 .thumbnail {
    height: 240px;
    overflow: hidden;
    border-radius: 14px 14px 0 0
}

    .eb-post-style-5 .thumbnail > a:first-child {
        display: block;
        height: 100%
    }

    .eb-post-style-5 .thumbnail a:not(:first-child),
    .eb-post-style-5 .thumbnail .category-wrap a,
    .eb-post-style-5 .thumbnail [class*="category"] a,
    .eb-post-style-5 .thumbnail .date {
        height: auto !important;
        display: inline-block
    }

    .eb-post-style-5 .thumbnail img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover;
        object-position: center;
    }
/* breathing room: text never touches the card edges */
.eb-post-style-5 .inner {
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%
}

    .eb-post-style-5 .inner .content {
        padding: 20px 24px 24px !important;
        flex: 1;
        display: flex;
        flex-direction: column
    }

        .eb-post-style-5 .inner .content .title {
            margin: 10px 0 14px
        }

        .eb-post-style-5 .inner .content .read-more-btn,
        .eb-post-style-5 .inner .content > a:last-child {
            margin-top: auto
        }
/* equal-height slides so all cards align */
.eb-post-slider .swiper-slide {
    height: auto;
    display: flex
}

    .eb-post-slider .swiper-slide > * {
        width: 100%;
        display: flex;
        flex-direction: column
    }

    .eb-post-slider .swiper-slide .edu-blog {
        height: 100%;
        display: flex;
        flex-direction: column
    }

@media (max-width:767px) {
    .eb-post-style-5 .thumbnail {
        height: 200px
    }

    .eb-post-style-5 .inner .content {
        padding: 16px 18px 20px !important
    }
}

/* ==== dssa-articles-bg-fix ==== */
.dssa-articles-navy {
    position: relative;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    overflow: hidden;
}
    /* soft navy veil + corner masks to swallow the image's watermark */
    .dssa-articles-navy::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 0;
        background: linear-gradient(315deg, rgba(7,30,48,1) 0%, rgba(7,30,48,.97) 14%, rgba(7,30,48,.6) 24%, transparent 38%), linear-gradient(45deg, rgba(7,30,48,.9) 0%, rgba(7,30,48,.6) 6%, transparent 18%), radial-gradient(ellipse 340px 220px at 100% 100%, rgba(7,30,48,1) 0%, rgba(7,30,48,.95) 55%, transparent 78%), rgba(7,30,48,.22);
    }

    .dssa-articles-navy > * {
        position: relative;
        z-index: 1
    }

/* ==== dssa-uniform-tiles ==== */
/* --- services: strict equal grid, no stagger --- */
@media (min-width:992px) {
    .dssa-tiles-row {
        display: grid !important;
        grid-template-columns: repeat(3,1fr);
        gap: 24px;
        align-items: stretch
    }
}

@media (min-width:768px) and (max-width:991px) {
    .dssa-tiles-row {
        display: grid !important;
        grid-template-columns: repeat(2,1fr);
        gap: 20px;
        align-items: stretch
    }
}

@media (min-width:768px) {
    .dssa-tiles-row > * {
        width: auto !important;
        max-width: none !important;
        flex: none !important;
        margin: 0 !important;
        position: static !important;
        transform: none !important
    }

    .dssa-tiles-row .edublink-category-2 {
        height: 250px !important;
        width: 100% !important;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        margin: 0 !important;
    }
}

.dssa-tiles-row .edublink-category-2 .icon {
    margin-bottom: 18px
}

/* --- testimonials: kill the dead space --- */
.dssa-testi-sec .elementor-column > .elementor-widget-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}

.dssa-testi-sec .edublink-section-heading,
.dssa-testi-sec .edublink-section-heading .sub-heading,
.dssa-testi-sec .edublink-section-heading .sub-heading blockquote {
    max-width: 100% !important;
}

.dssa-testi-sec .eb-testimonial-wrapper {
    margin: 0 auto
}

.dssa-testi-sec .eb-testimonial-thumb {
    margin-bottom: 0
}

/* ==== dssa-cta-css ==== */
.dssa-cta-wrap {
    padding: 44px 20px
}

.cta-shell {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 28px;
    padding: 64px 60px;
    background: radial-gradient(circle at 12% 0%,rgba(191,148,69,.22),transparent 40%), radial-gradient(circle at 95% 100%,rgba(24,144,215,.15),transparent 45%), linear-gradient(135deg,#061f30 0%,#072c43 55%,#0b3a56 100%);
    box-shadow: 0 30px 70px rgba(7,44,67,.35);
    border: 1px solid rgba(255,182,6,.18);
}

    .cta-shell::before {
        content: "";
        position: absolute;
        inset: 0;
        opacity: .05;
        pointer-events: none;
        background-image: radial-gradient(rgba(255,255,255,.9) 1px,transparent 1px);
        background-size: 22px 22px
    }

.cta-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(70px);
    pointer-events: none
}

.cta-g1 {
    width: 340px;
    height: 340px;
    background: rgba(255,182,6,.28);
    top: -140px;
    right: -90px;
    animation: ctaFloat 12s ease-in-out infinite
}

.cta-g2 {
    width: 260px;
    height: 260px;
    background: rgba(24,144,215,.22);
    bottom: -120px;
    left: -70px;
    animation: ctaFloat 15s ease-in-out infinite reverse
}

@keyframes ctaFloat {
    0%,100% {
        transform: translate(0,0)
    }

    50% {
        transform: translate(-30px,24px)
    }
}

.cta-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 56px;
    align-items: center
}

.cta-eyebrow {
    display: inline-block;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: #ffb606;
    margin-bottom: 14px
}

.cta-title {
    color: #fff !important;
    font-size: clamp(1.9rem,3.4vw,2.9rem);
    font-weight: 800;
    line-height: 1.15;
    margin: 0 0 14px
}

    .cta-title span {
        color: #ffb606
    }

.cta-sub {
    color: rgba(255,255,255,.78);
    font-size: 1.08rem;
    line-height: 1.7;
    margin: 0 0 30px;
    max-width: 52ch
}

.cta-btn {
    display: inline-flex;
    align-items: center;
    padding: 17px 40px;
    border-radius: 50px;
    background: linear-gradient(120deg,#ffb606,#bf9445);
    color: #2a2205 !important;
    font-weight: 700;
    font-size: 1.05rem;
    text-decoration: none;
    box-shadow: 0 14px 34px rgba(255,182,6,.35);
    transition: transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s ease
}

    .cta-btn:hover {
        transform: translateY(-4px) scale(1.03);
        box-shadow: 0 22px 46px rgba(255,182,6,.5)
    }

    .cta-btn i {
        transition: transform .3s ease
    }

    .cta-btn:hover i {
        transform: translateX(5px)
    }

.cta-cards {
    display: flex;
    flex-direction: column;
    gap: 14px
}

.cta-card {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 22px 24px;
    border-radius: 18px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.14);
    backdrop-filter: blur(10px);
    text-decoration: none;
    transition: transform .4s cubic-bezier(.22,1,.36,1),background .3s ease,border-color .3s ease
}

    .cta-card:hover {
        transform: translateY(-5px);
        background: rgba(255,255,255,.11);
        border-color: rgba(255,182,6,.45)
    }

.cc-ico {
    flex: 0 0 auto;
    width: 54px;
    height: 54px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg,#ffb606,#bf9445);
    color: #2a2205;
    font-size: 1.25rem;
    box-shadow: 0 10px 24px rgba(255,182,6,.3)
}

.cc-body {
    display: flex;
    flex-direction: column;
    line-height: 1.35
}

    .cc-body small {
        color: rgba(255,255,255,.6);
        font-size: .8rem;
        font-weight: 600;
        letter-spacing: .06em;
        text-transform: uppercase
    }

    .cc-body b {
        color: #fff;
        font-size: 1.15rem;
        font-weight: 700;
        letter-spacing: .01em
    }

.cc-go {
    margin-left: auto;
    color: rgba(255,255,255,.45);
    transition: transform .3s ease,color .3s ease
}

.cta-card:hover .cc-go {
    transform: translateX(5px);
    color: #ffb606
}

.cta-or {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 6px
}

    .cta-or i {
        flex: 1;
        height: 1px;
        background: linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent)
    }

    .cta-or span {
        color: rgba(255,255,255,.5);
        font-size: .8rem;
        font-weight: 700;
        letter-spacing: .18em;
        text-transform: uppercase
    }

/* entrance */
.dssa-cta-item {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity .85s cubic-bezier(.22,1,.36,1),transform .85s cubic-bezier(.22,1,.36,1)
}

.dssa-cta-in .dssa-cta-item {
    opacity: 1;
    transform: none
}

    .dssa-cta-in .dssa-cta-item:nth-child(1) {
        transition-delay: .05s
    }

.dssa-cta-in .cta-cards .dssa-cta-item:nth-child(1) {
    transition-delay: .2s
}

.dssa-cta-in .cta-cards .dssa-cta-item:nth-child(2) {
    transition-delay: .34s
}

.dssa-cta-in .cta-cards .dssa-cta-item:nth-child(3) {
    transition-delay: .46s
}

@media (max-width:900px) {
    .cta-shell {
        padding: 44px 26px
    }

    .cta-grid {
        grid-template-columns: 1fr;
        gap: 36px;
        text-align: center
    }

    .cta-sub {
        margin-left: auto;
        margin-right: auto
    }

    .cta-cards {
        max-width: 460px;
        margin: 0 auto;
        width: 100%
    }

    .cta-card {
        text-align: left
    }
}

@media (prefers-reduced-motion: reduce) {
    .dssa-cta-item {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important
    }

    .cta-glow {
        animation: none !important
    }
}

/* ==== dssa-dropdown-fix ==== */
.mainmenu li.menu-item-has-children,
.mainmenu li.dropdown {
    position: relative
}

    /* the dropdown panel: flush under the item, generous but invisible bridge above it */
    .mainmenu li.dropdown > .edublink-dropdown-menu,
    li.menu-item-has-children > .edublink-dropdown-menu {
        top: 100% !important;
        margin-top: 0 !important;
        /* grace period: waits .35s before hiding, so an imperfect mouse path survives */
        transition: opacity .22s ease .35s, visibility 0s linear .57s, transform .22s ease .35s;
    }

        .mainmenu li.dropdown > .edublink-dropdown-menu::before,
        li.menu-item-has-children > .edublink-dropdown-menu::before {
            content: "";
            position: absolute;
            left: -12px;
            right: -12px;
            top: -26px;
            height: 26px;
            background: transparent;
        }
    /* open instantly (no delay) while hovering the item OR the panel itself */
    .mainmenu li.dropdown:hover > .edublink-dropdown-menu,
    li.menu-item-has-children:hover > .edublink-dropdown-menu,
    .edublink-dropdown-menu:hover {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none !important;
        transition-delay: 0s !important;
    }
/* comfortable hit areas inside the panel */
.edublink-dropdown-menu li a {
    display: block;
    padding: 10px 18px
}

/* ==== dssa-dropdown-v2 ==== */
/* JS decides when a dropdown is open; CSS just obeys */
li.menu-item-has-children.dssa-open > .edublink-dropdown-menu {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto !important;
    transition: none !important;
}

/* ==== dssa-rounded-sections ==== */
.dssa-rounded {
    border-radius: 26px !important;
    overflow: hidden;
    box-shadow: 0 18px 44px rgba(7,44,67,.16);
    margin-left: 22px !important;
    margin-right: 22px !important;
}

@media (max-width:767px) {
    .dssa-rounded {
        border-radius: 18px !important;
        margin-left: 10px !important;
        margin-right: 10px !important
    }
}

/* ==== dssa-snap-ux ==== */
@media (max-width:767px) {
    /* show a peek of the next card so swiping is obvious */
    html body .dssa-snap > * {
        flex: 0 0 88% !important;
        width: 88% !important;
        min-width: 88% !important;
        max-width: 88% !important;
    }

    .dssa-snap {
        scroll-padding-left: 14px
    }
}

.dssa-snap-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin: 16px 0 6px
}

    .dssa-snap-dots button {
        width: 8px;
        height: 8px;
        border-radius: 20px;
        border: 0;
        padding: 0;
        cursor: pointer;
        background: #c3cfd6;
        transition: all .3s ease;
    }

        .dssa-snap-dots button.dssa-dot-on {
            width: 26px;
            background: linear-gradient(90deg,#bf9445,#ffb606)
        }

@media (min-width:768px) {
    .dssa-snap-dots {
        display: none
    }
}

/* ==== dssa-tile-stretch ==== */
/* tiles must FILL their grid cells at every width */
@media (min-width:992px) {
    html body .dssa-tiles-row {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 24px !important;
        justify-content: center !important;
        align-items: stretch !important
    }

        html body .dssa-tiles-row > *,
        html body .dssa-tiles-row > [class*="edublink-col-"],
        html body .dssa-tiles-row > [class*="edublink-col-"]:not(.swiper-slide) {
            flex: 0 0 calc(33.333% - 16px) !important;
            width: calc(33.333% - 16px) !important;
            max-width: calc(33.333% - 16px) !important;
            min-width: 0 !important;
            margin: 0 !important;
            padding: 0 !important;
        }

        html body .dssa-tiles-row .edublink-category-2 {
            width: 100% !important;
            max-width: 100% !important;
            min-width: 100% !important;
            height: 250px !important;
            margin: 0 !important;
        }
}

@media (min-width:768px) and (max-width:991px) {
    html body .dssa-tiles-row {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 18px !important;
        justify-content: center !important;
        align-items: stretch !important
    }

        html body .dssa-tiles-row > *,
        html body .dssa-tiles-row > [class*="edublink-col-"],
        html body .dssa-tiles-row > [class*="edublink-col-"]:not(.swiper-slide) {
            flex: 0 0 calc(50% - 9px) !important;
            width: calc(50% - 9px) !important;
            max-width: calc(50% - 9px) !important;
            min-width: 0 !important;
            margin: 0 !important;
            padding: 0 !important;
        }

        html body .dssa-tiles-row .edublink-category-2 {
            width: 100% !important;
            max-width: 100% !important;
            min-width: 100% !important;
            height: 230px !important;
            margin: 0 !important;
        }
}
/* drag affordance on snap rows */
.dssa-snap {
    cursor: grab;
    user-select: none;
    -webkit-user-select: none
}

    .dssa-snap.dssa-dragging {
        cursor: grabbing;
        scroll-snap-type: none !important;
        scroll-behavior: auto !important
    }

        .dssa-snap.dssa-dragging * {
            pointer-events: none
        }


/* ==== dssa-hero-fit-2: laptop heights - cap the crest so the buttons never clip ==== */
@media (max-height:900px) {
    #dssa-hero .dh-crest {
        max-height: 30vh;
        width: auto;
        max-width: 100%;
        object-fit: contain;
        margin-bottom: 10px
    }

    #dssa-hero .dh-title {
        font-size: clamp(2rem,3.6vw,3rem);
        margin-bottom: 8px
    }

    #dssa-hero .dh-small {
        margin-bottom: 12px
    }

    #dssa-hero .dh-cta {
        margin-bottom: 10px
    }

    #dssa-hero .dh-fig {
        height: min(58vh,480px)
    }
}

@media (max-height:800px) {
    #dssa-hero .dh-crest {
        max-height: 24vh
    }

    #dssa-hero .dh-small {
        font-size: .95rem;
        line-height: 1.55
    }

    #dssa-hero .dh-btn {
        padding: 11px 26px;
        font-size: .95rem
    }
}

/* ==== hero laptop band: text must clear the floating arrows ====
   wide screens park the arrows in the empty gutters outside the 1560px
   stage; below that the slide needs its own clearance. */
@media (min-width:1025px) and (max-width:1700px) {
    .dh-slide {
        padding-left: 112px;
        padding-right: 112px;
    }

    .dh-nav {
        width: 46px;
        height: 46px;
        font-size: 1rem;
    }

    .dh-prev { left: 18px }
    .dh-next { right: 18px }
}

/* ==== hero on touch sizes: no arrows, swipe is the gesture (home.js already handles it); the dots stay for orientation ==== */
@media (max-width:1024px) {
    .dh-nav {
        display: none !important;
    }
}

/* ==== section view-all button: gold outline pill, fills on hover ==== */
.dssa-viewall {
    display: flex;
    justify-content: center;
    margin-top: 32px;
}

.dssa-viewall-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 13px 32px;
    border-radius: 50px;
    border: 2px solid #BF9445;
    color: #BF9445;
    font-weight: 700;
    font-size: 14.5px;
    text-decoration: none;
    background: transparent;
    transition: all .3s ease;
}

    .dssa-viewall-btn:hover {
        background: linear-gradient(120deg,#ffb606,#bf9445);
        border-color: transparent;
        color: #2a2205;
        transform: translateY(-2px);
        box-shadow: 0 10px 26px rgba(255,182,6,.35);
    }