/*
 * Parent Resources (/parent-resources/) only — loaded on that page (see functions.php), after main.css.
 */

/* Small phones (<=400px): the newsletter / WhatsApp signup boxes were 27px wider than a 320px screen. (2026-10-23) */
@media (max-width: 400px) {
	.pr-newsletter__grid { grid-template-columns: minmax(0, 1fr); }
	.pr-newsletter__form-card,
	.pr-newsletter__whatsapp { min-width: 0; padding: 20px; }
	.pr-newsletter__phone,
	.pr-newsletter__phone input,
	.pr-newsletter__form-card form,
	.pr-newsletter__form-card input { min-width: 0; }
}

/* Small phones: the "Join WhatsApp Community" button (no wrapping) stuck out of its card. */
@media (max-width: 400px) {
	.pr-newsletter__whatsapp .btn { max-width: 100%; white-space: normal; text-align: center; justify-content: center; }
}

/* ==== Parent Resources UI pass (2026-10-27): homepage-style panels, card
   shadows, coloured icon glows, video double-title fix, layout fixes ==== */
.page-template-parent-resources main {
	--pr-panel-border: 1px solid rgba(79, 91, 234, 0.12);
	--pr-panel-bg:
		radial-gradient(420px 260px at 0% 0%, rgba(124, 58, 237, 0.06), transparent 70%),
		radial-gradient(360px 240px at 100% 100%, rgba(242, 112, 27, 0.05), transparent 70%),
		linear-gradient(135deg, #f7f6fc 0%, #fafbfd 55%, #f4f6fb 100%);
	--pr-panel-shadow: 0 2px 6px rgba(16, 31, 77, 0.05), 0 22px 48px -14px rgba(79, 91, 234, 0.32);
	--pr-card-shadow: 0 2px 6px rgba(16, 31, 77, 0.04), 0 14px 30px -16px rgba(16, 31, 77, 0.28);
	--pr-card-hover: 0 4px 10px rgba(16, 31, 77, 0.05), 0 24px 44px -16px rgba(79, 91, 234, 0.48);
}

/* 1-6. Every card type: soft shadow + hover lift */
.page-template-parent-resources main :is(.pr-topic, .pr-reading__card, .pr-expert, .pr-quick__card, .pr-guide, .pr-event, .pr-video__more, .get-started__card) {
	border-color: rgba(79, 91, 234, 0.10);
	border-radius: 16px;
	box-shadow: var(--pr-card-shadow);
	transition: transform .25s ease, box-shadow .25s ease;
}
.page-template-parent-resources main :is(.pr-topic, .pr-reading__card, .pr-expert, .pr-quick__card, .pr-guide, .pr-event, .pr-video__more, .get-started__card):hover {
	transform: translateY(-5px);
	box-shadow: var(--pr-card-hover);
}

/* 1. Topic icons + 4. quick-answer icons: soft coloured glow */
.page-template-parent-resources main :is(.pr-topic__icon, .pr-quick__icon) { box-shadow: 0 10px 20px -8px rgba(79, 91, 234, 0.45); transition: transform .25s ease; }
.page-template-parent-resources main .pr-topic--green .pr-topic__icon,
.page-template-parent-resources main .pr-quick__icon--green,
.page-template-parent-resources main .pr-quick__icon--teal { box-shadow: 0 10px 20px -8px rgba(22, 163, 74, 0.45); }
.page-template-parent-resources main .pr-topic--pink .pr-topic__icon,
.page-template-parent-resources main .pr-quick__icon--pink { box-shadow: 0 10px 20px -8px rgba(236, 72, 153, 0.45); }
.page-template-parent-resources main .pr-topic--orange .pr-topic__icon,
.page-template-parent-resources main .pr-quick__icon--orange { box-shadow: 0 10px 20px -8px rgba(234, 88, 12, 0.45); }
.page-template-parent-resources main .pr-topic:hover .pr-topic__icon { transform: scale(1.08); }

/* 2. Reading cards: photo zoom */
.page-template-parent-resources main .pr-reading__media { overflow: hidden; }
.page-template-parent-resources main .pr-reading__media img { transition: transform .5s ease; }
.page-template-parent-resources main .pr-reading__card:hover .pr-reading__media img { transform: scale(1.05); }

/* 3. Experts: white ring round the photo */
.page-template-parent-resources main .pr-expert__photo img { box-shadow: 0 0 0 4px #fff, 0 0 0 5px rgba(79, 91, 234, 0.18), 0 12px 22px -8px rgba(16, 31, 77, 0.35); }

/* 4-5. Quick answer + guide links as pills */
.page-template-parent-resources main :is(.pr-quick__link, .pr-guide__link) {
	display: inline-flex;
	padding: 7px 16px;
	border: 0;
	border-radius: 999px;
	background: #f1ecfe;
	color: var(--purple);
	font-weight: 700;
	transition: background .2s ease, color .2s ease;
}
.page-template-parent-resources main :is(.pr-quick__card:hover .pr-quick__link, .pr-guide:hover .pr-guide__link) { background: var(--purple); color: #fff; }

/* 6. Event date badges glow */
.page-template-parent-resources main .pr-event__date { box-shadow: 0 8px 16px -8px rgba(16, 31, 77, 0.40); }

/* Video fix: the thumbnails already carry their own title, badge, play button
   and duration (cut from the design), so the HTML overlay printed them twice. */
.page-template-parent-resources main .pr-video :is(.pr-video__badge, .pr-video__play, .pr-video__info, .pr-video__duration) { display: none; }
.page-template-parent-resources main .pr-video { background: none; border-radius: 16px; box-shadow: var(--pr-card-shadow); transition: transform .25s ease, box-shadow .25s ease; }
.page-template-parent-resources main .pr-video:hover { transform: translateY(-4px); box-shadow: var(--pr-card-hover); }
/* keep each thumbnail at its own proportions so the printed title is never cropped */
.page-template-parent-resources main .pr-video img { opacity: 1; }
.page-template-parent-resources main .pr-video--featured { min-height: 0; aspect-ratio: 460 / 255; align-self: start; }
.page-template-parent-resources main .pr-video--featured img { height: 100%; }
.page-template-parent-resources main .pr-videos__side .pr-video { height: auto; aspect-ratio: 248 / 127; }
.page-template-parent-resources main .pr-videos__side .pr-video img { height: 100%; }

/* 7. Wizard card + bottom explore cards */
.page-template-parent-resources main .pr-wizard__card { border: var(--pr-panel-border); border-radius: 20px; box-shadow: var(--pr-panel-shadow); }
.page-template-parent-resources main .pr-explore .get-started__photo { overflow: hidden; }
.page-template-parent-resources main .pr-explore .get-started__photo img { transition: transform .5s ease; }
.page-template-parent-resources main .pr-explore .get-started__card:hover .get-started__photo img { transform: scale(1.05); }

/* 8. Wizard intro: photo beside the heading, rounded with a shadow */
.page-template-parent-resources main .pr-wizard__intro { max-width: 1000px; margin-bottom: 26px; }
.page-template-parent-resources main .pr-wizard__intro-text { flex: 0 1 auto; }
.page-template-parent-resources main .pr-wizard__intro-photo { flex-basis: 220px; border-radius: 18px; box-shadow: 0 18px 36px -16px rgba(16, 31, 77, 0.45); }

/* 9. Newsletter + WhatsApp: equal cards, OR in a circle */
.page-template-parent-resources main .pr-newsletter__grid { align-items: stretch; }
.page-template-parent-resources main :is(.pr-newsletter__form-card, .pr-newsletter__whatsapp) {
	border: var(--pr-panel-border);
	border-radius: 20px;
	background: var(--pr-panel-bg);
	box-shadow: var(--pr-panel-shadow);
}
.page-template-parent-resources main .pr-newsletter__whatsapp { display: flex; flex-direction: column; justify-content: center; }
.page-template-parent-resources main .pr-newsletter__divider {
	align-self: center;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #fff;
	color: var(--purple);
	box-shadow: 0 8px 18px -8px rgba(79, 91, 234, 0.5);
}
.page-template-parent-resources main .pr-newsletter__whatsapp .btn { align-self: flex-start; background: #16a34a; border-color: #16a34a; color: #fff; box-shadow: 0 10px 22px -8px rgba(22, 163, 74, 0.55); }

/* 10. Real Parents: home-page Voices panel, cards spread full width */
.page-template-parent-resources main .testimonials > .container {
	border: var(--pr-panel-border);
	border-radius: 20px;
	padding: 30px 32px 28px;
	background: var(--pr-panel-bg);
	box-shadow: var(--pr-panel-shadow);
}
.page-template-parent-resources main .testimonial { border: 1px solid rgba(79, 91, 234, 0.10); border-radius: 16px; box-shadow: 0 10px 24px -12px rgba(16, 31, 77, 0.28); }
.page-template-parent-resources main .testimonials__more { margin: 20px auto 0; padding: 11px 24px; border-radius: 999px; }
@media (min-width: 1081px) {
	.page-template-parent-resources main .testimonial { flex: 1 1 0; min-width: 0; }
}

@media (max-width: 1240px) {
	.page-template-parent-resources main .testimonials > .container { border-radius: 0; border-left: 0; border-right: 0; }
}
@media (max-width: 900px) {
	/* 11. Mobile hero: proper full-width photo instead of a thin strip */
	.page-template-parent-resources main .pr-hero__photo { height: 260px; object-fit: cover; object-position: 78% center; }
	.page-template-parent-resources main .pr-newsletter__divider { justify-self: center; }
}