/* =========================================================
   NUNKY BLOG — ARTÍCULO INDIVIDUAL
   ========================================================= */


/* =========================================================
   BASE
   ========================================================= */

.nunky-single {
    width: 100%;
    margin: 0;
    padding: 0;

    background: #ffffff;
    color: #172033;
}


/* =========================================================
   HERO
   ========================================================= */

.nunky-single-hero {
    width: 100%;

    background: #f5f8fb;
    color: #111827;

    padding: 125px 0 60px;
}

.nunky-single-hero-inner {
    width: min(100%, 1100px);
    margin: 0 auto;
}

.nunky-single-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 8px;

    margin: 0 0 26px;

    color: #667085;

    font-family: "Inter", Arial, sans-serif;
    font-size: 0.92rem;
    line-height: 1.4;
}

.nunky-single-category {
    color: #007f8e;

    font-weight: 700;
    letter-spacing: 0.06em;

    text-transform: uppercase;
}

.nunky-single-meta-separator {
    color: #98a2b3;
}

.nunky-single-title {
    max-width: 900px;

    margin: 0;

    color: #111827 !important;

    font-family: "Poppins", "Inter", Arial, sans-serif;
    font-size: clamp(3rem, 6vw, 5.6rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.05em;
}

.nunky-single-lead {
    max-width: 790px;

    margin-top: 32px;

    color: #475467;

    font-family: "Inter", Arial, sans-serif;
    font-size: clamp(1.1rem, 2vw, 1.35rem);
    line-height: 1.65;
}

.nunky-single-lead p {
    margin: 0;
}


/* =========================================================
   IMAGEN DESTACADA
   ========================================================= */

body.single .nunky-single-featured {
    width: 100% !important;

    background: #f5f8fb;

    padding: 0 24px 64px !important;
}

body.single .nunky-single-featured .container {
    width: 100% !important;
    max-width: 820px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.single figure.nunky-single-featured-inner {
    width: 100% !important;
    max-width: 760px !important;

    margin: 0 auto !important;

    overflow: hidden;

    border-radius: 18px !important;

    background: #e9eef3;
}

body.single figure.nunky-single-featured-inner img,
body.single .nunky-single-featured img.wp-post-image {
    display: block !important;

    width: 100% !important;
    max-width: 760px !important;
    height: auto !important;

    margin: 0 auto !important;

    object-fit: contain !important;
}


/* =========================================================
   ZONA DE LECTURA
   ========================================================= */

.nunky-single-body {
    width: 100%;

    background: #ffffff !important;

    padding: 64px 24px 90px;
}

.nunky-single-reading {
    width: min(100%, 780px);

    margin: 0 auto;

    color: #344054 !important;

    font-family: "Inter", Arial, sans-serif;
    font-size: 1.1rem;
    line-height: 1.85;
}

.nunky-single-reading > *:first-child {
    margin-top: 0;
}

.nunky-single-reading > *:last-child {
    margin-bottom: 0;
}


/* =========================================================
   PÁRRAFOS
   ========================================================= */

.nunky-single-reading p {
    margin: 0 0 1.65em;

    color: #344054;
}


/* =========================================================
   TITULARES
   ========================================================= */

.nunky-single-reading h2 {
    margin: 2.3em 0 0.75em;

    color: #101828 !important;

    font-family: "Poppins", "Inter", Arial, sans-serif;
    font-size: clamp(2rem, 4vw, 2.8rem);
    font-weight: 600;
    line-height: 1.18;
    letter-spacing: -0.035em;
}

.nunky-single-reading h3 {
    margin: 2em 0 0.7em;

    color: #101828 !important;

    font-family: "Poppins", "Inter", Arial, sans-serif;
    font-size: clamp(1.45rem, 3vw, 1.9rem);
    font-weight: 600;
    line-height: 1.25;
}

.nunky-single-reading h4 {
    margin: 1.8em 0 0.65em;

    color: #101828 !important;

    font-family: "Poppins", "Inter", Arial, sans-serif;
    font-size: 1.25rem;
}


/* =========================================================
   TEXTO Y ENLACES
   ========================================================= */

.nunky-single-reading strong {
    color: #101828;
}

.nunky-single-reading a {
    color: #007f8e;

    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
}

.nunky-single-reading a:hover {
    color: #005f6b;
}


/* =========================================================
   LISTAS
   ========================================================= */

.nunky-single-reading ul,
.nunky-single-reading ol {
    margin: 1.5em 0;

    padding-left: 1.6em;
}

.nunky-single-reading li {
    margin-bottom: 0.7em;
}


/* =========================================================
   IMÁGENES DENTRO DEL CONTENIDO
   ========================================================= */

.nunky-single-reading figure,
.nunky-single-reading .wp-block-image {
    width: 100%;

    margin: 40px 0 48px;
}

.nunky-single-reading > figure:first-child,
.nunky-single-reading > .wp-block-image:first-child {
    margin-top: 0;
}

.nunky-single-reading img {
    display: block;

    max-width: 100%;
    height: auto;

    margin: 0 auto;

    border-radius: 16px;
}

.nunky-single-reading figcaption {
    margin-top: 12px;

    color: #667085;

    font-size: 0.85rem;
    line-height: 1.5;

    text-align: center;
}


/* =========================================================
   CITAS
   ========================================================= */

.nunky-single-reading blockquote {
    margin: 52px 0;

    padding: 10px 0 10px 28px;

    border-left: 4px solid #00a7b7;

    color: #344054;

    font-size: 1.3rem;
    line-height: 1.65;
}

.nunky-single-reading blockquote p {
    margin: 0;
}


/* =========================================================
   SEPARADORES
   ========================================================= */

.nunky-single-reading hr {
    margin: 60px 0;

    border: 0;
    border-top: 1px solid #e4e7ec;
}


/* =========================================================
   FINAL DEL ARTÍCULO
   ========================================================= */

.nunky-single-end {
    width: 100%;

    background: #f5f8fb;

    padding: 70px 24px 96px;
}

.nunky-single-end-inner {
    width: min(100%, 780px);

    margin: 0 auto;
}

.nunky-single-tags {
    margin-bottom: 46px;
}

.nunky-single-tags-title {
    display: block;

    margin-bottom: 15px;

    color: #667085;

    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.08em;

    text-transform: uppercase;
}

.nunky-single-tags-list {
    display: flex;
    flex-wrap: wrap;

    gap: 10px;
}

.nunky-single-tags-list a {
    display: inline-flex;

    padding: 8px 14px;

    border: 1px solid #d0d5dd;
    border-radius: 999px;

    background: #ffffff;

    color: #344054;

    font-size: 0.9rem;

    text-decoration: none;
}

.nunky-single-tags-list a:hover {
    border-color: #00a7b7;

    color: #007f8e;
}

.nunky-single-back {
    display: inline-flex;
    align-items: center;

    color: #007f8e;

    font-weight: 600;

    text-decoration: none;
}

.nunky-single-back:hover {
    color: #005f6b;
}


/* =========================================================
   WORDPRESS BLOCKS
   ========================================================= */

.nunky-single-reading .wp-block-heading {
    color: #101828;
}

.nunky-single-reading .wp-block-separator {
    border-color: #e4e7ec;
}

.nunky-single-reading .wp-block-table {
    overflow-x: auto;

    margin: 42px 0;
}

.nunky-single-reading table {
    width: 100%;

    border-collapse: collapse;
}

.nunky-single-reading th,
.nunky-single-reading td {
    padding: 14px;

    border: 1px solid #e4e7ec;

    text-align: left;
}

.nunky-single-reading th {
    color: #101828;

    background: #f9fafb;
}


/* =========================================================
   HEADER SOBRE FONDO CLARO
   ========================================================= */

body.single .header {
    background: rgba(255, 255, 255, 0.96);
}

body.single .header .nav-link,
body.single .header .dropdown-toggle {
    color: #101828;
}

body.single .header .dropdown-arrow {
    color: #101828;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 768px) {

    .nunky-single-hero {
        padding: 100px 0 45px;
    }

    .nunky-single-title {
        font-size: clamp(2.5rem, 12vw, 4rem);
    }

    .nunky-single-lead {
        margin-top: 24px;

        font-size: 1.05rem;
    }

    body.single .nunky-single-featured {
        padding-left: 20px !important;
        padding-right: 20px !important;
        padding-bottom: 48px !important;
    }

    body.single figure.nunky-single-featured-inner,
    body.single figure.nunky-single-featured-inner img,
    body.single .nunky-single-featured img.wp-post-image {
        max-width: 100% !important;
    }

    .nunky-single-body {
        padding: 48px 22px 64px;
    }

    .nunky-single-reading {
        font-size: 1.03rem;
        line-height: 1.78;
    }

    .nunky-single-reading figure,
    .nunky-single-reading .wp-block-image {
        margin: 36px 0 42px;
    }

    .nunky-single-end {
        padding: 54px 22px 72px;
    }

}
