main#beta {
    background: linear-gradient(180deg, var(--purple-700), var(--purple-800));
  }
  
  main#beta .container { max-width: 1100px; }
  
  /* Headings & intros */
  main#beta .section-title.wordmark{
    text-align: center;
    font-size: clamp(1.9rem, 2.4vw, 3rem);
    line-height: 1.08;
    margin: 0 0 18px;        /* was 12px */
    text-shadow: 0 1px 0 rgba(0,0,0,.25), 0 12px 32px rgba(185,149,255,.25);
  }
  main#beta .lead-intro,
  main#beta .lead{
    text-align: center;
    font-size: clamp(1.05rem, 1.2vw, 1.25rem);
    line-height: 1.8;
    max-width: 980px;
    margin: 12px auto 26px;  /* was 10px auto 18px */
    opacity: .95;
  }
  main#beta .lead.small { font-size: .98rem; opacity: .9; }
  main#beta .center { text-align: center; }
  
  /* Links on purple backgrounds */
  main#beta a{
    color: var(--purple-300);
    text-decoration: underline;
    text-decoration-thickness: .12em;
    text-underline-offset: .18em;
    text-decoration-color: color-mix(in srgb, var(--purple-300) 70%, transparent);
    transition: color .15s ease, text-decoration-color .15s ease, text-shadow .15s ease;
  }
  main#beta a:hover{
    color: var(--purple-400);
    text-decoration-color: var(--purple-400);
    text-shadow: 0 0 14px rgba(185,149,255,.28);
  }
  main#beta a:focus-visible{
    outline: 3px solid var(--purple-300);
    outline-offset: 2px;
    border-radius: 6px;
  }
  
  /* Sections & spacing — bigger breathing room */
  main#beta section { 
    position: relative; 
    padding-block: 48px;     /* was 28px */
  }
  @media (min-width: 900px){
    main#beta section { padding-block: 72px; }  /* roomy on desktop */
  }
  
  /* ✨ Remove the collapse that killed top spacing */
  /* (Delete your old `section + section { padding-top: 0; }`) */
  
  /* Helper spacing for common elements */
  main#beta .actions { display:flex; justify-content:center; gap:12px; margin-top: 12px; }
  main#beta .form-note { text-align:center; opacity:.85; margin-top:10px; }
  
  /* Decorative background for highlighted sections */
  main#beta .solution { overflow:hidden; }
  main#beta .section-bg{
    position:absolute; inset:-20% -10%; z-index:0;
    background:
      radial-gradient(1200px 600px at 50% -10%, rgba(185,149,255,.20), transparent 60%),
      radial-gradient(1000px 400px at 80% 120%, rgba(110,38,199,.20), transparent 60%);
    filter: blur(2px);
  }
  main#beta .solution > .container { position:relative; z-index:1; }
  
  /* Grid & cards */
  main#beta .grid{
    display:grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 18px;               /* was 16px */
    margin-top: 18px;        /* was 12px */
  }
  @media (min-width: 880px){
    main#beta .grid{
      gap: 22px; 
      grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    }
  }
  main#beta .card{
    padding: 18px 20px;      /* was 16px 18px */
    border-radius: 18px;
    background: rgba(255,255,255,.045);
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 10px 26px rgba(0,0,0,.18);
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
  }
  main#beta .card:hover{
    transform: translateY(-1px);
    border-color: rgba(255,255,255,.18);
    box-shadow: 0 14px 32px rgba(0,0,0,.22);
  }
  main#beta .card h3{
    margin: 0 0 8px;         /* was 6px */
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.25;
  }
  main#beta .card p{ margin: 0; opacity:.94; }
  
  /* Lists */
  main#beta ul{ margin: 10px 0 0 1.2rem; line-height: 1.75; } /* was line-height:1.7 */
  main#beta li + li{ margin-top: .3rem; }
  
  /* Details / FAQ */
  main#beta details{
    margin: 12px 0;          /* was 10px 0 */
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.04);
    border-radius: 14px;
    padding: 12px 14px;      /* was 10px 12px */
  }
  main#beta details + details{ margin-top: 10px; }
  main#beta summary{
    cursor: pointer;
    font-weight: 800;
    list-style: none;
  }
  main#beta summary::-webkit-details-marker{ display:none; }
  main#beta summary::after{
    content: '▾';
    float: right;
    transition: transform .2s ease;
    opacity: .9;
  }
  main#beta details[open] summary::after{ transform: rotate(180deg); }
  main#beta details p{ margin: 10px 0 2px; }  /* was 8px */
  
  /* CTA panel */
  main#beta .cta .cta-wrap{
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 20px;
    padding: 22px 22px;      /* was 18px 20px */
  }
  
  /* Buttons (uses your global .btn styles) */
  main#beta .btn.btn-im-in{ min-width: 11rem; }
  
  /* Anchor targets land below the sticky header */
  main#beta [id]{ scroll-margin-top: 88px; }