:root {
    --redmay-brand-hover-max: 1344px;
    --redmay-brand-hover-accent: #ef4c7a;
    --redmay-brand-hover-coral: #ff6b62;
    --redmay-brand-hover-text: #211920;
    --redmay-brand-hover-muted: #776d73;
    --redmay-brand-hover-border: #f0e5e9;
}

/* Keep the original alphabet typography. Only align the existing row to REDMAY content width. */
.redmay-brand-hover-v11-alpha {
    position: relative !important;
    z-index: 1250 !important;
    box-sizing: border-box !important;
    width: 100% !important;
    overflow: visible !important;
    padding-left: max(18px, calc((100vw - var(--redmay-brand-hover-max)) / 2)) !important;
    padding-right: max(18px, calc((100vw - var(--redmay-brand-hover-max)) / 2)) !important;
}

.redmay-brand-hover-v11-alpha [data-redmay-brand-hover-letter] {
    cursor: pointer;
    transition: color .15s ease, opacity .15s ease;
}

.redmay-brand-hover-v11-alpha [data-redmay-brand-hover-letter]:hover,
.redmay-brand-hover-v11-alpha [data-redmay-brand-hover-letter]:focus-visible,
.redmay-brand-hover-v11-alpha [data-redmay-brand-hover-letter].redmay-brand-hover-v11-is-active {
    color: var(--redmay-brand-hover-accent) !important;
    outline: none;
}

.redmay-brand-hover-v11-panel {
    position: absolute;
    box-sizing: border-box;
    top: calc(100% + 1px);
    left: max(18px, calc((100vw - var(--redmay-brand-hover-max)) / 2));
    right: max(18px, calc((100vw - var(--redmay-brand-hover-max)) / 2));
    min-height: 250px;
    background: rgba(255, 255, 255, .985);
    border: 1px solid var(--redmay-brand-hover-border);
    border-top: 0;
    border-radius: 0 0 24px 24px;
    box-shadow: 0 24px 55px rgba(78, 42, 57, .14);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-5px);
    transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
    overflow: hidden;
}

.redmay-brand-hover-v11-panel.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.redmay-brand-hover-v11-panel__accent {
    height: 3px;
    background: linear-gradient(90deg, var(--redmay-brand-hover-accent), #ff8190 52%, var(--redmay-brand-hover-coral));
    opacity: .9;
}

.redmay-brand-hover-v11-panel__inner {
    display: grid;
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 38px;
    padding: 30px 38px 36px;
    background:
        radial-gradient(circle at 6% 8%, rgba(255, 100, 130, .055), transparent 22%),
        linear-gradient(180deg, #fff 0%, #fffdfd 100%);
}

.redmay-brand-hover-v11-panel__letter {
    padding-top: 4px;
    font-family: inherit;
    font-size: 66px;
    line-height: .92;
    font-weight: 700;
    letter-spacing: -.045em;
    background: linear-gradient(135deg, var(--redmay-brand-hover-accent), var(--redmay-brand-hover-coral));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    user-select: none;
}

.redmay-brand-hover-v11-panel__content {
    min-width: 0;
}

.redmay-brand-hover-v11-panel__scroll {
    max-height: min(64vh, 550px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 2px 12px 2px 0;
    scrollbar-width: thin;
    scrollbar-color: #e7cad3 transparent;
}

.redmay-brand-hover-v11-panel__columns {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 44px;
}

.redmay-brand-hover-v11-panel__column {
    min-width: 0;
}

.redmay-brand-hover-v11-panel__brand {
    display: block;
    margin: 0 0 12px;
    color: var(--redmay-brand-hover-text);
    font-family: inherit;
    font-size: 15.5px;
    line-height: 1.34;
    font-weight: 400;
    text-decoration: none;
    overflow-wrap: anywhere;
    transition: color .14s ease, transform .14s ease;
}

.redmay-brand-hover-v11-panel__brand:hover,
.redmay-brand-hover-v11-panel__brand:focus-visible {
    color: var(--redmay-brand-hover-accent);
    text-decoration: none;
    transform: translateX(2px);
    outline: none;
}

.redmay-brand-hover-v11-panel__brand.is-featured {
    font-weight: 700;
}

.redmay-brand-hover-v11-panel__status,
.redmay-brand-hover-v11-panel__empty {
    color: var(--redmay-brand-hover-muted);
    font-family: inherit;
    font-size: 15px;
    padding: 7px 0 24px;
}

@media (max-width: 1180px) {
    :root { --redmay-brand-hover-max: 1120px; }
    .redmay-brand-hover-v11-panel__inner {
        grid-template-columns: 82px minmax(0, 1fr);
        gap: 28px;
        padding-left: 28px;
        padding-right: 28px;
    }
    .redmay-brand-hover-v11-panel__columns {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        column-gap: 32px;
    }
}

@media (max-width: 820px) {
    .redmay-brand-hover-v11-alpha {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }
    .redmay-brand-hover-v11-panel {
        left: 10px;
        right: 10px;
        border-radius: 0 0 18px 18px;
    }
    .redmay-brand-hover-v11-panel__inner {
        grid-template-columns: 62px minmax(0, 1fr);
        gap: 18px;
        padding: 24px 20px 28px;
    }
    .redmay-brand-hover-v11-panel__letter {
        font-size: 48px;
    }
    .redmay-brand-hover-v11-panel__columns {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 24px;
    }
    .redmay-brand-hover-v11-panel__brand {
        font-size: 15px;
    }
}

@media (max-width: 540px) {
    .redmay-brand-hover-v11-panel__inner {
        grid-template-columns: 1fr;
    }
    .redmay-brand-hover-v11-panel__letter {
        display: none;
    }
    .redmay-brand-hover-v11-panel__columns {
        grid-template-columns: 1fr;
    }
}


/* v1.1.2: hard-disable the previous compact alphabet popup when legacy JS creates it. */
.redmay-brand-hover-v11-legacy-suppressed,
[data-redmay-legacy-brand-popup-suppressed="yes"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* REDMAY brand hover v1.2.1: use the original alphabet only.
   Container width is now handled by the unified shell in redmay_v231.css. */
.redmay-brand-dropdown{display:none!important}
@media (min-width:1180px){
  .redmay-header-brand-line .redmay-brand-strip{
    display:flex!important;
    width:100%!important;
    justify-content:center!important;
  }
}


/* ===== merged from brand-hover-wide-v135.css (v1.3.5 -> v1.3.6) on 2026-08-30T16:16:38Z ===== */
/* REDMAY BRAND HOVER WIDE v1.3.5
   Fix the actual geometry bug: the alphabet already lives in the wide
   REDMAY wrapper, therefore the hover panel must NOT apply a second
   viewport-derived inset. */

@media (min-width: 1180px) {
    /* Do not double-inset the already centered alphabet/root. */
    .redmay-brand-hover-v11-alpha {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow: visible !important;
    }

    /* Full width of the existing alphabet/navigation root. */
    .redmay-brand-hover-v11-panel {
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        max-width: none !important;
        min-height: 270px !important;
        overflow: hidden !important;
        border-radius: 0 0 22px 22px !important;
    }

    .redmay-brand-hover-v11-panel__inner {
        grid-template-columns: 112px minmax(0, 1fr) !important;
        gap: 42px !important;
        padding: 30px 46px 34px !important;
    }

    .redmay-brand-hover-v11-panel__letter {
        padding-top: 2px !important;
        font-size: 76px !important;
        line-height: .92 !important;
    }

    /*
       Four genuinely wide columns. The previous double inset made each
       column too narrow and forced normal names onto 2-3 lines.
    */
    .redmay-brand-hover-v11-panel__columns {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        column-gap: 56px !important;
        row-gap: 0 !important;
    }

    .redmay-brand-hover-v11-panel__column {
        min-width: 0 !important;
    }

    .redmay-brand-hover-v11-panel__brand {
        margin: 0 0 9px !important;
        font-size: 14.5px !important;
        line-height: 1.28 !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }

    /*
       Enough vertical room for A/B without creating the tiny viewport
       seen in the narrow version. Scroll remains available only when a
       letter genuinely contains more rows than the screen can show.
    */
    .redmay-brand-hover-v11-panel__scroll {
        max-height: min(74vh, 760px) !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding: 2px 12px 2px 0 !important;
    }
}

/* Narrow desktop / tablet behavior remains responsive. */
@media (min-width: 821px) and (max-width: 1179px) {
    .redmay-brand-hover-v11-panel {
        left: 0 !important;
        right: 0 !important;
    }

    .redmay-brand-hover-v11-panel__columns {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}