/* ============================================================
   apk.css — Halaman Langganan Premium FrostyUp
============================================================ */

.apk-main{ padding: calc(var(--nav-h) + 28px) 0 80px; overflow-x:hidden; }

/* Hero */
.apk-hero{
  display:flex; align-items:center; justify-content:space-between; gap:32px;
  padding: 40px 48px; border-radius: var(--radius-lg); margin-bottom: 40px;
  flex-wrap:wrap;
}
.apk-hero-text{ flex:1; min-width:0; }
.apk-hero-text h1{ font-size: clamp(1.6rem, 3vw, 2.4rem); margin-bottom:12px; line-height:1.2; }
.apk-hero-text .muted{ font-size:1rem; max-width:500px; margin-bottom:20px; line-height:1.6; }
.apk-hero-badges{ display:flex; flex-wrap:wrap; gap:10px; }
.trust-badge{
  display:flex; align-items:center; gap:6px; padding: 6px 12px;
  background: rgba(0,229,255,0.08); border: 1px solid rgba(0,229,255,0.2);
  border-radius:999px; font-size:0.8rem; color: var(--ice);
}
.apk-hero-logos{ display:flex; gap:12px; flex-wrap:wrap; }
.app-logo-chip{
  display:flex; align-items:center; gap:8px; padding: 10px 16px;
  border-radius: 12px; font-weight:600; font-size:0.85rem; color: var(--frost);
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
}

/* Filter tabs */
.apk-filter-wrap{
  display:flex; gap:8px; flex-wrap:wrap; margin-bottom:28px;
}
.apk-filter-btn{
  padding: 9px 20px; border-radius:999px; font-family: var(--ff-display);
  font-weight:600; font-size:0.86rem; border:1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.04); color: var(--frost-dim);
  cursor:pointer; transition: all .2s ease;
}
.apk-filter-btn:hover{ color: var(--frost); border-color: rgba(0,229,255,0.3); }
.apk-filter-btn.active{ background: var(--grad-cyan); color:#04141C; border-color:transparent; box-shadow: 0 0 16px rgba(0,229,255,0.3); }

/* Product grid */
.apk-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(min(290px,100%), 1fr));
  gap:20px; margin-bottom:20px;
}
.apk-card{
  position:relative; padding:24px; border-radius: var(--radius-md);
  display:flex; flex-direction:column; gap:16px; min-width:0;
  transition: transform .2s ease, box-shadow .2s ease;
}
.apk-card:hover{ transform: translateY(-4px); box-shadow: var(--shadow-glow-strong); }

.apk-badge{
  position:absolute; top:16px; right:16px; font-size:0.7rem; font-weight:700;
  padding: 4px 10px; border-radius:999px; border:1px solid;
}
.apk-card-head{ display:flex; align-items:center; gap:12px; }
.apk-brand-logo{
  width:44px; height:44px; border-radius:12px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  border: 1px solid rgba(255,255,255,0.08);
}
.apk-card-name{ font-family: var(--ff-display); font-weight:700; font-size:1rem; }
.apk-card-type{ font-size:0.78rem; color: var(--muted); margin-top:2px; }

/* Badge per brand */
.apk-badge{ position:absolute; top:16px; right:16px; font-size:0.7rem; font-weight:700; padding: 4px 10px; border-radius:999px; border:1px solid; }
.apk-badge-youtube{ background:rgba(255,0,0,0.12); color:#FF4444; border-color:rgba(255,0,0,0.3); }
.apk-badge-netflix{ background:rgba(229,9,20,0.12); color:#FF3333; border-color:rgba(229,9,20,0.3); }
.apk-badge-spotify{ background:rgba(29,185,84,0.12); color:#1DB954; border-color:rgba(29,185,84,0.3); }
.apk-badge-disney{ background:rgba(17,60,207,0.12); color:#4C7FFF; border-color:rgba(17,60,207,0.3); }

/* Harga per brand */
.apk-price-youtube{ color:#FF4444; }
.apk-price-netflix{ color:#FF3333; }
.apk-price-spotify{ color:#1DB954; }
.apk-price-disney{ color:#4C7FFF; }

/* Checklist per brand */
.apk-features-youtube li svg{ stroke:#FF4444; }
.apk-features-netflix li svg{ stroke:#FF3333; }
.apk-features-spotify li svg{ stroke:#1DB954; }
.apk-features-disney li svg{ stroke:#4C7FFF; }

/* How it works */
.apk-how{ padding:40px; border-radius: var(--radius-lg); }
.apk-steps{ display:flex; align-items:flex-start; gap:8px; flex-wrap:wrap; margin-top:32px; }
.apk-step{ flex:1; min-width:140px; text-align:center; }
.apk-step-num{
  width:40px; height:40px; border-radius:50%; margin:0 auto 12px;
  display:flex; align-items:center; justify-content:center;
  background: var(--grad-cyan); color:#04141C; font-weight:700; font-size:1.1rem;
}
.apk-step h4{ font-size:0.95rem; margin-bottom:6px; }
.apk-step .muted{ font-size:0.8rem; line-height:1.5; }
.apk-step-arrow{ color: var(--muted); flex-shrink:0; margin-top:20px; }

/* FAQ */
.apk-faq-list{ padding:8px; border-radius: var(--radius-md); }
.apk-faq-item{
  border-bottom:1px solid rgba(255,255,255,0.06); padding:18px 20px;
}
.apk-faq-item:last-child{ border-bottom:none; }
.apk-faq-item summary{
  font-weight:600; font-size:0.95rem; cursor:pointer; list-style:none;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.apk-faq-item summary::-webkit-details-marker{ display:none; }
.apk-faq-item summary::after{
  content:""; width:10px; height:10px; border-right:2px solid var(--muted);
  border-bottom:2px solid var(--muted); transform:rotate(45deg); flex-shrink:0;
  transition: transform .2s ease;
}
.apk-faq-item[open] summary::after{ transform:rotate(-135deg); }
.apk-faq-item p{ margin-top:12px; font-size:0.88rem; color: var(--frost-dim); line-height:1.6; }

@media (max-width: 768px){
  .apk-hero{ padding:28px 22px; flex-direction:column; }
  .apk-steps{ flex-direction:column; align-items:center; }
  .apk-step-arrow{ transform:rotate(90deg); margin:0; }
}

.apk-card-desc{ font-size:0.84rem; line-height:1.6; margin:0; }
.apk-features{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px; }
.apk-features li{ display:flex; align-items:center; gap:8px; font-size:0.82rem; color: var(--frost-dim); }
.apk-card-footer{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.apk-price-wrap{ display:flex; align-items:baseline; gap:4px; flex-wrap:wrap; }
.apk-old-price{ font-size:0.8rem; color: var(--muted); text-decoration:line-through; }
.apk-price{ font-family: var(--ff-display); font-weight:700; font-size:1.2rem; }
.apk-per{ font-size:0.75rem; color: var(--muted); }
.apk-buy-btn{ flex-shrink:0; padding: 10px 18px; font-size:0.84rem; }

/* ===== APK halaman gaya Joki Rank ===== */
.apk-joki-hero{
  padding: calc(var(--nav-h) + 40px) 0 48px;
  text-align: center;
}
.apk-joki-hero h1{ font-size: clamp(1.8rem,3.5vw,2.8rem); margin-bottom:12px; }
.apk-joki-hero .muted{ max-width:520px; margin:0 auto 20px; }

/* Thumbnail background per brand */
.apk-thumb-yt{ background: linear-gradient(135deg, #1a0000, #3d0000); }
.apk-thumb-nf{ background: linear-gradient(135deg, #1a0005, #3d0010); }
.apk-thumb-sp{ background: linear-gradient(135deg, #001a06, #003d10); }
.apk-thumb-ds{ background: linear-gradient(135deg, #00051a, #00103d); }

.apk-thumb-icon{
  display:flex; align-items:center; justify-content:center;
  width:100%; height:100%;
}

.apk-service-grid{
  grid-template-columns: repeat(auto-fill, minmax(min(280px,100%),1fr));
}