/* [codex] V2 continuation and motion corrections / Lanjutan V2 dan perbaikan gerak. */
.brand img,.drawer-header img{width:126px;height:32px;object-fit:contain}
figure{margin:0}.real-screen{margin:0;overflow:hidden;border:5px solid #dae1d1;border-radius:14px;background:#fff;box-shadow:0 8px 24px #0e212319}
.real-screen img{display:block;width:100%;height:auto;object-fit:cover;object-position:top}.real-screen figcaption{padding:12px 14px;font-size:12px;font-weight:500;line-height:1.4;background:#fff;color:#20332b}.real-screen small{display:block;font-size:9px;font-weight:400;color:#68746c;margin-top:4px}
.real-workspace-stage{position:relative;height:624px;max-width:1400px;margin:54px auto 0}.hero-product{position:absolute;left:15%;top:22px;width:70%;border-width:7px;border-radius:20px}.hero-product img{height:480px}.hero-crop{position:absolute;width:252px;z-index:3;border-width:4px;border-radius:12px}.hero-crop img{height:160px}.hero-crop figcaption{font-size:11px;padding:9px 12px}.hero-crop small{font-size:8px}.hero-crop-one{left:0;top:-66px;transform:rotate(-3deg)}.hero-crop-two{right:0;top:-15px;transform:rotate(3deg)}.hero-crop-two img{object-position:center}.hero-crop-three{left:1%;top:320px;transform:rotate(-3deg);width:278px}.hero-service-note{position:absolute;right:0;top:375px;width:244px;padding:24px;background:#e8edcf;border-radius:14px;text-align:left;color:#19352f;z-index:3}.hero-service-note>span{font-size:32px}.hero-service-note h2{font:400 26px/1.1 Fraunces,serif;letter-spacing:-.035em;margin:12px 0}.hero-service-note p{font-size:12px;line-height:1.6}.hero-proof-note{font-size:10px;color:#62716a;text-align:center;padding:0 0 45px}.hero::before,.hero::after{bottom:255px}
.collage-copy mark{position:relative;background:none;isolation:isolate}.collage-copy mark::before{content:'';position:absolute;inset:3px -3px 0;background:#d6ebaf;z-index:-1;transform-origin:left}.can-animate .collage-copy mark::before{transform:scaleX(0);transition:transform 500ms var(--ease-out)}.is-seen .collage-copy mark::before{transform:scaleX(1)}
.feature-grid{align-items:center;margin-top:68px}.slide-stack{min-height:390px}.slide{visibility:hidden;opacity:1;transform:none;transition:none;pointer-events:none}.slide[data-active=true]{visibility:visible;pointer-events:auto}.slide h3{font-size:38px;margin-bottom:25px}.slide .eyebrow{margin-bottom:27px}.slide .feature-lead{font-size:24px!important;margin-bottom:16px!important}.slide p:not(.eyebrow){font-size:16px;line-height:1.6}.slide-detail{padding-left:20px}.slide .inline-link{font-size:16px;margin-top:4px}.feature-art{height:525px;overflow:visible}.feature-scene{position:absolute;inset:0;visibility:hidden;pointer-events:none}.feature-scene[data-active=true]{visibility:visible}.scene-backdrop{position:absolute;inset:100px 0 20px 30px;clip-path:polygon(20% 0,82% 3%,100% 19%,96% 79%,78% 100%,8% 96%,0 53%);background:#dcebbf}.scene-backdrop-1{background:#dceaf2}.scene-backdrop-2{background:#f0e5d3}.scene-person{position:absolute;right:-12px;bottom:0;width:345px;height:515px;object-fit:contain;object-position:bottom;max-width:none}.feature-product{position:absolute;left:0;top:188px;width:278px;z-index:2;transform:rotate(-5deg);border:3px solid #2b463a;border-radius:20px}.feature-product figcaption{font-size:11px}.feature-product small{font-size:8px}.screen-disclosure{max-width:900px;margin:30px auto 0;text-align:center;font-size:10px;line-height:1.5;color:#6b726d}
.carousel-controls{gap:8px;margin-top:22px;min-height:44px}.tabs{gap:0}.tab,.tab[aria-selected=true]{width:44px;min-width:44px;height:44px;padding:0;display:grid;place-items:center}.tab .time-track{width:6px;height:6px;background:#c9cdc3;transition:none}.tab[aria-selected=true] .time-track{width:40px;height:6px;background:#d9ddd2}.tab .time-fill{background:#193c30}.play-toggle{width:44px;height:44px;min-width:44px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:none}.player-symbol{width:28px;height:28px;display:grid;place-items:center;border:1px solid #c9cec4;border-radius:50%}.player-symbol svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.play-shape{display:none}.play-toggle[data-state=paused] .play-shape{display:block;fill:currentColor;stroke-width:0}.play-toggle[data-state=paused] .pause-shape{display:none}
.section-heading{text-align:center;max-width:940px;margin:0 auto 50px}.section-heading h2,.start h2,.closing h2{font:400 clamp(42px,5vw,68px)/1.03 Fraunces,Georgia,serif;letter-spacing:-.05em}.section-heading>p{max-width:650px;margin:23px auto 0;font-size:17px;line-height:1.6;color:#5f6a63}
.operations{position:relative;isolation:isolate;overflow:hidden;background:#14261c;color:#fff;padding:72px 64px 24px}.operations-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.operations::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#10291eed 0%,#10291eaa 43%,#10291e33 70%),linear-gradient(0deg,#101e16fa 0%,#101e1680 40%,transparent 90%)}.operations-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:100px;max-width:1260px;margin:auto;align-items:start;min-height:495px}.operations h2{font:400 clamp(42px,4.6vw,64px)/1.05 Fraunces,serif;letter-spacing:-.04em}.operations-top>div>p{max-width:455px;font-size:17px;line-height:1.7;margin:26px 0}.operations .inline-link{color:white;border-color:white;margin-top:5px}.operations-screens{position:relative;height:430px;max-width:440px;transform:rotate(3deg);margin-top:40px}.operation-scene{position:absolute;inset:0;visibility:hidden}.operation-scene[data-active=true]{visibility:visible}.operations .real-screen{border:4px solid #e2e8d8;border-radius:18px}.operation-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;max-width:1260px;margin:35px auto 0}.operation-tabs button{background:none;color:#ddd;padding:0;text-align:left;min-height:130px;display:flex;flex-direction:column;gap:16px}.operation-tabs button[aria-selected=true]{color:white}.operation-tabs b{font-size:19px;font-weight:600}.operation-tabs button>span:last-child{font-size:13px;line-height:1.6;color:#d1d8d0;max-width:260px}.operation-track,.outcome-track{height:2px;width:100%;background:#ffffff50;overflow:hidden}.operation-track [data-fill],.outcome-track [data-fill]{display:block;width:100%;height:100%;transform-origin:left;transform:scaleX(0);background:#bdf87a}.operations-bottom{max-width:1260px;margin:25px auto 0;display:flex;align-items:center;justify-content:space-between;gap:28px}.operations-bottom p{font-size:9px;line-height:1.6;color:#c7d2c6}.operations .player-symbol{border-color:#ffffff60}
.offerings{padding:106px 0 90px;overflow:hidden}.offerings .section-heading{padding-inline:24px;margin-bottom:20px}.offerings-tools{display:flex;justify-content:flex-end;align-items:center;gap:10px;max-width:1280px;margin:0 auto 20px;padding-inline:32px}.offerings-tools .text-button{font-size:12px;margin-right:8px}.round-control{min-width:44px;height:44px;border:1px solid #d8dad2;border-radius:50%;background:transparent;font-size:20px}.offerings-viewport{overflow:hidden;margin:20px 0;scrollbar-width:thin;scroll-padding:24px}.offerings-track{display:flex;width:max-content;animation:offer-drift 85s linear infinite;animation-play-state:paused}.offerings-track.reverse{animation-direction:reverse}.offer-group{display:flex;gap:18px;padding-right:18px}.offer-card{display:block;position:relative;flex-shrink:0;width:334px;min-height:330px;text-align:left;border:1px solid #d5d7cf;border-radius:19px;padding:28px;background:transparent}.offer-card img{width:78px;height:78px;object-fit:contain;margin-bottom:26px}.offer-card h3{font:500 21px/1.25 Inter,sans-serif;letter-spacing:-.025em;margin:11px 0 16px}.offer-card p{font-size:14px;line-height:1.55;color:#6d746e}.offer-card .eyebrow{font-size:9px;letter-spacing:.09em;color:#657369}.offer-arrow{position:absolute;top:24px;right:26px;font-size:24px;color:#5a685c;transition:transform 160ms var(--ease-out)}.offerings[data-running=true] .offerings-track{animation-play-state:running}.offerings:hover .offerings-track,.offerings:focus-within .offerings-track{animation-play-state:paused}.manual-offerings .offerings-viewport{overflow-x:auto;padding:0 24px;scroll-snap-type:x proximity}.manual-offerings .offerings-track{animation:none;transform:none}.manual-offerings .offer-group[aria-hidden]{display:none}.manual-offerings .offer-card{scroll-snap-align:start}@keyframes offer-drift{to{transform:translateX(-50%)}}
.outcomes{padding:40px 64px 100px;max-width:1440px;margin:auto}.outcomes-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:stretch}.outcomes-art{position:relative;min-height:595px;border-radius:18px;overflow:hidden}.outcome-image{position:absolute;inset:0;visibility:hidden}.outcome-image[data-active=true]{visibility:visible}.outcome-image img{width:100%;height:100%;object-fit:cover}.outcome-tabs button{position:relative;display:block;width:100%;background:none;text-align:left;padding:35px 24px;border-top:1px solid #dddfd8;transition:background-color 180ms ease}.outcome-tabs button[aria-selected=true]{background:#f1f0eb}.outcome-tabs h3{font:400 34px/1.08 Fraunces,serif;letter-spacing:-.045em;margin:0 0 15px}.outcome-tabs p{font-size:16px;line-height:1.55;color:#657068}.outcome-track{position:absolute;top:-1px;left:0;background:none}.outcome-track [data-fill]{background:#648b49}.outcomes-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:18px 24px}.outcomes-bottom p{font-size:10px;line-height:1.5;color:#697368}
.start{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:76px;align-items:center;max-width:1440px;padding:70px 64px 100px;margin:auto}.start-photo{position:relative;border-radius:18px;overflow:hidden;align-self:stretch}.start-photo>img{width:100%;height:100%;object-fit:cover}.start-photo small{position:absolute;bottom:16px;left:16px;background:#182f24c9;color:white;padding:7px 10px;border-radius:6px;font-size:9px}.start h2{font-size:56px}.start-copy>p{font-size:17px;line-height:1.65;color:#5e6a62;margin:25px 0}.start ol{list-style:none;margin:35px 0;padding:0}.start li{display:flex;gap:20px;padding:20px 0;border-top:1px solid #d9ded4}.start li>span{font-size:12px;color:#6c786b;padding-top:5px}.start h3{font-size:19px;font-weight:500;margin-bottom:9px}.start li p{font-size:14px;line-height:1.6;color:#657067}.start .button{margin-top:6px}
.next-actions{padding:40px 48px 110px;max-width:1440px;margin:auto}.next-actions>h2{font:400 40px/1.1 Fraunces,serif;text-align:center;letter-spacing:-.04em;margin-bottom:42px}.action-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.action-card{text-align:left;border-radius:16px;background:#e2edcb;padding:25px 24px 30px}.action-1{background:#dce9ed}.action-2{background:#eee5d5}.action-3{background:#eee2ea}.action-card img{width:140px;height:150px;object-fit:contain;margin:0 auto 30px}.action-card h3{font-size:19px;line-height:1.3;font-weight:500;display:flex;gap:12px;justify-content:space-between}.action-card p{font-size:13px;line-height:1.6;color:#5d685e;margin-top:12px}.closing{text-align:center;background:#dcedbd;padding:90px 24px 96px}.closing>p{font-size:17px;line-height:1.6;margin:26px auto;max-width:560px;color:#41573e}.closing .button{background:#1d3b30;color:white}.site-footer{padding:64px 48px;display:grid;grid-template-columns:1.2fr 1.2fr 1fr 1fr;gap:48px;max-width:1440px;margin:auto}.footer-intro img{width:126px;height:32px}.footer-intro p{font-size:13px;line-height:1.7;color:#657065;margin-top:24px;max-width:220px}.site-footer h2{font-size:10px;letter-spacing:.09em;color:#6c786a;margin:9px 0 22px;font-weight:500}.site-footer button{display:block;font-size:12px;line-height:1.5;background:none;padding:9px 0;text-align:left}.review-footer{font-size:10px}
@media(hover:hover) and (pointer:fine){.offer-card:hover{background:#f1f3eb}.offer-card:hover .offer-arrow{transform:translate(2px,-2px)}.action-card:hover img{transform:translateY(-2px)}.action-card img{transition:transform 180ms var(--ease-out)}.round-control:hover,.play-toggle:hover .player-symbol{background:#e7eddf}.operations .play-toggle:hover .player-symbol{background:#ffffff20}}
@media(max-width:1100px){.hero-crop{width:200px}.hero-crop img{height:130px}.hero-crop-three{width:220px;top:320px}.hero-service-note{width:205px;padding:20px}.hero-product img{height:450px}.real-workspace-stage{height:605px}.feature-product{width:240px}.scene-person{width:300px}.feature-grid{gap:30px}.operations{padding:55px 36px 24px}.operations-top{gap:55px;min-height:460px}.operations-screens{height:370px}.operation-tabs{gap:20px}.operation-tabs b{font-size:17px}.outcomes{padding-inline:36px}.outcomes-grid{gap:32px}.outcomes-art{min-height:555px}.outcome-tabs h3{font-size:30px}.outcome-tabs button{padding:28px 20px}.start{padding-inline:36px;gap:40px}.start h2{font-size:44px}.next-actions{padding-inline:30px}.action-card{padding:20px 18px}.action-card h3{font-size:17px}.site-footer{padding-inline:32px;gap:30px}}
@media(max-width:900px){.operation-tabs{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.operations-top{gap:32px;min-height:400px}.operations h2{font-size:43px}.operations-top>div>p{font-size:15px}.operations-screens{height:320px}.outcomes-grid{gap:22px}.outcome-tabs h3{font-size:27px}.outcome-tabs p{font-size:14px}.outcome-tabs button{padding:24px 18px}.outcomes-art{min-height:520px}.action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.site-footer{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px}.offer-card{width:304px;min-height:330px}}
@media(max-width:700px){.brand img,.drawer-header img{width:126px;height:32px}.real-workspace-stage{height:477px;margin-top:45px}.hero-product{left:0;top:145px;width:100%;border-width:4px;border-radius:13px}.hero-product img{height:267px}.hero-product figcaption{padding:9px 11px;font-size:10px}.hero-product small{font-size:8px}.hero-crop-one{left:auto;right:1px;top:-9px;width:150px;transform:rotate(3deg)}.hero-crop-one img{height:84px}.hero-crop figcaption{font-size:9px;padding:7px 8px}.hero-crop small{display:none}.hero-crop-two,.hero-crop-three,.hero-service-note{display:none}.hero-proof-note{font-size:9px;padding:8px 0 36px}.hero::before,.hero::after{bottom:195px}.business-collage{margin-top:0}.features{padding-inline:20px;padding-bottom:55px}.features>h2{font-size:38px}.feature-grid{margin-top:42px;gap:20px}.slide-stack{min-height:365px}.slide h3{font-size:33px}.slide .eyebrow{margin-bottom:22px}.slide .feature-lead{font-size:22px!important}.slide p:not(.eyebrow){font-size:15px}.slide-detail{padding-left:15px}.carousel-controls{margin-top:16px}.feature-art{height:455px;overflow:hidden}.scene-person{width:282px;height:422px;right:-16px;bottom:8px}.scene-backdrop{inset:72px 0 30px 10px}.feature-product{left:4px;top:187px;width:231px;border-width:2px;border-radius:17px}.feature-product figcaption{font-size:10px;padding:10px}.feature-product small{font-size:7px}.screen-disclosure{font-size:9px;margin-top:10px;max-width:350px}.operations{padding:47px 22px 23px}.operations-top{display:block;min-height:0}.operations h2{font-size:42px}.operations-top>div>p{font-size:15px;margin:24px 0}.operations-screens{max-width:340px;height:340px;margin:45px auto 30px;transform:rotate(2deg)}.operations-screens figcaption{font-size:11px}.operation-tabs{gap:27px 20px;margin-top:20px}.operation-tabs button{gap:12px;min-height:136px}.operation-tabs b{font-size:16px}.operation-tabs button>span:last-child{font-size:12px}.operations-bottom{margin-top:24px;gap:20px}.operations-bottom p{font-size:8px;max-width:265px}.section-heading h2,.start h2,.closing h2{font-size:40px}.section-heading>p{font-size:15px;margin-top:22px}.offerings{padding:64px 0 40px}.offerings .section-heading{margin-bottom:24px}.offerings-tools{padding-inline:22px;margin-bottom:12px}.offer-card{width:288px;min-height:326px;padding:25px}.offer-card h3{font-size:20px}.offer-card p{font-size:13px}.outcomes{padding:40px 20px 70px}.outcomes .section-heading{margin-bottom:34px}.outcomes-grid{display:flex;flex-direction:column;gap:25px}.outcomes-art{height:412px;min-height:0;width:100%;max-width:400px;align-self:center}.outcome-image img{object-position:center 40%}.outcome-tabs button{padding:26px 18px}.outcome-tabs h3{font-size:30px}.outcome-tabs p{font-size:15px}.outcomes-bottom{margin:18px}.start{display:flex;flex-direction:column;padding:15px 20px 65px;gap:36px;align-items:stretch}.start-photo{height:330px}.start-copy>p{font-size:15px}.start ol{margin:27px 0}.start h3{font-size:18px}.start li p{font-size:14px}.start .button{font-size:14px}.next-actions{padding:10px 20px 65px}.next-actions>h2{font-size:33px;margin-bottom:30px}.action-grid{gap:12px}.action-card{padding:16px 15px 24px}.action-card img{width:110px;height:124px;margin-bottom:22px}.action-card h3{font-size:16px;gap:5px}.action-card p{font-size:11px}.closing{padding:65px 22px}.closing p{font-size:15px;max-width:330px}.site-footer{padding:45px 22px;gap:32px 22px}.footer-intro{grid-column:1/-1}.footer-intro p{max-width:285px;margin-top:18px}.site-footer nav:last-child{grid-column:1/-1}.site-footer button{font-size:12px;min-height:44px;padding:10px 0}.site-footer h2{margin-bottom:12px}.review-footer{padding:24px 22px;flex-direction:column;gap:16px}.carousel-controls .play-toggle{min-height:44px}}
@media(max-width:360px){.feature-product{width:211px;top:189px}.scene-person{width:253px;height:380px;bottom:20px}.feature-art{height:425px}.slide-stack{min-height:409px}.slide h3{font-size:30px}.features>h2{font-size:33px}.operations-screens{height:299px}.operation-tabs{gap:20px 16px}.section-heading h2,.start h2,.closing h2{font-size:36px}.outcomes-art{height:367px}.action-grid{grid-template-columns:minmax(0,1fr)}.action-card img{width:150px;height:150px}.action-card h3{font-size:20px}.action-card p{font-size:13px}}
/* [codex] Absolute scene layers need the full flex width on phones. / Lebar gambar mobile tidak boleh kolaps. */
@media(max-width:700px){.feature-grid{align-items:stretch}.feature-art,.feature-copy{width:100%}}
@media(prefers-reduced-motion:reduce){.collage-copy mark::before{transform:none!important}.collage-photo{transform:none!important}.offerings-track{animation:none}.hero-crop,.operations-screens,.feature-product{transform:none}.scene-person{transform:none}.outcome-tabs button{transition:none}}

/* [codex] Keep the source wordmark tight. Only the original arrow geometry lengthens northeast. */
.brand{display:flex;align-items:center;gap:0;width:126px;flex-shrink:0;overflow:visible}
.brand-wordmark{display:block;flex:0 0 102px;width:102px;height:32px;overflow:hidden}
.brand-wordmark img{display:block;width:126px!important;height:32px;max-width:none}
.brand-arrow{display:block;flex:0 0 24px;width:24px;height:24px;overflow:visible;fill:#bdf87a}
.brand-arrow path{d:path('M0 0 L100 0 L100 100 L79.5 100 L79.5 35 L14.5 100 L0 85.5 L65 20.5 L0 20.5 Z');transition:d 320ms cubic-bezier(.22,1,.36,1)}
.headline-mask{display:block;overflow:hidden;padding-bottom:.13em;margin-bottom:-.13em}
.headline-mask [data-motion-line]{display:block}
.number-mask{display:inline-block;overflow:hidden;vertical-align:bottom}
[data-motion-number]{display:inline-block}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .brand:hover .brand-arrow path{d:path('M18 -18 L118 -18 L118 82 L97.5 82 L97.5 17 L14.5 100 L0 85.5 L83 2.5 L18 2.5 Z')}
 .tab .time-track{transition:width 200ms cubic-bezier(.22,1,.36,1)}
}
@media(prefers-reduced-motion:reduce){.brand-arrow path{transition:none}}
/* [codex] Play controls may retain keyboard focus; only card focus switches to manual browsing. */
.offerings[data-running=true]:focus-within .offerings-track{animation-play-state:running}
.offerings[data-running=true]:hover .offerings-track{animation-play-state:paused}
.offer-group[aria-hidden] .offer-card{cursor:pointer}
/* [codex] Compact selectors and a visible continuous timer. / Indikator rapat, progres jelas. */
.carousel-controls .tabs{gap:2px;align-items:center}
.carousel-controls .tab{width:24px;min-width:24px;height:44px}
.carousel-controls .tab[aria-selected=true]{width:52px;min-width:52px}
.carousel-controls .tab .time-track{width:6px;height:6px;background:#bdc5b8;transition:none}
.carousel-controls .tab[aria-selected=true] .time-track{width:44px;background:#dce2d5}
.carousel-controls .tab .time-fill{background:#244a36;transition:none;will-change:transform}
.operation-track,.outcome-track{height:3px}
.outcome-track{top:0;background:transparent}
.outcome-track [data-fill]{background:linear-gradient(90deg,#648b49,#bdf87a);transition:none;will-change:transform}
.operation-track [data-fill]{transition:none;will-change:transform}
.outcome-image[data-active=true]{z-index:2}
.outcome-image[data-leaving=true]{visibility:visible;z-index:1}
.operations-bottom,.outcomes-bottom{display:block}
@media(prefers-reduced-motion:reduce){.carousel-controls .tab[aria-selected=true] .time-fill,.operation-tabs [aria-selected=true] [data-fill],.outcome-tabs [aria-selected=true] [data-fill]{transform:scaleX(1)!important}}
/* [codex] Original editorial family: vivid metaphors, square art and restrained transitions. / Keluarga ilustrasi baru. */
.outcomes-grid{align-items:start}
.outcomes-art{min-height:0;height:auto;aspect-ratio:1;outline:1px solid #0000001a;outline-offset:-1px}
.outcome-image{margin:0}
.outcome-image img{object-fit:contain}
.outcome-tabs h3{font-size:clamp(26px,2.65vw,36px);line-height:1.18;text-wrap:balance}
.outcome-tabs p{text-wrap:pretty;line-height:1.65}
.outcome-tabs button[aria-selected=true] h3{font-weight:500}
.outcome-track [data-fill]{background:linear-gradient(90deg,#b86fea,#f46f50,#e9ac35)}
.outcomes-bottom p,.hero-proof-note,.screen-note,.operations-bottom p,.concept-caption{font-size:12px;line-height:1.6}
.action-0{background:#fff0d1}.action-1{background:#eee3ff}.action-2{background:#d9f1ee}.action-3{background:#ffe4dc}
.action-card img{height:auto;aspect-ratio:1;object-fit:contain}
.action-card p{text-wrap:pretty}
@media(max-width:700px){.outcomes-art{min-height:0;height:auto;aspect-ratio:1}.outcome-tabs h3{font-size:26px}.outcome-tabs p{font-size:15px}.concept-caption{font-size:11px}}
/* [codex] Review 2 Oct: visible heading entrances, varied scenes, one navy closing. / Revisi review. */
.motion-heading .motion-line-mask{display:block;overflow:hidden;padding:.16em .12em;margin:-.16em -.12em}
.motion-heading .motion-line{display:block}
.motion-heading .motion-word{display:inline-block;white-space:nowrap}
.motion-heading .motion-letter{display:inline-block}
.motion-heading .feature-highlight{position:relative;isolation:isolate;background:none;border-color:transparent}
.motion-heading .feature-highlight::before{content:'';position:absolute;inset:0;background:#e1ebd0;border:1px solid #aabd95;border-radius:inherit;z-index:-1;transform-origin:left}
.motion-heading.motion-ready:not(.motion-seen) .motion-line{opacity:0;transform:translateY(100%)}
.motion-heading.motion-ready:not(.motion-seen) .motion-letter{opacity:0;transform:translateY(65%)}
.motion-heading.motion-ready:not(.motion-seen) mark::before,.motion-heading.motion-ready:not(.motion-seen) .feature-highlight::before{transform:scaleX(0)}
.motion-heading.motion-seen .motion-line{transition:opacity 600ms var(--ease-out),transform 600ms var(--ease-out);transition-delay:var(--line-delay,0ms);opacity:1;transform:none}
.motion-heading.motion-seen .motion-letter{transition:opacity 320ms var(--ease-out),transform 320ms var(--ease-out);transition-delay:var(--letter-delay,0ms);opacity:1;transform:none}
.motion-heading.motion-seen mark::before,.motion-heading.motion-seen .feature-highlight::before{transform:scaleX(1);transition:transform 700ms var(--ease-out) 140ms}
.scene-editorial{position:absolute;width:92%;height:auto;aspect-ratio:1;right:0;top:28px;border-radius:24px;object-fit:cover}
.feature-scene[data-kind=product] .scene-backdrop{inset:40px 0 25px 15px;background:#dfd3f5}
.feature-scene[data-kind=product] .feature-product{width:85%;left:3%;top:62px;transform:rotate(-4deg);border-color:#122334}
.feature-scene .feature-companion{position:absolute;right:0;bottom:8px;top:auto;width:46%;border:3px solid #122334;transform:rotate(6deg);z-index:3;border-radius:16px}
.feature-scene[data-kind=illustration] .scene-backdrop{display:none}
.feature-scene[data-kind=illustration] .feature-product{width:52%;top:auto;bottom:5px;left:0;transform:rotate(-4deg)}
.operations-photo{visibility:hidden;z-index:-3;object-position:center 45%}
.operations-photo[data-active=true]{visibility:visible;z-index:-2}
.operations-photo[data-leaving=true]{visibility:visible;z-index:-3}
.operations-copy{display:grid;grid-template-columns:minmax(0,1fr);align-content:start}
.operation-copy{grid-area:1/1;visibility:hidden;pointer-events:none}
.operation-copy[data-active=true]{visibility:visible;pointer-events:auto}
.operation-copy h2{max-width:540px;text-wrap:balance}
.operation-copy p{max-width:455px;font-size:17px;line-height:1.7;margin:26px 0}
.operations-copy>.inline-link{justify-self:start;align-self:start}
.operations::before{background:linear-gradient(90deg,#122334f2 0%,#122334c9 43%,#12233440 75%),linear-gradient(0deg,#122334f5 0%,#12233499 35%,transparent 80%)}
.offer-card img{width:100px;height:100px;margin-bottom:22px}
.next-actions{max-width:none;background:#eee8f6;padding:80px max(24px,calc((100vw - 1328px)/2))}
.next-actions>h2,.next-actions>.action-grid{max-width:1328px;margin-left:auto;margin-right:auto}
.action-card{border:1px solid #12233414}
.closing,.site-footer{background:var(--navy);color:#f7f8f2;max-width:none}
.closing{padding-top:88px;padding-bottom:72px}
.closing>p{color:#c9d4de}
.closing .button{background:var(--lime);color:var(--navy)}
.site-footer{padding-inline:max(32px,calc((100vw - 1344px)/2));border-top:1px solid #ffffff24}
.site-footer .footer-intro p{color:#dce4ec;font-size:16px}
.site-footer h2{color:#aebfcc;font-size:11px}
.site-footer nav>a,.site-footer button{color:#f7f8f2}
.site-footer .footer-intro img{filter:brightness(0) invert(1)}
.cta-arrow{display:block;width:22px;height:22px;flex:0 0 22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:square;overflow:visible}
.cta-arrow path{transition:transform 240ms var(--ease-out);transform-box:view-box}
.cta-arrow-shaft{transform-origin:5px 19px}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 :is(.button,.inline-link):hover .cta-arrow-shaft{transform:scale(1.23)}
 :is(.button,.inline-link):hover .cta-arrow-head{transform:translate(3px,-3px)}
}
@media(max-width:700px){
 .scene-editorial{top:14px;width:95%;border-radius:18px}
 .feature-scene[data-kind=product] .feature-product{top:55px;width:89%;left:1%}
 .feature-scene .feature-companion{bottom:30px;width:50%;right:2%}
 .feature-scene[data-kind=illustration] .feature-product{width:62%;bottom:25px}
 .operation-copy p{font-size:15px;margin:24px 0}
 .operations-photo{object-position:65% center}
 .operations::before{background:linear-gradient(0deg,#122334f5,#122334d9 55%,#122334c9)}
 .next-actions{padding:60px 20px}
 .closing{padding:65px 22px}
 .site-footer{padding:45px 22px}
 .cta-arrow{width:18px;height:18px;flex-basis:18px}
}
@media(prefers-reduced-motion:reduce){
 .motion-heading .motion-line,.motion-heading .motion-letter{opacity:1!important;transform:none!important;transition:none!important}
 .motion-heading mark::before,.motion-heading .feature-highlight::before{transform:none!important;transition:none!important}
 .cta-arrow path{transition:none!important;transform:none!important}
 .feature-scene .feature-companion{transform:none}
}
/* [codex] Final review: tighter timing controls and an explicit language selection. / Review terakhir. */
.carousel-controls .tabs{gap:0}
.carousel-controls .tab{width:24px;min-width:24px;height:44px}
.carousel-controls .tab[aria-selected=true]{width:44px;min-width:44px}
.carousel-controls .tab[aria-selected=true] .time-track{width:36px}
/* [claude] One language button: globe + active code (ID or EN), 44px tall, quieter than the CTA. / Satu tombol bahasa. */
.language-switcher{display:inline-flex;flex-shrink:0}
.language-switcher .language{display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 12px;border:1px solid var(--rule);border-radius:12px;background:transparent;color:var(--soft);font:500 13px/1 Inter,system-ui,sans-serif;letter-spacing:.02em;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color 150ms ease,border-color 150ms ease,scale 150ms ease}
.language-switcher .language svg{width:16px;height:16px;flex-shrink:0;fill:none;stroke:var(--navy);stroke-width:1.4;stroke-linecap:round}
.language-switcher .language .language-now{color:var(--navy);font-weight:600}
@media(hover:hover) and (pointer:fine){.language-switcher .language:hover{background:#1223340a;border-color:#1223343d}}
@media(prefers-reduced-motion:no-preference){.language-switcher .language:active{scale:.96}}
@media(prefers-reduced-motion:reduce){.language-switcher .language{transition:none}}
@media(max-width:400px){.header .utilities{gap:8px}.header{gap:10px}.language-switcher .language{padding:0 9px;gap:5px}}

/* [codex] Preserve the real product canvas; enlarge on demand. / Layar asli utuh dan dapat diperbesar. */
.screen-link{display:block;cursor:zoom-in;border-radius:inherit}
.screen-link:focus-visible{outline:3px solid #bdf87a;outline-offset:5px}
.real-screen{background:#0b1b29}
.real-screen img{object-fit:contain}
.hero-product img,.hero-crop img{height:auto}
.real-workspace-stage{height:565px}
.hero-product{top:48px}
.hero-crop-three{top:315px}
.feature-scene[data-kind=product] .feature-product{width:100%;left:0;top:108px}
.feature-scene .feature-companion{width:70%;bottom:42px}
.feature-scene[data-kind=product] .scene-backdrop{inset:76px 0 24px 15px}
.operations-screens{max-width:550px;height:300px}
@media(max-width:700px){
 .real-workspace-stage{height:320px}
 .hero-product{top:120px}
 .hero-crop-one{top:0}
 .feature-scene[data-kind=product] .feature-product{top:100px;width:98%;left:1%}
 .feature-scene .feature-companion{width:74%;bottom:65px;right:2%}
 .operations-screens{height:190px;margin:35px auto 20px}
}
/* [codex] Active product evidence remains clickable; hidden scenes are inert. / Tautan hanya pada state aktif. */
.feature-scene[data-active=true] .screen-link{pointer-events:auto}
.real-screen .screen-link:focus-visible{outline-offset:-4px}
/* [codex] Keep heading masks inside the page at tablet/mobile widths. / Cegah gulir horizontal. */
.motion-heading .motion-line-mask{margin-inline:0}
/* [claude] The EN hero headline is longer than ID; size it so 'Business moving forward.' stays on one line at desktop widths. Balanced wraps avoid single-word last lines in new headings. / Headline EN muat dua baris; judul dibagi rata. */
@media(min-width:701px){html[lang=en] #hero-title{font-size:clamp(52px,6.8vw,100px)}}
@media(max-width:700px){html[lang=en] #hero-title{font-size:46px}}
@media(max-width:360px){html[lang=en] #hero-title{font-size:40px}}
#hero-title,.onboarding-aside h2,.slide h3,#business-heading,.page-lede{text-wrap:balance}