/* Stravum Builder — widget base styles (all per-instance styling comes from
   the style engine; this is only the structural minimum). */

/* ---------------------------- Entrance animations ----------------------------
   Two states are made MUTUALLY EXCLUSIVE via :not(.st-in), so there is never
   a specificity contest between the hidden and revealed rules in either
   direction (add OR remove .st-in) — this is the standard, robust pattern
   for a two-state CSS toggle; a same-specificity !important tug-of-war was
   tried first and was unreliable removing .st-in (hide/replay direction).
   Initial hidden/offset state is scoped OUT of the block-editor canvas
   (body.editor-styles-wrapper) so widgets stay fully visible while editing —
   only real front-end visitors see the pre-animation state. widgets.js adds
   .st-in via IntersectionObserver to trigger the transition; duration/delay
   are set inline per-instance from data-st-anim-* attributes. */
[data-st-animate] {
	transition-property: opacity, transform;
	transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
}
body:not(.editor-styles-wrapper) [data-st-animate]:not(.st-in) {
	opacity: 0;
	will-change: opacity, transform;
}
body:not(.editor-styles-wrapper) [data-st-animate="fade-up"]:not(.st-in) { transform: translateY(24px); }
body:not(.editor-styles-wrapper) [data-st-animate="fade-down"]:not(.st-in) { transform: translateY(-24px); }
body:not(.editor-styles-wrapper) [data-st-animate="fade-left"]:not(.st-in) { transform: translateX(24px); }
body:not(.editor-styles-wrapper) [data-st-animate="fade-right"]:not(.st-in) { transform: translateX(-24px); }
body:not(.editor-styles-wrapper) [data-st-animate="zoom-in"]:not(.st-in) { transform: scale(0.92); }
body:not(.editor-styles-wrapper) [data-st-animate="slide-up"]:not(.st-in) { transform: translateY(48px); }
body:not(.editor-styles-wrapper) [data-st-animate="slide-left"]:not(.st-in) { transform: translateX(48px); }
body:not(.editor-styles-wrapper) [data-st-animate="slide-right"]:not(.st-in) { transform: translateX(-48px); }

[data-st-animate].st-in {
	opacity: 1;
	transform: none;
	/* transition-duration / transition-delay set inline by widgets.js per-instance. */
}

@media (prefers-reduced-motion: reduce) {
	[data-st-animate] {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

.st-container {
	display: flex;
	flex-direction: column;
}
/* Boxed mode: the inner wrapper inherits the container's flex settings so
   direction/justify/align/gap controls behave identically boxed or full. */
.st-container-inner {
	width: 100%;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	flex-direction: inherit;
	justify-content: inherit;
	align-items: inherit;
	flex-wrap: inherit;
	gap: inherit;
}

/* A core wp:columns block dropped directly inside a Stravum container
   inherits the container's align-items via .st-container-inner's
   `align-items: inherit` above. Flexbox's default cross-axis behavior for
   any value other than `stretch` (e.g. align_items:"center", used to
   center a single narrow element like a badge) is to shrink each child to
   its own content width — but a *row of columns* is never meant to
   shrink-wrap like a badge would, it's meant to always span the
   container. Without this rule a centered container with a columns row
   inside it silently narrows the whole row to its content's minimum
   width, which both crowds the columns together AND can force large text
   (e.g. a 76px hollow stat number) to wrap where an identical column
   elsewhere on the same page — differing only in the container's boxed
   width — does not. Scoped to wp-core's own columns block specifically;
   other child types (badges, buttons, single headings) keep their
   intentional shrink-to-fit centering. */
.st-container-inner > .wp-block-columns,
.st-container > .wp-block-columns {
	width: 100%;
	align-self: stretch;
}

.st-heading {
	margin: 0;
}
.st-heading a {
	color: inherit;
	text-decoration: none;
}

.st-button-wrap {
	margin: 0;
}
.st-button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	text-decoration: none;
	background-color: #fd5b38;
	color: #590c00;
	padding: 14px 32px;
	border-radius: 12px;
	font-weight: 700;
	line-height: 1.2;
	/* transform gets a punchier "ease-out" curve (matches the site's other
	   reveal/panel motion); color/bg/shadow stay on a flatter ease so hover
	   fades don't feel sluggish. The widget's optional "Transition Duration"
	   control (a per-instance <style> with higher specificity) overrides this
	   wholesale with `transition: all {{VAL}} ease;` when a user sets it. */
	transition: transform 0.3s cubic-bezier(0.22, 0.61, 0.36, 1), background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.st-button .st-button-icon {
	font-size: 1.2em;
	line-height: 1;
}

.st-text {
	margin: 0;
}
.st-text p {
	margin: 0 0 1em;
}
.st-text p:last-child {
	margin-bottom: 0;
}

.st-image-wrap {
	margin: 0;
	line-height: 0;
}
.st-image-wrap img {
	max-width: 100%;
	height: auto;
	display: inline-block;
}
.st-image-caption {
	line-height: 1.5;
	font-size: 13px;
	color: #a9adc1;
	margin-top: 8px;
}

.st-icon-wrap {
	line-height: 0;
}
.st-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.st-spacer {
	width: 100%;
}

.st-divider-wrap {
	display: flex;
	width: 100%;
}
.st-divider {
	border-top: 1px solid #aa8982;
	width: 100%;
}

.st-text ul,
.st-text ol {
	margin: 0 0 1em;
	padding-left: 1.25em;
}
.st-text li {
	margin-bottom: 0.55em;
}
.st-text li::marker {
	color: #fd5b38;
}

/* ------------------------------- Icon List ------------------------------ */
.st-il { list-style: none; margin: 0; padding: 0; }
.st-il-item { display: flex; align-items: center; gap: 10px; }
.st-il-item + .st-il-item { margin-top: 12px; }
.st-il.st-il-inline { display: flex; flex-wrap: wrap; gap: 12px 28px; }
.st-il.st-il-inline .st-il-item { margin-top: 0; }
.st-il-icon { color: #fd5b38; font-size: 20px; line-height: 1; flex-shrink: 0; }
.st-il-text { color: #a9adc1; }
.st-il-text a { color: inherit; text-decoration: none; }
.st-il-text a:hover { color: #ffb4a4; }

/* --------------------------------- FAQ --------------------------------- */
.st-faq-item {
	background: #191c23;
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 14px;
	margin-bottom: 12px;
	overflow: hidden;
}
.st-faq-item summary {
	cursor: pointer;
	padding: 18px 22px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	color: #ffffff;
	font-weight: 600;
	list-style: none;
}
.st-faq-item summary::-webkit-details-marker {
	display: none;
}
.st-faq-icon {
	color: #fd5b38;
	font-size: 20px;
	line-height: 1;
	transition: transform 0.2s ease;
	flex-shrink: 0;
}
.st-faq-item.st-acc-open .st-faq-icon {
	transform: rotate(45deg);
}
.st-faq-a {
	padding: 0 22px 20px;
	color: #a9adc1;
	line-height: 1.7;
	overflow: hidden;
	transition: max-height 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.st-faq-empty {
	padding: 16px;
	color: #a9adc1;
	border: 1px dashed rgba(255, 255, 255, 0.15);
	border-radius: 12px;
}

/* ------------------------------ Builder popups ------------------------------
   The overlay stays in the DOM at all times (never display:none — that can't
   be transitioned); frontend.js toggles .is-open and CSS handles the fade +
   panel scale-in/out, same pattern as the stravum-blocks lead popup. */
.st-popup-overlay {
	position: fixed;
	inset: 0;
	z-index: 120;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	background: rgba(0, 0, 0, 0.72);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0s linear 0.3s;
}
.st-popup-overlay.is-open {
	opacity: 1;
	visibility: visible;
	transition: opacity 0.3s ease, visibility 0s linear 0s;
}
.st-popup-box {
	position: relative;
	width: 100%;
	max-width: 640px;
	max-height: 90vh;
	overflow-y: auto;
	background: #1d2027;
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 24px;
	padding: 40px;
	box-shadow: 0 40px 120px rgba(0, 0, 0, 0.5);
	transform: scale(0.94) translateY(12px);
	transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.st-popup-overlay.is-open .st-popup-box {
	transform: scale(1) translateY(0);
}
@media (prefers-reduced-motion: reduce) {
	.st-popup-overlay,
	.st-popup-box {
		transition: none;
	}
}
.st-popup-close {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: #a9adc1;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
}
.st-popup-close:hover {
	background: rgba(255, 255, 255, 0.08);
	color: #fff;
}
.st-alert{display:flex;align-items:flex-start;gap:14px;background:#191c23;border-left:3px solid #fd5b38;border-radius:12px;padding:18px 20px;position:relative;} .st-alert-icon{color:#fd5b38;font-size:22px;line-height:1;flex-shrink:0;} .st-alert-title{color:#fff;font-weight:700;margin-bottom:4px;} .st-alert-msg{color:#A9ADC1;line-height:1.6;} .st-alert-body{flex:1;} .st-alert-close{background:none;border:0;color:#7c8194;font-size:22px;line-height:1;cursor:pointer;padding:0 4px;} .st-alert-close:hover{color:#fff;} .st-alert-success{border-left-color:#22c55e;} .st-alert-success .st-alert-icon{color:#22c55e;} .st-alert-warning{border-left-color:#f59e0b;} .st-alert-warning .st-alert-icon{color:#f59e0b;} .st-alert-error{border-left-color:#ef4444;} .st-alert-error .st-alert-icon{color:#ef4444;}
/* Contact form */
.st-cf-grid { display: flex; flex-wrap: wrap; gap: 16px; }
.st-cf-field { flex: 1 1 100%; display: flex; flex-direction: column; gap: 6px; }
.st-cf-half { flex: 1 1 calc(50% - 8px); min-width: 220px; }
.st-cf-label { color: #e0e2ec; font-size: 14px; font-weight: 600; }
.st-cf-input { background: #0A0C10; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; padding: 13px 15px; color: #fff; font-size: 15px; font-family: inherit; width: 100%; }
.st-cf-input:focus { outline: none; border-color: #fd5b38; }
textarea.st-cf-input { resize: vertical; }
.st-cf-btn { margin-top: 18px; background: #fd5b38; color: #590c00; border: 0; border-radius: 12px; padding: 15px 32px; font-weight: 700; font-size: 15px; cursor: pointer; }
.st-cf-btn:hover { filter: brightness(1.08); }
.st-cf-hp { position: absolute; left: -9999px; height: 0; overflow: hidden; }
.st-cf-success { display: flex; align-items: center; gap: 14px; background: rgba(34,197,94,.08); border: 1px solid rgba(34,197,94,.3); border-radius: 14px; padding: 22px 24px; color: #e0e2ec; }
.st-cf-success .material-symbols-outlined { color: #22c55e; font-size: 30px; }
.st-cf-success p { margin: 0; }
.st-cf-error { background: rgba(239,68,68,.08); border: 1px solid rgba(239,68,68,.3); border-radius: 12px; padding: 14px 18px; color: #ffb4ab; margin-bottom: 16px; }

/* Lightbox (gallery) */
.st-lightbox { position: fixed; inset: 0; z-index: 200; background: rgba(0,0,0,.9); display: flex; align-items: center; justify-content: center; padding: 32px; cursor: zoom-out; }
.st-lightbox-img { max-width: 92vw; max-height: 88vh; object-fit: contain; border-radius: 10px; }
.st-lightbox-close { position: absolute; top: 18px; right: 22px; background: none; border: 0; color: #fff; font-size: 36px; line-height: 1; cursor: pointer; }
.st-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
.st-gal-item{position:relative;display:block;overflow:hidden;border-radius:14px;aspect-ratio:1/1;background:#191c23;text-decoration:none;}
.st-gal-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease;}
.st-gal-item:hover img{transform:scale(1.06);}
.st-gal-ph{display:flex;align-items:center;justify-content:center;height:100%;color:#7c8194;font-family:"Geist",sans-serif;text-transform:uppercase;letter-spacing:.1em;font-size:12px;}
.st-gal-cap{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.75));color:#fff;font-size:13px;}
@media (max-width:767px){.st-gallery{grid-template-columns:repeat(2,minmax(0,1fr));}}
.st-map{line-height:0;}
.st-map iframe{width:100%;height:400px;border:0;display:block;border-radius:14px;}
/* Stravum Builder — Icon Box widget styles.
   .st-ib is intentionally bare: alignment comes from the `align` control's
   text-align on the wrapper, and .st-ib-icon (inline-flex) follows it. */
.st-ib {
}
.st-ib-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fd5b38;
	background: rgba(253, 91, 56, .1);
	margin-bottom: 20px;
}
.st-ib-icon .material-symbols-outlined {
	font-size: 40px;
	line-height: 1;
}
.st-ib-title {
	color: #fff;
	margin: 0 0 10px;
	font-family: "Plus Jakarta Sans", sans-serif;
	font-size: 22px;
	font-weight: 700;
}
.st-ib-desc {
	color: #A9ADC1;
	margin: 0;
	line-height: 1.7;
}
.st-ib > a {
	text-decoration: none;
	display: block;
}
/* Stravum Builder — Image Box widget styles. */
.st-imgb-media {
	line-height: 0;
	margin-bottom: 20px;
}
.st-imgb-media img {
	max-width: 100%;
	height: auto;
	border-radius: 14px;
}
.st-imgb-title {
	color: #fff;
	margin: 0 0 10px;
	font-family: "Plus Jakarta Sans", sans-serif;
	font-size: 22px;
	font-weight: 700;
}
.st-imgb-desc {
	color: #A9ADC1;
	margin: 0;
	line-height: 1.7;
}
.st-imgb > a {
	text-decoration: none;
	display: block;
}
/* Counter */
.st-counter-num { font-family: "Plus Jakarta Sans", sans-serif; font-size: 56px; font-weight: 800; color: #fff; line-height: 1; display: inline-block; }
.st-counter-title { color: #a9adc1; margin-top: 8px; font-family: "Geist", sans-serif; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; }

/* Progress */
.st-progress-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.st-progress-title { color: #fff; font-weight: 600; }
.st-progress-pct { color: #fd5b38; font-weight: 700; }
.st-progress-track { background: rgba(255,255,255,.08); height: 10px; border-radius: 999px; overflow: hidden; }
.st-progress-bar { height: 100%; background: #fd5b38; border-radius: 999px; width: 0; transition: width 1.2s cubic-bezier(.22,.61,.36,1); }

/* Tabs */
.st-tabs-nav { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 1px solid rgba(255,255,255,.08); margin-bottom: 20px; }
.st-tabs-btn { background: none; border: 0; border-bottom: 2px solid transparent; color: #a9adc1; padding: 12px 18px; cursor: pointer; font-weight: 600; font-size: 15px; }
.st-tabs-btn:hover { color: #fff; }
.st-tabs-btn.is-active { color: #fd5b38; border-bottom-color: #fd5b38; }
.st-tabs-panel { display: none; color: #a9adc1; line-height: 1.75; }
.st-tabs-panel.is-active { display: block; }
.st-tabs-panel p { margin: 0 0 1em; }
.st-tabs-panel p:last-child { margin-bottom: 0; }

/* Carousel */
.st-carousel { position: relative; }
.st-carousel-viewport { overflow: hidden; border-radius: 14px; }
.st-carousel-track { display: flex; transition: transform .5s cubic-bezier(.22,.61,.36,1); }
.st-carousel-slide { min-width: 100%; flex: 0 0 100%; position: relative; aspect-ratio: 16/9; background: #191c23; }
.st-carousel-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.st-carousel-ph { display: flex; align-items: center; justify-content: center; height: 100%; color: #7c8194; font-family: "Geist", sans-serif; letter-spacing: .1em; text-transform: uppercase; font-size: 13px; }
.st-carousel-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 16px 20px; background: linear-gradient(180deg, transparent, rgba(0,0,0,.75)); color: #fff; font-size: 14px; }
.st-carousel-arrow { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,.5); color: #fff; border: 0; width: 42px; height: 42px; border-radius: 999px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.st-carousel-arrow:hover { background: #fd5b38; color: #590c00; }
.st-carousel-prev { left: 12px; }
.st-carousel-next { right: 12px; }
.st-carousel-dots { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
.st-carousel-dot { width: 9px; height: 9px; border-radius: 999px; border: 0; background: rgba(255,255,255,.25); cursor: pointer; padding: 0; }
.st-carousel-dot.is-active { background: #fd5b38; }
.st-nl-title{color:#fff;font-family:"Plus Jakarta Sans",sans-serif;font-size:22px;font-weight:700;margin-bottom:6px;}
.st-nl-desc{color:#A9ADC1;margin-bottom:16px;}
.st-nl-form{display:flex;gap:10px;flex-wrap:wrap;}
.st-nl-stacked .st-nl-form{flex-direction:column;}
.st-nl-input{flex:1;min-width:220px;background:#0A0C10;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:14px 16px;color:#fff;font-size:15px;}
.st-nl-input:focus{outline:none;border-color:#fd5b38;}
.st-nl-btn{background:#fd5b38;color:#590c00;border:0;border-radius:12px;padding:14px 26px;font-weight:700;cursor:pointer;font-size:15px;}
.st-nl-btn:hover{filter:brightness(1.08);}
.st-nl-hp{position:absolute;left:-9999px;height:0;overflow:hidden;}
.st-soc{display:flex;flex-wrap:wrap;gap:12px;} .st-soc-link{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:999px;background:rgba(255,255,255,.06);color:#e0e2ec;text-decoration:none;transition:all .2s ease;} .st-soc-link:hover{background:#fd5b38;color:#590c00;} .st-soc-link .material-symbols-outlined{font-size:20px;}
.st-rating{display:inline-flex;gap:2px;} .st-rating .material-symbols-outlined{font-size:22px;line-height:1;} .st-star-on{color:#fd5b38;font-variation-settings:'FILL' 1;} .st-star-off{color:#3a3d45;font-variation-settings:'FILL' 1;}
.st-team {
	background: #191c23;
	border: 1px solid rgba(255, 255, 255, .06);
	border-radius: 16px;
	padding: 28px;
	text-align: center;
}
.st-team-photo {
	margin-bottom: 18px;
}
.st-team-photo img {
	width: 120px;
	height: 120px;
	object-fit: cover;
	border-radius: 999px;
	display: inline-block;
}
.st-team-name {
	color: #fff;
	font-size: 20px;
	font-weight: 700;
	font-family: "Plus Jakarta Sans", sans-serif;
}
.st-team-role {
	color: #fd5b38;
	font-size: 14px;
	margin-top: 4px;
	text-transform: uppercase;
	letter-spacing: .08em;
	font-family: "Geist", sans-serif;
}
.st-team-bio {
	color: #A9ADC1;
	margin: 14px 0 0;
	line-height: 1.7;
}
.st-team-social {
	display: flex;
	gap: 14px;
	justify-content: center;
	margin-top: 18px;
}
.st-team-social a {
	color: #A9ADC1;
}
.st-team-social a:hover {
	color: #fd5b38;
}
.st-team-social .material-symbols-outlined {
	font-size: 20px;
}
.st-tm {
	background: #191c23;
	border: 1px solid rgba(255, 255, 255, .06);
	border-radius: 16px;
	padding: 32px;
}
.st-tm-stars {
	color: #fd5b38;
	display: flex;
	gap: 2px;
	margin-bottom: 16px;
}
.st-tm-stars .material-symbols-outlined {
	font-size: 20px;
}
.st-tm-quote {
	color: #e0e2ec;
	font-size: 18px;
	line-height: 1.7;
	margin-bottom: 22px;
}
.st-tm-author {
	display: flex;
	align-items: center;
	gap: 14px;
}
.st-tm-avatar {
	width: 52px;
	height: 52px;
	border-radius: 999px;
	object-fit: cover;
}
.st-tm-name {
	color: #fff;
	font-weight: 700;
}
.st-tm-role {
	color: #7c8194;
	font-size: 14px;
}
.st-tg-item{background:#191c23;border:1px solid rgba(255,255,255,.06);border-radius:12px;margin-bottom:10px;overflow:hidden;}
.st-tg-item summary{cursor:pointer;padding:16px 20px;display:flex;justify-content:space-between;align-items:center;gap:14px;color:#fff;font-weight:600;list-style:none;}
.st-tg-item summary::-webkit-details-marker{display:none;}
.st-tg-icon{color:#fd5b38;font-size:20px;line-height:1;transition:transform .2s ease;flex-shrink:0;}
.st-tg-item.st-acc-open .st-tg-icon{transform:rotate(45deg);}
.st-tg-content{padding:0 20px 18px;color:#A9ADC1;line-height:1.7;overflow:hidden;transition:max-height .35s cubic-bezier(.22,.61,.36,1);}
.st-video-frame{position:relative;aspect-ratio:16/9;background:#191c23;border-radius:14px;overflow:hidden;}
.st-video-frame iframe,.st-video-frame video{width:100%;height:100%;border:0;display:block;object-fit:cover;}
.st-video-poster{width:100%;height:100%;object-fit:cover;display:block;}
.st-video-lazy{cursor:pointer;}
.st-video-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:68px;height:68px;border:0;border-radius:999px;background:#fd5b38;color:#590c00;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s ease;}
.st-video-lazy:hover .st-video-play{transform:translate(-50%,-50%) scale(1.08);}
.st-video-play .material-symbols-outlined{font-size:36px;}
.st-video-ph{display:flex;align-items:center;justify-content:center;height:100%;color:#7c8194;font-family:"Geist",sans-serif;text-transform:uppercase;letter-spacing:.1em;font-size:13px;}
