/* ==========================================================================
   Spyropoulos – Header & Fullscreen menu
   Σημ.: ο Flatsome βγάζει inline CSS μετά από εμάς. Τα !important είναι
   στοχευμένα μόνο εκεί που πατάνε στοιχεία του Flatsome.
   ========================================================================== */

/* ---------- Header ---------- */
#header .header-main { background: var(--sp-white) !important; }

#header .header-logo,
#header .header_logo { height: auto !important; max-height: 52px; width: auto; }
.header-wrapper.stuck { box-shadow: 0 1px 0 rgba(0,0,0,.06) !important; }

/* ---------- Burger (μαύρο pill από το XD) ---------- */
.sp-nav-icon { margin: 0 !important; }

.sp-burger {
	--w: 46px; --h: 26px;
	all: unset;
	box-sizing: border-box;
	position: relative;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: var(--w) !important;
	height: var(--h) !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border-radius: var(--sp-pill) !important;
	background: var(--sp-black) !important;
	color: var(--sp-white);
	cursor: pointer;
	transition: transform .35s cubic-bezier(.2,.8,.2,1), background-color .3s;
}
.sp-burger:hover { transform: scale(1.06); }
.sp-burger:focus-visible { outline: 2px solid var(--sp-blue); outline-offset: 3px; }

/* 3 γραμμές: before / span / after */
.sp-burger__lines,
.sp-burger__lines::before,
.sp-burger__lines::after {
	display: block;
	width: 20px;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
	transition: transform .45s cubic-bezier(.77,0,.18,1), opacity .25s, width .3s;
}
.sp-burger__lines { position: relative; height: 1.5px; }
.sp-burger__lines::before,
.sp-burger__lines::after { content: ""; position: absolute; left: 0; height: 1.5px; }
.sp-burger__lines::before { top: -5px; }
.sp-burger__lines::after  { top: 5px; width: 13px; }
.sp-burger:hover .sp-burger__lines::after { width: 20px; }

/* Ανοιχτό → Χ, λευκό pill με μαύρες γραμμές */
.sp-burger.is-active { background: var(--sp-white) !important; color: var(--sp-black); }
.sp-burger.is-active .sp-burger__lines { background: transparent; }
.sp-burger.is-active .sp-burger__lines::before { transform: translateY(5px) rotate(45deg); }
.sp-burger.is-active .sp-burger__lines::after  { transform: translateY(-5px) rotate(-45deg); width: 20px; }

/* ---------- Overlay ---------- */
.sp-menu {
	--ease: cubic-bezier(.77,0,.18,1);
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	flex-direction: column;
	overflow: hidden auto;
	background: var(--sp-black);
	color: var(--sp-white);
	clip-path: inset(0 0 100% 0);
	transition: clip-path .7s var(--ease);
}
.sp-menu[hidden] { display: none; }
.sp-menu-open .sp-menu { clip-path: inset(0 0 0 0); }
.sp-menu-open,
.sp-menu-open body { overflow: hidden; }
.admin-bar .sp-menu { top: var(--wp-admin--admin-bar--height, 32px); }

/* Τεράστια outline chevrons (από το logo) */
.sp-menu__mark {
	position: absolute;
	right: -8vw;
	bottom: -12vh;
	width: min(70vw, 900px);
	height: auto;
	fill: none;
	stroke: var(--sp-blue);
	stroke-width: .35;
	stroke-linejoin: round;
	opacity: 0;
	transform: translateX(6%);
	transition: opacity 1.2s ease .35s, transform 1.6s cubic-bezier(.2,.8,.2,1) .25s;
	pointer-events: none;
}
.sp-menu-open .sp-menu__mark { opacity: .45; transform: none; }

/* Top bar */
.sp-menu__bar {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	max-width: var(--sp-container);
	min-height: 96px;
	margin-inline: auto;
	padding-inline: 15px; /* = .container του Flatsome, ώστε το Χ να πέφτει πάνω στο burger */
}
.sp-menu__logo { display: block; line-height: 0; color: var(--sp-white); }
.sp-menu__logo svg { width: 150px; height: auto; }
.sp-menu__logo svg [fill="#0066b2"] { fill: var(--sp-white); } /* κείμενο λευκό, chevrons μένουν gradient */
.sp-menu__logo svg path:not([fill]) { fill: rgba(255,255,255,.7); } /* "& ASSOCIATES" (χωρίς fill στο SVG) */
.sp-menu__logo,
.sp-menu .sp-burger { opacity: 0; transition: opacity .4s ease .45s; }
.sp-menu-open .sp-menu__logo,
.sp-menu-open .sp-menu .sp-burger { opacity: 1; }

/* Περιεχόμενο */
.sp-menu__inner {
	position: relative;
	flex: 1;
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(2rem, 6vw, 8rem);
	width: 100%;
	max-width: var(--sp-container);
	margin-inline: auto;
	padding: clamp(1.5rem, 4vh, 4rem) 15px clamp(2rem, 8vh, 6rem);
}

/* Λίστα */
.sp-menu__list { margin: 0 !important; padding: 0; list-style: none; counter-reset: none; }
.sp-menu__item { margin: 0 !important; overflow: hidden; }

.sp-menu__link {
	display: inline-flex !important;
	align-items: baseline;
	gap: clamp(.75rem, 1.5vw, 1.5rem);
	padding: .15em 0;
	color: var(--sp-white) !important;
	text-decoration: none !important;
	transform: translateY(105%);
	transition: transform .8s var(--ease), opacity .35s;
	transition-delay: calc(.25s + var(--i, 0) * .06s), 0s;
}
.sp-menu-open .sp-menu__link { transform: none; }

.sp-menu__num {
	min-width: 2ch;
	font-family: var(--sp-font-body);
	font-size: var(--sp-fs-small);
	font-weight: 400;
	letter-spacing: .12em;
	color: var(--sp-gray);
	transition: color .3s;
}
.sp-menu__label {
	position: relative;
	font-family: var(--sp-font-head);
	font-size: clamp(2.25rem, 1rem + 4.2vw, 4.75rem);
	line-height: 1.1;
	transition: transform .5s cubic-bezier(.2,.8,.2,1);
}
/* λεπτή μπλε γραμμή που «γράφεται» στο hover */
.sp-menu__label::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: .05em;
	height: 1px;
	background: var(--sp-blue);
	transform: scaleX(0);
	transform-origin: right;
	transition: transform .6s cubic-bezier(.2,.8,.2,1);
}

/* Hover: τα υπόλοιπα σβήνουν, το ενεργό γλιστράει */
@media (hover: hover) {
	.sp-menu__list:hover .sp-menu__link { opacity: .3; }
	.sp-menu__list .sp-menu__link:hover { opacity: 1; }
}
.sp-menu__link:hover .sp-menu__label,
.sp-menu__link:focus-visible .sp-menu__label { transform: translateX(.25em); }
.sp-menu__link:hover .sp-menu__label::after,
.sp-menu__link:focus-visible .sp-menu__label::after,
.sp-menu__item.is-current .sp-menu__label::after { transform: scaleX(1); transform-origin: left; }
.sp-menu__link:hover .sp-menu__num,
.sp-menu__item.is-current .sp-menu__num { color: var(--sp-blue); }
.sp-menu__link:focus-visible { outline: none; }

/* Δεξιά στήλη */
.sp-menu__aside {
	align-self: end;
	padding-left: clamp(1.5rem, 3vw, 3rem);
	border-left: 1px solid rgba(255,255,255,.18);
	opacity: 0;
	transform: translateY(12px);
	transition: opacity .6s ease .6s, transform .8s cubic-bezier(.2,.8,.2,1) .6s;
}
.sp-menu-open .sp-menu__aside { opacity: 1; transform: none; }

.sp-menu__eyebrow {
	margin: 0 0 1rem !important;
	font-size: var(--sp-fs-small);
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--sp-gray);
}
.sp-menu__contact {
	display: grid;
	gap: .9rem;
	font-style: normal;
	font-weight: 300;
	line-height: 1.5;
}
.sp-menu__contact a { color: var(--sp-white) !important; text-decoration: none; transition: color .25s; }
.sp-menu__contact a:hover { color: var(--sp-blue) !important; }
.sp-menu__empty a { color: var(--sp-white); text-decoration: underline; }

/* Κλείσιμο: η κουρτίνα ανεβαίνει, τα links φεύγουν γρήγορα */
.sp-menu-closing .sp-menu { clip-path: inset(0 0 100% 0); transition-delay: .1s; }
.sp-menu-closing .sp-menu__link { transition-duration: .35s; transition-delay: 0s; }

/* ---------- Mobile ---------- */
@media (max-width: 849px) {
	.sp-menu__bar { min-height: 72px; }
	.sp-menu__logo svg { width: 120px; }
	.sp-menu__inner { grid-template-columns: 1fr; align-items: start; gap: 2.5rem; }
	.sp-menu__aside { align-self: start; padding: 1.5rem 0 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.18); }
	.sp-menu__mark { width: 130vw; right: -45vw; bottom: -6vh; }
}

/* ---------- Μειωμένη κίνηση ---------- */
@media (prefers-reduced-motion: reduce) {
	.sp-menu, .sp-menu * { transition-duration: .01ms !important; transition-delay: 0s !important; }
	.sp-menu__link { transform: none; }
}