/* Ring-box cinematic opening — isolated from the invitation design */
.ring-opening{
  position:fixed;inset:0;z-index:200;overflow:hidden;background:#210805;
  min-height:100svh;display:block;opacity:1;visibility:visible;transform:none;
  transition:opacity 1s ease .08s,visibility 0s linear 1.08s;
}
.ring-opening.hide{opacity:0;visibility:hidden;transform:none;pointer-events:none}
.ring-scene{position:absolute;inset:0;overflow:hidden;background:#210805 url("assets/ring/video-poster.jpg") center/cover no-repeat}
.ring-ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}
.ring-ph-closed{opacity:1;animation:ringKenburns 15s ease-in-out infinite alternate;will-change:transform,opacity}
.ring-ph-video{opacity:0;background:transparent;z-index:2;will-change:opacity}
.ring-ph-open{opacity:0;z-index:1;will-change:transform,opacity}
.ring-opening.is-arming .ring-scene{transform:scale(1.055) translateY(1%);transition:transform .75s cubic-bezier(.2,.72,.15,1)}
.ring-opening.is-playing .ring-ph-video{opacity:1;transition:opacity .22s ease}
.ring-opening.is-playing .ring-ph-closed{opacity:0;animation:none;transition:opacity .2s ease}
.ring-opening.is-revealed .ring-ph-video{opacity:0;transition:opacity .25s ease}
.ring-opening.is-revealed .ring-ph-closed{opacity:0;animation:none;transition:opacity .45s ease}
.ring-opening.is-revealed .ring-ph-open{opacity:1;transition:opacity .48s ease;animation:ringOpenBreathe 8s ease-in-out infinite alternate}
@keyframes ringKenburns{from{transform:scale(1)}to{transform:scale(1.075) translateY(-1.1%)}}
@keyframes ringOpenBreathe{from{transform:scale(1.015)}to{transform:scale(1.075) translateY(-.7%)}}

.ring-cover-tap{position:absolute;inset:0;z-index:230;border:0;background:transparent;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.ring-opening.is-open .ring-cover-tap{pointer-events:none;cursor:default}

.ring-cover-ui{position:absolute;z-index:220;top:max(38px,calc(env(safe-area-inset-top,0px) + 22px));left:50%;transform:translateX(-50%);width:min(92vw,620px);text-align:center;color:#f8e7d9;pointer-events:none;text-shadow:0 2px 18px rgba(0,0,0,.72)}
.ring-kicker{margin:0;font-family:"Aref Ruqaa","Amiri",serif;font-size:clamp(20px,5.6vw,33px);font-weight:700;color:#f4dfd2}
.ring-names{margin:4px 0 10px;font-family:"Aref Ruqaa","Amiri",serif;font-size:clamp(34px,9vw,62px);font-weight:700;line-height:1.12;color:#fff5ee}
.ring-names span{font-family:"Cormorant Garamond",serif;color:#d9ad72;font-weight:600;padding:0 .1em}
.ring-hint{display:inline-flex;align-items:center;justify-content:center;gap:9px;margin:0;padding:8px 15px;border:1px solid rgba(220,177,113,.48);border-radius:999px;background:rgba(30,8,6,.33);backdrop-filter:blur(7px);font-size:clamp(11px,3.1vw,14px);color:#f4dfd2;transition:opacity .35s ease}
.ring-hint-icon{width:14px;height:14px;border:2px solid #d9ad72;border-radius:50%;position:relative;box-shadow:0 0 13px rgba(217,173,114,.45)}
.ring-hint-icon:after{content:"";position:absolute;left:50%;top:-5px;width:6px;height:6px;border-radius:50%;background:#fff1ce;transform:translate(-50%,-50%);animation:ringHintPulse 1.65s ease-in-out infinite}
@keyframes ringHintPulse{0%,100%{opacity:.25;transform:translate(-50%,-50%) scale(.65)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.15)}}
.ring-opening.is-playing .ring-hint,.ring-opening.is-revealed .ring-hint{opacity:0}

.ring-tap-glow{position:absolute;z-index:8;left:50%;top:60%;width:min(46vw,320px);height:min(38vw,250px);transform:translate(-50%,-50%) scale(.65);background:radial-gradient(ellipse at center,rgba(255,225,160,.62),rgba(255,225,160,.16) 54%,transparent 75%);opacity:0;filter:blur(7px);pointer-events:none}
.ring-opening.is-arming .ring-tap-glow{opacity:1;transform:translate(-50%,-50%) scale(1);transition:opacity .48s ease,transform .65s cubic-bezier(.2,.72,.15,1)}
.ring-opening.is-revealed .ring-tap-glow{opacity:0;transition:opacity .35s ease}
.ring-flash{position:absolute;inset:0;z-index:40;background:radial-gradient(ellipse 86% 67% at 50% 57%,#fff9eb,#ffe8ad 44%,rgba(255,211,143,.92) 68%,rgba(255,180,104,.48) 100%);opacity:0;pointer-events:none}
.ring-opening.is-flash .ring-flash{opacity:1;transition:opacity .30s ease-in}
.ring-opening.is-revealed .ring-flash{opacity:0;transition:opacity .72s ease-out}

.ring-glints{position:absolute;z-index:12;left:49%;top:53%;width:100px;height:100px;transform:translate(-50%,-50%);pointer-events:none}
.ring-cross-glint{position:absolute;width:15px;height:15px;background:linear-gradient(#fff,#fff) center/2px 100% no-repeat,linear-gradient(#fff,#fff) center/100% 2px no-repeat;filter:drop-shadow(0 0 5px #ffe9b0);opacity:0;transform:scale(.2)}
.rg-1{top:12px;left:30px}.rg-2{top:40px;right:12px;width:11px;height:11px}.rg-3{top:58px;left:16px;width:10px;height:10px}
.ring-opening.is-revealed .rg-1{animation:ringGlint 2.4s ease-in-out .4s infinite}.ring-opening.is-revealed .rg-2{animation:ringGlint 2.4s ease-in-out 1.1s infinite}.ring-opening.is-revealed .rg-3{animation:ringGlint 2.4s ease-in-out 1.8s infinite}
@keyframes ringGlint{0%,60%,100%{opacity:0;transform:scale(.2) rotate(0)}8%{opacity:1;transform:scale(1) rotate(45deg)}16%{opacity:0;transform:scale(.3) rotate(90deg)}}

.ring-dust{position:absolute;inset:0;z-index:9;pointer-events:none}
.ring-dust span{position:absolute;width:4px;height:4px;border-radius:50%;background:radial-gradient(circle,#ffe9b0 0%,rgba(255,233,176,0) 70%);opacity:0;animation:ringMote 9s linear infinite}
.ring-dust span:nth-child(1){left:46%;top:18%;animation-delay:0s}.ring-dust span:nth-child(2){left:53%;top:30%;animation-delay:1.2s;animation-duration:10s}.ring-dust span:nth-child(3){left:42%;top:42%;animation-delay:2.4s}.ring-dust span:nth-child(4){left:60%;top:26%;animation-delay:3.1s;animation-duration:11s}.ring-dust span:nth-child(5){left:38%;top:58%;animation-delay:4s;animation-duration:8.5s}.ring-dust span:nth-child(6){left:65%;top:52%;animation-delay:5.2s;animation-duration:10.5s;width:3px;height:3px}.ring-dust span:nth-child(7){left:49%;top:66%;animation-delay:6s;animation-duration:9.5s;width:5px;height:5px}.ring-dust span:nth-child(8){left:56%;top:12%;animation-delay:2s;animation-duration:12s;width:3px;height:3px}.ring-dust span:nth-child(9){left:34%;top:34%;animation-delay:7s}.ring-dust span:nth-child(10){left:68%;top:40%;animation-delay:.6s;animation-duration:10s;width:3px;height:3px}
@keyframes ringMote{0%{transform:translate3d(0,14px,0);opacity:0}12%{opacity:.9}55%{opacity:.55}100%{transform:translate3d(10px,-46px,0);opacity:0}}

@media(max-width:760px){
  .ring-cover-ui{top:max(28px,calc(env(safe-area-inset-top,0px) + 18px))}
  .ring-glints{top:54%}
}
@media(prefers-reduced-motion:reduce){
  .ring-ph-closed,.ring-ph-open,.ring-dust span,.ring-cross-glint,.ring-hint-icon:after{animation:none!important}
  .ring-opening{transition:opacity .35s ease,visibility 0s linear .36s}
}