@font-face {
	font-family: 'League Spartan';
	src: url('../../fonts/LeagueSpartan-VariableFont_wght.ttf') format('truetype');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

:root {
	--color-bg:          #1e1e1e;
	--color-bg-alt:      #353535;
	--color-bg-card:     #424242;
	--color-accent:      #f9bf00;
	--color-accent-dark: #d4a300;
	--color-text:        #ffffff;
	--color-text-muted:  #b8b8b8;
	--color-border:      #333333;
}

html, body {
	background-color: var(--color-bg);
}

body,
input,
textarea,
select {
	font-family: 'League Spartan', 'Source Sans Pro', sans-serif;
	color: var(--color-text-muted);
	font-size: 15pt;
	letter-spacing: 0.01em;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'League Spartan', 'Source Sans Pro', sans-serif;
	color: var(--color-text);
	font-weight: 700;
	letter-spacing: -0.01em;
}

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

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

strong, b {
	color: var(--color-text);
}

.accent {
	color: var(--color-accent);
}

#page-wrapper {
	background-color: var(--color-bg);
}

#header.alt,
#header {
	position: static !important;
}

#header,
.homepage #header {
	background: var(--color-bg) url('../../brand/logo.png') center 4em / 33.33% auto no-repeat;
	height: auto !important;
	padding: 0 !important;
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
}

#header:before {
	display: none !important;
}

#logo {
	width: 100%;
	padding-top: 16.68%;
	margin-top: 4em;
	position: relative;
	flex-shrink: 0;
}

#logo a {
	position: absolute;
	inset: 0;
}

.header-bottom {
	padding: 1em 0 2.5em;
	text-align: center;
}

.header-tagline {
	color: var(--color-text-muted);
	font-family: 'League Spartan', sans-serif;
	font-size: 0.85em;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0 0 1.8em;
}

.header-cta {
	display: inline-block;
	background: #ffffff url("images/overlay.png");
	color: #1e1e1e !important;
	font-family: 'League Spartan', sans-serif;
	font-weight: 800;
	font-size: 1em;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	padding: 0.83em 3em 0.67em;
	border-radius: 3px;
	white-space: nowrap;
	transition: background 0.2s ease;
}

.header-cta:hover {
	background: #e8e8e8 !important;
	text-decoration: none;
}

.wrapper {
	background-color: var(--color-bg);
}

.wrapper.style1 {
	background-color: var(--color-bg);
	border-top: 1px solid var(--color-border);
}

.wrapper.style2 {
	background-color: var(--color-bg-alt);
	border-top: 1px solid var(--color-border);
}

.wrapper.style3 {
	background-color: var(--color-bg-card);
	border-top: 1px solid var(--color-border);
}

.wrapper .title {
	font-family: 'League Spartan', sans-serif;
	font-weight: 700;
}

.wrapper .title::before,
.wrapper .title::after {
	display: none;
}

.wrapper.style1 .title {
	background: var(--color-bg);
	color: var(--color-accent);
}

.wrapper.style2 .title {
	background: var(--color-bg-alt);
	color: var(--color-accent);
}

.wrapper.style3 .title {
	background: var(--color-bg-card);
	color: var(--color-accent);
}

#intro {
	background-color: var(--color-accent);
	padding: 5em 0 4em;
}

#intro.wrapper .title {
	background: var(--color-accent);
	color: #1e1e1e;
}

#intro .container {
	text-align: center;
}

#intro p.style1 {
	color: #1e1e1e;
	font-size: 1em;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-weight: 600;
}

#intro p.style2 {
	background-color: var(--color-bg);
	color: var(--color-text);
	font-size: 2.8em;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.02em;
	font-family: 'League Spartan', sans-serif;
	max-width: 18.57em;
	margin-left: auto;
	margin-right: auto;
}

#intro p.style2 .accent {
	color: var(--color-accent);
}

#intro p.style3 {
	color: #1e1e1e;
	font-size: 1em;
	max-width: 38em;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.7;
}

.button,
input[type="submit"],
input[type="reset"],
button {
	height: auto !important;
	line-height: 1 !important;
	padding-top: 0.98em !important;
	padding-bottom: 0.82em !important;
}

.button.style1,
input[type="submit"].style1 {
	background-color: var(--color-accent);
	background-image: url("images/overlay.png");
	border-color: var(--color-accent);
	color: #1e1e1e;
	font-family: 'League Spartan', sans-serif;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.button.style1:hover,
input[type="submit"].style1:hover {
	background-color: var(--color-accent-dark);
	border-color: var(--color-accent-dark);
}

.button.style2 {
	background-color: transparent;
	border-color: var(--color-border);
	color: var(--color-text-muted);
	font-family: 'League Spartan', sans-serif;
	font-weight: 600;
	letter-spacing: 0.04em;
}

.button.style2:hover {
	border-color: var(--color-text-muted);
	color: var(--color-text);
}

.button.style3.large {
	background-color: var(--color-accent);
	background-image: url("images/overlay.png");
	border-color: var(--color-accent);
	color: #1e1e1e;
	font-family: 'League Spartan', sans-serif;
	font-weight: 800;
	font-size: 1em;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding-left: 2.2em !important;
	padding-right: 2.2em !important;
}

.button.style3.large:hover {
	background-color: var(--color-accent-dark);
	border-color: var(--color-accent-dark);
}

.button.ghost {
	background: transparent;
	border: none;
	color: var(--color-text-muted);
	text-decoration: none;
	font-family: 'League Spartan', sans-serif;
	font-weight: 600;
	letter-spacing: 0.03em;
	font-size: 0.95em;
	padding: 0;
	display: inline-block;
	transition: color 0.2s ease;
}

.button.ghost:hover {
	color: var(--color-text);
	text-decoration: none;
}

.button,
.header-cta,
.email-form-wrapper button[type="submit"] {
	position: relative;
	overflow: hidden;
}

.button::after,
.header-cta::after,
.email-form-wrapper button[type="submit"]::after {
	content: '';
	position: absolute;
	inset: 0;
	background: url("images/overlay.png");
	opacity: 0;
	transition: opacity 0.2s ease;
	pointer-events: none;
	z-index: 1;
}

.button:hover::after,
.header-cta:hover::after,
.email-form-wrapper button[type="submit"]:hover::after {
	opacity: 1;
}

.wrapper {
	padding-bottom: 10em !important;
}

.feature-list section {
	border-top: none !important;
	padding-top: 0 !important;
}

.feature-list h3 {
	color: var(--color-text) !important;
}

#features header.style1 h2 {
	color: var(--color-text);
}

#features header.style1 p {
	color: var(--color-text-muted);
}

.feature-list section h3 {
	color: var(--color-text);
	border-top-color: var(--color-border);
}

.feature-list section h3::before {
	color: var(--color-accent);
}

.feature-list section p {
	color: var(--color-text-muted);
}

#for-people {
	padding: 4em 0;
}

#for-people h2 {
	text-align: center;
	margin-bottom: 1.5em;
	font-size: 1.8em;
}

.people-list {
	columns: 2;
	column-gap: 3em;
	list-style: none;
	padding: 0;
	max-width: 52em;
	margin: 0 auto;
}

.people-list li {
	color: var(--color-text-muted);
	padding: 0.55em 0 0.55em 1.4em;
	position: relative;
	font-size: 1em;
	line-height: 1.5;
	break-inside: avoid;
	margin-bottom: 0;
}

.people-list li::before {
	content: '–';
	color: var(--color-accent);
	position: absolute;
	left: 0;
	font-weight: 700;
}

@media screen and (max-width: 768px) {
	.people-list {
		columns: 1;
	}
}

#evil-wisdom {
	padding: 4.5em 0;
}

#evil-wisdom h2 {
	text-align: center;
	margin-bottom: 1.8em;
	font-size: 1.8em;
}

.wisdom-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5em;
	max-width: 52em;
	margin: 0 auto;
}

.wisdom-card {
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-top: 3px solid var(--color-accent);
	padding: 1.8em 1.6em;
	border-radius: 2px;
}

.wisdom-card p {
	color: var(--color-text);
	font-size: 0.95em;
	line-height: 1.65;
	margin: 0;
	font-style: italic;
}

.wisdom-card p::before {
	content: '\201C';
	color: var(--color-accent);
	font-size: 1.8em;
	line-height: 0;
	vertical-align: -0.35em;
	margin-right: 0.15em;
	font-style: normal;
}

@media screen and (max-width: 768px) {
	.wisdom-grid {
		grid-template-columns: 1fr;
	}
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
	.wisdom-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

#peek-inside {
	padding: 4em 0;
}

.peek-cards {
	display: flex;
	gap: 1.5em;
	justify-content: center;
}

.peek-card {
	background: var(--color-accent) url("images/overlay.png");
	border-radius: 3px;
	padding: 1.4em 1.6em;
	flex: 1;
	max-width: 16em;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.4em;
}

.peek-card i {
	color: #1e1e1e;
	font-size: 1.4em;
	margin-bottom: 0.2em;
}

.peek-card p {
	color: #1e1e1e;
	font-size: 0.82em;
	line-height: 1.5;
	margin: 0;
}

@media screen and (max-width: 768px) {
	.peek-cards {
		flex-direction: column;
		align-items: center;
	}

	.peek-card {
		max-width: 100%;
		width: 100%;
	}
}

#faq {
	padding: 4em 0;
}

#faq h2 {
	text-align: center;
	margin-bottom: 1.8em;
	font-size: 1.8em;
}

.faq-list {
	max-width: 52em;
	margin: 0 auto;
}

.faq-item {
	border-top: 1px solid var(--color-border);
	padding: 1.4em 0;
}

.faq-item:last-child {
	border-bottom: 1px solid var(--color-border);
}

.faq-item h3 {
	color: var(--color-text);
	font-size: 1em;
	font-weight: 700;
	margin-bottom: 0.5em;
	letter-spacing: 0.01em;
}

.faq-item p {
	color: var(--color-text-muted);
	font-size: 0.95em;
	line-height: 1.7;
	margin: 0;
}

#subscribe {
	padding-top: 5em !important;
	text-align: center;
}

#subscribe h2 {
	font-size: 2em;
	line-height: 1.3;
	margin-bottom: 0.5em;
	color: var(--color-text);
}

#subscribe .subtitle {
	color: var(--color-text-muted);
	max-width: 36em;
	margin: 0 auto 2.5em;
	font-size: 1em;
	line-height: 1.7;
}

.email-form-wrapper {
	max-width: 28em;
	margin: 0 auto;
}

.email-form-wrapper form {
	display: flex;
	gap: 0.6em;
	margin: 0;
}

.email-form-wrapper input[type="email"] {
	flex: 1;
	background: var(--color-bg-card);
	border: 1px solid var(--color-border);
	color: var(--color-text);
	padding: 0.75em 1em;
	font-family: 'League Spartan', sans-serif;
	font-size: 0.9em;
	border-radius: 3px;
	outline: none;
	transition: border-color 0.2s ease;
}

.email-form-wrapper input[type="email"]::placeholder {
	color: var(--color-text-muted);
}

.email-form-wrapper input[type="email"]:focus {
	border-color: var(--color-accent);
	background: #ffffff;
	color: #1e1e1e;
}

.email-form-wrapper button[type="submit"],
.email-form-wrapper input[type="submit"] {
	background: var(--color-accent) url("images/overlay.png");
	border: none;
	color: #1e1e1e;
	font-family: 'League Spartan', sans-serif;
	font-weight: 800;
	font-size: 0.85em;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 0.83em 1.6em 0.67em;
	border-radius: 3px;
	cursor: pointer;
	transition: background 0.2s ease;
	white-space: nowrap;
}

.email-form-wrapper button[type="submit"]:hover:not(:disabled),
.email-form-wrapper input[type="submit"]:hover {
	background: var(--color-accent-dark) url("images/overlay.png");
}

.email-form-wrapper button[type="submit"]:disabled {
	background: #c0c0c0;
	cursor: not-allowed;
	color: #1e1e1e;
}

.email-note {
	margin-top: 1em;
	font-size: 0.8em;
	color: var(--color-text-muted);
}

@media screen and (max-width: 480px) {
	.email-form-wrapper form {
		flex-direction: column;
	}
}

.wrapper.style-accent {
	background: var(--color-accent);
	padding-bottom: 2.5em !important;
}

.wrapper.style-accent .title {
	background: var(--color-accent);
	color: #1e1e1e;
}

#social h1, #social h2, #social h3,
#social strong, #social b {
	color: #1e1e1e;
}

.footer-social {
	display: flex;
	justify-content: center;
	gap: 1.5em;
	margin-bottom: 2.5em;
}

.social-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.4em;
	background: #1e1e1e url("images/overlay.png");
	color: var(--color-text);
	text-decoration: none;
	padding: 1.4em 1.6em;
	border-radius: 3px;
	width: 16em;
	transition: background 0.2s ease;
}

.social-card:hover {
	background: #2a2a2a url("images/overlay.png");
	text-decoration: none;
	color: var(--color-text);
}

.social-card i {
	font-size: 1.4em;
	margin-bottom: 0.2em;
	color: var(--color-accent);
}

.social-card .social-name {
	font-family: 'League Spartan', sans-serif;
	font-weight: 800;
	font-size: 1em;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--color-text);
}

.social-card .social-desc {
	font-family: 'League Spartan', sans-serif;
	font-size: 0.82em;
	line-height: 1.5;
	color: var(--color-text-muted);
}

#copyright {
	text-align: center;
	padding-top: 0 !important;
	margin-top: 0 !important;
	border-top: none !important;
}

#copyright ul {
	display: flex !important;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 0.3em;
	list-style: none;
	padding: 0 !important;
	margin: 0;
	box-shadow: none !important;
}

#copyright ul li {
	color: #1e1e1e;
	font-size: 0.8em;
	line-height: 1.2;
	opacity: 0.6;
	margin: 0;
	padding: 0;
}

#copyright a {
	color: #1e1e1e;
	text-decoration: none;
	transition: opacity 0.2s ease;
}

#copyright a:hover {
	opacity: 1;
	text-decoration: none;
}

#highlights {
	display: none;
}

#nav {
	display: none;
}

#titleBar,
#navPanel {
	display: none !important;
}

@media screen and (min-width: 1025px) and (max-width: 1366px) {

	#header,
	.homepage #header {
		background-size: 66.66% auto;
		background-position: center 2em;
	}

	#logo {
		margin-top: 2em;
		padding-top: 33.36%;
	}

	.header-bottom {
		padding: 3em 0 2.5em;
	}

}

@media screen and (min-width: 737px) and (max-width: 1024px) {

	#header,
	.homepage #header {
		background-size: 66.66% auto;
		background-position: center 2em;
	}

	#logo {
		margin-top: 2em;
		padding-top: 33.36%;
	}

	.header-bottom {
		padding: 3em 0 2.5em;
	}

}

@media screen and (max-width: 736px) {

	#header,
	.homepage #header {
		background-size: 66.66% auto;
		background-position: center 2em;
	}

	#logo {
		margin-top: 2em;
		padding-top: 33.36%;
	}

	.header-bottom {
		padding: 3em 0 2em;
	}

	.header-tagline {
		display: inline-block;
		max-width: 16em;
		word-wrap: break-word;
		line-height: 1.4;
		margin-bottom: 1.2em;
	}

	.email-form-wrapper {
		max-width: 100%;
		padding: 0 1.5em;
	}

	.email-form-wrapper form {
		flex-direction: column;
	}

	.email-form-wrapper input[type="email"] {
		width: 100%;
	}

	.email-form-wrapper button[type="submit"],
	.email-form-wrapper input[type="submit"] {
		width: 100%;
	}

}

/* ── Contact Form ──────────────────────────────────────────── */

.contact-main {
	font-size: 1em;
}

.contact-main .contact-subtitle {
	color: var(--color-text-muted);
	line-height: 1.65;
	margin: 0 0 3.5em;
	max-width: 36em;
}

.contact-form {
	max-width: 36em;
}

.contact-field {
	margin-bottom: 1.4em;
}

.contact-field label {
	display: block;
	font-family: 'League Spartan', sans-serif;
	font-size: 0.78em;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 0.55em;
}

.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form select,
.contact-form textarea {
	width: 100%;
	box-sizing: border-box;
	background: var(--color-bg-card);
	border: 1px solid var(--color-border);
	color: var(--color-text);
	padding: 0.75em 1em;
	font-family: 'League Spartan', sans-serif;
	font-size: 0.9em;
	border-radius: 3px;
	outline: none;
	transition: border-color 0.2s ease;
	-webkit-appearance: none;
	appearance: none;
}

.contact-form input[type="text"]::placeholder,
.contact-form input[type="email"]::placeholder,
.contact-form textarea::placeholder {
	color: var(--color-text-muted);
}

.contact-form input[type="text"]:focus,
.contact-form input[type="email"]:focus,
.contact-form select:focus,
.contact-form textarea:focus {
	border-color: var(--color-accent);
}

.contact-form select {
	cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23b8b8b8' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1em center;
	padding-right: 2.5em;
}

.contact-form select option {
	background: var(--color-bg-card);
	color: var(--color-text);
}

.contact-form textarea {
	resize: vertical;
	min-height: 10em;
	line-height: 1.5;
}

.contact-form .form-message {
	margin-bottom: 0.8em;
}

.contact-form button[type="submit"] {
	background: var(--color-accent);
	border: none;
	color: #1e1e1e;
	font-family: 'League Spartan', sans-serif;
	font-weight: 800;
	font-size: 0.85em;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 0.83em 2.5em 0.67em;
	border-radius: 3px;
	cursor: pointer;
	transition: background 0.2s ease;
}

.contact-form button[type="submit"]:hover:not(:disabled) {
	background: var(--color-accent-dark);
}

.contact-form button[type="submit"]:disabled {
	background: #c0c0c0;
	cursor: not-allowed;
	color: #1e1e1e;
}

@media screen and (max-width: 736px) {
	.contact-form button[type="submit"] {
		width: 100%;
	}
}
