/* zk7 · cahaya-neon — site-level skin (reference language: violet stage,
   magenta spotlights, gold crown, glossy pills). No reference copy/art. */
:root{
  --zk-gold:#ffd45c; --zk-gold-hi:#fff4c6; --zk-gold-dark:#8e5c07;
  --zk-violet:#a24bff; --zk-magenta:#ff3fa4; --zk-cyan:#6fe3ff;
  --zk-ink:#07030f; --zk-panel:#1b1038; --radius:16px; --max:1160px;
}
html{-webkit-text-size-adjust:100%}
body{
  background:
    radial-gradient(900px 520px at 78% -6%,rgba(162,75,255,.20),transparent 62%),
    radial-gradient(760px 460px at 12% 8%,rgba(255,63,164,.12),transparent 60%),
    linear-gradient(180deg,#0c0620 0%,#0a0518 48%,#07030f 100%);
  color:var(--text);
}
body::before{
  opacity:.22;
  background-image:
    radial-gradient(circle at 18% 22%,#fff 0 1px,transparent 1.6px),
    radial-gradient(circle at 72% 58%,var(--zk-gold) 0 1px,transparent 1.7px),
    linear-gradient(transparent 0 38px,rgba(162,75,255,.16) 38px 39px);
  background-size:220px 220px,300px 300px,100% 39px;
}
h1,h2,h3{font-family:var(--display);letter-spacing:.01em}
h1{color:var(--text);text-shadow:0 0 28px rgba(162,75,255,.55),0 3px 0 rgba(0,0,0,.5)}
h2{color:var(--zk-gold);text-shadow:0 0 20px rgba(255,212,92,.22)}
a{color:var(--zk-gold)}
.kicker{color:var(--zk-magenta)}
.mono{color:var(--zk-gold)}

/* header */
.site-header{
  background:linear-gradient(180deg,rgba(10,5,24,.96),rgba(10,5,24,.80));
  border-bottom:1px solid rgba(255,212,92,.28);
  box-shadow:0 1px 0 rgba(162,75,255,.35),0 18px 40px rgba(3,1,8,.55);
}
.site-header .brand-logo{max-height:48px;filter:drop-shadow(0 6px 14px rgba(0,0,0,.55))}
.av-nav a{color:#e8ddff;font-family:ui-monospace,monospace;font-size:11px;letter-spacing:.10em;text-transform:uppercase;text-decoration:none;padding:8px 2px}
.av-nav a:hover,.av-nav a[aria-current="page"]{color:var(--zk-gold)}
.av-scoreline{border-top:1px solid rgba(162,75,255,.22);background:rgba(27,16,56,.55);font-family:ui-monospace,monospace;font-size:9.5px;letter-spacing:.10em;text-transform:uppercase;color:#b9a8d8}
.av-scoreline b{color:var(--zk-gold)}

/* policy strip */
.policy-strip{
  background:linear-gradient(90deg,rgba(162,75,255,.30),rgba(255,63,164,.20) 52%,rgba(255,212,92,.14));
  border-bottom:1px solid rgba(255,212,92,.34);
}
.policy-strip-inner{padding:8px 0}
.policy-badge{color:var(--zk-gold)}
.policy-tag{color:#fff;border-color:rgba(255,212,92,.5);background:rgba(7,3,15,.35)}
.policy-link{color:var(--zk-gold);border-color:rgba(255,212,92,.42);background:rgba(7,3,15,.35)}
.policy-link:hover{background:rgba(255,212,92,.18);color:#fff}
.policy-note{color:#cbb9ea}

/* hero */
.av-hero{
  min-height:min(92vh,900px);
  display:flex;align-items:center;
  padding:64px 0 76px;
  border-bottom:2px solid rgba(255,212,92,.55);
  background:radial-gradient(760px 460px at 74% 26%,rgba(162,75,255,.24),transparent 66%),#07030f;
  isolation:isolate;
}
.av-hero-bg.av-hero-media{opacity:1;filter:saturate(1.05) contrast(1.02);mask-image:none}
.av-hero-bg.av-hero-media img{object-fit:cover;object-position:66% 44%}
.av-hero::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(7,3,15,.96) 0%,rgba(7,3,15,.90) 34%,rgba(7,3,15,.52) 58%,rgba(7,3,15,.10) 82%),
    linear-gradient(180deg,rgba(7,3,15,.35) 0%,rgba(7,3,15,0) 34%,rgba(7,3,15,.55) 100%);
}
.av-hero::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:3px;z-index:2;
  background:linear-gradient(90deg,var(--zk-gold),var(--zk-magenta) 42%,var(--zk-violet) 72%,transparent);
  opacity:.9;
}
.av-hero-inner{position:relative;z-index:2;max-width:820px}
.av-hero h1{
  font-size:clamp(46px,7.4vw,104px);line-height:.9;letter-spacing:-.015em;
  color:transparent;background:linear-gradient(180deg,#fff8e6 0%,#ffe6a6 42%,#ffd45c 68%,#e6a51f 100%);
  -webkit-background-clip:text;background-clip:text;
  filter:drop-shadow(0 4px 0 rgba(60,20,0,.55)) drop-shadow(0 0 30px rgba(255,63,164,.28));
}
.av-eyebrow{color:var(--zk-gold);font-family:ui-monospace,monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase}
.av-eyebrow span{color:#e6d8ff}
.av-deck{color:#d8c9f2;max-width:640px;font-size:16.5px;line-height:1.62}
.av-chips span{
  background:rgba(27,16,56,.78);border:1px solid rgba(255,212,92,.35);color:#efe4ff;
  font-size:9.5px;letter-spacing:.08em;padding:5px 9px;border-radius:999px;
}
.av-chips span:first-child{color:var(--zk-gold)}
.hero-logo-lockup{
  display:inline-flex;align-items:center;gap:12px;margin:0 0 18px;padding:10px 18px 10px 14px;
  background:linear-gradient(180deg,rgba(255,250,240,.98),rgba(255,242,214,.94));
  border:1px solid rgba(255,212,92,.85);border-radius:16px;
  box-shadow:0 10px 28px rgba(3,1,8,.55),0 0 0 1px rgba(255,255,255,.35) inset;
}
.hero-brand-logo{max-height:58px;max-width:min(230px,54vw);filter:none}
.hero-logo-tag{
  color:#5a1c86;border-color:rgba(90,28,134,.4);background:rgba(162,75,255,.10);
  font-size:9px;letter-spacing:.18em;padding:3px 7px;border-radius:999px;
}
.av-hero-actions{gap:12px;margin:26px 0 0}
.av-textlink{color:#e6d8ff;font-family:ui-monospace,monospace;font-size:11px;letter-spacing:.08em}
.av-textlink:hover{color:var(--zk-gold)}
.av-hero-stats{
  border:1px solid rgba(255,212,92,.28);border-radius:14px;overflow:hidden;
  background:rgba(9,4,20,.90);backdrop-filter:blur(10px);margin-top:30px;
  box-shadow:0 18px 40px rgba(3,1,8,.5);
}
.av-hero-stats div{padding:12px 16px;border-right:1px solid rgba(255,212,92,.14)}
.av-hero-stats dt{color:#a793c9;font-size:8.5px;letter-spacing:.14em}
.av-hero-stats dd{color:var(--zk-gold);font-size:15px}

/* glossy pills — reference download button language, white-label palette */
.btn{border-radius:999px;font-family:var(--display);letter-spacing:.05em}
.btn-primary{
  background:linear-gradient(180deg,#fff6cf 0%,#ffd45c 38%,#f3ae1f 72%,#c67f07 100%);
  color:#3a1400;border-color:#ffe9a3;
  box-shadow:0 6px 0 #7a4b02,0 0 30px rgba(255,212,92,.30),0 2px 0 rgba(255,255,255,.75) inset;
}
.btn-primary:hover{filter:brightness(1.05);transform:translateY(-2px)}
.btn-ghost{
  background:linear-gradient(180deg,rgba(162,75,255,.34),rgba(90,28,134,.52));
  color:#fff0c2;border-color:rgba(255,212,92,.62);
  box-shadow:0 6px 0 rgba(40,10,70,.9),0 0 22px rgba(162,75,255,.24);
}
.btn-ghost:hover{background:linear-gradient(180deg,rgba(162,75,255,.5),rgba(90,28,134,.66));color:#fff}
.btn-sm{min-height:40px}

/* sections */
.section{border-bottom:1px solid rgba(162,75,255,.18);padding:64px 0}
.section:nth-of-type(even){background:linear-gradient(180deg,rgba(27,16,56,.34),rgba(10,5,24,.10))}
.sec-head h2{letter-spacing:.005em}
.sec-head p{color:#c2b1e0;font-size:14.5px;line-height:1.62}
.sec-head .kicker{margin-bottom:8px}
.po-factgrid{border:1px solid rgba(255,212,92,.22);border-radius:18px;overflow:hidden;background:rgba(11,5,24,.55)}
.po-factgrid div{border-right:1px solid rgba(255,212,92,.14);border-bottom:1px solid rgba(162,75,255,.16);padding:16px}
.po-factgrid span{color:var(--zk-magenta)}
.po-factgrid b{color:var(--zk-gold)}
.po-factgrid small{color:#a793c9}
.po-summary .po-pull{
  border-left:3px solid var(--zk-gold);background:rgba(27,16,56,.5);border-radius:0 16px 16px 0;
  color:#f3eaff;font-size:18px;line-height:1.6;
}
.po-mini-facts span{background:rgba(27,16,56,.62);border:1px solid rgba(255,212,92,.24);border-radius:12px}
.po-mini-facts b{color:var(--zk-gold)}
.route-grid.variant-routes{gap:16px}
.route-card{
  background:linear-gradient(180deg,rgba(35,20,70,.85),rgba(13,6,28,.92));
  border:1px solid rgba(162,75,255,.32);border-radius:18px;
  box-shadow:0 20px 44px rgba(3,1,8,.45);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.route-card:hover{transform:translateY(-3px);border-color:rgba(255,212,92,.55);box-shadow:0 26px 54px rgba(3,1,8,.6),0 0 26px rgba(162,75,255,.22)}
.route-card.primary{border-color:rgba(255,212,92,.5);background:linear-gradient(180deg,rgba(74,38,140,.85),rgba(18,8,42,.95))}
.route-card .route-no{color:var(--zk-magenta)}
.route-card h3{color:var(--zk-gold)}
.route-card p{color:#cbb9ea}
.route-link{color:var(--zk-gold)}
.terms-box{background:rgba(11,5,24,.55);border:1px solid rgba(162,75,255,.24);border-radius:16px}
.terms-label{color:#a793c9}
.terms-derived span{border-color:rgba(255,212,92,.3);color:#e8ddff;background:rgba(27,16,56,.7)}
.trust-list li{border-color:rgba(162,75,255,.22)}
.trust-list li span{color:var(--zk-gold)}
.trust-list li p{color:#d8c9f2}
.po-faq article{border-color:rgba(255,212,92,.22);background:rgba(11,5,24,.5);border-radius:14px}
.po-faq h3{color:#fdf7ff}
.po-faq p{color:#cbb9ea}
.po-num{color:var(--zk-magenta)}
.po-steps li span{color:var(--zk-gold)}
.po-steps li h3{color:#fdf7ff}
.po-steps li p{color:#cbb9ea}
.card,.promo-card{background:rgba(27,16,56,.6);border-color:rgba(162,75,255,.26);border-radius:16px}

/* showcase / gallery */
.sec-showcase{background:radial-gradient(800px 420px at 50% 0%,rgba(162,75,255,.16),transparent 70%),rgba(9,4,20,.6)}
.h03-tiles{gap:16px}
.h03-tile{
  border-radius:18px;overflow:hidden;border:1px solid rgba(255,212,92,.38);
  background:#0b0518;box-shadow:0 22px 46px rgba(3,1,8,.55);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.h03-tile:hover{transform:translateY(-4px);border-color:rgba(255,212,92,.7);box-shadow:0 28px 56px rgba(3,1,8,.65),0 0 32px rgba(255,63,164,.18)}
.h03-tile img{aspect-ratio:4/5;object-fit:cover;width:100%}
.h03-tile figcaption{
  font-family:ui-monospace,monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--zk-gold);background:linear-gradient(180deg,rgba(11,5,24,.0),rgba(11,5,24,.92));padding:10px 12px;
}
.h03-band{border:1px solid rgba(255,212,92,.34);border-radius:18px;overflow:hidden;margin-top:18px;background:#0b0518}
.h03-band figcaption{font-family:ui-monospace,monospace;font-size:10px;letter-spacing:.12em;color:#b9a8d8;padding:10px 14px;background:rgba(11,5,24,.85)}

/* footer */
.site-footer,.footer{border-top:1px solid rgba(255,212,92,.28);background:linear-gradient(180deg,rgba(27,16,56,.4),#07030f)}
.footer h3,.site-footer h3{color:var(--zk-gold)}
.footer a,.site-footer a{color:#d8c9f2;text-decoration:none}
.footer a:hover,.site-footer a:hover{color:var(--zk-gold)}
.footer-bottom{color:#8f7dae;font-family:ui-monospace,monospace;font-size:9px;letter-spacing:.1em}
.footer-brand .brand-logo{max-height:44px;background:rgba(255,248,234,.94);border-radius:10px;padding:6px 10px}
.empty{background:rgba(27,16,56,.5);border:1px dashed rgba(255,212,92,.34);border-radius:16px;color:#cbb9ea}

/* guide / info pages */
.variant-page-hero{padding:50px 0 38px}
.variant-poster.variant-page-hero h1,.variant-page-hero h1{
  font-size:clamp(36px,5.6vw,78px);line-height:.95;letter-spacing:-.012em;
  color:transparent;-webkit-text-stroke:0;
  background:linear-gradient(180deg,#fff8e6 0%,#ffe6a6 44%,#ffd45c 70%,#e6a51f 100%);
  -webkit-background-clip:text;background-clip:text;
  filter:drop-shadow(0 3px 0 rgba(60,20,0,.45)) drop-shadow(0 0 22px rgba(255,63,164,.20));
  max-width:1040px;margin:0 auto;
}
.variant-page-hero .deck{max-width:780px;margin-left:auto;margin-right:auto;color:#d8c9f2}
@media (max-width:700px){
  .variant-page-hero{padding:30px 0 26px}
  .variant-poster.variant-page-hero h1,.variant-page-hero h1{font-size:clamp(30px,9vw,44px)}
  .variant-page-hero .deck{font-size:14.5px}
}
.guide-hero,.info-hero,.page-hero{border-bottom:1px solid rgba(255,212,92,.3);background:radial-gradient(700px 380px at 80% 0%,rgba(162,75,255,.2),transparent 66%)}
.guide-hero h1,.info-hero h1,.page-hero h1{color:var(--zk-gold)}
.guide-section,.info-section{border-color:rgba(162,75,255,.18)}
.guide-section h2,.info-section h2{color:var(--zk-gold)}
.guide-section p,.info-section p,.info-section li{color:#d3c3ee}
.ap-panel,.guide-cta{
  background:linear-gradient(180deg,rgba(162,75,255,.30),rgba(74,38,140,.55));
  border:1px solid rgba(255,212,92,.45);border-radius:18px;
}
.h5-shot{border:1px solid rgba(255,212,92,.4);border-radius:16px;overflow:hidden}
table{border-color:rgba(162,75,255,.24)}
th{color:var(--zk-gold)}
td{color:#d8c9f2}
.facts div{border-color:rgba(162,75,255,.18)}
.facts span{color:#a793c9}
.facts b{color:var(--zk-gold)}

/* mobile */
@media (max-width:900px){
  .av-hero{min-height:0;padding:26px 0 40px;align-items:flex-end}
  .av-hero-bg.av-hero-media img{object-position:52% 26%}
  .av-hero::before{
    background:
      linear-gradient(180deg,rgba(7,3,15,.62) 0%,rgba(7,3,15,.42) 26%,rgba(7,3,15,.72) 62%,rgba(7,3,15,.96) 100%);
  }
  .av-hero-inner{max-width:none}
  .hero-brand-logo{max-height:62px;max-width:min(190px,52vw)}
  .hero-logo-lockup{padding:8px 12px;border-radius:13px;margin-bottom:14px}
  .av-hero h1{font-size:clamp(40px,12.2vw,62px)}
  .av-deck{font-size:14.5px;line-height:1.55;max-width:none}
  .av-chips{display:none}
  .av-hero-actions{flex-direction:column;align-items:stretch;gap:10px;margin-top:18px}
  .av-hero-actions .btn{width:100%;min-height:50px}
  .av-hero-actions .av-textlink{text-align:center;padding:4px 0}
  .av-hero-stats{margin-top:20px;grid-template-columns:1fr}
  .av-hero-stats div{border-right:0;border-bottom:1px solid rgba(255,212,92,.14);padding:10px 14px}
  .av-hero-stats div:last-child{border-bottom:0}
  .section{padding:44px 0}
  .h03-tiles{gap:10px}
  .h03-tile{border-radius:14px}
  .h03-tile figcaption{font-size:9px;padding:8px 9px}
}
@media (max-width:700px){
  body{padding-bottom:calc(88px + env(safe-area-inset-bottom))}
  .site-header .brand-logo{max-height:40px}
  .av-scoreline{display:none}
  .policy-note{display:none}
  .policy-strip-inner{gap:6px;padding:6px 0}
  .policy-link{font-size:9px;padding:3px 6px}
  .av-hero{padding:20px 0 36px}
  .av-hero-bg.av-hero-media img{object-position:56% 30%}
  .av-hero::before{background:linear-gradient(180deg,rgba(7,3,15,.40) 0%,rgba(7,3,15,.24) 30%,rgba(7,3,15,.66) 66%,rgba(7,3,15,.96) 100%)}
  .av-deck{text-shadow:0 1px 8px rgba(3,1,8,.85)}
  .av-eyebrow{text-shadow:0 1px 6px rgba(3,1,8,.9)}
}
@media (max-width:700px){
  body[class*="variant-"] .bottom-cta{
    display:flex!important;position:fixed;left:0;right:0;bottom:0;z-index:90;
    gap:10px;padding:9px 12px calc(9px + env(safe-area-inset-bottom));
    background:linear-gradient(180deg,rgba(10,5,24,.94),rgba(7,3,15,.99));
    border-top:1px solid rgba(255,212,92,.55);
    box-shadow:0 -14px 40px rgba(3,1,8,.75);
  }
  body[class*="variant-"] .bottom-cta .btn{flex:1;min-height:52px;font-size:12px;border-radius:999px;padding:0 10px}
  body[class*="variant-"] .bottom-cta .btn-ghost{background:linear-gradient(180deg,rgba(162,75,255,.42),rgba(90,28,134,.62))}
}
/* keep focus visible on the dark stage */
a:focus-visible,button:focus-visible{outline:2px solid var(--zk-gold);outline-offset:3px}