﻿@import url('./_insights-banner-section.css?v=99');
@import url('./our-team-page.css?v=99');
@import url('./_insights-listing-section.css');

body { overflow: clip; }

/* ================================================
INSIGHTS FILTER (in-* â€” decoupled from our-team)
================================================ */

.in-filter-top { width: 100%; padding: 0 0 24px; }
.in-filter-toggle { display: none; }
.in-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.in-pill { display: inline-flex; align-items: center; gap: 6px; padding: 11px 12px; border: 2px solid var(--Subtle); background: var(--White); font-family: var(--text-font); font-size: 16px; font-weight: 500; line-height: 16px; color: var(--Subtle-Foreground); cursor: pointer; white-space: nowrap; transition: var(--b-transition); border-radius: 24px; }
.in-pill:hover { border-color: var(--Primary); color: var(--Primary); }
.in-pill.active { background: var(--Foreground); border-color: var(--Foreground); color: var(--White); }
.in-pill-dot { width: 16px; min-width: 16px; min-height: 16px; background: var(--Subtle); display: inline-block; border-radius: 50%; }
.in-pill .in-pill-check { display: none; }
.in-pill.active .in-pill-dot { display: none; }
.in-pill.active .in-pill-check { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; line-height: 0; }

/* Search */
.insights-search-wrap { margin-bottom: 40px; padding: 4px; border: 1px solid var(--Subtle-2); }
.insights-search-box { background: var(--White); padding: 19px 28px 19px 72px; background-image: url('../images/search-icon-green@2x.webp'); background-repeat: no-repeat; background-position: 28px center; background-size: 24px 24px; cursor: text; }
.insights-search-input { border: none; outline: none; background: transparent; font-family: var(--text-font); font-size: 12px; font-weight: 500; letter-spacing: 1.2px; color: var(--Primary); width: 100%; -webkit-appearance: none; appearance: none; }
.insights-search-input::placeholder { color: var(--Primary); opacity: 1; }

/* Cards */
.insight-card { width: calc(25% - 24px); padding: 8px; box-shadow: 0 1px 8px 0 rgba(107, 114, 128, 0.10); transition: box-shadow 0.25s; border-radius: 16px;
  border: 1px solid var(--Subtle); }
.insight-card:hover { box-shadow: 0 6px 28px 0 rgba(0, 77, 153, 0.14); }
.insight-card-image { min-height: 146px; max-height: 146px;}
.insight-card-body { flex: 1; padding:16px 12px 12px; }
.insight-card-body h3 { font-size: 18px; line-height: 27px; font-weight: 400; color: var(--Primary); margin-bottom: 8px; }
.insight-card-body h3 a { color: inherit; }
.insight-card-body h3 a:hover { color: var(--Secondary); }
.insight-card-excerpt { color: var(--Body-text); margin-bottom: 14px; }
.insight-card-excerpt p { margin-bottom: 0; }
.insight-card-footer { gap: 6px; margin-top: 15px; }
.insight-card-wrap-date { gap: 6px; flex: 1; }

hr.gray-line { border: none; border-top: 1px solid var(--Foreground-Muted); margin: 0; width: 100%; opacity: 0.2; }

/* Tags */
.insight-tag a{ font-size: 12px; font-weight: 400; padding: 5px 8px; letter-spacing: 0.4px; color: var(--Primary); line-height: 18px; white-space: nowrap; background: var(--Subtle); }
.insight-tag a:hover{background-color: var(--Secondary); color: var(--White);}
.insight-date { color: var(--Body-text); white-space: nowrap; }
.insight-tag{line-height: 12px;}

/* Arrow */
.insight-arrow { width: 28px;color: var(--Foreground);
  opacity: 0.5;
  font-size: 20px;
  width: fit-content;
  transition: var(--b-transition); }
.insight-arrow:hover {opacity: 1; color: var(--Secondary); }


/* ================================================
   RESPONSIVE
   ================================================ */

@media only screen and (min-width: 1024px) {
.insights-row { gap: 32px; margin-bottom: 40px; }
.insights-search-label{margin-bottom: 32px;}

}

@media only screen and (max-width: 1199px) and (min-width: 768px) {
    .insight-card { width: calc(33.33333% - 22px); }
}

@media only screen and (max-width: 1023px) and (min-width: 768px) {
    .insights-row { gap: 16px; margin-bottom: 40px;}
    .insight-card { width: calc(50% - 8px); }
    .ot-main { gap: 40px; padding: 56px 0 40px; }
    .in-filter-top { padding: 0 0 40px; }
.insights-search-label{margin-bottom: 32px;}

}

@media only screen and (max-width: 767px) and (min-width: 0px) {
    .insights-search-wrap { margin-bottom: 20px; }
    .insights-search-box { gap: 10px; }
    .in-filter-top { padding: 0; margin-bottom: 26px; }
    .in-pill { font-size: 14px; padding: 9px 10px; }
    .insights-row { gap: 24px; margin-bottom: 32px; }
    .insight-card { width: 100%; }
    .insight-card-body { padding: 20px 12px 12px; }
    .insight-card-body h3 { font-size: 18px; line-height: 27px; }
    
    .insight-card-image { height: 181px; }
.insights-search-label{margin-bottom: 32px;}
.insight-card-footer {margin-top: 11px;}

}
