.mira-arrow-button {
    --arrow-size: 3rem;
    --arrow-background: rgba(116, 116, 128, .08);
    --arrow-color: #8e8e93;
    --arrow-hover-background: #000;
    --arrow-hover-color: #fff;
    --arrow-disabled-opacity: .4;
    display: inline-grid;
    place-items: center;
    flex: none;
    width: var(--arrow-size);
    min-width: var(--arrow-size);
    height: var(--arrow-size);
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--arrow-background);
    color: var(--arrow-color);
    text-decoration: none;
    cursor: pointer;
    touch-action: manipulation;
    transition: background-color .2s ease, color .2s ease, opacity .2s ease;
}

.mira-arrow-button_s { --arrow-size: 2.5rem; }

.mira-arrow-button_color {
    --arrow-background: rgba(255, 255, 255, .2);
    --arrow-color: #fff;
    --arrow-hover-background: #fff;
    --arrow-hover-color: #000;
    --arrow-disabled-opacity: .2;
}

.mira-arrow-button__icon {
    display: block;
    width: 1.125rem;
    height: .875rem;
    background: currentColor;
    mask: url(../../img/ui/navigation-arrow.svg) center / contain no-repeat;
    transform: scaleX(-1);
}

.mira-arrow-button_next .mira-arrow-button__icon { transform: none; }

@media (hover: hover) {
    .mira-arrow-button:hover:not(:disabled):not(.is-disabled):not([aria-disabled="true"]) {
        background-color: var(--arrow-hover-background);
        color: var(--arrow-hover-color);
    }
}

.mira-arrow-button:active:not(:disabled):not(.is-disabled):not([aria-disabled="true"]),
.mira-arrow-button:focus-visible {
    background-color: var(--arrow-hover-background);
    color: var(--arrow-hover-color);
}

.mira-arrow-button:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.mira-arrow-button_light:focus-visible { outline-color: #000; }
.mira-arrow-button_color:focus-visible { outline-color: #fff; }

.mira-arrow-button:disabled,
.mira-arrow-button.is-disabled,
.mira-arrow-button[aria-disabled="true"] {
    background-color: var(--arrow-background);
    color: var(--arrow-color);
    opacity: var(--arrow-disabled-opacity);
    cursor: default;
    pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
    .mira-arrow-button { transition: none; }
}

.mira-text-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .25rem;
    color: var(--text-link-color, #3d51ff);
    font-size: .9375rem;
    font-weight: 600;
    line-height: 1.25rem;
    text-decoration: none;
}

.mira-arrow-icon {
    flex: none;
    width: 0.825em;
    height: 0.825em;
    background-color: currentColor;
    mask: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTEiIGhlaWdodD0iMTEiIHZpZXdCb3g9IjAgMCAxMSAxMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuNzk1NDUgMTAuMzMzOEw0LjY5ODE1IDkuMjQ3MTZMNy45ODQ3MyA1Ljk2MDU5SDBWNC4zNzMyM0g3Ljk4NDczTDQuNjk4MTUgMS4wOTE5OEw1Ljc5NTQ1IDUuMzA0ODFlLTA2TDEwLjk2MjQgNS4xNjY5MUw1Ljc5NTQ1IDEwLjMzMzhaIiBmaWxsPSIjM0Q1MUZGIi8+Cjwvc3ZnPg==') center / contain no-repeat;
    transition: transform .2s ease;
    top: 1px;
    left: 0.5px;
    position: relative;
}

@media (hover: hover) {
    :is(.mira-text-link, .new-button):hover .mira-arrow-icon { transform: translateX(2px); }
}

.mira-text-link:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.mira-text-link:focus-visible .mira-arrow-icon { transform: translateX(2px); }

@media (prefers-reduced-motion: reduce) {
    .mira-arrow-icon { transition: none; }
}

.c-label {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 0.25rem;
    padding: 0.5rem 1.25rem;
    border-radius: 6.25rem;
    font-family: "Inter Display", Inter, sans-serif;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #000;
}

.c-label.is-with-icon {
    padding: 0.25rem 1rem 0.25rem 0.75rem;
}

.c-label.is-with-icon .c-label__text {
    opacity: 0.7;
}

.c-label__icon {
    flex: none;
    width: 1.125rem;
    height: 1.125rem;
    margin: 0.125rem 0.0625rem;
}

.c-emoji {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: top;
}

.u-section-header-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    max-width: 38.25rem;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.u-section-header-group > .u-margin-top-12 {
    margin-top: 0;
}

.c-section-subtitle {
    margin-top: 0.25rem;
    font-family: var(--font-body);
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 1.4;
    color: var(--color-text-hint);
}

@media screen and (max-width: 767px) {
    .c-section-subtitle {
        margin-top: 0.5rem;
        font-size: 1rem;
    }
}

.c-team-agent-card {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    max-width: 25.1875rem;
}

.c-team-agent-card__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    padding: 1.75rem 2rem 3rem;
    border-radius: var(--radius-card);
    background-image: linear-gradient(180deg, var(--color-text-accent), #3ad4ff1a);
}

.c-team-agent-card__content.is-white-bg {
    justify-content: center;
    background-image: linear-gradient(#fffc, #ffffff4d 90%);
}

.team-agent-card__image {
    margin-top: 1.5rem;
}

.new-button:where(.new-button_medium, .w-variant-7fb31e43-8bc9-5514-14b9-fb0cdb0dc1cd, .w-variant-4055dd53-8c45-bd05-6ebc-11fe99dc5e09, .w-variant-44845bbc-35b1-9df2-676f-e8c588bf048a, .w-variant-9ac3a98d-9436-b9f6-951a-92f4dcc80a00) {
    height: 3.125rem;
    min-width: 6.25rem;
    padding: 0 1.5rem;
    gap: 0.375rem;
    border-radius: 2rem;
    font-size: 1.0625rem;
    font-weight: 600;
    line-height: 1.375rem;
    letter-spacing: -0.43px;
}

.new-button:where(.w-variant-44845bbc-35b1-9df2-676f-e8c588bf048a) {
    background-color: #007aff;
    color: var(--color-text-inverse);
    box-shadow: inset 0.67px 0.67px 0 0 rgba(255, 255, 255, 0.2), inset -0.67px -0.67px 0 0 rgba(255, 255, 255, 0.2);
}

.new-button:where(.w-variant-9ac3a98d-9436-b9f6-951a-92f4dcc80a00) {
    background-color: rgba(116, 116, 128, 0.12);
    color: #000;
}

.new-button:where(.new-button_medium, .w-variant-4055dd53-8c45-bd05-6ebc-11fe99dc5e09, .w-variant-44845bbc-35b1-9df2-676f-e8c588bf048a) .new-button__icon-wrapper:first-child {
    display: flex;
    justify-content: flex-end;
    width: 1.25rem;
}

.new-button:where(.new-button_medium, .w-variant-4055dd53-8c45-bd05-6ebc-11fe99dc5e09) .new-button__icon {
    flex: none;
    margin-bottom: 0;
}

.new-button:where(.w-variant-7fb31e43-8bc9-5514-14b9-fb0cdb0dc1cd, .w-variant-4055dd53-8c45-bd05-6ebc-11fe99dc5e09) {
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
}

.new-button:where(.w-variant-44845bbc-35b1-9df2-676f-e8c588bf048a) .new-button__icon {
    flex: none;
    background-image: url(/wp-content/uploads/2026/09/new-btn-icon.svg);
}

.new-button .new-button__icon-wrapper:last-child:empty {
    display: none;
}

.new-button:where(.w-variant-4bf746c1-ed0d-2d72-7252-b9e905e3e136) {
    height: 2.375rem;
    min-width: 5rem;
    padding: 0 1rem;
    gap: 0.25rem;
    border-radius: 1.5625rem;
    background-color: rgba(255, 255, 255, 0.08);
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    box-shadow: inset -1px -1px 0 0 rgba(255, 255, 255, 0.4), inset 1px 1px 0 0 rgba(255, 255, 255, 0.4);
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.25rem;
    letter-spacing: -0.43px;
    color: var(--color-text-inverse);
}

/* Figma "Mira/Blue Radial Gradient": an ellipse skewed along the card diagonal, not expressible with CSS radial-gradient. */
.u-bg-blue-radial {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1' preserveAspectRatio='none'%3E%3CradialGradient id='g' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='1' gradientTransform='matrix(1 1 -1.88 4.448 0 0)'%3E%3Cstop stop-color='%232e49fb'/%3E%3Cstop offset='1' stop-color='%233ad4ff'/%3E%3C/radialGradient%3E%3Crect width='1' height='1' fill='url(%23g)'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
}