/* Styles for Dragon Slayer Theme for Wizard of Ads Online */ 

:root {
    --sky:        #197FB6;
    --navy:       #14274D;
    --black:      #353535;
    --green:      #0D5752;
    --white:      #F8F8F8;
    --gray:       #333333;
    --light-gray: #808080;
    --grddark:  linear-gradient(162.97deg, #000C0B 11.73%, #093532 73.05%);
    --font-size-ms: calc( calc( var(--font-size-md) + var(--font-size-sm)) / 2);
	--font-size-ml: calc( calc( var(--font-size-md) + var(--font-size-lg)) / 2);
	--font-size-hh: calc(var(--font-size-xxxxl) * var(--font-scale));
    --button-font-family: var(--body-font-family);
    --button-font-weight: 600;
    --button-font-size: .9rem;
    --link-color: var(--sky);
    --link-color-hover: var(--white); 
    --red: #CD523C;
	--code-background: #EBEBEB;
}

.sky, .teal {
	color: var(--sky);
}

:where(.wp-block-cover-image.is-light:not(.has-text-color)), :where(.wp-block-cover.is-light:not(.has-text-color)) {
    color: var(--black);
}

/* Layout */
html {
    scroll-behavior: smooth;
}
.aligncenter {
	text-align: center;
}
.inner, .inner-md {
    max-width: var(--breakpoint-md);
    margin: auto;
}
.inner-lg {
    max-width: var(--breakpoint-lg);
    margin: auto;
}
.inner-sm {
    max-width: var(--breakpoint-sm);
    margin: auto;
}
@media only screen and (max-width: 680px) {
    .inner-sm {
        max-width: 95vw;
    }
}
@media only screen and (max-width: 800px) {
    .mobile-hidden {
		display: none;
	}
    .mobile-align-center {
        text-align: center;
    }
}
@media only screen and (max-width: 906) {
    .inner, .inner-md {
        max-width: 95vw;
    }
}
@media only screen and (max-width: 1133) {
    .inner-lg {
        max-width: 95vw;
    }
}
@media only screen and (max-width: 781px) {
    .reverse-columns, .columns-reverse {
        flex-direction: column-reverse;
    }
}

/* Fonts */ 
.smallp p {
	font-size: 1rem;
	margin-bottom: .1rem;
	line-height: 1.3;
}
.md-hd {
    font-family: var(--body-font-family);
    font-weight: 700;
    font-size: var(--font-size-xl);
    line-height: 1.2;
}

/* Buttons */ 
.button.btn-white {
	border: 2px solid var(--white);
	background-color: transparent;
}
.button.btn-white:hover {
	border: 2px solid var(--white);
	background-color: rgba(255,255,255,.3);
}  

/* Links */ 
a:focus, a:hover, :focus {
    outline-color: transparent;
}
.entry-content a:not([class]),  .entry-meta a:not(.button) {
	border-bottom: none;
	box-shadow: none;
}
.dark-bgd {
    --link-color: var(--white);
    --link-text-decoration: underline 1px solid var(--white);
    --link-text-decoration-hover: underline 1px solid var(--sky);
}
figure a:hover, figure a:active, figure a:focus {
    box-shadow: none !important;
    opacity: .88;
}

/* Rounded Images */ 
.rounded img {
	border-radius: 1.75rem;
}


/* Header */ 
.nav-header-right .menu {
	justify-content: flex-end;
}
.menu {
	--menu-font-size: var(--font-size-ms);
    --menu-font-family: var(--body-font-family);
    --menu-text-transform: uppercase;
    --menu-font-weight: 500;
}
.entry-excerpt:after, .page .entry-title-single:after {
	margin-bottom: 0;
}

/* Home Hero - Choose Page Hero */ 
.preheading, h1.preheading {
    font-size: var(--font-size-ml);
    font-family: var(--body-font-family);
    text-transform: uppercase;
    font-weight: 400;
    letter-spacing: 4px;
    margin-bottom: var(--spacing-xxs);
}
.heading {
    font-size: var(--font-size-xxxl);
    font-weight: 600;
    font-family: var(--heading-font-family);
    line-height: 1.2;
    margin-bottom: var(--spacing-lg);
}
.heading strong {
    color: var(--sky);
}
.subheading {
    font-size: var(--font-size-lg);
    font-family: var(--heading-font-family);
    font-weight: 400;
    letter-spacing: 2px;
    margin-bottom: var(--spacing-sm);
}


.home-head-col-left {
    padding: 1rem 0;
}
@media only screen and (min-width: 782px) and (max-width: 1100px) {
    .home-head-col-left {
        flex-basis: 55% !important;
    }
}
@media only screen and (max-width: 900px) {
    .home-header-cols {
        flex-wrap: wrap !important;
    }
    .home-head-col-left {
        flex-basis: 100% !important;
    }
    :root {
    --font-size-hh: 4rem;
    }
    .choose-header-hero {
        padding-top: 0;
    }
    .choose-header-hero h1 {
        margin-top: 0;
        line-height: 1;
    }
    .choose-header-hero h1 .home-hd-tp {
        font-size: var(--font-size-xxxl);
    }
    .choose-header-hero h1 .home-hd-bt {
        font-size: calc( calc(var(--font-size-xxxxl) + var(--font-size-hh)) / 1.7);
    }
}

/* Services Hero */ 
.hero-subhead {
    font-family: var(--body-font-family);
    font-weight: 500;
    font-size: var(--font-size-md);
    line-height: 1.2;
}

/* Specialties Icons - Homepage */ 
@media only screen and (max-width: 800px) {
    .specialty-icon-col {
        display: none;
    }
}

/* Border Radius Site Inner Overlap */ 
.site-inner {
    margin-bottom: -1rem;
    border-radius: 1rem;
    background-color: var(--white);
    z-index: 2;
}
.site-footer .footer-contact-form {
    padding-top: 1rem;
}

/* Footer Contact Form */
.site-footer .gfield_label {
	color: #fff;
}
.site-footer .ginput_container {
	border: 1px solid #fff;
}
.site-footer .ginput_container input {
	background: rgba(0,0,0,0);
	color: #fff;
}
.site-footer .gform_wrapper.gravity-theme .gf_step_number {
	color: #fff;
		border-color: #fff;
}
.site-footer .gform_heading {
	display: none;
}
.site-footer .charleft.ginput_counter {
	display: none;
}
.site-footer .gf_step_active .gf_step_number {
	color: var(--green) !important;
	background: #fff !important;
	border-color: #fff;
}

/* Footer Credits */ 
.footer-credits {
    padding-top: var(--spacing-xl);
    padding-bottom: var(--spacing-lg);
}
p.credit {
    text-align: center;
    font-family:  var(--body-font-family);
    text-transform: uppercase;
    font-weight: 400;
    font-size: var(--font-size-xs);
    margin-bottom: 0; 
    line-height: 1.1;
}
.credit a {
	color: #fff;
}
.credit a:hover {
    text-decoration: underline;
}

/* Icon Columns - Like Why Choose Vi on Home */ 
.icon-cols h3 {
    font-family: var(--body-font-family);
    font-weight: 600;
    font-size: var(--font-size-md);
	margin-bottom: .4rem;
}
.why-items {
	margin-top: var(--spacing-lg);
}
@media only screen and (max-width: 782px) {
    .icon-cols h2 {
        text-align: center;
    }
	.icon-cols .wp-block-columns.smallp {
		margin-bottom: 2rem !important;
	}
    .why-items figure {
        text-align: center;
    }
	.why-items p, .why-items h3 {
		max-width: 400px;
		margin-right: auto; 
		margin-left: auto;
		text-align: center;
	}
	.why-items.sgap {
		margin-top: 1rem;
	}
}
.extra-col-gap {
    --column-gap: var(--spacing-xxl);
}

/* Bracket Backgrounds */
.brkts-left, .brkts-right {
    border-radius: 1.5rem;
    margin-top: -1.5rem;
    margin-bottom: -1.5rem;
    z-index: 2;
    background: var(--white);
}
.brkts-left .wp-block-cover__inner-container, .brkts-right .wp-block-cover__inner-container {
    margin-top: 1rem;
    margin-bottom: 1.5rem;
}
.brkts-left:before, .brkts-left:after, .brkts-right:before, .brkts-right:after {
    content: '';
	height: 2rem;
	width: 2rem;
    background-size: 2rem;
	background-repeat: no-repeat !important;
    position: absolute;
    z-index: 999;
}
.brkts-left:before {
	background: url(/wp-content/themes/dragon-slayer/bgd/top-dark.svg);
	top: 2rem;
	left: 2rem;
}
.brkts-left:after {
	background: url(/wp-content/themes/dragon-slayer/bgd/bot-light.svg);
	right: 2rem;
    bottom: 1rem;
}
.brkts-right:before {
	background: url(/wp-content/themes/dragon-slayer/bgd/top-light.svg);
	top: 2rem;
	left: 2rem;
}
.brkts-right:after {
	background: url(/wp-content/themes/dragon-slayer/bgd/bot-dark.svg);
	bottom: 1rem;
	right: 2rem;
}

@media only screen and (max-width: 800px) {
    .brkts-left:before, .brkts-right:before {
        left: 1rem;
    }
    .brkts-left:after, .brkts-right:after {
        right: 1rem;
    }
}

/* Metaslider */ 

@media only screen and (min-width: 1100px) {
	.metaslider .flexslider {
	padding: 0 2rem;
}
	.metaslider .flexslider ul.flex-direction-nav li a.flex-next {
		right: -1rem !important;
	}
	.metaslider .flexslider ul.flex-direction-nav li a.flex-prev {
		left: -1rem !important;
	}
}
.metaslider {
	margin: 2rem 1rem !important;
}
.metaslider .caption-wrap .caption { 
    font-family: var(--heading-font-family);
	font-weight: 700;
	text-transform: uppercase;
	color: var(--sky);
	font-size: var(--font-size-ml);
	line-height: 1.4;
	bottom: 75px;
	width: 200px;
	left: 50%;
    padding: 0;
    position: absolute;
    text-align: center;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
.metaslider .caption-wrap {
	height: 100%;
	background: rgba(255,255,255,.75) !important;
	opacity: 0 !important;
	transition: opacity 400ms;
}
.metaslider .caption-wrap:hover {
	opacity: 1 !important;
	transition: opacity 400ms;
}
.metaslider .flexslider ul.flex-direction-nav li a {
	height: 28px !important;
	width: 28px !important;
	border-radius: 50%;
	background-repeat: no-repeat;
}
.metaslider .flexslider ul.flex-direction-nav li a {
		box-shadow: 1px 1px 3px 2px rgba(0,0,0,.5) !important;
}
.metaslider .flexslider ul.flex-direction-nav li a.flex-prev {
		background-image: url(/wp-content/themes/dragon-slayer/icon/prev.svg) !important;
}
.metaslider .flexslider ul.flex-direction-nav li a.flex-next {
		background-image: url(/wp-content/themes/dragon-slayer/icon/next.svg) !important;
}
@media only screen and (max-width: 1100px) {
	.metaslider {
		max-width: 90vw;
	}
}

/* Why Vi Icon Cols */ 
.why-vi .will-item {
    padding: 0 1rem;
}
.why-vi p {
    font-size: var(--font-size-ms);
    line-height: 1.5;
}

/* Vi's Specialties Columns */ 
.specialties-icons p {
    line-height: 1.5;
}

/* Home Outsmart Block */ 
.home-outsmart.brkts-right:after {
    bottom: 1rem;
}
.home-outsmart.brkts-right .wp-block-cover__inner-container {
    margin-bottom: 0;
}
.home-outsmart .wp-block-image, .meet-vi-hero .wp-block-image {
    margin-bottom: calc(var(--spacing-xxl) * -1.2)!important;
}

/* Home Meet Block */ 
.meet-block h3 {
    margin-bottom: var(--spacing-xs);
}
.meet-block h4 {
    font-family: var(--body-font-family);
    font-size: var(--font-size-md);
}

/* Mai Accordion */ 
.mai-accordion-summary {
    font-family: var(--body-font-family) !important;
    font-weight: 700;
}
.mai-accordion-item {
	border: 1px solid var(--gray) !important;
}
.mai-accordion-content {
	border-top: 1px solid var(--gray) !important;
}

/* Team Member Block */
.team-white .wg-member, .team-alt .wg-member {
	margin-top: 4rem;
	padding: var(--spacing-md);
}
.team-alt .wg-member {
	margin-bottom: 2.4rem !important;
}
.wg-member {
	max-width: var(--breakpoint-lg);
	margin: auto
}
.wg-member h2.wg-member-name, .wg-member p.wg-member-pronouns {
	display: inline;
}
h2.wg-member-name {
	color: var(--sky) !important;
	font-size: var(--font-size-xxxl);
}
p.wg-member-pronouns {
	font-family: var(--body-font-family);
	text-transform: capitalize;
	margin-left: 1rem;
	font-size: 1.2rem;
	vertical-align: middle !important;
	font-size: var(--font-size-md);
}

p.wg-member-title {
	font-size: var(--font-size-xl);
	font-family: var(--body-font-family);
	text-transform: uppercase;
	font-weight: 700;
	line-height: 1.1;
    margin-top: var(--spacing-xs);
	margin-bottom: var(--spacing-xs);
}
p.wg-member-position {
	font-family: var(--body-font-family);
    font-weight: 500;
	font-size: var(--font-size-ml);
	margin-bottom: var(--spacing-xs);
    font-weight: 600;
}
.wg-member-image img {
	border-radius: 50%;
}

/* Blog Archive */ 

/* Choose Columns - on /choose/ - for vi.expert business cards */ 
.choose-cols h3 {
    font-size: var(--font-size-lg);
}
.choose-cols h3 a:hover, .choose-cols h3 a:focus, .choose-cols h3 a:active {
    box-shadow: none !important;
    color: var(--color-link-dark) !important;
}

/* Blog Archives */ 
.is-archive h1.archive-title {
    font-size: var(--font-size-xxl);
}
.is-archive .entries-archive .entry-meta {
    font-size: var(--font-size-sm);
    text-transform: capitalize;
}
.is-archive .entries-archive .entry-excerpt {
    text-align: left;
    font-size: var(--font-size-ms);
    line-height: 1.4;
    font-family: var(--body-font-family);
}
.is-archive .entries-archive .entry-excerpt:after {
    display: none;
}
.is-archive .entry-image-link img{
    aspect-ratio: 16/9;
    object-fit: cover;
}
.is-archive label.wp-block-search__label {
    display: none;
}
.entries-wrap.has-columns .entry-archive:hover, .entries-wrap.has-columns .entry-archive:active, .entries-wrap.has-columns .entry-archive:focus {
	transform: scale(1.03);
	transition: var(--transition);
}

/* Single Blog Posts */ 
.single-post h1.entry-title {
    font-size: var(--font-size-xxxl);
    margin-top: var(--spacing-md);
}
.single-post .entry-meta {
    font-size: var(--font-size-md);
    text-transform: none;
}
.single-post .entry-content p {
    line-height: 1.6;
}

/* Market Glimpse */ 
.woamg {
    --table-padding: var(--spacing-xs);
    --color-border: rgba(10,20,30,.2);
}
.woamg-searchbar {
    display: flex;
    max-width: 600px;
    column-gap: 1rem;
}
.woamg-results th {
    font-family: var(--heading-font-family);
    line-height: 1.1;
    font-size: var(--font-size-sm);
    border-right: 1px solid var(--color-border);
    border-color: var(--color-border);
}
.woamg-results td {
    line-height: 1.1;
    font-size: var(--font-size-sm);
    border-color: var(--color-border);
}
table.woamg-results-totals {
    max-width: 600px;
}
.woamg-results-totals th, .woamg-results-totals td {
    border-color: var(--color-border);
}
.woamg td, .woamg th {
    border-right: 1px solid var(--color-border);
}

/* Code Line Breaks - 2025-01-16 CW */
code {
	color: var(--red);
	line-break: anywhere;
	--code-font-size: .8em;
}
/* reCAPTCHA Disclaimer - 2025-02/3 EO */
:root {
--disclaimer-font-size: 0.9rem;
}

/* Links on Light Backgrounds  - 2025-05-07 CW */ 
.light-bgd {
	--link-color-hover: var(--color-link-dark);
	--link-text-decoration-hover: underline;
}

/* Blog */ 
.entry-content > h3:not(:first-child) {
	--heading-margin-top: var(--spacing-lg) !important;
	--heading-margin-bottom: var(--spacing-xxxs);
}

/* Asterisk Color Change EO 2025-09-04 */
.gform_wrapper.gravity-theme .gfield_required.gfield_required_asterisk, .gform_wrapper.gravity-theme .gfield_error .gfield_repeater_cell label, .gform_wrapper.gravity-theme .gfield_error label, .gform_wrapper.gravity-theme .gfield_error legend, .gform_wrapper.gravity-theme .gfield_validation_message, .gform_wrapper.gravity-theme .validation_message, .gform_wrapper.gravity-theme [aria-invalid=true]+label, .gform_wrapper.gravity-theme label+[aria-invalid=true], .gform_wrapper.gravity-theme .gfield_error [aria-invalid=true]  {
	color: var(--color-primary) !important;
}
.gform_wrapper.gravity-theme .gfield_error [aria-invalid=true], .gform_wrapper.gravity-theme .gfield_validation_message, .gform_wrapper.gravity-theme .validation_message {
	border: 1px solid var(--color-primary) !important;
}