/* ==========================================================================
   1.8.376 / 1.8.388 — Compact banner hero (cart, shop, product archives), built on the Large Format section header (.lfh / .lfh--navy
   in main.css: navy gradient, faded shop photo, dot texture, sky glow, yellow base rule).
   Full width, thin (~180px desktop), card sits ~40px below.
   ========================================================================== */
:is(.cart-page, .shop-page) .lfh.idxcart-hero {
	display: block; width: 100%; min-height: 0; margin: 0; padding: 2.4rem 0 2.35rem;
	border-radius: 0; box-shadow: none; text-align: left;
}
:is(.cart-page, .shop-page) .idxcart-hero .lfh__bg { opacity: .16; }
:is(.cart-page, .shop-page) .idxcart-hero__photo {
	position: absolute; inset: 0 0 0 auto; width: 58%; z-index: -2;
	background-size: cover; background-position: center 62%; opacity: .5; filter: saturate(.85);
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 70%); mask-image: linear-gradient(90deg, transparent 0, #000 70%);
}
:is(.cart-page, .shop-page) .idxcart-hero__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(15,20,58,.2), rgba(15,20,58,.55)); }
:is(.cart-page, .shop-page) .idxcart-hero__inner { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem 2rem; }
:is(.cart-page, .shop-page) .idxcart-hero .lfh__eyebrow { margin-bottom: .3rem; font-size: .74rem; }
:is(.cart-page, .shop-page) .idxcart-hero h1.idxcart-hero__title { margin: 0; color: #fff; white-space: nowrap; font-size: clamp(1.75rem, 4vw, 2.75rem); line-height: 1.05; letter-spacing: -.01em; }
:is(.cart-page, .shop-page) .idxcart-hero .idxcart-hero__tag { margin: .45rem 0 0; font-size: .9rem; color: rgba(255,255,255,.82); }

/* Shop / archives: no step pills, so the copy can use the full row; long titles scale down on one line
   (--idx-len = character count, set inline by woocommerce.php). */
.shop-page .idxcart-hero h1.idxcart-hero__title { font-size: min(clamp(1.75rem, 4vw, 2.75rem), calc((100vw - 3rem) / (var(--idx-len, 10) * .6))); }
.shop-page .lfh__copy { max-width: 100%; }
.shop-page > #shop-content { padding-top: 40px; }

@media (max-width: 760px) {
	:is(.cart-page, .shop-page) .lfh.idxcart-hero { padding: 1.15rem 0 1.15rem; }
	:is(.cart-page, .shop-page) .idxcart-hero__inner { flex-direction: column; align-items: flex-start; gap: .7rem; }
	:is(.cart-page, .shop-page) .idxcart-hero__photo { width: 100%; opacity: .32; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 85%); mask-image: linear-gradient(90deg, transparent 0, #000 85%); }
	:is(.cart-page, .shop-page) .idxcart-hero h1.idxcart-hero__title { font-size: clamp(1.6rem, 8.5vw, 2.1rem); }
	:is(.cart-page, .shop-page) .idxcart-hero .idxcart-hero__tag { display: none; }
	.shop-page .idxcart-hero h1.idxcart-hero__title { font-size: min(clamp(1.6rem, 8.5vw, 2.1rem), calc((100vw - 2.75rem) / (var(--idx-len, 10) * .6))); }
	.shop-page > #shop-content { padding-top: 28px; }
}

/* 1.8.433 — My Account reuses the shop banner; copy lines up full width like the shop archive (40/24/14px sides). */
.account-page .idxacct-hero > .container { width: auto; max-width: none; margin-inline: 40px; }
@media (max-width: 1023.98px) { .account-page .idxacct-hero > .container { margin-inline: 24px; } }
@media (max-width: 600px) { .account-page .idxacct-hero > .container { margin-inline: 14px; } }

/* 1.8.434 — Cart + Checkout match the shop banner: full-width copy (40/24/14px sides), subline on one line on desktop. */
:is(.cart-page, .checkout-page) .idxcart-hero > .container { width: auto; max-width: none; margin-inline: 40px; }
@media (max-width: 1023.98px) { :is(.cart-page, .checkout-page) .idxcart-hero > .container { margin-inline: 24px; } }
@media (max-width: 600px) { :is(.cart-page, .checkout-page) .idxcart-hero > .container { margin-inline: 14px; } }
@media (min-width: 761px) { .idxshop-hero .lfh__tag.idxcart-hero__tag { max-width: 46rem; } }