/* Etapy projektu wnętrz | SALT Concept */
body{margin:0;background:#0b0a09}
a{color:#f4efe7}
a:hover{color:#ffffff}
a:focus-visible, button:focus-visible{outline:1px solid #ffe2aa; outline-offset:6px}
.cta{transition:background-color .5s ease, color .5s ease, border-color .5s ease}
.cta:hover{background:#f4efe7; color:#14110e; border-color:#f4efe7}

/* Oś czasu: jedna wartość --p (0 = początek, 1 = koniec) przesuwa linię światła.
   Każdy element ma próg --at i rozjaśnia się, gdy linia do niego dojdzie.
   Bez skryptu --p ma wartość końcową, więc cała oś jest od razu widoczna. */
.axis{--p:1.06}
.tl{display:grid; grid-template-columns:repeat(13, minmax(0, 1fr)); min-width:1180px}
.lit{opacity:calc(.26 + .74 * clamp(0, (var(--p) - var(--at, 0)) * 16, 1))}
.track{position:absolute; left:0; right:0; top:50%; height:1px; background:#3a352f}
.beam{position:absolute; left:0; top:50%; height:2px; margin-top:-1px; width:calc(min(var(--p), 1) * 100%); background:#fff4dc; box-shadow:0 0 14px 3px rgba(255,226,170,.7), 0 0 40px 8px rgba(255,214,150,.22)}
.dot{width:14px; height:14px; border-radius:50%; box-sizing:border-box; border:1px solid #f4efe7; background:#f4efe7}
.tick{width:1px; height:10px; background:#8a8378}
.dia{width:9px; height:9px; transform:rotate(45deg); background:#a39082}
.at1{--at:0.003}
.at2{--at:0.080}
.at3{--at:0.157}
.at4{--at:0.234}
.at5{--at:0.311}
.at6{--at:0.388}
.at7{--at:0.465}
.at8{--at:0.542}
.at9{--at:0.619}
.at10{--at:0.696}
.at11{--at:0.773}
.at12{--at:0.850}
.at13{--at:0.927}
.ph1{--at:0.000}
.ph2{--at:0.221}
.ph3{--at:0.452}
.ph4{--at:0.682}
.ph5{--at:0.836}
@media (max-width: 760px){
  .pad{padding-left:22px !important; padding-right:22px !important}
  .inset{padding-left:0 !important}
}
@media (prefers-reduced-motion: reduce){
  .cta{transition:none}
}