/* ==========================================================================
   3rd Alarm Media — Modern Interior Pages (About, Contact, etc.)
   Shares the design language of the homepage: charcoal + fire red + amber,
   condensed display type, hazard-stripe accent — scaled down for a page hero.
   ========================================================================== */

:root {
	--tap-char:        #17181a;
	--tap-char-2:      #202226;
	--tap-red:         #c8102e;
	--tap-red-dark:    #970c22;
	--tap-amber:       #f2a900;
	--tap-cream:       #f7f4ee;
	--tap-gray:        #5b5f66;
	--tap-radius:      10px;
	--tap-shadow:      0 12px 30px -12px rgba(0,0,0,0.35);
	--tap-font-display:'Bebas Neue', 'Arial Narrow', sans-serif;
	--tap-font-body:   'Work Sans', -apple-system, sans-serif;
}

/* ---------- Page hero (compact) ---------- */

.tap-page-hero {
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	width: 100vw;
	background: linear-gradient(155deg, var(--tap-char) 0%, var(--tap-char-2) 60%, #2a1113 100%);
	color: var(--tap-cream);
	overflow: hidden;
	padding: 56px 24px 68px;
	box-sizing: border-box;
	text-align: center;
}

.tap-page-hero-inner {
	position: relative;
	z-index: 2;
}

.tap-page-eyebrow {
	font-family: var(--tap-font-body);
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-size: 12px;
	color: var(--tap-amber);
	margin: 0 0 10px;
}

.tap-page-title {
	font-family: var(--tap-font-display);
	font-weight: 400;
	letter-spacing: 0.01em;
	line-height: 1;
	font-size: clamp(34px, 6vw, 56px);
	margin: 0;
	color: #fff;
}

.tap-page-hero-stripe {
	position: absolute;
	bottom: -28px;
	left: -10%;
	width: 120%;
	height: 60px;
	background: repeating-linear-gradient(
		-35deg,
		var(--tap-amber) 0 22px,
		var(--tap-red) 22px 44px
	);
	transform: skewY(-2deg);
	opacity: 0.9;
	z-index: 1;
}

/* ---------- Page content ---------- */

.tap-page-content {
	max-width: 760px;
	margin: 0 auto;
	padding: 64px 24px 90px;
	font-family: var(--tap-font-body);
	color: #2a2a2a;
	line-height: 1.7;
}

.tap-page-content p.wp-block-paragraph {
	font-size: 17px;
	margin: 0 0 22px;
}

/* Bold lead-in lines used as pseudo section headings (e.g. "What do you do?") */
.tap-page-content p.wp-block-paragraph > strong:only-child {
	display: block;
	font-family: var(--tap-font-display);
	font-weight: 400;
	letter-spacing: 0.01em;
	font-size: 26px;
	color: var(--tap-char);
	margin-top: 40px;
	padding-top: 8px;
	border-top: 3px solid var(--tap-red);
}
.tap-page-content p.wp-block-paragraph:first-of-type > strong:only-child {
	margin-top: 0;
	border-top: none;
	padding-top: 0;
}

.tap-page-content a {
	color: var(--tap-red);
	font-weight: 600;
	text-decoration: none;
	border-bottom: 2px solid rgba(200,16,46,0.35);
}
.tap-page-content a:hover {
	color: var(--tap-red-dark);
	border-color: var(--tap-red-dark);
}

.tap-page-content .wp-block-image {
	margin: 32px auto;
	text-align: center;
}
.tap-page-content .wp-block-image img {
	border-radius: var(--tap-radius);
	box-shadow: var(--tap-shadow);
}
.tap-page-content .wp-block-image figcaption {
	font-size: 13px;
	color: var(--tap-gray);
	margin-top: 10px;
}

/* ---------- Contact Form 7 styling ---------- */

.tap-page-content .wpcf7-form {
	background: #fff;
	border: 1px solid #ecebe6;
	border-top: 4px solid var(--tap-red);
	border-radius: var(--tap-radius);
	box-shadow: var(--tap-shadow);
	padding: 32px 28px;
	margin: 24px 0 36px;
}

.tap-page-content .wpcf7-form p {
	margin: 0 0 18px;
	font-size: 15px;
	color: var(--tap-gray);
}

.tap-page-content .wpcf7-form label {
	display: block;
	font-weight: 600;
	color: var(--tap-char);
	margin-bottom: 6px;
}

.tap-page-content .wpcf7-form input[type="text"],
.tap-page-content .wpcf7-form input[type="email"],
.tap-page-content .wpcf7-form input[type="tel"],
.tap-page-content .wpcf7-form textarea {
	width: 100%;
	box-sizing: border-box;
	font-family: var(--tap-font-body);
	font-size: 15px;
	padding: 12px 14px;
	border: 1.5px solid #e0ddd4;
	border-radius: 6px;
	background: var(--tap-cream);
	transition: border-color 0.15s ease;
}
.tap-page-content .wpcf7-form input:focus,
.tap-page-content .wpcf7-form textarea:focus {
	outline: none;
	border-color: var(--tap-red);
	background: #fff;
}

.tap-page-content .wpcf7-form input[type="submit"] {
	font-family: var(--tap-font-body);
	font-weight: 700;
	font-size: 15px;
	letter-spacing: 0.03em;
	background: var(--tap-red);
	color: #fff;
	border: none;
	border-radius: 999px;
	padding: 14px 32px;
	cursor: pointer;
	transition: background 0.15s ease, transform 0.15s ease;
}
.tap-page-content .wpcf7-form input[type="submit"]:hover {
	background: var(--tap-red-dark);
	transform: translateY(-2px);
}

.tap-page-content .wpcf7-spinner {
	margin-left: 10px;
}

/* ---------- Responsive ---------- */

@media (max-width: 640px) {
	.tap-page-hero {
		padding: 48px 20px 56px;
	}
	.tap-page-content {
		padding: 48px 18px 64px;
	}
	.tap-page-content .wpcf7-form {
		padding: 24px 18px;
	}
}