/* Platecraft Addons – Social Icons.

   Each button is painted from CSS variables:
   --psi-bg / --psi-bg-h   background (an image: a gradient, or one color as a flat gradient)
   --psi-bd / --psi-bd-h   border (the same) – a ring (.psi__bd) of width --psi-bw
   --psi-i  / --psi-i-h    icon color; --psi-ig / --psi-is a gradient for font / SVG icons
   --psi-t  / --psi-t-h    text color; --psi-tg its gradient
   The Look (psi-look-*) sets them from the brand color --psi-c (and the
   gradient --psi-k1..3); the Style tab and each icon's own colors set them
   again on the button with a stronger selector. */

.psi {
	--psi-size: 42px;
	--psi-icon: 17px;
	--psi-gap: 10px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: var(--psi-justify, flex-start);
	gap: var(--psi-head-gap, 12px);
}
.psi__heading {
	font-weight: 600;
}
.psi .psi__list {
	display: flex;
	flex: var(--psi-grow, 0) 1 auto;
	flex-flow: row wrap;
	align-items: center;
	justify-content: var(--psi-justify, flex-start);
	justify-items: var(--psi-justify, stretch);
	gap: var(--psi-row-gap, var(--psi-gap)) var(--psi-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}
.psi .psi__item {
	position: relative;
	display: flex;
	flex: var(--psi-grow, 0) 1 auto;
	margin: 0;
	padding: 0;
}

/* The button. */
.psi .psi__btn {
	--psi-cd: color-mix(in srgb, var(--psi-c, #4b5563), #000 16%);
	--psi-cs: color-mix(in srgb, var(--psi-c, #4b5563) 13%, transparent);
	--psi-k1d: var(--psi-k1, color-mix(in srgb, var(--psi-c, #4b5563), #fff 28%));
	--psi-k2d: var(--psi-k2, var(--psi-c, #4b5563));
	--psi-k3d: var(--psi-k3, color-mix(in srgb, var(--psi-c, #4b5563), #000 24%));
	--psi-grad: linear-gradient(var(--psi-ga, 135deg), var(--psi-k1d), var(--psi-k2d), var(--psi-k3d));
	--psi-grad-r: linear-gradient(calc(var(--psi-ga, 135deg) + 180deg), var(--psi-k1d), var(--psi-k2d), var(--psi-k3d));
	position: relative;
	isolation: isolate;
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.55em;
	width: var(--psi-cell-w, var(--psi-btn-w, auto));
	min-width: var(--psi-size);
	min-height: var(--psi-size);
	margin: 0;
	padding: 0;
	border: var(--psi-bw, 0px) solid transparent;
	border-radius: 999px;
	background: var(--psi-bg, none) border-box;
	box-shadow: var(--psi-btn-shadow, var(--psi-look-shadow, none));
	color: var(--psi-i, currentColor);
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	transition-property: color, translate, scale, rotate, box-shadow;
	transition-duration: var(--psi-speed, 0.3s);
	transition-timing-function: ease;
}
.psi--label .psi__btn,
.psi--both .psi__btn {
	padding: 0 1.15em;
}
.psi .psi__btn:hover,
.psi .psi__btn:focus-visible {
	box-shadow: var(--psi-btn-shadow-h, var(--psi-btn-shadow, var(--psi-look-shadow-h, var(--psi-look-shadow, none))));
	color: var(--psi-i-h, var(--psi-i, currentColor));
	text-decoration: none;
}
.psi .psi__btn:focus-visible {
	outline: 2px solid var(--psi-c, currentColor);
	outline-offset: 3px;
}

/* The hover background: a layer over the normal one that fades in. */
.psi .psi__btn::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: calc(var(--psi-bw, 0px) * -1);
	border-radius: inherit;
	background: var(--psi-bg-h, var(--psi-bg, none));
	opacity: 0;
	pointer-events: none;
	transition-property: opacity, clip-path;
	transition-duration: var(--psi-speed, 0.3s), var(--psi-fx-time, var(--psi-speed, 0.3s));
	transition-timing-function: ease;
}
.psi .psi__btn:hover::before,
.psi .psi__btn:focus-visible::before {
	opacity: 1;
}

/* The border: a ring over the background (a mask keeps only the border width),
   so it can be a gradient also around a see-through button; the hover ring fades in. */
.psi .psi__bd {
	position: absolute;
	z-index: -1;
	inset: calc(var(--psi-bw, 0px) * -1);
	padding: var(--psi-bw, 0px);
	border-radius: inherit;
	background: var(--psi-bd, none);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
	pointer-events: none;
}
.psi .psi__bd::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: var(--psi-bd-h, var(--psi-bd, none));
	opacity: 0;
	transition: opacity var(--psi-speed, 0.3s) ease;
}
.psi .psi__btn:hover .psi__bd::after,
.psi .psi__btn:focus-visible .psi__bd::after {
	opacity: 1;
}

/* Icon: a color, or a gradient (font icons through the letters, SVG icons through the gradients beside them). */
.psi .psi__icon {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	font-size: var(--psi-icon);
	line-height: 1;
	rotate: var(--psi-irot, 0deg);
	transition-property: rotate, transform, opacity, translate;
	transition-duration: var(--psi-fx-time, 0.5s);
	transition-timing-function: ease;
}
.psi .psi__icon i {
	background-image: var(--psi-ig, none);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: var(--psi-if, currentColor);
}
.psi .psi__btn:hover .psi__icon i,
.psi .psi__btn:focus-visible .psi__icon i {
	background-image: var(--psi-ig-h, var(--psi-ig, none));
	-webkit-text-fill-color: var(--psi-if-h, var(--psi-if, currentColor));
}
.psi .psi__icon svg {
	width: 1em;
	height: 1em;
	fill: var(--psi-is, currentColor);
}
.psi .psi__btn:hover .psi__icon svg,
.psi .psi__btn:focus-visible .psi__icon svg {
	fill: var(--psi-is-h, var(--psi-is, currentColor));
}
.psi .psi__defs {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
	pointer-events: none;
}
.psi__s1 { stop-color: var(--psi-ig1, currentColor); }
.psi__s2 { stop-color: var(--psi-igm, color-mix(in srgb, var(--psi-ig1, currentColor), var(--psi-ig2, currentColor))); }
.psi__s3 { stop-color: var(--psi-ig2, currentColor); }
.psi__s1h { stop-color: var(--psi-ih1, var(--psi-ig1, currentColor)); }
.psi__s2h { stop-color: var(--psi-ihm, var(--psi-igm, color-mix(in srgb, var(--psi-ih1, var(--psi-ig1, currentColor)), var(--psi-ih2, var(--psi-ig2, currentColor))))); }
.psi__s3h { stop-color: var(--psi-ih2, var(--psi-ig2, currentColor)); }

/* Text. */
.psi .psi__label {
	color: var(--psi-t, currentColor);
	background-image: var(--psi-tg, none);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: var(--psi-tf, currentColor);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.2;
	white-space: nowrap;
	transition: color var(--psi-speed, 0.3s) ease;
}
.psi .psi__btn:hover .psi__label,
.psi .psi__btn:focus-visible .psi__label {
	color: var(--psi-t-h, var(--psi-t, currentColor));
	background-image: var(--psi-tg-h, var(--psi-tg, none));
	-webkit-text-fill-color: var(--psi-tf-h, var(--psi-tf, currentColor));
}

/* Shapes (Border Radius in the Style tab goes over them). */
.psi-shape-rounded .psi__btn { border-radius: calc(var(--psi-size) * 0.26); }
.psi-shape-square .psi__btn { border-radius: 0; }
.psi-shape-leaf .psi__btn { border-radius: calc(var(--psi-size) / 2) 0; }

/* Looks. */
.psi-look-brand .psi__btn {
	--psi-bg: linear-gradient(var(--psi-c), var(--psi-c));
	--psi-bg-h: linear-gradient(var(--psi-cd), var(--psi-cd));
	--psi-i: var(--psi-on, #fff);
}
.psi-look-gradient .psi__btn {
	--psi-bg: var(--psi-grad);
	--psi-bg-h: var(--psi-grad-r);
	--psi-i: var(--psi-on, #fff);
}
.psi-look-soft .psi__btn {
	--psi-bg: linear-gradient(var(--psi-cs), var(--psi-cs));
	--psi-bg-h: linear-gradient(var(--psi-c), var(--psi-c));
	--psi-i: var(--psi-c);
	--psi-i-h: var(--psi-on, #fff);
}
.psi-look-outline .psi__btn {
	--psi-bw: 2px;
	--psi-bd: linear-gradient(var(--psi-c), var(--psi-c));
	--psi-bg-h: linear-gradient(var(--psi-c), var(--psi-c));
	--psi-i: var(--psi-c);
	--psi-i-h: var(--psi-on, #fff);
}
.psi-look-outline-gradient .psi__btn,
.psi-look-icon-gradient .psi__btn {
	--psi-i: var(--psi-c);
	--psi-ig1: var(--psi-k1d);
	--psi-igm: var(--psi-k2d);
	--psi-ig2: var(--psi-k3d);
	--psi-ig: linear-gradient(var(--psi-ia, 135deg), var(--psi-k1d), var(--psi-k2d), var(--psi-k3d));
	--psi-if: transparent;
	--psi-is: var(--psi-gn);
}
.psi-look-outline-gradient .psi__btn {
	--psi-bw: 2px;
	--psi-bd: var(--psi-grad);
	--psi-bg-h: var(--psi-grad);
	--psi-i-h: var(--psi-on, #fff);
	--psi-ig-h: none;
	--psi-if-h: currentColor;
	--psi-is-h: currentColor;
}
.psi-look-icon .psi__btn {
	--psi-i: var(--psi-c);
	--psi-i-h: var(--psi-cd);
}
.psi-look-dark .psi__btn {
	--psi-bg: linear-gradient(#1f2124, #1f2124);
	--psi-bg-h: linear-gradient(var(--psi-c), var(--psi-c));
	--psi-i: #fff;
	--psi-i-h: var(--psi-on, #fff);
}
.psi-look-light .psi__btn {
	--psi-bw: 1px;
	--psi-bd: linear-gradient(#e5e7eb, #e5e7eb);
	--psi-bg: linear-gradient(#fff, #fff);
	--psi-bd-h: linear-gradient(var(--psi-c), var(--psi-c));
	--psi-bg-h: linear-gradient(var(--psi-c), var(--psi-c));
	--psi-i: var(--psi-c);
	--psi-i-h: var(--psi-on, #fff);
	--psi-look-shadow: 0 1px 2px rgba(17, 24, 39, 0.05), 0 4px 14px rgba(17, 24, 39, 0.07);
}
.psi-look-plain .psi__btn {
	--psi-bg: linear-gradient(#f1f2f4, #f1f2f4);
	--psi-bg-h: linear-gradient(#1f2124, #1f2124);
	--psi-i: #1f2124;
	--psi-i-h: #fff;
}

/* Brand colors (--psi-c) and, where the brand has one, its gradient (--psi-k1..3). */
.psi__btn--facebook { --psi-c: #1877f2; }
.psi__btn--instagram { --psi-c: #e1306c; --psi-k1: #f9ce34; --psi-k2: #ee2a7b; --psi-k3: #6228d7; }
.psi__btn--x { --psi-c: #0f1419; }
.psi__btn--linkedin { --psi-c: #0a66c2; }
.psi__btn--youtube { --psi-c: #ff0000; }
.psi__btn--tiktok { --psi-c: #111; --psi-k1: #25f4ee; --psi-k2: #111; --psi-k3: #fe2c55; }
.psi__btn--pinterest { --psi-c: #e60023; }
.psi__btn--whatsapp { --psi-c: #25d366; }
.psi__btn--telegram { --psi-c: #26a5e4; --psi-k1: #37bbfe; --psi-k3: #007dbb; }
.psi__btn--messenger { --psi-c: #0099ff; --psi-k1: #0099ff; --psi-k2: #a033ff; --psi-k3: #ff5280; }
.psi__btn--threads { --psi-c: #101010; }
.psi__btn--snapchat { --psi-c: #fffc00; --psi-on: #111; }
.psi__btn--reddit { --psi-c: #ff4500; }
.psi__btn--discord { --psi-c: #5865f2; }
.psi__btn--twitch { --psi-c: #9146ff; }
.psi__btn--github { --psi-c: #181717; }
.psi__btn--dribbble { --psi-c: #ea4c89; }
.psi__btn--behance { --psi-c: #1769ff; }
.psi__btn--medium { --psi-c: #121212; }
.psi__btn--tumblr { --psi-c: #36465d; }
.psi__btn--vimeo { --psi-c: #1ab7ea; }
.psi__btn--spotify { --psi-c: #1db954; }
.psi__btn--soundcloud { --psi-c: #ff5500; }
.psi__btn--mastodon { --psi-c: #6364ff; }
.psi__btn--skype { --psi-c: #00aff0; }
.psi__btn--viber { --psi-c: #7360f2; }
.psi__btn--tripadvisor { --psi-c: #34e0a1; --psi-on: #000; }
.psi__btn--yelp { --psi-c: #d32323; }
.psi__btn--google { --psi-c: #4285f4; --psi-k1: #4285f4; --psi-k2: #ea4335; --psi-k3: #fbbc05; }
.psi__btn--apple { --psi-c: #111; }
.psi__btn--email { --psi-c: #52606d; }
.psi__btn--phone { --psi-c: #16a34a; }
.psi__btn--location { --psi-c: #ea4335; }
.psi__btn--website { --psi-c: #2563eb; }
.psi__btn--rss { --psi-c: #f26522; }
.psi__btn--custom { --psi-c: #4b5563; }

/* Hover effects. */
.psi-fx-lift .psi__btn:hover,
.psi-fx-lift .psi__btn:focus-visible {
	translate: 0 -4px;
}
.psi-fx-grow .psi__btn:hover,
.psi-fx-grow .psi__btn:focus-visible {
	scale: 1.12;
}
.psi-fx-glow .psi__btn {
	--psi-look-shadow-h: 0 10px var(--psi-glow-size, 24px) -6px var(--psi-glow, color-mix(in srgb, var(--psi-c, #000) 65%, transparent));
}
.psi-fx-glow .psi__btn:hover,
.psi-fx-glow .psi__btn:focus-visible {
	translate: 0 -2px;
}
.psi-fx-spin .psi__btn:hover .psi__icon,
.psi-fx-spin .psi__btn:focus-visible .psi__icon {
	rotate: calc(var(--psi-irot, 0deg) + 360deg);
}
.psi-fx-flip .psi__icon {
	transform: perspective(200px) rotateY(0deg);
}
.psi-fx-flip .psi__btn:hover .psi__icon,
.psi-fx-flip .psi__btn:focus-visible .psi__icon {
	transform: perspective(200px) rotateY(360deg);
}
.psi-fx-roll .psi__btn:hover .psi__icon,
.psi-fx-roll .psi__btn:focus-visible .psi__icon {
	animation: psi-roll var(--psi-fx-time, 0.5s) ease;
}
/* Color fills in: the hover layer is uncovered from one side. */
.psi-fx-fill .psi__btn::before {
	opacity: 1;
	clip-path: inset(100% 0 0 0);
}
.psi-fx-fill.psi-fill-top .psi__btn::before { clip-path: inset(0 0 100% 0); }
.psi-fx-fill.psi-fill-left .psi__btn::before { clip-path: inset(0 100% 0 0); }
.psi-fx-fill.psi-fill-right .psi__btn::before { clip-path: inset(0 0 0 100%); }
.psi-fx-fill.psi-fill-center .psi__btn::before { clip-path: circle(0% at 50% 50%); }
.psi-fx-fill .psi__btn:hover::before,
.psi-fx-fill .psi__btn:focus-visible::before {
	clip-path: inset(0 0 0 0);
}
.psi-fx-fill.psi-fill-center .psi__btn:hover::before,
.psi-fx-fill.psi-fill-center .psi__btn:focus-visible::before {
	clip-path: circle(75% at 50% 50%);
}
/* Shine: a streak of light runs across. */
.psi-fx-shine .psi__btn::after {
	content: "";
	position: absolute;
	z-index: 1;
	inset: calc(var(--psi-bw, 0px) * -1);
	border-radius: inherit;
	background: linear-gradient(115deg, transparent 38%, var(--psi-shine, rgba(255, 255, 255, 0.55)) 50%, transparent 62%) no-repeat;
	background-position: 130% 0;
	background-size: 250% 100%;
	pointer-events: none;
}
.psi-fx-shine .psi__btn:hover::after,
.psi-fx-shine .psi__btn:focus-visible::after {
	background-position: -30% 0;
	transition: background-position var(--psi-fx-time, 0.7s) ease;
}
/* Pulsing ring. */
.psi-fx-ring .psi__btn::after {
	content: "";
	position: absolute;
	inset: calc(var(--psi-bw, 0px) * -1);
	border: var(--psi-ring-w, 2px) solid var(--psi-ring, var(--psi-c, currentColor));
	border-radius: inherit;
	opacity: 0;
	pointer-events: none;
}
.psi-fx-ring .psi__btn:hover::after,
.psi-fx-ring .psi__btn:focus-visible::after {
	animation: psi-ring var(--psi-fx-time, 1.1s) ease-out infinite;
}

@keyframes psi-roll {
	0% { translate: 0 0; opacity: 1; }
	45% { translate: 0 -130%; opacity: 0; }
	46% { translate: 0 130%; opacity: 0; }
	100% { translate: 0 0; opacity: 1; }
}
@keyframes psi-ring {
	from { opacity: 0.75; scale: 1; }
	to { opacity: 0; scale: 1.45; }
}

/* Tooltip. */
.psi .psi__tip {
	--psi-tip-bg: #1f2124;
	position: absolute;
	z-index: 5;
	bottom: calc(100% + var(--psi-tip-gap, 10px));
	left: 50%;
	padding: 5px 10px;
	border-radius: 6px;
	background: var(--psi-tip-bg);
	color: #fff;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.3;
	white-space: nowrap;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	translate: -50% 4px;
	transition: opacity 0.2s ease, translate 0.2s ease, visibility 0.2s;
}
.psi .psi__tip::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	border: 5px solid transparent;
	border-top-color: var(--psi-tip-bg);
}
.psi .psi__item:hover .psi__tip,
.psi .psi__btn:focus-visible + .psi__tip {
	opacity: 1;
	visibility: visible;
	translate: -50% 0;
}
.psi-tip-bottom .psi .psi__tip {
	top: calc(100% + var(--psi-tip-gap, 10px));
	bottom: auto;
	translate: -50% -4px;
}
.psi-tip-bottom .psi .psi__tip::after {
	top: auto;
	bottom: 100%;
	border-top-color: transparent;
	border-bottom-color: var(--psi-tip-bg);
}
.psi-tip-left .psi .psi__tip,
.psi-tip-right .psi .psi__tip {
	top: 50%;
	bottom: auto;
	left: auto;
	right: calc(100% + var(--psi-tip-gap, 10px));
	translate: 4px -50%;
}
.psi-tip-right .psi .psi__tip {
	right: auto;
	left: calc(100% + var(--psi-tip-gap, 10px));
	translate: -4px -50%;
}
.psi-tip-left .psi .psi__tip::after,
.psi-tip-right .psi .psi__tip::after {
	top: 50%;
	left: 100%;
	margin: -5px 0 0;
	border-top-color: transparent;
	border-left-color: var(--psi-tip-bg);
}
.psi-tip-right .psi .psi__tip::after {
	left: auto;
	right: 100%;
	border-left-color: transparent;
	border-right-color: var(--psi-tip-bg);
}
.psi-tip-bottom .psi .psi__item:hover .psi__tip,
.psi-tip-bottom .psi .psi__btn:focus-visible + .psi__tip {
	translate: -50% 0;
}
.psi-tip-left .psi .psi__item:hover .psi__tip,
.psi-tip-left .psi .psi__btn:focus-visible + .psi__tip,
.psi-tip-right .psi .psi__item:hover .psi__tip,
.psi-tip-right .psi .psi__btn:focus-visible + .psi__tip {
	translate: 0 -50%;
}

/* Icons coming in one by one. */
.psi--reveal .psi__item {
	opacity: 0;
	transition: opacity 0.5s ease, translate 0.5s ease, scale 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
	transition-delay: calc(var(--psi-n, 0) * 0.08s);
}
.psi--reveal-rise .psi__item { translate: 0 16px; }
.psi--reveal-pop .psi__item { scale: 0.4; }
.psi--reveal.is-shown .psi__item,
.elementor-editor-active .psi--reveal .psi__item {
	opacity: 1;
	translate: none;
	scale: none;
}

@media (prefers-reduced-motion: reduce) {
	.psi .psi__btn,
	.psi .psi__icon,
	.psi .psi__btn::before,
	.psi--reveal .psi__item {
		transition: none;
	}
	.psi--reveal .psi__item {
		opacity: 1;
		translate: none;
		scale: none;
	}
	.psi-fx-roll .psi__btn:hover .psi__icon,
	.psi-fx-ring .psi__btn:hover::after {
		animation: none;
	}
}