/* White Papers listing (page 666): retire the two 2020 papers.
   The three cards are hardcoded in template-white-papers.php, so there is no
   post count to change — this hides two of them. The proper fix is to remove
   those blocks from the template, or better, have it loop over the White Papers
   post type. Until then, this. */
.page-id-666 .box-products > .cols:nth-child(1),
.page-id-666 .box-products > .cols:nth-child(2) {
  display: none;
}

/* Suppress the grey box behind the artwork on this card only.
   The grey is rgb(245,245,246) on div.img-wrapper — not on .col-35, which is
   transparent. Removing it lets the section's pale blue (rgb(233,249,251))
   show through, so the mockup reads as floating on the band. */
.page-id-666 .box-products > .cols:nth-child(3) .img-wrapper {
  background-color: transparent;
}

/* White Papers listing: fill the grey panel with the cover artwork.
   Only above 992px, which is where the theme makes .col-35 a real side column
   (min-width:992px sets .cols .col-35 { width:35% }). Below that the card
   stacks and the theme deliberately keeps the artwork small and centred, so
   this must not apply there.
   No aspect-ratio: .bg-img is position:absolute and centred with
   top/left:50% + translate(-50%,-50%), so an aspect-ratio makes it grow out of
   its wrapper instead of filling it. width/height 100% respects the centring. */
@media screen and (min-width: 992px) {
  .page-id-666 .box-products .col-35 .bg-img {
    aspect-ratio: auto;
    width: 100%;
    height: 100%;
  }
}

/* ============================================================================
   Gravity Forms 3 — restore the theme's submit button styling site-wide
   ----------------------------------------------------------------------------
   WHERE: Appearance → Customize → Additional CSS.

   Put this ABOVE any page-specific form rules you already have (the
   #gform_wrapper_2 rule, and the content-area-email-subscription-prompt
   block). Those are more specific and will keep overriding this where they
   apply — which is what you want.

   ----------------------------------------------------------------------------
   WHY THIS IS NEEDED

   Gravity Forms updated 2.10.5 → 3.1.0.2 on Mon 31 Aug 2026 14:16 GMT (every
   plugin file carries that timestamp). GF 3 renders the submit as a <button>
   where 2.x rendered <input type="submit">.

   The theme styles submits with eight rules written as `input[type=submit]`,
   including the ones that set the teal background, the 8px radius, 18px type,
   150px min-width and 48px min-height. All eight stopped matching Gravity Forms
   buttons. Every form on the site fell back to GF's own defaults: #204ce5 blue,
   3px radius, 14px, 38px tall, shrink-to-fit width.

   Measured on /contact/ before this fix: form 3 (the main contact form) was
   blue and 81px wide.

   ----------------------------------------------------------------------------
   THE TWO CLASS NAMES MATTER

   GF 3 emits two different button classes depending on whether a form has been
   migrated to the newer "Submit as a field" model:

     .gform-button   (hyphen)     — newer inline submit field   e.g. form 2, 21
     .gform_button   (underscore) — legacy footer submit        e.g. form 3

   Both appear on synfinii.com right now. A fix covering only one silently
   misses half your forms — that caught me on the first pass. `input[type=submit]`
   is kept in the list so this still works on any form GF renders the old way,
   and if the plugin reverts the markup later.

   Scoped to `.gform_wrapper` throughout, so Contact Form 7, the search form and
   the theme's own `.btn` elements are untouched. Verified.
   ========================================================================== */

/* Colour and radius through Gravity Forms' own custom properties — its
   sanctioned styling hook, and the part least likely to break on the next
   update. */
.gform_wrapper {
  --gf-ctrl-btn-bg-color-primary: #007a94;
  --gf-ctrl-btn-color-primary: #fff;
  --gf-ctrl-btn-border-color-primary: #007a94;
  --gf-ctrl-btn-bg-color-hover-primary: #0e0129;
  --gf-ctrl-btn-color-hover-primary: #fff;
  --gf-ctrl-btn-border-color-hover-primary: #0e0129;
  --gf-ctrl-btn-radius: 8px;
}

/* Size, weight and the explicit colours. The !important flags mirror the
   theme's own — it declared these !important on input[type=submit], and GF's
   framework stylesheet is specific enough that dropping them lets GF win. */
.gform_wrapper .gform-button,
.gform_wrapper .gform_button,
.gform_wrapper input[type="submit"] {
  background-color: #007a94 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  font-family: 'DM Sans', sans-serif;
  font-size: 18px !important;
  font-weight: 500 !important;
  min-height: 48px !important;
  min-width: 150px !important;
  padding: 12px 24px 11px !important;
  white-space: nowrap;
  cursor: pointer;
  transition: all .3s ease;
}

.gform_wrapper .gform-button:hover,
.gform_wrapper .gform_button:hover,
.gform_wrapper input[type="submit"]:hover,
.gform_wrapper .gform-button:focus-visible,
.gform_wrapper .gform_button:focus-visible,
.gform_wrapper input[type="submit"]:focus-visible {
  background-color: #0e0129 !important;
  color: #fff !important;
}

/* --------------------------------------------------------------------------
   Keyboard focus ring for Gravity Forms submit buttons.

   Gravity Forms does ship a focus indicator, but it is delivered three ways at
   once: an outline colour, a border colour, and a box-shadow. The site-wide
   rule above sets `border: none !important` to kill GF's default button chrome,
   which removes one of those three. Rather than leave the indicator dependent
   on the other two surviving a future GF update, it is stated explicitly here.

   !important is needed: GF's focus rules are built from long :not() chains and
   carry very high specificity.

   Dark ring by default, which suits the white dialog and every light ground on
   the site. White ring on the Midnight band, where a dark ring would vanish.
   -------------------------------------------------------------------------- */
.gform_wrapper .gform-button:focus-visible,
.gform_wrapper .gform_button:focus-visible,
.gform_wrapper input[type="submit"]:focus-visible {
  outline: 2px solid #0e0129 !important;
  outline-offset: 2px !important;
}
.content-area-email-subscription-prompt .gform_wrapper .gform-button:focus-visible,
.content-area-email-subscription-prompt .gform_wrapper .gform_button:focus-visible {
  outline-color: #ffffff !important;
}


/* The two page-template layout rules that also died with the element change. */
.page-template-template-contact .page-main .s-gravity .gform-button,
.page-template-template-contact .page-main .s-gravity .gform_button {
  width: 100% !important;
}
.page-template-template-solutions .box--form .gform_footer .gform-button,
.page-template-template-solutions .box--form .gform_footer .gform_button {
  margin: 0 auto !important;
}

/* ============================================================================
   VERIFIED ON THE LIVE SITE (/contact/)

                        before              after
     form 3 (contact)   blue, 14px, 81px    teal, 18px, 48px tall, full width
     form 2 (footer)    teal, 14px, 38px    teal, 18px, 48px tall
     non-GF buttons     unchanged           unchanged

   ----------------------------------------------------------------------------
   NOT A PERMANENT HOME

   This is a patch in Additional CSS. It duplicates styling that belongs in the
   theme, so it will drift if the theme's button design changes. The durable fix
   is to add `.gform-button, .gform_button` alongside `input[type=submit]` in the
   theme's own eight rules — a developer task, half an hour, and then this file
   can be deleted.

   Worth raising separately: a major plugin version auto-updated on production
   and changed markup site-wide. If GF auto-updates are on, consider switching
   to minor-only, or staging major upgrades first.
   ========================================================================== */

/* ============================================================================
   EXCEPTION — the Midnight subscribe band
   ----------------------------------------------------------------------------
   The site-wide hover above goes to Midnight #0e0129. On the Midnight band that
   is all but invisible, so there the button inverts to white instead. Higher
   specificity than the site-wide rule (4 classes vs 3), so it wins wherever the
   band is present and nowhere else.

   Keep this AFTER the site-wide block.
   ========================================================================== */
.content-area-email-subscription-prompt .gform_wrapper .gform-button:hover,
.content-area-email-subscription-prompt .gform_wrapper .gform_button:hover,
.content-area-email-subscription-prompt .gform_wrapper input[type="submit"]:hover,
.content-area-email-subscription-prompt .gform_wrapper .gform-button:focus-visible,
.content-area-email-subscription-prompt .gform_wrapper .gform_button:focus-visible {
  background-color: #fff !important;
  color: #0e0129 !important;
}

/* Light variant of the band sits on white, so Midnight hover is correct there. */
.content-area-email-subscription-prompt--light .gform_wrapper .gform-button:hover,
.content-area-email-subscription-prompt--light .gform_wrapper .gform_button:hover {
  background-color: #0e0129 !important;
  color: #fff !important;
}


/*==============================================*/
.single-event .top .date {
	display: none;
}

.s-solutions-graphic .box.box-blue .logo img{
	max-width: 200px;
}

.single-job .single__sidebar .add-info:nth-of-type(2) img,
.single-post .single__sidebar .add-info:nth-of-type(2) img{
	max-height: 60px;
	object-fit: contain;
	object-position: left center;
}

.page-main.single .content_wrapper .single__sidebar .add-info .logo img{
  max-height: 60px;
  object-fit: contain;
  object-position: left center;
}

.page-main.single .back-band{
	margin-top: 36px;
}

/* ============================================================================
   Content-area email subscription prompt
   A reusable dark call-to-action band that wraps a Gravity Forms block.
   ----------------------------------------------------------------------------
   WHERE THIS GOES:  Appearance → Customize → Additional CSS

   Not a page-builder or code-block CSS field — those are usually sandboxed to
   their own container and cannot reach a sibling block. This file is fully
   self-contained: it declares its own custom properties and every selector is
   namespaced, so it can live site-wide without touching anything else.

   ----------------------------------------------------------------------------
   HOW TO USE — one class, on a Group block

   Add a Group block, then in the block sidebar:
       Advanced → Additional CSS class(es):  content-area-email-subscription-prompt
       Advanced → HTML anchor:               (optional, e.g. subscribe)
       Alignment:                            Full width

   Put these inside the Group, in any order:

       Paragraph      →  small accent line   (needs the __eyebrow class, optional)
       Heading H2–H4  →  the headline        (no class needed)
       Paragraph      →  supporting copy     (no class needed)
       Gravity Forms  →  the form            (no class needed)

   On the Gravity Forms block set: Form title OFF, Form description OFF, AJAX ON.

   ----------------------------------------------------------------------------
   CLASSES

   content-area-email-subscription-prompt             the Group block (required)
   content-area-email-subscription-prompt__eyebrow    small uppercase accent line
   content-area-email-subscription-prompt--light      white ground instead of dark

   Only the first is required. Headings and paragraphs are matched by element,
   so there is nothing else to remember or mistype.
   ========================================================================== */

/* fix the global padding before the footer on the partnership page */
.page-main.page .page_content:has(.synx) { padding-bottom: 40px; }

.content-area-email-subscription-prompt {
  /* ---- Palette ---- */
  --email-prompt-bg:        #160142;   /* Midnight */
  --email-prompt-fg:        #FFFFFF;
  --email-prompt-copy:      rgba(255, 255, 255, .88);  /* 13.5:1 on Midnight */
  --email-prompt-accent:    #97FFC1;   /* Mint — 15.6:1 on Midnight */
  --email-prompt-invalid:   #FF766C;   /* Vermillion — 6.4:1 on Midnight */
  --email-prompt-error-fg:  #B3322A;   /* 5.9:1 on the error surface below */
  --email-prompt-error-bg:  #FFE8E7;
  --email-prompt-btn-hover: #FFFFFF;   /* see note on the hover rule */
  --email-prompt-btn-hover-fg: #0e0129;

  /* ---- Metrics ---- */
  --email-prompt-gutter:    56px;
  --email-prompt-pad-block: 72px;
  --email-prompt-measure:   640px;
  --email-prompt-h-size:    36px;
  --email-prompt-font: 'DM Sans', Verdana, -apple-system, BlinkMacSystemFont,
                       'Segoe UI', Roboto, sans-serif;
}

/* The class is doubled for specificity (0,2,0). Cheap insurance against a theme
   or block-supports rule setting a background on .wp-block-group at (0,1,0). */
.content-area-email-subscription-prompt.content-area-email-subscription-prompt {
  background: var(--email-prompt-bg);
  padding: var(--email-prompt-pad-block) var(--email-prompt-gutter);
  margin: 0;
}

.content-area-email-subscription-prompt > * {
  max-width: var(--email-prompt-measure);
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  margin-bottom: 18px;
  text-align: center;
}
.content-area-email-subscription-prompt > *:last-child { margin-bottom: 0; }

/* ---------- Headline ---------- */
/* Matched by element so no class is needed. H2 is the expected level; H3 and H4
   are accepted so the pattern can sit under an existing heading hierarchy. */
/* Descendant, not `>`: a Group with certain layout settings can put an inner
   container between the wrapper and its children, and the rule would silently
   stop matching.
   !important on colour only: the block editor writes an inline
   style="color:…" on headings and paragraphs (from block supports or a
   theme.json default), and an inline style beats any stylesheet rule that
   isn't !important. Everything else here is left overridable on purpose. */
.content-area-email-subscription-prompt h2,
.content-area-email-subscription-prompt h3,
.content-area-email-subscription-prompt h4 {
  font-family: var(--email-prompt-font);
  font-weight: 800;
  font-size: var(--email-prompt-h-size);
  line-height: 1.2;
  letter-spacing: -.8px;
  color: var(--email-prompt-fg) !important;
  max-width: 26ch;
  text-wrap: balance;
}

/* ---------- Supporting copy ---------- */
/* The :not() chain does two jobs: it keeps this rule off Gravity Forms' own
   paragraphs, and it excludes the eyebrow. Excluding the eyebrow matters —
   these two rules used to compete, and each :not() adds specificity, so this
   selector quietly grew to (0,4,1) and started beating the eyebrow rule, which
   then rendered as body copy. Mutually exclusive selectors can't have that
   argument. */
.content-area-email-subscription-prompt p:not(.content-area-email-subscription-prompt__eyebrow):not(:has(~ h2)):not(:has(~ h3)):not(:has(~ h4)):not(.gform_description):not(.gform_required_legend):not([class*="gfield"]) {
  font-family: var(--email-prompt-font);
  font-weight: 400;
  font-size: 17px;
  line-height: 1.55;
  color: var(--email-prompt-copy) !important;
  max-width: 56ch;
  text-wrap: pretty;
}

/* ---------- Optional eyebrow ---------- */
/* The one opt-in class. The base class is doubled here on purpose: the generic
   paragraph rule above is (0,2,1), and a single base class here would only be
   (0,2,0) — the generic rule would win and the eyebrow would render as body
   copy. Doubling makes this (0,3,0), which takes it, for any element type. */
/* Two ways to be an eyebrow. The explicit class is the documented one; the
   `:has(~ h2)` selectors catch a paragraph that sits BEFORE the heading, which
   is what an eyebrow always is. That means the class is optional in the normal
   layout, and a band with no eyebrow still renders its single paragraph as body
   copy — which `p:first-of-type` alone would have got wrong. */
.content-area-email-subscription-prompt p:has(~ h2),
.content-area-email-subscription-prompt p:has(~ h3),
.content-area-email-subscription-prompt p:has(~ h4),
.content-area-email-subscription-prompt .content-area-email-subscription-prompt__eyebrow.content-area-email-subscription-prompt__eyebrow {
  font-family: var(--email-prompt-font);
  font-weight: 700;
  font-size: 12px;
  line-height: 1.3;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--email-prompt-accent) !important;
  max-width: none;
}

/* ---------- Light variant ---------- */
/* Add content-area-email-subscription-prompt--light alongside the base class to
   put the pattern on a white ground instead. Only the tokens change. */
.content-area-email-subscription-prompt--light {
  --email-prompt-bg:     #FFFFFF;
  --email-prompt-fg:     #160142;
  --email-prompt-copy:   #3a3550;      /* 11.6:1 on white */
  --email-prompt-accent: #007A94;      /* DarkTeal — 4.99:1 on white.
                                          Brand Teal #0092B2 is only 3.65:1 and
                                          must not carry 12px text. */
  --email-prompt-invalid:      #B3322A;
  --email-prompt-btn-hover:    #0e0129;
  --email-prompt-btn-hover-fg: #FFFFFF;
}

/* ============================================================ GRAVITY FORMS */

/* Only the block margins are reset. `margin: 0` here would also wipe the `auto`
   side margins inherited from the `> *` centring rule above — which matters when
   the class is applied straight to the Gravity Forms block, making .gform_wrapper
   a direct child. That rendered the form left-aligned instead of centred. */
.content-area-email-subscription-prompt .gform_wrapper {
  margin-top: 0;
  margin-bottom: 0;
}

/* Belt and braces — GF versions nest these differently. The block's own
   "Form title / Form description: off" toggles are still the better fix. */
.content-area-email-subscription-prompt .gform_heading,
.content-area-email-subscription-prompt .gform_title,
.content-area-email-subscription-prompt .gform_description,
.content-area-email-subscription-prompt .gform_required_legend { display: none; }
#gform_wrapper_2.gform-theme {
  --gf-color-primary: #007a94 !important;
  --gf-ctrl-btn-bg-color-primary: #007a94 !important;
}
/* GF's orbital theme lays fields on a 12-column grid. One row is all this
   needs, so override to flex — the gfield--width-* span classes then no-op. */
.content-area-email-subscription-prompt .gform_fields {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-start;
  justify-content: center;
  grid-template-columns: none;
}
.content-area-email-subscription-prompt .gfield {
  margin: 0;
  padding: 0;
  min-width: 0;
}
.content-area-email-subscription-prompt .gfield--type-email,
.content-area-email-subscription-prompt .gfield--type-text { flex: 0 1 300px; }
.content-area-email-subscription-prompt .gfield--type-submit { flex: 0 0 auto; }

/* The placeholder carries the label. Clip it rather than display:none —
   display:none would strip the accessible name for screen readers. */
.content-area-email-subscription-prompt .gfield_label {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Invisible reCAPTCHA: the container must stay rendered for the widget to
   execute, so it is clipped rather than removed. position:absolute is doing real
   work — as a zero-width flex ITEM it still earned a 12px `gap`, which pushed the
   whole row 6px right of centre. Out of flow, it contributes nothing. The badge
   is position:fixed and unaffected. */
.content-area-email-subscription-prompt .gfield--type-captcha {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0;
}

/* GF puts the submit EITHER inline (a Submit field inside .gform_fields) OR in
   .gform_footer — never both, depending on the form's "Submit Button Location"
   setting. So the footer is neutralised, never hidden: hiding it would make the
   button vanish for anyone whose form is set to "End of Form", which is a
   miserable thing to debug. */
.content-area-email-subscription-prompt .gform_footer {
  margin: 0;
  padding: 0;
}

/* Submit — the theme owns its resting state. Most themes set
   input[type=submit] with !important on background, colour, size and radius;
   fighting that produces a button matching neither the theme nor the page. */
.content-area-email-subscription-prompt input[type="submit"] { cursor: pointer; }


/* ---------- Validation ---------- */
/* The error summary keeps a light surface so its red text stays legible; only
   text sitting directly on the band's ground is inverted. */
.content-area-email-subscription-prompt .gform_validation_errors {
  margin: 0 auto 14px;
  padding: 12px 14px;
  max-width: 420px;
  border: 1px solid var(--email-prompt-invalid);
  border-left-width: 4px;
  border-radius: 6px;
  background: var(--email-prompt-error-bg);
  box-shadow: none;
  text-align: left;
}
.content-area-email-subscription-prompt .gform_validation_errors > h2,
.content-area-email-subscription-prompt .gform_submission_error {
  margin: 0;
  max-width: none;
  font: 700 15px/1.4 var(--email-prompt-font);
  letter-spacing: normal;
  color: var(--email-prompt-error-fg);
  text-align: left;
}
.content-area-email-subscription-prompt .gfield_validation_message,
.content-area-email-subscription-prompt .validation_message {
  margin: 6px 0 0;
  padding: 0;
  border: 0;
  background: none;
  font: 400 14px/1.45 var(--email-prompt-font);
  color: var(--email-prompt-invalid);
  text-align: left;
}

/* --------------------------------------------------------------------------
   Gravity Forms error summary, on the Midnight band.

   The heading rule further up carries !important (needed to beat the block
   editor's inline colours) and it also matches the <h2> that Gravity Forms puts
   inside its error summary. That painted the summary white on its pale pink
   surface: 1.17:1, effectively invisible. Found by submitting the form empty.

   This wins on specificity — (0,2,1) against the heading rule's (0,1,1) — and
   only affects the summary, so the band's real headline stays white.
   -------------------------------------------------------------------------- */
.content-area-email-subscription-prompt .gform_validation_errors h2,
.content-area-email-subscription-prompt .gform_submission_error {
  color: #B3322A !important;
  max-width: none;
  text-align: left;
}


/* ---------- Confirmation ---------- */
.content-area-email-subscription-prompt .gform_confirmation_message {
  margin: 0;
  font: 500 17px/1.5 var(--email-prompt-font);
  color: var(--email-prompt-accent);
}

/* ================================================================== MOBILE */
@media (max-width: 900px) {
  .content-area-email-subscription-prompt {
    --email-prompt-gutter: 32px;
    --email-prompt-h-size: 30px;
  }
}
@media (max-width: 600px) {
  .content-area-email-subscription-prompt {
    --email-prompt-gutter: 20px;
    --email-prompt-pad-block: 56px;
    --email-prompt-h-size: 28px;
  }
  .content-area-email-subscription-prompt .gform_fields {
    flex-direction: column;
    align-items: stretch;
  }
  /* In a column flex container the flex-basis above is read as a HEIGHT —
     without this reset the email field becomes a 300px tall box. */
  .content-area-email-subscription-prompt .gfield--type-email,
  .content-area-email-subscription-prompt .gfield--type-text { flex: 0 0 auto; }
  .content-area-email-subscription-prompt .gfield--type-submit { width: 100%; }
  .content-area-email-subscription-prompt input[type="submit"] { width: 100%; }
}

/* The overlay's form is rendered here and moved into the dialog by script.
   Hidden but still RENDERED — display:none would stop invisible reCAPTCHA
   initialising and break Gravity Forms' field measurement on load. */
.synx-overlay-form-source {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0;
}

/* ===================== The Gravity Form inside the overlay ================= */

.synx-popup__dialog .gform_wrapper { margin: 0; }

/* Gravity Forms' own chrome. The block toggles cover title and description;
   the required-fields legend has no toggle, so it is hidden here. */
.synx-popup__dialog .gform_heading,
.synx-popup__dialog .gform_title,
.synx-popup__dialog .gform_description,
.synx-popup__dialog .gform_required_legend { display: none; }

/* Stacked and full width. The dialog is 440px — too narrow for the side-by-side
   row used on the Midnight band, which is what pushed the button against the
   right edge. */
.synx-popup__dialog .gform_fields {
  display: flex;
  flex-direction: column;
  gap: 12px;
  grid-template-columns: none;
}
.synx-popup__dialog .gfield { margin: 0; padding: 0; min-width: 0; }

/* The placeholder carries the label. Clipped rather than display:none, so
   screen readers keep the accessible name. */
.synx-popup__dialog .gfield_label {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* The invisible reCAPTCHA container: out of flow so it adds no gap, still
   rendered so the widget can run. */
.synx-popup__dialog .gfield--type-captcha {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0;
}

/* The floating badge. It is position:fixed, but its container moved into the
   dialog with the form, so it now paints inside the overlay's stacking context
   and lands on top. Hidden for this form only; the badges belonging to forms 21
   and 2 are untouched. */
.synx-popup__dialog .grecaptcha-badge { visibility: hidden; }

.synx-popup__dialog .gform_footer { margin: 0; padding: 0; }
.synx-popup__dialog .gform-button,
.synx-popup__dialog .gform_button,
.synx-popup__dialog input[type="submit"] { width: 100%; }

/* Validation and confirmation, on the dialog's white ground. */
.synx-popup__dialog .gfield_validation_message,
.synx-popup__dialog .validation_message {
  margin: 6px 0 0; padding: 0; border: 0; background: none;
  font: 400 14px/1.45 'DM Sans', Verdana, sans-serif;
  color: #B3322A;
}
.synx-popup__dialog .gform_validation_errors {
  margin: 0 0 12px; padding: 10px 12px;
  border: 1px solid #FF766C; border-left-width: 4px; border-radius: 6px;
  background: #FFE8E7; box-shadow: none;
}
.synx-popup__dialog .gform_validation_errors > h2,
.synx-popup__dialog .gform_submission_error {
  margin: 0; font: 700 15px/1.4 'DM Sans', Verdana, sans-serif; color: #B3322A;
}
.synx-popup__dialog .gform_confirmation_message {
  margin: 0; font: 500 16px/1.5 'DM Sans', Verdana, sans-serif; color: #007a94;
}

/* Once Gravity Forms swaps in its confirmation, "No thanks" has nothing left to
   decline — and reads a bit like an undo. Hide it and let the X be the exit.
   Targets the wrapping <label>, not the <span> inside it: hiding only the span
   would leave an invisible but still clickable box sitting under the message. */
.synx-popup__dialog:has(.gform_confirmation_message)
  .synx-hit:has(.synx-popup__decline) {
  display: none;
}

/* Pages built as a full takeover supply their own headline, so the theme's
   page title is redundant. Keyed to an explicit marker class rather than a
   page id (which changes if the page is ever recreated) or to .synx (which is
   the reusable markup wrapper, so it would silently apply anywhere that markup
   is reused).

   Hiding the title is only half of it. .page-header_wrapper is
   position:absolute, so it takes up no space in flow. The bannerless page
   template clears it with .page_content's 70px top padding PLUS the title's
   own height and bottom margin (~75px) -- the title was doing double duty as
   the spacer. Hide it and the hero slides up under the nav: measured 43.5px of
   overlap at 1651px wide, 89px at 582px.

   Hard-coding a replacement offset does not hold. The header is 113.5px tall,
   but .promo-bar wraps below ~1040px and takes it to ~130px, while the theme
   DROPS .page_content's top padding from 70px to 40px on mobile -- the two
   move in opposite directions. So put the header back into normal flow: <main>
   then begins at the header's bottom edge at any width, and padding-top below
   becomes a design decision instead of a clearance calculation. It is 0 so the
   hero panel meets the header edge, which is the point of a full bleed.

   NO .int-page OR .page QUALIFIER HERE, DELIBERATELY. The theme swaps both of
   those classes on the front page: .page-header_wrapper.int-page becomes
   .page-header_wrapper.home (transparent, not white), and .page-main.page
   becomes .page-main.home-page. It keys off is_front_page(), so the 404 page
   gets .int-page too. If this page is ever promoted to the front page under
   Settings -> Reading -- as planned for the two-week homepage takeover -- a
   qualified selector would silently stop matching, the header would revert to
   absolute, and because .home is transparent the nav would land directly on
   the hero. :has(.synx-takeover) already scopes all three rules to this page;
   the extra classes bought nothing and broke the swap. .page-main is kept on
   the last rule for specificity (0,3,0), which is what beats the theme's 70px.

   Verified at 1651px: header bottom 113.5px, hero top 153.5px, no overlap and
   no horizontal scroll. */
body:has(.synx-takeover) .page-header_wrapper {
  position: relative;
}
.page_content:has(.synx-takeover) > h1.h2-title {
  display: none;
}
.page-main .page_content:has(.synx-takeover) {
  padding-top: 0;
  padding-bottom: 40px;
}