/* Custom CSS */

/* Poppins Font Initialization - already handled by CDN link in HTML head */
body {
    font-family: 'Poppins', sans-serif;
    color: #333; /* Default text color for readability */
}

nav#main-nav li a {
    color: #f0e691;
}

/* Hero Section Specific Styles */
#hero {
    position: relative;
    /* Background image and gradient overlay handled by Tailwind and pseudo-element/div */
}

#hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom right, rgba(59, 130, 246, 0.5), rgba(168, 85, 247, 0.5), rgba(236, 72, 153, 0.5));
    backdrop-filter: blur(5px); /* Creates the glass effect */
    z-index: 0;
}

#hero .relative.z-10 {
    z-index: 1; /* Ensure content is above overlay */
}

.logo-glow {
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.6), 0 0 20px rgba(168, 85, 247, 0.4);
}

/* Navigation */
#main-nav {
    background-color: transparent; /* Default transparent */
    transition: background-color 0s ease-in-out; /* Instant change */
}

#main-nav.nav-scrolled {
    background-color: rgba(255, 255, 255, 0.9); /* Slightly opaque white background */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

#main-nav.nav-scrolled a {
    color: #333; /* Darker text for readability on white background */
}

#main-nav.nav-scrolled .logo-glow {
    color: #333; /* Darker logo text */
    text-shadow: none; /* Remove glow on scroll */
}

/* CTA Button in Hero */
#hero a.px-8.py-4 {
    transition: background-color 0s ease-in-out, color 0s ease-in-out, border-color 0s ease-in-out; /* Instant changes */
}

#hero a.px-8.py-4:hover {
    background-color: white;
    color: #2563eb; /* blue-700 */
    border-color: white;
}

/* Portfolio Section Timeline */
.timeline-container {
    position: relative;
    overflow-x: auto;
    padding-bottom: 2rem; /* Space for scrollbar */
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
}

.timeline-container::-webkit-scrollbar {
    height: 8px;
}

.timeline-container::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}

.timeline-container::-webkit-scrollbar-thumb {
    background: #d1d5db; /* gray-300 */
    border-radius: 10px;
}

.timeline-container::-webkit-scrollbar-thumb:hover {
    background: #9ca3af; /* gray-400 */
}

.project-card {
    min-width: 320px; /* Ensure cards don't shrink too much */
    margin-right: 1.5rem; /* Space between cards */
    margin-left: 1.5rem;
    position: relative;
    top: 20px; /* Adjust vertical position relative to timeline line */
}

.timeline-container > .absolute {
    top: calc(50% + 20px); /* Adjust line position to match card centers */
    transform: translateY(-50%);
}

/* How It Works Section Arrows */
.how-it-works-flow {
    position: relative;
}

.how-it-works-flow > div {
    flex-shrink: 0;
}

.how-it-works-flow .arrow-right {
    position: absolute;
    height: 2px; /* Line thickness */
    background-color: #d1d5db; /* gray-300 */
    z-index: 0;
    /* Width and left position set by Tailwind */
}

.how-it-works-flow .material-symbols-outlined.arrow_right_alt {
    position: absolute;
    font-size: 2.5rem; /* Arrow size */
    color: #9ca3af; /* gray-400 */
    z-index: 0;
    /* Left position set by Tailwind */
}

/* Industries Section Hover Effect (no transition) */
.group-hover\:opacity-100 {
    opacity: 1 !important;
}
.group-hover\:h-auto {
    height: auto !important;
}
.group-hover\:shadow-xl {
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
}

/* Form Styling */
#consultation-form input:focus,
#consultation-form select:focus,
#consultation-form textarea:focus {
    border-color: #3b82f6; /* blue-500 */
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.5);
}

/* Cookie Banner & Modal */
#cookie-banner {
    transition: transform 0s ease-in-out; /* Instant hide/show */
}

#cookie-modal {
    transition: opacity 0s ease-in-out; /* Instant hide/show */
}

/* Ensure default text color for all elements unless overridden */
h1, h2, h3, h4, h5, h6 {
    color: #1a202c; /* A dark gray for headings */
}

p, li, a, span {
    color: #4a5568; /* A slightly lighter dark gray for body text */
}

/* Override for specific sections with light text */
#hero, #stats, #contact, footer {
    color: white;
}

#hero h1, #hero p, #hero a,
#stats h2, #stats p, #stats span,
#contact h2, #contact p, #contact label,
footer h3, footer p, footer a, footer span {
    color: inherit; /* Inherit white from parent */
}

/* Form text color inside white background */
#consultation-form {
    color: #333;
}
#consultation-form label {
    color: #333;
}
#consultation-form input, #consultation-form select, #consultation-form textarea {
    color: #333;
}
#consultation-form button {
    color: white;
}

/* Material Symbols icon sizing and alignment adjustments */
.material-symbols-outlined {
    font-variation-settings:
        'FILL' 0,
        'wght' 400,
        'GRAD' 0,
        'opsz' 48;
    vertical-align: middle;
}

/* General Link Styling */
a {
    text-decoration: none;
}
a:hover {
    text-decoration: none;
}/* New Stock Styles for Content within .privacyNestZone */

.privacyNestZone {
    /* Padding for the main content area */
    padding-top: 2.5rem; /* Top padding */
    padding-bottom: 2.5rem; /* Bottom padding */
    padding-left: 1.5rem; /* Side padding */
    padding-right: 1.5rem; /* Side padding */
    max-width: 800px; /* Max width for readability */
    margin-left: auto; /* Center the content block */
    margin-right: auto; /* Center the content block */
}

.privacyNestZone h1 {
    /* Heading 1 styles */
    font-size: 2rem; /* Approximately 32px */
    line-height: 1.2;
    font-weight: 700; /* Bold */
    color: #1a202c; /* Dark gray for headings */
    margin-top: 2.5rem; /* Top margin */
    margin-bottom: 1.5rem; /* Bottom margin */
}

.privacyNestZone h2 {
    /* Heading 2 styles */
    font-size: 1.75rem; /* Approximately 28px */
    line-height: 1.3;
    font-weight: 600; /* Semi-bold */
    color: #1a202c; /* Dark gray for headings */
    margin-top: 2rem; /* Top margin */
    margin-bottom: 1.25rem; /* Bottom margin */
}

.privacyNestZone h3 {
    /* Heading 3 styles */
    font-size: 1.5rem; /* Approximately 24px */
    line-height: 1.4;
    font-weight: 600; /* Semi-bold */
    color: #1a202c; /* Dark gray for headings */
    margin-top: 1.75rem; /* Top margin */
    margin-bottom: 1rem; /* Bottom margin */
}

.privacyNestZone h4 {
    /* Heading 4 styles */
    font-size: 1.25rem; /* Approximately 20px */
    line-height: 1.5;
    font-weight: 500; /* Medium */
    color: #1a202c; /* Dark gray for headings */
    margin-top: 1.5rem; /* Top margin */
    margin-bottom: 0.75rem; /* Bottom margin */
}

.privacyNestZone h5 {
    /* Heading 5 styles */
    font-size: 1.125rem; /* Approximately 18px */
    line-height: 1.6;
    font-weight: 500; /* Medium */
    color: #1a202c; /* Dark gray for headings */
    margin-top: 1.25rem; /* Top margin */
    margin-bottom: 0.5rem; /* Bottom margin */
}

.privacyNestZone p {
    /* Paragraph styles */
    font-size: 1rem; /* Approximately 16px */
    line-height: 1.7;
    color: #4a5568; /* Slightly lighter dark gray for body text */
    margin-bottom: 1rem; /* Bottom margin for paragraph separation */
}

.privacyNestZone ul {
    /* Unordered list styles */
    list-style-type: disc; /* Default disc bullet points */
    padding-left: 1.5rem; /* Indent list items */
    margin-bottom: 1rem; /* Bottom margin for list separation */
    color: #4a5568; /* Inherit text color */
}

.privacyNestZone ol {
    /* Ordered list styles */
    list-style-type: decimal; /* Default decimal numbering */
    padding-left: 1.5rem; /* Indent list items */
    margin-bottom: 1rem; /* Bottom margin for list separation */
    color: #4a5568; /* Inherit text color */
}

.privacyNestZone li {
    /* List item styles */
    font-size: 1rem; /* Approximately 16px */
    line-height: 1.7;
    color: #4a5568; /* Slightly lighter dark gray for body text */
    margin-bottom: 0.5rem; /* Space between list items */
}

/* Specific adjustment for the last paragraph/list item to prevent excessive bottom margin */
.privacyNestZone p:last-child,
.privacyNestZone ul:last-child,
.privacyNestZone ol:last-child {
    margin-bottom: 0;
}

@media (max-width: 959px) {
  nav#main-nav ul {
    display: none;
  }
  .text-5xl {
    font-size: 25px !important;
  }
    .timeline-container div {
        margin: 0 0 40px 0;
        width: 100%;
        box-sizing: border-box;
    }
    .timeline-container > .absolute {
        display: none;
    }
}

footer li a {
    color: #f3ecb1;
}
