/* Myrtle Stages (mck-stages): ported from site/services/brand-creative/v1/style.css (.found-head / .stages). */
.mck-stages { --display: "Sunset Serial", Georgia, serif; } /* Elementor containers set --display: flex */
.mck-stages .found-head { max-width: 860px; }
.mck-stages .found-head .lead { margin-top: 28px; max-width: 60ch; }
.mck-stages .stages { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: clamp(56px, 6vw, 88px); }
.mck-stages .stages::before { content: ""; position: absolute; z-index: 0; left: 16%; right: 16%; top: 51px; height: 2px; background: linear-gradient(90deg, var(--aqua), var(--yellow) 50%, var(--lavender)); transform: scaleX(0); transform-origin: left; transition: transform 1.8s var(--ease) .3s; }
.mck-stages .stages.no-line::before { display: none; }
.mck-stages .stages.is-in::before, .reduced .mck-stages .stages::before { transform: none; }
.mck-stages .stages .shell { position: relative; z-index: 1; }
.mck-stages .stages .core { height: 100%; padding: 36px 32px 34px; background: var(--soft); transition: transform .8s var(--ease); }
.mck-stages .stages .shell:hover .core { transform: translateY(-6px); }
.mck-stages .st-top { display: flex; align-items: center; gap: 16px; margin-bottom: 30px; }
.mck-stages .st-n { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 50%; background: var(--ink); color: var(--white); font: 500 14px var(--body); }
.mck-stages .stages h3 { font-size: clamp(26px, 2.3vw, 34px); font-weight: 300; line-height: 1.05; }
.mck-stages .st-list li { display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: center; padding-block: 14px; border-top: 1px solid rgba(18, 26, 33, .08); font-size: 16px; color: var(--ink); }
.mck-stages .st-ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--white); transition: transform .7s var(--spring); }
.mck-stages .st-ic img { width: 24px; }
.mck-stages .st-list li:hover .st-ic { transform: rotate(-12deg) scale(1.1); }
@media (prefers-reduced-motion: no-preference) {
  .js .mck-stages .st-list li { opacity: 0; transform: translateX(-12px); transition: opacity .7s var(--ease), transform .7s var(--ease); transition-delay: calc(var(--s) * 220ms + var(--i) * 90ms + 400ms); }
  .js .mck-stages .stages.is-in .st-list li { opacity: 1; transform: none; }
}
@media (max-width: 1080px) {
  .mck-stages .stages { grid-template-columns: 1fr; }
  .mck-stages .stages::before { display: none; }
}
@media (max-width: 767px) { .mck-stages .stages .core { padding: 28px 22px; } }