/**
 * Titan Boston - real links for cards and contact blurbs.
 *
 * WHY THIS FILE EXISTS
 * Divi 5's Module Link URL renders a <div> with a JavaScript click
 * handler, not an <a>. Search engines don't follow it and keyboard
 * users can't reach it. Those module links were replaced (24 Oct 2026)
 * with real <a> links inside the module text, using two classes:
 *
 *   .titan-card-link     - on the heading link inside a service card.
 *                          Its ::after stretches over the whole card,
 *                          so the card stays clickable anywhere.
 *   .titan-contact-link  - on email / phone / address links in contact
 *                          blurbs (header, footer, Contact page). Same
 *                          stretch over the blurb, so the icon is
 *                          clickable too.
 *
 * Colours reference global colour tokens only - no hex values.
 * Requires :has() for the whole-card area; without it the heading
 * link itself still works.
 */

/* ---------- Service cards ---------------------------------------- */

/* The card (column) becomes the box the link stretches over. The crimson
   wipe from titan-service-card.css moves behind content via isolation,
   so the modules no longer need their own positioning - which would
   otherwise trap the stretched link inside the heading. */
.titan-service-card:has(.titan-card-link) {
	position: relative;
	isolation: isolate;
}

.titan-service-card:has(.titan-card-link)::before {
	z-index: -1;
}

.titan-service-card:has(.titan-card-link) .et_pb_module,
.titan-service-card:has(.titan-card-link) .et_pb_text_inner {
	position: static;
}

/* Heading keeps its preset look. */
.titan-card-link,
.titan-card-link:hover {
	color: inherit;
	text-decoration: none;
}

.titan-card-link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* Keyboard focus outlines the whole card, not just the heading. */
.titan-card-link:focus-visible {
	outline: none;
}

.titan-service-card:has(.titan-card-link:focus-visible) {
	outline: 2px solid var(--gcid-2bb8a513-465e-4f74-9d35-e2947186ec89); /* Titan Crimson */
	outline-offset: 3px;
}

/* ---------- Contact blurbs --------------------------------------- */

.et_pb_blurb:has(.titan-contact-link) {
	position: relative;
}

/* Divi positions these inner wrappers in some blurb layouts (icon left),
   which would trap the stretched link inside the text column. */
.et_pb_blurb:has(.titan-contact-link) .et_pb_blurb_content,
.et_pb_blurb:has(.titan-contact-link) .et_pb_blurb_content .et_pb_blurb_container {
	position: static;
}

/* Resting state matches the old plain text. Hover and focus use the
   footer link geometry: 2px Crimson underline at 4px offset. */
.titan-contact-link {
	color: inherit;
	text-decoration: none;
	text-underline-offset: 4px;
	transition: text-decoration-color 180ms ease;
}

.titan-contact-link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 3; /* above animated blurb icons, which get their own layer */
}

.titan-contact-link:hover,
.titan-contact-link:focus-visible {
	color: inherit;
	text-decoration: underline;
	text-decoration-color: var(--gcid-2bb8a513-465e-4f74-9d35-e2947186ec89); /* Titan Crimson */
	text-decoration-thickness: 2px;
}

.titan-contact-link:focus-visible {
	outline: 2px solid var(--gcid-2bb8a513-465e-4f74-9d35-e2947186ec89);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {

	.titan-contact-link {
		transition: none;
	}
}
