/* New site code; immutable legacy styles retain the original design rules. */
.vc_column-inner { margin-bottom: 40px; }
.ag-hero {
    position: relative;
    height: 100vh;
    width: 100vw;
    margin-left: var(--ag-hero-offset, 0px);
    background-position: center;
    background-size: cover;
    overflow: hidden;
    &::before { content: ""; position: absolute; inset: 0; background: rgb(0 0 0 / 30%); pointer-events: none; }
}
.ag-scene {
    /* These proportions reproduce the existing artwork, with viewport scaling. */
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 18px;
    width: 342px;
    height: 739px;
    transform: translateX(-50%) scale(var(--ag-scene-scale, 1));
    transform-origin: top center;
    color: white;
    & > * { position: absolute; left: 50%; transform: translateX(-50%); white-space: nowrap; }
    & .ag-scene-panel { top: 154px; width: 310px; height: 468px; background: rgb(67 195 215 / 90%); }
    & .ag-scene-eyebrow { top: 222px; font: 400 24px/20px JUICE; }
    & .ag-scene-title { top: 263px; font: 600 35px/38px britannic_boldbold; color: black; }
    & .ag-scene-description { top: 373px; margin-left: 6px; font: 400 30px/34px JUICE; }
    & .ag-scene-button { top: 533px; width: 182px; height: 50px; padding: 10px 30px; font: 500 20px/28px JUICE; color: #43c3d7; background: rgb(255 255 255 / 75%); text-decoration: none; }
    & .ag-scene-button:hover { color: black; background: white; }
}
@media (min-width: 480px) {
    .ag-scene {
        width: 100%;
        & .ag-scene-panel { top: 225px; width: 393px; height: 516px; }
        & .ag-scene-eyebrow { top: 295px; font-size: 35px; line-height: 40px; }
        & .ag-scene-title { top: 344px; margin-left: -1px; font-size: 40px; line-height: 60px; }
        & .ag-scene-description { top: 480px; margin-left: 3px; font-size: 30px; line-height: 35px; }
        & .ag-scene-button { top: 642px; width: max-content; height: auto; font-size: 22px; line-height: 30px; }
    }
}
@media (min-width: 501px) { .ag-hero::before { display: none; } }
@media (min-width: 960px) { .ag-scene { margin-left: 120px; } }
@media (min-width: 1024px) {
    .ag-scene {
        width: 496px; height: 742px;
        & .ag-scene-panel { width: 351px; height: 509px; }
        & .ag-scene-eyebrow { top: 296px; line-height: 35px; }
        & .ag-scene-title { top: 337px; margin-left: 0; font-size: 50px; }
        & .ag-scene-description { top: 488px; margin-left: -1px; }
        & .ag-scene-button { top: 678px; }
    }
}
@media (min-width: 1240px) {
    .ag-scene {
        top: 107px;
        & .ag-scene-panel { top: 203px; }
        & .ag-scene-eyebrow { top: 249px; }
        & .ag-scene-title { top: 290px; }
        & .ag-scene-description { top: 431px; margin-left: -3px; width: 309px; font-size: 36px; line-height: 40px; }
        & .ag-scene-button { top: 631px; }
    }
}
@media (min-width: 2561px) { .ag-scene { margin-left: 0; } }
.ag-instagram {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    & img { width: 100%; aspect-ratio: 1; object-fit: cover; }
}
.ubermenu {
    & .ubermenu-submenu { display: none; }
    & li:hover > .ubermenu-submenu, & li:focus-within > .ubermenu-submenu { display: block; }
}
