/* Original CSS-native website concepts; scoped so the studio and portal retain their own styles. */
.sample-site{--s-bg:#f3f3e8;--s-ink:#2a4738;--s-accent:#a8bd7c;--s-soft:#e0e5cf;--s-contrast:#fbfcf5;container-type:inline-size;position:relative;background:var(--s-bg);color:var(--s-ink);overflow:hidden;font-family:'DM Sans',sans-serif}.sample-inner{padding:3.4cqw 4cqw 3.2cqw}.sample-nav{display:flex;justify-content:space-between;align-items:center;gap:3cqw;padding-bottom:3.4cqw;border-bottom:1px solid color-mix(in srgb,var(--s-ink) 16%,transparent);font-size:1.22cqw;letter-spacing:.12cqw}.sample-nav b{font-size:2cqw;letter-spacing:.14cqw;font-weight:700;white-space:nowrap}.sample-nav b span{font-size:1cqw;margin-left:.4cqw;vertical-align:super}.sample-nav>span:last-child{border:1px solid color-mix(in srgb,var(--s-ink) 25%,transparent);padding:.8cqw 1.2cqw}.sample-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:3cqw;align-items:center;position:relative;min-height:37cqw;padding:3.8cqw 0}.sample-copy{position:relative;z-index:2}.sample-copy>small{font-size:1.08cqw;letter-spacing:.18cqw;display:block}.sample-copy :is(h1,h3){font-size:7.4cqw;line-height:1.05;font-weight:500;letter-spacing:-.28cqw;margin:2.3cqw 0 2cqw}.sample-copy :is(h1,h3) em{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-style:italic}.sample-copy p{font-size:1.5cqw;line-height:1.7;margin:0 0 2.6cqw;opacity:.68;max-width:34cqw}.sample-cta{display:inline-block;background:var(--s-ink);color:var(--s-bg);border-radius:.2cqw;padding:1.4cqw 2.1cqw;font-size:1.3cqw;white-space:nowrap}.sample-art{height:31cqw;position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate}.art-caption{position:absolute;bottom:0;left:0;right:0;text-align:center;letter-spacing:.1cqw;font-size:.88cqw;opacity:.55}.art-object{position:relative;width:29cqw;height:27cqw}.art-object i{position:absolute;display:block}.sample-modules{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:2cqw;border-top:1px solid color-mix(in srgb,var(--s-ink) 16%,transparent);padding-top:2.5cqw}.sample-modules:empty{display:none}.sample-module{padding:1.5cqw;background:var(--s-soft);min-width:0}.sample-module small{font-size:.85cqw;letter-spacing:.08cqw;display:block;opacity:.65}.sample-module b{font-weight:500;font-size:1.7cqw;display:block;line-height:1.4;margin:1cqw 0}.sample-module>span{font-size:.95cqw;opacity:.65;display:block;line-height:1.6}.module-contact{background:var(--s-ink);color:var(--s-bg)}
.sample-site[data-style=minimal] .art-object i:first-child{inset:0 4cqw 0 4cqw;border-radius:12cqw 12cqw .2cqw .2cqw;background:repeating-linear-gradient(90deg,var(--s-accent) 0, color-mix(in srgb,var(--s-accent) 65%,var(--s-bg)) .6cqw,var(--s-accent) 1.1cqw);transform:rotate(-14deg);box-shadow:2cqw 2cqw 3cqw #183d3312}.sample-site[data-style=minimal] .art-object i:nth-child(2){inset:3cqw 3cqw 3cqw 3cqw;border:4cqw solid var(--s-ink);border-radius:50%;transform:rotate(25deg) scaleX(.74)}
.sample-site[data-style=tech]{--s-bg:#111b23;--s-ink:#e9f5e8;--s-accent:#b8e869;--s-soft:#23332c;--s-contrast:#13211b}.sample-site[data-style=tech] .sample-copy :is(h1,h3){font-size:7cqw;font-weight:700;letter-spacing:-.25cqw}.sample-site[data-style=tech] .sample-cta{background:var(--s-accent);color:var(--s-bg);border-radius:3cqw}.sample-site[data-style=tech] .sample-copy :is(h1,h3) em{font-family:inherit;font-style:normal}.sample-site[data-style=tech] .sample-art{background:radial-gradient(ellipse,color-mix(in srgb,var(--s-accent) 13%,transparent),transparent 70%)}.sample-site[data-style=tech] .art-object{width:27cqw;height:27cqw;border:1px solid var(--s-accent);border-radius:50%;background:repeating-linear-gradient(0deg,transparent 0,transparent 1.8cqw,color-mix(in srgb,var(--s-accent) 25%,transparent) 1.9cqw,transparent 2cqw)}.sample-site[data-style=tech] .art-object i{inset:0;border:1px solid var(--s-accent);border-radius:50%;transform:scaleX(.65) rotate(20deg);opacity:.7}.sample-site[data-style=tech] .art-object i:nth-child(2){transform:scaleX(.3)}.sample-site[data-style=tech] .art-object i:nth-child(3){transform:scaleX(.6) rotate(-20deg)}.sample-site[data-style=tech] .art-object i:nth-child(4){inset:10cqw -4cqw;border-color:var(--s-ink);transform:rotate(-20deg);opacity:.45}.sample-site[data-style=tech] .art-object i:nth-child(n+5){display:none}
.sample-site[data-style=business]{--s-bg:#edf2f6;--s-ink:#243c60;--s-accent:#8cacc9;--s-soft:#dae4ed}.sample-site[data-style=business] .sample-copy :is(h1,h3){font-size:6.1cqw;font-weight:600;line-height:1.12}.sample-site[data-style=business] .sample-copy :is(h1,h3) em{font-style:normal;font-family:inherit;color:color-mix(in srgb,var(--s-ink) 50%,var(--s-accent))}.sample-site[data-style=business] .art-object{height:29cqw;background:linear-gradient(145deg,var(--s-soft),var(--s-bg));overflow:hidden}.sample-site[data-style=business] .art-object i{width:8cqw;bottom:-3cqw;height:28cqw;left:4cqw;background:repeating-linear-gradient(0deg,var(--s-accent) 0,var(--s-accent) 1.8cqw,var(--s-bg) 1.9cqw,var(--s-bg) 2.1cqw);transform:skewY(-17deg);border-left:.7cqw solid var(--s-ink)}.sample-site[data-style=business] .art-object i:nth-child(2){left:12cqw;height:35cqw;background:repeating-linear-gradient(0deg,var(--s-ink) 0,var(--s-ink) 1.8cqw,var(--s-accent) 1.9cqw,var(--s-accent) 2.1cqw);transform:skewY(17deg)}.sample-site[data-style=business] .art-object i:nth-child(3){left:21cqw;height:21cqw;background:var(--s-accent);transform:skewY(-17deg)}.sample-site[data-style=business] .art-object i:nth-child(n+4){display:none}
.sample-site[data-style=editorial]{--s-bg:#f5eee4;--s-ink:#33382c;--s-accent:#af552e;--s-soft:#e7ddcb}.sample-site[data-style=editorial] .sample-nav{border-bottom:2px solid var(--s-ink)}.sample-site[data-style=editorial] .sample-nav b{font-family:Georgia,serif;font-size:2.3cqw}.sample-site[data-style=editorial] .sample-copy :is(h1,h3){font-family:Georgia,serif;font-size:7.8cqw;letter-spacing:-.2cqw}.sample-site[data-style=editorial] .sample-copy :is(h1,h3) em{color:var(--s-accent)}.sample-site[data-style=editorial] .sample-cta{background:none;color:var(--s-ink);border-bottom:1px solid var(--s-ink);padding:0 0 .7cqw}.sample-site[data-style=editorial] .art-object{width:24cqw;height:28cqw;background:var(--s-accent);transform:rotate(6deg);box-shadow:1.6cqw 1.6cqw 0 var(--s-soft)}.sample-site[data-style=editorial] .art-object:before{content:'FIELD / 01';position:absolute;left:2cqw;top:2cqw;font-size:1cqw;letter-spacing:.25cqw;color:var(--s-bg)}.sample-site[data-style=editorial] .art-object i:first-child{width:18cqw;height:18cqw;left:3cqw;top:6cqw;border-radius:50%;background:var(--s-bg)}.sample-site[data-style=editorial] .art-object i:nth-child(2){width:9cqw;height:18cqw;left:7.5cqw;top:6cqw;border-radius:50%;background:var(--s-ink);transform:rotate(30deg)}
.sample-site[data-style=organic]{--s-bg:#f2eadc;--s-ink:#4c583a;--s-accent:#bf865e;--s-soft:#e1e3cc}.sample-site[data-style=organic] .sample-copy :is(h1,h3){font-family:Georgia,serif;font-size:7.3cqw;line-height:1.03}.sample-site[data-style=organic] .sample-cta{border-radius:5cqw}.sample-site[data-style=organic] .art-object{width:28cqw;height:28cqw;background:var(--s-soft);border-radius:50% 46% 42% 48%}.sample-site[data-style=organic] .art-object i:first-child{height:20cqw;width:2px;left:14cqw;bottom:1cqw;background:var(--s-ink);transform:rotate(-12deg)}.sample-site[data-style=organic] .art-object i:nth-child(2){width:13cqw;height:8cqw;left:1.6cqw;top:8cqw;background:var(--s-ink);border-radius:0 90% 0 90%;transform:rotate(8deg)}.sample-site[data-style=organic] .art-object i:nth-child(3){width:12cqw;height:8cqw;left:13cqw;top:4cqw;background:var(--s-accent);border-radius:90% 0 90% 0;transform:rotate(-14deg)}.sample-site[data-style=organic] .art-object i:nth-child(4){width:10cqw;height:7cqw;left:13cqw;top:15cqw;background:var(--s-accent);border-radius:90% 0 90% 0;transform:rotate(6deg)}
.sample-site[data-style=creative]{--s-bg:#d3dbfd;--s-ink:#2645c0;--s-accent:#f5a0b8;--s-soft:#b9c9ee}.sample-site[data-style=creative] .sample-copy :is(h1,h3){font-size:8.4cqw;font-weight:700;letter-spacing:-.38cqw;line-height:.97}.sample-site[data-style=creative] .sample-copy :is(h1,h3) em{font-style:normal;font-family:inherit;-webkit-text-stroke:.14cqw var(--s-ink);color:transparent}.sample-site[data-style=creative] .art-object{transform:rotate(-15deg)}.sample-site[data-style=creative] .art-object i:first-child{width:24cqw;height:24cqw;left:3cqw;top:1cqw;background:var(--s-accent);border-radius:50%}.sample-site[data-style=creative] .art-object i:nth-child(2){width:23cqw;height:5cqw;left:0;top:12cqw;background:var(--s-ink);transform:rotate(-35deg)}.sample-site[data-style=creative] .art-object i:nth-child(3){width:13cqw;height:13cqw;right:1cqw;top:3cqw;border-top:5cqw solid var(--s-ink);border-right:5cqw solid var(--s-ink);transform:rotate(10deg)}.sample-site[data-style=creative] .sample-cta{border-radius:0;box-shadow:.5cqw .5cqw 0 var(--s-accent)}
.sample-site[data-style=luxury]{--s-bg:#262b26;--s-ink:#efe5c9;--s-accent:#bfa373;--s-soft:#3c4236}.sample-site[data-style=luxury] .sample-inner{padding-inline:5cqw}.sample-site[data-style=luxury] .sample-nav b{letter-spacing:.5cqw;font-weight:400}.sample-site[data-style=luxury] .sample-copy :is(h1,h3){font-family:Georgia,serif;font-size:7.1cqw;line-height:1.18;letter-spacing:-.15cqw}.sample-site[data-style=luxury] .sample-copy :is(h1,h3) em{color:var(--s-accent)}.sample-site[data-style=luxury] .sample-cta{border:1px solid var(--s-accent);background:none;color:var(--s-ink);letter-spacing:.1cqw}.sample-site[data-style=luxury] .art-object i:first-child{inset:0 5cqw;border:1px solid var(--s-accent);border-radius:14cqw 14cqw 0 0;box-shadow:inset 0 0 3cqw color-mix(in srgb,var(--s-accent) 20%,transparent)}.sample-site[data-style=luxury] .art-object i:nth-child(2){inset:3cqw 8cqw;border:1px solid var(--s-accent);border-radius:14cqw 14cqw 0 0}.sample-site[data-style=luxury] .art-object i:nth-child(3){width:8cqw;height:8cqw;left:10.5cqw;top:9cqw;border:1.3cqw solid var(--s-accent);transform:rotate(45deg)}.sample-site[data-style=luxury] .art-object i:nth-child(4){width:1px;height:27cqw;left:14.5cqw;top:0;background:var(--s-accent);opacity:.4}
.sample-site[data-style=product]{--s-bg:#eef0fc;--s-ink:#333c8c;--s-accent:#eaaa72;--s-soft:#dce0f2}.sample-site[data-style=product] .sample-copy :is(h1,h3){font-size:6.4cqw;line-height:1.08;font-weight:600}.sample-site[data-style=product] .sample-copy :is(h1,h3) em{font-style:normal;font-family:inherit}.sample-site[data-style=product] .sample-cta{border-radius:1cqw}.sample-site[data-style=product] .art-object{border-radius:1.5cqw;background:var(--s-bg);border:1px solid var(--s-soft);box-shadow:0 1.5cqw 4cqw color-mix(in srgb,var(--s-ink) 14%,transparent);transform:rotate(-5deg)}.sample-site[data-style=product] .art-object:before{content:'YOUR WORKSPACE';display:block;font-size:1cqw;padding:1.7cqw;border-bottom:1px solid var(--s-soft);letter-spacing:.1cqw}.sample-site[data-style=product] .art-object i:first-child{left:2cqw;top:6cqw;width:25cqw;height:6cqw;background:var(--s-soft);border-radius:.8cqw}.sample-site[data-style=product] .art-object i:nth-child(2){left:2cqw;bottom:2cqw;width:11cqw;height:11cqw;background:var(--s-ink);border-radius:.8cqw}.sample-site[data-style=product] .art-object i:nth-child(3){right:2cqw;bottom:2cqw;width:12cqw;height:11cqw;background:var(--s-accent);border-radius:.8cqw}.sample-site[data-style=product] .art-object i:nth-child(4){width:8cqw;height:4cqw;right:4cqw;top:7cqw;background:var(--s-accent);border-radius:.5cqw}
/* Colors, layout, typography and content are independent design axes. */
.sample-site[data-palette=forest]{--s-bg:#eef3e6;--s-ink:#214d3d;--s-accent:#a6c783;--s-soft:#d8e5cd}.sample-site[data-palette=navy]{--s-bg:#eef2f6;--s-ink:#243a59;--s-accent:#97b3cb;--s-soft:#dae4ed}.sample-site[data-palette=sand]{--s-bg:#f5ebdf;--s-ink:#694d3e;--s-accent:#c69978;--s-soft:#ead9c7}.sample-site[data-palette=gold]{--s-bg:#242824;--s-ink:#efebda;--s-accent:#c1a678;--s-soft:#3e4436}.sample-site[data-palette=electric]{--s-bg:#edf0ff;--s-ink:#3555c6;--s-accent:#91aae9;--s-soft:#d6dffc}.sample-site[data-palette=coral]{--s-bg:#fff3e8;--s-ink:#8c493e;--s-accent:#e6a57e;--s-soft:#f3d8c3}
.sample-site[data-layout=center] .sample-hero{grid-template-columns:1fr;min-height:37cqw;text-align:center;gap:0;padding:4cqw 0 3cqw}.sample-site[data-layout=center] .sample-copy{max-width:100%}.sample-site[data-layout=center] .sample-copy :is(h1,h3){font-size:6.4cqw;margin-block:1.8cqw}.sample-site[data-layout=center] .sample-copy :is(h1,h3) br{display:none}.sample-site[data-layout=center] .sample-copy p{max-width:none}.sample-site[data-layout=center] .sample-art{height:15cqw;margin-top:3cqw}.sample-site[data-layout=center] .art-object{transform:scale(.49);position:absolute;top:-6cqw}.sample-site[data-layout=center] .art-caption{bottom:-.5cqw}
.sample-site[data-layout=poster] .sample-hero{display:block;min-height:39cqw;padding:5cqw 3cqw;overflow:hidden;background:var(--s-soft);margin-top:3cqw}.sample-site[data-layout=poster] .sample-copy{max-width:70%;position:relative}.sample-site[data-layout=poster] .sample-copy :is(h1,h3){font-size:7.2cqw}.sample-site[data-layout=poster] .sample-art{position:absolute;right:1cqw;top:3cqw;width:38cqw;height:33cqw;opacity:.32}.sample-site[data-layout=poster] .art-caption{display:none}.sample-site[data-layout=poster] .sample-modules{border:0;margin-top:2cqw;padding-top:0}
.sample-site[data-typeface=serif] .sample-copy :is(h1,h3),.sample-site[data-typeface=serif] .sample-copy :is(h1,h3) em{font-family:Georgia,serif;font-weight:400}.sample-site[data-typeface=sans] .sample-copy :is(h1,h3),.sample-site[data-typeface=sans] .sample-copy :is(h1,h3) em{font-family:'DM Sans',sans-serif;font-style:normal;font-weight:600}.sample-site[data-typeface=mono] .sample-copy :is(h1,h3),.sample-site[data-typeface=mono] .sample-copy :is(h1,h3) em{font-family:'Courier New',monospace;font-style:normal;font-size:6cqw;font-weight:500;letter-spacing:-.35cqw}
.live-stage[data-device=mobile] .sample-hero{display:flex;flex-direction:column;align-items:stretch;gap:4cqw}.live-stage[data-device=mobile] .sample-copy :is(h1,h3){font-size:11cqw}.live-stage[data-device=mobile] .sample-copy p{max-width:none;font-size:2.5cqw}.live-stage[data-device=mobile] .sample-copy>small{font-size:1.6cqw}.live-stage[data-device=mobile] .sample-cta{font-size:2.2cqw;padding:2.4cqw 3.4cqw}.live-stage[data-device=mobile] .sample-nav{font-size:1.6cqw}.live-stage[data-device=mobile] .sample-nav b{font-size:3.3cqw}.live-stage[data-device=mobile] .sample-nav>span:nth-child(2){display:none}.live-stage[data-device=mobile] .sample-art{height:37cqw}.live-stage[data-device=mobile] .sample-modules{grid-auto-flow:row;grid-template-columns:1fr}.live-stage[data-device=mobile] .sample-module{padding:3cqw}.live-stage[data-device=mobile] .sample-module small{font-size:1.5cqw}.live-stage[data-device=mobile] .sample-module b{font-size:3cqw}.live-stage[data-device=mobile] .sample-module>span{font-size:1.8cqw}.live-stage[data-device=mobile] .sample-site[data-layout=poster] .sample-hero{display:block}.live-stage[data-device=mobile] .sample-site[data-layout=poster] .sample-art{position:absolute;right:-3cqw;width:50cqw;top:4cqw}.live-stage[data-device=mobile] .sample-site[data-layout=center] .sample-copy :is(h1,h3){font-size:9cqw}.live-stage[data-device=mobile] .sample-site[data-layout=center] .sample-art{height:16cqw}.live-stage[data-device=mobile] .sample-site[data-layout=center] .sample-copy :is(h1,h3) br{display:initial}
