/* Contact page skin — scoped under .drb-page-contact (tpl-contact.php).
   Redesigned 2026-10-12: intent-routed contact cards over the legacy
   v3 content dump. Depends on style.css for tokens, .wrap, .btn, and
   the global focus rules; reuses the press/speaking hero vocabulary.

   Contrast notes: gold appears only as decoration (card top rules) on
   cream — never text on light. Body copy on cream uses #1A1612 (charcoal,
   12.8:1); muted labels use --color-warm-gray (4.6:1 on cream). */

/* ── HERO ────────────────────────────────────────────── */

.drb-page-contact .contact-hero {
	background: var(--color-deep-teal);
	padding-block: var(--space-3xl) var(--space-2xl);
}

.drb-page-contact .contact-hero .breadcrumbs {
	color: var(--color-text-muted-on-dark);
	margin-bottom: var(--space-lg);
}

.drb-page-contact .contact-hero .breadcrumbs a,
.drb-page-contact .contact-hero .breadcrumbs .breadcrumbs__sep { color: var(--color-text-muted-on-dark); }
.drb-page-contact .contact-hero .breadcrumbs a:hover { color: var(--color-cream); }
.drb-page-contact .contact-hero .breadcrumbs [aria-current] { color: var(--color-cream); }

.drb-page-contact .contact-hero__overline {
	margin: 0 0 var(--space-md);
	font-size: var(--text-overline);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--color-warm-gold);
}

.drb-page-contact .contact-hero h1 {
	font-size: clamp(2.25rem, 1.7rem + 2vw, 3rem);
	color: var(--color-warm-white);
	max-width: 14em;
	text-wrap: balance;
	margin: 0 0 var(--space-md);
}

.drb-page-contact .contact-hero__lede {
	font-size: 1.0625rem;
	line-height: 1.75;
	color: var(--color-text-muted-on-dark);
	max-width: 560px;
	margin: 0;
}

.drb-page-contact .contact-hero :focus-visible { outline-color: var(--color-focus-on-dark); }

/* ── INTENT CARDS ────────────────────────────────────── */

.drb-page-contact .contact-section { padding-block: var(--space-4xl); }

.drb-page-contact .contact-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-lg);
}

.drb-page-contact .contact-card {
	background: var(--color-warm-white);
	border: 1px solid var(--color-soft-taupe);
	border-top: 3px solid var(--color-warm-gold);
	border-radius: var(--radius-lg);
	padding: var(--space-xl);
	box-shadow: var(--shadow-subtle);
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
}

.drb-page-contact .contact-card__overline {
	margin: 0 0 var(--space-xs);
	font-size: var(--text-overline);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--color-forest-teal);
}

.drb-page-contact .contact-card h3 {
	font-size: 1.25rem;
	margin: 0 0 var(--space-xs);
}

.drb-page-contact .contact-card p {
	font-size: var(--text-caption);
	color: var(--color-warm-gray);
	line-height: 1.65;
	margin: 0;
}

.drb-page-contact .contact-card__mail {
	font-family: var(--font-headline);
	font-weight: 700;
	font-size: 1.0625rem;
	color: var(--color-forest-teal);
	text-decoration: none;
	overflow-wrap: anywhere;
	margin-top: var(--space-xs);
}

.drb-page-contact .contact-card__mail:hover { color: var(--color-deep-teal); text-decoration: underline; }

.drb-page-contact .contact-card__phone {
	display: block;
	font-size: var(--text-caption);
	font-weight: 600;
	color: var(--color-forest-teal);
	text-decoration: none;
}

.drb-page-contact .contact-card__phone:hover { text-decoration: underline; }

.drb-page-contact .contact-card__links {
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
	margin-top: var(--space-xs);
}

.drb-page-contact .contact-card__links a {
	font-size: var(--text-caption);
	font-weight: 600;
	color: var(--color-forest-teal);
	text-decoration: none;
}

.drb-page-contact .contact-card__links a:hover { text-decoration: underline; }

.drb-page-contact .contact-card__urgent {
	margin-top: var(--space-sm);
	padding: var(--space-sm) var(--space-md);
	background: var(--color-cream);
	border-left: 3px solid var(--color-warm-gold);
	border-radius: var(--radius-sm);
	font-size: var(--text-caption);
	color: var(--color-deep-charcoal);
}

/* ── DETAILS BAND ────────────────────────────────────── */

.drb-page-contact .contact-section--cream { background: var(--color-cream); }

.drb-page-contact .contact-section--cream > .wrap > h2 {
	font-size: var(--text-h2);
	margin: 0 0 var(--space-2xl);
}

.drb-page-contact .contact-details {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: var(--space-3xl);
	align-items: start;
}

.drb-page-contact .contact-details__label {
	margin: 0 0 var(--space-sm);
	font-size: var(--text-overline);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--color-warm-gray);
}

.drb-page-contact .contact-details__address {
	font-style: normal;
	font-size: 1rem;
	line-height: 1.8;
	color: var(--color-deep-charcoal);
}

.drb-page-contact .contact-socials {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-sm);
	margin: 0 0 var(--space-lg);
	padding: 0;
}

.drb-page-contact .contact-socials a {
	display: inline-block;
	padding: 0.5rem 0.875rem;
	border: 1.5px solid var(--color-forest-teal);
	border-radius: var(--radius-sm);
	font-size: var(--text-caption);
	font-weight: 600;
	color: var(--color-forest-teal);
	text-decoration: none;
	transition: background 200ms ease, color 200ms ease;
}

.drb-page-contact .contact-socials a:hover {
	background: var(--color-forest-teal);
	color: var(--color-cream);
	text-decoration: none;
}

.drb-page-contact .contact-details__note {
	font-size: var(--text-caption);
	color: var(--color-warm-gray);
	margin: 0;
}

.drb-page-contact .contact-details__note a { color: var(--color-forest-teal); }

/* ── RESPONSIVE ──────────────────────────────────────── */

@media (max-width: 1024px) {
	.drb-page-contact .contact-grid { grid-template-columns: 1fr; }
	.drb-page-contact .contact-details { grid-template-columns: 1fr; gap: var(--space-xl); }
}