@import url("_ev.css");
/* ==========================================================
   DInvite — Tema "Toga Klasik" (koleksi Acara Spesial · Wisuda)
   Wisuda yang megah: biru dongker & emas, topi toga yang dilempar ke udara, karangan daun emas, kilau bintang, dan nama dengan huruf klasik.
   Ilustrasi dari evkit.js, susunan di evtoga.js.
   ========================================================== */
.t-evtoga { --bg:#142a4f; --card:rgba(255,255,255,.06); --ink:#f3ead6; --muted:#b8c3da; --line:rgba(230,192,104,.3); --accent:#e6c068; --accent-2:#8fa8d8; --on-accent:#142a4f; --hero-rgb:15,31,61; --tint-a:.55; --hero-ink:#f3ead6; --deep:#0b1630; --soft:#1d3866; --field:rgba(255,255,255,.06); --foot-brand:#f3ead6;--k1:#0f1f3d; --k2:#2b4a7f; --k3:#0b1630; --k4:#e6c068; --k5:#8fa8d8; --k6:#ffffff;--fn:'Great Vibes', cursive; --fh:'Cinzel', serif; --fb:'Montserrat', sans-serif; --fn-w:400; --fn-k:1.1; --fh-w:600; --fh-ls:.08em; --card-r:6px; --cd-r:6px; color-scheme: dark; }
body.t-evtoga .page { background: radial-gradient(70% 50% at 50% 0%, #24427a, transparent 70%), radial-gradient(circle, rgba(230,192,104,.35) 1px, transparent 1.5px) 0 0 / 34px 34px, #142a4f; }
.t-evtoga .cover, .t-evtoga .hero, .t-evtoga .aside, .t-evtoga .sec--closing, body.t-evtoga .cover.has-photo, body.t-evtoga .hero.has-photo, body.t-evtoga .aside.has-photo { background: radial-gradient(70% 50% at 50% 0%, #24427a, transparent 70%), radial-gradient(circle, rgba(230,192,104,.35) 1px, transparent 1.5px) 0 0 / 34px 34px, #142a4f; color: var(--ink); }
.t-evtoga .sec--tint, .t-evtoga .sec--countdown { background: linear-gradient(var(--soft), var(--soft)); }
.t-evtoga .cover, body.t-evtoga .cover.has-photo { place-items: center; overflow: hidden; }
.t-evtoga .cover__inner { gap: .5rem; max-width: 340px; }
.t-evtoga .hero, .t-evtoga .aside, body.t-evtoga .cover.has-photo, body.t-evtoga .hero.has-photo, body.t-evtoga .aside.has-photo { min-height: 100svh; place-items: center; padding: 4rem 1.6rem; overflow: hidden; }
.t-evtoga .sec--closing { overflow: hidden; padding-block: 6rem 9rem; }
.t-evtoga .cover__to small { color: var(--muted); }
.t-evtoga .cover__to strong { font: 700 1.4rem/1.2 var(--fh); color: var(--ink); }
.t-evtoga .cover .ek-frame { animation: evUp 1s var(--ease) .2s both; }
.t-evtoga .cover .names { animation: evUp 1.1s var(--ease) .45s both; }
.t-evtoga .cover .cover__date, .t-evtoga .cover .cover__to { animation: evUp 1s var(--ease) .65s both; }
.t-evtoga .cover .ibtn { animation: evUp 1s var(--ease) .85s both; }
body.t-evtoga:not(.is-locked) .hero .ek-frame { animation: evUp 1.1s var(--ease) .2s both; }
body.t-evtoga .sec--tint .event p, body.t-evtoga .sec--tint .event small, body.t-evtoga .sec--tint .event span { color: var(--muted); }
@media (max-height: 760px) { .t-evtoga .cover .ek-frame { --fw: min(124px, 34vw); } .t-evtoga .cover .ev-badge { --bw: 74px; } .t-evtoga .cover__to small:last-child { display: none; } .t-evtoga .cover__inner { gap: .3rem; } }
body.t-evtoga .ek-frame ~ .kicker, body.t-evtoga .ek-frame + * { margin-top: 1.3rem; }

.t-evtoga .cover, body.t-evtoga .cover.has-photo { padding: 3rem 1.6rem; }
body.t-evtoga .names { color: var(--accent); }
body.t-evtoga .names i { color: #fff; font-family: var(--fh); font-style: normal; font-size: .34em; }
body.t-evtoga .kicker { color: var(--k5); }
.t-evtoga .ek-frame { --fw: min(150px, 40vw); --frame-bg: radial-gradient(circle at 40% 35%, #24427a, #142a4f); --frame-sh: 0 0 0 4px #142a4f, 0 0 0 6px var(--accent), 0 18px 30px -16px rgba(0,0,0,.6); margin-bottom: 2.4rem; }
.t-evtoga .ek-frame .ek-m { top: auto; bottom: -22%; }
.t-evtoga .cover__to { padding: .75rem .6rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.t-evtoga .cover.is-open { transform: translateY(-100%); opacity: 1; transition: transform 1s cubic-bezier(.7,0,.25,1); }
body.t-evtoga .ibtn--solid { background: linear-gradient(135deg, #f3d98f, #e6c068); color: #142a4f; }
body.t-evtoga .countdown b { color: var(--accent); font-family: var(--fh); }
body.t-evtoga .event { border: 1px solid var(--line); }
body.t-evtoga .event h3 { color: var(--accent); font-family: var(--fh); font-size: 1.3rem; }