.elementor-kit-6{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */:root {
  --blue: #1748aa;   /* primary */
  --green: #6fe208;  /* accent */
  --text: #1b1f29;
  --bg: #f5f9ff;     /* subtle blue-tinted background */
  --card-bg: #ffffff;
  --shadow: 0 0 12px rgba(0, 0, 0, 0.05);
}

.keycut-section {
  font-family: 'Segoe UI', Tahoma, sans-serif;
  background-color: var(--bg);
  color: var(--text);
  padding: 40px 20px;
  max-width: 1100px;
  margin: auto;
  line-height: 1.7;
}

.keycut-box {
  background: var(--card-bg);
  padding: 30px;
  margin-bottom: 30px;
  border-radius: 10px;
  border-left: 6px solid var(--blue);
  box-shadow: var(--shadow);
}

.keycut-box h1,
.keycut-box h2 {
  color: var(--blue);
  margin-bottom: 20px;
  font-weight: bold;
}

.card-container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  padding: 30px;
  border-radius: 12px;
  margin-bottom: 30px;
  background: transparent;
}

.card-container h2 {
  width: 100%;
  font-size: 1.4em;
  color: var(--blue);
  margin-bottom: 20px;
  font-weight: bold;
}

.card {
  flex: 1 1 calc(33.33% - 20px);
  background: var(--card-bg);
  border-radius: 8px;
  padding: 15px 20px;
  box-shadow: var(--shadow);
  font-size: 0.95em;
  border-left: 5px solid var(--blue);
}

/* Recolored helpers */
.yellow-bg { /* keep class name for backward compatibility */
  background-color: rgba(111, 226, 8, 0.12); /* light green tint */
}

.red-bg { /* repurposed as light blue tint */
  background-color: rgba(23, 72, 170, 0.08);
}

.yellow-cta { /* CTA now uses green as the fill, blue on hover border */
  background-color: var(--green);
  color: #ffffff;
  padding: 30px;
  font-size: 1.2em;
  border-radius: 10px;
  text-align: center;
  font-weight: bold;
  box-shadow: var(--shadow);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.yellow-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
  border: 2px solid var(--blue);
}

.locksmith-section h1,
.locksmith-section h2 {
  color: var(--blue);
  margin-bottom: 20px;
}

a {
  color: var(--blue);
}
a.button,
.btn,
.button {
  display: inline-block;
  background: var(--blue);
  color: #fff;
  padding: 12px 22px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
  transition: background 0.15s ease, transform 0.15s ease;
}
a.button:hover,
.btn:hover,
.button:hover {
  background: var(--green);
  transform: translateY(-1px);
}

.badge {
  display: inline-block;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  background: var(--green);
  color: #0e2a05;
  font-size: 0.8rem;
  font-weight: 600;
}

@media (max-width: 768px) {
  .card {
    flex: 1 1 100%;
  }
  .card-container {
    padding: 20px;
  }
}/* End custom CSS */