/* BTQ Insights category archive — matches the /insights/ index look.
   rem root = 62.5% (1rem = 10px); all sizes >= 1.2rem. */

.btq-insights-archive { font-family: "Mulish", sans-serif; color: #001F33; }
.btq-insights-archive a { text-decoration: none; }

/* Hero — matches the /insights/ index hero (plum radial glow, DM Serif title) */
.btq-archive-hero {
	background-color: #0B171F;
	background-image: radial-gradient(at 50% 0%, #6B2C66 0%, #0B171F 24%);
	padding: 10rem 2rem;
	text-align: center;
}
.btq-archive-hero__inner { max-width: 90rem; margin: 0 auto; }
/* Eyebrow chip — matches the /insights/ hero pill: rounded RECTANGLE (radius .5rem),
   solid #EDF0F1 border, tight 5px/10px padding, line-height:1 so its height = font+padding. */
.btq-archive-hero__eyebrow {
	display: inline-block; font-family: "Mulish", sans-serif; font-size: 1.2rem; font-weight: 500;
	letter-spacing: .1rem; line-height: 1; text-transform: uppercase; color: #EDF0F1;
	border: 1px solid #EDF0F1; border-radius: .5rem;
	padding: .5rem 1rem; margin-bottom: 2.4rem;
}
.btq-insights-archive .btq-archive-hero__title {
	font-family: "DM Serif Display", Georgia, serif; font-weight: 400;
	font-size: 5.8rem; line-height: 1.1; color: #B3E0FF; margin: 0 0 1.6rem;
}
.btq-archive-hero__intro {
	font-size: 1.9rem; line-height: 1.6; font-weight: 300; color: #EDF0F1; max-width: 62rem; margin: 0 auto;
}

/* Nav pills */
.btq-archive-nav { max-width: 120rem; margin: 4rem auto 0; padding: 0 2rem; }
/* Filter variant injected on the /insights/ index (above the loop grid): the hero
   section already supplies the top gap, so drop the top margin and add space below. */
.btq-archive-nav--filter { margin: 0 auto 4rem; }
.btq-archive-nav__list {
	display: flex; flex-wrap: wrap; gap: 1.2rem; justify-content: center;
	list-style: none; margin: 0; padding: 0;
}
.btq-archive-nav__pill {
	display: inline-block; font-size: 1.4rem; font-weight: 600; color: #003D66;
	background: #EDF0F1; border: 1px solid #D5D9DD; border-radius: 3rem; padding: .8rem 2rem;
	transition: background .15s, color .15s;
}
.btq-archive-nav__pill:hover { background: #E6F4FF; }
.btq-archive-nav__pill.is-current { background: #003D66; color: #fff; border-color: #003D66; }

/* Body + grid */
.btq-archive-body { max-width: 120rem; margin: 0 auto; padding: 5rem 2rem 6rem; }
.btq-archive-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4rem 3rem; }
@media (max-width: 1024px) { .btq-archive-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px)  { .btq-archive-grid { grid-template-columns: 1fr; } }

/* Card */
.btq-archive-card { display: flex; flex-direction: column; }
.btq-archive-card__media {
	display: block; overflow: hidden; border-radius: .6rem; aspect-ratio: 16 / 10; background: #fff; border: 1px solid #E4E9ED;
}
/* contain (not cover) so logo/graphic featured images show in full instead of
   being cropped at the edges; padding frames the letterbox as intentional. */
.btq-archive-card__img { width: 100%; height: 100%; object-fit: contain; object-position: center; display: block; padding: 1.2rem; box-sizing: border-box; transition: transform .3s; }
.btq-archive-card:hover .btq-archive-card__img { transform: scale(1.04); }
.btq-archive-card__media--placeholder { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, #003D66, #3E73DB); }
.btq-archive-card__body { padding: 1.6rem 0 0; }
/* Meta row — matches the /insights/ card: date left, category pill right,
   with the divider line BELOW the row (border-bottom), above the title. */
.btq-archive-card__meta {
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	border-bottom: 1px solid #D5D9DD; padding-bottom: 1.6rem; margin-bottom: 1.6rem;
}
.btq-archive-card__date {
	font-size: 1.2rem; font-weight: 300; letter-spacing: .03rem;
	text-transform: uppercase; color: #454C54; margin: 0;
}
.btq-archive-card__badge {
	display: inline-block; font-size: 1.2rem; font-weight: 400; line-height: 1; color: #003D66;
	background: #E6F4FF; border-radius: .5rem; padding: .5rem 1rem;
	white-space: nowrap; margin: 0;
}
.btq-insights-archive .btq-archive-card__title { font-family: "Mulish", sans-serif; font-size: 2.5rem; line-height: 1.2; font-weight: 300; margin: 0 0 1rem; }
.btq-archive-card__title a { color: #001F33; }
.btq-archive-card__title a:hover { color: #003D66; }
.btq-archive-card__excerpt { font-size: 1.8rem; line-height: 1.6; font-weight: 300; color: #454C54; margin: 0; }

/* Empty state */
.btq-archive-empty { text-align: center; font-size: 1.6rem; color: #454C54; padding: 4rem 0; }
.btq-archive-empty a { color: #003D66; font-weight: 700; }

/* Pagination */
.btq-archive-pagination { margin-top: 5rem; text-align: center; }
.btq-archive-pagination .page-numbers {
	display: inline-block; min-width: 4rem; text-align: center; padding: .9rem 1.2rem;
	margin: 0 .3rem; font-size: 1.4rem; color: #003D66; border: 1px solid #D5D9DD; border-radius: .6rem;
}
.btq-archive-pagination .page-numbers.current { background: #003D66; color: #fff; border-color: #003D66; }
.btq-archive-pagination a.page-numbers:hover { background: #E6F4FF; }

/* CTA band — matches the /insights/ "Let's Get Started" block: the abstract-texture
   image at full strength over the navy primary fallback (no overlay wash — the
   Elementor block's ::before overlay is empty, --overlay-opacity is a no-op). */
.btq-archive-cta {
	background-color: #003D66;
	background-image: url("https://btqfinancial.com/wp-content/uploads/2026/01/abstract-texture-firefly-layers.webp");
	background-size: cover;
	background-position: center;
	text-align: center;
	padding: 6rem 2rem;
}
.btq-archive-cta__inner { max-width: 70rem; margin: 0 auto; }
/* CTA typography matches the /insights/ "Let's Get Started" block:
   title Mulish 4rem/200 line-height 1.5; subtext 2rem/300 #fff; button 1.5rem/600. */
.btq-insights-archive .btq-archive-cta__title { font-family: "Mulish", sans-serif; font-weight: 200; font-size: 4rem; line-height: 1.5; color: #fff; margin: 0 0 1.2rem; }
.btq-archive-cta__text { font-size: 2rem; font-weight: 300; line-height: 1.5; color: #fff; margin: 0 0 2.8rem; }
.btq-insights-archive .btq-archive-cta__btn {
	display: inline-block; font-size: 1.5rem; font-weight: 600; line-height: 1; letter-spacing: .07rem; color: #fff;
	background-image: linear-gradient(90deg, #3E73DB 0%, #8A0F82 100%);
	padding: 1.5rem 2rem; border-radius: 10rem; transition: filter .15s;
}
/* Keep the label white on hover — beats the kit's .elementor-kit-7 a:hover (0,0,2,1). */
.btq-insights-archive .btq-archive-cta__btn:hover { color: #fff; filter: brightness(1.08); }

/* Responsive hero */
@media (max-width: 767px) {
	.btq-archive-hero { padding: 5rem 1.6rem 4rem; }
	.btq-insights-archive .btq-archive-hero__title { font-size: 3.8rem; }
	.btq-archive-hero__intro { font-size: 1.6rem; }
}

/* -------------------------------------------------------------------------
   /insights/ index (Elementor page 1001) loop-grid card images.
   This archive stylesheet is already enqueued on the index (it also injects
   the category-filter pills there). Each loop-item (template 2002) renders its
   featured image as a CSS background on container .elementor-element-ff68455
   with background-size:cover, which crops logo/graphic images at the edges --
   the same problem the archive cards had. Match the archive fix: contain the
   whole image so nothing is cropped. !important + the compound selector (the
   extra .e-con -> specificity 0,0,3,0) beat Elementor's generated per-element
   background-size:cover rule, which is 0,0,2,0 and loads after this file. The
   element ID is a loop-item template constant shared by every card; it only
   changes if template 2002 is re-saved in Elementor.
------------------------------------------------------------------------- */
.elementor-widget-loop-grid .elementor-element-ff68455.e-con {
	background-size: contain !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
}
