/* ==========================================================================
   Layout: header, navigation, footer, shared section frame
   ========================================================================== */

/* Shared frame for sections */
.points, .services, .why, .featured, .contact, .projects, .svc-body, .svc-faq,
.about-story, .values, .faq-page, .legal, .posts, .article, .project, .notfound, .page-hero {
	max-width: var(--max);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.section-head {
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	justify-content: space-between;
	gap: 16px 48px;
	margin-block-end: var(--space-s);
}
.section-head__text { max-width: var(--measure); color: var(--muted); }
.section-title { font-size: var(--fs-l); }
.section-title--m { font-size: var(--fs-m); }

/* ---------- Header ---------- */
.site-header { position: relative; z-index: 20; }

.site-header__inner {
	max-width: var(--max);
	margin-inline: auto;
	padding: 16px var(--gutter) 4px;
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 12px clamp(12px, 3vw, 40px);
}

.nav__list,
.mobile-menu__list,
.site-footer__list { list-style: none; }

.nav__list { display: flex; flex-wrap: wrap; gap: 4px clamp(4px, 1vw, 16px); }
.nav--end .nav__list { justify-content: flex-end; }

.nav a {
	position: relative;
	isolation: isolate;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 14px;
	font-size: 16px;
	font-weight: 500;
	color: var(--ink);
	text-decoration: none;
}
/* Plank that rises behind the link */
.nav a::before {
	content: "";
	position: absolute;
	inset: 6px 0;
	z-index: -1;
	border-radius: var(--radius);
	background: repeating-linear-gradient(0deg, rgba(46, 29, 19, .07) 0 1px, transparent 1px 5px), var(--board);
	transform: scaleY(0);
	transform-origin: 50% 100%;
	transition: transform var(--dur) var(--ease);
}
/* Wood line drawn right-to-left */
.nav a::after {
	content: "";
	position: absolute;
	inset-inline: 14px;
	inset-block-end: 8px;
	height: 2px;
	background: var(--wood);
	transform: scaleX(0);
	transform-origin: right center;
	transition: transform var(--dur-micro) var(--ease) 60ms;
}
.nav a:focus-visible::before,
.nav .current-menu-item > a::after,
.nav .current-menu-ancestor > a::after,
.nav a[aria-current]::after { transform: none; }

@media (hover: hover) and (pointer: fine) {
	.nav a:hover::before, .nav a:hover::after { transform: none; }
}

/* The last item of the end menu (צרו קשר) reads as the quiet CTA */
.nav--end .nav__list > li:last-child > a {
	box-shadow: inset 0 0 0 1.5px var(--ink);
	border-radius: var(--radius);
}
.nav--end .nav__list > li:last-child > a::before {
	inset: 0;
	background: repeating-linear-gradient(0deg, rgba(255, 255, 255, .06) 0 1px, transparent 1px 5px), var(--ink);
}
.nav--end .nav__list > li:last-child > a::after { display: none; }
.nav--end .nav__list > li:last-child > a:focus-visible { color: var(--cream); }
@media (hover: hover) and (pointer: fine) {
	.nav--end .nav__list > li:last-child > a:hover { color: var(--cream); }
}

/* Dropdown (תחומים) */
.nav .menu-item-has-children { position: relative; }
.nav .sub-menu {
	list-style: none;
	position: absolute;
	inset-inline-start: 0;
	inset-block-start: 100%;
	z-index: 40;
	min-width: 220px;
	padding: 8px;
	background: var(--cream);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: 0 16px 32px rgba(46, 29, 19, .12);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity var(--dur-micro) var(--ease), transform var(--dur-micro) var(--ease), visibility 0s linear var(--dur-micro);
}
.nav .sub-menu a { display: flex; width: 100%; }
.nav .menu-item-has-children.is-open > .sub-menu,
.nav .menu-item-has-children:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition-delay: 0s;
}
@media (hover: hover) and (pointer: fine) {
	.nav .menu-item-has-children:hover > .sub-menu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
}
.submenu-toggle {
	inline-size: 28px;
	block-size: 44px;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	vertical-align: middle;
}
.submenu-toggle::after {
	content: "";
	display: block;
	inline-size: 8px;
	block-size: 8px;
	margin: auto;
	border-inline-end: 2px solid currentColor;
	border-block-end: 2px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
	transition: transform var(--dur-micro) var(--ease);
}
.submenu-toggle[aria-expanded="true"]::after { transform: translateY(2px) rotate(-135deg); }

/* Logo + living saw blade */
.site-logo {
	position: relative;
	display: block;
	width: clamp(96px, 10.5vw, 148px);
}
.site-logo__img { width: 100%; height: auto; }
.site-logo__saw {
	position: absolute;
	left: 32.574%;
	top: 48.444%;
	width: 35.328%;
	aspect-ratio: 1;
	clip-path: inset(-6% -6% 50% -6%);
}
.site-logo__spin { display: block; width: 100%; height: 100%; }
.site-logo .saw { width: 100%; height: 100%; overflow: visible; }

/* Mobile */
.menu-toggle {
	display: none;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 14px;
	border: 1.5px solid var(--ink);
	border-radius: var(--radius);
	background: none;
	cursor: pointer;
	justify-self: end;
}

@media (max-width: 900px) {
	.site-header__inner { grid-template-columns: auto 1fr; }
	.nav--start, .nav--end { display: none; }
	.site-logo { width: 92px; }
	.menu-toggle { display: inline-flex; }
}

.mobile-menu {
	inline-size: min(100%, 420px);
	max-inline-size: 100%;
	block-size: 100dvh;
	max-block-size: 100dvh;
	margin: 0;
	margin-inline-start: auto;
	padding: 20px var(--gutter) 32px;
	border: 0;
	background: var(--ground);
	color: var(--ink);
}
.mobile-menu::backdrop { background: rgba(46, 29, 19, .45); }
.mobile-menu[open] { display: flex; flex-direction: column; gap: 24px; }
@media (prefers-reduced-motion: no-preference) {
	.mobile-menu[open] { animation: menu-in var(--dur) var(--ease); }
	@keyframes menu-in { from { transform: translateX(-24px); opacity: 0; } }
}
.mobile-menu__top { display: flex; align-items: center; justify-content: space-between; }
.mobile-menu__close {
	display: inline-grid;
	place-items: center;
	inline-size: 44px;
	block-size: 44px;
	border: 0;
	background: none;
	cursor: pointer;
}
.mobile-menu__list a {
	display: flex;
	align-items: center;
	min-height: 52px;
	border-block-end: 1px solid var(--line);
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 34px;
	line-height: 1;
	text-decoration: none;
}
.mobile-menu__list .sub-menu { list-style: none; padding-inline-start: 16px; }
.mobile-menu__list .sub-menu a { font-family: var(--font-body); font-size: 18px; font-weight: 500; min-height: 44px; }
.mobile-menu .contact-actions { margin-block-start: auto; }

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

.site-footer { border-block-start: 1px solid var(--line); margin-block-start: var(--space-m); }
.site-footer__inner {
	max-width: var(--max);
	margin-inline: auto;
	padding: var(--space-s) var(--gutter);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
	gap: 32px;
	align-items: start;
	font-size: var(--fs-small);
	color: var(--muted);
}
.site-footer__brand { display: flex; align-items: center; gap: 20px; }
.site-footer__brand img { width: 110px; }
.site-footer__line { font-size: 17px; color: var(--ink); max-width: 18ch; }
.site-footer__contact p { display: flex; align-items: center; gap: 8px; }
.site-footer__contact p + p { margin-block-start: 8px; }
.site-footer__contact .icon { width: 18px; height: 18px; color: var(--wood); flex: none; }
.site-footer__social { gap: 16px !important; }
.site-footer__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 24px; }
.site-footer__list a { display: inline-flex; min-height: 32px; align-items: center; color: var(--muted); }
.site-footer__copy {
	max-width: var(--max);
	margin-inline: auto;
	padding: 12px var(--gutter) 28px;
	font-size: 14px;
	color: var(--muted);
}
