/*
Theme Name: Zencov Precision Theme
Theme URI: https://zencov.com
Author: Singapore Robot Pte Ltd
Author URI: https://zencov.com
Description: High-performance industrial B2B theme for Zencov. Precision-engineered automation components theme with modern design and functionality.
Version: 1.0.6
Requires at least: 6.0
Tested up to: 6.8.3
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: zencov
Tags: industrial, b2b, e-commerce, modern, responsive, automation

Zencov Precision Theme is a WordPress theme for industrial B2B companies.
*/

/* Custom Color Variables */
:root {
    --industrial-blue: #004B87;
    --geek-gray: #F3F4F6;
}

.bg-industrial-blue { background-color: #004B87; }
.text-industrial-blue { color: #004B87; }
.border-industrial-blue { border-color: #004B87; }
.bg-geek-gray { background-color: #F3F4F6; }

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    scroll-behavior: smooth;
}

.hover-lift { 
    transition: transform 0.2s ease; 
}
.hover-lift:hover { 
    transform: translateY(-2px); 
}

/* Animation Keyframes */
@keyframes slow-zoom { 
    from { transform: scale(1); } 
    to { transform: scale(1.1); } 
}
.animate-slow-zoom { 
    animation: slow-zoom 25s infinite alternate ease-in-out; 
}

@keyframes bounce-slow {
    0%, 100% { transform: translateY(0); opacity: 0.3; }
    50% { transform: translateY(8px); opacity: 1; }
}
.animate-bounce-slow { 
    animation: bounce-slow 2s infinite ease-in-out; 
}

@keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}
.animate-in.fade-in { 
    animation: fade-in 1s ease-in; 
}

/* Line Clamp Utility (Tailwind CDN doesn't include this) */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Backdrop Blur Support */
.backdrop-blur-md {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.backdrop-blur-sm {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

/* Typography Prose Styles (for content areas) */
.prose {
    color: #374151;
    max-width: 65ch;
}

.prose-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
}

.prose h1, .prose h2, .prose h3, .prose h4 {
    font-weight: 700;
    margin-top: 2em;
    margin-bottom: 1em;
    line-height: 1.2;
}

.prose p {
    margin-top: 1.25em;
    margin-bottom: 1.25em;
}

.prose a {
    color: #004B87;
    text-decoration: underline;
}

.prose a:hover {
    color: #003366;
}

.prose ul, .prose ol {
    margin-top: 1.25em;
    margin-bottom: 1.25em;
    padding-left: 1.625em;
}

.prose li {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

.prose strong {
    font-weight: 600;
    color: #111827;
}

/* Ensure proper stacking for sticky header */
.sticky {
    position: sticky;
}

/* Additional utility classes */
.select-none {
    user-select: none;
    -webkit-user-select: none;
}

.pointer-events-none {
    pointer-events: none;
}

/* Aspect ratio utilities */
.aspect-square {
    aspect-ratio: 1 / 1;
}

.aspect-\[4\/5\] {
    aspect-ratio: 4 / 5;
}

/* Text size utilities (for very small text) */
.text-\[10px\] {
    font-size: 10px;
}

.text-\[9px\] {
    font-size: 9px;
}

.text-\[8px\] {
    font-size: 8px;
}

.text-\[11px\] {
    font-size: 11px;
}

/* Ensure smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* WordPress specific styles */
.wp-block-image {
    margin: 1.5em 0;
}

.wp-block-image img {
    max-width: 100%;
    height: auto;
}

/* Ensure max-width utilities work */
.max-w-none {
    max-width: none;
}

/* Additional critical utilities */
.flex-grow {
    flex-grow: 1 !important;
}

.min-h-screen {
    min-height: 100vh !important;
}

/* Ensure images display correctly */
img {
    max-width: 100%;
    height: auto;
}

/* Ensure proper text rendering */
.leading-none { line-height: 1 !important; }
.leading-tight { line-height: 1.25 !important; }
.leading-relaxed { line-height: 1.75 !important; }
.tracking-tighter { letter-spacing: -0.05em !important; }
.tracking-tight { letter-spacing: -0.025em !important; }
.tracking-wider { letter-spacing: 0.05em !important; }
.tracking-widest { letter-spacing: 0.1em !important; }

/* Additional spacing */
.mb-4 { margin-bottom: 1rem !important; }
.mb-6 { margin-bottom: 1.5rem !important; }
.mb-10 { margin-bottom: 2.5rem !important; }
.mb-12 { margin-bottom: 3rem !important; }
.mt-6 { margin-top: 1.5rem !important; }
.mt-8 { margin-top: 2rem !important; }
.p-8 { padding: 2rem !important; }
.p-12 { padding: 3rem !important; }
.px-10 { padding-left: 2.5rem !important; padding-right: 2.5rem !important; }
.px-12 { padding-left: 3rem !important; padding-right: 3rem !important; }
.py-2\.5 { padding-top: 0.625rem !important; padding-bottom: 0.625rem !important; }
.py-4 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.py-5 { padding-top: 1.25rem !important; padding-bottom: 1.25rem !important; }
.py-8 { padding-top: 2rem !important; padding-bottom: 2rem !important; }
.pt-24 { padding-top: 6rem !important; }
.pb-24 { padding-bottom: 6rem !important; }

/* Text sizes */
.text-xs { font-size: 0.75rem !important; line-height: 1rem !important; }
.text-sm { font-size: 0.875rem !important; line-height: 1.25rem !important; }
.text-lg { font-size: 1.125rem !important; line-height: 1.75rem !important; }
.text-xl { font-size: 1.25rem !important; line-height: 1.75rem !important; }
.text-2xl { font-size: 1.5rem !important; line-height: 2rem !important; }
.text-3xl { font-size: 1.875rem !important; line-height: 2.25rem !important; }

/* Font weights */
.font-light { font-weight: 300 !important; }
.font-medium { font-weight: 500 !important; }
.font-semibold { font-weight: 600 !important; }
.font-extrabold { font-weight: 800 !important; }

/* Text colors */
.text-blue-400 { color: #60a5fa !important; }
.text-gray-800 { color: #1f2937 !important; }

/* Background colors */
.bg-blue-50 { background-color: #eff6ff !important; }
.bg-gray-50 { background-color: #f9fafb !important; }
.bg-white\/5 { background-color: rgba(255, 255, 255, 0.05) !important; }
.bg-white\/10 { background-color: rgba(255, 255, 255, 0.1) !important; }
.bg-white\/95 { background-color: rgba(255, 255, 255, 0.95) !important; }
.bg-industrial-blue\/80 { background-color: rgba(0, 75, 135, 0.8) !important; }
.bg-industrial-blue\/10 { background-color: rgba(0, 75, 135, 0.1) !important; }

/* Hover states */
.hover\:bg-blue-800:hover { background-color: #1e40af !important; }
.hover\:bg-gray-50:hover { background-color: #f9fafb !important; }
.hover\:bg-white\/10:hover { background-color: rgba(255, 255, 255, 0.1) !important; }
.hover\:text-white:hover { color: #ffffff !important; }
.hover\:text-industrial-blue:hover { color: #004B87 !important; }
.hover\:border-industrial-blue:hover { border-color: #004B87 !important; }

/* Cursor */
.cursor-pointer { cursor: pointer !important; }
.cursor-wait { cursor: wait !important; }
.cursor-not-allowed { cursor: not-allowed !important; }

/* Inset utilities */
.inset-0 { top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; }
.bottom-10 { bottom: 2.5rem !important; }
.bottom-6 { bottom: 1.5rem !important; }
.bottom-4 { bottom: 1rem !important; }
.left-0 { left: 0 !important; }
.left-1\/2 { left: 50% !important; }
.right-6 { right: 1.5rem !important; }
.top-1\/2 { top: 50% !important; }
.-top-10 { top: -2.5rem !important; }
.-left-10 { left: -2.5rem !important; }

/* Z-index */
.z-0 { z-index: 0 !important; }
.z-20 { z-index: 20 !important; }

/* Additional utilities */
.inline-flex { display: inline-flex !important; }
.flex-wrap { flex-wrap: wrap !important; }
.flex-shrink-0 { flex-shrink: 0 !important; }
.items-start { align-items: flex-start !important; }
.items-end { align-items: flex-end !important; }
.justify-center { justify-content: center !important; }
.text-center { text-align: center !important; }
.text-left { text-align: left !important; }
.italic { font-style: italic !important; }

/* Gap utilities */
.gap-4 { gap: 1rem !important; }
.gap-5 { gap: 1.25rem !important; }
.gap-6 { gap: 1.5rem !important; }
.gap-12 { gap: 3rem !important; }
.gap-20 { gap: 5rem !important; }
.space-y-2 > * + * { margin-top: 0.5rem !important; }
.space-y-3 > * + * { margin-top: 0.75rem !important; }
.space-y-4 > * + * { margin-top: 1rem !important; }
.space-y-5 > * + * { margin-top: 1.25rem !important; }
.space-y-8 > * + * { margin-top: 2rem !important; }
.space-y-10 > * + * { margin-top: 2.5rem !important; }
.space-x-2 > * + * { margin-left: 0.5rem !important; }
.space-x-4 > * + * { margin-left: 1rem !important; }
.space-x-5 > * + * { margin-left: 1.25rem !important; }
.space-x-8 > * + * { margin-left: 2rem !important; }
.space-x-10 > * + * { margin-left: 2.5rem !important; }

/* Border radius */
.rounded-full { border-radius: 9999px !important; }
.rounded-md { border-radius: 0.375rem !important; }

/* Additional text utilities */
.uppercase { text-transform: uppercase !important; }
.lowercase { text-transform: lowercase !important; }
.capitalize { text-transform: capitalize !important; }
.italic { font-style: italic !important; }
.not-italic { font-style: normal !important; }

/* Font sizes with arbitrary values */
.text-\[8px\] { font-size: 8px !important; }
.text-\[9px\] { font-size: 9px !important; }
.text-\[10px\] { font-size: 10px !important; }
.text-\[11px\] { font-size: 11px !important; }
.text-\[20vw\] { font-size: 20vw !important; }
.text-\[100px\] { font-size: 100px !important; }

/* Tracking with arbitrary values */
.tracking-\[0\.2em\] { letter-spacing: 0.2em !important; }
.tracking-\[0\.3em\] { letter-spacing: 0.3em !important; }
.tracking-\[0\.4em\] { letter-spacing: 0.4em !important; }
.tracking-\[0\.15em\] { letter-spacing: 0.15em !important; }

/* Width/Height with arbitrary values */
.w-\[20vw\] { width: 20vw !important; }
.w-1\.5 { width: 0.375rem !important; }
.w-2 { width: 0.5rem !important; }
.w-4 { width: 1rem !important; }
.w-8 { width: 2rem !important; }
.h-1\.5 { height: 0.375rem !important; }
.h-4 { height: 1rem !important; }
.h-6 { height: 1.5rem !important; }
.h-10 { height: 2.5rem !important; }
.h-12 { height: 3rem !important; }
.h-16 { height: 4rem !important; }
.h-40 { height: 10rem !important; }
.h-full { height: 100% !important; }

/* Max width utilities */
.max-w-2xl { max-width: 42rem !important; }
.max-w-3xl { max-width: 48rem !important; }
.max-w-xl { max-width: 36rem !important; }
.max-w-xs { max-width: 20rem !important; }

/* Min width */
.min-w-\[90px\] { min-width: 90px !important; }

/* Margin utilities */
.mx-2 { margin-left: 0.5rem !important; margin-right: 0.5rem !important; }
.mx-4 { margin-left: 1rem !important; margin-right: 1rem !important; }
.mx-auto { margin-left: auto !important; margin-right: auto !important; }
.mt-1 { margin-top: 0.25rem !important; }
.mt-2 { margin-top: 0.5rem !important; }
.mt-4 { margin-top: 1rem !important; }
.mr-3 { margin-right: 0.75rem !important; }
.mb-1 { margin-bottom: 0.25rem !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.mb-3 { margin-bottom: 0.75rem !important; }

/* Padding utilities */
.p-4 { padding: 1rem !important; }
.p-6 { padding: 1.5rem !important; }
.px-2 { padding-left: 0.5rem !important; padding-right: 0.5rem !important; }
.px-3 { padding-left: 0.75rem !important; padding-right: 0.75rem !important; }
.px-3\.5 { padding-left: 0.875rem !important; padding-right: 0.875rem !important; }
.py-0\.5 { padding-top: 0.125rem !important; padding-bottom: 0.125rem !important; }
.py-1 { padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; }
.py-1\.5 { padding-top: 0.375rem !important; padding-bottom: 0.375rem !important; }
.py-2 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }
.py-2\.5 { padding-top: 0.625rem !important; padding-bottom: 0.625rem !important; }
.pt-8 { padding-top: 2rem !important; }
.pt-10 { padding-top: 2.5rem !important; }
.pb-10 { padding-bottom: 2.5rem !important; }
.pr-4 { padding-right: 1rem !important; }

/* Flex utilities */
.flex-1 { flex: 1 1 0% !important; }

/* Additional responsive */
@media (min-width: 640px) {
    .sm\\:px-6 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
    .sm\\:text-xs { font-size: 0.75rem !important; line-height: 1rem !important; }
    .sm\\:block { display: block !important; }
    .sm\\:flex-row { flex-direction: row !important; }
    .sm\\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (min-width: 768px) {
    .md\\:flex-row { flex-direction: row !important; }
    .md\\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .md\\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
    .md\\:text-5xl { font-size: 3rem !important; line-height: 1 !important; }
    .md\\:text-8xl { font-size: 6rem !important; line-height: 1 !important; }
    .md\\:text-2xl { font-size: 1.5rem !important; line-height: 2rem !important; }
    .md\\:block { display: block !important; }
    .md\\:items-end { align-items: flex-end !important; }
}
@media (min-width: 1024px) {
    .lg\\:flex { display: flex !important; }
    .lg\\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .lg\\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
    .lg\\:px-8 { padding-left: 2rem !important; padding-right: 2rem !important; }
    .lg\\:text-\\[100px\\] { font-size: 100px !important; line-height: 1 !important; }
    .lg\\:flex-row { flex-direction: row !important; }
    .lg\\:w-1\/2 { width: 50% !important; }
    .lg\\:col-span-2 { grid-column: span 2 / span 2 !important; }
}