/* Halaman Umrah: karusel flyer coverflow + tombol WhatsApp. Memakai token teal & emas dari modern.css. */
.um-hero{position:relative;margin:0 -18px;padding:26px 22px 120px;border-radius:0 0 36px 36px;color:#fff;overflow:hidden;
  background:radial-gradient(110% 90% at 90% -10%,var(--teal-mid),transparent 60%),linear-gradient(165deg,var(--teal) 0%,var(--teal-deep) 100%)}
.um-hero::before,.um-hero::after{content:"";position:absolute;inset:-40px;background:var(--star) 0 0/84px;opacity:.09;pointer-events:none;animation:um-drift 38s linear infinite}
.um-hero::after{background-size:140px;opacity:.06;animation-duration:64s;animation-direction:reverse}
@keyframes um-drift{to{transform:translate3d(84px,84px,0)}}
.um-hero>*{position:relative;z-index:1;max-width:760px}
.um-hero h1{color:#fff;font-size:clamp(1.55rem,5vw,2.2rem);margin:0 0 6px}
.um-hero p{margin:0;color:#BDDDD2;font-size:.9rem;line-height:1.55;max-width:540px}
.um-eyebrow{display:inline-block;margin:0 0 10px;font-size:.68rem;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-soft)}

/* Panggung karusel menimpa bagian bawah hero */
.um-stage{position:relative;margin:-96px -18px 0;z-index:2}
.um-track{display:flex;gap:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  perspective:1100px;padding:10px 0 34px;scrollbar-width:none;outline:0}
.um-track::-webkit-scrollbar{display:none}
.um-track:focus-visible{box-shadow:inset 0 0 0 2px var(--gold)}
.um-spacer{flex:0 0 calc(50% - var(--um-w)/2);}
.um-slide{--um-w:min(72vw,330px);flex:0 0 var(--um-w);scroll-snap-align:center;margin:0 -10px;display:flex;align-items:center;
  transform-style:preserve-3d;will-change:transform,opacity;transition:filter .3s}
.um-track{--um-w:min(72vw,330px)}
.um-slide__kartu{position:relative;width:100%;border-radius:22px;overflow:hidden;background:#fff;
  box-shadow:0 26px 44px -22px rgba(4,51,42,.55),0 0 0 1px rgba(201,160,74,.35)}
.um-slide__kartu img{display:block;width:100%;height:auto;max-height:min(56vh,500px);object-fit:contain;background:#fff;user-select:none;-webkit-user-drag:none}
/* kilau yang menyapu flyer aktif */
.um-slide.aktif .um-slide__kartu::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.38) 50%,transparent 60%);transform:translateX(-120%);animation:um-kilau 4.2s ease-in-out 1s infinite}
@keyframes um-kilau{0%,55%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.um-slide:not(.aktif){filter:saturate(.8) brightness(.92)}

.um-nav{position:absolute;top:calc(50% - 30px);width:42px;height:42px;border-radius:50%;border:1px solid rgba(235,208,138,.6);
  background:rgba(4,51,42,.72);color:var(--gold-soft);display:none;align-items:center;justify-content:center;cursor:pointer;z-index:3;
  backdrop-filter:blur(6px);transition:transform .15s,background .15s}
.um-nav:hover{background:var(--teal-deep);transform:scale(1.08)}
.um-nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.um-nav--prev{left:max(10px,calc(50% - 330px))}.um-nav--next{right:max(10px,calc(50% - 330px))}
@media(hover:hover) and (min-width:700px){.um-nav{display:flex}}

.um-info{text-align:center;padding:0 6px;min-height:76px}
.um-info h2{margin:0 0 4px;font-size:1.15rem;color:var(--teal-deep)}
.um-info p{margin:0 auto;max-width:460px;font-size:.86rem;line-height:1.55;color:var(--muted)}
.um-info.ganti>*{animation:um-muncul .45s ease both}
.um-info.ganti p{animation-delay:.06s}
@keyframes um-muncul{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.um-titik{display:flex;justify-content:center;gap:8px;margin:14px 0 4px}
.um-titik button{width:8px;height:8px;padding:0;border-radius:99px;border:0;background:var(--line);cursor:pointer;transition:width .3s,background .3s}
.um-titik button.on{width:26px;background:linear-gradient(90deg,var(--gold),var(--gold-soft))}
.um-hitung{margin:2px 0 0;text-align:center;font-size:.7rem;color:var(--muted);font-variant-numeric:tabular-nums}

/* Tombol pesan: tepat di bawah karusel */
.um-cta{position:relative;z-index:5;margin:20px 0 4px;padding:0}
.um-pesan{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;box-sizing:border-box;
  padding:16px 22px;border:0;border-radius:var(--r-pill);text-decoration:none;cursor:pointer;
  background:linear-gradient(135deg,#2FD066,#128C4A);color:#fff;font:800 1rem var(--font-body);letter-spacing:.01em;
  box-shadow:0 14px 28px -12px rgba(18,140,74,.75);animation:um-denyut 2.6s ease-in-out infinite;transition:transform .15s}
.um-pesan:hover{transform:translateY(-2px)}
.um-pesan:active{transform:scale(.98)}
.um-pesan::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);
  transform:translateX(-130%);animation:um-sapu 3.4s ease-in-out 1.2s infinite}
.um-pesan svg{width:22px;height:22px;fill:currentColor;flex:none}
@keyframes um-denyut{0%,100%{box-shadow:0 14px 28px -12px rgba(18,140,74,.75),0 0 0 0 rgba(47,208,102,.45)}50%{box-shadow:0 14px 28px -12px rgba(18,140,74,.75),0 0 0 12px rgba(47,208,102,0)}}
@keyframes um-sapu{0%,60%{transform:translateX(-130%)}100%{transform:translateX(130%)}}
.um-pesan[aria-disabled=true]{background:var(--line);color:var(--muted);box-shadow:none;animation:none;pointer-events:none}
.um-pesan[aria-disabled=true]::after{display:none}
.um-catatan{margin:10px 0 0;text-align:center;font-size:.72rem;color:var(--muted);line-height:1.5}

.um-kosong{margin:-60px 0 0;position:relative;z-index:2;text-align:center;padding:34px 22px}
.um-kosong h2{margin:0 0 6px;font-size:1.1rem;color:var(--teal-deep)}

.um-admin-link{margin-top:26px;text-align:left}
.um-admin-link a{font-size:.7rem;color:var(--muted);text-decoration:none;opacity:.5}
.um-admin-link a:hover{opacity:1;color:var(--teal)}

@media(prefers-reduced-motion:reduce){
  .um-hero::before,.um-hero::after,.um-pesan,.um-pesan::after,.um-slide.aktif .um-slide__kartu::after,.um-info.ganti>*{animation:none!important}
  .um-track{scroll-behavior:auto}
}

/* Admin flyer */
.um-adm-baris{display:grid;gap:14px;padding:16px 20px;border-top:1px solid var(--line);grid-template-columns:96px 1fr}
.um-adm-baris:first-of-type{border-top:0}
.um-adm-thumb{width:96px;border-radius:12px;border:1px solid var(--line);background:#fff;display:block}
.um-adm-baris.mati .um-adm-thumb{opacity:.4}
.um-adm-aksi{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.um-adm-aksi form{margin:0}
.um-adm-urut{display:flex;gap:6px;align-items:center;margin-bottom:8px;font-size:.72rem;color:var(--muted)}
@media(max-width:520px){.um-adm-baris{grid-template-columns:72px 1fr}.um-adm-thumb{width:72px}}
