/* [codex] Scoped V2 review / Gaya khusus review V2. */
:root{--navy:#122334;--lime:#bdf87a;--paper:#fdfdfb;--soft:#4a5a68;--rule:#e4e0dc;--ease-out:cubic-bezier(.16,1,.3,1);--ease-drawer:cubic-bezier(.32,.72,0,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--paper);color:var(--navy);font-family:Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}button,a,summary{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button{border:0}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #6b9250;outline-offset:5px}p,h1,h2,h3{margin:0}img{display:block;max-width:100%}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.skip{position:fixed;top:-100px;left:16px;z-index:100;background:var(--lime);padding:14px}.skip:focus{top:8px}[hidden]{display:none!important}
.review-note{height:32px;padding:0 40px;display:flex;justify-content:space-between;align-items:center;background:#edf1e8;font-size:10px;letter-spacing:.03em}.review-note button{background:none;font-size:10px;padding:7px 0}
.header{height:88px;display:flex;align-items:center;gap:28px;padding:0 40px;position:sticky;top:0;background:var(--paper);z-index:20;border-bottom:1px solid #1223340d}
.brand{flex-shrink:0}.brand img{width:148px;height:32px}.desktop-nav{display:flex;align-items:center;gap:23px;flex:1;white-space:nowrap}.text-button{background:transparent;font-size:13px;padding:14px 0;white-space:nowrap}.utilities{display:flex;align-items:center;gap:24px}.button{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:52px;padding:15px 24px;border-radius:12px;background:var(--navy);color:white;font-size:15px;font-weight:500;transition:background-color 160ms ease,transform 120ms var(--ease-out)}.nav-cta{font-size:13px;padding:12px 18px;min-height:46px}.button:active{transform:scale(.98)}.lime{background:var(--lime);color:var(--navy);min-width:174px}.outline{background:transparent;color:var(--paper);border:1px solid #95a4b1}.arrow{display:inline-block;transition:transform 160ms var(--ease-out)}
.nav-disclosure summary{display:flex;align-items:center;gap:7px;list-style:none;cursor:pointer;font-size:13px;min-height:48px}.nav-disclosure summary::-webkit-details-marker{display:none}.nav-disclosure[open] summary{font-weight:600}.nav-disclosure[open] summary>span:last-child{transform:rotate(180deg)}
.mega{position:absolute;left:0;right:0;top:87px;background:var(--paper);border-top:1px solid var(--rule);box-shadow:0 20px 30px #12233412;display:grid;grid-template-columns:284px 1.2fr 1fr 1fr;gap:44px;padding:38px 48px 44px}.mega,.small-menu{transform-origin:top left;animation:menu-in 180ms var(--ease-out)}.menu-featured{padding:28px;background:#e4f7c9;border-radius:12px;display:flex;flex-direction:column;gap:18px}.menu-featured h2{font:400 33px/1.1 Fraunces,serif}.menu-featured p{font-size:15px;line-height:1.6}.menu-featured small{font-size:12px;line-height:1.6;color:#466249}.menu-featured button{text-align:left;font-size:14px;background:none;padding:8px 0}.menu-group h3{font:500 10px/1.5 Inter,sans-serif;color:#61727f;letter-spacing:.08em;margin:0 0 15px}.menu-group button{display:block;width:100%;text-align:left;padding:10px 0;background:transparent;font-size:14px;line-height:1.5}.small-menu{position:absolute;top:75px;width:310px;background:var(--paper);padding:20px;border:1px solid var(--rule);border-radius:12px;box-shadow:0 16px 28px #12233412}.small-menu button{display:block;width:100%;padding:14px 0;text-align:left;background:none;font-size:14px}
.hero{background:var(--navy);padding:60px 72px 0;overflow:hidden}.hero-copy{text-align:center;display:flex;align-items:center;flex-direction:column;gap:22px}.eyebrow{font-size:11px;line-height:1.5;letter-spacing:.075em}.hero .eyebrow{color:var(--lime)}h1{font:400 clamp(48px,5.3vw,76px)/1.04 Fraunces,Georgia,serif;letter-spacing:-.025em;color:var(--paper)}.lede{font-size:18px;line-height:1.6;color:#e2e8ed;max-width:720px}.hero-actions{display:flex;gap:12px;padding:4px 0 18px}.workspace-stage{height:396px;max-width:1296px;margin:22px auto 0;position:relative}.workspace{position:absolute;top:18px;left:12.2%;width:75.6%;height:378px;background:white;border-radius:16px 16px 0 0;overflow:hidden;text-align:left}.workspace-header{height:60px;display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid var(--rule)}.workspace-header b{font-size:15px;font-weight:500}.example{font-size:9px;letter-spacing:.07em;color:#61727f}.workspace-body{display:flex;gap:24px;padding:24px}.workspace-sidebar{width:142px;flex-shrink:0;display:flex;flex-direction:column;gap:18px;font-size:12px;color:#61727f}.workspace-sidebar strong{font-weight:500;color:var(--navy)}.workspace-content{flex:1;min-width:0}.workspace-content h2{font-size:25px;font-weight:500;margin-bottom:12px}.workspace-content p{font-size:11px;color:#61727f;line-height:1.6;margin-bottom:18px}.work-row{display:flex;align-items:center;gap:14px;border-radius:8px;background:#faf8f7;padding:15px 16px;margin:10px 0;font-size:12px}.work-row:first-of-type{background:#eff8e7}.work-row>span{font-size:11px;color:#61727f}.work-row b{font-size:12px;font-weight:500;flex:1}.work-row small{font-size:9px;color:#61727f;white-space:nowrap}.support-note{position:absolute;left:24px;top:182px;width:244px;background:var(--lime);padding:22px;border-radius:12px}.support-note>span{font-size:27px;line-height:1}.support-note h2{font-size:21px;line-height:1.3;font-weight:500;margin:9px 0}.support-note p{font-size:12px;line-height:1.6;color:#344a35}
.proof{padding:30px 72px;display:grid;grid-template-columns:160px repeat(3,1fr);align-items:center;gap:40px;max-width:1440px;margin:auto}.proof .eyebrow{font-size:10px;color:#61727f}.proof b{display:block;font-size:17px;font-weight:500;line-height:1.5}.proof small{display:block;font-size:11px;color:#61727f;margin-top:5px}
.features{padding:72px 96px;background:#faf8f7}.features>h2{font:400 52px/1.1 Fraunces,Georgia,serif;text-align:center;letter-spacing:-.025em}.feature-grid{max-width:1248px;margin:48px auto 0;display:grid;grid-template-columns:490px minmax(0,1fr);gap:66px;align-items:center}.slide-stack{display:grid}.slide{grid-area:1/1;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity 350ms var(--ease-out),transform 350ms var(--ease-out)}.slide.active{opacity:1;transform:translateY(0);pointer-events:auto}.slide .eyebrow{color:#61727f;font-size:11px;margin-bottom:24px}.slide h3{font:400 40px/1.1 Fraunces,Georgia,serif;letter-spacing:-.025em;margin-bottom:24px}.slide p:not(.eyebrow){font-size:17px;line-height:1.6;color:var(--soft);margin-bottom:24px}.inline-link{background:none;border-bottom:1px solid var(--navy);padding:0 0 9px;display:inline-flex;gap:16px;font-size:15px;text-align:left}.carousel-controls{display:flex;gap:18px;align-items:center;margin-top:36px}.tabs{display:flex;gap:14px;align-items:center}.tab{background:none;padding:10px 0;min-height:44px;text-align:left;display:flex;flex-direction:column;gap:11px;font-size:10px;color:#61727f}.tab[aria-selected=true]{color:var(--navy)}.time-track{height:4px;display:block;width:20px;border-radius:4px;background:#d8d7d3;overflow:hidden}.tab[aria-selected=true] .time-track{width:90px}.time-fill{height:100%;width:100%;display:block;transform-origin:left;transform:scaleX(0);background:var(--navy)}.play-toggle{width:44px;height:44px;border:1px solid #c8cfce;border-radius:50%;background:none;flex-shrink:0;font-size:16px}.play-toggle:disabled{opacity:.45;cursor:default}
.feature-art{position:relative;height:460px;min-width:0;overflow:hidden}.art-backdrop{position:absolute;left:30px;right:15px;top:74px;height:370px;background:#dff0c8;border-radius:24px;transform:rotate(-4deg);transition:background-color 300ms ease}.art-stack{position:absolute;left:10px;top:104px;width:286px;transform:rotate(-4deg)}.art-card{position:absolute;top:0;left:0;width:100%;padding:22px;border-radius:16px;background:white;border:1px solid #cad5c3;opacity:0;transform:translateY(8px);transition:opacity 450ms var(--ease-out),transform 450ms var(--ease-out);pointer-events:none}.art-card.active{opacity:1;transform:translateY(0)}.art-card h3{font-size:21px;font-weight:500;line-height:1.3;margin:16px 0}.art-card ul{padding:0;list-style:none;display:flex;flex-direction:column;gap:16px;margin:18px 0;font-size:11px}.art-card li::before{content:'✓';color:#36633b;margin-right:10px}.art-card .example{font-size:8px}.art-card p{font-size:12px;color:#36633b;line-height:1.5}.founder{position:absolute;left:225px;top:4px;width:304px;height:456px;max-width:none;object-fit:contain;pointer-events:none}
.review-footer{padding:26px 40px;display:flex;justify-content:space-between;gap:28px;font-size:11px;color:#61727f;line-height:1.6;border-top:1px solid var(--rule)}.review-footer p{max-width:660px}.review-footer a{white-space:nowrap}
dialog{color:var(--navy);border:0;background:var(--paper)}dialog::backdrop{background:#0b182699}.preview-dialog{width:min(760px,calc(100% - 32px));max-height:calc(100dvh - 40px);border-radius:20px;padding:50px 40px;box-shadow:0 20px 80px #0003}.close{background:transparent;width:44px;height:44px;font-size:30px;line-height:1}.preview-dialog>.close{position:absolute;right:12px;top:8px}.preview-dialog h2{font:400 36px/1.1 Fraunces,Georgia,serif;margin-bottom:20px}.preview-dialog p{font-size:15px;line-height:1.7;color:var(--soft)}.preview-dialog .route{margin-top:22px;font-size:11px;background:#edf1e8;padding:12px;border-radius:8px;overflow-wrap:anywhere}.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0}.price-grid article{padding:18px;border:1px solid var(--rule);border-radius:12px}.price-grid h3{font-size:16px;margin-bottom:16px}.price-grid b{font-size:20px}.price-grid p{font-size:11px;margin-top:8px}.preview-dialog ul{font-size:14px;line-height:1.8;padding-left:18px}.mobile-toggle{display:none;width:44px;height:44px;flex-direction:column;gap:6px;align-items:center;justify-content:center;background:transparent}.mobile-toggle span{width:22px;height:1.5px;background:var(--navy)}.mobile-menu{margin:0 0 0 auto;width:min(420px,100%);max-width:100%;height:100dvh;max-height:100dvh;padding:0;overflow-y:auto;overscroll-behavior:contain}.drawer-header{height:72px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--rule)}#mobile-root,#mobile-offers{padding:24px}.drawer-item{display:flex;width:100%;align-items:center;justify-content:space-between;background:none;border-bottom:1px solid var(--rule);padding:20px 0;font-size:19px;text-align:left}.drawer-back{font-size:12px;background:none;padding:0 0 20px;color:#61727f}.mobile-menu h2{font-size:24px;margin-bottom:20px}.mobile-menu .menu-featured{margin-bottom:26px;padding:20px}.mobile-menu .menu-group{margin-bottom:26px}.mobile-menu .menu-group button{padding:10px 0}.mobile-menu .button{margin-top:26px;width:100%}
@keyframes menu-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes drawer-in{from{transform:translateX(100%)}to{transform:translateX(0)}}
.mobile-menu[open]{animation:drawer-in 240ms var(--ease-drawer)}
@media(hover:hover) and (pointer:fine){.button:hover{background:#233f55}.lime:hover{background:#a8e762}.outline:hover{background:#ffffff10}.button:hover .arrow,.inline-link:hover .arrow{transform:translateX(4px)}.text-button:hover,.menu-group button:hover,.small-menu button:hover{color:#47753c}.menu-group button:hover,.small-menu button:hover{text-decoration:underline;text-underline-offset:5px}}
@media(min-width:1600px){.hero{padding-top:70px}.header{padding-inline:max(40px,calc((100vw - 1440px)/2 + 40px))}}
@media(max-width:1200px){.desktop-nav,.utilities .desktop,.nav-cta{display:none}.header{justify-content:space-between;padding-inline:24px;height:76px}.mobile-toggle{display:flex}.utilities{gap:12px}.hero{padding-inline:40px}.feature-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}.features{padding:64px 40px}.founder{left:40%;width:60%;height:100%}.art-stack{width:58%}.art-card{padding:18px}.art-card h3{font-size:18px}.workspace{left:7%;width:88%}.support-note{left:0}.proof{padding-inline:40px;gap:24px;grid-template-columns:130px repeat(3,1fr)}.proof b{font-size:14px}}
@media(max-width:700px){html{scroll-padding-top:84px}.review-note{height:30px;padding-inline:20px;font-size:9px}.review-note button{font-size:9px}.header{height:72px;padding-inline:20px;gap:12px}.hero{padding:40px 20px 0}.hero-copy{gap:20px}.hero .eyebrow{font-size:9px}h1{font-size:45px;line-height:1.04;letter-spacing:-.03em}.lede{font-size:15px;line-height:1.6}.lede br{display:none}.hero-actions{flex-direction:column;width:100%;gap:10px;padding:0 0 12px}.hero-actions .button{width:100%;min-height:48px;font-size:14px}.workspace-stage{height:310px;margin-top:20px}.workspace{left:0;top:0;width:100%;height:310px}.workspace-header{padding:14px 16px;height:47px}.workspace-header b{font-size:12px}.workspace-header .example{font-size:7px}.workspace-body{padding:14px;display:block}.workspace-sidebar{display:none}.workspace-content h2{font-size:19px}.workspace-content p{font-size:10px;line-height:1.5;margin-bottom:14px}.work-row{padding:12px;gap:9px;margin:9px 0}.work-row b{font-size:11px;line-height:1.5}.work-row>span{font-size:10px}.work-row small,.support-note{display:none}.proof{padding:28px 24px;grid-template-columns:1fr;gap:18px}.proof .eyebrow br{display:none}.proof b{font-size:16px}.proof small{font-size:11px;margin-top:3px}.features{padding:48px 20px}.features>h2{font-size:33px;line-height:1.1}.feature-grid{display:flex;flex-direction:column;gap:28px;margin-top:32px;align-items:stretch}.slide .eyebrow{font-size:10px;margin-bottom:18px}.slide h3{font-size:30px;line-height:1.1;margin-bottom:18px}.slide p:not(.eyebrow){font-size:15px;line-height:1.6;margin-bottom:18px}.inline-link{font-size:14px}.carousel-controls{gap:10px;margin-top:24px}.tabs{gap:12px}.tab{font-size:9px}.tab[aria-selected=true] .time-track{width:74px}.feature-art{height:330px}.art-backdrop{top:44px;left:14px;right:16px;height:266px}.art-stack{left:0;top:70px;width:222px}.art-card{padding:16px}.art-card h3{font-size:17px;margin:13px 0}.art-card .example{font-size:7px}.art-card ul{font-size:9px;gap:13px}.art-card p{font-size:9px}.founder{left:calc(50% - 59px);top:0;width:220px;height:330px}.review-footer{padding:24px 20px;flex-direction:column;gap:16px}.preview-dialog{padding:48px 24px 28px}.preview-dialog h2{font-size:30px}.price-grid{grid-template-columns:1fr}.price-grid article{padding:16px}.preview-dialog p{font-size:14px}}
@media(max-width:360px){h1{font-size:40px}.brand img{width:132px;height:auto}.utilities{gap:8px}.features>h2{font-size:30px}.tab{font-size:8px}.tabs{gap:10px}.tab[aria-selected=true] .time-track{width:62px}.carousel-controls{gap:8px}.art-stack{width:204px}.founder{left:99px;width:206px}}
.mega,.small-menu{white-space:normal}.menu-group{min-width:0}
/* [codex] Match desktop audience grouping with a native mobile disclosure. */
.drawer-business summary::after{content:'+'}.drawer-business[open] summary::after{content:'−'}.drawer-business>div{padding:8px 0 8px 16px}.drawer-business>div>button{display:block;width:100%;min-height:44px;padding:12px 0;text-align:left;background:none;font-size:15px;line-height:1.5}
/* [codex] Keep the example copy above the decorative portrait. */
.art-stack{z-index:1}
@media(max-width:700px){.feature-art{height:400px}.art-stack{top:148px}.art-backdrop{height:330px}.founder{left:auto;right:0}}
body[data-input=keyboard] *,body[data-input=keyboard] *::before{animation-duration:0ms!important;transition-duration:0ms!important}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.slide,.art-card{transform:none!important}}
/* [codex] Tactile press feedback follows better-ui; reduced motion stays still. / Respons tekan. */
@media(prefers-reduced-motion:no-preference){.button:active{transform:scale(.96)}}
@media(prefers-reduced-motion:reduce){.button:active{transform:none}}
