:root {
	--creatorsofcode-menu-nav-bg: #ffffff;
	--creatorsofcode-menu-nav-text: #1f2937;
	--creatorsofcode-menu-accent: #0f766e;
	--creatorsofcode-menu-submenu-bg: #ffffff;
	--creatorsofcode-menu-submenu-text: #111827;
	--creatorsofcode-menu-toggle-bg: #e5f3f1;
	--creatorsofcode-menu-radius: 14px;
	--creatorsofcode-menu-breakpoint: 640px;
}

.creatorsofcode-menu-mount-source {
	display: none !important;
}

.creatorsofcode-menu-auto-slot[hidden] {
	display: none !important;
}

.creatorsofcode-menu-enabled .main-navigation {
	color: var(--creatorsofcode-menu-nav-text);
}

.creatorsofcode-menu-enabled .main-navigation .mobile-menu-toggle-button {
	display: none !important;
}

.creatorsofcode-menu-menu-toggle {
	display: none;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	border: 0;
	border-radius: calc(var(--creatorsofcode-menu-radius) + 2px);
	background: var(--creatorsofcode-menu-toggle-bg);
	color: var(--creatorsofcode-menu-nav-text);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}

.creatorsofcode-menu-menu-toggle-lines,
.creatorsofcode-menu-menu-toggle-lines::before,
.creatorsofcode-menu-menu-toggle-lines::after {
	display: block;
	width: 18px;
	height: 2px;
	border-radius: 999px;
	background: currentColor;
	transition: transform 0.2s ease, opacity 0.2s ease;
	content: '';
}

.creatorsofcode-menu-menu-toggle-lines {
	position: relative;
	content: none;
}

.creatorsofcode-menu-menu-toggle-lines::before {
	position: absolute;
	top: -6px;
	left: 0;
}

.creatorsofcode-menu-menu-toggle-lines::after {
	position: absolute;
	top: 6px;
	left: 0;
}

.creatorsofcode-menu-enabled .main-navigation.creatorsofcode-menu-menu-open .creatorsofcode-menu-menu-toggle-lines {
	background: transparent;
}

.creatorsofcode-menu-enabled .main-navigation.creatorsofcode-menu-menu-open .creatorsofcode-menu-menu-toggle-lines::before {
	transform: translateY(6px) rotate(45deg);
}

.creatorsofcode-menu-enabled .main-navigation.creatorsofcode-menu-menu-open .creatorsofcode-menu-menu-toggle-lines::after {
	transform: translateY(-6px) rotate(-45deg);
}

.creatorsofcode-menu-enabled .main-navigation .menu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.creatorsofcode-menu-enabled .main-navigation .menu > .menu-item {
	margin-left: 0;
}

.creatorsofcode-menu-enabled .main-navigation .menu > .menu-item > a,
.creatorsofcode-menu-enabled .main-navigation .menu .sub-menu a {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 12px 16px;
	border-radius: var(--creatorsofcode-menu-radius);
	color: var(--creatorsofcode-menu-nav-text);
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.creatorsofcode-menu-enabled .main-navigation .menu > .current-menu-item > a,
.creatorsofcode-menu-enabled .main-navigation .menu > .current-menu-ancestor > a,
.creatorsofcode-menu-enabled .main-navigation .menu > .menu-item:hover > a,
.creatorsofcode-menu-enabled .main-navigation .menu > .menu-item.focus > a {
	color: var(--creatorsofcode-menu-accent);
}

.creatorsofcode-menu-enabled .main-navigation .menu .sub-menu {
	min-width: 240px;
	padding: 10px;
	border-radius: calc(var(--creatorsofcode-menu-radius) + 2px);
	background: var(--creatorsofcode-menu-submenu-bg);
	box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14);
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease;
}

.creatorsofcode-menu-enabled .main-navigation .menu .sub-menu a {
	width: 100%;
	color: var(--creatorsofcode-menu-submenu-text);
	box-sizing: border-box;
}

.creatorsofcode-menu-enabled .main-navigation .menu .menu-item:hover > .sub-menu,
.creatorsofcode-menu-enabled .main-navigation .menu .menu-item.focus > .sub-menu,
.creatorsofcode-menu-enabled .main-navigation .menu .menu-item.creatorsofcode-menu-submenu-open > .sub-menu {
	visibility: visible;
	opacity: 1;
	pointer-events: auto;
	left: auto;
}

.creatorsofcode-menu-enabled .main-navigation .menu .menu-item.creatorsofcode-menu-has-image > a,
.creatorsofcode-menu-enabled .main-navigation .menu .sub-menu .menu-item.creatorsofcode-menu-has-image > a {
	align-items: flex-start;
}

.creatorsofcode-menu-item-media {
	flex: 0 0 auto;
	line-height: 0;
}

.creatorsofcode-menu-enabled .main-navigation .menu .sub-menu .creatorsofcode-menu-item-media {
	order: 2;
	margin-left: auto;
}

.creatorsofcode-menu-item-image {
	display: block;
	width: 40px;
	height: 40px;
	border-radius: calc(var(--creatorsofcode-menu-radius) - 2px);
	object-fit: cover;
}

.creatorsofcode-menu-item-label {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	line-height: 1.35;
}

.creatorsofcode-menu-enabled .main-navigation .menu .sub-menu .creatorsofcode-menu-item-image {
	width: 28px;
	height: 28px;
	border-radius: 8px;
}

.creatorsofcode-menu-enabled .main-navigation .menu .sub-menu .creatorsofcode-menu-item-label {
	order: 1;
	min-height: 28px;
	flex: 1 1 auto;
	padding-right: 10px;
}

.creatorsofcode-menu-submenu-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: var(--creatorsofcode-menu-toggle-bg);
	color: var(--creatorsofcode-menu-accent);
	cursor: pointer;
	transition: transform 0.2s ease, background-color 0.2s ease;
}

.creatorsofcode-menu-submenu-toggle::before {
	content: '+';
	font-size: 20px;
	line-height: 1;
}

.creatorsofcode-menu-enabled .main-navigation .menu .menu-item.creatorsofcode-menu-submenu-open > .creatorsofcode-menu-submenu-toggle::before {
	content: '\2212';
}

.creatorsofcode-menu-design-clean .main-navigation .menu > .menu-item > a:hover,
.creatorsofcode-menu-design-clean .main-navigation .menu > .menu-item.focus > a,
.creatorsofcode-menu-design-clean .main-navigation .menu > .current-menu-item > a,
.creatorsofcode-menu-design-clean .main-navigation .menu .sub-menu a:hover {
	background: color-mix(in srgb, var(--creatorsofcode-menu-accent) 10%, white);
}

.creatorsofcode-menu-design-boxed .main-navigation .main-navigation-inner {
	padding: 12px;
	border-radius: calc(var(--creatorsofcode-menu-radius) + 6px);
	background: var(--creatorsofcode-menu-nav-bg);
	box-shadow: 0 18px 36px rgba(15, 23, 42, 0.08);
}

.creatorsofcode-menu-design-boxed .main-navigation .menu > .menu-item > a,
.creatorsofcode-menu-design-boxed .main-navigation .menu .sub-menu a:hover {
	background: color-mix(in srgb, var(--creatorsofcode-menu-accent) 12%, white);
}

.creatorsofcode-menu-design-minimal .main-navigation .menu > .menu-item > a,
.creatorsofcode-menu-design-minimal .main-navigation .menu .sub-menu a {
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 0;
}

.creatorsofcode-menu-design-minimal .main-navigation .menu > .menu-item > a {
	position: relative;
}

.creatorsofcode-menu-design-minimal .main-navigation .menu > .menu-item > a::after {
	content: '';
	position: absolute;
	left: 10px;
	right: 10px;
	bottom: 6px;
	height: 2px;
	background: var(--creatorsofcode-menu-accent);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.2s ease;
}

.creatorsofcode-menu-design-minimal .main-navigation .menu > .menu-item:hover > a::after,
.creatorsofcode-menu-design-minimal .main-navigation .menu > .menu-item.focus > a::after,
.creatorsofcode-menu-design-minimal .main-navigation .menu > .current-menu-item > a::after,
.creatorsofcode-menu-design-minimal .main-navigation .menu > .current-menu-ancestor > a::after {
	transform: scaleX(1);
}

.creatorsofcode-menu-design-float .main-navigation .main-navigation-inner {
	padding: 14px 18px;
	border-radius: calc(var(--creatorsofcode-menu-radius) + 10px);
	background: color-mix(in srgb, var(--creatorsofcode-menu-nav-bg) 82%, white);
	backdrop-filter: blur(14px);
	box-shadow: 0 22px 50px rgba(15, 23, 42, 0.12);
}

.creatorsofcode-menu-design-float .main-navigation .menu > .menu-item > a,
.creatorsofcode-menu-design-float .main-navigation .menu .sub-menu a {
	background: rgba(255, 255, 255, 0.62);
	box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.06);
}

.creatorsofcode-menu-design-float .main-navigation .menu > .menu-item:hover > a,
.creatorsofcode-menu-design-float .main-navigation .menu > .current-menu-item > a,
.creatorsofcode-menu-design-float .main-navigation .menu > .current-menu-ancestor > a,
.creatorsofcode-menu-design-float .main-navigation .menu .sub-menu a:hover {
	background: color-mix(in srgb, var(--creatorsofcode-menu-accent) 14%, white);
	transform: translateY(-1px);
}

.creatorsofcode-menu-design-contrast .main-navigation .main-navigation-inner,
.creatorsofcode-menu-design-contrast .main-navigation.mobile-menu {
	background: #111827;
	border-radius: calc(var(--creatorsofcode-menu-radius) + 4px);
}

.creatorsofcode-menu-design-contrast .main-navigation .menu > .menu-item > a,
.creatorsofcode-menu-design-contrast .main-navigation .menu .sub-menu a {
	color: #f9fafb;
}

.creatorsofcode-menu-design-contrast .main-navigation .menu > .menu-item > a:hover,
.creatorsofcode-menu-design-contrast .main-navigation .menu > .menu-item.focus > a,
.creatorsofcode-menu-design-contrast .main-navigation .menu > .current-menu-item > a,
.creatorsofcode-menu-design-contrast .main-navigation .menu > .current-menu-ancestor > a,
.creatorsofcode-menu-design-contrast .main-navigation .menu .sub-menu a:hover {
	background: color-mix(in srgb, var(--creatorsofcode-menu-accent) 30%, #111827);
	color: #ffffff;
}

.creatorsofcode-menu-design-contrast .main-navigation .menu .sub-menu {
	background: #0b1220;
	box-shadow: 0 22px 46px rgba(2, 6, 23, 0.5);
}

.creatorsofcode-menu-design-contrast .creatorsofcode-menu-submenu-toggle {
	background: color-mix(in srgb, var(--creatorsofcode-menu-accent) 20%, #111827);
	color: #ffffff;
}

.creatorsofcode-menu-submenus-disabled .main-navigation .menu .sub-menu {
	display: none !important;
}

.creatorsofcode-menu-images-disabled .creatorsofcode-menu-item-media {
	display: none !important;
}
    

    @media (max-width: 768px) {
      .creatorsofcode-menu-toggle,
      .creatorsofcode-menu-menu-toggle {
        display: inline-flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
      }

      .creatorsofcode-menu-rendered-nav,
      .creatorsofcode-menu-enabled .main-navigation,
      .creatorsofcode-menu-enabled .main-navigation .main-navigation-inner {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
      }

      .creatorsofcode-menu,
      .creatorsofcode-menu-enabled .main-navigation .menu {
        display: none;
        width: 100%;
        margin-top: 12px;
        padding: 8px 0 0;
        border-top: 1px solid rgba(15, 23, 42, 0.08);
        flex-direction: column;
        align-items: stretch;
        gap: 0;
      }

      /* kui burger avatud */
      .creatorsofcode-menu-rendered-nav.creatorsofcode-menu-opened .creatorsofcode-menu,
      .creatorsofcode-menu-enabled .main-navigation.creatorsofcode-menu-menu-open .menu {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
      }

      /* iga menu item eraldi reale */
      .creatorsofcode-menu-rendered-nav .creatorsofcode-menu > li,
      .creatorsofcode-menu-rendered-nav .creatorsofcode-menu > .menu-item,
      .creatorsofcode-menu-enabled .main-navigation .menu > .menu-item {
        display: block !important;
        width: 100% !important;
        float: none !important;
        clear: both !important;
      }

      /* link full width */
      .creatorsofcode-menu-rendered-nav .creatorsofcode-menu > li > a,
      .creatorsofcode-menu-rendered-nav .creatorsofcode-menu > .menu-item > a,
      .creatorsofcode-menu-enabled .main-navigation .menu > .menu-item > a,
      .creatorsofcode-menu-enabled .main-navigation .menu .sub-menu a {
        display: flex !important;
        width: 100% !important;
        padding: 14px 18px !important;
        box-sizing: border-box !important;
        border-radius: 14px;
        justify-content: space-between;
      }

      .creatorsofcode-menu-submenu-toggle {
        display: inline-flex;
        flex: 0 0 auto;
      }

      .creatorsofcode-menu-enabled .main-navigation .menu .sub-menu {
        position: static;
        display: none;
        width: 100%;
        min-width: 0;
        margin-top: 8px;
        padding: 6px 0 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
      }

      .creatorsofcode-menu-enabled .main-navigation .menu .menu-item.creatorsofcode-menu-submenu-open > .sub-menu {
        display: block;
      }

      .creatorsofcode-menu-enabled .main-navigation .menu .menu-item:hover > .sub-menu,
      .creatorsofcode-menu-enabled .main-navigation .menu .menu-item.focus > .sub-menu {
        left: auto;
      }

      .creatorsofcode-hero {
        padding: 32px 0 48px;
      }

      .creatorsofcode-hero-card {
        padding: 28px 20px;
      }
    }