/* ARTISE 0.4 — spokojniejsza typografia i smuklejszy interfejs */
:root{
  --text-regular:400;
  --text-medium:500;
  --text-emphasis:600;
}

body{
  font-size:15px;
  line-height:1.6;
  font-weight:var(--text-regular);
  letter-spacing:-.006em;
}

strong,b{font-weight:var(--text-emphasis)}
h1,h2,h3,h4,h5,h6{font-weight:var(--text-medium)}

.sidebar{width:264px;padding:22px 15px}
.main{margin-left:264px}
.sidebar .logo{font-weight:var(--text-emphasis)}
.workspace{margin:25px 0 20px;padding:12px 13px}
.workspace small{font-size:10px;font-weight:var(--text-medium)}
.workspace strong{font-size:13px;font-weight:var(--text-medium)}
.nav-caption{margin:20px 12px 8px;font-size:10px;font-weight:var(--text-emphasis);letter-spacing:.15em}
.nav-link{
  min-height:42px;
  padding:0 12px;
  border-radius:10px;
  gap:11px;
  font-size:13.5px;
  font-weight:var(--text-medium);
  letter-spacing:0;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.nav-link:hover{background:rgba(248,243,224,.065);color:#fff}
.nav-link.active{background:var(--gold);color:var(--navy);font-weight:var(--text-emphasis);box-shadow:none}
.nav-icon{width:20px;font-size:15px;font-weight:var(--text-regular)}
.nav-parent{position:relative}
.nav-chevron{margin-left:auto;color:rgba(248,243,224,.38);font-size:15px;transition:transform .18s ease}
.nav-parent.active .nav-chevron{color:var(--navy)}
.nav-group.group-open .nav-chevron{transform:rotate(180deg)}
.nav-submenu{
  margin:3px 0 7px 20px;
  padding:3px 0 3px 13px;
  border-left:1px solid rgba(248,243,224,.14);
  display:grid;
  gap:2px;
}
.nav-sub-link{
  min-height:42px;
  padding:5px 9px;
  border-radius:8px;
  color:rgba(248,243,224,.58);
  font-size:12.5px;
  font-weight:var(--text-regular);
  line-height:1.25;
}
.nav-sub-link.active{background:rgba(233,182,74,.16);color:var(--gold);font-weight:var(--text-medium)}
.nav-step{
  width:24px;
  height:24px;
  border:1px solid rgba(248,243,224,.14);
  border-radius:7px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  font-size:9px;
  font-weight:var(--text-emphasis);
}
.nav-sub-link.active .nav-step{border-color:rgba(233,182,74,.45);background:rgba(233,182,74,.1)}
.nav-sub-link small{display:block;margin-top:2px;color:rgba(248,243,224,.34);font-size:9.5px;font-weight:var(--text-regular)}
.nav-sub-link.active small{color:rgba(233,182,74,.65)}
.user-card strong{font-weight:var(--text-medium)}
.logout-button{font-size:13px;font-weight:var(--text-medium)}

.content{width:min(1360px,calc(100% - 70px));padding-top:48px}
.page-heading{margin-bottom:27px}
.page-heading h1{font-size:38px;font-weight:450;letter-spacing:-.035em}
.page-heading p{font-size:15px;line-height:1.65}
.kicker,.page-heading .kicker{font-size:10.5px;font-weight:var(--text-emphasis);letter-spacing:.16em}

.content p,
.content input,
.content textarea,
.content select,
.academy-page input,
.academy-page textarea,
.academy-page select{font-size:14px}
.content small,
.content time,
.academy-page small{font-size:11px}
.content label,
.academy-page label{font-size:12.5px;font-weight:var(--text-medium)}
.form-field label{font-weight:var(--text-medium)}
.form-field input,.form-field textarea,.form-field select{min-height:47px;border-radius:10px}

.content button,
.content .primary-button,
.content .secondary-button,
.academy-page button,
.academy-page .primary-button,
.academy-page .secondary-button{
  min-height:42px;
  padding-left:16px;
  padding-right:16px;
  border-radius:10px;
  font-size:13px;
  font-weight:var(--text-emphasis);
  letter-spacing:-.01em;
}
.primary-button,.secondary-button{font-weight:var(--text-emphasis)}
.primary-button{box-shadow:0 5px 14px rgba(0,48,63,.1)}
.secondary-button{box-shadow:none}

.card{border-color:#e2e8e5;border-radius:16px;box-shadow:0 7px 22px rgba(0,35,46,.025)}
.card h2,.card h3,.panel h2,.studio-card h2{font-weight:var(--text-medium)}
.card strong,.metric strong{font-weight:var(--text-emphasis)}
.metric small,.status-pill{font-weight:var(--text-emphasis)}
.metric strong{font-size:32px}
.status-pill{letter-spacing:.01em}
th{font-weight:var(--text-emphasis)}

@media(max-width:780px){
  .sidebar{width:auto}
  .main{margin-left:0}
  .content{width:min(100% - 30px,1360px);padding-top:30px}
  .nav-submenu{margin-left:18px}
  .page-heading h1{font-size:31px}
}