/**
 * Corrections to the public pages, measured before and after.
 *
 * WHY THIS IS IN A PLUGIN AND NOT IN DIVI
 * ---------------------------------------
 * These rules belong in Divi > Theme Options > Custom CSS, which is where
 * somebody editing this site would look for them. They are here instead
 * because that field could not be written to reliably from outside the
 * browser: Divi's options screen serialises from its own JS model rather than
 * from the textarea, so a value set programmatically is discarded on save.
 *
 * Moving them is a copy and paste, and if that happens this file should be
 * emptied rather than left to fight the theme. Two places setting the same
 * property is the problem this whole codebase keeps rediscovering.
 *
 * Every value below replaces one that was measured on the live page. The
 * measurement is named in each comment, so the next person can tell what was
 * wrong rather than guessing why the rule exists.
 *
 * @package MonsterRoster
 */

/*
 * ── Tap targets ───────────────────────────────────────────────────────────
 *
 * Measured at 37px tall on the homepage hero and 33px on the event cards.
 * The minimum is 44px, and these are the controls standing between a visitor
 * and a ticket -- the elements on the page that most need to be easy to hit
 * with a thumb, and they were the smallest.
 *
 * Padding rather than a display change: Divi's button line-height is 1.7em,
 * so 11px top and bottom reaches 48px without turning the element into a flex
 * box and displacing the arrow it slides in on hover.
 */
body #page-container .et_pb_button {
	min-height: 48px;
	padding: 11px 22px;
}

/*
 * ── The hero buttons are not here any more ────────────────────────────────
 *
 * They were: a darker red fill on Buy tickets, and a transparent fill on
 * Explore experiences to make it a ghost. Both are now Divi module settings
 * on the fullwidth header itself --
 *
 *   buttonTwo.decoration.background.desktop.value.color = #c81a1d
 *   buttonOne.decoration.background.desktop.value.color = rgba(0,0,0,0)
 *
 * -- which is where they belong, because they describe one module rather than
 * the site. The builder now shows what the page shows, and editing those
 * buttons will not fight a stylesheet.
 *
 * buttonOne already carried a 2px solid border, so the ghost treatment needed
 * nothing added: only the fill taken away.
 *
 * What is left in this file is the two rules that are genuinely site-wide. As
 * module settings those would be ten modules to keep in sync, which is the
 * maintenance problem inverted.
 */

/*
 * ── Leading ───────────────────────────────────────────────────────────────
 *
 * The homepage lede was 18px set on a 19.2px line: a ratio of 1.07, tighter
 * than single spacing, on the paragraph that explains what the company does.
 * The four column descriptions under it were 1.2. At 1.07 the descenders of
 * one line nearly meet the caps of the next.
 *
 * Headings are left alone: their tight set is a real choice and it suits the
 * brand.
 */
body #page-container .et_pb_text p,
body #page-container .et_pb_blurb_description p,
body #page-container .et_pb_fullwidth_header .header-content p,

/*
 * The hero's own lede is a span, not a paragraph.
 *
 * The first version of this rule listed only `p` and so did nothing to the
 * one line it was written for -- the sentence that says what the company
 * does. Measured 16px on a 19.2px line, and still 1.2 after the "fix".
 * Selectors that match nothing fail exactly as quietly as everything else in
 * this codebase.
 */
body #page-container .et_pb_fullwidth_header .et_pb_fullwidth_header_subhead {
	line-height: 1.55;
}

/*
 * ── Section headings ──────────────────────────────────────────────────────
 *
 * The display face is for the h1 and for the places somebody chooses it. It
 * had spread to every h2 and h3 on the site — "Our 2026 Season Sponsors &
 * Partners", "Nightlife & dining", "Expect the unexpected" — which is both
 * against the house rule and hard to read at heading sizes, because it is a
 * poster face being asked to do body-adjacent work.
 *
 * These take the treatment instead: Poppins, uppercase, heavy. The contrast
 * between heavy and light is the thing that makes it read as designed rather
 * than merely bold, so .mpr-thin is here for the half of a heading that should
 * sit back — wrap it round the words in the Divi module:
 *
 *     Immersive nightlife. <span class="mpr-thin">Themed chaos.</span>
 *
 * h1 is deliberately absent from this rule. It keeps the display face.
 */
body #page-container .et_pb_module h2,
body #page-container .et_pb_module h3,
body #page-container .et_pb_module h4 {
	font-family: var( --mpr-font-body, "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif );
	font-weight: 700;
	text-transform: uppercase;
	line-height: 1.2;
}

/* The half that sits back. */
body #page-container .mpr-thin,
body #page-container .et_pb_module h2 .mpr-thin,
body #page-container .et_pb_module h3 .mpr-thin {
	font-weight: 300;
}
