/* =========================================
   MOBILE.CSS – TA2Web (AUTHORITATIVE)
   Purpose: Tablet + Mobile Typography Control
========================================= */

/* ==================================================
   TABLETS + MOBILE (max-width: 768px)
================================================== */
@media (max-width: 768px) {

    /* -----------------------------
       Author layout
    ----------------------------- */
    .ta2-author-post-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .ta2-author-thumb img {
        width: 100%;
        max-width: 300px;
    }

    .ta2-footer-single-line {
        padding: 12px 10px;
        font-size: 13px;
    }

    /* -----------------------------
       SINGLE POST TITLE (H1)
    ----------------------------- */
    h1.entry-title {
        font-size: 1.55rem;
        line-height: 1.35;
        margin-bottom: 0.6em;
    }

    /* -----------------------------
       BLOG / CATEGORY PAGE H1
    ----------------------------- */
    .ta2-blog-header .page-title {
        font-size: 1.9rem;
        line-height: 1.25;
        margin-bottom: 0.6em;
    }

    /* -----------------------------
       BLOG / CATEGORY POST TITLES (H2)
    ----------------------------- */
    .blog h2.entry-title,
    .archive h2.entry-title {
        font-size: 1.45rem;
        line-height: 1.25;
        margin-bottom: 0.5em;
    }

    .blog h2.entry-title a,
    .archive h2.entry-title a {
        font-size: inherit;
        line-height: inherit;
    }

    /* -----------------------------
       Content headings
    ----------------------------- */
    .entry-content h2 { font-size: 1.35rem; }
    .entry-content h3 { font-size: 1.2rem; }
    .entry-content h4 { font-size: 1.1rem; }
    .entry-content h5 { font-size: 1rem; }

    /* -----------------------------
       Body text & meta
    ----------------------------- */
    .entry-content {
        font-size: 1rem;
        line-height: 1.55;
    }

    .posted-on,
    .byline {
        font-size: 0.95rem;
    }

    .cat-links,
    .tags-links,
    #nav-below {
        font-size: 1rem;
    }

    /* -----------------------------
       Spacing
    ----------------------------- */
    .entry-content ul,
    .entry-content ol {
        padding-left: 24px;
        margin-left: 0;
    }

    .entry-content li {
        margin-bottom: 0.4em;
    }

    .entry-content,
    .ta2-author-post-row,
    .ta2-footer-single-line {
        padding-left: 8px;
        padding-right: 8px;
    }
}

/* ==================================================
   SMALL PHONES (max-width: 480px)
================================================== */
@media (max-width: 480px) {

    /* -----------------------------
       SINGLE POST TITLE (H1)
    ----------------------------- */
    h1.entry-title {
        font-size: 1.4rem;
        line-height: 1.2;
        margin-bottom: 0.55em;
    }

    /* -----------------------------
       BLOG / CATEGORY PAGE H1
    ----------------------------- */
    .ta2-blog-header .page-title {
        font-size: 1.55rem;
        line-height: 1.2;
        margin-bottom: 0.5em;
    }

    /* -----------------------------
       BLOG / CATEGORY POST TITLES (H2)
       THIS IS THE KEY FIX
    ----------------------------- */
    .blog h2.entry-title,
    .archive h2.entry-title {
        font-size: 1.2rem;
        line-height: 1.22;
        margin-bottom: 0.45em;
    }

    .blog h2.entry-title a,
    .archive h2.entry-title a {
        font-size: inherit;
        line-height: inherit;
    }

    /* -----------------------------
       Author page titles
    ----------------------------- */
    .ta2-author-post-content h2.entry-title {
        font-size: 1.15rem;
    }

    /* -----------------------------
       Content headings
    ----------------------------- */
    .entry-content h2 { font-size: 1.25rem; }
    .entry-content h3 { font-size: 1.15rem; }
    .entry-content h4 { font-size: 1.05rem; }
    .entry-content h5 { font-size: 0.95rem; }

    /* -----------------------------
       Body text & meta
    ----------------------------- */
    .entry-content {
        font-size: 0.95rem;
    }

    .posted-on,
    .byline {
        font-size: 0.8rem;
    }

    .cat-links,
    .tags-links,
    #nav-below {
        font-size: 0.95rem;
    }

    .ta2-footer-copyright {
        font-size: 0.7rem;
    }

    /* -----------------------------
       Spacing
    ----------------------------- */
    .entry-content ul,
    .entry-content ol {
        padding-left: 22px;
        margin-left: 0;
    }

    .entry-content li {
        padding-left: 2px;
    }

    .entry-content,
    .ta2-author-post-row,
    .ta2-footer-single-line {
        padding-left: 4px;
        padding-right: 4px;
    }
}