﻿:root {
      --plan-surface: rgba(255, 255, 255, 0.82);
      --plan-border: rgba(148, 163, 184, 0.22);
      --plan-shadow: 0 28px 70px rgba(15, 23, 42, 0.12);
    }

    body {
      background:
        radial-gradient(circle at top left, rgba(250, 204, 21, 0.20), transparent 18%),
        radial-gradient(circle at top right, rgba(96, 165, 250, 0.16), transparent 24%),
        linear-gradient(180deg, #f8fbff 0%, #eef4ff 48%, #f8fafc 100%);
    }

    .glass-card {
      background: var(--plan-surface);
      backdrop-filter: blur(18px);
      border: 1px solid var(--plan-border);
      box-shadow: var(--plan-shadow);
    }

    .plan-card {
      position: relative;
      overflow: hidden;
      border: 1px solid rgba(148, 163, 184, 0.16);
      background:
        linear-gradient(180deg, rgba(255,255,255,0.98), rgba(248,250,252,0.9)),
        radial-gradient(circle at top right, rgba(96,165,250,0.14), transparent 42%);
      box-shadow: 0 20px 46px rgba(15, 23, 42, 0.08);
      transform: translateY(0);
      transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
    }

    .plan-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, rgba(37, 99, 235, 0.08), transparent 46%, rgba(16, 185, 129, 0.05));
      opacity: 0;
      transition: opacity 0.24s ease;
      pointer-events: none;
    }

    .plan-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 30px 62px rgba(15, 23, 42, 0.14);
      border-color: rgba(37, 99, 235, 0.24);
    }

    .plan-card:hover::before {
      opacity: 1;
    }

    .plan-badge {
      border: 1px solid rgba(148, 163, 184, 0.18);
      background: rgba(255,255,255,0.82);
      backdrop-filter: blur(10px);
    }

    .subscribe-btn {
      transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    }

    .subscribe-btn:hover:not(:disabled) {
      transform: translateY(-2px);
      box-shadow: 0 18px 30px rgba(37, 99, 235, 0.22);
    }

    .subscribe-btn:disabled {
      opacity: 0.6;
      cursor: not-allowed;
    }

    .pill-stat {
      border: 1px solid rgba(148, 163, 184, 0.16);
      background: rgba(255,255,255,0.78);
      backdrop-filter: blur(10px);
    }

