/* SosyalParkMedya Premium Packages V2 — iPhone-inspired refinement */
.sp-activity-v2,
.sp-packages-v2 {
    --sp-violet: #a63cff;
    --sp-purple: #6d2aff;
    --sp-ink: #08020f;
    --sp-line: rgba(190, 94, 255, .23);
    font-family: inherit;
}

.sp-activity-v2 {
    position: relative;
    z-index: 4;
    margin: 0;
    padding: 0;
    background: linear-gradient(90deg, #08020e, #1a0829 52%, #08020e);
    border-block: 1px solid rgba(190, 94, 255, .18);
    color: #fff7ff;
}

.sp-activity-v2__inner {
    min-height: 76px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 12px 20px;
}

.sp-activity-v2__avatars {
    display: flex;
    padding-left: 8px;
}

.sp-activity-v2__avatars img {
    width: 38px;
    height: 38px;
    margin-left: -8px;
    border: 2px solid #180729;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .34);
}

.sp-activity-v2__pulse {
    width: 9px;
    height: 9px;
    flex: 0 0 9px;
    border-radius: 50%;
    background: #c15cff;
    box-shadow: 0 0 0 7px rgba(193, 92, 255, .12), 0 0 22px rgba(193, 92, 255, .7);
}

.sp-activity-v2__copy {
    font-size: 14px;
    color: rgba(255, 247, 255, .67);
}

.sp-activity-v2__copy strong {
    display: inline-block;
    margin-left: 5px;
    color: #fff;
}

.sp-activity-v2__secure {
    margin-left: 10px;
    padding: 8px 12px;
    border: 1px solid rgba(190, 94, 255, .2);
    border-radius: 999px;
    color: #df9fff;
    background: rgba(117, 37, 178, .17);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .02em;
}

.sp-packages-v2 {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(72px, 7vw, 112px) 0 clamp(64px, 7vw, 104px);
    color: #fff;
    background:
        radial-gradient(circle at 10% 0%, rgba(166, 60, 255, .18), transparent 30%),
        radial-gradient(circle at 94% 12%, rgba(109, 42, 255, .17), transparent 26%),
        linear-gradient(180deg, #0a0312 0%, #11051b 100%);
}

.sp-packages-v2::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .33;
    background-image:
        linear-gradient(rgba(190, 94, 255, .07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(190, 94, 255, .07) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(to bottom, black, transparent 78%);
}

.sp-packages-v2__heading {
    max-width: 720px;
    margin: 0 auto 40px;
    text-align: center;
}

.sp-packages-v2__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 14px;
    border: 1px solid rgba(190, 94, 255, .24);
    border-radius: 999px;
    background: rgba(104, 31, 156, .13);
    color: #db93ff;
    box-shadow: 0 10px 30px rgba(125, 40, 194, .11);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.sp-packages-v2__heading h2 {
    margin: 18px 0 10px;
    color: #fff;
    font-size: clamp(32px, 4.2vw, 54px);
    font-weight: 850;
    letter-spacing: -.045em;
    line-height: 1.04;
}

.sp-packages-v2__heading p {
    margin: 0;
    color: #a995b7;
    font-size: clamp(15px, 1.6vw, 18px);
    line-height: 1.7;
}

.sp-packages-v2__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    perspective: 1200px;
}

.sp-package-card {
    --tilt-x: 0deg;
    --tilt-y: 0deg;
    --glow-x: 50%;
    --glow-y: 50%;
    position: relative;
    min-width: 0;
    min-height: 318px;
    display: flex;
    flex-direction: column;
    padding: 24px;
    overflow: hidden;
    border: 1px solid rgba(190, 94, 255, .17);
    border-radius: 25px;
    background:
        linear-gradient(145deg, rgba(34, 14, 48, .91), rgba(18, 8, 28, .88));
    box-shadow:
        0 28px 70px rgba(0, 0, 0, .34),
        0 2px 5px rgba(0, 0, 0, .24),
        inset 0 1px 0 rgba(255,255,255,.07);
    backdrop-filter: blur(20px);
    transform: translateY(0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));
    transform-style: preserve-3d;
    transition: transform .34s cubic-bezier(.2,.8,.2,1), box-shadow .34s ease, border-color .34s ease;
    will-change: transform;
}

.sp-package-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0;
    background: radial-gradient(circle at var(--glow-x) var(--glow-y), rgba(191, 73, 255, .20), transparent 39%);
    transition: opacity .28s ease;
}

.sp-package-card::after {
    content: "";
    position: absolute;
    width: 160px;
    height: 160px;
    top: -80px;
    right: -65px;
    border-radius: 50%;
    background: var(--platform-color, #a63cff);
    filter: blur(58px);
    opacity: .12;
    pointer-events: none;
}

.sp-package-card__shine {
    position: absolute;
    top: 0;
    left: 12%;
    width: 76%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(240,189,255,.54), transparent);
}

.sp-package-card__badge {
    position: absolute;
    top: 17px;
    right: 17px;
    padding: 7px 10px;
    border: 1px solid rgba(190, 94, 255, .22);
    border-radius: 999px;
    background: rgba(166, 60, 255, .12);
    color: #e5adff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.sp-package-card__top {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-right: 82px;
    transform: translateZ(18px);
}

.sp-package-card__icon {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(190, 94, 255, .19);
    border-radius: 15px;
    color: var(--platform-color, #c05cff);
    background: linear-gradient(145deg, rgba(50,20,72,.94), rgba(24,9,36,.92));
    box-shadow: 0 12px 28px rgba(0, 0, 0, .24);
    font-size: 23px;
}

.sp-package-card__platform {
    color: var(--platform-color, #d88aff);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.sp-package-card h3 {
    margin: 24px 0 10px;
    color: #fff;
    font-size: 19px;
    font-weight: 800;
    line-height: 1.35;
    transform: translateZ(15px);
}

.sp-package-card__price {
    margin-bottom: 24px;
    color: #cf77ff;
    font-size: 28px;
    font-weight: 900;
    letter-spacing: -.035em;
    transform: translateZ(17px);
}

.sp-package-card__button {
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: auto;
    padding: 0 18px;
    border: 1px solid rgba(207, 119, 255, .22);
    border-radius: 15px;
    color: #fff !important;
    background: linear-gradient(135deg, #7e2fff, #ba38ff);
    box-shadow: 0 14px 28px rgba(124, 41, 230, .25);
    font-size: 14px;
    font-weight: 800;
    text-decoration: none !important;
    transform: translateZ(23px);
    transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease, filter .25s ease;
}

.sp-package-card__button span {
    transition: transform .25s ease;
}

.sp-trust-v2 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 22px;
    perspective: 1000px;
}

.sp-trust-v2__item {
    --tilt-x: 0deg;
    --tilt-y: 0deg;
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 88px;
    padding: 17px 20px;
    border: 1px solid rgba(190, 94, 255, .16);
    border-radius: 21px;
    background: rgba(29, 11, 42, .75);
    box-shadow: 0 20px 48px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255,255,255,.06);
    backdrop-filter: blur(18px);
    transform: translateY(0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));
    transition: transform .3s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .3s ease;
}

.sp-trust-v2__icon {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(190, 94, 255, .32);
    border-radius: 15px;
    color: #d889ff;
    background: linear-gradient(145deg, #32104b, #170724);
    box-shadow: 0 13px 30px rgba(122, 35, 184, .22), 0 0 18px rgba(171, 63, 255, .09);
}

.sp-trust-v2__icon svg {
    width: 23px;
    height: 23px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sp-trust-v2__item strong,
.sp-trust-v2__item small {
    display: block;
}

.sp-trust-v2__item strong {
    color: #fff;
    font-size: 14px;
}

.sp-trust-v2__item small {
    margin-top: 3px;
    color: #ab96b8;
    font-size: 12px;
}

@media (hover:hover) and (pointer:fine) {
    .sp-package-card:hover {
        z-index: 2;
        border-color: rgba(203, 103, 255, .5);
        box-shadow: 0 36px 78px rgba(0, 0, 0, .42), 0 0 38px rgba(177, 66, 255, .16);
        transform: translateY(-8px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));
    }

    .sp-package-card:hover::before {
        opacity: 1;
    }

    .sp-package-card__button:hover {
        filter: brightness(1.08);
        box-shadow: 0 18px 38px rgba(144, 53, 241, .38), 0 0 25px rgba(202, 87, 255, .22);
        transform: translateY(-2px) translateZ(28px);
    }

    .sp-package-card__button:hover span {
        transform: translateX(4px);
    }

    .sp-trust-v2__item:hover {
        border-color: rgba(203, 103, 255, .4);
        box-shadow: 0 26px 55px rgba(0, 0, 0, .35), 0 0 29px rgba(177, 66, 255, .12);
        transform: translateY(-4px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));
    }
}

.sp-package-card__button:active {
    transform: translateY(1px) scale(.985) translateZ(18px);
}

.sp-package-card__button:focus-visible {
    outline: 3px solid rgba(220, 143, 255, .5);
    outline-offset: 4px;
}

@media (max-width: 1060px) {
    .sp-packages-v2__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .sp-activity-v2__inner { justify-content: flex-start; }
    .sp-activity-v2__secure { display: none; }
    .sp-packages-v2 { padding: 62px 0; }
    .sp-packages-v2__grid,
    .sp-trust-v2 { grid-template-columns: 1fr; }
    .sp-package-card { min-height: 286px; }
}

@media (max-width: 480px) {
    .sp-activity-v2__avatars img { width: 32px; height: 32px; }
    .sp-activity-v2__copy { font-size: 12px; }
    .sp-package-card { padding: 20px; border-radius: 22px; }
}

@media (hover:none), (pointer:coarse) {
    .sp-package-card,
    .sp-trust-v2__item { transform: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    .sp-package-card,
    .sp-package-card__button,
    .sp-trust-v2__item,
    .sp-package-card__button span { transition: none !important; transform: none !important; }
}

/* V2.1 — corrected heading, site-wide premium interaction and slow globe ambience */
.premium-theme-sp-v21 {
    --premium-neon: 190, 74, 255;
    --premium-neon-strong: #bd4aff;
}

.premium-theme-sp-v21 .premium-action-v21 {
    --tilt-x: 0deg;
    --tilt-y: 0deg;
    --glow-x: 50%;
    --glow-y: 50%;
    position: relative;
    isolation: isolate;
    transform: perspective(900px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateZ(0);
    transform-style: preserve-3d;
    will-change: transform;
    transition:
        transform .28s cubic-bezier(.2,.8,.2,1),
        border-color .28s ease,
        box-shadow .28s ease,
        filter .28s ease !important;
}

.premium-theme-sp-v21 .premium-action-v21 > *,
.premium-theme-sp-v21 .premium-action-v21:hover > *,
.premium-theme-sp-v21 .catpi-item:hover .icon,
.premium-theme-sp-v21 .catpi-item:hover .text,
.premium-theme-sp-v21 .catpi-item:hover .text * {
    opacity: 1 !important;
    visibility: visible !important;
}

.premium-theme-sp-v21 .premium-header-shell {
    box-shadow: 0 23px 62px rgba(0, 0, 0, .40), 0 0 38px rgba(169, 54, 255, .08);
}

.premium-theme-sp-v21 .premium-brand-mark {
    animation: spBrandPulseV21 5.8s ease-in-out infinite;
}

.premium-theme-sp-v21 .sp-hero__button,
.premium-theme-sp-v21 .premium-header-cta,
.premium-theme-sp-v21 .sp-package-card__button {
    overflow: visible;
}

.premium-theme-sp-v21 .sp-hero__trust > * {
    transition: transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s ease, border-color .28s ease;
}

.premium-theme-sp-v21 .sp-premium-hero .catpi-item {
    transition: transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s ease, border-color .28s ease, filter .28s ease !important;
}

.premium-theme-sp-v21 .sp-premium-hero .catpi-item,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover {
    color: inherit !important;
}

.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .text b,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .text strong {
    color: #38405e !important;
}

.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .text span,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .text small {
    color: #8790aa !important;
}

.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover {
    background: rgba(255, 255, 255, .97) !important;
    border-color: rgba(186, 70, 255, .43) !important;
    box-shadow: 0 22px 46px rgba(35, 4, 58, .24), 0 0 25px rgba(186, 70, 255, .16) !important;
}

body .sp-packages-v2 .sp-packages-v2__heading {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    float: none !important;
    clear: both !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
    width: 100% !important;
    max-width: 760px !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 auto 52px !important;
    padding: 0 18px !important;
    text-align: center !important;
    z-index: 8 !important;
}

body .sp-packages-v2 .sp-packages-v2__heading > * {
    position: static !important;
    inset: auto !important;
    float: none !important;
    transform: none !important;
    max-width: 100% !important;
}

body .sp-packages-v2 .sp-packages-v2__heading h2 {
    display: block !important;
    width: 100% !important;
    margin: 18px 0 10px !important;
    color: #fff !important;
    text-align: center !important;
    text-shadow: 0 0 30px rgba(191, 73, 255, .17);
}

body .sp-packages-v2 .sp-packages-v2__heading p {
    display: block !important;
    margin: 0 !important;
    color: #ad98bb !important;
    text-align: center !important;
}

body .sp-packages-v2 .sp-packages-v2__grid {
    position: relative !important;
    inset: auto !important;
    clear: both !important;
    transform: none !important;
    margin-top: 0 !important;
    z-index: 2 !important;
}

.premium-ambient-v21 {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    pointer-events: none;
}

.sp-premium-hero .container {
    position: relative;
    z-index: 2;
}

.premium-ambient-v21--sp .sp-orbit {
    position: absolute;
    right: 5%;
    top: 7%;
    width: min(56vw, 760px);
    aspect-ratio: 1;
    border: 1px solid rgba(211, 121, 255, .13);
    border-radius: 50%;
    box-shadow: inset 0 0 32px rgba(167, 53, 255, .05), 0 0 34px rgba(167, 53, 255, .045);
    animation: spOrbitTurnV21 38s linear infinite;
}

.premium-ambient-v21--sp .sp-orbit::before,
.premium-ambient-v21--sp .sp-orbit::after {
    content: "";
    position: absolute;
    inset: 10%;
    border: 1px solid rgba(211, 121, 255, .10);
    border-radius: 50%;
    transform: rotateX(66deg);
}

.premium-ambient-v21--sp .sp-orbit::after {
    transform: rotateY(68deg);
}

.premium-ambient-v21--sp .sp-orbit--two {
    right: 9%;
    top: 12%;
    width: min(49vw, 680px);
    opacity: .58;
    animation-direction: reverse;
    animation-duration: 51s;
}

.premium-ambient-v21--sp .sp-globe-scan {
    position: absolute;
    top: 5%;
    right: -18%;
    width: 52%;
    height: 94%;
    opacity: .22;
    background: linear-gradient(90deg, transparent 0%, rgba(196, 91, 255, .05) 38%, rgba(226, 173, 255, .30) 50%, rgba(157, 48, 255, .05) 62%, transparent 100%);
    filter: blur(10px);
    transform: skewX(-10deg);
    animation: spGlobeScanV21 23s ease-in-out infinite;
}

.premium-ambient-v21--sp .sp-star {
    position: absolute;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #e8b6ff;
    box-shadow: 0 0 6px #cb72ff, 0 0 18px rgba(195, 86, 255, .75);
    animation: spStarV21 4.8s ease-in-out infinite;
}

.premium-ambient-v21--sp .sp-star--one { right: 18%; top: 27%; }
.premium-ambient-v21--sp .sp-star--two { right: 39%; top: 62%; animation-delay: -2.4s; }

@media (hover:hover) and (pointer:fine) {
    .premium-theme-sp-v21 .premium-action-v21:hover {
        transform: perspective(900px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateY(-3px) translateZ(10px);
        filter: brightness(1.045);
        box-shadow: 0 18px 38px rgba(15, 0, 25, .33), 0 0 27px rgba(var(--premium-neon), .19);
    }

    .premium-theme-sp-v21 .sp-hero__trust > *:hover {
        transform: translateY(-3px);
        border-color: rgba(202, 90, 255, .36);
        box-shadow: 0 16px 34px rgba(12, 0, 20, .30), 0 0 24px rgba(190, 74, 255, .13);
    }
}

@keyframes spBrandPulseV21 {
    0%, 100% { box-shadow: 0 10px 28px rgba(156, 46, 255, .24); }
    50% { box-shadow: 0 12px 35px rgba(195, 73, 255, .40), 0 0 21px rgba(195, 73, 255, .15); }
}

@keyframes spOrbitTurnV21 {
    from { transform: rotate(0deg) scale(1); }
    50% { transform: rotate(180deg) scale(1.015); }
    to { transform: rotate(360deg) scale(1); }
}

@keyframes spGlobeScanV21 {
    0%, 100% { transform: translateX(0) skewX(-10deg); opacity: .08; }
    50% { transform: translateX(-88%) skewX(-10deg); opacity: .27; }
}

@keyframes spStarV21 {
    0%, 100% { opacity: .18; transform: scale(.7); }
    50% { opacity: .95; transform: scale(1.25); }
}

@media (max-width: 760px) {
    body .sp-packages-v2 .sp-packages-v2__heading {
        margin-bottom: 38px !important;
    }
    .premium-ambient-v21--sp .sp-orbit {
        right: -35%;
        top: 19%;
        width: 105vw;
        opacity: .5;
    }
    .premium-ambient-v21--sp .sp-orbit--two,
    .premium-ambient-v21--sp .sp-star--two {
        display: none;
    }
}

@media (hover:none), (pointer:coarse) {
    .premium-theme-sp-v21 .premium-action-v21 {
        transform: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .premium-theme-sp-v21 .premium-action-v21,
    .premium-theme-sp-v21 .premium-brand-mark,
    .premium-ambient-v21--sp * {
        animation: none !important;
        transition: none !important;
        transform: none !important;
    }
    .premium-ambient-v21 { display: none !important; }
}

/* V2.2 — independently rotating world, ISS orbit and dark-glass service cards */
.premium-theme-sp-v21 .sp-premium-hero .sp-hero__kicker {
    display: none !important;
}

.premium-theme-sp-v21 .sp-premium-hero {
    overflow: hidden;
}

.premium-theme-sp-v21 .sp-premium-hero .sp-hero__art {
    background-image:
        linear-gradient(90deg, #080010 0%, rgba(8, 0, 16, .97) 31%, rgba(8, 0, 16, .20) 66%, rgba(8, 0, 16, .05) 100%),
        url("sp-space-premium-v2-2.webp") !important;
    background-position: center center !important;
    background-size: cover !important;
}

.premium-ambient-v22 {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    pointer-events: none;
}

.premium-theme-sp-v21 .sp-premium-hero .container {
    position: relative;
    z-index: 3;
}

.sp-world-stage-v22 {
    position: absolute;
    top: 4%;
    right: -1%;
    width: min(55vw, 760px);
    aspect-ratio: 1;
    border-radius: 50%;
    filter: drop-shadow(0 0 28px rgba(171, 53, 255, .21));
}

.sp-world-sphere-v22 {
    position: absolute;
    inset: 7%;
    overflow: hidden;
    border: 1px solid rgba(219, 146, 255, .34);
    border-radius: 50%;
    background-color: #110020;
    background-image: url("sp-world-texture-v2-2.webp");
    background-repeat: repeat-x;
    background-position: 0 50%;
    background-size: 200% 100%;
    box-shadow:
        inset 62px 0 88px rgba(5, 0, 12, .90),
        inset -34px 0 65px rgba(207, 89, 255, .10),
        0 0 40px rgba(172, 53, 255, .18);
    animation: spWorldTurnV22 44s linear infinite;
}

.sp-world-grid-v22,
.sp-world-shade-v22 {
    position: absolute;
    inset: 7%;
    border-radius: 50%;
}

.sp-world-grid-v22 {
    opacity: .34;
    background:
        repeating-radial-gradient(ellipse at center, transparent 0 12%, rgba(220, 159, 255, .12) 12.3% 12.8%, transparent 13.1% 24%),
        repeating-linear-gradient(90deg, transparent 0 15%, rgba(214, 143, 255, .10) 15.3% 15.8%, transparent 16.1% 30%);
    mix-blend-mode: screen;
}

.sp-world-shade-v22 {
    background:
        radial-gradient(circle at 67% 34%, rgba(238, 199, 255, .18), transparent 13%),
        linear-gradient(90deg, rgba(4, 0, 10, .92), transparent 43%, rgba(185, 58, 255, .10) 75%, rgba(4, 0, 10, .62));
    box-shadow: inset 0 -28px 50px rgba(2,0,7,.70);
}

.sp-iss-orbit-v22 {
    position: absolute;
    inset: -2%;
    border: 1px solid rgba(226, 164, 255, .24);
    border-radius: 50%;
    box-shadow: inset 0 0 30px rgba(173, 52, 255, .05), 0 0 22px rgba(173, 52, 255, .08);
    transform: rotateX(68deg) rotateZ(-11deg);
    transform-style: preserve-3d;
    animation: spIssOrbitV22 28s linear infinite;
}

.sp-iss-v22 {
    position: absolute;
    top: 46%;
    right: -3.5%;
    width: clamp(48px, 5.2vw, 78px);
    color: #eee3ff;
    filter: drop-shadow(0 0 5px rgba(219, 148, 255, .94)) drop-shadow(0 0 13px rgba(169, 53, 255, .54));
    transform: rotateZ(11deg) rotateX(-68deg);
    animation: spIssCounterTurnV22 28s linear infinite;
}

.sp-iss-v22 svg {
    display: block;
    width: 100%;
    height: auto;
}

.sp-star-v22 {
    position: absolute;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #f1ceff;
    box-shadow: 0 0 7px #d982ff, 0 0 18px rgba(192, 76, 255, .82);
    animation: spStarV22 4.6s ease-in-out infinite;
}

.sp-star-v22--one { right: 13%; top: 17%; }
.sp-star-v22--two { right: 39%; top: 67%; animation-delay: -1.7s; }
.sp-star-v22--three { right: 4%; top: 54%; animation-delay: -3.1s; }

.premium-theme-sp-v21 .sp-premium-hero .catpi--list,
.premium-theme-sp-v21 .sp-premium-hero .catpi--list.catpi--hor {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 12px !important;
    padding: 14px !important;
}

.premium-theme-sp-v21 .sp-premium-hero .catpi-item,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:focus-visible {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    color: #fbf7ff !important;
    border: 1px solid rgba(194, 79, 255, .28) !important;
    border-radius: 15px !important;
    background:
        radial-gradient(circle at var(--glow-x, 18%) var(--glow-y, 0%), rgba(195, 76, 255, .20), transparent 45%),
        linear-gradient(145deg, rgba(35, 8, 53, .98), rgba(15, 2, 27, .99)) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.075), 0 12px 29px rgba(8,0,16,.38) !important;
}

.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover {
    border-color: rgba(218, 119, 255, .66) !important;
    box-shadow: 0 18px 40px rgba(8, 0, 18, .48), 0 0 27px rgba(190, 70, 255, .24), inset 0 1px 0 rgba(255,255,255,.13) !important;
}

.premium-theme-sp-v21 .sp-premium-hero .catpi-item .icon,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .icon,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item .icon i,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .icon i {
    opacity: 1 !important;
    visibility: visible !important;
    color: var(--c) !important;
    filter: none !important;
}

.premium-theme-sp-v21 .sp-premium-hero .catpi-item .icon::before,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .icon::before {
    opacity: .16 !important;
    background: var(--c) !important;
}

.premium-theme-sp-v21 .sp-premium-hero .catpi-item .text,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .text,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item .text *,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .text * {
    opacity: 1 !important;
    visibility: visible !important;
}

.premium-theme-sp-v21 .sp-premium-hero .catpi-item .text b,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item .text strong,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .text b,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .text strong {
    color: #fff !important;
}

.premium-theme-sp-v21 .sp-premium-hero .catpi-item .text span,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item .text small,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .text span,
.premium-theme-sp-v21 .sp-premium-hero .catpi-item:hover .text small {
    color: #bda8ca !important;
}

@keyframes spWorldTurnV22 {
    from { background-position: 0 50%; }
    to { background-position: -200% 50%; }
}

@keyframes spIssOrbitV22 {
    from { transform: rotateX(68deg) rotateZ(-11deg) rotate(0deg); }
    to { transform: rotateX(68deg) rotateZ(-11deg) rotate(360deg); }
}

@keyframes spIssCounterTurnV22 {
    from { transform: rotate(-0deg) rotateZ(11deg) rotateX(-68deg); }
    to { transform: rotate(-360deg) rotateZ(11deg) rotateX(-68deg); }
}

@keyframes spStarV22 {
    0%, 100% { opacity: .14; transform: scale(.66); }
    50% { opacity: .96; transform: scale(1.24); }
}

@media (max-width: 1120px) {
    .premium-theme-sp-v21 .sp-premium-hero .catpi--list,
    .premium-theme-sp-v21 .sp-premium-hero .catpi--list.catpi--hor {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .sp-world-stage-v22 {
        top: 18%;
        right: -36%;
        width: 108vw;
        opacity: .68;
    }
    .premium-theme-sp-v21 .sp-premium-hero .catpi--list,
    .premium-theme-sp-v21 .sp-premium-hero .catpi--list.catpi--hor {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 9px !important;
        padding: 9px !important;
    }
    .sp-star-v22--two,
    .sp-star-v22--three {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sp-world-sphere-v22,
    .sp-iss-orbit-v22,
    .sp-iss-v22,
    .sp-star-v22 {
        animation: none !important;
    }
}