@import url("_ev.css");
/* ==========================================================
   DInvite — Tema "Ijazah Emas" (koleksi Acara Spesial · Wisuda)
   Bergaya sertifikat ijazah: kertas krem dengan bingkai guilloche, segel pita merah marun berlambang emas, gulungan ijazah, dan huruf klasik yang resmi.
   Ilustrasi dari evkit.js, susunan di evijazah.js.
   ========================================================== */
.t-evijazah { --bg:#fbf6ea; --card:#fffdf5; --ink:#3a1f1f; --muted:#7a5c50; --line:rgba(139,30,45,.2); --accent:#8b1e2d; --accent-2:#c9a227; --on-accent:#fff; --hero-rgb:58,31,31; --tint-a:.35; --hero-ink:#3a1f1f; --deep:#2e1717; --soft:#f2e8d0; --field:#fffefa;--k1:#8b1e2d; --k2:#c9a227; --k3:#3a1f1f; --k4:#e0b84f; --k5:#6b4f2a; --k6:#fffdf5;--fn:'Italianno', cursive; --fh:'Old Standard TT', Georgia, serif; --fb:'EB Garamond', Georgia, serif; --fn-w:400; --fn-k:1.35; --fh-w:700; --fh-ls:.06em; --card-r:2px; --cd-r:2px;--guil: repeating-radial-gradient(circle at 0 0, transparent 0 8px, rgba(201,162,39,.14) 8px 9px), repeating-radial-gradient(circle at 100% 100%, transparent 0 8px, rgba(139,30,45,.08) 8px 9px); color-scheme: light; }
body.t-evijazah .page { background: var(--guil), #fbf6ea; }
.t-evijazah .cover, .t-evijazah .hero, .t-evijazah .aside, .t-evijazah .sec--closing, body.t-evijazah .cover.has-photo, body.t-evijazah .hero.has-photo, body.t-evijazah .aside.has-photo { background: var(--guil), #fbf6ea; color: var(--ink); }
.t-evijazah .sec--tint, .t-evijazah .sec--countdown { background: linear-gradient(var(--soft), var(--soft)); }
.t-evijazah .cover, body.t-evijazah .cover.has-photo { place-items: center; overflow: hidden; }
.t-evijazah .cover__inner { gap: .5rem; max-width: 340px; }
.t-evijazah .hero, .t-evijazah .aside, body.t-evijazah .cover.has-photo, body.t-evijazah .hero.has-photo, body.t-evijazah .aside.has-photo { min-height: 100svh; place-items: center; padding: 4rem 1.6rem; overflow: hidden; }
.t-evijazah .sec--closing { overflow: hidden; padding-block: 6rem 9rem; }
.t-evijazah .cover__to small { color: var(--muted); }
.t-evijazah .cover__to strong { font: 700 1.4rem/1.2 var(--fh); color: var(--ink); }
.t-evijazah .cover .ek-frame { animation: evUp 1s var(--ease) .2s both; }
.t-evijazah .cover .names { animation: evUp 1.1s var(--ease) .45s both; }
.t-evijazah .cover .cover__date, .t-evijazah .cover .cover__to { animation: evUp 1s var(--ease) .65s both; }
.t-evijazah .cover .ibtn { animation: evUp 1s var(--ease) .85s both; }
body.t-evijazah:not(.is-locked) .hero .ek-frame { animation: evUp 1.1s var(--ease) .2s both; }
body.t-evijazah .sec--tint .event p, body.t-evijazah .sec--tint .event small, body.t-evijazah .sec--tint .event span { color: var(--muted); }
@media (max-height: 760px) { .t-evijazah .cover .ek-frame { --fw: min(124px, 34vw); } .t-evijazah .cover .ev-badge { --bw: 74px; } .t-evijazah .cover__to small:last-child { display: none; } .t-evijazah .cover__inner { gap: .3rem; } }

.t-evijazah .cover, body.t-evijazah .cover.has-photo { padding: 3rem 1.6rem; }
.t-evijazah .cover::before, .t-evijazah .hero::before, .t-evijazah .aside::before { content: ''; display: block !important; position: absolute; inset: 14px; border: 10px solid transparent; border-radius: 0; pointer-events: none; z-index: 2;
    border-image: repeating-linear-gradient(45deg, #c9a227 0 3px, #fbf6ea 3px 6px, #8b1e2d 6px 8px, #fbf6ea 8px 11px) 10; }
.t-evijazah .cover::after { content: ''; display: block !important; position: absolute; inset: 30px; border: 1px solid rgba(139,30,45,.35); border-radius: 0; opacity: 1; z-index: 2; }
.t-evijazah .hero::after { content: ''; position: absolute; inset: 30px; border: 1px solid rgba(139,30,45,.35); pointer-events: none; z-index: 2; }
body.t-evijazah .names { color: var(--k1); line-height: .95; }
body.t-evijazah .names i { color: var(--accent-2); font-family: var(--fh); font-style: italic; font-size: .3em; }
body.t-evijazah .kicker { font-family: var(--fh); letter-spacing: .3em; color: var(--k5); }
.t-evijazah .ek-frame { --fw: min(130px, 36vw); aspect-ratio: 3 / 4; --frame-bg: linear-gradient(180deg, #f2e8d0, #e6d6b0); --frame-sh: 0 0 0 4px #fffdf5, 0 0 0 5px var(--k2), 0 14px 24px -16px rgba(58,31,31,.5); }
.t-evijazah .ek-seal { position: relative; width: 74px; height: 74px; margin: .4rem auto 0; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #b4323f, #8b1e2d 60%, #6b1622); box-shadow: 0 0 0 4px #c9a227, 0 8px 14px -6px rgba(0,0,0,.5); display: grid; place-items: center; color: #f3d98f; font: 700 .58rem/1.2 'Old Standard TT', serif; letter-spacing: .14em; text-align: center; animation: ekBadge .9s cubic-bezier(.3,1.5,.5,1) .8s both; --br: -8deg; }
.t-evijazah .ek-seal::before, .t-evijazah .ek-seal::after { content: ''; position: absolute; top: 80%; width: 20px; height: 40px; background: #8b1e2d; z-index: -1; clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 80%, 0 100%); }
.t-evijazah .ek-seal::before { left: 14px; transform: rotate(16deg); } .t-evijazah .ek-seal::after { right: 14px; transform: rotate(-16deg); }
.t-evijazah .cover__to { padding: .7rem .5rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.t-evijazah .cover.is-open { transform: none; opacity: 0; transition: opacity 1s ease; pointer-events: none; }
body.t-evijazah .ibtn--solid { background: var(--k1); }
body.t-evijazah .event { border: 1px solid var(--line); }
body.t-evijazah .event::before { display: block !important; inset: 6px; border: 1px solid rgba(201,162,39,.4); border-radius: 0; }
body.t-evijazah .event h3 { color: var(--k1); font-family: var(--fh); font-size: 1.35rem; }
body.t-evijazah .sec__title { font-family: var(--fh); }
