/* Tema: Onyx Gold — premium hitam & emas */
:root{
  --bg:#0a0a0a; --bg-alt:#121110; --ink:#efe6cf; --muted:#b6a988; --accent:#d4af5a; --on-accent:#0a0a0a;
  --line:rgba(212,175,90,.3); --card:linear-gradient(160deg,rgba(255,236,180,.06),rgba(255,236,180,.015));
  --f-display:'Cormorant',serif; --f-script:'Imperial Script',cursive; --f-body:'Raleway',sans-serif;
  --gold:linear-gradient(110deg,#9c7526 0%,#f6e3a1 22%,#c9a24a 42%,#fff1bf 55%,#b8902f 75%,#f6e3a1 100%);
  --frame-radius:50% 50% 4px 4px / 34% 34% 4px 4px;
  --overlay:linear-gradient(180deg,rgba(10,10,10,.45),rgba(10,10,10,.95)); --cover-ink:#efe6cf;
}
body{font-weight:300;font-size:15.5px;letter-spacing:.01em}
.sec--alt{background:var(--bg-alt) url(onyx/pattern.svg) 0 0/60px}
.cover{background:#000}
/* Teks emas berkilau */
.names,.names .amp,.sec__title,.person__nick,.event__name,.event__num,.couple__amp,.monogram span,.gift-card__bank{
  background:var(--gold);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:shine 7s ease-in-out infinite}
@keyframes shine{0%,100%{background-position:0% 0}50%{background-position:100% 0}}
.names{font-size:clamp(56px,17vw,78px);line-height:1}
.eyebrow{color:#d4af5a;font-family:'Cormorant',serif;font-weight:600;letter-spacing:.42em}
.cover__inner{border:1px solid rgba(212,175,90,.45);outline:1px solid rgba(212,175,90,.25);outline-offset:8px;padding:44px 26px 36px;background:rgba(0,0,0,.35);backdrop-filter:blur(2px)}
/* Monogram */
.monogram{display:block;width:96px;height:96px;margin:0 auto 18px;border:1px solid rgba(212,175,90,.7);transform:rotate(45deg);position:relative;
  font:600 30px/94px 'Cormorant',serif;text-align:center}
.monogram span{display:inline-block;transform:rotate(-45deg)}
.monogram::after{content:"";position:absolute;inset:6px;border:1px solid rgba(212,175,90,.35)}
.cover .orn-tl,.cover .orn-br{width:140px}
.sec__title{font-weight:600;font-size:32px;letter-spacing:.06em}
.sec__title::after{content:"";display:block;width:150px;height:22px;margin:10px auto 0;background:url(onyx/divider.svg) center/contain no-repeat}
.frame{border:2px solid #0a0a0a;outline:1px solid #c9a24a;outline-offset:6px;box-shadow:0 0 0 1px rgba(212,175,90,.25),0 20px 50px -20px rgba(212,175,90,.35)}
.person__nick{font-size:52px}
.event{border:1px solid rgba(212,175,90,.45);outline:1px solid rgba(212,175,90,.18);outline-offset:-8px;border-radius:2px}
.event__name{font-size:46px}
.event__day,.event__month{border-color:rgba(212,175,90,.35)}
.btn{border-radius:0;background:var(--gold);background-size:200% 100%;border:0;color:#0a0a0a;font-weight:600;letter-spacing:.22em;text-transform:uppercase;font-size:11px;padding:13px 24px;transition:background-position .6s}
.btn:hover{background-position:100% 0;box-shadow:0 10px 30px -10px rgba(212,175,90,.6)}
.btn-ghost{background:transparent;color:#d4af5a;border:1px solid #d4af5a}
.hero .btn-ghost{color:#f6e3a1;border-color:#f6e3a1}
.countdown div{border-color:rgba(212,175,90,.5);border-radius:0}
.countdown b{color:#f6e3a1}
.seg span{border-radius:0}
.seg input:checked+span{background:var(--gold);color:#0a0a0a}
.form input:not([type=radio]),.form select,.form textarea{background:#050505;border-radius:0;border-color:rgba(212,175,90,.3)}
.card,.gift-card{border-radius:2px;border-color:rgba(212,175,90,.35)}
.tag--hadir{background:#c9a24a;color:#0a0a0a}
.timeline{border-left-color:#c9a24a}
.music{background:var(--gold);color:#0a0a0a;border:0}
.dock a.active{background:var(--gold);color:#0a0a0a}
@media (prefers-reduced-motion:reduce){.names,.sec__title{animation:none}}