/*
 * site.css — Maestrotek CMS frontend + admin styles
 *
 * Table of contents
 * 1. Design tokens
 * 2. Base & global
 * 3. Layout (header, footer, navigation)
 * 4. Shared components (heroes, section typography, UI patterns)
 * 5. Pages
 *    5.0 Home
 *    5.1 Product catalog
 *    5.2 Product detail
 *    5.3 Company
 *    5.4 Solutions (landing + single category)
 *    5.5 Contact
 *    5.6 E-waste
 *    5.7 News & Events
 *    5.8 Careers
 *    5.9 Search results
 * 6. Admin
 * 7. Responsive (laptop → tablet landscape → tablet portrait → mobile)
 *    — breakpoint rules grouped by tier; page-level pass planned
 */

/* ==========================================================================
   1. Design tokens
   ========================================================================== */
:root {
    --green: #78c620;
    --blue: #1764ab;
    --navy: #002d4f;
    --ink: #161719;
    --muted: #5f6871;
    --surface: #edf2f5;
    --font-sans: 'Open Sans', sans-serif;
    --font-display: 'Space Grotesk', sans-serif;
    --page-hero-overlay-gradient: linear-gradient(90deg, rgba(2, 24, 45, .88), rgba(2, 42, 78, .05));
    --site-header-offset: 104px;
    --site-header-offset-compact: 76px;

    /* Typography scale */
    --text-section-title: 35px;
    --text-section-title-md: 30px;
    --text-section-title-sm: 28px;
    --text-eyebrow-size: 12px;
    --text-eyebrow-tracking: 0.08em;

    /* Section spacing */
    --section-pad: 80px 0;
    --section-pad-tight: 72px 0 88px;

    /* Responsive tiers — see Section 7 */
    --bp-mobile: 575px;           /* phones */
    --bp-tablet-portrait: 767px;  /* tablet portrait */
    --bp-tablet-landscape: 991px; /* tablet landscape */
    --bp-laptop: 1199px;          /* laptop; desktop is default ≥1200px */
}

/* ==========================================================================
   2. Base & global
   ========================================================================== */
html {
    font-family: var(--font-sans);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    color: var(--ink);
    font-family: inherit;
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
}

/* Semantic UI ships with Lato on body, headings, and most .ui.* components */
body :is(
    h1, h2, h3, h4, h5, h6,
    .ui.button,
    .ui.buttons .button,
    .ui.header,
    .ui.menu,
    .ui.menu .item,
    .ui.input,
    .ui.input input,
    .ui.form,
    .ui.form input,
    .ui.form textarea,
    .ui.form select,
    .ui.list,
    .ui.list .item,
    .ui.segment,
    .ui.message,
    .ui.card,
    .ui.dropdown,
    .ui.search,
    .ui.table,
    .ui.steps,
    .ui.steps .step,
    .ui.steps .step .title,
    .ui.checkbox label,
    .ui.radio label,
    .ui.label,
    .ui.modal,
    .ui.popup,
    .ui.accordion,
    .ui.tab,
    .ui.breadcrumb,
    .ui.pagination,
    .ui.items,
    .ui.comment
) {
    font-family: inherit !important;
}

/* Display font for counters and numeric highlights */
.font-display,
.cp-about-counter__stat-number,
.cp-stat-box__number,
.cp-projects__stats-metric strong,
.product-stat-stack strong,
.cp-milestones__year,
.event-detail-page .ne-event-stat strong,
.ne-event-card__days {
    font-family: var(--font-display);
}

/* Preserve Semantic UI icon glyphs */
i.icon,
i.icon::before,
.ui.button > .icon,
.ui.dropdown > .dropdown.icon {
    font-family: Icons !important;
}

/* Brand/social icons use a separate font in Semantic UI */
i.icon.facebook,
i.icon.linkedin,
i.icon.youtube,
i.icon.instagram,
i.icon.twitter,
i.icon.facebook::before,
i.icon.linkedin::before,
i.icon.youtube::before,
i.icon.instagram::before,
i.icon.twitter::before {
    font-family: brand-icons !important;
}

.site-page {
    padding-top: var(--site-header-offset);
    transition: padding-top 0.25s ease;
}

.site-page.site-header-compact {
    padding-top: var(--site-header-offset-compact);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

/* ==========================================================================
   3. Layout — header, footer, breadcrumbs
   ========================================================================== */
.site-header {
    background: #fff;
    box-shadow: 0 5px 18px rgba(31, 45, 61, .08);
    isolation: isolate;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 99999;
}

.site-header.is-compact {
    box-shadow: 0 4px 14px rgba(31, 45, 61, .1);
}

main {
    position: relative;
    z-index: 1;
}

.container {
    box-sizing: border-box;
    max-width: 1315px !important;
    width: min(1315px, 100%) !important;
}

.top-strip {
    background: #f4f7f9;
    font-size: 13px;
    max-height: 28px;
    opacity: 1;
    overflow: hidden;
    transition: max-height 0.25s ease, opacity 0.2s ease, visibility 0.25s ease;
    visibility: visible;
}

.site-header.is-compact .top-strip {
    max-height: 0;
    opacity: 0;
    visibility: hidden;
}

.top-links {
    align-items: center;
    display: flex !important;
    gap: 16px;
    justify-content: flex-end;
    min-height: 28px;
}

.top-links a {
    color: #656c72;
}

.top-links span {
    background: #cfd6dc;
    height: 14px;
    width: 1px;
}

.main-nav {
    align-items: center;
    display: flex !important;
    justify-content: space-between;
    min-height: 76px;
}

.brand img,
.site-footer img,
.login-panel img,
.admin-sidebar img {
    display: block;
    height: auto;
    width: 150px;
}

.main-nav nav {
    align-items: stretch;
    display: flex;
    gap: 28px;
    height: 76px;
}

.main-nav nav a:not(.button) {
    color: #20262b;
    font-size: 15px;
    position: relative;
}

.main-nav nav a.is-current {
    color: #20262b;
    font-weight: 700;
}

.main-nav nav a.is-current::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    background-color: var(--green);
}

.main-nav nav>a {
    display: flex;
    align-items: center;
}

.main-nav-menu {
    justify-content: flex-end !important;
    width: 60%;
}

.main-nav-menu nav {
    justify-content: flex-end !important;
    padding-right: 20px;
}

/* --- Dropdown & Mega Menu Navigation --- */
.nav-item-has-dropdown {
    position: relative;
    display: flex;
    align-items: center;
}

.nav-item-has-dropdown>a {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 100%;
}

.nav-item-has-dropdown>a::after {
    content: "\f107";
    font-family: 'Icons';
    font-size: 12px;
    margin-top: 2px;
}

.dropdown-menu {
    background: #fff;
    border-top: 3px solid var(--green);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    left: 0;
    opacity: 0;
    padding: 10px 0;
    position: absolute;
    top: 100%;
    transform: translateY(10px);
    transition: all 0.3s ease;
    visibility: hidden;
    width: 280px;
    z-index: 100;
}

.nav-item-has-dropdown:hover .dropdown-menu {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
}

/* Mega Menu Styles */
.mega-menu {
    background: #fff;
    border-top: 1px solid #eee;
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
    left: 0;
    opacity: 0;
    position: fixed;
    right: 0;
    top: var(--site-header-offset);
    /* Adjust based on header height */
    transform: translateY(10px);
    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease, top 0.25s ease;
    visibility: hidden;
    width: 100%;
    z-index: 99;
    padding: 0;
}

.site-page.site-header-compact .mega-menu {
    top: var(--site-header-offset-compact);
}

.nav-item-has-dropdown:hover .mega-menu {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
}

.mega-menu-container {
    display: flex !important;
    min-height: 360px;
    background: #fff;
}

.mega-menu-col {
    padding: 20px 0;
    border-right: 1px solid #eee;
    flex: 1 1 0;
    min-width: 0;
}

.mega-menu-sidebar {
    width: auto;
}

.mega-menu-sub {
    background: #fafafa;
}

.mega-menu-items {
    background: #fff;
}

.mega-menu-details {
    border-right: none;
    background: #fff;
    padding-top: 0px !important;
}

.mega-menu-item>a {
    color: #333;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 15px;
    font-weight: 600;
    padding: 12px 25px;
    transition: all 0.2s;
}

.mega-menu-item:hover>a,
.mega-menu-item.active>a {
    background: var(--green);
    color: #fff !important;
}

.sub-menu-content,
.items-menu-content,
.solution-sub-menu-content {
    display: none;
}

.sub-menu-content.active,
.items-menu-content.active,
.solution-sub-menu-content.active {
    display: block;
}

.mega-menu-solution-sub {
    background: #fafafa;
    padding: 20px 0px;
}

.mega-menu-solution-intro,
.mega-menu-solution-intro-block p {
    color: #65707a;
    font-size: 14px;
    line-height: 1.6;
    margin: 0 0 16px;
}

.mega-menu-solution-intro-block h4 {
    color: var(--navy);
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 8px;
}

.solution-sub-item.active > a,
.solution-sub-item.active {
    color: var(--green);
}

.mega-menu-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 20px;
    padding: 0 25px;
}

.mega-menu-sub-title {
    color: #333;
    display: block;
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px solid #eee;
}

.mega-menu-sub-title:hover {
    color: var(--green) !important;
}

.mega-menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mega-menu-list li {
    margin-bottom: 6px;
}

.mega-menu-list a {
    color: #666 !important;
    font-size: 14px;
    transition: color 0.2s;
}

.mega-menu-list a:hover,
.mega-menu-list a.active {
    color: var(--green) !important;
    text-decoration: underline;
}

.mega-menu-empty-state {
    align-items: center;
    border: 1px dashed #d7dee7;
    color: #64748b;
    display: flex;
    flex-direction: column;
    gap: 6px;
    justify-content: center;
    min-height: 160px;
    margin: 0 25px;
    padding: 18px;
    text-align: center;
    background: #f8fbfd;
    border-radius: 6px;
}

.mega-menu-empty-state strong {
    color: #334155;
    font-size: 14px;
    font-weight: 700;
}

.mega-menu-empty-state span {
    font-size: 13px;
    line-height: 1.5;
}

.mega-menu-series-group {
    margin-bottom: 20px;
}

.series-group-title {
    display: block;
    color: #999;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 8px;
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: 4px;
}

/* Series Badge on Cards */
.catalog-product-card,
.featured-product-grid article {
    position: relative;
}

.product-series-badge, 
.search-recommended-card__badge {
    position: absolute;
    top: 15px;
    left: 10px;
    background: var(--green);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    padding: 0 6px;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    z-index: 5;
}

.search-recommended-card__badge{
    border-radius: 5px !important;
    position:relative !important;
    top: 0 !important;
    left: 0 !important;
    margin-bottom: 10px !important;
    width: fit-content !important;
}

.mega-menu-details-content {
    padding: 25px;
    text-align: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.preview-box.is-empty {
    display: none;
}

.mega-menu:hover .mega-menu-details-content {
    opacity: 1;
}

.mega-menu-featured-image {
    padding: 10px;
    background-color: #fff;
    box-shadow: 0px 5px 10px #0000002b;
    max-height: 220px;
    min-height: 130px;
    margin-bottom: 20px;
    border-radius: 5px;
    object-fit: cover;
    object-position: right bottom;
    width: 100%;
}

.mega-menu-featured-desc {
    color: #666;
    font-size: 14px;
    line-height: 1.5;
    text-align: left;
}

/* Search Box Styles */
.nav-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

.search-box {
    position: relative;
}

.search-box button {
    background: none;
    border: none;
    color: #888;
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

i.icon.search:before {
    background-image: url('../images/search-icon.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    width: 20px !important;
    height: 20px !important;
    display: inline-block;
    content: '';
}

/* --- Mobile navigation (sidebar; visibility in Section 7) --- */
.mobile-nav-toggle,
.mobile-nav-actions,
.mobile-nav-overlay,
.mobile-nav-sidebar {
    display: none;
}

.mobile-nav-toggle {
    align-items: flex-start;
    background: none;
    border: 0;
    cursor: pointer;
    flex-direction: column;
    gap: 5px;
    height: 24px;
    justify-content: center;
    padding: 0;
    width: 28px;
}

.mobile-nav-toggle__bar {
    background: #3d4550;
    border-radius: 2px;
    display: block;
    height: 2px;
    transition: transform .2s ease, opacity .2s ease, width .2s ease;
}

.mobile-nav-toggle__bar:nth-child(1) {
    width: 14px;
}

.mobile-nav-toggle__bar:nth-child(2) {
    width: 22px;
}

.mobile-nav-toggle__bar:nth-child(3) {
    width: 17px;
}

.mobile-nav-actions {
    align-items: center;
    gap: 14px;
}

.mobile-nav-action {
    align-items: center;
    color: #3d4550;
    display: inline-flex;
    height: 36px;
    justify-content: center;
    text-decoration: none;
    width: 36px;
}

.mobile-nav-action .icon {
    font-size: 18px;
    margin: 0 !important;
    opacity: 1;
}

.mobile-nav-overlay {
    background: rgba(15, 23, 42, .45);
    inset: 0;
    position: fixed;
    z-index: 100000;
}

.mobile-nav-sidebar {
    background: #fff;
    box-shadow: 8px 0 32px rgba(15, 23, 42, .12);
    display: flex;
    flex-direction: column;
    height: 100%;
    left: 0;
    max-width: 88vw;
    position: fixed;
    top: 0;
    transform: translateX(-100%);
    transition: transform .28s ease, visibility .28s ease;
    visibility: hidden;
    width: min(430px, 88vw);
    z-index: 100001;
}

.mobile-nav-sidebar__header {
    align-items: center;
    border-bottom: 1px solid #e8edf2;
    display: flex;
    flex-shrink: 0;
    justify-content: space-between;
    min-height: 64px;
    padding: 12px 16px;
    box-shadow: -7px 0px 16px rgba(0, 0, 0, 0.2);
    z-index: 100002;
}

.mobile-nav-sidebar__brand img {
    display: block;
    height: auto;
    width: 120px;
}

.mobile-nav-close {
    align-items: center;
    background: none;
    border: 0;
    color: #3d4550;
    cursor: pointer;
    display: inline-flex;
    height: 36px;
    justify-content: right;
    padding: 0;
    width: 36px;
}

.mobile-nav-close .icon {
    font-size: 18px;
    margin: 0 !important;
}

.mobile-nav-sidebar__panels {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.mobile-nav-panel {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow-y: auto;
}

.mobile-nav-panel:not(.is-active) {
    display: none;
}

.mobile-nav-sidebar__nav {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}

.mobile-nav-group {
    display: flex;
    flex-direction: column;
}

.mobile-nav-row {
    align-items: center;
    background: transparent;
    border: 0;
    color: #20262b;
    cursor: pointer;
    display: flex;
    font-family: inherit;
    font-size: 16px;
    font-weight: 400;
    gap: 12px;
    justify-content: space-between;
    line-height: 1.3;
    min-height: 50px;
    padding: 16px 20px;
    text-align: left;
    text-decoration: none;
    width: 100%;
}

.mobile-nav-row--link {
    cursor: pointer;
}

.mobile-nav-row.is-current,
.mobile-nav-row--toggle.is-current > span:first-child {
    color: var(--green);
}

.mobile-nav-row--back {
    background: #f5f8fa;
    color: #20262b;
    justify-content: flex-start;
}

.mobile-nav-back-label {
    align-items: center;
    display: inline-flex;
    gap: 6px;
}

.mobile-nav-submenu {
    background: #f5f8fa;
    display: flex;
    flex-direction: column;
    padding: 15px 0;
}

.mobile-nav-submenu[hidden] {
    display: none;
}

.mobile-nav-row--depth-1 {
    padding-left: 40px;
}

.mobile-nav-row--depth-2 {
    padding-left: 51px;
}

.mobile-nav-row--depth-3 {
    padding-left: 71px;
}

.mobile-nav-row--depth-4,
.mobile-nav-row--depth-5 {
    padding-left: 97px;
}

.mobile-nav-row--heading {
    color: #20262b;
    background-color: #F5F8FA;
    cursor: default;
    font-size: 16px;
    font-weight: 400;
    min-height: 48px;
    opacity: .5;
    padding-bottom: 8px;
    padding-top: 8px;
}

.mobile-nav-row--all {
    color: #4b5563;
    font-size: 16px;
    font-weight: 600;
}

.mobile-nav-chevron {
    border-right: 2px solid #20262b;
    border-top: 2px solid #20262b;
    flex-shrink: 0;
    height: 9px;
    margin-right: 2px;
    transform: rotate(45deg);
    transition: transform .2s ease;
    width: 9px;
}

.mobile-nav-row--toggle[aria-expanded="true"] .mobile-nav-chevron {
    margin-top: 4px;
    transform: rotate(135deg);
}

.mobile-nav-arrow {
    color: #20262b;
    flex-shrink: 0;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
}

.mobile-nav-sidebar__secondary,
.mobile-nav-sidebar__account {
    border-top: 1px solid #e8edf2;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    margin-top: auto;
    padding: 12px 0 20px;
}

.mobile-nav-sidebar__secondary a,
.mobile-nav-sidebar__account a {
    color: #4b5563;
    font-size: 14px;
    padding: 10px 20px;
    text-decoration: none;
}

.mobile-nav-sidebar__user {
    color: #6b7280;
    font-size: 13px;
    padding: 4px 20px 0;
}

body.mobile-nav-open .mobile-nav-sidebar {
    transform: translateX(0);
    visibility: visible;
}

body.mobile-nav-open .mobile-nav-toggle__bar:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
    width: 22px;
}

body.mobile-nav-open .mobile-nav-toggle__bar:nth-child(2) {
    opacity: 0;
}

body.mobile-nav-open .mobile-nav-toggle__bar:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
    width: 22px;
}

.ui.green.button {
    background: var(--green);
    font-weight: 400 !important;
    padding: 12px 25px !important;
}

/* ==========================================================================
   4. Shared components
   ========================================================================== */

/* --- Page hero banners --- */
.page-hero-overlay,
.cp-hero__overlay {
    background: var(--page-hero-overlay-gradient);
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 1;
}

.products-hero {
    background:
        var(--page-hero-overlay-gradient),
        url('../images/product-catelog-banner.png') center/cover;
    align-items: center;
    box-sizing: border-box;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-height: 500px;
    min-height: 500px;
    padding: 0;
    position: relative;
}

.products-hero > .ui.container {
    width: 100%;
}

.products-hero.has-custom-bg {
    background:
        var(--page-hero-overlay-gradient),
        var(--hero-bg) center/cover;
}

.products-hero span, .hero-label-tag,.single-category-hero span,.solution-single-page .sol-single-hero__label  {
    color: #fff;
    background-color: #294300;
    border-left: 3px solid #7cc51f;
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
    display: inline-block;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0;
    margin-bottom: 14px;
    text-transform: uppercase;
    padding: 5px 20px 5px 10px;
}

.product-category-heading span {
    color: #7cc51f;
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    margin-bottom: 14px;
    text-transform: uppercase;
    padding: 5px 20px 5px 10px;
}

.products-hero h1, 
.search-page-results h1, 
.single-category-hero h1, 
.cp-hero__content h1 {
    color: #fff;
    font-size: 35px;
    line-height: 1.08;
    margin: 0 0 6px;
    max-width: 600px;
    font-weight: 700;
    line-height: 1.2;
}

.products-hero p, 
.search-page-results p, 
.single-category-hero p, 
.cp-hero__content p {
    /* color: rgba(255, 255, 255, .84); */
    font-size: 16px;
    max-width: 610px;
    font-weight: 400;
    line-height: 1.3;
}

/* --- Section typography (company, solutions, marketing pages) --- */
.section-eyebrow,
.cp-capabilities__label,
.cp-verticals__label,
.cp-approach__label,
.cp-milestones__label,
.cp-projects__label,
.cp-leadership__label,
.cp-testimonials__label,
.cp-case-studies__label,
.ne-section__eyebrow {
    color: var(--green);
    display: block;
    font-size: var(--text-eyebrow-size);
    font-weight: 800;
    letter-spacing: var(--text-eyebrow-tracking);
    margin-bottom: 14px;
    text-transform: uppercase;
}

.ne-section__eyebrow {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.06em;
    margin-bottom: 10px;
}

.section-title,
.cp-capabilities h2,
.cp-verticals h2,
.cp-approach h2,
.cp-milestones h2,
.cp-projects h2,
.cp-leadership h2,
.cp-testimonials h2,
.cp-case-studies h2,
.cp-why-us__title,
.cp-cat-showcase__header h2,
.cp-integrated__header h2,
.cp-newsletter h2,
.solutions-ecosystems__header h2,
.solutions-benefits__copy h2,
.solutions-faq__header h2,
.products-intro h2,
.product-category-heading h2,
.product-platform h2,
.ne-section__head h2,
.ewaste-guidelines__header h2,
.solution-single-page .sol-single-overview__copy h2,
.solution-single-page .sol-single-offerings h2,
.solution-single-page .sol-single-highlights h2,
.solution-single-page .sol-single-features__header h2,
.solution-single-page .sol-single-architecture h2,
.solution-single-page .sol-single-components h2,
.solution-single-page .sol-single-applications__header h2 {
    font-size: var(--text-section-title);
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
}

.cp-capabilities h2,
.cp-verticals h2 {
    font-weight: 800;
    line-height: 1.22;
    text-align: left;
}

.products-intro h2,
.product-platform h2 {
    line-height: 1.08;
    margin: 0 0 16px;
}

.product-category-heading h2 {
    margin: 0 auto 16px;
    max-width: 720px;
}

.cp-cat-showcase__header h2 {
    line-height: 1.25;
    max-width: 720px;
}

.cp-integrated__header h2 {
    font-weight: 800;
    margin: 0 0 16px;
}

.cp-newsletter h2 {
    color: #1e293b;
    margin: 0 0 16px;
}

.cp-why-us__title {
    color: var(--navy);
    letter-spacing: 0.5px;
    margin-bottom: 48px;
}

.solutions-ecosystems__header h2 {
    margin: 0 0 12px;
}

.solutions-benefits__copy h2 {
    margin: 0 0 16px;
    text-align: left;
}

.solutions-faq__header h2 {
    font-size: 31px;
    text-align: center;
    margin: 0 0 10px;
}

.ne-section__head h2 {
    color: var(--navy);
    line-height: 1.15;
    margin: 0 0 12px;
}

.ewaste-guidelines__header h2 {
    color: var(--navy);
    font-size: 32px;
    letter-spacing: -0.02em;
    margin: 0 0 12px;
}

.solution-single-page :is(
    .sol-single-overview__copy h2,
    .sol-single-offerings h2,
    .sol-single-highlights h2,
    .sol-single-features__header h2,
    .sol-single-architecture h2,
    .sol-single-components h2,
    .sol-single-applications__header h2
) {
    color: #0f2f52;
    line-height: 1.1;
}

.solution-single-page .sol-single-overview__copy h2,
.solution-single-page .sol-single-offerings h2 {
    margin: 0 0 22px;
}

.solution-single-page .sol-single-features__header h2,
.solution-single-page .sol-single-applications__header h2 {
    margin: 0 0 10px;
}

.solution-single-page .sol-single-highlights h2,
.solution-single-page .sol-single-architecture h2,
.solution-single-page .sol-single-components h2 {
    margin: 0 0 36px;
    text-align: center;
}

.search-section__title {
    color: #030303;
    font-size: var(--text-section-title-md);
    font-weight: 800;
    line-height: 1.2;
    margin: 0 0 18px;
}

.search-section__header .search-section__title {
    margin-bottom: 0;
}

/* --- Section spacing --- */
.section-pad,
.cp-cat-showcase,
.cp-testimonials,
.cp-why-us,
.cp-case-studies,
.cp-newsletter,
.cp-about,
.cp-about,
.solutions-ecosystems,
.solution-single-page .sol-single-overview,
.solution-single-page .sol-single-offerings,
.solution-single-page .sol-single-highlights,
.solution-single-page .sol-single-features,
.solution-single-page .sol-single-architecture,
.solution-single-page .sol-single-components,
.solution-single-page .sol-single-applications {
    padding: var(--section-pad);
}

.section-pad--tight,
.cp-capabilities,
.cp-verticals,
.cp-integrated,
.cp-approach,
.cp-milestones,
.cp-leadership {
    padding: var(--section-pad-tight);
}

.products-intro {
    background-color: #f8fbfd;
    background-image: radial-gradient(#c2ccd4 1px, transparent 1px);
    background-size: 32px 32px;
    padding: 64px 0;
}

.products-intro-grid {
    align-items: center;
    display: grid !important;
    gap: 90px;
    grid-template-columns: 1.4fr .8fr;
}

.products-intro-grid > *,
.product-category-content > * {
    min-width: 0;
}

.products-intro p {
    color: #65707a;
    max-width: 660px;
}

.product-stat-stack {
    display: grid;
    gap: 14px;
}

.product-stat-stack div {
    background: #fff;
    border-left: 6px solid #7cc51f;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(15, 23, 42, .12);
    padding: 18px 22px;
}

.product-stat-stack strong,
.product-stat-stack span {
    display: block;
}

.product-stat-stack strong {
    font-size: 23px;
}

.product-stat-stack span {
    color: #59636d;
    font-size: 13px;
}

.product-category-heading {
    background: #fff;
    padding: 56px 0;
    text-align: center;
}

.product-category-row {
    background: #eef3f6;
    padding: 62px 0;
}

.product-category-row:nth-child(even) {
    background: #fff;
}

.product-category-row .container {
    max-width: 1000px !important;
}

.product-category-title {
    margin-bottom: 26px;
}

.product-category-title h3 {
    font-size: 22px;
    margin: 0 0 4px;
}

.product-category-title h3 a {
    color: inherit;
    text-decoration: none;
}

.product-category-title h3 a:hover {
    color: var(--green);
}

.product-category-title p {
    color: #65707a;
    margin: 0;
}

.product-category-content {
    align-items: flex-start;
    display: grid;
    gap: 44px;
    grid-template-columns: 1.15fr .85fr;
}

.product-category-row.is-reversed .product-category-content {
    grid-template-columns: .85fr 1.15fr;
}

.product-category-row.is-reversed .product-category-image {
    order: 2;
}

.product-category-image {
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 2px 12px rgba(15, 23, 42, .11);
    padding: 14px;
}

.product-category-image img {
    border-radius: 3px;
    display: block;
    height: 255px;
    object-fit: cover;
    width: 100%;
    object-position: right bottom;
}

.product-category-copy h4 {
    color: #72b91c;
    font-size: 22px;
    line-height: 1.08;
    margin: 0 0 10px;
}

.product-category-copy p {
    color: #4b545c;
    font-weight: 600;
    line-height: 1.35;
}

.product-category-copy ul {
    list-style: none;
    margin: 14px 0 20px;
    padding: 0;
}

.product-category-copy li {
    color: #23303a;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 7px;
}

.product-category-copy li::before {
    color: #72b91c;
    content: '✓';
    margin-right: 6px;
}

.product-category-copy a {
    border-bottom: 3px solid #73bd19;
    color: #23303a;
    font-size: 13px;
    font-weight: 800;
}

.product-platform {
    background: #eef3f6;
    padding: 90px 0;
    text-align: center;
}

.product-platform p {
    margin-left: auto;
    margin-right: auto;
    max-width: 620px;
}

.platform-flow {
    display: grid;
    gap: 44px;
    grid-template-columns: repeat(5, 1fr);
    margin: 54px auto;
    max-width: 840px;
}

.platform-flow span {
    background: #EAEDEF;
    border-radius: 6px;
    color: #7b858f;
    font-size: 12px;
    font-weight: 800;
    padding: 22px 22px;
    text-transform: uppercase;
}

.mini-card i {
    align-items: center;
    display: flex;
    height: 50px;
    justify-content: center;
    width: 100%;
}

.platform-note {
    background: #002d4f;
    border-radius: 10px;
    color: #fff;
    margin: 0 auto;
    max-width: 840px;
    padding: 34px;
}

.platform-note-header {
    display: flex;
    justify-content: center;
    gap: 10px;
}
.platform-note-header i{
    color: var(--green);
}

.platform-note strong {
    color: #7cc51f;
    display: block;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.platform-note p {
    color: rgba(255, 255, 255, .82);
    margin-bottom: 0;
}

.product-cta {
    background: #7cc51f;
    color: #fff;
    padding: 70px 20px;
    text-align: center;
}

.product-cta h2 {
    color: #fff;
    font-size: 36px;
    line-height: 1.05;
    margin: 0 0 12px;
}

.product-cta p {
    margin: 0 auto 24px;
    max-width: 560px;
}

.single-category-hero {
    background:
        var(--page-hero-overlay-gradient),
        var(--single-hero) center/cover;
    color: #fff;
    min-height: 500px;
    align-items: center;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.site-breadcrumb-band,
.detail-breadcrumb-band {
    background: #EFF3F5;
    padding: 15px 0;
}

.site-breadcrumb-band .ui.breadcrumb,
.detail-breadcrumb-band .ui.breadcrumb {
    /* align-items: center; */
    display: flex;
    flex-wrap: wrap;
    column-gap: 0.35rem;
    row-gap: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
    line-height: 1.5;
    margin: 0;
    text-transform: uppercase;
}

.site-breadcrumb-band .ui.breadcrumb a.section,
.detail-breadcrumb-band .ui.breadcrumb a.section {
    color: #64748b;
    font-weight: 700;
    max-width: 100%;
}

.site-breadcrumb-band .ui.breadcrumb a.section:hover,
.detail-breadcrumb-band .ui.breadcrumb a.section:hover {
    color: #0f2f52;
}

.site-breadcrumb-band .ui.breadcrumb .active.section,
.detail-breadcrumb-band .ui.breadcrumb .active.section {
    color: #0f2f52;
    font-weight: 700;
    max-width: 100%;
}

.site-breadcrumb-band .ui.breadcrumb .divider,
.detail-breadcrumb-band .ui.breadcrumb .divider {
    color: #94a3b8;
    flex-shrink: 0;
    margin: 0;
    opacity: 1;
}

.single-featured>.container>span {
    color: #fff;
    display: inline-block;
    font-size: 12px;
    font-weight: 800;
    margin-bottom: 14px;
    padding: 5px 25px 5px 15px;
    text-transform: uppercase;
}

.single-intro {
    background-color: #f8fbfd;
    background-image: radial-gradient(#c2ccd4 1px, transparent 1px);
    background-size: 32px 32px;
    padding: 72px 0;
    text-align: center;
}

.single-intro h2,
.single-featured h2,
.single-ecosystem h2,
.related-solutions h2 {
    font-size: 36px;
    text-align: center;
    line-height: 1.08;
    margin: 0 auto 18px;
    max-width: 760px;
}

.single-intro p,
.single-ecosystem p {
    color: #68727c;
    font-size: 16px;
    line-height: 1.36;
    margin: 0 auto;
    max-width: 720px;
}

.single-capabilities {
    background: #fff;
    padding: 72px 0;
}

.capability-grid {
    display: grid !important;
    gap: 18px;
    grid-template-columns: repeat(4, 1fr);
    max-width: 1060px !important;
}

.capability-grid article {
    background: #f3f7f9;
    border-radius: 6px;
    min-width: 0;
    padding: 24px;
}

.capability-grid i.icon {
    color: #1764ab;
    font-size: 24px;
    margin-bottom: 14px;
}

.capability-grid h3 {
    color: #1764ab;
    font-size: 17px;
    margin: 0 0 10px;
}

.capability-grid p {
    color: #52606b;
    line-height: 1.34;
    margin: 0;
}

.single-featured {
    background: #eef3f6;
    padding: 90px 0;
    text-align: center;
}

.single-featured>.container>span {
    background: transparent;
    color: #73bd19;
    padding: 0;
}

.featured-product-grid {
    display: grid;
    gap: 30px;
    grid-template-columns: repeat(3, 1fr);
    margin: 60px auto;
    max-width: 920px;
    text-align: left;
}

.featured-product-grid article {
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 3px 12px rgba(15, 23, 42, .13);
    padding: 20px;
    position: relative;
    min-width: 0;
}

.featured-product-grid article>span {
    background: #73bd19;
    color: #fff;
    display: inline-block;
    font-size: 10px;
    font-weight: 800;
    left: 20px;
    padding: 4px 8px;
    position: absolute;
    top: 18px;
}

.product-device {
    border: 1px solid #eaeaea;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    min-height: 200px;
    padding: 12px;
}

.product-device img {
    border-radius: 5px;
    height: 100%;
    object-fit: cover;
}

.product-device-similar {
    border: 1px solid #eaeaea;
    border-radius: 5px;
    display: flex;
    align-items: center;
    height: 165px;
    justify-content: center;
    margin-bottom: 24px;
    width: 100%;
}

.product-device-similar img {
    border-radius: 5px;
    height: 100%;
    object-fit: cover;
}

.featured-product-grid h3 {
    font-size: 17px;
    margin: 0 0 12px;
}

.featured-product-grid ul {
    color: #4e5963;
    list-style: disc;
    margin: 0 0 20px 18px;
    padding: 0;
}

.featured-product-grid ul li {
    max-width: 100%;
}

.featured-product-grid ul li span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.view-products {
    margin: 0 auto !important;
}

.single-ecosystem {
    background: #fff;
    padding: 94px 0;
    text-align: center;
}

.related-solutions {
    background: #eef3f6;
    padding: 90px 0;
}

.related-solution-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(3, 1fr);
    margin: 42px auto 0;
    max-width: 920px;
}

.related-solution-grid article {
    background: #fff;
    border-radius: 7px;
    box-shadow: 0 3px 12px rgba(15, 23, 42, .14);
    padding: 34px;

    display: flex;
    flex-direction: column;
}

.related-solution-grid a {
    border-bottom: 3px solid #73bd19;
    color: #1764ab;
    font-size: 13px;
    font-weight: 800;

    margin-top: auto;
    align-self: flex-start;
    /* optional */
}

.related-solution-grid h3 {
    color: #1764ab;
    font-size: 19px;
}

.related-solution-grid p {
    color: #68727c;
    min-height: 58px;
}

.footer-inner {
    align-items: center;
    display: grid !important;
    gap: 28px;
    grid-template-columns: 1fr auto auto 1fr;
}

.footer-inner a,
.footer-inner span {
    color: #30343a;
    font-size: 13px;
}

.footer-inner span {
    justify-self: end;
}

.site-footer--extended {
    background: #050505;
    color: #f3f4f6;
    padding: 64px 0 22px;
    position: relative;
}

.site-footer--extended .footer-extended.ui.container {
    display: grid;
    gap: 44px;
    grid-template-columns: 1.3fr 0.75fr 0.95fr 1fr;
    align-items: start;
    width: 100%;
}

.footer-brand img {
    display: block;
    height: auto;
    margin-bottom: 26px;
    max-width: 220px;
    width: 100%;
}

.footer-brand p {
    color: rgba(255, 255, 255, 0.9);
    font-size: 16px;
    line-height: 1.55;
    margin: 0 0 26px;
    max-width: 320px;
}

.footer-social {
    display: flex;
    gap: 10px;
}

.footer-social a {
    align-items: center;
    background: rgba(255, 255, 255, 0.25);
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    height: 34px;
    justify-content: center;
    width: 34px;
}

.footer-social a .icon {
    font-size: 16px;
    height: auto;
    line-height: 1;
    margin: 0;
    opacity: 1;
    width: auto;
}

.footer-social a .icon::before {
    font-family: brand-icons !important;
}

.footer-social a:hover {
    background: var(--green);
    color: #fff;
}

.footer-links h4,
.footer-contact h4 {
    color: var(--green);
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 22px;
}

.footer-links a,
.footer-contact a,
.footer-contact p {
    color: rgba(255, 255, 255, 0.92);
    display: block;
    font-size: 15px;
    line-height: 1.7;
    margin: 0 0 6px;
}

.footer-links a:hover,
.footer-contact a:hover {
    color: var(--green);
}

.footer-subhead {
    margin-top: 28px !important;
}

.footer-extended-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    margin-top: 46px;
    padding-top: 18px;
}

.footer-extended-bottom span {
    color: rgba(255, 255, 255, 0.55);
    display: block;
    font-size: 13px;
}

.back-to-top {
    align-items: center;
    background: var(--green);
    border: 0;
    bottom: 26px;
    border-radius: 5px;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.24);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    height: 42px;
    justify-content: center;
    opacity: 0;
    position: fixed;
    right: 26px;
    transition: opacity 0.2s ease, transform 0.2s ease, background 0.2s ease;
    transform: translateY(8px);
    width: 42px;
    z-index: 9999;
}

.back-to-top.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.back-to-top:hover {
    background: #65a31a;
    color: #fff;
}

.back-to-top i.icon {
    margin: 0px;
}

/* ==========================================================================
   5. Pages
   ========================================================================== */

/* --- 5.0 Home --- */

/* Hero */
.hero {
    background-color: #f8fbfd;
    background-image: radial-gradient(#b8c5d0 1px, transparent 1px);
    background-size: 36px 36px;
    min-height: 400px;
    padding: 70px 0;
}

.hero .container {
    max-width: 1160px !important;
}

.hero-badge {
    background: var(--green);
    border-left: 4px solid #4f850c;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    color: #fff;
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0;
    padding: 9px 22px;
    text-transform: uppercase;
}

.hero h1 {
    font-size: 40px;
    line-height: .99;
    margin: 24px 0 26px;
    max-width: 790px;
}

.hero h1 span {
    background: linear-gradient(
        90deg,
        #2C7AC9,
        #4EA8FF,
        #013e7b,
        #2C7AC9
    );
    background-size: 300% 100%;

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;

    animation: gradientFlow 6s linear infinite;
}

@keyframes gradientFlow {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 300% 50%;
    }
}
.hero p {
    color: #5f6267;
    font-size: 20px;
    line-height: 1.2;
    max-width: 980px;
}

/* Solutions & Products cards */
.sp-section {
    background: #f8fbfd;
    overflow-x: hidden;
    padding: 0 0 80px 0;
    position: relative;
    width: 100%;
    z-index: 1;
}

.sp-wrapper {
    margin: 0 auto;
    width: 100%;
}

.sp-cards {
    align-items: center;
    display: flex;
    gap: 0;
    width: 100%;
}

.sp-card {
    color: #fff;
    cursor: pointer;
    display: block;
    flex: 0 0 48.4%;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    transition:
        height .7s cubic-bezier(.25, .46, .45, .94),
        box-shadow .7s cubic-bezier(.25, .46, .45, .94),
        transform .7s cubic-bezier(.25, .46, .45, .94);
    width: 50%;
}

.sp-card:hover {
    color: #fff;
    text-decoration: none;
}

.sp-card__bg {
    background-image: var(--card-bg);
    background-position: center;
    background-size: cover;
    inset: 0;
    position: absolute;
    transition: transform .7s cubic-bezier(.25, .46, .45, .94);
    z-index: 1;
}

.sp-card:hover .sp-card__bg {
    transform: scale(1.05);
}

.sp-card__overlay {
    inset: 0;
    position: absolute;
    transition: opacity .7s ease;
    z-index: 2;
}

.sp-card--solutions {
    box-shadow:
        0 30px 60px rgba(0, 16, 34, .35),
        0 10px 25px rgba(3, 50, 96, .25);
    height: 450px;
    z-index: 2;
}

.sp-card--products {
    height: 400px;
    margin-left: -70px;
    z-index: 1;
}

.sp-bridge {
    background: linear-gradient(90deg, #033260 -30%, #001022 30%);
    clip-path: polygon(-1px 0, 42% 25px, 42% 94.5%, -1px 100%);
    height: 450px;
    pointer-events: none;
    position: relative;
    transition:
        clip-path .7s cubic-bezier(.25, .46, .45, .94),
        height .7s cubic-bezier(.25, .46, .45, .94);
    width: 120px;
    z-index: 10;
}

.sp-cards:hover .sp-bridge {
    background: linear-gradient(90deg, #001022 0%, #033260 100%);
    clip-path: polygon(-1px 25px, 42% 0, 42% 100%, -1px 94.5%);
    height: 450px;
}

.sp-cards .sp-card--solutions:hover~.sp-bridge {
    background: linear-gradient(90deg, #033260 -30%, #001022 30%);
    clip-path: polygon(-1px 0, 42% 25px, 42% 94.5%, -1px 100%);
    height: 450px;
}

.sp-card--solutions .sp-card__overlay {
    background:
        linear-gradient(90deg, rgba(2, 24, 45, .88), rgba(2, 42, 78, .7));
}

.sp-card--products .sp-card__overlay {
    background:
        linear-gradient(90deg, rgba(2, 24, 45, .88), rgba(2, 42, 78, .7));
}

.sp-cards:hover .sp-card--solutions {
    box-shadow: none;
    height: 400px;
}

.sp-cards:hover .sp-card--products {
    box-shadow:
        0 30px 60px rgba(0, 16, 34, .35),
        0 10px 25px rgba(3, 50, 96, .25);
    height: 450px;
}

.sp-cards .sp-card--solutions:hover {
    box-shadow:
        0 30px 60px rgba(0, 16, 34, .35),
        0 10px 25px rgba(3, 50, 96, .25);
    height: 450px;
}

.sp-cards .sp-card--solutions:hover~.sp-card--products {
    box-shadow: none;
    height: 400px;
}

.sp-card__content {
    color: #fff;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: flex-end;
    padding: 44px;
    position: relative;
    transition:
        transform .65s cubic-bezier(.22, 1, .36, 1),
        padding .65s cubic-bezier(.22, 1, .36, 1);
    z-index: 3;
}

.sp-card--solutions .sp-card__content {
    margin-left: 30%;
}

.sp-card__tag {
    color: #a2e839;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    transition: opacity .5s ease, transform .5s ease;
}

.sp-card__title {
    color: #fff;
    font-size: 40px;
    line-height: 1.1;
    margin: 0;
    transform-origin: left bottom;
    transition:
        transform .55s cubic-bezier(.22, 1, .36, 1),
        opacity .4s ease;
    text-transform: uppercase;
}

.sp-card__subtitle {
    color: rgba(255, 255, 255, .72);
    font-size: 20px;
    font-weight: 500;
    margin: 0 0 14px;
    transition: opacity .5s ease, transform .5s ease;
}

.sp-card__desc {
    color: rgba(255, 255, 255, .58);
    font-size: 15px;
    line-height: 1.65;
    margin: 0 0 24px;
    max-width: 400px;
    overflow: hidden;
    transition:
        opacity .45s ease,
        transform .55s cubic-bezier(.22, 1, .36, 1),
        max-height .55s cubic-bezier(.22, 1, .36, 1);
}

.sp-card__btn {
    align-items: center;
    background: #7ab929;
    border: 0;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: .8rem;
    font-weight: 700;
    gap: 8px;
    letter-spacing: .5px;
    padding: 12px 28px;
    text-decoration: none;
    text-transform: uppercase;
    transition: all .35s ease;
    width: fit-content;
}

.sp-card__btn svg {
    height: 14px;
    transition: transform .35s ease;
    width: 14px;
}

.sp-card__btn:hover {
    background: #6aa322;
    box-shadow: 0 6px 24px rgba(122, 185, 41, .35);
    color: #fff;
}

.sp-card__btn:hover svg {
    transform: translateX(4px);
}

.sp-card::after {
    content: '';
    height: 4px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 5;
}

.sp-card--solutions::after {
    background: linear-gradient(90deg, #7ab929 0%, rgba(122, 185, 41, .5) 100%);
}

.sp-card--products::after {
    background: linear-gradient(90deg, rgba(122, 185, 41, .5) 0%, #7ab929 100%);
}

/* Features band */
.features-band {
    background: var(--surface);
    background: linear-gradient(180deg, #f8fbfd 0%, #eaf6ff 100%);
    padding: 80px 0 120px;
}

.feature-grid {
    align-items: center;
    display: grid !important;
    gap: 95px;
    grid-template-columns: .9fr 1.1fr;
}

.feature-grid > * {
    min-width: 0;
}

.accent-line {
    background: var(--green);
    height: 5px;
    margin-bottom: 32px;
    width: 170px;
}

.feature-copy h2 {
    font-size: 40px;
    line-height: 1.05;
    margin: 0 0 35px;
    max-width: 490px;
}

.feature-copy p {
    font-size: 20px;
    line-height: 1.28;
    max-width: 540px;
}

.cards-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 22px;
}

.cards-grid .feature-card:nth-child(1) {
    grid-column: 1 / span 7;
}

.cards-grid .feature-card:nth-child(2) {
    grid-column: 8 / span 5;
}

.cards-grid .feature-card:nth-child(3) {
    grid-column: 1 / span 5;
}

.cards-grid .feature-card:nth-child(4) {
    grid-column: 6 / span 7;
}

.feature-card {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 3px 12px rgba(15, 23, 42, .16);
    min-height: 185px;
    padding: 30px;
}

.feature-card.is-dark {
    background: #002142;
    color: #fff;
}

.feature-card:nth-child(2) {
    background: #0050AC;
    color: #fff;
}

.feature-card i.icon {
    background: #edf4fa;
    border-radius: 5px;
    color: var(--blue);
    display: inline-flex;
    font-size: 28px;
    height: 58px;
    justify-content: center;
    margin-bottom: 22px;
    padding-top: 15px;
    width: 58px;
}

.feature-icon-box {
    align-items: center;
    background: #edf4fa;
    border-radius: 5px;
    display: inline-flex;
    height: 58px;
    justify-content: center;
    margin-bottom: 22px;
    padding: 12px;
    width: 58px;
}

.feature-icon-box img {
    display: block;
    max-height: 34px;
    max-width: 34px;
    object-fit: contain;
}

.feature-card.is-dark i.icon,
.feature-card:nth-child(2) i.icon,
.feature-card.is-dark .feature-icon-box,
.feature-card:nth-child(2) .feature-icon-box {
    background: rgba(255, 255, 255, .16);
    color: #8ec5ff;
}

.feature-card h3 {
    font-size: 20px;
    margin: 0 0 12px;
    text-transform: uppercase;
}

.feature-card p {
    color: #565e66;
    line-height: 1.3;
    margin: 0;
}

.feature-card.is-dark p,
.feature-card:nth-child(2) p {
    color: rgba(255, 255, 255, .76);
}

/* Partner logos */
.companies-band {
    background: #f3f7f9;
    padding: 80px 0 88px;
    text-align: center;
}

.companies-band h2 {
    font-size: 30px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    margin: 0 0 10px;
    /* margin-bottom: 38px; */
}

.companies-band p {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.6;
    text-align: center;
    margin: 0 0 38px;
}

.company-row {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
}

.company-logo {
    align-items: center;
    background: #fff;
    display: flex;
    height: 110px;
    border-radius: 5px;
    justify-content: center;
    overflow: hidden;
    padding: 20px;
    transition: transform .25s ease;
}

.company-logo:hover {
    position: relative;
    transform: scale(1.08);
    z-index: 1;
    box-shadow: 0 0 10px rgba(20, 26, 52, 0.1);
}

.company-logo img {
    filter: grayscale(1);
    max-height: 95px;
    max-width: 170px;
    object-fit: contain;
    transition: filter .25s ease, opacity .25s ease;
}

.company-logo:hover img {
    filter: grayscale(0);
    opacity: 1;
}

/* Customer logos */
.customers-band {
    background: #fff;
    padding: 80px 0 88px;
    text-align: center;
}

.customers-band h2 {
    font-size: 30px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 10px;
}

.customers-band p {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.6;
    margin: 0 0 38px;
}

.customers-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.customer-logo {
    align-items: center;
    background: #ffffff;
    border: 1px solid #EBEBEB;
    border-radius: 5px;
    display: flex;
    height: 100px;
    justify-content: center;
    overflow: hidden;
    padding: 16px;
    transition: transform .25s ease;
}

.customer-logo:hover {
    box-shadow: 0 0 10px rgba(20, 26, 52, 0.1);
    position: relative;
    transform: scale(1.05);
    z-index: 1;
}

.customer-logo img {
    filter: grayscale(1);
    max-height: auto;
    max-width: 100%;
    object-fit: cover;
    transition: filter .25s ease, opacity .25s ease;
}

.customer-logo:hover img {
    filter: grayscale(0);
    opacity: 1;
}

.site-footer-main {
    background: #000000;
   padding: 20px 0;
}

.site-footer-main img {
    width: 150px;
    height: auto;
    object-fit: contain;
    display: block;
}

.site-footer-main a,
.site-footer-main span {
    color: #e5e5e5;
    font-size: 13px;
    text-decoration: none;
}

.site-footer-main a:hover {
    color: #e5e5e5;
    text-decoration: underline;
}
/* --- 5.1 Product catalog --- */

.catalog-page {
    background: #f4f7f9;
}

/* Hero */
.catalog-hero {
    align-items: center;
    background: var(--page-hero-overlay-gradient),
        url('../images/product-landing-banner.png') center/cover;
    color: #fff;
    display: flex;
    min-height: 350px;
    padding: 100px 0 60px;
}

.catalog-hero h1 {
    font-size: 48px;
    font-weight: 800;
    margin: 0 0 20px;
}

.catalog-hero p {
    color: rgba(255, 255, 255, 0.8);
    font-size: 20px;
    line-height: 1.4;
    max-width: 650px;
}

/* Intro quote */
.catalog-intro-quote {
    background: #EFF3F5;
    padding: 60px 0;
    text-align: center;
}

.catalog-intro-quote blockquote {
    color: #4a5568;
    font-size: 24px;
    font-weight: 500;
    line-height: 1.5;
    margin: 0 auto;
    max-width: 900px;
    position: relative;
    border: none;
    padding: 0;
}

/* Layout */
.catalog-layout-wrapper {
    display: grid !important;
    gap: 30px;
    grid-template-columns: 280px 1fr;
    margin-top: 50px !important;
    padding-bottom: 80px;
}

/* Sidebar filters */
.catalog-sidebar-filters {
    background: #fff;
    border-radius: 4px;
    padding: 24px;
    height: fit-content;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.filter-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    border-bottom: 1px solid #edf2f7;
    padding-bottom: 15px;
}

.filter-header__actions {
    align-items: center;
    display: flex;
    gap: 12px;
}

.catalog-filter-toggle,
.catalog-filters-overlay,
.catalog-filters-close {
    display: none;
}

.catalog-top-bar__primary {
    align-items: center;
    display: flex;
    gap: 16px;
    min-width: 0;
}

.catalog-filter-toggle {
    align-items: center;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    color: #2d3748;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    gap: 8px;
    line-height: 1;
    padding: 10px 14px;
}

.catalog-filter-toggle .icon {
    font-size: 14px;
    margin: 0 !important;
}

.catalog-filter-toggle__count {
    align-items: center;
    background: var(--green);
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    height: 20px;
    justify-content: center;
    min-width: 20px;
    padding: 0 6px;
}

.catalog-filters-close {
    align-items: center;
    background: none;
    border: 0;
    color: #3d4550;
    cursor: pointer;
    display: none;
    height: 32px;
    justify-content: center;
    padding: 0;
    width: 32px;
}

.catalog-filters-close .icon {
    font-size: 16px;
    margin: 0 !important;
}

.filter-header h3 {
    font-size: 16px;
    font-weight: 800;
    margin: 0;
}

.ui.checkbox input:checked~.box:after,
.ui.checkbox input:checked~label:after {
    content: '';
    background-image: url('../images/check-icon.svg') !important;
    background-size: 12px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    opacity: 1;
    color: rgb(255 255 255 / 95%);
    background-color: var(--green) !important;
    border-radius: 5px !important;
}

.clear-all {
    color: #e53e3e;
    font-size: 12px;
    font-weight: 700;
}

.filter-group-box {
    margin-bottom: 35px;
}

.filter-group-box h4 {
    color: #718096;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 18px;
}

.filter-options .item {
    margin-bottom: 10px !important;
}

.filter-options label {
    font-size: 14px !important;
    color: #4a5568 !important;
    font-weight: 500 !important;
}

/* Top bar */
.catalog-top-bar {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
}

.results-count {
    color: #718096;
    font-size: 14px;
}

.search-sort-group {
    display: flex;
    gap: 20px;
}

.search-box-container,
.sort-box-container {
    display: flex;
    align-items: center;
    gap: 12px;
}

.search-box-container label,
.sort-box-container label {
    color: #718096;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.search-box input {
    background-color: #fff !important;
    border: 1px solid #9A9A9A !important;
    border-radius: 5px;
    padding: 10px 15px !important;
}

.search-field input {
    background: #fff !important;
    border-radius: 4px !important;
    border: 1px solid #e2e8f0 !important;
    font-size: 13px !important;
    padding: 8px 12px !important;
    width: 220px !important;
}

.sort-box-container .ui.dropdown {
    min-width: 160px;
    font-size: 13px;
    border-radius: 4px;
}

/* Product grid */
.catalog-product-grid {
    display: grid;
    gap: 15px;
    grid-template-columns: repeat(4, 1fr);
}

.catalog-product-card {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    padding: 20px;
    position: relative;
    transition: transform 0.2s;
    min-width: 0;
}

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

.card-image-wrapper {
    border: 1px solid #EBEBEB;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}

.card-image-wrapper img {
    border-radius: 5px;
    max-height: 100%;
    max-width: 100%;
    object-fit: contain;
}

.large-icon {
    color: #cbd5e0;
    font-size: 64px !important;
}

.card-body h3 {
    color: #2d3748;
    font-size: 18px;
    font-weight: 800;
    margin: 0 0 15px;
}

.card-specs {
    color: #718096;
    font-size: 13px;
    line-height: 1.6;
    list-style: disc;
    margin: 0 0 0 18px;
    padding: 0;
    min-height: 80px;
}

.card-specs li {
    max-width: 100%;
}

.card-specs li span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.view-specs-btn {
    background: #78c620;
    border-radius: 4px;
    color: #fff;
    display: block;
    font-size: 13px;
    font-weight: 700;
    padding: 12px;
    text-align: center;
    transition: background 0.2s;
}

.view-specs-btn:hover {
    background: #65a31a;
    color: #fff;
}

.catalog-product-card--hidden {
    display: none;
}

.load-more-container {
    margin-top: 50px;
    text-align: center;
}

.load-more-container .button {
    font-weight: 700 !important;
    padding: 12px 35px !important;
}

/* CTA */
.catalog-cta-ready {
    background: var(--green);
    color: #fff;
    padding: 80px 0;
    text-align: center;
}

.catalog-cta-ready h2 {
    color: #fff;
    font-size: 42px;
    font-weight: 800;
    margin: 0;
}

.catalog-cta-ready p {
    font-size: 42px;
    font-weight: 800;
    margin: 0 0 20px;
}

.cta-sub {
    font-size: 18px !important;
    font-weight: 400 !important;
    margin: 0 auto 40px !important;
    max-width: 600px;
    opacity: 0.9;
}

.cta-buttons {
    display: flex;
    gap: 15px;
    justify-content: center;
}

.cta-buttons .button {
    font-weight: 700 !important;
    padding: 14px 30px !important;
}

/* Footer grid (catalog page) */
.footer-grid {
    display: grid;
    gap: 40px;
    grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
    padding: 80px 0 60px;
}

.footer-brand-col p {
    color: #718096;
    font-size: 14px;
    line-height: 1.6;
    margin: 25px 0;
}

.social-links {
    display: flex;
    gap: 15px;
}

.social-links a {
    align-items: center;
    background: #edf2f7;
    border-radius: 50%;
    color: #4a5568;
    display: flex;
    height: 36px;
    justify-content: center;
    width: 36px;
    transition: background 0.2s, color 0.2s;
}

.social-links a:hover {
    background: var(--green);
    color: #fff;
}

.footer-links-col h4,
.footer-contact-col h4 {
    color: #2d3748;
    font-size: 16px;
    font-weight: 800;
    margin-bottom: 25px;
}

.footer-links-col .item {
    color: #718096 !important;
    font-size: 14px !important;
    margin-bottom: 12px !important;
}

.footer-links-col .item:hover {
    color: var(--green) !important;
}

.footer-contact-col p {
    color: #4a5568;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 15px;
}

.footer-bottom {
    align-items: center;
    border-top: 1px solid #edf2f7;
    display: flex;
    justify-content: space-between;
    padding: 30px 0;
}

.footer-bottom p {
    color: #a0aec0;
    font-size: 13px;
    margin: 0;
}

/* --- 5.2 Product detail --- */

.section-title {
    font-size: 32px;
    font-weight: 800;
    margin-bottom: 40px;
    text-align: center;
}

.product-detail-page {
    background: #fff;
}

.product-intro-section {
    padding: 30px 0 60px 0;
    background: #EFF3F5;
}

.product-gallery-container {
    position: sticky;
    top: 100px;
}

.main-image-view {
    align-items: center;
    /* background: #f8fafc; */
    background-color: #fff;
    border: 1px solid #f1f5f9;
    border-radius: 8px;
    display: flex;
    height: 450px;
    justify-content: center;
    margin-bottom: 20px;
    padding: 30px;
}

.main-image-view img {
    max-height: 100%;
    max-width: 100%;
    object-fit: cover;
}

.image-placeholder {
    color: #cbd5e1;
    font-size: 80px;
}

.main-image-view .main-product-img i {
    margin-right: 0px !important;
}

.gallery-thumbnails {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding-bottom: 10px;
}

.thumb-item {
    border: 2px solid transparent;
    background-color: #fff;
    border-radius: 6px;
    cursor: pointer;
    flex-shrink: 0;
    height: 80px;
    overflow: hidden;
    transition: border-color 0.2s;
    width: 80px;
}

.thumb-item img {
    height: 100%;
    object-fit: contain;
    padding: 5px;
    width: 100%;
}

.thumb-item.active {
    border-color: var(--green);
}

.thumb-item {
    position: relative;
    overflow: hidden;
}

.thumb-item.active::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(120, 198, 32, 0.25);
    z-index: 1;
    pointer-events: none;
}

.thumb-item img {
    display: block;
    width: 100%;
}

.thumb-item.active {
    border-color: var(--green);
}

#image-zoom-modal a {
    font-size: 1em;
    cursor: pointer;
    color: white;
    background-color: black;
    padding: 6px 15px;
    border-radius: 5px;
    position: absolute;
    top: 50px;
    z-index: 10000;
    border: 1px solid white;
}

#image-zoom-modal a:hover {
    font-size: 1em;
    cursor: pointer;
    color: white;
    background-color: red;
    padding: 6px 15px;
    border-radius: 5px;
    position: absolute;
    z-index: 10000;
    border: 1px solid red;
}

.product-info-content {
    padding-left: 30px;
}

.brand-tag {
    color: var(--green);
    display: block;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 1px;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.product-title {
    color: #0f172a;
    font-size: 42px;
    font-weight: 900;
    margin: 0 0 25px;
}

.product-short-description {
    color: #475569;
    font-size: 18px;
    line-height: 1.6;
    margin-bottom: 40px;
}

.action-buttons {
    display: flex;
    gap: 15px;
}

.action-buttons .button {
    font-weight: 700 !important;
    padding: 14px 28px !important;
}

.product-tabs-section {
    background: #fff;
    border-top: 1px solid #e2e8f0;
    padding: 60px 0 100px;
}

.product-description-video {
    margin-top: 32px;
    width: 50%;
    height: auto;
}

.product-video-embed {
    background: #000;
    border-radius: 8px;
    height: 0;
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
}

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

.product-description-video video {
    border-radius: 8px;
    display: block;
    max-height: 480px;
    width: 100%;
}

.custom-tabs.menu {
    border-bottom: 2px solid #e2e8f0 !important;
    margin-bottom: 40px !important;
}

.custom-tabs.menu .item {
    font-size: 16px !important;
    font-weight: 700 !important;
    padding: 15px 25px !important;
}

.custom-tabs.menu .item.active {
    border-bottom-color: var(--green) !important;
    color: var(--green) !important;
}

.ui.secondary.pointing.menu .active.item {
    border-bottom: 2px solid !important;
    border-bottom-color: var(--green) !important;

}

.similar-products-section {
    background-color: #EFF3F5;
    border-top: 1px solid #e2e8f0;
    padding: 60px 0 100px;
}

.ui.segment {
    box-shadow: none;
    border: none;
}

.specs-table-container {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.product-specs-table {
    border: none !important;
    margin: 0 !important;
}

.product-specs-table td {
    padding: 15px 25px !important;
}

.spec-label {
    font-weight: 600;
    white-space: nowrap;
}

.spec-value {
    color: #0f172a;
}

.downloads-section-title {
    color: #94a3b8;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-top: 30px;
    margin-bottom: 12px;
}

/* Horizontal scroll for specification, downloads, and e-waste tables */
.spec-table-wrap,
.downloads-table-container,
.ewaste-table-wrap {
    -webkit-overflow-scrolling: touch;
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
    max-width: 100%;
    overflow-x: auto;
}

.spec-table-wrap {
    margin-bottom: 0;
}

.downloads-table-container {
    background: #fff;
    border: none;
    border-radius: 0;
    box-shadow: none;
    margin-bottom: 35px;
}

.spec-table,
.ewaste-table {
    background: #fff;
    border-collapse: collapse;
    font-size: 14px;
    line-height: 1.5;
    margin: 0 !important;
    min-width: 520px;
    width: 100%;
}

.spec-table thead,
.ewaste-table thead {
    background: #1a3a5c;
    color: #fff;
}

.spec-table th,
.spec-table td,
.ewaste-table th,
.ewaste-table td {
    border: 1px solid #e0e0e0;
    padding: 14px 16px;
    text-align: left;
    vertical-align: top;
}

.spec-table th,
.ewaste-table th {
    font-weight: 600;
    white-space: nowrap;
}

.spec-table tbody tr:nth-child(even):not(.spec-group-header),
.ewaste-table tbody tr:nth-child(even) {
    background: #f9fbfd;
}

.spec-table tbody tr:hover:not(.spec-group-header),
.ewaste-table tbody tr:hover {
    background: #f0f6fc;
}

.spec-table .spec-group-header td {
    background: #edf2f7;
    color: #1a3a5c;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.spec-table .spec-label {
    color: #334155;
    font-weight: 600;
}

.spec-table .spec-value {
    color: #334155;
}

.downloads-table {
    min-width: 680px;
    width: 100%;
    border-collapse: collapse;
    margin: 0 !important;
}

.downloads-table thead {
    background-color: #f2f2f2;
}

.downloads-table th {
    border-top: 1px solid #cbd5e1;
    border-bottom: 1px solid #cbd5e1;
    color: #475569;
    font-size: 14px;
    font-weight: 700;
    padding: 12px 10px;
    text-align: left;
}

.downloads-table td {
    border-bottom: 1px solid #f1f5f9;
    color: #334155;
    font-size: 14px;
    padding: 14px 10px;
    vertical-align: middle;
}

.downloads-table tbody tr:hover td {
    background-color: #fafafa;
}

.downloads-table th.right.aligned,
.downloads-table td.right.aligned {
    text-align: right;
    padding-right: 20px;
}

.downloads-table .download-btn-link {
    align-items: center;
    color: #475569;
    display: inline-flex;
    font-size: 14px;
    font-weight: 600;
    gap: 6px;
    position: relative;
    text-decoration: none;
    transition: color 0.2s ease;
}

.downloads-table .download-btn-link .icon {
    font-size: 15px;
    margin: 0;
}

.downloads-table .download-btn-link:hover {
    color: var(--green);
}

.downloads-table .download-btn-link--protected {
    color: #64748b;
}

.downloads-table .download-btn-link--protected:hover {
    color: #0f766e;
}

.downloads-table .download-btn-link--protected[data-tooltip]::before,
.downloads-table .download-btn-link--protected[data-tooltip]::after {
    left: 50%;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transform: translateX(-50%);
    transition: opacity 0.15s ease, transform 0.15s ease;
    z-index: 5;
}

.downloads-table .download-btn-link--protected[data-tooltip]::after {
    background: #1e293b;
    border-radius: 6px;
    bottom: calc(100% + 8px);
    color: #fff;
    content: attr(data-tooltip);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
    padding: 6px 10px;
    white-space: nowrap;
}

.downloads-table .download-btn-link--protected[data-tooltip]::before {
    border: 6px solid transparent;
    border-top-color: #1e293b;
    bottom: calc(100% + 2px);
    content: '';
}

.downloads-table .download-btn-link--protected[data-tooltip]:hover::before,
.downloads-table .download-btn-link--protected[data-tooltip]:hover::after {
    opacity: 1;
    transform: translateX(-50%) translateY(-2px);
}

.inquiry-form-box {
    padding: 40px !important;
}

.inquiry-form-box h3 {
    font-size: 24px;
    font-weight: 800;
    margin-bottom: 10px;
}

.inquiry-form-box p {
    color: #64748b;
    margin-bottom: 30px;
}

/* --- 5.3 Company --- */


.green-text {
    color: var(--green);
}

.cp-label-tag {
    background: var(--green);
    color: #fff;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
    margin-bottom: 14px;
    padding: 5px 14px;
    text-transform: uppercase;
}

/* Hero Carousel */
.cp-hero-carousel {
    color: #fff;
    min-height: 480px;
    overflow: hidden;
    position: relative;
}

.cp-hero-carousel__track {
    min-height: 480px;
    position: relative;
}

.cp-hero-carousel__slide {
    background: #0f172a url('../images/product-landing-banner.png') center/cover;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition: opacity .6s ease;
    visibility: hidden;
    width: 100%;
}

.cp-hero-carousel__slide.is-active {
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
    z-index: 1;
}

.cp-hero-carousel__inner {
    align-items: center;
    display: flex !important;
    min-height: 480px;
    padding: 120px 0 110px;
    position: relative;
    z-index: 2;
}

.cp-hero__feature {
    color: #fff;
    background-color: #294300;
    border-left: 3px solid #7cc51f;
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
    display: inline-block;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0;
    margin-bottom: 10px;
    text-transform: uppercase;
    padding: 5px 20px 5px 10px;
}

.cp-hero__desc {
    font-size: 1.05rem;
    line-height: 1.6;
    margin-top: 12px;
    max-width: 620px;
    opacity: .9;
}

.cp-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.cp-hero__btn-outline {
    font-weight: 400 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #fff !important;
}

.cp-hero__btn-outline:hover {
    background: rgba(255, 255, 255, .12) !important;
    color: #fff !important;
}

.cp-hero-carousel__chrome {
    bottom: 0;
    left: 0;
    margin: 0 auto;
    max-width: 1315px;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: min(1315px, 100%);
    z-index: 4;
}

.cp-hero-carousel__chrome .cp-hero-carousel__arrow,
.cp-hero-carousel__chrome .cp-hero-carousel__controls {
    pointer-events: auto;
}

.cp-hero-carousel__arrow {
    align-items: center;
    background: rgba(15, 23, 42, .45);
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 50%;
    color: rgba(255, 255, 255, .92);
    cursor: pointer;
    display: inline-flex;
    height: 44px;
    justify-content: center;
    padding: 0;
    position: absolute;
    top: 90%;
    transform: translateY(-50%);
    transition: background .2s ease, border-color .2s ease, color .2s ease;
    width: 44px;
}

.cp-hero-carousel__arrow:hover {
    background: rgba(15, 23, 42, .72);
    border-color: rgba(255, 255, 255, .5);
    color: #fff;
}

.cp-hero-carousel__arrow i.icon {
    font-size: 1.1rem;
    margin: 0 !important;
}

.cp-hero-carousel__arrow--prev {
    left: 0;
}

.cp-hero-carousel__arrow--next {
    right: 0;
}

.cp-hero-carousel__controls {
    align-items: center;
    background: rgba(37, 48, 74, 0.70);
    border-radius: 5px;
    bottom: 28px;
    display: inline-flex;
    gap: 14px;
    left: 50%;
    padding: 8px 16px;
    position: absolute;
    transform: translateX(-50%);
}

.cp-hero-carousel__playpause {
    background: transparent;
    border: 0;
    color: rgba(255, 255, 255, .85);
    cursor: pointer;
    font-size: .95rem;
    line-height: 1;
    padding: 0;
}

.cp-hero-carousel__playpause:hover {
    color: #fff;
}

.cp-hero-carousel__dots {
    align-items: center;
    display: flex;
    gap: 8px;
}

.cp-hero-carousel__dot {
    background: rgba(255, 255, 255, .35);
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    height: 8px;
    padding: 0;
    width: 8px;
}

.cp-hero-carousel__dot.is-active {
    background: var(--green);
    height: 10px;
    width: 10px;
}

/* Hero (legacy single-slide fallback) */
.cp-hero {
    align-items: center;
    background: #0f172a url('../images/product-landing-banner.png') center/cover;
    color: #fff;
    display: flex;
    min-height: 480px;
    padding: 120px 0 80px;
    position: relative;
}

.cp-hero__content {
    position: relative;
    z-index: 2;
    max-width: 650px;
}

.cp-hero__subtitle {
    font-size: 1.1rem;
    margin-bottom: 10px;
    opacity: .85;
    font-size: 18px !important;
    font-weight: 700 !important;
}

/* About Us & Counter */
.cp-about-counter {
    padding: 80px 0 0;
}

.cp-about-counter__intro {
    align-items: center;
    display: grid;
    gap: 40px;
    grid-template-columns: 1fr 1fr;
    margin-bottom: 40px;
}

.cp-about-counter__feature {
    /* align-items: center; */
    color: var(--green);
    display: inline-flex;
    /* font-size: 12px; */
    font-weight: 700;
    gap: 6px;
    letter-spacing: 1px;
    margin-bottom: 16px;
    text-transform: uppercase;
}

.cp-about-counter__feature .icon {
    font-size: .9em;
    margin: 0;
}

.cp-about-counter__intro-left h2 {
    color: #0f172a;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.15;
    margin: 0;
}

.cp-about-counter__intro-right p {
    color: #64748b;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    margin: 0 0 24px;
}

.cp-about-counter__banner {
    border-radius: 12px;
    overflow: hidden;
}

.cp-about-counter__banner img {
    display: block;
    height: auto;
    object-fit: cover;
    width: 100%;
}

.cp-about-counter__stats {
    background: #EFF3F5;
    margin-top: 48px;
    padding: 56px 0;
}

.cp-about-counter__stats-grid {
    display: grid;
    gap: 40px;
    grid-template-columns: repeat(3, 1fr);
    text-align: center;
}

.cp-about-counter__stat-number {
    color: transparent;
    display: block;
    font-size: 80px;
    font-weight: 800;
    -webkit-text-stroke: 2.5px #94a3b8;
    line-height: 1;
}

.cp-about-counter__stat-line {
    background: #cbd5e1;
    display: block;
    height: 1px;
    margin: 16px auto;
    width: 80%;
}

.cp-about-counter__stat-label {
    color: #475569;
    display: block;
    font-size: 20px;
    line-height: 1.4;
    font-weight: 400;
}

/* About (legacy) */
.cp-about__grid {
    display: grid;
    gap: 50px;
    grid-template-columns: 1fr 1fr;
    align-items: center;
}

.cp-about__text h2 {
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.3;
    margin-bottom: 16px;
}

.cp-about__highlight {
    font-size: 1.2rem;
    margin-bottom: 16px;
}

.cp-about__image img {
    border-radius: 12px;
    width: 100%;
    object-fit: cover;
}

/* Stats */
.cp-stats {
    background: #f8fafc;
    padding: 60px 0;
}

.cp-stats__grid {
    display: flex;
    justify-content: center;
    gap: 60px;
    flex-wrap: wrap;
}

.cp-stat-box {
    text-align: center;
}

.cp-stat-box__number {
    color: #0f172a;
    display: block;
    font-size: 3rem;
    font-weight: 800;
}

.cp-stat-box__label {
    color: #64748b;
    font-size: 14px;
    margin-top: 4px;
}

/* Comprehensive Solutions & Products showcase */
.cp-cat-showcase {
    background: #fff;
}

.cp-cat-showcase__tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
}

.cp-cat-showcase__tab {
    background: #fff;
    border: 1px solid #dbe3ea;
    color: #111827;
    cursor: pointer;
    font-family: inherit;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .04em;
    padding: 18px 24px;
    text-transform: uppercase;
    transition: background .2s, color .2s;
}

.cp-cat-showcase__tab.is-active {
    background: var(--green);
    color: #fff;
    border:none !important;
}

.cp-cat-showcase__header {
    align-items: center;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    margin: 50px 0 50px;
}

.cp-cat-showcase__view-all {
    background: #fff;
    border: 2px solid #111827;
    border-radius: 4px;
    color: #111827;
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 700;
    padding: 12px 22px;
    text-decoration: none;
    transition: background .2s, color .2s;
    white-space: nowrap;
}

.cp-cat-showcase__view-all:hover {
    background: #111827;
    color: #fff;
}

.cp-cat-showcase__layout {
    align-items: start;
    display: grid;
    grid-template-columns: minmax(380px, 340px) minmax(450px, 1fr) minmax(220px, 1fr);
    position: relative;
}

.cp-cat-showcase__nav {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cp-cat-showcase__nav-item {
    background: transparent;
    border: none;
    color: #111827;
    cursor: pointer;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    padding: 14px 16px;
    text-align: left;
    transition: background .2s, color .2s;
}

.cp-cat-showcase__nav-item.is-active {
    background: var(--green);
    color: #fff;
}

.cp-cat-showcase__visual {
    align-items: start;
    display: flex;
    justify-content: center;
    min-height: 320px;
    position: relative;
}

.cp-cat-showcase__visual-bg {
    background: #F2F2F255;
    border-radius: 50%;
    height: min(500px, 90vw);
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(580px, 90vw);
    z-index: 0;
}

.cp-cat-showcase__visual-card {
    background: #e8edf2;
    border-radius: 5px;
    box-shadow: 0 18px 40px rgba(15, 23, 42, .08);
    /* max-width: 360px; */
    overflow: hidden;
    padding: 18px;
    position: relative;
    width: 100%;
    z-index: 1;
    height: 300px;
}

.cp-cat-showcase__image {
    border-radius: 3px;
    display: block;
    height: 260px;
    object-fit: cover;
    width: 100%;
    object-position: right bottom;
}
.cp-cat-showcase__nav, .cp-cat-showcase__detail {
    z-index: 2;
}

.cp-cat-showcase__detail {
    padding-left: 30px;
}

.cp-cat-showcase__feature-title {
    font-size: clamp(1.35rem, 2vw, 1.75rem);
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 16px;
}

.cp-cat-showcase__feature-desc {
    color: #475569;
    font-size: 15px;
    line-height: 1.65;
    margin: 0 0 18px;
}

.cp-cat-showcase__bullets {
    list-style: none;
    margin: 0 0 22px;
    padding: 0;
}

.cp-cat-showcase__bullets li {
    color: #111827;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 8px;
}

.cp-cat-showcase__bullets li::before {
    color: var(--green);
    content: '✓';
    margin-right: 8px;
}

.cp-cat-showcase__read-more {
    border-bottom: 3px solid var(--green);
    color: #111827;
    display: inline-block;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
}

.cp-cat-showcase__empty {
    color: #64748b;
    font-size: 15px;
    padding: 24px 0;
}

/* Core Capabilities */
.cp-capabilities {
    background: #f3f6f8;
}

.cp-capabilities__header {
    margin-bottom: 36px;
    max-width: 760px;
}

.cp-capabilities__grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: auto auto auto;
}

.cp-capability-card {
    border-radius: 10px;
    color: inherit;
    display: flex;
    min-height: 148px;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    transition: transform .2s, box-shadow .2s;
}

.cp-capability-card:hover {
    box-shadow: 0 14px 34px rgba(15, 23, 42, .12);
    transform: translateY(-2px);
}

.cp-capability-card__body {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 22px 22px 20px;
    position: relative;
    width: 100%;
    z-index: 1;
}

.cp-capability-card__title {
    font-size: 22px !important;
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 10px;
}

.cp-capability-card__description {
    font-size: 15px !important;
    font-weight: 400;
    line-height: 1.5;
    margin: 0;
}
.cp-capability-card--slot-1 {
    grid-column: 1;
    grid-row: 1 / span 2;
    min-height: 100%;
}

.cp-capability-card--slot-2 {
    grid-column: 2;
    grid-row: 1;
}

.cp-capability-card--slot-3 {
    grid-column: 3;
    grid-row: 1;
}

.cp-capability-card--slot-4 {
    grid-column: 2 / span 2;
    grid-row: 2;
}

.cp-capability-card--slot-5 {
    grid-column: 1;
    grid-row: 3;
}

.cp-capability-card--slot-6 {
    grid-column: 2 / span 2;
    grid-row: 3;
}

.cp-capability-card--default,
.cp-capability-card--wide {
    background: #fff;
    border: 1px solid #e3e9ef;
}

.cp-capability-card--default i.icon,
.cp-capability-card--wide i.icon {
    color: #111827;
}

.cp-capability-card--default h3,
.cp-capability-card--wide h3 {
    color: #111827;
}

.cp-capability-card--default p,
.cp-capability-card--wide p {
    color: #64748b;
}

.cp-capability-card--featured {
    background: #001c3d;
    border: 1px solid #001c3d;
    color: #fff;
}

.cp-capability-card--featured i.icon {
    color: #fff;
}

.cp-capability-card--featured h3 {
    color: #fff;
}

.cp-capability-card--featured p {
    color: rgba(255, 255, 255, .78);
}

.cp-capability-card--featured .cp-capability-card__body {
    justify-content: flex-start;
}

.cp-capability-card--featured .cp-capability-card__bullets {
    margin-top: auto;
    padding-top: 18px;
}

.cp-capability-card--accent {
    background: #0056b3;
    border: 1px solid #0056b3;
    color: #fff;
}

.cp-capability-card--accent i.icon,
.cp-capability-card--accent h3 {
    color: #fff;
}

.cp-capability-card--accent p {
    color: rgba(255, 255, 255, .82);
    max-width: 68%;
}

.cp-capability-card__decor {
    bottom: 0;
    height: 100%;
    pointer-events: none;
    position: absolute;
    right: 0;
    width: 42%;
    z-index: 0;
}

.cp-capability-card__decor::before,
.cp-capability-card__decor::after {
    background: rgba(255, 255, 255, .14);
    border-radius: 50%;
    content: '';
    position: absolute;
}

.cp-capability-card__decor::before {
    bottom: 18px;
    height: 88px;
    right: 34px;
    width: 88px;
}

.cp-capability-card__decor::after {
    bottom: 42px;
    box-shadow:
        0 -34px 0 rgba(255, 255, 255, .1),
        0 -68px 0 rgba(255, 255, 255, .07);
    height: 68px;
    right: 72px;
    width: 68px;
}

.cp-capability-card i.icon {
    font-size: 1.65rem;
    margin-bottom: 14px;
}

.cp-capability-card h3 {
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 10px;
}

.cp-capability-card p {
    font-size: 13px;
    line-height: 1.55;
    margin: 0;
}

.cp-capability-card__bullets {
    list-style: none;
    margin: 0;
    padding: 0;
}

.cp-capability-card__bullets li {
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 8px;
}

.cp-capability-card--featured .cp-capability-card__bullets li {
    color: rgba(255, 255, 255, .92);
}

.cp-capability-card__bullets li::before {
    color: var(--green);
    content: '✓';
    margin-right: 8px;
}

/* Industry Verticals */
.cp-verticals {
    background: #f5f8fa;
}

.cp-verticals__header {
    margin-bottom: 36px;
    max-width: 760px;
}

.cp-verticals__grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.cp-vertical-card {
    border-radius: 10px;
    min-height:270px;
    overflow: hidden;
    position: relative;
}

.cp-vertical-card__media {
    background: #dbe3ea;
    height: 100%;
    inset: 0;
    overflow: hidden;
    position: absolute;
    width: 100%;
}

.cp-vertical-card__media img {
    display: block;
    filter: grayscale(100%);
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transition: filter .35s ease, transform .45s ease;
    width: 100%;
}

.cp-vertical-card:hover .cp-vertical-card__media img {
    filter: grayscale(0%);
    transform: scale(1.06);
}

.cp-vertical-card__overlay {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0) 45%, rgba(15, 23, 42, .72) 100%);
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 1;
}

.cp-vertical-card__title {
    bottom: 38px;
    color: #fff;
    font-size: 25px;
    font-weight: 600;
    left: 38px;
    line-height: 1.2;
    margin: 0;
    position: absolute;
    z-index: 2;
}

/* Integrated Solutions */
.cp-integrated {
    background: #041428;
    color: #fff;
}

.cp-integrated__header {
    margin-bottom: 20px;
    max-width: 760px;
}

.cp-integrated__header p {
    color: rgba(255, 255, 255, .72);
    font-size: 15px;
    line-height: 1.65;
    margin: 0;
    max-width: 620px;
}

.cp-integrated__body {
    align-items: start;
    display: grid;
    gap: 36px;
    grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr);
}

.cp-integrated__solutions-items {
    display: flex;
    flex-direction: column;
    gap: 28px;
    padding-left: 50px;
    position: relative;
}

.cp-integrated__solutions{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cp-integrated__solutions-description {
    color: #8799AE;
    font-size: 15px;
    font-weight: 400 !important;
    line-height: 1.5;
    margin: 0 0 24px;
}

.cp-integrated-solution {
    align-items: flex-start;
    display: flex;
    gap: 18px;
}

.cp-integrated-solution__content{
    flex-direction: column;
    gap: 10px;
}

.cp-integrated-solution__icon {
    align-items: center;
    background: #1a4f9c;
    border-radius: 8px;
    display: flex;
    flex-shrink: 0;
    height: 52px;
    justify-content: center;
    width: 52px;
}

.cp-integrated-solution__icon i.icon {
    color: #fff;
    font-size: 1.35rem;
    margin: 0;
}

.cp-integrated-solution__content h3 {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.25;
    margin: 0 0 8px;
}

.cp-integrated-solution__content p {
    color: #8799AE;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.6;
    margin: 0 0 8px;
}

.cp-integrated-solution__link {
    color: var(--green);
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    text-decoration: none;
    transition: color .2s;
}

.cp-integrated-solution__link:hover {
    color: #fff;
}

.cp-integrated__gallery {
    display: grid;
    gap: 6px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cp-integrated__gallery-item {
    aspect-ratio: 1.15 / 1;
    background: #0d2748;
    overflow: hidden;
}

.cp-integrated__gallery-item img {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

/* Our Approach */
.cp-approach {
    background: #f3f6f8;
}

.cp-approach__header {
    margin-bottom: 42px;
    text-align: center;
}

.cp-approach__grid {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cp-approach-card {
    background: linear-gradient(180deg, #fff 0%, #ffffff00 100%);
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
    overflow: hidden;
    padding: 34px 28px 30px;
    position: relative;
    text-align: center;
    border-bottom: 7px solid white;
}

.cp-approach-card__num {
    color: #F3F3F3;
    font-size: clamp(4rem, 8vw, 5.5rem);
    font-weight: 700;
    line-height: 1;
    opacity: 1;
    pointer-events: none;
    position: absolute;
    right: 16px;
    top: 8px;
    z-index: 0;
}

.cp-approach-card__icon {
    margin: 0 auto 22px;
    position: relative;
    z-index: 1;
}

.cp-approach-card__icon img {
    display: block;
    height: 100px;
    object-fit: contain;
    width: auto;
}

.cp-approach-card__icon i.icon {
    color: var(--green);
    font-size: 2.4rem;
    margin: 0;
}

.cp-approach-card h3 {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.35;
    margin: 0 0 14px;
    position: relative;
    text-align: left;
    z-index: 1;
}

.cp-approach-card p {
    color: #64748b;
    font-size: 14px;
    line-height: 1.65;
    margin: 0;
    position: relative;
    text-align: left;
    z-index: 1;
}

/* Milestones */
.cp-milestones {
    background: #fff;
}

.cp-milestones__header {
    margin-bottom: 48px;
    text-align: center;
}

.cp-milestones__timeline {
    margin: 0 auto;
    max-width: 720px;
    padding-left: 36px;
    position: relative;
}

.cp-milestones__line {
    background: #73bd19;
    bottom: 0;
    left: 6px;
    position: absolute;
    top: 8px;
    width: 2px;
}

.cp-milestones__item {
    margin-bottom: 32px;
    padding-left: 28px;
    position: relative;
}

.cp-milestones__item:last-of-type {
    margin-bottom: 24px;
}

.cp-milestones__dot {
    background: #73bd19;
    border: 3px solid #ffffff;
    box-shadow: 0 0 10px rgba(115, 189, 25, 0.6);
    border-radius: 50%;
    height: 18px;
    left: -38px;
    position: absolute;
    top: 4px;
    width: 18px;
    z-index: 1;
}

.cp-milestones__year {
    color: #73bd19;
    font-size: 25px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
}

.cp-milestones__content p {
    color: #334155;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.2;
    margin: 0;
}

.cp-milestones__closing-wrap {
    margin-top: 8px;
    padding-left: 28px;
    position: relative;
}

.cp-milestones__closing-dot {
    background: #73bd19;
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 12px rgba(115, 189, 25, .55);
    height: 18px;
    left: -38px;
    position: absolute;
    top: 2px;
    width: 18px;
    z-index: 2;
}

.cp-milestones__closing-ring {
    animation: cp-milestone-pulse 2.4s ease-out infinite;
    border: 2px solid rgba(115, 189, 25, .45);
    border-radius: 50%;
    height: 18px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 18px;
}

.cp-milestones__closing-ring--delay {
    animation-delay: 1.2s;
}

.cp-milestones__closing {
    align-items: center;
    color: #0f172a;
    display: flex;
    flex-wrap: wrap;
    font-size: 16px;
    font-weight: 700;
    gap: 8px;
    line-height: 1.45;
    margin: 0;
}

.cp-milestones__closing-text {
    animation: cp-milestone-text-shimmer 4s ease-in-out infinite;
    background: linear-gradient(90deg, #0f172a 0%, #0f172a 40%, #73bd19 50%, #0f172a 60%, #0f172a 100%);
    background-clip: text;
    background-size: 220% 100%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.cp-milestones__closing-arrow {
    animation: cp-milestone-arrow 1.8s ease-in-out infinite;
    color: #73bd19;
    display: inline-block;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
}

@keyframes cp-milestone-pulse {
    0% {
        opacity: .75;
        transform: translate(-50%, -50%) scale(1);
    }

    100% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(2.6);
    }
}

@keyframes cp-milestone-text-shimmer {
    0%, 100% {
        background-position: 100% center;
    }

    50% {
        background-position: 0% center;
    }
}

@keyframes cp-milestone-arrow {
    0%, 100% {
        opacity: .7;
        transform: translateX(0);
    }

    50% {
        opacity: 1;
        transform: translateX(7px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .cp-milestones__closing-ring,
    .cp-milestones__closing-text,
    .cp-milestones__closing-arrow {
        animation: none;
    }

    .cp-milestones__closing-text {
        -webkit-text-fill-color: #0f172a;
        background: none;
        color: #0f172a;
    }
}

/* Projects */
.cp-projects {
    background: #ffffff;
    padding: 72px 0 0;
}

.cp-projects__header {
    margin-bottom: 36px;
    max-width: 760px;
}

.cp-projects__cards {
    display: grid;
    gap: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
}

.cp-project-card {
    color: #fff;
    display: block;
    min-height: 350px;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    transition: transform .25s ease;
}

.cp-project-card:hover {
    color: #fff;
    transform: scale(1.01);
    z-index: 1;
    border: none !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .12) !important;
}

.cp-project-card__image {
    display: block;
    height: 100%;
    inset: 0;
    object-fit: cover;
    position: absolute;
    width: 100%;
}

.cp-project-card__overlay {
    background: linear-gradient(180deg, rgba(4, 20, 40, .15) 25%, rgba(4, 20, 40, .95) 70%);
    inset: 0;
    position: absolute;
    z-index: 1;
}

.cp-project-card__content {
    bottom: 0;
    left: 0;
    padding: 28px 26px 30px;
    position: absolute;
    right: 0;
    z-index: 2;
}

.cp-project-card__badge {
    background: var(--green);
    border-radius: 3px;
    color: #fff;
    display: inline-block;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .04em;
    margin-bottom: 12px;
    padding: 6px 10px;
    text-transform: uppercase;
}

.cp-project-card h3 {
    color: #fff;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.35;
    margin: 0;
}

.cp-project-card:hover h3 {
    color: #fff;
}

.cp-projects__stats {
    background: #002A55;
    color: #fff;
    margin-top: 0;
    padding: 48px 0;
}

.cp-projects__stats-grid {
    align-items: center;
    max-width: 1000px;
    display: flex;
    gap: 20px;
    margin: 0 auto;    
}

.cp-projects__stats-metric{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    max-width: 400px;
}

.cp-projects__stats-metric strong {
    display: block;
    font-size: 50px;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 8px;
}

.cp-projects__stats-metric span {
    color: rgba(255, 255, 255, .88);
    display: block;
    font-size: 15px;
    font-weight: 600;
    text-align: center;
}

.cp-projects__stats-grid p {
    color: rgba(255, 255, 255, .82);
    font-size: 15px;
    line-height: 1.65;
    margin: 0;
}

/* Leadership */
.cp-leadership {
    background: #f3f6f8;
    text-align: center;
}

.cp-leadership__header {
    margin-bottom: 42px;
}

.cp-leadership__grid {
    display: grid;
    gap: 32px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 980px;
    margin: 0 auto;
}

.cp-leadership-card__photo {
    background: #c5cdd4;
    border-radius: 50%;
    height: 190px;
    margin: 0 auto 22px;
    overflow: hidden;
    width: 190px;
}

.cp-leadership-card__photo img {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.cp-leadership-card__placeholder {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
}

.cp-leadership-card__placeholder i.icon {
    color: #94a3b8;
    font-size: 3rem;
    margin: 0;
}

.cp-leadership-card h3 {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.35;
    margin: 0 0 8px;
}

.cp-leadership-card__role {
    color: #475569;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    margin: 0 0 10px;
}

.cp-leadership-card__desc {
    color: #64748b;
    font-size: 13px;
    line-height: 1.6;
    margin: 0 auto;
    max-width: 280px;
}

/* Testimonials */
.cp-testimonials {
    background: #f5f8fa;
}

.cp-testimonials__header {
    margin-bottom: 48px;
    max-width: 760px;
}

.cp-testimonials__carousel {
    position: relative;
}

.cp-testimonials__slider {
    align-items: center;
    display: flex;
    gap: 12px;
}

.cp-testimonials__viewport {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

.cp-testimonials__track {
    display: flex;
    will-change: transform;
}

.cp-testimonials__arrow {
    align-items: center;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 50%;
    color: var(--navy);
    cursor: pointer;
    display: inline-flex;
    flex-shrink: 0;
    height: 44px;
    justify-content: center;
    transition: background .2s ease, border-color .2s ease, color .2s ease;
    width: 44px;
}

.cp-testimonials__arrow:hover:not(:disabled) {
    background: var(--green);
    border-color: var(--green);
    color: #fff;
}

.cp-testimonials__arrow:disabled {
    cursor: default;
    opacity: .35;
}

.cp-testimonials__arrow i.icon {
    margin: 0;
}

.cp-testimonials__pagination {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-top: 28px;
    min-height: 12px;
}

.cp-testimonials__carousel.is-static .cp-testimonials__arrow,
.cp-testimonials__carousel.is-static .cp-testimonials__pagination {
    display: none;
}

.cp-testimonials__dot {
    background: #cbd5e1;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    height: 10px;
    padding: 0;
    transition: background .2s ease, transform .2s ease;
    width: 10px;
}

.cp-testimonials__dot.is-active {
    background: var(--green);
    transform: scale(1.15);
}

.cp-testimonial-card {
    box-sizing: border-box;
    display: flex;
    flex: 0 0 33.3333%;
    flex-direction: column;
    min-height: 100%;
    padding: 0 32px;
    position: relative;
}

.cp-testimonial-card:not(:last-child) {
    border-right: 1px solid #e2e8f0;
}

.cp-testimonial-card:first-child {
    padding-left: 0;
}

.cp-testimonial-card:last-child {
    padding-right: 0;
}

.cp-testimonial-card__header {
    align-items: center;
    display: flex;
    gap: 16px;
    margin-bottom: 10px;
}

.cp-testimonial-card__logo {
    align-items: center;
    background: #f1f5f9;
    border-radius: 10px;
    color: #64748b;
    display: flex;
    flex-shrink: 0;
    font-size: 18px;
    font-weight: 800;
    height: 64px;
    justify-content: center;
    width: 64px;
}

.cp-testimonial-card__logo img {
    display: block;
    height: 100%;
    object-fit: contain;
    padding: 8px;
    width: 100%;
}

.cp-testimonial-card__meta h3 {
    color: var(--navy);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 4px;
}

.cp-testimonial-card__meta span {
    color: #64748b;
    display: block;
    font-size: 14px;
    font-weight: 600;
}

.cp-testimonial-card p {
    color: #475569;
    flex: 1;
    font-size: 15px;
    line-height: 1.4;
    margin: 0 0 10px;
}

.cp-testimonial-card__footer {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    margin-top: auto;
}

.cp-testimonial-card__stars {
    color: var(--green);
    display: flex;
    gap: 2px;
}

.cp-testimonial-card__stars i.icon {
    font-size: .9rem;
    margin: 0;
}

.cp-testimonial-card__quote-icon {
    color: #e2e8f0;
    font-size: 4rem;
    font-weight: 800;
    line-height: 1;
    margin-bottom: -8px;
}

/* Why Maestrotek */
.cp-why-us {
    background: #fff;
    text-align: center;
}

.cp-why-us__cards {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    margin-bottom: 48px;
}

.cp-why-us__card {
    padding: 24px 20px;
    border-right: 1px solid #e2e8f0;
}

.cp-why-us__card:last-child {
    border-right: none;
}

.cp-why-us__card-icon {
    width: 72px;
    height: 72px;
    margin: 0 auto 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(23, 100, 171, .06);
}

.cp-why-us__card-icon img {
    width: 50px;
    height: 50px;
    object-fit: contain;
}

.cp-why-us__card h3 {
    font-size: 15px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: var(--navy);
    margin-bottom: 10px;
    line-height: 1.35;
}

.cp-why-us__card p {
    font-size: 14px;
    color: #64748b;
    line-height: 1.2;
    margin: 0;
}

.cp-why-us__panel {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(0, 45, 79, .08);
}

.cp-why-us__stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: #EBF2FB;
    padding: 40px 20px;
}

.cp-why-us__stat {
    padding: 0 16px;
    border-right: 1px solid #d1dde8;
}

.cp-why-us__stat:last-child {
    border-right: none;
}

.cp-why-us__stat strong {
    display: block;
    font-size: 40px;
    font-weight: 700;
    color: var(--blue);
    margin-bottom: 6px;
    line-height: 1;
}

.cp-why-us__stat span {
    display: block;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: var(--navy);
}

.cp-why-us__cta {
    background: linear-gradient(45deg, #002A55, #0052C7);
    color: #fff;
    padding: 48px 32px;
}

.cp-why-us__cta h3 {
    font-size: 1.5rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .5px;
    margin-bottom: 12px;
    color: #fff;
}

.cp-why-us__cta p {
    font-size: .95rem;
    opacity: .9;
    margin-bottom: 24px;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}

.cp-why-us__cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    color: var(--navy) !important;
    font-weight: 800;
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .4px;
    padding: 14px 28px;
    border-radius: 8px;
    transition: transform .2s ease, box-shadow .2s ease;
}

.cp-why-us__cta-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, .15);
}

/* Case Studies */
.cp-case-studies {
    background: #ffffff;
}

.cp-case-studies__header {
    margin-bottom: 40px;
    text-align: center;
}

.cp-case-studies__grid {
    display: grid;
    gap: 28px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cp-case-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 45, 79, .08);
    color: inherit;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease;
}

.cp-case-card:hover {
    box-shadow: 0 8px 28px rgba(0, 45, 79, .12);
    color: inherit;
    text-decoration: none;
    transform: translateY(-4px);
}
.cp-case-card:hover i.icon {
    color: #fff;
}
.cp-case-card__media img {
    display: block;
    height: 220px;
    object-fit: cover;
    width: 100%;
}

.cp-case-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 24px;
}

.cp-case-card__tag {
    color: var(--green);
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    margin-bottom: 12px;
    text-transform: uppercase;
}

.cp-case-card__body h3 {
    color: var(--navy);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0 0 12px;
}

.cp-case-card:hover h3,
.cp-case-card:focus h3 {
    color: var(--navy);
}

.cp-case-card__body p {
    color: #64748b;
    flex: 1;
    font-size: 15px;
    line-height: 1.3;
    margin: 0 0 20px;
}

.cp-case-card__divider{
    border-top: 1px solid #e2e8f0;
    margin: 10px 0;
    color: #e2e8f0;
}

.cp-case-card__cta {
    align-items: center;
    color: var(--navy);
    display: flex;
    font-size: 15px;
    font-weight: 700;
    justify-content: space-between;
    margin-top: auto;
    text-transform: none;
}

.cp-case-card__arrow {
    align-items: center;
    background: #f7f7f7;
    border-radius: 4px;
    color: #64748b;
    display: inline-flex;
    height: 48px;
    justify-content: center;
    transition: background .2s ease, color .2s ease;
    width: 48px;
}
.cp-case-card__arrow i.icon {
    font-size: 24px;
    transform: rotate(45deg);
    color: #707070;
}
.cp-case-card:hover .cp-case-card__arrow {
    background: var(--green);
    border-color: var(--green);
    color: #fff;
}

/* Newsletter */
.cp-newsletter {
    background: #fff;
    text-align: center;
}

.cp-newsletter__inner {
    max-width: 720px;
}

.cp-newsletter__desc {
    color: #64748b;
    font-size: 15px;
    line-height: 1.6;
    margin: 0 auto 32px;
    max-width: 620px;
}

.cp-newsletter__form {
    display: flex;
    gap: 0;
    justify-content: center;
    margin: 0 auto;
    max-width: 560px;
}

.cp-newsletter__form input {
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 6px 0 0 6px;
    border-right: 0;
    color: #1e293b;
    flex: 1;
    font-size: 15px;
    min-width: 0;
    outline: none;
    padding: 14px 18px;
}

.cp-newsletter__form input::placeholder {
    color: #94a3b8;
}

.cp-newsletter__form input:focus {
    border-color: var(--green);
    box-shadow: inset 0 0 0 1px var(--green);
}

.cp-newsletter__btn {
    background: var(--green);
    border: 0;
    border-radius: 0 6px 6px 0;
    color: #fff;
    cursor: pointer;
    font-size: 15px;
    font-weight: 600;
    padding: 14px 28px;
    transition: background .2s ease;
    white-space: nowrap;
}

.cp-newsletter__btn:hover {
    background: #68b01c;
}

.cp-newsletter__privacy {
    color: #94a3b8;
    font-size: 12px;
    margin: 14px 0 0;
}

.cp-newsletter__feedback {
    border-radius: 6px;
    font-size: 14px;
    margin: 0 0 12px;
    padding: 10px 14px;
}

.cp-newsletter__feedback.is-success {
    background: #ecfdf5;
    border: 1px solid #86efac;
    color: #166534;
}

.cp-newsletter__feedback.is-error {
    background: #fef2f2;
    border: 1px solid #fca5a5;
    color: #991b1b;
}

/* Contact CTA */
.cp-contact-cta {
    padding: 0 0 80px;
    position: relative;
    width: 100%;
    margin-bottom: -80px;
}

.cp-contact-cta__bg {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    inset: 0 0 80px;
    position: absolute;
    width: 100%;
    z-index: 0;
}

.cp-contact-cta__bg-panel {
    background: var(--green);
}

.cp-contact-cta__bg-info {
    background: #313131;
}

.cp-contact-cta__content {
    position: relative;
    z-index: 1;
}

.cp-contact-cta__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    min-height: 280px;
}

.cp-contact-cta__panel {
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 48px 56px 48px 0;
}

.cp-contact-cta__panel h2 {
    color: #fff;
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.2;
    margin: 0 0 16px;
}

.cp-contact-cta__panel p {
    font-size: 1rem;
    line-height: 1.6;
    margin: 0 0 28px;
    max-width: 480px;
    opacity: .95;
}

.cp-contact-cta__btn {
    align-self: flex-start;
    background: #111827 !important;
    border-radius: 6px;
    color: #fff !important;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 700;
    padding: 14px 24px;
    text-decoration: none;
    transition: background .2s ease, transform .2s ease;
}

.cp-contact-cta__btn:hover {
    background: #000 !important;
    color: #fff !important;
    transform: translateY(-1px);
}

.cp-contact-cta__info {
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 28px;
    justify-content: center;
    padding: 48px 0 48px 56px;
}

.cp-contact-cta__block {
    display: flex;
    gap: 16px;
}

.cp-contact-cta__accent {
    background: var(--green);
    border-radius: 2px;
    flex-shrink: 0;
    width: 4px;
}

.cp-contact-cta__block-content h3 {
    color: #fff;
    font-size: 1rem;
    font-weight: 800;
    margin: 0 0 6px;
}

.cp-contact-cta__block-content p,
.cp-contact-cta__block-content a {
    color: rgba(255, 255, 255, .88);
    font-size: .95rem;
    line-height: 1.5;
    margin: 0;
    text-decoration: none;
}

.cp-contact-cta__block-content a:hover {
    color: #fff;
    text-decoration: underline;
}

.cp-contact-cta__sub {
    margin-top: 4px !important;
    opacity: .85;
}

/* --- 5.4 Solutions (landing) --- */

/* Ecosystems */
.solutions-ecosystems {
    background: #eff3f5;
    padding: 64px 0 72px;
}

.solutions-ecosystems__header {
    margin-bottom: 40px;
    text-align: left;
}

.solutions-ecosystems__header p {
    color: #65707a;
    font-size: 18px;
    font-weight: 400;
    text-align: left;
    line-height: 1.6;
    max-width: 640px;
}

.solution-category-card__content h3 a {
    color: inherit;
    text-decoration: none;
}

.solution-category-card__content h3 a:hover {
    color: var(--green);
}

.solution-single-page picture {
    display: block;
    width: 100%;
}

.solution-single-page .sol-single-overview__media picture,
.solution-single-page .sol-single-architecture__diagram picture,
.solution-single-page .sol-single-applications__media picture {
    display: block;
    width: 100%;
}

.solution-single-page .sol-single-overview__media img,
.solution-single-page .sol-single-architecture__diagram img,
.solution-single-page .sol-single-applications__media img,
.solution-single-page .sol-single-highlights__icon img {
    display: block;
    max-width: 100%;
}

.solutions-ecosystem-list {
    display: grid;
    gap: 24px;
}

.solution-category-card__inner {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 18px rgba(15, 23, 42, .08);
    display: grid;
    grid-template-columns: minmax(200px, 32%) minmax(0, 68%);
    overflow: hidden;
}

.solution-category-card__media {
    min-height: 240px;
}

.solution-category-card__media img {
    display: block;
    height: 100%;
    min-height: 240px;
    object-fit: cover;
    width: 100%;
}

.solution-category-card__content {
    padding: 32px 40px 36px 44px;
}

.solution-category-card__content h3 {
    color: #111;
    font-size: 25px;
    font-weight: 700;
    text-align: left;
    line-height: 1.2;
    margin: 0 0 10px;
}

.solution-category-card__content > p {
    color: #65707a;
    font-size: 16px;
    font-weight: 400;
    text-align: left;
    line-height: 1.6;
    margin: 0 0 5px;
    max-width: none;
}

.solution-category-card__links-wrap {
    border-top: 1px solid #e5ebf0;
    padding-top: 20px;
}

.solution-category-card__links {
    display: grid;
    gap: 12px 28px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    list-style: none;
    margin: 0;
    padding: 0;
}

.solution-category-card__links li {
    position: relative;
}

.solution-category-card__links a {
    color: var(--blue);
    display: inline-block;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.6;
    text-align: left;
    padding-left: 20px;
    text-decoration: none;
}

.solution-category-card__links a::before {
    background: var(--blue);
    border-radius: 50%;
    content: '';
    height: 6px;
    left: 0;
    position: absolute;
    top: 7px;
    width: 6px;
}

.solution-category-card__links a:hover {
    color: #0d4f8b;
    text-decoration: underline;
}

.solutions-section-label {
    color: #7cc51f;
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    margin-bottom: 14px;
    text-transform: uppercase;
}

/* Benefits */
.solutions-benefits {
    background: #fff;
    background-size: 32px 32px;
    padding: 0 0 72px 0;
}

.solutions-benefits__grid {
    align-items: center;
    /* align-items: stretch; */
    display: grid !important;
    gap: 60px;
    grid-template-columns: 1.1fr .9fr;
}

.solutions-benefits__copy p {
    color: #65707a;
    font-size: 16px;
    font-weight: 400;
    text-align: left;
    line-height: 1.2;
    margin: 0 0 10px;
    max-width: none;
}

.solutions-benefits__list {
    list-style: none;
    margin: 28px 0 0;
    padding: 0;
}

.solutions-benefits__list li {
    align-items: flex-start;
    display: flex;
    gap: 12px;
    margin-bottom: 10px;
}

.solutions-benefits__list li:last-child {
    margin-bottom: 0;
}

.solutions-benefits__list .icon {
    color: #7cc51f;
    flex-shrink: 0;
    margin-right: 0;
    margin-top: 2px;
}

.solutions-benefits__item-copy strong {
    color: #111;
    display: block;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.6;
    /* margin-bottom: 6px; */
    text-align: left;
}

.solutions-benefits__item-copy p {
    color: #65707a;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6;
    margin: 0;
}

.solutions-benefits__media {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    position: relative;
}

.solutions-benefits__figure {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: flex-end;
    margin: 0 0 48px 0;
    min-height: 520px;
    position: relative;
}

.solutions-benefits__media-inner {
    border-radius: 10px;
    height: 380px;
    overflow: hidden;
    position: relative;
    width: 100%;
    z-index: 1;
}

.solutions-benefits__media-inner img {
    border-radius: 10px;
    display: block;
    height: 100%;
    object-fit: cover;
    object-position: bottom right;
    width: 100%;
}

.solutions-benefits__quote {
    background: #002142;
    border-left: 6px solid #7cc51f;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    bottom: -32px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .22);
    left: -36px;
    margin: 0;
    max-width: min(290px, calc(100% + 12px));
    padding: 22px 26px 22px 20px;
    position: absolute;
    z-index: 2;
}

.solutions-benefits__quote p {
    color: #fff;
    font-size: 15px;
    font-style: normal;
    line-height: 1.55;
    margin: 0;
}

.solutions-benefits__quote cite {
    color: rgba(255, 255, 255, .88);
    display: block;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    margin-top: 12px;
}

/* FAQ */
.solutions-faq {
    background: #EFF3F5;
    padding: 72px 0;
}

.solutions-faq__header {
    margin-bottom: 32px;
    text-align: center;
}

.solutions-faq__header p {
    color: #65707a;
    margin: 0 auto;
    max-width: 640px;
}

.solutions-faq__list {
    margin: 0 auto;
    max-width: 820px;
    display: grid;
    gap: 10px;
}

.solutions-faq__item {
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0 4px 18px rgba(15, 23, 42, .08);
    border-bottom: 1px solid #e5ebf0;
    padding: 24px 32px;
}

.solutions-faq__answer {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .35s ease;
}

.solutions-faq__item[open] .solutions-faq__answer {
    grid-template-rows: 1fr;
}

.solutions-faq__answer-inner {
    min-height: 0;
    overflow: hidden;
}

.solutions-faq__item summary {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-size: 16px;
    font-weight: 700;
    gap: 16px;
    justify-content: space-between;
    list-style: none;
}

.solutions-faq__item summary::-webkit-details-marker {
    display: none;
}

.solutions-faq__question {
    flex: 1;
    text-align: left;
}

.solutions-faq__toggle {
    color: #65707a;
    flex-shrink: 0;
    line-height: 1;
}

.solutions-faq__toggle .icon {
    margin: 0;
    transition: transform .35s ease;
}

.solutions-faq__item[open] .solutions-faq__toggle .icon {
    transform: rotate(180deg);
}

.solutions-faq__answer p {
    color: #65707a;
    margin: 0;
    opacity: 0;
    padding-top: 12px;
    transform: translateY(-6px);
    transition: opacity .3s ease, transform .3s ease;
}

.solutions-faq__item[open] .solutions-faq__answer p {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .1s;
}

@media (prefers-reduced-motion: reduce) {
    .solutions-faq__answer,
    .solutions-faq__answer p,
    .solutions-faq__toggle .icon {
        transition: none;
    }

    .solutions-faq__answer p {
        opacity: 1;
        transform: none;
    }
}

.solutions-cta {
    margin-top: 0;
}

/* --- 5.4 Solutions (single category page) --- */
.solution-single-page .sol-single-hero {
    position: relative;
    background: var(--page-hero-overlay-gradient),
        #0b2d4f center/cover;
    color: #fff;
    min-height: 500px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 72px 0 56px;
}

.solution-single-page .sol-single-hero.has-image {
    background:
        var(--page-hero-overlay-gradient),
        var(--sol-single-hero) center/cover;
}

.solution-single-page .sol-single-hero__content {
    padding-top: 0;
}

.solution-single-page .sol-single-hero h1 {
    color: #fff;
    font-size: 42px;
    line-height: 1.08;
    margin: 0 0 16px;
    max-width: 720px;
}

.solution-single-page .sol-single-hero p {
    color: rgba(255, 255, 255, .88);
    font-size: 17px;
    line-height: 1.45;
    margin: 0;
    max-width: 640px;
}

.solution-single-page .sol-single-overview {
    background: #fff;
}

.solution-single-page .sol-single-overview__grid {
    align-items: center;
    display: grid !important;
    gap: 48px;
    grid-template-columns: 1.05fr .75fr;
}

.solution-single-page .sol-single-overview__copy p,
.solution-single-page .sol-single-offerings__body p {
    color: #5d6872;
    font-size: 17px;
    line-height: 1.5;
    margin: 0 0 16px;
}

.solution-single-page .sol-single-overview__copy p:last-child {
    margin-bottom: 0;
}

.solution-single-page .sol-single-overview__media img {
    border-radius: 8px;
    display: block;
    height: auto;
    width: 100%;
    object-fit: cover;
}

.solution-single-page .sol-single-offerings {
    background: #f3f7fa;
    text-align: center;
}

.solution-single-page .sol-single-offerings__subtitle {
    color: #6a7580;
    font-size: 19px;
    font-weight: 600;
    margin: 0 auto 28px;
    max-width: 640px;
}

.solution-single-page .sol-single-offerings__body {
    margin: 0 auto;
    max-width: 860px;
    text-align: center;
}

.solution-single-page .sol-single-offerings__body p:last-child {
    margin-bottom: 0;
}

.solution-single-page .sol-single-highlights {
    background: #fff;
}

.solution-single-page .sol-single-highlights__grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, 1fr);
}

.solution-single-page .sol-single-highlights__card {
    background: #f4f8fb;
    border-radius: 8px;
    min-height: 210px;
    padding: 28px 24px;
}

.solution-single-page .sol-single-highlights__card:hover {
    background: linear-gradient(145deg, #0d4f8c, #1764ab);
    transition: background .1s ease;
    cursor: pointer;
}

.solution-single-page .sol-single-highlights__card:hover h3,
.solution-single-page .sol-single-highlights__card:hover p {
    color: #fff;
}

.solution-single-page .sol-single-highlights__card:hover i.icon {
    color: #fff;
}

.solution-single-page .sol-single-highlights__card.is-featured {
    background: linear-gradient(145deg, #0d4f8c, #1764ab);
    color: #fff;
}

.solution-single-page .sol-single-highlights__icon {
    margin-bottom: 16px;
}

.solution-single-page .sol-single-highlights__icon i.icon {
    color: #1764ab;
    font-size: 28px;
    margin: 0;
}

.solution-single-page .sol-single-highlights__icon img {
    display: block;
    height: 32px;
    object-fit: contain;
    width: auto;
}

.solution-single-page .sol-single-highlights__card.is-featured .sol-single-highlights__icon i.icon {
    color: #fff;
}

.solution-single-page .sol-single-highlights__card h3 {
    font-size: 18px;
    line-height: 1.25;
    margin: 0 0 10px;
}

.solution-single-page .sol-single-highlights__card.is-featured h3,
.solution-single-page .sol-single-highlights__card.is-featured p {
    color: #fff;
}

.solution-single-page .sol-single-highlights__card p {
    color: #5d6872;
    font-size: 16px;
    line-height: 1.4;
    margin: 0;
}

.solution-single-page .sol-single-features {
    background: #eef3f7;
}

.solution-single-page .sol-single-features__header {
    margin-bottom: 32px;
    text-align: center;
}

.solution-single-page .sol-single-features__header p {
    color: #6a7580;
    font-size: 16px;
    margin: 0 auto;
    max-width: 640px;
}

.solution-single-page .sol-single-features__list-wrapper li {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: #fff;
    border-radius: 6px;
    box-shadow: 0 2px 10px rgba(15, 23, 42, .08);
    padding: 20px;
}

.solution-single-page .sol-single-features__list {
    column-gap: 20px;
    columns: 2;
    list-style: none;
    margin: 0 auto;
    padding: 0;
}

.solution-single-page .sol-single-features__list li {
    break-inside: avoid;
    color: #3f4d59;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6;
    margin: 0 0 14px;
    position: relative;
}

.solution-single-page .sol-single-features__list-wrapper li i.icon {
    background-color: #1764ab;
    width: 15px;
    height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff !important;
    font-size: 8px;
}

.solution-single-page .sol-single-architecture {
    background: #fff;
    text-align: center;
}

.solution-single-page .sol-single-architecture__diagram {
    margin: 0 auto;
    max-width: 600px;
}

.solution-single-page .sol-single-architecture__diagram img {
    display: block;
    height: auto;
    margin: 0 auto;
    max-width: 100%;
    width: 100%;
}

.solution-single-page .sol-single-components {
    background: #e8f0f6;
}

.solution-single-page .sol-single-components__grid {
    display: grid;
    gap: 22px;
    grid-template-columns: repeat(3, 1fr);
}

.solution-single-page .sol-single-components__card {
    background: #fff;
    border-radius: 8px;
    border-top: 4px solid #1764ab;
    box-shadow: 0 2px 10px rgba(15, 23, 42, .08);
    padding: 28px 24px;
}

.solution-single-page .sol-single-components__card h3 {
    color: #1764ab;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 12px;
}

.solution-single-page .sol-single-components__card > p {
    color: #5d6872;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
    margin: 0 0 14px;
}

.solution-single-page .sol-single-components__link-label {
    color: #1764ab;
    display: block;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 10px;
}

.solution-single-page .sol-single-components__card ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.solution-single-page .sol-single-components__card li {
    color: #3f4d59;
    font-size: 15px;
    line-height: 1.45;
    margin-bottom: 4px;
    position: relative;
}

.solution-single-page .sol-single-components__list-wrapper li {
    display: flex;
    align-items: center;
    gap: 10px;
}

.solution-single-page .sol-single-components__list-wrapper li i.icon {
    background-color: #1764ab;
    width: 15px;
    height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff !important;
    font-size: 8px;
}

.solution-single-page .sol-single-applications {
    background: #fff;
}

.solution-single-page .sol-single-applications__header {
    margin-bottom: 36px;
    text-align: center;
}

.solution-single-page .sol-single-applications__header p {
    color: #6a7580;
    font-size: 16px;
    margin: 0 auto;
    max-width: 640px;
}

.solution-single-page .sol-single-applications__grid {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(2, 1fr);
}

.solution-single-page .sol-single-applications__card {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 3px 14px rgba(15, 23, 42, .1);
    overflow: hidden;
    cursor: pointer;
}
.solution-single-page .sol-single-applications__card:hover {
    transform: translateY(-4px);
    transition: transform .1s ease;
}

.solution-single-page .sol-single-applications__media {
    background: #dbe5ee;
    height: 300px;
    overflow: hidden;
}

.solution-single-page .sol-single-applications__media picture {
    display: block;
    height: 100%;
}

.solution-single-page .sol-single-applications__media img {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.solution-single-page .sol-single-applications__body {
    padding: 22px 24px 26px;
}

.solution-single-page .sol-single-applications__body h3 {
    color: #0f2f52;
    font-size: 21px;
    line-height: 1.25;
    margin: 0 0 8px;
}

.solution-single-page .sol-single-applications__body p {
    color: #5d6872;
    font-size: 16px;
    line-height: 1.5;
    margin: 0;
}

.solution-single-page .sol-single-cta {
    background: linear-gradient(180deg, #0b2d4f, #061a30);
    color: #fff;
    padding: 80px 0 90px;
    text-align: center;
}

.solution-single-page .sol-single-cta h2 {
    color: #fff;
    font-size: 34px;
    line-height: 1.1;
    margin: 0 0 16px;
}

.solution-single-page .sol-single-cta__desc {
    color: rgba(255, 255, 255, .84);
    font-size: 16px;
    line-height: 1.55;
    margin: 0 auto 32px;
    max-width: 720px;
}

.solution-single-page .sol-single-cta__banner {
    background: #73bd19;
    border-radius: 8px;
    margin: 0 auto;
    max-width: 860px;
    padding: 32px 28px 28px;
}

.solution-single-page .sol-single-cta__banner > p {
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0 0 22px;
}

.solution-single-page .sol-single-cta__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}

.solution-single-page .sol-single-cta__primary.ui.button {
    background: #0b2d4f !important;
    border: none !important;
    border-radius: 4px !important;
    color: #fff !important;
    font-weight: 700 !important;
    padding: 12px 22px !important;
}

.solution-single-page .sol-single-cta__secondary.ui.inverted.button {
    background: transparent !important;
    border: 2px solid #fff !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    color: #fff !important;
    font-weight: 700 !important;
    padding: 12px 22px !important;
}

/* --- 5.5 Contact --- */
.contact-page .products-hero.contact-hero {
    max-height: none;
    min-height: 350px;
    padding: 100px 0;
}

.contact-page .contact-hero > .ui.container {
    padding-top: 0;
}

.contact-page .contact-main {
    background: #f4f7fa;
    padding: 72px 0 80px;
}

.contact-page .contact-main__grid {
    align-items: start;
    display: grid !important;
    gap: 36px;
    grid-template-columns: 1.15fr .85fr;
}

.contact-page .contact-form-panel h2 {
    color: #0f2f52;
    font-size: 32px;
    line-height: 1.15;
    margin: 0 0 10px;
}

.contact-page .contact-form-panel__intro {
    color: #6a7580;
    font-size: 15px;
    line-height: 1.55;
    margin: 0 0 28px;
}

.contact-page .contact-form__row {
    display: grid;
    gap: 18px;
    grid-template-columns: 1fr 1fr;
    margin-bottom: 18px;
}

.contact-page .contact-form__field label {
    color: #334155;
    display: block;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 8px;
}

.contact-page .contact-form__field label span {
    color: #73bd19;
}

.contact-page .contact-form__field input,
.contact-page .contact-form__field select,
.contact-page .contact-form__field textarea {
    background: #fff;
    border: 1px solid #d8e0e7;
    border-radius: 4px;
    box-sizing: border-box;
    color: #1f2937;
    font-family: inherit;
    font-size: 14px;
    padding: 12px 14px;
    width: 100%;
}

.contact-page .contact-form__field input:focus,
.contact-page .contact-form__field select:focus,
.contact-page .contact-form__field textarea:focus {
    border-color: #1764ab;
    outline: none;
}

.contact-page .contact-form__field textarea {
    min-height: 130px;
    resize: vertical;
}

.contact-page .contact-form__field--full {
    margin-bottom: 22px;
}

.contact-page .contact-form__submit.ui.button {
    background: #73bd19 !important;
    border-radius: 4px !important;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    margin-top: 4px !important;
    padding: 14px 18px !important;
}

.contact-page .contact-form__note {
    color: #8a949e;
    font-size: 12px;
    margin: 14px 0 0;
    text-align: center;
}

.contact-page .contact-info-panel {
    display: grid;
    gap: 16px;
}

.contact-page .contact-info-card {
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 2px 12px rgba(15, 23, 42, .08);
    display: flex;
    overflow: hidden;
}

.contact-page .contact-info-card__body {
    padding: 22px 24px;
    width: 100%;
}

.contact-page .contact-info-card h3 {
    color: #0f2f52;
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 10px;
    border-left: 3px solid #7cc51f;
    padding-left: 10px;
}

.contact-page .contact-info-card__value {
    color: #1764ab;
    display: block;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.45;
    text-decoration: none;
    padding-left: 10px;
}

.contact-page .contact-info-card__value:hover {
    color: #0d4f8c;
}

.contact-page .contact-info-card__meta {
    color: #6a7580;
    font-size: 13px;
    line-height: 1.45;
    margin: 8px 0 0;
    padding-left: 10px;
    font-weight: 400;
}

.contact-page .contact-info-card--visit .contact-info-card__value {
    color: #4e5963;
    font-weight: 400;
}

.contact-page .contact-info-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-left: 10px;
}

.contact-page .contact-info-card__tags span {
    background: #eef8e0;
    /* border: 1px solid #84C325; */
    border-radius: 5px;
    color: #3f5f12;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 12px;
}

.contact-page .contact-map iframe {
    display: block;
    width: 100%;
}

/* --- 5.6 E-waste --- */
.ewaste-page .products-hero.ewaste-hero {
    min-height: 500px;
    padding: 100px 0 60px;
}

.ewaste-page .ewaste-hero > .ui.container {
    position: relative;
    z-index: 2;
}

.ewaste-content {
    padding: 48px 0 72px;
}

.ewaste-intro {
    margin: 0 auto 36px;
}

.ewaste-intro p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    color: #444;
    margin: 0;
}

.ewaste-table-wrap {
    margin-bottom: 48px;
}

.ewaste-table {
    min-width: 720px;
}

.ewaste-guidelines {
    margin-top: 16px;
    padding: 56px 0 64px;
    background: linear-gradient(180deg, #f4f8fb 0%, #eef3f8 100%);
    border-radius: 16px;
    position: relative;
    overflow: hidden;
}

.ewaste-guidelines::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--green) 0%, var(--blue) 50%, #e05252 100%);
}

.ewaste-guidelines__header {
    text-align: center;
    max-width: 640px;
    margin: 0 auto 40px;
    padding: 0 24px;
}

.ewaste-guidelines__header p {
    font-size: 16px;
    line-height: 1.6;
    color: var(--muted);
    margin: 0;
}

.ewaste-guidelines__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px;
    padding: 0 24px;
    max-width: 1100px;
    margin: 0 auto;
}

.ewaste-guidelines__card {
    background: #fff;
    border-radius: 12px;
    padding: 28px 28px 24px;
    box-shadow: 0 4px 24px rgba(0, 45, 79, 0.08);
    border: 1px solid rgba(0, 45, 79, 0.06);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.ewaste-guidelines__card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(0, 45, 79, 0.12);
}

.ewaste-guidelines__card--dos {
    border-top: 4px solid var(--green);
}

.ewaste-guidelines__card--donts {
    border-top: 4px solid #e05252;
}

.ewaste-guidelines__card-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 22px;
    padding-bottom: 18px;
    border-bottom: 1px solid #edf2f6;
}

.ewaste-guidelines__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    flex-shrink: 0;
}

.ewaste-guidelines__badge .icon {
    font-size: 26px;
    margin: 0;
    line-height: 1;
}

.ewaste-guidelines__card--dos .ewaste-guidelines__badge {
    background: rgba(120, 198, 32, 0.14);
    color: #5a9a12;
}

.ewaste-guidelines__card--donts .ewaste-guidelines__badge {
    background: rgba(224, 82, 82, 0.12);
    color: #c0392b;
}

.ewaste-guidelines__card-head h3 {
    font-size: 22px;
    font-weight: 700;
    color: var(--navy);
    margin: 0;
    letter-spacing: -0.01em;
}

.ewaste-guidelines__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ewaste-guidelines__list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
    line-height: 1.65;
    color: #3d4650;
    font-size: 15px;
}

.ewaste-guidelines__list li:last-child {
    margin-bottom: 0;
}

.ewaste-guidelines__marker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 2px;
}

.ewaste-guidelines__marker .icon {
    font-size: 11px;
    margin: 0;
    line-height: 1;
}

.ewaste-guidelines__card--dos .ewaste-guidelines__marker {
    background: rgba(120, 198, 32, 0.18);
    color: #5a9a12;
}

.ewaste-guidelines__card--donts .ewaste-guidelines__marker {
    background: rgba(224, 82, 82, 0.14);
    color: #c0392b;
}

.ewaste-admin-table-wrap {
    overflow-x: auto;
    margin-bottom: 16px;
}

.ewaste-admin-table input[type="text"],
.ewaste-admin-table input[type="number"],
.ewaste-admin-table textarea {
    width: 100%;
    min-width: 100px;
    font-size: 13px;
    padding: 6px 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.ewaste-admin-table textarea {
    min-height: 52px;
    resize: vertical;
}

/* --- 5.7 News & Events (listing) --- */
.news-events-page .products-hero.ne-hero {
    min-height: 500px;
    padding: 100px 0 60px;
}

.news-events-page .ne-hero--compact {
    min-height: 280px;
    padding: 90px 0 48px;
}

.news-events-page .ne-hero--detail {
    min-height: 300px;
}

/* --- 5.7 News & Events (event detail) --- */
.event-detail-page .ne-event-detail-hero {
    min-height: 420px;
    max-height: 420px;
    padding: 0;
}

.event-detail-page .ne-event-detail-hero > .ui.container {
    padding-bottom: 48px;
    padding-top: 100px;
}

.event-detail-page .ne-event-story {
    background: #F5F8FA;
    padding: 72px 0 80px;
}

.event-detail-page .ne-event-story__grid {
    align-items: center;
    gap: 48px;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
}

.event-detail-page .ne-event-story__text .ne-section__eyebrow {
    font-size: 14px;
    margin-bottom: 14px;
}

.event-detail-page .ne-event-story__text h2 {
    color: var(--navy);
    font-size: 36px;
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 24px;
    max-width: 520px;
}

.event-detail-page .ne-highlight {
    color: var(--green);
    display: inline;
}

.event-detail-page .ne-event-story__text p {
    color: #4a5563;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.3;
    margin-bottom: 18px;
    max-width: 560px;
}

.event-detail-page .ne-event-stats {
    gap: 20px;
    margin-top: 32px;
}

.event-detail-page .ne-event-stat {
    background: #DEE5ED;
    border-left: 5px solid var(--green);
    border-radius: 0;
    box-shadow: none;
    flex: 1;
    min-width: 0;
    padding: 18px 22px;
}

.event-detail-page .ne-event-stat strong {
    color: var(--navy);
    font-size: 25px;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 6px;
}

.event-detail-page .ne-event-stat span {
    color: #5f6871;
    font-size: 14px;
    line-height: 1.4;
}

.event-detail-page .ne-event-story__media img {
    border-radius: 14px;
    box-shadow: 0 16px 40px rgba(0, 45, 79, 0.14);
    display: block;
    width: 100%;
}

.event-detail-page .ne-event-gallery {
    background: #fff;
    padding: 56px 56px;
}

.event-detail-page .ne-event-gallery .ne-section__head {
    margin-bottom: 40px;
}

.event-detail-page .ne-event-gallery .ne-section__head h2 {
    font-size: 36px;
}

.ne-gallery-showcase {
    max-width: 80%;
    align-items: start;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 2.55fr) minmax(0, .4fr);
    margin: 0 auto;
}

.ne-gallery-showcase__main {
    background: #eef2f6;
    border-radius: 12px;
    height: 420px;
    overflow: hidden;
    position: relative;
}

.ne-gallery-showcase__main img {
    display: block;
    height: 420px;
    object-fit: cover;
    transition: opacity .35s ease;
    width: 100%;
}

.ne-gallery-showcase__main img.is-fading {
    opacity: 0;
}

.ne-gallery-showcase__thumbs {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 420px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: #b8c2ce transparent;
    scrollbar-width: thin;
}

.ne-gallery-showcase__thumbs::-webkit-scrollbar {
    width: 6px;
}

.ne-gallery-showcase__thumbs::-webkit-scrollbar-thumb {
    background: #b8c2ce;
    border-radius: 999px;
}

.ne-gallery-thumb {
    background: none;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    flex: 0 0 72px;
    height: 72px;
    min-height: 72px;
    overflow: hidden;
    padding: 0;
    position: relative;
    width: 100%;
}

.ne-gallery-thumb img {
    display: block;
    height: 72px;
    object-fit: cover;
    transition: opacity .2s ease;
    width: 100%;
}

.ne-gallery-thumb__overlay {
    align-items: center;
    background: rgba(120, 198, 32, 0.82);
    color: #fff;
    display: none;
    inset: 0;
    justify-content: center;
    position: absolute;
}

.ne-gallery-thumb__overlay .icon {
    font-size: 22px;
    margin: 0;
}

.ne-gallery-thumb.is-active .ne-gallery-thumb__overlay {
    display: flex;
}

.ne-gallery-thumb:not(.is-active):hover img {
    opacity: 0.88;
}

.ne-event-detail-back {
    padding: 50px 0 50px;
    text-align: center;
    background-color: #F5F8FA;
}

.ne-event-detail-back .ne-outline-btn {
    background: #fff;
}

.ne-event-detail-back .ne-outline-btn:hover {
    background: var(--navy);
    color: #fff;
}

/* --- 5.7 News & Events (upcoming event detail) --- */
.ne-event-upcoming-detail {
    background: #fff;
    padding: 64px 0 72px;
}

.ne-event-upcoming-detail__content {
    margin: 0 auto;
    max-width: 820px;
}

.ne-event-upcoming-detail__title {
    color: var(--navy);
    font-size: 32px;
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 20px;
}

.ne-event-upcoming-detail__desc {
    color: #4a5563;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.5;
    margin: 0 0 40px;
    text-align: left;
}

.ne-event-upcoming-detail__info h2 {
    color: var(--navy);
    font-size: 28px;
    font-weight: 700;
    margin: 0 0 24px;
}

.ne-event-upcoming-detail__list {
    margin: 0;
}

.ne-event-upcoming-detail__row {
    border-bottom: 1px solid #e8edf2;
    display: grid;
    gap: 8px 24px;
    grid-template-columns: 120px minmax(0, 1fr);
    padding: 16px 0;
}

.ne-event-upcoming-detail__row:first-child {
    border-top: 1px solid #e8edf2;
}

.ne-event-upcoming-detail__row dt {
    color: var(--navy);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin: 0;
    text-transform: uppercase;
}

.ne-event-upcoming-detail__row dd {
    color: #4a5563;
    font-size: 16px;
    line-height: 1.6;
    margin: 0;
}

.ne-event-upcoming-detail__row:last-child dt,
.ne-event-upcoming-detail__row:last-child dd {
    color: var(--green);
    font-weight: 700;
}

.ne-event-upcoming-detail__row:last-child dd {
    font-size: 18px;
    text-transform: uppercase;
}

.ne-event-upcoming-detail__cta {
    margin-top: 36px;
}

.ne-section {
    padding: 64px 0;
}

.ne-section--1 {
    background: #fff;
}

.ne-section--2 {
    background: #f7fafc;
}

.ne-section__head {
    margin-bottom: 36px;
}

.ne-section__head--center {
    text-align: center;
}

.ne-section__head p {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.65;
    margin: 0;
    max-width: 720px;
}

.ne-section__head--center p {
    margin-left: auto;
    margin-right: auto;
}

.ne-section__action {
    margin-top: 36px;
    text-align: center;
}

.ne-empty {
    align-items: center;
    background: #fff;
    border: 1px dashed #d8dee6;
    border-radius: 12px;
    color: var(--muted);
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    min-height: 180px;
    padding: 32px;
    text-align: center;
}

.ne-empty .icon {
    color: #b8c2cc;
    font-size: 42px;
    margin: 0;
}

.ne-news-grid {
    display: grid;
    gap: 28px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ne-news-card {
    background: #fff;
    border: 1px solid #e8edf2;
    border-radius: 12px;
    box-shadow: 0 4px 18px rgba(0, 45, 79, 0.06);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease;
    align-items: flex-start;
}

.ne-news-card:hover {
    box-shadow: 0 10px 28px rgba(0, 45, 79, 0.1);
    transform: translateY(-3px);
}

.ne-news-card__media {
    aspect-ratio: 16 / 10;
    background: #eef2f6;
    display: block;
    overflow: hidden;
}

.ne-news-card__media img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.ne-news-card__placeholder {
    align-items: center;
    color: #b8c2cc;
    display: flex;
    height: 100%;
    justify-content: center;
}

.ne-news-card__placeholder .icon {
    font-size: 48px;
    margin: 0;
}

.ne-news-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 22px 22px 24px;
}

.ne-news-card__date {
    color: var(--green);
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 10px;
}

.ne-news-card__body h3 {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0 0 10px;
}

.ne-news-card__body h3 a {
    color: var(--navy);
    text-decoration: none;
}

.ne-news-card__body h3 a:hover {
    color: var(--blue);
}

.ne-news-card__body p {
    color: var(--muted);
    flex: 1;
    font-size: 14px;
    line-height: 1.65;
    margin: 0 0 16px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ne-card-link {
    align-items: center;
    color: var(--navy);
    display: inline-flex;
    font-size: 14px;
    font-weight: 600;
    gap: 6px;
    text-decoration: none;
}

.ne-card-link--green {
    color: var(--green);
}

.ne-card-link:hover {
    opacity: .85;
}

.ne-outline-btn {
    align-items: center;
    border: 2px solid var(--navy);
    border-radius: 6px;
    color: var(--navy);
    display: inline-flex;
    font-size: 15px;
    font-weight: 700;
    gap: 8px;
    padding: 12px 24px;
    text-decoration: none;
    transition: background .2s ease, color .2s ease;
}

.ne-outline-btn:hover {
    background: var(--navy);
    color: #fff;
}

.ne-events-grid, .ne-events-list {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ne-event-card {
    background: #fff;
    border: 1px solid #e8edf2;
    border-radius: 12px;
    box-shadow: 0 4px 18px rgba(0, 45, 79, 0.06);
    display: grid;
    gap: 0;
    grid-template-columns: 150px minmax(0, 1fr);
    overflow: hidden;
    transition: box-shadow .25s ease, transform .25s ease;
    align-items: flex-start;
}

a.ne-event-card {
    color: inherit;
    cursor: pointer;
    text-decoration: none;
}

a.ne-event-card:hover .ne-card-link--green {
    opacity: .85;
}

.ne-event-card:hover {
    box-shadow: 0 10px 28px rgba(0, 45, 79, 0.1);
    transform: translateY(-2px);
}

.ne-event-card.is-live {
    border: 1px solid #e8edf2;
    box-shadow: 0 4px 18px rgba(0, 45, 79, 0.06);
}

.ne-event-card__date {
    width: 100%;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 20px 20px;
    position: relative;
    text-align: center;
}

.ne-event-card__date-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.ne-event-card__date-inner .ne-live-badge {
    margin-bottom: 10px;
}

.ne-event-card--upcoming .ne-event-card__date .ne-event-card__date-inner{
    width: 100%;
    padding: 20px 14px;
    background: #E6F3D3;
    color: #3d6e0f;
    border-radius: 10px;
}

.ne-event-card--completed .ne-event-card__date .ne-event-card__date-inner{
    width: 100%;
    padding: 20px 14px;
    background: #D9DFE5;
    color: #5f6871;
    border-radius: 10px;
}

.ne-event-card__done-icon {
    color: var(--green) !important;
    font-size: 18px !important;
    left: 10px;
    margin: 0 !important;
    position: absolute;
    top: 10px;
}

.ne-event-card__month {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.2;
}

.ne-event-card__days {
    font-size: 27px;
    font-weight: 900;
    line-height: 1.1;
    margin: 4px 0;
}

.ne-event-card__year {
    font-size: 14px;
    font-weight: 700;
}

.ne-event-card__body {
    padding: 24px 28px 24px 0;
}

.ne-event-card__location {
    align-items: center;
    color: var(--muted);
    display: flex;
    font-size: 12px;
    font-weight: 600;
    gap: 6px;
    letter-spacing: 0.04em;
    margin: 0 0 10px;
    text-transform: uppercase;
}

.ne-event-card__location .icon {
    color: #e05252;
    margin: 0;
}

.ne-event-card__body h3 {
    color: var(--navy);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 10px;
}

.ne-event-card__body p {
    color: var(--muted);
    font-size: 15px;
    line-height: 1.3;
    margin: 0 0 10px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ne-live-badge {
    align-items: center;
    background: #fff;
    border: 1px solid rgba(224, 82, 82, 0.35);
    border-radius: 999px;
    color: #c0392b;
    display: inline-flex;
    font-size: 11px;
    font-weight: 800;
    gap: 6px;
    letter-spacing: 0.08em;
    margin-bottom: 8px;
    padding: 4px 10px;
    position: absolute;
    top: 4px;
}

.ne-live-badge--hero {
    align-items: center;
    background: #ffffff;
    border: 1px solid rgba(224, 82, 82, 0.35);
    border-radius: 999px;
    color: #c0392b;
    display: inline-flex;
    font-size: 11px;
    font-weight: 800;
    gap: 6px;
    letter-spacing: 0.08em;
    margin-bottom: 8px;
    padding: 4px 10px;
    position: relative;
}

.ne-live-dot {
    animation: ne-live-blink 1.2s ease-in-out infinite;
    background: #e05252;
    border-radius: 50%;
    display: inline-block;
    height: 8px;
    width: 8px;
}

@keyframes ne-live-blink {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: .35; transform: scale(.85); }
}

.ne-cta {
    background: var(--green);
    margin-top: 0;
    padding: 56px 0;
}

.ne-cta__inner {
    color: #fff;
    margin: 0 auto;
    max-width: 760px;
    text-align: center;
}

.ne-cta__inner h2 {
    color: #fff;
    font-size: 34px;
    font-weight: 800;
    margin: 0 0 14px;
}

.ne-cta__inner p {
    font-size: 16px;
    line-height: 1.65;
    margin: 0 auto 28px;
    max-width: 620px;
    opacity: .95;
}

.ne-cta__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: center;
}

.ne-cta__btn {
    align-items: center;
    border-radius: 6px;
    display: inline-flex;
    font-size: 15px;
    font-weight: 700;
    gap: 8px;
    padding: 14px 24px;
    text-decoration: none;
    transition: transform .2s ease, background .2s ease;
}

.ne-cta__btn--dark {
    background: #111827;
    color: #fff;
}

.ne-cta__btn--outline {
    border: 2px solid #fff;
    color: #fff;
}

.ne-cta__btn:hover {
    transform: translateY(-2px);
}

.ne-detail-content {
    padding: 56px 0;
}

.ne-article {
    margin: 0 auto;
    max-width: 820px;
}

.ne-article__lead {
    color: var(--navy);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.65;
    margin-bottom: 24px;
}

.ne-article p,
.ne-detail-content p {
    color: #3d4650;
    font-size: 16px;
    line-height: 1.75;
    margin-bottom: 18px;
}

.ne-detail-meta {
    color: rgba(255, 255, 255, 0.9);
    font-size: 15px;
    margin-top: 12px;
}

.ne-back-link {
    margin-top: 32px;
}

.ne-back-link--center {
    text-align: center;
}

.ne-back-link a {
    align-items: center;
    color: var(--blue);
    display: inline-flex;
    font-weight: 700;
    gap: 8px;
    text-decoration: none;
}

.ne-event-story {
    padding: 64px 0;
}

.ne-event-story__grid {
    align-items: center;
    display: grid;
    gap: 40px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.ne-event-story__text h2 {
    color: var(--navy);
    font-size: 32px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0 0 20px;
}

.ne-highlight {
    color: var(--green);
    display: inline;
}

.ne-event-story__text p {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.75;
    margin-bottom: 16px;
}

.ne-event-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 28px;
}

.ne-event-stat {
    background: #fff;
    border-left: 4px solid var(--green);
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 45, 79, 0.08);
    min-width: 180px;
    padding: 16px 20px;
}

.ne-event-stat strong {
    color: var(--navy);
    display: block;
    font-size: 24px;
    font-weight: 800;
    margin-bottom: 4px;
}

.ne-event-stat span {
    color: var(--muted);
    font-size: 14px;
}

.ne-event-story__media img {
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0, 45, 79, 0.12);
    width: 100%;
}

/* --- 5.8 Careers --- */
.careers-page .careers-hero {
    min-height: 500px;
}

.careers-page .careers-hero__content h1 {
    font-size: clamp(28px, 4vw, 42px);
    max-width: 900px;
    line-height: 1.25;
}

.careers-page .careers-hero__subtitle {
    font-size: 18px;
    font-weight: 500;
    max-width: 760px;
    opacity: 0.95;
}

.careers-intro {
    padding: 56px 0 56px;
}

.careers-intro h2 {
    font-size: 32px;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 18px;
    text-align: center;
}

.careers-intro p {
    font-size: 17px;
    font-weight: 400;
    line-height: 1.5;
    color: #475569;
    max-width: 980px;
    margin: 0 auto;
    text-align: center;
}

.careers-section-head {
    text-align: center;
    margin-bottom: 36px;
}

.careers-section-head h2 {
    font-size: clamp(26px, 3vw, 30px);
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.careers-reasons {
    padding: 48px 0 64px;
    background: #f8fafc;
}

.careers-reasons__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}

.careers-reason-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 32px 28px;
    text-align: center;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.careers-reason-card__icon {
    width: 190px;
    height: 190px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(0, 102, 204, 0.08);
    color: #0066cc;
}

.careers-reason-card__icon img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

.careers-reason-card h3 {
    font-size: 20px;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 12px;
}

.careers-reason-card p {
    font-size: 15px;
    line-height: 1.7;
    color: #64748b;
    margin: 0;
}

.careers-jobs {
    padding: 64px 0 88px;
}

.careers-jobs__empty {
    text-align: center;
    padding: 48px 24px;
    border: 1px dashed #cbd5e1;
    border-radius: 16px;
    color: #64748b;
}

.careers-jobs__empty .icon {
    font-size: 42px;
    color: #94a3b8;
    margin-bottom: 12px;
}

.careers-jobs__list {
    display: grid;
    gap: 16px;
    max-width: 980px;
    margin: 0 auto;
}

.careers-job-card {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.04);
    overflow: hidden;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.careers-job-card.is-open {
    border-color: #bfdbfe;
    box-shadow: 0 10px 28px rgba(37, 99, 235, 0.1);
}

.careers-job-card__toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 14px 18px;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.careers-job-card__toggle:hover {
    background: #f8fafc;
}

.careers-job-card__summary {
    min-width: 0;
    flex: 1;
}

.careers-job-card h3 {
    font-size: 22px;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 10px;
}

.careers-job-card__summary-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.careers-job-card__chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 6px;
    border-radius: 3px;
    background: #f1f5f9;
    font-size: 13px;
    font-weight: 500;
    color: #475569;
}

.careers-job-card__chip .icon {
    margin: 0;
    color: #0066cc;
    font-size: 13px;
}

.careers-job-card__chevron {
    flex-shrink: 0;
    color: #64748b;
    transition: transform 0.2s ease;
}

.careers-job-card.is-open .careers-job-card__chevron {
    transform: rotate(180deg);
}

.careers-job-card.is-open .careers-job-card__toggle {
    background: linear-gradient(180deg, #f8fbff 0%, #fff 100%);
}

.careers-job-card__details {
    padding: 0;
    border-top: 1px solid #e8eef5;
    background: linear-gradient(180deg, #f8fafc 0%, #fff 28%);
}

.careers-job-detail {
    padding: 28px;
}

.careers-job-detail__intro {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 20px 22px;
    margin-bottom: 24px;
    border-radius: 8px;
    background: linear-gradient(135deg, #eff6ff 0%, #f8fafc 100%);
    border: 1px solid #dbeafe;
    border-left: 4px solid #0066cc;
}

.careers-job-detail__intro-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #fff;
    color: #0066cc;
    box-shadow: 0 4px 12px rgba(0, 102, 204, 0.12);
}

.careers-job-detail__intro-icon .icon {
    margin: 0;
    font-size: 18px;
}

.careers-job-detail__intro p {
    margin: 0;
    font-size: 15px;
    line-height: 1.85;
    color: #334155;
}

.careers-job-detail__specs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 24px;
}

.careers-job-detail__spec {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 16px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.03);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.careers-job-card.is-open .careers-job-detail__spec:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06);
}

.careers-job-detail__spec-icon {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #f1f5f9;
    color: #0066cc;
}

.careers-job-detail__spec-icon .icon {
    margin: 0;
    font-size: 16px;
}

.careers-job-detail__spec-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #94a3b8;
}

.careers-job-detail__spec-value {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.45;
    color: #0f172a;
}

.careers-job-detail__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(260px, 0.85fr);
    gap: 20px;
    align-items: start;
}

.careers-job-detail__layout--full {
    grid-template-columns: 1fr;
}

.careers-job-detail__main {
    display: grid;
    gap: 16px;
}

.careers-job-detail__panel {
    padding: 22px 22px 18px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #e2e8f0;
}

.careers-job-detail__panel--responsibilities {
    border-top: 3px solid #0066cc;
}

.careers-job-detail__panel--requirements {
    border-top: 3px solid #f59e0b;
}

.careers-job-detail__panel-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.careers-job-detail__panel-badge {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    flex-shrink: 0;
}

.careers-job-detail__panel-badge .icon {
    margin: 0;
    font-size: 17px;
}

.careers-job-detail__panel-badge--blue {
    background: #eff6ff;
    color: #0066cc;
}

.careers-job-detail__panel-badge--amber {
    background: #fffbeb;
    color: #d97706;
}

.careers-job-detail__panel h4 {
    font-size: 17px;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.careers-job-detail__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
}

.careers-job-detail__list li {
    position: relative;
    padding-left: 28px;
    font-size: 14px;
    line-height: 1.65;
    color: #475569;
}

.careers-job-detail__list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.45em;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #eff6ff;
    border: 2px solid #0066cc;
}

.careers-job-detail__panel--requirements .careers-job-detail__list li::before {
    background: #fffbeb;
    border-color: #f59e0b;
}

.careers-job-detail__sidebar {
    position: sticky;
    top: 24px;
}

.careers-job-detail__benefits {
    padding: 24px;
    border-radius: 16px;
    background: linear-gradient(160deg, #0f172a 0%, #1e3a5f 55%, #0f172a 100%);
    color: #fff;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
}

.careers-job-detail__benefits-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.careers-job-detail__benefits-icon {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(115, 189, 25, 0.18);
    color: #9ae635;
}

.careers-job-detail__benefits-icon .icon {
    margin: 0;
    font-size: 18px;
}

.careers-job-detail__benefits h4 {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    margin: 0;
}

.careers-job-detail__benefits-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 12px;
}

.careers-job-detail__benefits-list li {
    position: relative;
    padding-left: 26px;
    font-size: 14px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.88);
}

.careers-job-detail__benefits-list li::before {
    content: '✓';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #73bd19;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
}

.careers-job-detail__cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 24px;
    padding: 20px 24px;
    border-radius: 8px;
    background: linear-gradient(90deg, #0066cc 0%, #004d99 100%);
}

.careers-job-detail__cta-copy {
    display: flex;
    flex-direction: column;
    gap: 4px;
    color: #fff;
}

.careers-job-detail__cta-copy strong {
    font-size: 17px;
    font-weight: 700;
}

.careers-job-detail__cta-copy span {
    font-size: 14px;
    opacity: 0.9;
}

.careers-job-detail__cta .button {
    flex-shrink: 0;
    background: #fff !important;
    color: #0066cc !important;
    font-weight: 700;
    border-radius: 8px !important;
    padding: 12px 22px !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
}

.careers-job-detail__cta .button .icon {
    margin: 0 0 0 6px !important;
}

.careers-modal {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.careers-modal.is-open {
    display: flex;
}

body.careers-modal-open {
    overflow: hidden;
}

.careers-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
}

.careers-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(560px, 100%);
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    background: #fff;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.2);
}

.careers-modal__close {
    position: absolute;
    top: 12px;
    right: 16px;
    border: 0;
    background: transparent;
    font-size: 28px;
    line-height: 1;
    color: #64748b;
    cursor: pointer;
}

.careers-modal__dialog h2 {
    font-size: 24px;
    margin: 0 0 12px;
    padding-right: 32px;
}

.careers-modal__intro,
.careers-modal__post-label {
    font-size: 14px;
    color: #64748b;
    margin: 0 0 8px;
}

.careers-modal__post-title {
    font-size: 18px;
    font-weight: 700;
    color: #0066cc;
    margin: 0 0 20px;
}

.careers-apply-form__hint {
    font-size: 12px;
    color: #94a3b8;
    margin-top: 6px;
}

.careers-apply-form__feedback {
    border-radius: 6px;
    font-size: 14px;
    margin-bottom: 14px;
    padding: 10px 14px;
}

.careers-apply-form__feedback.is-success {
    background: #ecfdf5;
    border: 1px solid #86efac;
    color: #166534;
}

.careers-apply-form__feedback.is-error {
    background: #fef2f2;
    border: 1px solid #fca5a5;
    color: #991b1b;
}

.careers-apply-form__notice {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 12px 14px;
    margin: 16px 0;
    border-radius: 10px;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 13px;
    line-height: 1.5;
}

.careers-apply-form__notice .icon {
    margin-top: 2px;
}

.careers-apply-form__actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 8px;
}

@keyframes form-loading-spin {
    to {
        transform: rotate(360deg);
    }
}

.form-loading-spinner {
    display: inline-block;
    width: 1em;
    height: 1em;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: form-loading-spin 0.65s linear infinite;
    vertical-align: -0.125em;
    flex-shrink: 0;
}

.form-feedback--loading {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
}

.careers-apply-form__feedback.form-feedback--loading,
.cp-newsletter__feedback.form-feedback--loading {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    color: #475569;
}

.recaptcha-disclaimer {
    color: #64748b;
    font-size: 11px;
    text-align: center;
    line-height: 1.45;
    margin: 12px auto 0;
}

.recaptcha-disclaimer a {
    color: #475569;
    text-decoration: underline;
}

.contact-form .recaptcha-disclaimer {
    margin-top: 14px;
    text-align: center;
}

.cp-newsletter .recaptcha-disclaimer {
    margin-top: 10px;
    max-width: 420px;
}

.careers-modal .recaptcha-disclaimer {
    margin-top: 10px;
}

.ui.button.is-loading,
.contact-form__submit.is-loading,
.cp-newsletter__btn.is-loading {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    pointer-events: none;
    opacity: 0.9;
}

/* --- 5.9 Search results --- */

.search-page .search-page-hero {
    padding: 40px 0 40px;
}

.search-page-form {
    margin: 0 auto;
    max-width: 730px;
}

.search-page-form__field {
    align-items: center;
    background: #fff;
    border: 1px solid #9a9a9a;
    border-radius: 5px;
    display: flex;
    gap: 12px;
    padding: 14px 18px;
}

.search-page-form__field .icon {
    color: #9a9a9a;
    font-size: 18px;
    margin: 0;
}

.search-page-form__field input {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #1a202c;
    flex: 1;
    font-size: 18px !important;
    font-weight: 600;
    padding: 0 !important;
}

.search-page-form__field input:focus-visible{
    outline: none !important;
}

.search-page-summary {
    color: #4a5568;
    font-size: 15px;
    margin: 18px auto 0;
    max-width: 730px;
    text-align: left;
}

.search-page-summary strong {
    color: #1a202c;
    font-weight: 600;
}

.search-page-summary--hint {
    color: #718096;
}

.search-page-empty {
    padding: 20px 0 80px;
}

.search-page-results{
    background-color: #F5F8FA;
    padding: 20px 0 40px;
}

.search-layout-wrapper {
    display: grid !important;
    gap: 30px;
    grid-template-columns: 280px 1fr;
    margin-top: 28px !important;
    padding-bottom: 80px;
}

.search-filters-bar {
    display: none;
    margin-bottom: 24px;
}

.search-filters-bar.catalog-top-bar {
    border-bottom: 0;
    margin-bottom: 24px;
    padding-bottom: 0;
}

.search-main-content {
    min-width: 0;
}

.search-section {
    margin-bottom: 60px;
}

.search-section__header {
    align-items: baseline;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    margin-bottom: 8px;
}

.search-section__subtitle {
    color: #646464;
    font-size: 16px;
    margin: 0 0 24px;
}

.search-section__action {
    color: #0050ac;
    font-size: 16px;
    font-weight: 600;
    white-space: nowrap;
}

.search-section__action:hover {
    color: #003d85;
}

.search-recommended-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.search-recommended-card {
    background: rgba(201, 230, 255, 0.35);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    min-height: 225px;
    padding: 20px 20px;
    position: relative;
}

.search-recommended-card h3,
.search-category-feature-card__body h3, 
.search-knowledge-card h3 {
    color: #0050ac;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 14px;
}

.search-recommended-card p, 
.search-category-feature-card__body p, 
.search-knowledge-card p {
    color: #646464;
    flex: 1;
    font-size: 14px;
    line-height: 1.45;
    margin: 0 0 18px;
}

.search-recommended-card__link {
    color: #0050ac;
    font-size: 16px;
    font-weight: 600;
}

.search-recommended-card__link:hover {
    color: #003d85;
}

.search-highlight,
mark.search-highlight {
    background: transparent;
    color: var(--green);
    font-weight: 700;
    padding: 0;
}

.search-product-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.search-category-feature-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.search-category-feature-card {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.08);
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 180px;
    overflow: hidden;
}

.search-category-feature-card__media,
.search-category-feature-card__body {
    min-width: 0;
}

.search-category-feature-card__media {
    align-self: stretch;
    background: #f7fafc;
    display: flex;
    min-height: 100%;
    overflow: hidden;
    padding: 0;
}

.search-category-feature-card__media picture {
    display: block;
    height: 100%;
    width: 100%;
}

.search-category-feature-card__media img {
    display: block;
    height: 100%;
    max-height: none;
    max-width: none;
    object-fit: cover;
    object-position: right bottom;
    right: 10px;
    width: 100%;
}

.search-category-feature-card__placeholder {
    align-items: center;
    color: #cbd5e0;
    display: flex;
    font-size: 64px;
    height: 100%;
    justify-content: center;
    min-height: 342px;
    width: 100%;
}

.search-category-feature-card__body {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    padding: 20px 25px;
}
 
.search-category-feature-card__body p {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    line-height: 1.5;
    margin: 0 0 20px;
    max-height: 3em;
    max-width: 100%;
    min-height: 0;
    overflow: hidden;
    word-break: break-word;
}

.search-category-feature-card__body p .search-highlight {
    display: inline;
}

.search-category-feature-card__link {
    color: #020a17;
    font-size: 14px;
    font-weight: 600;
}

.search-category-feature-card__link:hover {
    color: #0050ac;
}

.search-knowledge-panel {
    background: #eaedef;
    border-radius: 10px;
    margin-top: 12px;
    padding: 25px;
}

.search-knowledge-panel .search-section__title {
    margin-bottom: 24px;
}

.search-knowledge-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.search-knowledge-card {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    display: flex;
    flex-direction: column;
    min-height: 245px;
    padding: 28px 24px 24px;
}

.search-knowledge-card__link {
    border-top: 2px solid #8d8d8d;
    color: #020a17;
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    padding-top: 14px;
    width: fit-content;
}

.search-knowledge-card__link:hover {
    color: #0050ac;
}

/* ==========================================================================
   6. Admin
   ========================================================================== */
.admin-login {
    align-items: center;
    background: #eef3f6;
    display: flex;
    min-height: 100vh;
    justify-content: center;
}

.login-panel {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 8px 28px rgba(15, 23, 42, .14);
    max-width: 420px;
    padding: 36px;
    width: calc(100% - 32px);
}

.login-panel h1 {
    font-size: 28px;
    margin: 28px 0;
}

.admin-shell {
    background: #eef3f6;
    min-height: 100vh;
}

.admin-sidebar {
    background: #fff;
    bottom: 0;
    box-shadow: 4px 0 18px rgba(15, 23, 42, .08);
    display: flex;
    flex-direction: column;
    left: 0;
    overflow: hidden;
    padding: 28px 18px;
    position: fixed;
    top: 0;
    width: 270px;
    z-index: 1000;
}

.admin-sidebar > img {
    flex-shrink: 0;
}

.admin-tree {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 8px;
    margin-top: 32px;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 4px;
    scrollbar-gutter: stable;
}

.admin-tree::-webkit-scrollbar {
    width: 6px;
}

.admin-tree::-webkit-scrollbar-thumb {
    background: #c5d0da;
    border-radius: 999px;
}

.admin-tree::-webkit-scrollbar-track {
    background: transparent;
}

.admin-tree-link,
.admin-tree-group summary,
.admin-tree-children a,
.admin-tree-children span {
    align-items: center;
    border-radius: 6px;
    display: flex;
    gap: 10px;
    line-height: 1.2;
    min-height: 40px;
    padding: 11px 12px;
}

.admin-tree-link,
.admin-tree-group summary,
.admin-tree-children a {
    color: #2f3841 !important;
    text-decoration: none;
}

.admin-tree-link:hover,
.admin-tree-group summary:hover,
.admin-tree-children a:hover {
    background: #eef5fb;
    color: #1764ab;
}

.admin-tree-link.is-active,
.admin-tree-children a.is-active {
    background: #e7f4dc;
    color: #345f0c !important;
    font-weight: 700;
}

.admin-tree-group {
    border-radius: 6px;
}

.admin-tree-group summary {
    cursor: pointer;
    font-weight: 700;
    list-style: none;
}

.admin-tree-group summary::-webkit-details-marker {
    display: none;
}

.admin-tree-group summary::after {
    content: '\f105';
    font-family: Icons;
    margin-left: auto;
    transition: transform .2s ease;
}

.admin-tree-group[open] summary::after {
    transform: rotate(90deg);
}

.admin-tree-children {
    border-left: 1px solid #dce5ec;
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 4px 0 10px 24px;
    max-width: 100%;
    min-width: 0;
    padding-left: 10px;
}

.admin-tree-children a,
.admin-tree-children span {
    font-size: 14px;
    min-height: 34px;
    overflow-wrap: anywhere;
    padding: 9px 12px;
}

.admin-tree-children .is-disabled {
    color: #98a2ad;
    cursor: not-allowed;
}

.admin-tree-footer {
    border-top: 1px solid #e6edf2;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    gap: 8px;
    margin-top: auto;
    padding-top: 18px;
}

.admin-main {
    color: var(--ink);
    margin-left: 270px;
    padding: 34px;
}

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

.admin-top h1 {
    color: var(--ink);
    margin: 0;
}

.admin-main form h2{
    margin-top: 0px !important;
}

.admin-top span {
    color: #4b5563;
}

.admin-card,
.admin-table,
.admin-stats,
.admin-main .segment {
    margin-bottom: 26px !important;
}

.admin-card {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(15, 23, 42, .08);
    color: var(--ink);
    padding: 24px;
}

.admin-main .ui.header,
.admin-main .ui.form .field>label,
.admin-main .ui.checkbox label,
.admin-main .ui.table,
.admin-main .ui.table th,
.admin-main .ui.table td,
.admin-main .ui.card,
.admin-main .ui.cards>.card,
.admin-main .ui.card>.content>.header,
.admin-main .ui.cards>.card>.content>.header,
.admin-main .ui.card>.content>.description,
.admin-main .ui.cards>.card>.content>.description,
.admin-main .ui.segment {
    color: rgba(0, 0, 0, 0.87);
}

.admin-main input,
.admin-main textarea,
.admin-main select,
.admin-main .ui.dropdown {
    color: #111827 !important;
}

.admin-list-head {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin: 28px 0 14px;
}

.admin-form-back {
    justify-content: flex-start;
    margin-bottom: 0;
    margin-top: 0;
}

.admin-quick-links {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 10px;
}

.admin-quick-links a{
    color: #000 !important; 
    height:100px; 
    display: flex; 
    flex-direction: column; 
    gap: 10px; 
    align-items: center !important; 
    justify-content: center !important; 
    padding: 10px; 
    border-radius: 5px; 
    text-decoration: none; 
    font-size: 16px; 
    transition: all 0.3s ease; 
    font-family: 'Space Grotesk', sans-serif !important; 
    font-weight: 600;
}

.admin-quick-links :nth-child(1){
    background-color: rgb(255, 241, 241);
}

.admin-quick-links :nth-child(2){
    background-color: rgb(239, 255, 253);
}

.admin-quick-links :nth-child(3){
    background-color: rgb(251, 255, 240);
}

.admin-quick-links :nth-child(4){
    background-color: rgb(246, 237, 255);
}
.admin-quick-links :nth-child(5){
    background-color: rgb(233, 247, 255);
}

.admin-quick-links a i{
    font-size: 24px !important;
    background-color: transparent !important;
    color: #000 !important;
}

.newsletter-campaign-compose {
    display: grid;
    gap: 20px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    margin-top: 8px;
}

.newsletter-campaign-compose__editor,
.newsletter-campaign-compose__preview {
    min-width: 0;
}

.newsletter-campaign-preview {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 620px;
    overflow: hidden;
}

.newsletter-campaign-preview__head {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    justify-content: space-between;
    padding: 12px 16px;
}

.newsletter-campaign-preview__label {
    color: #111827;
    font-size: 14px;
    font-weight: 700;
}

.newsletter-campaign-preview__hint {
    color: #6b7280;
    font-size: 12px;
}

.newsletter-campaign-preview__subject {
    background: #fff;
    border-bottom: 1px solid #eef2f7;
    color: #111827;
    font-size: 14px;
    font-weight: 600;
    padding: 12px 16px;
}

.newsletter-campaign-preview__frame-wrap {
    flex: 1;
    min-height: 0;
}

.newsletter-campaign-preview__frame {
    background: #f4f6f8;
    border: 0;
    display: block;
    height: 100%;
    min-height: 520px;
    width: 100%;
}

.admin-thumb {
    /* background: #f4f7fa; */
    border-radius: 6px;
    height: 40px;
    object-fit: cover;
    width: 90px;
}

.admin-thumb.is-placeholder {
    object-fit: contain;
    padding: 2px;
}

.admin-thumb--product {
    height: 45px;
    object-fit: contain;
    width: auto;
    max-width: 90px;
}

.logo-thumb {
    background: #fff;
    object-fit: contain;
}

.admin-preview {
    border-radius: 8px;
    display: block;
    margin-top: 12px;
    max-height: 160px;
    max-width: 260px;
    object-fit: cover;
}

.feature-icon-preview,
.admin-feature-icon {
    background: #edf4fa;
    border-radius: 6px;
    height: 48px;
    object-fit: contain;
    padding: 8px;
    width: 48px;
}

.logo-preview {
    object-fit: contain;
}

.hero-slide-thumb-cell {
    width: 180px;
}

.hero-slide-thumb {
    border: 1px solid #dce5ec;
    border-radius: 8px;
    display: block;
    height: 72px;
    object-fit: cover;
    width: 160px;
}

.hero-slide-thumb--empty {
    align-items: center;
    background: #f3f6f9;
    color: #98a2ad;
    display: flex;
    justify-content: center;
}

.hero-slide-form-preview-wrap {
    margin-top: 12px;
}

.hero-slide-form-preview {
    border: 1px solid #dce5ec;
    border-radius: 8px;
    display: block;
    max-height: 220px;
    object-fit: cover;
    width: 100%;
}

.order-input {
    max-width: 90px;
}

.admin-event-form-layout {
    align-items: start;
    display: grid;
    gap: 24px;
    grid-template-columns: minmax(0, 1fr) 320px;
}

.admin-event-form-main {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 0;
}

.admin-event-form-main > .admin-card {
    margin-bottom: 24px !important;
}

.admin-event-form-main > .admin-card:last-of-type {
    margin-bottom: 0 !important;
}

.admin-event-form-main .ui.header {
    margin-bottom: 4px;
}

.admin-event-form-main .help-text {
    color: #6b7280;
    font-size: 13px;
    line-height: 1.5;
    margin: 0 0 20px;
}

.admin-event-form-sidebar {
    position: sticky;
    top: 24px;
}

.admin-event-gallery-panel .ui.header {
    margin-bottom: 4px;
}

.admin-event-gallery-panel .help-text {
    color: #6b7280;
    font-size: 13px;
    line-height: 1.5;
    margin: 0 0 16px;
}

.admin-event-gallery-locked {
    margin-bottom: 0 !important;
}

.admin-event-gallery-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 16px;
}

.admin-event-gallery-item {
    background: #f3f6f9;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
}

.admin-event-gallery-item.is-selected {
    border-color: #db2828;
    box-shadow: 0 0 0 1px rgba(219, 40, 40, .35);
}

.admin-event-gallery-panel .gallery-admin-toolbar {
    margin-bottom: 12px;
}

.admin-event-gallery-item img {
    display: block;
    height: 90px;
    object-fit: cover;
    width: 100%;
}

.admin-event-gallery-item .button {
    border-radius: 0;
    margin: 0;
    width: 100%;
}

.admin-event-gallery-empty {
    align-items: center;
    background: #f9fafb;
    border: 1px dashed #d1d5db;
    border-radius: 8px;
    color: #9ca3af;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
    padding: 28px 16px;
    text-align: center;
}

.admin-event-gallery-empty .icon {
    font-size: 28px;
    margin: 0;
}

.admin-event-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 8px;
    padding-bottom: 8px;
}

.admin-event-status-toggle {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    margin-bottom: 20px !important;
    padding: 14px 16px;
}

.admin-event-status-toggle small {
    color: #6b7280;
    display: block;
    margin-top: 6px;
}

.admin-product-form-layout {
    display: grid;
    gap: 24px;
    grid-template-columns: minmax(0, 1fr) 400px;
}

.admin-product-form-main {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 0;
}

.admin-product-form-main > .admin-card {
    margin-bottom: 24px !important;
}

.admin-product-form-main > .admin-card:last-of-type {
    margin-bottom: 0 !important;
}

.admin-product-form-main .ui.header {
    margin-bottom: 4px;
}

.admin-product-form-main .ui.table td {
    overflow: visible;
    vertical-align: top;
}

.admin-product-form-main .ui.search.selection.dropdown.active,
.admin-product-form-main .ui.search.selection.dropdown .menu {
    z-index: 30;
}

.admin-product-form-main .ui.search.selection.dropdown > input.search {
    left: 0.75em;
    right: 2.25em;
    width: auto;
}

.admin-product-form-main .help-text {
    color: #6b7280;
    font-size: 13px;
    line-height: 1.5;
    margin: 0 0 20px;
}

.admin-product-form-sidebar {
    position: sticky;
    top: 24px;
}

.admin-product-form-sidebar .ui.header {
    margin-bottom: 16px;
}

.admin-product-categories {
    border: 1px solid #e5e7eb !important;
    margin: 0 !important;
    max-height: 280px;
    overflow-y: auto;
}

.admin-product-status-toggle {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    margin-bottom: 0 !important;
    padding: 14px 16px;
}

.admin-product-status-toggle small {
    color: #6b7280;
    display: block;
    margin-top: 10px;
}

.admin-product-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
    padding-bottom: 8px;
}

.gallery-admin-toolbar {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 14px;
}

.gallery-admin-selection-count {
    color: #6b7280;
    font-size: 13px;
}

.gallery-admin-card {
    position: relative;
}

.gallery-admin-card.is-selected {
    box-shadow: 0 0 0 2px #2185d0;
}

.gallery-admin-select {
    background: rgba(255, 255, 255, 0.92);
    border-radius: 4px;
    cursor: pointer;
    left: 8px;
    line-height: 1;
    padding: 5px 7px;
    position: absolute;
    top: 8px;
    z-index: 2;
}

.gallery-admin-select input {
    cursor: pointer;
    height: 16px;
    margin: 0;
    width: 16px;
}

.admin-bulk-toolbar {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: space-between;
    margin: 10px 0 12px;
}

.admin-bulk-toolbar__left {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.admin-bulk-toolbar__right {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.admin-bulk-count {
    color: #6b7280;
    font-size: 13px;
}

.admin-table th.admin-col-select,
.admin-table td.admin-col-select {
    text-align: center;
    width: 44px;
}

.inline-form {
    display: inline-block;
}

.toggles {
    align-items: flex-start;
    display: flex !important;
    flex-direction: column;
    gap: 16px;
    justify-content: center;
}

.hero-subtitle {
    font-size: 24px !important;
    margin-top: 10px !important;
    opacity: 0.9;
}

.product-title-main {
    font-size: 42px;
    font-weight: 900;
    margin: 0 0 5px;
}

.product-subtitle-main {
    color: #3c4a5d;
    font-size: 22px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
}

.key-specifications h4 {
    color: #919191;
    font-size: 16px;
    font-weight: 800;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.key-specifications ul {
    list-style: none;
    padding: 0;
}

.key-specifications li {
    color: #475569;
    font-size: 16px;
    margin-bottom: 10px;
    padding-left: 15px;
    position: relative;
    max-width: 100%;
    font-weight: 500;
}

.key-specifications li span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.key-specifications li::before {
    content: "\2022";
    font-family: 'Icons';
    font-size: 20px;
    left: 0;
    position: absolute;
}

.product-full-description {
    color: #475569;
    font-size: 16px;
    line-height: 1.8;
}
/* ==========================================================================
   7. Responsive
   Desktop: default (≥1200px). Below: laptop, tablet landscape,
   tablet portrait, mobile — one merged block per tier.
   Page-by-page breakpoint tuning will be done in a later pass.
   ========================================================================== */

/* --- Laptop (max-width: 1199px) --- */
@media (max-width: 1199px) {
    .admin-event-form-layout,
    .admin-product-form-layout {
    grid-template-columns: 1fr;
            }

    .admin-event-form-sidebar,
            .admin-product-form-sidebar {
                position: static;
            }

    .site-footer--extended .footer-extended.ui.container {
                gap: 32px;
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

    .search-product-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }

    .newsletter-campaign-preview {
                min-height: 480px;
            }

    .catalog-product-grid {
                grid-template-columns: repeat(2, 1fr);
            }

    .search-recommended-grid,
            .search-knowledge-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

    .newsletter-campaign-compose {
                grid-template-columns: 1fr;
            }

    .newsletter-campaign-preview__frame {
                min-height: 420px;
            }

}

/* --- Tablet landscape (max-width: 991px) --- */
@media (max-width: 991px) {
    .product-info-content {
    margin-top: 40px;
    padding-left: 0;
            }

    .solutions-ecosystems__header h2,
            .solutions-benefits__copy h2,
            .solutions-faq__header h2,
            .solution-single-page .sol-single-hero h1,
            .solution-single-page .sol-single-overview__copy h2,
            .solution-single-page .sol-single-offerings h2,
            .solution-single-page .sol-single-highlights h2,
            .solution-single-page .sol-single-features__header h2,
            .solution-single-page .sol-single-architecture h2,
            .solution-single-page .sol-single-components h2,
            .solution-single-page .sol-single-applications__header h2,
            .solution-single-page .sol-single-cta h2 {
                font-size: var(--text-section-title-sm);
            }

    .hero {
                min-height: 430px;
                padding: 70px 0;
            }

    .hero p {
                font-size: 19px;
            }

    .cards-grid {
                grid-template-columns: 1fr;
            }

    .cards-grid .feature-card {
                grid-column: auto !important;
            }

    .sp-cards {
                align-items: center;
                flex-direction: column;
            }

    .sp-card--solutions .sp-card__content {
                margin-left: 0;
            }

    .sp-bridge {
                display: none;
            }

    .sp-card--products {
                border-radius: 10px;
                margin-left: 0;
                margin-top: -20px;
            }

    .sp-card__title {
                font-size: 2rem !important;
            }

    .sp-card__subtitle {
                opacity: 1 !important;
            }

    .sp-card__content {
                padding: 44px 32px;
            }

    .features-band {
                padding: 64px 0 72px;
            }

    .feature-grid {
                gap: 48px;
                grid-template-columns: 1fr;
            }

    .feature-copy h2,
            .feature-copy p {
                max-width: none;
            }

    .cards-grid {
                gap: 18px;
            }

    .feature-card {
                min-height: 0;
                padding: 24px;
            }

    /* Products landing */
    .products-hero {
                max-height: none;
                min-height: 360px;
                padding: 48px 0;
            }

    .products-intro {
                padding: 48px 0;
            }

    .products-intro-grid {
                gap: 32px;
                grid-template-columns: 1fr;
            }

    .products-intro p {
                max-width: none;
            }

    .product-category-heading {
                padding: 40px 0;
            }

    .product-category-row {
                padding: 48px 0;
            }

    .product-category-content,
            .product-category-row.is-reversed .product-category-content {
                gap: 28px;
                grid-template-columns: 1fr;
            }

    .product-category-row.is-reversed .product-category-image {
                order: 0;
            }

    .product-category-image img {
                height: 220px;
            }

    .product-platform {
                padding: 56px 0;
            }

    .platform-flow {
                gap: 16px;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                margin: 32px auto;
            }

    .platform-note {
                padding: 24px 20px;
            }

    .product-cta {
                padding: 48px 20px;
            }

    /* Single product category */
    .single-category-hero {
                min-height: 360px;
                padding: 48px 0;
            }

    .single-intro,
            .single-capabilities {
                padding: 48px 0;
            }

    .single-intro h2,
            .single-featured h2,
            .single-ecosystem h2,
            .related-solutions h2 {
                font-size: 30px;
                max-width: none;
            }

    .single-intro p,
            .single-ecosystem p {
                max-width: none;
            }

    .capability-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                max-width: none !important;
            }

    .single-featured,
            .single-ecosystem,
            .related-solutions {
                padding: 56px 0;
            }

    .featured-product-grid {
                gap: 20px;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                margin: 32px auto;
                max-width: none;
            }

    .product-device {
                min-height: 180px;
            }

    .related-solution-grid {
                grid-template-columns: 1fr;
                margin-top: 28px;
                max-width: none;
            }

    .related-solution-grid p {
                min-height: 0;
            }

    .footer-inner {
                grid-template-columns: 1fr;
                text-align: center;
            }

    .admin-sidebar {
                position: static;
                width: auto;
            }

    .catalog-layout-wrapper {
                grid-template-columns: 1fr;
            }

    .catalog-filter-toggle,
            .catalog-filters-close {
                display: inline-flex;
            }

    .catalog-filters-overlay {
                background: rgba(15, 23, 42, .45);
                display: block;
                inset: 0;
                position: fixed;
                z-index: 100010;
            }

    .catalog-filters-overlay[hidden] {
                display: none;
            }

    .catalog-sidebar-filters {
                border-radius: 0;
                box-shadow: 8px 0 32px rgba(15, 23, 42, .12);
                height: 100%;
                left: 0;
                max-width: 88vw;
                overflow-y: auto;
                padding: 20px 16px 28px;
                position: fixed;
                top: 0;
                transform: translateX(-100%);
                transition: transform .28s ease, visibility .28s ease;
                visibility: hidden;
                width: 300px;
                z-index: 100011;
            }

    body.catalog-filters-open .catalog-sidebar-filters {
                transform: translateX(0);
                visibility: visible;
            }

    body.catalog-filters-open {
                overflow: hidden;
            }

    .catalog-top-bar {
                align-items: stretch;
                flex-direction: column;
                gap: 16px;
            }

    .catalog-top-bar__primary {
                justify-content: space-between;
                width: 100%;
            }

    .search-sort-group {
                flex-direction: column;
                gap: 14px;
                width: 100%;
            }

    .search-box-container,
            .sort-box-container {
                align-items: stretch;
                flex-direction: column;
                gap: 8px;
                width: 100%;
            }

    .search-box-container form,
            .sort-box-container form {
                width: 100%;
            }

    .search-field,
            .search-field input,
            .sort-box-container .ui.dropdown,
            .sort-box-container .ui.selection.dropdown {
                width: 100% !important;
                min-width: 0 !important;
            }

    .catalog-main-content {
                order: 1;
            }

    .site-footer--extended .footer-extended.ui.container {
                grid-template-columns: 1fr;
            }

    .product-title {
                font-size: 32px;
            }

    .hero h1 {
                font-size: 42px;
            }

    .sp-section {
                padding: 40px 0;
            }

    .sp-card {
                height: auto !important;
                min-height: 340px;
                width: 90%;
            }

    .sp-card,
            .sp-card--solutions,
            .sp-card--products,
            .sp-cards:hover .sp-card--products,
            .sp-cards:hover .sp-card--solutions,
            .sp-cards .sp-card--solutions:hover {
                box-shadow: none !important;
            }

    .sp-card--solutions {
                border-radius: 10px;
                margin-bottom: 40px;
            }

    .footer-grid {
                grid-template-columns: 1fr 1fr;
            }

    .sp-card__desc {
                font-size: 1rem;
                margin-bottom: 20px !important;
                max-height: 200px !important;
                opacity: 1 !important;
                transform: none !important;
            }

    .sp-card--products .sp-card__content {
                padding-top: 60px;
            }

    .company-row {
                gap: 18px;
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

    .customers-grid {
                gap: 16px;
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }

    .footer-inner img,
            .footer-inner span {
                justify-self: center;
            }

    .admin-main {
                margin-left: 0;
                padding: 20px;
            }

    .main-image-view {
                height: 350px;
            }

    .cp-about-counter__intro,
            .cp-about-counter__stats-grid {
                grid-template-columns: 1fr;
            }

    /* Company page */

    .cp-hero-carousel,
    .cp-hero-carousel__track {
        min-height: 420px;
    }

    .cp-hero-carousel__inner {
        min-height: 420px;
        padding: 88px 0 96px;
    }
    .cp-hero-carousel__arrow {
        align-items: center;
        background: rgba(15, 23, 42, .45);
        border: 1px solid rgba(255, 255, 255, .28);
        border-radius: 50%;
        color: rgba(255, 255, 255, .92);
        cursor: pointer;
        display: inline-flex;
        height: 44px;
        justify-content: center;
        padding: 0;
        position: absolute;
        top: 90%;
        transform: translateY(-50%);
        transition: background .2s ease, border-color .2s ease, color .2s ease;
        width: 44px;
    }

    .cp-about-counter__intro-left h2 {
        font-size: 35px;
    }

    .cp-cat-showcase__header {
        align-items: flex-start;
        flex-direction: column;
    }

    .cp-cat-showcase__layout {
        grid-template-columns: 1fr;
    }

    .cp-cat-showcase__nav {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 8px;
    }
    .cp-about-counter__stat-number{
        font-size: 52px;
        font-weight: 800;
        line-height: 1.2;
        margin: 0 0 10px;
    }

    .cp-integrated__solutions-items {
        padding-left: 0px;
    }

    .cp-about-counter__stat-number{
        -webkit-text-stroke: 2px #94a3b8;
    }
    .cp-about-counter__stat-label{
        font-size: 17px;
        font-weight: 400;
        line-height: 1.4;
        margin: 0;
    }
    .cp-cat-showcase__nav-item {
        border: 1px solid #dbe3ea;
        border-radius: 6px;
    }

    .cp-cat-showcase__visual {
        min-height: 260px;
    }

    .cp-milestones__item{
        padding-left: 0px;
    }

    .cp-milestones__dot {
        height: 16px;
        left: -30px;
        width: 16px;
    }

    .cp-capabilities__grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: none;
    }

    .cp-capability-card--slot-1,
    .cp-capability-card--slot-2,
    .cp-capability-card--slot-3,
    .cp-capability-card--slot-4,
    .cp-capability-card--slot-5,
    .cp-capability-card--slot-6 {
        grid-column: auto;
        grid-row: auto;
        min-height: 148px;
    }

    .cp-capability-card--slot-1 {
                grid-column: 1 / span 2;
            }

    .cp-capability-card--slot-4,
            .cp-capability-card--slot-6 {
                grid-column: 1 / span 2;
            }

    .cp-capability-card--accent p {
                max-width: 100%;
            }

    .cp-capability-card--slot-1,
            .cp-capability-card--slot-4,
            .cp-capability-card--slot-6 {
                grid-column: auto;
            }

    .cp-verticals__grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

    .cp-vertical-card {
                min-height: 190px;
            }

    .cp-integrated__body {
                grid-template-columns: 1fr;
            }

    .cp-integrated__gallery {
                max-width: 520px;
            }

    .cp-approach__grid {
                grid-template-columns: 1fr;
                max-width: 480px;
                margin: 0 auto;
            }

    .cp-projects__cards {
                grid-template-columns: 1fr;
            }

    .cp-project-card {
                min-height: 240px;
            }

    .cp-projects__stats-grid {
                display: grid;
            }

    .cp-projects__stats-grid p{
                text-align: center;
            }

    .cp-leadership__grid {
                grid-template-columns: 1fr;
                max-width: 320px;
            }

    .cp-testimonial-card {
                flex-basis: 50%;
                padding: 0 24px;
            }

    .cp-testimonial-card:first-child {
                padding-left: 0;
            }

    .cp-why-us__cards {
                grid-template-columns: repeat(2, 1fr);
            }

    .cp-why-us__card {
                border-right: none;
                border-bottom: 1px solid #e2e8f0;
            }

    .cp-why-us__card:nth-child(2n) {
                border-right: none;
            }

    .cp-case-studies__grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

    .cp-contact-cta__bg,
            .cp-contact-cta__grid {
                grid-template-columns: 1fr;
            }

    .cp-contact-cta__panel,
            .cp-contact-cta__info {
                padding: 32px 0;
            }

    .solution-category-card__inner {
                grid-template-columns: 1fr;
            }

    .solution-category-card__media img {
                min-height: 220px;
            }

    .solutions-benefits__grid {
                grid-template-columns: 1fr;
            }

    .solutions-benefits__figure {
                margin: 0 0 40px 16px;
                min-height: 380px;
            }

    .solutions-benefits__media-inner {
                height: 340px;
            }

    .solutions-benefits__quote {
                bottom: -24px;
                left: -16px;
                max-width: calc(100% - 8px);
            }

    .solution-single-page .sol-single-overview__grid,
            .solution-single-page .sol-single-highlights__grid,
            .solution-single-page .sol-single-components__grid {
                grid-template-columns: 1fr 1fr;
            }

    .solution-single-page .sol-single-hero h1 {
                font-size: 34px;
            }

    .solution-single-page .sol-single-overview__grid,
            .solution-single-page .sol-single-highlights__grid,
            .solution-single-page .sol-single-components__grid,
            .solution-single-page .sol-single-applications__grid {
                grid-template-columns: 1fr;
            }

    .solution-single-page .sol-single-features__list {
                columns: 1;
            }

    .solution-single-page .sol-single-cta__banner > p {
                font-size: 18px;
            }

    .contact-page .contact-main__grid {
                grid-template-columns: 1fr;
            }

    .contact-page .contact-map iframe {
                height: 320px;
            }

    .ewaste-guidelines {
                padding: 44px 0 52px;
                border-radius: 12px;
            }

    .ewaste-guidelines__grid {
                grid-template-columns: 1fr;
                gap: 20px;
            }

    .ewaste-guidelines__card {
                padding: 22px 20px 20px;
            }

    .ne-news-grid,
            .ne-events-grid,
            .ne-event-story__grid,
            .ne-gallery-showcase {
                grid-template-columns: 1fr;
                min-height: 0;
            }

    .event-detail-page .ne-event-detail-hero {
                min-height: 340px;
                max-height: none;
            }

    .event-detail-page .ne-event-story__text h2 {
                font-size: 28px;
                max-width: none;
            }

    .ne-gallery-showcase__main {
                height: 280px;
            }

    .ne-gallery-showcase__main img {
                height: 280px;
            }

    .ne-gallery-showcase__thumbs {
                flex-direction: row;
                flex-wrap: nowrap;
                height: auto;
                max-height: none;
                max-width: 100%;
                overflow-x: auto;
                overflow-y: hidden;
                padding-bottom: 4px;
                scrollbar-color: #b8c2ce transparent;
            }

    .ne-gallery-thumb {
                flex: 0 0 72px;
                height: 72px;
                min-height: 72px;
                width: 72px;
            }

    .ne-gallery-thumb img {
                height: 72px;
            }

    .ne-event-card {
                grid-template-columns: 96px minmax(0, 1fr);
            }

    .ne-event-card__body {
                padding: 18px;
            }

    .ne-cta__inner h2 {
                font-size: 26px;
            }

    .ne-cta__actions {
                flex-direction: column;
                align-items: stretch;
            }

    .ne-event-upcoming-detail__row {
                grid-template-columns: 1fr;
                gap: 4px;
            }

    .ne-cta__btn {
                justify-content: center;
            }

    .careers-reasons__grid {
                grid-template-columns: 1fr;
            }

    .careers-job-detail {
                padding: 20px;
            }

    .careers-job-detail__specs {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

    .careers-job-detail__layout {
                grid-template-columns: 1fr;
            }

    .careers-job-detail__sidebar {
                position: static;
            }

    .careers-job-detail__cta {
                flex-direction: column;
                align-items: stretch;
                text-align: center;
            }

    .careers-job-detail__cta .button {
                width: 100%;
            }

    .careers-job-card__toggle {
                padding: 20px;
            }

    .search-layout-wrapper {
                grid-template-columns: 1fr;
            }

    .search-filters-bar {
                display: block;
            }

    .search-category-feature-grid,
            .search-recommended-grid,
            .search-knowledge-grid,
            .search-product-grid {
                display: flex;
                flex-wrap: nowrap;
                gap: 16px;
                grid-template-columns: unset;
                overflow-x: auto;
                overscroll-behavior-x: contain;
                padding-bottom: 10px;
                scroll-snap-type: x proximity;
                scrollbar-color: #b8c2ce transparent;
                scrollbar-width: thin;
                -webkit-overflow-scrolling: touch;
            }

    .search-category-feature-grid::-webkit-scrollbar,
            .search-recommended-grid::-webkit-scrollbar,
            .search-knowledge-grid::-webkit-scrollbar,
            .search-product-grid::-webkit-scrollbar {
                height: 6px;
            }

    .search-category-feature-grid::-webkit-scrollbar-thumb,
            .search-recommended-grid::-webkit-scrollbar-thumb,
            .search-knowledge-grid::-webkit-scrollbar-thumb,
            .search-product-grid::-webkit-scrollbar-thumb {
                background: #b8c2ce;
                border-radius: 999px;
            }

    .search-recommended-grid > .search-recommended-card,
            .search-knowledge-grid > .search-knowledge-card {
                flex: 0 0 min(78vw, 280px);
                max-width: min(78vw, 280px);
                scroll-snap-align: start;
            }

    .search-product-grid > .catalog-product-card {
                flex: 0 0 min(72vw, 260px);
                max-width: min(72vw, 260px);
                scroll-snap-align: start;
            }

    .search-category-feature-grid > .search-category-feature-card {
                flex: 0 0 min(85vw, 320px);
                max-width: min(85vw, 320px);
                scroll-snap-align: start;
            }

    .search-category-feature-card {
                display: flex;
                flex-direction: column;
                grid-template-columns: unset;
                min-height: 0;
            }

    .search-category-feature-card__media {
                min-height: 160px;
            }

    .search-product-grid > .catalog-product-card:hover {
                transform: none;
            }

    .search-section__header {
                align-items: flex-start;
                flex-direction: column;
            }

}

/* --- Tablet portrait (max-width: 767px) --- */
@media (max-width: 767px) {
    /* 3. Layout — mobile header */
    html {
        overflow-x: clip;
    }

    body {
        overflow-x: clip;
        max-width: 100%;
    }

    .container {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .main-nav {
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
    }

    .main-nav-menu {
        display: none !important;
        width: 0 !important;
        overflow: hidden;
    }

    .top-strip {
        display: none;
    }

    :root {
        --site-header-offset: 64px;
        --site-header-offset-compact: 64px;
    }

    .main-nav {
        align-items: center;
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 10px;
        justify-content: flex-start;
        min-height: 64px;
        padding: 8px 0;
    }

    .main-nav-menu,
    .nav-right--desktop {
        display: none !important;
    }

    .mobile-nav-toggle,
    .mobile-nav-actions,
    .mobile-nav-sidebar {
        display: flex;
    }

    .mobile-nav-actions {
        margin-left: auto;
    }

    .mobile-nav-toggle {
        flex-shrink: 0;
    }

    .brand {
        flex-shrink: 0;
    }

    .mobile-nav-overlay:not([hidden]) {
        display: block;
    }

    .brand img {
        width: 118px;
    }

    .mega-menu {
        display: none !important;
    }

    .cp-hero-carousel,
            .cp-hero-carousel__track {
                min-height: 360px;
            }

    .cp-hero-carousel__inner {
                min-height: 360px;
                padding: 72px 0 88px;
            }

    .cp-hero__content h1 {
                font-size: var(--text-section-title-sm);
                max-width: none;
            }

    .cp-hero-carousel__arrow {
                height: 38px;
                width: 38px;
            }

    .cp-hero-carousel__arrow--prev {
                left: 4px;
            }

    .cp-hero-carousel__arrow--next {
                right: 4px;
            }

    .cp-hero-carousel__controls {
                bottom: 20px;
                gap: 10px;
                padding: 6px 12px;
            }

    .cp-milestones h2,
    .ne-section__head h2 {
        font-size: var(--text-section-title-sm);
    }

    .catalog-top-bar {
                gap: 14px;
                margin-bottom: 22px;
            }

    .catalog-filter-toggle {
                flex-shrink: 0;
                padding: 9px 12px;
            }

    .results-count {
                font-size: 13px;
                line-height: 1.4;
            }

    .search-box-container label,
            .sort-box-container label {
                font-size: 11px;
            }

    .search-field input {
                font-size: 14px !important;
                padding: 10px 12px !important;
            }

    .sort-box-container .ui.dropdown,
            .sort-box-container .ui.selection.dropdown {
                font-size: 14px;
            }

    .hero h1 {
                font-size: 34px;
            }

    .sp-card {
                min-height: 300px;
            }

    .sp-card__title {
                font-size: 1.7rem !important;
            }

    .site-footer--extended {
                padding-top: 52px;
            }

    .back-to-top {
                bottom: 18px;
                right: 18px;
            }

    .feature-copy h2 {
                font-size: 30px;
                margin-bottom: 20px;
            }

    .feature-copy p {
                font-size: 18px;
                margin-bottom: 24px;
            }

    .accent-line {
                margin-bottom: 24px;
                width: 120px;
            }

    .features-band {
                padding: 48px 0 56px;
            }

    .feature-grid {
                gap: 32px;
            }

    .feature-card h3 {
                font-size: 17px;
            }

    /* Products landing */
    .products-hero {
                min-height: 300px;
                padding: 40px 0;
            }

    .products-hero h1,
            .single-category-hero h1 {
                font-size: var(--text-section-title-sm);
                max-width: none;
            }

    .products-hero p,
            .single-category-hero p {
                max-width: none;
            }

    .products-intro {
                padding: 40px 0;
            }

    .products-intro h2,
            .product-category-heading h2,
            .product-platform h2 {
                font-size: var(--text-section-title-sm);
            }

    .product-category-heading {
                padding: 32px 0;
            }

    .product-category-row {
                padding: 40px 0;
            }

    .product-category-copy h4 {
                font-size: 20px;
            }

    .product-platform {
                padding: 48px 0;
            }

    .platform-flow {
                grid-template-columns: 1fr;
                margin: 28px auto;
            }

    .product-cta h2 {
                font-size: 28px;
            }

    .product-cta .ui.button {
                display: table;
                margin: 10px auto 0;
            }

    /* Single product category */
    .single-category-hero {
                min-height: 300px;
                padding: 40px 0;
            }

    .single-intro,
            .single-capabilities,
            .single-featured,
            .single-ecosystem,
            .related-solutions {
                padding: 40px 0;
            }

    .single-intro h2,
            .single-featured h2,
            .single-ecosystem h2,
            .related-solutions h2 {
                font-size: var(--text-section-title-sm);
            }

    .capability-grid {
                grid-template-columns: 1fr;
            }

    .featured-product-grid {
                grid-template-columns: 1fr;
                margin: 24px auto;
            }

    .cp-capabilities__grid {
                grid-template-columns: 1fr;
            }

    .cp-verticals__grid {
                grid-template-columns: 1fr;
            }

    .cp-integrated__gallery {
                max-width: none;
            }

    .cp-milestones__timeline {
                padding-left: 28px;
            }

    .cp-milestones__dot {
                height: 12px;
                left: -28px;
                width: 12px;
            }

    .cp-milestones__closing-dot {
                height: 14px;
                left: -28px;
                width: 14px;
            }

    .cp-milestones__closing-ring {
                height: 14px;
                width: 14px;
            }

    .cp-milestones__line {
                left: 5px;
            }

    .contact-page .contact-form__row {
                grid-template-columns: 1fr;
            }

    .contact-page .contact-form-panel h2 {
                font-size: 26px;
            }

    .ne-news-grid {
                grid-template-columns: 1fr;
            }

}

/* --- Mobile (max-width: 575px) --- */
@media (max-width: 575px) {
    .features-band {
        padding: 40px 0 48px;
    }

    .feature-grid {
        gap: 28px;
    }

    .feature-copy h2 {
        font-size: 26px;
    }

    .feature-copy p {
        font-size: 16px;
    }

    .feature-card {
        padding: 20px;
    }

   
    /* Products landing */
    .products-hero {
        min-height: 260px;
        padding: 32px 0;
    }

    .products-intro {
        padding: 32px 0;
    }

    .products-intro-grid {
        gap: 24px;
    }

    .products-intro h2,
    .product-category-heading h2,
    .product-platform h2 {
        font-size: 26px;
    }

    .product-stat-stack strong {
        font-size: 20px;
    }

    .product-category-row {
        padding: 32px 0;
    }

    .product-category-image img {
        height: 200px;
    }

    .product-cta {
        padding: 40px 16px;
    }

    .product-cta h2 {
        font-size: 24px;
    }
    .catalog-product-grid{
        grid-template-columns: repeat(1, 1fr);
    }
    .catalog-hero h1{
        font-size: 35px;
        font-weight: 800;
        margin: 0 0 0px;
    }
    .catalog-layout-wrapper {
        margin-top: 24px !important;
        padding-bottom: 48px;
    }
    .product-tabs-section{
        padding: 20px 0 80px;
    }
    .catalog-sidebar-filters {
        padding: 16px 14px 24px;
        width: min(300px, 92vw);
    }

    .filter-group-box {
        margin-bottom: 28px;
    }

    .filter-group-box h4 {
        margin-bottom: 14px;
    }
    .product-info-content{
        margin-top: 0px !important;
    }
    /* Single product category */
    .single-category-hero {
        min-height: 260px;
        padding: 32px 0;
    }

    .single-intro,
    .single-capabilities,
    .single-featured,
    .single-ecosystem,
    .related-solutions {
        padding: 32px 0;
    }

    .single-intro h2,
    .single-featured h2,
    .single-ecosystem h2,
    .related-solutions h2 {
        font-size: 26px;
    }

    .capability-grid article {
        padding: 18px;
    }

    .featured-product-grid article {
        padding: 16px;
    }

    .product-device {
        min-height: 160px;
    }

    .related-solution-grid article {
        padding: 24px;
    }

    .key-specifications li span {
        display: block;
        overflow: hidden;
        text-wrap: wrap;
    }

    #image-zoom-modal a{
        right: 20px;
    }

    .thumb-item{
        width: 63px;
        height: 63px;
    }

    .product-description-video{
        width: 100%;
        height: auto;
    }

    .solutions-benefits{
        background: #fff;
        background-size: 32px 32px;
        padding: 60px 0 52px 0;
    }

    .solutions-benefits__grid {
        gap: 10px;
    }

    .solutions-benefits__quote {
        bottom: -24px;
        left: -16px;
        max-width: calc(100% - 8px);
    }

    .cp-why-us__stats {
        grid-template-columns: 1fr;
     }

    .cp-why-us__stat {
        border-right: none !important;
        border-bottom: 1px solid #d1dde8;
        padding-bottom: 20px;
        margin-bottom: 20px;
    }

    .cp-why-us__stat:nth-child(odd) {
        border-right: 1px solid #d1dde8;
    }

    .cp-testimonials h2 {
        font-size: 1.75rem;
    }

    .cp-hero-carousel,
            .cp-hero-carousel__track {
                min-height: 400px;
            }

    .cp-hero-carousel__inner {
        min-height: 400px;
        padding: 64px 0 80px;
    }

    .solutions-ecosystems__header h2,
    .solutions-benefits__copy h2,
    .solutions-faq__header h2,
    .ewaste-guidelines__header h2 {
        font-size: 26px;
    }

    .cp-testimonial-card {
        flex-basis: 100%;
        padding: 0 16px;
    }

    .cp-testimonials__slider {
        gap: 8px;
    }

    .cp-testimonials__arrow {
        height: 38px;
        width: 38px;
    }

    .cp-why-us__cards {
        grid-template-columns: 1fr;
    }

    .cp-why-us__stat:last-child {
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }

    .cp-case-studies__grid {
        grid-template-columns: 1fr;
    }

    .cp-newsletter__form {
        flex-direction: column;
        gap: 12px;
        max-width: 100%;
    }

    .cp-newsletter__form input {
        border-radius: 6px;
        border-right: 1px solid #cbd5e1;
    }

    .cp-newsletter__btn {
        border-radius: 6px;
        width: 100%;
    }

    .cp-contact-cta__panel h2 {
        font-size: 1.6rem;
    }

    .solution-category-card__content {
        padding: 24px 20px 28px;
    }

    .solution-category-card__links {
        grid-template-columns: 1fr;
    }

    .careers-job-detail__specs {
        grid-template-columns: 1fr;
    }

    /* solution landing page */
    .solutions-ecosystems{
        padding: 25px 0 72px;
    }

    /* Contact us page */
    .contact-page .contact-main{
        padding: 25px 0 60px;
    }

    /* news & Evnets page */
    .news-events-page .products-hero.ne-hero{
        min-height: 260px;
        padding: 32px 0;
    }

    .ne-section{
        padding: 25px 0 60px;
    }
    .ne-event-card{
        display: block;
    }

    .ne-event-card__date {
        width: 100%;
        align-items: center;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 20px 20px;
        position: relative;
        text-align: center;
    }

    .ne-event-card__body{
        padding-top: 0px !important;
    }

    .ne-events-list{
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    /* carrier page */
    .careers-page .careers-hero{
        min-height: 260px;
        padding: 32px 0;
    }

    .careers-modal__dialog form{
        max-height: 430px;
        overflow-y: auto;
        overflow-x: hidden;
        width: 100%;
    }
    
}