:root{color-scheme:dark;--paper:#e1e3e6;--muted:#a7aab0}*{box-sizing:border-box}html,body{margin:0;min-width:320px;background:#0b0c0e}body{font-family:Arial,Helvetica,sans-serif;color:var(--paper);-webkit-font-smoothing:antialiased}button{font:inherit;border:0;background:transparent;color:#a7acb5;cursor:pointer;transition:color .2s;padding:8px 0}button:hover{color:#fff}button:focus-visible{outline:1px solid #cdd1d8;outline-offset:7px}
.experience{min-height:100svh;position:relative;isolation:isolate;overflow:hidden;background:#0b0c0e;display:flex;flex-direction:column}.architecture{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}.cinema{position:absolute;inset:0;transform:scale(1.015);transform-origin:50% 46%;background:#0b0d10}.photograph{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center 48%;filter:brightness(.58) saturate(0)}
/* Identical image layers share one download. Broad light masks reveal the
   render's existing surface detail without affecting the original SVG logo. */
.light-pass,.afterlight{position:absolute;inset:0;background:url('architecture.webp') center 48%/cover no-repeat;filter:saturate(0);pointer-events:none}.light-pass{opacity:0;mask-image:linear-gradient(107deg,transparent 28%,#0009 40%,#000 49%,#0009 58%,transparent 72%);mask-size:280% 100%;mask-position:110% 0}.afterlight{opacity:.12;mask-image:linear-gradient(105deg,#000 0%,transparent 29%,transparent 70%,#000 100%);animation:afterlight 28s ease-in-out infinite alternate}.darkness{position:absolute;inset:0;background:#08090b;opacity:0}.atmosphere{position:absolute;inset:0;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath d='M0 0h180v180H0z' fill='%23fff' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}.vignette{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 38%,#08090b22 14%,transparent 40%,#08090b66 100%),linear-gradient(0deg,#08090be8 0%,transparent 30%,transparent 83%,#08090b88 100%)}
.edition{position:absolute;top:43px;left:48px;display:flex;align-items:center;gap:16px;font-size:9px;text-transform:uppercase;letter-spacing:.24em;color:#aeb1b7;animation:edition 3s both}.edition-line{width:26px;height:1px;background:#8f949d}main{flex:1;min-height:680px;display:flex;align-items:center;justify-content:center;padding:120px 28px 90px}.identity{width:100%;text-align:center;transform:translateY(-12px)}.logo{display:block;width:clamp(420px,46vw,690px);max-width:100%;height:auto;margin:0 auto;filter:none}.announcement{opacity:1}.separator{width:1px;height:28px;margin:36px auto 26px;background:linear-gradient(transparent,#9b9fa877,transparent)}h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(32px,3.3vw,48px);font-weight:400;line-height:1.2;letter-spacing:-.025em;margin:0 0 18px;color:#e0e1e3}.promise{font-size:11px;letter-spacing:.13em;line-height:1.8;margin:0 auto;color:#c1c3c8}.mission{font-family:Georgia,'Times New Roman',serif;font-size:13px;letter-spacing:.025em;color:#999da5;margin:30px 0 0;line-height:1.6}footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:30px;padding:0 48px 37px;min-height:65px}.colophon{display:flex;align-items:center;gap:12px;font-family:Georgia,'Times New Roman',serif;font-size:12px;color:#a2a5ad;letter-spacing:.02em}.small-line{width:22px;height:1px;background:#616670}.copyright{font-size:8px;letter-spacing:.17em;color:#8d929b;margin:0;text-transform:uppercase;white-space:nowrap}.controls{display:flex;align-items:center;gap:20px;justify-self:end}.controls button{display:flex;align-items:center;gap:9px;font-size:9px;letter-spacing:.055em;white-space:nowrap}.controls svg{height:15px;width:15px;fill:none;stroke:currentColor;stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}#motion{padding:8px;position:relative}#motion:before{content:"";position:absolute;left:-8px;height:12px;width:1px;background:#62677255}.play-icon{display:none}body.paused .play-icon{display:block}body.paused .pause-icon{display:none}.skip{position:absolute;right:48px;top:33px;font-size:9px;letter-spacing:.06em;color:#a2a6af;align-items:center;gap:15px;display:none}.skip span{font-size:15px}
.js body:not(.playing):not(.settled) .identity,.js body:not(.playing):not(.settled) footer{opacity:0}.js body:not(.playing):not(.settled) .darkness{opacity:.985}
body.playing .cinema{animation:camera-in 8.2s cubic-bezier(.18,.55,.3,1) both}body.playing .darkness{animation:darkness 8.2s both}body.playing .light-pass{animation:light-pass 8.2s cubic-bezier(.25,.1,.3,1) both}body.playing .identity{animation:identity-in 8.2s both}body.playing .announcement{animation:copy-in 8.2s both}body.playing footer{animation:footer-in 8.2s both}body.playing .skip{display:flex;animation:skip-out 8.2s both}body.paused .afterlight,body.offscreen .afterlight{animation-play-state:paused}body.reduced .controls,body.reduced .skip{display:none}body.reduced .afterlight{animation:none;opacity:.12}
@keyframes camera-in{from{transform:scale(1.065)}to{transform:scale(1.015)}}@keyframes darkness{0%,15%{opacity:.985}32%{opacity:.85}58%{opacity:.26}85%,100%{opacity:0}}@keyframes light-pass{0%,21%{opacity:0;mask-position:110% 0}31%{opacity:.45}48%{opacity:.85}64%{opacity:.45}83%,100%{opacity:0;mask-position:-10% 0}}@keyframes afterlight{0%{opacity:.07}50%{opacity:.15}100%{opacity:.09}}@keyframes identity-in{0%,61%{opacity:0}88%,100%{opacity:1}}@keyframes copy-in{0%,78%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}@keyframes footer-in{0%,86%{opacity:0}100%{opacity:1}}@keyframes edition{from{opacity:0}to{opacity:1}}@keyframes skip-out{0%,80%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
@media(min-width:1800px){.logo{width:740px}main{padding-bottom:110px}.separator{margin-top:44px}}@media(max-width:700px){.edition{left:25px;top:29px;font-size:7px;letter-spacing:.16em;gap:10px}.edition-line{width:16px}.skip{top:60px;right:25px;font-size:8px;gap:8px}main{min-height:620px;padding:130px 26px 90px}.identity{transform:translateY(-2px)}.logo{width:min(86vw,490px);max-width:none;position:relative;left:50%;transform:translateX(-50%);margin:0}.separator{height:25px;margin:34px auto 23px}h1{font-size:37px;margin-bottom:20px}.promise{font-size:10px;letter-spacing:.07em;max-width:270px}.mission{font-size:12px;margin-top:28px}footer{padding:0 25px 27px;grid-template-columns:1fr auto;gap:22px 12px}.copyright{grid-row:2;grid-column:1/-1;justify-self:center;font-size:7px}.colophon{font-size:10px;gap:8px}.small-line{width:12px}.controls{gap:12px}.controls button{font-size:8px}.controls svg{width:13px;height:13px}#motion:before{left:-5px}.photograph{filter:brightness(.52) saturate(0);object-position:center}.light-pass,.afterlight{background-image:url('architecture-portrait.webp');background-position:center}.vignette{background:radial-gradient(ellipse at 50% 38%,#08090b11 12%,transparent 40%,#08090b99 100%),linear-gradient(0deg,#08090bef 0%,transparent 32%,transparent 86%,#08090b88 100%)}}
@media(max-height:740px) and (min-width:701px){main{min-height:580px;padding-top:100px;padding-bottom:65px}.logo{width:min(500px,43vw)}.separator{margin:25px auto 19px;height:22px}h1{font-size:36px}.mission{margin-top:22px}footer{padding-bottom:25px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.identity,.announcement,footer{opacity:1!important;transform:none!important}.logo{transform:none;position:static;margin:0 auto;max-width:100%}.darkness{opacity:0!important}.light-pass{display:none}.skip,.controls{display:none!important}.afterlight{opacity:.12}}
@supports not (mask-image:linear-gradient(#000,transparent)){.light-pass,.afterlight{display:none}}

/* Surgical additions to the untouched Version 2 styles.
   Retain the original logo/title coordinates after deleting the slogan. */
.announcement{padding-bottom:50.8px}
@media(max-width:700px){.announcement{padding-bottom:47.2px}}
@media(max-height:740px) and (min-width:701px){.announcement{padding-bottom:42.8px}}
/* A separate wrapper avoids replacing the original camera transform or lighting.
   Shared image contains both buildings; the 0.3% retreat keeps them coherent. */
.architectural-depth{position:absolute;inset:0;transform-origin:50% 82%}
body.playing .architectural-depth{animation:depth-retreat 8.2s cubic-bezier(.18,.55,.3,1) both}
@keyframes depth-retreat{0%,18%{transform:scale(1.003)}100%{transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.architectural-depth{animation:none!important;transform:none!important}}

/* Optical centering within the approved architectural composition. */
.identity{position:relative;left:clamp(-18px,-1.25vw,-5px)}