/**
 * Rescape theme — frontend CSS.
 *
 * Tokens come from theme.json (see :root --wp--preset--*). This file only
 * defines component-level styling used by patterns and template parts.
 */

:root {
  --rescape-radius-card: 20px;
  --rescape-radius-img: 24px;
  --rescape-radius-pill: 999px;
  --rescape-shadow-soft: 0 1px 2px rgba(31, 36, 33, 0.04), 0 8px 24px rgba(31, 36, 33, 0.04);
  --rescape-shadow-card: 0 1px 2px rgba(31, 36, 33, 0.05), 0 18px 48px rgba(31, 36, 33, 0.06);
}

/* Smooth scroll for in-page anchors. */
html { scroll-behavior: smooth; }

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: "ss01", "cv11";
}

img { max-width: 100%; display: block; }

/* Heading display tweak: green emphasis used in the hero. */
.rescape-display em {
  font-style: normal;
  color: var(--wp--preset--color--primary);
}

/* ------------------------------------------------------------------------- */
/* Eyebrow + lead helpers                                                    */
/* ------------------------------------------------------------------------- */

.rescape-eyebrow {
  font-family: var(--wp--preset--font-family--sans);
  font-size: 0.75rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--wp--preset--color--ink);
  margin: 0 0 0.875rem;
}

.rescape-lead {
  max-width: 60ch;
  text-wrap: pretty;
  line-height: 1.55;
}

.rescape-eyebrow-pill {
  /* Block-level flex so margin-inline:auto actually centers the pill. */
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.875rem 0.5rem 0.625rem;
  border-radius: var(--rescape-radius-pill);
  background: var(--wp--preset--color--card-soft);
  border: 1px solid var(--wp--preset--color--line-soft);
  font-size: 0.8125rem;
  color: var(--wp--preset--color--ink-soft);
  width: fit-content;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0;
  margin-bottom: 1.75rem;
}
.rescape-eyebrow-pill__dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--wp--preset--color--primary);
  box-shadow: 0 0 0 4px rgba(0, 112, 0, 0.18);
  animation: rescape-pulse 2.4s ease-in-out infinite;
}
@keyframes rescape-pulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(0, 112, 0, 0.22); }
  50%      { box-shadow: 0 0 0 8px rgba(0, 112, 0, 0); }
}

/* ------------------------------------------------------------------------- */
/* Buttons                                                                    */
/* ------------------------------------------------------------------------- */

.rescape-btn .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  padding: 0.875rem 1.5rem;
  border-radius: var(--rescape-radius-pill);
  font-weight: 700;
  font-size: 0.9375rem;
  letter-spacing: -0.005em;
  border: 1px solid transparent;
  white-space: nowrap;
  transition: transform .25s cubic-bezier(.2, .7, .2, 1), background-color .25s, color .25s, border-color .25s, box-shadow .25s;
}
.rescape-btn .wp-block-button__link:hover { transform: translateY(-1px); }
.rescape-btn .wp-block-button__link:active { transform: translateY(0); }

.rescape-btn--primary .wp-block-button__link {
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--on-primary);
}
.rescape-btn--primary .wp-block-button__link:hover {
  background: var(--wp--preset--color--primary-deep);
  box-shadow: 0 8px 22px rgba(0, 112, 0, 0.28);
}

.rescape-btn--ghost .wp-block-button__link {
  background: transparent !important;
  color: var(--wp--preset--color--ink) !important;
  border-color: var(--wp--preset--color--line);
}
.rescape-btn--ghost .wp-block-button__link:hover {
  background: var(--wp--preset--color--background-warm) !important;
  border-color: var(--wp--preset--color--ink-soft);
}

.rescape-btn--block,
.rescape-btn--block .wp-block-button__link {
  width: 100%;
}

/* ------------------------------------------------------------------------- */
/* Header                                                                     */
/* ------------------------------------------------------------------------- */

.rescape-header {
  background: var(--wp--preset--color--background);
  border-bottom: 1px solid var(--wp--preset--color--line-soft);
  padding-top: 0;
  padding-bottom: 0;
}
.rescape-header > .wp-block-group {
  min-height: 76px;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  flex-wrap: wrap;
}
.rescape-header .wp-block-site-logo img {
  height: 30px !important;
  width: auto !important;
  max-width: none;
}
.rescape-header__nav .wp-block-navigation-item__content {
  font-size: 1rem;
  font-weight: 500;
  color: var(--wp--preset--color--ink);
  position: relative;
  padding: 0.375rem 0;
  transition: color .2s;
}
.rescape-header__nav .wp-block-navigation-item__content::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1px;
  background: var(--wp--preset--color--ink);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s cubic-bezier(.2, .7, .2, 1);
}
.rescape-header__nav .wp-block-navigation-item__content:hover::after {
  transform: scaleX(1);
}
.rescape-header .rescape-btn .wp-block-button__link {
  padding: 0.625rem 1.125rem;
  font-size: 0.875rem;
}

/* ------------------------------------------------------------------------- */
/* Section padding / sec-head                                                 */
/* ------------------------------------------------------------------------- */

.rescape-section {
  padding-top: var(--wp--preset--spacing--huge) !important;
  padding-bottom: var(--wp--preset--spacing--huge) !important;
}
.rescape-sec-head {
  text-align: center;
  /* Force narrow centered band: WP's constrained-layout rule sets max-width
     to the global content-size (980px) at the same specificity (0,1,0), so
     we use !important to ensure the 760px override wins regardless of
     stylesheet load order. */
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-bottom: 4rem;
}
.rescape-sec-head > * { text-align: center; }
.rescape-sec-head .rescape-display { margin-top: 0.9rem; margin-bottom: 3.3rem; }
.rescape-sec-head .rescape-lead { margin-left: auto; margin-right: auto; }

/* ------------------------------------------------------------------------- */
/* Hero                                                                       */
/* ------------------------------------------------------------------------- */

.rescape-hero {
  position: relative;
  overflow: hidden;
  padding-top: var(--wp--preset--spacing--xl) !important;
  padding-bottom: 6rem !important;
}
.rescape-hero h1 { margin: 0 0 1.5rem; }
.rescape-hero__sub {
  margin: 0 auto 2.25rem !important;
  max-width: 64ch;
  text-wrap: pretty;
}
.rescape-hero__meta {
  font-size: 0.875rem;
  color: var(--wp--preset--color--ink-soft);
  font-weight: 500;
}
.rescape-hero__meta p {
  display: inline-flex;
  gap: 0.5rem;
  align-items: center;
  margin: 0;
}
.rescape-check {
  display: inline-block;
  width: 18px; height: 18px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23007000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><path d='M4 12.5l5 5L20 6.5'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.rescape-hero__visual {
  position: relative;
  margin: 5rem auto 0;
  max-width: 1120px;
  padding-left: var(--wp--preset--spacing--lg);
  padding-right: var(--wp--preset--spacing--lg);
}
.rescape-hero__shape {
  position: absolute;
  inset: -40px var(--wp--preset--spacing--md) -40px var(--wp--preset--spacing--md);
  background: radial-gradient(ellipse at center, var(--wp--preset--color--card) 0%, var(--wp--preset--color--card-soft) 55%, transparent 80%);
  border-radius: 40px;
  z-index: 0;
  pointer-events: none;
}

/* ------------------------------------------------------------------------- */
/* Trust bar                                                                  */
/* ------------------------------------------------------------------------- */

.rescape-trust {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important;
  border-top: 1px solid var(--wp--preset--color--line-soft);
  border-bottom: 1px solid var(--wp--preset--color--line-soft);
}
.rescape-trust__label {
  text-align: center !important;
  margin: 0 auto 1.75rem !important;
  letter-spacing: 0.04em;
}
.rescape-trust__row {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr);
  gap: 2rem;
  align-items: center;
}
.rescape-trust__logo {
  margin: 0;
  text-align: center;
  color: var(--wp--preset--color--ink-mute);
  opacity: 0.7;
  font-weight: 600;
  font-size: 1.0625rem;
  letter-spacing: -0.01em;
  transition: opacity .25s, color .25s;
}
.rescape-trust__logo:hover { opacity: 1; color: var(--wp--preset--color--ink); }
.rescape-trust__logo--serif {
  font-family: var(--wp--preset--font-family--display);
  font-size: 1.375rem;
  font-weight: 400;
}
.rescape-trust__logo--mono {
  font-family: var(--wp--preset--font-family--mono);
  font-size: 0.8125rem;
  letter-spacing: 0.16em;
}
.rescape-trust__logo--bold {
  font-weight: 800;
  letter-spacing: -0.02em;
  font-size: 1.125rem;
}
.rescape-trust__logo--italic {
  font-style: italic;
  font-family: var(--wp--preset--font-family--display);
  font-size: 1.375rem;
}
.rescape-trust__logo--wide {
  letter-spacing: 0.18em;
  font-size: 0.75rem;
  font-weight: 600;
}

/* ------------------------------------------------------------------------- */
/* Feature grid                                                               */
/* ------------------------------------------------------------------------- */

.rescape-features__head {
  margin-bottom: 5rem !important;
  align-items: end;
}
.rescape-features__head h2 { margin: 0; }
.rescape-features__head .rescape-lead { margin: 0; }

.rescape-features__grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 3rem 2rem !important;
}
.rescape-feat {
  display: flex !important;
  flex-direction: column;
  gap: 0.875rem !important;
}
.rescape-feat__icon {
  width: 36px; height: 36px;
  color: var(--wp--preset--color--primary);
}
.rescape-feat__icon svg { width: 100%; height: 100%; }
.rescape-feat h4 {
  font-family: var(--wp--preset--font-family--sans);
  font-weight: 600;
  letter-spacing: -0.005em;
  margin: 0;
}
.rescape-feat p { margin: 0; line-height: 1.55; }

/* ------------------------------------------------------------------------- */
/* Visual break / framed images                                               */
/* ------------------------------------------------------------------------- */

.rescape-visual-break {
  padding-top: var(--wp--preset--spacing--xl) !important;
  padding-bottom: var(--wp--preset--spacing--xl) !important;
}

.rescape-framed {
  position: relative;
  display: block;
  padding: 14px;
}
.rescape-framed__frame {
  position: absolute;
  inset: -8px;
  border-radius: calc(var(--rescape-radius-img) + 14px);
  background: var(--wp--preset--color--card);
  box-shadow: 0 1px 2px rgba(26, 31, 27, 0.04), 0 24px 56px rgba(26, 31, 27, 0.08);
  z-index: 0;
  --rot: -2deg;       /* counter-clockwise, per design */
  transform: rotate(var(--rot));
  transition: transform .6s cubic-bezier(.2, .7, .2, 1);
  pointer-events: none;
}
.rescape-framed--right .rescape-framed__frame { --rot: -2.6deg; }
.rescape-framed--small { padding: 12px; }
.rescape-framed--small .rescape-framed__frame { inset: -4px; --rot: -2deg; }
html.rescape-no-frame-rotate .rescape-framed__frame { --rot: 0deg !important; }

.rescape-framed__inner {
  position: relative;
  z-index: 1;
  border-radius: var(--rescape-radius-img);
  overflow: hidden;
  background: var(--wp--preset--color--card-soft);
}
.rescape-framed__img {
  display: block;
  width: 100%;
  height: var(--rescape-img-h, auto);
  object-fit: var(--rescape-img-fit, initial);
}

/* ------------------------------------------------------------------------- */
/* Value prop / split                                                         */
/* ------------------------------------------------------------------------- */

.rescape-split {
  align-items: center;
}
.rescape-split .rescape-bullets {
  list-style: none;
  padding: 0;
  margin: 2rem 0 2.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.125rem;
}
.rescape-split .rescape-bullets li {
  position: relative;
  padding-left: 2.25rem;
  font-size: 1rem;
  color: var(--wp--preset--color--ink);
}
.rescape-split .rescape-bullets li::before {
  content: "";
  position: absolute;
  left: 0; top: 0.125rem;
  width: 22px; height: 22px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23007000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M4 12.5l5 5L20 6.5'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
}

/* ------------------------------------------------------------------------- */
/* Pricing                                                                    */
/* ------------------------------------------------------------------------- */

.rescape-pricing__grid {
  max-width: 980px;
  margin-left: auto !important;
  margin-right: auto !important;
  align-items: stretch !important;
}
.rescape-price-card {
  background: var(--wp--preset--color--card-soft);
  border: 1px solid var(--wp--preset--color--line-soft);
  border-radius: var(--rescape-radius-card);
  padding: 2.5rem 2rem !important;
  display: flex !important;
  flex-direction: column;
  gap: 1.5rem;
  transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s, border-color .35s;
  position: relative;
}
.rescape-price-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--rescape-shadow-card);
}
.rescape-price-card--featured {
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--on-primary);
  border-color: var(--wp--preset--color--primary);
}
.rescape-price-card--featured .rescape-price__name,
.rescape-price-card--featured .rescape-price__amt,
.rescape-price-card--featured .rescape-price__amt small {
  color: var(--wp--preset--color--on-primary);
}
.rescape-price-card--featured .rescape-price__sub,
.rescape-price-card--featured .rescape-price__feats li {
  color: rgba(248, 247, 242, 0.92);
}
.rescape-price-card--featured .rescape-price__divider {
  background-color: rgba(248, 247, 242, 1) !important;
  color: rgba(248, 247, 242, 1) !important;
}
.rescape-price-card--featured .rescape-btn--primary .wp-block-button__link {
  background: var(--wp--preset--color--on-primary);
  color: var(--wp--preset--color--primary-deep);
}
.rescape-price-card--featured .rescape-btn--primary .wp-block-button__link:hover {
  background: #fff;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
}
.rescape-price__badge {
  position: absolute;
  top: -12px; left: 50%;
  transform: translateX(-50%);
  background: var(--wp--preset--color--ink);
  color: var(--wp--preset--color--background);
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 6px 14px;
  border-radius: var(--rescape-radius-pill);
  font-weight: 500;
  margin: 0;
}
.rescape-price__name {
  font-family: var(--wp--preset--font-family--display);
  font-weight: 700;
  letter-spacing: -0.015em;
  margin: 0 !important;
}
.rescape-price__sub {
  font-size: 0.9375rem;
  margin: 0.25rem 0 0;
  color: var(--wp--preset--color--ink-soft);
}
.rescape-price__amt {
  font-family: var(--wp--preset--font-family--display);
  font-size: clamp(2.25rem, 4vw, 3.5rem);
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1;
  display: flex;
  align-items: baseline;
  gap: 0.625rem;
  flex-wrap: wrap;
  margin: 0;
}
.rescape-price__amt small {
  font-family: var(--wp--preset--font-family--sans);
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: 0;
  color: var(--wp--preset--color--ink-soft);
}
.rescape-price__divider {
  margin: 0 !important;
  border: 0;
  height: 1px;
  background-color: var(--wp--preset--color--ink);
}
.rescape-price__feats {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}
.rescape-price__feats li {
  position: relative;
  padding-left: 2.125rem;
  font-size: 0.96875rem;
  color: var(--wp--preset--color--ink);
}
.rescape-price__feats li::before {
  content: "";
  position: absolute;
  left: 0; top: 0.125rem;
  width: 20px; height: 20px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23007000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M4 12.5l5 5L20 6.5'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
}
.rescape-price-card--featured .rescape-price__feats li::before {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F8F7F2' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='M4 12.5l5 5L20 6.5'/></svg>");
}
.rescape-price-card .wp-block-buttons { margin-top: auto; }
.rescape-pricing__note {
  margin-top: 2.25rem !important;
}
.rescape-pricing__note a {
  color: var(--wp--preset--color--primary);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 1px;
}

/* ------------------------------------------------------------------------- */
/* Testimonial                                                                */
/* ------------------------------------------------------------------------- */

.rescape-testimonial__quote {
  font-family: var(--wp--preset--font-family--display);
  font-size: clamp(1.625rem, 2.6vw, 2.5rem);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -0.015em;
  color: var(--wp--preset--color--ink);
  margin: 1.125rem 0 0;
  text-wrap: pretty;
  border: none;
  padding: 0;
}
.rescape-testimonial__quote p { margin: 0; }
.rescape-testimonial__quote::before {
  content: "\201C";
  display: block;
  font-size: 1.6em;
  line-height: 0.6;
  color: var(--wp--preset--color--primary);
  margin-bottom: 1rem;
}
.rescape-testimonial__quote cite {
  display: block;
  margin-top: 2rem;
  font-style: normal;
  font-size: 0.9375rem;
}
.rescape-testimonial__quote cite strong {
  font-weight: 600;
  font-family: var(--wp--preset--font-family--sans);
}
.rescape-testimonial__role {
  font-family: var(--wp--preset--font-family--sans);
  font-size: 0.875rem;
  font-weight: 400;
  color: var(--wp--preset--color--ink-mute);
}

/* ------------------------------------------------------------------------- */
/* Process                                                                    */
/* ------------------------------------------------------------------------- */

.rescape-process { background: var(--wp--preset--color--card-soft); }
.rescape-step .rescape-step__num {
  font-family: var(--wp--preset--font-family--display);
  font-size: clamp(5rem, 10vw, 8.75rem);
  font-weight: 700;
  letter-spacing: -0.05em;
  color: var(--wp--preset--color--ink-mute);
  opacity: 0.55;
  line-height: 0.9;
  margin: 0 0 0.875rem;
}
.rescape-process__grid h3 {
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  margin: 0 0 0.875rem;
}
.rescape-process__grid p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.6;
  max-width: 36ch;
  color: var(--wp--preset--color--ink-soft);
}

/* ------------------------------------------------------------------------- */
/* Final CTA                                                                  */
/* ------------------------------------------------------------------------- */

.rescape-final-cta {
  padding-top: var(--wp--preset--spacing--xl) !important;
  padding-bottom: var(--wp--preset--spacing--huge) !important;
  text-align: center;
}
.rescape-final-cta h2 {
  margin: 0 auto 1.75rem;
  max-width: 18ch;
}
.rescape-final-cta .rescape-lead {
  margin: 0 auto 2rem;
  max-width: 50ch;
}

/* ------------------------------------------------------------------------- */
/* Footer                                                                     */
/* ------------------------------------------------------------------------- */

.rescape-ftr {
  border-top: 1px solid var(--wp--preset--color--line-soft);
  padding-top: 4rem !important;
  padding-bottom: 2.5rem !important;
}
.rescape-ftr__top { margin-bottom: 4rem !important; }
.rescape-ftr__brand .wp-block-site-logo img {
  height: 30px !important;
  width: auto !important;
  max-width: none;
}
.rescape-ftr__brand p {
  max-width: 32ch;
  margin: 1rem 0 0;
}
.rescape-ftr__title {
  font-size: 0.75rem !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--wp--preset--color--ink-mute) !important;
  font-weight: 500 !important;
  font-family: var(--wp--preset--font-family--sans) !important;
  margin: 0 0 1.125rem !important;
}
.rescape-ftr__col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.75rem; }
.rescape-ftr__col a {
  font-size: 0.90625rem;
  color: var(--wp--preset--color--ink);
  text-decoration: none;
  transition: color .2s;
}
.rescape-ftr__col a:hover { color: var(--wp--preset--color--primary); }
.rescape-ftr__bottom {
  padding-top: 2rem !important;
  border-top: 1px solid var(--wp--preset--color--line-soft);
}
.rescape-ftr__bottom p { margin: 0; }

/* ------------------------------------------------------------------------- */
/* Reveal-on-scroll                                                           */
/* ------------------------------------------------------------------------- */

.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .8s cubic-bezier(.2, .7, .2, 1), transform .8s cubic-bezier(.2, .7, .2, 1);
}
.reveal.is-in { opacity: 1; transform: none; }

/* ------------------------------------------------------------------------- */
/* Responsive                                                                 */
/* ------------------------------------------------------------------------- */

@media (max-width: 980px) {
  .rescape-section { padding-top: 6rem !important; padding-bottom: 6rem !important; }
  .rescape-features__grid { grid-template-columns: repeat(2, 1fr); gap: 2.5rem 1.5rem !important; }
  .rescape-features__head { gap: 1.5rem !important; margin-bottom: 3.5rem !important; }
  .rescape-trust__row { grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
  .rescape-process__grid p { max-width: none; }
  .rescape-pricing__grid { grid-template-columns: 1fr; }
  .rescape-header > .wp-block-group { gap: 0.75rem; }
  .rescape-header__nav { display: none; }
}

@media (max-width: 640px) {
  .rescape-features__grid { grid-template-columns: 1fr; }
  .rescape-trust__row { grid-template-columns: repeat(2, 1fr); }
  .rescape-hero__visual { margin-top: 3.5rem; }
  .rescape-hero__shape { inset: -20px 0 -20px 0; }
}

/* =========================================================================
   Custom block wrappers
   ========================================================================= */

/* Hero — inner wrapper (replaces the wp-block-group constrained container). */
.rescape-hero__inner {
  max-width: 980px;
  margin: 0 auto;
  padding: var(--wp--preset--spacing--xl) var(--wp--preset--spacing--lg) 4rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.rescape-hero__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wp--preset--spacing--sm);
  justify-content: center;
  margin-top: var(--wp--preset--spacing--lg);
}
.rescape-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wp--preset--spacing--md);
  justify-content: center;
  margin-top: var(--wp--preset--spacing--md);
}

/* Feature grid — two-column head (block render uses named children). */
.rescape-features__head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: end;
  margin-bottom: 5rem;
}
.rescape-features__head-left { display: flex; flex-direction: column; gap: 0.75rem; }
.rescape-features__head-left h2,
.rescape-features__head-left .rescape-display { margin: 0; }
.rescape-features__head-right .rescape-lead { margin: 0; }

/* Feature item — title and text selectors matching render.php output.
   Design: .feat h4 { font-size: 16px } / .feat p { font-size: 14.5px } */
.rescape-feat__title { font-family: var(--wp--preset--font-family--sans); font-size: 1rem; font-weight: 600; letter-spacing: -0.005em; margin: 0; }
.rescape-feat__text  { font-size: 14.5px; margin: 0; line-height: 1.55; }

/* Framed image — editor placeholder. */
.rescape-framed--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--wp--preset--color--card-soft);
  border: 2px dashed var(--wp--preset--color--line);
  border-radius: var(--rescape-radius-img);
  color: var(--wp--preset--color--ink-mute);
  font-size: 0.875rem;
  min-height: 200px;
}
.rescape-framed--placeholder .rescape-framed__frame { display: none; }

/* Testimonial — block render uses flexbox layout instead of wp-block-columns. */
.rescape-testimonial {
  display: grid;
  grid-template-columns: 45% 1fr;
  gap: 5rem;
  align-items: center;
}
.rescape-testimonial__portrait { display: flex; align-items: center; }
.rescape-testimonial__body     { display: flex; flex-direction: column; gap: 0; }

/* Process step — block render uses .rescape-step wrapper. */
.rescape-step { display: flex; flex-direction: column; }
.rescape-step h3 { font-weight: 700; letter-spacing: -0.015em; margin: 0 0 0.875rem; }
.rescape-step p  { margin: 0; line-height: 1.6; max-width: 36ch; }

/* Process grid — matches render.php div.rescape-process__grid. */
.rescape-process__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--wp--preset--spacing--xl) 4rem;
  margin-top: 4rem;
}

/* CTA section — inner text body. Block layout (no flex) so text-align:center
   cascades normally. Design: .final-cta { text-align:center }, children use
   margin:0 auto for width-capped centering.                                 */
.rescape-cta__body {
  /* No max-width here — the .rescape-sec-head inside uses its own
     max-width: 760px + margin: auto to center within the container. */
  margin-top: 4rem;
  text-align: center;
}
.rescape-cta__body .rescape-sec-head,
.rescape-cta__body .wp-block-rescape-section-header { text-align: center; }
.rescape-cta__body .rescape-eyebrow,
.rescape-cta__body .rescape-display,
.rescape-cta__body .rescape-lead { text-align: center; }
.rescape-cta__body h2 { margin: 0 auto 1.75rem; max-width: 18ch; }
.rescape-cta__body .rescape-lead { margin: 0 auto 2rem; max-width: 50ch; }
.rescape-cta__body .wp-block-buttons,
.rescape-cta__body .rescape-cta__btn { margin-top: 2rem; justify-content: center; display: flex; }

/* Pricing grid — intentionally narrower than the 1240 px container.
   Design: .pricing__grid { max-width: 980px; margin: 0 auto }            */
.rescape-pricing__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--wp--preset--spacing--md);
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 4rem;
  align-items: stretch;
}

/* Responsive additions for new block wrappers. */
@media (max-width: 980px) {
  .rescape-features__head { grid-template-columns: 1fr; }
  .rescape-testimonial { grid-template-columns: 1fr; }
  .rescape-process__grid { grid-template-columns: 1fr; }
  .rescape-pricing__grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .rescape-hero__inner { padding-left: var(--wp--preset--spacing--md); padding-right: var(--wp--preset--spacing--md); }
  .rescape-cta__body { padding: 0 var(--wp--preset--spacing--md); }
}

/* =========================================================================
   Targeted fixes
   ========================================================================= */

/* --- Hero: remove stray bottom gradient (shape belongs behind a mockup
       image, not as a free-floating blob at the section bottom). --------- */
.rescape-hero__visual { display: none; }

/* --- Buttons: arrow added via CSS so it's never part of editable text. -- */
.rescape-btn--primary .wp-block-button__link::after,
.rescape-btn--primary a.wp-block-button__link::after {
  content: " →";
  display: inline-block;
  transition: transform .2s ease;
}
.rescape-btn--primary .wp-block-button__link:hover::after {
  transform: translateX(3px);
}

/* --- Section Header: left-aligned variant — two-column grid (heading left,
       lead right). Mirrors the design's .features__head layout.            */
.rescape-sec-head--left {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: end;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 5rem !important; /* 80px per design */
  text-align: left !important;
}
.rescape-sec-head--left .rescape-sec-head__col { text-align: left; }
.rescape-sec-head--left .rescape-eyebrow,
.rescape-sec-head--left .rescape-display { margin: 0; text-align: left; }
.rescape-sec-head--left .rescape-lead    { margin: 0; text-align: left; }

/* At tablet, stack the two columns vertically. */
@media (max-width: 980px) {
  .rescape-sec-head--left {
    grid-template-columns: 1fr;
    gap: var(--wp--preset--spacing--md);
    margin-bottom: 4rem !important;
  }
}

/* Inside a column: no grid, just left-aligned block stack.                 */
.wp-block-column .rescape-sec-head--left {
  display: block !important;
  margin-bottom: 4rem !important;
}
.wp-block-column .rescape-sec-head:not(.rescape-sec-head--left):not(.rescape-sec-head--right),
.wp-block-column .wp-block-rescape-section-header .rescape-sec-head {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
}
.wp-block-column .rescape-sec-head > * {
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* --- sec-head: children inherit text-align from the wrapper class.        */
.rescape-sec-head > * { text-align: inherit; }
.rescape-sec-head .rescape-lead { margin-left: auto; margin-right: auto; }

/* --- Feature Grid, Process, Pricing: section-header as first inner block.
   On the frontend, render.php places the section-header *outside* its grid
   container, so these rules are inert there. In the block editor the
   section-header is physically inside the grid container, so we force it to
   span all columns. margin-bottom on .rescape-sec-head (and the --left variant)
   already provides the visual gap before the first item.                      */
.rescape-features__grid > .rescape-sec-head,
.rescape-features__grid > .wp-block-rescape-section-header,
.rescape-process__grid > .rescape-sec-head,
.rescape-process__grid > .wp-block-rescape-section-header,
.rescape-pricing__grid > .rescape-sec-head,
.rescape-pricing__grid > .wp-block-rescape-section-header {
  grid-column: 1 / -1;
}
/* The process and pricing grids have margin-top: 4rem that was designed to
   separate them from an *external* section-header on the frontend. In the
   editor the header is the grid's first child, so that margin incorrectly
   pushes it away from the section top. Remove it in the editor canvas only. */
.editor-styles-wrapper .rescape-process__grid,
.editor-styles-wrapper .rescape-pricing__grid {
  margin-top: 0;
}

/* --- Pricing: footnote centered. ---------------------------------------- */
.rescape-pricing__note { text-align: center !important; }

/* --- CTA body: ensure buttons are centered. ----------------------------- */
.rescape-cta__body .rescape-cta__btn { justify-content: center; }
.rescape-final-cta .rescape-sec-head { margin-bottom: 0; }

/* --- Inner content wrapper: re-constrains alignfull sections back to the
       main container width (1240 px = contentSize) after they have broken out
       to full viewport. Design ref: --container = 1240px, padding: 0 32px.
       Applied manually inside every custom alignfull section block.    ---- */
.rescape-section__inner {
  max-width: var(--wp--style--global--content-size, 1240px);
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  padding-left: 32px;
  padding-right: 32px;
  box-sizing: border-box;
}

/* Mobile: tighten horizontal padding to match design (.container on ≤640px).
   Also override the root wp-site-blocks padding WordPress applies globally. */
@media (max-width: 640px) {
  .rescape-section__inner {
    padding-left: 22px;
    padding-right: 22px;
  }
  /* Root block wrapper padding (set from theme.json styles.spacing.padding) */
  .wp-site-blocks {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }
}

/* Remove horizontal padding from the outer section when the inner wrapper
   already provides it, to avoid double-padding. */
.rescape-section.alignfull {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* --- Framed image: section-level standalone needs max-width from parent,
       not a hard min-height. -------------------------------------------- */
.rescape-section.wp-block-rescape-framed-image,
.rescape-section .wp-block-rescape-framed-image {
  display: block;
  padding: 0;
}

/* --- Editor-only placeholder for blocks without image. ------------------ */
.rescape-framed--placeholder {
  min-height: 180px;
  background: var(--wp--preset--color--card-soft);
  border: 2px dashed var(--wp--preset--color--line);
  border-radius: var(--rescape-radius-img);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--wp--preset--color--ink-mute);
  font-size: 0.875rem;
}

/* --- Admin / editor font matching --------------------------------------- */
.editor-styles-wrapper,
.editor-styles-wrapper p,
.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3,
.editor-styles-wrapper h4 {
  font-family: var(--wp--preset--font-family--sans, "Atkinson Hyperlegible", system-ui, sans-serif);
}
