.single {
    &.single-perfil {
    }

    &.single-post,
    &.single-curiosidad {
        .container {
            max-width: 900px;
        }

        .single-page-grid {
            grid-template-columns: 1fr;
        }
    }

    .content-block {
        &.titulo {
            padding: 32px 24px;
        }
    }

    h1 {
        text-transform: uppercase;
        font-weight: 800;
        line-height: 1.2;
        font-size: 32px;
        letter-spacing: -1px;
    }

    .single-page-grid {
        display: grid;
        align-items: start;
        grid-template-columns: 1fr;
        gap: 16px;
    }

    iframe {
        width: 100%;
        aspect-ratio: 16 / 9;
        height: auto;
        border: 0;
    }

    .icon-link {
        vertical-align: text-top;
        position: absolute;
    }

    .icon-url {
        height: 1rem;
        width: 1.5rem;
        margin-bottom: 3px;
        margin-left: 3px;
    }

    .podcast-item {
        background-color: #e7ffe7;
    }

    .gallery-block {
        display: grid;
        gap: 9px;
    }

    .gallery-grid {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 12px;

        img {
            aspect-ratio: 1 / 1;
            object-fit: cover;
            height: 100%;
            width: 100%;
            border-radius: var(--border-radius);
            transition-duration: 350ms;
            /* filter: none; */ 

            opacity: 1;

            &:hover {
                z-index: 10;
                transition-duration: var(--trans-speed);
                box-shadow: var(--box-shadow); 
 
            }
        }

        /* all gallery hover */
        &:hover {
            & img:not(:hover) {
                opacity: 0.5;
                transform: scale(0.92);
            }
        }
    }

    .alias-item { 
        em {
                    cursor: help;
         border-bottom: 2px dashed transparent;
        }

        &:hover em {
            /* text-decoration: underline; */
            border-bottom: 2px dashed #0202023d;
        }
    }
}

@media screen and (min-width: 1024px) {
    .single {
        .single-page-grid {
            grid-template-columns: 42% auto;
        }
    }
}
