/*
Theme Name: DreamLine by Kova
Description: Custom child theme for the DreamLine Custom Cabinetry site, built by Kova Team on Hello Elementor. Holds the sitewide base styles, fonts, resets and motion so imported pages render and move the same as their HTML files. Custom to this site: not on wordpress.org, never update it from there.
Author: Kova Team
Template: hello-elementor
Version: 2.0.9
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: kova-dreamline
Update URI: false
*/

/* ------------------------------------------------------------
   1. Base
   The same html and body rules every DreamLine page file uses.
   aitoelementor maps styles onto elements, so these rules have
   nowhere to go on import. They live here instead.
   ------------------------------------------------------------ */
html,
body {
	margin: 0;
	padding: 0;
}

body {
	box-sizing: border-box;
	font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
	color: #111111;
	background: #f5f5f5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

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

/* ------------------------------------------------------------
   2. Text editor widgets
   Hello's reset is switched off in functions.php, so paragraphs
   get spacing between them and none after the last one, which
   matches the page files.
   ------------------------------------------------------------ */
.elementor-widget-text-editor p {
	margin: 0 0 1em;
}

.elementor-widget-text-editor p:last-child {
	margin-bottom: 0;
}

/* ------------------------------------------------------------
   3. Jump links (series guides and any in-page anchors)
   ------------------------------------------------------------ */
html {
	scroll-behavior: smooth;
}

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

/* ------------------------------------------------------------
   4. Accessibility
   Hello's reset normally hides the skip link. It is switched off,
   so the rules are kept here.
   ------------------------------------------------------------ */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background: #ffffff;
	clip: auto !important;
	clip-path: none;
	color: #111111;
	display: block;
	font-size: 14px;
	font-weight: 600;
	height: auto;
	left: 8px;
	padding: 12px 20px;
	top: 8px;
	width: auto;
	z-index: 100000;
}

/* ------------------------------------------------------------
   5. Wide screens (1440px and up)
   The page files keep content centered on wide screens by growing
   each section's side padding. aitoelementor bakes that padding in
   at its own sampling width, which is where the extra side space on
   desktop came from. The rule now lives here, keyed on the dlw-
   classes the page files carry, so desktop keeps the exact padding.
   The importer adds its own forced rules with repeated classes
   (.hte-box-1.hte-box-1.hte-box-1), so these repeat the class five
   times to outrank them.
   ------------------------------------------------------------ */
@media (min-width:1440px){
	html body .elementor .page.page.page.page.page {
		max-width: none !important;
		width: 100% !important;
	}
	html body .elementor .page.page.page.page.page > .e-con-inner {
		max-width: none !important;
	}
	html body .elementor .dlw-add-0.dlw-add-0.dlw-add-0.dlw-add-0.dlw-add-0 {
		--padding-left: calc(0px + max(0px, (100% - 1440px) / 2)) !important;
		--padding-right: calc(0px + max(0px, (100% - 1440px) / 2)) !important;
		padding-left: calc(0px + max(0px, (100% - 1440px) / 2)) !important;
		padding-right: calc(0px + max(0px, (100% - 1440px) / 2)) !important;
	}
	html body .elementor .dlw-add-72.dlw-add-72.dlw-add-72.dlw-add-72.dlw-add-72 {
		--padding-left: calc(72px + max(0px, (100% - 1440px) / 2)) !important;
		--padding-right: calc(72px + max(0px, (100% - 1440px) / 2)) !important;
		padding-left: calc(72px + max(0px, (100% - 1440px) / 2)) !important;
		padding-right: calc(72px + max(0px, (100% - 1440px) / 2)) !important;
	}
	html body .elementor .dlw-add-130.dlw-add-130.dlw-add-130.dlw-add-130.dlw-add-130 {
		--padding-left: calc(130px + max(0px, (100% - 1440px) / 2)) !important;
		--padding-right: calc(130px + max(0px, (100% - 1440px) / 2)) !important;
		padding-left: calc(130px + max(0px, (100% - 1440px) / 2)) !important;
		padding-right: calc(130px + max(0px, (100% - 1440px) / 2)) !important;
	}
	html body .elementor .dlw-max-0.dlw-max-0.dlw-max-0.dlw-max-0.dlw-max-0 {
		--padding-left: max(0px, calc((100% - 1440px) / 2)) !important;
		--padding-right: max(0px, calc((100% - 1440px) / 2)) !important;
		padding-left: max(0px, calc((100% - 1440px) / 2)) !important;
		padding-right: max(0px, calc((100% - 1440px) / 2)) !important;
	}
	html body .elementor .dlw-max-50.dlw-max-50.dlw-max-50.dlw-max-50.dlw-max-50 {
		--padding-left: max(50px, calc((100% - 1440px) / 2)) !important;
		--padding-right: max(50px, calc((100% - 1440px) / 2)) !important;
		padding-left: max(50px, calc((100% - 1440px) / 2)) !important;
		padding-right: max(50px, calc((100% - 1440px) / 2)) !important;
	}
	html body .elementor .dlw-max-72.dlw-max-72.dlw-max-72.dlw-max-72.dlw-max-72 {
		--padding-left: max(72px, calc((100% - 1440px) / 2)) !important;
		--padding-right: max(72px, calc((100% - 1440px) / 2)) !important;
		padding-left: max(72px, calc((100% - 1440px) / 2)) !important;
		padding-right: max(72px, calc((100% - 1440px) / 2)) !important;
	}
	html body .elementor .dlw-max-100.dlw-max-100.dlw-max-100.dlw-max-100.dlw-max-100 {
		--padding-left: max(100px, calc((100% - 1440px) / 2)) !important;
		--padding-right: max(100px, calc((100% - 1440px) / 2)) !important;
		padding-left: max(100px, calc((100% - 1440px) / 2)) !important;
		padding-right: max(100px, calc((100% - 1440px) / 2)) !important;
	}
	html body .elementor .dlw-max-130.dlw-max-130.dlw-max-130.dlw-max-130.dlw-max-130 {
		--padding-left: max(130px, calc((100% - 1440px) / 2)) !important;
		--padding-right: max(130px, calc((100% - 1440px) / 2)) !important;
		padding-left: max(130px, calc((100% - 1440px) / 2)) !important;
		padding-right: max(130px, calc((100% - 1440px) / 2)) !important;
	}
	html body .elementor .dlw-max-340.dlw-max-340.dlw-max-340.dlw-max-340.dlw-max-340 {
		--padding-left: max(340px, calc((100% - 1440px) / 2)) !important;
		--padding-right: max(340px, calc((100% - 1440px) / 2)) !important;
		padding-left: max(340px, calc((100% - 1440px) / 2)) !important;
		padding-right: max(340px, calc((100% - 1440px) / 2)) !important;
	}
}


/* ------------------------------------------------------------
   7. Heading typography, sitewide
   Section headings (h1, h2): Cinzel, all caps.
   Smaller headings (h3 to h6, and Elementor heading widgets set to a
   plain tag such as div): Montserrat, all caps.
   Everything else: Montserrat.
   These are forced (!important) so they win over the fonts Elementor
   sets on individual widgets.
   ------------------------------------------------------------ */
h1,
h2 {
	font-family: 'Cinzel', 'Times New Roman', serif !important;
	text-transform: uppercase !important;
}

h3,
h4,
h5,
h6,
.elementor-heading-title:not(h1):not(h2) {
	font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif !important;
	text-transform: uppercase !important;
}

.elementor-widget-text-editor,
.elementor-widget-text-editor *:not(i):not([class*="icon"]),
.elementor-flip-box__layer__description,
.kd-doors .attrs .v,
body.kd-service .se-step .n {
	font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif !important;
}

/* The door index filter group names are h2s in the markup but small labels on the page. */
.kd-archive .rail h2 {
	font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif !important;
}