
/* GENERAL */
	:root {
		--offers-font-size: 1.2rem;

		--offers-section-background-color: #1c1e24;

		--offers-section-cards-gap: 1em;

		--offer-card-border-size: 0.7em;
		--offer-card-image-size: 14em;
		--offer-card-z-index: 1;
		--offer-card-photo-z-index: 2;
		--offer-card-discount-z-index: 3;

		--offers-horizontal-scrollbar-color: var(--offers-section-background-color);
		--offers-horizontal-scrollbar-hover-color: var(--offers-section-background-color);
	}

	@media (hover: hover) {
		:root {
			--offers-horizontal-scrollbar-color: #292b30;
			--offers-horizontal-scrollbar-hover-color: #4d4e52;
		}
	}

	@media only screen and (max-width: 1200px) {
		:root {
			--offers-font-size: 1.1rem;
		}
	}
	@media only screen and (max-width: 990px) {
		:root {
			--offers-font-size: 1.02rem;
		}
	}
	@media only screen and (max-width: 770px) {
		:root {
			--offers-font-size: 0.94rem;
		}
	}
	@media only screen and (max-width: 574px) {
		:root {
			--offers-font-size: 0.92rem;
		}
	}
	@media only screen and (max-width: 460px) {
		:root {
			--offers-font-size: 0.875rem;
		}
	}

	main {
		background-color: var(--offers-section-background-color);
	}

	section[data-class="offers-section"] {
		font-size: var(--offers-font-size);
		background-color: transparent;
	}

	section[data-class="offers-section"] p {
		margin: 0;
	}
/* --- */



/* HERO */
	#offers_hero_section {
		--offers-title-font-size: 3.2em;
		--offers-subtitle-font-size: 1.4em;
		--offers-title-underline-size: 6px;
	}
	@media only screen and (max-width: 1200px) {
		#offers_hero_section {
			--offers-title-font-size: 3em;
			--offers-subtitle-font-size: 1.35em;
		}
	}
	@media only screen and (max-width: 990px) {
		#offers_hero_section {
			--offers-title-font-size: 2.6em;
			--offers-subtitle-font-size: 1.25em;
		}
	}
	@media only screen and (max-width: 770px) {
		#offers_hero_section {
			--offers-title-font-size: 1.9em;
			--offers-subtitle-font-size: 1.15em;
			--offers-title-underline-size: 4px;
		}
	}
	@media only screen and (max-width: 574px) {
		#offers_hero_section {
			--offers-title-font-size: 1.75em;
			--offers-subtitle-font-size: 1.12em;
		}
	}
	@media only screen and (max-width: 460px) {
		#offers_hero_section {
			--offers-title-font-size: 1.6em;
			--offers-subtitle-font-size: 1.1em;
		}
	}

	#offers_hero_section .secondary-page-title-container {
		display: flex;
		flex-direction: column;
		gap: 2em;
		text-align: center;
	}

	#offers_hero_section h1.secondary-page-title {
		font-size: var(--offers-title-font-size);
		line-height: 1.4em;
	}

	#offers_hero_section h1.secondary-page-title span {
		color: var(--color-18);
		padding-bottom: 0.025em;
		border-bottom: var(--offers-title-underline-size) solid var(--color-20);
	}

	#offers_hero_section p.secondary-page-subtitle {
		padding: 0;
		margin: 0;
		font-size: var(--offers-subtitle-font-size);
		line-height: 1.7em;
	}

	#offers_hero_section .bg-img {
		-webkit-mask-image: linear-gradient(
			to bottom, 
			var(--offers-section-background-color) 15%, 
			transparent 100%
		);
		mask-image: linear-gradient(
			to bottom, 
			var(--offers-section-background-color) 15%, 
			transparent 100%
		);
		opacity: 0.75;
	}
/* --- */



/* OFFER GROUPS */
	/* Section Wrapper Gaps */
		#offer_groups_section .section-wrapper {
			padding-top: 2em;
			padding-bottom: 2em;
		}
		#offer_groups_section .section-wrapper:first-child {
			padding-top: 0;
			margin-top: calc(-1 * var(--section-wrapper-tb-padding) * 0.4);
		}
		#offer_groups_section .section-wrapper:last-child {
			padding-bottom: var(--section-wrapper-tb-padding);
		}
	/* --- */

	/* Cards Wrapper */
		.offer-cards-wrapper {
			--offer-card-border-top-left-radius: var(--offer-card-border-size);
			--offer-card-border-top-right-radius: var(--offer-card-border-size);
			--offer-card-border-bottom-right-radius: var(--offer-card-border-size);
			--offer-card-border-bottom-left-radius: var(--offer-card-border-size);

			--offer-card-border-radius: 
				var(--offer-card-border-top-left-radius) /* top-left */
				var(--offer-card-border-top-right-radius) /* top-right */
				var(--offer-card-border-bottom-right-radius) /* bottom-right */
				var(--offer-card-border-bottom-left-radius) /* bottom-left */
			;
		}
	/* --- */

	/* Card Components */
		/* Card Wrapper */
			.offer-card-wrapper {
				border: 1px solid #080808;
				border-radius: var(--offer-card-border-size);
				background-color: white;
				z-index: var(--offer-card-z-index);
			}
		/* --- */

		/* Profile Photo */
			.offer-card-wrapper figure {
				display: block;
				margin: 0;
				position: relative;
				overflow: hidden;
				width: 100%;
				padding-top: calc(var(--offer-card-image-size) / (1 / 1));
				border-radius: var(--offer-card-border-radius);
			}
			.offer-card-wrapper figure img {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				z-index: var(--offer-card-photo-z-index);
				object-fit: cover;
				border-radius: var(--offer-card-border-radius);
			}

			.offer-cards-wrapper[data-tier="1"] figure {
				width: var(--offer-card-image-size);
			}
			.offer-cards-wrapper[data-tier="2"] figure,
			.offer-cards-wrapper[data-tier="3"] figure {
				padding-top: calc(100% / (1 / 1));
			}
		/* --- */

		/* Info Wrapper */
			.offer-card-wrapper [data-class="info-wrapper"] {
				flex: 1;
				display: flex;
				flex-direction: column;
				row-gap: 1.5em;
				padding: 1em;
			}
		/* --- */

		/* Title & Text Wrapper */
			.offer-card-wrapper [data-class="text-wrapper"] {
				display: flex;
				flex-direction: column;
				row-gap: 0.5em;
			}
		/* --- */

		/* Title */
			.offer-card-wrapper [data-class="info-wrapper"] h2 {
				font-size: 1.2em;
				font-weight: 600;
				text-transform: none;
				color: var(--color-17);
				overflow: hidden !important;
				text-overflow: ellipsis !important;
				white-space: initial !important;
				display: -webkit-box !important;
				-webkit-line-clamp: 1 !important;
				-webkit-box-orient: vertical !important;
			}
		/* --- */

		/* Text */
			.offer-card-wrapper [data-class="info-wrapper"] p {
				font-size: 0.875em;
				line-height: 1.4em;
				color: var(--black-7);
				overflow: hidden !important;
				text-overflow: ellipsis !important;
				white-space: initial !important;
				display: -webkit-box !important;
				-webkit-line-clamp: 4 !important;
				-webkit-box-orient: vertical !important;
			}
		/* --- */

		/* Discount */
			.offer-card-wrapper [data-class="discount-wrapper"] {
				--discount-wrapper-padding: 0.4em 0.6em;
				--discount-wrapper-label-font-size: 0.9em;
				--discount-wrapper-percent-font-size: 1.5em;
				display: flex;
			}
			.offer-card-wrapper [data-class="discount-label"],
			.offer-card-wrapper [data-class="discount-percent"] {
				display: flex;
				align-items: center;
				padding: var(--discount-wrapper-padding);
			}
			.offer-card-wrapper [data-class="discount-label"] {
				color: white;
				background-color: var(--color-15);
			}
			.offer-card-wrapper [data-class="discount-label"] span {
				font-size: var(--discount-wrapper-label-font-size);
				font-weight: 500;
				text-transform: uppercase;
			}
			.offer-card-wrapper [data-class="discount-percent"] {
				color: var(--color-20);
				background-color: var(--color-30);
			}
			.offer-card-wrapper [data-class="discount-percent"] span {
				font-size: var(--discount-wrapper-percent-font-size);
				font-weight: 700;
				text-transform: uppercase;
			}

			.offer-cards-wrapper[data-tier="2"] .offer-card-wrapper [data-class="discount-wrapper"],
			.offer-cards-wrapper[data-tier="3"] .offer-card-wrapper [data-class="discount-wrapper"] {
				--discount-wrapper-label-font-size: 0.8em;
				--discount-wrapper-percent-font-size: 1.2em;
				position: absolute;
				bottom: 0.8em;
				left: 0;
				z-index: var(--offer-card-discount-z-index);
			}
		/* --- */
	/* --- */

	/* Group: Tier-1 */
		/* Wrapper */
			.offer-cards-wrapper[data-tier="1"] {
				--offer-card-border-top-right-radius: 0;
				--offer-card-border-bottom-right-radius: 0;
				display: flex;
				justify-content: center;
			}
		/* --- */

		/* Card */
			.offer-cards-wrapper[data-tier="1"] 
			.offer-card-wrapper {
				display: flex;
				align-items: center;
				max-width: max(
					40em, 
					calc(var(--offer-card-image-size) * 2)
				);
			}
		/* --- */

		/* Horizontal Scroll */
			@media only screen and (max-width: 574px) {
				.offer-cards-wrapper[data-tier="1"] {
					justify-content: flex-start;
					padding-bottom: 0.65em;
					max-width: auto;
					position: relative;
					overflow: auto;
					scroll-snap-type: x mandatory;
				}

				.offer-cards-wrapper[data-tier="1"] 
				.offer-card-wrapper {
					scroll-snap-align: start;
					min-width: calc(var(--offer-card-image-size) * 2.5);
				}

				/* Firefox */
				.offer-cards-wrapper[data-tier="1"] {
					scrollbar-color: var(--offers-horizontal-scrollbar-color);
				}
				/* Others */
				.offer-cards-wrapper[data-tier="1"]::-webkit-scrollbar {
					height: 8px;
				}
				.offer-cards-wrapper[data-tier="1"]::-webkit-scrollbar-track {
					background-color: transparent;
				}
				.offer-cards-wrapper[data-tier="1"]::-webkit-scrollbar-thumb {
					background-color: var(--offers-horizontal-scrollbar-color);
					border-radius: 80px;
				}
				.offer-cards-wrapper[data-tier="1"]::-webkit-scrollbar-thumb:hover {
					background-color: var(--offers-horizontal-scrollbar-hover-color);
				}
			}
		/* --- */
	/* --- */

	/* Group: Tier-2 */
		/* Wrapper */
			.offer-cards-wrapper[data-tier="2"] {
				--offer-card-border-bottom-right-radius: 0;
				--offer-card-border-bottom-left-radius: 0;
				display: flex;
				gap: var(--offers-section-cards-gap);
				justify-content: center;
			}
		/* --- */

		/* Card */
			.offer-cards-wrapper[data-tier="2"] 
			.offer-card-wrapper {
				flex: 1;
				display: block;
				max-width: max(
					15em, 
					var(--offer-card-image-size)
				);
			}
			@media only screen and (max-width: 400px) {
				.offer-cards-wrapper[data-tier="2"] 
				.offer-card-wrapper {
					max-width: 100%;
				}
			}
		/* --- */

		/* Horizontal Scroll */
			@media only screen and (max-width: 574px) {
				.offer-cards-wrapper[data-tier="2"] {
					justify-content: flex-start;
					padding-bottom: 0.65em;
					max-width: auto;
					position: relative;
					overflow: auto;
					scroll-snap-type: x mandatory;
				}

				.offer-cards-wrapper[data-tier="2"] 
				.offer-card-wrapper {
					scroll-snap-align: start;
					min-width: 14em;
				}

				/* Firefox */
				.offer-cards-wrapper[data-tier="2"] {
					scrollbar-color: var(--offers-horizontal-scrollbar-color);
				}
				/* Others */
				.offer-cards-wrapper[data-tier="2"]::-webkit-scrollbar {
					height: 8px;
				}
				.offer-cards-wrapper[data-tier="2"]::-webkit-scrollbar-track {
					background-color: transparent;
				}
				.offer-cards-wrapper[data-tier="2"]::-webkit-scrollbar-thumb {
					background-color: var(--offers-horizontal-scrollbar-color);
					border-radius: 80px;
				}
				.offer-cards-wrapper[data-tier="2"]::-webkit-scrollbar-thumb:hover {
					background-color: var(--offers-horizontal-scrollbar-hover-color);
				}
			}
		/* --- */
	/* --- */

	/* Group: Tier-3 */
		/* Wrapper */
			/* Horizontal Scroller */	 
				.horizontal-scroll-section-wrapper .offer-cards-wrapper[data-tier="3"] {
					--horizontal-scroll-inner-section-wrapper-gap: var(--offers-section-cards-gap);
					--horizontal-scroll-inner-section-wrapper-padding-bottom: 1em;

					--horizontal-scroll-section-wrapper-scrollbar-color: var(--offers-horizontal-scrollbar-color);
					--horizontal-scroll-section-wrapper-scrollbar-hover-color: var(--offers-horizontal-scrollbar-hover-color);

					--horizontal-scroll-item-wrapper-width: var(--offer-card-image-size);

					font-size: var(--offers-font-size);
				}

				.horizontal-scroll-section-wrapper 
				.horizontal-scroll-inner-section-wrapper.offer-cards-wrapper[data-tier="3"] > 
				.horizontal-scroll-item-wrapper + .horizontal-scroll-item-wrapper {
					margin-left: 0px;
				}
			/* --- */
		/* --- */

		/* Card */
			.offer-cards-wrapper[data-tier="3"] 
			.offer-card-wrapper {
				background-color: transparent;
				border: none;
			}

			.offer-cards-wrapper[data-tier="3"] 
			.offer-card-wrapper figure {
				border: 1px solid #080808;
			}

			.offer-cards-wrapper[data-tier="3"] 
			.offer-card-wrapper [data-class="info-wrapper"] {
				padding-left: 0;
				padding-right: 0;
				padding-bottom: 0;
			}
		/* --- */
	/* --- */

	/* Group Message Wrapper */
		/* Wrapper */
			.offer-message-wrapper {}
		/* --- */

		/* Box */
			.offer-message-wrapper [data-class="message-wrapper"] {
				display: flex;
				flex-direction: column;
				row-gap: 2.5em;
			}
		/* --- */
		
		/* Text */
			.offer-message-wrapper [data-class="message-info"] {
				display: flex;
				flex-direction: column;
				row-gap: 1.5em;
				align-items: center;
				text-align: center;
				padding: 1.75em 1.5em;
				border-radius: 0.4em;
				border: 1px dashed var(--black-7);
			}

			.offer-message-wrapper [data-class="message-title"] {
				font-size: 1.15em;
				font-weight: 500;
				text-align: center;
				text-transform: uppercase;
				letter-spacing: 0.05em;
				color: var(--black-3);
			}

			.offer-message-wrapper [data-class="message-text"] {
				font-size: 1em;
				text-align: center;
				line-height: 1.7em;
				color: var(--black-4);
				max-width: 32em;
			}
		/* --- */

		/* Buttons */
			.offer-message-wrapper [data-class="message-wrapper"] button.trifty-btn,
			.offer-message-wrapper [data-class="message-wrapper"] a.trifty-btn {
				padding: 0.93em 2.12em;
				font-size: 0.9em;
			}
		/* --- */
	/* --- */
/* --- */



/* FAQs */
	#offers_faqs_section {
		--faqs-section-title-font-size: 3em;
		--faqs-section-subtitle-font-size: 1.25em;

		--faq-title-font-size: 1.8em;
		--faq-question-font-size: 1.8em;
		--faq-answer-font-size: 1.4em;
	}
	@media only screen and (max-width: 1200px) {
		#offers_faqs_section {
			--faqs-section-title-font-size: 2.8em;
			--faqs-section-subtitle-font-size: 1.2em;

			--faq-title-font-size: 1.65em;
			--faq-question-font-size: 1.65em;
			--faq-answer-font-size: 1.3em;
		}
	}
	@media only screen and (max-width: 990px) {
		#offers_faqs_section {
			--faqs-section-title-font-size: 2.4em;
			--faqs-section-subtitle-font-size: 1.15em;

			--faq-title-font-size: 1.5em;
			--faq-question-font-size: 1.5em;
			--faq-answer-font-size: 1.22em;
		}
	}
	@media only screen and (max-width: 770px) {
		#offers_faqs_section {
			--faqs-section-title-font-size: 1.9em;
			--faqs-section-subtitle-font-size: 1.1em;

			--faq-title-font-size: 1.35em;
			--faq-question-font-size: 1.35em;
			--faq-answer-font-size: 1.15em;
		}
	}
	@media only screen and (max-width: 574px) {
		#offers_faqs_section {
			--faqs-section-title-font-size: 1.7em;
			--faqs-section-subtitle-font-size: 1.08em;

			--faq-title-font-size: 1.3em;
			--faq-question-font-size: 1.3em;
			--faq-answer-font-size: 1.12em;
		}
	}
	@media only screen and (max-width: 460px) {
		#offers_faqs_section {
			--faqs-section-title-font-size: 1.5em;
			--faqs-section-subtitle-font-size: 1.05em;

			--faq-title-font-size: 1.25em;
			--faq-question-font-size: 1.3em;
			--faq-answer-font-size: 1.08em;
		}
	}

	/* Padding */
		* + #offers_faqs_section .section-wrapper {
			padding-top: 0;
		}
	/* --- */

	/* Title Wrapper */
		#offers_faqs_section .section-title-wrapper {
			display: flex;
			flex-direction: column;
			gap: 1.75em;
			text-align: left;
			margin-left: auto;
			margin-right: auto;
			max-width: max-content;
			color: white;
		}
	/* --- */

	/* Title */
		#offers_faqs_section h2.section-title {
			font-size: var(--faqs-section-title-font-size);
			font-weight: 700;
			text-transform: none;
			line-height: 1.4em;
		}
	/* --- */

	/* Subtitle */
		#offers_faqs_section p.h2-subtitle.section-subtitle {
			padding: 0;
			margin: 0;
			font-size: var(--faqs-section-subtitle-font-size);
			line-height: 1.7em;
		}
	/* --- */

	/* FAQs Wrapper */
		#offers_faqs_section [data-class="faqs-outer-wrapper"] {
			display: flex;
			flex-direction: column;
			gap: 2.8em;
		}

		#offers_faqs_section [data-class="faqs-outer-wrapper"] h3 {
			font-size: var(--faq-title-font-size);
			text-transform: uppercase;
			color: var(--offers-section-background-color);
			background-color: var(--color-18);
			border: 1px solid var(--color-20);
			padding: 0.25em 0.75em;
			max-width: max-content;
		}

		#offers_faqs_section ul[data-class="faqs-wrapper"], 
		#offers_faqs_section ol[data-class="faqs-wrapper"] {
			list-style: none;
			display: flex;
			flex-direction: column;
			gap: 2.5em;
			padding: 0px;
			margin: 0px;
			width: 100%;
			max-width: max-content;
			margin-left: auto;
			margin-right: auto;
		}

		#offers_faqs_section [data-class="faqs-wrapper"] li {
			display: flex;
			flex-direction: column;
			row-gap: 0.75em;
		}
		#offers_faqs_section [data-class="faqs-wrapper"] li p:first-child {
			font-size: var(--faq-question-font-size);
			font-weight: 600;
			line-height: 1.3em;
			color: var(--color-18);
		}
		#offers_faqs_section [data-class="faqs-wrapper"] li p:last-child {
			font-size: var(--faq-answer-font-size);
			line-height: 1.6em;
			color: white;
		}
	/* --- */
/* --- */
