@charset "UTF-8";
/* Nivelva: Cloud Database. prefix: cd. Panel terminal gelap + aksen oranye brand */
:root{--cd-ink:#0F0F10;--cd-ink2:#1A1A1C;--cd-line:rgba(255,255,255,.10);--cd-dim:rgba(255,255,255,.62);--cd-peach:#FFB38A;--cd-ok:#22C55E;--cd-soft:color-mix(in oklab,var(--line) 12%,transparent)}
.cdHero,.cdEng,.cdPrice,.cdSec,.cdDash,.cdStore,.cdReg,.cdBak,.cdUse,.cdSteps,.cdFaq,.cdCta{overflow:hidden}
.cdKick{display:inline-block;font:700 11.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.cdHead{max-width:760px;margin:0 auto 40px;text-align:center}
.cdH2{font:600 clamp(30px,3.8vw,48px)/1.06 var(--serif);letter-spacing:-.02em;margin:12px 0 0;text-wrap:balance}
.cdH2 em{font-style:italic;color:var(--accent);font-weight:500}
.cdLead{font-size:17px;line-height:1.6;color:var(--ink-2);margin:14px 0 0;text-wrap:pretty}
.cdBtn{background:var(--accent);color:#fff;border-color:var(--accent)}
.cdBtn:hover{color:#fff}
.cdBtn--sm{min-height:40px;padding:9px 16px;font-size:14px}
.cdBtn--wire{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.5)}
.cdBtn--wire:hover{border-color:#fff;color:#fff}
.cdLink{font-weight:700;color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.cdHero code,.cdBak code{font-family:var(--mono);font-size:.92em}

/* hero */
.cdHero{padding:56px 0 76px;background:linear-gradient(180deg,var(--bg),var(--bg-2))}
.cdHero__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:52px;align-items:center}
.cdHero h1{font:600 clamp(38px,5vw,66px)/1.02 var(--serif);letter-spacing:-.025em;margin:16px 0 0;text-wrap:balance}
.cdHero h1 em{font-style:italic;color:var(--accent);font-weight:500}
.cdHero__kick{display:block;margin-bottom:16px}
.cdHero__sub{font-size:18px;line-height:1.6;color:var(--ink-2);margin:18px 0 26px;max-width:34em}
.cdHero__sub b{color:var(--ink)}
.cdHero__cta{display:flex;gap:12px;flex-wrap:wrap}
.cdHero__pts{list-style:none;padding:0;margin:22px 0 0;display:flex;gap:10px;flex-wrap:wrap}
.cdHero__pts li{display:inline-flex;align-items:center;gap:7px;font:700 13px/1 var(--sans);color:var(--ink);padding:8px 12px;border-radius:999px;border:1.5px solid var(--cd-soft);background:rgba(255,255,255,.6)}
.cdHero__pts svg{color:var(--accent)}
.cdHero__logos{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:26px;padding-top:20px;border-top:1.5px solid var(--cd-soft)}
.cdHero__logos span{display:inline-flex;align-items:center;gap:8px;font:700 14px/1 var(--sans);color:var(--ink-2)}

/* terminal */
.cdTerm{background:var(--cd-ink);color:#fff;border-radius:20px;box-shadow:0 30px 70px rgba(0,0,0,.28);overflow:hidden;min-width:0}
.cdTerm__bar{display:flex;align-items:center;gap:7px;padding:13px 16px;border-bottom:1px solid var(--cd-line)}
.cdTerm__bar i{width:11px;height:11px;border-radius:50%;background:#3A3A3E}
.cdTerm__bar i:first-child{background:#FF5F57}.cdTerm__bar i:nth-child(2){background:#FEBC2E}.cdTerm__bar i:nth-child(3){background:#28C840}
.cdTerm__bar span{margin-left:8px;font:500 12px/1 var(--mono);color:var(--cd-dim)}
.cdTerm__eng{display:flex;gap:6px;padding:12px 14px 0;flex-wrap:wrap}
.cdTerm__chip{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:999px;border:1px solid var(--cd-line);background:rgba(255,255,255,.04);color:var(--cd-dim);font:600 12.5px/1 var(--sans);cursor:pointer}
.cdTerm__chip:hover{color:#fff;border-color:rgba(255,255,255,.3)}
.cdTerm__chip.is-on{background:#fff;color:var(--cd-ink);border-color:#fff}
.cdTerm__body{margin:0;padding:18px 18px 22px;min-height:278px;font:500 13.5px/1.7 var(--mono);color:rgba(255,255,255,.88);white-space:pre-wrap;word-break:break-word}
.cdTerm__ps{color:var(--cd-ok)}
.cdTerm__flag{color:var(--cd-peach)}
.cdTerm__cur{display:inline-block;width:8px;height:16px;margin-left:2px;vertical-align:-3px;background:var(--cd-peach);animation:cdBlink 1s steps(1) infinite}
@keyframes cdBlink{50%{opacity:0}}
.cdTerm__ok{color:var(--cd-ok)}
.cdTerm__ok span{color:rgba(255,255,255,.86)}
.cdTerm__uri{color:#9CC8FF;word-break:break-all}
.cdTerm__tot{color:var(--cd-dim)}
.cdTerm__tot b{color:#fff;font-weight:700}
.cdTerm__tot span{color:var(--cd-dim)}

/* engine */
.cdEng{padding:84px 0}
.cdEng__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.cdEngCard{display:flex;flex-direction:column;padding:24px;border-radius:18px;background:#fff;border:1.5px solid var(--cd-soft);box-shadow:0 10px 30px rgba(0,0,0,.05);transition:transform .2s,box-shadow .2s}
.cdEngCard:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(0,0,0,.09)}
.cdEngCard__top{display:flex;align-items:center;gap:14px}
.cdEngCard h3{margin:0;font:700 21px/1.15 var(--serif)}
.cdEngCard__from{margin:4px 0 0;font-size:14px;color:var(--ink-3)}
.cdEngCard__from b{color:var(--ink);font-family:var(--mono)}
.cdEngCard__tag{margin:16px 0 0;font-size:14.5px;line-height:1.55;color:var(--ink-2);flex:1}
.cdEngCard__vers{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.cdEngCard__vers span{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:8px;border:1px solid var(--cd-soft);font:600 12px/1 var(--mono);color:var(--ink-2)}
.cdEngCard__vers span.is-rec{border-color:color-mix(in oklab,var(--accent) 55%,transparent);color:var(--ink)}
.cdEngCard__vers small{font:700 10px/1 var(--sans);text-transform:uppercase;letter-spacing:.05em;color:var(--accent)}
.cdEngCard__note{margin:12px 0 0;font-size:13px;line-height:1.5;color:var(--ink-3)}
.cdEngCard__act{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:20px;padding-top:16px;border-top:1px solid var(--cd-soft)}
.cdEngCard__act .btn{flex:0 0 auto}

/* harga */
.cdPrice{padding:84px 0;background:var(--cd-ink);color:#fff}
.cdPrice .cdH2{color:#fff}
.cdPrice .cdLead{color:var(--cd-dim)}
.cdPrice .cdKick{color:var(--accent-2)}
.cdTabs{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:0 auto 26px}
.cdTab{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;border:1px solid var(--cd-line);background:rgba(255,255,255,.04);color:var(--cd-dim);font:700 14px/1 var(--sans);cursor:pointer}
.cdTab:hover{color:#fff;border-color:rgba(255,255,255,.3)}
.cdTab.is-on{background:#fff;color:var(--cd-ink);border-color:#fff}
.cdPrice__grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:24px;max-width:1180px;margin:0 auto;align-items:start}
.cdPlans{border:1px solid var(--cd-line);border-radius:18px;overflow:hidden;background:rgba(255,255,255,.03)}
.cdPlans__head,.cdPlan__pick{display:grid;grid-template-columns:1.3fr .7fr .8fr 1fr 1.2fr;align-items:center;gap:10px}
.cdPlans__head{padding:14px 20px;font:700 11.5px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--cd-dim);border-bottom:1px solid var(--cd-line)}
.cdPlans__head span:last-child,.cdPlan__p{text-align:right}
.cdPlan{border-bottom:1px solid var(--cd-line)}
.cdPlan__pick{width:100%;padding:18px 20px;background:none;border:0;color:#fff;font:500 15px/1.2 var(--sans);text-align:left;cursor:pointer;transition:background .15s}
.cdPlan__pick:hover{background:rgba(255,255,255,.04)}
.cdPlan.is-on .cdPlan__pick{background:rgba(255,255,255,.08);box-shadow:inset 3px 0 0 var(--accent)}
.cdPlan__name{display:inline-flex;align-items:center;gap:12px}
.cdPlan__name b{font:700 18px/1 var(--serif)}
.cdPlan__c{font-family:var(--mono);color:rgba(255,255,255,.86)}
.cdPlan__p{font-size:13px;color:var(--cd-dim)}
.cdPlan__p b{font:700 16px/1 var(--mono);color:#fff}
.cdBars{display:inline-flex;align-items:flex-end;gap:3px;height:18px}
.cdBars i{width:4px;border-radius:2px;background:rgba(255,255,255,.16)}
.cdBars i:nth-child(1){height:6px}.cdBars i:nth-child(2){height:10px}.cdBars i:nth-child(3){height:14px}.cdBars i:nth-child(4){height:18px}
.cdBars i.is-on{background:var(--accent)}
.cdPlans__st{display:flex;gap:12px;align-items:flex-start;padding:16px 20px;font-size:14px;line-height:1.55;color:var(--cd-dim)}
.cdPlans__st svg{flex-shrink:0;color:var(--cd-peach);margin-top:1px}
.cdPlans__st b{color:#fff}
.cdCalc{padding:22px;border-radius:18px;background:#fff;color:var(--ink);box-shadow:0 24px 60px rgba(0,0,0,.35)}
.cdCalc__t{margin:0 0 14px;font:700 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.cdCalc__row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--cd-soft);font-size:14px;color:var(--ink-3)}
.cdCalc__row b{display:inline-flex;align-items:center;gap:7px;color:var(--ink);text-align:right}
.cdCalc__lbl{display:flex;justify-content:space-between;margin:16px 0 10px;font-size:14px;color:var(--ink-3)}
.cdCalc__lbl b{font:700 15px/1 var(--mono);color:var(--ink)}
.cdRange{-webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:8px;background:linear-gradient(90deg,var(--accent) var(--p,0%),#E5E5E5 var(--p,0%));outline:none;cursor:pointer}
.cdRange::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--accent);box-shadow:0 2px 8px rgba(0,0,0,.2)}
.cdRange::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid var(--accent)}
.cdRange:focus-visible{box-shadow:0 0 0 3px color-mix(in oklab,var(--accent) 35%,transparent)}
.cdRange:disabled{opacity:.4;cursor:not-allowed}
.cdCalc__scale{display:flex;justify-content:space-between;margin-top:8px;font:500 11.5px/1 var(--mono);color:var(--ink-3)}
.cdCalc__regs{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.cdCalc__reg{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:10px;border:1.5px solid var(--cd-soft);background:#fff;font:700 13px/1 var(--sans);color:var(--ink);cursor:pointer}
.cdCalc__reg img{border-radius:2px}
.cdCalc__reg small{font-weight:600;color:var(--ink-3)}
.cdCalc__reg.is-on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.cdCalc__sum{margin-top:16px;padding-top:12px;border-top:1px dashed var(--cd-soft)}
.cdCalc__sum div{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:13.5px;color:var(--ink-3)}
.cdCalc__sum b{font-family:var(--mono);color:var(--ink);font-weight:600}
.cdCalc__tot{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:10px;padding-top:12px;border-top:1.5px solid var(--ink)}
.cdCalc__tot span{font-weight:700}
.cdCalc__tot b{font:700 26px/1 var(--mono);color:var(--ink)}
.cdCalc__go{display:flex;width:100%;margin-top:16px}
.cdCalc__fine{margin:12px 0 0;font-size:12.5px;line-height:1.5;color:var(--ink-3)}

/* keamanan */
.cdSec{padding:84px 0}
.cdSec__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px;max-width:1000px;margin:0 auto}
.cdSec__item{display:flex;gap:16px;padding:24px 0;border-top:1.5px solid var(--cd-soft)}
.cdSec__ic{flex-shrink:0;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:color-mix(in oklab,var(--accent) 12%,transparent);color:var(--accent)}
.cdSec__item b{display:block;font:700 17px/1.3 var(--sans)}
.cdSec__item p{margin:6px 0 0;font-size:14.5px;line-height:1.6;color:var(--ink-2)}

/* dasbor */
.cdDash{padding:84px 0;background:linear-gradient(180deg,var(--bg-2),var(--bg))}
.cdDash__grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:52px;align-items:center}
.cdDash__pts{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:10px}
.cdDash__pts li{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.5;color:var(--ink-2)}
.cdDash__pts svg{flex-shrink:0;color:var(--cd-ok);margin-top:2px}
.cdDash__eng{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.cdDash__eng button{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:999px;border:1.5px solid var(--cd-soft);background:#fff;font:700 13px/1 var(--sans);color:var(--ink-2);cursor:pointer}
.cdDash__eng button.is-on{background:var(--ink);color:#fff;border-color:var(--ink)}
.cdPanel{background:var(--cd-ink);color:#fff;border-radius:20px;padding:20px;box-shadow:0 30px 70px rgba(0,0,0,.25);min-width:0}
.cdPanel__top{display:flex;align-items:center;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--cd-line)}
.cdPanel__top b{display:block;font:700 15px/1.2 var(--mono)}
.cdPanel__top span{display:inline-flex;align-items:center;gap:6px;margin-top:4px;font-size:12.5px;color:var(--cd-dim)}
.cdDot{width:8px;height:8px;border-radius:50%;background:var(--cd-ok);box-shadow:0 0 0 3px rgba(34,197,94,.2)}
.cdPanel__tabs{display:flex;gap:4px;margin:14px 0;padding:4px;border-radius:12px;background:rgba(255,255,255,.05);overflow-x:auto;scrollbar-width:none}
.cdPanel__tabs::-webkit-scrollbar{display:none}
.cdPanel__tabs button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 10px;border:0;border-radius:9px;background:none;color:var(--cd-dim);font:700 13px/1 var(--sans);cursor:pointer;white-space:nowrap}
.cdPanel__tabs button.is-on{background:rgba(255,255,255,.12);color:#fff}
.cdPanel__body{min-height:262px}
.cdKv{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.cdKv div{padding:10px 12px;border-radius:10px;border:1px solid var(--cd-line);min-width:0}
.cdKv div:first-child{grid-column:1/-1}
.cdKv dt{font:600 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--cd-dim)}
.cdKv dd{margin:6px 0 0;font:600 13.5px/1.3 var(--mono);color:#fff;display:flex;justify-content:space-between;align-items:center;gap:8px;overflow-wrap:anywhere}
.cdKv__btn{display:inline-flex;align-items:center;gap:4px;font:700 11.5px/1 var(--sans);color:var(--cd-peach)}
.cdFmt{display:flex;align-items:center;gap:6px;margin-top:14px}
.cdFmt button{padding:7px 12px;border-radius:8px;border:1px solid var(--cd-line);background:none;color:var(--cd-dim);font:700 12.5px/1 var(--mono);cursor:pointer}
.cdFmt button.is-on{background:#fff;color:var(--cd-ink);border-color:#fff}
.cdCopy{margin-left:auto;display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:8px;border:1px solid var(--cd-line);background:rgba(255,255,255,.06);color:#fff;font:700 12.5px/1 var(--sans);cursor:pointer}
.cdSnip{margin:10px 0 0;padding:14px 16px;border-radius:12px;background:rgba(0,0,0,.4);border:1px solid var(--cd-line);font:500 12.5px/1.65 var(--mono);color:#9CC8FF;white-space:pre-wrap;word-break:break-all}
.cdMeter{padding:14px;border-radius:12px;border:1px solid var(--cd-line)}
.cdMeter__row{display:flex;justify-content:space-between;font-size:13.5px;color:var(--cd-dim)}
.cdMeter__row b{color:#fff;font-family:var(--mono)}
.cdMeter__bar{position:relative;height:10px;border-radius:10px;background:rgba(255,255,255,.12);margin:12px 0 8px}
.cdMeter__bar i{display:block;height:100%;border-radius:10px;background:linear-gradient(90deg,var(--accent),var(--accent-2))}
.cdMeter__bar em{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--cd-peach)}
.cdMeter__lg{display:flex;justify-content:space-between;font:500 11px/1 var(--mono);color:var(--cd-dim)}
.cdMeter__lg .is-w{color:var(--cd-peach);margin-left:auto;margin-right:12px}
.cdPanel__note{margin:14px 0 0;font-size:13.5px;line-height:1.55;color:var(--cd-dim)}
.cdPanel__btn{display:inline-flex;align-items:center;gap:7px;margin-top:14px;padding:9px 14px;border-radius:10px;background:var(--accent);color:#fff;font:700 13px/1 var(--sans)}
.cdPanel__lbl{margin:0 0 10px;font:700 11.5px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--cd-dim)}
.cdStats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.cdStats div{position:relative;padding:12px;border-radius:12px;border:1px solid var(--cd-line)}
.cdStats span{display:block;font-size:12.5px;color:var(--cd-dim)}
.cdStats b{display:block;margin-top:6px;font:700 20px/1 var(--mono)}
.cdStats i{display:block;height:5px;margin-top:10px;border-radius:5px;background:linear-gradient(90deg,var(--accent) var(--w),rgba(255,255,255,.12) var(--w))}
.cdAllow{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.cdAllow li{display:flex;justify-content:space-between;gap:10px;padding:11px 12px;border-radius:10px;border:1px solid var(--cd-line);font-size:13px;color:var(--cd-dim)}
.cdAllow code{font:600 13.5px/1.2 var(--mono);color:#fff}
.cdPanel__fine{margin:14px 0 0;font-size:11.5px;color:rgba(255,255,255,.4)}

/* storage aman */
.cdStore{padding:84px 0}
.cdStore__track{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;max-width:1040px;margin:0 auto}
.cdStore__track::before{content:"";position:absolute;top:27px;left:8%;right:8%;height:4px;border-radius:4px;background:linear-gradient(90deg,var(--cd-ok),var(--accent-2) 55%,var(--accent))}
.cdStore__step{position:relative;text-align:center;padding:0 8px}
.cdStore__ic{position:relative;display:grid;place-items:center;width:58px;height:58px;margin:0 auto 16px;border-radius:50%;background:#fff;border:3px solid var(--cd-ok);color:var(--cd-ok)}
.cdStore__step.is-1 .cdStore__ic{border-color:var(--accent-2);color:#B7791F}
.cdStore__step.is-2 .cdStore__ic{border-color:var(--accent);color:var(--accent)}
.cdStore__step b{display:block;font:700 18px/1.2 var(--serif)}
.cdStore__step p{margin:8px auto 0;max-width:26em;font-size:14.5px;line-height:1.55;color:var(--ink-2)}

/* lokasi */
.cdReg{padding:84px 0;background:var(--bg-2)}
.cdReg__grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:52px;align-items:center}
.cdReg__list{list-style:none;margin:0;padding:0;border-radius:18px;background:#fff;border:1.5px solid var(--cd-soft);overflow:hidden}
.cdReg__row{display:flex;align-items:center;gap:16px;padding:18px 20px;border-bottom:1px solid var(--cd-soft)}
.cdReg__row:last-child{border-bottom:0}
.cdReg__flag{width:36px;height:27px;border-radius:4px;object-fit:cover;box-shadow:0 0 0 1px rgba(0,0,0,.08);flex-shrink:0}
.cdReg__city{flex:1;min-width:0}
.cdReg__city b{display:block;font:700 17px/1.2 var(--sans)}
.cdReg__city>span{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:4px;font-size:13px;color:var(--ink-3)}
.cdReg__side{display:flex;flex-direction:column;align-items:flex-end;gap:5px;text-align:right}
.cdReg__side small{font-size:12px;color:var(--ink-3)}
.cdReg__row.is-full,.cdReg__row.is-soon{opacity:.86}
.cdPill{display:inline-block;padding:5px 10px;border-radius:999px;font:700 11.5px/1 var(--sans);white-space:nowrap}
.cdPill--ok{background:rgba(34,197,94,.14);color:#15803D}
.cdPill--full{background:#111;color:#fff}
.cdPill--soon{background:#E5E5E5;color:#555}
.cdEpyc{display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border-radius:999px;background:#111;color:#fff;font:700 10.5px/1 var(--sans);letter-spacing:.04em}
.cdEpyc img{display:block}

/* backup */
.cdBak{padding:84px 0}
.cdBak__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:820px;margin:0 auto}
.cdBakCard{padding:26px;border-radius:18px;background:#fff;border:1.5px solid var(--cd-soft);box-shadow:0 10px 30px rgba(0,0,0,.05)}
.cdBakCard__ic{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:color-mix(in oklab,var(--accent) 12%,transparent);color:var(--accent)}
.cdBakCard h3{margin:16px 0 0;font:700 22px/1.15 var(--serif)}
.cdBakCard p{margin:8px 0 0;font-size:14.5px;line-height:1.55;color:var(--ink-2)}
.cdBakCard .cdBakCard__p{margin-top:16px;padding-top:14px;border-top:1px solid var(--cd-soft);font-size:14px;color:var(--ink-3)}
.cdBakCard__p b{font:700 24px/1 var(--mono);color:var(--ink)}
.cdBak__note{max-width:820px;margin:20px auto 0;text-align:center;font-size:14px;line-height:1.6;color:var(--ink-3)}

/* cocok untuk */
.cdUse{padding:84px 0;background:var(--bg-2)}
.cdUse__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 36px;max-width:1180px;margin:0 auto}
.cdUse__item{display:flex;gap:14px;padding:22px 0;border-top:1.5px solid var(--cd-soft)}
.cdUse__ic{flex-shrink:0;width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:#fff;border:1.5px solid var(--cd-soft);color:var(--accent)}
.cdUse__item b{display:block;font:700 16.5px/1.3 var(--sans)}
.cdUse__item p{margin:6px 0 0;font-size:14.5px;line-height:1.55;color:var(--ink-2)}
.cdUse__eng{display:flex;gap:8px;margin-top:10px}

/* cara kerja */
.cdSteps{padding:84px 0}
.cdSteps__row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;max-width:1040px;margin:0 auto}
.cdSteps__it{position:relative;padding:26px;border-radius:18px;background:#fff;border:1.5px solid var(--cd-soft)}
.cdSteps__ic{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:var(--cd-ink);color:var(--cd-peach)}
.cdSteps__it b{display:block;margin-top:16px;font:700 19px/1.2 var(--serif)}
.cdSteps__it p{margin:8px 0 0;font-size:14.5px;line-height:1.55;color:var(--ink-2)}

/* faq */
.cdFaq{padding:84px 0;background:var(--bg-2)}
.cdFaq__grid{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:52px;align-items:start}
.cdFaq__wa{display:flex;gap:12px;align-items:center;margin-top:26px;padding:16px 18px;border-radius:16px;background:#fff;border:1.5px solid var(--cd-soft);color:var(--ink);max-width:340px}
.cdFaq__wa svg{color:#16A34A;flex-shrink:0}
.cdFaq__wa b{display:block;font-size:15px}
.cdFaq__wa span{font-size:13.5px;color:var(--ink-3)}
.cdFaq__list{border-top:1.5px solid var(--cd-soft)}
.cdFaq__it{border-bottom:1.5px solid var(--cd-soft)}
.cdFaq__q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;background:none;border:0;text-align:left;font:700 16.5px/1.35 var(--sans);color:var(--ink);cursor:pointer}
.cdFaq__q i{position:relative;flex-shrink:0;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--cd-soft)}
.cdFaq__q i::before,.cdFaq__q i::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:2px;margin:-1px 0 0 -5px;background:var(--ink);transition:transform .2s}
.cdFaq__q i::after{transform:rotate(90deg)}
.cdFaq__it.is-on .cdFaq__q i{background:var(--accent);border-color:var(--accent)}
.cdFaq__it.is-on .cdFaq__q i::before{background:#fff}
.cdFaq__it.is-on .cdFaq__q i::after{transform:rotate(0);background:#fff}
.cdFaq__a p{margin:0 0 18px;font-size:15px;line-height:1.65;color:var(--ink-2);max-width:46em}

/* cta */
.cdCta{padding:84px 0}
.cdCta__box{max-width:1000px;margin:0 auto;padding:56px 40px;border-radius:26px;background:var(--cd-ink);color:#fff;text-align:center;box-shadow:0 30px 70px rgba(0,0,0,.2)}
.cdCta__box h2{margin:0;font:600 clamp(30px,3.6vw,46px)/1.08 var(--serif);letter-spacing:-.02em;text-wrap:balance}
.cdCta__box h2 em{font-style:italic;color:var(--cd-peach);font-weight:500}
.cdCta__box p{margin:14px auto 0;max-width:36em;font-size:16.5px;line-height:1.6;color:var(--cd-dim)}
.cdCta__btns{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:26px}

/* responsif */
@media (max-width:1100px){
  .cdEng__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cdPrice__grid{grid-template-columns:minmax(0,1fr)}
  .cdCalc{max-width:560px;width:100%;margin:0 auto}
}
@media (max-width:900px){
  .cdHero__grid,.cdDash__grid,.cdReg__grid,.cdFaq__grid{grid-template-columns:minmax(0,1fr);gap:36px}
  .cdUse__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cdFaq__wa{max-width:none}
}
@media (max-width:720px){
  .cdHero{padding:36px 0 52px}
  .cdEng,.cdPrice,.cdSec,.cdDash,.cdStore,.cdReg,.cdBak,.cdUse,.cdSteps,.cdFaq,.cdCta{padding:56px 0}
  .cdHead{margin-bottom:28px}
  .cdLead{font-size:15.5px}
  .cdHero__sub{font-size:16px}
  .cdHero__cta{display:grid;grid-template-columns:1fr 1fr}
  .cdHero__pts{gap:6px}
  .cdHero__pts li{padding:7px 10px;font-size:12px}
  .cdHero__logos{gap:10px 16px}
  .cdHero__logos span{font-size:13px}
  .cdTerm__body{min-height:300px;font-size:12px;padding:14px}
  .cdEng__grid{grid-template-columns:minmax(0,1fr);gap:12px}
  .cdEngCard{padding:18px}
  .cdSec__list,.cdUse__grid{grid-template-columns:minmax(0,1fr)}
  .cdSec__item{padding:18px 0}
  .cdPlans__head{display:none}
  .cdPlan__pick{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 8px;padding:16px}
  .cdPlan__name{grid-column:1/3}
  .cdPlan__p{grid-column:3;grid-row:1}
  .cdPlan__c{font-size:13px}
  .cdPlan__c::before{content:attr(data-l);display:block;margin-bottom:4px;font:600 10.5px/1 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--cd-dim)}
  .cdPlans__st{padding:14px 16px;font-size:13px}
  .cdCalc{padding:18px}
  .cdCalc__tot b{font-size:22px}
  .cdPanel{padding:14px}
  .cdPanel__tabs button{padding:9px 8px;font-size:12px}
  .cdPanel__tabs button svg{display:none}
  .cdStore__track{grid-template-columns:minmax(0,1fr);gap:0}
  .cdStore__track::before{top:20px;bottom:20px;left:28px;right:auto;width:4px;height:auto;background:linear-gradient(180deg,var(--cd-ok),var(--accent-2) 55%,var(--accent))}
  .cdStore__step{display:grid;grid-template-columns:58px minmax(0,1fr);gap:4px 14px;text-align:left;padding:0 0 22px}
  .cdStore__ic{grid-row:1/3;margin:0}
  .cdStore__step b{align-self:end}
  .cdStore__step p{margin:0;max-width:none}
  .cdReg__row{padding:14px 16px;gap:12px}
  .cdBak__grid{grid-template-columns:minmax(0,1fr);gap:12px}
  .cdBakCard{padding:20px}
  .cdSteps__row{grid-template-columns:minmax(0,1fr);gap:12px}
  .cdSteps__it{display:grid;grid-template-columns:52px minmax(0,1fr);gap:2px 14px;padding:18px}
  .cdSteps__ic{grid-row:1/3}
  .cdSteps__it b{margin:0;align-self:end}
  .cdSteps__it p{margin:0}
  .cdFaq__q{font-size:15.5px;padding:16px 0}
  .cdCta__box{padding:38px 20px;border-radius:20px}
}
@media (max-width:380px){
  .cdHero__cta{grid-template-columns:1fr}
  .cdKv{grid-template-columns:minmax(0,1fr)}
  .cdTerm__chip{padding:6px 9px;font-size:12px}
}
@media (prefers-reduced-motion:reduce){.cdTerm__cur{animation:none}.cdEngCard{transition:none}}

/* perbaikan setelah QA */
.cdTick{display:inline-block;width:12px;height:12px;margin-right:8px;vertical-align:-1px}
.cdTerm__chip img,.cdTab img{box-sizing:content-box;padding:2px;border-radius:50%;background:#fff}
.cdTerm__chip.is-on img,.cdTab.is-on img{padding:0;background:none}
.cdBakCard{display:flex;flex-direction:column}
.cdBakCard .cdBakCard__p{margin-top:auto;padding-top:14px}
.cdBakCard p:not(.cdBakCard__p){margin-bottom:16px}
@media (max-width:720px){
  .cdEng__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .cdEngCard{padding:16px 14px}
  .cdEngCard__top{flex-direction:column;align-items:flex-start;gap:10px}
  .cdEngCard__top img{width:34px;height:34px}
  .cdEngCard h3{font-size:18px}
  .cdEngCard__from{font-size:13px}
  .cdEngCard__tag,.cdEngCard__vers,.cdEngCard__note,.cdEngCard__act .cdLink{display:none}
  .cdEngCard__act{margin-top:14px;padding-top:0;border-top:0}
  .cdEngCard__act .btn{flex:1;width:100%;padding:9px 8px;font-size:13px}
}
.cdHero h1,.cdH2,.cdCta__box h2,.cdPlan__name b,.cdBakCard h3,.cdStore__step b{font-variant-numeric:lining-nums}

/* hero: kartu fakta + engine (desain ulang 3 Nov) */
.cdHero__cta .btn{gap:8px}
.cdHero__card{margin-top:28px;max-width:560px;border-radius:18px;background:#fff;border:1.5px solid var(--cd-soft);box-shadow:0 14px 36px rgba(0,0,0,.06);overflow:hidden}
.cdFacts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.cdFacts li{display:flex;align-items:center;gap:11px;padding:16px 16px;min-width:0}
.cdFacts li+li{border-left:1px solid var(--cd-soft)}
.cdFacts__ic{flex-shrink:0;display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:color-mix(in oklab,var(--accent) 12%,transparent);color:var(--accent)}
.cdFacts b{display:block;font:700 16px/1.15 var(--sans);color:var(--ink);white-space:nowrap}
.cdFacts small{display:block;margin-top:3px;font-size:12.5px;line-height:1.3;color:var(--ink-3)}
.cdHero__eng{display:flex;align-items:center;gap:14px;padding:12px 16px;border-top:1px solid var(--cd-soft)}
.cdHero__engL{flex-shrink:0;font:700 10.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.cdHero__engs{display:flex;flex-wrap:wrap;gap:6px}
.cdHero__e{display:inline-flex;align-items:center;gap:7px;padding:6px 11px 6px 7px;border-radius:999px;border:1px solid var(--cd-soft);font:700 13px/1 var(--sans);color:var(--ink-2)}
.cdHero__e img{width:20px;height:20px}
@media (max-width:900px){.cdHero__card{max-width:none}}
@media (max-width:720px){
  .cdHero__card{margin-top:22px}
  .cdFacts li{flex-direction:column;align-items:flex-start;gap:8px;padding:14px 12px}
  .cdFacts__ic{width:32px;height:32px;border-radius:9px}
  .cdFacts__ic svg{width:16px;height:16px}
  .cdFacts b{font-size:14.5px}
  .cdFacts small{font-size:11.5px}
  .cdHero__eng{flex-direction:column;align-items:flex-start;gap:10px;padding:12px}
  .cdHero__engs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  .cdHero__e{justify-content:flex-start}
}

/* kartu engine: versi elegan (3 Nov) */
.cdSr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cdEngCard--postgres{--eg:#336791}.cdEngCard--mysql{--eg:#00758F}.cdEngCard--mariadb{--eg:#C0765A}.cdEngCard--mongo{--eg:#13AA52}
.cdEngCard{position:relative;padding:26px 24px 22px;border-radius:20px;border:1px solid color-mix(in oklab,var(--line) 10%,transparent);box-shadow:0 1px 2px rgba(0,0,0,.04),0 12px 32px rgba(0,0,0,.05);overflow:hidden;background:#fff}
.cdEngCard::before{content:"";position:absolute;inset:0 0 auto 0;height:120px;background:radial-gradient(120% 100% at 0% 0%,color-mix(in oklab,var(--eg) 13%,transparent),transparent 70%);pointer-events:none}
.cdEngCard::after{content:"";position:absolute;left:24px;right:24px;top:0;height:3px;border-radius:0 0 3px 3px;background:var(--eg);opacity:.85}
.cdEngCard:hover{transform:translateY(-4px);border-color:color-mix(in oklab,var(--eg) 40%,transparent);box-shadow:0 2px 4px rgba(0,0,0,.04),0 22px 48px color-mix(in oklab,var(--eg) 18%,transparent)}
.cdEngCard>*{position:relative}
.cdEngCard__top{display:flex;align-items:center;gap:14px}
.cdEngCard__logo{display:grid;place-items:center;width:54px;height:54px;border-radius:16px;background:#fff;box-shadow:0 0 0 1px color-mix(in oklab,var(--eg) 22%,transparent),0 6px 16px color-mix(in oklab,var(--eg) 16%,transparent)}
.cdEngCard h3{font:600 24px/1.1 var(--serif);letter-spacing:-.01em}
.cdEngCard__tag{margin:16px 0 0;font-size:14.5px;line-height:1.6;color:var(--ink-2);flex:1}
.cdEngCard__vers{gap:6px;margin-top:18px}
.cdEngCard__vers>span{gap:6px;padding:6px 10px;border-radius:999px;border:1px solid color-mix(in oklab,var(--line) 14%,transparent);background:none;font:600 12px/1 var(--mono);color:var(--ink-3)}
.cdEngCard__vers>span.is-rec{border-color:var(--ink);background:var(--ink);color:#fff}
.cdEngCard__vers>span i{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px color-mix(in oklab,var(--accent) 30%,transparent)}
.cdEngCard__note{margin:12px 0 0;font-size:12.5px;line-height:1.4;color:var(--ink-3)}
.cdEngCard__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-top:20px;padding-top:18px;border-top:1px solid color-mix(in oklab,var(--line) 10%,transparent)}
.cdEngCard__price{display:flex;align-items:baseline;gap:5px;flex-wrap:wrap;min-width:0}
.cdEngCard__price small{font-size:12.5px;color:var(--ink-3)}
.cdEngCard__price b{font:700 22px/1 var(--mono);letter-spacing:-.02em;color:var(--ink)}
.cdEngCard__go{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;padding:10px 14px;border-radius:12px;background:var(--ink);color:#fff;font:700 14px/1 var(--sans);transition:background .2s,transform .2s}
.cdEngCard__go:hover{background:var(--accent);color:#fff}
.cdEngCard__go svg{transition:transform .2s}
.cdEngCard__go:hover svg{transform:translateX(3px)}
.cdEngCard__cmp{display:inline-block;margin-top:12px;font:600 13px/1.2 var(--sans);color:var(--ink-3);text-decoration:none;border-bottom:1px dashed color-mix(in oklab,var(--line) 30%,transparent);align-self:flex-start}
.cdEngCard__cmp:hover{color:var(--accent);border-color:var(--accent)}
@media (max-width:1100px) and (min-width:721px){.cdEngCard__price b{font-size:20px}}
@media (max-width:720px){
  .cdEngCard{padding:18px 14px 16px;border-radius:16px}
  .cdEngCard::after{left:14px;right:14px}
  .cdEngCard__top{flex-direction:column;align-items:flex-start;gap:10px}
  .cdEngCard__logo{width:44px;height:44px;border-radius:13px}
  .cdEngCard__logo img{width:28px;height:28px}
  .cdEngCard h3{font-size:19px}
  .cdEngCard__tag,.cdEngCard__vers,.cdEngCard__note,.cdEngCard__cmp{display:none}
  .cdEngCard__foot{flex-direction:column;align-items:stretch;gap:10px;margin-top:12px;padding-top:12px}
  .cdEngCard__price b{font-size:17px}
  .cdEngCard__go{justify-content:center;padding:10px}
}
.cdEngCard__vers .cdSr{padding:0;border:0;margin:0}
.cdEngCard__go,.cdEngCard__go:hover{text-decoration:none}
.cdEngCard__vers{flex-wrap:nowrap;gap:5px}
.cdEngCard__vers>span{padding:6px 8px;white-space:nowrap}
.cdEngCard::after{left:0;right:0;border-radius:0}
@media (max-width:720px){
  .cdEngCard__price{display:grid;grid-template-columns:auto 1fr;align-items:baseline;column-gap:3px}
  .cdEngCard__price small:first-child{grid-column:1/-1;margin-bottom:4px}
}
@media (max-width:1290px){.cdEngCard__vers{flex-wrap:wrap}}

/* keamanan: alur 4 lapis (desain ulang 3 Nov) */
.cdSec{padding:76px 0}
.cdSec__grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:56px;align-items:center;max-width:1180px;margin:0 auto}
.cdSec__copy .cdLead{max-width:30em}
.cdSec__quote{margin:26px 0 0;padding-left:16px;border-left:3px solid var(--accent);font:italic 500 19px/1.45 var(--serif);color:var(--ink);max-width:24em}
.cdGate{position:relative;padding:22px;border-radius:22px;background:var(--cd-ink);color:#fff;box-shadow:0 30px 70px rgba(0,0,0,.22)}
.cdGate__node{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid var(--cd-line);font:700 13px/1 var(--mono);color:rgba(255,255,255,.9)}
.cdGate__node svg{color:var(--cd-peach)}
.cdGate__node--db{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.35)}
.cdGate__node--db svg{color:var(--cd-ok)}
.cdGate__ok{margin-left:6px;padding:4px 8px;border-radius:999px;background:var(--cd-ok);color:#06210F;font:800 10.5px/1 var(--sans);text-transform:uppercase;letter-spacing:.06em}
.cdGate__list{position:relative;list-style:none;margin:10px 0;padding:0 0 0 22px}
.cdGate__list::before{content:"";position:absolute;left:21px;top:-10px;bottom:-10px;width:2px;background:linear-gradient(180deg,var(--cd-peach),var(--accent) 50%,var(--cd-ok))}
.cdGate__it{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:14px;margin-left:18px;padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid var(--cd-line);transition:background .2s,border-color .2s}
.cdGate__it+.cdGate__it{margin-top:8px}
.cdGate__it::before{content:"";position:absolute;left:-23px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:var(--cd-ink);border:2px solid var(--cd-peach)}
.cdGate__it:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.2)}
.cdGate__ic{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(255,179,138,.12);color:var(--cd-peach)}
.cdGate__tx b{display:block;font:700 15.5px/1.2 var(--sans)}
.cdGate__tx p{margin:4px 0 0;font-size:13.5px;line-height:1.45;color:var(--cd-dim)}
.cdGate__no{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(239,68,68,.12);color:#FCA5A5;font:700 11.5px/1 var(--sans);white-space:nowrap}
.cdGate__no i{position:relative;width:10px;height:10px}
.cdGate__no i::before,.cdGate__no i::after{content:"";position:absolute;left:0;top:4px;width:10px;height:2px;border-radius:2px;background:currentColor;transform:rotate(45deg)}
.cdGate__no i::after{transform:rotate(-45deg)}
@media (max-width:900px){.cdSec__grid{grid-template-columns:minmax(0,1fr);gap:30px}}
@media (max-width:720px){
  .cdSec{padding:56px 0}
  .cdSec__quote{font-size:17px;margin-top:18px}
  .cdGate{padding:16px;border-radius:18px}
  .cdGate__list{padding-left:14px}
  .cdGate__list::before{left:15px}
  .cdGate__it{grid-template-columns:36px minmax(0,1fr);gap:4px 12px;margin-left:12px;padding:12px}
  .cdGate__it::before{left:-17px}
  .cdGate__ic{width:36px;height:36px;grid-row:1/3}
  .cdGate__no{grid-column:2;justify-self:start;margin-top:6px;padding:5px 9px;font-size:11px}
}

/* footer kartu engine (desain ulang 3 Nov) */
.cdEngCard__foot{display:block;margin-top:20px;padding-top:16px}
.cdEngCard__row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cdEngCard__row small{font:700 10.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.cdEngCard a.cdEngCard__cmp{display:inline-flex;align-items:center;gap:4px;margin:0;border:0;font:700 12.5px/1 var(--sans);color:var(--ink-3);text-decoration:none}
.cdEngCard a.cdEngCard__cmp:hover{color:var(--eg)}
.cdEngCard__price{display:flex;align-items:baseline;gap:3px;margin:8px 0 0;white-space:nowrap}
.cdEngCard__price b{font:700 26px/1 var(--mono);letter-spacing:-.03em;color:var(--ink)}
.cdEngCard__price span{font-size:13.5px;font-weight:600;color:var(--ink-3)}
.cdEngCard a.cdEngCard__go{display:flex;justify-content:center;width:100%;margin-top:16px;padding:12px 14px;border-radius:12px;background:var(--ink);color:#fff;font:700 14px/1 var(--sans);text-decoration:none;transition:background .2s,box-shadow .2s}
.cdEngCard a.cdEngCard__go:hover{background:var(--eg);box-shadow:0 10px 24px color-mix(in oklab,var(--eg) 35%,transparent)}
@media (max-width:1290px) and (min-width:721px){.cdEngCard__price b{font-size:23px}}
@media (max-width:720px){
  .cdEngCard__foot{margin-top:12px;padding-top:12px}
  .cdEngCard a.cdEngCard__cmp{display:none}
  .cdEngCard__price{display:flex;margin-top:6px}
  .cdEngCard__price b{font-size:18px}
  .cdEngCard__price span{font-size:12px}
  .cdEngCard a.cdEngCard__go{margin-top:12px;padding:10px 8px;font-size:12.5px;gap:4px}
  .cdEngCard a.cdEngCard__go svg{display:none}
  .cdGate__ic{align-self:start}
}

/* lokasi: pita gelap + ubin (desain ulang 3 Nov) */
.cdReg{padding:72px 0;background:var(--cd-ink);color:#fff}
.cdReg .cdH2{color:#fff}
.cdReg .cdKick{color:var(--accent-2)}
.cdReg .cdLead{color:var(--cd-dim);margin:0;max-width:30em}
.cdReg__head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px;align-items:end;margin-bottom:32px}
.cdReg__tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.cdRegT{display:flex;flex-direction:column;padding:20px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid var(--cd-line);min-width:0;transition:border-color .2s,background .2s}
.cdRegT:hover{border-color:rgba(255,255,255,.22)}
.cdRegT.is-ok{background:linear-gradient(160deg,rgba(34,197,94,.14),rgba(255,255,255,.03) 60%);border-color:rgba(34,197,94,.45)}
.cdRegT.is-full .cdRegT__flag,.cdRegT.is-soon .cdRegT__flag{filter:saturate(.6);opacity:.85}
.cdRegT__top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cdRegT__flag{width:30px;height:22px;border-radius:4px;object-fit:cover;box-shadow:0 0 0 1px rgba(255,255,255,.15)}
.cdRegT__st{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;font:700 11px/1 var(--sans);white-space:nowrap}
.cdRegT__st--ok{background:rgba(34,197,94,.16);color:#86EFAC}
.cdRegT__st--ok i{width:7px;height:7px;border-radius:50%;background:var(--cd-ok);animation:cdPulse 1.8s ease-out infinite}
@keyframes cdPulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.6)}100%{box-shadow:0 0 0 8px rgba(34,197,94,0)}}
.cdRegT__st--full{background:#fff;color:#111}
.cdRegT__st--soon{background:rgba(255,255,255,.1);color:rgba(255,255,255,.7)}
.cdRegT__city{display:block;margin-top:18px;font:600 22px/1.1 var(--serif)}
.cdRegT__sub{display:block;margin-top:5px;font-size:13px;line-height:1.4;color:var(--cd-dim)}
.cdRegT__foot{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:16px}
.cdRegT__fee{font:600 12px/1.2 var(--mono);color:rgba(255,255,255,.7)}
.cdRegT.is-ok .cdRegT__fee{color:#86EFAC}
.cdRegT .cdEpyc{border:1px solid rgba(255,255,255,.25)}
/* kurangi latar krem: section ini putih */
.cdDash,.cdUse,.cdFaq{background:#fff}
.cdUse__ic{background:var(--bg)}
.cdFaq__wa{background:var(--bg)}
@media (max-width:1100px){.cdReg__tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){
  .cdReg{padding:52px 0}
  .cdReg__head{grid-template-columns:minmax(0,1fr);gap:12px;margin-bottom:22px}
  .cdReg__tiles{gap:10px}
  .cdRegT{padding:14px;border-radius:14px}
  .cdRegT__city{margin-top:14px;font-size:18px}
  .cdRegT__sub{font-size:12px}
  .cdRegT__foot{padding-top:12px}
  .cdRegT__st{padding:4px 7px;font-size:10.5px}
}
@media (prefers-reduced-motion:reduce){.cdRegT__st--ok i{animation:none}}

/* backup: panel interaktif + linimasa titik pulih (desain ulang 3 Nov) */
.cdBak{padding:72px 0;background:#fff}
.cdBak__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center;max-width:1180px;margin:0 auto}
.cdBak__pts{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:10px}
.cdBak__pts li{display:flex;align-items:center;gap:10px;font-size:15px;color:var(--ink-2)}
.cdBak__pts svg{flex-shrink:0;color:var(--accent)}
.cdBakP{padding:24px;border-radius:22px;background:var(--cd-ink);color:#fff;box-shadow:0 30px 70px rgba(0,0,0,.22)}
.cdBakP__seg{display:inline-flex;padding:4px;border-radius:12px;background:rgba(255,255,255,.07)}
.cdBakP__seg button{padding:9px 16px;border:0;border-radius:9px;background:none;color:var(--cd-dim);font:700 13.5px/1 var(--sans);cursor:pointer}
.cdBakP__seg button.is-on{background:#fff;color:var(--cd-ink)}
.cdBakP__price{display:flex;align-items:baseline;gap:4px;margin-top:20px}
.cdBakP__price b{font:700 38px/1 var(--mono);letter-spacing:-.03em}
.cdBakP__price span{font-size:14px;color:var(--cd-dim)}
.cdBakP__desc{margin:8px 0 0;font-size:14.5px;color:var(--cd-dim)}
.cdBakP__tl{margin-top:22px;padding:16px;border-radius:14px;border:1px solid var(--cd-line);background:rgba(255,255,255,.03)}
.cdBakP__dots{display:grid;grid-template-columns:repeat(30,minmax(0,1fr));gap:3px;align-items:end;height:34px}
.cdBakP__dots i{height:8px;border-radius:3px;background:rgba(255,255,255,.1);transition:height .25s,background .25s}
.cdBakP__dots i.is-d{height:34px;background:linear-gradient(180deg,var(--cd-peach),var(--accent))}
.cdBakP__dots i.is-w{height:22px;background:var(--accent-2)}
.cdBakP__axis{position:relative;display:flex;justify-content:space-between;margin-top:9px;font:500 10.5px/1 var(--mono);color:var(--cd-dim)}
.cdBakP__axis span:nth-child(2){position:absolute;left:23.3%;transform:translateX(-50%)}
.cdBakP__lg{display:flex;gap:16px;margin-top:12px;font-size:12.5px;color:var(--cd-dim)}
.cdBakP__lg span{display:inline-flex;align-items:center;gap:6px}
.cdBakP__lg i{width:10px;height:10px;border-radius:3px}
.cdBakP__lg i.is-d{background:var(--accent)}
.cdBakP__lg i.is-w{background:var(--accent-2)}
.cdBakP__fine{margin:14px 0 0;padding-top:14px;border-top:1px solid var(--cd-line);font-size:12.5px;line-height:1.5;color:rgba(255,255,255,.55)}
.cdBakP__fine code{font-family:var(--mono);color:rgba(255,255,255,.8)}
@media (max-width:900px){.cdBak__grid{grid-template-columns:minmax(0,1fr);gap:28px}}
@media (max-width:720px){
  .cdBak{padding:52px 0}
  .cdBak__pts li{font-size:14px;align-items:flex-start}
  .cdBakP{padding:18px;border-radius:18px}
  .cdBakP__price b{font-size:32px}
  .cdBakP__dots{gap:2px;height:28px}
  .cdBakP__dots i.is-d{height:28px}.cdBakP__dots i.is-w{height:18px}
  .cdBakP__tl{padding:12px}
}
@media (max-width:720px){.cdBakP__axis span:nth-child(2){display:none}}
.cdBakP__for{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px;padding-top:16px;border-top:1px solid var(--cd-line)}
.cdBakP__for>span{font:700 10.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--cd-dim)}
.cdBakP__for>div{display:flex;flex-wrap:wrap;gap:6px}
.cdBakP__e{display:inline-flex;align-items:center;gap:6px;padding:6px 10px 6px 6px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--cd-line);font:700 12.5px/1 var(--sans);color:rgba(255,255,255,.9)}
.cdBakP__e img{box-sizing:content-box;padding:2px;border-radius:50%;background:#fff}

/* FAQ: desain ulang total (3 Nov) */
.cdFaq{padding:72px 0;background:#fff}
.cdFaq__head{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:26px}
.cdFaq__search{display:flex;align-items:center;gap:10px;width:min(360px,100%);padding:0 16px;height:48px;border-radius:14px;border:1.5px solid var(--cd-soft);background:var(--bg);color:var(--ink-3);transition:border-color .2s,box-shadow .2s}
.cdFaq__search:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in oklab,var(--accent) 18%,transparent)}
.cdFaq__search input{flex:1;min-width:0;border:0;outline:0;background:none;font:500 15px/1 var(--sans);color:var(--ink)}
.cdFaq__tabs{display:flex;gap:8px;margin-bottom:18px;overflow-x:auto;scrollbar-width:none}
.cdFaq__tabs::-webkit-scrollbar{display:none}
.cdFaq__tab{flex-shrink:0;display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;border:1.5px solid var(--cd-soft);background:#fff;color:var(--ink-2);font:700 14px/1 var(--sans);cursor:pointer;transition:all .15s}
.cdFaq__tab small{display:grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:color-mix(in oklab,var(--line) 8%,transparent);font:700 11px/1 var(--mono)}
.cdFaq__tab:hover{border-color:var(--ink)}
.cdFaq__tab.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.cdFaq__tab.is-on small{background:var(--accent);color:#fff}
.cdFaq__tab.is-on svg{color:var(--cd-peach)}
.cdFaq__box{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:stretch}
.cdFaq__list{border-top:0;display:flex;flex-direction:column;gap:6px}
.cdFaq__it{border:0}
.cdFaq__it .cdFaq__q{width:100%;padding:15px 18px;border-radius:14px;border:1.5px solid var(--cd-soft);background:#fff;font:700 15px/1.35 var(--sans);transition:border-color .15s,background .15s}
.cdFaq__it .cdFaq__q:hover{border-color:color-mix(in oklab,var(--line) 30%,transparent)}
.cdFaq__it.is-on .cdFaq__q{border-color:var(--accent);background:color-mix(in oklab,var(--accent) 6%,#fff)}
.cdFaq__it .cdFaq__q i{width:24px;height:24px;border:0;background:none}
.cdFaq__it .cdFaq__q i::before{width:8px;height:8px;margin:-4px 0 0 -6px;background:none;border-right:2px solid var(--ink-3);border-top:2px solid var(--ink-3);transform:rotate(45deg)}
.cdFaq__it .cdFaq__q i::after{display:none}
.cdFaq__it.is-on .cdFaq__q i{background:none}
.cdFaq__it.is-on .cdFaq__q i::before{background:none;border-color:var(--accent)}
.cdFaq__a--m{display:none}
.cdFaq__none{margin:0;padding:18px;border-radius:14px;border:1.5px dashed var(--cd-soft);font-size:14.5px;color:var(--ink-3)}
.cdFaq__panel{position:relative;display:flex;flex-direction:column;padding:28px;border-radius:22px;background:var(--cd-ink);color:#fff;box-shadow:0 24px 60px rgba(0,0,0,.18);overflow:hidden}
.cdFaq__panel::before{content:"";position:absolute;right:-80px;top:-80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in oklab,var(--accent) 35%,transparent),transparent)}
.cdFaq__panel>*{position:relative}
.cdFaq__who{display:inline-flex;align-items:center;gap:8px;font:700 11.5px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--cd-peach)}
.cdFaq__who i{width:8px;height:8px;border-radius:50%;background:var(--cd-ok);box-shadow:0 0 0 3px rgba(34,197,94,.25)}
.cdFaq__panel h3{margin:16px 0 0;font:600 clamp(22px,2.2vw,28px)/1.2 var(--serif);letter-spacing:-.01em;text-wrap:balance}
.cdFaq__panel p{margin:14px 0 0;font-size:16px;line-height:1.7;color:rgba(255,255,255,.78)}
.cdFaq__panel .cdFaq__wa{display:flex;align-items:center;gap:12px;margin-top:auto;padding:14px 16px;max-width:none;border-radius:14px;border:1px solid var(--cd-line);background:rgba(255,255,255,.05);color:#fff;text-decoration:none;transition:background .2s}
.cdFaq__panel .cdFaq__wa:hover{background:rgba(255,255,255,.1)}
.cdFaq__panel .cdFaq__wa>svg:first-child{color:#4ADE80}
.cdFaq__panel .cdFaq__wa span{flex:1;font-size:13px;color:var(--cd-dim)}
.cdFaq__panel .cdFaq__wa b{display:block;font-size:14.5px;color:#fff}
.cdFaq__panel h3+p{margin-bottom:26px}
@media (max-width:900px){
  .cdFaq__head{flex-direction:column;align-items:stretch}
  .cdFaq__search{width:100%}
  .cdFaq__box{grid-template-columns:minmax(0,1fr)}
  .cdFaq__panel h3,.cdFaq__panel p,.cdFaq__who{display:none}
  .cdFaq__panel{padding:0;background:none;box-shadow:none}
  .cdFaq__panel::before{display:none}
  .cdFaq__panel .cdFaq__wa{margin-top:4px;background:var(--cd-ink)}
  .cdFaq__a--m{display:block;padding:4px 18px 16px}
  .cdFaq__a--m p{margin:0;font-size:15px;line-height:1.65;color:var(--ink-2)}
  .cdFaq__it.is-on{border-radius:14px;border:1.5px solid var(--accent);background:color-mix(in oklab,var(--accent) 6%,#fff)}
  .cdFaq__it.is-on .cdFaq__q{border:0;background:none}
  .cdFaq__it.is-on .cdFaq__q i::before{transform:rotate(135deg);margin-top:-6px}
}
@media (max-width:720px){
  .cdFaq{padding:52px 0}
  .cdFaq__head{gap:16px;margin-bottom:18px}
  .cdFaq__tab{padding:9px 12px;font-size:13px}
  .cdFaq__it .cdFaq__q{padding:14px 16px;font-size:14.5px}
}

/* CTA penutup: desain ulang (referensi CTA Apps) */
.cdCta{padding:72px 0 84px}
.cdCta__box{position:relative;max-width:none;padding:76px 32px;border-radius:28px;background:#1E1E20;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.18)}
.cdCta__box::before{content:"";position:absolute;left:50%;bottom:-260px;width:760px;height:480px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(236,101,42,.55),transparent);pointer-events:none}
.cdCta__box::after{content:"";position:absolute;left:-120px;top:-160px;width:420px;height:360px;background:radial-gradient(closest-side,rgba(241,182,45,.16),transparent);pointer-events:none}
.cdCta__grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%)}
.cdCta__in{position:relative;z-index:2;max-width:640px;margin:0 auto;text-align:center}
.cdCta__pill{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);font:600 13px/1 var(--mono);color:rgba(255,255,255,.9)}
.cdCta__pill i{width:8px;height:8px;border-radius:50%;background:var(--cd-ok);animation:cdPulse 1.8s ease-out infinite}
.cdCta__box h2{margin:20px 0 0;color:#fff;font:600 clamp(32px,4.2vw,54px)/1.05 var(--serif);letter-spacing:-.02em;text-wrap:balance;font-variant-numeric:lining-nums}
.cdCta__box h2 em{display:block;font-style:italic;font-weight:500;color:#FF9D63;background:linear-gradient(90deg,#FF8A4C,#F1B62D);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.cdCta__box p{margin:16px auto 0;max-width:30em;font-size:16.5px;line-height:1.6;color:rgba(255,255,255,.66)}
.cdCta__btns{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:28px}
.cdCta__btns .btn{gap:8px}
.cdCta__cmd{display:inline-flex;align-items:center;gap:10px;max-width:100%;margin-top:26px;padding:8px 8px 8px 16px;border-radius:12px;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.1)}
.cdCta__cmd>span{font:700 13.5px/1 var(--mono);color:var(--cd-ok)}
.cdCta__cmd code{font:500 13.5px/1.3 var(--mono);color:rgba(255,255,255,.85);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.cdCta__cmd .cdCopy{margin-left:4px}
.cdCta__tile{position:absolute;z-index:1;display:grid;place-items:center;width:64px;height:64px;border-radius:18px;background:#fff;box-shadow:0 14px 30px rgba(0,0,0,.35);animation:cdFloat 6s ease-in-out infinite}
.cdCta__tile svg{color:var(--accent)}
.cdCta__t1{left:7%;top:16%;transform:rotate(-8deg)}
.cdCta__t2{left:16%;bottom:14%;width:56px;height:56px;animation-delay:-2s}
.cdCta__t3{right:8%;top:14%;transform:rotate(7deg);animation-delay:-1s}
.cdCta__t4{right:15%;bottom:16%;width:56px;height:56px;animation-delay:-3s}
.cdCta__t5{left:3%;top:52%;width:44px;height:44px;border-radius:13px;background:#2A2A2D;animation-delay:-4s}
.cdCta__t6{right:3%;top:48%;width:46px;height:46px;border-radius:13px;background:#2A2A2D;animation-delay:-1.5s}
.cdCta__t7{left:25%;top:7%;width:40px;height:40px;border-radius:12px;background:#2A2A2D;animation-delay:-2.5s}
.cdCta__t8{right:26%;bottom:6%;width:40px;height:40px;border-radius:12px;background:#2A2A2D;animation-delay:-3.5s}
.cdCta__t5 svg,.cdCta__t6 svg,.cdCta__t7 svg,.cdCta__t8 svg{color:var(--cd-peach)}
@keyframes cdFloat{0%,100%{translate:0 0}50%{translate:0 -10px}}
@media (max-width:1100px){.cdCta__t7,.cdCta__t8{display:none}.cdCta__t1{left:4%}.cdCta__t3{right:4%}}
@media (max-width:720px){
  .cdCta{padding:52px 0 60px}
  .cdCta__box{padding:96px 18px 88px;border-radius:22px}
  .cdCta__tile{width:46px;height:46px;border-radius:13px}
  .cdCta__tile img{width:24px;height:24px}
  .cdCta__t1{left:6%;top:4%}.cdCta__t3{right:6%;top:5%;left:auto}
  .cdCta__t2{left:28%;top:2%;bottom:auto;width:40px;height:40px}.cdCta__t4{right:28%;top:3%;bottom:auto;width:40px;height:40px}
  .cdCta__t5{left:8%;top:auto;bottom:4%}.cdCta__t6{right:8%;top:auto;bottom:4%}
  .cdCta__btns{display:grid;grid-template-columns:1fr 1fr}
  .cdCta__box p{font-size:15px}
  .cdCta__cmd code{font-size:12px}
}
@media (max-width:380px){.cdCta__btns{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.cdCta__tile,.cdCta__pill i{animation:none}}
@media (max-width:720px){.cdCta__btns .btn{white-space:nowrap;font-size:14px;padding:12px 10px;min-height:48px}.cdCta__btns .btn svg{display:none}.cdCta__box{padding-bottom:76px}}

/* cocok untuk: bento (desain ulang 3 Nov) */
.cdUse{padding:72px 0;background:#fff}
.cdUse__head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px;align-items:end;margin-bottom:30px}
.cdUse__head .cdLead{margin:0;max-width:26em}
.cdBento{display:grid;grid-template-columns:1.15fr 1fr 1fr;grid-template-rows:auto auto;gap:16px}
.cdBento__hero{grid-row:1/3;position:relative;display:flex;flex-direction:column;padding:30px;border-radius:22px;background:var(--cd-ink);color:#fff;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.18)}
.cdBento__hero::before{content:"";position:absolute;right:-90px;bottom:-110px;width:320px;height:320px;border-radius:50%;background:radial-gradient(closest-side,rgba(234,75,113,.35),transparent)}
.cdBento__hero>*{position:relative}
.cdBento__hero .cdKick{color:var(--cd-peach)}
.cdBento__hero h3{margin:12px 0 0;font:600 30px/1.1 var(--serif);letter-spacing:-.01em}
.cdBento__hero p{margin:12px 0 0;font-size:15.5px;line-height:1.6;color:rgba(255,255,255,.72)}
.cdFlow{display:flex;align-items:center;margin:auto 0 0;padding:30px 0 24px}
.cdFlow__n{display:flex;flex-direction:column;align-items:center;gap:8px;flex-shrink:0}
.cdFlow__n img,.cdFlow__n svg{box-sizing:content-box;padding:13px;width:26px;height:26px;border-radius:16px;background:#fff;box-shadow:0 10px 24px rgba(0,0,0,.35)}
.cdFlow__n--mid svg{background:#2A2A2D;color:var(--cd-peach);border:1px solid rgba(255,255,255,.14)}
.cdFlow__n small{font:600 11px/1 var(--mono);color:rgba(255,255,255,.6)}
.cdFlow__l{flex:1;height:2px;margin:0 8px 22px;background:repeating-linear-gradient(90deg,var(--cd-peach) 0 6px,transparent 6px 12px);background-size:24px 2px;animation:cdDash 1.2s linear infinite;opacity:.8}
@keyframes cdDash{to{background-position:24px 0}}
.cdBento__go{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;padding:12px 16px;border-radius:12px;background:#fff;color:var(--cd-ink);font:700 14px/1 var(--sans);text-decoration:none;transition:transform .2s}
.cdBento__go:hover{color:var(--cd-ink);transform:translateX(2px)}
.cdBento__it{display:flex;flex-direction:column;padding:22px;border-radius:20px;background:#fff;border:1px solid color-mix(in oklab,var(--line) 11%,transparent);box-shadow:0 1px 2px rgba(0,0,0,.03),0 10px 28px rgba(0,0,0,.04);transition:transform .2s,box-shadow .2s,border-color .2s}
.cdBento__it:hover{transform:translateY(-3px);border-color:color-mix(in oklab,var(--accent) 35%,transparent);box-shadow:0 18px 40px rgba(0,0,0,.08)}
.cdStack{display:inline-flex;align-items:center;gap:10px;align-self:flex-start;padding:7px 10px;border-radius:14px;background:var(--bg);border:1px solid color-mix(in oklab,var(--line) 9%,transparent);color:var(--ink-3)}
.cdStack__tech,.cdStack__db{display:inline-flex;gap:6px;align-items:center}
.cdStack__tech svg{color:var(--accent)}
.cdStack img{box-sizing:content-box;padding:4px;border-radius:9px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.cdBento__it h3{margin:18px 0 0;font:600 20px/1.2 var(--serif)}
.cdBento__it p{margin:8px 0 0;font-size:14.5px;line-height:1.55;color:var(--ink-2);flex:1}
.cdBento__rec{margin-top:14px;font:600 12px/1.3 var(--mono);color:var(--ink-3)}
.cdUse__strip{display:flex;align-items:center;gap:14px;margin-top:16px;padding:14px 18px;border-radius:16px;border:1.5px dashed color-mix(in oklab,var(--line) 18%,transparent)}
.cdUse__strip p{flex:1;margin:0;font-size:14.5px;line-height:1.5;color:var(--ink-2)}
.cdUse__strip b{color:var(--ink)}
.cdUse__stripIc{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;border-radius:11px;background:var(--cd-ink);color:var(--cd-peach)}
@media (max-width:1100px){.cdBento{grid-template-columns:1fr 1fr}.cdBento__hero{grid-row:auto;grid-column:1/-1}.cdFlow{max-width:460px}}
@media (max-width:720px){
  .cdUse{padding:52px 0}
  .cdUse__head{grid-template-columns:minmax(0,1fr);gap:12px;margin-bottom:22px}
  .cdBento{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
  .cdBento__hero{padding:22px;border-radius:18px}
  .cdBento__hero h3{font-size:24px}
  .cdBento__hero p{font-size:14.5px}
  .cdFlow{padding:22px 0 18px}
  .cdFlow__n img,.cdFlow__n svg{padding:10px;width:22px;height:22px;border-radius:13px}
  .cdBento__it{padding:14px;border-radius:16px}
  .cdStack{gap:6px;padding:5px 7px}
  .cdStack img{width:18px;height:18px;padding:3px}
  .cdStack>svg{width:12px;height:12px}
  .cdBento__it h3{margin-top:12px;font-size:16px}
  .cdBento__it p{font-size:13px}
  .cdBento__rec{display:none}
  .cdUse__strip{flex-wrap:wrap;padding:14px}
  .cdUse__strip p{flex-basis:calc(100% - 52px);font-size:13.5px}
  .cdUse__strip .cdLink{margin-left:52px}
}
@media (prefers-reduced-motion:reduce){.cdFlow__l{animation:none}}
.cdStack{background:#fff;border-color:color-mix(in oklab,var(--line) 12%,transparent)}