/* ==========================================================
   VersaForge - Shopify SEO Services (page-scoped)
   ----------------------------------------------------------
   The creative-visual engine (.grs-frame, .grs-row-list,
   .grs-frame-bar-row, .grs-stat-tiles, keyframes, etc.) is
   already shared via assets/css/off-page-seo.css, loaded
   right before this file - nothing is duplicated here.

   This file only carries the handful of rules that are
   specific to the Shopify SEO layout itself, so the left and
   right columns in every split section land at equal height
   with zero empty space, matching the Off-Page SEO / On-Page
   SEO / Sales Performance Optimization pages.
   ========================================================== */

/* Stretch every split row on this page so its two columns
   share the same height, and make sure the visual side
   (which has no explicit height of its own) fills that
   height completely instead of collapsing to its content. */
[data-rail="Shopify SEO Solutions"] .split-row,
[data-rail="On-Page Shopify Optimization"] .split-row,
[data-rail="Link Building"] .split-row,
[data-rail="SEO Audit Report"] .split-row,
[data-rail="Expert Optimization"] .split-row,
[data-rail="Content Marketing"] .split-row {
  align-items: center;
}

[data-rail="Shopify SEO Solutions"] .grs-visual,
[data-rail="On-Page Shopify Optimization"] .grs-visual,
[data-rail="Link Building"] .grs-visual,
[data-rail="SEO Audit Report"] .grs-visual,
[data-rail="Expert Optimization"] .grs-visual,
[data-rail="Content Marketing"] .grs-visual {
  height: 100%;
  min-height: 360px;
}

/* Keep the four "Shopify Technical SEO Setup" cards and three
   "Local Shopify SEO Strategy Guide" cards visually anchored
   to the same baseline height inside their grid row. */
[data-rail="Technical SEO Setup"] .cards-row > *,
[data-rail="Local SEO Strategy"] .cards-row > * {
  display: flex;
}
[data-rail="Technical SEO Setup"] .service-card,
[data-rail="Local SEO Strategy"] .service-card {
  width: 100%;
}

/* The 10-item audit checklist runs longer than the shared
   .vf-points-grid default two-column layout was tuned for -
   keep it comfortably two-column at desktop widths so it
   doesn't stretch far taller than the visual beside it. */
[data-rail="SEO Audit Report"] .vf-points-grid {
  row-gap: .6rem;
}

/* CTA band: keep the copy and form columns visually balanced
   at equal height, matching every other split section. */
[data-rail="Get Started"] .cta-grid {
  align-items: stretch;
}
[data-rail="Get Started"] .cta-copy,
[data-rail="Get Started"] .cta-form-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media (prefers-reduced-motion: reduce) {
  [data-rail] .grs-visual * { animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}
