/* --- GameBoxes Deluxe Google Material 3 Styling
   - Premium Header with Sleek Floating Pill Hover UI
   - Google Search Bar with Material Search Icon & Gradient Button
   - Centered Google Material Capsule Pagination
   - Custom Branded Footer Credit Bar
   - Fully Responsive for Desktop & Mobile --- */

/* --- Base Body & Theme Colors --- */
body {
    background-color: #f8f9fa;
    color: #3c4043;
    text-rendering: optimizeLegibility;
}

/* --- Accessible Scroll Offsets (Header Clearance) --- */
html {
    scroll-padding-top: 72px;
}

@media (max-width: 768px) {
    html {
        scroll-padding-top: 60px;
    }
}

[id] {
    scroll-margin-top: 72px;
}

@media (max-width: 768px) {
    [id] {
        scroll-margin-top: 60px;
    }
}

/* --- 1. Site Header & Brand Logo --- */
.site-header {
    background: #ffffff !important;
    border-bottom: 1px solid #e8eaed !important;
    box-shadow: 0 1px 4px rgba(60, 64, 67, 0.05) !important;
}

.main-title {
    margin: 0 !important;
}

.main-title a {
    font-size: 24px !important;
    font-weight: 700 !important;
    letter-spacing: -0.4px !important;
    color: #202124 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.main-title a:hover {
    color: #1a73e8 !important;
}

/* --- 2. Desktop Header Navigation (Floating Pill Hover UI) --- */
.main-navigation {
    background-color: transparent !important;
    border: none !important;
}

@media (min-width: 769px) and (max-width: 1024px) {
    .main-navigation .main-nav > ul {
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
    }

    .main-navigation .main-nav ul li a {
        font-size: 12.5px !important;
        padding: 6px 10px !important;
        margin: 2px 1px !important;
    }
}

/* --- 3. Google Search Bar Widget & Premium Button --- */
.wp-block-search {
    width: 100% !important;
    margin-bottom: 0 !important;
}

.wp-block-search .wp-block-search__label {
    display: none !important;
}

.wp-block-search .wp-block-search__inside-wrapper {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    border: 1.5px solid #dadce0 !important;
    border-radius: 30px !important;
    background-color: #ffffff !important;
    padding: 4px 6px 4px 14px !important;
    box-shadow: 0 1px 4px rgba(60, 64, 67, 0.08) !important;
    transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
    box-sizing: border-box !important;
    position: relative !important;
}

.wp-block-search .wp-block-search__inside-wrapper:hover {
    border-color: #bec0c5 !important;
    box-shadow: 0 2px 8px rgba(60, 64, 67, 0.14) !important;
}

.wp-block-search .wp-block-search__inside-wrapper:focus-within {
    border-color: #1a73e8 !important;
    box-shadow: 0 2px 10px rgba(26, 115, 232, 0.25) !important;
}

.wp-block-search .wp-block-search__input {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 9px 14px !important;
    font-size: 14px !important;
    color: #202124 !important;
    outline: none !important;
}

.wp-block-search .wp-block-search__input::placeholder {
    color: #5f6368 !important;
    font-size: 13.5px !important;
}

.wp-block-search .wp-block-search__button {
    flex: 0 0 auto !important;
    border-radius: 22px !important;
    background: linear-gradient(135deg, #1a73e8 0%, #1557b0 100%) !important;
    color: #ffffff !important;
    border: none !important;
    padding: 9px 20px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    letter-spacing: 0.2px !important;
    cursor: pointer !important;
    line-height: 1.3 !important;
    box-shadow: 0 2px 5px rgba(26, 115, 232, 0.3) !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, box-shadow !important;
    transition: transform 0.25s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.25s cubic-bezier(0.2, 0, 0, 1), background 0.2s ease !important;
}

.wp-block-search .wp-block-search__button:hover {
    background: linear-gradient(135deg, #1557b0 0%, #0d47a1 100%) !important;
    box-shadow: 0 4px 10px rgba(26, 115, 232, 0.42) !important;
    transform: translate3d(0, -1px, 0) !important;
}

.wp-block-search .wp-block-search__button:active {
    transform: translate3d(0, 0, 0) !important;
}

/* --- 4b. Archive Page Header (Category, Tag, Author, Search) --- */
.separate-containers .page-header {
    background: #ffffff !important;
    border-radius: 16px !important;
    border: 1px solid #e8eaed !important;
    box-shadow: 0 1px 3px rgba(60, 64, 67, 0.08), 0 1px 2px rgba(60, 64, 67, 0.04) !important;
    padding: 28px 32px !important;
    margin-bottom: 24px !important;
    overflow: hidden !important;
    transition: box-shadow 0.25s ease, border-color 0.25s ease !important;
}

.separate-containers .page-header:hover {
    border-color: #dadce0 !important;
    box-shadow: 0 4px 14px rgba(60, 64, 67, 0.12) !important;
}

.page-header .page-title {
    font-size: 1.75rem !important;
    font-weight: 700 !important;
    color: #202124 !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
}

.page-header .taxonomy-description {
    margin-top: 10px !important;
    font-size: 15px !important;
    color: #5f6368 !important;
    line-height: 1.6 !important;
}

.page-header .taxonomy-description p {
    margin-bottom: 0 !important;
}

.page-header .avatar {
    border-radius: 50% !important;
    box-shadow: 0 1px 4px rgba(60, 64, 67, 0.15) !important;
    border: 2px solid #ffffff !important;
    vertical-align: middle !important;
    margin-right: 8px !important;
}

.page-header .vcard {
    font-weight: 700 !important;
    color: #202124 !important;
}

/* --- 5. Pagination (Delegated to Google Blog v8.4 System) --- */

/* --- 6. Single Post Next / Previous Navigation (Delegated to Google Blog v8.1) --- */

/* --- 9. Authentic Google Material You Footer System (3-Column Widgets & Credit Bar) --- */
.site-footer {
    background-color: #ffffff !important;
    border-top: 1px solid #e8eaed !important;
    margin-top: 48px !important;
}

.site-footer #footer-widgets {
    padding: 48px 0 36px 0 !important;
}

.site-footer .inside-footer-widgets {
    display: grid !important;
    grid-template-columns: 1.05fr 1.35fr 0.95fr !important;
    gap: 48px !important;
    align-items: start !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
    box-sizing: border-box !important;
}

.inside-footer-widgets,
.inside-footer-widgets div[class*="footer-widget-"],
.footer-widgets,
.footer-widgets .widget,
.footer-widgets ul,
.footer-widgets li,
.footer-widgets p {
    text-align: left !important;
}

.inside-footer-widgets > div[class*="footer-widget-"] {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.footer-widgets .wp-block-heading,
.footer-widgets .widget-title {
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #202124 !important;
    letter-spacing: -0.2px !important;
    margin: 0 0 16px 0 !important;
    padding-bottom: 12px !important;
    border-bottom: 1px solid #f1f3f4 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.footer-widgets .wp-block-heading::before,
.footer-widgets .widget-title::before {
    content: '' !important;
    display: inline-block !important;
    width: 3.5px !important;
    height: 15px !important;
    background: #0b57d0 !important;
    border-radius: 9999px !important;
}

.footer-about-wrapper {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

.footer-about-desc,
.footer-widget-1 p,
.footer-widget-1 .wp-block-paragraph {
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 13.5px !important;
    line-height: 1.65 !important;
    color: #444746 !important;
    margin: 0 !important;
}

.footer-trust-chips {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
    margin-top: 4px !important;
}

.trust-chip {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 4px 10px !important;
    background: #f8fafd !important;
    border: 1px solid #e3e8ee !important;
    border-radius: 9999px !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    color: #3c4043 !important;
    font-family: "Google Sans", sans-serif !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, background-color !important;
    transition: transform 0.25s cubic-bezier(0.2, 0, 0, 1), background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

.trust-chip:hover {
    background: #e8f0fe !important;
    border-color: #c2d7fa !important;
    color: #0b57d0 !important;
    transform: translate3d(0, -1px, 0) !important;
}

.trust-dot {
    width: 5px !important;
    height: 5px !important;
    border-radius: 50% !important;
    background: #0b57d0 !important;
    display: inline-block !important;
}

.footer-verified-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 7px 12px !important;
    background: #f0fdf4 !important;
    border: 1px solid #bbf7d0 !important;
    border-radius: 10px !important;
    margin-top: 4px !important;
    width: fit-content !important;
}

.footer-verified-badge .badge-check {
    color: #14532d !important;
    font-weight: 700 !important;
    font-size: 12px !important;
}

.footer-verified-badge .badge-text {
    font-family: "Google Sans", sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    color: #14532d !important;
}

.footer-widgets ul.wp-block-page-list,
.footer-widget-2 .wp-block-page-list,
.footer-widget-3 .wp-block-page-list {
    list-style: none !important;
    padding: 0 !important;
    padding-left: 0 !important;
    margin: 0 !important;
    margin-left: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;
}

.footer-widgets ul.wp-block-page-list li,
.footer-widget-2 .wp-block-page-list li,
.footer-widget-3 .wp-block-page-list li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    text-align: left !important;
}

.footer-widgets ul.wp-block-page-list li a,
.footer-widget-2 .wp-block-page-list li a,
.footer-widget-3 .wp-block-page-list li a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 8px 18px !important;
    background: #f8fafd !important;
    border: 1px solid #eef2f6 !important;
    border-radius: 9999px !important;
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #3c4043 !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, box-shadow !important;
    transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.3s cubic-bezier(0.2, 0, 0, 1), background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease !important;
}

.footer-widgets ul.wp-block-page-list li a::before,
.footer-widget-2 .wp-block-page-list li a::before,
.footer-widget-3 .wp-block-page-list li a::before {
    content: '' !important;
    display: inline-block !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background-color: #0b57d0 !important;
    margin-right: 10px !important;
    flex-shrink: 0 !important;
    transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1) !important;
}

.footer-widgets ul.wp-block-page-list li a::after,
.footer-widget-2 .wp-block-page-list li a::after,
.footer-widget-3 .wp-block-page-list li a::after {
    content: '\2192' !important;
    font-size: 13px !important;
    color: #5f6368 !important;
    margin-left: auto !important;
    flex-shrink: 0 !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform !important;
    transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1), color 0.25s ease !important;
}

.footer-widgets ul.wp-block-page-list li a:hover,
.footer-widget-2 .wp-block-page-list li a:hover,
.footer-widget-3 .wp-block-page-list li a:hover {
    background: #ffffff !important;
    border-color: #c2d7fa !important;
    color: #0b57d0 !important;
    box-shadow: 0 4px 14px rgba(11, 87, 208, 0.1) !important;
    transform: translate3d(4px, 0, 0) !important;
}

.footer-widgets ul.wp-block-page-list li a:hover::before,
.footer-widget-2 .wp-block-page-list li a:hover::before,
.footer-widget-3 .wp-block-page-list li a:hover::before {
    transform: scale(1.3) !important;
}

.footer-widgets ul.wp-block-page-list li a:hover::after,
.footer-widget-2 .wp-block-page-list li a:hover::after,
.footer-widget-3 .wp-block-page-list li a:hover::after {
    color: #0b57d0 !important;
    transform: translate3d(3px, 0, 0) !important;
}

.footer-widgets .wp-block-tag-cloud,
.footer-widget-2 .wp-block-tag-cloud,
.footer-widget-3 .wp-block-tag-cloud {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 0 !important;
}

.footer-widgets .wp-block-tag-cloud a,
.footer-widget-2 .wp-block-tag-cloud a,
.footer-widget-3 .wp-block-tag-cloud a {
    display: inline-flex !important;
    align-items: center !important;
    background-color: #f1f3f4 !important;
    color: #3c4043 !important;
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    padding: 5px 12px !important;
    min-height: 28px !important;
    border-radius: 9999px !important;
    text-decoration: none !important;
    border: 1px solid transparent !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, background-color !important;
    transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1), background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

.footer-widgets .wp-block-tag-cloud a:hover,
.footer-widget-2 .wp-block-tag-cloud a:hover,
.footer-widget-3 .wp-block-tag-cloud a:hover {
    background-color: #e8f0fe !important;
    color: #0b57d0 !important;
    border-color: #c2d7fa !important;
    transform: translate3d(0, -2px, 0) !important;
}

.site-footer .site-info {
    border-top: 1px solid #eef2f6 !important;
    padding: 24px 20px 28px !important;
    background-color: #ffffff !important;
    text-align: center !important;
}

.custom-footer-bar {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
}

/* --- DESKTOP (min-width: 769px): SINGLE UNIFIED PILL --- */
@media (min-width: 769px) {
    .footer-credit-stack {
        display: inline-flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 14px !important;
        padding: 8px 24px !important;
        background: linear-gradient(135deg, #ffffff 0%, #e8f0fe 50%, #d8e6fd 100%) !important;
        border: 1px solid #d2e3fc !important;
        border-radius: 9999px !important;
        box-shadow: 0 2px 8px rgba(11, 87, 208, 0.05) !important;
        font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
        transform: translate3d(0, 0, 0) !important;
        backface-visibility: hidden !important;
        will-change: transform, box-shadow !important;
        transition: transform 0.35s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.35s cubic-bezier(0.2, 0, 0, 1), border-color 0.3s ease !important;
    }

    .footer-credit-stack:hover {
        box-shadow: 0 6px 20px rgba(11, 87, 208, 0.12) !important;
        border-color: #b9d5fa !important;
        transform: translate3d(0, -2px, 0) !important;
    }

    .footer-copy-text {
        font-size: 13px !important;
        color: #3c4043 !important;
        letter-spacing: 0.1px !important;
        line-height: 1.4 !important;
    }

    .footer-copy-text strong {
        color: #202124 !important;
        font-weight: 600 !important;
    }

    .footer-pill-divider {
        display: inline-block !important;
        color: #5f6368 !important;
        font-size: 14px !important;
        line-height: 1 !important;
    }

    .footer-author-wrap {
        display: inline-flex !important;
        align-items: center !important;
    }

    .credit-gradient-pill {
        display: inline-flex !important;
        align-items: center !important;
        gap: 5px !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
        font-size: 13px !important;
        color: #3c4043 !important;
        text-decoration: none !important;
    }

    .credit-gradient-pill .spark {
        color: #f59e0b !important;
        font-size: 14px !important;
        display: inline-block !important;
    }

    .credit-gradient-pill strong {
        color: #0b57d0 !important;
        font-weight: 700 !important;
        transition: color 0.2s ease, text-decoration 0.2s ease !important;
    }

    .credit-gradient-pill:hover strong {
        color: #1a73e8 !important;
        text-decoration: underline !important;
    }
}

/* --- MOBILE (max-width: 768px): SEPARATE STACK --- */
@media (max-width: 768px) {
    .footer-credit-stack {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 12px !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
        font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    }

    .footer-copy-text {
        font-size: 13.5px !important;
        color: #5f6368 !important;
        letter-spacing: 0.1px !important;
        line-height: 1.5 !important;
    }

    .footer-copy-text strong {
        color: #202124 !important;
        font-weight: 600 !important;
    }

    .footer-pill-divider {
        display: none !important;
    }

    .footer-author-wrap {
        display: flex !important;
        justify-content: center !important;
    }

    .credit-gradient-pill {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        padding: 7px 18px !important;
        border-radius: 9999px !important;
        background: linear-gradient(135deg, #ffffff 0%, #e8f0fe 50%, #d8e6fd 100%) !important;
        color: #1f1f1f !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        text-decoration: none !important;
        border: 1px solid #d2e3fc !important;
        box-shadow: 0 2px 8px rgba(11, 87, 208, 0.05) !important;
        transform: translate3d(0, 0, 0) !important;
        backface-visibility: hidden !important;
        will-change: transform, box-shadow !important;
        transition: transform 0.35s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.35s cubic-bezier(0.2, 0, 0, 1), border-color 0.3s ease, background 0.3s ease !important;
    }

    .credit-gradient-pill:hover {
        background: linear-gradient(135deg, #ffffff 0%, #dbe9fd 50%, #cbe0fc 100%) !important;
        border-color: #b9d5fa !important;
        transform: translate3d(0, -2px, 0) !important;
        box-shadow: 0 6px 18px rgba(11, 87, 208, 0.12) !important;
    }

    .credit-gradient-pill .spark {
        color: #f59e0b !important;
        display: inline-block !important;
        font-size: 14px !important;
        margin: 0 2px !important;
    }

    .credit-gradient-pill strong {
        font-weight: 700 !important;
        color: #0b57d0 !important;
    }
}

@media (min-width: 601px) and (max-width: 900px) {
    .site-footer .inside-footer-widgets {
        grid-template-columns: 1fr 1fr !important;
        gap: 32px !important;
    }
    .inside-footer-widgets .footer-widget-2 {
        grid-column: 1 / -1 !important;
        order: 3 !important;
    }
}

@media (max-width: 600px) {
    .site-footer #footer-widgets {
        padding: 32px 0 24px 0 !important;
    }
    .site-footer .inside-footer-widgets {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
        padding: 0 16px !important;
    }
}

/* --- 10. MOBILE RESPONSIVE TWEAKS (max-width: 768px) --- */
@media (max-width: 768px) {
    
    .site-header {
        padding: 8px 0 !important;
        margin-bottom: 16px !important;
    }

    .inside-header {
        padding: 8px 16px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        flex-wrap: wrap !important;
    }

    .site-branding {
        margin: 0 !important;
    }

    .main-title a {
        font-size: 22px !important;
        font-weight: 700 !important;
        color: #202124 !important;
        letter-spacing: -0.3px !important;
    }

    /* --- Modern Minimalist Hamburger Icon (Frameless Google Style) --- */
    #mobile-menu-control-wrapper {
        margin: 0 !important;
        line-height: 1 !important;
        height: auto !important;
        display: flex !important;
        align-items: center !important;
    }

    .menu-toggle {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
        line-height: 44px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 0 !important;
        background: transparent !important;
        background-color: transparent !important;
        border: none !important;
        box-shadow: none !important;
        outline: none !important;
        color: #202124 !important;
        cursor: pointer !important;
        flex-grow: 0 !important;
        flex-shrink: 0 !important;
        transition: color 0.2s ease, opacity 0.2s ease !important;
    }

    .menu-toggle:hover,
    .menu-toggle:focus {
        background: transparent !important;
        background-color: transparent !important;
        border: none !important;
        box-shadow: none !important;
        color: #0b57d0 !important;
        outline: none !important;
    }

    
    .mobile-menu-control-wrapper.toggled .menu-toggle,
    .menu-toggle[aria-expanded="true"] {
        background: transparent !important;
        background-color: transparent !important;
        border: none !important;
        box-shadow: none !important;
        color: #0b57d0 !important;
        outline: none !important;
    }

    .menu-toggle .gp-icon {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        line-height: 1 !important;
        height: auto !important;
    }

    .menu-toggle .gp-icon svg {
        width: 24px !important;
        height: 24px !important;
        fill: currentColor !important;
        vertical-align: middle !important;
        transition: transform 0.2s ease, fill 0.2s ease !important;
    }

    
    .menu-toggle .screen-reader-text {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        padding: 0 !important;
        margin: -1px !important;
        overflow: hidden !important;
        clip-path: inset(50%) !important;
        white-space: nowrap !important;
        border: 0 !important;
        display: inline-block !important;
    }

    .menu-toggle .mobile-menu {
        display: none !important;
    }

    /* --- Mobile Dropdown Menu Container (Modern Material Card) --- */
    #site-navigation {
        width: 100% !important;
        flex-basis: 100% !important;
        order: 3 !important;
        margin: 0 !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    #site-navigation .inside-navigation {
        padding: 0 !important;
    }

    #site-navigation .inside-navigation > .menu-toggle {
        display: none !important;
    }

    
    #site-navigation:not(.toggled) {
        display: none !important;
    }

    #site-navigation:not(.toggled) .main-nav {
        display: none !important;
    }

    
    #site-navigation.toggled {
        display: block !important;
    }

    #site-navigation.toggled .main-nav {
        display: block !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
        margin: 8px 0 !important;
    }

    .grid-container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .separate-containers .page-header {
        padding: 20px 16px !important;
        margin-bottom: 14px !important;
        border-radius: 14px !important;
    }

    .page-header .page-title {
        font-size: 1.35rem !important;
    }

    .page-header .taxonomy-description {
        font-size: 14px !important;
    }

    .separate-containers .site-main {
        margin: 0 !important;
    }

    .entry-title, h1.entry-title, h2.entry-title {
        font-size: 1.35rem !important;
        line-height: 1.35 !important;
        margin-bottom: 10px !important;
    }

    .entry-content h2 {
        font-size: 1.2rem !important;
        line-height: 1.35 !important;
        margin-top: 22px !important;
        margin-bottom: 8px !important;
    }

    .wp-block-search .wp-block-search__inside-wrapper {
        padding: 3px 4px 3px 12px !important;
        border-radius: 24px !important;
    }

    .wp-block-search .wp-block-search__input {
        font-size: 13px !important;
        padding: 7px 12px !important;
    }

    .wp-block-search .wp-block-search__button {
        padding: 7px 16px !important;
        font-size: 12.5px !important;
        border-radius: 18px !important;
    }

    

    

    .separate-containers .comments-area {
        padding: 20px 16px !important;
        border-radius: 14px !important;
        margin-top: 16px !important;
    }

    .comment-respond input[type="text"],
    .comment-respond input[type="email"],
    .comment-respond input[type="url"],
    .comment-respond textarea {
        font-size: 14px !important;
        padding: 10px 14px !important;
    }

    .comment-respond input[type="submit"],
    .comment-respond .submit {
        width: 100% !important;
        box-sizing: border-box !important;
        text-align: center !important;
        padding: 12px 20px !important;
        font-size: 15px !important;
    }

    .custom-footer-bar .footer-links {
        gap: 8px;
    }

    .wp-block-table,
    figure.wp-block-table {
        display: block !important;
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .entry-content pre,
    .entry-content code {
        max-width: 100%;
        overflow-x: auto;
        word-break: break-word;
    }
}

/* --- Sidebar Categories List Styling (Handled in Google Design System v7) --- */

/* --- Sidebar Recent Posts Styling (Google Material You Rounded Micro-Cards) --- */
.widget .wp-block-latest-posts {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

.widget .wp-block-latest-posts li {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 16px 18px !important;
    margin: 0 !important;
    background-color: #ffffff !important;
    border: 1px solid #eef2f6 !important;
    border-radius: 20px !important;
    box-shadow: 0 1px 3px rgba(60, 64, 67, 0.04), 0 1px 2px rgba(60, 64, 67, 0.02) !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, box-shadow !important;
    transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1),
                box-shadow 0.3s cubic-bezier(0.2, 0, 0, 1),
                border-color 0.25s ease,
                background-color 0.25s ease !important;
    cursor: pointer !important;
}

.widget .wp-block-latest-posts li::before {
    display: none !important;
    content: none !important;
}

.widget .wp-block-latest-posts li:hover {
    background-color: #ffffff !important;
    border-color: #d2e3fc !important;
    box-shadow: 0 8px 24px rgba(11, 87, 208, 0.08), 0 2px 6px rgba(60, 64, 67, 0.03) !important;
    transform: translate3d(0, -2px, 0) !important;
}

.widget .wp-block-latest-posts li time.wp-block-latest-posts__post-date {
    order: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    width: fit-content !important;
    padding: 3px 11px !important;
    background-color: #f1f3f4 !important;
    color: #54595e !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    border-radius: 9999px !important;
    letter-spacing: 0.2px !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
    margin: 0 !important;
}

.widget .wp-block-latest-posts li:hover time.wp-block-latest-posts__post-date {
    background-color: #e8f0fe !important;
    color: #0b57d0 !important;
}

.widget .wp-block-latest-posts li a,
.widget .wp-block-latest-posts li a.wp-block-latest-posts__post-title {
    order: 2 !important;
    display: block !important;
    max-height: 2.85em !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    line-height: 1.42 !important;
    color: #202124 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
    margin: 0 !important;
}

.widget .wp-block-latest-posts li a.wp-block-latest-posts__post-title::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    border-radius: 20px !important;
    z-index: 1 !important;
}

.widget .wp-block-latest-posts li:hover a,
.widget .wp-block-latest-posts li:hover a.wp-block-latest-posts__post-title {
    color: #0b57d0 !important;
}

/* --- Universal Responsive Guardrails --- */
img, video {
    max-width: 100% !important;
    height: auto;
}

h1, h2, h3, h4, h5, h6, .entry-title, .main-title {
    overflow-wrap: break-word !important;
}

@media (max-width: 480px) {
    .inside-header {
        padding: 8px 12px !important;
    }

    .main-title a {
        font-size: 19px !important;
    }

    .menu-toggle {
        width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    .separate-containers .inside-article,
    .separate-containers .page-header {
        padding: 16px 14px !important;
        border-radius: 12px !important;
    }

    .entry-title, h1.entry-title, h2.entry-title {
        font-size: 1.2rem !important;
        line-height: 1.35 !important;
    }
}

/* --- Official Google Blog (blog.google) Design System v8.1
   - Category Pill: Full Capsule (9999px), #f1f3f4 resting, Google Blue #0b57d0 text, min-height 38px
   - Header Navigation Pills: Exact Same Size as Category Pill (min-height: 38px, padding: 8px 20px, font-size: 13.5px)
   - Hamburger Mobile Menu: Strictly SINGLE Floating Card (border-radius: 24px, zero duplicate outer box)
   - Tag / Topic Section: Beautiful Google Topic Chips with "Explore Topics" heading, comma-free, pastel hover
   - Sidebar Categories: Strictly Single Round Capsule with nested count bubble
   - Single Post UI: Google Eyebrow, 36px Google Sans heading, dual card post navigation, rounded comments
   - Dual-Card Post Navigator (v8.1): Ultra-modern Google Story cards with "← Previous Story" / "Next Story →" badges, zero square hover, smooth elevation
   - Authentic blog.google Pagination: Floating Centered Capsule with circle badges
   - Dropdown Menus: 20px rounded floating card with 14px rounded items --- */

body, button, input, select, textarea {
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

.separate-containers .inside-article {
    background-color: #ffffff !important;
    border-radius: 26px !important;
    border: 1px solid #eef2f6 !important;
    box-shadow: 0 1px 3px rgba(60, 64, 67, 0.04), 0 1px 2px rgba(60, 64, 67, 0.02) !important;
    padding: 34px 36px !important;
    overflow: hidden !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, box-shadow !important;
    transition: transform 0.35s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.35s cubic-bezier(0.2, 0, 0, 1), background-color 0.3s ease, border-color 0.3s ease !important;
}

@media (hover: hover) and (pointer: fine) {
    .blog .separate-containers .inside-article:hover,
    .archive .separate-containers .inside-article:hover {
        background-color: #f8fafd !important;
        border-color: #dadce0 !important;
        box-shadow: 0 14px 34px rgba(60, 64, 67, 0.08), 0 4px 12px rgba(60, 64, 67, 0.04) !important;
        transform: translate3d(0, -3px, 0) !important;
    }
}

.separate-containers .post-image,
.separate-containers .inside-article .post-image {
    margin-bottom: 20px !important;
    border-radius: 18px !important;
    overflow: hidden !important;
}

.separate-containers .post-image img,
.separate-containers .inside-article .post-image img {
    border-radius: 18px !important;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: block !important;
    width: 100% !important;
}

.separate-containers .inside-article:hover .post-image img {
    transform: scale(1.03) !important;
}

.google-card-top-row {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    margin-bottom: 16px !important;
    line-height: 1.4 !important;
}

.google-card-category,
.google-category-tag,
.cat-links a,
.entry-meta .cat-links a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #f1f3f4 !important;
    color: #0b57d0 !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    letter-spacing: 0.15px !important;
    padding: 8px 20px !important;
    min-height: 38px !important;
    border-radius: 9999px !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    transition: background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease !important;
}

.google-card-category:hover,
.google-category-tag:hover,
.cat-links a:hover,
.entry-meta .cat-links a:hover {
    background: linear-gradient(209deg, #e8f0fe 4%, #d2e3fc 100%) !important;
    color: #0b57d0 !important;
    box-shadow: 0 2px 8px rgba(11, 87, 208, 0.15) !important;
    transform: none !important;
}

.google-date-sep {
    color: #5f6368 !important;
    font-size: 10px !important;
}

.google-card-date {
    color: #54595e !important;
    font-size: 13.5px !important;
    font-weight: 400 !important;
}

.separate-containers .entry-title,
.separate-containers h2.entry-title {
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 23px !important;
    font-weight: 600 !important;
    line-height: 1.32 !important;
    color: #202124 !important;
    letter-spacing: -0.3px !important;
    margin: 0 0 12px 0 !important;
    transition: color 0.2s ease !important;
}

.separate-containers .entry-title a {
    color: #202124 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.separate-containers .inside-article:hover .entry-title a,
.separate-containers .entry-title a:hover {
    color: #1a73e8 !important;
}

.separate-containers .entry-summary {
    margin: 0 !important;
}

.separate-containers .entry-summary p {
    font-size: 15px !important;
    line-height: 1.65 !important;
    color: #4a4e51 !important;
    margin-bottom: 0 !important;
}

.blog footer.entry-meta,
.archive footer.entry-meta,
.search footer.entry-meta {
    border-top: 1px solid #f1f3f4 !important;
    padding-top: 18px !important;
    margin-top: 22px !important;
    background: transparent !important;
}

.google-card-footer-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    width: 100% !important;
}

.google-author-comment-group {
    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    font-size: 13px !important;
    color: #5f6368 !important;
    white-space: nowrap !important;
}

.google-author-comment-group .byline {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    color: #5f6368 !important;
    margin: 0 !important;
}

.google-author-comment-group .byline a {
    color: #202124 !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.google-author-comment-group .byline a:hover {
    color: #1a73e8 !important;
}

.google-footer-dot {
    color: #bdc1c6 !important;
    font-size: 10px !important;
}

.google-author-comment-group .comments-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin: 0 !important;
}

.google-author-comment-group .comments-link a {
    color: #5f6368 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.google-author-comment-group .comments-link a:hover {
    color: #1a73e8 !important;
}

.google-read-article-wrap {
    display: inline-flex !important;
    align-items: center !important;
    margin-left: auto !important;
}

.google-read-article-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    background-color: #ffffff !important;
    color: #202124 !important;
    border: 1.5px solid #dadce0 !important;
    border-radius: 9999px !important;
    padding: 7px 18px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.1px !important;
    text-decoration: none !important;
    box-shadow: 0 1px 2px rgba(60, 64, 67, 0.04) !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, box-shadow !important;
    transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.3s cubic-bezier(0.2, 0, 0, 1), background 0.25s ease, border-color 0.25s ease, color 0.25s ease !important;
}

.google-btn-arrow {
    display: inline-block !important;
    font-size: 14px !important;
    line-height: 1 !important;
    transform: translate3d(0, 0, 0) !important;
    will-change: transform !important;
    transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1) !important;
}

.google-read-article-btn:hover {
    background: linear-gradient(209deg, #e8f0fe 4%, #d2e3fc 100%) !important;
    color: #0b57d0 !important;
    border-color: #c2d7fa !important;
    box-shadow: 0 4px 12px rgba(11, 87, 208, 0.15) !important;
    transform: translate3d(0, -1px, 0) !important;
}

.google-read-article-btn:hover .google-btn-arrow {
    transform: translate3d(3px, 0, 0) !important;
}

.sidebar .widget,
.inside-right-sidebar .widget {
    background-color: #ffffff !important;
    border-radius: 26px !important;
    border: 1px solid #eef2f6 !important;
    box-shadow: 0 1px 3px rgba(60, 64, 67, 0.04) !important;
    padding: 26px 24px !important;
    margin-bottom: 24px !important;
}

.sidebar .widget-title,
.sidebar .widget_block .wp-block-heading,
.inside-right-sidebar .widget_block .wp-block-heading,
.inside-right-sidebar .widget-title {
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    color: #202124 !important;
    letter-spacing: -0.2px !important;
    margin: 0 0 16px 0 !important;
    padding-bottom: 12px !important;
    border-bottom: 1px solid #f1f3f4 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.sidebar .widget-title::before,
.sidebar .widget_block .wp-block-heading::before,
.inside-right-sidebar .widget_block .wp-block-heading::before,
.inside-right-sidebar .widget-title::before {
    content: '' !important;
    display: inline-block !important;
    width: 3.5px !important;
    height: 16px !important;
    background: #0b57d0 !important;
    border-radius: 4px !important;
}

.paging-navigation,
.pagination {
    margin: 48px 0 36px 0 !important;
    text-align: center !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.paging-navigation .nav-previous,
.paging-navigation .nav-next {
    display: none !important;
}

.paging-navigation .nav-links,
.pagination .nav-links {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    background-color: #ffffff !important;
    border: 1px solid #eef2f6 !important;
    border-radius: 26px !important;
    padding: 6px 14px !important;
    box-shadow: 0 1px 3px rgba(60, 64, 67, 0.04), 0 1px 2px rgba(60, 64, 67, 0.02) !important;
    box-sizing: border-box !important;
    transition: background-color 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease !important;
}

.paging-navigation .nav-links:hover,
.pagination .nav-links:hover {
    background-color: #f8fafd !important;
    border-color: #dadce0 !important;
    box-shadow: 0 14px 34px rgba(60, 64, 67, 0.08), 0 4px 12px rgba(60, 64, 67, 0.04) !important;
}

.nav-links .page-numbers:not(.next):not(.prev),
.paging-navigation .page-numbers:not(.next):not(.prev) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    border: none !important;
    margin: 0 2px !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, background-color !important;
    transition: transform 0.25s cubic-bezier(0.2, 0, 0, 1), background-color 0.2s ease, color 0.2s ease !important;
}

.nav-links .page-numbers.current,
.paging-navigation .page-numbers.current {
    background-color: #e8f0fe !important;
    color: #0b57d0 !important;
    font-weight: 700 !important;
    border: none !important;
    box-shadow: none !important;
}

.nav-links a.page-numbers:not(.next):not(.prev),
.paging-navigation a.page-numbers:not(.next):not(.prev) {
    background-color: transparent !important;
    color: #3c4043 !important;
    border: none !important;
}

.nav-links a.page-numbers:not(.next):not(.prev):hover,
.paging-navigation a.page-numbers:not(.next):not(.prev):hover {
    background-color: #f1f3f4 !important;
    color: #202124 !important;
    transform: translate3d(0, -1px, 0) !important;
}

.nav-links a.next,
.nav-links a.prev,
.paging-navigation a.next,
.paging-navigation a.prev {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 0 18px !important;
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 9999px !important;
    background-color: #f8fafd !important;
    border: 1px solid #eef2f6 !important;
    color: #0b57d0 !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, box-shadow !important;
    transition: transform 0.25s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.25s cubic-bezier(0.2, 0, 0, 1), background 0.2s ease, border-color 0.2s ease !important;
}

.nav-links a.next:hover,
.nav-links a.prev:hover,
.paging-navigation a.next:hover,
.paging-navigation a.prev:hover {
    background: linear-gradient(209deg, #e8f0fe 4%, #d2e3fc 100%) !important;
    color: #0b57d0 !important;
    border-color: #c2d7fa !important;
    box-shadow: 0 4px 12px rgba(11, 87, 208, 0.15) !important;
    transform: translate3d(0, -1px, 0) !important;
}

.nav-links a.next span,
.paging-navigation a.next span {
    display: inline-block !important;
    font-size: 14px !important;
    line-height: 1 !important;
    transform: translate3d(0, 0, 0) !important;
    will-change: transform !important;
    transition: transform 0.25s cubic-bezier(0.2, 0, 0, 1) !important;
}

.nav-links a.prev span,
.paging-navigation a.prev span {
    display: inline-block !important;
    font-size: 14px !important;
    line-height: 1 !important;
    transform: translate3d(0, 0, 0) !important;
    will-change: transform !important;
    transition: transform 0.25s cubic-bezier(0.2, 0, 0, 1) !important;
}

.nav-links a.next:hover span,
.paging-navigation a.next:hover span {
    transform: translate3d(3px, 0, 0) !important;
}

.nav-links a.prev:hover span,
.paging-navigation a.prev:hover span {
    transform: translate3d(-3px, 0, 0) !important;
}

/* --- 9. Sidebar Categories UI (Strictly Single Round Capsule) --- */

.sidebar .widget_categories ul,
.sidebar .wp-block-categories,
.widget .wp-block-categories-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

.sidebar .widget_categories ul li,
.sidebar .wp-block-categories li,
.sidebar .wp-block-categories-item,
.widget .wp-block-categories-list li {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 0 !important;
    list-style: none !important;
    display: block !important;
    width: 100% !important;
}

.sidebar .widget_categories ul li:hover,
.sidebar .wp-block-categories li:hover,
.widget .wp-block-categories-list li:hover {
    background: transparent !important;
    border: none !important;
    transform: none !important;
}

.sidebar .widget_categories ul li a,
.sidebar .wp-block-categories-item a,
.sidebar .wp-block-categories li a,
.widget .wp-block-categories-list li a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background-color: #f8f9fa !important;
    color: #202124 !important;
    padding: 10px 18px !important;
    min-height: 44px !important;
    border-radius: 9999px !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    border: 1px solid #eef2f6 !important;
    box-sizing: border-box !important;
    width: 100% !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, box-shadow !important;
    transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.3s cubic-bezier(0.2, 0, 0, 1), background 0.25s ease, border-color 0.25s ease, color 0.25s ease !important;
}

.sidebar .topic-count,
.sidebar .wp-block-categories-item__post-count,
.sidebar .cat-count {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #ffffff !important;
    color: #5f6368 !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    padding: 2px 9px !important;
    min-width: 26px !important;
    height: 22px !important;
    border-radius: 9999px !important;
    border: 1px solid #dadce0 !important;
    margin-left: 10px !important;
    line-height: 1 !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease !important;
}

.sidebar .widget_categories ul li a:hover,
.sidebar .wp-block-categories-item a:hover,
.sidebar .wp-block-categories li a:hover,
.widget .wp-block-categories-list li a:hover {
    background: linear-gradient(209deg, #e8f0fe 4%, #d2e3fc 100%) !important;
    color: #0b57d0 !important;
    border-color: #c2d7fa !important;
    transform: translate3d(4px, 0, 0) !important;
    box-shadow: 0 4px 12px rgba(11, 87, 208, 0.1) !important;
}

.sidebar .widget_categories ul li a:hover .topic-count,
.sidebar .wp-block-categories li a:hover .topic-count,
.widget .wp-block-categories-list li a:hover .topic-count {
    background-color: #ffffff !important;
    color: #0b57d0 !important;
    border-color: #0b57d0 !important;
}

/* --- 10. Single Post Page UI Overhaul & Tag Section Fix --- */

.single .inside-article {
    background-color: #ffffff !important;
    border-radius: 28px !important;
    border: 1px solid #eef2f6 !important;
    box-shadow: 0 1px 3px rgba(60, 64, 67, 0.04) !important;
    padding: 44px 50px !important;
}

.single h1.entry-title {
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 36px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.5px !important;
    color: #202124 !important;
    margin: 0 0 16px 0 !important;
}

.single .entry-header .entry-meta {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 14px !important;
    color: #5f6368 !important;
    margin-bottom: 28px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid #f1f3f4 !important;
}

.single .entry-header .entry-meta .posted-on {
    display: none !important;
}

.single .entry-header .entry-meta .byline {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 14px !important;
    color: #5f6368 !important;
}

.single .entry-header .entry-meta a {
    color: #202124 !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.single .entry-header .entry-meta a:hover {
    color: #1a73e8 !important;
}

.single .entry-content p {
    font-size: 17px !important;
    line-height: 1.8 !important;
    color: #2d3135 !important;
    margin-bottom: 24px !important;
    letter-spacing: -0.1px !important;
}

.single .entry-content h2 {
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 26px !important;
    font-weight: 600 !important;
    color: #202124 !important;
    line-height: 1.32 !important;
    margin: 42px 0 18px 0 !important;
    letter-spacing: -0.3px !important;
}

.single .entry-content h3 {
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 21px !important;
    font-weight: 600 !important;
    color: #202124 !important;
    line-height: 1.35 !important;
    margin: 32px 0 14px 0 !important;
}

.single .entry-content img,
.single .post-image img {
    border-radius: 20px !important;
    box-shadow: 0 4px 16px rgba(60, 64, 67, 0.06) !important;
    margin: 20px 0 !important;
}

.single .entry-content li {
    font-size: 16.5px !important;
    line-height: 1.75 !important;
    color: #2d3135 !important;
    margin-bottom: 10px !important;
}

/* --- Material 3 Responsive Data Tables --- */
.wp-block-table,
figure.wp-block-table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 18px !important;
    background-color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(60, 64, 67, 0.05), 0 4px 12px rgba(60, 64, 67, 0.02) !important;
    margin: 32px 0 !important;
}

.entry-content table,
.wp-block-table table {
    width: 100% !important;
    min-width: 580px !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    border: none !important;
    margin: 0 !important;
    font-size: 14.5px !important;
    background: transparent !important;
}

.entry-content th,
.wp-block-table th {
    background: #f8fafd !important;
    color: #1e293b !important;
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.2px !important;
    text-align: left !important;
    padding: 16px 20px !important;
    border: none !important;
    border-bottom: 2px solid #e2e8f0 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    line-height: 1.45 !important;
    vertical-align: bottom !important;
}

.wp-block-table table.has-fixed-layout th:nth-child(1),
.wp-block-table table.has-fixed-layout td:nth-child(1) {
    width: 25% !important;
}

.wp-block-table table.has-fixed-layout th:nth-child(2),
.wp-block-table table.has-fixed-layout td:nth-child(2) {
    width: 37.5% !important;
}

.wp-block-table table.has-fixed-layout th:nth-child(3),
.wp-block-table table.has-fixed-layout td:nth-child(3) {
    width: 37.5% !important;
}

.wp-block-table figcaption,
figure.wp-block-table figcaption {
    padding: 12px 20px 10px 20px !important;
    font-size: 13px !important;
    color: #64748b !important;
    background-color: #f8fafd !important;
    border-top: 1px solid #e2e8f0 !important;
    text-align: left !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}

.entry-content td,
.wp-block-table td {
    padding: 14px 22px !important;
    color: #334155 !important;
    line-height: 1.6 !important;
    border: none !important;
    border-bottom: 1px solid #edf2f7 !important;
    vertical-align: middle !important;
    background: transparent !important;
}

.entry-content td:first-child,
.wp-block-table td:first-child {
    font-weight: 600 !important;
    color: #1e293b !important;
}

.entry-content tr:last-child td,
.wp-block-table tr:last-child td {
    border-bottom: none !important;
}

.entry-content tbody tr,
.wp-block-table tbody tr {
    transition: background-color 0.15s ease !important;
}

.entry-content tbody tr:hover,
.wp-block-table tbody tr:hover {
    background-color: #f8fafd !important;
}

.entry-content tbody tr:hover td,
.wp-block-table tbody tr:hover td {
    color: #0f172a !important;
}

.entry-content pre,
.wp-block-code pre {
    background-color: #1e1e24 !important;
    color: #e8eaed !important;
    padding: 20px 24px !important;
    border-radius: 16px !important;
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace !important;
    font-size: 13.5px !important;
    line-height: 1.65 !important;
    overflow-x: auto !important;
    margin: 24px 0 !important;
    border: 1px solid #2d2e36 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
}

.entry-content code:not(pre code) {
    background-color: #f1f3f4 !important;
    color: #0b57d0 !important;
    padding: 2px 8px !important;
    border-radius: 6px !important;
    font-size: 0.9em !important;
    font-weight: 500 !important;
    border: 1px solid #e2e5e8 !important;
}

.wp-block-pullquote {
    border-top: 2px solid #1a73e8 !important;
    border-bottom: 2px solid #1a73e8 !important;
    padding: 24px !important;
    margin: 32px 0 !important;
    text-align: center !important;
    font-style: italic !important;
    color: #202124 !important;
}

.single footer.entry-meta .gp-icon {
    display: none !important;
}

.single footer.entry-meta {
    border-top: 1px solid #f1f3f4 !important;
    padding-top: 28px !important;
    margin-top: 38px !important;
    background: transparent !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

.single footer.entry-meta .cat-links {
    display: none !important;
}

.single footer.entry-meta .tags-links {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    font-size: 0 !important; 
    position: relative !important;
    padding: 0 !important;
    margin: 0 !important;
}

.single footer.entry-meta .tags-links::before {
    content: "Explore Topics" !important;
    display: block !important;
    width: 100% !important;
    font-family: "Google Sans", sans-serif !important;
    font-size: 15.5px !important;
    font-weight: 600 !important;
    color: #202124 !important;
    letter-spacing: -0.2px !important;
    margin-bottom: 6px !important;
}

.single footer.entry-meta .tags-links a {
    display: inline-flex !important;
    align-items: center !important;
    background-color: #f1f3f4 !important;
    color: #3c4043 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 8px 18px !important;
    min-height: 36px !important;
    border-radius: 9999px !important;
    text-decoration: none !important;
    border: 1px solid transparent !important;
    box-sizing: border-box !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, box-shadow !important;
    transition: transform 0.25s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.25s cubic-bezier(0.2, 0, 0, 1), background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

.single footer.entry-meta .tags-links a:hover {
    background: linear-gradient(209deg, #e8f0fe 4%, #d2e3fc 100%) !important;
    color: #0b57d0 !important;
    border-color: #c2d7fa !important;
    box-shadow: 0 2px 8px rgba(11, 87, 208, 0.12) !important;
    transform: translate3d(0, -1px, 0) !important;
}

.tagcloud,
.wp-block-tag-cloud {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.tagcloud a,
.wp-block-tag-cloud a {
    display: inline-flex !important;
    align-items: center !important;
    background-color: #f1f3f4 !important;
    color: #202124 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 7px 16px !important;
    min-height: 34px !important;
    border-radius: 9999px !important;
    text-decoration: none !important;
    border: 1px solid transparent !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform !important;
    transition: transform 0.25s cubic-bezier(0.2, 0, 0, 1), background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

.tagcloud a:hover,
.wp-block-tag-cloud a:hover {
    background: linear-gradient(209deg, #e8f0fe 4%, #d2e3fc 100%) !important;
    color: #0b57d0 !important;
    border-color: #c2d7fa !important;
}

.archive.tag .page-header {
    background: #ffffff !important;
    border-radius: 26px !important;
    border: 1px solid #eef2f6 !important;
    padding: 32px 36px !important;
    margin-bottom: 30px !important;
    box-shadow: 0 1px 3px rgba(60, 64, 67, 0.04) !important;
}

.archive.tag .page-title {
    font-family: "Google Sans", sans-serif !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #202124 !important;
    margin: 0 !important;
}

/* --- Official blog.google Dual-Card Post Navigator (v8.1) --- */

.post-navigation {
    display: flex !important;
    justify-content: space-between !important;
    align-items: stretch !important;
    gap: 16px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 38px 0 32px 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.post-navigation .nav-previous,
.post-navigation .nav-next,
.post-navigation .prev,
.post-navigation .next {
    flex: 1 1 50% !important;
    display: flex !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    outline: none !important;
}

.post-navigation .nav-previous:only-child,
.post-navigation .nav-next:only-child {
    flex: 1 1 100% !important;
}

.post-navigation .gp-icon {
    display: none !important;
}

.post-navigation .google-nav-card,
.post-navigation a {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    background-color: #ffffff !important;
    border: 1.5px solid #eef2f6 !important;
    border-radius: 24px !important;
    padding: 24px 28px !important;
    text-decoration: none !important;
    width: 100% !important;
    min-height: 138px !important;
    box-shadow: 0 1px 4px rgba(60, 64, 67, 0.05) !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, box-shadow !important;
    transition: transform 0.3s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.3s cubic-bezier(0.2, 0, 0, 1), border-color 0.25s ease, background-color 0.25s ease !important;
    box-sizing: border-box !important;
    outline: none !important;
    overflow: hidden !important;
    background-clip: padding-box !important;
    position: relative !important;
    color: #202124 !important;
}

.post-navigation .google-nav-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.2px !important;
    color: #0b57d0 !important;
    background-color: #f1f3f4 !important;
    border: 1px solid transparent !important;
    min-height: 38px !important;
    padding: 8px 20px !important;
    border-radius: 9999px !important;
    margin-bottom: 14px !important;
    line-height: 1.4 !important;
    box-sizing: border-box !important;
    transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
}

.post-navigation .google-nav-arrow {
    display: inline-block !important;
    font-size: 13px !important;
    line-height: 1 !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform !important;
    transition: transform 0.25s cubic-bezier(0.2, 0, 0, 1) !important;
}

.post-navigation .google-nav-title {
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.42 !important;
    color: #202124 !important;
    letter-spacing: -0.2px !important;
    text-align: left !important;
    margin: 0 !important;
    max-height: 3em !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    transition: color 0.2s ease !important;
}

.post-navigation .google-nav-card:hover,
.post-navigation a:hover {
    background-color: #f8fafd !important;
    border-color: #c2d7fa !important;
    border-radius: 24px !important;
    box-shadow: 0 8px 24px rgba(11, 87, 208, 0.08), 0 2px 6px rgba(60, 64, 67, 0.04) !important;
    transform: translate3d(0, -2px, 0) !important;
    outline: none !important;
}

.post-navigation .google-nav-card:hover .google-nav-badge,
.post-navigation a:hover .google-nav-badge {
    background: linear-gradient(209deg, #e8f0fe 4%, #d2e3fc 100%) !important;
    color: #0b57d0 !important;
    border-color: #c2d7fa !important;
    box-shadow: 0 2px 8px rgba(11, 87, 208, 0.15) !important;
    transform: none !important;
}

.post-navigation .google-nav-card:hover .google-nav-title,
.post-navigation a:hover .google-nav-title {
    color: #0b57d0 !important;
}

.post-navigation .google-nav-card--prev:hover .google-nav-arrow {
    transform: translate3d(-4px, 0, 0) !important;
}

.post-navigation .google-nav-card--next:hover .google-nav-arrow {
    transform: translate3d(4px, 0, 0) !important;
}

.post-navigation a:focus,
.post-navigation a:active,
.post-navigation .google-nav-card:focus,
.post-navigation .google-nav-card:active {
    outline: none !important;
    border-radius: 22px !important;
    box-shadow: 0 0 0 3px rgba(11, 87, 208, 0.2) !important;
}

/* --- Comments System (Google Material 3) --- */
#comments,
.comments-area {
    border-radius: 28px !important;
    border: 1px solid #eef2f6 !important;
    background-color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(60, 64, 67, 0.04) !important;
    padding: 38px 44px !important;
    margin-top: 36px !important;
}

#comments h2.comments-title,
.comment-reply-title {
    font-family: "Google Sans", sans-serif !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    color: #202124 !important;
    margin-bottom: 24px !important;
}

/* Comment List & Threading */
.comment-list {
    list-style: none !important;
    margin: 0 0 32px 0 !important;
    padding: 0 !important;
}

.comment-list li.comment {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Fix GP Default Borders & Threading (Strictly Zero Square Lines) */
.comment-list,
.comment-list .children,
ul.children,
ol.children,
.comment-list li.comment {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    list-style: none !important;
}

.comment-list .children,
ul.children,
ol.children {
    margin: 16px 0 0 28px !important;
    padding: 0 !important;
    border: none !important;
}

/* Comment Card Container */
.comment-body {
    position: relative !important;
    border-radius: 20px !important;
    background-color: #f8f9fa !important;
    border: 1px solid #eef2f6 !important;
    padding: 22px 24px !important;
    margin-bottom: 18px !important;
    box-shadow: 0 1px 2px rgba(60, 64, 67, 0.03) !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.comment-body:hover {
    border-color: #d2e3fc !important;
    box-shadow: 0 2px 8px rgba(11, 87, 208, 0.08) !important;
}

/* Comment Header / Meta */
.comment-meta {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 0 0 12px 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

.comment-meta .avatar {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    float: none !important;
    margin: 0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
}

.comment-author-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.comment-author.vcard {
    font-style: normal !important;
    margin: 0 !important;
}

.comment-author .fn {
    font-family: "Google Sans", sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #1f1f1f !important;
    font-style: normal !important;
    text-decoration: none !important;
}

.comment-author .fn a {
    color: #1f1f1f !important;
    text-decoration: none !important;
}

.comment-author .fn a:hover {
    color: #0b57d0 !important;
}

/* Post Author Verified Badge (bypostauthor) */
.comment-list .bypostauthor .comment-author .fn::after {
    content: 'Author';
    display: inline-flex;
    align-items: center;
    margin-left: 8px;
    padding: 2px 9px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    color: #0842a0;
    background-color: #e8f0fe;
    border: 1px solid #c2d7fa;
    border-radius: 9999px;
    vertical-align: middle;
}

/* Comment Date & Meta */
.comment-metadata,
.comment-metadata time {
    font-size: 12.5px !important;
    color: #475569 !important;
    margin: 0 !important;
}

.comment-metadata a {
    color: #475569 !important;
    text-decoration: none !important;
}

.comment-metadata a:hover {
    color: #0b57d0 !important;
}

/* Remove GP Default Square Inner Block & Padding */
.comment-content {
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 10px 0 0 0 !important;
}

.comment-content p {
    font-size: 15px !important;
    line-height: 1.65 !important;
    color: #3c4043 !important;
    margin: 0 0 12px 0 !important;
}

.comment-content .reply {
    display: block !important;
    margin-top: 10px !important;
}

/* Comment Reply Pill Button */
.comment-reply-link {
    display: inline-flex !important;
    align-items: center !important;
    padding: 5px 16px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    color: #0b57d0 !important;
    background-color: #ffffff !important;
    border: 1px solid #d2e3fc !important;
    border-radius: 9999px !important;
    text-decoration: none !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, background-color !important;
    transition: transform 0.2s cubic-bezier(0.2, 0, 0, 1), background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.comment-reply-link:hover {
    background-color: #e8f0fe !important;
    color: #0842a0 !important;
    border-color: #c2d7fa !important;
    transform: translate3d(0, -1px, 0) !important;
    box-shadow: 0 2px 6px rgba(11, 87, 208, 0.12) !important;
}

/* Cancel Reply Button */
#cancel-comment-reply-link {
    display: inline-flex !important;
    margin-left: 12px !important;
    padding: 4px 12px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #991b1b !important;
    background-color: #fee2e2 !important;
    border: 1px solid #fca5a5 !important;
    border-radius: 9999px !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

#cancel-comment-reply-link:hover {
    background-color: #fecaca !important;
    color: #7f1d1d !important;
}

/* Cookies Consent Checkbox */
.comment-form-cookies-consent {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-size: 13.5px !important;
    color: #5f6368 !important;
    margin: 14px 0 !important;
}

.comment-form-cookies-consent input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    border-radius: 4px !important;
    accent-color: #0b57d0 !important;
    cursor: pointer !important;
    margin: 0 !important;
}

/* Modern Comment Form Inputs */
#commentform input[type="text"],
#commentform input[type="email"],
#commentform input[type="url"],
#commentform textarea,
.comment-respond input[type="text"],
.comment-respond input[type="email"],
.comment-respond input[type="url"],
.comment-respond textarea {
    border-radius: 18px !important;
    border: 1.5px solid #dadce0 !important;
    padding: 14px 18px !important;
    background-color: #ffffff !important;
    outline: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

#commentform input[type="text"]:focus,
#commentform input[type="email"]:focus,
#commentform input[type="url"]:focus,
#commentform textarea:focus,
.comment-respond input:focus,
.comment-respond textarea:focus {
    border-color: #0b57d0 !important;
    box-shadow: 0 0 0 3px rgba(11, 87, 208, 0.15) !important;
    background-color: #ffffff !important;
}

#commentform #submit,
.comment-respond input[type="submit"] {
    border-radius: 9999px !important;
    padding: 12px 32px !important;
    background: linear-gradient(135deg, #0b57d0 0%, #1a73e8 100%) !important;
    color: #ffffff !important;
    border: none !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    box-shadow: 0 2px 6px rgba(11, 87, 208, 0.25) !important;
    cursor: pointer !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, box-shadow !important;
    transition: transform 0.25s cubic-bezier(0.2, 0, 0, 1), background-color 0.2s ease, box-shadow 0.25s ease !important;
}

#commentform #submit:hover,
.comment-respond input[type="submit"]:hover {
    background: linear-gradient(135deg, #0842a0 0%, #0b57d0 100%) !important;
    box-shadow: 0 4px 12px rgba(11, 87, 208, 0.35) !important;
    transform: translate3d(0, -1px, 0) !important;
}

/* Mobile Responsive Comment Adjustments */
@media (max-width: 768px) {
    #comments,
    .comments-area {
        padding: 24px 18px !important;
        border-radius: 20px !important;
    }

    .comment-body {
        padding: 16px 18px !important;
        border-radius: 16px !important;
    }

    .comment-list .children,
    ul.children {
        margin: 12px 0 0 10px !important;
        padding: 0 0 0 12px !important;
    }

    #commentform #submit,
    .comment-respond input[type="submit"] {
        width: 100% !important;
    }
}

/* --- 11. Header Navigation Pills: Exact Same Size as Category Pill --- */

.main-navigation .main-nav ul li a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 38px !important;
    padding: 8px 20px !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    letter-spacing: 0.15px !important;
    line-height: 1.4 !important;
    border-radius: 9999px !important;
    margin: 3px 3px !important;
    box-sizing: border-box !important;
    transform: translate3d(0, 0, 0) !important;
    backface-visibility: hidden !important;
    will-change: transform, background-color !important;
    transition: transform 0.25s cubic-bezier(0.2, 0, 0, 1), background-color 0.2s ease, color 0.2s ease, box-shadow 0.25s ease !important;
}

.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li.sfHover > a {
    background-color: #f1f3f4 !important;
    color: #202124 !important;
    transform: translate3d(0, -1px, 0) !important;
}

.main-navigation .main-nav ul li[class*="current-menu-"] > a {
    background-color: #e8f0fe !important;
    color: #0b57d0 !important;
    font-weight: 600 !important;
}

/* --- 12. Hamburger Mobile Menu: Strictly SINGLE Floating Card --- */

#site-navigation.toggled,
.main-navigation.toggled,
#site-navigation.toggled .inside-navigation,
.main-navigation.toggled .inside-navigation {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

#site-navigation.toggled .main-nav,
.main-navigation.toggled .main-nav {
    display: block !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 8px 0 !important;
}

.main-navigation.toggled .main-nav > ul,
#site-navigation.toggled .main-nav > ul {
    border-radius: 24px !important;
    background-color: #ffffff !important;
    box-shadow: 0 12px 36px rgba(60, 64, 67, 0.12), 0 4px 12px rgba(60, 64, 67, 0.06) !important;
    border: 1px solid #eef2f6 !important;
    padding: 10px !important;
    margin: 8px 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    list-style: none !important;
}

.main-navigation.toggled .main-nav > ul > li,
#site-navigation.toggled .main-nav > ul > li {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    list-style: none !important;
}

.main-navigation.toggled .main-nav > ul > li > a,
#site-navigation.toggled .main-nav > ul > li > a {
    border-radius: 16px !important;
    padding: 12px 18px !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    color: #202124 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: transparent !important;
    text-decoration: none !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1), color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.main-navigation.toggled .main-nav > ul > li:hover > a,
#site-navigation.toggled .main-nav > ul > li:hover > a {
    background-color: #f1f3f4 !important;
    color: #0b57d0 !important;
}

.main-navigation.toggled .main-nav > ul > li[class*="current-menu-"] > a,
#site-navigation.toggled .main-nav > ul > li[class*="current-menu-"] > a {
    background-color: #e8f0fe !important;
    color: #0b57d0 !important;
    font-weight: 600 !important;
}

.menu-toggle {
    border-radius: 0 !important;
    border: none !important;
    background: transparent !important;
    background-color: transparent !important;
    color: #202124 !important;
    padding: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.menu-toggle:hover,
.menu-toggle:focus {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    color: #0b57d0 !important;
    box-shadow: none !important;
}

/* --- 13. Dropdown Menus (Desktop) --- */
.main-navigation ul ul {
    border-radius: 20px !important;
    background-color: #ffffff !important;
    box-shadow: 0 10px 30px rgba(60, 64, 67, 0.12), 0 4px 10px rgba(60, 64, 67, 0.06) !important;
    border: 1px solid #eef2f6 !important;
    padding: 8px !important;
    margin-top: 6px !important;
}

.main-navigation ul ul li a {
    border-radius: 14px !important;
    padding: 10px 18px !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    color: #202124 !important;
    margin: 2px 0 !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1), color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.main-navigation ul ul li:hover > a {
    background-color: #f1f3f4 !important;
    color: #0b57d0 !important;
}

/* --- 14. Full Mobile & Tablet Responsive Engine --- */

@media (max-width: 768px) {
    .separate-containers .inside-article {
        border-radius: 22px !important;
        padding: 22px 20px !important;
    }

    .single .inside-article {
        border-radius: 22px !important;
        padding: 26px 20px !important;
    }

    .single h1.entry-title {
        font-size: 26px !important;
        line-height: 1.3 !important;
    }

    .single .entry-content p {
        font-size: 16px !important;
        line-height: 1.7 !important;
    }

    .sidebar .widget {
        border-radius: 22px !important;
        padding: 20px 18px !important;
    }

    .separate-containers .entry-title,
    .separate-containers h2.entry-title {
        font-size: 18.5px !important;
        line-height: 1.35 !important;
    }

    .google-card-footer-bar {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 14px !important;
    }

    .google-author-comment-group {
        width: 100% !important;
        font-size: 12.5px !important;
    }

    .google-read-article-wrap {
        width: 100% !important;
        margin-left: 0 !important;
    }

    .google-read-article-btn {
        width: 100% !important;
        justify-content: center !important;
        padding: 9px 18px !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    .paging-navigation .nav-links {
        padding: 4px 8px !important;
        gap: 6px !important;
    }

    .nav-links .page-numbers.current,
    .nav-links a.page-numbers:not(.next):not(.prev) {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        font-size: 13px !important;
    }

    .nav-links a.next,
    .nav-links a.prev {
        padding: 4px 12px !important;
        font-size: 12.5px !important;
        height: 34px !important;
    }

    .post-navigation {
        flex-direction: column !important;
        gap: 14px !important;
    }

    .post-navigation .nav-previous,
    .post-navigation .nav-next {
        flex: 1 1 100% !important;
        width: 100% !important;
    }

    #comments,
    .comments-area {
        padding: 24px 20px !important;
        border-radius: 22px !important;
    }
}

@media (max-width: 480px) {
    .google-card-category,
    .google-category-tag,
    .cat-links a {
        padding: 6px 16px !important;
        min-height: 34px !important;
        font-size: 12.5px !important;
        border-radius: 9999px !important;
    }

    .google-card-date {
        font-size: 12px !important;
    }

    .google-author-comment-group {
        font-size: 12px !important;
        gap: 6px !important;
    }
}

/* --- 15. Accessibility & Motion Safety (WCAG 2.1 AA) --- */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
.menu-toggle:focus-visible,
.google-read-article-btn:focus-visible,
.credit-gradient-pill:focus-visible {
    outline: 2px solid #0b57d0 !important;
    outline-offset: 2px !important;
}

/* --- 16. Clean Print & PDF Stylesheet --- */

/* --- 404 Error & No-Results Search Page --- */
.error404 .inside-article,
.search-no-results .no-results .inside-article {
    text-align: center;
    padding: 56px 28px !important;
    max-width: 680px;
    margin: 0 auto;
    border-radius: 24px !important;
    background: #ffffff !important;
}

.error404 .inside-article::before {
    content: "404";
    display: block;
    font-size: clamp(60px, 10vw, 92px);
    font-weight: 800;
    letter-spacing: -2px;
    line-height: 1;
    margin-bottom: 16px;
    background: linear-gradient(135deg, #0b57d0 0%, #1a73e8 50%, #673ab7 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.search-no-results .no-results .inside-article::before {
    content: "0 Results";
    display: block;
    font-size: clamp(32px, 6vw, 48px);
    font-weight: 700;
    letter-spacing: -1px;
    line-height: 1.1;
    margin-bottom: 16px;
    background: linear-gradient(135deg, #0b57d0 0%, #1a73e8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.error404 .entry-header .entry-title,
.search-no-results .no-results .entry-header .entry-title {
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: clamp(22px, 3.5vw, 28px) !important;
    font-weight: 600 !important;
    color: #1f1f1f !important;
    margin-bottom: 12px !important;
}

.error404 .entry-content p,
.search-no-results .no-results .entry-content p {
    font-size: 16px !important;
    line-height: 1.6 !important;
    color: #444746 !important;
    max-width: 480px;
    margin: 0 auto 28px auto !important;
}

.error404 .search-form,
.search-no-results .search-form {
    display: flex !important;
    align-items: center !important;
    max-width: 440px !important;
    margin: 0 auto 16px auto !important;
    background: #ffffff !important;
    border: 1.5px solid #d2e3fc !important;
    border-radius: 9999px !important;
    padding: 4px 6px 4px 18px !important;
    box-shadow: 0 2px 8px rgba(11, 87, 208, 0.08) !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.error404 .search-form:focus-within,
.search-no-results .search-form:focus-within {
    border-color: #0b57d0 !important;
    box-shadow: 0 4px 16px rgba(11, 87, 208, 0.16) !important;
}

.error404 .search-form label,
.search-no-results .search-form label {
    flex: 1 !important;
    margin: 0 !important;
}

.error404 .search-form .search-field,
.search-no-results .search-form .search-field {
    width: 100% !important;
    border: none !important;
    background: transparent !important;
    padding: 8px 4px !important;
    font-size: 15px !important;
    color: #1f1f1f !important;
    outline: none !important;
    box-shadow: none !important;
}

.error404 .search-form .search-submit,
.search-no-results .search-form .search-submit {
    border-radius: 9999px !important;
    background: linear-gradient(135deg, #0b57d0 0%, #1a73e8 100%) !important;
    color: #ffffff !important;
    border: none !important;
    padding: 9px 18px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

.error404 .search-form .search-submit:hover,
.search-no-results .search-form .search-submit:hover {
    transform: scale(1.04) !important;
    box-shadow: 0 2px 8px rgba(11, 87, 208, 0.28) !important;
}

/* --- Back to Top Button (Enforced Fixed Bottom-Right Sovereign Positioning) --- */
.generate-back-to-top,
a.generate-back-to-top {
    position: fixed !important;
    bottom: 30px !important;
    right: 30px !important;
    left: auto !important;
    top: auto !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(20px) !important;
    pointer-events: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    line-height: 48px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    border: 1px solid rgba(11, 87, 208, 0.2) !important;
    box-shadow: 0 4px 14px rgba(11, 87, 208, 0.14), 0 2px 4px rgba(0, 0, 0, 0.04) !important;
    color: #0b57d0 !important;
    z-index: 99999 !important;
    text-decoration: none !important;
    transition: opacity 0.3s cubic-bezier(0.2, 0, 0, 1), transform 0.3s cubic-bezier(0.2, 0, 0, 1), visibility 0.3s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.25s ease, border-color 0.25s ease, background-color 0.25s ease !important;
}

.generate-back-to-top.generate-back-to-top__show,
a.generate-back-to-top.generate-back-to-top__show {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
}

.generate-back-to-top:hover,
.generate-back-to-top:focus,
a.generate-back-to-top:hover,
a.generate-back-to-top:focus {
    background: #ffffff !important;
    border-color: #0b57d0 !important;
    color: #0842a0 !important;
    box-shadow: 0 8px 24px rgba(11, 87, 208, 0.24), 0 3px 8px rgba(0, 0, 0, 0.08) !important;
}

.generate-back-to-top.generate-back-to-top__show:hover,
a.generate-back-to-top.generate-back-to-top__show:hover {
    transform: translateY(-3px) !important;
}

.generate-back-to-top:active,
a.generate-back-to-top:active {
    transform: scale(0.92) !important;
}

.generate-back-to-top .gp-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.generate-back-to-top .gp-icon svg {
    width: 15px !important;
    height: 15px !important;
    fill: #0b57d0 !important;
    transition: transform 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.generate-back-to-top:hover .gp-icon svg {
    transform: translateY(-2px) !important;
    fill: #0842a0 !important;
}

@media (max-width: 768px) {
    .generate-back-to-top,
    a.generate-back-to-top {
        width: 44px !important;
        height: 44px !important;
        line-height: 44px !important;
        bottom: 20px !important;
        right: 20px !important;
        left: auto !important;
    }
}

/* --- 10b. Rich Post Elements & Editorial Typography --- */

/* 1. Redesigned Editorial Blockquote (Zero Left Lines, Symmetrical Card) */
.single blockquote,
.wp-block-quote {
    position: relative !important;
    background: linear-gradient(135deg, #ffffff 0%, #f8fafd 100%) !important;
    border: 1px solid #dce6f5 !important;
    border-radius: 24px !important;
    padding: 32px 36px 28px 36px !important;
    margin: 36px 0 !important;
    box-shadow: 0 4px 20px rgba(11, 87, 208, 0.05), 0 1px 3px rgba(0, 0, 0, 0.03) !important;
}

.single blockquote::before,
.wp-block-quote::before {
    content: "\201C" !important;
    display: block !important;
    font-family: "Georgia", serif !important;
    font-size: 58px !important;
    line-height: 0.7 !important;
    color: #0b57d0 !important;
    opacity: 0.35 !important;
    margin-bottom: 8px !important;
}

.single blockquote p,
.wp-block-quote p {
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 17px !important;
    font-weight: 500 !important;
    line-height: 1.7 !important;
    color: #1e293b !important;
    margin: 0 0 14px 0 !important;
    letter-spacing: -0.1px !important;
}

.single blockquote cite,
.wp-block-quote cite {
    display: block !important;
    margin-top: 16px !important;
    font-family: "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    line-height: 1.6 !important;
    color: #64748b !important;
    font-style: normal !important;
    text-transform: none !important;
    letter-spacing: 0.1px !important;
    border-top: 1px solid #edf2f7 !important;
    padding-top: 14px !important;
}

.single blockquote cite::before,
.wp-block-quote cite::before {
    display: none !important;
}

.single blockquote cite a,
.wp-block-quote cite a {
    color: #0b57d0 !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
    font-weight: 600 !important;
    transition: color 0.15s ease !important;
}

.single blockquote cite a:hover,
.wp-block-quote cite a:hover {
    color: #1a73e8 !important;
}

.single blockquote cite em,
.wp-block-quote cite em {
    font-style: italic !important;
    font-weight: 600 !important;
    color: #334155 !important;
}

/* 2. Premium Centered Pullquote */
.wp-block-pullquote,
figure.wp-block-pullquote {
    position: relative !important;
    margin: 40px auto !important;
    padding: 36px 36px 32px 36px !important;
    text-align: center !important;
    border-radius: 24px !important;
    background: linear-gradient(135deg, #ffffff 0%, #f8fafd 100%) !important;
    border: 1px solid #d2e3fc !important;
    box-shadow: 0 6px 24px rgba(11, 87, 208, 0.08), 0 1px 4px rgba(0, 0, 0, 0.03) !important;
    max-width: 95% !important;
}

.wp-block-pullquote::before {
    content: "\201D" !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 auto 16px auto !important;
    border-radius: 50% !important;
    background: #e8f0fe !important;
    color: #0b57d0 !important;
    font-family: "Georgia", serif !important;
    font-size: 30px !important;
    line-height: 1 !important;
    box-shadow: 0 2px 6px rgba(11, 87, 208, 0.15) !important;
}

.wp-block-pullquote blockquote {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

.wp-block-pullquote blockquote::before {
    display: none !important;
}

.wp-block-pullquote p {
    font-family: "Google Sans", -apple-system, sans-serif !important;
    font-size: clamp(18px, 2.5vw, 22px) !important;
    font-weight: 600 !important;
    font-style: italic !important;
    line-height: 1.55 !important;
    color: #1e293b !important;
    margin: 0 0 14px 0 !important;
}

.wp-block-pullquote cite {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #0b57d0 !important;
    font-style: normal !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
}

/* 3. Custom Numbered Steps List */
.single .entry-content ol:not(.comment-list) {
    counter-reset: custom-step-counter;
    list-style: none !important;
    padding-left: 0 !important;
    margin: 28px 0 !important;
}

.single .entry-content ol:not(.comment-list) > li {
    counter-increment: custom-step-counter;
    position: relative !important;
    padding-left: 44px !important;
    margin-bottom: 18px !important;
    font-size: 15.5px !important;
    line-height: 1.7 !important;
    color: #334155 !important;
}

.single .entry-content ol:not(.comment-list) > li::before {
    content: counter(custom-step-counter) !important;
    position: absolute !important;
    left: 0 !important;
    top: 2px !important;
    width: 28px !important;
    height: 28px !important;
    background: #e8f0fe !important;
    color: #0842a0 !important;
    border: 1px solid #c2d7fa !important;
    border-radius: 50% !important;
    font-family: "Google Sans", sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
}

/* 4. Pill CTA Buttons */
.wp-block-buttons {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
    margin: 32px 0 !important;
}

.wp-block-button .wp-block-button__link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 28px !important;
    border-radius: 9999px !important;
    font-family: "Google Sans", sans-serif !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    letter-spacing: 0.2px !important;
    text-decoration: none !important;
    border: none !important;
    box-shadow: 0 2px 6px rgba(11, 87, 208, 0.25) !important;
    transition: transform 0.2s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.2s ease, background-color 0.2s ease !important;
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link {
    background: linear-gradient(135deg, #0b57d0 0%, #1a73e8 100%) !important;
    color: #ffffff !important;
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
    background: linear-gradient(135deg, #0842a0 0%, #0b57d0 100%) !important;
    box-shadow: 0 6px 16px rgba(11, 87, 208, 0.35) !important;
    transform: translate3d(0, -2px, 0) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link {
    background: #ffffff !important;
    color: #0b57d0 !important;
    border: 1.5px solid #d2e3fc !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
    background: #e8f0fe !important;
    border-color: #0b57d0 !important;
    color: #0842a0 !important;
    transform: translate3d(0, -2px, 0) !important;
}

/* ==========================================================================
   PREMIUM NATIVE GUTENBERG IMAGE & MEDIA SYSTEM
   Material 3 elevation card, hardware-accelerated micro-zoom, AAA figcaption
   ========================================================================== */
.entry-content figure.wp-block-image {
    position: relative !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    border: 1px solid #e2e8f0 !important;
    background: #ffffff !important;
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.07), 0 2px 8px -2px rgba(60, 64, 67, 0.04) !important;
    margin: 36px 0 !important;
    transition: transform 0.35s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.35s ease, border-color 0.3s ease !important;
}

.entry-content figure.wp-block-image:hover {
    transform: translate3d(0, -3px, 0) !important;
    border-color: #c2d7fa !important;
    box-shadow: 0 18px 40px -12px rgba(11, 87, 208, 0.12), 0 4px 12px -2px rgba(60, 64, 67, 0.06) !important;
}

.entry-content figure.wp-block-image img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
    transition: transform 0.45s cubic-bezier(0.2, 0, 0, 1) !important;
    will-change: transform !important;
}

.entry-content figure.wp-block-image:hover img {
    transform: scale(1.025) !important;
}

/* Polished Figcaption (WCAG 2.1 AAA high-contrast slate text) */
.entry-content figure.wp-block-image figcaption,
.entry-content figure.wp-block-image .wp-element-caption {
    padding: 13px 22px !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Google Sans", sans-serif !important;
    font-size: 13.5px !important;
    line-height: 1.55 !important;
    font-weight: 500 !important;
    font-style: normal !important;
    color: #334155 !important;
    text-align: center !important;
    background: linear-gradient(180deg, #f8fafd 0%, #f1f5f9 100%) !important;
    border-top: 1px solid #e2e8f0 !important;
    letter-spacing: 0.15px !important;
}

/* Rounded image variant (e.g. author avatars / circular badges) */
.entry-content figure.wp-block-image.is-style-rounded {
    border-radius: 9999px !important;
    max-width: 160px !important;
    margin: 28px auto !important;
    border: 3px solid #ffffff !important;
    box-shadow: 0 6px 20px rgba(11, 87, 208, 0.15) !important;
}

.entry-content figure.wp-block-image.is-style-rounded img {
    border-radius: 9999px !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
}

/* Gutenberg Native Columns with Media Grid */
.entry-content .wp-block-columns figure.wp-block-image {
    margin: 0 !important;
    border-radius: 18px !important;
    height: 100% !important;
}

.entry-content .wp-block-columns figure.wp-block-image img {
    height: 100% !important;
    object-fit: cover !important;
}

@media print {
    .site-header,
    .sidebar,
    .inside-right-sidebar,
    .site-footer,
    .post-navigation,
    #comments,
    .comments-area,
    .menu-toggle,
    .wp-block-search {
        display: none !important;
    }

    body {
        background: #ffffff !important;
        color: #000000 !important;
    }

    .separate-containers .inside-article {
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
    }
}

/* Responsive Post Elements */
@media (max-width: 768px) {
    .single blockquote,
    .wp-block-quote {
        padding: 20px 20px 16px 20px !important;
        margin: 24px 0 !important;
        border-radius: 18px !important;
    }

    .wp-block-pullquote,
    figure.wp-block-pullquote {
        padding: 24px 20px 20px 20px !important;
        margin: 28px auto !important;
        border-radius: 18px !important;
    }

    .wp-block-group.is-style-notice-info,
    .wp-block-group.is-style-notice-warning,
    .wp-block-group.is-style-notice-success {
        padding: 18px 18px !important;
        margin: 20px 0 !important;
        border-radius: 16px !important;
    }

    .wp-block-columns.is-style-stats-grid {
        gap: 12px !important;
        margin: 24px 0 !important;
    }
}

/* Hide redundant inline read-more link in excerpts (card footer already provides dedicated "Read article →" button) */
.entry-summary a.read-more,
.entry-content a.read-more,
a.read-more {
    display: none !important;
}


/* ==========================================================================
   100% NATIVE WORDPRESS GUTENBERG BLOCK ENHANCEMENTS
   All styles target core Gutenberg classes: zero custom HTML dependencies.
   ========================================================================== */

/* --- 1. Native Gutenberg Columns: Stat Cards Grid (is-style-stats-grid) --- */
.wp-block-columns.is-style-stats-grid {
    gap: 16px !important;
    margin: 32px 0 !important;
}

.wp-block-columns.is-style-stats-grid .wp-block-column {
    background: linear-gradient(135deg, #ffffff 0%, #f8fafd 100%) !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 18px !important;
    padding: 22px 18px !important;
    text-align: center !important;
    box-shadow: 0 2px 8px rgba(60, 64, 67, 0.04) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
}

.wp-block-columns.is-style-stats-grid .wp-block-column:hover {
    transform: translate3d(0, -2px, 0) !important;
    box-shadow: 0 6px 16px rgba(11, 87, 208, 0.1) !important;
    border-color: #c2d7fa !important;
}

.wp-block-columns.is-style-stats-grid .wp-block-column h3,
.wp-block-columns.is-style-stats-grid .wp-block-column .wp-block-heading {
    font-family: "Google Sans", sans-serif !important;
    font-size: clamp(24px, 3.5vw, 32px) !important;
    font-weight: 800 !important;
    color: #0b57d0 !important;
    letter-spacing: -0.5px !important;
    line-height: 1.1 !important;
    margin: 0 0 6px 0 !important;
}

.wp-block-columns.is-style-stats-grid .wp-block-column p {
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #475569 !important;
    margin: 0 !important;
}

/* --- 2. Native Gutenberg Group: Editorial Notice & Callout Cards --- */
.wp-block-group.is-style-notice-info,
.wp-block-group.is-style-notice-warning,
.wp-block-group.is-style-notice-success {
    position: relative !important;
    border-radius: 20px !important;
    padding: 22px 26px !important;
    margin: 28px 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    box-shadow: 0 1px 4px rgba(60, 64, 67, 0.04) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.wp-block-group.is-style-notice-info:hover,
.wp-block-group.is-style-notice-warning:hover,
.wp-block-group.is-style-notice-success:hover {
    box-shadow: 0 4px 14px rgba(60, 64, 67, 0.08) !important;
}

/* Notice inner layout */
.wp-block-group.is-style-notice-info .wp-block-group__inner-container,
.wp-block-group.is-style-notice-warning .wp-block-group__inner-container,
.wp-block-group.is-style-notice-success .wp-block-group__inner-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    width: 100% !important;
}

.wp-block-group.is-style-notice-info .wp-block-group__inner-container > p:first-child,
.wp-block-group.is-style-notice-warning .wp-block-group__inner-container > p:first-child,
.wp-block-group.is-style-notice-success .wp-block-group__inner-container > p:first-child {
    margin: 0 !important;
}

/* Notice badge capsule pills */
.wp-block-group.is-style-notice-info p:first-child strong,
.wp-block-group.is-style-notice-warning p:first-child strong,
.wp-block-group.is-style-notice-success p:first-child strong,
.wp-block-group.is-style-notice-info h4,
.wp-block-group.is-style-notice-warning h4,
.wp-block-group.is-style-notice-success h4,
.wp-block-group.is-style-notice-info .wp-block-group__inner-container > p:first-child strong,
.wp-block-group.is-style-notice-warning .wp-block-group__inner-container > p:first-child strong,
.wp-block-group.is-style-notice-success .wp-block-group__inner-container > p:first-child strong {
    display: inline-flex !important;
    align-items: center !important;
    align-self: flex-start !important;
    font-family: "Google Sans", sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    padding: 4px 12px !important;
    border-radius: 9999px !important;
    width: fit-content !important;
    margin: 0 0 2px 0 !important;
}

/* Notice: Info (Blue) */
.wp-block-group.is-style-notice-info {
    background: linear-gradient(145deg, #ffffff 0%, #f4f8fe 100%) !important;
    border: 1px solid #d2e3fc !important;
}
.wp-block-group.is-style-notice-info p:first-child strong,
.wp-block-group.is-style-notice-info h4,
.wp-block-group.is-style-notice-info .wp-block-group__inner-container > p:first-child strong {
    background-color: #e8f0fe !important;
    color: #0842a0 !important;
    border: 1px solid #c2d7fa !important;
}

/* Notice: Warning (Amber) */
.wp-block-group.is-style-notice-warning {
    background: linear-gradient(145deg, #ffffff 0%, #fffcf5 100%) !important;
    border: 1px solid #fde293 !important;
}
.wp-block-group.is-style-notice-warning p:first-child strong,
.wp-block-group.is-style-notice-warning h4,
.wp-block-group.is-style-notice-warning .wp-block-group__inner-container > p:first-child strong {
    background-color: #fef3c7 !important;
    color: #78350f !important;
    border: 1px solid #fde68a !important;
}

/* Notice: Success (Green) */
.wp-block-group.is-style-notice-success {
    background: linear-gradient(145deg, #ffffff 0%, #f6fbf7 100%) !important;
    border: 1px solid #ceead6 !important;
}
.wp-block-group.is-style-notice-success p:first-child strong,
.wp-block-group.is-style-notice-success h4,
.wp-block-group.is-style-notice-success .wp-block-group__inner-container > p:first-child strong {
    background-color: #dcfce7 !important;
    color: #14532d !important;
    border: 1px solid #bbf7d0 !important;
}

.wp-block-group.is-style-notice-info p:not(:first-child),
.wp-block-group.is-style-notice-warning p:not(:first-child),
.wp-block-group.is-style-notice-success p:not(:first-child),
.wp-block-group.is-style-notice-info .wp-block-group__inner-container > p:not(:first-child),
.wp-block-group.is-style-notice-warning .wp-block-group__inner-container > p:not(:first-child),
.wp-block-group.is-style-notice-success .wp-block-group__inner-container > p:not(:first-child) {
    font-size: 15px !important;
    line-height: 1.65 !important;
    color: #334155 !important;
    margin: 0 !important;
}

/* --- 3. Native Gutenberg Unordered List: Custom Checkmark Badges --- */
.single .entry-content ul.wp-block-list {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 24px 0 !important;
}

.single .entry-content ul.wp-block-list > li {
    position: relative !important;
    padding-left: 28px !important;
    margin-bottom: 12px !important;
    font-size: 15.5px !important;
    line-height: 1.65 !important;
    color: #334155 !important;
}

.single .entry-content ul.wp-block-list > li::before {
    content: "\2713" !important;
    position: absolute !important;
    left: 0 !important;
    top: 2px !important;
    font-weight: 800 !important;
    color: #0b57d0 !important;
    font-size: 14px !important;
    line-height: 1 !important;
}

/* --- 4. Native Gutenberg Preformatted & Verse Blocks --- */
pre.wp-block-preformatted {
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    padding: 46px 22px 20px !important;
    font-family: ui-monospace, SFMono-Regular, "JetBrains Mono", Menlo, Consolas, monospace !important;
    font-size: 13.5px !important;
    line-height: 1.75 !important;
    color: #0f172a !important;
    font-weight: 500 !important;
    box-shadow: 0 4px 18px -2px rgba(15, 23, 42, 0.05), 0 1px 3px rgba(0, 0, 0, 0.02) !important;
    overflow-x: auto !important;
    white-space: pre-wrap !important;
    word-break: break-word !important;
    margin: 28px 0 !important;
}

pre.wp-block-preformatted::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 32px !important;
    background: #f1f5f9 !important;
    border-top-left-radius: 15px !important;
    border-top-right-radius: 15px !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

pre.wp-block-preformatted::after {
    content: "" !important;
    position: absolute !important;
    top: 12px !important;
    left: 16px !important;
    width: 9px !important;
    height: 9px !important;
    border-radius: 50% !important;
    background: #ff5f56 !important;
    box-shadow: 15px 0 0 #ffbd2e, 30px 0 0 #27c93f !important;
}

pre.wp-block-verse {
    position: relative !important;
    font-family: "Playfair Display", "Georgia", "Cambria", "Times New Roman", serif !important;
    font-style: italic !important;
    font-size: 17.5px !important;
    line-height: 1.9 !important;
    color: #1e293b !important;
    background: linear-gradient(135deg, #ffffff 0%, #fbfbfa 60%, #f7f5ef 100%) !important;
    border: 1px solid #e5dfd5 !important;
    border-radius: 20px !important;
    padding: 34px 32px 30px !important;
    margin: 32px auto !important;
    text-align: center !important;
    box-shadow: 0 6px 24px -4px rgba(40, 30, 20, 0.05), 0 1px 3px rgba(0, 0, 0, 0.02) !important;
    white-space: pre-wrap !important;
    word-break: break-word !important;
    max-width: 100% !important;
}

pre.wp-block-verse::before {
    content: "✦  ✦  ✦" !important;
    display: block !important;
    font-style: normal !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 7px !important;
    color: #9a7b56 !important;
    margin: 0 auto 16px auto !important;
    text-align: center !important;
    opacity: 0.85 !important;
}

pre.wp-block-verse::after {
    content: "" !important;
    display: block !important;
    width: 42px !important;
    height: 2px !important;
    background: linear-gradient(90deg, transparent, #c8b99d, transparent) !important;
    margin: 18px auto 0 auto !important;
    border-radius: 2px !important;
}

@media (max-width: 600px) {
    pre.wp-block-preformatted {
        padding: 42px 16px 16px !important;
        font-size: 12.5px !important;
        margin: 20px 0 !important;
    }
    pre.wp-block-verse {
        padding: 26px 18px 22px !important;
        font-size: 15.5px !important;
        line-height: 1.8 !important;
        margin: 24px auto !important;
    }
}

/* --- 5. Native Gutenberg Separator (Divider) --- */
hr.wp-block-separator {
    border: none !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent 0%, #d2e3fc 50%, transparent 100%) !important;
    margin: 36px auto !important;
    max-width: 85% !important;
}


/* ==========================================================================
   POST STATUS & VISIBILITY DESIGN SYSTEM (STICKY, PRIVATE, PROTECTED, PREVIEWS)
   ========================================================================== */

/* 1. Status Badges & Pills (Sticky, Private, Protected) */
.google-status-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-family: "Google Sans", sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.4px !important;
    text-transform: uppercase !important;
    padding: 3px 9px !important;
    border-radius: 9999px !important;
    line-height: 1.2 !important;
    vertical-align: middle !important;
}

.google-status-pill .pill-icon {
    font-size: 11px !important;
    line-height: 1 !important;
}

/* Sticky Pill (Blue Tonal) */
.google-status-pill--sticky {
    background-color: #e8f0fe !important;
    color: #0842a0 !important;
    border: 1px solid #c2d7fa !important;
}

/* Private Pill (Purple Tonal) */
.google-status-pill--private {
    background-color: #f3e8ff !important;
    color: #581c87 !important;
    border: 1px solid #e9d5ff !important;
}

/* Protected Pill (Amber Tonal) */
.google-status-pill--protected {
    background-color: #fef3c7 !important;
    color: #78350f !important;
    border: 1px solid #fde68a !important;
}

/* 2. Elevated Sticky Feed Card */
article.sticky .inside-article {
    border: 1.5px solid #c2d7fa !important;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
    box-shadow: 0 6px 20px -4px rgba(11, 87, 208, 0.1), 0 2px 6px -1px rgba(60, 64, 67, 0.04) !important;
}

article.sticky .inside-article:hover {
    border-color: #0b57d0 !important;
    box-shadow: 0 14px 32px -6px rgba(11, 87, 208, 0.18), 0 4px 10px -2px rgba(60, 64, 67, 0.06) !important;
}

/* 3. Password Protected Card Excerpt */
.google-protected-excerpt {
    font-size: 14.5px !important;
    line-height: 1.6 !important;
    color: #475569 !important;
    background: #fffcf5 !important;
    border: 1px dashed #fde68a !important;
    border-radius: 12px !important;
    padding: 12px 16px !important;
    margin: 12px 0 0 0 !important;
}

.google-protected-excerpt .lock-icon {
    margin-right: 4px !important;
}

/* 4. Google Material 3 Security Verification Card (Single Post Password Form) */
.google-protected-post-card {
    max-width: 540px !important;
    margin: 48px auto !important;
    padding: 38px 32px !important;
    text-align: center !important;
    background: linear-gradient(145deg, #ffffff 0%, #f8fafd 100%) !important;
    border: 1px solid #d2e3fc !important;
    border-radius: 24px !important;
    box-shadow: 0 10px 30px -8px rgba(11, 87, 208, 0.12), 0 2px 6px -1px rgba(0, 0, 0, 0.03) !important;
}

.google-protected-post-card .protected-icon-wrap {
    width: 60px !important;
    height: 60px !important;
    margin: 0 auto 18px auto !important;
    border-radius: 50% !important;
    background: #e8f0fe !important;
    color: #0b57d0 !important;
    border: 1px solid #c2d7fa !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 14px rgba(11, 87, 208, 0.16) !important;
}

.google-protected-post-card .protected-heading {
    font-family: "Google Sans", sans-serif !important;
    font-size: clamp(20px, 3vw, 24px) !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    margin: 0 0 8px 0 !important;
    letter-spacing: -0.3px !important;
}

.google-protected-post-card .protected-desc {
    font-size: 14.5px !important;
    line-height: 1.65 !important;
    color: #475569 !important;
    margin: 0 0 26px 0 !important;
}

.google-password-form .password-input-group {
    display: flex !important;
    gap: 10px !important;
    justify-content: center !important;
    align-items: center !important;
}

.google-password-input {
    flex: 1 !important;
    max-width: 280px !important;
    padding: 12px 20px !important;
    font-family: inherit !important;
    font-size: 14.5px !important;
    color: #1e293b !important;
    background: #ffffff !important;
    border: 1.5px solid #d2e3fc !important;
    border-radius: 9999px !important;
    outline: none !important;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.google-password-input:focus {
    border-color: #0b57d0 !important;
    box-shadow: 0 0 0 3px rgba(11, 87, 208, 0.15) !important;
}

.google-password-submit {
    padding: 12px 26px !important;
    font-family: "Google Sans", sans-serif !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #0b57d0 0%, #1a73e8 100%) !important;
    border: none !important;
    border-radius: 9999px !important;
    cursor: pointer !important;
    box-shadow: 0 2px 6px rgba(11, 87, 208, 0.25) !important;
    transition: transform 0.2s cubic-bezier(0.2, 0, 0, 1), box-shadow 0.2s ease, background-color 0.2s ease !important;
    white-space: nowrap !important;
}

.google-password-submit:hover {
    transform: translate3d(0, -2px, 0) !important;
    box-shadow: 0 6px 16px rgba(11, 87, 208, 0.35) !important;
    background: linear-gradient(135deg, #0842a0 0%, #0b57d0 100%) !important;
}

@media (max-width: 600px) {
    .google-protected-post-card {
        padding: 28px 20px !important;
        margin: 32px 0 !important;
        border-radius: 20px !important;
    }

    .google-password-form .password-input-group {
        flex-direction: column !important;
        width: 100% !important;
    }

    .google-password-input {
        max-width: 100% !important;
        width: 100% !important;
    }

    .google-password-submit {
        width: 100% !important;
    }
}

/* 5. Editorial Preview Banners (Single Post View for Draft, Pending, Scheduled, Private) */
.google-editorial-banner {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    padding: 14px 20px !important;
    border-radius: 16px !important;
    margin: 0 0 28px 0 !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
}

.google-editorial-banner .banner-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-family: "Google Sans", sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    padding: 4px 12px !important;
    border-radius: 9999px !important;
    line-height: 1 !important;
}

.google-editorial-banner .banner-text {
    flex: 1 !important;
    min-width: 200px !important;
}

/* Draft Banner */
.google-editorial-banner--draft {
    background: linear-gradient(135deg, #fffcf5 0%, #fef3c7 100%) !important;
    border: 1px solid #fde68a !important;
    color: #78350f !important;
}
.google-editorial-banner--draft .banner-badge {
    background: #fef3c7 !important;
    color: #78350f !important;
    border: 1px solid #fde293 !important;
}

/* Pending Review Banner */
.google-editorial-banner--pending {
    background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%) !important;
    border: 1px solid #e9d5ff !important;
    color: #581c87 !important;
}
.google-editorial-banner--pending .banner-badge {
    background: #f3e8ff !important;
    color: #581c87 !important;
    border: 1px solid #d8b4fe !important;
}

/* Scheduled Banner */
.google-editorial-banner--scheduled {
    background: linear-gradient(135deg, #f0fdfa 0%, #ccfbf1 100%) !important;
    border: 1px solid #99f6e4 !important;
    color: #115e59 !important;
}
.google-editorial-banner--scheduled .banner-badge {
    background: #ccfbf1 !important;
    color: #115e59 !important;
    border: 1px solid #5eead4 !important;
}

/* Private Banner */
.google-editorial-banner--private {
    background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%) !important;
    border: 1px solid #ddd6fe !important;
    color: #4c1d95 !important;
}
.google-editorial-banner--private .banner-badge {
    background: #ede9fe !important;
    color: #4c1d95 !important;
    border: 1px solid #c4b5fd !important;
}


/* ==========================================================================
   Apple iOS (Safari & WebKit) Specific Optimizations & Mobile Usability Fixes
   ========================================================================== */

/* 1. Prevent iOS Safari orientation landscape auto-zoom & text distortion */
html {
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
}

/* 2. Apple Retina OLED ultra-sharp font smoothing */
body {
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

/* 3. Remove default ugly translucent grey tap highlight box on iPhone */
* {
    -webkit-tap-highlight-color: transparent;
}

/* 4. Instant button click response (removes 300ms tap delay on iOS) */
a, button, [role="button"], input[type="submit"], .google-read-article-btn, .google-nav-card {
    touch-action: manipulation;
}

/* 5. Prevent the infamous iOS Safari Auto-Zoom bug on all form inputs (< 16px triggers zoom) */
@media screen and (max-width: 768px) {
    input[type="text"],
    input[type="search"],
    input[type="email"],
    input[type="url"],
    input[type="password"],
    input[type="tel"],
    input[type="number"],
    textarea,
    select,
    .search-field,
    .wp-block-search__input,
    .google-password-input {
        font-size: 16px !important;
        -webkit-appearance: none;
        appearance: none;
    }
}

/* 6. iPhone Notch, Dynamic Island, and Home Indicator Bar Safe Area Insets */
.site-footer,
.custom-footer-bar,
.site-info,
.google-nav-card,
.footer-credit-stack {
    padding-bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important;
    padding-left: max(16px, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(16px, env(safe-area-inset-right, 0px)) !important;
}

/* 7. Inertial momentum scrolling for code blocks, pre, and data tables on iOS */
.wp-block-table,
figure.wp-block-table,
.entry-content pre,
.wp-block-code pre,
pre.wp-block-preformatted {
    -webkit-overflow-scrolling: touch;
}



/* --- Master Material 3 Rounded Cards (20px Symmetrical Elevation) --- */
.entry-content aside.wp-block-group,
.wp-block-group.has-border-color.has-background,
aside.single-post-author-card,
.daily-protocol-card {
    border-radius: 20px !important;
    border: 1px solid #dce6f5 !important;
    box-shadow: 0 4px 20px rgba(11, 87, 208, 0.04), 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}

.wp-block-table,
figure.wp-block-table {
    border-radius: 20px !important;
}