/*!
Theme Name:     Madi Mori Theme
Theme URI:      https://madimori.ca
Description:    Jvb-theme child theme, for Tatty Soap.
Author:         Jake
Author URI:     https://jakevan.ca/
Template:       jvb-theme
Version:        0.3.06
!*/
:root{
	--background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32"><path id="a" fill="none" stroke="%23000" stroke-width=".014" d="M15.822 16.06c-.021 0-.083-.034-.06-.09.004-.01.023-.033.024-.037.004-.01-.009-.052.024-.08.02-.016.065-.014.08-.003-.007-.02.007-.089.066-.084.017.001.038.014.05.01 0 0 .07-.035.098.026a.1.1 0 0 1 .008.032l-.002.016.016-.006c.015-.005.073-.01.085.044.003.012.001.04.003.045.003.01.038.036.027.078-.006.025-.044.05-.063.05.018.011.048.075-.004.107-.014.009-.039.011-.046.02 0 0-.036.07-.094.038a.1.1 0 0 1-.025-.022L16 16.19l-.008.014c-.01.013-.054.05-.096.016-.01-.009-.025-.033-.028-.036-.008-.006-.052-.007-.068-.047-.01-.024.006-.066.022-.077" clip-rule="evenodd"/><use xlink:href="%23a" transform="rotate(-39.276 -10.607 80.402)scale(2.98742)"/><use xlink:href="%23a" transform="rotate(-44.805 -37.563 118.023)scale(5.389)"/><use xlink:href="%23a" transform="rotate(218.887 50.994 84.718)scale(7.37672)"/><use xlink:href="%23a" transform="rotate(62.282 117.36 -13.588)scale(5.79528)"/><use xlink:href="%23a" transform="rotate(238.34 48.999 120.72)scale(8.92312)"/><use xlink:href="%23a" transform="rotate(-31.775 -43.1 147.008)scale(4.302)"/><use xlink:href="%23a" transform="rotate(134.177 36.716 20.345)scale(2.78662)"/><use xlink:href="%23a" transform="rotate(225.09 44.205 71.743)scale(6.01982)"/><use xlink:href="%23a" transform="rotate(121.022 50.094 29.998)scale(3.655)"/><use xlink:href="%23a" transform="rotate(-42.154 -.603 72.59)scale(2.49675)"/><use xlink:href="%23a" transform="rotate(5.681 862.543 -904.797)scale(6.21292)"/><use xlink:href="%23a" transform="rotate(-10.91 -189.46 426.469)scale(4.60314)"/><use xlink:href="%23a" transform="rotate(-26.868 -253.855 417.234)scale(10.59674)"/><use xlink:href="%23a" transform="rotate(-50.122 14.878 36.655)scale(1.79712)"/><use xlink:href="%23a" transform="rotate(-75.299 .522 46.75)scale(2.69331)"/><use xlink:href="%23a" transform="rotate(53.285 27.111 17.872)scale(1.1517)"/><use xlink:href="%23a" transform="rotate(254.654 31.68 165.897)scale(10.98135)"/><use xlink:href="%23a" transform="rotate(212.906 38.692 44.239)scale(3.96058)"/><use xlink:href="%23a" transform="rotate(-96.544 17.81 43.099)scale(3.2742)"/><use xlink:href="%23a" transform="rotate(-88.844 23.031 68.996)scale(4.3728)"/><use xlink:href="%23a" transform="rotate(-70.931 13.948 33.09)scale(2.28257)"/><use xlink:href="%23a" transform="rotate(-4.913 -447.208 618.813)scale(3.99985)"/><use xlink:href="%23a" transform="rotate(31.604 86.295 -7.457)scale(2.24754)"/><use xlink:href="%23a" transform="rotate(47.702 37.284 -2.691)scale(1.83035)"/><use xlink:href="%23a" transform="rotate(4.733 789.311 -703.802)scale(5.42008)"/><use xlink:href="%23a" transform="rotate(71.06 112.935 -13.855)scale(6.09888)"/><use xlink:href="%23a" transform="rotate(88.668 89.128 13.941)scale(5.28266)"/><use xlink:href="%23a" transform="rotate(-57.362 10.02 68.658)scale(3.2221)"/><use xlink:href="%23a" transform="rotate(226.012 30.028 50.952)scale(4.6482)"/><use xlink:href="%23a" transform="rotate(118.857 122.41 39.803)scale(9.78019)"/><use xlink:href="%23a" transform="rotate(119.17 60.286 21.488)scale(4.66228)"/><use xlink:href="%23a" transform="rotate(200.967 51.27 77.533)scale(6.88209)"/><use xlink:href="%23a" transform="rotate(42.92 142.71 -17.984)scale(5.3006)"/><use xlink:href="%23a" transform="rotate(-99.572 24.045 17.834)scale(1.30925)"/><use xlink:href="%23a" transform="rotate(220.884 71.004 121.013)scale(10.19418)"/><use xlink:href="%23a" transform="rotate(-48.299 -31.788 171.312)scale(7.43685)"/><use xlink:href="%23a" transform="rotate(-1.027 -1772.216 2374.039)scale(3.1542)"/><use xlink:href="%23a" transform="rotate(2.29 44.297 -136.78)scale(1.91142)"/><use xlink:href="%23a" transform="rotate(51.988 151.469 -32.38)scale(7.12958)"/><use xlink:href="%23a" transform="rotate(-46.275 25.314 5.938)scale(.69533)"/><use xlink:href="%23a" transform="rotate(-52.63 -32.143 148.992)scale(7.16946)"/><use xlink:href="%23a" transform="rotate(110.103 144.559 34.06)scale(9.79811)"/><use xlink:href="%23a" transform="rotate(200.002 41.207 36.631)scale(3.87382)"/><use xlink:href="%23a" transform="rotate(65.758 91.222 -2.921)scale(5.44265)"/><use xlink:href="%23a" transform="rotate(116.933 115.074 29.597)scale(8.84467)"/><use xlink:href="%23a" transform="rotate(242.866 29.314 73.544)scale(5.87325)"/></svg>');
	--filter: grayscale(.3) sepia(.4);

	/** Download your Fonts from: https://gwfh.mranftl.com/ **/
	--font-base: -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
	--heading: 'Noto Serif Hentaigana', var(--font-base);
	--body: 'Playfair Display', var(--font-base);
	--fw-h: 400;
	--fw-h-light: 200;
	--fw-h-bold: 900;
	--fw-b: 400;
	--fw-b-bold: 900;
	--fw-b-light: 400;

	/* Colours
	For best results, generate colours from base colours using: https://uicolors.app/generate/
	or sass darken/lighten by 5%: http://scg.ar-ch.org/
	*/
	--light-0: 252,251,251;		/* #fcfbfb; */
	--light-50: 241,236,236;	/* #f1ecec; */
	--light-100: 230,222,222;	/* #e6dede; */
	--light-200: 219,207,207;	/* #dbcfcf; */

	--dark-0: 26,19,18;			/* #1a1312; */
	--dark-50: 41,30,28;		/* #291e1c; */
	--dark-100: 56,41,39;		/* #382927; */
	--dark-200: 71,52,49;		/* #473431; */

	--action-0: 173,91,75;		/* #AD5B4B; */
	--action-50: 183,105,90;	/* #b7695a; */
	--action-100: 191,121,108;	/* #bf796c; */
	--action-200: 199,138,126;	/* #c78a7e; */
	--action-contrast: var(--light-0);

	--secondary-0: 218,153,63;	/* #DA993F; */
	--secondary-50: 222,164,84;	/* #dea454; */
	--secondary-100: 226,176106;/* #e2b06a; */
	--secondary-200: 230,187,127;/* #e6bb7f; */
	--secondary-contrast: var(--light-0);

	--success: 32,214,78;		/* #20D64E; */
	--successLight: 219,250,227;/* #DBFAE3; */
	--successDark: 5,35,13;		/* #05230D; */

	--warning: 214,145,33;		/* #D69121; */
	--warningLight: 246,229,203;/* #F6E5CB; */
	--warningDark: 35,24,6;		/* #231806; */

	--error: 207,22,22;			/* #CF1616; */
	--errorLight: 249,200,200;	/* #F9C8C8; */
	--errorDark: 74,8,8;		/* #4A0808; */


	--base: var(--light-0);
	--base-50: var(--light-50);
	--base-100: var(--light-100);
	--base-200: var(--light-200);

	--contrast: var(--dark-0);
	--contrast-50: var(--dark-50);
	--contrast-100: var(--dark-100);
	--contrast-200: var(--dark-200);

	--successBack: var(--successLight);
	--successText: var(--successDark);
	--warningBack: var(--warningLight);
	--warningText: var(--warningDark);
	--errorBack: var(--errorLight);
	--errorText: var(--errorDark);
}

body:has(#theme-switcher:checked){
	--action-50: 155,82,67;		/* #9b5243; */
	--action-100: 137,72,60;	/* #89483c; */
	--action-200: 120,63,52;	/* #783f34; */

	--secondary-50: 214,142,42;	/* #d68e2a; */
	--secondary-100: 193,128,37;/* #c18025; */
	--secondary-200: 173,113,33;/* #ab7121; */

	--contrast: var(--light-0);
	--contrast-50: var(--light-50);
	--contrast-100: var(--light-100);
	--contrast-200: var(--light-200);
	--contrast-rgb: var(--light-rgb);

	--base: var(--dark-0);
	--base-50: var(--dark-50);
	--base-100: var(--dark-100);
	--base-200: var(--dark-200);
	--base-rgb: var(--dark-rgb);

	--successBack: var(--successDark);
	--successText: var(--successLight);
	--warningBack: var(--warningDark);
	--warningText: var(--warningLight);
	--errorBack: var(--errorDark);
	--errorText: var(--errorLight);
}
/*** FONTS START **/
/** Download your Fonts from: https://gwfh.mranftl.com/
use ./assets/fonts/ as a base

**/

/* playfair-display-regular - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 400;
	src: url('./assets/fonts/playfair-display-v40-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
	url('./assets/fonts/playfair-display-v40-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* playfair-display-italic - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Playfair Display';
	font-style: italic;
	font-weight: 400;
	src: url('./assets/fonts/playfair-display-v40-latin-italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
	url('./assets/fonts/playfair-display-v40-latin-italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* playfair-display-900 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 900;
	src: url('./assets/fonts/playfair-display-v40-latin-900.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
	url('./assets/fonts/playfair-display-v40-latin-900.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* playfair-display-900italic - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Playfair Display';
	font-style: italic;
	font-weight: 900;
	src: url('./assets/fonts/playfair-display-v40-latin-900italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
	url('./assets/fonts/playfair-display-v40-latin-900italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* noto-serif-hentaigana-200 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Noto Serif Hentaigana';
	font-style: normal;
	font-weight: 200;
	src: url('./assets/fonts/noto-serif-hentaigana-v17-latin-200.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
	url('./assets/fonts/noto-serif-hentaigana-v17-latin-200.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* noto-serif-hentaigana-regular - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Noto Serif Hentaigana';
	font-style: normal;
	font-weight: 400;
	src: url('./assets/fonts/noto-serif-hentaigana-v17-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
	url('./assets/fonts/noto-serif-hentaigana-v17-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* noto-serif-hentaigana-900 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Noto Serif Hentaigana';
	font-style: normal;
	font-weight: 900;
	src: url('./assets/fonts/noto-serif-hentaigana-v17-latin-900.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
	url('./assets/fonts/noto-serif-hentaigana-v17-latin-900.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/*** FONTS END ***/

.wp-site-blocks.wp-site-blocks>header, body>header {
	--justify:center;
	overflow: hidden;
	height: max(var(--btn), 10vh);
}
	.wp-site-blocks > header #theme-switch {
		position: absolute;
		left: 1rem;
	}
	.wp-site-blocks > header img {
		height: var(--chipchip);
		width: auto!important;
		margin: 0 1rem;
	}
.wp-site-blocks > header .title {
	align-items: center;
	font-size: var(--txt-large);
	font-family: var(--heading);
	font-weight: var(--fw-h-bold);
	text-transform: uppercase;
	width: max-content;
}

.intro {
	padding: 1rem;
}
.intro h1 {
	line-height: .75;
	font-size: 25vw;
	font-weight: var(--fw-h-bold);
	font-family: var(--heading);
	margin: 0 auto 3rem;
	text-align: center;
}
.intro p {
	text-align: center;
}


.pre-footer {
	background-color: rgb(var(--base));
	padding: 2rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .25rem;
}
.pre-footer p {
	margin: 0;
	text-align: center;
}

.pre-footer + footer {
	margin-top: 0;
}

nav.condensed ul {
	flex-direction: row;
}

aside.sub {
	position: sticky;
	top: -2rem;
	transition: top var(--trans-base);
	background-color: rgb(var(--base));
	box-shadow: rgba(var(--base-100),var(--op-45)) var(--shdw-down);
}
	aside.sub.row.x-btw.x-btw {
		--justify: center;
	}
aside.sub p {
	margin: 0;
	text-align: center;
}

.scroll-up .sub-header {
	top: var(--btn);
}

footer {
	overflow: hidden;
}

/*footer > svg,*/
/*header > svg {*/
/*	color: rgb(var(--base-50));*/
/*	opacity: .5;*/
/*	position: absolute;*/
/*	z-index: -1;*/
/*	width: 100vw;*/
/*	height: 100vw;*/
/*	inset: -20vw 0;*/
/*}*/

/*footer > svg {*/
/*	inset: -35vw 0;*/
/*	transform: rotate(-15deg);*/
/*}*/

/*header > svg path {*/
/*	stroke: rgba(var(--contrast-100),.2)!important;*/
/*}*/
.callout.callout {
	position: relative;
	padding: 3rem 1rem;
}
footer, header {
	position: relative;
}
	footer::before,
	header::before,
	.callout::before {
		content: '';
		inset: 0;
		position: absolute;
		z-index: 0;
		mask-image: var(--background);
		-webkit-mask-image: var(--background);
		mask-size: cover;
		-webkit-mask-size: cover;
		mask-repeat: no-repeat;
		-webkit-mask-repeat: no-repeat;
		mask-position: center;
		-webkit-mask-position: center;
		background-color: rgba(var(--contrast-100), var(--op-2));
	}
	header::before,
	footer::before {
		width: 200vw;
		height: 200vh;
		inset: -25vh -25vw;
		z-index: -1;
	}
	header::before {
		width:150vw;
		height: 150vw;
		transform: rotate(10deg);
	}
	footer::before {
		transform: rotate(-10deg);
	}

	.callout > .wrap {
		z-index: 1;
		background-color: rgb(var(--action-0));
		border: .5rem solid rgb(var(--secondary-0));
		padding: 1rem;
		width: 100%;
		max-width: 100%;
	}
	.callout > .wrap h1 {
		margin: 0;
		font-size: 1.75em;
	}
	.callout > .wrap .buttons {
		margin-bottom: 0;
	}
	@media (min-width:768px) {
		.callout.callout {
			padding: 2rem;
		}
		.callout > .wrap {
			padding: 2rem;
			border-width: 1rem;
			max-width: var(--wider);
		}
		.callout > .wrap h1 {
			font-size: var(--txt-xxx-large);
		}
		.callout > .wrap .buttons li {
			max-width: 49%;
		}
	}
.callout .buttons a {
	color: var(--secondary-contrast);
	background-color: rgb(var(--secondary-0));
}