/*
Theme Name: Starter
Author: starter
Author URI:
Description: Just another starter theme.
Version: 1.0
License: (c) Copyright of starter. All Rights Reserved.
Text Domain: starter 
*/





.wow {
    visibility: hidden;
}

.pipe {
	color: #45C0EE;
}

.ajax-search-trigger {
	font-weight: 300;
	color: var(--blue) !important;
}

	.return {
		padding: 0px 30px 60px;
		box-sizing: border-box;
		background-color: #FAFBFB;
	}
	
	.return .btn-main {
		width: fit-content;
		text-align: center;
		margin: 0 auto;
	}
	
	@media (max-width: 600px) {
		.return {
			padding: 0 20px 30px;
		}
	}

.translate-button {
	width: 75px;
	position: relative;
	/* 	display: flex;
	align-items: center; */
	height: 25px;
	margin-left: 20px;
}
.gt_float_switcher .gt-selected .gt-current-lang {
	padding:0 !important;
}
.gt_float_switcher .gt-selected .gt-current-lang span.gt-lang-code {
	display: none;
}

.gt_float_switcher {
	overflow: visible !important;
	/* 	transition: none !important; */
	background: transparent !important;
}

.translate-button .gtranslate_wrapper {
	position: absolute;
}
.gt_float_switcher .gt_options {
transform: translateX(-50px) !important;
}
.gt_float_switcher .gt_options.gt-open {
	/* 	position: absolute; */
	/* 	background-color: #fff; */
}

.gt_float_switcher .gt_options a {
	background-color: #fff;
	transition: none !important;
	display: flex !important;
	width: 100%;
	font-size: 16px;
}

.gt_float_switcher .gt_options {
	/* 	transition: none !important; */
	overflow: visible !important;
}

.gt_float_switcher {
	box-shadow: none !important;
}

.gt_float_switcher .gt-selected .gt-current-lang span.gt_float_switcher-arrow.gt_arrow_rotate {
	transform: rotate(-180deg) !important;
}

.gt_float_switcher .gt-selected .gt-current-lang span.gt_float_switcher-arrow {
	transform: rotate(0deg) !important;
}

.gt_float_switcher img {
	width: 27px !important;
}

@media (max-width: 500px) {
	.gt_float_switcher .gt-selected .gt-current-lang span.gt-lang-code {
		display: none;
	}

	.translate-button {
		width: 90px;
	}

	header .header-right .header-misc {
		position: relative;
		right: -15px;
	}
	
	.gt_float_switcher img {
		width: 27px !important;
	}
}
@media (max-width: 380px) {
	/* 	header .header-right .header-misc .search-icon {
	display: none;
} */

	.translate-button {
		width: 90px;
	}

	header .header-right .header-misc {
		margin-left: 15px !important;
	}
	
}

/* ==========================================================================
   FAQ Section
   ========================================================================== */

.faq {
    padding: 80px 0;
}

.faq.no-top-padding {
    padding-top: 0;
}

.faq.no-bottom-padding {
    padding-bottom: 0;
}

.faq-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
}

/* Inner wrapper — two-column layout */
.faq .faq-inner {
    display: flex;
    align-items: flex-start;
    gap: 60px;
}

/* ---------- Left column (title + underline) ---------- */
.faq .faq-left {
    width: 280px;
    min-width: 280px;
    padding-top: 10px;
}

.faq .faq-left .title h2 {
    color: var(--blue);
    line-height: 1.3;
}

.faq .faq-underline {
    width: 60px;
    height: 3px;
    background-color: var(--cyan);
    margin-top: 18px;
    border-radius: 2px;
}

/* ---------- Right column (accordion) ---------- */
.faq .faq-right {
    flex: 1;
}

.faq .accordion {
    list-style: none;
    padding: 0;
    margin: 0;
}

.faq .accordion .set {
    border: 1px solid #dde3ea;
    border-radius: 6px;
    margin-bottom: 12px;
    overflow: hidden;
    transition: box-shadow 0.3s ease;
	padding: 0;
}

.faq .accordion .set:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* Accordion title */
.faq .accordion-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    margin: 0;
    cursor: pointer;
    font-size: 22px;
    font-weight: 400;
    color: var(--blue);
    transition: background-color 0.3s ease;
    user-select: none;
}

.faq .accordion-title:hover {
    background-color: #f7f9fb;
}

/* Icon wrapper */
.faq .faq-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    margin-left: 16px;
}

.faq .faq-icon i {
    font-size: 18px;
    color: #8e99a4;
    transition: transform 0.35s ease, color 0.3s ease;
    transform: rotate(45deg);
}

/* Active state — icon rotates to X */
.faq .accordion-title.active .faq-icon i {
    transform: rotate(0deg);
    color: var(--blue);
}

/* Accordion content */
.faq .accordion-content {
    padding: 0 24px 22px;
    font-size: 15px;
    line-height: 1.7;
    color: #5a6270;
}

.faq .accordion-content p {
    margin: 0 0 12px;
}

.faq .accordion-content p:first-of-type {
	padding-top: 0px;
}

.faq .accordion-content p:last-child {
    margin-bottom: 0;
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1024px) {
    .faq .faq-inner {
        gap: 40px;
    }

    .faq .faq-left {
        width: 220px;
        min-width: 220px;
    }
}

@media (max-width: 600px) {
    .faq {
        padding: 50px 0;
    }

    .faq-container {
        padding: 0 20px;
    }

    .faq .faq-inner {
        flex-direction: column;
        gap: 30px;
    }

    .faq .faq-left,
	.faq .faq-right {
        width: 100%;
        min-width: unset;
    }

    .faq .accordion-title {
        padding: 16px 18px;
        font-size: 16px;
    }

    .faq .accordion-content {
        padding: 0 18px 18px;
        font-size: 14px;
    }
}
/* Text Block Section
   =================== */

.text-block {
    padding: 60px 30px;
    position: relative;
    box-sizing: border-box;
/* 	background-color: #fff; */
}
.text-block.no-top-padding {
    padding-top: 0px;
}
.text-block.no-bottom-padding {
    padding-bottom: 0px;
}

.text-block-container {
    max-width: 1280px;
    margin: 0 auto;

    text-align: center;
}

/* Subtitle (eyebrow text) */
.text-block .subtitle {
    margin-bottom: 12px;
}

.text-block .subtitle h3 {
    font-size: 18px;
    font-weight: 500;
    text-transform: none;
}

/* Title */
.text-block .title {
    margin-bottom: 20px;
}

.text-block .title h2 {
    font-size: 32px;
    font-weight: 400;
    line-height: 1.3;
}

/* Text / WYSIWYG */
.text-block .text {
    /*     max-width: 900px; */
    margin: 0 auto 30px;
    font-size: 15px;
    line-height: 1.7;
    color: #555;
}

.text-block .text p {
    margin: 0 0 12px;
}
.text-block .text p:first-of-type {
	padding-top: 0px;
}
.text-block .text p:last-child {
    margin-bottom: 0;
}

/* Button */
.text-block .a-button {
    margin-bottom: 20px;
}

.text-block .a-button a.btn-main {
    display: inline-block;
    min-width: 160px;
    padding: 12px 28px;
    font-size: 15px;
    font-weight: 500;
    border-radius: 6px;
}

.text-block .a-button a.btn-main i {
    margin-left: 6px;
    font-size: 12px;
}

/* Logos Repeater */
.text-block .logos-repeater {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
}

.text-block .logos-track {
    display: flex;
    align-items: center;
}

.text-block .logos-set {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 30px;
}

.text-block .logos-set.duplicate {
    display: none;
}

.text-block .logo-item {

    flex-shrink: 0;
}

.text-block .logo-item img {
    max-width: 100%;
    height: auto;
    max-height: 82px;
    max-width: 140px;
    object-fit: contain;
}

.text-block.left-align {
    text-align: left;
}

.text-block.left-align .title,
.text-block.left-align .subtitle,
.text-block.left-align .text,
.text-block.left-align .a-button {
    text-align: left;
}

.text-block.left-align .title-underline,
.text-block.left-align .subtitle-underline {
    margin-left: 0;
    margin-right: auto;
}

/* Responsive Styles */
@media (max-width: 1200px) {
    .text-block .title h2 {
        font-size: 28px;
    }
}

@media (max-width: 991px) {
    .text-block {
        padding: 50px 30px;
    }

    .text-block .title h2 {
        font-size: 26px;
    }

    .text-block .text {
        font-size: 14px;
    }
}

@media (max-width: 768px) {
    .text-block {
        padding: 40px 0;
    }



    .text-block .title h2 {
        font-size: 24px;
    }

    .text-block .subtitle h3 {
        font-size: 16px;
    }
}

/* Mobile Infinite Marquee for Logos */
@media (max-width: 600px) {
    .text-block .logos-repeater {
        overflow: hidden;
        mask-image: linear-gradient(to right, transparent 0%, #000 10%, #000 90%, transparent 100%);
        -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 10%, #000 90%, transparent 100%);
    }

    .text-block .logos-track {
        flex-wrap: nowrap;
        gap: 0;
        will-change: transform;
    }

    .text-block .logos-set {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 32px;
        flex-shrink: 0;
        padding-right: 32px;
    }

    .text-block .logos-set.duplicate {
        display: flex;
    }

    .text-block .logo-item {
        max-width: 80px;
    }

    .text-block {
        padding: 30px 20px;
    }
	
	.text-block .logo-item img {
		max-width: 80px !important;
	}
}

@media (max-width: 480px) {
    .text-block .title h2 {
        font-size: 22px;
    }
}


.related-posts {
    padding: 50px 30px;
	box-sizing: border-box;
}

.related-posts-container {
    max-width: 1280px;
    margin: 0 auto;
 
}

.related-posts .title {
    margin-bottom: 20px;
}

.related-posts .items {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

.related-posts .item {
    display: flex;
    gap: 40px;
    /*     width: calc(50% - 30px); */
    box-sizing: border-box;
	width: 100%;
}

.related-posts .item .post-thumbnail {
    width: 35%;
    min-width: 35%;
    max-width: 35%;
    flex-shrink: 0;
    border-radius: 8px;
    overflow: hidden;
    height: 260px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.related-posts .item .post-thumbnail a {
	height: 100%;
	width: 100%;
}

.related-posts .item .post-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

.related-posts .item .post-thumbnail:hover img {
    transform: scale(1.05);
}

.related-posts .item .post-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 50%;
}

.related-posts .item .item-title h3 {
    font-size: 22px;
    font-weight: 400;

    margin-bottom: 15px;
}

.related-posts .item .item-title h3 a {
    color: var(--black);
    text-decoration: none;
}

.related-posts .item .text {
    font-size: 14px;
    line-height: 1.6;
    color: var(--grey);
    margin-bottom: 20px;
}

.related-posts .item .text p {
    margin: 0;
}

.related-posts .item .text p:first-of-type {
	padding-top: 0px;
}

.related-posts .item .a-button a.btn-main.outline {
	display: block;
	max-width: 180px;
	padding: 12px 20px;
	font-size: 16px;
	font-weight: 400;
	color: var(--blue);
	background: transparent;
	border: 1px solid var(--blue);
	border-radius: 5px;
	text-align: center;
	text-decoration: none;
	transition: all 0.3s ease;
	cursor: pointer;
	font-family: inherit;
}

.related-posts .item .a-button a.btn-main.outline i {
    margin-left: 6px;
    font-size: 12px;
}

.related-posts .item .a-button a.btn-main.outline:hover {
    background-color: var(--blue);
	color: var(--white);
}

/* Responsive */
@media (max-width: 1024px) {
    .related-posts .item {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .related-posts {
        padding: 50px 30px;
    }

    .related-posts .item {
        flex-direction: column;
        gap: 20px;
    }

    .related-posts .item .post-thumbnail {
        width: 100%;
		min-width: 100%;
		max-width: 100%;
    }

    .related-posts .item .post-content {
        width: 100%;
    }

    .related-posts .item .item-title h3 {
        font-size: 18px;
    }
}
@media (max-width: 600px) {
    .related-posts {
        padding: 30px 20px;
    }
	
	.related-posts .item .post-thumbnail img {
		max-height: 240px;
	}
}
@media (max-width: 480px) {
    .related-posts .title h2 {
        font-size: 22px;
    }
	.related-posts .item .a-button a.btn-main.outline {
		max-width: none;
	}
}



/* Map Section */
.map {
    padding: 80px 0;
}

.map .map-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 30px;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    align-items: center;
	border-radius: 10px;
	overflow: hidden;
}

.map .left {
    width: calc(25% - 40px);
}

.map .right {
    width: 75%;
	border-radius: 10px;
	overflow: hidden;
}

/* Title */
.map .title {
    margin-bottom: 30px;
}

.map .title h2 {
    font-size: 32px;
    font-weight: 400;
    color: var(--black);
}

/* Office list */
.map .offices-list {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

/* Region name */
.map .office-region h3 {
    font-size: 22px;
    font-weight: 400;
    margin-bottom: 10px;
	color: var(--blue);
}

/* Address */
.map .office-address {
    font-size: 15px;
    line-height: 1.6;
    color: #333;
    margin-bottom: 12px;
}

.map .office-address p {
    margin: 0;
    line-height: 1.6;
	font-size: 22px;
	color: var(--black);
}

.map .office-address p:first-of-type {
	padding-top: 0;
}

/* Opening hours */
.map .office-hours {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.map .hours-row {
    display: flex;
    gap: 15px;
    font-size: 13px;
}

.map .hours-label {
    min-width: 120px;
	color: var(--blue);
}

.map .hours-value {
    color: var(--cyan);
}

/* Map embed */
.map .map-embed {
    width: 100%;
    height: 100%;
    min-height: 725px;
    border-radius: 4px;
    overflow: hidden;
}

/* Custom marker labels */
.map-marker-label {
    font-size: 12px;
    font-weight: 500;
    color: #333;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 4px;
}

.map-marker-label .marker-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: 2px solid #333;
    background: transparent;
}

/* Responsive */
@media (max-width: 991px) {
    .map .map-container {
        flex-direction: column;
    }

    .map .left {
        width: 100%;
    }

    .map .right {
        width: 100%;
    }

    .map .map-embed {
        min-height: 350px;
    }
}

@media (max-width: 600px) {
    .map {
        padding: 50px 0;
    }

    .map .map-embed {
        min-height: 280px;
    }

    .map .hours-row {
        font-size: 12px;
    }

    .map .hours-label {
        min-width: 110px;
    }
	
	.map .office-address p {
		font-size: 18px;
	}
}

/* Scope all CSS to .text-left-links-right-boxed */
.text-left-links-right-boxed {
    padding: 60px 0;
}

.text-left-links-right-boxed-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}

.text-left-links-right-boxed .content-box {
    display: flex;
    flex-wrap: wrap;
    background-color: #ffffff;
    border: 1px solid #dce2e8;
    /* Light grey/blue border matching design */
    border-radius: 8px;
    padding: 60px;
}

/* Layout Columns */
.text-left-links-right-boxed .left {
    width: calc(50% - 20px);
    box-sizing: border-box;
    padding-right: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.text-left-links-right-boxed .right {
    width: calc(50% - 20px);
    margin-left: 40px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Left Side Content */
.text-left-links-right-boxed .subtitle {
    margin-bottom: 15px;
}

.text-left-links-right-boxed .subtitle h3 {
    margin: 0;
    color: #333333;
    font-size: 22px;
    /* Slightly smaller to contrast with h2 */
}

.text-left-links-right-boxed .title {
    margin-bottom: 10px;
}

.text-left-links-right-boxed .title h2 {
    margin: 0;
}

.text-left-links-right-boxed .a-button {
    margin-top: 10px;
    width: fit-content;
}

.text-left-links-right-boxed .a-button.mobile {
	display: none;
}

/* Right Side Links */
.text-left-links-right-boxed .links-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.text-left-links-right-boxed .material-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    background-color: #FAFBFB;
    border: 1px solid #D8E1EE;
    /* Matches the outer box border */
    border-radius: 4px;
    text-decoration: none;
    color: var(--blue);
    /* Blue from global */
    font-size: 16px;
    transition: all 0.3s ease;
}

.text-left-links-right-boxed .material-link i {
    font-size: 18px;
}

.text-left-links-right-boxed .material-link:hover {
    background-color: var(--blue);
    color: #ffffff;
    border-color: #004A99;
}

.text-left-links-right-boxed .left .a-button {
	margin-bottom: 20px;
}

/* Responsive Adjustments */
@media (max-width: 991px) {
    .text-left-links-right-boxed .content-box {
        padding: 40px 30px;
    }

    .text-left-links-right-boxed .left,
    .text-left-links-right-boxed .right {
        width: 100%;
        margin-left: 0;
        padding-right: 0;
    }

    .text-left-links-right-boxed .left {
        margin-bottom: 0px;
    }
}

@media (max-width: 600px) {
    .text-left-links-right-boxed .content-box {
        padding: 30px 20px;
    }

    .text-left-links-right-boxed .subtitle h3 {
        font-size: 18px;
    }
	.text-left-links-right-boxed .left .a-button {
		display: none;
	}
	.text-left-links-right-boxed .a-button.mobile {
		display: block;
		margin-top: 20px;
		width: 100%;
	}
}

/* Items Section */

.items-section {
    padding: 80px 0;
}
.items-section.no-top-padding {
	padding-top: 0px;
}
.items-section.no-bottom-padding {
	padding-bottom: 0px;
}
.items-section-container {
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 30px;
    box-sizing: border-box;
}

.items-section .subtitle {
    margin-bottom: 10px;
}

.items-section .subtitle h3 {
    font-size: 18px;
    font-weight: 500;
}

.items-section .title {
    margin-bottom: 10px;
    position: relative;
    padding-bottom: 20px;
}

.items-section .title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 80px;
    height: 2px;
    background-color: var(--cyan);
}

.items-section .title h2 {
    color: var(--blue);
}
.items-section .heading {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 30px;
	gap: 20px;
}
.items-section .a-button a.btn-link {
	display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s ease;
    padding: 12px 20px;
    border: 1px solid #004A99;
    border-radius: 5px;
	white-space: nowrap;
}
.items-section .a-button a.btn-link:hover {

	background-color: #004A99;
	color: #fff;
}


.items-section .a-button.mobile {
	display: none;
}
.items-section .items {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.items-section .item {
    flex: 1 1 calc(25% - 20px);
    background-color: #FFFFFF;
    border-radius: 10px;
    padding: 30px 25px;
    border: 1px solid #D8E1EE;
    transition: all 0.3s ease;
    box-sizing: border-box;
}

.items-section .item:hover {
/*     border-left-color: #004A99;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); */
}

.items-section .item-icon {
    margin-bottom: 20px;
}

.items-section .item-icon i {
    font-size: 62px;
    color: var(--blue);
}

.items-section .item-title {}

.items-section .item-title h3 {
    font-size: 22px;
    font-weight: 400;
    color: var(--blue);
}

.items-section .text {
    font-size: 14px;
    line-height: 1.6;
    color: #555;
}

.items-section .text p {
    margin: 0;
}

/* Responsive */

@media (max-width: 1024px) {
    .items-section .item {
        flex: 1 1 calc(50% - 10px);
    }
}

@media (max-width: 600px) {
    .items-section {
        padding: 50px 0;
    }

    .items-section .items {
        flex-direction: column;
    }

    .items-section .item {
        width: 100%;
    }

    .items-section .title h2 {
        font-size: 22px;
    }

    .items-section .item-icon i {
        font-size: 42px;
    }

    .items-section .item-title h3 {
        font-size: 18px;
    }

    .items-section-container {
        padding: 0 20px;
    }
	
	.items-section .text p {
		font-size: 14px;
	}
	
	
.items-section .a-button.mobile {
	display: block;
	text-align: center;
	margin-top: 20px;
}
		
	.items-section .a-button.mobile a.btn-link {
		justify-content: center;
	}
	
	.items-section .heading .a-button {
		display: none;
	}
}


/* ==========================================================================
   Error Page (404)
   ========================================================================== */

.error-page {

    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 0px 30px 0px;
    box-sizing: border-box;
	margin-bottom: 80px;
}

.error-page .breadcrumb {
    position: absolute;
    top: 30px;
    left: 40px;
}

.error-page .breadcrumb,
.error-page .breadcrumb a {
    color: #ffffff;
    font-size: 14px;
    text-decoration: none;
}

.error-page .breadcrumb .arrow {
    margin: 0 6px;
    color: #ffffff;
}

.error-page-container {
    width: 100%;
	    min-height: 720px;
    max-width: 1560px;
    margin: 0 auto;
    padding: 0 30px;
    position: relative;
	display: flex;
	align-items: center;
}

.error-page-content {
    text-align: center;
    max-width: 950px;
    margin: 0 auto;
}

.error-page-content .subtitle h3 {
    font-size: 20px;
    font-weight: 400;
    margin-bottom: 15px;
}

.error-page-content .title h1 {
    font-size: 56px;
    font-weight: 400;
    color: #ffffff;
    margin-bottom: 20px;
    position: relative;
    display: inline-block;
}

.error-page-content .title h1.underline::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background-color: #FFE800;
    margin: 15px auto 0;
}

.error-page-content .text,
.error-page-content .text p {
    color: #ffffff;
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 35px;
}

.error-page-content .buttons {
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.error-page-content .buttons .a-button {
    display: inline-block;
}

.error-page-content .buttons .btn-main.white-outline {
    background-color: #ffffff;
    color: #004A99;
    border: 2px solid #ffffff;
    padding: 14px 30px;
    font-size: 15px;
    font-weight: 500;
    border-radius: 5px;
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-block;
}

.error-page-content .buttons .btn-main.white-outline:hover {
    background-color: transparent;
    color: #ffffff;
}

/* Responsive
   ========================================================================== */

@media (max-width: 768px) {
    .error-page {
        padding: 0px 0 30px;
    }

    .error-page .breadcrumb {
        top: 20px;
        left: 20px;
    }

    .error-page-content .title h1 {
        font-size: 40px;
    }

    .error-page-content .subtitle h3 {
        font-size: 18px;
    }

    .error-page-content .buttons {
        flex-direction: column;
        align-items: center;
    }

    .error-page-content .buttons .btn-main.white-outline {
        width: 100%;
        max-width: 280px;
    }
	
	.error-page {
		margin-bottom: 40px;
	}
}

@media (max-width: 480px) {
    .error-page-content .title h1 {
        font-size: 32px;
    }
}

/* ============================================
   RESOURCES HUB
   ============================================ */

.resources-hub {
    padding: 80px 30px;
    background-color: #f8f9fa;
    position: relative;
    box-sizing: border-box;
}

.resources-hub.no-top-padding {
    padding-top: 0;
}

.resources-hub.no-bottom-padding {
    padding-bottom: 0;
}

.resources-hub-container {
    max-width: 1530px;
    margin: 0 auto;
    padding: 0 30px;
}

/* Title */
.resources-hub .title {
    margin-bottom: 10px;
}

.resources-hub .text {
    margin-bottom: 30px;
    max-width: 700px;
    font-size: 16px;
    line-height: 1.6;
    color: #555;
}

/* ============================================
   FILTER BAR
   ============================================ */

.resources-filter-bar {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
    /*     padding: 14px 20px; */
    /*     background: #ffffff; */
    border-radius: 12px;
    /*     box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06); */
    flex-wrap: wrap;
}

.resources-filter-bar .filter-label {
    font-size: 14px;
    font-weight: 400;
    color: var(--grey);
    white-space: nowrap;
}

.resources-filter-bar .filter-buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    flex: 1;
}

.resources-filter-bar .filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border: 1px solid #E2E8F0;
    border-radius: 5px;
    background: transparent;
    font-size: 16px;
    font-weight: 400;
    color: var(--black);
    cursor: pointer;
    transition: all 0.25s ease;
    white-space: nowrap;
}

.resources-filter-bar .filter-btn:hover {
    border-color: #004A99;
    color: #004A99;
    background: #f0f5ff;
}

.resources-filter-bar .filter-btn.active {
    background: #004A99;
    color: #fff;
    border-color: #004A99;
}

.resources-filter-bar .filter-btn.active i {
    color: #fff;
}

.resources-filter-bar .filter-btn .fa-scigrip-video-icon {
	margin-right: 5px;
}

.resources-filter-bar .filter-btn i {
    font-size: 13px;
    color: var(--black);
    transition: color 0.25s ease;
}

.resources-filter-bar .filter-btn.active:hover i {
    color: inherit;
}

.resources-filter-bar .filter-btn:hover i {
    color: #004A99;
}



/* ============================================
   RESULTS TOOLBAR (count + sort)
   ============================================ */

.resources-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.resources-toolbar .resources-count {
    font-size: 14px;
    color: #888;
}

.resources-toolbar .sort-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.resources-toolbar .sort-wrapper .sort-icon {
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    color: #333;
    pointer-events: none;
    z-index: 1;
}

.resources-toolbar .sort-wrapper select {
    padding: 12px 24px 12px 44px;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    font-size: 16px;
    font-weight: 400;
    color: var(--black);
    background: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    white-space: nowrap;
    line-height: 1.4;
}

.resources-toolbar .sort-wrapper select:hover {
    border-color: #ccc;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.resources-toolbar .sort-wrapper select:focus {
    outline: none;
    border-color: #004A99;
    box-shadow: 0 0 0 3px rgba(0, 74, 153, 0.1);
}

/* ============================================
   RESOURCE CARDS GRID
   ============================================ */

.resources-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
}

.resource-card {
    width: calc(33.333% - 16px);
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
}

.resource-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 30px rgba(0, 74, 153, 0.12);
}

/* Card hidden for filtering */
.resource-card.hidden {
    display: none !important;
}

/* ============================================
   CARD MEDIA
   ============================================ */

.resource-card-media {
    position: relative;
    height: 200px;
    overflow: hidden;
    background: #f0f2f5;
    /* 	aspect-ratio: 16 / 9; */
}

.resource-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
    display: block;
}

.resource-card:hover .resource-card-media img {
    transform: scale(1.05);
}

/* Icon placeholder when no image */
.resource-icon-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f0f4f8;
}

.resource-icon-placeholder i {
    font-size: 100px;
    opacity: 0.6;
}

/* Icon placeholder color variants */
.resource-icon-placeholder.badge-blue-bg {
    background: #F3E8FF;

}

.resource-icon-placeholder.badge-blue-bg i {
    color: #8200DB;
}

.resource-icon-placeholder.badge-orange-bg {
    background: #DBEAFE;
}

.resource-icon-placeholder.badge-orange-bg i {
    color: #1447E6;
}

.resource-icon-placeholder.badge-teal-bg {
    background: linear-gradient(135deg, #e0f7fa, #b2ebf2);
}

.resource-icon-placeholder.badge-teal-bg i {
    color: #00796b;
}

.resource-icon-placeholder.badge-green-bg {
    background: #DCFCE7;
}

.resource-icon-placeholder.badge-green-bg i {
    color: #2e7d32;
}

.resource-icon-placeholder.badge-coral-bg {
    background: #FFEDD4;
}

.resource-icon-placeholder.badge-coral-bg i {
    color: #CA3500;
}

.resource-icon-placeholder.badge-red-bg {
    background: #FFE2E2;
}

.resource-icon-placeholder.badge-red-bg i {
    color: #C10007;
}

.resource-icon-placeholder.badge-navy-bg {
    background: linear-gradient(135deg, #e3e9f0, #cfd9e6);
}

.resource-icon-placeholder.badge-navy-bg i {
    color: #1a2a44;
}

/* ============================================
   BADGES
   ============================================ */

.resource-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 5px 12px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 400;
    text-transform: capitalize;
    letter-spacing: 0.3px;
    z-index: 2;
    color: #fff;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    text-decoration: none;
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.resource-badge:hover {
    opacity: 0.85;
}

.resource-badge i {
    font-size: 11px;
}

.resource-badge.badge-blue {
    background: #F3E8FF;
    color: #8200DB;
    border: 1px solid #E9D4FF;
}

.resource-badge.badge-orange {
    background: #DBEAFE;
    color: #1447E6;
    border: 1px solid #BEDBFF;
}

.resource-badge.badge-navy {
    background: #1e3a5f;
}

.resource-badge.badge-red {
    background: #FFE2E2;
    color: #C10007;
    border: 1px solid #FFC9C9;
}

.resource-badge.badge-teal {
    background: #0d9488;
}

.resource-badge.badge-coral {
    background: #f97316;
}

.resource-badge.badge-green {
    background: transparent;
    color: #008236;
    border: 1px solid #B9F8CF;
	background-color: #B9F8CF;
}

/* ============================================
   CARD CONTENT
   ============================================ */

.resource-card-content {
    padding: 20px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.resource-card-title {
    font-size: 22px;
    font-weight: 400;
    color: var(--black);
    line-height: 1.4;
    margin: 0 0 10px 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.resource-card-title a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}

.resource-card:hover .resource-card-title a {
    color: #004A99;
}

.resource-card-excerpt {
    font-size: 14px;
    color: #666;
    line-height: 1.55;
    margin-bottom: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1;
}

.resource-card-excerpt p {
    margin: 0;
}

/* ============================================
   CARD META
   ============================================ */

.resource-card-meta {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-top: 14px;

    margin-top: auto;
}

.resource-card-meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 16px;
    color: var(--blue);
    font-weight: 500;
}

.resource-card-meta .meta-date i {
    color: var(--blue);
}

.resource-card-meta .meta-read-time i {
    color: var(--blue);
}

.resource-card-meta .meta-download {
    color: var(--blue);
    font-weight: 400;
    cursor: pointer;
}

.resource-card-meta .meta-download i {
    color: var(--blue);
}

/* ============================================
   VIDEO EMBED
   ============================================ */

.resource-video-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    padding-bottom: 56.25%;
    /* 16:9 aspect ratio */
    height: 0;
    overflow: hidden;
}

.resource-video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Video cards need taller media area */
.resource-card.has-video .resource-card-media {
    height: auto;
    aspect-ratio: 16/9;
}

/* Don't scale video on hover */
.resource-card.has-video:hover {
    transform: none;
}

/* ============================================
   CARD META — Slides link
   ============================================ */

.resource-card-meta .meta-slides {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 16px;
    color: var(--blue);
    font-weight: 400;
    text-decoration: none;
    position: relative;
    z-index: 5;
    transition: color 0.2s ease;
}

.resource-card-meta .meta-slides:hover {
    color: #5b21b6;
}

.resource-card-meta .meta-slides i {
    color: var(--blue);
}

/* ============================================
   CLICKABLE ELEMENTS (title, image, download)
   ============================================ */

.resource-media-link {
    display: block;
}

.resource-media-link img {
    transition: transform 0.3s ease;
}

.resource-media-link:hover img {
    transform: scale(1.03);
}

.resource-card-title a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}

.resource-card-title a:hover {
    color: #004A99;
}

.resource-card-meta .meta-download {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 16px;
    color: var(--blue);
    font-weight: 400;
    text-decoration: none;
    transition: color 0.2s ease;
}

.resource-card-meta .meta-download:hover {
    color: #003070;
}

/* ============================================
   PAGINATION
   ============================================ */

.resources-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 48px;
    padding: 0 20px;
}

.resources-pagination .pagination-btn {
    background: none;
    border: none;
    color: #333;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    padding: 8px 4px;
    transition: color 0.2s ease;
    font-family: inherit;
}

.resources-pagination .pagination-btn:hover:not(:disabled) {
    color: #003087;
}

.resources-pagination .pagination-btn:disabled {
    color: #ccc;
    cursor: default;
}

.resources-pagination .pagination-pages {
    display: flex;
    align-items: center;
    gap: 6px;
}

.resources-pagination .pagination-page {
    min-width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ddd;
    border-radius: 6px;
    background: #fff;
    color: #333;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: inherit;
    padding: 0 4px;
}

.resources-pagination .pagination-page:hover {
    border-color: #003087;
    color: #003087;
}

.resources-pagination .pagination-page.active {
    background: #003087;
    border-color: #003087;
    color: #fff;
    cursor: default;
}

.resources-pagination .pagination-ellipsis {
    min-width: 32px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #999;
    font-size: 16px;
    letter-spacing: 2px;
}

/* ============================================
   EMPTY STATE
   ============================================ */

.resources-empty {
    text-align: center;
    padding: 60px 20px;
    color: #999;
    font-size: 16px;
    display: none;
}

.resources-empty.visible {
    display: block;
}

.resources-empty i {
    font-size: 48px;
    color: #ddd;
    display: block;
    margin-bottom: 16px;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 1200px) {
    .resources-filter-bar .filter-buttons {
        gap: 5px;
    }

    .resources-filter-bar .filter-btn {
        padding: 7px 12px;
        font-size: 12px;
    }
}

@media (max-width: 991px) {
    .resources-hub {
        padding: 60px 0;
    }

    .resource-card {
        width: calc(50% - 12px);
    }
}

@media (max-width: 768px) {
    .resources-hub {
        padding: 50px 0;
    }

    .resources-hub-container {
        padding: 0 20px;
    }

    .resources-filter-bar {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .resources-filter-bar .filter-buttons {
        gap: 8px;
    }

    .resources-filter-bar .filter-btn {
        padding: 8px 14px;
        font-size: 14px;
    }

    .resource-card {
        width: 100%;
    }

    .resource-card-media {
        height: 180px;
    }

    .resources-grid {
        gap: 16px;
    }

    .resources-pagination {
        gap: 4px;
    }

    .resources-pagination .pagination-page {
        min-width: 36px;
        height: 36px;
        font-size: 13px;
    }

    .resources-pagination .pagination-ellipsis {
        min-width: 24px;
        height: 36px;
    }

    .resources-pagination .pagination-btn {
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .resources-hub {
        padding: 40px 0;
    }

    .resource-card-content {
        padding: 16px;
    }

    .resource-card-title {
        font-size: 15px;
    }

    .resource-card-meta {
        flex-wrap: wrap;
        gap: 8px;
    }

    .resources-pagination .pagination-page {
        min-width: 32px;
        height: 32px;
        font-size: 12px;
    }

    .resources-pagination .pagination-ellipsis {
        min-width: 20px;
        height: 32px;
        font-size: 14px;
    }
}
/* ========================================
   CPT Items Section
   ======================================== */

.cpt-items {
    padding: 60px 30px;
    box-sizing: border-box;
}

.cpt-items.no-top-padding {
    padding-top: 0;
}

.cpt-items.half-width-text .text {
    max-width: 50%;
}
.cpt-items-container {
    max-width: 1530px;
    margin: 0 auto;

}

/* ── Title ── */
.cpt-items .heading {
    margin-bottom: 30px;
}

.cpt-items .title h2 {
    font-size: 32px;
    font-weight: 400;
    line-height: normal;
}
.cpt-items .title p {
	
}
/* ── Grid ── */
.cpt-items .cpt-items-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 40px 30px;

margin-top: 20px;
}

/* ── Card (shared) ── */
.cpt-items .cpt-item-card {
    width: calc(50% - 15px);
    display: flex;
    flex-direction: column;
}

.cpt-items.three-column .cpt-item-card {
    width: calc(33.333% - 20px);
}

.cpt-items.image-contain .cpt-item-image img {
    object-fit: contain;
    height: auto;
	height: 300px;
	background-color: #fff;
	padding: 20px;
	box-sizing: border-box;
}

/* ── Image ── */
.cpt-items .cpt-item-image {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    margin-bottom: 16px;
}

.cpt-items .cpt-item-image a {
    display: block;
    line-height: 0;
}

.cpt-items .cpt-item-image img {
    width: 100%;
    height: 505px;
    object-fit: cover;
    border-radius: 8px;
    transition: transform 0.4s ease;
	display: block;
}

.cpt-items .cpt-item-image:hover img {
    transform: scale(1.03);
}

/* ── Content ── */
.cpt-items .cpt-item-content {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.cpt-items.subpages-layout .cpt-item-content {
	padding: 0 20px;
	box-sizing: border-box;
}

/* ── Title ── */
.cpt-items .cpt-item-title {
/*     margin-bottom: 8px; */
}

.cpt-items .cpt-item-title h2 {
    font-size: 32px;
    font-weight: 400;
    line-height: 1.3;
}

.cpt-items .cpt-item-title h2 a {
    color: var(--blue);
    text-decoration: none;
    transition: color 0.3s ease;
}

.cpt-items .cpt-item-title h2 a:hover {
    color: #003570;
}

.cpt-items .cpt-item-title h3 {
	font-size: 22px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--blue);
}

.cpt-items .cpt-item-title h3 a {
    color: var(--blue);
    text-decoration: none;
    transition: color 0.3s ease;
}

.cpt-items .cpt-item-title h3 a:hover {
    color: #004A99;
}

/* ── Text ── */
.cpt-items .cpt-item-text {
    font-size: 14px;
    line-height: 1.6;
    color: #555;
    margin-bottom: 16px;
}

.cpt-items .cpt-item-text p {
    margin: 0;
}

/* ── Buttons (Overview layout) ── */
.cpt-items .cpt-item-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
/*     margin-top: auto; */
}

.cpt-items .cpt-item-buttons .a-button {
    display: inline-flex;
}

.cpt-items .btn-outline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 35px;
    font-size: 14px;
    font-weight: 400;
    color: #004A99;
    background-color: transparent;
    border: 1px solid #004A99;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    white-space: nowrap;
	width: fit-content;
	min-width: 0;
	min-width: 167px;
	justify-content: center;
}

.cpt-items .btn-outline:hover {
    background-color: #004A99;
    color: #fff;
}

.cpt-items .btn-outline i {
    font-size: 12px;
    transition: transform 0.3s ease;
}

.cpt-items .btn-outline:hover i {
    transform: translateX(3px);
}

/* ── Overview Card bottom border ── */
.cpt-items .overview-card {
    padding-bottom: 30px;

}

/* ── Subpages Layout ── */
.cpt-items.subpages-layout .cpt-item-card {
    width: calc(50% - 15px);
}

.cpt-items.subpages-layout .cpt-item-title h3 {
    font-size: 22px;
    font-weight: 400;
}

.cpt-items.subpages-layout .cpt-item-text {
    font-size: 14px;
    color: var(--gray);
}

/* ========================================
   Responsive
   ======================================== */

@media (max-width: 1024px) {
    .cpt-items .cpt-item-image img {
        height: 220px;
    }
}

@media (max-width: 768px) {
    .cpt-items {
        padding: 40px 30px;
    }

    .cpt-items .cpt-items-grid {
        gap: 20px 20px;


		border-radius: 8px 8px 8px 8px;
	
		overflow: hidden;
	}

	.cpt-items .cpt-item-image img,
	.cpt-items .cpt-item-image {
		border-radius: 8px;
	}

    .cpt-items .cpt-item-card,
	.cpt-items.three-column .cpt-item-card {
        width: 100%;
    }

    .cpt-items.subpages-layout .cpt-item-card {
        width: 100%;
    }

    .cpt-items .cpt-item-image img {
        height: 220px;
    }

    .cpt-items .title h2 {
        font-size: 26px;
    }

    .cpt-items .cpt-item-title h2 {
        font-size: 20px;
    }

    .cpt-items .cpt-item-buttons {
        gap: 8px;
    }

    .cpt-items .btn-outline {
        padding: 14px 14px;
        font-size: 13px;
    }
	
	.cpt-items.half-width-text .text {
		max-width: none;
	}
	
	.cpt-items.subpages-layout .cpt-item-content {
		padding: 0;
	}
}


@media (max-width: 600px) {
    .cpt-items {
        padding: 30px 20px;
    }
	
	.cpt-items .btn-outline  {
		min-width: 100%;
	}
	.cpt-items .cpt-item-buttons .a-button {
		flex: 1 1 calc(50% - 8px);
		max-width: calc(50% - 4px);
	}
}

@media (max-width: 480px) {
    .cpt-items .cpt-item-image img {
        height: 180px;
    }

    .cpt-items .cpt-item-buttons {
        flex-wrap: wrap;
    }
}

/* ========================================
   PRODUCT HERO SECTION
   ======================================== */

.product-hero {
    background: var(--SCIGRIP-LINEAR, linear-gradient(360deg, #FAFBFB 1.38%, #004A99 69.86%));
    padding: 40px 0 80px;
    position: relative;
}

.product-hero-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 40px;
}

/* ----------------------------------------
   BREADCRUMB
   ---------------------------------------- */

.product-hero .breadcrumb {
    margin-bottom: 40px;
}

.product-hero .breadcrumb,
.product-hero .breadcrumb a {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    text-decoration: none;
}

.product-hero .breadcrumb a:hover {
    color: #fff;
}

.product-hero .breadcrumb .arrow {
    margin: 0 8px;
    color: rgba(255, 255, 255, 0.5);
}

/* ----------------------------------------
   HERO INNER (Two-Column Layout)
   ---------------------------------------- */

.product-hero .product-hero-inner {
    display: flex;
    align-items: center;
    gap: 60px;
}

/* ----------------------------------------
   LEFT CONTENT
   ---------------------------------------- */

.product-hero .product-hero-content.left {
    flex: 1 1 50%;
    /*     max-width: 520px; */
}

/* Title */
.product-hero .title {
    margin-bottom: 4px;
}

.product-hero .title h1 {
    font-size: 46px;
    font-weight: 400;
    color: #fff;
    margin: 0;
    line-height: 1.2;
}

/* Subtitle (yellow tagline) */
.product-hero .product-hero-subtitle {
    margin-bottom: 25px;
}

.product-hero .product-hero-subtitle h2 {
    font-size: 22px;
    font-weight: 400;
    color: var(--yellow);
    margin: 0;
   
}

/* Yellow Underline */
.product-hero .product-hero-underline {
    display: block;
    width: 80px;
    height: 2px;
    background-color: var(--yellow);
    margin-bottom: 20px;
}

/* Text */
.product-hero .text {
    color: rgba(255, 255, 255, 0.9);
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 24px;
}

.product-hero .text p {
    margin: 0;
	color: #fff;
}

/* ----------------------------------------
   IDEAL FOR ICONS
   ---------------------------------------- */

.product-hero .product-hero-ideal-for {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 28px;
}

.product-hero .ideal-for-label {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.8);
    font-weight: 400;
}

.product-hero .ideal-for-icons {
    display: flex;
    gap: 10px;
	flex-wrap: wrap;
}

.product-hero .ideal-for-icon {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background-color: #1BA0CC;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: default;
    transition: transform 0.2s ease, background-color 0.2s ease;
}

.product-hero .ideal-for-icon:hover {
    transform: scale(1.1);
    background-color: #1590b8;
	cursor: pointer;
}

a.ideal-for-icon {
    text-decoration: none;
    cursor: pointer;
}

a.ideal-for-icon:hover {
    transform: scale(1.15);
    background-color: #004A99;
    box-shadow: 0 4px 12px rgba(0, 74, 153, 0.3);
}

.product-hero .ideal-for-icon i {
    color: #fff;
    font-size: 16px;
}

/* ----------------------------------------
   BUTTON
   ---------------------------------------- */

.product-hero .a-button {
    margin-top: 10px;
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
}

.product-hero .a-button a.btn-main {
/*     display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease; */
	
	width: fit-content;
}

.product-hero .a-button a.btn-main.yellow-bg {
    background-color: #FFE800;
    color: #004A99;
}

.product-hero .a-button a.btn-main.yellow-bg:hover {
    background-color: #e6d100;
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(255, 232, 0, 0.3);
}

/* ----------------------------------------
   RIGHT: PRODUCT IMAGE
   ---------------------------------------- */

.product-hero .product-hero-image.right {
    flex: 1 1 50%;
    min-width: 0;
    position: relative;
}

.product-hero .product-hero-image-wrapper {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    width: 100%;
    overflow: hidden;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.product-hero .product-hero-image-wrapper img {
    width: 100%;
    height: 570px;
    object-fit: cover;
    display: block;
    border-radius: 20px;
}

/* Slider Styles */
.product-hero .product-hero-slider {
    width: 100%;
    display: block;
	border-radius: 20px;
	overflow: hidden;
	margin-bottom: 0px !important;
}
.product-hero .product-hero-slider .slick-slide {
/* 	    border-radius: 20px; */
/* 	overflow: hidden; */
}
.product-hero .product-hero-slider .slick-slide img {
    width: 100%;
    height: 570px;
    object-fit: cover;
    display: block;
    border-radius: 0px;
}

.product-hero .product-hero-slider .slick-dots {
    bottom: -30px;
}

.product-hero .product-hero-slider .slick-dots li button:before {
    color: #fff;
    opacity: 0.5;
}

.product-hero .product-hero-slider .slick-dots li.slick-active button:before {
    color: #FFE800;
    opacity: 1;
}

.product-hero .product-hero-slider .slick-prev,
.product-hero .product-hero-slider .slick-next {
    z-index: 10;
    width: 36px;
    height: 36px;
}

.product-hero .product-hero-slider .slick-prev {
    left: 10px;
}

.product-hero .product-hero-slider .slick-next {
    right: 10px;
}

.product-hero .product-hero-slider .slick-prev:before,
.product-hero .product-hero-slider .slick-next:before {
    font-size: 28px;
    color: var(--blue);
    opacity: 0.8;
}

/* ========================================
   JUMP-TO NAVIGATION BAR
   ======================================== */

.product-jump-nav {
    position: relative;
    z-index: 100;
    padding: 16px 0;
    transition: top 0.3s ease, box-shadow 0.3s ease;
/*     background: #f5f6f8; */
}

.product-jump-nav.is-fixed {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
}

.product-jump-nav-placeholder {
    display: none;
}

.product-jump-nav.scrolled {
    /*     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); */
}

.product-jump-nav-container {
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 30px;
    box-sizing: border-box;
    position: relative;
}

/* Desktop nav */
.product-jump-nav-desktop {
    display: flex;
    align-items: center;
    background: #fff;
    border-radius: 50px;
    padding: 0 80px;

    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    cursor: grab;
    position: relative;
}

.product-jump-nav-desktop.dragging {
    cursor: grabbing;
    user-select: none;
    -webkit-user-select: none;
}

.product-jump-nav-desktop::-webkit-scrollbar {
    display: none;
}

/* Right fade gradient to indicate scrollable content */
.product-jump-nav-desktop::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 60px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
    border-radius: 0 50px 50px 0;
    pointer-events: none;
    z-index: 2;
    transition: opacity 0.3s ease;
}

.product-jump-nav-desktop.scrolled-end::after {
    opacity: 0;
}

.product-jump-nav .product-jump-nav-label {
    font-size: 14px;
    font-weight: 400;
    color: var(--blue);
    white-space: nowrap;
    padding: 14px 16px;
    flex-shrink: 0;
}

.product-jump-nav .product-jump-nav-links {
    display: flex;
    align-items: stretch;
    gap: 0;
    padding-right: 40px;
    /* extra space so last link isn't hidden behind the fade */
}

.product-jump-nav .jump-link {
    display: flex;
    align-items: center;
    padding: 20px 20px;
    font-size: 14px;
    color: var(--blue);
    text-decoration: none;
    white-space: nowrap;
    opacity: 0.6;
    transition: color 0.2s ease, border-color 0.2s ease;
    position: relative;
}

.product-jump-nav .jump-link:hover {
    opacity: 1;
}

.product-jump-nav .jump-link.active {
    opacity: 1;

    border-bottom-color: #004A99;
}

/* Mobile nav — hidden on desktop */
.product-jump-nav-mobile {
    display: none;
}

/* Mobile Toggle Button */
.product-jump-nav-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 1;
    background: #f5f7fa;
    border: none;
    border-radius: 0 50px 50px 0;
    padding: 14px 20px;
    cursor: pointer;
    font-size: 14px;
    color: #004A99;
    transition: background-color 0.2s ease;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
}

.product-jump-nav-toggle:hover {
    background: #edf0f5;
}

.product-jump-nav-toggle-text {
    font-weight: 400;
    color: #004A99;
}

.product-jump-nav-chevron {
    font-size: 12px;
    color: #004A99;
    transition: transform 0.3s ease;
    margin-left: 10px;
}

.product-jump-nav-toggle[aria-expanded="true"] .product-jump-nav-chevron {
    transform: rotate(180deg);
}

/* Mobile Dropdown Panel */
.product-jump-nav-dropdown {
    display: none;
    flex-direction: column;
    background: #fff;
    border-radius: 16px;
    margin-top: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.product-jump-nav-dropdown.open {
    display: flex;
}

.product-jump-nav-dropdown .jump-link-mobile {
    padding: 14px 20px;
    font-size: 14px;
    color: #4a5568;
    text-decoration: none;
    border-bottom: 1px solid #f0f2f5;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.product-jump-nav-dropdown .jump-link-mobile:last-child {
    border-bottom: none;
}

.product-jump-nav-dropdown .jump-link-mobile:hover {
    background-color: #f5f7fa;
    color: #004A99;
}

.product-jump-nav-dropdown .jump-link-mobile.active {
    color: #004A99;
    font-weight: 600;
    background-color: #edf2ff;
}

/* ========================================
   RESPONSIVE
   ======================================== */

@media (max-width: 1200px) {
    .product-hero .title h1 {
        font-size: 40px;
    }

    .product-hero .product-hero-inner {
        gap: 40px;
    }

    .product-hero .product-hero-image-wrapper {
/*         max-width: 400px; */
    }
}

@media (max-width: 991px) {
    .product-hero {
        padding: 30px 0 60px;
    }

    .product-hero-container {
        padding: 0 30px;
    }

    .product-hero .title h1 {
        font-size: 36px;
    }

    .product-hero .product-hero-inner {
        flex-direction: column-reverse;
        text-align: center;
    }

    .product-hero .product-hero-content.left {
        flex: none;
        max-width: 600px;
        margin: 0 auto;
    }

    .product-hero .product-hero-underline {
        margin: 0 auto 20px;
    }

    .product-hero .product-hero-ideal-for {
        justify-content: center;
    }

    .product-hero .a-button {
        text-align: center;
    }

    .product-hero .product-hero-image.right {
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
    }

    .product-hero .product-hero-image-wrapper img,
    .product-hero .product-hero-slider .slick-slide img {
        height: 420px;
    }

    .product-jump-nav-container {
        padding: 0 20px;
    }
	
	.product-hero .a-button a.btn-main {
		margin: 0 auto;
	}
}

@media (max-width: 768px) {
    .product-hero {
        padding: 20px 0 50px;
    }

    .product-hero-container {
        padding: 0 20px;
    }

    .product-hero .breadcrumb {
        margin-bottom: 30px;
    }

    .product-hero .title h1 {
        font-size: 28px;
    }

    .product-hero .product-hero-subtitle h2 {
        font-size: 18px;
    }

    .product-hero .text {
        font-size: 15px;
    }

    .product-hero .product-hero-image-wrapper {
/*         padding: 20px; */
/*         max-width: 320px; */
    }

    .product-hero .product-hero-image-wrapper img,
    .product-hero .product-hero-slider .slick-slide img {
        height: 300px;
        max-height: 300px;
    }

    /* Jump nav: swap to mobile dropdown */
    .product-jump-nav-desktop {
        display: none;
    }

    .product-jump-nav-mobile {
        display: flex;
        align-items: center;
        background: #fff;
        border-radius: 50px;
        overflow: visible;
        position: relative;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    }

    .product-jump-nav-mobile .product-jump-nav-label {
        padding: 14px 16px;
        flex-shrink: 0;
        border-right: 1px solid #e5e7eb;
    }

    .product-jump-nav-dropdown {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        z-index: 200;
        margin-top: 8px;
    }
	
	
}

@media (max-width: 480px) {
    .product-hero .title h1 {
        font-size: 24px;
    }

    .product-hero .product-hero-subtitle h2 {
        font-size: 16px;
    }

    .product-hero .a-button a.btn-main {
        padding: 12px 24px;
        font-size: 13px;
    }

    .product-hero .ideal-for-icon {
        width: 32px;
        height: 32px;
    }

    .product-hero .ideal-for-icon i {
        font-size: 14px;
    }
}

/* ========================================
   Downloads Section
   ======================================== */

.downloads {
    padding: 30px 0;
    background-color: #FAFBFB;
}

.downloads-container {
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 30px;
    box-sizing: border-box;
}

/* Title */
.downloads .title {
    margin-bottom: 30px;
}

/* Grid */
.downloads .downloads-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.downloads .download-card {
    width: calc(25% - 20px);
    background: #ffffff;
    border: 1px solid #E0E5EB;
    border-radius: 10px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: box-shadow 0.3s ease;
    box-sizing: border-box;
}

.downloads .download-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

/* Card Title */
.downloads .download-card-title h4 {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--blue);
    margin: 0 0 16px 0;
}

/* Language Select */
.downloads .download-language-select {
    position: relative;
    margin-bottom: 20px;
}

.downloads .download-language-select select {
    width: 100%;
    padding: 10px 0px 10px 0px;
    border: none;

    background: transparent;
    font-size: 16px;
    font-weight: 400;
    color: var(--grey);
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    outline: none;
    border-radius: 0;
    font-family: inherit;
}

.downloads .download-language-select select:focus {
    border-bottom-color: #004A99;
    color: #333;
}

.downloads .download-language-select i {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: #6B7280;
    pointer-events: none;
}

/* Download Button */
.downloads .download-action {
    margin-top: auto;
}

.downloads .download-btn {
    display: block;
    max-width: 180px;
    padding: 12px 20px;
    font-size: 16px;
    font-weight: 400;
    color: #000;
    background: transparent;
    border: 1px solid var(--blue);
    border-radius: 5px;
    text-align: center;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    font-family: inherit;
}

.downloads .download-btn:hover {
    border-color: #004A99;
    color: #004A99;
}

.downloads .download-btn.disabled {
    opacity: 0.5;
    pointer-events: none;
}


/* ========================================
   Responsive
   ======================================== */

@media (max-width: 1200px) {
    .downloads .download-card {
        width: calc(33.333% - 14px);
    }
}

@media (max-width: 991px) {
    .downloads .download-card {
        width: calc(50% - 10px);
    }
}

@media (max-width: 600px) {
    .downloads {
        padding: 40px 0;
    }

    .downloads-container {
        padding: 0 20px;
    }

    .downloads .download-card {
        width: 100%;
    }

    .downloads .download-btn {
        max-width: 100%;
    }
}

/* View More Button */
.downloads-hidden {
    display: none !important;
}

.downloads-view-more-wrap {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 30px;
}

.downloads-view-more-btn {
    min-width: 160px;
}
.downloads-view-more-btn:hover {
	cursor: pointer;
}

/* ========================================
   Specs Table Section
   ======================================== */

.specs-table {
    padding: 60px 0;
    background-color: #FAFBFB;
}

.specs-table.no-top-padding {
    padding-top: 0;
}

.specs-table.no-bottom-padding {
    padding-bottom: 0;
}

.specs-table .specs-table-container {
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 30px;
    box-sizing: border-box;
}

.specs-table .title {
    margin-bottom: 30px;
}

.specs-table .title h2 {
 
}

/* Title + nav row: flex container, nav hidden until mobile */
.specs-table .title-nav-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

.specs-table .title-nav-row .title {
    margin-bottom: 0;
}

/* Hidden on desktop — shown at ≤768px */
.specs-table .title-nav-row .mobile-table-nav {
    display: none;
}

/* ========================================
   Desktop Table
   ======================================== */

.specs-table .specs-table-desktop {
    width: 100%;
    overflow-x: auto;
}

.specs-table .specs-table-desktop table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}

.specs-table .specs-table-desktop thead tr {
    /*     border-bottom: 2px solid #1BA0CC; */
}

.specs-table .specs-table-desktop th {
    padding: 15px 20px;
    text-align: center;
    font-weight: 400;
    font-size: 16px;
    color: var(--black);
    background: rgba(0, 74, 153, 0.20);
    border: 1px solid black;
    vertical-align: top;
    line-height: 1.4;
}

.specs-table .specs-table-desktop th:first-child {
    background: rgba(0, 74, 153, 0.20);

    text-align: left;
    border-radius: 5px 5px 0 0;
}

.specs-table .specs-table-desktop tbody tr {
    border-bottom: 1px solid #e5e5e5;
}

.specs-table .specs-table-desktop tbody tr:last-child {
    border-bottom: none;
}

.specs-table .specs-table-desktop td {
    padding: 15px 20px;
    text-align: center;
    font-size: 14px;
    color: var(--grey);
    vertical-align: middle;
    line-height: 1.5;
    border: 1px solid black;
}

.specs-table .specs-table-desktop td.first-cell {
    background: rgba(69, 192, 238, 0.20);
    text-align: left;
    color: var(--black);
    font-weight: 400;
    white-space: nowrap;
}

/* ========================================
   Mobile Slider Table
   ======================================== */

.specs-table .specs-table-mobile {
    display: none;
}

.specs-table .mobile-table-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.specs-table .nav-arrow {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1BA0CC;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 16px;
}

.specs-table .nav-arrow:hover {
    color: #004A99;
}

.specs-table .nav-arrow.disabled {
    opacity: 0.3;
    cursor: default;
}

.specs-table .nav-dots {
    display: flex;
    gap: 8px;
}

.specs-table .nav-dots .dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #ccc;
    cursor: pointer;
    transition: all 0.3s ease;
}

.specs-table .nav-dots .dot.active {
    background-color: #004A99;
}

.specs-table .mobile-table-wrapper {
    display: flex;
    border: 1px solid var(--black);
    overflow: hidden;
}

/* Fixed First Column */
.specs-table .fixed-column {
    flex-shrink: 0;
    min-width: 110px;
    max-width: 130px;
    background-color: #fff;
    border-right: 1px solid #e5e5e5;
    z-index: 2;
}

.specs-table .fixed-header {
    padding: 15px 12px;
    background-color: rgba(0, 74, 153, 0.20);
    color: var(--black);
    font-weight: 400;
    font-size: 14px;
    text-align: center;

/*     min-height: 60px; */
    display: flex;
    align-items: center;
    justify-content: center;
}

.specs-table .fixed-cell {
    padding: 15px 12px;
    border-top: 1px solid var(--black);
    color: var(--black);
    font-weight: 500;
    font-size: 14px;
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
	background: rgba(69, 192, 238, 0.20);
	
}

.specs-table .fixed-cell:last-child {
    border-bottom: none;
}

/* Sliding Columns */
.specs-table .sliding-columns {
    flex: 1;
    display: flex;
    overflow: hidden;
    position: relative;
	border-left: 1px solid var(--black);
}

.specs-table .slide-column {
    flex-shrink: 0;
    width: 100%;
    display: none;
}

.specs-table .slide-column.active {
    display: block;
}

.specs-table .slide-header {
    padding: 15px 12px;
	background: rgba(0, 74, 153, 0.20);

	color: var(--black);
    font-weight: 400;
    font-size: 14px;
    text-align: center;

/*     min-height: 60px; */
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1.3;
}

.specs-table .slide-cell {
    padding: 15px 12px;
    border-top: 1px solid var(--black);
    text-align: center;
    font-size: 14px;
    color: #333;
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1.4;
	
}

.specs-table .slide-cell:last-child {
    border-bottom: none;
}

/* ========================================
   Responsive Styles
   ======================================== */

@media (max-width: 1200px) {

    .specs-table .specs-table-desktop th,
    .specs-table .specs-table-desktop td {
        padding: 12px 15px;
        font-size: 13px;
    }
}

@media (max-width: 991px) {
    .specs-table {
        padding: 40px 0;
    }

    .specs-table .specs-table-container {
        padding: 0 20px;
    }

    .specs-table .title h2 {
        font-size: 24px;
    }
}

@media (max-width: 768px) {
    .specs-table .specs-table-desktop {
        display: none !important;
    }

    .specs-table .specs-table-mobile {
        display: block !important;
    }

    /* Show nav in title row on mobile */
    .specs-table .title-nav-row .mobile-table-nav {
        display: flex;
    }
}

@media (max-width: 480px) {
    .specs-table .specs-table-container {
        padding: 0 15px;
    }

    .specs-table .title h2 {
        font-size: 22px;
    }

    .specs-table .fixed-column {
        min-width: 100px;
        max-width: 110px;
    }

    .specs-table .fixed-header,
    .specs-table .fixed-cell,
    .specs-table .slide-header,
    .specs-table .slide-cell {
        padding: 12px 10px;
        font-size: 12px;
        min-height: 50px;
    }
}

/* Drop the nav entirely at very narrow widths */
@media (max-width: 360px) {
    .specs-table .title-nav-row .mobile-table-nav {
        display: none;
    }
}
/* ==========================================================================
   Image Interactive - Hotspots Component
   ========================================================================== */

/* Body scroll lock when modal is open */
body.modal-open {
    overflow: hidden;
}

.image-interactive {
    padding: 60px 0;
}
.image-interactive.no-top-padding {
	padding-top: 0px;
}

.image-interactive.no-bottom-padding {
	padding-bottom: 0px;
}
.image-interactive-container {
    max-width: 1280px;
    margin: 0 auto;
        padding: 0 30px;
}

.image-interactive-wrapper {
    position: relative;
    display: inline-block;
    width: 100%;
    border-radius: 16px;
    overflow: visible;
}

.image-interactive-image {
    position: relative;
    z-index: 1;
    line-height: 0;
}

.image-interactive-image img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 16px;
	border: 1px solid #D8E1EE;
}

/* Overlay for active state */
.image-interactive-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(75, 85, 99, 0.65);
    border-radius: 16px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    z-index: 2;
    pointer-events: none;
}

.image-interactive-wrapper.modal-active .image-interactive-overlay {
    opacity: 1;
    visibility: visible;
}

/* ==========================================================================
   Hotspot Points
   ========================================================================== */

.hotspot-point {
    position: absolute;
    z-index: 10;
    width: 24px;
    height: 24px;
    transform: translate(-50%, -50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    outline: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hotspot-dot {
    position: absolute;
    width: 14px;
    height: 14px;
    background: #1BA0CC;
    border: 3px solid #ffffff;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s ease, background-color 0.2s ease;
    z-index: 2;
}

.hotspot-point:hover .hotspot-dot {
    transform: scale(1.1);
    background: #004A99;
}

/* Pulsating Animation */
.hotspot-pulse {
    position: absolute;
    width: 26px;
    height: 26px;
    background: rgba(27, 160, 204, 0.4);
    border-radius: 50%;
    animation: pulse 2s ease-out infinite;
    z-index: 1;
}

@keyframes pulse {
    0% {
        transform: scale(1);
        opacity: 0.6;
    }

    50% {
        opacity: 0.4;
    }

    100% {
        transform: scale(3);
        opacity: 0;
    }
}

/* Stop animation when modal is active */
.image-interactive-wrapper.modal-active .hotspot-pulse {
    animation: none;
    opacity: 0;
}

/* ==========================================================================
   Desktop Modal (Centered in Image)
   ========================================================================== */

.hotspot-modal-desktop {
    position: absolute;
    z-index: 20;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.hotspot-modal-desktop.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.hotspot-modal-content {
    background: #ffffff;
    border-radius: 12px;
    padding: 24px;
    min-width: 280px;
    max-width: 340px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    position: relative;
}

.hotspot-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 28px;
    height: 28px;
    background: none;
    border: none;
    cursor: pointer;
    color: #6b7280;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: color 0.2s ease;
}
.hotspot-modal-close svg {
	width: 15px;
	height: 15px;
}
.hotspot-modal-close:hover {
    color: #1f2937;
}

.hotspot-modal-title {
    font-size: 18px;
    font-weight: 400;
    margin: 0 0 12px 0;
    padding-right: 30px;
    color: var(--blue);
}

.hotspot-modal-description {
    font-size: 14px;
    line-height: 1.6;
    color: #374151;
    margin-bottom: 8px;
}

.hotspot-modal-description p {
    margin: 0 0 8px 0;
}

.hotspot-modal-description p:first-of-type {
	padding-top: 0px;
}

.hotspot-modal-description p:last-child {
    margin-bottom: 0;
}

.hotspot-modal-subtext {
    font-size: 14px;
/*     color: #6b7280; */
    margin: 0 0 16px 0;
/*     font-style: italic; */
}

/* Products/Tags Section */
.hotspot-modal-products {
	margin-top: 16px;
	padding-top: 16px;
	border: 1px solid rgba(69, 192, 238, 0.20);
	border-radius: 5px;
	background-color: rgba(69, 192, 238, 0.20);
	padding: 10px 10px;
	box-sizing: border-box;
}

.hotspot-modal-products-label {
    display: block;
    font-size: 12px;
    color: var(--black);
    margin-bottom: 10px;
/*     text-transform: uppercase; */
    letter-spacing: 0.5px;
}

.hotspot-modal-products-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.hotspot-product-tag {
    display: inline-block;
    padding: 8px 16px;
    background: #fff;
    border: 1px solid #BCE8F9;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    color: var(--black);
    text-decoration: none;
    transition: all 0.2s ease;
}

a.hotspot-product-tag:hover {
    background: #004A99;
    border-color: #004A99;
    color: #ffffff;
}

/* ==========================================================================
   Mobile Modal (Fullscreen Overlay)
   ========================================================================== */

.hotspot-modals-mobile {
    display: none;
}

.hotspot-modal-mobile {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(75, 85, 99, 0.65);
    z-index: 9999;
    justify-content: center;
    align-items: center;
    padding: 20px;
    box-sizing: border-box;
}

.hotspot-modal-mobile.active {
    display: flex;
    animation: fadeIn 0.3s ease;
}

.hotspot-modal-mobile .hotspot-modal-content {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.25);
    max-height: 90vh;
    overflow-y: auto;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* ==========================================================================
   Responsive Styles
   ========================================================================== */

@media screen and (max-width: 991px) {
    .image-interactive {
        padding: 40px 0;
    }

    /* Hide desktop modals on mobile */
    .hotspot-modal-desktop {
        display: none !important;
    }

    /* Show mobile modal container */
    .hotspot-modals-mobile {
        display: block;
    }

    /* Remove overlay on mobile since modal is outside */
    .image-interactive-wrapper.modal-active .image-interactive-overlay {
        opacity: 0;
        visibility: hidden;
    }

    .hotspot-modal-content {
        min-width: auto;
        max-width: 100%;
    }
}

@media screen and (max-width: 767px) {
    .image-interactive-container {
        padding: 0 20px;
    }

    .hotspot-point {
        width: 20px;
        height: 20px;
    }

    .hotspot-dot {
        width: 12px;
        height: 12px;
        border-width: 2px;
    }

    .hotspot-pulse {
        width: 20px;
        height: 20px;
    }

    .hotspot-modal-content {
        padding: 20px;
    }

    .hotspot-modal-title {
        font-size: 16px;
    }

    .hotspot-modal-description {
        font-size: 13px;
    }

    .hotspot-product-tag {
        padding: 6px 12px;
        font-size: 12px;
    }
}

@media screen and (max-width: 480px) {
    .hotspot-point {
        width: 18px;
        height: 18px;
    }

    .hotspot-dot {
        width: 10px;
        height: 10px;
    }

    .hotspot-pulse {
        width: 18px;
        height: 18px;
    }
}

/* Members Section */

.members {
    padding: 40px 30px;
    background-color: #fff;
    box-sizing: border-box;
    position: relative;
}

.members-container {
    max-width: 1280px;
    margin: 0 auto;

}

.members-container>.title {
    text-align: center;
    margin-bottom: 20px;
}

.members-container>.text {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 60px;
    color: #666;
}

/* Grid Layout - Using Flexbox, NOT CSS Grid */
.members-items {
    display: flex;
    flex-wrap: wrap;
    gap: 50px 30px;
}

.member {
    width: calc(33.333% - 20px);
    background-color: #fff;
}

/* Member Image */
.member .member-image {
    margin-bottom: 20px;
    overflow: hidden;
    border-radius: 10px;
}

.member .member-image img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.3s ease;
    height: 340px;
    object-fit: cover;
    object-position: center;

}

.member:hover .member-image img {
    transform: scale(1.02);
}

/* Member Details */
.member .member-details {
    padding: 0;
}

.member .member-name h3 {
    font-size: 22px;
    font-weight: 400;
    margin: 0 0 5px;
    color: var(--blue);
}

.member .member-role span {
    font-size: 16px;
    font-weight: 400;
    color: var(--blue);
	margin-top: 10px;
	display: block;
}

.member .member-description {

    font-size: 16px;
    line-height: 1.6;
    color: var(--grey);
}

.member .member-description p {
    margin: 0;
}

/* Contact Information */
.member .member-contact {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.member .contact-row {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
}

.member .contact-row i {
    color: var(--blue);
    width: 16px;
    font-size: 14px;
}

.member .contact-row a {
    color: var(--black);
    font-size: 16px;
    text-decoration: none;
    transition: color 0.3s ease;
}

.member .contact-row a:hover {
    color: #004A99;
}

/* LinkedIn Row */
.member .linkedin-row {
    margin-top: 5px;
}

.member .linkedin-row a {
    color: var(--blue);
    font-weight: 500;
}

.member .linkedin-row i {
font-size: 26px;
}


/* ===================== */
/* Responsive Breakpoints */
/* ===================== */



/* Tablet Landscape */
@media (max-width: 900px) {
    .member {
        width: calc(50% - 15px);
    }
}

/* Tablet Portrait */
@media (max-width: 600px) {
    .members {
        padding: 30px 20px;
    }

    .members-container>.text {
        margin-bottom: 40px;
    }

    .members-items {
        gap: 30px 20px;
    }

    .member .member-image img {
        height: 240px;
    }

    .member .member-details {
        text-align: center;
    }

    .member .member-contact {
        align-items: center;
    }
}

/* Mobile */
@media (max-width: 600px) {
    .members {
        padding: 30px 20px;
    }

    .member {
        width: 100%;
    }

    .members-items {
        gap: 40px;
    }
}

/* ==========================================================================
   Contact Form Section
   ========================================================================== */

.contact-form-section {
    padding: 80px 30px;
    background-color: #FAFBFB;
	box-sizing: border-box;
	position: relative;
}

.page-id-71 .contact-form-section.white-bg {
	background-color: #FAFBFB;
}
.contact-form-section.white-bg {
    background-color: #fff;
}

.contact-form-section.no-top-padding {
    padding-top: 0;
}

.contact-form-section.no-bottom-padding {
    padding-bottom: 0;
}

.contact-hero::after {
    background: var(--SCIGRIP-LINEAR, linear-gradient(180deg,
                #004A99 0%,
                #004A99 40%,
                rgba(0, 74, 153, 0.85) 65%,
                rgba(0, 74, 153, 0.5) 85%,
                rgba(0, 74, 153, 0.15) 100%));
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: calc(100% + 200px);
    content: '';
}
.contact-form-section.contact-hero {
/*     background: linear-gradient(0deg, #FAFBFB 1.49%, #004A99 76.24%); */
}

.contact-hero .breadcrumb {
	max-width: 1590px;
	margin: 0 auto;
	left: 50%;
	transform: translateX(-50%);
	position: absolute;
	top: 20px;
	width: 100%;
	z-index: 1;

}

.contact-form-section-container {
    max-width: 1530px;
    margin: 0 auto;
    padding: 55px 55px;
    display: flex;
    gap: 60px;
    align-items: flex-start;
    box-sizing: border-box;
    border-radius: 20px;
    background-color: #fff;
    border: 1px solid #D8E1EE;
	position: relative;
	z-index: 1;
}

.contact-form-section.contact-hero .contact-form-section-container {
    padding: 0;
    background-color: transparent;
    border: none;
}

/* ==========================================================================
   Left Column - Contact Info
   ========================================================================== */

.contact-form-section .left {
    width: calc(35% - 30px);
    flex-shrink: 0;
}

.contact-form-section .left-inner {
    padding-right: 20px;
}

.contact-form-section .title {
    margin-bottom: 20px;
}
.contact-form-section .title h1 {
	color: var(--white);
	font-size: 46px;
	padding-bottom: 25px;
}

.contact-form-section .title-underline {
	    display: block;
    width: 80px;
    height: 2px;
    background-color: var(--cyan);
}
.contact-form-section .title h2 {
    color: var(--blue);

}

.contact-form-section.contact-hero .title h2 {
    color: #fff;
}

.contact-form-section .text {
    margin-bottom: 30px;
}

.contact-form-section .text p {
    font-size: 16px;

    color: var(--black);
}

.contact-form-section.contact-hero .text p {
    color: #fff;
}

/* Contact Details */
.contact-details {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.contact-region {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.region-label {
    font-size: 16px;
    font-weight: 500;
    margin: 0 0 5px 0;
}

.region-label.cyan {
    color: var(--blue);
}

.contact-hero .region-label.cyan {
    color: var(--cyan);
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 10px;
}

.contact-item i {
    color: var(--blue);
    font-size: 16px;
    width: 18px;
    font-weight: 400;
}

.contact-hero .contact-item i {
    color: var(--cyan);
}

.contact-item a {
    font-size: 16px;
    color: var(--black);
    text-decoration: none;
    transition: color 0.3s ease;
}

.contact-hero .contact-item a {
    color: #fff;
}

.contact-hero .contact-item a:hover {
	color: var(--cyan);
}

.contact-item a:hover {
    color: #004A99;
}

/* ==========================================================================
   Right Column - Form
   ========================================================================== */

.contact-form-section .right {
    width: calc(65% - 30px);
    flex-grow: 1;
}

.form-wrapper {
    background: transparent;
}

/* Contact Form 7 Styling */
.contact-form-section .wpcf7-form {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.contact-form-section .wpcf7-form p {
    margin: 0;
    width: 100%;
    text-align: left;
}

.contact-form-section .wpcf7-form p.privacy-text {
    text-align: left !important;
}

.wpcf7-spinner {
    display: none !important;
}

.contact-form-section .wpcf7-form .submit-row p {
    text-align: right;
	padding: 0;
}
.contact-form-section.contact-hero .wpcf7-form .submit-row p {
	color: #FAFBFB;
}
/* Two-column form fields */
.contact-form-section .wpcf7-form .form-row {
    display: flex;
    gap: 20px;
    width: 100%;
}

.contact-form-section .wpcf7-form .form-row .form-field {
    width: calc(50% - 10px);
}
.contact-form-section .wpcf7-form .form-row p {
	padding: 0;
}

/* Single field styling */



.contact-form-section .wpcf7-form select {
	-webkit-appearance: none;
	border-radius: 0;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAANCAYAAAC+ct6XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RjBBRUQ1QTQ1QzkxMTFFMDlDNDdEQzgyNUE1RjI4MTEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RjBBRUQ1QTU1QzkxMTFFMDlDNDdEQzgyNUE1RjI4MTEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpGMEFFRDVBMjVDOTExMUUwOUM0N0RDODI1QTVGMjgxMSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpGMEFFRDVBMzVDOTExMUUwOUM0N0RDODI1QTVGMjgxMSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pk5mU4QAAACUSURBVHjaYmRgYJD6////MwY6AyaGAQIspCieM2cOjKkIxCFA3A0TSElJoZ3FUCANxAeAWA6IOYG4iR5BjWwpCDQCcSnNgxoIVJCDFwnwA/FHWlp8EIpHSKoGgiggLkITewrEcbQO6mVAbAbE+VD+a3IsJTc7FQAxDxD7AbEzEF+jR1DDywtoCr9DbhwzDlRZDRBgACYqHJO9bkklAAAAAElFTkSuQmCC);
	background-position: center right;
	background-repeat: no-repeat;
	-moz-appearance: none;
}

.contact-form-section .wpcf7-form input[type="text"],
.contact-form-section .wpcf7-form input[type="email"],
.contact-form-section .wpcf7-form input[type="tel"],
.contact-form-section .wpcf7-form select,
.contact-form-section .wpcf7-form textarea {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid #D8E1EE;
    border-radius: 5px;
    font-size: 16px;
    font-family: "aktiv-grotesk", sans-serif;
    color: var(--blue);
    background-color: #FAFBFB;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
    box-sizing: border-box;
}

.contact-form-section .wpcf7-form input[type="text"]:focus,
.contact-form-section .wpcf7-form input[type="email"]:focus,
.contact-form-section .wpcf7-form input[type="tel"]:focus,
.contact-form-section .wpcf7-form select:focus,
.contact-form-section .wpcf7-form textarea:focus {
    outline: none;
    border-color: #004A99;
    box-shadow: 0 0 0 3px rgba(0, 74, 153, 0.1);
}

.contact-form-section .wpcf7-form input::placeholder,
.contact-form-section .wpcf7-form textarea::placeholder {
    color: var(--blue);
}

/* Textarea */
.contact-form-section .wpcf7-form textarea {
    min-height: 120px;
    resize: vertical;
    width: 100%;
}

/* Privacy Policy Text */
.contact-form-section .privacy-text {
    font-size: 12px;
    color: #666;
    text-align: center;
    width: 100%;
    margin-top: 10px;
}

.contact-form-section .privacy-text a {
    color: #333;
    text-decoration: underline;
}
.contact-form-section.contact-hero .privacy-text a {
	color: #FAFBFB;
}
.contact-form-section.contact-hero .privacy-text a:hover {
	color: var(--cyan);
}
.contact-form-section .privacy-text a:hover {
    color: #004A99;
}

/* Submit Button */
.contact-form-section .wpcf7-form input[type="submit"],
.contact-form-section .wpcf7-form .wpcf7-submit {
    background-color: #FFE800;
    color: #004A99;
    border: none;
    padding: 14px 40px;
    font-size: 16px;
    font-family: "aktiv-grotesk", sans-serif;
    font-weight: 500;
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-left: auto;
}

.contact-form-section .wpcf7-form input[type="submit"]:hover,
.contact-form-section .wpcf7-form .wpcf7-submit:hover {
    background-color: #e6d000;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(255, 232, 0, 0.4);
}

/* Submit Row - align button right */
.contact-form-section .submit-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-top: 0px;
}

/* Validation Messages */
.contact-form-section .wpcf7-not-valid-tip {
    color: #dc3545;
    font-size: 12px;
    margin-top: 5px;
}

.contact-form-section .wpcf7-response-output {
    margin: 20px 0 0;
    padding: 15px;
    border-radius: 5px;
    font-size: 14px;
}

.contact-form-section .wpcf7-mail-sent-ok {
    background-color: #d4edda;
    border-color: #c3e6cb;
    color: #155724;
}

.contact-form-section .wpcf7-validation-errors,
.contact-form-section .wpcf7-mail-sent-ng {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    color: #721c24;
}


.contact-hero .breadcrumb nav {
	padding: 0 30px;
	box-sizing: border-box;
}
/* ==========================================================================
   Responsive Styles
   ========================================================================== */

@media (max-width: 991px) {
    .contact-form-section-container {
        flex-direction: column;
        gap: 40px;
    }

    .contact-form-section .left,
    .contact-form-section .right {
        width: 100%;
    }

    .contact-form-section .left-inner {
        padding-right: 0;
    }

    .contact-details {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 40px;
    }

    .contact-region {
        min-width: 200px;
    }
}

@media (max-width: 600px) {
	
	.contact-form-section.contact-hero {
		padding: 80px 20px 30px;
	}
    .contact-form-section {
        padding: 30px 20px;
    }

    .contact-form-section-container {
        padding: 20px 20px;
    }
	.contact-form-section .title h1 {
		font-size: 28px;
	}
    .contact-form-section .title h2 {
        font-size: 26px;
    }
	
	.contact-form-section .title-underline {
		margin: 0 auto;
	}

    .contact-form-section .wpcf7-form .form-row {
        flex-direction: column;
        gap: 20px;
    }

    .contact-form-section .wpcf7-form .form-row .form-field {
        width: 100%;
    }

    .contact-details {
        flex-direction: column;
        gap: 25px;
    }

    .contact-form-section .submit-row {
        flex-direction: column;
        gap: 15px;
    }

    .contact-form-section .privacy-text {
        text-align: left;
    }

    .contact-form-section .wpcf7-form input[type="submit"],
    .contact-form-section .wpcf7-form .wpcf7-submit {
        width: 100%;
        margin-left: 0;
    }
	
	.contact-form-section .left-inner {
		text-align: center;
	}
	.contact-region {
/* 		align-items: center; */
		align-items: flex-start;
	}
	
	
	.contact-hero .breadcrumb nav {
		padding: 0 20px;
	}
}

@media (max-width: 480px) {
 

    .contact-form-section .title h2 {
        font-size: 22px;
    }

    .contact-form-section .wpcf7-form input[type="text"],
    .contact-form-section .wpcf7-form input[type="email"],
    .contact-form-section .wpcf7-form input[type="tel"],
    .contact-form-section .wpcf7-form select,
    .contact-form-section .wpcf7-form textarea {
        padding: 12px 14px;
    }
}

/* ==========================================================================
   Distributors Section
   ========================================================================== */

.distributors {
    position: relative;
    padding: 20px 0 40px;
    background-color: #FAFBFB;
}

.distributors.no-bg::after {
    display: none;
}

.distributors::after {
    background: var(--SCIGRIP-LINEAR, linear-gradient(180deg,
                #004A99 0%,
                rgba(0, 74, 153, 0.85) 30%,
                rgba(0, 74, 153, 0.15) 75%,
                rgba(255, 255, 255, 0) 100%));
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: calc(100% + 200px);
    max-height: 760px;
    content: '';
}

/* Background gradient - positioned to end before results */
/* .distributors-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 75%;
    background: linear-gradient(358deg, #FAFBFB 1.38%, #004A99 84.67%);
    z-index: 0;
} */

.distributors-container {
    position: relative;
    z-index: 1;
    max-width: 1590px;
    margin: 0 auto;
    padding: 0 30px;
    box-sizing: border-box;
}

/* Breadcrumb */
.distributors .breadcrumb {
    margin-bottom: 30px;
}

.distributors .breadcrumb a,
.distributors .breadcrumb span {
    color: rgba(255, 255, 255, 0.8);
    font-size: 14px;
    text-decoration: none;
}

.distributors .breadcrumb a:hover {
    color: #fff;
}

.distributors .breadcrumb .arrow {
    margin: 0 8px;
}

/* Title */
.distributors .title {
    text-align: center;
    margin-bottom: 15px;
}

.distributors.no-bg .title>* {
    color: var(--black) !important;
}

.distributors .title h1,
.distributors .title h2 {
    font-size: 46px;
    font-weight: 400;

    color: var(--white);
    position: relative;
    display: inline-block;
    padding-bottom: 15px;
}
.distributors .title h2{
	font-size: 32px;
	padding-bottom: 0px;
}

.distributors .title.underline h1::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 120px;
    height: 2px;
    background-color: #FFE800;
    border-radius: 2px;
}

/* Text */
.distributors .text {
    text-align: center;
    max-width: 940px;
    margin: 0 auto 40px;
}

.distributors .text p {
    color: rgba(255, 255, 255, 0.9);
    font-size: 16px;
    line-height: 1.6;
}

.distributors.no-bg .text p {
    color: var(--blue);
}

/* Instruction */
.distributors .instruction {
    text-align: center;
    margin-bottom: 30px;
}

.distributors .instruction p {
    color: #fff;
    font-size: 22px;
    font-weight: 400;
}

/* ==========================================================================
   Region Cards
   ========================================================================== */

.regions-wrapper {
    margin-bottom: 50px;
}

.regions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
}

.region-card {
    flex: 1 1 calc((100% / 7) - 20px);
    min-width: 160px;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.region-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.region-card.active {
    box-shadow: 0 8px 30px rgba(0, 74, 153, 0.3);
    /*     border: 2px solid #004A99; */
}

/* When a region is selected, fade other cards */
.regions.has-selection .region-card:not(.active) {
    opacity: 0.4;
}

.region-image {
    height: 210px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px;
    background-color: #f0f0f0;
    box-sizing: border-box;
}

.region-image img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.region-name {
    padding: 15px 10px;
    text-align: center;
    background: #fff;
}

.region-name span {
    font-size: 22px;
    font-weight: 400;
    color: #000;
}

.region-card.active .region-name span {
    color: #004A99;
}

/* ==========================================================================
   Distributors Results
   ========================================================================== */

.distributors-results-wrapper {
    margin-top: 40px;
}

.results-placeholder {
    text-align: center;
    padding: 30px;
}

.results-placeholder p {
    color: #666;
    font-size: 16px;
}

.results-title {
    text-align: center;
    margin-bottom: 30px;
}

.results-title h3 {
    color: var(--blue);
    font-size: 22px;
    font-weight: 400;
}

.distributors-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    justify-content: center;
}

.distributor-card {
    width: calc(25% - 25px);
    min-width: 280px;
    max-width: 350px;
    background: #fff;
    border-radius: 12px;
    padding: 30px;
    text-align: center;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.distributor-card:hover {
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12);
    transform: translateY(-3px);
}

.sub-region {
    margin-bottom: 10px;
}

.sub-region span {
    color: var(--blue);
    font-size: 14px;
    font-weight: 500;
    font-style: italic;
}

.distributor-name {
    margin-bottom: 15px;
}

.distributor-name h4 {
    color: var(--black);
    font-size: 22px;
    font-weight: 400;
    margin: 0;
}

.distributor-address {
    color: var(--black);
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 15px;
    white-space: pre-line;
}

.distributor-address br {
	display: none;
}

.distributor-phone,
.distributor-email,
.distributor-website {
    font-size: 14px;
    margin-bottom: 8px;
}

.distributor-phone span,
.distributor-email span,
.distributor-website span {
    color: var(--black);
}

.distributor-phone a,
.distributor-email a,
.distributor-website a {
    color: var(--cyan);
    text-decoration: underline;
    font-weight: 400;
}

.distributor-phone a:hover,
.distributor-email a:hover,
.distributor-website a:hover {
    text-decoration: underline;
    color: var(--blue);
}

/* Loading and Error States */
.loading,
.no-results,
.error {
    text-align: center;
    /*     padding: 40px; */
}

.loading p,
.no-results p,
.error p {
    color: #666;
    /*     font-size: 16px; */
}

/* ==========================================================================
   Responsive Styles
   ========================================================================== */

@media (max-width: 1200px) {
    .region-card {
        width: calc(20% - 20px);
    }

    .distributor-card {
        width: calc(50% - 15px);
    }
}

@media (max-width: 991px) {
    .region-card {
        width: calc(33.333% - 15px);
    }

    .distributors .title h1 {
        font-size: 38px;
    }
}

@media (max-width: 768px) {
    .distributors {
        padding:10px 0 60px;
    }

    .distributors-container {
        padding: 0 20px;
    }

    .region-card {
        width: calc(50% - 10px);
        min-width: 120px;
    }

    .region-image {
        height: 100px;
    }

    .distributor-card {
        width: 100%;
        max-width: none;
    }

    .distributors .title h1 {
        font-size: 32px;
    }

    .distributors .instruction p {
        font-size: 16px;
    }
	
	.distributors .title h2 {
		font-size: 22px;
	}
	
	.distributors .text p {
		font-size: 14px;
	}
}

@media (max-width: 600px) {
	.region-name span {
		font-size: 18px;
	}
	.region-card {
		border-radius: 8px;
	}
	
	.results-title h3 {
		font-size: 18px;
	}
	
	.distributor-name h4 {
		font-size: 18px;
	}
}

@media (max-width: 480px) {
    .distributors .title h1 {
        font-size: 28px;
    }

    .region-card {
        width: calc(50% - 8px);
    }

    .regions {
        gap: 12px;
    }



    .distributor-card {
        padding: 20px;
    }
}




/* Slider Section */
.slider {
    padding: 60px 0;
    box-sizing: border-box;
    overflow: hidden;
}

.slider.no-top-padding {
    padding-top: 20px !important;
}

.slider.no-bottom-padding {
    padding-bottom: 20px;
}

.slider.white-bg {
    background-color: #fff;
}

.slider.grey-bg {
    background-color: #f5f5f5;
}

/* Container */
.slider-container {
    max-width: 1530px;
    margin: 0 auto;
    padding: 0 30px;
    position: relative;
    z-index: 2;
    box-sizing: border-box;
}

/* Heading */
.slider .heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 30px;
    gap: 20px;
}

.slider .heading-left {
    max-width: 850px;
    margin-right: 30px;
}

.slider .heading-left .subtitle {
    margin-bottom: 8px;
}

.slider .heading-left .subtitle h3 {
    font-size: 22px;
    font-weight: 400;
    text-transform: none;
    color: var(--black);
}

/* .slider .heading-left .title h2 {
    font-size: 32px;
    font-weight: 500;
    line-height: 1.3;
} */

.slider .heading-right {
    display: flex;
    align-items: center;
    gap: 24px;
}

.slider .heading-right .a-button a.btn-link {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s ease;
    padding: 12px 20px;
    border: 1px solid #004A99;
    border-radius: 5px;
}

.slider .heading-right .a-button a.btn-link:hover {
    background-color: #004A99;
    color: #fff;
}

/* Navigation Arrows */
.slider .heading-right .arrows {
    display: flex;
    gap: 8px;
}

.slider .slider-arrow {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    color: #004A99;
}

.slider .slider-arrow:hover {
    color: #1BA0CC;
}

.slider .slider-arrow i {
    font-size: 20px;
}

/* Items Container */
.slider .items-container {
    margin-top: 30px;
    position: relative;
    z-index: 2;
}

/* Items - The overflow trick */
.slider .items-container .items {
    display: flex;
    gap: 15px;
    position: relative;
    margin-right: calc(-50vw + 50%);
    /* Push the slider to overflow on the right */
    width: calc(100% + 50vw - 50%);
    /* Extend the slider width to go beyond the container */
    margin-left: -10px;
}

/* Slick Slider Overrides */
.slider .slick-list {
    padding: 0 20% 0 0 !important;
    /* Creates the peek effect */
    overflow: visible;
    max-width: 1530px;
}

.slider .slick-track,
.slider .slick-list {
    transition-delay: 10ms;
}

/* Individual Item */
.slider .item {
    flex: 1 1 calc(33.333% - 15px);
    background-color: transparent;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    margin: 0 15px;
    opacity: 0.5;
    transition: opacity 0.5s;
}

/* Active slide is full opacity */
.slider .slick-slide.slick-active {
    opacity: 1 !important;
}

.slider .item .post-thumbnail {
    position: relative;
    margin-bottom: 10px;
    overflow: hidden;
    border-radius: 0px;
}

/* Blue accent line on left of image */
/* .slider .item .post-thumbnail::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background-color: #004A99;
    z-index: 2;
} */

.slider .item .post-thumbnail a {
    display: block;
    position: relative;
}

.slider .item .post-thumbnail img {
    width: 100%;
    height: 355px;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: 10px;
}

.slider .item:hover .post-thumbnail img {
    transform: scale(1.02);
    transition: 0.4s;
}

.slider .item .post-content {
    display: flex;
    justify-content: space-between;
    padding: 15px 15px;
    align-items: flex-start;
    gap: 5px;
    flex-direction: column;
}

.slider .item .item-title {
    margin-bottom: 8px;
}

.slider .item .item-title a,
.slider .item .item-title {
    font-size: 22px;
    font-weight: 400;
    color: rgba(0, 0, 0, 1);
    text-decoration: none;
    transition: color 0.3s ease;
}

.slider .item .item-title a:hover {
    color: #004A99;
}

.slider .item .text {
    font-size: 14px;
    line-height: 1.6;
    color: #666;
}

.slider .item .text p {
    margin: 0;
    padding-top: 0;
    color: var(--grey);
}

/* Responsive */
@media (max-width: 1300px) {
    .slider .slick-list {
        max-width: none;
        overflow: hidden;
    }

    .slider .items-container .items {
/*         margin-left: 40px; */
    }

    .slider-container {
        padding: 0 60px;
    }
}

@media (max-width: 1000px) {
    .slider .items-container .items {
/*         margin-left: 55px; */
    }

    .slider .item {
        margin: 0 10px;
    }

    .slider .items-container {
        margin-left: -10px;
    }

    .slider .item .item-title a {
        font-size: 22px;
    }

    .slider-container {
        padding: 0 40px;
    }
}

@media (max-width: 768px) {
    .slider {
        padding: 50px 0;
    }

    .slider .heading {
/*         flex-direction: column;
        align-items: flex-start; */
    }

    .slider .heading-left {
        margin-right: 0;
    }

    .slider .heading-right {
/*         width: 100%; */
        justify-content: space-between;
        margin-top: 5px;
    }




    .slider .item .post-thumbnail img {
        height: 200px;
    }
}

@media (max-width: 600px) {
    .slider {
        padding: 40px 0 40px 20px;
    }

    .slider-container {
        padding: 0 20px 0 0;
    }

    .slider .slick-list {
        padding: 0 10% 0 0 !important;
    }

    .slider .items-container .items {
        margin-left: 0;
        display: block;
    }

    .slider .item {
        margin: 0 10px;
    }

    .slider .item .post-thumbnail img {
        height: 225px;
        min-height: 225px;
        max-height: 225px;
    }

    .slider .item .item-title a,
    .slider .item .item-title {
        font-size: 22px;
    }

    .slider .item .text {
        font-size: 14px;
    }

    .slider .item .post-content {
        padding: 10px 0px 0;
        gap: 0px;
    }

    .slider .heading .arrows i {
        font-size: 25px;
    }
	
	.slider .heading {
		flex-direction: column;
	}
	
	.slider.no-bottom-padding {
		padding-bottom: 60px;
	}
	.slider .heading-left {
		width: 100%;
	}
	.slider .heading-right {
		width: 100%;
	}
}

/* ===========================================
   RESOURCE SLIDER STYLES
   =========================================== */

.slider.resource-slider .item.resource-item {
    opacity: 0.5;
    transition: 0.5s;
}

.slider.resource-slider .slick-slide.slick-active .item.resource-item {
    opacity: 1;
}

/* Resource Card Container */
.slider .resource-card {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.slider .resource-card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    transform: translateY(-4px);
}

/* ---- Card Media ---- */
.slider .resource-card-media {
    position: relative;
    height: 280px;
    overflow: hidden;
    background: #f0f2f5;
    flex-shrink: 0;
}

.slider .resource-card-media img,
.slider .resource-card-media .resource-media-link img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.slider .resource-card:hover .resource-card-media img {
    transform: scale(1.04);
}

.slider .resource-card-media .resource-media-link {
    display: block;
    height: 100%;
}

/* YouTube video embed */
.slider .resource-video-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
}

.slider .resource-video-wrapper iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Icon placeholder (no thumbnail) */
.slider .resource-icon-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: #f0f4f8;
}

.slider .resource-icon-placeholder i {
    font-size: 100px;
    opacity: 0.6;
}

/* Placeholder background colours by badge class */
.slider .resource-icon-placeholder.badge-green-bg {
    background: linear-gradient(135deg, #e8f5e9, #c8e6c9);
}

.slider .resource-icon-placeholder.badge-green-bg i {
    color: #2e7d32;
}

.slider .resource-icon-placeholder.badge-orange-bg {
    background: #DBEAFE;
}

.slider .resource-icon-placeholder.badge-orange-bg i {
    color: #1447E6;
}

.slider .resource-icon-placeholder.badge-coral-bg {
    background: #FFEDD4;
}

.slider .resource-icon-placeholder.badge-coral-bg i {
    color: #CA3500;
}

.slider .resource-icon-placeholder.badge-red-bg {
    background: #FFE2E2;
}

.slider .resource-icon-placeholder.badge-red-bg i {
    color: #C10007;
}

.slider .resource-icon-placeholder.badge-blue-bg {
    background: #F3E8FF;
}

.slider .resource-icon-placeholder.badge-blue-bg i {
    color: #8200DB;
}

.slider .resource-icon-placeholder.badge-navy-bg {
    background: linear-gradient(135deg, #e3e9f0, #cfd9e6);
}

.slider .resource-icon-placeholder.badge-navy-bg i {
    color: #1a2a44;
}

.slider .resource-icon-placeholder.badge-teal-bg {
    background: linear-gradient(135deg, #e0f7fa, #b2ebf2);
}

.slider .resource-icon-placeholder.badge-teal-bg i {
    color: #00796b;
}

/* Type badge (top-left overlay) */
.slider .resource-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 5;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 400;
    text-transform: capitalize;
    letter-spacing: 0.3px;
    color: #fff;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.slider .resource-badge:hover {
    opacity: 0.85;
}

.slider .resource-badge i {
    font-size: 11px;
}

/* Badge colours */
.slider .resource-badge.badge-green {
    background: transparent;
    color: #008236;
    border: 1px solid #B9F8CF;
}

.slider .resource-badge.badge-orange {
    background: #DBEAFE;
    color: #1447E6;
    border: 1px solid #BEDBFF;
}

.slider .resource-badge.badge-coral {
    background: #f97316;
}

.slider .resource-badge.badge-red {
    background: #FFE2E2;
    color: #C10007;
    border: 1px solid #FFC9C9;
}

.slider .resource-badge.badge-blue {
    background: #F3E8FF;
    color: #8200DB;
    border: 1px solid #E9D4FF;
}

.slider .resource-badge.badge-navy {
    background: #1e3a5f;
}

.slider .resource-badge.badge-teal {
    background: #0d9488;
}

/* ---- Card Content ---- */
.slider .resource-card-content {
    padding: 18px 20px 20px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.slider .resource-card-title {
    font-size: 22px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--black);
    margin: 0 0 10px;
}

.slider .resource-card-title a {
    color: inherit;
    text-decoration: none;
    transition: color 0.3s ease;
    font-size: 22px;
    font-weight: 400;
}

.slider .resource-card-title a:hover {
    color: #004A99;
}

.slider .resource-card-excerpt {
    font-size: 14px;
    line-height: 1.6;
    color: #666;
    flex-grow: 1;
    margin-bottom: 14px;
}

.slider .resource-card-excerpt p {
    margin: 0;
}

/* ---- Meta row ---- */
.slider .resource-card-meta {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-top: 14px;
    margin-top: auto;
}

.slider .resource-card-meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 16px;
    color: var(--blue);
    font-weight: 500;
}

.slider .resource-card-meta .meta-date i,
.slider .resource-card-meta .meta-read-time i {
    color: var(--blue);
}

.slider .resource-card-meta .meta-download,
.slider .resource-card-meta .meta-slides {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 16px;
    font-weight: 400;
    color: var(--blue);
    text-decoration: none;
    transition: color 0.2s ease;
}

.slider .resource-card-meta .meta-download:hover,
.slider .resource-card-meta .meta-slides:hover {
    color: #003070;
}

/* Responsive Resource Cards */
@media (max-width: 768px) {
    .slider .resource-card-media {
        height: 180px;
    }

    .slider .resource-card-content {
        padding: 14px 16px 16px;
    }

    .slider .resource-card-title {
        font-size: 18px;
    }
}

@media (max-width: 600px) {
    .slider .resource-card-media {
        height: 160px;
    }

    .slider .resource-icon-placeholder i {
        font-size: 40px;
    }

    .slider .resource-badge {
        font-size: 11px;
        padding: 4px 8px;
    }

    .slider .resource-card-excerpt {
        font-size: 13px;
    }

    .slider .resource-card-meta .meta-date,
    .slider .resource-card-meta .meta-read-time,
    .slider .resource-card-meta .meta-download,
    .slider .resource-card-meta .meta-slides {
        font-size: 12px;
    }
}

/* ===========================================
   INDUSTRY SLIDER STYLES
   =========================================== */

.slider.industry-slider .item.industry-item {
    opacity: 0.5;
    transition: 0.5s;
}

.slider.industry-slider .slick-slide.slick-active .item.industry-item {
    opacity: 1;
}

/* Industry Card */
.slider.industry-slider .industry-card {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    height: 100%;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.slider.industry-slider .industry-card:hover {
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1);
    transform: translateY(-3px);
}

/* Card Inner — horizontal layout */
.slider.industry-slider .industry-card-inner {
    display: flex;
    align-items: stretch;
    height: 100%;
}

/* Card Image */
.slider.industry-slider .industry-card-image {
    flex: 0 0 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: #f8f9fa;
}

.slider.industry-slider .industry-card-image a {
    display: flex;
    align-items: center;
    justify-content: center;
}

.slider.industry-slider .industry-card-image img {
    max-width: 120px;
    max-height: 180px;
    width: auto;
    height: auto;
    object-fit: contain;
    transition: transform 0.4s ease;
	
}

.slider.industry-slider .industry-card:hover .industry-card-image img {
    transform: scale(1.05);
}

/* Card Content */
.slider.industry-slider .industry-card-content {
    flex: 1;
    padding: 20px 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

/* Product Type Label */
.slider.industry-slider .product-type-label {
    margin-bottom: 8px;
}

.slider.industry-slider .product-type-label span {
    display: inline-block;
    padding: 7px 7px;
    background-color: #004A99;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* Item Title */
.slider.industry-slider .item-title {
    margin-bottom: 6px;
}

.slider.industry-slider .item-title a {
    font-size: 18px;
    font-weight: 700;
    color: #1a1a1a;
    text-decoration: none;
    transition: color 0.3s ease;
    line-height: 1.3;
}

.slider.industry-slider .item-title a:hover {
    color: #004A99;
}

/* Text/Description */
.slider.industry-slider .industry-card-content .text {
    font-size: 14px;
    line-height: 1.5;
    color: #666;
    margin-bottom: 10px;
}

.slider.industry-slider .industry-card-content .text p {
    margin: 0;
}

/* Working Time */
.slider.industry-slider .working-time {
    font-size: 12px;
    color: var(--blue);
    font-weight: 400;
    margin-bottom: 14px;
    text-decoration: underline;

}

/* Substrate Tags */
.slider.industry-slider .substrate-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
/*     margin-top: auto; */
	margin-top: 0;
}

.slider.industry-slider .substrate-tag {
    display: inline-block;
    padding: 4px 12px;
    background-color: #f0f2f5;
    color: #555;
    font-size: 12px;
    font-weight: 400;
    border-radius: 3px;
    white-space: nowrap;
}

.slider.industry-slider .substrate-tag.substrate-hidden {
	display: none;
}
.slider.industry-slider .substrate-tag.substrate-hidden.substrate-visible {
	display: inline-block;
}
/* Responsive Industry Slider */
@media (max-width: 1000px) {
    .slider.industry-slider .industry-card-image {
        flex: 0 0 130px;
        padding: 15px;
    }

    .slider.industry-slider .industry-card-image img {
        max-width: 100px;
        max-height: 150px;
    }

    .slider.industry-slider .industry-card-content {
        padding: 15px 18px;
    }
}

@media (max-width: 768px) {
    .slider.industry-slider .industry-card-inner {
        flex-direction: column;
    }

    .slider.industry-slider .industry-card-image {
        flex: none;
        width: 100%;
        padding: 20px;
        min-height: 160px;
    }

    .slider.industry-slider .industry-card-image img {
        max-width: 130px;
        max-height: 160px;
    }

    .slider.industry-slider .industry-card-content {
        padding: 18px;
    }

    .slider.industry-slider .item-title a {
        font-size: 16px;
    }
}

@media (max-width: 600px) {
    .slider.industry-slider .industry-card-image {
        min-height: 140px;
        padding: 15px;
    }

    .slider.industry-slider .industry-card-content {
        padding: 15px;
    }

    .slider.industry-slider .industry-card-content .text {
        font-size: 13px;
    }

    .slider.industry-slider .substrate-tag {
        font-size: 11px;
        padding: 3px 8px;
    }

    .slider.industry-slider .working-time {
        font-size: 12px;
    }
}

/* ===========================================
   RESOURCE SLIDER STYLES
   =========================================== */

.slider.resource-slider .item.resource-item {
    opacity: 0.5;
    transition: 0.5s;
}

.slider.resource-slider .slick-slide.slick-active .item.resource-item {
    opacity: 1;
}

/* Resource Card Container */
.slider .resource-card {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
    width: 100%;
}

.slider .resource-card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    transform: translateY(-4px);
}

/* Resource Thumbnail Area */
.slider .resource-thumbnail {
    position: relative;
    height: 200px;
    overflow: hidden;
}

.slider .resource-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.slider .resource-card:hover .resource-thumbnail img {
    transform: scale(1.05);
}

/* Icon Background Styles (for Literature, Data Sheet without images) */
.slider .resource-thumbnail.icon-background {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Literature - Green background */
.slider .resource-type-literature .resource-thumbnail.icon-background {
    background: linear-gradient(135deg, #E8F5E9 0%, #C8E6C9 100%);
}

.slider .resource-type-literature .resource-icon {
    color: #4CAF50;
}

.slider .resource-type-literature .resource-icon svg {
    width: 80px;
    height: 80px;
    fill: #4CAF50;
}

/* Data Sheet - Orange background */
.slider .resource-type-data_sheet .resource-thumbnail.icon-background,
.slider .resource-type-data-sheet .resource-thumbnail.icon-background {
    background: linear-gradient(135deg, #FFF3E0 0%, #FFE0B2 100%);
}

.slider .resource-type-data_sheet .resource-icon,
.slider .resource-type-data-sheet .resource-icon {
    color: #FF7043;
}

.slider .resource-type-data_sheet .resource-icon svg,
.slider .resource-type-data-sheet .resource-icon svg {
    width: 80px;
    height: 80px;
    fill: #FF7043;
}

/* Video/Webinar - Blue accent */
.slider .resource-type-video .resource-thumbnail,
.slider .resource-type-webinar .resource-thumbnail {
    background: #E3F2FD;
}

/* Resource Icon */
.slider .resource-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.slider .resource-icon.default-icon svg {
    width: 80px;
    height: 80px;
}

.slider .resource-icon img {
    max-width: 100px;
    max-height: 100px;
    object-fit: contain;
}

/* Category Label */
.slider .resource-label {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 5;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    text-transform: capitalize;
}

/* Label Colors by Type */
.slider .resource-type-literature .resource-label {
    background: rgba(76, 175, 80, 0.15);
    color: #2E7D32;
    border: 1px solid rgba(76, 175, 80, 0.3);
}

.slider .resource-type-video .resource-label,
.slider .resource-type-webinar .resource-label {
    background: rgba(33, 150, 243, 0.9);
    color: #fff;
}

.slider .resource-type-data_sheet .resource-label,
.slider .resource-type-data-sheet .resource-label {
    background: rgba(255, 112, 67, 0.15);
    color: #E65100;
    border: 1px solid rgba(255, 112, 67, 0.3);
}

.slider .resource-label i {
    font-size: 11px;
}

/* Resource Content */
.slider .resource-content {
    padding: 20px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.slider .resource-item .item-title {
    margin-bottom: 10px;
}

.slider .resource-item .item-title a {
    font-size: 18px;
    font-weight: 600;
    color: #1a1a1a;
    text-decoration: none;
    display: block;
    line-height: 1.4;
    transition: color 0.3s ease;
}

.slider .resource-item .item-title a:hover {
    color: #004A99;
}

.slider .resource-item .text {
    font-size: 14px;
    line-height: 1.6;
    color: #666;
    margin-bottom: 15px;
    flex-grow: 1;
}

.slider .resource-item .text p {
    margin: 0;
}

/* Resource Meta Row */
.slider .resource-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 15px;
    border-top: 1px solid #eee;
    margin-top: auto;
    flex-wrap: wrap;
    gap: 10px;
}

.slider .resource-meta .meta-left {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.slider .resource-meta .meta-date,
.slider .resource-meta .meta-time {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #888;
}

.slider .resource-meta .meta-date i,
.slider .resource-meta .meta-time i {
    font-size: 14px;
    color: #004A99;
}

.slider .resource-meta .meta-right {
    margin-left: auto;
}

.slider .resource-meta .download-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #004A99;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s ease;
}

.slider .resource-meta .download-link:hover {
    color: #1BA0CC;
}

.slider .resource-meta .download-link i {
    font-size: 14px;
}

/* Responsive Resource Cards */
@media (max-width: 768px) {
    .slider .resource-thumbnail {
        height: 180px;
    }

    .slider .resource-content {
        padding: 15px;
    }

    .slider .resource-item .item-title a {
        font-size: 16px;
    }

    .slider .resource-meta {
        flex-direction: column;
        align-items: flex-start;
    }

    .slider .resource-meta .meta-right {
        margin-left: 0;
        margin-top: 5px;
    }
}

@media (max-width: 600px) {
    .slider .resource-thumbnail {
        height: 160px;
    }

    .slider .resource-icon.default-icon svg {
        width: 60px;
        height: 60px;
    }

    .slider .resource-label {
        padding: 4px 8px;
        font-size: 11px;
    }

    .slider .resource-item .text {
        font-size: 13px;
    }

    .slider .resource-meta .meta-date,
    .slider .resource-meta .meta-time,
    .slider .resource-meta .download-link {
        font-size: 12px;
    }
}

/* ===========================================
   INDUSTRY SLIDER STYLES
   =========================================== */

.slider.industry-slider .item.industry-item {
    opacity: 0.5;
    transition: 0.5s;
}

.slider.industry-slider .slick-slide.slick-active .item.industry-item {
    opacity: 1;
}

/* Industry Card */
.slider.industry-slider .industry-card {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    height: 100%;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.slider.industry-slider .industry-card:hover {
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1);
    transform: translateY(-3px);
}

/* Card Inner — horizontal layout */
.slider.industry-slider .industry-card-inner {
    display: flex;
    align-items: stretch;
    height: 100%;
}

/* Card Image */
.slider.industry-slider .industry-card-image {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: #fff;
	
}

.slider.industry-slider .industry-card-image a {
    display: flex;
    align-items: center;
    justify-content: center;
}

.slider.industry-slider .industry-card-image img {
    max-width: 230px;
/*     max-height: 180px; */
    width: auto;
    height: auto;
/*     object-fit: contain; */
	object-fit: cover;
    transition: transform 0.4s ease;
	height: 360px;
	display: block;
	max-height: none;
}

.slider.industry-slider .industry-card:hover .industry-card-image img {
    transform: scale(1.05);
}

/* Card Content */
.slider.industry-slider .industry-card-content {
    flex: 1;
    padding: 20px 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

/* Product Type Label */
.slider.industry-slider .product-type-label {
    margin-bottom: 8px;
}

.slider.industry-slider .product-type-label span {
    display: inline-block;
    padding: 7px 7px;
    background-color: var(--blue);
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* Item Title */
.slider.industry-slider .item-title {
    margin-bottom: 6px;
}

.slider.industry-slider .item-title a {
    font-size: 22px;
    font-weight: 400;
    color: #000;
    text-decoration: none;
    transition: color 0.3s ease;
    line-height: 1.3;
}

.slider.industry-slider .item-title a:hover {
    color: #004A99;
}

/* Text/Description */
.slider.industry-slider .industry-card-content .text {
    font-size: 14px;
    line-height: 1.5;
    color: #666;
    margin-bottom: 10px;
}

.slider.industry-slider .industry-card-content .text p {
    margin: 0;
}

/* Working Time */
.slider.industry-slider .working-time {
    font-size: 12px;
    color: var(--blue);
    font-weight: 400;
    margin-bottom: 14px;
    
}

/* Substrate Tags */
.slider.industry-slider .substrate-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
/*     margin-top: auto; */
}

.slider.industry-slider .substrate-tag {
    display: inline-block;
    padding: 4px 12px;
    background-color: #f0f2f5;
    color: #555;
    font-size: 12px;
    font-weight: 400;
    border-radius: 3px;
    white-space: nowrap;
	white-space: normal;
}

/* Responsive Industry Slider */
@media (max-width: 1000px) {
    .slider.industry-slider .industry-card-image {
        flex: 0 0 130px;
        padding: 15px;
    }

    .slider.industry-slider .industry-card-image img {
        max-width: 100px;
        max-height: 150px;
    }

    .slider.industry-slider .industry-card-content {
        padding: 15px 18px;
    }
}

@media (max-width: 768px) {
    .slider.industry-slider .industry-card-inner {
/*         flex-direction: column; */
		flex-direction: row;
    }

/*     .slider.industry-slider .industry-card-image {
        flex: none;
        width: 100%;
        padding: 20px;
        min-height: 160px;
    }

    .slider.industry-slider .industry-card-image img {
        max-width: 130px;
        max-height: 160px;
    }
 */
    .slider.industry-slider .industry-card-content {
        padding: 18px;
    }

    .slider.industry-slider .item-title a {
        font-size: 16px;
    }
}

@media (max-width: 600px) {
    .slider.industry-slider .industry-card-image {
        min-height: 140px;
/*         padding: 15px; */
		padding: 0;
    }

    .slider.industry-slider .industry-card-content {
        padding: 15px;
    }

    .slider.industry-slider .industry-card-content .text {
        font-size: 13px;
    }

    .slider.industry-slider .substrate-tag {
        font-size: 11px;
        padding: 3px 8px;
    }

    .slider.industry-slider .working-time {
        font-size: 12px;
    }
}

/* ===========================================
   WIDE SLIDER STYLES
   Shows 2 slides instead of 3.
   Removes the slick-list max-width cap so the
   20% peek padding extends to the viewport edge.
   =========================================== */

.slider.wide .items-container .items {
    margin-left: 0;
}

/* Let slick-list fill the full bleed width at all sizes   
   (same as what ≤1300px media query does for all sliders) */
.slider.wide .slick-list {
    max-width: none;
    overflow: hidden;
}

@media (max-width: 1300px) {
    .slider.wide .items-container .items {
        margin-left: 0;
    }
}

@media (max-width: 1000px) {
    .slider.wide .items-container .items {
        margin-left: 0;
    }
}
/* =========================================
   Background CTA Section
   ========================================= */

.background-cta {
    position: relative;
    width: 100%;
    min-height: 450px;
    overflow: hidden;
    display: flex;
    align-items: center;
}

.background-cta.layout-text-top {
    align-items: flex-start;
}

.background-cta-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 0;
}

.background-cta-container {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 180px 60px;
    display: flex;
    justify-content: flex-end;
}

.background-cta .content {
    max-width: 500px;
}

.background-cta .content-inner {
    display: flex;
    flex-direction: column;

}




/* Text */
.background-cta .text {
    color: #fff;
    font-size: 16px;
    margin: 10px auto 20px;

}

.background-cta .text p {
    margin: 0;
    color: var(--white);
}

/* Button - Cyan Outline Style (default layout) */
.background-cta .a-button {
    margin-top: 10px;
}

.background-cta .btn-main.cyan-outline-bg {
    display: inline-block;
    background-color: transparent;
    color: #ededed;
    border: 2px solid #1BA0CC;
    padding: 14px 30px;
    font-size: 16px;
    font-weight: 400;
    text-decoration: none;
    border-radius: 5px;
    transition: all 0.3s ease;
    text-align: center;
}

.background-cta .btn-main.cyan-outline-bg:hover {
    background-color: #1BA0CC;
    color: #ffffff;
}

.background-cta .a-button .btn-main {
    padding: 15px 50px;
    width: fit-content;
}
.background-cta .a-button .btn-main:hover {
	opacity: 0.7;
}
/* Title underline accent */
.background-cta.has-underline .title h2::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background-color: #FFE800;
    margin-top: 16px;
}

.background-cta.has-underline .content-inner {
    align-items: center;
}

.background-cta.has-underline .title h2::after {
    margin-left: auto;
    margin-right: auto;
}


/* =========================================
   Layout: Text Top
   Full background image, text centered at top
   ========================================= */

.background-cta.layout-text-top {
    min-height: 630px;
    background-color: #0c1320;
}

.background-cta.layout-text-top .background-cta-container {
    justify-content: center;
    text-align: center;
    padding: 70px 60px;
}

.background-cta.layout-text-top .content {
    max-width: 950px;
    margin: 0 auto;
}

.background-cta.layout-text-top .content p {
    color: var(--white) !important;
}

.background-cta.layout-text-top .content-inner {
    align-items: center;
}

.background-cta.layout-text-top .title h2 {
    font-size: 36px;
    font-weight: 400;
    color: #ededed;
}

.background-cta.layout-text-top .text {
    color: #c0c0c0;
    font-size: 15px;
}


/* =========================================
   Layout: Contained
   Blue gradient rounded card, centered 
   content, typically on a light page
   ========================================= */

.background-cta.layout-contained {
    min-height: auto;
    background: transparent;
    display: flex;
    justify-content: center;
    padding: 60px 30px;
    box-sizing: border-box;
}

.background-cta.layout-contained .background-cta-container {
   background: linear-gradient(19deg, #FAFBFB -41.13%, #004A99 52.87%);

    border-radius: 16px;
    justify-content: center;
    text-align: center;
    padding: 60px 30px;
    max-width: 1280px;
    box-sizing: border-box;
}

.background-cta.layout-contained .content {
    max-width: 950px;
    margin: 0 auto;
}

.background-cta.layout-contained .content-inner {
    align-items: center;
}

.background-cta.layout-contained .title h2 {
    font-size: 34px;
    font-weight: 500;
    color: #ffffff;
}

.background-cta.layout-contained .text {
    color: #d4e3f5;
    font-size: 15px;
    line-height: 1.6;
}

.background-cta.layout-contained .text p {
    margin: 0;
}

.background-cta.layout-contained .text>* {
    color: var(--white);
}

/* =========================================
   Responsive Styles — Default (Text Right)
   Layout
   ========================================= */

@media (max-width: 1200px) {
    .background-cta-container {
        padding: 60px 40px;
    }

    .background-cta .title h2 {
        font-size: 34px;
    }
}

@media (max-width: 991px) {
    .background-cta {
        min-height: 400px;
    }

    .background-cta-container {
        justify-content: center;
        text-align: center;
    }

    .background-cta .content {
        max-width: 600px;
    }

    .background-cta .content-inner {
        align-items: center;
    }
}

@media (max-width: 768px) {
    .background-cta {
        min-height: 350px;
    }

    .background-cta-container {
        padding: 50px 30px;
    }

    .background-cta .title h2 {
        font-size: 28px;
    }

    .background-cta .subtitle h3 {
        font-size: 14px;
    }

    .background-cta .text {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .background-cta-container {
        padding: 40px 20px;
    }

    .background-cta .title h2 {
        font-size: 24px;
    }

    .background-cta .btn-main {
        padding: 12px 24px;
        font-size: 14px;
    }
}


/* =========================================
   Responsive Styles — Text Top Layout
   ========================================= */

@media (max-width: 991px) {
    .background-cta.layout-text-top .background-cta-container {
        padding: 60px 30px 30px;
    }

    .background-cta.layout-text-top .title h2 {
        font-size: 30px;
    }

    .background-cta-globe-image img {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .background-cta.layout-text-top .background-cta-container {
        padding: 80px 40px 80px;
    }

    .background-cta.layout-text-top .title h2 {
        font-size: 26px;
    }

    .background-cta.layout-text-top .text {
        font-size: 14px;
    }
	
	.background-cta.layout-text-top {
		min-height: 0;
	}
}


/* =========================================
   Responsive Styles — Contained Layout
   ========================================= */

@media (max-width: 991px) {
    .background-cta.layout-contained {
        padding: 40px 20px;
    }

    .background-cta.layout-contained .background-cta-container {
        padding: 50px 30px;
    }

    .background-cta.layout-contained .title h2 {
        font-size: 28px;
    }
}

@media (max-width: 600px) {
    .background-cta.layout-contained {
        padding: 30px 15px;
    }

    .background-cta.layout-contained .background-cta-container {
        padding: 40px 20px;
        border-radius: 12px;
    }

    .background-cta.layout-contained .title h2 {
        font-size: 24px;
    }

    .background-cta.layout-contained .text {
        font-size: 13px;
    }
}

/* Home Hero Section
   ================== */

.home-hero {
    position: relative;
    padding: 60px 0;

}

.home-hero::after {
    background: var(--SCIGRIP-LINEAR, linear-gradient(180deg,
                #004A99 0%,
                rgba(0, 74, 153, 0.85) 30%,
                rgba(0, 74, 153, 0.15) 75%,
                rgba(255, 255, 255, 0) 100%));
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: calc(100% + 200px);
    content: '';
}

.home-hero-container {
    max-width: 1530px;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    align-items: center;
    gap: 60px;
    position: relative;
    z-index: 1;
	box-sizing: border-box;
}

/* Left Content Area */
.home-hero .left {
    width: calc(40% - 30px);
    flex-shrink: 0;
}

.home-hero .left-inner {
/*     max-width: 520px; */
}

/* Subtitle Styling */
.home-hero .subtitle {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 16px;
    text-transform: capitalize;
}

/* Title Styling */
.home-hero .title h1 {
    font-size: 46px;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 20px;
    color: #fff;
}

/* Text Styling */
.home-hero .text {
    font-size: 15px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 28px;
}

.home-hero .text p {
    margin: 0;
    color: var(--white);
}

/* Buttons */
.home-hero .buttons {
    display: flex;
    gap: 15px;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.home-hero .a-button a.btn-main {
    /*     min-width: 140px; */
    /*     padding: 12px 24px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 6px; */
}

/* White button (uses global .white-bg) */
.home-hero .a-button a.btn-main.white-bg {
    border: 1.5px solid transparent;
}

.home-hero .a-button a.btn-main.white-bg:hover {
    background-color: #d9d9d9;
}

/* Yellow button (uses global .yellow-bg) */
.home-hero .a-button a.btn-main.yellow-bg {
    border: 1.5px solid transparent;
}

.home-hero .a-button a.btn-main.yellow-bg:hover {
    background-color: #e6d000;
}

/* Logos Repeater */
.home-hero .logos-repeater {
    display: flex;
    align-items: center;
}

.home-hero .logos-track {
    display: flex;
    align-items: center;
}

.home-hero .logos-set {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
}

.home-hero .logos-set.duplicate {
    display: none;
}

.home-hero .logo-item {
    max-width: 80px;
    opacity: 0.9;
    flex-shrink: 0;
}

.home-hero .logo-item img {
    max-width: 100%;
    height: auto;
    filter: brightness(0) invert(1);
}

/* Right Media Area */
.home-hero .right {
    width: calc(60% - 30px);
    flex-shrink: 0;
}

.home-hero .media-container {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}

.home-hero .media-container img,
.home-hero .media-container video {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

.home-hero .media-container video {
	height: 600px;
}

/* Responsive Styles */
@media (max-width: 1200px) {
    .home-hero .title h1 {
        font-size: 36px;
    }

    .home-hero .left-inner {
        max-width: 480px;
    }
}

@media (max-width: 991px) {
    .home-hero-container {
        flex-direction: column;
        gap: 40px;
    }

    .home-hero .left,
    .home-hero .right {
        width: 100%;
    }

    .home-hero .left-inner {
        max-width: 100%;
    }

    .home-hero .title h1 {
        font-size: 34px;
    }

    .home-hero .right {
        order: -1;
    }
	
	.home-hero .media-container video {
		height: auto;
	}
}

@media (max-width: 768px) {
    .home-hero {
        padding: 40px 0;
    }

    .home-hero-container {
        padding: 0 20px;
    }

    .home-hero .title h1 {
        font-size: 28px;
    }

    .home-hero .text {
        font-size: 14px;
    }

    .home-hero .buttons {
        flex-direction: column;
        gap: 12px;
    }

    .home-hero .a-button {
        width: 100%;
    }

    .home-hero .a-button a.btn-main {
        width: 100%;
    }
}

/* Mobile Infinite Marquee for Logos */
@media (max-width: 600px) {
    .home-hero .logos-repeater {
        overflow: hidden;
        mask-image: linear-gradient(to right, transparent 0%, #000 10%, #000 90%, transparent 100%);
        -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 10%, #000 90%, transparent 100%);
    }

    .home-hero .logos-track {
        flex-wrap: nowrap;
        gap: 0;
        will-change: transform;
    }

    .home-hero .logos-set {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 32px;
        flex-shrink: 0;
        padding-right: 32px;
    }

    .home-hero .logos-set.duplicate {
        display: flex;
    }

    .home-hero .logo-item {
        max-width: 70px;
    }
	
	.home-hero .left-inner {
		text-align: center;
	}
}

@media (max-width: 480px) {
    .home-hero .title h1 {
        font-size: 24px;
    }

    .home-hero .media-container {
        border-radius: 12px;
    }
}

/* ==========================================================================
   Text Left Sections Right - Single Layout
   3 types: content, icon_list, list
   ========================================================================== */

.text-left-sections-right {
    padding: 60px 0;
/*     background-color: #fff; */
	position: relative;
}

.text-left-sections-right.blue-bg {
   background: var(--SCIGRIP---Gradient, linear-gradient(32deg, #013383 24.18%, #004A99 100%));

}

.text-left-sections-right.blue-bg .title h2 {
    color: #fff;
}

.text-left-sections-right.blue-bg .title h2::after {
    background-color: #FFE800;
}

.text-left-sections-right.blue-bg.blue-bullets .title h2::after {
	background-color: var(--cyan);
}

.text-left-sections-right.blue-bg .content-wrapper .text p {
    color: rgba(255, 255, 255, 0.85);
}

.text-left-sections-right.blue-bg .content-wrapper .text p:first-child {
    color: #fff;
}

.text-left-sections-right.blue-bg .icon-content h4 {
    color: #fff;
}

.text-left-sections-right.blue-bg .icon-content p {
    color: rgba(255, 255, 255, 0.8);
}

.text-left-sections-right.blue-bg .icon-box {
    background-color: rgba(255, 255, 255, 0.15);
}

.text-left-sections-right.blue-bg .item-text {
    color: #fff;
}

.text-left-sections-right.blue-bg .diamond-bullet {
    background-color: var(--yellow);
}
.text-left-sections-right.blue-bullets .diamond-bullet {
	background-color: var(--cyan);
}

.text-left-sections-right.blue-bg .logos {
    border-top-color: rgba(255, 255, 255, 0.2);
}

.tlsr-container {
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 30px;
    display: flex;
    box-sizing: border-box;
    gap: 60px;
}

/* Left Column - Title
   ========================================================================== */

.text-left-sections-right .left {
    width: 300px;
    flex-shrink: 0;
}

.text-left-sections-right.two-rows .left {
	width: 400px;
}

.text-left-sections-right.one-row .left {
	width: 400px;
}

.text-left-sections-right .title h2 {

    color: var(--blue);

    position: relative;
    padding-bottom: 15px;
}

.text-left-sections-right .title h2::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 80px;
    height: 2px;
    background-color: var(--cyan);
}

/* Right Column
   ========================================================================== */

.text-left-sections-right .right {
    flex: 1;
    min-width: 0;
}

/* ==========================================================================
   Content Type
   ========================================================================== */

.text-left-sections-right .content-wrapper .text {
    margin-bottom: 25px;
}

.text-left-sections-right .content-wrapper .text ul {
	position: relative;
	list-style-type: none;
}

.text-left-sections-right .content-wrapper .text ul li {
	position: relative;
	display: -webkit-inline-box;
	width: 100%;
	gap: 15px;
	padding-top: 30px;
}

.text-left-sections-right.blue-bg .content-wrapper .text ul li {
	color: #fff;
}

.text-left-sections-right .content-wrapper .text ul li:first-of-type {
	padding-top: 0px;
}
.text-left-sections-right .content-wrapper .text ul li::before {

    content: "";

    width: 12px;
    height: 12px;
	min-width: 12px;
	min-height: 12px;
    background-color: var(--cyan);
    display: flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
    font-size: 14px;
	transform: rotate(45deg);
    top: 16px;
    font-weight: 700;
	position:relative;
	top: 5px;
	
	
}
.text-left-sections-right .content-wrapper .text h3 {
    font-size: 22px;
    font-weight: 400;
    color: var(--blue);
}

.text-left-sections-right .content-wrapper .text p {
    font-size: 16px;
    color: var(--grey);
    line-height: 1.7;
    margin-bottom: 12px;
}

.text-left-sections-right .content-wrapper .text p img {
	width: 100%;
}

/* The container holding the iframe */
.text-left-sections-right .content-wrapper .text .yt {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 Aspect Ratio (9 / 16 = 0.5625) */
    height: 0;
    overflow: hidden;
    width: 100%;
}

/* The actual iframe */
.text-left-sections-right .content-wrapper .text .yt iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    border: 0;
}

/* The container holding the iframe */
.text-left-sections-right .content-wrapper .text p.video {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 Aspect Ratio (9 / 16 = 0.5625) */
    height: 0;
    overflow: hidden;
    width: 100%;
}

/* The actual iframe */
.text-left-sections-right .content-wrapper .text p.video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    border: 0;
}

.text-left-sections-right .content-wrapper .text p:first-child {
/*     font-size: 22px;
    font-weight: 400;
    color: var(--blue);
    line-height: 1.5;
    padding-top: 0px; */
}

.text-left-sections-right .content-wrapper .text strong {
    /*     color: #333; */
}

/* Container-specific table styling */
.text-left-sections-right .content-wrapper .text table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
  font-family: sans-serif;
  font-size: 0.95rem;
  border: 1px solid #e0e0e0;
}

/* Header/First Row Styling */
.text-left-sections-right .content-wrapper .text table tr:first-child {
  background-color: #f8f9fa;
  color: #222;
}

/* Cell Styling */
.text-left-sections-right .content-wrapper .text table td {
  padding: 12px 15px;
  border: 1px solid #e0e0e0;
  vertical-align: top;
  line-height: 1.5;
}

/* Bold the first column for emphasis */
.text-left-sections-right .content-wrapper .text table td:first-child {
  font-weight: 600;
  color: #333;
}

/* Fix for nested <p> tags provided in your HTML */
.text-left-sections-right .content-wrapper .text table td p {
  margin: 0;
  padding: 0;
}

/* Subtle Row Hover */
.text-left-sections-right .content-wrapper .text table tr:hover {
  background-color: #fcfcfc;
}




/* Image */
.text-left-sections-right .content-wrapper .image {
    margin-bottom: 25px;
    border-radius: 10px;
    overflow: hidden;
}

.text-left-sections-right .content-wrapper .image img {
    width: 100%;
    height: auto;
    display: block;
}

/* Full Width Image */
.text-left-sections-right .tlsr-full-width-image {
    max-width: 1340px;
    margin: 30px auto 0;
    padding: 0 30px;
    box-sizing: border-box;
}

.text-left-sections-right .tlsr-full-width-image img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 10px;
}

/* Video */
.text-left-sections-right .video-wrapper {
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
    margin-bottom: 25px;
}

.text-left-sections-right .video-wrapper video {
    width: 100%;
    height: auto;
    display: block;
}

/* Logos */
.text-left-sections-right .logos {
    display: flex;
    gap: 25px;
    flex-wrap: wrap;
    align-items: center;
    padding-top: 20px;
/*     border-top: 1px solid #eee; */
}

.text-left-sections-right .logo-item img {
/*     max-height: 65px; */
	max-height: 65px;
	height: 100%;
    width: auto;
}

/* ==========================================================================
   Icon List Type
   ========================================================================== */

.text-left-sections-right .icons-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 25px 40px;
}

.text-left-sections-right .icon-item {
    width: calc(50% - 20px);
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.text-left-sections-right .icon-box {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    background-color: #004A99;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.text-left-sections-right .icon-box img {
    width: 22px;
    height: 22px;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.text-left-sections-right .icon-box i {
	color: #fff;
}

.text-left-sections-right .icon-content h4 {
    font-size: 22px;
    font-weight: 400;
    color: var(--blue);
    margin-bottom: 4px;
}

.text-left-sections-right .icon-content p {
    font-size: 16px;
    color: var(--grey);

}



/* ==========================================================================
   List Type
   ========================================================================== */

.text-left-sections-right.tlsr-list {
    background-color: #E8F4FC;
}

.text-left-sections-right .items-list {
    column-count: 3;
    column-gap: 35px;
}

.text-left-sections-right .list-item {
    break-inside: avoid;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 10px;
}

.text-left-sections-right.two-rows .items-list {
    column-count: 2;
}

.text-left-sections-right.one-row .items-list {
    column-count: 1;
}

.text-left-sections-right .diamond-bullet {
    width: 12px;
    height: 12px;
    background-color: var(--cyan);
    transform: rotate(45deg);
    flex-shrink: 0;
	position: relative;
	top: 6px;
}

.text-left-sections-right .item-text {
    font-size: 22px;
    color: var(--white);
}

.text-left-sections-right.tlsr-list .item-text {
	color: var(--black);
}

.text-left-sections-right.blue-bg .item-text {
	color: var(--white);
}

	.text-left-sections-right .icon-content p:first-of-type {
		padding-top: 5px;
	}

/* ==========================================================================
   Image Row
   ========================================================================== */

.tlsr-image-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 20px;
}

.tlsr-image-row-item {
    flex: 1 1 0;
    min-width: 0;
	
}

.tlsr-image-row-item img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
	background-color: #fff;
	padding: 20px;
	box-sizing: border-box;
	border-radius: 10px;
}

@media (max-width: 600px) {
	.tlsr-image-row {
		flex-direction: column;
	}
}

/* ==========================================================================
   Responsive Styles
   ========================================================================== */

@media (max-width: 1200px) {
    .tlsr-container {
        gap: 40px;
    }

    .text-left-sections-right .left {
        width: 180px;
    }
}

@media (max-width: 991px) {
    .text-left-sections-right {
        padding: 50px 0;
    }

    .tlsr-container {
        flex-direction: column;
        padding: 0 30px;
        gap: 20px;
    }

    .text-left-sections-right .left,
	.text-left-sections-right.two-rows .left,
	.text-left-sections-right.one-row .left {
        width: 100%;
    }

    .text-left-sections-right .icon-item {
        width: calc(50% - 15px);
    }
	.text-left-sections-right .items-list {
		column-count: 2;
	}

    .text-left-sections-right .list-item {
/*         width: calc(50% - 18px); */
    }
}

@media (max-width: 768px) {
    .text-left-sections-right {
        padding: 40px 0;
    }

    .tlsr-container {
        padding: 0 20px;
    }

    .text-left-sections-right .tlsr-full-width-image {
        padding: 0 20px;
    }

    .text-left-sections-right .title h2 {
        font-size: 22px;
    }

    .text-left-sections-right .icon-item {
        width: 100%;
    }
	
	

    .text-left-sections-right .icons-grid {
        gap: 20px;
    }

    .text-left-sections-right .list-item {
/*         width: calc(50% - 18px); */
    }
	.text-left-sections-right .items-list {
		column-count: 1;
	}
    .text-left-sections-right .play-button {
        width: 55px;
        height: 55px;
        font-size: 18px;
    }
	
	.text-left-sections-right .icon-content h4 {
		font-size: 18px;
	}
	
	.text-left-sections-right.blue-bg .icon-content p {
		font-size: 14px;
		
	}
	
	.text-left-sections-right .item-text {
		font-size: 18px;
	}
	
	.related-posts .item .text p {
		font-size: 14px;
	}
	.text-left-sections-right .diamond-bullet {
		width: 10px;
		height: 10px;
	}

}

@media (max-width: 480px) {
    .text-left-sections-right .list-item,
	.text-left-sections-right.two-rows .list-item {
        width: 100%;
    }

    .text-left-sections-right .items-list {
        gap: 8px;
    }
}
/* ==========================================================================
   Product Finder Styles
   ========================================================================== */
.page-id-45 .product-finder {

	padding-bottom: 20px;
}


.product-finder {
    padding: 80px 30px;
    box-sizing: border-box;
}

.product-finder.no-top-padding {
    padding-top: 0px;
}

.product-finder-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 40px;
    box-sizing: border-box;
    border-radius: 10px;
    box-shadow: 0 6px 8px 2px rgba(0, 74, 153, 0.10);
    background-color: #fff;
    position: relative;
}

/* Header */
.product-finder-header {
    text-align: center;
    margin-bottom: 40px;
}

.product-finder-header .title h2.product-finder-title {
    font-size: 22px;
    font-weight: 400;
    line-height: 1.3;
    max-width: 950px;
    margin: 0 auto;
}

.page-id-45 .product-finder-header .title h2.product-finder-title {
	font-size: 32px;
}

/* Tabs Wrapper */
.product-finder-tabs-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-bottom: 30px;
}

.product-finder-tabs {
    display: flex;
    background: #ffffff;
    border-radius: 50px;
    padding: 6px;
    box-shadow: 0 2px 12px rgba(0, 74, 153, 0.08);
    border: 1px solid #e0e8f0;
    width: 100%;
}

.tab-btn {
    padding: 14px 40px;
    font-size: 16px;
    font-weight: 500;
    color: #004A99;
    background: transparent;
    border: none;
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
    flex: 1 1 auto;
}

.tab-btn:hover {
    background: rgba(0, 74, 153, 0.05);
}

.tab-btn.active {
    background: var(--cyan);
    color: var(--blue);
    box-shadow: 0 4px 15px rgba(0, 74, 153, 0.3);
}

/* Search Toggle Button */
.search-toggle {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #ffffff;
    border: 1px solid #e0e8f0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 12px rgba(0, 74, 153, 0.08);
}

.search-toggle:hover {
    background: #004A99;
    border-color: #004A99;
}

.search-toggle:hover svg path {
    stroke: #ffffff;
}

/* Search Bar */
.product-finder-search {
    max-width: 600px;
    margin: 0 auto 30px;
    display: flex;
    gap: 10px;
    background: #ffffff;
    border-radius: 10px;
    padding: 8px;
    box-shadow: 0 4px 20px rgba(0, 74, 153, 0.1);
}

.product-finder-search input {
    flex: 1;
    padding: 12px 20px;
    font-size: 16px;
    border: none;
    outline: none;
    background: transparent;
	font-weight: 400;
}

.product-finder-search input::placeholder {
    color: #8a9ab0;
	font-weight: 400;
}

.search-submit {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    background: #004A99;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.search-submit:hover {
    background: #003366;
    transform: scale(1.05);
}

/* Filter Groups */
.product-finder-filters {
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.filter-group {
    display: none;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
}

.filter-group.active {
    display: flex;
}

.filter-label {
    font-size: 14px;
    color: #6b7c93;
    font-weight: 500;
}

.filter-selects {
    display: flex;
    gap: 15px;
    flex: 1;
}

.filter-select-wrap {
    position: relative;
    flex: 1;
    max-width: 300px;
}

.filter-select-wrap select {
    width: 100%;
    padding: 14px 45px 14px 20px;
    font-size: 14px;
    color: var(--blue);
    background: #FAFBFB;
    border: 1px solid #e0e8f0;
    border-radius: 8px;
    appearance: none;
    cursor: pointer;
    transition: all 0.3s ease;
}

.filter-select-wrap select {
	-webkit-appearance: none;
	border-radius: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='8' viewBox='0 0 13 8' fill='none'%3E%3Cpath d='M0.5 0.5L6.5 6.5L12.5 0.5' stroke='%23004A99' stroke-linecap='round'/%3E%3C/svg%3E");
	background-position: right 10px center;
	background-repeat: no-repeat;
	-moz-appearance: none;
}

.filter-select-wrap select:hover,
.filter-select-wrap select:focus {
    border-color: #004A99;
    box-shadow: 0 0 0 3px rgba(0, 74, 153, 0.1);
    outline: none;
}

.filter-select-wrap::after {
/*     content: '';
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #004A99;
    pointer-events: none; */
}

/* Results Count */
.product-finder-count {
    margin-left: auto;
    font-size: 14px;
    color: var(--grey);
    white-space: nowrap;
}

.product-finder-count span {
    font-weight: 400;
    color: var(--grey);
}

/* Products Grid */
.product-finder-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    margin-bottom: 40px;
    transition: opacity 0.3s ease;
}

.product-finder-grid.loading {
    /*     opacity: 0.5;
    pointer-events: none; */
}

/* Product Card */
.product-card {
    flex: 1 1 calc(20% - 25px);
    background: #FAFBFB;
    border-radius: 5px;
    padding: 20px;
    border: 1px solid #E2E8F0;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    text-align: left;
    box-sizing: border-box;
    /* Override WOW.js — prevent its visibility:hidden and animations */
    visibility: visible !important;
    animation: none !important;
}

.product-card.product-card-hidden {
    display: none;
}

.product-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 35px rgba(0, 74, 153, 0.12);
    border-color: #c5d6eb;
}

/* Product Badge */
.product-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 400;
    padding: 4px 6px;
    border-radius: 5px;
    margin-bottom: 15px;
    width: fit-content;
}

.product-badge.eu_only {
    background: #E2E8F0;
  color: var(--black);
}

.product-badge.us_only {
    background: #E2E8F0;
   color: var(--black);
}

.product-badge.worldwide {
    background: #E2E8F0;
    color: var(--black);
}

.badge-icon {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: inline-block;
    overflow: hidden;
    flex-shrink: 0;
}

/* Custom uploaded flag icon */
.badge-icon.custom {
    background: none;
}

.badge-icon.custom::after {
    display: none;
}

.badge-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Fallback CSS flag icons (used when no custom icon is uploaded) */
.badge-icon.eu:not(.custom) {
    background: linear-gradient(180deg, #003399 50%, #003399 50%);
    position: relative;
}

.badge-icon.eu:not(.custom)::after {
    content: '★';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #FFD700;
    font-size: 8px;
}

.badge-icon.us:not(.custom) {
    background: linear-gradient(180deg, #B22234 33%, #ffffff 33%, #ffffff 66%, #3C3B6E 66%);
}

.badge-icon.worldwide:not(.custom) {
    background: linear-gradient(135deg, #4CAF50 0%, #2196F3 100%);
}

/* Product Title */
.product-title {
    font-size: 18px;
    font-weight: 600;
    color: var(--blue);
    margin-bottom: 10px;
    line-height: 1.3;
}
.product-title a {
	color: inherit;
}

.product-title a:hover {
	opacity: 0.7;
}
/* Product Info */
.product-info {
    font-size: 12px;
    color: var(--grey);
    margin-bottom: 8px;
    line-height: 1.5;
	padding-top: 0px;
}

/* Product Time */
.product-time {
    font-size: 12px;
    color: var(--blue);
    margin-bottom: 15px;
}

.product-time .cyan {
    color: var(--blue);
}

/* Substrate Tags */
.product-substrates {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 20px;
    /*     flex-grow: 1; */
    height: fit-content;
}

.substrate-tag {
    display: inline-block;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 400;
    color: var(--black);
    background: #E2E8F0;
    border-radius: 4px;
    /*     border: 1px solid #e2e8f0; */
}

.substrate-tag.substrate-hidden {
    display: none;
}

.substrate-tag.substrate-hidden.substrate-visible {
    display: inline-block;
}

/* Substrate Toggle Button */
.substrate-toggle {
    display: inline-flex;
    align-items: center;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 600;
    color: #004A99;
    background: #e8f0fe;
    border: 1px solid #c5d6eb;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.substrate-toggle:hover {
    background: #d0e0f5;
    border-color: #004A99;
}

/* Learn More Button */
.btn-learn-more {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 400;
    color: var(--blue);
    background: #fff;
    border: 1px solid #D8E1EE;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    margin-top: auto;
}

.btn-learn-more:hover {
    background: #004A99;
    color: #ffffff;
    border-color: #004A99;
}

.btn-learn-more .arrow {
    transition: transform 0.3s ease;
}

.btn-learn-more:hover .arrow {
    transform: translateX(4px);
}

/* No Products Message */
.no-products {
    width: 100%;
    text-align: center;
    padding: 60px 20px;
    font-size: 16px;
    color: #6b7c93;
}

/* View All Button */
.product-finder-view-all {
    display: flex;
    justify-content: center;
    padding-top: 10px;
}

.btn-view-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    /*     padding: 12px 32px; */
    text-decoration: underline;
    font-size: 16px;
    font-weight: 600;
    color: var(--blue);
    background: transparent;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    border-radius: 8px;
}

.btn-view-all:hover {
    background: #f0f7ff;
}

.view-all-count {
    font-weight: 400;
    color: #6b7c93;
}

.view-all-icon {
    transition: transform 0.3s ease;
}

.view-all-icon.rotated {
    transform: rotate(180deg);
}

/* Pagination */
.product-finder-pagination {
    display: flex;
    justify-content: center;
}

.pagination {
    display: flex;
    gap: 8px;
}

.pagination a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    font-size: 14px;
    font-weight: 500;
    color: #004A99;
    background: #ffffff;
    border: 1px solid #e0e8f0;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.pagination a:hover,
.pagination a.active {
    background: #004A99;
    color: #ffffff;
    border-color: #004A99;
}

/* ==========================================================================
   Mobile Filter Header (visible only on mobile)
   ========================================================================== */

.product-finder-mobile-filter-header {
    display: none;
    /* Hidden on desktop */
}

/* Mobile-only elements (hidden on desktop) */
.product-finder-mobile-panel {
    display: block;
    /* visible on desktop so filter form shows */
}

.product-finder-mobile-tabs-row {
    display: none;
}

.product-finder-mobile-search-bar {
    display: none !important;
}

.product-finder-mobile-tab-dropdown-row {
    display: none;
}

.product-finder-mobile-filter-header {
    display: none;
}

/* ==========================================================================
   Product Finder Responsive Styles
   ========================================================================== */

@media (max-width: 1200px) {
    .product-card {
        flex: 1 1 calc(25% - 25px);
    }
	
	.page-id-45 .product-finder-header .title h2.product-finder-title {
	font-size: 22px;
}
}

@media (max-width: 992px) {
    .product-finder {
        padding: 60px 15px;
    }

    .product-finder-container {
        padding: 30px 25px;
    }

    .product-finder-title {
        font-size: 28px;
    }

    .product-card {
        flex: 1 1 calc(33.333% - 25px);
    }

    .tab-btn {
        padding: 12px 25px;
        font-size: 14px;
    }
}

@media (max-width: 768px) {

    .product-finder {
        padding: 40px 20px;
    }

    .product-finder-container {
        padding: 25px 20px;
        border-radius: 12px;
    }

    /* --- Header --- */
    .product-finder-header {
        margin-bottom: 20px;
    }

    .product-finder-header .title h2.product-finder-title {
        font-size: 20px;
    }

    /* --- Hide desktop tabs, search toggle & desktop search bar --- */
    .product-finder-tabs-wrapper {
        display: none;
    }

    .product-finder-desktop-search-bar {
        display: none !important;
    }

    /* --- Mobile panel (inside "Filter products" dropdown) --- */
    .product-finder-mobile-panel {
        display: none;
        /* hidden by default, jQuery slideToggle controls it */
        margin-bottom: 15px;
    }

    /* --- Show mobile filter header (tap to toggle panel) --- */
    .product-finder-mobile-filter-header {
        display: flex;
		transition: 0.5s;
    }
	
	.product-finder-mobile-filter-header:hover {
		background-color: var(--blue);
		color: var(--white);
		
	}
	
	.product-finder-mobile-filter-header:hover .mobile-filter-label {
		color: var(--white);
	}
	
	.product-finder-mobile-filter-header:hover .mobile-filter-icon {
		color: var(--white);
	}

    .product-finder-mobile-tabs-row {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 12px;
    }

    .product-finder-mobile-tabs-row .product-finder-mobile-tabs {
        display: flex;
        flex: 1;
        gap: 4px;
        background: #ffffff;
        border-radius: 50px;
        padding: 4px;
        box-shadow: 0 2px 12px rgba(0, 74, 153, 0.08);
        border: 1px solid #e0e8f0;
    }

    .product-finder-mobile-tabs-row .mobile-search-toggle {
        width: 44px;
        height: 44px;
        flex-shrink: 0;
    }

    /* Mobile search bar (slides open via JS) */
    .product-finder-mobile-search-bar {
        display: none !important;
        max-width: none;
        margin: 0 0 12px;
    }

    .product-finder-mobile-search-bar[style*="block"] {
        display: flex !important;
    }

    /* --- Show mobile filter header --- */
    .product-finder-mobile-filter-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 14px 0;
 
        margin-bottom: 20px;
        cursor: pointer;
		background-color: #FAFBFB;
		border-radius: 5px;
		padding: 15px 15px;
		box-sizing: border-box;
    }

    .mobile-filter-label {
        font-size: 16px;
        font-weight: 400;
        color: var(--blue);
    }

    .mobile-filter-icon {
        width: 24px;
        height: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #004A99;
    }

    .mobile-filter-icon svg {
        width: 22px;
        height: 22px;
    }

    /* --- Filter form layout on mobile --- */
    .product-finder-filters {
        flex-direction: column;
        gap: 12px;
    }

    /* Tab buttons inside mobile tabs wrapper */
    .product-finder-mobile-tabs .tab-btn {
        flex: 1;
        min-width: 70px;
        padding: 10px 12px;
        font-size: 13px;
        text-align: center;
        border-radius: 50px;
        white-space: nowrap;
    }

    .product-finder-mobile-tabs .tab-btn.active {
        background: var(--cyan);
        color: var(--blue);
        box-shadow: 0 2px 8px rgba(0, 74, 153, 0.2);
    }

    /* Tab dropdown row — hidden >500px, shown ≤500px */
    .product-finder-mobile-tab-dropdown-row {
        display: none;
    }

    /* Filter groups on mobile */
    .filter-group {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .filter-selects {
        width: 100%;
        flex-direction: column;
    }

    .filter-select-wrap {
        max-width: none;
    }

    .filter-select-wrap select {
        padding: 12px 40px 12px 16px;
        font-size: 14px;
    }

    /* Results count on mobile */
    .product-finder-count {
        margin-left: 0;
        text-align: right;
        font-size: 13px;
    }

    /* --- Search bar mobile --- */
    .product-finder-search {
        max-width: none;
        margin: 0 0 20px;
    }

    /* --- Products Grid: 2 columns on mobile --- */
    .product-finder-grid {
        gap: 15px;
        margin-bottom: 25px;
    }

    .product-card {
        flex: 1 1 calc(50% - 15px);
        min-width: calc(50% - 15px);
/*         max-width: calc(50% - 15px); */
        padding: 16px;
    }

    .product-card:hover {
        transform: none;
        box-shadow: 0 4px 15px rgba(0, 74, 153, 0.1);
    }

    /* Smaller text on mobile cards */
    .product-title {
        font-size: 16px;
        margin-bottom: 6px;
    }

    .product-info {
        font-size: 12px;
        margin-bottom: 6px;
    }

    .product-time {
        font-size: 11px;
        margin-bottom: 10px;
    }

    .product-badge {
        font-size: 11px;
        padding: 3px 6px;
        margin-bottom: 10px;
    }

    .substrate-tag {
        font-size: 11px;
        padding: 3px 8px;
    }

    .product-substrates {
        margin-bottom: 14px;
        gap: 5px;
    }

    .btn-learn-more {
        padding: 10px 15px;
        font-size: 14px;
    }

    /* --- View All --- */
    .product-finder-view-all {
        padding-top: 5px;
    }

    .btn-view-all {
        font-size: 14px;
    }

    /* --- Pagination --- */
    .pagination a {
        width: 34px;
        height: 34px;
        font-size: 13px;
	}

	.page-id-45 .product-finder-header .title h2.product-finder-title {
		font-size: 18px;
	}
}

@media (max-width: 500px) {

    /* Hide pill tab buttons, show dropdown instead */
    .product-finder-mobile-tabs-row {
        display: none !important;
    }

    .product-finder-mobile-tab-dropdown-row {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 12px;
    }

    .mobile-tab-select-wrap {
        flex: 1;
        max-width: none !important;
    }

    .mobile-tab-select {
        width: 100%;
        padding: 12px 40px 12px 16px;
        font-size: 14px;
        border: 1px solid #e0e8f0;
        border-radius: 8px;
        background: #f5f7fa url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23004A99' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        color: #004A99;
        font-weight: 500;
        cursor: pointer;
    }

    .mobile-search-toggle-small {
        width: 44px;
        height: 44px;
        flex-shrink: 0;
    }
}

@media (max-width: 420px) {
    .product-finder {
        padding: 30px 20px;
    }

    .product-finder-container {
        padding: 20px 15px;
    }

    .product-finder-header .title h2.product-finder-title {
        font-size: 18px;
    }

    .product-card {
        flex: 1 1 100%;
        min-width: 100%;
/*         max-width: calc(50% - 10px); */
        padding: 14px;
    }

    .product-finder-grid {
        gap: 10px;
    }

    .product-title {
        font-size: 16px;
    }

    .product-info {
        font-size: 12px;
    }
}

/* ==========================================================================
   Title Left + Lists Items Section
   Background: var(--SCIGRIP---Gradient, linear-gradient(32deg, #013383 24.18%, #004A99 100%))
   ========================================================================== */

.title-left-lists-items {
    background: var(--SCIGRIP---Gradient, linear-gradient(180deg, #013383 24.18%, #004A99 100%));
    padding: 80px 30px;
	box-sizing: border-box;
}
.title-left-lists-items.white-bg {
	background: transparent;
}
.title-left-lists-items-container {
    max-width: 1280px;
    margin: 0 auto;
  
    display: flex;
    gap: 60px;
    align-items: flex-start;
}

/* Left Column - Title */
.title-left-lists-items .left {
    flex: 0 0 280px;
}

.title-left-lists-items .left .title h2 {
	position: relative;
	padding-bottom: 15px;
}

.title-left-lists-items .left .title h2::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 80px;
	height: 2px;
	background-color: var(--yellow);
}

.title-left-lists-items.white-bg .left .title h2 {
	color: var(--blue);
}

.title-left-lists-items.white-bg .left .title h2::after {
	background-color: var(--cyan);
}

/* Right Column - Items Grid */
.title-left-lists-items .right {
    flex: 1;
}

.title-left-lists-items .items-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 40px 60px;
}

.title-left-lists-items .item {
    flex: 1 1 calc(50% - 30px);
	max-width: calc(50% - 15px);
}

.title-left-lists-items .item-title h3 {
    font-size: 22px;
    font-weight: 400;
    color: var(--yellow);

    line-height: 1.3;
}

.title-left-lists-items.white-bg .item-title h3 {
	color: var(--blue);
}

.title-left-lists-items .item-text p {
    font-size: 16px;
    font-weight: 400;
    color: var(--white);
    line-height: 1.6;
    margin: 0;
}

.title-left-lists-items.white-bg .item-text p {
	color: var(--gray);
}
.title-left-lists-items .item-text p:first-of-type {
	padding-top: 5px;
}
/* ==========================================================================
   Responsive Styles
   ========================================================================== */

@media screen and (max-width: 992px) {
    .title-left-lists-items-container {
        flex-direction: column;
        gap: 40px;
    }

    .title-left-lists-items .left {
        flex: none;
        width: 100%;
    }

    .title-left-lists-items .left .title h2 {
        font-size: 28px;
    }

    .title-left-lists-items .items-grid {
        gap: 30px 40px;
    }
}

@media screen and (max-width: 768px) {
    .title-left-lists-items {
        padding: 30px 20px;
    }

    .title-left-lists-items .items-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .title-left-lists-items .left .title h2 {
		font-size: 24px;
	}

	.title-left-lists-items .item {
		flex: 1 1 100%;
		max-width: 100%;
	}
}

/* ==========================================================================
   Image Text Section
   ========================================================================== */

.image-text {
    padding: 80px 30px;
/*     background-color: #ffffff; */
    box-sizing: border-box;
	position: relative;
}

.image-text.first {
    padding-bottom: 20px;
}

.image-text.last {
    padding-top: 20px;
}

.image-text-container {
    max-width: 1530px;
    margin: 0 auto;

    display: flex;
    align-items: stretch;
    gap: 60px;
}

/* Flip modifier - reverses layout */
.image-text.flip .image-text-container {
    flex-direction: row-reverse;
}

/* Left Column (Image) */
.image-text .left {
    flex: 1 1 56%;
    min-width: 0;
    display: flex;
}

.image-text .left .image {
    position: relative;
    width: 100%;
    height: 100%;
}

.image-text .left .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 10px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}

/* Take Image Height - image is absolute, height driven by text column */
.image-text.take-image-height .image-text-container {
    align-items: stretch;
}

.image-text.take-image-height .left {
    position: relative;
    flex: 1 1 56%;
}

.image-text.take-image-height .left .image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.image-text.take-image-height .left .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Right Column (Content) */
.image-text .right {
    flex: 1 1 44%;
    min-width: 0;
    display: flex;
    align-items: center;
}

.image-text .right-inner {
    /*     max-width: 500px; */
    padding: 40px 0;
}

/* When flipped, align content to the left */
.image-text.flip .right-inner {
    margin-left: 0;
    margin-right: auto;
}

/* Default: align content to the right */
.image-text:not(.flip) .right-inner {
    margin-left: auto;
    margin-right: 0;
}

.image-text .inner-container {
    display: flex;
    flex-direction: column;
/*     gap: 20px; */
}

/* Title Styles - uses global .title.blue styles */
.image-text .title h2 {
    margin: 0;
}

/* Text Styles */
.image-text .text {
    color: #555555;
    font-size: 15px;
    line-height: 1.7;
}
.image-text .text h3 {
	margin-top: 15px;
}
.image-text .text p {
    margin: 0 0 15px 0;
}

.image-text .text p:last-child {
    margin-bottom: 0;
}

.image-text .text ul {
    list-style: none;
    padding: 0;
    margin: 0 0 15px 0;
}

.image-text .text ul li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 10px;
}

.image-text .text ul li::before {
    content: '';
    width: 10px;
    height: 10px;
    min-width: 10px;
    min-height: 10px;
    background-color: var(--cyan);
    transform: rotate(45deg);
    display: block;
    position: relative;
    top: 7px;
    flex-shrink: 0;
}

.image-text .a-buttons {
    display: flex;
    gap: 0 20px;
    flex-wrap: wrap;
}

/* Button Styles - extends global .btn-main */
.image-text .a-button {
    margin-top: 30px;
}

.image-text .a-button .btn-main {
    display: inline-block;
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 900px) {
    .image-text {
        padding: 60px 30px;
    }

    .image-text-container {
        gap: 40px;
    }

    .image-text .right-inner {
        max-width: none;
        padding: 30px 0;
	}
	.image-text-container,
	.image-text.take-image-height .image-text-container {
		flex-direction: column;
		gap: 30px;
	}
	
	.image-text.take-image-height .left .image {
		position: relative;
	}
	
	.image-text .left .image img {
		max-height: 500px;
	}
}

@media (max-width: 600px) {
    .image-text {
        padding: 30px 20px;
    }

 

    /* On mobile, flip doesn't change order - image always first */
    .image-text.flip .image-text-container {
        flex-direction: column;
    }

    .image-text .left,
    .image-text .right {
        width: 100%;
    }

    .image-text .left .image img {
        height: auto;
    }

    .image-text .right-inner {
        margin: 0 !important;
        max-width: none;
        padding: 0px 0;
    }

    .image-text .title h2 {
        font-size: 26px;
    }

    .image-text .text {
        font-size: 14px;
    }
}

@media (max-width: 450px) {
	.image-text .a-button .btn-main,
	.image-text .a-button{
		width: 100%;
	}
}

/* ========================================
   HERO SECTION - FLEXIBLE LAYOUTS
   ======================================== */

.hero {
    /*     background: linear-gradient(135deg, #1a5fb4 0%, #3584e4 50%, #62a0ea 100%); */
    padding: 40px 30px 80px;
    position: relative;
    box-sizing: border-box;

}

.hero.no-bottom-padding {
    padding-bottom: 0px;
}

.hero::after {
    background: var(--SCIGRIP-LINEAR, linear-gradient(180deg,
                #004A99 0%,
                #004A99 40%,
                rgba(0, 74, 153, 0.85) 55%,
                rgba(0, 74, 153, 0.5) 75%,
                rgba(0, 74, 153, 0.00) 100%));
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: calc(100% + 100px);
    content: '';
    pointer-events: none;
}

.hero.centered::after {
   background: var(--SCIGRIP---Gradient, linear-gradient(32deg, #013383 24.18%, #004A99 100%));

    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
/*     height: calc(100% + 100px); */
	height: calc(100% + 00px);
    content: '';
    pointer-events: none;
}


.page-id-45 .hero.centered::after {
		height: calc(100% + 500px);
		    background: var(--SCIGRIP-LINEAR, linear-gradient(180deg,
                #004A99 0%,
                #004A99 40%,
                rgba(0, 74, 153, 0.85) 55%,
                rgba(0, 74, 153, 0.5) 75%,
                rgba(0, 74, 153, 0.00) 100%));
}

.page-id-73 .hero::after {
	height: calc(100% + 500px)
}

.hero-container {
    max-width: 1530px;
    margin: 0 auto;
    padding: 0 0px;
    z-index: 1;
    position: relative;
	padding-top: 30px;
}

/* ----------------------------------------
   BREADCRUMB
   ---------------------------------------- */

.hero .breadcrumb {
    margin-bottom: 40px;

	position: absolute;
	max-width: 1590px;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	top: -30px;
/* 	padding: 0 30px; */
	box-sizing: border-box;
}

.hero .breadcrumb,
.hero .breadcrumb a {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    text-decoration: none;
}

.hero .breadcrumb a:hover {
    color: #fff;
}

.hero .breadcrumb .arrow {
    margin: 0 8px;
    color: rgba(255, 255, 255, 0.5);
}

/* ----------------------------------------
   SUBTITLE (Small Text Above Title)
   ---------------------------------------- */

.hero .hero-subtitle {
    display: block;
    font-size: 22px;
/*     font-weight: 600; */
    color: rgba(255, 255, 255, 0.9);
/*     text-transform: uppercase; */
    
    margin-bottom: 8px;
}

/* ----------------------------------------
   DESCRIPTION (subtitle yellow)
   ---------------------------------------- */

.hero .subtitle.yellow {
    display: block;
	font-size: 22px;
    color: var(--yellow);
    font-weight: 400;
    letter-spacing: 0.5px;
    margin-top: 10px;
    margin-bottom: 10px;
}

/* ----------------------------------------
   TITLE WITH YELLOW UNDERLINE
   ---------------------------------------- */

.hero .title {
    margin-bottom: 20px;
}

.hero .title h1 {
    font-size: 46px;
    font-weight: 400;
    color: var(--white);
    margin: 0 0 20px 0;
    line-height: 1.2;
}

.hero .title-underline {
    display: block;
    width: 80px;
    height: 2px;
    background-color: var(--yellow);
}

.hero .title-underline.center {
    margin: 0 auto;
}

/* ----------------------------------------
   TEXT
   ---------------------------------------- */

.hero .text {
    color: rgba(255, 255, 255, 0.9);
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 30px;
}

.hero .text p:first-of-type {
	padding-top: 0px;
}

.hero .text.center {
    /*     max-width: 700px; */
    margin-left: auto;
    margin-right: auto;
}

.hero .text p {
    margin: 0;
    color: var(--white);
}

/* ----------------------------------------
   BUTTON
   ---------------------------------------- */

.hero .a-button {
    margin-top: 20px;
}

.hero .a-button.center {
    text-align: center;
}

.hero .a-button.center .btn-main {
	margin: 0 auto;
}

.hero .a-button a.btn-main {
    /*     display: inline-flex; */
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    font-size: 14px;
    /*     font-weight: 600; */
    text-decoration: none;
    /*     border-radius: 4px; */
    transition: all 0.3s ease;
    width: fit-content;
}

.hero .a-button a.btn-main.yellow-bg {
    /*     background-color: #f5c518; */
    /*     color: #1a1a1a; */
}

.hero .a-button a.btn-main.yellow-bg:hover {
    background-color: #e6b800;
    /*     transform: translateY(-2px); */
}

/* ========================================
   LAYOUT: LEFT/RIGHT
   ======================================== */

.hero.left_right .hero-inner {
    display: flex;
    align-items: center;
    gap: 60px;
}

.hero.left_right .hero-content.left {
    flex: 0 0 45%;
    max-width: 600px;
}

.hero.left_right .hero-image.right {
    flex: 1;
    position: relative;
}

.hero.left_right .hero-image.right img {
    width: 100%;
    height: auto;
    border-radius: 20px;
    /*     box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); */
}

/* ========================================
   LAYOUT: LEFT/RIGHT FULL-BLEED IMAGE
   ======================================== */

.hero.left_right_full {
    padding: 0;
    overflow: hidden;
}

.hero.left_right_full .hero-container {
    max-width: 100%;
    padding: 0;
}

.hero.left_right_full .hero-inner {
    display: flex;
    align-items: stretch;
    min-height: 500px;
}

.hero.left_right_full .hero-content.left {
    flex: 0 0 50%;
    max-width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 60px 60px 60px calc((100vw - 1530px) / 2 + 0px);
    box-sizing: border-box;
}

/* Fallback for smaller screens where calc would go negative */
@media (max-width: 1590px) {
    .hero.left_right_full .hero-content.left {
        padding-left: 30px;
    }
}

.hero.left_right_full .hero-image.right {
    flex: 0 0 50%;
    max-width: 50%;
    position: relative;
    overflow: hidden;
}

.hero.left_right_full .hero-image.right img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: 0;
    display: block;
}

/* ========================================
   LAYOUT: CENTERED (No Image)
   ======================================== */
.page-id-45 .hero.centered {
	padding-bottom: 0px;
}
.hero.centered {
    padding: 40px 30px 50px;
	box-sizing: border-box;
}

.hero.centered .hero-inner.centered {
    text-align: center;
}

.hero.centered .hero-content.center {
    max-width: 950px;
    margin: 0 auto;
}

.hero.centered .title.center h1 {
    text-align: center;
}

/* ========================================
   LAYOUT: CENTERED WITH IMAGE/VIDEO BELOW
   ======================================== */

.hero.centered_image_below {
    padding: 40px 30px 50px;
}

.hero.centered_image_below .hero-inner.centered {
    text-align: center;
    padding-bottom: 50px;
}

.hero.centered_image_below .hero-content.center {
    max-width: 800px;
    margin: 0 auto;
}

/* Media Container (Image or Video) */
.hero.centered_image_below .hero-media-below {
    /*     max-width: 900px; */
    margin: 0 auto;
    /*     padding: 0 20px; */
}

.hero.centered_image_below .hero-media-below img,
.hero.centered_image_below .hero-media-below video {
    width: 100%;
    max-height: 715px;
    height: auto;
    border-radius: 8px;
    object-fit: cover;
    object-position: center;
    display: block;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

/* Video specific styles */
.hero.centered_image_below .hero-media-below.video video {
    display: block;
    object-fit: cover;
}

/* ========================================
   RESPONSIVE
   ======================================== */

@media (max-width: 1200px) {
    .hero .title h1 {
        font-size: 40px;
    }

    .hero.left_right .hero-inner {
        gap: 40px;
    }
}

@media (max-width: 991px) {
    .hero {
        padding: 30px 0 60px;
    }

    .hero-container {
        padding: 0 30px;
    }

    .hero .title h1 {
        font-size: 36px;
    }

    /* Stack left/right layout on tablet */
    .hero.left_right .hero-inner {
        flex-direction: column;
        text-align: center;
    }

    .hero.left_right .hero-content.left {
        flex: none;
        max-width: 600px;
    }

    .hero.left_right .title-underline {
        margin: 0 auto;
    }

    .hero.left_right .a-button {
        text-align: center;
    }

    .hero.left_right .hero-image.right {
        max-width: 600px;
        margin: 0 auto;
    }

    /* Stack left_right_full layout on tablet */
    .hero.left_right_full {
        padding: 0;
    }

    .hero.left_right_full .hero-inner {
        flex-direction: column;
        min-height: auto;
    }

    .hero.left_right_full .hero-content.left {
        flex: none;
        max-width: 100%;
        padding: 40px 30px;
        text-align: center;
    }

    .hero.left_right_full .title-underline {
        margin: 0 auto;
    }

    .hero.left_right_full .a-button {
        text-align: center;
    }

    .hero.left_right_full .hero-image.right {
        flex: none;
        max-width: 100%;
        position: relative;
        height: 350px;
    }

    .hero.left_right_full .hero-image.right img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
	
	.hero.centered .hero-inner.centered {
		padding-top: 60px;
	}
	
	.hero .a-button a.btn-main {
		margin: 0 auto;
	}
}

@media (max-width: 768px) {
    .hero {
        padding: 40px 20px 30px;
    }
	
	.hero.left_right .hero-content.left {
		padding-top: 40px;
	}

    .hero-container {
        padding: 0 0px;
    }

    .hero .breadcrumb {
        margin-bottom: 30px;
    }

    .hero .title h1 {
        font-size: 28px;
    }

    .hero .text {
        font-size: 15px;
    }

    .hero.centered {
        padding: 40px 20px 40px;
    }
	.hero.centered_image_below {
		padding:20px 20px 40px;
	}
    .hero.centered_image_below {
        padding-bottom: 0;
    }

    .hero.left_right_full .hero-content.left {
        padding: 30px 20px;
    }

    .hero.left_right_full .hero-image.right {
        height: 280px;
    }
	
	.hero.centered_image_below .hero-inner.centered {
		padding-bottom: 0px;
		margin-top: 20px;
		padding-top: 50px;
	}
	
	.hero .subtitle.yellow {
		font-size: 18px;
	}
}

@media (max-width: 480px) {
    .hero .title h1 {
        font-size: 24px;
    }

    .hero .a-button a.btn-main {
        padding: 12px 24px;
        font-size: 13px;
    }
}

/******* header ******/

/**********************/
.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    /*     z-index: 1000; */
    z-index: 9999;
    background-color: var(--bk);
    /* Adjust as needed */
    transition: top 0.3s ease, background-color 0.3s ease;
}

.header.sticky {
    top: 0;
    /* Visible when sticky */
}

.home header.sticky {
    background-color: #fff !important;
}

header {
    background-color: #fff !important;
}

header .main-container .main-container-inner nav a:not(.sub-menu li a):not(.home .main-container .main-container-inner nav a) {
    color: var(--blue);
	position: relative;
}
header .main-container .main-container-inner nav a:not(.sub-menu li a):hover::before {
	width: calc(100% - 10px);
	position: absolute;
	bottom: 30px;
	height: 1px;
	background-color: var(--blue);
	display: block;
	content: '';
	left: 50%;
	transform: translateX(-50%);
}

.home header {
    /* 	position:fixed; */
    top: 0;
    left: 0;
    /* 	background: transparent !important; */
    transition: 0.5s;
}

.home header.scroll {
    background-color: #fff;
}

.home header.scroll .main-container .main-container-inner nav a {
    color: #0E0F20;
}

.home header.scroll .main-container .main-container-inner nav .sub-menu a {
    color: #fff;
}

.home header.scroll .header-left .custom-logo {
    filter: none;
}

.home header.scroll .header-right .header-misc .search-icon {
    filter: none;
}

.home header.scroll nav .menu-item-5747 a::before,
.home header.scroll nav .menu-item-5748 a::before,
.home header.scroll nav .menu-item-5751 a::before {
    filter: none;
}

.home header .side-nav a img {
    filter: contrast(0%) brightness(2)
}

.home header.scroll .side-nav a img {
    filter: none;
}


.home main {
    padding-top: 0px;
    margin-top: -20px;
}

.home header .main-container .main-container-inner {
    background: transparent;
}

header {
    /* 	background:#ffffff; */
    position: absolute;
    z-index: 999;
    /* 	position: fixed; */
}

main {
    /* 	padding-top: 90px; */
}

@media (max-width: 1300px) {
    main {
        /* 		padding-top: 65px; */
    }
}

@media (max-width: 600px) {
    main {
        /* 		padding-top: 57px; */
    }
}

header .top-container {
    background-color: #E7E5DE;
}

header .top-container .top-container-inner {
    max-width: calc(1500px + 60px);
    margin: 0 auto;

    padding: 7px 30px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
}

header .client-login-link {
    margin-left: 20px;
}

header .client-login-link img {
    display: block;
}

header .client-login-link:hover {
    opacity: 0.7;
}

header .top-container .top-container-inner .left a {
    display: flex;
    align-items: center;
}

header .top-container .top-container-inner .left img {
    margin-right: 5px;
}

header .top-container .top-container-inner a {
    color: #016C5E;
    font-size: 16px;
    font-weight: 400;
    display: flex;
    align-items: center;

}

header .top-container .top-container-inner a:hover {
    opacity: 0.7;
}

header .top-container .top-container-inner a img {
    margin-right: 10px;
}

header .top-container .top-container-inner .email {
    margin-left: 10px;
}

header .top-container .top-container-inner .email a {}

header .top-container .top-container-inner .left a {
    text-decoration: underline;
}

header .top-container .top-container-inner .right {
    display: flex;
}

header .top-container .top-container-inner .right .tel {
    margin-right: 10px;
}

header .main-container .main-container-inner {
    box-sizing: border-box;
    /* 	max-width: calc(1300px + 60px); */
    /* 	max-width:1600px; */
    margin: 0 auto;
    /* 	background-color: #ffffff; */
    padding: 0px 90px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;

    max-width: 1590px;
    padding: 0 30px;
}

.home header .main-container .main-container-inner {
    max-width: 1530px;
}

header .main-container .main-container-inner nav a {
    color: var(--blue);

    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    padding: 35px 5px;
    box-sizing: border-box;
    display: block;
    transition: none;


}
header .main-container .main-container-inner nav a:hover {
	color: var(--blue);
}
.home header .main-container .main-container-inner nav a {
    /* 	color: #fff; */
}

header .main-container .main-container-inner nav li.last a {
    /* 	color: var(--blue); */
    position: relative;

}

header .main-container .main-container-inner nav li.last a::after {
    content: '\e09f';
    position: absolute;
    right: -15px;
    top: calc(50% - 2px);
    transform: translateY(-50%);
    font-weight: 200;
    color: #D9F0CA;
    font-family: 'Font Awesome 6 Pro';
}

header .main-container .main-container-inner nav #menu-main-menu li a {
    position: relative;

}

header .main-container .main-container-inner nav>#menu-main-menu>li>a:hover {
    color: var(--blue);
}

header .main-container .main-container-inner nav #menu-main-menu li a:hover {
    /* 	opacity: 0.7; */
}

header .main-container .main-container-inner nav #menu-main-menu li a::after {
    /* 	display: block;
	bottom: 30px;
	position: absolute;
	background-color: #074994;
	height: 2px;
	width: calc(100% - 10px);
	content: '';
	opacity: 0;
	transition: 0.5s; */
}

nav .menu-item-has-children {
    margin-right: 10px;
}

.home header .main-container .main-container-inner nav #menu-main-menu li a::after {
    /* 	filter: contrast(0%) brightness(2); */
}

.home header.scroll .main-container .main-container-inner nav #menu-main-menu li a::after {
    filter: contrast(0%) brightness(0);
}

header .main-container .main-container-inner nav #menu-main-menu li:hover a::after {
    opacity: 1;
}



header .main-container .main-container-inner nav a.small {
    padding: 25px 20px;
}

header .header-left {
    display: flex;
    align-items: center;
}

header .header-left img {
    width: 180px;
    object-fit: contain;
    display: block;
}

header .header-left #menu-main-menu {
    margin-left: 25px;
}



header .header-right {
    display: flex;
    align-items: center;
}

header .header-right .tel {
    margin-left: 20px;
    display: none;
}

header .header-right .tel a {
    color: var(--blue);
    font-size: 18px;

}

header .header-right .header-misc {
    display: flex;
    /* 	margin-left: 30px; */
    align-items: center;
    /* 	width: 100%; */
    margin-left: 25px;
}

.home header .header-right .header-misc .btn-main {
    background-color: #F19117;
    border: 1px solid #F19117;
}

header .header-right .header-misc .btn-main {
    max-width: 180px;
    font-weight: 400;
    background-color: #074994;
    padding: 15px 40px;
    text-transform: uppercase;
    border: 1px solid #074994;
}

header .header-right .header-misc .btn-main:hover {
    background-color: #fff;
    color: #074994;
}

header .header-right .header-misc .btn-main img {
    filter: contrast(0%) brightness(2);
    transform: rotate(-90deg);
    position: relative;
    top: -3px;

    width: 0px;
    transition: 0.5s;
}

header .header-right .header-misc .btn-main:hover img {
    width: auto;
    margin-left: 10px;
}

/* header .header-right .header-misc .btn-main:hover {
color: #fff;
} */


header .header-right .header-misc .search-icon {
    margin-right: 20px;
    transition: 0.5s;
}

.home .header-right .header-misc .search-icon {
    filter: contrast(0%) brightness(2);
}

header .header-right .header-misc .search-icon.hide {
    display: none;
}

header .header-right .header-misc .search-icon:hover {
    opacity: 0.6;
    cursor: pointer;
}

header .header-right .mobile-header-contact {
    margin-right: 10px;
    display: flex;
    align-items: center;
    position: relative;
    top: -3px;
}

header .header-right .mobile-header-contact a {
    margin: 0 10px;
}

header .header-right .mobile-header-contact a:hover {
    opacity: 0.7;
}

header .header-right .mobile-header-contact a img {
    display: block;
}

.header .header-right nav>ul>li>.sub-menu {
    padding: 20px 15px;
    background-color: #fff;
    width: 330px;
    transition: none !important;
    /* 	border: 1px solid #fff; */
    box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
    border-radius: 5px;
    left: 50%;
    transform: translate(-50%, 0) !important;
}

.header .header-right nav>ul>li>.sub-menu .sub-menu {
    position: relative;
    transform: none;
    z-index: 999;
    top: auto;
    padding: 10px 0;
}

.header .header-right nav>ul>li>.sub-menu .sub-menu li a {
    color: var(--bk) !important;
    font-weight: 400;
}

header .header-right nav .sub-menu>a {
    transition: none !important;
}

header .header-right nav ul.sub-menu li {
    padding-bottom: 0px;
    padding-top: 0px;
}

header .header-right nav ul.sub-menu li:not(header .header-right nav ul.sub-menu .sub-menu li) {
    padding-bottom: 15px;
}

header .header-right nav ul.sub-menu li:last-of-type {
    padding-bottom: 0px !important;
}

header .header-right nav ul.sub-menu .sub-menu {
    margin-bottom: 0px;
    width: 100%;
}

header .header-right nav ul.sub-menu .sub-menu li {
    padding: 5px 0;
}

header .header-right nav ul.sub-menu li:first-of-type a {
    /* 	font-size: 24px;
	color: #CCEDB7;
	font-weight: 300;
	margin: 20px 10px 10px;
	padding: 0px;
	padding-bottom: 20px;
	border-bottom: 1px solid #CCEDB7;
	box-sizing: border-box;
	width: fit-content; */
/* 	padding-top: 0px !important; */
}

header .header-right nav ul.sub-menu li.full a {
    border-bottom: none;
    text-align: center;
    background-color: #CCEDB7;
    color: #115153 !important;
    margin-bottom: 10px;
    margin-top: 15px;
    border-radius: 40px;
    font-size: 20px;
}

header .header-right nav ul.sub-menu li:hover::after {
    display: none;
}

header .header-right nav ul.sub-menu li a:hover {
    /* 	font-weight: 400; */
    opacity: 0.7;
}

header .header-right nav ul.sub-menu li a:after {
    display: none;
}

header .header-right nav ul.sub-menu::after {
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent #fff transparent;
    transform: rotate(0deg);
    position: absolute;
    content: '';
    display: block;
    left: var(--submenu-arrow-left, calc(50% + 0px));
    /* Fallback if JS fails */
    top: -10px;
    transform: translateX(-50%);
}

header .header-right nav ul.sub-menu ul.sub-menu::after {
    display: none;
}

/* header .header-right nav .menu-item-54 a:hover {
background-color: #02A3DA;
color: #ffffff !important;
}

header .header-right nav .menu-item-55 a:hover {
background-color: #C52153;
color: #ffffff !important;
}

header .header-right nav .menu-item-56 a:hover {
background-color: #84BF3F;
color: #ffffff !important;
}

header .header-right nav .menu-item-57 a:hover {
background-color: #EC8B2D;
color: #ffffff !important;
}

header .header-right nav .menu-item-58 a:hover {
background-color: #00A096;
color: #ffffff !important;
} */

header .header-left nav li {
    position: relative;
}



header .header-right nav li:first-of-type {
    /* 	padding-left: 30px; */
}

/* header .header-right nav li:hover::after {
display: block;
content: '';
width: 100%;
height: 1px;
background-color: #ffffff;
position: absolute;
bottom: 20px;
left: 0;

} */
/* 
header .header-right nav .menu-item-59 a:hover {
background-color: #84BF3F;
color: #ffffff !important;
}


header .header-right nav .menu-item-55 .sub-menu {
background-color: #C52153;
box-sizing: border-box;
}

header .header-right nav .menu-item-56 .sub-menu {
background-color: #84BF3F;
box-sizing: border-box;
}

header .header-right nav .menu-item-58 .sub-menu {
background-color: #00A096;
box-sizing: border-box;
display: none;
} */

header .header-right nav .menu-item-58 ul.sub-menu {
    display: none;
}

header .header-right nav .menu-item-59 ul.sub-menu {
    display: none;
}

header .header-right nav ul.sub-menu {
    display: flex;
    flex-wrap: wrap;
    z-index: 10;
}

header .header-right nav ul.sub-menu li {
    width: 100%;
    z-index: 10;
}

header .header-right nav ul.sub-menu li a {
/*     color: #fff !important; */
    /* 	border-bottom: 2px solid #ffffff; */
    padding: 0px 0px;
    font-size: 16px;
    font-weight: 400;
}

header .main-container {
    position: relative;
}


nav .menu-item-has-children a {
    position: relative;
}


nav .menu-item-195,
nav .menu-item-196,
nav .menu-item-204 {
    padding-right: 30px;
}

nav .menu-item-5747 a::before,
nav .menu-item-5748 a::before,
nav .menu-item-5751 a::before {
    background-image: url(img/down_arrow_black.svg);
    position: absolute;
    right: -12px;
    top: calc(50% - 1px);
    transform: translateY(-50%);
    content: '';
    width: 12px;
    height: 7px;
    background-repeat: no-repeat;
    display: block;
}

.home nav .menu-item-5747 a::before,
.home nav .menu-item-5748 a::before,
.home nav .menu-item-5751 a::before {
    filter: contrast(0%) brightness(2);
}

@media (max-width: 1370px) {
    header .top-container .top-container-inner .right {
        display: none;
    }

}

@media (max-width: 1370px) {
    header .main-container .main-container-inner {
        padding: 0px 20px !important;
    }
}

@media (max-width: 1000px) {
    header .main-container .main-container-inner {
        padding: 10px 20px !important;
    }
}

@media (max-width: 700px) {
    header .header-right .header-misc .search-icon.hide {
        display: block !important;
    }
}

@media (max-width: 600px) {
    header .main-container .main-container-inner {
        padding: 20px 20px 20px !important;
    }

    header .top-container .top-container-inner .left a {
        font-size: 14px;
    }

    header .top-container .top-container-inner {
        padding: 7px 20px;
    }

    header .top-container {
        display: none;
    }

    header .header-left img {
        width: 118px;
    }

    .home header .header-left .custom-logo {
        width: 118px;
    }
}

@media (max-width: 500px) {
    header .header-right .header-misc .btn-main {
        display: none;
    }
}

@media (max-width: 400px) {
    header .top-container .top-container-inner .left a {
        font-size: 12px;
    }

    .custom-logo {
        max-width: 170px;
    }
}



/*** mobile menu ***/


.mobile-menu {
    display: flex;
    /* 	height: 100%; */
}

.mobile-menu .custom-logo {
    margin-bottom: 20px;
}

.mobile-menu .mobile-logo {
    padding: 23px 0;
    box-sizing: border-box;
    display: block;
}

.mobile-menu .mobile-logo::after {
    display: none !important;
}

.menu-top-menu-container {
    width: calc(100% - 70px);
    margin-left: 0;
    margin-right: auto;
    background-color: var(--bk);
    padding: 30px 20px 20px;
    box-sizing: border-box;
    position: relative;
    z-index: 1;
	margin-top: 60px;
}

.menu-top-menu-container::after {
    display: block;
    width: 100%;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    background-color: #fff;
    content: '';
    z-index: -1;
}

.menu-top-menu-container ul {
    text-align: left;
    margin-top: 20px;
}

.menu-top-menu-container ul>li a {
    font-size: 16px;
    font-weight: 400;
    color: #ffffff;
    padding: 15px 0;
    border-top: 1px solid var(--blue);

}

.menu-top-menu-container ul>li:first-of-type>a:not(.menu-top-menu-container ul > li:first-of-type ul li a) {
    border-top: none;
}

.menu-top-menu-container ul>li ul li a {
    border-top: 1px solid rgba(255, 255, 255, 0.5);
}

.menu-top-menu-container {


    color: white;
    /* 	box-shadow: 0 5px 15px 1px rgba(0, 0, 0, 0.6), 0 0 200px 1px rgba(255, 255, 255, 0.5); */
    text-align: left;
}

.menu-top-menu-container * {
    margin: 0;
    padding: 0;
}

.menu-top-menu-container li {
    list-style-type: none;
}



.menu-top-menu-container ul>li.active>a {
    border-bottom: none;
/*     color: #2AD2C9; */
}

.menu-top-menu-container li.active>ul li a {
    color: var(--cyan);
}

/* do not remove - this makes the submenu open / close */

.menu-top-menu-container ul ul {
    display: none;
}

.menu-top-menu-container li.active>ul {
    display: block;
}

.menu-top-menu-container li.active>ul.sub-menu {
    margin-bottom: 20px;
}

.menu-top-menu-container li.active>ul li a {
    /* 	padding-left: 15px;
	padding-right: 15px; */
    transition: 0.5s !important;
}

.menu-top-menu-container li a a::after {
    transition: 0.5s;
}

.menu-top-menu-container ul>li>a::after {
    position: relative;
    transition: 0.5s;
}

.menu-top-menu-container ul>li.active>a::after {
    position: relative;
    transform: rotate(180deg);
}

/* first level menu item */

.menu-top-menu-container>ul>li>a {
    position: relative;
    display: block;
    /* 	background: #003040; */
    /* 	background: linear-gradient(#003040, #002535); */
    padding: 10px 0px 10px 0px;
    font-size: 16px;
    line-height: 34px;
    color: white;
    text-decoration: none;
    font-weight: normal;
    display: flex;
    justify-content: space-between;
    align-items: center;

}

.menu-top-menu-container>ul>li>a {
    transition: 0.5s !important;
}

.menu-top-menu-container>ul>li>a:hover {
    opacity: 0.5 !important;
}

.menu-top-menu-container>ul>li.menu-item-has-children>a:before {
    content: "";
    position: absolute;
    left: 5px;
    color: rgba(255, 255, 255, 0.3);
    font-size: 18px;
}

/* second level menu item */

.menu-top-menu-container ul ul li a {
    color: #07171C;
    text-decoration: none;
    font-size: 16px;
    /* 	line-height: 27px; */
    display: block;
    padding: 5px 0px;
    transition: all 0.15s;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.menu-top-menu-container ul ul li a {
    transition: 0.5s;
}

.menu-top-menu-container ul ul li a:hover {
    opacity: 0.6;

}

/* third level menu item */

.menu-top-menu-container ul ul ul {}

.menu-top-menu-container ul ul ul li a {
    /* 	padding-left: 30px !important; */
    color: #fff !important;
    font-weight: 400;
}

.menu-top-menu-container ul ul ul li:not(:first-child) a {
    border-top: none;
}

.menu-top-menu-container ul ul ul li:first-child a {
    padding: 15px 0 7.5px;
}

.menu-top-menu-container ul ul ul li a {
    padding: 7.5px 0;
}

/* arrows after closed / open menu items that have children */

.mobile-menu .menu-top-menu-container .menu a:not(:only-child):after {
    position: relative;

}

.mobile-menu .menu-top-menu-container .menu a:not(:only-child):after {
    content: "";
    background-image: url('img/mobile_arrow.svg');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    width: 25px;
    height: 11px;
    display: block;
    top: 0;
    font-size: 18px;
    /* 	filter: brightness(0); */
}

.menu-top-menu-container .active>a:not(:only-child):after {
    /* 	content: "";
	top: -10px;
	font-size: 28px; */
}

@media (max-width: 450px) {
    .menu-top-menu-container {
        width: calc(100% - 40px);
        padding: 20px 10px 20px;
    }

    .mobile-menu .slide-close {
        width: 40px !important;
        height: 40px !important;
        margin: 5px 5px;
    }


}

.mobile-menu .slide-close {
    width: 70px;
    /* 	background-color: #00A096; */
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;

}

.mobile-menu .contact-details h3 {
    font-size: 18px;
    color: #07171C;
    font-weight: 700;
    margin-top: 30px;
}

.mobile-menu .contact-details a::after {
    display: none;
}

.mobile-menu .contact-details a {
    display: block;
    /* 	color: #07171C; */
    color: var(--black);
/*     margin-top: 10px; */
    font-size: 16px;
    font-weight: 400;
}

.mobile-menu .contact-details span {
    margin-top: 25px;
    display: block;
    font-weight: 400;
}

.mobile-menu .contact-details a:hover {
    opacity: 0.7;
}

.mobile-menu .mobile-menu-social {
    display: flex;
    align-items: center;
}

.mobile-menu .mobile-menu-social .icon:first-of-type {
    margin-left: 0px;
}

.mobile-menu .mobile-menu-social .icon:first-of-type a {
    font-size: 19px;
}

.mobile-menu .mobile-menu-social .icon {
    margin: 0px 10px;
}

.mobile-menu .mobile-menu-social .icon a:hover {
    opacity: 0.7;
}

.mobile-menu .mobile-menu-social .icon a i {
    font-size: 21px;
}

.mobile-menu .contact-details {
    flex-direction: column;
	margin-top: 30px;
}

/*** breadcrumb ***/
/*** breadcrumbs ***/
.breadcrumb nav {
    display: block !important;
    /* 	text-transform: uppercase; */
    /* 	padding: 0 25px; */
}

.🍞,
.bread {
    list-style-type: none;
    margin: 0;
    padding: 0;
    /* 	text-transform: uppercase; */
    color: #ffffff;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.🍞 li,
.bread li {
    display: inline-block;
    margin: 0 0 0 5px;
    color: #ffffff;

}

.bread li a {
    color: #ffffff;
    font-size: 14px;
    font-weight: 300;
}

.🍞 .crumb:last-child a span {
    display: block;
    /* Make span a block to control width */
    max-width: 200px;
    /* Adjust width as needed */
    overflow: hidden;
    /* Hide overflowing content */
    white-space: nowrap;
    /* Prevent the text from wrapping to the next line */
    text-overflow: ellipsis;
    /* Add ellipsis (...) when text overflows */
    color: #fff;
    color: var(--be);
	opacity: 0.4;
}


/*** newsletter ***/

.newsletter {
    background: var(--SCIGRIP---Gradient, linear-gradient(32deg, #013383 24.18%, #004A99 100%));
    padding: 50px 30px;
    box-sizing: border-box;

}

.newsletter-container {
    max-width: 1530px;
    margin: 0 auto;

    display: flex;
    /* 	background-color: #fff; */
    /* 	padding: 30px 30px; */
    box-sizing: border-box;
    align-items: center;
    border-radius: 5px;
}

.newsletter h2 {
    font-size: 22px;
}

.newsletter .text p {
    font-size: 18px;
    color: #fff;
    font-weight: 400;
}

.newsletter .left {
    width: 50%;
}

.newsletter .right {
    width: 50%;
    padding-left: 30px;
    /* 			box-sizing: border-box; */
}

.newsletter .right p {
    padding-top: 0px;
}

.newsletter .right p.form-text {
    padding-top: 15px;
    color: #fff;
}

.newsletter label {
    display: flex;
}

.newsletter .right .acceptance p {
    color: #fff;
    margin-top: 20px;
    font-weight: 400;
    font-size: 14px;
}

.newsletter .right .acceptance p a {
    color: #fff;
    text-decoration: underline;

}

.newsletter .right .acceptance p a:hover {
    opacity: 0.7;
}

.newsletter label input[type=email] {
    color: var(--black);
    background-color: #fff;
    font-size: 16px;
    padding: 15px 15px;
    box-sizing: border-box;
    border: 1px solid #fff;
    font-family: "aktiv-grotesk", sans-serif;
    font-weight: 400;
    -webkit-appearance: none;
    border-radius: 0;
    width: 100%;

    border-radius: 5px
}

.newsletter label input[type=email]:focus {
    outline: none;
}

.newsletter label input[type=email]::placeholder {
    color: var(--black);
    font-size: 16px;
    font-family: "aktiv-grotesk", sans-serif;
    font-weight: 400;
}

.newsletter label input[type=submit] {
    background: #FFD343;
    color: #0C0705;
    font-size: 18px;
    font-family: "aktiv-grotesk", sans-serif;
    font-weight: 400;
    width: 172px;
    max-height: 50px;
    box-shadow: none;
    -webkit-appearance: none;
    border: none;
    border-radius: 0 5px 5px 0;
}

.newsletter .wpcf7-submit {
    background: var(--yellow);
    color: #013787;
    font-size: 16px;
    font-family: "aktiv-grotesk", sans-serif;
    font-weight: 400;
    border-radius: 5px;
    max-height: 53px;
    box-shadow: none;
    -webkit-appearance: none;
    border: none;
    transition: 0.5s;
    max-width: 240px;
    width: 100%;
    box-sizing: border-box;

    margin-left: 10px;
}

.newsletter .wpcf7-submit:hover {
    opacity: 0.6;
    cursor: pointer;
}

.newsletter .wpcf7-submit::before {
    /* 	content: "\f054";
	font-family: "Font Awesome 5 Free";
	font-weight: 900; */
}

.newsletter .wpcf7-form-control-wrap {
    width: 100%;
}

.newsletter .on-form {
    display: none;
}

.newsletter label br {
    display: none;
}

@media (max-width: 800px) {

    .newsletter-container {
        flex-wrap: wrap;
    }

    .newsletter .left {
        width: 100%;

        margin-bottom: 20px;
    }


    .newsletter .right {
        width: 100%;
        padding-left: 0px;
    }

    /* 			.newsletter label {
	flex-direction: column;
}
	*/
    /* 			.newsletter .wpcf7-submit {
	border-radius: 40px 40px 40px 40px;
	padding: 15px 20px;
	text-align: center;
	margin: 0px auto 0px;
	width: 250px;
	display: block;
}
	*/

    .newsletter p.on-form {
        display: block;
        padding-top: 0px !important;
        text-align: center;
    }

    .newsletter .desktop {
        text-align: center;
    }

    .newsletter .title>* {
        font-size: 22px;
    }

    .newsletter {
        padding: 40px 30px;
    }

    .newsletter .wpcf7-submit~br {
        display: none;
    }



}

@media (max-width: 600px) {
    .newsletter label {
        flex-direction: column;
    }

    .newsletter label input[type=email] {
        border-radius: 5px 5px;
    }

    .newsletter .wpcf7-submit {
        padding: 15px 20px;
        border-radius: 5px 5px;
        width: 100%;
        margin-left: 0px;
        max-width: none;
        margin-top: 10px;
    }

    .newsletter {
        padding: 55px 20px;
    }

    .newsletter .right .acceptance p {
        font-size: 14px;
    }
}



/****** footer ***/

.top-footer {
    padding: 50px 30px 50px;
    box-sizing: border-box;
/*     background-color: #fff; */
    color: var(--db);
}

.top-footer a {
    color: #1C1C1C;
    font-size: 16px;
}

.top-footer-container {
    max-width: 1530px;
    margin: 0 auto;
    display: flex;
    gap: 40px;
    flex-wrap: wrap;
}

.top-footer .footer-logos {
    width: 100%;
}

.top-footer-container .col:first-of-type::before {
    display: none;
}

.top-footer-container .col:nth-of-type(2)::before {
    display: none;
}

.top-footer-container .col::before {
    content: '';
    background-color: var(--blue);
    height: 100%;
    left: -40px;

    position: absolute;
    display: block;
    width: 1px;
}

.top-footer-container .col {
    flex: 1 1 calc(20% - 80px);
    position: relative;
}

.top-footer-container .col .address p {
    color: #fff;
    line-height: 26px;
    font-weight;
    300;
    margin-top: 10px;
}

.top-footer-container .col ul {
    list-style-type: none;
    padding-left: 0px;
    margin: 0px;
}

.top-footer-container .col ul li {
    padding: 20px 0 0;
}

.top-footer-container .col ul li a {
    font-weight: 200;
}

.top-footer-container .col ul li a:hover {
    opacity: 0.6;
}

.top-footer-container .col .linkedin {
    background-color: #008AD2;
    border-radius: 5px;
    color: #fff;
    display: block;
    display: flex;
    padding: 15px 20px;
    box-sizing: border-box;
    margin-top: 20px;
    align-items: center;
    font-size: 14px;
    transition: 0.5s;

}

.top-footer-container .col .linkedin:hover {
    opacity: 0.6;
}

.top-footer-container .col .linkedin svg {
    padding-right: 15px;
    border-right: 1px solid #fff;
    font-size: 24px;
    margin-right: 15px;
}

.top-footer-container .col .tel,
.top-footer-container .col .email {
    padding-top: 20px;
    transition: 0.5s;
}

.top-footer-container .col .tel:hover,
.top-footer-container .col .email:hover {
    opacity: 0.6;
}

.top-footer-container .col .tel,
.top-footer-container .col .email {
    font-weight: 300;
}

.top-footer-container .col .tel span,
.top-footer-container .col .email span {
    font-weight: 400;
    color: var(--lb);
}

.top-footer-container .col .footer-title>* {
    font-size: 16px;
    font-weight: 500;
    color: var(--blue);
}

.top-footer-container .col .footer-title.connect>* {
    margin-top: 30px;
    padding-bottom: 20px;
}

.top-footer-container .col .social-icons {
    display: flex;
    gap: 20px;
    margin: 20px 0 20px;
    flex-direction: column;
    justify-content: flex-start;

}

.top-footer-container .col .social-icons .icon a {
    display: flex;
    /* 	width: 61px;
	height: 55px;
	background-color: #008AD2; */
    align-items: center;
    justify-content: flex-start;
    /* 	border-radius: 10px; */
    font-size: 16px;
    gap: 15px;
}

.top-footer-container .col .social-icons .icon a i {
    font-size: 20px;
    width: 25px;
    text-align: center;
}

.top-footer-container .col .social-icons .icon a:hover {
    opacity: 0.6;
}

.top-footer-container .col .social-icons .icon a svg {
    font-size: 26px;
}

.top-footer-container .col .social-icons .icon.fb a svg {
    font-size: 22px;
}

.top-footer-container .col:first-of-type .footer-logos {
    margin-top: 0px;
}

.top-footer-container .col .footer-logos {
    display: flex;
    gap: 10px;
/*     margin-top: 20px; */
}

.top-footer-container .footer-logos img {
    display: block;
    width: 220px;
    object-fit: contain;
}

.top-footer-container .col .footer-logos .image img {
    height: 88px;
    display: block;
    object-fit: contain;
    width: auto;

}

.bottom-footer {
    background-color: var(--blue);
    border-top: 1px solid #fff;
    text-align: center;
}

.bottom-footer .bottom-footer-container {
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    max-width: 1590px;
}

.bottom-footer p {
    color: #fff;

    padding: 30px 20px;
    box-sizing: border-box;
    font-size: 14px;
}

.bottom-footer p span {
	margin: 0 10px;
	display: inline-block;
}

.bottom-footer p a {
    color: inherit;
}

.bottom-footer p a:hover {
    opacity: 0.6;
}

@media (max-width: 1100px) {
    .top-footer-container .col:first-of-type,
	 .top-footer-container .col:nth-of-type(2) {
        flex: 1 1 100%;
    }

    .top-footer-container .col:nth-of-type(2)::before {
        display: none;
    }
}

@media (max-width: 1000px) {
    .top-footer {
        padding: 50px 30px 50px;
    }
}

@media (max-width: 800px) {
    .top-footer-container .col:last-of-type {
/*         flex: 1 1 100%; */
    }

    .top-footer-container .col::before {
        display: none;
    }

    .bottom-footer .bottom-footer-container {
        flex-direction: column;
    }

    .bottom-footer p {
        padding: 5px;
    }

    .bottom-footer {
        padding: 10px 20px;
        box-sizing: border-box;
    }
	
	.top-footer-container .col {
		flex: 1 1 calc(50% - 80px);
	}
}

@media (max-width: 600px) {
    /* 	.top-footer-container {
	flex-wrap: wrap;
}
	.top-footer-container .col {
	flex: 1 1 calc(50% - 20px);
	text-align: center;
}

	.top-footer-container .col:first-of-type {
	flex: 1 1 100%;

	margin-bottom: 30px;
}

	.top-footer-container .col .linkedin {
	width: fit-content;
	margin: 20px auto;
	min-width: 285px;
}

	.top-footer-container .col:last-of-type {
	margin-top: 20px;
}
	.top-footer-container .col .social-icons .icon a {
	margin: 0 auto;
}

	.top-footer-container .footer-logos {
	flex-direction: column;
	justify-content: center;

}
	.top-footer-container .footer-logos img {
	margin: 0 auto;
} */
	.top-footer-container .footer-logos img {
		width: 197px;
	}
    .top-footer {
        padding: 30px 30px;
    }

    .top-footer-container {
        gap: 40px;
    }
	
	.top-footer .contact-region {
		align-items: flex-start;
	}
	
	.top-footer-container .col .footer-logos .image img {
		width: 97px;
		height: auto;
	}
	
	
	.top-footer {
		padding: 30px 20px;
	}
	
	.top-footer a,
	.top-footer-container .col .footer-title>* {
		font-size: 14px;
	}
}

@media (max-width: 450px) {
    /* 	.top-footer-container .col {
	flex: 1 1 100%;
	margin-top: 20px;
}

	.top-footer-container .col:first-of-type {
	margin-bottom: 10px;
} */
}








/* ========================================
   PAGE CONTENT — GUTENBERG BLOCK STYLES
   Scoped under .page-content
   ======================================== */

.page-content {
    padding: 60px 30px 80px;
	background-color: #fff;
	position: relative;
	box-sizing: border-box;
}

.page-content-container {
    max-width: 1280px;
    margin: 0 auto;
 
}

/* ========================================
   TYPOGRAPHY — BASE
   ======================================== */

.page-content h1,
.page-content h2,
.page-content h3,
.page-content h4,
.page-content h5,
.page-content h6 {
    color: var(--blue);
    font-weight: 400;
    line-height: 1.3;
    margin: 0 0 16px;
}

.page-content h1 {
    font-size: 42px;
    margin-bottom: 24px;
}

.page-content h2 {
    font-size: 32px;
    font-weight: 400;
    color: var(--blue);
    margin-top: 38px;
    margin-bottom: 0px;
}

.page-content h3 {
    font-size: 24px;
    font-weight: 400;
    color: var(--blue);
    margin-top: 36px;
    margin-bottom: 16px;
}

.page-content h4 {
    font-size: 20px;
    font-weight: 400;
    color: var(--blue);
    margin-top: 32px;
    margin-bottom: 12px;
}

.page-content h5 {
    font-size: 18px;
    font-weight: 400;
    color: var(--blue);
    margin-top: 28px;
    margin-bottom: 10px;
}

.page-content h6 {
    font-size: 16px;
    font-weight: 400;
    color: var(--blue);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 24px;
    margin-bottom: 10px;
}

/* First heading shouldn't have top margin */
.page-content>.page-content-container>*:first-child {
    margin-top: 0;
}

/* ========================================
   PARAGRAPHS & BODY TEXT
   ======================================== */

.page-content p {
    font-size: 16px;
    line-height: 1.8;
    color: var(--black);
/*     margin: 0 0 20px; */
}

.page-content p:last-child {
    margin-bottom: 0;
}

.page-content strong,
.page-content b {
    font-weight: 700;
    color: var(--black);
}

.page-content em,
.page-content i {
    font-style: italic;
}

/* ========================================
   LINKS
   ======================================== */

.page-content a {
    color: var(--blue);
    text-decoration: underline;
    text-decoration-color: rgba(0, 74, 153, 0.3);
    text-underline-offset: 3px;
    transition: color 0.3s ease, text-decoration-color 0.3s ease;
}

.page-content a:hover {
    color: var(--cyan);
    text-decoration-color: var(--cyan);
}

/* ========================================
   LISTS — UL / OL
   ======================================== */

.page-content ul,
.page-content ol {
    margin: 0 0 24px;
    padding-left: 24px;
    font-size: 16px;
    line-height: 1.8;
    color: var(--black);
}

.page-content ul {
    list-style: none;
    padding-left: 0;
}

.page-content ul li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 10px;
}

.page-content ul li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 20px;
    width: 8px;
    height: 8px;
    background-color: var(--blue);
    border-radius: 50%;
}

.page-content ol li {
    margin-bottom: 10px;
    padding-left: 4px;
}

.page-content ol li::marker {
    color: var(--blue);
    font-weight: 700;
}

/* Nested lists */
.page-content ul ul,
.page-content ol ol,
.page-content ul ol,
.page-content ol ul {
    margin-top: 8px;
    margin-bottom: 8px;
}

.page-content ul ul li::before {
    background-color: transparent;
    border: 2px solid var(--blue);
    width: 6px;
    height: 6px;
    top: 12px;
}

/* ========================================
   IMAGES — wp-block-image
   ======================================== */

.page-content img {
    max-width: 100%;
    height: auto;
    display: block;
    border-radius: 8px;
}

.page-content .wp-block-image {
    margin: 32px 0;
}

.page-content .wp-block-image img {
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.page-content .wp-block-image figcaption {
    font-size: 13px;
    color: #888;
    text-align: center;
    margin-top: 10px;
    font-style: italic;
}

/* Alignment */
.page-content .aligncenter {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.page-content .alignleft {
    float: left;
    margin: 8px 24px 16px 0;
    max-width: 50%;
}

.page-content .alignright {
    float: right;
    margin: 8px 0 16px 24px;
    max-width: 50%;
}

.page-content .alignfull {
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    max-width: 100vw;
    width: 100vw;
}

.page-content .alignfull img {
    border-radius: 0;
    width: 100%;
}

.page-content .alignwide {
    margin-left: -40px;
    margin-right: -40px;
    max-width: calc(100% + 80px);
}

/* ========================================
   GALLERY — wp-block-gallery
   ======================================== */

.page-content .wp-block-gallery {
    margin: 32px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.page-content .wp-block-gallery .wp-block-image {
    margin: 0;
    flex: 1 1 calc(33.333% - 8px);
    min-width: 200px;
}

.page-content .wp-block-gallery .wp-block-image img {
    width: 100%;
    height: 240px;
    object-fit: cover;
}

/* ========================================
   BLOCKQUOTE
   ======================================== */

.page-content blockquote,
.page-content .wp-block-quote {
    margin: 32px 0;
    padding: 24px 28px;
    border-left: 4px solid var(--blue);
    background-color: #f5f8fc;
    border-radius: 0 8px 8px 0;
}

.page-content blockquote p,
.page-content .wp-block-quote p {
    font-size: 18px;
    font-style: italic;
    color: var(--black);
    line-height: 1.7;
    margin-bottom: 12px;
}

.page-content blockquote p:last-child,
.page-content .wp-block-quote p:last-child {
    margin-bottom: 0;
}

.page-content blockquote cite,
.page-content .wp-block-quote cite {
    display: block;
    margin-top: 12px;
    font-size: 14px;
    color: #888;
    font-style: normal;
}

/* Pull quote */
.page-content .wp-block-pullquote {
    margin: 40px 0;
    padding: 32px 0;
    border-top: 3px solid var(--blue);
    border-bottom: 3px solid var(--blue);
    text-align: center;
}

.page-content .wp-block-pullquote blockquote {
    border: none;
    background: none;
    padding: 0;
    margin: 0;
}

.page-content .wp-block-pullquote p {
    font-size: 22px;
    font-weight: 400;
    color: var(--blue);
}

/* ========================================
   SEPARATOR / HR
   ======================================== */

.page-content hr,
.page-content .wp-block-separator {
    border: none;
    height: 2px;
    background: linear-gradient(90deg, transparent, #d0d8e0, transparent);
    margin: 40px 0;
}

.page-content .wp-block-separator.is-style-wide {
    max-width: 100%;
}

.page-content .wp-block-separator.is-style-dots {
    background: none;
    text-align: center;
    height: auto;
}

.page-content .wp-block-separator.is-style-dots::before {
    content: '···';
    font-size: 24px;
    letter-spacing: 12px;
    color: var(--blue);
}

/* ========================================
   TABLE
   ======================================== */

.page-content table,
.page-content .wp-block-table table {
    width: 100%;
    border-collapse: collapse;
    margin: 32px 0;
    font-size: 15px;
}

.page-content table thead th {
    background-color: var(--blue);
    color: #fff;
    font-weight: 600;
    text-align: left;
    padding: 14px 18px;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.page-content table thead th:first-child {
    border-radius: 8px 0 0 0;
}

.page-content table thead th:last-child {
    border-radius: 0 8px 0 0;
}

.page-content table tbody td {
    padding: 14px 18px;
    color: var(--black);
    border-bottom: 1px solid #e8ecf0;
}

.page-content table tbody tr:nth-child(even) {
    background-color: #f8f9fb;
}

.page-content table tbody tr:hover {
    background-color: #edf2ff;
    transition: background-color 0.2s ease;
}

.page-content .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
    background-color: #f5f8fc;
}

/* ========================================
   CODE / PREFORMATTED
   ======================================== */

.page-content code {
    display: inline;
    background-color: #f0f3f7;
    color: var(--blue);
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 14px;
    font-family: 'Courier New', Courier, monospace;
}

.page-content pre,
.page-content .wp-block-code,
.page-content .wp-block-preformatted {
    background-color: #1a1f36;
    color: #e2e8f0;
    padding: 24px 28px;
    border-radius: 8px;
    overflow-x: auto;
    margin: 32px 0;
    font-size: 14px;
    line-height: 1.6;
}

.page-content pre code,
.page-content .wp-block-code code {
    background: none;
    color: inherit;
    padding: 0;
    font-size: inherit;
}

/* ========================================
   VIDEO / EMBED / IFRAME
   ======================================== */

.page-content .wp-block-embed,
.page-content .wp-block-video {
    margin: 32px 0;
}

.page-content .wp-block-embed__wrapper {
    position: relative;
    padding-bottom: 56.25%;
    /* 16:9 */
    height: 0;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.page-content .wp-block-embed__wrapper iframe,
.page-content .wp-block-embed__wrapper video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
}

.page-content iframe {
    max-width: 100%;
    border: none;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.page-content video {
    max-width: 100%;
    border-radius: 8px;
    display: block;
}

.page-content .wp-block-video figcaption {
    font-size: 13px;
    color: #888;
    text-align: center;
    margin-top: 10px;
    font-style: italic;
}

/* ========================================
   BUTTONS — wp-block-buttons
   ======================================== */

.page-content .wp-block-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 28px 0;
}

.page-content .wp-block-button .wp-block-button__link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    border-radius: 5px;
    transition: all 0.3s ease;
    background-color: var(--yellow);
    color: var(--blue);
}

.page-content .wp-block-button .wp-block-button__link:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(255, 232, 0, 0.4);
}

.page-content .wp-block-button.is-style-outline .wp-block-button__link {
    background-color: transparent;
    color: var(--blue);
    border: 2px solid var(--blue);
}

.page-content .wp-block-button.is-style-outline .wp-block-button__link:hover {
    background-color: var(--blue);
    color: #fff;
    box-shadow: 0 4px 15px rgba(0, 74, 153, 0.3);
}

/* ========================================
   COLUMNS — wp-block-columns
   ======================================== */

.page-content .wp-block-columns {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin: 32px 0;
}

.page-content .wp-block-column {
    flex: 1;
    min-width: 0;
}

/* ========================================
   GROUP / COVER
   ======================================== */

.page-content .wp-block-group {
    margin: 32px 0;
}

.page-content .wp-block-cover {
    margin: 32px 0;
    border-radius: 8px;
    overflow: hidden;
    min-height: 300px;
}

/* ========================================
   DETAILS / ACCORDION (WP 6.3+)
   ======================================== */

.page-content details,
.page-content .wp-block-details {
    margin: 16px 0;
    border: 1px solid #e0e4e8;
    border-radius: 8px;
    overflow: hidden;
}

.page-content details summary {
    padding: 16px 20px;
    font-weight: 600;
    color: var(--blue);
    cursor: pointer;
    background-color: #f8f9fb;
    transition: background-color 0.2s ease;
}

.page-content details summary:hover {
    background-color: #edf2ff;
}

.page-content details[open] summary {
    border-bottom: 1px solid #e0e4e8;
}

.page-content details>*:not(summary) {
    padding: 0 20px;
}

.page-content details>p:first-of-type {
    padding-top: 16px;
}

/* ========================================
   SPACER
   ======================================== */

.page-content .wp-block-spacer {
    display: block;
}

/* ========================================
   FILE DOWNLOAD
   ======================================== */

.page-content .wp-block-file {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    background-color: #f5f8fc;
    border-radius: 8px;
    margin: 24px 0;
    border: 1px solid #e0e4e8;
}

.page-content .wp-block-file a:first-child {
    color: var(--blue);
    font-weight: 600;
    text-decoration: none;
}

.page-content .wp-block-file .wp-block-file__button {
    display: inline-flex;
    align-items: center;
    padding: 8px 18px;
    font-size: 13px;
    font-weight: 600;
    background-color: var(--blue);
    color: #fff;
    border-radius: 5px;
    text-decoration: none;
    transition: all 0.3s ease;
    margin-left: auto;
}

.page-content .wp-block-file .wp-block-file__button:hover {
    background-color: #003570;
    transform: translateY(-1px);
}

/* ========================================
   LIST BLOCK (wp-block-list)
   ======================================== */

.page-content .wp-block-list {
    margin: 0 0 24px;
}

/* ========================================
   CLEAR FLOATS
   ======================================== */

.page-content::after {
    content: '';
    display: table;
    clear: both;
}

/* ========================================
   RESPONSIVE
   ======================================== */

@media (max-width: 1200px) {
    .page-content h2 {
        font-size: 28px;
    }

    .page-content h3 {
        font-size: 22px;
    }
}

@media (max-width: 991px) {
    .page-content {
        padding: 50px 0 60px;
    }

    .page-content-container {
        padding: 0 30px;
    }

    .page-content h2 {
        font-size: 26px;
        margin-top: 36px;
    }

    .page-content h3 {
        font-size: 20px;
        margin-top: 28px;
    }

    .page-content .wp-block-columns {
        gap: 24px;
    }

    .page-content .alignleft,
    .page-content .alignright {
        float: none;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
}

@media (max-width: 768px) {
    .page-content {
        padding: 40px 0 50px;
    }

    .page-content-container {
        padding: 0 20px;
    }

    .page-content h1 {
        font-size: 32px;
    }

    .page-content h2 {
        font-size: 24px;
        margin-top: 32px;
    }

    .page-content h3 {
        font-size: 20px;
    }

    .page-content h4 {
        font-size: 18px;
    }

    .page-content p {
        font-size: 15px;
    }

    .page-content ul,
    .page-content ol {
        font-size: 15px;
    }

    .page-content .wp-block-columns {
        flex-direction: column;
    }

    .page-content .wp-block-gallery .wp-block-image {
        flex: 1 1 calc(50% - 6px);
        min-width: 140px;
    }

    .page-content .wp-block-gallery .wp-block-image img {
        height: 180px;
    }

    .page-content .alignwide {
        margin-left: -20px;
        margin-right: -20px;
        max-width: calc(100% + 40px);
    }

    .page-content blockquote,
    .page-content .wp-block-quote {
        padding: 20px 22px;
    }

    .page-content blockquote p,
    .page-content .wp-block-quote p {
        font-size: 16px;
    }

    .page-content .wp-block-pullquote p {
        font-size: 18px;
    }

    .page-content table thead th,
    .page-content table tbody td {
        padding: 10px 14px;
        font-size: 14px;
    }

    .page-content .wp-block-buttons {
        flex-direction: column;
    }

    .page-content .wp-block-button .wp-block-button__link {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .page-content h2 {
        font-size: 22px;
    }

    .page-content h3 {
        font-size: 18px;
    }

    .page-content .wp-block-gallery .wp-block-image {
        flex: 1 1 100%;
    }

    .page-content .wp-block-gallery .wp-block-image img {
        height: 200px;
    }
}


/* ========================================
   SEARCH RESULTS PAGE
   ======================================== */

/* ── Hero overrides for search ── */
.search-page .hero.centered {
    padding: 60px 0 50px;
}

/* ── Inline Search Form ── */
.search-results-form {
    max-width: 520px;
    margin: 28px auto 0;
}

.search-results-input-wrap {
    display: flex;
    align-items: center;
    background: #fff;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50px;
    padding: 4px 5px 4px 20px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.search-results-input-wrap:focus-within {
    border-color: #004A99;
    box-shadow: 0 4px 24px rgba(0, 74, 153, 0.12);
}

.search-results-input-icon {
    color: #98a2b3;
    font-size: 15px;
    margin-right: 12px;
    flex-shrink: 0;
}

.search-results-input {
    flex: 1;
    border: none;
    outline: none;
    font-size: 15px;
    padding: 10px 0;
    background: transparent;
    color: #1d2939;
    font-family: inherit;
}

.search-results-input::placeholder {
    color: #98a2b3;
}

.search-results-submit {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 22px;
    font-size: 14px;
    font-weight: 600;
    color: #004A99;
    background: #FFE800;
    border: none;
    border-radius: 50px;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.2s ease, transform 0.15s ease;
    font-family: inherit;
}

.search-results-submit:hover {
    background: #e6d100;
    transform: translateY(-1px);
}

.search-results-submit i {
    font-size: 12px;
    transition: transform 0.2s ease;
}

.search-results-submit:hover i {
    transform: translateX(2px);
}

/* ── Live Search Dropdown ── */
.search-results-form {
    position: relative;
    z-index: 9999;
}

.search-refine-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #e4e7ec;
    border-top: none;
    border-radius: 0 0 12px 12px;
    max-height: 380px;
    overflow-y: auto;
    display: none;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.10);
    z-index: 9999;
    text-align: left;
}

.search-refine-dropdown.open {
    display: block;
}

.search-refine-dropdown .ajax-search-view-all,
.search-refine-view-all {
    display: block;
    text-align: center;
    padding: 14px 16px;
    font-size: 14px;
    font-weight: 600;
    color: #004A99;
    text-decoration: none;
    border-top: 1px solid #e4e7ec;
    transition: background 0.15s ease, color 0.15s ease;
    position: sticky;
    bottom: 0;
    background: #fff;
}

.search-refine-view-all:hover {
    background: #f0f4ff;
}

.search-refine-view-all i {
    font-size: 12px;
    margin-left: 4px;
    transition: transform 0.2s ease;
}

.search-refine-view-all:hover i {
    transform: translateX(3px);
}


/* ── Results Section ── */
.search-results-section {
    padding: 60px 0 80px;
    background: #f8f9fb;
}

.search-results-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ── Type Groups ── */
.search-type-group {
    margin-bottom: 40px;
}

.search-type-group:last-child {
    margin-bottom: 0;
}

.search-type-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e2e8f0;
}

.search-type-title {
    font-size: 22px;
    font-weight: 600;
    color: var(--blue, #004A99);
    margin: 0;
}

.search-type-count {
    font-size: 14px;
    color: #888;
    font-weight: 400;
}

/* ── Results Grid ── */
.search-results-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

/* Resource cards inside search results — override the hub's calc width */
.search-results-grid .resource-card.search-resource-card {
    width: 100%;
}

/* ── Result Card ── */
.search-result-card {
    display: flex;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    text-decoration: none;
    color: #1d2939;
    border: 1px solid #e4e7ec;
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.search-result-card:hover {
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    transform: translateY(-3px);
}

/* ── Card Image ── */
.search-result-image {
    width: 180px;
    flex-shrink: 0;
    overflow: hidden;
}

.search-result-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.search-result-card:hover .search-result-image img {
    transform: scale(1.05);
}

/* ── Card Content ── */
.search-result-content {
    flex: 1;
    padding: 20px 24px;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.search-result-type {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #004A99;
    background: #edf2ff;
    padding: 3px 10px;
    border-radius: 4px;
    margin-bottom: 8px;
    align-self: flex-start;
}

.search-result-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 8px;
    color: #1d2939;
    transition: color 0.2s ease;
}

.search-result-card:hover .search-result-title {
    color: #004A99;
}

.search-result-excerpt {
    font-size: 14px;
    line-height: 1.6;
    color: #667085;
    margin: 0 0 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.search-result-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #004A99;
    margin-top: auto;
}

.search-result-link i {
    font-size: 11px;
    transition: transform 0.2s ease;
}

.search-result-card:hover .search-result-link i {
    transform: translateX(3px);
}


/* ── AJAX Loading Transition ── */
#search-results-content {
    transition: opacity 0.25s ease;
}

/* ── Pagination (AJAX buttons) ── */
.search-results-pagination {
    margin-top: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
}

.search-page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    font-size: 14px;
    font-weight: 500;
    color: #344054;
    text-decoration: none;
    border-radius: 8px;
    border: 1px solid #e4e7ec;
    background: #fff;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s ease;
}

.search-page-btn:hover {
    background: #f0f5ff;
    border-color: #004A99;
    color: #004A99;
}

.search-page-btn.active {
    background: #004A99;
    border-color: #004A99;
    color: #fff;
    font-weight: 600;
    pointer-events: none;
}

.search-page-prev,
.search-page-next {
    gap: 6px;
    font-weight: 600;
    color: #004A99;
}

.search-page-prev i,
.search-page-next i {
    font-size: 11px;
}


/* ── No Results ── */
.search-no-results {
    text-align: center;
    padding: 80px 20px;
}

.search-no-results-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: #edf2ff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
}

.search-no-results-icon i {
    font-size: 32px;
    color: #004A99;
}

.search-no-results h2 {
    font-size: 24px;
    font-weight: 700;
    color: #1d2939;
    margin: 0 0 10px;
}

.search-no-results p {
    font-size: 15px;
    color: #667085;
    max-width: 480px;
    margin: 0 auto 28px;
    line-height: 1.6;
}

.search-no-results .btn-main.yellow-bg {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 4px;
    background-color: #FFE800;
    color: #004A99;
    transition: all 0.3s ease;
}

.search-no-results .btn-main.yellow-bg:hover {
    background-color: #e6d100;
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(255, 232, 0, 0.3);
}


/* ========================================
   RESPONSIVE
   ======================================== */

@media (max-width: 991px) {
    .search-results-grid {
        grid-template-columns: 1fr;
    }

    .search-result-image {
        width: 150px;
    }
}

@media (max-width: 768px) {
    .search-results-section {
        padding: 40px 0 60px;
    }

    .search-results-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .search-type-group {
        margin-bottom: 30px;
    }

    .search-type-title {
        font-size: 18px;
    }

    .search-result-card {
        flex-direction: column;
    }

    .search-result-image {
        width: 100%;
        height: 180px;
    }

    .search-result-content {
        padding: 16px 18px;
    }

    .search-result-title {
        font-size: 16px;
    }

    .search-results-form {
        max-width: 100%;
    }

    .search-results-input-wrap {
        padding: 4px 4px 4px 16px;
    }

    .search-results-submit {
        padding: 10px 16px;
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .search-result-image {
        height: 150px;
    }

    .search-page-btn {
        min-width: 36px;
        height: 36px;
        font-size: 13px;
        padding: 0 8px;
    }
}

/* Default Styles */

.title h2 {
    font-size: 32px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.title h3 {
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.subtitle h3 {
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.title.blue>* {
    color: #004A99;
}

.title.yellow>* {
    color: #FFE800;
}

.title.white>* {
    color: #ededed;
}

.white {
    color: #ededed;
}

.blue {
    color: #004A99;
}

.yellow {
    color: #FFE800;
}

.blue-bg {
    background-color: #004A99;
}

.yellow-bg {
    background-color: #FFE800;
}

.white-bg {
    background-color: #ededed;
}

.btn-main.white-bg {
    background-color: #ededed;
    color: #004A99;
}

.btn-main.yellow-bg {
    background-color: #FFE800;
    color: #004A99;
}

.btn-main.blue-bg {
    background-color: var(--blue);
    color: #ededed;
	border: 1px solid var(--blue);
}

.btn-main.blue-bg:hover {
	background-color: transparent;
	color: var(--blue);
}

.btn-main.cyan-bg {
    background-color: #45C0EE;
    color: #004A99;

}

.cyan {
    color: #1BA0CC;
}

.btn-main {
    display: block;
    padding: 14px 20px;
    font-size: 16px;
    font-weight: 400;
    text-decoration: none;
    border-radius: 5px;
    transition: all 0.3s ease;
    text-align: center;
    min-width: 240px;
    box-sizing: border-box;
}


:root {
    --blue: #004A99;
    --yellow: #FFE800;
    --white: #ededed;
    --cyan: #45C0EE;
    --grey: #6B6969;
    --black: #1C1C1C;
}

a {
    color: xxxx;
    text-decoration: none;
    transition: .5s;
}

a:hover {
    color: xxxx;
}

blockquote {
    border-left: 5px solid 000000 !important;
    margin: 0px;
    padding: 20px;
}

blockquote,
table,
table thead {
    background-color: #dfdfdf;
    /* 	border: 2px solid #dfdfdf; */
}

blockquote h1,
blockquote h2,
blockquote h3,
blockquote h4,
blockquote h5,
blockquote h6,
blockquote p {
    padding: 0px;
}

blockquote cite {
    font-style: italic;
    font-weight: bold;
}

body {
    font-family: "aktiv-grotesk", sans-serif;
	background-color: #FAFBFB;
    margin: 0px;
    padding: 0px;
}

.clearfix {
    display: block;
}

.clearfix:after {
    clear: both;
    content: ' ';
    display: block;
    font-size: 0px;
    height: 0px;
    visibility: hidden;
}

.column {
    float: left;
    width: 50%;
}

.container {
    margin: 0px auto;
    padding: 0px;
    width: xxxx;
}

@media (max-width: xxxxpx) {
    .container {
        width: 90%;
    }
}

footer,
header,
section {
    float: left;
    margin: 0px;
    padding: 0px;
    width: 100%;
}

em {
    font-style: italic;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-style: normal;
    font-weight: normal;
    margin: 0px;
    padding: 0px;
}

img {
    height: auto;
    max-width: 100%;
}

nav .column.left {
    width: 25%;
}

nav .column.right {
    width: 75%;
}

nav .menu-item-has-children {
    position: relative;
}

nav .menu-item-has-children:focus .sub-menu,
nav .menu-item-has-children:focus-within .sub-menu,
nav .menu-item-has-children:hover .sub-menu {
    opacity: 1;
    transform: translateY(0%);
    transition-delay: 0s, 0s, 0.25s;
    visibility: visible;
    z-index: 1;
}

nav .sub-menu {
    background-color: #ffffff;
    left: 0px;
    opacity: 0;
    padding: 10px;
    position: absolute;
    top: 100%;
    transform: translateY(-10px);
    transition: all 0.25s ease-in-out 0s, visibility 0s linear 0.25s, z-index 0s linear 0.01s;
    visibility: hidden;
    z-index: 1;
}

nav ul {
    float: right;
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}

nav ul li {
    display: inline-block;
    line-height: 20px;
    margin: 0px;
    padding: 0px 10px 0px 10px;
}

nav ul li:first-child {
    padding-left: 0px;
}

nav ul li:last-child {
    padding-right: 0px;
}

nav ul li a {
    color: xxxx;
}

nav ul li a:hover {
    color: xxxx;
}

nav ul li ul li,
nav ul li ul li:first-child,
nav ul li ul li:last-child {
    padding: 10px;
}

@media (max-width: 1100px) {
    nav {
        display: none;
    }
	header .header-right .tel {
		display: block;
	}
}

ol li,
ul li {
    padding: 10px 0px 0px 0px;
}

.outer {
    display: table;
    height: 100%;
    position: relative;
    width: 100%;
}

.outer .inner {
    display: table-cell;
    vertical-align: middle;
}

p {
    padding: 10px 0px 0px 0px;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    color: var(--grey);
}

p,
blockquote cite,
ol li,
ul li,
table {
    margin: 0px;
}

@media (min-width: 1101px) {
    .side-nav {
        display: none;
    }
}

.side-nav a {
    cursor: pointer;
    position: absolute;
    right: 5%;
}

.slick-next:before {
    content: "\f0da";
}

.slick-prev:before {
    content: "\f0d9";
}

.slick-next:before,
.slick-prev:before {
    color: #000000;
    font-family: 'FontAwesome';
    font-size: 60px;
}

.slick-next {
    right: -30px;
    z-index: 1;
}

.slick-prev {
    left: -30px;
    z-index: 1;
}

.slick-slider {
    margin-bottom: 0px;
}

@media (max-width: 1450px) {

    .slick-next:before,
    .slick-prev:before {
        font-size: 40px;
    }

    .slick-next {
        right: -20px;
    }

    .slick-prev {
        left: -20px;
    }
}

@media (max-width: 600px) {

    .slick-next:before,
    .slick-prev:before {
        font-size: 20px;
    }

    .slick-next {
        right: 0px;
    }

    .slick-prev {
        left: 0px;
    }
}

.slide-close a {
    color: #ffffff;
    cursor: pointer;
    position: absolute;
    right: 5%;
    z-index: 5003;
}

.slide-in-menu {
    background-color: #000000;
    height: 100%;
    left: 0px;
    opacity: 0;
    overflow: scroll;
    position: absolute;
    top: -100%;
    transition: 0.5s;
    width: 100%;
    z-index: 5001;
}

.slide-in-menu.active {
    position: fixed;
    opacity: 1;
    top: 0px;
}

.slide-in-menu li.active>ul {
    display: block;
}

.slide-in-menu ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}

.slide-in-menu ul li {
    margin: 0px;
    padding: 0px;
    text-align: center;
}

.slide-in-menu ul li a {
    color: var(--blue);
    opacity: 0;
    position: relative;
    transform: translateY(20px);
    transition: opacity .25s linear, color .5s linear, transform .3s cubic-bezier(.25, .46, .45, .94);
}

.slide-in-menu.active ul li a {
    opacity: 1;
    transform: translateY(0);
}

.slide-in-menu.active ul li:nth-of-type(1) a {
    transition: color .5s linear, opacity .25s linear .5s, transform .3s cubic-bezier(.25, .46, .45, .94) .5s;
}

.slide-in-menu.active ul li:nth-of-type(2) a {
    transition: color .5s linear, opacity .25s linear .6s, transform .3s cubic-bezier(.25, .46, .45, .94) .6s;
}

.slide-in-menu.active ul li:nth-of-type(3) a {
    transition: color .5s linear, opacity .25s linear .7s, transform .3s cubic-bezier(.25, .46, .45, .94) .7s;
}

.slide-in-menu.active ul li:nth-of-type(4) a {
    transition: color .5s linear, opacity .25s linear .8s, transform .3s cubic-bezier(.25, .46, .45, .94) .8s;
}

.slide-in-menu.active ul li:nth-of-type(5) a {
    transition: color .5s linear, opacity .25s linear .9s, transform .3s cubic-bezier(.25, .46, .45, .94) .9s;
}

.slide-in-menu.active ul li:nth-of-type(6) a {
    transition: color .5s linear, opacity .25s linear 1s, transform .3s cubic-bezier(.25, .46, .45, .94) 1s;
}

.slide-in-menu.active ul li:nth-of-type(7) a {
    transition: color .5s linear, opacity .25s linear 1.1s, transform .3s cubic-bezier(.25, .46, .45, .94) 1.1s;
}

.slide-in-menu.active ul li:nth-of-type(8) a {
    transition: color .5s linear, opacity .25s linear 1.2s, transform .3s cubic-bezier(.25, .46, .45, .94) 1.2s;
}

.slide-in-menu.active ul li:nth-of-type(9) a {
    transition: color .5s linear, opacity .25s linear 1.3s, transform .3s cubic-bezier(.25, .46, .45, .94) 1.3s;
}

.slide-in-menu.active ul li:nth-of-type(10) a {
    transition: color .5s linear, opacity .25s linear 1.4s, transform .3s cubic-bezier(.25, .46, .45, .94) 1.4s;
}

.slide-in-menu ul ul {
    display: none;
}

strong,
table thead th {
    font-weight: bold;
}

table {
    background-color: #ffffff;
    padding: 10px;
    text-align: left;
}

table th {
    padding: 10px;
}

.wp-block-table {
    margin: 0px;
}

:root {
    --blue: #004A99;
}

/* Theme Styles */


.title h2 {
    font-size: 32px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.title h3 {
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

@media (max-width: 600px) {
    .title h2 {
        font-size: 22px;
    }
}

.title.blue>* {
    color: #004A99;
}

.title.yellow>* {
    color: #FFE800;
}

.title.white>* {
    color: #ededed;
}

.white {
    color: #ededed;
}

.blue {
    color: #004A99;
}

.yellow {
    color: #FFE800;
}

.white-bg {
    background-color: #ededed;
}

.blue-bg {
    background-color: #004A99;
}

.yellow-bg {
    background-color: #FFE800;
}

.btn-main.yellow-bg {
    background-color: #FFE800;
    color: #004A99;
}
.btn-main.yellow-bg:hover {
	opacity: 0.7;
}
.btn-main.blue-bg {
    background-color: #004A99;
    color: #ededed;

}

.btn-main.white-bg {
    background-color: #ededed;
    color: #004A99;
}


.cyan {
    color: #1BA0CC;
}

.btn-main {
    display: block;
    padding: 14px 20px;
    font-size: 16px;
    font-weight: 400;
    text-decoration: none;
    border-radius: 5px;
    transition: all 0.3s ease;
    text-align: center;
}

/* :root {
    --blue: #004A99;
    --yellow: #FFE800;
    --white: #ededed;
    --cyan: #1BA0CC;
    
} */


/* ═══════════════════════════════════════════════════════════════
   Products Mega-Dropdown
   ─────────────────────────────────────────────────────────────
   Usage:
     1. Add CSS class "menu-products-dropdown" to the parent
        "Products" menu item in Appearance → Menus.
     2. Add CSS class "menu-cta-top" to the first child
        (e.g. "Use our product finder →").
     3. Add CSS class "menu-cta-bottom" to the last child
        (e.g. "View all products →").
   ═══════════════════════════════════════════════════════════════ */

/* All rules scoped to .header .header-right nav so the mobile menu is unaffected */

/* --- Override the default dark sub-menu for this dropdown --- */
.header .header-right nav>ul>li.menu-products-dropdown>.sub-menu {
    background-color: #ffffff;
    width: auto !important;
    padding: 25px 30px;
    border-radius: 10px;
    /*     border-top: 3px solid var(--blue, #004A99); */
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.10),
        0 2px 10px rgba(0, 0, 0, 0.06);
}

/* --- Two-column column-flow layout (fills top-to-bottom per column) --- */
.header .header-right nav .menu-products-dropdown>.sub-menu {
    display: block !important;
    column-count: 2;
    column-gap: 20px;
}

/* --- All sub-menu item base style --- */
.header .header-right nav .menu-products-dropdown>.sub-menu>li {
    display: block !important;
    width: auto !important;
    padding: 0 !important;
    break-inside: avoid;
}

.header .header-right nav .menu-products-dropdown>.sub-menu>li>a {
    color: var(--grey);
    font-size: 16px !important;
    font-weight: 400 !important;
    padding: 15px 20px 0 0 !important;
    display: block !important;
    transition: color 0.2s ease !important;
}

.header .header-right nav .menu-products-dropdown>.sub-menu>li>a:hover {
    color: var(--blue, #004A99) !important;
    opacity: 1 !important;
}

/* --- Top CTA: "Use our product finder →" --- */
.header .header-right nav .menu-products-dropdown>.sub-menu>li.menu-cta-top {
    column-span: all;
    padding-bottom: 5px !important;
/*     margin-bottom: 8px; */

}

.header .header-right nav .menu-products-dropdown>.sub-menu>li.menu-cta-top>a {
    color: var(--blue, #004A99) !important;
    font-weight: 500 !important;
    font-size: 16px !important;
    white-space: nowrap;
    display: flex !important;
    align-items: center !important;
	padding-top: 0px !important;
}

.header .header-right nav .menu-products-dropdown>.sub-menu>li.menu-cta-top>a:hover {
	color: var(--grey) !important;
}

.header .header-right nav .menu-products-dropdown>.sub-menu>li.menu-cta-top>a::after {
    content: ' →' !important;
    display: inline !important;
    position: static !important;
    background: none !important;
    width: auto !important;
    height: 12px !important;
    font-size: inherit;
    margin-left: 10px;
}

/* --- Bottom CTA: "View all products →" --- */
.header .header-right nav .menu-products-dropdown>.sub-menu>li.menu-cta-bottom {
    column-span: all;
    padding-top: 10px !important;
    margin-top: 8px;

}

.header .header-right nav .menu-products-dropdown>.sub-menu>li.menu-cta-bottom>a {
    color: var(--blue, #004A99) !important;
    font-weight: 500 !important;
    font-size: 16px !important;
    white-space: nowrap;
    display: flex !important;
    align-items: center !important;
	padding-top: 0px !important;
}

.header .header-right nav .menu-products-dropdown>.sub-menu>li.menu-cta-bottom>a:hover {
	color: var(--grey) !important;
}
.header .header-right nav .menu-products-dropdown>.sub-menu>li.menu-cta-bottom>a::after {
    content: ' →' !important;
    display: inline !important;
    position: static !important;
    background: none !important;
    width: auto !important;
    height: 12px !important;
    font-size: inherit;
    margin-left: 10px;
}

/* --- Arrow pointer at top of dropdown --- */
.header .header-right nav .menu-products-dropdown>ul.sub-menu::after {
    border-color: transparent transparent #ffffff transparent !important;
    top: -13px !important;
}

/* --- Ensure no ::after underline on product items --- */
.header .header-right nav .menu-products-dropdown>.sub-menu>li>a::after {
    display: none;
}

/* ============================================
   SDS CARDS (Resources Hub)
   Language select and Download button mirror the
   product Downloads section styling.
   ============================================ */

.resources-hub .sds-language-picker {
    margin-top: auto;
    padding-top: 14px;
}

.resources-hub .download-language-select {
    position: relative;
    margin-bottom: 20px;
}

.resources-hub .download-language-select select {
    width: 100%;
    padding: 10px 0px 10px 0px;
    border: none;
    background: transparent;
    font-size: 16px;
    font-weight: 400;
    color: var(--grey);
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    outline: none;
    border-radius: 0;
    font-family: inherit;
}

.resources-hub .download-language-select select:focus {
    border-bottom-color: #004A99;
    color: #333;
}

.resources-hub .download-language-select select.needs-selection {
    color: #e74c3c;
}

.resources-hub .download-language-select i {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: #6B7280;
    pointer-events: none;
}

.resources-hub .download-action {
    margin-top: auto;
}

.resources-hub .download-btn {
    display: block;
    max-width: 180px;
    padding: 12px 20px;
    font-size: 16px;
    font-weight: 400;
    color: #000;
    background: transparent;
    border: 1px solid var(--blue);
    border-radius: 5px;
    text-align: center;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    font-family: inherit;
}

.resources-hub .download-btn:hover {
    border-color: #004A99;
    color: #004A99;
}

.resources-hub .download-btn.disabled {
    opacity: 0.5;
    pointer-events: none;
}

/* Flat placeholder colour for SDS cards, replacing the teal gradient */
.resources-hub .resource-card[data-type="sds"] .resource-icon-placeholder {
    background: #CCFBF1;
}

.resources-hub .resource-card[data-type="sds"] .resource-icon-placeholder i {
    color: #0F766E;
}

/* ============================================
   RESOURCES SEARCH (Resources Hub toolbar)
   Matches the sort control beside it.
   ============================================ */

.resources-toolbar .toolbar-controls {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.resources-toolbar .search-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.resources-toolbar .search-wrapper .search-icon {
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    color: #333;
    pointer-events: none;
    z-index: 1;
}

.resources-toolbar .search-wrapper input[type="search"] {
    width: 260px;
    padding: 12px 38px 12px 44px;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    font-size: 16px;
    font-weight: 400;
    font-family: inherit;
    color: var(--black);
    background: transparent;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    line-height: 1.4;
}

.resources-toolbar .search-wrapper input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
}

.resources-toolbar .search-wrapper input[type="search"]::placeholder {
    color: #888;
}

.resources-toolbar .search-wrapper input[type="search"]:hover {
    border-color: #ccc;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.resources-toolbar .search-wrapper input[type="search"]:focus {
    border-color: var(--blue);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.resources-toolbar .search-wrapper .search-clear {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: #888;
    font-size: 14px;
    cursor: pointer;
    transition: color 0.2s ease, background 0.2s ease;
}

.resources-toolbar .search-wrapper .search-clear:hover {
    color: #333;
    background: #f0f0f0;
}

.resources-toolbar .search-wrapper .search-clear[hidden] {
    display: none;
}

/* Spinner while the request is in flight */
.resources-toolbar .search-wrapper.is-searching .search-icon {
    border: 2px solid #d8dfe7;
    border-top-color: var(--blue);
    border-radius: 50%;
    width: 15px;
    height: 15px;
    animation: resources-search-spin 0.7s linear infinite;
}

.resources-toolbar .search-wrapper.is-searching .search-icon::before {
    content: "";
}

@keyframes resources-search-spin {
    to {
        transform: translateY(-50%) rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .resources-toolbar .search-wrapper.is-searching .search-icon {
        animation-duration: 2s;
    }
}

@media (max-width: 900px) {
    .resources-toolbar {
        flex-wrap: wrap;
        gap: 12px;
    }

    .resources-toolbar .toolbar-controls {
        width: 100%;
        flex-wrap: wrap;
    }

    .resources-toolbar .search-wrapper {
/*         flex: 1 1 100%; */
    }

    .resources-toolbar .search-wrapper input[type="search"] {
        width: 100%;
    }
}


/* Sliders holding fewer items than the visible slot count are not initialised
   as sliders at all (see initSlider in js/scripts.js) - they render as a plain
   static row here, so no clones and no slick width measurement. */
.slider .heading-right .arrows.arrows-hidden {
    display: none;
}

.slider .slider-items.slider-static {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

.slider .slider-items.slider-static > .item {
    flex: 0 1 calc(33.333% - 20px);
    /* No slick means no .slick-active, which is what normally undoes the
       inactive-slide dimming on .slider .item - so undo it here. */
    opacity: 1;
}

.slider.wide .slider-items.slider-static > .item {
    flex: 0 1 calc(50% - 15px);
}

/* Industry cards put the product image in a fixed ~230px column, so they need
   a floor on the card width or the text side collapses. */
.slider.industry-slider .slider-items.slider-static > .item.industry-item {
    min-width: 460px;
    opacity: 1;
}

@media (max-width: 1100px) {
    .slider .slider-items.slider-static > .item {
        flex: 0 1 calc(50% - 15px);
    }
}

@media (max-width: 900px) {
    .slider .slider-items.slider-static > .item,
    .slider.industry-slider .slider-items.slider-static > .item.industry-item {
        flex: 1 1 100%;
        min-width: 0;
    }
}


/* Diagnostic code appended to AJAX failure messages (product finder + distributors).
   Lets a support screenshot identify the cause without opening DevTools. */
.error-code {
    display: inline-block;
    margin-left: 4px;
    padding: 1px 6px;
    border-radius: 3px;
    background: #f2f4f7;
    color: #a33333;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.9em;
}


/* ==========================================================================
   CONTACT FORM 7 - VALIDATION & CONFIRMATION STATES
   --------------------------------------------------------------------------
   The enquiry form appears on 32 pages in three background variants: the
   default section (white container on #FAFBFB), .white-bg, and .contact-hero
   on /contact/ where the form sits directly on the #004A99 gradient. These
   rules have to read on all three, so every panel paints its own solid
   background instead of relying on whatever is behind it.

   What this fixes:

   1. Duplicate "Please fill out this field." messages. Contact Form 7 6.1.7
      adds a tip with appendChild() and no de-dupe check, but clears it with
      querySelector().remove(), which only removes the first one. Fill a field,
      clear it, then submit and text/select fields end up with two identical
      tips. Patching the plugin would be lost on its next update, so the extra
      tips are hidden here - one message per field, however many CF7 injects.

   2. Invalid fields kept their normal #D8E1EE border, so nothing marked the
      field itself as the problem - only the text underneath it.

   3. Tip text was #dc3545 sitting on the dark blue hero panel, which is close
      to unreadable.

   4. The response output was black text on a transparent background with a
      yellow border, and the confirmation was the unstyled CF7 green.
   ========================================================================== */

/* 1. One validation message per field. */
.wpcf7-not-valid-tip ~ .wpcf7-not-valid-tip {
    display: none !important;
}

/* 2. Mark the invalid field itself, not just the text below it.
      The selector mirrors the theme's own input rule above and appends
      .wpcf7-not-valid, because that rule uses input[type="text"] and would
      otherwise out-rank a plain class selector and win on border shorthand. */
.contact-form-section .wpcf7-form input[type="text"].wpcf7-not-valid,
.contact-form-section .wpcf7-form input[type="email"].wpcf7-not-valid,
.contact-form-section .wpcf7-form input[type="tel"].wpcf7-not-valid,
.contact-form-section .wpcf7-form select.wpcf7-not-valid,
.contact-form-section .wpcf7-form textarea.wpcf7-not-valid {
    border-color: #B3261E;
    box-shadow: 0 0 0 3px rgba(179, 38, 30, 0.12);
}

.contact-form-section .wpcf7-form input[type="text"].wpcf7-not-valid:focus,
.contact-form-section .wpcf7-form input[type="email"].wpcf7-not-valid:focus,
.contact-form-section .wpcf7-form input[type="tel"].wpcf7-not-valid:focus,
.contact-form-section .wpcf7-form select.wpcf7-not-valid:focus,
.contact-form-section .wpcf7-form textarea.wpcf7-not-valid:focus {
    outline: 2px solid #B3261E;
    outline-offset: 1px;
}

/* 3. Validation tip - dark red on the light containers... */
.contact-form-section .wpcf7-not-valid-tip {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.35;
    font-weight: 500;
    color: #B3261E;
}

/* ...and a light red where the form sits on the blue gradient. */
.contact-form-section.contact-hero .wpcf7-not-valid-tip {
    color: #FFB3AC;
}

/* 4. Response output. Solid panel, full width of the form, so it reads the
      same on the white containers and on the blue hero. */
.wpcf7 form .wpcf7-response-output {
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin: 24px 0 0;
    padding: 14px 18px;
    border: 1px solid transparent;
    border-left-width: 4px;
    border-radius: 5px;
    font-size: 15px;
    line-height: 1.45;
    text-align: left;
}

/* Something in the form needs attention. */
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
    background-color: #FDECEA;
    border-color: #B3261E;
    color: #8C1D18;
}

/* Sent. Brand palette rather than the Contact Form 7 default green. */
.wpcf7 form.sent .wpcf7-response-output {
    background-color: #EAF4FB;
    border-color: var(--cyan);
    color: var(--blue);
    font-weight: 500;
}

.wpcf7 form.sent .wpcf7-response-output::before {
    content: '\2713';
    display: inline-block;
    margin-right: 8px;
    font-weight: 700;
    color: var(--cyan);
}

/* Delivery failed, or caught as spam. */
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output {
    background-color: #FFF4E5;
    border-color: #B26A00;
    color: #7A4A00;
}

/* The footer newsletter form sits on the same blue gradient and has the same
   validation styling problem, so give it the light red tip and keep its
   response panel in step with the narrower layout. */
.newsletter .wpcf7-not-valid-tip {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.35;
    font-weight: 500;
    color: #FFB3AC;
}

.newsletter .wpcf7-form .wpcf7-not-valid {
    border-color: #FFB3AC;
    box-shadow: 0 0 0 3px rgba(255, 179, 172, 0.25);
}

.newsletter .wpcf7 form .wpcf7-response-output {
    margin-top: 16px;
}


/* CLS: reserve space for the fixed header before JavaScript runs */
body {
    padding-top: 141px;
}

@media (min-width: 901px) and (max-width: 1199px) {
    body { padding-top: 138px; }
}

@media (min-width: 621px) and (max-width: 900px) {
    body { padding-top: 158px; }
}

@media (min-width: 601px) and (max-width: 620px) {
    body { padding-top: 178px; }
}

@media (max-width: 600px) {
    body { padding-top: 84px; }
}