/* Loader styles extracted from uploaded Emberhouse Header v11. */ /* Use licensed locally installed Gotham Bold when available; do not redistribute desktop font binaries. */ @font-face{font-family:EMGLoaderClock;src:local('Gotham Bold'),local('Gotham-Bold');font-style:normal;font-weight:700;font-display:swap;} @view-transition{navigation:none;} html.eh24-active.eh24-covered:not(.eh24-uncovering), html.eh24-active.eh24-covered:not(.eh24-uncovering) body, html.eh24-active.eh24-covered:not(.eh24-uncovering) .portable-header{background-color:var(--eh24-surface,#090D12)!important} /* Safari samples untransformed fixed surfaces for its browser tint. Keep these narrow edge strips separate from the panel so its exit reveals the page. */ #eh24-chrome-surface,#eh24-chrome-bottom{display:none;position:fixed;inset:0 0 auto;height:max(12px,env(safe-area-inset-top,0px));z-index:2147483646;background-color:var(--eh24-surface,#090D12);pointer-events:none} #eh24-chrome-bottom{inset:auto 0 0;height:max(12px,env(safe-area-inset-bottom,0px))} html.eh24-active.eh24-covered:not(.eh24-uncovering) :is(#eh24-chrome-surface,#eh24-chrome-bottom){display:block} html.eh24-enabled body{opacity:1!important;animation:none!important;} html.eh24-enabled body::before{content:none!important;animation:none!important;} #eh24-loader,#eh24-loader *{box-sizing:border-box;} #eh24-loader{position:fixed;inset:0;width:100%;height:100vh;height:100dvh;display:grid;place-items:center;z-index:2147483647;background:#090D12;color:#F3EFE6;overflow:hidden;font-family:Gotham,Arial,sans-serif;-webkit-font-smoothing:antialiased;transform:translate3d(0,102%,0);transition:transform 390ms cubic-bezier(.76,0,.2,1);will-change:transform;pointer-events:auto;} #eh24-loader.eh24-visible{transform:translate3d(0,0,0);} #eh24-loader.eh24-exit{transform:translate3d(0,-102%,0);transition:transform 950ms cubic-bezier(.76,.02,.2,1);} #eh24-loader .eh24-card{position:relative;width:min(1050px,86vw);height:min(620px,68dvh);min-height:280px;background:#C55C20;border-radius:15px;overflow:hidden;container-type:size;isolation:isolate;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto auto;gap:clamp(6px,1cqw,10px);padding:14px 4% 12px;} #eh24-loader .eh24-labels{display:flex;justify-content:space-between;gap:12px;font-size:clamp(8px,1.1cqw,12px);font-weight:800;letter-spacing:.10em;line-height:1.2;color:#121A25;} #eh24-loader .eh24-number{font-size:min(6cqw,11cqh);font-weight:800;line-height:1;letter-spacing:-.065em;font-variant-numeric:tabular-nums;white-space:nowrap;} #eh24-loader .eh24-clock{min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:EMGLoaderClock,'Arial Black',Arial,sans-serif;gap:clamp(4px,1.2cqh,10px);z-index:2;} #eh24-loader .eh24-clock-label,#eh24-loader .eh24-rolling{font-size:clamp(8px,1.1cqw,12px);letter-spacing:.12em;font-weight:700;line-height:1;} #eh24-loader .eh24-timecode{display:block;font-size:min(11.8cqw,20cqh);line-height:1;letter-spacing:-.055em;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;} /* FIXED-SLOT TIMECODE — maintains position and alignment at every frame. */ #eh24-loader .eh24-timecode, #eh24-loader .eh25-timecode, #eh24-loader .eh27-timecode, #eh24-loader .eh28-timecode{ font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1,"lnum" 1; font-kerning:none; letter-spacing:0; white-space:nowrap; } #eh24-loader .eh-tc-digit, #eh24-loader .eh-tc-separator{ display:inline-flex; align-items:baseline; justify-content:center; vertical-align:baseline; line-height:inherit; font:inherit; letter-spacing:0; text-align:center; } #eh24-loader .eh-tc-digit{width:.68em;font-feature-settings:"tnum" 1,"lnum" 1} #eh24-loader .eh-tc-separator{width:.32em} #eh24-loader .eh24-glitch{animation:eh24-digit-lock 360ms steps(1,end) both;} @keyframes eh24-digit-lock{0%,100%{opacity:1}16%{opacity:.68}33%{opacity:1}50%{opacity:.75}66%{opacity:1}83%{opacity:.8}} #eh24-loader .eh24-rec{display:inline-block;width:5px;height:5px;border-radius:50%;margin-right:6px;background:currentColor;vertical-align:middle;} #eh24-loader .eh24-track{height:clamp(28px,11cqh,68px);background:#121A2540;overflow:hidden;z-index:2;} #eh24-loader .eh24-fill{height:100%;width:100%;background:#F3EFE6;transform:scaleX(0);transform-origin:left center;} /* KINETIC TITLE — same original Impact typography throughout. Each animated mask carries a cropped rendering of the SAME full word. The mask, not the glyph font, moves; no font swap at the end. */ #eh24-loader .eh24-title-clip{position:relative;overflow:hidden;z-index:2;min-width:0;} #eh24-loader .eh24-title{ position:relative; display:block; width:max-content; max-width:none; font-family:Impact,'Arial Black',Arial,sans-serif; font-size:min(13.5cqw,23cqh); font-weight:900; line-height:.9; letter-spacing:-.055em; color:#F3EFE6; white-space:nowrap; transform-origin:0 50%; } #eh24-loader .eh24-title.eh24-kinetic-ready{color:transparent;} #eh24-loader .eh24-title .eh24-letter-mask{ position:absolute; top:0; display:block; height:100%; overflow:hidden; pointer-events:none; opacity:0; transform-origin:50% 82%; will-change:transform,opacity; } #eh24-loader .eh24-title .eh24-letter-ink{ position:absolute; top:0; display:block; width:max-content; /* Independent span elements must not inherit Squarespace typography. */ font-family:Impact,'Arial Black',Arial,sans-serif!important; font-size:inherit!important; font-weight:900!important; font-style:normal!important; letter-spacing:inherit!important; line-height:inherit!important; color:#F3EFE6; white-space:nowrap; pointer-events:none; } #eh24-loader.eh24-title-in:not(.eh24-resuming) .eh24-letter-mask{ animation:eh24-kinetic-letter 480ms cubic-bezier(.2,.85,.23,1) var(--delay,0ms) both; } @keyframes eh24-kinetic-letter{ 0%{opacity:0;transform:translate3d(0,125%,0) rotate(-9deg) skewX(-9deg) scaleY(1.2);} 43%{opacity:1;transform:translate3d(0,-15%,0) rotate(3deg) skewX(3deg) scaleY(.88);} 68%{opacity:1;transform:translate3d(0,5%,0) rotate(-2deg) skewX(-1deg) scaleY(1.06);} 85%{opacity:1;transform:translate3d(0,-2%,0) rotate(1deg) skewX(0deg) scaleY(.98);} 100%{opacity:1;transform:translate3d(0,0,0) rotate(0deg) skewX(0deg) scaleY(1);} } #eh24-loader.eh24-resuming .eh24-title{color:#F3EFE6;} #eh24-loader.eh24-resuming .eh24-letter-mask{display:none!important;} #eh24-loader .eh24-tagline{color:#121A25;font-size:clamp(7px,1.05cqw,12px);font-weight:800;line-height:1.3;letter-spacing:.07em;z-index:2;} #eh24-loader .eh24-art{position:absolute;inset:-25%;z-index:1;pointer-events:none;opacity:0;background:repeating-linear-gradient(130deg,transparent 0 22px,#121A2526 23px,transparent 25px);} #eh24-loader.eh24-motion .eh24-art{animation:eh24-texture 300ms steps(3,end) both;} @keyframes eh24-texture{0%{opacity:0;transform:translateX(-8%)}33%{opacity:.7}100%{opacity:.2;transform:translateX(5%)}} @media(max-width:767px){#eh24-loader .eh24-card{width:92vw;height:min(64dvh,560px);min-height:300px;}#eh24-loader .eh24-labels{font-size:8px;letter-spacing:.04em;}#eh24-loader .eh24-number{font-size:8cqw;}#eh24-loader .eh24-tagline{font-size:7px;letter-spacing:.025em;}} @media(max-width:767px) and (orientation:landscape){#eh24-loader .eh24-card{height:84dvh;min-height:230px;width:min(750px,88vw);padding:10px 4%;gap:6px;}#eh24-loader .eh24-number{font-size:5cqw;}#eh24-loader .eh24-timecode{font-size:min(11cqw,18cqh);}#eh24-loader .eh24-title{font-size:min(13cqw,18cqh);}} @media(prefers-reduced-motion:reduce){#eh24-loader{display:none!important;}#eh24-loader .eh24-glitch,#eh24-loader .eh24-art{animation:none!important;}#eh24-loader .eh24-title{transition:none;transform:none;}} #eh24-loader .eh24-counter-row{display:flex;align-items:center;justify-content:space-between;gap:12px;} #eh24-loader .eh24-film-note{font-size:clamp(8px,1.1cqw,12px);font-weight:700;letter-spacing:.09em;color:#121A25;white-space:nowrap;} #eh24-loader .eh24-film-cue{display:inline-block;min-width:19ch;text-align:left;} #eh24-loader .eh24-slate-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,2.5cqw,28px);color:#121A25;} #eh24-loader .eh24-slate-fields>div{display:flex;flex-direction:column;gap:4px;border-left:1px solid #121A2550;padding-left:clamp(7px,1cqw,12px);} #eh24-loader .eh24-slate-fields span{font-size:clamp(7px,1cqw,11px);font-weight:700;letter-spacing:.1em;line-height:1;} #eh24-loader .eh24-slate-fields strong{font-family:'Courier New',monospace;font-size:clamp(12px,2.3cqw,24px);font-weight:700;line-height:1;white-space:nowrap;font-variant-numeric:tabular-nums;} #eh24-loader .eh24-labels{align-items:center;} #eh24-loader .eh24-labels .eh24-number{font-size:clamp(18px,3.5cqw,38px);font-family:'Courier New',monospace;letter-spacing:-.05em;line-height:1;color:#F3EFE6;} #eh24-loader .eh24-bar-group{display:flex;flex-direction:column;gap:6px;z-index:2;} #eh24-loader .eh24-rate{font-size:min(6.6cqw,9cqh);font-weight:900;letter-spacing:-.06em;line-height:1;} #eh24-loader .eh24-rate .eh24-rate-unit{font-size:.55em;letter-spacing:-.025em;} @media(max-width:767px) and (orientation:portrait){#eh24-loader .eh24-card{min-height:340px;}} #eh24-loader .eh24-rate{font-variant-numeric:tabular-nums;white-space:nowrap;} /* EMBERHOUSE TOP-DOWN, DUAL-PHASE SCANLINE TEAR v12. Navy begins first; the orange slate follows downward. Persistent canvas + CSS polygon; no asynchronous per-frame mask URLs. */ #eh24-loader.eh24-shredding { transform:translate3d(0,0,0)!important; transition:none!important; background:transparent!important; } #eh24-loader.eh24-shredding::before {display:none!important;} #eh24-loader.eh24-shredding .eh24-card { position:relative; z-index:3; will-change:clip-path; } #eh24-loader .eh24-navy-surface, #eh24-loader .eh24-navy-trails, #eh24-loader .eh24-shred-trails { position:absolute; pointer-events:none; } #eh24-loader .eh24-navy-surface {inset:0;z-index:0;display:block;} #eh24-loader .eh24-navy-trails {z-index:1;} #eh24-loader .eh24-shred-trails {z-index:4;} #eh24-loader.eh24-canvas-shred .eh24-card { -webkit-mask-image:none!important; mask-image:none!important; } @media(prefers-reduced-motion:reduce) { #eh24-loader.eh24-shredding {display:none!important;} } /* Editorial Title Sequence alternate — randomly selected for internal page transitions. Classic orange/navy two-stage scanline tear remains intact. */ #eh24-loader .eh25-editorial{display:none} #eh24-loader.eh24-editorial{background:#F3EFE6;color:#121A25;font-family:Arial,Helvetica,sans-serif} #eh24-loader.eh24-editorial .eh24-card{display:none} #eh24-loader.eh24-editorial .eh25-editorial{ position:absolute;inset:0;display:grid;grid-template-rows:auto 1px auto minmax(0,1fr) auto; align-content:stretch;row-gap:clamp(9px,1.4dvh,17px); padding:clamp(22px,5dvh,60px) clamp(22px,5.2vw,88px) clamp(24px,4.8dvh,58px); width:100%;height:100%;overflow:hidden;background:#F3EFE6; } #eh24-loader .eh25-head{display:flex;justify-content:space-between;gap:16px;font-size:clamp(9px,1vw,13px);letter-spacing:.14em;font-weight:700} #eh24-loader .eh25-rule{height:1px;background:#121A2533} #eh24-loader .eh25-accent{width:26%;height:clamp(4px,.5vw,7px);background:#C55C20;transform:scaleX(1);transform-origin:left} #eh24-loader .eh25-hero{align-self:center;min-height:0;font-size:clamp(64px,12.3vw,198px);letter-spacing:-.095em;line-height:.81;font-weight:900} #eh24-loader .eh25-first,#eh24-loader .eh25-second{display:block} #eh24-loader .eh25-second{margin-left:9%;color:#C55C20} #eh24-loader .eh25-bottom{display:flex;flex-direction:column;gap:clamp(10px,2.3dvh,25px)} #eh24-loader .eh25-copy{display:flex;justify-content:space-between;align-items:end;gap:12px} #eh24-loader .eh25-copy p{margin:0;font:italic clamp(18px,2.4vw,31px)/1.16 Georgia,'Times New Roman',serif;letter-spacing:-.03em} #eh24-loader .eh25-copy>span{font-size:clamp(9px,.95vw,12px);font-weight:700;letter-spacing:.13em;line-height:1.55;text-align:right} #eh24-loader .eh25-metrics{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:clamp(12px,3vw,45px);align-items:end} #eh24-loader .eh25-metrics>div{min-width:0} #eh24-loader .eh25-metrics small{display:block;font-size:clamp(8px,.85vw,11px);letter-spacing:.12em;font-weight:750;color:#716a60;margin-bottom:8px} #eh24-loader .eh25-metrics strong{display:block;font-size:clamp(17px,2.5vw,29px);line-height:1.1;font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums} #eh24-loader .eh25-rate{color:#C55C20} #eh24-loader .eh25-rate em{font-style:normal;font-size:.48em;color:#716a60} #eh24-loader .eh25-track{height:clamp(14px,2.2dvh,22px);width:100%;overflow:hidden;background:#D4CBBD;border-radius:100px} #eh24-loader .eh25-fill{width:0;height:100%;background:linear-gradient(90deg,#A74522,#C55C20,#E58A47);border-radius:100px;will-change:width} #eh24-loader .eh25-foot{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:clamp(9px,.95vw,12px);letter-spacing:.11em;font-weight:700;color:#676157} #eh24-loader .eh25-percent{color:#C55C20;font-size:clamp(16px,1.7vw,22px);font-variant-numeric:tabular-nums} /* Two simultaneous animations eliminate the brief stop at the ease-out: the cinematic entrance animates 'transform' while an independent, linear 'translate' moves the same words continuously from the very first frame. Because they animate DIFFERENT CSS properties, the ongoing drift never slows to zero even when the entrance eases out. Both tracks resume from the same saved elapsed offset across navigation and through the exit lift. */ #eh24-loader.eh24-editorial .eh25-first{ animation: eh25-left-enter 1.9s cubic-bezier(.19,.8,.17,1) var(--eh25-title-delay,0ms) both, eh25-left-drift 20s linear var(--eh25-title-delay,0ms) both; } #eh24-loader.eh24-editorial .eh25-second{ animation: eh25-right-enter 1.9s cubic-bezier(.19,.8,.17,1) var(--eh25-title-delay,0ms) both, eh25-right-drift 20s linear var(--eh25-title-delay,0ms) both; } #eh24-loader.eh25-playing .eh25-accent{animation:eh25-accent 2.4s ease both} @keyframes eh25-left-enter{ from{opacity:0;transform:translateX(-45%)} to{opacity:1;transform:translateX(0)} } @keyframes eh25-right-enter{ from{opacity:0;transform:translateX(45%)} to{opacity:1;transform:translateX(0)} } @keyframes eh25-left-drift{ from{translate:0 0} to{translate:20% 0} } @keyframes eh25-right-drift{ from{translate:0 0} to{translate:-20% 0} } @keyframes eh25-accent{from{transform:scaleX(0)}to{transform:scaleX(1)}} /* Move the entire editorial slate upward to reveal the finished page. The former clip-path changed from 'none' to 'inset', which snaps instead of interpolating on some browsers, causing an abrupt cut. */ #eh24-loader.eh24-editorial.eh25-revealing{ transform:translate3d(0,-102%,0)!important; transition:transform 950ms cubic-bezier(.76,.02,.2,1)!important; } @media(max-width:767px){ #eh24-loader.eh24-editorial .eh25-editorial{padding:5dvh 6vw 6dvh;row-gap:12px} #eh24-loader .eh25-head{font-size:8px;letter-spacing:.04em} #eh24-loader .eh25-hero{font-size:clamp(56px,16vw,112px)} #eh24-loader .eh25-copy p{font-size:clamp(17px,4.6vw,25px)} #eh24-loader .eh25-copy>span{font-size:9px} #eh24-loader .eh25-metrics{gap:8px} #eh24-loader .eh25-metrics strong{font-size:clamp(14px,3.5vw,19px)} #eh24-loader .eh25-metrics small{font-size:7px;letter-spacing:.035em} #eh24-loader .eh25-bottom{gap:clamp(10px,2dvh,18px)} } @media(max-height:570px){ #eh24-loader.eh24-editorial .eh25-editorial{padding-top:16px;padding-bottom:15px;row-gap:6px} #eh24-loader .eh25-hero{font-size:clamp(45px,10dvh,110px)} #eh24-loader .eh25-bottom{gap:7px} #eh24-loader .eh25-copy p{font-size:16px} #eh24-loader .eh25-copy>span{font-size:8px} #eh24-loader .eh25-metrics small{margin-bottom:3px} #eh24-loader .eh25-metrics strong{font-size:15px} #eh24-loader .eh25-track{height:12px} } @media(prefers-reduced-motion:reduce){ #eh24-loader.eh24-editorial .eh25-first,#eh24-loader.eh24-editorial .eh25-second{animation:none} } /* ── ARCHITECTURAL LOADER / LIGHT & SPACE ───────────────────────────── Approved third loading design: warm-paper Gotham editorial, three light-filled architectural studies, and a top copper beam that never stops moving — including during the 100% hold and upward page reveal. Only fonts already licensed and installed on the visitor's device are used. */ @font-face{font-family:EMGArchGotham;src:local('Gotham Book'),local('Gotham-Book'),local('Gotham');font-style:normal;font-weight:400;font-display:swap} @font-face{font-family:EMGArchGotham;src:local('Gotham Medium'),local('Gotham-Medium');font-style:normal;font-weight:500;font-display:swap} @font-face{font-family:EMGArchGotham;src:local('Gotham Bold'),local('Gotham-Bold');font-style:normal;font-weight:700;font-display:swap} @font-face{font-family:EMGArchGotham;src:local('Gotham Black'),local('Gotham-Black'),local('Gotham Ultra');font-style:normal;font-weight:900;font-display:swap} #eh24-loader .eh27-architecture{display:none} #eh24-loader.eh27-arch-mode{background:#F3EFE6;color:#121A25;font-family:EMGArchGotham,'Avenir Next',Arial,sans-serif} #eh24-loader.eh27-arch-mode .eh24-card{display:none} #eh24-loader.eh27-arch-mode .eh27-architecture{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:hidden;background:#F3EFE6;color:#121A25;isolation:isolate;container-type:inline-size} #eh24-loader .eh27-paper{position:absolute;inset:0;pointer-events:none;opacity:.35;background:repeating-linear-gradient(0deg,#38251107 0,transparent 2px,transparent 5px)} #eh24-loader .eh27-top{position:absolute;left:6%;right:6%;top:6%;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:clamp(9px,1.16cqw,14px);font-weight:700;letter-spacing:.13em;line-height:1.25} #eh24-loader .eh27-upper-rail{position:absolute;left:6%;right:6%;top:13%;height:3px;background:#121A2524;overflow:hidden} #eh24-loader .eh27-beam{position:absolute;top:0;bottom:0;width:24%;left:-24%;background:linear-gradient(90deg,transparent 0%,#C55C20 27%,#E58A42 70%,transparent 100%);box-shadow:0 0 9px #C55C2040;animation:eh27-beam 2.45s linear var(--eh27-offset,0ms) infinite;will-change:left} @keyframes eh27-beam{from{left:-24%}to{left:100%}} #eh24-loader .eh27-headline{position:absolute;z-index:4;left:6%;top:23%;font-size:clamp(54px,8cqw,150px);letter-spacing:-.075em;line-height:.86;font-weight:900} #eh24-loader .eh27-headline span{display:block;white-space:nowrap;will-change:transform,translate; animation:eh27-title-enter 1.65s cubic-bezier(.19,.82,.2,1) var(--eh27-offset,0ms) both, eh27-title-drift 35s linear var(--eh27-offset,0ms) both} #eh24-loader .eh27-headline span:nth-child(2){animation-delay:calc(var(--eh27-offset,0ms) + 90ms),var(--eh27-offset,0ms)} #eh24-loader .eh27-headline span:nth-child(3){animation-delay:calc(var(--eh27-offset,0ms) + 170ms),var(--eh27-offset,0ms)} #eh24-loader .eh27-headline .eh27-copper{color:#C55C20} @keyframes eh27-title-enter{from{opacity:0;transform:translateY(48%)}to{opacity:1;transform:translateY(0)}} @keyframes eh27-title-drift{from{translate:0 0}to{translate:9% 0}} #eh24-loader .eh27-intro{position:absolute;left:6.2%;top:65%;font-size:clamp(9px,1.35cqw,15px);letter-spacing:.12em;line-height:1.6;color:#72685E;font-weight:500} #eh24-loader .eh27-intro:before{content:"";display:block;height:2px;width:43px;background:#C55C20;margin-bottom:10px} #eh24-loader .eh27-triptych{position:absolute;left:51%;right:6%;top:20%;height:49%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(5px,1.2cqw,15px)} /* Keep all three light studies continuously painted. A clip-path animation on their filtered/blended descendants intermittently flashed during the 24 FPS hold. Move an opaque paper curtain instead; no clipped GPU layer. */ #eh24-loader .eh27-window{position:relative;min-width:0;overflow:hidden;background:#0C1620; box-shadow:0 0 22px #0001;isolation:isolate} #eh24-loader .eh27-window::after{ content:"";position:absolute;inset:-1px;z-index:8;pointer-events:none; background:#F3EFE6;transform:translate3d(0,0,0); animation:eh27-window-cover 1.6s cubic-bezier(.17,.82,.2,1) var(--eh27-offset,0ms) both; will-change:transform; } #eh24-loader .eh27-window:nth-child(2)::after{animation-delay:calc(var(--eh27-offset,0ms) + 150ms)} #eh24-loader .eh27-window:nth-child(3)::after{animation-delay:calc(var(--eh27-offset,0ms) + 280ms)} @keyframes eh27-window-cover{ from{transform:translate3d(0,0,0)} to{transform:translate3d(0,-102%,0)} } #eh24-loader .eh27-back{position:absolute;inset:0;background:linear-gradient(125deg,#0A111A,#22303B 62%,#6A3725)} #eh24-loader .eh27-wall{position:absolute;left:-23%;top:-13%;width:77%;height:119%;background:linear-gradient(100deg,#0B141C,#27333E);transform:skewY(-25deg);box-shadow:10px 0 23px #03080DAE} #eh24-loader .eh27-wall-b{position:absolute;right:-29%;top:-18%;width:58%;height:126%;background:linear-gradient(96deg,#673E2B,#111B26 60%);transform:skewY(24deg)} #eh24-loader .eh27-light{position:absolute;left:30%;top:-27%;width:90%;height:150%;transform:rotate(25deg); background:linear-gradient(90deg,transparent,#BD4C260C 18%,#FFC18CAB 39%,#F28A426B 51%,transparent 80%); mix-blend-mode:screen;filter:blur(3px);opacity:.76;animation:eh27-light 8s ease-in-out var(--eh27-offset,0ms) infinite alternate} @keyframes eh27-light{from{translate:-12% 0;opacity:.45}to{translate:15% 0;opacity:1}} #eh24-loader .eh27-floor{position:absolute;top:67%;bottom:0;left:0;right:0;background:linear-gradient(173deg,#BE744270,#26303B 47%,#090E16)} #eh24-loader .eh27-glow{position:absolute;left:-45%;top:62%;width:170%;height:40%;border-radius:50%;background:radial-gradient(ellipse,#F8BD7D90,transparent 65%);filter:blur(9px);transform:rotate(-14deg)} #eh24-loader .eh27-edge{position:absolute;top:0;bottom:0;left:49%;width:1px;background:#FFCD9273;box-shadow:0 0 12px 3px #C55C2063} #eh24-loader .eh27-window:nth-child(2) .eh27-wall{left:23%;width:56%;transform:skewY(25deg)} #eh24-loader .eh27-window:nth-child(2) .eh27-light{left:-18%;transform:rotate(-24deg)} #eh24-loader .eh27-window:nth-child(2) .eh27-glow{left:4%;transform:rotate(17deg)} #eh24-loader .eh27-window:nth-child(3) .eh27-wall{left:-38%;width:91%;transform:skewY(32deg)} #eh24-loader .eh27-window:nth-child(3) .eh27-wall-b{right:-14%;width:81%;background:linear-gradient(95deg,#172634,#090E16)} #eh24-loader .eh27-window:nth-child(3) .eh27-light{left:53%;transform:rotate(37deg)} #eh24-loader .eh27-window:nth-child(3) .eh27-glow{left:-70%} #eh24-loader .eh27-trip-rule{position:absolute;left:51%;right:6%;top:70%;height:2px;background:#C55C20} #eh24-loader .eh27-hud{position:absolute;left:6%;right:6%;bottom:5%} #eh24-loader .eh27-metrics{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:end;gap:clamp(7px,3cqw,36px);margin-bottom:clamp(10px,1.7cqw,19px)} #eh24-loader .eh27-metrics small{display:block;font-size:clamp(8px,1.16cqw,12px);letter-spacing:.12em;font-weight:700;color:#71685E;margin-bottom:6px} #eh24-loader .eh27-metrics strong{display:block;font-size:clamp(15px,2.65cqw,31px);line-height:1;font-weight:900;white-space:nowrap;font-variant-numeric:tabular-nums} #eh24-loader .eh27-metrics .eh27-rate{color:#C55C20} #eh24-loader .eh27-metrics em{font-size:.5em;font-style:normal;color:#71685E} #eh24-loader .eh27-track{height:clamp(13px,2.1cqw,21px);border-radius:999px;background:#D6CABB;overflow:hidden} #eh24-loader .eh27-fill{height:100%;width:0;background:linear-gradient(90deg,#A34522,#C55C20,#EA9D61);border-radius:999px;will-change:width} #eh24-loader .eh27-hudfoot{display:flex;justify-content:space-between;align-items:center;margin-top:8px;gap:10px;font-size:clamp(9px,1.25cqw,12px);letter-spacing:.12em;font-weight:700;color:#70665B} #eh24-loader .eh27-percent{font-size:clamp(15px,2.05cqw,23px);color:#C55C20;letter-spacing:0;font-variant-numeric:tabular-nums} #eh24-loader.eh27-arch-mode.eh27-revealing{transform:translate3d(0,-102%,0)!important;transition:transform 950ms cubic-bezier(.76,.02,.2,1)!important} @media(max-width:767px){ #eh24-loader .eh27-top{font-size:8px;letter-spacing:.035em} #eh24-loader .eh27-headline{top:16%;left:6%;font-size:clamp(43px,9.2vw,73px)} #eh24-loader .eh27-triptych{left:7%;right:7%;top:40%;height:29%;gap:7px} #eh24-loader .eh27-trip-rule{left:7%;right:7%;top:70%} #eh24-loader .eh27-intro{display:none} #eh24-loader .eh27-hud{bottom:5%} #eh24-loader .eh27-metrics{gap:6px} #eh24-loader .eh27-metrics small{font-size:7px;letter-spacing:.025em} #eh24-loader .eh27-metrics strong{font-size:clamp(12px,3.2vw,19px)} } @media(max-width:767px) and (orientation:landscape){ #eh24-loader .eh27-headline{top:17%;font-size:clamp(32px,7.5vw,66px)} #eh24-loader .eh27-triptych{top:21%;left:53%;right:6%;height:50%;gap:6px} #eh24-loader .eh27-trip-rule{top:72%;left:53%;right:6%} #eh24-loader .eh27-hud{bottom:3%} #eh24-loader .eh27-metrics small{margin-bottom:2px} #eh24-loader .eh27-metrics{margin-bottom:6px} #eh24-loader .eh27-intro{display:none} } @media(max-height:540px) and (min-width:768px){ #eh24-loader .eh27-headline{top:20%;font-size:clamp(35px,7.5vh,96px)} #eh24-loader .eh27-triptych{top:20%;height:48%} #eh24-loader .eh27-intro{display:none} #eh24-loader .eh27-hud{bottom:3%} #eh24-loader .eh27-metrics{margin-bottom:6px} #eh24-loader .eh27-metrics small{margin-bottom:3px} } @media(prefers-reduced-motion:reduce){ #eh24-loader .eh27-beam,#eh24-loader .eh27-headline span,#eh24-loader .eh27-window::after,#eh24-loader .eh27-light{animation:none!important} #eh24-loader .eh27-window::after{transform:translate3d(0,-102%,0)!important} } /* EMBERHOUSE / CAMERA STUDY / eh28-wipe left-to-right white DJI reveal */ #eh24-loader .eh28-camera-study{display:none} #eh24-loader.eh28-camera-mode{background:#07131D;color:#F3EFE6} #eh24-loader.eh28-camera-mode .eh24-card{display:none} #eh24-loader.eh28-camera-mode .eh28-camera-study{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:hidden;background:#07131D;isolation:isolate; font-family:EMGLoaderClock,Gotham,'Avenir Next',Arial,sans-serif;color:#F3EFE6} #eh24-loader .eh28-art{position:absolute;inset:0;overflow:hidden} #eh24-loader .eh28-art img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;object-position:center} /* Show the clean 20/55 lens print from the first frame, independent of the left-to-right full-camera wipe. The SVG mask uses the original 1672x941 artwork coordinates and cover-aligned positioning from the approved preview. */ #eh24-loader .eh28-markings{ z-index:1; -webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221672%22%20height%3D%22941%22%20viewBox%3D%220%200%201672%20941%22%3E%3Cdefs%3E%3Cfilter%20id%3D%22blur%22%3E%3CfeGaussianBlur%20stdDeviation%3D%222.2%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cg%20fill%3D%22white%22%20filter%3D%22url(%23blur)%22%3E%3Cellipse%20cx%3D%221150%22%20cy%3D%22430%22%20rx%3D%2235%22%20ry%3D%2221%22%2F%3E%3Cellipse%20cx%3D%221150%22%20cy%3D%22479%22%20rx%3D%2235%22%20ry%3D%2221%22%2F%3E%3Cellipse%20cx%3D%221192%22%20cy%3D%22491%22%20rx%3D%2227%22%20ry%3D%2214%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221672%22%20height%3D%22941%22%20viewBox%3D%220%200%201672%20941%22%3E%3Cdefs%3E%3Cfilter%20id%3D%22blur%22%3E%3CfeGaussianBlur%20stdDeviation%3D%222.2%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cg%20fill%3D%22white%22%20filter%3D%22url(%23blur)%22%3E%3Cellipse%20cx%3D%221150%22%20cy%3D%22430%22%20rx%3D%2235%22%20ry%3D%2221%22%2F%3E%3Cellipse%20cx%3D%221150%22%20cy%3D%22479%22%20rx%3D%2235%22%20ry%3D%2221%22%2F%3E%3Cellipse%20cx%3D%221192%22%20cy%3D%22491%22%20rx%3D%2227%22%20ry%3D%2214%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); -webkit-mask-size:contain;mask-size:contain; -webkit-mask-position:center;mask-position:center; -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat; } #eh24-loader .eh28-complete{z-index:2;clip-path:inset(0 100% 0 0);will-change:clip-path} #eh24-loader .eh28-scanedge{position:absolute;top:0;bottom:0;left:0;width:2px;z-index:3;opacity:0;pointer-events:none;background:linear-gradient(180deg,transparent,#F6D3A7 14%,#E8A16F 45%,#F6D3A7 85%,transparent);box-shadow:0 0 10px 2px #E37E4773;will-change:left,opacity} #eh24-loader .eh28-head{position:absolute;z-index:5;left:5%;top:3%;display:flex;gap:12px;align-items:center;font-size:clamp(9px,.9vw,14px);letter-spacing:.17em;font-weight:700;color:#F3EFE6;text-shadow:0 1px 8px #001} #eh24-loader .eh28-head i{display:block;width:4px;height:22px;background:#C55C20} #eh24-loader .eh28-hud{position:absolute;z-index:5;left:0;right:0;bottom:0;padding:clamp(12px,2.2%,24px) 5% clamp(13px,2.5%,26px);background:linear-gradient(0deg,#07131D 0%,#07131DE8 75%,transparent)} #eh24-loader .eh28-metrics{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:clamp(12px,3vw,48px);align-items:end;margin-bottom:13px} #eh24-loader .eh28-metrics small{display:block;color:#CBB989;font-size:clamp(8px,.95vw,12px);letter-spacing:.13em;margin-bottom:5px} #eh24-loader .eh28-metrics strong{font-size:clamp(14px,2.3vw,28px);white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:800} #eh24-loader .eh28-rate{color:#EA9D00} #eh24-loader .eh28-rate em{font-size:.52em;font-style:normal;color:#CBB989} #eh24-loader .eh28-track{height:clamp(12px,1.65vw,19px);border-radius:99px;background:#3A4B55;overflow:hidden} #eh24-loader .eh28-fill{width:0;height:100%;background:linear-gradient(90deg,#A84926,#C55C20,#EA9D00);border-radius:99px;will-change:width} #eh24-loader .eh28-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:7px;color:#CBB989;font-size:clamp(9px,.88vw,12px);font-weight:700;letter-spacing:.11em} #eh24-loader .eh28-percent{color:#EA9D00;font-size:clamp(16px,1.5vw,21px);letter-spacing:0;font-variant-numeric:tabular-nums} #eh24-loader.eh28-camera-mode.eh28-revealing{transform:translate3d(0,-102%,0)!important;transition:transform 950ms cubic-bezier(.76,.02,.2,1)!important} @media(max-width:650px){ #eh24-loader .eh28-art img{object-fit:contain;object-position:center} #eh24-loader .eh28-head{font-size:8px} #eh24-loader .eh28-hud{padding:10px 5% 12px} #eh24-loader .eh28-metrics small{font-size:7px;letter-spacing:.02em} #eh24-loader .eh28-metrics strong{font-size:clamp(11px,2.8vw,17px)} #eh24-loader .eh28-metrics{gap:5px;margin-bottom:8px} #eh24-loader .eh28-footer{font-size:8px} } /* Incoming documents already start at 100%. Never animate them into view. */ #eh24-loader.eh24-resuming:not(.eh24-exit):not(.eh25-revealing):not(.eh27-revealing):not(.eh28-revealing){transform:translate3d(0,0,0)!important;transition:none!important;} /* Paint the completed camera behind its image layers during arrival decoding. */ #eh24-loader.eh28-camera-mode.eh24-resuming .eh28-art{background:#07131D url("../img/camera-study-traced-white-dji.jpg") center/contain no-repeat;} /* Full-bleed mobile transitions. Backgrounds cover Safari's extended viewport; inset only the artwork and type so they clear the notch and home indicator. */ #eh24-loader{padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)} #eh24-loader.eh24-editorial .eh25-editorial, #eh24-loader.eh27-arch-mode .eh27-architecture, #eh24-loader.eh28-camera-mode .eh28-camera-study{ inset:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px); width:auto;height:auto; } @media(max-width:900px){ #eh24-loader:not(.eh24-editorial):not(.eh27-arch-mode):not(.eh28-camera-mode){background:#C55C20} #eh24-loader .eh24-card{width:100%;height:100%;min-height:0;border-radius:0} }