/**
 * Closing CTA band — the full-bleed photo strip that ends the About page
 * ("Committed to Excellence").
 *
 * WHAT WAS WRONG
 *
 *  1. The phone number was plain text. On a phone — where a good share of this
 *     traffic reads it — a drilling company's number that cannot be tapped is a
 *     lost call. It is a `tel:` link now.
 *  2. Flat 70% black over the photograph. It dimmed the picture without giving
 *     the band any colour of its own, so the strongest call to action on the page
 *     was also its greyest element.
 *  3. The button was the default primary blue, on a dark blue-grey overlay. The
 *     homepage closing card already solved this: gold on dark, one filled button.
 *  4. No rule, no reveal — while every band above it has both.
 *
 * WHAT IT IS NOW
 *
 * The same diagonal dark → primary gradient family as the homepage closing card
 * and the careers band, laid over the photograph rather than instead of it, with
 * the shared section-title treatment (gold rule) and a gold button.
 *
 * COPY IS THE CLIENT'S, verbatim from the live site — this file styles it and
 * nothing else. The phone number becomes a tel: link wherever it appears, which
 * is a change of behaviour, not of wording.
 *
 * WRITTEN GENERICALLY (.pd-cta-band, not .pd-about-cta): the same band closes the
 * About, Services and both location pages, which all use it now. The Careers page
 * still carries the plain v1 markup — adding the classes there is a one-line
 * change whenever that page gets its own pass.
 */

/**
 * Gradient overlay.
 *
 * SPECIFICITY / OPACITY: core emits `.has-background-dim-70 { opacity: 0.7 }` at
 * (0,1,0) and `.has-dark-background-color { background-color: … !important }`.
 * The opacity is overridden here rather than worked around — a 0.7 layer would
 * multiply every alpha below and make the stops unpredictable. Opacity goes back
 * to 1 and the transparency lives in the rgba stops, where it can be tuned
 * directly. The !important background-color survives underneath as a fallback if
 * the gradient is ever unsupported.
 *
 * CONTRAST: every stop is more opaque than the 0.70 flat dim it replaces, so the
 * white text sits on a strictly darker backdrop than it did before — the gradient
 * is a visual change, not a legibility trade. The lightest stop is the one to
 * watch if this band is ever pointed at a brighter photograph; 0.88 is as
 * transparent as it should get.
 */
.pd-cta-band > .wp-block-cover__background {
	opacity: 1;
	background-image: linear-gradient(
		135deg,
		rgba( 36, 34, 45, 0.94 ) 0%,
		rgba( 35, 81, 122, 0.91 ) 55%,
		rgba( 43, 102, 153, 0.88 ) 100%
	);
}

/**
 * Title rule and lede come from sections.css; only the reveal staggering and the
 * dark-background adjustments belong here.
 *
 * THE HEADING CARRIES THE PHONE LINK on three of the four pages, because that is
 * how the live site writes it ("Call 619-294-3682 to get started."). A link inside
 * a heading inherits theme.json's primary blue, which is close to unreadable on
 * this gradient — hence the reset. Underlined rather than left bare so it still
 * reads as tappable, which the live site's plain text never did.
 */
.pd-cta-band h2 a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 4px;
	text-decoration-thickness: 2px;

	/* text-wrap:balance on the title will happily break the number at its hyphens
	   — "Call 619-294- / 3682 to get started." Never split a phone number. */
	white-space: nowrap;
}

.pd-cta-band .pd-section-lede {
	/* sections.css drops the lede to 0.82 opacity so the title leads. On a
	   photograph that lands too close to the background — lift it back. */
	opacity: 0.92;
}

.pd-cta-band .pd-cta-band__phone {
	margin: 1rem 0 0;
	text-align: center;
	font-size: 1rem;
	opacity: 0.9;
}

/**
 * Tag-qualified descendant at (0,1,1): theme.json emits
 * `:root :where(a:where(:not(.wp-element-button))) { color: primary }` at
 * (0,1,0), and primary blue on this gradient is close to unreadable.
 */
.pd-cta-band__phone a {
	color: var( --wp--preset--color--base );
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Stagger down the band, matching the pace used by the card grids. */
.pd-cta-band .pd-section-title { --pd-reveal-delay: 0ms; }
.pd-cta-band .pd-section-lede { --pd-reveal-delay: 90ms; }
.pd-cta-band .pd-cta-band__phone { --pd-reveal-delay: 180ms; }
.pd-cta-band .wp-block-buttons { --pd-reveal-delay: 260ms; }
