/* Only the three lower home cards. Dimensions are measured from the 1024px mockup. */
.home-lower-grid {
 display: grid;
 grid-template-columns: 1.275fr 1.024fr .997fr;
 align-items: stretch;
 gap: 12px;
 margin-top: 76px;
}
.home-lower-panel {
 position: relative;
 min-width: 0;
 container-type: inline-size;
 background: linear-gradient(130deg, #040f17, #02090f);
 isolation: isolate;
}
.home-lower-panel::after {
 content: "";
 position: absolute;
 inset: 0;
 z-index: 3;
 background: url('../img/nexusot/lower-frame.svg') center / 100% 100% no-repeat;
 pointer-events: none;
}
.home-lower-panel h2 { margin: 0; font-family: Georgia, 'Times New Roman', serif; font-weight: 400; letter-spacing: 0; color: #f0e8d3; line-height: 1.3; }
.home-lower-downloads { aspect-ratio: 372 / 174; }
.lower-download-heading {
 position: absolute;
 top: 6.5%; left: 5.1%; right: 4.2%; height: 23%;
 display: flex; align-items: center; gap: 2.7cqw;
}
.lower-download-heading img { width: 6.45cqw; height: 8.06cqw; object-fit: contain; filter: drop-shadow(0 0 7px #e7b65950); }
.lower-download-heading h2 { font-size: 3.15cqw; line-height: 1.25; }
.lower-download-heading p { margin: .7cqw 0 0; font: 400 2.12cqw/1.3 'NexusSans', Arial, sans-serif; letter-spacing: -.02em; color: #c3c9cf; }
.lower-download-heading::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1.9cqw; height: 1px; background: linear-gradient(90deg, #1f333d, #1f333d90, transparent); }
.lower-download-options { position: absolute; top: 35.6%; right: 4.3%; bottom: 8%; left: 5.1%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3.4cqw; }
.home-lower-panel .lower-platform {
 --tile-rgb: 29, 159, 235;
 position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
 min-width: 0; padding-top: 3.5cqw; border: 1px solid rgba(var(--tile-rgb), .32); border-radius: 4px;
 background: radial-gradient(ellipse at 50% 15%, rgba(var(--tile-rgb), .1), transparent 75%), #03192c;
 box-shadow: inset 0 0 0 2px rgba(var(--tile-rgb), .045), 0 0 8px rgba(var(--tile-rgb), .07);
 color: #f3f3ef; text-align: center; transition: transform .2s, box-shadow .2s, filter .2s;
}
.home-lower-panel .lower-platform--android { --tile-rgb: 53, 178, 87; background-color: #021e12; }
.home-lower-panel .lower-platform--linux { --tile-rgb: 177, 134, 76; background-color: #1b1916; }
.lower-platform-icon { display: block; width: 9.2cqw; height: 9.5cqw; font-size: 8.6cqw; line-height: 9.5cqw; color: #38dcff; filter: drop-shadow(0 0 5px #009dff70); object-fit: contain; }
.lower-platform--android .lower-platform-icon { color: #65d76e; filter: drop-shadow(0 0 4px #28be4c35); }
.lower-platform--linux .lower-platform-icon { filter: drop-shadow(0 0 4px #c8953e50); }
.lower-platform strong { margin-top: 2.1cqw; font: 400 3.12cqw/1.2 'NexusSans', Arial, sans-serif; letter-spacing: -.02em; }
.lower-platform > span { margin-top: 1cqw; font: 400 2.65cqw/1.2 'NexusSans', Arial, sans-serif; color: #e3e3df; }
.home-lower-panel .lower-platform:hover { transform: translateY(-2px); filter: brightness(1.18); box-shadow: inset 0 0 0 1px rgba(var(--tile-rgb), .4), 0 0 16px rgba(var(--tile-rgb), .3); }
.home-lower-discord { background: #020a10 url('../img/nexusot/lower-discord-art.webp') center / cover no-repeat; }
.home-lower-discord h2 { position: absolute; top: 10.5%; left: 6%; font-size: 4.68cqw; line-height: 1.55; text-shadow: 0 1px 3px #000; }
.lower-discord-mark { position: absolute; left: 17%; top: 45%; width: 11.7cqw; height: 9cqw; object-fit: contain; filter: drop-shadow(0 0 5px #a3aaff); }
.home-lower-panel .lower-discord-join { position: absolute; left: 6%; top: 70%; width: 52%; height: 19%; display: flex; align-items: center; justify-content: center; overflow: hidden; border: 1px solid #9fddff; border-radius: 5px; background: linear-gradient(#178cff 0%, #0559cb 28%, #052b76 72%, #075dc1); box-shadow: inset 0 0 0 1px #3da2ff, 0 0 4px #31a3ff, 0 0 14px #0055ffb0; color: white; font: 600 3.55cqw/1 'NexusSans', Arial, sans-serif; letter-spacing: -.02em; text-shadow: 0 1px 3px #001f62; transition: transform .2s, filter .2s; animation: lower-discord-pulse 4.8s ease-in-out infinite; }
.lower-discord-join::after { content: ''; position: absolute; inset: -70% auto -70% -55%; width: 30%; background: linear-gradient(90deg, transparent, #b9e9ff88, transparent); transform: skewX(-20deg); animation: lower-discord-sheen 7s ease-in-out infinite; pointer-events: none; }
.home-lower-panel .lower-discord-join:hover { transform: translateY(-2px); filter: brightness(1.18); }
.home-lower-video h2 { position: absolute; top: 9%; left: 5%; font-size: 4.1cqw; }
.home-lower-panel .lower-trailer-preview { position: absolute; top: 22%; left: 5%; right: 5%; bottom: 10%; width: 90%; margin: 0; padding: 0; display: block; overflow: hidden; border: 1px solid #5a5d5b; border-radius: 4px; background: #07121a url('../img/nexusot/lower-trailer-art.webp') center / cover no-repeat; color: #f7ebc7; cursor: pointer; box-shadow: inset 0 0 0 1px #a8b7c11c; }
.lower-trailer-preview::before { position: absolute; content: ''; inset: 0; background: linear-gradient(transparent 50%, #0009); pointer-events: none; }
.lower-trailer-play { position: absolute; width: 17.5cqw; height: 17.5cqw; left: 50%; top: 47%; border: 1.5px solid #d5bc89; border-radius: 50%; background: #050b12b3; box-shadow: 0 0 0 1px #211b12, inset 0 0 12px #0007; transform: translate(-50%, -50%); transition: background .2s, box-shadow .2s; }
.lower-trailer-play::after { content: ''; position: absolute; left: 37%; top: 26%; width: 39%; height: 49%; background: #fff1c9; clip-path: polygon(0 0, 100% 50%, 0 100%); }
.lower-trailer-label { position: absolute; left: 0; right: 0; bottom: 7%; text-align: center; font: 400 3.1cqw/1.2 Georgia, 'Times New Roman', serif; text-shadow: 0 1px 4px #000; }
.lower-trailer-preview:hover .lower-trailer-play { background: #0d2943c9; box-shadow: 0 0 14px #d0ab6270; }
.home-lower-panel a:focus-visible, .home-lower-panel button:focus-visible { outline: 2px solid #fff0b7; outline-offset: 3px; }
.lower-trailer-dialog { width: min(90vw, 440px); border: 1px solid #a1895e; border-radius: 8px; padding: 26px; color: #e8e0cf; background: #071420; box-shadow: 0 18px 70px #000b; }
.lower-trailer-dialog::backdrop { background: #000b; }
.lower-trailer-dialog h2 { margin-top: 0; font: 400 22px Georgia, serif; }
.lower-trailer-dialog p { line-height: 1.5; }
.lower-trailer-dialog button { padding: 8px 20px; border: 1px solid #779ab6; border-radius: 4px; color: white; background: #153e63; cursor: pointer; }
@keyframes lower-discord-pulse { 0%, 70%, 100% { filter: brightness(1); } 85% { filter: brightness(1.14); } }
@keyframes lower-discord-sheen { 0%, 74% { left: -55%; } 95%, 100% { left: 130%; } }
@media (max-width: 960px) {
 .home-lower-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
 .home-lower-downloads { grid-column: 1 / -1; width: min(100%, 500px); justify-self: center; }
 .home-lower-discord, .home-lower-video { width: 100%; aspect-ratio: 299 / 174; }
}
@media (max-width: 600px) {
 .home-lower-grid { grid-template-columns: minmax(0, 1fr); }
 .home-lower-panel { width: 100%; max-width: 500px; justify-self: center; }
}
@media (prefers-reduced-motion: reduce) {
 .home-lower-panel *, .home-lower-panel *::after { animation: none !important; transition: none !important; }
}