/* Continuous, low-frequency studio lighting; copy and controls stay still. */
.presentation-page { --brand-hover-art: url('../img/ctrlbox-cube-brand.png'); }
.presentation-page .deck-slide { isolation: isolate; }
.presentation-page .deck-slide > :not(.slide-aura) { position: relative; z-index: 1; }
.slide-aura {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    border-radius: inherit;
    overflow: hidden;
}
.slide-aura::before {
    content: '';
    position: absolute;
    width: min(780px, 80%);
    aspect-ratio: 1;
    right: -11%;
    bottom: -24%;
    background: var(--brand-hover-art) center / contain no-repeat;
    opacity: .09;
    transition: opacity 500ms ease;
}
.deck-slide:is(:hover, :focus-within) > .slide-aura::before { opacity: .14; }
.challenges-slide > .slide-aura::before,
.technology-slide > .slide-aura::before,
.roadmap-slide > .slide-aura::before { opacity: .15; }
.challenges-slide:is(:hover, :focus-within) > .slide-aura::before,
.technology-slide:is(:hover, :focus-within) > .slide-aura::before,
.roadmap-slide:is(:hover, :focus-within) > .slide-aura::before { opacity: .22; }
/* The cover already displays the authentic cube; avoid a second backdrop cube. */
.cover-slide > .slide-aura::before { display: none; }
.project-slide > .slide-aura::before { right: auto; left: -14%; bottom: -21%; width: min(720px, 65%); }
.slide-aura::after {
    content: '';
    position: absolute;
    width: 38%;
    height: 170%;
    left: -50%;
    top: -35%;
    opacity: 0;
    background: linear-gradient(100deg, transparent 12%, #d5f78918 36%, #f6ffd730 47%, #ffffff40 51%, #c8f36e20 56%, transparent 84%);
    transform: translate3d(0, 0, 0) skewX(-20deg);
}
.cover-slide > .slide-aura::after,
.challenges-slide > .slide-aura::after,
.technology-slide > .slide-aura::after,
.roadmap-slide > .slide-aura::after {
    background: linear-gradient(100deg, transparent 12%, #c8f36e12 36%, #eaffc926 50%, #c8f36e18 60%, transparent 84%);
}
.depth-enabled .deck-slide.is-active.is-ambient-visible > .slide-aura::after {
    animation: deckLightSweep 5.8s linear infinite;
    animation-delay: var(--ambient-delay, 0s);
}

/* A quiet edge reflection stays clear of copy and above opaque showcase panels,
   giving every chapter a continuous light accent without a bright flash. */
.presentation-page .deck-slide > .slide-flash {
    position: absolute;
    inset: 0;
    z-index: 4;
    overflow: hidden;
    border-radius: inherit;
    pointer-events: none;
    user-select: none;
}
.slide-flash::before {
    content: '';
    position: absolute;
    inset: 1px;
    border: 1px solid #b7f56a;
    border-radius: inherit;
    box-shadow: inset 0 0 8px #b7f56a24;
    opacity: 0;
}
.slide-flash::after,
.slide-flash-tail::after {
    content: '';
    position: absolute;
    left: -55%;
    top: 1px;
    width: 55%;
    height: 2px;
    border-radius: 5px;
    background: linear-gradient(90deg, transparent, #92e34b 24%, #efffc4 42%, #fff 50%, #d6ff8c 59%, #8fdf54 77%, transparent);
    box-shadow: 0 0 8px 2px #c8f36e30;
    transform: translate3d(0, 0, 0);
    opacity: 0;
}
.slide-flash-tail { position: absolute; inset: 0; }
.slide-flash-tail::after { top: auto; bottom: 1px; }
.depth-enabled .deck-slide.is-active.is-ambient-visible > .slide-flash::before {
    animation: deckFlashFrame 6s ease-in-out -.8s infinite;
}
.depth-enabled .deck-slide.is-active.is-ambient-visible > .slide-flash::after {
    animation: deckFlashTravel 6s linear -1.35s infinite;
}
.depth-enabled .deck-slide.is-active.is-ambient-visible > .slide-flash > .slide-flash-tail::after {
    animation: deckFlashTravel 6s linear -1.35s infinite reverse;
}
.depth-enabled .deck-slide.is-active.is-ambient-visible > .slide-aura::before {
    animation: deckAtmosphereDrift 12s ease-in-out infinite alternate;
}

/* The authentic brand cube stays fully visible, with a gentle hover lift. */
.cover-scene .cube-frame > img {
    transition: transform 450ms var(--depth-ease);
}
@media (hover: hover) and (pointer: fine) {
    .depth-enabled .cover-art:hover .cube-frame > img { transform: translateZ(60px) scale(1.035); }
}
.depth-enabled .cover-slide.is-active .cover-art.is-ambient-visible .cube-frame {
    animation: deckCubeFloat 7s ease-in-out infinite;
}
/* A light pass is clipped to the real mark, keeping the cube recognisable. */
.cube-flare {
    position: absolute;
    inset: 3%;
    z-index: 2;
    pointer-events: none;
    overflow: hidden;
    -webkit-mask: var(--brand-hover-art) center / contain no-repeat;
    mask: var(--brand-hover-art) center / contain no-repeat;
    transform: translateZ(49px);
}
.cube-flare::after {
    content: '';
    position: absolute;
    top: -40%;
    left: -65%;
    width: 48%;
    height: 180%;
    opacity: 0;
    background: linear-gradient(100deg, transparent, #e5ffb75c 35%, #ffffffb3 50%, #e5ffb75c 65%, transparent);
    transform: translate3d(0, 0, 0) skewX(-23deg);
}
.depth-enabled .cover-slide.is-active .cover-art.is-ambient-visible .cube-flare::after {
    animation: deckCardGlint 5.8s ease-in-out -1s infinite;
}
.depth-enabled .cover-slide.is-active .cover-art.is-ambient-visible .orbit-front {
    animation: deckOrbitTurn 28s linear infinite;
}
.depth-enabled .cover-slide.is-active .cover-art.is-ambient-visible .orbit-back {
    animation: deckOrbitBack 22s linear infinite reverse;
}
.depth-enabled .cover-slide.is-active .cover-art.is-ambient-visible .capability-brand {
    animation: deckBrandFloat 8s ease-in-out infinite;
}
.depth-enabled .cover-slide.is-active .cover-art.is-ambient-visible .capability-technology {
    animation: deckTechnologyFloat 8s ease-in-out -2.5s infinite;
}
.depth-enabled .cover-slide.is-active .cover-art.is-ambient-visible .capability-growth {
    animation: deckGrowthFloat 8s ease-in-out -5s infinite;
}

/* A clipped glint adds life to surfaces without flashing the whole screen. */
.ambient-card { position: relative; }
.card-gloss {
    display: block;
    position: absolute;
    inset: 0;
    border-radius: inherit;
    overflow: hidden;
    z-index: 2;
    pointer-events: none;
    transform: translateZ(2px);
}
.card-gloss::after {
    content: '';
    position: absolute;
    width: 45%;
    height: 190%;
    left: -45%;
    top: -45%;
    opacity: 0;
    background: linear-gradient(100deg, transparent 5%, #c8f36e24 32%, #ffffff70 50%, #c8f36e2e 65%, transparent 95%);
    transform: translate3d(0, 0, 0) skewX(-23deg);
}
.depth-enabled .deck-slide.is-active .ambient-card.is-ambient-visible > .card-gloss::after {
    animation: deckCardGlint 5.8s linear infinite;
    animation-delay: var(--card-gloss-delay, 0s);
}
/* Dark reading surfaces keep a restrained reflection and readable pale text. */
.tech-layer:nth-child(n+3) > .card-gloss::after,
.partnership-card:nth-child(2) > .card-gloss::after,
.partnership-card:nth-child(3) > .card-gloss::after,
.contact-circle > .card-gloss::after {
    background: linear-gradient(100deg, transparent 5%, #c8f36e14 32%, #e8ffcf24 50%, #c8f36e14 65%, transparent 95%);
}

/* Website previews get a fine lit edge and a slow surface reflection.
   The narrow edge travels independently of the image; nothing covers the tools. */
.project-gallery .screen-link {
    border: 1px solid #ffffff70;
    box-shadow: 0 1px 0 #ffffff4d, 0 5px 0 -1px #ffffff24, 0 20px 34px -18px #0009;
}
.project-gallery .screen-link > .card-gloss {
    box-shadow: inset 0 1px #ffffff8c, inset 0 -1px #ffffff29;
}
.project-gallery .screen-link > .card-gloss::before {
    content: '';
    position: absolute;
    top: 0;
    left: -55%;
    width: 52%;
    height: 2px;
    opacity: 0;
    background: linear-gradient(90deg, transparent, var(--project-accent) 32%, #fff 52%, var(--project-accent) 70%, transparent);
    transform: translate3d(0, 0, 0);
    box-shadow: 0 0 7px 1px #c8f36e33;
}
.project-gallery .screen-link > .card-gloss::after {
    width: 45%;
    background: linear-gradient(100deg, transparent 8%, #c8f36e26 30%, #ffffff48 44%, #ffffffa3 50%, #c8f36e35 58%, transparent 86%);
}
.depth-enabled .deck-slide.is-active .screen-link.is-ambient-visible > .card-gloss::before {
    animation: deckFrameGlint 5.8s linear infinite;
    animation-delay: var(--card-gloss-delay, 0s);
}

/* Surface reflections pass behind live text, including the dark stack cards. */
.solution-card > h3, .solution-card > p,
.tech-layer > h3, .tech-layer > p,
.partnership-card > h3, .partnership-card > p, .partnership-card > div,
.roadmap-step > h3, .roadmap-step > p, .roadmap-step > div {
    position: relative;
    z-index: 3;
}
.screen-link:is(:hover, :focus-visible) { outline: 2px solid var(--project-accent); outline-offset: 4px; }
.screen-link:focus-visible > img { transform: scale(1.012); }
.screen-link .screen-enlarge { z-index: 3; }
.project-index-card:is(:hover, :focus-visible) .project-index-art > .card-gloss,
.screen-link:is(:hover, :focus-visible) > .card-gloss { box-shadow: inset 0 0 0 1px #ffffffa6; }

.ambient-detail { position: relative; }
.detail-light {
    position: absolute;
    display: block;
    top: -1px;
    inset-inline: 0;
    height: 2px;
    overflow: hidden;
    pointer-events: none;
}
.detail-light::after {
    content: '';
    display: block;
    width: 44%;
    height: 100%;
    opacity: 0;
    background: linear-gradient(90deg, transparent, #6b8c40 35%, #466a31 52%, #92b66b 69%, transparent);
    transform: translate3d(-110%, 0, 0);
}
.depth-enabled .deck-slide.is-active .ambient-detail.is-ambient-visible .detail-light::after {
    animation: deckDetailGlint 7.2s ease-in-out infinite;
    animation-delay: var(--detail-light-delay, 0s);
}
.project-index-art .depth-light {
    background-image: linear-gradient(130deg, #ffffff15, transparent 60%), var(--brand-hover-art);
    background-size: cover, contain;
    background-position: center;
    background-repeat: no-repeat;
}
.project-index-card:is(:hover, :focus-visible) .depth-light { opacity: .36; }
.solution-card, .partnership-card, .tech-layer, .roadmap-step { isolation: isolate; }
.solution-card::after, .partnership-card::after, .tech-layer::after, .roadmap-step::after {
    content: '';
    position: absolute;
    z-index: -1;
    width: 72%;
    aspect-ratio: 1;
    right: 0;
    bottom: 0;
    border-radius: inherit;
    background: var(--brand-hover-art) center / contain no-repeat;
    -webkit-mask-image: radial-gradient(ellipse, #000 12%, transparent 68%);
    mask-image: radial-gradient(ellipse, #000 12%, transparent 68%);
    opacity: 0;
    transition: opacity 450ms ease;
    pointer-events: none;
}
.solution-card:hover::after, .partnership-card:hover::after, .tech-layer:hover::after, .roadmap-step:hover::after { opacity: .1; }
.tech-layer:nth-child(n+3):hover::after, .partnership-card:nth-child(2):hover::after, .partnership-card:nth-child(3):hover::after { opacity: .22; mix-blend-mode: screen; }

@keyframes deckLightSweep {
    0% { opacity: 0; transform: translate3d(0, 0, 0) skewX(-20deg); }
    14% { opacity: .45; }
    72% { opacity: .45; }
    100% { opacity: 0; transform: translate3d(420%, 0, 0) skewX(-20deg); }
}
@keyframes deckAtmosphereDrift {
    from { transform: translate3d(0, 5px, 0) scale(1); }
    to { transform: translate3d(-10px, -6px, 0) scale(1.025); }
}
@keyframes deckCardGlint {
    0% { opacity: 0; transform: translate3d(0, 0, 0) skewX(-23deg); }
    14% { opacity: .4; }
    80% { opacity: .3; }
    100% { opacity: 0; transform: translate3d(340%, 0, 0) skewX(-23deg); }
}
@keyframes deckFrameGlint {
    0% { opacity: 0; transform: translate3d(0, 0, 0); }
    12%, 86% { opacity: .45; }
    100% { opacity: 0; transform: translate3d(310%, 0, 0); }
}
@keyframes deckFlashFrame {
    0%, 100% { opacity: .12; }
    42%, 60% { opacity: .42; }
}
@keyframes deckFlashTravel {
    0% { opacity: .08; transform: translate3d(0, 0, 0); }
    10%, 90% { opacity: .45; }
    100% { opacity: .08; transform: translate3d(300%, 0, 0); }
}
@keyframes deckDetailGlint {
    0% { opacity: 0; transform: translate3d(-110%, 0, 0); }
    16%, 84% { opacity: .45; }
    100% { opacity: 0; transform: translate3d(340%, 0, 0); }
}
@keyframes deckCubeFloat {
    0%, 100% { transform: translate3d(0, 4px, 0) rotateZ(-1deg); }
    50% { transform: translate3d(0, -8px, 6px) rotateZ(1deg); }
}
@keyframes deckOrbitTurn {
    from { transform: translateZ(14px) rotateX(64deg) rotateY(18deg) rotateZ(-27deg); }
    to { transform: translateZ(14px) rotateX(64deg) rotateY(18deg) rotateZ(333deg); }
}
@keyframes deckOrbitBack {
    from { transform: translateZ(-34px) rotateX(29deg) rotateY(-36deg) rotateZ(0deg); }
    to { transform: translateZ(-34px) rotateX(29deg) rotateY(-36deg) rotateZ(360deg); }
}
@keyframes deckBrandFloat {
    0%, 100% { transform: translate3d(0, 0, 70px) rotateZ(-5deg); }
    50% { transform: translate3d(0, -5px, 76px) rotateZ(-3deg); }
}
@keyframes deckTechnologyFloat {
    0%, 100% { transform: translate3d(0, 0, 80px) rotateZ(4deg); }
    50% { transform: translate3d(0, 5px, 86px) rotateZ(2deg); }
}
@keyframes deckGrowthFloat {
    0%, 100% { transform: translate3d(0, 0, 100px) rotateZ(-3deg); }
    50% { transform: translate3d(0, -5px, 105px) rotateZ(-1deg); }
}

.deck-ambient-suspended .presentation-page *,
.deck-ambient-suspended .presentation-page *::before,
.deck-ambient-suspended .presentation-page *::after { animation-play-state: paused !important; }
.depth-disabled .presentation-page *,
.depth-disabled .presentation-page *::before,
.depth-disabled .presentation-page *::after { animation: none !important; transition: none !important; }

@media (max-width: 800px) {
    .slide-aura::before { width: 115%; bottom: -5%; right: -44%; opacity: .08; }
    .project-slide > .slide-aura::before { width: 115%; left: auto; right: -48%; top: 5%; bottom: auto; }
    .slide-aura::after { width: 65%; left: -75%; }
    .cube-flare { inset: 5%; }
}
@media (prefers-reduced-motion: reduce) {
    .presentation-page *, .presentation-page *::before, .presentation-page *::after { animation: none !important; transition: none !important; }
}
@media print {
    .slide-aura, .slide-flash, .card-gloss, .cube-flare, .detail-light,
    .solution-card::after, .partnership-card::after, .tech-layer::after, .roadmap-step::after { display: none !important; }
    .presentation-page *, .presentation-page *::before, .presentation-page *::after { animation: none !important; transition: none !important; }
}
