/**
 * About Us page (post ID 110, slug "about-us").
 *
 * This page was never actually migrated off Elementor during this
 * project's earlier phases -- it had no page-about-us.php override, so
 * WordPress fell through to the theme's default page.php, which calls
 * the_content() and rendered this post's raw _elementor_data as plain
 * unstyled HTML (Elementor/ElementsKit are deactivated sitewide, see
 * MIGRATION.md's "Elementor deactivation test" section) -- no
 * container/column CSS, no background video positioning, so the hero
 * image/video, heading, and icon links all rendered stacked on top of
 * each other with no layout at all. That's the "visibly broken and
 * overlapping" hero the client flagged. Rebuilt natively here, same
 * pattern as every other page.
 *
 * Real content (heading text, paragraph copy, the 6 capability labels,
 * CTA copy, all 16 portfolio photos) was recovered from the post's own
 * `_elementor_data` and the raw the_content() fallback HTML it was
 * already producing -- not invented. One typo fixed in the CTA
 * paragraph (a literal "\xEF\xBF\xBD" replacement-character byte where
 * an apostrophe should be, "Let{ }s create..." -- a pre-existing
 * database encoding corruption, not a content change).
 *
 * `.cwf-about-intro` (eyebrow + heading + paragraph, no video/image
 * side) is a one-off variant of the same eyebrow/heading/text pattern
 * template-parts/media-split.php already uses -- built fresh here
 * rather than stretching media-split.php to support a no-media mode,
 * since a full-width centered text block reads better than a
 * flex:1-of-one-child stretched-left column would. The 6-item
 * capability list right below it reuses template-parts/feature-row.php
 * as-is (no own eyebrow passed, since this section already has one).
 *
 * Icons for the 6 capability items are a deliberate improvement, not a
 * literal reproduction: the original Elementor icon-list widget
 * rendered the exact same camera-shaped SVG path for every single
 * item (an Elementor default icon that was never actually swapped per-
 * item) -- assigned distinct, semantically-fitting icons from
 * feature-row.php's existing set instead (drone for "Drone & Aerial
 * Cinematography", scissors for "Professional Editing & Color
 * Grading", etc.), the same call already made for Drone Cinematography's
 * "Flown Right" list.
 *
 * Simplified, not reproduced: the original also had a separate
 * ElementsKit "video popup" widget in the hero (a self-hosted
 * Drone-3.mp4 clip + a YouTube fallback link, opening in a lightbox
 * modal on click) -- omitted entirely. This theme has no lightbox/
 * modal-video component anywhere yet, and the hero's own real
 * background video (attachment 1438, matches the original's
 * `background_video_link` exactly) already delivers the same "video
 * plays behind the hero" effect without it. A judgment call, not an
 * oversight -- flag if the client wants a proper video-reel popup
 * built as its own component later.
 *
 * "See Our Work" (hero link), "View Work" and "Showcase More" (further
 * down) all originally pointed at /our-work/, which still 404s (that
 * page is parked/draft, per the client's long-standing decision, see
 * MIGRATION.md) -- repointed to the real Gallery page (/gallery/),
 * same fix already applied everywhere else this exact dead link was
 * found sitewide.
 *
 * Hero image/video/heading are ACF-editable (this page added to the
 * existing "Page Hero" field group's location rules, see
 * inc/acf-fields.php) -- everything else (intro copy, capability list,
 * CTA copy, portfolio images) is left structural/hardcoded, same
 * judgment call this theme already makes for other pages' one-off
 * marketing copy unlikely to change often.
 */

.cwf-about-intro {
	padding: 60px 56px;
	background: var(--color-black);
	text-align: center;
}
.cwf-about-intro .cwf-eyebrow {
	margin: 0 0 16px;
	font-family: var(--font-nav-submenu);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--color-primary);
}
.cwf-about-intro__heading {
	max-width: 800px;
	margin: 0 auto 20px;
	font-family: var(--font-nav-submenu); /* Montserrat -- matches the shared heading template used across every net-new-content section sitewide */
	font-size: clamp(28px, 3.5vw, 44px);
	font-weight: 700;
	text-transform: uppercase;
	line-height: 1.15;
	color: var(--color-white);
}
.cwf-about-intro__text {
	max-width: 800px;
	margin: 0 auto;
	font-family: var(--font-body);
	font-size: 18px;
	line-height: 1.6;
	color: var(--color-text);
}

/* "Showcase More" button below the portfolio carousel -- reuses
   gallery-carousel.css's .cwf-home-see-all/.cwf-split__btn classes
   (already sitewide, not page-scoped, see that file) rather than
   duplicating the same solid-gold-button styling here. */

@media (max-width: 767px) {
	.cwf-about-intro {
		padding: 40px 20px;
	}
	.cwf-about-intro__heading {
		font-size: clamp(22px, 6vw, 32px);
	}
}