/* Change Up — wspólne style */

/* Nawigacja */
.nav-link { color: #374151; font-weight: 500; transition: color 0.2s; text-decoration: none; }
.nav-link:hover, .nav-link.active { color: #086972; }

/* Ikony */
.icon-box { width:52px; height:52px; border-radius:12px; background:#E6F4F5; display:flex; align-items:center; justify-content:center; margin-bottom:1.25rem; flex-shrink:0; }
.icon-box img { width:26px; height:26px; }
.icon-box-dark { width:52px; height:52px; border-radius:12px; background:rgba(255,255,255,0.15); display:flex; align-items:center; justify-content:center; margin-bottom:1.25rem; flex-shrink:0; }
.icon-box-dark img { width:26px; height:26px; filter:brightness(0) invert(1); }

/* Karty */
.card { border:1px solid #f0f0f0; border-radius:16px; transition: box-shadow 0.2s, transform 0.2s; }
.card:hover { box-shadow: 0 8px 24px rgba(8,105,114,0.10); transform: translateY(-2px); }

/* Tagi */
.tag { display:inline-block; font-size:0.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; background:#E6F4F5; color:#086972; padding:0.25rem 0.65rem; border-radius:20px; }
.tag-dark { background:#086972; color:white; }
.tag-intense { background:#054E55; color:white; }

/* Timeline */
.timeline-item { border-left:2px solid #E6F4F5; padding-left:1.5rem; padding-bottom:2rem; position:relative; }
.timeline-item::before { content:''; position:absolute; left:-6px; top:6px; width:10px; height:10px; border-radius:50%; background:#086972; }

/* Fazy procesu */
.phase { border-left:3px solid #086972; padding-left:1.5rem; margin-bottom:2.5rem; }

/* Mobile menu */
#mobile-menu { display:none; }
#mobile-menu.open { display:block; }
