.cdl-dancer-nav-v41b {
margin: 0 0 1.25rem;
max-width: 800px;
}
.cdl-dancer-nav-v41b__cards {
display: flex;
flex-wrap: wrap;
gap: 0.4rem 0.5rem;
margin: 0;
padding: 0;
}
.cdl-dancer-nav-v41b__card {
margin: 0;
flex: 1 1 auto;
min-width: 0;
}
.cdl-dancer-nav-v41b__link {
display: flex;
align-items: center;
justify-content: center;
gap: 0.35rem;
width: 100%;
min-height: 2.75rem;
padding: 0.45rem 0.65rem;
font-size: 0.82rem;
font-weight: 600;
line-height: 1.25;
text-align: center;
text-decoration: none;
color: #2c2824;
background: #f7f5f1;
border: 1px solid #e4dfd6;
border-radius: 8px;
box-sizing: border-box;
}
.cdl-dancer-nav-v41b__link:hover,
.cdl-dancer-nav-v41b__link:focus-visible {
color: #1b4332;
border-color: #2d6a4f;
background: #eef6f1;
outline: 2px solid #2d6a4f;
outline-offset: 2px;
}
.cdl-dancer-nav-v41b__link.is-current {
color: #fff;
background: #2d6a4f;
border-color: #2d6a4f;
cursor: default;
}
.cdl-dancer-nav-v41b__icon {
flex-shrink: 0;
font-size: 1rem;
line-height: 1;
}
.cdl-dancer-nav-v41b__text {
hyphens: auto;
word-break: break-word;
}
.cdl-dancer-hub-v41b {
margin: 0 0 1.25rem;
padding: 1rem 1.15rem;
border-radius: 10px;
border: 1px solid #d4e8dc;
background: linear-gradient(135deg, #f4faf6 0%, #eef6f1 100%);
max-width: 720px;
}
.cdl-dancer-hub-v41b__title {
margin: 0 0 0.45rem;
font-size: 1.1rem;
font-weight: 700;
color: #1b4332;
}
.cdl-dancer-hub-v41b__lead {
margin: 0 0 0.5rem;
font-size: 0.92rem;
color: #4a4540;
}
.cdl-dancer-hub-v41b__benefits {
margin: 0 0 0.85rem;
padding-left: 1.2rem;
font-size: 0.88rem;
line-height: 1.45;
color: #4a4540;
}
.cdl-dancer-hub-v41b__actions {
margin: 0;
}
.cdl-dancer-hub-v41b__cta {
display: inline-block;
font-size: 0.9rem;
font-weight: 600;
text-decoration: none;
color: #fff;
background: #2d6a4f;
padding: 0.5rem 1rem;
border-radius: 6px;
}
.cdl-dancer-hub-v41b__cta:hover,
.cdl-dancer-hub-v41b__cta:focus-visible {
background: #245a42;
color: #fff;
outline: 2px solid #1b4332;
outline-offset: 2px;
}
.cdl-learning-dashboard .cdl-dancer-nav-v41b,
.cdl-dancer-profile .cdl-dancer-nav-v41b {
margin-top: 0.5rem;
}
@media (max-width: 768px) {
.cdl-dancer-nav-v41b__list {
flex-wrap: nowrap;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
padding-bottom: 0.15rem;
scrollbar-width: thin;
}
.cdl-dancer-nav-v41b__item {
flex: 0 0 auto;
min-width: 7.5rem;
max-width: 48%;
}
.cdl-dancer-nav-v41b__link {
font-size: 0.78rem;
padding: 0.4rem 0.5rem;
}
}
@media (max-width: 430px) {
.cdl-dancer-nav-v41b__item {
min-width: 6.75rem;
}
.cdl-dancer-nav-v41b__text {
font-size: 0.76rem;
}
.cdl-dancer-hub-v41b {
padding: 0.85rem 0.95rem;
}
.cdl-dancer-hub-v41b__cta {
display: block;
width: 100%;
text-align: center;
box-sizing: border-box;
}
}
@media (max-width: 390px) {
.cdl-dancer-nav-v41b__item {
min-width: 6.25rem;
}
.cdl-dancer-nav-v41b__icon {
font-size: 0.9rem;
}
}