/* The O becomes an aperture, then returns as a recurring compositional mark. */
.entrance.aperture-mode{transition:none;background:var(--ink);pointer-events:none}.entrance.aperture-mode .entrance-photos{transition:opacity .5s;opacity:0}.entrance.aperture-mode .entrance-shade{background:transparent}.entrance.aperture-mode .entrance-brand,.entrance.aperture-mode .entrance-top,.entrance.aperture-mode .entrance-bottom{transition:opacity .45s;opacity:0}.aperture-veil{position:absolute;inset:0;z-index:4;pointer-events:none}.aperture-ring{position:absolute;z-index:5;box-sizing:border-box;border-radius:50%;border-style:solid;border-color:var(--sun);pointer-events:none;will-change:transform}
.section-orbit{position:absolute;pointer-events:none;z-index:0;border-radius:50%;border:clamp(30px,5vw,85px) solid var(--sun);width:clamp(150px,24vw,390px);aspect-ratio:1;transform:translateY(25px);opacity:0;transition:transform 1.3s cubic-bezier(.2,.7,.25,1),opacity .8s}.orbit-visible .section-orbit{transform:translateY(0);opacity:1}.intro{padding-right:clamp(70px,10vw,180px)}.intro .section-orbit{width:150px;border-width:42px;right:-55px;bottom:-40px}.work .section-orbit{width:130px;border-width:36px;top:55px;right:-48px}.studio .section-orbit{width:440px;border-width:110px;top:-180px;right:-180px;opacity:0}.studio.orbit-visible .section-orbit{opacity:.8}.studio>h2,.studio>.eyebrow,.studio-copy,.people{position:relative;z-index:1}.services .section-orbit{width:180px;border-width:48px;top:55px;right:-70px}.contact{padding-right:27vw;min-height:560px}.contact .section-orbit{border-color:var(--ink);width:60vw;border-width:16vw;right:-39vw;top:50%;transform:translateY(-45%);opacity:1}.contact.orbit-visible .section-orbit{transform:translateY(-50%)}.contact>h2,.contact>.eyebrow,.contact-line{position:relative;z-index:1}.contact-line{align-items:start;flex-direction:column}.contact h2{font-size:clamp(55px,8vw,130px)}
@media(max-width:650px){.intro{padding-right:var(--gutter)}.intro .section-orbit{width:100px;border-width:28px;right:-50px;bottom:-28px}.work .section-orbit{width:80px;border-width:23px;top:22px;right:-43px}.studio .section-orbit{width:240px;border-width:65px;right:-150px;top:-100px}.services .section-orbit{width:95px;border-width:27px;right:-55px;top:22px}.contact{padding-right:var(--gutter);padding-bottom:160px;min-height:0}.contact .section-orbit{width:300px;border-width:80px;right:-130px;top:auto;bottom:-210px}.contact.orbit-visible .section-orbit{transform:translateY(0)}.contact h2{font-size:58px}}
@media(prefers-reduced-motion:reduce){.section-orbit{transition:none;transform:none;opacity:1}}
/* Intro identity: 80% of the previous size at each breakpoint. */
.entrance-brand svg{width:min(60.8vw,840px)}
.gallery-transition{position:fixed;inset:0;z-index:90;pointer-events:none;display:grid;place-items:center;background:#00000012;backdrop-filter:blur(2px)}.gallery-transition svg{width:92px;height:92px;overflow:visible}
@media(max-width:520px){.entrance-brand svg{width:70.4vw}}
/* First encounter: O falls into the missing letter, then settles. */
.entrance.o-arriving .vector-o{animation:oArrival 1.65s linear both;transform-origin:50% 100%;transform-box:fill-box}
@keyframes oArrival{
  0%,12%{transform:translate(80px,-120vh) scale(.94,1.06);opacity:0;animation-timing-function:cubic-bezier(.48,.03,.8,.45)}
  18%{opacity:1}
  62%{transform:translate(0,0) scale(1);opacity:1;animation-timing-function:ease-out}
  68%{transform:translate(0,0) scale(1.13,.83);animation-timing-function:cubic-bezier(.15,.7,.25,1)}
  81%{transform:translate(0,-42px) scale(.98,1.02);animation-timing-function:cubic-bezier(.6,0,.9,.5)}
  92%{transform:translate(0,0) scale(1.045,.955);animation-timing-function:ease-out}
  100%{transform:translate(0,0) scale(1);opacity:1}
}
@media(prefers-reduced-motion:reduce){.entrance.o-arriving .vector-o{animation:none;opacity:1;transform:none}}
/* Earlier first frame change, long crossfades, and a crisp vector enter cue. */
.entrance-photo{transition:opacity 2s ease-in-out}
.entrance-invite:after{content:none;display:none}
.entrance-brand .entry-arrow{width:28px;height:28px;flex:none;filter:none;transform:none}
.entrance-est{font-size:11px;letter-spacing:.12em;white-space:nowrap}
@media(max-width:520px){.entrance-brand .entry-arrow{width:24px;height:24px}.entrance-est{font-size:10px}}
/* A single vector arrow family across navigation, links and photo controls. */
.site-arrow{display:inline-block;width:1.15em;height:1.15em;min-width:1.15em;vertical-align:-.18em;overflow:visible;flex-shrink:0}
#works-dropdown b{display:flex;align-items:center}.dialog-actions .site-arrow{width:20px;height:20px}.zoom-mark .site-arrow{width:22px;height:22px}
