/*
Theme Name: Restly Talis
Theme URI: https://talissolutions.co.uk/
Description: Talis typography and colour customisation for the Restly theme.
Author: Talis Solutions
Template: restly
Version: 1.3.1
Text Domain: restly-talis
*/

:root {
	--talis-ink: #111111;
	--talis-copy: #444444;
	--talis-muted: #999999;
	--talis-border: #e8e6e2;
	--talis-surface: #f8f7f5;
	--talis-white: #ffffff;
}

body,
button,
input,
select,
optgroup,
textarea,
.elementor-widget-text-editor,
.main-menu,
.tp-mobile-menu {
	font-family: "Inter", sans-serif;
	color: var(--talis-copy);
}

h1,
h2,
h3,
h4,
h5,
h6,
.elementor-heading-title,
.site-title,
.page-title,
.blog-title,
.widget-title {
	font-family: "Fraunces", serif;
	color: var(--talis-ink);
}

body,
.site,
.site-content,
.elementor-section-wrap,
.elementor-location-single {
	background-color: var(--talis-white);
}

a {
	color: var(--talis-ink);
}

a:hover,
a:focus,
.main-menu a:hover,
.main-menu .current-menu-item > a,
.tp-mobile-menu ul li.tp-active > a,
.entry-title a:hover {
	color: var(--talis-copy);
}

.site-header,
.site-header .main-header,
.site-header .menu-area,
.site-header .navbar,
.sticky-wrapper .menu-area,
.sticky-wrapper.sticky .menu-area,
.restly-header-builder,
.restly-header-builder .main-header,
.restly-header-builder .menu-area {
	background-color: var(--talis-ink) !important;
}

.main-menu a,
.main-navigation a,
.tp-mobile-menu ul li a,
.site-header,
.site-header a,
.menu-expand {
	font-family: "Fraunces", serif;
	color: var(--talis-white);
}

.main-menu > ul > li > a,
.main-navigation > ul > li > a,
.site-header .menu-expand,
.site-header .icon-btn {
	color: var(--talis-white) !important;
}

.main-menu ul.sub-menu,
.tp-menu-wrapper .tp-menu-area,
.widget,
.blog-post-item,
.comments-area,
.woocommerce div.product,
.woocommerce-page div.product {
	background-color: var(--talis-white);
}

.main-menu ul.sub-menu {
	background-color: var(--talis-ink);
}

.main-menu ul.sub-menu li {
	border-color: var(--talis-copy);
}

.main-menu ul.sub-menu li a {
	color: var(--talis-white);
}

.main-menu a:hover,
.main-menu .current-menu-item > a,
.main-menu ul.sub-menu li a:hover,
.main-navigation a:hover,
.main-navigation .current-menu-item > a {
	color: var(--talis-muted) !important;
}

.tp-menu-wrapper .tp-menu-area {
	background-color: var(--talis-ink);
}

.tp-mobile-menu ul li,
.tp-mobile-menu ul li a {
	border-color: var(--talis-copy);
}

.tp-mobile-menu ul li a,
.tp-menu-wrapper .tp-menu-toggle {
	font-family: "Fraunces", serif;
	color: var(--talis-white);
}

.Restly-home-banner-content,
.Restly-home-banner-content h1,
.restly-home-banner-content,
.restly-home-banner-content h1 {
	font-family: "Fraunces", serif;
}

.Restly-home-banner-content h1,
.restly-home-banner-content h1 {
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	margin: 0;
}

.restly-home-banner-contents {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	max-width: 760px;
}

.restly-home-banner-contents > .restly-banner-stitle {
	order: 0;
}

.restly-home-banner-contents > h1,
.restly-home-banner-contents > span {
	order: 1;
	font-family: "Fraunces", serif;
	font-size: clamp(3rem, 5vw, 4.25rem);
	font-weight: 300;
	line-height: 1;
	color: var(--talis-white);
}

.restly-home-banner-contents > h1 {
	margin: 0;
}

.restly-home-banner-contents > span {
	display: block;
}

.restly-home-banner-contents > br {
	display: none;
}

.restly-home-banner-contents > .talis-trust-banner-wrap {
	order: 2;
	width: 100%;
	margin-top: 36px;
}

.talis-trust-banner-wrap__title .restly-banner-title:empty {
	display: none;
}

.talis-trust-banner-wrap__actions {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 18px;
	width: 100%;
}

.restly-home-banner-btn.talis-banner-actions {
	display: flex;
	align-items: stretch;
	flex-wrap: wrap;
	gap: 12px;
	width: 100%;
}

.restly-home-banner-contents .restly-home-banner-btn a.theme-btns {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	min-height: 68px;
	width: min(100%, 440px);
	padding: 14px 20px !important;
	border: 1px solid var(--talis-white) !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	font-family: "Inter", sans-serif !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.25 !important;
	letter-spacing: 0.04em;
	color: var(--talis-white) !important;
}

.restly-home-banner-contents .restly-home-banner-btn a.theme-btns:hover,
.restly-home-banner-contents .restly-home-banner-btn a.theme-btns:focus {
	background: var(--talis-white) !important;
	color: var(--talis-ink) !important;
}

.restly-home-banner-contents .qlwapp__button {
	display: flex !important;
	align-items: center;
	justify-content: center;
	min-height: 68px;
	width: min(100%, 440px);
	padding: 14px 20px !important;
	border: 1px solid #25d366 !important;
	border-radius: 0 !important;
	background: #25d366 !important;
	box-shadow: none !important;
	font-family: "Inter", sans-serif !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.25 !important;
	letter-spacing: 0.04em;
	color: var(--talis-white) !important;
}

.restly-home-banner-contents .qlwapp__button:hover,
.restly-home-banner-contents .qlwapp__button:focus {
	border-color: #1fbd5b !important;
	background: #1fbd5b !important;
	color: var(--talis-white) !important;
}

.restly-home-banner-contents .qlwapp__button .qlwapp__icon,
.restly-home-banner-contents .qlwapp__button i,
.restly-home-banner-contents .qlwapp__button svg {
	display: inline-flex !important;
	color: var(--talis-white) !important;
	fill: currentColor;
}

.talis-trust-inline-badges {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 18px;
	width: 100%;
}

@media (max-width: 767px) {
	.restly-home-banner-contents > h1,
	.restly-home-banner-contents > span {
		font-size: clamp(2.75rem, 11vw, 3.5rem);
	}

	.restly-home-banner-contents > .talis-trust-banner-wrap {
		margin-top: 32px;
	}

	.talis-trust-banner-wrap__actions,
	.restly-home-banner-btn.talis-banner-actions {
		align-items: stretch;
		flex-direction: column;
		width: 100%;
	}

	.restly-home-banner-contents .restly-home-banner-btn a.theme-btns,
	.restly-home-banner-contents .qlwapp__button {
		width: 100%;
	}

	.talis-trust-inline-badges {
		justify-content: flex-start;
		width: 100%;
	}
}

.header-top,
.section-bg,
.gray-bg,
.grey-bg,
.bg-gray,
.bg-grey,
.breadcrumb-area,
.page-header,
.cta-area,
.elementor-section.elementor-element.bg-light {
	background-color: var(--talis-surface);
}

.site-footer,
.footer-area,
.footer-widget-area,
.copyright-area,
.header-top,
.header-two .main-header,
.header-three .main-header {
	background-color: var(--talis-ink);
}

.site-footer,
.site-footer p,
.site-footer a,
.footer-area,
.footer-area p,
.footer-area a,
.footer-widget-area,
.footer-widget-area p,
.footer-widget-area a,
.copyright-area,
.copyright-area p,
.copyright-area a,
.header-top,
.header-top p,
.header-top a {
	color: var(--talis-white);
}

.site-footer a:hover,
.footer-area a:hover,
.footer-widget-area a:hover,
.copyright-area a:hover,
.header-top a:hover {
	color: var(--talis-muted);
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.theme-btn,
.restly-btn,
.button,
.elementor-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.header-button a {
	font-family: "Inter", sans-serif;
	background-color: var(--talis-ink);
	border-color: var(--talis-ink);
	color: var(--talis-white);
}

button:hover,
button:focus,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.theme-btn:hover,
.restly-btn:hover,
.button:hover,
.elementor-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.header-button a:hover {
	background-color: var(--talis-copy);
	border-color: var(--talis-copy);
	color: var(--talis-white);
}

input,
select,
textarea,
.main-menu ul.sub-menu,
.tp-mobile-menu ul li,
.widget,
.blog-post-item,
.comments-area,
table,
th,
td,
hr {
	border-color: var(--talis-border);
}

body[class*="elementor-kit-"],
body {
	--e-global-color-primary: var(--talis-ink);
	--e-global-color-secondary: var(--talis-copy);
	--e-global-color-text: var(--talis-copy);
	--e-global-color-accent: var(--talis-ink);
	--e-global-typography-primary-font-family: "Fraunces";
	--e-global-typography-secondary-font-family: "Inter";
	--e-global-typography-text-font-family: "Inter";
	--e-global-typography-accent-font-family: "Inter";
}
