/*
 * Segnacarte site layer on top of Hello Elementor: the self-hosted fonts of the Elementor kit
 * and the look the site had with GeneratePress (colours, type, header bar, footer, blog, posts).
 */

/* 1. Self-hosted Roboto and Roboto Slab (variable, latin + latin-ext), used by the Elementor kit. */

@font-face {
	font-family: 'Roboto';
	font-style: italic;
	font-weight: 100 900;
	font-stretch: 100%;
	font-display: swap;
	src: url(/wp-content/uploads/fonts/roboto-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Roboto';
	font-style: italic;
	font-weight: 100 900;
	font-stretch: 100%;
	font-display: swap;
	src: url(/wp-content/uploads/fonts/roboto-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;
}

@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 100 900;
	font-stretch: 100%;
	font-display: swap;
	src: url(/wp-content/uploads/fonts/roboto-normal-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 100 900;
	font-stretch: 100%;
	font-display: swap;
	src: url(/wp-content/uploads/fonts/roboto-normal-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: 'Roboto Slab';
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url(/wp-content/uploads/fonts/roboto-slab-normal-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Roboto Slab';
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url(/wp-content/uploads/fonts/roboto-slab-normal-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;
}

/* 2. Base look */

:root {
	--sc-text: #3a3a3a;
	--sc-page: #efefef;
	--sc-link: #914f0e;
	--sc-link-hover: #000;
	--sc-meta: #595959;
	--sc-nav: #595959;
	--sc-nav-active: #424242;
	--sc-nav-text: #fff;
	--sc-footer-text: #fff;
	--sc-font: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	--sc-frame: 40px;
}

body {
	background-color: var(--sc-page);
	color: var(--sc-text);
	font-family: var(--sc-font);
	font-size: 17px;
	line-height: 1.5;
}

a {
	color: var(--sc-link);
	text-decoration: none;
}

a:hover,
a:focus,
a:active {
	color: var(--sc-link-hover);
}

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 20px;
	font-weight: 400;
	line-height: 1.2;
}

h1 {
	font-size: 40px;
	font-weight: 300;
}

h2 {
	font-size: 30px;
	font-weight: 300;
}

h3 {
	font-size: 20px;
}

h4, h5, h6 {
	font-size: inherit;
}

p {
	margin: 0 0 1.5em;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	padding: 10px 20px;
	border: 0;
	border-radius: 3px;
	background-color: #666;
	color: #fff;
	font: inherit;
	cursor: pointer;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	background-color: #3f3f3f;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="search"],
textarea {
	padding: 10px 15px;
	border: 1px solid #ccc;
	border-radius: 0;
	background-color: #fafafa;
	color: #666;
	font: inherit;
}

/* 3. Header: white band with the centred logo, dark menu bar below it */

.site-header.dynamic-header {
	padding: var(--sc-frame) var(--sc-frame) 0;
}

.site-header .header-inner {
	width: 100%;
	max-width: none;
	padding: 0;
}

.site-header.header-stacked .site-branding {
	align-items: center;
}

.site-header .site-branding .site-logo img {
	width: 800px;
	max-width: 100%;
	height: auto;
}

.site-header .site-navigation,
.site-header .site-navigation-toggle-holder {
	position: relative;
	left: 50%;
	width: 100vw;
	max-width: none;
	margin-top: var(--sc-frame);
	transform: translateX(-50%);
	background-color: var(--sc-nav);
}

.site-header .site-navigation {
	justify-content: center;
}

.site-header .site-navigation ul.menu {
	justify-content: center;
	margin: 0;
}

.site-header .site-navigation ul.menu > li > a {
	padding: 0 20px;
	color: var(--sc-nav-text);
	font-size: 15px;
	line-height: 60px;
}

.site-header .site-navigation ul.menu li a:hover,
.site-header .site-navigation ul.menu li a:focus,
.site-header .site-navigation ul.menu > li.current-menu-item > a,
.site-header .site-navigation ul.menu > li.current_page_item > a,
.site-header .site-navigation ul.menu > li.current-menu-ancestor > a {
	background-color: var(--sc-nav-active);
	color: var(--sc-nav-text);
}

.site-header .site-navigation ul.menu li.menu-item-has-children {
	padding-inline-end: 10px;
}

.site-header .site-navigation ul.menu li.menu-item-has-children:after {
	color: var(--sc-nav-text);
}

.site-header .site-navigation ul.menu li ul {
	min-width: 180px;
	background-color: var(--sc-nav-active);
}

.site-header .site-navigation ul.menu li ul li {
	border-bottom: 0;
}

.site-header .site-navigation ul.menu li ul a {
	padding: 10px 20px;
	color: var(--sc-nav-text);
	font-size: 14px;
}

.site-header .site-navigation ul.menu li ul a:hover,
.site-header .site-navigation ul.menu li ul a:focus {
	color: #dbdbdb;
}

/* Phone and tablet: the "Menu" toggle on the same dark bar, the menu opening below it */

.site-header .site-navigation-toggle-holder {
	justify-content: flex-start;
	padding: 0 var(--sc-frame);
}

.site-header .site-navigation-toggle-holder .site-navigation-toggle {
	padding: 0;
	border-radius: 0;
	background: none;
	color: var(--sc-nav-text);
	font-size: 15px;
	line-height: 60px;
}

.site-header .site-navigation-toggle-holder .site-navigation-toggle::after {
	content: "Menu";
	margin-left: 10px;
}

/* The open menu sits under the bar and pushes the page down (no animated overlay). */
.site-header .site-navigation-dropdown {
	display: none;
	position: relative;
	left: 50%;
	width: 100vw;
	max-width: none;
	max-height: none;
	margin: 0;
	transform: translateX(-50%);
	transition: none;
	background-color: var(--sc-nav-active);
}

.site-header .site-navigation-toggle-holder.elementor-active + .site-navigation-dropdown {
	display: block;
	max-height: none;
	transform: translateX(-50%);
}

.site-header .site-navigation-dropdown ul.menu {
	position: static;
	background: transparent;
}

.site-header .site-navigation-dropdown ul.menu li a {
	background: transparent;
	box-shadow: none;
}

.site-header .site-navigation-dropdown ul.menu li.current-menu-item > a {
	background-color: var(--sc-nav);
}

.site-header .site-navigation-dropdown ul.menu li {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.site-header .site-navigation-dropdown ul.menu li a {
	padding: 12px var(--sc-frame);
	color: var(--sc-nav-text);
	font-size: 15px;
}

.site-header .site-navigation-dropdown ul.menu li ul {
	position: static;
	background-color: #333;
}

.site-header .site-navigation-dropdown ul.menu li ul a {
	padding-left: calc(var(--sc-frame) + 20px);
	color: var(--sc-nav-text);
}

/* 4. Content frame: every page keeps the frame the site always had around its content */

.site-main {
	padding: var(--sc-frame);
}

body:not([class*="elementor-page-"]) .site-main {
	max-width: none;
}

body[class*="elementor-page-"] .site-main {
	padding-top: calc(var(--sc-frame) + 34px);
}

.page-header .entry-title {
	margin-bottom: 20px;
}

/* 5. Footer: one dark band with the copyright line */

.site-footer.dynamic-footer {
	padding: 30px var(--sc-frame);
	color: var(--sc-footer-text);
	font-size: 15px;
}

.site-footer .copyright p {
	margin: 0;
}

.site-footer a {
	color: var(--sc-footer-text);
}

.site-footer a:hover,
.site-footer a:focus {
	color: #dbdbdb;
}

.sc-credit {
	display: inline-block;
	margin-left: 6px;
	vertical-align: middle;
}

.sc-credit img {
	display: block;
	width: auto;
	height: 28px;
}

/* 6. Blog grid and archives */

.sc-blog__filters {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px 30px;
	margin: 0 0 40px;
}

.sc-blog__filters a {
	color: var(--sc-text);
}

.sc-blog__filters a:hover,
.sc-blog__filters a.is-active {
	color: var(--sc-link);
}

.sc-blog__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 40px 30px;
	margin-bottom: 40px;
}

.sc-post-card__image img {
	display: block;
	width: 100%;
	height: auto;
	margin-bottom: 15px;
}

.sc-post-card__title {
	margin: 0 0 10px;
	font-size: 20px;
	font-weight: 400;
}

.sc-post-card__title a {
	color: var(--sc-text);
}

.sc-post-card__title a:hover {
	color: var(--sc-link);
}

.sc-post-card__excerpt p {
	margin: 0 0 20px;
}

.sc-post-card__meta {
	color: var(--sc-text);
}

.sc-post-card__meta a {
	color: var(--sc-text);
}

.sc-post-card__meta a:hover {
	color: var(--sc-link);
}

.sc-post-card__divider {
	margin: 0 4px;
}

.sc-blog .pagination {
	display: flex;
	justify-content: center;
}

.sc-blog .pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.sc-blog .pagination .page-numbers {
	display: inline-block;
	padding: 6px 12px;
	border-radius: 3px;
	background-color: #fff;
	color: var(--sc-text);
}

.sc-blog .pagination .page-numbers.current,
.sc-blog .pagination .page-numbers:hover {
	background-color: var(--sc-nav);
	color: #fff;
}

/* 7. Single post */

.sc-single .entry-header {
	margin-bottom: 30px;
}

.sc-single .entry-header .entry-title {
	margin-bottom: 10px;
}

.sc-single .entry-meta {
	color: var(--sc-meta);
	font-size: 0.85em;
}

.sc-single .entry-meta a {
	color: var(--sc-meta);
}

.sc-single .entry-meta a:hover {
	color: var(--sc-link);
}

.sc-single__image {
	margin-bottom: 30px;
}

.sc-single__image img {
	max-width: 100%;
	height: auto;
}

.sc-single .entry-content img {
	max-width: 100%;
	height: auto;
}

.sc-single .entry-footer {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: 40px;
}

.sc-single__label {
	display: block;
	font-weight: 600;
}

.sc-single .post-navigation {
	margin: 40px 0;
}

.sc-single .post-navigation .nav-links {
	display: flex;
	justify-content: space-between;
	gap: 20px;
}

.sc-single .post-navigation .nav-next {
	text-align: right;
}

.sc-nav__label {
	display: block;
	color: var(--sc-meta);
	font-size: 0.85em;
}

/* 8. Phones */

@media (max-width: 768px) {
	:root {
		--sc-frame: 30px;
	}

	h1 {
		font-size: 30px;
	}

	h2 {
		font-size: 25px;
	}

	.site-header.dynamic-header {
		padding: 40px 40px 0;
	}
}

@media (max-width: 1024px) {
	.sc-blog__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.sc-blog__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.sc-single .post-navigation .nav-links {
		flex-direction: column;
	}

	.sc-single .post-navigation .nav-next {
		text-align: left;
	}
}