/* Download Forms :: Front-end */

.dlf-section {
	--dlf-hs: 1;
	--dlf-bs: 1;
	--dlf-gutter: calc( ( var( --dlf-canvas, 1440px ) - var( --dlf-content, 1200px ) ) / 2 );

	width: 100%;
	padding: var( --dlf-pad-top, 60px ) 0 var( --dlf-pad-bot, 60px );
	background-color: var( --dlf-section-bg, #FFFFFF );
	--dlf-face: 'Google Sans', sans-serif;

	font-family: var( --dlf-face );
	box-sizing: border-box;
}
.dlf-section * { box-sizing: border-box; }

.dlf-container {
	max-width: var( --dlf-canvas, 1440px );
	margin: 0 auto;
	padding: 0 var( --dlf-gutter );
}

.dlf-section .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect( 0 0 0 0 );
	clip-path: inset( 50% );
	white-space: nowrap;
	border: 0;
}

/* Theme reset guards */
.dlf-section h2,
.dlf-section p,
.dlf-section ol,
.dlf-section li { margin: 0; padding: 0; }
.dlf-section ol { list-style: none; }
.dlf-section h2 { font-family: inherit; letter-spacing: 0; }

.dlf-section .dlf-subtitle,
.dlf-section .dlf-chip,
.dlf-section .dlf-num,
.dlf-section .dlf-title,
.dlf-section .dlf-btn,
.dlf-section .dlf-empty { font-family: var( --dlf-face ); }

/* Headline */

.dlf-head { text-align: center; }

.dlf-section .dlf-heading {
	font-family: 'Anybody', sans-serif !important;
	max-width: var( --dlf-heading-w, 763px );
	margin: 0 auto;
	font-weight: 700;
	line-height: 1.025;
	text-transform: uppercase;
	color: var( --dlf-heading, #000000 );
	font-size: max( 22px, calc( var( --dlf-heading-fs, 40px ) * var( --dlf-hs ) ) );
}

.dlf-section .dlf-subtitle {
	max-width: var( --dlf-subtitle-w, 946px );
	margin: var( --dlf-gap-subtitle, 10px ) auto 0;
	font-weight: 400;
	line-height: 1.25;
	color: var( --dlf-subtitle, #9F9F9F );
	font-size: max( 14px, calc( var( --dlf-subtitle-fs, 20px ) * var( --dlf-bs ) ) );
}

/* The category chips */
.dlf-chips {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 10px;
	margin-top: var( --dlf-gap-chips, 50px );
	overflow-x: visible;

	overscroll-behavior-x: contain;

	scroll-behavior: auto;

	-webkit-user-select: none;
	user-select: none;


	scrollbar-width: thin;
	scrollbar-color: var( --dlf-bar-thumb, #2563EB ) var( --dlf-bar-track, #E8EEFF );
}

@supports selector( ::-webkit-scrollbar ) {

	.dlf-chips {
		scrollbar-width: auto;
		scrollbar-color: auto;
	}

	.dlf-chips::-webkit-scrollbar {
		height: var( --dlf-bar-h, 6px );
	}
	.dlf-chips::-webkit-scrollbar-track {
		border-radius: 999px;
		background: var( --dlf-bar-track, #E8EEFF );
	}
	.dlf-chips::-webkit-scrollbar-thumb {
		border-radius: 999px;
		background: var( --dlf-bar-thumb, #2563EB );
	}
	.dlf-chips::-webkit-scrollbar-button {
		display: none;
		width: 0;
		height: 0;
	}
}


.dlf-section .dlf-chip { flex: 0 0 auto; }

.dlf-section .dlf-chip,
.dlf-section .dlf-chip:hover,
.dlf-section .dlf-chip:focus,
.dlf-section .dlf-chip:active,
.dlf-section .dlf-chip:focus-visible {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var( --dlf-chip-h, 70px );
	padding: 0 var( --dlf-chip-pad-x, 30px );
	max-width: 100%;
	border: 1px solid var( --dlf-chip-edge, #E2E8F0 );
	border-radius: var( --dlf-chip-radius, 999px );
	background: var( --dlf-chip-bg, #FFFFFF );
	background-image: none;
	box-shadow: 0 1px 2px rgba( 15, 23, 42, .05 );
	outline: none;
	color: var( --dlf-chip, #475569 );
	font-family: inherit;
	font-weight: 500;
	line-height: 1.25;
	text-align: center;
	white-space: normal;
	text-transform: capitalize;
	font-size: max( 14px, calc( var( --dlf-chip-fs, 16px ) * var( --dlf-bs ) ) );
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.dlf-section .dlf-chip:hover {
	transform: translateY( -1px );
	border-color: #BFD0F5;
	color: var( --dlf-chip-on-bg, #2563EB );
	box-shadow: 0 4px 10px -4px rgba( 37, 99, 235, .25 );
}

.dlf-section .dlf-chip { -webkit-user-drag: none; }

.dlf-chips.is-grabbable { cursor: grab; }
.dlf-chips.is-dragging { cursor: grabbing; }

.dlf-chips.is-dragging .dlf-chip { transform: none !important; transition: none !important; }

.dlf-section .dlf-chip.is-on,
.dlf-section .dlf-chip.is-on:hover,
.dlf-section .dlf-chip.is-on:focus {
	border-color: transparent;
	background: var( --dlf-chip-on-bg, #2563EB );
	background-image: linear-gradient( 135deg, var( --dlf-chip-on-bg, #2563EB ) 0%, #773DED 100% );
	color: var( --dlf-chip-on, #FFFFFF );
	box-shadow: 0 8px 18px -8px rgba( 37, 99, 235, .6 );
}

.dlf-section .dlf-chip:focus-visible {
	outline: 3px solid var( --dlf-chip-on-bg, #2563EB );
	outline-offset: 3px;
}

/* The list */
.dlf-section .dlf-list {
	display: flex;
	flex-direction: column;
	gap: var( --dlf-row-gap, 30px );
	margin-top: var( --dlf-gap-list, 50px );
}

.dlf-section .dlf-row {
	display: flex;
	align-items: center;

	gap: 0;

	min-height: var( --dlf-row-h, 85px );

	padding: 8px var( --dlf-row-pad-r, 24px ) 8px var( --dlf-row-pad-l, 19px );
	border-radius: var( --dlf-row-radius, 20px );
	background: var( --dlf-row-bg, #F7F9FE );
	cursor: default;
	pointer-events: none;

	overflow: hidden;
}

.dlf-num {
	flex: 0 0 var( --dlf-num-col, 124px );
	align-self: flex-end;
	transform: translateY( var( --dlf-num-sink, 23px ) );
	text-align: center;

	font-weight: var( --dlf-num-w, 500 );

	line-height: var( --dlf-num-lh, .9 );
	color: var( --dlf-num, #E9EFFF );
	font-size: max( 28px, calc( var( --dlf-num-fs, 64px ) * var( --dlf-hs ) ) );
	cursor: default;
	user-select: none;
	font-variant-numeric: proportional-nums;
	user-select: none;
}

.dlf-title {
	flex: 1 1 auto;
	min-width: 0;
	overflow-wrap: anywhere;
	padding-right: 16px;
	font-weight: 500;
	line-height: 1.24;
	text-transform: capitalize;
	color: var( --dlf-title, #333333 );
	font-size: max( 14px, calc( var( --dlf-title-fs, 21px ) * var( --dlf-bs ) ) );
	cursor: default;
	user-select: none;
}

/* The Download button */
.dlf-section .dlf-btn,
.dlf-section .dlf-btn:link,
.dlf-section .dlf-btn:visited,
.dlf-section .dlf-btn:hover,
.dlf-section .dlf-btn:focus,
.dlf-section .dlf-btn:active {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var( --dlf-btn-gap, 8px );
	min-width: var( --dlf-btn-w, 147px );
	min-height: var( --dlf-btn-h, 46px );
	padding: 0 14px;
	border: 1px solid var( --dlf-btn-border, #2563EB );
	border-radius: var( --dlf-btn-radius, 11px );
	background: var( --dlf-btn-bg, #E8EEFF );
	background-image: none;
	box-shadow: none;
	color: var( --dlf-btn, #2563EB );
	font-weight: 600;
	line-height: 1.28;
	text-decoration: none;
	font-size: max( 13px, calc( var( --dlf-btn-fs, 18px ) * var( --dlf-bs ) ) );
	transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease;
	cursor: pointer;
	pointer-events: auto;
}
.dlf-section .dlf-btn:hover {
	background: var( --dlf-btn-border, #2563EB );
	color: var( --dlf-btn-bg, #E8EEFF );
	transform: translateY( -1px );
	box-shadow: 0 6px 16px rgba( 37, 99, 235, .22 );
}
.dlf-section .dlf-btn:focus-visible {
	outline: 3px solid var( --dlf-btn-border, #2563EB );
	outline-offset: 3px;
}
.dlf-btn-icon { display: block; flex: 0 0 auto; }

.dlf-section .dlf-empty {
	margin-top: var( --dlf-gap-list, 50px );
	text-align: center;
	color: var( --dlf-subtitle, #9F9F9F );
	font-size: max( 14px, calc( var( --dlf-subtitle-fs, 20px ) * var( --dlf-bs ) ) );
}
.dlf-empty[hidden] { display: none; }

/* REVEAL, and the filter */

.dlf-js .dlf-rv { opacity: 0; }

.dlf-js .dlf-rv.dlf-rv-in {
	animation: dlf-rise .6s cubic-bezier( .22, .8, .26, 1 ) both;
	animation-delay: calc( var( --dlf-rv-i, 0 ) * 55ms );
}
@keyframes dlf-rise {
	0% {
		opacity: 0;
		transform: translate3d( 0, 14px, 0 );
	}
	60% { opacity: 1; }
	100% {
		opacity: 1;
		transform: translate3d( 0, 0, 0 );
	}
}

.dlf-js .dlf-row.is-filtering {
	animation: dlf-swap .45s cubic-bezier( .22, .8, .26, 1 ) both;
	animation-delay: calc( var( --dlf-i, 0 ) * 40ms );
}
@keyframes dlf-swap {
	0% {
		opacity: 0;
		transform: translate3d( 0, 10px, 0 ) scale( .995 );
	}
	100% {
		opacity: 1;
		transform: translate3d( 0, 0, 0 ) scale( 1 );
	}
}

.dlf-row[hidden] { display: none; }

@media ( prefers-reduced-motion: reduce ) {
	.dlf-js .dlf-rv,
	.dlf-js .dlf-rv.dlf-rv-in,
	.dlf-js .dlf-row.is-filtering {
		opacity: 1;
		transform: none;
		animation: none !important;
	}
	.dlf-section .dlf-chip,
	.dlf-section .dlf-btn { transition: none !important; }
}

/* Breakpoints */

@media ( max-width: 1439px ) {
	.dlf-section.dlf-section { --dlf-gutter: clamp( 40px, 6vw, 120px ); }
}

@media ( max-width: 1200px ) {
	.dlf-section.dlf-section {
		--dlf-hs: .9;
		--dlf-bs: .95;
		--dlf-chip-gap: 12px;
		--dlf-chip-pad-x: 18px;
		--dlf-chip-h: 42px;
		--dlf-num-col: 96px;
	}
}

@media ( max-width: 1024px ) {
	.dlf-section.dlf-section {
		--dlf-hs: .82;
		--dlf-bs: .92;
		--dlf-pad-top: 48px;
		--dlf-pad-bot: 48px;
		--dlf-gap-chips: 32px;
		--dlf-gap-list: 32px;
		--dlf-row-gap: 16px;
		--dlf-num-col: 78px;
	}
}

@media ( max-width: 900px ) {
	.dlf-section.dlf-section { --dlf-hs: .8; --dlf-bs: .95; }

	.dlf-section .dlf-row {
		flex-wrap: wrap;
		row-gap: 12px;
		padding: 16px 18px;
	}
	.dlf-num {
		flex-basis: auto;
		text-align: left;
		align-self: auto;
		transform: none;
	}
	.dlf-title { flex: 1 1 100%; order: 2; }
	.dlf-section .dlf-btn { order: 3; margin-left: auto; }
}

@media ( max-width: 600px ) {
	.dlf-section.dlf-section {
		--dlf-hs: .7;
		--dlf-bs: .9;
		--dlf-gutter: 20px;
		--dlf-pad-top: 40px;
		--dlf-pad-bot: 40px;
		--dlf-chip-gap: 8px;
		--dlf-chip-pad-x: 14px;
		--dlf-chip-h: 38px;
		--dlf-bar-gap: 10px;
		--dlf-row-radius: 16px;
	}

	.dlf-section .dlf-chips { gap: 8px; }
	.dlf-section .dlf-chip { padding: 8px 14px; min-height: var( --dlf-chip-h, 38px ); }
}

@media ( max-width: 400px ) {
	.dlf-section.dlf-section { --dlf-hs: .64; --dlf-bs: .88; --dlf-gutter: 16px; }
	.dlf-section .dlf-btn { min-width: 0; width: 100%; }
}
