/* G668 — "Lentera Galaksi"
   Site-level skin written for this brand only. It keeps the poster archetype
   (full-bleed hero, condensed display, pill CTAs) and pushes it towards the
   reference language: deep plum galaxy, gold satin, magenta glow, dense art.
   No reference copy, wordmark or assets from another brand are used here. */

:root{
  --bg:#12051f;
  --bg2:#1a0730;
  --panel:#250c40;
  --text:#fff4e6;
  --muted:#c3a7d6;
  --accent:#ff2d95;
  --accent2:#ffd45c;
  --line:rgba(255,212,92,.30);
  --radius:16px;
  --gold-deep:#b06a00;
  --violet:#7b2ff2;
}

/* ---------- canvas: galaxy, star dust, satin sheen ---------- */
html{background:#0d0418}
body{
  background:
    radial-gradient(1200px 620px at 12% -8%,rgba(123,47,242,.42),transparent 62%),
    radial-gradient(900px 540px at 92% 6%,rgba(255,45,149,.24),transparent 60%),
    radial-gradient(1000px 700px at 50% 108%,rgba(255,212,92,.14),transparent 62%),
    linear-gradient(180deg,#170730 0%,#12051f 42%,#0d0418 100%);
  background-attachment:fixed;
}
body::before{
  opacity:.55;
  background-image:
    radial-gradient(circle at 18% 22%,#fff 0 1px,transparent 1.6px),
    radial-gradient(circle at 72% 58%,var(--accent2) 0 1px,transparent 1.7px),
    radial-gradient(circle at 44% 84%,#ff8ad2 0 1px,transparent 1.6px);
  background-size:210px 210px,300px 300px,170px 170px;
}
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:url("g668-texture-960.webp");
  background-size:620px auto;background-repeat:repeat;
  opacity:.05;mix-blend-mode:screen;
}
body>*{position:relative;z-index:1}

/* ---------- header ---------- */
.site-header{
  background:linear-gradient(180deg,rgba(26,7,48,.97),rgba(18,5,31,.92));
  border-bottom:1px solid var(--line);
  box-shadow:0 14px 40px rgba(6,1,14,.55),0 1px 0 rgba(255,212,92,.18) inset;
  backdrop-filter:blur(14px) saturate(1.15);
}
.header-inner{min-height:76px;gap:18px}
.brand-logo{
  height:56px;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,.45));
}
.nav a{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--text);
  padding:8px 2px;border-bottom:2px solid transparent;text-decoration:none;
}
.nav a:hover,.nav a[aria-current="page"]{color:var(--accent2);border-bottom-color:var(--accent2)}
.menu-btn{
  border:1px solid var(--line);background:rgba(37,12,64,.85);color:var(--accent2);
  border-radius:999px;min-height:44px;padding:0 16px;
  font-family:ui-monospace,monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
}

/* ---------- gold policy strip ---------- */
.policy-strip{
  background:linear-gradient(92deg,#ffdf87 0%,var(--accent2) 38%,#f5a623 78%,#ffdf87 100%);
  border-bottom:1px solid rgba(120,60,0,.45);color:#3a1a05;
}
.policy-strip-inner{gap:9px;padding:6px 0;font-size:9.5px;letter-spacing:.09em}
.av-scoreline{background:#1c0a31;color:#ffd45c;border-bottom:1px solid rgba(255,212,92,.28);border-top:1px solid rgba(255,212,92,.12)}
.av-scoreline .wrap{padding:5px 0;gap:16px}
.av-scoreline b{color:#fff4e6}
.policy-badge,.policy-strip a{color:#3a1a05}
.policy-tag{color:#3a1a05;border-color:rgba(58,26,5,.45);background:rgba(255,255,255,.22)}
.policy-link{
  color:#3a1a05;border:1px solid rgba(58,26,5,.45);background:rgba(255,255,255,.28);
  border-radius:999px;padding:5px 12px;min-height:30px;font-weight:700;
}
.policy-link:hover{background:#fff6dd;color:#3a1a05}
.policy-note{color:rgba(58,26,5,.78);font-weight:600}

/* ---------- buttons: satin gold pills ---------- */
.btn{
  border-radius:999px;font-weight:900;letter-spacing:.06em;
  transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;
}
.btn-primary{
  background:
    linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0) 42%),
    linear-gradient(180deg,#ffe9a8 0%,var(--accent2) 46%,#f0a92a 100%);
  color:#33140a;border:2px solid #7d3f00;
  box-shadow:
    0 6px 0 #7d3f00,
    0 14px 30px rgba(255,168,23,.34),
    inset 0 1px 0 rgba(255,255,255,.75);
}
.btn-primary:hover{filter:brightness(1.05);transform:translateY(-2px);box-shadow:0 8px 0 #7d3f00,0 18px 34px rgba(255,168,23,.42),inset 0 1px 0 rgba(255,255,255,.8)}
.btn-ghost{
  background:linear-gradient(180deg,rgba(123,47,242,.30),rgba(18,5,31,.72));
  color:var(--accent2);border:2px solid rgba(255,212,92,.55);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 10px 26px rgba(6,1,14,.45);
}
.btn-ghost:hover{color:#fff;border-color:var(--accent2);background:linear-gradient(180deg,rgba(255,45,149,.35),rgba(18,5,31,.72))}
.av-textlink,.po-arrow,.route-link{
  font-family:var(--display);letter-spacing:.06em;color:var(--accent2);
  border-bottom:2px solid rgba(255,212,92,.6);text-transform:uppercase;
}

/* ---------- hero: full-bleed lobby art ---------- */
.av-hero{
  position:relative;isolation:isolate;overflow:hidden;
  padding:56px 0 46px;min-height:min(84vh,720px);
  display:flex;align-items:center;
  border-bottom:3px solid var(--accent2);
  background:radial-gradient(900px 520px at 78% 30%,rgba(123,47,242,.5),transparent 65%),
             radial-gradient(700px 420px at 8% 90%,rgba(255,45,149,.32),transparent 60%),
             linear-gradient(180deg,#160729,#0e0419);
}
.av-hero::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg,#0d0418 0%,#0d0418 40%,rgba(13,4,24,.94) 50%,rgba(13,4,24,.62) 68%,rgba(13,4,24,.2) 86%,rgba(13,4,24,.08) 100%),
    linear-gradient(180deg,rgba(13,4,24,.5) 0%,rgba(13,4,24,0) 34%,rgba(13,4,24,.42) 100%);
}
.av-hero-bg.av-hero-media{
  opacity:.98;
  filter:saturate(1.06) contrast(1.03);
  mask-image:linear-gradient(90deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.7) 38%,#000 62%);
  -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.7) 38%,#000 62%);
}
.av-hero-bg.av-hero-media img{object-position:64% 44%}
.av-hero-inner{position:relative;z-index:2;max-width:660px}
.hero-logo-lockup{gap:14px;margin-bottom:18px}
.hero-logo-lockup .hero-brand-logo{
  height:auto;width:204px;max-height:none;max-width:min(204px,56vw);
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.5));
}
.hero-logo-tag{
  color:#2b1004;background:linear-gradient(180deg,#ffe7a3,var(--accent2));
  border:1px solid #7d3f00;border-radius:999px;padding:4px 10px;font-weight:800;
  letter-spacing:.2em;box-shadow:0 3px 0 rgba(125,63,0,.75);
}
.av-eyebrow{color:var(--accent2);letter-spacing:.22em;font-size:10px;font-weight:700}
.av-eyebrow span{color:rgba(255,244,230,.72)}
.av-hero h1{
  font-family:var(--display);
  font-size:clamp(44px,6.4vw,86px);line-height:.92;letter-spacing:-.02em;
  text-transform:uppercase;
  color:#ffe9a8;
  background:linear-gradient(180deg,#fff8dc 6%,#ffd45c 48%,#f2a01f 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 3px 0 #5c2a00) drop-shadow(0 14px 30px rgba(255,45,149,.28));
  margin:0;
}
.av-deck{
  font-size:16px;line-height:1.7;color:#f4e3ff;max-width:640px;margin:18px 0 0;
  border-left:3px solid var(--accent2);padding-left:16px;
  text-shadow:0 2px 12px rgba(6,1,14,.8);
}
.av-chips span{
  border:1px solid rgba(255,212,92,.5);background:rgba(37,12,64,.72);
  color:#ffe6b0;border-radius:999px;padding:5px 10px;
}
.av-hero-actions{gap:12px;margin-top:24px}
.av-hero-stats{
  border:1px solid var(--line);border-radius:14px;overflow:hidden;
  background:linear-gradient(160deg,rgba(37,12,64,.86),rgba(18,5,31,.72));
  backdrop-filter:blur(6px);box-shadow:0 18px 40px rgba(6,1,14,.45);
}
.av-hero-stats div{border-right:1px solid rgba(255,212,92,.22)}
.av-hero-stats dt{color:var(--accent2);font-size:9px;letter-spacing:.14em}
.av-hero-stats dd{color:#fff4e6;font-size:13px}
.av-hero-stats dd:not(:empty){text-transform:none}

/* ---------- sections ---------- */
.section{padding:62px 0;border-bottom:1px solid rgba(255,212,92,.14)}
.section:nth-of-type(even){background:linear-gradient(180deg,rgba(37,12,64,.24),rgba(13,4,24,.12))}
.sec-head{max-width:780px}
.sec-head .kicker{
  display:inline-block;color:#2b1004;background:linear-gradient(180deg,#ffe7a3,var(--accent2));
  border:1px solid #7d3f00;border-radius:999px;padding:4px 12px;letter-spacing:.2em;font-weight:800;
  margin-bottom:12px;
}
.sec-head h2{
  font-size:clamp(26px,3.4vw,44px);letter-spacing:-.01em;
  color:#ffe9a8;
  background:linear-gradient(180deg,#fff8dc 4%,#ffd45c 52%,#f2a01f 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 2px 0 rgba(92,42,0,.85));
}
.sec-head p{color:var(--muted);font-size:14px;line-height:1.75}
.variant-poster .variant-prose h2,.variant-prose h2{
  border-top:2px solid var(--accent2);padding-top:12px;color:var(--accent2);
  -webkit-text-fill-color:currentColor;
}
.variant-poster .variant-page-hero h1{
  color:#ffe9a8;-webkit-text-stroke:0;
  background:linear-gradient(180deg,#fff8dc 6%,#ffd45c 50%,#f2a01f 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 3px 0 #5c2a00);
}

/* ---------- routes: three gold doors ---------- */
.route-grid{gap:14px}
.route-card{
  border:1px solid rgba(255,212,92,.34);border-radius:16px;
  background:linear-gradient(165deg,rgba(45,14,76,.92),rgba(18,5,31,.86));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 16px 34px rgba(6,1,14,.42);
  padding:22px;min-height:196px;
}
.route-card.primary{
  border-color:var(--accent2);
  background:
    radial-gradient(520px 240px at 100% 0%,rgba(255,45,149,.35),transparent 62%),
    linear-gradient(160deg,rgba(58,18,98,.95),rgba(22,6,38,.9));
  box-shadow:0 0 0 1px rgba(255,212,92,.35),0 20px 44px rgba(255,45,149,.22);
}
.route-card:hover{border-color:var(--accent2);transform:translateY(-3px)}
.route-card h3{font-size:clamp(20px,2.4vw,28px);color:var(--accent2);letter-spacing:-.01em}
.route-card p{color:var(--muted);font-size:12.5px;line-height:1.7}
.route-no{
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:999px;
  background:linear-gradient(180deg,#ffe7a3,var(--accent2));color:#3a1a05;
  font-family:var(--display);font-size:13px;box-shadow:0 3px 0 rgba(125,63,0,.8);
}
.variant-poster .route-grid{gap:14px;border-top:0}
.variant-poster .route-card{border:1px solid rgba(255,212,92,.34);border-radius:16px;min-height:196px;padding:22px;background:linear-gradient(165deg,rgba(45,14,76,.92),rgba(18,5,31,.86))}
.variant-poster .route-card.primary{background:radial-gradient(520px 240px at 100% 0%,rgba(255,45,149,.35),transparent 62%),linear-gradient(160deg,rgba(58,18,98,.95),rgba(22,6,38,.9))}
.variant-poster .route-card h3{color:var(--accent2);font-size:clamp(20px,2.4vw,28px)}

/* ---------- facts, trust, terms, steps ---------- */
.facts{border:1px solid var(--line);border-radius:16px;background:rgba(24,7,42,.72);overflow:hidden}
.facts div{border-right:1px solid rgba(255,212,92,.2);border-bottom:1px solid rgba(255,212,92,.2);padding:16px}
.facts span{color:var(--accent2);letter-spacing:.14em}
.facts b{color:#fff4e6;font-size:14px;line-height:1.4}
.facts b:empty::after{content:"Belum diverifikasi";color:var(--muted)}
.trust-list li{
  border:1px solid rgba(255,212,92,.3);border-radius:14px;
  background:linear-gradient(160deg,rgba(45,14,76,.72),rgba(18,5,31,.6));padding:16px;
}
.trust-list li span{
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:999px;
  background:linear-gradient(180deg,#ffe7a3,var(--accent2));color:#3a1a05;
  box-shadow:0 3px 0 rgba(125,63,0,.75);font-size:13px;
}
.trust-list li p{color:var(--muted);line-height:1.7}
.terms-box{
  border:1px solid var(--line);border-radius:16px;
  background:linear-gradient(165deg,rgba(37,12,64,.7),rgba(13,4,24,.6));padding:20px;
}
.terms-box h3,.terms-box h4{color:var(--accent2);font-family:var(--display);text-transform:uppercase;letter-spacing:.02em}
.chips span{border-radius:999px;border-color:rgba(255,212,92,.36);color:#ffe6b0;background:rgba(37,12,64,.6)}
.steps li::before,.po-steps li::before{color:var(--accent2)}

/* ---------- showcase: lobby tiles + scene band ---------- */
.sec-showcase{background:linear-gradient(180deg,rgba(13,4,24,.4),rgba(37,12,64,.28))}
.h03-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px}
.h03-tile{
  margin:0;position:relative;border-radius:16px;overflow:hidden;
  border:2px solid rgba(255,212,92,.42);
  background:#170730;box-shadow:0 18px 36px rgba(6,1,14,.45);
  transition:transform .18s ease,border-color .18s ease;
}
.h03-tile img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform .35s ease}
.h03-tile:hover{border-color:var(--accent2);transform:translateY(-3px)}
.h03-tile:hover img{transform:scale(1.05)}
.h03-tile figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:8px 10px;
  font-family:ui-monospace,monospace;font-size:9px;letter-spacing:.16em;text-transform:uppercase;
  color:#ffe6b0;background:linear-gradient(0deg,rgba(13,4,24,.92),rgba(13,4,24,0));
}
.h03-band{margin:18px 0 0;border-radius:18px;overflow:hidden;border:2px solid rgba(255,212,92,.42);box-shadow:0 22px 48px rgba(6,1,14,.5)}
.h03-band img{width:100%;height:auto;display:block}
.h03-band figcaption{
  padding:10px 14px;font-size:11px;color:var(--muted);
  background:rgba(18,5,31,.9);border-top:1px solid rgba(255,212,92,.28);
}

/* ---------- footer ---------- */
.site-footer{
  background:linear-gradient(180deg,rgba(18,5,31,.96),#0a0314);
  border-top:3px solid var(--accent2);color:var(--muted);
}
.footer-brand strong{color:var(--accent2);letter-spacing:.02em}
.footer-brand img{filter:drop-shadow(0 4px 12px rgba(255,45,149,.3))}
.footer-col h3{color:var(--accent2)}
.footer-col a{color:var(--muted);font-size:10.5px}
.footer-col a:hover{color:var(--accent2)}
.footer-bottom{border-top:1px solid rgba(255,212,92,.2);color:rgba(195,167,214,.85)}
.bottom-cta{background:linear-gradient(180deg,rgba(26,7,48,.98),rgba(13,4,24,.99));border-top:1px solid var(--line)}
.po-band,.av-footer-cta{background:linear-gradient(92deg,#ffdf87,var(--accent2) 55%,#f5a623);color:#3a1a05}

/* ---------- long-form pages ---------- */
.variant-page-hero{
  border-bottom:1px solid var(--line);
  background:radial-gradient(700px 320px at 82% -20%,rgba(255,45,149,.28),transparent 62%),linear-gradient(180deg,rgba(26,7,48,.9),rgba(13,4,24,.7));
}
.variant-prose p,.variant-prose li{color:var(--muted);font-size:14.5px;line-height:1.85}
.variant-prose strong{color:var(--text)}
.variant-prose a{color:var(--accent2)}
table th{background:rgba(37,12,64,.9);color:var(--accent2)}
table td,table th{border-color:rgba(255,212,92,.22)}
.qa-item,.faq-item{border-color:rgba(255,212,92,.22)}

/* ---------- mobile ---------- */
@media (max-width:900px){
  .av-hero{min-height:0;padding:250px 0 30px;align-items:flex-end;display:block;background:#0d0418}
  .av-hero-inner{max-width:none}
  .h03-tiles{grid-template-columns:repeat(2,1fr);gap:10px}
  .av-hero-bg.av-hero-media{
    inset:0 auto auto 0;width:100%;height:250px;opacity:1;
    mask-image:linear-gradient(180deg,#000 0%,#000 58%,rgba(0,0,0,.35) 86%,transparent 100%);
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 58%,rgba(0,0,0,.35) 86%,transparent 100%);
  }
  .av-hero::before{
    background:linear-gradient(180deg,rgba(13,4,24,.18) 0%,rgba(13,4,24,.22) 44%,rgba(13,4,24,.86) 78%,#0d0418 92%,#0d0418 100%);
  }
  .av-hero-bg.av-hero-media img{object-position:50% 22%}
  .av-hero h1{font-size:clamp(40px,12.5vw,64px)}
  .hero-logo-lockup .hero-brand-logo{width:152px;max-width:min(152px,42vw)}
  .brand-logo{height:44px}
  .av-deck{font-size:14px;line-height:1.62}
  .menu-btn{margin-left:auto}
  .av-scoreline .wrap span:not(:first-child){display:none}
  .av-scoreline .wrap{padding:3px 0}
  .policy-note{display:none}
  .policy-strip-inner{gap:6px;padding:5px 0;font-size:9px}
  .policy-link{min-height:32px;padding:5px 9px}
  .av-hero-bg.av-hero-media picture,.av-hero-bg.av-hero-media img{object-fit:cover}
}
@media (max-width:600px){
  .section{padding:44px 0}
  .av-hero{padding-top:232px}
  .av-hero-bg.av-hero-media{height:232px}
  .av-hero-stats{grid-template-columns:1fr;border-radius:12px}
  .av-hero-stats div{border-right:0}
  .route-card{min-height:0}
  .h03-tiles{grid-template-columns:repeat(2,1fr)}
  .btn{min-height:48px}
  .av-hero-actions{gap:8px}
  .av-hero-actions .btn{flex:1 1 46%;padding:0 10px;font-size:11px}
  .av-textlink{flex:1 1 100%;font-size:10px}
  .policy-strip-inner{font-size:8.5px;letter-spacing:.03em}
  .policy-tag{display:none}
  .policy-badge{font-size:9px}
}

@media (prefers-reduced-motion:reduce){
  .btn,.h03-tile,.route-card,.h03-tile img{transition:none}
}

/* ---------- poster blocks: readable pull quote, even step grid ---------- */
.po-pull{
  font-family:var(--body);font-weight:600;font-size:clamp(17px,1.9vw,22px);line-height:1.6;
  text-transform:none;letter-spacing:0;color:#f1e2ff;
  border-left:6px solid var(--accent2);padding:4px 0 4px 18px;margin-bottom:18px;
  background:linear-gradient(90deg,rgba(255,45,149,.12),transparent 70%);
}
.po-steps{grid-template-columns:repeat(3,1fr);border-top:2px solid rgba(255,212,92,.5)}
.po-steps li{border-bottom:1px solid rgba(255,212,92,.18)}
.po-steps li:nth-child(odd){border-right:0}
.po-steps li:not(:last-child){border-right:1px solid rgba(255,212,92,.18)}
.po-steps li>span{font-size:38px;background:linear-gradient(180deg,#ffe9a8,var(--accent2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.po-steps h3{color:var(--accent2)}
.po-faq article{border-color:rgba(255,212,92,.18)}
.po-faq h3{color:var(--text);font-size:15px}
.po-faq p{color:var(--muted)}
.h03-tile figcaption{font-size:10px;letter-spacing:.14em;color:#ffe6b0;text-shadow:0 1px 6px rgba(0,0,0,.8)}
@media (max-width:900px){
  .po-steps{grid-template-columns:1fr}
  .po-steps li:not(:last-child){border-right:0}
}

/* inner pages: readable page hero scale */
.variant-page-hero{padding:40px 0 30px}
.variant-poster .variant-page-hero h1,.variant-page-hero h1{font-size:clamp(34px,4.8vw,64px);line-height:1.02}
.variant-page-hero .ed-kicker,.variant-page-hero .kicker{font-size:10px}
@media (max-width:600px){
  .variant-poster .variant-page-hero h1,.variant-page-hero h1{font-size:clamp(30px,8.6vw,44px)}
  .variant-page-hero{padding:28px 0 22px}
}
