/**
 * ARCADE DIRECT — GAMES ROOM EQUIPMENT HUB
 * Design direction: premium, practical editorial planning. Navy and teal establish a strong
 * arcade atmosphere; text stays on solid surfaces, authentic imagery stays separate from copy,
 * and asymmetric framed media avoids a generic product-category layout.
 */

.ad-games-room { background: #f8faf9; color: var(--brand-navy-deep, #081224); overflow: clip; }
.ad-games-room .ad-label { color: var(--brand-teal-dark, #26927a); font-family: var(--font-mono, "IBM Plex Mono", monospace); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.ad-games-room h1, .ad-games-room h2, .ad-games-room h3 { letter-spacing: -.03em; }

.ad-games-room__hero { background: #081224; color: #fff; padding: clamp(3.5rem, 8vw, 8.5rem) 0 clamp(3.5rem, 7vw, 7rem); position: relative; }
.ad-games-room__hero::after { background: linear-gradient(130deg, rgba(53,187,157,.16), transparent 46%); content: ""; inset: 0; pointer-events: none; position: absolute; }
.ad-games-room__hero-inner { align-items: center; display: grid; gap: clamp(2rem, 6vw, 7rem); grid-template-columns: minmax(0, 1.05fr) minmax(16rem, .7fr); position: relative; z-index: 1; }
.ad-games-room__hero-copy { max-width: 46rem; }
.ad-games-room__hero .ad-label { color: #35bb9d; margin: 0 0 1rem; }
.ad-games-room__hero h1 { color: #fff; font-family: var(--font-display, "Barlow Condensed", sans-serif); font-size: clamp(3.5rem, 8vw, 8.5rem); font-weight: 800; line-height: .84; margin: 0; max-width: 8ch; text-transform: uppercase; }
.ad-games-room__lede { color: #d3e3e3; font-size: clamp(1.05rem, 1.6vw, 1.3rem); line-height: 1.6; margin: clamp(1.35rem, 3vw, 2rem) 0 0; max-width: 41rem; }
.ad-games-room__hero-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; margin-top: clamp(1.5rem, 3vw, 2.25rem); }
.ad-games-room .ad-text-link--on-dark { color: #fff; }
.ad-games-room__hero-media { align-self: stretch; border: 1px solid rgba(211,227,227,.32); margin: 0; min-height: 24rem; overflow: hidden; position: relative; }
.ad-games-room__hero-media::after { background: linear-gradient(180deg, transparent 56%, rgba(8,18,36,.42)); content: ""; inset: 0; pointer-events: none; position: absolute; }
.ad-games-room__hero-media img { display: block; height: 100%; min-height: 24rem; object-fit: cover; object-position: center; width: 100%; }

.ad-games-room__orientation { background: #fff; border-bottom: 1px solid #d3e3e3; padding: clamp(3rem, 7vw, 7rem) 0; }
.ad-games-room__orientation-inner { display: grid; gap: 1rem clamp(2rem, 8vw, 10rem); grid-template-columns: minmax(10rem, .4fr) minmax(0, 1fr); }
.ad-games-room__orientation h2, .ad-games-room__section-heading h2, .ad-games-room__planning h2, .ad-games-room__custom h2, .ad-games-room__next h2 { color: #081224; font-family: var(--font-display, "Barlow Condensed", sans-serif); font-size: clamp(2.35rem, 5vw, 5rem); font-weight: 800; line-height: .91; margin: 0; text-transform: uppercase; }
.ad-games-room__orientation > p, .ad-games-room__orientation-inner > p { color: #394b5f; font-size: clamp(1.05rem, 1.6vw, 1.26rem); line-height: 1.7; margin: 0; max-width: 52rem; }

.ad-games-room__equipment { padding: clamp(3.5rem, 8vw, 8rem) 0; }
.ad-games-room__section-heading { max-width: 53rem; }
.ad-games-room__section-heading .ad-label { margin: 0 0 .9rem; }
.ad-games-room__section-heading h2 { max-width: 10ch; }
.ad-games-room__section-heading > p:last-child { color: #394b5f; line-height: 1.65; margin: 1.35rem 0 0; max-width: 47rem; }
.ad-games-room__routes { display: grid; gap: 1px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: clamp(2rem, 5vw, 4rem); background: #d3e3e3; border: 1px solid #d3e3e3; }
.ad-games-room__route { background: #fff; color: #081224; display: flex; flex-direction: column; min-height: 19rem; padding: clamp(1.4rem, 3vw, 2.6rem); text-decoration: none; transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.ad-games-room__route h3 { color: inherit; font-family: var(--font-display, "Barlow Condensed", sans-serif); font-size: clamp(1.9rem, 3vw, 3.2rem); font-weight: 800; line-height: .92; margin: 0; text-transform: uppercase; }
.ad-games-room__route p { color: #394b5f; line-height: 1.55; margin: 1.25rem 0; }
.ad-games-room__route span { color: #26927a; font-family: var(--font-mono, "IBM Plex Mono", monospace); font-size: .78rem; font-weight: 800; letter-spacing: .04em; margin-top: auto; text-transform: uppercase; }
.ad-games-room__route:hover, .ad-games-room__route:focus-visible { background: #081224; color: #fff; transform: translateY(-.25rem); }
.ad-games-room__route:hover p, .ad-games-room__route:focus-visible p { color: #d3e3e3; }
.ad-games-room__route:hover span, .ad-games-room__route:focus-visible span { color: #35bb9d; }
.ad-games-room__route:focus-visible { outline: 3px solid #35bb9d; outline-offset: 3px; }

.ad-games-room__planning { background: #d3e3e3; padding: clamp(3.5rem, 8vw, 8rem) 0; }
.ad-games-room__planning-inner { align-items: start; display: grid; gap: clamp(2rem, 7vw, 8rem); grid-template-columns: minmax(0, .85fr) minmax(20rem, 1.15fr); }
.ad-games-room__planning-copy .ad-label { margin: 0 0 .9rem; }
.ad-games-room__planning-copy > p:last-child { color: #394b5f; line-height: 1.65; margin: 1.35rem 0 0; }
.ad-games-room__planning-list { border-top: 1px solid rgba(8,18,36,.28); list-style: none; margin: 0; padding: 0; }
.ad-games-room__planning-list li { border-bottom: 1px solid rgba(8,18,36,.28); display: grid; gap: 1rem 2rem; grid-template-columns: minmax(10rem, .5fr) minmax(0, 1fr); padding: 1.25rem 0; }
.ad-games-room__planning-list strong { color: #081224; font-family: var(--font-display, "Barlow Condensed", sans-serif); font-size: 1.65rem; letter-spacing: -.025em; line-height: 1; text-transform: uppercase; }
.ad-games-room__planning-list span { color: #394b5f; line-height: 1.55; }

.ad-games-room__custom { background: #081224; color: #fff; padding: clamp(3.5rem, 8vw, 8rem) 0; }
.ad-games-room__custom-inner { align-items: center; display: grid; gap: clamp(2rem, 7vw, 8rem); grid-template-columns: minmax(16rem, .8fr) minmax(0, 1fr); }
.ad-games-room__custom-media { margin: 0; overflow: hidden; }
.ad-games-room__custom-media img { display: block; min-height: 24rem; object-fit: cover; object-position: center; width: 100%; }
.ad-games-room__custom-copy { max-width: 45rem; }
.ad-games-room__custom .ad-label { color: #35bb9d; margin: 0 0 .9rem; }
.ad-games-room__custom h2 { color: #fff; max-width: 11ch; }
.ad-games-room__custom-copy > p:last-of-type { color: #d3e3e3; line-height: 1.65; margin: 1.35rem 0 1.8rem; }

.ad-games-room__next { background: #fff; padding: clamp(3rem, 6vw, 6rem) 0; }
.ad-games-room__next-inner { align-items: end; display: flex; gap: 2rem; justify-content: space-between; }
.ad-games-room__next .ad-label { margin: 0 0 .9rem; }
.ad-games-room__next h2 { max-width: 15ch; }
.ad-games-room__next-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; }
.ad-games-room .ad-button:active { transform: scale(.97); }

@media (max-width: 63.99rem) {
	.ad-games-room__hero-inner, .ad-games-room__planning-inner, .ad-games-room__custom-inner { grid-template-columns: 1fr; }
	.ad-games-room__hero-media { max-width: 38rem; }
	.ad-games-room__routes { grid-template-columns: 1fr; }
	.ad-games-room__route { min-height: auto; }
	.ad-games-room__custom-media { max-width: 38rem; order: 2; }
	.ad-games-room__custom-copy { order: 1; }
}

@media (max-width: 47.99rem) {
	.ad-games-room__hero { padding-block: 3.25rem; }
	.ad-games-room__hero h1 { font-size: clamp(3.25rem, 16vw, 5.2rem); }
	.ad-games-room__hero-media, .ad-games-room__hero-media img { min-height: 20rem; }
	.ad-games-room__orientation-inner { grid-template-columns: 1fr; }
	.ad-games-room__planning-list li { grid-template-columns: 1fr; gap: .5rem; }
	.ad-games-room__custom-media img { min-height: 19rem; }
	.ad-games-room__next-inner { align-items: start; flex-direction: column; }
	.ad-games-room__next-actions { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
	.ad-games-room__route { transition: none; }
}
