/* =====================================================================
   Briefcase Quote Slider  v1.3.0
   Bare slider: NO background, NO padding. White text by default.
   Hardened against theme styles (themes love to style <blockquote>,
   <figure>, <ul>… so the reset below uses !important to stay clean).
   Override any --bqs-* variable to restyle.
   ===================================================================== */

.bqs{
	/* brand accents (used only on the controls) */
	--bqs-accent:#0A51C5;
	--bqs-gold:#E4C97E;

	/* text colors — white by default (for dark / colored sections) */
	--bqs-quote:#ffffff;
	--bqs-name:#ffffff;
	--bqs-role:rgba(255,255,255,.6);
	--bqs-arrow:#ffffff;
	--bqs-arrow-border:rgba(255,255,255,.32);
	--bqs-dot:rgba(255,255,255,.32);

	--bqs-serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
	--bqs-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
	--bqs-ease:cubic-bezier(.22,.61,.36,1);

	/* per-part font sizes — set in Settings (px), via shortcode attrs, or by
	   overriding these variables. Blank/unset falls back to these defaults. */
	--bqs-quote-size:clamp(1.4rem,1.1rem + 1.5vw,2.4rem);
	--bqs-name-size:1.2rem;
	--bqs-role-size:.78rem;

	position:relative;
	color:var(--bqs-quote);
	background:transparent;
	padding:0;
	margin:0;
}
.bqs *,.bqs *::before,.bqs *::after{box-sizing:border-box}

/* Optional color scheme for LIGHT areas (text only, no background) */
.bqs--light{
	--bqs-quote:#0F1830;
	--bqs-name:#0A51C5;
	--bqs-role:#75808B;
	--bqs-arrow:#0F1830;
	--bqs-arrow-border:rgba(10,19,43,.2);
	--bqs-dot:rgba(10,19,43,.22);
}
/* .bqs--dark is the same as the default — kept for clarity */
.bqs--dark{
	--bqs-quote:#ffffff;
	--bqs-name:#ffffff;
	--bqs-role:rgba(255,255,255,.6);
	--bqs-arrow:#ffffff;
	--bqs-arrow-border:rgba(255,255,255,.32);
	--bqs-dot:rgba(255,255,255,.32);
}

/* Quote size presets (override the global default per slider) */
.bqs--size-small{--bqs-quote-size:clamp(1.05rem,.95rem + .6vw,1.45rem)}
.bqs--size-medium{--bqs-quote-size:clamp(1.4rem,1.1rem + 1.5vw,2.4rem)}
.bqs--size-large{--bqs-quote-size:clamp(1.7rem,1.3rem + 2vw,3rem)}
.bqs--size-xlarge{--bqs-quote-size:clamp(2rem,1.5rem + 2.6vw,3.6rem)}

/* ---------------------------------------------------------------------
   RESET — neutralize inherited theme styling on the slider internals.
   !important is intentional: it makes the slider look identical in every
   theme. (Restyle via the --bqs-* variables above, not by fighting this.)
   --------------------------------------------------------------------- */
.bqs__track,
.bqs__slide,
.bqs__card,
.bqs__cite,
.bqs__quote{
	margin:0 !important;
	padding:0 !important;
	border:0 !important;
	background:none !important;
	list-style:none !important;
	text-indent:0 !important;
	box-shadow:none !important;
}
.bqs__quote{
	color:var(--bqs-quote) !important;
	font-style:normal !important;
	quotes:none !important;
	text-align:inherit;
}
.bqs__quote::after{content:none !important}
.bqs__name{color:var(--bqs-name) !important}
.bqs__role{color:var(--bqs-role) !important}

/* ---------------------------------------------------------------------
   Layout
   --------------------------------------------------------------------- */
.bqs__inner{max-width:860px;margin-inline:auto;position:relative;z-index:1}

.bqs__eyebrow{
	margin:0 0 1.1rem;text-align:center;
	font-family:var(--bqs-sans);font-size:.78rem;font-weight:600;
	letter-spacing:.2em;text-transform:uppercase;color:var(--bqs-name);
}
.bqs__heading{
	margin:0 0 1.6rem;text-align:center;
	font-family:var(--bqs-serif);font-weight:600;line-height:1.1;
	font-size:clamp(1.6rem,1.2rem + 1.5vw,2.4rem);color:var(--bqs-quote);
}

.bqs__viewport{overflow:hidden}
.bqs__track{display:flex;transition:transform .6s var(--bqs-ease);will-change:transform}
.bqs__slide{flex:0 0 100%;min-width:0}
.bqs__card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.1rem}

.bqs__quote{
	font-family:var(--bqs-serif);font-weight:500;
	font-size:var(--bqs-quote-size) !important;line-height:1.34;letter-spacing:-.005em;
	max-width:24ch !important;position:relative;
}
.bqs:not(.bqs--nomark) .bqs__quote::before{
	content:"\201C" !important;     /* decorative opening quote, scales with the quote */
	display:block;font-family:var(--bqs-serif);font-weight:600;
	font-size:1.6em;line-height:.4;color:currentColor;opacity:.16;margin:0 0 .35rem;
}
.bqs--nomark .bqs__quote::before{content:none !important}

.bqs__cite{display:flex;flex-direction:column;gap:.25rem}
.bqs__name{font-family:var(--bqs-serif);font-weight:600;font-size:var(--bqs-name-size) !important;letter-spacing:.01em}
.bqs__role{font-family:var(--bqs-sans);font-size:var(--bqs-role-size) !important;letter-spacing:.16em;text-transform:uppercase;opacity:.9}

/* Left-aligned variant */
.bqs--left .bqs__card{align-items:flex-start;text-align:left}
.bqs--left .bqs__quote{max-width:34ch !important}
.bqs--left .bqs__eyebrow,
.bqs--left .bqs__heading{text-align:left}
.bqs--left .bqs__dots{justify-content:flex-start}

/* Stage = the slide viewport flanked by the side arrows */
.bqs__stage{position:relative}

/* Arrows pinned to the left & right, vertically centered on the quote */
.bqs__arrow{
	position:absolute;top:50%;z-index:3;
	width:46px;height:46px;border-radius:50%;padding:0;cursor:pointer;
	border:1.5px solid var(--bqs-arrow-border);background:transparent;color:var(--bqs-arrow);
	display:flex;align-items:center;justify-content:center;box-shadow:none;
	transition:background .25s var(--bqs-ease),border-color .25s,color .25s,transform .25s;
}
.bqs__prev{left:0;transform:translateY(-50%)}
.bqs__next{right:0;transform:translateY(-50%)}
.bqs__arrow svg{width:22px;height:22px;display:block}
.bqs__arrow:hover{background:var(--bqs-accent);border-color:var(--bqs-accent);color:#fff}
.bqs__prev:hover{transform:translateY(-50%) scale(1.06)}
.bqs__next:hover{transform:translateY(-50%) scale(1.06)}
.bqs__arrow:focus-visible{outline:3px solid var(--bqs-accent);outline-offset:3px}

/* Reserve room for the side arrows so they never overlap the text */
.bqs--has-arrows .bqs__card{padding-inline:clamp(56px,7vw,64px) !important}

/* Dots, centered below */
.bqs__dots{display:flex;justify-content:center;gap:.5rem;margin:1.4rem 0 0;padding:0;list-style:none}
.bqs__dot{
	width:9px;height:9px;border-radius:50%;border:0;padding:0;cursor:pointer;
	background:var(--bqs-dot);opacity:.5;box-shadow:none;
	transition:transform .25s var(--bqs-ease),background .25s,opacity .25s;
}
.bqs__dot.is-active{background:var(--bqs-gold);opacity:1;transform:scale(1.35)}
.bqs__dot:focus-visible{outline:2px solid var(--bqs-accent);outline-offset:3px}

@media (prefers-reduced-motion:reduce){
	.bqs__track,.bqs__arrow,.bqs__dot{transition:none}
}
