:root{
  --navy:#0e1f6b;
  --blue:#1f4fd8;
  --sky:#3aa8ff;
  --violet:#6b4de6;
  --ink:#10226e;
  --muted:#4a5a93;
  --gold:#d9a845;
  --artibir:#d8232a;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{
  font-family:'Montserrat',system-ui,sans-serif;
  color:var(--ink);
  background:linear-gradient(180deg,#e9f3ff 0%,#f4f9ff 38%,#dcebff 70%,#ffe9c9 100%);
    height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column;
  -webkit-font-smoothing:antialiased;
}

/* soft drifting light */
.aurora{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.aurora i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;will-change:transform}
.aurora i:nth-child(1){width:46vmax;height:46vmax;left:-14vmax;top:-12vmax;background:radial-gradient(circle,#7fb8ff,transparent 65%);animation:drift1 26s ease-in-out infinite alternate}
.aurora i:nth-child(2){width:42vmax;height:42vmax;right:-14vmax;top:6vmax;background:radial-gradient(circle,#a99bff,transparent 65%);animation:drift2 32s ease-in-out infinite alternate}
.aurora i:nth-child(3){width:38vmax;height:38vmax;left:20vw;bottom:-18vmax;background:radial-gradient(circle,#ffd9a0,transparent 65%);animation:drift1 38s ease-in-out infinite alternate-reverse}
@keyframes drift1{to{transform:translate3d(6vmax,4vmax,0) scale(1.1)}}
@keyframes drift2{to{transform:translate3d(-7vmax,5vmax,0) scale(1.08)}}

#net{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}

/* poster artwork */
.art{position:fixed;z-index:1;pointer-events:none;user-select:none}
.art.globe{left:-4vw;top:11vh;width:clamp(150px,24vw,380px);animation:floatA 16s ease-in-out infinite alternate;opacity:.95}
.art.brain{right:-3vw;top:9vh;width:clamp(150px,25vw,390px);animation:floatB 14s ease-in-out infinite alternate}
.art.brain::after{content:"";position:absolute;inset:18% 12% 30% 20%;border-radius:50%;background:radial-gradient(circle,rgba(255,190,80,.55),transparent 65%);mix-blend-mode:screen;animation:pulse 4.5s ease-in-out infinite}
.art img{display:block;width:100%;height:auto}
@keyframes floatA{to{transform:translate3d(10px,-14px,0) rotate(-1.2deg)}}
@keyframes floatB{to{transform:translate3d(-10px,12px,0) rotate(1.2deg)}}
@keyframes pulse{0%,100%{opacity:.15}50%{opacity:.8}}

/* skyline (poster photo) */
.sky{position:relative;z-index:2;flex:1 1 0;min-height:0;pointer-events:none}
.sky img{width:100%;height:100%;object-fit:cover;object-position:center 62%;display:block;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%);mask-image:linear-gradient(180deg,transparent 0,#000 22%);
  animation:glow 12s ease-in-out infinite alternate}
@keyframes glow{from{filter:saturate(1) brightness(1)}to{filter:saturate(1.12) brightness(1.04)}}

main{
  position:relative;z-index:3;
  display:flex;flex-direction:column;align-items:center;
  padding:clamp(18px,3.5vh,40px) 20px 0;margin-bottom:clamp(-110px,-9vh,-30px);flex:0 0 auto;
  text-align:center;
}

/* partner logos */
.partners{display:flex;align-items:center;justify-content:center;gap:clamp(14px,3vw,40px);opacity:0;animation:rise .9s .05s cubic-bezier(.2,.7,.2,1) forwards}
.partners img{height:clamp(40px,7.5vh,84px);width:auto;display:block}


/* hero */
.hero{margin-top:clamp(10px,3vh,36px);display:flex;flex-direction:column;align-items:center}
.title{width:min(640px,76vw,56vh);height:auto;display:block;opacity:0;animation:rise 1s .2s cubic-bezier(.2,.7,.2,1) forwards, breathe 7s 1.4s ease-in-out infinite;
}
@keyframes breathe{0%,100%{filter:drop-shadow(0 8px 18px rgba(31,79,216,.18)) brightness(1)}50%{filter:drop-shadow(0 12px 28px rgba(107,77,230,.32)) brightness(1.06)}}

.fullname{
  font-family:'Playfair Display',Georgia,serif;font-weight:700;
  font-size:clamp(17px,min(3.4vw,3.8vh),42px);line-height:1.15;
  color:var(--navy);margin-top:clamp(2px,.8vh,10px);
  max-width:18em;
  opacity:0;animation:rise .9s .5s cubic-bezier(.2,.7,.2,1) forwards;
}

.when{
  margin-top:clamp(10px,2vh,24px);
  display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:center;align-items:baseline;
  opacity:0;animation:rise .9s .7s cubic-bezier(.2,.7,.2,1) forwards;
}
.when .d{font-weight:800;font-size:clamp(22px,min(4.4vw,4.8vh),50px);letter-spacing:-.01em;color:#0b0b1e}
.when .d b{font-weight:800;color:#2a1f86}
.when .y{font-weight:700;font-size:clamp(18px,2.8vw,32px);color:var(--violet);letter-spacing:.08em}
.where{
  margin-top:6px;font-family:'Playfair Display',serif;font-weight:600;
  font-size:clamp(16px,2.1vw,25px);color:var(--navy);
  opacity:0;animation:rise .9s .85s cubic-bezier(.2,.7,.2,1) forwards;
}
.where span{display:block;font-style:italic;font-size:1.15em;margin-top:2px}

/* status card */
.card{
  margin-top:clamp(14px,2.6vh,30px);
  width:min(560px,100%);position:relative;z-index:4;
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(14px) saturate(1.3);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);
  border-radius:22px;padding:18px 26px 20px;
  box-shadow:0 18px 50px rgba(31,79,216,.16),inset 0 0 0 1px rgba(255,255,255,.95);
  opacity:0;animation:rise .9s 1s cubic-bezier(.2,.7,.2,1) forwards;
}
.status{
  display:inline-flex;align-items:center;gap:10px;
  font-weight:700;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--blue);
}
.status .dot{position:relative;width:9px;height:9px;border-radius:50%;background:var(--sky)}
.status .dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--sky);animation:ping 2.2s ease-out infinite}
@keyframes ping{to{transform:scale(3.4);opacity:0}}
.card h2{font-family:'Playfair Display',serif;font-size:clamp(22px,3vw,30px);margin:8px 0 4px;color:var(--navy)}
.card p{font-size:15px;line-height:1.6;color:var(--muted)}
.bar{margin:14px auto 16px;height:5px;width:100%;border-radius:99px;background:rgba(31,79,216,.12);overflow:hidden;position:relative}
.bar::before{
  content:"";position:absolute;inset:0;width:45%;border-radius:inherit;
  background:linear-gradient(90deg,var(--blue),var(--sky),var(--violet));
  animation:load 3.6s cubic-bezier(.6,0,.3,1) infinite;
}
@keyframes load{0%{transform:translateX(-100%)}100%{transform:translateX(230%)}}
.mail{
  display:inline-flex;align-items:center;gap:10px;
  padding:13px 24px;border-radius:99px;text-decoration:none;
  font-weight:700;font-size:15px;color:#fff;
  background:linear-gradient(120deg,var(--blue),var(--violet));
  box-shadow:0 8px 22px rgba(53,70,220,.35);
  transition:transform .2s ease,box-shadow .2s ease;
}
.mail:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(53,70,220,.42)}
.mail:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.mail svg{width:18px;height:18px}

footer{position:relative;z-index:5;flex:0 0 auto;background:#fff;padding:8px clamp(14px,2.5vw,36px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:4px 22px;box-shadow:0 -10px 30px rgba(20,40,120,.12)}
footer>a{display:block;line-height:0;grid-column:2}
footer img{width:157px;height:44px;display:block}
footer small{grid-column:3;justify-self:end;white-space:nowrap;font-size:12.5px;color:#555;letter-spacing:.02em;text-align:right}
footer small a{color:var(--blue);font-weight:600;text-decoration:none}
footer small a:hover{text-decoration:underline}
footer small .heart{color:#e0212c}

@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

@media (max-width:700px){
  .art{opacity:.55}
  .art.globe{top:30vh;width:34vw}
  .art.brain{top:28vh;width:34vw}
}
@media (max-width:700px){
  footer{grid-template-columns:1fr;justify-items:center}
  footer>a,footer small{grid-column:1;justify-self:center}
  footer small{white-space:normal;line-height:1.5;text-align:center}
}
@media (max-width:560px){
  .card{padding:20px 18px}
}
@media (max-height:940px) and (min-width:700px){
  .where span{display:inline;margin:0 0 0 8px}
  .where span::before{content:"· ";font-style:normal}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s!important;animation-iteration-count:1!important;animation-delay:0s!important}
  #net{display:none}
}