/*
  ITERACJA 100
  Korekty po kontroli pionowego smartfona w Operze.
*/

/* Tekst przycisku nie dziedziczy już rozmiaru przeznaczonego dla strzałki. */
.hero-next>span:first-child{
  color:var(--orange);
  font-size:12px;
  line-height:1.2;
  transition:none
}
.hero-next>span:last-child{
  color:var(--orange);
  font-size:18px;
  line-height:1;
  transition:transform .2s ease
}
.hero-next:hover>span:first-child,
.hero-next:focus-visible>span:first-child{transform:none}
.hero-next:hover>span:last-child,
.hero-next:focus-visible>span:last-child{transform:translateY(3px)}

/* Wszystkie pozycje stopki korzystają z identycznych metryk typograficznych. */
#gds-living-machine .footer-links a,
#gds-living-machine .footer-links button{
  -webkit-appearance:none;
  appearance:none;
  border-radius:0;
  font-family:var(--display);
  font-size:11px;
  font-weight:600;
  line-height:1.2;
  letter-spacing:.12em;
  text-align:left
}

@media(max-width:680px){
  /* Sekcja 02: mobilna kompozycja korzysta z proporcji pola, nie z desktopowych pikseli. */
  .principle-layout{gap:24px}
  .principle-machine{
    height:292px;
    margin-top:0;
    overflow:hidden;
    border-top:1px solid rgba(23,16,13,.12);
    background:linear-gradient(135deg,rgba(23,16,13,.025),rgba(175,145,117,.1));
    isolation:isolate
  }
  #gds-living-machine .principle .approved-reaction-stage .rm-a{right:-10%;top:2%;width:62%}
  #gds-living-machine .principle .approved-reaction-stage .rm-b{left:-8%;bottom:-34%;width:68%}
  #gds-living-machine .principle .approved-reaction-stage .rm-c{right:23%;top:8%;width:34%}
  #gds-living-machine .principle .approved-reaction-stage .rs-black{left:5%;top:15%;width:34%;box-shadow:12px 13px 0 rgba(36,26,20,.055)}
  #gds-living-machine .principle .approved-reaction-stage .ee-window-square{right:5%;bottom:7%;width:31%;box-shadow:none}
  #gds-living-machine .principle .approved-reaction-stage .rs-brown{left:43%;bottom:7%;width:23%}
  #gds-living-machine .principle .approved-reaction-stage .reaction-trigger{
    left:8%;top:38%;width:27px;height:27px;box-shadow:6px 7px 0 #702b19;
    animation-name:trigger-mobile
  }
  #gds-living-machine .principle .approved-reaction-stage .impact-glow{left:calc(8% + 130px);top:calc(38% - 7px);width:42px;height:42px}
  #gds-living-machine .principle .approved-reaction-stage .reciprocator-bank{right:-2%;top:11%;width:58%;gap:10px;transform:none}
  #gds-living-machine .principle .approved-reaction-stage .reciprocator{height:35px;box-shadow:6px 7px 0 rgba(36,26,20,.035)}
  #gds-living-machine .principle .approved-reaction-stage .reciprocator i{left:4px;top:4px;width:27px;height:27px;animation-name:reciprocate-mobile}
  #gds-living-machine .principle .approved-reaction-stage .rc-two{margin-left:24px}
  #gds-living-machine .principle .approved-reaction-stage .rc-three{margin-left:9px}
  #gds-living-machine .principle .approved-reaction-stage .mechanical-wave{right:2%;top:51%;transform:scale(.55);transform-origin:right top}
  #gds-living-machine .principle .approved-reaction-stage .edge-morph{left:7%;top:68%;width:142px;height:19px;animation-name:reaction-born-mobile}
  #gds-living-machine .principle .approved-reaction-stage .mass-path-square{left:15%;bottom:12%;width:21px;height:21px;box-shadow:5px 6px 0 rgba(0,0,0,.32);animation-name:mass-path-mobile}
  #gds-living-machine .principle .approved-reaction-stage .maintenance-bay{left:39%;bottom:4%;transform:scale(.62);transform-origin:left bottom}
  #gds-living-machine .principle .approved-reaction-stage .foreground-gate{right:-1%;width:7%}

  /* Strzałka zajmuje pełną wysokość swojej kolumny i jest centrowana w obu osiach. */
  .faculty-gateway-arrow{align-self:stretch;width:auto;height:100%}

  /* Czytelny, uporządkowany pionowy blok nawigacji stopki. */
  .site-footer{gap:28px}
  .footer-links{
    display:grid;
    grid-template-columns:1fr;
    gap:0;
    width:100%;
    border-top:1px solid rgba(23,16,13,.16)
  }
  #gds-living-machine .footer-links a,
  #gds-living-machine .footer-links button{
    width:100%;
    min-height:42px;
    padding:13px 0;
    border-bottom:1px solid rgba(23,16,13,.16);
    font-size:10px
  }

  .hero-next>span:first-child{font-size:9.5px;white-space:nowrap}
  .hero-next>span:last-child{font-size:17px}
}

@keyframes trigger-mobile{
  0%,8%{transform:translateX(0)}
  24%,38%{transform:translateX(118px)}
  39%{transform:translateX(121px)}
  41%,100%{transform:translateX(118px)}
}
@keyframes reciprocate-mobile{to{transform:translateX(150px)}}
@keyframes reaction-born-mobile{
  0%,8%{clip-path:inset(0 99.45% 0 0);transform:translateX(0);opacity:0}
  12%{clip-path:inset(0 99.45% 0 0);transform:translateX(0);opacity:1}
  29%,54%{clip-path:inset(0);transform:translateX(0);opacity:1}
  68%{clip-path:inset(0);transform:translateX(78px);opacity:1}
  84%{clip-path:inset(0 0 0 99.45%);transform:translateX(78px);opacity:1}
  89%,100%{clip-path:inset(0 0 0 99.45%);transform:translateX(78px);opacity:0}
}
@keyframes mass-path-mobile{
  0%,6%{transform:translate(0,0)}
  24%,31%{transform:translate(88px,0)}
  48%,56%{transform:translate(88px,-64px)}
  73%,81%{transform:translate(24px,-64px)}
  95%,100%{transform:translate(24px,0)}
}