/* =========================================================
   VEDAS STUDIO · ESQUEMAS v2.1
   Sólo afecta a .esquemas-vedas
   ========================================================= */

.esquemas-vedas .esquema-seccion {
    --acento: #8b7b68;
    --acento-suave: rgba(139, 123, 104, 0.08);
}

.esquemas-vedas .esquema-seccion .contenido-seccion {
    position: relative;
}

.esquemas-vedas .esquema-seccion .contenido-seccion::before {
    content: "";
    position: absolute;
    left: -35px;
    top: 0.15em;
    bottom: 0.15em;
    width: 3px;
    background: var(--acento);
    opacity: 0.72;
}

.esquemas-vedas .esquema-ocre     { --acento: #a26f25; --acento-suave: rgba(162,111,37,.08); }
.esquemas-vedas .esquema-azul     { --acento: #376b8f; --acento-suave: rgba(55,107,143,.08); }
.esquemas-vedas .esquema-burdeos  { --acento: #7d3f4b; --acento-suave: rgba(125,63,75,.08); }
.esquemas-vedas .esquema-verde    { --acento: #5c7852; --acento-suave: rgba(92,120,82,.08); }
.esquemas-vedas .esquema-violeta  { --acento: #655784; --acento-suave: rgba(101,87,132,.08); }
.esquemas-vedas .esquema-cobre    { --acento: #9b5d37; --acento-suave: rgba(155,93,55,.08); }
.esquemas-vedas .esquema-turquesa { --acento: #3f7d78; --acento-suave: rgba(63,125,120,.08); }
.esquemas-vedas .esquema-gris     { --acento: #62686b; --acento-suave: rgba(98,104,107,.08); }
.esquemas-vedas .esquema-negro    { --acento: #343434; --acento-suave: rgba(52,52,52,.06); }

.esquemas-vedas .esquema-lineal,
.esquemas-vedas .esquema-proceso {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin: 30px 0 22px;
}

.esquemas-vedas .nodo {
    display: inline-block;
    padding: 9px 14px;
    border-bottom: 2px solid var(--acento);
    background: var(--acento-suave);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 19px;
}

.esquemas-vedas .nodo.destacado {
    font-weight: 700;
}

.esquemas-vedas .flecha {
    color: var(--acento);
    font-size: 23px;
}

.esquemas-vedas .nota-esquema {
    margin-top: 18px;
    padding-left: 16px;
    border-left: 1px solid var(--acento);
    font-size: 16px !important;
    opacity: 0.82;
}

.esquemas-vedas .esquema-tres,
.esquemas-vedas .esquema-estados,
.esquemas-vedas .esquema-cuerpos,
.esquemas-vedas .esquema-realidad {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    margin: 30px 0 22px;
}

.esquemas-vedas .esquema-tres > div,
.esquemas-vedas .esquema-estados > div,
.esquemas-vedas .esquema-cuerpos > div,
.esquemas-vedas .esquema-realidad > div {
    padding: 18px 0 14px;
    border-top: 3px solid var(--acento);
    border-bottom: 1px solid rgba(0,0,0,.12);
}

.esquemas-vedas .esquema-tres strong,
.esquemas-vedas .esquema-estados strong,
.esquemas-vedas .esquema-cuerpos strong,
.esquemas-vedas .esquema-realidad strong {
    display: block;
    margin-top: 5px;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 21px;
    font-weight: 500;
}

.esquemas-vedas .esquema-tres small,
.esquemas-vedas .esquema-estados span,
.esquemas-vedas .esquema-cuerpos small,
.esquemas-vedas .esquema-realidad span {
    display: block;
    margin-top: 5px;
    font-size: 14px;
    letter-spacing: .03em;
    opacity: .74;
}

.esquemas-vedas .mini-etiqueta {
    display: block;
    color: var(--acento);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .14em;
}

.esquemas-vedas .convergencia,
.esquemas-vedas .fundamento-atman,
.esquemas-vedas .base-turiya,
.esquemas-vedas .salida-moksha {
    margin: 18px 0 28px;
    padding: 15px 18px;
    border-top: 1px solid var(--acento);
    border-bottom: 1px solid var(--acento);
    text-align: center;
    background: var(--acento-suave);
}

.esquemas-vedas .convergencia span,
.esquemas-vedas .fundamento-atman span,
.esquemas-vedas .base-turiya span,
.esquemas-vedas .salida-moksha span {
    display: block;
    font-size: 13px;
    letter-spacing: .08em;
    text-transform: uppercase;
    opacity: .72;
}

.esquemas-vedas .convergencia strong,
.esquemas-vedas .fundamento-atman strong,
.esquemas-vedas .base-turiya strong,
.esquemas-vedas .salida-moksha strong {
    display: block;
    margin: 4px 0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 23px;
    font-weight: 500;
}

.esquemas-vedas .esquema-mahavakyas {
    margin: 30px 0 20px;
}

.esquemas-vedas .esquema-mahavakyas > div {
    display: grid;
    grid-template-columns: 150px minmax(220px, 1fr) minmax(180px, 1fr);
    gap: 20px;
    align-items: baseline;
    padding: 13px 0;
    border-bottom: 1px dotted rgba(0,0,0,.2);
}

.esquemas-vedas .esquema-mahavakyas > div:first-child {
    border-top: 1px dotted rgba(0,0,0,.2);
}

.esquemas-vedas .esquema-mahavakyas span {
    color: var(--acento);
    font-size: 14px;
    letter-spacing: .03em;
}

.esquemas-vedas .esquema-mahavakyas strong {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 20px;
    font-weight: 500;
}

.esquemas-vedas .esquema-mahavakyas small {
    font-size: 15px;
    opacity: .75;
}

.esquemas-vedas .esquema-kosas {
    display: flex;
    flex-direction: column;
    width: min(680px, 100%);
    margin: 30px 0 18px;
}

.esquemas-vedas .esquema-kosas span {
    display: block;
    padding: 12px 16px;
    border-top: 1px solid var(--acento);
    background: var(--acento-suave);
}

.esquemas-vedas .esquema-kosas span:nth-child(2) { margin-left: 5%; }
.esquemas-vedas .esquema-kosas span:nth-child(3) { margin-left: 10%; }
.esquemas-vedas .esquema-kosas span:nth-child(4) { margin-left: 15%; }
.esquemas-vedas .esquema-kosas span:nth-child(5) { margin-left: 20%; border-bottom: 1px solid var(--acento); }

.esquemas-vedas .linea-transversal {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    margin: 14px 0 24px;
    padding: 12px 0;
    border-top: 1px dotted var(--acento);
    border-bottom: 1px dotted var(--acento);
}

.esquemas-vedas .linea-transversal span {
    color: var(--acento);
    font-weight: 600;
}

@media (max-width: 760px) {

    .esquemas-vedas .esquema-seccion .contenido-seccion::before {
        display: none;
    }

    .esquemas-vedas .esquema-tres,
    .esquemas-vedas .esquema-estados,
    .esquemas-vedas .esquema-cuerpos,
    .esquemas-vedas .esquema-realidad {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .esquemas-vedas .esquema-mahavakyas > div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .esquemas-vedas .esquema-kosas span:nth-child(n) {
        margin-left: 0;
    }
}