/* Co-Virtue: concentric forms, shared attention, generous reading space. */
:root, .cv-atelier {
    --cv-brand-carbon: #1A1412;
    --cv-brand-marfil: #E8E2DB;
    --cv-brand-cobre: #B66B3A;
    --cv-brand-taupe: #A69686;
    --cv-brand-gris: #22262B;
    --cv-brand-llama: #FF6A00;
    --cv-brand-dorada: #E1B24C;
    --cv-brand-sabio: #6E7F6A;
    --cv-brand-azul: #36506A;
    --cv-clay: #bb754e;
    --cv-ochre: #d2a66a;
    --cv-moss: #79846b;
    --cv-gutter: clamp(24px, 4vw, 72px);
}
.cv-atelier .nav-container { max-width: 1520px; padding-inline: var(--cv-gutter); }
.cv-atelier .hero { isolation: isolate; padding-block: clamp(120px, 9vw, 150px) 88px; }
.cv-atelier .hero-inner { width: 100%; max-width: 1520px; margin-inline: auto; }
.cv-atelier .hero-inner > * { max-width: min(100%, 720px); }
.cv-atelier .hero-inner .hero-logo-img { width: min(360px, 100%); }
.cv-atelier .hero-sub { text-wrap: balance; }
.cv-atelier .hero-lede { max-width: 52ch; }
.cv-atelier .hero::before {
    z-index: 1;
    background:
        radial-gradient(circle at 78% 26%, rgba(224,138,82,.22), transparent 30%),
        linear-gradient(90deg, rgba(18,12,10,.96) 0%, rgba(18,12,10,.86) 38%, rgba(18,12,10,.42) 72%, rgba(18,12,10,.24) 100%);
}
.cv-atelier #ambient-glow-container { display: block; }
.cv-atelier section { position: relative; overflow: hidden; padding-block: clamp(72px, 7vw, 112px); }
.cv-atelier section > .wrap { transform: none !important; opacity: 1 !important; will-change: auto; }
.cv-atelier .lede { max-width: 65ch; }
.cv-atelier .sec-title { text-wrap: balance; }
.cv-atelier .grid-3 {
    gap: clamp(20px, 2.5vw, 32px) !important;
    border-top: 0 !important;
}
.cv-atelier .k-card,
.cv-atelier .grid-3 > .k-card {
    position: relative;
    padding: clamp(32px, 3.2vw, 44px) clamp(24px, 2.4vw, 34px) !important;
    border: 1px solid rgba(225, 216, 202, 0.12) !important;
    border-radius: 20px 8px 20px 8px !important;
    background: rgba(28, 20, 18, 0.6) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 10px 28px -10px rgba(0, 0, 0, 0.35);
    transition: transform 380ms cubic-bezier(0.16, 1, 0.3, 1),
                border-color 380ms ease,
                box-shadow 380ms ease,
                background 380ms ease;
}
.cv-atelier .grid-3 > .k-card:nth-child(3n + 2) {
    border-inline: 1px solid rgba(225, 216, 202, 0.12) !important;
}
.cv-atelier .grid-3 > .k-card:hover,
.cv-atelier .k-card:hover {
    transform: translateY(-5px);
    border-color: rgba(224, 138, 82, 0.45) !important;
    background: rgba(36, 24, 22, 0.78) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1),
                0 20px 40px -12px rgba(0, 0, 0, 0.5),
                0 0 24px rgba(224, 138, 82, 0.14) !important;
}
.cv-atelier .grid-3 > .k-card h4 {
    font-size: clamp(22px, 2.2vw, 26px) !important;
    line-height: 1.2;
    max-width: 24ch;
    margin-bottom: 16px !important;
}
.cv-atelier .k-name { color: var(--text-primary); }
.cv-atelier .k-desc { color: var(--text-secondary); }
.cv-atelier .hero .btn { min-height: 48px; }
.cv-atelier table { line-height: 1.6; border-inline: 0 !important; }
.cv-atelier th { padding: 22px 20px !important; font-size: 12px !important; letter-spacing: .09em; }
.cv-atelier td { padding: 24px 20px !important; }
.cv-atelier td:first-child { font-family: var(--serif); font-size: 20px; }
.cv-atelier .faq { border-inline: 0 !important; border-top: 0 !important; border-radius: 0 !important; background: transparent !important; padding: 25px 0 !important; }
.cv-atelier .faq[open] { padding-bottom: 32px !important; }
.cv-atelier .faq p { max-width: 70ch; }
.cv-atelier .step-list { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 28px; padding-top: 28px; }
.cv-atelier .step-list li { padding: 64px 0 0; border-top: 1px solid var(--border-color); }
.cv-atelier .step-list li::before { top: 18px; background: transparent; color: var(--accent-ember); font: 30px var(--serif); justify-content: flex-start; }
.cv-atelier .step-list b { font: 25px/1.2 var(--serif); margin-bottom: 18px; }
.cv-investment { padding: clamp(28px,5vw,64px) !important; background: var(--bg-page-alt) !important; border-radius: 80px 4px 4px 4px !important; }
.cv-investment > div:first-child { font-size: clamp(44px,5.5vw,78px) !important; font-weight: 400 !important; }
.cv-atelier tbody tr { transition: background-color 180ms ease; }
.cv-atelier tbody tr:hover { background: rgba(187, 117, 78, .08); }
.cv-atelier .circle-interactive-layout { gap: clamp(32px, 5vw, 80px) !important; }
.cv-atelier .interactive-circle-svg { max-width: 500px !important; }
.cv-atelier .interactive-circle-svg .node-circle { transition: fill 240ms, stroke 240ms, r 240ms; }
.cv-atelier .interactive-circle-svg .role-node.active .node-circle { fill: var(--bg-page-alt); }
.cv-atelier #circle-role-display-card { border-radius: 0; border-inline: 0; padding-block: 44px !important; background: transparent; }
.cv-atelier .central-logos-candle { animation: logoFirePulse 3.8s ease-in-out infinite; }
.cv-atelier #logos-candle { filter: drop-shadow(0 0 8px rgba(224,138,82,.28)); }
.cv-atelier #logos-candle.active { filter: drop-shadow(0 0 14px rgba(224,138,82,.58)); }
.cv-orbit-engraving { color: var(--cv-clay); opacity: .4; pointer-events: none; transform: rotate(var(--role-angle, 0deg)); transform-origin: 0 0; transition: transform 800ms ease; }
.cv-atelier .circle-attention { transition-duration: 800ms; }
.cv-atelier :focus-visible { outline: 2px solid var(--accent-ember); outline-offset: 5px; }

.cv-section-image { width: 100%; max-height: 560px; object-fit: cover; border-radius: 24px 24px 6px 6px; margin-block: 32px; }

/* The attention thread: brand-specific atmospheric gesture with boho geometry */
.cv-attention-thread {
    position: fixed;
    z-index: 12;
    top: 6vh;
    right: clamp(14px, 3.2vw, 56px);
    width: clamp(72px, 7vw, 110px);
    height: 88vh;
    color: rgba(192, 151, 105, .32);
    pointer-events: none;
    transform: translate3d(0,0,0);
    will-change: transform;
}
.cv-attention-thread svg,
.cv-attention-thread canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.cv-attention-thread svg {
    overflow: visible;
}
.cv-attention-thread path {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.15;
    vector-effect: non-scaling-stroke;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.cv-attention-thread .cv-thread-main {
    opacity: 0.95;
    stroke: #d4a373;
    filter: drop-shadow(0 0 3px rgba(212, 163, 115, 0.3));
}
.cv-attention-thread .cv-thread-echo {
    opacity: .32;
    transform: translateX(7px);
    stroke: #7fa69b;
}
.cv-attention-thread .cv-thread-node {
    fill: #e08a52;
    stroke: #f8cfab;
    stroke-width: 0.8;
    filter: drop-shadow(0 0 8px rgba(224, 138, 82, 0.85));
}
.cv-thread-dust {
    opacity: .8;
}

/* ==========================================================================
   Editorial Scroll Conductors (The Lectern & Boho Inspired In-Page Flow)
   ========================================================================== */

.cv-conductor-svg {
    position: absolute;
    pointer-events: none;
    z-index: 1;
    overflow: visible;
}

.cv-conductor-hero {
    top: 10%;
    right: clamp(16px, 4vw, 72px);
    width: min(44vw, 480px);
    height: min(72vh, 600px);
    opacity: 0.9;
}

.cv-conductor-sec0 {
    top: 12%;
    left: clamp(12px, 2.8vw, 44px);
    width: 60px;
    height: 72%;
    opacity: 0.7;
}

.cv-step-conductor-wrap {
    position: relative;
    width: 100%;
    height: 52px;
    margin-bottom: -12px;
    pointer-events: none;
    z-index: 2;
    overflow: visible;
}

.cv-step-conductor-svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

.cv-conductor-investment {
    bottom: 8%;
    right: clamp(16px, 3.5vw, 60px);
    width: clamp(180px, 20vw, 260px);
    height: clamp(180px, 20vw, 260px);
    opacity: 0.6;
}

.cv-conductor-path-main {
    fill: none;
    stroke: #d4a373;
    stroke-width: 1.25;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
    filter: drop-shadow(0 0 4px rgba(212, 163, 115, 0.3));
    transition: stroke-dashoffset 40ms linear;
}

.cv-conductor-path-echo {
    fill: none;
    stroke: #7fa69b;
    stroke-width: 0.85;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
    opacity: 0.4;
    transition: stroke-dashoffset 40ms linear;
}

.cv-conductor-node {
    fill: #e08a52;
    stroke: #f8cfab;
    stroke-width: 0.8;
    filter: drop-shadow(0 0 8px rgba(224, 138, 82, 0.85));
    transition: opacity 200ms ease;
}

.cv-step-node {
    fill: rgba(225, 216, 202, 0.2);
    stroke: rgba(225, 216, 202, 0.4);
    stroke-width: 1;
    transition: fill 320ms ease, stroke 320ms ease, filter 320ms ease, transform 320ms ease;
}

.cv-step-node.active {
    fill: #e08a52;
    stroke: #f8cfab;
    filter: drop-shadow(0 0 8px rgba(224, 138, 82, 0.9));
    transform-origin: center;
}

[data-theme="light"] .cv-conductor-path-main { stroke: #a14f22; }
[data-theme="light"] .cv-conductor-path-echo { stroke: #4f736a; }
[data-theme="light"] .cv-conductor-node { fill: #a14f22; stroke: #f8cfab; }
[data-theme="light"] .cv-step-node.active { fill: #a14f22; stroke: #f8cfab; }

@media (max-width: 760px) {
    .cv-conductor-hero { display: none; }
    .cv-conductor-sec0 { display: none; }
    .cv-step-conductor-wrap { display: none; }
    .cv-conductor-investment { display: none; }
}

/* ==========================================================================
   Interactive Virtue Lenses Viewer ("El Visor de Virtudes")
   ========================================================================== */

.cv-virtue-section {
    position: relative;
    overflow: hidden;
}

.cv-virtue-wrap {
    display: grid;
    grid-template-columns: 1fr;
    gap: 36px;
    align-items: start;
}

@media (min-width: 992px) {
    .cv-virtue-wrap {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
        column-gap: clamp(40px, 5.5vw, 84px);
    }
}

.cv-virtue-narrative {
    display: flex;
    flex-direction: column;
}

.cv-decision-premise {
    margin-top: 16px;
    padding: 20px 24px;
    border-radius: 14px;
    background: rgba(225, 216, 202, 0.04);
    border: 1px solid rgba(225, 216, 202, 0.12);
    border-left: 3px solid var(--accent-ember);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.cv-virtue-console {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* 4 Circular Virtue Tokens */
.cv-virtue-nav {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.cv-virtue-circle-btn {
    background: rgba(225, 216, 202, 0.03);
    border: 1px solid rgba(225, 216, 202, 0.1);
    border-radius: 16px;
    padding: 14px 8px 12px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    transition: all 300ms cubic-bezier(0.16, 1, 0.3, 1);
    outline: none;
    position: relative;
}

.cv-virtue-circle-btn:focus-visible {
    outline: 2px solid var(--accent-ember);
    outline-offset: 2px;
}

.cv-circle-orb {
    position: relative;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cv-circle-svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

.cv-orb-orbit {
    fill: none;
    stroke: rgba(225, 216, 202, 0.22);
    stroke-width: 1.2;
    stroke-dasharray: 4 4;
    transition: all 320ms ease;
}

.cv-orb-ring {
    fill: rgba(24, 16, 14, 0.85);
    stroke: rgba(225, 216, 202, 0.3);
    stroke-width: 1.2;
    transition: all 320ms ease;
}

.cv-orb-core {
    fill: rgba(225, 216, 202, 0.4);
    transition: all 320ms ease;
}

.cv-virtue-name {
    font-family: var(--serif);
    font-size: clamp(14px, 1.2vw, 16px);
    color: var(--text-secondary);
    transition: color 280ms ease;
}

.cv-virtue-circle-btn:hover {
    transform: translateY(-3px);
    border-color: rgba(224, 138, 82, 0.35);
    background: rgba(225, 216, 202, 0.06);
}

.cv-virtue-circle-btn:hover .cv-orb-orbit {
    stroke: rgba(224, 138, 82, 0.6);
}

.cv-virtue-circle-btn:hover .cv-orb-core {
    fill: var(--accent-ember);
    filter: drop-shadow(0 0 6px rgba(224, 138, 82, 0.6));
}

.cv-virtue-circle-btn:hover .cv-virtue-name {
    color: var(--text-primary);
}

.cv-virtue-circle-btn.active {
    background: rgba(224, 138, 82, 0.1);
    border-color: rgba(224, 138, 82, 0.55);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 24px -6px rgba(0, 0, 0, 0.4);
}

.cv-virtue-circle-btn.active .cv-orb-orbit {
    stroke: var(--accent-ember);
    stroke-dasharray: none;
    filter: drop-shadow(0 0 4px rgba(224, 138, 82, 0.5));
}

.cv-virtue-circle-btn.active .cv-orb-ring {
    fill: rgba(224, 138, 82, 0.2);
    stroke: var(--accent-ember);
    stroke-width: 1.6;
}

.cv-virtue-circle-btn.active .cv-orb-core {
    fill: var(--accent-ember);
    filter: drop-shadow(0 0 10px rgba(224, 138, 82, 0.9));
}

.cv-virtue-circle-btn.active .cv-virtue-name {
    color: var(--accent-ember);
    font-weight: 600;
}

/* El Visor (Display Deck) */
.cv-virtue-display-deck {
    position: relative;
    border-radius: 20px 8px 20px 8px;
    background: rgba(28, 20, 18, 0.85);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(225, 216, 202, 0.14);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 20px 40px -15px rgba(0, 0, 0, 0.45);
    padding: clamp(28px, 3.2vw, 38px);
    min-height: 290px;
}

.cv-virtue-panel {
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 280ms ease, transform 280ms cubic-bezier(0.16, 1, 0.3, 1);
}

.cv-virtue-panel.active {
    opacity: 1;
    transform: translateY(0);
}

.cv-panel-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 22px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(225, 216, 202, 0.1);
}

.cv-panel-badge {
    font-family: var(--sans);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--accent-ember);
    background: rgba(224, 138, 82, 0.14);
    padding: 4px 10px;
    border-radius: 12px;
    font-weight: 600;
}

.cv-panel-title {
    font-family: var(--serif);
    font-size: clamp(26px, 2.5vw, 32px);
    color: var(--text-primary);
    margin: 0;
    font-weight: 400;
    line-height: 1.15;
}

.cv-panel-label {
    font-family: var(--sans);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--accent-ember);
    margin-bottom: 10px;
    font-weight: 600;
}

.cv-panel-question {
    font-family: var(--serif);
    font-size: clamp(18px, 1.8vw, 22px);
    line-height: 1.45;
    color: var(--text-primary);
    margin: 0 0 24px 0;
    font-style: italic;
}

.cv-panel-surface-block {
    padding: 16px 20px;
    border-radius: 12px;
    background: rgba(225, 216, 202, 0.035);
    border: 1px solid rgba(225, 216, 202, 0.08);
    border-left: 3px solid #7fa69b;
}

.cv-panel-surface-block .cv-panel-label {
    color: #7fa69b;
}

.cv-panel-surface {
    font-size: 17px;
    line-height: 1.5;
    color: var(--cream);
    margin: 0;
}

.cv-virtue-footer {
    margin-top: 6px;
}

/* ==========================================================================
   Co-Virtue Site-Wide Brand Color Palette System
   ========================================================================== */

/* 1. Global Buttons & Action Elements */
.cv-atelier .btn,
.cv-atelier .btn-primary {
    background: linear-gradient(135deg, #B66B3A 0%, #C1502E 50%, #FF6A00 100%) !important;
    color: #FFFFFF !important;
    border: none !important;
    box-shadow: 0 8px 24px -6px rgba(182, 107, 58, 0.45) !important;
    transition: transform 0.25s ease, box-shadow 0.25s ease !important;
    font-weight: 600;
}
.cv-atelier .btn:hover,
.cv-atelier .btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 30px -4px rgba(255, 106, 0, 0.55) !important;
}

/* 2. Hero Atmospheric Aura & Eyebrow */
.cv-atelier .hero .eyebrow {
    color: #E1B24C !important;
    text-shadow: 0 0 16px rgba(225, 178, 76, 0.3);
}
.cv-atelier .hero::before {
    background:
        radial-gradient(circle at 75% 25%, rgba(255, 106, 0, 0.18), transparent 32%),
        radial-gradient(circle at 35% 65%, rgba(182, 107, 58, 0.14), transparent 40%),
        linear-gradient(90deg, rgba(26, 20, 18, 0.96) 0%, rgba(26, 20, 18, 0.86) 38%, rgba(26, 20, 18, 0.45) 75%, rgba(26, 20, 18, 0.25) 100%) !important;
}

/* 3. Section Eyebrows Thematic Nuance */
.cv-atelier section:nth-of-type(1) .eyebrow {
    color: #E1B24C !important; /* Luz Dorada: Why capable teams get stuck */
}
.cv-atelier .cv-virtue-section .eyebrow,
.cv-atelier section:nth-of-type(2) .eyebrow {
    color: #6E7F6A !important; /* Verde Sabio: How it works / Virtues */
}
.cv-atelier section:nth-of-type(3) .eyebrow {
    color: #36506A !important; /* Azul Sereno: How engagement is structured */
}
.cv-atelier section:nth-of-type(4) .eyebrow {
    color: #A69686 !important; /* Taupe Natural: What we do and do not do */
}
.cv-atelier section:nth-of-type(5) .eyebrow {
    color: #E1B24C !important; /* Luz Dorada: Sovereign role of attention */
}
.cv-atelier section:nth-of-type(6) .eyebrow {
    color: #B66B3A !important; /* Cobre Virtue: Practice in reality */
}
.cv-atelier section:nth-of-type(7) .eyebrow {
    color: #B66B3A !important; /* Cobre Virtue: Terms */
}
.cv-atelier #contact .eyebrow,
.cv-atelier #reserve .eyebrow {
    color: #FF6A00 !important; /* Llama: Reserve a conversation */
}

/* 4. Numbered Process Steps (01, 02, 03, 04) */
.cv-atelier .step-list li:nth-child(1) {
    border-top: 2px solid #B66B3A !important;
}
.cv-atelier .step-list li:nth-child(1)::before {
    color: #B66B3A !important;
}
.cv-atelier .step-list li:nth-child(2) {
    border-top: 2px solid #6E7F6A !important;
}
.cv-atelier .step-list li:nth-child(2)::before {
    color: #6E7F6A !important;
}
.cv-atelier .step-list li:nth-child(3) {
    border-top: 2px solid #36506A !important;
}
.cv-atelier .step-list li:nth-child(3)::before {
    color: #36506A !important;
}
.cv-atelier .step-list li:nth-child(4) {
    border-top: 2px solid #E1B24C !important;
}
.cv-atelier .step-list li:nth-child(4)::before {
    color: #E1B24C !important;
}

/* 5. The Sovereign Role of Attention - 3 Distinct Brand Cards */
.cv-atelier .grid-3 > .k-card:nth-child(1) {
    border-top: 3px solid #B66B3A !important;
}
.cv-atelier .grid-3 > .k-card:nth-child(1):hover {
    border-color: #B66B3A !important;
    box-shadow: 0 16px 36px -10px rgba(182, 107, 58, 0.28), 0 0 20px rgba(182, 107, 58, 0.15) !important;
}
.cv-atelier .grid-3 > .k-card:nth-child(2) {
    border-top: 3px solid #36506A !important;
}
.cv-atelier .grid-3 > .k-card:nth-child(2):hover {
    border-color: #36506A !important;
    box-shadow: 0 16px 36px -10px rgba(54, 80, 106, 0.28), 0 0 20px rgba(54, 80, 106, 0.15) !important;
}
.cv-atelier .grid-3 > .k-card:nth-child(3) {
    border-top: 3px solid #E1B24C !important;
}
.cv-atelier .grid-3 > .k-card:nth-child(3):hover {
    border-color: #E1B24C !important;
    box-shadow: 0 16px 36px -10px rgba(225, 178, 76, 0.28), 0 0 20px rgba(225, 178, 76, 0.15) !important;
}

/* 6. Two-Column "What we do / What we do not do" */
.cv-atelier .wrap-narrow > div[style*="display: grid; grid-template-columns: 1fr 1fr"] > div:first-child,
.cv-atelier .grid-2-alt > div:first-child {
    border-left: 3px solid #6E7F6A !important;
}
.cv-atelier .wrap-narrow > div[style*="display: grid; grid-template-columns: 1fr 1fr"] > div:last-child,
.cv-atelier .grid-2-alt > div:last-child {
    border-left: 3px solid #A69686 !important;
}

/* 7. Investment Terms Luxury Card */
.cv-investment {
    border: 1px solid rgba(182, 107, 58, 0.35) !important;
    box-shadow: 0 20px 48px -12px rgba(182, 107, 58, 0.15), inset 0 1px 0 rgba(225, 178, 76, 0.15) !important;
}
.cv-investment > div:first-child {
    color: #E1B24C !important;
    text-shadow: 0 0 24px rgba(225, 178, 76, 0.25);
}

/* 8. Socratic Circle & Virtues (Brand Manual Colors) */
.role-node[data-virtue="justice"],
.cv-virtue-circle-btn[data-virtue="justice"] {
    --virtue-color: #36506A;
}
.role-node[data-virtue="temperance"],
.cv-virtue-circle-btn[data-virtue="temperance"] {
    --virtue-color: #6E7F6A;
}
.role-node[data-virtue="courage"],
.cv-virtue-circle-btn[data-virtue="courage"] {
    --virtue-color: #B66B3A;
}
.role-node[data-virtue="wisdom"],
.cv-virtue-circle-btn[data-virtue="wisdom"] {
    --virtue-color: #E1B24C;
}

/* 9. Navigation Active State */
.nav-links a.active,
.nav-links a:hover {
    color: #B66B3A !important;
}

/* ==========================================================================
   Co-Virtue Interactive Organic Boho Cards (Where it helps / Dónde ayuda)
   ========================================================================== */
.cv-flip-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(24px, 3vw, 40px);
    margin-top: 40px;
    margin-bottom: 32px;
}

.cv-flip-card {
    background-color: transparent;
    perspective: 1200px;
    height: 350px;
    cursor: pointer;
    outline: none;
    position: relative;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.cv-flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    transition: transform 650ms cubic-bezier(0.2, 0.85, 0.32, 1.15);
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
}

/* Flipped state (activated by click/tap on touch, tablet, and desktop) */
.cv-flip-card.flipped .cv-flip-card-inner {
    transform: rotateY(180deg);
}

/* Desktop pointer hover only (NEVER sticky on tablet / touch) */
@media (hover: hover) and (pointer: fine) {
    .cv-flip-card:hover {
        transform: translateY(-6px);
    }
    .cv-flip-card:hover .cv-flip-card-inner {
        transform: rotateY(180deg);
    }
}

.cv-flip-front,
.cv-flip-back {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    padding: clamp(34px, 3.2vw, 44px) clamp(28px, 2.8vw, 38px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    overflow: hidden;
    box-sizing: border-box;
    transition: border-color 0.4s ease, box-shadow 0.4s ease, background 0.4s ease, border-radius 0.6s ease;
}

.cv-flip-front {
    pointer-events: auto;
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
}

.cv-flip-card.flipped .cv-flip-front {
    pointer-events: none;
}

.cv-flip-back {
    pointer-events: none;
    transform: rotateY(180deg) translate3d(0, 0, 1px);
    -webkit-transform: rotateY(180deg) translate3d(0, 0, 1px);
}

.cv-flip-card.flipped .cv-flip-back {
    pointer-events: auto;
}

/* 6 Distinct Boho Organic Shapes (8-Value Asymmetric Border-Radii) */
.cv-theme-cobre {
    --card-accent: #B66B3A;
    --card-accent-rgb: 182, 107, 58;
    border-radius: 68% 32% 58% 42% / 44% 56% 44% 56%;
}
.cv-theme-cobre.flipped {
    border-radius: 60% 40% 50% 50% / 50% 50% 50% 50%;
}

.cv-theme-sabio {
    --card-accent: #6E7F6A;
    --card-accent-rgb: 110, 127, 106;
    border-radius: 42% 58% 40% 60% / 60% 38% 62% 40%;
}
.cv-theme-sabio.flipped {
    border-radius: 50% 50% 48% 52% / 52% 48% 54% 46%;
}

.cv-theme-azul {
    --card-accent: #36506A;
    --card-accent-rgb: 54, 80, 106;
    border-radius: 56% 44% 36% 64% / 58% 54% 46% 42%;
}
.cv-theme-azul.flipped {
    border-radius: 50% 50% 42% 58% / 52% 50% 50% 48%;
}

.cv-theme-dorada {
    --card-accent: #E1B24C;
    --card-accent-rgb: 225, 178, 76;
    border-radius: 38% 62% 56% 44% / 52% 42% 58% 48%;
}
.cv-theme-dorada.flipped {
    border-radius: 46% 54% 52% 48% / 48% 48% 52% 52%;
}

.cv-theme-llama {
    --card-accent: #FF6A00;
    --card-accent-rgb: 255, 106, 0;
    border-radius: 64% 36% 44% 56% / 42% 64% 36% 58%;
}
.cv-theme-llama.flipped {
    border-radius: 56% 44% 48% 52% / 46% 58% 42% 54%;
}

.cv-theme-taupe {
    --card-accent: #A69686;
    --card-accent-rgb: 166, 150, 134;
    border-radius: 46% 54% 60% 40% / 56% 44% 56% 44%;
}
.cv-theme-taupe.flipped {
    border-radius: 52% 48% 54% 46% / 50% 50% 50% 50%;
}

@media (hover: hover) and (pointer: fine) {
    .cv-theme-cobre:hover {
        border-radius: 60% 40% 50% 50% / 50% 50% 50% 50%;
    }
    .cv-theme-sabio:hover {
        border-radius: 50% 50% 48% 52% / 52% 48% 54% 46%;
    }
    .cv-theme-azul:hover {
        border-radius: 50% 50% 42% 58% / 52% 50% 50% 48%;
    }
    .cv-theme-dorada:hover {
        border-radius: 46% 54% 52% 48% / 48% 48% 52% 52%;
    }
    .cv-theme-llama:hover {
        border-radius: 56% 44% 48% 52% / 46% 58% 42% 54%;
    }
    .cv-theme-taupe:hover {
        border-radius: 52% 48% 54% 46% / 50% 50% 50% 50%;
    }
}

/* Front Face Inside Organic Shape */
.cv-card-meta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 6px;
    position: relative;
    z-index: 2;
}

.cv-card-num {
    font-family: var(--sans);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.16em;
    color: var(--card-accent);
}

.cv-card-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--card-accent);
    box-shadow: 0 0 10px var(--card-accent);
}

.cv-card-title {
    font-family: var(--serif);
    font-size: clamp(21px, 2vw, 25px);
    font-weight: 400;
    line-height: 1.25;
    margin: auto 0;
    text-align: center;
    max-width: 22ch;
    position: relative;
    z-index: 2;
}

.cv-card-cue {
    font-family: var(--sans);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--card-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-bottom: 6px;
    position: relative;
    z-index: 2;
}

.cv-card-cue-icon {
    display: inline-block;
    transition: transform 0.3s ease;
}

.cv-flip-card.flipped .cv-card-cue-icon {
    transform: translateX(4px);
}

@media (hover: hover) and (pointer: fine) {
    .cv-flip-card:hover .cv-card-cue-icon {
        transform: translateX(4px);
    }
}

/* Back Face Inside Organic Shape */
.cv-card-back-tag {
    font-family: var(--sans);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--card-accent);
    background: rgba(var(--card-accent-rgb), 0.15);
    border: 1px solid rgba(var(--card-accent-rgb), 0.35);
    padding: 4px 12px;
    border-radius: 100px;
    display: inline-flex;
    align-self: center;
    margin-top: 4px;
}

.cv-card-desc {
    font-family: var(--sans);
    font-size: 14.5px;
    line-height: 1.55;
    margin: auto 0;
    text-align: center;
    max-width: 26ch;
}

.cv-card-back-cue {
    font-family: var(--sans);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--card-accent);
    margin-bottom: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    opacity: 0.95;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
    padding: 8px 18px;
    border-radius: 999px;
    background: rgba(var(--card-accent-rgb), 0.1);
    border: 1px solid rgba(var(--card-accent-rgb), 0.28);
    transition: opacity 0.2s ease, transform 0.2s ease, background 0.2s ease;
}

.cv-card-back-cue:active,
.cv-card-back-cue:hover {
    opacity: 1;
    background: rgba(var(--card-accent-rgb), 0.22);
    transform: scale(1.05);
}

/* Dark Theme Organic Card Surfaces */
html[data-theme="dark"] .cv-flip-front {
    background:
        radial-gradient(ellipse at 50% 25%, rgba(var(--card-accent-rgb), 0.18) 0%, transparent 68%),
        linear-gradient(155deg, rgba(34, 38, 43, 0.92) 0%, rgba(26, 20, 18, 0.98) 100%);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1.5px solid rgba(var(--card-accent-rgb), 0.45);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 16px 36px -10px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] .cv-flip-card.flipped .cv-flip-front {
    border-color: var(--card-accent);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12),
                0 22px 48px -10px rgba(0, 0, 0, 0.8),
                0 0 28px rgba(var(--card-accent-rgb), 0.35);
}

@media (hover: hover) and (pointer: fine) {
    html[data-theme="dark"] .cv-flip-card:hover .cv-flip-front {
        border-color: var(--card-accent);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12),
                    0 22px 48px -10px rgba(0, 0, 0, 0.8),
                    0 0 28px rgba(var(--card-accent-rgb), 0.35);
    }
}

html[data-theme="dark"] .cv-flip-front .cv-card-title {
    color: #E8E2DB;
}

html[data-theme="dark"] .cv-flip-back {
    background:
        radial-gradient(ellipse at 50% 30%, rgba(var(--card-accent-rgb), 0.22) 0%, transparent 72%),
        linear-gradient(155deg, rgba(34, 38, 43, 0.96) 0%, rgba(26, 20, 18, 0.99) 100%);
    border: 2px solid var(--card-accent);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1),
                0 26px 54px -12px rgba(0, 0, 0, 0.85),
                0 0 35px rgba(var(--card-accent-rgb), 0.35);
}

html[data-theme="dark"] .cv-card-desc {
    color: rgba(232, 226, 219, 0.95);
}

html[data-theme="dark"] .cv-where-title {
    color: #E8E2DB !important;
}

/* Light Theme Overrides & Contrast Enhancements */
[data-theme="light"] {
    --text-primary: #1A1412;
    --text-secondary: #22262B;
    --border-color: rgba(26, 20, 18, 0.16);
    --bg-page: #FAF8F5;
    --bg-page-alt: #F4EDE3;
}

[data-theme="light"] .cv-atelier .sec-title,
[data-theme="light"] .cv-atelier .cv-where-title,
[data-theme="light"] .cv-atelier h1,
[data-theme="light"] .cv-atelier h2,
[data-theme="light"] .cv-atelier h3 {
    color: #1A1412 !important;
}

[data-theme="light"] .cv-atelier .lede {
    color: #22262B !important;
}

[data-theme="light"] .cv-atelier .eyebrow {
    color: #B66B3A !important;
    font-weight: 700 !important;
}

[data-theme="light"] .cv-atelier .k-card,
[data-theme="light"] .cv-atelier .grid-3 > .k-card {
    background: rgba(255, 255, 255, 0.88) !important;
    border: 1px solid rgba(26, 20, 18, 0.14) !important;
    box-shadow: 0 10px 28px -10px rgba(26, 20, 18, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

[data-theme="light"] .cv-atelier .k-name,
[data-theme="light"] .cv-atelier .grid-3 > .k-card h4 {
    color: #1A1412 !important;
}

[data-theme="light"] .cv-atelier .k-desc,
[data-theme="light"] .cv-atelier .grid-3 > .k-card p {
    color: #22262B !important;
}

[data-theme="light"] .cv-atelier .grid-3 > .k-card:hover,
[data-theme="light"] .cv-atelier .k-card:hover {
    background: #FFFFFF !important;
    border-color: #B66B3A !important;
    box-shadow: 0 18px 36px -10px rgba(182, 107, 58, 0.2), 0 0 16px rgba(182, 107, 58, 0.1) !important;
}

[data-theme="light"] .small-link {
    color: #B66B3A !important;
    font-weight: 600 !important;
}

[data-theme="light"] .cv-investment {
    background: #FAF8F5 !important;
    border: 1px solid rgba(182, 107, 58, 0.3) !important;
    box-shadow: 0 16px 36px -10px rgba(182, 107, 58, 0.15) !important;
}

[data-theme="light"] .cv-investment > div:first-child {
    color: #B66B3A !important;
}

[data-theme="light"] .cv-flip-front {
    background:
        radial-gradient(ellipse at 50% 20%, rgba(var(--card-accent-rgb), 0.14) 0%, transparent 68%),
        linear-gradient(155deg, #FFFFFF 0%, #F5ECE0 100%);
    border: 2px solid rgba(var(--card-accent-rgb), 0.55);
    box-shadow: 0 12px 30px -8px rgba(var(--card-accent-rgb), 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

[data-theme="light"] .cv-flip-card.flipped .cv-flip-front {
    border-color: var(--card-accent);
    box-shadow: 0 20px 42px -10px rgba(var(--card-accent-rgb), 0.30),
                0 0 24px rgba(var(--card-accent-rgb), 0.22),
                inset 0 0 0 1px var(--card-accent);
}

@media (hover: hover) and (pointer: fine) {
    [data-theme="light"] .cv-flip-card:hover .cv-flip-front {
        border-color: var(--card-accent);
        box-shadow: 0 20px 42px -10px rgba(var(--card-accent-rgb), 0.30),
                    0 0 24px rgba(var(--card-accent-rgb), 0.22),
                    inset 0 0 0 1px var(--card-accent);
    }
}

[data-theme="light"] .cv-flip-front .cv-card-title {
    color: #1A1412 !important;
    font-weight: 500;
}

[data-theme="light"] .cv-flip-back {
    background:
        radial-gradient(ellipse at 50% 25%, rgba(var(--card-accent-rgb), 0.16) 0%, transparent 70%),
        linear-gradient(155deg, #FFFFFF 0%, #F9F2E7 100%);
    border: 2.5px solid var(--card-accent);
    box-shadow: 0 22px 46px -10px rgba(var(--card-accent-rgb), 0.32),
                0 4px 16px rgba(26, 20, 18, 0.08);
}

[data-theme="light"] .cv-card-desc {
    color: #1A1412 !important;
    font-weight: 450;
}

[data-theme="light"] .cv-card-back-tag {
    background: rgba(var(--card-accent-rgb), 0.14);
    border-color: rgba(var(--card-accent-rgb), 0.4);
    color: var(--card-accent);
}

/* Light Theme Overrides */
[data-theme="light"] .cv-decision-premise {
    background: rgba(89, 63, 43, 0.05);
    border-color: rgba(89, 63, 43, 0.14);
}
[data-theme="light"] .cv-virtue-circle-btn {
    background: rgba(89, 63, 43, 0.04);
    border-color: rgba(89, 63, 43, 0.12);
}
[data-theme="light"] .cv-virtue-circle-btn.active {
    background: rgba(161, 79, 34, 0.1);
    border-color: #a14f22;
}
[data-theme="light"] .cv-virtue-display-deck {
    background: rgba(253, 251, 247, 0.92);
    border-color: rgba(89, 63, 43, 0.16);
    box-shadow: 0 16px 36px -12px rgba(89, 63, 43, 0.15);
}
[data-theme="light"] .cv-panel-surface-block {
    background: rgba(79, 115, 106, 0.08);
    border-color: rgba(79, 115, 106, 0.18);
}
[data-theme="light"] .cv-panel-surface {
    color: var(--text-primary);
}
[data-theme="light"] .cv-attention-thread { color: rgba(89, 63, 43, .28); }
[data-theme="light"] .cv-attention-thread .cv-thread-main { stroke: #a14f22; }
[data-theme="light"] .cv-attention-thread .cv-thread-echo { stroke: #4f736a; }
[data-theme="light"] .cv-attention-thread .cv-thread-node { fill: rgba(161, 79, 34, 0.7); }
[data-cv-media-theme="dark"] {
    --text-primary: #e1d8ca; --text-secondary: #e1d8ca; --accent-ember: #e08a52;
    --bg-card: #241816; --border-color: #8f7e6c; color: var(--text-primary);
}
@media (min-width: 1101px) {
    .cv-atelier .hero {
        min-height: 100svh;
        background-image: url('/assets/Sufi%20temple,%20inside%20w%20people.webp?v=3.1.2');
        background-position: center center;
        background-size: cover;
        background-attachment: scroll;
    }
    .cv-atelier .hero.hero-individuals {
        background-image: url('/assets/carlos_web.webp?v=3.8.0');
        background-position: center 42%;
    }
    .cv-atelier .hero.hero-method {
        background-image: url('/assets/Sufi%20temple%20outside.webp?v=3.1.2');
        background-position: center center;
    }
    .cv-atelier .hero::after {
        display: block;
        content: "";
        position: absolute;
        inset: auto 0 0;
        height: 22%;
        background: linear-gradient(to bottom, transparent, var(--bg-page));
        pointer-events: none;
    }
    .cv-atelier .hero-inner > * { max-width: 52%; }
    .cv-atelier .hero-inner > h1 { max-width: 51% !important; font-size: clamp(44px,4.4vw,66px) !important; line-height: 1.06; }
    .cv-atelier .hero-inner > p { max-width: min(50%, 600px) !important; }
    .cv-atelier .hero-inner > .hero-lede { font-size: 21px; line-height: 1.55; }
    .cv-editorial, .cv-list-editorial { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); column-gap: clamp(48px,7vw,104px); }
    .cv-editorial > *, .cv-list-editorial > * { grid-column: 1 / -1; min-width: 0; }
    .cv-editorial > .eyebrow, .cv-list-editorial > .eyebrow { grid-column: 1; grid-row: 1; }
    .cv-editorial > h2 { grid-column: 1; grid-row: 2 / span var(--cv-reading-rows); font-size: clamp(36px,3.2vw,48px) !important; line-height: 1.12; align-self: start; }
    .cv-editorial > .lede { grid-column: 2; grid-row: var(--cv-reading-row); font-size: 18px !important; margin-bottom: 24px !important; }
    .cv-editorial > h3 { margin-top: 56px !important; }
    .cv-list-editorial > h2 { grid-column: 1; grid-row: 2; align-self: start; }
    .cv-list-editorial > ul { grid-column: 2; grid-row: 2; }
    .cv-list-editorial > ul > li { padding-block: 0 24px; border-bottom: 1px solid var(--border-color); }
    .cv-list-editorial > ul > li b { display: inline-block; font: 25px var(--serif); margin-bottom: 12px; }
    .cv-investment { display:grid;grid-template-columns:.7fr 1.3fr;gap:16px 64px;align-items:start; }
    .cv-investment > div:first-child { grid-row:1 / 3; }
    .cv-investment > .btn { grid-column:2;justify-self:start; }
}
@media (min-width: 761px) and (max-width: 1100px) { 
    .cv-atelier .step-list { grid-template-columns: repeat(2,minmax(0,1fr)); } 
    .cv-flip-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
    .cv-flip-card { height: 350px; }
}
@media (max-width: 760px) {
    .cv-flip-grid { grid-template-columns: 1fr; gap: 24px; }
    .cv-flip-card { height: clamp(320px, 82vw, 360px); }
    .cv-flip-front, .cv-flip-back { padding: clamp(28px, 6vw, 38px) clamp(22px, 5vw, 32px); }
    .cv-atelier .hero { padding-block: 120px 64px; min-height: auto; }
    .cv-atelier .hero::before { background: linear-gradient(90deg,rgba(18,12,10,.9),rgba(18,12,10,.42)); }
    .cv-atelier .wrap, .cv-atelier .wrap-medium, .cv-atelier .wrap-narrow { padding-inline: 24px; }
    .cv-atelier .circle-interactive-layout { grid-template-columns: minmax(0, 1fr) !important; }
    .cv-atelier .wrap > div[style*="minmax(320px"] { grid-template-columns: minmax(0,1fr) !important; }
    .cv-atelier .k-card { padding: 24px !important; }
    .cv-atelier .hero-inner > * { max-width: 100% !important; }
    .cv-atelier .step-list { grid-template-columns: 1fr; gap: 20px; }
    .cv-atelier .step-list li { padding: 20px 0 0 48px; }
    .cv-atelier .step-list li::before { top: 20px; }
    .cv-atelier .grid-3 > .k-card:nth-child(3n + 2) { border-inline: 0; }
    .cv-atelier td { padding: 18px 12px !important; }
    .cv-attention-thread { right: 4px; width: 48px; color: rgba(192,151,105,.15); will-change: auto; }
    .cv-thread-dust, .cv-attention-thread .cv-thread-echo { display: none; }
}
@media (max-width: 760px) {
    .cv-atelier .scroll-guided-fire.fire-orb { width: 240px; height: 180px; filter: blur(28px); }
    .cv-atelier .scroll-guided-fire.fire-orb-inner { width: 96px; height: 96px; }
}
@media (prefers-reduced-motion: reduce) {
    .cv-atelier *, .cv-atelier *::before, .cv-atelier *::after { animation: none !important; scroll-behavior: auto !important; }
    .cv-attention-thread { transform: none !important; will-change: auto; opacity: .7; }
    .cv-attention-thread path { stroke-dashoffset: 0 !important; }
    .cv-thread-dust { display: none; }
    .cv-atelier .k-card, .cv-atelier .circle-attention, .cv-orbit-engraving, .cv-flip-card-inner, .cv-card-blob, .cv-card-cue-icon { transition: none !important; }
}
