/* =========================
   CV page (scoped)
   ========================= */
.cv-langbar{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:12px;
    margin-bottom:18px;
    padding-bottom:12px;
    border-bottom:1px solid var(--border);
}
.cv-langbar .cv-langlabel{
    font-size:0.85rem;
    opacity:0.85;
    user-select:none;
}
.cv-switch{
    position:relative;
    width:56px;
    height:28px;
    display:inline-block;
}
.cv-switch input{
    opacity:0;
    width:0;
    height:0;
}
.cv-slider{
    position:absolute;
    inset:0;
    background:#333;
    border:1px solid var(--border);
    border-radius:999px;
    cursor:pointer;
    transition:0.2s ease;
}
.cv-slider:before{
    content:"";
    position:absolute;
    height:22px;
    width:22px;
    left:3px;
    top:50%;
    transform:translateY(-50%);
    background:var(--text);
    border-radius:50%;
    transition:0.2s ease;
}
.cv-switch input:checked + .cv-slider{
    background: rgba(93,169,221,0.25);
    border-color: rgba(93,169,221,0.6);
}
.cv-switch input:checked + .cv-slider:before{
    transform:translate(28px,-50%);
}

.cv-lang{ display:none; }
.cv-lang.is-active{ display:block; }

/* Card layout inside the about-card */
.cv-title{
    margin: 0 0 14px 0;
    text-align:center;
}
/* Card grid: 3 columns */
.cv-grid{
    display:grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap:14px;
    margin-top:14px;
}
.cv-section{
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 18px;
}    align-self: stretch;
}
.cv-section h2{
    margin: 0 0 12px 0;
    font-size: 1.05rem;
    border-bottom: 1px solid var(--border);
    padding-bottom: 8px;
}
.cv-section p{ line-height:1.7; margin: 0 0 10px 0; }
.cv-section p:last-child{ margin-bottom:0; }

.cv-list{
    margin: 0;
    padding-left: 18px;
    line-height:1.7;
}
.cv-meta{
    margin-top: 4px;
    font-size:0.9rem;
    opacity:0.85;
    text-align:center;
}
/* Cards that should span multiple columns */
.cv-span-2{
    grid-column: span 2;
}

.cv-span-3{
    grid-column: span 3;
}
/* Keep it readable on narrow screens */
@media (max-width: 900px){
    }
@media (max-width: 1100px){
    .cv-grid{
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px){
    .cv-grid{
        grid-template-columns: 1fr;
    }
}