.rel{position:relative;isolation:isolate;overflow:hidden;max-width:none;min-height:calc(100vh - 8rem);display:flex;align-items:center;justify-content:center;padding:2.5rem 1rem}
.rel:before{content:"";position:absolute;inset:-30px;z-index:-1;background:url(hero-poster.jpg) center/cover;filter:blur(16px) brightness(.35)}
.rel-box{width:100%;max-width:46rem;text-align:center}
.rel-box img{display:block;margin:0 auto;width:clamp(100px,20vw,160px);height:auto;border-radius:50%;box-shadow:0 0 60px rgba(86,217,255,.4)}
.rel-kicker{display:inline-block;margin:1rem 0 0;padding:.15rem .8rem;background:var(--gold);color:#1b1500;font-weight:800;letter-spacing:.12em;text-transform:uppercase;font-size:.85rem}
.rel-box h1{margin:.6rem 0 .3rem;font-size:clamp(2rem,7vw,3.6rem)}
.rel-sub{margin:0 0 1.6rem;color:#d3e9f5;font-size:1.1rem}
.rel-time{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(.4rem,2vw,1rem)}
.rel-time div{background:rgba(11,36,71,.85);border:3px solid var(--cyan);padding:.8rem .2rem}
.rel-time b{display:block;font:900 clamp(2rem,9vw,4.2rem)/1 "Arial Black",Impact,system-ui,sans-serif;font-variant-numeric:tabular-nums}
.rel-time span{color:#9fd8f0;font-size:.95rem}
.rel-done{font:900 clamp(1.6rem,6vw,2.6rem)/1.2 "Arial Black",system-ui,sans-serif;color:var(--gold);margin:1.2rem 0 0}
.rel-btns{margin-top:1.6rem}
.rel-box button.alt{background:transparent;color:var(--text);border:2px solid var(--cyan)}
.rel-box button.alt:hover{background:rgba(86,217,255,.15)}
.rel-box [hidden]{display:none!important}
