/* ===== Lux motion add-on (v7): gilded effects on top of the Old-money layer =====
   Self-contained: /lux.css + /lux.js. Effects that move are gated by html.lux (added by lux.js,
   skipped for prefers-reduced-motion). Static styling (banners, timeline) works without it. */
@keyframes luxShine{0%,55%{background-position:140% 0}100%{background-position:-40% 0}}
@keyframes luxSweep{0%{transform:translateX(-130%) skewX(-18deg)}100%{transform:translateX(330%) skewX(-18deg)}}
@keyframes luxRing{0%{box-shadow:0 0 0 0 rgba(201,169,110,.55)}70%,100%{box-shadow:0 0 0 16px rgba(201,169,110,0)}}
@keyframes luxMarquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@keyframes luxFlip{0%{transform:rotateX(0)}45%{transform:rotateX(-90deg);opacity:.25}55%{transform:rotateX(90deg);opacity:.25}100%{transform:rotateX(0)}}
@keyframes luxGlint{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes luxLive{0%{box-shadow:0 0 0 0 rgba(201,169,110,.65)}70%,100%{box-shadow:0 0 0 9px rgba(201,169,110,0)}}
@keyframes luxUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* header: deeper glass when scrolled + gold progress hairline */
header.site{transition:box-shadow .4s,background-color .4s}
header.site.lux-scrolled{box-shadow:0 14px 34px -24px rgba(15,26,51,.45)}
.lux-prog{position:absolute;left:0;right:0;bottom:-1px;height:2px;pointer-events:none;overflow:hidden}
.lux-prog i{display:block;height:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#8A6A2C,#E6CF9C 50%,#C9A96E)}

/* hero: warm light that follows the pointer, gilded glint across the framed key visual */
.lux-hero .lux-glow{position:absolute;top:0;left:50%;width:100vw;height:100%;transform:translateX(-50%);pointer-events:none;z-index:0;opacity:0;transition:opacity .8s;background:radial-gradient(520px circle at var(--lx,70%) var(--ly,35%),rgba(201,169,110,.16),rgba(201,169,110,0) 62%)}
.lux-hero:hover .lux-glow{opacity:1}
.lux-frame{overflow:hidden}
html.lux .lux-frame::before{content:"";position:absolute;top:-10%;bottom:-10%;left:0;width:28%;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(255,250,235,0),rgba(255,250,235,.38),rgba(255,250,235,0));animation:luxSweep 7s cubic-bezier(.55,0,.25,1) 2.6s infinite}
html.lux .lux-title em{background:linear-gradient(100deg,#C9A96E 0%,#C9A96E 40%,#FFF3D2 50%,#C9A96E 60%,#C9A96E 100%);background-size:250% 100%;background-position:140% 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:atmpRise 1.1s cubic-bezier(.2,.7,.2,1) .48s forwards,luxShine 6s ease-in-out 2.4s infinite}
html.lux .lux-hero .btn-ivory{animation:luxRing 3s ease-out 2.4s infinite}

/* buttons: a quiet shine on hover */
.btn{position:relative;overflow:hidden;isolation:isolate}
.btn::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.35),rgba(255,255,255,0));transform:translateX(-130%) skewX(-18deg)}
@media (hover:hover){.btn:hover::after{animation:luxSweep .9s cubic-bezier(.2,.7,.2,1)}}

/* countdown: seconds column with a flip */
.cd-cells.lux-s div{padding-inline:clamp(12px,2.6vw,34px)}
.cd-cells div{perspective:300px}
.cd-cells strong.lux-flip{animation:luxFlip .6s cubic-bezier(.4,.1,.3,1)}
@media (max-width:420px){.cd-cells.lux-s strong{font-size:36px}.cd-cells.lux-s div{padding-inline:10px}}

/* keyword marquee under the hero */
.lux-marq{position:relative;background:var(--navy);box-shadow:0 0 0 100vmax var(--navy);clip-path:inset(0 -100vmax);border-top:1px solid rgba(201,169,110,.35);overflow:hidden;color:#F4EEE1;margin-bottom:8px}
.lux-marq::before,.lux-marq::after{content:"";position:absolute;top:0;bottom:0;width:90px;z-index:1;pointer-events:none}
.lux-marq::before{left:0;background:linear-gradient(90deg,var(--navy),rgba(15,26,51,0))}
.lux-marq::after{right:0;background:linear-gradient(270deg,var(--navy),rgba(15,26,51,0))}
.lux-marq-track{display:flex;width:max-content;animation:luxMarquee 60s linear infinite}
.lux-marq:hover .lux-marq-track{animation-play-state:paused}
.lux-marq span{display:inline-flex;align-items:center;gap:26px;padding:16px 13px;white-space:nowrap;font-family:var(--f-display);font-style:italic;font-size:21px;letter-spacing:.02em;color:rgba(244,238,225,.9)}
.lux-marq span::after{content:"✦";font-style:normal;font-size:12px;color:var(--gold-l)}

/* eyebrow: a gold rule draws in front of it */
.eyebrow{position:relative}
.view .eyebrow::before,.lux-cta .lux-eyebrow::before{content:"";display:inline-block;vertical-align:middle;width:30px;height:1px;margin-right:12px;background:currentColor;opacity:.8;transform-origin:0 50%}
html.lux .view .eyebrow.mo-rv::before{transform:scaleX(0);transition:transform 1.1s cubic-bezier(.6,0,.2,1) .25s}
html.lux .view .eyebrow.mo-in::before{transform:scaleX(1)}
.lux-cta .lux-eyebrow::before{display:none}

/* inner-page banners: the page heading becomes a navy band with gold particles and an engraved skyline */
.view .pagehead{position:relative;isolation:isolate;background:var(--navy);box-shadow:0 0 0 100vmax var(--navy);clip-path:inset(0 -100vmax);padding-block:62px 54px;margin-bottom:34px;color:#F4EEE1;overflow:visible}
.view .pagehead > :not(.lux-field):not(.lux-sky):not(.lux-ph-glow){position:relative;z-index:2}
.view .pagehead .eyebrow{color:var(--gold-l)}
.view .pagehead h1,.view .pagehead h2{color:#F7F1E4}
.view .pagehead .lede,.view .pagehead p:not(.eyebrow){color:rgba(244,238,225,.82)}
.view .pagehead a:not(.btn){color:var(--gold-l)}
.view .pagehead .tbc{color:var(--tbc-fg)}
.view .pagehead::after{content:"";position:absolute;left:50%;bottom:0;width:100vw;height:1px;transform:translateX(-50%);z-index:3;background:linear-gradient(90deg,rgba(201,169,110,0),rgba(201,169,110,.9) 30%,#F2DFB0 50%,rgba(201,169,110,.9) 70%,rgba(201,169,110,0));background-size:200% 100%;animation:luxShine 7s linear infinite}
.lux-ph-glow{position:absolute;top:0;left:50%;width:100vw;height:100%;transform:translateX(-50%);z-index:0;pointer-events:none;background:radial-gradient(700px 320px at 82% 40%,rgba(201,169,110,.16),rgba(201,169,110,0) 70%),radial-gradient(500px 260px at 8% 0%,rgba(87,108,170,.25),rgba(87,108,170,0) 70%)}
.lux-sky{position:absolute;right:max(-6vw,calc(560px - 50vw));bottom:0;width:min(640px,55vw);aspect-ratio:840/180;z-index:1;pointer-events:none;background:url(kv-city.webp) center bottom/100% auto no-repeat;filter:grayscale(1) invert(1) sepia(1) saturate(2.4) hue-rotate(-8deg) brightness(.9) contrast(1.5);mix-blend-mode:screen;opacity:.42;-webkit-mask-image:linear-gradient(90deg,transparent,#000 35%,#000 85%,transparent);mask-image:linear-gradient(90deg,transparent,#000 35%,#000 85%,transparent)}
@media (max-width:700px){.view .pagehead{padding-block:40px 92px}.view .pagehead .lux-sky{right:0;width:100%;opacity:.32}}
html.lux .view:not([hidden]) .pagehead > .eyebrow,html.lux .view:not([hidden]) .pagehead > h2,html.lux .view:not([hidden]) .pagehead > h1,html.lux .view:not([hidden]) .pagehead > .lede{animation:luxUp .9s cubic-bezier(.2,.7,.2,1) both}
html.lux .view:not([hidden]) .pagehead > h2,html.lux .view:not([hidden]) .pagehead > h1{animation-delay:.08s}
html.lux .view:not([hidden]) .pagehead > .lede{animation-delay:.16s}
.view .pagehead .mo-rv{opacity:1!important;transform:none!important}

/* closing band and footer: the same engraved skyline */
.lux-cta{isolation:isolate;overflow:visible}
.lux-cta > :not(.lux-field):not(.lux-sky){position:relative;z-index:2}
.lux-cta .lux-sky{right:auto;left:50%;transform:translateX(-50%);width:min(980px,100vw);opacity:.28}
.lux-cta > .lux-field,.lux-cta > .lux-field.mo-rv,.lux-cta > .lux-sky.mo-rv{transform:translateX(-50%)!important;transition:none!important}
.lux-cta > .lux-field.mo-rv{opacity:1!important}
.lux-cta > .lux-sky.mo-rv{opacity:.28!important}
footer.site{position:relative;overflow:hidden}
footer.site .lux-sky{position:relative;display:block;right:auto;left:auto;margin:-20px auto 26px;width:min(820px,100%);opacity:.42;-webkit-mask-image:linear-gradient(90deg,transparent,#000 25%,#000 75%,transparent);mask-image:linear-gradient(90deg,transparent,#000 25%,#000 75%,transparent)}

/* images: a print-like wipe as they come into view, slow zoom on hover */
html.lux .ph-card.mo-rv img,html.lux .about .pic.mo-rv img,html.lux .classes .class.mo-rv .cthumb{clip-path:inset(0 0 100% 0);transition:clip-path 1.2s cubic-bezier(.7,0,.2,1) .15s}
html.lux .ph-card.mo-in img,html.lux .about .pic.mo-in img,html.lux .classes .class.mo-in .cthumb{clip-path:inset(0 0 0 0)}
.ph-card{overflow:hidden}
@media (hover:hover){
  .ph-card img{transition:transform 1.4s cubic-bezier(.2,.7,.2,1),clip-path 1.2s cubic-bezier(.7,0,.2,1) .15s}
  .ph-card:hover img{transform:scale(1.045)}
  .ph-card:hover,.tile:hover,.spk:hover{box-shadow:0 22px 44px -26px rgba(15,26,51,.5),inset 0 0 0 1px var(--brass)}
  .ph-card figcaption strong{background-image:linear-gradient(var(--brass),var(--brass));background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .6s cubic-bezier(.2,.7,.2,1)}
  .ph-card:hover figcaption strong{background-size:100% 1px}
}

/* stats: a glint passes over the gold numerals once counted */
html.lux .stats strong{background-size:220% 100%;animation:luxShine 5.5s ease-in-out 1.5s infinite}

/* key dates: roman numerals glow in turn */
html.lux .dates li.mo-in .n{animation:luxGlint 3.2s ease-in-out infinite}
html.lux .dates li:nth-child(2) .n{animation-delay:.8s}
html.lux .dates li:nth-child(3) .n{animation-delay:1.6s}
html.lux .dates li:nth-child(4) .n{animation-delay:2.4s}

/* program: gold timeline, live "now" and "next" during the summit */
.sessions{position:relative;padding-left:30px}
.sessions::before{content:"";position:absolute;left:9px;top:10px;bottom:10px;width:1px;background:linear-gradient(180deg,var(--brass),rgba(168,132,62,.25))}
.sess{position:relative}
.sess::before{content:"";position:absolute;left:-26px;top:24px;width:9px;height:9px;transform:rotate(45deg);background:var(--bg);border:1px solid var(--brass);box-sizing:border-box}
.sess.break::before{width:5px;height:5px;left:-24px;top:26px;border-color:var(--line)}
.sess.lux-past{opacity:.5}
.sess.lux-now{background:linear-gradient(90deg,color-mix(in srgb,var(--brass) 10%,transparent),transparent 70%)}
.sess.lux-now::before{background:var(--brass);animation:luxLive 1.8s ease-out infinite}
.sess.lux-next::before{background:color-mix(in srgb,var(--brass) 35%,var(--bg))}
.lux-tag{display:inline-flex;align-items:center;gap:8px;justify-self:start;font-family:var(--f-body);font-weight:600;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--brass);border:1px solid var(--brass);padding:4px 10px;margin-bottom:4px}
.lux-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.sess.lux-now .lux-tag{background:var(--brass);color:#FFFDF7}
.sess.lux-now .lux-tag::before{animation:luxLive 1.8s ease-out infinite}
html.lux [role="tabpanel"]:not([hidden]) > .sess{animation:luxUp .6s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i,0) * 40ms)}

/* gold confetti after a successful registration or abstract */
.lux-burst{position:fixed;inset:0;pointer-events:none;z-index:95}

@media (prefers-reduced-motion:reduce){
  .lux-marq-track,.view .pagehead::after{animation:none!important}
  .lux-glow,.lux-burst{display:none!important}
}
@media print{.lux-sky,.lux-glow,.lux-prog,.lux-marq,.lux-burst{display:none!important}.view .pagehead{background:none;box-shadow:none;color:inherit}}
