/* Styles for Lab Page */
body {
    font-family: 'Poppins', sans-serif;
    color: #333;
    line-height: 1.6;
}

.page-content {
    padding-bottom: 40px;
}

.lab-hero {
    background: url('../images/lab-banner.png') no-repeat center center/cover;
    color: var(--white);
    padding: 200px 0 150px; /* Increased padding for floating bubble */
    text-align: center;
    position: relative; 
    width: 100%; /* Ensure hero spans full width */
}

.lab-hero h1 {
    font-size: 48px; /* Align with impact page hero font size */
    font-weight: 600;
    color: var(--dark-color); /* Align with impact page hero color */
    margin-bottom: 20px; /* Align with impact page hero h1 margin */
}

.lab-hero p {
    font-size: 20px; /* Align with impact page hero font size */
    color: var(--text-color); /* Align with impact page hero color */
    max-width: 700px;
    margin: 0 auto;
}

.lab-section {
    margin-bottom: 50px;
    padding: 30px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 3px 15px rgba(0,0,0,0.08);
}

.lab-section h2 {
    font-size: 2.2em;
    font-weight: 600;
    color: #005cbf; /* Primary blue for lab */
    margin-bottom: 25px;
    padding-bottom: 12px;
    border-bottom: 2px solid #005cbf;
    display: inline-block;
}

.lab-section p, .lab-section ul {
    font-size: 1em;
    margin-bottom: 15px;
}

.lab-section ul {
    list-style-type: disc;
    padding-left: 20px;
}

.lab-container {
    max-width: 900px;
    margin: 0 auto;
}

.lab-image {
    width: 100%;
    max-width: 400px;
    height: auto;
    border-radius: 8px;
    margin: 20px auto;
    display: block;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* Animation placeholder - assuming animate-on-scroll is defined elsewhere */
.animate-on-scroll {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.animate-on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Add any additional lab-specific styles here */

/* Tensile Stress-Strain Curves Section */
.tensile-curves-section {
    padding: 30px 0 60px 0; /* Adjusted top padding, kept bottom padding */
    background-color: #ffffff; /* White background */
}

.tensile-curves-section .container-fluid {
    max-width: 1200px; /* Match algae-processing-innovation-section */
    margin: 0 auto;
    padding-left: 15px; /* Add some padding for container-fluid */
    padding-right: 15px; /* Add some padding for container-fluid */
}

.tensile-curves-section .chart-wrapper {
    background-color: #f0f8ff; /* Light blue background for chart area */
    border: 1px solid #ddeeff; /* Softer border */
    padding: 30px;
    margin-bottom: 30px;
    border-radius: 8px;
}

.tensile-curves-section .chart-wrapper img {
    width: 70%; /* Resize chart to 70% */
    border: 1px solid #ccc; /* Border for the placeholder image itself */
    opacity: 1; /* Ensure image is fully visible if previously placeholder */
    display: block; /* For centering */
    margin-left: auto; /* For centering */
    margin-right: auto; /* For centering */
}

.tensile-curves-section .text-block {
    background-color: #e9f5ff; /* Slightly different light blue for text */
    padding: 25px;
    border-radius: 8px;
    font-family: 'Noto Sans SC', sans-serif;
    font-size: 1em;
    line-height: 1.7;
    color: #555;
}

.tensile-curves-section .text-block p {
    margin-bottom: 15px;
}

.tensile-curves-section .text-block p:last-child {
    margin-bottom: 0;
}


/* Key Competitor Benchmarking Section */
.key-competitor-benchmarking-section {
    padding: 60px 0;
    background-color: #ffffff; /* White background */
}

.key-competitor-benchmarking-section .container-fluid {
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 15px;
    padding-right: 15px;
}

.key-competitor-benchmarking-section .section-title-bar {
    text-align: center;
    margin-bottom: 40px;
}

.key-competitor-benchmarking-section .section-title-bar h2 {
    font-family: 'Prompt', sans-serif;
    font-size: 2.5em;
    font-weight: bold;
    color: #333;
    border-bottom: 2px solid #007bff;
    padding-bottom: 10px;
    display: inline-block;
    margin-bottom: 0; /* Reset margin from general h2 if any */
}

.key-competitor-benchmarking-section .table-responsive {
    margin-bottom: 30px;
    /* background-color: #f8f9fa; */ /* Removed background from wrapper */
    /* padding: 20px; */ /* Removed padding from wrapper */
    border-radius: 8px;
    overflow-x: auto; /* Ensure table is scrollable on small screens */
}

.key-competitor-benchmarking-section .benchmark-table {
    width: 100%;
    border-collapse: collapse; /* Or 'separate' with border-spacing if preferred */
    font-family: 'Poppins', sans-serif; /* Match body font or specify */
    font-size: 0.9em;
    color: #333;
    background-color: #ffffff; /* White background for the table itself */
    border-radius: 8px; /* Apply border radius to table if not using wrapper for background */
    overflow: hidden; /* Needed for border-radius on table */
}

.key-competitor-benchmarking-section .benchmark-table th,
.key-competitor-benchmarking-section .benchmark-table td {
    padding: 12px 15px;
    text-align: left;
    border-bottom: 1px solid #e0e0e0; /* Light border for rows */
}

.key-competitor-benchmarking-section .benchmark-table thead th {
    background-color: #4A7C85; /* Teal background for header */
    color: #ffffff;
    font-weight: 600;
    border-bottom: 2px solid #3D656D; /* Darker teal border for header bottom */
}

.key-competitor-benchmarking-section .benchmark-table tbody tr {
    background-color: #f7fafa; /* Very light teal for even rows */
}

.key-competitor-benchmarking-section .benchmark-table tbody tr:nth-of-type(odd) {
    background-color: #ffffff; /* White for odd rows */
}

.key-competitor-benchmarking-section .benchmark-table tbody tr:hover {
    background-color: #e9f5f7; /* Light hover effect */
}

.key-competitor-benchmarking-section .benchmark-table td:first-child,
.key-competitor-benchmarking-section .benchmark-table th:first-child {
    background-color: #5F9EA0; /* Slightly different teal for the first column */
    color: #ffffff;
    font-weight: 500;
}

.key-competitor-benchmarking-section .benchmark-table tbody tr:nth-of-type(odd) td:first-child {
    background-color: #5F9EA0; /* Ensure odd rows first cell also has this bg */
}
.key-competitor-benchmarking-section .benchmark-table tbody tr:nth-of-type(even) td:first-child {
    background-color: #589395; /* Slightly darker for even rows first cell */
}


.key-competitor-benchmarking-section .benchmark-table strong {
    font-weight: bold;
    color: #000000; /* Black for the bolded number */
}

.key-competitor-benchmarking-section .text-block {
    background-color: #e9f5ff; /* Light blue for text block */
    padding: 25px;
    border-radius: 8px;
    font-family: 'Noto Sans SC', sans-serif;
}

.key-competitor-benchmarking-section .text-block ul {
    list-style-position: outside;
    padding-left: 20px; /* Indent list items */
    margin-bottom: 15px;
}

.key-competitor-benchmarking-section .text-block ul li {
    margin-bottom: 10px;
    line-height: 1.7;
    color: #333;
}

.key-competitor-benchmarking-section .text-block ul li strong {
    color: #005cbf; /* Blue for emphasis */
}

.key-competitor-benchmarking-section .text-block .data-sources {
    font-size: 0.85em;
    color: #555;
    margin-top: 20px;
    font-style: italic;
}

/* Responsive adjustments for key-competitor-benchmarking-section */
@media (max-width: 991px) { /* Medium devices */
    .key-competitor-benchmarking-section .section-title-bar h2 {
        font-size: 2.2em;
    }
}

@media (max-width: 767px) { /* Small devices */
    .key-competitor-benchmarking-section {
        padding: 40px 0;
    }
    .key-competitor-benchmarking-section .section-title-bar h2 {
        font-size: 1.8em;
    }
    .key-competitor-benchmarking-section .text-block ul li,
    .key-competitor-benchmarking-section .text-block .data-sources {
        font-size: 0.9em;
    }
}

/* Responsive adjustments for tensile-curves-section */
@media (max-width: 767px) { /* Small devices */
    .tensile-curves-section {
        padding: 30px 0 40px 0; /* Adjusted top padding, kept bottom padding */
    }
    .tensile-curves-section .text-block {
        font-size: 0.95em;
    }
}

/* Algae Composition Section */
.algae-composition-section {
    padding: 60px 0;
    background-color: #ffffff; /* Assuming a white background from the image */
}

.algae-composition-section .container-fluid {
    max-width: 1200px; /* Or your preferred max-width */
    margin: 0 auto;
}

.algae-info-left {
    background-image: url('../images/Al.png');
    background-size: cover;
    background-position: center;
    color: #ffffff;
    padding: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center; /* Center content vertically */
    position: relative; /* For overlay */
    z-index: 1;
}

.algae-info-left::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.3); /* Semi-transparent overlay */
    z-index: -1; /* Behind the content */
}

.algae-info-left .altomic-brand-small {
    font-size: 0.9em;
    margin-bottom: 20px;
    opacity: 0.8;
}

.algae-info-left .altomic-brand-small span {
    display: block;
}

.algae-info-left h2 {
    font-family: 'Prompt', sans-serif; /* Assuming similar font as other headlines */
    font-size: 3.5em; /* Adjust as needed */
    font-weight: bold;
    line-height: 1.2;
    margin-bottom: 0;
}

.algae-info-right {
    padding: 40px;
    background-color: #f8f9fa; /* Light grey background for contrast */
}

.algae-info-right h3 {
    font-family: 'Prompt', sans-serif;
    font-size: 1.8em;
    font-weight: bold;
    color: #333;
    margin-bottom: 30px; /* Matched to cross-linking section */
    border-bottom: 2px solid #333; /* Matched to cross-linking section */
    padding-bottom: 10px;
    display: inline-block; /* To make border only as wide as text */
}

.algae-info-right p {
    font-family: 'Noto Sans SC', sans-serif;
    font-size: 1em;
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
}

.chemical-structures {
    display: flex;
    justify-content: center; /* Center the single image */
    align-items: center;
    margin-top: 30px;
}

.chemical-structures img {
    max-width: 80%; /* Adjust as needed, ensures it doesn't take full width if too large */
    height: auto;
    display: block; /* Remove extra space below image */
    margin: 0 auto; /* Center the image if max-width is less than container */
}

/* Cross-Linking Mechanism Section */
.cross-linking-mechanism-section {
    padding: 60px 0;
    background-color: #f8f9fa; /* Light grey background */
}

.cross-linking-mechanism-section .container-fluid {
    max-width: 1200px; /* Or your preferred max-width */
    margin: 0 auto;
}

.cross-linking-mechanism-section .algae-info-left {
    background-image: url('../images/Al2.png'); /* New background image */
    background-size: cover;
    background-position: center;
    color: #ffffff;
    padding: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center; /* Center content vertically */
    position: relative; /* For overlay */
    z-index: 1;
}

.cross-linking-mechanism-section .algae-info-left::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.3); /* Semi-transparent overlay */
    z-index: -1; /* Behind the content */
}

.cross-linking-mechanism-section .algae-info-left h2 {
    font-family: 'Prompt', sans-serif; /* Assuming similar font as other headlines */
    font-size: 3.5em; /* Adjust as needed */
    font-weight: bold;
    line-height: 1.2;
    margin-bottom: 0;
}

.cross-linking-mechanism-section .algae-info-right {
    padding: 40px;
    background-color: #ffffff; /* White background for the right side based on image */
}

.cross-linking-mechanism-section .algae-info-right h3 {
    font-family: 'Prompt', sans-serif;
    font-size: 1.8em;
    font-weight: bold;
    color: #333;
    margin-bottom: 30px; /* Increased margin */
    border-bottom: 2px solid #333; /* Darker accent line from image */
    padding-bottom: 10px;
    display: inline-block; /* To make border only as wide as text */
}

.cross-linking-mechanism-section .algae-info-right h4 {
    font-family: 'Prompt', sans-serif;
    font-size: 1.3em; /* Slightly smaller than h3 */
    font-weight: bold;
    color: #ffffff; /* White text */
    background-color: #505050; /* Dark grey background from image */
    padding: 10px 15px;
    margin-bottom: 15px;
    display: inline-block;
    border-radius: 4px;
}

.cross-linking-mechanism-section .info-right-content-wrapper {
    display: flex;
    flex-wrap: wrap; /* Allow wrapping on smaller screens */
    gap: 20px; /* Space between blocks */
}

.info-block {
    flex: 1;
    min-width: 320px; /* Slightly wider */
    margin: 10px;
    text-align: center; /* Center h4 and other inline/inline-block elements */
}

.info-block p {
    background-color: rgba(0, 0, 0, 0.7); /* Matte black background */
    color: white;
    padding: 15px;
    border-radius: 8px;
    text-align: left; /* Align text to the left within the black box */
    font-size: 1em; /* Default font size */
}

.info-block-2 p {
    font-size: 0.875em; /* Smaller font size for the second block */
}

.info-block img {
    max-width: 100%;
    height: auto;
    display: block; /* Ensures margin auto works for centering */
    margin: 0 auto 15px auto; /* Center block images and add bottom margin */
}


/* Innovation of Algae Processing Section */
.algae-processing-innovation-section {
    padding: 60px 0 0 0; /* Kept top padding, removed bottom padding */
    background-color: #ffffff; /* White background */
}

.algae-processing-innovation-section .container-fluid {
    max-width: 1200px;
    margin: 0 auto;
}

.algae-processing-innovation-section h2 {
    font-family: 'Roboto', sans-serif;
    font-size: 2.2em; /* Adjusted for consistency */
    font-weight: bold;
    color: #333;
    text-align: center;
    margin-bottom: 30px; /* Adjusted for alignment */
    border-bottom: 2px solid #333; /* Adjusted for alignment */
    padding-bottom: 10px;
    display: inline-block;
}

.algae-processing-innovation-section .section-title-wrapper {
    text-align: center; /* Center the h2 */
    margin-bottom: 40px;
}

.algae-processing-innovation-section .image-comparison-wrapper {
    display: flex;
    align-items: center; /* Vertically align items */
    justify-content: center; /* Horizontally center items */
    gap: 20px; /* Space between images and arrow */
    margin-bottom: 30px; /* Space below the image row */
}

.algae-processing-innovation-section .content-wrapper {
    display: flex;
    flex-wrap: wrap; /* Allow wrapping on smaller screens */
    gap: 30px; /* Space between blocks */
    justify-content: center; /* Center blocks if they don't fill the row */
}

.algae-processing-innovation-section .image-block,
.algae-processing-innovation-section .arrow-block,
.algae-processing-innovation-section .text-block {
    flex: 1;
    min-width: auto; /* Allow flex to control width */
    background-color: transparent; /* Remove individual block background */
    padding: 0;
    border-radius: 0;
    box-shadow: none;
}

.algae-processing-innovation-section .image-block {
    flex: 1 1 45%; /* Allow shrinking, basis of 45% for larger images */
    max-width: 50%; /* Max width to prevent oversized images, allowing more space */
    background-color: #f0f8ff; /* Light blue background as in example */
    padding: 20px;
    border-radius: 8px;
}

.algae-processing-innovation-section .arrow-block {
    flex: 0 0 auto; /* Don't grow or shrink, size based on content */
    display: flex;
    align-items: center;
    justify-content: center;
}

.algae-processing-innovation-section .arrow-block img {
    width: 80px; /* Adjusted for arrow.png */
    height: auto;
}

.algae-processing-innovation-section .image-block {
    display: flex;
    flex-direction: column; /* Stack image and caption */
    align-items: center; /* Center image and caption */
    text-align: center;
}

.algae-processing-innovation-section .image-block .image-title {
    font-size: 1em;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
    background-color: rgba(255, 255, 255, 0.7); /* Light background for title */
    padding: 5px 10px;
    border-radius: 4px;
    display: inline-block;
}

.algae-processing-innovation-section .image-block img {
    width: 100%; /* Make image take full width of its container */
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    margin-bottom: 15px;
}

.algae-processing-innovation-section .image-block figcaption {
    font-size: 0.9em;
    color: #555;
    font-style: italic;
    display: none; /* Hide figcaption for now as per image */
}

.algae-processing-innovation-section .text-block h4 {
    font-family: 'Prompt', sans-serif;
    font-size: 1.4em;
    font-weight: bold;
    color: #333;
    margin-bottom: 15px;
}

.algae-processing-innovation-section .text-block p {
    font-family: 'Noto Sans SC', sans-serif;
    font-size: 1em;
    line-height: 1.7;
    color: #555;
    margin-bottom: 15px;
}


.algae-processing-innovation-section .text-block {
    background-color: #e0f0ff; /* Light blue background for text blocks */
    padding: 20px;
    border-radius: 8px;
}

/* Responsive adjustments for algae-processing-innovation-section */
@media (max-width: 991px) { /* Medium devices */
    .algae-processing-innovation-section h2 {
        font-size: 2.2em;
    }
    .algae-processing-innovation-section .text-block h4 {
        font-size: 1.3em;
    }
}

@media (max-width: 767px) { /* Small devices */
    .algae-processing-innovation-section {
        padding: 40px 0 0 0; /* Kept top padding, removed bottom padding */
    }
    .algae-processing-innovation-section h2 {
        font-size: 1.8em;
    }
    .algae-processing-innovation-section .image-comparison-wrapper {
        flex-direction: column;
        gap: 15px;
    }
    .algae-processing-innovation-section .image-block {
        max-width: 80%; /* Allow images to be larger on smaller screens when stacked */
    }
    .algae-processing-innovation-section .arrow-block img {
        transform: rotate(90deg); /* Rotate arrow for vertical stacking */
        width: 50px; /* Adjust arrow size for stacked view */
    }
    .algae-processing-innovation-section .content-wrapper {
        flex-direction: column;
    }
    .algae-processing-innovation-section .image-block,
.algae-processing-innovation-section .arrow-block,
    .algae-processing-innovation-section .text-block {
        min-width: 100%; /* Full width for stacked blocks */
    }
    .algae-processing-innovation-section .text-block h4 {
        font-size: 1.2em;
    }
    .algae-processing-innovation-section .text-block p {
        font-size: 0.95em;
    }
}

/* Responsive adjustments for algae-composition-section */
@media (max-width: 991px) { /* Medium devices (tablets, less than 992px) */
    .algae-info-left h2, .cross-linking-mechanism-section .algae-info-left h2 {
        font-size: 2.8em;
    }
    .algae-info-right h3, .cross-linking-mechanism-section .algae-info-right h3 {
        font-size: 1.5em;
    }
    .cross-linking-mechanism-section .algae-info-right h4 {
        font-size: 1.1em;
    }
    .cross-linking-mechanism-section .info-right-content-wrapper {
        flex-direction: column; /* Stack blocks on medium screens */
    }
    .cross-linking-mechanism-section .info-block {
        flex-basis: 100%; /* Full width for stacked blocks */
    }
    /* No specific changes needed for .chemical-structures img here, it will inherit */
}


@media (max-width: 767px) { /* Small devices (landscape phones, less than 768px) */
    .algae-composition-section, .cross-linking-mechanism-section {
        padding: 40px 0;
    }
    .algae-info-left, .cross-linking-mechanism-section .algae-info-left {
        padding: 30px;
        text-align: center; /* Center text on small screens */
    }
    .algae-info-left h2, .cross-linking-mechanism-section .algae-info-left h2 {
        font-size: 2.2em;
    }
    .algae-info-right, .cross-linking-mechanism-section .algae-info-right {
        padding: 30px;
    }
    .algae-info-right h3, .cross-linking-mechanism-section .algae-info-right h3 {
        font-size: 1.3em;
    }
    .cross-linking-mechanism-section .algae-info-right h4 {
        font-size: 1em;
        padding: 8px 12px;
    }
    .algae-info-right p, .cross-linking-mechanism-section .algae-info-right p {
        font-size: 0.95em;
    }
}

/* Styles for ALTOMIC Intro Section */
.altomic-intro-section {
    background-color: #f0f0f0; /* Placeholder background */
    background-image: url('../images/Altomic.png'); /* Placeholder for user to replace */
    background-size: cover;
    background-position: center;
    padding: 80px 20px;
    text-align: right; /* Align text to right for the headlines */
    position: relative; /* For potential pseudo-elements if needed for overlay */
    color: #ffffff; /* Default text color for this section */
}

.altomic-intro-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5); /* Dark overlay for text readability */
    z-index: 1;
}

.altomic-intro-section .container {
    position: relative;
    z-index: 2; /* Ensure content is above the overlay */
}

.altomic-headlines {
    max-width: 60%; /* Constrain width of headlines to fit black band area */
    margin-left: auto; /* Align the container to the right */
    margin-right: 20px; /* Add some padding from the edge */
    text-align: right; /* Ensure text within is right-aligned */
}

.altomic-headlines h2 {
    font-size: 2.5em; /* Large headline */
    font-weight: bold;
    color: #ffffff;
    margin-bottom: 10px;
    border-bottom: none; /* Override default h2 styling if any */
    display: block; /* Override inline-block if any */
}

.altomic-headlines p {
    font-size: 1.5em;
    color: #ffffff;
    margin-bottom: 20px;
}

.altomic-headlines h3 {
    font-size: 2em;
    font-weight: bold;
    color: #ffffff;
    margin-bottom: 30px; /* Restored margin for spacing */
}

.altomic-details-box {
    background-color: rgba(0, 74, 112, 0.85); /* Updated to match image color */
    padding: 30px;
    border-radius: 8px;
    text-align: left;
    max-width: 1100px; /* Increased width */
    margin: 0 auto; /* Center the box */
}

.altomic-details-box p {
    font-size: 1.1em;
    color: #ffffff;
    margin-bottom: 20px;
}

.altomic-details-box ul {
    list-style: disc;
    padding-left: 20px;
    margin-bottom: 0; /* Remove bottom margin if it's the last element */
}

.altomic-details-box ul li {
    font-size: 1em;
    color: #ffffff;
    margin-bottom: 15px;
    line-height: 1.6;
}

.altomic-details-box ul li:last-child {
    margin-bottom: 0;
}

/* Responsive adjustments for altomic-intro-section */
@media (max-width: 768px) {
    .altomic-intro-section {
        padding: 60px 15px;
    }
    .altomic-headlines {
    max-width: 60%; /* Constrain width of headlines to fit black band area */
    margin-left: auto; /* Align the container to the right */
    margin-right: 20px; /* Add some padding from the edge */
    text-align: right; /* Ensure text within is right-aligned */
}

.altomic-headlines h2 {
        font-size: 2em;
    }
    .altomic-headlines p {
        font-size: 1.2em;
    }
    .altomic-headlines h3 {
        font-size: 1.7em;
        margin-bottom: 30px;
    }
    .altomic-details-box {
        padding: 20px;
    }
    .altomic-details-box p {
        font-size: 1em;
    }
    .altomic-details-box ul li {
        font-size: 0.95em;
    }
}

/* PLA Comparison Section Styles */.pla-comparison-section {
    padding: 80px 0;
    background-color: #f8f9fa; /* Light grey background */
}

.pla-comparison-section h2 {
    font-size: 2.5rem;
    font-weight: bold;
    margin-bottom: 15px;
    color: #333;
}

.pla-comparison-section .lead {
    font-size: 1.25rem;
    margin-bottom: 40px;
    color: #555;
}

.no-pla-section {
    background-color: #333; /* Dark background for NO section */
    color: white;
    padding: 40px 20px;
    margin-bottom: 40px;
    border-radius: 8px;
}

.no-text-container {
    display: flex;
    align-items: center;
    justify-content: center;
}

.no-text {
    font-size: 10rem; /* Large NO */
    font-weight: bold;
    line-height: 1;
    color: white;
}

.pla-points ol {
    padding-left: 20px;
    font-size: 1.1rem;
    line-height: 1.8;
}

.pla-points li {
    margin-bottom: 15px;
}

.pla-charts-section {
    margin-bottom: 20px;
}

.pla-chart {
    border: 1px solid #ddd;
    padding: 10px;
    background-color: white;
    width: 100%;
    height: 300px; /* Placeholder height */
    display: flex;
    align-items: center;
    justify-content: center;
    color: #aaa;
    font-size: 1.5rem;
    text-align: center;
    margin-bottom: 20px; /* Space between charts on mobile */
}

.pla-data-text p {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #444;
    background-color: #e9ecef;
    padding: 20px;
    border-radius: 5px;
    height: 100%; /* Match chart height */
    display: flex;
    align-items: center;
}

.pla-source p {
    font-size: 0.85rem;
    color: #777;
    margin-top: 30px;
}

@media (max-width: 767px) {
    .algae-info-left h2 {
        font-size: 2.5rem;
        text-align: center;
    }
    .algae-info-right {
        padding-left: 15px;
        padding-right: 15px;
    }
    .no-text {
        font-size: 6rem;
    }
    .pla-points ol {
        font-size: 1rem;
    }
    .pla-data-text p {
        margin-top: 20px;
    }
}