/**
 * Responsive desktop – single layout for all viewports
 * Mobile-only markup removed; desktop header/footer/content show on all sizes.
 */

/* visible-xs / hidden-xs for mobile only: defined in mobile-home-visibility.css (loads after this) */

/* ----- Responsive header: mobile-style on small screens (same look as old mobile, desktop code only) ----- */

/* Hamburger: visible on tablet + mobile (991px and below); always visible so menu icon shows at any display size */
.headerNavToggle {
    display: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    min-width: 40px;
    height: 40px;
    padding: 0;
    border: none;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    font-size: 1.4rem;
    cursor: pointer;
    flex-shrink: 0;
}
.headerNavToggle:hover,
.headerNavToggle:focus {
    background: rgba(255, 255, 255, 0.25);
    color: #fff;
}

/* Category strip: hidden on desktop */
.headerCategoryStrip {
    display: none;
}

@media (max-width: 991px) {
    /* Tablet: show category strip (main menu) below header */
    .headerCategoryStrip {
        display: block !important;
        background: #fff;
        border-bottom: 1px solid #e8e8e8;
        overflow: hidden;
    }
    .headerCategoryStripInner {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        width: 100%;
    }
    .headerCategoryStripInner::-webkit-scrollbar {
        display: none;
    }
    .headerCategoryStripList {
        display: flex;
        list-style: none;
        margin: 0;
        padding: 0 16px;
        gap: 0;
        flex-wrap: nowrap;
        white-space: nowrap;
        width: max-content;
    }
    .headerCategoryStripList li {
        flex-shrink: 0;
    }
    .headerCategoryStripList a {
        display: block;
        padding: 10px 14px;
        font-size: 1.35rem;
        font-weight: 500;
        color: #333;
        text-decoration: none;
        border-bottom: 2px solid transparent;
    }
    .headerCategoryStripList a:hover {
        color: #dc2627;
        border-bottom-color: #dc2627;
    }
}

@media (max-width: 991px) {
    /* Tablet + mobile: hide beta badge */
    .site-header--modern .beta-version-badge {
        display: none !important;
    }
    /* Tablet + mobile: center the logo */
    .site-header--modern .headerBarLogoCol {
        justify-content: center;
    }
    .site-header--modern .headerBarLogo {
        justify-content: center;
    }
    /* Tablet + mobile: menu icon (left) and search icon (right) always visible; 16px padding matches category strip & ticker */
    .site-header--modern .navbar.headerBarOneLine {
        padding: 12px 16px;
    }
    .site-header--modern .navbar .container {
        padding-left: 0;
        padding-right: 0;
    }
    .headerNavToggle {
        display: flex !important;
        order: 1;
        flex-shrink: 0;
    }
    .site-header--modern .headerBarMenuCol {
        display: none !important;
    }
    .site-header--modern .headerBarLogoCol {
        order: 2;
        flex: 1;
        min-width: 0;
    }
    .site-header--modern .headerBarActionsCol {
        order: 3;
        flex-shrink: 0;
    }
    .site-header--modern .headerBarActions .headerBarSearchLink {
        flex-shrink: 0;
    }
}

@media (max-width: 767px) {
    /* Small: mobile-style – fixed navbar + category strip (always visible); ticker scrolls with content */
    /* Align header, category strip, ticker to same left/right edges (red bar alignment) */
    .site-header--modern {
        position: relative;
        z-index: 1000;
        box-shadow: none;
        display: flex;
        flex-direction: column;
    }
    .site-header--modern .headerTopSection {
        display: none !important;
    }
    /* Main menu (red bar) fixed at top – equal left/right padding, full width */
    .site-header--modern .navbar.headerBarOneLine {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        z-index: 1001;
        padding: 12px 16px;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    }
    /* Container: no extra padding – navbar 16px creates content edge; matches category strip & ticker */
    .site-header--modern .navbar .container {
        width: 100%;
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .site-header--modern .headerBarRow {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: nowrap;
        margin-left: 0;
        margin-right: 0;
        gap: 8px;
    }
    .site-header--modern .headerBarRow .col-md-2,
    .site-header--modern .headerBarRow .col-md-8,
    .site-header--modern .headerBarRow .col-sm-3,
    .site-header--modern .headerBarRow .col-sm-6 {
        flex: 0 0 auto;
        max-width: none;
        padding-left: 0;
        padding-right: 0;
    }
    /* Left: menu icon – always visible, never shrinks */
    .headerNavToggle {
        display: flex !important;
        order: 1;
        flex-shrink: 0;
    }
    .site-header--modern .headerBarLogoCol {
        order: 2;
        flex: 1;
        min-width: 0;
        justify-content: center;
        display: flex;
    }
    .site-header--modern .headerBarLogo {
        height: 48px;
        justify-content: center;
    }
    .site-header--modern .headerBarLogoImg {
        max-height: 36px;
        filter: brightness(0) invert(1);
    }
    .site-header--modern .headerBarLogo .logo-text-fallback {
        color: #fff;
        font-size: 2.2rem;
    }
    .site-header--modern .headerBarMenuCol {
        display: none !important;
    }
    /* Right: search icon – always visible, never shrinks */
    .site-header--modern .headerBarActionsCol {
        order: 3;
        flex: 0 0 auto;
        flex-shrink: 0;
    }
    .site-header--modern .headerBarActions .headerBarSearchLink {
        flex-shrink: 0;
        min-width: 40px;
    }
    /* Hide only the categories button on mobile; keep search icon */
    .site-header--modern .headerBarActions #headerCategoriesToggle {
        display: none !important;
    }
    .site-header--modern .headerBarActions .headerBarSearchLink {
        color: #fff !important;
        background: rgba(255, 255, 255, 0.15) !important;
    }
    .site-header--modern .headerBarActions .headerBarSearchLink:hover {
        background: rgba(255, 255, 255, 0.25) !important;
        color: #fff !important;
    }
    /* Category strip fixed below navbar – matches header left/right padding */
    .site-header--modern .headerCategoryStrip {
        order: 1;
        position: fixed;
        top: 72px; /* navbar height: 12+48+12 padding+logo */
        left: 0;
        right: 0;
        z-index: 1000;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
    }
    /* Ticker in normal flow; margin-top so it appears fully below fixed navbar + category strip (no overlap) */
    .site-header--modern .headerTickerBar {
        order: 2;
        margin-top: 128px; /* 72px navbar + ~56px category strip */
        padding: 10px 0 12px;
    }
    .site-header--modern .headerTickerBar .container {
        width: 100%;
        max-width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }
    .site-header--modern .headerTickerBarInner {
        height: 34px;
        min-height: 34px;
    }
    .site-header--modern .headerTickerLabel {
        width: 90px;
        min-width: 90px;
        font-size: 0.95rem;
    }
    .site-header--modern .headerTickerItem {
        font-size: 0.95rem;
    }
    /* Main menu (category strip) – horizontal scroll, equal padding, proper overflow */
    .headerCategoryStrip {
        display: block;
        background: #fff;
        border-bottom: 1px solid #e8e8e8;
        overflow: hidden;
    }
    .headerCategoryStripInner {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .headerCategoryStripInner::-webkit-scrollbar {
        display: none;
    }
    .headerCategoryStripList {
        display: flex;
        list-style: none;
        margin: 0;
        padding: 0 16px;
        gap: 0;
        flex-wrap: nowrap;
        white-space: nowrap;
        width: max-content;
    }
    .headerCategoryStripList li {
        flex-shrink: 0;
    }
    .headerCategoryStripList a {
        display: block;
        padding: 10px 14px;
        font-size: 1.35rem;
        font-weight: 500;
        color: #333;
        text-decoration: none;
        border-bottom: 2px solid transparent;
    }
    .headerCategoryStripList a:hover {
        color: #dc2627;
        border-bottom-color: #dc2627;
    }
}

/* ----- Same categories sidebar on mobile: open from left, full viewport (overlaps category strip) ----- */
@media (max-width: 767px) {
    .headerCategoriesSidebar {
        left: 0;
        right: auto;
        top: 0;
        height: 100vh;
        transform: translateX(-100%);
        box-shadow: 4px 0 20px rgba(0, 0, 0, 0.12);
    }
    .headerCategoriesSidebar.is-open {
        transform: translateX(0);
    }
}

/* ----- Responsive footer ----- */
@media (max-width: 767px) {
    .desktopFooter {
        margin-top: 24px;
    }
    .desktopFooter .container {
        width: 100%;
        max-width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }
    /* Top row: stack logo and social, center */
    .desktopFooter .footerTopRow {
        padding: 20px 0;
    }
    .desktopFooter .footerTopRowInner {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 16px;
    }
    .desktopFooter .footerLogo {
        margin-bottom: 0;
    }
    .desktopFooter .footerLogo img {
        height: 48px;
        max-width: 100%;
    }
    .desktopFooter .footerLogo .logo-text-fallback {
        font-size: 2rem;
    }
    .desktopFooter .footerSocialLinks {
        justify-content: center;
        gap: 10px;
    }
    .desktopFooter .footerSocialBtn {
        width: 40px;
        height: 40px;
        font-size: 1.35rem;
    }
    /* Contact block: center, smaller text, wrap-friendly; extra padding before menu */
    .desktopFooter .footerContactBlock {
        padding: 18px 0 24px 0;
    }
    .desktopFooter .footerContactSingle {
        align-items: center;
        text-align: center;
        gap: 6px;
    }
    .desktopFooter .footerContactSingle .footerContactItem {
        font-size: 1.35rem;
        line-height: 1.5;
        word-break: break-word;
    }
    .desktopFooter .footerContactSingle .footerContactLine {
        text-align: center;
    }
    .desktopFooter .footerContactSingle .footerContactLine a {
        word-break: break-all;
    }
    /* Legal bar – mobile: padding after address section, then menu */
    .desktopFooter .footerLegalBar {
        padding: 20px 16px 16px;
        background: #fff;
        border-top: 1px solid #e8e8e8;
    }
    .desktopFooter .footerLegalBar .container {
        padding-left: 0;
        padding-right: 0;
    }
    .desktopFooter .footerLegalNav {
        padding: 0;
    }
    .desktopFooter .footerLegalList {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        list-style: none;
        margin: 0;
        padding: 0;
    }
    .desktopFooter .footerLegalList li {
        background: #f5f5f5;
        border: none;
        border-radius: 8px;
        min-height: 64px;
    }
    /* When odd number of items, last item alone on row – span both columns and center */
    .desktopFooter .footerLegalList li:last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }
    .desktopFooter .footerLegalList li + li::before {
        content: none;
        display: none;
        margin: 0;
    }
    .desktopFooter .footerLegalList a {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 14px 12px;
        font-size: 1.35rem;
        color: #333;
        text-decoration: none;
        line-height: 1.4;
        min-height: 64px;
        box-sizing: border-box;
        -webkit-tap-highlight-color: transparent;
        transition: background 0.2s ease, color 0.2s ease;
        text-align: center;
    }
    .desktopFooter .footerLegalList a:hover,
    .desktopFooter .footerLegalList a:active {
        background: #eee;
        color: #dc2627;
    }
    /* Copyright bar */
    .desktopFooter .footerBottomBar {
        padding: 14px 0;
    }
    .desktopFooter .footerCopyright {
        font-size: 1.25rem;
        line-height: 1.5;
        padding: 0 8px;
        word-break: break-word;
    }
}

/* Footer: extra small screens */
@media (max-width: 480px) {
    .desktopFooter .container {
        padding-left: 12px;
        padding-right: 12px;
    }
    .desktopFooter .footerTopRow {
        padding: 16px 0;
    }
    .desktopFooter .footerLogo img {
        height: 42px;
    }
    .desktopFooter .footerLogo .logo-text-fallback {
        font-size: 1.75rem;
    }
    .desktopFooter .footerSocialBtn {
        width: 36px;
        height: 36px;
        font-size: 1.25rem;
    }
    .desktopFooter .footerContactSingle .footerContactItem {
        font-size: 1.25rem;
    }
    .desktopFooter .footerLegalNav {
        padding: 0 12px;
    }
    .desktopFooter .footerLegalList li {
        min-height: 60px;
    }
    .desktopFooter .footerLegalList a {
        padding: 12px 14px;
        font-size: 1.25rem;
        min-height: 60px;
    }
    .desktopFooter .footerCopyright {
        font-size: 1.15rem;
    }
}

/* Body padding: desktop no offset; small screens offset for fixed header height */
body {
    padding-top: 0 !important;
}

.mainDiv {
    margin-top: 10px;
}

@media (max-width: 767px) {
    .mainDiv {
        margin-top: 15px;
    }
}

/* ========== Single post: responsive + mobile readability ========== */
@media (max-width: 767px) {
    /* Layout: comfortable padding, full-width content (no sidebar overlap) */
    .bgWHite.marginT40 .container {
        width: 100%;
        max-width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }
    .singlePostReconcept {
        margin-bottom: 24px;
    }
    .singlePostReconcept .singlePostBody {
        margin-bottom: 28px;
    }
    /* Subtitle / shoulder */
    .singlePostReconcept .singlePostShoulder {
        font-size: 1.25rem;
        line-height: 1.5;
        margin-bottom: 12px;
    }
    /* Headline: smaller on mobile but still prominent, readable line height */
    .singlePostReconcept .singlePostHeadline {
        font-size: 1.65rem !important;
        line-height: 1.35 !important;
        margin-bottom: 18px !important;
        letter-spacing: -0.01em;
    }
    /* Author box: minimal on mobile – compact single row, smaller avatar and text */
    .singlePostReconcept .singlePostAuthorBox {
        margin-bottom: 16px;
    }
    .singlePostReconcept .singlePostAuthorBoxInner {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        padding: 10px 12px;
        gap: 10px;
        flex-wrap: nowrap;
    }
    .singlePostReconcept .singlePostAuthorSection {
        width: auto;
        flex: 1;
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .singlePostReconcept .singlePostAuthorAvatarBox {
        flex-shrink: 0;
    }
    .singlePostReconcept .singlePostAuthorAvatarNew {
        width: 36px;
        height: 36px;
    }
    .singlePostReconcept .singlePostAuthorText {
        min-width: 0;
        flex: 1;
    }
    .singlePostReconcept .singlePostAuthorNameBox {
        margin-bottom: 0;
        gap: 6px;
    }
    .singlePostReconcept .singlePostAuthorPenIcon {
        font-size: 0.9rem;
    }
    .singlePostReconcept .singlePostAuthorNameLink {
        font-size: 1.15rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .singlePostReconcept .singlePostAuthorDateBox {
        gap: 4px;
    }
    .singlePostReconcept .singlePostAuthorClockIcon {
        font-size: 0.85rem;
    }
    .singlePostReconcept .singlePostAuthorDateNew {
        font-size: 1.05rem;
        color: #666;
    }
    /* Name and date in one compact row */
    .singlePostReconcept .singlePostAuthorText {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 4px 10px;
    }
    .singlePostReconcept .singlePostAuthorNameBox {
        flex: 0 0 auto;
    }
    .singlePostReconcept .singlePostAuthorDateBox {
        flex: 0 0 auto;
    }
    /* Mobile: hide share in author box (share moves to end of article) */
    .singlePostReconcept .singlePostShareBoxDesktop {
        display: none !important;
    }
    /* Share at end of article (mobile only): label on first line, all icons on one line */
    .singlePostReconcept .singlePostShareBoxEnd {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        padding: 18px 0;
        border-top: 1px solid #e8e8e8;
    }
    .singlePostShareBoxEndLabel {
        flex: 0 0 100%;
        font-size: 1.15rem;
        font-weight: 600;
        color: #333;
        margin: 0 0 14px 0;
        display: block;
    }
    .singlePostReconcept .singlePostShareBoxEndIcons {
        flex: 0 0 100%;
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 10px;
        min-width: 0;
    }
    .singlePostReconcept .singlePostShareBoxEndIcons .singlePostShareBtn {
        flex-shrink: 0;
        width: 44px;
        height: 44px;
        min-width: 44px;
        min-height: 44px;
    }
    .singlePostReconcept .singlePostShareBoxEndIcons .singlePostShareBtn i {
        font-size: 1.3rem !important;
    }
    .singlePostReconcept .singlePostShareBtn {
        width: 40px;
        height: 40px;
        min-width: 40px;
        min-height: 40px;
    }
    .singlePostReconcept .singlePostShareBtn i {
        font-size: 1.1rem !important;
    }
    /* Featured image: full width, spacing */
    .singlePostReconcept .singlePostFeaturedImage {
        margin: 20px 0;
        border-radius: 8px;
    }
    .singlePostReconcept .singlePostImage {
        width: 100%;
        height: auto;
        display: block;
    }
    .singlePostReconcept .singlePostImageCaption {
        font-size: 1.15rem;
        padding: 12px 16px;
        line-height: 1.45;
    }
    /* Main content: readability – font size, line height, spacing */
    .singlePostReconcept .singlePostContent,
    .singlePostContent {
        font-size: 1.125rem !important;
        line-height: 1.75 !important;
        color: #1a1a1a;
        padding: 0;
        max-width: 100%;
    }
    .singlePostReconcept .singlePostContent p,
    .singlePostContent p {
        font-size: 1.125rem !important;
        line-height: 1.75 !important;
        margin-bottom: 1em;
        font-weight: 400;
    }
    .singlePostReconcept .singlePostContent h1,
    .singlePostReconcept .singlePostContent h2,
    .singlePostReconcept .singlePostContent h3,
    .singlePostReconcept .singlePostContent h4,
    .singlePostContent h1,
    .singlePostContent h2,
    .singlePostContent h3,
    .singlePostContent h4 {
        font-size: 1.35rem !important;
        line-height: 1.4 !important;
        font-weight: 600;
        margin-top: 1.25em;
        margin-bottom: 0.5em;
    }
    .singlePostReconcept .singlePostContent h1:first-child,
    .singlePostReconcept .singlePostContent h2:first-child,
    .singlePostContent h1:first-child,
    .singlePostContent h2:first-child {
        margin-top: 0;
    }
    .singlePostReconcept .singlePostContent a,
    .singlePostContent a {
        color: #dc2627;
        word-break: break-word;
    }
    .singlePostReconcept .singlePostContent img,
    .singlePostContent img {
        max-width: 100%;
        height: auto;
        border-radius: 8px;
        margin: 1em 0;
    }
    .singlePostReconcept .singlePostContent blockquote,
    .singlePostContent blockquote {
        margin: 1.25em 0;
        padding: 14px 18px;
        font-size: 1.1rem;
        line-height: 1.65;
    }
    .singlePostReconcept .singlePostContent ul,
    .singlePostReconcept .singlePostContent ol,
    .singlePostContent ul,
    .singlePostContent ol {
        margin: 1em 0;
        padding-left: 1.5em;
    }
    .singlePostReconcept .singlePostContent li,
    .singlePostContent li {
        font-size: 1.125rem !important;
        line-height: 1.75 !important;
        margin-bottom: 0.35em;
    }
    /* Tags */
    .singlePostReconcept .desktopDetailTag {
        padding: 14px 0;
    }
    .singlePostReconcept .desktopDetailTag p {
        gap: 8px;
    }
    .singlePostReconcept .desktopTagItem {
        font-size: 1.1rem;
        padding: 8px 12px;
    }
    /* Related news: 2 columns on small, 1 on very small */
    .relatedNewsWidgetDesktop1 .relatedNewsGrid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    .relatedNewsWidgetDesktop1 .relatedNewsCard {
        border-radius: 8px;
    }
    .relatedNewsCardImage {
        height: 140px;
    }
    .relatedNewsWidgetDesktop1 .desktopSectionTitle {
        font-size: 1.4rem;
        margin-bottom: 14px;
    }
    .relatedNewsCardTitle {
        font-size: 0.95rem !important;
        line-height: 1.35;
        padding: 8px;
    }
}

@media (max-width: 480px) {
    .singlePostReconcept .singlePostHeadline {
        font-size: 1.5rem !important;
    }
    .relatedNewsWidgetDesktop1 .relatedNewsGrid {
        grid-template-columns: 1fr;
    }
    .relatedNewsCardImage {
        height: 180px;
    }
}

/* Video section: responsive on small screens */
@media (max-width: 767px) {
    .singlePostReconcept .singlePostVideoSection {
        margin-bottom: 24px;
    }
    .singlePostReconcept .singlePostVideoContainer {
        border-radius: 8px;
        overflow: hidden;
    }
    .singlePostReconcept .singlePostVideoWrapper {
        aspect-ratio: 16 / 9;
    }
    .singlePostReconcept .singlePostVideoWrapper iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    .singlePostReconcept .singlePostVideoControls {
        padding: 8px 10px;
        flex-wrap: wrap;
        gap: 8px;
    }
    .singlePostReconcept .singlePostVideoCtrlBtn {
        min-width: 40px;
        min-height: 40px;
    }
}

/* Single post: share at end – hide on desktop (only show on mobile) */
@media (min-width: 768px) {
    .singlePostShareBoxEnd {
        display: none !important;
    }
}

/* Breadcrumb: hide current post title on mobile (single post only; keep category name on category pages) */
@media (max-width: 767px) {
    body.single .prime-barta-breadcrumb__list .prime-barta-breadcrumb__item:last-child {
        display: none !important;
    }
}

/* Single post: sidebar hidden on mobile, content full width */
@media (max-width: 767px) {
    body.single .bgWHite .container .row > .col-md-9.col-lg-9 {
        flex: 0 0 100%;
        max-width: 100%;
    }
    body.single .bgWHite .container .row > .col-md-3.col-lg-3.hidden-print {
        display: none !important;
    }
    /* Latest news page: same – sidebar hidden, main full width (uses same category design) */
    body.page-template-page-latest-php .latestPageSidebarCol {
        display: none !important;
    }
    body.page-template-page-latest-php .latestPageMainCol {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .latestNewsPaginationWrap .pagination .pagination-current {
        padding: 8px 12px;
        background-color: #dc2627;
        color: #fff;
        border-radius: 5px;
        font-weight: bold;
    }
    .single-post-ad-row .container, .single-post-ad-row [class*="col-"] {
        padding-left: 16px;
        padding-right: 16px;
    }
    .marginB20 {
        margin-bottom: 16px;
    }
    .singlePostTopAdWidget.marginB20,
    .single-post-incontent-ad.marginB20 {
        margin-bottom: 16px;
    }
}

/* ========== Category page: hide lead on mobile; first card = first item on mobile (same design as rest) ========== */
/* Mobile: hide desktop lead section */
@media (max-width: 767px) {
    .catReconcept .catLeadDesktopOnly {
        display: none !important;
    }
}

/* Desktop: hide first card (lead is shown above) */
@media (min-width: 768px) {
    .catReconcept .catFirstCardMobileOnly {
        display: none !important;
    }
}

/* Category page mobile: cards + list same row design */
@media (max-width: 767px) {
    /* First 5 cards: list-row style (thumb left, title + date right); top border when lead is hidden */
    .catReconcept .catReconceptGrid {
        display: flex;
        flex-direction: column;
        gap: 0;
        margin-bottom: 0;
        border-top: 1px solid #eaeaea;
        padding-top: 20px;
    }
    .catReconcept .catReconceptCard {
        display: flex;
        flex-direction: row;
        align-items: center;
        padding: 16px 0;
        border-bottom: 1px solid #eee;
        border-radius: 0;
        background: transparent;
        transition: background 0.2s ease;
    }
    .catReconcept .catReconceptCard:hover {
        transform: none;
        background: #fafafa;
    }
    .catReconcept .catReconceptCardImg {
        width: 100px;
        min-width: 100px;
        height: 72px;
        flex-shrink: 0;
        margin-right: 14px;
        border-radius: 8px;
        overflow: hidden;
    }
    .catReconcept .catReconceptCardImg img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .catReconcept .catReconceptCardBody {
        flex: 1;
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    .catReconcept .catReconceptCardTitle {
        margin: 0;
        padding: 0;
        font-size: 1.4rem;
        font-weight: 600;
        color: #1a1a1a !important;
        line-height: 1.4;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .catReconcept .catReconceptCard:hover .catReconceptCardTitle,
    .catReconcept .catReconceptCard:focus .catReconceptCardTitle {
        color: #dc2627 !important;
    }
    .catReconcept .catReconceptCardDate {
        font-size: 1.1rem;
        color: #888;
        margin-top: 2px;
    }
    .catReconcept .catReconceptCardDate i {
        margin-right: 4px;
    }

    /* List: single column, same thumb/title/date as above */
    .catReconcept .catReconceptList {
        grid-template-columns: 1fr;
        padding-top: 0;
        border-top: none;
    }
    .catReconcept .catReconceptListRow {
        padding: 16px 0;
    }
    .catReconcept .catReconceptListBody {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    .catReconcept .catReconceptListThumb {
        width: 100px;
        height: 72px;
        margin-right: 14px;
    }
    .catReconcept .catReconceptListTitle {
        font-size: 1.4rem;
        color: #1a1a1a !important;
    }
    .catReconcept .catReconceptListRow:hover .catReconceptListTitle,
    .catReconcept .catReconceptListRow:focus .catReconceptListTitle {
        color: #dc2627 !important;
    }
    /* Date after title, small – same for all rows */
    .catReconcept .catReconceptListDate {
        font-size: 1.1rem;
        color: #888;
        margin-top: 2px;
    }
}

/* Desktop: hide date on category grid cards (date only on mobile) */
@media (min-width: 768px) {
    .catReconcept .catReconceptCardDate {
        display: none;
    }
}

/* Mobile home visibility: see assets/css/mobile-home-visibility.css (loads after this) */