/*
 Theme Name:     Divi Child
 Theme URI:      https://www.elegantthemes.com/
 Description:    Divi Child Theme
 Author:         SM
 Template:       Divi
 Version:        1.0.0
*/

/* 1. Force Load Oswald (Variable) */
@font-face {
    font-family: 'Oswald Local';
    src: url('/wp-content/uploads/et-fonts/Oswald-VariableFont_wght-1.ttf') format('truetype');
    font-weight: 200 700; /* Supports the full variable weight range */
    font-style: normal;
    font-display: swap;
}


/* Prevent horizontal scrolling on mobile */
html, body, #page-container {
    max-width: 100vw !important;
    overflow-x: hidden !important;
}

.site-name p {
	font-family: 'Oswald Local', sans-serif !important;
}

/* ––––––– Section 1 ––––––– */
.hero-copy p {
	max-inline-size: 26ch;
}
.call-to-action p {
	max-inline-size: 18ch;
}

/* ––––––– Services ––––––– */
.service-copy p {
    max-inline-size: 50ch;
}
span.material-symbols-outlined {
    font-size: 5rem;
    font-weight: 100;
    line-height: .4;
}
div#icons {
    margin: 0 !important;
}

/* ––––––– Footer ––––––– */
footer .container.clearfix {
    width: 100%;
    max-width: 100%;
    padding: 0 5%;
}

/*----------------------------- X Tablet -----------------------------*/
@media only screen and (max-width: 1024px) {

}
/* ----------------------------- Tablet ----------------------------- */
@media only screen and (max-width: 980px) {
	.call-to-action p {
		max-inline-size: 18ch;
	}
	.service-copy p {
		max-inline-size: 50ch;
	}
	.book-or-contact p {
		max-inline-size: 33ch;
	}
	
/* --- Mobile MENU --- */

	/* --- 1. BASE SETUP (Hidden with Fade Logic) --- */
	.et_mobile_menu {
		/* Layout: Always Flex so it's ready to fade in */
		display: flex !important;
		flex-direction: column;
		justify-content: flex-end; /* Pushes items to bottom */

		/* Full Screen Fixed Position */
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		width: 100vw !important;
		height: 100vh !important;

		/* Your Styling Preferences */
		background-color: #000000 !important;
		padding-bottom: 10vh !important; /* Your custom spacing */
		margin: 0 !important;
		z-index: 9990 !important;
		box-shadow: none !important;
		border: none !important;

		/* HIDDEN STATE (Allows Transition) */
		opacity: 0;
		visibility: hidden;
		pointer-events: none; /* Prevents clicking when hidden */

		/* The Fade Effect */
		transition: opacity 0.25s ease-in-out, visibility 0.25s ease-in-out;
	}

	/* --- 2. OPEN STATE (Visible) --- */
	/* Activates when JS adds 'my-menu-open' class */
	body.my-menu-open .et_mobile_menu {
		opacity: 1 !important;
		visibility: visible !important;
		pointer-events: auto !important; /* Re-enables clicking */
	}

	/* --- 3. MENU ITEMS STYLING --- */
	.et_mobile_menu li {
		margin: 0 !important;
		text-align: left !important;
		display: block !important;
	}

	.et_mobile_menu li a {
		font-family: inherit !important;
		font-size: 6vh !important;
		line-height: 1.1 !important;
		border-bottom: none !important;
		padding: 1.2vh 0 !important;
		font-weight: 300 !important;
		color: white !important;
		background-color: transparent !important;
	}

	/* Hover / Active State */
	.et_mobile_menu li.current-menu-item a,
	.et_mobile_menu li a:hover {
		color: #666 !important;
		font-weight: 400 !important;
	}

	/* --- 4. BUTTON STYLING --- */
	.mobile_menu_bar {
		position: relative !important;
		z-index: 999999 !important;
		pointer-events: auto !important;
		padding-bottom: 5px;
		/* WE COMPLETELY REMOVED THE TOP AND RIGHT POSITIONING */
	}

	/* Default "Menu" Text */
	.mobile_menu_bar:before {
		content: 'Menu' !important;      
		font-family: 'IBM Local', sans-serif !important; 
		font-size: 1.2rem !important;
		font-weight: 400 !important;
		color: white !important;         
	}

	/* Open "Close" Text */
	.mobile_menu_bar.is-open:before {
		content: 'Close' !important;     
		color: white !important;
	}

}

/*----------------------------- Mobile -----------------------------*/
@media only screen and (max-width: 767px){
	body, h1, h2, h3, h4, h5, h6, p, div {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
	.call-to-action p {
		max-inline-size: 18ch;
	}
	div#hide-in-mobile {
		display: none;
	}
}
