/* Shared image compositing. The generated key colours never reach the visible page. */
[data-depth-scene]{--depth-scroll:0;--scene-position:50% 50%}
.scene-flat{transition:opacity .4s ease}
[data-depth=ready]>.scene-flat{opacity:0}
.depth-planes{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.depth-plane{position:absolute;inset:0;transform:translate3d(calc(var(--depth-x,0px)*var(--weight)),calc(var(--depth-y,0px)*var(--weight) + var(--depth-scroll,0)*var(--travel)),0) scale(var(--depth-scale,1.08));will-change:transform}
.depth-plane canvas{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--scene-position)}
.grove-world{--scene-position:50% 52%}.patio-hero-art{--scene-position:52% 50%}
[data-art=false] .depth-planes{visibility:hidden}
.optic-host{position:relative}.series-optics{position:absolute;top:0;left:0;width:100%;z-index:3;pointer-events:none}
[data-hover=glass] .art-hover:hover img,[data-hover=ripple] .art-hover:hover img{transform:none;filter:none}
[data-seam]{position:relative}.seam-curtain{position:absolute;inset:0;z-index:8;pointer-events:none;display:flex;flex-direction:column;overflow:hidden}
.seam-curtain i{display:block;flex:1 1 0;min-height:0;background:var(--seam-cover,var(--paper));margin-block:-.6px;will-change:transform}
.mono-footer,.morrow-footer,.sway-footer{--seam-cover:var(--ink)}
.grove-letter{grid-template-columns:1fr 280px;gap:7vw}
.grove-inset{aspect-ratio:.85;box-shadow:0 24px 45px #252d2c1c;border:7px solid #fffdf5}
.grove-practice-art{aspect-ratio:.79}.grove-practice-art img{object-position:58%}
.grove-practice-copy h2{font-size:42px}.grove-invitation{max-width:650px}
.patio-feature-image{height:350px}.patio-feature:nth-child(2){padding-top:45px}
.patio-feature:nth-child(2) .patio-feature-image{height:385px;border-radius:140px 140px 5px 5px}
.patio-feature:nth-child(3){padding-top:90px}.patio-feature:nth-child(3) .patio-feature-image{height:320px}
.patio-features{align-items:start;margin-bottom:70px;gap:32px}
.patio-feature-title{font-size:29px}.patio-title .action,.patio-footer .action{border-radius:40px}
.patio-title{padding-right:5vw}.patio-hero-art{border-top-left-radius:180px}
.mono-gallery{height:720px}.mono-gallery-track{gap:42px;padding-inline:2vw}
.mono-photo{width:29%}.mono-photo>img{height:350px}.mono-photo:nth-child(2)>img{height:505px}
.mono-photo>span{font-size:16px}.mono-footer-art{height:445px}
.action:active{transform:translateY(1px) scale(.98)}

/* Morrow: an architectural editorial. */
[data-design=morrow] .site-header{position:absolute;left:5vw;right:5vw;top:20px;border-bottom:1px solid var(--rule);padding-bottom:20px;min-height:70px}
[data-design=morrow] .site-header .brand{font-size:36px}
[data-design=morrow] .site-header .action{border-radius:3px;background:var(--ink);color:var(--paper);font-size:12px;padding:11px 17px}
[data-design=morrow] .action{border-radius:3px;background:var(--ink);font-size:14px}
[data-design=morrow][data-navigation=edge] .site-header{left:25px;right:25px}
.morrow-hero{padding-top:160px}
.morrow-title{display:grid;grid-template-columns:1.3fr 1fr;gap:7vw;align-items:end;padding:30px 8vw 80px}
.morrow-title h1{font-size:clamp(70px,7.8vw,120px);line-height:.97;letter-spacing:-.055em;color:var(--hero-ink)}
.morrow-title>div{max-width:325px;padding-bottom:7px;justify-self:end}
.morrow-title p{font-size:16px;line-height:1.65;margin-bottom:27px}
.morrow-opening{height:72vw;max-height:820px;margin:0 4vw;overflow:hidden;background:#7e7c70}
.morrow-opening img{object-position:50% 53%}
.morrow-letter{display:grid;grid-template-columns:1.45fr 1fr;gap:9vw;padding:145px 9vw 130px;align-items:end}
.morrow-letter h2{font-size:clamp(44px,4.3vw,68px);line-height:1.05}
.morrow-letter p{font-size:17px;line-height:1.7;max-width:390px}
.morrow-practice{background:color-mix(in srgb,var(--paper) 82%,#aaa38e);display:grid;grid-template-columns:1fr 1.12fr;gap:10vw;padding:95px 9vw 110px}
.morrow-practice-aside h2{font-size:clamp(44px,4.2vw,64px);margin-bottom:38px}
.morrow-materials{height:460px;overflow:hidden;max-width:400px}
.morrow-materials img{object-position:30% center}
.morrow-stages article{padding:35px 0 48px;border-top:1px solid var(--rule)}
.morrow-stages h3{font-size:42px;margin-bottom:22px}
.morrow-stages p{font-size:16px;line-height:1.7;max-width:440px}
.morrow-examples{background:var(--ink);color:var(--paper);--rule:color-mix(in srgb,var(--paper) 23%,transparent);padding:115px 8vw 110px}
.morrow-example-heading{display:flex;align-items:end;justify-content:space-between;gap:70px;margin-bottom:70px}
.morrow-example-heading h2{font-size:clamp(46px,5vw,76px);max-width:690px}
.morrow-example-heading p{font-size:15px;max-width:310px;line-height:1.6}
.morrow-ledger button{display:grid;grid-template-columns:1fr 1fr 46px;gap:65px;align-items:center;width:100%;padding:28px 0;border-top:1px solid var(--rule);transition:padding .35s,background .35s}
.ledger-title{font:35px/1.06 var(--heading-font);letter-spacing:-.035em}
.ledger-summary{font-size:14px;line-height:1.55;color:color-mix(in srgb,var(--paper) 80%,transparent);max-width:390px}
.morrow-ledger button:hover{padding-left:14px;background:#fff04a04}
.morrow-ledger button:hover .round-arrow{background:var(--paper);color:var(--ink);transform:rotate(45deg)}
.morrow-ledger .round-arrow{width:44px;height:44px}
[data-design=morrow][data-work=columns] .morrow-ledger{display:grid;grid-template-columns:1fr 1fr;column-gap:60px}
[data-design=morrow][data-work=columns] .morrow-ledger button{grid-template-columns:1fr 44px;gap:20px}
[data-design=morrow][data-work=columns] .ledger-summary{display:none}
.morrow-footer{display:grid;grid-template-columns:1fr 1fr;gap:60px 9vw;padding:100px 8vw 0;align-items:center}
.morrow-footer-art{height:520px;overflow:hidden}.morrow-footer-art img{object-position:56%}
.morrow-invitation h2{font-size:clamp(60px,5.5vw,86px)}
.morrow-invitation p{font-size:16px;margin:28px 0;max-width:280px}
.morrow-footer .footer-end{grid-column:1/-1;border-top:1px solid var(--rule)}

/* Sway: objects suspended over type, a sticky material film and a flowing index. */
[data-design=sway] h1,[data-design=sway] h2,[data-design=sway] h3{font-weight:500;letter-spacing:-.065em}
[data-design=sway] .site-header{position:absolute;left:28px;right:28px;top:22px;min-height:50px}
[data-design=sway] .site-header .brand{background:#ffffff75;border:1px solid #fff9;backdrop-filter:blur(20px);border-radius:12px;padding:10px 22px;font-size:32px}
[data-design=sway] .site-header .action{background:var(--ink);color:var(--paper)}
[data-design=sway] .action{background:var(--ink);color:var(--paper);border-radius:100px;transition:background .25s,transform .25s,box-shadow .25s}
[data-design=sway] .action:hover{background:var(--accent);box-shadow:0 8px 30px color-mix(in srgb,var(--accent) 18%,transparent)}
[data-design=sway][data-navigation=edge] .site-header .brand{background:none;border-color:transparent;backdrop-filter:none;padding-left:0}
.sway-hero{min-height:940px;height:106svh;max-height:1180px;padding:80px 30px 75px;display:flex;flex-direction:column;align-items:center;position:relative;isolation:isolate}
.sway-object{width:650px;max-width:67vw;height:420px;flex-shrink:0;mix-blend-mode:multiply;mask-image:radial-gradient(ellipse 75% 65% at center,#000 55%,transparent 100%)}
.sway-object img{object-fit:contain}
.sway-title{text-align:center;position:relative;z-index:2;max-width:1100px}
.sway-title h1{font-size:clamp(60px,6.2vw,95px);line-height:.99;color:var(--hero-ink)}
.sway-title p{font-size:16px;max-width:460px;margin:27px auto 24px;line-height:1.55}
.sway-title .action{font-size:14px;padding:16px 24px}
.sway-process{display:grid;grid-template-columns:1fr 1fr;gap:9vw;padding:100px 6vw 120px;background:#f9f8f5}
.sway-process-visual{align-self:stretch;position:relative}
.sway-process-art{height:70svh;max-height:720px;min-height:480px;position:sticky;top:90px;border-radius:22px;overflow:hidden;background:#161616}
.sway-process-art img{object-position:47% center}
.sway-intro{padding:25px 0 60px}.sway-intro h2{font-size:clamp(52px,5vw,75px);line-height:.99}
.sway-intro p{font-size:16px;line-height:1.6;margin-top:25px;max-width:395px}
.sway-stage{padding:65px 0 75px;border-top:1px solid var(--rule)}
.sway-stage h3{font-size:clamp(42px,4vw,62px);line-height:1}
.sway-stage p{font-size:16px;line-height:1.65;max-width:390px;margin-top:27px}
.sway-examples{background:var(--ink);color:var(--paper);padding:110px 6vw 130px;--seam-cover:#f9f8f5}
.sway-example-heading{display:flex;justify-content:space-between;align-items:end;gap:70px;margin-bottom:65px}
.sway-example-heading h2{font-size:clamp(54px,6vw,90px);line-height:.96}
.sway-example-heading p{font-size:16px;max-width:330px;line-height:1.6}
.sway-example-cloud{display:flex;flex-wrap:wrap;gap:16px}
.sway-example-cloud button{border:1px solid color-mix(in srgb,var(--paper) 38%,transparent);padding:21px 28px;border-radius:100px;display:flex;justify-content:space-between;align-items:center;gap:40px;min-height:78px;font-size:clamp(24px,2.3vw,36px);letter-spacing:-.04em;transition:background .3s,color .3s,transform .3s,border-color .3s}
.sway-example-cloud button>span:last-child{font-size:27px;transition:transform .3s}
.sway-example-cloud button:hover,.sway-example-cloud button:focus-visible{background:var(--paper);color:var(--ink);border-color:var(--paper);transform:translateY(-3px)}
.sway-example-cloud button:hover>span:last-child{transform:rotate(45deg)}
.sway-example-cloud button:nth-child(4n+2){background:#ffffff0a}
.sway-example-cloud button:nth-child(4n+2):hover{background:var(--accent);color:#fff;border-color:var(--accent)}
[data-design=sway][data-work=columns] .sway-example-cloud{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
[data-design=sway][data-work=columns] .sway-example-cloud button{font-size:22px;gap:18px;border-radius:10px}
.sway-footer{padding:105px 6vw 0;display:grid;grid-template-columns:1.1fr 1fr;gap:65px 6vw;align-items:center}
.sway-finish h2{font-size:clamp(57px,6.1vw,94px);line-height:.97;max-width:650px}
.sway-finish .action{margin-top:36px}.sway-finish p{max-width:330px;margin-top:28px;font-size:15px;line-height:1.6}
.sway-footer-art{height:460px;overflow:hidden;border-radius:20px}
.sway-footer-art img{object-position:30% center}
.sway-footer .footer-end{grid-column:1/-1;border-top:1px solid var(--rule)}

@media(min-width:1600px){.morrow-title{padding-inline:10vw}.sway-hero{min-height:1040px}.sway-object{height:470px;width:750px}.morrow-practice,.morrow-letter{padding-inline:11vw}}
@media(max-width:1099px){
 .grove-letter{grid-template-columns:1fr 215px;gap:40px}.grove-practice-copy h2{font-size:33px}
 .patio-feature-image{height:270px}.patio-feature:nth-child(2) .patio-feature-image{height:295px}.patio-feature:nth-child(3) .patio-feature-image{height:250px}.patio-feature-title{font-size:25px}.patio-features{gap:21px}
 .mono-gallery{height:530px}.mono-photo>img{height:280px}.mono-photo:nth-child(2)>img{height:390px}.mono-gallery-track{gap:25px}.mono-footer-art{height:340px}
 .morrow-title{padding:30px 6vw 65px;gap:4vw;grid-template-columns:1.2fr 1fr}.morrow-title h1{font-size:78px}.morrow-title>div{max-width:250px}.morrow-title p{font-size:15px}
 .morrow-letter{padding:95px 7vw;gap:6vw}.morrow-letter h2{font-size:46px}.morrow-letter p{font-size:16px}
 .morrow-practice{padding:85px 7vw;gap:7vw}.morrow-materials{height:390px}.morrow-stages h3{font-size:35px}.morrow-stages p{font-size:15px}.morrow-example-heading{gap:40px}.morrow-example-heading h2{font-size:55px}
 .morrow-ledger button{gap:30px;grid-template-columns:1fr 1fr 44px}.ledger-title{font-size:30px}.ledger-summary{font-size:13px}.morrow-footer{padding:80px 7vw 0;gap:50px}.morrow-invitation h2{font-size:65px}.morrow-footer-art{height:440px}
 .sway-hero{height:auto;min-height:940px;padding-top:90px}.sway-object{height:395px;max-width:78vw}.sway-title h1{font-size:66px}.sway-process{gap:5vw;padding-inline:5vw}.sway-process-art{min-height:420px;height:60svh}.sway-intro h2{font-size:53px}.sway-stage h3{font-size:44px}.sway-example-heading h2{font-size:61px}.sway-example-heading{gap:40px}.sway-example-heading p{max-width:270px}.sway-example-cloud{gap:13px}.sway-example-cloud button{font-size:28px;padding:19px 24px;gap:28px}.sway-footer-art{height:360px}.sway-finish h2{font-size:62px}
}
@media(max-width:699px){
 .grove-world{--scene-position:46% center}.grove-letter{grid-template-columns:1fr;gap:34px}.grove-inset{width:76%;aspect-ratio:1.06}.grove-practice-copy h2{font-size:35px}
 .patio-features{gap:32px}.patio-feature:nth-child(2),.patio-feature:nth-child(3){padding-top:0}.patio-feature-image,.patio-feature:nth-child(2) .patio-feature-image,.patio-feature:nth-child(3) .patio-feature-image{height:330px}.patio-feature-title{font-size:30px}.patio-hero-art{border-top-left-radius:90px}
 .mono-gallery{height:auto}.mono-gallery-track{gap:20px;padding-inline:23px}.mono-photo{width:75vw}.mono-photo>img,.mono-photo:nth-child(2)>img{height:370px}.mono-photo>span{font-size:14px}.mono-footer-art{height:335px}
 [data-design=morrow] .site-header{left:23px;right:23px;top:18px;padding-bottom:17px;min-height:50px}.morrow-hero{padding-top:110px}.morrow-title{grid-template-columns:1fr;padding:25px 25px 42px;gap:28px}.morrow-title h1{font-size:65px;line-height:.99}.morrow-title>div{justify-self:start;max-width:320px}.morrow-title p{font-size:15px;margin-bottom:22px}.morrow-title .action{font-size:13px}.morrow-opening{height:510px;max-height:none;margin:0 12px}.morrow-opening img{object-position:57%}
 .morrow-letter{grid-template-columns:1fr;gap:30px;padding:85px 26px 80px}.morrow-letter h2{font-size:43px;line-height:1.05}.morrow-letter p{font-size:16px;line-height:1.65}
 .morrow-practice{padding:65px 26px 45px;grid-template-columns:1fr;gap:38px}.morrow-practice-aside h2{font-size:45px;margin-bottom:30px}.morrow-materials{height:340px;max-width:none;aspect-ratio:auto}.morrow-materials img{object-position:28% 50%}.morrow-stages article{padding:28px 0 35px}.morrow-stages h3{font-size:34px;margin-bottom:18px}.morrow-stages p{font-size:16px}
 .morrow-examples{padding:75px 26px 70px}.morrow-example-heading{display:block;margin-bottom:40px}.morrow-example-heading h2{font-size:46px;line-height:1.04}.morrow-example-heading p{font-size:15px;margin-top:25px;max-width:315px}.morrow-ledger button{grid-template-columns:1fr 44px;gap:20px;padding:26px 0}.ledger-title{font-size:31px}.ledger-summary{display:none}[data-design=morrow][data-work=columns] .morrow-ledger{grid-template-columns:1fr}
 .morrow-footer{padding:65px 26px 0;grid-template-columns:1fr;gap:40px}.morrow-footer-art{height:330px;order:2}.morrow-invitation{order:1}.morrow-invitation h2{font-size:61px}.morrow-invitation p{font-size:16px;margin:25px 0}.morrow-invitation .action{font-size:13px}.morrow-footer .footer-end{order:3}
 [data-design=sway] .site-header{top:18px;left:20px;right:20px}[data-design=sway] .site-header .brand{font-size:28px;padding:9px 15px}.sway-hero{min-height:790px;padding:90px 23px 65px;height:auto;max-height:none}.sway-object{width:520px;max-width:110vw;height:310px;mask-image:radial-gradient(ellipse 72% 65% at center,#000 55%,transparent 100%)}.sway-title h1{font-size:46px;letter-spacing:-.065em;line-height:1.03}.sway-title p{font-size:15px;max-width:305px;margin:24px auto}.sway-title .action{font-size:13px}
 .sway-process{padding:65px 24px 45px;grid-template-columns:1fr;gap:40px}.sway-process-visual{order:2}.sway-process-art{height:410px;min-height:0;position:relative;top:0;border-radius:16px}.sway-process-words{display:contents}.sway-intro{order:1;padding:0}.sway-intro h2{font-size:47px}.sway-intro p{font-size:16px;margin-top:22px}.sway-stage{order:3;padding:8px 0 30px;border:0}.sway-stage+.sway-stage{border-top:1px solid var(--rule);padding-top:30px}.sway-stage h3{font-size:38px}.sway-stage p{font-size:16px;margin-top:22px}
 .sway-examples{padding:75px 24px 80px}.sway-example-heading{display:block;margin-bottom:36px}.sway-example-heading h2{font-size:51px}.sway-example-heading p{font-size:15px;margin-top:25px;max-width:295px}.sway-example-cloud,[data-design=sway][data-work=columns] .sway-example-cloud{display:flex;flex-direction:column;gap:12px}.sway-example-cloud button,[data-design=sway][data-work=columns] .sway-example-cloud button{font-size:23px;line-height:1.2;padding:20px 23px;gap:22px;border-radius:60px;min-height:72px}.sway-example-cloud button>span:last-child{font-size:25px}
 .sway-footer{padding:75px 24px 0;grid-template-columns:1fr;gap:38px}.sway-finish h2{font-size:54px}.sway-finish .action{font-size:13px;margin-top:28px}.sway-finish p{font-size:15px}.sway-footer-art{height:315px;border-radius:16px}.sway-footer .footer-end{margin-top:0}
}
@media(prefers-reduced-motion:reduce){.depth-plane{transform:scale(1.08)!important;will-change:auto}.seam-curtain{display:none}.series-optics{display:none}}
[data-motion=false] .depth-plane{transform:scale(1.08)!important;will-change:auto}[data-motion=false] .seam-curtain{display:none}

/* Keep the headline in the sky rather than over pale architecture. */
.grove-title{top:9%;left:56%}.grove-title h1{font-size:clamp(50px,5vw,76px)}
@media(min-width:700px) and (max-width:1099px){.grove-title{top:100px;left:54%}.grove-title h1{font-size:58px}}
@media(max-width:699px){.grove-title{top:95px;left:50%}.grove-title h1{font-size:42px}}

/* Grove's first editorial picture opens to the page width instead of a tilted card. */
[data-design=grove][data-grove-image-reveal=mask] .grove-letter{grid-template-columns:1fr;gap:55px;max-width:1340px}
[data-design=grove][data-grove-image-reveal=mask] .grove-inset{width:100%;aspect-ratio:1.85;max-height:660px;justify-self:stretch;border:0;border-radius:0;box-shadow:none;transform:none;margin:0;overflow:hidden}
[data-design=grove][data-grove-image-reveal=mask] .grove-inset img{width:100%;height:100%;object-fit:cover}
@media(max-width:699px){[data-design=grove][data-grove-image-reveal=mask] .grove-letter{gap:35px}[data-design=grove][data-grove-image-reveal=mask] .grove-inset{aspect-ratio:1.15}}