/* RANKRIX WIDGETS PACK — May 2026 */

/* === dashboard === */
.rkx-hero--full .rkx-hero__widget {
    padding: clamp(24px, 3vw, 56px);
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    position: relative;
    overflow: hidden;
}

@media (max-width: 1023px) {
    .rkx-hero--full .rkx-hero__grid { grid-template-columns: 1fr; min-height: 0; }
    .rkx-hero--full .rkx-hero__lead { border-right: none; border-bottom: 1px solid var(--rkx-page-line); }
    .rkx-hero--full .rkx-hero__widget { aspect-ratio: 1/1; padding: 24px; }
}

.rkx-hero--full .rkx-hero__widget {
    align-items: center;
    justify-content: center;
    padding: clamp(16px, 3vh, 48px) clamp(16px, 3vw, 40px);
}

.rkx-dash {
    position: relative;
    width: 100%;
    max-width: 560px;
    background: rgba(8,10,22,0.6);
    border: 1px solid var(--rkx-page-line-strong);
    backdrop-filter: blur(16px) saturate(1.4);
    -webkit-backdrop-filter: blur(16px) saturate(1.4);
    box-shadow:
        0 30px 80px -30px rgba(0,0,0,0.7),
        0 0 0 1px rgba(255,255,255,0.04) inset,
        0 0 60px -20px rgba(29,36,202,0.35);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    font-family: 'Inter', sans-serif;
}

.rkx-dash__glow {
    position: absolute;
    top: -80px;
    right: -80px;
    width: 240px;
    height: 240px;
    background: radial-gradient(circle, rgba(29,36,202,0.35) 0%, transparent 70%);
    pointer-events: none;
    opacity: 0.7;
    z-index: 0;
}

.rkx-dash__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--rkx-page-line);
    background: rgba(255,255,255,0.02);
    position: relative;
    z-index: 1;
}

.rkx-dash__title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.rkx-dash__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #4ade80;
    box-shadow: 0 0 10px #4ade80;
    animation: rkx-pulse-dot 2.2s ease-in-out infinite;
}

.rkx-dash__title-text {
    font-family: 'Poppins', sans-serif;
    font-size: 11px;
    letter-spacing: 0.16em;
    color: #fff;
    text-transform: uppercase;
}

.rkx-dash__range {
    display: inline-flex;
    gap: 2px;
    padding: 2px;
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--rkx-page-line);
    border-radius: 1px;
}

.rkx-dash__range-btn {
    padding: 5px 10px;
    background: transparent;
    border: none;
    color: var(--rkx-page-muted);
    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    letter-spacing: 0.1em;
    cursor: pointer;
    transition: background 160ms, color 160ms;
    border-radius: 1px;
}

.rkx-dash__range-btn:hover { color: #fff; }

.rkx-dash__range-btn.is-active {
    background: rgba(29,36,202,0.85);
    color: #fff;
    box-shadow: 0 0 12px rgba(29,36,202,0.5);
}

.rkx-dash__kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border-bottom: 1px solid var(--rkx-page-line);
    position: relative;
    z-index: 1;
}

.rkx-dash__kpi {
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    border-right: 1px solid var(--rkx-page-line);
}

.rkx-dash__kpi:last-child { border-right: none; }

.rkx-dash__kpi-lbl {
    font-family: 'Poppins', sans-serif;
    font-size: 9.5px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--rkx-page-dim);
}

.rkx-dash__kpi-val {
    font-family: 'Inter', sans-serif;
    font-feature-settings: 'tnum';
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.025em;
    line-height: 1.1;
    transition: color 200ms;
}

.rkx-dash__kpi-delta {
    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    letter-spacing: 0.06em;
    color: var(--rkx-page-dim);
}

.rkx-dash__kpi-delta--pos { color: #4ade80; }

.rkx-dash__kpi-delta--neg { color: #f87171; }

.rkx-dash__chart-wrap {
    position: relative;
    padding: 6px 12px 4px;
    z-index: 1;
}

.rkx-dash__chart {
    width: 100%;
    height: clamp(140px, 22vh, 200px);
    display: block;
    cursor: crosshair;
}

.rkx-dash__line,
.rkx-dash__area {
    transition: stroke 240ms;
}

.rkx-dash__tip {
    position: absolute;
    transform: translate(-50%, calc(-100% - 14px));
    padding: 6px 10px;
    background: rgba(29,36,202,0.95);
    border: 1px solid rgba(255,255,255,0.18);
    border-radius: 1px;
    pointer-events: none;
    opacity: 0;
    transition: opacity 160ms;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 110px;
    text-align: center;
    box-shadow: 0 8px 20px -6px rgba(29,36,202,0.5);
}

.rkx-dash__tip.is-visible { opacity: 1; }

.rkx-dash__tip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 5px solid transparent;
    border-top-color: rgba(29,36,202,0.95);
}

.rkx-dash__tip-x {
    font-family: 'Poppins', sans-serif;
    font-size: 9.5px;
    letter-spacing: 0.12em;
    color: rgba(255,255,255,0.7);
    text-transform: uppercase;
}

.rkx-dash__tip-y {
    font-family: 'Inter', sans-serif;
    font-size: 12.5px;
    font-weight: 600;
    color: #fff;
    font-feature-settings: 'tnum';
}

.rkx-dash__channels {
    display: flex;
    gap: 6px;
    padding: 12px 14px;
    border-top: 1px solid var(--rkx-page-line);
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
}

.rkx-dash__chan {
    flex: 1 1 0;
    min-width: 76px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 10px;
    background: rgba(255,255,255,0.025);
    border: 1px solid var(--rkx-page-line);
    color: var(--rkx-page-muted);
    font-family: 'Inter', sans-serif;
    font-size: 11.5px;
    font-weight: 500;
    cursor: pointer;
    border-radius: 1px;
    transition: background 160ms, border-color 160ms, color 160ms, transform 200ms;
}

.rkx-dash__chan:hover {
    background: rgba(255,255,255,0.05);
    color: #fff;
    transform: translateY(-1px);
}

.rkx-dash__chan.is-active {
    background: rgba(29,36,202,0.16);
    border-color: rgba(29,36,202,0.55);
    color: #fff;
    box-shadow: 0 0 14px rgba(29,36,202,0.25);
}

.rkx-dash__chan-sw {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--c, #fff);
    box-shadow: 0 0 8px var(--c, #fff);
    flex-shrink: 0;
}

.rkx-dash__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 18px;
    border-top: 1px solid var(--rkx-page-line);
    background: rgba(255,255,255,0.015);
    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    letter-spacing: 0.08em;
    color: var(--rkx-page-dim);
    position: relative;
    z-index: 1;
}

.rkx-dash__foot-r {
    color: var(--rkx-accent-tx);
    text-decoration: none;
    transition: opacity 160ms;
}

.rkx-dash__foot-r:hover { opacity: 0.7; }

@media (max-height: 720px) and (min-width: 1024px) {
    .rkx-dash__chart { height: clamp(110px, 18vh, 160px); }
    .rkx-dash__kpi { padding: 10px 14px; }
    .rkx-dash__kpi-val { font-size: 18px; }
}

@media (max-width: 1023px) {
    .rkx-dash { max-width: min(540px, 92vw); }
}

@media (max-width: 480px) {
    .rkx-dash__channels { gap: 4px; padding: 10px; }
    .rkx-dash__chan { min-width: 0; padding: 7px 6px; font-size: 10.5px; }
    .rkx-dash__kpi-val { font-size: 17px; }
    .rkx-dash__head { padding: 12px 14px; }
}

.rkx-dash {
    max-width: 680px !important;
    transform: perspective(1400px) rotateX(var(--rkx-dash-rx, 0deg)) rotateY(var(--rkx-dash-ry, 0deg));
    transform-style: preserve-3d;
    transition: transform 280ms cubic-bezier(0.4,0,0.2,1);
}

.rkx-dash__chart {
    height: clamp(170px, 26vh, 240px) !important;
}

.rkx-dash__kpi { padding: 18px 18px !important; }

.rkx-dash__kpi-val { font-size: 24px !important; }

.rkx-hero__widget[data-anim] .rkx-dash {
    animation: rkx-dash-rise 900ms cubic-bezier(0.22, 1, 0.36, 1) 200ms backwards;
}

.rkx-dash__kpi-val.is-pulsing {
    animation: rkx-kpi-pulse 600ms cubic-bezier(0.4,0,0.2,1);
    display: inline-block;
    transform-origin: left center;
}

.rkx-dash__line {
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    animation: rkx-line-draw 1600ms cubic-bezier(0.65, 0, 0.35, 1) 600ms forwards;
}

.rkx-dash__area {
    opacity: 0;
    animation: rkx-fade-in 800ms ease-out 1600ms forwards;
}

.rkx-dash__glow {
    animation: rkx-glow-drift 9s ease-in-out infinite alternate;
}

.rkx-dash__grid line {
    animation: rkx-grid-shimmer 4.5s ease-in-out infinite;
}

.rkx-dash__grid line:nth-child(2) { animation-delay: 0.6s; }

.rkx-dash__grid line:nth-child(3) { animation-delay: 1.2s; }

.rkx-dash__sync-dot {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #4ade80;
    box-shadow: 0 0 8px #4ade80;
    margin-right: 6px;
    vertical-align: 1px;
    animation: rkx-pulse-dot 1.6s ease-in-out infinite;
}

.rkx-dash__foot-l {
    display: inline-flex;
    align-items: center;
}

.rkx-dash__foot-r {
    color: var(--rkx-page-dim) !important;
    cursor: default;
}

.rkx-dash::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg,
        transparent 30%,
        rgba(255,255,255,0.04) 50%,
        transparent 70%);
    pointer-events: none;
    transform: translateX(-100%);
    animation: rkx-dash-sheen 7s ease-in-out 2.2s infinite;
    z-index: 2;
}

.rkx-dash__range-btn.is-active {
    position: relative;
    animation: rkx-btn-pop 320ms cubic-bezier(0.34, 1.56, 0.64, 1);
}

.rkx-dash__line { transition: stroke 360ms ease; }

.rkx-dash__area { transition: opacity 360ms ease; }

@media (prefers-reduced-motion: reduce) {
    .rkx-dash,
    .rkx-dash__line,
    .rkx-dash__area,
    .rkx-dash__glow,
    .rkx-dash__grid line,
    .rkx-dash::after,
    .rkx-hero__widget[data-anim] .rkx-dash {
        animation: none !important;
    }
    .rkx-dash__line { stroke-dasharray: none; stroke-dashoffset: 0; }
    .rkx-dash__area { opacity: 1; }
}

@media (max-height: 760px) and (min-width: 1024px) {
    .rkx-dash__chart { height: clamp(140px, 20vh, 190px) !important; }
    .rkx-dash__kpi { padding: 12px 16px !important; }
    .rkx-dash__kpi-val { font-size: 20px !important; }
}

@media (max-width: 1023px) {
    .rkx-dash { max-width: min(640px, 94vw) !important; }
}

@media (min-width: 1280px) {
    .rkx-dash {
        max-width: clamp(520px, 38vw, 660px) !important;
    }
}

@media (min-width: 1920px) {
    .rkx-dash {
        max-width: 660px !important;
    }
}

@media (max-width: 1023px) {
    .rkx-section.rkx-hero--full {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
        padding-block: clamp(80px, 12vw, 120px) clamp(40px, 8vw, 70px) !important;
    }
    .rkx-hero--full .rkx-hero__grid {
        grid-template-columns: 1fr !important;
        height: auto !important;
        max-height: none !important;
    }
    .rkx-hero--full .rkx-hero__lead {
        border-right: none !important;
        border-bottom: 1px solid var(--rkx-page-line);
        padding: 0 0 clamp(28px, 5vw, 40px) !important;
    }
    .rkx-hero--full .rkx-hero__widget {
        padding: clamp(28px, 5vw, 40px) 0 0 !important;
        align-items: flex-start !important;
    }
    .rkx-hero--full .rkx-h1 {
        font-size: clamp(28px, 7.5vw, 42px) !important;
    }
    .rkx-hero--full .rkx-lede {
        font-size: 15px !important;
    }
    .rkx-dash {
        max-width: 100% !important;
        width: 100%;
    }
}

@media (max-width: 639px) {
    .rkx-section.rkx-hero--full {
        padding-block: 90px 30px !important;
    }
    .rkx-dash__head { padding: 12px 14px; flex-wrap: wrap; gap: 10px; }
    .rkx-dash__title-text { font-size: 10px; }
    .rkx-dash__range-btn { padding: 5px 8px; font-size: 9.5px; }
    .rkx-dash__kpis { grid-template-columns: 1fr 1fr 1fr; }
    .rkx-dash__kpi { padding: 12px 10px !important; }
    .rkx-dash__kpi-val { font-size: 16px !important; }
    .rkx-dash__kpi-lbl { font-size: 9px; }
    .rkx-dash__chart { height: 140px !important; }
    .rkx-dash__channels { padding: 10px; gap: 5px; }
    .rkx-dash__chan { padding: 7px 6px; font-size: 10.5px; min-width: 0; }
    .rkx-dash__chan-sw { width: 7px; height: 7px; }
    .rkx-dash__foot { padding: 10px 14px; font-size: 9.5px; }
    .rkx-dash::after { display: none; }  /* kill sheen on small screens */
}

@media (prefers-reduced-motion: reduce) {
    [data-scroll-fx] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    .rkx-bg__image { transform: none !important; }
    .rkx-dash { transform: none !important; }
    .rkx-phase-line::before { transition: none !important; }
}

/* RESP DASH 320→4K */
@media (max-width: 479px) {
    .rkx-dash__kpis { grid-template-columns: 1fr 1fr 1fr; }
    .rkx-dash__kpi { padding: 10px 8px !important; }
    .rkx-dash__kpi-val { font-size: 15px !important; }
    .rkx-dash__kpi-lbl { font-size: 8.5px; }
    .rkx-dash__kpi-delta { font-size: 9px; }
    .rkx-dash__chart { height: 130px !important; }
    .rkx-dash__head { padding: 10px 12px; flex-wrap: wrap; gap: 8px; }
    .rkx-dash__title-text { font-size: 9.5px; }
    .rkx-dash__range-btn { padding: 4px 6px; font-size: 9px; }
    .rkx-dash__channels { padding: 8px; gap: 4px; }
    .rkx-dash__chan { padding: 6px 4px; font-size: 9.5px; min-width: 0; gap: 4px; }
    .rkx-dash__chan-sw { width: 6px; height: 6px; }
    .rkx-dash__foot { padding: 8px 12px; font-size: 9px; flex-direction: column; align-items: flex-start; gap: 4px; }
    .rkx-dash::after { display: none; }
}
@media (min-width: 1920px) { .rkx-dash { max-width: 920px !important; } .rkx-dash__chart { height: 280px !important; } .rkx-dash__kpi-val { font-size: 28px !important; } }
@media (min-width: 2560px) { .rkx-dash { max-width: 1100px !important; } .rkx-dash__chart { height: 340px !important; } .rkx-dash__kpi-val { font-size: 34px !important; } .rkx-dash__head { padding: 22px 28px; } .rkx-dash__channels { padding: 18px 22px; } .rkx-dash__chan { font-size: 14px; padding: 12px 14px; } }
@media (min-width: 3840px) { .rkx-dash { max-width: 1600px !important; } .rkx-dash__chart { height: 480px !important; } .rkx-dash__kpi-val { font-size: 44px !important; } .rkx-dash__kpi { padding: 28px 32px !important; } .rkx-dash__title-text { font-size: 16px; } .rkx-dash__chan { font-size: 18px; padding: 16px 20px; } }


/* === services === */
.rkx-svc3 {
    position: relative;
    border: 1px solid var(--rkx-page-line);
    background: rgba(8,10,22,0.55);
    backdrop-filter: blur(12px) saturate(1.3);
    -webkit-backdrop-filter: blur(12px) saturate(1.3);
    overflow: hidden;
}

.rkx-svc3__nav {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-bottom: 1px solid var(--rkx-page-line);
    background: linear-gradient(180deg, rgba(255,255,255,0.02) 0%, transparent 100%);
}

.rkx-svc3__tab {
    position: relative;
    z-index: 2;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 22px 24px;
    display: flex;
    align-items: center;
    gap: 14px;
    color: rgba(255,255,255,0.55);
    transition: color 280ms ease, background 280ms ease;
    border-right: 1px solid var(--rkx-page-line);
    text-align: left;
}

.rkx-svc3__tab:last-child { border-right: none; }

.rkx-svc3__tab:hover { color: #fff; background: rgba(255,255,255,0.025); }

.rkx-svc3__tab.is-active { color: #fff; background: rgba(29,36,202,0.06); }

.rkx-svc3__tab-num {
    font-family: 'Poppins', sans-serif;
    font-size: 11px;
    letter-spacing: 0.16em;
    color: var(--rkx-accent-tx);
    flex-shrink: 0;
}

.rkx-svc3__tab-name {
    font-family: 'Inter', sans-serif;
    font-size: clamp(14px, 1.1vw, 17px);
    font-weight: 600;
    letter-spacing: -0.015em;
    line-height: 1.2;
}

.rkx-svc3__indicator {
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 33.3333%;
    height: 2px;
    background: linear-gradient(90deg, #1D24CA 0%, #818cf8 100%);
    box-shadow: 0 0 14px rgba(29,36,202,0.6);
    transition: transform 480ms cubic-bezier(0.65, 0, 0.35, 1);
    z-index: 3;
}

.rkx-svc3__nav[data-active="02"] .rkx-svc3__indicator { transform: translateX(100%); }

.rkx-svc3__nav[data-active="03"] .rkx-svc3__indicator { transform: translateX(200%); }

.rkx-svc3__stage {
    position: relative;
    min-height: 480px;
}

.rkx-svc3__panel {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: clamp(28px, 4vw, 56px);
    align-items: center;
    padding: clamp(32px, 4vw, 56px);
    opacity: 0;
    transform: translateY(20px);
    pointer-events: none;
    transition: opacity 460ms cubic-bezier(0.22,1,0.36,1), transform 520ms cubic-bezier(0.22,1,0.36,1);
}

.rkx-svc3__panel.is-active {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
    position: relative;
}

.rkx-svc3__copy { display: flex; flex-direction: column; gap: 18px; min-width: 0; }

.rkx-svc3__chip {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    align-self: flex-start;
    padding: 6px 12px;
    background: rgba(29,36,202,0.15);
    border: 1px solid rgba(29,36,202,0.4);
    color: #fff;
    font-family: 'Poppins', sans-serif;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    border-radius: 1px;
}

.rkx-svc3__chip-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #4ade80;
    box-shadow: 0 0 8px #4ade80;
    animation: rkx-pulse-dot 2.2s ease-in-out infinite;
}

.rkx-svc3__title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(22px, 2.2vw, 34px);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.12;
    color: #fff;
    margin: 0;
    text-wrap: balance;
}

.rkx-svc3__desc {
    font-size: clamp(14px, 1vw, 16px);
    line-height: 1.6;
    color: rgba(255,255,255,0.6);
    margin: 0;
    max-width: 50ch;
}

.rkx-svc3__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.rkx-svc3__pill {
    display: inline-flex;
    align-items: center;
    padding: 7px 12px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.10);
    color: rgba(255,255,255,0.85);
    font-size: 12.5px;
    font-weight: 500;
    text-decoration: none;
    border-radius: 1px;
    transition: all 200ms ease;
}

.rkx-svc3__pill:hover {
    background: rgba(29,36,202,0.18);
    border-color: rgba(29,36,202,0.55);
    color: #fff;
    transform: translateY(-1px);
}

.rkx-svc3__cta {
    margin-top: 8px;
    align-self: flex-start;
    font-family: 'Poppins', sans-serif;
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--rkx-accent-tx);
    text-decoration: none;
    transition: gap 200ms ease, opacity 200ms ease;
    display: inline-flex;
    gap: 6px;
}

.rkx-svc3__cta:hover { gap: 12px; opacity: 0.8; }

.rkx-svc3__visual {
    position: relative;
    width: 100%;
    aspect-ratio: 1.2 / 1;
    perspective: 1200px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rkx-svc3__stamp {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 10px 14px;
    background: rgba(8,10,22,0.85);
    border: 1px solid rgba(29,36,202,0.5);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 5;
}

.rkx-svc3__stamp-v {
    display: block;
    font-family: 'Inter', sans-serif;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.025em;
    color: #fff;
    line-height: 1;
}

.rkx-svc3__stamp-v small { font-size: 0.5em; color: var(--rkx-accent-tx); margin-left: 2px; }

.rkx-svc3__stamp-l {
    display: block;
    font-family: 'Poppins', sans-serif;
    font-size: 9.5px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
    margin-top: 4px;
}

.rkx-svc3__visual--build .rkx-svc3__layer {
    position: absolute;
    width: 78%;
    aspect-ratio: 1.5/1;
    border: 1px solid rgba(255,255,255,0.10);
    background: rgba(8,10,22,0.7);
    border-radius: 1px;
    transition: transform 600ms cubic-bezier(0.4,0,0.2,1);
}

.rkx-svc3__visual--build .rkx-svc3__layer--3 {
    transform: translate(-12%, -16%) rotate(-6deg);
    background: rgba(29,36,202,0.06);
}

.rkx-svc3__visual--build .rkx-svc3__layer--2 {
    transform: translate(8%, 0%) rotate(4deg);
    background: rgba(255,255,255,0.025);
}

.rkx-svc3__visual--build .rkx-svc3__layer--1 {
    position: relative;
    z-index: 3;
    padding: 14px;
    box-shadow: 0 30px 60px -25px rgba(29,36,202,0.5);
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.rkx-svc3__l1-bar {
    display: flex;
    gap: 5px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--rkx-page-line);
}

.rkx-svc3__l1-bar span {
    width: 7px; height: 7px; border-radius: 50%;
    background: rgba(255,255,255,0.15);
}

.rkx-svc3__l1-bar span:first-child { background: rgba(29,36,202,0.6); }

.rkx-svc3__l1-line {
    height: 7px;
    background: linear-gradient(90deg, rgba(255,255,255,0.05) 0%, rgba(29,36,202,0.3) 50%, rgba(255,255,255,0.05) 100%);
    background-size: 200% 100%;
    animation: rkx-svc3-sweep 2.6s ease-in-out infinite;
    border-radius: 1px;
}

.rkx-svc3__l1-line--lg { width: 70%; height: 11px; }

.rkx-svc3__l1-line--md { width: 45%; }

.rkx-svc3__l1-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 6px;
    margin-top: auto;
}

.rkx-svc3__l1-grid > div {
    aspect-ratio: 1;
    background: rgba(29,36,202,0.15);
    border: 1px solid rgba(29,36,202,0.25);
}

.rkx-svc3__visual--mkt {
    align-items: flex-end;
    justify-content: center;
    padding: 14px;
}

.rkx-svc3__chart {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    align-items: end;
    gap: 8px;
    width: 100%;
    height: 70%;
    position: relative;
    z-index: 1;
}

.rkx-svc3__bar {
    height: 0%;
    background: linear-gradient(180deg, rgba(29,36,202,0.85) 0%, rgba(29,36,202,0.3) 100%);
    border-radius: 1px;
    transition: height 900ms cubic-bezier(0.22,1,0.36,1);
}

.rkx-svc3__panel.is-active .rkx-svc3__bar { height: var(--h); }

.rkx-svc3__panel.is-active .rkx-svc3__bar:nth-child(1) { transition-delay: 200ms; }

.rkx-svc3__panel.is-active .rkx-svc3__bar:nth-child(2) { transition-delay: 280ms; }

.rkx-svc3__panel.is-active .rkx-svc3__bar:nth-child(3) { transition-delay: 360ms; }

.rkx-svc3__panel.is-active .rkx-svc3__bar:nth-child(4) { transition-delay: 440ms; }

.rkx-svc3__panel.is-active .rkx-svc3__bar:nth-child(5) { transition-delay: 520ms; }

.rkx-svc3__panel.is-active .rkx-svc3__bar:nth-child(6) { transition-delay: 600ms; }

.rkx-svc3__panel.is-active .rkx-svc3__bar:nth-child(7) { transition-delay: 680ms; }

.rkx-svc3__bar--peak {
    background: linear-gradient(180deg, #818cf8 0%, #1D24CA 100%);
    box-shadow: 0 0 16px rgba(29,36,202,0.6);
}

.rkx-svc3__line {
    position: absolute;
    inset: 14px;
    width: calc(100% - 28px);
    height: calc(100% - 28px);
    pointer-events: none;
    z-index: 2;
    opacity: 0;
    transition: opacity 600ms ease 800ms;
}

.rkx-svc3__panel.is-active .rkx-svc3__line { opacity: 1; }

.rkx-svc3__line path {
    stroke-dasharray: 400;
    stroke-dashoffset: 400;
}

.rkx-svc3__panel.is-active .rkx-svc3__line path {
    animation: rkx-svc3-draw 1400ms cubic-bezier(0.65,0,0.35,1) 800ms forwards;
}

.rkx-svc3__visual--brand {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 1fr;
    gap: 10px;
    padding: 14px;
}

.rkx-svc3__sw {
    aspect-ratio: 1;
    background: var(--c, rgba(255,255,255,0.04));
    border: 1px solid rgba(255,255,255,0.10);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transform: scale(0.85);
    transition: opacity 420ms cubic-bezier(0.34,1.56,0.64,1), transform 480ms cubic-bezier(0.34,1.56,0.64,1);
}

.rkx-svc3__panel.is-active .rkx-svc3__sw { opacity: 1; transform: none; }

.rkx-svc3__panel.is-active .rkx-svc3__sw:nth-child(1) { transition-delay: 180ms; }

.rkx-svc3__panel.is-active .rkx-svc3__sw:nth-child(2) { transition-delay: 240ms; }

.rkx-svc3__panel.is-active .rkx-svc3__sw:nth-child(3) { transition-delay: 300ms; }

.rkx-svc3__panel.is-active .rkx-svc3__sw:nth-child(4) { transition-delay: 360ms; }

.rkx-svc3__panel.is-active .rkx-svc3__sw:nth-child(5) { transition-delay: 420ms; }

.rkx-svc3__panel.is-active .rkx-svc3__sw:nth-child(6) { transition-delay: 480ms; }

.rkx-svc3__sw--logo {
    background: linear-gradient(135deg, #1D24CA, #1D24CA);
    color: #fff;
    font-family: 'Inter', sans-serif;
    font-size: 32px;
    font-weight: 700;
    letter-spacing: -0.04em;
}

.rkx-svc3__sw--type {
    background: rgba(255,255,255,0.95);
    color: #05060d;
    font-family: 'Inter', sans-serif;
    font-size: 24px;
    font-weight: 600;
}

.rkx-svc3__sw--mono {
    background: transparent;
    border: 1px dashed rgba(29,36,202,0.4);
    color: var(--rkx-accent-tx);
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    letter-spacing: 0.16em;
}

.rkx-svc3__visual { transition: transform 320ms cubic-bezier(0.4,0,0.2,1); }

@media (max-width: 1023px) {
    .rkx-svc3__panel { grid-template-columns: 1fr; gap: 28px; padding: 28px 22px; }
    .rkx-svc3__visual { aspect-ratio: 1.5/1; max-width: 100%; }
    .rkx-svc3__stage { min-height: 0; }
}

@media (max-width: 639px) {
    .rkx-svc3__nav { grid-template-columns: 1fr; }
    .rkx-svc3__tab { border-right: none; border-bottom: 1px solid var(--rkx-page-line); padding: 14px 18px; }
    .rkx-svc3__tab:last-child { border-bottom: none; }
    .rkx-svc3__indicator { width: 4px; height: 33.333%; left: 0; bottom: auto; top: 0; background: linear-gradient(180deg, #1D24CA 0%, #818cf8 100%); transition: transform 480ms cubic-bezier(0.65,0,0.35,1); }
    .rkx-svc3__nav[data-active="02"] .rkx-svc3__indicator { transform: translateY(100%); }
    .rkx-svc3__nav[data-active="03"] .rkx-svc3__indicator { transform: translateY(200%); }
    .rkx-svc3__title { font-size: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .rkx-svc3__panel, .rkx-svc3__indicator, .rkx-svc3__l1-line, .rkx-svc3__bar, .rkx-svc3__line path, .rkx-svc3__sw, .rkx-svc3__chip-dot {
        transition: none !important;
        animation: none !important;
    }
}

.rkx-svc3__visual--mkt {
    align-items: stretch !important;
    justify-content: stretch;
    padding: 18px;
}

.rkx-funnel {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 8px;
    padding: 4px 6px;
}

.rkx-funnel__row {
    position: relative;
    height: 18%;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    padding: 0 14px;
    border-radius: 1px;
    background: rgba(255,255,255,0.025);
    border: 1px solid rgba(255,255,255,0.08);
    overflow: hidden;
    transition: border-color 240ms ease, background 240ms ease;
}

.rkx-funnel__bar {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 0%;
    background:
        linear-gradient(90deg, rgba(29,36,202,0.85) 0%, rgba(29,36,202,0.35) 100%);
    z-index: 0;
    box-shadow: 0 0 18px rgba(29,36,202,0.35) inset;
    transition: width 900ms cubic-bezier(0.22,1,0.36,1);
    transition-delay: var(--d, 0ms);
}

.rkx-funnel__bar::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image: repeating-linear-gradient(
        -45deg,
        rgba(255,255,255,0.10) 0,
        rgba(255,255,255,0.10) 6px,
        transparent 6px,
        transparent 12px
    );
    animation: rkx-funnel-stripes 1.2s linear infinite;
}

.rkx-funnel__lbl,
.rkx-funnel__val {
    position: relative;
    z-index: 1;
    font-family: 'Inter', sans-serif;
    font-size: clamp(11px, 1vw, 13px);
    font-weight: 500;
    color: #fff;
    letter-spacing: -0.005em;
}

.rkx-funnel__lbl {
    font-family: 'Poppins', sans-serif;
    font-size: clamp(9.5px, 0.85vw, 11px);
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.85);
}

.rkx-funnel__val {
    font-feature-settings: 'tnum';
    color: #fff;
    font-weight: 700;
}

.rkx-svc3__panel.is-active .rkx-funnel__bar { width: var(--w, 50%); }

.rkx-funnel__row--win {
    border-color: rgba(29,36,202,0.45);
}

.rkx-funnel__row--win .rkx-funnel__bar {
    background: linear-gradient(90deg, #818cf8 0%, #1D24CA 100%);
    box-shadow: 0 0 22px rgba(29,36,202,0.55) inset, 0 0 24px rgba(29,36,202,0.35);
}

.rkx-funnel__row--win .rkx-funnel__val {
    color: #fff;
    text-shadow: 0 0 14px rgba(29,36,202,0.7);
}

.rkx-funnel__pulse {
    position: absolute;
    left: 14px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(180deg, transparent 0%, rgba(29,36,202,0.6) 50%, transparent 100%);
    opacity: 0;
    transition: opacity 420ms ease;
    pointer-events: none;
}

.rkx-svc3__panel.is-active .rkx-funnel__pulse {
    opacity: 1;
    animation: rkx-funnel-flow 2.4s ease-in-out 1.1s infinite;
}

@media (prefers-reduced-motion: reduce) {
    .rkx-funnel__bar::after,
    .rkx-svc3__panel.is-active .rkx-funnel__pulse {
        animation: none !important;
    }
    .rkx-funnel__bar { transition: none !important; }
}

@media (max-width: 639px) {
    .rkx-funnel__lbl  { font-size: 9.5px; }
    .rkx-funnel__val  { font-size: 11px; }
    .rkx-funnel__row  { padding: 0 10px; }
}

.rkx-funnel__bar {
    background: rgba(29,36,202,0.15) !important;
    box-shadow: 0 0 0 1px rgba(29,36,202,0.4) inset !important;
}

.rkx-funnel__bar::after {
    background-image: repeating-linear-gradient(
        -45deg,
        rgba(29,36,202,0.18) 0,
        rgba(29,36,202,0.18) 6px,
        transparent 6px,
        transparent 12px
    ) !important;
}

.rkx-funnel__row {
    border-color: rgba(29,36,202,0.18) !important;
    background: rgba(29,36,202,0.04) !important;
}

.rkx-funnel__row--win {
    border-color: rgba(29,36,202,0.45) !important;
}

.rkx-funnel__row--win .rkx-funnel__bar {
    background: rgba(29,36,202,0.28) !important;
    box-shadow: 0 0 0 1px rgba(29,36,202,0.55) inset, 0 0 18px rgba(29,36,202,0.25) !important;
}

/* RESP SVC3 */
@media (max-width: 639px) {
    .rkx-svc3__tab-name { font-size: 13px; }
    .rkx-svc3__panel { padding: 22px 18px; gap: 22px; }
    .rkx-svc3__title { font-size: 20px; line-height: 1.15; }
    .rkx-svc3__desc { font-size: 13px; }
    .rkx-svc3__pill { padding: 6px 10px; font-size: 11.5px; }
    .rkx-svc3__chip { font-size: 10px; padding: 5px 10px; }
    .rkx-funnel__lbl { font-size: 9px !important; }
    .rkx-funnel__val { font-size: 10.5px !important; }
    .rkx-funnel__row { padding: 0 9px !important; }
    .rkx-svc3__stamp-v { font-size: 16px; }
    .rkx-svc3__stamp-l { font-size: 8.5px; }
}
@media (min-width: 1920px) { .rkx-svc3__title { font-size: 42px; } .rkx-svc3__desc { font-size: 17px; } .rkx-svc3__panel { padding: 56px; } .rkx-svc3__tab { padding: 28px 32px; } .rkx-svc3__tab-name { font-size: 20px; } }
@media (min-width: 2560px) { .rkx-svc3__title { font-size: 56px; } .rkx-svc3__desc { font-size: 20px; max-width: 60ch; } .rkx-svc3__panel { padding: 72px; gap: 64px; } .rkx-svc3__pill { font-size: 15px; padding: 9px 16px; } }
@media (min-width: 3840px) { .rkx-svc3__title { font-size: 74px; } .rkx-svc3__desc { font-size: 24px; } .rkx-svc3__panel { padding: 110px; gap: 96px; } .rkx-svc3__tab-name { font-size: 28px; } .rkx-svc3__pill { font-size: 19px; padding: 12px 22px; } }


/* === promises === */
.rkx-prin {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 0;
    border: 1px solid var(--rkx-page-line);
    background: rgba(8,10,22,0.5);
    backdrop-filter: blur(14px) saturate(1.3);
    -webkit-backdrop-filter: blur(14px) saturate(1.3);
    overflow: hidden;
    min-height: 520px;
}

.rkx-prin__feat {
    position: relative;
    padding: clamp(36px, 4vw, 56px);
    border-right: 1px solid var(--rkx-page-line);
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    z-index: 1;
}

.rkx-prin__feat-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(circle at 0% 100%, rgba(29,36,202,0.20) 0%, transparent 55%),
        radial-gradient(circle at 100% 0%, rgba(29,36,202,0.10) 0%, transparent 60%);
    animation: rkx-prin-drift 18s ease-in-out infinite alternate;
}

.rkx-prin__num,
.rkx-prin__icon,
.rkx-prin__title,
.rkx-prin__desc,
.rkx-prin__progress,
.rkx-prin__verified { position: relative; z-index: 1; }

.rkx-prin__num {
    font-family: 'Inter', sans-serif;
    font-size: clamp(64px, 8vw, 120px);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 0.9;
    color: transparent;
    -webkit-text-stroke: 1px rgba(29,36,202,0.55);
    margin-bottom: 18px;
    transition: color 600ms ease, -webkit-text-stroke 600ms ease, transform 600ms cubic-bezier(0.34,1.56,0.64,1);
}

.rkx-prin__icon {
    width: 64px;
    height: 64px;
    margin-bottom: 22px;
    color: var(--rkx-accent-tx);
    transition: opacity 400ms ease, transform 600ms cubic-bezier(0.4,0,0.2,1);
}

.rkx-prin__icon svg {
    width: 100%;
    height: 100%;
    filter: drop-shadow(0 0 18px rgba(29,36,202,0.45));
}

.rkx-prin__icon svg path,
.rkx-prin__icon svg line,
.rkx-prin__icon svg polyline,
.rkx-prin__icon svg polygon,
.rkx-prin__icon svg circle,
.rkx-prin__icon svg rect {
    stroke-dasharray: 200;
    stroke-dashoffset: 200;
    animation: rkx-prin-draw 1200ms cubic-bezier(0.65,0,0.35,1) forwards;
}

.rkx-prin__title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(28px, 3vw, 42px);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.08;
    color: #fff;
    margin: 0 0 16px;
    text-wrap: balance;
}

.rkx-prin__desc {
    font-size: clamp(14.5px, 1.1vw, 17px);
    line-height: 1.6;
    color: rgba(255,255,255,0.7);
    margin: 0 0 32px;
    max-width: 46ch;
}

.rkx-prin__progress {
    height: 2px;
    background: rgba(255,255,255,0.08);
    margin: auto 0 22px;
    overflow: hidden;
    max-width: 240px;
}

.rkx-prin__progress span {
    display: block;
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, #1D24CA 0%, #818cf8 100%);
    box-shadow: 0 0 10px rgba(29,36,202,0.6);
}

.rkx-prin.is-rotating .rkx-prin__progress span {
    animation: rkx-prin-prog 5500ms linear forwards;
}

.rkx-prin__verified {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    align-self: flex-start;
    background: rgba(29,36,202,0.16);
    border: 1px solid rgba(29,36,202,0.45);
    color: var(--rkx-accent-tx);
    font-family: 'Poppins', sans-serif;
    font-size: 11px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    border-radius: 1px;
}

.rkx-prin__verified svg { width: 12px; height: 12px; }

.rkx-prin__feat.is-switching .rkx-prin__num,
.rkx-prin__feat.is-switching .rkx-prin__icon,
.rkx-prin__feat.is-switching .rkx-prin__title,
.rkx-prin__feat.is-switching .rkx-prin__desc {
    opacity: 0;
    transform: translateY(8px);
}

.rkx-prin__num,
.rkx-prin__title,
.rkx-prin__desc {
    transition: opacity 280ms ease, transform 380ms cubic-bezier(0.22,1,0.36,1);
}

.rkx-prin__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.rkx-prin__item {
    position: relative;
    flex: 1;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 24px;
    border-bottom: 1px solid var(--rkx-page-line);
    cursor: pointer;
    transition: background 240ms ease, padding-left 200ms ease;
    color: rgba(255,255,255,0.7);
}

.rkx-prin__item:last-child { border-bottom: none; }

.rkx-prin__item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--rkx-accent-tx);
    transform: scaleY(0);
    transform-origin: center;
    transition: transform 360ms cubic-bezier(0.22,1,0.36,1);
}

.rkx-prin__item:hover {
    background: rgba(255,255,255,0.03);
    padding-left: 28px;
    color: #fff;
}

.rkx-prin__item.is-active {
    background: rgba(29,36,202,0.08);
    color: #fff;
    padding-left: 28px;
}

.rkx-prin__item.is-active::before { transform: scaleY(1); }

.rkx-prin__item-num {
    font-family: 'Poppins', sans-serif;
    font-size: 11px;
    letter-spacing: 0.14em;
    color: var(--rkx-accent-tx);
    flex-shrink: 0;
    min-width: 22px;
}

.rkx-prin__item-name {
    font-family: 'Inter', sans-serif;
    font-size: 14.5px;
    font-weight: 500;
    letter-spacing: -0.01em;
    flex: 1;
    min-width: 0;
}

.rkx-prin__item-icon {
    width: 22px;
    height: 22px;
    color: rgba(255,255,255,0.45);
    flex-shrink: 0;
    transition: color 240ms ease, transform 360ms cubic-bezier(0.34,1.56,0.64,1);
}

.rkx-prin__item-icon svg { width: 100%; height: 100%; }

.rkx-prin__item:hover .rkx-prin__item-icon,
.rkx-prin__item.is-active .rkx-prin__item-icon {
    color: var(--rkx-accent-tx);
    transform: rotate(-4deg) scale(1.1);
}

@media (max-width: 1023px) {
    .rkx-prin {
        grid-template-columns: 1fr;
        min-height: 0;
    }
    .rkx-prin__feat {
        border-right: none;
        border-bottom: 1px solid var(--rkx-page-line);
        padding: 36px 28px;
    }
    .rkx-prin__num { font-size: 64px; }
    .rkx-prin__icon { width: 52px; height: 52px; margin-bottom: 18px; }
    .rkx-prin__title { font-size: 26px; }
}

@media (max-width: 639px) {
    .rkx-prin__item { padding: 14px 18px; }
    .rkx-prin__item:hover, .rkx-prin__item.is-active { padding-left: 22px; }
    .rkx-prin__feat { padding: 28px 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .rkx-prin__feat-bg, .rkx-prin__icon svg path, .rkx-prin__icon svg line,
    .rkx-prin__icon svg polyline, .rkx-prin__icon svg polygon, .rkx-prin__icon svg circle, .rkx-prin__icon svg rect,
    .rkx-prin.is-rotating .rkx-prin__progress span { animation: none !important; }
    .rkx-prin__num, .rkx-prin__title, .rkx-prin__desc, .rkx-prin__icon { transition: none !important; }
}

/* RESP PRIN */
@media (max-width: 479px) {
    .rkx-prin__feat { padding: 24px 18px; }
    .rkx-prin__num { font-size: 48px; }
    .rkx-prin__icon { width: 42px; height: 42px; margin-bottom: 14px; }
    .rkx-prin__title { font-size: 22px; }
    .rkx-prin__desc { font-size: 13.5px; margin-bottom: 22px; }
    .rkx-prin__item { padding: 12px 14px; }
    .rkx-prin__item-name { font-size: 13px; }
    .rkx-prin__verified { font-size: 9.5px; padding: 5px 10px; }
}
@media (min-width: 1920px) { .rkx-prin__num { font-size: 160px; } .rkx-prin__title { font-size: 52px; } .rkx-prin__desc { font-size: 19px; max-width: 50ch; } .rkx-prin__icon { width: 84px; height: 84px; } .rkx-prin__item { padding: 24px 28px; } .rkx-prin__item-name { font-size: 17px; } }
@media (min-width: 2560px) { .rkx-prin__num { font-size: 200px; } .rkx-prin__title { font-size: 64px; } .rkx-prin__desc { font-size: 22px; } .rkx-prin__icon { width: 100px; height: 100px; } .rkx-prin__item-name { font-size: 20px; } .rkx-prin__feat { padding: 80px; } }
@media (min-width: 3840px) { .rkx-prin__num { font-size: 280px; } .rkx-prin__title { font-size: 84px; } .rkx-prin__desc { font-size: 28px; } .rkx-prin__icon { width: 140px; height: 140px; } .rkx-prin__item { padding: 32px 40px; } .rkx-prin__item-name { font-size: 24px; } }


/* === build-cards === */
.rkx-bcards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: var(--rkx-page-line);
    border: 1px solid var(--rkx-page-line);
    overflow: hidden;
    width: 100%;
}

.rkx-build__card {
    position: relative;
    background: rgba(8,10,22,0.6);
    padding: clamp(24px, 2.4vw, 36px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    cursor: pointer;
    transition: background 320ms ease;
    min-height: clamp(280px, 28vw, 360px);
}

.rkx-build__card::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(29,36,202,0.20) 0%, transparent 50%);
    opacity: 0;
    transition: opacity 320ms ease;
    z-index: 0;
}

.rkx-build__card:hover {
    background: rgba(12,16,30,0.7);
}

.rkx-build__card:hover::before { opacity: 1; }

.rkx-build__card > * { position: relative; z-index: 1; }

.rkx-build__visual {
    width: 100%;
    aspect-ratio: 1.6 / 1;
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 480ms cubic-bezier(0.34,1.56,0.64,1);
}

.rkx-build__card:hover .rkx-build__visual { transform: scale(1.04) translateY(-2px); }

.rkx-build__num {
    font-family: 'Poppins', sans-serif;
    font-size: 11px;
    letter-spacing: 0.16em;
    color: var(--rkx-accent-tx);
    margin-bottom: 8px;
}

.rkx-build__title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(17px, 1.4vw, 22px);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.15;
    color: #fff;
    margin: 0 0 12px;
}

.rkx-build__desc {
    font-size: 13.5px;
    line-height: 1.55;
    color: rgba(255,255,255,0.6);
    margin: 0;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transform: translateY(8px);
    transition: max-height 480ms cubic-bezier(0.4,0,0.2,1), opacity 320ms ease, transform 480ms cubic-bezier(0.22,1,0.36,1), margin 360ms ease;
}

.rkx-build__card:hover .rkx-build__desc {
    max-height: 220px;
    opacity: 1;
    transform: translateY(0);
    margin-top: 0;
}

.rkx-build__arrow {
    position: absolute;
    top: clamp(24px, 2.4vw, 36px);
    right: clamp(24px, 2.4vw, 36px);
    font-family: 'Poppins', sans-serif;
    color: rgba(255,255,255,0.25);
    font-size: 20px;
    transition: color 240ms ease, transform 360ms cubic-bezier(0.22,1,0.36,1);
}

.rkx-build__card:hover .rkx-build__arrow {
    color: var(--rkx-accent-tx);
    transform: translateX(4px) rotate(-12deg);
}

.rkx-bvisual {
    position: relative;
    width: 100%;
    height: 100%;
    background: rgba(29,36,202,0.05);
    border: 1px solid rgba(29,36,202,0.18);
    border-radius: 1px;
    padding: 14px;
    overflow: hidden;
}

.rkx-bvisual--site { display: flex; flex-direction: column; gap: 8px; }

.rkx-bvisual__bar { display: flex; gap: 5px; padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,0.08); }

.rkx-bvisual__bar span { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,0.15); }

.rkx-bvisual__bar span:first-child { background: rgba(29,36,202,0.7); }

.rkx-bvisual__skel {
    height: 7px;
    background: linear-gradient(90deg, rgba(255,255,255,0.06) 0%, rgba(29,36,202,0.3) 50%, rgba(255,255,255,0.06) 100%);
    background-size: 200% 100%;
    animation: rkx-b-sweep 2.4s ease-in-out infinite;
    border-radius: 1px;
}

.rkx-bvisual__skel--lg { width: 70%; height: 10px; }

.rkx-bvisual__skel--md { width: 50%; }

.rkx-bvisual__tiles { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; margin-top: auto; }

.rkx-bvisual__tiles > div {
    aspect-ratio: 1;
    background: rgba(29,36,202,0.18);
    border: 1px solid rgba(29,36,202,0.3);
    border-radius: 1px;
}

.rkx-build__card:hover .rkx-bvisual__tiles > div { animation: rkx-b-tile 600ms cubic-bezier(0.34,1.56,0.64,1) both; }

.rkx-build__card:hover .rkx-bvisual__tiles > div:nth-child(2) { animation-delay: 80ms; }

.rkx-build__card:hover .rkx-bvisual__tiles > div:nth-child(3) { animation-delay: 160ms; }

.rkx-bvisual--track {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    padding: 10px;
}

.rkx-bvisual__tile {
    background: rgba(29,36,202,0.10);
    border: 1px solid rgba(29,36,202,0.25);
    border-radius: 1px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 6px 10px;
    transition: background 240ms ease, border-color 240ms ease;
}

.rkx-build__card:hover .rkx-bvisual__tile { background: rgba(29,36,202,0.18); border-color: rgba(29,36,202,0.45); }

.rkx-bvisual__tile-num {
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    line-height: 1;
    letter-spacing: -0.02em;
}

.rkx-bvisual__tile-lbl {
    font-family: 'Poppins', sans-serif;
    font-size: 8.5px;
    letter-spacing: 0.14em;
    color: rgba(255,255,255,0.45);
    text-transform: uppercase;
    margin-top: 3px;
}

.rkx-bvisual--seo {
    display: flex;
    align-items: flex-end;
}

.rkx-bvisual__chart {
    width: 100%;
    height: 100%;
}

.rkx-bvisual__chart path {
    stroke-dasharray: 400;
    stroke-dashoffset: 400;
    animation: rkx-b-draw 1600ms cubic-bezier(0.65,0,0.35,1) infinite alternate;
}

.rkx-bvisual--paid {
    display: flex;
    align-items: center;
    justify-content: center;
}

.rkx-bvisual__target {
    position: relative;
    width: 70%;
    aspect-ratio: 1;
}

.rkx-bvisual__ring {
    position: absolute;
    inset: 0;
    border: 2px solid rgba(29,36,202,0.55);
    border-radius: 50%;
    animation: rkx-b-pulse 3s ease-in-out infinite;
}

.rkx-bvisual__ring--2 { inset: 18%; border-color: rgba(29,36,202,0.7); animation-delay: 0.3s; }

.rkx-bvisual__ring--3 { inset: 36%; border-color: rgba(29,36,202,0.85); animation-delay: 0.6s; }

.rkx-bvisual__bullseye {
    position: absolute;
    top: 50%; left: 50%;
    width: 18%; height: 18%;
    background: #1D24CA;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 16px rgba(29,36,202,0.8);
}

.rkx-bvisual--brand {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 1fr;
    gap: 6px;
    padding: 10px;
}

.rkx-bvisual__sw {
    background: var(--c, rgba(255,255,255,0.05));
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 1px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #05060d;
    transition: transform 360ms cubic-bezier(0.34,1.56,0.64,1);
}

.rkx-bvisual__sw--logo {
    background: linear-gradient(135deg, #1D24CA, #1D24CA) !important;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
}

.rkx-build__card:hover .rkx-bvisual__sw { transform: scale(1.04); }

.rkx-build__card:hover .rkx-bvisual__sw:nth-child(1) { transition-delay: 0ms; }

.rkx-build__card:hover .rkx-bvisual__sw:nth-child(2) { transition-delay: 50ms; }

.rkx-build__card:hover .rkx-bvisual__sw:nth-child(3) { transition-delay: 100ms; }

.rkx-build__card:hover .rkx-bvisual__sw:nth-child(4) { transition-delay: 150ms; }

.rkx-build__card:hover .rkx-bvisual__sw:nth-child(5) { transition-delay: 200ms; }

.rkx-build__card:hover .rkx-bvisual__sw:nth-child(6) { transition-delay: 250ms; }

.rkx-bvisual--app {
    display: flex;
    align-items: center;
    justify-content: center;
}

.rkx-bvisual__phone {
    position: relative;
    width: 30%;
    aspect-ratio: 9/16;
    background: rgba(8,10,22,0.95);
    border: 2px solid rgba(255,255,255,0.18);
    border-radius: 1px;
    padding: 8px 4px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.rkx-bvisual__notch {
    position: absolute;
    top: 4px;
    left: 50%;
    transform: translateX(-50%);
    width: 30%;
    height: 4px;
    background: rgba(255,255,255,0.18);
    border-radius: 1px;
}

.rkx-bvisual__screen {
    flex: 1;
    width: 100%;
    margin-top: 8px;
    background: linear-gradient(180deg, rgba(29,36,202,0.30), rgba(8,10,22,0.95));
    border-radius: 1px;
    display: flex;
    flex-direction: column;
    padding: 6px 4px;
    gap: 4px;
    overflow: hidden;
}

.rkx-bvisual__screen span {
    height: 5px;
    background: rgba(255,255,255,0.4);
    border-radius: 1px;
    animation: rkx-b-screen 2s ease-in-out infinite;
}

.rkx-bvisual__screen span:nth-child(1) { width: 70%; }

.rkx-bvisual__screen span:nth-child(2) { width: 50%; animation-delay: 0.2s; }

.rkx-bvisual__screen span:nth-child(3) { width: 80%; animation-delay: 0.4s; }

.rkx-bvisual__home {
    width: 24%;
    height: 3px;
    background: rgba(255,255,255,0.3);
    border-radius: 1px;
}

@media (max-width: 1023px) { .rkx-bcards { grid-template-columns: repeat(2, 1fr); } }

@media (max-width: 639px) { .rkx-bcards { grid-template-columns: 1fr; }
    .rkx-build__card { min-height: 0; }
    .rkx-build__visual { aspect-ratio: 2 / 1; margin-bottom: 14px; }
    .rkx-build__desc { max-height: 220px; opacity: 1; transform: none; margin-top: 0; }
    .rkx-bvisual__phone { width: 22%; }
}

@media (min-width: 2560px) {
    .rkx-build__card { min-height: 440px; padding: 48px; }
    .rkx-build__title { font-size: 26px; }
    .rkx-build__desc { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
    .rkx-bvisual__skel, .rkx-bvisual__chart path, .rkx-bvisual__ring,
    .rkx-bvisual__screen span, .rkx-build__card::before {
        animation: none !important;
    }
    .rkx-build__desc { max-height: 220px; opacity: 1; transform: none; }
}

/* RESP BUILD */
@media (max-width: 479px) {
    .rkx-build__card { padding: 18px; min-height: 0; }
    .rkx-build__visual { aspect-ratio: 2/1; margin-bottom: 12px; }
    .rkx-build__title { font-size: 16px; }
    .rkx-build__desc { font-size: 12.5px; max-height: 220px; opacity: 1; transform: none; margin-top: 0; }
    .rkx-bvisual__phone { width: 24%; }
    .rkx-bvisual__tile-num { font-size: 12px; }
    .rkx-bvisual__tile-lbl { font-size: 7.5px; }
}
@media (min-width: 1920px) { .rkx-build__card { min-height: 460px; padding: 44px; } .rkx-build__title { font-size: 26px; } .rkx-build__desc { font-size: 15px; } }
@media (min-width: 2560px) { .rkx-build__card { min-height: 560px; padding: 56px; } .rkx-build__title { font-size: 32px; } .rkx-build__desc { font-size: 17px; } .rkx-build__arrow { font-size: 26px; } }
@media (min-width: 3840px) { .rkx-build__card { min-height: 760px; padding: 80px; } .rkx-build__title { font-size: 44px; } .rkx-build__desc { font-size: 22px; } .rkx-build__num { font-size: 14px; } }


/* === timeline === */

.rkx-tl {
    position: relative;
    padding: 20px 0 20px 40px;
}
.rkx-tl::before {
    content: '';
    position: absolute;
    left: 14px;
    top: 24px;
    bottom: 24px;
    width: 1px;
    background: rgba(255,255,255,0.08);
}
.rkx-tl__progress {
    position: absolute;
    left: 14px;
    top: 24px;
    width: 2px;
    height: 0%;
    background: linear-gradient(180deg, #1D24CA, #818cf8);
    box-shadow: 0 0 12px rgba(29,36,202,0.6);
    transition: height 1500ms cubic-bezier(0.22,1,0.36,1);
}
.rkx-tl.is-active .rkx-tl__progress { height: calc(100% - 48px); }

.rkx-tl__phase {
    position: relative;
    padding: 0 0 36px 24px;
    cursor: pointer;
}
.rkx-tl__phase:last-child { padding-bottom: 0; }
.rkx-tl__dot {
    position: absolute;
    left: -32px;
    top: 8px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #05060d;
    border: 2px solid rgba(255,255,255,0.18);
    transition: all 280ms ease;
    z-index: 2;
}
.rkx-tl__dot::after {
    content: '';
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 1px solid rgba(29,36,202,0.4);
    opacity: 0;
    transition: opacity 240ms ease;
}
.rkx-tl__phase:hover .rkx-tl__dot,
.rkx-tl__phase.is-active .rkx-tl__dot {
    background: #1D24CA;
    border-color: #1D24CA;
    box-shadow: 0 0 16px rgba(29,36,202,0.6);
}
.rkx-tl__phase:hover .rkx-tl__dot::after,
.rkx-tl__phase.is-active .rkx-tl__dot::after { opacity: 1; }

.rkx-tl__meta {
    font-family: var(--rkx-font-mono);
    font-size: 11px;
    letter-spacing: 0.14em;
    color: var(--rkx-accent-tx);
    margin-bottom: 6px;
}
.rkx-tl__title {
    font-size: clamp(20px, 2vw, 26px);
    font-weight: 700;
    letter-spacing: -0.025em;
    color: #fff;
    margin: 0 0 8px;
    transition: color 240ms ease, transform 320ms ease;
}
.rkx-tl__phase:hover .rkx-tl__title { color: var(--rkx-accent-tx); transform: translateX(4px); }
.rkx-tl__desc {
    font-size: 14px;
    line-height: 1.55;
    color: var(--rkx-page-muted);
    margin: 0 0 12px;
    max-width: 58ch;
}
.rkx-tl__tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px 10px;
    background: rgba(29,36,202,0.10);
    border: 1px solid rgba(29,36,202,0.30);
    color: var(--rkx-accent-tx);
    font-family: var(--rkx-font-mono);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}


/* RESP TL */
@media (max-width: 479px) {
    .rkx-tl { padding-left: 32px; }
    .rkx-tl::before, .rkx-tl__progress { left: 10px; }
    .rkx-tl__phase { padding-bottom: 28px; padding-left: 18px; }
    .rkx-tl__dot { left: -28px; width: 12px; height: 12px; }
    .rkx-tl__title { font-size: 18px; }
    .rkx-tl__desc { font-size: 13px; }
    .rkx-tl__tag { font-size: 9.5px; padding: 3px 8px; }
}
@media (min-width: 1920px) { .rkx-tl__title { font-size: 30px; } .rkx-tl__desc { font-size: 17px; max-width: 65ch; } .rkx-tl__dot { width: 18px; height: 18px; left: -36px; } }
@media (min-width: 2560px) { .rkx-tl__title { font-size: 38px; } .rkx-tl__desc { font-size: 20px; } .rkx-tl__dot { width: 22px; height: 22px; left: -44px; } .rkx-tl__phase { padding-bottom: 56px; padding-left: 36px; } }
@media (min-width: 3840px) { .rkx-tl__title { font-size: 50px; } .rkx-tl__desc { font-size: 26px; } .rkx-tl__dot { width: 28px; height: 28px; left: -56px; } .rkx-tl::before, .rkx-tl__progress { left: 18px; width: 2px; } .rkx-tl__phase { padding-bottom: 80px; padding-left: 56px; } }


/* === pricing === */

.rkx-price {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: var(--rkx-page-line);
    border: 1px solid var(--rkx-page-line);
}
@media(max-width:1023px){.rkx-price{grid-template-columns:1fr;}}
.rkx-price__col {
    background: rgba(8,10,22,0.5);
    padding: 36px 28px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    position: relative;
    transition: background 320ms ease;
}
.rkx-price__col:hover { background: rgba(12,16,30,0.7); }
.rkx-price__col--feat {
    background: linear-gradient(180deg, rgba(29,36,202,0.12) 0%, rgba(8,10,22,0.55) 70%);
    border-bottom: 2px solid #1D24CA;
}
.rkx-price__col--feat::before {
    content: 'MOST POPULAR';
    position: absolute;
    top: 0; left: 50%;
    transform: translate(-50%, -50%);
    padding: 4px 10px;
    background: #1D24CA;
    color: #fff;
    font-family: var(--rkx-font-mono);
    font-size: 9.5px;
    letter-spacing: 0.16em;
}
.rkx-price__tier {
    font-family: var(--rkx-font-mono);
    font-size: 11px;
    letter-spacing: 0.16em;
    color: var(--rkx-accent-tx);
    text-transform: uppercase;
}
.rkx-price__val {
    font-size: clamp(36px, 4.5vw, 56px);
    font-weight: 700;
    letter-spacing: -0.03em;
    color: #fff;
    line-height: 1;
}
.rkx-price__val small {
    font-size: 0.32em;
    color: var(--rkx-page-muted);
    font-weight: 500;
    margin-left: 6px;
}
.rkx-price__desc {
    font-size: 13.5px;
    color: var(--rkx-page-muted);
    line-height: 1.5;
    margin: 0;
}
.rkx-price__list { list-style: none; margin: 0; padding: 0; }
.rkx-price__list li {
    padding: 11px 0;
    border-top: 1px solid var(--rkx-page-line);
    font-size: 13.5px;
    color: var(--rkx-page-text);
    display: flex;
    align-items: flex-start;
    gap: 10px;
    transition: padding-left 200ms ease, color 200ms ease;
}
.rkx-price__list li:hover { padding-left: 8px; color: #fff; }
.rkx-price__list li::before {
    content: '+';
    color: var(--rkx-accent-tx);
    font-family: var(--rkx-font-mono);
    font-size: 13px;
}
.rkx-price__btn {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 48px;
    padding: 0 18px;
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--rkx-page-line-strong);
    color: #fff;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: all 200ms ease;
}
.rkx-price__btn:hover { background: rgba(29,36,202,0.18); border-color: rgba(29,36,202,0.5); }
.rkx-price__col--feat .rkx-price__btn {
    background: #1D24CA;
    border-color: rgba(29,36,202,0.6);
    box-shadow: 0 0 18px rgba(29,36,202,0.3);
}


/* RESP PRICE */
@media (max-width: 479px) {
    .rkx-price__col { padding: 26px 18px; gap: 14px; }
    .rkx-price__val { font-size: 32px; }
    .rkx-price__desc { font-size: 12.5px; }
    .rkx-price__list li { font-size: 12.5px; padding: 9px 0; }
}
@media (min-width: 1920px) { .rkx-price__col { padding: 56px 44px; } .rkx-price__val { font-size: 64px; } .rkx-price__desc { font-size: 16px; } .rkx-price__list li { font-size: 16px; padding: 14px 0; } .rkx-price__btn { height: 56px; font-size: 15px; } }
@media (min-width: 2560px) { .rkx-price__val { font-size: 80px; } .rkx-price__desc { font-size: 19px; } .rkx-price__list li { font-size: 19px; } .rkx-price__col { padding: 72px 60px; } .rkx-price__btn { height: 64px; font-size: 17px; } }
@media (min-width: 3840px) { .rkx-price__val { font-size: 108px; } .rkx-price__desc { font-size: 24px; } .rkx-price__list li { font-size: 24px; padding: 18px 0; } .rkx-price__col { padding: 110px 88px; } .rkx-price__btn { height: 84px; font-size: 22px; } }


/* === magazine === */

.rkx-mag {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    grid-template-rows: 240px 240px;
    gap: 1px;
    background: var(--rkx-page-line);
    border: 1px solid var(--rkx-page-line);
}
.rkx-mag__art {
    position: relative;
    overflow: hidden;
    background: rgba(8,10,22,0.5);
    text-decoration: none;
    color: inherit;
    padding: 22px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    transition: background 320ms ease;
}
.rkx-mag__art:hover { background: rgba(12,16,30,0.85); }
.rkx-mag__art--hero {
    grid-row: 1 / span 2;
    background: linear-gradient(180deg, rgba(29,36,202,0.18) 0%, rgba(8,10,22,0.85) 60%);
    padding: 32px;
}
.rkx-mag__art--hero:hover { background: linear-gradient(180deg, rgba(29,36,202,0.28) 0%, rgba(12,16,30,0.95) 60%); }
.rkx-mag__art::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: var(--rkx-accent-tx);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 360ms cubic-bezier(0.22,1,0.36,1);
}
.rkx-mag__art:hover::before { transform: scaleX(1); }
.rkx-mag__cat {
    font-family: var(--rkx-font-mono);
    font-size: 10px;
    letter-spacing: 0.14em;
    color: var(--rkx-accent-tx);
    margin-bottom: 8px;
    text-transform: uppercase;
}
.rkx-mag__title {
    font-size: clamp(14px, 1.3vw, 17px);
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.25;
    color: #fff;
    margin: 0 0 10px;
    transition: color 240ms ease;
}
.rkx-mag__art--hero .rkx-mag__title { font-size: clamp(22px, 2.5vw, 32px); line-height: 1.1; margin-bottom: 14px; }
.rkx-mag__art:hover .rkx-mag__title { color: var(--rkx-accent-tx); }
.rkx-mag__meta {
    font-family: var(--rkx-font-mono);
    font-size: 10px;
    color: var(--rkx-page-dim);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.rkx-mag__excerpt {
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--rkx-page-muted);
    margin: 0 0 14px;
    max-width: 50ch;
}
@media(max-width:1023px){
    .rkx-mag { grid-template-columns: 1fr 1fr; grid-template-rows: 240px 240px 240px; }
    .rkx-mag__art--hero { grid-column: 1 / -1; grid-row: 1; }
}
@media(max-width:639px){
    .rkx-mag { grid-template-columns: 1fr; }
    .rkx-mag__art--hero { grid-column: 1; }
}


/* RESP MAG */
@media (max-width: 479px) {
    .rkx-mag__art { padding: 16px; }
    .rkx-mag__art--hero { padding: 22px; }
    .rkx-mag__title { font-size: 13.5px; }
    .rkx-mag__art--hero .rkx-mag__title { font-size: 19px; }
    .rkx-mag__excerpt { font-size: 12.5px; }
    .rkx-mag__meta { font-size: 9px; }
}
@media (min-width: 1920px) { .rkx-mag { grid-template-rows: 320px 320px; } .rkx-mag__title { font-size: 20px; } .rkx-mag__art--hero .rkx-mag__title { font-size: 38px; } .rkx-mag__excerpt { font-size: 16px; } }
@media (min-width: 2560px) { .rkx-mag { grid-template-rows: 400px 400px; } .rkx-mag__title { font-size: 24px; } .rkx-mag__art--hero .rkx-mag__title { font-size: 48px; } .rkx-mag__art { padding: 32px; } .rkx-mag__art--hero { padding: 48px; } }
@media (min-width: 3840px) { .rkx-mag { grid-template-rows: 560px 560px; } .rkx-mag__title { font-size: 32px; } .rkx-mag__art--hero .rkx-mag__title { font-size: 68px; } .rkx-mag__art { padding: 56px; } }


/* === faq === */

.rkx-faq {
    border-top: 1px solid var(--rkx-page-line);
}
.rkx-faq__item {
    border-bottom: 1px solid var(--rkx-page-line);
    position: relative;
}
.rkx-faq__item::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 2px;
    background: #1D24CA;
    transform: scaleY(0);
    transition: transform 320ms cubic-bezier(0.22,1,0.36,1);
}
.rkx-faq__item.is-open::before { transform: scaleY(1); }
.rkx-faq__trigger {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 22px 22px 24px;
    background: transparent;
    border: none;
    color: #fff;
    font-family: inherit;
    font-size: clamp(15px, 1.3vw, 18px);
    font-weight: 600;
    text-align: left;
    cursor: pointer;
    transition: padding-left 200ms ease, background 200ms ease;
}
.rkx-faq__trigger:hover { padding-left: 32px; background: rgba(255,255,255,0.02); }
.rkx-faq__item.is-open .rkx-faq__trigger { padding-left: 32px; }
.rkx-faq__icon {
    width: 22px; height: 22px;
    border: 1px solid var(--rkx-page-line-strong);
    display: grid;
    place-items: center;
    color: var(--rkx-accent-tx);
    font-family: var(--rkx-font-mono);
    font-size: 14px;
    line-height: 1;
    flex-shrink: 0;
    transition: transform 240ms ease, background 200ms ease;
}
.rkx-faq__item.is-open .rkx-faq__icon {
    background: rgba(29,36,202,0.18);
    border-color: rgba(29,36,202,0.5);
    transform: rotate(45deg);
}
.rkx-faq__body {
    overflow: hidden;
    max-height: 0;
    transition: max-height 380ms cubic-bezier(0.4,0,0.2,1);
}
.rkx-faq__item.is-open .rkx-faq__body { max-height: 400px; }
.rkx-faq__body p {
    font-size: 14.5px;
    line-height: 1.65;
    color: var(--rkx-page-muted);
    margin: 0 0 22px;
    max-width: 70ch;
    padding: 0 22px 0 24px;
}


/* RESP FAQ */
@media (max-width: 479px) {
    .rkx-faq__trigger { padding: 18px 16px 18px 18px; font-size: 14px; gap: 14px; }
    .rkx-faq__body p { font-size: 13.5px; padding: 0 16px 0 18px; margin-bottom: 18px; }
    .rkx-faq__icon { width: 20px; height: 20px; font-size: 12px; }
}
@media (min-width: 1920px) { .rkx-faq__trigger { padding: 30px 30px 30px 32px; font-size: 22px; } .rkx-faq__body p { font-size: 17px; padding: 0 30px 0 32px; } .rkx-faq__icon { width: 26px; height: 26px; font-size: 16px; } }
@media (min-width: 2560px) { .rkx-faq__trigger { font-size: 28px; padding: 40px 40px 40px 44px; } .rkx-faq__body p { font-size: 20px; max-width: 80ch; } }
@media (min-width: 3840px) { .rkx-faq__trigger { font-size: 36px; padding: 56px 56px 56px 60px; } .rkx-faq__body p { font-size: 26px; } .rkx-faq__icon { width: 34px; height: 34px; font-size: 20px; } }


/* === team === */

.rkx-team {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: var(--rkx-page-line);
    border: 1px solid var(--rkx-page-line);
}
@media(max-width:1023px){.rkx-team{grid-template-columns:repeat(2,1fr);}}
@media(max-width:639px){.rkx-team{grid-template-columns:1fr;}}
.rkx-team__card {
    background: rgba(8,10,22,0.5);
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    position: relative;
    overflow: hidden;
    transition: background 320ms ease;
}
.rkx-team__card::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, #1D24CA, transparent);
    transform: scaleX(0);
    transition: transform 360ms cubic-bezier(0.22,1,0.36,1);
}
.rkx-team__card:hover { background: rgba(12,16,30,0.7); }
.rkx-team__card:hover::after { transform: scaleX(1); }
.rkx-team__avatar {
    width: 64px; height: 64px;
    background: linear-gradient(135deg, rgba(29,36,202,0.4), rgba(29,36,202,0.2));
    border: 1px solid rgba(29,36,202,0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-family: 'Inter', sans-serif;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.02em;
    transition: transform 360ms cubic-bezier(0.34,1.56,0.64,1);
}
.rkx-team__card:hover .rkx-team__avatar { transform: rotate(-6deg) scale(1.1); }
.rkx-team__role {
    font-family: var(--rkx-font-mono);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--rkx-accent-tx);
}
.rkx-team__name {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #fff;
    margin: 0;
}
.rkx-team__bio {
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--rkx-page-muted);
    margin: 0;
}
.rkx-team__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--rkx-page-line);
}
.rkx-team__tag {
    padding: 3px 8px;
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--rkx-page-line);
    color: var(--rkx-page-muted);
    font-family: var(--rkx-font-mono);
    font-size: 9.5px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}


/* RESP TEAM */
@media (max-width: 479px) {
    .rkx-team__card { padding: 20px; }
    .rkx-team__avatar { width: 52px; height: 52px; font-size: 18px; }
    .rkx-team__name { font-size: 16px; }
    .rkx-team__bio { font-size: 12.5px; }
}
@media (min-width: 1920px) { .rkx-team__card { padding: 40px; } .rkx-team__avatar { width: 84px; height: 84px; font-size: 28px; } .rkx-team__name { font-size: 22px; } .rkx-team__bio { font-size: 16px; } }
@media (min-width: 2560px) { .rkx-team__avatar { width: 104px; height: 104px; font-size: 34px; } .rkx-team__name { font-size: 26px; } .rkx-team__bio { font-size: 19px; } .rkx-team__card { padding: 52px; } }
@media (min-width: 3840px) { .rkx-team__avatar { width: 140px; height: 140px; font-size: 46px; } .rkx-team__name { font-size: 32px; } .rkx-team__bio { font-size: 24px; } .rkx-team__card { padding: 72px; } }


/* === roles === */

.rkx-roles {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    background: var(--rkx-page-line);
    border: 1px solid var(--rkx-page-line);
}
@media(max-width:639px){.rkx-roles{grid-template-columns:1fr;}}
.rkx-roles__job {
    background: rgba(8,10,22,0.5);
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    text-decoration: none;
    color: inherit;
    position: relative;
    overflow: hidden;
    transition: background 320ms ease;
}
.rkx-roles__job::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at var(--mx,50%) var(--my,50%), rgba(29,36,202,0.18) 0%, transparent 50%);
    opacity: 0;
    transition: opacity 320ms ease;
    pointer-events: none;
}
.rkx-roles__job:hover { background: rgba(12,16,30,0.75); }
.rkx-roles__job:hover::before { opacity: 1; }
.rkx-roles__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}
.rkx-roles__num {
    font-family: var(--rkx-font-mono);
    font-size: 10px;
    letter-spacing: 0.14em;
    color: var(--rkx-accent-tx);
    text-transform: uppercase;
}
.rkx-roles__arrow {
    color: var(--rkx-page-dim);
    transition: transform 280ms cubic-bezier(0.4,0,0.2,1), color 200ms ease;
}
.rkx-roles__job:hover .rkx-roles__arrow { transform: translateX(6px) rotate(-15deg); color: var(--rkx-accent-tx); }
.rkx-roles__title {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #fff;
    margin: 0;
    position: relative;
}
.rkx-roles__meta {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    font-family: var(--rkx-font-mono);
    font-size: 10px;
    letter-spacing: 0.12em;
    color: var(--rkx-page-muted);
    text-transform: uppercase;
    position: relative;
}
.rkx-roles__meta span::before { content:'· '; color: var(--rkx-page-dim); margin-right: 6px; }
.rkx-roles__meta span:first-child::before { display: none; }
.rkx-roles__desc {
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--rkx-page-muted);
    margin: 0;
    position: relative;
}


/* === stats === */

.rkx-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(20px, 3vw, 40px);
}
@media(max-width:1023px){.rkx-stats{grid-template-columns:repeat(2,1fr);}}
@media(max-width:479px){.rkx-stats{grid-template-columns:1fr;}}
.rkx-stat {
    padding-left: 18px;
    border-left: 1px solid var(--rkx-page-line-strong);
    display: flex;
    flex-direction: column;
    gap: 6px;
    transition: border-color 240ms ease, transform 320ms cubic-bezier(0.4,0,0.2,1);
}
.rkx-stat:hover { border-left-color: var(--rkx-accent-tx); transform: translateY(-3px); }
.rkx-stat__num {
    font-family: 'Inter', sans-serif;
    font-feature-settings: 'tnum';
    font-size: clamp(40px, 4.5vw, 64px);
    font-weight: 700;
    color: #fff;
    line-height: 0.95;
    letter-spacing: -0.04em;
    transition: color 240ms ease, text-shadow 280ms ease;
}
.rkx-stat:hover .rkx-stat__num { color: var(--rkx-accent-tx); text-shadow: 0 0 24px rgba(29,36,202,0.5); }
.rkx-stat__num small {
    font-size: 0.45em;
    font-weight: 500;
    color: var(--rkx-accent-tx);
    margin-left: 2px;
}
.rkx-stat__lbl {
    font-size: 13.5px;
    color: var(--rkx-page-muted);
    line-height: 1.4;
}
.rkx-stat__bar {
    margin-top: 12px;
    height: 2px;
    background: var(--rkx-page-line);
    overflow: hidden;
}
.rkx-stat__bar-fill {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, #1D24CA, #818cf8);
    box-shadow: 0 0 10px rgba(29,36,202,0.5);
    transition: width 1400ms cubic-bezier(0.22,1,0.36,1);
    transition-delay: var(--d,0ms);
}
.rkx-stat.is-in .rkx-stat__bar-fill { width: var(--w,60%); }


/* === quotes === */

.rkx-quotes {
    position: relative;
    min-height: 320px;
    padding: 40px;
    border: 1px solid var(--rkx-page-line-strong);
    background: rgba(8,10,22,0.5);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.rkx-quotes__mark {
    position: absolute;
    top: 8px;
    left: 30px;
    font-family: 'Inter', sans-serif;
    font-size: 100px;
    line-height: 1;
    color: rgba(29,36,202,0.35);
    font-weight: 700;
    animation: rkx-q-pulse 5s ease-in-out infinite;
}
@keyframes rkx-q-pulse {
    0%,100% { opacity: 0.35; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(1.08); }
}
.rkx-quotes__track {
    position: relative;
    z-index: 1;
    min-height: 220px;
}
.rkx-quotes__item {
    position: absolute;
    inset: 0;
    opacity: 0;
    transform: translateX(20px);
    transition: opacity 460ms cubic-bezier(0.22,1,0.36,1), transform 520ms cubic-bezier(0.22,1,0.36,1);
    pointer-events: none;
}
.rkx-quotes__item.is-active { opacity: 1; transform: none; pointer-events: auto; }
.rkx-quotes__text {
    font-size: clamp(18px, 1.8vw, 24px);
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: -0.02em;
    color: #fff;
    margin: 0 0 28px;
    max-width: 60ch;
}
.rkx-quotes__cite {
    display: flex;
    align-items: center;
    gap: 14px;
}
.rkx-quotes__avatar {
    width: 44px; height: 44px;
    background: linear-gradient(135deg, rgba(29,36,202,0.35), rgba(255,255,255,0.05));
    border: 1px solid rgba(29,36,202,0.4);
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}
.rkx-quotes__name { color: #fff; font-weight: 600; font-size: 14px; }
.rkx-quotes__role { color: var(--rkx-page-muted); font-size: 12.5px; margin-top: 2px; }
.rkx-quotes__nav {
    position: absolute;
    bottom: 24px;
    right: 24px;
    display: inline-flex;
    gap: 6px;
    z-index: 2;
}
.rkx-quotes__dot {
    width: 8px; height: 8px;
    background: rgba(255,255,255,0.25);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    transition: all 240ms ease;
}
.rkx-quotes__dot.is-active { background: #1D24CA; box-shadow: 0 0 10px rgba(29,36,202,0.6); transform: scale(1.3); }


/* === lost === */

.rkx-lost {
    position: relative;
    min-height: 480px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 30px;
    overflow: hidden;
}
.rkx-lost__stars {
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(1.5px 1.5px at 18% 22%, rgba(255,255,255,0.6), transparent),
        radial-gradient(1px 1px at 78% 14%, rgba(255,255,255,0.4), transparent),
        radial-gradient(1.5px 1.5px at 42% 88%, rgba(29,36,202,0.7), transparent),
        radial-gradient(1px 1px at 88% 64%, rgba(255,255,255,0.45), transparent),
        radial-gradient(2px 2px at 24% 56%, rgba(29,36,202,0.6), transparent),
        radial-gradient(1px 1px at 64% 32%, rgba(255,255,255,0.3), transparent);
    animation: rkx-lost-drift 16s ease-in-out infinite alternate;
    pointer-events: none;
}
@keyframes rkx-lost-drift {
    from { transform: translate(0,0) scale(1); }
    to   { transform: translate(-12px,8px) scale(1.05); }
}
.rkx-lost__code {
    position: relative;
    font-family: var(--rkx-font-mono);
    font-size: clamp(96px, 18vw, 220px);
    font-weight: 700;
    line-height: 1;
    color: transparent;
    -webkit-text-stroke: 1.5px #1D24CA;
    margin-bottom: 4px;
    letter-spacing: -0.04em;
    animation: rkx-lost-glow 3s ease-in-out infinite alternate;
}
@keyframes rkx-lost-glow {
    from { filter: drop-shadow(0 0 0 rgba(29,36,202,0)); }
    to   { filter: drop-shadow(0 0 28px rgba(29,36,202,0.55)); }
}
.rkx-lost__satellite {
    position: absolute;
    width: 40px; height: 40px;
    color: var(--rkx-accent-tx);
    animation: rkx-lost-orbit 14s linear infinite;
    top: 50%;
    left: 50%;
    transform-origin: 0 -120px;
}
.rkx-lost__satellite svg { width: 100%; height: 100%; filter: drop-shadow(0 0 12px rgba(29,36,202,0.7)); }
@keyframes rkx-lost-orbit {
    from { transform: rotate(0deg) translate(-50%,-50%); }
    to   { transform: rotate(360deg) translate(-50%,-50%); }
}
.rkx-lost__h2 {
    position: relative;
    font-size: clamp(24px, 3vw, 36px);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #fff;
    margin: 0 0 14px;
}
.rkx-lost__h2 span { color: var(--rkx-accent-tx); }
.rkx-lost__desc {
    position: relative;
    font-size: 14.5px;
    color: var(--rkx-page-muted);
    max-width: 50ch;
    margin: 0 0 32px;
    line-height: 1.55;
}
.rkx-lost__actions {
    position: relative;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
}
.rkx-lost__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 46px;
    padding: 0 20px;
    border-radius: 1px;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    transition: all 200ms ease;
}
.rkx-lost__btn--p { background: #1D24CA; border: 1px solid rgba(29,36,202,0.55); }
.rkx-lost__btn--p:hover { background: #1a6fff; box-shadow: 0 0 20px rgba(29,36,202,0.55); }
.rkx-lost__btn--g { background: rgba(255,255,255,0.04); border: 1px solid var(--rkx-page-line-strong); }
.rkx-lost__btn--g:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.28); }


/* === success === */

.rkx-success {
    text-align: center;
    padding: 60px 30px;
    position: relative;
}
.rkx-success__check {
    width: 88px; height: 88px;
    margin: 0 auto 24px;
    background: rgba(29,36,202,0.15);
    border: 1px solid rgba(29,36,202,0.5);
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: var(--rkx-accent-tx);
    box-shadow: 0 0 40px rgba(29,36,202,0.4);
    animation: rkx-suc-pop 700ms cubic-bezier(0.34,1.56,0.64,1);
    position: relative;
}
@keyframes rkx-suc-pop {
    0% { transform: scale(0.5); opacity: 0; }
    60%{ transform: scale(1.15); opacity: 1; }
    100% { transform: scale(1); }
}
.rkx-success__check::before,
.rkx-success__check::after {
    content: '';
    position: absolute;
    inset: -8px;
    border: 1px solid rgba(29,36,202,0.45);
    border-radius: 50%;
    animation: rkx-suc-ripple 2.4s ease-out infinite;
}
.rkx-success__check::after { animation-delay: 1.2s; }
@keyframes rkx-suc-ripple {
    0% { transform: scale(1); opacity: 0.8; }
    100% { transform: scale(1.8); opacity: 0; }
}
.rkx-success__check svg { width: 36px; height: 36px; }
.rkx-success__h2 {
    font-size: clamp(28px, 3.5vw, 42px);
    font-weight: 700;
    letter-spacing: -0.025em;
    color: #fff;
    margin: 0 0 14px;
}
.rkx-success__h2 span { color: var(--rkx-accent-tx); }
.rkx-success__desc {
    font-size: 15.5px;
    color: var(--rkx-page-muted);
    max-width: 56ch;
    margin: 0 auto 32px;
    line-height: 1.55;
}
.rkx-success__summary {
    max-width: 380px;
    margin: 0 auto 32px;
    border-top: 1px solid var(--rkx-page-line);
    border-bottom: 1px solid var(--rkx-page-line);
    text-align: left;
}
.rkx-success__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 12px 0;
    border-bottom: 1px dashed var(--rkx-page-line);
}
.rkx-success__row:last-child { border-bottom: none; }
.rkx-success__row dt {
    font-family: var(--rkx-font-mono);
    font-size: 10px;
    letter-spacing: 0.14em;
    color: var(--rkx-page-dim);
    text-transform: uppercase;
    margin: 0;
}
.rkx-success__row dd {
    font-size: 13.5px;
    color: #fff;
    margin: 0;
    font-weight: 500;
}
.rkx-success__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
}
.rkx-success__actions a {
    padding: 12px 20px;
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--rkx-page-line-strong);
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    border-radius: 1px;
    transition: all 200ms ease;
}
.rkx-success__actions a:hover { background: rgba(29,36,202,0.12); border-color: rgba(29,36,202,0.45); }


/* === audit === */
.rkx-audit { padding-block: clamp(60px, 9vw, 130px); }

.rkx-audit__card {
    position: relative;
    overflow: hidden;
    padding: clamp(36px, 5vw, 72px);
    border: 1px solid rgba(29,36,202,0.30);
    background:
        linear-gradient(135deg, rgba(29,36,202,0.10) 0%, rgba(8,10,22,0.6) 55%, rgba(29,36,202,0.06) 100%);
    box-shadow:
        0 30px 90px -30px rgba(29,36,202,0.4),
        0 0 0 1px rgba(255,255,255,0.04) inset;
    backdrop-filter: blur(14px) saturate(1.3);
    -webkit-backdrop-filter: blur(14px) saturate(1.3);
}

.rkx-audit__bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 88% 0%, rgba(29,36,202,0.45) 0%, transparent 50%),
        radial-gradient(circle at 5% 100%, rgba(29,36,202,0.20) 0%, transparent 55%);
    pointer-events: none;
    z-index: 0;
    animation: rkx-audit-bg 14s ease-in-out infinite alternate;
}

.rkx-audit__inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(32px, 4vw, 64px);
    align-items: start;
}

@media (max-width: 1023px) { .rkx-audit__inner { grid-template-columns: 1fr; } }

.rkx-audit__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    margin-bottom: 22px;
    background: rgba(29,36,202,0.18);
    border: 1px solid rgba(29,36,202,0.45);
    color: #fff;
    font-family: 'Poppins', sans-serif;
    font-size: 11px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    border-radius: 1px;
}

.rkx-audit__eyebrow-dot {
    width: 7px; height: 7px;
    border-radius: 50%;
    background: #4ade80;
    box-shadow: 0 0 10px #4ade80;
    animation: rkx-pulse-dot 2.2s ease-in-out infinite;
}

.rkx-audit__title { margin: 0 0 18px; }

.rkx-audit__desc {
    font-size: clamp(14.5px, 1.1vw, 17px);
    line-height: 1.6;
    color: rgba(255,255,255,0.7);
    margin: 0 0 24px;
    max-width: 52ch;
}

.rkx-audit__checks {
    list-style: none;
    margin: 0;
    padding: 22px 0 0;
    border-top: 1px solid rgba(255,255,255,0.08);
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.rkx-audit__checks li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    line-height: 1.5;
    color: rgba(255,255,255,0.78);
}

.rkx-audit__check {
    flex-shrink: 0;
    width: 20px; height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(29,36,202,0.2);
    border: 1px solid rgba(29,36,202,0.5);
    color: var(--rkx-accent-tx);
    font-size: 11px;
    font-weight: 700;
    margin-top: 2px;
}

.rkx-audit__form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.rkx-audit__field {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.rkx-audit__field--wide { grid-column: 1 / -1; }

.rkx-audit__lbl {
    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.55);
}

.rkx-audit__field input,
.rkx-audit__field select,
.rkx-audit__field textarea {
    width: 100%;
    padding: 12px 14px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.12);
    color: #fff;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    border-radius: 1px;
    transition: border-color 200ms ease, background 200ms ease, box-shadow 200ms ease;
}

.rkx-audit__field input::placeholder,
.rkx-audit__field textarea::placeholder { color: rgba(255,255,255,0.3); }

.rkx-audit__field input:focus,
.rkx-audit__field select:focus,
.rkx-audit__field textarea:focus {
    outline: none;
    border-color: rgba(29,36,202,0.7);
    background: rgba(29,36,202,0.06);
    box-shadow: 0 0 16px rgba(29,36,202,0.2);
}

.rkx-audit__submit {
    grid-column: 1 / -1;
    justify-content: center;
    height: 52px;
    margin-top: 6px;
}

.rkx-audit__consent {
    grid-column: 1 / -1;
    font-family: 'Poppins', sans-serif;
    font-size: 11px;
    color: rgba(255,255,255,0.4);
    margin: 4px 0 0;
    letter-spacing: 0.04em;
}

.rkx-audit__consent a {
    color: var(--rkx-accent-tx);
    border-bottom: 1px solid rgba(29,36,202,0.4);
}

@media (max-width: 639px) {
    .rkx-audit__form { grid-template-columns: 1fr; }
    .rkx-audit__card { padding: 28px 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .rkx-audit__bg { animation: none; }
}

/* RESP AUDIT */
@media (max-width: 479px) {
    .rkx-audit__card { padding: 24px 18px; }
    .rkx-audit__form { grid-template-columns: 1fr !important; gap: 11px; }
    .rkx-audit__title { font-size: 24px !important; }
    .rkx-audit__desc { font-size: 13.5px; }
    .rkx-audit__checks li { font-size: 13px; }
    .rkx-audit__field input, .rkx-audit__field select, .rkx-audit__field textarea { padding: 10px 12px; font-size: 13px; }
}
@media (min-width: 1920px) { .rkx-audit__card { padding: 80px; } .rkx-audit__title { font-size: 52px !important; } .rkx-audit__desc { font-size: 19px; } .rkx-audit__checks li { font-size: 16px; } .rkx-audit__field input, .rkx-audit__field select, .rkx-audit__field textarea { padding: 16px 18px; font-size: 16px; } .rkx-audit__submit { height: 60px !important; font-size: 16px; } }
@media (min-width: 2560px) { .rkx-audit__card { padding: 110px; } .rkx-audit__title { font-size: 64px !important; } .rkx-audit__desc { font-size: 22px; } }
@media (min-width: 3840px) { .rkx-audit__card { padding: 160px; } .rkx-audit__title { font-size: 88px !important; } .rkx-audit__desc { font-size: 28px; } .rkx-audit__field input { padding: 22px; font-size: 20px; } .rkx-audit__submit { height: 76px !important; font-size: 20px; } }


/* === booking === */
body.rkx-book-locked { overflow: hidden; }

.rkx-book {
    position: fixed;
    inset: 0;
    z-index: 10000;
    opacity: 0;
    pointer-events: none;
    transition: opacity 360ms cubic-bezier(0.22,1,0.36,1);
    font-family: 'Inter', sans-serif;
}

.rkx-book.is-open { opacity: 1; pointer-events: auto; }

.rkx-book__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(2, 4, 12, 0.7);
    backdrop-filter: blur(18px) saturate(1.4);
    -webkit-backdrop-filter: blur(18px) saturate(1.4);
}

.rkx-book__shell {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.96);
    width: min(720px, 94vw);
    max-height: 92vh;
    background:
        linear-gradient(135deg, rgba(29,36,202,0.10) 0%, rgba(8,10,22,0.85) 60%),
        rgba(8,10,22,0.85);
    border: 1px solid rgba(255,255,255,0.12);
    backdrop-filter: blur(28px) saturate(1.6);
    -webkit-backdrop-filter: blur(28px) saturate(1.6);
    box-shadow:
        0 50px 120px -30px rgba(29,36,202,0.45),
        0 30px 80px -20px rgba(0,0,0,0.8),
        0 0 0 1px rgba(255,255,255,0.05) inset;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: transform 480ms cubic-bezier(0.34,1.56,0.64,1), opacity 360ms ease;
}

.rkx-book.is-open .rkx-book__shell { transform: translate(-50%, -50%) scale(1); }

.rkx-book__noise {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.05;
    mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
    z-index: 0;
}

.rkx-book__head {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
    padding: 18px 22px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    background: linear-gradient(180deg, rgba(255,255,255,0.025) 0%, transparent 100%);
    position: relative;
    z-index: 1;
}

.rkx-book__brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.rkx-book__brand-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: #4ade80;
    box-shadow: 0 0 10px #4ade80;
    animation: rkx-pulse-dot 2.2s ease-in-out infinite;
}

.rkx-book__brand-text {
    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    letter-spacing: 0.18em;
    color: rgba(255,255,255,0.85);
}

.rkx-book__steps {
    display: inline-flex;
    align-items: center;
    gap: 0;
}

.rkx-book__step {
    width: 28px; height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    letter-spacing: 0.08em;
    color: rgba(255,255,255,0.4);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 50%;
    background: rgba(255,255,255,0.025);
    transition: all 240ms ease;
}

.rkx-book__step.is-active {
    color: #fff;
    background: #1D24CA;
    border-color: rgba(29,36,202,0.8);
    box-shadow: 0 0 14px rgba(29,36,202,0.6);
}

.rkx-book__step.is-done {
    color: var(--rkx-accent-tx);
    border-color: rgba(29,36,202,0.4);
    background: rgba(29,36,202,0.10);
}

.rkx-book__step-line {
    width: 22px;
    height: 1px;
    background: rgba(255,255,255,0.10);
    margin: 0 4px;
}

.rkx-book__close {
    margin-left: auto;
    width: 36px; height: 36px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.12);
    color: rgba(255,255,255,0.75);
    cursor: pointer;
    border-radius: 1px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 200ms ease;
}

.rkx-book__close:hover {
    background: rgba(255,255,255,0.08);
    border-color: rgba(255,255,255,0.28);
    color: #fff;
    transform: rotate(90deg);
}

.rkx-book__close svg { width: 16px; height: 16px; }

.rkx-book__body {
    flex: 1;
    overflow-y: auto;
    padding: 28px 28px 16px;
    position: relative;
    z-index: 1;
}

.rkx-book__body--anim {
    animation: rkx-book-step-in 380ms cubic-bezier(0.22,1,0.36,1);
}

.rkx-book__title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(20px, 2.6vw, 28px);
    font-weight: 700;
    letter-spacing: -0.025em;
    color: #fff;
    margin: 0 0 6px;
    line-height: 1.15;
}

.rkx-book__sub {
    font-size: 14px;
    color: rgba(255,255,255,0.55);
    margin: 0 0 22px;
    line-height: 1.5;
}

.rkx-book__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.rkx-book__card {
    position: relative;
    text-align: left;
    padding: 14px 16px;
    background: rgba(255,255,255,0.025);
    border: 1px solid rgba(255,255,255,0.08);
    color: #fff;
    cursor: pointer;
    transition: all 220ms cubic-bezier(0.4,0,0.2,1);
    display: flex;
    flex-direction: column;
    gap: 6px;
    overflow: hidden;
    border-radius: 1px;
}

.rkx-book__card:hover {
    background: rgba(255,255,255,0.05);
    border-color: rgba(29,36,202,0.4);
    transform: translateY(-2px);
}

.rkx-book__card.is-selected {
    background: rgba(29,36,202,0.18);
    border-color: rgba(29,36,202,0.7);
    box-shadow: 0 0 24px rgba(29,36,202,0.35) inset, 0 0 0 1px rgba(29,36,202,0.35);
}

.rkx-book__card-icon {
    width: 28px; height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--rkx-accent-tx);
    background: rgba(29,36,202,0.15);
    border: 1px solid rgba(29,36,202,0.3);
    border-radius: 1px;
}

.rkx-book__card-icon svg { width: 16px; height: 16px; }

.rkx-book__card-name {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: #fff;
}

.rkx-book__card-desc {
    font-size: 12px;
    color: rgba(255,255,255,0.55);
    line-height: 1.4;
}

.rkx-book__card-check {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 20px; height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #1D24CA;
    border-radius: 50%;
    color: #fff;
    opacity: 0;
    transform: scale(0.6);
    transition: all 280ms cubic-bezier(0.34,1.56,0.64,1);
}

.rkx-book__card-check svg { width: 11px; height: 11px; }

.rkx-book__card.is-selected .rkx-book__card-check { opacity: 1; transform: scale(1); }

.rkx-book__cal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0 14px;
    margin-bottom: 8px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
}

.rkx-book__cal-title {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
}

.rkx-book__cal-nav {
    width: 32px; height: 32px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.12);
    color: #fff;
    cursor: pointer;
    border-radius: 1px;
    font-size: 16px;
    line-height: 1;
    transition: all 200ms;
}

.rkx-book__cal-nav:hover:not(:disabled) {
    background: rgba(29,36,202,0.2);
    border-color: rgba(29,36,202,0.5);
}

.rkx-book__cal-nav:disabled { opacity: 0.3; cursor: not-allowed; }

.rkx-book__cal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}

.rkx-book__cal-dow {
    text-align: center;
    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    letter-spacing: 0.14em;
    color: rgba(255,255,255,0.35);
    padding: 8px 0;
}

.rkx-book__cal-cell {
    aspect-ratio: 1;
    background: rgba(255,255,255,0.025);
    border: 1px solid rgba(255,255,255,0.05);
    color: #fff;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 500;
    border-radius: 1px;
    transition: all 180ms ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rkx-book__cal-cell--blank {
    background: transparent;
    border-color: transparent;
    cursor: default;
}

.rkx-book__cal-cell:hover:not(:disabled):not(.rkx-book__cal-cell--blank) {
    background: rgba(29,36,202,0.15);
    border-color: rgba(29,36,202,0.4);
    transform: scale(1.08);
}

.rkx-book__cal-cell.is-disabled {
    color: rgba(255,255,255,0.18);
    cursor: not-allowed;
    background: transparent;
    border-color: transparent;
}

.rkx-book__cal-cell.is-today {
    border-color: rgba(29,36,202,0.4);
    color: var(--rkx-accent-tx);
}

.rkx-book__cal-cell.is-selected {
    background: #1D24CA !important;
    border-color: #1D24CA !important;
    color: #fff !important;
    box-shadow: 0 0 20px rgba(29,36,202,0.5);
    transform: scale(1.04);
}

.rkx-book__hint {
    font-family: 'Poppins', sans-serif;
    font-size: 11px;
    color: rgba(255,255,255,0.35);
    margin: 14px 0 0;
    letter-spacing: 0.04em;
}

.rkx-book__slots-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
}

.rkx-book__slots-lbl {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    letter-spacing: 0.16em;
    color: rgba(255,255,255,0.55);
    margin-bottom: 10px;
    text-transform: uppercase;
}

.rkx-book__slots-lbl svg { width: 14px; height: 14px; color: var(--rkx-accent-tx); }

.rkx-book__slots {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}

.rkx-book__slot {
    padding: 10px 0;
    background: rgba(255,255,255,0.025);
    border: 1px solid rgba(255,255,255,0.08);
    color: #fff;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    border-radius: 1px;
    font-feature-settings: 'tnum';
    transition: all 180ms;
}

.rkx-book__slot:hover {
    background: rgba(29,36,202,0.15);
    border-color: rgba(29,36,202,0.45);
}

.rkx-book__slot.is-selected {
    background: #1D24CA;
    border-color: #1D24CA;
    color: #fff;
    box-shadow: 0 0 18px rgba(29,36,202,0.5);
}

.rkx-book__form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.rkx-book__field {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.rkx-book__field--wide { grid-column: 1 / -1; }

.rkx-book__field-lbl {
    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    letter-spacing: 0.14em;
    color: rgba(255,255,255,0.55);
    text-transform: uppercase;
}

.rkx-book__field input,
.rkx-book__field textarea {
    width: 100%;
    padding: 11px 14px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.10);
    color: #fff;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    border-radius: 1px;
    transition: all 200ms;
    resize: vertical;
}

.rkx-book__field input:focus,
.rkx-book__field textarea:focus {
    outline: none;
    border-color: rgba(29,36,202,0.7);
    background: rgba(29,36,202,0.06);
    box-shadow: 0 0 16px rgba(29,36,202,0.2);
}

.rkx-book__consent {
    grid-column: 1 / -1;
    font-family: 'Poppins', sans-serif;
    font-size: 11px;
    color: rgba(255,255,255,0.4);
    margin: 4px 0 0;
}

.rkx-book__consent a { color: var(--rkx-accent-tx); text-decoration: underline; }

.rkx-book__confirm { text-align: center; padding: 22px 0 8px; }

.rkx-book__confirm-check {
    width: 64px; height: 64px;
    margin: 0 auto 20px;
    background: rgba(29,36,202,0.18);
    border: 1px solid rgba(29,36,202,0.5);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--rkx-accent-tx);
    box-shadow: 0 0 30px rgba(29,36,202,0.4);
    animation: rkx-book-check-in 600ms cubic-bezier(0.34,1.56,0.64,1);
}

.rkx-book__confirm-check svg { width: 28px; height: 28px; }

.rkx-book__confirm-summary {
    margin: 20px auto;
    max-width: 360px;
    text-align: left;
    border-top: 1px solid rgba(255,255,255,0.08);
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.rkx-book__confirm-summary > div {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 10px 0;
    border-bottom: 1px dashed rgba(255,255,255,0.06);
}

.rkx-book__confirm-summary > div:last-child { border-bottom: none; }

.rkx-book__confirm-summary dt {
    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    letter-spacing: 0.14em;
    color: rgba(255,255,255,0.4);
    text-transform: uppercase;
    margin: 0;
}

.rkx-book__confirm-summary dd {
    font-size: 13.5px;
    color: #fff;
    margin: 0;
    font-weight: 500;
    text-align: right;
}

.rkx-book__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 22px;
    border-top: 1px solid rgba(255,255,255,0.06);
    background: linear-gradient(0deg, rgba(255,255,255,0.025) 0%, transparent 100%);
    position: relative;
    z-index: 1;
}

.rkx-book__summary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Poppins', sans-serif;
    font-size: 11px;
    letter-spacing: 0.04em;
    color: rgba(255,255,255,0.6);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rkx-book__summary svg { width: 13px; height: 13px; color: var(--rkx-accent-tx); }

.rkx-book__sep { color: rgba(255,255,255,0.25); padding: 0 2px; }

.rkx-book__actions {
    display: inline-flex;
    gap: 8px;
}

.rkx-book__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.12);
    color: #fff;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 1px;
    transition: all 200ms;
}

.rkx-book__btn svg { width: 12px; height: 12px; }

.rkx-book__btn--ghost:hover {
    background: rgba(255,255,255,0.08);
    border-color: rgba(255,255,255,0.28);
}

.rkx-book__btn--primary {
    background: #1D24CA;
    border-color: rgba(29,36,202,0.6);
    box-shadow: 0 0 16px rgba(29,36,202,0.3);
}

.rkx-book__btn--primary:hover:not(.is-disabled) {
    background: #1a6fff;
    box-shadow: 0 0 24px rgba(29,36,202,0.5);
}

.rkx-book__btn.is-disabled,
.rkx-book__btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
}

@media (max-width: 639px) {
    .rkx-book__shell {
        width: 100%;
        height: 100%;
        max-height: 100%;
        top: 0; left: 0;
        transform: translate(0, 100%) scale(1);
        border-radius: 1px;
        border-left: none;
        border-right: none;
        border-bottom: none;
    }
    .rkx-book.is-open .rkx-book__shell {
        transform: translate(0, 0) scale(1);
    }
    .rkx-book__head { padding: 14px 16px; grid-template-columns: 1fr auto; }
    .rkx-book__steps { display: none !important; }
    .rkx-book__body { padding: 22px 18px 14px; }
    .rkx-book__grid { grid-template-columns: 1fr; }
    .rkx-book__form { grid-template-columns: 1fr; }
    .rkx-book__slots-wrap { grid-template-columns: 1fr; gap: 16px; }
    .rkx-book__cal-cell { font-size: 12px; }
    .rkx-book__foot { flex-direction: column-reverse; align-items: stretch; padding: 14px 16px; }
    .rkx-book__summary { justify-content: center; }
    .rkx-book__actions { width: 100%; }
    .rkx-book__btn { flex: 1; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
    .rkx-book__shell, .rkx-book__body--anim, .rkx-book__confirm-check,
    .rkx-book__brand-dot, .rkx-book__close { animation: none !important; transition: none !important; }
}

/* === tech-stack === */
/* Tech stack — categorised grid with logo tiles
   Logos served from simpleicons.org CDN */

.rkx-tech-wrap { display: flex; flex-direction: column; gap: 28px; }

.rkx-tech-cat__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    padding: 0 0 10px;
    border-bottom: 1px solid var(--rkx-page-line);
    margin-bottom: 14px;
}
.rkx-tech-cat__name {
    font-family: var(--rkx-font-mono);
    font-size: 11px;
    letter-spacing: 0.18em;
    color: var(--rkx-accent-tx);
    text-transform: uppercase;
}
.rkx-tech-cat__count {
    font-family: var(--rkx-font-mono);
    font-size: 10px;
    letter-spacing: 0.12em;
    color: var(--rkx-page-dim);
}

.rkx-tech {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    gap: 1px;
    background: var(--rkx-page-line);
    border: 1px solid var(--rkx-page-line);
}

/* ============================================================
   LOGO-DRIVEN HOVER — logo is the animated centrepiece
   Glass overlay removed. Subtle tile lift + bold logo motion.
   ============================================================ */
.rkx-tech__item {
    position: relative;
    background: rgba(8,10,22,0.55);
    padding: 24px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
    overflow: hidden;
    border: 1px solid transparent;
    transition:
        background 600ms cubic-bezier(0.16, 1, 0.3, 1),
        border-color 600ms cubic-bezier(0.16, 1, 0.3, 1);
}
.rkx-tech__item:hover {
    background: rgba(12, 14, 30, 0.7);
    border-color: var(--c, rgba(29,36,202,0.4));
}

/* (kept .rkx-tech__shine in DOM but hidden, since markup references it) */
.rkx-tech__shine { display: none; }

/* ============================================================
   LOGO — the star of the show
   Idle: gentle perpetual float (sub-second loop)
   Hover: bouncy pop, slight tilt, gentle wobble, drop shadow
   ============================================================ */
.rkx-tech__logo {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    position: relative;
    z-index: 3;
    transform-style: preserve-3d;
}

.rkx-tech__logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    transform: translate3d(0, 0, 0);
    transition:
        transform 700ms cubic-bezier(0.34, 1.56, 0.64, 1),
        filter 700ms cubic-bezier(0.16, 1, 0.3, 1);
    animation: rkx-logo-float 4.6s ease-in-out infinite;
}

/* Idle perpetual float — barely-there 2px breathe */
@keyframes rkx-logo-float {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50%      { transform: translate3d(0, -2px, 0); }
}

/* On hover: stop the idle float, run the pop+wobble animation */
.rkx-tech__item:hover .rkx-tech__logo img {
    animation: rkx-logo-pop 900ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards,
               rkx-logo-wobble 1800ms ease-in-out 900ms infinite;
    filter: drop-shadow(0 6px 18px var(--c, rgba(29,36,202,0.7)));
}

/* The pop: 1 → 1.32 → 1.18 (springy overshoot, then settle) */
@keyframes rkx-logo-pop {
    0%   { transform: translate3d(0, 0, 0) scale(1) rotate(0deg); }
    30%  { transform: translate3d(0, -4px, 0) scale(1.34) rotate(-6deg); }
    55%  { transform: translate3d(0, -6px, 0) scale(1.14) rotate(4deg); }
    75%  { transform: translate3d(0, -8px, 0) scale(1.22) rotate(-2deg); }
    100% { transform: translate3d(0, -8px, 0) scale(1.20) rotate(0deg); }
}

/* Soft hover wobble after pop settles — gentle figure-8 */
@keyframes rkx-logo-wobble {
    0%, 100% { transform: translate3d(0, -8px, 0) scale(1.20) rotate(0deg); }
    25%      { transform: translate3d(-2px, -8px, 0) scale(1.20) rotate(-3deg); }
    50%      { transform: translate3d(0, -10px, 0) scale(1.22) rotate(0deg); }
    75%      { transform: translate3d(2px, -8px, 0) scale(1.20) rotate(3deg); }
}

/* Reflection underneath the logo — appears on hover */
.rkx-tech__logo::after {
    content: '';
    position: absolute;
    bottom: -6px;
    left: 50%;
    width: 60%;
    height: 6px;
    background: radial-gradient(ellipse, var(--c, rgba(29,36,202,0.6)) 0%, transparent 70%);
    transform: translateX(-50%) scaleX(0.4);
    opacity: 0;
    filter: blur(4px);
    transition:
        opacity 700ms cubic-bezier(0.16, 1, 0.3, 1),
        transform 900ms cubic-bezier(0.34, 1.56, 0.64, 1);
    pointer-events: none;
}
.rkx-tech__item:hover .rkx-tech__logo::after {
    opacity: 1;
    transform: translateX(-50%) scaleX(1);
}

/* Text */
.rkx-tech__name {
    font-size: 13.5px;
    font-weight: 600;
    color: rgba(255,255,255,0.78);
    letter-spacing: -0.01em;
    line-height: 1.2;
    position: relative;
    z-index: 3;
    transition: color 600ms cubic-bezier(0.16, 1, 0.3, 1);
}
.rkx-tech__item:hover .rkx-tech__name { color: #fff; }

.rkx-tech__cat {
    font-family: var(--rkx-font-mono);
    font-size: 9px;
    letter-spacing: 0.12em;
    color: var(--rkx-page-dim);
    text-transform: uppercase;
    position: relative;
    z-index: 3;
}

/* Broken-logo fallback monogram */
.rkx-tech__item[data-broken="1"] .rkx-tech__logo {
    background: rgba(29,36,202,0.16);
    border: 1px solid rgba(29,36,202,0.4);
    color: var(--rkx-accent-tx);
    font-family: var(--rkx-font-mono);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 36px;
}

/* RESPONSIVE */
@media (max-width: 479px) {
    .rkx-tech { grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); }
    .rkx-tech__item { padding: 16px 8px; gap: 7px; }
    .rkx-tech__logo { width: 28px; height: 28px; }
    .rkx-tech__name { font-size: 11.5px; }
    .rkx-tech__cat { font-size: 8px; }
    .rkx-tech-cat__name { font-size: 10px; }
}
@media (min-width: 1920px) {
    .rkx-tech__item { padding: 36px 20px; gap: 14px; }
    .rkx-tech__logo { width: 52px; height: 52px; }
    .rkx-tech__name { font-size: 16px; }
    .rkx-tech-cat__name { font-size: 14px; }
}
@media (min-width: 2560px) {
    .rkx-tech__item { padding: 48px 28px; gap: 18px; }
    .rkx-tech__logo { width: 64px; height: 64px; }
    .rkx-tech__name { font-size: 20px; }
    .rkx-tech__cat { font-size: 13px; }
    .rkx-tech-cat__name { font-size: 17px; }
}
@media (min-width: 3840px) {
    .rkx-tech__item { padding: 72px 40px; gap: 24px; }
    .rkx-tech__logo { width: 96px; height: 96px; }
    .rkx-tech__name { font-size: 28px; }
    .rkx-tech__cat { font-size: 18px; }
    .rkx-tech-cat__name { font-size: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .rkx-tech__logo img,
    .rkx-tech__item:hover .rkx-tech__logo img,
    .rkx-tech__logo::after,
    .rkx-tech__name,
    .rkx-tech__item { animation: none !important; transition: none !important; }
}


/* === contact-info === */

.rkx-contact-info { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--rkx-page-line); border: 1px solid var(--rkx-page-line); }
@media(max-width:767px){.rkx-contact-info{grid-template-columns:1fr;}}
.rkx-ci { background: rgba(8,10,22,0.5); padding: 26px; display: flex; flex-direction: column; gap: 8px; position: relative; transition: background 280ms ease; }
.rkx-ci:hover { background: rgba(12,16,30,0.7); }
.rkx-ci__icon { width: 36px; height: 36px; display: grid; place-items: center; color: var(--rkx-accent-tx); background: rgba(29,36,202,0.12); border: 1px solid rgba(29,36,202,0.35); margin-bottom: 6px; transition: transform 320ms cubic-bezier(0.34,1.56,0.64,1); }
.rkx-ci:hover .rkx-ci__icon { transform: rotate(-8deg) scale(1.08); }
.rkx-ci__icon svg { width: 18px; height: 18px; }
.rkx-ci__lbl { font-family: var(--rkx-font-mono); font-size: 10px; letter-spacing: 0.14em; color: var(--rkx-page-dim); text-transform: uppercase; }
.rkx-ci__val { color: #fff; font-size: 15px; font-weight: 500; }
.rkx-ci__val a { color: inherit; border-bottom: 1px dashed rgba(255,255,255,0.25); text-decoration: none; transition: all 200ms ease; }
.rkx-ci__val a:hover { color: var(--rkx-accent-tx); border-bottom-color: var(--rkx-accent-tx); }


/* === newsletter === */

.rkx-news { padding: clamp(28px, 4vw, 48px); border: 1px solid rgba(29,36,202,0.35); background: linear-gradient(135deg, rgba(29,36,202,0.10) 0%, rgba(8,10,22,0.55) 70%); display: grid; grid-template-columns: 1.2fr 1fr; gap: 32px; align-items: center; position: relative; overflow: hidden; }
@media(max-width:767px){.rkx-news{grid-template-columns:1fr;}}
.rkx-news::before { content: ''; position: absolute; top: -40%; right: -10%; width: 280px; height: 280px; background: radial-gradient(circle, rgba(29,36,202,0.3) 0%, transparent 65%); pointer-events: none; animation: rkx-news-drift 12s ease-in-out infinite alternate; }
@keyframes rkx-news-drift { from { transform: translate(0,0); } to { transform: translate(-20px, 12px) scale(1.1); } }
.rkx-news__copy { position: relative; z-index: 1; }
.rkx-news__eyebrow { font-family: var(--rkx-font-mono); font-size: 11px; letter-spacing: 0.16em; color: var(--rkx-accent-tx); text-transform: uppercase; margin-bottom: 12px; display: inline-block; }
.rkx-news__title { font-size: clamp(22px, 2.5vw, 32px); font-weight: 700; letter-spacing: -0.025em; line-height: 1.1; color: #fff; margin: 0 0 12px; }
.rkx-news__desc { font-size: 14.5px; line-height: 1.55; color: var(--rkx-page-muted); margin: 0; max-width: 44ch; }
.rkx-news__form { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 10px; }
.rkx-news__field { display: flex; gap: 6px; }
.rkx-news__input { flex: 1; padding: 13px 16px; background: rgba(255,255,255,0.04); border: 1px solid var(--rkx-page-line-strong); color: #fff; font-family: inherit; font-size: 14px; border-radius: 1px; transition: all 200ms ease; }
.rkx-news__input:focus { outline: none; border-color: rgba(29,36,202,0.6); background: rgba(29,36,202,0.06); box-shadow: 0 0 14px rgba(29,36,202,0.18); }
.rkx-news__input::placeholder { color: rgba(255,255,255,0.3); }
.rkx-news__btn { padding: 0 18px; background: #1D24CA; border: 1px solid rgba(29,36,202,0.6); color: #fff; font-family: inherit; font-size: 13px; font-weight: 600; cursor: pointer; border-radius: 1px; transition: all 200ms ease; box-shadow: 0 0 16px rgba(29,36,202,0.3); }
.rkx-news__btn:hover { background: #1a6fff; box-shadow: 0 0 24px rgba(29,36,202,0.55); }
.rkx-news__small { font-family: var(--rkx-font-mono); font-size: 10px; letter-spacing: 0.06em; color: var(--rkx-page-dim); }


/* === estimator === */

.rkx-estim { display: grid; grid-template-columns: 1.2fr 1fr; gap: 1px; background: var(--rkx-page-line); border: 1px solid var(--rkx-page-line); }
@media(max-width:1023px){.rkx-estim{grid-template-columns:1fr;}}
.rkx-estim__form { background: rgba(8,10,22,0.5); padding: 28px; display: flex; flex-direction: column; gap: 22px; }
.rkx-estim__group { display: flex; flex-direction: column; gap: 8px; }
.rkx-estim__lbl { font-family: var(--rkx-font-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--rkx-page-muted); display: flex; justify-content: space-between; align-items: center; }
.rkx-estim__lbl b { color: var(--rkx-accent-tx); font-weight: 600; font-feature-settings: 'tnum'; }
.rkx-estim__chips { display: flex; gap: 6px; flex-wrap: wrap; }
.rkx-estim__chip { padding: 8px 14px; background: rgba(255,255,255,0.03); border: 1px solid var(--rkx-page-line); color: #fff; font-family: inherit; font-size: 13px; cursor: pointer; border-radius: 1px; transition: all 200ms ease; }
.rkx-estim__chip:hover { background: rgba(29,36,202,0.10); border-color: rgba(29,36,202,0.4); }
.rkx-estim__chip.is-on { background: rgba(29,36,202,0.18); border-color: rgba(29,36,202,0.6); color: #fff; box-shadow: 0 0 14px rgba(29,36,202,0.25); }
.rkx-estim__range { -webkit-appearance: none; appearance: none; width: 100%; height: 4px; background: rgba(255,255,255,0.08); border-radius: 1px; outline: none; }
.rkx-estim__range::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; background: #1D24CA; border-radius: 50%; cursor: pointer; box-shadow: 0 0 12px rgba(29,36,202,0.55); }
.rkx-estim__range::-moz-range-thumb { width: 18px; height: 18px; background: #1D24CA; border: none; border-radius: 50%; cursor: pointer; box-shadow: 0 0 12px rgba(29,36,202,0.55); }
.rkx-estim__result { background: linear-gradient(180deg, rgba(29,36,202,0.10) 0%, rgba(8,10,22,0.7) 70%); padding: 32px 28px; display: flex; flex-direction: column; justify-content: center; gap: 18px; position: relative; overflow: hidden; }
.rkx-estim__result::before { content: ''; position: absolute; top: -20%; right: -20%; width: 220px; height: 220px; background: radial-gradient(circle, rgba(29,36,202,0.35) 0%, transparent 65%); pointer-events: none; }
.rkx-estim__result-lbl { font-family: var(--rkx-font-mono); font-size: 10px; letter-spacing: 0.16em; color: var(--rkx-accent-tx); text-transform: uppercase; }
.rkx-estim__result-val { font-size: clamp(36px, 4.5vw, 56px); font-weight: 700; color: #fff; letter-spacing: -0.03em; line-height: 0.95; font-feature-settings: 'tnum'; }
.rkx-estim__result-val small { font-size: 0.4em; color: var(--rkx-page-muted); font-weight: 500; margin-left: 6px; }
.rkx-estim__result-note { font-size: 13px; color: var(--rkx-page-muted); line-height: 1.5; }
.rkx-estim__result-cta { display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; background: #1D24CA; color: #fff; text-decoration: none; font-size: 13px; font-weight: 600; border-radius: 1px; align-self: flex-start; transition: all 200ms ease; }
.rkx-estim__result-cta:hover { background: #1a6fff; box-shadow: 0 0 20px rgba(29,36,202,0.45); }


/* === compare === */

.rkx-comp { position: relative; aspect-ratio: 16/9; overflow: hidden; border: 1px solid var(--rkx-page-line-strong); user-select: none; cursor: ew-resize; }
.rkx-comp__pane { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: 'Inter', sans-serif; font-size: clamp(24px, 4vw, 48px); font-weight: 700; letter-spacing: -0.025em; }
.rkx-comp__pane--before { background: linear-gradient(135deg, rgba(255,255,255,0.04), rgba(255,255,255,0.01)); color: rgba(255,255,255,0.5); }
.rkx-comp__pane--after { background: linear-gradient(135deg, rgba(29,36,202,0.18), rgba(29,36,202,0.06)); color: #fff; clip-path: inset(0 0 0 var(--pos, 50%)); }
.rkx-comp__lbl { position: absolute; top: 18px; padding: 5px 11px; background: rgba(8,10,22,0.85); border: 1px solid var(--rkx-page-line-strong); font-family: var(--rkx-font-mono); font-size: 10px; letter-spacing: 0.14em; color: rgba(255,255,255,0.8); text-transform: uppercase; }
.rkx-comp__lbl--before { left: 18px; }
.rkx-comp__lbl--after { right: 18px; color: var(--rkx-accent-tx); border-color: rgba(29,36,202,0.4); }
.rkx-comp__handle { position: absolute; top: 0; bottom: 0; left: var(--pos, 50%); width: 2px; background: #1D24CA; box-shadow: 0 0 16px rgba(29,36,202,0.7); pointer-events: none; }
.rkx-comp__knob { position: absolute; top: 50%; left: var(--pos, 50%); width: 36px; height: 36px; background: #1D24CA; border: 2px solid #fff; border-radius: 50%; transform: translate(-50%, -50%); display: grid; place-items: center; color: #fff; font-family: var(--rkx-font-mono); font-weight: 700; pointer-events: none; box-shadow: 0 0 18px rgba(29,36,202,0.5); animation: rkx-comp-nudge 2.4s ease-in-out infinite; }
@keyframes rkx-comp-nudge { 0%,100% { transform: translate(-50%, -50%); } 50% { transform: translate(-50%, -50%) scale(1.08); } }


/* === feed === */

.rkx-feed { border: 1px solid var(--rkx-page-line); background: rgba(8,10,22,0.5); overflow: hidden; }
.rkx-feed__head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--rkx-page-line); }
.rkx-feed__title { display: inline-flex; align-items: center; gap: 10px; font-family: var(--rkx-font-mono); font-size: 11px; letter-spacing: 0.14em; color: #fff; text-transform: uppercase; }
.rkx-feed__dot { width: 7px; height: 7px; border-radius: 50%; background: #4ade80; box-shadow: 0 0 10px #4ade80; animation: rkx-pulse-dot 2.2s ease-in-out infinite; }
@keyframes rkx-pulse-dot { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.4; transform: scale(0.8); } }
.rkx-feed__count { font-family: var(--rkx-font-mono); font-size: 10px; color: var(--rkx-page-dim); letter-spacing: 0.1em; }
.rkx-feed__list { list-style: none; margin: 0; padding: 8px 0; max-height: 380px; overflow-y: auto; }
.rkx-feed__item { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; padding: 12px 18px; border-bottom: 1px solid var(--rkx-page-line); transition: background 200ms ease; }
.rkx-feed__item:hover { background: rgba(29,36,202,0.05); }
.rkx-feed__item:last-child { border-bottom: none; }
.rkx-feed__avatar { width: 32px; height: 32px; border-radius: 50%; background: linear-gradient(135deg, rgba(29,36,202,0.4), rgba(29,36,202,0.2)); display: grid; place-items: center; font-size: 12px; font-weight: 600; color: #fff; }
.rkx-feed__txt { font-size: 13.5px; color: var(--rkx-page-text); line-height: 1.4; }
.rkx-feed__txt b { color: #fff; font-weight: 600; }
.rkx-feed__txt em { color: var(--rkx-accent-tx); font-style: normal; }
.rkx-feed__time { font-family: var(--rkx-font-mono); font-size: 10px; color: var(--rkx-page-dim); letter-spacing: 0.06em; white-space: nowrap; }


/* === radial === */

.rkx-rad-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: clamp(20px, 3vw, 40px); }
.rkx-rad { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.rkx-rad__svg { width: 140px; height: 140px; position: relative; }
.rkx-rad__svg svg { transform: rotate(-90deg); }
.rkx-rad__track { stroke: var(--rkx-page-line); fill: none; stroke-width: 8; }
.rkx-rad__fill { stroke: #1D24CA; fill: none; stroke-width: 8; stroke-linecap: round; stroke-dasharray: 408; stroke-dashoffset: 408; filter: drop-shadow(0 0 12px rgba(29,36,202,0.5)); transition: stroke-dashoffset 1400ms cubic-bezier(0.22,1,0.36,1); }
.rkx-rad.is-in .rkx-rad__fill { stroke-dashoffset: var(--off, 100); }
.rkx-rad__centre { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; }
.rkx-rad__num { font-size: 28px; font-weight: 700; color: #fff; letter-spacing: -0.025em; font-feature-settings: 'tnum'; }
.rkx-rad__num small { font-size: 0.5em; color: var(--rkx-accent-tx); }
.rkx-rad__lbl { font-family: var(--rkx-font-mono); font-size: 10px; letter-spacing: 0.14em; color: var(--rkx-page-muted); text-transform: uppercase; text-align: center; max-width: 14ch; }


/* === scroll-bar === */

.rkx-scroll-demo { padding: 40px 28px; }
.rkx-scroll-bar { position: fixed; top: 0; left: 0; right: 0; height: 3px; background: rgba(0,0,0,0.4); z-index: 100; }
.rkx-scroll-bar__fill { height: 100%; width: 0%; background: linear-gradient(90deg, #1D24CA 0%, #818cf8 100%); box-shadow: 0 0 10px rgba(29,36,202,0.7); transition: width 80ms linear; }
.rkx-scroll-faux { padding: 24px; border: 1px solid var(--rkx-page-line); background: rgba(8,10,22,0.4); margin-bottom: 20px; }
.rkx-scroll-faux h3 { margin: 0 0 10px; color: #fff; font-size: 18px; }
.rkx-scroll-faux p { margin: 0; color: var(--rkx-page-muted); font-size: 14px; line-height: 1.55; }


/* === cookie === */

.rkx-cook-demo { padding: 60px 30px; text-align: center; }
.rkx-cook { position: fixed; left: 20px; right: 20px; bottom: 20px; max-width: 760px; margin: 0 auto; padding: 20px 24px; background: rgba(8,10,22,0.85); border: 1px solid rgba(29,36,202,0.4); backdrop-filter: blur(18px) saturate(1.5); -webkit-backdrop-filter: blur(18px) saturate(1.5); box-shadow: 0 30px 80px -20px rgba(29,36,202,0.4); display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: center; z-index: 100; transform: translateY(120%); transition: transform 540ms cubic-bezier(0.22,1,0.36,1); }
.rkx-cook.is-open { transform: translateY(0); }
.rkx-cook__copy { font-size: 13.5px; line-height: 1.5; color: var(--rkx-page-muted); }
.rkx-cook__copy b { color: #fff; font-weight: 600; }
.rkx-cook__copy a { color: var(--rkx-accent-tx); border-bottom: 1px dashed rgba(29,36,202,0.4); text-decoration: none; }
.rkx-cook__actions { display: flex; gap: 6px; }
.rkx-cook__btn { padding: 10px 14px; font-family: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; border-radius: 1px; transition: all 200ms ease; }
.rkx-cook__btn--accept { background: #1D24CA; color: #fff; border: 1px solid rgba(29,36,202,0.6); box-shadow: 0 0 14px rgba(29,36,202,0.3); }
.rkx-cook__btn--accept:hover { background: #1a6fff; box-shadow: 0 0 20px rgba(29,36,202,0.55); }
.rkx-cook__btn--dec { background: rgba(255,255,255,0.05); color: #fff; border: 1px solid var(--rkx-page-line-strong); }
.rkx-cook__btn--dec:hover { background: rgba(255,255,255,0.1); }
@media(max-width:639px){.rkx-cook{grid-template-columns:1fr;text-align:left;}}