/* ==========================================================================
   Jael Chen — Komma-reference redesign
   Layout, type and motion values are ported 1:1 from kommakomma.is;
   only the content and imagery differ.
   ========================================================================== */

@font-face{font-family:"BDO Grotesk";src:url(assets/fonts/BDOGrotesk-Light.woff2) format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"BDO Grotesk";src:url(assets/fonts/BDOGrotesk-Regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"BDO Grotesk";src:url(assets/fonts/BDOGrotesk-Medium.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"BDO Grotesk";src:url(assets/fonts/BDOGrotesk-DemiBold.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"BDO Grotesk";src:url(assets/fonts/BDOGrotesk-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{
  --font-sans:"BDO Grotesk",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;
  --color-onyx:#131313;
  --color-carbon-black:#1f1f1f;
  --color-graphite:#363636;
  --color-alabaster-grey:#eaeaea;
  --color-strawberry:#eb4b3d;
  --ease-osmo:cubic-bezier(.625,.05,0,1);
  --menu-width:30em;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;border:0 solid}
html{-webkit-text-size-adjust:100%;scrollbar-width:none}
html::-webkit-scrollbar{display:none}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{
  font-family:var(--font-sans);font-size:14px;line-height:1.35;
  color:var(--color-onyx);background:var(--color-alabaster-grey);
  overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
body[data-menu-status=open],body[data-menu-status=closing]{background:var(--color-alabaster-grey)}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;cursor:pointer}
h1,h2,h3{font-weight:400}

/* ---------- Static grain ---------- */
.static-noise{
  z-index:300;pointer-events:none;opacity:.03;position:fixed;inset:-2.5rem;
  background-image:url(assets/noise.png);background-repeat:repeat;background-size:18rem;
  will-change:background-position;animation:.18s step-end infinite static-noise-shift;transform:translate(0) scale(1.03);
}
.static-noise::before{content:"";position:absolute;inset:0;background-image:inherit;background-repeat:inherit;background-position:41px -17px;background-size:23rem;animation:.26s step-end infinite static-noise-countershift}
@keyframes static-noise-shift{0%{background-position:0 0}20%{background-position:-23px 41px}40%{background-position:37px -19px}60%{background-position:-11px -33px}80%{background-position:29px 17px}100%{background-position:0 0}}
@keyframes static-noise-countershift{0%{background-position:41px -17px}25%{background-position:-19px 23px}50%{background-position:31px 37px}75%{background-position:-37px -29px}100%{background-position:41px -17px}}

/* ---------- Loader ---------- */
.loader{position:fixed;inset:0;z-index:150;display:none;background:transparent;pointer-events:none}
.loader__panel{position:absolute;inset:0;overflow:visible}
.loader__panel-fill,.loader__panel-bottom{background:var(--color-alabaster-grey)}
.loader__panel-fill{position:absolute;inset:0}
.loader__panel-bottom{position:absolute;top:calc(100% - .6rem);left:-10%;width:120%;height:20vw;min-height:8rem;transform-origin:top;border-radius:0 0 50% 50%/0 0 100% 100%}
.loader__container{position:relative;z-index:1;display:flex;width:100%;height:100%;align-items:center;justify-content:center}
.loader__logo{--loader-slot-height:clamp(8rem,13vw,15rem);--loader-slot-gap:clamp(1.6rem,7vw,7rem);--loader-mask-extra:clamp(1.25rem,6vw,6rem);display:flex;align-items:center;justify-content:center;gap:clamp(.2rem,.5vw,.6rem)}
.loader__logo-column{height:calc(var(--loader-slot-height) + var(--loader-mask-extra));overflow:hidden}
.loader__logo-dot{width:0;margin-left:calc(-1 * clamp(.2rem,.5vw,.6rem))}
.loader__logo-dot .loader__logo-cell{width:auto;padding:0 .05em 0 0}
.loader__logo-track{display:flex;flex-direction:column;gap:var(--loader-slot-gap);will-change:transform;transform:translateZ(0);backface-visibility:hidden}
.loader[data-load-state=booting] .loader__container{opacity:0}
.loader[data-load-state=booting] .loader__logo-track{transform:translate3d(0,calc(var(--loader-slot-height) + var(--loader-slot-gap)),0)}
.loader__logo-cell{display:flex;height:var(--loader-slot-height);width:100%;align-items:center;justify-content:center;flex:0 0 var(--loader-slot-height);font-weight:700;font-size:var(--loader-slot-height);line-height:1;color:var(--color-onyx);letter-spacing:-.04em}

/* ---------- Header / underlay nav ---------- */
.underlay-nav__header{z-index:100;color:var(--color-alabaster-grey);position:fixed;inset:0 0 auto;transition:color .2s ease;will-change:transform}
.underlay-nav[data-section-theme=active] .underlay-nav__header,
.underlay-nav[data-footer-theme=active] .underlay-nav__header,
body[data-menu-status=open] .underlay-nav__header,
body[data-menu-status=closing] .underlay-nav__header{color:var(--color-onyx)}
.underlay-nav__container{position:relative;display:flex;justify-content:space-between;align-items:center;padding:32px}
.underlay-nav__actions{display:flex;align-items:center;gap:clamp(1.5rem,3vw,2.75rem)}
.underlay-nav__cta-header.button-043{font-size:.95rem;transition:opacity .3s ease}
body[data-menu-status=open] .underlay-nav__cta-header,body[data-menu-status=closing] .underlay-nav__cta-header{opacity:0;pointer-events:none}
.underlay-nav__logo{display:flex;align-items:center;margin:-.75em;padding:.75em;color:inherit}
.underlay-nav__logo-mark{display:block;font-size:clamp(1.9rem,2.2vw,2.3rem);font-weight:700;line-height:.8;letter-spacing:-.06em;transition:color .2s ease}
.underlay-nav__toggle{display:flex;justify-content:center;align-items:center;margin:-1em;padding:1em;outline:none}
.underlay-nav__toggle-icon{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.375em;width:1.5em}
.underlay-nav__toggle-bar{background:currentColor;flex:none;width:100%;height:.125em}

.header-progressive-blur{--blur-reveal:1;z-index:50;pointer-events:none;isolation:isolate;contain:paint;width:100%;height:15em;position:fixed;top:0;left:0}
.header-progressive-blur__layer{position:absolute;inset:0}
.header-progressive-blur__layer.is--1{backdrop-filter:blur(calc(.09375em*var(--blur-reveal)));-webkit-backdrop-filter:blur(calc(.09375em*var(--blur-reveal)));mask:linear-gradient(#0000 12.5%,#000 25% 37.5%,#0000 50%);-webkit-mask:linear-gradient(#0000 12.5%,#000 25% 37.5%,#0000 50%)}
.header-progressive-blur__layer.is--2{backdrop-filter:blur(calc(.1875em*var(--blur-reveal)));-webkit-backdrop-filter:blur(calc(.1875em*var(--blur-reveal)));mask:linear-gradient(#0000 0%,#000 12.5% 25%,#0000 37.5%);-webkit-mask:linear-gradient(#0000 0%,#000 12.5% 25%,#0000 37.5%)}
.header-progressive-blur__layer.is--3{backdrop-filter:blur(calc(.375em*var(--blur-reveal)));-webkit-backdrop-filter:blur(calc(.375em*var(--blur-reveal)));mask:linear-gradient(#000 0% 12.5%,#0000 25%);-webkit-mask:linear-gradient(#000 0% 12.5%,#0000 25%)}
.header-progressive-blur__layer.is--4{backdrop-filter:blur(calc(.75em*var(--blur-reveal)));-webkit-backdrop-filter:blur(calc(.75em*var(--blur-reveal)));mask:linear-gradient(#000 0% 8%,#0000 18%);-webkit-mask:linear-gradient(#000 0% 8%,#0000 18%)}
.header-progressive-blur__layer.is--5{backdrop-filter:blur(calc(1.5em*var(--blur-reveal)));-webkit-backdrop-filter:blur(calc(1.5em*var(--blur-reveal)));mask:linear-gradient(#000 0% 12%,#0000 24%);-webkit-mask:linear-gradient(#000 0% 12%,#0000 24%)}

.underlay-nav__menu{z-index:1;width:var(--menu-width);color:var(--color-onyx);background:var(--color-alabaster-grey);position:fixed;top:0;bottom:0;right:0}
.underlay-nav__overlay{z-index:100;pointer-events:none;cursor:pointer;visibility:hidden;position:fixed;inset:0 -1px 0 0;overflow:clip}
.underlay-nav__inner{display:flex;flex-direction:column;gap:2em;width:100%;height:100%;padding:7.5em 2em 2em;overflow-x:hidden;overflow-y:auto}
.underlay-nav__list{display:flex;flex-direction:column;width:100%;list-style:none}
.underlay-nav__list.is--small{gap:.75em}
.underlay-nav__link-large{border-radius:.125em;width:100%;padding:.75em 1em;display:block}
.underlay-nav__link-large.w--current{color:#ededed;background:var(--color-strawberry)}
.underlay-nav__link-label{letter-spacing:-.04em;font-size:clamp(1.9rem,2.2vw,3rem);line-height:1.08}
.underlay-nav__bottom{display:flex;justify-content:flex-start;align-items:flex-start;width:100%;margin-top:auto;padding-top:1.5em;position:relative}
.underlay-nav__bottom-col{display:flex;flex-direction:column;flex:1;gap:1em;align-items:flex-start}
.underlay-nav__link-small{font-size:1em;line-height:1.1}
.underlay-nav__hover-link{position:relative;display:block;height:1.1em;overflow:hidden}
.underlay-nav__hover-label{display:block;line-height:inherit;white-space:nowrap}
.underlay-nav__hover-label[data-underlay-hover-next]{position:absolute;top:100%;left:0}
.underlay-nav__link-small.is--faded{opacity:.5}
.underlay-nav__bottom-border{opacity:.15;transform-origin:0%;background:currentColor;width:100%;height:1px;position:absolute;inset:0 0 auto}
.underlay-nav__dark{opacity:0;background:#0000004d;position:absolute;inset:0}
.underlay-nav__borders{display:flex;flex-direction:column;justify-content:space-between;position:absolute;inset:0}
.underlay-nav__border{background:var(--color-alabaster-grey);width:100%;height:1em}
.underlay-nav__border-row{display:flex;flex-direction:column;align-items:flex-end}
.underlay-nav__corner{transform-origin:100% 0;width:.625em;height:.625em;background-image:radial-gradient(circle farthest-side at 0 100%,#fff0 99%,var(--color-alabaster-grey))}
.underlay-nav__corner.is--bottom{transform-origin:100% 100%;background-image:radial-gradient(circle farthest-side at 0 0,#fff0 99%,var(--color-alabaster-grey))}

/* ---------- Button 043 (Osmo) ---------- */
.button-043{
  --button-043-color:var(--color-alabaster-grey);--button-043-color-background:var(--color-onyx);
  --button-043-hover-color-background:var(--color-strawberry);--button-043-icon-color:var(--color-onyx);
  --button-043-icon-color-background:var(--color-alabaster-grey);--button-043-color-focus:var(--color-strawberry);
  --button-043-padding:.6875em .6875em .6875em .9375em;--button-043-border-radius:.25em;--button-043-icon-border-radius:.125em;
  --button-043-text-duplicate-distance:1.5em;--button-043-focus-inset:-.125em;
  --button-043-ease-hover:var(--ease-osmo);--button-043-ease-focus:cubic-bezier(.32,.72,0,1);
  user-select:none;color:var(--button-043-color);background:#0000;outline:none;padding:0;font-size:14px;font-weight:500;line-height:1;
  text-transform:uppercase;display:inline-grid;position:relative;-webkit-tap-highlight-color:transparent;
}
.button-043::after{content:"";display:block;position:absolute;inset:var(--button-043-focus-inset);border-radius:var(--button-043-border-radius);transition:box-shadow .2s var(--button-043-ease-focus);pointer-events:none;z-index:1}
.button-043:focus-visible::after{box-shadow:0 0 0 .125em var(--button-043-color-focus)}
.button-043__bg{background:var(--button-043-color-background);border-radius:var(--button-043-border-radius);grid-area:1/1;display:flex;justify-content:center;align-items:center;width:100%;height:100%;position:relative;overflow:clip}
.button-043__bg-hover{background:var(--button-043-hover-color-background);width:120%;height:100%;position:absolute;bottom:0;left:-10%;transition:transform .525s var(--button-043-ease-hover);transform:translate3d(0,175%,0) rotate(15deg)}
.button-043__inner{display:flex;column-gap:.5em;row-gap:.5em;width:100%;height:100%;padding:var(--button-043-padding);grid-area:1/1;justify-content:center;align-items:center}
.button-043__mask{clip-path:inset(-10% 0);flex:none;display:flex;justify-content:center;align-items:center}
.button-043__text{transition:transform .525s var(--button-043-ease-hover);text-shadow:0 var(--button-043-text-duplicate-distance) currentColor}
.button-043__icon-wrap{width:1.125em;height:1.125em;color:var(--button-043-icon-color);border-radius:var(--button-043-icon-border-radius);flex:none;display:grid;position:relative;transform:translateY(-.08em)}
.button-043__icon-bg{background:var(--button-043-icon-color-background);border-radius:var(--button-043-icon-border-radius);grid-area:1/1;width:100%;height:100%;transition:transform .525s var(--button-043-ease-hover)}
.button-043__icon-mask{grid-area:1/1;display:flex;justify-content:flex-end;width:100%;height:100%;position:relative;overflow:clip}
.button-043__icon-list{display:flex;flex-flow:row;grid-area:1/1;position:absolute}
.button-043__icon{flex:none;width:1.125em;height:1.125em;padding:.2em;transition:transform .525s var(--button-043-ease-hover)}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .button-043:is(:hover,:focus-visible) .button-043__bg-hover{transform:translateZ(0) rotate(0)}
  .button-043:is(:hover,:focus-visible) .button-043__text{transform:translateY(calc(-1*var(--button-043-text-duplicate-distance)))}
  .button-043:is(:hover,:focus-visible) .button-043__icon-bg{transform:rotate(90deg)}
  .button-043:is(:hover,:focus-visible) .button-043__icon{transform:translate3d(200%,0,0)}
}

/* ---------- Hero (fixed, page scrolls over it) ---------- */
[data-main]{position:relative;z-index:2} /* no will-change here: it would turn the fixed hero into a scrolling one */
.page{position:relative;background:var(--color-alabaster-grey)}
.home-hero{--hero-edge:clamp(1rem,2vw,2rem);position:fixed;top:0;left:0;z-index:0;width:100vw;height:100svh;overflow:clip;background:var(--color-onyx);color:#fff;isolation:isolate;opacity:0;transition:background-color .15s ease}
.home-hero::after{content:"";position:absolute;inset:0;z-index:5;background:var(--color-alabaster-grey);opacity:0;pointer-events:none;transition:opacity .15s ease}
.home-hero[data-hero-paint=alabaster]{background:var(--color-alabaster-grey)}
.home-hero[data-hero-paint=alabaster]::after{opacity:1}
.home-hero[data-hero-paint=alabaster] :is(.home-hero__media,.home-hero__shade,.home-hero__featured,.home-hero__statement,.home-hero__slideshow-nav){opacity:0;visibility:hidden}
.home-hero__media,.home-hero__shade{position:absolute;inset:0}
.home-hero__media{z-index:0;overflow:hidden}
.home-hero__image-stack{position:absolute;top:0;left:0;width:100%;height:112%;transform:translateZ(0);will-change:transform}
.home-hero__slides{position:absolute;inset:0;overflow:hidden}
.home-hero__slide{position:absolute;inset:0;opacity:0;overflow:hidden;will-change:transform}
.home-hero__slide.is--current{opacity:1}
.home-hero__slide-inner{position:absolute;inset:0;will-change:transform}
.home-hero__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1);will-change:transform,opacity}
.home-hero__image--hover{opacity:0;visibility:hidden;transform:scale(1.085)}
.home-hero__shade{z-index:1;pointer-events:none;background:linear-gradient(180deg,rgb(0 0 0/.22),transparent 34%,rgb(0 0 0/.28)),#0000001f}
.home-hero__featured,.home-hero__statement,.home-hero__slideshow-nav{position:absolute;z-index:2}
.home-hero__featured{top:50%;left:var(--hero-edge);right:var(--hero-edge);display:flex;align-items:center;justify-content:space-between;gap:1rem;transform:translateY(-50%);font-size:14px;font-weight:500;line-height:1;text-transform:uppercase}
.home-hero__featured>*{white-space:nowrap}
.home-hero__stack{display:inline-grid;overflow:hidden;line-height:1;padding-top:.4em;margin-top:-.4em}
.home-hero__stack-item{grid-area:1/1;display:block;white-space:nowrap;visibility:hidden}
.home-hero__stack-item.is--current{visibility:visible}
.home-hero__stack-word{display:inline-block;padding-top:.25em;padding-bottom:.25em;margin-top:-.25em;margin-bottom:-.25em}
.home-hero__reveal-line{display:block}
.home-hero__statement{bottom:var(--hero-edge);left:var(--hero-edge);max-width:min(43rem,calc(100vw - var(--hero-edge)*2));font-size:clamp(1.35rem,min(2vw,3.8vh),2.65rem);font-weight:400;line-height:1.08;text-wrap:balance}
.home-hero__slideshow-nav{right:var(--hero-edge);bottom:var(--hero-edge);display:flex;flex-direction:column;align-items:flex-end;gap:.75rem}
.home-hero__dots{display:flex;align-items:center;gap:.5rem}
.home-hero__dot{width:7px;height:7px;border-radius:999px;background:color-mix(in srgb,var(--color-alabaster-grey) 30%,transparent);transition:background-color .45s var(--ease-osmo)}
.home-hero__dot:focus-visible{outline:2px solid var(--color-strawberry);outline-offset:3px}
.home-hero__dot.is--current{background:var(--color-alabaster-grey)}
.home-hero__progress{width:clamp(7rem,12vw,12rem);height:2px;border-radius:999px;background:color-mix(in srgb,var(--color-alabaster-grey) 25%,transparent);overflow:hidden}
.home-hero__progress-fill{display:block;width:100%;height:100%;border-radius:inherit;background:var(--color-alabaster-grey);transform:scaleX(0);transform-origin:0 50%;will-change:transform}
.page__flow{pointer-events:none;position:relative;z-index:20}
.home-hero__spacer{pointer-events:none;height:100vh;height:100svh}
.page__surface{pointer-events:auto;background:var(--color-alabaster-grey);color:var(--color-onyx)}

@media (max-width:700px){
  .home-hero__featured{top:47%;right:auto;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:.65rem}
  .home-hero__featured-label,.home-hero__stack--year{display:none}
  .home-hero__stack--name{position:relative;top:.25rem}
  .home-hero__work-button .button-043__bg{display:none}
  .home-hero__work-button .button-043__inner{justify-content:flex-start;padding:3px 0}
  .home-hero__work-button.button-043{font-size:inherit}
  .home-hero__statement{bottom:calc(var(--hero-edge) + 2.75rem);max-width:min(22rem,calc(100vw - var(--hero-edge)*2));font-size:clamp(1.35rem,6vw,2.05rem)}
  .home-hero__slideshow-nav{left:var(--hero-edge);right:var(--hero-edge);align-items:stretch;gap:.6rem}
  .home-hero__progress{width:100%}
  .home-hero__dot{width:8px;height:8px}
}
@media (max-height:720px){.home-hero__statement{font-size:clamp(1.15rem,3.4vh,1.75rem)}}

/* ---------- Intro ---------- */
.intro{overflow:hidden}
.intro__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:1.5rem;max-width:100rem;margin-inline:auto;min-height:70vh;padding:12.5rem 1.5rem 4rem}
.intro__quote-col{grid-column:7/span 6}
.intro-quote{font-size:clamp(3rem,4vw,4.25rem);line-height:1}
.intro-quote__line{display:block;white-space:nowrap}
.word-swap{vertical-align:bottom;text-align:center;display:inline-grid;grid-template-rows:1em 1em;grid-template-columns:max-content;grid-auto-rows:100%;justify-items:center;margin-bottom:-.01em;padding-bottom:.01em;line-height:1;overflow:clip}
.word-swap.is--left{text-align:left;justify-items:start}
.word-swap .old-word,.word-swap .new-word{grid-area:1/1}
.word-swap .old-word{transform:translateY(100%)}
.word-swap .new-word{transform:translateY(202%)}
.intro__copy-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:1.5rem;row-gap:1.25rem;align-content:start;min-height:30vh;padding:0 2rem 4rem}
.intro__label{grid-column:1/span 2;font-size:1.25rem;line-height:1.4}
.intro-copy{grid-column:7/span 6;font-size:1.25rem;line-height:1.4}
.name-link{display:inline-block;position:relative;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:1px;text-decoration-skip-ink:auto}
.name-link::after{content:"";position:absolute;inset:-.3em -.05em 0;background:var(--color-alabaster-grey);opacity:0;pointer-events:none;transition:opacity .2s ease}
@media (hover:hover) and (pointer:fine){.name-link:hover::after{opacity:.5}}
@media (max-width:1023px){
  .intro__grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .intro__quote-col{grid-column:4/span 3}
  .intro__copy-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .intro-copy{grid-column:4/span 3}
}
@media (max-width:767px){
  .intro__grid{grid-template-columns:1fr;min-height:60vh;padding:2.5rem 1.5rem 3rem}
  .intro__quote-col{grid-column:1}
  .intro-quote{font-size:2.75rem}
  .intro__copy-grid{grid-template-columns:1fr;margin-top:-4rem;padding:2.5rem 2rem 3rem}
  .intro__label{display:none}
  .intro-copy{grid-column:1}
}
@media (max-width:639px){.intro-quote{font-size:clamp(2.05rem,9.6vw,3.4rem)}.intro__scroll{transform:translateY(clamp(10rem,20svh,17rem))}.intro-copy{font-size:14px;line-height:1.35}}

/* ---------- Orbit tiles (featured projects) ---------- */
.orbit-tiles-section{background:var(--color-alabaster-grey);color:var(--color-onyx);overflow:visible;position:relative}
.orbit-tiles__heading{position:absolute;top:clamp(4rem,8vh,7rem);left:50%;z-index:4;width:max-content;max-width:calc(100vw - 2rem);transform:translate(-50%);font-size:clamp(3rem,4vw,4.25rem);font-weight:400;line-height:1;text-align:center;white-space:nowrap;pointer-events:none}
.orbit-tiles{display:grid;grid-template-columns:1fr 1fr;width:100%;height:100dvh;position:relative;overflow:visible}
.orbit-tiles__left{display:flex;align-items:center;justify-content:center;position:relative}
.orbit-tiles__collection{display:flex;justify-content:center;align-items:center;position:relative;transform:translateY(clamp(1.75rem,10vh,8rem))}
.orbit-tiles__list{display:grid;place-items:center}
.orbit-tiles__item{grid-area:1/1;display:flex;justify-content:center;align-items:center;width:max-content;height:max-content;will-change:transform,opacity,filter}
.orbit-card-btn{display:block;padding:0}
.orbit-card{aspect-ratio:2/3;border-radius:.65em;width:clamp(9rem,14vw,18rem);position:relative;overflow:visible;will-change:width}
.orbit-card__tilt{border-radius:inherit;width:100%;height:100%;position:absolute;inset:0;transform:perspective(50vw);transform-style:preserve-3d;will-change:transform;pointer-events:none}
.orbit-card__media{border-radius:inherit;width:100%;height:100%;position:absolute;inset:0;z-index:1;overflow:hidden;transform:translateZ(0);will-change:clip-path}
.orbit-cover-image{object-fit:cover;object-position:top center;width:100%;height:100%;position:absolute;top:0;left:0;border-radius:inherit;transform:translateZ(0) scale(1.035);transform-origin:center}
.orbit-card__title-layer{position:absolute;top:clamp(.75rem,1.1vw,1.15rem);right:clamp(.75rem,1.1vw,1.15rem);z-index:10;max-width:min(70%,16rem);transform:translateZ(7vw);transform-style:preserve-3d;pointer-events:none}
.orbit-card__cta-layer{position:absolute;bottom:clamp(.75rem,1.1vw,1.15rem);left:clamp(.75rem,1.1vw,1.15rem);z-index:10;transform:translateZ(7vw);transform-style:preserve-3d;pointer-events:none}
.orbit-card__title-label,.orbit-card__cta-label{display:block;width:max-content;border-radius:.5rem;background:var(--color-strawberry);color:var(--color-alabaster-grey);padding:.78rem 1rem .72rem;font-size:clamp(.95rem,1.1vw,1.18rem);font-weight:500;line-height:1;white-space:nowrap;box-shadow:0 .65rem 1.8rem #13131329;opacity:0;visibility:hidden;will-change:transform,opacity}
.orbit-card__cta-label{display:flex;align-items:center;gap:.45em;background:var(--color-onyx);padding-inline:.95rem .85rem;font-size:clamp(.78rem,.85vw,.92rem)}
.orbit-card__cta-icon{width:.95em;height:.95em;transform:rotate(-45deg);flex:none}
.orbit-card__title-label [data-orbit-card-title],.orbit-card__title-char{display:inline-block}
.orbit-tiles__right{display:flex;align-items:center;justify-content:flex-end;padding-top:clamp(4rem,8vh,7rem);padding-bottom:clamp(3rem,7vh,5rem);padding-inline:clamp(1rem,2vw,2rem) clamp(2rem,5vw,5rem)}
.orbit-tiles__content{position:relative;width:62.5%;--orbit-info-gap:clamp(2rem,4vh,3.5rem)}
.orbit-tiles__list-wrap{position:relative}
.orbit-tiles__info{position:absolute;top:calc(100% + var(--orbit-info-gap));right:0;left:0;min-height:3.1em}
.orbit-tiles__info-desc{font-size:14px;font-weight:400;line-height:1.55}
.orbit-list{width:100%;border-bottom:1px solid rgba(19,19,19,.14)}
.orbit-list__item{display:flex;align-items:center;padding:clamp(.6rem,1vw,.85rem) 0;border-top:1px solid rgba(19,19,19,.14);position:relative;color:var(--color-onyx);cursor:pointer;transition:color .35s ease;overflow:hidden}
.orbit-list__hover-tile{position:absolute;top:-1px;left:0;width:100%;height:calc(100% + 2px);background:var(--color-onyx);pointer-events:none;transition:transform .5s cubic-bezier(.16,1,.3,1);transform:translateY(-100%);will-change:transform}
.orbit-list__name{position:relative;z-index:1;font-size:clamp(.85rem,1.1vw,1.05rem);font-weight:400;line-height:1;flex:1;transition:font-weight .35s ease,transform .5s cubic-bezier(.16,1,.3,1)}
@media (hover:hover) and (pointer:fine){.orbit-list__item:hover{color:var(--color-alabaster-grey)}.orbit-list__item:hover .orbit-list__name{transform:translate(16px)}}
.orbit-list__item[data-active=true] .orbit-list__name{font-weight:500;transform:translate(16px)}
@media (max-width:900px){.orbit-tiles-section{display:none}}

/* Mobile works gallery */
.mobile-works-gallery{--mobile-works-edge:1.5rem;--mobile-works-slide-width:min(78vw,22rem);display:none;background:var(--color-alabaster-grey);overflow:clip;padding-block:3rem 4rem}
.mobile-works-gallery__heading{margin:0 0 2rem;padding-inline:var(--mobile-works-edge);font-size:clamp(2.05rem,9.6vw,3.4rem);line-height:1}
.mobile-works-gallery__track{display:flex;gap:1rem;overflow-x:auto;overflow-y:hidden;padding-left:var(--mobile-works-edge);padding-right:calc(100vw - var(--mobile-works-slide-width) - var(--mobile-works-edge));scroll-padding-left:var(--mobile-works-edge);scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.mobile-works-gallery__track::-webkit-scrollbar{display:none}
.mobile-works-gallery__slide{display:block;flex:0 0 var(--mobile-works-slide-width);aspect-ratio:2/3;overflow:hidden;border-radius:.65rem;scroll-snap-align:start}
.mobile-works-gallery__image{width:100%;height:100%;object-fit:cover;object-position:top center}
.mobile-works-gallery__meta{padding:2.5rem var(--mobile-works-edge) 0}
.mobile-works-gallery__active-link{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:0 1.25rem;font-size:clamp(1.15rem,5.6vw,1.55rem);font-weight:500;line-height:1}
.mobile-works-gallery__description{min-height:4.65em;max-width:34rem;font-size:14px;line-height:1.35}
@media (max-width:900px){.mobile-works-gallery{display:block}}
@media (min-width:640px) and (max-width:900px){.mobile-works-gallery__heading{font-size:2.75rem}}


/* ---------- Services ---------- */
.services-section{--services-index-width:4ch;--services-item-gap:50px;padding-block:clamp(6rem,15vh,11rem);overflow:visible}
.services-section__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 clamp(1rem,1.5vw,1.5rem);max-width:100rem;margin-inline:auto;padding-inline:1.5rem}
.services-section__eyebrow{grid-column:2/span 10;display:inline-flex;align-items:center;gap:.75rem;margin:0 0 clamp(3rem,7vh,4.8rem);font-size:14px;font-weight:500;line-height:1}
.services-section__dot{width:6px;height:6px;flex:0 0 auto;border-radius:999px;background:currentColor;transform:translateY(-1px);animation:services-section-dot 1.15s ease-in-out infinite}
@keyframes services-section-dot{0%,to{opacity:1}50%{opacity:.15}}
.services-section__body{grid-column:2/span 10;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:0 clamp(1rem,1.5vw,1.5rem);align-items:start}
.services-section__list{grid-column:1/span 7;display:flex;flex-direction:column;align-items:flex-start;gap:clamp(.18rem,1vh,.55rem);container-type:inline-size}
.services-section__entry{width:100%}
.services-section__item{display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:var(--services-item-gap);align-items:center;width:100%;color:#13131380;font-weight:500;line-height:1;text-align:left;white-space:nowrap;transition:color .2s ease}
.services-section__item-index{width:var(--services-index-width);font-size:14px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums}
.services-section__item-title{min-width:0;font-size:clamp(2.25rem,calc((100cqw - 80px)/10.5),4.25rem);line-height:1;white-space:nowrap}
.services-section__item[data-active=true],.services-section__item[data-expanded=true]{color:var(--color-onyx)}
.services-section__item:focus-visible{outline:1.5px solid currentColor;outline-offset:.08em}
.services-section__panel{height:0;width:100%;overflow:hidden;opacity:0}
.services-section__panel-inner{display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:var(--services-item-gap);align-items:flex-end}
.services-section__panel-inner::before{content:"(00)";grid-column:1;width:var(--services-index-width);visibility:hidden;font-size:14px;font-weight:500;line-height:1}
.services-section__copy{display:block;grid-column:2;max-width:28rem;padding-top:50px;padding-bottom:30px;color:var(--color-onyx);font-size:14px;font-weight:400;line-height:1.35;opacity:0}
.services-section__visual{grid-column:9/span 2;position:relative;align-self:stretch;min-height:100%;pointer-events:none}
.services-section__preview{--services-preview-y:0px;position:absolute;top:0;left:0;width:clamp(14.5rem,20vw,21rem);aspect-ratio:1/1.5;overflow:hidden;transform:translate3d(0,var(--services-preview-y),0);will-change:transform}
.services-section__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;background:var(--color-alabaster-grey);opacity:0;transition:opacity .3s ease;will-change:opacity}
.services-section__image[data-active=true]{opacity:1}
@media (max-width:1023px){.services-section__list{grid-column:1/span 6}.services-section__item-title{font-size:clamp(1.45rem,calc((100cqw - 80px)/11.5),3rem)}.services-section__visual{grid-column:8/span 3}.services-section__preview{width:clamp(9rem,18vw,13rem)}}
@media (max-width:767px){
  .services-section{--services-item-gap:clamp(1rem,6vw,50px);padding-block:clamp(4.5rem,12vh,7rem)}
  .services-section__grid{grid-template-columns:1fr}
  .services-section__eyebrow,.services-section__body{grid-column:1}
  .services-section__eyebrow{margin-bottom:2rem}
  .services-section__body{grid-template-columns:minmax(0,1fr);gap:0}
  .services-section__list{grid-column:1;gap:clamp(.6rem,2vw,1rem)}
  .services-section__item{align-items:start;white-space:normal}
  .services-section__item-title{font-size:clamp(1.7rem,8.8vw,3rem);line-height:.95;white-space:normal}
  .services-section__visual{display:none}
}

/* ---------- Testimonials / milestones ---------- */
.testimonials{position:relative;padding-block:clamp(6rem,12vw,11rem)}
.testimonials__grid{display:grid;grid-template-columns:1fr;row-gap:clamp(3rem,8vw,4.5rem);max-width:100rem;margin-inline:auto;padding-inline:1.5rem}
.testimonials__left{display:flex;flex-direction:column}
.testimonials__top{display:flex;align-items:center;justify-content:space-between;margin-block-end:clamp(1.75rem,3vw,2.5rem)}
.testimonials__arrows{display:flex;column-gap:1.25rem}
.testimonials__arrow{display:grid;place-items:center;color:currentColor}
.testimonials__arrow:disabled{cursor:default}
.testimonials__arrow-icon{width:1rem;height:1rem}
.testimonials__arrow--prev .testimonials__arrow-icon{transform:scaleX(-1)}
.testimonials__counter{font-family:var(--font-mono);font-size:.625rem;font-weight:500;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.testimonials__quotes{display:grid}
.testimonials__quote{grid-area:1/1;opacity:0;visibility:hidden}
.testimonials__quote[data-active=true]{opacity:1;visibility:visible}
.testimonials__quote p{font-size:.875rem;font-weight:500;line-height:1.5}
.testimonials__progress{position:relative;margin-block-start:clamp(2rem,4vw,3rem);width:100%;height:1px;background:color-mix(in srgb,currentColor 15%,transparent)}
.testimonials__progress-fill{position:absolute;inset:0;background:currentColor;transform:scaleX(0);transform-origin:left center}
.testimonials__right{display:grid}
.testimonials__person{grid-area:1/1;display:flex;flex-direction:column;justify-content:flex-start;opacity:0;visibility:hidden}
.testimonials__person[data-active=true]{opacity:1;visibility:visible}
.testimonials__portrait{width:clamp(3.5rem,5vw,4.25rem);height:auto;aspect-ratio:1;border-radius:100%;object-fit:cover;filter:grayscale(1);margin-block-end:clamp(1rem,1.5vw,1.25rem)}
.testimonials__name,.testimonials__job{font-size:.875rem;font-weight:500;line-height:1.4}
.testimonials__job{margin-block-start:.35em;opacity:.75}
@media (min-width:768px){.testimonials__grid{grid-template-columns:repeat(6,minmax(0,1fr))}.testimonials__left{grid-column:1/span 3}.testimonials__right{grid-column:4/span 2}}
@media (min-width:1024px){.testimonials__grid{grid-template-columns:repeat(12,minmax(0,1fr))}.testimonials__left{grid-column:2/span 4}.testimonials__right{grid-column:7/span 3}}

/* ---------- CTA + ASCII ---------- */
.project-cta-section{padding-block:clamp(5rem,14vh,10rem)}
.project-cta-section__grid{display:grid;grid-template-columns:1fr;align-items:center;gap:clamp(3rem,7vw,7rem);max-width:100rem;margin-inline:auto;padding-inline:1.5rem}
.project-cta-section__content{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(1.5rem,3vw,2.25rem)}
.project-cta-section__heading{font-size:clamp(2.05rem,9.6vw,3.4rem);font-weight:500;line-height:1}
.project-cta-section__line{display:block;white-space:nowrap}
.project-cta-section__ascii-wrap{position:relative;display:flex;align-items:center;justify-content:center;min-width:0}
.project-cta-section__ascii-box{width:100%;min-height:clamp(18rem,34vw,40rem);display:flex;align-items:center;justify-content:center;cursor:default;user-select:none;touch-action:none}
.project-cta-section__ascii{font-family:var(--font-mono);font-size:6px;line-height:6px;font-weight:500;color:var(--color-onyx);white-space:pre;transform-origin:center center;will-change:transform}
@media (min-width:640px){.project-cta-section__heading{font-size:2.75rem}}
@media (min-width:768px){.project-cta-section__grid{grid-template-columns:repeat(6,minmax(0,1fr))}.project-cta-section__content{grid-column:2/span 2}.project-cta-section__ascii-wrap{grid-column:4/span 3}.project-cta-section__heading{font-size:clamp(3rem,4vw,4.25rem)}}
@media (min-width:1024px){.project-cta-section__grid{grid-template-columns:repeat(12,minmax(0,1fr))}.project-cta-section__content{grid-column:2/span 5}.project-cta-section__ascii-wrap{grid-column:7/span 6}}
@media (max-width:720px){.project-cta-section__content{align-items:center;text-align:center}.project-cta-section__ascii-box{min-height:min(62vw,22rem);touch-action:pan-y}}

/* ---------- Footer ---------- */
.site-footer-block{position:relative;overflow:clip visible}
.site-footer-wrap{background:var(--color-alabaster-grey);color:var(--color-onyx);position:relative;overflow:hidden}
.site-footer{--site-footer-edge:32px;height:100svh;max-height:100svh;position:relative}
.site-footer__grid{width:100%;height:100%;min-height:0;padding-inline:var(--site-footer-edge);position:relative}
.site-footer__top{position:absolute;top:50%;left:var(--site-footer-edge);right:var(--site-footer-edge);display:flex;justify-content:space-between;align-items:flex-start;gap:clamp(2rem,5vw,5rem);transform:translateY(-50%);font-size:14px;font-weight:500;line-height:1.35}
.site-footer__column{display:flex;flex-direction:column;align-items:flex-start;gap:4rem;min-width:clamp(8rem,12vw,12rem)}
.site-footer__eyebrow{color:#13131380;text-transform:uppercase}
.site-footer__links{display:flex;flex-direction:column;align-items:flex-start}
.site-footer__link{display:block;position:relative;height:1.35em;overflow:hidden;cursor:pointer}
.site-footer__link-label{display:block;white-space:nowrap}
.site-footer__reveal-line{display:block}
.site-footer__time-colon{display:inline-block;animation:1s step-end infinite site-footer-time-colon-blink}
@keyframes site-footer-time-colon-blink{0%,49%{opacity:1}50%,100%{opacity:0}}
.site-footer__bottom{position:absolute;left:var(--site-footer-edge);right:var(--site-footer-edge);bottom:var(--site-footer-edge)}
.site-footer__dot{margin-inline:-.02em .06em}
.site-footer__wordmark{--site-footer-wordmark-size:16px;display:flex;justify-content:space-between;column-gap:.25em;font-size:var(--site-footer-wordmark-size);font-weight:700;line-height:.78;letter-spacing:-.04em;white-space:nowrap;transform:translateY(.02em)}
.site-footer__dark{background:var(--color-onyx);opacity:0;pointer-events:none;position:absolute;inset:0}
@media (max-width:991px){.site-footer__top{display:grid;grid-template-columns:repeat(2,max-content);justify-content:start;gap:3rem clamp(2rem,10vw,6rem)}.site-footer__column:nth-child(2n){justify-self:start}}
@media (max-width:767px){.site-footer{--site-footer-edge:1rem}.site-footer__top{grid-template-columns:1fr;gap:2rem 1rem;font-size:12px}.site-footer__column{gap:2rem;min-width:0}}

/* ---------- Responsive header ---------- */
@media (max-width:767px){
  :root{--menu-width:80vw}
  .underlay-nav__container{padding:1.5rem}
  .underlay-nav__cta-header{display:none}
  .underlay-nav__inner{padding:5em 1.25em 1.25em}
  .underlay-nav__bottom{flex-direction:column;gap:2em;padding-inline:1em}
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .static-noise,.static-noise::before,.services-section__dot,.site-footer__time-colon{animation:none}
  .home-hero{opacity:1}
}

/* ---------- Page transitions (ported: default sheet + side-by-side) ---------- */
.transition{z-index:2;pointer-events:none;position:fixed;inset:0;overflow:clip}
.transition__middle{opacity:0;background:var(--color-strawberry);position:fixed;inset:0}
body[data-page-transition=active]{pointer-events:none}

/* ---------- Work detail (sub pages) ---------- */
.page--work{background:var(--color-alabaster-grey);color:var(--color-onyx);min-height:100svh}
.wd-hero{display:flex;flex-direction:column;justify-content:flex-start;padding-top:32svh;text-align:center}
.wd-title{width:100%;margin:0 auto;padding-inline:clamp(1rem,2vw,2rem);font-size:clamp(5rem,10.8vw,12.5rem);font-weight:600;line-height:.82;letter-spacing:0;text-wrap:balance;visibility:hidden}
/* SplitText line masks are only line-height tall (.82em), so give them room for ascenders and descenders */
.wd-title>div{padding:.16em 0 .1em;margin:-.16em 0 -.1em}
.wd-meta{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:.85rem 1rem;width:100%;margin-top:clamp(3rem,6svh,5rem);padding:1.15rem clamp(1rem,2vw,2rem)}
.wd-meta__item{display:flex;align-items:baseline;gap:.65rem;min-width:0;text-align:left}
.wd-meta__label,.wd-meta__value{font-size:14px;line-height:1.25}
.wd-meta__label{flex:0 0 auto;color:#13131373;font-weight:500;text-transform:uppercase}
.wd-meta__value{min-width:0;font-weight:600}
.wd-hero-img{width:calc(100% - 4rem);margin-inline:auto;overflow:hidden;border-radius:.4rem;background:#d9d9d9}
.wd-hero-img__img{width:100%;height:auto;display:block}
.wd-description,.wd-details-section,.wd-palette-section,.wd-palette-description{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1.25rem 1.5rem;padding:clamp(8rem,17svh,13rem) 2rem}
.wd-description.is-after-media,.wd-details-section.is-after-description{padding-top:0}
.wd-details-section{padding-bottom:clamp(10rem,21svh,16rem)}
.wd-palette-section{padding-block:clamp(2rem,6svh,5rem) 0}
.wd-section-label,.wd-description__label,.wd-description__text,.wd-palette-section__label,.wd-palette-description__text{margin:0;font-size:1.25rem;font-weight:400;line-height:1.75rem;letter-spacing:0;color:var(--color-onyx)}
.wd-description__label,.wd-details-section__label,.wd-palette-section__label{grid-column:1/span 2}
.wd-description__body,.wd-details,.wd-palette,.wd-palette-description__text{grid-column:7/span 6}
.wd-description__text+.wd-description__text{margin-top:1.25rem}
.wd-details{margin:0;border-top:1px solid #13131329}
.wd-details__row{display:grid;grid-template-columns:minmax(8rem,.56fr) minmax(0,.44fr);gap:1.5rem;padding-block:.7rem;border-bottom:1px solid #13131329}
.wd-details dt,.wd-details dd{margin:0;font-size:1rem;line-height:1.35}
.wd-details dt{color:#13131380;font-weight:500}
.wd-details dd{font-weight:600}
.wd-image-break{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1.5rem;width:calc(100% - 4rem);margin-inline:auto;padding-bottom:clamp(9rem,18svh,15rem)}
.wd-image-break__item{width:100%;margin:0;overflow:hidden;border-radius:.4rem;background:#d9d9d9}
.wd-image-break.is-two-up .wd-image-break__item{grid-column:span 6;aspect-ratio:4/3}
.wd-image-break.is-wide .wd-image-break__item{grid-column:1/-1;aspect-ratio:16/8.2}
.wd-image-break__img{display:block;width:100%;height:100%;object-fit:cover}
.wd-palette{display:grid;gap:.7rem;padding:.7rem;border-radius:.75rem;background:#d9d9d9}
.wd-palette__regular{display:grid;grid-template-columns:1.25fr 1fr;grid-template-rows:repeat(2,minmax(6.5rem,1fr));gap:.7rem}
.wd-palette__regular .wd-palette-card:first-child{grid-row:span 2}
.wd-palette-card{min-height:7rem;overflow:hidden;padding:1rem;border-radius:.55rem;background:var(--swatch-color);color:var(--swatch-ink,var(--color-onyx))}
.wd-palette-card__name,.wd-palette-card__hex{margin:0;font-size:.8rem;font-weight:700;line-height:1.05;text-transform:uppercase}
.wd-palette-card__hex{margin-top:.15rem}
/* Next work: pinned, progress bar fills, then the page turns by itself */
.scroll-next{height:100svh;min-height:32rem;position:relative;background:var(--color-alabaster-grey);color:var(--color-alabaster-grey);overflow:hidden}
.scroll-next__inner{width:100%;height:100%;display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden}
.scroll-next__bg{z-index:0;position:absolute;inset:2rem;overflow:hidden;border-radius:.4rem;background:#d9d9d9}
.scroll-next__bg-img{object-fit:cover;width:100%;height:100%;display:block;filter:saturate(.92) contrast(1.04);transform-origin:center}
.scroll-next__bg-overlay{z-index:2;opacity:.38;background:linear-gradient(180deg,#1313138a,#13131352),#13131333;position:absolute;inset:0}
.scroll-next__center{z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:1rem;position:relative;text-align:center}
.scroll-next__sub{font-size:14px;font-weight:600;line-height:1;text-transform:uppercase}
.scroll-next__h{max-width:min(11ch,calc(100vw - 2rem));margin:.75rem 0 0;font-size:clamp(3.25rem,10vw,9.5rem);font-weight:600;line-height:.9;text-wrap:balance}
.scroll-next__progress{width:min(11ch,calc(100vw - 2rem));margin-top:1.75rem;pointer-events:none}
.scroll-next__progress-track{width:100%;height:6px;background:#ffffff40;border-radius:3px;overflow:hidden}
.scroll-next__progress-fill{width:100%;height:100%;background:currentColor;transform-origin:left center;transform:scaleX(0)}
.scroll-next-mobile{display:none}
/* Prev / next arrows, fixed bottom centre */
.wd-visit-fixed{position:fixed;bottom:1.75rem;left:50%;translate:-50% 0;z-index:50;display:flex;align-items:center;gap:.5rem;transition:opacity .25s ease,translate .25s ease}
.wd-visit-fixed.is--hidden{opacity:0;pointer-events:none;translate:-50% 6px}
.wd-visit-arrow{--wd-arrow-size:2.5rem;aspect-ratio:1;color:var(--color-alabaster-grey);display:grid;width:var(--wd-arrow-size);height:var(--wd-arrow-size);position:relative;-webkit-tap-highlight-color:transparent}
.wd-visit-arrow__bg,.wd-visit-arrow__mask{grid-area:1/1}
.wd-visit-arrow__bg{background:var(--color-onyx);border-radius:.25rem;position:relative;overflow:clip;transition:transform .525s var(--ease-osmo)}
.wd-visit-arrow__bg-hover{background:var(--color-strawberry);position:absolute;bottom:0;left:-10%;width:120%;height:100%;transform:translate3d(0,175%,0) rotate(15deg);transition:transform .525s var(--ease-osmo)}
.wd-visit-arrow__mask{display:flex;align-items:center;justify-content:flex-end;width:1.125rem;height:1.125rem;place-self:center;overflow:clip;z-index:1}
.wd-visit-arrow__list{display:flex}
.wd-visit-arrow__icon{width:1.125rem;height:1.125rem;padding:.2rem;flex:none;transition:transform .525s var(--ease-osmo)}
.wd-visit-arrow--previous .wd-visit-arrow__icon{rotate:180deg}
.wd-visit-arrow--previous .wd-visit-arrow__mask{justify-content:flex-start}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .wd-visit-arrow:is(:hover,:focus-visible) .wd-visit-arrow__bg{transform:rotate(90deg)}
  .wd-visit-arrow--previous:is(:hover,:focus-visible) .wd-visit-arrow__bg{transform:rotate(-90deg)}
  .wd-visit-arrow:is(:hover,:focus-visible) .wd-visit-arrow__bg-hover{transform:translateZ(0) rotate(0)}
  .wd-visit-arrow:is(:hover,:focus-visible) .wd-visit-arrow__icon{transform:translate3d(200%,0,0)}
}
@media (max-width:1023px){
  .wd-description,.wd-details-section,.wd-palette-section,.wd-palette-description{grid-template-columns:repeat(6,minmax(0,1fr))}
  .wd-description__body,.wd-details,.wd-palette,.wd-palette-description__text{grid-column:4/span 3}
}
@media (max-width:767px){
  .wd-description,.wd-details-section,.wd-palette-section,.wd-palette-description{grid-template-columns:1fr}
  .wd-description__label,.wd-details-section__label,.wd-palette-section__label,.wd-description__body,.wd-details,.wd-palette,.wd-palette-description__text{grid-column:1}
}
@media (max-width:760px){
  .wd-hero{padding-top:clamp(9rem,28svh,15rem)}
  .wd-meta{display:grid;grid-template-columns:1fr 1fr}
  .wd-hero-img{width:calc(100% - 2rem)}
  .wd-description,.wd-palette-description{padding-block:5.5rem}
  .wd-details-section{padding-block:5.5rem 6rem}
  .wd-details-section.is-after-description,.wd-description.is-after-media{padding-top:0}
  .wd-section-label,.wd-description__label,.wd-description__text,.wd-palette-section__label,.wd-palette-description__text,.wd-details dt,.wd-details dd{font-size:14px;line-height:1.35}
  .wd-description__text+.wd-description__text{margin-top:.9rem}
  .wd-details__row{grid-template-columns:1fr;gap:.35rem}
  .wd-image-break{grid-template-columns:1fr;width:calc(100% - 2rem);gap:.45rem;padding-bottom:5.5rem}
  .wd-image-break.is-two-up .wd-image-break__item,.wd-image-break.is-wide .wd-image-break__item{grid-column:auto;aspect-ratio:4/5}
  .wd-palette-section{padding-block:2rem 0}
  .wd-palette__regular{grid-template-columns:1fr;grid-template-rows:none}
  .wd-palette__regular .wd-palette-card:first-child{grid-row:auto}
  .scroll-next{display:none}
  .scroll-next-mobile{min-height:100svh;color:var(--color-onyx);display:flex;flex-direction:column;gap:.75rem;padding:clamp(7rem,20vh,12rem) 1.25rem 1.25rem}
  .scroll-next-mobile__content{flex:1;display:flex;flex-direction:column;gap:1rem}
  .scroll-next-mobile__sub{display:block;font-size:14px;font-weight:600;line-height:1;text-transform:uppercase}
  .scroll-next-mobile__h{margin:.9rem 0 0;font-size:clamp(2.75rem,13vw,4.5rem);font-weight:500;line-height:.95}
  .scroll-next-mobile__button{--button-043-padding:.9em .9em .9em 1.1em;margin-top:auto;width:100%;font-size:1.05rem}
  .scroll-next-mobile__button .button-043__inner{justify-content:space-between}
  .scroll-next-mobile__image{width:100%;aspect-ratio:1.5;overflow:hidden;border-radius:.4rem;background:#d9d9d9}
  .scroll-next-mobile__img{width:100%;height:100%;display:block;object-fit:cover}
  .wd-visit-fixed{bottom:1rem;gap:.375rem}
}
@media (max-width:480px){.wd-title{font-size:4rem}.wd-meta{grid-template-columns:1fr}}
