/* pricing.css — classes unique to the Pricing page only.
     Shared classes (.page-hero, .faq-item, .cta-banner, .btn-amber,
     .btn-ghost-white, .section-head) live in style.css — do not
     redefine them here, that's what was causing the layout to break
     on other pages. */

  /* ---------- Monthly price note (replaces the old Monthly/Yearly toggle) ---------- */
  .billing-note{
    display:inline-flex;align-items:center;gap:.5rem;background:var(--card);border:1px solid var(--line);
    border-radius:30px;padding:.5rem 1.1rem;margin-top:1.8rem;
    font-family:'JetBrains Mono',monospace;font-size:.78rem;font-weight:600;color:var(--muted);
  }
  .billing-note i{color:var(--teal);}

  /* ---------- Pricing cards ---------- */
  .price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem;align-items:stretch;}
  @media(max-width:991px){.price-grid{grid-template-columns:1fr;max-width:32rem;margin:0 auto;}}
  .price-card{
    background:var(--card);border:1px solid var(--line);border-radius:18px;
    padding:2rem 1.8rem;display:flex;flex-direction:column;position:relative;
    transition:transform .15s,box-shadow .15s,border-color .15s;
  }
  .price-card:hover{transform:translateY(-4px);box-shadow:0 22px 40px -24px rgba(27,42,74,.35);}
  .price-card.featured{
    border:1.5px solid var(--amber);box-shadow:0 26px 50px -26px rgba(200,134,42,.35);
  }
  .featured-tag{
    position:absolute;top:-13px;left:50%;transform:translateX(-50%);
    background:var(--amber);color:var(--ink);font-family:'JetBrains Mono',monospace;
    font-size:.68rem;font-weight:700;padding:.3rem .9rem;border-radius:20px;letter-spacing:.05em;
  }
  .plan-icon{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;margin-bottom:1.1rem;}
  .plan-icon.free{background:#DFF0EF;color:var(--teal);}
  .plan-icon.pro{background:#FBEBD1;color:var(--amber-dark);}
  .plan-icon.campus{background:#EDE9FE;color:var(--purple);}
  .price-card h3{font-size:1.25rem;font-weight:700;margin-bottom:.35rem;font-family:'Inter',sans-serif;}
  .price-card .plan-note{font-size:.85rem;color:var(--muted);margin-bottom:1.3rem;min-height:2.6em;}
  .price-tag{display:flex;align-items:baseline;gap:.35rem;margin-bottom:1.5rem;}
  .price-tag .amount{font-family:'Fraunces',serif;font-size:2.5rem;font-weight:700;color:var(--ink);}
  .price-tag .period{font-size:.85rem;color:var(--muted);}
  .price-card ul{list-style:none;padding:0;margin:0 0 1.8rem 0;display:flex;flex-direction:column;gap:.7rem;flex:1;}
  .price-card ul li{font-size:.87rem;color:var(--ink);display:flex;align-items:flex-start;gap:.55rem;line-height:1.45;}
  .price-card ul li i{color:var(--teal);font-size:.85rem;margin-top:.2rem;flex-shrink:0;}
  .price-card ul li.dimmed{color:var(--muted);}
  .price-card ul li.dimmed i{color:var(--muted);}
  .price-card .btn{width:100%;text-align:center;}

  /* ---------- Compare table ---------- */
  .compare-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:16px;background:var(--card);}
  table.compare{width:100%;border-collapse:collapse;min-width:680px;}
  table.compare th, table.compare td{padding:.95rem 1.2rem;text-align:left;border-bottom:1px solid var(--line);font-size:.88rem;}
  table.compare thead th{font-family:'JetBrains Mono',monospace;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);background:var(--paper);}
  table.compare td:not(:first-child), table.compare th:not(:first-child){text-align:center;}
  table.compare tbody tr:last-child td{border-bottom:none;}
  table.compare td:first-child{font-weight:600;color:var(--ink);}
  table.compare i.bi-check-circle-fill{color:var(--teal);}
  table.compare i.bi-dash-circle{color:var(--line);}