/*
Theme Name: CharTechMarine
Description: Child theme for Alves (chartechmarine.com)
Template: varia-wpcom
Version: 1.1.1
Author: Cory Charlton
*/

/* Font overrides — alves-wpcom uses var(--font-headings) and var(--font-base) throughout */
:root {
	--font-headings: "Poppins", sans-serif;
	--font-base: "Inter", sans-serif;
}

/* Hide footer site info bar */
div.site-info { display: none; }

/* Mobile: header row + hamburger toggle */
@media only screen and (max-width: 559px) {
	.site-header {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.site-header > * {
		margin-top: 0;
		margin-bottom: 0;
	}
	#toggle-menu {
		background: transparent;
		border: none;
		box-shadow: none;
		color: inherit;
		padding: 8px;
		font-size: 0; /* hides "Menu" text node */
	}
	#toggle-menu .dropdown-icon {
		font-size: 1.5rem;
		font-style: normal;
	}
	/* Phosphor List icon (open) and X icon (close) via SVG mask */
	#toggle-menu .dropdown-icon.open,
	#toggle-menu .dropdown-icon.close {
		background-color: currentColor;
		font-size: 0;
		height: 1.5rem;
		-webkit-mask-position: center;
		mask-position: center;
		-webkit-mask-repeat: no-repeat;
		mask-repeat: no-repeat;
		-webkit-mask-size: contain;
		mask-size: contain;
		vertical-align: middle;
		width: 1.5rem;
	}
	#toggle-menu .dropdown-icon.open {
		display: inline-block;
		-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M224,128a8,8,0,0,1-8,8H40a8,8,0,0,1,0-16H216A8,8,0,0,1,224,128ZM40,72H216a8,8,0,0,0,0-16H40a8,8,0,0,0,0,16ZM216,184H40a8,8,0,0,0,0,16H216a8,8,0,0,0,0-16Z'/%3E%3C/svg%3E");
		mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M224,128a8,8,0,0,1-8,8H40a8,8,0,0,1,0-16H216A8,8,0,0,1,224,128ZM40,72H216a8,8,0,0,0,0-16H40a8,8,0,0,0,0,16ZM216,184H40a8,8,0,0,0,0,16H216a8,8,0,0,0,0-16Z'/%3E%3C/svg%3E");
	}
	#toggle:checked + #toggle-menu .dropdown-icon.close {
		display: inline-block;
		-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M205.66,194.34a8,8,0,0,1-11.32,11.32L128,139.31,61.66,205.66a8,8,0,0,1-11.32-11.32L116.69,128,50.34,61.66A8,8,0,0,1,61.66,50.34L128,116.69l66.34-66.35a8,8,0,0,1,11.32,11.32L139.31,128Z'/%3E%3C/svg%3E");
		mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M205.66,194.34a8,8,0,0,1-11.32,11.32L128,139.31,61.66,205.66a8,8,0,0,1-11.32-11.32L116.69,128,50.34,61.66A8,8,0,0,1,61.66,50.34L128,116.69l66.34-66.35a8,8,0,0,1,11.32,11.32L139.31,128Z'/%3E%3C/svg%3E");
	}

	body:not(.fse-enabled) #masthead {
		padding-bottom: 16px;
	}

	/* Float expanded menu over page content, full width below header */
	.main-navigation > div {
		background: #ffffff;
		border-top: 1px solid #e0e0e0;
		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
		left: 0;
		padding: 16px;
		position: absolute;
		right: 0;
		top: 100%;
		z-index: 100;
	}
}

/* Desktop header layout: site title and nav on same row */
@media only screen and (min-width: 560px) {
	.site-header {
		align-items: center;
		display: flex;
		justify-content: space-between;
	}
	.site-header > * {
		margin-top: 0;
		margin-bottom: 0;
	}
	.site-header .main-navigation {
		display: flex;
		justify-content: flex-end;
		flex-wrap: wrap;
	}
	.site-header .main-navigation > div {
		justify-content: flex-end;
	}
	.site-header .main-navigation > div > ul {
		justify-content: flex-end;
		margin-left: -8px;
		margin-right: -8px;
	}
	.site-header .main-navigation > div > ul > li {
		padding-left: 16px;
		padding-right: 16px;
		padding-top: 8px;
		padding-bottom: 8px;
	}
	.site-header .main-navigation > div > ul > li > a {
		padding: 0;
	}
}