/* GENERAL STYLES */
	/* Variables (Responsive) */
		:root {
			--partner-apis-font-size: 1.2rem;

			--partner-apis-h1-font-size: 2.6em;
			--partner-apis-subtitle-font-size: 1.175em;
			--partner-apis-h2-font-size: 2em;
			--partner-apis-h2-subtitle-font-size: 1em;
			--partner-apis-h3-font-size: 1.45em;
			--partner-apis-h4-font-size: 1.05em;
		}

		@media only screen and (max-width: 1200px) {
			:root {
				--partner-apis-font-size: 1.1rem;
			}
		}

		@media only screen and (max-width: 990px) {
			:root {
				--partner-apis-font-size: 1.05rem;
			}
		}

		@media only screen and (max-width: 770px) {
			:root {
				--partner-apis-font-size: 1rem;
			}
		}

		@media only screen and (max-width: 574px) {
			:root {
				--partner-apis-font-size: 0.9rem;
			}
		}

		@media only screen and (max-width: 460px) {
			:root {
				--partner-apis-font-size: 0.85rem;
			}
		}

		@media only screen and (max-width: 350px) {
			:root {
				--partner-apis-font-size: 0.8rem;
			}
		}
	/* --- */

	/* Section */
		section[data-class="partner-apis-section"] {
			--tw-ring-offset-shadow: 0 0 #0000;
			--tw-ring-shadow: 0 0 #0000;
			--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);

			font-size: var(--partner-apis-font-size);
		}
	/* --- */
 
	/* Titles */
		/* h1 */
		.secondary-page-title,
		h1.secondary-page-title {
			font-size: var(--partner-apis-h1-font-size);
			font-weight: 700;
			text-transform: none;
			color: white;
		}
		/* h1 Subtitle */
		.secondary-page-subtitle,
		p.secondary-page-subtitle {
			font-size: var(--partner-apis-subtitle-font-size);
			color: white;
			line-height: 1.6em;
		}
		.secondary-page-section .secondary-page-subtitle {
			margin-top: 0px;
		}

		/* h2 */
		section[data-class="partner-apis-section"] h2[data-class="section-title"],
		section[data-class="partner-apis-section"] .section-title {
			font-size: var(--partner-apis-h2-font-size);
			font-weight: 700;
			text-transform: none;
			line-height: 1.3em;
		}
		/* h2 subtitle */
		.h2-subtitle.section-subtitle {
			color: rgb(75, 85, 99);
		}
		div.h2-subtitle.section-subtitle {
			font-size: var(--partner-apis-h2-subtitle-font-size);
		}

		/* h3 */
		section[data-class="partner-apis-section"] h3 {
			font-size: var(--partner-apis-h3-font-size);
			text-transform: none;
			line-height: 1.3em;
		}

		/* h4 */
		section[data-class="partner-apis-section"] h4 {
			font-size: var(--partner-apis-h4-font-size);
			text-transform: uppercase;
			line-height: 1.3em;
		}
	/* --- */

	/* Paragraph */
		section[data-class="partner-apis-section"] p {
			margin: 0px;
		}
	/* --- */

	/* Two Column Wrapper (Responsive) */
		section[data-class="partner-apis-section"] 
		[data-class="two-column-wrapper"] {
			display: grid;
			grid-template-columns: 1fr 1fr;
			grid-template-rows: auto;
			grid-auto-rows: auto;
			column-gap: 2em;
			row-gap: 2em;
			align-items: flex-start;
		}
		@media only screen and (max-width: 990px) {
			section[data-class="partner-apis-section"] 
			[data-class="two-column-wrapper"] {
				grid-template-columns: 1fr;
			}
		}
	/* --- */

	/* Three Column Wrapper (Responsive) */
		section[data-class="partner-apis-section"] 
		[data-class="three-column-wrapper"] {
			display: grid;
			grid-template-columns: 1fr 1fr 1fr;
			grid-template-rows: auto;
			grid-auto-rows: auto;
			column-gap: 2em;
			row-gap: 2em;
			align-items: flex-start;
		}
		@media only screen and (max-width: 1200px) {
			section[data-class="partner-apis-section"] 
			[data-class="three-column-wrapper"] {
				grid-template-columns: 1fr 1fr;
			}
		}
		@media only screen and (max-width: 990px) {
			section[data-class="partner-apis-section"] 
			[data-class="three-column-wrapper"] {
				grid-template-columns: 1fr;
			}
		}
	/* --- */

	/* Groups Wrapper */
		section[data-class="partner-apis-section"] 
		[data-class="groups-wrapper"] {
			display: flex;
			flex-direction: column;
			gap: 2.5em;
		}
	/* --- */

	/* Paragraphs Wrapper */
		section[data-class="partner-apis-section"] 
		[data-class="paragraphs-wrapper"] {
			display: flex;
			flex-direction: column;
			gap: 1.5em;
			line-height: 1.55em;
		}
		/* section[data-class="partner-apis-section"] 
		[data-class="paragraphs-wrapper"] p {} */
	/* --- */

	/* Box Wrapper */
		section[data-class="partner-apis-section"] 
		[data-class="box-wrapper"] {
			padding: 1.75em;
			border-radius: 0.5em;
			display: flex;
			align-items: center;
		}
		section[data-class="partner-apis-section"] 
		[data-class="box-wrapper"][data-bg="light-grey"] {
			background-color: #f9fafb;
		}
		section[data-class="partner-apis-section"] 
		[data-class="box-wrapper"][data-bg="light-orange"] {
			background-color: #f6e6d9;
			border: 1px solid #ffedd5;
		}
		section[data-class="partner-apis-section"] 
		[data-class="box-wrapper"][data-bg="orange"] {
			background-color: var(--color-14);
			border: 1px solid var(--color-18);
		}
	/* --- */

	/* List */
		/* Layout */
			section[data-class="partner-apis-section"] ul, 
			section[data-class="partner-apis-section"] ol {
				list-style: none;
				display: flex;
				flex-direction: column;
				gap: 0.8em;
				line-height: 1.5em;
				padding: 0px;
				margin: 0px;
				width: 100%;
			}

			section[data-class="partner-apis-section"] li {
				display: flex;
				column-gap: 0.8em;
				font-size: 0.95em;
				line-height: 1.5em;
			}

			section[data-class="partner-apis-section"] 
			li [data-class="paragraphs-wrapper"] {
				gap: 0.5em;
			}

			/* section[data-class="partner-apis-section"] 
			li [data-class="list-item-bullet"] {} */
		/* --- */

		/* Bullets */
			/* Dot */
				section[data-class="partner-apis-section"] 
				[data-type="dot"] li [data-class="list-item-bullet"] {
					--list-item-bullet-size: 0.55em;
					display: block;
					width: var(--list-item-bullet-size);
					height: var(--list-item-bullet-size);
					min-width: var(--list-item-bullet-size);	/* prevents horizontal shrink */
					flex-shrink: 0;         					/* critical fix */
					border-radius: 50%;     					/* cleaner than 1em */
					background-color: var(--color-17);
					margin-top: 0.4em;
				}
			/* --- */

			/* Circle Number */
				section[data-class="partner-apis-section"] 
				[data-type="circle-number"] li [data-class="list-item-bullet"] {
					--list-item-bullet-size: 2.3em;
					display: block;
					text-align: center;
					width: var(--list-item-bullet-size);
					height: var(--list-item-bullet-size);
					min-width: var(--list-item-bullet-size);	/* prevents horizontal shrink */
					flex-shrink: 0;         					/* critical fix */
					border-radius: 50%;     					/* cleaner than 1em */
					margin-top: -0.3em;
					position: relative;
					font-size: calc(var(--list-item-bullet-size) * 0.4);
					font-weight: 700;
				}
				section[data-class="partner-apis-section"] 
				[data-type="circle-number"] li [data-class="list-item-bullet"] span {
					display: block;
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%, -50%);
					line-height: 1em;
				}

				section[data-class="partner-apis-section"] 
				[data-type="circle-number"][data-color="white"] li [data-class="list-item-bullet"] {
					background-color: white;
					color: var(--color-17);
				}
				section[data-class="partner-apis-section"] 
				[data-type="circle-number"][data-color="pink"] li [data-class="list-item-bullet"] {
					background-color: var(--color-17);
					color: white;
				}
			/* --- */

			/* Icon */
				/* Lone icon */
				section[data-class="partner-apis-section"] 
				[data-type="icon"] li [data-class="list-item-bullet"] {
					--list-item-bullet-size: 0.55em;
					display: block;
					flex-shrink: 0;         					/* critical fix */
					margin-top: 0.4em;
				}
				section[data-class="partner-apis-section"] 
				[data-type="icon"] li [data-class="list-item-bullet"] img {
					display: block;
					height: var(--list-item-bullet-size);
					width: auto;
				}

				/* Padded icon */
				section[data-class="partner-apis-section"] 
				[data-type="icon"] li [data-class="list-item-bullet"][data-padded] {
					--list-item-bullet-size: 0.9em;
					width: 1.6em;
					height: 1.6em;
					min-width: 1.6em;
					display: flex;
					align-items: center;
					justify-content: center;
					background-color: rgba(233, 46, 91, 0.1);
					border-radius: 0.35em;
					align-self: flex-start;
					margin-top: 0.2em;
				}
				section[data-class="partner-apis-section"] 
				[data-type="icon"] li [data-class="list-item-bullet"][data-padded] img {
					width: var(--list-item-bullet-size);
					height: auto;
				}
			/* --- */

			/* Label */
				section[data-class="partner-apis-section"] 
				[data-type="label"] li {
					display: block;
					font-size: 0.9em;
					font-weight: 600;
					color: var(--color-15) !important;
					padding: 0.85em;
					border-radius: 0.5em;
					background-color: rgb(249, 250, 251);
				}
			/* --- */
		/* --- */

		/* Text */
			section[data-class="partner-apis-section"] 
			[data-class="list-title"] {
				font-weight: 700;
				color: var(--color-15);
			}
			section[data-class="partner-apis-section"] 
			[data-class="list-description"] {
				color: rgb(107, 114, 128);
				font-size: 0.95em;
			}
		/* --- */
	/* --- */

	/* Table */
		.api-partners-table-wrapper {
			--api-partners-table-font-size: calc(var(--partner-apis-font-size) * 0.78);
			--api-partners-table-y-padding: 1.2em;
			--api-partners-table-row-border-color: #e5e7eb;
    		border: 1px solid rgb(229 231 235);

			/* 
			--api-partners-table-border-radius: 0.75em;
			--api-partners-table-x-padding: 1em;
			--api-partners-table-y-padding: 1.4em;
			--api-partners-table-row-border-color: #efefef;
			--api-partners-table-code-bg-color: #efefef;
			font-size: var(--api-partners-table-font-size); 
			*/
		}
		@media only screen and (max-width: 990px) {
			.api-partners-table-wrapper {
				--api-partners-table-font-size: var(--partner-apis-font-size);
			}
		}
		table.api-partners-table thead {
    		background-color: rgb(249 250 251);
		}
		table.api-partners-table th {
			color: rgb(107, 114, 128);
			font-weight: 700;
		}
	/* --- */

	/* Cards */
		/* Icons */
			section[data-class="partner-apis-section"] 
			[data-class="icon"][data-color="green"] {
				background-color: rgb(240, 253, 244);
				color: rgb(22, 163, 74);
			}
			section[data-class="partner-apis-section"] 
			[data-class="icon"][data-color="blue"] {
				background-color: rgb(239, 246, 255);
				color: rgb(37, 99, 235);
			}
			section[data-class="partner-apis-section"] 
			[data-class="icon"][data-color="orange"] {
				background-color: rgb(255, 247, 237);
				color: rgb(245, 101, 6);
			}
			section[data-class="partner-apis-section"] 
			[data-class="icon"][data-color="pink"] {
				background-color: rgb(253, 242, 248);
				color: rgb(233, 46, 91);
			}

			section[data-class="partner-apis-section"] 
			[data-class="icon"][data-color="purple"] {
				background-color: rgba(168, 85, 247, 0.1);
				color: rgb(168, 85, 247);
			}
			section[data-class="partner-apis-section"] 
			[data-class="icon"][data-color="yellow"] {
				background-color: rgba(251, 182, 49, 0.1);
				color: rgb(251, 182, 49);
			}
		/* --- */

		/* Section Card */
			section[data-class="partner-apis-section"] 
			[data-class="section-card"] {
				--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
				background-color: white;
				border-radius: 1em;
				padding: 2em;
				box-shadow: 
					var(--tw-ring-offset-shadow, 0 0 #0000), 
					var(--tw-ring-shadow, 0 0 #0000), 
					var(--tw-shadow)
				;
			}

			section[data-class="partner-apis-section"] 
			[data-class="section-card"] h4 {
				color: rgb(156, 163, 175);
			}

			section[data-class="partner-apis-section"] 
			[data-class="section-card"] .input-btn {
				font-size: 0.9rem;
			}
		/* --- */

		/* Others Card */
			section[data-class="partner-apis-section"] 
			[data-class="others-card"] {
				display: flex;
				flex-direction: column;
				row-gap: 0.75em;
				background: #f9fafb;
				border: 1px solid #e5e7eb;
				border-radius: 12px;
				padding: 24px;
				transition: box-shadow 0.15s, border-color 0.15s;
				align-self: stretch;
			}
			section[data-class="partner-apis-section"] 
			[data-class="others-card"]:hover {
				border-color: var(--color-17);
				box-shadow: 0 4px 16px rgba(233, 46, 91, 0.08);
			}

			section[data-class="partner-apis-section"] 
			[data-class="others-card"] [data-class="header"] {
				display: flex;
				gap: 0.75em;
				align-items: center;
			}

			section[data-class="partner-apis-section"] 
			[data-class="others-card"] [data-class="icon"] {
				display: flex;
				border-radius: 0.5em;
				justify-content: center;
				align-items: center;
				flex-shrink: 0;
				width: 2.5em;
				height: 2.5em;
			}
			section[data-class="partner-apis-section"] 
			[data-class="others-card"] [data-class="icon"] img {
				width: 1.25em;
				height: auto;
			}

			section[data-class="partner-apis-section"] 
			[data-class="others-card"] [data-class="header"] [data-class="text"] {
				font-size: 1em;
				font-weight: 700;
				line-height: 1.5em;
			}

			section[data-class="partner-apis-section"] 
			[data-class="others-card"] p {
				font-size: 0.95em;
				line-height: 1.625em;
			}
		/* --- */

		/* Project Card */
			section[data-class="partner-apis-section"] 
			[data-class="project-card"] {
				--tw-shadow: 0 1px 2px 0 rgb(0, 0, 0, 0.05);
				align-self: stretch;
				display: flex;
				flex-direction: column;
				row-gap: 0.8em;
				padding: 2em;
				background-color: white;
				border-radius: 0.75em;
    			box-shadow: 
					var(--tw-ring-offset-shadow, 0 0 #0000), 
					var(--tw-ring-shadow, 0 0 #0000), 
					var(--tw-shadow)
				;
				transition-property: all;
				transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
				transition-duration: 150ms;
			}
			section[data-class="partner-apis-section"] 
			[data-class="project-card"]:hover {
				transform: translateY(-3px);
				box-shadow: 
					0 10px 25px -5px rgba(0, 0, 0, 0.1),
					0 8px 10px -6px rgba(0, 0, 0, 0.1)
				;
			}

			section[data-class="partner-apis-section"] 
			[data-class="project-card"] [data-class="icon"] {
				display: flex;
				border-radius: 0.5em;
				justify-content: center;
				align-items: center;
				flex-shrink: 0;
				width: 3em;
				height: 3em;
			}
			section[data-class="partner-apis-section"] 
			[data-class="project-card"] [data-class="icon"] img {
				width: 1.5em;
				height: auto;
			}
			section[data-class="partner-apis-section"] 
			[data-class="project-card"] [data-class="icon"] + * {
				margin-top: 0.5em !important;
			}

			section[data-class="partner-apis-section"] 
			[data-class="project-card"] h4[data-class="title"] {
				font-size: 1.125em;
				font-weight: 700;
				text-transform: none;
			}

			section[data-class="partner-apis-section"] 
			[data-class="project-card"] p[data-class="description"] {
				font-size: 0.875em;
				line-height: 1.625em;
				color: rgb(107, 114, 128);
			}
		/* --- */
	/* --- */

	/* Buttons */
		section[data-class="partner-apis-section"] .trifty-btn,
		section[data-class="partner-apis-section"] .input-btn {
			font-weight: 700;
		}

		section[data-class="partner-apis-section"] .trifty-btn[data-cta] {
			--btn-bg-color: var(--color-17);
			--btn-hover-bg-color: var(--color-30);
			--btn-color: white;
			--btn-border-color: var(--color-30);
			--tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
			font-size: 1.25em;
			padding: 1.1em 2.6em;
			border-radius: 4em;
			background-color: var(--btn-bg-color);
			color: var(--btn-color);
			border: 2px solid var(--btn-border-color);
			box-shadow: 
				var(--tw-ring-offset-shadow, 0 0 #0000), 
				var(--tw-ring-shadow, 0 0 #0000), 
				var(--tw-shadow)
			;
			transition: all 0.15s ease-in;
		}
		section[data-class="partner-apis-section"] .trifty-btn[data-cta]:hover {
			background-color: var(--btn-hover-bg-color);
			transform: translateY(-2px);
		}
	/* --- */

	/* Colors */
		section[data-class="partner-apis-section"] + 
		section[data-class="partner-apis-section"] p {
			color: rgb(75, 85, 99);
		}

		section[data-class="partner-apis-section"] + 
		section[data-class="partner-apis-section"] li {
			color: rgb(75, 85, 99);
		}
	/* --- */
/* --- */



/* HERO */
	/* General Layout */
		#nanny_manager_hero_section {
			background-color: var(--color-16);
			background: linear-gradient(135deg, #1a1a1a 0%, #222222 100%);
			color: white;
		}
		#nanny_manager_hero_section.secondary-page-section 
		.section-wrapper {
			display: flex;
			flex-wrap: nowrap;
			flex-direction: row;
			justify-content: space-between;
			align-items: flex-start;
			column-gap: 2.5em;
			row-gap: 1em;
		}
		#nanny_manager_hero_section 
		.secondary-page-title-container {
			display: flex;
			flex-direction: column;
			align-items: flex-start;
			gap: 1.7em;
			max-width: 42em;
			text-align: left;
		}
		#nanny_manager_hero_section 
		[data-class="title-wrapper"] {
			display: flex;
			flex-direction: column;
			gap: 0.75em;
		}
	/* --- */

	/* Background Image */
		#nanny_manager_hero_section.secondary-page-section 
		.bg-img {
			opacity: 0.1;
		}
	/* --- */

	/* Meta Grid */
		#nanny_manager_hero_section [data-class="meta-grid"] {
			display: grid;
			grid-template-columns: repeat(3, minmax(0, 1fr));
			gap: 1.5em;
		}
		@media only screen and (max-width: 990px) {
			#nanny_manager_hero_section [data-class="meta-grid"] {
				grid-template-columns: repeat(1, minmax(0, 1fr));
			}
		}

		#nanny_manager_hero_section [data-class="meta-wrapper"] {
			display: flex;
			align-items: flex-start;
			gap: 0.75em;
		}

		#nanny_manager_hero_section [data-class="meta-icon"] {
			width: 2.5em;
			min-width: 2.5em;
			height: 2.5em;
			border-radius: 0.5em;
			display: flex;
			align-items: center;
			justify-content: center;
		}
		#nanny_manager_hero_section [data-class="meta-icon"] img {
			width: 1.3em;
			height: auto;
		}

		#nanny_manager_hero_section [data-class="meta-icon"][data-color="pink"] {
    		background-color: rgb(233, 46, 91, 0.2);
			color: rgb(233, 46, 91);
		}
		#nanny_manager_hero_section [data-class="meta-icon"][data-color="orange"] {
			background-color: rgba(250, 172, 56, 0.2);
			color: rgb(250, 172, 56);
		}
		#nanny_manager_hero_section [data-class="meta-icon"][data-color="green"] {
		    background-color: rgba(34, 197, 94, 0.2);
			color: rgb(74, 222, 128);
		}

		#nanny_manager_hero_section [data-class="meta-wrapper"] p {
			font-size: 0.825em;
			line-height: 1.6em;
			color: rgba(255, 255, 255, 0.8);
		}

		


		/*
		<div data-class="meta-grid">
			<div data-class="meta-wrapper">
				<div data-class="meta-icon" data-color="pink">
					<img src="assets/icons/api_partners/key-outline-pink.svg" alt="deposits"> <!-- TODO: src -->
				</div>
				<p>Pull live data about freelance confinement nannies directly.</p>
			</div>
			<div data-class="meta-wrapper">
				<div data-class="meta-icon" data-color="yellow">
					<img src="assets/icons/api_partners/key-outline-pink.svg" alt="deposits"> <!-- TODO: src -->
				</div>
				<p>Power listings, ranking pages, mobile apps, or communities.</p>
			</div>
			<div data-class="meta-wrapper">
				<div data-class="meta-icon" data-color="green">
					<img src="assets/icons/api_partners/key-outline-pink.svg" alt="deposits"> <!-- TODO: src -->
				</div>
				<p>Every link includes your code. Earn when visitors book.</p>
			</div>
		</div>
		*/




	/* --- */

	/* Button */
		#nanny_manager_hero_section .promos-btn-wrapper {
			margin-top: 0;
			justify-content: flex-start;
		}
		#nanny_manager_hero_section * + .promos-btn-wrapper {
			margin-top: 1em;
		}
		#nanny_manager_hero_section .trifty-btn {
			border-color: var(--color-30);
			font-size: 1em;
			transition: all 0.15s ease-in;
		}
		#nanny_manager_hero_section .trifty-btn:hover {
			background-color: var(--color-30);
			transform: translateY(-2px);
		}
	/* --- */

	/* Breakpoints */
		@media only screen and (max-width: 990px) {
			/* .secondary-page-subtitle {
				margin-left: auto;
				margin-right: auto;
			} */

			/* #nanny_manager_hero_section.secondary-page-section.model-section .section-wrapper {
				flex-direction: column;
			} */
			/* #nanny_manager_hero_section .secondary-page-title-container {
				align-items: center;
			} */
		}
	/* --- */
/* --- */



/* API SNAPSHOT */
	/* General Layout */
		#api_snapshot_section {
			background-color: white;
		}
	/* --- */

	/* Table */
		#api_snapshot_section table.api-partners-table tbody tr td:first-child {
			font-weight: 700;
			color: var(--color-17);
		}
	/* --- */

	/* Code Block */
		#api_snapshot_section [data-class="code-block"] {
			--code-block-padding: 1.5em;
			font-size: calc(var(--partner-apis-font-size) * 0.75);
			font-family: monospace;
			/* font-size: 0.875em; */
			line-height: 1.6em;
			background-color: #1e2a33;
			color: #d1d5db;
			border-radius: 0.5em;
			padding: var(--code-block-padding);
			position: relative;
			overflow-x: auto;

			box-shadow: 
				var(--tw-ring-offset-shadow, 0 0 #0000), 
				var(--tw-ring-shadow, 0 0 #0000), 
				var(--tw-shadow)
			;
		}
		@media only screen and (max-width: 1200px) {
			#api_snapshot_section [data-class="code-block"] {
				font-size: calc(var(--partner-apis-font-size) * 0.66);
			}
		}
		@media only screen and (max-width: 990px) {
			#api_snapshot_section [data-class="code-block"] {
				font-size: calc(var(--partner-apis-font-size) * 0.9);
			}
		}

		#api_snapshot_section [data-class="code-block"] 
		[data-class="language-label"] {
			--language-label-width: 3.8em;
			font-size: 0.7em;
			font-weight: 700;
			color: rgb(209 213 219);
			padding: 0.4em 0.75em;
			background-color: rgb(55, 65, 81);
			border-radius: 0.35em;
			line-height: 1.4em;

			/* top: 1em;
			right: 1em;
			position: absolute; */

			text-align: center;
			width: var(--language-label-width);
			min-width: var(--language-label-width);
			position: sticky;
			display: inline;
			float: right;
			left: calc(100% - var(--language-label-width));
		}

		#api_snapshot_section [data-class="code-block"] pre,
		#api_snapshot_section [data-class="code-block"] code {
			font-family: var(--code-font);
		}

		#api_snapshot_section [data-class="code-block"] pre {
			white-space: pre;
		}

		#api_snapshot_section [data-class="code-block"] .json-key {
			color: #fbb631;
		}
		#api_snapshot_section [data-class="code-block"] .json-string {
			color: #10b981;
		}
		#api_snapshot_section [data-class="code-block"] .json-number {
			color: #60a5fa;
		}
	/* --- */
/* --- */



/* API PRODUCTS */
	/* General Layout */
		#api_products_section {
			background-color: rgb(249, 250, 251);
		}
	/* --- */

	/* Sample UI Mockups */
		/* Shared */
			#api_products_section 
			.sample-ui-placeholder {
				background-color: #e5e7eb;
				border: 2px dashed #9ca3af;
				border-radius: 0.5em;
				align-self: stretch;
				display: flex;
				align-items: center;
				justify-content: center;
				min-height: 200px;
				color: #4b5563;
				font-weight: 600;
			}
			@media only screen and (max-width: 990px) {
				#api_products_section 
				.sample-ui-placeholder {
					min-height: 300px;
				}
			}

			#api_products_section 
			.sample-ui {
				--card-box-shadow: var(--paper-card-shadow-soft);
				background-color: #f9fafb;
				border: 1.5px solid #e5e7eb;
				border-radius: 0.875em;
				overflow: hidden;
				position: relative;
				/* custom */
				--card-box-shadow: none;
				--card-border: 1.5px solid #e5e7eb;
				background-color: #eceef3;
				background-color: transparent;
				border: none;
				border-radius: 0;
			}

			#api_products_section 
			.sample-ui-inner {
				padding: 1em;
				display: flex;
				flex-direction: column;
				/* gap: 0.625em; */
				gap: 0.725em;
				max-height: 420px;
				overflow: hidden;
				/* custom */
				padding: 0;
			}

			/* "more cards" fade-out overlay */
				#api_products_section 
				.sample-ui-fade {
					position: absolute;
					bottom: 0; left: 0; right: 0;
					height: 5em;
					background: linear-gradient(to bottom, transparent, #f9fafb);
					display: flex;
					align-items: flex-end;
					justify-content: center;
					padding-bottom: 0.75em;
					pointer-events: none;
					/* custom */
					background: linear-gradient(to top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
				}

				#api_products_section 
				.sample-ui-more {
					font-size: 0.688em;
					font-weight: 700;
					color: #9ca3af;
					letter-spacing: 0.031em;
					background-color: #fff;
					border: 1px solid #e5e7eb;
					/* border-radius: 1.25em;
					padding: 0.25em 0.875em; */
					border-radius: 1.875em;
					padding: 0.375em 1.3125em;
					pointer-events: none;
				}
			/* --- */

			/* label badge */
				#api_products_section 
				.sample-label {
					position: absolute;
					/* top: 0.625em; 
					right: 0.625em; */
					top: 0.9375em; 
					right: 0.9375em;
					font-size: 0.563em;
					font-weight: 700;
					letter-spacing: 0.05em;
					text-transform: uppercase;
					background-color: rgba(0,0,0,0.06);
					color: #6b7280;
					/* padding: 0.188em 0.5em;
					border-radius: 0.625em; */
					padding: 0.282em 0.75em;
					border-radius: 0.9375em;
					z-index: 10;

					/* custom */
					color: white;
					background-color: rgba(156, 163, 175, 0.65);
					border: 1px solid #9ca3af;

					position: static;
					display: inline-block;
					margin-bottom: 1em;
					border: none;
					font-size: 0.65em;
					font-weight: 700;
					padding: 0.4em 0.75em;
					border-radius: 0.35em;
					line-height: 1.4em;
					text-align: center;
				}
			/* --- */
		/* --- */

		/* Nanny Listing */
			#api_products_section 
			.nl-card {
				background-color: #fff;
				border: 1px solid #f0f0f0;
				border-radius: 0.75em;
				padding: 0.875em;
				display: flex;
				align-items: flex-start;
				gap: 0.75em;
				position: relative;
				box-shadow: var(--card-box-shadow);
				border: var(--card-border);
			}

			#api_products_section 
			.nl-photo {
				width: 3.25em;
				height: 3.25em;
				border-radius: 50%;
				object-fit: cover;
				flex-shrink: 0;
				background-color: #e5e7eb;
			}

			#api_products_section 
			.nl-body { 
				flex: 1; 
				min-width: 0; 
			}

			#api_products_section 
			.nl-name {
				font-size: 0.844em;
				font-weight: 700;
				color: #111827;
				/* margin-bottom: 0.125em; */
				margin-bottom: 0.1875em;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			#api_products_section 
			.nl-name a { 
				color: #e92e5b; 
			}

			#api_products_section 
			.nl-meta {
				font-size: 0.688em;
				color: #9ca3af;
				/* margin-bottom: 0.438em; */
				margin-bottom: 0.9em;
			}

			#api_products_section 
			.nl-traits {
				display: flex;
				flex-wrap: wrap;
				/* gap: 0.25em; */
				gap: 0.375em;
			}

			#api_products_section 
			.nl-trait {
				font-size: 0.625em;
				background-color: #f3f4f6;
				color: #374151;
				/* border-radius: 0.375em;
				padding: 0.125em 0.438em; */
				border-radius: 0.75em;
				padding: 0.1875em 0.657em;
				font-weight: 500;
			}

			#api_products_section 
			.nl-badge-rank {
				position: absolute;
				top: 0.75em; right: 0.75em;
				background-color: #4f85e2;
				color: #fff;
				font-size: 0.594em;
				font-weight: 700;
				padding: 0.188em 0.563em;
				border-radius: 1.25em;
				letter-spacing: 0.019em;
			}

			#api_products_section .nl-badge-rank[data-rank="1"] { background-color: #faac38; }
			#api_products_section .nl-badge-rank[data-rank="2"] { background-color: #9ca3af; }
			#api_products_section .nl-badge-rank[data-rank="3"] { background-color: #b45309; }

			#api_products_section 
			.nl-badge-offer {
				position: absolute;
				bottom: 0.75em; right: 0.75em;
				background-color: #fce4ec;
				color: #e92e5b;
				font-size: 0.594em;
				font-weight: 700;
				padding: 0.188em 0.563em;
				border-radius: 1.25em;
			}

			#api_products_section 
			.nl-since {
				font-size: 0.625em;
				color: #6b7280;
			}
		/* --- */

		/* Nanny Awards */
			#api_products_section 
			.na-header {
				padding: 0.875em 1em 0.625em;
				display: flex;
				align-items: center;
				gap: 0.5em;
				border-bottom: 1px solid #f0f0f0;
			}

			#api_products_section 
			.na-region-badge {
				font-size: 0.625em;
				font-weight: 700;
				letter-spacing: 0.031em;
				text-transform: uppercase;
				/* border-radius: 1.25em;
				padding: 0.188em 0.625em; */
				border-radius: 1.875em;
				padding: 0.282em 0.9375em;
				display: flex;
				align-items: center;
				gap: 0.5em;
			}

			#api_products_section .na-region-badge                             { background-color: #f3f4f6; color: #374151; }
			#api_products_section .na-region-badge[data-country-code="global"] { background-color: #fef3c7; color: #92400e; }
			#api_products_section .na-region-badge[data-country-code="au"]     { background-color: #dbeafe; color: #1e40af; }
			#api_products_section .na-region-badge[data-country-code="my"]     { background-color: #dcfce7; color: #14532d; }
			#api_products_section .na-region-badge[data-country-code="sg"]     { background-color: #fee2e2; color: #7f1d1d; }
			#api_products_section .na-region-badge[data-country-code="gb"]     { background-color: #ede9fe; color: #3b0764; }
			#api_products_section .na-region-badge[data-country-code="us"]     { background-color: #dbeafe; color: #1e3a8a; }
			#api_products_section .na-region-badge[data-country-code="ae"]     { background-color: #d1fae5; color: #064e3b; }
			#api_products_section .na-region-badge[data-country-code="ca"]     { background-color: #ffe4e6; color: #881337; }

			#api_products_section .na-region-badge img { 
				height: 1.1em; 
				width: auto; 
			}

			#api_products_section 
			.na-year {
				font-size: 0.688em;
				font-weight: 600;
				color: #9ca3af;
				margin-left: auto;
			}

			#api_products_section 
			.na-row {
				background-color: #fff;
				display: flex;
				align-items: center;
				gap: 0.688em;
				padding: 0.688em 0.875em;
			}

			#api_products_section 
			.na-row + .na-row {
				border-top: 1px solid #f9fafb;
				/* custom */
				border-top-color: #f0f2f7;
			}

			#api_products_section 
			.na-pos {
				font-size: 0.813em;
				font-weight: 700;
				min-width: 1.375em;
				text-align: center;
			}

			#api_products_section .na-pos[data-rank="gold"]   { color: #f59e0b; }
			#api_products_section .na-pos[data-rank="silver"] { color: #9ca3af; }
			#api_products_section .na-pos[data-rank="bronze"] { color: #b45309; }

			#api_products_section 
			.na-photo {
				width: 2.375em;
				height: 2.375em;
				border-radius: 50%;
				object-fit: cover;
				background-color: #e5e7eb;
			}

			#api_products_section 
			.na-info { 
				flex: 1; 
				min-width: 0; 
			}

			#api_products_section 
			.na-name {
				font-size: 0.813em;
				font-weight: 700;
				color: #111827;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				/* custom */
				margin-bottom: 0.1875em;
			}

			#api_products_section 
			.na-name a { 
				color: #e92e5b; 
			}

			#api_products_section 
			.na-countries {
				font-size: 0.656em;
				color: #9ca3af;
				margin-top: 0.063em;
			}

			#api_products_section 
			.na-traits-row {
				display: flex;
				gap: 0.25em;
			}

			#api_products_section 
			.na-trait-chip {
				font-size: 0.813em;
			}

			/* Group ("more nannies" card) */
				#api_products_section 
				.na-group {
					overflow: hidden;
					position: relative;
					/* custom */
					background-color: #f9fafb;
					border: 1.5px solid #e5e7eb;
					border-radius: 0.875em;
				}

				#api_products_section 
				.na-group + .na-group {
					margin-top: 0.725em;
				}

				#api_products_section 
				.na-row-more {
					font-size: 0.688em;
					font-weight: 600;
					color: #9ca3af;
					letter-spacing: 0.031em;
					background-color: #fdfdfd;
					padding: 0.688em 0.875em;
				}

				#api_products_section 
				.na-row + .na-row-more {
					border-top: 1px solid #f9fafb;
					/* custom */
					border-top-color: #f0f2f7;
				}
			/* --- */

			/* Group selector */
				#api_products_section 
				.na-group-selectors {
					display: flex;
					align-items: center;
					justify-content: center;
					gap: 1em;
				}

				#api_products_section 
				.na-group-selectors + * {
					margin-top: 0.725em;
				}

				#api_products_section 
				.na-group-selector {
					--button-size: 1.4em;
					position: relative;
					width: var(--button-size);
					height: var(--button-size);
					border-radius: 50%;
					cursor: pointer;
					border-width: 1px;
					border-style: solid;
					border-color: transparent;
					transition: all 0.15s ease-in;
				}

				#api_products_section 
				.na-group-selector img {
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%, -50%);
					height: calc(var(--button-size) * 0.7);
					width: auto;
					transition: all 0.15s ease-in;
				}

				/* Hide the inputs */
				#api_products_section 
				.na-group-selector-input {
					display: none;
				}

				/* Hide the groups */
				#api_products_section 
				.na-group-selector-input ~ .na-group {
					display: none;
				}

				/* Show the selected group */
				#api_products_section .na-group-selector-input[data-award="0"]:checked ~ .na-group[data-award="0"],
				#api_products_section .na-group-selector-input[data-award="1"]:checked ~ .na-group[data-award="1"],
				#api_products_section .na-group-selector-input[data-award="2"]:checked ~ .na-group[data-award="2"],
				#api_products_section .na-group-selector-input[data-award="3"]:checked ~ .na-group[data-award="3"],
				#api_products_section .na-group-selector-input[data-award="4"]:checked ~ .na-group[data-award="4"],
				#api_products_section .na-group-selector-input[data-award="5"]:checked ~ .na-group[data-award="5"],
				#api_products_section .na-group-selector-input[data-award="6"]:checked ~ .na-group[data-award="6"],
				#api_products_section .na-group-selector-input[data-award="7"]:checked ~ .na-group[data-award="7"],
				#api_products_section .na-group-selector-input[data-award="8"]:checked ~ .na-group[data-award="8"],
				#api_products_section .na-group-selector-input[data-award="9"]:checked ~ .na-group[data-award="9"] { 
					display: block; 
				}
				
				/* Style the selected button */
				#api_products_section .na-group-selector-input[data-award="0"]:checked ~ * .na-group-selector[data-award="0"],
				#api_products_section .na-group-selector-input[data-award="1"]:checked ~ * .na-group-selector[data-award="1"],
				#api_products_section .na-group-selector-input[data-award="2"]:checked ~ * .na-group-selector[data-award="2"],
				#api_products_section .na-group-selector-input[data-award="3"]:checked ~ * .na-group-selector[data-award="3"],
				#api_products_section .na-group-selector-input[data-award="4"]:checked ~ * .na-group-selector[data-award="4"],
				#api_products_section .na-group-selector-input[data-award="5"]:checked ~ * .na-group-selector[data-award="5"],
				#api_products_section .na-group-selector-input[data-award="6"]:checked ~ * .na-group-selector[data-award="6"],
				#api_products_section .na-group-selector-input[data-award="7"]:checked ~ * .na-group-selector[data-award="7"],
				#api_products_section .na-group-selector-input[data-award="8"]:checked ~ * .na-group-selector[data-award="8"],
				#api_products_section .na-group-selector-input[data-award="9"]:checked ~ * .na-group-selector[data-award="9"] { 
					border-color: var(--color-17); 
				}
			/* --- */
		/* --- */

		/* Nanny Offers */
			#api_products_section 
			.no-card {
				background-color: #fff;
				border: 1.5px solid #f0f0f0;
				border-radius: 0.75em;
				display: flex;
				align-items: center;
				gap: 0.75em;
				padding: 0.813em 0.875em;
				position: relative;
				overflow: hidden;
				box-shadow: var(--card-box-shadow);
				border: var(--card-border);
			}

			#api_products_section 
			.no-card::before {
				content: '';
				position: absolute;
				left: 0; top: 0; bottom: 0;
				width: 0.25em;
				background-color: #e92e5b;
				border-radius: 0.75em 0 0 0.75em;
				/* custom */
				width: 1em;
				background-color: transparent;
				border-left: 4px solid #fbb631;
			}

			#api_products_section 
			.no-photo {
				width: 2.875em;
				height: 2.875em;
				border-radius: 50%;
				object-fit: cover;
				background-color: #e5e7eb;
				flex-shrink: 0;
			}

			#api_products_section 
			.no-body { 
				flex: 1; 
				min-width: 0; 
			}

			#api_products_section 
			.no-name {
				font-size: 0.813em;
				font-weight: 700;
				color: #111827;
				/* margin-bottom: 0.188em; */
				margin-bottom: 0.282em;
			}

			#api_products_section 
			.no-label {
				font-size: 0.656em;
				color: #9ca3af;
			}

			#api_products_section 
			.no-discount {
				flex-shrink: 0;
				text-align: center;
			}

			#api_products_section 
			.no-pct {
				font-size: 1.375em;
				font-weight: 700;
				color: #e92e5b;
				line-height: 1;
			}

			#api_products_section 
			.no-off {
				font-size: 0.594em;
				font-weight: 700;
				color: #e92e5b;
				letter-spacing: 0.019em;
				text-transform: uppercase;
			}

			#api_products_section 
			.no-view {
				display: inline-block;
				/* margin-top: 0.375em; */
				margin-top: 0.45em;
				font-size: 0.625em;
				font-weight: 700;
				color: #e92e5b;
				background-color: #fce4ec;
				/* padding: 0.188em 0.625em;
				border-radius: 1.25em; */
				padding: 0.282em 0.9375em;
				border-radius: 1.875em;
				text-decoration: none;
			}
		/* --- */
	/* --- */

	/* Card Selector */
		/* Hide inputs */
		.api-product-input {
			display: none;
		}

		/* Button Wrapper */
		.api-product-button-wrapper {
			/* display: flex;
			flex-wrap: wrap;
			align-items: center;
			justify-content: center;
			gap: 0.75em; */
			display: grid;
			grid-template-columns: 1fr 1fr 1fr 1fr;
			gap: 0.75em;
			width: 100%;
			max-width: 800px;
			margin-left: auto;
			margin-right: auto;
		}
		.api-product-button-wrapper .trifty-btn.api-product-button {
			width: 100% !important;
		}
		@media only screen and (max-width: 990px) {
			.api-product-button-wrapper {
				grid-template-columns: 1fr 1fr;
				max-width: 500px;
			}
		}
		@media only screen and (max-width: 770px) {
			.api-product-button-wrapper {
				grid-template-columns: 1fr 1fr;
				max-width: 400px;
			}
		}
		@media only screen and (max-width: 360px) {
			.api-product-button-wrapper {
				grid-template-columns: 1fr;
			}
		}

		/* Buttons Default */
		.api-product-button-wrapper .trifty-btn.api-product-button {
			--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
			--checked-color: white;
			--checked-bg-color: var(--color-17);
			font-size: 0.875em;
			font-weight: 700;
			color: rgb(75, 85, 99);
			background-color: white;
			cursor: pointer;
			border: 2px solid white;
			padding: 0.85em 1.7em;
			border-radius: 4em;
			white-space: nowrap;
			transition-property: all;
			transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
			transition-duration: 150ms;
			box-shadow: 
				var(--tw-ring-offset-shadow, 0 0 #0000), 
				var(--tw-ring-shadow, 0 0 #0000), 
				var(--tw-shadow)
			;
		}
		.api-product-button-wrapper .trifty-btn.api-product-button:last-child {
			--checked-bg-color: var(--color-18);
			border-color: rgb(209, 213, 219);
			font-size: 80%;
			text-transform: uppercase;
		}

		/* Selected Button */
		.api-product-input[data-card="1"]:checked ~ 
		.api-product-button-wrapper .trifty-btn.api-product-button[data-card="1"],
		.api-product-input[data-card="2"]:checked ~ 
		.api-product-button-wrapper .trifty-btn.api-product-button[data-card="2"],
		.api-product-input[data-card="3"]:checked ~ 
		.api-product-button-wrapper .trifty-btn.api-product-button[data-card="3"],
		.api-product-input[data-card="4"]:checked ~ 
		.api-product-button-wrapper .trifty-btn.api-product-button[data-card="4"] {
			color: var(--checked-color);
			background-color: var(--checked-bg-color);
			border-color: var(--checked-bg-color);
		}

		/* Hide Cards */
		.api-product-input ~ [data-class="section-card"] {
			display: none;
		}

		/* Show Selected Card */
		.api-product-input[data-card="1"]:checked ~ [data-class="section-card"][data-card="1"],
		.api-product-input[data-card="2"]:checked ~ [data-class="section-card"][data-card="2"],
		.api-product-input[data-card="3"]:checked ~ [data-class="section-card"][data-card="3"],
		.api-product-input[data-card="4"]:checked ~ [data-class="section-card"][data-card="4"] {
			display: block;
		}
	/* --- */
/* --- */



/* CUSTOM PROJECTS */
	#custom_projects_section {
		background-color: var(--color-18);
		background: linear-gradient(135deg, #faac38 0%, #fed653 100%);
	}

	#custom_projects_section [data-class="custom-project-max-width"] {
		max-width: 44em;
	}

	#custom_projects_section [data-class="custom-projects-grid"] {
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto;
		grid-auto-rows: auto;
		gap: 1em;
	}
	@media only screen and (max-width: 990px) {
		#custom_projects_section [data-class="custom-projects-grid"] {
			grid-template-columns: 1fr;
		}
	}

	#custom_projects_section [data-class="custom-project"] {
		padding: 1em;
		background-color: rgba(255, 255, 255, 0.5);
		border-radius: 0.5em;
		display: flex;
		gap: 0.75em;
		align-items: center;
	}
	#custom_projects_section [data-class="custom-project"] img {
		color: rgb(245 101 6);
		width: 1.25em;
		height: auto;
	}
	#custom_projects_section [data-class="custom-project"] span {
		font-size: 0.875em;
		font-weight: 700;
		line-height: 1.25em;
	}

	#custom_projects_section .section-title {
		line-height: 1.2em;
	}
	#custom_projects_section p.h2-subtitle.section-subtitle {
		margin-top: 0;
		color: rgba(34, 34, 34, 0.8);
	}
	#custom_projects_section .promos-btn-wrapper {
		margin-top: 0.35em;
		justify-content: flex-start;
	}
	#custom_projects_section .promos-btn-wrapper .trifty-btn {
		background-color: var(--color-15);
	}
/* --- */



/* COMMISSIONS */
	/* Layout */
		/* #commissions_section {} */

		#commissions_section [data-class="custom-project-max-width"] {
			max-width: 48em;
			margin-left: auto;
			margin-right: auto;
		}
	/* --- */

	/* Table */
		#commissions_section .api-partners-table-wrapper {
			--api-partners-table-x-padding: 1.75em;
			--api-partners-table-y-padding: 1.75em;


			/* --api-partners-table-font-size: calc(var(--partner-apis-font-size) * 0.78);
			--api-partners-table-y-padding: 1.2em;
			--api-partners-table-row-border-color: #e5e7eb;
			border: 1px solid rgb(229 231 235); */

			/* 
			--api-partners-table-border-radius: 0.75em;
			--api-partners-table-x-padding: 1em;
			--api-partners-table-y-padding: 1.4em;
			--api-partners-table-row-border-color: #efefef;
			--api-partners-table-code-bg-color: #efefef;
			font-size: var(--api-partners-table-font-size); 
			*/
		}
		/* #commissions_section table.api-partners-table th {
			padding: 
				var(--api-partners-table-y-padding) 
				var(--api-partners-table-x-padding)
			;
		} */
		#commissions_section table.api-partners-table tbody tr td * {
			color: var(--color-15);
		}
		#commissions_section table.api-partners-table tbody tr td:first-child * {
			font-size: 1.35em;
			font-weight: 700;
			color: var(--color-17);
		}
		#commissions_section table.api-partners-table tbody tr td:last-child * {
			font-weight: 600;
			color: var(--color-15);
		}
		#commissions_section table.api-partners-table tbody tr:last-child td:last-child * {
			color: rgb(22, 163, 74);
		}
	/* --- */

	/* Note */
		#commissions_section p[data-class="table-note"] {
			font-size: 0.975em;
			font-weight: 600;
			text-align: center;
			color: rgb(107, 114, 128);
			line-height: 1.5em;
		}
	/* --- */
/* --- */



/* REQUEST API */
	#request_api_section {
		background-color: var(--color-30);
	}
	#request_api_section h2.section-title {
		color: white;
	}
	#request_api_section .promos-btn-wrapper {
		margin-top: 0;
	}

	#request_api_section .trifty-btn[data-cta] {
		--btn-bg-color: var(--color-16);
		--btn-hover-bg-color: var(--color-15);
		--btn-border-color: var(--color-15);
	}
/* --- */



/* PARTNER PROJECTS */
	#partner_projects_section {
		background-color: rgb(249, 250, 251);
	}

	/* Note */
		#partner_projects_section p[data-class="grid-note"] {
			font-size: 0.875em;
			text-align: center;
			color: rgb(156, 163, 175);
			line-height: 1.25em;
		}
	/* --- */
/* --- */



/* FINAL CTA */
	#final_cta_section {
		background-color: var(--color-16);
	}
	#final_cta_section h2.section-title {
		color: white;
	}
	#final_cta_section .promos-btn-wrapper {
		margin-top: 0;
	}
/* --- */