/* YQG Digital Widgets - styles */
/* Protex (All Protex Fire & Safety) Widgets */
:root {
	--yqgw-green: #2c682c;
	--yqgw-green-dark: #1e4d1e;
	--yqgw-gold: #e0a81c;
	--yqgw-red: #c0282d;
	--yqgw-cream: #f4f7da;
	--yqgw-border: #cde0a0;
	--yqgw-text: #333333;
}

/**/
/* Shared base */
.yqgw-services-wrap, .yqgw-brands-wrap { width: 100%; }
.yqgw-services-heading, .yqgw-brands-heading { color: var(--yqgw-green); line-height: 1.3; }

.yqgw-layout-grid { display: grid; }
.yqgw-service-card, .yqgw-brand-tile {
	background: #fff;
	border: 1px solid var(--yqgw-border);
	position: relative;
	text-decoration: none;
	transition-property: transform, box-shadow, border-color, background-color;
	transition-timing-function: ease;
	transition-duration: .3s;
	will-change: transform;
}
.yqgw-equal-height.yqgw-layout-grid .yqgw-service-card,
.yqgw-equal-height.yqgw-layout-grid .yqgw-brand-tile { height: 100%; }

/**/
/* Services card structure */
.yqgw-service-card { display: flex; overflow: hidden; }
.yqgw-service-body { display: flex; flex-direction: column; flex: 1; }
.yqgw-service-media { overflow: hidden; position: relative; }
.yqgw-service-media img { width: 100%; height: 180px; object-fit: cover; display: block; transition: inherit; }

.yqgw-media-top .yqgw-service-card    { flex-direction: column; }
.yqgw-media-bottom .yqgw-service-card  { flex-direction: column-reverse; }
.yqgw-media-left .yqgw-service-card    { flex-direction: row; align-items: center; }
.yqgw-media-right .yqgw-service-card   { flex-direction: row-reverse; align-items: center; }
.yqgw-media-left .yqgw-service-media img,
.yqgw-media-right .yqgw-service-media img { height: 100%; min-height: 120px; }
.yqgw-media-left .yqgw-service-media,
.yqgw-media-right .yqgw-service-media { align-self: stretch; }

/* Background media layout */
.yqgw-media-background .yqgw-service-media { position: absolute; inset: 0; margin: 0 !important; z-index: 0; }
.yqgw-media-background .yqgw-service-media img { width: 100%; height: 100%; }
.yqgw-media-background .yqgw-service-media:after { content: ''; position: absolute; inset: 0; background: rgba(30,77,30,.55); transition: background-color .3s ease; }
.yqgw-media-background .yqgw-service-body { position: relative; z-index: 1; }

/* Icon */
.yqgw-service-icon { display: flex; align-items: center; justify-content: center; margin-left: auto; margin-right: auto; }
.yqgw-service-icon svg { width: 42px; height: 42px; fill: var(--yqgw-green); }
.yqgw-service-icon i { font-size: 42px; color: var(--yqgw-green); }
.yqgw-icon-circle .yqgw-service-icon  { border-radius: 50%; }
.yqgw-icon-square .yqgw-service-icon  { border-radius: 0; }
.yqgw-icon-rounded .yqgw-service-icon { border-radius: 14px; }

/* Badge */
.yqgw-service-badge { position: absolute; top: 10px; left: 10px; z-index: 3; padding: 4px 10px; font-size: 12px; font-weight: 700; background: var(--yqgw-red); color: #fff; border-radius: 3px; }

/* Text */
.yqgw-service-title { color: var(--yqgw-green); margin: 0 0 8px; transition: color .3s ease; }
.yqgw-service-desc  { color: #5a6b46; margin: 0 0 10px; }
.yqgw-service-link  { display: inline-block; margin-top: 12px; color: var(--yqgw-red); font-weight: 600; text-decoration: none; transition: all .3s ease; }
.yqgw-service-link:hover { text-decoration: underline; }
.yqgw-service-link.is-button { padding: 10px 22px; background: var(--yqgw-gold); color: var(--yqgw-green-dark); border-radius: 4px; text-decoration: none; }
.yqgw-service-link.is-button:hover { text-decoration: none; }

/* Description visibility */
.yqgw-desc-hidden .yqgw-service-desc { display: none; }
.yqgw-desc-hover .yqgw-service-desc { transition: opacity .35s ease, transform .35s ease, max-height .35s ease; }
.yqgw-desc-hover.yqgw-reveal-fade .yqgw-service-desc { opacity: 0; }
.yqgw-desc-hover.yqgw-reveal-fade .yqgw-service-card:hover .yqgw-service-desc { opacity: 1; }
.yqgw-desc-hover.yqgw-reveal-slide-up .yqgw-service-desc { opacity: 0; transform: translateY(12px); }
.yqgw-desc-hover.yqgw-reveal-slide-up .yqgw-service-card:hover .yqgw-service-desc { opacity: 1; transform: translateY(0); }
.yqgw-desc-hover.yqgw-reveal-slide-down .yqgw-service-desc { opacity: 0; transform: translateY(-12px); }
.yqgw-desc-hover.yqgw-reveal-slide-down .yqgw-service-card:hover .yqgw-service-desc { opacity: 1; transform: translateY(0); }
.yqgw-desc-hover.yqgw-reveal-expand .yqgw-service-desc { opacity: 0; max-height: 0; overflow: hidden; margin-bottom: 0; }
.yqgw-desc-hover.yqgw-reveal-expand .yqgw-service-card:hover .yqgw-service-desc { opacity: 1; max-height: 300px; margin-bottom: 10px; }

/**/
/* Brands tile structure */
.yqgw-brand-tile { display: flex; align-items: center; justify-content: center; }
.yqgw-logo-top .yqgw-brand-tile    { flex-direction: column; }
.yqgw-logo-bottom .yqgw-brand-tile  { flex-direction: column-reverse; }
.yqgw-logo-left .yqgw-brand-tile    { flex-direction: row; gap: 12px; }
.yqgw-logo-right .yqgw-brand-tile   { flex-direction: row-reverse; gap: 12px; }
.yqgw-logo-only .yqgw-brand-tile    { flex-direction: column; }
.yqgw-brand-logo { line-height: 0; }
.yqgw-brand-logo img { max-height: 70px; width: auto; display: block; transition: filter .3s ease, transform .3s ease, opacity .3s ease; }
.yqgw-brand-name { display: block; color: var(--yqgw-green); font-weight: 700; transition: color .3s ease; }
.yqgw-brand-subtext { display: block; color: #5a6b46; font-size: .9em; margin-top: 4px; }

/* Logo effects */
.yqgw-logofx-gray-color .yqgw-brand-logo img { filter: grayscale(100%); }
.yqgw-logofx-gray-color .yqgw-brand-tile:hover .yqgw-brand-logo img { filter: grayscale(0); }
.yqgw-logofx-color-gray .yqgw-brand-tile:hover .yqgw-brand-logo img { filter: grayscale(100%); }
.yqgw-logofx-fade .yqgw-brand-tile:hover .yqgw-brand-logo img { opacity: .6; }
.yqgw-logofx-zoom .yqgw-brand-tile:hover .yqgw-brand-logo img { transform: scale(1.1); }

/**/
/* Hover effects (services + brands) */
.yqgw-hover-lift .yqgw-service-card:hover,  .yqgw-hover-lift .yqgw-brand-tile:hover  { transform: translateY(-8px); }
.yqgw-hover-sink .yqgw-service-card:hover,  .yqgw-hover-sink .yqgw-brand-tile:hover  { transform: translateY(8px); }
.yqgw-hover-grow .yqgw-service-card:hover,  .yqgw-hover-grow .yqgw-brand-tile:hover  { transform: scale(1.04); z-index: 2; }
.yqgw-hover-shrink .yqgw-service-card:hover,.yqgw-hover-shrink .yqgw-brand-tile:hover{ transform: scale(.96); }
.yqgw-hover-tilt .yqgw-service-card:hover,  .yqgw-hover-tilt .yqgw-brand-tile:hover  { transform: rotate(-1.5deg) scale(1.02); }
.yqgw-hover-glow .yqgw-service-card:hover,  .yqgw-hover-glow .yqgw-brand-tile:hover  { box-shadow: 0 12px 30px rgba(44,104,44,.28); }
.yqgw-hover-pulse .yqgw-service-card:hover, .yqgw-hover-pulse .yqgw-brand-tile:hover { animation: protexPulse .6s ease; }
@keyframes protexPulse { 0%{transform:scale(1);} 50%{transform:scale(1.05);} 100%{transform:scale(1);} }

/* Image hover (services) */
.yqgw-img-zoom .yqgw-service-card:hover .yqgw-service-media img     { transform: scale(1.1); }
.yqgw-img-zoom-out .yqgw-service-media img                            { transform: scale(1.1); }
.yqgw-img-zoom-out .yqgw-service-card:hover .yqgw-service-media img { transform: scale(1); }
.yqgw-img-slide .yqgw-service-card:hover .yqgw-service-media img    { transform: scale(1.1) translateX(4%); }
.yqgw-img-bright .yqgw-service-card:hover .yqgw-service-media img   { filter: brightness(1.15); }
.yqgw-img-gray-color .yqgw-service-media img                          { filter: grayscale(100%); }
.yqgw-img-gray-color .yqgw-service-card:hover .yqgw-service-media img { filter: grayscale(0); }

/**/
/* Patterns */
.yqgw-pattern-dots .yqgw-service-card, .yqgw-pattern-dots .yqgw-brand-tile { background-image: radial-gradient(var(--yqgw-pattern-color, rgba(44,104,44,.08)) 1.5px, transparent 1.5px); background-size: 14px 14px; }
.yqgw-pattern-diagonal .yqgw-service-card, .yqgw-pattern-diagonal .yqgw-brand-tile { background-image: repeating-linear-gradient(45deg, var(--yqgw-pattern-color, rgba(44,104,44,.08)) 0, var(--yqgw-pattern-color, rgba(44,104,44,.08)) 1px, transparent 1px, transparent 10px); }
.yqgw-pattern-grid .yqgw-service-card, .yqgw-pattern-grid .yqgw-brand-tile { background-image: linear-gradient(var(--yqgw-pattern-color, rgba(44,104,44,.08)) 1px, transparent 1px), linear-gradient(90deg, var(--yqgw-pattern-color, rgba(44,104,44,.08)) 1px, transparent 1px); background-size: 16px 16px; }
.yqgw-pattern-crosshatch .yqgw-service-card, .yqgw-pattern-crosshatch .yqgw-brand-tile { background-image: repeating-linear-gradient(45deg, var(--yqgw-pattern-color, rgba(44,104,44,.08)) 0, var(--yqgw-pattern-color, rgba(44,104,44,.08)) 1px, transparent 1px, transparent 8px), repeating-linear-gradient(-45deg, var(--yqgw-pattern-color, rgba(44,104,44,.08)) 0, var(--yqgw-pattern-color, rgba(44,104,44,.08)) 1px, transparent 1px, transparent 8px); }

/**/
/* Carousel pre-init + slick */
.yqgw-services-carousel:not(.slick-initialized), .yqgw-brands-carousel:not(.slick-initialized) { display: flex; gap: 16px; overflow: hidden; }
.yqgw-services-carousel:not(.slick-initialized) > *, .yqgw-brands-carousel:not(.slick-initialized) > * { flex: 1 1 0; min-width: 0; }
.yqgw-services-carousel .slick-slide, .yqgw-brands-carousel .slick-slide { height: inherit; margin: 0 8px; }
.yqgw-services-carousel .slick-track, .yqgw-brands-carousel .slick-track { display: flex; }
.yqgw-services-carousel .slick-list, .yqgw-brands-carousel .slick-list { margin: 0 -8px; }
.yqgw-services-carousel .slick-arrow, .yqgw-brands-carousel .slick-arrow { width: 40px; height: 40px; z-index: 5; }
.yqgw-services-carousel .slick-arrow:before, .yqgw-brands-carousel .slick-arrow:before { color: var(--yqgw-green); font-size: 28px; opacity: 1; }
.yqgw-services-carousel .slick-dots li button:before, .yqgw-brands-carousel .slick-dots li button:before { color: var(--yqgw-border); opacity: 1; font-size: 10px; }
.yqgw-services-carousel .slick-dots li.slick-active button:before, .yqgw-brands-carousel .slick-dots li.slick-active button:before { color: var(--yqgw-gold); }

/**/
/* Entrance animation */
.yqgw-services-grid [data-anim]:not(.yqgw-animated), .yqgw-brands-grid [data-anim]:not(.yqgw-animated) { opacity: 0; }
.yqgw-services-grid [data-anim].yqgw-animated, .yqgw-brands-grid [data-anim].yqgw-animated { animation-duration: 1s; animation-fill-mode: both; opacity: 1; }
.yqgw-services-grid [data-anim].yqgw-animated.slow, .yqgw-brands-grid [data-anim].yqgw-animated.slow { animation-duration: 2s; }
.yqgw-services-grid [data-anim].yqgw-animated.fast, .yqgw-brands-grid [data-anim].yqgw-animated.fast { animation-duration: .5s; }
.yqgw-anim-fadeIn { animation-name: protexFadeIn; }
.yqgw-anim-fadeInUp { animation-name: protexFadeInUp; }
.yqgw-anim-fadeInDown { animation-name: protexFadeInDown; }
.yqgw-anim-fadeInLeft { animation-name: protexFadeInLeft; }
.yqgw-anim-fadeInRight { animation-name: protexFadeInRight; }
.yqgw-anim-zoomIn { animation-name: protexZoomIn; }
.yqgw-anim-slideInUp { animation-name: protexFadeInUp; }
.yqgw-anim-bounceIn { animation-name: protexZoomIn; }
@keyframes protexFadeIn { from{opacity:0;} to{opacity:1;} }
@keyframes protexFadeInUp { from{opacity:0;transform:translateY(30px);} to{opacity:1;transform:translateY(0);} }
@keyframes protexFadeInDown { from{opacity:0;transform:translateY(-30px);} to{opacity:1;transform:translateY(0);} }
@keyframes protexFadeInLeft { from{opacity:0;transform:translateX(-30px);} to{opacity:1;transform:translateX(0);} }
@keyframes protexFadeInRight { from{opacity:0;transform:translateX(30px);} to{opacity:1;transform:translateX(0);} }
@keyframes protexZoomIn { from{opacity:0;transform:scale(.85);} to{opacity:1;transform:scale(1);} }

/**/
/* Contact */
.yqgw-contact-wrap { width: 100%; }
.yqgw-contact-grid { display: flex; flex-wrap: wrap; gap: 40px; }
.yqgw-contact-info { flex: 0 0 42%; max-width: 42%; }
.yqgw-contact-form { flex: 1; min-width: 280px; }
.yqgw-contact-grid.yqgw-contact-single .yqgw-contact-info, .yqgw-contact-grid.yqgw-contact-single .yqgw-contact-form { flex: 1 1 100% !important; max-width: 100% !important; }
.yqgw-contact-card { background: #fff; border: 1px solid var(--yqgw-border); border-radius: 8px; padding: 30px; }
.yqgw-contact-title { color: var(--yqgw-green); margin: 0 0 12px; }
.yqgw-contact-sub { color: #5a6b46; margin: 0 0 24px; }
.yqgw-contact-details { list-style: none; margin: 0; padding: 0; }
.yqgw-detail { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 20px; }
.yqgw-detail:last-child { margin-bottom: 0; }
.yqgw-detail-icon { flex: 0 0 46px; width: 46px; height: 46px; border-radius: 50%; background: var(--yqgw-cream); display: flex; align-items: center; justify-content: center; }
.yqgw-detail-icon svg { width: 20px; height: 20px; fill: var(--yqgw-red); }
.yqgw-detail-icon i { font-size: 20px; color: var(--yqgw-red); }
.yqgw-detail-text { display: flex; flex-direction: column; }
.yqgw-detail-label { color: var(--yqgw-green); font-weight: 700; font-size: .9em; text-transform: uppercase; letter-spacing: .5px; }
.yqgw-detail-value, .yqgw-detail-value a { color: var(--yqgw-text); text-decoration: none; }
.yqgw-detail-value a:hover { color: var(--yqgw-red); }
.yqgw-contact-map { margin-top: 24px; }
.yqgw-contact-map iframe { width: 100%; height: 280px; border: 0; border-radius: 8px; display: block; }

/**/
/* Responsive */
@media (max-width: 1024px) {
	.yqgw-media-left .yqgw-service-card, .yqgw-media-right .yqgw-service-card { flex-direction: column; }
	.yqgw-media-left .yqgw-service-media img, .yqgw-media-right .yqgw-service-media img { height: 180px; }
}
@media (max-width: 767px) {
	.yqgw-contact-info { flex: 0 0 100%; max-width: 100%; }
}


/**/
/* Protex Content Panel + extras */
.yqgw-has-panel .yqgw-service-body { display: flex; flex-direction: column; transition: transform .3s ease, background-color .3s ease, box-shadow .3s ease, border-color .3s ease, backdrop-filter .3s ease; }
.yqgw-media-background.yqgw-has-panel .yqgw-service-body { margin: auto; }

/* Content panel hover effects (triggered on card hover) */
.yqgw-panelhover-lift .yqgw-service-card:hover .yqgw-service-body { transform: translateY(-6px); }
.yqgw-panelhover-sink .yqgw-service-card:hover .yqgw-service-body { transform: translateY(6px); }
.yqgw-panelhover-grow .yqgw-service-card:hover .yqgw-service-body { transform: scale(1.04); }
.yqgw-panelhover-shrink .yqgw-service-card:hover .yqgw-service-body { transform: scale(.96); }
.yqgw-panelhover-glow .yqgw-service-card:hover .yqgw-service-body { box-shadow: 0 12px 30px rgba(44,104,44,.28); }
.yqgw-badge-right .yqgw-service-badge { left: auto; right: 10px; }

/* Align buttons: button is pinned to the bottom of the (equal-height) panel via JS, so only the
   button moves and the content keeps its own vertical alignment. */
.yqgw-align-buttons .yqgw-service-body { position: relative; height: 100%; }
.yqgw-align-buttons.yqgw-media-background.yqgw-has-panel .yqgw-service-body { margin-top: 0; margin-bottom: 0; align-self: stretch; }
/* Banner button: flush full-width bar at the bottom edge of the panel */
.yqgw-btn-banner .yqgw-service-card .yqgw-service-link { border-radius: 0 !important; text-align: center; }

/* Standalone background patterns - add these classes to ANY element's CSS Classes field.
   Optionally set --yqgw-pattern-color on the element to change the color. */
.yqgw-bg-dots { background-image: radial-gradient(var(--yqgw-pattern-color, rgba(44,104,44,.12)) 1.5px, transparent 1.5px); background-size: 14px 14px; }
.yqgw-bg-diagonal { background-image: repeating-linear-gradient(45deg, var(--yqgw-pattern-color, rgba(44,104,44,.12)) 0, var(--yqgw-pattern-color, rgba(44,104,44,.12)) 1px, transparent 1px, transparent 10px); }
.yqgw-bg-grid { background-image: linear-gradient(var(--yqgw-pattern-color, rgba(44,104,44,.12)) 1px, transparent 1px), linear-gradient(90deg, var(--yqgw-pattern-color, rgba(44,104,44,.12)) 1px, transparent 1px); background-size: 16px 16px; }
.yqgw-bg-crosshatch { background-image: repeating-linear-gradient(45deg, var(--yqgw-pattern-color, rgba(44,104,44,.12)) 0, var(--yqgw-pattern-color, rgba(44,104,44,.12)) 1px, transparent 1px, transparent 8px), repeating-linear-gradient(-45deg, var(--yqgw-pattern-color, rgba(44,104,44,.12)) 0, var(--yqgw-pattern-color, rgba(44,104,44,.12)) 1px, transparent 1px, transparent 8px); }


/**/
/* Protex panel patterns (applied to the content panel) */
.yqgw-panelpat-dots .yqgw-service-body { background-image: radial-gradient(var(--yqgw-panel-pattern-color, rgba(255,255,255,.18)) 1.5px, transparent 1.5px); background-size: 14px 14px; }
.yqgw-panelpat-diagonal .yqgw-service-body { background-image: repeating-linear-gradient(45deg, var(--yqgw-panel-pattern-color, rgba(255,255,255,.18)) 0, var(--yqgw-panel-pattern-color, rgba(255,255,255,.18)) 1px, transparent 1px, transparent 10px); }
.yqgw-panelpat-grid .yqgw-service-body { background-image: linear-gradient(var(--yqgw-panel-pattern-color, rgba(255,255,255,.18)) 1px, transparent 1px), linear-gradient(90deg, var(--yqgw-panel-pattern-color, rgba(255,255,255,.18)) 1px, transparent 1px); background-size: 16px 16px; }
.yqgw-panelpat-crosshatch .yqgw-service-body { background-image: repeating-linear-gradient(45deg, var(--yqgw-panel-pattern-color, rgba(255,255,255,.18)) 0, var(--yqgw-panel-pattern-color, rgba(255,255,255,.18)) 1px, transparent 1px, transparent 8px), repeating-linear-gradient(-45deg, var(--yqgw-panel-pattern-color, rgba(255,255,255,.18)) 0, var(--yqgw-panel-pattern-color, rgba(255,255,255,.18)) 1px, transparent 1px, transparent 8px); }

/* Panel backing modes */
.yqgw-panelback-transparent .yqgw-service-body,
.yqgw-panelback-invert .yqgw-service-body,
.yqgw-panelback-knockout .yqgw-service-body { background: transparent !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.yqgw-panelback-invert .yqgw-service-media { display: none !important; }
.yqgw-panelback-knockout .yqgw-service-card { background: transparent !important; box-shadow: none !important; }
.yqgw-panelback-knockout .yqgw-service-media { -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
/* Non-background knockout has no image layer to punch, so the whole card reveals the section */
.yqgw-panelback-knockout:not(.yqgw-media-background) .yqgw-service-media { display: none !important; }


/**/
/* Self-contained carousel arrows (CSS chevrons, driven by currentColor) */
.yqgw-services-carousel .slick-arrow, .yqgw-brands-carousel .slick-arrow {
	background: transparent;
	border: 0;
	width: 40px;
	height: 40px;
	cursor: pointer;
	z-index: 5;
}
.yqgw-services-carousel .slick-prev, .yqgw-brands-carousel .slick-prev { left: -12px; }
.yqgw-services-carousel .slick-next, .yqgw-brands-carousel .slick-next { right: -12px; }
.yqgw-services-carousel .slick-arrow:before, .yqgw-brands-carousel .slick-arrow:before {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	border-right: 3px solid currentColor;
	border-bottom: 3px solid currentColor;
	color: var(--yqgw-green);
	opacity: 1;
}
.yqgw-services-carousel .prev-arrow:before, .yqgw-brands-carousel .prev-arrow:before { transform: rotate(135deg); }
.yqgw-services-carousel .next-arrow:before, .yqgw-brands-carousel .next-arrow:before { transform: rotate(-45deg); }
.yqgw-services-carousel .slick-dots, .yqgw-brands-carousel .slick-dots { margin-top: 18px; }


/************************************************************************************************/
/* YQG Image Widget */
.yqgw-image { display: flex; flex-direction: column; --yqgw-cut: 30px; }
.yqgw-image-frame { display: block; position: relative; line-height: 0; max-width: 100%; text-decoration: none; }
.yqgw-image-inner { position: relative; overflow: hidden; line-height: 0; }
.yqgw-img { display: block; width: 100%; height: auto; transition: transform .4s ease, filter .4s ease, opacity .4s ease; }

/**/
/* Shapes (clip-path) */
.yqgw-shape-circle .yqgw-image-inner, .yqgw-shape-circle .yqgw-image-frame { clip-path: circle(50%); }
.yqgw-shape-ellipse .yqgw-image-inner, .yqgw-shape-ellipse .yqgw-image-frame { clip-path: ellipse(50% 50%); }
.yqgw-shape-rounded .yqgw-image-inner { border-radius: 16px; }
.yqgw-shape-squircle .yqgw-image-inner { border-radius: 30% / 22%; }
.yqgw-shape-blob1 .yqgw-image-inner { border-radius: 42% 58% 70% 30% / 45% 45% 55% 55%; }
.yqgw-shape-blob2 .yqgw-image-inner { border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; }
.yqgw-shape-cut-tl .yqgw-image-inner, .yqgw-shape-cut-tl .yqgw-image-frame { clip-path: polygon(var(--yqgw-cut) 0, 100% 0, 100% 100%, 0 100%, 0 var(--yqgw-cut)); }
.yqgw-shape-cut-tr .yqgw-image-inner, .yqgw-shape-cut-tr .yqgw-image-frame { clip-path: polygon(0 0, calc(100% - var(--yqgw-cut)) 0, 100% var(--yqgw-cut), 100% 100%, 0 100%); }
.yqgw-shape-cut-bl .yqgw-image-inner, .yqgw-shape-cut-bl .yqgw-image-frame { clip-path: polygon(0 0, 100% 0, 100% 100%, var(--yqgw-cut) 100%, 0 calc(100% - var(--yqgw-cut))); }
.yqgw-shape-cut-br .yqgw-image-inner, .yqgw-shape-cut-br .yqgw-image-frame { clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--yqgw-cut)), calc(100% - var(--yqgw-cut)) 100%, 0 100%); }
.yqgw-shape-cut-diag .yqgw-image-inner, .yqgw-shape-cut-diag .yqgw-image-frame { clip-path: polygon(var(--yqgw-cut) 0, 100% 0, 100% calc(100% - var(--yqgw-cut)), calc(100% - var(--yqgw-cut)) 100%, 0 100%, 0 var(--yqgw-cut)); }
.yqgw-shape-cut-diag2 .yqgw-image-inner, .yqgw-shape-cut-diag2 .yqgw-image-frame { clip-path: polygon(0 0, calc(100% - var(--yqgw-cut)) 0, 100% var(--yqgw-cut), 100% 100%, var(--yqgw-cut) 100%, 0 calc(100% - var(--yqgw-cut))); }
.yqgw-shape-cut-top .yqgw-image-inner, .yqgw-shape-cut-top .yqgw-image-frame { clip-path: polygon(var(--yqgw-cut) 0, calc(100% - var(--yqgw-cut)) 0, 100% var(--yqgw-cut), 100% 100%, 0 100%, 0 var(--yqgw-cut)); }
.yqgw-shape-cut-bottom .yqgw-image-inner, .yqgw-shape-cut-bottom .yqgw-image-frame { clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--yqgw-cut)), calc(100% - var(--yqgw-cut)) 100%, var(--yqgw-cut) 100%, 0 calc(100% - var(--yqgw-cut))); }
.yqgw-shape-chevron .yqgw-image-inner, .yqgw-shape-chevron .yqgw-image-frame { clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--yqgw-cut)), 50% 100%, 0 calc(100% - var(--yqgw-cut))); }
.yqgw-shape-arrow .yqgw-image-inner, .yqgw-shape-arrow .yqgw-image-frame { clip-path: polygon(0 0, calc(100% - var(--yqgw-cut)) 0, 100% 50%, calc(100% - var(--yqgw-cut)) 100%, 0 100%); }
.yqgw-shape-rhombus .yqgw-image-inner, .yqgw-shape-rhombus .yqgw-image-frame { clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.yqgw-shape-parallelogram .yqgw-image-inner, .yqgw-shape-parallelogram .yqgw-image-frame { clip-path: polygon(var(--yqgw-cut) 0, 100% 0, calc(100% - var(--yqgw-cut)) 100%, 0 100%); }
.yqgw-shape-hexagon .yqgw-image-inner, .yqgw-shape-hexagon .yqgw-image-frame { clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%); }
.yqgw-shape-hexagon-v .yqgw-image-inner, .yqgw-shape-hexagon-v .yqgw-image-frame { clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); }
.yqgw-shape-pentagon .yqgw-image-inner, .yqgw-shape-pentagon .yqgw-image-frame { clip-path: polygon(50% 0, 100% 38%, 82% 100%, 18% 100%, 0 38%); }
.yqgw-shape-octagon .yqgw-image-inner, .yqgw-shape-octagon .yqgw-image-frame { clip-path: polygon(30% 0, 70% 0, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0 70%, 0 30%); }
.yqgw-shape-triangle .yqgw-image-inner, .yqgw-shape-triangle .yqgw-image-frame { clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.yqgw-shape-star .yqgw-image-inner, .yqgw-shape-star .yqgw-image-frame { clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%); }
.yqgw-shape-message .yqgw-image-inner, .yqgw-shape-message .yqgw-image-frame { clip-path: polygon(0 0, 100% 0, 100% 80%, 32% 80%, 16% 100%, 18% 80%, 0 80%); }

/**/
/* Overlay */
.yqgw-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; opacity: 0; transition: opacity .4s ease; z-index: 2; }
.yqgw-ov-always .yqgw-overlay { opacity: 1; }
.yqgw-has-overlay:hover .yqgw-overlay { opacity: 1; }

/**/
/* Caption */
.yqgw-caption { margin: 0; color: #333; }
.yqgw-caption-below { padding: 10px 0 0; line-height: 1.4; }
.yqgw-cap-over-bottom .yqgw-caption, .yqgw-cap-over-top .yqgw-caption, .yqgw-cap-over-center .yqgw-caption,
.yqgw-cap-hover-fade .yqgw-caption, .yqgw-cap-hover-slide .yqgw-caption { position: absolute; left: 0; right: 0; padding: 14px; line-height: 1.4; z-index: 3; }
.yqgw-cap-over-bottom .yqgw-caption { bottom: 0; }
.yqgw-cap-over-top .yqgw-caption { top: 0; }
.yqgw-cap-over-center .yqgw-caption { top: 50%; transform: translateY(-50%); }
.yqgw-cap-hover-fade .yqgw-caption { bottom: 0; opacity: 0; transition: opacity .4s ease; }
.yqgw-cap-hover-fade:hover .yqgw-caption { opacity: 1; }
.yqgw-cap-hover-slide .yqgw-caption { bottom: 0; transform: translateY(100%); transition: transform .4s ease; }
.yqgw-cap-hover-slide:hover .yqgw-caption { transform: translateY(0); }

/**/
/* Hover effects */
.yqgw-hover-zoom-in:hover .yqgw-img { transform: scale(1.12); }
.yqgw-hover-zoom-out .yqgw-img { transform: scale(1.12); }
.yqgw-hover-zoom-out:hover .yqgw-img { transform: scale(1); }
.yqgw-hover-pan:hover .yqgw-img { transform: scale(1.15) translateX(4%); }
.yqgw-hover-rotate:hover .yqgw-img { transform: scale(1.1) rotate(3deg); }
.yqgw-hover-lift { transition: transform .4s ease, box-shadow .4s ease; }
.yqgw-hover-lift:hover { transform: translateY(-8px); }
.yqgw-hover-blur:hover .yqgw-img { filter: blur(3px); }
.yqgw-hover-gray-color .yqgw-img { filter: grayscale(100%); }
.yqgw-hover-gray-color:hover .yqgw-img { filter: grayscale(0); }
.yqgw-hover-color-gray:hover .yqgw-img { filter: grayscale(100%); }
.yqgw-hover-glow:hover .yqgw-image-inner { box-shadow: 0 0 26px rgba(224,168,28,.6); }
.yqgw-hover-tilt .yqgw-image-frame { transition: transform .2s ease; transform-style: preserve-3d; will-change: transform; }
.yqgw-hover-shine .yqgw-image-inner:before { content: ""; position: absolute; top: 0; left: -75%; width: 50%; height: 100%; z-index: 4; background: linear-gradient(120deg, rgba(255,255,255,0) 0, rgba(255,255,255,.45) 50%, rgba(255,255,255,0) 100%); transform: skewX(-20deg); pointer-events: none; }
.yqgw-hover-shine:hover .yqgw-image-inner:before { left: 130%; transition: left .8s ease; }

/**/
/* Collage */
.yqgw-collage { display: grid; gap: 12px; }
.yqgw-collage-grid { grid-template-columns: repeat(3, 1fr); }
.yqgw-collage-grid .yqgw-collage-item .yqgw-img { height: 100%; object-fit: cover; }
.yqgw-collage-grid .yqgw-collage-item, .yqgw-collage-grid .yqgw-image-inner { height: 100%; }
.yqgw-collage-masonry { display: block; column-count: 3; column-gap: 12px; }
.yqgw-collage-masonry .yqgw-collage-item { display: inline-block; width: 100%; margin-bottom: 12px; break-inside: avoid; }
.yqgw-collage-featured-left, .yqgw-collage-featured-right { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 1fr; }
.yqgw-collage-featured-left .yqgw-collage-item:first-child { grid-row: span 2; grid-column: span 2; }
.yqgw-collage-featured-right .yqgw-collage-item:first-child { grid-row: span 2; grid-column: span 2; grid-column-start: 2; }
.yqgw-collage-featured-left .yqgw-collage-item .yqgw-img, .yqgw-collage-featured-right .yqgw-collage-item .yqgw-img { height: 100%; object-fit: cover; }
.yqgw-collage-featured-left .yqgw-collage-item, .yqgw-collage-featured-right .yqgw-collage-item,
.yqgw-collage-featured-left .yqgw-image-inner, .yqgw-collage-featured-right .yqgw-image-inner { height: 100%; }
.yqgw-collage-overlap { display: block; position: relative; min-height: 320px; }
.yqgw-collage-overlap .yqgw-collage-item { position: absolute; width: 55%; box-shadow: 0 10px 30px rgba(0,0,0,.25); transition: transform .3s ease; }
.yqgw-collage-overlap .yqgw-collage-item:nth-child(1) { top: 0; left: 0; z-index: 1; }
.yqgw-collage-overlap .yqgw-collage-item:nth-child(2) { top: 12%; left: 40%; z-index: 2; }
.yqgw-collage-overlap .yqgw-collage-item:nth-child(3) { top: 30%; left: 18%; z-index: 3; }
.yqgw-collage-overlap .yqgw-collage-item:hover { transform: scale(1.04); z-index: 5; }

/**/
/* Before / After compare */
.yqgw-compare { position: relative; line-height: 0; user-select: none; touch-action: none; }
.yqgw-compare .yqgw-cmp-before { display: block; width: 100%; height: auto; }
.yqgw-cmp-after-wrap { position: absolute; inset: 0; }
.yqgw-cmp-after { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* Static reveal: After image is fixed full-size; the divider just changes the visible window.
   Before = left/top, After = right/bottom. */
.yqgw-compare-h .yqgw-cmp-after { clip-path: inset(0 0 0 var(--yqgw-pos, 50%)); }
.yqgw-compare-v .yqgw-cmp-after { clip-path: inset(var(--yqgw-pos, 50%) 0 0 0); }
.yqgw-cmp-handle { position: absolute; z-index: 4; background: #fff; box-shadow: 0 0 6px rgba(0,0,0,.4); pointer-events: none; }
.yqgw-compare-h .yqgw-cmp-handle { top: 0; bottom: 0; width: 3px; left: var(--yqgw-pos, 50%); transform: translateX(-50%); }
.yqgw-compare-v .yqgw-cmp-handle { left: 0; right: 0; height: 3px; top: var(--yqgw-pos, 50%); transform: translateY(-50%); }
.yqgw-cmp-handle:before { content: ""; position: absolute; top: 50%; left: 50%; width: 34px; height: 34px; border-radius: 50%; background: inherit; transform: translate(-50%, -50%); box-shadow: 0 0 6px rgba(0,0,0,.4); }
.yqgw-cmp-range { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; z-index: 5; }
.yqgw-compare-v .yqgw-cmp-range { cursor: ns-resize; }
.yqgw-cmp-label { position: absolute; bottom: 12px; padding: 4px 10px; font-size: 13px; border-radius: 3px; line-height: 1.2; z-index: 4; }
.yqgw-cmp-label-before { left: 12px; }
.yqgw-cmp-label-after { right: 12px; }

/**/
/* Lightbox */
.yqgw-lightbox { position: fixed; inset: 0; background: rgba(0,0,0,.88); display: flex; align-items: center; justify-content: center; z-index: 99999; padding: 30px; cursor: zoom-out; opacity: 0; transition: opacity .25s ease; }
.yqgw-lightbox.is-open { opacity: 1; }
.yqgw-lightbox img { max-width: 95%; max-height: 92%; border-radius: 4px; box-shadow: 0 10px 40px rgba(0,0,0,.5); }
.yqgw-lightbox-close { position: absolute; top: 18px; right: 26px; color: #fff; font-size: 40px; line-height: 1; cursor: pointer; background: none; border: 0; }

/**/
/* Image: hover swap, Ken Burns, duotone */
.yqgw-has-swap .yqgw-img-hover { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; transition: opacity .5s ease; }
.yqgw-has-swap:hover .yqgw-img-hover { opacity: 1; }
.yqgw-kenburns { overflow: hidden; }
.yqgw-kenburns .yqgw-img { animation-duration: 12s; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: ease-in-out; will-change: transform; }
.yqgw-kb-zoom-in .yqgw-img { animation-name: yqgwKBZoomIn; }
.yqgw-kb-zoom-out .yqgw-img { animation-name: yqgwKBZoomOut; }
.yqgw-kb-pan-lr .yqgw-img { animation-name: yqgwKBPanLR; }
.yqgw-kb-pan-tb .yqgw-img { animation-name: yqgwKBPanTB; }
@keyframes yqgwKBZoomIn { from { transform: scale(1); } to { transform: scale(1.2); } }
@keyframes yqgwKBZoomOut { from { transform: scale(1.2); } to { transform: scale(1); } }
@keyframes yqgwKBPanLR { from { transform: scale(1.2) translateX(-5%); } to { transform: scale(1.2) translateX(5%); } }
@keyframes yqgwKBPanTB { from { transform: scale(1.2) translateY(-5%); } to { transform: scale(1.2) translateY(5%); } }
.yqgw-duotone .yqgw-img { filter: grayscale(1) contrast(1.05); }
.yqgw-duotone .yqgw-image-inner::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(var(--yqgw-duo-a, #1e4d1e), var(--yqgw-duo-b, #e0a81c)); mix-blend-mode: lighten; }

/************************************************************************************************/
/* YQG Flip Box */
.yqgw-flipbox { perspective: 1400px; height: 320px; }
.yqgw-flip-inner { position: relative; width: 100%; height: 100%; transition: transform .7s cubic-bezier(.4,.2,.2,1); transform-style: preserve-3d; }
.yqgw-flip-face { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 12px; backface-visibility: hidden; -webkit-backface-visibility: hidden; overflow: hidden; background-size: cover; background-position: center; }
.yqgw-flip-front > *, .yqgw-flip-back > * { position: relative; z-index: 1; }
.yqgw-flip-title { margin: 0; }
.yqgw-flip-text { margin: 0; line-height: 1.5; }
.yqgw-flip-btn { display: inline-block; margin-top: 6px; padding: 10px 22px; font-weight: 600; text-decoration: none; transition: filter .2s ease; }
.yqgw-flip-btn:hover { filter: brightness(1.08); }
.yqgw-flip-icon { line-height: 0; }
/* faces orientation */
.yqgw-flip-back { transform: rotateY(180deg); }
.yqgw-flip-up .yqgw-flip-back, .yqgw-flip-down .yqgw-flip-back { transform: rotateX(180deg); }
/* hover flip per direction */
.yqgw-flip-left:hover .yqgw-flip-inner { transform: rotateY(180deg); }
.yqgw-flip-right:hover .yqgw-flip-inner { transform: rotateY(-180deg); }
.yqgw-flip-up:hover .yqgw-flip-inner { transform: rotateX(180deg); }
.yqgw-flip-down:hover .yqgw-flip-inner { transform: rotateX(-180deg); }
.yqgw-flip-right .yqgw-flip-back { transform: rotateY(-180deg); }
.yqgw-flip-down .yqgw-flip-back { transform: rotateX(-180deg); }

/************************************************************************************************/
/* YQG Counter */
.yqgw-counter { display: flex; flex-direction: column; gap: 10px; }
.yqgw-counter-ipos-left { flex-direction: row; align-items: center; justify-content: center; }
.yqgw-counter-ipos-right { flex-direction: row-reverse; align-items: center; justify-content: center; }
.yqgw-counter-number { font-size: 52px; font-weight: 700; line-height: 1; color: #2c682c; }
.yqgw-counter-title { color: #5a6b46; }
.yqgw-counter-icon { line-height: 0; }

/************************************************************************************************/
/* YQG Button */
.yqgw-btn-wrap { display: flex; }
.yqgw-btn-wrap.yqgw-fullwidth { display: block; }
.yqgw-btn-wrap.yqgw-fullwidth .yqgw-btn { width: 100%; }
.yqgw-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; background: #2c682c; color: #fff; border: none; cursor: pointer; text-decoration: none; overflow: hidden; transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease, letter-spacing .35s ease; -webkit-tap-highlight-color: transparent; }
.yqgw-btn-bg { position: absolute; inset: 0; z-index: 0; opacity: 0; transition: opacity .35s ease, transform .35s ease, clip-path .35s ease; }
.yqgw-btn-content { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; line-height: 1.2; transition: color .35s ease; }
.yqgw-btn-text { display: inline-flex; flex-direction: column; }
.yqgw-btn-sub { font-size: .78em; opacity: .85; }
.yqgw-btn-icon { display: inline-flex; line-height: 0; transition: transform .35s ease; }
/* icon position */
.yqgw-icon-before .yqgw-btn-content { flex-direction: row; }
.yqgw-icon-after .yqgw-btn-content { flex-direction: row-reverse; }
.yqgw-icon-top .yqgw-btn-content { flex-direction: column; }
.yqgw-icon-bottom .yqgw-btn-content { flex-direction: column-reverse; }

/**/
/* Hover background reveal styles */
.yqgw-bh-fade:hover .yqgw-btn-bg { opacity: 1; }
.yqgw-bh-slide-left .yqgw-btn-bg { opacity: 1; transform: translateX(-100%); }
.yqgw-bh-slide-left:hover .yqgw-btn-bg { transform: translateX(0); }
.yqgw-bh-slide-right .yqgw-btn-bg { opacity: 1; transform: translateX(100%); }
.yqgw-bh-slide-right:hover .yqgw-btn-bg { transform: translateX(0); }
.yqgw-bh-slide-up .yqgw-btn-bg { opacity: 1; transform: translateY(100%); }
.yqgw-bh-slide-up:hover .yqgw-btn-bg { transform: translateY(0); }
.yqgw-bh-slide-down .yqgw-btn-bg { opacity: 1; transform: translateY(-100%); }
.yqgw-bh-slide-down:hover .yqgw-btn-bg { transform: translateY(0); }
.yqgw-bh-fill-center .yqgw-btn-bg { opacity: 1; clip-path: circle(0% at 50% 50%); }
.yqgw-bh-fill-center:hover .yqgw-btn-bg { clip-path: circle(75% at 50% 50%); }
/* Hover transforms */
.yqgw-bh-grow:hover { transform: scale(1.06); }
.yqgw-bh-grow:hover .yqgw-btn-bg, .yqgw-bh-shrink:hover .yqgw-btn-bg, .yqgw-bh-lift:hover .yqgw-btn-bg, .yqgw-bh-sink:hover .yqgw-btn-bg, .yqgw-bh-push:hover .yqgw-btn-bg, .yqgw-bh-skew:hover .yqgw-btn-bg, .yqgw-bh-pulse:hover .yqgw-btn-bg, .yqgw-bh-glow:hover .yqgw-btn-bg, .yqgw-bh-expand:hover .yqgw-btn-bg, .yqgw-bh-shine:hover .yqgw-btn-bg { opacity: 1; }
.yqgw-bh-shrink:hover { transform: scale(0.94); }
.yqgw-bh-lift:hover { transform: translateY(-5px); }
.yqgw-bh-sink:hover { transform: translateY(5px); }
.yqgw-bh-push:active { transform: translateY(3px); }
.yqgw-bh-skew:hover { transform: skewX(-7deg); }
.yqgw-bh-pulse:hover { animation: yqgwBtnPulse .6s ease; }
.yqgw-bh-expand:hover { letter-spacing: 2px; }
.yqgw-bh-glow:hover { box-shadow: 0 0 22px var(--yqgw-ring, rgba(224,168,28,.7)); }
.yqgw-bh-shine:before { content: ""; position: absolute; top: 0; left: -120%; width: 60%; height: 100%; z-index: 2; background: linear-gradient(120deg, transparent 0, rgba(255,255,255,.5) 50%, transparent 100%); transform: skewX(-20deg); pointer-events: none; }
.yqgw-bh-shine:hover:before { left: 140%; transition: left .7s ease; }

/* Icon hover motion */
.yqgw-bim-slide.yqgw-icon-after:hover .yqgw-btn-icon { transform: translateX(5px); }
.yqgw-bim-slide:hover .yqgw-btn-icon { transform: translateX(5px); }
.yqgw-bim-spin:hover .yqgw-btn-icon { transform: rotate(360deg); }
.yqgw-bim-bob:hover .yqgw-btn-icon { animation: yqgwBtnBob .6s ease infinite; }

/**/
/* Ambient (idle) effects */
.yqgw-bi-pulse { animation: yqgwBtnPulse 2s ease-in-out infinite; }
.yqgw-bi-bounce { animation: yqgwBtnBounce 2s ease-in-out infinite; }
.yqgw-bi-float { animation: yqgwBtnFloat 3s ease-in-out infinite; }
.yqgw-bi-heartbeat { animation: yqgwBtnHeartbeat 1.6s ease-in-out infinite; }
.yqgw-bi-wobble { animation: yqgwBtnWobble 2.5s ease-in-out infinite; }
.yqgw-bi-glow { animation: yqgwBtnGlow 2s ease-in-out infinite; }
.yqgw-bi-shimmer:before { content: ""; position: absolute; top: 0; left: -120%; width: 60%; height: 100%; z-index: 2; background: linear-gradient(120deg, transparent 0, rgba(255,255,255,.45) 50%, transparent 100%); transform: skewX(-20deg); pointer-events: none; animation: yqgwBtnShimmer 2.5s ease-in-out infinite; }
.yqgw-bi-gradient::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.28) 50%, transparent 70%); background-size: 220% 100%; animation: yqgwBtnGradient 4s ease infinite; }
.yqgw-bi-ring { animation: yqgwBtnRing 2s ease-out infinite; }
.yqgw-bi-arrow .yqgw-btn-icon { animation: yqgwBtnArrow 1.2s ease-in-out infinite; }
.yqgw-bi-border-spin { position: relative; }
/* SVG perimeter tracer */
.yqgw-btn-trace { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; z-index: 2; pointer-events: none; }
.yqgw-btn-trace rect { x: calc(var(--yqgw-tw, 2px) / 2); y: calc(var(--yqgw-tw, 2px) / 2); width: calc(100% - var(--yqgw-tw, 2px)); height: calc(100% - var(--yqgw-tw, 2px)); stroke-linecap: round; }
@keyframes yqgwTraceCW { to { stroke-dashoffset: -100; } }
@keyframes yqgwTraceCCW { to { stroke-dashoffset: 100; } }


@keyframes yqgwBtnPulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.05); } }
@keyframes yqgwBtnBounce { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes yqgwBtnFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
@keyframes yqgwBtnHeartbeat { 0%,100% { transform: scale(1); } 14% { transform: scale(1.08); } 28% { transform: scale(1); } 42% { transform: scale(1.08); } 56% { transform: scale(1); } }
@keyframes yqgwBtnWobble { 0%,100% { transform: rotate(0); } 25% { transform: rotate(-2deg); } 75% { transform: rotate(2deg); } }
@keyframes yqgwBtnGlow { 0%,100% { box-shadow: 0 0 0 rgba(224,168,28,0); } 50% { box-shadow: 0 0 22px var(--yqgw-ring, rgba(224,168,28,.7)); } }
@keyframes yqgwBtnShimmer { 0% { left: -120%; } 60%,100% { left: 140%; } }
@keyframes yqgwBtnGradient { 0% { background-position: 220% 0; } 100% { background-position: -220% 0; } }
@keyframes yqgwBtnRing { 0% { box-shadow: 0 0 0 0 var(--yqgw-ring, rgba(224,168,28,.7)); } 100% { box-shadow: 0 0 0 16px rgba(224,168,28,0); } }
@keyframes yqgwBtnArrow { 0%,100% { transform: translateX(0); } 50% { transform: translateX(5px); } }
@keyframes yqgwBtnBob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@keyframes yqgwBtnSpin { to { transform: rotate(360deg); } }

/************************************************************************************************/
/* YQG Pricing Table */
.yqgw-pricing { position: relative; background: #fff; border: 1px solid #e2e8d5; border-radius: 12px; padding: 36px 30px; text-align: center; transition: transform .3s ease, box-shadow .3s ease; }
.yqgw-pricing.is-featured { z-index: 2; }
.yqgw-price-block { margin-bottom: 18px; }
.yqgw-price-block:last-child { margin-bottom: 0; }
.yqgw-price-ribbon { position: absolute; top: 14px; right: -34px; transform: rotate(45deg); background: #e0a81c; color: #1e4d1e; padding: 4px 40px; font-size: 12px; font-weight: 700; letter-spacing: .5px; z-index: 3; }
/* Header */
.yqgw-price-header { margin: 0; }
.yqgw-price-icon { display: inline-flex; line-height: 0; }
.yqgw-ph-top .yqgw-price-icon { margin-bottom: 10px; }
.yqgw-ph-left .yqgw-price-header, .yqgw-ph-right .yqgw-price-header { display: flex; align-items: center; gap: 12px; text-align: left; }
.yqgw-ph-right .yqgw-price-header { flex-direction: row-reverse; }
.yqgw-price-title { margin: 0 0 4px; color: #2c682c; }
.yqgw-price-subtitle { color: #7a8a66; font-size: .92em; line-height: 1.4; }
/* Price */
.yqgw-price-amount-wrap { display: flex; flex-direction: column; align-items: center; margin: 0; }
.yqgw-price-original { display: block; color: #b3b3b3; text-decoration: line-through; font-size: 1.1em; margin-bottom: 2px; }
.yqgw-price-amount { color: #1e4d1e; font-size: 54px; font-weight: 700; line-height: 1; display: inline-flex; align-items: flex-start; }
.yqgw-price-currency { font-size: 24px; font-weight: 700; margin: 0 2px; line-height: 1.4; }
.yqgw-price-period { font-size: 16px; font-weight: 500; color: #7a8a66; align-self: flex-end; margin-bottom: 6px; }
.yqgw-price-period.yqgw-period-below { display: block; align-self: auto; margin: 4px 0 0; }
.yqgw-price-note { color: #7a8a66; font-size: .85em; margin-top: 6px; }
/* Items / list */
.yqgw-price-features { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; text-align: left; }
.yqgw-feat { display: flex; align-items: flex-start; gap: 10px; padding: 12px 0; border-bottom: 1px solid transparent; }
.yqgw-price-features:not(.yqgw-feat-nodiv) .yqgw-feat { border-bottom-color: #eef1e8; }
.yqgw-price-features:not(.yqgw-feat-nodiv) .yqgw-feat:last-child { border-bottom: 0; }
.yqgw-feat-icon-right .yqgw-feat { flex-direction: row-reverse; }
.yqgw-feat-icon { flex: 0 0 auto; line-height: 1.4; font-weight: 700; }
.yqgw-feat-icon i, .yqgw-feat-icon svg { width: 1em; height: 1em; }
.yqgw-feat-on .yqgw-feat-icon { color: #2c682c; }
.yqgw-feat-off .yqgw-feat-icon { color: #cf5151; }
.yqgw-feat-off .yqgw-feat-text { opacity: .6; }
.yqgw-feat-main { flex: 1; min-width: 0; }
.yqgw-feat-line { display: flex; align-items: flex-end; gap: 8px; }
.yqgw-feat-text { flex: 1; color: #41513a; }
.yqgw-feat-has-dots .yqgw-feat-text { flex: 0 1 auto; }
.yqgw-feat-dots { flex: 1; min-width: 16px; border-bottom: 1px dotted #c7cdbb; margin-bottom: 4px; }
.yqgw-leader-top .yqgw-feat-line { align-items: flex-start; }
.yqgw-leader-top .yqgw-feat-dots { margin-bottom: 0; margin-top: 6px; }
.yqgw-leader-middle .yqgw-feat-line { align-items: center; }
.yqgw-leader-middle .yqgw-feat-dots { margin-bottom: 0; }
.yqgw-leader-bottom .yqgw-feat-line { align-items: flex-end; }
.yqgw-feat-value { flex: 0 0 auto; color: #1e4d1e; font-weight: 700; white-space: nowrap; }
.yqgw-feat-desc { color: #7a8a66; font-size: .88em; margin-top: 3px; line-height: 1.45; }
/* Badges */
.yqgw-feat-badge { display: inline-flex; align-items: center; justify-content: center; margin-left: 6px; padding: 1px 6px; font-size: 11px; font-weight: 700; line-height: 1.4; border-radius: 4px; background: #1f1f1f; color: #fff; vertical-align: middle; }
/* Legend */
.yqgw-price-legend { display: flex; flex-wrap: wrap; gap: 14px; }
.yqgw-legend-stacked { flex-direction: column; flex-wrap: nowrap; }
.yqgw-legend-item { display: inline-flex; align-items: center; }
.yqgw-legend-item .yqgw-feat-badge { margin-left: 0; margin-right: 6px; }
.yqgw-legend-label { color: #41513a; font-size: .85em; }
/* Button / footer */
.yqgw-price-btn { display: inline-block; background: #2c682c; color: #fff; text-decoration: none; padding: 13px 26px; border-radius: 4px; font-weight: 600; transition: background .25s ease, color .25s ease; }
.yqgw-price-footer { color: #7a8a66; font-size: .82em; line-height: 1.5; }
/* Inline layout */
.yqgw-pl-inline { text-align: left; }
.yqgw-pl-inline .yqgw-price-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.yqgw-pl-inline .yqgw-price-amount-wrap { align-items: flex-end; flex: 0 0 auto; }
.yqgw-pl-inline .yqgw-price-amount { font-size: 30px; }
.yqgw-pl-inline .yqgw-price-currency { font-size: 18px; }
.yqgw-pl-inline .yqgw-price-header { flex: 1; }

/************************************************************************************************/
/* YQG Tabs / Accordion */
.yqgw-tabs-nav { display: flex; flex-wrap: wrap; gap: 6px; position: relative; }
.yqgw-tab-title, .yqgw-acc-header { display: inline-flex; align-items: center; gap: 8px; border: none; cursor: pointer; background: #f4f7da; color: var(--yqgw-tt, #41513a); font: inherit; line-height: 1.2; position: relative; z-index: 1; transition: background .25s ease, color .25s ease, transform .25s ease, box-shadow .25s ease; }
.yqgw-tab-ic { display: inline-flex; line-height: 0; }
.yqgw-tab-ic i, .yqgw-tab-ic svg { width: 1em; height: 1em; }

/* Sliding indicator */
.yqgw-tabs-indicator { position: absolute; z-index: 0; pointer-events: none; background: #e0a81c; transition: transform .3s ease, width .3s ease, height .3s ease; }
.yqgw-ind-line-bottom .yqgw-tabs-indicator { left: 0; bottom: 0; height: 3px; }
.yqgw-ind-line-top .yqgw-tabs-indicator { left: 0; top: 0; height: 3px; }
.yqgw-ind-background .yqgw-tabs-indicator { left: 0; top: 0; height: 100%; }
.yqgw-has-ind.yqgw-ind-background .yqgw-tab-title { background: transparent !important; }
.yqgw-tabs-v .yqgw-tabs-indicator { left: auto; }
.yqgw-ind-line-bottom .yqgw-tabs-indicator, .yqgw-ind-line-top .yqgw-tabs-indicator { z-index: 2; }
.yqgw-ind-line-bottom .yqgw-tabs-indicator { bottom: var(--yqgw-ind-offset, 0px); }
.yqgw-ind-line-top .yqgw-tabs-indicator { top: var(--yqgw-ind-offset, 0px); }
/* Active / current text colors */
.yqgw-tab-title.is-active, .yqgw-acc-header.is-active { color: var(--yqgw-tt-active, #fff); }
/* Background indicator: contrast follows the indicator's current tab, not the stuck active one */
.yqgw-ind-background .yqgw-tab-title { color: var(--yqgw-tt, #41513a); }
.yqgw-ind-background .yqgw-tab-title.yqgw-tab-hot { color: var(--yqgw-tt-active, #fff); }

/* Content panels + animations */
.yqgw-tabs-body { position: relative; }
.yqgw-tab-panel { display: none; --yqgw-anim-dur: .4s; }
.yqgw-tab-panel.is-active { display: block; }
.yqgw-anim-fade .yqgw-tab-panel.is-active { animation: yqgwTabFade var(--yqgw-anim-dur) ease; }
.yqgw-anim-slide-up .yqgw-tab-panel.is-active { animation: yqgwTabUp var(--yqgw-anim-dur) ease; }
.yqgw-anim-slide-down .yqgw-tab-panel.is-active { animation: yqgwTabDown var(--yqgw-anim-dur) ease; }
.yqgw-anim-slide-left .yqgw-tab-panel.is-active { animation: yqgwTabLeft var(--yqgw-anim-dur) ease; }
.yqgw-anim-zoom .yqgw-tab-panel.is-active { animation: yqgwTabZoom var(--yqgw-anim-dur) ease; }
@keyframes yqgwTabFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes yqgwTabUp { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes yqgwTabDown { from { opacity: 0; transform: translateY(-14px); } to { opacity: 1; transform: none; } }
@keyframes yqgwTabLeft { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: none; } }
@keyframes yqgwTabZoom { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: none; } }

/* Nav positions */
.yqgw-tabs-h { display: flex; flex-direction: column; }
.yqgw-tabs-h.yqgw-navpos-bottom { flex-direction: column-reverse; }
.yqgw-tabs-v { display: flex; align-items: flex-start; }
.yqgw-tabs-v.yqgw-navpos-right { flex-direction: row-reverse; }
.yqgw-tabs-v .yqgw-tabs-nav { flex-direction: column; }
.yqgw-tabs-v .yqgw-tab-title { width: 100%; justify-content: flex-start; }
.yqgw-tabs-v .yqgw-tabs-body { flex: 1; }

/* Title hover effects */
.yqgw-th-lift .yqgw-tab-title:hover { transform: translateY(-2px); }
.yqgw-th-scale .yqgw-tab-title:hover { transform: scale(1.06); }
.yqgw-th-glow .yqgw-tab-title:hover { box-shadow: 0 4px 14px rgba(44,104,44,.25); }
.yqgw-th-underline .yqgw-tab-title::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 6px; height: 2px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.yqgw-th-underline .yqgw-tab-title:hover::after { transform: scaleX(1); }

/* Accordion */
.yqgw-accordion .yqgw-acc-item { margin-bottom: 6px; }
.yqgw-acc-header { width: 100%; justify-content: space-between; text-align: left; }
.yqgw-acc-ip-left .yqgw-acc-header { flex-direction: row-reverse; justify-content: flex-end; gap: 12px; }
.yqgw-acc-header .yqgw-tab-tx { flex: 1; }
.yqgw-acc-panel { height: 0; overflow: hidden; transition: height .3s ease; background: #fff; }
.yqgw-acc-arrow { flex: 0 0 auto; width: 10px; height: 10px; position: relative; box-sizing: border-box; transition: transform .3s ease; color: #e0a81c; }
.yqgw-acc-ic-chevron .yqgw-acc-arrow { border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); }
.yqgw-acc-ic-chevron .yqgw-acc-header.is-active .yqgw-acc-arrow { transform: rotate(-135deg); }
.yqgw-acc-ic-arrow .yqgw-acc-arrow { border-right: 2px solid currentColor; border-top: 2px solid currentColor; transform: rotate(45deg); }
.yqgw-acc-ic-arrow .yqgw-acc-header.is-active .yqgw-acc-arrow { transform: rotate(135deg); }
.yqgw-acc-ic-plus .yqgw-acc-arrow { width: 14px; height: 14px; }
.yqgw-acc-ic-plus .yqgw-acc-arrow::before, .yqgw-acc-ic-plus .yqgw-acc-arrow::after { content: ""; position: absolute; background: currentColor; }
.yqgw-acc-ic-plus .yqgw-acc-arrow::before { left: 0; right: 0; top: 50%; height: 2px; transform: translateY(-50%); }
.yqgw-acc-ic-plus .yqgw-acc-arrow::after { top: 0; bottom: 0; left: 50%; width: 2px; transform: translateX(-50%); transition: transform .3s ease, opacity .3s ease; }
.yqgw-acc-ic-plus .yqgw-acc-header.is-active .yqgw-acc-arrow::after { transform: translateX(-50%) scaleY(0); opacity: 0; }

@media (max-width: 767px) {
	.yqgw-tabs-v { flex-direction: column; }
	.yqgw-tabs-v .yqgw-tabs-nav { max-width: 100%; flex-basis: auto; }
	.yqgw-tabs-v .yqgw-tab-title { width: 100%; }
}

/**/
/* Button hover: split / reveal / 3D / misc */
.yqgw-btn-wrap { perspective: 900px; }
.yqgw-bh-split-v .yqgw-btn-bg { opacity: 1; clip-path: inset(50% 0 50% 0); }
.yqgw-bh-split-v:hover .yqgw-btn-bg { clip-path: inset(0 0 0 0); }
.yqgw-bh-split-h .yqgw-btn-bg { opacity: 1; clip-path: inset(0 50% 0 50%); }
.yqgw-bh-split-h:hover .yqgw-btn-bg { clip-path: inset(0 0 0 0); }
.yqgw-bh-iris-corner .yqgw-btn-bg { opacity: 1; clip-path: circle(0% at 0 0); }
.yqgw-bh-iris-corner:hover .yqgw-btn-bg { clip-path: circle(150% at 0 0); }
.yqgw-bh-zoom-bg .yqgw-btn-bg { opacity: 1; transform: scale(0); transform-origin: center; }
.yqgw-bh-zoom-bg:hover .yqgw-btn-bg { transform: scale(1); }
.yqgw-bh-rotate-x:hover { transform: rotateX(12deg); }
.yqgw-bh-rotate-y:hover { transform: rotateY(12deg); }
.yqgw-bh-jelly:hover { animation: yqgwBtnJelly .6s ease; }
.yqgw-bh-jelly:hover .yqgw-btn-bg { opacity: 1; }
@keyframes yqgwBtnJelly { 0%,100% { transform: scale(1,1); } 30% { transform: scale(1.1,.9); } 50% { transform: scale(.92,1.08); } 70% { transform: scale(1.04,.96); } }
.yqgw-bh-underline .yqgw-btn-content { position: relative; }
.yqgw-bh-underline .yqgw-btn-content::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 2px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .3s ease; }
.yqgw-bh-underline:hover .yqgw-btn-content::after { transform: scaleX(1); }
