/* ==========================================================================
   Block bridge — makes core blocks render as the hand-built homepage did.

   Loaded after style.css. Everything here exists because core Group, Heading,
   Paragraph and Buttons blocks emit extra class names and inherit WordPress's
   flow-layout margins. The design lives in style.css; this file only
   reconciles the markup.

   Selectors are kept at one class deep wherever possible. WordPress wraps its
   own layout rules in :where(), which has zero specificity, so a single class
   here is enough to win — no !important, no stacked selectors.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Neutralise injected flow-layout spacing.

   WordPress applies margin-block-start to every child of a flow-layout Group.
   The hand-written homepage had no such margins, so the intended rhythm came
   entirely from style.css. Reset it inside the homepage wrappers and let the
   theme's own margins (which are two classes deep, so they still win) apply.
   -------------------------------------------------------------------------- */
.hero-grid > *,
.section-head > *,
.cta-copy > *,
.cta-inner > *,
.stats-grid > *,
.sol-grid > * {
  margin-block-start: 0;
  margin-block-end: 0;
}

/* Core Group adds no padding of its own; .wrap in style.css supplies it.
   Guard against a stray max-width if someone flips a Group to "constrained"
   in the editor, which would otherwise indent a full-bleed band. */
.wp-block-group.wrap {
  max-width: var(--wrap);
  padding: 0 32px;
}

/* --------------------------------------------------------------------------
   2. Headings.

   Core adds .wp-block-heading, which carries no visual weight of its own but
   does pick up flow margins. The type scale itself already comes from
   style.css (.hero h1, .section-head h2, .cta-inner h2).
   -------------------------------------------------------------------------- */
.wp-block-heading {
  margin: 0;
}

/* --------------------------------------------------------------------------
   3. Eyebrow as an editable paragraph.

   The original markup was <div class="eyebrow"><span class="line"></span>Text
   </div>. A block editor strips a bare <span>, so the rule is drawn with a
   pseudo-element instead and the eyebrow becomes an ordinary paragraph an
   editor can click into. .eyebrow itself still styles colour and type.
   -------------------------------------------------------------------------- */
p.eyebrow {
  margin: 0 0 22px;
}

.eyebrow.has-rule::before {
  content: "";
  display: inline-block;
  width: 26px;
  height: 1px;
  margin-right: 9px;
  background: currentColor;
  vertical-align: middle;
}

.section-head .eyebrow.has-rule::before {
  width: 22px;
}

/* --------------------------------------------------------------------------
   4. Buttons.

   Geometry mirrors .btn in style.css. Kept as a copy rather than a shared
   selector list because style.css is regenerated from the design source; if
   .btn changes there, change it here too.
   -------------------------------------------------------------------------- */
.wp-block-buttons .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  padding: 11px 22px;
  border-radius: 9px;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  white-space: nowrap;
  text-decoration: none;
  border: 0;
}

.is-style-edgeai-teal .wp-block-button__link {
  background: var(--teal);
  color: #fff;
}

.is-style-edgeai-teal .wp-block-button__link:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px -8px rgba(11, 88, 98, 0.55);
}

.is-style-edgeai-navy .wp-block-button__link {
  background: var(--navy);
  color: #fff;
}

.is-style-edgeai-navy .wp-block-button__link:hover {
  background: var(--navy-alt);
}

.is-style-edgeai-ghost-dark .wp-block-button__link {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.22);
  color: #fff;
}

.is-style-edgeai-ghost-dark .wp-block-button__link:hover {
  border-color: var(--teal-light);
  color: var(--teal-light);
}

.is-style-edgeai-ghost-navy .wp-block-button__link {
  background: transparent;
  border: 1px solid var(--line-dark);
  color: var(--navy);
}

.is-style-edgeai-ghost-navy .wp-block-button__link:hover {
  border-color: var(--navy);
  background: var(--navy);
  color: #fff;
}

/* Button rows. .hero-ctas already has its flex rule in style.css; these two
   are new groupings introduced by the block layout. */
.wp-block-buttons.section-head-cta {
  margin-top: 22px;
}

.wp-block-buttons.cta-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}

/* --------------------------------------------------------------------------
   5. CTA band.

   .cta-inner is flex space-between with exactly two children. The copy is now
   a Group rather than a bare <div>, so it needs the same flex behaviour the
   anonymous div had.
   -------------------------------------------------------------------------- */
.cta-copy {
  flex: 1 1 auto;
}

.cta-copy p {
  margin-top: 12px;
}

/* --------------------------------------------------------------------------
   6. Shortcode output.

   The mesh SVG arrives via [edgeai_mesh]. WordPress wraps shortcode output in
   a paragraph in some contexts; the SVG is absolutely positioned by
   .tablecloth-mesh, so the wrapper must not introduce space of its own.
   -------------------------------------------------------------------------- */
.stats > p:empty,
.cta-band > p:empty {
  display: none;
}
