/**
 * Shenzhen CLT Electronics - Dedicated Inner Pages Mobile & Tablet Stylesheet
 * Scope: Non-homepage pages (`body:not(.home)`) on screen widths <= 1024px.
 * Strict Constraint: 100% isolated to inner pages; ZERO impact on front-page.php.
 * 
 * Core Design Tenets:
 * 1. Typography Consistency: Perfectly matches the compact homepage typography scale (Title: 20px, Cards: 15px, Body: 13px, Badges: 12px).
 * 2. Zero Horizontal Scroll: Guaranteed 100vw maximum width, responsive tables, media clamping.
 * 3. Comfortable Breathing Room: Content never touches screen edges, relaxed 1.25rem (20px) gutters.
 */

@media screen and (max-width: 64rem) { /* <= 1024px */

  /* ==========================================================================
     0. Universal Viewport, Reset & Anti-Overflow Guard (Zero Horizontal Scroll)
     ========================================================================== */
  html,
  body:not(.home) {
    overflow-x: hidden !important;
    max-width: 100vw !important;
    width: 100% !important;
    font-size: 14px !important;
  }

  body:not(.home) * {
    box-sizing: border-box !important;
  }

  body:not(.home) img,
  body:not(.home) video,
  body:not(.home) iframe,
  body:not(.home) svg {
    max-width: 100% !important;
    height: auto !important;
    box-sizing: border-box !important;
  }

  /* Universal Responsive Container (Comfortable 1.25rem Gutters, Never Touching Edge) */
  body:not(.home) .container,
  body:not(.home) .site-container,
  body:not(.home) .footer-container {
    width: 100% !important;
    max-width: 100% !important;
    padding-inline: 1.25rem !important;
    box-sizing: border-box !important;
  }

  /* ==========================================================================
     1. Unified Typography Hierarchy (Matching Homepage Scale Exactly)
     ========================================================================== */
  
  /* Subpage Hero Banners */
  body:not(.home) .clt-products-banner-title,
  body:not(.home) .clt-solutions-banner-title,
  body:not(.home) .clt-page-hero-title,
  body:not(.home) .clt-subpage-hero-title,
  body:not(.home) .solution-hero-section h1,
  body:not(.home) .cases-banner-title,
  body:not(.home) .article-title,
  body:not(.home) .single-post-title {
    font-size: 22px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    margin: 0 0 0.5rem 0 !important;
    letter-spacing: -0.02em !important;
    color: #ffffff !important;
  }

  body:not(.home) .clt-products-banner-desc,
  body:not(.home) .clt-solutions-banner-desc,
  body:not(.home) .clt-page-hero-subtitle,
  body:not(.home) .clt-subpage-hero-subtitle,
  body:not(.home) .solution-hero-subtitle,
  body:not(.home) .solution-hero-overview {
    font-size: 13px !important;
    line-height: 1.5 !important;
    color: rgba(255, 255, 255, 0.85) !important;
    margin: 0 !important;
    max-width: 100% !important;
  }

  /* Section Titles across all inner pages */
  body:not(.home) h2,
  body:not(.home) .section-title,
  body:not(.home) .section-dark-title,
  body:not(.home) .about-section-title,
  body:not(.home) .about-intro-heading,
  body:not(.home) .qs-cases-section-title,
  body:not(.home) .clt-facilities-title,
  body:not(.home) .clt-contact-info-heading,
  body:not(.home) .clt-pdp-section-title,
  body:not(.home) .solution-section-title,
  body:not(.home) .contact-form-wrap h2 {
    font-size: 20px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    margin-bottom: 0.65rem !important;
    color: #ffffff !important;
    letter-spacing: -0.015em !important;
  }

  body:not(.home) .section-subtitle,
  body:not(.home) .section-desc,
  body:not(.home) .about-section-subtitle,
  body:not(.home) .clt-facilities-subtitle,
  body:not(.home) .clt-subpage-desc {
    font-size: 13px !important;
    line-height: 1.5 !important;
    color: #94a3b8 !important;
    margin-bottom: 1.5rem !important;
  }

  /* Card Headings (Products, Cases, Solutions, News, Bento, Certifications) */
  body:not(.home) .catalog-card-title,
  body:not(.home) .qs-case-card-title,
  body:not(.home) .case-card-title,
  body:not(.home) .solution-card-title,
  body:not(.home) .solution-component-card h3,
  body:not(.home) .news-card-title,
  body:not(.home) .post-card-title,
  body:not(.home) .support-card-title,
  body:not(.home) .bento-title,
  body:not(.home) .card-main-title,
  body:not(.home) .clt-facility-name,
  body:not(.home) .clt-contact-channel h3 {
    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    margin: 0 0 0.5rem 0 !important;
    color: #ffffff !important;
  }

  /* Selling Points / Feature Section Titles */
  body:not(.home) .clt-sp-card-title,
  body:not(.home) .pdp-feature-title {
    font-size: 18px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    margin: 0 0 0.65rem 0 !important;
    color: #ffffff !important;
  }

  /* Micro Tags, Badges, Dates, Model IDs */
  body:not(.home) .card-tag,
  body:not(.home) .card-tag .tag-text,
  body:not(.home) .product-model,
  body:not(.home) .news-date,
  body:not(.home) .case-meta-tag,
  body:not(.home) .filter-tab-btn,
  body:not(.home) .cert-four-title,
  body:not(.home) .about-timeline-year {
    font-size: 12px !important;
    line-height: 1.3 !important;
  }

  /* General Body Paragraphs & Card Descriptions */
  body:not(.home) p,
  body:not(.home) .catalog-card-tagline,
  body:not(.home) .clt-sp-card-desc,
  body:not(.home) .pdp-feature-desc,
  body:not(.home) .solution-adv-card p,
  body:not(.home) .solution-component-card p,
  body:not(.home) .about-intro-text p,
  body:not(.home) .bento-card p,
  body:not(.home) .article-body p {
    font-size: 13px !important;
    line-height: 1.6 !important;
    color: #d1d5db !important;
  }

  /* Technical Specs & Bullet Points */
  body:not(.home) .catalog-card-specs li,
  body:not(.home) .card-feature-list li,
  body:not(.home) .product-features-list li,
  body:not(.home) .pdp-specs-list li {
    font-size: 12px !important;
    line-height: 1.45 !important;
    color: #94a3b8 !important;
  }

  /* Standard CTA Buttons */
  body:not(.home) .btn-primary,
  body:not(.home) .clt-btn-1,
  body:not(.home) .catalog-card-cta .btn-primary,
  body:not(.home) .clt-vr-badge-btn {
    font-size: 13px !important;
    padding: 0.45rem 1.15rem !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* ==========================================================================
     2. Page Breadcrumbs & Hero Banners (Compact & Relaxed)
     ========================================================================== */
  body:not(.home) .clt-breadcrumb,
  body:not(.home) .about-breadcrumb-bar {
    padding: 0.65rem 0 !important;
    background: #0a111a !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
  }

  body:not(.home) .clt-breadcrumb .container,
  body:not(.home) .about-breadcrumb-bar .container {
    padding-inline: 1.25rem !important;
  }

  body:not(.home) .clt-breadcrumb a,
  body:not(.home) .about-clean-breadcrumbs a,
  body:not(.home) .clt-breadcrumb span,
  body:not(.home) .about-clean-breadcrumbs span {
    font-size: 12px !important;
  }

  /* Hero Banner Layout Clamping */
  body:not(.home) .clt-products-banner-wrap,
  body:not(.home) .clt-solutions-banner-wrap,
  body:not(.home) .about-pure-hero-wrap,
  body:not(.home) .clt-news-banner-wrap {
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    min-height: auto !important;
    max-height: none !important;
    position: relative !important;
    overflow: hidden !important;
  }

  body:not(.home) .clt-products-banner-img,
  body:not(.home) .clt-solutions-banner-img,
  body:not(.home) .about-pure-hero-img,
  body:not(.home) .clt-news-banner-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  body:not(.home) .clt-products-banner-content,
  body:not(.home) .clt-solutions-banner-content,
  body:not(.home) .clt-page-hero-content {
    padding: 1.5rem 0 !important;
  }

  body:not(.home) .clt-products-banner-content .container,
  body:not(.home) .clt-solutions-banner-content .container,
  body:not(.home) .clt-page-hero-content .container {
    padding-inline: 1.25rem !important;
  }

  /* ==========================================================================
     3. Products Catalog Hub (`/products/`)
     ========================================================================== */
  body:not(.home) .product-top-filter-bar {
    padding: 0 !important;
    background: #0d1b2a !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    position: sticky !important;
    top: var(--header-h, 3.75rem) !important;
    z-index: 100 !important;
  }

  body:not(.home) .product-top-filter-bar .container {
    padding-inline: 1rem !important;
  }

  body:not(.home) .product-filter-tabs {
    display: flex !important;
    gap: 1.25rem !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    padding: 0.5rem 0.25rem !important;
  }

  body:not(.home) .product-filter-tabs::-webkit-scrollbar {
    display: none !important;
  }

  body:not(.home) .filter-tab-btn {
    font-size: 13px !important;
    padding: 0.4rem 0.65rem 0.65rem !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
  }

  body:not(.home) .product-archive-section {
    padding: 2rem 0 3.5rem !important;
    background: #000000 !important;
  }

  body:not(.home) .product-catalog-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
    width: 100% !important;
  }

  @media screen and (min-width: 600px) and (max-width: 1024px) {
    body:not(.home) .product-catalog-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
  }

  body:not(.home) .catalog-card-item {
    width: 100% !important;
    max-width: 100% !important;
  }

  body:not(.home) .catalog-card-inner {
    padding: 1.25rem !important;
    border-radius: 12px !important;
    background: #101c2c !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-sizing: border-box !important;
  }

  body:not(.home) .catalog-card-thumb {
    margin: 0.85rem 0 1rem 0 !important;
    height: 180px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body:not(.home) .catalog-pure-img {
    max-height: 170px !important;
    width: auto !important;
    object-fit: contain !important;
  }

  /* ==========================================================================
     4. Single Product Detail Page (PDP)
     ========================================================================== */
  body:not(.home) .clt-pdp-showcase-section,
  body:not(.home) .clt-pdp-specs-section,
  body:not(.home) .clt-related-products-section {
    padding: 2.25rem 0 !important;
  }

  body:not(.home) .clt-pdp-showcase-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }

  body:not(.home) .clt-sp-card-row,
  body:not(.home) .clt-sp-card-row.layout-img-right {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
    margin-bottom: 2.5rem !important;
  }

  body:not(.home) .clt-sp-card-row.layout-img-right .clt-sp-media-col {
    order: 1 !important;
  }
  body:not(.home) .clt-sp-card-row.layout-img-right .clt-sp-content-col {
    order: 2 !important;
  }

  body:not(.home) .clt-sp-media-wrap {
    border-radius: 12px !important;
    overflow: hidden !important;
    width: 100% !important;
  }

  body:not(.home) .clt-sp-content-col {
    padding: 0 !important;
  }

  /* Anti-Overflow Table Protection (Specs Table) */
  body:not(.home) .clt-specs-table-wrap,
  body:not(.home) .pdp-specs-table-wrap,
  body:not(.home) .table-responsive {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    border-radius: 8px !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    margin-top: 1.25rem !important;
  }

  body:not(.home) .clt-specs-table,
  body:not(.home) table {
    width: 100% !important;
    min-width: 480px !important;
    border-collapse: collapse !important;
    font-size: 12px !important;
  }

  body:not(.home) .clt-specs-table th,
  body:not(.home) .clt-specs-table td {
    padding: 0.65rem 0.85rem !important;
  }

  /* Inquiry Form Card */
  body:not(.home) .clt-pdp-inquiry-card,
  body:not(.home) .contact-form-wrap {
    padding: 1.5rem 1.25rem !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  body:not(.home) .form-row-2col,
  body:not(.home) .contact-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }

  /* ==========================================================================
     5. Solutions & Cases Hub / Detail Pages
     ========================================================================== */
  body:not(.home) .solution-section,
  body:not(.home) .qs-cases-archive-section,
  body:not(.home) .cases-grid-section {
    padding: 2.25rem 0 !important;
  }

  body:not(.home) .solution-gallery-grid,
  body:not(.home) .solution-components-grid,
  body:not(.home) .solution-advantages-grid,
  body:not(.home) .qs-cases-grid,
  body:not(.home) .cases-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
    width: 100% !important;
  }

  @media screen and (min-width: 600px) and (max-width: 1024px) {
    body:not(.home) .solution-advantages-grid,
    body:not(.home) .qs-cases-grid,
    body:not(.home) .cases-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
  }

  body:not(.home) .solution-component-card,
  body:not(.home) .solution-adv-card,
  body:not(.home) .qs-case-card,
  body:not(.home) .case-card {
    padding: 1.25rem !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    background: #101c2c !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  /* ==========================================================================
     6. About Us Page (`page-about.php`)
     ========================================================================== */
  body:not(.home) .about-intro-section,
  body:not(.home) .about-pillars-section,
  body:not(.home) .about-story-section,
  body:not(.home) .about-culture-section,
  body:not(.home) .about-mfg-section,
  body:not(.home) .about-certs-section {
    padding: 2.25rem 0 !important;
  }

  body:not(.home) .about-intro-grid,
  body:not(.home) .about-pillars-grid,
  body:not(.home) .about-culture-grid,
  body:not(.home) .about-factory-grid,
  body:not(.home) .factory-grid,
  body:not(.home) .timeline-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
    width: 100% !important;
  }

  body:not(.home) .about-intro-images {
    order: -1 !important;
  }

  body:not(.home) .factory-card-lg {
    grid-column: span 1 !important;
    aspect-ratio: 16 / 9 !important;
  }

  body:not(.home) .about-certs-grid,
  body:not(.home) .cert-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
  }

  body:not(.home) .bento-card,
  body:not(.home) .about-pillar-card,
  body:not(.home) .cert-card,
  body:not(.home) .about-timeline-item {
    padding: 1.25rem !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    background: #101c2c !important;
  }

  /* ==========================================================================
     7. Contact Us Page (`page-contact.php`)
     ========================================================================== */
  body:not(.home) .clt-facilities-section,
  body:not(.home) .clt-contact-channels-section {
    padding: 2.25rem 0 !important;
  }

  body:not(.home) .clt-facilities-grid,
  body:not(.home) .clt-channels-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }

  body:not(.home) .clt-facility-card,
  body:not(.home) .clt-channel-card {
    border-radius: 12px !important;
    overflow: hidden !important;
    background: #101c2c !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  body:not(.home) .clt-facility-info,
  body:not(.home) .clt-channel-card {
    padding: 1.25rem !important;
    box-sizing: border-box !important;
  }

  /* ==========================================================================
     8. News Hub & Single Article (`home.php`, `single.php`)
     ========================================================================== */
  body:not(.home) .news-archive-section,
  body:not(.home) .single-news-section {
    padding: 2.25rem 0 !important;
  }

  body:not(.home) .news-grid,
  body:not(.home) .news-archive-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }

  body:not(.home) .news-card {
    border-radius: 12px !important;
    overflow: hidden !important;
    background: #101c2c !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  body:not(.home) .news-card-content,
  body:not(.home) .article-container {
    padding: 1.25rem !important;
    box-sizing: border-box !important;
  }

  body:not(.home) .post-navigation-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
    margin-top: 2rem !important;
  }

  /* ==========================================================================
     9. Support, FAQ & Privacy Policy (`page-support.php`, `page-privacy-policy.php`)
     ========================================================================== */
  body:not(.home) .support-section,
  body:not(.home) .faq-section,
  body:not(.home) .privacy-policy-section {
    padding: 2.25rem 0 !important;
  }

  body:not(.home) .support-grid,
  body:not(.home) .faq-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }

  body:not(.home) .faq-item {
    border-radius: 8px !important;
    margin-bottom: 0.85rem !important;
    background: #101c2c !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  body:not(.home) .faq-question {
    padding: 1rem 1.25rem !important;
    font-size: 14px !important;
    font-weight: 600 !important;
  }

  body:not(.home) .faq-answer {
    padding: 0 1.25rem 1rem 1.25rem !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
  }

  body:not(.home) .privacy-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }

  body:not(.home) .privacy-toc-wrap {
    position: static !important;
    width: 100% !important;
    max-height: none !important;
  }
}