/* A single product stage. The product, rather than its frame, carries the story. */
body.az-marketing-page .mk-scope.mk-scope--product:has(.mk-product-media) {
    grid-column: 1 / -1;
    display: block;
    min-width: 0;
    padding: clamp(28px, 5vw, 72px) clamp(20px, 5vw, 72px) 24px;
    border: 1px solid #ffffff12;
    border-radius: 20px;
    background: #101216;
    box-shadow: none;
    transform: none;
}
.mk-product-eyebrow { display: block; color: #c9b181; font-size: .75rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; }
body.az-marketing-page .mk-scope--product:has(.mk-product-media) .mk-product-intro {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    column-gap: clamp(24px, 6vw, 100px);
    align-items: end;
    max-width: 1000px;
    margin: 0 auto 44px;
}
body.az-marketing-page .mk-scope--product:has(.mk-product-media) .mk-product-eyebrow { grid-column: 1 / -1; margin-bottom: 18px; }
body.az-marketing-page .mk-scope--product:has(.mk-product-media) h3 {
    max-width: 15ch;
    margin: 0;
    color: #f3f1eb;
    font-size: clamp(2rem, 3.6vw, 3.25rem);
    font-weight: 500;
    line-height: 1.08;
    letter-spacing: -.045em;
    text-wrap: balance;
}
body.az-marketing-page .mk-scope--product:has(.mk-product-media) .mk-product-intro > p {
    max-width: 40ch;
    margin: 0 0 3px;
    color: #a7adb7;
    font-size: .95rem;
    line-height: 1.7;
}
.mk-product-media { min-width: 0; max-width: 1000px; margin: auto; }
.mk-product-media__devices {
    display: grid;
    place-items: center;
    min-width: 0;
    padding: clamp(12px, 2vw, 28px);
    border: 1px solid #ffffff0b;
    border-radius: 12px;
    background: radial-gradient(ellipse at 50% 0, #b5a4821a, transparent 70%), #1b1e24;
}
.mk-product-media__device { min-width: 0; width: 100%; grid-area: 1 / 1; }
.mk-product-media__device--mobile { width: min(100%, 308px); }
.mk-product-media__device[hidden] { display: none; }
.mk-product-media__device--mobile .mk-product-media__frame { border-radius: 18px; padding: 4px; background: #24272e; }
.mk-product-media__frame {
    overflow: hidden;
    border: 1px solid #ffffff26;
    border-radius: 7px;
    box-shadow: 0 16px 45px -20px #0009;
}
.mk-product-media__screen { position: relative; overflow: hidden; border-radius: inherit; background: #0e1014; }
.mk-product-media__device--mobile .mk-product-media__screen { border-radius: 14px; }
.mk-product-media__poster { display: block; }
.mk-product-media__device img { display: block; width: 100%; height: auto; }
.mk-product-media__poster:focus-visible { outline: 3px solid #d8bd87; outline-offset: -3px; }
.mk-product-media__screen iframe { position: absolute; inset: 0; border: 0; transform-origin: 0 0; opacity: 0; pointer-events: none; }
.mk-product-media__screen.is-live iframe { opacity: 1; pointer-events: auto; }
.mk-product-media__screen.is-live .mk-product-media__poster { opacity: 0; pointer-events: none; }
.mk-product-media__footer { display: flex; justify-content: space-between; align-items: center; min-height: 64px; gap: 16px; }
.mk-product-media__views, .mk-product-media__controls { display: flex; align-items: center; gap: 4px; }
.mk-product-media__views[hidden], .mk-product-media__controls[hidden] { display: none; }
.mk-product-media__footer button {
    display: grid; place-items: center; width: 44px; height: 44px; padding: 0;
    border: 1px solid transparent; border-radius: 8px; color: #929aa7; background: transparent; cursor: pointer;
    transition: color .2s, background .2s;
}
.mk-product-media__footer button:hover { color: #f3f1eb; background: #ffffff08; }
.mk-product-media__footer button[aria-pressed="true"] { color: #e1cfaa; background: #ffffff08; border-color: #ffffff0d; }
.mk-product-media__footer button:focus-visible { outline: 2px solid #d8bd87; outline-offset: 2px; }
.mk-product-media__footer svg { width: 18px; height: 18px; }
.mk-product-media__progress { display: block; width: 56px; height: 2px; margin-right: 10px; overflow: hidden; background: #ffffff12; }
.mk-product-media__progress i { display: block; width: 100%; height: 100%; background: #c9b181; transform: scaleX(var(--demo-progress, 0)); transform-origin: left; transition: transform .15s linear; }
@media (max-width: 640px) {
    body.az-marketing-page .mk-scope--product:has(.mk-product-media) .mk-product-intro { display: block; margin-bottom: 28px; }
    body.az-marketing-page .mk-scope--product:has(.mk-product-media) .mk-product-intro > p { margin-top: 20px; font-size: .875rem; }
    .mk-product-media__devices { padding: 12px; }
    .mk-product-media:not([data-device]) .mk-product-media__device--desktop { display: none; }
}
@media (min-width: 641px) {
    .mk-product-media:not([data-device]) .mk-product-media__device--mobile { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .mk-product-media__footer button, .mk-product-media__progress i { transition: none; }
}