.elementor-83 .elementor-element.elementor-element-39a98a08{--display:flex;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}/* Start custom CSS for text-editor, class: .elementor-element-664eb2b8 *//* =========================================
   GLOBAL LOCKSMITH SECTION SYSTEM
========================================= */

.co-section {
  font-family: 'Segoe UI', Arial, sans-serif;
  background: linear-gradient(160deg, #083d31 0%, #062b23 100%);
  padding: 120px 20px;
  color: #ffffff;
  position: relative;
  overflow: hidden;
}

/* Background bends */
.co-section::before {
  content: "";
  position: absolute;
  top: -300px;
  right: -200px;
  width: 900px;
  height: 900px;
  background: radial-gradient(circle, #FFB300 0%, #d69400 60%, transparent 70%);
  opacity: 0.25;
}

.co-section::after {
  content: "";
  position: absolute;
  bottom: -350px;
  left: -250px;
  width: 1000px;
  height: 1000px;
  background: radial-gradient(circle, #00A86B 0%, #007d50 60%, transparent 75%);
  opacity: 0.25;
}

.co-wrap {
  max-width: 1200px;
  margin: auto;
  position: relative;
  z-index: 2;
}

/* =========================================
   HERO INTRO
========================================= */

.co-hero {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 70px;
  align-items: center;
  margin-bottom: 120px;
}

.co-hero h1 {
  font-size: 44px;
  line-height: 1.25;
  margin-bottom: 25px;
}

.co-hero h1 span {
  color: #FFB300;
}

.co-hero p {
  font-size: 18px;
  line-height: 1.9;
  color: #e6f7f1;
  margin-bottom: 20px;
}

.co-hero-card {
  background: #ffffff;
  color: #222;
  padding: 60px;
  border-radius: 16px;
  box-shadow: 0 40px 100px rgba(0,0,0,0.4);
  border-top: 6px solid #FFB300;
}

/* =========================================
   TITLES
========================================= */

.co-title {
  font-size: 32px;
  margin-bottom: 40px;
  font-weight: 600;
  position: relative;
}

.co-title::after {
  content: "";
  width: 90px;
  height: 4px;
  background: #FFB300;
  display: block;
  margin-top: 10px;
  border-radius: 3px;
}

/* =========================================
   GRID
========================================= */

.grid {
  display: grid;
  gap: 30px;
  margin-bottom: 100px;
}

.cols-3 {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

/* =========================================
   SERVICE CARDS
========================================= */

.service-card {
  background: #ffffff;
  color: #222;
  padding: 45px;
  border-radius: 14px;
  box-shadow: 0 25px 70px rgba(0,0,0,0.2);
  transition: 0.35s ease;
  border-left: 5px solid #00A86B;
}

.service-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 35px 90px rgba(0,0,0,0.3);
}

.service-card a {
  text-decoration: none;
  color: #004d32;
  font-size: 20px;
  font-weight: 600;
}

.service-card a:hover {
  color: #FFB300;
}

/* =========================================
   TESTIMONIALS
========================================= */

.feedback {
  background: rgba(255,255,255,0.1);
  padding: 25px;
  border-left: 4px solid #FFB300;
  border-radius: 8px;
}

/* =========================================
   ADVANTAGE CARDS
========================================= */

.adv-card {
  background: #ffffff;
  color: #222;
  padding: 35px;
  border-radius: 12px;
  box-shadow: 0 25px 60px rgba(0,0,0,0.2);
}

.adv-top {
  margin-bottom: 12px;
  color: #004d32;
  font-weight: 600;
}

.badge {
  background: #FFB300;
  color: #000;
  padding: 6px 12px;
  border-radius: 50%;
  margin-right: 8px;
}

/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 1000px) {
  .co-hero {
    grid-template-columns: 1fr;
    gap: 50px;
  }

  .co-hero-card {
    padding: 40px;
  }

  .co-hero h1 {
    font-size: 32px;
  }
}/* End custom CSS */