/* ==========================================================================
   1. FOUNDATION: THEME, FONTS, VARIABLES AND BASE STYLES
   ========================================================================== */

/*
Theme Name: Daring Visions
Author: Daring Visions
Description: A lightweight, responsive custom theme for the Daring Visions network.
Version: 2.1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: daring-visions
*/

/* ==========================================================================

   TABLE OF CONTENT
 
	1. Fonts
	2. CSS Variables
	3. Reset / Base
	4. Typography
	5. Buttons
	6. Forms
	7. Header
	8. Navigation
	9. Hero
	10. Homepage Intro
	11. Studio
	12. Standard Pages
	13. Footer
	14. Age Gate
	15. Utility Classes
	16. Tablet (1100px)
	17. Mobile (780px)
	18. Small Mobile (520px)
	19. Accessibility
	20. Motion Reduction

  ========================================================================== */

/* ==========================================================================
   1. FONTS
   ========================================================================== */
   
@font-face {
	font-family: "Open Sans";
	font-style: normal;
	font-weight: 300 800;
	font-display: swap;
	src: url("assets/fonts/OpenSans-Variable.ttf") format("truetype");
}

@font-face {
	font-family: "Open Sans Regular";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("assets/fonts/OpenSans-Variable.ttf") format("truetype");
}

:root {
	--dv-black: #1c1c1c;
	--dv-text: #555;
	--dv-muted: #f5f5f5;
	--dv-aqua: #05d9df;
	--dv-aqua-dark: #05d9df;
	--dv-hover: #25dbdc;
	--dv-white: #fff;
	--dv-content: 1175px;
	--dv-header-height: 126px;
	--dv-page-title-space: 60px;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background: var(--dv-white);
	color: var(--dv-text);
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}

body.age-gate-open {
	overflow: hidden;
}

img {
	display: block;
	max-width: 100%;
	height: auto;
}

a {
	color: inherit;
	text-decoration: none;
}

button,
a {
	-webkit-tap-highlight-color: transparent;
}

button,
input,
textarea,
select {
	font: inherit;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.skip-link:focus {
	z-index: 99999;
	top: 8px;
	left: 8px;
	width: auto;
	height: auto;
	padding: 10px 14px;
	margin: 0;
	clip: auto;
	background: var(--dv-white);
	color: var(--dv-black);
	white-space: normal;
}

/* ==========================================================================
   2. HEADER AND NAVIGATION
   ========================================================================== */

.site-header {
	position: absolute;
	z-index: 20;
	top: 0;
	left: 0;
	width: 100%;
}

.header-inner {
	display: flex;
	align-items: center;
	width: min(calc(100% - 48px), var(--dv-content));
	min-height: var(--dv-header-height);
	margin: 0 auto;
}

.site-logo {
	flex: 0 0 auto;
}

.site-logo img {
	width: 243px;
}

.site-navigation {
	margin-left: 155px;
}

.site-navigation ul {
	display: flex;
	gap: 4px;
	padding: 0;
	margin: 0;
	list-style: none;
}

.site-navigation a {
	display: block;
	padding: 14px 20px;
	border-radius: 3px;
	color: #333;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1;
	text-transform: uppercase;
	transition: background-color 160ms ease, color 160ms ease;
}

.site-navigation a:hover,
.site-navigation a:focus-visible {
	background: var(--dv-hover);
	color: #fff;
}

.menu-toggle {
	display: none;
	width: 35px;
	height: 30px;
	padding: 0px;
	border: 0;
	border-radius: 4px;
	background: var(--dv-aqua);
	cursor: pointer;
}

.menu-toggle-bars,
.menu-toggle-bars::before,
.menu-toggle-bars::after {
    display: block;
    width: 20px;
    height: 3px;
    border-radius: 2px;
    background: var(--dv-white);
    content: "";
    transition: transform 180ms ease, opacity 180ms ease;
}

.menu-toggle-bars {
	position: relative;
	margin: auto;
}

.menu-toggle-bars::before {
    position: absolute;
    top: -6px;
    left: 0;
}

.menu-toggle-bars::after {
    position: absolute;
    top: 6px;
    left: 0;
}

/* Internal pages: move navigation to the far right. */
@media (min-width: 781px) {
	body:not(.home) .site-navigation {
		margin-left: auto;
	}
}

.site-navigation .current-menu-item a {
	background: var(--dv-aqua);
	color: #fff;
}

.site-navigation .current-menu-item a:hover,
.site-navigation .current-menu-item a:focus-visible {
	background: var(--dv-hover);
	color: #fff;
}

/* ==========================================================================
   3. HOMEPAGE HERO
   ========================================================================== */

.hero {
	display: flex;
	align-items: center;
	min-height: 588px;
	background-color: #fafafa;
	background-image: url("assets/images/hero.png");
	background-position: top center;
	background-repeat: no-repeat;
	background-size: auto 588px;
}

.hero-inner {
	width: min(calc(100% - 48px), var(--dv-content));
	margin: 60px auto 0;
}

.hero-copy {
	max-width: 825px;
}

.hero h1 {
	margin: 0 0 4px;
	color: var(--dv-black);
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 40px;
	font-weight: 700;
	letter-spacing: -0.7px;
	line-height: 1.18;
	text-transform: uppercase;
}

.hero p {
	margin: 0;
	color: #3e3e3e;
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 1.45;
}

/* ==========================================================================
   4. HOMEPAGE INTRODUCTION
   ========================================================================== */

.intro {
	padding: 110px 24px 94px;
	text-align: center;
}

.intro h2 {
	max-width: 1200px;
	margin: 0 auto 22px;
	color: var(--dv-black);
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.3;
}

.intro p {
	margin: 0 0 58px;
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: 400;
}

.outline-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 405px;
	min-height: 76px;
	padding: 16px 34px;
	border: 2px solid var(--dv-aqua);
	border-radius: 4px;
	background: transparent;
	color: #4b4b4b;
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.2;
	text-align: center;
	text-transform: uppercase;
	transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

.outline-button:hover,
.outline-button:focus-visible {
	border-color: var(--dv-hover);
	background: var(--dv-hover);
	color: #fff;
}

/* ==========================================================================
   5. STUDIO SECTIONS AND STUDIO PAGE
   ========================================================================== */

.studio {
	padding: 22px 24px 92px;
}

.section-heading {
	margin-bottom: 105px;
	text-align: center;
}

.section-heading h2 {
	margin: 0 0 18px;
	color: var(--dv-black);
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.25;
	text-transform: uppercase;
}

.section-heading p {
	margin: 0;
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: 400;
}

.studio-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 72px;
	row-gap: 124px;
	width: min(100%, var(--dv-content));
	margin: 0 auto 88px;
}

.studio-card {
	min-width: 0;
}

.studio-logo {
	display: flex;
	align-items: center;
	height: 45px;
	margin-bottom: 20px;
}

.studio-logo img {
	max-width: 100%;
	max-height: 39px;
	object-fit: contain;
	object-position: left center;
}

.studio-card p {
	max-width: 560px;
	margin: 0 0 24px;
	color: #656565;
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.75;
}

.small-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 127px;
	min-height: 38px;
	padding: 8px 18px;
	border: 2px solid var(--dv-aqua);
	border-radius: 4px;
	color: #555;
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
	text-transform: uppercase;
	transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

.small-button:hover,
.small-button:focus-visible {
	border-color: var(--dv-hover);
	background: var(--dv-hover);
	color: #fff;
}

.studio-overview {
	text-align: center;
}

.studio-page {
	padding-top: 170px;
}

.studio-page .studio {
	padding-top: 0;
}

.studio-page .section-heading {
	margin-bottom: 105px;
}

.studio-page .section-heading h1 {
	margin: 0 0 18px;
	color: var(--dv-black);
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.25;
	text-transform: uppercase;
}

/* ==========================================================================
   6. STANDARD WORDPRESS PAGES
   ========================================================================== */

.standard-page {
	padding: calc(var(--dv-header-height) + var(--dv-page-title-space)) 24px 110px;
	background: var(--dv-white);
}

.standard-page-inner {
	width: min(100%, 950px);
	margin: 0 auto;
}

.standard-page-header {
	margin-bottom: var(--dv-page-title-space);
	text-align: center;
}

.standard-page-title {
	margin: 0;
	color: var(--dv-black);
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 42px;
	font-weight: 700;
	line-height: 1.2;
	text-transform: uppercase;
}

.standard-page-content {
	color: var(--dv-text);
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 1.8;
}

.standard-page-content h2,
.standard-page-content h3,
.standard-page-content h4 {
	margin: 42px 0 16px;
	color: var(--dv-black);
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	line-height: 1.3;
}

.standard-page-content h2 {
	font-size: 30px;
}

.standard-page-content h3 {
	font-size: 24px;
}

.standard-page-content h4 {
	font-size: 20px;
}

.standard-page-content p {
	margin: 0 0 22px;
}

.standard-page-content ul,
.standard-page-content ol {
	margin: 0 0 24px;
	padding-left: 26px;
}

.standard-page-content li + li {
	margin-top: 8px;
}

.standard-page-content a {
	color: var(--dv-aqua-dark);
	text-decoration: underline;
}

.standard-page-content a:hover,
.standard-page-content a:focus-visible {
	color: var(--dv-hover);
}

.standard-page-content img {
	margin: 32px auto;
}

/* ==========================================================================
   7. FOOTER
   ========================================================================== */

.site-footer {
	min-height: 724px;
	padding: 108px 24px 45px;
	background: var(--dv-muted);
}

.footer-inner {
	display: grid;
	grid-template-columns: 1.35fr 0.9fr 1fr;
	gap: 80px;
	width: min(100%, 1150px);
	margin: 0 auto;
}

.footer-logo {
	width: 215px;
	margin-bottom: 22px;
}

.made-in {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	color: #555;
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: 400;
}

.made-in img {
	width: 17px;
	height: 15px;
	margin: 0 2px;
}

.footer-heading {
	margin: 0 0 30px;
	color: #555;
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: 400;
	text-transform: uppercase;
}

.footer-links {
	padding: 0;
	margin: 0;
	list-style: none;
}

.footer-links li + li {
	margin-top: 16px;
}

.footer-links a {
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: 400;
	transition: color 160ms ease;
}

.footer-links a:hover,
.footer-links a:focus-visible {
	color: var(--dv-hover);
}

.social-links {
	display: flex;
	align-items: center;
	gap: 12px;
}

.social-links a {
	display: grid;
	place-items: center;
	width: 27px;
	height: 27px;
	border-radius: 2px;
}

.social-links .dv-social-icon {
	position: static;
	grid-area: 1 / 1;
	max-width: none;
	max-height: none;
	object-fit: contain;
	transform: none;
	transition: opacity 160ms ease;
}

.social-links .dv-social-link-x .dv-social-icon {
	width: 25px;
	height: 27px;
	aspect-ratio: 25 / 27;
}

.social-links .dv-social-link-facebook .dv-social-icon {
	width: 16px;
	height: 25px;
	aspect-ratio: 16 / 25;
}

.dv-social-icon-hover {
	opacity: 0;
}

.social-links a:hover .dv-social-icon-default,
.social-links a:focus-visible .dv-social-icon-default {
	opacity: 0;
}

.social-links a:hover .dv-social-icon-hover,
.social-links a:focus-visible .dv-social-icon-hover {
	opacity: 1;
}

.social-links a:focus-visible {
	outline: 2px solid var(--dv-hover);
	outline-offset: 4px;
}

.copyright {
	margin: 160px 0 0;
	text-align: center;
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: 400;
}

/* ==========================================================================
   8. AGE GATE AND FALLBACK NOTICE
   ========================================================================== */

.age-gate[hidden] {
	display: none;
}

.age-gate {
	position: fixed;
	z-index: 9999;
	inset: 0;
	display: grid;
	place-items: center;
	padding: 24px;
	background: rgba(12, 14, 16, 0.9);
	backdrop-filter: blur(7px);
}

.age-gate-card {
	width: min(100%, 540px);
	padding: 46px 44px 42px;
	border-top: 4px solid var(--dv-aqua);
	background: var(--dv-white);
	box-shadow: 0 22px 70px rgba(0, 0, 0, 0.35);
	text-align: center;
}

.age-gate-logo {
	display: block;
	width: 243px;
	margin: 0 auto 32px;
	position: relative;
	left: 8px;
}

.age-gate h2 {
	margin: 0 0 16px;
	color: var(--dv-black);
	font-size: 30px;
	line-height: 1.2;
	text-transform: uppercase;
}

.age-gate p {
	margin: 0 auto 28px;
	color: #555;
	font-size: 16px;
	line-height: 1.6;
}

.age-gate-actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}

.age-button {
	min-height: 52px;
	padding: 12px 18px;
	border: 2px solid var(--dv-aqua);
	border-radius: 3px;
	background: transparent;
	color: #444;
	cursor: pointer;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.age-button:hover,
.age-button:focus-visible {
	border-color: var(--dv-aqua-dark);
	background: var(--dv-aqua-dark);
	color: var(--dv-white);
}



.no-js-notice {
	padding: 14px 20px;
	background: #111;
	color: #fff;
	text-align: center;
}

.age-gate-actions .age-button,
.age-gate-actions .age-button-secondary {
	background: transparent;
	border: 2px solid var(--dv-aqua);
	color: #444;
}

.age-gate-actions .age-button:hover,
.age-gate-actions .age-button:focus-visible,
.age-gate-actions .age-button-secondary:hover,
.age-gate-actions .age-button-secondary:focus-visible {
	background: var(--dv-aqua-dark);
	border-color: var(--dv-aqua-dark);
	color: var(--dv-white);
}

.age-gate-actions .age-button:focus,
.age-gate-actions .age-button:focus-visible,
.age-gate-actions .age-button-secondary:focus,
.age-gate-actions .age-button-secondary:focus-visible {
	outline: none;
	box-shadow: none;
}

/* ==========================================================================
   9. RESPONSIVE STYLES
   ========================================================================== */

@media (max-width: 1100px) {
	.site-navigation {
		margin-left: auto;
	}

	.hero {
		background-position: 58% top;
	}

	.hero-copy {
		max-width: 55%;
	}

	.hero h1 {
		font-size: 32px;
	}

	.hero p {
		font-size: 18px;
	}
}

@media (max-width: 780px) {
	:root {
		--dv-header-height: 104px;
		--dv-page-title-space: 42px;
	}
	.header-inner {
		position: relative;
		width: calc(100% - 32px);
		min-height: var(--dv-header-height);
	}

	.site-logo img {
		width: min(243px, 64vw);
	}

	.menu-toggle {
		display: flex;
		margin-left: auto;
	}

	.site-navigation {
		position: absolute;
		top: 92px;
		right: 0;
		left: 0;
		margin: 0;
		padding: 18px 26px;
		background: #0c1116;
		box-shadow: 0 16px 28px rgba(0, 0, 0, 0.18);
		opacity: 0;
		visibility: hidden;
		transform: translateY(-8px);
		transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease;
	}

	.site-navigation.is-open {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	.site-navigation ul {
		display: block;
	}

	.site-navigation li + li {
		margin-top: 2px;
	}

	.site-navigation a {
		padding: 16px;
		color: var(--dv-white);
		font-size: 16px;
	}

	.hero {
		align-items: center;
		min-height: 430px;
		background-position: 68% center;
		background-size: auto 430px;
		background-repeat: no-repeat;
	}

	.hero-inner {
		width: calc(100% - 32px);
		margin: 0 auto;
		padding: 30px 0;
		background: transparent;
	}
	
	.hero-copy {
		max-width: 56%;
		margin-left: -8px;
		text-align: left;
		transform: translateY(-10px);
	}
	
	.hero h1 {
		margin-bottom: 18px;
		font-size: clamp(25px, 7vw, 32px);
		line-height: 1.08;
	}

	.hero p {
		margin-top: 0;
		font-size: 15px;
		line-height: 1.8;
	}

	.intro {
		padding: 74px 22px 78px;
	}

	.intro p {
		margin-bottom: 40px;
	}

	.outline-button {
		width: min(100%, 405px);
		min-width: 0;
	}

	.studio {
		padding: 8px 24px 76px;
	}

	.section-heading {
		margin-bottom: 68px;
	}

	.studio-grid {
		grid-template-columns: 1fr;
		row-gap: 78px;
		margin-bottom: 76px;
	}

	.studio-card {
		text-align: center;
	}

	.studio-logo {
		justify-content: center;
	}

	.studio-logo img {
		object-position: center;
	}

	.studio-card p {
		margin-right: auto;
		margin-left: auto;
	}

	.site-footer {
		min-height: 0;
		padding-top: 72px;
	}

	.footer-inner {
		grid-template-columns: 1fr 1fr;
		gap: 58px 36px;
	}

	.footer-brand {
		grid-column: 1 / -1;
	}

	.copyright {
		margin-top: 90px;
	}
}

@media (max-width: 520px) {
	.hero {
		min-height: 455px;
		background-position: 73% 0;
		background-size: auto 455px;
	}

	.hero-inner {
		padding: 30px 20px 38px;
	}

	.intro h2 {
		font-size: 23px;
	}

	.section-heading h2 {
		font-size: 25px;
	}

	.footer-inner {
		grid-template-columns: 1fr;
	}

	.footer-brand {
		grid-column: auto;
	}

	.age-gate-card {
		padding: 36px 24px 30px;
	}

	.age-gate-logo {
		width: min(243px, 75vw);
	}

	.age-gate h2 {
		font-size: 26px;
	}

	.age-gate-actions {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}

@media (max-width: 780px) {
	.standard-page {
		padding: calc(var(--dv-header-height) + var(--dv-page-title-space)) 22px 80px;
	}


	.standard-page-title {
		font-size: clamp(30px, 8vw, 38px);
	}

	.standard-page-content {
		font-size: 16px;
		line-height: 1.75;
	}

	.standard-page-content h2 {
		font-size: 26px;
	}

	.standard-page-content h3 {
		font-size: 22px;
	}
}

@media (max-width: 780px) {
	.studio-page {
		padding-top: 135px;
	}

	.studio-page .section-heading {
		margin-bottom: 68px;
	}

	.studio-page .section-heading h1 {
		font-size: 25px;
	}
}

/*

/* ==========================================================================
   10. SUPPORT PAGE / CONTACT FORM 7
   ========================================================================== */

.support-page {
	padding-top: 0;
	background: var(--dv-white);
}

.support-page .section {
	padding-top: 174px;
	padding-bottom: 0;
}

.support-page .container {
	width: min(calc(100% - 30px), 1197px);
	margin: 0 auto;
}

.support-page .row {
	display: flex;
	flex-wrap: wrap;
	margin-right: -15px;
	margin-left: -15px;
}

.support-page .section-content {
	flex: 0 0 100%;
	width: 100%;
	max-width: 705px;
	margin: 0 auto;
	padding-right: 15px;
	padding-bottom: 160px;
	padding-left: 15px;
}

.support-page .section-title {
	text-align: center;
}

.support-page .section-title h2 {
	margin: 0 0 70px;
	color: var(--dv-black);
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 58px;
	text-transform: uppercase;
}

.support-page .section-title p {
	max-width: 705px;
	margin: 0 auto;
	color: var(--dv-text);
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 29px;
}

.support-page #contactForm {
	width: 100%;
	margin-top: 62px;
}

.support-page .contact-form-content,
.support-page .wpcf7,
.support-page .wpcf7-form {
	width: 100%;
}

/* Contact Form 7 wraps each form row in a direct <p> element. */
.support-page .wpcf7-form > p {
	margin: 0 0 28px;
}

.support-page .wpcf7-form > p:last-of-type {
	margin-bottom: 0;
}

.support-page .contact-form-content .field,
.support-page .contact-form-content .field-extra {
	display: block;
	width: 100%;
	margin: 0;
}

.support-page .contact-form-content label {
	display: block;
	width: 100%;
	margin: 0;
	color: var(--dv-text);
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 29px;
	text-transform: none;
}

.support-page .field_des {
	display: block;
	margin: 0 0 16px;
	color: #a3a3a3;
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 29px;
}

.support-page .wpcf7-form-control-wrap {
	display: block;
	width: 100%;
	margin-top: 10px;
}

.support-page .field_des + .wpcf7-form-control-wrap {
	margin-top: 0;
}

.support-page .contact-form-content input[type="text"],
.support-page .contact-form-content input[type="email"],
.support-page .contact-form-content input[type="tel"],
.support-page .contact-form-content select,
.support-page .contact-form-content textarea {
	display: block;
	width: 100%;
	min-height: 62px;
	padding-right: 20px;
	padding-left: 20px;
	border: 1px solid #e2e2e2;
	border-radius: 4px;
	background-color: var(--dv-white);
	color: #3b3b3b;
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 17px;
	font-weight: 400;
	line-height: 25px;
	outline: none;
	box-sizing: border-box;
}

.support-page .contact-form-content input[type="text"],
.support-page .contact-form-content input[type="email"],
.support-page .contact-form-content input[type="tel"] {
	padding-top: 5px;
	padding-bottom: 5px;
}

.support-page .contact-form-content select {
	padding-top: 18px;
	padding-right: 52px;
	padding-bottom: 18px;
	color: #9b9b9b;
	background-image:
		linear-gradient(45deg, transparent 50%, var(--dv-aqua) 50%),
		linear-gradient(135deg, var(--dv-aqua) 50%, transparent 50%);
	background-position:
		calc(100% - 22px) 28px,
		calc(100% - 15px) 28px;
	background-repeat: no-repeat;
	background-size: 7px 7px;
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
}

.support-page select:valid {
	color: #333;
}

.support-page .contact-form-content textarea {
	min-height: 275px;
	padding-top: 15px;
	padding-bottom: 15px;
	resize: vertical;
}

.support-page .contact-form-content input[type="text"]:focus,
.support-page .contact-form-content input[type="email"]:focus,
.support-page .contact-form-content input[type="tel"]:focus,
.support-page .contact-form-content select:focus,
.support-page .contact-form-content textarea:focus {
	border-color: var(--dv-aqua);
	color: #3b3b3b;
}

.support-page #contactForm .dv-submit-button {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 76px;
	padding: 16px 34px;
	margin-top: 25px;
	border: 2px solid var(--dv-aqua);
	border-radius: 4px;
	background: transparent;
	color: #4b4b4b;
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.2;
	text-align: center;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

.support-page #contactForm .dv-submit-button:hover,
.support-page #contactForm .dv-submit-button:focus-visible {
	border-color: var(--dv-hover);
	background: var(--dv-hover);
	color: var(--dv-white);
}

.support-page #contactForm .dv-submit-button:disabled {
	cursor: not-allowed;
}

.support-page #contactForm .dv-submit-button__text,
.support-page #contactForm .dv-submit-button__loader {
	pointer-events: none;
}

.support-page #contactForm .dv-submit-button__loader {
	display: none;
	width: 28px;
	height: 28px;
	border: 4px solid #25dbdc;
	border-right-color: transparent;
	border-right-color: transparent;
	border-radius: 50%;
	animation: dv-submit-spin 0.75s linear infinite;
}

.support-page #contactForm .dv-submit-button.is-loading .dv-submit-button__text {
	display: none;
}

.support-page #contactForm .dv-submit-button.is-loading .dv-submit-button__loader {
	display: block;
}

.support-page #contactForm .wpcf7-spinner {
	display: none !important;
}

@keyframes dv-submit-spin {
	to {
		transform: rotate(360deg);
	}
}

.support-page .wpcf7-not-valid-tip {
	display: block;
	clear: both;
	width: 100%;
	margin-top: 5px;
	color: #ff5050;
	font-family: "Open Sans Regular", "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 25px;
}

.support-page .wpcf7-form-control.wpcf7-not-valid {
	border-color: #ff5050;
}

.support-page .wpcf7 form.sent .wpcf7-response-output {
	width: 100%;
	margin: 25px 0 0;
	padding: 18px 20px;
	border: 1px solid #adde78;
	border-radius: 4px;
	background-color: #c7ffc7;
	color: var(--dv-black);
	font-size: 14px;
	line-height: 25px;
	box-sizing: border-box;
}

.support-page .wpcf7 form.invalid .wpcf7-response-output,
.support-page .wpcf7 form.unaccepted .wpcf7-response-output,
.support-page .wpcf7 form.payment-required .wpcf7-response-output,
.support-page .wpcf7 form.failed .wpcf7-response-output,
.support-page .wpcf7 form.aborted .wpcf7-response-output,
.support-page .wpcf7 form.spam .wpcf7-response-output {
	width: 100%;
	margin: 25px 0 0;
	padding: 15px 20px;
	border: 1px solid #ffb8b8;
	border-radius: 4px;
	background-color: #fff1f1;
	color: #9e1c1c;
	font-size: 14px;
	line-height: 25px;
	box-sizing: border-box;
}

.support-page .wpcf7-form::after {
	display: table;
	clear: both;
	content: "";
}

.support-page .cf-turnstile,
.support-page .g-recaptcha {
	margin-bottom: 20px;
}

@media (max-width: 780px) {
	.support-page .section {
		padding-top: 146px;
	}

	.support-page .section-content {
		padding-bottom: 100px;
	}

	.support-page .section-title h2 {
		margin-bottom: 42px;
		font-size: 38px;
		line-height: 46px;
	}

	.support-page #contactForm {
		margin-top: 42px;
	}

	.support-page .wpcf7-form > p {
		margin-bottom: 24px;
	}

	.support-page .contact-form-content textarea {
		min-height: 230px;
	}
}


body:not(.page-id-14) .grecaptcha-badge {
    display: none !important;
}