html{scroll-behavior:smooth}
body.mysp-hpage-body{margin:0;background:#0b1020}
.mysp-hpage{--mysp-hpage-primary:#6c5ce7;--mysp-hpage-accent:#00cec9;--mysp-hpage-bg:#0b1020;--mysp-hpage-text:#fff;--mysp-hpage-overlay:.4;--mysp-hpage-hero-h:100vh;
  background:var(--mysp-hpage-bg);color:var(--mysp-hpage-text);font-family:var(--mysp-hpage-font-b,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif);line-height:1.6;overflow-x:clip;position:relative}
.mysp-hpage *{box-sizing:border-box}
.mysp-hpage .mysp-hpage-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.mysp-hpage button,.mysp-hpage input,.mysp-hpage textarea,.mysp-hpage select{font-family:inherit}
.mysp-hpage a{text-decoration:none}

/* progress */
.mysp-hpage-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:100;background:transparent}
.mysp-hpage-progress span{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--mysp-hpage-primary),var(--mysp-hpage-accent))}

/* nav */
.mysp-hpage-nav{position:fixed;top:0;left:0;right:0;z-index:90;display:flex;align-items:center;justify-content:space-between;padding:18px 5vw;transition:background .3s,padding .3s,backdrop-filter .3s}
.mysp-hpage-nav.is-scrolled{background:rgba(11,16,32,.78);backdrop-filter:blur(10px);padding:12px 5vw}
.mysp-hpage-brand{color:var(--mysp-hpage-text);font-weight:800;font-size:1.2rem;letter-spacing:.5px}
.mysp-hpage-nav nav{display:flex;gap:26px;flex-wrap:wrap}
.mysp-hpage-nav nav a{color:var(--mysp-hpage-text);opacity:.85;font-weight:500;font-size:.95rem;transition:opacity .2s,color .2s}
.mysp-hpage-nav nav a:hover{opacity:1;color:var(--mysp-hpage-accent)}

/* hero */
.mysp-hpage-hero{position:relative;height:var(--mysp-hpage-hero-h);min-height:520px;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center;background:linear-gradient(160deg,var(--mysp-hpage-primary),var(--mysp-hpage-bg) 70%)}
.mysp-hpage-layer{position:absolute;left:0;right:0;top:-12%;bottom:-12%;background-size:cover;background-position:center;will-change:transform}
.mysp-hpage-layer-front{z-index:3;pointer-events:none}
.mysp-hpage-hero-shade{position:absolute;inset:0;background:rgba(5,8,20,var(--mysp-hpage-overlay));z-index:1}
.mysp-hpage-hero-inner{position:relative;z-index:2;max-width:880px;padding:0 6vw;will-change:transform,opacity}
.mysp-hpage-hero-title{font-size:clamp(2.2rem,6.5vw,5rem);line-height:1.08;margin:0 0 18px;font-weight:900;letter-spacing:-.02em;animation:mysp-hpage-rise 1s cubic-bezier(.2,.7,.2,1) both}
.mysp-hpage-hero-sub{font-size:clamp(1rem,2vw,1.35rem);opacity:.9;margin:0 0 30px;animation:mysp-hpage-rise 1s .15s cubic-bezier(.2,.7,.2,1) both}
.mysp-hpage-hero-inner .mysp-hpage-btn{animation:mysp-hpage-rise 1s .3s cubic-bezier(.2,.7,.2,1) both}
@keyframes mysp-hpage-rise{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}

.mysp-hpage-btn{display:inline-block;padding:14px 32px;border-radius:999px;background:linear-gradient(90deg,var(--mysp-hpage-primary),var(--mysp-hpage-accent));color:#fff!important;font-weight:700;box-shadow:0 10px 30px rgba(0,0,0,.35);transition:transform .25s,box-shadow .25s}
.mysp-hpage-btn:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 16px 40px rgba(0,0,0,.45)}

.mysp-hpage-scroll-hint{position:absolute;bottom:28px;left:50%;width:24px;height:40px;margin-left:-12px;border:2px solid rgba(255,255,255,.7);border-radius:14px;z-index:4}
.mysp-hpage-scroll-hint span{position:absolute;top:7px;left:50%;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:#fff;animation:mysp-hpage-wheel 1.6s infinite}
@keyframes mysp-hpage-wheel{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(14px)}}

/* sections */
.mysp-hpage-section{position:relative;overflow:hidden;padding:clamp(80px,14vh,160px) 6vw}
.mysp-hpage-section-inner{position:relative;z-index:2;max-width:1150px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:center}
.mysp-hpage-layout-right .mysp-hpage-copy{order:2}
.mysp-hpage-layout-center .mysp-hpage-section-inner{grid-template-columns:1fr;text-align:center;max-width:820px}
.mysp-hpage-copy h2{font-size:clamp(1.8rem,4vw,3rem);line-height:1.15;margin:0 0 18px}
.mysp-hpage-text{opacity:.88;font-size:1.05rem;margin-bottom:26px}
.mysp-hpage-text p{margin:0 0 1em}
.mysp-hpage-media{border-radius:22px;overflow:hidden;aspect-ratio:4/3;box-shadow:0 30px 70px rgba(0,0,0,.5)}
.mysp-hpage-media img{width:100%;height:118%;object-fit:cover;display:block;will-change:transform}
.mysp-hpage-bgword{position:absolute;z-index:1;left:0;right:0;top:50%;margin-top:-.5em;text-align:center;font-size:clamp(5rem,18vw,16rem);font-weight:900;line-height:1;white-space:nowrap;color:var(--mysp-hpage-text);opacity:.04;pointer-events:none;user-select:none;will-change:transform}

/* cta */
.mysp-hpage-cta{position:relative;overflow:hidden;padding:clamp(100px,18vh,200px) 6vw;text-align:center;background:linear-gradient(160deg,var(--mysp-hpage-bg),var(--mysp-hpage-primary))}
.mysp-hpage-cta-inner{position:relative;z-index:2;max-width:720px;margin:0 auto}
.mysp-hpage-cta h2{font-size:clamp(2rem,5vw,3.6rem);margin:0 0 14px;line-height:1.1}
.mysp-hpage-cta p{opacity:.9;font-size:1.15rem;margin:0 0 30px}

/* reveal (disembunyikan hanya bila JS aktif) */
.mysp-hpage-js .mysp-hpage-reveal{opacity:0;transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1),filter .9s cubic-bezier(.2,.7,.2,1)}
.mysp-hpage-js .mysp-hpage-reveal[data-anim="fade-up"]{transform:translateY(60px)}
.mysp-hpage-js .mysp-hpage-reveal[data-anim="fade-left"]{transform:translateX(-80px)}
.mysp-hpage-js .mysp-hpage-reveal[data-anim="fade-right"]{transform:translateX(80px)}
.mysp-hpage-js .mysp-hpage-reveal[data-anim="zoom"]{transform:scale(.86)}
.mysp-hpage-js .mysp-hpage-reveal[data-anim="blur-up"]{transform:translateY(40px);filter:blur(14px)}
.mysp-hpage-js .mysp-hpage-reveal[data-anim="flip"]{transform:perspective(900px) rotateX(-60deg) translateY(30px);transform-origin:50% 0}
.mysp-hpage-js .mysp-hpage-reveal[data-anim="none"]{opacity:1;transform:none}
.mysp-hpage-js .mysp-hpage-reveal.mysp-hpage-in{opacity:1;transform:none;filter:none}
.mysp-hpage-js .mysp-hpage-item.mysp-hpage-done{transition:transform .3s,box-shadow .3s}
.mysp-hpage-js .mysp-hpage-item.mysp-hpage-in:hover{transform:translateY(-6px)}

@media(max-width:800px){
  .mysp-hpage-section-inner{grid-template-columns:1fr}
  .mysp-hpage-layout-right .mysp-hpage-copy{order:0}
  .mysp-hpage-nav nav{gap:14px}
  .mysp-hpage-nav nav a{font-size:.85rem}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.mysp-hpage-reduce .mysp-hpage-reveal{opacity:1!important;transform:none!important;filter:none!important;transition:none}
.mysp-hpage-reduce .mysp-hpage-hero-title,.mysp-hpage-reduce .mysp-hpage-hero-sub,.mysp-hpage-reduce .mysp-hpage-hero-inner .mysp-hpage-btn{animation:none}

/* ===== v0.2: font, tipe section, dekorasi islami ===== */
.mysp-hpage h1,.mysp-hpage h2,.mysp-hpage h3,.mysp-hpage-brand{font-family:var(--mysp-hpage-font-h,inherit)}
.mysp-hpage-hero-eyebrow{font-size:clamp(1.3rem,3vw,2rem);color:var(--mysp-hpage-accent);margin:0 0 14px;font-family:'Amiri','Traditional Arabic',serif;animation:mysp-hpage-rise 1s cubic-bezier(.2,.7,.2,1) both}
.mysp-hpage-layer svg{width:100%;height:100%;display:block}
.mysp-hpage-twinkle{animation:mysp-hpage-twinkle 3s ease-in-out infinite}
@keyframes mysp-hpage-twinkle{0%,100%{opacity:.25}50%{opacity:1}}
.mysp-hpage-sway{transform-origin:0 0;animation:mysp-hpage-sway 5s ease-in-out infinite alternate}
@keyframes mysp-hpage-sway{from{transform:rotate(-3deg)}to{transform:rotate(3deg)}}

.mysp-hpage-eyebrow{display:inline-block;color:var(--mysp-hpage-accent);font-weight:700;letter-spacing:.18em;text-transform:uppercase;font-size:.8rem;margin-bottom:12px}
.mysp-hpage-eyebrow::before,.mysp-hpage-eyebrow::after{content:"\2726";margin:0 .7em;opacity:.8}
.mysp-hpage-layout-left .mysp-hpage-eyebrow::before,.mysp-hpage-type-story .mysp-hpage-eyebrow::before{margin-left:0}
.mysp-hpage-type-story .mysp-hpage-eyebrow::after{display:none}
.mysp-hpage-head{text-align:center;max-width:720px;margin:0 auto clamp(30px,5vw,60px)}
.mysp-hpage-head h2{font-size:clamp(1.8rem,4vw,3rem);line-height:1.15;margin:0 0 14px}
.mysp-hpage-light{color:var(--mysp-hpage-dark)}
.mysp-hpage-light .mysp-hpage-bgword{color:var(--mysp-hpage-dark);opacity:.05}
.mysp-hpage-light .mysp-hpage-eyebrow{color:var(--mysp-hpage-primary)}

.mysp-hpage-grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.mysp-hpage-grid-testimonials{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.mysp-hpage-item{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:26px 22px;text-align:center;transition:transform .3s,box-shadow .3s,opacity .9s cubic-bezier(.2,.7,.2,1)}
.mysp-hpage-item:hover{transform:translateY(-6px)}
.mysp-hpage-light .mysp-hpage-item{background:#fff;border-color:rgba(0,0,0,.06);box-shadow:0 12px 34px rgba(60,45,10,.12)}
.mysp-hpage-item h3{margin:14px 0 8px;font-size:1.25rem;line-height:1.25}
.mysp-hpage-item p{margin:0 0 14px;opacity:.85;font-size:.98rem}

.mysp-hpage-icon{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;font-size:1.9rem;font-weight:800;background:linear-gradient(135deg,var(--mysp-hpage-primary),var(--mysp-hpage-accent));color:#fff;box-shadow:0 8px 22px rgba(0,0,0,.3)}
.mysp-hpage-product{display:flex;flex-direction:column;align-items:center;padding:0 0 24px;overflow:hidden}
.mysp-hpage-item-img{width:100%;aspect-ratio:4/3;display:grid;place-items:center;background:linear-gradient(135deg,rgba(15,107,87,.25),rgba(212,175,55,.3));overflow:hidden;margin-bottom:6px}
.mysp-hpage-item-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.mysp-hpage-product:hover .mysp-hpage-item-img img{transform:scale(1.08)}
.mysp-hpage-emoji{font-size:4.2rem;filter:drop-shadow(0 6px 10px rgba(0,0,0,.25))}
.mysp-hpage-product h3,.mysp-hpage-product p,.mysp-hpage-product .mysp-hpage-price{padding:0 18px}
.mysp-hpage-price{font-weight:800;font-size:1.3rem;color:var(--mysp-hpage-accent);margin-bottom:14px}
.mysp-hpage-light .mysp-hpage-price{color:var(--mysp-hpage-primary)}
.mysp-hpage-btn-sm{padding:10px 24px;font-size:.92rem;margin-top:auto}

.mysp-hpage-quote{text-align:left;margin:0}
.mysp-hpage-quote blockquote{margin:0 0 18px;font-size:1.05rem;font-style:italic;line-height:1.6;opacity:.92}
.mysp-hpage-quote blockquote::before{content:"\201C";display:block;font-size:3rem;line-height:.6;color:var(--mysp-hpage-accent);font-family:Georgia,serif}
.mysp-hpage-quote figcaption{display:flex;gap:12px;align-items:center}
.mysp-hpage-quote figcaption img,.mysp-hpage-avatar{width:46px;height:46px;border-radius:50%;object-fit:cover;flex:none}
.mysp-hpage-avatar{display:grid;place-items:center;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--mysp-hpage-primary),var(--mysp-hpage-accent))}
.mysp-hpage-quote small{display:block;opacity:.7}
.mysp-hpage-shot{margin:0;align-self:start}
.mysp-hpage-pg{width:100%;outline:none}
.mysp-hpage-pg-view{overflow:hidden;width:100%}
.mysp-hpage-pg-track{display:flex;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.mysp-hpage-pg-page{flex:0 0 100%;min-width:0;align-content:start}
.mysp-hpage-pg:not(.is-all) .mysp-hpage-pg-page{grid-template-columns:repeat(var(--pp,3),minmax(0,1fr))!important}
.mysp-hpage-pg.is-all .mysp-hpage-pg-nav{display:none}
.mysp-hpage-pg-nav{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:22px}
.mysp-hpage-pg-dots{display:flex;gap:8px;align-items:center}
.mysp-hpage .mysp-hpage-pg-nav button{appearance:none;-webkit-appearance:none;margin:0;border:0;cursor:pointer}
.mysp-hpage .mysp-hpage-pg-prev,.mysp-hpage .mysp-hpage-pg-next{width:40px;height:40px;padding:0;border-radius:50%;background:rgba(255,255,255,.14);color:inherit;font-size:1rem;line-height:40px;text-align:center;transition:background .25s,transform .25s,color .25s}
.mysp-hpage .mysp-hpage-pg-prev:hover,.mysp-hpage .mysp-hpage-pg-next:hover,.mysp-hpage .mysp-hpage-pg-prev:focus-visible,.mysp-hpage .mysp-hpage-pg-next:focus-visible{background:var(--mysp-hpage-accent);color:#10201a;transform:scale(1.1);outline:none}
.mysp-hpage .mysp-hpage-pg-dots button{width:9px;height:9px;min-width:0;min-height:0;padding:0;border-radius:99px;background:rgba(128,128,128,.55);transition:width .35s,background .35s}
.mysp-hpage .mysp-hpage-pg-dots button.is-active{width:28px;background:var(--mysp-hpage-accent)}
@media(max-width:900px){.mysp-hpage-pg:not(.is-all):not([data-cur="1"]) .mysp-hpage-pg-page{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:560px){.mysp-hpage-pg:not(.is-all) .mysp-hpage-pg-page{grid-template-columns:minmax(0,1fr)!important}}
.mysp-hpage-reduce .mysp-hpage-pg-track{transition:none}
.mysp-hpage-shot .mysp-hpage-gal-item{aspect-ratio:auto;border-radius:14px;background:transparent}
.mysp-hpage-shot .mysp-hpage-gal-item img{height:auto;object-fit:contain}

.mysp-hpage-media-art{width:100%;height:100%;display:grid;place-items:center;color:var(--mysp-hpage-accent);background:radial-gradient(circle at 50% 40%,rgba(212,175,55,.18),transparent 65%),linear-gradient(135deg,var(--mysp-hpage-primary),var(--mysp-hpage-bg))}
.mysp-hpage-media-art svg{width:78%;animation:mysp-hpage-spin 60s linear infinite}
@keyframes mysp-hpage-spin{to{transform:rotate(360deg)}}

/* pola islami di latar section */
.mysp-hpage-decor-islamic .mysp-hpage-section::before{content:"";position:absolute;inset:0;z-index:0;opacity:.07;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cg fill='none' stroke='%23d4af37' stroke-width='1'%3E%3Crect x='20' y='20' width='40' height='40'/%3E%3Crect x='20' y='20' width='40' height='40' transform='rotate(45 40 40)'/%3E%3Ccircle cx='40' cy='40' r='9'/%3E%3C/g%3E%3C/svg%3E");background-size:80px 80px}
.mysp-hpage-decor-islamic .mysp-hpage-light::before{opacity:.12}
.mysp-hpage-decor-islamic .mysp-hpage-btn{background:linear-gradient(135deg,#b8901f,var(--mysp-hpage-accent) 55%,#f3dc8a);color:#2b2100!important}
.mysp-hpage-decor-islamic .mysp-hpage-item{border-color:rgba(212,175,55,.28)}

/* tombol WhatsApp melayang */
.mysp-hpage-wa{position:fixed;right:20px;bottom:20px;z-index:95;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-size:1.7rem;background:#25d366;box-shadow:0 10px 26px rgba(0,0,0,.35);transition:transform .25s;animation:mysp-hpage-pulse 2.4s infinite}
.mysp-hpage-wa:hover{transform:scale(1.1)}
@keyframes mysp-hpage-pulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.55),0 10px 26px rgba(0,0,0,.35)}70%{box-shadow:0 0 0 18px rgba(37,211,102,0),0 10px 26px rgba(0,0,0,.35)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0),0 10px 26px rgba(0,0,0,.35)}}


/* ===== v0.3: parallax halus, SVG bergerak, efek scroll ===== */
html{scroll-padding-top:72px}
.mysp-hpage-layer{left:-3%;right:-3%}
.mysp-hpage-section,.mysp-hpage-cta{isolation:isolate}
.mysp-hpage-item{position:relative}

/* judul hero kata per kata */
.mysp-hpage-js .mysp-hpage-hero-title.mysp-hpage-split{animation:none}
.mysp-hpage-word{display:inline-block;overflow:hidden;vertical-align:top;padding:.06em .02em .16em;margin:-.06em 0 -.16em}
.mysp-hpage-word>span{display:inline-block;transform:translateY(115%);animation:mysp-hpage-word 1s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(.15s + var(--i,0)*.09s)}
@keyframes mysp-hpage-word{to{transform:none}}

/* partikel emas */
.mysp-hpage-particles{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.mysp-hpage-particles i{position:absolute;bottom:-10px;width:var(--s);height:var(--s);border-radius:50%;background:var(--mysp-hpage-accent);box-shadow:0 0 10px var(--mysp-hpage-accent);opacity:0;animation:mysp-hpage-ascend var(--d) linear var(--dl) infinite}
@keyframes mysp-hpage-ascend{0%{transform:translate(0,0);opacity:0}10%{opacity:.95}85%{opacity:.5}100%{transform:translate(var(--x),-95vh);opacity:0}}

/* SVG hero bergerak */
.mysp-hpage-drift{animation:mysp-hpage-drift var(--t,90s) linear infinite;animation-delay:var(--dl,0s)}
@keyframes mysp-hpage-drift{from{transform:translateX(-560px)}to{transform:translateX(2200px)}}
.mysp-hpage-fly{animation:mysp-hpage-fly var(--t,30s) linear infinite;animation-delay:var(--dl,0s)}
@keyframes mysp-hpage-fly{from{transform:translate(-120px,var(--y0,0px))}to{transform:translate(1760px,var(--y1,-140px))}}
.mysp-hpage-flap{transform-box:fill-box;transform-origin:50% 100%;animation:mysp-hpage-flap .45s ease-in-out infinite alternate}
@keyframes mysp-hpage-flap{from{transform:scaleY(1)}to{transform:scaleY(.3)}}
.mysp-hpage-shoot{animation:mysp-hpage-shoot var(--t,11s) ease-in infinite;animation-delay:var(--dl,0s);opacity:0}
@keyframes mysp-hpage-shoot{0%{opacity:0;transform:translate(0,0)}3%{opacity:1}13%{opacity:0;transform:translate(-460px,230px)}100%{opacity:0;transform:translate(-460px,230px)}}
.mysp-hpage-glow{transform-box:fill-box;transform-origin:center;animation:mysp-hpage-glow 6s ease-in-out infinite}
@keyframes mysp-hpage-glow{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.14);opacity:1}}
.mysp-hpage-flicker{animation:mysp-hpage-flicker 2.4s ease-in-out infinite alternate}
@keyframes mysp-hpage-flicker{from{opacity:.7}to{opacity:1}}
.mysp-hpage-walk{animation:mysp-hpage-walk var(--t,75s) linear infinite;animation-delay:var(--dl,0s)}
@keyframes mysp-hpage-walk{from{transform:translateX(-520px)}to{transform:translateX(1760px)}}
.mysp-hpage-bob{animation:mysp-hpage-bob .9s ease-in-out infinite alternate}
@keyframes mysp-hpage-bob{from{transform:translateY(0)}to{transform:translateY(-3px)}}
.mysp-hpage-leg{transform-box:fill-box;transform-origin:50% 0;animation:mysp-hpage-step .9s ease-in-out infinite alternate}
.mysp-hpage-leg.b{animation-direction:alternate-reverse}
@keyframes mysp-hpage-step{from{transform:rotate(-17deg)}to{transform:rotate(17deg)}}

/* hiasan SVG melayang di section */
.mysp-hpage-floater{position:absolute;z-index:1;pointer-events:none;color:var(--mysp-hpage-accent);will-change:transform}
.mysp-hpage-floater svg{display:block;width:100%;height:100%;animation:mysp-hpage-float var(--t,7s) ease-in-out infinite alternate;animation-delay:var(--dl,0s)}
.mysp-hpage-light .mysp-hpage-floater{color:var(--mysp-hpage-primary)}
@keyframes mysp-hpage-float{from{transform:translateY(-14px) rotate(-8deg)}to{transform:translateY(14px) rotate(8deg)}}

/* teks berjalan */
.mysp-hpage-marquee{position:relative;z-index:5;overflow:hidden;padding:16px 0;background:var(--mysp-hpage-primary);border-block:1px solid rgba(212,175,55,.4)}
.mysp-hpage-marquee-row{display:flex;width:max-content;margin-left:-320px}
.mysp-hpage-marquee-track{display:flex;flex:none;animation:mysp-hpage-marq var(--mysp-marq-dur,42s) linear infinite}
.mysp-hpage-marquee:hover .mysp-hpage-marquee-track{animation-play-state:paused}
.mysp-hpage-marquee-track span{flex:none;padding:0 1.4rem;font-family:var(--mysp-hpage-font-h,inherit);font-size:var(--mq-fs,18px);font-weight:700;color:var(--mysp-hpage-text);white-space:nowrap}
.mysp-hpage-marquee-track span::after{font-size:.9em}
@media(max-width:767px){.mysp-hpage-marquee-track span{font-size:calc(var(--mq-fs,18px) * .75)!important}}
.mysp-hpage-marquee.is-top{padding-top:84px}
.mysp-hpage-has-wp-header .mysp-hpage-marquee.is-top{padding-top:16px}
.mysp-hpage-marquee.mysp-hpage-light{border-block-color:rgba(29,43,38,.18)}
.mysp-hpage-marquee.mysp-hpage-light .mysp-hpage-marquee-track span{color:var(--mysp-hpage-dark)}
.mysp-hpage-marquee-track span::after{content:"\2726";margin-left:2.8rem;color:var(--mysp-hpage-accent)}
@keyframes mysp-hpage-marq{to{transform:translateX(-100%)}}

/* ornamen garis yang "digambar" saat muncul */
.mysp-hpage-orn{display:block;width:min(240px,60%);height:24px;margin:0 auto 18px;color:var(--mysp-hpage-accent);fill:none;stroke:currentColor;stroke-width:1.5;overflow:visible}
.mysp-hpage-copy .mysp-hpage-orn{margin-left:0;width:200px}
.mysp-hpage-layout-center .mysp-hpage-copy .mysp-hpage-orn{margin-left:auto}
.mysp-hpage-light .mysp-hpage-orn{color:var(--mysp-hpage-primary)}
.mysp-hpage-js .mysp-hpage-orn path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.7s .35s ease}
.mysp-hpage-js .mysp-hpage-in .mysp-hpage-orn path{stroke-dashoffset:0}
.mysp-hpage-orn .dot{fill:currentColor;stroke:none;transform-box:fill-box;transform-origin:center;animation:mysp-hpage-glow 3s ease-in-out infinite}

/* kartu: kilau, emoji mengambang, ikon berdenyut */
.mysp-hpage-item::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(280px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.16),transparent 62%)}
.mysp-hpage-light .mysp-hpage-item::after{background:radial-gradient(280px circle at var(--mx,50%) var(--my,0%),rgba(212,175,55,.22),transparent 62%)}
.mysp-hpage-item:hover::after{opacity:1}
.mysp-hpage-emoji{display:inline-block;animation:mysp-hpage-bob2 3.6s ease-in-out infinite alternate}
.mysp-hpage-product:nth-child(2n) .mysp-hpage-emoji{animation-delay:-1.2s}
.mysp-hpage-product:nth-child(3n) .mysp-hpage-emoji{animation-delay:-2.4s}
@keyframes mysp-hpage-bob2{from{transform:translateY(-6px) rotate(-4deg)}to{transform:translateY(6px) rotate(4deg)}}
.mysp-hpage-icon{position:relative}
.mysp-hpage-icon::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--mysp-hpage-accent);opacity:0;animation:mysp-hpage-ring 3s ease-out infinite}
.mysp-hpage-feature:nth-child(2n) .mysp-hpage-icon::after{animation-delay:-1s}
.mysp-hpage-feature:nth-child(3n) .mysp-hpage-icon::after{animation-delay:-2s}
@keyframes mysp-hpage-ring{0%{transform:scale(.85);opacity:.75}100%{transform:scale(1.4);opacity:0}}

/* tombol berkilau */
.mysp-hpage-btn{position:relative;overflow:hidden}
.mysp-hpage-btn::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg);animation:mysp-hpage-shine 3.8s ease-in-out infinite}
@keyframes mysp-hpage-shine{0%,60%{left:-60%}100%{left:135%}}

/* menu aktif */
.mysp-hpage-nav nav a{position:relative;padding:4px 0}
.mysp-hpage-nav nav a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;border-radius:2px;background:var(--mysp-hpage-accent);transform:scaleX(0);transform-origin:0 50%;transition:transform .3s}
.mysp-hpage-nav nav a:hover::after,.mysp-hpage-nav nav a.is-active::after{transform:scaleX(1)}
.mysp-hpage-nav nav a.is-active{color:var(--mysp-hpage-accent);opacity:1}

/* rosette: dua lapis berputar berlawanan arah */
.mysp-hpage-media-art svg{animation:none}
.mysp-hpage-rot-a,.mysp-hpage-rot-b{transform-box:fill-box;transform-origin:center}
.mysp-hpage-rot-a{animation:mysp-hpage-spin 50s linear infinite}
.mysp-hpage-rot-b{animation:mysp-hpage-spin 34s linear infinite reverse}
.mysp-hpage-dash{stroke-dasharray:6 8;animation:mysp-hpage-dashmove 12s linear infinite}
@keyframes mysp-hpage-dashmove{to{stroke-dashoffset:-140}}

/* tombol WhatsApp: goyang kecil berkala */
.mysp-hpage-wa{animation:mysp-hpage-pulse 2.4s infinite,mysp-hpage-wiggle 6s ease-in-out infinite}
@keyframes mysp-hpage-wiggle{0%,86%,100%{rotate:0deg}90%{rotate:-12deg}94%{rotate:10deg}97%{rotate:-6deg}}

/* mode kurangi gerakan (jika tidak dipaksa jalan) */
.mysp-hpage-reduce *,.mysp-hpage-reduce *::before,.mysp-hpage-reduce *::after{animation:none!important}
.mysp-hpage-reduce .mysp-hpage-particles{display:none}

@media(max-width:800px){
  .mysp-hpage-floater{opacity:.7}
  .mysp-hpage-marquee-row{margin-left:-160px}
}

/* ===== v0.4: dots vertikal + mode satu halaman ===== */
.mysp-hpage-slide{display:contents}

.mysp-hpage .mysp-hpage-dots{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:96;display:flex;flex-direction:column;gap:16px;margin:0;padding:0}
.mysp-hpage .mysp-hpage-dots button{appearance:none;-webkit-appearance:none;position:relative;display:block;width:12px;height:12px;min-width:0;min-height:0;margin:0;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.4);box-shadow:0 0 0 1px rgba(0,0,0,.25);cursor:pointer;transition:transform .3s,background .3s}
.mysp-hpage .mysp-hpage-dots button:hover,.mysp-hpage .mysp-hpage-dots button:focus-visible{background:#fff;transform:scale(1.35);outline:none}
.mysp-hpage .mysp-hpage-dots button.is-active{background:var(--mysp-hpage-accent);transform:scale(1.55);box-shadow:0 0 0 1px rgba(0,0,0,.25),0 0 12px var(--mysp-hpage-accent)}
.mysp-hpage .mysp-hpage-dots button.is-active::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--mysp-hpage-accent);animation:mysp-hpage-ring 2.4s ease-out infinite}
.mysp-hpage .mysp-hpage-dots button::after{content:attr(data-label);position:absolute;right:26px;top:50%;transform:translate(10px,-50%);opacity:0;pointer-events:none;white-space:nowrap;padding:5px 11px;border-radius:8px;background:rgba(5,8,20,.88);color:#fff;font-size:.78rem;font-weight:600;line-height:1.2;transition:opacity .25s,transform .25s}
.mysp-hpage .mysp-hpage-dots button:hover::after,.mysp-hpage .mysp-hpage-dots button:focus-visible::after{opacity:1;transform:translate(0,-50%)}
.mysp-hpage-on-light .mysp-hpage-dots button{background:rgba(29,43,38,.35)}
.mysp-hpage-on-light .mysp-hpage-dots button.is-active{background:var(--mysp-hpage-primary);box-shadow:0 0 0 1px rgba(0,0,0,.2),0 0 12px var(--mysp-hpage-primary)}
.mysp-hpage-on-light .mysp-hpage-dots button.is-active::before{border-color:var(--mysp-hpage-primary)}
.mysp-hpage-reduce .mysp-hpage-dots button.is-active::before{animation:none}
.mysp-hpage-scroll-hint{cursor:pointer}

/* mode satu halaman (diaktifkan JS) */
html.mysp-hpage-fp-on,html.mysp-hpage-fp-on body{overflow:hidden!important;height:100%;overscroll-behavior:none}
.mysp-hpage.mysp-hpage-fp{position:fixed;left:0;right:0;bottom:0;top:var(--wp-admin--admin-bar--height,0px);z-index:99990;overflow:hidden;overscroll-behavior:none}
.mysp-hpage-fp .mysp-hpage-slides{height:100%;transition:transform 1s cubic-bezier(.77,0,.18,1);will-change:transform}
.mysp-hpage-fp .mysp-hpage-slide{display:block;position:relative;height:100%;overflow:hidden}
/* slide yang memuat teks berjalan: section mengisi sisa tinggi, marquee (dan shape-nya) tersusun seperti di mode scroll biasa */
.mysp-hpage-fp .mysp-hpage-slide.has-marq{display:flex;flex-direction:column}
.mysp-hpage-fp .mysp-hpage-slide.has-marq>.mysp-hpage-hero,.mysp-hpage-fp .mysp-hpage-slide.has-marq>.mysp-hpage-section,.mysp-hpage-fp .mysp-hpage-slide.has-marq>.mysp-hpage-cta{height:auto;min-height:0;flex:1 1 0}
.mysp-hpage-fp .mysp-hpage-slide.has-marq>.mysp-hpage-marquee{flex:none}
.mysp-hpage-fp .mysp-hpage-slide.has-marq>.mysp-hpage-shape{position:relative;left:auto;right:auto;bottom:auto;flex:none;margin:calc(var(--sh) * -1) 0 0}
.mysp-hpage-fp .mysp-hpage-hero{height:100%;min-height:0}
.mysp-hpage-fp .mysp-hpage-nav,.mysp-hpage-fp .mysp-hpage-progress,.mysp-hpage-fp .mysp-hpage-wa,.mysp-hpage .mysp-hpage-fp .mysp-hpage-dots{position:absolute}
.mysp-hpage.mysp-hpage-fp .mysp-hpage-dots{position:absolute}
.mysp-hpage-fp .mysp-hpage-section{height:100%;display:flex;flex-direction:column;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;padding:84px calc(6vw + 24px) 40px 6vw}
.mysp-hpage-fp .mysp-hpage-section::-webkit-scrollbar{display:none}
.mysp-hpage-fp .mysp-hpage-section-inner{margin:auto;width:100%}
.mysp-hpage-fp .mysp-hpage-cta{height:100%;display:flex;align-items:center;justify-content:center;padding:84px 6vw 40px}
.mysp-hpage-fp .mysp-hpage-head{margin-bottom:clamp(18px,3vh,36px)}
.mysp-hpage-fp .mysp-hpage-head h2,.mysp-hpage-fp .mysp-hpage-copy h2{font-size:clamp(1.6rem,3.4vw,2.6rem)}
.mysp-hpage-fp .mysp-hpage-grid{gap:16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.mysp-hpage-fp .mysp-hpage-item{padding:20px 18px}
.mysp-hpage-fp .mysp-hpage-product{padding:0 0 18px}
.mysp-hpage-fp .mysp-hpage-item-img{aspect-ratio:16/9}
.mysp-hpage-fp .mysp-hpage-emoji{font-size:3rem}
.mysp-hpage-fp .mysp-hpage-media{max-height:56vh}
.mysp-hpage-reduce .mysp-hpage-slides{transition:none}
@media(max-width:800px){
  .mysp-hpage .mysp-hpage-dots{right:8px;gap:13px}
  .mysp-hpage .mysp-hpage-dots button::after{display:none}
  .mysp-hpage-fp .mysp-hpage-section{padding:76px calc(5vw + 18px) 32px 5vw}
  .mysp-hpage-fp .mysp-hpage-media{max-height:34vh}
}

/* ===== v0.5: header & footer tema WP ikut tampil ===== */
.mysp-hpage-has-wp-header .mysp-hpage-nav{display:none}
.mysp-hpage-fp.mysp-hpage-has-wp-header .mysp-hpage-section,.mysp-hpage-fp.mysp-hpage-has-wp-header .mysp-hpage-cta{padding-top:36px}
.mysp-hpage-fp .mysp-hpage-footer{position:relative;max-height:80%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;text-align:left;z-index:3;box-shadow:0 -12px 40px rgba(0,0,0,.35)}
.mysp-hpage-footer *{box-sizing:border-box}
.mysp-hpage-footer a{text-decoration:revert}

/* ===== v0.6: section slider gambar ===== */
.mysp-hpage-type-products .mysp-hpage-section-inner,.mysp-hpage-type-features .mysp-hpage-section-inner,.mysp-hpage-type-testimonials .mysp-hpage-section-inner,.mysp-hpage-type-slider .mysp-hpage-section-inner,.mysp-hpage-type-faq .mysp-hpage-section-inner,.mysp-hpage-type-stats .mysp-hpage-section-inner,.mysp-hpage-type-logos .mysp-hpage-section-inner,.mysp-hpage-type-pricing .mysp-hpage-section-inner,.mysp-hpage-type-gallery .mysp-hpage-section-inner,.mysp-hpage-type-video .mysp-hpage-section-inner,.mysp-hpage-type-team .mysp-hpage-section-inner,.mysp-hpage-type-countdown .mysp-hpage-section-inner,.mysp-hpage-type-form .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);gap:0}
.mysp-hpage-sl{position:relative;width:100%;height:clamp(260px,56vh,560px);border-radius:22px;overflow:hidden;background:#06100d;box-shadow:0 30px 70px rgba(0,0,0,.5);touch-action:pan-y;outline:none}
.mysp-hpage-sl:focus-visible{box-shadow:0 0 0 3px var(--mysp-hpage-accent),0 30px 70px rgba(0,0,0,.5)}
.mysp-hpage-sl-track{position:absolute;inset:0}
.mysp-hpage-sl-item{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transition:opacity 1s ease,visibility 0s 1s}
.mysp-hpage-sl-item.is-active{opacity:1;visibility:visible;z-index:1;transition:opacity 1s ease}
.mysp-hpage-sl-item img{width:100%;height:100%;object-fit:cover;display:block}
/* Mode mobile 16:9: gambar utuh (landscape); tinggi section mengikuti gambar, wave & section berikutnya menempel */
@media(max-width:800px){
.mysp-hpage-section.mysp-hpage-type-slider.mysp-hpage-slm{min-height:0}
.mysp-hpage-type-slider.mysp-hpage-slm .mysp-hpage-section-inner{position:relative;inset:auto;display:block}
.mysp-hpage-type-slider.mysp-hpage-slm .mysp-hpage-sl{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:16/9;border-radius:0}
.mysp-hpage-type-slider.mysp-hpage-slm.has-shape{padding-bottom:var(--sh)}
.mysp-hpage-fp .mysp-hpage-type-slider.mysp-hpage-slm .mysp-hpage-section-inner{position:absolute;inset:0}
.mysp-hpage-fp .mysp-hpage-type-slider.mysp-hpage-slm .mysp-hpage-sl{position:absolute;inset:0;width:auto;height:auto;aspect-ratio:auto}
.mysp-hpage-type-slider.mysp-hpage-slm .mysp-hpage-head{padding:14px 5vw 28px}
.mysp-hpage-type-slider.mysp-hpage-slm .mysp-hpage-head h2{font-size:1.1rem;margin:0 0 4px}
.mysp-hpage-type-slider.mysp-hpage-slm .mysp-hpage-head .mysp-hpage-text{font-size:.8rem;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mysp-hpage-sl.is-mfull .mysp-hpage-sl-item::before{content:"";position:absolute;inset:-24px;background:var(--sl-bg,none) center/cover no-repeat;filter:blur(22px) brightness(.55);transform:translateZ(0)}
.mysp-hpage-sl.is-mfull .mysp-hpage-sl-item img{position:relative;object-fit:contain}
.mysp-hpage-sl.is-mfull .mysp-hpage-sl-item figcaption{padding:26px 44px 22px}
.mysp-hpage-sl.is-mfull .mysp-hpage-sl-item figcaption h3{font-size:1rem;margin-bottom:4px}
.mysp-hpage-sl.is-mfull .mysp-hpage-sl-item figcaption p{font-size:.82rem;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
}
.mysp-hpage-sl-art{width:100%;height:100%;display:grid;place-items:center;background:radial-gradient(circle at 50% 38%,rgba(212,175,55,.28),transparent 62%),linear-gradient(135deg,var(--mysp-hpage-primary),var(--mysp-hpage-bg))}
.mysp-hpage-sl-art span{font-size:clamp(4rem,14vw,9rem);line-height:1;margin-bottom:8%;filter:drop-shadow(0 10px 20px rgba(0,0,0,.35));animation:mysp-hpage-bob2 3.6s ease-in-out infinite alternate}
.mysp-hpage-sl-item figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:clamp(46px,8vw,90px) clamp(52px,7vw,84px) clamp(40px,6vh,56px);background:linear-gradient(to top,rgba(3,12,9,.86),rgba(3,12,9,0));color:#fff;text-align:left}
.mysp-hpage-sl-item figcaption h3{margin:0 0 6px;font-size:clamp(1.2rem,2.6vw,1.9rem);line-height:1.2;color:#fff}
.mysp-hpage-sl-item figcaption p{margin:0 0 14px;max-width:560px;opacity:.92;color:#fff}
.mysp-hpage-sl-item.is-active figcaption>*{animation:mysp-hpage-rise .8s .35s cubic-bezier(.2,.7,.2,1) both}
.mysp-hpage-sl-item.is-active figcaption>*:nth-child(2){animation-delay:.45s}
.mysp-hpage-sl-item.is-active figcaption>*:nth-child(3){animation-delay:.55s}

.mysp-hpage .mysp-hpage-sl button{appearance:none;-webkit-appearance:none;margin:0;border:0;cursor:pointer}
.mysp-hpage .mysp-hpage-sl-prev,.mysp-hpage .mysp-hpage-sl-next{position:absolute;top:50%;z-index:4;width:44px;height:44px;margin-top:-22px;padding:0;border-radius:50%;background:rgba(5,8,20,.45);color:#fff;font-size:1.05rem;line-height:44px;text-align:center;backdrop-filter:blur(6px);transition:background .25s,transform .25s,color .25s}
.mysp-hpage .mysp-hpage-sl-prev{left:14px}
.mysp-hpage .mysp-hpage-sl-next{right:14px}
.mysp-hpage .mysp-hpage-sl-prev:hover,.mysp-hpage .mysp-hpage-sl-next:hover,.mysp-hpage .mysp-hpage-sl-prev:focus-visible,.mysp-hpage .mysp-hpage-sl-next:focus-visible{background:var(--mysp-hpage-accent);color:#10201a;transform:scale(1.1);outline:none}
.mysp-hpage-sl-dots{position:absolute;left:0;right:0;bottom:16px;z-index:4;display:flex;justify-content:center;gap:8px;pointer-events:none}
.mysp-hpage .mysp-hpage-sl-dots button{pointer-events:auto;width:9px;height:9px;min-width:0;min-height:0;padding:0;border-radius:99px;background:rgba(255,255,255,.5);transition:width .35s,background .35s}
.mysp-hpage .mysp-hpage-sl-dots button.is-active{width:28px;background:var(--mysp-hpage-accent)}
.mysp-hpage-sl-bar{position:absolute;left:0;right:0;bottom:0;height:3px;z-index:4;background:rgba(255,255,255,.14)}
.mysp-hpage-sl-bar span{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(0);background:var(--mysp-hpage-accent);transition:transform .1s linear}
@media(max-width:800px){
  .mysp-hpage-sl{height:clamp(240px,46vh,420px);border-radius:16px}
  .mysp-hpage .mysp-hpage-sl-prev,.mysp-hpage .mysp-hpage-sl-next{width:36px;height:36px;margin-top:-18px;line-height:36px}
  .mysp-hpage-sl-item figcaption{padding:44px 54px 38px 18px}
}

/* ===== v0.7: slider gambar full section, full width ===== */
.mysp-hpage-section.mysp-hpage-type-slider{padding:0;min-height:clamp(440px,88vh,860px)}
.mysp-hpage-type-slider .mysp-hpage-section-inner{position:absolute;inset:0;max-width:none;width:auto;margin:0;display:block}
.mysp-hpage-type-slider .mysp-hpage-sl{position:absolute;inset:0;width:auto;height:auto;border-radius:0;box-shadow:none}
.mysp-hpage-type-slider .mysp-hpage-sl:focus-visible{box-shadow:inset 0 0 0 3px var(--mysp-hpage-accent)}
.mysp-hpage-type-slider .mysp-hpage-head{position:absolute;top:0;left:0;right:0;z-index:5;max-width:none;margin:0;padding:clamp(84px,13vh,120px) 6vw clamp(40px,7vh,80px);background:linear-gradient(to bottom,rgba(3,12,9,.72),rgba(3,12,9,0));pointer-events:none}
.mysp-hpage .mysp-hpage-type-slider .mysp-hpage-head h2,.mysp-hpage .mysp-hpage-type-slider .mysp-hpage-head .mysp-hpage-text,.mysp-hpage .mysp-hpage-type-slider .mysp-hpage-head .mysp-hpage-text p{color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.mysp-hpage-type-slider .mysp-hpage-sl-item figcaption{padding-left:clamp(56px,8vw,110px);padding-right:clamp(56px,8vw,110px)}
.mysp-hpage-fp .mysp-hpage-section.mysp-hpage-type-slider{padding:0;min-height:0;height:100%;overflow:hidden;display:block}
.mysp-hpage-fp .mysp-hpage-type-slider .mysp-hpage-section-inner{margin:0;width:auto}
.mysp-hpage-fp.mysp-hpage-has-wp-header .mysp-hpage-section.mysp-hpage-type-slider{padding-top:0}
.mysp-hpage-fp .mysp-hpage-type-slider .mysp-hpage-sl-next{right:60px}
@media(max-width:800px){
  .mysp-hpage-section.mysp-hpage-type-slider{min-height:clamp(380px,78vh,640px)}
  .mysp-hpage-type-slider .mysp-hpage-head{padding:76px 5vw 36px}
  .mysp-hpage-type-slider .mysp-hpage-sl-item figcaption{padding:44px 54px 38px 18px}
  .mysp-hpage-fp .mysp-hpage-section.mysp-hpage-type-slider{padding:0}
}

/* ===== v0.8: tombol kembali ke atas ===== */
.mysp-hpage .mysp-hpage-top{position:fixed;right:20px;bottom:20px;z-index:94;width:46px;height:46px;min-width:0;min-height:0;padding:0;margin:0;border:0;border-radius:50%;display:grid;place-items:center;cursor:pointer;appearance:none;-webkit-appearance:none;background:var(--mysp-hpage-accent);color:#10201a;box-shadow:0 8px 22px rgba(0,0,0,.35);opacity:0;visibility:hidden;transform:translateY(14px);transition:opacity .3s,transform .3s,visibility 0s .3s,box-shadow .25s}
.mysp-hpage .mysp-hpage-top.has-wa{bottom:90px}
.mysp-hpage .mysp-hpage-top.is-show{opacity:1;visibility:visible;transform:none;transition:opacity .3s,transform .3s,box-shadow .25s}
.mysp-hpage .mysp-hpage-top:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,.45)}
.mysp-hpage .mysp-hpage-top:focus-visible{outline:3px solid #fff;outline-offset:2px}
.mysp-hpage-fp .mysp-hpage-top{position:absolute}
@media(max-width:800px){.mysp-hpage .mysp-hpage-top{right:16px;bottom:16px;width:42px;height:42px}.mysp-hpage .mysp-hpage-top.has-wa{bottom:84px}}

/* ===== v0.9: section FAQ ===== */
.mysp-hpage-type-faq .mysp-hpage-section-inner{max-width:820px}
.mysp-hpage-faq{display:grid;gap:12px;width:100%}
.mysp-hpage-faq-item{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:16px;overflow:hidden;transition:background .3s,border-color .3s,box-shadow .3s,opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.mysp-hpage-light .mysp-hpage-faq-item{background:#fff;border-color:rgba(0,0,0,.06);box-shadow:0 8px 26px rgba(60,45,10,.1)}
.mysp-hpage-decor-islamic .mysp-hpage-faq-item{border-color:rgba(212,175,55,.28)}
.mysp-hpage-faq-item[open]{border-color:var(--mysp-hpage-accent)}
.mysp-hpage-faq-item summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;cursor:pointer;font-weight:700;font-size:1.05rem;line-height:1.35;text-align:left;outline:none}
.mysp-hpage-faq-item summary::-webkit-details-marker{display:none}
.mysp-hpage-faq-item summary:focus-visible{box-shadow:inset 0 0 0 2px var(--mysp-hpage-accent);border-radius:16px}
.mysp-hpage-faq-item summary:hover .mysp-hpage-faq-q{color:var(--mysp-hpage-accent)}
.mysp-hpage-light .mysp-hpage-faq-item summary:hover .mysp-hpage-faq-q{color:var(--mysp-hpage-primary)}
.mysp-hpage-faq-ico{position:relative;flex:none;width:28px;height:28px;border-radius:50%;background:var(--mysp-hpage-accent);transition:transform .35s}
.mysp-hpage-faq-ico::before,.mysp-hpage-faq-ico::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;border-radius:2px;background:#10201a;transition:transform .35s}
.mysp-hpage-faq-ico::after{transform:rotate(90deg)}
.mysp-hpage-faq-item[open] .mysp-hpage-faq-ico{transform:rotate(180deg)}
.mysp-hpage-faq-item[open] .mysp-hpage-faq-ico::after{transform:rotate(0)}
.mysp-hpage-faq-a{padding:0 22px 20px;text-align:left;opacity:.9;line-height:1.7}
.mysp-hpage-faq-a p{margin:0 0 .8em}
.mysp-hpage-faq-a p:last-child{margin-bottom:0}
.mysp-hpage-faq-item[open] .mysp-hpage-faq-a{animation:mysp-hpage-faq-in .4s ease both}
@keyframes mysp-hpage-faq-in{from{opacity:0;transform:translateY(-8px)}to{opacity:.9;transform:none}}
.mysp-hpage-reduce .mysp-hpage-faq-item[open] .mysp-hpage-faq-a{animation:none}
@media(max-width:800px){.mysp-hpage-faq-item summary{padding:15px 16px;font-size:1rem}.mysp-hpage-faq-a{padding:0 16px 16px}}

/* ===== v0.10: section statistik (counter) ===== */
.mysp-hpage-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:clamp(20px,3.5vw,44px);width:100%}
.mysp-hpage-stat{position:relative;text-align:center;padding:10px 8px}
.mysp-hpage-stat+.mysp-hpage-stat::before{content:"";position:absolute;left:calc(clamp(20px,3.5vw,44px) / -2);top:18%;bottom:18%;width:1px;background:currentColor;opacity:.14}
.mysp-hpage-stat-ico{display:block;font-size:2rem;line-height:1;margin-bottom:10px}
.mysp-hpage-stat-num{font-family:var(--mysp-hpage-font-h,inherit);font-weight:800;font-size:clamp(2.4rem,6vw,4.4rem);line-height:1.05;letter-spacing:-.01em;color:var(--mysp-hpage-accent);font-variant-numeric:tabular-nums;text-shadow:0 6px 30px rgba(212,175,55,.25)}
.mysp-hpage-light .mysp-hpage-stat-num{color:var(--mysp-hpage-primary);text-shadow:none}
.mysp-hpage-stat-fix{font-size:.55em;font-weight:700;margin:0 .12em;vertical-align:.18em}
.mysp-hpage-stat h3{margin:10px 0 4px;font-size:clamp(1rem,1.6vw,1.2rem)}
.mysp-hpage-stat p{margin:0;opacity:.8;font-size:.95rem}
@media(max-width:800px){
  .mysp-hpage-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 14px}
  .mysp-hpage-stat+.mysp-hpage-stat::before{display:none}
}

/* ===== v0.11: section kontak & lokasi ===== */
.mysp-hpage-ct-list{list-style:none;margin:22px 0 26px;padding:0;display:grid;gap:16px;text-align:left}
.mysp-hpage-ct-list li{display:flex;gap:14px;align-items:flex-start}
.mysp-hpage-ct-ico{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;font-size:1.2rem;background:rgba(255,255,255,.08);border:1px solid rgba(212,175,55,.4)}
.mysp-hpage-light .mysp-hpage-ct-ico{background:#fff;box-shadow:0 6px 18px rgba(60,45,10,.12);border-color:rgba(0,0,0,.06)}
.mysp-hpage-ct-list strong{display:block;margin-bottom:2px;font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;color:var(--mysp-hpage-accent)}
.mysp-hpage-light .mysp-hpage-ct-list strong{color:var(--mysp-hpage-primary)}
.mysp-hpage-ct-val{display:block;line-height:1.55;word-break:break-word}
.mysp-hpage-ct-val a{color:inherit;text-decoration:underline;text-decoration-color:rgba(212,175,55,.55);text-underline-offset:3px;transition:color .25s}
.mysp-hpage-ct-val a:hover{color:var(--mysp-hpage-accent)}
.mysp-hpage-light .mysp-hpage-ct-val a:hover{color:var(--mysp-hpage-primary)}
.mysp-hpage-map{border-radius:22px;overflow:hidden;aspect-ratio:4/3;min-height:260px;background:#0d1a15;box-shadow:0 30px 70px rgba(0,0,0,.5)}
.mysp-hpage-map iframe{display:block;width:100%;height:100%;border:0}
.mysp-hpage-type-contact.mysp-hpage-nomap .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);max-width:720px}
.mysp-hpage-layout-center.mysp-hpage-type-contact .mysp-hpage-ct-list{max-width:520px;margin-left:auto;margin-right:auto}
.mysp-hpage-layout-center.mysp-hpage-type-contact .mysp-hpage-map{margin-top:30px;aspect-ratio:16/9}
.mysp-hpage-fp .mysp-hpage-map{max-height:56vh}
@media(max-width:800px){
  .mysp-hpage-map{aspect-ratio:4/3;min-height:220px}
  .mysp-hpage-fp .mysp-hpage-map{max-height:34vh;min-height:180px}
  .mysp-hpage-ct-ico{width:40px;height:40px}
}

/* ===== v0.12: section logo / partner ===== */
.mysp-hpage-section.mysp-hpage-type-logos{padding-top:clamp(54px,9vh,100px);padding-bottom:clamp(54px,9vh,100px)}
.mysp-hpage-type-logos .mysp-hpage-head{margin-bottom:clamp(22px,4vw,40px)}
.mysp-hpage-logos{overflow:hidden;width:100%;-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}
.mysp-hpage-logos-track{display:flex;width:max-content;animation:mysp-hpage-logos var(--d,30s) linear infinite;will-change:transform}
.mysp-hpage-logos:hover .mysp-hpage-logos-track{animation-play-state:paused}
.mysp-hpage-logos-set{display:flex;flex:none;align-items:center;gap:clamp(18px,3vw,36px);padding-right:clamp(18px,3vw,36px)}
@keyframes mysp-hpage-logos{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mysp-hpage-logo{flex:none;display:flex;align-items:center;justify-content:center;height:clamp(56px,7vw,76px);padding:10px clamp(16px,2.4vw,28px);border-radius:14px;background:#fff;box-shadow:0 8px 22px rgba(0,0,0,.18);color:#1d2b26;text-decoration:none;transition:transform .3s,box-shadow .3s}
a.mysp-hpage-logo:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(0,0,0,.28)}
.mysp-hpage-logo img{display:block;height:100%;width:auto;max-width:170px;object-fit:contain;filter:grayscale(1);opacity:.75;transition:filter .3s,opacity .3s}
.mysp-hpage-logo:hover img{filter:none;opacity:1}
.mysp-hpage-logo-txt{font-weight:800;font-size:1.05rem;letter-spacing:.02em;white-space:nowrap}
.mysp-hpage-logos.is-static{-webkit-mask-image:none;mask-image:none}
.mysp-hpage-logos.is-static .mysp-hpage-logos-track{animation:none;width:100%;justify-content:center}
.mysp-hpage-logos.is-static .mysp-hpage-logos-set{flex-wrap:wrap;justify-content:center;padding-right:0}
.mysp-hpage-reduce .mysp-hpage-logos{-webkit-mask-image:none;mask-image:none}
.mysp-hpage-reduce .mysp-hpage-logos-track{animation:none;width:100%;justify-content:center}
.mysp-hpage-reduce .mysp-hpage-logos-set{flex-wrap:wrap;justify-content:center;padding-right:0}
.mysp-hpage-reduce .mysp-hpage-logos-set[aria-hidden="true"]{display:none}
@media(max-width:800px){.mysp-hpage-logo img{max-width:130px}}

/* ===== v0.13: section harga / paket ===== */
.mysp-hpage-plans{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));align-items:stretch;gap:clamp(18px,2.4vw,28px)}
.mysp-hpage-plan{display:flex;flex-direction:column;text-align:left;padding:32px 26px 26px}
.mysp-hpage-plan h3{margin:0 0 4px;font-size:1.3rem}
.mysp-hpage-plan-ico{display:block;font-size:1.9rem;line-height:1;margin-bottom:10px}
.mysp-hpage-plan-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;margin:10px 0 18px}
.mysp-hpage-plan-amt{font-family:var(--mysp-hpage-font-h,inherit);font-weight:800;font-size:clamp(1.9rem,3.2vw,2.6rem);line-height:1.1;color:var(--mysp-hpage-accent)}
.mysp-hpage-light .mysp-hpage-plan-amt{color:var(--mysp-hpage-primary)}
.mysp-hpage-plan-per{font-size:.95rem;opacity:.7}
.mysp-hpage-plan-feat{list-style:none;margin:0 0 24px;padding:18px 0 0;border-top:1px solid rgba(255,255,255,.14);display:grid;gap:10px;flex:1}
.mysp-hpage-light .mysp-hpage-plan-feat{border-top-color:rgba(0,0,0,.08)}
.mysp-hpage-plan-feat li{position:relative;padding-left:26px;line-height:1.45;font-size:.98rem}
.mysp-hpage-plan-feat li::before{content:"\2713";position:absolute;left:0;top:0;font-weight:800;color:var(--mysp-hpage-accent)}
.mysp-hpage-light .mysp-hpage-plan-feat li::before{color:var(--mysp-hpage-primary)}
.mysp-hpage-plan-feat li.is-off{opacity:.45;text-decoration:line-through}
.mysp-hpage-plan-feat li.is-off::before{content:"\2715";color:inherit}
.mysp-hpage-plan .mysp-hpage-btn{display:block;width:100%;text-align:center;margin-top:auto;box-sizing:border-box}
.mysp-hpage-plan.is-featured{border-color:var(--mysp-hpage-accent);background:linear-gradient(160deg,rgba(212,175,55,.18),rgba(255,255,255,.05));box-shadow:0 0 0 1px var(--mysp-hpage-accent),0 26px 60px rgba(0,0,0,.4);padding-top:38px}
.mysp-hpage-light .mysp-hpage-plan.is-featured{background:linear-gradient(160deg,#fffbe9,#fff);box-shadow:0 0 0 1px var(--mysp-hpage-accent),0 24px 50px rgba(120,90,10,.2)}
.mysp-hpage-plan-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);white-space:nowrap;padding:5px 16px;border-radius:99px;background:var(--mysp-hpage-accent);color:#10201a;font-weight:800;font-size:.74rem;letter-spacing:.09em;text-transform:uppercase;box-shadow:0 6px 16px rgba(0,0,0,.3)}
.mysp-hpage-fp .mysp-hpage-plans{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.mysp-hpage-fp .mysp-hpage-plan{padding:26px 20px 20px}

/* ===== v0.14: section galeri grid + lightbox ===== */
.mysp-hpage-gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;grid-auto-flow:dense;width:100%}
.mysp-hpage-gal-item{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;border-radius:16px;background:#0d1a15;box-shadow:0 12px 30px rgba(0,0,0,.28);cursor:zoom-in;outline:none;transition:box-shadow .3s,opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1),filter .9s cubic-bezier(.2,.7,.2,1)}
.mysp-hpage-gal-item img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1),filter .4s}
.mysp-hpage-gal-item::after{content:"\2922";position:absolute;right:12px;top:12px;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:rgba(5,8,20,.5);color:#fff;font-size:1rem;opacity:0;transform:scale(.8);transition:opacity .3s,transform .3s;backdrop-filter:blur(4px)}
.mysp-hpage-gal-item:hover img,.mysp-hpage-gal-item:focus-visible img{transform:scale(1.08)}
.mysp-hpage-gal-item:hover::after,.mysp-hpage-gal-item:focus-visible::after{opacity:1;transform:none}
.mysp-hpage-gal-item:focus-visible{box-shadow:0 0 0 3px var(--mysp-hpage-accent),0 12px 30px rgba(0,0,0,.28)}
.mysp-hpage-gal-cap{position:absolute;left:0;right:0;bottom:0;padding:34px 14px 12px;color:#fff;font-weight:700;font-size:.95rem;line-height:1.3;text-align:left;background:linear-gradient(to top,rgba(3,12,9,.82),rgba(3,12,9,0));transform:translateY(100%);transition:transform .35s}
.mysp-hpage-gal-item:hover .mysp-hpage-gal-cap,.mysp-hpage-gal-item:focus-visible .mysp-hpage-gal-cap{transform:none}
@media(hover:none){.mysp-hpage-gal-cap{transform:none}.mysp-hpage-gal-item::after{display:none}}
@media(min-width:801px){
  .mysp-hpage-gal.has-big .mysp-hpage-gal-item:nth-child(7n+1){grid-column:span 2;grid-row:span 2}
}
@media(max-width:800px){.mysp-hpage-gal{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}
.mysp-hpage-fp .mysp-hpage-gal{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}

.mysp-hpage-lb{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:clamp(16px,4vw,56px);background:rgba(3,8,6,.92);opacity:0;transition:opacity .28s;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.mysp-hpage-lb[hidden]{display:none}
.mysp-hpage-lb.is-open{opacity:1}
.mysp-hpage-lb-fig{margin:0;max-width:100%;max-height:100%;display:flex;flex-direction:column;align-items:center;gap:12px;color:#fff}
.mysp-hpage-lb-fig img{display:block;max-width:100%;max-height:calc(100vh - 150px);width:auto;height:auto;border-radius:10px;box-shadow:0 24px 80px rgba(0,0,0,.6);transition:opacity .25s}
.mysp-hpage-lb.is-loading .mysp-hpage-lb-fig img{opacity:.25}
.mysp-hpage-lb-fig figcaption{display:none;max-width:720px;text-align:center;line-height:1.5}
.mysp-hpage-lb.has-cap .mysp-hpage-lb-fig figcaption{display:block}
.mysp-hpage-lb-fig figcaption strong{display:block;font-size:1.05rem}
.mysp-hpage-lb-fig figcaption span{display:block;opacity:.8;font-size:.92rem}
.mysp-hpage-lb-count{position:absolute;left:0;right:0;bottom:14px;text-align:center;color:rgba(255,255,255,.7);font-size:.85rem;pointer-events:none}
.mysp-hpage .mysp-hpage-lb button{appearance:none;-webkit-appearance:none;margin:0;padding:0;border:0;cursor:pointer;color:#fff;background:rgba(255,255,255,.12);border-radius:50%;display:grid;place-items:center;transition:background .25s,transform .25s,color .25s}
.mysp-hpage .mysp-hpage-lb button:hover,.mysp-hpage .mysp-hpage-lb button:focus-visible{background:var(--mysp-hpage-accent);color:#10201a;outline:none}
.mysp-hpage .mysp-hpage-lb-close{position:absolute;top:14px;right:14px;width:44px;height:44px;font-size:1.9rem;line-height:1}
.mysp-hpage .mysp-hpage-lb-prev,.mysp-hpage .mysp-hpage-lb-next{position:absolute;top:50%;width:46px;height:46px;margin-top:-23px;font-size:1.1rem}
.mysp-hpage .mysp-hpage-lb-prev{left:14px}
.mysp-hpage .mysp-hpage-lb-next{right:14px}
.mysp-hpage-lb.is-single .mysp-hpage-lb-prev,.mysp-hpage-lb.is-single .mysp-hpage-lb-next,.mysp-hpage-lb.is-single .mysp-hpage-lb-count{display:none}
.mysp-hpage-reduce .mysp-hpage-lb,.mysp-hpage-reduce .mysp-hpage-lb *{transition:none!important}
@media(max-width:800px){.mysp-hpage .mysp-hpage-lb-prev,.mysp-hpage .mysp-hpage-lb-next{width:38px;height:38px;margin-top:-19px}.mysp-hpage-lb-fig img{max-height:calc(100vh - 130px)}}

/* ===== v0.15: section video ===== */
.mysp-hpage-vids{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:24px;width:100%}
.mysp-hpage-vids.is-solo{grid-template-columns:minmax(0,1fr);max-width:960px;margin:0 auto}
.mysp-hpage-vid{margin:0;min-width:0}
.mysp-hpage-vid-frame{position:relative;aspect-ratio:16/9;border-radius:22px;overflow:hidden;background:#06100d;box-shadow:0 30px 70px rgba(0,0,0,.5)}
.mysp-hpage-vid-frame video,.mysp-hpage-vid-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;background:#000}
.mysp-hpage .mysp-hpage-vid-play{position:absolute;inset:0;z-index:1;display:grid;place-items:center;text-decoration:none;cursor:pointer;background:radial-gradient(circle at 50% 40%,rgba(212,175,55,.28),transparent 62%),linear-gradient(135deg,var(--mysp-hpage-primary),var(--mysp-hpage-bg));background-size:cover;background-position:center;outline:none}
.mysp-hpage .mysp-hpage-vid-play[hidden]{display:none}
.mysp-hpage-vid-play::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(3,12,9,.55),rgba(3,12,9,.12));transition:opacity .3s}
.mysp-hpage-vid-play:hover::before{opacity:.6}
.mysp-hpage-vid-btn{position:relative;width:76px;height:76px;border-radius:50%;display:grid;place-items:center;background:var(--mysp-hpage-accent);color:#10201a;box-shadow:0 10px 30px rgba(0,0,0,.45);transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.mysp-hpage-vid-btn svg{margin-left:4px}
.mysp-hpage-vid-btn::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--mysp-hpage-accent);animation:mysp-hpage-vid-ring 2.4s ease-out infinite}
.mysp-hpage-vid-play:hover .mysp-hpage-vid-btn,.mysp-hpage-vid-play:focus-visible .mysp-hpage-vid-btn{transform:scale(1.12)}
.mysp-hpage-vid-play:focus-visible{box-shadow:inset 0 0 0 3px var(--mysp-hpage-accent)}
@keyframes mysp-hpage-vid-ring{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.7);opacity:0}}
.mysp-hpage-reduce .mysp-hpage-vid-btn::after{animation:none;display:none}
.mysp-hpage-vid-cap{padding-top:14px;text-align:left}
.mysp-hpage-vid-cap h3{margin:0 0 4px;font-size:1.1rem;line-height:1.3;color:inherit}
.mysp-hpage-vid-cap p{margin:0;opacity:.8;font-size:.95rem;line-height:1.5;color:inherit}
.mysp-hpage-vids.is-solo .mysp-hpage-vid-cap{text-align:center}
.mysp-hpage-fp .mysp-hpage-vids{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px}
.mysp-hpage-fp .mysp-hpage-vids.is-solo{max-width:min(960px,max(300px,calc((100vh - 300px) * 1.7778)))}
@media(max-width:800px){
  .mysp-hpage-vid-frame{border-radius:16px}
  .mysp-hpage-vid-btn{width:60px;height:60px}
  .mysp-hpage-fp .mysp-hpage-vids.is-solo{max-width:100%}
}

/* ===== v0.16: section tim ===== */
.mysp-hpage-team{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.mysp-hpage-member{text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px}
.mysp-hpage-member-photo{position:relative;width:132px;height:132px;margin:0 auto 12px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:linear-gradient(135deg,var(--mysp-hpage-primary),var(--mysp-hpage-bg));box-shadow:0 0 0 3px var(--mysp-hpage-accent),0 14px 30px rgba(0,0,0,.35);transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.mysp-hpage-member:hover .mysp-hpage-member-photo{transform:scale(1.05)}
.mysp-hpage-member-photo img{display:block;width:100%;height:100%;object-fit:cover}
.mysp-hpage-member-ini{font-size:2.8rem;font-weight:800;line-height:1;color:#fff}
.mysp-hpage-member h3{margin:0}
.mysp-hpage-member-role{color:var(--mysp-hpage-accent);font-weight:700;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase}
.mysp-hpage-light .mysp-hpage-member-role{color:var(--mysp-hpage-primary)}
.mysp-hpage-member p{margin:6px 0 10px;opacity:.85;font-size:.95rem;line-height:1.5}
.mysp-hpage-member .mysp-hpage-btn{margin-top:auto}
.mysp-hpage-fp .mysp-hpage-team{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.mysp-hpage-fp .mysp-hpage-member-photo{width:96px;height:96px;margin-bottom:8px}
@media(max-width:800px){.mysp-hpage-member-photo{width:108px;height:108px}}

/* ===== v0.17: section countdown ===== */
.mysp-hpage-cd{text-align:center;width:100%}
.mysp-hpage-cd-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,2vw,22px);max-width:760px;margin:0 auto}
.mysp-hpage-cd-box{position:relative;padding:clamp(16px,3vw,30px) 8px clamp(12px,2vw,20px);border-radius:20px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);box-shadow:0 18px 40px rgba(0,0,0,.28);overflow:hidden}
.mysp-hpage-cd-box::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--mysp-hpage-primary),var(--mysp-hpage-accent))}
.mysp-hpage-light .mysp-hpage-cd-box{background:#fff;border-color:rgba(0,0,0,.08);box-shadow:0 14px 32px rgba(60,50,20,.16)}
.mysp-hpage-cd-num{display:block;font-family:var(--mysp-hpage-font-h,inherit);font-weight:800;font-size:clamp(2rem,7vw,4.2rem);line-height:1;font-variant-numeric:tabular-nums;color:var(--mysp-hpage-accent)}
.mysp-hpage-light .mysp-hpage-cd-num{color:var(--mysp-hpage-primary)}
.mysp-hpage-cd-num.is-tick{animation:mysp-hpage-cd-tick .45s cubic-bezier(.2,.7,.2,1)}
@keyframes mysp-hpage-cd-tick{0%{transform:translateY(-35%);opacity:0}100%{transform:none;opacity:1}}
.mysp-hpage-reduce .mysp-hpage-cd-num.is-tick{animation:none}
.mysp-hpage-cd-lbl{display:block;margin-top:10px;font-size:clamp(.68rem,1.6vw,.85rem);font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.75}
.mysp-hpage-cd-done{display:none;margin:0;font-size:clamp(1.3rem,3.4vw,2.2rem);font-weight:800;color:var(--mysp-hpage-accent)}
.mysp-hpage-light .mysp-hpage-cd-done{color:var(--mysp-hpage-primary)}
.mysp-hpage-cd.is-done .mysp-hpage-cd-grid{display:none}
.mysp-hpage-cd.is-done .mysp-hpage-cd-done{display:block}
.mysp-hpage-cd .mysp-hpage-btn{margin-top:clamp(20px,4vh,34px)}
.mysp-hpage-fp .mysp-hpage-cd-num{font-size:clamp(1.8rem,5.5vw,3.4rem)}
@media(max-width:520px){.mysp-hpage-cd-box{border-radius:14px}.mysp-hpage-cd-lbl{letter-spacing:.06em}}

/* ===== v0.18: section form / newsletter ===== */
.mysp-hpage-formwrap{width:100%;max-width:560px;margin:0 auto}
.mysp-hpage-form{display:grid;gap:14px;padding:clamp(20px,4vw,34px);border-radius:22px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);box-shadow:0 24px 60px rgba(0,0,0,.32);text-align:left}
.mysp-hpage-light .mysp-hpage-form{background:#fff;border-color:rgba(0,0,0,.08);box-shadow:0 18px 44px rgba(60,50,20,.16)}
.mysp-hpage-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.mysp-hpage-field{display:grid;gap:6px}
.mysp-hpage-field label{font-weight:700;font-size:.9rem}
.mysp-hpage-field label b{color:var(--mysp-hpage-accent)}
.mysp-hpage .mysp-hpage-field input,.mysp-hpage .mysp-hpage-field textarea{width:100%;box-sizing:border-box;margin:0;padding:13px 15px;border-radius:12px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:inherit;font:inherit;font-size:1rem;line-height:1.4;transition:border-color .25s,box-shadow .25s,background .25s}
.mysp-hpage .mysp-hpage-field textarea{resize:vertical;min-height:110px}
.mysp-hpage-light .mysp-hpage-field input,.mysp-hpage-light .mysp-hpage-field textarea{background:#f6f6f2;border-color:rgba(0,0,0,.16);color:var(--mysp-hpage-dark)}
.mysp-hpage .mysp-hpage-field input::placeholder,.mysp-hpage .mysp-hpage-field textarea::placeholder{color:inherit;opacity:.5}
.mysp-hpage .mysp-hpage-field input:focus,.mysp-hpage .mysp-hpage-field textarea:focus{outline:none;border-color:var(--mysp-hpage-accent);box-shadow:0 0 0 3px rgba(212,175,55,.3)}
.mysp-hpage .mysp-hpage-field input.is-bad,.mysp-hpage .mysp-hpage-field textarea.is-bad{border-color:#e5484d}
.mysp-hpage-form-btn{justify-self:start;cursor:pointer;border:0}
.mysp-hpage-form-btn[disabled]{opacity:.6;cursor:progress}
.mysp-hpage-form-msg{margin:0;min-height:1.2em;font-size:.92rem;color:#ff8a8f}
.mysp-hpage-light .mysp-hpage-form-msg{color:#c0262d}
.mysp-hpage-form-ok{margin:0;font-weight:800;font-size:1.15rem;color:var(--mysp-hpage-accent);text-align:center}
.mysp-hpage-light .mysp-hpage-form-ok{color:var(--mysp-hpage-primary)}
.mysp-hpage-form-ok[hidden]{display:none}
.mysp-hpage-form.is-sent>*:not(.mysp-hpage-form-ok){display:none}
.mysp-hpage-form.is-sent .mysp-hpage-form-ok{display:block;padding:18px 0}
.mysp-hpage-form.is-inline{grid-template-columns:1fr auto;align-items:end;max-width:none}
.mysp-hpage-form.is-inline .mysp-hpage-field label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.mysp-hpage-form.is-inline .mysp-hpage-form-btn{justify-self:stretch;white-space:nowrap}
.mysp-hpage-form.is-inline .mysp-hpage-form-msg,.mysp-hpage-form.is-inline .mysp-hpage-form-ok{grid-column:1/-1}
.mysp-hpage-form.is-inline .mysp-hpage-form-msg:empty{display:none}
@media(max-width:560px){.mysp-hpage-form.is-inline{grid-template-columns:1fr}.mysp-hpage-form-btn{justify-self:stretch;text-align:center}}
.mysp-hpage-fp .mysp-hpage-form{gap:10px;padding:20px}

/* Font Awesome: ikon menggantikan emoji */
.mysp-hpage i[class*="fa-"]{display:inline-block;width:auto;line-height:1}
.mysp-hpage-emoji,.mysp-hpage-stat-ico,.mysp-hpage-plan-ico,.mysp-hpage-ct-ico,.mysp-hpage-sl-art span{color:var(--mysp-hpage-accent)}
.mysp-hpage-wa{color:#fff}
.mysp-hpage-ct-ico i{font-size:1.1rem}

/* Tombol Chat Admin (WhatsApp melayang) */
.mysp-hpage-wa,.mysp-hpage-wa:hover,.mysp-hpage-wa:focus{color:#fff;text-decoration:none}
.mysp-hpage-wa i{width:auto;line-height:1}
.mysp-hpage-wa.has-label{width:auto;height:52px;padding:0 20px 0 16px;border-radius:999px;display:inline-flex;align-items:center;gap:10px;font-size:1.5rem}
.mysp-hpage-wa span{font-size:.95rem;font-weight:700;letter-spacing:.2px;white-space:nowrap}
.mysp-hpage-wa.is-left{right:auto;left:20px}
@media(max-width:480px){.mysp-hpage-wa{right:14px;bottom:14px}.mysp-hpage-wa.is-left{right:auto;left:14px}.mysp-hpage-wa.has-label{height:48px;padding:0 16px 0 14px}.mysp-hpage-wa span{font-size:.88rem}}

/* ===== v0.23: shape pemisah antar section ===== */
.mysp-hpage-section.has-shape,.mysp-hpage-hero.has-shape,.mysp-hpage-marquee.has-shape,.mysp-hpage-shape{--sh:var(--shd,80px)}
.mysp-hpage-shape{position:relative;z-index:4;display:block;height:calc(var(--sh) + 1px);margin:calc(var(--sh) * -1) 0 0;overflow:hidden;line-height:0;pointer-events:none}
.mysp-hpage-shape svg{position:absolute;left:0;bottom:0;width:100%;height:100%;display:block}
.mysp-hpage-shape svg.is-move{width:200%;animation:mysp-hpage-shapemove 14s linear infinite;will-change:transform}
.mysp-hpage-shape.is-flip{transform:scaleX(-1)}
.mysp-hpage-shape.is-flipv{transform:scaleY(-1)}
.mysp-hpage-shape.is-flip.is-flipv{transform:scale(-1,-1)}
@keyframes mysp-hpage-shapemove{to{transform:translateX(-50%)}}
.mysp-hpage-section.has-shape{padding-bottom:calc(clamp(80px,14vh,160px) + var(--sh))}
.mysp-hpage-marquee.has-shape{padding-bottom:calc(16px + var(--sh));z-index:3}
.mysp-hpage-hero.has-shape .mysp-hpage-scroll-hint{margin-bottom:var(--sh)}
.mysp-hpage-hero.has-shape .mysp-hpage-hero-inner{padding-bottom:var(--sh)}
.mysp-hpage-fp .mysp-hpage-shape{position:absolute;left:0;right:0;bottom:-1px;margin:0;z-index:4}
.mysp-hpage-fp .mysp-hpage-section.has-shape{padding-bottom:calc(40px + var(--sh))}
.mysp-hpage-reduce .mysp-hpage-shape svg.is-move{animation:none}
@media(max-width:800px){
  .mysp-hpage-section.has-shape,.mysp-hpage-hero.has-shape,.mysp-hpage-marquee.has-shape,.mysp-hpage-shape{--sh:calc(var(--shd,80px) * .6)}
  .mysp-hpage-fp .mysp-hpage-section.has-shape{padding-bottom:calc(32px + var(--sh))}
}

/* ===== v0.30.6: tombol prev/next testimoni di kiri & kanan section (seperti slider gambar), menghindari dots vertikal utama ===== */
.mysp-hpage .mysp-hpage-section>.mysp-hpage-pg-prev,.mysp-hpage .mysp-hpage-section>.mysp-hpage-pg-next{position:absolute;top:50%;z-index:6;width:44px;height:44px;margin:-22px 0 0;padding:0;border:0;border-radius:50%;background:rgba(5,8,20,.45);color:#fff;font-size:1.05rem;line-height:44px;text-align:center;cursor:pointer;appearance:none;-webkit-appearance:none;backdrop-filter:blur(6px);transition:background .25s,transform .25s,color .25s}
.mysp-hpage .mysp-hpage-section>.mysp-hpage-pg-prev{left:14px}
.mysp-hpage .mysp-hpage-section>.mysp-hpage-pg-next{right:60px}
.mysp-hpage .mysp-hpage-section>.mysp-hpage-pg-prev:hover,.mysp-hpage .mysp-hpage-section>.mysp-hpage-pg-next:hover,.mysp-hpage .mysp-hpage-section>.mysp-hpage-pg-prev:focus-visible,.mysp-hpage .mysp-hpage-section>.mysp-hpage-pg-next:focus-visible{background:var(--mysp-hpage-accent);color:#10201a;transform:scale(1.1);outline:none}
@media(max-width:800px){
.mysp-hpage .mysp-hpage-section>.mysp-hpage-pg-prev,.mysp-hpage .mysp-hpage-section>.mysp-hpage-pg-next{width:36px;height:36px;margin-top:-18px;line-height:36px}
.mysp-hpage .mysp-hpage-section>.mysp-hpage-pg-next{right:44px}
}

/* ===== v0.30.2: mode satu halaman + slider 16:9 di HP: gambar menempel di atas (top 0), tinggi mengikuti rasio, wave & section berikutnya ikut naik ===== */
/* Section yang hanya "mengintip" di bawah slider (bukan slide aktif) tidak boleh tergulir sendiri: judul & kartu atasnya tetap utuh */
.mysp-hpage-fp .mysp-hpage-slide:not(.is-current) .mysp-hpage-section,.mysp-hpage-fp .mysp-hpage-slide:not(.is-current) .mysp-hpage-cta{overflow-y:hidden}
@media(max-width:800px){
.mysp-hpage-fp .mysp-hpage-slide.mysp-hpage-slide-auto{height:auto}
.mysp-hpage-fp .mysp-hpage-section.mysp-hpage-type-slider.mysp-hpage-slm{height:auto;min-height:0;display:block;overflow:hidden;padding:0 0 var(--sh,0px)}
.mysp-hpage-fp .mysp-hpage-type-slider.mysp-hpage-slm .mysp-hpage-section-inner{position:relative;inset:auto;display:block;margin:0;width:100%}
.mysp-hpage-fp .mysp-hpage-type-slider.mysp-hpage-slm .mysp-hpage-sl{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:16/9;border-radius:0}
}

/* ===== v0.33.4: fix HP - swipe jari tidak jalan di slide pertama (slider 16:9) sebelum dots diklik ===== */
/* Section slider tidak pernah menggulir isinya sendiri: overflow:clip membuat scrollHeight sisa (animasi/transform) tidak bisa "digulir" */
.mysp-hpage-fp .mysp-hpage-section.mysp-hpage-type-slider,.mysp-hpage-fp .mysp-hpage-section.mysp-hpage-type-slider.mysp-hpage-slm{overflow:hidden;overflow:clip;overscroll-behavior:none}
.mysp-hpage-fp .mysp-hpage-slide{touch-action:pan-y}

/* v0.37.2: teks kecil di atas judul pada section CTA */
.mysp-hpage-cta-inner .mysp-hpage-eyebrow{display:block;margin-bottom:12px}

/* v0.38.0: efek layar (hujan / salju / daun) */
.mysp-hpage-weather{position:fixed;left:0;top:var(--wp-admin--admin-bar--height,0px);z-index:80;pointer-events:none;display:block}
.mysp-hpage-reduce .mysp-hpage-weather{display:none}

/* Kolom (1-4) */
.mysp-hpage-type-columns .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);gap:0;max-width:1250px}
.mysp-hpage-cols{display:grid;gap:clamp(24px,4vw,56px);align-items:start}
.mysp-hpage-cols-1{grid-template-columns:minmax(0,1fr)}
.mysp-hpage-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mysp-hpage-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.mysp-hpage-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.mysp-hpage-col{min-width:0}
/* section di dalam kolom: tanpa padding/latar section penuh, tersusun vertikal */
.mysp-hpage-embed{position:relative}
.mysp-hpage-embed .mysp-hpage-section-inner,.mysp-hpage-fp .mysp-hpage-embed .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);gap:24px;max-width:none;margin:0;width:auto;text-align:left}
.mysp-hpage-embed .mysp-hpage-head{max-width:none;margin:0 0 clamp(18px,3vw,32px);text-align:left}
.mysp-hpage-embed .mysp-hpage-head h2,.mysp-hpage-embed .mysp-hpage-copy h2{font-size:clamp(1.4rem,2.4vw,2rem)}
@media (max-width:1000px){.mysp-hpage-cols-3,.mysp-hpage-cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.mysp-hpage-cols-2,.mysp-hpage-cols-3,.mysp-hpage-cols-4{grid-template-columns:minmax(0,1fr)}}
/* v0.76.0: rasio lebar kolom (konten utama + sidebar). 2 kolom mulai 701px, 3 kolom mulai 1001px; di bawahnya memakai susunan bawaan. */
@media (min-width:701px){
.mysp-hpage-cols-2.mysp-hpage-cols-r-2-1{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
.mysp-hpage-cols-2.mysp-hpage-cols-r-1-2{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.mysp-hpage-cols-2.mysp-hpage-cols-r-3-1{grid-template-columns:minmax(0,3fr) minmax(0,1fr)}
.mysp-hpage-cols-2.mysp-hpage-cols-r-1-3{grid-template-columns:minmax(0,1fr) minmax(0,3fr)}
}
@media (min-width:1001px){
.mysp-hpage-cols-3.mysp-hpage-cols-r-2-1-1{grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr)}
.mysp-hpage-cols-3.mysp-hpage-cols-r-1-2-1{grid-template-columns:minmax(0,1fr) minmax(0,2fr) minmax(0,1fr)}
.mysp-hpage-cols-3.mysp-hpage-cols-r-1-1-2{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,2fr)}
}

/* v0.42.0: section "Dari WordPress" - kartu post generik */
.mysp-hpage-wpgrid{display:grid;gap:22px;grid-template-columns:repeat(3,minmax(0,1fr))}
.mysp-hpage-wpgrid.is-grid2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mysp-hpage-wpgrid.is-grid4{grid-template-columns:repeat(4,minmax(0,1fr))}
.mysp-hpage-wpgrid.is-list{grid-template-columns:minmax(0,1fr);gap:16px}
.mysp-hpage-wpcard{display:flex;flex-direction:column;padding:0;overflow:hidden;text-align:left}
.mysp-hpage-wpcard-img{display:block;position:relative;aspect-ratio:16/10;overflow:hidden;background:rgba(127,127,127,.14)}
.mysp-hpage-wpcard-img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.mysp-hpage-wpcard:hover .mysp-hpage-wpcard-img img{transform:scale(1.05)}
.mysp-hpage-wpcard-img.is-empty{display:grid;place-items:center;color:var(--mysp-hpage-accent);font-size:2rem;opacity:.7}
.mysp-hpage-wpcard-body{display:flex;flex-direction:column;gap:8px;flex:1;padding:18px 20px 20px}
.mysp-hpage-wpcard-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:.78rem;opacity:.75}
.mysp-hpage-wpcard-cat{color:var(--mysp-hpage-accent);font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:1}
.mysp-hpage-light .mysp-hpage-wpcard-cat{color:var(--mysp-hpage-primary)}
.mysp-hpage-wpcard h3{margin:0;font-size:1.12rem;line-height:1.35}
.mysp-hpage-wpcard h3 a{color:inherit;text-decoration:none}
.mysp-hpage-wpcard h3 a:hover,.mysp-hpage-wpcard h3 a:focus-visible{text-decoration:underline}
.mysp-hpage-wpcard-ex{margin:0;font-size:.92rem;line-height:1.6;opacity:.82}
.mysp-hpage-wpcard-more{margin-top:auto;padding-top:6px;color:var(--mysp-hpage-accent);font-weight:700;font-size:.88rem;text-decoration:none}
.mysp-hpage-light .mysp-hpage-wpcard-more{color:var(--mysp-hpage-primary)}
.mysp-hpage-wpcard-more:hover,.mysp-hpage-wpcard-more:focus-visible{text-decoration:underline}
.mysp-hpage-wpgrid.is-list .mysp-hpage-wpcard{flex-direction:row;align-items:stretch}
.mysp-hpage-wpgrid.is-list .mysp-hpage-wpcard-img{flex:0 0 min(34%,260px);aspect-ratio:auto;min-height:150px}
.mysp-hpage-wpgrid.no-img .mysp-hpage-wpcard-body{padding:22px}
.mysp-hpage-wp-foot{margin-top:clamp(22px,3vw,36px);text-align:center}
.mysp-hpage-wp-empty{margin:0;padding:18px 20px;border:1px dashed rgba(127,127,127,.55);border-radius:12px;text-align:center;font-size:.9rem;opacity:.8}
.mysp-hpage-wp-empty i{margin-right:6px}
@media (max-width:1000px){.mysp-hpage-wpgrid.is-grid4,.mysp-hpage-wpgrid.is-grid3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.mysp-hpage-wpgrid,.mysp-hpage-wpgrid.is-grid2,.mysp-hpage-wpgrid.is-grid3,.mysp-hpage-wpgrid.is-grid4{grid-template-columns:minmax(0,1fr)}.mysp-hpage-wpgrid.is-list .mysp-hpage-wpcard{flex-direction:column}.mysp-hpage-wpgrid.is-list .mysp-hpage-wpcard-img{flex:none;aspect-ratio:16/10;min-height:0}}
/* di dalam kolom: lebar sempit, kolom menyesuaikan lebar */
.mysp-hpage-embed .mysp-hpage-wpgrid,.mysp-hpage-embed .mysp-hpage-wpgrid.is-grid2,.mysp-hpage-embed .mysp-hpage-wpgrid.is-grid3,.mysp-hpage-embed .mysp-hpage-wpgrid.is-grid4{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.mysp-hpage-embed .mysp-hpage-wpgrid.is-list{grid-template-columns:minmax(0,1fr)}
.mysp-hpage-embed .mysp-hpage-wp-foot{text-align:left}

/* Kategori + Tag Cloud (v0.44.0) */
.mysp-hpage-wpcat .mysp-hpage-wpcard-img.is-empty{font-size:2.4rem}
.mysp-hpage-wptags{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 12px;max-width:900px;margin:0 auto}
.mysp-hpage-wptag{display:inline-flex;align-items:baseline;gap:6px;color:inherit;text-decoration:none;line-height:1.25;transition:color .2s,background-color .2s,border-color .2s,transform .2s}
.mysp-hpage-wptag-n{font-size:.72em;opacity:.65;font-weight:700}
.mysp-hpage-wptags.is-pill .mysp-hpage-wptag{padding:7px 15px;border:1px solid rgba(127,127,127,.5);border-radius:999px;background:rgba(127,127,127,.1)}
.mysp-hpage-wptags.is-pill .mysp-hpage-wptag:hover,.mysp-hpage-wptags.is-pill .mysp-hpage-wptag:focus-visible{border-color:var(--mysp-hpage-accent);color:var(--mysp-hpage-accent);transform:translateY(-2px)}
.mysp-hpage-light .mysp-hpage-wptags.is-pill .mysp-hpage-wptag:hover,.mysp-hpage-light .mysp-hpage-wptags.is-pill .mysp-hpage-wptag:focus-visible{border-color:var(--mysp-hpage-primary);color:var(--mysp-hpage-primary)}
.mysp-hpage-wptags.is-cloud{gap:6px 20px}
.mysp-hpage-wptags.is-cloud .mysp-hpage-wptag{font-weight:600}
.mysp-hpage-wptags.is-cloud .mysp-hpage-wptag:hover,.mysp-hpage-wptags.is-cloud .mysp-hpage-wptag:focus-visible{color:var(--mysp-hpage-accent);text-decoration:underline}
.mysp-hpage-light .mysp-hpage-wptags.is-cloud .mysp-hpage-wptag:hover,.mysp-hpage-light .mysp-hpage-wptags.is-cloud .mysp-hpage-wptag:focus-visible{color:var(--mysp-hpage-primary)}
@media (max-width:640px){.mysp-hpage-wptags,.mysp-hpage-wptags.is-cloud{gap:8px 14px}}

/* Pencarian, Penulis, Komentar (v0.45.0) */
.mysp-hpage-wpsearch{display:flex;gap:10px;max-width:640px;margin:0 auto}
.mysp-hpage-wpsearch input[type=search]{flex:1;min-width:0;padding:14px 22px;border:1px solid rgba(127,127,127,.55);border-radius:999px;background:rgba(127,127,127,.12);color:inherit;font:inherit;font-size:1rem;-webkit-appearance:none;appearance:none}
.mysp-hpage-wpsearch input[type=search]::placeholder{color:inherit;opacity:.6}
.mysp-hpage-wpsearch input[type=search]:focus{outline:2px solid var(--mysp-hpage-accent);outline-offset:2px}
.mysp-hpage-wpsearch .mysp-hpage-btn{border:0;cursor:pointer;font:inherit;font-weight:700;white-space:nowrap}
.mysp-hpage-wpsearch .mysp-hpage-btn i{margin-right:4px}
@media (max-width:480px){.mysp-hpage-wpsearch{flex-direction:column}.mysp-hpage-wpsearch .mysp-hpage-btn{width:100%}}

/* Pencarian Kategori (v0.105.0): kotak teks | dropdown kategori | tombol */
.mysp-hpage-wpsearchcat{max-width:860px;align-items:stretch}
.mysp-hpage-wpsearchcat input[type=search]{flex:1 1 auto}
.mysp-hpage-sc-sel{position:relative;flex:0 0 220px;min-width:0;display:flex}
.mysp-hpage-sc-sel::after{content:"";position:absolute;right:20px;top:50%;width:7px;height:7px;margin-top:-6px;border:solid currentColor;border-width:0 2px 2px 0;transform:rotate(45deg);pointer-events:none;opacity:.7}
.mysp-hpage-sc-sel select{width:100%;min-width:0;padding:14px 44px 14px 22px;border:1px solid rgba(127,127,127,.55);border-radius:999px;background:rgba(127,127,127,.12);color:inherit;font:inherit;font-size:1rem;cursor:pointer;text-overflow:ellipsis;-webkit-appearance:none;appearance:none}
.mysp-hpage-sc-sel select:focus{outline:2px solid var(--mysp-hpage-accent);outline-offset:2px}
.mysp-hpage-sc-sel select option{color:#111;background:#fff}
@media (max-width:640px){.mysp-hpage-wpsearchcat{flex-direction:column}.mysp-hpage-wpsearchcat .mysp-hpage-sc-sel{flex:0 0 auto}.mysp-hpage-wpsearchcat .mysp-hpage-btn{width:100%}}
.mysp-hpage-wpau{align-items:center;text-align:center}
.mysp-hpage-wpau-av{display:grid;place-items:center;width:96px;height:96px;margin:24px auto 0;border-radius:50%;overflow:hidden;background:rgba(127,127,127,.18);color:var(--mysp-hpage-accent);font-size:2rem;flex:none}
.mysp-hpage-wpau-av img{display:block;width:100%;height:100%;object-fit:cover}
.mysp-hpage-wpau .mysp-hpage-wpcard-body{align-items:center}
.mysp-hpage-wpau .mysp-hpage-wpcard-meta{justify-content:center}
.mysp-hpage-wpgrid.is-list .mysp-hpage-wpau{flex-direction:row;align-items:center;text-align:left}
.mysp-hpage-wpgrid.is-list .mysp-hpage-wpau .mysp-hpage-wpau-av{margin:18px 0 18px 20px}
.mysp-hpage-wpgrid.is-list .mysp-hpage-wpau .mysp-hpage-wpcard-body{align-items:flex-start}
.mysp-hpage-wpgrid.is-list .mysp-hpage-wpau .mysp-hpage-wpcard-meta{justify-content:flex-start}
.mysp-hpage-wpcm-q{font-size:1.4rem;color:var(--mysp-hpage-accent);opacity:.8}
.mysp-hpage-light .mysp-hpage-wpcm-q{color:var(--mysp-hpage-primary)}
.mysp-hpage-wpcm .mysp-hpage-wpcard-ex{font-style:italic;opacity:.92}
.mysp-hpage-wpcm-by{font-size:.85rem;opacity:.85}
.mysp-hpage-wpcm-by time{margin-left:6px;opacity:.7}
@media (max-width:640px){.mysp-hpage-wpgrid.is-list .mysp-hpage-wpau{flex-direction:column;text-align:center}.mysp-hpage-wpgrid.is-list .mysp-hpage-wpau .mysp-hpage-wpau-av{margin:24px auto 0}.mysp-hpage-wpgrid.is-list .mysp-hpage-wpau .mysp-hpage-wpcard-body{align-items:center}.mysp-hpage-wpgrid.is-list .mysp-hpage-wpau .mysp-hpage-wpcard-meta{justify-content:center}}


/* WooCommerce + Arsip per kategori (v0.46.0) */
.mysp-hpage-wpcard-badge{position:absolute;top:10px;left:10px;z-index:1;padding:3px 10px;border-radius:999px;background:var(--mysp-hpage-accent);color:#111;font-size:.72rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.mysp-hpage-wpcard-badge.is-inline{position:static;display:inline-block;padding:2px 9px}
.mysp-hpage-wpcard-oos{font-weight:700;opacity:.8}
.mysp-hpage-wpcard-price{font-weight:700;font-size:1.02rem;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px}
.mysp-hpage-wpcard-price del{opacity:.55;font-weight:400;font-size:.88em}
.mysp-hpage-wpcard-price ins{text-decoration:none;color:var(--mysp-hpage-accent)}
.mysp-hpage-light .mysp-hpage-wpcard-price ins{color:var(--mysp-hpage-primary)}
.mysp-hpage-wpcard-price .screen-reader-text{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.mysp-hpage-wparch{display:flex;flex-direction:column;gap:42px}
.mysp-hpage-wparch-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px;margin:0 0 16px;padding-bottom:10px;border-bottom:1px solid rgba(127,127,127,.35)}
.mysp-hpage-wparch-head h3{margin:0;font-size:1.3rem;line-height:1.3}
.mysp-hpage-wparch-head h3 a{color:inherit;text-decoration:none}
.mysp-hpage-wparch-head h3 a:hover,.mysp-hpage-wparch-head h3 a:focus-visible{text-decoration:underline}
.mysp-hpage-wparch-all{color:var(--mysp-hpage-accent);font-weight:700;font-size:.88rem;text-decoration:none;white-space:nowrap}
.mysp-hpage-light .mysp-hpage-wparch-all{color:var(--mysp-hpage-primary)}
.mysp-hpage-wparch-all:hover,.mysp-hpage-wparch-all:focus-visible{text-decoration:underline}
@media (max-width:640px){.mysp-hpage-wparch{gap:32px}.mysp-hpage-wparch-head h3{font-size:1.15rem}}

/* Bagikan Sosial (v0.47.0) */
.mysp-hpage-share{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 12px}
.mysp-hpage-share-b{--c:#6b7280;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border:1px solid rgba(127,127,127,.5);border-radius:999px;background:rgba(127,127,127,.1);color:inherit;font:inherit;font-size:.92rem;font-weight:600;line-height:1;text-decoration:none;cursor:pointer;transition:background-color .2s,border-color .2s,color .2s,transform .2s}
.mysp-hpage-share-b i{width:1.1em;text-align:center;font-size:1.05em}
.mysp-hpage-share-b.is-whatsapp{--c:#1fa855}.mysp-hpage-share-b.is-facebook{--c:#1877f2}.mysp-hpage-share-b.is-x{--c:#111}.mysp-hpage-share-b.is-telegram{--c:#229ed9}.mysp-hpage-share-b.is-linkedin{--c:#0a66c2}.mysp-hpage-share-b.is-email{--c:#d9534f}.mysp-hpage-share-b.is-copy{--c:var(--mysp-hpage-accent)}
.mysp-hpage-share-b:hover,.mysp-hpage-share-b:focus-visible{background:var(--c);border-color:var(--c);color:#fff;transform:translateY(-2px)}
.mysp-hpage-share-b.is-copy:hover,.mysp-hpage-share-b.is-copy:focus-visible{color:#111}
.mysp-hpage-share-b:focus-visible{outline:2px solid var(--mysp-hpage-accent);outline-offset:2px}
.mysp-hpage-share-b.is-done{background:var(--c);border-color:var(--c);color:#111}
.mysp-hpage-share.is-icon .mysp-hpage-share-b{width:46px;padding:0}
.mysp-hpage-share.is-icon .mysp-hpage-share-t{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.mysp-hpage:not(.mysp-hpage-js) .mysp-hpage-share-copy{display:none}
.mysp-hpage-embed .mysp-hpage-share{justify-content:flex-start}
@media (max-width:480px){.mysp-hpage-share:not(.is-icon) .mysp-hpage-share-b{flex:1 1 calc(50% - 12px);padding:0 12px}}

/* Progress Bar (v0.48.0) */
.mysp-hpage-bars{display:flex;flex-direction:column;gap:22px;max-width:760px;margin:0 auto;width:100%}
.mysp-hpage-bar-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 8px;font-weight:700}
.mysp-hpage-bar-v{color:var(--mysp-hpage-accent);font-variant-numeric:tabular-nums}
.mysp-hpage-light .mysp-hpage-bar-v{color:var(--mysp-hpage-primary)}
.mysp-hpage-bar-track{height:14px;border-radius:999px;background:rgba(127,127,127,.22);overflow:hidden}
.mysp-hpage-bar-fill{display:block;width:var(--w,0%);height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--mysp-hpage-accent),var(--mysp-hpage-primary))}
.mysp-hpage-light .mysp-hpage-bar-fill{background:linear-gradient(90deg,var(--mysp-hpage-primary),var(--mysp-hpage-accent))}
.mysp-hpage-bars.is-slim .mysp-hpage-bar-track{height:6px}
.mysp-hpage-bars.is-block .mysp-hpage-bar-track,.mysp-hpage-bars.is-block .mysp-hpage-bar-fill{border-radius:3px}
.mysp-hpage-bar-d{margin:8px 0 0;font-size:.88rem;opacity:.78}
.mysp-hpage-js .mysp-hpage-bar-fill{width:0;transition:width 1.3s cubic-bezier(.2,.7,.2,1) .25s}
.mysp-hpage-js .mysp-hpage-bar.mysp-hpage-in .mysp-hpage-bar-fill{width:var(--w,0%)}
.mysp-hpage-reduce .mysp-hpage-bar-fill{width:var(--w,0%)!important;transition:none!important}
@media (max-width:640px){.mysp-hpage-bars{gap:18px}}

/* Rating / Review (v0.49.0) */
.mysp-hpage-type-rating .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);gap:0}
.mysp-hpage-stars{display:inline-flex;gap:3px;color:var(--mysp-hpage-accent);line-height:1}
.mysp-hpage-star-e{opacity:.4}
.mysp-hpage-rv-sum{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;margin:0 auto clamp(24px,4vw,40px)}
.mysp-hpage-rv-num{font-size:clamp(2.8rem,7vw,4rem);font-weight:800;line-height:1;color:var(--mysp-hpage-accent);font-variant-numeric:tabular-nums}
.mysp-hpage-light .mysp-hpage-rv-num{color:var(--mysp-hpage-primary)}
.mysp-hpage-rv-sum .mysp-hpage-stars{font-size:1.4rem}
.mysp-hpage-rv-cnt{font-size:.92rem;opacity:.8}
.mysp-hpage-rv-grid{display:grid;gap:22px;grid-template-columns:repeat(3,minmax(0,1fr));max-width:1150px;margin:0 auto;width:100%}
.mysp-hpage-rv-grid.is-grid2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mysp-hpage-rv-grid.is-list{grid-template-columns:minmax(0,1fr);max-width:760px}
.mysp-hpage-rv{text-align:left;display:flex;flex-direction:column;gap:12px;padding:22px}
.mysp-hpage-rv-head{display:flex;align-items:center;gap:12px;min-width:0}
.mysp-hpage-rv-ph{flex:none;width:48px;height:48px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:linear-gradient(135deg,var(--mysp-hpage-primary),var(--mysp-hpage-accent))}
.mysp-hpage-rv-ph img{display:block;width:100%;height:100%;object-fit:cover}
.mysp-hpage-rv-ini{font-weight:800;font-size:1.2rem;line-height:1;color:#fff}
.mysp-hpage-rv-who{display:flex;flex-direction:column;min-width:0}
.mysp-hpage-rv-name{font-size:1.02rem;line-height:1.25;overflow-wrap:anywhere}
.mysp-hpage-rv-org{font-size:.82rem;opacity:.75;overflow-wrap:anywhere}
.mysp-hpage-rv-score{display:flex;align-items:center;gap:8px}
.mysp-hpage-rv-val{font-weight:700;font-size:.9rem;font-variant-numeric:tabular-nums}
.mysp-hpage-item.mysp-hpage-rv p.mysp-hpage-rv-text{margin:0;font-size:.97rem;line-height:1.6}
@media (max-width:900px){.mysp-hpage-rv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.mysp-hpage-rv-grid,.mysp-hpage-rv-grid.is-grid2{grid-template-columns:minmax(0,1fr)}}

/* Timeline (v0.50.0): dasar = garis di kiri (juga dipakai di HP); gaya tengah hanya di layar lebar */
.mysp-hpage-type-timeline .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);gap:0}
.mysp-hpage-tl{list-style:none;margin:0 auto;padding:0;max-width:1000px;width:100%;position:relative}
.mysp-hpage-tl::before{content:"";position:absolute;top:0;bottom:0;left:20px;width:2px;margin-left:-1px;background:rgba(127,127,127,.4)}
.mysp-hpage-tl-i{position:relative;padding:0 0 28px 60px;margin:0}
.mysp-hpage-tl-i:last-child{padding-bottom:0}
.mysp-hpage-tl-dot{position:absolute;top:14px;left:0;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:1rem;color:#fff;background:linear-gradient(135deg,var(--mysp-hpage-primary),var(--mysp-hpage-accent));box-shadow:0 0 0 4px rgba(127,127,127,.2);z-index:1}
.mysp-hpage-tl-dot.is-plain{width:16px;height:16px;left:12px;top:22px}
.mysp-hpage-tl-card{text-align:left;padding:20px 22px}
.mysp-hpage-tl-date{display:block;margin:0 0 6px;color:var(--mysp-hpage-accent);font-weight:700;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase}
.mysp-hpage-light .mysp-hpage-tl-date{color:var(--mysp-hpage-primary)}
.mysp-hpage-tl-img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:12px;margin:0 0 12px}
.mysp-hpage-tl-card h3{margin:0 0 6px}
.mysp-hpage-item.mysp-hpage-tl-card p{margin:0;font-size:.97rem;line-height:1.6}
@media (min-width:761px){
.mysp-hpage-tl.is-center::before{left:50%}
.mysp-hpage-tl.is-center .mysp-hpage-tl-i{width:50%;box-sizing:border-box;padding:0 44px 32px 0}
.mysp-hpage-tl.is-center .mysp-hpage-tl-i:nth-child(even){margin-left:50%;padding:0 0 32px 44px}
.mysp-hpage-tl.is-center .mysp-hpage-tl-i:last-child{padding-bottom:0}
.mysp-hpage-tl.is-center .mysp-hpage-tl-dot{left:auto;right:-20px}
.mysp-hpage-tl.is-center .mysp-hpage-tl-i:nth-child(even) .mysp-hpage-tl-dot{right:auto;left:-20px}
.mysp-hpage-tl.is-center .mysp-hpage-tl-dot.is-plain{right:-8px}
.mysp-hpage-tl.is-center .mysp-hpage-tl-i:nth-child(even) .mysp-hpage-tl-dot.is-plain{right:auto;left:-8px}
}

/* Tabel (v0.51.0) */
.mysp-hpage-type-table .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);gap:0}
.mysp-hpage-tb-wrap{max-width:1000px;width:100%;margin:0 auto;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid rgba(127,127,127,.3);border-radius:14px}
.mysp-hpage-tb-wrap:focus-visible{outline:2px solid var(--mysp-hpage-accent);outline-offset:2px}
.mysp-hpage-tb{width:100%;min-width:calc(var(--c,2)*130px);border-collapse:collapse}
.mysp-hpage-tb-cap{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.mysp-hpage-tb th,.mysp-hpage-tb td{padding:12px 16px;text-align:left;vertical-align:top;border-bottom:1px solid rgba(127,127,127,.25);line-height:1.5}
.mysp-hpage-tb thead th{background:var(--mysp-hpage-primary);color:#fff;font-weight:700;border-bottom:0}
.mysp-hpage-tb tbody tr:last-child td{border-bottom:0}
.mysp-hpage-tb-wrap.is-zebra tbody tr:nth-child(even){background:rgba(127,127,127,.12)}
.mysp-hpage-tb-wrap.is-center th,.mysp-hpage-tb-wrap.is-center td{text-align:center}
@media (max-width:640px){.mysp-hpage-tb th,.mysp-hpage-tb td{padding:10px 12px;font-size:.92rem}}

/* Headline beranimasi (v0.52.0) */
.mysp-hpage-type-rotator .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);gap:0}
.mysp-hpage-head h2.mysp-hpage-rot{font-size:clamp(2rem,5.5vw,3.8rem);line-height:1.2}
.mysp-hpage-rot-w{display:inline-block;color:var(--mysp-hpage-accent);transition:opacity .38s ease,transform .38s ease}
.mysp-hpage-light .mysp-hpage-rot-w{color:var(--mysp-hpage-primary)}
.mysp-hpage-rot-w.is-out{opacity:0;transform:translateY(.25em)}
.mysp-hpage-rot-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.mysp-hpage-rot.is-type.is-live .mysp-hpage-rot-w::after{content:"";display:inline-block;width:.07em;height:.9em;margin-left:.06em;vertical-align:-.1em;background:currentColor;animation:mysp-hpage-caret 1s steps(1) infinite}
@keyframes mysp-hpage-caret{50%{opacity:0}}
.mysp-hpage-reduce .mysp-hpage-rot-w{transition:none}

/* Flip box (v0.53.0): dasar = dua muka bertumpuk (terbaca tanpa JS); efek balik hanya setelah JS menambah .is-flip-on */
.mysp-hpage-type-flip .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);gap:0}
.mysp-hpage-flip{list-style:none;margin:0 auto;padding:0;max-width:1150px;width:100%;display:grid;gap:22px;grid-template-columns:repeat(3,minmax(0,1fr))}
.mysp-hpage-flip.is-c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mysp-hpage-flip.is-c4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1000px){.mysp-hpage-flip.is-c3,.mysp-hpage-flip.is-c4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.mysp-hpage-flip,.mysp-hpage-flip.is-c2,.mysp-hpage-flip.is-c3,.mysp-hpage-flip.is-c4{grid-template-columns:minmax(0,1fr)}}
.mysp-hpage-flip-i{margin:0;min-width:0}
.mysp-hpage-flip-in{display:grid;gap:12px}
.mysp-hpage-flip .mysp-hpage-item,.mysp-hpage-flip .mysp-hpage-item:hover{transform:none}
.mysp-hpage-flip-f,.mysp-hpage-flip-b{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;box-sizing:border-box;min-width:0}
.mysp-hpage-flip-f h3{margin:0;overflow-wrap:anywhere}
.mysp-hpage-flip-b p{margin:0;font-size:.97rem;line-height:1.6;overflow-wrap:anywhere}
.mysp-hpage-flip-b{background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.03));border-color:var(--mysp-hpage-accent)}
.mysp-hpage-light .mysp-hpage-flip-b{background:#fff}
.mysp-hpage-flip-img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:12px}
.mysp-hpage-flip-ico{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;font-size:1.9rem;background:linear-gradient(135deg,var(--mysp-hpage-primary),var(--mysp-hpage-accent));color:#fff;box-shadow:0 8px 22px rgba(0,0,0,.3)}
/* efek balik aktif */
.mysp-hpage-flip.is-flip-on .mysp-hpage-flip-card{height:var(--fh,280px);perspective:1100px}
.mysp-hpage-flip.is-flip-on .mysp-hpage-flip-in{display:block;position:relative;height:100%;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.mysp-hpage-flip.is-flip-on .mysp-hpage-flip-f,.mysp-hpage-flip.is-flip-on .mysp-hpage-flip-b{position:absolute;inset:0;margin:0;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:none}
.mysp-hpage-flip.is-flip-on .mysp-hpage-flip-f{justify-content:center;overflow:hidden}
.mysp-hpage-flip.is-flip-on .mysp-hpage-flip-f .mysp-hpage-flip-img{flex:1 1 0;min-height:0;aspect-ratio:auto}
.mysp-hpage-flip.is-flip-on .mysp-hpage-flip-b{transform:rotateY(180deg);overflow:auto}
.mysp-hpage-flip.is-flip-on .mysp-hpage-flip-b>:first-child{margin-top:auto}
.mysp-hpage-flip.is-flip-on .mysp-hpage-flip-b>:last-child{margin-bottom:auto}
.mysp-hpage-flip.is-flip-on .mysp-hpage-flip-card.is-flipped .mysp-hpage-flip-in{transform:rotateY(180deg)}
@media (hover:hover) and (pointer:fine){.mysp-hpage-flip.is-flip-on .mysp-hpage-flip-card:hover .mysp-hpage-flip-in{transform:rotateY(180deg)}}
.mysp-hpage-flip-t{position:absolute;inset:0;z-index:2;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:inherit;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}
.mysp-hpage-flip-t:focus-visible{outline:3px solid var(--mysp-hpage-accent);outline-offset:-5px}
/* gerak berkurang: ganti muka tanpa berputar */
.mysp-hpage-reduce .mysp-hpage-flip.is-flip-on .mysp-hpage-flip-in{transform:none!important;transition:none}
.mysp-hpage-reduce .mysp-hpage-flip.is-flip-on .mysp-hpage-flip-b{transform:none;opacity:0;pointer-events:none}
.mysp-hpage-reduce .mysp-hpage-flip.is-flip-on .mysp-hpage-flip-card.is-flipped .mysp-hpage-flip-f{opacity:0;pointer-events:none}
.mysp-hpage-reduce .mysp-hpage-flip.is-flip-on .mysp-hpage-flip-card.is-flipped .mysp-hpage-flip-b{opacity:1;pointer-events:auto}
@media (hover:hover) and (pointer:fine){
.mysp-hpage-reduce .mysp-hpage-flip.is-flip-on .mysp-hpage-flip-card:hover .mysp-hpage-flip-f{opacity:0;pointer-events:none}
.mysp-hpage-reduce .mysp-hpage-flip.is-flip-on .mysp-hpage-flip-card:hover .mysp-hpage-flip-b{opacity:1;pointer-events:auto}
}

/* Tabs (v0.54.0): dasar = semua panel berurutan dengan judulnya (tanpa JS); .is-on dipasang JS */
.mysp-hpage-type-tabs .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);gap:0}
.mysp-hpage-tabs{max-width:900px;width:100%;margin:0 auto;display:grid;gap:16px;text-align:left}
.mysp-hpage-tabs-p{text-align:left;padding:24px 26px}
.mysp-hpage-tabs-h{margin:0 0 10px;font-size:1.25rem;line-height:1.3}
.mysp-hpage-tabs-ico{color:var(--mysp-hpage-accent)}
.mysp-hpage-light .mysp-hpage-tabs-ico{color:var(--mysp-hpage-primary)}
.mysp-hpage-tabs-b{font-size:1rem;line-height:1.7;overflow-wrap:anywhere}
.mysp-hpage-tabs-b>:first-child{margin-top:0}
.mysp-hpage-tabs-b>:last-child{margin-bottom:0}
.mysp-hpage-tabs-b img{max-width:100%;height:auto;border-radius:10px}
.mysp-hpage-tabs-b a{color:var(--mysp-hpage-accent);text-decoration:underline}
.mysp-hpage-light .mysp-hpage-tabs-b a{color:var(--mysp-hpage-primary)}
.mysp-hpage-tabs-b ul,.mysp-hpage-tabs-b ol{padding-left:1.3em}
.mysp-hpage-tabs.is-on{gap:0}
.mysp-hpage-tabs.is-on .mysp-hpage-tabs-h{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.mysp-hpage-tabs.is-on .mysp-hpage-tabs-p:focus-visible{outline:2px solid var(--mysp-hpage-accent);outline-offset:3px}
.mysp-hpage-tabs.is-on .mysp-hpage-tabs-p:not([hidden]){animation:mysp-hpage-tabin .35s ease both}
@keyframes mysp-hpage-tabin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.mysp-hpage-tabs-list{display:flex;flex-wrap:nowrap;gap:8px;margin:0 0 18px;padding:0 0 6px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin;justify-content:flex-start}
.mysp-hpage-tabs-t{flex:none;display:inline-flex;align-items:center;gap:8px;margin:0;padding:10px 20px;border:1px solid rgba(127,127,127,.4);border-radius:999px;background:transparent;color:inherit;font:inherit;font-weight:600;line-height:1.3;white-space:nowrap;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.mysp-hpage-tabs-t:hover{border-color:var(--mysp-hpage-accent)}
.mysp-hpage-tabs-t[aria-selected="true"]{background:linear-gradient(135deg,var(--mysp-hpage-primary),var(--mysp-hpage-accent));border-color:transparent;color:#fff}
.mysp-hpage-tabs-t:focus-visible{outline:2px solid var(--mysp-hpage-accent);outline-offset:2px}
.mysp-hpage-reduce .mysp-hpage-tabs-t{transition:none}
.mysp-hpage-reduce .mysp-hpage-tabs.is-on .mysp-hpage-tabs-p:not([hidden]){animation:none}
@media (max-width:640px){.mysp-hpage-tabs-t{padding:9px 16px;font-size:.92rem}.mysp-hpage-tabs-p{padding:20px 18px}}
.mysp-hpage-tabs-p[hidden]{display:none}

/* Pembanding gambar (v0.55.0): dasar = dua gambar bertumpuk (terbaca tanpa JS); .is-on dipasang JS */
.mysp-hpage-type-compare .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);gap:0}
.mysp-hpage-cmp{max-width:900px;width:100%;margin:0 auto;display:grid;gap:14px}
.mysp-hpage-cmp-f{position:relative;margin:0;border-radius:16px;overflow:hidden}
.mysp-hpage-cmp-f img{display:block;width:100%;height:auto}
.mysp-hpage-cmp-lb{position:absolute;top:12px;left:12px;padding:4px 12px;border-radius:999px;background:rgba(0,0,0,.65);color:#fff;font-size:.82rem;font-weight:700;line-height:1.4;pointer-events:none}
.mysp-hpage-cmp.is-on{display:block;position:relative;overflow:hidden;border-radius:16px;touch-action:pan-y;-webkit-user-select:none;user-select:none;cursor:ew-resize;box-shadow:0 12px 34px rgba(0,0,0,.25)}
.mysp-hpage-cmp.is-on .mysp-hpage-cmp-f{border-radius:0}
.mysp-hpage-cmp.is-on .mysp-hpage-cmp-a{position:absolute;inset:0;clip-path:inset(0 0 0 var(--p,50%));-webkit-clip-path:inset(0 0 0 var(--p,50%))}
.mysp-hpage-cmp.is-on .mysp-hpage-cmp-a img{height:100%;object-fit:cover}
.mysp-hpage-cmp.is-on .mysp-hpage-cmp-a .mysp-hpage-cmp-lb{left:auto;right:12px}
.mysp-hpage-cmp-h{position:absolute;top:0;bottom:0;left:var(--p,50%);width:0;pointer-events:none}
.mysp-hpage-cmp-h::before{content:"";position:absolute;top:0;bottom:0;left:-1.5px;width:3px;background:#fff;box-shadow:0 0 8px rgba(0,0,0,.45)}
.mysp-hpage-cmp-k{position:absolute;top:50%;left:0;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:#fff;color:#222;display:grid;place-items:center;font-size:1.1rem;font-weight:800;letter-spacing:-.05em;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.mysp-hpage-cmp-r{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;opacity:0}
.mysp-hpage-cmp-r:focus-visible~.mysp-hpage-cmp-h .mysp-hpage-cmp-k{outline:3px solid var(--mysp-hpage-accent);outline-offset:3px}

/* Carousel artikel & produk (v0.57.0): dasar = scroll-snap horizontal (bisa digeser tanpa JS); panah, titik, jeda ditambah JS */
.mysp-hpage-wpgrid.is-carousel{--pv:4;--cg:22px;display:flex;gap:var(--cg);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding:0 4px;padding:8px 4px 12px;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:thin}
.mysp-hpage-wpgrid.is-carousel>*{flex:0 0 calc((100% - (var(--pv) - 1)*var(--cg))/var(--pv));min-width:0;scroll-snap-align:start;box-sizing:border-box}
@media (max-width:1099px){.mysp-hpage-wpgrid.is-carousel{--pv:3}}
@media (max-width:799px){.mysp-hpage-wpgrid.is-carousel{--pv:2}}
@media (max-width:559px){.mysp-hpage-wpgrid.is-carousel{--pv:1}}
.mysp-hpage-embed .mysp-hpage-wpgrid.is-carousel{--pv:2}
@media (max-width:640px){.mysp-hpage-embed .mysp-hpage-wpgrid.is-carousel{--pv:1}}
.mysp-hpage-wpgrid.is-carousel.is-car-on{scrollbar-width:none}
.mysp-hpage-wpgrid.is-carousel.is-car-on::-webkit-scrollbar{display:none}
.mysp-hpage-car{position:relative;min-width:0}
.mysp-hpage-car-view{position:relative}
.mysp-hpage-car-btn{position:absolute;top:50%;z-index:3;width:44px;height:44px;margin:-22px 0 0;padding:0;border:0;border-radius:50%;background:rgba(0,0,0,.65);color:#fff;font-size:1.4rem;line-height:1;cursor:pointer;display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.35);transition:opacity .2s,background .2s}
.mysp-hpage-car-btn:hover:not(:disabled){background:var(--mysp-hpage-primary)}
.mysp-hpage-car-btn:disabled{opacity:.3;cursor:default}
.mysp-hpage-car-btn:focus-visible,.mysp-hpage-car-dot:focus-visible,.mysp-hpage-car-pp:focus-visible{outline:3px solid var(--mysp-hpage-accent);outline-offset:2px}
.mysp-hpage-car-prev{left:6px}
.mysp-hpage-car-next{right:6px}
.mysp-hpage-car-nav{display:flex;justify-content:center;align-items:center;gap:2px;margin-top:6px}
.mysp-hpage-car-dot,.mysp-hpage-car-pp{width:24px;height:24px;margin:0;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;display:grid;place-items:center;font-size:.7rem;line-height:1}
.mysp-hpage-car-dot::before{content:"";width:10px;height:10px;border-radius:50%;background:currentColor;opacity:.3;transition:opacity .2s,transform .2s}
.mysp-hpage-car-dot[aria-current="true"]::before{opacity:1;background:var(--mysp-hpage-accent);transform:scale(1.25)}
.mysp-hpage-light .mysp-hpage-car-dot[aria-current="true"]::before{background:var(--mysp-hpage-primary)}
.mysp-hpage-car-pp{margin-left:8px;opacity:.8}
.mysp-hpage-car.is-static .mysp-hpage-car-btn,.mysp-hpage-car.is-static .mysp-hpage-car-nav{display:none}
.mysp-hpage-reduce .mysp-hpage-car-btn,.mysp-hpage-reduce .mysp-hpage-car-dot::before{transition:none}
@media (max-width:559px){.mysp-hpage-car-btn{width:38px;height:38px;margin-top:-19px;font-size:1.2rem}}

/* ===== v0.58.0: tampil / sembunyi per perangkat =====
   Breakpoint sama dengan grid plugin: desktop >= 1001px, tablet 641-1000px, HP <= 640px.
   Elemen tidak dihapus dari HTML, hanya display:none lewat kelas. */
@media (min-width:1001px){.mysp-hpage .mysp-hpage-hd-d{display:none!important}}
@media (min-width:641px) and (max-width:1000px){.mysp-hpage .mysp-hpage-hd-t{display:none!important}}
@media (max-width:640px){.mysp-hpage .mysp-hpage-hd-m{display:none!important}}
/* Preview admin: tetap tampil, redup di lebar yang disembunyikan */
@media (min-width:1001px){.mysp-hpage .mysp-hpage-hdp-d{opacity:.35;outline:2px dashed #b45309;outline-offset:-2px}}
@media (min-width:641px) and (max-width:1000px){.mysp-hpage .mysp-hpage-hdp-t{opacity:.35;outline:2px dashed #b45309;outline-offset:-2px}}
@media (max-width:640px){.mysp-hpage .mysp-hpage-hdp-m{opacity:.35;outline:2px dashed #b45309;outline-offset:-2px}}
:where([class*="mysp-hpage-hdp-"]){position:relative}
.mysp-hpage-hd-tag{position:absolute;top:8px;right:8px;z-index:7;display:inline-flex;align-items:center;gap:6px;max-width:calc(100% - 16px);padding:4px 10px;border-radius:999px;background:#fffbeb;color:#92400e;border:1px solid #f59e0b;font:600 12px/1.3 system-ui,sans-serif;letter-spacing:0;text-transform:none;pointer-events:none}
.mysp-hpage-dots button.is-devhid{display:none!important}

/* v0.63.0: section Bagikan dan Progress Bar satu kolom (judul di atas, isi di bawah), sama seperti tipe section lain */
.mysp-hpage-type-share .mysp-hpage-section-inner,.mysp-hpage-type-progress .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);gap:0}
.mysp-hpage-type-progress .mysp-hpage-section-inner{max-width:820px}

/* v0.65.0: section HTML / Shortcode */
.mysp-hpage-type-html .mysp-hpage-section-inner{grid-template-columns:minmax(0,1fr);gap:0}
.mysp-hpage-html{min-width:0;max-width:100%}
.mysp-hpage-html img,.mysp-hpage-html iframe,.mysp-hpage-html video{max-width:100%}
.mysp-hpage-html-full .mysp-hpage-section-inner{max-width:none}
.mysp-hpage-html-full{padding-left:0;padding-right:0}
.mysp-hpage-html-full .mysp-hpage-head{box-sizing:border-box;max-width:1150px;margin-left:auto;margin-right:auto;padding-left:clamp(16px,4vw,40px);padding-right:clamp(16px,4vw,40px)}

/* v0.66.0 / v0.67.0: layout Magazine (kiri-kanan: is-mag-lr = side, ov, rev; atas-bawah: is-mag-tb = top, two) */
.mysp-hpage-wpgrid.is-mag-lr{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:22px;align-items:stretch}
.mysp-hpage-wpgrid.is-mag_rev{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)}
.mysp-hpage-wpgrid.is-mag_rev .mysp-hpage-mag-main{order:2}
.mysp-hpage-wpgrid.is-mag-tb{grid-template-columns:minmax(0,1fr);gap:22px}
.mysp-hpage-mag-main{display:flex;min-width:0}
.mysp-hpage-mag-main>.mysp-hpage-wpcard{flex:1 1 auto;min-width:0}
.mysp-hpage-mag-main h3{font-size:clamp(1.3rem,2.4vw,1.7rem);line-height:1.25}
.mysp-hpage-mag-main .mysp-hpage-wpcard-body{padding:22px 24px 26px}
.mysp-hpage-wpgrid.is-mag_two .mysp-hpage-mag-main{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.mysp-hpage-wpgrid.is-mag_two .mysp-hpage-mag-main.is-one{grid-template-columns:minmax(0,1fr)}
.mysp-hpage-wpgrid.is-mag_two .mysp-hpage-mag-main h3{font-size:clamp(1.1rem,2vw,1.35rem)}
.mysp-hpage-wpgrid.is-mag_two .mysp-hpage-mag-main .mysp-hpage-wpcard-body{padding:18px 20px 22px}
.mysp-hpage-mag-rest{display:grid;gap:14px;min-width:0;align-content:start}
.mysp-hpage-wpgrid.is-mag-lr .mysp-hpage-mag-rest{grid-auto-rows:minmax(0,1fr);align-content:stretch}
.mysp-hpage-mag-rest>.mysp-hpage-wpcard{flex-direction:row;align-items:stretch;min-width:0}
.mysp-hpage-mag-rest .mysp-hpage-wpcard-img{flex:0 0 min(36%,200px);aspect-ratio:auto;min-height:96px}
.mysp-hpage-mag-rest .mysp-hpage-wpcard-body{padding:12px 16px;gap:4px;justify-content:center}
.mysp-hpage-mag-rest h3{font-size:1rem;line-height:1.3}
.mysp-hpage-mag-rest .mysp-hpage-wpcard-ex,.mysp-hpage-mag-rest .mysp-hpage-wpcard-more{display:none}
.mysp-hpage-wpgrid.is-mag-lr .mysp-hpage-mag-main .mysp-hpage-wpcard-img{flex:1 1 auto;aspect-ratio:auto;min-height:260px}
.mysp-hpage-wpgrid.is-mag-lr .mysp-hpage-mag-main .mysp-hpage-wpcard-img img,.mysp-hpage-mag-rest .mysp-hpage-wpcard-img img{position:absolute;inset:0}
.mysp-hpage-wpgrid.is-mag_top .mysp-hpage-mag-main .mysp-hpage-wpcard-img{aspect-ratio:21/9}
.mysp-hpage-wpgrid.is-mag-tb .mysp-hpage-mag-rest .mysp-hpage-wpcard-img{flex-basis:min(30%,220px);min-height:110px}
.mysp-hpage-wpgrid.no-img .mysp-hpage-mag-rest .mysp-hpage-wpcard-body{padding:14px 18px}
/* Overlay: judul dan meta di atas gambar kartu besar (hanya bila gambar ditampilkan) */
.mysp-hpage-wpgrid.is-mag_ov:not(.no-img) .mysp-hpage-mag-main>.mysp-hpage-wpcard{position:relative;min-height:320px;justify-content:flex-end;color:#fff}
.mysp-hpage-wpgrid.is-mag_ov:not(.no-img) .mysp-hpage-mag-main .mysp-hpage-wpcard-img{position:absolute;inset:0;flex:none;height:100%;min-height:0;background:#1b2230}
.mysp-hpage-wpgrid.is-mag_ov:not(.no-img) .mysp-hpage-mag-main .mysp-hpage-wpcard-body{position:relative;z-index:1;flex:0 0 auto;padding:80px 24px 24px;background:linear-gradient(to top,rgba(0,0,0,.84),rgba(0,0,0,.55) 55%,rgba(0,0,0,0))}
.mysp-hpage-wpgrid.is-mag_ov:not(.no-img) .mysp-hpage-mag-main h3 a,.mysp-hpage-wpgrid.is-mag_ov:not(.no-img) .mysp-hpage-mag-main .mysp-hpage-wpcard-meta,.mysp-hpage-wpgrid.is-mag_ov:not(.no-img) .mysp-hpage-mag-main .mysp-hpage-wpcard-ex,.mysp-hpage-wpgrid.is-mag_ov:not(.no-img) .mysp-hpage-mag-main .mysp-hpage-wpcard-more{color:#fff}
.mysp-hpage-wpgrid.is-mag_ov:not(.no-img) .mysp-hpage-mag-main .mysp-hpage-wpcard-meta{opacity:.9}
@media (max-width:760px){
.mysp-hpage-wpgrid.is-mag-lr,.mysp-hpage-wpgrid.is-mag_rev{grid-template-columns:minmax(0,1fr)}
.mysp-hpage-wpgrid.is-mag_rev .mysp-hpage-mag-main{order:0}
.mysp-hpage-wpgrid.is-mag-lr .mysp-hpage-mag-main .mysp-hpage-wpcard-img,.mysp-hpage-wpgrid.is-mag_top .mysp-hpage-mag-main .mysp-hpage-wpcard-img{flex:none;aspect-ratio:16/10;min-height:0}
.mysp-hpage-wpgrid.is-mag_ov:not(.no-img) .mysp-hpage-mag-main .mysp-hpage-wpcard-img{position:absolute;inset:0;aspect-ratio:auto;height:100%}
.mysp-hpage-wpgrid.is-mag_ov:not(.no-img) .mysp-hpage-mag-main>.mysp-hpage-wpcard{min-height:280px}
.mysp-hpage-mag-rest .mysp-hpage-wpcard-img,.mysp-hpage-wpgrid.is-mag-tb .mysp-hpage-mag-rest .mysp-hpage-wpcard-img{flex-basis:34%}
}
@media (max-width:560px){.mysp-hpage-wpgrid.is-mag_two .mysp-hpage-mag-main{grid-template-columns:minmax(0,1fr)}}
.mysp-hpage-embed .mysp-hpage-wpgrid.is-mag-lr,.mysp-hpage-embed .mysp-hpage-wpgrid.is-mag_rev{grid-template-columns:minmax(0,1fr)}
.mysp-hpage-embed .mysp-hpage-wpgrid.is-mag_rev .mysp-hpage-mag-main{order:0}
.mysp-hpage-embed .mysp-hpage-wpgrid.is-mag_two .mysp-hpage-mag-main{grid-template-columns:minmax(0,1fr)}

/* ===== Breaking News (v0.74.0) ===== */
.mysp-hpage-section.mysp-hpage-type-breaking{padding:12px 0}
.mysp-hpage-type-breaking .mysp-hpage-section-inner{display:block;max-width:none;margin:0}
.mysp-hpage-bn{--bn-c:#e11d48;position:relative;display:flex;align-items:stretch;min-height:44px;background:rgba(255,255,255,.07);border-block:1px solid rgba(255,255,255,.14);color:var(--mysp-hpage-text);font-size:15px;line-height:1.4}
.mysp-hpage-light .mysp-hpage-bn{background:rgba(0,0,0,.05);border-block-color:rgba(0,0,0,.12);color:var(--mysp-hpage-dark)}
.mysp-hpage-bn-label{position:relative;z-index:2;flex:none;display:inline-flex;align-items:center;gap:.55em;padding:0 1.1rem;background:var(--bn-c);color:#fff;font-size:.82em;font-weight:800;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.mysp-hpage-bn-label::after{content:"";position:absolute;top:0;right:-10px;bottom:0;width:10px;background:var(--bn-c);clip-path:polygon(0 0,100% 50%,0 100%)}
.mysp-hpage-bn-dot{width:.6em;height:.6em;border-radius:50%;background:#fff;animation:mysp-hpage-bn-pulse 1.4s ease-in-out infinite}
@keyframes mysp-hpage-bn-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}
.mysp-hpage-bn-view{position:relative;flex:1 1 auto;min-width:0;display:flex;align-items:center;margin-left:12px;overflow:hidden}
.mysp-hpage-bn ul{margin:0;padding:0;list-style:none}
.mysp-hpage-bn li{white-space:nowrap}
.mysp-hpage-bn li a{color:inherit;text-decoration:none}
.mysp-hpage-bn li a:hover,.mysp-hpage-bn li a:focus-visible{text-decoration:underline}
.mysp-hpage-bn-thumb{display:inline-block;vertical-align:middle;width:1.9em;height:1.9em;margin:-.2em .6em 0 0;border-radius:6px;object-fit:cover;background:rgba(127,127,127,.2)}
.mysp-hpage-bn.is-live .mysp-hpage-bn-rot .mysp-hpage-bn-thumb{margin-top:-.15em}
.mysp-hpage-bn-time{margin-right:.35em;color:var(--bn-c);font-weight:700;font-variant-numeric:tabular-nums}
.mysp-hpage-bn-track{display:flex;width:max-content;animation:mysp-hpage-bn-scroll var(--bn-dur,40s) linear infinite}
.mysp-hpage-bn-grp{display:flex;flex:none}
.mysp-hpage-bn-grp li{position:relative;flex:none;padding:0 1.6rem}
.mysp-hpage-bn-grp li::after{content:"";position:absolute;top:50%;right:-3px;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--bn-c);opacity:.85}
@keyframes mysp-hpage-bn-scroll{to{transform:translateX(-50%)}}
.mysp-hpage-bn:hover .mysp-hpage-bn-track,.mysp-hpage-bn:focus-within .mysp-hpage-bn-track,.mysp-hpage-bn.is-paused .mysp-hpage-bn-track{animation-play-state:paused}
.mysp-hpage-bn-rot{width:100%}
.mysp-hpage-bn-rot li{padding:.55rem 1rem .55rem 0;white-space:normal}
.mysp-hpage-bn.is-live .mysp-hpage-bn-view{height:2.9em}
.mysp-hpage-bn.is-live .mysp-hpage-bn-rot{position:relative;height:100%}
.mysp-hpage-bn.is-live .mysp-hpage-bn-rot li{position:absolute;inset:0;display:block;padding:0 1rem 0 0;line-height:2.9em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;visibility:hidden;transition:opacity .45s ease,visibility 0s .45s}
.mysp-hpage-bn.is-live .mysp-hpage-bn-rot li.is-on{opacity:1;visibility:visible;transition:opacity .45s ease}
.mysp-hpage-bn-pp{display:none;flex:none;align-items:center;justify-content:center;width:44px;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;opacity:.75}
.mysp-hpage-js .mysp-hpage-bn-pp{display:inline-flex}
.mysp-hpage-bn-pp:hover,.mysp-hpage-bn-pp:focus-visible{opacity:1}
.mysp-hpage-bn-pp:focus-visible{outline:2px solid var(--bn-c);outline-offset:-3px}
.mysp-hpage-bn-pp .p-play{display:none}
.mysp-hpage-bn.is-paused .mysp-hpage-bn-pp .p-pause{display:none}
.mysp-hpage-bn.is-paused .mysp-hpage-bn-pp .p-play{display:inline}
.mysp-hpage-reduce .mysp-hpage-bn-pp{display:none!important}
.mysp-hpage-reduce .mysp-hpage-bn-view{overflow-x:auto;scrollbar-width:thin}
.mysp-hpage-reduce .mysp-hpage-bn-grp[aria-hidden]{display:none}
@media(prefers-reduced-motion:reduce){.mysp-hpage:not(.mysp-hpage-js) .mysp-hpage-bn-track{animation:none}.mysp-hpage:not(.mysp-hpage-js) .mysp-hpage-bn-view{overflow-x:auto}.mysp-hpage:not(.mysp-hpage-js) .mysp-hpage-bn-grp[aria-hidden]{display:none}}
@media(max-width:600px){.mysp-hpage-bn{font-size:14px}.mysp-hpage-bn-label{padding:0 .8rem}.mysp-hpage-bn-grp li{padding:0 1.2rem}}

/* v0.116.5/6: Breaking News dengan thumbnail (40px, tinggi strip hampir sama dengan tanpa thumbnail) + judul dan tanggal kecil dua baris di sampingnya */
.mysp-hpage-bn.has-thumb .mysp-hpage-bn-view{padding-block:3px}
.mysp-hpage-bn li.has-th{display:flex;align-items:center;gap:.7em}
.mysp-hpage-bn li.has-th .mysp-hpage-bn-thumb{flex:none;width:40px;height:40px;margin:0;border-radius:5px}
.mysp-hpage-bn-txt{display:flex;flex-direction:column;justify-content:center;gap:.1em;min-width:0;line-height:1.2}
.mysp-hpage-bn-ttl{display:block;max-width:min(420px,72vw);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:600}
.mysp-hpage-bn li.has-th .mysp-hpage-bn-time{margin:0;color:inherit;opacity:.65;font-size:.74em;font-weight:500;line-height:1.2}
.mysp-hpage-bn.has-thumb.is-live .mysp-hpage-bn-view{height:46px;box-sizing:border-box}
.mysp-hpage-bn.has-thumb.is-live .mysp-hpage-bn-rot li.has-th{display:flex;align-items:center;line-height:1.2;padding:0 1rem 0 0}
.mysp-hpage-bn.has-thumb .mysp-hpage-bn-rot li.has-th{padding-block:0}
.mysp-hpage-bn.has-thumb .mysp-hpage-bn-rot li.has-th .mysp-hpage-bn-txt{flex:1 1 auto}
.mysp-hpage-bn.has-thumb .mysp-hpage-bn-rot li.has-th .mysp-hpage-bn-ttl{max-width:100%}
.mysp-hpage-bn.has-thumb .mysp-hpage-bn-rot li:not(.has-th){display:flex;align-items:center}
@media(max-width:600px){.mysp-hpage-bn li.has-th .mysp-hpage-bn-thumb{width:36px;height:36px}.mysp-hpage-bn.has-thumb.is-live .mysp-hpage-bn-view{height:42px;box-sizing:border-box}}

/* ===== v0.77.0: section Ikon Berjalan (ikon Font Awesome + label, marquee) ===== */
.mysp-hpage-section.mysp-hpage-type-icons{padding-top:clamp(28px,5vw,52px);padding-bottom:clamp(28px,5vw,52px)}
.mysp-hpage-type-icons .mysp-hpage-head{margin-bottom:clamp(14px,3vw,28px)}
.mysp-hpage-iconmq{overflow:hidden;width:100%;position:relative}
.mysp-hpage-iconmq-track{display:flex;width:max-content;animation:mysp-hpage-iconmq var(--d,50s) linear infinite;will-change:transform}
.mysp-hpage-iconmq:hover .mysp-hpage-iconmq-track{animation-play-state:paused}
.mysp-hpage-iconmq-set{display:flex;flex:none;align-items:center;gap:var(--ic-gap,40px);padding-right:var(--ic-gap,40px)}
@keyframes mysp-hpage-iconmq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mysp-hpage-ic-item{flex:none;display:inline-flex;align-items:center;gap:12px;color:inherit;text-decoration:none;white-space:nowrap;line-height:1}
.mysp-hpage-ic-ico{display:inline-flex;align-items:center;justify-content:center;font-size:var(--ic-size,40px);line-height:1;opacity:.85;transition:transform .2s,opacity .2s}
.mysp-hpage-ic-item:hover .mysp-hpage-ic-ico{transform:scale(1.1);opacity:1}
.mysp-hpage-ic-lbl{font-weight:600}
.mysp-hpage-iconmq.is-static .mysp-hpage-iconmq-track{animation:none;width:100%;justify-content:center}
.mysp-hpage-iconmq.is-static .mysp-hpage-iconmq-set{flex-wrap:wrap;justify-content:center;padding-right:0}
.mysp-hpage-reduce .mysp-hpage-iconmq-track{animation:none;width:100%;justify-content:center}
.mysp-hpage-reduce .mysp-hpage-iconmq-set{flex-wrap:wrap;justify-content:center;padding-right:0}
.mysp-hpage-reduce .mysp-hpage-iconmq-set[aria-hidden="true"]{display:none}
@media(max-width:767px){.mysp-hpage-ic-ico{font-size:calc(var(--ic-size,40px) * .8)}}

/* ===== v0.78.0: navigasi halaman Recent Posts (pagination angka / muat lebih banyak) ===== */
.mysp-hpage-pager,.mysp-hpage-loadmore{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:clamp(22px,4vw,36px)}
.mysp-hpage-pg-btn{min-width:42px;height:42px;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;border:1px solid rgba(128,128,128,.45);color:inherit;text-decoration:none;font-weight:700;font-size:.92rem;line-height:1;transition:border-color .2s,background .2s}
a.mysp-hpage-pg-btn:hover,a.mysp-hpage-pg-btn:focus-visible{border-color:var(--mysp-hpage-accent)}
.mysp-hpage-pg-btn.is-cur{background:var(--mysp-hpage-accent);border-color:var(--mysp-hpage-accent);color:var(--mysp-hpage-dark,#111)}
.mysp-hpage-pg-gap{padding:0 4px;opacity:.7}
.mysp-hpage-loadmore .mysp-hpage-pg-btn{padding:0 28px}
.mysp-hpage-loadmore .mysp-hpage-pg-btn[aria-busy="true"]{opacity:.6;pointer-events:none}

/* ===== v0.79.0: identitas situs di navbar (logo + judul + tagline) ===== */
.mysp-hpage-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.mysp-hpage-brand-logo{flex:none;display:inline-flex}
.mysp-hpage-brand-logo img{display:block;height:var(--mysp-hpage-logo-h,48px);width:auto;max-width:min(240px,50vw);object-fit:contain}
.mysp-hpage-brand-txt{display:flex;flex-direction:column;min-width:0;line-height:1.15}
.mysp-hpage-brand-tag{margin-top:2px;font-family:var(--mysp-hpage-font-b,inherit);font-size:.62em;font-weight:500;letter-spacing:.04em;opacity:.78}
.mysp-hpage-nav.is-scrolled .mysp-hpage-brand-logo img{height:calc(var(--mysp-hpage-logo-h,48px) * .75)}
@media(max-width:640px){.mysp-hpage-brand-logo img{height:calc(var(--mysp-hpage-logo-h,48px) * .8)}}

/* ===== v0.79.2: <summary> lebih ramah pengguna (FAQ expand/collapse) ===== */
.mysp-hpage-faq-item summary{min-height:56px;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;transition:background .25s,color .25s}
.mysp-hpage-faq-item summary:hover{background:rgba(255,255,255,.07)}
.mysp-hpage-light .mysp-hpage-faq-item summary:hover{background:rgba(0,0,0,.03)}
.mysp-hpage-faq-item summary:active{background:rgba(255,255,255,.11)}
.mysp-hpage-light .mysp-hpage-faq-item summary:active{background:rgba(0,0,0,.06)}
.mysp-hpage-faq-item summary:hover .mysp-hpage-faq-ico{box-shadow:0 0 0 5px rgba(212,175,55,.22);box-shadow:0 0 0 5px color-mix(in srgb,var(--mysp-hpage-accent) 25%,transparent)}
.mysp-hpage-faq-item summary:active .mysp-hpage-faq-ico{transform:scale(.9)}
.mysp-hpage-faq-item[open] summary:active .mysp-hpage-faq-ico{transform:rotate(180deg) scale(.9)}
.mysp-hpage-faq-item[open]>summary{border-bottom:1px solid rgba(255,255,255,.12);color:var(--mysp-hpage-accent)}
.mysp-hpage-light .mysp-hpage-faq-item[open]>summary{border-bottom-color:rgba(0,0,0,.08);color:var(--mysp-hpage-primary)}
.mysp-hpage-faq-item[open]{box-shadow:0 10px 30px rgba(0,0,0,.18)}
.mysp-hpage-faq-q{flex:1;min-width:0}
.mysp-hpage-reduce .mysp-hpage-faq-item summary,.mysp-hpage-reduce .mysp-hpage-faq-ico,.mysp-hpage-reduce .mysp-hpage-faq-ico::before,.mysp-hpage-reduce .mysp-hpage-faq-ico::after{transition:none}
@media(max-width:800px){.mysp-hpage-faq-item summary{min-height:52px}.mysp-hpage-faq-ico{width:32px;height:32px}}
@media(prefers-reduced-motion:reduce){.mysp-hpage-faq-item summary,.mysp-hpage-faq-ico,.mysp-hpage-faq-ico::before,.mysp-hpage-faq-ico::after{transition:none}.mysp-hpage-faq-item[open] .mysp-hpage-faq-a{animation:none}}

/* ===== v0.80.0: avatar penulis di kartu berita ===== */
.mysp-hpage-wpcard-au{display:inline-flex;align-items:center;gap:6px}
.mysp-hpage-wpcard-av{flex:none;width:24px;height:24px;border-radius:50%;object-fit:cover;background:rgba(127,127,127,.25)}

/* v0.80.4: setelah tombol Putar ditekan, ticker berjalan walau kursor / fokus masih di atasnya */
.mysp-hpage-bn.is-playing .mysp-hpage-bn-track{animation-play-state:running}

/* ===== v0.90.0: Mode Per section (scroll-snap) =====
   Section berjejer ke bawah, scroll melompat per section. Kelas diberi JS (html.mysp-hpage-snap-on, .mysp-hpage-snap);
   tanpa JS halaman tetap tampil sebagai scroll biasa. Section lebih tinggi dari layar digulir bebas dulu, baru melompat
   (perilaku bawaan scroll-snap mandatory untuk area yang lebih besar dari layar). */
html.mysp-hpage-snap-on{scroll-snap-type:y mandatory;scroll-padding-top:calc(var(--mysp-snap-off,0px) + var(--wp-admin--admin-bar--height,0px))}
.mysp-hpage.mysp-hpage-snap .mysp-hpage-slide{display:flex;flex-direction:column;scroll-snap-align:start;min-height:100vh;min-height:calc(100svh - var(--mysp-snap-off,0px) - var(--wp-admin--admin-bar--height,0px))}
.mysp-hpage.mysp-hpage-snap .mysp-hpage-slide>.mysp-hpage-hero,.mysp-hpage.mysp-hpage-snap .mysp-hpage-slide>.mysp-hpage-section,.mysp-hpage.mysp-hpage-snap .mysp-hpage-slide>.mysp-hpage-cta{flex:1 0 auto}
.mysp-hpage.mysp-hpage-snap .mysp-hpage-slide>.mysp-hpage-hero{height:auto}
.mysp-hpage.mysp-hpage-snap .mysp-hpage-slide>.mysp-hpage-marquee{flex:none}
.mysp-hpage.mysp-hpage-snap .mysp-hpage-section:not(.mysp-hpage-type-slider){display:flex;flex-direction:column;padding-right:calc(6vw + 24px)}
.mysp-hpage.mysp-hpage-snap .mysp-hpage-section:not(.mysp-hpage-type-slider)>.mysp-hpage-section-inner{margin-top:auto;margin-bottom:auto;width:100%}
.mysp-hpage.mysp-hpage-snap .mysp-hpage-cta{display:flex;flex-direction:column;align-items:center;justify-content:center;padding-right:calc(6vw + 24px)}
/* Slider gambar: tinggi mengikuti isinya sendiri, bukan dipaksa satu layar */
.mysp-hpage.mysp-hpage-snap .mysp-hpage-slide.mysp-hpage-slide-auto,.mysp-hpage.mysp-hpage-snap .mysp-hpage-slide:has(>.mysp-hpage-type-slider){min-height:0}
@media(max-width:800px){
  /* HP: snap longgar (proximity) supaya section panjang tidak "menahan" jari; dots lebih kecil sudah diatur di atas */
  html.mysp-hpage-snap-on{scroll-snap-type:y proximity}
  .mysp-hpage.mysp-hpage-snap .mysp-hpage-section:not(.mysp-hpage-type-slider),.mysp-hpage.mysp-hpage-snap .mysp-hpage-cta{padding-right:calc(5vw + 18px)}
}

/* ===== v0.91.0: Mode Parallax = mesin slide ===== */
/* Animasi masuk hero baru berjalan saat slide-nya aktif (bukan saat halaman dimuat) */
.mysp-hpage-fp .mysp-hpage-slide:not(.is-current) .mysp-hpage-hero-title,.mysp-hpage-fp .mysp-hpage-slide:not(.is-current) .mysp-hpage-hero-sub,.mysp-hpage-fp .mysp-hpage-slide:not(.is-current) .mysp-hpage-hero-inner .mysp-hpage-btn,.mysp-hpage-fp .mysp-hpage-slide:not(.is-current) .mysp-hpage-word>span{animation-play-state:paused}
/* Fallback HP: mode Parallax jatuh ke tampilan Bebas, hiasan melayang dari PHP disembunyikan */
.mysp-hpage-fallback .mysp-hpage-floater{display:none}

/* ===== v0.94.0: style dots (round = bawaan di atas). Kelas .mysp-hpage-dotstyle-<nama> di wrapper. ===== */
.mysp-hpage .mysp-hpage-dots{--dc:rgba(255,255,255,.75);--da:var(--mysp-hpage-accent)}
.mysp-hpage-on-light .mysp-hpage-dots{--dc:rgba(29,43,38,.55);--da:var(--mysp-hpage-primary)}
.mysp-hpage-reduce .mysp-hpage-dots button::before{animation:none}
/* kotak */
.mysp-hpage.mysp-hpage-dotstyle-square .mysp-hpage-dots button{border-radius:2px;width:11px;height:11px}
.mysp-hpage.mysp-hpage-dotstyle-square .mysp-hpage-dots button.is-active{transform:scale(1.4)}
.mysp-hpage.mysp-hpage-dotstyle-square .mysp-hpage-dots button.is-active::before{border-radius:4px}
/* belah ketupat (bentuk digambar ::before agar tooltip tidak ikut berputar) */
.mysp-hpage.mysp-hpage-dotstyle-diamond .mysp-hpage-dots button,.mysp-hpage.mysp-hpage-dotstyle-diamond .mysp-hpage-dots button:hover,.mysp-hpage.mysp-hpage-dotstyle-diamond .mysp-hpage-dots button:focus-visible,.mysp-hpage.mysp-hpage-dotstyle-diamond .mysp-hpage-dots button.is-active{background:transparent;box-shadow:none;width:14px;height:14px}
.mysp-hpage.mysp-hpage-dotstyle-diamond .mysp-hpage-dots button::before,.mysp-hpage.mysp-hpage-dotstyle-diamond .mysp-hpage-dots button.is-active::before{content:"";position:absolute;inset:2px;border:0;border-radius:2px;background:var(--dc);rotate:45deg;animation:none;transition:background .3s,box-shadow .3s}
.mysp-hpage.mysp-hpage-dotstyle-diamond .mysp-hpage-dots button:hover::before{background:#fff}
.mysp-hpage.mysp-hpage-dotstyle-diamond .mysp-hpage-dots button.is-active::before{inset:0;background:var(--da);box-shadow:0 0 10px var(--da)}
.mysp-hpage.mysp-hpage-dotstyle-diamond .mysp-hpage-dots button.is-active{transform:scale(1.2)}
/* cincin: kosong, aktif terisi */
.mysp-hpage.mysp-hpage-dotstyle-ring .mysp-hpage-dots button,.mysp-hpage.mysp-hpage-dotstyle-ring .mysp-hpage-dots button:hover,.mysp-hpage.mysp-hpage-dotstyle-ring .mysp-hpage-dots button:focus-visible,.mysp-hpage.mysp-hpage-dotstyle-ring .mysp-hpage-dots button.is-active{background:transparent;box-shadow:none;width:14px;height:14px}
.mysp-hpage.mysp-hpage-dotstyle-ring .mysp-hpage-dots button::before,.mysp-hpage.mysp-hpage-dotstyle-ring .mysp-hpage-dots button.is-active::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--dc);background:transparent;animation:none;transition:background .3s,border-color .3s,box-shadow .3s}
.mysp-hpage.mysp-hpage-dotstyle-ring .mysp-hpage-dots button:hover::before{border-color:#fff}
.mysp-hpage.mysp-hpage-dotstyle-ring .mysp-hpage-dots button.is-active::before{background:var(--da);border-color:var(--da);box-shadow:0 0 10px var(--da)}
.mysp-hpage.mysp-hpage-dotstyle-ring .mysp-hpage-dots button.is-active{transform:scale(1.2)}
/* kapsul: aktif memanjang ke bawah */
.mysp-hpage.mysp-hpage-dotstyle-pill .mysp-hpage-dots{gap:10px}
.mysp-hpage.mysp-hpage-dotstyle-pill .mysp-hpage-dots button{width:8px;height:8px;border-radius:99px;transition:height .35s,background .3s}
.mysp-hpage.mysp-hpage-dotstyle-pill .mysp-hpage-dots button.is-active{height:28px;transform:none}
.mysp-hpage.mysp-hpage-dotstyle-pill .mysp-hpage-dots button.is-active::before{display:none}
/* garis: aktif lebih panjang */
.mysp-hpage.mysp-hpage-dotstyle-line .mysp-hpage-dots{gap:12px;align-items:flex-end}
.mysp-hpage.mysp-hpage-dotstyle-line .mysp-hpage-dots button{width:18px;height:3px;border-radius:2px;box-shadow:none;transition:width .35s,background .3s}
.mysp-hpage.mysp-hpage-dotstyle-line .mysp-hpage-dots button.is-active{width:34px;transform:none;box-shadow:0 0 8px var(--da)}
.mysp-hpage.mysp-hpage-dotstyle-line .mysp-hpage-dots button:hover{transform:none}
.mysp-hpage.mysp-hpage-dotstyle-line .mysp-hpage-dots button.is-active::before{display:none}
/* angka: 01, 02, ... (CSS counter, slide yang disembunyikan di perangkat ini tidak dihitung) */
.mysp-hpage.mysp-hpage-dotstyle-number .mysp-hpage-dots{counter-reset:mdot;gap:8px;align-items:flex-end}
.mysp-hpage.mysp-hpage-dotstyle-number .mysp-hpage-dots button,.mysp-hpage.mysp-hpage-dotstyle-number .mysp-hpage-dots button:hover,.mysp-hpage.mysp-hpage-dotstyle-number .mysp-hpage-dots button:focus-visible,.mysp-hpage.mysp-hpage-dotstyle-number .mysp-hpage-dots button.is-active{width:auto;height:auto;min-width:22px;padding:3px 6px 3px 0;border-radius:0;background:transparent;box-shadow:none;transform:none;counter-increment:mdot;color:var(--dc);font:700 .72rem/1 system-ui,sans-serif;letter-spacing:.04em;text-align:right;text-shadow:0 1px 3px rgba(0,0,0,.35);border-right:2px solid transparent;transition:color .3s,border-color .3s,font-size .3s}
.mysp-hpage.mysp-hpage-dotstyle-number .mysp-hpage-dots button::before,.mysp-hpage.mysp-hpage-dotstyle-number .mysp-hpage-dots button.is-active::before{content:counter(mdot,decimal-leading-zero);position:static;inset:auto;border:0;border-radius:0;animation:none}
.mysp-hpage.mysp-hpage-dotstyle-number .mysp-hpage-dots button:hover{color:#fff}
.mysp-hpage.mysp-hpage-dotstyle-number .mysp-hpage-dots button.is-active{color:var(--da);border-right-color:var(--da);font-size:.9rem}
.mysp-hpage-on-light.mysp-hpage-dotstyle-number .mysp-hpage-dots button{text-shadow:none}
.mysp-hpage.mysp-hpage-dotstyle-square .mysp-hpage-dots button::after,.mysp-hpage.mysp-hpage-dotstyle-diamond .mysp-hpage-dots button::after,.mysp-hpage.mysp-hpage-dotstyle-ring .mysp-hpage-dots button::after,.mysp-hpage.mysp-hpage-dotstyle-pill .mysp-hpage-dots button::after,.mysp-hpage.mysp-hpage-dotstyle-line .mysp-hpage-dots button::after,.mysp-hpage.mysp-hpage-dotstyle-number .mysp-hpage-dots button::after{right:calc(100% + 14px)}
@media(max-width:800px){
  .mysp-hpage.mysp-hpage-dotstyle-number .mysp-hpage-dots button,.mysp-hpage.mysp-hpage-dotstyle-number .mysp-hpage-dots button.is-active{font-size:.62rem}
  .mysp-hpage.mysp-hpage-dotstyle-line .mysp-hpage-dots button{width:14px}
  .mysp-hpage.mysp-hpage-dotstyle-line .mysp-hpage-dots button.is-active{width:24px}
}

/* ===== v0.98.1: mode Parallax = slide berganti DI TEMPAT (bukan kontainer yang digeser ke atas) ===== */
/* Semua slide ditumpuk di posisi yang sama. Slide aktif (.is-current) muncul pudar + zoom-out halus dari arah navigasi,
   slide sebelumnya (.is-leaving) tetap tampil di bawahnya sampai tertutup. Layer parallax di dalamnya tetap bergeser (JS). */
.mysp-hpage.mysp-hpage-fp{--mysp-in:44px}
.mysp-hpage.mysp-hpage-fp.mysp-hpage-dir-back{--mysp-in:-44px}
.mysp-hpage-fp .mysp-hpage-slides{position:relative;height:100%;transform:none!important;transition:none;will-change:auto}
.mysp-hpage-fp .mysp-hpage-slide,.mysp-hpage-fp .mysp-hpage-slide.mysp-hpage-slide-auto{position:absolute;left:0;top:0;right:0;bottom:0;height:100%;opacity:0;visibility:hidden;pointer-events:none;z-index:1;transform:translate3d(0,var(--mysp-in),0) scale(1.04);transition:none;backface-visibility:hidden}
.mysp-hpage-fp .mysp-hpage-slide.mysp-hpage-slide-auto{background:var(--mysp-hpage-bg)}
.mysp-hpage-fp .mysp-hpage-slide.is-current{opacity:1;visibility:visible;pointer-events:auto;z-index:3;transform:none;transition:opacity 1s cubic-bezier(.4,0,.2,1),transform 1.1s cubic-bezier(.22,.8,.24,1),visibility 0s}
.mysp-hpage-fp .mysp-hpage-slide.is-leaving:not(.is-current){opacity:1;visibility:visible;z-index:2;transform:translate3d(0,calc(var(--mysp-in) * -.5),0) scale(.97);transition:transform 1.1s cubic-bezier(.22,.8,.24,1)}
/* footer tema WP: naik dari bawah menutupi slide terakhir */
.mysp-hpage-fp .mysp-hpage-footer{position:absolute;left:0;right:0;bottom:0;z-index:6;transform:translate3d(0,102%,0);visibility:hidden;transition:transform .9s cubic-bezier(.77,0,.18,1),visibility 0s .9s}
.mysp-hpage-fp .mysp-hpage-footer.is-on{transform:none;visibility:visible;transition:transform .9s cubic-bezier(.77,0,.18,1),visibility 0s}
/* Kurangi gerakan: langsung berganti tanpa transisi */
.mysp-hpage-reduce.mysp-hpage-fp .mysp-hpage-slide,.mysp-hpage-reduce.mysp-hpage-fp .mysp-hpage-footer{transition:none!important;transform:none!important}

/* ===== v0.99.0: Parallax Firewatch (mode keempat) =====
   Scroll biasa dengan scrollbar (bisa berhenti dan mundur, jalan di HP). Tidak ada mesin slide: slide tetap display:contents seperti mode Bebas.
   Gerak lapisan dikerjakan JS: hero berlapis, isi section lebih pelan (properti translate), dan shape antar section naik menutupi section sebelumnya. */
/* v0.99.1: shape = layer depan. Dasar shape tetap menempel di batas section (tidak ada bagian yang terlepas / mengapung);
   yang naik adalah puncaknya: JS mengisi --fw-r (px), tinggi shape bertambah sebesar itu dan margin atas menyesuaikan, jadi tata letak halaman tidak bergeser.
   Lapisan belakang naik lebih sedikit (kedalaman). */
.mysp-hpage-mode-firewatch .mysp-hpage-shape{height:calc(var(--sh) + 1px + var(--fw-r,0px));margin-top:calc(var(--sh) * -1 - var(--fw-r,0px))}
.mysp-hpage-mode-firewatch .mysp-hpage-shape svg:nth-last-child(2):not(:only-child){height:calc(100% - var(--fw-r,0px) * .3)}
.mysp-hpage-mode-firewatch .mysp-hpage-shape svg:nth-last-child(3){height:calc(100% - var(--fw-r,0px) * .55)}

/* ===== v0.100.0: tali rambat / sulur (overlay SVG setinggi halaman, semua mode) =====
   Elemen .mysp-hpage-vines mengisi seluruh tinggi wrapper (setinggi halaman di mode Per section / Bebas / Firewatch, setinggi layar di mode Parallax).
   Ubin SVG yang menyambung mulus diulang ke bawah (repeat-y). Tidak menangkap klik; di bawah navbar, dots, dan tombol WA. */
.mysp-hpage-vines{position:absolute;left:0;right:0;top:0;bottom:0;z-index:70;overflow:hidden;pointer-events:none}
.mysp-hpage-vine{position:absolute;top:0;bottom:0;display:block;width:var(--mysp-vine-w,140px);opacity:var(--mysp-vine-a,.9);background-image:var(--mysp-vine-img);background-repeat:repeat-y;background-position:center top;background-size:100% auto}
.mysp-hpage-vine.is-left{left:var(--mysp-vine-o,0px)}
.mysp-hpage-vine.is-right{right:var(--mysp-vine-o,0px);transform:scaleX(-1)}
.mysp-hpage-vines.is-sway .mysp-hpage-vine{animation:mysp-hpage-vinesway 7s ease-in-out infinite alternate}
.mysp-hpage-vines.is-sway .mysp-hpage-vine.is-right{animation-duration:8.5s;animation-delay:-3s}
@keyframes mysp-hpage-vinesway{from{translate:-5px 0}to{translate:6px 0}}
.mysp-hpage-reduce .mysp-hpage-vine{animation:none!important}
@media(max-width:640px){
  .mysp-hpage-vine{width:calc(var(--mysp-vine-w,140px) * .6)}
  .mysp-hpage-vines.hide-mobile{display:none}
}

/* ===== v0.101.0: hiasan gantung (ketupat, lampion, lampu, bunting, dll.), overlay SVG dari tepi atas, semua mode =====
   Tinggi dibatasi (maks. sekitar 600 px). Default ikut scroll (absolute di wrapper); .is-fixed menempel di layar. Tidak menangkap klik; di bawah navbar / dots / tombol WA. */
.mysp-hpage-hang{position:absolute;top:var(--hang-top,0px);left:0;right:0;z-index:70;pointer-events:none;opacity:var(--hang-a,1)}
.mysp-hpage-hang.is-fixed{position:fixed}
.mysp-hpage-hang.is-pend{display:flex;justify-content:space-around;align-items:flex-start;padding:0 2vw;box-sizing:border-box}
.mysp-hpage-hang-i{display:block;flex:none;width:var(--hang-w,70px);aspect-ratio:var(--hang-ar1);background:var(--hang-img1) no-repeat center top/100% 100%;transform-origin:50% 0}
.mysp-hpage-hang-i:nth-child(even){aspect-ratio:var(--hang-ar2);background-image:var(--hang-img2)}
.mysp-hpage-hang.is-sway .mysp-hpage-hang-i{animation:mysp-hpage-hangswing 4.4s ease-in-out infinite alternate}
.mysp-hpage-hang.is-sway .mysp-hpage-hang-i:nth-child(2n){animation-duration:5.3s;animation-delay:-1.7s}
.mysp-hpage-hang.is-sway .mysp-hpage-hang-i:nth-child(3n){animation-duration:4.8s;animation-delay:-3s}
.mysp-hpage-hang.is-sway .mysp-hpage-hang-i:nth-child(5n){animation-duration:5.9s;animation-delay:-.8s}
@keyframes mysp-hpage-hangswing{from{rotate:-4deg}to{rotate:4deg}}
.mysp-hpage-hang-g{display:block;height:var(--hang-th,80px);background:var(--hang-img) repeat-x left top/var(--hang-tw,170px) var(--hang-th,80px)}
.mysp-hpage-hang.is-sway .mysp-hpage-hang-g{animation:mysp-hpage-hangglow 2.8s ease-in-out infinite alternate}
@keyframes mysp-hpage-hangglow{from{opacity:.78}to{opacity:1}}
.mysp-hpage-reduce .mysp-hpage-hang-i,.mysp-hpage-reduce .mysp-hpage-hang-g{animation:none!important}
@media(max-width:640px){
  .mysp-hpage-hang-i{width:calc(var(--hang-w,70px) * .7)}
  .mysp-hpage-hang-i:nth-child(n+6){display:none}
  .mysp-hpage-hang-g{height:calc(var(--hang-th,80px) * .7);background-size:calc(var(--hang-tw,170px) * .7) calc(var(--hang-th,80px) * .7)}
  .mysp-hpage-hang.hide-mobile{display:none}
}

/* Iklan / Ads (v0.106.0) */
.mysp-hpage-adwrap{display:flex;flex-direction:column;gap:6px;width:100%;min-width:0}
.mysp-hpage-adwrap.is-center{align-items:center}
.mysp-hpage-adwrap.is-left{align-items:flex-start}
.mysp-hpage-adwrap.is-right{align-items:flex-end}
.mysp-hpage-ad-cap{font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.55}
.mysp-hpage-ad{position:relative;box-sizing:border-box;width:100%;max-width:calc(var(--aw) * 1px);aspect-ratio:var(--aw) / var(--ah);overflow:hidden;border-radius:8px}
.mysp-hpage-ad.is-code{aspect-ratio:auto;min-height:calc(var(--ah) * 1px);overflow:visible;text-align:center}
.mysp-hpage-ad.is-code iframe,.mysp-hpage-ad.is-code img,.mysp-hpage-ad.is-code ins{max-width:100%}
.mysp-hpage-ad-a{display:block;width:100%;height:100%;color:inherit;text-decoration:none}
.mysp-hpage-ad img{display:block;width:100%;height:100%;object-fit:cover}
.mysp-hpage-ad.is-empty{border:2px dashed rgba(127,127,127,.6);background:repeating-linear-gradient(135deg,rgba(127,127,127,.08) 0 12px,rgba(127,127,127,.15) 12px 24px)}
.mysp-hpage-ad-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px;text-align:center;line-height:1.25}
.mysp-hpage-ad-ph small{display:block;font-size:clamp(.62rem,1.9cqw,.8rem);font-weight:400;letter-spacing:.02em;line-height:1.3;opacity:.7}
.mysp-hpage-ad-ph strong{font-size:clamp(.72rem,2.6cqw,1.05rem);letter-spacing:.02em;opacity:.85}
.mysp-hpage-ad.is-empty{container-type:inline-size}
/* v0.119.17: di layar sempit rasio tetap membuat slot kosong terlalu pendek (1200x100 jadi ~30px); beri tinggi minimum supaya Teks 1 + Teks 2 muat. Gambar / kode iklan tetap mengikuti rasio. */
@media (max-width:782px){.mysp-hpage-ad.is-empty{min-height:96px}}
.mysp-hpage-ad-a:hover .mysp-hpage-ad-ph strong,.mysp-hpage-ad-a:focus-visible .mysp-hpage-ad-ph strong{color:var(--mysp-hpage-accent);opacity:1}
.mysp-hpage-light .mysp-hpage-ad-a:hover .mysp-hpage-ad-ph strong,.mysp-hpage-light .mysp-hpage-ad-a:focus-visible .mysp-hpage-ad-ph strong{color:var(--mysp-hpage-primary)}
.mysp-hpage-ad-a:focus-visible{outline:2px solid var(--mysp-hpage-accent);outline-offset:2px}
.mysp-hpage-embed .mysp-hpage-adwrap.is-center{align-items:flex-start}

/* v0.119.13: Breaking News (teks berjalan): tepi kiri-kanan area judul memudar halus. Tanpa ini, judul / thumbnail yang bergeser masuk ke bawah label
   terpotong keras dan meninggalkan garis tegak tipis (serpihan thumbnail) tepat di ujung panah label. */
.mysp-hpage-bn-view:has(.mysp-hpage-bn-track){-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 26px,#000 calc(100% - 22px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 26px,#000 calc(100% - 22px),transparent 100%)}
.mysp-hpage-reduce .mysp-hpage-bn-view{-webkit-mask-image:none!important;mask-image:none!important}
/* ujung panah label menumpang 1px ke badan label agar tidak ada celah antialias di sambungannya */
.mysp-hpage-bn-label::after{right:-10px;width:11px}

/* v0.119.14: tombol jeda / lanjut Breaking News selalu tanpa latar. Tema (mis. GeneratePress) memberi <button> latar gelap saat hover / fokus / klik
   yang menimpa aturan plugin; spesifisitas dinaikkan dan semua keadaan dipaksa transparan. Penanda hover hanya lewat opacity. */
.mysp-hpage .mysp-hpage-bn .mysp-hpage-bn-pp,
.mysp-hpage .mysp-hpage-bn .mysp-hpage-bn-pp:hover,
.mysp-hpage .mysp-hpage-bn .mysp-hpage-bn-pp:focus,
.mysp-hpage .mysp-hpage-bn .mysp-hpage-bn-pp:active,
.mysp-hpage .mysp-hpage-bn .mysp-hpage-bn-pp:focus-visible{background:transparent!important;background-image:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;color:inherit!important;text-shadow:none!important}

/* v0.119.15: penulis di kartu post berupa tautan ke profil / arsip penulis */
a.mysp-hpage-wpcard-au{color:inherit;text-decoration:none;cursor:pointer}
a.mysp-hpage-wpcard-au:hover,a.mysp-hpage-wpcard-au:focus-visible{color:var(--mysp-hpage-accent,#2271b1);text-decoration:underline;text-underline-offset:3px}
.mysp-hpage-wpgrid.is-slider a.mysp-hpage-wpcard-au:hover,.mysp-hpage-wpgrid.is-mag_ov a.mysp-hpage-wpcard-au:hover,.mysp-hpage-wpgrid.is-slider a.mysp-hpage-wpcard-au:focus-visible,.mysp-hpage-wpgrid.is-mag_ov a.mysp-hpage-wpcard-au:focus-visible{color:#fff}
