/* Root Colors */
:root {
  --background-color: #f9f9f9;
  --text-primary: #333333;
  --text-secondary: #666666;
  --highlight: hsl(200, 100%, 50%);
  --feature-background: #ffffff;
  --feature-hover-background: hsl(200, 100%, 70%);
  --section-2-background: #f5f5f5;
  --section-2-heading-color: #333333;
  --section-2-heading-underline: hsl(200, 100%, 50%);
  --service-card-background: hsl(200, 100%, 50%);
  --service-card-text: #333333;
  --service-card-shadow: rgba(0, 0, 0, 0.2);
  --service-card-hover-shadow: rgba(0, 0, 0, 0.3);
  --section-2-heading-border-color: hsl(0, 0%, 2%);
  --section-2-heading-hover-color: hsl(200, 100%, 70%);
  --section-2-text-color: #1d1d1d;
  --box-shadow: rgba(0, 0, 0, 0.1);
  --border-color: #e0e0e0;

  /* Section 3 */
  --section-3-background: #f9f9f9;
  --section-3-text-color: #000000;
  --section-3-heading-color: #333333;
  --section-3-heading-highlight: hsl(200, 100%, 50%);
  --section-3-methods-background: #ffffff;
  --section-3-methods-box-shadow: rgba(0, 0, 0, 0.1);
  --section-3-methods-hover-background: #e0e0e0;
  --section-3-methods-hover-box-shadow: rgba(0, 0, 0, 0.15);
  --section-3-methods-hover-transform: translateY(-5px);
  --section-3-methods-left-side-background: hsl(200, 100%, 50%);
  --section-3-methods-left-side-color: #ffffff;
  --section-3-methods-number-color: #333333;
  --section-3-methods-title-color: #020202;
  --section-3-methods-content-color: #000000;

  /* Section 4 */
  --section-4-background: #f9f9f9; /* Updated background color */
  --section-4-text-color: #333333;
  --section-4-heading-color: hsl(200, 100%, 50%);
  --section-4-sub-text-color: #8f8f8f;
  --section-4-service-item-background: #ffffff; /* Updated background color */
  --section-4-service-item-hover-background: hsl(200, 100%, 50%);
  --section-4-service-item-border-color: hsl(200, 100%, 50%);
  --section-4-service-item-hover-border-color: #ffffff;
  --section-4-icon-background: hsl(200, 100%, 50%);
  --section-4-icon-color: #ffffff;
}