/* custom.css */
body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.main-navigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
@media (max-width: 768px) {
    .main-navigation {
        flex-direction: column;
        padding: 10px;
    }
    .main-navigation a {
        font-size: 16px;
        padding: 10px;
        display: block;
    }
}
.hero-section {
  background: linear-gradient(
    45deg, 
    #0a4a59, #0b527c, #0d5c9f, #1068c2, 
    #1276e3, #1585ff, #1896ff, #1ca9ff, 
    #1fbcff, #23d1ff, #27e6ff, #2bfbff, 
    #2fffff
  );
  background-size: 400% 400%;
  animation: gradientAnimation 15s ease infinite;
  min-height: 100vh;
}

@keyframes gradientAnimation {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.products {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
}
@media (max-width: 600px) {
    .products {
        grid-template-columns: 1fr;
    }
}
img, .wp-post-image {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}
h1, .entry-title {
    font-size: 32px;
    line-height: 1.2;
}
@media (max-width: 600px) {
    h1, .entry-title {
        font-size: 24px;
    }
}
.entry-content, .site-footer {
    padding: 20px;
}
@media (max-width: 600px) {
    .entry-content, .site-footer {
        padding: 15px;
    }
}
/* New CSS - Margin and Header Fix (Append below existing content) */
body, .site, .wrapper, .container {
    margin: 0 auto !important;
    padding: 0 10px !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box;
}

.site-header, .header-main {
    margin: 0 !important;
    padding: 10px 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
}

.site-title, .site-branding, .main-navigation, .main-navigation a {
    margin: 0 !important;
    padding: 0 5px !important;
    width: auto !important;
    max-width: none !important;
    white-space: normal !important;
    font-size: 18px !important;
    line-height: 1.4 !important;
    position: relative !important;
    z-index: 10 !important;
}

@media (max-width: 768px) {
    body, .site, .wrapper, .container {
        padding: 0 5px !important;
    }
    .site-header, .header-main {
        padding: 8px 5px !important;
    }
    .site-title, .main-navigation a {
        font-size: 16px !important;
        line-height: 1.3 !important;
    }
}

.content-area, .wp-block-cover {
    margin: 0 !important;
    padding: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
}

.products {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin: 0 !important;
    padding: 10px !important;
}
@media (max-width: 600px) {
    .products {
        grid-template-columns: 1fr;
    }
}
img, .wp-post-image {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}