/**
 * Apollo Blocks — front-end + editor styling.
 * Uses Apollo design tokens (--apollo-*) so blocks inherit the active palette.
 */
.apollo-block { margin-block: 1rem; }

/* ---- Info Box ---- */
.apollo-info-box {
	padding: clamp(1.5rem, 4vw, 2.5rem);
	border: 1px solid var(--apollo-color-border, #e5e7eb);
	border-radius: var(--apollo-radius, 8px);
	background: var(--apollo-content-bg, var(--apollo-color-surface, #fff));
}
.apollo-info-box.apollo-align-center { text-align: center; }
.apollo-info-box.apollo-align-right { text-align: right; }
.apollo-info-box__icon {
	display: inline-grid; place-items: center;
	width: 3.25rem; height: 3.25rem; margin-bottom: .75rem;
	font-size: 1.5rem; line-height: 1; color: #fff;
	background: var(--apollo-ib-accent, var(--apollo-color-primary, #5b34da));
	border-radius: 50%;
}
.apollo-info-box.apollo-align-center .apollo-info-box__icon { margin-inline: auto; }
.apollo-info-box.apollo-align-right .apollo-info-box__icon { margin-inline-start: auto; }
.apollo-info-box__title { margin: 0 0 .4em; font-size: var(--apollo-fs-lg, 1.4rem); }
.apollo-info-box__desc { margin: 0 0 1em; color: color-mix(in srgb, var(--apollo-color-text, #111) 80%, transparent); }
.apollo-info-box__btn,
.apollo-cta__btn {
	display: inline-block; text-decoration: none; font-weight: 600;
	padding: .65em 1.4em; border-radius: var(--apollo-radius, 6px);
	background: var(--apollo-ib-accent, var(--apollo-color-primary, #5b34da)); color: #fff;
	transition: filter .15s ease, transform .12s ease;
}
.apollo-info-box__btn:hover,
.apollo-cta__btn:hover { filter: brightness(1.08); transform: translateY(-1px); color: #fff; }

/* ---- Call To Action ---- */
.apollo-cta {
	text-align: center;
	padding: clamp(2rem, 6vw, 4rem) clamp(1rem, 4vw, 2rem);
	border-radius: var(--apollo-radius, 10px);
}
.apollo-cta__title { margin: 0 0 .4em; color: inherit; }
.apollo-cta__text { margin: 0 auto 1.4em; max-width: 48ch; opacity: .92; }
.apollo-cta__btn { background: #fff; color: var(--apollo-color-primary, #5b34da); }
.apollo-cta__btn:hover { color: var(--apollo-color-primary, #5b34da); }

/* ---- Counter ---- */
.apollo-counter { text-align: center; }
.apollo-counter__num {
	font-size: clamp(2.5rem, 7vw, 4rem); font-weight: 800; line-height: 1;
	color: var(--apollo-counter-color, var(--apollo-color-primary, #5b34da));
	font-family: var(--apollo-font-heading, var(--apollo-font-body));
}
.apollo-counter__label { margin-top: .4rem; font-size: 1rem; color: color-mix(in srgb, var(--apollo-color-text, #111) 70%, transparent); }

/* ---- Accordion / FAQ ---- */
.apollo-accordion__item {
	border: 1px solid var(--apollo-color-border, #e5e7eb);
	border-radius: var(--apollo-radius, 8px);
	margin-bottom: .75rem; overflow: hidden; background: var(--apollo-color-surface, #fff);
}
.apollo-accordion__q {
	cursor: pointer; list-style: none; padding: 1rem 1.25rem; font-weight: 600;
	display: flex; align-items: center; justify-content: space-between;
}
.apollo-accordion__q::-webkit-details-marker { display: none; }
.apollo-accordion__q::after { content: "+"; font-size: 1.3em; line-height: 1; color: var(--apollo-color-primary, #5b34da); }
.apollo-accordion__item[open] .apollo-accordion__q::after { content: "\2212"; }
.apollo-accordion__a { padding: 0 1.25rem 1.1rem; color: color-mix(in srgb, var(--apollo-color-text, #111) 82%, transparent); }
.apollo-accordion__a > :first-child { margin-top: 0; }

/* ---- Container ---- */
.apollo-container { box-sizing: border-box; }
.apollo-container__inner { box-sizing: border-box; }
/* "Container Width: Full" — break out to the viewport edges (top-level containers only).
   Uses transform (not margins) so 4-way Margin controls don't conflict with the breakout. */
.apollo-container--full {
	width: 100vw;
	max-width: 100vw;
	position: relative;
	left: 50%;
	transform: translateX( -50% );
}
/* Nesting-safe: a full container INSIDE another container must NOT break out again. */
.apollo-container__inner .apollo-container--full {
	width: auto;
	max-width: 100%;
	left: auto;
	transform: none;
}
.apollo-container--edit { outline: 1px dashed color-mix(in srgb, var(--apollo-color-primary, #5b34da) 40%, transparent); outline-offset: -1px; }
/* In the EDITOR canvas, don't apply the 100vw viewport breakout — the canvas isn't the viewport,
   so it would overflow and mis-center. The block fills the canvas width instead; the real
   edge-to-edge breakout still happens on the front end. */
.editor-styles-wrapper .apollo-container--full {
	width: 100% !important;
	max-width: 100% !important;
	left: auto !important;
	transform: none !important;
}
/* "Children Width: Equal" — each direct child shares the row evenly */
.apollo-container__inner.is-equal > * { flex: 1 1 0; min-width: 0; }

/* Auto-responsive (minimalist) layout — containers & columns collapse on smaller screens
   without any per-block setup. Tablet: many-column grids drop to 2 columns. Mobile: everything
   stacks into a single full-width column. */
@media (max-width: 1024px) {
	.apollo-container__inner[style*="grid-template-columns"] { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 767px) {
	.apollo-container__inner {
		flex-direction: column !important;
		grid-template-columns: 1fr !important;
	}
	.apollo-container__inner > * { width: 100% !important; max-width: 100% !important; flex-basis: auto !important; }
}

/* ---- Icon ---- */
.apollo-icon-wrap.apollo-align-center { text-align: center; }
.apollo-icon-wrap.apollo-align-right { text-align: right; }
.apollo-icon { display: inline-grid; place-items: center; line-height: 1; }
.apollo-icon-wrap a { text-decoration: none; }

/* ---- Blockquote ---- */
.apollo-blockquote {
	border-left: 4px solid var(--apollo-bq-accent, #5b34da);
	padding: .5rem 0 .5rem 1.5rem; margin: 1.5rem 0;
}
.apollo-blockquote.apollo-align-center { text-align: center; border-left: 0; border-top: 4px solid var(--apollo-bq-accent, #5b34da); padding: 1.5rem 0 0; }
.apollo-blockquote.apollo-align-right { text-align: right; border-left: 0; border-right: 4px solid var(--apollo-bq-accent, #5b34da); padding-right: 1.5rem; padding-left: 0; }
.apollo-blockquote__text { font-size: var(--apollo-fs-lg, 1.4rem); font-style: italic; margin: 0 0 .6em; }
.apollo-blockquote__cite { font-style: normal; font-weight: 600; color: var(--apollo-bq-accent, #5b34da); }

/* ---- Countdown ---- */
.apollo-countdown { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: center; }
.apollo-countdown__unit {
	min-width: 76px; text-align: center; padding: .9rem .6rem;
	border-radius: var(--apollo-radius, 8px);
	background: color-mix(in srgb, var(--apollo-cd-color, #1f2937) 8%, transparent);
}
.apollo-countdown__n { display: block; font-size: 2.1rem; font-weight: 800; line-height: 1; color: var(--apollo-cd-color, #1f2937); }
.apollo-countdown__l { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; opacity: .7; }
.apollo-countdown.is-expired { font-size: 1.1rem; font-weight: 600; color: var(--apollo-cd-color, #1f2937); }

/* ---- Google Maps ---- */
.apollo-maps { border-radius: var(--apollo-radius, 8px); overflow: hidden; }
.apollo-maps iframe { display: block; }

/* ---- Post card (shared by grid + carousel) ---- */
.apollo-pcard {
	display: flex; flex-direction: column;
	background: var(--apollo-color-surface, #fff);
	border: 1px solid var(--apollo-color-border, #e5e7eb);
	border-radius: var(--apollo-radius, 8px); overflow: hidden; height: 100%;
	transition: box-shadow .15s ease, transform .12s ease;
}
.apollo-pcard:hover { box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-2px); }
.apollo-pcard__media { display: block; aspect-ratio: var(--apollo-ratio, 16 / 9); overflow: hidden; }
.apollo-pcard__media img { width: 100%; height: 100%; object-fit: cover; }
.apollo-pcard__body { padding: 1.1rem 1.2rem 1.3rem; display: flex; flex-direction: column; gap: .5rem; }
.apollo-pcard__tax { font-size: .8rem; margin-bottom: .15rem; }
.apollo-pcard__tax a { color: var(--apollo-color-primary, #5b34da); text-decoration: none; font-weight: 600; }
.apollo-meta-i { opacity: .7; }

.apollo-pcard__more {
	align-self: flex-start; margin-top: .4rem; font-weight: 600; font-size: .9rem; text-decoration: none;
	color: var(--apollo-color-primary, #5b34da);
	transition: filter .15s ease, color .15s ease, background-color .15s ease;
}
.apollo-pcard__more:hover { color: var(--apollo-color-accent, #f5a623); }
.apollo-pcard[style*="center"] .apollo-pcard__more { align-self: center; }

/* Read More presets */
.apollo-rm--solid, .apollo-rm--solid-round, .apollo-rm--solid-pill {
	color: #fff; background: var(--apollo-color-primary, #5b34da); padding: .55em 1.2em;
}
.apollo-rm--solid:hover, .apollo-rm--solid-round:hover, .apollo-rm--solid-pill:hover { color: #fff; filter: brightness(1.08); }
.apollo-rm--solid { border-radius: var(--apollo-radius, 6px); }
.apollo-rm--solid-round { border-radius: 10px; }
.apollo-rm--solid-pill { border-radius: 999px; }
.apollo-rm--outline, .apollo-rm--outline-pill {
	padding: .5em 1.15em; background: transparent;
	color: var(--apollo-color-primary, #5b34da);
	box-shadow: inset 0 0 0 2px currentColor;
}
.apollo-rm--outline { border-radius: var(--apollo-radius, 6px); }
.apollo-rm--outline-pill { border-radius: 999px; }
.apollo-rm--outline:hover, .apollo-rm--outline-pill:hover { background: var(--apollo-color-primary, #5b34da); color: #fff; }
/* Custom Read More button — normal + hover/active colours & size (overrides the preset). The
   `--rm-*` vars are set inline per block; hover & active share the hover colour. */
.apollo-pcard__more.apollo-rm--custom {
	color: var(--rm-color, inherit);
	background: var(--rm-bg, transparent);
	font-size: var(--rm-size, inherit);
}
.apollo-pcard__more.apollo-rm--custom:hover,
.apollo-pcard__more.apollo-rm--custom:focus,
.apollo-pcard__more.apollo-rm--custom:active {
	color: var(--rm-hover-color, var(--rm-color, inherit));
	background: var(--rm-hover-bg, var(--rm-bg, transparent));
}
.apollo-pcard__meta { font-size: .8rem; color: color-mix(in srgb, var(--apollo-color-text, #111) 60%, transparent); display: flex; gap: .75rem; }
.apollo-pcard__title { margin: 0; font-size: var(--apollo-fs-lg, 1.25rem); line-height: 1.25; }
.apollo-pcard__title a { color: var(--apollo-color-secondary, #1f2937); text-decoration: none; }
.apollo-pcard__title a:hover { color: var(--apollo-color-primary, #5b34da); }
.apollo-pcard__excerpt { margin: 0; font-size: .95rem; color: color-mix(in srgb, var(--apollo-color-text, #111) 78%, transparent); }
.apollo-pc-empty { padding: 1.5rem; text-align: center; color: #6b7280; }

/* ---- Post grid ---- */
.apollo-post-grid {
	display: grid;
	grid-template-columns: repeat(var(--apollo-pc-cols, 3), minmax(0, 1fr));
}
.apollo-post-grid.is-equal-height { align-items: stretch; }
.apollo-post-grid.is-equal-height .apollo-pcard { height: 100%; }
@media (max-width: 782px) { .apollo-post-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); } }

/* ---- Post carousel ---- */
.apollo-post-carousel { position: relative; }
.apollo-carousel__track {
	display: flex; gap: clamp(1rem, 3vw, 1.5rem);
	overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
	padding-bottom: .5rem; scrollbar-width: thin;
}
.apollo-carousel__slide {
	flex: 0 0 calc((100% - (var(--apollo-pc-cols, 3) - 1) * 1.5rem) / var(--apollo-pc-cols, 3));
	scroll-snap-align: start;
}
@media (max-width: 782px) { .apollo-carousel__slide { flex-basis: 80%; } }
.apollo-carousel__nav {
	position: absolute; top: 40%; transform: translateY(-50%);
	width: 2.5rem; height: 2.5rem; display: grid; place-items: center;
	font-size: 1.5rem; line-height: 1; cursor: pointer; z-index: 2;
	background: var(--apollo-color-surface, #fff); color: var(--apollo-color-primary, #5b34da);
	border: 1px solid var(--apollo-color-border, #e5e7eb); border-radius: 50%;
	box-shadow: 0 2px 10px rgba(0,0,0,.12);
}
.apollo-carousel__prev { left: -.5rem; }
.apollo-carousel__next { right: -.5rem; }
.apollo-carousel__nav:hover { background: var(--apollo-color-primary, #5b34da); color: #fff; }
.apollo-carousel__dots { display: flex; justify-content: center; gap: .5rem; margin-top: 1rem; }
.apollo-carousel__dot {
	width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; cursor: pointer;
	background: color-mix(in srgb, var(--apollo-color-text, #111) 25%, transparent);
	transition: background-color .15s ease, transform .15s ease;
}
.apollo-carousel__dot.is-active { background: var(--apollo-color-primary, #5b34da); transform: scale(1.25); }

/* Advanced tab — responsive visibility */
@media (max-width: 767px) { .apollo-hide-mobile { display: none !important; } }
@media (min-width: 768px) and (max-width: 1024px) { .apollo-hide-tablet { display: none !important; } }
@media (min-width: 1025px) { .apollo-hide-desktop { display: none !important; } }

/* Spacing — responsive padding/margin via CSS vars. Tablet/Mobile fall back up the chain
   (mobile → tablet → desktop) so an unset device inherits the larger one. */
.apollo-rpad { padding: var(--ap-pad-d, 0); }
.apollo-rmar { margin: var(--ap-mar-d, 0); }
@media (max-width: 1024px) {
	.apollo-rpad { padding: var(--ap-pad-t, var(--ap-pad-d, 0)); }
	.apollo-rmar { margin: var(--ap-mar-t, var(--ap-mar-d, 0)); }
}
@media (max-width: 767px) {
	.apollo-rpad { padding: var(--ap-pad-m, var(--ap-pad-t, var(--ap-pad-d, 0))); }
	.apollo-rmar { margin: var(--ap-mar-m, var(--ap-mar-t, var(--ap-mar-d, 0))); }
}

/* Advanced tab — sticky */
.apollo-sticky { position: sticky; top: 0; z-index: 100; }

/* Background — image/video overlay + video element */
.apollo-has-bg-video, .apollo-has-overlay { position: relative; overflow: hidden; }
.apollo-bg-video {
	position: absolute; inset: 0; width: 100%; height: 100%;
	object-fit: cover; z-index: 0; border: 0; pointer-events: none;
}
.apollo-bg-overlay { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
/* Keep real content above the video/overlay layers */
.apollo-has-bg-video > :not(.apollo-bg-video):not(.apollo-bg-overlay),
.apollo-has-overlay > :not(.apollo-bg-video):not(.apollo-bg-overlay) { position: relative; z-index: 1; }

/* Editor: empty inspector tab note */
.apollo-tab-empty { padding: 12px 16px; margin: 0; opacity: .6; font-style: italic; }

/* Editor: visual preset picker (e.g. Read More button style) */
.apollo-preset-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.apollo-preset-item {
	display: flex; align-items: center; justify-content: center;
	min-height: 56px; padding: 8px; cursor: pointer;
	background: #fff; border: 1px solid #e0e0e0; border-radius: 6px;
}
.apollo-preset-item:hover { border-color: #5b34da; }
.apollo-preset-item.is-selected { border-color: #5b34da; box-shadow: 0 0 0 1px #5b34da; }
.apollo-preset-sample {
	font-size: 12px; font-weight: 600; pointer-events: none;
	color: var(--apollo-color-primary, #5b34da);
}
/* Make the solid/outline samples show their real look inside the picker */
.apollo-preset-sample.apollo-rm--solid, .apollo-preset-sample.apollo-rm--solid-round, .apollo-preset-sample.apollo-rm--solid-pill { color: #fff; }

/* ---- Social share ---- */
.apollo-social { display: flex; gap: .6rem; flex-wrap: wrap; }
.apollo-social.apollo-align-center { justify-content: center; }
.apollo-social.apollo-align-right { justify-content: flex-end; }
.apollo-social__btn {
	display: inline-grid; place-items: center; width: 2.6rem; height: 2.6rem;
	background: var(--apollo-soc, #5b34da); color: #fff; text-decoration: none;
	border: 0; cursor: pointer; font-weight: 700; font-size: 1rem; line-height: 1;
	transition: transform .12s ease, filter .15s ease;
}
.apollo-social--circle .apollo-social__btn { border-radius: 50%; }
.apollo-social--rounded .apollo-social__btn { border-radius: var(--apollo-radius, 8px); }
.apollo-social__btn:hover { transform: translateY(-2px); filter: brightness(1.1); color: #fff; }
.apollo-social__copy.is-copied { filter: none; }
.apollo-social__copy.is-copied::after { content: "✓"; position: absolute; }