/*
 * The quote drawer's top band on Global Select pages (Jay 2026-10-23 14:32; since 2026-10-24 also the Request Samples popup
 * when the plugin fixes its context (.swp-qp--samples.swp-qp--fixed, sw2's GS1 hooks; includes/samples-popup.php)): the entry hero's look instead of the
 * light sage band with the mountain watermark. sw2's drawer (theme: inc/features/quote-popups.php, quote-popup.css,
 * quote-popups.js) is untouched: these rules re-skin .swp-qp__band only under the Global Select body classes
 * (.gs-page = a stone page, .gs-entry-page, .gs-coll-page = the entry / collection / natural-stone pages). The body
 * of the drawer (title, fields, the HubSpot form, the button) is not touched. Loaded only on those pages.
 *
 * Background: a 600 × 184 WebP crop of the entry hero photo (assets/img/drawer-bg.webp, 7 KB) under the hero's
 * neutral charcoal shade (rgb 20 26 20), here at 0.78: the band is small and its text (cream, light grey, sage) sits
 * over the whole crop, and 0.78 is the value at which every pixel of the crop keeps the sage ≥ 4.5:1 (measured:
 * sage 5.2, grey 6.9, cream 8.0 at the brightest pixel, the quarry's white). A CSS background is fetched only when
 * the element renders, and the drawer is hidden until opened: the photo never loads with the page.
 */
.gs-page .swp-qp--quote .swp-qp__band,
.gs-page .swp-qp--samples.swp-qp--fixed .swp-qp__band,
.gs-entry-page .swp-qp--quote .swp-qp__band,
.gs-entry-page .swp-qp--samples.swp-qp--fixed .swp-qp__band,
.gs-coll-page .swp-qp--quote .swp-qp__band,
.gs-coll-page .swp-qp--samples.swp-qp--fixed .swp-qp__band {
	background: linear-gradient(to bottom, rgba(20, 26, 20, 0.78), rgba(20, 26, 20, 0.78)), #2f3f2e url(../img/drawer-bg.webp) center 42% / cover no-repeat;
	border-bottom-color: rgba(245, 243, 238, 0.18);
	color: #f5f3ee;
}
/* No icon watermark. */
.gs-page .swp-qp--quote .swp-qp__mark,
.gs-page .swp-qp--samples.swp-qp--fixed .swp-qp__mark,
.gs-entry-page .swp-qp--quote .swp-qp__mark,
.gs-entry-page .swp-qp--samples.swp-qp--fixed .swp-qp__mark,
.gs-coll-page .swp-qp--quote .swp-qp__mark,
.gs-coll-page .swp-qp--samples.swp-qp--fixed .swp-qp__mark { display: none; }
/* The stone thumbnail keeps a white frame. */
.gs-page .swp-qp--quote .swp-qp__thumb,
.gs-page .swp-qp--samples.swp-qp--fixed .swp-qp__thumb,
.gs-entry-page .swp-qp--quote .swp-qp__thumb,
.gs-entry-page .swp-qp--samples.swp-qp--fixed .swp-qp__thumb,
.gs-coll-page .swp-qp--quote .swp-qp__thumb,
.gs-coll-page .swp-qp--samples.swp-qp--fixed .swp-qp__thumb { border: 3px solid #ffffff; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35); background: #ffffff; }
/* The eyebrow: the Global Select words (the header's words, Customizer) in Cormorant italic (sage) with the drawer's
   own eyebrow text ("Quote request", the popup UX Block) in small Lato caps under it. The words come through sw2's
   filter swp_qp_eyebrow (quote-popups.php, 2026-10-23 14:58) as <span class="gs-qp-brand"> + <span class="gs-qp-sub">
   (layout.php); the green dot is hidden. */
.gs-page .swp-qp--quote .swp-qp__eyebrow,
.gs-page .swp-qp--samples.swp-qp--fixed .swp-qp__eyebrow,
.gs-entry-page .swp-qp--quote .swp-qp__eyebrow,
.gs-entry-page .swp-qp--samples.swp-qp--fixed .swp-qp__eyebrow,
.gs-coll-page .swp-qp--quote .swp-qp__eyebrow,
.gs-coll-page .swp-qp--samples.swp-qp--fixed .swp-qp__eyebrow {
	display: block;
	letter-spacing: 0;
	text-transform: none;
	color: #dfe3dc;
}
.gs-page .swp-qp--quote .swp-qp__dot,
.gs-page .swp-qp--samples.swp-qp--fixed .swp-qp__dot,
.gs-entry-page .swp-qp--quote .swp-qp__dot,
.gs-entry-page .swp-qp--samples.swp-qp--fixed .swp-qp__dot,
.gs-coll-page .swp-qp--quote .swp-qp__dot,
.gs-coll-page .swp-qp--samples.swp-qp--fixed .swp-qp__dot { display: none; }
.gs-page .swp-qp--quote .gs-qp-brand,
.gs-page .swp-qp--samples.swp-qp--fixed .gs-qp-brand,
.gs-entry-page .swp-qp--quote .gs-qp-brand,
.gs-entry-page .swp-qp--samples.swp-qp--fixed .gs-qp-brand,
.gs-coll-page .swp-qp--quote .gs-qp-brand,
.gs-coll-page .swp-qp--samples.swp-qp--fixed .gs-qp-brand {
	display: block;
	font: italic 500 20px/1.1 "Cormorant Garamond", Georgia, "Times New Roman", serif;
	letter-spacing: 0.02em;
	text-transform: none;
	color: #b5cdae; /* a lighter sage: 5.2:1 over the brightest pixel of the crop at 0.78 (#9ebc96 would be 3.9) */
}
.gs-page .swp-qp--quote .gs-qp-sub,
.gs-page .swp-qp--samples.swp-qp--fixed .gs-qp-sub,
.gs-entry-page .swp-qp--quote .gs-qp-sub,
.gs-entry-page .swp-qp--samples.swp-qp--fixed .gs-qp-sub,
.gs-coll-page .swp-qp--quote .gs-qp-sub,
.gs-coll-page .swp-qp--samples.swp-qp--fixed .gs-qp-sub {
	display: block;
	margin-top: 3px;
	font: 700 11px/1.3 Lato, "Lato Fallback", "Helvetica Neue", Arial, sans-serif;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #dfe3dc;
}
/* The stone name in Cormorant, the natural stone in small Lato caps, both cream. */
.gs-page .swp-qp--quote .swp-qp__name,
.gs-page .swp-qp--samples.swp-qp--fixed .swp-qp__name,
.gs-entry-page .swp-qp--quote .swp-qp__name,
.gs-entry-page .swp-qp--samples.swp-qp--fixed .swp-qp__name,
.gs-coll-page .swp-qp--quote .swp-qp__name,
.gs-coll-page .swp-qp--samples.swp-qp--fixed .swp-qp__name {
	margin-top: 4px;
	font: 500 26px/1.15 "Cormorant Garamond", Georgia, "Times New Roman", serif;
	letter-spacing: 0.01em;
	color: #f5f3ee;
}
.gs-page .swp-qp--quote .swp-qp__sub,
.gs-page .swp-qp--samples.swp-qp--fixed .swp-qp__sub,
.gs-entry-page .swp-qp--quote .swp-qp__sub,
.gs-entry-page .swp-qp--samples.swp-qp--fixed .swp-qp__sub,
.gs-coll-page .swp-qp--quote .swp-qp__sub,
.gs-coll-page .swp-qp--samples.swp-qp--fixed .swp-qp__sub {
	margin-top: 2px;
	font: 700 11px/1.3 Lato, "Lato Fallback", "Helvetica Neue", Arial, sans-serif;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #dfe3dc;
}
/* The × in cream, a visible focus ring. */
.gs-page .swp-qp--quote .swp-qp__close,
.gs-page .swp-qp--samples.swp-qp--fixed .swp-qp__close,
.gs-entry-page .swp-qp--quote .swp-qp__close,
.gs-entry-page .swp-qp--samples.swp-qp--fixed .swp-qp__close,
.gs-coll-page .swp-qp--quote .swp-qp__close,
.gs-coll-page .swp-qp--samples.swp-qp--fixed .swp-qp__close { color: #f5f3ee; }
.gs-page .swp-qp--quote .swp-qp__close:hover,
.gs-page .swp-qp--samples.swp-qp--fixed .swp-qp__close:hover,
.gs-entry-page .swp-qp--quote .swp-qp__close:hover,
.gs-entry-page .swp-qp--samples.swp-qp--fixed .swp-qp__close:hover,
.gs-coll-page .swp-qp--quote .swp-qp__close:hover,
.gs-coll-page .swp-qp--samples.swp-qp--fixed .swp-qp__close:hover { background: rgba(245, 243, 238, 0.16); color: #ffffff; }
.gs-page .swp-qp--quote .swp-qp__close:focus-visible,
.gs-page .swp-qp--samples.swp-qp--fixed .swp-qp__close:focus-visible,
.gs-entry-page .swp-qp--quote .swp-qp__close:focus-visible,
.gs-entry-page .swp-qp--samples.swp-qp--fixed .swp-qp__close:focus-visible,
.gs-coll-page .swp-qp--quote .swp-qp__close:focus-visible,
.gs-coll-page .swp-qp--samples.swp-qp--fixed .swp-qp__close:focus-visible { background: rgba(245, 243, 238, 0.16); color: #ffffff; outline: 2px solid #f5f3ee; outline-offset: 2px; }
@media (max-width: 549px) {
	.gs-page .swp-qp--quote .gs-qp-brand,
	.gs-page .swp-qp--samples.swp-qp--fixed .gs-qp-brand,
	.gs-entry-page .swp-qp--quote .gs-qp-brand,
	.gs-entry-page .swp-qp--samples.swp-qp--fixed .gs-qp-brand,
	.gs-coll-page .swp-qp--quote .gs-qp-brand,
	.gs-coll-page .swp-qp--samples.swp-qp--fixed .gs-qp-brand { font-size: 17px; }
	.gs-page .swp-qp--quote .swp-qp__name,
	.gs-page .swp-qp--samples.swp-qp--fixed .swp-qp__name,
	.gs-entry-page .swp-qp--quote .swp-qp__name,
	.gs-entry-page .swp-qp--samples.swp-qp--fixed .swp-qp__name,
	.gs-coll-page .swp-qp--quote .swp-qp__name,
	.gs-coll-page .swp-qp--samples.swp-qp--fixed .swp-qp__name { font-size: 22px; }
}
