/* L0olf: an open typographic composition, with light as the moving scenery. */
.hero.hero-intro{height:100svh;min-height:760px;max-height:1200px;padding:0;position:relative;isolation:isolate;overflow:clip;background:#150c11;color:var(--ember-white)}
.hero-intro:after{display:none}
.hero-intro:before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to bottom,#130c1166,transparent 23%,transparent 74%,#150c11d9),radial-gradient(ellipse 25% 38% at 50% 48%,#120b124d,transparent 100%)}
.intro-light{position:absolute;inset:-16% -15%;z-index:0;pointer-events:none;background:radial-gradient(ellipse 28% 40% at 25% 55%,#cc491d77,transparent 85%),radial-gradient(ellipse 28% 42% at 75% 55%,#b52c2b88,transparent 85%),#150c11;transform:translate3d(var(--intro-mouse-x,0px),calc(var(--intro-bg-y,0px) + var(--intro-mouse-y,0px)),0)}
.intro-field{display:block;width:100%;height:100%;opacity:0;transition:opacity .6s;mask-image:linear-gradient(to bottom,transparent,#000 14%,#000 82%,transparent)}
.intro-field.is-ready{opacity:1}
.intro-copy{height:100%;position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:132px var(--gutter) 140px;transform:translate3d(calc(var(--intro-mouse-x,0px)*.12),var(--intro-type-y,0px),0)}
.intro-kicker{font-size:9px;font-weight:500;letter-spacing:.16em;color:#e4c4ae}
.hero-intro h1{display:flex;flex-direction:column;width:min(740px,67vw);margin:27px 0 26px;font:600 clamp(112px,11.2vw,180px)/.78 Barlow,Impact,sans-serif;letter-spacing:-.025em;text-transform:none}
.intro-title-back{display:block;align-self:flex-start;transform:translate3d(calc(var(--intro-title-x,0px)*-.5),0,0)}
.intro-title-bridge{display:block;align-self:center;font:500 .53em/1.05 Space,Arial,sans-serif;letter-spacing:-.065em;margin:5px 0 0 12%}
.hero-intro h1 .intro-title-front{display:block;align-self:flex-end;font:italic 1.2em/.98 Instrument,Georgia,serif;letter-spacing:-.045em;color:#ffd2ae;text-transform:none;margin-top:-.035em;transform:translate3d(calc(var(--intro-title-x,0px)*.5),0,0)}
.intro-phrase{margin:0;font:400 15px/1.5 Space,Arial,sans-serif;color:#e8c6b5}
.intro-phrase-visual{display:inline-flex;align-items:baseline;gap:8px}
.intro-word-slot{display:inline-grid;width:5em;text-align:left;font:italic 30px/1.25 Instrument,Georgia,serif;transition:width .44s cubic-bezier(.16,1,.3,1)}
.intro-word{display:block;font:inherit;letter-spacing:-.025em;color:#ffd2ae;white-space:nowrap;transition:opacity .18s,transform .35s cubic-bezier(.16,1,.3,1)}
.intro-word.is-changing{opacity:.15;transform:translateY(-6px)}
.intro-description{position:absolute;left:var(--gutter);bottom:145px;font:400 11px/1.7 Space,Arial,sans-serif;color:#d7b7a7;margin:0;max-width:230px}
.intro-footer{position:absolute;left:var(--gutter);right:var(--gutter);bottom:38px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid #f4c5a62e;padding-top:22px;z-index:3}
.intro-footer>.tiny{font-size:8px;letter-spacing:.10em;color:#e1bda8}
.intro-explore{display:inline-flex;align-items:center;gap:23px;font-size:12px;color:#ffe2c9}
.intro-explore .arrow-icon{width:23px;height:23px;color:#ffaf7b;transition:translate .25s}
.intro-explore:hover .arrow-icon{translate:0 5px}
.intro-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.intro-note{position:fixed;left:0;top:0;width:143px;height:53px;padding:0 15px 0 18px;display:none;align-items:center;justify-content:space-between;gap:12px;border-radius:28px 28px 28px 7px;background:#ffe9d3;color:#38151b;box-shadow:0 5px 24px #12080b29;z-index:51;pointer-events:none;user-select:none;opacity:0;scale:.88;transform-origin:top left;transition:opacity .18s,scale .25s ease-out}
.intro-note>span{font:italic 23px/1 Instrument,Georgia,serif;white-space:nowrap;letter-spacing:-.035em}
.intro-note .arrow-icon{width:16px;height:16px;color:#a03a21}
.intro-note.is-visible{opacity:1;scale:1}
@media(hover:hover) and (pointer:fine) and (min-width:701px){.intro-note{display:flex}}
@media(max-height:780px) and (min-width:701px){.hero.hero-intro{min-height:660px}.intro-copy{padding-top:120px;padding-bottom:120px}.hero-intro h1{font-size:clamp(106px,17.2svh,138px);width:min(650px,64vw);margin:22px 0}.intro-description{bottom:116px;font-size:10px}.intro-footer{bottom:28px;padding-top:18px}}
@media(max-width:1000px) and (min-width:701px){.hero-intro h1{width:74vw;font-size:14vw}.intro-description{bottom:123px;font-size:10px}.intro-footer>.tiny{font-size:7px}}
@media(max-width:700px){
 .hero.hero-intro{height:100svh;min-height:680px;max-height:none}
 .intro-copy{padding:104px var(--gutter) 145px}
 .intro-kicker{font-size:7px;letter-spacing:.13em}
 .hero-intro h1{display:grid;grid-template-columns:max-content 1fr;align-items:baseline;column-gap:.17em;width:5em;max-width:100%;font-size:clamp(52px,17.5vw,96px);margin:28px 0 38px;line-height:.9}
 .intro-title-back{align-self:baseline;margin:0}
 .intro-title-bridge{align-self:baseline;justify-self:start;font:inherit;letter-spacing:inherit;margin:0;white-space:nowrap;transform:translate3d(calc(var(--intro-title-x,0px)*-.5),0,0)}
 .hero-intro h1 .intro-title-front{position:relative;grid-column:1/-1;justify-self:end;align-self:start;font-size:1.5em;line-height:.98;margin:-.2em 0 0}
 .hero-intro h1 .intro-title-front:before{content:'';position:absolute;left:-.64em;top:.32em;width:.46em;height:.46em;background:currentColor;rotate:calc(-9deg + var(--intro-star-turn,0deg));clip-path:polygon(50% 0,53% 44%,85% 15%,56% 47%,100% 50%,56% 53%,85% 85%,53% 56%,50% 100%,47% 56%,15% 85%,44% 53%,0 50%,44% 47%,15% 15%,47% 44%);pointer-events:none}
 .intro-phrase{font-size:13px}.intro-word-slot{font-size:27px}
 .intro-description{position:static;text-align:center;font-size:11px;line-height:1.7;margin-top:22px;max-width:260px}
 .intro-light{inset:-12% -32%}
 .intro-footer{bottom:49px;padding-top:18px;gap:15px}.intro-footer>.tiny{font-size:6px;max-width:123px}.intro-footer>.tiny:last-child{display:none}
 .intro-explore{font-size:10px;gap:12px}.intro-explore .arrow-icon{width:20px;height:20px}
 .intro-note{display:none!important}
}
@media(max-width:700px) and (max-height:740px){
 .hero.hero-intro{min-height:0}
 .intro-copy{padding-top:104px;padding-bottom:110px}
 .hero-intro h1{font-size:clamp(52px,min(17.5vw,15svh),96px);margin:20px 0 24px}
 .intro-description{margin-top:18px}
}
/* Desktop: a stepped title, balanced by a single eight-point star. */
@media(min-width:701px){
 .hero-intro h1{display:grid;grid-template-columns:max-content 1fr;align-items:baseline;column-gap:.19em;row-gap:0;width:5.35em;max-width:100%;margin:28px 0 clamp(64px,10svh,104px);font-size:clamp(96px,min(9.2vw,18.5svh),176px);line-height:.9}
 .intro-title-back{align-self:baseline}
 .intro-title-bridge{align-self:baseline;justify-self:start;margin:0;font:inherit;letter-spacing:inherit;white-space:nowrap;transform:translate3d(calc(var(--intro-title-x,0px)*-.5),0,0)}
 .hero-intro h1 .intro-title-front{position:relative;grid-column:1/-1;justify-self:end;align-self:start;font-size:1.6em;line-height:.98;margin:-.22em 0 0}
 .hero-intro h1 .intro-title-front:before{content:'';position:absolute;left:-.7em;top:.32em;width:.5em;height:.5em;background:currentColor;rotate:calc(-9deg + var(--intro-star-turn,0deg));clip-path:polygon(50% 0,53% 44%,85% 15%,56% 47%,100% 50%,56% 53%,85% 85%,53% 56%,50% 100%,47% 56%,15% 85%,44% 53%,0 50%,44% 47%,15% 15%,47% 44%);pointer-events:none}
}
.motion-reduced .intro-light,.motion-reduced .intro-copy,.motion-reduced .intro-title-back,.motion-reduced .intro-title-bridge,.motion-reduced .hero-intro h1 .intro-title-front{transform:none!important}
.motion-reduced .intro-note{display:none!important}
.motion-reduced .intro-word,.motion-reduced .intro-word-slot{transition:none}
@media(prefers-reduced-motion:reduce){.intro-light,.intro-copy,.intro-title-back,.intro-title-bridge,.hero-intro h1 .intro-title-front{transform:none!important}.intro-note{display:none!important}}
