:root {
        --deep-blue: #041630;
        --deep-blue-2: #0a2342;
        --ink: #000000;
        --peach: #ffdab9;
        --peach-soft: #fff5ee;
        --peach-mid: #ffccb6;
        --peach-deep: #ffb399;
      }
      body {
        font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
      }
      .page-gradient {
        background: linear-gradient(180deg, var(--deep-blue) 0%, var(--deep-blue-2) 45%, var(--ink) 100%);
        min-height: 100vh;
      }
      .crown-glow {
        box-shadow: 0 8px 32px rgba(255, 218, 185, 0.35);
      }
      .plan-card-shell {
        border-radius: 35px;
        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
        min-height: 460px;
      }
      .plans-track {
        display: flex;
        gap: 15px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 0 calc(max(0px, (100% - min(82vw, 420px)) / 2)) 2rem;
        padding-bottom: 2rem;
      }
      .plans-track > article {
        flex: 0 0 min(82vw, 420px);
        scroll-snap-align: center;
      }
      @media (min-width: 1024px) {
        .plans-track {
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          overflow: visible;
          padding: 0 1.5rem 2rem;
          max-width: 1200px;
          margin: 0 auto;
        }
        .plans-track > article {
          flex: none;
          min-height: 460px;
        }
      }