/* Aerials Norfolk - component layer for the Norfolk Field Green design.
   Classes here are applied to native blocks via the Additional CSS Class field,
   so every section stays visually editable in the block editor. */

:root {
	--anf-ink: #142E3B;
	--anf-muted: #56666D;
	--anf-accent: #255D48;
	--anf-accent-dark: #194834;
	--anf-wash: #F3F6F3;
	--anf-quiet: #FAFBF9;
	--anf-line: #DCE3DF;
	--anf-tile: #E8EEE9;
	--anf-field: #BCC9BF;
	--anf-danger: #8A2A1F;
}

body { -webkit-font-smoothing: antialiased; }

/* ---------- Small shared type roles ---------- */

.anf-eyebrow {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--anf-accent);
	margin: 0 0 4px;
}

.anf-lede { max-width: 64ch; }
.anf-measure { max-width: 62ch; }

.anf-note {
	font-size: 0.8125rem;
	color: var(--anf-muted);
}

.anf-quiet-link a { color: var(--anf-ink); text-decoration: none; font-weight: 600; }
.anf-quiet-link a:hover { text-decoration: underline; }

/* ---------- Image placeholders ---------- */

.anf-ph {
	position: relative;
	background: var(--anf-tile);
	border: 1px solid #D9E2DB;
	border-radius: 8px;
	min-height: 330px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 48px 24px;
	overflow: hidden;
}

.anf-ph::before {
	content: "";
	position: absolute;
	inset: 22px;
	border: 1px solid rgba(37, 93, 72, .13);
	border-radius: 3px;
	pointer-events: none;
}

.anf-ph::after {
	content: "";
	order: -1;
	width: 42px;
	height: 42px;
	margin-bottom: 14px;
	opacity: .7;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2363766a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='8' cy='8' r='1.5'/%3E%3Cpath d='m3 17 6-6 4 4 3-3 5 5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.anf-ph p {
	position: relative;
	z-index: 1;
	margin: 0;
	color: #63766A;
	font-size: 0.9375rem;
}

.anf-ph .anf-ph-note {
	font-size: 0.625rem;
	letter-spacing: .09em;
	text-transform: uppercase;
	margin-top: 8px;
}

.anf-ph--hero { min-height: 470px; }
.anf-ph--short { min-height: 215px; padding: 30px 20px; }
.anf-ph--short p { font-size: 0.75rem; }
.anf-ph--short .anf-ph-note { font-size: 0.5625rem; }

.anf-ph--map {
	min-height: 350px;
	background-color: #EDF1ED;
	background-image: linear-gradient(#DCE4DD 1px, transparent 1px), linear-gradient(90deg, #DCE4DD 1px, transparent 1px);
	background-size: 36px 36px;
}

.anf-ph--map::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2363766a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 6 6-3 6 3 6-3v15l-6 3-6-3-6 3V6Zm6-3v15m6-12v15'/%3E%3C/svg%3E");
}

.anf-ph--map p {
	background: #EDF1ED;
	border: 1px solid var(--anf-line);
	border-radius: 4px;
	padding: 14px 18px;
}

.anf-ph--map .anf-ph-note { background: none; border: 0; padding: 8px 0 0; }

/* ---------- Cards, quotes, steps ---------- */

.anf-card {
	background: #FFFFFF;
	border: 1px solid var(--anf-line);
	border-radius: 8px;
	padding: 30px;
}

.anf-card h3 { margin-top: 0; }

.anf-card .anf-icon {
	width: 48px;
	height: 48px;
	border-radius: 6px;
	background: var(--anf-wash) center / 22px 22px no-repeat;
	margin-bottom: 24px;
}

.anf-icon--aerial { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23255d48' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22V2M4 5h16M6 9h12M8 13h8M9 22h6'/%3E%3C/svg%3E"); }
.anf-icon--satellite { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23255d48' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4a14 14 0 0 0 16 16L4 4ZM12 12l7-7M18 3h3v3M11 19l-2 3h9'/%3E%3C/svg%3E"); }
.anf-icon--mount { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23255d48' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='3' width='20' height='14' rx='2'/%3E%3Cpath d='M8 21h8m-4-4v4'/%3E%3C/svg%3E"); }

.anf-quote {
	background: var(--anf-quiet);
	border: 1px solid var(--anf-line);
	border-radius: 8px;
	padding: 28px 30px;
	display: flex;
	flex-direction: column;
}

.anf-quote::before {
	content: "\201C";
	display: block;
	font-family: Georgia, "Times New Roman", serif;
	color: var(--anf-accent);
	font-size: 50px;
	line-height: 1;
	height: 40px;
}

.anf-quote .anf-quote-meta {
	margin-top: auto;
	padding-top: 22px;
	font-size: 0.6875rem;
	color: var(--anf-muted);
}

.anf-step {
	border-top: 1px solid var(--anf-line);
	padding-top: 24px;
}

.anf-step-num {
	font-size: 0.8125rem;
	font-weight: 700;
	color: var(--anf-accent);
	margin: 0 0 18px;
}

/* ---------- Link tiles ---------- */

.anf-tiles p { margin: 0; }

.anf-tiles a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 18px 19px;
	background: #FFFFFF;
	border: 1px solid var(--anf-line);
	border-radius: 4px;
	color: var(--anf-ink);
	font-size: 0.9375rem;
	font-weight: 700;
	text-decoration: none;
}

.anf-tiles a::after { content: "\2197"; color: var(--anf-accent); }
.anf-tiles a:hover { border-color: var(--anf-accent); }

/* ---------- Trust strip and detail pairs ---------- */

.anf-trust { border-top: 1px solid var(--anf-line); padding-top: 24px; }
.anf-trust p { margin: 0; font-size: 0.8125rem; }
.anf-trust .anf-trust-name { font-size: 0.9375rem; font-weight: 700; color: var(--anf-ink); margin-bottom: 2px; }

.anf-detail-label {
	font-size: 0.6875rem;
	text-transform: uppercase;
	letter-spacing: .1em;
	color: var(--anf-muted);
	margin: 0 0 4px;
}

.anf-detail-value {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--anf-ink);
	margin: 0;
}

/* ---------- Lists, scope notes, jump links ---------- */

.anf-check { list-style: none; padding-left: 0; }

.anf-check li {
	position: relative;
	padding-left: 25px;
	margin: 10px 0;
	font-size: 0.9375rem;
}

.anf-check li::before { content: "\2713"; position: absolute; left: 0; color: var(--anf-accent); }

.anf-scope {
	border: 1px dashed #BDC9C0;
	border-radius: 5px;
	padding: 18px;
	font-size: 0.8125rem;
	color: var(--anf-muted);
}

.anf-jump .wp-block-button__link {
	background: #FFFFFF;
	border-color: var(--anf-line);
	color: var(--anf-ink);
	font-weight: 400;
	font-size: 0.8125rem;
	padding: 10px 15px;
}

.anf-jump .wp-block-button__link:hover {
	background: var(--anf-wash);
	border-color: var(--anf-accent);
	color: var(--anf-ink);
}

/* ---------- FAQ (core/details) ---------- */

.anf-faq .wp-block-details {
	border-bottom: 1px solid var(--anf-line);
	margin: 0;
	padding: 0;
}

.anf-faq .wp-block-details:first-child { border-top: 1px solid var(--anf-line); }

.anf-faq .wp-block-details summary {
	position: relative;
	list-style: none;
	cursor: pointer;
	padding: 22px 40px 22px 0;
	font-family: var(--wp--preset--font-family--manrope, Manrope, sans-serif);
	font-size: 1.0625rem;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--anf-ink);
}

.anf-faq .wp-block-details summary::-webkit-details-marker { display: none; }
.anf-faq .wp-block-details summary::marker { content: ""; }

.anf-faq .wp-block-details summary::after {
	content: "+";
	position: absolute;
	right: 6px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 1.5rem;
	line-height: 1;
	color: var(--anf-accent);
}

.anf-faq .wp-block-details[open] summary::after { content: "\2212"; }
.anf-faq .wp-block-details p { margin-top: 0; padding-bottom: 22px; }

/* ---------- Header ---------- */

.anf-header {
	position: sticky;
	top: 0;
	z-index: 20;
	background: rgba(255, 255, 255, .97);
	border-bottom: 1px solid var(--anf-line);
}

.anf-brand p { margin: 0; }
.anf-brand a { text-decoration: none; }

.anf-brand-name {
	font-family: var(--wp--preset--font-family--manrope, Manrope, sans-serif);
	font-size: 1.25rem;
	font-weight: 800;
	letter-spacing: -0.045em;
	line-height: 1.1;
	color: var(--anf-ink);
}

.anf-brand-sub {
	font-size: 0.625rem;
	letter-spacing: .055em;
	color: var(--anf-muted);
	margin-top: 7px;
}

.anf-header .wp-block-navigation a { text-decoration: none; color: var(--anf-muted); }
.anf-header .wp-block-navigation a:hover { color: var(--anf-ink); }
.anf-header .wp-block-navigation .current-menu-item a { color: var(--anf-ink); }

.anf-header .anf-call .wp-block-button__link {
	font-size: 0.75rem;
	padding: 11px 15px;
	white-space: nowrap;
}

/* Phone glyph on call buttons */
.anf-call .wp-block-button__link::before {
	content: "";
	display: inline-block;
	vertical-align: -2px;
	width: 15px;
	height: 15px;
	margin-right: 9px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3H4a1 1 0 0 0-1 1c0 9.4 7.6 17 17 17a1 1 0 0 0 1-1v-3l-5-2-2 2a14 14 0 0 1-7-7l2-2-2-5Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.anf-call.is-style-outline .wp-block-button__link::before,
.anf-band .anf-call.is-style-outline .wp-block-button__link::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23142e3b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3H4a1 1 0 0 0-1 1c0 9.4 7.6 17 17 17a1 1 0 0 0 1-1v-3l-5-2-2 2a14 14 0 0 1-7-7l2-2-2-5Z'/%3E%3C/svg%3E");
}

/* ---------- Secondary buttons ---------- */

.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	border: 1px solid #BECBC3;
	color: var(--anf-ink);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: #E8EEEA;
	border-color: #BECBC3;
	color: var(--anf-ink);
}

/* ---------- Dark closing band ---------- */

.anf-band { color: #FFFFFF; }
.anf-band h2, .anf-band p { color: #FFFFFF; }

.anf-band .wp-block-button.is-style-outline .wp-block-button__link {
	color: #FFFFFF;
	border-color: #788B92;
}

.anf-band .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: #304852;
	border-color: #788B92;
	color: #FFFFFF;
}

.anf-band .anf-call.is-style-outline .wp-block-button__link::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3H4a1 1 0 0 0-1 1c0 9.4 7.6 17 17 17a1 1 0 0 0 1-1v-3l-5-2-2 2a14 14 0 0 1-7-7l2-2-2-5Z'/%3E%3C/svg%3E");
}

/* ---------- Section rules ---------- */

.anf-ribbon {
	background: var(--anf-quiet);
	border-top: 1px solid var(--anf-line);
	border-bottom: 1px solid var(--anf-line);
}

.anf-ribbon p { margin: 0; }
.anf-ribbon .anf-ribbon-label { font-size: 0.75rem; font-weight: 700; color: var(--anf-ink); }

.anf-town { border-bottom: 1px solid var(--anf-line); }
.anf-page-hero { background: var(--anf-wash); border-bottom: 1px solid var(--anf-line); }

/* ---------- Footer ---------- */

.anf-footer .wp-block-navigation { font-size: 0.8125rem; font-weight: 400; }
.anf-footer .wp-block-navigation a { text-decoration: none; color: var(--anf-accent); }
.anf-footer .wp-block-navigation a:hover { text-decoration: underline; }
.anf-footer p { font-size: 0.8125rem; }
.anf-footer h3 { font-size: 0.875rem; letter-spacing: 0; margin-bottom: 14px; }
.anf-footer-bottom { border-top: 1px solid var(--anf-line); font-size: 0.6875rem; }
.anf-footer-bottom p { font-size: 0.6875rem; margin: 0; }

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

.anf-form {
	background: var(--anf-wash);
	border: 1px solid var(--anf-line);
	border-radius: 8px;
	padding: 32px;
}

.anf-form h2 { margin-top: 0; }
.anf-form .wpcf7 { margin-top: 22px; }

.anf-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 19px 16px;
}

.anf-grid .anf-full { grid-column: 1 / -1; }

.anf-form label {
	display: block;
	font-size: 0.8125rem;
	font-weight: 700;
	color: var(--anf-ink);
	margin-bottom: 8px;
}

.anf-form label .anf-opt {
	font-size: 0.6875rem;
	font-weight: 400;
	color: var(--anf-muted);
}

.anf-form input[type="text"],
.anf-form input[type="tel"],
.anf-form input[type="email"],
.anf-form select,
.anf-form textarea {
	width: 100%;
	min-width: 0;
	border: 1px solid var(--anf-field);
	border-radius: 4px;
	background: #FFFFFF;
	color: var(--anf-ink);
	padding: 12px;
	font-family: inherit;
	font-size: 1rem;
	line-height: 1.5;
	min-height: 49px;
}

.anf-form textarea { min-height: 110px; resize: vertical; }
.anf-form .wpcf7-form-control-wrap { display: block; }

.anf-form input[type="submit"] {
	width: 100%;
	margin-top: 24px;
	min-height: 51px;
	padding: 13px 20px;
	background: var(--anf-accent);
	border: 1px solid var(--anf-accent);
	border-radius: 4px;
	color: #FFFFFF;
	font-family: inherit;
	font-size: 0.875rem;
	font-weight: 700;
	cursor: pointer;
}

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

.anf-form .anf-form-note { font-size: 0.75rem; margin-top: 14px; }

.anf-form .wpcf7-not-valid-tip { color: var(--anf-danger); font-size: 0.75rem; margin-top: 6px; }
.anf-form .wpcf7-not-valid { border-color: var(--anf-danger); }

.anf-form .wpcf7 form .wpcf7-response-output {
	margin: 20px 0 0;
	padding: 16px;
	background: #FFFFFF;
	border: 0;
	border-left: 3px solid var(--anf-accent);
	font-size: 0.875rem;
	color: var(--anf-ink);
}

.anf-form .wpcf7 form.invalid .wpcf7-response-output,
.anf-form .wpcf7 form.unaccepted .wpcf7-response-output,
.anf-form .wpcf7 form.failed .wpcf7-response-output { border-left-color: var(--anf-danger); }

/* ---------- Sticky mobile contact bar ---------- */

.anf-mobile-bar { display: none; }

/* ---------- Focus ---------- */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
	outline: 3px solid var(--anf-accent);
	outline-offset: 4px;
}

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

@media (max-width: 900px) {
	.anf-header .wp-block-navigation { font-size: 0.75rem; }
}

@media (max-width: 820px) {
	.anf-ph--hero { min-height: 350px; }
	.anf-ph { min-height: 290px; }

	.anf-mobile-bar {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		display: block;
		padding: 10px 20px calc(10px + env(safe-area-inset-bottom));
		background: #FFFFFF;
		border-top: 1px solid var(--anf-line);
		z-index: 30;
	}

	.anf-mobile-bar .wp-block-buttons { flex-wrap: nowrap; gap: 10px; }
	.anf-mobile-bar .wp-block-button { flex: 1 1 0; }

	.anf-mobile-bar .wp-block-button__link {
		width: 100%;
		padding: 12px 8px;
		min-height: 48px;
		font-size: 0.75rem;
		text-align: center;
	}

	body { padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
}

@media (max-width: 600px) {
	.anf-tiles .wp-block-columns { gap: 12px; }
	.anf-grid { grid-template-columns: 1fr; }
	.anf-grid .anf-full { grid-column: auto; }
	.anf-form { padding: 22px; }
	.anf-ph { min-height: 250px; padding: 36px 20px; }
}

/* ---------- Editor style aliases ----------
   The same three treatments are also registered as block styles, so a future
   editor can pick them from the Styles panel instead of typing a class. */

.wp-block-group.is-style-anf-card { background: #FFFFFF; border: 1px solid var(--anf-line); border-radius: 8px; padding: 30px; }
.wp-block-group.is-style-anf-card h3 { margin-top: 0; }

.wp-block-group.is-style-anf-quote { background: var(--anf-quiet); border: 1px solid var(--anf-line); border-radius: 8px; padding: 28px 30px; display: flex; flex-direction: column; }
.wp-block-group.is-style-anf-quote::before { content: "\201C"; display: block; font-family: Georgia, "Times New Roman", serif; color: var(--anf-accent); font-size: 50px; line-height: 1; height: 40px; }

.wp-block-group.is-style-anf-ph { position: relative; background: var(--anf-tile); border: 1px solid #D9E2DB; border-radius: 8px; min-height: 330px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 48px 24px; overflow: hidden; }

/* ---------- Ink overrides ----------
   Body paragraphs are muted by default in the global styles, so the few that
   carry ink are raised above that rule with an element+class selector. */

p.anf-brand-name { color: var(--anf-ink); }
p.anf-detail-value { color: var(--anf-ink); }
p.anf-trust-name { color: var(--anf-ink); }
p.anf-ribbon-label { color: var(--anf-ink); }
p.anf-eyebrow { color: var(--anf-accent); }
.anf-band p.anf-band-text { color: #FFFFFF; }
.anf-tiles p a { color: var(--anf-ink); }
.anf-quiet-link p a, p.anf-quiet-link a { color: var(--anf-ink); }
.anf-ph p.anf-ph-note { color: #63766A; }
