/* H.O.R.D.E. Visual Refresh Phase 3A
   Approved public hero: real H.O.R.D.E. product screenshots only. */

body.horde-public-site.horde-public-home .horde-real-product-hero {
    display: block;
    width: min(100%, 630px);
    max-width: 630px;
    margin: 0 0 0 auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
    line-height: 0;
}

body.horde-public-site.horde-public-home .horde-real-product-hero::before,
body.horde-public-site.horde-public-home .horde-real-product-hero::after {
    content: none;
    display: none;
}

body.horde-public-site.horde-public-home .horde-real-product-hero img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    border: 0;
    border-radius: 0;
    background: transparent;
    filter: drop-shadow(0 28px 48px rgba(0, 0, 0, .42));
}

html[data-theme="light"] body.horde-public-site.horde-public-home .horde-real-product-hero img {
    filter: drop-shadow(0 22px 38px rgba(15, 42, 84, .22));
}

@media (max-width: 1180px) {
    body.horde-public-site.horde-public-home .horde-real-product-hero {
        max-width: 570px;
    }
}

@media (max-width: 980px) {
    body.horde-public-site.horde-public-home .horde-real-product-hero {
        width: min(100%, 680px);
        max-width: 680px;
        margin: 8px auto 0;
    }
}

@media (max-width: 620px) {
    body.horde-public-site.horde-public-home .horde-real-product-hero {
        width: calc(100vw - 40px);
        max-width: 520px;
        margin-top: 2px;
    }
}


/* Phase 3D: selected real-product collage, constructed from supplied HORDE captures. */
body.horde-public-site.horde-public-home .horde-real-product-hero {
    width: min(100%, 680px);
    max-width: 680px;
    margin: 0 0 0 auto;
    isolation: isolate;
}
body.horde-public-site.horde-public-home .horde-real-product-hero img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    filter: drop-shadow(0 30px 52px rgba(0, 0, 0, .48));
    -webkit-mask-image: radial-gradient(ellipse 74% 74% at 50% 50%, #000 72%, transparent 100%);
    mask-image: radial-gradient(ellipse 74% 74% at 50% 50%, #000 72%, transparent 100%);
}
@media (max-width: 1180px) {
  body.horde-public-site.horde-public-home .horde-real-product-hero { max-width: 600px; }
}
@media (max-width: 980px) {
  body.horde-public-site.horde-public-home .horde-real-product-hero { width: min(100%, 690px); max-width: 690px; margin: 8px auto 0; }
}
@media (max-width: 620px) {
  body.horde-public-site.horde-public-home .horde-real-product-hero { width: calc(100vw - 32px); max-width: 540px; }
}

/* Release prep final: caption locks to the actual product image as a restrained HORDE signal label. */
body.horde-public-site.horde-public-home .horde-real-product-stack {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-self: center;
    align-self: start;
    width: 100%;
    max-width: 680px;
    margin: 0;
    min-width: 0;
}

body.horde-public-site.horde-public-home .horde-real-product-stack .horde-real-product-hero {
    display: block;
    width: 100%;
    max-width: none;
    margin: 0;
}

body.horde-public-site.horde-public-home .horde-real-product-stack .horde-real-product-caption {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: fit-content;
    margin: 8px auto 0;
    padding: .33rem .54rem;
    border: 1px solid rgba(62, 166, 255, .34);
    border-radius: 4px;
    background: rgba(37, 99, 235, .12);
    color: #bfdbfe;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    font-size: .61rem;
    font-weight: 900;
    letter-spacing: .105em;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
    box-shadow: none;
    text-shadow: none;
}

html[data-theme="light"] body.horde-public-site.horde-public-home .horde-real-product-stack .horde-real-product-caption {
    border-color: rgba(22, 92, 184, .30);
    background: rgba(22, 92, 184, .07);
    color: #165cb8;
}

@media (max-width: 1180px) {
    body.horde-public-site.horde-public-home .horde-real-product-stack { max-width: 600px; }
}

@media (max-width: 980px) {
    body.horde-public-site.horde-public-home .horde-real-product-stack {
        width: min(100%, 690px);
        max-width: 690px;
        margin: 8px auto 0;
    }
}

@media (max-width: 620px) {
    body.horde-public-site.horde-public-home .horde-real-product-stack {
        width: calc(100vw - 32px);
        max-width: 540px;
    }

    body.horde-public-site.horde-public-home .horde-real-product-stack .horde-real-product-caption {
        margin-top: 7px;
        font-size: .55rem;
        letter-spacing: .09em;
        white-space: normal;
    }
}

/* Release prep hotfix: remove the diagonal public-page accent line and let the real-product
   hero dissolve into the page instead of ending as a hard square image. */
body.horde-public-site .wrap::before {
    background: radial-gradient(ellipse 72% 48% at 86% -2%, var(--horde-blue-tint-strong), transparent 68%) !important;
    opacity: .54 !important;
}

body.horde-public-site.horde-public-home .horde-real-product-stack {
    position: relative;
    isolation: isolate;
}

body.horde-public-site.horde-public-home .horde-real-product-stack::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 7% 5% 15%;
    pointer-events: none;
    background: radial-gradient(ellipse at center, rgba(37, 99, 235, .20) 0%, rgba(37, 99, 235, .075) 46%, transparent 74%);
    filter: blur(28px);
}

body.horde-public-site.horde-public-home .horde-real-product-stack .horde-real-product-hero img {
    /* Broad transparent falloff around all four edges. */
    -webkit-mask-image: radial-gradient(ellipse 92% 90% at 50% 49%, #000 46%, rgba(0, 0, 0, .94) 58%, rgba(0, 0, 0, .68) 72%, rgba(0, 0, 0, .28) 88%, transparent 100%) !important;
    mask-image: radial-gradient(ellipse 92% 90% at 50% 49%, #000 46%, rgba(0, 0, 0, .94) 58%, rgba(0, 0, 0, .68) 72%, rgba(0, 0, 0, .28) 88%, transparent 100%) !important;
    filter: drop-shadow(0 24px 44px rgba(0, 0, 0, .40)) !important;
}

html[data-theme="light"] body.horde-public-site.horde-public-home .horde-real-product-stack .horde-real-product-hero img {
    filter: drop-shadow(0 20px 34px rgba(15, 42, 84, .18)) !important;
}


/* Release prep final polish: no diagonal rail in the hero field; preserve only a quiet blue atmosphere. */
body.horde-public-site .wrap::before {
    background: radial-gradient(ellipse 72% 48% at 86% -2%, var(--horde-blue-tint-strong), transparent 68%) !important;
    opacity: .54 !important;
}

/* Let the real-product collage dissolve into the navy hero field rather than ending on a hard square. */
body.horde-public-site.horde-public-home .horde-real-product-stack .horde-real-product-hero img {
    -webkit-mask-image: radial-gradient(ellipse 104% 100% at 50% 50%,
        #000 40%,
        rgba(0, 0, 0, .96) 55%,
        rgba(0, 0, 0, .78) 69%,
        rgba(0, 0, 0, .42) 84%,
        transparent 100%) !important;
    mask-image: radial-gradient(ellipse 104% 100% at 50% 50%,
        #000 40%,
        rgba(0, 0, 0, .96) 55%,
        rgba(0, 0, 0, .78) 69%,
        rgba(0, 0, 0, .42) 84%,
        transparent 100%) !important;
    filter: drop-shadow(0 22px 42px rgba(0, 0, 0, .34)) !important;
}