/* ==========================================================================
   pb-footer-signup.css — THE FOOTER SIGNUP TREATMENT.
   Ported from the v9b mockup css/footer-signup.css (sections 5 and 6).

   WHAT THIS IS
   Mockup rounds 44 to 58 worked the newsletter signup over, and the client then
   chose THREE treatments (C, D and F) and spread them across the nine v9b pages,
   three pages each. The theme shipped F. On 2026-09-03 the client retired that
   spread of competing options and asked for ONE treatment site-wide: the band
   from range-bahamas.html (variant C), INVERTED. That is `signup--c-inverse`,
   §1 and §2 below, and it is what footer.php now sets by default.

   WHAT "INVERTED" MEANS, ITEM BY ITEM. The instruction was five points and each
   one is a departure from Bahamas rather than a reading of it, so each is
   annotated at the rule that carries it:
     1. the main footer carries NO signup, the form is its own strip above the
        rest of the footer — that part IS Bahamas, unchanged;
     2. the strip is Woodland Sage with white type, where C is white with sage
        type;
     3. Subscribe is a WHITE fill, hovering to --woodland-sage-deep, where C is a
        sage fill hovering to Near Black;
     4. Subscribe gets rounded corners, where C squares them off deliberately;
     5. the rules above and below the strip are WHITE.
   Points 2, 3 and 5 all cost contrast and none of it is quietly bought back
   here. See the contrast record below.

   THE SHAPE OF THE INVERSION IS D's, EVEN THOUGH THE TREATMENT IS C's, and it is
   worth knowing why. Inverting C onto the sage puts the band on the SAME GROUND
   as the footer beneath it, which is exactly variant D's situation, so D's two
   structural answers are the right ones and are taken rather than reinvented:
   the band draws its own 1px rules top and bottom because nothing else separates
   it from the footer, and .site-footer gives up its own border-top so those two
   hairlines do not stack a pixel apart. C's type, geometry and column ratio are
   otherwise kept intact — this is C on a different ground, not D with a serif.

   VARIANT F IS STILL HERE, in §3 and §4, fully ported and one filter return
   away (`pb_ec_footer_signup_variant` → 'signup--f'). It is not live. It is kept
   because "several competing options" is what was just retired, and the cost of
   keeping the retired one that was actually shipping is two sections of CSS
   nothing can reach.

   THE FILTER IS NOW ENOUGH ON ITS OWN. It used not to be: F keeps the form
   inside .footer-brand and the band family lifts it into
   `.signup-band > .container`, so switching used to mean a markup edit as well.
   footer.php now derives the form's POSITION from the variant and prints it from
   one shared template part (template-parts/footer-signup-form.php), so the form
   is byte-identical in both positions and the filter moves it.

   WHERE THIS SITS, AND IT MATTERS
   Enqueued after pb-shell.css (functions.php, handle `pb-ec-footer-signup`),
   mirroring the mockup, where footer-signup.css is linked after theme.css on all
   nine pages. pb-shell.css's [L] layer re-inks the whole footer for the sage
   ground, so several rules here have to OUT-SPECIFY it rather than merely follow
   it. The specificities below were chosen against that layer upstream and are
   preserved exactly, selector for selector. Do not "simplify" them:
     .signup--f .footer-news__copy       (0,2,0)  beats [L]'s (0,1,0)
     .signup--f .news-field input        (0,2,1)  beats [L]'s (0,1,1)
     .signup--f .news-field .btn--primary        (0,3,0)  beats [L]'s (0,2,0)
     .signup--f .news-field .btn--primary:hover  (0,4,0)  beats [L]'s (0,3,0)
   C-inverse is scoped one level deeper again, `.signup--c-inverse .signup-band
   …`, because upstream C is and because the band is the only place these rules
   have any business reaching:
     .signup--c-inverse .signup-band .footer-news__copy      (0,3,0)
     .signup--c-inverse .signup-band .news-field input       (0,3,1)
     .signup--c-inverse .signup-band .news-field .btn--primary        (0,4,0)
     .signup--c-inverse .signup-band .news-field .btn--primary:hover  (0,5,0)
   Every rule in this sheet is scoped to a variant class, so nothing here can
   reach a footer that has not opted in.

   NOT PORTED FROM THE MOCKUP SHEET, each for the reason it gives there:
     · the D rules, and C's own inks, which the inversion replaces;
     · `.sv-specimen .site-footer { margin-top: 0 }` — scratch-page furniture;
     · the "undoing the shared scaffold" block — every declaration in it restored
       a shell default that only the mockup's scratch page had overridden, and
       pb-shell.css already says all three (footer padding-top, the 44px brand
       mark, .footer-top align-items:start). The one scaffold declaration that IS
       a design decision, .footer-news losing the 42ch cap, IS ported below;
     · the max-width:860px `max-width: none` restatement on F's copy — round 58
       set the base to none, so it became a no-op;
     · the prefers-reduced-motion block — pb-tokens.css already zeroes
       transitions globally.

   --------------------------------------------------------------------------
   CONTRAST. NINE SHORTFALLS ON THE LIVE TREATMENT, ALL NINE CHOSEN KNOWINGLY,
   NONE OF THEM QUIETLY IMPROVED HERE.

   Measured on the rendered page by dev/qa-footer-signup.mjs, out of a real
   Chrome, against the REAL GROUND BEHIND each element rather than against its
   own fill, with hover taken under a forced pseudo-state. Never read off a
   stylesheet. Every row names the passing alternative that was DECLINED, so
   nobody has to re-derive it, and none of those alternatives has been
   substituted in here.

   THE C-INVERSE ROWS ARE THE LIVE ONES. C, D and F below describe treatments
   that are not currently on the site; they are kept because they are the record
   of what a switch would cost, and that is exactly when someone will need them.

   A COUNTING NOTE, because the upstream numbers do not agree with themselves:
   the mockup header is titled "NINE SHORTFALLS" and C's own line says "Four
   rows" while listing five. Round 60 changed C's Subscribe label from Near Black
   to white, which ADDED a row, and the two counts were not updated with it. The
   rows themselves are what matter. Recorded rather than silently reconciled.

   VARIANT C-INVERSE, sage strip. LIVE. Nine rows. All but two are --white on
   --woodland-sage #A3A393, which is 2.56:1 and is the whole cost of point 2 of
   the instruction:
     invitation, 21px serif     2.56:1  owes 4.5  short 1.94
        declined: --woodland-sage-ink 8.15:1, and --near-black 5.77:1
     typed text, 16px           2.56:1  owes 4.5  short 1.94
     placeholder, 16px          2.56:1  owes 4.5  short 1.94
        AND 1.00:1 AGAINST THE TYPED TEXT, because "all text in white" makes
        them the same colour. This is the one row that is not only a threshold:
        an empty field and a filled one look the same until you read the words.
        declined: rgba(255,255,255,0.7), which is what the [L] layer already
        paints every other footer placeholder and what this replaced. It
        composites to 1.99:1 on the sage, so it is WORSE against the ground and
        better against the typed text. One declaration either way.
     field underline            2.56:1  owes 3.0  short 0.44
        the field has no other boundary; C's own underline is in the same
        position for the same reason.
        declined: --near-black 5.77:1 or --woodland-sage-ink 3.19:1
     Subscribe fill, at rest    2.56:1  owes 3.0  short 0.44
        the fill is the button's only boundary against the sage ground, and
        white is the LIGHTEST surface there is, so 2.56 is the CEILING here:
        no lighter tone exists and no softer one can pass.
        declined: a --slate-deep fill at 3.54:1, which is variant D's answer
     Subscribe fill, on HOVER   1.35:1  owes 3.0  short 1.65
        --woodland-sage-deep #8B8B7D on --woodland-sage #A3A393. THE ONLY ROW
        THAT GOES DOWN ON INTERACTION: the control is 2.56:1 against the band at
        rest and 1.35:1 while you are pointing at it, so hovering makes the
        button harder to find rather than easier. That is a direct consequence
        of point 3 of the instruction, a sage-family hover on a sage ground, and
        it is the one figure here worth a second look.
        declined: --near-black 5.77:1 (C's own hover), --slate-deep 3.54:1
     Subscribe label, on HOVER  3.45:1  owes 4.5  short 1.05
        --white on --woodland-sage-deep. Better than the 2.56 a white label
        would score on the resting sage, and still short.
        declined: --near-black on the sage-deep fill, 4.27:1, itself only a
        marginal pass and a hue jump
     strip rule, top            2.56:1  owes 3.0  short 0.44
     strip rule, bottom         2.56:1  owes 3.0  short 0.44
        the two rules are the only thing separating the strip from the footer,
        since both are the same #A3A393. Point 5 of the instruction, and the
        same row D carries for the same reason.
        declined: --near-black 5.77:1 or --woodland-sage-ink 3.19:1
        THE TOP RULE HAS A SECOND GROUND, and it is not the same on every page.
        It is the footer's top edge, so above it is the PAGE. Measured
        2026-09-03: on the Bahamas range page the ground above is plain white
        and the rule reads 1.00:1 from above, i.e. it is invisible on that side;
        on Home and FAQ a photographic CTA band precedes the footer, whose CSS
        ground is --near-black at 14.74:1, though what the rule actually abuts
        there is the picture rather than that colour. Below it is always the
        sage at 2.56:1. All of it is printed by the harness, because a rule with
        two grounds has two answers and quoting the flattering one is how a
        measurement lies.
     THE ONE ROW THAT PASSES, and it is not an accident: Subscribe's resting
     LABEL is --accent-contrast (--slate-deep) on the white fill at 9.04:1. The
     instruction set the fill and the hover and said nothing about the resting
     label, and white on white is not a reading of it. --accent-contrast is the
     system's designated ink for a primary on a light ground and is already what
     the [L] layer inks this exact button when it goes white on hover, so this
     follows the theme rather than inventing for it. The literal inversion of C
     would be a --woodland-sage label at 2.56:1 on its own fill; that is what
     was NOT done, and it is one declaration away if the brand ink is wanted
     there.
     Context rather than excuse, and it is D's: the [L] layer already runs this
     footer's own copy at rgba(255,255,255,0.86) = 2.28:1 and its links at 0.92
     = 2.40:1, so near white on sage is the established site-wide condition and
     opaque white is the best of that family, not a new fault.

   VARIANT C, white band. Not live. Five rows, all --woodland-sage #A3A393 on
   white:
     invitation, 21px serif     2.56:1  owes 4.5  short 1.94
        declined: --woodland-sage-ink 8.15:1
     placeholder, 16px          2.56:1  owes 4.5  short 1.94
        declined: --text-muted 7.06:1, which is what it replaced
     field underline            2.56:1  owes 3.0  short 0.44
        declined: --woodland-sage-ink 8.15:1
     Subscribe fill, at rest    2.56:1  owes 3.0  short 0.44
        the fill is the button's only boundary against the white ground.
        declined: a 1px --woodland-sage-deep outline round the sage fill, 3.45:1
     Subscribe label, at rest   2.56:1  owes 4.5  short 1.94
        declined: --near-black 5.77:1, which is what it replaced.
        ROUND 60 CHANGED THIS. The label was near-black, argued for on the
        grounds that the fill is already 2.56 against white and a white label
        would put fill and label both at 2.56 at once, leaving nothing on the
        control clearing anything. That reasoning still describes what is true;
        the client heard it and chose white anyway, so that C reads like every
        other filled primary in v9b (the [K] layer inks them all white on
        Woodland Sage). It is their call, taken knowingly, and the cost is that
        the whole control rests at 2.56 with only the hover clearing.

   VARIANT D, sage band. Four rows, all --white on --woodland-sage #A3A393:
     invitation, 21px sans      2.56:1  owes 4.5  short 1.94
        declined: --near-black 5.77:1
     field fill                 2.56:1  owes 3.0  short 0.44
        with the border removed the white fill is the control's only boundary.
        White is the LIGHTEST surface there is, so 2.56 is the ceiling on this
        ground: no softer tone can pass, only do worse.
        declined: keep the border, or C's --near-black underline at 5.77:1
     band rule, top             2.56:1  owes 3.0  short 0.44
     band rule, bottom          2.56:1  owes 3.0  short 0.44
        the two rules are the only thing separating the band from the footer,
        since both are the same #A3A393.
        declined: --near-black 5.77:1 or --woodland-sage-ink 3.19:1
     Context rather than excuse: the [L] layer already runs this footer's own copy
     at rgba(255,255,255,0.86) = 2.28:1 and its links at 0.92 = 2.40:1, so near
     white on sage is the established site-wide condition and D's opaque white
     is the best of the three, not a new fault.

   VARIANT F, in place, no band. One row, and it is the ONE LIVE ROW HERE:
     placeholder, 16px          3.19:1  owes 4.5  short 1.31
        --woodland-sage-ink on --woodland-sage. It belongs to the GROUND, not to
        the treatment: --slate-deep is 3.54, --slate 2.53, --bone 2.32, and
        --near-black at 5.77 is the only ink in the palette that clears 4.5 here,
        which would make the placeholder indistinguishable from typed text.
        declined: --near-black 5.77:1, and the markup fix, which is to promote
        the sr-only <label> to a visible tracked micro label and drop the
        placeholder attribute. The second is better practice and is a client
        call, so the shipped shape is kept and the number is printed.
     Everything else in F clears with room, all on --near-black at 5.77:1: the
     invitation, the typed text, the opening rule, the field rule and Subscribe
     at rest. That step to --near-black IS the treatment: the [L] layer paints
     this block near white at 2.28:1, which is most of why it read as small print.
   ========================================================================== */


/* ==========================================================================
   1. VARIANT C-INVERSE. THE BAHAMAS STRIP, INVERTED.  ← THE LIVE TREATMENT
   The signup leaves the footer proper and becomes a full-bleed strip above it,
   exactly as on v9b range-bahamas.html. What changes from Bahamas is the ground
   and what rides on it: the strip is Woodland Sage with white type, Subscribe is
   a white rounded button that hovers to the deeper sage, and a white hairline
   rules the strip top and bottom.

   WHY THE STRIP AT ALL, in one line, because it is easy to lose: the footer used
   to carry the signup inside .footer-brand, competing with the mark and the
   social row for the same column. Lifting it out gives the invitation the full
   width of the page and gives the brand column back to the brand.

   WHAT IT COSTS. The strip and the footer are now the SAME COLOUR, so the two
   white rules are the only thing that says where one ends and the other begins,
   and every piece of type on the strip runs white on #A3A393 at 2.56:1. Those
   are the client's calls, taken with the numbers in front of them, and the full
   record is in the header. Nothing below quietly buys any of it back.
   ========================================================================== */

/* ---- structure. Ported unchanged from the mockup's band family, which is the
   scaffold C and D share and which is about WHERE things sit rather than what
   colour they are. --------------------------------------------------------- */

/* The footer hands its top padding to the strip, and gives up its own top rule.
   Both halves matter. Without the first, pb-shell's --section-gap-s leaves a
   band of bare sage above the strip and the strip stops being the footer's top
   edge. Without the second, pb-shell's 1px --sage-tint border-top on .site-footer
   lands immediately above the strip's own white border-top: two hairlines a pixel
   apart in two different colours. Upstream C keeps that hairline because C's
   ground is white and the hairline is its only upward edge; this treatment draws
   its own, so the footer's is redundant here exactly as it is on a D page.
   (0,2,0) matches pb-shell's (0,1,0) and wins on load order; written as a
   compound so the specificity is not merely equal by accident. */
.site-footer.signup--c-inverse {
  padding-top: 0;
  border-top: 0;
}
.signup--c-inverse .signup-band + .container .footer-top {
  padding-top: var(--section-gap-s);
}

/* With the form out of the brand column the mark and the social row are the
   column's only occupants, so the mark grows to fill against the three link
   stacks. 68px is the figure mockup round 48 arrived at. */
.signup--c-inverse .footer-brand__logo img { height: 68px; }

/* pb-shell.css caps .footer-news at 42ch so a bare paragraph cannot run long in
   a narrow column. Wrong constraint for a full-width strip. */
.signup--c-inverse .footer-news { max-width: none; }

/* Mockup round 53. pb-shell hangs the brand column and the three link stacks
   from a shared top edge; the client asked for them centred against each other
   instead, and that request belongs to the band family: with the form lifted
   out, the brand column is a mark and a social row against three link stacks
   four items deep, and hanging it from the top leaves a hole. (0,2,0) beats
   pb-shell's (0,1,0). */
.signup--c-inverse .footer-top { align-items: center; }


/* ---- the strip itself. INSTRUCTION POINTS 2 AND 5. ----------------------- */

/* THE GROUND IS THE FOOTER'S OWN, not merely close to it: --woodland-sage IS
   what pb-shell's [L] layer paints .site-footer. Declared rather than left to
   inherit so the value is visible here and so the harness has something to
   compare .footer-top against; both compute rgb(163,163,147).

   THE TWO RULES ARE 1px WHITE, and they are load-bearing rather than decorative
   precisely BECAUSE the ground is shared: they are the only thing separating the
   strip from the footer. White measures 2.56:1 against the sage where a
   structural boundary owes 3.0. --near-black at 5.77:1 and --woodland-sage-ink
   at 3.19:1 both clear it and neither is substituted in.

   The TOP rule is also the footer's top edge, so it has a second ground: the
   page above, and that ground differs page to page. Measured, it is plain white
   on the Bahamas range page — 1.00:1, invisible from above — and a photographic
   CTA band on Home and FAQ. Below it is always the sage. Every one of those
   figures is printed by dev/qa-footer-signup.mjs rather than assumed here.

   padding-block is C's --section-gap-s, kept rather than moved to D's own clamp:
   this is C's geometry on a different ground. */
.signup--c-inverse .signup-band {
  background: var(--woodland-sage);
  padding-block: var(--section-gap-s);
  color: var(--white);
  border-top: var(--hairline-width) solid var(--white);
  border-bottom: var(--hairline-width) solid var(--white);
}

/* 1.35fr / 1fr, the footer's own ratio REVERSED, and it is C's ratio rather than
   D's. The other bands hand the wide column to the field row, which is how a
   band lines up with the three nav stacks below it. Wrong trade here: the field
   row is 44px tall whatever width it is given, so the wide column would hold a
   control that cannot use it while the invitation wrapped tight in the narrow
   one. Reversing it costs the alignment with .footer-top and buys the copy about
   195px of measure, which is the difference between a line that breaks where it
   wants to and one that stacks. */
.signup--c-inverse .signup-band .footer-news {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: var(--space-md) var(--space-xl);
  align-items: end;
}

/* THE INVITATION IS WHITE. Instruction point 2, and it costs a threshold: white
   on #A3A393 is 2.56:1 where normal text owes 4.5. 21px is normal text, not
   large text — large starts at 24px regular and this has never been that big in
   this variant — so 4.5 is the figure that applies, and dropping a size would
   not change which figure applies.

   WHAT MAKES THIS THE CLIENT'S CALL AND NOT A SLIP: the [L] layer already paints
   this exact selector rgba(255,255,255,0.86) on this exact ground, which
   composites to 2.28:1. Near white on sage is the established footer treatment
   right across the site, and what this rule does is stop overriding it back
   toward the dark ink. Opaque --white rather than [L]'s alpha for exactly that
   reason: blending toward the sage only loses contrast, and 2.56 is the best
   available. (0,3,0) beats [L]'s (0,1,0).

   The serif, the size, the leading, the tracking, the 58ch cap and the balance
   are all C's, unchanged. 58ch is just past the natural length of this sentence,
   so it holds the line together at 1440 and still catches a longer piece of copy
   if the wording ever changes; align-self opts the copy out of the row's `end`,
   which at this band height read as the copy having dropped to the floor. */
.signup--c-inverse .signup-band .footer-news__copy {
  font-family: var(--font-serif);
  font-weight: var(--w-regular);
  font-size: var(--fs-h4);           /* 21px at 1440, 18px at 390 */
  line-height: 1.25;
  letter-spacing: -0.005em;
  color: var(--white);
  max-width: 58ch;
  text-wrap: balance;
  align-self: center;
}

.signup--c-inverse .signup-band .news-field {
  gap: var(--space-md);
  align-items: end;
}

/* THE FIELD IS C's — a bare underlined rule, no box, no fill — re-inked white.
   Typed text, caret and underline all go opaque white at 2.56:1: the text where
   4.5 is owed, the underline where 3.0 is owed and where it is the field's ONLY
   boundary.

   THE PLACEHOLDER IS THE ROW WORTH ARGUING ABOUT, and it is built as instructed
   rather than around the instruction. "All text in white" makes the placeholder
   the same colour as the typed text, so the two measure 1.00:1 against each
   other and an empty field looks like a filled one. The [L] layer's own
   rgba(255,255,255,0.7) is the one-declaration alternative and is what this
   replaced; it reads as a placeholder and measures 1.99:1 on the sage, i.e. it
   trades a real threshold for a real affordance. Left to the client.

   Declared as a custom property, not only in the ::placeholder rule below,
   because a pseudo-element's computed colour cannot be read back reliably and
   the harness measures this row from the property. The two must stay in step:
   the rule under this one is what paints. */
.signup--c-inverse .signup-band .news-field input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: var(--tap-min);
  padding: 0 0 var(--space-3xs);
  background: none;
  color: var(--white);
  caret-color: var(--white);
  font-size: var(--fs-body);
  border: 0;
  border-bottom: var(--hairline-width) solid var(--white);
  border-radius: 0;
  --signup-placeholder-color: var(--white);
}
.signup--c-inverse .signup-band .news-field input::placeholder {
  color: var(--signup-placeholder-color);
  opacity: 1;
}
/* C darkens the underline on focus and there is nowhere lighter to go from
   white, so the field borrows F's answer and thickens instead. The RING is the
   real indicator and it is untouched: the [L] layer draws it --slate-deep at
   3.54:1 on the sage, a pass, and it is the one thing in this treatment that was
   not allowed to give any ground. */
.signup--c-inverse .signup-band .news-field input:focus {
  border-bottom-width: 2px;
}

/* SUBSCRIBE. INSTRUCTION POINTS 3 AND 4.
   A WHITE FILL, ROUNDED, hovering to --woodland-sage-deep with a white label.

   THE RESTING LABEL IS --accent-contrast, and that is the one choice here the
   instruction did not make. It set the fill and the hover and said nothing about
   the label; white on white is not a reading of it, so something had to be
   chosen. --accent-contrast (--slate-deep) is the system's designated ink for a
   primary on a light ground, it is already what the [L] layer inks this exact
   button when it goes white on hover, and it measures 9.04:1 on the white fill.
   The literal inversion of C would put --woodland-sage there at 2.56:1 on its
   own fill; that is what was NOT done and it is one declaration away.

   THE HOVER IS THE FIGURE TO LOOK AT. --woodland-sage-deep #8B8B7D on the strip's
   own #A3A393 is 1.35:1, so the button's boundary against the band goes DOWN on
   interaction, from 2.56 at rest to 1.35 while you are pointing at it — the only
   state change in the footer that makes its control harder to find. The white
   label on that fill is 3.45:1 against the 4.5 a label owes. Both are direct
   consequences of a sage-family hover on a sage ground and both are recorded
   rather than designed around; C's own --near-black hover is 5.77:1 and
   --slate-deep is 3.54:1 if either is ever wanted back.

   THE CORNERS ARE --radius-btn, the system's own 10px button radius, reached by
   simply not squaring them: upstream C sets `border-radius: 0` deliberately, to
   make Subscribe read as editorial rather than as a shop control. Point 4 of the
   instruction reverses that, so the declaration is stated with the token rather
   than left to the base rule, because "inherits the default" and "was asked for"
   look identical in a diff otherwise.

   Everything else is C's editorial button, unchanged: sentence case, no tracked
   capitals, body size. (0,4,0) and (0,5,0) against [L]'s (0,2,0) and (0,3,0). */
.signup--c-inverse .signup-band .news-field .btn--primary {
  flex: 0 0 auto;
  min-height: var(--tap-min);
  padding: 0 var(--space-lg);
  background: var(--white);
  border-color: var(--white);
  color: var(--accent-contrast);
  font-size: var(--fs-body);
  font-weight: var(--w-medium);
  text-transform: none;
  letter-spacing: 0;
  border-radius: var(--radius-btn);
}
.signup--c-inverse .signup-band .news-field .btn--primary:hover,
.signup--c-inverse .signup-band .news-field .btn--primary:focus-visible {
  background: var(--woodland-sage-deep);
  border-color: var(--woodland-sage-deep);
  color: var(--white);
}


/* ==========================================================================
   2. C-INVERSE AT NARROWER WIDTHS
   860 is .footer-top's own stacking point (pb-shell.css), so the strip folds on
   the same breath the footer does. The strip itself does NOT shrink to a card at
   either step: it stays edge to edge, which is the whole reason this family
   survives 390 where the earlier in-column panel did not.
   ========================================================================== */
@media (max-width: 860px) {
  .signup--c-inverse .signup-band .footer-news {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-lg);
  }
  /* Once the split collapses the copy has the full container to itself, so the
     58ch cap would run it to a 700px line. Back to a reading measure. */
  .signup--c-inverse .signup-band .footer-news__copy { max-width: 38ch; }
}

@media (max-width: 560px) {
  /* Below the point where the field and the button can share a line, stop
     pretending: each takes the full width. */
  .signup--c-inverse .signup-band .news-field input,
  .signup--c-inverse .signup-band .news-field .btn {
    flex: 1 1 100%;
  }
  .signup--c-inverse .signup-band .news-field { gap: var(--space-md); }
}


/* ==========================================================================
   3. VARIANT F. ABOVE THE LINE  (NOT LIVE — kept for a change of mind)
   THE SIGNUP STAYS WHERE IT SHIPS, inside .footer-brand under the logo and the
   social row. That is what distinguishes F from C and D, and it is why footer.php
   needed no markup change: this section is CSS only.

   Type does the work. The invitation is set in Gordita at --fs-h4 and the block
   opens on a single Near Black hairline taken the full width of the brand
   column. Below it, the field and Subscribe in the system's ordinary idiom,
   deliberately unremarkable, so the type is unmistakably the event. Nothing here
   adds a surface, a shadow or a radius: mockup rounds 44, 45 and 46 each put a
   filled panel in this position, in three different colours, and the client's
   verdict on all three was that it looked plonked in.

   THE INK IS HALF THE ANSWER. AP3 recorded the original complaint as the block
   being "too quiet in the sage footer", and most of that quietness is the [L]
   re-ink layer painting it near white on a mid-value ground: .footer-news__copy
   at rgba(255,255,255,0.86) measures 2.28:1 and the field's rule at
   rgba(255,255,255,0.55) measures 1.74:1. No treatment drawn around ink that
   faint will read as an invitation. F steps the signup's own ink to --near-black
   at 5.77:1, the only ink in the palette with real room on #A3A393. The rest of
   the footer keeps the near white, so the signup is the one block in the footer
   set in the darker ink, and that step is what separates it before the treatment
   is noticed.

   WHY THE RULE IS ABOVE THE COPY AND NOT UNDER IT. Under it is the obvious place
   and it is the wrong one, with a recorded precedent: AQ3 pulled a sage hairline
   out of step one of How It Works because "it read as a divider cutting the
   step's text in half rather than as emphasis". A rule between the invitation
   and the field would do exactly that, splitting the sentence from the control
   it belongs to. Above the copy the same rule reads as an opening, and it lands
   in the one place the block genuinely needs separating: from the social row.

   THE RULE IS 1px AND NOT 2px. Weight is the cheap way to make a line strong and
   the wrong lever in a system built on hairlines. This one gets its authority
   from LENGTH: 520.8px at 1440, where the only other rules in the footer are 28
   per cent white and the field's own stops at the input.

   PROMINENT, NOT OVERPOWERING, which was the test the brief set. F introduces no
   ground, so the footer is still one flat sage; the nav keeps its own near white
   and its own scale; and the loudest single object in the variant is a 1px line.
   ========================================================================== */
.signup--f .footer-news {
  gap: var(--space-lg);
  /* THE 42ch CAP COMES OFF, and this is a design decision rather than
     scaffolding. pb-shell.css holds .footer-news to 42ch so a bare paragraph
     cannot run long in a narrow column. Here the drawn element is a RULE, and a
     rule needs length to be confident: off the cap the block takes the whole
     brand column, 520.8px at 1440. */
  max-width: none;
  /* And align-self, which is the declaration that actually delivers it.
     .footer-brand is a flex column with align-items:start (pb-shell.css), so
     every child shrinks to its own content and the form came out 411px wide,
     i.e. exactly as wide as its longest line of copy. Both rules would then have
     been the length of a sentence rather than the length of the column, which is
     the opposite of the point, and the length would have moved every time the
     wording did. Stretch pins both to the column. */
  align-self: stretch;
  /* --space-2xs on top of .footer-brand's own --space-md gap puts the rule 32px
     under the social row: clear of the icons, still obviously attached to the
     block it opens. */
  margin-top: var(--space-2xs);
  padding-top: var(--space-md);
  /* 5.77:1 on the sage, well past the 3.0 a boundary would owe if this one owed
     anything. It carries no information, so it does not. */
  border-top: var(--hairline-width) solid var(--near-black);
}
/* ROUND 58 collapsed this into one rule. Upstream on the scratch page it is E's
   shared ruleset (serif at --fs-h3) plus F's two overrides, kept apart there so E
   and F stay a single-variable comparison. E is not shipping, so F's resolved
   values are stated once. The client read the sans at --fs-h3 as "a decent amount
   too big" and asked for it down, while still clearly above the footer links
   beside it: --fs-h4 is 21px at 1440 against the 16px the links run at, which is
   the bracket described. Leading and tracking are --lh-heading / --ls-heading,
   inherited unchanged from the shared rule.
   max-width is none by instruction (round 58: the sentence should use the full
   width of its container). `text-wrap: balance` went with the cap and that part
   matters: balance evens the line lengths, which is the opposite of filling the
   column, so leaving it in would have quietly undone the change. */
.signup--f .footer-news__copy {
  color: var(--near-black);
  font-family: var(--font-body);
  font-weight: var(--w-regular);
  font-size: var(--fs-h4);           /* 21px at 1440, 18px at 390 */
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading);
  max-width: none;
}
.signup--f .news-field {
  gap: var(--space-md);
  align-items: end;
}
.signup--f .news-field input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: var(--tap-min);
  padding: 0 0 var(--space-2xs);
  background: none;
  color: var(--near-black);
  caret-color: var(--near-black);
  font-size: var(--fs-body);
  border: 0;
  /* The [L] layer rules the field rgba(255,255,255,0.55), which composites to
     1.74:1 against the sage where a control's visible boundary owes 3.0.
     --near-black is 5.77:1. This is the only boundary the field has, so it is
     the one place in the signup that could not be left as shipped. */
  border-bottom: var(--hairline-width) solid var(--near-black);
  border-radius: 0;
  /* THE ONE SHORT ROW IN F, 3.19:1 against the 4.5 a placeholder owes, and it is
     short because of the GROUND rather than because of anything the treatment
     does. See the header for the full list of inks tried and the two declined
     fixes. Declared as a custom property, not only in the ::placeholder rule
     below, because a pseudo-element's computed colour cannot be read back
     reliably and the harness measures this row from the property. The two must
     stay in step: the rule under this one is what paints. */
  --signup-placeholder-color: var(--woodland-sage-ink);
}
.signup--f .news-field input::placeholder {
  color: var(--signup-placeholder-color);
  opacity: 1;
}
.signup--f .news-field input:focus {
  border-bottom-width: 2px;
}
/* Subscribe keeps the OUTLINE idiom and changes only its ink, which is the
   restraint the treatment needs: the invitation above it is already the loud
   thing and a filled button under it would give the block two events.
   The [L] layer gives the footer's primary a white border and a white label,
   2.56:1 twice over, short of both the 4.5 a label owes and the 3.0 an edge
   owes. --near-black is 5.77:1 on both counts. Hover keeps the inversion but
   fills in Near Black with a white label, 14.74:1, so the state change goes UP
   in contrast rather than down. (0,3,0) and (0,4,0) against [L]'s (0,2,0) and
   (0,3,0). */
.signup--f .news-field .btn--primary {
  background: transparent;
  border-color: var(--near-black);
  color: var(--near-black);
}
.signup--f .news-field .btn--primary:hover,
.signup--f .news-field .btn--primary:focus-visible {
  background: var(--near-black);
  border-color: var(--near-black);
  color: var(--white);
}
/* The focus ring stays --slate-deep, 3.54:1 on the sage and a pass, set by the
   [L] layer's `.site-footer .news-field input:focus-visible` (0,3,1). It is
   deliberately NOT moved to Near Black: the button is outlined in Near Black, so
   a Near Black ring would read as the button simply thickening rather than as a
   separate indicator. Nothing here touches it. */


/* ==========================================================================
   4. F AT NARROWER WIDTHS  (NOT LIVE)
   860 is .footer-top's own stacking point, so the brand column goes full width
   on the same breath the footer does. The block gets MORE room there rather than
   less, which is a property of building it out of rules instead of out of framed
   effects: a rule simply gets longer.
   ========================================================================== */
@media (max-width: 560px) {
  /* Folds the way C and D do upstream: below the point where the field and the
     button can share a line, each takes the row. The rule above the copy is
     unaffected and simply shortens with the column. */
  .signup--f .news-field input,
  .signup--f .news-field .btn {
    flex: 1 1 100%;
  }
  .signup--f .news-field { gap: var(--space-sm); }
}