/* Each slide uses individually art-directed imagery, with real accessible link regions. */
.art-slide{position:relative;isolation:isolate;overflow:hidden;background:#080b12}
.home-showcase .showcase-stage{aspect-ratio:2.5}
.showcase-stage .art-slide .art-backdrop{width:100%;height:100%;object-fit:cover;display:block}
.art-destinations{position:absolute;inset:0;display:grid;grid-template-columns:repeat(var(--destinations),minmax(0,1fr))}
.art-destination{position:relative;display:flex;align-items:flex-end;color:#fff;text-decoration:none;min-width:0;background:linear-gradient(transparent 53%,rgba(3,6,12,.88));transition:background-color .2s}
.art-destination:hover{background-color:#ffffff0b}
.art-destination+.art-destination{border-left:1px solid #ffffff24}
.art-label{padding:1.1rem 1.25rem;width:100%;text-shadow:0 2px 9px #000}
.art-label h2{font-size:clamp(1rem,1.8vw,1.5rem);line-height:1.2;margin:0 0 .3rem}
.art-label h2 b{font-weight:400;color:#b9e3ff}
.art-label p{font-size:clamp(.75rem,1.1vw,.9rem);line-height:1.4;margin:0;color:#f0f1f5}
.art-destination:focus-visible{outline:3px solid #a4e1ff;outline-offset:-5px;background-color:#ffffff12}
.art-effects .art-destinations{right:0}
.art-effects .art-destination{align-items:flex-start;background:linear-gradient(120deg,#120722a8,transparent 85%)}
.art-effects .art-label{padding:1.8rem;width:52%}
.art-retro .art-destinations{left:0}
.art-retro .art-destination{align-items:flex-start;background:linear-gradient(240deg,#081426b8,transparent 90%)}
.art-retro .art-label{padding:1.6rem;margin-left:48%;width:52%}
.art-materials .art-destinations{right:0}
.art-materials .art-label{width:58%}
.art-materials .art-label h2{font-size:clamp(1.3rem,2.5vw,2rem)}

/* App names are plain captions; only the explicit hub label is a link. */
.slide-project-labels{position:absolute;left:2%;right:2%;top:4%;display:grid;grid-template-columns:repeat(var(--projects),minmax(0,1fr));gap:8px;pointer-events:none;color:#fff;text-shadow:0 1px 4px #000,0 1px 10px #000;font-size:clamp(.75rem,1.1vw,1rem);font-weight:500;text-align:center;line-height:1.25}
.showcase-slide .slide-project-labels span{position:static;inset:auto;padding:0;background:none;font:inherit}
.art-hub-slide .art-destinations{display:block;pointer-events:none}
.art-hub-slide .art-destination{position:absolute;left:0;right:0;bottom:0;width:100%;height:auto;background:linear-gradient(transparent,#07101de8);border:0;border-radius:0;pointer-events:auto;box-shadow:none;text-align:center}
.art-hub-slide .art-label{padding:1.4rem 1rem .9rem;text-align:center}
.art-hub-slide .art-label h2{margin:0;font-size:clamp(1.25rem,2.5vw,2rem);color:#fff}
.art-hub-slide .art-destination:hover .art-label h2{text-decoration:underline;text-underline-offset:.2em}
@media(max-width:700px){
 .slide-project-labels{font-size:clamp(.62rem,2vw,.8rem);gap:4px;top:3%}
 .art-hub-slide .art-destinations{display:flex;align-items:center;padding:0;box-sizing:border-box}
 .showcase-stage .art-hub-slide .art-destination{position:static;border:0;background:none}
 .art-hub-slide .art-label{padding:1rem;text-align:center}
}

@media(max-width:700px){
 .home-showcase{container-type:inline-size}
 .home-showcase .showcase-stage{aspect-ratio:auto;height:calc(40cqw + 200px)}
 .showcase-stage .art-slide .art-backdrop,.showcase-stage .showcase-brand>img{height:40cqw;aspect-ratio:2.5;object-fit:cover;object-position:center}
 .showcase-stage .showcase-brand .brand-mantra{position:static;height:200px;padding:1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#0c111a;box-sizing:border-box}
 .art-slide .art-destinations{position:static;inset:auto;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;height:200px;background:#0c111a}
 .art-slide .art-destination:last-child:nth-child(odd){grid-column:1 / -1}
 .art-slide .art-destination{background:none;align-items:center;border:1px solid #ffffff1a;min-height:82px}
 .art-slide .art-label{padding:.85rem;text-shadow:none;width:100%;margin:0}
 .art-slide .art-label h2{font-size:1rem}
 .art-slide .art-label p{font-size:.77rem}
}
@media(prefers-reduced-motion:reduce){.art-destination{transition:none}}

/* Labels and hit areas follow the three stitched tools and the world behind them. */
.art-o3de-stitched .art-destinations{display:block}
.art-o3de-stitched .art-destination{position:absolute;background:none;border:0;padding:10px;box-sizing:border-box}
.art-o3de-stitched .art-label{width:auto;max-width:100%;padding:.55rem .75rem;background:#060d18d9;border:1px solid #c5d9e34a;border-radius:7px;box-shadow:0 3px 12px #0005}
.art-o3de-stitched .art-label h2{font-size:clamp(.9rem,1.4vw,1.2rem);margin:0 0 .15rem}
.art-o3de-stitched .art-label p{font-size:clamp(.7rem,.95vw,.85rem)}
.art-o3de-stitched .art-destination:hover .art-label{border-color:#f2c88e;background:#101a29ee}
.art-o3de-stitched .o3de-canvas-link{left:6%;top:1%;width:54%;height:49%;align-items:flex-start}
.art-o3de-stitched .o3de-editor-link{left:3%;top:43%;width:51%;height:56%;z-index:2}
.art-o3de-stitched .o3de-landscape-link{right:2%;top:7%;width:36%;height:66%;align-items:flex-start;justify-content:flex-end}
.art-o3de-stitched .o3de-vegetation-link{right:1%;bottom:1%;width:43%;height:25%;justify-content:flex-end}
@media(max-width:700px){
 .art-o3de-stitched .art-destinations{display:grid}
 .art-o3de-stitched .art-destination{position:static;inset:auto;width:auto;height:auto;padding:0;align-items:center;justify-content:flex-start;border:1px solid #ffffff1a}
 .art-o3de-stitched .art-label{padding:.7rem;background:none;border:0;box-shadow:none}
 .art-o3de-stitched .art-label h2{font-size:.95rem}
 .art-o3de-stitched .art-label p{font-size:.75rem}
}