/* Four illustrated milestones share the print collection's material and type.
   The cinematic stack keeps its existing size, positioning and motion. */
body.aw-redesign.immersive-home .step-card[data-step-poster="registration"] { --step-art: url('../img/step-posters-v20/registration.png'); }
body.aw-redesign.immersive-home .step-card[data-step-poster="download"] { --step-art: url('../img/step-posters-v20/download.png'); }
body.aw-redesign.immersive-home .step-card[data-step-poster="installation"] { --step-art: url('../img/step-posters-v20/installation.png'); }
body.aw-redesign.immersive-home .step-card[data-step-poster="play"] { --step-art: url('../img/step-posters-v20/play.png'); }
body.aw-redesign.immersive-home .step-card,
body.aw-redesign.immersive-home .step-card:hover {
    align-items: flex-start;
    padding: 30px;
    background: #17151d var(--step-art) center / cover no-repeat;
    border: 1px solid #d4bdce30;
    text-align: left;
    text-shadow: none;
}
body.aw-redesign.immersive-home .step-card::before,
body.aw-redesign.immersive-home .step-card::after { content: none; }
body.aw-redesign.immersive-home .step-poster-sequence {
    display: flex;
    align-items: baseline;
    gap: 16px;
    margin: 0 0 20px;
    flex-shrink: 0;
}
body.aw-redesign.immersive-home .step-poster-ordinal {
    color: #e4bdcf;
    font: 500 64px/.96 'Oswald',sans-serif;
    letter-spacing: -.04em;
    text-shadow: 0 1px 12px #09080d80;
}
body.aw-redesign.immersive-home .step-card__num {
    margin: 0;
    color: #d4bdce;
    font: 500 9px/1.6 'Unbounded',sans-serif;
    letter-spacing: 0;
    text-transform: none;
}
body.aw-redesign.immersive-home .step-card h3 {
    max-width: 11ch;
    margin: 0 0 16px;
    color: #f3eaf0;
    font: 500 clamp(30px,2.8vw,40px)/1.12 'Oswald',sans-serif;
    letter-spacing: -.015em;
    text-wrap: balance;
    text-shadow: 0 1px 12px #09080d99;
}
body.aw-redesign.immersive-home .step-card p {
    max-width: 26ch;
    min-height: 0;
    margin: 0 0 22px;
    color: #c5bbc7;
    font: 400 14px/1.65 'Onest',sans-serif;
    text-shadow: 0 1px 9px #09080dcc;
}
body.aw-redesign.immersive-home .step-card .btn {
    align-self: flex-start;
    max-width: 240px;
    margin-top: auto;
}
body.aw-redesign.immersive-home .step-card__highlight {
    align-self: flex-start;
    margin-top: auto;
    color: #e4bdcf;
    font: 500 14px/1.6 'Onest',sans-serif;
    text-shadow: 0 1px 9px #09080dcc;
}
body.aw-redesign.immersive-home .steps:not(.cinematic-journey) .step-card { min-height: 420px; }
@media (max-width:640px) {
    body.aw-redesign.immersive-home .step-card,
    body.aw-redesign.immersive-home .step-card:hover { padding: 26px 24px; }
    body.aw-redesign.immersive-home .step-card h3 { font-size: 36px; }
    body.aw-redesign.immersive-home .step-poster-ordinal { font-size: 60px; }
}
@media (max-width:360px) {
    body.aw-redesign.immersive-home .step-card,
    body.aw-redesign.immersive-home .step-card:hover { padding: 24px 20px; }
    body.aw-redesign.immersive-home .step-card h3 { font-size: 32px; }
    body.aw-redesign.immersive-home .step-poster-ordinal { font-size: 54px; }
}
@media (max-height:700px) and (min-width:700px) {
    body.aw-redesign.immersive-home .cinematic-journey .step-card h3 { font-size: 32px; }
    body.aw-redesign.immersive-home .cinematic-journey .step-card p { font-size: 14px; margin-bottom: 22px; }
}
