/*
 * Glowence CTA Ring.
 *
 * A tall track (--glw-cta-stage) with a sticky, viewport-high panel. The copy
 * sits over the rings as a sibling, so it never rotates with them. Sizes and
 * colours are custom properties; Style tab controls override them per widget.
 */

.glowence-cta-ring {
	--glw-cta-stage: 300vh;
	--glw-cta-static-padding: 6.5rem;
	--glw-cta-outer-size: 46rem;
	--glw-cta-inner-size: 35rem;
	--glw-cta-outer-color: var(--e-global-color-primary, #af6200);
	--glw-cta-inner-color: var(--e-global-color-secondary, #d2831a);
	--glw-cta-ring-width: 1px;
	--glw-cta-card-width: 7.125rem;
	--glw-cta-card-image-height: 6.9375rem;
	--glw-cta-card-radius: 0.75rem;
	--glw-cta-caption-color: var(--e-global-color-accent, #0f0b08);
	--glw-cta-content-gap: 2rem;
	--glw-cta-content-width: 28.5625rem;
	--glw-cta-heading-color: var(--e-global-color-accent, #0f0b08);
	--glw-cta-heading-size: 3rem;

	position: relative;
	height: var(--glw-cta-stage);
	overflow: clip;
}

.glowence-cta-ring__sticky {
	position: sticky;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100vh;
}

.glowence-cta-ring__content {
	position: absolute;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--glw-cta-content-gap);
	max-width: min(var(--glw-cta-content-width), calc(100% - 2rem));
	text-align: center;
}

.glowence-cta-ring__heading {
	margin: 0;
	color: var(--glw-cta-heading-color);
	font-family: var(--e-global-typography-secondary-font-family, "Lora"), serif;
	font-size: var(--glw-cta-heading-size);
	font-weight: 600;
	line-height: 1;
	text-align: center;
}

.glowence-cta-ring__content .glowence-button-wrap {
	justify-content: center;
}

.glowence-cta-ring__outer {
	position: relative;
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: var(--glw-cta-outer-size);
	height: var(--glw-cta-outer-size);
	border: var(--glw-cta-ring-width) solid var(--glw-cta-outer-color);
	border-radius: 999px;
}

.glowence-cta-ring__inner {
	flex: none;
	width: var(--glw-cta-inner-size);
	height: var(--glw-cta-inner-size);
	border: var(--glw-cta-ring-width) solid var(--glw-cta-inner-color);
	border-radius: 999px;
}

.glowence-cta-ring__card {
	position: absolute;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.5rem;
	width: 100%;
	max-width: var(--glw-cta-card-width);
	margin: 0;
}

/* Fixed orbit slots, measured from the outer ring box. */
.glowence-cta-ring__card--1 {
	top: -2%;
	left: 15%;
}

.glowence-cta-ring__card--2 {
	top: -2%;
	right: 15%;
}

.glowence-cta-ring__card--3 {
	right: -8%;
	bottom: 40%;
}

.glowence-cta-ring__card--4 {
	right: 15%;
	bottom: -2%;
}

.glowence-cta-ring__card--5 {
	bottom: -2%;
	left: 15%;
}

.glowence-cta-ring__card--6 {
	bottom: 40%;
	left: -8%;
}

.glowence-cta-ring .glowence-cta-ring__image {
	display: block;
	width: 100%;
	max-width: 100%;
	height: var(--glw-cta-card-image-height);
	border-radius: var(--glw-cta-card-radius);
	object-fit: cover;
}

.glowence-cta-ring__caption {
	color: var(--glw-cta-caption-color);
	font-family: var(--e-global-typography-text-font-family, "Inter"), sans-serif;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.2;
}

/* Normal-height section: editor preview, motion switched off, reduced motion. */
.glowence-cta-ring.is-static {
	height: auto;
}

.glowence-cta-ring.is-static .glowence-cta-ring__sticky {
	position: relative;
	height: auto;
	padding: var(--glw-cta-static-padding) 0;
}

@media (prefers-reduced-motion: reduce) {
	.glowence-cta-ring {
		height: auto;
	}

	.glowence-cta-ring .glowence-cta-ring__sticky {
		position: relative;
		height: auto;
		padding: var(--glw-cta-static-padding) 0;
	}
}

@media (max-width: 991px) {
	.glowence-cta-ring {
		--glw-cta-static-padding: 5.75rem;
		--glw-cta-outer-size: 44rem;
		--glw-cta-inner-size: 33rem;
		--glw-cta-card-width: 6rem;
		--glw-cta-card-image-height: 6.5rem;
		--glw-cta-content-gap: 1.6rem;
		--glw-cta-heading-size: 2.625rem;
	}

	.glowence-cta-ring .glowence-button {
		padding-right: 1.35rem;
		padding-left: 1.35rem;
	}
}

@media (max-width: 767px) {
	.glowence-cta-ring {
		--glw-cta-static-padding: 5rem;
		--glw-cta-outer-size: 40rem;
		--glw-cta-inner-size: 30rem;
		--glw-cta-card-image-height: 6rem;
		--glw-cta-content-gap: 1.625rem;
		--glw-cta-heading-size: 2.325rem;
	}

	.glowence-cta-ring .glowence-button {
		padding-right: 1.25rem;
		padding-left: 1.25rem;
	}
}

@media (max-width: 479px) {
	.glowence-cta-ring {
		--glw-cta-stage: 200vh;
		--glw-cta-static-padding: 4.5rem;
		--glw-cta-outer-size: 24rem;
		--glw-cta-inner-size: 20rem;
		--glw-cta-card-image-height: 4.5rem;
		--glw-cta-content-gap: 1.5rem;
		--glw-cta-heading-size: 2.175rem;
	}

	.glowence-cta-ring .glowence-button {
		padding-right: 1.125rem;
		padding-left: 1.125rem;
	}

	.glowence-cta-ring.has-mobile-cards-hidden .glowence-cta-ring__card {
		display: none;
	}
}
