/**
 * ISCO · шапка, строка поиска и подвал (ISCO_Layout, docs/60).
 * Макет: Figma «13 · עיצוב קומפקטי» — шапка 88 px, строка поиска 72 px под ней, подвал.
 * Цвета — только токены (tokens.css): палитру меняем там, когда её выберет Шломо.
 */

/* ---------- Пропуск к содержимому ---------- */

.isco-skip-link {
	position: absolute;
	inset-inline-start: 16px;
	inset-block-start: -200px;
	z-index: 10001;
	padding: 12px 18px;
	border-radius: var(--isco-radius-md);
	background: var(--isco-bg-surface);
	color: var(--isco-text-primary);
	font: 600 16px/1.2 Rubik, sans-serif;
	text-decoration: none;
	box-shadow: var(--isco-shadow-float);
}

.isco-skip-link:focus {
	inset-block-start: 12px;
}

.isco-content-anchor {
	display: block;
	block-size: 0;
	outline: 0;
}

/* ---------- Шапка ---------- */

.isco-site-header {
	position: relative;
	z-index: 999;
	background: var(--isco-header-bg);
	color: var(--isco-header-ink);
	font-family: Rubik, "Segoe UI", Arial, sans-serif;
}

.isco-site-header__row {
	position: relative;
	display: flex;
	align-items: center;
	gap: 20px;
	max-inline-size: 1440px;
	min-block-size: 88px;
	margin-inline: auto;
	padding-inline: 64px;
}

.isco-brand {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 12px;
	color: inherit;
	text-decoration: none;
}

.isco-brand__logo {
	display: grid;
	place-items: center;
	inline-size: 52px;
	block-size: 52px;
	border-radius: 50%;
	background: #fff;
}

.isco-brand__logo img {
	inline-size: 48px;
	block-size: 48px;
	border-radius: 50%;
	object-fit: contain;
}

.isco-brand__name strong {
	display: block;
	font: 700 20px/1.2 Rubik, sans-serif;
}

.isco-brand__name small {
	display: block;
	font-size: 13px;
	line-height: 1.2;
}

.isco-hdr-decor {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 6px;
	color: var(--isco-header-line);
}

.isco-hdr-decor__wave {
	margin-block-start: 22px;
}

.isco-nav-panel {
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-inline-size: 0;
}

.isco-nav__list {
	display: flex;
	flex-wrap: nowrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.isco-nav__item {
	position: relative;
	display: flex;
	align-items: center;
	margin: 0;
}

.isco-nav__link {
	display: inline-flex;
	align-items: center;
	min-block-size: 40px;
	padding-inline: 18px;
	border-radius: var(--isco-radius-pill);
	background: var(--isco-header-pill);
	color: var(--isco-header-pill-ink);
	font: 500 16px/1 Rubik, sans-serif;
	text-decoration: none;
	white-space: nowrap;
}

.isco-nav__item--has-sub > .isco-nav__link {
	padding-inline-end: 40px;
}

.isco-nav__link[aria-current="page"] {
	box-shadow: inset 0 -3px 0 currentColor;
}

#isco-header .isco-nav__link:hover {
	background: var(--isco-header-pill);
	color: var(--isco-header-pill-ink);
	text-decoration: underline;
	text-underline-offset: 4px;
}

.isco-nav__toggle,
#isco-header .isco-nav__toggle:hover,
#isco-header .isco-nav__toggle:focus {
	position: absolute;
	inset-inline-end: 6px;
	display: grid;
	place-items: center;
	inline-size: 30px;
	block-size: 30px;
	padding: 0;
	border: 0;
	border-radius: var(--isco-radius-pill);
	background: transparent;
	color: var(--isco-header-pill-ink);
	cursor: pointer;
}

.isco-nav__toggle svg {
	transition: transform 0.2s ease;
}

.isco-nav__toggle[aria-expanded="true"] svg {
	transform: rotate(180deg);
}

.isco-nav__sub {
	position: absolute;
	inset-block-start: calc(100% + 8px);
	inset-inline-start: 0;
	z-index: 5;
	min-inline-size: 250px;
	margin: 0;
	padding: 8px;
	border: 1px solid var(--isco-border-default);
	border-radius: var(--isco-radius-lg);
	background: var(--isco-bg-surface);
	box-shadow: var(--isco-shadow-float);
	list-style: none;
}

/* Мостик над списком, чтобы при наведении мышью список не закрывался в зазоре */
.isco-nav__sub::before {
	content: "";
	position: absolute;
	inset-inline: 0;
	inset-block-start: -10px;
	block-size: 10px;
}

.isco-nav__sub[hidden] {
	display: none;
}

.isco-nav__sub li {
	margin: 0;
}

.isco-nav__sub a {
	display: block;
	padding: 11px 14px;
	border-radius: var(--isco-radius-md);
	color: var(--isco-text-primary);
	font: 400 16px/1.3 Rubik, sans-serif;
	text-decoration: none;
}

.isco-nav__sub a:hover,
.isco-nav__sub a[aria-current="page"] {
	background: var(--isco-bg-subtle);
	color: var(--isco-text-primary);
}

.isco-hdr-actions {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 12px;
}

.isco-hdr-link,
.isco-hdr-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-block-size: 40px;
	border-radius: var(--isco-radius-pill);
	color: var(--isco-header-ink);
	font: 500 16px/1 Rubik, sans-serif;
	text-decoration: none;
	white-space: nowrap;
}

.isco-hdr-link {
	padding-inline: 12px;
}

.isco-hdr-cta {
	padding-inline: 20px;
	border: 1.5px solid var(--isco-header-ink);
}

#isco-header .isco-hdr-link:hover,
#isco-header .isco-hdr-cta:hover {
	color: var(--isco-header-ink);
	text-decoration: underline;
	text-underline-offset: 4px;
}

#isco-header .isco-theme-toggle,
#isco-header .isco-burger {
	display: grid;
	place-items: center;
	inline-size: 40px;
	block-size: 40px;
	padding: 0;
	border: 1.5px solid var(--isco-header-ink);
	border-radius: var(--isco-radius-pill);
	background: transparent;
	color: var(--isco-header-ink);
	cursor: pointer;
}

#isco-header .isco-burger {
	display: none;
}

#isco-header :focus-visible,
.isco-site-footer :focus-visible {
	outline: 3px solid var(--isco-header-ink);
	outline-offset: 3px;
}

#isco-header .isco-nav__sub :focus-visible {
	outline-color: var(--isco-border-focus);
	outline-offset: 0;
}

/* Средние экраны: без украшений и с плотным меню */
@media (max-width: 1399px) {
	.isco-site-header__row {
		gap: 14px;
		padding-inline: 32px;
	}

	.isco-hdr-decor {
		display: none;
	}

	.isco-nav__link {
		padding-inline: 14px;
		font-size: 15px;
	}

	.isco-nav__item--has-sub > .isco-nav__link {
		padding-inline-end: 34px;
	}
}

/* До 1199 px — меню в панели за кнопкой */
@media (max-width: 1199px) {
	.isco-site-header__row {
		justify-content: space-between;
		min-block-size: 72px;
		padding-inline: 16px;
	}

	.isco-brand__logo {
		inline-size: 44px;
		block-size: 44px;
	}

	.isco-brand__logo img {
		inline-size: 40px;
		block-size: 40px;
	}

	.isco-brand__name strong {
		font-size: 18px;
	}

	#isco-header .isco-burger {
		display: grid;
		inline-size: 48px;
		block-size: 48px;
	}

	.isco-burger__close,
	.isco-burger[aria-expanded="true"] .isco-burger__open {
		display: none;
	}

	.isco-burger[aria-expanded="true"] .isco-burger__close {
		display: block;
	}

	.isco-nav-panel {
		position: absolute;
		inset-block-start: 100%;
		inset-inline: 0;
		display: none;
		flex-direction: column;
		align-items: stretch;
		gap: 16px;
		max-block-size: calc(100dvh - 72px);
		padding: 16px 16px 24px;
		overflow-y: auto;
		background: var(--isco-header-bg);
		box-shadow: 0 16px 32px rgba(0, 0, 0, 0.25);
	}

	.isco-nav-panel.is-open {
		display: flex;
	}

	.isco-nav__list {
		flex-direction: column;
		gap: 8px;
	}

	.isco-nav__item {
		flex-wrap: wrap;
	}

	.isco-nav__link {
		flex: 1 1 100%;
		min-block-size: 48px;
		font-size: 16px;
	}

	.isco-nav__toggle,
	#isco-header .isco-nav__toggle:hover,
	#isco-header .isco-nav__toggle:focus {
		inset-block-start: 4px;
		inline-size: 40px;
		block-size: 40px;
	}

	.isco-nav__sub {
		position: static;
		flex: 1 1 100%;
		margin-block-start: 6px;
		box-shadow: none;
	}

	.isco-hdr-actions {
		flex-wrap: wrap;
		padding-block-start: 12px;
		border-block-start: 1px solid var(--isco-header-line);
	}

	.isco-hdr-link,
	.isco-hdr-cta {
		min-block-size: 48px;
	}

	#isco-header .isco-theme-toggle {
		inline-size: 48px;
		block-size: 48px;
	}
}

/* Наведение мышью на широком экране раскрывает подменю (клик и клавиатура — через кнопку) */
@media (hover: hover) and (min-width: 1200px) {
	.isco-nav__item--has-sub:hover > .isco-nav__sub {
		display: block;
	}
}

/* ---------- Строка поиска ---------- */

.isco-sbar {
	background: var(--isco-searchbar-bg);
	font-family: Rubik, "Segoe UI", Arial, sans-serif;
}

.isco-sbar__form {
	display: flex;
	align-items: center;
	gap: 12px;
	max-inline-size: 1440px;
	margin: 0 auto;
	padding: 12px 64px;
}

.isco-sbar__field {
	position: relative;
	display: flex;
	flex: 0 0 200px;
	align-items: center;
	block-size: 48px;
	border: 1.5px solid var(--isco-field-border);
	border-radius: var(--isco-radius-md);
	background: var(--isco-field-bg);
}

.isco-sbar__field--query {
	flex: 1 1 auto;
}

.isco-sbar__field:focus-within {
	outline: 3px solid var(--isco-border-focus);
	outline-offset: 2px;
}

.isco-sbar__icon {
	position: absolute;
	inset-inline-start: 14px;
	display: flex;
	color: var(--isco-icon-brand);
	pointer-events: none;
}

.isco-sbar .isco-sbar__field input,
.isco-sbar .isco-sbar__field select {
	inline-size: 100%;
	block-size: 100%;
	margin: 0;
	padding-block: 0;
	padding-inline: 44px 14px;
	border: 0;
	border-radius: var(--isco-radius-md);
	background: transparent;
	color: var(--isco-text-primary);
	font: 400 16px/1.2 Rubik, sans-serif;
	box-shadow: none;
}

.isco-sbar .isco-sbar__field input:focus,
.isco-sbar .isco-sbar__field select:focus {
	outline: 0;
}

.isco-sbar .isco-sbar__field input::placeholder {
	color: var(--isco-text-secondary);
	opacity: 1;
}

.isco-sbar .isco-sbar__field select option {
	background: var(--isco-field-bg);
	color: var(--isco-text-primary);
}

.isco-sbar__submit,
.isco-sbar .isco-sbar__submit:hover,
.isco-sbar .isco-sbar__submit:focus {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 8px;
	block-size: 48px;
	padding-inline: 28px;
	border: 0;
	border-radius: var(--isco-radius-pill);
	background: var(--isco-header-bg);
	color: var(--isco-header-ink);
	font: 500 16px/1 Rubik, sans-serif;
	cursor: pointer;
}

.isco-sbar .isco-sbar__submit:hover span {
	text-decoration: underline;
	text-underline-offset: 4px;
}

@media (max-width: 1199px) {
	.isco-sbar__form {
		padding: 12px 16px;
	}

	.isco-sbar__field--query {
		min-inline-size: 0;
	}
}

/* Телефон: запрос и кнопка-лупа в один ряд */
@media (max-width: 599px) {
	.isco-sbar__form {
		gap: 8px;
		padding: 10px 16px;
	}

	.isco-sbar__submit,
	.isco-sbar .isco-sbar__submit:hover,
	.isco-sbar .isco-sbar__submit:focus {
		justify-content: center;
		inline-size: 48px;
		padding: 0;
	}

	.isco-sbar__submit span {
		position: absolute;
		inline-size: 1px;
		block-size: 1px;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}
}

/* ---------- Подвал ---------- */

.isco-site-footer {
	background: var(--isco-footer-bg);
	color: var(--isco-footer-ink);
	font: 400 15px/1.6 Rubik, "Segoe UI", Arial, sans-serif;
}

.isco-site-footer a {
	color: var(--isco-footer-ink);
	text-decoration: none;
}

.isco-site-footer a:hover {
	color: var(--isco-footer-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.isco-site-footer__inner {
	display: grid;
	grid-template-columns: 1.5fr repeat(4, 1fr);
	gap: 32px;
	max-inline-size: 1440px;
	margin: 0 auto;
	padding: 48px 64px 32px;
}

.isco-foot-brand {
	display: flex;
	align-items: center;
	gap: 12px;
}

.isco-foot-brand img {
	border-radius: 50%;
	background: #fff;
}

.isco-foot-brand p {
	margin: 0;
}

.isco-foot-brand strong {
	display: block;
	font: 700 18px/1.2 Rubik, sans-serif;
}

.isco-foot-brand span {
	font-size: 13px;
}

.isco-foot-about > p {
	max-inline-size: 36ch;
	margin: 14px 0;
}

.isco-foot-social {
	display: flex;
	gap: 10px;
}

.isco-soc {
	display: grid;
	place-items: center;
	inline-size: 44px;
	block-size: 44px;
	border: 1.5px solid var(--isco-footer-ink);
	border-radius: 50%;
}

.isco-site-footer .isco-foot-col h2 {
	margin: 0 0 10px;
	color: var(--isco-footer-ink);
	font: 600 17px/1.3 Rubik, sans-serif;
}

.isco-foot-col ul {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.isco-foot-col--contact a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.isco-foot-wa {
	min-block-size: 48px;
	margin-block-start: 14px;
	padding-inline: 18px;
	border: 1.5px solid var(--isco-footer-ink);
	border-radius: var(--isco-radius-pill);
	font-weight: 500;
}

.isco-site-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 24px;
	max-inline-size: 1440px;
	margin: 0 auto;
	padding: 16px 64px 24px;
	border-block-start: 1px solid var(--isco-header-line);
	font-size: 14px;
}

.isco-foot-legal,
.isco-foot-legal .isco-legal-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
}

@media (max-width: 1199px) {
	.isco-site-footer__inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		padding: 40px 16px 24px;
	}

	.isco-foot-about {
		grid-column: 1 / -1;
	}

	.isco-site-footer__bottom {
		padding-inline: 16px;
	}
}

@media (max-width: 479px) {
	.isco-site-footer__inner {
		grid-template-columns: minmax(0, 1fr);
	}

	.isco-site-footer__bottom {
		flex-direction: column;
		align-items: flex-start;
	}
}
