/* Joy's Box V17 — hero-as-entrance, quieter editorial rhythm, image-led WebGL close */
:root{--v17-gold:#c9ab59;--v17-cream:#f2eee5;--v17-ink:#070706}

/* No loading screen. The first frame is already the hero. */
body.is-loading{overflow:hidden}
.hero-v11{background:#080706}
.hero-v11__media>img{transition:filter 1.15s cubic-bezier(.2,.75,.2,1),transform 1.55s cubic-bezier(.16,1,.3,1),opacity .45s ease;filter:blur(10px) saturate(.82);transform:scale(1.085)}
body.is-ready .hero-v11__media>img{filter:blur(0) saturate(.92);transform:scale(1.02)}
.hero-v15__webgl{z-index:0;opacity:0;transition:opacity .35s ease}
.hero-v11__media.is-webgl-ready .hero-v15__webgl{opacity:1}
.hero-v11__media.is-webgl-ready>img{opacity:0}
.hero-v15__beam{display:none!important}
.hero-v11__veil{z-index:1;background:linear-gradient(90deg,rgba(4,3,3,.77) 0%,rgba(4,3,3,.35) 38%,rgba(4,3,3,.08) 70%,rgba(4,3,3,.24) 100%),linear-gradient(180deg,rgba(0,0,0,.18),transparent 30%,transparent 60%,rgba(0,0,0,.72))}
.hero-v11__frame{z-index:2;border-color:rgba(255,255,255,.13)}
.hero-v11__topline,.hero-v11__copy{z-index:4;transition:opacity .9s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1),filter .9s ease}
body.is-loading .hero-v11__topline{opacity:0;transform:translateY(-8px);filter:blur(5px)}
body.is-loading .hero-v11__copy{opacity:0;transform:translateY(24px);filter:blur(6px)}
body.is-ready .hero-v11__topline,body.is-ready .hero-v11__copy{opacity:1;transform:none;filter:none}
.hero-v11__copy{transition-delay:.12s}.hero-v11__topline{transition-delay:.25s}

/* Make the remaining company facts feel like one quiet editorial line instead of boxed stats. */
.intro .stat-strip{margin-top:92px;border-top:1px solid rgba(18,18,16,.18);grid-template-columns:repeat(4,1fr);gap:0}
.intro .stat{min-height:112px;padding:22px 28px 8px 0;border-right:0;position:relative}
.intro .stat:not(:last-child)::after{content:"";position:absolute;right:12%;top:25px;width:1px;height:46px;background:rgba(18,18,16,.12)}
.intro .stat strong{font-size:clamp(42px,4.7vw,76px);font-weight:500;letter-spacing:-.045em}
.intro .stat span{margin-top:9px;display:block;font-size:7.5px;color:#777269}

/* The disliked 2022 → TODAY rail is gone entirely. */
.facts-rail{display:none!important}
.clients{padding-bottom:clamp(90px,9vw,150px)}

/* Footer: a calm image-led closing scene. The image itself is rendered through Three.js. */
.closing-v17{position:relative;min-height:90svh;overflow:hidden;isolation:isolate;background:#070706;color:#f4f0e8;padding:clamp(20px,2.8vw,42px) clamp(18px,4.1vw,70px) clamp(18px,2vw,30px);display:flex;flex-direction:column}
.closing-v17__media{position:absolute;z-index:0;inset:0;overflow:hidden;background:#17140f}
.closing-v17__media>img{width:100%;height:100%;object-fit:cover;object-position:center 54%;filter:saturate(.72) contrast(1.02);transform:scale(1.035)}
.closing-v17__media canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity .6s ease}
.closing-v17__media.is-webgl-ready canvas{opacity:1}.closing-v17__media.is-webgl-ready>img{opacity:0}
.closing-v17__shade{position:absolute;z-index:2;inset:0;background:linear-gradient(90deg,rgba(5,5,4,.91) 0%,rgba(5,5,4,.76) 34%,rgba(5,5,4,.35) 64%,rgba(5,5,4,.48) 100%),linear-gradient(180deg,rgba(5,5,4,.26),rgba(5,5,4,.06) 44%,rgba(5,5,4,.72) 100%)}
.closing-v17::after{content:"";position:absolute;z-index:2;inset:12px;border:1px solid rgba(255,255,255,.095);pointer-events:none}
.closing-v17__bar{position:relative;z-index:3;display:flex;align-items:flex-start;justify-content:space-between;gap:28px;padding-bottom:19px;border-bottom:1px solid rgba(255,255,255,.14);font:700 6.5px/1 var(--sans);letter-spacing:.15em;color:rgba(255,255,255,.58)}
.closing-v17__logo{width:72px;display:block}.closing-v17__logo img{display:block;width:100%;height:auto}
.closing-v17__bar>span{padding-top:7px;text-align:right}
.closing-v17__content{position:relative;z-index:3;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;flex:1;min-height:61svh;padding:8vh 0 7vh;max-width:min(1050px,88vw)}
.closing-v17__eyebrow{margin:0 0 22px;font:700 7px/1 var(--sans);letter-spacing:.19em;color:rgba(255,255,255,.56)}
.closing-v17__content h2{margin:0;font:500 clamp(68px,10.4vw,168px)/.73 var(--cond);letter-spacing:-.049em;text-transform:uppercase;color:#f1ede4}
.closing-v17__content h2 i{font:400 .93em/.77 var(--serif);letter-spacing:-.04em;text-transform:none;color:#e1c77e}
.closing-v17__mail{margin-top:clamp(34px,5vh,62px);width:min(650px,68vw);display:flex;align-items:center;justify-content:space-between;gap:25px;padding:16px 0;border-top:1px solid rgba(255,255,255,.25);border-bottom:1px solid rgba(255,255,255,.25);font:500 clamp(24px,2.9vw,46px)/1 var(--cond);letter-spacing:-.01em}
.closing-v17__mail b{font:300 clamp(20px,2vw,32px)/1 var(--sans);color:#dfc477;transition:transform .35s cubic-bezier(.16,1,.3,1)}.closing-v17__mail:hover b{transform:translate(5px,-5px)}
.footer-v17{position:relative;z-index:3;padding-top:18px;border-top:1px solid rgba(255,255,255,.13);display:grid;grid-template-columns:1fr auto;gap:17px 36px;align-items:start}
.footer-v17 nav,.footer-v17__right{display:flex;flex-wrap:wrap;gap:20px;font:700 7px/1 var(--sans);letter-spacing:.13em;text-transform:uppercase;color:#aaa59c}.footer-v17__right{justify-content:flex-end;color:#ddd7cc}
.footer-v17 a{transition:color .25s ease,opacity .25s ease}.footer-v17 a:hover{color:#ead38e}
.footer-v17__meta{grid-column:1/-1;display:flex;justify-content:space-between;gap:20px;padding-top:14px;border-top:1px solid rgba(255,255,255,.07);font:700 6px/1.3 var(--sans);letter-spacing:.14em;color:#716d65}

@media(max-width:900px){
  .intro .stat-strip{grid-template-columns:repeat(2,1fr);margin-top:58px}.intro .stat{min-height:100px}.intro .stat:nth-child(2)::after{display:none}.intro .stat:nth-child(-n+2){border-bottom:1px solid rgba(18,18,16,.1)}
  .closing-v17{min-height:86svh;padding:18px}.closing-v17::after{inset:8px}.closing-v17__bar>span{max-width:180px;font-size:5.8px;line-height:1.35}.closing-v17__logo{width:62px}.closing-v17__content{min-height:58svh;max-width:100%;padding:8vh 0 5vh}.closing-v17__content h2{font-size:clamp(64px,17.5vw,112px);line-height:.75}.closing-v17__mail{width:100%;font-size:clamp(26px,6.8vw,40px)}.footer-v17{grid-template-columns:1fr}.footer-v17__right{justify-content:flex-start}.footer-v17__meta span:last-child{display:none}
}
@media(max-width:600px){
  .hero-v11__topline span:last-child{display:none}.intro .stat strong{font-size:13vw}.intro .stat:not(:last-child)::after{right:8%}
  .closing-v17__shade{background:linear-gradient(180deg,rgba(5,5,4,.52),rgba(5,5,4,.5) 35%,rgba(5,5,4,.9) 100%),linear-gradient(90deg,rgba(5,5,4,.68),rgba(5,5,4,.18))}.closing-v17__content{justify-content:flex-end}.closing-v17__content h2{font-size:17vw}.footer-v17 nav{gap:15px 18px}
}
@media(prefers-reduced-motion:reduce){.hero-v11__topline,.hero-v11__copy,.hero-v11__media>img{transition:none!important}.closing-v17__media canvas{display:none}}
