/*
Theme Name: Electrical Design Services
Theme URI: https://example.com
Author: Electrical Design Services
Author URI: https://example.com
Description: A minimal WordPress Full Site Editing theme for a one-page Electrical Design Services website.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.5
Requires PHP: 7.4
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: electrical-design
*/

/* ==========================================================================
   General
   ========================================================================== */

body {
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
}

a {
	transition: color 0.2s ease-in-out;
}

.section-padding {
	padding-top: var(--wp--preset--spacing--70);
	padding-bottom: var(--wp--preset--spacing--70);
}

/* ==========================================================================
   Header
   ========================================================================== */

.site-header {
	padding-top: var(--wp--preset--spacing--40);
	padding-bottom: var(--wp--preset--spacing--40);
	border-bottom: 1px solid var(--wp--preset--color--tertiary);
}

.site-header .wp-block-site-title a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	font-weight: 700;
}

.site-header .wp-block-navigation-link a {
	color: var(--wp--preset--color--contrast);
}

.site-header .wp-block-navigation-link a:hover {
	color: var(--wp--preset--color--accent);
}

.header-cta a {
	background-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
	border-radius: 4px;
}

.header-cta a:hover {
	background-color: var(--wp--preset--color--contrast);
}

/* ==========================================================================
   Hero
   ========================================================================== */

.hero-section {
	background-color: var(--wp--preset--color--base);
	text-align: center;
}

.hero-section .wp-block-heading {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
}

.hero-section p {
	max-width: 650px;
	margin-left: auto;
	margin-right: auto;
	color: var(--wp--preset--color--contrast);
}

.hero-buttons {
	justify-content: center;
}

.hero-buttons .wp-block-button.is-style-outline a {
	border-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--accent);
}

/* ==========================================================================
   Services
   ========================================================================== */

.services-section {
	background-color: var(--wp--preset--color--tertiary);
}

.service-card {
	background-color: var(--wp--preset--color--base);
	border-radius: 6px;
	padding: var(--wp--preset--spacing--50);
	border-top: 3px solid var(--wp--preset--color--accent);
	height: 100%;
}

.service-card .wp-block-heading {
	color: var(--wp--preset--color--contrast);
}

/* ==========================================================================
   About
   ========================================================================== */

.about-section {
	background-color: var(--wp--preset--color--base);
}

.about-section p {
	max-width: 750px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/* ==========================================================================
   Why Choose Us
   ========================================================================== */

.why-choose-section {
	background-color: var(--wp--preset--color--tertiary);
}

.feature-card {
	background-color: var(--wp--preset--color--base);
	border-radius: 6px;
	padding: var(--wp--preset--spacing--50);
	text-align: center;
	height: 100%;
}

.feature-card .wp-block-heading {
	color: var(--wp--preset--color--accent);
}

/* ==========================================================================
   Contact
   ========================================================================== */

.contact-section {
	background-color: var(--wp--preset--color--base);
	text-align: center;
}

.contact-details .wp-block-column {
	background-color: var(--wp--preset--color--tertiary);
	border-radius: 6px;
	padding: var(--wp--preset--spacing--50);
}

.contact-details .wp-block-heading {
	color: var(--wp--preset--color--accent);
}

/* ==========================================================================
   Footer
   ========================================================================== */

.site-footer {
	background-color: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
	padding-top: var(--wp--preset--spacing--50);
	padding-bottom: var(--wp--preset--spacing--50);
}

.site-footer a {
	color: var(--wp--preset--color--base);
}

.site-footer a:hover {
	color: var(--wp--preset--color--accent);
}

.site-footer .wp-block-navigation-link a {
	color: var(--wp--preset--color--base);
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 782px) {
	.section-padding {
		padding-top: var(--wp--preset--spacing--50);
		padding-bottom: var(--wp--preset--spacing--50);
	}

	.site-header {
		padding-top: var(--wp--preset--spacing--30);
		padding-bottom: var(--wp--preset--spacing--30);
	}
}