
:root {
    --jk-mark: url("../logos/jk-mark.svg");
}
.jk-mark {
    display: block;
    background-color: currentColor;
    mask: var(--jk-mark) center / contain no-repeat;
    -webkit-mask: var(--jk-mark) center / contain no-repeat;
    flex-shrink: 0;
}
.jk-report-wm {
    position: absolute;
    right: -4rem;
    top: -4rem;
    width: 300px;
    height: 300px;
    background: url('../logos/jk-mark-green.svg') center / contain no-repeat;
    opacity: .06;
    pointer-events: none;
    z-index: 0;
}
.jk-report-wm+* {
    position: relative;
    z-index: 1;
}
@media (max-width: 640px) {
    .jk-report-wm {
        width: 200px;
        height: 200px;
        right: -2.5rem;
        top: -2.5rem;
        opacity: .05;
    }
}
.jk-signature {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .75rem;
    color: var(--verde-forense);
}
.jk-signature .jk-mark {
    width: 34px;
    height: 34px;
}
.jk-signature-text {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
    text-align: left;
}
.jk-signature-name {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 800;
    font-size: 15px;
    letter-spacing: .5px;
    color: var(--verde-forense);
}
.jk-signature-role {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 700; 
    font-size: 9.5px;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    color: var(--texto-3);
}
@media (max-width: 430px) {
    .jk-signature .jk-mark {
        width: 28px;
        height: 28px;
    }
}
@media print {
    .jk-signature {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
}
.jk-footer {
    margin-top: 2.5rem;
    padding: 2rem 1rem 2.5rem;
    border-top: 1px solid var(--borde-cristal);
    text-align: center;
}
@media (max-width: 640px) {
    .jk-footer {
        padding-bottom: 5.5rem;
    }
}
.jk-cta-wrap {
    display: flex;
    justify-content: center;
    margin: 2rem 0;
}
.jk-cta {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: 1rem 2rem;
    border: 1px solid var(--borde-cristal);
    border-radius: 9999px;
    background: var(--verde-forense);
    color: var(--crema-tarjeta);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -.01em;
    text-decoration: none;
    box-shadow: 0 10px 15px -3px color-mix(in srgb, var(--tinta) 18%, transparent);
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.jk-cta:hover {
    background: var(--tinta);
    box-shadow: 0 14px 22px -6px color-mix(in srgb, var(--tinta) 28%, transparent);
    transform: translateY(-2px);
}
.jk-cta:active {
    transform: scale(.96);
}
.jk-cta:focus-visible {
    outline: 2px solid var(--dorado-premium);
    outline-offset: 3px;
}
.jk-cta-arrow {
    transition: transform .18s ease;
}
.jk-cta:hover .jk-cta-arrow {
    transform: translateX(3px);
}
@media (prefers-reduced-motion: reduce) {
    .jk-cta,
    .jk-cta-arrow {
        transition: none;
    }
    .jk-cta:hover {
        transform: none;
    }
}
.caja-logo-principal {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 220px;
    max-height: 280px;
    overflow: hidden;
}
.caja-logo-principal svg,
.caja-logo-principal img {
    width: auto;
    max-width: 140px;      
    height: auto;
    max-height: 140px;
    object-fit: contain;   
    shape-rendering: geometricPrecision;
}
.caja-icono-modulo {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 18px 12px 12px; 
    min-height: 110px;        
}
.caja-icono-modulo svg,
.caja-icono-modulo img {
    width: 44px;              
    height: 44px;
    max-width: 44px;
    max-height: 44px;
    object-fit: contain;
    margin-bottom: 8px;       
    shape-rendering: geometricPrecision;
}
.caja-icono-modulo .label-modo {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.75;
}
.caja-icono-oscuro {
    background-color: var(--tinta); 
    border: 1px solid color-mix(in srgb, var(--ocre) 20%, transparent); 
}
.caja-icono-claro {
    background-color: var(--papel);
    border: 1px solid color-mix(in srgb, var(--tinta) 18%, transparent);
}
.caja-icono-oscuro svg {
    color: var(--ocre);
}
.caja-icono-claro svg {
    color: var(--tinta);
}
.caja-icono-oscuro svg path,
.caja-icono-oscuro svg line,
.caja-icono-oscuro svg polygon,
.caja-icono-oscuro svg circle,
.caja-icono-oscuro svg rect {
    fill: var(--ocre); 
    stroke: var(--tinta); 
    stroke-width: 1.5px;
    paint-order: stroke fill; 
}
.caja-icono-claro svg path,
.caja-icono-claro svg line,
.caja-icono-claro svg polygon,
.caja-icono-claro svg circle,
.caja-icono-claro svg rect {
    fill: var(--tinta);
    stroke: var(--papel);
    stroke-width: 1.5px;
    paint-order: stroke fill;
}
.jk-shine {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}
.jk-shine::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(105deg,
            transparent 40%,
            color-mix(in srgb, var(--ocre) 28%, transparent) 50%,
            transparent 60%);
    transform: translate3d(-120%, 0, 0);
    transition: transform .7s var(--ease-out, cubic-bezier(0.16, 1, 0.3, 1));
}
.jk-shine:hover::after,
.jk-shine:focus-visible::after {
    transform: translate3d(120%, 0, 0);
}
.jk-aura {
    position: relative;
}
.jk-aura::before {
    content: '';
    position: absolute;
    inset: -30%;
    z-index: -1;
    pointer-events: none;
    border-radius: inherit;
    background: radial-gradient(circle, var(--risk-glow) 0%, transparent 70%);
    opacity: .35;
    animation: aura-breathe 2.4s var(--ease-inout, cubic-bezier(0.4, 0, 0.2, 1)) infinite;
}
@keyframes aura-breathe {
    0%, 100% { opacity: .35; transform: scale(1); }
    50% { opacity: .85; transform: scale(1.06); }
}
@media (prefers-reduced-motion: reduce) {
    .jk-aura::before {
        animation: none;
        opacity: .5;
    }
    .jk-shine::after {
        transition-duration: .01ms;
    }
}
.btn-undo:focus-visible,
.swipe-instr-btn:focus-visible,
.qa-modal-close:focus-visible,
.calendar-close:focus-visible,
.btn:focus-visible,
.contact-line:focus-visible,
.solution:focus-visible {
    outline: 2px solid var(--dorado-premium);
    outline-offset: 3px;
}
