/* Desktop homepage artwork. The separate mobile hero keeps its own assets. */
.rw-hero-detailed .rw-laptop-frame {
    padding: clamp(12px, 1.3vw, 17px);
    border: 2px solid #a4aebc;
    border-radius: clamp(16px, 1.7vw, 25px) clamp(16px, 1.7vw, 25px) 7px 7px;
    background: linear-gradient(130deg, #232b36, #080c12 48%, #151c27);
    box-shadow: inset 0 0 0 1px #020509, inset 0 2px 1px #67717c,
        0 0 0 1px #26303d, 2px 3px 0 #657487, 0 8px 16px #10284024;
}

.rw-hero-detailed .rw-laptop-lid::after {
    border: 2px solid #aeb7c3;
    border-radius: clamp(16px, 1.7vw, 25px);
    background: url("Images/Logo.png?v=20260715-live") center / 14% auto no-repeat,
        linear-gradient(112deg, #ecf0f4, #a9b4c2 38%, #dce3e9 68%, #7c8b9d);
    box-shadow: inset 0 0 0 1px #ffffff90, inset -2px -3px 6px #38475b60,
        0 12px 25px #071b3430;
}

.rw-hero-detailed .rw-laptop-frame::before {
    top: 1px;
    left: 3%;
    width: 72%;
    height: 1px;
    opacity: .6;
}

.rw-hero-detailed .rw-laptop-frame::after {
    content: "R U M B L E";
    position: absolute;
    bottom: 3px;
    left: 0;
    right: 0;
    color: #a7b3c2;
    font: 500 5px/1.2 Arial, sans-serif;
    text-align: center;
    pointer-events: none;
}

.rw-hero-detailed .rw-laptop-camera {
    top: 5px;
    width: 5px;
    height: 5px;
    background: radial-gradient(circle at 35% 30%, #99bed6 0 8%, #24455c 20%, #080d16 65%);
    box-shadow: 0 0 0 1px #373f49, 12px 0 0 -1.5px #485561;
}

.rw-hero-detailed .rw-laptop-screen {
    border: 1px solid #020810;
    border-radius: clamp(7px, .7vw, 11px);
    box-shadow: inset 0 0 20px #0008, 0 0 0 1px #394350;
}

/* Both display panels remain light surfaces when the surrounding page is dark. */
.rw-hero-detailed .rw-screen-brand-copy h1,
.rw-hero-detailed .rw-board-title {
    color: var(--rw-ink);
}

.rw-hero-detailed .rw-laptop-base {
    width: 100%;
    margin: -6px 0 0;
    height: clamp(140px, 12vw, 175px);
    border: 1px solid #aeb9c5;
    border-bottom: 4px solid #738297;
    border-radius: 5px 5px 18px 18px;
    background: linear-gradient(105deg, #d4dce4, #f0f3f6 27%, #b7c3cf 72%, #d8e0e7);
    box-shadow: inset 0 1px 0 #fff, inset 0 -2px 1px #f2f7fc,
        0 4px 0 #445063, 0 6px 0 #9cabbc, 0 18px 24px #08233d36;
}

/* A full-width barrel bridges the two planes at their shared pivot.
   It belongs to the lid, so it stays attached throughout the opening motion. */
.rw-hero-detailed .rw-laptop-hinge-spine {
    position: absolute;
    z-index: 8;
    left: 2%;
    right: 2%;
    bottom: -7px;
    height: 12px;
    border: 1px solid #667586;
    border-radius: 4px;
    background: linear-gradient(90deg, #bbc7d2, #657282 3%, transparent 5% 95%, #657282 97%, #bbc7d2),
        linear-gradient(#1b232d, #657382 35%, #2b3542 65%, #111a25);
    box-shadow: inset 0 1px 0 #d9e3ea80, 0 1px 1px #071b3440;
    pointer-events: none;
}

.rw-hero-detailed .rw-laptop-hinge {
    position: absolute;
    top: 0;
    left: 9%;
    right: 9%;
    height: 7%;
    border-radius: 0 0 5px 5px;
    background: linear-gradient(#070c13, #4a5564 48%, #101822);
    box-shadow: 0 1px 1px #ffffffb0;
}

.rw-hero-detailed .rw-keyboard {
    display: flex;
    flex-direction: column;
    top: 20%;
    left: 12%;
    right: 12%;
    height: 48%;
    gap: 3px;
    padding: 4px;
    border-radius: 5px;
    background: #647181;
    box-shadow: inset 0 1px 3px #1a253b90, 0 1px 1px #fff;
}

.rw-hero-detailed .rw-keyboard-row {
    display: flex;
    flex: 1;
    gap: 3px;
    min-height: 0;
}

.rw-hero-detailed .rw-keyboard span {
    display: flex;
    flex: var(--key-size, 1);
    align-items: center;
    justify-content: center;
    min-width: 0;
    border: 1px solid #101721;
    border-radius: 2px;
    color: #dae6f3;
    font: 500 clamp(4px, .48vw, 7px)/1 Arial, sans-serif;
    background: linear-gradient(#303a47, #17202b);
    box-shadow: inset 0 1px 0 #65707e, 0 1px 1px #04101d70;
    text-shadow: 0 0 3px #bfe3ff60;
}

.rw-hero-detailed .rw-speaker {
    position: absolute;
    top: 16%;
    left: 4.5%;
    width: 4.5%;
    height: 47%;
    opacity: .6;
    background: radial-gradient(circle, #35404f 0 .7px, transparent 1px) 0 0 / 3px 3px;
}

.rw-hero-detailed .rw-speaker-right { left: auto; right: 4.5%; }

.rw-hero-detailed .rw-trackpad {
    left: 35%;
    right: 35%;
    bottom: 5%;
    height: 24%;
    border: 1px solid #8291a3;
    border-radius: 4px;
    background: linear-gradient(120deg, #c9d3de, #dce3eb);
    box-shadow: inset 0 1px 2px #62758d40, 0 1px 0 #fff;
}

.rw-hero-detailed .rw-laptop-lip {
    left: 43%;
    right: 43%;
    bottom: -4px;
    height: 5px;
    border: 0;
    border-radius: 0 0 6px 6px;
    background: linear-gradient(#5b6878, #b6c3d0);
    box-shadow: 0 1px 0 #edf3fa;
}

.rw-hero-detailed .rw-laptop-shadow {
    background: radial-gradient(ellipse, #152d4845, #152d4818 45%, transparent 70%);
}

/* Articulated character: one texture, joints at hips, knees, ankles,
   shoulder, elbow, wrist and neck. All artwork stays in SVG user space. */
.rw-hero-detailed .rw-presenter-figure {
    --rw-portrait-height: clamp(330px, 49vh, 390px);
    position: absolute;
    bottom: 48px;
    left: 50%;
    width: calc(var(--rw-portrait-height) * .666667);
    height: var(--rw-portrait-height);
    margin-left: calc(var(--rw-portrait-height) * -.333333);
    filter: drop-shadow(0 9px 7px #092a4226);
    transition: filter .3s ease;
}

.rw-hero-detailed .rw-presenter-figure::before {
    content: "";
    position: absolute;
    left: 18%;
    bottom: .3%;
    width: 45%;
    height: 2.2%;
    border-radius: 50%;
    background: #122b4950;
    filter: blur(4px);
}

.rw-hero-detailed .rw-presenter-rig {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.rw-hero-detailed .rw-presenter-rig g {
    transform-box: view-box;
}
.rw-hero-detailed .rw-npc-root { transform-origin: 430px 1480px; }
.rw-hero-detailed .rw-npc-head { transform-origin: 434px 228px; }
.rw-hero-detailed .rw-npc-front-hip { transform-origin: 390px 786px; }
.rw-hero-detailed .rw-npc-front-knee { transform-origin: 341px 1100px; }
.rw-hero-detailed .rw-npc-front-ankle { transform-origin: 288px 1393px; }
.rw-hero-detailed .rw-npc-back-hip { transform-origin: 527px 785px; }
.rw-hero-detailed .rw-npc-back-knee { transform-origin: 535px 1096px; }
.rw-hero-detailed .rw-npc-back-ankle { transform-origin: 530px 1388px; }
.rw-hero-detailed .rw-npc-shoulder { transform-origin: 583px 318px; }
.rw-hero-detailed .rw-npc-elbow { transform-origin: 665px 493px; }
.rw-hero-detailed .rw-npc-wrist { transform-origin: 815px 468px; }


/* Desktop host and prerecorded narration. Tablet/mobile retain their existing layout. */
@media (min-width: 1025px) {
    .rw-hero-detailed { min-height: calc(100svh - 84px); height: calc(100svh - 84px); overflow: clip; }
    .rw-hero-beaumont .rw-presenter { display: none !important; }
    .rw-beaumont-scene { position: absolute; inset: 0; z-index: 3; pointer-events: none; opacity: 0; transition: opacity .45s ease; }
    .rw-beaumont-scene.is-crossing-in-front { z-index: 6; }
    .rw-beaumont-scene canvas { display: block; width: 100%; height: 100%; }
    .rw-hero-beaumont[data-presenter-state="ready"].is-presenting .rw-beaumont-scene,
    .rw-hero-beaumont[data-presenter-state="ready"].is-presentation-launcher .rw-beaumont-scene,
    .rw-hero-beaumont[data-presenter-state="ready"].is-returning-to-launcher .rw-beaumont-scene { opacity: 1; }
    .rw-hero-detailed .rw-presentation-board {
        z-index: 4; left: 17%; width: 66%; top: clamp(48px, 7vh, 80px);
        height: min(64vh, 600px); min-height: 425px; transform-origin: center;
    }
    .rw-hero-detailed.is-presenting .rw-laptop-rig { pointer-events: none; }
    .rw-hero-detailed.is-presenting .rw-laptop-rig { animation: rwDesktopLaptopAside .95s ease-in-out both; }
    .rw-hero-detailed .rw-board-slide { padding: clamp(17px, 1.8vw, 30px) clamp(20px, 2vw, 34px) 15px; }
    .rw-hero-detailed .rw-board-title { font-size: clamp(25px, 2.15vw, 37px); line-height: 1.04; }
    .rw-hero-detailed .rw-board-intro { font-size: clamp(11px, .95vw, 14px); max-width: none; }
    .rw-hero-detailed .rw-board-offering { min-height: clamp(60px, 7.5vh, 86px); }
    .rw-hero-detailed .rw-board-offering strong { font-size: clamp(11px, .91vw, 14px); }
    .rw-hero-detailed .rw-board-offering p { font-size: clamp(10px, .78vw, 12px); line-height: 1.35; }
    .rw-hero-detailed .rw-board-footer { font-size: clamp(9px, .72vw, 11px); }
    .rw-hero-detailed .rw-board-cta { font-size: clamp(10px, .8vw, 12px); }
    .rw-hero-detailed .rw-board-topbar { padding-inline: clamp(12px, 1.2vw, 22px); gap: 10px; }
    .rw-hero-detailed .rw-board-topbar-brand { gap: 8px; }
    .rw-hero-detailed .rw-board-topbar-brand strong { font-size: 12px; }
    .rw-hero-detailed .rw-board-topbar-brand span { font-size: 7px; }
    .rw-board-actions,.rw-narration-controls { display: flex; align-items: center; gap: 6px; }
    .rw-narration-controls button,.rw-board-navigation {
        display: inline-flex; align-items: center; justify-content: center;
        min-height: 34px; padding: 7px 11px; border: 1px solid #ffffff61; border-radius: 999px;
        background: #ffffff12; color: #f6fbff; font-family: inherit; font-size: 11px; font-weight: 750; cursor: pointer;
        transition: background .2s ease, border-color .2s ease;
    }
    .rw-narration-controls button[aria-pressed="true"] { background: #ccefff; color: #092e5c; border-color: #dcf5ff; }
    .rw-narration-controls button:hover { background: #ffffff35; }
    .rw-narration-controls button:focus-visible,.rw-board-navigation:focus-visible { outline: 3px solid #4cc9ff; outline-offset: 3px; }
    .rw-narration-controls button[hidden] { display: none; }
    .rw-narration-status { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .rw-hero-detailed .rw-board-power { padding: 7px 9px; min-height: 34px; }
    .rw-hero-detailed .rw-board-power span { font-size: 10px; }
    .rw-hero-detailed .rw-board-power svg { width: 13px; height: 13px; }
    .rw-board-navigation { width: 30px; min-height: 28px; padding: 0; color: #155cb1; background: #e1efff; border-color: #0077ff25; font-size: 23px; }
    .rw-board-navigation:disabled { opacity: .35; cursor: default; }
    .rw-hero-detailed .rw-start-presentation { left: 50%; top: auto; bottom: 19%; height: auto; min-height: 44px; width: min(300px, 65%); padding: 12px 20px; font-size: clamp(12px, 1.3vw, 17px); transform: translateX(-50%); }
    .rw-hero-detailed .rw-start-presentation:hover, .rw-hero-detailed .rw-start-presentation:focus-visible { transform: translateX(-50%); }
    .rw-hero-detailed.is-presentation-launcher .rw-laptop-rig { transform: translate3d(0,-2vh,0) scale(.8); }
    /* The laptop opening and logo choreography run at twice their former speed. */
    .rw-hero-detailed.is-playing .rw-laptop-rig { animation-duration: .75s; animation-delay: .1s; }
    .rw-hero-detailed.is-playing .rw-laptop-camera-stage { animation-duration: 1.2s; animation-delay: .1s; }
    .rw-hero-detailed.is-playing .rw-laptop-lid { animation-duration: .54s; animation-delay: .775s; }
    .rw-hero-detailed.is-playing .rw-laptop-screen::before { animation-duration: .325s; animation-delay: 1.14s; }
    .rw-hero-detailed.is-playing .rw-screen-loader { animation-duration: .19s,.19s; animation-delay: 1.325s,2.35s; }
    .rw-hero-detailed.is-playing .rw-loader-progress-fill { animation-duration: 1s; animation-delay: 1.35s; }
    .rw-hero-detailed.is-playing .rw-screen-window-bar { animation-duration: .23s; animation-delay: 1.19s; }
    .rw-hero-detailed.is-playing .rw-screen-reveal { animation-duration: .29s; animation-delay: 2.42s; }
    .rw-hero-detailed.is-playing .rw-screen-welcome { animation-duration: .31s; animation-delay: 2.54s; }
    .rw-hero-detailed.is-playing .rw-screen-logo { animation-duration: .925s; animation-delay: 2.7s; }
    .rw-hero-detailed.is-playing .rw-screen-brand-copy { animation-duration: .36s; animation-delay: 3.36s; }
    .rw-hero-detailed.is-playing .rw-screen-brand-rule { animation-duration: .325s; animation-delay: 3.56s; }
    .rw-hero-detailed.is-playing .rw-screen-shine { animation-duration: .475s; animation-delay: 3.56s; }
    .rw-hero-detailed.is-playing .rw-screen-burst { animation-duration: .36s; animation-delay: 2.71s; }
    .rw-hero-detailed.is-playing .rw-os-dock { animation-duration: .29s; animation-delay: 3.66s; }
    .rw-hero-detailed.is-playing .rw-os-app { animation-duration: .25s; animation-delay: calc(3.73s + (var(--rw-app-index) * .0325s)); }
}
@media (min-width: 1025px) and (max-width: 1190px) {
    .rw-hero-detailed .rw-board-topbar-brand > img { width: 28px; }
    .rw-hero-detailed .rw-board-topbar-brand div { display: none; }
    .rw-hero-detailed .rw-board-title-row { gap: 10px; }
    .rw-hero-detailed .rw-board-title { font-size: 24px; }
    .rw-hero-detailed .rw-board-cta { max-width: 39%; padding-inline: 10px; }
}
@media (min-width: 1025px) and (max-height: 700px) {
    .rw-hero-detailed .rw-presentation-board { top: 44px; min-height: 375px; height: calc(100svh - 190px); }
    .rw-hero-detailed .rw-board-slide { padding: 13px 20px 10px; }
    .rw-hero-detailed .rw-board-offering { min-height: 52px; }
    .rw-hero-detailed .rw-board-title { font-size: 25px; }
    .rw-hero-detailed .rw-board-intro { font-size: 11px; }
}
@media (max-width: 1024px) {
    .rw-narration-controls { display: none; }
    .rw-board-navigation { display: none; }
}
@keyframes rwDesktopLaptopAside {
    from { opacity: 1; transform: none; }
    to { opacity: 0; transform: translate3d(-40vw,5vh,-300px) scale(.4); }
}