/* extras.css - secțiunile: poziții, glosar, teste, provocări */
.ex-hero { padding: 2rem 0 1rem; }
.ex-hero h1 { font-family: 'Fraunces', serif; font-weight: 600; }
.ex-hero p.lead { color: #cbb6c2; max-width: 46rem; }

.ex-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.ex-card {
    display: block; padding: 1.1rem 1.2rem; border-radius: 14px;
    background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.09);
    color: inherit; text-decoration: none; transition: transform .15s, border-color .15s;
    height: 100%;
}
.ex-card:hover { transform: translateY(-2px); border-color: #F0447F; color: inherit; }
.ex-card h3, .ex-card h2 { font-size: 1.1rem; margin: 0 0 .4rem; }
.ex-card p { margin: 0; color: #cbb6c2; font-size: .93rem; }

.ex-badge {
    display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .04em;
    padding: .15rem .55rem; border-radius: 999px; background: rgba(240,68,127,.18); color: #ff8fb8;
    margin-right: .35rem;
}
.ex-badge.l1 { background: rgba(46,213,115,.15); color: #6ee7a0; }
.ex-badge.l2 { background: rgba(255,193,7,.15);  color: #ffd866; }
.ex-badge.l3 { background: rgba(240,68,127,.18); color: #ff8fb8; }

.ex-section { margin: 2rem 0; }
.ex-section h2 { font-family: 'Fraunces', serif; font-size: 1.5rem; margin-bottom: 1rem; }

.ex-article { max-width: 46rem; }
.ex-article h2 { font-size: 1.25rem; margin-top: 1.6rem; }
.ex-article p { line-height: 1.7; }

.ex-note {
    border-left: 3px solid #F0447F; background: rgba(240,68,127,.07);
    padding: .8rem 1rem; border-radius: 0 10px 10px 0; font-size: .92rem; margin: 1.5rem 0;
}

.ex-az { display: flex; flex-wrap: wrap; gap: .4rem; margin: 1rem 0; }
.ex-az a { padding: .2rem .6rem; border-radius: 8px; background: rgba(255,255,255,.06); text-decoration: none; }

/* Quiz */
.quiz-wrap { max-width: 42rem; margin: 0 auto; }
.quiz-progress { height: 6px; border-radius: 999px; background: rgba(255,255,255,.1); overflow: hidden; margin-bottom: 1.2rem; }
.quiz-progress > div { height: 100%; width: 0; background: linear-gradient(90deg,#F0447F,#ffb347); transition: width .25s; }
.quiz-q { font-size: 1.25rem; font-weight: 600; margin-bottom: 1rem; }
.quiz-opt {
    display: block; width: 100%; text-align: left; padding: .85rem 1rem; margin-bottom: .6rem;
    border-radius: 12px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.04);
    color: inherit; cursor: pointer; transition: border-color .15s, background .15s;
}
.quiz-opt:hover, .quiz-opt:focus-visible { border-color: #F0447F; background: rgba(240,68,127,.08); outline: none; }
.quiz-result { text-align: center; padding: 1.5rem 0; }
.quiz-result h2 { font-family: 'Fraunces', serif; font-size: 2rem; }
.quiz-result p { max-width: 34rem; margin: 1rem auto; line-height: 1.7; }

/* Provocări */
.chal-box {
    min-height: 9rem; display: flex; align-items: center; justify-content: center; text-align: center;
    padding: 1.5rem; border-radius: 18px; border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.04); font-size: 1.3rem; line-height: 1.5; margin: 1rem 0;
}
.chal-cats { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .5rem; }
.chal-cats button { border: 1px solid rgba(255,255,255,.15); background: transparent; color: inherit; padding: .3rem .8rem; border-radius: 999px; }
.chal-cats button.active { background: #F0447F; color: #1a1220; border-color: #F0447F; }

.thirty-list { list-style: none; padding: 0; counter-reset: d; display: grid; gap: .6rem; }
.thirty-list li {
    counter-increment: d; display: flex; gap: .8rem; align-items: center; padding: .7rem 1rem;
    border-radius: 12px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08);
}
.thirty-list li::before { content: counter(d); font-weight: 800; color: #F0447F; min-width: 1.8rem; text-align: center; }
.thirty-list li.done { opacity: .55; text-decoration: line-through; }
.thirty-list input { accent-color: #F0447F; width: 1.15rem; height: 1.15rem; }