/* Final /ai spacing and alignment polish (margin-based vertical rhythm) */

body[data-ai-page="true"] #ai-prototype-root {
  --ai-vspace-xs: 0.5rem;
  --ai-vspace-sm: 0.875rem;
  --ai-vspace-md: 1.25rem;
  --ai-vspace-lg: 1.75rem;
  --ai-vspace-xl: 2.5rem;
  --ai-section-space: 0rem;
  --ai-hero-benefit-stack: 0.375rem;
  --ai-hero-benefit-icon-space: 0.5rem;
}

/* Transparent: pattern lives on #ai-prototype-root (avoids double-stacked dots vs root). */
body[data-ai-page="true"] .ai-page-main {
  background: transparent;
}

/* Section heading rhythm */
body[data-ai-page="true"] .ai-section-heading-block,
body[data-ai-page="true"] .ai-pricing-intro-heading,
body[data-ai-page="true"] .ai-faq-heading {
  margin-bottom: var(--ai-vspace-xl) !important;
}

body[data-ai-page="true"] .ai-section-title {
  margin-bottom: var(--ai-vspace-md) !important;
}

body[data-ai-page="true"] .ai-section-description {
  margin-bottom: 0 !important;
  line-height: 1.65;
}

/* Flex column stacks use sibling margins — layout grids keep their own gap tokens */
body[data-ai-page="true"] .ai-hero-trust,
body[data-ai-page="true"] .ai-pricing-intro-list,
body[data-ai-page="true"] .ai-pricing-features,
body[data-ai-page="true"] .ai-pricing-cta-wrap,
body[data-ai-page="true"] .ai-pricing-meta,
body[data-ai-page="true"] .ai-faq-list,
body[data-ai-page="true"] .ai-solution-prose,
body[data-ai-page="true"] .ai-story-paragraphs,
body[data-ai-page="true"] .ai-my-story-copy-stack,
body[data-ai-page="true"] .ai-hero-building-stack,
body[data-ai-page="true"] .ai-hero-building-lines,
body[data-ai-page="true"] .ai-countdown-modal-form {
  display: flex;
  flex-direction: column;
  gap: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
}

body[data-ai-page="true"] .ai-pricing-intro-list > * + *,
body[data-ai-page="true"] .ai-pricing-features > * + *,
body[data-ai-page="true"] .ai-pricing-cta-wrap > * + *,
body[data-ai-page="true"] .ai-pricing-meta > * + *,
body[data-ai-page="true"] .ai-faq-list > * + *,
body[data-ai-page="true"] .ai-my-story-copy-stack > * + *,
body[data-ai-page="true"] .ai-hero-building-stack > * + *,
body[data-ai-page="true"] .ai-hero-building-lines > * + *,
body[data-ai-page="true"] .ai-countdown-modal-form > * + * {
  margin-top: var(--ai-vspace-sm) !important;
}

body[data-ai-page="true"] .ai-hero-trust > * + * {
  margin-top: var(--ai-vspace-xs) !important;
}

/* Hero benefits — margin-only spacing (overrides prototype.css flex gap on .hero-benefit-item) */
body[data-ai-page="true"] .hero-benefits-container,
body[data-ai-page="true"] .ai-hero-benefits {
  display: flex;
  flex-direction: column;
  gap: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
}

body[data-ai-page="true"] .hero-benefit-item,
body[data-ai-page="true"] .ai-hero-benefit-item {
  display: flex;
  gap: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
}

body[data-ai-page="true"] .hero-benefit-item + .hero-benefit-item,
body[data-ai-page="true"] .ai-hero-benefit-item + .ai-hero-benefit-item,
body[data-ai-page="true"] .hero-benefits-container > * + *,
body[data-ai-page="true"] .ai-hero-benefits > * + * {
  margin-top: var(--ai-hero-benefit-stack) !important;
}

body[data-ai-page="true"] .ai-hero-benefit-check,
body[data-ai-page="true"] .hero-benefit-check,
body[data-ai-page="true"] .hero-benefit-icon {
  margin-right: var(--ai-hero-benefit-icon-space) !important;
  margin-top: 0.25rem !important;
  flex-shrink: 0 !important;
}

/* Core block spacing */
body[data-ai-page="true"] .ai-hero-wish-text {
  margin-bottom: var(--ai-vspace-md) !important;
}

body[data-ai-page="true"] .ai-hero-title {
  margin-bottom: var(--ai-vspace-md) !important;
  line-height: 1.2;
}

body[data-ai-page="true"] .ai-hero-subtitle {
  margin-bottom: var(--ai-vspace-lg) !important;
}

body[data-ai-page="true"] .ai-hero-cta-section {
  margin-bottom: var(--ai-vspace-xl) !important;
}

body[data-ai-page="true"] .ai-hero-author-wrap {
  margin-top: var(--ai-vspace-lg) !important;
}

/* Grid block spacing harmonization */
body[data-ai-page="true"] .ai-problem-block,
body[data-ai-page="true"] .ai-difference-inner,
body[data-ai-page="true"] .ai-credibility-block,
body[data-ai-page="true"] .ai-solution-grid-block,
body[data-ai-page="true"] .ai-features-section .stagger-container,
body[data-ai-page="true"] .ai-course-fit-grid,
body[data-ai-page="true"] .ai-time-saving-grid,
body[data-ai-page="true"] .ai-obsidian-bonus-grid {
  margin-bottom: var(--ai-vspace-xl);
}

body[data-ai-page="true"] .ai-projects-layout {
  margin-bottom: 0;
}

/* Enforce clean section-to-section vertical spacing */
body[data-ai-page="true"] .ai-page-main > .ai-page-block {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  background: transparent;
}

body[data-ai-page="true"] .ai-page-main > .ai-page-block + .ai-page-block {
  margin-top: 0 !important;
}

body[data-ai-page="true"] .ai-page-main > .ai-page-block > section.section-padding {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Problem/Solution section internal rhythm fix */
body[data-ai-page="true"] .ai-problem-block {
  margin-bottom: clamp(2rem, 3.2vw, 2.8rem) !important;
}

body[data-ai-page="true"] .ai-problem-inner {
  margin-bottom: clamp(1.25rem, 2.2vw, 1.8rem);
}

body[data-ai-page="true"] .ai-credibility-inner {
  margin-bottom: clamp(1.25rem, 2.2vw, 1.8rem);
}

body[data-ai-page="true"] .ai-credibility-block {
  margin-bottom: clamp(2rem, 3.2vw, 2.8rem) !important;
}

body[data-ai-page="true"] .ai-problem-block > .simple-paragraph:last-of-type {
  margin-bottom: clamp(2rem, 3vw, 2.75rem) !important;
}

body[data-ai-page="true"] .ai-solution-block {
  margin-top: 0 !important;
}

body[data-ai-page="true"] .ai-solution-grid {
  margin-bottom: clamp(2.2rem, 3.2vw, 3rem) !important;
}

body[data-ai-page="true"] .ai-difference-block {
  margin-top: clamp(2.2rem, 3.2vw, 3rem) !important;
}

/* Left alignment where readability benefits */
@media (min-width: 1024px) {
  body[data-ai-page="true"] .ai-feature-card,
  body[data-ai-page="true"] .ai-curriculum-card,
  body[data-ai-page="true"] .ai-solution-card,
  body[data-ai-page="true"] .ai-pricing-intro-left,
  body[data-ai-page="true"] .ai-difference-grid,
  body[data-ai-page="true"] .ai-problem-body-row,
  body[data-ai-page="true"] .ai-time-saving-text-col,
  body[data-ai-page="true"] .ai-my-story-copy-col {
    text-align: left !important;
  }

  body[data-ai-page="true"] .ai-feature-title,
  body[data-ai-page="true"] .ai-feature-description,
  body[data-ai-page="true"] .ai-solution-copy,
  body[data-ai-page="true"] .ai-pricing-meta,
  body[data-ai-page="true"] .ai-pricing-meta-line,
  body[data-ai-page="true"] .ai-pricing-meta-subline {
    text-align: left !important;
  }

  body[data-ai-page="true"] .ai-pricing-guarantee-line {
    justify-content: flex-start !important;
    text-align: left !important;
  }
}

/* Keep cards vertically breathable using margins, not stack gaps */
body[data-ai-page="true"] .ai-faq-item + .ai-faq-item,
body[data-ai-page="true"] .ai-feature-card + .ai-feature-card {
  margin-top: var(--ai-vspace-sm);
}

/* FAQ stack: enforce vertical separation with margins (not gap) */
body[data-ai-page="true"] .ai-faq-list {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

body[data-ai-page="true"] .ai-faq-item {
  margin-top: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0.75rem !important;
  margin-left: 0 !important;
}

body[data-ai-page="true"] .ai-faq-item + .ai-faq-item {
  margin-top: 0 !important;
}

body[data-ai-page="true"] .ai-faq-list > .ai-faq-item:first-child {
  margin-top: 0 !important;
}

body[data-ai-page="true"] .ai-faq-list > .ai-faq-item:last-child {
  margin-bottom: 0 !important;
}

@media (min-width: 768px) {
  body[data-ai-page="true"] .ai-faq-item {
    margin-bottom: 0.875rem !important;
  }
}

/* Slightly tighter mobile rhythm */
@media (max-width: 767px) {
  body[data-ai-page="true"] #ai-prototype-root {
    --ai-section-space: 0rem;
  }

  body[data-ai-page="true"] .ai-page-main > .ai-page-block > section.section-padding {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  body[data-ai-page="true"] .ai-section-heading-block,
  body[data-ai-page="true"] .ai-pricing-intro-heading,
  body[data-ai-page="true"] .ai-faq-heading {
    margin-bottom: var(--ai-vspace-lg) !important;
  }
}