/* =========================================================
   "WOW" — Dalam Angka, ticker program, Ekosistem Digital SSTP, animasi skrol.
   Semua ikut token tema sedia ada (--gold, --panel, --muted, --line).
========================================================= */

/* ---------- Dalam Angka ---------- */
.stats-band{position:relative;max-width:1440px;margin:28px auto 0;padding:0 5%;z-index:3}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:linear-gradient(90deg,rgba(230,189,105,.05),rgba(230,189,105,.35),rgba(230,189,105,.05));border:1px solid rgba(230,189,105,.28);border-radius:18px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.4)}
.stat{position:relative;display:block;padding:26px 24px 22px;background:linear-gradient(170deg,#16140f,#0e0e11 70%);color:inherit;text-decoration:none;transition:background .3s}
.stat:hover{background:linear-gradient(170deg,#211c12,#111013 70%)}
.stat::after{content:"";position:absolute;left:24px;right:24px;bottom:0;height:2px;background:linear-gradient(90deg,var(--gold),transparent);transform:scaleX(0);transform-origin:left;transition:transform .45s ease}
.stat:hover::after{transform:scaleX(1)}
.stat-num{display:block;font-size:44px;font-weight:800;letter-spacing:-1.5px;line-height:1;background:linear-gradient(180deg,#fff4d6,#e6bd69 55%,#b98a35);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.stat-label{display:block;margin-top:10px;font-size:12px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:#efe6d2}
.stat-note{display:block;margin-top:4px;font-size:12px;color:var(--muted)}
.stat-go{position:absolute;top:20px;right:20px;font-size:12px;color:var(--gold);opacity:0;transition:opacity .3s,transform .3s;transform:translate(-4px,4px)}
.stat:hover .stat-go{opacity:1;transform:none}

/* ---------- Ticker program ---------- */
.ticker{max-width:1440px;margin:22px auto 0;padding:0 5%}
.ticker-inner{display:flex;align-items:center;gap:16px;border:1px solid var(--line);border-radius:999px;background:rgba(17,18,22,.75);overflow:hidden;padding:0 0 0 6px}
.ticker-tag{flex:0 0 auto;display:flex;align-items:center;gap:8px;margin:6px 0;padding:8px 14px;border-radius:999px;background:linear-gradient(90deg,#f3cf7a,#e6bd69);color:#1a1408;font-size:11px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase}
.ticker-tag i{width:7px;height:7px;border-radius:50%;background:#1a1408;animation:tickPulse 1.6s infinite}
.ticker-track{position:relative;flex:1;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ticker-run{display:flex;gap:44px;width:max-content;padding:14px 0;animation:tickRun 60s linear infinite}
.ticker:hover .ticker-run{animation-play-state:paused}
.ticker-run a{display:flex;align-items:center;gap:10px;color:#e9e3d6;font-size:13px;white-space:nowrap;text-decoration:none}
.ticker-run a:hover{color:var(--gold)}
.ticker-run b{font-size:11px;font-weight:700;letter-spacing:.8px;color:var(--gold)}
@keyframes tickRun{to{transform:translateX(-50%)}}
@keyframes tickPulse{50%{opacity:.25}}

/* ---------- Ekosistem Digital SSTP ---------- */
.eko-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:16px;margin-top:44px}
.eko{position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:22px;border-radius:18px;overflow:hidden;isolation:isolate;color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.08);background:#121216;transition:transform .35s ease,border-color .35s,box-shadow .35s}
.eko:hover{transform:translateY(-4px);border-color:rgba(230,189,105,.55);box-shadow:0 24px 60px rgba(0,0,0,.5),0 0 40px rgba(230,189,105,.12)}
.eko img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .8s ease;filter:saturate(1.05)}
.eko:hover img{transform:scale(1.06)}
.eko::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,10,12,.05) 25%,rgba(10,10,12,.82) 72%,rgba(10,10,12,.96))}
.eko.big{grid-column:span 2;grid-row:span 2}
.eko.wide{grid-column:span 2}
.eko-kicker{font-size:10px;font-weight:800;letter-spacing:1.8px;text-transform:uppercase;color:var(--gold)}
.eko h3{margin:6px 0 4px;font-size:21px;letter-spacing:-.4px;line-height:1.2}
.eko.big h3{font-size:32px}
.eko p{margin:0;font-size:13px;line-height:1.55;color:#cfc8b8;max-width:46ch}
.eko-go{position:absolute;top:18px;right:18px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(10,10,12,.55);border:1px solid rgba(230,189,105,.45);color:var(--gold);font-size:15px;backdrop-filter:blur(6px);transition:background .3s,color .3s}
.eko:hover .eko-go{background:var(--gold);color:#1a1408}
.eko-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.eko-chips span{font-size:11px;padding:4px 10px;border-radius:999px;border:1px solid rgba(230,189,105,.35);color:#f3e3bd;background:rgba(10,10,12,.45)}
.eko.plain{background:radial-gradient(120% 120% at 100% 0%,rgba(230,189,105,.18),#121216 60%)}
.eko.plain::before{display:none}
.eko-icon{position:absolute;top:20px;left:22px;width:42px;height:42px;color:var(--gold)}

/* ---------- Animasi muncul bila skrol ---------- */
.wow-ready .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.wow-ready .reveal.in{opacity:1;transform:none}
.wow-ready .reveal-stagger>*{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.wow-ready .reveal-stagger.in>*{opacity:1;transform:none}
.reveal-stagger.in>*:nth-child(2){transition-delay:.08s}.reveal-stagger.in>*:nth-child(3){transition-delay:.16s}
.reveal-stagger.in>*:nth-child(4){transition-delay:.24s}.reveal-stagger.in>*:nth-child(5){transition-delay:.32s}
.reveal-stagger.in>*:nth-child(6){transition-delay:.40s}.reveal-stagger.in>*:nth-child(7){transition-delay:.48s}

/* Kilauan emas pada tajuk hero */
.hero h1 span{background:linear-gradient(100deg,#b98a35 0%,#f3cf7a 30%,#fff4d6 45%,#f3cf7a 60%,#b98a35 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:goldShine 7s ease-in-out infinite}
@keyframes goldShine{0%,100%{background-position:100% 0}50%{background-position:0 0}}

/* Responsif */
@media (max-width:1100px){.stats-grid{grid-template-columns:repeat(2,1fr)}.eko-grid{grid-template-columns:repeat(2,1fr)}.eko.big{grid-column:span 2;grid-row:span 2}}
@media (max-width:700px){
  .stats-band{margin-top:20px}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .stat{padding:20px 16px}.stat-num{font-size:34px}
  .ticker-tag span{display:none}
  .eko-grid{grid-template-columns:1fr 1fr;grid-auto-rows:170px;gap:10px}
  .eko{padding:14px}
  .eko.big{grid-column:span 2;grid-row:span 2}.eko.big h3{font-size:26px}
  .eko.wide,.eko:not(.big){grid-column:span 1;grid-row:span 1}
  .eko:not(.big) p{display:none}
  .eko:not(.big) h3{font-size:15px}
  .eko-grid .eko:last-child{grid-column:span 2}
  .eko-go{width:30px;height:30px;top:10px;right:10px;font-size:12px}
}
@media (prefers-reduced-motion:reduce){
  .reveal,.reveal-stagger>*{opacity:1!important;transform:none!important;transition:none!important}
  .ticker-run{animation:none}.hero h1 span{animation:none}
}

/* ---------- Sorotan Pencapaian ---------- */
.sor-track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(270px,1fr);gap:16px;margin-top:40px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;scrollbar-width:thin;scrollbar-color:#6d5732 transparent}
.sor-card{scroll-snap-align:start;position:relative;display:flex;flex-direction:column;gap:12px;padding:22px;border-radius:16px;border:1px solid rgba(230,189,105,.22);background:radial-gradient(130% 100% at 100% 0%,rgba(230,189,105,.14),rgba(17,18,22,.95) 55%);min-height:250px;overflow:hidden}
.sor-card::after{content:"";position:absolute;inset:-40% -60% auto auto;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(243,207,122,.18),transparent 70%)}
.sor-medal{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:24px;background:radial-gradient(circle at 35% 30%,#fff4d6,#e6bd69 45%,#8a6524);box-shadow:0 0 22px rgba(230,189,105,.35),inset 0 -3px 6px rgba(0,0,0,.25)}
.sor-medal.perak{background:radial-gradient(circle at 35% 30%,#ffffff,#c9ced6 45%,#6f7680);box-shadow:0 0 22px rgba(201,206,214,.25),inset 0 -3px 6px rgba(0,0,0,.25)}
.sor-tags{display:flex;gap:6px;flex-wrap:wrap}
.sor-tags span{font-size:10px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;padding:4px 9px;border-radius:999px;border:1px solid rgba(230,189,105,.35);color:var(--gold)}
.sor-tags span.t{color:#e9e3d6;border-color:#3d3930}
.sor-card h3{margin:0;font-size:16px;line-height:1.35;letter-spacing:-.2px}
.sor-who{margin-top:auto;font-size:13px;color:#d9d0bd}
.sor-who b{color:var(--gold)}
.sor-foot{margin-top:22px}

/* ---------- Jam & tarikh langsung ---------- */
.live-clock{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:7px 14px;border:1px solid rgba(230,189,105,.3);border-radius:999px;background:rgba(10,10,12,.55);backdrop-filter:blur(6px);font-size:12px;color:#e9e3d6;letter-spacing:.3px}
.lc-dot{width:7px;height:7px;border-radius:50%;background:#3ef06b;box-shadow:0 0 0 0 rgba(62,240,107,.6);animation:lcPulse 2s infinite}
.lc-sep{color:var(--gold)}
#lcTime{color:var(--gold);font-weight:700;font-variant-numeric:tabular-nums}
@keyframes lcPulse{0%{box-shadow:0 0 0 0 rgba(62,240,107,.55)}70%{box-shadow:0 0 0 8px rgba(62,240,107,0)}100%{box-shadow:0 0 0 0 rgba(62,240,107,0)}}

/* ---------- Gerakan ringan hero bila video tidak dimuat (telefon / jimat data) ---------- */
.hero-video.kb{animation:kenBurns 16s ease-in-out infinite alternate;transform-origin:65% 40%}
@keyframes kenBurns{from{transform:scale(1.04) translate3d(0,0,0)}to{transform:scale(1.16) translate3d(-3%,-2%,0)}}
@media (max-width:700px){.live-clock{font-size:11px;padding:6px 12px;margin-top:12px}}
@media (prefers-reduced-motion:reduce){.hero-video.kb,.lc-dot{animation:none}}

/* ===== Pengumuman Terkini ===== */
.ann-section .section-head .eyebrow .signal{animation:annPulse 1.8s ease-in-out infinite}
@keyframes annPulse{0%,100%{box-shadow:0 0 0 0 #e6bd6988}50%{box-shadow:0 0 0 7px #e6bd6900}}
.ann-grid{display:grid;gap:22px}
.ann-grid.multi{grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.ann-grid.multi .ann-card.feat{grid-column:1/-1}
.ann-card{position:relative;display:grid;grid-template-columns:120px 1fr;gap:20px;padding:18px;border:1px solid #3a3122;border-radius:20px;background:linear-gradient(160deg,rgba(230,189,105,.07),rgba(17,18,22,.95) 55%);overflow:hidden}
.ann-card.feat{grid-template-columns:minmax(230px,360px) 1fr;gap:44px;padding:30px;border-color:#5a4a2c;background:radial-gradient(700px 360px at 85% 0%,rgba(230,189,105,.14),transparent 60%),radial-gradient(500px 300px at 0% 100%,rgba(140,90,220,.12),transparent 60%),#111216;box-shadow:0 30px 60px -30px #000c}
.ann-poster{position:relative;display:block;padding:0;border:0;background:#0d0d10;border-radius:14px;overflow:hidden;cursor:zoom-in;align-self:start;box-shadow:0 18px 40px -16px #000d,0 0 0 1px #ffffff14}
.ann-poster img{display:block;width:100%;height:auto;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.ann-poster:hover img{transform:scale(1.04)}
.ann-zoom{position:absolute;left:10px;bottom:10px;padding:7px 11px;border-radius:999px;background:rgba(9,10,12,.82);border:1px solid #6d5732;color:#f3cf7a;font-size:11px;font-weight:700;letter-spacing:.3px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.ann-card:not(.feat) .ann-zoom{display:none}
.ann-body{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.ann-tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.ann-tags span{font-size:10px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;padding:6px 10px;border-radius:999px;border:1px solid #52432c;color:#e6bd69}
.ann-tags .ann-new{background:linear-gradient(90deg,#f3cf7a,#e6bd69);color:#1a1408;border-color:transparent;box-shadow:0 0 16px #e6bd6966}
.ann-body h3{margin:0;font-size:clamp(20px,2.4vw,34px);line-height:1.12;letter-spacing:-1px}
.ann-card:not(.feat) .ann-body h3{font-size:17px;letter-spacing:-.3px}
.ann-lead{margin:10px 0 0;font-size:clamp(18px,2vw,26px);font-weight:800;color:#f3cf7a}
.ann-sum{margin:12px 0 0;color:#a6a7ae;font-size:14px;line-height:1.75;max-width:560px}
.ann-steps{list-style:none;counter-reset:s;margin:22px 0 0;padding:0;display:grid;gap:10px;width:100%;max-width:560px}
.ann-steps li{counter-increment:s;display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid #ffffff12;font-size:14px;color:#e9e6de}
.ann-steps li::before{content:counter(s);flex:0 0 30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:14px;color:#1a1408;background:linear-gradient(135deg,#f3cf7a,#b98a35)}
.ann-target{margin:16px 0 0;font-size:13px;line-height:1.7;color:#c2c0ba;max-width:560px;padding-left:12px;border-left:2px solid #e6bd69}
.ann-target b{color:#e6bd69}
.ann-acts{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:24px}
.ann-acts .button{margin-top:0}
.ann-acts button.button{color:#f5f3ee;cursor:pointer}
.ann-card:not(.feat) .ann-acts{margin-top:14px}
.ann-share{border:1px solid #52432c;background:none;color:#e6bd69;border-radius:4px;padding:15px 16px;font-size:12px;font-weight:700;cursor:pointer}
.ann-share:hover{background:#3e301a}
.ann-dialog{padding:0;border:1px solid #5a4a2c;border-radius:16px;background:#0d0d10;color:#f5f3ee;max-width:min(94vw,760px);max-height:94vh;overflow:hidden}
.ann-dialog::backdrop{background:rgba(0,0,0,.82);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.ann-dialog-bar{display:flex;align-items:center;gap:12px;padding:10px 12px 10px 16px;border-bottom:1px solid #2b2923}
.ann-dialog-bar b{flex:1;font-size:13px;color:#e6bd69;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ann-dl{font-size:12px;font-weight:700;color:#f5f3ee;border:1px solid #52432c;border-radius:999px;padding:7px 12px}
.ann-dl:hover{background:#3e301a}
.ann-close{border:0;background:none;color:#f5f3ee;font-size:26px;line-height:1;cursor:pointer;padding:2px 8px}
.ann-dialog img{display:block;max-width:100%;max-height:calc(94vh - 56px);width:auto;height:auto;margin:auto;object-fit:contain}
@media (max-width:900px){.ann-card.feat{grid-template-columns:minmax(180px,260px) 1fr;gap:26px;padding:22px}}
@media (max-width:700px){
  .ann-card.feat{grid-template-columns:1fr;gap:20px;padding:16px;border-radius:18px}
  .ann-card.feat .ann-poster{max-height:380px}
  .ann-card.feat .ann-poster img{height:380px;object-fit:cover;object-position:top}
  .ann-steps li{font-size:13px;padding:10px 12px}
  .ann-acts{width:100%}
  .ann-acts .button.primary{flex:1 1 100%}
  .ann-acts .button.secondary,.ann-share{flex:1 1 0;justify-content:center;text-align:center}
  .ann-card:not(.feat){grid-template-columns:90px 1fr;gap:14px;padding:14px}
}
@media (prefers-reduced-motion:reduce){.ann-section .section-head .eyebrow .signal{animation:none}.ann-poster img{transition:none}}
/* Video dalam pengumuman */
.ann-hasvid{position:absolute;right:8px;top:8px;padding:5px 9px;border-radius:999px;background:rgba(9,10,12,.85);border:1px solid #6d5732;color:#f3cf7a;font-size:10px;font-weight:800;letter-spacing:.6px}
.ann-vbtn{color:#1a1408!important;background:linear-gradient(90deg,#f3cf7a,#e6bd69);border:0;cursor:pointer;justify-content:center;gap:10px}
.ann-vbtn:hover{filter:brightness(1.06)}
.ann-play{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#1a1408;color:#f3cf7a;font-size:10px}
.ann-dialog.is-video{max-width:min(94vw,520px)}
.ann-video{display:block;width:100%;max-height:calc(94vh - 56px);background:#000}
@media (max-width:700px){.ann-acts .ann-vbtn{flex:1 1 100%}}

/* ===== Ekosistem: teks sentiasa atas latar bersih (v2) ===== */
.eko{background:radial-gradient(120% 100% at 0% 100%,rgba(230,189,105,.10),transparent 55%),#111216}
.eko::before{background:linear-gradient(180deg,transparent 40%,rgba(10,10,12,.55))}
.eko>img{-webkit-mask-image:linear-gradient(180deg,#000 22%,rgba(0,0,0,.45) 55%,transparent 82%);mask-image:linear-gradient(180deg,#000 22%,rgba(0,0,0,.45) 55%,transparent 82%);opacity:.9}
.eko.big>img{object-position:center top;-webkit-mask-image:linear-gradient(180deg,#000 40%,rgba(0,0,0,.4) 62%,transparent 80%);mask-image:linear-gradient(180deg,#000 40%,rgba(0,0,0,.4) 62%,transparent 80%);opacity:1}
.eko.wide{justify-content:center;padding-right:52%}
.eko.wide>img{left:auto;right:0;width:58%;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.55) 30%,#000 62%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.55) 30%,#000 62%)}
.eko.wide::before{background:none}
.eko-kicker{display:inline-flex;align-items:center;gap:8px}
.eko-kicker::before{content:"";width:18px;height:1px;background:var(--gold)}
.eko-gal .eko-stack{position:absolute;left:50%;top:16px;width:150px;height:62%;transform:translateX(-50%);z-index:-1}
.eko-gal .eko-stack img{position:absolute;top:0;left:50%;width:96px;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:top;border-radius:8px;border:1px solid rgba(255,255,255,.18);box-shadow:0 12px 26px #000a;transition:transform .5s ease}
.eko-gal .eko-stack img:nth-child(1){transform:translateX(-95%) rotate(-12deg) translateY(10px)}
.eko-gal .eko-stack img:nth-child(2){transform:translateX(-50%);z-index:2}
.eko-gal .eko-stack img:nth-child(3){transform:translateX(-5%) rotate(12deg) translateY(10px)}
.eko-gal:hover .eko-stack img:nth-child(1){transform:translateX(-110%) rotate(-16deg) translateY(6px)}
.eko-gal:hover .eko-stack img:nth-child(3){transform:translateX(10%) rotate(16deg) translateY(6px)}
.eko-gal:hover .eko-stack img:nth-child(2){transform:translateX(-50%) translateY(-6px)}
@media (max-width:1100px){.eko.wide{padding-right:46%}}
@media (max-width:700px){
  .eko.wide{justify-content:flex-end;padding-right:14px}
  .eko.wide>img{left:0;width:100%;-webkit-mask-image:linear-gradient(180deg,#000 20%,rgba(0,0,0,.4) 55%,transparent 85%);mask-image:linear-gradient(180deg,#000 20%,rgba(0,0,0,.4) 55%,transparent 85%)}
  .eko.big>img{height:58%;object-fit:cover;object-position:center 35%;-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 100%);mask-image:linear-gradient(180deg,#000 55%,transparent 100%)}
  .eko:not(.big)>img{height:72%}
  .eko-gal .eko-stack{top:10px;width:110px;height:58%}
  .eko-gal .eko-stack img{width:62px}
}
@media (prefers-reduced-motion:reduce){.eko-gal .eko-stack img{transition:none}}

/* ===== Sorotan Pencapaian v2: 4 kad penuh, anak panah, pudar tepi ===== */
#sorotan.section{padding-top:48px}
.sor-wrap{position:relative;margin-top:40px}
.sor-wrap::before,.sor-wrap::after{content:"";position:absolute;top:0;bottom:12px;width:28px;pointer-events:none;z-index:2;opacity:0;transition:opacity .3s}
.sor-wrap::before{left:0;background:linear-gradient(90deg,var(--bg),transparent)}
.sor-wrap::after{right:0;background:linear-gradient(270deg,var(--bg),transparent)}
.sor-wrap.more-l::before,.sor-wrap.more-r::after{opacity:1}
.sor-track{margin-top:0;grid-auto-columns:calc((100% - 48px)/4);scrollbar-width:none;padding-bottom:12px}
.sor-track::-webkit-scrollbar{display:none}
.sor-card{min-height:0;gap:10px;padding:22px 22px 18px;transition:transform .3s,border-color .3s}
.sor-card:hover{transform:translateY(-3px);border-color:rgba(230,189,105,.5)}
.sor-card h3{font-size:17px;flex:1}
.sor-who{margin-top:6px;padding-top:12px;border-top:1px solid rgba(230,189,105,.16);line-height:1.5}
.sor-medal{width:46px;height:46px;font-size:21px}
.sor-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.sor-foot .button{margin-top:0}
.sor-ctl{display:flex;align-items:center;gap:10px}
.sor-ctl[hidden]{display:none}
.sor-count{font-size:12px;letter-spacing:1px;color:var(--muted);min-width:64px;text-align:right;font-variant-numeric:tabular-nums}
.sor-nav{width:46px;height:46px;border-radius:50%;border:1px solid #6d5732;background:rgba(17,18,22,.9);color:var(--gold);font-size:18px;cursor:pointer;transition:background .2s,color .2s,opacity .2s}
.sor-nav:hover:not(:disabled){background:var(--gold);color:#111}
.sor-nav:disabled{opacity:.3;cursor:default}
@media (max-width:1100px){.sor-track{grid-auto-columns:calc((100% - 32px)/3)}}
@media (max-width:860px){.sor-track{grid-auto-columns:calc((100% - 16px)/2)}}
@media (max-width:700px){#sorotan.section{padding-top:32px}.sor-wrap{margin-top:26px}.sor-track{grid-auto-columns:82%;gap:12px}.sor-wrap::before,.sor-wrap::after{width:36px}.sor-foot{flex-direction:column-reverse;align-items:stretch}.sor-ctl{justify-content:flex-end}}

/* ===== 03 Sorotan TERAFECTA (gaya dashboard) ===== */
.tf-section .section-head p{max-width:420px}
.tf-status{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:7px 13px;border-radius:999px;border:1px solid #6d5732;background:rgba(230,189,105,.08);font-size:12px;font-weight:700;color:#f3cf7a}
.tf-status i{width:8px;height:8px;border-radius:50%;background:#4ade80;box-shadow:0 0 10px #4ade80}
.tf-top{display:grid;grid-template-columns:1.55fr 1fr;gap:18px}
.tf-feat{position:relative;min-height:420px;border-radius:22px;overflow:hidden;border:1px solid #5a4a2c;background:radial-gradient(800px 400px at 90% 0%,rgba(230,189,105,.16),transparent 60%),#0e0f12;display:flex;align-items:flex-end;isolation:isolate}
.tf-feat>img{position:absolute;right:0;top:0;height:100%;width:58%;object-fit:cover;object-position:center 22%;z-index:-1;-webkit-mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.6) 35%,#000 70%);mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.6) 35%,#000 70%);opacity:.85}
.tf-feat-in{padding:34px;max-width:62%}
.tf-badges{display:flex;gap:8px;flex-wrap:wrap}
.tf-b1{font-size:11px;font-weight:900;letter-spacing:1px;padding:6px 11px;border-radius:7px;background:linear-gradient(90deg,#f3cf7a,#e6bd69);color:#1a1408}
.tf-b2{font-size:11px;font-weight:800;letter-spacing:1px;padding:6px 11px;border-radius:7px;border:1px solid #6d5732;color:#f3cf7a}
.tf-feat h3{margin:16px 0 10px;font-size:clamp(24px,2.6vw,34px);line-height:1.12;letter-spacing:-1px}
.tf-feat p{margin:0;font-size:14px;line-height:1.7;color:#c9c4b8}
.tf-meta{margin-top:12px;font-size:12px;color:#8d8b85}
.tf-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.tf-acts .button{margin-top:0}
.tf-news{display:flex;flex-direction:column;gap:12px}
.tf-item{display:flex;align-items:center;gap:16px;padding:16px;border-radius:16px;border:1px solid #2d2a22;background:#111216;transition:border-color .25s,transform .25s,background .25s}
.tf-item:hover{border-color:#6d5732;transform:translateX(3px);background:#14151a}
.tf-ic{flex:0 0 64px;height:64px;border-radius:14px;display:grid;place-items:center;background:radial-gradient(circle at 30% 25%,rgba(243,207,122,.28),rgba(230,189,105,.08));border:1px solid #4a3d25}
.tf-ic svg{width:28px;height:28px;fill:none;stroke:#f3cf7a;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tf-tx{flex:1;min-width:0}
.tf-tx small{display:block;font-size:11px;color:#8d8b85;margin-bottom:4px}
.tf-tx b{display:block;font-size:14.5px;line-height:1.4;color:#f5f3ee}
.tf-item em{font-style:normal;color:var(--gold);font-size:14px}
.tf-all{display:flex;justify-content:center;align-items:center;gap:8px;padding:14px;border-radius:14px;border:1px solid #2d2a22;font-size:13px;font-weight:700;color:#f5f3ee;margin-top:auto}
.tf-all:hover{border-color:#6d5732;color:var(--gold)}
.tf-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:18px}
.tf-stat{display:flex;gap:16px;align-items:flex-start;padding:22px;border-radius:16px;border:1px solid #2d2a22;background:linear-gradient(160deg,rgba(230,189,105,.07),#111216 55%)}
.tf-si{flex:0 0 46px;height:46px;border-radius:12px;display:grid;place-items:center;font-size:20px;color:#f3cf7a;background:rgba(230,189,105,.1);border:1px solid #4a3d25}
.tf-stat small{display:block;font-size:11px;font-weight:800;letter-spacing:1.2px;color:#a6a7ae}
.tf-stat strong{display:block;font-size:34px;letter-spacing:-1px;line-height:1.15;color:#f5f3ee;margin:4px 0 2px}
.tf-stat em{font-style:normal;font-size:12.5px;color:var(--gold)}
.tf-daerah{margin-top:18px;padding:22px;border-radius:18px;border:1px solid #2d2a22;background:#0e0f12}
.tf-dh{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}
.tf-dh h3{margin:0;font-size:17px;position:relative;padding-bottom:8px}
.tf-dh h3::after{content:"";position:absolute;left:0;bottom:0;width:42px;height:2px;background:var(--gold)}
.tf-dh a{font-size:12px;font-weight:700;color:#f5f3ee;border:1px solid #3d3930;border-radius:999px;padding:8px 14px}
.tf-dh a:hover{border-color:var(--gold);color:var(--gold)}
.tf-dgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.tf-d{padding:16px;border-radius:14px;border:1px solid #24221d;background:#111216;display:flex;flex-direction:column;gap:6px}
.tf-d b{font-size:15px;color:#f3cf7a}
.tf-d span{font-size:13px;line-height:1.5;color:#d8d4cb}
.tf-d i{font-style:normal;font-size:11px;font-weight:800;letter-spacing:.4px;color:#4ade80}
@media (max-width:1100px){.tf-top{grid-template-columns:1fr}.tf-stats,.tf-dgrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:700px){
 .tf-feat{min-height:0}.tf-feat>img{width:100%;height:58%;-webkit-mask-image:linear-gradient(180deg,#000 30%,transparent);mask-image:linear-gradient(180deg,#000 30%,transparent)}
 .tf-feat-in{max-width:none;padding:180px 18px 20px}
 .tf-acts .button{flex:1 1 100%;justify-content:space-between}
 .tf-ic{flex-basis:50px;height:50px}.tf-item{padding:12px;gap:12px}
 .tf-stats{gap:10px}.tf-stat{flex-direction:column;gap:10px;padding:16px}.tf-stat strong{font-size:26px}
 .tf-dgrid{grid-template-columns:1fr}.tf-daerah{padding:16px}
}
.tf-si svg{width:22px;height:22px;fill:none;stroke:#f3cf7a;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tf-best{display:flex;align-items:center;gap:18px;margin-bottom:12px;padding:18px 20px;border-radius:16px;border:1px solid #8a6a32;background:radial-gradient(600px 200px at 0% 50%,rgba(243,207,122,.22),transparent 70%),linear-gradient(90deg,rgba(230,189,105,.12),#111216 70%);box-shadow:0 0 30px rgba(230,189,105,.12)}
.tf-crown{flex:0 0 58px;height:58px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#fff4d6,#e6bd69 45%,#8a6524);box-shadow:0 0 24px rgba(230,189,105,.45)}
.tf-crown svg{width:28px;height:28px;fill:none;stroke:#1a1408;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.tf-best small{display:block;font-size:11px;font-weight:900;letter-spacing:1.6px;color:#f3cf7a}
.tf-best b{display:block;font-size:26px;letter-spacing:-.6px;margin:2px 0 4px;color:#fff}
.tf-best span{font-size:13px;line-height:1.55;color:#d8d4cb}
@media (max-width:700px){.tf-best{align-items:flex-start;padding:16px;gap:14px}.tf-crown{flex-basis:46px;height:46px}.tf-best b{font-size:22px}}
