/*
Theme Name: Eurospace Resourcing
Theme URI: https://www.eurospace-resourcing.com/
Author: Rabbitdigital Design
Description: Lightweight one-page block theme for Eurospace Resourcing – recruitment specialists for the space industry.
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 8.0
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: eurospace
*/

/* ---------- Base ---------- */
html { scroll-padding-top: 90px; }
body { -webkit-font-smoothing: antialiased; }

/* Text links: gov.uk-style underline that thickens on hover */
:where(.wp-site-blocks) a:where(:not(.wp-element-button)) {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	transition: text-decoration-thickness .15s ease, color .15s ease;
}
:where(.wp-site-blocks) a:where(:not(.wp-element-button)):hover {
	text-decoration-thickness: 3px;
}

/* Visible keyboard focus everywhere */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.wp-element-button:focus-visible {
	outline: 3px solid #ffbf47;
	outline-offset: 3px;
	box-shadow: none;
}

.skip-link.screen-reader-text:focus {
	background: #ffffff;
	color: #121212;
	clip: auto !important;
	clip-path: none;
	display: block;
	font-weight: 700;
	height: auto;
	left: 1rem;
	padding: 1rem 1.5rem;
	top: 1rem;
	width: auto;
	z-index: 100000;
}

.wp-element-button,
.wp-block-button__link { transition: background-color .2s ease, transform .2s ease; }
.wp-element-button:hover,
.wp-block-button__link:hover { transform: translateY(-1px); }

/* Outline button style: white button used on the hero */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: #ffffff;
	color: #011631;
	border: 0;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: #cccccc;
	color: #011631;
}

/* ---------- Sticky header (shrinks on scroll) ---------- */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 50;
}
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) {
	.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 46px; }
}
.es-header {
	transition: padding .35s ease;
}
.es-header .es-logo img {
	height: 44px;
	width: auto;
	transition: height .35s ease;
}
.is-scrolled .es-header {
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}
.is-scrolled .es-header .es-logo img { height: 34px; }

/* Round contact icon button */
.wp-block-button.is-style-contact-icon > .wp-block-button__link {
	width: 48px;
	height: 48px;
	padding: 0;
	border-radius: 999px;
	font-size: 0;
	line-height: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.wp-block-button.is-style-contact-icon > .wp-block-button__link::before {
	content: "";
	width: 22px;
	height: 22px;
	background: currentColor;
	-webkit-mask: url("assets/images/icon-mail.svg") no-repeat center / contain;
	mask: url("assets/images/icon-mail.svg") no-repeat center / contain;
}

/* ---------- Bouncing "next section" buttons ---------- */
.wp-block-button.is-style-down-arrow > .wp-block-button__link {
	width: 42px;
	height: 68px;
	padding: 0;
	border-radius: 21px;
	background: url("assets/images/down-button.svg") no-repeat center / contain;
	font-size: 0;
	line-height: 0;
	color: transparent;
	animation: es-bob 2.6s ease-in-out infinite;
}
.wp-block-button.is-style-down-arrow > .wp-block-button__link:hover {
	background-color: transparent;
	transform: none;
}
@keyframes es-bob {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-10px); }
}

/* Template sections sit flush (header / main / footer) */
.wp-site-blocks > * { margin-block-start: 0; }
.es-logo { margin: 0; }
.es-logo img { display: block; }

/* ---------- Hero ---------- */
.es-hero {
	background: #011631 url("assets/images/below-header-bg.jpg") no-repeat center 60% / cover;
	background-attachment: fixed;
	margin-block-start: 0 !important;
}
.es-hero .es-hero-panel { max-width: 860px; width: 100%; box-sizing: border-box; }

/* ---------- Section cards ---------- */
.es-card {
	scroll-margin-top: 90px;
	padding: clamp(1.5rem, 5vw, 4rem);
}
.es-card .wp-block-quote { border-left: 0; margin: 0; }
.es-card .wp-block-quote p { margin: 0; }
.es-card .wp-block-quote cite {
	display: block;
	margin-top: .75rem;
	font-style: normal;
	font-weight: 700;
	font-size: 16px;
	color: #0068a3;
}

@media (min-width: 768px) {
	.es-card .wp-block-columns { gap: 4rem; }
}
.es-card .wp-block-column > * + * { margin-block-start: 1.5rem; }

/* List style: two columns on desktop, one on mobile */
.is-style-two-columns { columns: 2; column-gap: 2.5rem; }
.is-style-two-columns li { break-inside: avoid; }

/* ---------- Above-footer image + footer ---------- */
.es-above-footer {
	background: #011631 url("assets/images/above-footer-bg.jpg") no-repeat center / cover;
}
.es-footer a { color: #ffffff; }
.es-footer a:hover { color: #ffffff; }
.es-footer .es-legal { border-top: 1px solid rgba(255, 255, 255, .25); }

/* ---------- Forms (Gravity Forms + Contact Form 7 + core) ---------- */
.es-card input[type="text"],
.es-card input[type="email"],
.es-card input[type="tel"],
.es-card input[type="url"],
.es-card input[type="number"],
.es-card select,
.es-card textarea,
.gform_wrapper.gravity-theme input[type="text"],
.gform_wrapper.gravity-theme input[type="email"],
.gform_wrapper.gravity-theme input[type="tel"],
.gform_wrapper.gravity-theme select,
.gform_wrapper.gravity-theme textarea {
	width: 100%;
	box-sizing: border-box;
	border: 2px solid #121212;
	border-radius: 12px;
	padding: 12px 14px;
	font: inherit;
	color: #121212;
	background: #ffffff;
}
.es-card textarea,
.gform_wrapper.gravity-theme textarea { min-height: 150px; resize: vertical; }
.es-card label,
.gform_wrapper.gravity-theme .gfield_label { font-weight: 700; font-size: 16px; }
.gform_wrapper.gravity-theme .gfield_required { color: #121212; }
.gform_wrapper.gravity-theme .gfield_validation_message,
.gform_wrapper.gravity-theme .validation_message,
.wpcf7-not-valid-tip { color: #b00020; font-weight: 700; }
.es-card input[type="submit"],
.es-card button[type="submit"],
.gform_wrapper.gravity-theme .gform_footer input[type="submit"],
.gform_wrapper.gravity-theme .gform_footer button {
	min-height: 48px;
	padding: .8rem 1.75rem;
	border: 0;
	border-radius: 999px;
	background: #0068a3;
	color: #ffffff;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
	transition: background-color .2s ease;
}
.es-card input[type="submit"]:hover,
.es-card button[type="submit"]:hover,
.gform_wrapper.gravity-theme .gform_footer input[type="submit"]:hover,
.gform_wrapper.gravity-theme .gform_footer button:hover { background: #005280; }

/* ---------- Fade-up on scroll (only when JS has loaded) ---------- */
.es-js .es-reveal {
	opacity: 0;
	transform: translateY(40px);
	transition: opacity .9s ease, transform .9s cubic-bezier(.2, .7, .2, 1);
	transition-delay: var(--es-delay, 0s);
}
.es-js .es-reveal.is-visible { opacity: 1; transform: none; }

/* ---------- Breakpoint: 768px ---------- */
/* Core columns stack below 782px; move that to 768px. */
@media (min-width: 768px) and (max-width: 781px) {
	.wp-block-columns:not(.is-not-stacked-on-mobile) { flex-wrap: nowrap !important; }
	.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column { flex-basis: 0 !important; flex-grow: 1; }
}
@media (max-width: 767px) {
	.wp-block-columns:not(.is-not-stacked-on-mobile) { flex-wrap: wrap !important; }
	.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column { flex-basis: 100% !important; }
	.is-style-two-columns { columns: 1; }
	.es-strapline { display: none; }
	.es-card { border-radius: 20px !important; }
	.es-hero { background-attachment: scroll; }
	.es-hero .es-hero-panel { padding: 2rem 1.5rem !important; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.wp-block-button.is-style-down-arrow > .wp-block-button__link { animation: none; }
	.es-js .es-reveal { opacity: 1; transform: none; transition: none; }
	.es-header, .es-header .es-logo img { transition: none; }
	.es-hero { background-attachment: scroll; }
}
