.elementor-7524 .elementor-element.elementor-element-6821a93{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;border-style:none;--border-style:none;--border-radius:0px 0px 0px 0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-7524 .elementor-element.elementor-element-6821a93:not(.elementor-motion-effects-element-type-background), .elementor-7524 .elementor-element.elementor-element-6821a93 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#C28285;}.elementor-7524 .elementor-element.elementor-element-6821a93:hover{border-style:none;--border-radius:0px 0px 0px 0px;--border-top-left-radius:0px;--border-top-right-radius:0px;--border-bottom-right-radius:0px;--border-bottom-left-radius:0px;}.elementor-7524 .elementor-element.elementor-element-6821a93, .elementor-7524 .elementor-element.elementor-element-6821a93::before{--border-transition:0.3s;}.elementor-7524 .elementor-element.elementor-element-7af6a12{text-align:center;}.elementor-7524 .elementor-element.elementor-element-7af6a12 .elementor-heading-title{color:#FFFFFF;}.elementor-7524 .elementor-element.elementor-element-1c41c06{width:var( --container-widget-width, 90% );max-width:90%;margin:11px 0px calc(var(--kit-widget-spacing, 0px) + 11px) 0px;padding:0px 0px 0px 0px;--container-widget-width:90%;--container-widget-flex-grow:0;}.elementor-7524 .elementor-element.elementor-element-1c41c06.elementor-element{--align-self:center;}@media(min-width:768px){.elementor-7524 .elementor-element.elementor-element-6821a93{--width:100%;}}/* Start custom CSS for shortcode, class: .elementor-element-1c41c06 *//*
 * ===================================================================
 * Compact Pop-up Forminator CSS for Two-Column Hero Section (v4.1)
 * Smaller Fields and Tighter Spacing for Pop-up
 * Form ID: 7523
 * ===================================================================
 */

/* 
 * 1. General Form Container Styling 
 * (No changes needed here)
 */
#forminator-module-7523 .forminator-ui.forminator-custom-form {
    background-color: transparent !important;
    padding: 0 !important;
}

/* 
 * 2. Form Title Styling ("Talk to a Cloud Expert") - Made Smaller
 */
#forminator-module-7523 .forminator-title {
    color: #ffffff;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 1.8em; /* Reduced font size */
    text-align: left;
    margin-bottom: 20px; /* Reduced margin */
}

/* 
 * 3. Hiding Unused Elements
 * (No changes needed here)
 */
#forminator-module-7523 .forminator-subtitle,
#forminator-module-7523 .forminator-label,
#forminator-module-7523 .forminator-description {
    display: none;
}

/* 
 * 4. Common Styling for Input and Textarea Fields - Made Smaller
 */
#forminator-module-7523 .forminator-input,
#forminator-module-7523 .forminator-textarea {
    background-color: #ffffff !important;
    color: #444444 !important;
    border: none !important;
    border-radius: 12px !important; /* Slightly reduced border radius */
    padding: 8px 15px !important; /* Reduced padding */
    font-size: 0.9em !important; /* Reduced font size */
    width: 100%;
    box-shadow: none !important;
    height: auto;
}

/* 
 * 5. Placeholder Text Styling
 * (No changes needed here, inherits font size from input)
 */
#forminator-module-7523 .forminator-input::placeholder,
#forminator-module-7523 .forminator-textarea::placeholder {
    color: #888888 !important;
    opacity: 1;
}

/* 
 * 6. Spacing between form fields - Made Tighter
 */
#forminator-module-7523 .forminator-row {
    margin-bottom: 8px !important; /* Reduced space between fields */
}

/* 
 * 7. Specific Styling for Phone Field with Country Flag - Made Smaller
 */
#forminator-module-7523 .forminator-field-phone .forminator-phone-field-group {
    display: flex;
    align-items: center;
    background-color: #ffffff !important;
    border-radius: 12px !important; /* Matched reduced border radius */
    padding-right: 5px !important;
    padding-left: 15px !important;
    border: none !important;
    box-shadow: none !important;
}

/* Target the actual input inside the phone field group - Made Smaller */
#forminator-module-7523 .forminator-field-phone .forminator-phone-field-group input.forminator-input {
    background-color: transparent !important;
    padding-top: 8px !important; /* Matched reduced padding */
    padding-bottom: 8px !important; /* Matched reduced padding */
    border: none !important;
}

/* 
 * 8. Submit Button Styling - Made Smaller
 */
#forminator-module-7523 .forminator-button-submit {
    background-color: #1c1c1c !important;
    color: #ffffff !important;
    width: 100%;
    font-size: 0.9em !important; /* Reduced font size */
    font-weight: bold;
    border: 2px solid #1c1c1c !important;
    border-radius: 12px !important; /* Matched reduced border radius */
    padding: 7px 15px !important; /* Reduced padding */
    cursor: pointer;
    margin-top: 8px !important; /* Reduced space above button */
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* 
 * 9. Submit Button Hover Effect
 * (No changes needed here)
 */
#forminator-module-7523 .forminator-button-submit:hover {
    background-color: #ffffff !important;
    color: #1c1c1c !important;
    border: 2px solid #1c1c1c !important;
}

/*
 * 10. Error Message Styling - Made Smaller
 */
#forminator-module-7523 .forminator-row.forminator-has_error .forminator-error-message {
    color: #dc3545;
    font-size: 0.85em; /* Reduced font size */
    margin-top: 4px; /* Reduced margin */
    display: block;
}

#forminator-module-7523 .forminator-row.forminator-has_error .forminator-input,
#forminator-module-7523 .forminator-row.forminator-has_error .forminator-textarea,
#forminator-module-7523 .forminator-row.forminator-has_error .forminator-phone-field-group {
    border: 1px solid #dc3545 !important;
}/* End custom CSS */
/* Start custom CSS *//* Global Styles */
body {
  font-family: Arial, sans-serif;
  color: #1A1A1A;
  background-color: #FFFAFA;
}
h1, h2, h3 {
  color: #1A1A1A;
}
section {
  padding: 60px 20px;
  text-align: center;
}

/* Hero */
.hero {
  background: linear-gradient(#C08081 100%);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 80px 20px;
}
.hero-content {
  max-width: 50%;
}
.hero-buttons {
  margin-top: 20px;
}
.hero-graphic img {
  width: 100px;
  margin: 10px;
}

/* Buttons */
.cta-button {
  display: inline-block;
  padding: 14px 28px;
  border-radius: 50px;
  font-weight: bold;
  text-decoration: none;
  transition: 0.3s ease;
}
.cta-button.primary {
  background-color: #1A1A1A;
  color: #FFFFFF;
  animation: pulseButton 2s infinite;
}
.cta-button.secondary {
  border: 2px solid #1A1A1A;
  color: #1A1A1A;
}
.cta-button:hover {
  transform: scale(1.05);
}

/* Cards & Hover Effects */
.benefit-card, .problem-card, .step {
  background: #FFFFFF;
  padding: 20px;
  border-radius: 15px;
  box-shadow: 0px 5px 15px rgba(0,0,0,0.05);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.benefit-card:hover, .problem-card:hover, .step:hover {
  transform: translateY(-5px);
  box-shadow: 0px 8px 20px rgba(0,0,0,0.15);
}

/* Form */
.cloud-solutions form {
  max-width: 500px;
  margin: auto;
  display: flex;
  flex-direction: column;
}
.cloud-solutions input, .cloud-solutions textarea {
  padding: 14px;
  margin-bottom: 10px;
  border: 1px solid #ccc;
  border-radius: 8px;
}

/* Animations */
@keyframes floatCloud {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-8px); }
  100% { transform: translateY(0px); }
}
.cloud-icon {
  animation: floatCloud 6s ease-in-out infinite;
}
@keyframes pulseButton {
  0% { transform: scale(1); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}/* End custom CSS */