/*
 * PROVENANCE — this file is AUTHORED HERE, not copied. It is the second file
 * in this folder that is, on the same terms cluster.css records.
 * ─────────────────────────────────────────────────────────────────────────
 * Entry            split
 * Category         mastheads
 * Entry version    not yet extracted
 * Destination      theme-builds/library/mastheads/split/
 * SHA-256          none — nothing has been pulled, so there is nothing to hash
 * Authored         2026-09-16, gravitystack-main 4.39.0
 * Substrate        base.css, "Section dividers". REQUIRED, and it is the
 *                  Divider axis this organism declares. The class
 *                  `.gs-masthead-split--divider-bottom` is a member of that
 *                  section's three selector lists as of 4.39.0. Without it the
 *                  band renders with no foot rule and nothing errors — the
 *                  silent-substrate failure library/README.md names at step 3
 * Specificity      no separate record yet. The two collisions this file has to
 *                  win are named inline at the rules that win them, in the
 *                  shape mega-featured-specificity.md uses, and they move to
 *                  that file at extraction
 *
 * TOKEN DEPENDENCY LIST, for library/README.md step 2. Read this against the
 * receiving client's `[slug]-design.md`, NOT against its theme.json — the
 * primitive step below does not appear there.
 *
 *   Palette roles      gravity-brand (reached through the divider substrate,
 *                      never named in this file), gravity-text-inverse,
 *                      gravity-cta-inverse, gravity-cta-label-inverse,
 *                      gravity-focus-inverse
 *   Primitive scale    neutral-8   — muted foreground on the dark band
 *                      action-3    — CTA hover fill, inverse direction
 *                      action-10   — CTA hover label, inverse direction
 *   Font families      fraunces, figtree
 *   Font sizes         text-1, text-3, text-4, text-7 (title floor); the
 *                      title's ceiling is a one-off measured fixed size,
 *                      not a preset — see the identity zone comment
 *   Spacing            20, 30, 40, 50, 70, 80
 *   Custom             rounded.lg, weight.normal, weight.strong
 *
 * No tracking token is consumed. The title's tracking is a literal and the
 * reason is at that rule.
 *
 * WHY IT IS AUTHORED HERE RATHER THAN PULLED. Same reason cluster.css gives:
 * `mastheads/README.md` names `split` as the first entry and records it as not
 * yet built, and the constant-versus-variable split in a masthead is decided by
 * Signals, which has no name in the IA yet. Extracting at instance one is what
 * `mega-featured` did, and its own README records that version 1.0.0 meant
 * *the first thing that was pulled* rather than *ready*.
 *
 * Until then this file is the source and it is editable in place. The moment it
 * is extracted that stops being true and this header gains a version, a hash,
 * and a pull date like every other one.
 *
 * IT IS AUTHORED AS THOUGH IT WERE ALREADY THE LIBRARY ENTRY. No site-specific
 * selector, no content string, no value that is true of the Gravity Hacks
 * archive rather than of the form. The one thing in here that knows which
 * section it is serving is nothing, and that is deliberate: the companion zone
 * is a slot, and Signals fills it with a different ask.
 * ─────────────────────────────────────────────────────────────────────────
 */

/*
 * split.css — the split masthead, design layer.
 *
 * Section identity. An identity zone and a companion zone side by side, bottom
 * aligned, on a full-bleed band that terminates in the brand foot rule. The
 * identity says what the section is; the companion carries what it asks. One
 * organism serves both Gravity Hacks, whose ask is email capture, and Signals,
 * whose ask is the Quick GravityScore — see `library/mastheads/README.md`,
 * *Naming*, for why the ask is not in the entry name.
 *
 * THIS ORGANISM DECLARES TWO AXES AND IMPLEMENTS NEITHER. Both are existing
 * fleet contracts and the first draft of this entry hand-rolled one of them.
 *
 *   Band     — an editor-applied style variation on `core/group`. The root is a
 *              group and the ground is `is-style-band-dark` on it. Nothing in
 *              this file paints the band, sets the foreground, or restyles a
 *              link or a heading on it; the variation already does. A different
 *              ground is a class swap in the template, not an edit here.
 *
 *   Divider  — *The divider contract*, `gravitysite-design-system-constants.md`.
 *              4px, full section width, bound to `gravity-brand`, drawn as a
 *              PSEUDO-ELEMENT ON THE SECTION BOX. It lives in base.css under
 *              "Section dividers" and this organism joins that selector list
 *              rather than drawing its own rule.
 *
 * THE PSEUDO-ELEMENT IS `::before`, NOT `::after`, and a reader coming from the
 * approved mockup will expect the other one. The mockup's comment block draws
 * it as `::after`. The contract says `::before` carries the rule and `::after`
 * has been free since the triangle was cut on 2026-08-30, and base.css
 * implements it that way for all seven existing declarers. Following the mockup
 * would have made this the eighth declarer drawn differently from the other
 * seven, which is the drift the one-selector-list model exists to prevent.
 *
 * THE CLASS TAKES THE THEME PREFIX. `gs-` is retired by
 * `gravitysite-css-standards.md`, *Naming*, with one sanctioned exception: a
 * class may carry it where it must sit outside the `c-` namespace so the
 * patterns plugin's pattern-address detection cannot read its `--` as an
 * address. `gs-footer-close--divider-top` is the recorded case and this is the
 * second. The root takes the same prefix as its own modifier because a root and
 * its modifier sharing a base name is what makes the modifier readable; a
 * `c-masthead-split` root wearing a `gs-masthead-split--divider-bottom`
 * modifier would be two components by name. The declared-axes register holds
 * patterns and gains no row for this.
 *
 * LAYOUT IS CORE'S FLEX LAYOUT, CONFIGURED IN THE TEMPLATE, NOT OVERRIDDEN
 * HERE. The inner group is authored with `"layout":{"type":"flex",
 * "flexWrap":"wrap","verticalAlignment":"bottom"}` and a blockGap, so core
 * emits the display, the gap, the wrap, and the cross-axis alignment itself.
 * This file sets only the two zones' flex proportions, which core never
 * declares, so there is no specificity contest with core's per-instance
 * container rule and no rule in here exists to beat one.
 *
 * THE COLUMNS ARE ONE AT THE BASE AND TWO AT `bp-2`, MOBILE-FIRST, AND THE
 * APPROVED MOCKUP BREAKS AT 900. That value is not available:
 * `gravitysite-css-standards.md` allows `bp-1` 768 and `bp-2` 1200 and nothing
 * between, and adding a third requires a page-level layout that demonstrably
 * breaks where the existing two cannot help. This one does not — it reads
 * correctly stacked and correctly split, and only the crossover moves.
 *
 * `bp-2` rather than `bp-1`, and the cost is stated rather than buried:
 * everything from 768 to 1199 gets the masthead stacked where the mockup had it
 * split from 900 up. At `bp-1` the two bases plus the gap come to 56.25rem
 * against 44rem of content, so the zones would land near 350px each — a title
 * at title scale and an email capture both in half a tablet. Stacked is
 * the better of the two answers available, and it is the one a reader of the
 * mockup will notice, so it is written here.
 *
 * AN EARLIER DRAFT LET THE ZONES WRAP INTRINSICALLY off their flex bases, with
 * no breakpoint at all, and it was measured rather than reasoned about. It
 * crossed over at 1024 instead of 900, which was close enough — but a zone that
 * wraps onto its own line keeps its basis and does not grow, so the capture
 * form sat at 420px inside an 885px line at every width from roughly 430 to
 * 1000. Ragged across most of the tablet range, and invisible at the two
 * viewports anyone checks. Recorded because the technique is sound and the
 * failure is specific: intrinsic wrapping is for zones that should keep their
 * width when they wrap, and a full-width companion is not one.
 *
 * TWO TOKEN DECISIONS ARE RULED AND ARE NOT THIS FILE'S TO REOPEN. Both are
 * recorded at the rules that carry them: the muted foreground reaching
 * `neutral-8` through the primitive scale channel, and the title's own fixed
 * ceiling, measured rather than borrowed from another preset's curve. See
 * the build index entry dated 2026-09-16 in `website-rebuild-index.md` for
 * the measurements.
 *
 * THE SUBSCRIBE FORM IS UNPOWERED MARKUP. Its mechanism is undecided and a task
 * is owed. Styled here because an unstyled field on a dark band is not a
 * neutral placeholder — it is a defect that looks like a decision.
 *
 * ── MARKUP CONTRACT ─────────────────────────────────────────────────────
 *
 * An entry is a stylesheet plus the markup it assumes, and the second half is
 * usually the part that does not travel. It is written out here so extraction
 * carries it rather than rediscovering it.
 *
 *   root        core/group, align FULL, layout constrained.
 *               Classes: `gs-masthead-split`, the divider modifier, and the
 *               band variation, e.g. `is-style-band-dark`.
 *   __inner     core/group, align WIDE, layout flex, flexWrap wrap,
 *               verticalAlignment bottom, blockGap spacing 70.
 *   __identity  core/group, layout default, blockGap spacing 40.
 *               Holds the h1 (`__title`) and one paragraph (`__promise`).
 *   __companion core/group, layout default, blockGap spacing 30.
 *               The slot. Whatever the section asks for goes here.
 *   __form      a plain div inside a core/html block, holding `__field` and
 *               `__submit`. NOT a `<form>`, and the control is `type="button"`
 *               — an unpowered `<form>` submits to the current URL on Enter,
 *               which is a worse default than doing nothing visibly.
 *
 * THE INTERNAL RHYTHM IS `blockGap` IN THE TEMPLATE, NOT MARGINS IN HERE, and
 * that is a deliberate inversion of where a library entry would rather keep it.
 * Core spaces flow children with `:where(.is-layout-flow) > *` at (0,1,0), so a
 * margin authored here at one class would be a tie decided by load order rather
 * than by intent. Two ways out: neutralise core's margins in `base.css` and own
 * the spacing here, which is what `.c-cluster-shell` does at section 5, or let
 * core emit the spacing from a token and author nothing. The second is chosen —
 * it is the same tokens through a different channel, it costs no substrate
 * rule, and the count of authored values goes down rather than up. The cost is
 * that the rhythm is no longer readable from this file alone, which is what the
 * table above is for. Same reasoning for the flex layout on `__inner`: core
 * emits the display, the gap, the wrap, and the cross-axis alignment, and this
 * file sets only the two flex bases, which core never declares.
 */


/* ── Root and zones ──────────────────────────────────────────────────────
 *
 * The root carries the band variation, the divider modifier, and this class.
 * It is `alignfull`, so the band spans the viewport; the inner group is
 * `alignwide`, so the content sits on the estate's 71.25rem wide measure
 * rather than the 40rem content measure a constrained parent would otherwise
 * impose. Nothing here sets those widths — they are core's alignment handling
 * reading theme.json, and stating them again in CSS would be a second home for
 * one fact.
 *
 * No `container-type` anywhere in this file. The root is `alignfull`, is
 * `is-layout-constrained`, and is a section — all three of the things
 * *Five hard constraints* rules out as a containment host, and a full-bleed
 * section's inline size tracks the content root anyway, so a container query
 * and a viewport query would be the same measurement.
 */

.gs-masthead-split {
  padding-block: var(--wp--preset--spacing--70);
}

/* One column at the base. Each zone takes the whole line, so the capture form
 * is as wide as the promise line above it rather than ending short of it.
 *
 * `min-inline-size: 0` on both because a flex item's default `auto` floor is
 * its content's minimum width, and a title at the identity zone's own ceiling has a large
 * one — without this the identity refuses to shrink and pushes a horizontal
 * scrollbar onto the narrowest phones.
 */

.gs-masthead-split__identity,
.gs-masthead-split__companion {
  flex: 1 1 100%;
  min-inline-size: 0;
}


/* The band deepens once the columns have room to sit beside each other.
 *
 * The mockup ramped this continuously as `clamp(4rem, 7.5vw, 6.5rem)`. A clamp
 * of raw values is what *The raw-value exception* refuses — it permits literals
 * inside a media condition and nowhere else — so the ramp is spent as a step
 * between two spacing tokens. 4rem to 6rem against the mockup's 4rem to 6.5rem:
 * the half-rem is the cost of the rule and it is not visible against a band
 * this deep.
 */
@media (min-width: 1200px) { /* bp-2 */
  .gs-masthead-split {
    padding-block: var(--wp--preset--spacing--80);
  }

  /* Two columns, and the reason the bases are what they are.
   *
   * At the 71.25rem wide measure with a 4rem gap there is 67.25rem to divide.
   * The companion's basis is the width its ask needs and it does NOT grow; the
   * identity takes the remainder. That lands 41rem against 26.25rem, which is
   * the 1.25 to 0.8 ratio the approved design specifies — arrived at by
   * subtraction rather than by fractions, so the companion's width is stated
   * rather than derived from a ratio nobody can read off the rule.
   *
   * Measured on the render at 1440: 656 against 420, a ratio of 1.562 against
   * the specified 1.5625, with the two zones' bottoms on the same line.
   */
  .gs-masthead-split__identity {
    flex: 1 1 26rem;
  }

  .gs-masthead-split__companion {
    flex: 0 1 26.25rem;
  }

  /* The title's fixed ceiling. See the identity zone comment below for why
   * this is a fixed size rather than a clamp, and how 6.125rem (98px) was
   * measured: the largest size at which "Gravity Hacks" sets on one line in
   * the 656px identity zone with at least 10% slack on the advance width.
   */
  .gs-masthead-split__title {
    font-size: 6.125rem;
  }
}


/* ── Identity zone ───────────────────────────────────────────────────────
 *
 * THE TITLE AUTHORS ITS OWN TYPE. Ruled by Scott, 2026-09-16, replacing the
 * prior rule that reused another display preset's clamp. Nothing about
 * Fraunces changes by this ruling — the face, weight, and axis settings stay
 * exactly as shipped. What is cut is the reference to that preset's clamp,
 * because the borrowed curve was never a threshold crossed once: the
 * borrowed preset interpolates on viewport width — `7.535vw`, rising to
 * 129.1px — while this title's container does not. `--wide` caps at 1140px
 * and the identity zone is fixed at 656px from `bp-2` (see the two-column
 * rule above), so past roughly 1188px of viewport the type kept growing and
 * its box did not. The wrap worsened monotonically with viewport width — one
 * line at 1200 and 1440, two at 1920, worse again at 2560 — which is why a
 * retuned clamp would only have postponed the fault rather than closed it.
 *
 * THE EARLIER "NO NEW PRESET" RULING STILL HOLDS AND IS NOT WHAT THIS
 * REOPENS. A preset is a size an author selects, and no author selects a
 * size for a fixed string in a template — that was and remains correct. It
 * did not follow that the title had to borrow another preset's curve
 * instead, and treating those as the same constraint is what produced three
 * rounds of contortion. A component owning its own type is the normal case,
 * not an exception.
 *
 * THE CEILING IS A FIXED SIZE, NOT A CLAMP, because the container it fills is
 * fixed rather than fluid. Measured in the browser against the live string,
 * "Gravity Hacks": `6.125rem` (98px) is the largest size at which the string
 * sets on one line in the 656px zone with at least 10% slack on the advance
 * width — 589.9px measured against the 656px zone, 10.07% slack; one pixel
 * larger (99px) drops slack to 9.16% and fails the bar. Holds unchanged at
 * 1920 and 2560, where the zone is still the same 656px and only the old
 * curve was still growing. Bringing the title to one line drops the band
 * from roughly 530px to roughly 340px at those widths, with the two columns
 * landing at equal heights.
 *
 * ACCEPTED COST, RECORDED RATHER THAN SOLVED: the ceiling is fit to the
 * string "Gravity Hacks". A future section with a longer name needs its own
 * value or accepts wrapping. Container-relative sizing would have made the
 * overflow structurally impossible and given every future archive the right
 * size for free — it was considered and deliberately deferred, on the
 * grounds that deciding how this scales across two sections while only one
 * exists is guessing at the second instance. Revisit when Signals lands.
 *
 * THE FLOOR BINDS `text-7` (2.75rem / 44px) — an existing preset step, not a
 * literal, and not a reference to the retired preset's interpolation. It
 * happens to equal that preset's own floor because that is already the right
 * size for this string at the stacked layout's narrower measures, not
 * because the two roles carry any relationship. Below `bp-2` the masthead is
 * one column at full width, where wrapping is normal and expected — one line
 * is a desktop requirement here, not a universal one — and this floor reads
 * correctly and clears 320px with no horizontal overflow.
 *
 * FAMILY, WEIGHT, LEADING, AND TRACKING ARE BOUND IN THE SAME RULE, for the
 * reason `base.css` gives at the display preset's own `:root` binding: a
 * font-size preset cannot carry them, and omitting any one renders the title
 * at the correct size in Fraunces at the wrong weight, which looks
 * deliberate and is not. The values are that binding's, unchanged by the
 * font-size no longer coming from the retired preset — 0.99 leading and
 * -0.01em tracking are that binding's own values, reused as literals for the
 * same reason the binding gives.
 *
 * NO `font-variation-settings`, DELIBERATELY, AND THE MOCKUP HAS SOME. The
 * mockup loads Fraunces from the Google CDN as a variable font and has to pin
 * SOFT 50, WONK 0, opsz 72 in CSS. This theme ships an instanced static binary
 * that already carries that tuple in its own name table — see
 * `assets/fonts/README.md` — so the declaration would be inert here, and an
 * inert declaration that looks load-bearing is worse than none. It would also
 * be the only one in the theme.
 *
 * SPECIFICITY, MEASURED RATHER THAN ASSUMED on the render 2026-09-16:
 *   theme.json's h1 element style emits as `h1`             (0,0,1)
 *   this rule                                               (0,1,0)
 * One class wins, so no `:root` qualifier. The other display preset's
 * `base.css` binding carries one because it has to beat a preset class
 * WordPress ships with `!important` on the font-size; this rule sets the
 * font-size itself and has no such contest. *Prefer the lowest specificity
 * that works.*
 *
 * Tracking is the literal `-0.01em` rather than `tracking.normal`, which is
 * `0`. The token set has no negative step and this is the display-face
 * tracking the other preset's binding already carries as a literal for the
 * same reason. A `tracking.tight` step is the fix and it is a design-file
 * decision, not this file's.
 */

.gs-masthead-split__title {
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: var(--wp--preset--font-size--text-7);
  font-weight: var(--wp--custom--weight--normal);
  line-height: 0.99;
  letter-spacing: -0.01em;
}

/* MUTED FOREGROUND ON THE DARK BAND, AND IT REACHES A PRIMITIVE RATHER THAN A
 * ROLE. This is ruled and measured, not a shortcut.
 *
 * The role set has no muted inverse and does not gain one for this build.
 * Measured 2026-09-15: `neutral-8` `#b9bcb8` reads 6.34:1 on
 * `gravity-surface-dark`, retaining 52% of white's 12.16:1, where the light
 * `gravity-text` / `gravity-text-muted` pair retains 37%. `neutral-7` was
 * proposed first and REJECTED ON MEASUREMENT at 64% retention — it passes
 * contrast and fails its job, reading as white with dirt on it rather than as a
 * muted role. `neutral-9` matches the light pair's character at 30% and fails
 * AA for body text at 3.64:1. The ramp squeezes: the step that behaves like the
 * pair cannot clear the floor and the step that clears the floor does not
 * behave like it.
 *
 * So it comes through the primitive scale channel, which is the `brand-12`
 * precedent `mega-featured.css` set — a developer's step rather than an
 * author's swatch. A nineteenth role is argued when a second consumer appears,
 * and a role added for one consumer would touch the standard, the constants
 * file, the generator, and every client design file.
 *
 * ALPHA WAS THE EARLIER ANSWER AND IS NOT AVAILABLE. Rounds 2 to 4 of the
 * mockup used white at 78% opacity. Every role in this system points at a solid
 * primitive, and a composite breaks the moment anything sits behind it.
 *
 * FOR A LIBRARY RE-PULL: this is the token in the dependency list most likely
 * to be absent on a receiving client, because a primitive step does not appear
 * in theme.json. Check the design file. An absent step renders the promise line
 * at the band's inherited foreground, which is white, which looks correct and
 * is the whole distinction gone.
 */

.gs-masthead-split__promise,
.gs-masthead-split__fineprint {
  color: var(--wp--custom--color--neutral-8);
}

.gs-masthead-split__promise {
  max-inline-size: 34ch;
  font-size: var(--wp--preset--font-size--text-4);
  line-height: 1.45;
}


/* ── Companion zone ──────────────────────────────────────────────────────
 *
 * The slot. Gravity Hacks fills it with email capture and Signals fills it with
 * the Quick GravityScore ask, and the two are one organism — see
 * `library/mastheads/README.md`, *Naming*. Everything below the cadence line is
 * therefore the FIRST occupant's styling rather than the zone's, and the split
 * is marked so extraction can act on it: the zone rule is the entry, the form
 * rules are what the entry happens to carry today.
 */

.gs-masthead-split__cadence {
  font-weight: var(--wp--custom--weight--strong);
}

/* ── The capture form — UNPOWERED MARKUP ──────────────────────────────────
 *
 * No action, no method, no handler. The mechanism is undecided and a task is
 * owed on it. What is here is the shape, so the band is not shipped with a
 * hole in it.
 *
 * It is a `core/html` block rather than `core/buttons` plus a field, and that
 * is a deliberate choice rather than the easy one. `core/button` renders an
 * anchor and has no submit type, so a real form would need the button block's
 * markup overridden anyway; and a form whose mechanism is undecided should not
 * be assembled out of blocks an author can rearrange before it has one. The
 * cost is that theme.json's `button` element styles do not reach a bare
 * `<button>` — they bind `.wp-element-button` — so the fill, the label colour,
 * and the focus ring are authored below instead of inherited. That cost is
 * named here because it is exactly what a reader will otherwise discover by
 * finding the duplication.
 *
 * THE FORM STACKS INSIDE A NARROW ZONE AND ROWS UP WHEN THE ZONE WRAPS,
 * WITHOUT A BREAKPOINT. `flex-wrap: wrap` with a field basis does it: beside
 * the identity the zone is 26.25rem and the field's basis plus the button do
 * not fit, so they stack; wrapped below the identity the zone is full width and
 * they sit side by side. That is the mockup's behaviour at both of its
 * breakpoints, produced by the shape of the box rather than by a guess about
 * the viewport.
 */

.gs-masthead-split__form {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wp--preset--spacing--20);
}

/* TARGET SIZE IS BUILT FROM PADDING, NOT DECLARED AS A MINIMUM.
 *
 * `min-block-size: 48px` is what the mockup carries and it is a raw value,
 * which *The raw-value exception* permits only inside a media condition. The
 * spacing scale is the wrong instrument for it too — a minimum target is not a
 * spacing step, which is the same argument the divider contract makes for
 * writing 4px literally rather than reaching for slug 10.
 *
 * So the height is composed instead: spacing 30 above and below, plus the
 * text-3 line box at 1.2, plus the 1px borders, resolves to roughly 54px.
 * Clears the 44px floor with room and clears the mockup's own 48px. Measured on
 * the render rather than trusted — if the type scale moves, re-measure here.
 */

/* The 14rem basis is a raw value and so are the two flex bases at `bp-2`, and
 * *The raw-value exception* is absolute about this. Recorded here as the
 * deviation the standard asks for rather than left to be found: a flex basis is
 * the width at which a box stops being usable, which the spacing scale does not
 * measure and no token in this system carries — the same argument the divider
 * contract makes for writing its 4px literally rather than reaching for the
 * reserved slug 10. 14rem is the narrowest an email field can be and still show
 * a typical address without scrolling it. **A layout-dimension token set would
 * close this**, and it is a design-file decision rather than this file's.
 */

.gs-masthead-split__field {
  flex: 1 1 14rem;
  min-inline-size: 0;
  padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
  border: 1px solid rgba(255, 255, 255, 0.45);
  border-radius: var(--wp--custom--rounded--lg);
  /* Field border and field well are the two known token gaps on this band and
   * they are ruled to stay literal for now. Measured 2026-09-15: the border
   * composites to #8e918e at 3.82:1, where neutral-9 sits at 3.64:1; the well
   * composites to #464b46 at 1.36:1, which no ramp step serves and which would
   * need a pin like surface-nested. Both serve this one component, whose
   * mechanism is undecided, so both wait rather than being promoted to roles
   * for a component that may not survive its own mechanism decision. */
  background-color: rgba(255, 255, 255, 0.10);
  color: var(--wp--preset--color--gravity-text-inverse);
  font-family: inherit;
  font-size: var(--wp--preset--font-size--text-3);
  line-height: 1.2;
}

/* The placeholder takes the muted step rather than an alpha.
 *
 * The mockup used white at 62%, which is a third unmeasured composite on this
 * band. `neutral-8` is already measured at 6.34:1 here and is already this
 * organism's muted foreground, and a placeholder that is less prominent than
 * entered text is exactly what the muted step is for. One fewer literal, and
 * the value is one that has been checked.
 */
.gs-masthead-split__field::placeholder {
  color: var(--wp--custom--color--neutral-8);
  opacity: 1; /* Firefox dims placeholders by default, which would put this
               * below the measured figure without saying so. */
}

.gs-masthead-split__submit {
  flex: 0 0 auto;
  padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--50);
  border: 0;
  border-radius: var(--wp--custom--rounded--lg);
  background-color: var(--wp--preset--color--gravity-cta-inverse);
  color: var(--wp--preset--color--gravity-cta-label-inverse);
  font-family: var(--wp--preset--font-family--figtree);
  font-size: var(--wp--preset--font-size--text-3);
  font-weight: var(--wp--custom--weight--strong);
  line-height: 1.2;
  cursor: pointer;
  transition: background-color 180ms ease, color 180ms ease;
}

/* The hover pair is the inverse band's own, read off theme.json rather than
 * invented: action-3 is the tint the light band's CTA hover uses and action-10
 * is its label. On white the direction has to reverse — the fill tints and the
 * label deepens — because there is nowhere darker for a white button to go. */
.gs-masthead-split__submit:hover {
  background-color: var(--wp--custom--color--action-3);
  color: var(--wp--custom--color--action-10);
}

/* Focus states are authored because the elements are not core's.
 * `gravitysite-css-standards.md`, *Accessibility floor*: a hover state with no
 * matching focus state is a defect, and it prefers theme.json — which cannot
 * reach a bare input or a bare button. Both take the inverse focus role, which
 * is what every other focusable thing on this band takes.
 *
 * The 2px width and 2px offset are literals, and they are theme.json's own:
 * every `:focus-visible` entry in this theme's palette roles is written
 * `"width": "2px", "offset": "2px"`. Reproducing the fleet's focus geometry is
 * the point — a token would be better and there is not one, and inventing a
 * different number here so as to avoid a literal would be worse than the
 * literal. */
.gs-masthead-split__field:focus-visible,
.gs-masthead-split__submit:focus-visible {
  outline: 2px solid var(--wp--preset--color--gravity-focus-inverse);
  outline-offset: 2px;
}

.gs-masthead-split__fineprint {
  font-size: var(--wp--preset--font-size--text-1);
}


/* ── Reduced motion ──────────────────────────────────────────────────────
 * One transition in this file, and it is a colour change on a control. Removed
 * rather than shortened: there is nothing here whose meaning depends on the
 * animation. */

@media (prefers-reduced-motion: reduce) {
  .gs-masthead-split__submit {
    transition: none;
  }
}