/* Final FORMA composition and responsive stage alignment. */
.hero-composition[data-layout=editorial] .live-site:not(.live-site-mobile) .live-cover{grid-template-columns:46% 54%;grid-template-rows:1fr;padding:4% 5% 2%;gap:0}
.hero-composition[data-layout=editorial] .live-site:not(.live-site-mobile) .live-copy{display:flex;flex-direction:column;justify-content:center;align-self:stretch;padding:0 9% 0 0;grid-column:1;grid-row:1}
.hero-composition[data-layout=editorial] .live-site:not(.live-site-mobile) .live-copy>small{display:block;font-size:1.2cqw;letter-spacing:.18em;margin:0 0 12%;color:var(--preview-accent)}
.hero-composition[data-layout=editorial] .live-site:not(.live-site-mobile) .live-copy>h3{font-size:9.1cqw;white-space:normal;line-height:.88;letter-spacing:-.06em;margin:0 0 10%;align-self:auto}
.hero-composition[data-layout=editorial] .live-site:not(.live-site-mobile) .live-copy>h3 br{display:initial}
.hero-composition[data-layout=editorial][data-preview-font=moderna] .live-site:not(.live-site-mobile) .live-copy>h3{font-size:7.5cqw;line-height:.99;letter-spacing:-.065em}
.hero-composition[data-layout=editorial] .live-site:not(.live-site-mobile) .live-copy>p{font-size:1.65cqw;line-height:1.5;max-width:24ch;margin:0 0 12%;align-self:auto}
.hero-composition[data-layout=editorial] .live-site:not(.live-site-mobile) .live-cta{align-self:flex-start;padding:4% 0;margin:0;font-size:1.5cqw}
.hero-composition[data-layout=editorial] .live-site:not(.live-site-mobile) .live-cover>.editorial-art{grid-column:2;grid-row:1;border-radius:40% 40% 1px 1px;object-position:58% center;box-shadow:0 0 0 1px color-mix(in srgb,var(--preview-accent) 15%,transparent)}
.hero-composition[data-layout=editorial] .live-bottom{border-top:1px solid color-mix(in srgb,var(--preview-accent) 25%,transparent);margin:0 5%;padding:2% 0!important;color:var(--preview-accent)}
.hero-composition[data-layout=editorial] .live-site-mobile .live-cover>.editorial-art{border-radius:42% 42% 0 0;object-position:60% center;min-height:35%}
.hero-composition[data-layout=editorial] .live-site-mobile .live-copy>h3{font-size:23cqw}
.hero-composition[data-layout=editorial][data-preview-font=moderna] .live-site-mobile .live-copy>h3{font-size:19cqw}
/* Inmersiva uses the chosen palette across the whole interface. */
[data-layout=immersive] .live-site .live-nav{background:color-mix(in srgb,var(--preview-ink) 88%,transparent);color:var(--preview-paper);border-bottom:1px solid color-mix(in srgb,var(--preview-paper) 25%,transparent);transition:background .6s,color .6s,border-color .6s}
[data-layout=immersive] .live-cover:after{background:linear-gradient(90deg,color-mix(in srgb,var(--preview-ink) 78%,transparent),transparent 87%),linear-gradient(0deg,color-mix(in srgb,var(--preview-accent) 70%,transparent),transparent 72%);transition:background .6s}
[data-layout=immersive] .live-site .live-copy{color:var(--preview-paper);transition:color .6s}
[data-layout=immersive] .live-site .live-copy>small{color:var(--preview-paper);border-left:2px solid var(--preview-paper);padding-left:1.5cqw}
[data-layout=immersive] .live-site .live-bottom{left:0;right:0;padding:2.5% 5%;background:var(--preview-ink);color:var(--preview-paper);border-top:1px solid var(--preview-accent);transition:background .6s,color .6s,border-color .6s}
[data-layout=immersive] .live-site-mobile .live-cover:after{background:linear-gradient(0deg,color-mix(in srgb,var(--preview-ink) 93%,transparent),color-mix(in srgb,var(--preview-accent) 15%,transparent) 95%)}
[data-layout=immersive] .live-site-mobile .live-bottom{left:0;right:0;padding:6% 8%;font-size:2.5cqw}
.hero-composition .thumb-editorial>i{width:45%;font-size:8px;padding-top:9px}.hero-composition .thumb-editorial>em{left:52%;top:10%;bottom:10%;border-radius:50% 50% 0 0}
@media(min-width:761px){.studio-v30 .hero-composition:has(.live-laptop) .hero-machine.live-laptop{width:94%;left:-3%;top:12%}.studio-v30 .hero-composition:has(.live-laptop) .hero-phone.live-phone{bottom:4%}.studio-v30 .hero-composition:has(.live-laptop) figcaption{bottom:-57px;left:10%;right:auto;font-size:9px;letter-spacing:.12em;line-height:1.5;opacity:.85;margin:0}.studio-hero:has(.live-laptop) .hero-caption>a{margin-right:1%}}
@media(min-width:761px) and (max-width:1100px){.studio-v30 .hero-composition:has(.live-laptop) .hero-machine.live-laptop{width:104%;left:-10%;top:20%}.studio-v30 .hero-composition:has(.live-laptop) figcaption{left:1%;bottom:-51px;font-size:8px}}
@media(max-width:760px){.studio-v30 .hero-composition:has(.live-laptop) figcaption{position:relative;bottom:auto;left:auto;right:auto;display:block;margin:28px 0 0;font-size:8px;line-height:1.6;letter-spacing:.1em;text-align:right;opacity:.9}}
@media(prefers-reduced-motion:reduce){[data-layout=immersive] .live-site .live-nav,[data-layout=immersive] .live-cover:after,[data-layout=immersive] .live-site .live-copy,[data-layout=immersive] .live-site .live-bottom{transition:none}}
/* Caption owns a layout row: never overlay any device or control. */
.studio-v30 .studio-hero{height:auto;min-height:760px}
.studio-v30 .hero-composition,.studio-v30 .hero-composition:has(.live-laptop){height:auto;min-height:0;display:flex;flex-direction:column;aspect-ratio:auto;padding-top:0}
.hero-scene{position:relative;min-height:550px;aspect-ratio:1.4;width:100%;flex:none;perspective:1600px}
.studio-v30 .hero-composition figcaption,.studio-v30 .hero-composition:has(.live-laptop) figcaption{position:static;inset:auto;align-self:center;margin:24px 0 0;padding:0;font-size:9px;line-height:1.5;letter-spacing:.12em;opacity:.85;text-align:center;width:auto;max-width:100%}
@media(min-width:761px) and (max-width:1100px){.hero-scene{min-height:550px;aspect-ratio:1.25}.studio-v30 .hero-composition:has(.live-laptop) .hero-machine.live-laptop{top:15%}}
@media(max-width:760px){.studio-v30 .studio-hero{min-height:0}.hero-scene{min-height:0;aspect-ratio:auto;padding-top:195px}.hero-composition:has(.live-laptop) .hero-scene{padding-top:265px}.studio-v30 .hero-composition figcaption,.studio-v30 .hero-composition:has(.live-laptop) figcaption{margin-top:28px;font-size:8px;align-self:flex-end;text-align:right}}
@media(max-width:350px){.hero-scene{padding-top:165px}.hero-composition:has(.live-laptop) .hero-scene{padding-top:225px}}
@media(min-width:761px){.studio-v30 .hero-composition .hero-scene>.hero-palette{bottom:0}}
[data-preview-scope][data-layout=immersive] .sample-site .sample-nav,[data-preview-scope][data-layout=immersive] .sample-site .sample-foot{background:var(--preview-ink);color:var(--preview-paper);transition:background .5s,color .5s}
[data-preview-scope][data-layout=immersive] .sample-cover:after{background:linear-gradient(0deg,color-mix(in srgb,var(--preview-ink) 90%,transparent),color-mix(in srgb,var(--preview-accent) 15%,transparent));opacity:1}
[data-preview-scope][data-layout=immersive] .sample-cover>div{color:var(--preview-paper)}
