/* ============================================================
   PREMIUM.CSS — khusus halaman Premium
   Bergantung pada public-shared.css (harus di-load duluan).
============================================================ */

/* ============================================================
   HERO
============================================================ */
.pr-hero{padding:64px 0 50px;text-align:center;}
.pr-hero .eyebrow{justify-content:center;width:100%;color:var(--gold);}
.pr-hero .eyebrow::before{background:var(--gold);box-shadow:0 0 8px var(--gold);}
.pr-hero h1{
  font-size:clamp(30px,4.6vw,46px);font-weight:900;letter-spacing:-1px;
  line-height:1.12;margin-bottom:16px;
}
.pr-hero h1 .grad{
  background:linear-gradient(135deg,var(--gold) 0%,#fde68a 50%,#fff 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.pr-hero p{font-size:15.5px;color:var(--text2);line-height:1.65;max-width:560px;margin:0 auto 8px;}

/* Billing toggle */
.bill-toggle{
  display:inline-flex;align-items:center;gap:10px;margin:26px 0 6px;
  padding:5px;border-radius:30px;background:var(--surface2);border:1px solid var(--border);
}
.bill-toggle button{
  padding:8px 18px;border-radius:24px;font-size:12.5px;font-weight:700;color:var(--text2);transition:.18s;
}
.bill-toggle button.active{background:linear-gradient(135deg,#1d4ed8,#388bfd);color:#fff;box-shadow:0 2px 10px rgba(56,139,253,.4);}
.bill-toggle .save-badge{
  font-size:10px;font-weight:800;color:#1a1300;background:var(--gold);
  padding:2px 7px;border-radius:10px;margin-left:6px;
}

/* ============================================================
   PRICING CARDS
============================================================ */
.pricing-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:760px;margin:0 auto;align-items:stretch;}
.price-card{padding:32px 28px;display:flex;flex-direction:column;}
.price-card.featured{
  border-color:rgba(251,191,36,.4);
  background:linear-gradient(160deg,rgba(251,191,36,.08),var(--surface));
  box-shadow:0 0 0 1px rgba(251,191,36,.15),0 20px 50px rgba(0,0,0,.4);
}
.price-tag{
  position:absolute;top:18px;right:18px;
  padding:4px 11px;border-radius:20px;font-size:10.5px;font-weight:800;letter-spacing:.3px;
  background:linear-gradient(135deg,var(--gold),var(--gold2));color:#1a1300;
}
.price-name{font-size:13px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:14px;}
.price-name.gold{color:var(--gold);}
.price-amount{display:flex;align-items:flex-end;gap:6px;margin-bottom:6px;}
.price-amount .pa-val{font-size:42px;font-weight:900;letter-spacing:-1.5px;line-height:1;}
.price-amount .pa-per{font-size:13px;color:var(--text2);padding-bottom:6px;}
.price-sub{font-size:12.5px;color:var(--text3);margin-bottom:24px;}
.price-feats{display:flex;flex-direction:column;gap:13px;margin-bottom:26px;flex:1;}
.price-feat{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--text2);line-height:1.5;}
.price-feat svg{width:16px;height:16px;flex-shrink:0;margin-top:1px;}
.price-feat.yes svg{color:var(--green2);}
.price-feat.no{color:var(--text3);}
.price-feat.no svg{color:var(--text3);}

/* ============================================================
   COMPARISON TABLE
============================================================ */
.cmp-card{padding:0;overflow:hidden;}
.cmp-table{width:100%;border-collapse:collapse;font-size:13.5px;}
.cmp-table th,.cmp-table td{padding:15px 20px;border-bottom:1px solid rgba(56,139,253,.06);}
.cmp-table thead th{
  text-align:center;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;
  background:var(--surface2);border-bottom:1px solid var(--border);
}
.cmp-table thead th:first-child{text-align:left;color:var(--text2);}
.cmp-table thead th.gold-col{color:var(--gold);}
.cmp-table tbody th{text-align:left;font-weight:600;color:var(--text2);font-size:13px;}
.cmp-table tbody td{text-align:center;}
.cmp-table tbody tr:last-child td,.cmp-table tbody tr:last-child th{border-bottom:none;}
.cmp-table tbody tr:hover{background:rgba(56,139,253,.03);}
.cmp-table .cell-yes{color:var(--green2);}
.cmp-table .cell-no{color:var(--text3);}
.cmp-table .cell-val{font-weight:700;color:var(--text);}
.cmp-table svg{width:17px;height:17px;}
.gold-col-cell{background:rgba(251,191,36,.04);}

@media(max-width:760px){
  .pricing-grid{grid-template-columns:1fr;}
  .cmp-table{font-size:12px;}
  .cmp-table th,.cmp-table td{padding:11px 10px;}
}

/* ============================================================
   TRUST STRIP
============================================================ */
.trust-strip{display:flex;align-items:center;justify-content:center;gap:38px;flex-wrap:wrap;opacity:.85;}
.trust-item{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--text2);font-weight:600;}
.trust-item svg{width:16px;height:16px;color:var(--green2);}