p {
    margin-bottom: 0;
}

/* form */

#form_1 {
    margin-top: 5px;
}

#form_1 .fluentform .ff-el-group {
    margin-bottom: 11px;
}

.ff-btn-submit:hover {
    opacity: 1!important;
}

.ff-btn-submit {
    position: relative!important;
    font-size: 23px!important;
    padding: 3px 20px!important;
    color: #d1d1d1 !important; /* Text color */
    background: transparent!important; /* Ensure the button itself is fully transparent */
    border: none!important;
    border-radius: 50px!important;
    cursor: pointer!important;
    z-index: 1!important;
    text-transform: uppercase;
    font-family: 'Questrial', sans-serif;
}

/* Pseudo-element to create the gradient border */
.ff-btn-submit::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50px;
    padding: 2px; /* Border width */
    background: linear-gradient(159deg, #8f8f8f, #cbcbcb);
    -webkit-mask: linear-gradient(white, white) content-box, linear-gradient(white, white);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    z-index: -1;
}

.border_gradient .ff-el-input--content {
    position: relative!important;
    font-size: 16px!important;
    padding: 2px;
    color: white!important; /* Text color */
    background: transparent!important; /* Ensure the button itself is fully transparent */
    border: none!important;
    border-radius: 50px!important;
    cursor: pointer!important;
    z-index: 1!important;
}

/* Pseudo-element to create the gradient border */
.border_gradient .ff-el-input--content::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50px;
    padding: 2px; /* Border width */
    background: linear-gradient(159deg, #8f8f8f, #cbcbcb);
    -webkit-mask: linear-gradient(white, white) content-box, linear-gradient(white, white);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    z-index: -1;
    max-height: 46px;
}

.border_gradient .ff-el-input--content input,
.border_gradient .ff-el-input--content input:focus,
.border_gradient .ff-el-input--content input:active {
    background-color: transparent;
    border: none;
    border-radius: 50px;
    color: #fff;
}

.border_gradient .ff-el-input--content input::placeholder {
    text-transform: uppercase;
    font-family: Burka, sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1px;
}

.options_row .ff-el-input--content {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.options_row .ff-el-input--content > div,
.options_row .ff-el-input--content label {
    margin-bottom: 0!important;
}

input[type=checkbox]:checked::before, input[type=radio]:checked::before {
    left: 4px;
    top: 5px;
    right: 4px;
    bottom: 5px;
    background-color: #0047a7;
    border-radius: 1px;
    box-sizing: border-box;
    -ms-transform: rotate(45deg);
    content: "";
    display: block;
    position: absolute;
}
input[type=checkbox]:checked {
    /* background-color: #444; */
}
input[type=checkbox]:checked::before, input[type=radio]:checked::before {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
input[type=checkbox], input[type=radio] {
    border: none;
    border-radius: 1px;
    background: #fff;
    position: relative;
    color: #555;
    clear: none;
    cursor: pointer;
    display: inline-block;
    line-height: 0;
    height: 21px;
    margin: -.25rem .25rem 0 0;
    outline: 0;
    padding: 0!important;
    vertical-align: middle;
    width: 18px;
    min-width: 18px;
    -webkit-appearance: none!important;
    transition: .05s border-color ease-in-out, .2s background-color ease-in-out;
}

.fluentform span {
    font-family: 'Questrial', sans-serif;
    color: #fff;
}

#fluentform_1_success {
    border: none;
    background-color: #ffffff75;
    border-radius: 30px;
    text-align: center;
    font-family: 'Questrial';
    font-weight: 600;
    color: #00142e;
    letter-spacing: .5px;
}

#form_1 .options_row {
    margin-top: 25px;
    padding: 0 10px;
}

#form_1 .politica_privacidad label {
    font-size: 11px;
    display: flex;
    align-items: center;
    gap: 5px;
    font-style: italic;
    letter-spacing: .5px;
    margin: 10px 0;
    padding: 0 10px;
}

.fluentform input[type=checkbox], .fluentform input[type=radio] {
    margin-right: 8px;
}

#form_1 .options_row span {
    text-transform: uppercase;
    font-family: 'Questrial';
    font-family: Burka;
    font-size: 15px;
    letter-spacing: 1px;
}

/* /form */

/* hero */
#hero > div,
#footer > div {
    position: relative;
}

#hero > div::before, 
#footer > div::before {
    content: "";
    background-image: url(https://camarasya.com/wp-content/uploads/2025/03/circulo-grnade.webp);
    top: calc(50% - 30px);
    transform: translateY(-50%);
    left: unset;
    right: 47vw;
    position: absolute;
    height: 150vh;
    width: 150vh;
    z-index: 0;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
/* falla desde los 2300px para arriba */

.img-container img {
    aspect-ratio: 1;
    object-fit: contain;
    object-position: center;
}

.step_number img {
    position: relative;
    top: 50px;
    z-index: 1;
}

.step_title h4 {
    background-color: #fff;
    display: inline-flex;
    justify-content: center;
    text-align: center;
    align-items: center;
    padding: 10px 5px;
    position: relative;
    border-radius: 50px;
    bottom: 50px;
    width: 100%;
    max-width: 200px;
    height: 54px;
}

.gradient_border {
    position: relative;
    background: transparent; /* Ensure the div remains transparent */
    border-radius: 32px; /* Adjust as needed */
    font-family: 'Questrial', sans-serif;
    border: none!important;
}

/* Pseudo-element to create the gradient border */
.gradient_border::before {
    content: ""!important;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 32px; /* Match the parent div */
    padding: 2px; /* Border width */
    background: linear-gradient(113deg, #626262, #cbcbcb);
    -webkit-mask: linear-gradient(white, white) content-box, linear-gradient(white, white);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    z-index: 0;
}

.marca-cam > .img-container {
    aspect-ratio: 1;
}
/*
.swiper-container {
    opacity: 0;
    transition-duration: .4s;
    transition-delay: .2s;
}

.swiper-container.swiper-initialized {
    opacity: 1;
}

.swiper-container {
  width: 100%;
  /* No fixed height needed unless you want something specific */
  /* Minimal overflow handling, optional *
  overflow: hidden;
}

/* slider servicios *
.swiper-slide.service-slide {
    width: 35%;
}
.swiper-slide.service-slide:not(.swiper-slide-active) {
    width: 25%;
}
.swiper-slide.service-slide .inner {
    padding: 35px 35px;
    color: #fff;
    width: 100%;
    aspect-ratio: 1;
    background-image: url('https://camarasya.com/wp-content/uploads/2025/03/PLACA-FONDO-SERVICIOS.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    transition-duration: .3s;
    cursor: grab;
    will-change: transform;
}

/*.swiper-slide.service-slide:not(.swiper-slide-active) .inner {
    transform: scale(0.87);
}*

.swiper-slide.service-slide h2 {
    font-family: 'Questrial', sans-serif;
    font-size: 27px;
    margin-bottom: 10px;
}

.swiper-slide.service-slide .service-icon img {
    width: 75px;
}

.swiper-slide.service-slide ul {
    font-family: 'Burka', sans-serif;
    font-size: 15px;
}

.swiper-slide.service-slide ul li {
    margin-bottom: 10px;
}

.serviciosSlider img.swiper-button-next {
    right: 30.6%;
}

.serviciosSlider img.swiper-button-prev {
    left: 30.9%;
    transform: rotate(180deg);
}

.swiper-button-prev,
.swiper-button-next {
  /* Swiper’s default arrow styles are already included by Swiper’s CSS;
     here we only add a fade transition. *
  transition: opacity 0.3s ease;
  opacity: 1;
}

/* This class will be toggled on/off during transitions *
.fade-arrow {
  opacity: 0;
  pointer-events: none; /* So the arrow isn't clickable while faded *
}
*/
/********************************************************
  YOUR ORIGINAL CSS (WITH A FEW TWEAKS)
********************************************************/
.swiper-container {
  /* We keep your approach: fade in after init */
  opacity: 0;
  transition-duration: 0.4s;
  transition-delay: 0.2s;

  /* Added: Give it a width so we can see it properly */
  width: 90%;
  margin: 40px auto;
  position: relative;
}
/* Fade in once Swiper is loaded. */
.swiper-container.swiper-initialized {
  opacity: 1;
}

/* We want to ensure the container doesn’t forcibly scroll or show huge overflow */
.swiper-container {
  overflow: hidden;
}

/* Slide CSS */
.swiper-slide.service-slide {
  /* Let Swiper’s JS handle width via slidesPerView.
     We'll remove the fixed width: 35%; 
     If you were doing slidesPerView:'auto', you could keep it, but we’ll do numeric. */

  /* Smooth transform transitions (for scale effects) */
  transition: transform 0.3s ease;
}

/* Scale down non-active slides by 10%. 
   If you’d rather scale up the active slide, that’s also possible. */
.swiper-slide.service-slide:not(.swiper-slide-active) {
  transform: scale(0.9);
  opacity: 0.9; /* optional so the center stands out more */
}

/* .inner styling (background image & aspect ratio) */
.swiper-slide.service-slide .inner {
    /* Keep your custom background + sizing */
    padding: 35px;
    color: #fff;
    width: 100%;
    aspect-ratio: 1; /* ensures 1:1 square shape */
    background-image: url('https://camarasya.com/wp-content/uploads/2025/03/PLACA-FONDO-SERVICIOS.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    cursor: grab;
    will-change: transform;
    display: flex;
    flex-direction: column;
}

/* Example heading/style adjustments */
.swiper-slide.service-slide h2 {
    font-family: 'Questrial', sans-serif;
    font-size: 28px;
    margin-bottom: 15px;
}

.swiper-slide.service-slide .service-icon img {
    width: 75px;
    margin-bottom: 5px;
}

.swiper-slide.service-slide ul {
    font-family: 'Burka', sans-serif;
    font-size: 16px;
    padding-left: 16px;
}
.swiper-slide.service-slide ul li {
    margin-bottom: 5px;
}
.serviciosSlider img.swiper-button-next {
    right: 31.2%;
}

.serviciosSlider img.swiper-button-prev {
    left: 31.2%;
    transform: rotate(180deg);
}

.serviciosSlider img.swiper-button-next,
.serviciosSlider img.swiper-button-prev {
    width: 25px;
}

/* Fade class for the arrows during transitions */
.fade-arrow {
    opacity: 0;
    pointer-events: none;
}
/* /slider servicios */

/* slider reseñas */
.swiper-slide.resena-slide .inner {
    background-image: url('https://camarasya.com/wp-content/uploads/2025/03/PLACA-FONDO-PRODUCTOS-Y-CLIENTES1.png');
    aspect-ratio: 1;
    background-position: center;
    background-size: contain;
    padding: 43px;
    background-repeat: no-repeat;
    color: #fff;
    display: flex;
    flex-direction: column;
    cursor: grab;
    will-change: transform;
}

.resenasSlider .swiper-wrapper {
    align-items: center;
}

.swiper-container.resenasSlider {
    padding: 0 80px;
}

.resena-slide .user-icon {
    width: 90px;
    border-radius: 50%;
    overflow: hidden;
    aspect-ratio: 1;
}

.resena-slide .txt {
    flex-grow: 1;
    display: flex;
    font-family: 'Burka', sans-serif;
    font-size: 16px;
}

.resena-slide h3 {
    font-family: 'Questrial', sans-serif;
    margin: 15px 0px;
}
/* /slider reseñas */

/* footer */
.footer-links .elementor-widget-container {
    display: flex;
    flex-direction: column;
}

.footer-links .social-icons {
    display: flex;
    gap: 3px;
}

.footer-links .social-icons img {
    width: 36px;
}

.footer-links .elementor-widget-container > p {
    margin-bottom: 30px;
    display: inline-block;
}

.footer-links .elementor-widget-container > h4 {
    margin: 0 0 5px;
}

.footer-links .elementor-widget-container a {
    color: #fff;
    font-family: 'Burka', sans-serif;
    font-size: 14px;
}
#footer {
    overflow: hidden;
}
/* /footer */

[data-elementor-type="wp-post"] {
    max-width: 1920px;
    margin: 0 auto;
    overflow-x: hidden;
}

body {
    background-color: #000;
}

.swiper-slide.service-slide ul li:last-child {
    margin-bottom: 0;
}

#floating-wp {
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 50px;
}
/* responsive */
/* pantallas grandes */
@media (min-width: 1920px) {
    #hero, #footer {
        min-height: unset;
        aspect-ratio: 2 / 1;
    }

    #hero > div::before, #footer > div::before {
        right: 917px;
    }

    .cy_section {
        min-height: unset!important;
        padding: 150px 0!important;
    }

    #hero > div > .e-con-inner > div:nth-child(1) {
        padding-top: 90px;
    }
}

/* tablets y celulares */
@media (max-width: 1200px) {
    #footer > div::before {
        height: 106vw;
        width: 106vw;
        top: 50%;
        right: 52vw;
    }
    /*.serviciosSlider img.swiper-button-next {
        right: 9.5%;
    }

    .serviciosSlider img.swiper-button-prev {
        left: 9.5%;
    }*/

    .swiper-slide.service-slide .service-icon img {
        width: 27%;
        margin-bottom: 0px;
    }

    .swiper-slide.service-slide h2 {
        font-size: 26px;
        margin-bottom: 10px;
        line-height: 100%;
    }

    .swiper-slide.service-slide ul li {
        font-size: 14px;
    }
}

@media (max-width: 1103px) {
    .border_gradient .ff-el-input--content input,
    .border_gradient .ff-el-input--content input:focus,
    .border_gradient .ff-el-input--content input:active {
        padding: 8px 12px;
    }

    #form_1 .options_row span {
        font-size: 12px;
    }

    .options_row .ff-el-input--content {
        flex-wrap: wrap;
        row-gap: 10px;
    }

    button.ff-btn.ff-btn-submit {
        font-size: 19px!important;
    }
}
@media (max-width: 1024px) {
    #hero > div::before {
        display: none;
    }
    .serviciosSlider img.swiper-button-next {
        right: 13%;
    }

    .serviciosSlider img.swiper-button-prev {
        left: 13%;
    }
}

@media (max-width: 1024px) and (min-width: 768px) {
    .swiper-slide.service-slide h2 {
        margin-top: 35px;
    }
    .swiper-slide.service-slide ul li {
        font-size: 20px;
        margin-bottom: 12px;
    }   
}

@media (max-width: 767px) {
    #footer > div::before {
        display: none;
    }
    .footer-links .social-icons {
        justify-content: center;
        margin-top: 5px;
    }
    .footer-links .elementor-widget-container > h4 {
        margin-bottom: 7px;
    }
    /*.serviciosSlider .swiper-slide-next {
        position: relative;
        left: -25px;
    }

    .serviciosSlider .swiper-slide-prev {
        position: relative;
        right: -25px;
    }*/

    .serviciosSlider img.swiper-button-next {
        right: 3.2%;
        width: 22px;
    }

    .serviciosSlider img.swiper-button-prev {
        left: 3.2%;
        width: 22px;
    }
    .swiper-slide.service-slide.swiper-slide-active .inner {
        padding: 20px;
        justify-content: center;
    }
    .cy_section {
        min-height: unset!important;
        padding: 45px 0!important;
    }
    .border_gradient .ff-el-input--content input::placeholder {
        font-size: 10px;
    }
}

@media (max-width: 995px) {
    .swiper-slide.service-slide .service-icon img {
        max-width: 150px;
        margin-bottom: 0px;
    }

    .swiper-slide.service-slide h2 {
        font-size: 35px;
        margin-bottom: 10px;
    }
}

@media (max-width: 585px) {
    .swiper-slide.service-slide h2 {
        font-size: 25px;
    }

    .swiper-slide.service-slide ul li {
        font-size: 15px;
    }

    .swiper-container.resenasSlider {
        padding: 0 32px;
    }
    .resenasSlider .swiper-slide-next {
        transition: transform .3s;
        transform: scale(0.92) translateX(-25px)!important;
    }

    .resenasSlider .swiper-slide-prev {
        transition: transform .3s;
        transform: scale(0.92) translateX(25px)!important;
    }

    .resena-slide .txt {
        font-size: 14px;
    }
}

@media (max-width: 460px) {
    /*.serviciosSlider .swiper-slide-next {
        position: relative;
        left: -25px;
    }

    .serviciosSlider .swiper-slide-prev {
        position: relative;
        right: -25px;
    }*/

    .swiper-slide.service-slide h2 {
        font-size: 21px;
    }

    .swiper-slide.service-slide ul li {
        font-size: 13px;
        margin-bottom: 5px;
        line-height: 120%;
    }

    .swiper-slide.service-slide ul {
        padding-left: 15px;
    }

    .swiper-slide.service-slide .service-icon img {
        max-width: 80px;
    }
}