/* Hide mobile-only on desktop */
.mobile-only {
	display: none;
}

/* Hide desktop-only on mobile */
@media only screen and (max-width: 768px) {
	.desktop-only {
		display: none !important;
	}
	
	.mobile-only {
		display: block !important;
	}
}

/* Optional: hide desktop-only on very large screens */
@media only screen and (min-width: 769px) {
	.desktop-only {
		display: block !important;
	}
}

/* Hide internal headings from visitors */
.editor-only {
	display: none !important;
}

/* But show them inside the block editor */
.block-editor-page .editor-only,
.editor-styles-wrapper .editor-only {
	display: block !important;
	opacity: .6;
	border-left: 3px solid #999;
	padding-left: 6px;
}

/* Make links transformable and smooth */
header nav a,
#site-navigation .menu a,
#primary-menu a,
.main-navigation .menu a,
.navbar-nav .nav-link {
	display: inline-block;
/* inline elements can't transform */
	transition: transform 200ms ease, color 200ms ease;
	text-decoration: none;
}

/* Hover animation */
header nav a:hover,
#site-navigation .menu a:hover,
#primary-menu a:hover,
.main-navigation .menu a:hover,
.navbar-nav .nav-link:hover {
	transform: translateY(-1px) scale(1.06);
}

/* Remove lasting outline only for mouse users, keep keyboard focus accessible */
header nav a:focus-visible,
#site-navigation .menu a:focus-visible,
#primary-menu a:focus-visible,
.main-navigation .menu a:focus-visible,
.navbar-nav .nav-link:focus-visible {
	outline: none;
	box-shadow: none;
}

/* If theme adds a hard hover style (e.g., border/box-shadow), neutralize it */
header nav a:hover,
#site-navigation .menu a:hover,
#primary-menu a:hover,
.main-navigation .menu a:hover,
.navbar-nav .nav-link:hover {
	box-shadow: none !important;
	border: none !important;
}

/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
	header nav a,
										  #site-navigation .menu a,
										  #primary-menu a,
										  .main-navigation .menu a,
										  .navbar-nav .nav-link {
		transition: none;
	}
}

/* Base: make links transformable and smooth */
#site-navigation a,
#primary-menu a,
.main-navigation .menu a {
	display: inline-block;
	transition: transform 200ms ease, color 200ms ease;
/* mobile Safari */
}

/* Make nav links transformable for hover */
#site-navigation .menu a,
#primary-menu a,
.main-navigation .menu a {
	display: inline-block;
	transition: transform 200ms ease, color 200ms ease;
	text-decoration: none;
}

/* Hover-only effect */
#site-navigation .menu a:hover,
#primary-menu a:hover,
.main-navigation .menu a:hover {
	transform: translateY(-1px) scale(1.06);
}

/* Remove any animation, transform, outline, border on click/focus */
#site-navigation .menu a:active,
#site-navigation .menu a:focus,
#primary-menu a:active,
#primary-menu a:focus,
.main-navigation .menu a:active,
.main-navigation .menu a:focus,
#site-navigation .menu li:active,
#site-navigation .menu li:focus,
#site-navigation .menu li:focus-within,
#primary-menu li:active,
#primary-menu li:focus,
#primary-menu li:focus-within,
.main-navigation .menu li:active,
.main-navigation .menu li:focus,
.main-navigation .menu li:focus-within {
	animation: none !important;
	transform: none !important;
	transition: none !important;
	outline: none !important;
	box-shadow: none !important;
	border: none !important;
	outline-offset: 0 !important;
}

/* Neutralize theme pseudo-element borders/animations on focus/active */
#site-navigation .menu a:focus::before,
#site-navigation .menu a:focus::after,
#site-navigation .menu a:active::before,
#site-navigation .menu a:active::after,
#primary-menu a:focus::before,
#primary-menu a:focus::after,
#primary-menu a:active::before,
#primary-menu a:active::after,
.main-navigation .menu a:focus::before,
.main-navigation .menu a:focus::after,
.main-navigation .menu a:active::before,
.main-navigation .menu a:active::after {
	content: none !important;
	animation: none !important;
	transform: none !important;
	box-shadow: none !important;
	border: none !important;
}

/* Optional: keep keyboard focus visible but remove mouse-only focus */
#site-navigation .menu a:focus:not(:focus-visible),
#primary-menu a:focus:not(:focus-visible),
.main-navigation .menu a:focus:not(:focus-visible),
#site-navigation .menu li:focus:not(:focus-visible),
#primary-menu li:focus:not(:focus-visible),
.main-navigation .menu li:focus:not(:focus-visible) {
	outline: none !important;
	box-shadow: none !important;
	border: none !important;
}

/* Mobile Safari tap highlight */
#site-navigation .menu a,
#primary-menu a,
.main-navigation .menu a {
}

/* Base nav links: disable all default animations/transitions */
#site-navigation .menu a,
#primary-menu a,
.main-navigation .menu a,
.navbar-nav .nav-link {
	display: inline-block;
	transition: none !important;
/* no smooth effects */
	transform: none !important;
/* no scaling/moving */
	animation: none !important;
/* no keyframes */
	outline: none !important;
/* no rectangle */
	box-shadow: none !important;
/* no glow */
	border: none !important;
	text-decoration: none;
}

/* Hover bounce: the ONLY animation allowed */
#site-navigation .menu a:hover,
#primary-menu a:hover,
.main-navigation .menu a:hover,
.navbar-nav .nav-link:hover {
	animation: hoverBounce .3s ease !important;
}

@keyframes hoverBounce {
	0% {
		transform: scale(1);
	}
	
	50% {
		transform: scale(1.1);
	}
	
	100% {
		transform: scale(1);
	}
}

/* Kill active/focus animations completely */
#site-navigation .menu a:active,
#site-navigation .menu a:focus,
#primary-menu a:active,
#primary-menu a:focus,
.main-navigation .menu a:active,
.main-navigation .menu a:focus,
.navbar-nav .nav-link:active,
.navbar-nav .nav-link:focus {
	animation: none !important;
	transform: none !important;
	transition: none !important;
	outline: none !important;
	box-shadow: none !important;
	border: none;
/* Scope to header only */
	animation: none !important;
	border: none !important;
	box-shadow: none !important;
	outline-offset: 0 !important;
}

/* Keep ONLY your hover animation */
header a:hover,
header .menu a:hover,
header #site-navigation a:hover,
header #primary-menu a:hover,
header .main-navigation .menu a:hover,
header .navbar-nav .nav-link:hover {
	animation: hoverBounce .3s ease !important;
}

/* Kill any border/outline/glow after clicking or focusing */
header a:active,
header a:focus,
header .menu a:active,
header .menu a:focus,
header #site-navigation a:active,
header #site-navigation a:focus,
header #primary-menu a:active,
header #primary-menu a:focus,
header .main-navigation .menu a:active,
header .main-navigation .menu a:focus,
header .navbar-nav .nav-link:active,
header .navbar-nav .nav-link:focus {
	outline: none !important;
	box-shadow: none !important;
	border: none !important;
	animation: none !important;
	transition: none !important;
	transform: none !important;
/* prevents shape/position changes on click */
}

/* If the theme uses pseudo-elements to draw borders on focus/active */
header a::before,
header a::after,
header .menu a::before,
header .menu a::after,
header #site-navigation a::before,
header #site-navigation a::after,
header #primary-menu a::before,
header #primary-menu a::after,
header .main-navigation .menu a::before,
header .main-navigation .menu a::after,
header .navbar-nav .nav-link::before,
header .navbar-nav .nav-link::after {
	content: none !important;
	border: none !important;
	box-shadow: none !important;
	animation: none !important;
	transform: none !important;
}

/* Remove focus style only for mouse clicks, keep keyboard focus usable */
header a:focus:not(:focus-visible),
header .menu a:focus:not(:focus-visible),
header #site-navigation a:focus:not(:focus-visible),
header #primary-menu a:focus:not(:focus-visible),
header .main-navigation .menu a:focus:not(:focus-visible),
header .navbar-nav .nav-link:focus:not(:focus-visible) {
	outline: none !important;
	box-shadow: none !important;
	border: none !important;
}

/* Mobile Safari tap highlight */
header a,
header .menu a,
header #site-navigation a,
header #primary-menu a {
}

/* Optional: if the border is applied to  or parent containers */
header li:focus,
header li:focus-within {
	outline: none !important;
	border: none !important;
	box-shadow: none !important;
	animation: none !important;
	transition: none !important;
}

figure.site-thumbnail { display: none !important; }
/* Hide the site logo image on the homepage */ .home img.wp-image-63 { display: none !important; }

img.wp-image-63 {
  display: none !important;
}

/* Hide the educto logo everywhere EXCEPT inside the header */
body img[src*="educto-logo.webp"]:not(header img[src*="educto-logo.webp"]) {
    display: none !important;
}

/* Hide the educto logo everywhere inside the page content, but keep it in the header */
main img[src*="educto-logo.webp"] {
    display: none !important;
}

/* Keep the logo in the header, hide it everywhere else */
body img[src*="educto-logo"] {
    display: none !important;
}

header img[src*="educto-logo"] {
    display: inline-block !important;
}

/* Desktop header visible, mobile header hidden */
.header-desktop {
  display: block;
}

.header-mobile {
  display: none;
}

/* MOBILE BREAKPOINT */
@media (max-width: 768px) {
  .header-desktop {
    display: none;
  }

  .header-mobile {
    display: block;
  }
}
/* Desktop visible, mobile hidden */
.header-desktop {
  display: block;
}

.header-mobile {
  display: none;
}

/* Mobile breakpoint */
@media (max-width: 768px) {
  .header-desktop {
    display: none;
  }

  .header-mobile {
    display: block;
  }
}

/* Default: show desktop, hide mobile */
.header-desktop {
  display: block !important;
}

.header-mobile {
  display: none !important;
}

/* Mobile breakpoint */
@media (max-width: 768px) {
  .header-desktop {
    display: none !important;
  }

  .header-mobile {
    display: block !important;
  }
}

/* Dropdown inside your contact form only */
.educto-form select,
.educto-form select option {
  font-size: 16px !important;
}

@media (max-width: 768px) {
    /* Target the exact group containing your icons */
    .wp-block-group[style*="margin-top:-94px"] {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 12px !important;
        flex-wrap: nowrap !important;
    }

    /* Make sure each icon stays small and aligned */
    .wp-block-group[style*="margin-top:-94px"] img {
        width: 36px !important;
        height: auto !important;
    }

    /* Remove vertical stacking from figures */
    .wp-block-group[style*="margin-top:-94px"] figure {
        margin: 0 !important;
    }
}

@media (max-width: 768px) {
    /* Target your exact icon group */
    .wp-block-group[style*="margin-top:-94px"] img {
        width: 80px !important;   /* increase this number to make them bigger */
        height: auto !important;
        max-width: none !important;
    }

    /* Remove figure constraints */
    .wp-block-group[style*="margin-top:-94px"] figure {
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }
}

@media (max-width: 768px) {
    /* Target your exact icon group */
    .wp-block-group[style*="margin-top:-94px"] {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 12px !important;
        flex-wrap: nowrap !important;
    }

    /* Reduce icon size to one-third of the previous size */
    .wp-block-group[style*="margin-top:-94px"] img {
        width: 26px !important;  /* one-third of 80px */
        height: auto !important;
        max-width: none !important;
    }

    .wp-block-group[style*="margin-top:-94px"] figure {
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }
}

/* Click animation for all links on the site */
a:active {
    transform: scale(0.92);
    transition: transform 0.12s ease-out;
}

/* Smooth hover animation for all links */
a:hover {
    transform: scale(1.04);
    transition: transform 0.15s ease-out;
}

/* Make sure images/icons inside links animate too */
a img,
a svg {
    transition: transform 0.15s ease-out;
}

a:active img,
a:active svg {
    transform: scale(0.92);
}
@media (max-width: 768px) {

@media (max-width: 768px) {

