.mc-tech-entry {
    --mc-tech-gold: #e8c875;
    --mc-tech-cyan: #72d7ff;
    align-items: center;
    background: #071a31;
    border: 1px solid rgb(232 200 117 / 58%);
    border-radius: 13px;
    box-shadow: 0 8px 22px rgb(2 19 35 / 16%);
    color: #edf8ff;
    display: grid;
    gap: 10px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    min-height: 104px;
    overflow: hidden;
    padding: 8px 10px;
    position: relative;
    width: 100%;
}

.mc-tech-entry::before {
    background:
        linear-gradient(100deg, rgb(2 12 26 / 82%) 0%, rgb(4 24 43 / 54%) 48%, rgb(3 19 37 / 74%) 100%),
        linear-gradient(180deg, rgb(5 22 40 / 8%), rgb(3 14 29 / 58%));
    content: '';
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 1;
}

.mc-tech-entry::after {
    background: repeating-linear-gradient(90deg, transparent 0 27px, rgb(114 215 255 / 5%) 28px);
    content: '';
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 2;
}

.mc-tech-entry > :not(.mc-tech-entry__visual) {
    min-width: 0;
    position: relative;
    z-index: 3;
}

.mc-tech-entry__visual,
.mc-tech-entry__visual img {
    height: 100%;
    inset: 0;
    position: absolute;
    width: 100%;
}

.mc-tech-entry__visual {
    border-radius: inherit;
    margin: 0;
    overflow: hidden;
    z-index: 0;
}

.mc-tech-entry__visual img {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    filter: brightness(1.12) saturate(1.08);
    object-fit: cover;
    object-position: 58% 48%;
}

.mc-tech-entry > .mc-tech-entry__brand-logo {
    background: #fff;
    border: 1px solid rgb(232 200 117 / 70%);
    border-radius: 50%;
    box-shadow: 0 4px 13px rgb(0 0 0 / 25%);
    object-fit: contain;
    padding: 2px;
}

.mc-tech-entry strong,
.mc-tech-entry small {
    display: block;
}

.mc-tech-entry strong {
    color: #fff;
    font-size: .78rem;
    letter-spacing: .025em;
    line-height: 1.25;
}

.mc-tech-entry small {
    color: rgb(222 239 250 / 76%);
    font-size: .68rem;
    line-height: 1.25;
    margin-top: 2px;
}

.mc-tech-entry__button {
    align-items: center;
    background: rgb(255 255 255 / 7%);
    border: 1px solid rgb(114 215 255 / 32%);
    border-radius: 999px;
    color: #edf8ff;
    cursor: pointer;
    display: inline-flex;
    font-size: .72rem;
    font-weight: 800;
    justify-content: center;
    min-height: 44px;
    padding: 8px 13px;
    transition: background 180ms ease, border-color 180ms ease, transform 180ms ease;
    white-space: nowrap;
}

.mc-tech-entry__button:hover {
    background: rgb(114 215 255 / 14%);
    border-color: rgb(232 200 117 / 70%);
    color: #fff;
    transform: translateY(-1px);
}

.mc-tech-entry__button:focus-visible,
.mc-tech-dialog button:focus-visible,
.mc-tech-dialog .mc-tech-document__toggle:focus-visible,
.mc-tech-dialog a:focus-visible {
    outline: 3px solid #72d7ff;
    outline-offset: 3px;
}

.mc-tech-entry--podcast {
    margin: 10px 0 18px;
    min-height: 78px;
    padding: 10px 12px;
}

.mc-tech-entry--podcast::before {
    background:
        linear-gradient(100deg, rgb(2 12 26 / 88%) 0%, rgb(4 24 43 / 62%) 54%, rgb(3 19 37 / 78%) 100%),
        linear-gradient(180deg, rgb(5 22 40 / 10%), rgb(3 14 29 / 64%));
}

.mc-tech-entry--podcast .mc-tech-entry__visual img {
    object-position: 61% 48%;
}

.mc-tech-entry--login {
    margin: -1.25rem auto 1.5rem;
    max-width: 420px;
    min-height: 132px;
    padding: 12px 14px;
}

.mc-tech-entry--login::before {
    background:
        linear-gradient(90deg, rgb(2 12 26 / 78%) 0%, rgb(3 18 35 / 62%) 38%, rgb(3 20 38 / 22%) 62%, rgb(3 19 37 / 36%) 78%, rgb(2 13 28 / 64%) 100%),
        linear-gradient(180deg, rgb(4 22 42 / 8%) 0%, rgb(2 13 27 / 48%) 100%);
}

.mc-tech-entry--login .mc-tech-entry__visual img {
    filter: brightness(1.28) saturate(1.16);
    object-position: 64% 44%;
}

.mc-tech-entry--login > span {
    background: rgb(2 13 28 / 28%);
    border-radius: 9px;
    padding: 7px 8px;
    text-shadow: 0 1px 8px rgb(0 0 0 / 85%);
}

.mc-tech-entry--login .mc-tech-entry__button {
    background: rgb(2 13 28 / 48%);
    box-shadow: 0 5px 16px rgb(0 0 0 / 20%);
}

.mc-tech-dialog[hidden] {
    display: none;
}

.mc-tech-dialog {
    align-items: center;
    background: rgb(1 8 20 / 96%);
    display: flex;
    inset: 0;
    justify-content: center;
    padding: clamp(10px, 3vw, 32px);
    pointer-events: auto;
    position: fixed;
    touch-action: none;
    z-index: 12000;
}

.mc-tech-dialog--podcast {
    align-items: stretch;
    background: linear-gradient(
        to bottom,
        rgb(1 8 20 / 48%) 0 var(--premium-topbar-height, 4.75rem),
        rgb(1 8 20 / 96%) var(--premium-topbar-height, 4.75rem) 100%
    );
    padding: calc(var(--premium-topbar-height, 4.75rem) + .7rem) clamp(10px, 3vw, 32px) .5rem;
}

.mc-tech-dialog__panel {
    background: #06162b;
    border: 1px solid rgb(232 200 117 / 65%);
    border-radius: 22px;
    box-shadow: 0 30px 90px rgb(0 0 0 / 55%);
    color: #eaf6ff;
    display: flex;
    flex-direction: column;
    max-height: min(90dvh, 920px);
    max-width: 980px;
    overflow: hidden;
    pointer-events: auto;
    position: relative;
    touch-action: none;
    width: 100%;
    z-index: 1;
}

.mc-tech-dialog__panel::before {
    background:
        linear-gradient(180deg, rgb(2 11 25 / 28%) 0%, rgb(2 14 30 / 48%) 42%, rgb(2 12 27 / 62%) 100%),
        linear-gradient(90deg, rgb(3 15 31 / 38%), rgb(5 24 45 / 18%) 48%, rgb(3 15 31 / 42%));
    content: '';
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 1;
}

.mc-tech-dialog--podcast .mc-tech-dialog__panel {
    height: 100%;
    max-height: 100%;
    min-height: 0;
}

.mc-tech-dialog__header {
    align-items: center;
    border-bottom: 1px solid rgb(126 211 255 / 15%);
    display: flex;
    flex: 0 0 auto;
    justify-content: space-between;
    padding: 14px 18px;
    position: relative;
    z-index: 3;
    background: linear-gradient(90deg, rgb(3 16 34 / 82%), rgb(4 22 42 / 58%), rgb(3 16 34 / 74%));
    backdrop-filter: blur(10px);
}

.mc-tech-dialog__brand {
    align-items: center;
    display: flex;
    gap: 12px;
}

.mc-tech-dialog__brand img {
    border: 1px solid rgb(232 200 117 / 72%);
    border-radius: 50%;
    object-fit: contain;
}

.mc-tech-dialog__brand strong,
.mc-tech-dialog__brand small {
    display: block;
}

.mc-tech-dialog__brand strong {
    color: #f4d98e;
    font-size: .9rem;
    letter-spacing: .09em;
}

.mc-tech-dialog__brand small {
    color: #bfdbec;
    font-size: .62rem;
    letter-spacing: .16em;
    margin-top: 2px;
}

.mc-tech-dialog__close {
    align-items: center;
    background: rgb(255 255 255 / 7%);
    border: 1px solid rgb(255 255 255 / 18%);
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 1.7rem;
    height: 44px;
    justify-content: center;
    line-height: 1;
    position: relative;
    width: 44px;
    z-index: 2;
}

.mc-tech-dialog__scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 0 clamp(15px, 4vw, 42px) 34px;
    scrollbar-color: #3daedc #07192d;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
    position: relative;
    z-index: 2;
}

.mc-tech-embedded {
    display: block;
    overflow: hidden;
    border: 1px solid rgb(232 200 117 / 55%);
    border-radius: 22px;
    color: #eef8ff;
    background:
        radial-gradient(circle at 18% 0, rgb(92 202 255 / 16%), transparent 28rem),
        linear-gradient(155deg, #0f2f52, #030916);
    box-shadow: 0 20px 48px rgb(3 9 22 / 22%);
}

.mc-tech-embedded__content {
    padding: 1px clamp(15px, 4vw, 42px) 34px;
}

.mc-tech-dialog__hero {
    background: linear-gradient(100deg, rgb(2 13 28 / 72%) 0%, rgb(3 20 38 / 46%) 55%, rgb(3 19 36 / 18%) 100%);
    border: 1px solid rgb(126 211 255 / 18%);
    border-radius: 16px;
    box-sizing: border-box;
    isolation: isolate;
    margin-top: clamp(18px, 3vw, 28px);
    min-height: 220px;
    overflow: hidden;
    padding: 30px 32px;
    position: relative;
}

.mc-tech-dialog__hero::before {
    background:
        linear-gradient(90deg, rgb(2 13 28 / 66%) 0%, rgb(3 20 38 / 38%) 54%, transparent 100%),
        linear-gradient(180deg, rgb(4 22 42 / 8%) 0%, rgb(2 13 27 / 34%) 100%);
    content: '';
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 1;
}

.mc-tech-dialog__visual--surface,
.mc-tech-dialog__visual--surface img {
    height: 100%;
    inset: 0;
    position: absolute;
    width: 100%;
}

.mc-tech-dialog__visual--surface {
    border-radius: 21px;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.mc-tech-dialog__visual--surface img {
    border-radius: 21px;
    filter: brightness(1.18) saturate(1.12);
    object-fit: cover;
    object-position: 64% top;
}

.mc-tech-dialog__hero > * {
    position: relative;
    z-index: 2;
}

.mc-tech-dialog__eyebrow {
    color: #e8c875;
    font-size: .69rem;
    font-weight: 850;
    letter-spacing: .16em;
    margin: 0 0 11px;
    text-transform: uppercase;
}

.mc-tech-dialog__hero h2 {
    color: #fff;
    font-size: clamp(1.65rem, 4vw, 2.65rem);
    font-weight: 780;
    letter-spacing: -.025em;
    line-height: 1.12;
    margin: 0;
}

.mc-tech-dialog__patent-number {
    color: #f4d98e;
    font-size: .78rem;
    font-weight: 760;
    letter-spacing: .08em;
    margin: 9px 0 0;
}

.mc-tech-dialog__hero > p:last-child {
    color: #bbd0df;
    line-height: 1.65;
    margin: 15px 0 0;
    max-width: 650px;
}

.mc-tech-dialog__diagram {
    display: none;
    height: 150px;
    opacity: .46;
    pointer-events: none;
    position: absolute !important;
    right: 0;
    top: 18px;
    width: 220px;
}

.mc-tech-dialog__diagram i {
    border: 1px solid #66cff8;
    border-radius: 50%;
    inset: 12px 35px;
    position: absolute;
    transform: rotate(24deg);
}

.mc-tech-dialog__diagram i:nth-child(2) {
    inset: 35px 12px;
    transform: rotate(-28deg);
}

.mc-tech-dialog__diagram i:nth-child(3) {
    border-color: #e8c875;
    inset: 26px 54px;
    transform: rotate(70deg);
}

.mc-tech-dialog__diagram span {
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 0 18px #72d7ff;
    height: 7px;
    left: 50%;
    position: absolute;
    top: 50%;
    width: 7px;
}

.mc-tech-document {
    display: grid;
    gap: 10px;
    padding-top: 22px;
}

.mc-tech-document__item {
    background: linear-gradient(135deg, rgb(7 35 62 / 64%), rgb(3 18 36 / 54%));
    border: 1px solid rgb(157 220 250 / 20%);
    border-radius: 13px;
    backdrop-filter: blur(10px);
    overflow: clip;
    transition: background-color 180ms ease, border-color 180ms ease, box-shadow 220ms ease;
}

.mc-tech-document__item:has(.mc-tech-document__toggle[aria-expanded="true"]) {
    background: linear-gradient(135deg, rgb(8 40 70 / 76%), rgb(3 19 38 / 68%));
    border-color: rgb(114 215 255 / 38%);
}

.mc-tech-document__toggle {
    align-items: center;
    appearance: none;
    background: transparent;
    border: 0;
    color: #f3f9fd;
    cursor: pointer;
    display: flex;
    font-family: inherit;
    font-size: .92rem;
    font-weight: 760;
    gap: 12px;
    justify-content: flex-start;
    min-height: 50px;
    padding: 9px 44px 9px 13px;
    position: relative;
    text-align: left;
    width: 100%;
}

.mc-tech-document__toggle::after {
    color: #72d7ff;
    content: '+';
    font-size: 1.35rem;
    position: absolute;
    right: 16px;
    transition: color 180ms ease, transform 280ms cubic-bezier(.22, 1, .36, 1);
}

.mc-tech-document__toggle[aria-expanded="true"]::after {
    content: '−';
    transform: rotate(180deg);
}

.mc-tech-document__toggle span {
    color: #e8c875;
    flex: 0 0 auto;
    font-size: .7rem;
    letter-spacing: .08em;
}

.mc-tech-document__section {
    border-top: 1px solid rgb(157 220 250 / 12%);
    color: #bfd2df;
    line-height: 1.72;
    overflow: hidden;
    padding: 16px clamp(14px, 3vw, 28px) 19px;
    text-shadow: 0 1px 7px rgb(0 0 0 / 55%);
}

.mc-tech-document__section p {
    margin: 0 0 13px;
}

.mc-tech-document__section p:last-child {
    margin-bottom: 0;
}

.mc-tech-document__section strong {
    color: #f3f8fc;
}

.mc-tech-document__section li + li {
    margin-top: 6px;
}

.mc-tech-document__technology-brand {
    align-items: center;
    background: linear-gradient(120deg, rgb(232 200 117 / 12%), rgb(114 215 255 / 8%));
    border: 1px solid rgb(232 200 117 / 28%);
    border-radius: 14px;
    display: flex;
    gap: 14px;
    margin: 0 0 18px;
    padding: 12px 14px;
}

.mc-tech-document__technology-brand img {
    background: #fff;
    border: 1px solid rgb(232 200 117 / 70%);
    border-radius: 50%;
    flex: 0 0 auto;
    height: 76px;
    object-fit: contain;
    padding: 3px;
    width: 76px;
}

.mc-tech-document__technology-brand span,
.mc-tech-document__technology-brand small {
    display: block;
    min-width: 0;
}

.mc-tech-document__technology-brand strong {
    color: #f4d98e;
    font-size: .92rem;
}

.mc-tech-document__technology-brand small {
    color: #bfd2df;
    font-size: .75rem;
    margin-top: 3px;
}

.mc-tech-document__patent-link {
    color: #8de1ff;
    display: inline-flex;
    font-weight: 750;
    min-height: 44px;
    padding: 10px 0;
}

.mc-tech-document__patent-pending {
    border-left: 3px solid #e8c875;
    color: #d8cda8;
    font-size: .82rem;
    padding: 8px 11px;
}

body.mc-tech-dialog-open {
    overflow: hidden !important;
}

@media (max-width: 767px) {
    .mc-tech-dialog {
        align-items: stretch;
        justify-content: center;
        padding: .5rem 8px;
    }

    .mc-tech-dialog--podcast {
        padding-top: calc(var(--premium-topbar-height, 4.75rem) + .7rem);
    }

    .mc-tech-dialog__panel {
        height: 100%;
        max-height: 100%;
        min-height: 0;
    }

    .mc-tech-dialog__header {
        position: relative;
        z-index: 3;
    }

    .mc-tech-dialog__hero {
        border-radius: 12px;
        margin-top: 14px;
        min-height: 218px;
        padding: 20px 18px;
    }
}

@media (max-width: 680px) {
    .mc-tech-entry {
        align-items: center;
        grid-template-columns: auto minmax(0, 1fr);
    }

    .mc-tech-entry__button {
        grid-column: 1 / -1;
        justify-self: stretch;
        width: 100%;
    }

    .mc-tech-entry--login {
        margin-top: -1.4rem;
        min-height: 146px;
        padding: 11px 12px;
    }

    .mc-tech-entry--login::before {
        background:
            linear-gradient(90deg, rgb(2 12 26 / 70%) 0%, rgb(3 18 35 / 42%) 42%, rgb(3 20 38 / 18%) 66%, rgb(2 13 28 / 48%) 100%),
            linear-gradient(180deg, rgb(4 22 42 / 6%) 0%, rgb(2 13 27 / 54%) 100%);
    }

    .mc-tech-entry--podcast {
        min-height: 108px;
    }

    .mc-tech-entry--podcast .mc-tech-entry__visual img {
        object-position: 64% center;
    }

    .mc-tech-entry--login .mc-tech-entry__visual img {
        object-position: 70% 46%;
    }

    .mc-tech-dialog__panel {
        border-radius: 16px;
    }

    .mc-tech-dialog__header {
        padding: 10px 12px;
    }

    .mc-tech-dialog__brand img {
        height: 46px;
        width: 46px;
    }

    .mc-tech-dialog__diagram {
        opacity: .2;
        width: 150px;
    }

    .mc-tech-dialog__hero > p:last-child {
        max-width: 88%;
    }

    .mc-tech-dialog__hero::before {
        background:
            linear-gradient(90deg, rgb(2 13 28 / 74%) 0%, rgb(3 20 38 / 48%) 68%, rgb(3 19 36 / 20%) 100%),
            linear-gradient(180deg, rgb(3 18 35 / 12%) 0%, rgb(2 13 27 / 46%) 100%);
    }

    .mc-tech-dialog__visual--surface {
        border-radius: 15px;
    }

    .mc-tech-dialog__visual--surface img {
        border-radius: 15px;
        object-fit: cover;
        object-position: 66% top;
    }
}

@media (min-width: 681px) and (max-width: 1024px) {
    .mc-tech-entry--login {
        grid-template-columns: auto minmax(0, 1fr);
        min-height: 146px;
    }

    .mc-tech-entry--login .mc-tech-entry__button {
        grid-column: 1 / -1;
        justify-self: stretch;
        width: 100%;
    }

    .mc-tech-entry--login .mc-tech-entry__visual img {
        object-position: 58% 42%;
    }

    .mc-tech-dialog__visual--surface img {
        object-position: 62% top;
    }
}

@media (max-width: 430px) {
    .mc-tech-entry {
        max-width: 100%;
        overflow: hidden;
    }

    .mc-tech-dialog__scroll,
    .mc-tech-document,
    .mc-tech-document__item,
    .mc-tech-document__toggle,
    .mc-tech-document__section {
        max-width: 100%;
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .mc-tech-document__technology-brand {
        gap: 10px;
        padding: 10px;
    }

    .mc-tech-document__technology-brand img {
        height: 58px;
        width: 58px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mc-tech-entry__button,
    .mc-tech-document__item,
    .mc-tech-document__toggle::after,
    .mc-tech-document__section {
        animation: none;
        transition: none;
    }

    .mc-tech-entry__button:hover {
        transform: none;
    }
}