/*
  ITERACJA 107
  Stabilizacja pionowego tabletu, dotykowego Programu i profili wykładowców,
  płynniejsze przejścia oraz wyraźniejszy ruch tła Polityki prywatności.
*/

/* Opera potrafi pokazać jedną niezamaskowaną klatkę obrazu podczas tworzenia
   warstwy maski. Obraz przychodzący jest ujawniany dopiero przez JS po
   przygotowaniu maski, bez opóźnienia wpisanego w samą animację. */
.gallery-images>img.incoming{
  animation-delay:0s!important;
  visibility:hidden;
}
.gallery-images>img.incoming.is-reveal-ready{visibility:visible}

/* Pionowy tablet nie może dziedziczyć absolutnego, desktopowego układu hero. */
@media (min-width:760px) and (max-width:1100px) and (orientation:portrait){
  :root{--header-h:112px;--gutter:clamp(34px,5vw,52px)}
  #gds-living-machine{padding-top:var(--header-h)}
  #gds-living-machine>.site-header{height:var(--header-h);padding-inline:var(--gutter)}
  #gds-living-machine .hero-comparison{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    min-height:0;
    height:auto;
    padding:0 0 88px;
    background:#000
  }
  #gds-living-machine .hero-comparison .hero-course-intro{
    position:relative;
    z-index:28;
    grid-row:1;
    inset:auto;
    display:grid;
    gap:14px;
    width:auto;
    margin:0;
    padding:42px var(--gutter) 32px;
    text-align:left
  }
  #gds-living-machine .hero-comparison .hero-course-intro h1{
    max-width:700px;
    font-size:clamp(46px,7.2vw,64px);
    line-height:.9
  }
  #gds-living-machine .hero-comparison .hero-course-intro .hero-course-subtitle{
    max-width:640px;
    font-size:clamp(17px,2.4vw,22px);
    line-height:1.18
  }
  #gds-living-machine .hero-comparison .machine-video{
    position:relative;
    z-index:24;
    grid-row:2;
    inset:auto!important;
    width:calc(100% - 2 * var(--gutter));
    margin:18px var(--gutter) 0;
    aspect-ratio:16/9
  }
  #gds-living-machine .hero-comparison .hero-copy{
    position:relative;
    z-index:25;
    grid-row:3;
    inset:auto!important;
    width:auto;
    margin:48px var(--gutter) 0!important;
    padding:38px 40px 42px;
    transform:none!important;
    background:linear-gradient(120deg,rgba(0,0,0,.97),rgba(0,0,0,.87));
    box-shadow:18px 18px 0 rgba(50,36,28,.25)
  }
  #gds-living-machine .hero-comparison .hero-monument{
    right:-8%;
    top:24%!important;
    width:84%;
    opacity:.13
  }
  #gds-living-machine .hero-comparison .hero-index,
  #gds-living-machine .hero-comparison .hero-status{display:none}
}

/* Na ekranie dotykowym odsłonięcie nazw jest stanem stałym, a nie warstwą
   clip-path zależną od ponownego rasteryzowania po przewinięciu. */
@media (hover:none),(pointer:coarse),(max-width:1100px){
  #gds-living-machine .program-topic{
    clip-path:none!important;
    animation:none!important;
    -webkit-tap-highlight-color:transparent
  }
  #gds-living-machine .program-topic::before,
  #gds-living-machine .program-topic::after{animation:none!important}
  #gds-living-machine .program>.scene-lighting,
  #gds-living-machine .program>.motion-field{
    top:0;
    bottom:auto;
    height:var(--program-ambient-height,100%);
    contain:layout paint style
  }

  /* Dotyk nie może uruchamiać lepkiego desktopowego hoveru profilu. */
  .faculty-directory-page .faculty-matrix .faculty-directory-card::after,
  .faculty-directory-page .faculty-matrix .faculty-directory-card:hover::after{
    bottom:100%!important;
    transition:none!important
  }
  .faculty-directory-page .faculty-matrix .faculty-directory-card .portrait img,
  .faculty-directory-page .faculty-matrix .faculty-directory-card:hover .portrait img{
    filter:grayscale(1) sepia(.22) saturate(.52) contrast(1.06)!important;
    transform:scale(1.025)!important;
    transition:none!important
  }
  .faculty-directory-page .faculty-matrix .faculty-directory-card.michal .portrait img,
  .faculty-directory-page .faculty-matrix .faculty-directory-card.aneta .portrait img,
  .faculty-directory-page .faculty-matrix .faculty-directory-card.michal:hover .portrait img,
  .faculty-directory-page .faculty-matrix .faculty-directory-card.aneta:hover .portrait img{
    filter:grayscale(1) contrast(1.04) brightness(1.02)!important
  }
}

/* Ruch Polityki pozostaje miękki, ale jest jednoznacznie zauważalny. */
@keyframes privacy-field-a{to{transform:translate3d(11vw,-3.8vh,0);opacity:calc(var(--o) * .68)}}
@keyframes privacy-field-b{to{transform:translate3d(-10vw,5.2vh,0);opacity:calc(var(--o) * .72)}}
@keyframes privacy-field-c{to{transform:translate3d(7.5vw,7vh,0);opacity:calc(var(--o) * .64)}}
@keyframes privacy-field-d{to{transform:translate3d(-7vw,-6vh,0);opacity:calc(var(--o) * .70)}}
@keyframes privacy-square-field-a{to{transform:translate3d(-8vw,5.5vh,0);opacity:calc(var(--o) * .62)}}
@keyframes privacy-square-field-b{to{transform:translate3d(8.5vw,-5vh,0);opacity:calc(var(--o) * .68)}}