/* ================================================================
   NADLANISTIM — DEAL ROOM / PROJECTS (ported from app/v6/v6.css → Projects)
   ================================================================
   Four image-top glass cards: 4:5 photo with a category pill (top-right) and a "Members Only"
   pill (bottom-left), then a padded body. Corners are physical — they are fixed visual
   positions in the design, not handedness.
   ================================================================ */

.nad-projects__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }

.nad-project { padding: 0; overflow: hidden; border-radius: var(--nad-r-lg); display: flex; flex-direction: column; transition: transform .5s var(--nad-t); }
.nad-project:hover { transform: translateY(-6px); }

.nad-project__img { position: relative; margin: 0; aspect-ratio: 4/5; overflow: hidden; }
/* Ancestor prefix out-specifies Elementor's `.elementor img { height:auto }`. */
.nad-project .nad-project__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--nad-t); opacity: .9; display: block; }
.nad-project:hover .nad-project__img img { transform: scale(1.06); opacity: 1; }

.nad-project__tag { position: absolute; top: 14px; right: 14px; z-index: 4; background: rgba(7,8,15,.55); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); color: var(--nad-ink); padding: 6px 14px; border-radius: 999px; font-size: 12px; font-weight: 500; border: 1px solid rgba(255,255,255,.12); }
.nad-project__members { position: absolute; bottom: 14px; left: 14px; z-index: 4; padding: 5px 11px; border-radius: 999px; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; color: var(--nad-cyan); background: rgba(7,8,15,.55); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(34,211,238,.32); }

.nad-project__body { padding: 22px 22px 24px; }
.nad-project__body h3 { font-size: 19px; font-weight: 600; letter-spacing: -0.015em; margin: 0 0 8px; color: var(--nad-ink); }
.nad-project__body p { font-size: 14px; color: var(--nad-muted); line-height: 1.55; font-weight: 300; margin: 0 0 12px; }
.nad-project__meta { display: flex; gap: 8px; font-size: 12px; color: var(--nad-muted-2); }

/* ===== Responsive ===== */
@media (max-width: 1100px) {
	.nad-projects__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
	/* Mobile turns the grid into a horizontal scroll-snap row, as in the reference. */
	.nad-projects__grid {
		display: flex; flex-wrap: nowrap; grid-template-columns: none; gap: 12px;
		overflow-x: auto; overflow-y: visible; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
		scrollbar-width: none; padding: 4px var(--nad-gutter) 18px; margin: 0 calc(var(--nad-gutter) * -1);
		scroll-padding-inline-start: var(--nad-gutter);
	}
	.nad-projects__grid::-webkit-scrollbar { display: none; }
	.nad-projects__grid > * { flex: 0 0 76%; scroll-snap-align: start; }
	.nad-project { gap: 14px; }
	.nad-project__img { aspect-ratio: 5/4; }
	.nad-project__body h3 { font-size: 16px; }
	.nad-project__body p { font-size: 13px; }
}
