/*
Theme Name: Nurse to Nursery
Theme URI: https://nursetonursery.com
Description: A lean Gutenberg child theme of Twenty Twenty-Five for Nurse to Nursery, a resource for Christian couples from pregnancy through the preschool years.
Author: Nurse to Nursery
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nurse-to-nursery
*/

/* Only what theme.json cannot express lives here. Colors come from the palette presets. */

:root {
	--n2n-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0l2.2 7.2L21.5 5l-4.7 5.5L24 12l-7.2 1.5 4.7 5.5-7.3-2.2L12 24l-2.2-7.2L2.5 19l4.7-5.5L0 12l7.2-1.5L2.5 5l7.3 2.2z'/%3E%3C/svg%3E");
	--n2n-cross: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 0h4v8h8v4h-8v12h-4V12H2V8h8z'/%3E%3C/svg%3E");
	--n2n-radius: 12px;
}

a { text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
:where(.wp-site-blocks) :focus-visible { outline: 2px solid var(--wp--preset--color--accent-2); outline-offset: 3px; }

/* ---------- Header and footer ---------- */
.n2n-header { border-bottom: 1px solid var(--wp--preset--color--accent-6); }
.n2n-header .wp-block-site-title a { display: inline-flex; align-items: center; gap: 0.55rem; }
.n2n-header .wp-block-site-title a::before {
	content: ""; width: 1.1rem; height: 1.1rem; flex: none;
	background: var(--wp--preset--color--accent-2);
	-webkit-mask: var(--n2n-star) center / contain no-repeat; mask: var(--n2n-star) center / contain no-repeat;
}
.n2n-header .wp-block-navigation__container { flex-wrap: wrap; row-gap: 0.35rem; }
/* Tablet widths: menu drops to its own row under the site title. Phones get the core hamburger. */
@media (min-width: 600px) and (max-width: 1100px) {
	.n2n-header .wp-block-navigation { flex-basis: 100%; justify-content: flex-start; }
	.n2n-header .wp-block-navigation__container { justify-content: flex-start; }
}
.n2n-header .wp-block-navigation .current-menu-item > a,
.n2n-header .wp-block-navigation a:hover { color: var(--wp--preset--color--accent-1); }
.n2n-nav-cta > a { color: var(--wp--preset--color--accent-1) !important; font-weight: 800; }

.n2n-footer a { color: inherit; }
.n2n-footer .wp-block-navigation { gap: 0.4rem 1.25rem; }
.n2n-footer-note { opacity: 0.8; }
.n2n-footer-legal { border-top: 1px solid color-mix(in srgb, currentColor 25%, transparent); padding-top: 1.25rem; margin-top: 2rem; }

/* ---------- Small type helpers ---------- */
.n2n-eyebrow {
	font-size: 0.75rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase;
	color: var(--wp--preset--color--accent-1);
}
.n2n-lede { font-size: 1.15rem; color: var(--wp--preset--color--accent-4); max-width: 46ch; }
.n2n-meta { color: var(--wp--preset--color--accent-4); font-size: var(--wp--preset--font-size--small); }
.n2n-meta > * + *::before { content: "·"; margin-right: 0.5rem; color: var(--wp--preset--color--accent-6); }

/* ---------- Hero arch ---------- */
.n2n-arch {
	aspect-ratio: 4 / 5; max-width: 100%; position: relative; overflow: hidden;
	border-radius: 999px 999px var(--n2n-radius) var(--n2n-radius);
	border: 1px solid var(--wp--preset--color--accent-6);
	background: linear-gradient(170deg, var(--wp--preset--color--accent-3) 0%, var(--wp--preset--color--accent-3) 45%, var(--wp--preset--color--accent-1) 140%);
	display: flex; flex-direction: column; justify-content: flex-end; padding: 1.75rem;
}
.n2n-arch::before {
	content: ""; position: absolute; top: 18%; left: 50%; width: 44px; height: 44px; transform: translateX(-50%);
	background: var(--wp--preset--color--accent-2);
	-webkit-mask: var(--n2n-star) center / contain no-repeat; mask: var(--n2n-star) center / contain no-repeat;
}
.n2n-arch .wp-block-quote {
	background: var(--wp--preset--color--accent-5); border: 0; border-radius: 10px;
	padding: 1rem 1.1rem; margin: 0; font-size: 1.05rem; max-width: 30ch; align-self: center;
}

/* Arched images (block style) */
.wp-block-image.is-style-n2n-arched img,
.wp-block-post-featured-image.is-style-n2n-arched img { border-radius: 999px 999px var(--n2n-radius) var(--n2n-radius); }

/* ---------- Journey stages ---------- */
.n2n-stages {
	list-style: none; margin: 0; padding: 0; counter-reset: stage;
	display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0 1rem;
}
.n2n-stages > li {
	counter-increment: stage; border-top: 2px solid var(--wp--preset--color--accent-1);
	padding: 0.9rem 0 0.25rem; min-width: 0; line-height: 1.35;
	font-size: 0.85rem; color: var(--wp--preset--color--accent-4);
}
.n2n-stages > li::before {
	content: "STAGE " counter(stage); display: block; margin-bottom: 0.35rem;
	font-size: 0.7rem; font-weight: 800; letter-spacing: 0.08em; color: var(--wp--preset--color--accent-2);
}
.n2n-stages > li a { text-decoration: none; color: var(--wp--preset--color--contrast); }
.n2n-stages > li a:hover { color: var(--wp--preset--color--accent-1); }
.n2n-stages > li strong {
	display: block; font-family: var(--wp--preset--font-family--heading); font-weight: 400;
	font-size: 1.12rem; line-height: 1.2; margin-bottom: 0.2rem;
}
@media (max-width: 960px) { .n2n-stages { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- Article cards (query loops) ---------- */
.n2n-cards .wp-block-post { display: flex; flex-direction: column; gap: 0.6rem; }
.n2n-cards .wp-block-post-featured-image { margin: 0; }
.n2n-cards .wp-block-post-featured-image img { border-radius: 10px; border: 1px solid var(--wp--preset--color--accent-6); }
.n2n-cards .wp-block-post-title { font-size: 1.32rem; line-height: 1.22; margin: 0; }
.n2n-cards .wp-block-post-excerpt { margin: 0; }
.n2n-cards .wp-block-post-excerpt__more-text { display: none; }

/* ---------- Card and callout (block styles) ---------- */
.wp-block-group.is-style-n2n-card,
.wp-block-group.is-style-n2n-callout {
	background: var(--wp--preset--color--accent-5);
	border: 1px solid var(--wp--preset--color--accent-6);
	border-radius: var(--n2n-radius);
	padding: 1.4rem 1.5rem;
}
.wp-block-group.is-style-n2n-callout { background: var(--wp--preset--color--accent-3); border-color: transparent; }
.wp-block-group.is-style-n2n-callout > :first-child { margin-top: 0; }

/* "In your tradition" callout */
.n2n-tradition-title { display: flex; align-items: center; gap: 0.6rem; }
.n2n-tradition-title::before {
	content: ""; width: 1rem; height: 1rem; flex: none; background: var(--wp--preset--color--accent-2);
	-webkit-mask: var(--n2n-cross) center / contain no-repeat; mask: var(--n2n-cross) center / contain no-repeat;
}
.n2n-tradition p strong:first-child {
	display: block; font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--accent-1);
}

/* Medical and affiliate notes */
.n2n-disclosure { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--accent-4); font-style: italic; }
.n2n-medical { font-size: 0.95rem; }

/* ---------- Product review box ---------- */
.n2n-badge {
	display: inline-block; margin: 0; padding: 0.3rem 0.55rem; border-radius: 4px;
	font-size: 0.7rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase;
	background: var(--wp--preset--color--accent-1); color: var(--wp--preset--color--accent-5);
}
.n2n-rating { color: var(--wp--preset--color--accent-2); font-weight: 700; letter-spacing: 0.05em; }
.n2n-review h4 { margin-bottom: 0.25rem; font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--accent-4); }
.n2n-review ul { padding-left: 1.1rem; margin-top: 0; font-size: 0.95rem; }

/* ---------- Checklist (list block style) ---------- */
.wp-block-list.is-style-n2n-checklist { list-style: none; padding-left: 0; }
.wp-block-list.is-style-n2n-checklist > li { position: relative; padding-left: 2rem; margin-bottom: 0.45rem; }
.wp-block-list.is-style-n2n-checklist > li::before {
	content: ""; position: absolute; left: 0; top: 0.3em; width: 1.05rem; height: 1.05rem;
	border: 1.5px solid var(--wp--preset--color--accent-1); border-radius: 4px; background: var(--wp--preset--color--accent-5);
}

/* ---------- Scripture quote (block style) ---------- */
.wp-block-quote.is-style-n2n-scripture {
	border-left: 0; padding-left: 0; text-align: center; max-width: 34ch; margin-inline: auto;
}
.wp-block-quote.is-style-n2n-scripture::before {
	content: ""; display: block; width: 28px; height: 28px; margin: 0 auto 0.75rem; background: var(--wp--preset--color--accent-2);
	-webkit-mask: var(--n2n-star) center / contain no-repeat; mask: var(--n2n-star) center / contain no-repeat;
}

/* ---------- Comparison table ---------- */
.n2n-compare table { border-collapse: collapse; width: 100%; }
.n2n-compare th { text-align: left; background: var(--wp--preset--color--accent-3); }
.n2n-compare th, .n2n-compare td { border: 1px solid var(--wp--preset--color--accent-6); padding: 0.6rem 0.75rem; vertical-align: top; }

/* ---------- Newsletter ---------- */
.n2n-signup { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.n2n-signup input[type="email"] {
	flex: 1 1 220px; min-width: 0; padding: 0.8rem 1.1rem; border-radius: 999px; border: 0; font: inherit;
	background: var(--wp--preset--color--accent-5); color: var(--wp--preset--color--contrast);
}
.n2n-signup button {
	cursor: pointer; padding: 0.8rem 1.5rem; border-radius: 999px; border: 0; font: inherit; font-weight: 800;
	background: var(--wp--preset--color--accent-2); color: var(--wp--preset--color--contrast);
}
.n2n-signup button:hover { background: var(--wp--preset--color--accent-5); }
.n2n-signup input:focus-visible, .n2n-signup button:focus-visible { outline: 2px solid var(--wp--preset--color--accent-5); outline-offset: 2px; }
.n2n-signup-note { flex-basis: 100%; margin: 0.25rem 0 0; font-size: 0.82rem; opacity: 0.85; }

/* ---------- Single post ---------- */
.n2n-author-box { border-top: 1px solid var(--wp--preset--color--accent-6); padding-top: 1.5rem; }
.rank-math-breadcrumb { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--accent-4); }
.rank-math-breadcrumb a { text-decoration: none; }
