/* ===========================================================
   Kartik & Gauravi — luxury Indian wedding (bronze candlelit) v2
   richer warmth · tighter · smoother
   =========================================================== */
:root{
  --bg0:#0e0705; --bg1:#1c100a; --bg2:#3a2412; --warm:#5a3318;
  --g1:#f7e1a8; --g2:#e0b56b; --g3:#b07c34; --g-dk:#7c5320;
  --cream:#f0ddba; --muted:#cba978;
  --maxw:540px;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:"Cormorant Garamond",Georgia,serif;background:#080403;color:var(--cream);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;
}

/* ---------- continuous candlelit background ---------- */
.bg{position:fixed;inset:0;z-index:-4;
  background:radial-gradient(135% 72% at 50% -8%, #6e3f1f 0%, #3a2412 30%, #1c100a 58%, #0e0705 100%);}
.bg::after{content:"";position:absolute;inset:0;
  background:radial-gradient(80% 55% at 50% 105%, #5a331855 0%, transparent 60%);}
.gold-veins{position:fixed;inset:0;z-index:-3;pointer-events:none;opacity:.07;
  background:
   repeating-linear-gradient(58deg, transparent 0 44px, #d9ad6322 44px 45px),
   repeating-linear-gradient(-58deg, transparent 0 44px, #d9ad6316 44px 45px);}
.bokeh{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden;contain:strict}
.bokeh span{position:absolute;border-radius:50%;will-change:transform,opacity;
  background:radial-gradient(circle, #ffd285 0%, #e0a64d44 44%, transparent 72%);
  animation:float linear infinite}
@keyframes float{
  0%{transform:translate3d(0,0,0) scale(.8);opacity:0}
  12%{opacity:.65}55%{opacity:.85}88%{opacity:.3}
  100%{transform:translate3d(0,-140px,0) scale(1.15);opacity:0}}
.grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.04;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");}

.site{max-width:var(--maxw);margin:0 auto;position:relative;padding-bottom:48px}

/* ---------- top bar ---------- */
.topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;
  padding:14px 22px;background:linear-gradient(180deg,#0e0705cc,transparent);
  
  transition:background .5s var(--ease),box-shadow .5s var(--ease)}
.topbar.solid{background:#140b07f7;
  box-shadow:0 2px 20px #00000070}
.mandala{width:46px;height:46px;opacity:.97;object-fit:contain;filter:drop-shadow(0 2px 6px #00000066)}
@keyframes spin{to{transform:rotate(360deg)}}
.ham{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;gap:5px;padding:8px;z-index:60}
.ham span{display:block;width:25px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--g1),var(--g-dk));transition:.4s var(--ease)}
.ham.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.ham.open span:nth-child(2){opacity:0}
.ham.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- nav drawer ---------- */
.nav{position:fixed;inset:0;z-index:50;background:#0e0705fb;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;
  opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility .5s}
.nav.open{opacity:1;visibility:visible}
.nav a{font-family:"Cinzel",serif;letter-spacing:.22em;font-size:17px;color:var(--cream);
  text-decoration:none;position:relative;padding:6px 4px;
  opacity:0;transform:translateY(12px);transition:.5s var(--ease)}
.nav.open a{opacity:1;transform:none}
.nav.open a:nth-child(2){transition-delay:.06s}
.nav.open a:nth-child(3){transition-delay:.1s}
.nav.open a:nth-child(4){transition-delay:.14s}
.nav.open a:nth-child(5){transition-delay:.18s}
.nav.open a:nth-child(6){transition-delay:.22s}
.nav.open a:nth-child(7){transition-delay:.26s}
.nav a:hover{color:var(--g1)}
.nav a::after{content:"";position:absolute;left:50%;bottom:-2px;width:0;height:1px;background:var(--g2);
  transition:.35s var(--ease);transform:translateX(-50%)}
.nav a:hover::after{width:100%}
.nav .nav-kg{width:64px;height:64px;object-fit:contain;margin-bottom:10px}


/* hero gold lettering image */
.hero-title{display:block;width:min(86%,440px);height:auto;margin:0 auto 4px;
  filter:drop-shadow(0 6px 26px #00000088) drop-shadow(0 1px 3px #5a331866)}

/* ---------- hero ---------- */
.hero{position:relative;margin-top:-72px;min-height:100svh;display:flex;flex-direction:column;
  justify-content:flex-end;align-items:center;text-align:center;overflow:hidden}
.hero-photo{position:absolute;inset:0;z-index:0;will-change:transform;transform:translateZ(0) scale(1.04)}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 22%;
  filter:brightness(.84) sepia(.16)}
.hero-fade{position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(78% 56% at 50% 34%, transparent 0%, transparent 30%, #1c100a99 66%, #0e0705 100%),
    linear-gradient(180deg, #0e070566 0%, transparent 16%, transparent 30%, #1c100acc 60%, #160d08 82%, #0e0705 100%),
    linear-gradient(180deg, #4a2a1633, #2a160c55)}
.hero-glow{position:absolute;inset:0;z-index:1;pointer-events:none;mix-blend-mode:screen;
  background:radial-gradient(46% 34% at 50% 30%, #ffca7733 0%, transparent 60%)}
.hero-content{position:relative;z-index:2;padding:0 26px 52px;width:100%}
.names{font-family:"Cinzel",serif;font-weight:600;letter-spacing:.04em;line-height:.94;
  font-size:clamp(46px,15vw,68px);
  background:linear-gradient(180deg,#fff0cc,#f0cd84 34%,#d8a955 66%,#9a7028);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 4px 30px #00000099;filter:drop-shadow(0 2px 10px #3a200a88)}
.names .amp{display:block;font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:500;
  font-size:.58em;margin:1px 0;letter-spacing:0;color:var(--g2);-webkit-text-fill-color:var(--g2)}
.tag{font-family:"Cinzel",serif;letter-spacing:.3em;font-size:10.5px;color:var(--g2);margin-top:13px}
.when{font-family:"Cinzel",serif;letter-spacing:.2em;font-size:14px;color:var(--cream);margin-top:9px}
.where{font-family:"Cinzel",serif;letter-spacing:.2em;font-size:10.5px;color:var(--muted);margin-top:5px}
.scroll-cue{margin-top:20px;display:flex;flex-direction:column;align-items:center;gap:4px}
.scroll-cue .dot{width:4px;height:4px;border-radius:50%;background:var(--g2);animation:cue 1.8s var(--ease) infinite}
@keyframes cue{0%,100%{transform:translateY(0);opacity:.35}50%{transform:translateY(6px);opacity:1}}



/* ---------- hero → story transition bridge ---------- */
.hero-bridge{position:absolute;left:0;right:0;bottom:-1px;height:140px;z-index:2;pointer-events:none;
  background:linear-gradient(180deg, transparent 0%, #120a06aa 55%, #0e0705 100%)}
.section-bridge{display:flex;justify-content:center;align-items:center;
  margin-top:-12px;padding:18px 0 4px;position:relative;z-index:3}
.bridge-svg{width:230px;height:56px;opacity:.95;
  filter:drop-shadow(0 0 10px #7c531e55)}
.section-bridge>*{opacity:0;transform:translateY(14px);transition:1s var(--ease)}
.section-bridge.in>*{opacity:1;transform:none}

/* ---------- dividers ---------- */
.divider{display:flex;justify-content:center;margin:14px auto}
.dsvg{width:200px;height:22px}

/* ---------- buttons ---------- */
.btn{display:inline-block;font-family:"Cinzel",serif;letter-spacing:.16em;font-size:11.5px;
  color:#2a1608;text-decoration:none;padding:13px 30px;margin-top:20px;border-radius:7px;cursor:pointer;border:none;
  background:linear-gradient(180deg,var(--g1),var(--g2) 50%,var(--g3));
  box-shadow:0 6px 20px #00000077, inset 0 1px 0 #ffffff88;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 28px #00000099}
.btn.outline{color:var(--g1);background:none;border:1px solid var(--g3);box-shadow:inset 0 0 0 3px #b07c3418}
.btn.outline:hover{background:linear-gradient(180deg,var(--g1),var(--g3));color:#2a1608}

/* ---------- blocks (tighter) ---------- */
.block{padding:46px 22px;position:relative;content-visibility:auto;contain-intrinsic-size:auto 600px}
.heading{font-family:"Cinzel",serif;letter-spacing:.3em;font-size:18px;color:var(--g1);
  text-align:center;margin-bottom:8px;font-weight:500;display:flex;align-items:center;justify-content:center;gap:15px;
  text-shadow:0 2px 16px #00000055}
.heading .leaf{width:21px;height:13px;fill:none;stroke:url(#bz);stroke-width:1.1}
.subheading{text-align:center;font-style:italic;font-size:18px;color:var(--muted);margin-bottom:22px}

/* ---------- countdown ---------- */
.countdown{display:flex;justify-content:center;gap:12px;margin:8px auto 2px;flex-wrap:wrap}
.cd-unit{min-width:70px;background:linear-gradient(160deg,#241509,#3a2412);border:1px solid #b07c3455;
  border-radius:12px;padding:13px 8px;box-shadow:inset 0 0 0 3px #b07c3412,0 6px 16px #00000055}
.cd-num{font-family:"Cinzel",serif;font-size:28px;color:var(--g1);line-height:1;font-variant-numeric:tabular-nums}
.cd-lab{font-family:"Cinzel",serif;letter-spacing:.16em;font-size:9.5px;color:var(--muted);margin-top:6px}

/* ---------- our story (connects up to hero) ---------- */
#story{padding-top:14px}
.story-wrap{display:flex;flex-direction:column;align-items:center;text-align:center}
.story-text{font-size:18px;line-height:1.7;color:var(--cream);opacity:.92;max-width:430px;margin:0 auto}
.invite-host{font-style:italic;color:var(--muted);font-size:17px;margin-top:6px}
/* gold-framed invitation panel (text-only, no photo) */
.invite-panel{position:relative;max-width:420px;margin:6px auto 0;padding:38px 30px 34px;
  background:
    radial-gradient(120% 80% at 50% 0%, #5a331844 0%, transparent 60%),
    linear-gradient(160deg,#241509,#3a2412);
  border:1px solid #b07c3455;border-radius:16px;
  box-shadow:inset 0 0 0 1px #b07c3422, inset 0 0 28px #00000055, 0 12px 30px #00000066}
.ip-corner{position:absolute;width:20px;height:20px;opacity:.85}
.ip-corner.tl{top:12px;left:12px;border-top:1px solid var(--g3);border-left:1px solid var(--g3);border-top-left-radius:6px}
.ip-corner.tr{top:12px;right:12px;border-top:1px solid var(--g3);border-right:1px solid var(--g3);border-top-right-radius:6px}
.ip-corner.bl{bottom:12px;left:12px;border-bottom:1px solid var(--g3);border-left:1px solid var(--g3);border-bottom-left-radius:6px}
.ip-corner.br{bottom:12px;right:12px;border-bottom:1px solid var(--g3);border-right:1px solid var(--g3);border-bottom-right-radius:6px}
.ip-mono{display:block;width:64px;height:auto;margin:0 auto 16px;opacity:.97;object-fit:contain}
.ip-names{font-family:"Great Vibes",cursive;font-size:46px;color:var(--g1);line-height:1.05;margin:14px 0 2px;
  text-shadow:0 2px 14px #00000066}

/* ---------- celebrations (photo-backed tiles) ---------- */
.cel-list{display:flex;flex-direction:column;gap:16px;max-width:480px;margin:0 auto}
.cel-tile{position:relative;display:block;border-radius:16px;overflow:hidden;text-decoration:none;
  min-height:188px;border:1px solid #b07c3466;
  box-shadow:inset 0 0 0 1px #b07c3422, 0 12px 28px #00000066;
  background-size:cover;background-position:center;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s var(--ease)}
.cel-tile:hover{transform:translateY(-4px) scale(1.01);border-color:#e0b56bcc;
  box-shadow:0 18px 38px #000000aa, 0 0 26px #b07c3433}
.cel-tile-veil{position:absolute;inset:0;
  background:linear-gradient(90deg,#0e0705f0 0%,#0e0705d8 30%,#0e070566 52%,#0e070500 78%),
             linear-gradient(180deg,#0e070522,transparent 45%,#0e070544)}
.cel-tile-body{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;
  align-items:flex-start;text-align:left;padding:22px 24px;max-width:80%}
.cel-tile .cel-date{font-family:"Cinzel",serif;letter-spacing:.16em;font-size:11px;color:var(--g2);
  border:1px solid #b07c3466;border-radius:20px;padding:4px 13px;margin-bottom:10px;background:#1c100a99;display:inline-block}
.cel-tname{font-family:"Great Vibes",cursive;font-size:34px;color:var(--g1);line-height:1;
  text-shadow:0 2px 14px #000000aa;margin-bottom:4px}
.cel-tile .cel-rule{display:block;width:40px;height:1px;margin:8px 0 10px;
  background:linear-gradient(90deg,var(--g3),transparent)}
.cel-tsub{font-size:15px;color:var(--cream);opacity:.9;line-height:1.4;max-width:300px}

/* ---------- ceremony feature ---------- */
.feature{position:relative;border-radius:18px;overflow:hidden;border:1px solid #b07c3455;
  box-shadow:0 14px 34px #00000077;margin-top:4px}
.feature img{width:100%;height:430px;object-fit:cover;display:block;filter:brightness(.72) saturate(1.02) sepia(.12)}
.feature-veil{position:absolute;inset:0;
  background:linear-gradient(180deg,#0e0705a8 0%,transparent 28%,transparent 46%,#0e0705f2 100%)}
.feature-body{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;
  align-items:center;text-align:center;padding:28px 24px}
.feature-eyebrow{font-family:"Cinzel",serif;letter-spacing:.26em;font-size:10.5px;color:var(--g2)}
.feature-name{font-family:"Great Vibes",cursive;font-size:46px;color:var(--g1);line-height:1;margin:5px 0 7px;
  text-shadow:0 2px 14px #00000088}
.feature-meta{font-family:"Cinzel",serif;letter-spacing:.14em;font-size:12.5px;color:var(--cream)}
.feature-text{font-size:16px;color:var(--cream);opacity:.85;line-height:1.5;margin:9px 0 2px;max-width:390px}

/* ---------- venue ---------- */
.venue-card{position:relative;border-radius:18px;overflow:hidden;border:1px solid #b07c3455;box-shadow:0 14px 34px #00000077}
.venue-card img{width:100%;height:350px;object-fit:cover;display:block;filter:brightness(.66) saturate(1.02) sepia(.12)}
.venue-veil{position:absolute;inset:0;
  background:linear-gradient(90deg,#0e0705F4 0%,#0e0705cc 42%,#0e070544 70%,transparent 100%)}
.venue-body{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:28px 24px;max-width:78%}
.venue-eyebrow{font-family:"Cinzel",serif;letter-spacing:.26em;font-size:10.5px;color:var(--g2)}
.venue-name{font-family:"Cinzel",serif;font-size:24px;color:var(--g1);line-height:1.15;margin:7px 0 9px;font-weight:600}
.venue-text{font-size:15px;color:var(--cream);opacity:.85;line-height:1.45}
.venue-addr{font-size:13.5px;color:var(--muted);margin-top:9px;line-height:1.4}
.venue-body .btn{align-self:flex-start;margin-top:15px;padding:11px 22px}


/* ---------- venue (large feature) ---------- */
.venue-block{padding-top:50px}
.venue-hero{position:relative;border-radius:20px;overflow:hidden;border:1px solid #b07c3466;
  box-shadow:inset 0 0 0 1px #b07c3422, 0 18px 44px #000000aa;margin-top:6px}
.venue-hero img{width:100%;height:580px;object-fit:cover;display:block;
  filter:brightness(.74) saturate(1.04) sepia(.08)}
.venue-hero-veil{position:absolute;inset:0;
  background:linear-gradient(180deg,#0e070566 0%,transparent 26%,transparent 40%,#0e0705e8 92%,#0e0705 100%)}
.venue-hero-body{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;
  align-items:center;text-align:center;padding:34px 28px 36px}
.venue-eyebrow{font-family:"Cinzel",serif;letter-spacing:.28em;font-size:11px;color:var(--g2)}
.venue-name{font-family:"Great Vibes",cursive;font-size:54px;color:var(--g1);line-height:1;margin:4px 0 6px;
  text-shadow:0 3px 18px #000000aa}
.venue-loc{font-family:"Cinzel",serif;letter-spacing:.26em;font-size:12px;color:var(--cream)}
.venue-text{font-size:17px;color:var(--cream);opacity:.9;line-height:1.55;margin:6px auto 12px;max-width:420px}
.venue-addr{font-size:14px;color:var(--muted);line-height:1.45;margin-bottom:4px}

/* ---------- save the date ---------- */
.save{text-align:center}
.save-love{font-family:"Cinzel",serif;letter-spacing:.3em;font-size:11.5px;color:var(--muted);margin-top:5px}
.save-hosts{font-family:"Great Vibes",cursive;font-size:46px;color:var(--g1);margin-top:5px;line-height:1.05;
  text-shadow:0 2px 14px #00000066}
.footer-note{margin-top:26px;font-size:12.5px;color:var(--muted);letter-spacing:.08em}
.foot-kg{display:block;margin:22px auto 0;width:58px;height:auto;opacity:.92;object-fit:contain}

/* ---------- reveal (smoother, gentler) ---------- */
.reveal>*{opacity:0;transform:translate3d(0,28px,0);
  transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in>*{opacity:1;transform:none}
.reveal.in>*:nth-child(2){transition-delay:.08s}
.reveal.in>*:nth-child(3){transition-delay:.16s}
.reveal.in>*:nth-child(4){transition-delay:.24s}
.reveal.in>*:nth-child(n+5){transition-delay:.32s}
.cel-card{opacity:0;transform:translate3d(0,30px,0);
  transition:opacity .85s var(--ease),transform .85s var(--ease)}
.celebrations.in .cel-card{opacity:1;transform:none}
.celebrations.in .cel-card:nth-child(2){transition-delay:.14s}
.celebrations.in .cel-card:nth-child(3){transition-delay:.28s}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .reveal>*,.cel-card,.nav a{opacity:1!important;transform:none!important}
}
@media(max-width:430px){
  .block{padding:40px 18px}.venue-body{max-width:85%}
  .cel-card{padding:18px 8px 20px;min-height:256px}.cel-name{font-size:12px}
  .cd-unit{min-width:62px}.cd-num{font-size:23px}
}

/* ============================================================
   INTRO / LOADING OVERLAY
   ============================================================ */
.intro{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;
  overflow:hidden;background:#0b0504}
.intro-glow{position:absolute;inset:0;
  background:radial-gradient(42% 34% at 50% 46%, #ffca7733 0%, #5a331822 40%, transparent 72%);
  animation:introGlow 3.4s var(--ease) infinite}
@keyframes introGlow{0%,100%{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}

/* curtain veils that part to reveal the site */
.intro-veil{position:absolute;top:0;bottom:0;width:51%;z-index:2;
  background:linear-gradient(180deg,#160d08,#0b0504);
  box-shadow:0 0 60px #000a inset;transition:transform 1.1s cubic-bezier(.7,0,.2,1)}
.intro-veil.left{left:0;border-right:1px solid #b07c3433}
.intro-veil.right{right:0;border-left:1px solid #b07c3433}
.intro.done .intro-veil.left{transform:translateX(-101%)}
.intro.done .intro-veil.right{transform:translateX(101%)}

.intro-content{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;
  text-align:center;padding:0 24px;transition:opacity .6s var(--ease),transform .9s var(--ease)}
.intro.done .intro-content{opacity:0;transform:translateY(-18px) scale(.98)}

.intro-kg{width:96px;height:auto;opacity:0;transform:scale(.7) translateY(8px);
  filter:drop-shadow(0 4px 18px #00000088);
  animation:introKG 1.1s var(--ease) .2s forwards}
@keyframes introKG{to{opacity:1;transform:scale(1) translateY(0)}}

.intro-line{display:block;width:0;height:1px;margin:18px 0 14px;
  background:linear-gradient(90deg,transparent,var(--g2),transparent);
  animation:introLine .9s var(--ease) 1s forwards}
@keyframes introLine{to{width:200px}}

.intro-title{width:min(78%,320px);max-width:320px;height:auto;opacity:0;transform:translateY(14px);
  filter:drop-shadow(0 6px 22px #00000088);
  animation:introFade 1s var(--ease) 1.25s forwards}
.intro-date{font-family:"Cinzel",serif;letter-spacing:.22em;font-size:14px;color:var(--cream);
  margin-top:16px;opacity:0;transform:translateY(12px);animation:introFade .9s var(--ease) 1.7s forwards}
.intro-sub{font-family:"Cinzel",serif;letter-spacing:.3em;font-size:11px;color:var(--g2);
  margin-top:7px;opacity:0;transform:translateY(12px);animation:introFade .9s var(--ease) 1.95s forwards}
@keyframes introFade{to{opacity:1;transform:none}}

/* shimmer sweep across the title */
.intro-title{-webkit-mask-image:linear-gradient(90deg,#000 40%, #0006 50%, #000 60%);
  -webkit-mask-size:250% 100%;mask-image:linear-gradient(90deg,#000 40%, #0006 50%, #000 60%);mask-size:250% 100%;
  animation:introFade 1s var(--ease) 1.25s forwards, introShimmer 2.4s var(--ease) 1.8s}
@keyframes introShimmer{0%{-webkit-mask-position:120% 0;mask-position:120% 0}100%{-webkit-mask-position:-120% 0;mask-position:-120% 0}}

/* loading bar */
.intro-loadbar{position:absolute;left:50%;bottom:64px;transform:translateX(-50%);z-index:3;
  width:160px;height:2px;background:#b07c3433;border-radius:2px;overflow:hidden}
.intro-loadbar span{display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--g3),var(--g1));
  animation:introLoad 2.6s var(--ease) .3s forwards}
@keyframes introLoad{to{width:100%}}

/* skip / enter */
.intro-skip{position:absolute;right:22px;bottom:22px;z-index:4;background:none;border:none;cursor:pointer;
  font-family:"Cinzel",serif;letter-spacing:.18em;font-size:12px;color:var(--g2);
  opacity:0;animation:introFade .8s var(--ease) 1.4s forwards;padding:8px 4px}
.intro-skip:hover{color:var(--g1)}

/* dismissed */
.intro.hide{opacity:0;visibility:hidden;transition:opacity .5s var(--ease) .4s,visibility 0s .9s}

/* keep body from scrolling while intro is up */
body.intro-lock{overflow:hidden}

@media(prefers-reduced-motion:reduce){
  .intro-glow,.intro-kg,.intro-line,.intro-title,.intro-date,.intro-sub,.intro-loadbar span,.intro-skip{
    animation:none!important;opacity:1!important;transform:none!important;width:auto}
  .intro-line{width:200px}.intro-loadbar span{width:100%}
}