/*
 Theme Name:   Xavier Guillaumin
 Theme URI:    https://xavierguillaumin.com/
 Description:  Guillaumin - Twenty Twenty-One Child Theme
 Author:       SophieWeb
 Author URI:   https://sophieweb.com
 Template:     twentytwentyone
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, blog, portfolio
 Text Domain:  twentytwentyonechild
*/

@font-face {
	font-family: 'Open Sans';
	src: url('assets/fonts/OpenSans.woff2') format('woff2');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Open Sans';
	src: url('assets/fonts/OpenSansItalic.woff2') format('woff2');
	font-weight: normal;
	font-style: italic;
}

:root {
	--button--font-family: var(--xg-font-base) !important;

	--xg-font-base: 'Open Sans';

	--entry-header--font-size: 1.25rem !important;

	--error-color: #c7005e;

	--footer--color-link: var(--wp--preset--color--xg-white) !important;
	--footer--color-text: var(--wp--preset--color--xg-white) !important;
	--footer--font-size: .875rem !important;
	--footer--font-size-small: .75rem !important;

	--font-headings: var(--xg-font-base);
	--font-base: var(--xg-font-base);

	--form--border-width: 1px !important;

	--global--font-size-base: .875rem !important;
	--global--color-primary: var(--wp--preset--color--xg-mid-grey) !important;
	--global--color-primary-hover: var(--wp--preset--color--xg-light-grey) !important;

	--footer--font-family: var(--xg-font-base) !important;

	--heading--font-size-h2: 1.25rem !important;

	--latest-posts--title-font-family: var(--xg-font-base) !important;

	--primary-nav--font-family: var(--xg-font-base) !important;
	--primary-nav--font-family-mobile: var(--xg-font-base) !important;
	--primary-nav--font-size: .875rem !important;
	--primary-nav--font-size-sub-menu: .875rem !important;
	--primary-nav--font-weight: 100 !important;

	--responsive--aligndefault-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 1024px) !important;
	--responsive--alignsmall-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 610px) !important;

	--separator--border-color: var(--wp--preset--color--xg-very-light-grey) !important;
}

body .site {
	background-color: var(--wp--preset--color--xg-white);
	font-weight: 100;
	font-variation-settings: "wght" 100;
}

.site .site-header {
	background: var(--wp--preset--color--xg-white-light-trans);
	border-bottom: 1px solid var(--wp--preset--color--xg-very-light-grey);
	box-shadow: 0 0 4px var(--wp--preset--color--xg-very-light-grey);
	flex-direction: column;
	gap: 0;
	margin: 0;
	max-width: 100vw;
	padding: 0 3vw;
	position: sticky;
	top: 0;
	transition: all .5s ease-out;
	width: 100vw;
	z-index: 20;
}

body.admin-bar .site .site-header {
	top: var(--global--admin-bar--height);
}

.site .site-header .site-logo {
	margin: 1rem 0;
	transition: margin .5s ease-out;
}

body.with_scroll .site .site-header .site-logo {
	margin: 0;
}

.site .site-header .custom-logo-link {
	display: block;
}

.site .site-header .custom-logo {
	align-self: center;
	height: auto;
	max-height: unset;
	max-width: unset;
	transition: all .5s ease-out;
	width: 200px;
}

body.with_scroll .site .site-header .custom-logo {
	width: 64px;
}

.site .site-header .primary-navigation {
	margin: 0 auto;
	text-transform: uppercase;
}

.site .site-header .primary-navigation a:link {
	color: var(--wp--preset--color--xg-mid-grey);
}

.site .site-header .primary-navigation a:hover,
.site .site-header .primary-navigation a:visited {
	color: var(--global--color-primary-hover);
}

.site .primary-navigation .current-menu-item > a:first-child, 
.site .primary-navigation .current_page_item > a:first-child {
	font-weight: 500;
	font-variation-settings: "wght" 500;
	text-decoration: none;
}

.has-background-white .site .primary-navigation a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
	background: var(--wp--preset--color--xg-light-grey);
}

.singular .site .entry-header,
.site .page-header {
	display: none;
}

.site .entry-title {
	text-transform: uppercase;
}

.site .entry-title a:link,
.site .entry-title a:visited {
	text-decoration: none;
}

.site .site-main > article {
	margin: 0 auto;
	max-width: var(--responsive--alignsmall-width);
	padding-top: calc(2 * var(--global--spacing-vertical));
	position: relative;
}

.page .site .site-main > article {
	max-width: var(--responsive--aligndefault-width);
}

.site .site-main > article > .entry-footer {
	padding-bottom: var(--global--spacing-vertical);
}

.site .site-main > article > .entry-footer .posted-on {
	margin-top: -.25rem;
	position: absolute;
}

.site .site-main > article > .entry-footer .posted-on time {
	display: block;
	line-height: 1;
}

.site .site-main > article > .entry-footer .posted-on time strong {
	color: var(--wp--preset--color--xg-black);
	display: block;
	font-size: 4rem;
	font-weight: 700;
	font-variation-settings: "wght" 700;
	letter-spacing: -.125rem;
	text-align: center;
	width: 100%;
}

.site .site-main > article > .entry-footer .posted-on time span {
	display: block;
	font-size: .75rem;
	letter-spacing: -.05rem;
	text-align: center;
	text-transform: uppercase;
	width: 100%;
}

.site .entry-content .wp-block-heading {
	padding-top: 1rem;
	text-transform: uppercase;
}

.site .entry-content .wp-block-heading:not(:first-child) {
	border-top: var(--separator--height) solid var(--separator--border-color);
}

.site hr.wp-block-separator {
	border-width: 0 0 var(--separator--height);
}

.site .entry-footer .post-taxonomies {
	display: none;
}

.site .site-footer {
	background: var(--wp--preset--color--xg-light-grey);
	color: var(--wp--preset--color--xg-white);
	font-size: var();
	margin: 0;
	padding: 0;
	max-width: 100vw;
	width: 100vw;
}

.site .site-footer .site-info {
	border-top: unset;
	flex-direction: column;
	margin: 0;
	padding: 1rem;
}

.site .site-footer .site-info .custom-logo {
	width: 64px;
}

.site .site-footer .site-info .site-name {
	margin: 0;
}

.site .site-footer .site-info .top-button {
	align-items: center;
	border: 1px solid var(--wp--preset--color--xg-white-mid-trans);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	height: 2rem;
	margin: .5rem 0;
	text-decoration: none;
	width: 2rem;
}

.site .site-footer .site-info .top-button svg {
	fill: var(--wp--preset--color--xg-white-mid-trans);
	height: 1rem;
	width: 1rem;
}

.site .site-footer .site-info .top-button:hover,
.site .site-footer .site-info .top-button:focus,
.site .site-footer .site-info .top-button:active {
	border-color: var(--wp--preset--color--xg-white);
}

.site .site-footer .site-info .top-button:hover svg,
.site .site-footer .site-info .top-button:focus svg,
.site .site-footer .site-info .top-button:active svg {
	fill: var(--wp--preset--color--xg-white);
}

.site .site-footer .site-info .attribution {
	display: flex;
	font-size: var(--footer--font-size-small);
	gap: 2rem;
	padding: 2rem 0 0;
}

@media only screen and (max-width: 481.98px) {
	.site .site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo {
		margin: 0;
		padding: 0;
		position: static;
	}

	.site .site-header.has-logo:not(.has-title-and-tagline).has-menu .custom-logo {
		max-height: unset;
		width: 128px;
	}

	.site .site-main > article {
		padding-top: calc(3 * var(--global--spacing-vertical));
	}

	.site .site-main > article > .entry-footer .posted-on {
		top: .375rem;
	}
}

@media only screen and (min-width: 481.98px) {
	.site .site-main > article > .entry-footer .posted-on {
		top: calc(2 * var(--global--spacing-vertical));
	}

	.site .site-main > article > .entry-footer .posted-on time {
		margin-left: -6.25rem;
		width: 5.5rem;
	}
}