/* =========================================================
KAG V56 — CREATIVE TECHNOLOGY / PERFORMANCE ARCHITECTURE
Patch target: homepage only. This stylesheet intentionally
uses higher specificity than the legacy homepage styles so it
can be layered on without deleting the approved design system.
========================================================= */

/* ------------------------------
01. HERO CAPABILITY MATRIX
------------------------------ */
#kag-home [data-kag-capability-matrix],
#kag-home [data-kag-capability-matrix] *,
#kag-home .kag-info-card,
#kag-home .kag-info-card *{
  box-sizing:border-box;
}

#kag-home [data-kag-capability-matrix]{
  position:absolute;
  z-index:35;
  top:40%;
  right:clamp(22px,3.8vw,76px);
  width:clamp(300px,25vw,382px);
  max-width:calc(100vw - 40px);
  padding:clamp(26px,2.4vw,38px) clamp(22px,2.2vw,34px);
  overflow:visible;
  isolation:isolate;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

/* No hard-edged rectangle: the mask feathers the heavy blur into the paint. */
#kag-home [data-kag-capability-matrix]::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:-2!important;
  inset:-92px -84px -92px -136px!important;
  pointer-events:none!important;
  border:0!important;
  border-radius:0!important;
  opacity:1!important;
  background:
    linear-gradient(90deg,
      rgba(0,0,0,0) 0%,
      rgba(3,4,5,.18) 16%,
      rgba(3,4,5,.58) 42%,
      rgba(2,3,4,.86) 66%,
      rgba(2,3,4,.92) 100%)!important;
  -webkit-backdrop-filter:blur(12px) brightness(40%) saturate(108%)!important;
  backdrop-filter:blur(12px) brightness(40%) saturate(108%)!important;
  -webkit-mask-image:
    radial-gradient(ellipse 88% 78% at 72% 50%,#000 0 48%,rgba(0,0,0,.88) 60%,rgba(0,0,0,.36) 76%,transparent 96%);
  mask-image:
    radial-gradient(ellipse 88% 78% at 72% 50%,#000 0 48%,rgba(0,0,0,.88) 60%,rgba(0,0,0,.36) 76%,transparent 96%);
  filter:none!important;
}

#kag-home [data-kag-capability-matrix]::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:-1!important;
  inset:-50px -42px -50px -90px!important;
  pointer-events:none!important;
  background:
    radial-gradient(ellipse at 78% 50%,rgba(0,0,0,.73) 0%,rgba(0,0,0,.52) 36%,rgba(0,0,0,.15) 67%,transparent 86%)!important;
  filter:blur(18px)!important;
  opacity:.96!important;
}

#kag-home [data-kag-capability-matrix] .kag-capabilities{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-auto-rows:minmax(54px,auto);
  align-items:stretch;
  gap:0;
  overflow:visible;
}

#kag-home [data-kag-capability-matrix] .kag-capability{
  --cap-glow:rgba(255,255,255,.12);
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:58px;
  padding:6px 2px!important;
  display:flex!important;
  flex:1 1 auto!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px;
  overflow:visible!important;
  white-space:normal!important;
  font-size:clamp(30px,2.35vw,36px)!important;
  line-height:.96!important;
  text-wrap:balance;
  text-shadow:
    0 1px 1px rgba(0,0,0,1),
    0 3px 7px rgba(0,0,0,.98),
    0 8px 24px rgba(0,0,0,.96),
    0 0 28px rgba(0,0,0,.78),
    0 0 18px color-mix(in srgb,var(--cap) 24%,transparent)!important;
  -webkit-font-smoothing:antialiased!important;
  -moz-osx-font-smoothing:grayscale!important;
  transform:translate3d(0,0,0)!important;
  transition:opacity .24s ease,transform .32s cubic-bezier(.2,.8,.2,1),text-shadow .28s ease!important;
}

#kag-home [data-kag-capability-matrix] .kag-capability:hover,
#kag-home [data-kag-capability-matrix] .kag-capability:focus-visible{
  opacity:1!important;
  font-size:clamp(30px,2.35vw,36px)!important;
  transform:translate3d(-6px,0,0)!important;
  text-shadow:
    0 1px 1px rgba(0,0,0,1),
    0 4px 9px rgba(0,0,0,1),
    0 10px 30px rgba(0,0,0,.98),
    0 0 22px color-mix(in srgb,var(--cap) 34%,transparent)!important;
}

#kag-home [data-kag-capability-matrix] .kag-capability > span:first-child{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
}
#kag-home [data-kag-capability-matrix] .kag-cap-arrow{
  flex:0 0 auto;
}

/* Defensive modal containment: specifically prevents Technology from exceeding its grid cell. */
#kag-home .kag-info-card{
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)!important;
  width:min(980px,calc(100vw - 32px))!important;
  max-width:980px!important;
  overflow:hidden!important;
}
#kag-home .kag-card-media,
#kag-home .kag-card-panel{
  min-width:0!important;
  max-width:100%!important;
}
#kag-home .kag-card-panel{
  overflow:visible!important;
}
#kag-home .kag-card-title{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  hyphens:none!important;
  font-size:clamp(44px,5vw,82px)!important;
  line-height:.84!important;
  letter-spacing:-.035em;
}
#kag-home .kag-info-card[data-kag-capability="technology"] .kag-card-title{
  font-size:clamp(40px,4.35vw,72px)!important;
  letter-spacing:-.045em;
}

/* ------------------------------
02. KODAK FULL-CANVAS FLUID SURFACE
------------------------------ */
#kag-home #reel .kag-pose-media{
  overflow:visible!important;
  isolation:isolate!important;
  contain:layout style!important;
}
#kag-home #reel .kag-pose-media > img{
  pointer-events:none!important;
  user-select:none!important;
  -webkit-user-drag:none!important;
  opacity:1;
  will-change:opacity;
}
#kag-home #reel .kag-fluid-canvas-v56{
  position:absolute!important;
  z-index:4!important;
  display:block!important;
  max-width:none!important;
  pointer-events:none!important;
  touch-action:pan-y pinch-zoom!important;
  opacity:0;
  cursor:crosshair;
  transform:translate3d(0,0,0);
  backface-visibility:hidden;
  will-change:transform,opacity;
  transition:opacity .18s linear;
  contain:strict;
}
#kag-home #reel .kag-pose-media.kag-v56-fluid-ready .kag-fluid-canvas-v56{
  opacity:1;
  pointer-events:auto!important;
}
#kag-home #reel .kag-pose-media.kag-v56-fluid-ready > img{
  opacity:0!important;
}
#kag-home .kag-fluid-hint-v56{
  position:absolute;
  z-index:8;
  pointer-events:none;
  padding:7px 9px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:999px;
  background:rgba(5,6,8,.54);
  -webkit-backdrop-filter:blur(10px) brightness(72%);
  backdrop-filter:blur(10px) brightness(72%);
  color:rgba(246,246,242,.76);
  font-size:8px;
  font-weight:900;
  line-height:1;
  letter-spacing:.14em;
  text-transform:uppercase;
  white-space:nowrap;
  opacity:1;
  transform:translate3d(-100%,-100%,0);
  transition:opacity .35s ease,transform .35s ease;
}
#kag-home .kag-fluid-hint-v56.is-hidden{
  opacity:0;
  transform:translate3d(-100%,calc(-100% + 5px),0);
}

/* ------------------------------
03. MAN IN RED PREWARM / COMPOSITOR PIPELINE
------------------------------ */
#kag-home #kag-tunnel .kag-cinema-sticky{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  transform-origin:center center;
  will-change:transform,opacity;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  contain:style!important;
}
#kag-home #kag-tunnel .kag-cinema-world,
#kag-home #kag-tunnel .kag-cinema-world img,
#kag-home #kag-tunnel .kag-cinema-redman,
#kag-home #kag-tunnel .kag-cinema-redman img,
#kag-home #kag-tunnel .kag-cinema-light{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transform-style:preserve-3d;
  will-change:transform,opacity,filter;
}
#kag-home #kag-tunnel.kag-v56-prewarmed .kag-cinema-sticky{
  visibility:visible!important;
}

@media(max-width:900px){
  #kag-home [data-kag-capability-matrix]{
    left:12px!important;
    right:12px!important;
    top:auto!important;
    bottom:max(14px,env(safe-area-inset-bottom,0px))!important;
    width:auto!important;
    max-width:none!important;
    padding:8px 8px!important;
  }
  #kag-home [data-kag-capability-matrix]::before{
    inset:-44px -36px -42px -36px!important;
    background:linear-gradient(90deg,rgba(2,3,4,.20),rgba(2,3,4,.82) 30%,rgba(2,3,4,.88) 70%,rgba(2,3,4,.28))!important;
    -webkit-backdrop-filter:blur(12px) brightness(42%) saturate(108%)!important;
    backdrop-filter:blur(12px) brightness(42%) saturate(108%)!important;
    -webkit-mask-image:radial-gradient(ellipse at 50% 50%,#000 0 56%,rgba(0,0,0,.55) 76%,transparent 100%);
    mask-image:radial-gradient(ellipse at 50% 50%,#000 0 56%,rgba(0,0,0,.55) 76%,transparent 100%);
  }
  #kag-home [data-kag-capability-matrix]::after{display:none!important}
  #kag-home [data-kag-capability-matrix] .kag-capabilities{
    display:flex!important;
    align-items:stretch!important;
    gap:6px!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
  }
  #kag-home [data-kag-capability-matrix] .kag-capabilities::-webkit-scrollbar{display:none}
  #kag-home [data-kag-capability-matrix] .kag-capability{
    flex:1 0 clamp(88px,21vw,118px)!important;
    width:auto!important;
    min-height:42px!important;
    padding:0 8px!important;
    border-radius:11px!important;
    font-family:"Neue Haas Display",sans-serif!important;
    font-size:11px!important;
    font-weight:600!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:visible!important;
    scroll-snap-align:start;
    background:rgba(255,255,255,.028)!important;
    border:1px solid rgba(255,255,255,.07)!important;
  }
  #kag-home [data-kag-capability-matrix] .kag-capability:hover,
  #kag-home [data-kag-capability-matrix] .kag-capability:focus-visible{
    font-size:11px!important;
    transform:translate3d(0,-1px,0)!important;
  }
  #kag-home [data-kag-capability-matrix] .kag-capability[data-title="Technology"]{
    flex-basis:clamp(112px,28vw,148px)!important;
    min-width:112px!important;
  }
  #kag-home .kag-info-card{
    grid-template-columns:minmax(0,1fr)!important;
    width:min(94vw,620px)!important;
    max-height:calc(100svh - 36px)!important;
    overflow:auto!important;
  }
  #kag-home .kag-card-media{min-height:clamp(210px,34svh,330px)!important}
  #kag-home .kag-card-panel{min-height:auto!important;padding:34px 24px 30px!important}
  #kag-home .kag-card-title,
  #kag-home .kag-info-card[data-kag-capability="technology"] .kag-card-title{
    font-size:clamp(42px,12.5vw,66px)!important;
    overflow-wrap:normal!important;
  }
}

@media(prefers-reduced-motion:reduce){
  #kag-home #reel .kag-fluid-canvas-v56{display:none!important}
  #kag-home #reel .kag-pose-media > img{opacity:1!important}
}


/* =========================================================
KAG V57 — MOBILE TOUCH SURFACE + HERO COPY SEPARATION
========================================================= */

/* Rendering canvas stays visual-only. Interaction is handled by a dedicated
   transparent surface that exactly tracks the Kodak image bounds. */
#kag-home #reel .kag-fluid-canvas-v56{
  pointer-events:none!important;
  touch-action:auto!important;
}

#kag-home #reel .kag-fluid-touch-v57{
  position:absolute!important;
  z-index:7!important;
  display:block!important;
  pointer-events:none;
  touch-action:none!important;
  -ms-touch-action:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  -webkit-touch-callout:none!important;
  -webkit-tap-highlight-color:transparent!important;
  background:transparent!important;
  cursor:crosshair;
  transform:translate3d(0,0,0);
  will-change:transform;
}

#kag-home #reel .kag-pose-media.kag-v57-fluid-ready .kag-fluid-touch-v57{
  pointer-events:auto!important;
}

/* The original V56 ready state remains supported for the visual handoff. */
#kag-home #reel .kag-pose-media.kag-v57-fluid-ready .kag-fluid-canvas-v56{
  opacity:1!important;
}
#kag-home #reel .kag-pose-media.kag-v57-fluid-ready > img{
  opacity:0!important;
}

/* Mobile hero copy: separate the message from the question-mark/man artwork
   without introducing a visible card or hard rectangular edge. */
@media(max-width:900px){
  #kag-home #kag-hero .kag-copy{
    isolation:isolate!important;
  }

  #kag-home #kag-hero .kag-description{
    position:relative!important;
    z-index:12!important;
    width:min(88vw,350px)!important;
    max-width:350px!important;
    margin-top:18px!important;
    padding:7px 2px 9px 0!important;
    color:rgba(248,248,244,.97)!important;
    font-size:clamp(17px,4.6vw,18.5px)!important;
    line-height:1.46!important;
    font-weight:500!important;
    letter-spacing:-.01em!important;
    text-shadow:
      0 1px 1px rgba(0,0,0,.98),
      0 3px 10px rgba(0,0,0,.92),
      0 10px 28px rgba(0,0,0,.86)!important;
    -webkit-font-smoothing:antialiased!important;
    -moz-osx-font-smoothing:grayscale!important;
  }

  #kag-home #kag-hero .kag-description::before{
    content:""!important;
    position:absolute!important;
    z-index:-1!important;
    pointer-events:none!important;
    inset:-20px -52px -22px -24px!important;
    border:0!important;
    border-radius:0!important;
    opacity:1!important;
    background:
      radial-gradient(
        ellipse at 28% 50%,
        rgba(0,0,0,.96) 0%,
        rgba(0,0,0,.88) 30%,
        rgba(0,0,0,.67) 50%,
        rgba(0,0,0,.32) 68%,
        rgba(0,0,0,.10) 80%,
        transparent 94%
      )!important;
    -webkit-backdrop-filter:blur(7px) brightness(58%) saturate(92%)!important;
    backdrop-filter:blur(7px) brightness(58%) saturate(92%)!important;
    -webkit-mask-image:
      radial-gradient(ellipse 96% 82% at 30% 50%,#000 0 52%,rgba(0,0,0,.82) 67%,rgba(0,0,0,.34) 82%,transparent 100%);
    mask-image:
      radial-gradient(ellipse 96% 82% at 30% 50%,#000 0 52%,rgba(0,0,0,.82) 67%,rgba(0,0,0,.34) 82%,transparent 100%);
    filter:blur(.15px)!important;
  }

  /* Localized extra matte behind the lower-left copy zone only. Keeps the
     man/paint vivid everywhere else instead of darkening the hero globally. */
  #kag-home #kag-hero::after{
    content:""!important;
    position:absolute!important;
    z-index:3!important;
    left:-12vw!important;
    bottom:8svh!important;
    width:min(118vw,570px)!important;
    height:36svh!important;
    pointer-events:none!important;
    background:
      radial-gradient(
        ellipse at 34% 58%,
        rgba(0,0,0,.58) 0%,
        rgba(0,0,0,.37) 38%,
        rgba(0,0,0,.14) 62%,
        transparent 82%
      )!important;
    filter:blur(14px)!important;
    opacity:.78!important;
  }

  #kag-home #kag-hero .kag-copy,
  #kag-home #kag-hero .kag-capability-zone,
  #kag-home #kag-hero .kag-header{
    position:relative;
    z-index:8!important;
  }

  #kag-home #reel .kag-fluid-touch-v57{
    cursor:default;
    touch-action:none!important;
  }

  #kag-home .kag-fluid-hint-v56{
    font-size:8px!important;
  }
}

@media(max-width:430px){
  #kag-home #kag-hero .kag-description{
    width:min(86vw,332px)!important;
    max-width:332px!important;
    font-size:17.5px!important;
    line-height:1.44!important;
  }
  #kag-home #kag-hero .kag-description::before{
    inset:-18px -42px -20px -20px!important;
  }
}
/* =========================================================
KAG V58 — MUSEUM MIRROR / HERO GLASS / MOBILE-DEFENSIVE LAYER
These rules intentionally load after V57 so the approved site layout stays intact.
========================================================= */

/* ---------------------------------------------------------
01. HERO CAPABILITY MATRIX — NO HARD RECTANGLE
--------------------------------------------------------- */
#kag-home [data-kag-capability-matrix]{
  box-sizing:border-box!important;
  isolation:isolate!important;
  overflow:visible!important;
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
}

#kag-home [data-kag-capability-matrix]::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:-2!important;
  pointer-events:none!important;
  inset:-112px -96px -110px -176px!important;
  border:0!important;
  border-radius:0!important;
  opacity:1!important;

  /* Requested dense glass layer, feathered so it cannot read as a rectangle. */
  background:
    linear-gradient(
      135deg,
      rgba(10,10,10,.10) 0%,
      rgba(4,4,5,.22) 28%,
      rgba(2,2,3,.64) 60%,
      rgba(0,0,0,.90) 80%,
      rgba(0,0,0,.94) 100%
    )!important;
  -webkit-backdrop-filter:blur(16px) brightness(35%) saturate(108%)!important;
  backdrop-filter:blur(16px) brightness(35%) saturate(108%)!important;

  -webkit-mask-image:
    radial-gradient(
      ellipse 92% 82% at 76% 50%,
      #000 0%,
      rgba(0,0,0,.98) 48%,
      rgba(0,0,0,.76) 64%,
      rgba(0,0,0,.30) 80%,
      transparent 98%
    )!important;
  mask-image:
    radial-gradient(
      ellipse 92% 82% at 76% 50%,
      #000 0%,
      rgba(0,0,0,.98) 48%,
      rgba(0,0,0,.76) 64%,
      rgba(0,0,0,.30) 80%,
      transparent 98%
    )!important;
  filter:none!important;
}

#kag-home [data-kag-capability-matrix]::after{
  content:""!important;
  position:absolute!important;
  z-index:-1!important;
  pointer-events:none!important;
  inset:-64px -58px -64px -112px!important;
  border:0!important;
  border-radius:0!important;
  opacity:.92!important;
  background:
    radial-gradient(
      ellipse at 80% 48%,
      rgba(0,0,0,.72) 0%,
      rgba(0,0,0,.48) 38%,
      rgba(0,0,0,.18) 64%,
      transparent 88%
    )!important;
  filter:blur(24px)!important;
}

#kag-home [data-kag-capability-matrix] .kag-capabilities{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:visible!important;
}

#kag-home [data-kag-capability-matrix] .kag-capability{
  box-sizing:border-box!important;
  flex:1 1 auto!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:visible!important;
  isolation:isolate!important;
  text-shadow:
    0 1px 1px rgba(0,0,0,1),
    0 3px 9px rgba(0,0,0,1),
    0 9px 28px rgba(0,0,0,.96),
    0 0 42px rgba(0,0,0,.88),
    0 0 18px color-mix(in srgb,var(--cap) 24%,transparent)!important;
}

#kag-home [data-kag-capability-matrix] .kag-capability[data-title="Technology"]{
  flex:1 1 auto!important;
  min-width:min-content!important;
  max-width:100%!important;
}

#kag-home .kag-info-card[data-kag-capability="technology"] .kag-card-panel{
  min-width:0!important;
  overflow:visible!important;
}
#kag-home .kag-info-card[data-kag-capability="technology"] .kag-card-title{
  width:100%!important;
  max-width:100%!important;
  overflow-wrap:normal!important;
  word-break:keep-all!important;
  font-size:clamp(38px,4.05vw,68px)!important;
}

/* ---------------------------------------------------------
02. KODAK — THREE.JS FULL-CANVAS SURFACE
--------------------------------------------------------- */
#kag-home #reel .kag-pose-media[data-kag-fluid-surface]{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  contain:layout style paint!important;
}

#kag-home #reel .kag-pose-media[data-kag-fluid-surface] > img{
  position:relative!important;
  z-index:1!important;
  opacity:1!important;
  pointer-events:none!important;
  user-select:none!important;
  -webkit-user-drag:none!important;
  transition:opacity .22s linear!important;
}

#kag-home #reel .kag-kodak-canvas-v58{
  position:absolute!important;
  z-index:4!important;
  inset:0 auto auto 0;
  display:block!important;
  width:100%;
  height:100%;
  max-width:none!important;
  opacity:0;
  pointer-events:none!important;
  transform:translate3d(0,0,0);
  backface-visibility:hidden;
  will-change:transform,opacity;
  contain:strict;
  transition:opacity .20s linear;
}

#kag-home #reel .kag-kodak-touch-v58{
  appearance:none!important;
  -webkit-appearance:none!important;
  position:absolute!important;
  z-index:7!important;
  inset:0 auto auto 0;
  display:block!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:transparent!important;
  font-size:0!important;
  cursor:crosshair;
  pointer-events:none;
  touch-action:none!important;
  -ms-touch-action:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  -webkit-touch-callout:none!important;
  -webkit-tap-highlight-color:transparent!important;
}

#kag-home #reel .kag-kodak-hint-v58{
  position:absolute;
  z-index:8;
  right:14px;
  bottom:14px;
  pointer-events:none;
  padding:7px 9px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(4,5,7,.48);
  -webkit-backdrop-filter:blur(12px) brightness(70%);
  backdrop-filter:blur(12px) brightness(70%);
  color:rgba(247,247,242,.74);
  font-size:8px;
  font-weight:900;
  line-height:1;
  letter-spacing:.14em;
  text-transform:uppercase;
  white-space:nowrap;
  opacity:1;
  transform:translate3d(0,0,0);
  transition:opacity .35s ease,transform .35s ease;
}

#kag-home #reel .kag-kodak-hint-v58.is-hidden{
  opacity:0;
  transform:translate3d(0,5px,0);
}

#kag-home #reel .kag-pose-media.kag-v58-ready .kag-kodak-canvas-v58{
  opacity:1!important;
}
#kag-home #reel .kag-pose-media.kag-v58-ready .kag-kodak-touch-v58{
  pointer-events:auto!important;
}
#kag-home #reel .kag-pose-media.kag-v58-ready > img{
  opacity:0!important;
}

/* In fallback mode the original image remains pristine and interactive UI vanishes. */
#kag-home #reel .kag-pose-media.kag-v58-fallback .kag-kodak-canvas-v58,
#kag-home #reel .kag-pose-media.kag-v58-fallback .kag-kodak-touch-v58,
#kag-home #reel .kag-pose-media.kag-v58-fallback .kag-kodak-hint-v58{
  display:none!important;
}
#kag-home #reel .kag-pose-media.kag-v58-fallback > img{
  opacity:1!important;
}

/* ---------------------------------------------------------
03. MAN IN RED — 600PX PREWARM + COMPOSITOR STABILITY
--------------------------------------------------------- */
#kag-home #kag-tunnel,
#kag-home #kagCinemaSticky{
  transform:translate3d(0,0,0);
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

#kag-home #kagCinemaSticky{
  will-change:transform,opacity!important;
}

#kag-home #kag-tunnel .kag-cinema-world,
#kag-home #kag-tunnel .kag-cinema-world img,
#kag-home #kag-tunnel .kag-cinema-redman,
#kag-home #kag-tunnel .kag-cinema-redman img{
  transform:translate3d(0,0,0);
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
}

@media(max-width:900px){
  #kag-home [data-kag-capability-matrix]{
    display:block!important;
    isolation:isolate!important;
    overflow:visible!important;
  }

  #kag-home [data-kag-capability-matrix]::before{
    inset:-54px -44px -52px -44px!important;
    background:
      linear-gradient(
        135deg,
        rgba(10,10,10,.08) 0%,
        rgba(2,2,3,.60) 44%,
        rgba(0,0,0,.90) 80%,
        rgba(0,0,0,.80) 100%
      )!important;
    -webkit-backdrop-filter:blur(16px) brightness(35%) saturate(105%)!important;
    backdrop-filter:blur(16px) brightness(35%) saturate(105%)!important;
    -webkit-mask-image:
      radial-gradient(ellipse at 52% 50%,#000 0 50%,rgba(0,0,0,.72) 70%,transparent 100%)!important;
    mask-image:
      radial-gradient(ellipse at 52% 50%,#000 0 50%,rgba(0,0,0,.72) 70%,transparent 100%)!important;
  }
  #kag-home [data-kag-capability-matrix]::after{
    display:none!important;
  }

  #kag-home [data-kag-capability-matrix] .kag-capabilities{
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }

  #kag-home [data-kag-capability-matrix] .kag-capability{
    flex:0 0 clamp(90px,22vw,120px)!important;
    min-width:0!important;
    max-width:none!important;
    overflow:visible!important;
  }

  #kag-home [data-kag-capability-matrix] .kag-capability[data-title="Technology"]{
    flex:0 0 clamp(124px,31vw,158px)!important;
    min-width:124px!important;
    max-width:158px!important;
  }

  #kag-home .kag-info-card[data-kag-capability="technology"] .kag-card-title{
    font-size:clamp(40px,11.2vw,62px)!important;
    line-height:.88!important;
  }

  #kag-home #reel .kag-kodak-touch-v58{
    cursor:default!important;
    touch-action:none!important;
  }
  #kag-home #reel .kag-kodak-hint-v58{
    right:11px;
    bottom:11px;
    font-size:7.5px;
  }
}

@media(prefers-reduced-motion:reduce){
  #kag-home #reel .kag-kodak-hint-v58{
    display:none!important;
  }
}


/* =========================================================
KAG V59 — KODAK STRUCTURAL REPAIR + CINEMATIC RED-MAN ENTRY
========================================================= */

/* V58 regression repair:
   the art layer must remain absolute and OUT of normal document flow. */
#kag-home #reel .kag-pose-media[data-kag-fluid-surface]{
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  display:block!important;
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
  isolation:isolate!important;
  contain:paint!important;
}

/* Restore approved desktop Kodak art size / placement. */
#kag-home #reel .kag-pose-media[data-kag-fluid-surface] > img{
  position:absolute!important;
  z-index:2!important;
  top:50%!important;
  right:2.5%!important;
  bottom:auto!important;
  left:auto!important;
  width:min(54vw,860px)!important;
  max-width:none!important;
  height:96%!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center right!important;
  transform:translateY(-50%)!important;
  opacity:1!important;
  pointer-events:none!important;
  filter:contrast(1.04) saturate(.96) brightness(.96)!important;
  transition:none!important;
}

/* WebGL canvas/touch surface are sized/positioned by JS to the ACTUAL IMG rect. */
#kag-home #reel .kag-kodak-canvas-v58,
#kag-home #reel .kag-kodak-touch-v58{
  position:absolute!important;
  inset:auto!important;
  box-sizing:border-box!important;
  max-width:none!important;
  max-height:none!important;
}

#kag-home #reel .kag-kodak-canvas-v58{
  z-index:4!important;
  opacity:0;
  pointer-events:none!important;
  transform:translate3d(0,0,0);
  backface-visibility:hidden;
  will-change:opacity,transform;
}

#kag-home #reel .kag-kodak-touch-v58{
  z-index:7!important;
  pointer-events:none!important;
  touch-action:none!important;
}

/* Permanent DOM-art safety fallback. A good opaque GPU frame covers it;
   a failed/transparent frame can never leave a blank Kodak section again. */
#kag-home #reel .kag-pose-media.kag-v58-ready > img{
  opacity:1!important;
}
#kag-home #reel .kag-pose-media.kag-v58-ready .kag-kodak-canvas-v58{
  opacity:1!important;
}
#kag-home #reel .kag-pose-media.kag-v58-ready .kag-kodak-touch-v58{
  pointer-events:auto!important;
}

/* Old legacy highlight is no longer the active interaction. */
#kag-home #reel .kag-pose-media[data-kag-fluid-surface]::after{
  display:none!important;
}

/* Restore the approved responsive Kodak composition. */
@media(max-width:960px){
  #kag-home #reel .kag-pose-media[data-kag-fluid-surface] > img{
    top:50%!important;
    right:-6%!important;
    bottom:auto!important;
    left:auto!important;
    width:64vw!important;
    height:88%!important;
    max-height:none!important;
    transform:translateY(-50%)!important;
    object-position:center right!important;
    opacity:1!important;
  }
}

@media(max-width:760px){
  #kag-home #reel .kag-pose-media[data-kag-fluid-surface] > img{
    top:auto!important;
    right:auto!important;
    bottom:0!important;
    left:50%!important;
    width:min(90vw,480px)!important;
    height:auto!important;
    max-height:60svh!important;
    transform:translateX(-50%)!important;
    object-fit:contain!important;
    object-position:center bottom!important;
    opacity:1!important;
  }
}

@media(max-width:430px){
  #kag-home #reel .kag-pose-media[data-kag-fluid-surface] > img{
    width:min(92vw,460px)!important;
    max-height:59svh!important;
  }
}

/* Dedicated entrance letterbox. Does not affect Marvel. */
#kag-home .kag-cinema-letterbox{
  position:absolute!important;
  z-index:30!important; /* Marvel remains at 31 */
  inset:0!important;
  pointer-events:none!important;
  opacity:0;
  overflow:hidden!important;
  transform:translate3d(0,0,0);
  will-change:opacity;
}

#kag-home .kag-cinema-letterbox > span{
  position:absolute;
  left:0;
  width:100%;
  height:clamp(38px,7.5svh,86px);
  background:rgba(0,0,0,.985);
  box-shadow:0 0 34px rgba(0,0,0,.42);
  will-change:transform;
}

#kag-home .kag-cinema-letterbox-top{
  top:0;
  transform:translate3d(0,-105%,0)!important;
}

#kag-home .kag-cinema-letterbox-bottom{
  bottom:0;
  transform:translate3d(0,105%,0)!important;
}

/* Smooth compositor defaults. */
#kag-home #kagCinemaRedman,
#kag-home #kagCinemaRedman img,
#kag-home #kagCinemaLight,
#kag-home .kag-cinema-world,
#kag-home .kag-cinema-world-copy{
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
  will-change:transform,opacity,filter!important;
}

/* Keep the old red diagonal pre-Marvel bars disabled. */
#kag-home .kag-cinema-transition-bars{
  display:none!important;
  opacity:0!important;
}

@media(max-width:900px){
  #kag-home .kag-cinema-letterbox > span{
    height:clamp(30px,6.2svh,58px);
  }
}


/* KAG V60 FINAL OVERRIDES */
#kag-home #reel .kag-kodak-touch-v58{z-index:9!important;pointer-events:auto!important;touch-action:none!important;background:transparent!important}
#kag-home #reel .kag-kodak-pose-stack-v60{position:absolute!important;z-index:3!important;inset:auto!important;overflow:hidden!important;pointer-events:none!important;opacity:1!important;contain:paint!important;transform:translate3d(0,0,0)!important}
#kag-home #reel .kag-kodak-mirror-window-v60{position:absolute!important;inset:10.5% 6.8% 17.2% 6.8%!important;overflow:hidden!important;background:#070707!important;isolation:isolate!important}
#kag-home #reel .kag-kodak-mirror-window-v60::before{content:"";position:absolute;z-index:6;inset:-10%;pointer-events:none;opacity:0;background:radial-gradient(circle at var(--kag-mirror-x,50%) var(--kag-mirror-y,50%),rgba(255,255,255,.18) 0%,rgba(210,225,235,.08) 13%,rgba(255,20,46,.06) 29%,transparent 54%),linear-gradient(110deg,transparent 0 30%,rgba(255,255,255,.09) 42%,transparent 57% 100%);mix-blend-mode:screen;transition:opacity .42s ease}
#kag-home #reel .kag-kodak-mirror-window-v60>img{position:absolute!important;inset:-3%!important;width:106%!important;height:106%!important;max-width:none!important;max-height:none!important;object-fit:cover!important;object-position:center!important;opacity:0!important;filter:blur(14px) saturate(.76) contrast(1.10) brightness(.72)!important;transform:translate3d(0,0,0) scale(1.07)!important;transition:opacity .50s cubic-bezier(.16,.84,.2,1),filter .70s cubic-bezier(.16,.84,.2,1),transform .78s cubic-bezier(.16,.84,.2,1)!important}
#kag-home #reel .kag-kodak-pose-stack-v60.is-active .kag-kodak-mirror-window-v60>img.is-active{opacity:.94!important;filter:blur(4px) saturate(.92) contrast(1.07) brightness(.91)!important;transform:translate3d(0,0,0) scale(1.025)!important}
#kag-home #reel .kag-kodak-pose-stack-v60.is-active .kag-kodak-mirror-window-v60::before{opacity:.95!important}
#kag-home #reel .kag-kodak-glass-sheen-v60{position:absolute!important;z-index:7!important;inset:-12%!important;pointer-events:none!important;opacity:.22!important;background:linear-gradient(108deg,transparent 12%,rgba(255,255,255,.07) 31%,transparent 46%,rgba(255,255,255,.04) 67%,transparent 84%)!important;transform:translate3d(-18%,0,0)!important;transition:transform 1.1s cubic-bezier(.16,.84,.2,1),opacity .45s ease!important}
#kag-home #reel .kag-kodak-pose-stack-v60.is-active .kag-kodak-glass-sheen-v60{opacity:.58!important;transform:translate3d(16%,0,0)!important}
#kag-home #reel .kag-kodak-pose-stack-v60.is-ambient .kag-kodak-glass-sheen-v60{opacity:.52!important;transform:translate3d(8%,0,0)!important}
#kag-home #reel .kag-kodak-pose-stack-v60.is-fractured .kag-kodak-mirror-window-v60{animation:kagV60Fracture 1.8s cubic-bezier(.18,.72,.16,1) both!important}
@keyframes kagV60Fracture{0%{filter:none;transform:translate3d(0,0,0) scale(1)}7%{filter:contrast(1.5) saturate(.68);transform:translate3d(-3px,1px,0) scale(1.022) skewX(-.8deg)}15%{filter:contrast(1.25) saturate(.78);transform:translate3d(2px,-1px,0) scale(1.015) skewX(.55deg)}30%{filter:contrast(1.12);transform:translate3d(-1px,0,0) scale(1.008)}100%{filter:none;transform:translate3d(0,0,0) scale(1)}}
#kag-home #reel .kag-pose-media.kag-v60-ready .kag-kodak-canvas-v58{opacity:1!important}
#kag-home #reel .kag-pose-media.kag-v60-ready .kag-kodak-touch-v58{pointer-events:auto!important}
#kag-home #reel .kag-pose-media.kag-v60-ready>img{opacity:1!important}
#kag-home #reel .kag-pose-media.kag-v60-webgl-failed .kag-kodak-canvas-v58{display:none!important}
#kag-home #reel .kag-pose-media.kag-v60-webgl-failed .kag-kodak-touch-v58,#kag-home #reel .kag-pose-media.kag-v60-webgl-failed .kag-kodak-pose-stack-v60{display:block!important}

@media(max-width:900px){
  #kag-home #kag-hero{min-height:100svh!important;min-height:100dvh!important;overflow:hidden!important}
  #kag-home #kag-hero .kag-bg{width:116%!important;height:104%!important;left:-2%!important;right:auto!important;object-position:60% 50%!important;transform:translate3d(0,0,0) scale(1.025)!important}
  #kag-home #kag-hero .kag-overlay{background:linear-gradient(90deg,rgba(0,0,0,.93) 0%,rgba(0,0,0,.72) 34%,rgba(0,0,0,.28) 61%,rgba(0,0,0,.04) 84%),linear-gradient(180deg,rgba(0,0,0,.20) 0%,transparent 38%,rgba(0,0,0,.48) 100%)!important}
  #kag-home #kag-hero::after{content:""!important;display:block!important;position:absolute!important;z-index:3!important;pointer-events:none!important;left:-18%!important;top:30%!important;bottom:auto!important;width:92%!important;height:36%!important;opacity:.94!important;filter:blur(14px)!important;background:radial-gradient(ellipse at 36% 48%,rgba(0,0,0,.76) 0%,rgba(0,0,0,.53) 42%,rgba(0,0,0,.18) 68%,transparent 86%)!important}
  #kag-home #kag-hero .kag-copy{position:absolute!important;z-index:22!important;top:max(110px,calc(env(safe-area-inset-top,0px) + 86px))!important;left:22px!important;right:18px!important;width:auto!important;max-width:none!important;isolation:isolate!important}
  #kag-home #kag-hero .kag-eyebrow{gap:12px!important;margin:0 0 20px!important;font-size:10.5px!important;line-height:1!important;letter-spacing:.17em!important;text-shadow:0 2px 10px rgba(0,0,0,.92)!important}
  #kag-home #kag-hero .kag-eyebrow::before{width:48px!important;height:2px!important}
  #kag-home #kag-hero .kag-title{width:min(94vw,650px)!important;max-width:none!important;font-size:clamp(55px,13.5vw,76px)!important;line-height:.80!important;letter-spacing:-.035em!important;text-shadow:0 4px 18px rgba(0,0,0,.38)!important}
  #kag-home #kag-hero .kag-description{position:relative!important;z-index:4!important;width:min(76vw,310px)!important;max-width:310px!important;margin:20px 0 0!important;padding:0!important;color:rgba(248,248,244,.98)!important;font-size:16.5px!important;font-weight:500!important;line-height:1.43!important;letter-spacing:-.012em!important;text-shadow:0 2px 5px rgba(0,0,0,1),0 8px 24px rgba(0,0,0,.96)!important}
  #kag-home #kag-hero .kag-description::before{content:""!important;display:block!important;position:absolute!important;z-index:-1!important;pointer-events:none!important;inset:-18px -44px -18px -20px!important;border:0!important;border-radius:0!important;opacity:1!important;background:radial-gradient(ellipse at 28% 50%,rgba(2,2,2,.93) 0%,rgba(2,2,2,.79) 36%,rgba(2,2,2,.40) 61%,rgba(2,2,2,.11) 78%,transparent 94%)!important;-webkit-backdrop-filter:blur(7px) brightness(68%)!important;backdrop-filter:blur(7px) brightness(68%)!important;-webkit-mask-image:radial-gradient(ellipse at 28% 50%,#000 0 55%,rgba(0,0,0,.72) 72%,transparent 100%)!important;mask-image:radial-gradient(ellipse at 28% 50%,#000 0 55%,rgba(0,0,0,.72) 72%,transparent 100%)!important}
  #kag-home #kag-hero .kag-actions{position:relative!important;z-index:6!important;display:flex!important;gap:22px!important;width:max-content!important;margin:22px 0 0!important;opacity:1!important}
  #kag-home #kag-hero .kag-actions .kag-work,#kag-home #kag-hero .kag-actions .kag-play{opacity:1!important;color:#f8f8f4!important;min-height:34px!important;padding:0!important;border:0!important;background:transparent!important;font-size:10.5px!important;font-weight:900!important;letter-spacing:.075em!important;text-shadow:0 2px 9px rgba(0,0,0,1)!important}
  #kag-home #kag-hero .kag-play-button{width:29px!important;height:29px!important;background:rgba(0,0,0,.32)!important;border-color:rgba(255,255,255,.58)!important}
  #kag-home #kag-hero .kag-capability-zone{position:absolute!important;z-index:40!important;top:auto!important;left:22px!important;right:0!important;bottom:max(132px,calc(env(safe-area-inset-bottom,0px) + 116px))!important;width:auto!important;max-width:none!important;padding:0!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;overflow:visible!important;isolation:isolate!important}
  #kag-home #kag-hero .kag-capability-zone::before{content:""!important;display:block!important;position:absolute!important;z-index:-1!important;inset:-30px -20px -28px -30px!important;opacity:.92!important;filter:blur(18px)!important;background:linear-gradient(90deg,rgba(0,0,0,.76) 0%,rgba(0,0,0,.52) 44%,rgba(0,0,0,.18) 72%,transparent 94%)!important;-webkit-mask-image:linear-gradient(90deg,#000 0 66%,rgba(0,0,0,.55) 80%,transparent 100%)!important;mask-image:linear-gradient(90deg,#000 0 66%,rgba(0,0,0,.55) 80%,transparent 100%)!important}
  #kag-home #kag-hero .kag-capability-zone::after{display:none!important}
  #kag-home #kag-hero .kag-capabilities{display:flex!important;flex-direction:row!important;align-items:center!important;gap:26px!important;width:100%!important;padding:0 28px 5px 0!important;overflow-x:auto!important;overflow-y:visible!important;scroll-snap-type:x proximity!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important}
  #kag-home #kag-hero .kag-capabilities::-webkit-scrollbar{display:none!important}
  #kag-home #kag-hero .kag-capability,#kag-home #kag-hero .kag-capability[data-title="Technology"]{flex:0 0 auto!important;width:auto!important;min-width:max-content!important;max-width:none!important;min-height:42px!important;padding:0 0 7px!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.20)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;font-family:"Caveat",cursive!important;font-size:22px!important;font-weight:600!important;line-height:1!important;letter-spacing:0!important;text-transform:none!important;color:#fff!important;opacity:.96!important;white-space:nowrap!important;scroll-snap-align:start!important;transform:none!important;text-shadow:0 2px 8px rgba(0,0,0,1),0 7px 20px rgba(0,0,0,.9)!important}
  #kag-home #kag-hero .kag-cap-arrow{margin-left:18px!important;font-size:18px!important}
  #kag-home #kag-hero .kag-socials{left:22px!important;right:auto!important;bottom:max(42px,calc(env(safe-area-inset-bottom,0px) + 28px))!important;gap:8px!important;z-index:42!important}
  #kag-home #kag-hero .kag-social{width:34px!important;height:34px!important;background:rgba(0,0,0,.40)!important;border-color:rgba(255,255,255,.40)!important}
  #kag-home #kag-hero .kag-social svg{width:14px!important;height:14px!important}
}
@media(max-width:430px){
  #kag-home #kag-hero .kag-copy{top:max(104px,calc(env(safe-area-inset-top,0px) + 80px))!important;left:20px!important;right:15px!important}
  #kag-home #kag-hero .kag-title{font-size:clamp(53px,13.4vw,68px)!important}
  #kag-home #kag-hero .kag-description{width:min(77vw,300px)!important;max-width:300px!important;font-size:16px!important;margin-top:18px!important}
  #kag-home #kag-hero .kag-actions{margin-top:18px!important;gap:20px!important}
  #kag-home #kag-hero .kag-capability-zone{left:20px!important;bottom:max(128px,calc(env(safe-area-inset-bottom,0px) + 112px))!important}
  #kag-home #kag-hero .kag-capabilities{gap:24px!important}
  #kag-home #kag-hero .kag-capability,#kag-home #kag-hero .kag-capability[data-title="Technology"]{font-size:21px!important}
  #kag-home #kag-hero .kag-socials{left:20px!important}
}
@media(max-width:430px) and (max-height:760px){
  #kag-home #kag-hero .kag-copy{top:max(92px,calc(env(safe-area-inset-top,0px) + 70px))!important}
  #kag-home #kag-hero .kag-title{font-size:clamp(48px,12.4vw,59px)!important}
  #kag-home #kag-hero .kag-description{font-size:15px!important;line-height:1.38!important;margin-top:14px!important;max-width:285px!important}
  #kag-home #kag-hero .kag-actions{margin-top:13px!important}
  #kag-home #kag-hero .kag-capability-zone{bottom:max(112px,calc(env(safe-area-inset-bottom,0px) + 96px))!important}
  #kag-home #kag-hero .kag-socials{bottom:max(28px,calc(env(safe-area-inset-bottom,0px) + 18px))!important}
}



/* =========================================================
KAG V61 — KODAK HIT-TEST / HOVER REPAIR
ROOT CAUSE:
.kag-pose-content is a full-width z-index:5 rectangle above the Kodak
media stacking context. It was intercepting all mouse hover/pointer
events even though the right side looked visually empty.
========================================================= */

/* Text is editorial/non-interactive, so it must not steal pointer events
   from the Kodak artwork underneath. */
#kag-home #reel .kag2-shell,
#kag-home #reel .kag-pose-content,
#kag-home #reel .kag-pose-title,
#kag-home #reel .kag-pose-copy,
#kag-home #reel .kag2-kicker,
#kag-home #reel .kag-pose-script{
  pointer-events:none!important;
}

/* Keep the actual Kodak interaction plane live above the artwork. */
#kag-home #reel .kag-kodak-touch-v58{
  pointer-events:auto!important;
  z-index:20!important;
  cursor:crosshair!important;
}

/* Make the mirror-state transition visibly intentional, not so subtle
   that it looks like nothing happened. */
#kag-home #reel .kag-kodak-pose-stack-v60{
  z-index:5!important;
}
#kag-home #reel .kag-kodak-pose-stack-v60.is-active
.kag-kodak-mirror-window-v60>img.is-active{
  opacity:.97!important;
  filter:
    blur(3px)
    saturate(.98)
    contrast(1.12)
    brightness(.94)!important;
  transform:translate3d(0,0,0) scale(1.018)!important;
}
#kag-home #reel .kag-kodak-pose-stack-v60.is-active
.kag-kodak-mirror-window-v60::before{
  opacity:1!important;
}

/* The GPU canvas remains above the DOM mirror when it is valid,
   while the interaction plane remains the highest Kodak layer. */
#kag-home #reel .kag-kodak-canvas-v58{
  z-index:8!important;
}
#kag-home #reel .kag-kodak-touch-v58{
  z-index:20!important;
}

/* Visible response on hover even before the alternate portrait has
   fully cross-faded. */
#kag-home #reel .kag-pose-media.kag-v61-hovering
.kag-kodak-pose-stack-v60{
  filter:brightness(1.035) contrast(1.025);
}

/* Mobile keeps the exact same full-image hit target. */
@media(max-width:900px){
  #kag-home #reel .kag-kodak-touch-v58{
    cursor:default!important;
    touch-action:none!important;
  }
}


/* =========================================================
KAG V62 — RIGHT-SIDE KODAK INTERACTION / 4-POSE CYCLE
========================================================= */

/* Full section remains an art layer. */
#kag-home #reel .kag-pose-media[data-kag-fluid-surface]{
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
  isolation:isolate!important;
}

/* LEFT: deliberate ghost/echo only. It cannot receive hover/click. */
#kag-home #reel .kag-kodak-ghost-v62{
  position:absolute!important;
  z-index:1!important;
  left:-7%!important;
  top:50%!important;
  width:min(54vw,820px)!important;
  transform:translateY(-50%) translate3d(0,0,0)!important;
  pointer-events:none!important;
  opacity:.24!important;
  filter:blur(2.2px) brightness(.34) saturate(.62) contrast(.95)!important;
  mix-blend-mode:screen!important;
  -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,.95) 0%,rgba(0,0,0,.72) 44%,rgba(0,0,0,.18) 78%,transparent 100%)!important;
  mask-image:linear-gradient(90deg,rgba(0,0,0,.95) 0%,rgba(0,0,0,.72) 44%,rgba(0,0,0,.18) 78%,transparent 100%)!important;
}
#kag-home #reel .kag-kodak-ghost-v62>img{
  position:relative!important;
  display:block!important;
  inset:auto!important;
  width:100%!important;
  height:auto!important;
  max-width:none!important;
  max-height:none!important;
  transform:none!important;
  object-fit:contain!important;
  filter:none!important;
  opacity:1!important;
}

/* RIGHT: the only interactive Kodak object. */
#kag-home #reel .kag-kodak-art-v62{
  --kag-kodak-ratio:1.100535713908662;
  position:absolute!important;
  z-index:6!important;
  top:50%!important;
  right:2.5%!important;
  bottom:auto!important;
  left:auto!important;
  width:min(54vw,860px)!important;
  aspect-ratio:var(--kag-kodak-ratio)!important;
  height:auto!important;
  transform:translate3d(0,-50%,0)!important;
  pointer-events:none!important;
  isolation:isolate!important;
  contain:layout paint style!important;
  overflow:hidden!important;
}

#kag-home #reel .kag-kodak-art-v62>.kag-kodak-base-v62{
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
  filter:contrast(1.04) saturate(.96) brightness(.96)!important;
  opacity:1!important;
  pointer-events:none!important;
}

/* Every live layer is LOCAL to the right Kodak art box. */
#kag-home #reel .kag-kodak-art-v62 .kag-kodak-pose-stack-v60,
#kag-home #reel .kag-kodak-art-v62 .kag-kodak-canvas-v58,
#kag-home #reel .kag-kodak-art-v62 .kag-kodak-touch-v58{
  position:absolute!important;
  inset:0!important;
  left:0!important;
  top:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  transform:none!important;
  box-sizing:border-box!important;
}

#kag-home #reel .kag-kodak-art-v62 .kag-kodak-pose-stack-v60{
  z-index:4!important;
  overflow:hidden!important;
  pointer-events:none!important;
}
#kag-home #reel .kag-kodak-art-v62 .kag-kodak-canvas-v58{
  z-index:7!important;
  pointer-events:none!important;
}
#kag-home #reel .kag-kodak-art-v62 .kag-kodak-touch-v58{
  z-index:20!important;
  pointer-events:auto!important;
  cursor:crosshair!important;
  background:transparent!important;
  border:0!important;
  touch-action:none!important;
  -webkit-tap-highlight-color:transparent!important;
}

/* Portrait window stays INSIDE the right Kodak photograph opening. */
#kag-home #reel .kag-kodak-art-v62 .kag-kodak-mirror-window-v60{
  position:absolute!important;
  inset:10.5% 6.8% 17.2% 6.8%!important;
  overflow:hidden!important;
  background:#070707!important;
  isolation:isolate!important;
}

/* Clearly visible four-state crossfade. */
#kag-home #reel .kag-kodak-art-v62
.kag-kodak-mirror-window-v60>img[data-kag-mirror-pose]{
  position:absolute!important;
  inset:-3%!important;
  width:106%!important;
  height:106%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center!important;
  opacity:0!important;
  filter:blur(14px) saturate(.80) contrast(1.08) brightness(.72)!important;
  transform:translate3d(0,0,0) scale(1.065)!important;
  transition:
    opacity .42s cubic-bezier(.16,.84,.2,1),
    filter .62s cubic-bezier(.16,.84,.2,1),
    transform .72s cubic-bezier(.16,.84,.2,1)!important;
}

#kag-home #reel .kag-kodak-art-v62
.kag-kodak-pose-stack-v60.is-active
.kag-kodak-mirror-window-v60>img.is-active{
  opacity:.98!important;
  filter:blur(3.2px) saturate(.98) contrast(1.10) brightness(.95)!important;
  transform:translate3d(0,0,0) scale(1.018)!important;
}

/* CLICK/TAP is intentionally a DIFFERENT function from hover:
   local fracture rays flash out from the exact pointer location,
   then self-heal over 1.8 seconds. */
#kag-home #reel .kag-kodak-fracture-v62{
  --fx:50%;
  --fy:50%;
  position:absolute!important;
  z-index:12!important;
  inset:0!important;
  pointer-events:none!important;
  opacity:0;
  background:
    radial-gradient(circle at var(--fx) var(--fy),
      rgba(255,255,255,.88) 0 1px,
      rgba(255,255,255,.28) 2px,
      transparent 13px),
    repeating-conic-gradient(
      from 6deg at var(--fx) var(--fy),
      transparent 0deg 7deg,
      rgba(255,255,255,.54) 7.15deg 7.62deg,
      transparent 7.85deg 19deg
    );
  mix-blend-mode:screen!important;
  transform:scale(.2);
  filter:drop-shadow(0 0 2px rgba(255,255,255,.40))
         drop-shadow(0 0 7px rgba(255,25,52,.16));
}

#kag-home #reel .kag-kodak-pose-stack-v60.is-fractured
.kag-kodak-fracture-v62{
  animation:kagV62CrackHeal 1.8s cubic-bezier(.18,.72,.16,1) both!important;
}

@keyframes kagV62CrackHeal{
  0%{opacity:0;transform:scale(.14)}
  8%{opacity:.92;transform:scale(.82)}
  20%{opacity:.74;transform:scale(1.03)}
  48%{opacity:.34;transform:scale(1.09)}
  100%{opacity:0;transform:scale(1.13)}
}

/* Hovered zone receives a very light mirror sheen; no effect on the left ghost. */
#kag-home #reel .kag-kodak-art-v62.is-hovering{
  filter:drop-shadow(0 18px 42px rgba(0,0,0,.34));
}

/* Tablet/mobile: right art remains the single interactive target. */
@media(max-width:960px){
  #kag-home #reel .kag-kodak-art-v62{
    right:-6%!important;
    width:64vw!important;
  }
  #kag-home #reel .kag-kodak-ghost-v62{
    left:-18%!important;
    width:58vw!important;
    opacity:.17!important;
  }
}

@media(max-width:760px){
  #kag-home #reel .kag-kodak-art-v62{
    top:auto!important;
    right:auto!important;
    bottom:0!important;
    left:50%!important;
    width:min(90vw,480px)!important;
    transform:translate3d(-50%,0,0)!important;
  }

  /* On mobile, remove the left ghost so the screen does not become crowded. */
  #kag-home #reel .kag-kodak-ghost-v62{
    display:none!important;
  }

  #kag-home #reel .kag-kodak-art-v62 .kag-kodak-touch-v58{
    cursor:default!important;
    touch-action:none!important;
  }
}

@media(max-width:430px){
  #kag-home #reel .kag-kodak-art-v62{
    width:min(92vw,460px)!important;
  }
}


/* =========================================================
KAG V63 — KODAK BRIGHTNESS + MOBILE SCROLL STABILITY
The Kodak stays visually faithful to the source artwork. Interaction is
restricted to the photograph and no longer captures ordinary vertical scroll.
========================================================= */
#kag-home #reel .kag-kodak-art-v62>.kag-kodak-base-v62{
  filter:brightness(1.13) contrast(1.015) saturate(1.04)!important;
}
#kag-home #reel .kag-kodak-art-v62::after{
  content:"";position:absolute;z-index:2;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 30%,rgba(255,255,255,.018));
  mix-blend-mode:screen;opacity:.72;
}
#kag-home #reel .kag-kodak-art-v62 .kag-kodak-mirror-window-v60{
  background:#111!important;
}
#kag-home #reel .kag-kodak-art-v62 .kag-kodak-pose-stack-v60.is-active .kag-kodak-mirror-window-v60>img.is-active{
  filter:blur(2.4px) saturate(1.04) contrast(1.045) brightness(1.08)!important;
}
#kag-home #reel .kag-kodak-art-v62 .kag-kodak-touch-v58{
  touch-action:pan-y pinch-zoom!important;
  overscroll-behavior:auto!important;
}
#kag-home #reel .kag-kodak-art-v62,
#kag-home #reel .kag-kodak-pose-stack-v60,
#kag-home #reel .kag-kodak-canvas-v58{
  -webkit-backface-visibility:hidden!important;backface-visibility:hidden!important;
  transform-style:flat!important;
}
@media(max-width:760px){
  #kag-home #reel .kag-kodak-art-v62{width:min(88vw,455px)!important;bottom:1.5svh!important}
  #kag-home #reel .kag-kodak-art-v62 .kag-kodak-touch-v58{touch-action:pan-y pinch-zoom!important}
  #kag-home #reel .kag-kodak-hint-v58{display:none!important}
}


/* =========================================================
KAG V65 — FINAL KODAK RESTORE / RANDOM HOVER / MOBILE STABILITY
========================================================= */

/* Non-interactive typography never blocks the Kodak hit target. */
#kag-home #reel .kag2-shell,
#kag-home #reel .kag-pose-content,
#kag-home #reel .kag-pose-title,
#kag-home #reel .kag-pose-copy,
#kag-home #reel .kag2-kicker,
#kag-home #reel .kag-pose-script{
  pointer-events:none!important;
}

/* Full art layer remains out of normal page flow. */
#kag-home #reel .kag-pose-media[data-kag-fluid-surface]{
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  width:auto!important;
  height:auto!important;
  overflow:hidden!important;
  pointer-events:none!important;
  isolation:isolate!important;
  contain:paint!important;
}

/* ---------------------------------------------------------
LEFT DUPLICATE — restored because this was the composition the user liked.
It is atmosphere only; no hover/touch/click can land here.
--------------------------------------------------------- */
#kag-home #reel .kag-kodak-ghost-v64{
  position:absolute!important;
  z-index:1!important;
  top:53%!important;
  left:17%!important;
  width:min(35vw,520px)!important;
  aspect-ratio:2/3!important;
  transform:translate3d(-50%,-50%,0)!important;
  pointer-events:none!important;
  opacity:.26!important;
  filter:brightness(.58) saturate(.76) contrast(.98) blur(1.2px)!important;
  -webkit-mask-image:linear-gradient(
    90deg,
    rgba(0,0,0,.98) 0%,
    rgba(0,0,0,.84) 50%,
    rgba(0,0,0,.38) 77%,
    transparent 100%
  )!important;
  mask-image:linear-gradient(
    90deg,
    rgba(0,0,0,.98) 0%,
    rgba(0,0,0,.84) 50%,
    rgba(0,0,0,.38) 77%,
    transparent 100%
  )!important;
}
#kag-home #reel .kag-kodak-ghost-v64>img{
  display:block!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  transform:none!important;
  filter:none!important;
  opacity:1!important;
}

/* ---------------------------------------------------------
RIGHT KODAK — exact original 2:3 card, no dark filter, no crop.
Sizing is height-safe, so the KODAK wordmark and lower stripes remain visible.
--------------------------------------------------------- */
#kag-home #reel .kag-kodak-art-v64{
  position:absolute!important;
  z-index:7!important;
  top:50%!important;
  right:4.25%!important;
  bottom:auto!important;
  left:auto!important;

  width:min(36vw,560px)!important;
  aspect-ratio:2/3!important;
  height:auto!important;

  transform:translate3d(0,-50%,0)!important;
  pointer-events:none!important;
  isolation:isolate!important;
  contain:layout paint style!important;
  overflow:hidden!important;
  filter:none!important;
  background:transparent!important;
}

/* This is the pristine resting state. No brightness/contrast manipulation. */
#kag-home #reel .kag-kodak-base-v64{
  position:absolute!important;
  z-index:3!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
  filter:none!important;
  opacity:1!important;
  pointer-events:none!important;
}

/* Kill the old V63 light/dark overlay entirely. */
#kag-home #reel .kag-kodak-art-v64::after{
  display:none!important;
}

/* Alternate portraits sit ABOVE the optional GPU layer.
   This guarantees the random image changes are visible on every browser. */
#kag-home #reel .kag-kodak-pose-stack-v64{
  position:absolute!important;
  z-index:12!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  pointer-events:none!important;
  overflow:hidden!important;
  opacity:1!important;
}

/* Calibrated to the actual red portrait opening inside man3.png.
   The paper frame, Kodak logo and yellow/red stripe are outside this window. */
#kag-home #reel .kag-kodak-photo-window-v64{
  position:absolute!important;
  inset:15.35% 14.05% 24.15% 14.05%!important;
  overflow:hidden!important;
  background:transparent!important;
  isolation:isolate!important;
  transform:translate3d(0,0,0)!important;
}

/* Three exact alternate states. */
#kag-home #reel .kag-kodak-photo-window-v64>img[data-kag-mirror-pose]{
  position:absolute!important;
  z-index:3!important;
  inset:-3%!important;
  width:106%!important;
  height:106%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center!important;
  opacity:0!important;
  transform:translate3d(0,0,0) scale(1.055)!important;
  filter:blur(11px) saturate(.92) contrast(1.02) brightness(.98)!important;
  transition:
    opacity .46s cubic-bezier(.16,.84,.2,1),
    transform .72s cubic-bezier(.16,.84,.2,1),
    filter .64s cubic-bezier(.16,.84,.2,1)!important;
  backface-visibility:hidden!important;
}

/* Active random state appears like a portrait behind refractive glass. */
#kag-home #reel .kag-kodak-pose-stack-v64.is-active
.kag-kodak-photo-window-v64>img.is-active{
  opacity:.98!important;
  transform:translate3d(0,0,0) scale(1.012)!important;
  filter:blur(2.6px) saturate(1.00) contrast(1.05) brightness(1.00)!important;
}

/* Soft moving glass response. */
#kag-home #reel .kag-kodak-glass-v64{
  --mx:50%;
  --my:50%;
  position:absolute!important;
  z-index:8!important;
  inset:-6%!important;
  pointer-events:none!important;
  opacity:0!important;
  background:
    radial-gradient(circle at var(--mx) var(--my),
      rgba(255,255,255,.18) 0%,
      rgba(255,255,255,.075) 14%,
      rgba(255,24,52,.04) 31%,
      transparent 54%),
    linear-gradient(108deg,
      transparent 20%,
      rgba(255,255,255,.065) 42%,
      transparent 59%);
  mix-blend-mode:screen!important;
  transition:opacity .32s ease!important;
}
#kag-home #reel .kag-kodak-pose-stack-v64.is-active .kag-kodak-glass-v64{
  opacity:.90!important;
}

/* ---------------------------------------------------------
CLICK/TAP — intentionally different from hover.
A local fracture radiates from the exact click point, heals in 1.8s.
--------------------------------------------------------- */
#kag-home #reel .kag-kodak-fracture-v64{
  --fx:50%;
  --fy:50%;
  position:absolute!important;
  z-index:14!important;
  inset:0!important;
  pointer-events:none!important;
  opacity:0;
  background:
    radial-gradient(circle at var(--fx) var(--fy),
      rgba(255,255,255,.96) 0 1px,
      rgba(255,255,255,.35) 2px,
      transparent 14px),
    repeating-conic-gradient(
      from 3deg at var(--fx) var(--fy),
      transparent 0deg 7deg,
      rgba(255,255,255,.62) 7.15deg 7.62deg,
      transparent 7.9deg 17deg
    );
  mix-blend-mode:screen!important;
  transform:scale(.18);
  filter:
    drop-shadow(0 0 2px rgba(255,255,255,.48))
    drop-shadow(0 0 8px rgba(255,20,48,.18));
}
#kag-home #reel .kag-kodak-pose-stack-v64.is-fractured
.kag-kodak-fracture-v64{
  animation:kagV64CrackHeal 1.8s cubic-bezier(.18,.72,.16,1) both!important;
}
@keyframes kagV64CrackHeal{
  0%{opacity:0;transform:scale(.12)}
  7%{opacity:.94;transform:scale(.76)}
  19%{opacity:.74;transform:scale(1.02)}
  48%{opacity:.30;transform:scale(1.08)}
  100%{opacity:0;transform:scale(1.12)}
}

/* Optional GPU is an enhancement only.
   It NEVER covers/darkens the pristine Kodak at rest. */
#kag-home #reel .kag-kodak-art-v64 .kag-kodak-canvas-v58{
  position:absolute!important;
  z-index:7!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  opacity:0!important;
  pointer-events:none!important;
  transform:translate3d(0,0,0)!important;
  transition:opacity .18s ease!important;
}
#kag-home #reel .kag-kodak-art-v64.is-fracturing .kag-kodak-canvas-v58{
  opacity:.22!important;
}

/* Entire right Kodak is the interaction target. */
#kag-home #reel .kag-kodak-art-v64 .kag-kodak-touch-v58{
  position:absolute!important;
  z-index:30!important;
  inset:0!important;
  left:0!important;
  top:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  pointer-events:auto!important;
  cursor:crosshair!important;
  touch-action:pan-y pinch-zoom!important;
  overscroll-behavior:auto!important;
  -webkit-tap-highlight-color:transparent!important;
}

/* Hide helper badge on mobile; interaction must feel native, not like a demo. */
#kag-home #reel .kag-kodak-hint-v58{
  display:none!important;
}

/* Tablet */
@media(max-width:1100px){
  #kag-home #reel .kag-kodak-art-v64{
    right:2%!important;
    width:min(40vw,520px)!important;
  }
  #kag-home #reel .kag-kodak-ghost-v64{
    left:12%!important;
    width:min(37vw,470px)!important;
    opacity:.20!important;
  }
}

/* Mobile: full card stays visible, no Kodak crop, no WebGL scroll penalty. */
@media(max-width:760px){
  #kag-home #reel .kag-kodak-art-v64{
    top:auto!important;
    right:auto!important;
    bottom:26px!important;
    left:50%!important;
    width:min(84vw,430px)!important;
    aspect-ratio:2/3!important;
    transform:translate3d(-50%,0,0)!important;
  }

  /* Keep mobile clean; the liked left duplicate is restored on desktop/tablet. */
  #kag-home #reel .kag-kodak-ghost-v64{
    display:none!important;
  }

  #kag-home #reel .kag-kodak-art-v64 .kag-kodak-touch-v58{
    cursor:default!important;
    touch-action:pan-y pinch-zoom!important;
  }

  /* GPU canvas is completely disabled on coarse mobile devices.
     DOM portrait cycling + fracture remains fast and artifact-free. */
  #kag-home #reel .kag-kodak-art-v64 .kag-kodak-canvas-v58{
    display:none!important;
  }

  #kag-home #reel .kag-pose-script{
    right:18px!important;
    bottom:18px!important;
    z-index:20!important;
  }
}

@media(max-width:430px){
  #kag-home #reel .kag-kodak-art-v64{
    width:min(82vw,360px)!important;
    bottom:34px!important;
  }
}

/* Remove the circular backdrop clipping while retaining the original soft gradient. */
@media (min-width: 769px) {
  #kag-home #kag-hero [data-kag-capability-matrix]::before {
    border-radius: 0 !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}