/*
Theme Name: Haven | Real Estate Divi Theme
Theme URI: https://haven.divi-layouts-pro.com/
Description: Haven is a bold, editorial Divi child theme for real estate agencies, brokers and property developers. It adds property and agent post types, a searchable listing engine with live filters, saved properties, galleries, maps and a mortgage calculator, plus a complete demo site importable in one click.
Author: Divi Layouts Pro
Author URI: https://www.elegantthemes.com/marketplace/author/divi-layouts/
Template: Divi
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: real-estate, property, agency, listings, modern, editorial
Text Domain: haven
*/

/* =========================================================================
   1. DESIGN TOKENS
   Every module is styled in the Divi Builder; these variables only feed
   the property components rendered by the theme shortcodes.
   ========================================================================= */

:root {
	--haven-forest: var(--gcid-primary-color, #0f3b2e);
	--haven-forest-deep: var(--gcid-haven-deep, #0a2a21);
	--haven-moss: var(--gcid-haven-moss, #1f5c48);
	--haven-amber: var(--gcid-haven-amber, #f2a541);
	--haven-amber-deep: #c9821c;
	--haven-cream: var(--gcid-secondary-color, #f6f1e9);
	--haven-sand: var(--gcid-haven-sand, #e6dccb);
	--haven-ink: var(--gcid-heading-color, #14201b);
	--haven-body: var(--gcid-body-color, #4f5b56);
	--haven-muted: var(--gcid-haven-muted, #7d8983);
	--haven-white: #ffffff;

	--haven-font-heading: var(--et_global_heading_font, "Fraunces"), Georgia, serif;
	--haven-font-body: var(--et_global_body_font, "Instrument Sans"), "Helvetica Neue", Arial, sans-serif;

	--haven-radius: 18px;
	--haven-radius-lg: 24px;

	--haven-shadow-xs: 0 1px 3px rgba(20, 32, 27, 0.08);
	--haven-shadow-sm: 0 8px 20px -10px rgba(20, 32, 27, 0.25);
	--haven-shadow: 0 18px 40px -18px rgba(20, 32, 27, 0.28);
	--haven-shadow-lg: 0 32px 60px -28px rgba(20, 32, 27, 0.35);

	--haven-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--haven-transition: 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

/* =========================================================================
   2. BASE
   ========================================================================= */

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	overflow-x: clip;
}

::selection {
	background: var(--haven-amber);
	color: var(--haven-ink);
	text-shadow: none;
}

/* Divi's mobile menu: show a close icon while the menu is open. */
.mobile_nav.opened .mobile_menu_bar:before {
	content: "\4d";
}

/* Italic accent word inside headings, e.g. <em class="haven-em">home</em>. */
.haven-em {
	font-style: italic;
	font-weight: 500;
	color: var(--haven-amber);
}

.haven-em-forest {
	color: var(--haven-forest);
}

/* Underlined accent: a hand-drawn stroke under a word. */
.haven-underline {
	position: relative;
	white-space: nowrap;
}

.haven-underline::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0.02em;
	height: 0.14em;
	border-radius: 100px;
	background: var(--haven-amber);
	opacity: 0.9;
	z-index: -1;
}

/* =========================================================================
   3. LAYOUT HELPERS
   Effects the Design tab cannot produce. Classes are added to modules from
   Advanced > CSS ID & Classes.
   ========================================================================= */

/* Subtle film grain on dark sections. */
.haven-grain {
	position: relative;
}

.haven-grain::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
	opacity: 0.07;
	mix-blend-mode: overlay;
	pointer-events: none;
	z-index: 0;
}

.haven-grain > .et_pb_row {
	position: relative;
	z-index: 1;
}

/* Scrolling text strip. */
.haven-marquee {
	display: flex;
	overflow: hidden;
	width: 100%;
	max-width: 100%;
	contain: inline-size;
	-webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
}

.haven-marquee-track {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 0;
	animation: haven-marquee 38s linear infinite;
}

.haven-marquee:hover .haven-marquee-track {
	animation-play-state: paused;
}

.haven-marquee-item {
	display: inline-flex;
	align-items: center;
	gap: 28px;
	padding-right: 28px;
	font-family: var(--haven-font-heading);
	font-size: 44px;
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1;
	white-space: nowrap;
	color: var(--haven-ink);
}

.haven-marquee-item::after {
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--haven-forest);
}

.haven-marquee-item em {
	font-style: italic;
	font-weight: 400;
	color: var(--haven-forest);
}

/* The strip must never dictate the width of its Divi wrappers. */
.haven-marquee-section .et_pb_row,
.haven-marquee-section .et_pb_column,
.haven-marquee-section .et_pb_code,
.haven-marquee-section .et_pb_code_inner {
	min-width: 0;
	max-width: 100%;
}

@keyframes haven-marquee {
	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(-100%);
	}
}

@media (max-width: 767px) {
	.haven-marquee-item {
		font-size: 30px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.haven-marquee-track {
		animation: none;
	}
}

/* Reveal on scroll. */
.haven-reveal {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.8s var(--haven-ease), transform 0.8s var(--haven-ease);
}

.haven-reveal.is-visible {
	opacity: 1;
	transform: none;
}

/* Cards that lift on hover (Divi groups used as cards). */
.haven-lift {
	transition: transform var(--haven-transition), box-shadow var(--haven-transition) !important;
}

.haven-lift:hover {
	transform: translateY(-6px);
	box-shadow: var(--haven-shadow-lg);
}

/* Image with the signature asymmetric corners. */
.haven-shape img,
.haven-shape .et_pb_image_wrap {
	border-radius: 48px 8px 48px 8px;
}

.haven-shape-alt img,
.haven-shape-alt .et_pb_image_wrap {
	border-radius: 8px 48px 8px 48px;
}

/* Large outlined figure used in "how it works" steps. */
.haven-outline-number {
	-webkit-text-stroke: 1px currentColor;
	-webkit-text-fill-color: transparent;
}


/* Blog module used as a card grid (class: haven-blog). Divi does not expose
   the inner spacing of grid posts, so it is set here. */
.haven-blog .et_pb_post {
	padding: 0;
	overflow: hidden;
}

.haven-blog .et_pb_post .et_pb_image_container {
	margin: 0 0 22px;
}

.haven-blog .et_pb_post .entry-title,
.haven-blog .et_pb_post .post-meta {
	padding: 0 26px;
}

.haven-blog .et_pb_post .entry-title {
	margin-bottom: 8px;
}

.haven-blog .et_pb_post .post-content {
	padding: 12px 26px 28px;
}

.haven-blog .et_pb_post .more-link {
	margin-top: 14px;
}

/* Footer link lists (class: haven-footer-links). */
.haven-footer-links a {
	display: block;
}
/* Divi search module: pill input with the theme colours. */
.haven-search-module .et_pb_searchsubmit {
	border-radius: 100px;
}

/* =========================================================================
   4. PRINT
   ========================================================================= */

@media print {
	#main-header,
	#main-footer,
	.et_pb_section.haven-header,
	.et_pb_section.haven-footer,
	.haven-top {
		display: none !important;
	}
}