/* A floating cinematic wall, composed by hand rather than equal grid cells. */
.genai-home .hero{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:2vw;overflow:hidden}
.hero-collage{position:relative;min-width:0;isolation:isolate;padding:20px 0 0;perspective:1400px}
.hero-collage:before{content:'';position:absolute;inset:8% -5% 7%;z-index:-1;background:radial-gradient(ellipse at 56% 48%,#e8525826,transparent 68%);filter:blur(25px);pointer-events:none}
.hero-collage-grid{position:relative;width:100%;aspect-ratio:1.18;transform-style:preserve-3d;transform:rotateY(-7deg) rotateX(4deg) rotateZ(-2deg);animation:wall-drift 9s ease-in-out infinite alternate;animation-play-state:paused}
.hero-collage.is-in-view .hero-collage-grid{animation-play-state:running}.hero-collage.is-held .hero-collage-grid{animation-play-state:paused}
.hero-collage-tile{position:absolute;display:block;left:var(--x);top:var(--y);width:var(--w);height:var(--h);transform:rotate(var(--a)) translateZ(var(--z,0px));transform-style:preserve-3d;transition:transform .32s ease,filter .32s;outline-offset:5px;z-index:var(--layer,1);border-radius:12px;box-shadow:0 14px 24px #0007,0 2px 5px #0008}
.hero-collage-face{height:100%;position:relative;overflow:hidden;border:1px solid #ffffff30;border-radius:inherit;background:#251f24;backface-visibility:hidden}.hero-collage-tile video{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.hero-collage-face:after{content:'';position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#08070add);pointer-events:none;opacity:0;transition:opacity .2s}
.hero-collage-title{position:absolute;left:11px;right:27px;bottom:12px;color:#fff;font-size:12px;line-height:1.15;letter-spacing:.035em;text-transform:uppercase;z-index:2;opacity:0;transition:opacity .2s}.hero-collage-arrow{position:absolute;right:9px;bottom:10px;font-size:20px;color:var(--pink);z-index:2;opacity:0;transition:opacity .2s}
.hero-collage-tile:hover,.hero-collage-tile:focus-visible{transform:rotate(0deg) translateZ(45px) scale(1.8);z-index:20;filter:brightness(1.09)}.hero-collage-tile:hover .hero-collage-face,.hero-collage-tile:focus-visible .hero-collage-face{border-color:var(--pink)}.hero-collage-tile:is(:hover,:focus-visible) :is(.hero-collage-title,.hero-collage-arrow),.hero-collage-tile:is(:hover,:focus-visible) .hero-collage-face:after{opacity:1}
.hero-collage-tile.is-flipping{transform:rotate(var(--a)) rotateY(90deg) translateZ(10px)}.hero-collage-tile:nth-child(even).is-flipping{transform:rotate(var(--a)) rotateY(-90deg) translateZ(10px)}
.hero-collage-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:32px 12px 8px}.hero-collage-footer>span{font-size:10px;letter-spacing:.12em;color:var(--muted)}.hero-collage-footer>a{font-size:15px;color:var(--pink);letter-spacing:.025em;white-space:nowrap}
@keyframes wall-drift{from{transform:translateY(0) rotateY(-7deg) rotateX(4deg) rotateZ(-2deg)}to{transform:translateY(-8px) rotateY(-4deg) rotateX(2deg) rotateZ(-1deg)}}
@media(max-width:980px){.genai-home .hero{grid-template-columns:1fr}.hero-collage{width:min(100%,720px);margin:0 auto;padding:20px 8px 0}}
@media(max-width:640px){.hero-collage{padding:10px 6px 0}.hero-collage-tile{border-radius:7px;box-shadow:0 8px 14px #0006}.hero-collage-title{font-size:9px;left:6px;right:18px;bottom:7px}.hero-collage-arrow{font-size:14px;right:5px;bottom:5px}.hero-collage-footer{padding:24px 2px 4px;gap:8px;flex-wrap:wrap}.hero-collage-footer>a{font-size:14px}}
@media(prefers-reduced-motion:reduce){.hero-collage-grid{animation:none}.hero-collage-tile{transition:none}.hero-collage-tile.is-flipping{transform:rotate(var(--a))}}
.hero-collage-tile:nth-child(1){--x:1%;--y:7%;--w:23%;--h:18%;--a:-7deg}
.hero-collage-tile:nth-child(2){--x:27%;--y:2%;--w:24%;--h:17%;--a:4deg}
.hero-collage-tile:nth-child(3){--x:55%;--y:5%;--w:21%;--h:15%;--a:-3deg}
.hero-collage-tile:nth-child(4){--x:80%;--y:1%;--w:18%;--h:17%;--a:7deg}
.hero-collage-tile:nth-child(5){--x:0%;--y:30%;--w:22%;--h:23%;--a:-5deg}
.hero-collage-tile:nth-child(6){--x:25%;--y:23%;--w:34%;--h:25%;--a:-2deg}
.hero-collage-tile:nth-child(7){--x:62%;--y:24%;--w:21%;--h:18%;--a:5deg}
.hero-collage-tile:nth-child(8){--x:85%;--y:24%;--w:14%;--h:24%;--a:8deg}
.hero-collage-tile:nth-child(9){--x:3%;--y:58%;--w:23%;--h:18%;--a:6deg}
.hero-collage-tile:nth-child(10){--x:30%;--y:54%;--w:23%;--h:19%;--a:-5deg}
.hero-collage-tile:nth-child(11){--x:56%;--y:48%;--w:30%;--h:25%;--a:3deg}
.hero-collage-tile:nth-child(12){--x:85%;--y:55%;--w:14%;--h:17%;--a:-7deg}
.hero-collage-tile:nth-child(13){--x:0%;--y:81%;--w:20%;--h:15%;--a:-5deg}
.hero-collage-tile:nth-child(14){--x:24%;--y:80%;--w:25%;--h:20%;--a:4deg}
.hero-collage-tile:nth-child(15){--x:53%;--y:79%;--w:23%;--h:17%;--a:-3deg}
.hero-collage-tile:nth-child(16){--x:80%;--y:78%;--w:19%;--h:21%;--a:7deg}
.hero-collage-footer{flex-wrap:wrap}.hero-collage-sound{font-family:inherit;font-size:13px;font-weight:600;color:#fff;background:#e85258;border:1px solid var(--pink);border-radius:20px;padding:7px 12px;cursor:pointer}.hero-collage-sound[hidden]{display:none}.hero-collage-tile.is-audible .hero-collage-face{border-color:var(--pink);box-shadow:inset 0 0 0 2px var(--pink)}

/* Sequential spotlight: only one card grows at a time; audio remains hover-only. */
.hero-collage-tile.is-featured{z-index:9}
.hero-collage-tile.is-featured .hero-collage-face{animation:collage-spotlight 2.6s cubic-bezier(.22,.61,.36,1) both;transform-origin:center center;will-change:transform}
@keyframes collage-spotlight{0%,100%{transform:scale(1);box-shadow:0 0 0 0 #e8525800}25%,64%{transform:scale(1.22);box-shadow:0 18px 45px #0009,0 0 0 2px #e85258aa}}
.hero-collage.is-held .hero-collage-tile.is-featured .hero-collage-face{animation:none}
@media(prefers-reduced-motion:reduce){.hero-collage-tile.is-featured .hero-collage-face{animation:none}}

/* Keep hovered cards above the sequential spotlight. */
.hero-collage-tile:hover,.hero-collage-tile:focus-visible{z-index:30}
