/* Compiled component CSS: cards, buttons, drawer, header variants, responsive. */

.am-lift {
	transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.am-lift:hover {
	transform: translateY(-4px);
	box-shadow: var(--am-shadow-card);
	border-color: var(--am-lavender-3);
}

.am-rashi:hover .am-rashi-img {
	transform: scale(1.07);
}
.am-rashi-img {
	transition: transform 0.4s ease;
}

.am-navlinks { display: flex; }
.am-navlinks a:hover { opacity: 0.75; }
.am-burger { display: none; }

@media (max-width: 1120px) {
	.am-navlinks { display: none; }
	.am-burger {
		display: flex;
		-webkit-appearance: none;
		appearance: none;
	}
}

@media (max-width: 600px) {
	.am-navcta {
		padding: 0 14px !important;
		min-height: 40px !important;
		font-size: 13px !important;
	}
	.am-navwa { display: none !important; }
	.am-navlogo { height: 40px !important; }
}

/* Drawer slide-in, respecting reduced motion */
#am-drawer {
	transform: translateX(0);
	animation: am-slidein 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
}
@keyframes am-slidein {
	from { transform: translateX(100%); }
	to { transform: translateX(0); }
}

@media (prefers-reduced-motion: reduce) {
	.am-lift, .am-rashi-img { transition: none; }
	#am-drawer { animation: none; }
}

/* Details/summary FAQ accordion */
details summary { list-style: none; cursor: pointer; }
details summary::-webkit-details-marker { display: none; }
details[open] .faq-plus { transform: rotate(45deg); }

/* Form baseline — 44px+ touch targets, no overflow */
input, select, textarea, button {
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
}
input, select, textarea {
	min-height: 48px;
}
button, a[role="button"], .am-navcta {
	min-height: 44px;
}

img:not([aria-hidden="true"]) { max-width: 100%; }
p, h1, h2, h3, li, span, a, label, summary { overflow-wrap: break-word; }

/* Rashi grid responsiveness */
.am-rashi-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 36px 20px;
}
@media (max-width: 960px) {
	.am-rashi-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 16px; }
}
@media (max-width: 600px) {
	.am-rashi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 10px; }
}

@media (max-width: 1048px) {
	body { overflow-x: hidden; }
}
