.portal-login--globe{background:#f4f0e7}
.portal-login--globe .portal-hero{isolation:isolate;background:#f4f0e7;overflow:hidden;padding-block:52px 46px}
.login-globe{--globe-radius:clamp(650px,70vw,1000px);position:absolute;inset:0;overflow:hidden;pointer-events:none;user-select:none}
.login-globe__camera{position:absolute;inset:0;perspective:calc(var(--globe-radius) * 2);perspective-origin:50% 48%}
.login-globe__sphere{position:absolute;left:50%;top:54%;width:0;height:0;transform-style:preserve-3d;transform:translateZ(calc(var(--globe-radius) * -1)) rotateX(-8deg) rotateY(-22deg);animation:login-globe-turn 180s linear infinite;animation-play-state:paused}
.login-globe__tile{position:absolute;width:calc(var(--globe-radius) * .175);height:calc(var(--globe-radius) * .175);left:calc(var(--globe-radius) * -.0875);top:calc(var(--globe-radius) * -.0875);border-radius:14%;backface-visibility:hidden;background:#bec1b0 url('/bryllup/login-globe.php') 0 0 / 400% 400% no-repeat}
.login-globe::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 35% 70% at 50% 48%,#f4f0e7ed 10%,#f4f0e7c7 65%,#f4f0e785 100%),linear-gradient(#f4f0e7 0%,#f4f0e733 18%,#f4f0e733 80%,#f4f0e7 100%)}
.portal-login--globe .portal-copy{position:relative;z-index:1;max-width:640px}
.wedding.portal-login--globe .portal-copy h1{font-size:clamp(3.7rem,3rem + 3vw,5.8rem);line-height:1.05;letter-spacing:-.035em;color:#183a30}
.portal-login--globe .guest-login{margin-top:30px;background:#f4f0e7;border-color:#aab5a3}
@keyframes login-globe-turn{from{transform:translateZ(calc(var(--globe-radius) * -1)) rotateX(-8deg) rotateY(-22deg)}to{transform:translateZ(calc(var(--globe-radius) * -1)) rotateX(-8deg) rotateY(338deg)}}
@media(max-width:639px){.portal-login--globe .portal-hero{padding:38px 20px 30px;min-height:calc(100svh - 166px)}.wedding.portal-login--globe .portal-copy h1{font-size:clamp(3.25rem,14vw,4.5rem)}.portal-login--globe .guest-login{margin-top:24px;padding:20px}.login-globe{--globe-radius:650px}.login-globe::after{background:radial-gradient(ellipse 55% 60% at 50% 48%,#f4f0e7e0 10%,#f4f0e799 100%),linear-gradient(#f4f0e7 0%,#f4f0e733 18%,#f4f0e733 80%,#f4f0e7 100%)}}
@media(prefers-reduced-motion:reduce){.login-globe__sphere{animation:none}}