.elementor-211 .elementor-element.elementor-element-df1d1e9{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-03a4333 *//* Core Setup */
html {
  scroll-behavior: smooth !important; /* Enables smooth scroll to #trial *//* Core Setup */
html {
  scroll-behavior: smooth !important; /* Enables smooth scroll to #trial */
}

body {
  margin: 0;
  padding: 0;
  font-family: 'Inter', sans-serif;
  color: #0F172A; /* Dark Navy for text */
  line-height: 1.6;
  background-color: #ffffff;
}

/* Layout Containers */
.container-wide { max-width: 1100px; margin: 0 auto; padding: 0 20px; }
.container-narrow { max-width: 800px; margin: 0 auto; padding: 0 20px; }

.section-title { text-align: center; margin-bottom: 50px; }
.section-title h2 { font-size: 32px; font-weight: 700; margin-bottom: 15px; }
.section-title p { color: #64748B; font-size: 16px; max-width: 600px; margin: 0 auto; }

/* Hero Section */
.about-hero { padding: 120px 0 80px; text-align: center; background: #fafafa; }
.about-hero h1 { font-size: 48px; font-weight: 800; margin-bottom: 20px; letter-spacing: -1px; }
.about-hero p { font-size: 18px; color: #64748B; max-width: 700px; margin: 0 auto; }

/* Grid Cards */
.mission-section, .values-section { padding: 100px 0; }
.mission-grid, .values-grid { 
  display: grid; 
  grid-template-columns: repeat(3, 1fr); 
  gap: 30px; 
}

.info-card {
  background: #ffffff;
  padding: 40px 30px;
  border-radius: 20px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05); /* Soft SaaS shadow */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.info-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 45px rgba(0, 0, 0, 0.08);
}

.info-card h3 { color: #117a65; font-size: 20px; margin-bottom: 15px; font-weight: 700; }
.info-card p { color: #64748B; font-size: 14px; margin: 0; }

/* Story Card Block */
.story-section { padding: 60px 0; }
.story-card {
  background: #ffffff;
  padding: 60px 40px;
  border-radius: 24px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.06);
  text-align: center;
  border: 1px solid #f1f5f9;
}

.story-card h2 { margin-bottom: 25px; font-size: 32px; font-weight: 700; }
.story-card p { margin-bottom: 20px; color: #64748B; font-size: 15px; }

/* CTA Button */
.about-cta { padding: 120px 0; text-align: center; }
.about-cta h2 { font-size: 36px; font-weight: 800; margin-bottom: 15px; }
.about-cta p { color: #64748B; font-size: 16px; margin-bottom: 35px; }

.btn-cta-green {
  display: inline-block;
  background-color: #117a65; /* Emerald green from branding */
  color: #ffffff;
  padding: 16px 40px;
  border-radius: 50px;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  transition: all 0.3s ease;
  box-shadow: 0 10px 25px rgba(17, 122, 101, 0.2);
}

.btn-cta-green:hover {
  background-color: #0e6352;
  transform: translateY(-3px);
  box-shadow: 0 15px 30px rgba(17, 122, 101, 0.3);
}

/* Responsive Design */
@media (max-width: 900px) {
  .mission-grid, .values-grid { grid-template-columns: 1fr; }
  .about-hero h1 { font-size: 36px; }
  .story-card { padding: 40px 20px; }
}
}

body {
  margin: 0;
  padding: 0;
  font-family: 'Inter', sans-serif;
  color: #0F172A; /* Dark Navy for text */
  line-height: 1.6;
  background-color: #ffffff;
}

/* Layout Containers */
.container-wide { max-width: 1100px; margin: 0 auto; padding: 0 20px; }
.container-narrow { max-width: 800px; margin: 0 auto; padding: 0 20px; }

.section-title { text-align: center; margin-bottom: 50px; }
.section-title h2 { font-size: 32px; font-weight: 700; margin-bottom: 15px; }
.section-title p { color: #64748B; font-size: 16px; max-width: 600px; margin: 0 auto; }

/* Hero Section */
.about-hero { padding: 120px 0 80px; text-align: center; background: #fafafa; }
.about-hero h1 { font-size: 48px; font-weight: 800; margin-bottom: 20px; letter-spacing: -1px; }
.about-hero p { font-size: 18px; color: #64748B; max-width: 700px; margin: 0 auto; }

/* Grid Cards */
.mission-section, .values-section { padding: 100px 0; }
.mission-grid, .values-grid { 
  display: grid; 
  grid-template-columns: repeat(3, 1fr); 
  gap: 30px; 
}

.info-card {
  background: #ffffff;
  padding: 40px 30px;
  border-radius: 20px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05); /* Soft SaaS shadow */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.info-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 45px rgba(0, 0, 0, 0.08);
}

.info-card h3 { color: #117a65; font-size: 20px; margin-bottom: 15px; font-weight: 700; }
.info-card p { color: #64748B; font-size: 14px; margin: 0; }

/* Story Card Block */
.story-section { padding: 60px 0; }
.story-card {
  background: #ffffff;
  padding: 60px 40px;
  border-radius: 24px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.06);
  text-align: center;
  border: 1px solid #f1f5f9;
}

.story-card h2 { margin-bottom: 25px; font-size: 32px; font-weight: 700; }
.story-card p { margin-bottom: 20px; color: #64748B; font-size: 15px; }

/* CTA Button */
.about-cta { padding: 120px 0; text-align: center; }
.about-cta h2 { font-size: 36px; font-weight: 800; margin-bottom: 15px; }
.about-cta p { color: #64748B; font-size: 16px; margin-bottom: 35px; }

.btn-cta-green {
  display: inline-block;
  background-color: #117a65; /* Emerald green from branding */
  color: #ffffff;
  padding: 16px 40px;
  border-radius: 50px;
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  transition: all 0.3s ease;
  box-shadow: 0 10px 25px rgba(17, 122, 101, 0.2);
}

.btn-cta-green:hover {
  background-color: #0e6352;
  transform: translateY(-3px);
  box-shadow: 0 15px 30px rgba(17, 122, 101, 0.3);
}

/* Responsive Design */
@media (max-width: 900px) {
  .mission-grid, .values-grid { grid-template-columns: 1fr; }
  .about-hero h1 { font-size: 36px; }
  .story-card { padding: 40px 20px; }
}/* End custom CSS */