/* ==========================================================================
   WOLi AI Explorers. Loaded on the site and inside the block editor.
   Colors and type sizes come from theme.json presets.
   Small text uses the "-deep" colors; brand blue, teal and golden yellow are
   decorative or large-text only because they fail AA contrast on white.
   ========================================================================== */

:root {
	--woli-navy: var(--wp--preset--color--navy);
	--woli-slate: var(--wp--preset--color--slate);
	--woli-blue: var(--wp--preset--color--blue);
	--woli-blue-deep: var(--wp--preset--color--blue-deep);
	--woli-teal: var(--wp--preset--color--teal);
	--woli-teal-deep: var(--wp--preset--color--teal-deep);
	--woli-amber: var(--wp--preset--color--amber);
	--woli-amber-deep: var(--wp--preset--color--amber-deep);
	--woli-amber-tint: var(--wp--preset--color--amber-tint);
	--woli-lilac: var(--wp--preset--color--lilac);
	--woli-ice: var(--wp--preset--color--ice);
	--woli-line: var(--wp--preset--color--line);
	--woli-radius: 16px;
	--woli-chip: 10px;
}

html { scroll-padding-top: 1.5rem; }
body { overflow-wrap: break-word; }

/* --------------------------------------------------------------------------
   Focus, skip link, motion
   -------------------------------------------------------------------------- */
:where(a, button, summary, input, select, textarea, [tabindex]):focus-visible {
	outline: 3px solid var(--woli-blue-deep);
	outline-offset: 3px;
	border-radius: 4px;
	box-shadow: 0 0 0 3px #fff;
}
.skip-link.screen-reader-text:focus {
	background: var(--woli-navy);
	color: #fff;
	padding: 0.75rem 1.25rem;
	font-weight: 700;
	z-index: 100000;
}
a { text-underline-offset: 0.16em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }

.wp-element-button,
.wp-block-button__link,
.woli-card-link,
.is-style-card { transition: background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease; }
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

.wp-block-button__link { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	border: 2px solid var(--woli-navy);
	color: var(--woli-navy);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--woli-navy); color: #fff; }
.is-arrow > .wp-block-button__link::after { content: ""; display: inline-block; width: .5em; height: .5em; margin-left: .6em; border-right: 2px solid currentColor; border-top: 2px solid currentColor; transform: rotate(45deg); }

/* --------------------------------------------------------------------------
   Header and navigation. Every link stays visible at every width, no dropdowns.
   -------------------------------------------------------------------------- */
.woli-header { border-bottom: 1px solid var(--woli-line); background: #fff; }
.woli-header__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem 1.5rem;
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
}
.woli-header .wp-block-site-logo img { width: 190px; height: auto; display: block; }
.woli-nav .wp-block-navigation__container { gap: 0.15rem 0.2rem; flex-wrap: wrap; }
.woli-nav .wp-block-navigation-item__content {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 0.7rem;
	border-radius: var(--woli-chip);
	color: var(--woli-navy);
	text-decoration: none;
}
.woli-nav .wp-block-navigation-item__content:hover { background: var(--woli-ice); }
.woli-nav a[aria-current="page"] { box-shadow: inset 0 -3px 0 var(--woli-teal); border-radius: 4px; }
.woli-nav .woli-nav-cta { margin-left: 0.5rem; }
.woli-nav .woli-nav-cta .wp-block-navigation-item__content { background: var(--woli-blue-deep); color: #fff; padding: 0 1.1rem; }
.woli-nav .woli-nav-cta .wp-block-navigation-item__content:hover { background: var(--woli-navy); color: #fff; }
.woli-nav .woli-nav-cta a[aria-current="page"] { box-shadow: none; }

@media (max-width: 1080px) {
	.woli-header__inner { justify-content: flex-start; }
	.woli-nav { width: 100%; }
}
@media (max-width: 720px) {
	.woli-header .wp-block-site-logo img { width: 170px; }
	.woli-nav .wp-block-navigation__container { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.25rem; width: 100%; }
	.woli-nav .wp-block-navigation-item { width: 100%; }
	.woli-nav .wp-block-navigation-item__content { width: 100%; background: var(--woli-ice); justify-content: center; text-align: center; padding: 0 .4rem; }
	.woli-nav .woli-nav-cta { margin-left: 0; }
}

/* --------------------------------------------------------------------------
   Sections and layout helpers
   -------------------------------------------------------------------------- */
.woli-section { padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--60); margin-top: 0 !important; margin-bottom: 0 !important; }
.woli-section.is-ice { background: var(--woli-ice); }
.woli-section.is-tight { padding-top: var(--wp--preset--spacing--50); padding-bottom: var(--wp--preset--spacing--50); }
.woli-section__head { max-width: 46rem; margin-bottom: 2rem; }
.woli-section__head > * + * { margin-top: 0.6rem; }
.woli-prose { max-width: 46rem; }
main > * + *, .wp-block-post-content > .woli-section + .woli-section { margin-block-start: 0; }

.is-style-eyebrow {
	font-size: 0.9375rem;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--woli-teal-deep);
}
.is-style-lead { font-size: var(--wp--preset--font-size--large); line-height: 1.5; color: var(--woli-slate); }

/* --------------------------------------------------------------------------
   Page heroes. Student pages get the compass; adult pages stay plain navy on white.
   -------------------------------------------------------------------------- */
.woli-hero { position: relative; overflow: hidden; background: var(--woli-ice); padding-top: clamp(2.5rem, 7vw, 5.5rem); padding-bottom: clamp(2.5rem, 7vw, 5.5rem); margin-top: 0 !important; margin-bottom: 0 !important; }
.woli-hero__copy { position: relative; z-index: 1; }
.woli-hero__copy > * { max-width: 42rem; }
.woli-hero__copy > .wp-block-heading { max-width: 46rem; }
.woli-hero__copy > .wp-block-buttons { margin-top: 1.75rem; }
.woli-hero__tagline { font-size: var(--wp--preset--font-size--x-large); font-weight: 700; color: var(--woli-teal-deep); margin-top: 1rem; }
.woli-hero.has-compass::after {
	content: "";
	position: absolute;
	top: 50%;
	right: max(16px, calc(50% - 590px));
	width: clamp(340px, 36vw, 500px);
	aspect-ratio: 1;
	transform: translateY(-50%);
	background: url("../images/compass-route.svg") center / contain no-repeat;
}
@media (min-width: 901px) {
	.woli-hero.has-compass .woli-hero__copy > * { max-width: min(42rem, calc(100% - 26rem)); }
	.woli-hero.has-compass .woli-hero__copy > .wp-block-heading { max-width: min(46rem, calc(100% - 25rem)); }
}
@media (max-width: 900px) {
	.woli-hero.has-compass::after { display: none; }
}
.woli-hero.is-adult { background: #fff; border-bottom: 1px solid var(--woli-line); }
.woli-hero.is-adult .is-style-eyebrow { color: var(--woli-blue-deep); }
.woli-hero.is-lesson { padding-top: 2rem; padding-bottom: 2.5rem; }

/* --------------------------------------------------------------------------
   Quick facts: flyer-style cards with a colored top rule
   -------------------------------------------------------------------------- */
ul.is-style-facts {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
	gap: 0.75rem;
}
ul.is-style-facts > li {
	background: #fff;
	border: 1px solid var(--woli-line);
	border-top: 6px solid var(--woli-blue);
	border-radius: var(--woli-chip);
	padding: 0.85rem 1rem;
	font-weight: 900;
	font-size: 1.125rem;
	text-align: center;
	margin: 0;
}
ul.is-style-facts > li:nth-child(4n+2) { border-top-color: var(--woli-teal); }
ul.is-style-facts > li:nth-child(4n+3) { border-top-color: var(--woli-lilac); }
ul.is-style-facts > li:nth-child(4n+4) { border-top-color: var(--woli-amber); }
.woli-facts-band { margin-top: -1.5rem !important; position: relative; z-index: 2; }

/* --------------------------------------------------------------------------
   Cards and grids
   -------------------------------------------------------------------------- */
.is-style-card {
	background: #fff;
	border: 1px solid var(--woli-line);
	border-radius: var(--woli-radius);
	padding: 1.5rem;
	position: relative;
}
.is-ice .is-style-card { border-color: transparent; }
.is-style-card > * + * { margin-top: 0.6rem; }
.is-style-card > .wp-block-heading { margin-top: 0.75rem; }
.is-style-tinted { background: var(--woli-ice); border-radius: var(--woli-radius); padding: 1.5rem; }
.is-style-tinted > * + * { margin-top: 0.6rem; }

.is-style-chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.75rem;
	height: 2.75rem;
	padding: 0 0.5rem;
	border-radius: var(--woli-chip);
	background: var(--woli-blue-deep);
	color: #fff;
	font-weight: 900;
	font-size: 1.0625rem;
	line-height: 1;
}
.is-teal .is-style-chip { background: var(--woli-teal-deep); }
.is-lilac .is-style-chip { background: var(--woli-lilac); }
.is-navy .is-style-chip { background: var(--woli-navy); }

.woli-strand { border-top: 6px solid var(--woli-blue); }
.woli-strand.is-teal { border-top-color: var(--woli-teal); }
.woli-strand.is-lilac { border-top-color: var(--woli-lilac); }

.is-style-tag {
	display: inline-block;
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--woli-slate);
}
.woli-card-link .wp-block-post-title a,
.woli-card-link .wp-block-heading a { color: var(--woli-navy); text-decoration: none; }
.woli-card-link .wp-block-post-title a::after,
.woli-card-link .wp-block-heading a::after { content: ""; position: absolute; inset: 0; border-radius: var(--woli-radius); }
.woli-card-link:hover { border-color: var(--woli-blue-deep); box-shadow: 0 6px 18px rgba(16, 42, 67, .1); }
.woli-card-link:hover .wp-block-post-title a,
.woli-card-link:hover .wp-block-heading a { text-decoration: underline; }
.woli-card-link:focus-within { border-color: var(--woli-blue-deep); }
.wp-block-post-template.is-layout-grid { list-style: none; padding: 0; gap: 1.25rem; }

/* --------------------------------------------------------------------------
   Pillars: round icons, a deliberately different shape from the strand cards
   -------------------------------------------------------------------------- */
.woli-pillar { text-align: center; }
.woli-pillar > * + * { margin-top: 0.35rem; }
.woli-pillar::before {
	content: "";
	display: block;
	width: 4.5rem;
	height: 4.5rem;
	margin: 0 auto 0.75rem;
	border-radius: 50%;
	background-color: #fff;
	background-position: center;
	background-repeat: no-repeat;
	background-size: 2.25rem;
	border: 3px solid var(--woli-teal);
}
.woli-pillar.is-learn::before { border-color: var(--woli-blue); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23102A43' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 6.5C10 4.8 7 4.5 3 5v14c4-.5 7-.2 9 1.500 2-1.700 5-2 9-1.500V5c-4-.5-7-.2-9 1.500Z'/%3E%3Cpath d='M12 6.500V20.500'/%3E%3C/svg%3E"); }
.woli-pillar.is-create::before { border-color: var(--woli-teal); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23102A43' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 20 1-4L16.500 4.500a2.100 2.100 0 0 1 3 3L8 19l-4 1Z'/%3E%3Cpath d='m14.500 6.500 3 3'/%3E%3C/svg%3E"); }
.woli-pillar.is-collaborate::before { border-color: var(--woli-lilac); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23102A43' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8.500' cy='8' r='3.500'/%3E%3Cpath d='M2 20c.5-4 3-6 6.500-6s6 2 6.500 6'/%3E%3Cpath d='M15.500 4.800a3.500 3.500 0 0 1 0 6.400'/%3E%3Cpath d='M17.500 14.300c2.500.6 4 2.700 4.500 5.700'/%3E%3C/svg%3E"); }
.woli-pillar.is-innovate::before { border-color: var(--woli-amber); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23102A43' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6'/%3E%3Cpath d='M10 21h4'/%3E%3Cpath d='M12 3a6.500 6.500 0 0 0-4 11.600c.7.600 1 1.400 1 2.400h6c0-1 .3-1.800 1-2.400A6.500 6.500 0 0 0 12 3Z'/%3E%3C/svg%3E"); }
.woli-pillar.is-showcase::before { border-color: var(--woli-navy); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23102A43' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='12' rx='1.500'/%3E%3Cpath d='M12 16v4'/%3E%3Cpath d='M8 20h8'/%3E%3Cpath d='m8 12 3-3 2 2 3-3'/%3E%3C/svg%3E"); }

/* --------------------------------------------------------------------------
   Six-week route: an ordered list drawn as a map line with waypoints
   -------------------------------------------------------------------------- */
ol.is-style-path {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 0.75rem;
	position: relative;
}
ol.is-style-path > li {
	position: relative;
	margin: 0;
	padding-top: 3.75rem;
	font-weight: 700;
	line-height: 1.3;
}
ol.is-style-path > li::before {
	content: "";
	position: absolute;
	top: 1.3rem;
	left: 0;
	right: -0.75rem;
	border-top: 4px dotted var(--woli-teal);
}
ol.is-style-path > li:last-child::before { display: none; }
ol.is-style-path > li > strong {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	background: var(--woli-navy);
	color: #fff;
	font-weight: 900;
	box-shadow: 0 0 0 5px var(--woli-path-bg, #fff);
}
ol.is-style-path > li:nth-child(2) > strong,
ol.is-style-path > li:nth-child(5) > strong { background: var(--woli-blue-deep); }
ol.is-style-path > li:nth-child(3) > strong { background: var(--woli-teal-deep); }
ol.is-style-path > li:nth-child(4) > strong { background: var(--woli-lilac); }
ol.is-style-path > li:last-child > strong { background: var(--woli-amber); color: var(--woli-navy); }
.is-ice { --woli-path-bg: var(--woli-ice); }
@media (max-width: 860px) {
	ol.is-style-path { grid-template-columns: 1fr; gap: 0; }
	ol.is-style-path > li { padding: 0.65rem 0 0.65rem 4rem; min-height: 4rem; display: flex; align-items: center; }
	ol.is-style-path > li > strong { top: 0.5rem; }
	ol.is-style-path > li::before { top: 0; bottom: 0; left: 1.35rem; right: auto; border-top: 0; border-left: 4px dotted var(--woli-teal); }
	ol.is-style-path > li:first-child::before { top: 50%; }
	ol.is-style-path > li:last-child::before { display: block; right: auto; bottom: 50%; }
}

/* --------------------------------------------------------------------------
   Three-five-six architecture diagram (The Program)
   -------------------------------------------------------------------------- */
.woli-arch { display: grid; gap: 0.75rem; }
.woli-arch__row {
	display: grid;
	grid-template-columns: 13rem minmax(0, 1fr);
	gap: 1rem 1.5rem;
	align-items: center;
	background: #fff;
	border: 1px solid var(--woli-line);
	border-left: 8px solid var(--woli-blue);
	border-radius: var(--woli-chip);
	padding: 1.1rem 1.25rem;
}
.woli-arch__row > * { margin: 0 !important; }
.woli-arch__row.is-teal { border-left-color: var(--woli-teal); }
.woli-arch__row.is-amber { border-left-color: var(--woli-amber); }
.woli-arch__row .wp-block-heading { font-size: 1.125rem; }
.woli-arch__row .wp-block-heading span { display: block; font-size: 0.9375rem; font-weight: 700; color: var(--woli-slate); letter-spacing: .01em; }
@media (max-width: 720px) { .woli-arch__row { grid-template-columns: 1fr; } }

ul.is-style-dots { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.4rem 0.5rem; }
ul.is-style-dots > li { margin: 0; padding: 0.3rem 0.8rem; border-radius: 999px; background: var(--woli-ice); font-weight: 700; font-size: 1rem; }

/* --------------------------------------------------------------------------
   Week cards
   -------------------------------------------------------------------------- */
.woli-week { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); column-gap: 1rem; }
.woli-week > * { grid-column: 2; margin-top: 0; }
.woli-week > * + * { margin-top: 0.5rem; }
.woli-week > .is-style-chip { grid-column: 1; grid-row: 1 / span 4; align-self: start; margin-top: 0; }
.woli-week > .wp-block-heading { margin-top: 0; }
.woli-week .woli-make { color: var(--woli-teal-deep); font-weight: 700; }
.woli-week .woli-make strong { color: var(--woli-navy); }
@media (max-width: 520px) {
	.woli-week { display: block; }
	.woli-week > .is-style-chip { margin-bottom: 0.6rem; }
}

/* --------------------------------------------------------------------------
   Lists
   -------------------------------------------------------------------------- */
ul.is-style-checks { list-style: none; padding: 0; margin-left: 0; margin-right: 0; margin-bottom: 0; }
ul.is-style-checks > li { position: relative; padding-left: 1.85rem; margin: 0 0 0.5rem; }
ul.is-style-checks > li::before {
	content: "";
	position: absolute;
	left: 0.1rem;
	top: 0.4rem;
	width: 0.95rem;
	height: 0.5rem;
	border-left: 3px solid var(--woli-teal-deep);
	border-bottom: 3px solid var(--woli-teal-deep);
	transform: rotate(-45deg);
}
ol.is-style-steps { counter-reset: woli; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 0.75rem; }
ol.is-style-steps > li { counter-increment: woli; margin: 0; background: #fff; border: 1px solid var(--woli-line); border-radius: var(--woli-chip); padding: 0.8rem 1rem 0.8rem 3.25rem; position: relative; font-weight: 700; min-height: 3.25rem; display: flex; align-items: center; }
ol.is-style-steps > li::before { content: counter(woli); position: absolute; left: 0.75rem; top: 50%; transform: translateY(-50%); width: 1.85rem; height: 1.85rem; border-radius: 50%; background: var(--woli-navy); color: #fff; font-weight: 900; font-size: 1rem; display: flex; align-items: center; justify-content: center; }

/* --------------------------------------------------------------------------
   Notices
   -------------------------------------------------------------------------- */
.is-style-notice, .is-style-safety, .is-style-adult { border-radius: var(--woli-chip); padding: 1rem 1.25rem; }
.is-style-notice > * + *, .is-style-safety > * + *, .is-style-adult > * + * { margin-top: 0.4rem; }
.is-style-notice { background: var(--woli-amber-tint); border-left: 6px solid var(--woli-amber); }
.is-style-safety { background: #fff; border: 2px solid var(--woli-teal-deep); border-left-width: 8px; }
.is-style-adult { background: #F3F0FA; border-left: 6px solid var(--woli-lilac); }
.is-style-safety strong:first-child, .is-style-notice strong:first-child, .is-style-adult strong:first-child { font-weight: 900; }
.woli-pill { display: inline-block; background: var(--woli-lilac); color: #fff; font-weight: 900; font-size: 0.9375rem; letter-spacing: .06em; text-transform: uppercase; padding: 0.3rem 0.85rem; border-radius: 999px; }

/* --------------------------------------------------------------------------
   Lesson pages
   -------------------------------------------------------------------------- */
.woli-lesson-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin-top: 0.75rem; }
.woli-lesson-meta > * { margin: 0 !important; }
.woli-lesson-meta .wp-block-post-terms { background: #fff; border: 1px solid var(--woli-line); border-radius: 999px; padding: 0.25rem 0.8rem; font-size: 0.9375rem; font-weight: 700; }
.woli-lesson-meta .wp-block-post-terms a { color: var(--woli-navy); text-decoration: none; }
.woli-lesson-meta .wp-block-post-terms a:hover { text-decoration: underline; }
.woli-backlink { margin-bottom: 1.25rem; font-weight: 700; }
.woli-backlink a { display: inline-flex; align-items: center; min-height: 44px; }
.woli-lesson-body { padding-top: 2.5rem; padding-bottom: 3rem; }
.woli-lesson-body h2 { font-size: 1.625rem; margin-top: 2.25rem; }
.woli-lesson-body .wp-block-group + h2 { margin-top: 2.25rem; }
.woli-activity { background: var(--woli-ice); border-radius: var(--woli-radius); padding: 1.5rem; margin-top: 2.25rem; scroll-margin-top: 1rem; }
.woli-activity > * + * { margin-top: 0.7rem; }
.woli-activity h2 { margin-top: 0 !important; }
.woli-goal { border-left: 6px solid var(--woli-teal); padding: 0.25rem 0 0.25rem 1.1rem; font-size: 1.1875rem; }
.woli-lesson-nav { border-top: 1px solid var(--woli-line); padding-top: 1.25rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem 1.5rem; }
.woli-lesson-nav > * { margin: 0 !important; }
.woli-lesson-nav a { display: inline-flex; min-height: 44px; align-items: center; font-weight: 700; }
.woli-print-button { appearance: none; background: #fff; border: 2px solid var(--woli-navy); color: var(--woli-navy); border-radius: var(--woli-chip); padding: 0.4rem 1rem; min-height: 44px; font: inherit; font-weight: 700; cursor: pointer; }
.woli-print-button:hover { background: var(--woli-navy); color: #fff; }
.woli-print-button[hidden] { display: none; }

.woli-case { border: 1px solid var(--woli-line); border-radius: var(--woli-chip); padding: 1rem 1.25rem; }
.woli-case > * + * { margin-top: 0.3rem; }
.woli-case h3 { font-size: 1.125rem; }

/* --------------------------------------------------------------------------
   Tables, FAQ, operator block
   -------------------------------------------------------------------------- */
.wp-block-table { overflow-x: auto; }
.wp-block-table table { border-collapse: collapse; width: 100%; min-width: 36rem; background: #fff; }
.wp-block-table th, .wp-block-table td { border: 1px solid var(--woli-line); padding: 0.7rem 0.85rem; text-align: left; vertical-align: top; }
.wp-block-table thead th { background: var(--woli-navy); color: #fff; border-color: var(--woli-navy); }
.wp-block-table tbody th { font-weight: 700; }

.wp-block-details { border: 1px solid var(--woli-line); border-radius: var(--woli-chip); background: #fff; padding: 0; }
.wp-block-details + .wp-block-details { margin-top: 0.6rem; }
.wp-block-details summary { cursor: pointer; font-weight: 700; padding: 0.85rem 1.1rem; min-height: 44px; }
.wp-block-details > *:not(summary) { padding: 0 1.1rem; }
.wp-block-details > *:last-child:not(summary) { padding-bottom: 1rem; }

.woli-operator { display: grid; grid-template-columns: minmax(0, 1fr) 12rem; gap: 1.5rem 2.5rem; align-items: center; }
.woli-operator img { width: 100%; height: auto; max-width: 12rem; }
@media (max-width: 720px) { .woli-operator { grid-template-columns: 1fr; } }

.woli-contact-card { background: var(--woli-ice); border-radius: var(--woli-radius); padding: 1.5rem; }
.woli-contact-card > * + * { margin-top: 0.75rem; }

/* --------------------------------------------------------------------------
   Closing band and footer
   -------------------------------------------------------------------------- */
.woli-closing { text-align: center; }
.woli-closing .wp-block-heading { max-width: 46rem; margin-inline: auto; }
.woli-closing .wp-block-buttons { justify-content: center; margin-top: 1.5rem; }

.woli-footer { background: #fff; border-top: 4px solid var(--woli-teal); margin-top: 0 !important; padding-top: 2.5rem; padding-bottom: 2.5rem; }
.woli-footer__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 1.5rem 3rem; align-items: start; }
.woli-footer .wp-block-site-logo img { width: 170px; height: auto; display: block; }
.woli-footer__legal { font-size: 1rem; color: var(--woli-slate); margin-top: 0.85rem; }
.woli-footer__legal + .woli-footer__legal { margin-top: 0.25rem; }
.woli-footer-nav .wp-block-navigation__container { gap: 0 1.1rem; flex-wrap: wrap; }
.woli-footer-nav .wp-block-navigation-item__content { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; color: var(--woli-navy); font-weight: 400; }
@media (max-width: 760px) { .woli-footer__inner { grid-template-columns: 1fr; } }

/* --------------------------------------------------------------------------
   Print: lessons and resources become clean paper handouts
   -------------------------------------------------------------------------- */
@media print {
	.woli-header, .woli-footer, .woli-backlink, .woli-lesson-nav, .woli-print-button, .wp-block-buttons, .skip-link { display: none !important; }
	body { font-size: 11.5pt; color: #000; }
	.woli-hero, .woli-activity, .is-style-tinted, .is-style-notice, .is-style-safety, .is-style-adult { background: none !important; border: 1px solid #777 !important; box-shadow: none; }
	.woli-hero { padding: 0.75rem !important; }
	.woli-hero::after { display: none !important; }
	a { color: #000; text-decoration: none; }
	h2, h3 { break-after: avoid; }
	.woli-activity, .woli-case, .is-style-card, .wp-block-details { break-inside: avoid; }
}

/* Wrapper that keeps section content left-aligned inside the wide layout */
.woli-wrap > .wp-block-buttons { margin-top: 1.75rem; }
.woli-wrap > .is-style-facts + p { margin-top: 1.25rem; }
.woli-wrap > .wp-block-table + p { margin-top: 1.25rem; }
.woli-closing .woli-wrap { display: grid; justify-items: center; gap: 1.5rem; }
.woli-closing .is-style-notice { text-align: left; max-width: 46rem; width: 100%; }

/* Fill-in tables on printable guides */
.woli-fill td { height: 4.75rem; }
.woli-fill table { min-width: 0; }
.wp-block-table.woli-fill + .wp-block-table.woli-fill { margin-top: 1.5rem; }
@media print {
	.woli-fill thead th { background: #fff !important; color: #000 !important; border-color: #000 !important; }
	.woli-fill td, .woli-fill th { border-color: #000 !important; }
}

/* Template spacing: header, main and footer sit flush */
.wp-site-blocks > * + * { margin-block-start: 0; }
.wp-site-blocks > main, main.wp-block-group, main .wp-block-post-content { margin-block-start: 0; }

/* Five pillars always fill the row, then wrap evenly */
.woli-pillars.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(10rem, 100%), 1fr)) !important; }

/* Two-up sections use the full width instead of leaving an empty third track */
.woli-two.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; column-gap: clamp(1.5rem, 4vw, 3.5rem); row-gap: 1.5rem; }
.woli-two > .wp-block-group > h2 { font-size: clamp(1.5rem, 2.6vw, 1.875rem); }
@media (max-width: 760px) { .woli-two.is-layout-grid { grid-template-columns: minmax(0, 1fr) !important; } }

/* Lesson spacing */
.woli-lesson-body > .is-style-safety { margin-bottom: 2rem; }
.woli-lesson-body > .wp-block-post-content > .woli-goal { margin-top: 0; }

/* Data tables stack on phones, so nothing has to scroll sideways */
@media (max-width: 640px) {
	.wp-block-table:not(.woli-fill) { overflow-x: visible; }
	.wp-block-table:not(.woli-fill) table { min-width: 0; border: 0; }
	.wp-block-table:not(.woli-fill) thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	.wp-block-table:not(.woli-fill) tr { display: block; border: 1px solid var(--woli-line); border-radius: var(--woli-chip); padding: 0.75rem 1rem; margin-bottom: 0.6rem; background: #fff; }
	.wp-block-table:not(.woli-fill) td { display: block; border: 0; padding: 0.1rem 0; }
	.wp-block-table:not(.woli-fill) td:first-child { font-weight: 900; color: var(--woli-teal-deep); }
	.wp-block-table:not(.woli-fill) td:nth-child(2) { font-weight: 700; }
}
