/*
Theme Name: Astra Child - Backstay Pty Ltd
Template: astra
Description: Custom child theme for Backstay Pty Ltd, sports business consulting.
Version: 1.0.0
Text Domain: astra-child
*/

:root {
	--bs-navy: #0e2238;
	--bs-navy-deep: #081426;
	--bs-charcoal: #1c1f24;
	--bs-off-white: #f6f7f9;
	--bs-white: #ffffff;
	--bs-accent: #ff6a2b;
	--bs-accent-deep: #e2540f;
	--bs-teal: #0fb5ae;
	--bs-border: #e4e7ec;
	--bs-text-muted: #5b6472;
	--bs-radius: 6px;
	--bs-space-1: 8px;
	--bs-space-2: 16px;
	--bs-space-3: 24px;
	--bs-space-4: 40px;
	--bs-space-5: 64px;
	--bs-space-6: 96px;
}

.ast-site-identity .custom-logo-link img,
.site-logo-img img,
.custom-logo {
	max-height: 56px;
	width: auto;
	height: auto;
}

@media (max-width: 544px) {
	.ast-site-identity .custom-logo-link img,
	.site-logo-img img,
	.custom-logo {
		max-height: 42px;
	}
}

body,
p,
li,
input,
textarea {
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	color: var(--bs-charcoal);
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.ast-header-title {
	font-family: "Sora", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--bs-navy);
}

a {
	color: var(--bs-navy);
}

a:hover {
	color: var(--bs-accent);
}

/* Site header */
.site-header,
.ast-primary-header-bar {
	background-color: var(--bs-white);
	border-bottom: 1px solid var(--bs-border);
}

.main-header-bar .main-header-bar-navigation .page_item > a,
.main-header-menu > .menu-item > .menu-link {
	font-weight: 600;
	letter-spacing: 0.01em;
}

/* Buttons */
.ast-button,
button,
input[type="submit"],
.wp-block-button__link,
.bs-btn {
	background-color: var(--bs-accent);
	border-color: var(--bs-accent);
	color: var(--bs-white) !important;
	border-radius: var(--bs-radius);
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	font-size: 0.85rem;
	padding: 14px 28px;
	transition: background-color 0.2s ease, transform 0.15s ease;
}

.ast-button:hover,
button:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover,
.bs-btn:hover {
	background-color: var(--bs-accent-deep);
	border-color: var(--bs-accent-deep);
	transform: translateY(-1px);
}

.bs-btn-outline {
	background-color: transparent !important;
	border: 2px solid var(--bs-white) !important;
	color: var(--bs-white) !important;
}

.bs-btn-outline:hover {
	background-color: var(--bs-white) !important;
	color: var(--bs-navy) !important;
}

/* Hero */
.bs-hero {
	position: relative;
	background-size: cover;
	background-position: center;
	color: var(--bs-white);
	padding: var(--bs-space-6) var(--bs-space-3);
	text-align: center;
	border-radius: var(--bs-radius);
	overflow: hidden;
	margin-bottom: var(--bs-space-5);
}

.bs-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(8, 20, 38, 0.78) 0%, rgba(8, 20, 38, 0.92) 100%);
	z-index: 0;
}

.bs-hero > * {
	position: relative;
	z-index: 1;
}

.bs-hero h1 {
	color: var(--bs-white);
	font-size: clamp(2rem, 4vw, 3.2rem);
	margin-bottom: var(--bs-space-2);
}

.bs-hero p {
	font-size: 1.15rem;
	max-width: 640px;
	margin: 0 auto var(--bs-space-3);
	color: rgba(255, 255, 255, 0.88);
}

.bs-eyebrow {
	display: inline-block;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-size: 0.8rem;
	font-weight: 700;
	color: var(--bs-accent);
	margin-bottom: var(--bs-space-2);
}

/* Section spacing */
.bs-section {
	padding: var(--bs-space-5) var(--bs-space-2);
	max-width: 1180px;
	margin: 0 auto;
}

.bs-section-title {
	text-align: center;
	margin-bottom: var(--bs-space-4);
}

.bs-section-title h2 {
	font-size: clamp(1.6rem, 3vw, 2.4rem);
}

.bs-section-title p {
	color: var(--bs-text-muted);
	max-width: 560px;
	margin: var(--bs-space-1) auto 0;
}

/* Cards */
.bs-card {
	background: var(--bs-white);
	border: 1px solid var(--bs-border);
	border-top: 3px solid var(--bs-accent);
	border-radius: var(--bs-radius);
	padding: var(--bs-space-3);
	height: 100%;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.bs-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 24px rgba(14, 34, 56, 0.1);
}

.bs-card h3 {
	font-size: 1.15rem;
	margin-bottom: var(--bs-space-1);
}

.bs-card p {
	color: var(--bs-text-muted);
	font-size: 0.95rem;
}

/* CTA band */
.bs-cta {
	background-color: var(--bs-navy);
	color: var(--bs-white);
	border-radius: var(--bs-radius);
	padding: var(--bs-space-4) var(--bs-space-3);
	text-align: center;
}

.bs-cta h2 {
	color: var(--bs-white);
	margin-bottom: var(--bs-space-2);
}

.bs-cta p {
	color: rgba(255, 255, 255, 0.85);
	max-width: 520px;
	margin: 0 auto var(--bs-space-3);
}

/* Hide the default Astra page title on pages - each page has its own hero/heading */
.page .entry-header,
.page .page-header {
	display: none;
}

/* Hide Astra's default small footer bar - replaced by the custom Backstay footer */
.ast-small-footer,
.site-below-footer-wrap {
	display: none !important;
}

/* Legal notice box */
.bs-legal-notice {
	background: #fff6ed;
	border: 1px solid #ffd9b8;
	border-radius: var(--bs-radius);
	padding: var(--bs-space-2) var(--bs-space-3);
	font-size: 0.9rem;
	color: #7a4a1f;
	margin-bottom: var(--bs-space-3);
}

/* Footer */
.bs-footer {
	background-color: var(--bs-navy-deep);
	color: rgba(255, 255, 255, 0.75);
	padding: var(--bs-space-4) var(--bs-space-2) var(--bs-space-2);
}

.bs-footer .bs-footer-inner {
	max-width: 1180px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: var(--bs-space-4);
	justify-content: space-between;
	padding-bottom: var(--bs-space-3);
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.bs-footer h4 {
	color: var(--bs-white);
	font-size: 1.1rem;
	margin-bottom: var(--bs-space-1);
}

.bs-footer .bs-footer-brand p {
	max-width: 320px;
	font-size: 0.9rem;
	color: rgba(255, 255, 255, 0.65);
}

.bs-footer a {
	color: rgba(255, 255, 255, 0.75);
	text-decoration: none;
}

.bs-footer a:hover {
	color: var(--bs-accent);
}

.bs-footer ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.bs-footer li {
	margin-bottom: var(--bs-space-1);
	font-size: 0.9rem;
	color: rgba(255, 255, 255, 0.75);
}

.bs-footer-bottom {
	max-width: 1180px;
	margin: 0 auto;
	padding-top: var(--bs-space-2);
	font-size: 0.82rem;
	color: rgba(255, 255, 255, 0.5);
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--bs-space-1);
}

.bs-footer-placeholder {
	opacity: 0.6;
	font-style: italic;
}

@media (max-width: 768px) {
	.bs-section {
		padding: var(--bs-space-4) var(--bs-space-2);
	}
	.bs-hero {
		padding: var(--bs-space-5) var(--bs-space-2);
	}
}