.plans{
    display:grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.6rem;
    align-items: stretch;
    margin-top: 2.5rem;
  }

  .plan{
    background: var(--cream-light);
    border-radius: 20px;
    padding: 1.8rem 1.5rem 2rem;
    box-shadow: var(--shadow);
    display:flex;
    flex-direction:column;
    border: 3px solid transparent;
    position:relative;
  }


  .plan-badge{
    position:absolute;
    top:-14px;
    left:50%;
    transform: translateX(-50%);
    background: var(--darkblue);
    color:#fff;
    font-family:'Baloo 2', sans-serif;
    font-weight:600;
    font-size: .8rem;
    padding: .3rem .9rem;
    border-radius: 999px;
    white-space:nowrap;
  }

  .plan-name{
    font-family:'Baloo 2', sans-serif;
    font-weight:700;
    font-size: 1.35rem;
    margin: 0 0 .6rem;
    text-align:center;
  }

  .plan-green .plan-name{ color: var(--green); }
  .plan-darkblue .plan-name{ color: var(--darkblue); }
  .plan-purple .plan-name{ color: var(--purple); }
  
  .plan-green{border-color: var(--green);}
  .plan-darkblue{border-color: var(--darkblue);}
  .plan-purple{border-color: var(--purple);}

  .plan-price{
    font-family:'Baloo 2', sans-serif;
    font-weight:800;
    font-size: 2.4rem;
    text-align:center;
    color: var(--navy);
    margin: 0 0 .2rem;
  }
  .plan-price span{
    font-size: 1rem;
    font-weight:600;
    color:#3a4a5c;
  }

  .plan-sub{
    text-align:center;
    font-size: .85rem;
    color:#3a4a5c;
    margin: 0 0 1.4rem;
  }

  .plan-features{
    list-style:none;
    margin:0 0 1.6rem;
    padding:0;
    display:flex;
    flex-direction:column;
    gap: .7rem;
    flex:1;
  }

  .plan-features li{
    display:flex;
    align-items:center;
    gap:.65rem;
    font-size: .95rem;
  }

  .check{
    flex:0 0 auto;
    width: 24px;
    height: 24px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
  }
  .check svg{ width:13px; height:13px; }

  .plan-green .check{ background: var(--green); }
  .plan-darkblue .check{ background: var(--darkblue); }
  .plan-purple .check{ background: var(--purple); }

  .plan-cta{
    display:block;
    text-align:center;
    font-family:'Baloo 2', sans-serif;
    font-weight:700;
    font-size: 1rem;
    padding: .8rem 1rem;
    border-radius: 14px;
    text-decoration:none;
    color:#fff;
    border:none;
    cursor:pointer;
  }

  .plan-green .plan-cta{ background: var(--green); }
  .plan-darkblue .plan-cta{ background: var(--darkblue); }
  .plan-purple .plan-cta{ background: var(--purple); }


  /* Responsive */
  @media (max-width: 820px){
    .plans{
      grid-template-columns: 1fr;
    }
    .plan.featured{ transform:none; order:-1; }
  }

  @media (max-width: 480px){
    .plan{ padding: 1.5rem 1.2rem 1.7rem; }
    .plan-price{ font-size: 2rem; }
  }

  @media (prefers-reduced-motion: no-preference){
    .plan{ transition: transform .15s ease; }
    .plan:not(.featured):hover{ transform: translateY(-4px); }
  }
