/* Homepage free check (meridian-ads-main, Evan picked A, 2026-10-05; replaces the Miami map): "Right now, someone is
   searching for what you sell. Do they find you?" beside a slow wall of example searches. Form goes to check.html. */
.nx { position: relative; overflow: hidden; }
.nx h2 { margin: 0; font-size: clamp(42px, 5vw, 80px); line-height: .96; letter-spacing: -.048em; font-weight: 500; }
.nx-form { display: flex; gap: 8px; margin-top: 34px; max-width: 600px; }
.nx-form input { flex: 1 1 0; min-width: 0; height: 58px; padding: 0 20px; border: 0; border-radius: 16px; font: inherit; font-size: 17px; }
.nx-form button { flex: none; height: 58px; padding: 0 26px; border: 0; border-radius: 16px; font: inherit; font-size: 17px; cursor: pointer; }
.nx-checks { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin: 20px 0 0; padding: 0; list-style: none; font-size: 14px; }
.nx-checks li { display: flex; align-items: center; gap: 7px; } .nx-checks img { width: 18px; height: 18px; }
@media (max-width: 700px) { .nx-form { flex-wrap: wrap; } .nx-form input { flex-basis: 100%; } .nx-form button { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .nx * { animation: none !important; } }.nx.a { min-height: 100vh; background: #000; color: #fff; display: grid; align-items: center; }
.nx.a .wall { position: absolute; top: -15%; bottom: -15%; left: 50%; right: -8%; z-index: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 22px; transform: rotate(-6deg);
-webkit-mask: linear-gradient(90deg, transparent 0, #000 25%); mask: linear-gradient(90deg, transparent 0, #000 25%); }
.nx.a .col { display: flex; flex-direction: column; gap: 14px; will-change: transform; }   /* moved with scroll by js/home-search.js */
.nx.a .q { display: flex; align-items: center; gap: 12px; padding: 16px 20px; border-radius: 999px; background: #111; box-shadow: inset 0 0 0 1px #222; font-size: 18px; color: #8e8e93; white-space: nowrap; }
.nx.a .q svg { flex: none; width: 18px; height: 18px; color: #48484a; }
.nx.a .q.hot { background: #fff; color: #000; box-shadow: none; } .nx.a .q.hot svg { color: #0b2bd6; }
.nx.a .w { position: relative; z-index: 2; width: 100%; max-width: 1280px; margin: 0 auto; padding: 120px clamp(20px, 3vw, 40px); }
.nx.a .txt { max-width: 640px; }
.nx.a h2 { color: #fff; } .nx.a h2 span { display: block; color: #6e6e73; }
.nx.a .lede { margin: 22px 0 0; font-size: 20px; line-height: 1.45; color: rgba(255,255,255,.72); max-width: 460px; }
.nx.a .nx-form input { background: #1c1c1e; color: #fff; box-shadow: inset 0 0 0 1px #2c2c2e; } .nx.a .nx-form input::placeholder { color: #8e8e93; }
.nx.a .nx-form button { background: #fff; color: #000; }
.nx.a .nx-checks { color: #8e8e93; } .nx.a .nx-checks img[src*="chatgpt"] { filter: invert(1); }
.nx.a .tag { position: absolute; right: clamp(20px, 3vw, 40px); bottom: 28px; font-size: 13px; color: #48484a; z-index: 1; }
@media (max-width: 860px) { .nx.a .wall { left: -10%; grid-template-columns: repeat(2, 1fr); opacity: .25; } }
/* Crossfade into this section (Evan, 2026-10-05): no fade on the wall's top and bottom; instead the section above
   (Straight answers) and this one share one ground that turns from white to black as this section rises
   (js/home-search.js sets --nx-g / --nx-ink). Text crossfades with it. */
html.nx-x .hs4, html.nx-x .nx.a { background-color: var(--nx-g) !important; }
html.nx-x .hs4 { color: var(--nx-ink); }
/* the cards inside .hs4 follow --nx-g / --nx-ink / --nx-sub via 51's rules in css/home-sales.css */
/* no dividing line: the shared section hairline (site.css depth layer) is off on both sides of the crossfade */
.hs4, .nx.a { box-shadow: none !important; }
/* the pills fade out toward the section's top edge in the current ground colour, so they never end in a straight line */
.nx.a::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 240px; z-index: 1; pointer-events: none; background: linear-gradient(var(--nx-g, #000), transparent); }