/* =========================================================
   MILO PAGE: LANDING TEMPLATE
   File: milo-template-landing-localized.css
   Layer: 04-pages
   Scope: Landing template modules only

   Owns:
   - Hero
   - Opportunity
   - Solution
   - Proof strip spacing
   - Process
   - FAQ
   - CTA page-level tuning

   Notes:
   - Scoped to .milo-template-landing
   - Keeps template-specific values local for now
   - Shared values can be promoted later into global tokens
========================================================= */

/* #region 0) TEMPLATE TOKENS */
.milo-template-landing {
  /* #region Section padding */
  --milo-landing-hero-pad-top: var(--milo-pad-fluid-top-lg);
  --milo-landing-hero-pad-bottom: var(--milo-pad-fluid-bottom-lg);

  --milo-landing-opportunity-pad-top: var(--milo-pad-fluid-top-sm);
  --milo-landing-opportunity-pad-bottom: var(--milo-pad-fluid-bottom-lg);

  --milo-landing-solution-pad-top: var(--milo-pad-fluid-top-md);
  --milo-landing-solution-pad-bottom: var(--milo-pad-fluid-bottom-md);

  --milo-landing-execution-pad-top: var(--milo-pad-fluid-top-lg);
  --milo-landing-execution-pad-bottom: var(--milo-pad-fluid-bottom-lg);

  --milo-landing-proof-pad-top: var(--milo-pad-fluid-top-md);
  --milo-landing-proof-pad-bottom: var(--milo-pad-fluid-bottom-md);

  --milo-landing-process-pad-top: var(--milo-pad-fluid-top-md);
  --milo-landing-process-pad-bottom: var(--milo-pad-fluid-bottom-md);

  --milo-landing-faq-pad-top: var(--milo-pad-fluid-top-md);
  --milo-landing-faq-pad-bottom: var(--milo-pad-fluid-bottom-md);
  /* #endregion Section padding */

  /* #region Grid spacing */
  --milo-landing-opportunity-grid-column-gap: var(--milo-gap-fluid-lg);
  --milo-landing-opportunity-grid-row-gap: var(--milo-gap-fluid-xl);

  --milo-landing-solution-grid-column-gap: var(--milo-gap-fluid-2xl);
  --milo-landing-solution-grid-row-gap: var(--milo-gap-fluid-3xl);

  --milo-landing-process-grid-column-gap: var(--milo-gap-fluid-3xl);
  --milo-landing-process-grid-row-gap: var(--milo-gap-fluid-2xl);
  /* #endregion Grid spacing */

  /* #region Text measures */
  --milo-landing-intro-title-max: var(--milo-measure-24);
  --milo-landing-intro-subline-max: var(--milo-measure-38);
  --milo-landing-card-title-max: var(--milo-measure-24);
  --milo-landing-card-body-max: var(--milo-measure-44);

  --milo-landing-process-card-last-title-max: calc(
    var(--milo-landing-card-title-max) - 8ch
  );
  --milo-landing-process-card-last-body-max: calc(
    var(--milo-landing-card-body-max) - 12ch
  );

  --milo-landing-opportunity-body-last-p-max: initial;
  /* #endregion Text measures */

  /* #region Intro spacing */
  --milo-landing-intro-gap: var(--milo-gap-fluid-lg);
  --milo-landing-intro-margin-bottom: var(--milo-offset-fluid-lg);
  /* #endregion Intro spacing */

  /* #region Layout geometry */
  --milo-landing-opportunity-grid-ratio-a: 0.7fr;
  --milo-landing-opportunity-grid-ratio-b: 1fr;

  --milo-landing-solution-grid-cols: repeat(2, minmax(0, 1fr));
  --milo-landing-solution-grid-max-width: 90%;

  --milo-landing-process-grid-template-columns: 1.05fr 1.05fr 1.55fr;
  --milo-landing-process-grid-offset: 0;

  --milo-landing-opportunity-aside-pad-top: var(--milo-gap-fluid-2xl);
  /* #endregion Layout geometry */

  /* #region Surface + ambient */
  --milo-landing-hero-ambient-filter: brightness(1) contrast(1) saturate(0.5);
  --milo-ambient-fade-to-right: linear-gradient(
    90deg,
    rgba(4, 6, 10, 0.78) 0%,
    rgba(4, 6, 10, 0.62) 32%,
    rgba(4, 6, 10, 0.48) 100%
  );

  --milo-ambient-fade-to-bottom: linear-gradient(
    180deg,
    rgba(4, 6, 10, 0.42) 0%,
    rgba(4, 6, 10, 0.34) 44%,
    rgba(4, 6, 10, 0.5) 100%
  );
  --milo-landing-hero-ambient-before-background: var(
    --milo-ambient-fade-to-right
  );
  --milo-landing-hero-ambient-after-background: var(
    --milo-ambient-fade-to-bottom
  );
  --milo-landing-hero-ambient-right: 7%;
  --milo-landing-hero-ambient-width: min(18vw, 275px);
  --milo-landing-hero-ambient-opacity: 0.15;
  --milo-landing-hero-ambient-top: -175px;
  --milo-landing-hero-ambient-bottom: -120px;
  --milo-landing-hero-ambient-background-position: 64% 8%;

  --milo-landing-solution-overlay-height: 45%;
  --milo-landing-solution-overlay-opacity: 0.35;
  --milo-landing-solution-overlay-background: var(
    --milo-surface-lift-to-light-bottom
  );
  /* #endregion Surface + ambient */

  /* #region Solution cards */
  --milo-landing-solution-card-gap: var(--milo-gap-fluid-sm);
  --milo-landing-solution-card-padding: var(--milo-card-pad-block-md)
    var(--milo-card-pad-block-lg);
  --milo-landing-solution-card-radius: var(--milo-radius-lg);
  --milo-landing-solution-card-border-color: var(--milo-divider-soft);
  --milo-landing-solution-card-border-color-hover: var(--milo-divider);
  --milo-landing-solution-card-background: var(--milo-surface-grad-soft);
  --milo-landing-solution-card-shadow:
    0 0 0 1px var(--milo-shadow-highlight) inset,
    0 10px 28px var(--milo-shadow-ambient-soft);
  --milo-landing-solution-card-shadow-hover:
    0 0 0 1px var(--milo-shadow-highlight-strong) inset,
    0 20px 48px var(--milo-shadow-ambient);

  --milo-landing-solution-card-title-rule-bottom: -8px;
  --milo-landing-solution-card-rule-width: 44px;
  --milo-landing-solution-card-rule-background: var(--milo-surface-tint-1);

  --milo-landing-solution-card-offset-y: 0px;
  --milo-landing-solution-card-offset-y-alt: 20px;
  --milo-landing-solution-card-hover-lift: -4px;
  --milo-landing-solution-card-hover-lift-alt: -4px;
  /* #endregion Solution cards */

  /* #region Process */
  --milo-landing-process-card-gap: var(--milo-gap-xs);
  --milo-landing-process-card-divider-left: -16px;
  --milo-landing-process-card-divider-top: 42px;
  --milo-landing-process-card-divider-opacity-1: 0.35;
  --milo-landing-process-card-divider-opacity-2: 0.55;
  --milo-landing-process-card-divider-opacity-3: 0.75;
  --milo-landing-process-card-divider-background: var(--milo-rule-subtle);

  --milo-landing-process-card-label-opacity: 0.46;
  --milo-landing-process-card-rule-top: -5px;
  --milo-landing-process-card-rule-width: 34px;
  --milo-landing-process-card-rule-background: var(--milo-divider-weak);

  --milo-landing-process-card-last-offset-y: -8px;
  /* #endregion Process */

  /* #region FAQ */
  --milo-landing-faq-items-gap: var(--milo-gap-fluid-xl);
  --milo-landing-faq-item-gap: var(--milo-gap-fluid-sm);
  --milo-landing-faq-item-divider-top: -14px;
  --milo-landing-faq-item-divider-opacity: 0.6;
  --milo-landing-faq-item-divider-width: 75%;
  --milo-landing-faq-item-divider-background: var(--milo-rule-horizontal);
  --milo-landing-faq-item-title-rule-offset: -16px;
  --milo-landing-faq-item-title-rule-top: 0.7em;
  --milo-landing-faq-item-title-rule-width: 10px;
  --milo-landing-faq-item-title-rule-background: var(--milo-pink-wash);
  --milo-landing-faq-item-body-offset: 32px;
  /* #endregion FAQ */

  /* #region Typography polish */
  --milo-landing-intro-body-opacity: 0.94;
  --milo-landing-card-body-opacity: 0.9;
  /* #endregion Typography polish */

  /* #region Reveal */
  --milo-landing-reveal-y-base: 10px;
  --milo-landing-reveal-blur-base: 3px;

  --milo-landing-reveal-y-copy: 8px;
  --milo-landing-reveal-blur-copy: 2px;

  --milo-landing-reveal-y-label: 6px;
  --milo-landing-reveal-blur-label: 1.5px;

  --milo-landing-reveal-y-card: 12px;
  --milo-landing-reveal-blur-card: 2px;

  --milo-landing-delay-0: 0ms;
  --milo-landing-delay-1: 80ms;
  --milo-landing-delay-2: 160ms;
  --milo-landing-delay-3: 240ms;
  --milo-landing-delay-4: 320ms;
  --milo-landing-delay-5: 400ms;
  --milo-landing-delay-6: 300ms;
  --milo-landing-delay-7: 360ms;
  --milo-landing-delay-8: 420ms;
  /* #endregion Reveal */
}
/* #endregion TEMPLATE TOKENS */

/* #region 0.5) REVEAL CASCADE */
.milo-template-landing .milo-reveal {
  --milo-delay: var(--milo-landing-delay-0);
  --milo-reveal-y: var(--milo-landing-reveal-y-base);
  --milo-reveal-blur: var(--milo-landing-reveal-blur-base);
}

.milo-template-landing .milo-h1.milo-reveal,
.milo-template-landing .milo-h2.milo-reveal,
.milo-template-landing .milo-h3.milo-reveal,
.milo-template-landing .milo-h4.milo-reveal,
.milo-template-landing .milo-heading-group.milo-reveal,
.milo-template-landing .milo-body.milo-reveal,
.milo-template-landing .elementor-widget-text-editor.milo-reveal,
.milo-template-landing .milo-heading-subline.milo-reveal {
  --milo-reveal-y: var(--milo-landing-reveal-y-copy);
  --milo-reveal-blur: var(--milo-landing-reveal-blur-copy);
}

.milo-template-landing .milo-landing__solution-card.milo-reveal,
.milo-template-landing .milo-landing__faq-item.milo-reveal,
.milo-template-landing .milo-media-frame.milo-reveal,
.milo-template-landing .milo-landing__process-card.milo-reveal {
  --milo-reveal-y: var(--milo-landing-reveal-y-card);
  --milo-reveal-blur: var(--milo-landing-reveal-blur-card);
}

.milo-template-landing .milo-landing__solution-card.milo-reveal {
  --milo-reveal-blur: var(--milo-landing-reveal-blur-card);
}

.milo-template-landing .milo-landing__hero-label.milo-reveal,
.milo-template-landing .milo-landing__cta .milo-cta__rule.milo-reveal {
  --milo-delay: var(--milo-landing-delay-0);
  --milo-reveal-y: var(--milo-landing-reveal-y-label);
  --milo-reveal-blur: var(--milo-landing-reveal-blur-label);
}

.milo-template-landing .milo-landing__hero-title.milo-reveal,
.milo-template-landing .milo-landing__opportunity-title.milo-reveal,
.milo-template-landing .milo-landing__solution-title.milo-reveal,
.milo-template-landing .milo-landing__process-title.milo-reveal,
.milo-template-landing .milo-landing__faq-title.milo-reveal,
.milo-template-landing .milo-landing__cta-title.milo-reveal {
  --milo-delay: var(--milo-landing-delay-1);
  --milo-reveal-y: var(--milo-landing-reveal-y-base);
}

.milo-template-landing .milo-landing__hero-subline.milo-reveal,
.milo-template-landing .milo-landing__opportunity-body.milo-reveal,
.milo-template-landing .milo-landing__solution-subline.milo-reveal,
.milo-template-landing .milo-landing__process-subline.milo-reveal,
.milo-template-landing .milo-landing__faq-subline.milo-reveal,
.milo-template-landing .milo-landing__cta-subline.milo-reveal {
  --milo-delay: var(--milo-landing-delay-2);
}

.milo-template-landing .milo-landing__hero-button.milo-reveal,
.milo-template-landing .milo-landing__cta-button.milo-reveal {
  --milo-delay: var(--milo-landing-delay-3);
  --milo-reveal-y: var(--milo-landing-reveal-y-copy);
  --milo-reveal-blur: var(--milo-landing-reveal-blur-label);
}

.milo-template-landing .milo-landing__solution-card.milo-reveal:nth-child(1),
.milo-template-landing .milo-landing__process-card.milo-reveal:nth-child(1),
.milo-template-landing .milo-landing__faq-item.milo-reveal:nth-of-type(1) {
  --milo-delay: var(--milo-landing-delay-3);
}

.milo-template-landing .milo-landing__solution-card.milo-reveal:nth-child(2),
.milo-template-landing .milo-landing__process-card.milo-reveal:nth-child(2),
.milo-template-landing .milo-landing__cta-link.milo-reveal {
  --milo-delay: var(--milo-landing-delay-4);
}

.milo-template-landing .milo-landing__process-card.milo-reveal:nth-child(3) {
  --milo-delay: var(--milo-landing-delay-5);
  --milo-reveal-y: var(--milo-landing-reveal-y-base);
}

.milo-template-landing .milo-landing__faq-item.milo-reveal:nth-of-type(2) {
  --milo-delay: var(--milo-landing-delay-6);
}

.milo-template-landing .milo-landing__faq-item.milo-reveal:nth-of-type(3) {
  --milo-delay: var(--milo-landing-delay-7);
}

.milo-template-landing .milo-landing__faq-item.milo-reveal:nth-of-type(4) {
  --milo-delay: var(--milo-landing-delay-8);
}

.milo-template-landing .milo-landing__proof .milo-reveal {
  --milo-delay: var(--milo-landing-delay-0);
  --milo-reveal-y: var(--milo-landing-reveal-y-base);
  --milo-reveal-blur: var(--milo-landing-reveal-blur-copy);
}

.milo-template-landing .milo-landing__hero-ambient {
  transition: opacity var(--milo-reveal-dur) var(--milo-ease);
}
/* #endregion REVEAL CASCADE */

/* #region 1) PAGE SHELL */
.milo-template-landing .milo-section {
  position: relative;
  overflow: clip;
}

.milo-template-landing .milo-inner {
  position: relative;
  z-index: 1;
}

.milo-template-landing .milo-heading-group {
  gap: var(--milo-landing-intro-gap);
  padding-bottom: var(--milo-landing-intro-margin-bottom);
}

.milo-template-landing .milo-h1,
.milo-template-landing .milo-h2,
.milo-template-landing .milo-h3,
.milo-template-landing .milo-h4 {
  text-wrap: balance;
}

.milo-template-landing .milo-body p,
.milo-template-landing .elementor-widget-text-editor p {
  color: var(--milo-off-white);
  text-wrap: pretty;
}

.milo-template-landing .milo-landing__hero-title h1,
.milo-template-landing .milo-landing__opportunity-title h2,
.milo-template-landing .milo-landing__solution-title h2,
.milo-template-landing .milo-landing__process-title h2,
.milo-template-landing .milo-landing__faq-title h2 {
  max-width: var(--milo-landing-intro-title-max);
}

.milo-template-landing .milo-landing__hero-subline p,
.milo-template-landing .milo-landing__opportunity-body p,
.milo-template-landing .milo-landing__solution-subline p,
.milo-template-landing .milo-landing__process-subline p,
.milo-template-landing .milo-landing__faq-subline p {
  max-width: var(--milo-landing-intro-subline-max);
  opacity: var(--milo-landing-intro-body-opacity);
}

.milo-template-landing .milo-landing__solution-card-title h3,
.milo-template-landing .milo-landing__process-card-title h3,
.milo-template-landing .milo-landing__faq-item-title h3 {
  max-width: var(--milo-landing-card-title-max);
}

.milo-template-landing .milo-landing__solution-card-body p,
.milo-template-landing .milo-landing__process-card-body p,
.milo-template-landing .milo-landing__faq-item-body p {
  max-width: var(--milo-landing-card-body-max);
  opacity: var(--milo-landing-card-body-opacity);
}

.milo-template-landing p:last-child {
  margin-bottom: 0;
}
/* #endregion PAGE SHELL */

/* #region 2) HERO */
.milo-template-landing .milo-landing__hero {
  --milo-section-pad-top: var(--milo-landing-hero-pad-top);
  --milo-section-pad-bottom: var(--milo-landing-hero-pad-bottom);

  --milo-section-bg: var(--milo-bg-hero);
  --milo-section-before-display: block;
  --milo-section-before-bg: var(--milo-section-surface-hero);
}

.milo-template-landing .milo-landing__hero-inner {
  z-index: 2;
}

.milo-template-landing .milo-landing__hero-ambient {
  position: absolute;
  top: var(--milo-landing-hero-ambient-top);
  bottom: var(--milo-landing-hero-ambient-bottom);
  right: var(--milo-landing-hero-ambient-right);
  width: var(--milo-landing-hero-ambient-width);
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
  background-size: cover !important;
  background-repeat: no-repeat;
  background-position: var(
    --milo-landing-hero-ambient-background-position
  ) !important;
  opacity: var(--milo-landing-hero-ambient-opacity);
  filter: var(--milo-landing-hero-ambient-filter);
}

.milo-template-landing .milo-landing__hero-ambient::before,
.milo-template-landing .milo-landing__hero-ambient::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.milo-template-landing .milo-landing__hero-ambient::before {
  background: var(--milo-landing-hero-ambient-before-background);
}

.milo-template-landing .milo-landing__hero-ambient::after {
  background: var(--milo-landing-hero-ambient-after-background);
}
/* #endregion HERO */

/* #region 3) OPPORTUNITY */
.milo-template-landing .milo-landing__opportunity {
  --milo-section-pad-top: var(--milo-landing-opportunity-pad-top);
  --milo-section-pad-bottom: var(--milo-landing-opportunity-pad-bottom);

  --milo-section-bg: var(--milo-bg-base);
}

.milo-template-landing .milo-landing__opportunity-grid {
  --milo-grid-ratio-a: var(--milo-landing-opportunity-grid-ratio-a);
  --milo-grid-ratio-b: var(--milo-landing-opportunity-grid-ratio-b);
  align-items: start;
  column-gap: var(--milo-landing-opportunity-grid-column-gap);
  row-gap: var(--milo-landing-opportunity-grid-row-gap);
}

.milo-template-landing .milo-landing__opportunity-aside {
  padding-top: var(--milo-landing-opportunity-aside-pad-top);
}
/* #endregion OPPORTUNITY */

/* #region 4) SOLUTION */
.milo-template-landing .milo-landing__solution {
  --milo-section-pad-top: var(--milo-landing-solution-pad-top);
  --milo-section-pad-bottom: var(--milo-landing-solution-pad-bottom);

  --milo-section-bg: var(--milo-bg-lift);
  --milo-section-after-display: block;
  --milo-section-after-bg: var(--milo-landing-solution-overlay-background);
  --milo-section-after-height: var(--milo-landing-solution-overlay-height);
}

.milo-template-landing .milo-landing__solution-grid {
  max-width: var(--milo-landing-solution-grid-max-width);
  grid-template-columns: var(--milo-landing-solution-grid-cols);
  align-items: start;
  column-gap: var(--milo-landing-solution-grid-column-gap);
  row-gap: var(--milo-landing-solution-grid-row-gap);
}

.milo-template-landing .milo-landing__solution-card {
  padding: var(--milo-landing-solution-card-padding);
  border-radius: var(--milo-landing-solution-card-radius);
  margin-top: var(--milo-landing-solution-card-offset-y);
  justify-content: flex-start;
  gap: var(--milo-landing-solution-card-gap);
  background: var(--milo-landing-solution-card-background);
  box-shadow: var(--milo-landing-solution-card-shadow);
  border: 1px solid var(--milo-landing-solution-card-border-color);
  transition:
    transform var(--milo-med) var(--milo-ease),
    box-shadow var(--milo-med) var(--milo-ease),
    border-color var(--milo-med) var(--milo-ease),
    background-color var(--milo-med) var(--milo-ease);
}

.milo-template-landing
  .milo-landing__solution-grid
  > .milo-landing__solution-card:nth-child(2) {
  margin-top: var(--milo-landing-solution-card-offset-y-alt);
}

.milo-template-landing .milo-landing__solution-card:hover {
  transform: translateY(var(--milo-landing-solution-card-hover-lift));
  border-color: var(--milo-landing-solution-card-border-color-hover);
  box-shadow: var(--milo-landing-solution-card-shadow-hover);
}

.milo-template-landing .milo-landing__solution-card-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: var(--milo-landing-solution-card-title-rule-bottom);
  width: var(--milo-landing-solution-card-rule-width);
  height: 1px;
  background: var(--milo-landing-solution-card-rule-background);
}
/* #endregion SOLUTION */

/* #region 5) PROOF */
.milo-template-landing .milo-landing__proof {
  --milo-section-pad-top: var(--milo-landing-proof-pad-top);
  --milo-section-pad-bottom: var(--milo-landing-proof-pad-bottom);

  --milo-section-bg: var(--milo-bg-base);
  --milo-section-before-display: block;
  --milo-section-before-bg: var(--milo-section-surface-lift);
}
/* #endregion PROOF */

/* #region 6) PROCESS */
.milo-template-landing .milo-landing__process {
  --milo-section-pad-top: var(--milo-landing-process-pad-top);
  --milo-section-pad-bottom: var(--milo-landing-process-pad-bottom);

  --milo-section-bg: var(--milo-bg-base);
}

.milo-template-landing .milo-landing__process-grid {
  grid-template-columns: var(--milo-landing-process-grid-template-columns);
  align-items: start;
  column-gap: var(--milo-landing-process-grid-column-gap);
  row-gap: var(--milo-landing-process-grid-row-gap);
  padding-left: var(--milo-landing-process-grid-offset);
}

.milo-template-landing .milo-landing__process-card {
  position: relative;
  min-height: 0;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  justify-content: flex-start;
  gap: var(--milo-landing-process-card-gap);
}

.milo-template-landing .milo-landing__process-card::after {
  content: "";
  position: absolute;
  left: var(--milo-landing-process-card-divider-left);
  top: var(--milo-landing-process-card-divider-top);
  bottom: 0;
  width: 1px;
  background: var(--milo-landing-process-card-divider-background);
}

.milo-template-landing .milo-landing__process-card::before {
  content: "";
  display: block;
  width: var(--milo-landing-process-card-rule-width);
  height: 1px;
  top: var(--milo-landing-process-card-rule-top);
  background: var(--milo-landing-process-card-rule-background);
}

.milo-template-landing
  .milo-landing__process-card-label
  .elementor-heading-title {
  opacity: var(--milo-landing-process-card-label-opacity);
}

.milo-template-landing .milo-landing__process-card:nth-child(3) {
  margin-top: var(--milo-landing-process-card-last-offset-y);
}

.milo-template-landing
  .milo-landing__process-card:nth-child(3)
  .milo-landing__process-card-title
  h3 {
  max-width: var(--milo-landing-process-card-last-title-max);
}

.milo-template-landing
  .milo-landing__process-card:nth-child(3)
  .milo-landing__process-card-body
  p {
  max-width: var(--milo-landing-process-card-last-body-max);
}

.milo-template-landing .milo-landing__process-card:nth-child(1)::after {
  opacity: var(--milo-landing-process-card-divider-opacity-1);
}

.milo-template-landing .milo-landing__process-card:nth-child(2)::after {
  opacity: var(--milo-landing-process-card-divider-opacity-2);
}

.milo-template-landing .milo-landing__process-card:nth-child(3)::after {
  opacity: var(--milo-landing-process-card-divider-opacity-3);
}
/* #endregion PROCESS */

/* #region 7) FAQ */
.milo-template-landing .milo-landing__faq {
  --milo-section-pad-top: var(--milo-landing-faq-pad-top);
  --milo-section-pad-bottom: var(--milo-landing-faq-pad-bottom);

  --milo-section-bg: var(--milo-bg-base);
}

.milo-template-landing .milo-landing__faq-items {
  gap: var(--milo-landing-faq-items-gap);
}

.milo-template-landing .milo-landing__faq-item {
  gap: var(--milo-landing-faq-item-gap);
}

.milo-template-landing .milo-landing__faq-item::before {
  content: "";
  position: absolute;
  top: var(--milo-landing-faq-item-divider-top);
  left: 0;
  right: 0;
  width: var(--milo-landing-faq-item-divider-width);
  height: 1px;
  pointer-events: none;
  background: var(--milo-landing-faq-item-divider-background);
  opacity: var(--milo-landing-faq-item-divider-opacity);
}

.milo-template-landing .milo-landing__faq-item-title::before {
  content: "";
  position: absolute;
  left: var(--milo-landing-faq-item-title-rule-offset);
  top: var(--milo-landing-faq-item-title-rule-top);
  width: var(--milo-landing-faq-item-title-rule-width);
  height: 1px;
  background: var(--milo-landing-faq-item-title-rule-background);
  border-radius: 0;
  box-shadow: none;
}

.milo-template-landing .milo-landing__faq-item-body p {
  padding-left: var(--milo-landing-faq-item-body-offset);
}
/* #endregion FAQ */

/* #region 8) CTA */
.milo-template-landing .milo-landing__cta {
  --milo-section-bg: var(--milo-section-surface-cta);
  --milo-section-before-display: block;
  --milo-section-before-bg: var(--milo-section-light-cta);
}
/* #endregion CTA */

/* #region 9) RESPONSIVE */
@media (max-width: 1199.98px) {
  .milo-template-landing {
    --milo-landing-intro-title-max: var(--milo-measure-24);
    --milo-landing-intro-subline-max: var(--milo-measure-40);
    --milo-landing-card-title-max: var(--milo-measure-20);
    --milo-landing-card-body-max: var(--milo-measure-32);

    --milo-landing-hero-ambient-width: min(20vw, 220px);
    --milo-landing-hero-ambient-opacity: 0.18;
    --milo-landing-hero-ambient-right: 6%;
  }
}

@media (max-width: 1024px) {
  .milo-template-landing {
    --milo-landing-intro-title-max: var(--milo-measure-20);
    --milo-landing-intro-subline-max: var(--milo-measure-34);
    --milo-landing-card-title-max: var(--milo-measure-20);
    --milo-landing-card-body-max: var(--milo-measure-32);

    --milo-landing-process-grid-offset: 24px;

    --milo-landing-hero-ambient-width: min(22vw, 180px);
    --milo-landing-hero-ambient-opacity: 0.16;
    --milo-landing-hero-ambient-right: 6%;

    --milo-landing-opportunity-body-last-p-max: calc(
      var(--milo-landing-intro-subline-max) + 8ch
    );

    --milo-landing-opportunity-aside-pad-top: 0px;
  }

  .milo-template-landing .milo-landing__opportunity-body p:last-of-type {
    max-width: var(--milo-landing-opportunity-body-last-p-max);
  }

  .milo-template-landing .milo-landing__solution-grid {
    align-items: start;
  }

  .milo-template-landing .milo-landing__opportunity-grid {
    grid-template-columns: 1fr;
  }

  .milo-template-landing .milo-landing__solution-grid,
  .milo-template-landing .milo-landing__process-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .milo-template-landing .milo-landing__process-card:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 767.98px) {
  .milo-template-landing {
    --milo-landing-intro-title-max: var(--milo-measure-24);
    --milo-landing-intro-subline-max: var(--milo-measure-38);
    --milo-landing-card-title-max: var(--milo-measure-20);
    --milo-landing-card-body-max: var(--milo-measure-38);

    --milo-landing-faq-item-divider-width: 25%;
    --milo-landing-faq-item-title-rule-width: 6px;

    --milo-landing-solution-card-radius: var(--milo-radius-md);
    --milo-landing-solution-card-offset-y-alt: 0px;

    --milo-landing-hero-ambient-width: min(28vw, 120px);
    --milo-landing-hero-ambient-opacity: 0.12;
    --milo-landing-hero-ambient-right: 5%;
    --milo-landing-hero-ambient-top: -120px;
    --milo-landing-hero-ambient-bottom: -64px;

    --milo-landing-process-card-last-offset-y: 0px;

    --milo-landing-solution-grid-cols: 1fr;
  }

  .milo-template-landing .milo-landing__solution-grid,
  .milo-template-landing .milo-landing__process-grid {
    grid-template-columns: 1fr;
  }

  .milo-template-landing .milo-landing__process-card:last-child {
    grid-column: auto;
  }
}

@media (max-width: 479.98px) {
  .milo-template-landing {
    --milo-landing-intro-title-max: var(--milo-measure-14);
    --milo-landing-intro-subline-max: 90%;
    --milo-landing-card-title-max: var(--milo-measure-14);
    --milo-landing-card-body-max: var(--milo-measure-28);

    --milo-landing-faq-item-divider-width: 15%;
    --milo-landing-faq-item-body-offset: 12px;

    --milo-landing-solution-card-radius: var(--milo-radius-sm);

    --milo-landing-process-grid-offset: 8px;

    --milo-landing-hero-ambient-width: min(30vw, 90px);
    --milo-landing-hero-ambient-opacity: 0.1;
    --milo-landing-hero-ambient-right: 3%;
  }
}
/* #endregion RESPONSIVE */

/* #region 10) REDUCED MOTION */
@media (prefers-reduced-motion: reduce) {
  .milo-template-landing {
    --milo-landing-reveal-y-base: 0px;
    --milo-landing-reveal-blur-base: 0px;
    --milo-landing-reveal-y-copy: 0px;
    --milo-landing-reveal-blur-copy: 0px;
    --milo-landing-reveal-y-label: 0px;
    --milo-landing-reveal-blur-label: 0px;
    --milo-landing-reveal-y-card: 0px;
    --milo-landing-reveal-blur-card: 0px;

    --milo-landing-delay-0: 0ms;
    --milo-landing-delay-1: 0ms;
    --milo-landing-delay-2: 0ms;
    --milo-landing-delay-3: 0ms;
    --milo-landing-delay-4: 0ms;
    --milo-landing-delay-5: 0ms;
    --milo-landing-delay-6: 0ms;
    --milo-landing-delay-7: 0ms;
    --milo-landing-delay-8: 0ms;

    --milo-landing-solution-card-offset-y: 0px;
    --milo-landing-solution-card-offset-y-alt: 0px;
    --milo-landing-solution-card-hover-lift: 0px;
    --milo-landing-solution-card-hover-lift-alt: 0px;

    --milo-landing-process-card-last-offset-y: 0px;
  }

  .milo-template-landing .milo-reveal,
  .milo-template-landing .milo-landing__hero-ambient,
  .milo-template-landing .milo-landing__solution-card {
    transition: none !important;
    animation: none !important;
  }

  .milo-template-landing .milo-landing__solution-card,
  .milo-template-landing .milo-landing__solution-card:hover,
  .milo-template-landing .milo-landing__solution-card:nth-child(2),
  .milo-template-landing .milo-landing__solution-card:nth-child(2):hover {
    transform: none !important;
  }

  .milo-template-landing .milo-landing__hero-ambient {
    filter: none;
    opacity: var(--milo-landing-hero-ambient-opacity);
  }
}
/* #endregion REDUCED MOTION */