/* These hosts receive their physical size and placement from the device frames. */
.website-demo-screen{container-type:inline-size;overflow:hidden;isolation:isolate;background:#eee9df}
.showcase-frame{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;background:#eee9df;color:#39372f;text-align:left;opacity:0;transition:opacity .85s ease;pointer-events:none;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;line-height:1.2;letter-spacing:normal}
.showcase-frame.is-active{opacity:1;z-index:1}
.showcase-nav{height:15%;flex:none;padding:0 5.5%;display:flex;align-items:center;justify-content:space-between;gap:5%;border-bottom:.13cqw solid #51473113}
.showcase-brand{display:flex;align-items:baseline;gap:.8cqw;font-size:3cqw;line-height:1;font-weight:650;letter-spacing:-.11cqw;white-space:nowrap}
.showcase-brand>span{font-size:1.75cqw;font-weight:400;letter-spacing:-.06cqw}
.showcase-links{font-size:1.45cqw;white-space:nowrap;color:#726d62}
.showcase-menu{display:none;width:7cqw;height:3.4cqw;border-top:.6cqw solid currentColor;border-bottom:.6cqw solid currentColor}
.showcase-hero{flex:1;min-height:0;display:grid;grid-template-columns:51% 49%;position:relative}
.showcase-copy{position:relative;z-index:1;min-width:0;display:flex;align-items:flex-start;flex-direction:column;justify-content:center;padding:5% 0 5% 10.8%}
.showcase-eyebrow{font-size:1.22cqw;letter-spacing:.12cqw;line-height:1.4;font-weight:500;color:#7c766a;white-space:nowrap}
.showcase-heading{font-family:Georgia,'Times New Roman',serif;font-size:7.6cqw;letter-spacing:-.4cqw;line-height:.98;font-weight:400;margin:2cqw 0 1.55cqw}
.showcase-heading em{font-weight:inherit;font-style:italic}
.showcase-description{font-size:1.55cqw;line-height:1.4;color:#7a7569;white-space:nowrap}
.showcase-action{display:flex;align-items:center;gap:2.5cqw;font-size:1.45cqw;line-height:1.2;font-weight:500;margin-top:2.3cqw;padding-bottom:.5cqw;border-bottom:.13cqw solid #5c554977;white-space:nowrap}
.showcase-action>span{font-size:2cqw;line-height:1}
.showcase-art{position:relative;overflow:hidden;min-height:0;margin:3.2% 6% 3.2% 0;background:#d9cbb6}
.showcase-art>svg{display:block;width:100%;height:100%;object-fit:cover}
.showcase-footer{height:9%;flex:none;display:flex;justify-content:space-between;align-items:center;padding:0 5.5%;font-size:1.2cqw;letter-spacing:.015cqw;color:#878073;border-top:.13cqw solid #51473113}

/* A vivid independent creative studio: large grotesk type, cobalt and coral. */
.showcase-studio{background:#ff6b54;color:#2721b7}
.showcase-studio .showcase-nav{border-color:#2922dc24}
.showcase-studio .showcase-brand{font-size:2.65cqw;font-weight:800;letter-spacing:-.12cqw;gap:.7cqw}
.showcase-studio .showcase-brand>span{font-size:2.65cqw;font-weight:800}
.showcase-studio .showcase-links,.showcase-studio .showcase-eyebrow,.showcase-studio .showcase-description{color:#502d75}
.showcase-studio .showcase-heading{font-family:inherit;font-weight:800;letter-spacing:-.52cqw;font-size:7.5cqw;line-height:.95;margin-top:2.5cqw}
.showcase-studio .showcase-heading em{font-style:normal;color:#fdf0d9}
.showcase-studio .showcase-action{background:#2922dc;color:#fff1df;border:0;padding:1.2cqw 1.7cqw;border-radius:5cqw;font-size:1.35cqw;margin-top:2.2cqw;gap:1.8cqw}
.showcase-studio .showcase-art{background:#fd654e;margin:0}
.showcase-studio .showcase-art>svg{height:100%;transform:scale(1.08)}
.showcase-studio .showcase-footer{color:#572d6f;border-color:#2922dc24}

/* A calm botanical collection, with its own quiet product photography language. */
.showcase-botanic{background:#e9eddf;color:#254936}
.showcase-botanic .showcase-brand{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:3.75cqw;gap:1.1cqw}
.showcase-botanic .showcase-brand>span{font-family:Arial,sans-serif;letter-spacing:.15cqw;font-size:.8cqw}
.showcase-botanic .showcase-links,.showcase-botanic .showcase-eyebrow,.showcase-botanic .showcase-description{color:#617363}
.showcase-botanic .showcase-heading{font-size:7.5cqw;letter-spacing:-.35cqw}
.showcase-botanic .showcase-art{margin:3.2% 6% 3.2% 0;background:#b9c5a1;border-radius:20cqw 20cqw 1.5cqw 1.5cqw}
.showcase-botanic .showcase-action{background:#35543e;color:#f2f0e4;border:0;padding:1.1cqw 1.7cqw;border-radius:4cqw;font-size:1.35cqw;gap:1.5cqw}
.showcase-botanic .showcase-footer{color:#6b7b68;border-color:#34583d20}

/* A dark technology study: an electric violet object on an almost-black page. */
.showcase-future{background:#110f1e;color:#f3edff}
.showcase-future .showcase-brand{font-weight:750;font-size:3.5cqw;letter-spacing:-.16cqw;gap:.4cqw}
.showcase-future .showcase-brand>span{align-self:flex-start;font-size:1.3cqw;margin-top:.2cqw;color:#b99bdd}
.showcase-future .showcase-nav{border-color:#ab91dd24}
.showcase-future .showcase-links,.showcase-future .showcase-description{color:#a39bb7}
.showcase-future .showcase-eyebrow{color:#b899e7;font-size:1.12cqw;letter-spacing:.09cqw}
.showcase-future .showcase-heading{font-family:inherit;font-weight:600;font-size:7.3cqw;letter-spacing:-.4cqw;line-height:1.02}
.showcase-future .showcase-heading em{font-style:normal;color:#ba97ef}
.showcase-future .showcase-action{border:0;background:#c4a7f1;color:#231436;border-radius:4cqw;padding:1.1cqw 1.8cqw;font-size:1.35cqw;gap:1.5cqw}
.showcase-future .showcase-art{margin:0;background:#17132c}
.showcase-future .showcase-footer{border-color:#ab91dd24;color:#80778f}

/* Portrait screens rearrange the site. Text remains above the visual, while
   desktop uses an editorial split layout. These sizes follow each screen,
   never the surrounding browser viewport. */
.website-demo-screen[data-device="tablet"] .showcase-nav,
.website-demo-screen[data-device="phone"] .showcase-nav{height:12%;padding:0 8%;border-width:.35cqw}
.website-demo-screen[data-device="tablet"] .showcase-brand,
.website-demo-screen[data-device="phone"] .showcase-brand{font-size:7cqw;letter-spacing:-.25cqw;gap:1.4cqw}
.website-demo-screen[data-device="tablet"] .showcase-brand>span,
.website-demo-screen[data-device="phone"] .showcase-brand>span{font-size:3.6cqw;letter-spacing:-.1cqw}
.website-demo-screen[data-device="tablet"] .showcase-links,
.website-demo-screen[data-device="phone"] .showcase-links{display:none}
.website-demo-screen[data-device="tablet"] .showcase-menu,
.website-demo-screen[data-device="phone"] .showcase-menu{display:block}
.website-demo-screen[data-device="tablet"] .showcase-hero,
.website-demo-screen[data-device="phone"] .showcase-hero{display:grid;grid-template-columns:1fr;grid-template-rows:53% 47%}
.website-demo-screen[data-device="tablet"] .showcase-copy,
.website-demo-screen[data-device="phone"] .showcase-copy{padding:5% 8% 4%;justify-content:center}
.website-demo-screen[data-device="tablet"] .showcase-eyebrow,
.website-demo-screen[data-device="phone"] .showcase-eyebrow{font-size:2.6cqw;letter-spacing:.12cqw}
.website-demo-screen[data-device="tablet"] .showcase-heading,
.website-demo-screen[data-device="phone"] .showcase-heading{font-size:14cqw;line-height:.97;letter-spacing:-.6cqw;margin:3cqw 0 2.3cqw}
.website-demo-screen[data-device="tablet"] .showcase-description,
.website-demo-screen[data-device="phone"] .showcase-description{font-size:2.6cqw;line-height:1.3}
.website-demo-screen[data-device="tablet"] .showcase-action,
.website-demo-screen[data-device="phone"] .showcase-action{font-size:2.7cqw;line-height:1.1;margin-top:3.1cqw;gap:3cqw;padding-bottom:.6cqw;border-width:.3cqw}
.website-demo-screen[data-device="tablet"] .showcase-action>span,
.website-demo-screen[data-device="phone"] .showcase-action>span{font-size:3.5cqw}
.website-demo-screen[data-device="tablet"] .showcase-art,
.website-demo-screen[data-device="phone"] .showcase-art{margin:0 8% 5%;border-radius:0}
.website-demo-screen[data-device="tablet"] .showcase-art>svg,
.website-demo-screen[data-device="phone"] .showcase-art>svg{position:absolute;inset:-23% 0;width:100%;height:145%}
.website-demo-screen[data-device="tablet"] .showcase-footer,
.website-demo-screen[data-device="phone"] .showcase-footer{height:7%;padding:0 8%;font-size:2.15cqw;letter-spacing:0;border-width:.3cqw}
.website-demo-screen[data-device="tablet"] .showcase-footer>span:last-child,
.website-demo-screen[data-device="phone"] .showcase-footer>span:last-child{display:none}
.website-demo-screen[data-device="tablet"] .showcase-studio .showcase-brand>span,
.website-demo-screen[data-device="phone"] .showcase-studio .showcase-brand>span{font-size:6.2cqw;font-weight:800;letter-spacing:-.25cqw}
.website-demo-screen[data-device="tablet"] .showcase-botanic .showcase-brand>span,
.website-demo-screen[data-device="phone"] .showcase-botanic .showcase-brand>span{font-size:1.8cqw;letter-spacing:.2cqw}
.website-demo-screen[data-device="tablet"] .showcase-future .showcase-brand>span,
.website-demo-screen[data-device="phone"] .showcase-future .showcase-brand>span{font-size:3cqw}
.website-demo-screen[data-device="tablet"] :is(.showcase-studio,.showcase-botanic,.showcase-future) .showcase-action,
.website-demo-screen[data-device="phone"] :is(.showcase-studio,.showcase-botanic,.showcase-future) .showcase-action{padding:1.7cqw 2.8cqw;border-radius:6cqw;font-size:2.4cqw}
.website-demo-screen[data-device="tablet"] .showcase-botanic .showcase-art,
.website-demo-screen[data-device="phone"] .showcase-botanic .showcase-art{border-radius:30cqw 30cqw 2cqw 2cqw}
.website-demo-screen[data-device="phone"] .showcase-nav{height:13%;padding-top:4%}
.website-demo-screen[data-device="phone"] .showcase-hero{grid-template-rows:50% 50%}
.website-demo-screen[data-device="phone"] .showcase-heading{font-size:16cqw;letter-spacing:-.7cqw;margin:4cqw 0 3cqw}
.website-demo-screen[data-device="phone"] .showcase-eyebrow{font-size:2.75cqw}
.website-demo-screen[data-device="phone"] .showcase-description{font-size:2.7cqw}
.website-demo-screen[data-device="phone"] .showcase-action{font-size:2.9cqw;margin-top:4cqw}
.website-demo-screen[data-device="phone"] .showcase-footer{height:7%;font-size:2.35cqw;padding-bottom:3%}
.website-demo-screen[data-device="phone"] .showcase-art>svg{inset:-2% -20%;width:140%;height:105%}
@media(prefers-reduced-motion:reduce){.showcase-frame{transition:none}}
