/*
Theme Name: Ліцей № 7 Ніжин
Template: twentytwentyfive
Description: Тема сайту Ніжинського ліцею № 7. Мотив шкільного зошита: клітинка, червоні поля, рукописні позначки.
Version: 2026.10.13.05
Text Domain: zosh7
*/

/* ── Шрифти (локально, кирилиця + латиниця) ─────────────────────────── */
@font-face { font-family: Unbounded; font-weight: 400 800; font-display: swap;
	src: url(assets/fonts/unbounded-cyrillic.woff2) format("woff2");
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: Unbounded; font-weight: 400 800; font-display: swap;
	src: url(assets/fonts/unbounded-latin.woff2) format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF; }
@font-face { font-family: Manrope; font-weight: 400 800; font-display: swap;
	src: url(assets/fonts/manrope-cyrillic.woff2) format("woff2");
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: Manrope; font-weight: 400 800; font-display: swap;
	src: url(assets/fonts/manrope-latin.woff2) format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF; }
@font-face { font-family: Caveat; font-weight: 500 700; font-display: swap;
	src: url(assets/fonts/caveat-cyrillic.woff2) format("woff2");
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: Caveat; font-weight: 500 700; font-display: swap;
	src: url(assets/fonts/caveat-latin.woff2) format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF; }

:root {
	--z-cell: 22px;                       /* крок клітинки зошита */
	--z-grid: var(--wp--preset--color--grid);
	--z-margin: var(--wp--preset--color--margin);
	--z-ink: var(--wp--preset--color--ink);
}

/* ── Зошит у клітинку: тло + червона лінія полів ───────────────────── */
.is-style-zoshyt {
	position: relative;
	overflow: clip;          /* скотч на фото не дає горизонтальної прокрутки */
	background-color: var(--wp--preset--color--paper);
	background-image:
		linear-gradient(var(--z-grid) 1px, transparent 1px),
		linear-gradient(90deg, var(--z-grid) 1px, transparent 1px);
	background-size: var(--z-cell) var(--z-cell);
	background-position: -1px -1px;
}
.is-style-zoshyt::before {           /* поля */
	content: "";
	position: absolute; top: 0; bottom: 0;
	left: clamp(14px, 4vw, 64px);
	width: 2px;
	background: var(--z-margin);
	opacity: .55;
	pointer-events: none;
}

/* Рукописна позначка вчителя */
.z-hand {
	font-family: var(--wp--preset--font-family--hand) !important;
	color: var(--z-margin);
	font-weight: 600;
	line-height: 1.1;
}
.z-hand.is-tilted { transform: rotate(-2.5deg); transform-origin: left center; display: inline-block; }

/* Маркер-соняшник під ключовими словами */
mark.z-marker, .z-marker mark {
	background: linear-gradient(transparent 58%, color-mix(in srgb, var(--wp--preset--color--sunflower) 75%, transparent) 58% 92%, transparent 92%);
	color: inherit;
	padding: 0 .1em;
}

/* Фото, «вклеєне» в зошит скотчем */
.is-style-vkleieno {
	position: relative;
	padding: 10px 10px 34px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(20,39,90,.12), 0 12px 28px -12px rgba(20,39,90,.35);
	transform: rotate(1.6deg);
}
.is-style-vkleieno img { display: block; width: 100%; height: auto; }
.is-style-vkleieno figcaption {
	position: absolute; left: 12px; right: 12px; bottom: 6px; margin: 0;
	font-family: var(--wp--preset--font-family--hand); font-size: 1.15rem; color: var(--wp--preset--color--ink);
	text-align: center;
}
.is-style-vkleieno::before, .is-style-vkleieno::after {   /* смужки скотчу */
	content: ""; position: absolute; width: 92px; height: 26px;
	background: rgba(245,197,24,.45);
	box-shadow: 0 1px 1px rgba(0,0,0,.06);
}
.is-style-vkleieno::before { top: -12px; left: -18px; transform: rotate(-32deg); }
.is-style-vkleieno::after  { top: -12px; right: -18px; transform: rotate(32deg); }

/* ── Шапка ─────────────────────────────────────────────────────────── */
.z-topbar { font-size: .85rem; overflow-wrap: anywhere; }
.z-topbar a { color: inherit; text-decoration: none; }
.z-topbar .z-a11y-link {
	font: inherit; font-weight: 700; color: inherit; background: none; cursor: pointer;
	border: 1px solid rgba(255,255,255,.6); border-radius: 4px; padding: .05rem .5rem;
}
.z-topbar .z-a11y-link::before {          /* значок доступності кольором тексту (не емодзі) */
	content: ""; display: inline-block; width: 1em; height: 1em; margin-right: .3em; vertical-align: -.15em;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='4' r='2.2'/%3E%3Cpath d='M20.5 7.6c-2.6.7-5.6 1-8.5 1s-5.9-.3-8.5-1l-.5 1.9c1.9.5 4 .9 6 1.1V13l-2 8.2 1.9.5L11 15h2l2.1 6.7 1.9-.5L15 13v-2.4c2-.2 4.1-.6 6-1.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%3Ccircle cx='12' cy='4' r='2.2'/%3E%3Cpath d='M20.5 7.6c-2.6.7-5.6 1-8.5 1s-5.9-.3-8.5-1l-.5 1.9c1.9.5 4 .9 6 1.1V13l-2 8.2 1.9.5L11 15h2l2.1 6.7 1.9-.5L15 13v-2.4c2-.2 4.1-.6 6-1.1z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.z-topbar .z-a11y-link:hover { background: var(--wp--preset--color--sunflower); color: var(--wp--preset--color--ink-deep); }
.z-topbar a:hover { text-decoration: underline; color: var(--wp--preset--color--sunflower); }
.z-emblem {
	display: grid; place-items: center;
	width: 52px; height: 52px; flex: none;
	border: 2px solid var(--z-ink); border-radius: 50%;
	font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: 1.5rem;
	color: var(--z-ink); background: var(--wp--preset--color--paper);
	box-shadow: 3px 3px 0 var(--wp--preset--color--sunflower);
	text-decoration: none !important;
}
.z-header { border-bottom: 1px solid var(--z-grid); }
/* при великому шрифті назва переноситься, а кнопка меню лишається на екрані */
.z-header > .wp-block-group > .wp-block-group { min-width: 0; flex: 1 1 auto; }
.z-header > .wp-block-group > .wp-block-group > .wp-block-group { min-width: 0; }
.z-header .wp-block-site-title, .z-header p { overflow-wrap: anywhere; }
.z-header .wp-block-navigation { flex: none; }
.z-header .wp-block-navigation-item__content { padding: .35rem .15rem; border-bottom: 2px solid transparent; }
.z-header .wp-block-navigation-item__content:hover,
.z-header .current-menu-item > .wp-block-navigation-item__content { border-bottom-color: var(--z-margin); color: var(--wp--preset--color--ink-deep); }

/* ── «Важливо зараз» — закладки ────────────────────────────────────── */
.z-tabs { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; margin: 0; }
.z-tabs li { margin: 0; max-width: 100%; }
.z-tabs a {
	display: inline-block; max-width: 100%; overflow-wrap: anywhere; padding: .55rem .9rem;
	background: var(--wp--preset--color--paper);
	border: 1px solid var(--z-grid); border-left: 4px solid var(--z-margin);
	border-radius: 0 6px 6px 0;
	font-weight: 700; font-size: .95rem; text-decoration: none; color: var(--wp--preset--color--ink-deep);
	transition: transform .15s ease, box-shadow .15s ease;
}
.z-tabs a:hover { transform: translateX(3px); box-shadow: 0 4px 12px -6px rgba(20,39,90,.35); color: var(--wp--preset--color--ink-deep); }

/* ── Новини ────────────────────────────────────────────────────────── */
.z-news .wp-block-post { display: flex; flex-direction: column; gap: .6rem; }
.z-news .wp-block-post-featured-image { margin: 0; aspect-ratio: 4/3; overflow: hidden; border-radius: 6px; background: var(--wp--preset--color--mist); }
.z-news .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.z-news .wp-block-post:hover .wp-block-post-featured-image img { transform: scale(1.03); }
.z-news .wp-block-post-title { font-size: 1.1rem; line-height: 1.3; margin: 0; }

/* ── Розділи: обкладинки зошитів з етикеткою ───────────────────────── */
.z-sections { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); gap: 1.25rem; }
.z-cover {
	position: relative; display: flex; flex-direction: column; justify-content: flex-end;
	min-height: 150px; padding: 1rem;
	border-radius: 4px 10px 10px 4px;
	background: var(--cover, var(--z-ink));
	box-shadow: inset 10px 0 0 rgba(0,0,0,.12), 0 10px 20px -14px rgba(20,39,90,.6);
	text-decoration: none !important;
	transition: transform .18s ease, box-shadow .18s ease;
}
.z-cover:hover { transform: translateY(-4px) rotate(-.6deg); box-shadow: inset 10px 0 0 rgba(0,0,0,.12), 0 18px 26px -14px rgba(20,39,90,.7); }
.z-cover .z-label {                       /* етикетка «Зошит для…» */
	min-width: 0; overflow-wrap: anywhere; hyphens: auto;
	background: #fff; border-radius: 4px; padding: .55rem .7rem .6rem;
	background-image: repeating-linear-gradient(transparent 0 1.45rem, var(--z-grid) 1.45rem calc(1.45rem + 1px));
}
.z-cover .z-label small { display: block; font-family: var(--wp--preset--font-family--hand); font-size: 1.05rem; color: var(--z-margin); line-height: 1.1; }
.z-cover .z-label strong { display: block; font-family: var(--wp--preset--font-family--display); font-weight: 600; font-size: .98rem; color: var(--wp--preset--color--ink-deep); line-height: 1.3; }
.z-cover--blue   { --cover: #22408C; }
.z-cover--green  { --cover: #2E6B4F; }
.z-cover--red    { --cover: #A3142B; }
.z-cover--yellow { --cover: #D9A40B; }
.z-cover--violet { --cover: #5B3F8C; }
.z-cover--teal   { --cover: #1F6E7A; }

/* ── Підвал ────────────────────────────────────────────────────────── */
.z-footer a { color: inherit; }
.z-footer a:hover { color: var(--wp--preset--color--sunflower); }
.z-footer .z-hand { color: var(--wp--preset--color--sunflower); }

/* ── Вміст статей ──────────────────────────────────────────────────── */
/* довгі URL і рядки без пробілів (зі старого Word) не розпирають сторінку */
.wp-block-post-content, .wp-block-post-excerpt, .wp-block-post-title, .entry-content { overflow-wrap: anywhere; }
body { overflow-x: clip; }                 /* страховка: жодної горизонтальної прокрутки */
.wp-block-post-content .wp-block-table { overflow-x: auto; -webkit-overflow-scrolling: touch; }
/* таблиці (фінансові звіти) — природна ширина колонок, прокрутка всередині блока */
.wp-block-post-content .wp-block-table table { table-layout: auto; width: max-content; min-width: 100%; max-width: none; }
.wp-block-post-content .wp-block-table td, .wp-block-post-content .wp-block-table th { overflow-wrap: normal; min-width: 3.5em; max-width: 22em; }
.wp-block-post-navigation-link, .wp-block-post-navigation-link a { overflow-wrap: anywhere; min-width: 0; }
.wp-block-post-content img { max-width: 100%; height: auto; }
.wp-block-post-content .wp-block-gallery img { border-radius: 4px; }
.wp-block-post-content table { border-collapse: collapse; }
.wp-block-post-content td, .wp-block-post-content th { border: 1px solid var(--z-grid); padding: .45rem .6rem; }
.wp-block-file { padding: .75rem 1rem; background: var(--wp--preset--color--mist); border-left: 4px solid var(--z-ink); border-radius: 0 6px 6px 0; }

/* дата/рубрики в шапці новини переносяться при великому шрифті */
.wp-block-post-date { min-width: 0; }
.wp-block-group.is-nowrap:has(> .wp-block-post-date) { flex-wrap: wrap; }

/* ── Мобільне меню (оверлей) ───────────────────────────────────────── */
.wp-block-navigation__responsive-container.is-menu-open {
	padding: 1.25rem 1.25rem 2rem !important;
	opacity: 1 !important;                       /* не покладаємось на fade-анімацію WP: */
	animation: none !important;                  /* меню видиме одразу і на місці */
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	align-items: stretch !important; padding-top: 3rem !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	align-items: stretch !important; justify-content: flex-start !important; text-align: left; width: 100%;
	gap: 0 !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	display: block; width: 100%; padding: .85rem .25rem !important;
	font-size: 1.15rem; border-bottom: 1px solid var(--z-grid) !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	padding: 0 0 0 1rem !important; border-left: 2px solid var(--z-margin) !important; margin: .25rem 0 .5rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-size: 1rem; font-weight: 600; padding: .6rem .25rem !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon { display: none; }
.wp-block-navigation__responsive-container-close { top: 1rem !important; right: 1rem !important; }
.wp-block-navigation__responsive-container-open svg,
.wp-block-navigation__responsive-container-close svg { width: 32px; height: 32px; }

/* «Гамбургер» не лише на телефоні (WP: <600px), а до 1180px — інакше меню переноситься на 2 рядки */
@media (min-width: 600px) and (max-width: 1179px) {
	.z-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.z-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
	.z-header .wp-block-navigation__responsive-container.is-menu-open {
		width: min(440px, 100%); left: auto; right: 0;
		box-shadow: -12px 0 32px -12px rgba(20,39,90,.35);
	}
}
/* збільшений шрифт (панель доступності ≥130%) — меню завжди «гамбургер» */
@media (min-width: 600px) {
	html.z11y-big .z-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	html.z11y-big .z-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
	.z-header .wp-block-navigation__responsive-container.is-menu-open {
		width: min(440px, 100%); left: auto; right: 0;
		box-shadow: -12px 0 32px -12px rgba(20,39,90,.35);
	}
}
@media (max-width: 599px) {
	.z-topbar { font-size: .78rem; }
	.z-topbar > .wp-block-group { row-gap: .1rem; }
	.z-topbar p { margin: 0; }
}

/* ── Доступність ───────────────────────────────────────────────────── */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--wp--preset--color--sunflower) !important;
	outline-offset: 2px;
	box-shadow: 0 0 0 5px var(--wp--preset--color--ink-deep);
	border-radius: 2px;
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; }
	.is-style-vkleieno, .z-hand.is-tilted { transform: none; }
}
@media (max-width: 781px) {
	.is-style-vkleieno { transform: rotate(.8deg); margin-top: 1.5rem; }
	.z-topbar .z-topbar-extra { display: none; }
	.z-sections { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
	.z-cover { min-height: 118px; padding: .6rem; }
	.z-cover .z-label strong { font-size: .85rem; }
}