@import url("_ev.css");
/* ==========================================================
   DInvite — Tema "Kenangan Abadi" (koleksi Acara Spesial · Anniversary & Syukuran)
   Anniversary bernuansa vintage merah rubi: bingkai foto lengkung, hati yang melayang, bunga di sudut, linimasa kenangan bergaya pita film, dan lencana tahun bersama.
   Ilustrasi dari evkit.js, susunan di evkenangan.js.
   ========================================================== */
.t-evkenangan { --bg:#f7eee9; --card:#fffaf7; --ink:#4a1f2a; --muted:#835a63; --line:rgba(155,45,63,.22); --accent:#9b2d3f; --accent-2:#d4a373; --on-accent:#fff; --hero-rgb:74,31,42; --tint-a:.35; --hero-ink:#4a1f2a; --deep:#3a1720; --soft:#f0dcd6; --field:#fffcfa;--k1:#9b2d3f; --k2:#e8b4b8; --k3:#4a1f2a; --k4:#d4a373; --k5:#c97b84; --k6:#fffaf7;--fn:'Parisienne', cursive; --fh:'Playfair Display', Georgia, serif; --fb:'Lora', Georgia, serif; --fn-w:400; --fn-k:1.05; --fh-w:500; --card-r:10px; --cd-r:10px; --badge-bg:var(--k1); --bw:96px; color-scheme: light; }
body.t-evkenangan .page { background: radial-gradient(60% 40% at 50% 0%, rgba(232,180,184,.4), transparent 70%), #f7eee9; }
.t-evkenangan .cover, .t-evkenangan .hero, .t-evkenangan .aside, .t-evkenangan .sec--closing, body.t-evkenangan .cover.has-photo, body.t-evkenangan .hero.has-photo, body.t-evkenangan .aside.has-photo { background: radial-gradient(60% 40% at 50% 0%, rgba(232,180,184,.4), transparent 70%), #f7eee9; color: var(--ink); }
.t-evkenangan .sec--tint, .t-evkenangan .sec--countdown { background: linear-gradient(var(--soft), var(--soft)); }
.t-evkenangan .cover, body.t-evkenangan .cover.has-photo { place-items: center; overflow: hidden; }
.t-evkenangan .cover__inner { gap: .5rem; max-width: 340px; }
.t-evkenangan .hero, .t-evkenangan .aside, body.t-evkenangan .cover.has-photo, body.t-evkenangan .hero.has-photo, body.t-evkenangan .aside.has-photo { min-height: 100svh; place-items: center; padding: 4rem 1.6rem; overflow: hidden; }
.t-evkenangan .sec--closing { overflow: hidden; padding-block: 6rem 9rem; }
.t-evkenangan .cover__to small { color: var(--muted); }
.t-evkenangan .cover__to strong { font: 700 1.4rem/1.2 var(--fh); color: var(--ink); }
.t-evkenangan .cover .ek-frame { animation: evUp 1s var(--ease) .2s both; }
.t-evkenangan .cover .names { animation: evUp 1.1s var(--ease) .45s both; }
.t-evkenangan .cover .cover__date, .t-evkenangan .cover .cover__to { animation: evUp 1s var(--ease) .65s both; }
.t-evkenangan .cover .ibtn { animation: evUp 1s var(--ease) .85s both; }
body.t-evkenangan:not(.is-locked) .hero .ek-frame { animation: evUp 1.1s var(--ease) .2s both; }
body.t-evkenangan .sec--tint .event p, body.t-evkenangan .sec--tint .event small, body.t-evkenangan .sec--tint .event span { color: var(--muted); }
@media (max-height: 760px) { .t-evkenangan .cover .ek-frame { --fw: min(124px, 34vw); } .t-evkenangan .cover .ev-badge { --bw: 74px; } .t-evkenangan .cover__to small:last-child { display: none; } .t-evkenangan .cover__inner { gap: .3rem; } }

.t-evkenangan .cover, body.t-evkenangan .cover.has-photo { padding: 4.4rem 1.6rem 3rem; }
body.t-evkenangan .names { color: var(--k1); }
body.t-evkenangan .names i { color: var(--accent-2); font-family: var(--fh); font-style: italic; font-size: .4em; }
body.t-evkenangan .kicker { color: var(--accent-2); }
.t-evkenangan .ek-frame { --fw: min(160px, 42vw); --frame-bg: radial-gradient(circle at 40% 30%, #fff, #f0dcd6); --frame-sh: 0 0 0 6px #fffaf7, 0 0 0 8px var(--k4), 0 18px 30px -16px rgba(74,31,42,.45); }
.t-evkenangan .ek-frame > i { filter: sepia(.18) saturate(1.05); }
.t-evkenangan .cover__to { padding: .8rem 1rem; border-radius: 10px; background: rgba(255,250,247,.8); border: 1px solid var(--line); }
.t-evkenangan .cover.is-open { transform: translateY(-100%); opacity: 1; transition: transform 1.1s cubic-bezier(.7,0,.25,1); }
body.t-evkenangan .ibtn--solid { background: var(--k1); }
body.t-evkenangan .event h3 { color: var(--k1); }
body.t-evkenangan .lstory__card { border-left: 0; background: repeating-linear-gradient(180deg, #3a1720 0 6px, transparent 6px 14px) 0 0 / 10px 100% no-repeat, repeating-linear-gradient(180deg, #3a1720 0 6px, transparent 6px 14px) 100% 0 / 10px 100% no-repeat, linear-gradient(#2a1118, #2a1118) 0 0 / 14px 100% no-repeat, linear-gradient(#2a1118, #2a1118) 100% 0 / 14px 100% no-repeat, var(--card); padding-inline: 1.8rem; }