.pta-exp-page {
    background: linear-gradient(180deg, #edf3f9 0%, #edf3f9 100%);
    overflow: hidden;
}

/* ========================================
   Shared
   ======================================== */

.pta-exp-kicker,
.pta-exp-kicker-dark {
    display: inline-flex;
    align-items: center;
    padding: 0.55rem 0.95rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

.pta-exp-kicker {
    background: rgba(255, 255, 255, 0.52);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.14);
}

.pta-exp-kicker-dark {
    background: rgba(255, 184, 59, 0.10);
    color: #ffb83b;
    border: 1px solid rgba(255, 184, 59, 0.16);
}

.pta-exp-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
}

.pta-exp-btn-main,
.pta-exp-btn-ghost {
    border-radius: 999px;
    padding: 0.9rem 1.55rem;
    background: linear-gradient(135deg, var(--accent-color) 0%, #0d5c84 100%);
    color: #fff;
    font-weight: 600;
    font-size: 0.95rem;
    cursor: pointer;
    box-shadow: 0 16px 36px rgba(var(--tech-accent-rgb),0.22);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    text-decoration: none;
    display: inline-block;
}

    .pta-exp-btn-main:hover,
    .pta-exp-btn-ghost:hover {
        transform: translateY(-2px);
    }


.pta-exp-btn-ghost-dark {
    background: rgba(13, 34, 56, 0.04);
    border-color: rgba(13, 34, 56, 0.10);
    color: #17324d;
}

    .pta-exp-btn-ghost-dark:hover {
        background: #17324d;
        color: #fff;
    }

.pta-exp-manifesto,
.pta-exp-river,
.pta-exp-impact,
.pta-exp-control-room,
.pta-exp-closing {
    background: #eef3f8;
}

/* ========================================
   Hero - SVG Stage
   ======================================== */

.pta-exp-hero {
    position: relative;
    overflow: hidden;
    padding: 20px 0;
    background: radial-gradient(circle at 18% 20%, rgba(62, 122, 255, 0.18), transparent 30%), radial-gradient(circle at 82% 22%, rgba(0, 212, 255, 0.12), transparent 28%), linear-gradient(135deg, #f6f9ff 0%, #edf4ff 52%, #f8fbff 100%);
}

.pta-exp-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(540px, 700px);
    gap: 56px;
    align-items: center;
}

.pta-exp-hero-copy {
    position: relative;
    z-index: 3;
}

    .pta-exp-hero-copy h1 {
        font-size: clamp(2.5rem, 4vw, 4.7rem);
        line-height: 1.02;
        letter-spacing: -0.04em;
        font-weight: 800;
        color: #0a1633;
        margin-bottom: 18px;
        max-width: 11ch;
    }

    .pta-exp-hero-copy p {
        max-width: 620px;
        font-size: 1.05rem;
        line-height: 1.85;
        color: rgba(10, 22, 51, 0.72);
        margin-bottom: 28px;
    }

.pta-exp-hero-points {
    display: grid;
    gap: 12px;
    margin-top: 26px;
}

.pta-exp-hero-point {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-size: .95rem;
    color: rgba(10, 22, 51, 0.76);
    font-weight: 600;
}

.pta-exp-hero-point-line {
    width: 22px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #1f6bff, #59d0ff);
    flex: 0 0 auto;
}

.pta-exp-hero-stage {
    position: relative;
    min-height: 760px;
    z-index: 2;
    perspective: 1600px;
    isolation: isolate;
    --pta-device-scale: 1;
    --pta-fragment-scale: 1;
}

.pta-exp-hero-device-wrap,
.pta-fragment-card {
    position: absolute;
    backface-visibility: hidden;
    translate: 0 0;
    will-change: transform, translate, opacity, filter;
}

.pta-exp-hero-device-wrap {
    width: 360px;
    height: 1205.833px;
    top: 380px;
    left: 350px;
    right: -10px;
    bottom: -825.833px;
    z-index: 4;
    transform: translate(-44%, -50%) scale(var(--pta-device-scale));
    transform-origin: center center;
    opacity: 0;
}

.pta-exp-hero-stage.is-ready .pta-exp-hero-device-wrap {
    animation: ptaHeroDeviceWrapSettle 1.18s .16s cubic-bezier(.2, .86, .2, 1) both;
}

.pta-exp-hero-device-base,
.pta-exp-hero-device-frame,
.pta-exp-hero-device-screen,
.pta-exp-hero-device-topbar,
.pta-fragment-card img {
    display: block;
    user-select: none;
    pointer-events: none;
}

.pta-exp-hero-device-base {
    position: absolute;
    width: 360px;
    height: auto;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
    transform: translate3d(0, 180px, 0) scale(.98);
    filter: drop-shadow(0 34px 60px rgba(15, 43, 84, 0.24));
}

.pta-exp-hero-stage.is-ready .pta-exp-hero-device-base {
    animation: ptaHeroDeviceBodySplit 1.08s .24s cubic-bezier(.2, .86, .2, 1) both;
}

.pta-exp-hero-device-frame {
    position: absolute;
    width: 353px;
    height: auto;
    top: 608px;
    left: 0;
    z-index: 3;
    opacity: 0;
    transform: translate3d(0, 220px, 0) scale(.98);
    filter: drop-shadow(0 24px 46px rgba(12, 34, 56, .12));
}

.pta-exp-hero-stage.is-ready .pta-exp-hero-device-frame {
    animation: ptaHeroDeviceFrameSplit 1.12s .34s cubic-bezier(.2, .86, .2, 1) both;
}

.pta-exp-hero-device-screen {
    position: absolute;
    width: 360px;
    height: auto;
    top: 0;
    left: 0;
    z-index: 2;
    opacity: 0;
    transform: translate3d(0, 220px, 0) scale(.96);
}

.pta-exp-hero-stage.is-ready .pta-exp-hero-device-screen {
    animation: ptaHeroDeviceScreenSplit 1.22s .28s cubic-bezier(.2, .86, .2, 1) both, ptaFloatSoft 6.4s 1.95s ease-in-out infinite;
}

.pta-exp-hero-device-topbar {
    position: absolute;
    width: 92px;
    height: auto;
    top: 18px;
    left: 180px;
    z-index: 4;
    opacity: 0;
    transform: translate3d(-50%, 52px, 0) scale(.86);
}

.pta-exp-hero-stage.is-ready .pta-exp-hero-device-topbar {
    animation: ptaHeroDeviceTopbarIn .62s 1.02s cubic-bezier(.2, .86, .2, 1) both, ptaTopBarPulse 4.8s 2.2s ease-in-out infinite;
}

/* ========================================
   Hero Copy Entrance Animation
   ======================================== */

.pta-exp-hero-copy > .pta-exp-kicker,
.pta-exp-hero-copy > h1,
.pta-exp-hero-copy > p,
.pta-exp-hero-copy > .pta-exp-actions,
.pta-exp-hero-copy > .pta-exp-hero-points {
    opacity: 0;
    transform: translate3d(-42px, 0, 0);
    animation: ptaHeroCopyIn .9s cubic-bezier(.2, .8, .2, 1) forwards;
}

.pta-exp-hero-copy > .pta-exp-kicker {
    animation-delay: .06s;
}

.pta-exp-hero-copy > h1 {
    animation-delay: .16s;
}

.pta-exp-hero-copy > p {
    animation-delay: .30s;
}

.pta-exp-hero-copy > .pta-exp-actions {
    animation-delay: .46s;
}

.pta-exp-hero-copy > .pta-exp-hero-points {
    animation-delay: .60s;
}

.pta-exp-hero-point {
    opacity: 0;
    transform: translate3d(-24px, 0, 0);
    animation: ptaHeroPointIn .65s cubic-bezier(.2, .8, .2, 1) forwards;
}

    .pta-exp-hero-point:nth-child(1) {
        animation-delay: .72s;
    }

    .pta-exp-hero-point:nth-child(2) {
        animation-delay: .82s;
    }

    .pta-exp-hero-point:nth-child(3) {
        animation-delay: .92s;
    }

/* ========================================
   Fragment Hero Cards
   ======================================== */

.pta-fragment-card {
    width: 417px;
    height: 124px;
    opacity: 0;
    filter: drop-shadow(0 22px 34px rgba(11, 30, 58, 0.16));
    transform: translate3d(-280px, 0, 0) scale(var(--pta-fragment-scale));
    transform-origin: top left;
    will-change: transform, opacity;
}

    .pta-fragment-card img {
        position: absolute;
    }

.pta-fragment-card-1 {
    top: 54px;
    left: 6px;
    width: 417px;
    height: 124px;
    z-index: 6;
}

.pta-exp-hero-stage.is-ready .pta-fragment-card-1 {
    animation: ptaFragmentCardFromFarLeft .92s .18s cubic-bezier(.2, .86, .2, 1) forwards, ptaFloatCardA 6.4s 1.3s ease-in-out infinite;
}

.pta-fragment-card-2 {
    top: 184px;
    right: 2px;
    width: 409px;
    height: 124px;
    z-index: 5;
}

.pta-exp-hero-stage.is-ready .pta-fragment-card-2 {
    animation: ptaFragmentCardFromFarLeft .92s .30s cubic-bezier(.2, .86, .2, 1) forwards, ptaFloatCardB 6.8s 1.42s ease-in-out infinite;
}

.pta-fragment-card-3 {
    top: 328px;
    left: -6px;
    width: 411px;
    height: 124px;
    z-index: 5;
}

.pta-exp-hero-stage.is-ready .pta-fragment-card-3 {
    animation: ptaFragmentCardFromFarLeft .92s .42s cubic-bezier(.2, .86, .2, 1) forwards, ptaFloatCardC 7.2s 1.54s ease-in-out infinite;
}

.pta-fragment-card-4 {
    top: 380px;
    right: 10px;
    width: 408px;
    height: 124px;
    z-index: 5;
}

.pta-exp-hero-stage.is-ready .pta-fragment-card-4 {
    animation: ptaFragmentCardFromFarLeft .92s .54s cubic-bezier(.2, .86, .2, 1) forwards, ptaFloatCardD 7s 1.66s ease-in-out infinite;
}

.pta-fragment-card-5 {
    top: 637px;
    left: 68px;
    width: 402px;
    height: 105px;
    z-index: 6;
}

.pta-exp-hero-stage.is-ready .pta-fragment-card-5 {
    animation: ptaFragmentCardFromFarLeft .92s .66s cubic-bezier(.2, .86, .2, 1) forwards, ptaFloatCardE 6.5s 1.78s ease-in-out infinite;
}

.pta-fragment-body {
    left: 67px;
    top: 22px;
    width: 350px;
    height: auto;
    z-index: 1;
    transform: translateX(-20px);
    opacity: 0;
    animation: ptaPieceSlideBody .72s .18s cubic-bezier(.2, .8, .2, 1) forwards;
}

.pta-fragment-ring-outer {
    left: 0;
    top: 10px;
    width: 101px;
    height: auto;
    z-index: 2;
    transform: scale(.72);
    opacity: 0;
    animation: ptaPiecePop .52s .28s cubic-bezier(.2, .8, .2, 1) forwards;
}

.pta-fragment-ring-inner {
    left: 7px;
    top: 17px;
    width: 87px;
    height: auto;
    z-index: 3;
    transform: scale(.72);
    opacity: 0;
    animation: ptaPiecePop .52s .36s cubic-bezier(.2, .8, .2, 1) forwards;
}

.pta-fragment-icon {
    left: 28px;
    top: 37px;
    width: 48px;
    height: auto;
    z-index: 4;
    transform: scale(.65) rotate(-8deg);
    opacity: 0;
    animation: ptaPieceIconIn .52s .48s cubic-bezier(.2, .8, .2, 1) forwards;
}

.pta-fragment-icon-rating {
    width: 56px;
    left: 24px;
    top: 40px;
}

.pta-fragment-title {
    left: 147px;
    top: 28px;
    width: auto;
    max-width: 170px;
    height: auto;
    z-index: 5;
    transform: translateY(12px);
    opacity: 0;
    animation: ptaPieceFadeUp .52s .56s ease forwards;
}

.pta-fragment-desc {
    left: 147px;
    top: 46px;
    width: auto;
    max-width: 185px;
    height: auto;
    z-index: 5;
    transform: translateY(10px);
    opacity: 0;
    animation: ptaPieceFadeUp .56s .66s ease forwards;
}

.pta-fragment-digit {
    top: 35px;
    z-index: 5;
    transform: translateY(14px) scale(.85);
    opacity: 0;
    animation: ptaPieceNumberIn .44s .74s cubic-bezier(.2, .8, .2, 1) forwards;
}

.pta-fragment-digit-left {
    right: 54px;
    width: 23px;
    height: auto;
}

.pta-fragment-digit-right {
    right: 24px;
    width: 22px;
    height: auto;
}

.pta-fragment-card-1 .pta-fragment-digit-right {
    width: 13px;
    right: 28px;
}

.pta-fragment-card-5 .pta-fragment-digit-right {
    width: 22px;
    right: 24px;
}

.pta-fragment-card-5 .pta-fragment-body {
    top: 16px;
}

.pta-fragment-card-5 .pta-fragment-ring-outer {
    top: 0;
}

.pta-fragment-card-5 .pta-fragment-ring-inner {
    top: 7px;
}

.pta-fragment-card-5 .pta-fragment-icon {
    top: 40px;
}

.pta-fragment-card-5 .pta-fragment-title {
    top: 22px;
}

.pta-fragment-card-5 .pta-fragment-desc {
    top: 40px;
}

.pta-fragment-card-5 .pta-fragment-digit {
    top: 27px;
}
/* ========================================
   Manifesto
   ======================================== */

.pta-exp-manifesto {
    padding: 18px 0 20px;
}

.pta-exp-manifesto-head {
    max-width: 1080px;
    margin: 0 auto 2.2rem;
    text-align: center;
}

    .pta-exp-manifesto-head h2 {
        font-size: clamp(1.9rem, 3.4vw, 3.3rem);
        line-height: 1.18;
        font-weight: 800;
        color: #0c2238;
        margin-bottom: 0;
    }

.pta-exp-manifest-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.1rem;
}

.pta-exp-manifest-card {
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(17, 67, 131, .08);
    border-radius: 28px;
    padding: 1.7rem;
    box-shadow: 0 16px 34px rgba(12, 34, 56, .05);
    backdrop-filter: blur(10px);
    transition: transform .32s ease, box-shadow .32s ease;
}

    .pta-exp-manifest-card:hover,
    .pta-exp-manifest-card.is-hovered {
        transform: translateY(-8px);
        box-shadow: 0 24px 44px rgba(12, 34, 56, .10);
    }

    .pta-exp-manifest-card h3 {
        font-size: 1.35rem;
        font-weight: 700;
        color: #0c2238;
        margin-bottom: .7rem;
    }

    .pta-exp-manifest-card p {
        margin-bottom: 0;
        color: #5a6774;
        line-height: 1.78;
    }

/* ========================================
   River
   ======================================== */

.pta-exp-river {
    padding: 0 0 92px;
    overflow: hidden;
    background: radial-gradient(circle at 12% 12%, rgba(49, 113, 255, 0.06) 0%, rgba(49, 113, 255, 0) 28%), linear-gradient(180deg, #eef3f8 0%, #e9f0f7 100%);
}

.pta-exp-river-head {
    margin-bottom: 1.35rem;
}

    .pta-exp-river-head.container {
        max-width: 1480px;
        padding-left: 32px;
        padding-right: 32px;
    }

    .pta-exp-river-head h2 {
        font-size: clamp(1.95rem, 3vw, 3rem);
        line-height: 1.08;
        font-weight: 800;
        color: #0d2238;
        margin-bottom: 0;
        max-width: 920px;
    }

.pta-exp-river-shell {
    position: relative;
    overflow: hidden;
    padding: 16px 0 22px;
}

    .pta-exp-river-shell::before,
    .pta-exp-river-shell::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        width: 112px;
        z-index: 5;
        pointer-events: none;
    }

    .pta-exp-river-shell::before {
        left: 0;
        background: linear-gradient(to right, #eaf1f7 0%, rgba(234, 241, 247, 0) 100%);
    }

    .pta-exp-river-shell::after {
        right: 0;
        background: linear-gradient(to left, #eaf1f7 0%, rgba(234, 241, 247, 0) 100%);
    }

.pta-exp-river-track {
    display: flex;
    align-items: stretch;
    gap: 20px;
    width: max-content;
    padding: 0 32px;
    transform: translate3d(0, 0, 0);
    will-change: transform;
}

.pta-exp-screen-card {
    flex: 0 0 320px;
    width: 320px;
    min-width: 320px;
    max-width: 320px;
    display: flex;
    flex-direction: column;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(17, 67, 131, 0.10);
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 16px 34px rgba(12, 34, 56, 0.08);
    opacity: 0.82;
    filter: saturate(0.96);
    transform: translate3d(0, 0, 0) scale(0.96);
    transform-origin: center center;
    transition: transform 0.28s cubic-bezier(.2, .8, .2, 1), opacity 0.28s ease, filter 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

    .pta-exp-screen-card.is-hovered {
        opacity: 1;
        filter: saturate(1.04);
        transform: translate3d(0, -10px, 0) scale(1.03);
        border-color: rgba(49, 113, 255, 0.24);
        box-shadow: 0 28px 58px rgba(12, 34, 56, 0.20);
        z-index: 8;
    }

.pta-exp-river-shell.is-hover-paused .pta-exp-screen-card {
    opacity: 0.38;
    filter: saturate(0.86);
    transform: translate3d(0, 0, 0) scale(0.92);
    box-shadow: 0 12px 26px rgba(12, 34, 56, 0.08);
}

    .pta-exp-river-shell.is-hover-paused .pta-exp-screen-card.is-hovered {
        opacity: 1;
        filter: saturate(1.04);
        transform: translate3d(0, -10px, 0) scale(1.03);
        border-color: rgba(49, 113, 255, 0.24);
        box-shadow: 0 28px 58px rgba(12, 34, 56, 0.20);
    }

.pta-exp-screen-media {
    height: 232px;
    background: linear-gradient(180deg, #8fd8d1 0%, #bcebe5 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px;
}

    .pta-exp-screen-media img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
        display: block;
        pointer-events: none;
        user-select: none;
    }

.pta-exp-screen-copy {
    padding: 1rem 1rem 1.15rem;
    background: #ffffff;
}

    .pta-exp-screen-copy span {
        display: inline-flex;
        font-size: 0.74rem;
        font-weight: 800;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: #5b83ff;
        margin-bottom: 0.45rem;
    }

    .pta-exp-screen-copy h3 {
        margin: 0;
        font-size: 1.04rem;
        line-height: 1.32;
        font-weight: 700;
        color: #0d2238;
    }

@media (max-width: 767.98px) {
    .pta-exp-river-shell::before,
    .pta-exp-river-shell::after {
        width: 84px;
    }

    .pta-exp-screen-card {
        flex: 0 0 280px;
        width: 280px;
        min-width: 280px;
        max-width: 280px;
    }
}

/* ========================================
   Impact
   ======================================== */

.pta-exp-impact {
    padding: 0 0 96px;
}

.pta-exp-impact-box {
    background: linear-gradient(135deg, #0d2038 0%, #12355d 100%);
    border-radius: 38px;
    padding: 2.4rem;
    box-shadow: 0 28px 60px rgba(7, 26, 51, .18);
    text-align: center;
}

.pta-exp-impact-kicker {
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #8fc7ff;
    margin-bottom: .9rem;
}

.pta-exp-impact-box h2 {
    font-size: clamp(1.9rem, 3.2vw, 3.5rem);
    line-height: 1.15;
    font-weight: 800;
    color: #fff;
    margin-bottom: 0;
}

/* ========================================
   Control Room - Clean Rebuild
   Bu blok eski "Control Room" ve
   "Control Room - SVG Stage Override"
   bölümlerinin tamamının yerine geçer.
   ======================================== */

.pta-exp-control-room {
    padding: 0 0 102px;
    background: #eef3f8;
}

.pta-exp-control-grid {
    display: grid;
    grid-template-columns: .95fr 1.05fr;
    gap: 2rem;
    align-items: center;
}

.pta-exp-control-copy h2 {
    font-size: clamp(2rem, 3.1vw, 3.2rem);
    line-height: 1.12;
    font-weight: 800;
    color: #0d2238;
    margin-bottom: 1rem;
}

.pta-exp-control-copy p {
    color: #566474;
    line-height: 1.9;
    margin-bottom: 0;
}

.pta-exp-driver-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.8rem;
}

.pta-exp-driver-card {
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: 1rem;
    border-radius: 20px;
    background: #fff;
    border: 1px solid rgba(17, 67, 131, .08);
    box-shadow: 0 10px 24px rgba(12, 34, 56, .05);
    transition: transform .28s ease, box-shadow .28s ease;
}

    .pta-exp-driver-card:hover,
    .pta-exp-driver-card.is-hovered {
        transform: translateY(-4px);
        box-shadow: 0 18px 32px rgba(12, 34, 56, .10);
    }

    .pta-exp-driver-card i {
        color: #3171ff;
        font-size: 1.12rem;
    }

    .pta-exp-driver-card span {
        color: #20364d;
        font-weight: 600;
    }

/* ===== Stage ===== */

.pta-exp-control-stage {
    position: relative;
    min-height: 720px;
    border-radius: 36px;
    overflow: hidden;
    isolation: isolate;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 34px 80px rgba(7, 26, 51, 0.24);
    background: radial-gradient(circle at 18% 16%, rgba(90, 126, 255, 0.22), transparent 24%), radial-gradient(circle at 82% 22%, rgba(0, 214, 255, 0.18), transparent 26%), radial-gradient(circle at 50% 88%, rgba(255, 83, 140, 0.11), transparent 28%), linear-gradient(145deg, #071528 0%, #0c1f38 46%, #112b4d 100%);
}

    .pta-exp-control-stage::before {
        content: "";
        position: absolute;
        inset: 16px;
        border-radius: 28px;
        border: 1px solid rgba(255, 255, 255, 0.06);
        pointer-events: none;
    }

    .pta-exp-control-stage::after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: 54px;
        width: 320px;
        height: 44px;
        transform: translateX(-50%);
        background: radial-gradient(circle, rgba(0, 0, 0, 0.46) 0%, rgba(0, 0, 0, 0) 72%);
        filter: blur(12px);
        opacity: .75;
        pointer-events: none;
        z-index: 0;
    }

/* ===== Decorative Layers ===== */

.pta-exp-control-stage-blur,
.pta-exp-control-stage-grid,
.pta-exp-control-stage-line,
.pta-exp-control-orbit,
.pta-exp-control-status {
    position: absolute;
}

.pta-exp-control-stage-blur {
    border-radius: 999px;
    filter: blur(20px);
    opacity: .54;
    pointer-events: none;
}

.pta-exp-control-stage-blur-a {
    width: 180px;
    height: 180px;
    left: 56px;
    top: 82px;
    background: rgba(86, 133, 255, 0.34);
    animation: ptaControlAuraA 7s ease-in-out infinite;
}

.pta-exp-control-stage-blur-b {
    width: 210px;
    height: 210px;
    right: 40px;
    bottom: 80px;
    background: rgba(0, 217, 255, 0.24);
    animation: ptaControlAuraB 8s ease-in-out infinite;
}

.pta-exp-control-stage-grid {
    inset: 0;
    opacity: .22;
    pointer-events: none;
    background-image: linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
    background-size: 36px 36px;
    mask-image: radial-gradient(circle at center, rgba(0, 0, 0, 1) 42%, rgba(0, 0, 0, 0) 88%);
}

.pta-exp-control-stage-line {
    height: 1px;
    opacity: .48;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(110,185,255,.72) 50%, rgba(255,255,255,0) 100%);
}

.pta-exp-control-stage-line-a {
    left: 64px;
    right: 64px;
    top: 162px;
    animation: ptaControlScanLine 5.4s ease-in-out infinite;
}

.pta-exp-control-stage-line-b {
    left: 92px;
    right: 92px;
    bottom: 178px;
    animation: ptaControlScanLine 6.2s 1.1s ease-in-out infinite;
}

/* ===== Device ===== */

.pta-exp-control-device-shell {
    position: absolute;
    inset: 112px 140px 88px 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 4;
    pointer-events: none;
}

.pta-exp-control-device-glow,
.pta-exp-control-device-glow-two {
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: 999px;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.pta-exp-control-device-glow {
    width: 240px;
    height: 240px;
    background: radial-gradient(circle, rgba(80, 131, 255, 0.26) 0%, rgba(80, 131, 255, 0) 72%);
    filter: blur(12px);
    animation: ptaControlGlowPulse 4.8s ease-in-out infinite;
}

.pta-exp-control-device-glow-two {
    width: 340px;
    height: 340px;
    background: radial-gradient(circle, rgba(0, 214, 255, 0.12) 0%, rgba(0, 214, 255, 0) 76%);
    filter: blur(14px);
    animation: ptaControlGlowPulse 6.2s 1.2s ease-in-out infinite;
}

.pta-exp-control-device {
    position: relative;
    z-index: 3;
    display: block;
    width: min(100%, 250px);
    max-width: 250px;
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 34px 64px rgba(0, 0, 0, 0.30));
    opacity: 0;
    transform: translateY(32px) scale(.94);
}

.pta-exp-control-stage.is-ready .pta-exp-control-device {
    animation: ptaControlDeviceIn .9s .14s cubic-bezier(.2, .86, .2, 1) forwards, ptaControlDeviceFloat 5.8s 1.2s ease-in-out infinite;
}

/* ===== Orbit Cards ===== */

.pta-exp-control-orbit {
    z-index: 5;
    opacity: 0;
}

.pta-exp-control-orbit-ring {
    position: absolute;
    inset: -12px;
    border-radius: 28px;
    border: 1px solid rgba(114, 182, 255, 0.20);
    opacity: .38;
    animation: ptaControlRingPulse 4.2s ease-in-out infinite;
    pointer-events: none;
}

.pta-exp-control-orbit-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: .9rem;
    min-width: 230px;
    padding: 1rem 1rem 1rem .95rem;
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,.08) 100%);
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 22px 44px rgba(0, 0, 0, .16);
    backdrop-filter: blur(16px);
}

.pta-exp-control-orbit-icon {
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(145deg, rgba(114, 182, 255, 0.30), rgba(255,255,255,0.08));
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}

    .pta-exp-control-orbit-icon img {
        width: 26px;
        height: 26px;
        object-fit: contain;
        display: block;
        filter: drop-shadow(0 0 12px rgba(255,255,255,.24));
    }

.pta-exp-control-orbit-icon-fallback i {
    color: #ffffff;
    font-size: 1.35rem;
}

.pta-exp-control-orbit-copy {
    display: grid;
    gap: .22rem;
}

    .pta-exp-control-orbit-copy strong {
        color: #ffffff;
        font-size: .98rem;
        line-height: 1.2;
        font-weight: 700;
    }

    .pta-exp-control-orbit-copy span {
        color: rgba(234, 243, 255, 0.78);
        font-size: .82rem;
        line-height: 1.45;
    }

.pta-exp-control-orbit-list {
    top: 102px;
    left: 36px;
}

.pta-exp-control-orbit-nav {
    top: 88px;
    right: 30px;
}

.pta-exp-control-orbit-check {
    right: 12px;
    bottom: 108px;
}

.pta-exp-control-orbit-chat {
    left: 30px;
    bottom: 132px;
}

.pta-exp-control-stage.is-ready .pta-exp-control-orbit-list {
    animation: ptaControlOrbitInLeft .7s .34s cubic-bezier(.2, .86, .2, 1) forwards, ptaControlFloatA 6.2s 1.15s ease-in-out infinite;
}

.pta-exp-control-stage.is-ready .pta-exp-control-orbit-nav {
    animation: ptaControlOrbitInRight .7s .46s cubic-bezier(.2, .86, .2, 1) forwards, ptaControlFloatB 6.8s 1.25s ease-in-out infinite;
}

.pta-exp-control-stage.is-ready .pta-exp-control-orbit-check {
    animation: ptaControlOrbitInRight .7s .58s cubic-bezier(.2, .86, .2, 1) forwards, ptaControlFloatC 6.4s 1.35s ease-in-out infinite;
}

.pta-exp-control-stage.is-ready .pta-exp-control-orbit-chat {
    animation: ptaControlOrbitInLeft .7s .70s cubic-bezier(.2, .86, .2, 1) forwards, ptaControlFloatD 6.6s 1.45s ease-in-out infinite;
}

/* ===== Status Pills ===== */

.pta-exp-control-status {
    display: flex;
    align-items: center;
    gap: .85rem;
    padding: .92rem 1rem;
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(8, 23, 40, .76), rgba(8, 23, 40, .56));
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 18px 36px rgba(0, 0, 0, .20);
    backdrop-filter: blur(14px);
    color: #ffffff;
    opacity: 0;
    z-index: 6;
}

.pta-exp-control-status-top {
    top: 28px;
    left: 50%;
    transform: translateX(-50%);
    min-width: 240px;
}

.pta-exp-control-status-bottom {
    left: 50%;
    bottom: 26px;
    transform: translateX(-50%);
    min-width: 270px;
    justify-content: center;
}

.pta-exp-control-stage.is-ready .pta-exp-control-status-top {
    animation: ptaControlFadeIn .6s .82s ease forwards;
}

.pta-exp-control-stage.is-ready .pta-exp-control-status-bottom {
    animation: ptaControlFadeIn .6s .96s ease forwards;
}

.pta-exp-control-status strong {
    display: block;
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.25;
}

.pta-exp-control-status small {
    display: block;
    color: rgba(233, 243, 255, .72);
    font-size: .74rem;
    line-height: 1.35;
}

.pta-exp-control-status-dot {
    width: 12px;
    height: 12px;
    flex: 0 0 12px;
    border-radius: 999px;
    background: #35f29a;
    box-shadow: 0 0 0 0 rgba(53, 242, 154, .42);
    animation: ptaControlDotPulse 2.2s ease-in-out infinite;
}

.pta-exp-control-status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 56px;
    padding: .34rem .7rem;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(49, 113, 255, .34), rgba(90, 208, 255, .24));
    border: 1px solid rgba(255,255,255,.14);
    color: #fff;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.pta-exp-control-status-bars {
    display: inline-flex;
    align-items: flex-end;
    gap: 4px;
    height: 22px;
}

    .pta-exp-control-status-bars span {
        width: 5px;
        border-radius: 999px;
        background: linear-gradient(180deg, #6ff4ff 0%, #4f8fff 100%);
        animation: ptaControlBarWave 1.4s ease-in-out infinite;
    }

        .pta-exp-control-status-bars span:nth-child(1) {
            height: 10px;
            animation-delay: 0s;
        }

        .pta-exp-control-status-bars span:nth-child(2) {
            height: 16px;
            animation-delay: .12s;
        }

        .pta-exp-control-status-bars span:nth-child(3) {
            height: 22px;
            animation-delay: .24s;
        }

        .pta-exp-control-status-bars span:nth-child(4) {
            height: 14px;
            animation-delay: .36s;
        }

/* ========================================
   Closing
   ======================================== */

.pta-exp-closing {
    padding: 0 0 104px;
}

.pta-exp-closing-grid {
    display: grid;
    grid-template-columns: 1.08fr .92fr;
    gap: 2.8rem;
    align-items: center;
}

.pta-exp-closing-image {
    width: 100%;
    min-height: 560px;
    object-fit: cover;
    border-radius: 34px;
    box-shadow: 0 24px 52px rgba(12, 34, 56, .12);
}

.pta-exp-closing-copy h2 {
    font-size: clamp(2rem, 3vw, 3.2rem);
    line-height: 1.12;
    font-weight: 800;
    color: #0d2238;
    margin-bottom: 1rem;
}

.pta-exp-closing-copy p {
    color: #586676;
    line-height: 1.9;
    margin-bottom: 0;
}

.pta-exp-value-row {
    display: flex;
    flex-wrap: wrap;
    gap: .8rem;
    margin-top: 1.8rem;
    margin-bottom: 1.8rem;
}

.pta-exp-value-pill {
    display: inline-flex;
    align-items: center;
    padding: .9rem 1.05rem;
    border-radius: 999px;
    background: #fff;
    border: 1px solid rgba(17, 67, 131, .08);
    box-shadow: 0 10px 22px rgba(12, 34, 56, .05);
    color: #1c3550;
    font-weight: 600;
    transition: transform .32s ease, box-shadow .32s ease;
}

    .pta-exp-value-pill:hover,
    .pta-exp-value-pill.is-hovered {
        transform: translateY(-4px);
        box-shadow: 0 18px 32px rgba(12, 34, 56, .10);
    }

/* ========================================
   Keyframes
   ======================================== */

@keyframes ptaControlDeviceIn {
    0% {
        opacity: 0;
        transform: translateY(32px) scale(.94);
        filter: blur(8px) drop-shadow(0 18px 32px rgba(0, 0, 0, 0.16));
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: blur(0) drop-shadow(0 34px 64px rgba(0, 0, 0, 0.30));
    }
}

@keyframes ptaControlDeviceFloat {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
}

@keyframes ptaControlOrbitInLeft {
    0% {
        opacity: 0;
        transform: translateX(-34px) translateY(18px) scale(.92);
        filter: blur(8px);
    }

    100% {
        opacity: 1;
        transform: translateX(0) translateY(0) scale(1);
        filter: blur(0);
    }
}

@keyframes ptaControlOrbitInRight {
    0% {
        opacity: 0;
        transform: translateX(34px) translateY(18px) scale(.92);
        filter: blur(8px);
    }

    100% {
        opacity: 1;
        transform: translateX(0) translateY(0) scale(1);
        filter: blur(0);
    }
}

@keyframes ptaControlFadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes ptaControlFloatA {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
}

@keyframes ptaControlFloatB {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(10px);
    }
}

@keyframes ptaControlFloatC {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }
}

@keyframes ptaControlFloatD {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(9px);
    }
}

@keyframes ptaControlRingPulse {
    0%, 100% {
        opacity: .28;
        transform: scale(1);
    }

    50% {
        opacity: .46;
        transform: scale(1.03);
    }
}

@keyframes ptaControlDotPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(53, 242, 154, .40);
    }

    70% {
        box-shadow: 0 0 0 10px rgba(53, 242, 154, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(53, 242, 154, 0);
    }
}

@keyframes ptaControlBarWave {
    0%, 100% {
        transform: scaleY(.6);
        opacity: .68;
    }

    50% {
        transform: scaleY(1.15);
        opacity: 1;
    }
}

@keyframes ptaControlAuraA {
    0%, 100% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(12px, -10px, 0) scale(1.08);
    }
}

@keyframes ptaControlAuraB {
    0%, 100% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(-14px, 10px, 0) scale(1.06);
    }
}

@keyframes ptaControlScanLine {
    0%, 100% {
        opacity: .22;
        transform: scaleX(.92);
    }

    50% {
        opacity: .64;
        transform: scaleX(1);
    }
}

@keyframes ptaControlGlowPulse {
    0%, 100% {
        opacity: .78;
        transform: translate(-50%, -50%) scale(1);
    }

    50% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1.06);
    }
}

@keyframes ptaHeroPulse {
    0%, 100% {
        transform: scale(1);
        opacity: .9;
    }

    50% {
        transform: scale(1.08);
        opacity: 1;
    }
}

@keyframes ptaFloatSoft {
    0%, 100% {
        transform: translate3d(0, 0, 0);
    }

    50% {
        transform: translate3d(0, -8px, 0);
    }
}

@keyframes ptaTopBarPulse {
    0%, 100% {
        transform: translateX(-50%) scale(1);
        opacity: 1;
    }

    50% {
        transform: translateX(-50%) scale(1.05);
        opacity: .92;
    }
}

@keyframes ptaHeroCopyIn {
    0% {
        opacity: 0;
        transform: translate3d(-42px, 0, 0);
        filter: blur(8px);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        filter: blur(0);
    }
}

@keyframes ptaHeroPointIn {
    0% {
        opacity: 0;
        transform: translate3d(-24px, 0, 0);
    }

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

@keyframes ptaHeroDeviceWrapSettle {
    0% {
        opacity: 0;
        transform: translate(-44%, calc(-50% + 52px)) scale(calc(var(--pta-device-scale) * .90));
    }

    100% {
        opacity: 1;
        transform: translate(-44%, -50%) scale(var(--pta-device-scale));
    }
}

@keyframes ptaHeroDeviceBodySplit {
    0% {
        opacity: 0;
        transform: translate3d(0, 180px, 0) scale(.98);
    }

    55% {
        opacity: 1;
        transform: translate3d(0, 26px, 0) scale(1);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
    }
}

@keyframes ptaHeroDeviceScreenSplit {
    0% {
        opacity: 0;
        transform: translate3d(0, 220px, 0) scale(.96);
    }

    58% {
        opacity: 1;
        transform: translate3d(0, -18px, 0) scale(1.015);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
    }
}

@keyframes ptaHeroDeviceFrameSplit {
    0% {
        opacity: 0;
        transform: translate3d(0, 220px, 0) scale(.98);
    }

    58% {
        opacity: 1;
        transform: translate3d(0, 12px, 0) scale(1);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
    }
}

@keyframes ptaHeroDeviceTopbarIn {
    0% {
        opacity: 0;
        transform: translate3d(-50%, 52px, 0) scale(.86);
    }

    100% {
        opacity: 1;
        transform: translate3d(-50%, 0, 0) scale(1);
    }
}

@keyframes ptaFragmentCardFromFarLeft {
    0% {
        opacity: 0;
        transform: translate3d(-280px, 0, 0) scale(var(--pta-fragment-scale));
        filter: blur(8px) drop-shadow(0 16px 24px rgba(11, 30, 58, 0.08));
    }

    70% {
        opacity: 1;
        transform: translate3d(14px, 0, 0) scale(var(--pta-fragment-scale));
        filter: blur(0) drop-shadow(0 22px 34px rgba(11, 30, 58, 0.16));
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(var(--pta-fragment-scale));
        filter: blur(0) drop-shadow(0 22px 34px rgba(11, 30, 58, 0.16));
    }
}

@keyframes ptaPieceSlideBody {
    0% {
        opacity: 0;
        transform: translateX(-22px);
    }

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

@keyframes ptaPiecePop {
    0% {
        opacity: 0;
        transform: scale(.72);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes ptaPieceIconIn {
    0% {
        opacity: 0;
        transform: scale(.65) rotate(-8deg);
    }

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

@keyframes ptaPieceFadeUp {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }

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

@keyframes ptaPieceNumberIn {
    0% {
        opacity: 0;
        transform: translateY(14px) scale(.82);
    }

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

@keyframes ptaFloatCardA {
    0%, 100% {
        transform: translate3d(0, 0, 0) scale(var(--pta-fragment-scale));
    }

    50% {
        transform: translate3d(0, -10px, 0) scale(var(--pta-fragment-scale));
    }
}

@keyframes ptaFloatCardB {
    0%, 100% {
        transform: translate3d(0, 0, 0) scale(var(--pta-fragment-scale));
    }

    50% {
        transform: translate3d(0, 10px, 0) scale(var(--pta-fragment-scale));
    }
}

@keyframes ptaFloatCardC {
    0%, 100% {
        transform: translate3d(0, 0, 0) scale(var(--pta-fragment-scale));
    }

    50% {
        transform: translate3d(0, -8px, 0) scale(var(--pta-fragment-scale));
    }
}

@keyframes ptaFloatCardD {
    0%, 100% {
        transform: translate3d(0, 0, 0) scale(var(--pta-fragment-scale));
    }

    50% {
        transform: translate3d(0, 11px, 0) scale(var(--pta-fragment-scale));
    }
}

@keyframes ptaFloatCardE {
    0%, 100% {
        transform: translate3d(0, 0, 0) scale(var(--pta-fragment-scale));
    }

    50% {
        transform: translate3d(0, -7px, 0) scale(var(--pta-fragment-scale));
    }
}

/* ========================================
   Responsive
   ======================================== */

@media (max-width: 1399.98px) {
    .pta-exp-hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(480px, 620px);
    }

    .pta-exp-hero-stage {
        min-height: 700px;
        --pta-device-scale: .92;
        --pta-fragment-scale: .92;
    }
}

@media (max-width: 1199.98px) {
    .pta-exp-manifest-grid {
        grid-template-columns: 1fr;
    }

    .pta-exp-hero-grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .pta-exp-hero-copy h1 {
        max-width: 14ch;
    }

    .pta-exp-hero-stage {
        min-height: 760px;
        max-width: 760px;
        margin: 0 auto;
        --pta-device-scale: .86;
        --pta-fragment-scale: .82;
    }

    .pta-fragment-card-1 {
        left: 10px;
    }

    .pta-fragment-card-2 {
        right: -2px;
    }

    .pta-fragment-card-3 {
        left: 8px;
    }

    .pta-fragment-card-4 {
        right: 0;
    }

    .pta-fragment-card-5 {
        left: 70px;
    }
}

@media (max-width: 991.98px) {
    .pta-exp-hero {
        padding: 20px 0;
    }

    .pta-exp-hero-copy h1 {
        font-size: clamp(2.2rem, 7vw, 3.5rem);
        max-width: 100%;
    }

    .pta-exp-hero-copy p {
        max-width: 100%;
    }

    .pta-exp-control-grid,
    .pta-exp-closing-grid {
        grid-template-columns: 1fr;
    }

    .pta-exp-hero-stage {
        min-height: 700px;
        --pta-fragment-scale: .68;
        --pta-device-scale: 1;
    }

    .pta-exp-hero-device-wrap {
        width: 560px;
        height: 690px;
        left: 50%;
        top: 50%;
        transform: translate(-38%, -50%) scale(var(--pta-device-scale));
    }

    .pta-exp-hero-device-base {
        width: 300px;
        left: 180px;
        top: 272px;
    }

    .pta-exp-hero-device-frame {
        width: 248px;
        left: 164px;
        top: 18px;
    }

    .pta-exp-hero-device-screen {
        width: 224px;
        left: 176px;
        top: 30px;
    }

    .pta-exp-hero-device-topbar {
        width: 76px;
        left: 246px;
        top: 28px;
    }

    .pta-fragment-card-1 {
        top: 52px;
        left: 6px;
    }

    .pta-fragment-card-2 {
        top: 170px;
        right: -6px;
    }

    .pta-fragment-card-3 {
        top: 276px;
        left: 0;
    }

    .pta-fragment-card-4 {
        bottom: 102px;
        right: -6px;
    }

    .pta-fragment-card-5 {
        bottom: 6px;
        left: 38px;
    }

    .pta-exp-control-stage {
        min-height: auto;
        height: auto;
    }

    .pta-exp-control-float {
        position: static;
        width: 100%;
        max-width: 100%;
        transform: none;
        margin-top: 1rem;
    }

    .pta-exp-control-main {
        width: 100%;
    }

    .pta-exp-driver-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .pta-exp-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .pta-exp-value-row {
        flex-direction: column;
        align-items: stretch;
    }

    .pta-exp-hero-stage {
        min-height: 560px;
        --pta-fragment-scale: .54;
        --pta-device-scale: 1;
    }

    .pta-exp-hero-device-wrap {
        width: 470px;
        height: 560px;
        left: 50%;
        top: 50%;
        transform: translate(-40%, -50%) scale(var(--pta-device-scale));
    }

    .pta-exp-hero-device-base {
        width: 248px;
        left: 154px;
        top: 232px;
    }

    .pta-exp-hero-device-frame {
        width: 206px;
        left: 142px;
        top: 18px;
    }

    .pta-exp-hero-device-screen {
        width: 186px;
        left: 152px;
        top: 28px;
    }

    .pta-exp-hero-device-topbar {
        width: 62px;
        left: 210px;
        top: 24px;
    }

    .pta-fragment-card-1 {
        top: 30px;
        left: -12px;
    }

    .pta-fragment-card-2 {
        top: 120px;
        right: -20px;
    }

    .pta-fragment-card-3 {
        top: 206px;
        left: -14px;
    }

    .pta-fragment-card-4 {
        bottom: 84px;
        right: -18px;
    }

    .pta-fragment-card-5 {
        bottom: 8px;
        left: 16px;
    }

    .pta-exp-hero-gridline,
    .pta-exp-hero-glow-two {
        display: none;
    }

    .pta-exp-screen-card {
        flex: 0 0 280px;
        width: 280px;
        min-width: 280px;
        max-width: 280px;
    }
}

@media (max-width: 1199.98px) {
    .pta-exp-control-stage {
        min-height: 680px;
    }

    .pta-exp-control-device-shell {
        inset: 108px 116px 88px 116px;
    }

    .pta-exp-control-orbit-list {
        top: 96px;
        left: 22px;
    }

    .pta-exp-control-orbit-nav {
        top: 78px;
        right: 18px;
    }

    .pta-exp-control-orbit-check {
        right: 8px;
        bottom: 110px;
    }

    .pta-exp-control-orbit-chat {
        left: 18px;
        bottom: 138px;
    }
}

@media (max-width: 991.98px) {
    .pta-exp-control-grid {
        grid-template-columns: 1fr;
    }

    .pta-exp-control-stage {
        min-height: 660px;
    }

    .pta-exp-driver-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .pta-exp-control-stage {
        min-height: 560px;
        border-radius: 28px;
    }

        .pta-exp-control-stage::after {
            width: 250px;
            bottom: 40px;
        }

    .pta-exp-control-device-shell {
        inset: 106px 86px 86px 86px;
    }

    .pta-exp-control-device {
        width: min(100%, 200px);
        max-width: 200px;
    }

    .pta-exp-control-orbit-card {
        min-width: 160px;
        border-radius: 18px;
        padding: .78rem .78rem .78rem .72rem;
        gap: .7rem;
    }

    .pta-exp-control-orbit-icon {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
        border-radius: 13px;
    }

        .pta-exp-control-orbit-icon img {
            width: 22px;
            height: 22px;
        }

    .pta-exp-control-orbit-icon-fallback i {
        font-size: 1.08rem;
    }

    .pta-exp-control-orbit-copy strong {
        font-size: .82rem;
    }

    .pta-exp-control-orbit-copy span {
        font-size: .7rem;
        line-height: 1.35;
    }

    .pta-exp-control-orbit-list {
        top: 76px;
        left: 8px;
    }

    .pta-exp-control-orbit-nav {
        top: 70px;
        right: 8px;
    }

    .pta-exp-control-orbit-check {
        right: 6px;
        bottom: 118px;
    }

    .pta-exp-control-orbit-chat {
        left: 8px;
        bottom: 136px;
    }

    .pta-exp-control-status {
        gap: .65rem;
        padding: .78rem .82rem;
        border-radius: 16px;
    }

    .pta-exp-control-status-top,
    .pta-exp-control-status-bottom {
        min-width: 0;
        width: calc(100% - 40px);
    }

    .pta-exp-control-status strong {
        font-size: .8rem;
    }

    .pta-exp-control-status small {
        font-size: .68rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pta-exp-control-stage-blur,
    .pta-exp-control-stage-line,
    .pta-exp-control-device,
    .pta-exp-control-orbit,
    .pta-exp-control-orbit-ring,
    .pta-exp-control-status,
    .pta-exp-control-status-dot,
    .pta-exp-control-status-bars span,
    .pta-exp-control-device-glow,
    .pta-exp-control-device-glow-two {
        animation: none !important;
        opacity: 1 !important;
        filter: none !important;
    }

    .pta-exp-control-device,
    .pta-exp-control-orbit {
        transform: none !important;
    }
}


/* ========================================
   Reduced Motion
   ======================================== */

@media (prefers-reduced-motion: reduce) {
    .pta-exp-hero-glow,
    .pta-exp-hero-device-wrap,
    .pta-exp-hero-device-screen,
    .pta-exp-hero-device-topbar,
    .pta-exp-hero-copy > .pta-exp-kicker,
    .pta-exp-hero-copy > h1,
    .pta-exp-hero-copy > p,
    .pta-exp-hero-copy > .pta-exp-actions,
    .pta-exp-hero-copy > .pta-exp-hero-points,
    .pta-exp-hero-point,
    .pta-fragment-card,
    .pta-fragment-body,
    .pta-fragment-ring-outer,
    .pta-fragment-ring-inner,
    .pta-fragment-icon,
    .pta-fragment-title,
    .pta-fragment-desc,
    .pta-fragment-digit {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
    }
}

/* ========================================
   Hero - Fullscreen Responsive Override
   ======================================== */

.pta-exp-hero {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    min-height: 100vh;
    min-height: 100svh;
    padding: clamp(24px, 4vh, 48px) 0;
    background: radial-gradient(circle at 18% 20%, rgba(62, 122, 255, 0.18), transparent 30%), radial-gradient(circle at 82% 22%, rgba(0, 212, 255, 0.12), transparent 28%), linear-gradient(135deg, #f6f9ff 0%, #edf4ff 52%, #f8fbff 100%);
}

    .pta-exp-hero > .container {
        width: 100%;
    }

.pta-exp-hero-grid {
    min-height: calc(100svh - clamp(48px, 8vh, 96px));
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(500px, 680px);
    gap: clamp(32px, 4vw, 56px);
    align-items: center;
}

.pta-exp-hero-copy h1 {
    font-size: clamp(2.35rem, 3.8vw, 4.35rem);
    line-height: 1.02;
    letter-spacing: -0.04em;
    max-width: 11ch;
    margin-bottom: 18px;
}

.pta-exp-hero-copy p {
    max-width: 600px;
    font-size: 1rem;
    line-height: 1.8;
    margin-bottom: 24px;
}

.pta-exp-hero-points {
    gap: 10px;
    margin-top: 22px;
}

.pta-exp-hero-stage {
    position: relative;
    min-height: 690px;
    max-width: 680px;
    width: 100%;
    margin-left: auto;
    z-index: 2;
    perspective: 1600px;
    isolation: isolate;
    --pta-device-scale: .86;
    --pta-fragment-scale: .82;
}

.pta-exp-hero-device-wrap {
    width: 360px;
    height: 1205.833px;
    top: 336px;
    left: 318px;
    right: auto;
    bottom: auto;
    transform: translate(-44%, -50%) scale(var(--pta-device-scale));
}

.pta-fragment-card-1 {
    top: 34px;
    left: 14px;
    scale: 1.3;
}

.pta-fragment-card-2 {
    top: 146px;
    right: 8px;
    scale: 1.3;
}

.pta-fragment-card-3 {
    top: 264px;
    left: 10px;
    scale: 1.3;
}

.pta-fragment-card-4 {
    top: 380px;
    right: 16px;
    scale: 1.3;
}

.pta-fragment-card-5 {
    top: 530px;
    left: 68px;
    scale: 1.3;
}

/* ========================================
   Large Laptop
   ======================================== */

@media (max-width: 1399.98px) {
    .pta-exp-hero {
        padding: clamp(20px, 3.5vh, 40px) 0;
    }

    .pta-exp-hero-grid {
        min-height: calc(100svh - clamp(40px, 7vh, 80px));
        grid-template-columns: minmax(0, 1fr) minmax(460px, 610px);
        gap: 32px;
    }

    .pta-exp-hero-copy h1 {
        font-size: clamp(2.15rem, 3.5vw, 3.8rem);
        max-width: 12ch;
    }

    .pta-exp-hero-stage {
        min-height: 620px;
        max-width: 610px;
        --pta-device-scale: .76;
        --pta-fragment-scale: .72;
    }

    .pta-exp-hero-device-wrap {
        top: 304px;
        left: 286px;
    }

    .pta-fragment-card-1 {
        top: 22px;
        left: 2px;
    }

    .pta-fragment-card-2 {
        top: 118px;
        right: -2px;
    }

    .pta-fragment-card-3 {
        top: 214px;
        left: 4px;
    }

    .pta-fragment-card-4 {
        top: 342px;
        right: 6px;
    }

    .pta-fragment-card-5 {
        top: 432px;
        left: 48px;
    }
}

/* ========================================
   Short Laptop Heights
   1366x768 gibi ekranlarda hero'nun
   ilk açılışta tek ekrana sığması için
   ekstra küçültme
   ======================================== */

@media (min-width: 1200px) and (max-height: 820px) {
    .pta-exp-hero {
        padding: 18px 0 24px;
    }

    .pta-exp-hero-grid {
        min-height: calc(100svh - 42px);
        grid-template-columns: minmax(0, 1fr) minmax(430px, 560px);
        gap: 28px;
    }

    .pta-exp-hero-copy h1 {
        font-size: clamp(2rem, 3vw, 3.2rem);
        max-width: 12ch;
        margin-bottom: 14px;
    }

    .pta-exp-hero-copy p {
        font-size: .95rem;
        line-height: 1.7;
        margin-bottom: 18px;
    }

    .pta-exp-hero-points {
        gap: 8px;
        margin-top: 16px;
    }

    .pta-exp-hero-stage {
        min-height: 580px;
        max-width: 560px;
        --pta-device-scale: .70;
        --pta-fragment-scale: .67;
    }

    .pta-exp-hero-device-wrap {
        top: 286px;
        left: 262px;
    }

    .pta-fragment-card-1 {
        top: 18px;
        left: -2px;
    }

    .pta-fragment-card-2 {
        top: 102px;
        right: -6px;
    }

    .pta-fragment-card-3 {
        top: 184px;
        left: 0;
    }

    .pta-fragment-card-4 {
        top: 292px;
        right: 2px;
    }

    .pta-fragment-card-5 {
        top: 374px;
        left: 34px;
    }
}

/* ========================================
   Tablet / Small Desktop
   Buradan sonra tek kolon daha sağlıklı.
   100vh zorlamıyoruz.
   ======================================== */

@media (max-width: 1199.98px) {
    .pta-exp-hero {
        min-height: auto;
        padding: 20px 0;
    }

    .pta-exp-hero-grid {
        min-height: 0;
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .pta-exp-hero-copy h1 {
        max-width: 14ch;
    }

    .pta-exp-hero-stage {
        min-height: 760px;
        max-width: 760px;
        margin: 0 auto;
        --pta-device-scale: .86;
        --pta-fragment-scale: .82;
    }

    .pta-exp-hero-device-wrap {
        top: 380px;
        left: 350px;
    }

    .pta-fragment-card-1 {
        top: 54px;
        left: 10px;
    }

    .pta-fragment-card-2 {
        top: 184px;
        right: -2px;
    }

    .pta-fragment-card-3 {
        top: 328px;
        left: 8px;
    }

    .pta-fragment-card-4 {
        top: 514px;
        right: 0;
    }

    .pta-fragment-card-5 {
        top: 637px;
        left: 70px;
    }
}

@media (max-width: 991.98px) {
    .pta-exp-hero {
        padding: 20px 0;
    }

    .pta-exp-hero-copy h1 {
        font-size: clamp(2.2rem, 7vw, 3.5rem);
        max-width: 100%;
    }

    .pta-exp-hero-copy p {
        max-width: 100%;
    }

    .pta-exp-hero-stage {
        min-height: 700px;
        --pta-fragment-scale: .68;
        --pta-device-scale: 1;
    }

    .pta-exp-hero-device-wrap {
        width: 560px;
        height: 690px;
        left: 50%;
        top: 50%;
        transform: translate(-38%, -50%) scale(var(--pta-device-scale));
    }

    .pta-exp-hero-device-base {
        width: 300px;
        left: 180px;
        top: 272px;
    }

    .pta-exp-hero-device-frame {
        width: 248px;
        left: 164px;
        top: 18px;
    }

    .pta-exp-hero-device-screen {
        width: 224px;
        left: 176px;
        top: 30px;
    }

    .pta-exp-hero-device-topbar {
        width: 76px;
        left: 246px;
        top: 28px;
    }

    .pta-fragment-card-1 {
        top: 52px;
        left: 6px;
    }

    .pta-fragment-card-2 {
        top: 170px;
        right: -6px;
    }

    .pta-fragment-card-3 {
        top: 276px;
        left: 0;
    }

    .pta-fragment-card-4 {
        bottom: 102px;
        right: -6px;
        top: auto;
    }

    .pta-fragment-card-5 {
        bottom: 6px;
        left: 38px;
        top: auto;
    }
}

@media (max-width: 767.98px) {
    .pta-exp-hero {
        min-height: auto;
        padding: 20px 0 42px;
    }

    .pta-exp-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .pta-exp-value-row {
        flex-direction: column;
        align-items: stretch;
    }

    .pta-exp-hero-stage {
        min-height: 560px;
        --pta-fragment-scale: .54;
        --pta-device-scale: 1;
    }

    .pta-exp-hero-device-wrap {
        width: 470px;
        height: 560px;
        left: 50%;
        top: 50%;
        transform: translate(-40%, -50%) scale(var(--pta-device-scale));
    }

    .pta-exp-hero-device-base {
        width: 248px;
        left: 154px;
        top: 232px;
    }

    .pta-exp-hero-device-frame {
        width: 206px;
        left: 142px;
        top: 18px;
    }

    .pta-exp-hero-device-screen {
        width: 186px;
        left: 152px;
        top: 28px;
    }

    .pta-exp-hero-device-topbar {
        width: 62px;
        left: 210px;
        top: 24px;
    }

    .pta-fragment-card-1 {
        top: 30px;
        left: -12px;
    }

    .pta-fragment-card-2 {
        top: 120px;
        right: -20px;
    }

    .pta-fragment-card-3 {
        top: 206px;
        left: -14px;
    }

    .pta-fragment-card-4 {
        bottom: 84px;
        right: -18px;
        top: auto;
    }

    .pta-fragment-card-5 {
        bottom: 8px;
        left: 16px;
        top: auto;
    }
}

/* ========================================
   Hero - 1000px altı cihaz katman fix
   screen.svg ile v2.svg hizalama düzeltmesi
   ======================================== */

@media (max-width: 999.98px) {
    .pta-exp-hero-stage {
        min-height: 700px;
        max-width: 760px;
        margin: 0 auto;
        --pta-fragment-scale: .68;
        --pta-device-scale: 1;
    }

    .pta-exp-hero-device-wrap {
        width: 360px !important;
        height: 1205.833px !important;
        left: 50% !important;
        top: 50% !important;
        right: auto !important;
        bottom: auto !important;
        opacity: 1 !important;
        transform: translate(-50%, -50%) scale(.72) !important;
        transform-origin: center center !important;
    }

    .pta-exp-hero-stage.is-ready .pta-exp-hero-device-wrap {
        animation: none !important;
        opacity: 1 !important;
        transform: translate(-50%, -50%) scale(.72) !important;
    }

    .pta-exp-hero-device-base {
        width: 360px !important;
        left: 0 !important;
        top: 0 !important;
        z-index: 1 !important;
    }

    .pta-exp-hero-device-screen {
        width: 360px !important;
        left: 0 !important;
        top: 0 !important;
        z-index: 2 !important;
    }

    .pta-exp-hero-device-frame {
        width: 353px !important;
        left: 0 !important;
        top: 608px !important;
        z-index: 3 !important;
    }

    .pta-exp-hero-device-topbar {
        width: 92px !important;
        left: 180px !important;
        top: 18px !important;
        z-index: 4 !important;
    }

    .pta-fragment-card-1 {
        top: 52px !important;
        left: 6px !important;
    }

    .pta-fragment-card-2 {
        top: 170px !important;
        right: -6px !important;
    }

    .pta-fragment-card-3 {
        top: 276px !important;
        left: 0 !important;
    }

    .pta-fragment-card-4 {
        top: auto !important;
        bottom: 102px !important;
        right: -6px !important;
    }

    .pta-fragment-card-5 {
        top: auto !important;
        bottom: 6px !important;
        left: 38px !important;
    }
}

@media (max-width: 767.98px) {
    .pta-exp-hero-stage {
        min-height: 560px;
        --pta-fragment-scale: .54;
    }

    .pta-exp-hero-device-wrap {
        transform: translate(-50%, -50%) scale(.56) !important;
    }

    .pta-exp-hero-stage.is-ready .pta-exp-hero-device-wrap {
        transform: translate(-50%, -50%) scale(.56) !important;
    }

    .pta-fragment-card-1 {
        top: 30px !important;
        left: -12px !important;
    }

    .pta-fragment-card-2 {
        top: 120px !important;
        right: -20px !important;
    }

    .pta-fragment-card-3 {
        top: 206px !important;
        left: -14px !important;
    }

    .pta-fragment-card-4 {
        bottom: 84px !important;
        right: -18px !important;
    }

    .pta-fragment-card-5 {
        bottom: 8px !important;
        left: 16px !important;
    }
}

/* ========================================
   Hero Fragment Text - HTML Copy
   ======================================== */

.pta-fragment-copy {
    position: absolute;
    left: 147px;
    top: 26px;
    z-index: 5;
    width: 188px;
    max-width: 188px;
    opacity: 0;
    transform: translateY(10px);
    animation: ptaPieceFadeUp .56s .56s ease forwards;
    display: flex;
    flex-direction: column;
    align-items: center
}

.pta-fragment-title-text {
    margin: 0;
    color: rgb(255, 255, 255);
    font-size: 15px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -0.02em;
    text-wrap: balance;
    -webkit-font-smoothing: antialiased;
    text-rendering: geometricPrecision;
    transform: scale(1.18);
}

.pta-fragment-desc-text {
    margin: 6px 0 0;
    color: #ffffff;
    font-size: 12px;
    line-height: 1.35;
    font-weight: 600;
    -webkit-font-smoothing: antialiased;
    text-rendering: geometricPrecision;
}

.pta-fragment-card-5 .pta-fragment-copy {
    top: 20px;
}

.pta-fragment-card-5 .pta-fragment-desc-text {
    margin-top: 5px;
}

@media (max-width: 1199.98px) {
    .pta-fragment-copy {
        width: 182px;
        max-width: 182px;
    }
}

@media (max-width: 991.98px) {
    .pta-fragment-title-text {
        font-size: 14px;
    }

    .pta-fragment-desc-text {
        font-size: 10px;
    }
}

@media (max-width: 767.98px) {
    .pta-fragment-copy {
        width: 176px;
        max-width: 176px;
    }

    .pta-fragment-title-text {
        font-size: 13px;
    }

    .pta-fragment-desc-text {
        font-size: 9.5px;
    }
}

.pta-exp-river-head.container {
    max-width: 1640px;
    padding-left: 36px;
    padding-right: 36px;
}

.pta-exp-river-shell::before,
.pta-exp-river-shell::after {
    width: 132px;
}

.pta-exp-river-track {
    gap: 24px;
    padding: 0 40px;
}

.pta-exp-screen-card {
    flex: 0 0 420px;
    width: 420px;
    min-width: 420px;
    max-width: 420px;
    border-radius: 30px;
    opacity: 0.88;
    transform: translate3d(0, 0, 0) scale(0.975);
}

    .pta-exp-screen-card.is-hovered {
        transform: translate3d(0, -10px, 0) scale(1.02);
    }

.pta-exp-river-shell.is-hover-paused .pta-exp-screen-card {
    transform: translate3d(0, 0, 0) scale(0.94);
}

.pta-exp-screen-media {
    height: 320px;
    padding: 18px;
}

.pta-exp-screen-copy {
    padding: 1.1rem 1.15rem 1.3rem;
}

    .pta-exp-screen-copy span {
        font-size: 0.78rem;
        margin-bottom: 0.55rem;
    }

    .pta-exp-screen-copy h3 {
        font-size: 1.16rem;
        line-height: 1.42;
    }

@media (max-width: 991.98px) {
    .pta-exp-screen-card {
        flex: 0 0 360px;
        width: 360px;
        min-width: 360px;
        max-width: 360px;
    }

    .pta-exp-screen-media {
        height: 290px;
    }
}

@media (max-width: 767.98px) {
    .pta-exp-river-shell::before,
    .pta-exp-river-shell::after {
        width: 84px;
    }

    .pta-exp-river-track {
        gap: 18px;
        padding: 0 22px;
    }

    .pta-exp-screen-card {
        flex: 0 0 320px;
        width: 320px;
        min-width: 320px;
        max-width: 320px;
    }

    .pta-exp-screen-media {
        height: 260px;
        padding: 14px;
    }

    .pta-exp-screen-copy h3 {
        font-size: 1.05rem;
        line-height: 1.38;
    }
}