/* Claude Design 9 Oct 2026 translated to the existing static site.
   Public tokens are scoped here; operational app styles are not affected. */
:root{--promo-width:104rem;--promo-pad:clamp(20px,3.4vw,64px);--promo-radius:32px;--promo-gap:clamp(28px,4vw,56px);--promo-shadow:0 1px 2px rgb(28 27 23 / .04),0 24px 60px -40px rgb(28 27 23 / .22)}
.hero{padding:clamp(112px,10vw,168px) 0 clamp(56px,6vw,88px)}
.hero .w{max-width:var(--promo-width);padding-inline:var(--promo-pad)}
.hero h1{max-width:22ch;margin-inline:auto;text-wrap:balance;line-height:1.08}
.hero .lead{max-width:46rem;margin-inline:auto}
.hero .cta{background:var(--ink);color:var(--bg);border-radius:12px;box-shadow:none}
.hero-kontak{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;margin:10px;border-radius:12px;color:var(--gold-dark);background:var(--surface);border:1px solid var(--gold-line);text-decoration:none}
.hero-status{max-width:46rem;margin:14px auto 0;font-size:14px;color:var(--body)}
.hero-contoh{position:relative;max-width:92rem;margin:clamp(40px,4.4vw,72px) var(--promo-pad) 0;border-radius:22px;background:var(--surface);box-shadow:var(--promo-shadow);overflow:hidden;text-align:left}
.hero-alamat{padding:12px 16px;text-align:center;background:var(--surface-soft);font-size:12px;color:var(--muted)}
.hero-kalender{display:grid;grid-template-columns:180px minmax(0,1fr)}
.hero-kalender aside{display:flex;flex-direction:column;gap:12px;padding:24px;background:var(--surface-soft);font-size:13px}
.hero-kalender aside b{background:var(--surface);padding:8px;border-radius:10px}
.hero-jadwal{padding:28px;min-width:0}.hero-jadwal h2{font-size:20px;margin:0}.hero-jadwal p{font-size:13px;color:var(--body)}
.hero-grid{display:grid;grid-template-columns:90px repeat(7,minmax(0,1fr));gap:8px;align-items:center;font-size:12px;min-height:220px}.hero-grid>b{grid-column:1}.hero-grid>i{font-style:normal;border-radius:8px;background:var(--cream2);color:var(--gold-dark);padding:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hero-grid .hero-book-a{grid-column:2 / span 2}.hero-grid .hero-book-b{grid-column:4 / span 4}.hero-grid .hero-book-c{grid-column:6 / span 2}.hero-grid .hero-book-d{grid-column:3 / span 2;background:var(--ink);color:var(--bg)}
.hero-contoh figcaption{font-size:12px;padding:12px 24px;color:var(--muted);border-top:1px solid var(--line)}
.demo-alur{padding:clamp(44px,5vw,72px) var(--promo-pad);max-width:var(--promo-width);margin:auto;scroll-margin-top:100px}
.demo-kartu{display:grid;grid-template-columns:1fr 1.2fr;gap:var(--promo-gap);background:var(--surface);padding:var(--promo-gap);border-radius:var(--promo-radius);box-shadow:var(--promo-shadow)}
.demo-eyebrow{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700}.demo-kartu h2{font-size:clamp(30px,3.5vw,50px);line-height:1.08;letter-spacing:-.04em;margin:20px 0}.demo-kartu p{font-size:14px;color:var(--body)}
.demo-langkah{display:flex;flex-direction:column;gap:6px}.demo-langkah button{font:inherit;font-size:15px;text-align:left;min-height:48px;padding:12px 14px;border:0;border-radius:12px;background:transparent;color:var(--body);cursor:pointer}.demo-langkah button[aria-pressed=true]{background:var(--cream2);color:var(--gold-dark);font-weight:600}
.demo-panel{padding:clamp(18px,2.4vw,28px);background:var(--bg);border-radius:24px;min-width:0}.demo-panel h3{font-size:18px;margin:0 0 20px}.demo-panel dl{background:var(--surface);padding:16px;border-radius:14px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;font-size:14px}.demo-panel dt{color:var(--body)}.demo-panel dd{margin:0;text-align:right;font-weight:600;font-variant-numeric:tabular-nums}.demo-panel [hidden]{display:none}
.penawaran-final{max-width:var(--promo-width);margin:auto;padding:var(--promo-gap);display:grid;grid-template-columns:1fr 1fr;gap:var(--promo-gap);border-radius:var(--promo-radius);background:var(--surface);box-shadow:var(--promo-shadow)}.penawaran-final h2{font-size:clamp(34px,4vw,58px);line-height:1.08;letter-spacing:-.04em}.penawaran-final>div+div{background:var(--bg);border-radius:24px;padding:var(--promo-gap)}.penawaran-final h3{font-size:clamp(26px,3vw,36px);line-height:1.15}.penawaran-final li{margin-block:14px}.penawaran-kontak{display:inline-flex;min-height:48px;align-items:center;background:var(--ink);color:var(--surface);padding:0 24px;border-radius:12px;text-decoration:none}.penawaran-kontak:hover{color:var(--surface);background:var(--ink-soft)}
#harga{padding-inline:var(--promo-pad)}
/* Keep decorative previews static: the meaningful demo advances only on input. */
.pramuat{display:none!important}.peraga *, .ajakan-kabut *, .kilau{animation:none!important}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--gold-dark);outline-offset:4px}
@media(max-width:700px){.hero-kalender{grid-template-columns:1fr}.hero-kalender aside{display:none}.hero-jadwal{padding:16px}.hero-grid{grid-template-columns:60px repeat(7,minmax(0,1fr));gap:4px}.demo-kartu,.penawaran-final{grid-template-columns:1fr}.demo-panel dl{grid-template-columns:minmax(0,1fr)}.demo-panel dd{text-align:left;padding-bottom:8px}.bar .daftar{font-size:12px}.demo-kartu{padding:24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important}}
/* Legal pages retain their independently addressable URLs and reviewed copy. */
.dok{max-width:56rem;padding:clamp(24px,4vw,56px);background:var(--surface);border-radius:var(--promo-radius);box-shadow:var(--promo-shadow);margin:clamp(24px,4vw,56px) auto}.dok h1{font-size:clamp(40px,5vw,60px);line-height:1.08;letter-spacing:-.035em}.dok-pilihan{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:32px}.dok-pilihan a{display:flex;align-items:center;min-height:44px;padding:8px 16px;border-radius:12px;background:var(--bg);color:var(--body);text-decoration:none;font-size:14px}.dok-pilihan a[aria-current=page]{background:var(--cream2);color:var(--gold-dark);font-weight:600}.penawaran-final .kartu-tahap{position:static;padding:0;background:none;font-size:22px;text-align:left;color:var(--ink);line-height:1.4}
@media(max-width:700px){.dok{margin:16px;border-radius:24px}}

/* Claude export feature previews: static frames, scoped to this section. */
#membership{--fitur-height:11rem}
#membership .dapat-kartu{grid-template-columns:minmax(0,1fr) minmax(17.5rem,40%);gap:1.625rem;padding:2rem 2.125rem;border-radius:1.75rem}
#membership .dapat-kartu h3{font-size:clamp(1.25rem,2.1vw,1.625rem);line-height:1.2;letter-spacing:-.025em}
#membership .dapat-kartu p{font-size:.96875rem;line-height:1.65}
.fitur-rupa-1{position:relative;height:var(--fitur-height);border-radius:1rem;background:var(--bg);padding:0.1875rem;overflow:hidden;isolation:isolate;container-type:inline-size}
.fitur-rupa-2{position:relative;height:100%;border-radius:0.8125rem;background:var(--surface);padding:5cqw;display:flex;flex-direction:column;gap:4cqw}
.fitur-rupa-3{display:flex;justify-content:space-between;align-items:center}
.fitur-rupa-4{font-size:clamp(0.5625rem,4cqw,0.75rem);font-weight:700;letter-spacing:.16em;color:var(--body)}
.fitur-rupa-5{font-size:clamp(0.5625rem,4cqw,0.75rem);padding:0.125rem 0.5625rem;border-radius:62.4375rem;background:var(--surface);box-shadow:none;background-color:var(--bg);color:var(--ink-soft)}
.fitur-rupa-6{flex:1;display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(3,1fr);gap:2.4cqw}
.fitur-rupa-7{border-radius:0.25rem;background:var(--bg);display:grid;place-items:center}
.fitur-rupa-8{display:none}
.fitur-rupa-9{width:0.3125rem;height:0.3125rem;border-radius:50%;background:var(--gold)}
.fitur-rupa-10{width:0.3125rem;height:0.3125rem;border-radius:50%;background:linear-gradient(90deg,var(--gold) 50%,var(--ink) 50%)}
.fitur-rupa-11{width:0.3125rem;height:0.3125rem;border-radius:50%;background:var(--ink)}
.fitur-rupa-12{display:flex;gap:5cqw;font-size:clamp(0.5625rem,4cqw,0.75rem);color:var(--body)}
.fitur-rupa-13{display:flex;align-items:center;gap:0.3125rem}
.fitur-rupa-14{width:0.375rem;height:0.375rem;border-radius:50%;background:var(--gold)}
.fitur-rupa-15{width:0.375rem;height:0.375rem;border-radius:50%;background:var(--ink)}
.fitur-rupa-16{position:relative;height:100%;border-radius:0.8125rem;background:var(--surface);padding:5cqw;display:flex;flex-direction:column;gap:3.5cqw}
.fitur-rupa-17{font-size:clamp(0.5625rem,4cqw,0.75rem);padding:0.125rem 0.5625rem;border-radius:62.4375rem;background:var(--bg);color:var(--ink-soft);font-weight:600}
.fitur-rupa-18{position:relative;height:clamp(1.125rem,7.6cqw,1.625rem)}
.fitur-rupa-19{position:absolute;inset:0;font-size:clamp(0.875rem,6.6cqw,1.25rem);font-weight:700;letter-spacing:-0.02em;font-variant-numeric:tabular-nums}
.fitur-rupa-20{position:absolute;inset:0;font-size:clamp(0.875rem,6.6cqw,1.25rem);font-weight:700;letter-spacing:-0.02em;font-variant-numeric:tabular-nums;opacity:0}
.fitur-rupa-21{height:0.25rem;width:88%;border-radius:0.125rem;background:var(--line2)}
.fitur-rupa-22{height:0.25rem;width:64%;border-radius:0.125rem;background:var(--line2)}
.fitur-rupa-23{margin-top:auto;position:relative;height:clamp(1.75rem,12cqw,2.25rem)}
.fitur-rupa-24{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center;padding:0 4cqw;border-radius:0.5rem;background:var(--surface);box-shadow:none;background-color:var(--bg);font-size:clamp(0.59375rem,4.2cqw,0.78125rem)}
.fitur-rupa-25{font-weight:700}
.fitur-rupa-26{color:var(--body)}
.fitur-rupa-27{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center;padding:0 4cqw;border-radius:0.5rem;background:var(--surface);box-shadow:none;background-color:var(--bg);font-size:clamp(0.59375rem,4.2cqw,0.78125rem);opacity:0}
.fitur-rupa-28{position:relative;height:100%;border-radius:0.8125rem;background:var(--surface);padding:5cqw;display:flex;flex-direction:column;gap:3cqw}
.fitur-rupa-29{font-size:clamp(0.75rem,5.6cqw,1.0625rem);font-weight:700;letter-spacing:-0.02em}
.fitur-rupa-30{flex:1;display:grid;grid-template-columns:repeat(5,1fr);gap:2.6cqw;align-items:end}
.fitur-rupa-31{height:44%;border-radius:0.25rem;background:var(--line2);transform-origin:bottom}
.fitur-rupa-32{height:38%;border-radius:0.25rem;background:var(--line2);transform-origin:bottom}
.fitur-rupa-33{height:58%;border-radius:0.25rem;background:var(--line2);transform-origin:bottom}
.fitur-rupa-34{height:52%;border-radius:0.25rem;background:var(--line2);transform-origin:bottom}
.fitur-rupa-35{height:100%;border-radius:0.25rem;background:linear-gradient(180deg,var(--gold-pale),var(--gold));transform-origin:bottom}
.fitur-rupa-36{display:flex;gap:2cqw;font-size:clamp(0.53125rem,3.6cqw,0.6875rem);color:var(--ink-soft)}
.fitur-rupa-37{padding:0.0625rem 0.5rem;border-radius:62.4375rem;background:var(--surface);box-shadow:none;background-color:var(--bg)}
.fitur-rupa-38{display:flex;align-items:center;gap:0.3125rem;font-size:clamp(0.5625rem,4cqw,0.75rem);padding:0.125rem 0.5625rem;border-radius:62.4375rem;background:var(--surface);box-shadow:none;background-color:var(--bg);color:var(--ink-soft)}
.fitur-rupa-39{flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,transparent,var(--ink) 14%,var(--ink) 86%,transparent);mask-image:linear-gradient(180deg,transparent,var(--ink) 14%,var(--ink) 86%,transparent)}
.fitur-rupa-40{height:100%}
.fitur-rupa-41{height:33.333%;padding:1.2cqw 0;display:flex}
.fitur-rupa-42{flex:1;display:flex;justify-content:space-between;align-items:center;padding:0 4cqw;border-radius:0.5rem;background:var(--surface);box-shadow:none;background-color:var(--bg);font-size:clamp(0.59375rem,4.2cqw,0.78125rem)}
.fitur-rupa-43{color:var(--body);font-variant-numeric:tabular-nums}
.fitur-rupa-44{position:relative;height:100%;border-radius:0.8125rem;background:var(--surface);padding:5cqw;display:flex;flex-direction:column;gap:2.6cqw}
.fitur-rupa-45{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.4cqw}
.fitur-rupa-46{flex:1;display:flex;align-items:center;gap:3cqw;padding:0 4cqw;border-radius:0.5rem;background:var(--bg);font-size:clamp(0.5625rem,4cqw,0.75rem)}
.fitur-rupa-47{flex:1;color:var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:719px){#membership{--fitur-height:10rem}#membership .dapat-kartu{grid-template-columns:minmax(0,1fr);gap:1.375rem;padding:1.5rem 1.375rem}}
/* Document contents use the export's sticky 280 / 720 layout and real anchors. */
.dok{max-width:75rem;background:none;box-shadow:none;border-radius:0;padding:2rem 1.75rem 6rem}
.dok-layout{display:grid;grid-template-columns:minmax(0,17.5rem) minmax(0,45rem);gap:4rem;align-items:start;margin-top:2rem}
.dok-isi{position:sticky;top:6rem;min-width:0;max-height:calc(100vh - 8rem);max-height:calc(100dvh - 8rem);overflow-y:auto;font-size:.875rem}
.dok-isi summary{color:var(--ink);font-weight:600;cursor:pointer;min-height:2.75rem;align-items:center}
.dok-isi-label{font-size:.75rem;letter-spacing:.06em;color:var(--muted);margin:0 0 .5rem}
.dok-isi ol{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.25rem}
.dok-isi a{display:block;color:var(--body);text-decoration:none;padding:.3125rem 0;line-height:1.55;overflow-wrap:anywhere}
.dok-isi a:hover{color:var(--gold-dark);text-decoration:underline}
.dok-artikel{min-width:0;color:var(--ink-soft)}
.dok-artikel h1{margin:0;font-size:clamp(2.5rem,5vw,3.75rem)}
.dok-artikel .berlaku{margin:.875rem 0 2rem;font-size:.8125rem}
.dok-artikel .dok-badan{margin:0;font-size:1.0625rem;line-height:1.7;color:var(--ink-soft)}
.dok-artikel .dok-badan>p:first-child{margin:0 0 1rem;padding:1.25rem 1.375rem;background:var(--surface);border-radius:1.75rem;box-shadow:var(--promo-shadow);color:var(--ink);font-size:1.1875rem;line-height:1.65}
.dok-artikel h2{font-size:1.75rem;line-height:1.2;font-weight:650;letter-spacing:-.02em;margin:3.5rem 0 1rem;scroll-margin-top:5.625rem}
@media(min-width:901px){.dok-isi summary{display:none}}
@media(max-width:900px){.dok{margin:0;padding:1.5rem 1.25rem 4rem}.dok-layout{grid-template-columns:minmax(0,1fr);gap:2rem}.dok-isi{position:static;max-height:none}.dok-isi summary{display:flex}.dok-isi-label{display:none}.dok-isi a{padding:.625rem 0;min-height:2.75rem}.dok-isi nav{margin-top:.5rem}.dok-merek{display:none}}
@media print{.dok-layout{display:block}.dok-isi{display:none}}