/* ==========================================================================
   Williams Morley: design tokens, typography, buttons, forms, header, footer.
   Values come from the Elementor kit of the old site (see BUILD-NOTES.md).
   Breakpoints: tablet <= 1024px, mobile <= 767px (Elementor 768 / 1025).
   ========================================================================== */

/* Figtree is a variable font: one file per subset covers weights 300-900. */
@font-face {
	font-family: 'Figtree';
	font-style: normal;
	font-weight: 300 900;
	font-display: swap;
	src: url('../fonts/figtree-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Figtree';
	font-style: normal;
	font-weight: 300 900;
	font-display: swap;
	src: url('../fonts/figtree-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Figtree';
	font-style: italic;
	font-weight: 300 900;
	font-display: swap;
	src: url('../fonts/figtree-italic-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Figtree';
	font-style: italic;
	font-weight: 300 900;
	font-display: swap;
	src: url('../fonts/figtree-italic-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	--wm-moss: #4B5A49;          /* primary */
	--wm-lime: #DEE5BF;          /* secondary, pastel lime */
	--wm-text: #1A1A1A;
	--wm-accent: #D14E27;        /* fire orange */
	--wm-accent-dark: #A73E1F;   /* link hover */
	--wm-accent-light: #DA7152;
	--wm-stone: #EAE8E3;         /* off white */
	--wm-white: #FFFFFF;
	--wm-content-width: 1170px;
	--wm-font: 'Figtree', Arial, Helvetica, sans-serif;
	--wm-radius-pill: 999px;
}

/* ---------- Base typography ---------- */
html body,
html body p,
html body input,
html body textarea,
html body select,
html body button,
html body .sf-menu,
html body #slide-out-widget-area,
html body .nectar-button,
html body [class*="epl-"]:not([class*="icon"]):not(i) {
	font-family: var(--wm-font);
}
html body {
	font-size: 16px;
	line-height: 1.5;
	font-weight: 400;
	color: var(--wm-text);
	-webkit-font-smoothing: antialiased;
}
html body p { font-size: 16px; line-height: 1.5; }

html body h1, html body .row .col h1,
html body h2, html body .row .col h2,
html body h3, html body .row .col h3,
html body h4, html body .row .col h4,
html body h5, html body .row .col h5,
html body h6, html body .row .col h6 {
	font-family: var(--wm-font);
	color: var(--wm-moss);
	letter-spacing: 0;
	text-transform: none;
}
html body h1, html body .row .col h1 { font-size: 64px; line-height: 1.2; font-weight: 500; letter-spacing: -0.02em; }
html body h2, html body .row .col h2 { font-size: 48px; line-height: 1.2; font-weight: 500; }
html body h3, html body .row .col h3 { font-size: 40px; line-height: 1.4; font-weight: 500; }
html body h4, html body .row .col h4 { font-size: 24px; line-height: 1.4; font-weight: 400; }
html body h5, html body .row .col h5 { font-size: 16px; line-height: 1.5; font-weight: 500; text-transform: uppercase; letter-spacing: 0.8px; }
html body h6, html body .row .col h6 { font-size: 16px; line-height: 1.5; font-weight: 400; }

@media (max-width: 1024px) {
	html body h1, html body .row .col h1 { font-size: 50px; }
	html body h2, html body .row .col h2 { font-size: 36px; }
	html body h3, html body .row .col h3 { font-size: 36px; }
	html body h4, html body .row .col h4 { font-size: 22px; }
}
@media (max-width: 767px) {
	html body h1, html body .row .col h1 { font-size: 40px; }
	html body h2, html body .row .col h2 { font-size: 28px; }
	html body h3, html body .row .col h3 { font-size: 30px; }
	html body h4, html body .row .col h4 { font-size: 20px; }
}

/* ---------- Links ---------- */
html body a { color: var(--wm-accent); transition: color .2s ease; }
html body a:hover, html body a:focus { color: var(--wm-accent-dark); }

/* ---------- Buttons (pill, 2px border, accent) ---------- */
.wm-button,
html body .nectar-button.regular-button,
html body .gform_wrapper .gform_footer .gform_button,
html body .gform_wrapper .gform_page_footer .gform_button,
html body .gform_wrapper button[type="submit"],
html body .gform_wrapper input[type="submit"] {
	display: inline-block;
	font-family: var(--wm-font);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5;
	padding: 10px 25px;
	border: 2px solid var(--wm-accent);
	border-radius: var(--wm-radius-pill);
	background: var(--wm-accent);
	color: var(--wm-white);
	text-transform: none;
	letter-spacing: 0;
	box-shadow: none;
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.wm-button:hover, .wm-button:focus,
html body .nectar-button.regular-button:hover,
html body .gform_wrapper .gform_footer .gform_button:hover,
html body .gform_wrapper .gform_page_footer .gform_button:hover,
html body .gform_wrapper button[type="submit"]:hover,
html body .gform_wrapper input[type="submit"]:hover {
	background: transparent;
	color: var(--wm-accent);
	border-color: var(--wm-accent);
	opacity: 1;
}

/* ---------- Gravity Forms inputs: square, 1px text-colour border, accent on focus ---------- */
html body .gform_wrapper input[type="text"],
html body .gform_wrapper input[type="email"],
html body .gform_wrapper input[type="tel"],
html body .gform_wrapper input[type="number"],
html body .gform_wrapper input[type="url"],
html body .gform_wrapper select,
html body .gform_wrapper textarea {
	font-family: var(--wm-font);
	font-size: 16px;
	color: var(--wm-text);
	background: var(--wm-white);
	border: 1px solid var(--wm-text);
	border-radius: 0;
	box-shadow: none;
	padding: 10px 14px;
}
html body .gform_wrapper input:focus,
html body .gform_wrapper select:focus,
html body .gform_wrapper textarea:focus {
	border-color: var(--wm-accent);
	outline: none;
	box-shadow: none;
}

/* ==========================================================================
   Header (Salient standard header, logo left, menu right, pill CTA)
   ========================================================================== */
#header-outer,
#header-outer[data-transparent-header="true"].scrolled-down,
body #header-outer.small-nav {
	background-color: var(--wm-white);
	box-shadow: none;
	border-bottom: 0;
}
#header-outer header#top nav > ul > li > a,
#header-outer #top .sf-menu > li > a,
body #header-outer .sf-menu > li > a {
	font-family: var(--wm-font);
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--wm-text);
}
#header-outer #top .sf-menu > li > a:hover,
#header-outer #top .sf-menu > li.sfHover > a {
	color: var(--wm-accent);
}
/* The old header did not highlight the current page (Salient does, with !important). */
body #header-outer[data-lhe="default"] #top nav .sf-menu > .current-menu-item:not(.wm-menu-cta) > a,
body #header-outer[data-lhe="default"] #top nav .sf-menu > .current_page_item:not(.wm-menu-cta) > a,
body #header-outer[data-lhe="default"] #top nav .sf-menu > .current_page_ancestor > a,
body #header-outer[data-lhe="default"] #top nav .sf-menu > .current-menu-ancestor > a {
	color: var(--wm-text) !important;
}
body #header-outer[data-lhe="default"] #top nav .sf-menu > li:not(.wm-menu-cta):hover > a,
body #header-outer[data-lhe="default"] #top nav .sf-menu > li.sfHover:not(.wm-menu-cta) > a {
	color: var(--wm-accent) !important;
}
/* Chevron on items with a dropdown (For Sale, About Us). */
#header-outer #top .sf-menu > li.menu-item-has-children > a .menu-title-text:after {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-left: 9px;
	vertical-align: 1px;
	background: no-repeat center / 10px 6px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%231A1A1A' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	position: static;
	border: 0;
	transform: none;
	opacity: 1;
}
/* Dropdowns */
#header-outer .sf-menu li ul {
	background-color: var(--wm-white);
	border-radius: 0;
}
#header-outer .sf-menu li ul li a {
	font-family: var(--wm-font);
	font-size: 15px;
	font-weight: 400;
	color: var(--wm-text);
	text-transform: none;
	letter-spacing: 0;
}
#header-outer .sf-menu li ul li a:hover,
#header-outer .sf-menu li ul li.current-menu-item > a {
	color: var(--wm-accent);
	background-color: var(--wm-stone);
}

/* "Free Appraisal" menu item (css class wm-menu-cta on the nav item) */
#header-outer #top .sf-menu > li.wm-menu-cta {
	display: flex;
	align-items: center;
	margin-left: 18px;
}
#header-outer #top .sf-menu > li.wm-menu-cta > a,
body #header-outer #top nav > ul > li.wm-menu-cta > a {
	display: inline-block;
	padding: 10px 25px !important;
	margin: 0 !important;
	line-height: 24px !important;
	border: 2px solid var(--wm-accent);
	border-radius: var(--wm-radius-pill);
	background: var(--wm-accent);
	color: var(--wm-white) !important;
	transition: background-color .2s ease, color .2s ease;
}
#header-outer #top .sf-menu > li.wm-menu-cta > a:hover {
	background: transparent;
	color: var(--wm-accent) !important;
}
#header-outer #top .sf-menu > li.wm-menu-cta > a:after,
#header-outer #top .sf-menu > li.wm-menu-cta > a .menu-title-text:after { display: none !important; }


/* Off-canvas menu */
#slide-out-widget-area .off-canvas-menu-container li a,
#slide-out-widget-area .inner .off-canvas-menu-container li a {
	font-family: var(--wm-font);
	font-weight: 500;
	color: var(--wm-text);
}
#slide-out-widget-area .off-canvas-menu-container li a:hover { color: var(--wm-accent); }
#slide-out-widget-area .off-canvas-menu-container li.wm-menu-cta > a { color: var(--wm-accent); }

/* ==========================================================================
   Footer (custom markup in includes/partials/footer/wm-footer.php)
   ========================================================================== */
#footer-outer { background-color: var(--wm-text) !important; color: var(--wm-stone); }
#footer-outer .wm-footer {
	background: var(--wm-text);
	color: var(--wm-stone);
	font-family: var(--wm-font);
	font-size: 16px;
	line-height: 1.5;
}
.wm-footer__inner {
	max-width: var(--wm-content-width);
	margin: 0 auto;
	padding: 0 15px;
}
.wm-footer__top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 40px;
	padding: 60px 0 80px;
}
.wm-footer__logo img { display: block; width: 246px; height: auto; }
.wm-footer__right { display: flex; align-items: flex-start; gap: 40px; }
.wm-footer__agents { display: flex; gap: 4px; }
.wm-footer__agent {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 12px;
	min-width: 214px;
}
.wm-footer__agent span,
.wm-footer__agent a { color: var(--wm-stone) !important; font-size: 16px; line-height: 32px; }
.wm-footer__agent a:hover { color: var(--wm-white) !important; text-decoration: underline; }
.wm-footer__social { display: flex; gap: 22px; padding-top: 6px; }
.wm-footer__social a { color: var(--wm-stone) !important; display: inline-flex; }
.wm-footer__social a:hover { color: var(--wm-white) !important; }
.wm-footer__social svg { width: 22px; height: 22px; fill: currentColor; display: block; }
.wm-footer__divider { border: 0; border-top: 1px solid var(--wm-moss); margin: 0; height: 0; }
.wm-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 38px 0 22px;
	font-size: 16px;
}
.wm-footer__legal { margin: 0; color: var(--wm-stone); padding: 0; }
.wm-footer__legal a { color: var(--wm-stone) !important; }
.wm-footer__legal a:hover { color: var(--wm-white) !important; text-decoration: underline; }
.wm-footer__sep { display: inline-block; margin: 0 8px; }
.wm-footer__credit { margin: 0; padding: 0; font-size: 13px; color: var(--wm-stone); opacity: .8; }
.wm-footer__credit a { color: var(--wm-stone) !important; }
.wm-footer__credit a:hover { color: var(--wm-white) !important; }

@media (max-width: 1024px) {
	.wm-footer__top { flex-direction: column; align-items: center; text-align: center; padding: 60px 0; }
	.wm-footer__right { flex-direction: column; align-items: center; gap: 24px; }
	.wm-footer__agents { flex-direction: column; gap: 24px; }
	.wm-footer__social { justify-content: center; padding-top: 24px; }
	.wm-footer__bottom { flex-direction: column; text-align: center; padding: 45px 0 28px; }
}
@media (max-width: 767px) {
	.wm-footer__inner { padding: 0 15px; }
	.wm-footer__logo img { width: 246px; }
	.wm-footer__legal .wm-footer__copy { display: block; }
	.wm-footer__legal .wm-footer__sep--first { display: none; }
}

/* Salient's own footer bits we do not use */
#footer-outer #footer-widgets,
#footer-outer #copyright { display: none !important; }

/* Salient sets the off-canvas menu font with higher specificity. */
body #slide-out-widget-area .inner .off-canvas-menu-container li a,
body #slide-out-widget-area .off-canvas-menu-container li a,
body #slide-out-widget-area-bg + #slide-out-widget-area li a { font-family: var(--wm-font) !important; }
