.elementor-952 .elementor-element.elementor-element-306dea3{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}/* Start custom CSS for html, class: .elementor-element-63b2d7e *//* --- H2 Green Hydrogen Article Styling --- */
.h2-article-container {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; /* Modern sans-serif */
  line-height: 1.7;
  color: #333;
  max-width: 960px; /* Slightly wider */
  margin: 25px auto;
  padding: 20px;
  background-color: #ffffff;
}

.article-header {
  text-align: center;
  margin-bottom: 35px;
  border-bottom: 3px solid #2E8B57; /* SeaGreen */
  padding-bottom: 20px;
}

.article-header h1 {
  font-size: 2.4em;
  margin-bottom: 8px;
  color: #006400; /* Dark Green */
  font-weight: 600;
}

.article-header .subtitle {
  font-size: 1.3em;
  color: #555;
  font-style: italic;
}

h2 {
  font-size: 1.9em;
  color: #2E8B57; /* SeaGreen */
  margin-top: 40px;
  margin-bottom: 20px;
  border-bottom: 1px solid #dceddc; /* Lighter green */
  padding-bottom: 8px;
  font-weight: 500;
}

h3 {
    font-size: 1.4em;
    color: #3CB371; /* Medium Sea Green */
    margin-top: 25px;
    margin-bottom: 12px;
    font-weight: 500;
}

p {
  margin-bottom: 18px;
}

strong {
 color: #006400; /* Dark Green for emphasis */
 font-weight: 600;
}

ul {
  list-style: disc;
  margin-left: 25px;
  margin-bottom: 18px;
  padding-left: 5px;
}
ul li {
    margin-bottom: 10px;
}

/* --- Image Styling --- */
.article-image {
  margin: 25px auto;
  text-align: center;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.article-image img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
  border-radius: 6px; /* Slightly more rounded */
  box-shadow: 0 4px 8px rgba(0, 50, 20, 0.15); /* Subtle green-tinted shadow */
}
.article-image img:hover {
    transform: scale(1.02) translateY(-3px); /* Subtle lift */
    box-shadow: 0 8px 18px rgba(0, 50, 20, 0.25); /* Enhanced shadow */
}

.article-image figcaption {
  font-size: 0.9em;
  color: #555;
  margin-top: 10px;
  font-style: italic;
}

.article-image.full-width {
  width: 100%;
  margin: 30px 0;
}

.article-image.right-float {
    width: 35%;
    max-width: 280px; /* Allow slightly larger float */
    float: right;
    margin: 5px 0 15px 25px; /* Top, Right, Bottom, Left */
}
.article-image.right-float.small-image {
    max-width: 180px; /* Smaller max width for icons/flags */
}

/* NOTE: Rules specifically for '.article-image.icon-size' have been removed */


/* Clearfix for floats */
.clear { clear: both; }


/* --- Specific Section Styling --- */

/* Key Advantages Grid */
.key-advantages-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); /* Responsive grid */
    gap: 25px;
    margin: 25px 0;
    align-items: start; /* Align items to the top if heights vary */
}
.key-advantage {
    background-color: #f8f9fa;
    padding: 20px;
    border-radius: 6px;
    text-align: center;
    border: 1px solid #e9ecef;
    transition: background-color 0.3s ease;
    display: flex; /* Use flex column for better internal alignment */
    flex-direction: column;
    height: 100%; /* Make grid items equal height if needed */
}
.key-advantage:hover {
    background-color: #eaf5ea; /* Very light green hover */
}
.key-advantage h3 {
    margin-top: 15px; /* Space between image and heading */
    font-size: 1.2em;
}
/* Adjust image margin within the grid box */
.key-advantage .article-image {
    margin-top: 0;
    margin-bottom: 15px; /* Space below image */
}
/* Optional: Limit image size within the grid box if needed */
/* .key-advantage .article-image img {
     max-width: 70%; /* Example: Limits image width to 70% of the grid box */
/*     margin-left: auto;
     margin-right: auto;
} */


/* Checkmark List */
.checkmark-list {
    list-style: none;
    padding-left: 0;
    margin-left: 5px;
}
.checkmark-list li {
    padding-left: 1.8em;
    position: relative;
    margin-bottom: 12px;
}
.checkmark-list li::before {
    content: '✓';
    position: absolute;
    left: 0;
    top: 0;
    color: #28a745; /* Green checkmark */
    font-weight: bold;
    font-size: 1.2em;
}

/* Project Table */
.project-table-container {
    margin: 30px 0;
    overflow-x: auto; /* Allow horizontal scroll on small screens */
}
.project-table-container h3 {
    text-align: center;
    margin-bottom: 15px;
}
.project-table {
    width: 100%;
    border-collapse: collapse;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
}
.project-table th, .project-table td {
    border: 1px solid #ddd;
    padding: 10px 12px;
    text-align: left;
}
.project-table th {
    background-color: #e2f0e9; /* Light green header */
    color: #006400; /* Dark Green text */
    font-weight: 600;
}
.project-table tbody tr:nth-child(even) {
    background-color: #f9f9f9; /* Zebra striping */
}
.project-table tbody tr:hover {
    background-color: #f1f1f1; /* Row hover */
}

/* Value Chain List */
.value-chain-list {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
}
.value-chain-list li {
    background-color: #e7f5ec; /* Light green background */
    padding: 12px 15px;
    border-radius: 4px;
    border-left: 4px solid #3CB371; /* Medium Sea Green accent */
    transition: background-color 0.3s ease;
}
.value-chain-list li:hover {
    background-color: #d0e8d8;
}

/* --- Footer & Call to Action --- */
.article-footer {
  margin-top: 40px;
  padding-top: 25px;
  border-top: 3px solid #2E8B57; /* Match header */
}
.article-footer h2 {
    border-bottom: none;
    text-align: center;
}
.call-to-action {
    background-color: #f0fff0; /* Honeydew background */
    padding: 25px;
    border-radius: 5px;
    text-align: center;
}
.call-to-action strong {
    font-size: 1.1em;
}
.cta-button { /* Optional button styling */
  display: inline-block;
  margin-top: 20px;
  background-color: #2E8B57; /* SeaGreen */
  color: #ffffff;
  padding: 12px 25px;
  border-radius: 5px;
  text-decoration: none;
  font-weight: 600;
  transition: background-color 0.3s ease, transform 0.2s ease;
}
.cta-button:hover {
  background-color: #257049; /* Darker SeaGreen */
  transform: translateY(-2px);
}


/* --- Responsive Adjustments --- */
@media (max-width: 768px) {
  .article-header h1 { font-size: 2em; }
  h2 { font-size: 1.6em; }
  h3 { font-size: 1.3em; }

  .article-image.right-float {
      float: none;
      width: 70%;
      max-width: 300px;
      margin: 20px auto;
  }
  .article-image.right-float.small-image {
        max-width: 150px;
        margin: 15px auto;
    }
}

@media (max-width: 480px) {
    .h2-article-container { padding: 15px 10px; }
    .article-header h1 { font-size: 1.7em; }
    h2 { font-size: 1.4em; }
    h3 { font-size: 1.2em; }

    .key-advantages-grid {
        grid-template-columns: 1fr; /* Stack grid items */
    }
    .value-chain-list {
        grid-template-columns: 1fr; /* Stack list items */
    }
    .project-table th, .project-table td {
        padding: 8px; /* Reduce table padding */
        font-size: 0.9em; /* Smaller font in table */
    }
     .article-image.right-float { width: 90%; }
}/* End custom CSS */