/* =======================================================================
 * /team-building/ (post 28). MANUAL-48, 2026-09-12.
 *
 * This page has never joined the redesign. Its header, nav, footer and
 * gift strip already load the shared myth-* components (confirmed live,
 * untouched by this task); its own main content is raw pre-rebuild Divi,
 * on the retired eyebrow gold `rgb(234, 177, 106)` (css/myth-bands.css's
 * own "THE SHARED EYEBROW ATOM IS RETIRED" note) and, on the two
 * body-content sections, no background at all, a real live contrast bug
 * (Gold on White measures 1.91:1, confirmed below).
 *
 * NO NEW SECTION, MODULE OR COPY ANYWHERE. Every rule here is a
 * font-family, colour or background-image change on markup that already
 * exists, matched to a class added to that section's own Divi "CSS
 * Class" field. This file follows the same per-page pattern as
 * css/myth-events.css and css/myth-booking.css: a dated, reasoned
 * comment above each rule.
 *
 * A KNOWN DISCREPANCY, disclosed rather than silently resolved either
 * way: the task brief names three body-content sections
 * ("et_pb_section_1, _2, _3"). Confirmed live and against the post's own
 * post_content, there are only two: `et_pb_section_1` ("Well, as opposed
 * to...what?" and "In Mythologic Escape Rooms,") and `et_pb_section_2`
 * ("Team building for companies", "In an office environment...", "Team
 * building for schools", and the closing CTA paragraph and button, all
 * three rows of one section). `et_pb_section_3` is the gift strip
 * (`[myth_gift_band]`), already correct and out of scope. Between them,
 * `et_pb_section_1` and `et_pb_section_2` already contain every string
 * the brief names, so scoping the new class to both real sections gives
 * full coverage of the described defect; no content is left unstyled and
 * nothing beyond these two sections is touched.
 *
 * A PRE-EXISTING SEO DEFECT, NOT FIXED HERE (out of this task's scope,
 * font-family/colour/background only): the hero renders its three lines
 * as three separate `<h1>` tags, and "Team building for companies" /
 * "Team building for schools" carry no heading level below the hero at
 * all (both are `<h2>` today, confirmed live, so the real defect is the
 * hero's multiple H1s, not a missing heading). Multiple H1s on one page
 * is a real, pre-existing on-page SEO issue. Flagged here, not
 * restructured: the task's own instruction is explicit that heading
 * tags and page structure stay exactly as they are.
 *
 * `!important` IS USED ONCE IN THIS FILE (section 1's own scrim), an
 * explicit, documented exception: Divi already sets this exact section's
 * own `background-image` with `!important` in its own generated CSS, so
 * only another `!important` can win at all. Every other rule here needs
 * none.
 * ===================================================================== */

/* -----------------------------------------------------------------------
 * 1. The hero's three H1 lines and a scrim the task's own pre-flight
 *    sampling did not anticipate.
 *
 * Scoped class `myth-team-hero` added to the hero section in the Divi
 * builder (it carried none of its own). The background-IMAGE FILE itself
 * (`corporate-team-building-escape-rooms-handmade-mysteries-1.jpg`) is
 * untouched and never swapped, per the task's own instruction.
 *
 * Contrast measured against the REAL served crop, not the raw file
 * loosely eyeballed: `background-size: cover; background-position: 50%
 * 0%` (top, computed live) simulated at each breakpoint's true hero box
 * (Python PIL, WCAG relative-luminance formula, sampled from a clean
 * re-crop of the source file so anti-aliased text edges from a live
 * screenshot cannot contaminate the reading, the same correction this
 * session's own FAQ-background fix on /events/ already established).
 * Measured BEFORE any colour or overlay change, White text against the
 * brightest pixel anywhere behind any of the three heading lines (the
 * worst case for WHITE text is the brightest background pixel, not the
 * darkest): 1.00:1 at 390, 1.00:1 at 768, 1.03:1 at 1024, 1.04:1 at
 * 1440, all failing the 4.5:1 floor badly. This contradicts the task's
 * own pre-flight note ("near-black... upper-left quadrant"): that
 * sampling did not cover the third heading line's own full box, which at
 * every width reaches into the lit book/torch-beam in the lower-middle
 * of this photo (visually confirmed), a real, bright, several-pixel-wide
 * feature, not a compression artefact. Gold `rgb(234, 177, 106)` (the
 * pre-fix colour) measured even worse against the same brightest pixel,
 * around 1.0 to 1.1:1, confirming this bright patch was always a live
 * defect here and not something the colour change introduced.
 *
 * Fixed exactly as the task's own fallback instructs: a minimal dark
 * overlay layered into the existing `background-image` property (a
 * second, semi-transparent layer, the photo itself still the second
 * layer of the same property, never swapped or removed), not new
 * markup. Opacity is 60%, not invented: the same "60% black scrim"
 * figure this project already uses for a dark photo hero elsewhere
 * (css/myth-booking.css's own header comment, /gillingham/booking/ and
 * /maidstone/booking/). `!important` on the property is required and
 * documented as this file's one exception to the general rule against
 * it: Divi's own generated CSS already sets `background-image` on this
 * section with `!important`, at `div.et_pb_section.et_pb_section_0`,
 * (0,2,1) (confirmed live via `document.styleSheets`, not assumed), so
 * only another `!important` declaration of AT LEAST that specificity can
 * win. A first attempt at `.et_pb_section.myth-team-hero` (0,2,0) still
 * lost, confirmed live before shipping this version rather than assumed
 * fixed: two classes but no element type is one specificity slot short of
 * Divi's own selector. Rewritten as
 * `div.et_pb_section.myth-team-hero.et_pb_with_background`, (0,3,1),
 * using `et_pb_with_background`, a class Divi itself already puts on any
 * section carrying a background (confirmed present on this element),
 * not an invented hook, so it wins on specificity alone regardless of
 * source order, the same specificity-over-order lesson this session
 * already learned once on /events/ (MANUAL-45/46).
 *
 * Measured after, same method, same four widths, against the ACTUALLY
 * applied rule (confirmed live via computed style, not just the CSS file
 * text): White on the brightest background pixel behind any heading line
 * is 5.74:1 at 390, 5.74:1 at 768, 5.85:1 at 1024, 5.91:1 at 1440, all
 * clear of the 4.5:1 floor. (The figure repeats at 390/768 because the
 * image is HEIGHT-constrained under `cover` at both those widths, so the
 * full photo height, torch beam included, is visible at both, not
 * cropped differently between them.) --------------------------------- */
div.et_pb_section.myth-team-hero.et_pb_with_background {
  background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url("../../../uploads/2018/11/corporate-team-building-escape-rooms-handmade-mysteries-1.jpg") !important;
}

.myth-team-hero h1 {
  font-family: "Julius Sans One", sans-serif;
  font-weight: 500;
  color: #FFFFFF;
}

/* -----------------------------------------------------------------------
 * 2. The two body-content sections: background and H2 colour.
 *
 * Scoped class `myth-team-content` added to both `et_pb_section_1` and
 * `et_pb_section_2` in the Divi builder (see the file header's own note
 * on why two sections, not the three the brief named). Background recipe
 * copied verbatim from `.myth-room-glance` (css/myth-room.css), the
 * sitewide "Parchment" ground already reused on the homepage,
 * /gillingham/, /maidstone/ and every room page: same file, same colour,
 * same size and position, not a new texture.
 *
 * Contrast measured against the REAL rendered texture, not the flat
 * `#FFFFFF` base colour alone: `background-size: cover;
 * background-position: center` simulated at each section's own true box
 * per width (Python PIL, WCAG formula, sampled from a clean re-crop of
 * the source file, the same anti-aliasing-safe method the hero fix above
 * uses, since a live screenshot's own text-edge pixels were first found
 * to give a false, much darker "worst case", 2.0:1 to 2.1:1, purely from
 * partially-blended glyph-edge pixels slipping past a naive brightness
 * filter). Worst case across all four H2s at all four widths: Ink
 * `#1C1310` on this texture is 11.83:1 to 13.95:1, comfortably clear of
 * the 4.5:1 floor everywhere (this texture has no dark corner the way
 * `bg-1-scaled.jpg` did on /events/; confirmed by eye and by this
 * measurement, not assumed). Before this fix, Gold `rgb(234, 177, 106)`
 * direct on the page's plain white measured 1.91:1 (WCAG formula, flat
 * colour, no texture existed before this task), failing the 4.5:1 floor
 * badly, exactly as expected for a known-bad gold-on-white pairing.
 *
 * `.myth-team-content p` is deliberately NOT declared: every paragraph on
 * this page already computes Karma, weight 500, `rgb(51,51,51)`, the
 * sitewide standard, confirmed live before this task started. Measured
 * again after the background change, same clean-crop method, since body
 * text now sits on a different, textured ground than before: worst case
 * 8.22:1 to 9.35:1 across all four widths, comfortably clear.
 * --------------------------------------------------------------------- */
.myth-team-content {
  background-color: #FFFFFF;
  background-image: url("../../../uploads/2022/09/main-content-bg.jpg");
  background-size: cover;
  background-position: center;
}

.myth-team-content h2 {
  font-family: "Julius Sans One", sans-serif;
  font-weight: 500;
  color: #1C1310;
}