/* =========================================================
   MILO PAGE: CASE STUDY TEMPLATE
   File: milo-template-case-study.css
   Layer: 04-pages
   Scope: Case study template only

   Owns:
   - Hero
   - Overview
   - Objective / Strategy
   - Execution
   - Outcome
   - Services used
   - Page-level reveal cascade
   - Case-study-specific token localization

   Notes:
   - Scoped to .milo-template-case-study
   - Assumes global tokens, primitives, motion, cards, media, and CTA modules
   - Keeps shared-looking values localized for now so they can be promoted later
========================================================= */

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

  --milo-case-overview-pad-top: var(--milo-pad-fluid-top-sm);
  --milo-case-overview-pad-bottom: var(--milo-pad-fluid-bottom-sm);

  --milo-case-objective-pad-top: var(--milo-pad-fluid-top-md);
  --milo-case-objective-pad-bottom: var(--milo-pad-fluid-bottom-md);

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

  --milo-case-outcome-pad-top: var(--milo-pad-fluid-top-md);
  --milo-case-outcome-pad-bottom: var(--milo-pad-fluid-bottom-md);

  --milo-case-services-pad-top: var(--milo-pad-fluid-top-md);
  --milo-case-services-pad-bottom: var(--milo-pad-fluid-bottom-md);
  /* #endregion Section rhythm */

  /* #region Layout and spacing */
  /* #region Grid ratios */
  --milo-case-hero-grid-ratio-a: 0.99fr;
  --milo-case-hero-grid-ratio-b: 1.01fr;

  --milo-case-execution-grid-ratio-a: 0.95fr;
  --milo-case-execution-grid-ratio-b: 1.05fr;

  --milo-case-outcome-grid-ratio-a: 0.9fr;
  --milo-case-outcome-grid-ratio-b: 1.1fr;
  /* #endregion Grid ratios */

  /* #region Gaps and offsets */
  --milo-case-intro-gap: var(--milo-gap-fluid-lg);
  --milo-case-intro-margin-bottom: var(--milo-offset-fluid-lg);

  --milo-case-hero-grid-gap: var(--milo-gap-fluid-lg);
  --milo-case-hero-aside-pad-top: var(--milo-offset-fluid-md);

  --milo-case-strategy-grid-column-gap: var(--milo-gap-fluid-lg);
  --milo-case-strategy-grid-row-gap: var(--milo-gap-fluid-2xl);

  --milo-case-execution-grid-column-gap: var(--milo-gap-fluid-2xl);
  --milo-case-execution-grid-row-gap: var(--milo-gap-fluid-3xl);

  --milo-case-outcome-grid-column-gap: var(--milo-gap-fluid-3xl);
  --milo-case-outcome-grid-row-gap: var(--milo-gap-fluid-2xl);

  --milo-case-services-grid-column-gap: var(--milo-gap-fluid-xl);
  --milo-case-services-grid-row-gap: var(--milo-gap-fluid-lg);
  /* #endregion Gaps and offsets */
  --milo-case-aside-max-width: 100%;

  --milo-case-services-grid-max-width: 800px;
  --milo-case-services-grid-min-col: 280px;

  --milo-case-strategy-card-gap: var(--milo-gap-fluid-lg);
  --milo-case-service-inner-gap: var(--milo-gap-fluid-xl);
  --milo-case-strategy-aside-gap: var(--milo-gap-fluid-lg);
  --milo-case-outcome-aside-gap: var(--milo-gap-fluid-md);

  --milo-case-body-indent: var(--milo-indent-xs);
  --milo-case-outcome-aside-indent: var(--milo-indent-md);
  --milo-case-aside-offset-top: var(--milo-offset-fluid-lg);

  --milo-case-strategy-grid-pad-top: var(--milo-offset-xl);
  --milo-case-strategy-cards-margin-top: var(--milo-offset-sm);
  --milo-case-objective-aside-pad-top-adjust: var(--milo-offset-sm);
  --milo-case-execution-subline-paragraph-gap: var(--milo-offset-md);

  /* #endregion Layout and spacing */

  /* #region Measures */
  --milo-case-intro-title-max: var(--milo-measure-24);
  --milo-case-intro-subline-max: var(--milo-measure-38);
  --milo-case-card-title-max: var(--milo-measure-24);
  --milo-case-card-body-max: var(--milo-measure-44);
  --milo-case-overview-body-max: var(--milo-measure-60);
  --milo-case-objective-aside-body-max: calc(
    var(--milo-case-intro-subline-max) - 4ch
  );
  --milo-case-strategy-aside-body-max: calc(
    var(--milo-case-intro-subline-max) - 4ch
  );
  /* #endregion Measures */

  /* #region Card and media */
  /* Cards */
  --milo-case-card-title-size: 17px;
  --milo-case-card-radius: var(--milo-radius-xl);
  --milo-case-card-padding: var(--milo-card-pad-block-sm)
    var(--milo-card-pad-inline-lg) var(--milo-card-pad-block-md);

  --milo-case-strategy-card-padding: var(--milo-case-card-padding);
  --milo-case-execution-card-padding: var(--milo-card-pad-xs);
  --milo-case-outcome-card-padding: var(--milo-case-card-padding);
  --milo-case-services-card-padding: var(--milo-case-card-padding);

  --milo-case-card-border-width: 1px;
  --milo-case-card-backdrop-blur: 6px;
  --milo-case-card-box-sizing: border-box;

  --milo-case-card-min-height: 132px;
  --milo-case-outcome-card-max-width: 30rem;

  --milo-case-execution-card-resting-offset-2: 34px;
  --milo-case-execution-card-resting-offset-3: 10px;
  --milo-case-execution-card-stack-margin-top: -6px;
  --milo-case-execution-card-hover-lift: 3px;

  --milo-case-services-card-offset-2: 10px;

  --milo-case-shadow-card: var(--milo-shadow-card-soft);
  --milo-case-shadow-card-hover: var(--milo-shadow-card-soft-hover);

  --milo-case-outcome-card-background:
    var(--milo-surface-grad-soft), var(--milo-surface-radial-lift);

  /* Media */
  --milo-case-hero-media-aspect-ratio: 3 / 2;
  --milo-case-execution-media-aspect-ratio: 16 / 10;

  --milo-case-media-object-fit: cover;
  --milo-case-media-radius-offset: 2px;
  --milo-case-media-background: var(--milo-surface-grad-soft);
  --milo-case-hero-media-width: 480px;

  --milo-case-execution-feature-span: 2;
  --milo-case-execution-feature-max-width: 92%;
  --milo-case-execution-support-card-max-width: 350px;

  /* #endregion Card and media */

  /* #region Surface and Border tokens */
  --milo-case-surface-border: var(--milo-divider-soft);

  --milo-case-surface-transparent: rgb(255 255 255 / 0);
  --milo-case-surface-radial-stop-outcome: 56%;
  --milo-case-surface-radial-stop-execution: 34%;

  --milo-case-execution-intro-surface: var(--milo-surface-radial-lift);
  --milo-case-execution-intro-inset-top: -18px;
  --milo-case-execution-intro-inset-right: -18px;
  --milo-case-execution-intro-inset-bottom: auto;
  --milo-case-execution-intro-inset-left: -14px;
  --milo-case-execution-intro-height: 120%;
  --milo-case-execution-intro-radius: 18px;
  /* #endregion Surface and Border tokens */

  /* #region Rules and Markers */
  --milo-case-rule: var(--milo-divider);
  --milo-case-rule-strong: var(--milo-editorial-rule-accent);

  --milo-case-outcome-aside-rule-background: var(--milo-rule-pink-vertical);
  --milo-case-outcome-aside-rule-left: 0.5px;
  --milo-case-outcome-aside-rule-top: 24px;
  --milo-case-outcome-aside-rule-bottom: 24px;

  --milo-case-node: var(--milo-editorial-node);
  --milo-case-node-halo: var(--milo-editorial-node-halo);
  --milo-case-outcome-node-background: var(--milo-case-node);
  --milo-case-outcome-node-shadow: 0 0 0 4px var(--milo-case-node-halo);
  --milo-case-outcome-card-node-size: 8px;
  --milo-case-outcome-card-node-left: -28px;
  --milo-case-outcome-card-node-top: 22px;
  /* #endregion Rules and Markers */

  /* #region Typography polish */
  --milo-case-overview-body-opacity: 0.92;
  --milo-case-objective-aside-body-opacity: 0.88;
  --milo-case-strategy-aside-body-opacity: 0.88;
  --milo-case-strategy-card-label-opacity: 0.68;
  --milo-case-outcome-card-label-opacity: 0.56;
  --milo-case-services-card-subline-opacity: 0.78;
  --milo-case-outcome-card-label-letter-spacing: 0.12em;
  /* #endregion Typography polish */

  --milo-case-overview-link-offset: -100px;

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

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

  --milo-case-reveal-y-media: 12px;
  --milo-case-reveal-blur-media: 3px;

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

  --milo-case-reveal-y-card: 10px;
  --milo-case-reveal-blur-card: 2.5px;

  --milo-case-reveal-y-card-feature: 16px;
  --milo-case-reveal-blur-card-feature: 3px;

  --milo-case-reveal-delay-hero-title: 60ms;
  --milo-case-reveal-delay-hero-subline: 120ms;
  --milo-case-reveal-delay-hero-link: 160ms;
  --milo-case-reveal-delay-hero-media: 200ms;

  --milo-case-reveal-delay-objective-aside: 80ms;
  --milo-case-reveal-delay-strategy-lead: 160ms;
  --milo-case-reveal-delay-strategy-aside: 240ms;
  --milo-case-reveal-delay-strategy-card-1: 320ms;
  --milo-case-reveal-delay-strategy-card-2: 400ms;

  --milo-case-reveal-delay-execution-card-1: 120ms;
  --milo-case-reveal-delay-execution-card-2: 220ms;
  --milo-case-reveal-delay-execution-card-3: 300ms;

  --milo-case-reveal-delay-outcome-card-1: 100ms;
  --milo-case-reveal-delay-outcome-card-2: 180ms;
  --milo-case-reveal-delay-outcome-card-3: 260ms;

  --milo-case-reveal-delay-services-card-1: 100ms;
  --milo-case-reveal-delay-services-card-2: 180ms;
  --milo-case-reveal-delay-services-card-3: 260ms;

  --milo-case-reveal-delay-cta-title: 80ms;
  --milo-case-reveal-delay-cta-subline: 160ms;
  --milo-case-reveal-delay-cta-button: 240ms;
  --milo-case-reveal-delay-cta-link: 320ms;

  --milo-case-reveal-dur-media-hero: 1050ms;
  --milo-case-reveal-dur-media-hero-filter: 900ms;

  --milo-case-reveal-dur-media-card-feature: 1080ms;
  --milo-case-reveal-dur-media-card-feature-filter: 920ms;

  --milo-case-reveal-dur-media-card: 980ms;
  --milo-case-reveal-dur-media-card-filter: 840ms;

  --milo-case-reveal-dur-media-outcome: 900ms;
  --milo-case-reveal-dur-media-outcome-filter: 760ms;
  /* #endregion Reveal defaults */
}
/* #endregion TEMPLATE TOKENS */

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

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

.milo-template-case-study .milo-media-frame.milo-reveal,
.milo-template-case-study .milo-case-study__hero-media.milo-reveal,
.milo-template-case-study .milo-case-study__execution-card.milo-reveal {
  --milo-reveal-y: var(--milo-case-reveal-y-media);
  --milo-reveal-blur: var(--milo-case-reveal-blur-media);
}

.milo-template-case-study .milo-case-study__strategy-card.milo-reveal,
.milo-template-case-study .milo-case-study__outcome-card.milo-reveal,
.milo-template-case-study .milo-case-study__services-card.milo-reveal {
  --milo-reveal-y: var(--milo-case-reveal-y-card);
  --milo-reveal-blur: var(--milo-case-reveal-blur-card);
}

/* #region HERO */
.milo-template-case-study .milo-case-study__hero-label.milo-reveal {
  --milo-delay: 0ms;
  --milo-reveal-y: var(--milo-case-reveal-y-label);
  --milo-reveal-blur: var(--milo-case-reveal-blur-label);
}

.milo-template-case-study .milo-case-study__hero-title.milo-reveal {
  --milo-delay: var(--milo-case-reveal-delay-hero-title);
}

.milo-template-case-study .milo-case-study__hero-subline.milo-reveal {
  --milo-delay: var(--milo-case-reveal-delay-hero-subline);
}

.milo-template-case-study .milo-case-study__hero-link.milo-reveal {
  --milo-delay: var(--milo-case-reveal-delay-hero-link);
}

.milo-template-case-study .milo-case-study__hero-media.milo-reveal {
  --milo-delay: var(--milo-case-reveal-delay-hero-media);
  --milo-reveal-dur-media: var(--milo-case-reveal-dur-media-hero);
  --milo-reveal-dur-media-filter: var(--milo-case-reveal-dur-media-hero-filter);
}
/* #endregion HERO */

/* #region OVERVIEW */
.milo-template-case-study .milo-case-study__overview-body.milo-reveal {
  --milo-delay: 0ms;
}

.milo-template-case-study .milo-case-study__overview-link.milo-reveal {
  --milo-delay: 10ms;
}
/* #endregion OVERVIEW */

/* #region OBJECTIVE / STRATEGY */
.milo-template-case-study .milo-case-study__objective-lead.milo-reveal {
  --milo-delay: 0ms;
}

.milo-template-case-study .milo-case-study__objective-aside.milo-reveal {
  --milo-delay: var(--milo-case-reveal-delay-objective-aside);
}

.milo-template-case-study .milo-case-study__strategy-lead.milo-reveal {
  --milo-delay: var(--milo-case-reveal-delay-strategy-lead);
}

.milo-template-case-study .milo-case-study__strategy-aside.milo-reveal {
  --milo-delay: var(--milo-case-reveal-delay-strategy-aside);
}

.milo-template-case-study
  .milo-case-study__strategy-card.milo-reveal:nth-child(1) {
  --milo-delay: var(--milo-case-reveal-delay-strategy-card-1);
}

.milo-template-case-study
  .milo-case-study__strategy-card.milo-reveal:nth-child(2) {
  --milo-delay: var(--milo-case-reveal-delay-strategy-card-2);
}
/* #endregion OBJECTIVE / STRATEGY */

/* #region EXECUTION */
.milo-template-case-study .milo-case-study__execution-intro.milo-reveal {
  --milo-delay: 0ms;
}

.milo-template-case-study .milo-case-study__execution-card {
  --milo-case-card-offset-top: 0px;
  margin-top: var(--milo-case-card-offset-top);
}

.milo-template-case-study
  .milo-case-study__execution-card.milo-reveal:nth-child(1) {
  --milo-delay: var(--milo-case-reveal-delay-execution-card-1);
  --milo-reveal-y: var(--milo-case-reveal-y-card-feature);
  --milo-reveal-blur: var(--milo-case-reveal-blur-card-feature);
  --milo-reveal-dur-media: var(--milo-case-reveal-dur-media-card-feature);
  --milo-reveal-dur-media-filter: var(
    --milo-case-reveal-dur-media-card-feature-filter
  );
}

.milo-template-case-study .milo-case-study__execution-card:nth-child(2) {
  --milo-case-card-offset-top: var(--milo-case-execution-card-resting-offset-2);
}

.milo-template-case-study .milo-case-study__execution-card:nth-child(3) {
  --milo-case-card-offset-top: var(--milo-case-execution-card-resting-offset-3);
}

.milo-template-case-study
  .milo-case-study__execution-card.milo-reveal:nth-child(2),
.milo-template-case-study
  .milo-case-study__execution-card.milo-reveal:nth-child(3) {
  --milo-reveal-y: var(--milo-case-reveal-y-media);
  --milo-reveal-blur: var(--milo-case-reveal-blur-media);
  --milo-reveal-dur-media: var(--milo-case-reveal-dur-media-card);
  --milo-reveal-dur-media-filter: var(--milo-case-reveal-dur-media-card-filter);
}

.milo-template-case-study
  .milo-case-study__execution-card.milo-reveal:nth-child(2) {
  --milo-delay: var(--milo-case-reveal-delay-execution-card-2);
}

.milo-template-case-study
  .milo-case-study__execution-card.milo-reveal:nth-child(3) {
  --milo-delay: var(--milo-case-reveal-delay-execution-card-3);
}
/* #endregion EXECUTION */

/* #region OUTCOME */
.milo-template-case-study .milo-case-study__outcome-lead.milo-reveal {
  --milo-delay: 0ms;
}

.milo-template-case-study .milo-case-study__outcome-card.milo-reveal {
  --milo-reveal-dur-media: var(--milo-case-reveal-dur-media-outcome);
  --milo-reveal-dur-media-filter: var(
    --milo-case-reveal-dur-media-outcome-filter
  );
}

.milo-template-case-study
  .milo-case-study__outcome-card.milo-reveal:nth-child(1) {
  --milo-delay: var(--milo-case-reveal-delay-outcome-card-1);
}

.milo-template-case-study
  .milo-case-study__outcome-card.milo-reveal:nth-child(2) {
  --milo-delay: var(--milo-case-reveal-delay-outcome-card-2);
}

.milo-template-case-study
  .milo-case-study__outcome-card.milo-reveal:nth-child(3) {
  --milo-delay: var(--milo-case-reveal-delay-outcome-card-3);
}
/* #endregion OUTCOME */

/* #region SERVICES */
.milo-template-case-study .milo-case-study__services-intro.milo-reveal {
  --milo-delay: 0ms;
}

.milo-template-case-study
  .milo-case-study__services-card.milo-reveal:nth-child(1) {
  --milo-delay: var(--milo-case-reveal-delay-services-card-1);
}

.milo-template-case-study
  .milo-case-study__services-card.milo-reveal:nth-child(2) {
  --milo-delay: var(--milo-case-reveal-delay-services-card-2);
}

.milo-template-case-study
  .milo-case-study__services-card.milo-reveal:nth-child(3) {
  --milo-delay: var(--milo-case-reveal-delay-services-card-3);
}
/* #endregion SERVICES */

/* #region CTA */
.milo-template-case-study .milo-case-study__cta .milo-cta__rule.milo-reveal {
  --milo-delay: 0ms;
  --milo-reveal-y: var(--milo-case-reveal-y-label);
  --milo-reveal-blur: var(--milo-case-reveal-blur-label);
}

.milo-template-case-study .milo-case-study__cta-title.milo-reveal,
.milo-template-case-study .milo-case-study__cta-subline.milo-reveal,
.milo-template-case-study .milo-case-study__cta-link.milo-reveal {
  --milo-reveal-y: var(--milo-case-reveal-y-copy);
  --milo-reveal-blur: var(--milo-case-reveal-blur-copy);
}

.milo-template-case-study .milo-case-study__cta-title.milo-reveal {
  --milo-delay: var(--milo-case-reveal-delay-cta-title);
}

.milo-template-case-study .milo-case-study__cta-subline.milo-reveal {
  --milo-delay: var(--milo-case-reveal-delay-cta-subline);
}

.milo-template-case-study .milo-case-study__cta-button.milo-reveal {
  --milo-delay: var(--milo-case-reveal-delay-cta-button);
  --milo-reveal-y: var(--milo-case-reveal-y-base);
  --milo-reveal-blur: var(--milo-case-reveal-blur-copy);
}

.milo-template-case-study .milo-case-study__cta-link.milo-reveal {
  --milo-delay: var(--milo-case-reveal-delay-cta-link);
}
/* #endregion CTA */
/* #endregion REVEAL CASCADE */

/* #region 1) GLOBAL SECTION RHYTHM */
.milo-template-case-study .milo-section {
  position: relative;
  overflow: clip;
}

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

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

.milo-template-case-study .milo-case-study__hero-title h1,
.milo-template-case-study .milo-case-study__objective-title h2,
.milo-template-case-study .milo-case-study__strategy-title h2,
.milo-template-case-study .milo-case-study__execution-title h2,
.milo-template-case-study .milo-case-study__outcome-title h2,
.milo-template-case-study .milo-case-study__services-title h2,
.milo-template-case-study .milo-case-study__related-title h2 {
  max-width: var(--milo-case-intro-title-max);
}

.milo-template-case-study
  .milo-case-study__hero-subline
  .elementor-widget-container,
.milo-template-case-study
  .milo-case-study__objective-body
  .elementor-widget-container,
.milo-template-case-study
  .milo-case-study__strategy-body
  .elementor-widget-container,
.milo-template-case-study
  .milo-case-study__execution-subline
  .elementor-widget-container,
.milo-template-case-study
  .milo-case-study__outcome-body
  .elementor-widget-container,
.milo-template-case-study
  .milo-case-study__related-body
  .elementor-widget-container {
  max-width: var(--milo-case-intro-subline-max);
}

.milo-template-case-study .milo-case-study__strategy-card-title h3,
.milo-template-case-study .milo-case-study__outcome-card-title h3,
.milo-template-case-study .milo-case-study__services-card-title h3 {
  max-width: var(--milo-case-card-title-max);
  font-size: var(--milo-case-card-title-size);
}

.milo-template-case-study
  .milo-case-study__outcome-card-label
  .elementor-heading-title,
.milo-template-case-study
  .milo-case-study__services-card-subline
  .elementor-heading-title {
  max-width: var(--milo-case-card-body-max);
}

.milo-template-case-study .elementor-widget-container:last-child {
  margin-bottom: 0;
}

/* #region Card and media surfaces */
.milo-template-case-study .milo-card {
  backdrop-filter: blur(var(--milo-case-card-backdrop-blur));
  -webkit-backdrop-filter: blur(var(--milo-case-card-backdrop-blur));
}

.milo-template-case-study .milo-card,
.milo-template-case-study .milo-media-frame {
  box-sizing: var(--milo-case-card-box-sizing);
  position: relative;
  border: var(--milo-case-card-border-width) solid
    var(--milo-case-surface-border);
  background: var(--milo-case-media-background);
  box-shadow: var(--milo-case-shadow-card);
}

.milo-template-case-study .milo-card::after,
.milo-template-case-study .milo-media-frame::after {
  content: none;
}

.milo-template-case-study .milo-card:hover,
.milo-template-case-study .milo-media-frame:hover {
  box-shadow: var(--milo-case-shadow-card-hover);
}
/* #endregion Card and media surfaces */
/* #endregion GLOBAL SECTION RHYTHM */

/* #region 2) HERO */
.milo-template-case-study .milo-case-study__hero {
  --milo-section-pad-top: var(--milo-case-hero-pad-top);
  --milo-section-pad-bottom: var(--milo-case-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-case-study .milo-case-study__hero-grid {
  --milo-grid-ratio-a: var(--milo-case-hero-grid-ratio-a);
  --milo-grid-ratio-b: var(--milo-case-hero-grid-ratio-b);
  gap: var(--milo-case-hero-grid-gap);
}

.milo-template-case-study
  .milo-case-study__hero-subline
  .elementor-widget-container {
  padding-left: var(--milo-case-body-indent);
}

.milo-template-case-study .milo-case-study__hero-aside {
  width: 100%;
  min-width: 0;
  display: flex;
  justify-content: flex-start;
  padding-top: var(--milo-case-hero-aside-pad-top);
}

.milo-template-case-study .milo-case-study__hero-media {
  max-width: var(--milo-case-hero-media-width);
}

.milo-template-case-study .milo-case-study__hero-media .milo-media img {
  aspect-ratio: var(--milo-case-hero-media-aspect-ratio);
  object-fit: var(--milo-case-media-object-fit);
  border-radius: calc(
    var(--milo-case-card-radius) - var(--milo-case-media-radius-offset)
  );
}
/* #endregion HERO */

/* #region 3) OVERVIEW */
.milo-template-case-study .milo-case-study__overview {
  --milo-section-pad-top: var(--milo-case-overview-pad-top);
  --milo-section-pad-bottom: var(--milo-case-overview-pad-bottom);

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

.milo-template-case-study .milo-case-study__overview-description {
  align-items: center;
  justify-content: center;
}

.milo-template-case-study
  .milo-case-study__overview-body
  .elementor-widget-container {
  max-width: var(--milo-case-overview-body-max);
  margin: 0 auto;
  text-align: left;
  opacity: var(--milo-case-overview-body-opacity);
}

.milo-template-case-study .milo-case-study__overview-link {
  left: var(--milo-case-overview-link-offset);
}
/* #endregion OVERVIEW */

/* #region 4) OBJECTIVE / STRATEGY */
.milo-template-case-study .milo-case-study__objective {
  --milo-section-pad-top: var(--milo-case-objective-pad-top);
  --milo-section-pad-bottom: var(--milo-case-objective-pad-bottom);

  --milo-section-bg: var(--milo-bg-lift);
  --milo-section-before-display: block;
  --milo-section-before-bg: var(--milo-section-field-left-soft);
}

.milo-template-case-study .milo-case-study__objective-grid,
.milo-template-case-study .milo-case-study__strategy-grid {
  column-gap: var(--milo-case-strategy-grid-column-gap);
  row-gap: var(--milo-case-strategy-grid-row-gap);
}

.milo-template-case-study .milo-case-study__objective-grid {
  align-items: end;
}

.milo-template-case-study .milo-case-study__strategy-grid {
  padding-top: var(--milo-case-strategy-grid-pad-top);
}

.milo-template-case-study .milo-case-study__objective-aside {
  max-width: var(--milo-case-aside-max-width);
  padding-top: calc(
    var(--milo-case-aside-offset-top) -
      var(--milo-case-objective-aside-pad-top-adjust)
  );
}

.milo-template-case-study .milo-case-study__strategy-aside {
  max-width: var(--milo-case-aside-max-width);
  padding-top: var(--milo-case-aside-offset-top);
  gap: var(--milo-case-strategy-aside-gap);
}

.milo-template-case-study
  .milo-case-study__objective-aside-body
  .elementor-widget-container {
  max-width: var(--milo-case-objective-aside-body-max);
  opacity: var(--milo-case-objective-aside-body-opacity);
}

.milo-template-case-study
  .milo-case-study__strategy-aside-body
  .elementor-widget-container {
  max-width: var(--milo-case-strategy-aside-body-max);
  opacity: var(--milo-case-strategy-aside-body-opacity);
}

.milo-template-case-study .milo-case-study__strategy-cards {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--milo-case-strategy-card-gap);
  margin-top: var(--milo-case-strategy-cards-margin-top);
}

.milo-template-case-study .milo-case-study__strategy-card {
  min-height: var(--milo-case-card-min-height);
  padding: var(--milo-case-strategy-card-padding);
  border-radius: var(--milo-case-card-radius);
}

.milo-template-case-study .milo-case-study__strategy-card-label {
  opacity: var(--milo-case-strategy-card-label-opacity);
}
/* #endregion OBJECTIVE / STRATEGY */

/* #region 5) EXECUTION */
.milo-template-case-study .milo-case-study__execution {
  --milo-section-pad-top: var(--milo-case-execution-pad-top);
  --milo-section-pad-bottom: var(--milo-case-execution-pad-bottom);

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

.milo-template-case-study .milo-case-study__execution-inner {
  --milo-grid-ratio-a: var(--milo-case-execution-grid-ratio-a);
  --milo-grid-ratio-b: var(--milo-case-execution-grid-ratio-b);
  align-items: start;
  column-gap: var(--milo-case-execution-grid-column-gap);
  row-gap: var(--milo-case-execution-grid-row-gap);
}

.milo-template-case-study .milo-case-study__execution-intro::after {
  content: "";
  position: absolute;
  inset: var(--milo-case-execution-intro-inset-top)
    var(--milo-case-execution-intro-inset-right)
    var(--milo-case-execution-intro-inset-bottom)
    var(--milo-case-execution-intro-inset-left);
  height: var(--milo-case-execution-intro-height);
  border-radius: var(--milo-case-execution-intro-radius);
  background: var(--milo-case-execution-intro-surface);
  pointer-events: none;
  z-index: -1;
}

.milo-template-case-study .milo-case-study__execution-subline p + p {
  margin-top: var(--milo-case-execution-subline-paragraph-gap);
}

.milo-template-case-study .milo-case-study__execution-card {
  border-radius: var(--milo-case-card-radius);
  padding: var(--milo-case-execution-card-padding);
  transition:
    margin-top var(--milo-med) var(--milo-ease),
    box-shadow var(--milo-med) var(--milo-ease);
}

.milo-template-case-study .milo-case-study__execution-card-inner {
  transition: margin-top var(--milo-med) var(--milo-ease);
}

.milo-template-case-study .milo-case-study__execution-card:nth-child(1) {
  grid-column: span var(--milo-case-execution-feature-span);
  max-width: var(--milo-case-execution-feature-max-width);
  margin-left: auto;
}

.milo-template-case-study .milo-case-study__execution-card:nth-child(2),
.milo-template-case-study .milo-case-study__execution-card:nth-child(3) {
  max-width: var(--milo-case-execution-support-card-max-width);
}

.milo-template-case-study
  .milo-case-study__execution-card:nth-child(2)
  .milo-case-study__execution-card-inner,
.milo-template-case-study
  .milo-case-study__execution-card:nth-child(3)
  .milo-case-study__execution-card-inner {
  margin-top: var(--milo-case-execution-card-stack-margin-top);
}

.milo-template-case-study
  .milo-case-study__execution-card
  .milo-media-ratio__img {
  object-fit: var(--milo-case-media-object-fit);
  border-radius: calc(
    var(--milo-case-card-radius) - var(--milo-case-media-radius-offset)
  );
}

.milo-template-case-study .milo-case-study__execution-card {
  border-radius: var(--milo-case-card-radius);
  padding: var(--milo-case-execution-card-padding);
  transition:
    margin-top var(--milo-med) var(--milo-ease),
    box-shadow var(--milo-med) var(--milo-ease);
}

/* #endregion EXECUTION */

/* #region 6) OUTCOME */
.milo-template-case-study .milo-case-study__outcome {
  --milo-section-pad-top: var(--milo-case-outcome-pad-top);
  --milo-section-pad-bottom: var(--milo-case-outcome-pad-bottom);

  --milo-section-bg: var(--milo-bg-base);
  --milo-section-before-display: block;
  --milo-section-before-bg: var(--milo-section-field-left-soft);
}

.milo-template-case-study .milo-case-study__outcome-grid {
  --milo-grid-ratio-a: var(--milo-case-outcome-grid-ratio-a);
  --milo-grid-ratio-b: var(--milo-case-outcome-grid-ratio-b);
  align-items: start;
  column-gap: var(--milo-case-outcome-grid-column-gap);
  row-gap: var(--milo-case-outcome-grid-row-gap);
}

.milo-template-case-study .milo-case-study__outcome-aside > .milo-stack {
  gap: var(--milo-case-outcome-aside-gap);
  padding-left: var(--milo-case-outcome-aside-indent);
}

.milo-template-case-study
  .milo-case-study__outcome-aside
  > .milo-stack::before {
  content: "";
  position: absolute;
  left: var(--milo-case-outcome-aside-rule-left);
  top: var(--milo-case-outcome-aside-rule-top);
  bottom: var(--milo-case-outcome-aside-rule-bottom);
  width: var(--milo-case-card-border-width);
  background: var(--milo-case-outcome-aside-rule-background);
  pointer-events: none;
}

.milo-template-case-study .milo-case-study__outcome-card {
  position: relative;
  max-width: var(--milo-case-outcome-card-max-width);
  min-height: var(--milo-case-card-min-height);
  padding: var(--milo-case-outcome-card-padding);
  border-radius: var(--milo-case-card-radius);
  justify-content: center;
  overflow: visible;
}

.milo-template-case-study .milo-case-study__outcome-card::before {
  content: "";
  position: absolute;
  left: var(--milo-case-outcome-card-node-left);
  top: var(--milo-case-outcome-card-node-top);
  width: var(--milo-case-outcome-card-node-size);
  height: var(--milo-case-outcome-card-node-size);
  border-radius: var(--milo-radius-pill);
  background: var(--milo-case-outcome-node-background);
  box-shadow: var(--milo-case-outcome-node-shadow);
}

.milo-template-case-study .milo-case-study__outcome-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--milo-case-outcome-card-background);
  pointer-events: none;
}

.milo-template-case-study
  .milo-case-study__outcome-card-label
  .elementor-heading-title {
  opacity: var(--milo-case-outcome-card-label-opacity);
  letter-spacing: var(--milo-case-outcome-card-label-letter-spacing);
}
/* #endregion OUTCOME */

/* #region 7) SERVICES USED */
.milo-template-case-study .milo-case-study__services {
  --milo-section-pad-top: var(--milo-case-services-pad-top);
  --milo-section-pad-bottom: var(--milo-case-services-pad-bottom);

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

.milo-template-case-study .milo-case-study__services-inner {
  gap: var(--milo-case-service-inner-gap);
}

.milo-template-case-study .milo-case-study__services-grid {
  grid-template-columns: repeat(
    2,
    minmax(var(--milo-case-services-grid-min-col), 1fr)
  );
  column-gap: var(--milo-case-services-grid-column-gap);
  row-gap: var(--milo-case-services-grid-row-gap);
  max-width: var(--milo-case-services-grid-max-width);
}

.milo-template-case-study .milo-case-study__services-card {
  min-height: var(--milo-case-card-min-height);
  width: 100%;
  padding: var(--milo-case-services-card-padding);
  border-radius: var(--milo-case-card-radius);
  justify-content: center;
}

.milo-template-case-study .milo-case-study__services-card:nth-child(2) {
  transform: translateY(var(--milo-case-services-card-offset-2));
}

.milo-template-case-study
  .milo-case-study__services-card-subline
  .elementor-heading-title {
  opacity: var(--milo-case-services-card-subline-opacity);
}
/* #endregion SERVICES USED */

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

.milo-template-case-study
  .milo-case-study__cta-subline
  .elementor-widget-container {
  max-width: var(--milo-case-card-body-max);
  margin: 0 !important;
}
/* #endregion CTA */

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

    --milo-case-card-radius: calc(var(--milo-radius-md) + 2px);

    --milo-case-aside-max-width: 88%;
    --milo-case-hero-media-width: 440px;
    --milo-case-aside-offset-top: var(--milo-offset-fluid-lg);
  }
}

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

    --milo-case-card-radius: var(--milo-radius-md);
    --milo-case-card-min-height: 120px;

    --milo-case-aside-max-width: 80%;
    --milo-case-hero-media-width: 85%;
    --milo-case-outcome-card-max-width: 24rem;
    --milo-case-services-grid-max-width: 75%;

    --milo-case-hero-grid-ratio-a: 0.93fr;
    --milo-case-hero-grid-ratio-b: 1.07fr;
    --milo-case-outcome-grid-ratio-a: 0.95fr;
    --milo-case-outcome-grid-ratio-b: 1.05fr;
    --milo-case-hero-media-aspect-ratio: 1.2 / 1;

    --milo-case-overview-link-offset: 0;
  }

  .milo-template-case-study .milo-case-study__overview-description {
    align-items: flex-start;
  }

  .milo-template-case-study .milo-case-study__objective-grid,
  .milo-template-case-study .milo-case-study__strategy-grid {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  }

  .milo-template-case-study .milo-case-study__objective-aside {
    align-self: start;
  }

  .milo-template-case-study .milo-case-study__strategy-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-column: 1 / -1;
  }

  .milo-template-case-study .milo-case-study__services-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .milo-template-case-study .milo-case-study__services-card:nth-child(2) {
    transform: none;
  }
}

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

    --milo-case-card-radius: var(--milo-radius-md);
    --milo-case-card-min-height: 0;

    --milo-case-aside-max-width: 100%;
    --milo-case-outcome-card-max-width: 20rem;
    --milo-case-services-grid-max-width: 100%;
    --milo-case-aside-offset-top: 0;
  }

  .milo-template-case-study
    .milo-case-study__objective-aside-body
    .elementor-widget-container,
  .milo-template-case-study
    .milo-case-study__strategy-aside-body
    .elementor-widget-container {
    padding-left: var(--milo-case-body-indent);
  }

  .milo-template-case-study .milo-case-study__strategy-cards,
  .milo-template-case-study .milo-case-study__objective-grid,
  .milo-template-case-study .milo-case-study__strategy-grid,
  .milo-template-case-study .milo-case-study__services-grid {
    grid-template-columns: 1fr;
  }

  .milo-template-case-study .milo-case-study__execution-card,
  .milo-template-case-study .milo-case-study__execution-card:nth-child(2),
  .milo-template-case-study .milo-case-study__execution-card:nth-child(3),
  .milo-template-case-study .milo-case-study__services-card,
  .milo-template-case-study .milo-case-study__outcome-card {
    max-width: 100%;
  }
}

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

    --milo-case-card-radius: calc(var(--milo-radius-md) - 2px);
  }
}
/* #endregion RESPONSIVE */

/* #region 10) REDUCED MOTION */
@media (prefers-reduced-motion: reduce) {
  .milo-template-case-study {
    --milo-delay: 0ms;
    --milo-reveal-dur: 0ms;
    --milo-reveal-dur-heading: 0ms;
    --milo-reveal-dur-media: 0ms;
    --milo-reveal-dur-media-filter: 0ms;

    --milo-case-reveal-y-base: 0px;
    --milo-case-reveal-blur-base: 0px;
    --milo-case-reveal-y-copy: 0px;
    --milo-case-reveal-blur-copy: 0px;
    --milo-case-reveal-y-media: 0px;
    --milo-case-reveal-blur-media: 0px;
    --milo-case-reveal-y-label: 0px;
    --milo-case-reveal-blur-label: 0px;
    --milo-case-reveal-y-card: 0px;
    --milo-case-reveal-blur-card: 0px;
    --milo-case-reveal-y-card-feature: 0px;
    --milo-case-reveal-blur-card-feature: 0px;

    --milo-case-execution-card-resting-offset-2: 0px;
    --milo-case-execution-card-resting-offset-3: 0px;
    --milo-case-execution-card-stack-margin-top: 0px;
    --milo-case-execution-card-hover-lift: 0px;
    --milo-case-services-card-offset-2: 0px;
    --milo-case-card-backdrop-blur: 0px;
  }

  .milo-template-case-study .milo-reveal,
  .milo-template-case-study .milo-case-study__execution-card,
  .milo-template-case-study .milo-case-study__services-card,
  .milo-template-case-study .milo-card,
  .milo-template-case-study .milo-media-frame {
    transition: none !important;
    animation: none !important;
    transform: none !important;
  }

  .milo-template-case-study .milo-card,
  .milo-template-case-study .milo-media-frame,
  .milo-template-case-study .milo-case-study__strategy-card {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .milo-template-case-study .milo-card:hover,
  .milo-template-case-study .milo-media-frame:hover,
  .milo-template-case-study .milo-case-study__execution-card:hover,
  .milo-template-case-study .milo-case-study__services-card:hover,
  .milo-template-case-study .milo-case-study__outcome-card:hover {
    transform: none !important;
    box-shadow: var(--milo-case-shadow-card) !important;
  }

  .milo-template-case-study .milo-case-study__execution-card:nth-child(2),
  .milo-template-case-study .milo-case-study__execution-card:nth-child(3),
  .milo-template-case-study .milo-case-study__services-card:nth-child(2),
  .milo-template-case-study .milo-case-study__outcome-card:nth-child(2),
  .milo-template-case-study .milo-case-study__outcome-card:nth-child(3) {
    margin-top: 0 !important;
  }
}
/* #endregion REDUCED MOTION */