/* Contact page template (page-templates/template-contact.php) */

/* ---------- 1. Emergency band ---------- */
.nca-contact-emergency {
	background: var(--we-color-alert-soft);
	border-bottom: 1px solid color-mix(in srgb, var(--we-color-alert) 22%, var(--we-color-border));
	padding-block: clamp(32px, 5vw, 64px);
}
.nca-contact-emergency__grid { display: grid; gap: clamp(28px, 5vw, 72px); align-items: start; }
@media (min-width: 960px) { .nca-contact-emergency__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }

.nca-contact-emergency__label {
	display: flex; align-items: center; gap: 8px; margin: 0 0 var(--we-space-2);
	color: var(--we-color-alert); font-weight: 700; font-size: var(--we-font-size-sm);
}
.nca-contact-emergency__label .we-icon { width: 18px; height: 18px; }

/* The one bold element: the rescue number itself. */
.nca-contact-emergency__number {
	display: inline-block;
	font-family: var(--we-font-heading);
	font-weight: 700;
	font-size: clamp(1.875rem, 1.2rem + 2.8vw, 3.5rem);
	line-height: 1.05;
	letter-spacing: -0.01em;
	color: var(--we-color-heading);
	text-decoration: none;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.nca-contact-emergency__number:hover { color: var(--we-color-alert); text-decoration: none; }
.nca-contact-emergency__meta { margin: var(--we-space-2) 0 var(--we-space-5); color: var(--we-color-muted); }

.nca-contact-emergency__steps-title { font-size: 1.25rem; margin-bottom: var(--we-space-4); }
.nca-steps { list-style: none; counter-reset: nca-step; margin: 0; padding: 0; display: grid; gap: var(--we-space-3); }
.nca-steps li {
	counter-increment: nca-step;
	position: relative;
	padding: 2px 0 0 48px;
	min-height: 34px;
}
.nca-steps li::before {
	content: counter(nca-step);
	position: absolute; left: 0; top: 0;
	display: grid; place-items: center;
	width: 32px; height: 32px; border-radius: 50%;
	background: var(--we-color-card);
	border: 1px solid color-mix(in srgb, var(--we-color-alert) 35%, var(--we-color-border));
	color: var(--we-color-alert);
	font-weight: 700; font-size: 0.9375rem;
}

/* ---------- 2. Other ways (row with dividers, not cards) ---------- */
.nca-ways { margin: var(--we-space-5) 0 0; display: grid; gap: 0; border-top: 1px solid var(--we-color-border); }
@media (min-width: 900px) { .nca-ways { grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 0; } }
.nca-ways__item { padding: var(--we-space-5) 0; border-bottom: 1px solid var(--we-color-border); }
@media (min-width: 900px) {
	.nca-ways__item { padding: var(--we-space-2) var(--we-space-6); border-bottom: 0; border-left: 1px solid var(--we-color-border); }
	.nca-ways__item:first-child { padding-left: 0; border-left: 0; }
}
.nca-ways dt { display: flex; align-items: center; gap: 8px; font-size: var(--we-font-size-sm); font-weight: 600; color: var(--we-color-muted); margin-bottom: var(--we-space-2); }
.nca-ways dt .we-icon { width: 18px; height: 18px; color: var(--we-color-primary); }
.nca-ways dd { margin: 0; display: grid; gap: 4px; }
.nca-ways__value { font-size: 1.125rem; color: var(--we-color-heading); font-weight: 600; overflow-wrap: anywhere; }
a.nca-ways__value { text-decoration: none; }
a.nca-ways__value:hover { text-decoration: underline; color: var(--we-color-link); }
.nca-ways__note { font-size: var(--we-font-size-sm); color: var(--we-color-muted); }

/* ---------- 3. Official contacts ---------- */
.nca-people { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--we-space-3); grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
.nca-people__item { display: flex; gap: var(--we-space-4); align-items: center; padding: var(--we-space-4); background: var(--we-color-card); border: 1px solid var(--we-color-border); border-radius: var(--we-radius); }
.nca-people__photo { flex: none; width: 64px; height: 64px; border-radius: 50%; overflow: hidden; background: var(--we-color-surface); }
.nca-people__photo img, .nca-people__photo .nca-media-placeholder { width: 100%; height: 100%; min-height: 0; object-fit: cover; display: block; }
.nca-people__photo .nca-media-placeholder { display: grid; }
.nca-people__photo .nca-media-placeholder .we-icon { width: 28px; height: 28px; }
.nca-people__text { display: grid; gap: 2px; min-width: 0; }
.nca-people__name { color: var(--we-color-heading); }
.nca-people__role { font-size: var(--we-font-size-sm); color: var(--we-color-muted); }
.nca-people__phone { white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; font-weight: 600; text-decoration: none; font-variant-numeric: tabular-nums; }
.nca-people__phone .we-icon { width: 16px; height: 16px; }
.nca-people__phone:hover span:first-of-type { text-decoration: underline; }

/* ---------- 4. Form + side ---------- */
.nca-contact-main__grid { display: grid; gap: var(--we-space-7); }
@media (min-width: 960px) { .nca-contact-main__grid { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: start; } }
.nca-contact__form { padding: clamp(20px, 3vw, 36px); }
.nca-contact__form > h2 { margin-bottom: var(--we-space-2); }
.nca-contact__form > .we-notice { margin: var(--we-space-4) 0; }
.nca-form { margin-top: var(--we-space-5); position: relative; }
.nca-form__row { display: grid; gap: var(--we-space-4); }
@media (min-width: 640px) { .nca-form__row { grid-template-columns: 1fr 1fr; } }

.nca-contact-side { display: grid; gap: var(--we-space-6); }
.nca-contact-side__block { display: grid; gap: var(--we-space-3); }
.nca-contact-side__title { font-size: 1.0625rem; margin: 0; }
.nca-link-row { display: flex; gap: var(--we-space-4); align-items: flex-start; padding: var(--we-space-4); border: 1px solid var(--we-color-border); border-radius: var(--we-radius); background: var(--we-color-card); text-decoration: none; color: var(--we-color-text); transition: border-color var(--we-transition); }
.nca-link-row:hover { border-color: var(--we-color-primary); color: var(--we-color-text); text-decoration: none; }
.nca-link-row > span:last-child { display: grid; gap: 2px; }
.nca-link-row strong { color: var(--we-color-heading); }
.nca-link-row:hover strong { text-decoration: underline; }
.nca-link-row > span:last-child > span { font-size: var(--we-font-size-sm); color: var(--we-color-muted); }
.nca-contact-side__volunteer { padding-top: var(--we-space-5); border-top: 1px solid var(--we-color-border); }
.nca-contact-side__volunteer p { margin: 0; color: var(--we-color-muted); }

/* ---------- 5. Map ---------- */
.nca-contact-map { padding-bottom: var(--we-section-space); }
.nca-contact-map iframe { width: 100%; height: 380px; border: 0; border-radius: var(--we-radius); display: block; }