/* CSS from the supplied MC04-masterclass-LP-final.html. */

/* mobile fixes */
body{overflow-x:hidden}
image-slot{display:block!important;min-width:0!important;max-width:100%!important}
.shot{min-width:0!important}
@media (max-width:820px){
  .shot{min-height:0!important}
  header nav{padding:10px 20px!important;gap:10px!important;flex-wrap:nowrap!important;justify-content:space-between!important}
  header nav>div{gap:0!important;flex-wrap:nowrap!important;margin-left:0!important}
  header nav>div>a:not([href*="masterclass-04"]){display:none!important}
  header nav>div>a[href*="masterclass-04"]{padding:10px 16px!important;font-size:14px!important;border-radius:10px!important;box-shadow:none!important}
}
@media (max-width:640px){
  .wrap{padding-top:52px!important;padding-bottom:52px!important}
  #top-hero .wrap{padding-top:36px!important;padding-bottom:44px!important}
  #top-hero .eyebrow{border-radius:14px!important;padding:8px 12px!important;font-size:12px!important;gap:2px 8px!important}
  #top-hero h1{font-size:28px!important;line-height:1.12!important;margin:16px 0 8px!important}
  #top-hero .hero-cta a{width:100%;justify-content:center}
  #top-hero .hero-cap{position:static!important;display:inline-block;margin-top:12px}
  #top-hero .hero-stats{grid-template-columns:1fr 1fr!important;gap:10px!important}
  #top-hero .hero-stats>div{padding:14px!important}
  #top-hero .hero-stats>div>div:first-child{font-size:20px!important}
  .card26{padding:20px!important}
  .mini{grid-template-columns:auto auto auto!important;gap:10px!important;justify-content:space-between!important}
  .mini>div>div:last-child{font-size:14px!important}
  .price-card{padding:24px 20px!important}
  .price-card>span{left:20px!important}
  .final-card{padding:44px 22px!important}
  .final-card a{width:100%;justify-content:center;font-size:15px!important;padding:14px 14px!important;white-space:nowrap}
  h2{font-size:clamp(26px,7.6vw,30px)!important;line-height:1.1!important}
}
/* mobile: header static, floating bottom CTA */
.mfab{display:none}
@media (max-width:820px){
  header{display:none!important}
  .mfab{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;align-items:center;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.94);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid #E4ECEA;box-shadow:0 -14px 34px -22px rgba(14,27,26,.35);transform:translateY(110%);transition:transform .32s cubic-bezier(.2,.8,.2,1)}
  .mfab.on{transform:translateY(0)}
  .mfab-price{display:flex;flex-direction:column;align-items:flex-start;line-height:1.1;min-width:0;flex:1 1 auto}
  .mfab-price b{font-size:19px;font-weight:800;letter-spacing:-.03em;color:#0E1B1A}
  .mfab-price small{font-size:11px;font-weight:600;color:#6A7A77;white-space:nowrap}
.mfab-price .mfab-tag{display:inline-flex;align-items:center;gap:5px;margin-top:5px;color:#007028;font-weight:700;font-size:10px;letter-spacing:.02em}
.mfab-price .mfab-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:#1f9d4a;box-shadow:0 0 0 0 rgba(31,157,74,.6);animation:mfabDot 1.8s ease-out infinite}
@keyframes mfabDot{0%{box-shadow:0 0 0 0 rgba(31,157,74,.55)}100%{box-shadow:0 0 0 7px rgba(31,157,74,0)}}
@media (prefers-reduced-motion:reduce){.mfab-price .mfab-tag::before{animation:none}}
  .mfab a{flex:0 1 auto;display:inline-flex;justify-content:center;align-items:center;gap:7px;background:#1f9d4a;color:#fff;padding:12px 16px;border-radius:11px;font-weight:700;font-size:14px;white-space:nowrap;box-shadow:0 10px 20px -8px rgba(31,157,74,.7)}
  .mfab a:active{transform:scale(.98)}
  body.has-mfab{padding-bottom:calc(74px + env(safe-area-inset-bottom))}
}

/* hero orbit */
.orb-wrap{--size:clamp(300px,42vw,520px);--r:calc(var(--size)*.335);position:relative;width:var(--size);height:var(--size);margin:-46px auto;display:grid;place-items:center;isolation:isolate}
.orb-glow{position:absolute;inset:8%;border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(31,157,74,.22),rgba(31,157,74,.06) 45%,transparent 70%);filter:blur(2px);z-index:0}
.orb-ring{position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%);z-index:1}
.orb-ring--main{width:calc(var(--r)*2);height:calc(var(--r)*2);border:1.5px dashed rgba(10,143,126,.45);animation:orbRingSpin 60s linear infinite}
.orb-ring--outer{width:calc(var(--r)*2 + 56px);height:calc(var(--r)*2 + 56px);border:1px solid rgba(14,27,26,.07)}
.orb-pulse{position:absolute;left:50%;top:50%;width:calc(var(--size)*.3);height:calc(var(--size)*.3);border-radius:50%;border:2px solid rgba(31,157,74,.55);transform:translate(-50%,-50%);animation:orbPulse 3.2s cubic-bezier(.2,.7,.2,1) infinite;z-index:1}
.orbit{position:absolute;inset:0;animation:orbSpin 26s linear infinite;z-index:6}
.sat{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(var(--a)) translateY(calc(var(--r)*-1))}
.node{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid #DCE7E4;border-radius:999px;padding:9px 16px 9px 9px;box-shadow:0 18px 36px -18px rgba(14,27,26,.35);white-space:nowrap;transform:rotate(calc(var(--a)*-1));animation:orbSpinBack 26s linear infinite}
.node-ic{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#EAF5F3;color:#007028;flex:0 0 auto}
.node-ic svg{width:19px;height:19px}
.node-tx{display:flex;flex-direction:column;line-height:1.15}
.node-tx b{font-size:14px;font-weight:800;letter-spacing:-.01em;color:#0E1B1A}
.node-tx small{font-size:11px;font-weight:600;color:#6A7A77}
.core{position:relative;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;width:calc(var(--size)*.3);height:calc(var(--size)*.3);border-radius:50%;background:linear-gradient(145deg,#1f9d4a,#00662a);color:#fff;box-shadow:0 26px 50px -22px rgba(31,157,74,.8),inset 0 1px 0 rgba(255,255,255,.35);text-align:center;line-height:1.1}
.core-ic{display:block;width:34%;aspect-ratio:1;margin-bottom:6px}
.core-ic svg{width:100%;height:100%}
.core b{font-size:clamp(13px,1.2vw,16px);font-weight:800;letter-spacing:-.01em}
.core small{font-size:clamp(10px,.9vw,12px);font-weight:600;opacity:.85}
@keyframes orbSpin{to{transform:rotate(360deg)}}
@keyframes orbRingSpin{from{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes orbSpinBack{from{transform:rotate(calc(var(--a)*-1))}to{transform:rotate(calc(var(--a)*-1 - 360deg))}}
@keyframes orbPulse{0%{transform:translate(-50%,-50%) scale(1);opacity:.9}100%{transform:translate(-50%,-50%) scale(2.4);opacity:0}}
@media (prefers-reduced-motion:reduce){.orbit,.node,.orb-ring--main,.orb-pulse{animation:none}}
@media (max-width:640px){
  .orb-wrap{--size:min(88vw,350px);--r:calc(var(--size)*.30);margin:-30px auto -32px}
  .node-tx small{display:none}
  .node-tx b{font-size:13px}
  .node{gap:8px;padding:7px 12px 7px 7px}
  .node-ic{width:30px;height:30px}
  .node-ic svg{width:16px;height:16px}
  .core{width:calc(var(--size)*.32);height:calc(var(--size)*.32)}
  .core b{font-size:12px}.core small{font-size:10px}
}

/* orbit core with logo */
.core--logo{background:#fff;color:#0E1B1A;box-shadow:0 26px 50px -22px rgba(14,27,26,.45),0 0 0 6px rgba(31,157,74,.14);padding:0}
.core--logo img{width:64%;height:auto;display:block}
/* hero proof */
.hero-proof{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px}
.hp-card{margin:0;background:#fff;border:1px solid #E4ECEA;border-radius:18px;overflow:hidden;box-shadow:0 24px 50px -36px rgba(14,27,26,.3)}
.hp-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid #EEF3F2}
.hp-brand{min-width:0}
.hp-head em{flex:0 0 auto}
.hp-brand{display:inline-flex;align-items:center;gap:9px;font-weight:800;font-size:14px;color:#0E1B1A}
.hp-brand i{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;font-style:normal;font-size:11px;font-weight:800}
.hp-head b{font-size:15px;font-weight:800;letter-spacing:-.02em;color:#007028;white-space:nowrap}
.hp-card>img{width:100%;height:auto;display:block}
@media (max-width:640px){
  .hp-head{padding:10px 12px}
  .hp-brand{font-size:12px}
  .hp-head b{font-size:14px}
  .hp-head em{font-size:7.2px!important}
  .hero-proof{gap:10px}
}

/* stacked layout: no sticky intro, no time column squeeze */
@media (max-width:760px){
  .side-sticky{position:static!important;top:auto!important}
  #faq .wrap{gap:22px!important}
  #faq button>span:first-child{font-size:16px!important;line-height:1.3}
}

.hp-hl{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin:0 0 16px}
.hp-hl b{font-size:clamp(28px,3vw,40px);font-weight:800;letter-spacing:-.035em;color:#007028;line-height:1}
.hp-hl b small{font-size:.5em;font-weight:700;letter-spacing:-.01em;color:#007028}
.hp-hl span{color:#51625F;font-size:15px;font-weight:600}
.hp-head em{font-style:normal;font-size:12px;font-weight:600;color:#8A9794;white-space:nowrap}
@media (max-width:640px){.hp-hl{margin-bottom:12px}.hp-hl b{font-size:23.5px}.hp-hl span{font-size:14px}}

@media (max-width:640px){.hp-card>img{width:168%;max-width:none}.hp-card{overflow:hidden}}

@media (max-width:820px){
  header nav>a>span{white-space:nowrap;font-size:15px}
  header nav>div>a[href*="masterclass-04"]{font-size:13px!important;padding:10px 14px!important}
}
@media (max-width:640px){
  #daftar .price-card a,#final .final-card a,#top-hero .hero-cta a[href*="masterclass-04"]{font-size:15px!important;white-space:nowrap;padding:14px 12px!important}
}
.hp-brand .hp-logo{height:22px;width:auto;max-width:none;flex:0 0 auto;display:block;object-fit:contain}
@media (max-width:640px){.hp-brand .hp-logo{height:17px}.hp-brand{gap:7px}}


@media (max-width:640px){
  .fine{font-size:10.5px!important;line-height:1.5}
}

.hero-note .hn-key{font-weight:800;color:#005a20}
.hero-note .hn-a{font-weight:800;color:#005a20}
@media (max-width:640px){.hero-note{font-size:13.5px!important;line-height:1.55!important;padding:12px 14px!important}}

.hero-duo{margin:0 0 18px;display:flex;flex-direction:column;gap:0;max-width:58ch}
.hero-duo img{width:100%;max-width:420px;height:auto;display:block;-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 68%,rgba(0,0,0,.55) 86%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0,#000 68%,rgba(0,0,0,.55) 86%,transparent 100%)}

.u-red{color:#E11D2A;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;text-decoration-skip-ink:none}
.h1-tt{height:1.15em;width:auto;display:inline-block;vertical-align:-.2em;margin-left:.1em}
.duo-box{position:relative;width:fit-content}
.hero-duo .duo-box figcaption{position:absolute;right:10px;bottom:10px;margin:0;background:#fff;padding:9px 12px;border-radius:12px;border:1px solid #E4ECEA}
@media (max-width:640px){.duo-box{margin:0 auto}.hero-duo .duo-box figcaption{right:6px;bottom:6px;padding:8px 10px}}
.hg-brands{display:flex;flex-direction:column;align-items:flex-start;gap:7px;margin:2px 0 18px;position:relative;z-index:1}
.hg-label{color:#005a20;font-weight:800;font-size:12px}
.hg-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px}
.hg-row img{height:24px;width:auto;display:block}
.hg-more{color:#6A7A77;font-size:12px;font-weight:700;white-space:nowrap}
@media (max-width:640px){.hg-brands{margin:12px auto 16px;align-items:center}.hg-row{justify-content:center;gap:7px 13px}.hg-row img{height:20px}.hg-label{font-size:11px}.hg-more{font-size:11px}}
.hero-duo figcaption{display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin-top:-14px;color:#6A7A77;font-size:13px;font-weight:600;text-align:left}
.hero-duo .who-label{color:#005a20;font-weight:800;font-size:12px;letter-spacing:.01em;margin-bottom:4px}
.hero-duo .who b{margin-right:2px}
.hero-duo .who{white-space:nowrap}
.hero-duo figcaption b{color:#0E1B1A;font-weight:800}


@media (max-width:640px){
  .hero-duo{margin-bottom:14px}
  .hero-duo img{max-width:300px;margin:0 auto}
  .hero-duo figcaption{font-size:11.5px;gap:1px}
  .hero-duo .who-label{font-size:11px;margin-bottom:3px}

}

.gs-shift{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0}
.gs-col{background:#fff;border:1px solid #E4ECEA;border-radius:16px;padding:16px 18px}
.gs-col.gs-old{background:#F3F5F5;border-color:#E6EAEA}
.gs-col.gs-new{border-color:#BFE9E1;box-shadow:0 18px 34px -26px rgba(31,157,74,.5)}
.gs-tag{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#007028;margin-bottom:8px}
.gs-tag--old{color:#93A2A0}
.gs-col b{display:block;font-size:15px;font-weight:800;letter-spacing:-.02em;color:#0E1B1A;margin-bottom:6px;line-height:1.35}
.gs-col.gs-old b{color:#8B9A98;text-decoration:line-through;text-decoration-thickness:1px}
.gs-col p{margin:0;font-size:13px;line-height:1.5;color:#6A7A77}
@media (max-width:640px){
  .gs-shift{grid-template-columns:1fr;gap:10px}
  .gs-col{padding:14px}
  .gs-col b{font-size:14px}
}

.gmv-flow{margin:0;background:#fff;border:1px solid #E4ECEA;border-radius:22px;padding:22px 20px 14px;box-shadow:0 34px 66px -46px rgba(14,27,26,.35)}
.gmv-flow-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.gmv-flow-svg{display:block;width:100%;height:auto;font-family:inherit}
.gmv-flow figcaption{margin-top:4px;color:#0E1B1A;font-size:13px;font-weight:800;line-height:1.5;text-align:center}
@media (max-width:640px){
  .gmv-flow{padding:16px 14px 10px;border-radius:18px}
  .gmv-flow-svg{min-width:560px}
  .gmv-flow figcaption{font-size:12px;margin-top:2px}
}

.gmv-flow-v-wrap{display:none}
@media (max-width:640px){
  .gmv-flow-scroll{display:none}
  .gmv-flow-v-wrap{display:block}
  .gmv-flow-v{width:100%;height:auto;min-width:0}
}

.loop-arrow{display:flex;align-items:center;justify-content:center;color:#1f9d4a}
.loop-arrow .la-h{width:44px;height:24px;display:block}
.loop-arrow .la-v{display:none}
@media (max-width:760px){
  .loop-row{position:relative;gap:14px 0!important}
  .loop-row>div:not(.loop-arrow){max-width:calc(100% - 40px)!important;margin-right:auto}
  .loop-arrow{flex:1 1 100%;width:100%;height:0;margin:0;padding:0;position:relative;overflow:visible;z-index:2}
  .loop-arrow .la-h{display:none}
  .loop-arrow .la-v{display:block;position:absolute;right:0;top:50%;transform:translateY(-50%);width:30px;height:74px}
}

section[id],[id]{scroll-margin-top:86px}
@media (max-width:820px){section[id],[id]{scroll-margin-top:16px}}

.sympt{background:#fff;border:1px solid #E8EDEC;border-left:3px solid #1f9d4a;border-radius:18px;padding:24px 26px;margin-bottom:32px}
.sympt h3{font-size:19px;font-weight:800;letter-spacing:-.02em;color:#0E1B1A;margin:0 0 10px;line-height:1.3}
.sympt ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.sympt li{position:relative;padding-left:26px;color:#51625F;font-size:15px;line-height:1.6}
.sympt li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:50%;background:#1f9d4a}
@media (max-width:640px){.sympt{padding:18px;border-radius:16px;margin-bottom:24px}.sympt h3{font-size:17px}.sympt li{font-size:13px;line-height:1.55;padding-left:22px}.sympt ul{gap:9px}}

.relev{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:30px;align-items:center;margin:44px 0 0}
.relev h3{font-size:clamp(28px,3vw,40px);font-weight:800;letter-spacing:-.035em;line-height:1.1;color:#007028;margin:0 0 14px}
.relev h3 small{display:block;font-size:.5em;font-weight:700;letter-spacing:-.01em;line-height:1.3;color:#007028;margin-bottom:6px}
.relev p{margin:0;color:#51625F;font-size:15px;line-height:1.65}
.relev-fig{margin:0}
.relev-fig img{width:100%;height:auto;display:block;border:1px solid #EEF3F2;border-radius:14px}
.relev-fig figcaption{margin-top:10px;color:#6A7A77;font-size:13px;line-height:1.5}
@media (max-width:820px){.relev{grid-template-columns:1fr;gap:20px}}
@media (max-width:640px){
  .relev{margin-top:30px}
  .relev h3{font-size:23.5px}
  .relev p{font-size:14px}
  .relev-fig figcaption{font-size:11.5px}
}

.cta-note{margin:12px 0 0;color:#007028;font-size:13px;font-weight:600;line-height:1.5;max-width:42ch;text-align:center}
.cta-note span{font-weight:600;color:#4E8C81}
@media (max-width:640px){.cta-note{font-size:12px;margin-top:10px}}

/* pricing: value list + sticky buy card */
.price-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:24px;align-items:start}
.get-card{background:#fff;border:1px solid #E4ECEA;border-radius:24px;padding:clamp(18px,2vw,26px)}
.get-title{font-size:clamp(19px,2.6vw,26px);font-weight:800;letter-spacing:-.02em;text-transform:uppercase;color:#007028;margin:0 0 22px;line-height:1.15}
.pc-item{display:flex;gap:14px;align-items:flex-start}
.pc-check{flex-shrink:0;width:26px;height:26px;border-radius:999px;border:2px solid #1f9d4a;display:grid;place-items:center;margin-top:2px;color:#1f9d4a}
.pc-check svg{width:13px;height:13px}
.pc-text{font-size:15px;line-height:1.55;color:#51625F}
.pc-text b{display:block;color:#0E1B1A;font-weight:800;margin-bottom:3px}
.pc-div{height:1px;background:#EEF3F2;margin:18px 0}
.pc-modules{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:9px}
.pc-modules li{position:relative;padding-left:15px;font-size:14px;line-height:1.5;color:#6A7A77}
.pc-modules li::before{content:"";position:absolute;left:0;top:.6em;width:5px;height:5px;border-radius:50%;background:#1f9d4a}
.pc-modules li b{display:inline;color:#0E1B1A;font-weight:700;margin:0}
.pc-modules li span{color:#7A8683}
.buy-card{position:sticky;top:96px;background:#0E1B1A;border:1px solid rgba(31,157,74,.35);border-radius:24px;padding:clamp(26px,3vw,34px);box-shadow:0 40px 90px -46px rgba(14,27,26,.75)}
.buy-badge{display:inline-block;border:1px solid rgba(34,211,180,.45);color:#7ddc9a;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:6px 12px;border-radius:999px;margin-bottom:18px}
.buy-title{font-size:clamp(19px,2.1vw,23px);font-weight:800;letter-spacing:-.025em;line-height:1.25;color:#fff;margin:0 0 10px}
.buy-when{margin:0 0 22px;color:#E4F2EF;font-size:14px;font-weight:700;line-height:1.5}
.buy-when span{display:block;color:#8CA6A1;font-weight:600}
.buy-price{display:flex;align-items:center;gap:10px;margin-bottom:2px}
.buy-was{color:#8CA6A1;font-size:16px;font-weight:600;text-decoration:line-through;text-decoration-thickness:1.5px}
.buy-num{font-size:clamp(40px,5.4vw,56px);font-weight:900;letter-spacing:-.045em;line-height:1;color:#fff;margin-bottom:12px}
.buy-note{font-size:13.5px;line-height:1.5;color:#9DB5B0;margin:0 0 22px}
.buy-cta{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;background:#1f9d4a;color:#04231F;font-weight:800;font-size:16px;padding:17px 20px;border-radius:14px;box-shadow:0 14px 30px -12px rgba(31,157,74,.75)}
.buy-urg{text-align:center;font-size:12.5px;line-height:1.5;color:#7ddc9a;margin:14px 0 0;font-weight:700}
@media (max-width:900px){
  .price-grid{grid-template-columns:1fr;gap:16px}
  .buy-card{position:static}
}
@media (max-width:640px){
  .get-card{border-radius:18px;padding:16px 15px}
  .get-title{margin-bottom:16px}
  .pc-text{font-size:14px}
  .pc-modules li{font-size:12.5px}
  .pc-div{margin:14px 0}
  .buy-card{border-radius:18px}
  .buy-title{font-size:18px}
  .buy-when{font-size:13px;margin-bottom:18px}
  .buy-cta{font-size:15px;padding:15px 18px}
  .buy-urg{font-size:11.5px}
}

/* dark pricing section */
#daftar .get-card{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.10)}
#daftar .get-title{color:#7ddc9a}
#daftar .pc-text{color:#9DB5B0}
#daftar .pc-text b{color:#FFFFFF}
#daftar .pc-check{border-color:#1f9d4a;color:#7ddc9a}
#daftar .pc-div{background:rgba(255,255,255,.09)}
#daftar .pc-modules li{color:#8CA6A1}
#daftar .pc-modules li b{color:#E8F5F2}
#daftar .pc-modules li span{color:#7C948F}
#daftar .pc-modules li::before{background:#7ddc9a}
#daftar .buy-card{background:#12261F;border-color:rgba(34,211,180,.4);box-shadow:0 40px 90px -46px rgba(0,0,0,.8)}

.upd-p{color:#51625F;font-size:15px;line-height:1.65;font-weight:400}
@media (max-width:640px){.upd-p{font-size:14px}}

.pc-close{margin:12px 0 0;font-size:14px;line-height:1.5;color:#8CA6A1}
@media (max-width:640px){.pc-close{font-size:12.5px}}

/* endorse compounding chart */
.endo{margin:0}
.endo-box{background:#fff;border:1px solid #E4ECEA;border-radius:22px;padding:20px 18px;box-shadow:0 34px 66px -46px rgba(14,27,26,.35)}
.endo-svg{display:block;width:100%;height:auto;font-family:inherit}
.endo figcaption{margin-top:14px;color:#007028;font-size:13px;font-weight:800;line-height:1.5;text-align:center}
.endo-bad,.endo-good{stroke-dasharray:1400;stroke-dashoffset:1400;animation:endoDraw 9s linear infinite}
.endo-good{animation-delay:.35s}
.endo-area{opacity:0;animation:endoFade 9s linear infinite;animation-delay:.9s}
.endo-marks .em{opacity:0;animation:endoPop 9s ease-out infinite}
.endo-marks .em1{animation-delay:1.1s}
.endo-marks .em2{animation-delay:2.1s}
.endo-marks .em3{animation-delay:3.1s}
.endo-note text{opacity:0;animation:endoPop 9s ease-out infinite;animation-delay:4.1s}
@keyframes endoDraw{0%{stroke-dashoffset:1400}45%{stroke-dashoffset:0}92%{stroke-dashoffset:0}100%{stroke-dashoffset:1400}}
@keyframes endoFade{0%,8%{opacity:0}45%,92%{opacity:1}100%{opacity:0}}
@keyframes endoPop{0%,10%{opacity:0}22%,92%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){
  .endo-bad,.endo-good{stroke-dasharray:none;stroke-dashoffset:0;animation:none}
  .endo-area,.endo-marks .em,.endo-note text{opacity:1;animation:none}
}
@media (max-width:640px){
  .endo-box{padding:14px 12px;border-radius:18px}
  .endo figcaption{font-size:12px;margin-top:12px}
}

.tool-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:18px}
.tool-card{border-radius:20px;padding:26px}
.tool-tag{font-weight:800;font-size:12px;letter-spacing:.08em;margin-bottom:8px}
.tool-h{font-size:19px;font-weight:800;letter-spacing:-.01em;line-height:1.25;margin:0 0 8px}
.tool-p{font-size:14px;line-height:1.55;margin:0}
@media (max-width:640px){
  .tool-grid{grid-template-columns:1fr;gap:10px}
  .tool-card{padding:15px 16px;border-radius:14px}
  .tool-tag{font-size:10px;letter-spacing:.09em;margin-bottom:4px}
  .tool-h{font-size:15.5px;line-height:1.25;margin:0 0 4px}
  .tool-p{font-size:12.5px;line-height:1.45}
}

@media (max-width:760px){
  .loop-row{gap:12px 0!important}
  .loop-card{padding:14px 15px!important;border-radius:13px!important}
  .lc-tag{font-size:10px!important;letter-spacing:.09em!important;margin-bottom:4px!important}
  .lc-h{font-size:15px!important;line-height:1.25!important;margin-bottom:4px!important}
  .lc-p{font-size:12.5px!important;line-height:1.45!important}
  .loop-arrow .la-v{width:28px;height:34px}
  .loop-arrow{margin:-8px 0!important;padding-right:22px!important}
}

@media (max-width:640px){
  .mt-b{font-size:11.75px!important;line-height:1.52!important}
  .mt-intro{font-size:14px!important;line-height:1.6!important}
}

@media (max-width:640px){
  #faq .wrap{padding-top:clamp(40px,6vw,64px)!important;gap:18px!important}
  #faq h2{line-height:1.12!important;margin-top:14px!important}
  #faq button{padding:16px 0!important;grid-template-columns:1fr 22px!important}
  #faq button>span:first-child{font-size:14px!important;line-height:1.35!important}
  #faq button>span:last-child{font-size:18px!important}
  #faq button+div p{font-size:13px!important;line-height:1.55!important;padding:0 24px 18px 0!important}
}


.rl-br{display:none}
@media (max-width:540px){.rl-br{display:inline}}

.proof-h b{color:#007028;font-weight:800}
@media (max-width:640px){.proof-h{font-size:14.5px!important;line-height:1.5!important}}

.aw-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:0 0 36px;max-width:820px}
.aw-item{margin:0}
.aw-item img{width:100%;height:auto;display:block;border-radius:16px;border:1px solid #E4ECEA;box-shadow:0 24px 50px -38px rgba(14,27,26,.45)}
.aw-item img.aw-photo{aspect-ratio:1/1;object-fit:cover;object-position:center}
.aw-item figcaption{margin-top:10px;color:#5A6B68;font-size:12.5px;line-height:1.5}
@media (max-width:820px){.aw-grid{gap:12px}}
@media (max-width:560px){
  .aw-grid{gap:10px;margin-bottom:26px}
  .aw-item img{border-radius:12px}
  .aw-item figcaption{font-size:10.5px;line-height:1.45;margin-top:7px}
}

@media (max-width:640px){
  section h2{font-size:28px!important;line-height:1.12!important;letter-spacing:-.03em!important}
  #bukti h2.proof-h{font-size:14.5px!important;line-height:1.5!important;letter-spacing:-.015em!important}
}

.rl-br2{display:none}
@media (max-width:540px){.rl-br2{display:inline}}
.aw-item figcaption b{color:#0E1B1A;font-weight:800}

/* pricing: hug the viewport edges so less width is wasted */
#daftar .wrap{max-width:1400px!important;padding-left:clamp(14px,2.2vw,32px)!important;padding-right:clamp(14px,2.2vw,32px)!important}
#daftar .price-grid{gap:20px}
@media (max-width:640px){
  #daftar .wrap{padding-left:12px!important;padding-right:12px!important}
  #daftar .price-grid{gap:12px}
}

@media (max-width:640px){
  .price-head{padding:0 14px}
}

.hob{margin:24px 0 40px;padding:34px 48px;background:#FBFDFC;border:1px solid #EEF3F2;border-radius:20px}
.hob-label{margin:20px 0 44px;color:#7A8683;font-size:13px;font-weight:600;letter-spacing:.01em;text-align:center}
.hob-viewport{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.hob-viewport+.hob-viewport{margin-top:36px}
.hob-track{display:flex;align-items:center;gap:52px;width:max-content;animation:hobScroll 26s linear infinite}
.hob-track--rev{animation-direction:reverse;animation-duration:30s}
.hob-track img{height:36px;width:auto;flex:0 0 auto;opacity:.92}
.hob-viewport:hover .hob-track{animation-play-state:paused}
@keyframes hobScroll{from{transform:translateX(0)}to{transform:translateX(-33.3333%)}}
@media (prefers-reduced-motion:reduce){.hob-track{animation:none;flex-wrap:wrap;width:auto;justify-content:center}}
@media (max-width:640px){
  .hob{margin:18px 0 30px;padding:22px 20px;border-radius:16px}
  .hob-label{font-size:12px;margin:14px 0 32px}
  .hob-track{gap:30px;animation-duration:20s}
  .hob-viewport+.hob-viewport{margin-top:26px}
  .hob-track--rev{animation-duration:23s}
  .hob-track img{height:27px}
}

@media (max-width:640px){
  .ftr>div{padding:22px 20px!important;font-size:11.5px!important;gap:10px 16px!important}
  .ftr img{width:19px!important;height:18px!important}
  .ftr .ftr-top{font-size:14px!important}
}
.hob-label b{color:#007028;font-weight:800}

@media (max-width:820px){
  .mfab{padding:8px 14px calc(8px + env(safe-area-inset-bottom))!important;gap:10px!important}
  .mfab-price b{font-size:16px!important}
  .mfab-tag{font-size:9px!important;margin-top:4px!important;gap:4px!important}
  .mfab-tag::before{width:5px!important;height:5px!important}
  .mfab a{font-size:13px!important;padding:10px 14px!important;border-radius:10px!important}
}

.loop-card{padding:16px 17px!important;border-radius:14px!important}
.lc-tag{font-size:11px!important;letter-spacing:.07em!important;margin-bottom:6px!important}
.lc-h{font-size:15px!important;line-height:1.28!important;margin-bottom:6px!important}
.lc-p{font-size:13.5px!important;line-height:1.5!important}
.loop-row{gap:8px!important}
@media (max-width:760px){
  .loop-card{padding:13px 14px!important;border-radius:12px!important}
  .lc-tag{font-size:9.5px!important;margin-bottom:3px!important}
  .lc-h{font-size:14px!important;line-height:1.25!important;margin-bottom:3px!important}
  .lc-p{font-size:12px!important;line-height:1.42!important}
  .loop-row{gap:10px 0!important}
}

@media (max-width:640px){.hero-note-h{white-space:nowrap!important;font-size:min(18px,calc((100vw - 40px)/23.5 + 1.5px))!important}#top-hero h1{text-wrap:wrap!important;text-wrap:pretty!important}h1,h2{margin-bottom:12px!important}#update p.upd-p+p.upd-p{margin-top:0!important}#update h2+p.upd-p{margin-bottom:8px!important}#materi h3,#top-hero h3,#update h3,#daftar h3.buy-title{margin-bottom:12px!important}}

.live-dot{width:8px;height:8px;border-radius:50%;background:#FF2D2D;flex:0 0 auto;animation:liveDot 1.5s ease-in-out infinite}
@keyframes liveDot{0%{opacity:1;box-shadow:0 0 0 0 rgba(255,45,45,.55)}50%{opacity:.4}100%{opacity:1;box-shadow:0 0 0 7px rgba(255,45,45,0)}}
@media (prefers-reduced-motion:reduce){.live-dot{animation:none;box-shadow:0 0 0 3px rgba(255,45,45,.18)}}

#bukti .wrap{padding-top:clamp(46px,6vw,86px)!important}

.hlc{position:relative;display:inline-block;white-space:nowrap}
.hlc>svg{position:absolute;left:-17%;top:-30%;width:132%;height:160%;overflow:visible;pointer-events:none}
.hlc>svg path{fill:none;stroke:#1f9d4a;stroke-width:3.15;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:hlcDraw 900ms cubic-bezier(.65,.05,.36,1) .45s forwards}
@keyframes hlcDraw{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.hlc>svg path{animation:none;stroke-dashoffset:0}}

@media (max-width:640px){.gmv-flow{margin-top:-22px}}
@media (max-width:640px){.loop-intro{margin-bottom:20px!important}}
@media (max-width:640px){.pain-hook{margin-bottom:8px!important}}

.btu-arrow{display:none}
.btu-arrow svg{display:inline-block;vertical-align:middle;margin-left:5px;animation:btuBounce 1.4s ease-in-out infinite}
@keyframes btuBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@media (max-width:640px){.btu-arrow{display:inline}}
@media (prefers-reduced-motion:reduce){.btu-arrow svg{animation:none}}

.hl-red{background:#E11D2A;color:#fff;padding:.5px 5px;border-radius:4px;white-space:nowrap;-webkit-box-decoration-break:clone;box-decoration-break:clone}
@media (max-width:760px){.loop-row{gap:5px 0!important}}

.relev-imgwrap{position:relative;line-height:0}
.relev-overlay{position:absolute;top:50%;right:3%;transform:translateY(-50%);width:47%;text-align:right;color:#1D4ED8;font-weight:800;font-size:clamp(9.7px,1.25vw,14.6px);line-height:1.3;background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);padding:9px 12px;border-radius:11px;box-shadow:0 10px 30px -12px rgba(0,0,0,.28)}


.flowarrow{animation:flowArr 1.3s ease-in-out infinite}
@keyframes flowArr{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
@media (prefers-reduced-motion:reduce){.flowarrow{animation:none}}

@media (max-width:640px){.relev-overlay{right:2%;width:40%}}
@media (max-width:640px){.buy-note{white-space:nowrap!important;font-size:11px!important}}
#final .wrap{padding-top:14px!important}
@media (max-width:640px){h2.sb-head{font-size:26px!important}}

.pf-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(18px,2.5vw,36px);align-items:center}
@media (max-width:900px){.pf-grid{grid-template-columns:1fr;gap:14px}}


/* Pengaman: tombol & teks tidak boleh keluar dari kotaknya, apa pun font yang kepakai */
.price-grid>*,.pf-grid>*{min-width:0}
@media (max-width:900px){.price-grid{grid-template-columns:minmax(0,1fr)}}
#final .final-card a,#daftar .price-card a,#top-hero .hero-cta a,.buy-cta,.mfab a{max-width:100%;box-sizing:border-box}
@media (max-width:640px){
  #final .final-card a,#daftar .price-card a,#top-hero .hero-cta a[href*="masterclass-04"]{white-space:normal!important;text-align:center;justify-content:center}
}
@media (max-width:380px){
  .buy-note{white-space:normal!important;text-wrap:balance}
  .mcb{white-space:normal!important;max-width:100%}
  #final .final-card{padding-left:18px!important;padding-right:18px!important}
}


.peek-card{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.10);border-radius:24px;padding:clamp(16px,2vw,22px);min-width:0}
.peek-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0 0 12px}
.peek-title{margin:0;color:#fff;font-size:17px;font-weight:800;letter-spacing:-.01em;line-height:1.25}
.peek-count{color:#7ddc9a;font-size:12px;font-weight:700;white-space:nowrap}
.peek-track{display:grid;grid-auto-flow:column;grid-auto-columns:100%;align-items:start;gap:12px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;overscroll-behavior-x:contain;scrollbar-width:none;padding-bottom:3px}
.peek-track::-webkit-scrollbar{display:none}
.peek-slide{margin:0;scroll-snap-align:start;min-width:0}
.peek-slide img{display:block;width:100%;height:auto;aspect-ratio:1200/646;border-radius:12px;background:#fff;cursor:zoom-in}
.peek-slide figcaption{margin:10px 2px 0;color:#C9D8D4;font-size:13px;line-height:1.45}
.peek-slide figcaption b{color:#7ddc9a;font-weight:800;margin-right:4px}
.peek-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}
.peek-btn{flex:0 0 auto;width:36px;height:36px;padding:0;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:transparent;color:#fff;font-family:inherit;font-size:16px;font-weight:700;line-height:1;cursor:pointer;display:grid;place-items:center}
.peek-btn:hover{border-color:#7ddc9a;color:#7ddc9a}
.peek-dots{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;min-width:0}
.peek-dots button{width:7px;height:7px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.25);cursor:pointer;transition:width .2s,background .2s}
.peek-dots button.on{width:18px;background:#7ddc9a}
.peek-note{margin:12px 0 0;color:#7C948F;font-size:12px;line-height:1.5;text-align:center}
@media (min-width:901px){
  .price-grid{grid-template-rows:auto 1fr}
  .price-grid .get-card{grid-row:1 / span 2}
  .price-grid .buy-card{position:static}
  .price-grid .peek-card{grid-column:2;align-self:start}
}
@media (max-width:640px){.peek-card{border-radius:18px}.peek-slide figcaption{font-size:12.5px}}
.peek-lb{position:fixed;inset:0;z-index:100;background:rgba(4,12,10,.92);display:none;align-items:center;justify-content:center;padding:16px;cursor:zoom-out}
.peek-lb.on{display:flex}
.peek-lb img{max-width:min(1200px,100%);max-height:100%;border-radius:10px;background:#fff}


*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Inter',system-ui,-apple-system,sans-serif;color:#0E1B1A;background:#ffffff;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%}
a{color:#007028;text-decoration:none}
a:hover{color:#0E1B1A}
button{font:inherit;cursor:pointer}
::selection{background:#1f9d4a;color:#fff}

.mbr{display:none}@media (max-width:640px){.mbr{display:inline}}
.cxm-m{display:none}@media (max-width:640px){.cxm-d{display:none}.cxm-m{display:block}}
@media (max-width:420px){.mcb{font-size:11px!important;letter-spacing:.06em!important;padding:7px 13px!important}}

.mt-intro,.mt-intro b{font-weight:700}
@media (max-width:640px){
  .upd-p,.relev p,.mt-intro,.pc-text{font-size:13.25px!important}
  .sc-interp{font-size:12.25px!important}
  button .sc-interp{font-size:12.5px!important}
  .upd-p,.relev p,.mt-intro,.pc-text,.sc-interp,.mt-b,.hero-note{line-height:1.6!important}
  figcaption,.lc-p,.tool-p,.relev-overlay,.hob-label,.hp-hl span{line-height:1.5!important}
  .sympt li{font-size:11.75px!important}
  .gs-col p,.tool-p{font-size:11.75px!important}
  #tools h2+p{font-size:13.25px!important;line-height:1.6!important}
  .hero-note{font-size:13.25px!important}
  .proof-h{font-size:13.25px!important}
  #top-hero .wrap{padding-top:16px!important}
  #top-hero .eyebrow{font-size:11.5px!important}
  .hero-duo .who-label{font-size:10.5px!important}
  .hero-duo .who{font-size:11px!important}
}
@media (max-width:820px){#harga{scroll-margin-top:20px}}
/* LIVE dot: Early Bird sedang dibuka */
.live-dot{display:inline-block;width:8px;height:8px;margin-left:9px;border-radius:50%;background:#FF3B30;vertical-align:middle;position:relative;top:-1px;box-shadow:0 0 0 0 rgba(255,59,48,.65);animation:liveDot 1.5s ease-out infinite}
@keyframes liveDot{0%{box-shadow:0 0 0 0 rgba(255,59,48,.65);opacity:1}60%{box-shadow:0 0 0 7px rgba(255,59,48,0);opacity:.55}100%{box-shadow:0 0 0 0 rgba(255,59,48,0);opacity:1}}
@media (prefers-reduced-motion:reduce){.live-dot{animation:none}}
/* Grooving Spark card: show more of the chart background on phones */
@media (max-width:820px){figure#spark.tool-card--spark{aspect-ratio:auto!important;height:auto!important;min-height:430px!important;background-position:center 44px!important;background-size:auto 44%!important}}