/* Tema warna situs (dibuat buat-tema.py dari app.css + mobile-responsive.css,
   hue 250). Hanya deklarasi berwarna merek; jangan sunting tangan bagian ini. */
:root,:host{--color-pink-50:oklch(96.89% 0.012 250.0);--color-pink-100:oklch(94.38% 0.024 250.0);--color-pink-200:oklch(89.00% 0.052 250.0);--color-pink-300:oklch(80.58% 0.099 250.0);--color-pink-400:oklch(69.09% 0.169 250.0);--color-pink-500:oklch(62.44% 0.175 250.0);--color-pink-600:oklch(56.60% 0.161 250.0);--color-pink-700:oklch(50.44% 0.142 250.0);--color-jf-pink:oklch(67.14% 0.172 250.0);--color-jf-pinkDark:oklch(61.47% 0.169 250.0)}
.border-pink-100\/80{border-color:oklch(94.41% 0.023 250.0 / 0.8)}
.bg-\[\#fef3f9\]{background-color:oklch(97.23% 0.012 250.0)}
.bg-pink-50\/60{background-color:oklch(96.93% 0.012 250.0 / 0.6)}
.dark\:border-pink-500\/20:where(.dark,.dark *){border-color:oklch(62.42% 0.174 250.0 / 0.2)}
.dark\:bg-pink-500\/10:where(.dark,.dark *){background-color:oklch(62.42% 0.174 250.0 / 0.102)}
.dark\:ring-pink-500\/20:where(.dark,.dark *){--tw-ring-color:oklch(62.42% 0.174 250.0 / 0.2)}
.dark\:ring-pink-500\/30:where(.dark,.dark *){--tw-ring-color:oklch(62.42% 0.174 250.0 / 0.302)}
@media (hover:hover){.dark\:hover\:bg-pink-500\/20:where(.dark,.dark *):hover{background-color:oklch(62.42% 0.174 250.0 / 0.2)}}
.dark\:focus\:ring-pink-500\/20:where(.dark,.dark *):focus{--tw-ring-color:oklch(62.42% 0.174 250.0 / 0.2)}
.jf-hero-bg{background-image:linear-gradient(oklch(67.14% 0.172 250.0) 0%,#8debff 100%)}
.jf-header-line{background-image:linear-gradient(90deg,oklch(67.14% 0.172 250.0) 0%,#8debff 100%)}
.jf-faq-bg{background-image:linear-gradient(oklch(97.23% 0.012 250.0) 0%,#fff 42% 100%)}
.jf-reviews-bg{background-image:linear-gradient(90deg,#fff 0%,oklch(97.23% 0.012 250.0) 100%)}
.jf-feat-bg{background-image:linear-gradient(#fff 0%,oklch(97.23% 0.012 250.0) 100%)}
.jf-num{background-image:linear-gradient(oklch(67.14% 0.172 250.0) 0%,#8debff 100%);box-shadow:0 8px 24px oklch(67.14% 0.172 250.0 / 0.349)}
.jf-timeline-line{background-image:linear-gradient(oklch(67.14% 0.172 250.0) 0%,#8debff 100%)}
.jf-kicker{color:oklch(67.14% 0.172 250.0)}
.jf-title{background-image:linear-gradient(90deg,oklch(54.76% 0.155 250.0) 0%,oklch(67.14% 0.172 250.0) 70%,oklch(61.47% 0.169 250.0) 100%)}
.jf-stat{background-image:linear-gradient(90deg,oklch(54.76% 0.155 250.0) 0%,oklch(67.14% 0.172 250.0) 100%)}
.jf-trust-ico{color:oklch(67.14% 0.172 250.0);filter:drop-shadow(0 10px 18px oklch(67.14% 0.172 250.0 / 0.4))}
.jf-hero-kicker{text-shadow:0 1px 2px oklch(29.00% 0.081 250.0 / 0.4)}
.jf-hero-heading{text-shadow:0 1px 2px oklch(29.00% 0.081 250.0 / 0.451),0 2px 12px oklch(29.00% 0.081 250.0 / 0.302)}
.jf-hero-sub{text-shadow:0 1px 2px oklch(29.00% 0.081 250.0 / 0.349)}
.jf-hero-item{text-shadow:0 1px 2px oklch(29.00% 0.081 250.0 / 0.4)}
.jf-hero-muted{text-shadow:0 1px 2px oklch(29.00% 0.081 250.0 / 0.322)}
.jf-side-link.is-active{color:oklch(67.14% 0.172 250.0);background:oklch(97.23% 0.012 250.0)}
.dark .jf-side-link.is-active{color:oklch(67.14% 0.172 250.0);background:oklch(67.14% 0.172 250.0 / 0.122)}
.jf-member .jf-deposit-submit{background-color: oklch(67.14% 0.172 250.0)}
.jf-member .jf-deposit-submit:hover:not(:disabled){background-color: oklch(61.47% 0.169 250.0)}
@media (max-width: 1023px){.jf-member #orderForm .jf-order-picker{--jf-picker-bg: oklch(97.23% 0.012 250.0);--jf-picker-hover: oklch(94.41% 0.023 250.0)}}
@media (max-width: 1023px){.jf-member #orderForm .jf-order-picker:where(.dark *){--jf-picker-hover: oklch(28.78% 0.077 250.0)}}
@media (max-width: 1023px){.jf-member #orderForm .jf-order-picker__trigger:focus-visible{outline: 2px solid oklch(62.83% 0.177 250.0)}}
@media (max-width: 1023px){.jf-member #orderForm .jf-order-picker__trigger[aria-expanded="true"]{border-color: oklch(62.83% 0.177 250.0)}}
body.jf-storefront .bg-jf-pink{background-image: linear-gradient(90deg, oklch(54.76% 0.155 250.0) 0%, oklch(56.70% 0.161 250.0) 100%)}
body.jf-storefront .hover\:bg-jf-pinkDark:hover{background-image: linear-gradient(90deg, oklch(49.28% 0.139 250.0) 0%, oklch(54.76% 0.155 250.0) 100%)}
html:not(.dark) body.jf-storefront .text-jf-pink{color: oklch(54.76% 0.155 250.0)}
html:not(.dark) body.jf-storefront .jf-kicker,
html:not(.dark) body.jf-storefront .text-jf-pink.uppercase{color: oklch(49.28% 0.139 250.0);background-image: linear-gradient(90deg, oklch(49.28% 0.139 250.0) 0%, oklch(54.76% 0.155 250.0) 100%)}
html:not(.dark) body.jf-storefront .jf-stat{background-image: linear-gradient(90deg, oklch(49.28% 0.139 250.0) 0%, oklch(56.70% 0.161 250.0) 100%)}
/* aturan asli yang mematikan latar, disalin ulang agar tetap menang */
.jf-title-light{color:#fff;-webkit-text-fill-color:#fff;background:0 0}
@media (max-width: 1023px){.jf-member #orderForm .jf-order-picker__option{display: block; width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px; border: 0; border-radius: 4px; background: transparent; color: inherit; text-align: left; white-space: normal; overflow-wrap: anywhere; font-size: 16px; line-height: 1.5;}}

/* ===== LikeGratis.net: warna dan animasi khas situs =====
   Biru gelap dengan sorotan cyan dan merah, ilustrasi ponsel yang sedang
   LIVE dengan aliran hati dan piringan musik berputar, serta FAQ akordeon.
   Hanya transform/opacity, hiasan aria-hidden, mati untuk reduced-motion. */
.jf-hero-bg{background-image:linear-gradient(160deg,#020617 0%,#0b1a3a 55%,#1e3a8a 100%)}
.jf-header-line,.jf-timeline-line{background-image:linear-gradient(90deg,#22d3ee 0%,#fe2c55 100%)}
.jf-num{background-image:linear-gradient(#2563eb 0%,#22d3ee 100%);box-shadow:0 8px 24px rgba(37,99,235,.35)}

.lgn-sorot{position:absolute;border-radius:9999px;filter:blur(70px);pointer-events:none;animation:lgn-hanyut 12s ease-in-out infinite;will-change:transform}
.lgn-sorot--a{width:24rem;height:24rem;left:-6rem;top:2rem;background:#22d3ee;opacity:.28}
.lgn-sorot--b{width:22rem;height:22rem;right:-5rem;bottom:0;background:#fe2c55;opacity:.26;animation-delay:-6s}
@keyframes lgn-hanyut{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(3rem,-2rem,0)}}

.lgn-pita{display:inline-flex;align-items:center;gap:.55rem;border-radius:9999px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);padding:.35rem 1rem .35rem .4rem;font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff}
.lgn-pita b{display:inline-flex;align-items:center;gap:.35rem;border-radius:9999px;background:#fe2c55;padding:.15rem .55rem;font-size:.68rem;letter-spacing:.06em}
.lgn-pita b::before{content:"";width:.45rem;height:.45rem;border-radius:9999px;background:#fff;animation:lgn-kedip 1.4s ease-in-out infinite}
@keyframes lgn-kedip{0%,100%{opacity:1}50%{opacity:.25}}
.lgn-janji{display:inline-flex;align-items:center;gap:.4rem;border-radius:.6rem;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);padding:.4rem .85rem;color:#fff}
.lgn-janji svg{width:.95rem;height:.95rem;flex:none;color:#22d3ee}

/* Ilustrasi ponsel LIVE */
.lgn-hp{position:relative;margin:0 auto;width:13rem;aspect-ratio:9/17;border-radius:2.3rem;padding:.55rem;background:#0b0f19;box-shadow:0 30px 60px -24px rgba(0,0,0,.85),inset 0 0 0 2px rgba(255,255,255,.08)}
.lgn-hp__layar{position:relative;height:100%;border-radius:1.8rem;overflow:hidden;background:linear-gradient(170deg,#1e3a8a 0%,#6d28d9 48%,#be123c 100%)}
.lgn-hp__layar::before{content:"";position:absolute;width:70%;height:45%;left:15%;top:22%;border-radius:9999px;background:rgba(255,255,255,.18);filter:blur(28px);animation:lgn-hanyut 7s ease-in-out infinite}
.lgn-hp__atas{position:absolute;top:.9rem;left:.85rem;right:.85rem;display:flex;align-items:center;gap:.4rem;font-size:.62rem;font-weight:800;color:#fff}
.lgn-hp__atas b{background:#fe2c55;border-radius:.3rem;padding:.14rem .42rem;letter-spacing:.06em;animation:lgn-kedip 1.6s ease-in-out infinite}
.lgn-hp__atas span{background:rgba(0,0,0,.35);border-radius:.3rem;padding:.14rem .42rem}
.lgn-hp__aksi{position:absolute;right:.6rem;bottom:5.2rem;display:flex;flex-direction:column;align-items:center;gap:.95rem;color:#fff;font-size:.58rem;font-weight:700}
.lgn-hp__aksi span{display:grid;justify-items:center;gap:.15rem}
.lgn-hp__aksi svg{width:1.55rem;height:1.55rem;filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))}
.lgn-hp__aksi .lgn-hati-besar{color:#fe2c55;animation:lgn-detak 1.8s ease-in-out infinite}
@keyframes lgn-detak{0%,100%{transform:scale(1)}15%{transform:scale(1.22)}30%{transform:scale(.96)}}
.lgn-hp__bawah{position:absolute;left:.85rem;right:3.6rem;bottom:1rem;color:#fff}
.lgn-hp__bawah p{font-size:.72rem;font-weight:800}
.lgn-hp__bawah small{display:block;margin-top:.15rem;font-size:.6rem;opacity:.85}
.lgn-disk{position:absolute;right:.65rem;bottom:.9rem;width:2rem;height:2rem;border-radius:9999px;background:conic-gradient(#0f172a 0 25%,#334155 25% 50%,#0f172a 50% 75%,#334155 75%);box-shadow:inset 0 0 0 .45rem #111827,0 0 0 2px rgba(255,255,255,.25);animation:lgn-putar 4s linear infinite}
@keyframes lgn-putar{to{transform:rotate(360deg)}}
.lgn-alir{position:absolute;right:3.3rem;bottom:3.6rem;width:1.1rem;height:1.1rem;color:var(--w);opacity:0;animation:lgn-alir var(--d) ease-out var(--t) infinite}
.lgn-alir svg{width:100%;height:100%;display:block}
@keyframes lgn-alir{
  0%{transform:translate3d(0,0,0) scale(.4);opacity:0}
  10%{opacity:1}
  50%{transform:translate3d(var(--g),-7rem,0) scale(1)}
  100%{transform:translate3d(calc(var(--g) * -.6),-14rem,0) scale(.7);opacity:0}
}
.lgn-hp__ket{position:absolute;left:0;right:0;bottom:-1.6rem;text-align:center;font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;color:#94a3b8}
@media (max-width:1023px){.lgn-hp{display:none}}

.lgn-momen{position:relative;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease}
.lgn-momen::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#22d3ee,#fe2c55)}
@media (hover:hover){.lgn-momen:hover{transform:translateY(-4px);box-shadow:0 16px 32px -16px rgba(30,58,138,.45)}}
.lgn-momen__no{font-size:2.1rem;font-weight:800;line-height:1;background:linear-gradient(135deg,#2563eb,#22d3ee);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.lgn-langkah-no{display:grid;place-items:center;width:2.25rem;height:2.25rem;flex:none;border-radius:.7rem;color:#fff;font-weight:800;font-size:.9rem;background:linear-gradient(135deg,#1d4ed8 0%,#0891b2 100%)}

/* FAQ akordeon: dua kolom di desktop */
.lgn-faq-kolom{gap:.75rem}
@media (min-width:1024px){.lgn-faq-kolom{gap:1.25rem}}
.lgn-tanya{border:1px solid #e2e8f0;border-radius:1rem;background:#fff;transition:box-shadow .25s ease,border-color .25s ease}
.dark .lgn-tanya{background:#0f172a;border-color:#1e293b}
.lgn-tanya summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.05rem 1.25rem;font-weight:700;color:#0f172a}
.dark .lgn-tanya summary{color:#fff}
.lgn-tanya summary::-webkit-details-marker{display:none}
.lgn-tanya summary i{flex:none;display:grid;place-items:center;width:1.7rem;height:1.7rem;border-radius:9999px;background:#eff6ff;color:#1d4ed8;font-style:normal;font-weight:800;transition:transform .25s ease,background .25s ease}
.dark .lgn-tanya summary i{background:#1e293b;color:#67e8f9}
.lgn-tanya[open]{border-color:#93c5fd;box-shadow:0 14px 30px -18px rgba(29,78,216,.45)}
.lgn-tanya[open] summary i{transform:rotate(45deg);background:#dbeafe}
.lgn-tanya p{padding:0 1.25rem 1.15rem;font-size:.93rem;line-height:1.7;color:#475569}
.dark .lgn-tanya p{color:#94a3b8}

@media (prefers-reduced-motion:reduce){
  .lgn-sorot,.lgn-hp__layar::before,.lgn-disk,.lgn-hp__aksi .lgn-hati-besar,.lgn-pita b::before,.lgn-hp__atas b{animation:none}
  .lgn-alir{display:none}
  .lgn-momen,.lgn-tanya,.lgn-tanya summary i{transition:none}
}

/* Panduan: lebar penuh. Desktop: pembuka (menempel) + langkah, lalu topik 4 kolom. */
.situs-panduan{display:grid;gap:2rem}
@media (min-width:1024px){.situs-panduan{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:3.5rem;align-items:start}.situs-panduan__intro{position:sticky;top:6.5rem}}
.situs-topik{display:grid;gap:1.25rem;margin-top:2.5rem}
@media (min-width:768px){.situs-topik{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1280px){.situs-topik{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ===== LikeGratis.net: testimoni scrolling dua baris (lgn-review-*) ===== */
.lgn-review-wrap{overflow:hidden;position:relative;padding:.25rem 0}
.lgn-review-wrap::before,
.lgn-review-wrap::after{content:"";position:absolute;top:0;bottom:0;width:5rem;z-index:2;pointer-events:none}
.lgn-review-wrap::before{left:0;background:linear-gradient(to right,#fff 0%,transparent 100%)}
.lgn-review-wrap::after{right:0;background:linear-gradient(to left,#fff 0%,transparent 100%)}
.dark .lgn-review-wrap::before{background:linear-gradient(to right,#020617 0%,transparent 100%)}
.dark .lgn-review-wrap::after{background:linear-gradient(to left,#020617 0%,transparent 100%)}
.lgn-review-band{display:flex;gap:1.25rem;padding:0 0 1.25rem;width:max-content;animation:lgn-rev-kiri 32s linear infinite;will-change:transform}
.lgn-review-band--kanan{animation:lgn-rev-kanan 36s linear infinite}
@keyframes lgn-rev-kiri{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes lgn-rev-kanan{0%{transform:translateX(-50%)}100%{transform:translateX(0)}}
.lgn-review-kartu{flex:none;width:min(80vw,21rem);border-radius:1rem;border:1px solid oklch(94.54% 0.025 280.0 / 0.8);padding:1.4rem 1.5rem 1.3rem;background:#fff;position:relative;transition:box-shadow .2s ease}
.dark .lgn-review-kartu{background:oklch(14.5% 0.01 280.0);border-color:oklch(28% 0.04 280.0)}
.lgn-review-kartu::before{content:"\201C";position:absolute;top:.45rem;right:1.1rem;font-size:3.8rem;line-height:1;color:oklch(81.20% 0.093 280.0);opacity:.35;font-family:Georgia,serif;pointer-events:none}
@media (hover:hover){.lgn-review-kartu:hover{box-shadow:0 10px 32px -10px oklch(68.29% 0.169 280.0 / 0.3)}}
.lgn-review-bintang{display:flex;gap:.18rem;margin-bottom:.85rem}
.lgn-review-bintang svg{width:.95rem;height:.95rem;fill:#f59e0b;stroke:none}
.lgn-review-teks{font-size:.875rem;line-height:1.65;color:#475569;min-height:4rem}
.dark .lgn-review-teks{color:#94a3b8}
.lgn-review-nama{margin-top:.85rem;font-weight:700;font-size:.85rem;color:#0f172a;line-height:1.3}
.dark .lgn-review-nama{color:#f1f5f9}
.lgn-review-profesi{font-size:.75rem;color:#64748b;margin-top:.08rem}
.lgn-review-tanggal{font-size:.7rem;color:#94a3b8;margin-top:.35rem;display:block}
@media (prefers-reduced-motion:reduce){
  .lgn-review-band,.lgn-review-band--kanan{animation:none;flex-wrap:wrap}
}
