/* =========================================================
   VORTEX CMS — PAGE CSS (halaman generik: About, Privacy Policy, dll)
   ========================================================= */

.vx-pp-sky{
  position:relative;
  background-image:
    linear-gradient(180deg, rgba(5,7,13,0) 0%, rgba(5,7,13,.35) 35%, rgba(5,7,13,.65) 65%, rgba(5,7,13,.92) 100%),
    url('/uploads/2026/08/desktop_seamless_1-scaled-1.webp');
  background-position:center top, center center;
  background-repeat:no-repeat, no-repeat;
  background-size:100% 100%, cover;
  overflow:hidden;
}
@media(max-width:1281px){
  .vx-pp-sky{background-image:linear-gradient(180deg, rgba(5,7,13,0) 0%, rgba(5,7,13,.35) 35%, rgba(5,7,13,.65) 65%, rgba(5,7,13,.92) 100%), url('/uploads/2026/08/Desktop-Seamless-scaled-1.png');background-repeat:no-repeat, repeat;background-size:100% 100%, auto;background-position:center top, center top}
}

.vx-cloud-fixed{position:absolute;top:0;left:0;height:55vh;pointer-events:none;display:flex}
.vx-cloud-fixed img{height:100%;width:auto!important;max-width:none!important;flex-shrink:0;display:block}
.vx-cloud-fixed.back{opacity:.5;z-index:1;animation:vxPPCloud 100s linear infinite}
.vx-cloud-fixed.front{top:20%;opacity:.35;z-index:8;animation:vxPPCloud 60s linear infinite}
@keyframes vxPPCloud{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(-50%,0,0)}}

.vx-pp-hero{position:relative;z-index:5;padding:150px 24px 60px;text-align:center;max-width:760px;margin:0 auto;color:#fff}
.vx-pp-island{width:min(360px,75vw);margin:0 auto 6px;display:block;filter:drop-shadow(0 30px 26px rgba(0,0,0,.4));animation:vxPPBob 5s ease-in-out infinite}
@keyframes vxPPBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.vx-pp-hero h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(30px,5vw,52px);font-weight:700;letter-spacing:-1.4px;margin:18px 0 0;line-height:1.08;text-shadow:0 8px 30px rgba(0,0,0,.5)}
.vx-pp-hero p{color:#fff;opacity:.9;font-size:14px;line-height:1.65;margin-top:16px;text-shadow:0 2px 14px rgba(0,0,0,.5)}

.vx-pp-wrap{max-width:760px;margin:0 auto;padding:20px 24px 50px;position:relative;z-index:5}

/* Section rich content (dipakai body_html dari admin) */
.vx-sec{margin-bottom:40px}
.vx-sec .vx-kicker{font-size:11.5px;letter-spacing:2.5px;text-transform:uppercase;color:#ffd98f;font-weight:700;margin-bottom:10px}
.vx-sec h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(20px,3vw,28px);font-weight:700;letter-spacing:-.7px;margin:0 0 14px;color:#fff}
.vx-sec p{color:#d7dae2;font-size:14.5px;line-height:1.8;margin:0 0 14px;text-shadow:0 2px 10px rgba(0,0,0,.4)}
.vx-sec .vx-quote{font-family:'Space Grotesk',sans-serif;font-size:clamp(22px,3.5vw,32px);font-weight:700;color:#fff;line-height:1.3;margin:0 0 18px}

/* Section untuk Privacy Policy style (kartu blur) */
.vx-pp-sec{position:relative;z-index:5;max-width:760px;margin:0 auto 14px;padding:26px 28px;background:rgba(5,7,13,.55);backdrop-filter:blur(10px);border-radius:18px;border:1px solid rgba(255,255,255,.08)}
.vx-pp-sec h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(18px,2.6vw,24px);font-weight:700;letter-spacing:-.6px;margin:0 0 14px;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.4)}
.vx-pp-sec p{color:#e2e4ea;font-size:14px;line-height:1.85;margin:0 0 14px;text-shadow:0 2px 8px rgba(0,0,0,.3)}
.vx-pp-sec li{color:#e2e4ea;font-size:14px;line-height:1.85}
.vx-pp-sec strong{color:#fff}
.vx-pp-sec a{color:#ffd98f;text-decoration:underline}

.vx-pp-fade{position:relative;height:22vh;margin-top:-6vh;background:linear-gradient(180deg, rgba(5,7,13,0) 0%, rgba(5,7,13,.7) 50%, rgba(5,7,13,1) 100%);pointer-events:none;z-index:2}

/* Varian lebih gelap khusus artikel/blog — teks lebih jelas terbaca */
.vx-blog-sky{position:relative}
.vx-blog-sky:before{content:"";position:absolute;inset:0;background:rgba(5,7,13,.35);z-index:3;pointer-events:none}

/* CTA glass card (dipakai di akhir halaman) */
.vx-about-cta{position:relative;padding:20px 24px 0;text-align:center;z-index:5}
.vx-about-cta-box{position:relative;z-index:1;max-width:700px;margin:0 auto;background:rgba(13,16,23,.6);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.15);border-radius:24px;padding:44px 30px}
.vx-about-cta-box h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(20px,3vw,28px);font-weight:700;margin:0 0 10px;letter-spacing:-.8px;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.4)}
.vx-about-cta-box p{color:#e2e4ea;font-size:14px;margin:0 0 22px;text-shadow:0 2px 8px rgba(0,0,0,.4)}
.vx-about-cta-box a{display:inline-block;background:#25d366;color:#fff;padding:14px 28px;border-radius:999px;font-weight:800;font-size:14px;text-decoration:none;font-style:normal!important}

/* ============ KONTEN KAYA — service cards, stat box, funnel (About Us dll) ============ */
.vx-service-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:18px}
.vx-service-card{background:rgba(5,7,13,.5);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:20px}
.vx-service-card h3{font-family:'Space Grotesk',sans-serif;font-size:15px;color:#fff;margin:0 0 8px}
.vx-service-card p{font-size:12.5px;color:#9aa0b0;margin:0;line-height:1.6}

.vx-stat-box{background:rgba(5,7,13,.55);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:24px;margin-top:18px}
.vx-stat-row{display:flex;flex-wrap:wrap;gap:24px;margin-top:16px;justify-content:center}
.vx-stat-row div{text-align:center}
.vx-stat-row b{display:block;font-family:'Space Grotesk',sans-serif;font-size:26px;color:#ffd98f}
.vx-stat-row small{display:block;font-size:11.5px;color:#9aa0b0;margin-top:4px}

.vx-funnel{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:18px 0}
.vx-funnel span{background:rgba(255,217,143,.12);border:1px solid rgba(255,217,143,.3);color:#ffd98f;padding:8px 14px;border-radius:999px;font-size:12.5px;font-weight:700}
.vx-funnel i{color:#5c6170;font-style:normal}

.vx-founder-box{background:rgba(5,7,13,.5);border-left:3px solid #ffd98f;border-radius:0 14px 14px 0;padding:18px 22px;margin-top:16px}
.vx-founder-box p{margin:0;font-style:italic;color:#d7dae2}