/* Scroll-reveal animáció - a JS teszi hozzá az .is-visible osztályt (lásd interactions.js) */
.eagle-reveal {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

.eagle-reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.eagle-reveal-delay-1.is-visible { transition-delay: 0.05s; }
.eagle-reveal-delay-2.is-visible { transition-delay: 0.15s; }
.eagle-reveal-delay-3.is-visible { transition-delay: 0.25s; }
.eagle-reveal-delay-4.is-visible { transition-delay: 0.35s; }

/* Kártya hover-effekt: finom emelkedés + árnyék */
.eagle-card-hover {
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.eagle-card-hover:hover {
	transform: translateY(-6px);
	box-shadow: 0 16px 32px rgba(15, 23, 41, 0.12);
}

/* Gomb hover: finom emelkedés + árnyék a meglévő szín-váltás mellé */
.wp-block-button__link.wp-element-button {
	transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.wp-block-button__link.wp-element-button:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 20px rgba(15, 23, 41, 0.18);
}

/* "Böngésző-ablak" keret a referencia (portfolio) kártyák és az egyedi
   referencia-oldal kiemelt képe köré, hogy élő weboldal-mockupnak tűnjön. */
.eagle-browser-frame {
	overflow: hidden;
	background-color: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--base-2);
}

.eagle-browser-frame__bar {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 10px 14px;
	background-color: var(--wp--preset--color--base-2);
	border-bottom: 1px solid rgba(15, 23, 41, 0.06);
}

.eagle-browser-frame__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: var(--wp--preset--color--contrast-3);
	display: inline-block;
}

.eagle-browser-frame__dot:nth-child(1) { opacity: 0.9; }
.eagle-browser-frame__dot:nth-child(2) { opacity: 0.6; }
.eagle-browser-frame__dot:nth-child(3) { opacity: 0.35; }

.eagle-browser-frame .wp-block-post-featured-image {
	margin: 0;
}

/* A böngésző-keretben lévő screenshot finoman bezoomol hover-re, hogy "élő"
   érzetet keltsen - a keret overflow:hidden-je vágja a túlnyúló részt. A kép
   maga sose legyen lekerekítve (a keret külső sarkai már lekerekítettek). */
.eagle-browser-frame .wp-block-post-featured-image img {
	border-radius: 0;
	transition: transform 0.5s ease;
	transform: scale(1);
}

.eagle-browser-frame:hover .wp-block-post-featured-image img {
	transform: scale(1.06);
}

/* Nav-linkek: nincs aláhúzás, csak lágy szín-váltás hover/fókusz esetén. */
.wp-block-navigation .wp-block-navigation-item__content {
	transition: color 0.2s ease;
	text-decoration: none;
}

.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation-item__content:focus-visible {
	color: var(--wp--preset--color--accent);
	text-decoration: none;
}

/* Dekoratív, halvány pontrács-sarok valós fotó/illusztráció hiányában -
   ugyanaz a technika, mint a hero sas-vízjelnél: könnyű, CSS-alapú, a
   tartalom mögé rétegzett, aria-hidden dísz. */
.eagle-decor-dots {
	position: absolute;
	width: 220px;
	height: 220px;
	pointer-events: none;
	z-index: 0;
	background-image: radial-gradient(currentColor 1.5px, transparent 1.5px);
	background-size: 22px 22px;
	-webkit-mask-image: radial-gradient(circle at center, #000 0%, transparent 72%);
	mask-image: radial-gradient(circle at center, #000 0%, transparent 72%);
}

.eagle-decor-dots--top-right {
	top: 0;
	right: 0;
	color: var(--wp--preset--color--contrast-3);
	opacity: 0.6;
}

.eagle-decor-dots--bottom-left {
	bottom: 0;
	left: 0;
	color: var(--wp--preset--color--base);
	opacity: 0.18;
}

@media (max-width: 600px) {
	.eagle-decor-dots {
		width: 140px;
		height: 140px;
	}
}

/* Egyedi referencia-oldal accent-színű hero sávja: a globális link-szín (accent
   kék) felülírása fehérre, mert a sáv háttere maga is accent kék - enélkül a
   szolgáltatás-típus címke linkje láthatatlan lenne a háttéren. */
.eagle-portfolio-hero a {
	color: var(--wp--preset--color--base);
}

/* Lebegő "vissza a tetejére" gomb - JS adja hozzá az .is-visible osztályt,
   miután a felhasználó egy bizonyos mennyiséget lescrollozott (lásd
   interactions.js). Accent kék háttér, fehér nyíl-ikon, a jobb alsó sarokban. */
.eagle-scroll-top {
	position: fixed;
	right: var(--wp--preset--spacing--20);
	bottom: var(--wp--preset--spacing--20);
	z-index: 100;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
	display: flex;
	align-items: center;
	justify-content: center;
	border: none;
	box-shadow: 0 8px 20px rgba(15, 23, 41, 0.22);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(12px);
	transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s, background-color 0.2s ease;
}

.eagle-scroll-top.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.eagle-scroll-top:hover,
.eagle-scroll-top:focus-visible {
	background-color: var(--wp--preset--color--accent-2);
}

.eagle-scroll-top svg {
	width: 20px;
	height: 20px;
}

@media (max-width: 600px) {
	.eagle-scroll-top {
		width: 42px;
		height: 42px;
		right: var(--wp--preset--spacing--10);
		bottom: var(--wp--preset--spacing--10);
	}
}

/* Accessibility: mozgás-csökkentést preferáló felhasználóknál minden animáció kikapcsolva */
@media (prefers-reduced-motion: reduce) {
	.eagle-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.eagle-card-hover:hover,
	.wp-block-button__link.wp-element-button:hover {
		transform: none;
	}

	.eagle-browser-frame .wp-block-post-featured-image img {
		transition: none;
	}

	.eagle-browser-frame:hover .wp-block-post-featured-image img {
		transform: none;
	}

	.wp-block-navigation .wp-block-navigation-item__content {
		transition: none;
	}

	.eagle-scroll-top {
		transition: opacity 0.15s ease, visibility 0.15s;
		transform: none;
	}

	.eagle-scroll-top.is-visible {
		transform: none;
	}

	.eagle-featured-frame:hover {
		transform: rotate(-4deg);
	}

	.eagle-cta-arrow {
		transition: none;
	}

	.eagle-card-cta .wp-block-button__link:hover .eagle-cta-arrow {
		transform: none;
	}
}

/* "Kiemelt projekt" szekció (Kezdőlap) - enyhén elforgatott, lebegő
   "eszköz-keret" a legszínesebb referenciáról, hogy a szekció fotó nélkül is
   kiugorjon a szöveg-nehéz szekciók (Miért minket, Szolgáltatások) közül. */
.eagle-featured-frame {
	transform: rotate(-4deg);
	box-shadow: 0 24px 48px rgba(15, 23, 41, 0.18);
	transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.eagle-featured-frame:hover {
	transform: rotate(-1.5deg) translateY(-4px);
	box-shadow: 0 30px 56px rgba(15, 23, 41, 0.22);
}

/* Kézzel rajzolt ívelt nyíl a "Kiemelt referencia" jelvény mellett - csak
   nagyobb (tablet+) nézetben, hogy mobilon ne zsúfolja a rövid szöveget. */
.eagle-featured-arrow {
	display: none;
	flex-shrink: 0;
}

@media (min-width: 782px) {
	.eagle-featured-arrow {
		display: block;
	}
}

/* A teljes-szélességű szekciók (hero, "Miért minket", stb.) saját maguk
   kezelik a függőleges térközt paddinggel - a WordPress alap 1.2rem
   block-gapje (theme.json styles.spacing.blockGap) enélkül egy felesleges,
   üres/fehér csíkot hagy két szekció határán, mert a szekció HÁTTERE csak a
   margin ALATT kezdődik. Ugyanez a gap van a főtartalom és a lábléc között is. */
.wp-block-post-content > .wp-block-group.alignfull {
	margin-top: 0;
}

.wp-site-blocks > footer {
	margin-top: 0;
}

/* Kártyák egyenlő magassága: a .wp-block-columns flexbox alapból egyenlő
   magasságúra nyújtja az oszlopokat, de a bennük lévő kártya (csoport) csak a
   saját tartalma magasságát veszi fel - emiatt eltérő szövegoszthosszal a
   kártyák háttere/keretezése különböző méretűnek látszott. Flex oszloppá
   tesszük a kártyát is, hogy a "Részletek" gomb (ha van) mindig alul üljön. */
.wp-block-column > .wp-block-group.eagle-card-hover {
	height: 100%;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
}

.eagle-card-hover > .wp-block-buttons {
	margin-top: auto;
	padding-top: var(--wp--preset--spacing--20);
}

/* "Részletek" kártya-gomb: sima szöveges link helyett halvány, kör-alakú
   (outline) gomb, a nyíl hoverre finoman jobbra csúszik. */
.eagle-card-cta .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
}

.eagle-card-cta .eagle-cta-arrow {
	display: inline-block;
	transition: transform 0.25s ease;
}

.eagle-card-cta .wp-block-button__link:hover .eagle-cta-arrow {
	transform: translateX(4px);
}

/* MINDEN gomb hoverre a kék (accent) <-> fehér (base) párt váltja - soha nem
   lehet a háttér és a szöveg azonos színű. !important-tal biztosítva, hogy
   semmilyen egyéb (pl. theme.json globális vagy Gutenberg core
   outline-stílus) szabály ne írja felül. */
.wp-element-button.has-accent-background-color,
.wp-element-button.has-base-background-color,
.eagle-card-cta .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link.has-base-color {
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

/* Alapból kék hátterű (fehér szöveges) gombok -> hoverre fehér háttér, kék
   szöveg. Ide tartozik a fehér szövegű outline gomb is (sötét/színes
   háttéren pihen, tehát vizuálisan "kékre vált" lenne túl bonyolult - itt is
   egyszerűen a fehér-kék párra váltunk). */
.wp-element-button.has-accent-background-color:hover,
.wp-element-button.has-accent-background-color:focus-visible,
.wp-block-button.is-style-outline .wp-block-button__link.has-base-color:hover,
.wp-block-button.is-style-outline .wp-block-button__link.has-base-color:focus-visible {
	background-color: var(--wp--preset--color--base) !important;
	color: var(--wp--preset--color--accent) !important;
	border-color: var(--wp--preset--color--accent) !important;
}

/* A kék szövegű outline "Részletek" kártya-gomb (világos kártya-háttéren
   ül) -> hoverre kék háttér, fehér szöveg. */
.eagle-card-cta .wp-block-button__link:hover,
.eagle-card-cta .wp-block-button__link:focus-visible {
	background-color: var(--wp--preset--color--accent) !important;
	color: var(--wp--preset--color--base) !important;
	border-color: var(--wp--preset--color--accent) !important;
}

/* Alapból fehér hátterű (sötét szöveges) gomb -> hoverre kék háttér, fehér
   szöveg. Ez a gomb mindig a kék (accent) hátterű CTA-szekcióban ül, ezért
   fehér keretet is kap hoverre, különben a gomb kék kitöltése egybeolvadna a
   szekció saját kék hátterével. A keret alapból is jelen van (átlátszó
   színnel), hogy hoverre csak a SZÍNE változzon, ne a gomb mérete (különben
   a hirtelen megjelenő 2px keret "megugorná" a gombot). */
.wp-element-button.has-base-background-color {
	border: 2px solid transparent;
	box-sizing: border-box;
}

.wp-element-button.has-base-background-color:hover,
.wp-element-button.has-base-background-color:focus-visible {
	background-color: var(--wp--preset--color--accent) !important;
	color: var(--wp--preset--color--base) !important;
	border-color: var(--wp--preset--color--base) !important;
}

/* Sima szöveges linkek: nincs aláhúzás (lásd theme.json styles.elements.link),
   hoverre a szín lágy átmenettel vált - a gomb-stílusú linkeket (amiknek már
   van saját hover-effektjük) kihagyjuk, hogy ne ütközzön a két animáció. */
a:not(.wp-element-button) {
	transition: color 0.2s ease;
}

a:not(.wp-element-button):hover,
a:not(.wp-element-button):focus-visible {
	cursor: pointer;
}

/* A theme.json több, egyes blokk-típusokra (pl. post-terms, navigation,
   comments) külön beállított, elrejtett "hoverre aláhúzás" szabályt is
   tartalmaz - ez felülírja az általános linkstílust. Mivel sehol nem
   szeretnénk aláhúzást, itt véglegesen, minden linkre kikapcsoljuk. */
a,
a:hover,
a:focus-visible {
	text-decoration: none !important;
}

/* Rögzített (sticky) fejléc - görgetés közben is a lap tetején marad. */
.wp-site-blocks > header {
	position: sticky;
	top: 0;
	z-index: 60;
	box-shadow: 0 1px 0 rgba(15, 23, 41, 0.06);
}

/* Egyedi kurzor (lásd interactions.js): kis pont + nagyobb, késleltetve
   követő kör. Csak pontos mutatós (egér), hover-képes eszközökön kapcsoljuk
   ki a natív kurzort - érintőn/mozgás-csökkentésnél a JS ki sem teszi ezeket
   az elemeket, a natív kurzor marad. */
@media (hover: hover) and (pointer: fine) {
	body.eagle-custom-cursor,
	body.eagle-custom-cursor a,
	body.eagle-custom-cursor button,
	body.eagle-custom-cursor .wp-element-button {
		cursor: none;
	}
}

/* mix-blend-mode:difference - a kurzor színe mindig "kiszámítja" a
   kontrasztot az alatta lévő háttérhez képest, így SOSEM tud eltűnni/
   egybeolvadni, függetlenül attól, hogy épp milyen színű szekció felett áll
   (pl. a kék CTA-szekció felett is látszik, nem csak fehér/sötét háttéren). */
.eagle-cursor-dot,
.eagle-cursor-ring {
	position: fixed;
	top: 0;
	left: 0;
	border-radius: 50%;
	pointer-events: none;
	z-index: 9999;
	will-change: transform;
	mix-blend-mode: difference;
}

.eagle-cursor-dot {
	width: 6px;
	height: 6px;
	background-color: var(--wp--preset--color--base);
	transition: opacity 0.2s ease;
}

.eagle-cursor-ring {
	width: 32px;
	height: 32px;
	border: 1.5px solid var(--wp--preset--color--base);
	background-color: transparent;
	transition: width 0.2s ease, height 0.2s ease, opacity 0.2s ease, background-color 0.2s ease;
	opacity: 0.6;
}

.eagle-cursor-ring.is-hovering {
	width: 52px;
	height: 52px;
	opacity: 0.9;
	background-color: rgba(255, 255, 255, 0.15);
}

.eagle-cursor-dot.is-hidden,
.eagle-cursor-ring.is-hidden {
	opacity: 0;
}

/* GYIK akkordion - sáv-szerű fejléc +/- ikonnal (tamalsen.dev "Professional
   Experience" listájának mintájára, saját színekkel). Natív <details> marad
   a bázis, csak a megjelenés lesz "kártyás". */
.eagle-faq-item {
	border-radius: 12px;
	overflow: hidden;
	background-color: var(--wp--preset--color--contrast);
}

.eagle-faq-summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--20);
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	color: var(--wp--preset--color--base);
	font-weight: 600;
	cursor: pointer;
	list-style: none;
	transition: background-color 0.25s ease;
}

.eagle-faq-summary::-webkit-details-marker {
	display: none;
}

/* A böngésző alap fókusz-kerete a <summary>-n kilógott a lekerekített kártya
   sarkán túl (ez okozta a "fehér csík" hatást lenyitáskor) - lecseréljük egy
   befelé néző, a kártyán belül maradó fókusz-jelzésre. */
.eagle-faq-summary:focus {
	outline: none;
}

.eagle-faq-summary:focus-visible {
	box-shadow: inset 0 0 0 2px var(--wp--preset--color--base);
}

.eagle-faq-item[open] .eagle-faq-summary {
	background-color: var(--wp--preset--color--accent);
}

.eagle-faq-icon {
	position: relative;
	width: 18px;
	height: 18px;
	flex-shrink: 0;
}

.eagle-faq-icon::before,
.eagle-faq-icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	background-color: currentColor;
	transform: translate(-50%, -50%);
}

.eagle-faq-icon::before {
	width: 14px;
	height: 2px;
}

.eagle-faq-icon::after {
	width: 2px;
	height: 14px;
	transition: transform 0.25s ease;
}

.eagle-faq-item[open] .eagle-faq-icon::after {
	transform: translate(-50%, -50%) scaleY(0);
}

.eagle-faq-body {
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30) var(--wp--preset--spacing--30);
}

.eagle-faq-body p {
	margin: 0;
	width: 100%;
}

@media (prefers-reduced-motion: reduce) {
	.eagle-faq-summary,
	.eagle-faq-icon::after {
		transition: none;
	}
}

/* Kapcsolat oldal - jelvény, ikonos elérhetőség-sorok és kártyázott,
   stílusos kapcsolati űrlap (Contact Form 7 mezők felülstílozva). */
.eagle-contact-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	background-color: var(--wp--preset--color--base-2);
	color: var(--wp--preset--color--accent);
	border: 1px solid var(--wp--preset--color--accent);
	font-weight: 600;
	font-size: 0.85rem;
	padding: 0.35rem 0.9rem;
	border-radius: 999px;
}

.eagle-contact-row {
	display: flex;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--20);
}

.eagle-contact-row-icon {
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background-color: var(--wp--preset--color--accent);
	display: flex;
	align-items: center;
	justify-content: center;
}

.eagle-contact-row-label {
	margin: 0 0 0.15rem;
	color: var(--wp--preset--color--contrast-2);
	font-size: 0.9rem;
}

.eagle-contact-row-value {
	display: inline-block;
	margin: 0;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}

.eagle-contact-form-card {
	box-shadow: 0 20px 40px rgba(15, 23, 41, 0.06);
}

.eagle-contact-form-card .wpcf7-form p {
	margin-bottom: 0.6rem;
}

.eagle-contact-form-card .wpcf7-form label {
	display: block;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}

/* A mező-címkék (label) vizuálisan rejtettek a Kapcsolat űrlapon - a
   placeholder elég a látó felhasználóknak, de a címke a DOM-ban/
   képernyőolvasóknak megmarad (accessibility). Szabvány "visually hidden"
   technika, nem display:none, ami eltüntetné a képernyőolvasóból is. */
.eagle-sr-only {
	display: none !important;
}

.eagle-contact-form-card .wpcf7-form-control {
	box-sizing: border-box;
	display: block;
	width: 100%;
	margin-top: 0;
	padding: 0.75rem 1rem;
	border: 1px solid var(--wp--preset--color--contrast-3);
	border-radius: 8px;
	background-color: var(--wp--preset--color--base);
	font-family: inherit;
	font-size: 1rem;
	color: var(--wp--preset--color--contrast);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.eagle-contact-form-card textarea.wpcf7-form-control {
	min-height: 140px;
	resize: vertical;
}

/* Mező-ikonok: minden mezőnek saját, a mező jelentéséhez illő ikonja van
   (nem "sablon" CF7 mezőnek hat), a mező nevéhez (name attribútum) kötve. */
.eagle-contact-form-card input.wpcf7-form-control,
.eagle-contact-form-card textarea.wpcf7-form-control {
	padding-left: 2.75rem;
	background-repeat: no-repeat;
	background-position: 0.9rem center;
	background-size: 20px 20px;
}

.eagle-contact-form-card textarea.wpcf7-form-control {
	background-position: 0.9rem 1.1rem;
}

.eagle-contact-form-card input[name="your-name"] {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232f6feb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4.4 3.6-6 8-6s8 1.6 8 6'/%3E%3C/svg%3E");
}

.eagle-contact-form-card input[name="your-email"] {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232f6feb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m4 6 8 7 8-7'/%3E%3C/svg%3E");
}

.eagle-contact-form-card input[name="your-subject"] {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232f6feb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.6 12.6 12 21.2 3.4 12.6a3 3 0 0 1 0-4.2l5-5a3 3 0 0 1 4.2 0l8 8a3 3 0 0 1 0 4.2Z'/%3E%3Ccircle cx='10.5' cy='9.5' r='1'/%3E%3C/svg%3E");
}

.eagle-contact-form-card textarea[name="your-message"] {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232f6feb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.4 8.4 0 0 1-8.9 8.4 9 9 0 0 1-3.3-.6L3 21l1.7-4.9A8.4 8.4 0 1 1 21 11.5Z'/%3E%3C/svg%3E");
}

.eagle-contact-form-card .wpcf7-form-control:focus {
	outline: none;
	border-color: var(--wp--preset--color--accent);
	box-shadow: 0 0 0 3px rgba(47, 111, 235, 0.15);
}

.eagle-contact-form-card .wpcf7-submit {
	width: auto;
	margin-top: var(--wp--preset--spacing--10);
	padding: 0.75rem 2.75rem 0.75rem 1.75rem;
	border: 2px solid var(--wp--preset--color--accent);
	border-radius: 8px;
	background-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
	font-weight: 600;
	font-size: 1rem;
	cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='22' y1='2' x2='11' y2='13'/%3E%3Cpolygon points='22 2 15 22 11 13 2 9 22 2'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	background-size: 16px 16px;
	transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.eagle-contact-form-card .wpcf7-submit:hover {
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--accent);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232f6feb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='22' y1='2' x2='11' y2='13'/%3E%3Cpolygon points='22 2 15 22 11 13 2 9 22 2'/%3E%3C/svg%3E");
	box-shadow: 0 10px 20px rgba(15, 23, 41, 0.15);
	transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
	.eagle-contact-form-card .wpcf7-submit:hover {
		transform: none;
	}
}

/* Lábléc: minden szöveg egységesen világos szürke, a linkek hoverre/fókuszra
   fehérré válnak (a meglévő has-base-color/has-accent-color stb. osztályokat
   is felülírva, ezért az !important). */
footer,
footer * {
	color: var(--wp--preset--color--base-2) !important;
	transition: color 0.2s ease;
}

footer a:hover,
footer a:focus-visible {
	color: var(--wp--preset--color--base) !important;
}