#fadeout {
	background: rgba(0, 0, 0, 0.2);
	backdrop-filter: blur(4px);
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	z-index: 998;
	transition: all 0.3s ease-in-out;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity = 0);
	cursor: pointer;
}

.ws-zig-zag > div {
	display: grid;
	grid-template-columns: 1fr 1fr;
	width: 100%;
	align-items: center;
}
.ws-zig-zag > div:nth-child(even) .zig,
.ws-zig-zag > div:nth-child(even) > div:first-child {
	order:1
}
@media (max-width: 768px) {
.ws-zig-zag > div{grid-template-columns: repeat(1, 1fr);}
.ws-zig-zag > div:nth-child(even) .zig{order: initial;}
}


.wckd-toggle{text-decoration: underline}
.wckd-toggle-content {height: 0;overflow: hidden;}
.open-toggle .wckd-toggle-content {height: auto !important;}

.wckd-toggle.peekaboo {position: absolute;bottom:var(--size-l);z-index: 100;left: 0;right: 0;margin: 0 auto;}
.wckd-toggle.peekaboo:hover{text-decoration: underline}
.wckd-toggle.peekaboo+.wckd-toggle-content{height:0px;overflow:hidden}
.fade-to-white::before{content:'';background: linear-gradient(to top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));height:100%;position:absolute;z-index:1;width:100%;left:0}
.fade-to-white.open-toggle::before{display:none !important}

.wckd-accordion{grid-template-columns: initial;}
.accordion-toggle {
	display: flex;
	align-items: center;
	gap: var(--size-s);
	width: 100%;
	text-align: left;
	padding: var(--size-m) var(--size-s);
	background: none;
	color: var(--font-color);
	border: none;
	border-top: 1px solid var(--line-color);
	cursor: pointer;
	justify-content: left;
}

.accordion-toggle::before {
	content: '';
	display: inline-block;
	width: 6px;
	height: 6px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform-origin: center;
	transform: translateY(-1px) rotate(-45deg); 
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	flex-shrink: 0;
	margin-right: 12px;
}
.accordion-toggle.is-open::before {
	transform: translateY(-1px) rotate(45deg); 
}
.accordion-toggle:hover::before {
	border-color: var(--accent-color, currentColor);
}
.accordion-toggle:focus{outline: none}
.accordion-toggle .wckd-icon > svg{stroke:var(--font-color)}
.accordion-toggle:hover{background:none;color: var(--font-color);fill: var(--font-color);column-gap:2px;}
.accordion-content {display: none;margin: 0 var(--size-m) var(--size-m) var(--size-s);padding-left: var(--size-m);left: 6px;border-left: 1px solid var(--line-color);}
.accordion-toolbar{display: grid;position: relative}
.accordion-toggle.is-open + .accordion-content {display: block;}
.accordion-toggle:hover .wckd-icon svg {padding-left: 6px;stroke: var(--font-color)}
.accordion-toggle.is-open .wckd-icon svg {transform: rotate(90deg);stroke: var(--font-color)}
.accordion-filter + .open-all{position: absolute;top:0;right:0;}
.accordion-toggle.is-open .wckd-icon svg{padding-left:0}
.accordion-toggle.is-open:hover{column-gap: 8px}

.wckd-slides{grid-template-columns: repeat(1, minmax(200px, 1fr));}
.wckd-slides > .column {position: sticky;top: 100px;min-height: 300px;transition: transform 0.5s ease, opacity 0.5s ease;overflow: hidden;will-change: transform, opacity;}
.wckd-slides > .column .blur-slide,
.wckd-slides > .column .fade-slide {transition: filter 0.3s ease, opacity 0.3s ease;will-change: filter, opacity;}

.overlay-navigation {z-index: 999999}
.wckd-overlay-content {
  display: none;
  z-index: 99999;
  position: fixed;
  height: auto;
  max-height: 85%;
  width: 90%;
  background: var(--background-color-light);
  color: var(--font-color);
  transform: translateY(-50%);
  margin: 20px auto;
  top: 50%;
  right: 0;
  left: 0;
  text-wrap: initial;
  box-shadow: 10px 0px 20px 0 rgb(0 0 0 / 10%);
  border-radius: var(--feather);
  transition: all 0.5s ease-in-out;
  overflow-y: auto;
}
.wckd-overlay-nav{z-index: 99999;right: 0;opacity: 1;transition: all 0.5s ease-in-out;}
.wckd-overlay-nav {position: fixed;top: 50%;display: block;}
.wckd-overlay-nav.visible {opacity: 1;right:0px;}
button.next-overlay,
button.prev-overlay{width: 44px;height: 44px;line-height: 44px;padding: 0;text-align: center;color: var(--font-color);background-color: var(--background-color);border-radius: 0;-webkit-border-top-left-radius: 6px;-webkit-border-bottom-left-radius: 6px;-moz-border-radius-topleft: 6px;-moz-border-radius-bottomleft: 6px;border-top-left-radius: 6px;border-bottom-left-radius: 6px;display: block;margin: 0 0 1px 0;}
button.close-overlay{position:fixed;top:6px;right:12px;width:36px;height: 34px;font-size: 34px;padding:0;text-align:center;}
button.close-overlay svg{stroke:var(--font-color);}
button.next-overlay:hover,
button.prev-overlay:hover,
button.close-overlay:hover{background:var(--background-color)}
button.next-overlay:after{font-family:"Material Icons";content:"\e5c8";width:32px}
button.prev-overlay:before{font-family:"Material Icons";content:"\e5c4";width:32px}

.wckd-overlay-content .pad{overflow-y:auto;max-height:99vh}
.wckd-overlay-content.open-overlay{display:block}
.wckd-overlay-content.flyout{transform:none;margin:0;right:-80%;top:0;bottom:0;left:auto;max-height: 100%;width:80%;max-width:900px;display:block;transition:all 0.5s ease-in-out;overflow-y:auto}
.wckd-overlay-content.flyout.open-overlay{right:0}
.wckd-overlay-content.flyout-top{top:-100%;bottom:auto;left:0;width:100%;display:block;transition:all 0.5s ease-in-out;overflow-y:auto}
.wckd-overlay-content.flyout-top.open-overlay {top:0}

.wckd-overlay-content.horizontal-scroll{text-align: left;transform:none;margin:0;right:-100%;top:0;bottom:0;left:auto;max-height: 100%;width:100%;display:flex;transition:all 0.5s ease-in-out;overflow-x:auto;}
.wckd-overlay-content.horizontal-scroll.open-overlay{right:0}
.wckd-overlay-content.horizontal-scroll > .item {flex: 0 0 100%;box-sizing: border-box;scroll-snap-align: start;}

.wckd-gallery{overflow:hidden}
.wckd-gallery.round-thumbs:hover a{margin-right:0px}
.wckd-gallery.round-thumbs a {max-width: 36px;overflow: hidden;display: block;float: left;margin: 12px -8px 12px 0;transition: 0.2s;padding: 0;border-radius: var(--border-radius);border: 3px solid var(--background-color-x);}
.wckd-gallery.round-thumbs a:hover{border:none;max-width:36px}

.wckd-bento.columns {box-sizing: border-box;overflow: hidden;}
.wckd-bento > .column {position: absolute;visibility: hidden;}
.wckd-bento.ready > .column {visibility: visible;}
.wckd-bento .column img {display: block;width: 100%;height: auto;}

.progression{	align-self: end;background:#f1f1f1;display:block;width:100%;height:12px;}
.progression span{display:inline-block;height:12px;position:absolute;left:0}
.progression span.in-progress{background:#edfcf9;left:0}
.progression span.is_ready{background-color:#edfcf9}
.progression span.is_done{background-color:var(--theme-1)}
.progression span.total_progress{background-color:var(--green)}
.progression .percent {height: 12px;font-size: 10px;line-height: 12px;font-weight: bold;left:1px;margin: 0;padding: 0;color: #ffffff;}

.columns.wckd-showcase {display: flex;flex-wrap: wrap;box-sizing: border-box;}
.wckd-showcase > .column {display: flex;flex: 1 0 auto;box-sizing: border-box;transition: width 0.3s ease;border-left: 1px solid var(--line-color);overflow: hidden;height: 100%;background-size: cover;background-position: center center;background-repeat: no-repeat}
.wckd-showcase > .column.expanded {flex-basis: 40%;}

.wckd-carousel {display: flex !important;--gap-value: 0px;--peek: 0px;--column-width: calc((100% - (var(--count, 1) - 1) * var(--gap-value) - var(--peek)) / var(--count, 1));overflow-x: auto;overflow-y: hidden;scroll-snap-type: x mandatory;scroll-snap-stop: always;scroll-behavior: smooth;-webkit-overflow-scrolling: touch;align-items: stretch;overscroll-behavior-x: contain;gap: var(--gap-value);scrollbar-width: none;}
.wckd-carousel::-webkit-scrollbar { display: none; }
.wckd-carousel > .column {flex: 0 0 var(--column-width);scroll-snap-align: start;min-height: 2px;height: auto;}
.wckd-carousel.gap-xs  { --gap-value: var(--size-xs); }
.wckd-carousel.gap-s   { --gap-value: var(--size-s); }
.wckd-carousel.gap     { --gap-value: var(--size-m); }
.wckd-carousel.gap-l   { --gap-value: var(--size-l); }
.wckd-carousel.gap-xl  { --gap-value: var(--size-xl); }
.wckd-carousel.gap-xxl { --gap-value: var(--size-xxl); }
.wckd-carousel.peek-right { --peek: var(--size-xxl); padding-right: var(--peek); scroll-padding-right: var(--peek); }
.wckd-carousel.peek-left  { --peek: var(--size-xxl); padding-left:  var(--peek); scroll-padding-left:  var(--peek); }
/*
.wckd-carousel.peek-right > .column:last-of-type  { margin-right: calc(-1 * var(--peek)); }
.wckd-carousel.peek-left  > .column:first-of-type { margin-left:  calc(-1 * var(--peek)); }
*/
.wckd-carousel-nav {display: grid;grid-template-columns: auto 1fr auto;align-items: center;position: absolute;inset: 0;pointer-events: none;z-index: 2;}
.wckd-carousel-nav .prev-btn,
.wckd-carousel-nav .next-btn {pointer-events: auto;cursor: pointer;border: none;border-radius: 90px;}
.wckd-carousel-nav .prev-btn { grid-column: 1; justify-self: start; margin-left:  var(--size-s); }
.wckd-carousel-nav .next-btn { grid-column: 3; justify-self: end;   margin-right: var(--size-s); }
.wckd-carousel-nav .prev-btn:disabled,
.wckd-carousel-nav .next-btn:disabled { pointer-events: none; opacity: 0.2; }
.wckd-carousel-dots {display: flex;justify-content: center;align-items: center;gap: 6px;padding: var(--size-s) 0;}
.carousel-dot {width: 8px;height: 8px;padding: 0;border: none;border-radius: 4px;background-color: var(--line-color, rgba(255, 255, 255, 0.25));cursor: pointer;flex-shrink: 0;transition:width  0.4s cubic-bezier(0.4, 0, 0.2, 1),height 0.4s cubic-bezier(0.4, 0, 0.2, 1),background-color 0.4s ease;}
.carousel-dot.active {width: 24px; background-color: var(--font-color, #fff); }
.carousel-dot:hover:not(.active) { background-color: var(--font-color, #fff); opacity: 0.4; }
.carousel-dot:focus-visible{ outline: 2px solid var(--brand-primary-color, currentColor); outline-offset: 2px; }
.wckd-carousel.vertical {flex-direction: column;overflow-x: hidden;overflow-y: auto;scroll-snap-type: y mandatory;overscroll-behavior-y: contain;}
/* height-* utilities use min-height which doesn't constrain overflow — override */
.wckd-carousel.vertical.height-25  { height: 25vh;  min-height: 0; }
.wckd-carousel.vertical.height-50  { height: 50vh;  min-height: 0; }
.wckd-carousel.vertical.height-65  { height: 65vh;  min-height: 0; }
.wckd-carousel.vertical.height-75  { height: 75vh;  min-height: 0; }
.wckd-carousel.vertical.height-100 { height: calc(100vh - var(--header-height, 0px)); min-height: 0; }
.wckd-carousel.vertical > .column {flex: 0 0 calc(100% / var(--count, 1));width: 100%;height: calc(100% / var(--count, 1));min-height: 0;scroll-snap-align: start;}
.wckd-carousel.vertical .wckd-carousel-dots { flex-direction: column; padding: 0 var(--size-s); }
.wckd-carousel.vertical .carousel-dot.active { width: 8px; height: 24px; }
@media (max-width: 767px) {
  .wckd-carousel.count-4,
  .wckd-carousel.count-5,
  .wckd-carousel.count-6 { --count: 1.5; }
}
@media (prefers-reduced-motion: reduce) {
  .wckd-carousel { scroll-behavior: auto; }
}

.checklist {list-style-type: none;counter-reset: checklist-counter;}
.checklist li {position: relative;padding-left: 30px;margin-bottom: 10px;}
.checklist li::before {content: "";position: absolute;left: 0;top: 1px;width: 20px;height: 20px;border: 1px solid #ccc;background-color: #fff;}
.checklist li::after {content: "";position: absolute;left: 6px;top: 7px;width: 8px;height: 4px;border-width: 0 2px 2px 0;border-style: solid;border-color: #555;transform: rotate(45deg);opacity: 0;}
.checklist li.checked::before {background-color: #a7d48f;border-color: #a7d48f;}
.checklist li.checked::after {opacity: 1;}
.checklist li.checked span {text-decoration: line-through;color: #999;}


#toc ol{margin:0;padding:0}
#toc li{margin:0;padding:0;list-style: none}
#toc li > ol{margin:0 0 0 8px;padding:0 0 0 4px;}
#toc  a{display:block;padding:4px;border-bottom:1px dashed  var(--line-color)}
#toc  a.active{background: var(--button-active-color)}
#toc li li a{border-left: 1px solid var(--line-color)}
#toc li li a.active{background:none; color:var(--red);border-color:var(--red)}

.wckd-menu input[type="radio"] {display: none;}
.wckd-menu span:before {content: "";position: absolute;}
.wckd-menu input[type="radio"]:checked + span,.nav input[type="radio"]:checked + span:before {color:var(--font-color);border-bottom: 1px solid var(--line-color);}
.wckd-menu label span{padding:6px 12px;font-size:85%;white-space: nowrap;display: block}

#breadcrumbs {display: flex;overflow: hidden;padding: 0;margin: 0;align-items: center}
#breadcrumbs li{list-style:none;margin:0;padding:0}
#breadcrumbs a{white-space:nowrap;color: var(--font-color);text-align:center;}
#breadcrumbs a:hover{text-decoration:underline}
#breadcrumbs li+li:before{padding:var(--size-s);content:"\00bb"}
#breadcrumbs .wckd-icon{width:1em;height:1em}

#pagination{display: flex;overflow: hidden;padding: 0;margin: 0;font-size:var(--font-small);align-items: center;}
#pagination li{list-style:none;margin:2px;padding:0;}
#pagination a{display: block;color: var(--font-color);text-align:center; border: 1px solid transparent;padding: 6px 12px;border-radius: var(--border-radius)}

#pagination a:hover,
#pagination .active a{background-color: var(--background-color-low);color:var(--meta-color);border: 1px solid var(--line-color);}
#pagination .wckd-icon{padding: 6px;}

/*
.tooltip {
position: relative;display: inline-block;cursor: pointer;}
.tooltip:hover::before, 
.tooltip:focus::before {content: attr(data-tooltip-content);position: absolute;background-color: #333;color: #fff;font-size: 80%;line-height: 1.4;padding: 8px;border-radius: 5px;z-index: 1;bottom: 125%;width: 300px;opacity: 0;transition: opacity 0.3s ease;}
.tooltip:hover::before, .tooltip:focus::before {opacity: 1;}
*/
.wckd-tooltip{cursor:pointer}
.tooltip-content {visibility: hidden;position: absolute;bottom: 125%;transform: translateX(-50%);background-color: var(--background-color-high);color: var(--font-color);border-radius: var(--border-radius);padding: var(--pad-condensed);box-shadow:var(--shadow);font-size:1em;transition: opacity 0.5s;opacity: 0;z-index: 99;text-transform: none;max-width: 576px;}
.wckd-tooltip:hover + .tooltip-content {visibility: visible;opacity: 1;}
/* ----------------------
   Tabs container
---------------------- */
.wckd-tabs {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: var(--size-m);
}

/* Columns */
.wckd-tabs > .column {
	padding: 0;
	width: 100%;
}

/* Toggle button */
.wckd-tabs > .column > .tabs-toggle {
	display: none; /* desktop hidden */
}

/* Tabs content */
.wckd-tabs > .column > .tabs-content {
	display: none;
	position: relative;
}

/* Active tab */
.wckd-tabs > .column.active > .tabs-content {
	display: block;      /* show active content */
}

/* Optional padded content */
.wckd-tabs.padded .tabs-content {
	padding: var(--size-m);
}



/* Active toggle styling */
.tabs-toolbar .tabs-toggle.active,
.wckd-tabs .column.active > .tabs-toggle {
	background-color: var(--background-color-light);
}

/* Toolbar horizontal list */
.tabs-toolbar > ol {
	position: relative;
	margin: 0;
	padding: 0;
	display: grid;
	grid-gap: 2px;
	grid-auto-flow: column;
	grid-auto-columns: max-content;
	overflow-x: auto;
}

/* Toolbar list items */
.tabs-toolbar ol > li {
	margin: 0;
	padding: 0;
	list-style: none;
	max-width: 100%;
}

/* Vertical toolbar */
.wckd-tabs.vertical{gap: 0}
.tabs-toolbar.vertical > ol {
	grid-auto-flow: initial;
	gap: var(--size-m);
}

.tabs-toolbar.vertical .tabs-toggle {
	width: 100%;
	justify-content: center;
}

/* Scrollbar styling (WebKit only) */
.tabs-toolbar > ol::-webkit-scrollbar { height: 4px; }
.tabs-toolbar > ol::-webkit-scrollbar-track { background-color: var(--line-color); }
.tabs-toolbar > ol::-webkit-scrollbar-thumb { background-color: var(--line-color); }
.tabs-toolbar > ol::-webkit-scrollbar-thumb:hover { background-color: var(--line-color); }

/* ----------------------
   Mobile / Accordion
---------------------- */
@media (max-width: 767px) {
	.tabs-toolbar.accordion { display: none; }
	.wckd-tabs.accordion > .column > .tabs-toggle {
		display: block;
		width: 100%;
	}
}


.steps{display:inline-block;overflow:hidden;counter-reset:flag}
.steps a{position: relative;text-decoration:none;display:block;float:left;font-size:14px;font-weight:var(--strong);line-height:36px;padding:0 10px 0 60px;overflow:initial}
.steps a:first-child{padding-left:46px;border-radius:5px 0 0 5px}
.steps a:first-child:before{left:14px}
.steps a:last-child{border-radius:0 5px 5px 0;padding-right:20px}
.steps a:after{content:"";position:absolute;top:0;right:-18px;width:36px;height:36px;transform:scale(0.707) rotate(45deg);z-index:1;box-shadow:1px -1px 0 1px var(--line-color),2px -1px 0 1px rgba(255, 255, 255, 0.1);border-radius:0 5px 0 50px}
.steps a:last-child:after{content:none}
.steps a:before{content:counter(flag);color:var(--font-color);counter-increment:flag;border-radius:100%;text-align:center;font-size:80%;width:20px;height:20px;line-height:20px;margin:8px 0;position:absolute;background:var(--background-color);top:0;left:30px;font-weight:var(--strong);border:1px solid var(--line-color)}
.steps a,
.steps a:after{background:var(--background-color);color:var(--meta-color)}
.steps a:hover,
.steps a.active,
.steps a:hover:after,
.steps a.active:after{background:var(--font-color);color:var(--font-color-x)}

.wckd-checkers{grid-template-columns:repeat(1, 1fr)}
.wckd-checkers .column{display:grid;grid-template-columns:repeat(2, 1fr);align-items:center;grid-template-areas:"group image""group image"}
.wckd-checkers .column:nth-child(even) .column-image{grid-area:image;justify-self:end}
.wckd-checkers .column:nth-child(even) .group{grid-area:group}
.wckd-checkers .column .group{padding:60px 15%}
