/*
-=-------------------------------=-
 *             C S S             *
 *  ~-~-~-~-~-~-~-~-~-~-~-~-~-~  *
 *      A C C O R D I O N S      *
 *  ~-~-~-~-~-~-~-~-~-~-~-~-~-~  *
 *     Design by Anna Greco      *
 *     www.houseofgreco.com      *
 *        Copyright 2026         *
-=-------------------------------=-
*/


.accordion {
	background: transparent;
	border: 0;
	cursor: pointer;
	-moz-transition: 0.4s ease;
	-ms-transition: 0.4s ease;
	-o-transition: 0.4s ease;
	-webkit-transition: 0.4s ease;
	transition: 0.4s ease;
}

.accordion .text:hover {
	transition: 1s ease;
}

.accordion.active {
	transition: transform 1s ease;
}

.accordion .text {
	color: #D6C09E;
	font-family: 'Baskerville SemiBold';
	font-size: 20px;
	letter-spacing: 0.5px;
	line-height: 1.5;
	padding: 0px 10px 0px 10px;
	text-shadow: 0px 2px 3px #210B0E !important;
}

.panel {
    background: rgba(30, 10, 15, 0.5);
    border: 1px solid rgba(130, 90, 100, 0.15);
	border-radius: 12px;
		-moz-border-radius: 12px;
		-ms-border-radius: 12px;
		-o-border-radius: 12px;
		-webkit-border-radius: 12px;
	box-shadow: inset 0px 8px 7px 2px #241216, 0px -2px 12px 0px rgba(110, 95, 75, 0.25);
	color: #653942;
	display: none;
	letter-spacing: 0px;
	line-height: 1.35;
	margin: 7px auto 25px auto;
    overflow: hidden;
    padding: 25px;
	text-shadow: none;
    width: 575px;
    background: #D5C0A0;
    border: 1px solid #662530;
	box-shadow: inset 0px 0px 8px 4px #8A7A62, 0px -2px 12px 0px rgba(110, 95, 75, 0.25);
}

.lets-not .accordion:after {
	display: inline-block;
	font-family: Arial;
	font-size: 27px;
	color: #C0B346;
	content: '\2191';
	filter: hue-rotate(-13deg) saturate(0.8);
	line-height: 0;
	margin-left: 7px;
	position: relative;
		top: 5px;
		left: -2px;
	text-shadow: 0px 2px 3px #210B0E;
	transform: rotate(-180deg);
	transition: transform 1s ease;
}

.lets-not .accordion.active:after {
	content: '\2193';
		top: 6px;
	transform: rotate(180deg);
}

.lets-not .accordion:hover::after {
	color: #D6C09E;
	text-shadow: 0px 0px 14px #FFDEAC !important;
	transition: 1.5s ease;
}


/*	-=---------------=-
	 * MEDIA QUERIES *
	-=---------------=-  */

	/*	-=-------=-
		 * 675px *
		-=-------=-  */

		@media screen and (max-width: 675px) {

			.panel {
		    	width: 600px;
		    }

		}

	/*	-=-------=-
		 * 650px *
		-=-------=-  */

		@media screen and (max-width: 650px) {

			.panel {
			    width: 575px;
		    }

		}

	/*	-=-------=-
		 * 625px *
		-=-------=-  */

		@media screen and (max-width: 625px) {

			.panel {
			    width: 550px;
		    }

		}

	/*	-=-------=-
		 * 600px *
		-=-------=-  */

		@media screen and (max-width: 600px) {

			.panel {
			    width: 525px;
		    }

		}

	/*	-=-------=-
		 * 575px *
		-=-------=-  */

		@media screen and (max-width: 575px) {

			.panel {
		    	width: 500px;
		    }

		}

	/*	-=-------=-
		 * 550px *
		-=-------=-  */

		@media screen and (max-width: 550px) {

			.panel {
			    width: 475px;
		    }

		}

	/*	-=-------=-
		 * 525px *
		-=-------=-  */

		@media screen and (max-width: 525px) {

			.panel {
			    width: 450px;
		    }

		}

	/*	-=-------=-
		 * 500px *
		-=-------=-  */

		@media screen and (max-width: 500px) {

			.panel {
			    width: 425px;
		    }

		}

	/*	-=-------=-
		 * 475px *
		-=-------=-  */

		@media screen and (max-width: 475px) {

			.panel {
			    width: 400px;
		    }

		}

	/*	-=-------=-
		 * 450px *
		-=-------=-  */

		@media screen and (max-width: 450px) {

			.panel {
			    width: 375px;
		    }

		}

	/*	-=-------=-
		 * 400px *
		-=-------=-  */

		@media screen and (max-width: 400px) {

			.panel {
			    width: 350px;
		    }

		}