@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");

/* keep body minimal (so this section can be embedded safely) */
/* body {
    margin: 0;
    overflow-x: hidden;
    background: url('icons/bg.jpg');
    background-size: cover;
} */

/* scope box-sizing to the component only */
.heimdal-stack-wrap,
.heimdal-stack-wrap * {
    box-sizing: border-box;
}

/* component variables (prefixed so theme vars won't override) */
.heimdal-stack-wrap {
    --hs-bg0: #03123a;
    --hs-bg2: #081f6a;
    --hs-text: #eaf1ff;
    --hs-muted: #e8eafd;
    --hs-stroke2: #9bb7ff45;

    --hs-cardW: 10.75rem;
    /* 172px */
    --hs-cardH: 16.3125rem;
    /* 261px */

    --hs-sectionMax: 83.4375rem;
    /* 1335px */

    --hs-sphereSize: 12rem;
    /* 192px */
    --hs-sphereLift: -2.5rem;
    /* -40px */

    --hs-orbitsSize: clamp(32.5rem, 92vw, 73.75rem);
    /* 520px, 1180px */
    --hs-orbitStroke: rgba(63, 144, 255, 0.16);
    --hs-orbitStroke2: rgb(155 183 255 / 12%);
    --hs-dotFill: #0065fe;
    --hs-dotGlow: rgb(127 230 255);

    --hs-peekTop: 5.625rem;
    /* 90px */
    --hs-peekBottom: 2.5rem;
    /* 40px */

    font-family: "Inter", sans-serif;
    color: var(--hs-text);
}

/* ===========================
   SECTION WRAPPER
   =========================== */
.heimdal-stack-wrap {
    position: relative;
    width: min(var(--hs-sectionMax), calc(100% - 2.5rem));
    margin: 0 auto 1.25rem;
    border-radius: 1.75rem;
    isolation: isolate;
}

/* ===========================
   GRID LAYOUT
   =========================== */
.heimdal-stack-wrap .stack-grid {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.125rem;
}

.heimdal-stack-wrap .heimdal-stack-stage {
    position: relative;
    padding-top: 0.375rem;
}

/* ===========================
   AREA 1
   =========================== */
.heimdal-stack-wrap .heimdal-stack-area1 {
    position: relative;
    z-index: 5;
    padding: 0.375rem 0.375rem 0;
}

.heimdal-stack-wrap .cards-grid {
    padding: var(--hs-peekTop) 0 var(--hs-peekBottom) 0 !important;
    display: grid;
    gap: 0.875rem;
    justify-content: center;
    align-items: stretch;
    width: 100%;
}

/* renamed from .card */
.heimdal-stack-wrap .heimdal-stack-card {
    position: relative;
    height: var(--hs-cardH);
    border-radius: 1.125rem;
    overflow: visible;
    background:
        radial-gradient(151.7% 201.26% at 50.25% 0%,
            rgba(129, 187, 255, 0.67) 0%,
            rgba(6, 62, 174, 0.7) 24.18%,
            rgba(10, 26, 102, 0.64) 42.23%,
            rgba(6, 62, 174, 0.7) 99.99%),
        #0a1a66;
}

.heimdal-stack-wrap .heimdal-stack-card .card-block {
    color: inherit;
    text-decoration: none;
    display: block;
    height: 100%;
}

/* renamed from .card-body */
.heimdal-stack-wrap .heimdal-stack-card-body {
    position: relative;
    height: 100%;
    border-radius: 1.125rem;
    overflow: hidden;
    padding: 2.1875rem 0 0.875rem;
    background:
        radial-gradient(10rem 5.625rem at 50% -10%, #2ebfff30, transparent 60%),
        /* 160px 90px */
        linear-gradient(180deg, #0d3ab040, #071a4b40);
    backdrop-filter: blur(0.375rem);
    -webkit-backdrop-filter: blur(0.375rem);
    transition: transform 0.25s ease, border-color 0.25s ease;
    border: 0.0625rem solid #8ebeff61;
    box-shadow: 0 0.5rem 0.9rem 0 rgba(1, 22, 55, 0.62);
}


/* renamed from .ico */
.heimdal-stack-wrap .heimdal-stack-card-ico {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, -57%);
    z-index: 5;
}

.heimdal-stack-wrap .heimdal-stack-card-ico img {
    width: 5.375rem;
    display: block;
}

.heimdal-stack-wrap .heimdal-stack-card h4 {
    margin: 0;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--hs-muted);
    border-bottom: 0.0625rem solid #e8eafd26;
    padding: 0 0.875rem 0.625rem;
}

.heimdal-stack-wrap .heimdal-stack-card ul {
    margin: 0;
    padding: 0.875rem 1.5rem;
    color: var(--hs-muted);
    font-size: 0.6875rem;
    line-height: 1.45;
    font-weight: 600;
    list-style: none;
}

.heimdal-stack-wrap .heimdal-stack-card li {
    margin-bottom: 0.8125rem;
    position: relative;
    transition: transform 0.25s ease;
    padding-left: initial;
}

.heimdal-stack-wrap .heimdal-stack-card li::before {
    position: absolute;
    top: 7px;
    left: -0.5rem;
    content: "";
    width: 0.187rem;
    height: 0.60rem;
    border-radius: 0.625rem;
    background: #E8EAFD;
    opacity: 0.85;
}

.heimdal-stack-wrap .heimdal-stack-card li a {
    color: #E8EAFD;
    font-weight: 500;
    transition: color 0.25s ease;
}

.heimdal-stack-wrap .heimdal-stack-card li:hover {
    transform: translateY(-3px);
}

.heimdal-stack-wrap .heimdal-stack-card li:hover a {
    color: #8EBEFF;
}

.heimdal-stack-wrap .heimdal-stack-card li:hover::before {
    background: #8EBEFF;
}

/* ===========================
   AREA 2: Center Sphere
   =========================== */
.heimdal-stack-wrap .heimdal-stack-area2 {
    position: absolute;
    left: 50%;
    top: calc(var(--hs-cardH) - var(--hs-sphereLift)) !important;
    transform: translate(-50%, 0);
    z-index: 2;
    pointer-events: none;
}

.heimdal-stack-wrap .center-sphere {
    position: relative;
    width: var(--hs-sphereSize);
    height: var(--hs-sphereSize);
    border-radius: 62.4375rem;
    display: grid;
    place-items: center;
    isolation: isolate;
    overflow: visible;
}

.heimdal-stack-wrap .sphere-inner {
    position: absolute;
    z-index: 0;
}

.heimdal-stack-wrap .sphere-inner img {
    border-radius: 50%;
    box-shadow:
        0 -0.0936rem 0.2339rem 0 rgba(0, 0, 0, 0.36) inset,
        /* -1.497px 3.743px */
        0 -0.3275rem 0.1871rem 0 rgba(0, 0, 0, 0.08) inset,
        /* -5.24px 2.994px */
        0 0.0936rem 0.2339rem 0 rgba(255, 255, 255, 0.36) inset,
        0 0.1871rem 0.9358rem 0 rgba(255, 255, 255, 0.25) inset,
        /* 14.972px */
        0 1.3569rem 3.8883rem 0 #03064b;
    width: 10.625rem;
}

/* ===========================
   AREA 3: Hero + Platforms
   =========================== */
.heimdal-stack-wrap .heimdal-stack-area3 {
    position: relative;
    z-index: 3;
    max-width: 54.6875rem;
    margin: 2.7rem auto 0;
}

.heimdal-stack-wrap .heimdal-stack-area3-hero {
    position: relative;
    text-align: center;
    z-index: 1;
}

.heimdal-stack-wrap .heimdal-stack-area3-hero img {
    width: 100%;
}

.heimdal-stack-wrap .heimdal-stack-area3-hero .stack-mid-title {
    position: absolute;
    margin: 0;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    text-shadow: 0 0.0568rem 0.1134rem #0b318a;
    font-size: 2.25rem;
    font-weight: 700;
    letter-spacing: 0.045rem;
    width: 100%;
}

.heimdal-stack-wrap .heimdal-stack-modes {
    position: relative;
    font-weight: 900;
    letter-spacing: 0.08em;
    opacity: 0.95;
    border: 0.0625rem solid #8ebeff61;
    border-top: none;
    border-radius: 0 0 1.6134rem 1.6134rem;
    box-shadow: 0 0.8067rem 1.2154rem 0 rgba(1, 22, 55, 0.62);
    max-width: 42.3125rem;
    margin: -2rem auto 0;
    z-index: 2;
}

.heimdal-stack-wrap .heimdal-stack-platform {
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 0.8125rem 0;
    width: 100%;
}

.heimdal-stack-wrap .heimdal-stack-platform a {
    display: flex;
    justify-content: center;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
}

.heimdal-stack-wrap .heimdal-stack-platform a:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 2rem;
    width: 1px;
    background: linear-gradient(180deg, #8EBEFF 0%, #0065FE 100%);
}

.heimdal-stack-wrap .heimdal-stack-platform img {
    display: block;
    height: auto;
    max-width: 100%;
    transition: transform 0.40s ease;
}

.heimdal-stack-wrap .heimdal-stack-platform img:hover {
    transform: translateY(-3px);
    filter: brightness(0) saturate(100%) invert(70%) sepia(50%) saturate(2893%) hue-rotate(191deg) brightness(112%) contrast(101%);
}

.heimdal-stack-wrap .heimdal-stack-modes-footer-title {
    padding: 0.4375rem 0 0.375rem;
    color: var(--hs-muted);
    text-align: center;
    text-shadow: 0 0.0538rem 0.1075rem rgba(11, 49, 138, 0.6);
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.3rem;
    border-radius: 0 0 1.6134rem 1.6134rem;
    box-shadow: 0 0.8067rem 1.2154rem 0 rgba(1, 22, 55, 0.62);
    background: radial-gradient(circle, rgb(1 136 254 / 77%) 0%, rgba(4, 32, 116, 1) 73%);
}

/* ===========================
   AREA 4 (row/pill renamed)
   =========================== */
.heimdal-stack-wrap .heimdal-stack-area4 {
    position: relative;
    z-index: 2;
    padding: 0.625rem 0;
}

.heimdal-stack-wrap .rows {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1.4375rem;
    padding: 0.375rem 0.125rem 0;
}

/* renamed from .row */
.heimdal-stack-wrap .heimdal-stack-row {
    position: relative;
    min-height: 2.75rem;
    display: grid;
    align-items: center;
    column-gap: 0.875rem;
    grid-template-columns: 1fr minmax(0, max-content) 1fr;
}

/* renamed from .label */
.heimdal-stack-wrap .heimdal-stack-label {
    grid-column: 1;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.625rem;
    color: var(--hs-muted);
    font-weight: 700;
    font-size: 0.875rem;
    white-space: nowrap;
}

.heimdal-stack-wrap .heimdal-stack-label::before {
    content: "";
    width: 0.1875rem;
    height: 1rem;
    background: #E8EAFD;
    opacity: 0.85;
}

.heimdal-stack-wrap .heimdal-stack-label::after {
    content: "";
    flex: 1;
    height: 0.0625rem;
    margin-left: 0.875rem;
    background: linear-gradient(90deg,
            rgba(155, 183, 255, 0.65),
            rgba(155, 183, 255, 0.25),
            rgba(155, 183, 255, 0));
    opacity: 0.9;
    pointer-events: none;
}

/* renamed from .links */
.heimdal-stack-wrap .heimdal-stack-links {
    grid-column: 2;
    justify-self: center;
    display: inline-flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.625rem;
    padding: 0;
}

/* renamed from .pill */
.heimdal-stack-wrap .heimdal-stack-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.4rem 0.875rem;
    border-radius: 1.25rem;
    border: 0.0625rem solid var(--hs-stroke2);
    background: linear-gradient(180deg, #1036ad33, #071a4b33);
    text-decoration: none;
    transition: transform 0.2s ease, border-color 0.2s ease, color .40s ease;
    box-shadow: 0 0.8067rem 1.2154rem 0 rgba(1, 22, 55, 0.62);
    backdrop-filter: blur(0.375rem);
    -webkit-backdrop-filter: blur(0.375rem);
    color: var(--hs-muted);
    font-size: 0.9375rem;
    font-weight: 600;
    letter-spacing: 0.01875rem;
    overflow: hidden;
}

.heimdal-stack-wrap .heimdal-stack-pill:hover {
    color: #8EBEFF;
}

.heimdal-stack-wrap .heimdal-stack-pill:hover img {
    filter: brightness(0) saturate(100%) invert(70%) sepia(50%) saturate(2893%) hue-rotate(191deg) brightness(112%) contrast(101%);
}

.heimdal-stack-wrap .heimdal-stack-logo-img {
    display: block;
}

.heimdal-stack-wrap .heimdal-stack-pill[href="#"],
.heimdal-stack-wrap span.heimdal-stack-pill__label a[href="#"] {
    cursor: default;
}

.heimdal-stack-wrap .heimdal-stack-pill[href="#"]:hover img {
    filter: none;
}

.heimdal-stack-wrap .heimdal-stack-pill[href="#"]:hover,
.heimdal-stack-wrap span.heimdal-stack-pill__label a[href="#"]:hover {
    color: var(--hs-muted);
}

/* ===========================
   ORBITS (scoped)
   =========================== */
.heimdal-stack-wrap .orbits {
    position: absolute;
    left: 50%;
    top: 50%;
    width: var(--hs-orbitsSize);
    height: var(--hs-orbitsSize);
    transform: translate(-50%, -50%);
    z-index: -1;
    pointer-events: none;
    opacity: 0.95;
}

.heimdal-stack-wrap .orbits-svg {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    inset: 0;
}

.heimdal-stack-wrap .orbits::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%) translateY(-4%);
    bottom: 0;
    width: 70%;
    height: 100%;
    background: url("/wp-content/themes/heimdal/img/redesign-v4/stack-icons-v3/end-lines.svg") no-repeat center bottom;
    background-size: 100% auto;
    pointer-events: none;
    z-index: 5;
}

.heimdal-stack-wrap .ring {
    fill: none;
    stroke: var(--hs-orbitStroke);
    stroke-width: 0.125rem;
    vector-effect: non-scaling-stroke;
}

.heimdal-stack-wrap .r2,
.heimdal-stack-wrap .r4,
.heimdal-stack-wrap .r6,
.heimdal-stack-wrap .r8 {
    stroke: var(--hs-orbitStroke2);
}

.heimdal-stack-wrap .rings {
    filter: drop-shadow(0 0.625rem 1.75rem rgba(0, 0, 0, 0.25));
}

.heimdal-stack-wrap .dot {
    fill: var(--hs-dotFill);
    filter: drop-shadow(0 0 0.625rem var(--hs-dotGlow)) drop-shadow(0 0 1.5rem rgba(127, 230, 255, 0.25));
    opacity: 0.95;
}

.heimdal-stack-wrap .d1b {
    opacity: 0.65;
}

.heimdal-stack-wrap .d6,
.heimdal-stack-wrap .d8 {
    opacity: 0.85;
}

.heimdal-stack-wrap span.heimdal-stack-pill__label a {
    color: #E8EAFD;
    transition: color .40s ease;
}

.heimdal-stack-wrap span.heimdal-stack-pill__label a[href]:not([href="#"]):hover {
    color: #8EBEFF;
}

@media (prefers-reduced-motion: reduce) {
    .heimdal-stack-wrap .dot animateMotion {
        display: none;
    }
}

/* ===========================
   CAROUSEL
   =========================== */
.heimdal-stack-wrap .heimdal-stack-cards-carousel {
    --gap: 0.875rem;
    --perView: 7;
    --arrowSize: 2.625rem;
    --viewportW: 80.5rem;

    position: relative;
    width: 100%;
}

/* arrows display rules */
.heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-arrow {
    display: none;
}

@media (max-width: 80rem) {

    /* 1280px */
    .heimdal-stack-wrap .heimdal-stack-cards-carousel {
        --perView: 5;
        --viewportW: 57.25rem;
    }

    .heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-arrow {
        display: block;
    }
}

@media (max-width: 61.25rem) {

    /* 980px */
    .heimdal-stack-wrap .heimdal-stack-cards-carousel {
        --perView: 3;
        --viewportW: 34rem;
        /* 544px */
    }
}

@media (max-width: 38.3125rem) {

    /* 613px */
    .heimdal-stack-wrap .heimdal-stack-cards-carousel {
        --perView: 1;
        --gap: 2.5rem;
        --viewportW: 100%;
    }
}

.heimdal-stack-wrap .heimdal-stack-cards-carousel .carousel-viewport {
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    padding: var(--hs-peekTop) 0 var(--hs-peekBottom) 0;
    scrollbar-width: none;
    width: 100%;
    max-width: min(100%, var(--viewportW));
    margin: 0 auto;
    scroll-snap-type: none;
}

.heimdal-stack-wrap .heimdal-stack-cards-carousel .carousel-viewport::-webkit-scrollbar {
    display: none;
}

.heimdal-stack-wrap .heimdal-stack-cards-carousel .cards-grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: var(--gap) !important;
    padding: 0 !important;
    margin: 0 !important;
    width: max-content;
    justify-content: flex-start !important;
    align-items: stretch;
}

/* fixed width items */
.heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-card {
    width: var(--hs-cardW) !important;
    flex: 0 0 var(--hs-cardW) !important;
    scroll-snap-align: start;
}

/* arrows */
.heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background: transparent;
    -webkit-backdrop-filter: blur(0.375rem);
    /* 6px */
    z-index: 20;
    transition: transform 0.15s ease, opacity 0.2s ease, border-color 0.2s ease;
    cursor: pointer;
}

.heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-arrow:hover {
    transform: translateY(-50%) scale(1.04);
}

.heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-arrow[disabled] {
    opacity: 0.35;
    cursor: not-allowed;
    transform: translateY(-50%);
}

.heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-arrow--prev {
    left: 0;
    outline: none;
}

.heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-arrow--next {
    right: 0;
    outline: none;
}

/* ===========================
   LAYERING HELPERS
   =========================== */
.heimdal-stack-wrap .heimdal-stack-area2-orbits {
    position: absolute;
    left: 50%;
    top: 5.625rem !important;
    transform: translateX(-50%);
    z-index: 1;
    pointer-events: none;
}

.heimdal-stack-wrap .heimdal-stack-area2-sphere {
    position: absolute;
    left: 50%;
    top: calc(var(--hs-cardH) - var(--hs-sphereLift));
    transform: translateX(-50%);
    z-index: 6;
    pointer-events: none;
}

.heimdal-stack-wrap .heimdal-stack-area2-orbits .orbits {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

/* ===========================
   RESPONSIVE
   =========================== */
@media (max-width: 75rem) {

    /* 1200px */
    .heimdal-stack-wrap {
        width: 100%;
        padding-top: 0;
    }
}

@media (max-width: 60.6875rem) {

    /* 971px */
    .heimdal-stack-wrap .heimdal-stack-row {
        grid-template-columns: 1fr;
        row-gap: 0.625rem;
    }

    .heimdal-stack-wrap .heimdal-stack-label::after {
        display: none;
    }

    .heimdal-stack-wrap .heimdal-stack-links {
        grid-column: auto;
        justify-self: stretch;
        max-width: 100%;
        width: 100%;
        display: flex;
        justify-content: left;
    }
}

@media (max-width: 56.25rem) {

    /* 900px */
    .heimdal-stack-wrap .heimdal-stack-modes {
        margin-top: -1.875rem;
    }
}

@media (max-width: 51.25rem) {

    /* 820px */
    .heimdal-stack-wrap {
        --hs-peekTop: 3.8125rem;
        --hs-peekBottom: 1rem;
        --hs-sphereSize: 8.0625rem;
    }

    .heimdal-stack-wrap .heimdal-stack-area2 {
        top: calc(11rem - 1.375rem);
    }

    .heimdal-stack-wrap .heimdal-stack-modes {
        max-width: 80%;
    }

    .heimdal-stack-wrap .heimdal-stack-area3-hero .stack-mid-title {
        font-size: 1.8125rem;
        max-width: 30.625rem;
    }

    .heimdal-stack-wrap .heimdal-stack-area3 {
        margin-top: 3rem;
    }

    .heimdal-stack-wrap .heimdal-stack-area2-orbits {
        top: 4.25rem !important;
    }

    .heimdal-stack-wrap .sphere-inner img {
        width: 9.125rem;
    }
}

@media (max-width: 43.75rem) {

    /* 700px */
    .heimdal-stack-wrap {
        --hs-peekTop: 3.75rem;
        --hs-peekBottom: 1.75rem;
    }

    .heimdal-stack-wrap .heimdal-stack-area2-orbits {
        top: 3.9375rem !important;
    }
}

@media (max-width: 41.25rem) {

    /* 660px */
    .heimdal-stack-wrap .heimdal-stack-area3-hero .stack-mid-title {
        max-width: 28.75rem;
    }

    .heimdal-stack-wrap .heimdal-stack-area3 {
        margin-top: 2rem;
    }

    .heimdal-stack-wrap {
        --hs-peekTop: 3.875rem;
        --hs-peekBottom: 2.3125rem;
    }

    .heimdal-stack-wrap .sphere-inner img {
        width: 8.5rem;
    }
}

@media (max-width: 38.3125rem) {

    /* 613px */
    .heimdal-stack-wrap {
        --hs-peekTop: 4.125rem;
        --hs-peekBottom: 1.5625rem;
    }

    .heimdal-stack-wrap .heimdal-stack-area3-hero .stack-mid-title {
        top: 52%;
        font-size: 1.5rem;
        max-width: 16.875rem;
        line-height: 1.7rem;
    }

    .heimdal-stack-wrap .sphere-inner img {
        width: 7.25rem;
    }

    .heimdal-stack-wrap .heimdal-stack-wrap {
        padding: 0;
    }

    /* keeping your original behavior */
    .heimdal-stack-wrap .heimdal-stack-area1 {
        padding: 0.375rem 0 0;
    }

    .heimdal-stack-wrap .heimdal-stack-area4 {
        padding: 0.625rem 0.625rem;
    }
}

/* mobile center mode */
@media (max-width: 38.3125rem) {

    /* 613px */
    .heimdal-stack-wrap .heimdal-stack-cards-carousel .carousel-viewport {
        max-width: 100%;
        padding-left: calc((100% - var(--hs-cardW)) / 2);
        padding-right: calc((100% - var(--hs-cardW)) / 2);
        scroll-padding-left: calc((100% - var(--hs-cardW)) / 2);
        scroll-padding-right: calc((100% - var(--hs-cardW)) / 2);
        scroll-snap-type: x mandatory;
    }

    .heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-card {
        scroll-snap-align: center;
        transform: scale(0.8);
        transition: transform 280ms cubic-bezier(0.2, 0.8, 0.2, 1);
        will-change: transform;
    }

    .heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-card.is-active {
        transform: scale(1);
        z-index: 2;
    }

    .heimdal-stack-wrap {
        width: 100%;
        overflow: hidden;
    }

    .heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-arrow--prev {
        left: 27%;
    }

    .heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-arrow--next {
        right: 27%;
    }
}

@media (max-width: 32.5rem) {

    /* 520px */
    .heimdal-stack-wrap .heimdal-stack-pill {
        font-size: 0.5625rem;
    }

    .heimdal-stack-wrap .heimdal-stack-pill {
        flex: 1 1 0;
        min-width: 0;
        padding: 0.25rem 0.375rem;
        gap: 0.3125rem;
        justify-content: center;
    }

    .heimdal-stack-wrap .heimdal-stack-pill img {
        flex: 0 0 auto;
        width: 0.625rem;
    }

    .heimdal-stack-wrap .heimdal-stack-pill img.heimdal-stack-logo-img {
        width: 50%;
        padding: 0.1875rem 0;
    }

    .heimdal-stack-wrap .heimdal-stack-pill__label {
        min-width: 0;
        overflow: hidden;
    }


    .heimdal-stack-wrap .heimdal-stack-modes {
        margin-top: -1.2rem;
    }

    .heimdal-stack-wrap .orbits::after {
        transform: translateX(-50%) translateY(3%);
    }
}

@media (max-width: 30rem) {

    /* 480px */
    .heimdal-stack-wrap .sphere-inner img {
        width: 6.5rem;
    }

    .heimdal-stack-wrap .heimdal-stack-platform a img {
        width: 85%;
    }

    .heimdal-stack-wrap .heimdal-stack-area4 {
        padding-top: 2.5rem;
    }

    .heimdal-stack-wrap .heimdal-stack-area3-hero .stack-mid-title {
        font-size: 1.1875rem;
    }
}

@media (max-width: 26.875rem) {

    /* 430px */
    .heimdal-stack-wrap {
        --hs-peekTop: 4.5625rem;
        --hs-peekBottom: 1rem;
    }

    .heimdal-stack-wrap .sphere-inner img {
        width: 5.5625rem;
    }

    .heimdal-stack-wrap .heimdal-stack-area3-hero .stack-mid-title {
        font-size: 1.125rem;
    }

    .heimdal-stack-wrap .heimdal-stack-platform a img {
        width: 70%;
    }

    .heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-arrow--prev {
        left: 20%;
    }

    .heimdal-stack-wrap .heimdal-stack-cards-carousel .heimdal-stack-arrow--next {
        right: 20%;
    }
}