/*
Theme Name: Allo Preschool
Theme URI: https://allopreschool.com/
Author: Allo Preschool
Description: Lightweight block theme for allopreschool.com. Every page is built from core WordPress blocks and Allo section patterns, so text, photos and links can be edited in the page editor without code. No page builder required.
Version: 1.0.2
Requires at least: 6.6
Tested up to: 7.1
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: allo-preschool
*/

/* ---------- Base ---------- */

html { scroll-behavior: smooth; }
:where(section, .wp-block-group)[id] { scroll-margin-top: 96px; }
img { height: auto; }
.has-text-align-center { text-wrap: balance; }
:where(h1, h2, h3) { text-wrap: balance; }
/* Highlighted words are colored text, not a marker pen (unless an editor picks a background). */
mark.has-inline-color { padding: 0; background-color: transparent; }
.allo-center { text-align: center; }
.allo-center .wp-block-image img { margin-inline: auto; }
.allo-center > .wp-block-image { margin-inline: auto; display: table; }
.eyebrow {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	color: var(--wp--preset--color--teal);
	letter-spacing: 0.02em;
	margin-bottom: 0.25rem !important;
}

/* ---------- Header ---------- */

/* Sections sit flush against each other and against the header and footer. */
.wp-site-blocks > * { margin-block-start: 0; }
.allo-page > .alignfull { margin-block-start: 0; }

.site-header-part {
	position: sticky;
	top: 0;
	z-index: 50;
	box-shadow: 0 2px 18px rgba(38, 47, 46, 0.08);
}
.admin-bar .site-header-part { top: var(--wp-admin--admin-bar--height, 32px); }
/* WP Notification Bars pads the page for the old theme's header; size it to the bar and keep the header below it. */
body:has(> .mtsnb-fixed.mtsnb-shown) { padding-top: var(--allo-bar-h, 0px) !important; }
body:has(> .mtsnb-fixed.mtsnb-shown) .site-header-part { top: var(--allo-bar-bottom, 0px); }
.site-header .site-header__logo img { width: 130px; display: block; }
.site-header .wp-block-navigation a:hover { color: var(--wp--preset--color--teal-dark); }
.site-header .nav-phone a::before {
	content: "";
	display: inline-block;
	width: 1em;
	height: 1em;
	margin-right: 0.4em;
	vertical-align: -0.15em;
	background: var(--wp--preset--color--teal);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.site-header__actions { gap: 18px; }
@media (max-width: 781px) {
	.site-header .site-header__logo img { width: 104px; }
	.site-header .wp-block-button__link { padding: 0.6em 1.1em; font-size: 0.85rem; }
}

/* ---------- Hero ---------- */

.allo-hero .wp-block-cover__inner-container { width: 100%; }
.allo-hero__card {
	max-width: 560px;
	background: rgba(255, 255, 255, 0.82);
	-webkit-backdrop-filter: blur(6px);
	        backdrop-filter: blur(6px);
	border-radius: 0 var(--wp--custom--radius--card) var(--wp--custom--radius--card) 0;
	padding: clamp(1.5rem, 4vw, 2.75rem) !important;
}
.allo-hero__card h1 { margin: 0; }

/* ---------- Village card (overlaps the hero) ---------- */

.allo-village {
	position: relative;
	z-index: 2;
	margin-top: -64px !important;
	border-radius: var(--wp--custom--radius--card);
	box-shadow: var(--wp--custom--shadow--card);
}
.allo-village .wp-block-column + .wp-block-column { border-left: 2px solid var(--wp--preset--color--sun); padding-left: 1.5rem; }
@media (max-width: 781px) {
	.allo-village { margin-top: -32px !important; }
	.allo-village .wp-block-column + .wp-block-column { border-left: 0; padding-left: 0; }
}

/* ---------- Lists with check marks ---------- */

.wp-block-list.is-style-checks { list-style: none; padding-left: 0; }
.wp-block-list.is-style-checks li {
	position: relative;
	padding-left: 2rem;
	margin-bottom: 0.7rem;
}
.wp-block-list.is-style-checks li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.2em;
	width: 1.25rem;
	height: 1.25rem;
	border-radius: 50%;
	background: var(--allo-check-bg, var(--wp--preset--color--teal)) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 62% no-repeat;
}
.has-teal-background-color .wp-block-list.is-style-checks li::before,
.has-teal-dark-background-color .wp-block-list.is-style-checks li::before { --allo-check-bg: var(--wp--preset--color--white); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2345B6AC' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }

/* ---------- Cards ---------- */

.wp-block-group.is-style-card {
	background: var(--wp--preset--color--white);
	border-radius: var(--wp--custom--radius--card);
	box-shadow: var(--wp--custom--shadow--card);
	padding: clamp(1.25rem, 3vw, 2rem);
}
.wp-block-image.is-style-soft img,
.wp-block-video.is-style-soft video { border-radius: var(--wp--custom--radius--card); }
.wp-block-video video { width: 100%; max-height: 70vh; object-fit: cover; }
.allo-village__phonetic { color: var(--wp--preset--color--teal-dark); margin-top: 0.25rem !important; }

.allo-step__num {
	display: inline-grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 50%;
	background: var(--wp--preset--color--teal);
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	margin-bottom: 0.5rem !important;
}
.allo-thanks .wp-block-buttons { justify-content: center; }

/* ---------- Expandable bars (promises, how/what we teach) ---------- */

.wp-block-details.is-style-bar {
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 12px;
	background: var(--wp--preset--color--white);
	margin-bottom: 0.75rem;
	overflow: hidden;
}
.wp-block-details.is-style-bar > summary {
	list-style: none;
	cursor: pointer;
	position: relative;
	padding: 0.95rem 3.25rem 0.95rem 1.15rem;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}
.wp-block-details.is-style-bar > summary::-webkit-details-marker { display: none; }
.wp-block-details.is-style-bar > summary::after {
	content: "";
	position: absolute;
	right: 1.1rem;
	top: 50%;
	width: 0.6rem;
	height: 0.6rem;
	border-right: 2px solid var(--wp--preset--color--teal);
	border-bottom: 2px solid var(--wp--preset--color--teal);
	transform: translateY(-70%) rotate(45deg);
	transition: transform 0.2s ease;
}
.wp-block-details.is-style-bar[open] > summary::after { transform: translateY(-30%) rotate(-135deg); }
.wp-block-details.is-style-bar[open] > summary { color: var(--wp--preset--color--teal-dark); }
.wp-block-details.is-style-bar > :not(summary) { padding-left: 1.15rem; padding-right: 1.15rem; }
.wp-block-details.is-style-bar > :last-child:not(summary) { padding-bottom: 1rem; }
.wp-block-details.is-style-bar.has-sun-background-color { border-color: transparent; }

/* ---------- Reviews (swipe on phones, scroll on desktop) ---------- */

.allo-reviews__track {
	display: flex;
	flex-wrap: nowrap !important;
	align-items: stretch !important;
	gap: 1.5rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	padding: 0.5rem 0.25rem 1.25rem;
	-webkit-overflow-scrolling: touch;
}
.allo-reviews__track > .wp-block-group {
	flex: 0 0 min(360px, 85%);
	scroll-snap-align: start;
	margin: 0 !important;
}
.allo-review__stars { color: #F5B301; letter-spacing: 0.15em; margin: 0 !important; }
.allo-review__name { font-family: var(--wp--preset--font-family--heading); font-weight: 600; color: var(--wp--preset--color--ink); margin-top: auto !important; }

/* ---------- Badge on the About photo ---------- */

.allo-badge {
	display: inline-block;
	border-radius: 18px;
	padding: 0.9rem 1.2rem !important;
	line-height: 1.2;
}

/* ---------- Footer ---------- */

.site-footer a { color: inherit; }
.site-footer a:hover { text-decoration: underline; }
.site-footer .site-footer__logo img { width: 150px; }
.site-footer__links { list-style: none; padding-left: 0; }
.site-footer__links li { margin-bottom: 0.4rem; }
.site-footer__legal {
	border-top: 1px solid rgba(255, 255, 255, 0.35);
	padding-top: 1rem;
	margin-top: var(--wp--preset--spacing--40) !important;
	text-align: center;
}

/* ---------- Contact Form 7 inside the contact section ---------- */

.allo-contact .wpcf7 input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.allo-contact .wpcf7 select,
.allo-contact .wpcf7 textarea {
	width: 100%;
	padding: 0.75rem 0.9rem;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 10px;
	font: inherit;
	background: var(--wp--preset--color--white);
}
.allo-contact .wpcf7 input[type="submit"] {
	background: var(--wp--preset--color--rose);
	color: var(--wp--preset--color--white);
	border: 0;
	border-radius: var(--wp--custom--radius--pill);
	padding: 0.85rem 2rem;
	font-family: var(--wp--preset--font-family--ui);
	font-weight: 600;
	cursor: pointer;
}
.allo-contact .wpcf7 input[type="submit"]:hover { background: #C92D4B; }
.allo-contact .wpcf7 label { font-weight: 700; color: var(--wp--preset--color--ink); font-size: 0.95rem; }

/* ---------- Small screens ---------- */

@media (max-width: 781px) {
	.allo-hero { min-height: 72vh !important; }
	.allo-hero__card { border-radius: var(--wp--custom--radius--card); }
}

/* Tap-to-call button, shown only when the menu collapses (phones). */
.site-header__call { display: none; margin: 0; }
.site-header__call a {
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	background: var(--wp--preset--color--teal);
	font-size: 0;
	color: transparent;
}
.site-header__call a::before {
	content: "";
	width: 1.15rem;
	height: 1.15rem;
	background: var(--wp--preset--color--white);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center / contain no-repeat;
}
@media (max-width: 599px) {
	.site-header__call { display: block; }
	.site-header__actions { gap: 10px; }
	.site-header .site-header__logo img { width: 88px; }
	.site-header .wp-block-button__link { white-space: nowrap; padding: 0.6em 0.95em; font-size: 0.8rem; }
}

/* Phone menu: large, left-aligned links. */
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	align-items: flex-start;
	padding-top: 2.5rem;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: flex-start;
	gap: 1.1rem;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 1.35rem;
}
