/* Prefix: rdp- (masaustu-vds sayfası) */

    /* ── Hero ──────────────────────────────────── */
    .rdp-hero {
      background: linear-gradient(135deg, #ffffff 0%, #faf8f5 55%, #f5f3ef 100%);
      padding: 72px 0 60px;
      position: relative;
      overflow: hidden;
    }
    .rdp-hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background:
        radial-gradient(ellipse 60% 60% at 80% 50%, rgba(124,58,237,.06) 0%, transparent 65%),
        radial-gradient(ellipse 40% 40% at 10% 80%, rgba(37,99,235,.04) 0%, transparent 60%);
    }
    .rdp-hero-grid {
      position: absolute;
      inset: 0;
      background-image: linear-gradient(rgba(0,0,0,.04) 1px, transparent 1px),
                        linear-gradient(90deg, rgba(0,0,0,.04) 1px, transparent 1px);
      background-size: 48px 48px;
    }
    .rdp-eyebrow {
      display: inline-flex; align-items: center; gap: 8px;
      font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
      color: #2563eb; background: rgba(37,99,235,.1);
      border: 1px solid rgba(37,99,235,.25);
      padding: 6px 16px; border-radius: 999px;
      margin-bottom: 20px;
    }
    .rdp-hero h1 {
      font-size: clamp(2rem, 5vw, 3.2rem);
      font-weight: 900; color: #0f172a; line-height: 1.1;
      letter-spacing: -.03em; margin-bottom: 18px;
    }
    .rdp-hero h1 .rdp-h1-accent {
      background: linear-gradient(90deg, #2563eb, #1d4ed8);
      -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    }
    .rdp-hero-sub {
      font-size: 1.05rem; color: #475569;
      line-height: 1.75; margin-bottom: 32px; max-width: 520px;
    }
    .rdp-hero-btns { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 40px; }
    .rdp-btn-primary {
      display: inline-flex; align-items: center; gap: 9px;
      background: linear-gradient(135deg, #2563eb, #1d4ed8);
      color: #fff; font-weight: 800; font-size: .95rem;
      padding: 14px 28px; border-radius: 12px;
      text-decoration: none; transition: all .2s;
      box-shadow: 0 8px 24px rgba(37,99,235,.3);
    }
    .rdp-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(37,99,235,.4); color: #fff; }
    .rdp-btn-secondary {
      display: inline-flex; align-items: center; gap: 9px;
      background: #fff; border: 1px solid #bfdbfe;
      color: #1e40af; font-weight: 700; font-size: .95rem;
      padding: 14px 28px; border-radius: 12px;
      text-decoration: none; transition: all .2s;
    }
    .rdp-btn-secondary:hover { background: #eff6ff; color: #1e3a8a; border-color: #93c5fd; }
    .rdp-hero-pills { display: flex; flex-wrap: wrap; gap: 10px; }
    .rdp-hero-pill {
      display: inline-flex; align-items: center; gap: 7px;
      font-size: .78rem; font-weight: 600; color: #374151;
      background: #fff; border: 1px solid #e0e7ff;
      padding: 7px 14px; border-radius: 8px;
    }
    .rdp-hero-pill i { color: #16a34a; font-size: .65rem; }

    /* ── "Nedir bu RDP?" banner ────────────────── */
    .rdp-explainer {
      background: #fff9f0;
      border-top: 3px solid #f59e0b;
      padding: 28px 0;
    }
    .rdp-explainer-inner {
      display: flex; align-items: flex-start; gap: 20px;
      max-width: 880px; margin: 0 auto;
    }
    .rdp-explainer-ico {
      width: 52px; height: 52px; border-radius: 14px;
      background: #fef3c7; color: #d97706;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.4rem; flex-shrink: 0;
    }
    .rdp-explainer h3 {
      font-size: 1rem; font-weight: 900; color: #92400e; margin-bottom: 6px;
    }
    .rdp-explainer p {
      font-size: .88rem; color: #78350f; line-height: 1.7; margin: 0;
    }
    .rdp-explainer strong { color: #7c3aed; }

    /* ── Kullanım senaryoları ──────────────────── */
    .rdp-usecase-sec { padding: 80px 0; background: #f8fafc; }
    .rdp-usecase-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 20px;
    }
    .rdp-uc-card {
      background: #fff; border: 1.5px solid #e2e8f0;
      border-radius: 16px; padding: 28px 22px;
      transition: all .25s; position: relative; overflow: hidden;
    }
    .rdp-uc-card::before {
      content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
      background: var(--uc-color, #7c3aed); border-radius: 16px 16px 0 0;
    }
    .rdp-uc-card:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(0,0,0,.08); border-color: #bfdbfe; }
    .rdp-uc-ico {
      width: 44px; height: 44px; border-radius: 12px;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.1rem; margin-bottom: 14px;
    }
    .rdp-uc-card h4 { font-size: .95rem; font-weight: 900; color: #0f172a; margin-bottom: 8px; }
    .rdp-uc-card p { font-size: .82rem; color: #64748b; line-height: 1.7; margin: 0; }
    .rdp-uc-pkg {
      margin-top: 14px;
      display: inline-flex; align-items: center; gap: 6px;
      font-size: .74rem; font-weight: 700;
      color: var(--uc-color, #7c3aed);
      border: 1px solid var(--uc-color, #7c3aed);
      padding: 4px 12px; border-radius: 8px;
      opacity: .85;
    }

    /* ── Paket kartları ───────────────────────── */
    .rdp-plans-sec { padding: 88px 0; background: #fff; }
    .rdp-loc-toggle {
      display: inline-flex; align-items: center; gap: 6px;
      margin: 28px auto 0; padding: 5px;
      background: #f8fafc; border: 1.5px solid #e2e8f0; border-radius: 14px;
    }
    .rdp-loc-btn {
      display: inline-flex; align-items: center; gap: 8px;
      padding: 10px 18px; border: none; border-radius: 10px;
      background: transparent; color: #64748b;
      font-size: .88rem; font-weight: 700; font-family: inherit;
      cursor: pointer; transition: background .2s, color .2s, box-shadow .2s;
    }
    .rdp-loc-btn:hover { color: #0f172a; background: #f1f5f9; }
    .rdp-loc-btn.is-active {
      background: #2563eb; color: #fff;
      box-shadow: 0 6px 18px rgba(37, 99, 235, .28);
    }
    .rdp-loc-iso {
      display: inline-flex; align-items: center; justify-content: center;
      min-width: 28px; height: 22px; padding: 0 6px; border-radius: 6px;
      font-size: .68rem; font-weight: 800; letter-spacing: .04em;
      background: #e2e8f0; color: #475569;
    }
    .rdp-loc-btn.is-active .rdp-loc-iso {
      background: rgba(255,255,255,.2); color: #fff;
    }
    .rdp-plan-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 8px; }
    .rdp-plan-cards[hidden] { display: none !important; }
    .rdp-plan-card {
      background: #f8fafc; border: 1.5px solid #e2e8f0;
      border-radius: 20px; padding: 28px 16px;
      position: relative; transition: all .25s;
      display: flex; flex-direction: column;
    }
    .rdp-plan-card:hover { transform: translateY(-4px); box-shadow: 0 16px 48px rgba(37,99,235,.1); border-color: #bfdbfe; }
    .rdp-plan-card.rdp-plan--highlight {
      background: linear-gradient(150deg, #1e3a8a 0%, #1d4ed8 100%);
      border-color: #60a5fa;
    }
    .rdp-plan-card.rdp-plan--highlight:hover { box-shadow: 0 20px 60px rgba(37,99,235,.35); }
    .rdp-plan-badge {
      position: absolute; top: -14px; left: 50%; transform: translateX(-50%);
      background: linear-gradient(90deg, #2563eb, #1d4ed8);
      color: #fff; font-size: .7rem; font-weight: 800;
      padding: 5px 18px; border-radius: 999px;
      white-space: nowrap; box-shadow: 0 4px 14px rgba(37,99,235,.4);
      letter-spacing: .04em;
    }
    .rdp-plan-badge-light {
      position: absolute; top: -14px; left: 50%; transform: translateX(-50%);
      background: #eff6ff; color: #2563eb;
      border: 1px solid #bfdbfe;
      font-size: .7rem; font-weight: 800;
      padding: 5px 18px; border-radius: 999px;
      white-space: nowrap;
    }
    .rdp-plan-name {
      font-size: 1.15rem; font-weight: 900; color: #0f172a; margin-bottom: 4px;
    }
    .rdp-plan--highlight .rdp-plan-name { color: #fff; }
    .rdp-plan-tagline {
      font-size: .78rem; color: #2563eb; font-weight: 700; margin-bottom: 18px;
    }
    .rdp-plan--highlight .rdp-plan-tagline { color: #93c5fd; }
    .rdp-plan-specs { list-style: none; padding: 0; margin: 0 0 20px; }
    .rdp-plan-specs li {
      display: flex; align-items: center; gap: 8px;
      font-size: .84rem; color: #475569;
      padding: 6px 0; border-bottom: 1px solid #f1f5f9;
    }
    .rdp-plan-specs li:last-child { border-bottom: none; }
    .rdp-plan--highlight .rdp-plan-specs li { color: rgba(255,255,255,.8); border-color: rgba(255,255,255,.1); }
    .rdp-plan-specs li i { color: #2563eb; width: 16px; text-align: center; font-size: .75rem; flex-shrink: 0; }
    .rdp-plan--highlight .rdp-plan-specs li i { color: #93c5fd; }
    .rdp-plan-price {
      font-size: 1.8rem; font-weight: 900; color: #0f172a;
      margin: 16px 0 4px; line-height: 1;
    }
    .rdp-plan--highlight .rdp-plan-price { color: #fff; }
    .rdp-plan-price .rdp-plan-sym { font-size: 1rem; font-weight: 600; vertical-align: super; margin-left: 2px; }
    .rdp-plan-period { font-size: .78rem; color: #94a3b8; margin-bottom: 18px; }
    .rdp-plan--highlight .rdp-plan-period { color: rgba(255,255,255,.5); }
    .rdp-plan-mt { margin-top: auto; }
    .rdp-plan-price-meta {
      display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
      margin-top: 10px; margin-bottom: -4px;
    }
    .rdp-plan-price-old {
      font-size: .9rem; font-weight: 600; color: #94a3b8; line-height: 1;
    }
    .rdp-plan-price-old s {
      text-decoration: line-through;
      text-decoration-thickness: 1.5px;
      text-decoration-color: #94a3b8;
    }
    .rdp-plan--highlight .rdp-plan-price-old { color: rgba(255,255,255,.45); }
    .rdp-plan--highlight .rdp-plan-price-old s { text-decoration-color: rgba(255,255,255,.4); }
    .rdp-plan-save {
      display: inline-flex; align-items: center;
      font-size: .68rem; font-weight: 800; letter-spacing: .02em;
      padding: 3px 8px; border-radius: 6px;
      background: #ecfdf5; color: #059669; border: 1px solid #a7f3d0;
    }
    .rdp-plan--highlight .rdp-plan-save {
      background: rgba(34,197,94,.15); border-color: rgba(34,197,94,.3); color: #86efac;
    }
    .rdp-plan-btn {
      width: 100%; display: flex; align-items: center; justify-content: center; gap: 9px;
      background: #2563eb; color: #fff; font-weight: 800; font-size: .9rem;
      padding: 13px 20px; border-radius: 12px; border: none; cursor: pointer;
      transition: all .2s; text-decoration: none;
    }
    .rdp-plan-btn:hover { background: #1d4ed8; transform: translateY(-1px); color: #fff; }
    .rdp-plan--highlight .rdp-plan-btn {
      background: #fff; color: #1d4ed8;
    }
    .rdp-plan--highlight .rdp-plan-btn:hover { background: #eff6ff; color: #1e40af; }
    .rdp-plan-btn-light {
      width: 100%; display: flex; align-items: center; justify-content: center; gap: 9px;
      background: transparent; color: #2563eb;
      border: 1.5px solid #bfdbfe; font-weight: 700; font-size: .88rem;
      padding: 12px 20px; border-radius: 12px; cursor: pointer;
      transition: all .2s; text-decoration: none;
    }
    .rdp-plan-btn-light:hover { background: #eff6ff; color: #1d4ed8; border-color: #2563eb; }

    /* ── "Nasıl çalışır" 3 adım ──────────────── */
    .rdp-how-sec { padding: 80px 0; background: #f8fafc; }
    .rdp-steps {
      display: grid; grid-template-columns: repeat(3, 1fr); gap: 0;
      position: relative;
    }
    .rdp-steps::before {
      content: ''; position: absolute; top: 32px; left: 16.6%; right: 16.6%;
      height: 2px; background: linear-gradient(90deg, #2563eb, #60a5fa);
      z-index: 0;
    }
    .rdp-step { text-align: center; padding: 0 20px; position: relative; z-index: 1; }
    .rdp-step-num {
      width: 64px; height: 64px; border-radius: 50%;
      background: linear-gradient(135deg, #2563eb, #1d4ed8);
      color: #fff; font-size: 1.4rem; font-weight: 900;
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 20px; box-shadow: 0 8px 24px rgba(37,99,235,.35);
    }
    .rdp-step h4 { font-size: .97rem; font-weight: 900; color: #0f172a; margin-bottom: 8px; }
    .rdp-step p { font-size: .83rem; color: #64748b; line-height: 1.7; margin: 0; }
    .rdp-step-detail {
      display: inline-flex; align-items: center; gap: 6px;
      margin-top: 12px; font-size: .75rem; font-weight: 700;
      color: #2563eb; background: #eff6ff;
      padding: 4px 12px; border-radius: 8px;
    }

    /* ── Özellikler grid ──────────────────────── */
    .rdp-feat-sec { padding: 80px 0; background: #fff; }
    .rdp-feat-grid {
      display: grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: 20px;
    }
    .rdp-feat-card {
      display: flex; gap: 16px; align-items: flex-start;
      background: #f8fafc; border: 1.5px solid #e2e8f0;
      border-radius: 14px; padding: 22px 20px;
      transition: border-color .2s;
    }
    .rdp-feat-card:hover { border-color: #bfdbfe; }
    .rdp-feat-ico {
      width: 42px; height: 42px; border-radius: 10px;
      display: flex; align-items: center; justify-content: center;
      font-size: .95rem; flex-shrink: 0;
    }
    .rdp-feat-card h4 { font-size: .92rem; font-weight: 800; color: #0f172a; margin-bottom: 5px; }
    .rdp-feat-card p { font-size: .82rem; color: #64748b; line-height: 1.65; margin: 0; }

    /* ── CTA ──────────────────────────────────── */
    .rdp-cta-sec {
      padding: 96px 0;
      background: linear-gradient(135deg, #1e3a8a 0%, #1d4ed8 60%, #0c2461 100%);
      position: relative; overflow: hidden;
    }
    .rdp-cta-sec::before {
      content: '';
      position: absolute; inset: 0;
      background-image: radial-gradient(circle 600px at 80% 50%, rgba(37,99,235,.25) 0%, transparent 60%);
    }
    .rdp-cta-dots {
      position: absolute; inset: 0; pointer-events: none;
      background-image: radial-gradient(rgba(255,255,255,.06) 1.5px, transparent 1.5px);
      background-size: 28px 28px;
    }
    .rdp-cta-title {
      font-size: clamp(1.8rem, 3.5vw, 2.6rem);
      font-weight: 900; color: #fff; line-height: 1.15; margin-bottom: 14px;
      letter-spacing: -.02em;
    }
    .rdp-cta-sub { font-size: .95rem; color: rgba(255,255,255,.65); line-height: 1.75; margin-bottom: 28px; max-width: 500px; }
    .rdp-cta-btns { display: flex; flex-wrap: wrap; gap: 12px; }
    .rdp-cta-btn-w {
      display: inline-flex; align-items: center; gap: 8px;
      background: #fff; color: #1e40af; font-weight: 800; font-size: .95rem;
      padding: 14px 28px; border-radius: 12px; text-decoration: none; transition: all .2s;
    }
    .rdp-cta-btn-w:hover { background: #eff6ff; transform: translateY(-2px); color: #1e3a8a; }
    .rdp-cta-btn-o {
      display: inline-flex; align-items: center; gap: 8px;
      background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.25);
      color: #fff; font-weight: 700; font-size: .95rem;
      padding: 14px 28px; border-radius: 12px; text-decoration: none; transition: all .2s;
    }
    .rdp-cta-btn-o:hover { background: rgba(255,255,255,.2); color: #fff; }
    .rdp-cta-trust { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }
    .rdp-cta-trust-item { display: flex; align-items: center; gap: 7px; color: rgba(255,255,255,.6); font-size: .82rem; }
    .rdp-cta-trust-item i { color: rgba(255,255,255,.88); }

    /* ── CTA Setup Card ───────────────────────── */
    .rdp-setup-card {
      background: rgba(255,255,255,.07);
      border: 1px solid rgba(255,255,255,.14);
      border-radius: 20px;
      padding: 28px 24px;
      width: 100%; max-width: 290px;
      backdrop-filter: blur(10px);
      animation: ctaCardFloat 4.5s ease-in-out infinite;
    }
    @keyframes ctaCardFloat {
      0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)}
    }
    .rdp-win11-logo {
      display: flex; align-items: center; gap: 12px;
      margin-bottom: 18px;
    }
    .rdp-win11-logo svg {
      animation: win11Pulse 2.5s ease-in-out infinite;
      filter: drop-shadow(0 0 8px rgba(0,164,239,.55));
    }
    @keyframes win11Pulse {
      0%,100%{filter:drop-shadow(0 0 6px rgba(0,164,239,.4))}
      50%{filter:drop-shadow(0 0 18px rgba(0,164,239,.85))}
    }
    .rdp-win11-logo span {
      font-size: .88rem; font-weight: 800; color: #fff; letter-spacing: .3px;
      line-height: 1.3;
    }
    .rdp-win11-logo small {
      display: block; font-size: .7rem; font-weight: 400;
      color: rgba(255,255,255,.45); margin-top: 1px;
    }
    .rdp-setup-title {
      font-size: .8rem; font-weight: 700; color: rgba(255,255,255,.85);
      margin-bottom: 14px; display: flex; align-items: center; gap: 8px;
      text-transform: uppercase; letter-spacing: .06em;
    }
    .rdp-setup-title::before {
      content: ''; display: inline-block; width: 8px; height: 8px;
      border-radius: 50%; background: #4ade80;
      animation: ctaLiveDot 1s ease-in-out infinite;
    }
    @keyframes ctaLiveDot { 0%,100%{opacity:1} 50%{opacity:.25} }
    .rdp-setup-steps { display: flex; flex-direction: column; gap: 9px; margin-bottom: 18px; }
    .rdp-setup-step {
      display: flex; align-items: center; gap: 9px;
      animation: ctaStepIn .45s ease both;
      animation-delay: var(--sd, 0s);
    }
    @keyframes ctaStepIn {
      from{opacity:0;transform:translateX(-8px)} to{opacity:1;transform:translateX(0)}
    }
    .rdp-ss-icon {
      width: 22px; height: 22px; border-radius: 50%; flex-shrink: 0;
      display: flex; align-items: center; justify-content: center;
      font-size: .7rem; font-weight: 800;
    }
    .rdp-setup-step--done .rdp-ss-icon  { background: #22c55e; color: #fff; }
    .rdp-setup-step--active .rdp-ss-icon {
      background: rgba(37,99,235,.25); border: 2px solid #60a5fa; color: #93c5fd;
      animation: ctaSpinIcon 1.4s linear infinite;
    }
    @keyframes ctaSpinIcon { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
    .rdp-setup-step--pending .rdp-ss-icon {
      background: rgba(255,255,255,.06); border: 1.5px solid rgba(255,255,255,.18);
      color: rgba(255,255,255,.25);
    }
    .rdp-ss-label { flex: 1; font-size: .75rem; color: rgba(255,255,255,.8); }
    .rdp-setup-step--done .rdp-ss-label { color: rgba(255,255,255,.5); }
    .rdp-setup-step--pending .rdp-ss-label { color: rgba(255,255,255,.25); }
    .rdp-ss-time { font-size: .65rem; color: rgba(255,255,255,.3); font-variant-numeric: tabular-nums; }
    .rdp-setup-prog { height: 6px; background: rgba(255,255,255,.1); border-radius: 6px; overflow: hidden; margin-bottom: 7px; }
    .rdp-setup-prog-bar {
      height: 100%;
      background: linear-gradient(90deg, #2563eb, #38bdf8);
      border-radius: 6px;
      animation: ctaProgPulse 3.2s ease-in-out infinite;
    }
    @keyframes ctaProgPulse {
      0%{width:60%;opacity:.85} 50%{width:76%;opacity:1} 100%{width:68%;opacity:.9}
    }
    .rdp-setup-prog-lbl {
      font-size: .67rem; color: rgba(255,255,255,.38); text-align: center;
      letter-spacing: .02em;
    }

    /* ── FAQ ──────────────────────────────────── */
    .rdp-faq-sec { padding: 80px 0; background: #f8fafc; }

    /* section-tag ortak */
    .section-tag {
      display: inline-flex; align-items: center; gap: 6px;
      font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
      color: #2563eb; background: #eff6ff; border: 1px solid #bfdbfe;
      padding: 5px 14px; border-radius: 999px;
    }
    .section-title { font-size: clamp(1.5rem, 3vw, 2.1rem); font-weight: 900; color: #0f172a; margin-top: 14px; margin-bottom: 0; letter-spacing: -.02em; }
    .section-sub { color: #64748b; font-size: .92rem; line-height: 1.75; max-width: 540px; }
    .text-gradient { background: linear-gradient(90deg, #2563eb, #0891b2); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }

    /* ── Hero Mock RDP Window ──────────────────────── */
    .rdp-hero-visual {
      position: relative;
      padding: 20px 36px 56px 10px;
    }
    .rdp-mock-window {
      background: #ffffff;
      border-radius: 12px;
      border: 1px solid #dde2ee;
      box-shadow:
        0 2px 8px rgba(15,23,42,.06),
        0 16px 48px rgba(15,23,42,.12);
      overflow: hidden;
    }
    .rdp-mock-titlebar {
      display: flex; align-items: center; gap: 10px;
      background: #f0f4f8;
      padding: 9px 14px;
      border-bottom: 1px solid #e2e8f0;
    }
    .rdp-mock-dots { display: flex; gap: 5px; flex-shrink: 0; }
    .rdp-dot { width: 11px; height: 11px; border-radius: 50%; display: inline-block; }
    .rdp-dot--r { background: #ef4444; }
    .rdp-dot--y { background: #f59e0b; }
    .rdp-dot--g { background: #22c55e; }
    .rdp-mock-title-text {
      flex: 1; font-size: .67rem; color: #64748b;
      font-family: 'Inter',sans-serif;
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
      display: flex; align-items: center;
    }
    .rdp-mock-conn-badge {
      display: flex; align-items: center; gap: 5px;
      background: rgba(22,163,74,.08); border: 1px solid rgba(22,163,74,.2);
      padding: 3px 9px; border-radius: 20px;
      font-size: .63rem; font-family: monospace; color: #16a34a;
      flex-shrink: 0;
    }
    .rdp-live-dot {
      width: 5px; height: 5px; border-radius: 50%; background: #4ade80;
      animation: rdpLiveBlink 1.4s ease-in-out infinite;
    }
    @keyframes rdpLiveBlink { 0%,100%{opacity:1} 50%{opacity:.15} }
    .rdp-mock-desktop {
      background: #f8fafc;
      display: flex; flex-direction: column;
      min-height: 255px;
    }
    .rdp-desktop-area {
      flex: 1; display: flex; padding: 10px 10px 6px; gap: 10px;
    }
    .rdp-desk-icons-col {
      display: flex; flex-direction: column; gap: 10px; padding: 4px 2px;
    }
    .rdp-desk-icon { display: flex; flex-direction: column; align-items: center; gap: 3px; cursor: default; }
    .rdp-desk-ic-wrap {
      width: 34px; height: 34px; border-radius: 8px;
      background: var(--ic-bg, #334155);
      display: flex; align-items: center; justify-content: center;
      transition: transform .15s;
    }
    .rdp-desk-icon:hover .rdp-desk-ic-wrap { transform: scale(1.12); }
    .rdp-desk-icon > span {
      font-size: .5rem; color: #64748b;
      font-family: 'Inter',sans-serif; text-align: center;
    }
    .rdp-app-win {
      flex: 1; background: #ffffff;
      border: 1px solid #e2e8f0;
      border-radius: 6px; overflow: hidden;
      animation: rdpAppFloat 5s ease-in-out infinite;
    }
    @keyframes rdpAppFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-3px)} }
    .rdp-app-bar {
      display: flex; align-items: center; justify-content: space-between;
      background: #f1f5f9; padding: 5px 8px;
      border-bottom: 1px solid #e2e8f0;
    }
    .rdp-app-name { font-size: .6rem; color: #64748b; font-family: 'Inter',sans-serif; }
    .rdp-app-wbtns { display: flex; gap: 8px; font-size: .5rem; color: #94a3b8; }
    .rdp-app-body { padding: 8px 8px 4px; }
    .rdp-chart-wrap { position: relative; }
    .rdp-chart { width: 100%; display: block; height: 80px; }
    .rdp-chart-cursor {
      position: absolute; right: 0; top: 0; bottom: 0;
      width: 1px; background: rgba(74,222,128,.5);
      animation: rdpCursorBlink 1s step-end infinite;
    }
    @keyframes rdpCursorBlink { 0%,100%{opacity:1} 50%{opacity:0} }
    .rdp-chart-stats {
      display: flex; align-items: center; gap: 8px; padding: 3px 2px 0;
    }
    .rdp-stat-g { font-size: .6rem; color: #4ade80; font-weight: 700; font-family: monospace; }
    .rdp-stat-w { font-size: .6rem; color: #94a3b8; font-family: monospace; }
    .rdp-stat-m { font-size: .6rem; color: #cbd5e1; font-family: monospace; margin-left: auto; }
    .rdp-app-sbar {
      display: flex; align-items: center; gap: 7px;
      background: #f1f5f9; padding: 4px 8px;
      font-size: .56rem; color: #94a3b8;
      font-family: monospace;
      border-top: 1px solid #e2e8f0;
    }
    .rdp-sbar-dot {
      width: 5px; height: 5px; border-radius: 50%; background: #4ade80;
      animation: rdpLiveBlink 1.4s ease-in-out infinite; flex-shrink: 0;
    }
    .rdp-sbar-div { width: 1px; height: 9px; background: #e2e8f0; }
    .rdp-sbar-ping { color: #4ade80; }
    .rdp-ea-dot {
      display: inline-block; width: 5px; height: 5px; border-radius: 50%;
      background: #4ade80; vertical-align: middle; margin-left: 3px;
      animation: rdpLiveBlink 2s ease-in-out infinite;
    }
    .rdp-mock-taskbar {
      display: flex; align-items: center; gap: 5px;
      background: #e8edf4;
      border-top: 1px solid #d1d9e6;
      padding: 5px 10px;
    }
    .rdp-win-start {
      width: 28px; height: 26px; border-radius: 5px;
      display: flex; align-items: center; justify-content: center;
      transition: background .15s;
    }
    .rdp-win-start:hover { background: rgba(37,99,235,.1); }
    .rdp-tbar-search {
      width: 26px; height: 24px; border-radius: 5px;
      background: rgba(0,0,0,.05);
      display: flex; align-items: center; justify-content: center;
    }
    .rdp-tbar-apps { display: flex; gap: 3px; flex: 1; justify-content: center; }
    .rdp-tbar-app {
      width: 30px; height: 24px; border-radius: 4px;
      display: flex; align-items: center; justify-content: center;
      transition: background .15s;
    }
    .rdp-tbar-app:hover { background: rgba(0,0,0,.07); }
    .rdp-tbar-app--active {
      background: rgba(37,99,235,.1);
      box-shadow: inset 0 -2px 0 #2563eb;
    }
    .rdp-tbar-right { display: flex; align-items: center; gap: 7px; margin-left: auto; }
    .rdp-tbar-clock {
      display: flex; flex-direction: column; align-items: flex-end;
      font-size: .55rem; color: #64748b;
      font-family: 'Inter',sans-serif; line-height: 1.35;
    }
    /* Floating badges */
    .rdp-badge {
      position: absolute;
      background: #fff;
      border: 1px solid #e2e8f0;
      border-radius: 12px; padding: 10px 14px;
      display: flex; align-items: center; gap: 10px;
      box-shadow: 0 4px 16px rgba(15,23,42,.1), 0 1px 4px rgba(15,23,42,.06);
      z-index: 10;
    }
    .rdp-badge--win   { top: -4px; right: -4px; animation: rdpB1 4.5s ease-in-out infinite; }
    .rdp-badge--conn  { bottom: 42px; left: -16px; animation: rdpB2 4s ease-in-out infinite; }
    .rdp-badge--uptime{ bottom: -10px; right: -10px; animation: rdpB3 4.8s ease-in-out infinite; }
    @keyframes rdpB1 { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-7px)} }
    @keyframes rdpB2 { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)} }
    @keyframes rdpB3 { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }
    .rdp-badge-ico {
      width: 34px; height: 34px; border-radius: 10px;
      display: flex; align-items: center; justify-content: center; flex-shrink: 0;
    }
    .rdp-badge-ico--green  { background: rgba(34,197,94,.15); }
    .rdp-badge-ico--blue   { background: rgba(37,99,235,.2); }
    .rdp-badge-ico--purple { background: rgba(124,58,237,.2); }
    .rdp-badge-label {
      font-size: .76rem; font-weight: 700; color: #0f172a;
      font-family: 'Inter',sans-serif; white-space: nowrap;
    }
    .rdp-badge-sub {
      font-size: .62rem; color: #64748b;
      font-family: 'Inter',sans-serif; white-space: nowrap;
    }

    @media (max-width: 991px) {
      .rdp-steps { grid-template-columns: 1fr; gap: 40px; }
      .rdp-steps::before { display: none; }
      .rdp-usecase-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 767px) {
      .rdp-hero { padding: 52px 0 44px; }
      .rdp-hero h1 { font-size: 2rem; }
      .rdp-plan-cards { grid-template-columns: 1fr; }
      .rdp-usecase-grid { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 480px) { .rdp-usecase-grid { grid-template-columns: 1fr; } }