/* ADI MASTER T2.3.19 - MEDIA EXPERIENCE
   Travel-only cinematic media wall + focus viewer. */

[data-view="travel"] .travelOwnedMedia{
  position:relative;
  margin-top:clamp(44px,6vw,82px);
  padding:clamp(26px,3vw,42px);
  border:1px solid rgba(105,232,242,.13);
  border-radius:30px;
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 4%,rgba(75,228,240,.075),transparent 30%),
    radial-gradient(circle at 92% 10%,rgba(232,78,167,.055),transparent 27%),
    linear-gradient(145deg,rgba(3,11,17,.92),rgba(5,7,13,.86));
  box-shadow:inset 0 1px rgba(255,255,255,.03),0 28px 100px rgba(0,0,0,.18);
}
[data-view="travel"] .travelOwnedMedia::before{
  content:"";
  position:absolute;
  inset:12px;
  border:1px solid rgba(105,232,242,.045);
  border-radius:23px;
  pointer-events:none;
}
[data-view="travel"] .travelOwnedHead{
  position:relative;
  z-index:2;
  margin-bottom:clamp(24px,3vw,38px);
}
[data-view="travel"] .travelOwnedHead .kicker{
  letter-spacing:.24em;
}
[data-view="travel"] #travelPhotosBlock,
[data-view="travel"] #travelVideosBlock{
  display:none !important;
}

.adiMediaExperience{
  position:relative;
  z-index:2;
}
.adiMediaExperienceTopline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin:0 0 15px;
  color:#6e8592;
  font:850 9px/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.adiMediaExperienceTopline span:first-child{color:#8cecf2}
.adiMediaExperienceCount{white-space:nowrap}

.adiMediaWall{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(280px,1fr);
  gap:12px;
  align-items:start;
  min-width:0;
}
.adiMediaColumn{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.adiMediaTile{
  width:100%;
  min-width:0;
  margin:0;
  align-self:flex-start;
}
.adiMediaWall.isSingleColumn{display:flex;flex-direction:column;gap:9px}

.adiMediaFrame{
  display:block;
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  overflow:hidden;
  background:#02070b;
}
.adiMediaTile.isPortrait .adiMediaFrame{aspect-ratio:3/4}
.adiMediaTile.isLandscape .adiMediaFrame{aspect-ratio:16/9}
.adiMediaTile.isVideo .adiMediaFrame{aspect-ratio:16/9}

.adiMediaBackdrop,
.adiMediaAsset{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}
.adiMediaBackdrop{
  object-fit:cover;
  filter:blur(25px) saturate(.84) brightness(.46);
  transform:scale(1.14);
  opacity:.55;
}
.adiMediaAsset{
  z-index:2;
  object-fit:contain;
  object-position:center;
  background:transparent;
  transition:transform .75s cubic-bezier(.2,.7,.2,1),filter .55s ease;
}
.adiMediaTile.isLandscape .adiMediaAsset{object-fit:cover}
.adiMediaTile.isVideo .adiMediaAsset{object-fit:cover}
.adiMediaVeil{
  position:absolute;
  z-index:3;
  inset:0;
  background:
    linear-gradient(180deg,rgba(1,6,10,.00) 35%,rgba(1,6,10,.18) 58%,rgba(1,6,10,.86) 100%),
    linear-gradient(110deg,rgba(2,8,12,.24),transparent 50%);
  pointer-events:none;
}
.adiMediaScan{
  position:absolute;
  z-index:4;
  left:-18%;
  top:0;
  width:18%;
  height:100%;
  opacity:0;
  background:linear-gradient(90deg,transparent,rgba(196,250,255,.13),transparent);
  transform:skewX(-8deg);
  pointer-events:none;
}
.adiMediaTileMeta{
  position:absolute;
  z-index:5;
  left:16px;
  right:16px;
  bottom:14px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  text-align:left;
}
.adiMediaTileCopy{min-width:0}
.adiMediaType{
  display:block;
  margin-bottom:7px;
  color:#77eaf1;
  font:900 8px/1 system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.adiMediaTitle{
  display:block;
  overflow:hidden;
  color:#f5fbff;
  font:820 clamp(13px,1.15vw,17px)/1.22 system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:-.02em;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.adiMediaIndex{
  flex:0 0 auto;
  color:#8799a6;
  font:800 9px/1 system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:.1em;
}
.adiMediaPlay{
  position:absolute;
  z-index:6;
  left:50%;
  top:50%;
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  transform:translate(-50%,-50%);
  border:1px solid rgba(179,246,250,.34);
  border-radius:50%;
  background:rgba(2,9,13,.54);
  box-shadow:0 0 0 7px rgba(2,9,13,.12),0 15px 50px rgba(0,0,0,.3);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  color:#efffff;
  font:700 17px/1 Arial,sans-serif;
  transition:transform .34s ease,background .34s ease,border-color .34s ease;
  pointer-events:none;
}
.adiMediaTile:hover{
  transform:translateY(-4px);
  border-color:rgba(112,237,246,.30);
  box-shadow:0 25px 70px rgba(0,0,0,.32),0 0 34px rgba(66,225,238,.045);
}
.adiMediaTile:hover .adiMediaAsset{transform:scale(1.018);filter:saturate(1.05) contrast(1.015)}
.adiMediaTile:hover .adiMediaScan{animation:adiMediaScan .95s ease-out 1}
.adiMediaTile:hover .adiMediaPlay{transform:translate(-50%,-50%) scale(1.07);background:rgba(4,17,22,.72);border-color:rgba(179,246,250,.55)}
@keyframes adiMediaScan{0%{left:-18%;opacity:0}22%{opacity:.55}100%{left:112%;opacity:0}}

/* Dedicated focus viewer */
.adiMediaFocus{
  position:fixed;
  z-index:120000;
  inset:0;
  display:none;
  color:#fff;
}
.adiMediaFocus.isOpen{display:block}
.adiMediaFocusBackdrop{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 12% 0%,rgba(40,126,143,.10),transparent 31%),
    radial-gradient(circle at 89% 0%,rgba(128,38,92,.08),transparent 27%),
    rgba(1,4,7,.975);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.adiMediaFocusFrame{
  position:absolute;
  inset:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  padding:max(22px,env(safe-area-inset-top)) max(26px,env(safe-area-inset-right)) max(22px,env(safe-area-inset-bottom)) max(26px,env(safe-area-inset-left));
}
.adiMediaFocusTop{
  position:relative;
  z-index:3;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
  padding-bottom:16px;
}
.adiMediaFocusIdentity{min-width:0}
.adiMediaFocusKicker{
  display:block;
  color:#64eaf1;
  font:900 8px/1 system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.adiMediaFocusTitle{
  margin-top:9px;
  color:#f6fbff;
  font:780 clamp(20px,2vw,32px)/1.05 system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:-.035em;
}
.adiMediaFocusCoords{
  margin-top:8px;
  color:#728692;
  font:780 9px/1.35 system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.adiMediaFocusClose{
  appearance:none;
  width:44px;
  height:44px;
  flex:0 0 44px;
  display:grid;
  place-items:center;
  border:1px solid rgba(127,230,239,.16);
  border-radius:50%;
  background:rgba(5,15,20,.72);
  color:#e8fbff;
  cursor:pointer;
  font:400 20px/1 Arial,sans-serif;
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.adiMediaFocusClose:hover{border-color:rgba(127,230,239,.4);background:rgba(9,25,31,.88);transform:rotate(3deg)}
.adiMediaFocusStage{
  position:relative;
  min-height:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:16px;
  touch-action:none;
}
.adiMediaFocusStage::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:min(78vw,1160px);
  height:min(70vh,760px);
  transform:translate(-50%,-50%);
  border:1px solid rgba(103,228,238,.055);
  border-radius:24px;
  pointer-events:none;
}
.adiMediaFocusImage,
.adiMediaFocusVideo{
  position:relative;
  z-index:2;
  display:block;
  max-width:min(88vw,1580px);
  max-height:74vh;
  width:auto;
  height:auto;
  object-fit:contain;
  border-radius:12px;
  box-shadow:0 30px 100px rgba(0,0,0,.48);
}
.adiMediaFocusImage{
  transform:translate3d(var(--media-x,0px),var(--media-y,0px),0) scale(var(--media-scale,1));
  transform-origin:center;
  cursor:zoom-in;
  will-change:transform;
  transition:transform .16s ease-out;
  user-select:none;
  -webkit-user-select:none;
}
.adiMediaFocusImage.isZoomed{cursor:grab}
.adiMediaFocusImage.isDragging{cursor:grabbing;transition:none}
.adiMediaFocusVideo{width:min(88vw,1320px);aspect-ratio:16/9;background:#000}
.adiMediaFocusNav{
  appearance:none;
  position:absolute;
  z-index:4;
  top:50%;
  width:52px;
  height:72px;
  display:grid;
  place-items:center;
  transform:translateY(-50%);
  border:1px solid rgba(126,231,240,.12);
  border-radius:18px;
  background:rgba(3,11,16,.58);
  color:#e9fbff;
  cursor:pointer;
  font:400 25px/1 Arial,sans-serif;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  transition:background .2s ease,border-color .2s ease,transform .2s ease;
}
.adiMediaFocusNav:hover{background:rgba(5,22,28,.78);border-color:rgba(126,231,240,.34)}
.adiMediaFocusPrev{left:10px}
.adiMediaFocusNext{right:10px}
.adiMediaFocusBottom{
  position:relative;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding-top:14px;
}
.adiMediaFocusCounter{
  color:#758a96;
  font:850 9px/1 system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:.14em;
}
.adiMediaFocusHint{
  color:#5f727e;
  font:760 8px/1 system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:.10em;
  text-transform:uppercase;
}
body.adiMediaFocusOpen{overflow:hidden!important}

.adiMediaGhost{
  position:fixed;
  z-index:130000;
  margin:0;
  object-fit:cover;
  border-radius:18px;
  box-shadow:0 30px 90px rgba(0,0,0,.48);
  pointer-events:none;
  will-change:left,top,width,height,opacity,border-radius;
}

/* T2.3.19.2 - playback performance: the wall uses a frozen poster, not a second playing video. */
.adiMediaVideoPoster{object-fit:cover}
body.adiMediaFocusVideoOpen [data-view="travel"]{visibility:hidden!important}
body.adiMediaFocusVideoOpen .adiMediaFocusBackdrop{
  background:#010407!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
body.adiMediaFocusVideoOpen .adiMediaFocusFrame{background:#010407}
body.adiMediaFocusVideoOpen .adiMediaFocusStage::before{display:none}
body.adiMediaFocusVideoOpen .adiMediaFocusNav{
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
body.adiMediaFocusVideoOpen .adiMediaFocusVideo{
  box-shadow:none;
  filter:none!important;
  transform:none!important;
  will-change:auto;
}


/* T2.3.19.3 - integrate the new viewer with the existing Travel video performance concept. */
body.adiMediaFocusVideoOpen{background:#000!important}
body.adiMediaFocusVideoOpen > header,
body.adiMediaFocusVideoOpen > .mobileDrawer,
body.adiMediaFocusVideoOpen > main,
body.adiMediaFocusVideoOpen > #searchOverlay,
body.adiMediaFocusVideoOpen > #player,
body.adiMediaFocusVideoOpen > footer{display:none!important}
body.adiMediaFocusVideoOpen canvas,
body.adiMediaFocusVideoOpen iframe{display:none!important}
body.adiMediaFocusVideoOpen #adiMediaFocus{display:block!important;background:#000!important}
body.adiMediaFocusVideoOpen #adiMediaFocus *,
body.adiMediaFocusVideoOpen #adiMediaFocus *::before,
body.adiMediaFocusVideoOpen #adiMediaFocus *::after{animation:none!important;transition:none!important}
body.adiMediaFocusVideoOpen .adiMediaFocusStage{contain:layout paint style;overflow:hidden!important}
body.adiMediaFocusVideoOpen .adiMediaFocusVideo{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:min(96vw,1600px)!important;
  max-height:82vh!important;
  object-fit:contain!important;
  background:#000!important;
  box-shadow:none!important;
}
@media(max-width:1000px){
  .adiMediaWall{grid-template-columns:minmax(0,1.7fr) minmax(240px,1fr)}
}
@media(max-width:760px){
  [data-view="travel"] .travelOwnedMedia{
    margin-top:34px;
    padding:19px 14px 18px;
    border-radius:24px;
  }
  [data-view="travel"] .travelOwnedMedia::before{inset:8px;border-radius:18px}
  .adiMediaExperienceTopline{margin-bottom:10px;padding:0 2px;font-size:7px}
  .adiMediaWall{display:flex;flex-direction:column;gap:9px}
  .adiMediaColumn{display:contents}
  .adiMediaTile{--tile-radius:15px}
  .adiMediaTileMeta{left:11px;right:11px;bottom:10px;gap:8px}
  .adiMediaType{margin-bottom:5px;font-size:6px;letter-spacing:.13em}
  .adiMediaTitle{font-size:11px}
  .adiMediaIndex{font-size:7px}
  .adiMediaPlay{width:48px;height:48px;font-size:14px}
  .adiMediaFocusFrame{padding:max(14px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}
  .adiMediaFocusTop{padding:0 5px 10px;gap:12px}
  .adiMediaFocusKicker{font-size:7px}
  .adiMediaFocusTitle{margin-top:6px;font-size:18px}
  .adiMediaFocusCoords{margin-top:6px;font-size:7px}
  .adiMediaFocusClose{width:40px;height:40px;flex-basis:40px}
  .adiMediaFocusStage{border-radius:12px}
  .adiMediaFocusStage::before{display:none}
  .adiMediaFocusImage,.adiMediaFocusVideo{max-width:94vw;max-height:72vh;border-radius:9px}
  .adiMediaFocusVideo{width:94vw}
  .adiMediaFocusNav{top:auto;bottom:6px;width:44px;height:44px;border-radius:50%;font-size:20px}
  .adiMediaFocusPrev{left:8px}
  .adiMediaFocusNext{right:8px}
  .adiMediaFocusBottom{padding:10px 8px 0;justify-content:center}
  .adiMediaFocusHint{display:none}
}
@media(max-width:420px){
  .adiMediaWall{display:flex;flex-direction:column;gap:8px}
  .adiMediaTile.isPortrait .adiMediaFrame{aspect-ratio:4/5}
}
@media(hover:none){
  .adiMediaTile:hover{transform:none}
  .adiMediaScan{display:none}
}
@media(prefers-reduced-motion:reduce){
  .adiMediaTile,.adiMediaAsset,.adiMediaPlay,.adiMediaGhost,.adiMediaFocusImage{transition:none!important;animation:none!important}
}
