/* One visual language, from the original mark to the space around it. */
.intro-paper{background:#f3f1ea}
.intro-light{position:absolute;inset:-30%;pointer-events:none;background:radial-gradient(ellipse at 30% 38%,#fbefc777,transparent 52%),radial-gradient(ellipse at 75% 70%,#b2c4a62b,transparent 48%);opacity:.15}
.intro-echo{position:absolute;width:130vmax;height:130vmax;left:50%;top:50%;margin:-65vmax 0 0 -65vmax;pointer-events:none;mix-blend-mode:multiply}
.intro-brand{top:46%;max-width:91%}
.intro-name{font-size:clamp(120px,17vw,236px);line-height:1.16;letter-spacing:.18em;margin:20px -.18em 10px 0;overflow:visible}
.intro-letter{display:block;overflow:hidden;padding:16px 12px;margin:-16px -12px;opacity:1!important}
.intro-name .intro-glyph{display:block;opacity:0;will-change:transform,opacity,filter}
.intro-company{font-size:12px;letter-spacing:.24em;line-height:2.2;overflow:hidden}
.intro-word{display:inline-block;will-change:transform,opacity}
.intro-tagline{overflow:hidden;line-height:2;font-size:14px;letter-spacing:2px}
.intro-rule{width:46px;margin:26px auto 19px}
.intro-footer{z-index:2}
.intro-footer button{color:inherit}
.intro-progress span{background:#a6b58a}
.section-label{position:relative;column-gap:14px;min-height:48px;--line-progress:0}
.section-label:after{content:"";position:absolute;top:-1px;left:0;right:0;height:1px;background:currentColor;transform:scaleX(var(--line-progress));transform-origin:left;opacity:.65}
.section-label>span:first-of-type{margin-right:auto}
.section-mark{display:block;flex:0 0 38px;width:38px;height:38px;color:#798c59}
.section-mark [data-piece="6"]{color:#72919a}
.section-mark [data-piece="7"]{color:#ab746a}
.process .section-mark{color:#b1bf9b}
.process .section-mark [data-piece="6"]{color:#a4c0c5}
.process .section-mark [data-piece="7"]{color:#c69a8b}
.brand-journey{position:fixed;z-index:21;right:1.5%;top:45%;width:49px;display:flex;align-items:center;flex-direction:column;color:#7c8c65;pointer-events:none;opacity:var(--journey-opacity,0);transition:color 1s}
.journey-mark{width:49px;height:49px;overflow:visible}
.journey-track{display:block;width:1px;height:72px;background:#8c9a7438;margin:17px 0 14px;overflow:hidden}
.journey-track i{display:block;width:1px;height:100%;background:currentColor;transform:scaleY(0);transform-origin:top}
.journey-number{font:7px/1.5 var(--sans);letter-spacing:1px;white-space:nowrap}
.brand-journey.on-dark{color:#bbc9a6}
.intro-active .brand-journey{visibility:hidden}
.motion-ready .reveal{transform:translateY(30px)}
.motion-ready .reveal.is-visible{transition:opacity 1.6s var(--ease),transform 1.6s var(--ease)}
@media(max-width:1050px) and (min-width:701px){.brand-journey{width:35px;right:1%}.journey-mark{width:35px;height:35px}.journey-number{font-size:6px}}
@media(max-width:700px){
  .intro-name{font-size:clamp(96px,28vw,132px);letter-spacing:.18em;margin-top:23px;margin-bottom:19px}
  .intro-company{font-size:10px;letter-spacing:1.5px}
  .intro-tagline{font-size:11px;letter-spacing:1px}
  .intro-rule{margin:24px auto 17px;width:36px}
  .section-label{column-gap:8px;min-height:42px}
  .section-mark{flex-basis:27px;width:27px;height:27px}
  .section-label>span:first-of-type{font-size:6px;letter-spacing:.75px}
  .section-label>span:last-child{font-size:9px;letter-spacing:.7px}
  .brand-journey{right:1px;width:23px;top:44%;opacity:calc(var(--journey-opacity,0)*.7)}
  .journey-mark{width:23px;height:28px}
  .journey-track{height:48px;margin:9px 0}
  .journey-number{display:none}
}
@media(prefers-reduced-motion:reduce){
  .brand-journey{display:none}.intro{display:none!important}
  .motion-ready .reveal{opacity:1;transform:none}
  .section-label:after{transform:none}
}
