/* Prepare Your STAQ — Baztan-inspired carousel, scoped to #persiapan only. */
#persiapan.practical-home{--prep-ink:#11142D;--prep-sand:#C5A989;--prep-yellow:#FEC809;--prep-line:#DDD4C8;position:relative;isolation:isolate;overflow:hidden;background:var(--prep-sand);color:var(--prep-ink);padding:clamp(78px,8vw,118px) 0 clamp(55px,6vw,86px)}
#persiapan .practical-home__ghost{position:absolute;z-index:0;white-space:nowrap;pointer-events:none;top:18px;left:4%;transform:translate3d(var(--ghost-x,0px),0,0);font:400 clamp(108px,18vw,290px)/1 Audiowide,sans-serif;letter-spacing:-.06em;opacity:.13;color:#8E765A;transition:transform .15s linear}
#persiapan .practical-home__head,#persiapan .practical-home__bottom,#persiapan .practical-home__viewport{position:relative;z-index:1}
#persiapan .practical-home__head{margin-bottom:clamp(34px,5vw,54px)}
#persiapan .practical-home__head h2{font:400 clamp(31px,4vw,58px)/1.08 Audiowide,sans-serif;letter-spacing:-.035em;color:var(--prep-ink);margin:0}
#persiapan .practical-home__intro{margin:14px 0 0;font:600 clamp(16px,1.2vw,20px)/1.5 Manrope,sans-serif;max-width:670px;color:#2A241C}
#persiapan .practical-home__viewport{margin-left:0;width:100%;overflow:hidden}
#persiapan .practical-cards{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline-start:clamp(24px,5vw,68px);scroll-behavior:smooth;overscroll-behavior-x:contain;padding:2px clamp(24px,5vw,68px);scrollbar-width:none;cursor:grab}
#persiapan .practical-cards.dragging{scroll-behavior:auto;cursor:grabbing;scroll-snap-type:none;user-select:none}
#persiapan .practical-cards::-webkit-scrollbar{display:none}
#persiapan .practical-card{position:relative;flex:0 0 clamp(240px,calc((100vw - 220px)/4),310px);height:clamp(500px,47vw,630px);scroll-snap-align:start;overflow:hidden;border-radius:28px;isolation:isolate;background:#11142D;color:#fff;text-decoration:none;transition:filter .25s ease;box-shadow:none}
#persiapan .practical-card__image{position:absolute;inset:0;z-index:-3;background:linear-gradient(180deg,rgba(10,12,28,.08),rgba(10,12,28,.3) 55%,rgba(10,12,28,.5))}
#persiapan .practical-card__image img{width:100%;height:100%;object-fit:cover;display:block;opacity:.88;filter:saturate(.92) contrast(.98)}
#persiapan .practical-card__shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,10,23,.08) 0%,rgba(7,10,23,.18) 34%,rgba(7,10,23,.7) 100%)}
#persiapan .practical-card h3{position:absolute;top:24px;left:22px;margin:0;max-height:78%;font:400 clamp(24px,2.4vw,36px)/.96 Audiowide,sans-serif;letter-spacing:-.035em;writing-mode:vertical-rl;color:var(--prep-yellow);text-shadow:0 2px 12px rgba(0,0,0,.18)}
#persiapan .practical-card:hover,#persiapan .practical-card:focus-visible{filter:brightness(1.07);box-shadow:none;outline-offset:4px}
#persiapan .practical-home__bottom{display:flex;gap:22px;align-items:center;margin-top:clamp(28px,4vw,48px)}
#persiapan .practical-home__progress{flex:1;height:5px;background:#DFD5C8;border-radius:999px;overflow:hidden}
#persiapan .practical-home__progress span{display:block;width:50%;height:100%;border-radius:999px;background:var(--prep-yellow);transition:width .16s linear}
#persiapan .practical-home__controls{display:flex;gap:14px;flex-shrink:0}
#persiapan .practical-home__nav{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;border:1px solid #8D755D;background:#E4D7C4;color:var(--prep-ink);cursor:pointer;transition:transform .2s ease, background .2s ease, border-color .2s ease, color .2s ease}
#persiapan .practical-home__nav .tabler-icon{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2.2}
#persiapan .practical-home__nav--next{background:var(--prep-yellow);border-color:var(--prep-yellow)}
#persiapan .practical-home__nav:not(:disabled):hover{transform:translateY(-2px)}
#persiapan .practical-home__nav:disabled{opacity:.45;cursor:default;transform:none}
#persiapan .practical-home__nav--prev:disabled{background:#E4D7C4;color:#6E6459}
#persiapan .practical-home__nav--next:disabled{background:var(--prep-yellow);color:#6E6459;border-color:var(--prep-yellow)}
@media(max-width:1100px){#persiapan .practical-home__viewport{margin-left:0;width:100%}#persiapan .practical-card{flex-basis:clamp(235px,28vw,286px);height:540px}#persiapan .practical-cards{scroll-padding-inline-start:20px;gap:clamp(18px,1.9vw,28px)}}
@media(max-width:960px){#persiapan.practical-home{padding:74px 0 56px}#persiapan .practical-home__ghost{top:36px;left:2%;font-size:clamp(84px,23vw,170px)}#persiapan .practical-home__head{margin-bottom:26px}#persiapan .practical-home__head h2{font-size:clamp(28px,8vw,48px)}#persiapan .practical-home__intro{font-size:15px;line-height:1.55;max-width:33ch}#persiapan .practical-card{flex-basis:clamp(205px,calc((100vw - 108px)/2),335px);height:420px;border-radius:24px}#persiapan .practical-card h3{font-size:24px;left:18px;top:20px}#persiapan .practical-home__bottom{gap:16px}#persiapan .practical-home__nav{width:54px;height:54px}}
@media(max-width:600px){#persiapan .practical-home__head{margin-bottom:22px}#persiapan .practical-home__intro{font-size:14px;color:#221C15}#persiapan .practical-home__viewport{margin-left:0;width:100%}#persiapan .practical-cards{gap:18px;padding:2px 32px 2px 32px;scroll-padding-inline-start:32px;scroll-padding-inline-end:32px}#persiapan .practical-card{flex:0 0 calc((100vw - 32px - 36px - 12px)/2);height:404px}#persiapan .practical-card h3{font-size:clamp(18px,5vw,21px);left:14px;top:18px;max-height:calc(100% - 35px)}#persiapan .practical-home__bottom{margin-top:26px}#persiapan .practical-home__nav{width:48px;height:48px}}
@media(prefers-reduced-motion:reduce){#persiapan .practical-home__ghost{transition:none}#persiapan .practical-cards{scroll-behavior:auto}#persiapan .practical-card,#persiapan .practical-home__nav{transition:none}}

/* Desktop hover: a single Tabler arrow cursor, placed by practical.js. */
#persiapan .practical-card{cursor:pointer}
.prep-hover-cursor{position:fixed;top:0;left:0;display:grid;place-items:center;width:78px;height:78px;border-radius:50%;background:#FEC809;color:#11142D;box-shadow:none;z-index:10000;pointer-events:none;opacity:0;transform:translate3d(-120px,-120px,0);transition:opacity .14s ease}
.prep-hover-cursor.is-visible{opacity:1}
.prep-hover-cursor .tabler-icon{width:30px;height:30px;stroke:currentColor;fill:none;stroke-width:1.9}
@media (hover:hover) and (pointer:fine) and (min-width:961px){#persiapan .practical-card:hover{cursor:none}}
@media (max-width:960px), (hover:none){.prep-hover-cursor{display:none}}