/*
Theme Name: The Lonely Skein
Theme URI: 
Author: BV
Author URI: 
Description: For a yarn store
Requires at least: 6.9
Tested up to: 6.9
Requires PHP: 5.7
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: twentytwentyfive
Text Domain: the-lonely-skein
Tags: 
*/

:root {
	interpolate-size: allow-keywords;
}

details {
	/* border: 1px solid hsl(0 0% 12%); */
	padding: .5rem 1rem .5rem 0;
	border-radius: .25rem;
}

details>p {
	/* padding-block: 1rem; */
}

details::details-content {
	overflow: hidden;
	display: block;
	margin-inline: 2rem;
	font-size: 1rem;
	block-size: 0;
	transition-property: block-size, content-visibility;
	transition-duration: .3s;
	transition-behavior: allow-discrete;
}

details[open]::details-content {
	block-size: auto;
	block-size: calc-size(auto);
}

summary {
	padding-inline: 2rem;
	position: relative;
	/* margin-inline-start: 1rem; */
	list-style-position: outside;
}

summary:focus {
	outline: none;
}

summary::marker {
	content: '»';
	content: none;
}

summary::before {
	content: '»';
	position:absolute;
	inset-inline-start: 1rem;
	inset-block-start: -0.05rem;
	transition: rotate .3s;
}

details[open] summary::before {
	rotate: 90deg;
	inset-block-start: 0.05rem;
}

.yarn-companies {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    justify-content: space-between;
	
    gap: 2rem;
}

@media (max-width: 768px) {
	.yarn-companies {
		grid-template-columns: 1fr;
	}	
}

.yarn-company {
/*  	border-left: solid 1px black; */
 	border-radius: 19px;
	box-shadow: 1px 1px 0px 1px #20325a; /*1px 13px 11px -8px #20325a;*/
	background: #fffffa;
	min-width: 100%;
    width: 100%;
	margin-block: 0;
	padding: 1rem;
}

.yarn-company::before {
    content: '';
    display: block;
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: -1;
    top: 0;
    left: 0;
    border-radius: 19px;
    box-shadow: -1px -1px 0px 1px #498FC8;
}

.yarn-company-bases {
    margin-inline-start: 1rem !important;
	margin-block-start: 0;
}


.home-intro-text {
	margin-top: -2rem;
    background: #ffffff;
    padding: 2rem 3rem;
    border-radius: 5rem 5rem 0 0;
	max-width: var(--wp--style--global--content-size);
	box-shadow: 0px 8px 15px -18px #000 inset;
}

@media (min-width: 1100px) {
	.home-intro-text {
		margin-inline: auto !important;
	}
}


.home-gallery {
	gap: 1rem;
	margin-block-end: 2rem !important;
}

.home-gallery figure {
    flex-basis: 300px;
}

.footer-inner p {
	white-space: nowrap;
	text-wrap: nowrap;
}

.footer-inner>div {
    flex: 1;
}

.footer-social {
	gap: 2.5rem;
}

@media (max-width: 768px) {
	.footer-inner {
    	flex-direction: column;	
		align-items: start;
	}
	.footer-social {
    	order: 3;
	}
}


/***********Contact***********/
.contact-container {
	
}

.contact-map {
	flex: 1 1 50%;
}

.contact-form {
	flex: 1 1 400px;
}