body {
            font-family: 'Syne', sans-serif;
            background-color: #F8F8F8; /* Main page background */
            color: #2C2C2C; /* Primary text color */
            line-height: 1.6;
            scroll-behavior: smooth;
            overflow-x: hidden; /* Ensure no horizontal scroll for the entire page */
        }
        h1, h2, h3, h4 {
            font-family: 'Syne', sans-serif;
            font-weight: 700;
            color: #2C2C2C; /* Heading text color */
        }
        h1 { font-weight: 800; }

        .section-padding {
            padding: 80px 0;
        }

        /* Hero Section Specific Styles */
        .hero-section {
            background: linear-gradient(135deg, #FF6600, #FF3300); /* Orange gradient */
            color: white;
            padding: 120px 0 100px; /* Adjusted padding for top space */
            text-align: center;
            border-bottom-left-radius: 50px;
            border-bottom-right-radius: 50px;
            box-shadow: 0 10px 30px rgba(255, 102, 0, 0.3); /* Orange shadow */
        }
        .hero-title {
            font-size: 3.5rem; /* Large title */
            line-height: 1.2;
            margin-bottom: 1.5rem;
            text-shadow: 2px 2px 5px rgba(0,0,0,0.2); /* Subtle text shadow */
        }
        .hero-subtitle {
            font-size: 1.5rem;
            color: rgba(255, 255, 255, 0.9);
            max-width: 900px;
            margin: 0 auto 2.5rem;
            font-weight: 500;
        }
        .hero-cta-button {
            background-color: #FFFFFF; /* White button */
            color: #FF6600; /* Orange text */
            padding: 1rem 2.5rem;
            border-radius: 9999px; /* Pill shape */
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            transition: all 0.3s ease-in-out;
            box-shadow: 0 8px 20px rgba(0,0,0,0.1);
            display: inline-block;
        }
        .hero-cta-button:hover {
            transform: translateY(-5px) scale(1.02);
            box-shadow: 0 12px 25px rgba(0,0,0,0.15);
        }
        .just-dial-rating {
            font-size: 1.15rem;
            font-weight: 600;
            color: white;
            margin-top: 1.5rem;
            margin-bottom: 2.5rem;
        }
        .just-dial-rating strong {
            color: #FFFAEC; /* Very light orange for emphasis */
        }

        /* General Card Styles (for all cards that share basic visual properties) */
        .card-base {
            background-color: #FFFFFF;
            border-radius: 15px;
            box-shadow: 0 5px 20px rgba(0,0,0,0.08);
            border: 1px solid #E0E0E0;
            overflow: hidden;
            position: relative;
            transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
        }
        .card-base:hover {
            transform: translateY(-8px) scale(1.02);
            box-shadow: 
                0 10px 25px rgba(0,0,0,0.15),
                0 0 0 3px rgba(255, 102, 0, 0.3); /* Orange accent on hover */
            border-color: #FF6600;
        }
        .card-icon-circle { /* Common style for circular icon backgrounds */
            background-color: #FFF5EE; /* Light orange */
            border-radius: 50%;
            width: 80px;
            height: 80px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 3rem;
            color: #FF6600; /* Orange icon */
            box-shadow: inset 0 2px 5px rgba(0,0,0,0.05);
            transition: transform 0.3s ease-in-out;
        }
        .card-base:hover .card-icon-circle {
            transform: translateY(-5px) rotate(5deg);
        }
        .card-title { /* Common style for card titles */
            font-size: 1.5rem;
            font-weight: 600;
            color: #2C2C2C;
            margin-bottom: 0.75rem;
        }
        .card-description { /* Common style for card descriptions */
            font-size: 1rem;
            color: #6B6B6B;
            overflow-wrap: break-word;
            word-break: break-word;
        }

        /* Android Core Expertise Section (New Design) */
        .android-expertise-layout {
            display: flex;
            gap: 2rem;
            flex-wrap: wrap; /* Allows stacking on mobile */
            background-color: #FDFDFD; /* Slightly darker light grey for this section */
            border-radius: 20px; /* Rounded corners for the whole block */
            padding: 2.5rem;
            box-shadow: 0 8px 25px rgba(0,0,0,0.08);
        }
        .android-expertise-list {
            flex: 1; /* Takes up available space */
            min-width: 280px; /* Ensures list doesn't get too narrow */
        }
        .android-expertise-details {
            flex: 2; /* Takes up more space */
            min-width: 300px; /* Ensures details panel doesn't get too narrow */
            background-color: #FFFFFF;
            border-radius: 15px;
            padding: 2rem;
            box-shadow: inset 0 2px 10px rgba(0,0,0,0.05);
            border: 1px solid #E0E0E0;
            display: flex;
            flex-direction: column;
            justify-content: center; /* Center content vertically */
            min-height: 250px; /* Ensure a minimum height */
        }
        .expertise-list-item {
            display: flex;
            align-items: center;
            padding: 1rem 1.25rem;
            margin-bottom: 0.5rem;
            background-color: #F8F8F8; /* Light grey background for items */
            border-radius: 10px;
            cursor: pointer;
            transition: all 0.2s ease-in-out;
            font-weight: 600;
            color: #2C2C2C;
        }
        .expertise-list-item:hover {
            background-color: #FFF5EE; /* Light orange on hover */
            color: #FF6600;
            transform: translateX(5px);
            box-shadow: 0 2px 8px rgba(255,102,0,0.1);
        }
        .expertise-list-item.active {
            background-color: #FF6600; /* Active orange */
            color: white;
            box-shadow: 0 4px 12px rgba(255,102,0,0.3);
        }
        .list-icon-wrapper { /* Wrapper for list icons to give them a unique shape */
            background-color: #FFF5EE; /* Light orange background */
            border-radius: 8px; /* Rounded square shape */
            width: 45px; /* Size of the wrapper */
            height: 45px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem; /* Size of the emoji within */
            color: #FF6600; /* Orange emoji color */
            flex-shrink: 0;
            margin-right: 0.75rem; /* ADJUSTED: Space between icon and text, closer */
            box-shadow: inset 0 1px 3px rgba(0,0,0,0.05);
            transition: all 0.2s ease-in-out;
        }
        .expertise-list-item.active .list-icon-wrapper {
            background-color: white; /* White background for active icon wrapper */
            color: #FF6600; /* Orange icon color when active */
            box-shadow: none; /* Remove inset shadow when active */
        }

        /* Why Choose Pengwin Section (New Design) */
        .why-pengwin-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
            gap: 2rem;
        }
        .why-pengwin-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            padding: 2rem;
            background-color: #FFFFFF;
            border-radius: 15px;
            border: 1px solid #E0E0E0;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
            transition: all 0.3s ease-in-out;
        }
        .why-pengwin-item:hover {
            transform: translateY(-10px);
            box-shadow: 0 10px 25px rgba(255, 102, 0, 0.15);
            border-color: #FF6600;
        }
        .why-pengwin-icon {
            font-size: 4rem;
            color: #FF6600;
            margin-bottom: 1.5rem;
        }
        .why-pengwin-title {
            font-size: 1.75rem;
            font-weight: 600;
            color: #2C2C2C;
            margin-bottom: 0.75rem;
        }
        .why-pengwin-description {
            font-size: 1rem;
            color: #6B6B6B;
        }

        /* Our Streamlined Workflow Section (NEW UI: Horizontal Flow with Icons on Left) */
        .workflow-staggered-container {
            max-width: 900px; /* Center content */
            margin: 0 auto;
            position: relative;
            padding-left: 100px; /* Space for the line and icons on the left */
            padding-right: 20px; /* General padding on right */
            padding-top: 2rem; /* Top padding */
            padding-bottom: 2rem; /* Bottom padding */
        }
        .workflow-vertical-line { /* New class for the static vertical line */
            position: absolute;
            left: 50px; /* Position of the line */
            top: 0;
            height: 100%;
            width: 3px; /* Thickness of the line */
            background-color: #DEDEDE; /* Grey line */
            z-index: 0; /* Behind workflow items */
        }
        .workflow-item {
            display: flex;
            align-items: center;
            margin-bottom: 3rem; /* Space between items */
            position: relative; /* For the ::before dot and icon positioning */
        }
        .workflow-item:last-child {
            margin-bottom: 0;
        }
        /* Dot on the line */
        .workflow-item::before {
            content: '';
            position: absolute;
            left: -17px; /* Position relative to workflow-vertical-line (50px - 20px/2 + 3px/2) */
            top: 50%;
            transform: translateY(-50%);
            width: 20px;
            height: 20px;
            background-color: #FF6600; /* Orange dot */
            border-radius: 50%;
            border: 4px solid #F8F8F8; /* Matches body background */
            z-index: 2; /* Above the line */
            box-shadow: 0 0 0 3px rgba(255, 102, 0, 0.2);
            transition: all 0.3s ease-in-out;
        }
        .workflow-item-icon-wrapper { /* New wrapper for icons matching image */
            flex-shrink: 0;
            background-color: #FF6600; /* Orange background */
            border-radius: 8px; /* Rounded square */
            width: 60px; /* Size of the icon box */
            height: 60px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 2.2rem; /* Size of the icon */
            color: white;
            margin-right: 1.5rem; /* Space between icon box and content box */
            box-shadow: 0 4px 10px rgba(0,0,0,0.1);
            z-index: 1; /* Above general items, below dot */
            transition: all 0.3s ease-in-out;
        }
        .workflow-content-box { /* New class for the actual content box */
            background-color: #FFFFFF;
            border-radius: 15px;
            padding: 1.5rem;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
            border: 1px solid #E0E0E0;
            flex-grow: 1; /* Allows content box to take remaining space */
            transition: all 0.3s ease-in-out;
        }
        .workflow-item:hover .workflow-content-box {
            transform: translateY(-5px);
            box-shadow: 0 8px 20px rgba(255, 102, 0, 0.15);
            border-color: #FF9900;
        }
        .workflow-item:hover .workflow-item-icon-wrapper {
            transform: scale(1.05);
            box-shadow: 0 6px 15px rgba(255, 102, 0, 0.25);
        }
        .workflow-item-title {
            font-size: 1.3rem;
            font-weight: 600;
            color: #2C2C2C;
            margin-bottom: 0.5rem;
        }
        .workflow-item-description {
            font-size: 0.95rem;
            color: #6B6B6B;
        }
        
        /* Technology Section (Re-styled Tech Cards with Active State) */
        .tech-section {
            background-color: #FDFDFD; /* Alternating background */
        }
        .tech-card {
            background-color: #FFFFFF;
            border-radius: 15px;
            padding: 1.5rem;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: all 0.2s ease-in-out;
            border: 1px solid #E0E0E0;
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
            width: 140px;
            height: 140px;
            text-align: center;
        }
        .tech-card:hover {
            transform: translateY(-8px) scale(1.08);
            box-shadow: 0 8px 20px rgba(255, 102, 0, 0.3);
            border-color: #FF6600;
        }
        .tech-card.active {
            background-color: #FF6600; /* Active orange background */
            color: white;
            transform: translateY(-5px) scale(1.05);
            box-shadow: 0 5px 15px rgba(255, 102, 0, 0.3);
            border-color: #FF6600;
        }
        .tech-card.active .tech-icon-display {
            color: white;
        }
        .tech-icon-display {
            font-size: 3.5rem;
            line-height: 1;
            margin-bottom: 0.5rem;
            color: #FF6600;
            transition: all 0.2s ease-in-out;
        }
        .tech-label {
            font-size: 0.9rem;
            font-weight: 600;
            color: #6B6B6B;
            overflow-wrap: break-word;
            word-break: break-word;
        }
        .tech-card.active .tech-label {
            color: white;
        }
        .tech-details-panel {
            background-color: #FFFFFF;
            border-radius: 15px;
            box-shadow: 0 5px 20px rgba(0,0,0,0.08);
            padding: 2rem;
            margin-top: 2rem;
            border: 1px solid #E0E0E0;
            min-height: 200px;
            overflow-wrap: break-word;
            word-break: break-word;
        }

        /* Industry Focus Section (New Design) */
        .industry-focus-item {
            background-color: #FFFFFF;
            border-radius: 15px;
            box-shadow: 0 5px 20px rgba(0,0,0,0.08);
            transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
            border: 1px solid #E0E0E0;
            padding: 2rem;
            text-align: center;
        }
        .industry-focus-item:hover {
            transform: translateY(-10px) scale(1.03);
            box-shadow: 
                0 15px 35px rgba(0,0,0,0.2),
                0 0 0 3px rgba(255, 102, 0, 0.3);
            border-color: #FF6600;
        }
        .industry-focus-icon {
            font-size: 4rem;
            margin-bottom: 1rem;
            line-height: 1;
            transition: transform 0.3s ease-in-out;
            color: #FF6600;
        }
        .industry-focus-item:hover .industry-focus-icon {
            transform: scale(1.1) rotate(5deg);
        }
        .industry-focus-title {
            font-size: 1.75rem;
            font-weight: 600;
            margin-bottom: 0.75rem; /* Reduced margin to bring text closer */
            color: #2C2C2C;
        }
        .industry-focus-description {
            font-size: 0.9rem; /* Slightly smaller for conciseness */
            color: #6B6B6B;
            overflow-wrap: break-word;
            word-break: break-word;
        }

        /* Testimonials Section */
        .testimonial-carousel-container {
            position: relative;
            max-width: 900px; /* Constrain width of carousel */
            margin: 0 auto;
            overflow: hidden;
        }
        .testimonial-track {
            display: flex;
            transition: transform 0.5s ease-in-out; /* Smooth slide effect */
        }
        .testimonial-item {
            flex-shrink: 0; /* Prevent items from shrinking */
            width: 100%; /* Each item takes full width of container */
            padding: 2.5rem;
            background-color: #FFFFFF;
            border-radius: 15px;
            box-shadow: 0 5px 20px rgba(0,0,0,0.08);
            border: 1px solid #E0E0E0;
            text-align: center;
        }
        .testimonial-text {
            font-size: 1.15rem;
            font-style: italic;
            color: #2C2C2C;
            margin-bottom: 1.5rem;
        }
        .testimonial-author {
            font-weight: 700;
            font-size: 1.1rem;
            color: #FF6600;
        }
        .testimonial-title-meta {
            font-size: 0.95rem;
            color: #6B6B6B;
        }
        .carousel-dots {
            display: flex;
            justify-content: center;
            margin-top: 1.5rem;
        }
        .dot {
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background-color: #DEDEDE;
            margin: 0 8px;
            cursor: pointer;
            transition: background-color 0.3s ease;
        }
        .dot.active {
            background-color: #FF6600; /* Active dot orange */
        }

        /* Footer */
        .footer-bg {
            background-color: #F8F8F8;
            border-top: 1px solid #E0E0E0;
        }
        .highlight-text {
            color: #FF6600; /* Primary orange highlight */
            font-weight: 700;
        }
        .text-white { /* Explicitly ensure white text on orange background */
            color: white;
        }


        /* Responsive adjustments */
        @media (max-width: 767px) {
            .hero-title {
                font-size: 2.5rem;
            }
            .hero-subtitle {
                font-size: 1.25rem;
            }
            .section-padding {
                padding: 60px 0;
            }
            h2 {
                font-size: 2rem;
            }

            /* Android Core Expertise */
            .android-expertise-layout {
                flex-direction: column;
                padding: 1.5rem;
            }
            .android-expertise-list, .android-expertise-details {
                min-width: unset;
                width: 100%;
            }
            .expertise-list-item {
                font-size: 0.95rem;
                padding: 0.8rem 1rem;
            }
            .list-icon-wrapper { /* Adjust wrapper size for mobile */
                width: 40px; 
                height: 40px;
                font-size: 1.3rem;
                margin-right: 0.8rem; /* Adjusted for closer proximity */
            }
            .android-expertise-details {
                margin-top: 1.5rem;
                padding: 1.5rem;
                min-height: 200px; /* Adjust as needed for mobile content */
            }
            .android-expertise-details h3 {
                font-size: 1.3rem;
            }
            .android-expertise-details p {
                font-size: 0.9rem;
            }

            /* Why Choose Pengwin */
            .why-pengwin-item {
                padding: 1.5rem;
            }
            .why-pengwin-icon {
                font-size: 3rem;
            }
            .why-pengwin-title {
                font-size: 1.3rem;
            }

            /* Workflow Process (Mobile specific adjustments for the new UI) */
            .workflow-staggered-container {
                padding-left: 20px; /* Adjust line position for mobile */
                padding-right: 15px; /* General right padding */
            }
            .workflow-vertical-line {
                left: 10px; /* Position line further left for mobile */
            }
            .workflow-item {
                flex-direction: row; /* Keep content and icon in a row */
                align-items: flex-start; /* Align content to top */
                margin-bottom: 2rem; /* Reduce vertical spacing */
                padding-left: 35px; /* Adjust padding to make space for the line and icon */
            }
            .workflow-item-icon-wrapper {
                position: absolute; /* Revert to absolute for icon positioning relative to item */
                left: 0; /* Position icon at the very left of the item */
                top: 0; /* Align to top of content, or adjust as needed */
                transform: none; /* Remove transform */
                width: 50px; /* Adjust size for mobile */
                height: 50px;
                font-size: 1.8rem;
                margin-right: 1rem; /* Space between icon and content */
            }
            .workflow-item::before {
                left: -10px; /* Adjust dot position relative to the line (10px - 20px/2 = 0, so -10 for icon overlap) */
            }
            .workflow-content-box {
                width: calc(100% - 65px); /* Adjust width to make space for icon and padding */
                padding: 1rem;
            }
            .workflow-item-title {
                font-size: 1.1rem;
            }
            .workflow-item-description {
                font-size: 0.85rem;
            }

            /* Tech Stack */
            .tech-card {
                width: 100px;
                height: 100px;
                padding: 0.75rem;
            }
            .tech-icon-display {
                font-size: 2.5rem;
            }
            .tech-label {
                font-size: 0.75rem;
            }
            .tech-details-panel {
                min-height: 160px;
                padding: 1.5rem;
            }
            /* Industry Focus */
            .industry-focus-item {
                padding: 1.5rem;
            }
            .industry-focus-icon {
                font-size: 3rem;
            }
            .industry-focus-title {
                font-size: 1.3rem;
            }
            .industry-focus-description {
                font-size: 0.85rem;
            }
            /* Testimonials */
            .testimonial-item {
                padding: 1.5rem;
            }
            .testimonial-text {
                font-size: 1rem;
            }
        }