.elementor-413 .elementor-element.elementor-element-3f78bfc1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--overlay-opacity:1;--padding-top:25px;--padding-bottom:40px;--padding-left:91px;--padding-right:91px;}.elementor-413 .elementor-element.elementor-element-3f78bfc1:not(.elementor-motion-effects-element-type-background), .elementor-413 .elementor-element.elementor-element-3f78bfc1 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-6808d4e );}.elementor-413 .elementor-element.elementor-element-3f78bfc1::before, .elementor-413 .elementor-element.elementor-element-3f78bfc1 > .elementor-background-video-container::before, .elementor-413 .elementor-element.elementor-element-3f78bfc1 > .e-con-inner > .elementor-background-video-container::before, .elementor-413 .elementor-element.elementor-element-3f78bfc1 > .elementor-background-slideshow::before, .elementor-413 .elementor-element.elementor-element-3f78bfc1 > .e-con-inner > .elementor-background-slideshow::before, .elementor-413 .elementor-element.elementor-element-3f78bfc1 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:transparent;--background-overlay:'';background-image:linear-gradient(180deg, #F2F1FB 0%, #08080800 48%);}.elementor-413 .elementor-element.elementor-element-bbdaa03{--display:flex;}.elementor-413 .elementor-element.elementor-element-1f3f9e55{text-align:center;}.elementor-413 .elementor-element.elementor-element-1f3f9e55 .elementor-heading-title{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );text-transform:var( --e-global-typography-secondary-text-transform );text-decoration:var( --e-global-typography-secondary-text-decoration );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );color:var( --e-global-color-c86cb03 );}.elementor-413 .elementor-element.elementor-element-796f882b{text-align:center;}.elementor-413 .elementor-element.elementor-element-796f882b .elementor-heading-title{font-family:var( --e-global-typography-bf0e030-font-family ), Sans-serif;font-size:var( --e-global-typography-bf0e030-font-size );font-weight:var( --e-global-typography-bf0e030-font-weight );text-transform:var( --e-global-typography-bf0e030-text-transform );text-decoration:var( --e-global-typography-bf0e030-text-decoration );line-height:var( --e-global-typography-bf0e030-line-height );color:var( --e-global-color-9245e5c );}.elementor-413 .elementor-element.elementor-element-17ad13b{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-413 .elementor-element.elementor-element-17ad13b:not(.elementor-motion-effects-element-type-background), .elementor-413 .elementor-element.elementor-element-17ad13b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-b2ef8bc );}.elementor-413 .elementor-element.elementor-element-e8e96d6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:40px 40px;--row-gap:40px;--column-gap:40px;--padding-top:74px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-413 .elementor-element.elementor-element-252ef14{--display:flex;--padding-top:0px;--padding-bottom:90px;--padding-left:0px;--padding-right:0px;}.elementor-413 .elementor-element.elementor-element-63e9357{text-align:center;}.elementor-413 .elementor-element.elementor-element-63e9357 .elementor-heading-title{color:var( --e-global-color-c86cb03 );}.elementor-413 .elementor-element.elementor-element-110447c{--display:grid;--e-con-grid-template-columns:repeat(3, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--gap:76px 30px;--row-gap:76px;--column-gap:30px;--grid-auto-flow:row;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-413 .elementor-element.elementor-element-e4bcb72{--display:flex;--gap:41px 0px;--row-gap:41px;--column-gap:0px;--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;grid-column:span 1;}.elementor-413 .elementor-element.elementor-element-e4bcb72.e-con{--align-self:flex-start;--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-739e8e1{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap: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-413 .elementor-element.elementor-element-9d85698{width:auto;max-width:auto;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-413 .elementor-element.elementor-element-9d85698.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-9d85698 .elementor-button{fill:var( --e-global-color-2c8499a );color:var( --e-global-color-2c8499a );}.elementor-413 .elementor-element.elementor-element-7842c6a{--display:flex;--gap:41px 0px;--row-gap:41px;--column-gap:0px;--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;grid-column:span 1;}.elementor-413 .elementor-element.elementor-element-7842c6a.e-con{--align-self:flex-start;--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-e8edb32{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;border-style:none;--border-style:none;--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-413 .elementor-element.elementor-element-51f9878{width:auto;max-width:auto;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-413 .elementor-element.elementor-element-51f9878.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-082d200{--display:flex;--gap:41px 0px;--row-gap:41px;--column-gap:0px;--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;grid-column:span 1;}.elementor-413 .elementor-element.elementor-element-082d200.e-con{--align-self:flex-start;--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-3e0e90e{--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;}.elementor-413 .elementor-element.elementor-element-4640db0{width:auto;max-width:auto;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-413 .elementor-element.elementor-element-4640db0.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-5c08fae{--display:flex;--gap:41px 0px;--row-gap:41px;--column-gap:0px;--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;grid-column:span 1;}.elementor-413 .elementor-element.elementor-element-5c08fae.e-con{--align-self:flex-start;--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-1cd1b21{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-413 .elementor-element.elementor-element-c0effc3{width:auto;max-width:auto;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-413 .elementor-element.elementor-element-c0effc3.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-fe7ff62{--display:flex;--gap:41px 0px;--row-gap:41px;--column-gap:0px;--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;grid-column:span 1;}.elementor-413 .elementor-element.elementor-element-fe7ff62.e-con{--align-self:flex-start;--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-0ab7f4b{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-413 .elementor-element.elementor-element-4d2eb75{width:auto;max-width:auto;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-413 .elementor-element.elementor-element-4d2eb75.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-4d2eb75 .elementor-button{font-family:var( --e-global-typography-e1c11dd-font-family ), Sans-serif;font-size:var( --e-global-typography-e1c11dd-font-size );font-weight:var( --e-global-typography-e1c11dd-font-weight );text-transform:var( --e-global-typography-e1c11dd-text-transform );font-style:var( --e-global-typography-e1c11dd-font-style );line-height:var( --e-global-typography-e1c11dd-line-height );}.elementor-413 .elementor-element.elementor-element-e5c2cbb{--display:flex;--gap:41px 0px;--row-gap:41px;--column-gap:0px;--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;grid-column:span 1;}.elementor-413 .elementor-element.elementor-element-e5c2cbb.e-con{--align-self:flex-start;--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-31fea75{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-413 .elementor-element.elementor-element-39a443d{width:auto;max-width:auto;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-413 .elementor-element.elementor-element-39a443d.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-0d2adb9{--display:flex;--gap:41px 0px;--row-gap:41px;--column-gap:0px;--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;grid-column:span 1;}.elementor-413 .elementor-element.elementor-element-0d2adb9.e-con{--align-self:flex-start;--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-1efc656{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-413 .elementor-element.elementor-element-7090944{width:auto;max-width:auto;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-413 .elementor-element.elementor-element-7090944.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-72e204bf{--display:flex;--overlay-opacity:0.5;--padding-top:65px;--padding-bottom:65px;--padding-left:0px;--padding-right:0px;}.elementor-413 .elementor-element.elementor-element-72e204bf::before, .elementor-413 .elementor-element.elementor-element-72e204bf > .elementor-background-video-container::before, .elementor-413 .elementor-element.elementor-element-72e204bf > .e-con-inner > .elementor-background-video-container::before, .elementor-413 .elementor-element.elementor-element-72e204bf > .elementor-background-slideshow::before, .elementor-413 .elementor-element.elementor-element-72e204bf > .e-con-inner > .elementor-background-slideshow::before, .elementor-413 .elementor-element.elementor-element-72e204bf > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-413 .elementor-element.elementor-element-7f0eef6{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-413 .elementor-element.elementor-element-41a9a4b2{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:flex-end;--overlay-opacity:0.7;--border-radius:16px 16px 16px 16px;--padding-top:56px;--padding-bottom:56px;--padding-left:56px;--padding-right:56px;}.elementor-413 .elementor-element.elementor-element-41a9a4b2:not(.elementor-motion-effects-element-type-background), .elementor-413 .elementor-element.elementor-element-41a9a4b2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-bfd1a18 );}.elementor-413 .elementor-element.elementor-element-41a9a4b2::before, .elementor-413 .elementor-element.elementor-element-41a9a4b2 > .elementor-background-video-container::before, .elementor-413 .elementor-element.elementor-element-41a9a4b2 > .e-con-inner > .elementor-background-video-container::before, .elementor-413 .elementor-element.elementor-element-41a9a4b2 > .elementor-background-slideshow::before, .elementor-413 .elementor-element.elementor-element-41a9a4b2 > .e-con-inner > .elementor-background-slideshow::before, .elementor-413 .elementor-element.elementor-element-41a9a4b2 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-413 .elementor-element.elementor-element-1bd35a70{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:flex-start;--gap:16px 16px;--row-gap:16px;--column-gap:16px;--overflow:hidden;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-413 .elementor-element.elementor-element-1bd35a70.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-413 .elementor-element.elementor-element-47c0cb4a{text-align:start;}.elementor-413 .elementor-element.elementor-element-47c0cb4a .elementor-heading-title{font-family:var( --e-global-typography-284ab71-font-family ), Sans-serif;font-size:var( --e-global-typography-284ab71-font-size );font-weight:var( --e-global-typography-284ab71-font-weight );text-transform:var( --e-global-typography-284ab71-text-transform );text-decoration:var( --e-global-typography-284ab71-text-decoration );line-height:var( --e-global-typography-284ab71-line-height );letter-spacing:var( --e-global-typography-284ab71-letter-spacing );color:var( --e-global-color-b2ef8bc );}.elementor-413 .elementor-element.elementor-element-79ee3dfa{--display:flex;--flex-direction:row-reverse;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap-reverse;--justify-content:flex-end;--overflow:hidden;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button{background-color:var( --e-global-color-secondary );font-family:var( --e-global-typography-e1c11dd-font-family ), Sans-serif;font-size:var( --e-global-typography-e1c11dd-font-size );font-weight:var( --e-global-typography-e1c11dd-font-weight );text-transform:var( --e-global-typography-e1c11dd-text-transform );font-style:var( --e-global-typography-e1c11dd-font-style );line-height:var( --e-global-typography-e1c11dd-line-height );transition-duration:0.5s;border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-secondary );}.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button:hover, .elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button:focus{background-color:var( --e-global-color-accent );color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button:hover svg, .elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button:focus svg{fill:var( --e-global-color-secondary );}@media(max-width:1024px){.elementor-413 .elementor-element.elementor-element-1f3f9e55 .elementor-heading-title{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-413 .elementor-element.elementor-element-796f882b .elementor-heading-title{font-size:var( --e-global-typography-bf0e030-font-size );line-height:var( --e-global-typography-bf0e030-line-height );}.elementor-413 .elementor-element.elementor-element-110447c{--grid-auto-flow:row;}.elementor-413 .elementor-element.elementor-element-4d2eb75 .elementor-button{font-size:var( --e-global-typography-e1c11dd-font-size );line-height:var( --e-global-typography-e1c11dd-line-height );}.elementor-413 .elementor-element.elementor-element-41a9a4b2{--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--padding-top:48px;--padding-bottom:48px;--padding-left:48px;--padding-right:48px;}.elementor-413 .elementor-element.elementor-element-1bd35a70{--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-413 .elementor-element.elementor-element-47c0cb4a{text-align:center;}.elementor-413 .elementor-element.elementor-element-47c0cb4a .elementor-heading-title{font-size:var( --e-global-typography-284ab71-font-size );line-height:var( --e-global-typography-284ab71-line-height );letter-spacing:var( --e-global-typography-284ab71-letter-spacing );}.elementor-413 .elementor-element.elementor-element-79ee3dfa{--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button{font-size:var( --e-global-typography-e1c11dd-font-size );line-height:var( --e-global-typography-e1c11dd-line-height );}}@media(max-width:767px){.elementor-413 .elementor-element.elementor-element-1f3f9e55 .elementor-heading-title{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-413 .elementor-element.elementor-element-796f882b .elementor-heading-title{font-size:var( --e-global-typography-bf0e030-font-size );line-height:var( --e-global-typography-bf0e030-line-height );}.elementor-413 .elementor-element.elementor-element-110447c{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-413 .elementor-element.elementor-element-4d2eb75 .elementor-button{font-size:var( --e-global-typography-e1c11dd-font-size );line-height:var( --e-global-typography-e1c11dd-line-height );}.elementor-413 .elementor-element.elementor-element-41a9a4b2{--padding-top:48px;--padding-bottom:48px;--padding-left:24px;--padding-right:24px;}.elementor-413 .elementor-element.elementor-element-47c0cb4a{text-align:center;}.elementor-413 .elementor-element.elementor-element-47c0cb4a .elementor-heading-title{font-size:var( --e-global-typography-284ab71-font-size );line-height:var( --e-global-typography-284ab71-line-height );letter-spacing:var( --e-global-typography-284ab71-letter-spacing );}.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button{font-size:var( --e-global-typography-e1c11dd-font-size );line-height:var( --e-global-typography-e1c11dd-line-height );}}@media(min-width:768px){.elementor-413 .elementor-element.elementor-element-e4bcb72{--width:100%;}.elementor-413 .elementor-element.elementor-element-7842c6a{--width:100%;}.elementor-413 .elementor-element.elementor-element-082d200{--width:100%;}.elementor-413 .elementor-element.elementor-element-5c08fae{--width:100%;}.elementor-413 .elementor-element.elementor-element-fe7ff62{--width:100%;}.elementor-413 .elementor-element.elementor-element-e5c2cbb{--width:100%;}.elementor-413 .elementor-element.elementor-element-0d2adb9{--width:100%;}.elementor-413 .elementor-element.elementor-element-1bd35a70{--width:76.482%;}.elementor-413 .elementor-element.elementor-element-79ee3dfa{--width:21%;}}@media(max-width:1024px) and (min-width:768px){.elementor-413 .elementor-element.elementor-element-1bd35a70{--width:100%;}.elementor-413 .elementor-element.elementor-element-79ee3dfa{--width:100%;}}/* Start custom CSS for container, class: .elementor-element-739e8e1 *//* =========================================
   IMAGE CONTAINER — ORANGE BORDER ON HOVER
========================================= */

.elementor-413 .elementor-element.elementor-element-739e8e1 {
  --border-color: #FB600D;
  --border-size: 2px;
  --radius: 12px;
  --transition: 0.25s;

  position: relative !important;
  overflow: hidden !important;
  border-radius: var(--radius) !important;
}

/* Asegura que la imagen respete el borde redondeado */
.elementor-413 .elementor-element.elementor-element-739e8e1 img {
  display: block !important;
  width: 100% !important;
  border-radius: var(--radius) !important;
}

/* Borde falso invisible */
.elementor-413 .elementor-element.elementor-element-739e8e1::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border: var(--border-size) solid transparent !important;
  border-radius: var(--radius) !important;
  pointer-events: none !important;
  z-index: 20 !important;
  transition: border-color var(--transition) ease !important;
}

/* Hover */
.elementor-413 .elementor-element.elementor-element-739e8e1:hover::after {
  border-color: var(--border-color) !important;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-9d85698 *//* =============================================
   ⚙️ ZONA DE EDICIÓN FÁCIL
============================================= */
.elementor-413 .elementor-element.elementor-element-9d85698 {
  /* ── COLORES ─────────────────────────── */
  --color-bg-default:   #070919;   /* Fondo en estado normal (círculo oscuro) */
  --color-bg-hover:     #FB600D;   /* Fondo al pasar el cursor (pill naranja) */
  --color-arrow:        #ffffff;   /* Color de la flecha */
  --color-text-default: #070919;   /* Color del texto normal (visible fuera del círculo) */
  --color-text-hover:   #ffffff;   /* Color del texto al pasar el cursor (dentro del pill) */

  /* ── TAMAÑOS ─────────────────────────── */
  --size:               34px;      /* Alto y ancho del círculo inicial */
  --hover-width:        490px;     /* Ancho TOTAL del botón expandido */
  --gap:                22px;      /* ESPACIO entre el área de la flecha y el texto */
  
  /* ── FLECHA ──────────────────────────── */
  --arrow-size:         20px;      /* Tamaño de la flecha. (Recomendado 14px-18px) */
  /* Nota: Ya no se usa --arrow-weight. El grosor ahora se define en 'stroke-width' dentro del bloque de la flecha abajo */
  
  /* ── ANIMACIÓN ───────────────────────── */
  --duration:           0.4s;      /* Velocidad de expansión */
  --ease:               ease-in-out;
}

/* =========================================
   ESTRUCTURA BASE DEL BOTÓN
========================================= */
.elementor-413 .elementor-element.elementor-element-9d85698 {
  display: inline-flex !important;
}

.elementor-413 .elementor-element.elementor-element-9d85698 .elementor-button {
  position: relative !important;
  width: var(--size) !important;
  height: var(--size) !important;
  background-color: var(--color-bg-default) !important;
  border-radius: 999px !important; 
  padding: 0 !important;
  border: none !important;
  overflow: visible !important; 
  transition: 
    width var(--duration) var(--ease), 
    background-color var(--duration) var(--ease) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* =========================================
   LA FLECHA (AHORA CON SVG MASK)
========================================= */
.elementor-413 .elementor-element.elementor-element-9d85698 .elementor-button::before {
  content: "" !important; /* Se elimina el texto ">" */
  position: absolute !important;
  
  /* Centrado matemático perfecto dentro del círculo */
  left: calc((var(--size) - var(--arrow-size)) / 2) !important;
  top: calc((var(--size) - var(--arrow-size)) / 2) !important;
  width: var(--arrow-size) !important;
  height: var(--arrow-size) !important;
  
  /* El color de la flecha se inyecta mediante el background */
  background-color: var(--color-arrow) !important;
  
  /* Máscara de vector SVG. Cambia 'stroke-width=2.5' si la quieres más gruesa o delgada */
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  -webkit-mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  -webkit-mask-size: contain !important;
  
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  mask-repeat: no-repeat !important;
  mask-position: center !important;
  mask-size: contain !important;
  
  z-index: 2 !important;
}

/* =========================================
   CONTENEDOR DEL TEXTO
========================================= */
.elementor-413 .elementor-element.elementor-element-9d85698 .elementor-button-content-wrapper {
  padding-left: calc(var(--size) + var(--gap)) !important; 
  padding-right: 20px !important; 
  width: max-content !important; 
  display: flex !important;
  align-items: center !important;
  z-index: 3 !important;
}

/* =========================================
   EL TEXTO (SIEMPRE VISIBLE)
========================================= */
.elementor-413 .elementor-element.elementor-element-9d85698 .elementor-button-text {
  color: var(--color-text-default) !important;
  white-space: nowrap !important;
  transition: color var(--duration) var(--ease) !important;
}

/* =========================================
   ESTADO HOVER (EXPANSIÓN)
========================================= */
.elementor-413 .elementor-element.elementor-element-9d85698:hover .elementor-button {
  width: var(--hover-width) !important;
  background-color: var(--color-bg-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-9d85698:hover .elementor-button-text {
  color: var(--color-text-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-9d85698 .elementor-button-icon {
  display: none !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-e8edb32 *//* =========================================
   IMAGE CONTAINER — ORANGE BORDER ON HOVER
========================================= */

.elementor-413 .elementor-element.elementor-element-e8edb32 {
  --border-color: #FB600D;
  --border-size: 2px;
  --radius: 12px;
  --transition: 0.25s;

  position: relative !important;
  overflow: hidden !important;
  border-radius: var(--radius) !important;
}

/* Asegura que la imagen respete el borde redondeado */
.elementor-413 .elementor-element.elementor-element-e8edb32 img {
  display: block !important;
  width: 100% !important;
  border-radius: var(--radius) !important;
}

/* Borde falso invisible */
.elementor-413 .elementor-element.elementor-element-e8edb32::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border: var(--border-size) solid transparent !important;
  border-radius: var(--radius) !important;
  pointer-events: none !important;
  z-index: 20 !important;
  transition: border-color var(--transition) ease !important;
}

/* Hover */
.elementor-413 .elementor-element.elementor-element-e8edb32:hover::after {
  border-color: var(--border-color) !important;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-51f9878 *//* =============================================
   ⚙️ ZONA DE EDICIÓN FÁCIL
============================================= */
.elementor-413 .elementor-element.elementor-element-51f9878 {
  /* ── COLORES ─────────────────────────── */
  --color-bg-default:   #070919;   /* Fondo en estado normal (círculo oscuro) */
  --color-bg-hover:     #FB600D;   /* Fondo al pasar el cursor (pill naranja) */
  --color-arrow:        #ffffff;   /* Color de la flecha */
  --color-text-default: #070919;   /* Color del texto normal (visible fuera del círculo) */
  --color-text-hover:   #ffffff;   /* Color del texto al pasar el cursor (dentro del pill) */

  /* ── TAMAÑOS ─────────────────────────── */
  --size:               34px;      /* Alto y ancho del círculo inicial */
  --hover-width:        490px;     /* Ancho TOTAL del botón expandido */
  --gap:                22px;      /* ESPACIO entre el área de la flecha y el texto */
  
  /* ── FLECHA ──────────────────────────── */
  --arrow-size:         20px;      /* Tamaño de la flecha. (Recomendado 14px-18px) */
  /* Nota: Ya no se usa --arrow-weight. El grosor ahora se define en 'stroke-width' dentro del bloque de la flecha abajo */
  
  /* ── ANIMACIÓN ───────────────────────── */
  --duration:           0.4s;      /* Velocidad de expansión */
  --ease:               ease-in-out;
}

/* =========================================
   ESTRUCTURA BASE DEL BOTÓN
========================================= */
.elementor-413 .elementor-element.elementor-element-51f9878 {
  display: inline-flex !important;
}

.elementor-413 .elementor-element.elementor-element-51f9878 .elementor-button {
  position: relative !important;
  width: var(--size) !important;
  height: var(--size) !important;
  background-color: var(--color-bg-default) !important;
  border-radius: 999px !important; 
  padding: 0 !important;
  border: none !important;
  overflow: visible !important; 
  transition: 
    width var(--duration) var(--ease), 
    background-color var(--duration) var(--ease) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* =========================================
   LA FLECHA (AHORA CON SVG MASK)
========================================= */
.elementor-413 .elementor-element.elementor-element-51f9878 .elementor-button::before {
  content: "" !important; /* Se elimina el texto ">" */
  position: absolute !important;
  
  /* Centrado matemático perfecto dentro del círculo */
  left: calc((var(--size) - var(--arrow-size)) / 2) !important;
  top: calc((var(--size) - var(--arrow-size)) / 2) !important;
  width: var(--arrow-size) !important;
  height: var(--arrow-size) !important;
  
  /* El color de la flecha se inyecta mediante el background */
  background-color: var(--color-arrow) !important;
  
  /* Máscara de vector SVG. Cambia 'stroke-width=2.5' si la quieres más gruesa o delgada */
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  -webkit-mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  -webkit-mask-size: contain !important;
  
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  mask-repeat: no-repeat !important;
  mask-position: center !important;
  mask-size: contain !important;
  
  z-index: 2 !important;
}

/* =========================================
   CONTENEDOR DEL TEXTO
========================================= */
.elementor-413 .elementor-element.elementor-element-51f9878 .elementor-button-content-wrapper {
  padding-left: calc(var(--size) + var(--gap)) !important; 
  padding-right: 20px !important; 
  width: max-content !important; 
  display: flex !important;
  align-items: center !important;
  z-index: 3 !important;
}

/* =========================================
   EL TEXTO (SIEMPRE VISIBLE)
========================================= */
.elementor-413 .elementor-element.elementor-element-51f9878 .elementor-button-text {
  color: var(--color-text-default) !important;
  white-space: nowrap !important;
  transition: color var(--duration) var(--ease) !important;
}

/* =========================================
   ESTADO HOVER (EXPANSIÓN)
========================================= */
.elementor-413 .elementor-element.elementor-element-51f9878:hover .elementor-button {
  width: var(--hover-width) !important;
  background-color: var(--color-bg-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-51f9878:hover .elementor-button-text {
  color: var(--color-text-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-51f9878 .elementor-button-icon {
  display: none !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-3e0e90e *//* =========================================
   IMAGE CONTAINER — ORANGE BORDER ON HOVER
========================================= */

.elementor-413 .elementor-element.elementor-element-3e0e90e {
  --border-color: #FB600D;
  --border-size: 2px;
  --radius: 12px;
  --transition: 0.25s;

  position: relative !important;
  overflow: hidden !important;
  border-radius: var(--radius) !important;
}

/* Asegura que la imagen respete el borde redondeado */
.elementor-413 .elementor-element.elementor-element-3e0e90e img {
  display: block !important;
  width: 100% !important;
  border-radius: var(--radius) !important;
}

/* Borde falso invisible */
.elementor-413 .elementor-element.elementor-element-3e0e90e::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border: var(--border-size) solid transparent !important;
  border-radius: var(--radius) !important;
  pointer-events: none !important;
  z-index: 20 !important;
  transition: border-color var(--transition) ease !important;
}

/* Hover */
.elementor-413 .elementor-element.elementor-element-3e0e90e:hover::after {
  border-color: var(--border-color) !important;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-4640db0 *//* =============================================
   ⚙️ ZONA DE EDICIÓN FÁCIL
============================================= */
.elementor-413 .elementor-element.elementor-element-4640db0 {
  /* ── COLORES ─────────────────────────── */
  --color-bg-default:   #070919;   /* Fondo en estado normal (círculo oscuro) */
  --color-bg-hover:     #FB600D;   /* Fondo al pasar el cursor (pill naranja) */
  --color-arrow:        #ffffff;   /* Color de la flecha */
  --color-text-default: #070919;   /* Color del texto normal (visible fuera del círculo) */
  --color-text-hover:   #ffffff;   /* Color del texto al pasar el cursor (dentro del pill) */

  /* ── TAMAÑOS ─────────────────────────── */
  --size:               34px;      /* Alto y ancho del círculo inicial */
  --hover-width:        490px;     /* Ancho TOTAL del botón expandido */
  --gap:                22px;      /* ESPACIO entre el área de la flecha y el texto */
  
  /* ── FLECHA ──────────────────────────── */
  --arrow-size:         20px;      /* Tamaño de la flecha. (Recomendado 14px-18px) */
  /* Nota: Ya no se usa --arrow-weight. El grosor ahora se define en 'stroke-width' dentro del bloque de la flecha abajo */
  
  /* ── ANIMACIÓN ───────────────────────── */
  --duration:           0.4s;      /* Velocidad de expansión */
  --ease:               ease-in-out;
}

/* =========================================
   ESTRUCTURA BASE DEL BOTÓN
========================================= */
.elementor-413 .elementor-element.elementor-element-4640db0 {
  display: inline-flex !important;
}

.elementor-413 .elementor-element.elementor-element-4640db0 .elementor-button {
  position: relative !important;
  width: var(--size) !important;
  height: var(--size) !important;
  background-color: var(--color-bg-default) !important;
  border-radius: 999px !important; 
  padding: 0 !important;
  border: none !important;
  overflow: visible !important; 
  transition: 
    width var(--duration) var(--ease), 
    background-color var(--duration) var(--ease) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* =========================================
   LA FLECHA (AHORA CON SVG MASK)
========================================= */
.elementor-413 .elementor-element.elementor-element-4640db0 .elementor-button::before {
  content: "" !important; /* Se elimina el texto ">" */
  position: absolute !important;
  
  /* Centrado matemático perfecto dentro del círculo */
  left: calc((var(--size) - var(--arrow-size)) / 2) !important;
  top: calc((var(--size) - var(--arrow-size)) / 2) !important;
  width: var(--arrow-size) !important;
  height: var(--arrow-size) !important;
  
  /* El color de la flecha se inyecta mediante el background */
  background-color: var(--color-arrow) !important;
  
  /* Máscara de vector SVG. Cambia 'stroke-width=2.5' si la quieres más gruesa o delgada */
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  -webkit-mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  -webkit-mask-size: contain !important;
  
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  mask-repeat: no-repeat !important;
  mask-position: center !important;
  mask-size: contain !important;
  
  z-index: 2 !important;
}

/* =========================================
   CONTENEDOR DEL TEXTO
========================================= */
.elementor-413 .elementor-element.elementor-element-4640db0 .elementor-button-content-wrapper {
  padding-left: calc(var(--size) + var(--gap)) !important; 
  padding-right: 20px !important; 
  width: max-content !important; 
  display: flex !important;
  align-items: center !important;
  z-index: 3 !important;
}

/* =========================================
   EL TEXTO (SIEMPRE VISIBLE)
========================================= */
.elementor-413 .elementor-element.elementor-element-4640db0 .elementor-button-text {
  color: var(--color-text-default) !important;
  white-space: nowrap !important;
  transition: color var(--duration) var(--ease) !important;
}

/* =========================================
   ESTADO HOVER (EXPANSIÓN)
========================================= */
.elementor-413 .elementor-element.elementor-element-4640db0:hover .elementor-button {
  width: var(--hover-width) !important;
  background-color: var(--color-bg-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-4640db0:hover .elementor-button-text {
  color: var(--color-text-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-4640db0 .elementor-button-icon {
  display: none !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-1cd1b21 *//* =========================================
   IMAGE CONTAINER — ORANGE BORDER ON HOVER
========================================= */

.elementor-413 .elementor-element.elementor-element-1cd1b21 {
  --border-color: #FB600D;
  --border-size: 2px;
  --radius: 12px;
  --transition: 0.25s;

  position: relative !important;
  overflow: hidden !important;
  border-radius: var(--radius) !important;
}

/* Asegura que la imagen respete el borde redondeado */
.elementor-413 .elementor-element.elementor-element-1cd1b21 img {
  display: block !important;
  width: 100% !important;
  border-radius: var(--radius) !important;
}

/* Borde falso invisible */
.elementor-413 .elementor-element.elementor-element-1cd1b21::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border: var(--border-size) solid transparent !important;
  border-radius: var(--radius) !important;
  pointer-events: none !important;
  z-index: 20 !important;
  transition: border-color var(--transition) ease !important;
}

/* Hover */
.elementor-413 .elementor-element.elementor-element-1cd1b21:hover::after {
  border-color: var(--border-color) !important;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-c0effc3 *//* =============================================
   ⚙️ ZONA DE EDICIÓN FÁCIL
============================================= */
.elementor-413 .elementor-element.elementor-element-c0effc3 {
  /* ── COLORES ─────────────────────────── */
  --color-bg-default:   #070919;   /* Fondo en estado normal (círculo oscuro) */
  --color-bg-hover:     #FB600D;   /* Fondo al pasar el cursor (pill naranja) */
  --color-arrow:        #ffffff;   /* Color de la flecha */
  --color-text-default: #070919;   /* Color del texto normal (visible fuera del círculo) */
  --color-text-hover:   #ffffff;   /* Color del texto al pasar el cursor (dentro del pill) */

  /* ── TAMAÑOS ─────────────────────────── */
  --size:               34px;      /* Alto y ancho del círculo inicial */
  --hover-width:        490px;     /* Ancho TOTAL del botón expandido */
  --gap:                22px;      /* ESPACIO entre el área de la flecha y el texto */
  
  /* ── FLECHA ──────────────────────────── */
  --arrow-size:         20px;      /* Tamaño de la flecha. (Recomendado 14px-18px) */
  /* Nota: Ya no se usa --arrow-weight. El grosor ahora se define en 'stroke-width' dentro del bloque de la flecha abajo */
  
  /* ── ANIMACIÓN ───────────────────────── */
  --duration:           0.4s;      /* Velocidad de expansión */
  --ease:               ease-in-out;
}

/* =========================================
   ESTRUCTURA BASE DEL BOTÓN
========================================= */
.elementor-413 .elementor-element.elementor-element-c0effc3 {
  display: inline-flex !important;
}

.elementor-413 .elementor-element.elementor-element-c0effc3 .elementor-button {
  position: relative !important;
  width: var(--size) !important;
  height: var(--size) !important;
  background-color: var(--color-bg-default) !important;
  border-radius: 999px !important; 
  padding: 0 !important;
  border: none !important;
  overflow: visible !important; 
  transition: 
    width var(--duration) var(--ease), 
    background-color var(--duration) var(--ease) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* =========================================
   LA FLECHA (AHORA CON SVG MASK)
========================================= */
.elementor-413 .elementor-element.elementor-element-c0effc3 .elementor-button::before {
  content: "" !important; /* Se elimina el texto ">" */
  position: absolute !important;
  
  /* Centrado matemático perfecto dentro del círculo */
  left: calc((var(--size) - var(--arrow-size)) / 2) !important;
  top: calc((var(--size) - var(--arrow-size)) / 2) !important;
  width: var(--arrow-size) !important;
  height: var(--arrow-size) !important;
  
  /* El color de la flecha se inyecta mediante el background */
  background-color: var(--color-arrow) !important;
  
  /* Máscara de vector SVG. Cambia 'stroke-width=2.5' si la quieres más gruesa o delgada */
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  -webkit-mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  -webkit-mask-size: contain !important;
  
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  mask-repeat: no-repeat !important;
  mask-position: center !important;
  mask-size: contain !important;
  
  z-index: 2 !important;
}

/* =========================================
   CONTENEDOR DEL TEXTO
========================================= */
.elementor-413 .elementor-element.elementor-element-c0effc3 .elementor-button-content-wrapper {
  padding-left: calc(var(--size) + var(--gap)) !important; 
  padding-right: 20px !important; 
  width: max-content !important; 
  display: flex !important;
  align-items: center !important;
  z-index: 3 !important;
}

/* =========================================
   EL TEXTO (SIEMPRE VISIBLE)
========================================= */
.elementor-413 .elementor-element.elementor-element-c0effc3 .elementor-button-text {
  color: var(--color-text-default) !important;
  white-space: nowrap !important;
  transition: color var(--duration) var(--ease) !important;
}

/* =========================================
   ESTADO HOVER (EXPANSIÓN)
========================================= */
.elementor-413 .elementor-element.elementor-element-c0effc3:hover .elementor-button {
  width: var(--hover-width) !important;
  background-color: var(--color-bg-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-c0effc3:hover .elementor-button-text {
  color: var(--color-text-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-c0effc3 .elementor-button-icon {
  display: none !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-0ab7f4b *//* =========================================
   IMAGE CONTAINER — ORANGE BORDER ON HOVER
========================================= */

.elementor-413 .elementor-element.elementor-element-0ab7f4b {
  --border-color: #FB600D;
  --border-size: 2px;
  --radius: 12px;
  --transition: 0.25s;

  position: relative !important;
  overflow: hidden !important;
  border-radius: var(--radius) !important;
}

/* Asegura que la imagen respete el borde redondeado */
.elementor-413 .elementor-element.elementor-element-0ab7f4b img {
  display: block !important;
  width: 100% !important;
  border-radius: var(--radius) !important;
}

/* Borde falso invisible */
.elementor-413 .elementor-element.elementor-element-0ab7f4b::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border: var(--border-size) solid transparent !important;
  border-radius: var(--radius) !important;
  pointer-events: none !important;
  z-index: 20 !important;
  transition: border-color var(--transition) ease !important;
}

/* Hover */
.elementor-413 .elementor-element.elementor-element-0ab7f4b:hover::after {
  border-color: var(--border-color) !important;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-4d2eb75 *//* =============================================
   ⚙️ ZONA DE EDICIÓN FÁCIL
============================================= */
.elementor-413 .elementor-element.elementor-element-4d2eb75 {
  /* ── COLORES ─────────────────────────── */
  --color-bg-default:   #070919;   /* Fondo en estado normal (círculo oscuro) */
  --color-bg-hover:     #FB600D;   /* Fondo al pasar el cursor (pill naranja) */
  --color-arrow:        #ffffff;   /* Color de la flecha */
  --color-text-default: #070919;   /* Color del texto normal (visible fuera del círculo) */
  --color-text-hover:   #ffffff;   /* Color del texto al pasar el cursor (dentro del pill) */

  /* ── TAMAÑOS ─────────────────────────── */
  --size:               34px;      /* Alto y ancho del círculo inicial */
  --hover-width:        490px;     /* Ancho TOTAL del botón expandido */
  --gap:                22px;      /* ESPACIO entre el área de la flecha y el texto */
  
  /* ── FLECHA ──────────────────────────── */
  --arrow-size:         20px;      /* Tamaño de la flecha. (Recomendado 14px-18px) */
  /* Nota: Ya no se usa --arrow-weight. El grosor ahora se define en 'stroke-width' dentro del bloque de la flecha abajo */
  
  /* ── ANIMACIÓN ───────────────────────── */
  --duration:           0.4s;      /* Velocidad de expansión */
  --ease:               ease-in-out;
}

/* =========================================
   ESTRUCTURA BASE DEL BOTÓN
========================================= */
.elementor-413 .elementor-element.elementor-element-4d2eb75 {
  display: inline-flex !important;
}

.elementor-413 .elementor-element.elementor-element-4d2eb75 .elementor-button {
  position: relative !important;
  width: var(--size) !important;
  height: var(--size) !important;
  background-color: var(--color-bg-default) !important;
  border-radius: 999px !important; 
  padding: 0 !important;
  border: none !important;
  overflow: visible !important; 
  transition: 
    width var(--duration) var(--ease), 
    background-color var(--duration) var(--ease) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* =========================================
   LA FLECHA (AHORA CON SVG MASK)
========================================= */
.elementor-413 .elementor-element.elementor-element-4d2eb75 .elementor-button::before {
  content: "" !important; /* Se elimina el texto ">" */
  position: absolute !important;
  
  /* Centrado matemático perfecto dentro del círculo */
  left: calc((var(--size) - var(--arrow-size)) / 2) !important;
  top: calc((var(--size) - var(--arrow-size)) / 2) !important;
  width: var(--arrow-size) !important;
  height: var(--arrow-size) !important;
  
  /* El color de la flecha se inyecta mediante el background */
  background-color: var(--color-arrow) !important;
  
  /* Máscara de vector SVG. Cambia 'stroke-width=2.5' si la quieres más gruesa o delgada */
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  -webkit-mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  -webkit-mask-size: contain !important;
  
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  mask-repeat: no-repeat !important;
  mask-position: center !important;
  mask-size: contain !important;
  
  z-index: 2 !important;
}

/* =========================================
   CONTENEDOR DEL TEXTO
========================================= */
.elementor-413 .elementor-element.elementor-element-4d2eb75 .elementor-button-content-wrapper {
  padding-left: calc(var(--size) + var(--gap)) !important; 
  padding-right: 20px !important; 
  width: max-content !important; 
  display: flex !important;
  align-items: center !important;
  z-index: 3 !important;
}

/* =========================================
   EL TEXTO (SIEMPRE VISIBLE)
========================================= */
.elementor-413 .elementor-element.elementor-element-4d2eb75 .elementor-button-text {
  color: var(--color-text-default) !important;
  white-space: nowrap !important;
  transition: color var(--duration) var(--ease) !important;
}

/* =========================================
   ESTADO HOVER (EXPANSIÓN)
========================================= */
.elementor-413 .elementor-element.elementor-element-4d2eb75:hover .elementor-button {
  width: var(--hover-width) !important;
  background-color: var(--color-bg-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-4d2eb75:hover .elementor-button-text {
  color: var(--color-text-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-4d2eb75 .elementor-button-icon {
  display: none !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-31fea75 *//* =========================================
   IMAGE CONTAINER — ORANGE BORDER ON HOVER
========================================= */

.elementor-413 .elementor-element.elementor-element-31fea75 {
  --border-color: #FB600D;
  --border-size: 2px;
  --radius: 12px;
  --transition: 0.25s;

  position: relative !important;
  overflow: hidden !important;
  border-radius: var(--radius) !important;
}

/* Asegura que la imagen respete el borde redondeado */
.elementor-413 .elementor-element.elementor-element-31fea75 img {
  display: block !important;
  width: 100% !important;
  border-radius: var(--radius) !important;
}

/* Borde falso invisible */
.elementor-413 .elementor-element.elementor-element-31fea75::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border: var(--border-size) solid transparent !important;
  border-radius: var(--radius) !important;
  pointer-events: none !important;
  z-index: 20 !important;
  transition: border-color var(--transition) ease !important;
}

/* Hover */
.elementor-413 .elementor-element.elementor-element-31fea75:hover::after {
  border-color: var(--border-color) !important;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-39a443d *//* =============================================
   ⚙️ ZONA DE EDICIÓN FÁCIL
============================================= */
.elementor-413 .elementor-element.elementor-element-39a443d {
  /* ── COLORES ─────────────────────────── */
  --color-bg-default:   #070919;   /* Fondo en estado normal (círculo oscuro) */
  --color-bg-hover:     #FB600D;   /* Fondo al pasar el cursor (pill naranja) */
  --color-arrow:        #ffffff;   /* Color de la flecha */
  --color-text-default: #070919;   /* Color del texto normal (visible fuera del círculo) */
  --color-text-hover:   #ffffff;   /* Color del texto al pasar el cursor (dentro del pill) */

  /* ── TAMAÑOS ─────────────────────────── */
  --size:               34px;      /* Alto y ancho del círculo inicial */
  --hover-width:        490px;     /* Ancho TOTAL del botón expandido */
  --gap:                22px;      /* ESPACIO entre el área de la flecha y el texto */
  
  /* ── FLECHA ──────────────────────────── */
  --arrow-size:         20px;      /* Tamaño de la flecha. (Recomendado 14px-18px) */
  /* Nota: Ya no se usa --arrow-weight. El grosor ahora se define en 'stroke-width' dentro del bloque de la flecha abajo */
  
  /* ── ANIMACIÓN ───────────────────────── */
  --duration:           0.4s;      /* Velocidad de expansión */
  --ease:               ease-in-out;
}

/* =========================================
   ESTRUCTURA BASE DEL BOTÓN
========================================= */
.elementor-413 .elementor-element.elementor-element-39a443d {
  display: inline-flex !important;
}

.elementor-413 .elementor-element.elementor-element-39a443d .elementor-button {
  position: relative !important;
  width: var(--size) !important;
  height: var(--size) !important;
  background-color: var(--color-bg-default) !important;
  border-radius: 999px !important; 
  padding: 0 !important;
  border: none !important;
  overflow: visible !important; 
  transition: 
    width var(--duration) var(--ease), 
    background-color var(--duration) var(--ease) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* =========================================
   LA FLECHA (AHORA CON SVG MASK)
========================================= */
.elementor-413 .elementor-element.elementor-element-39a443d .elementor-button::before {
  content: "" !important; /* Se elimina el texto ">" */
  position: absolute !important;
  
  /* Centrado matemático perfecto dentro del círculo */
  left: calc((var(--size) - var(--arrow-size)) / 2) !important;
  top: calc((var(--size) - var(--arrow-size)) / 2) !important;
  width: var(--arrow-size) !important;
  height: var(--arrow-size) !important;
  
  /* El color de la flecha se inyecta mediante el background */
  background-color: var(--color-arrow) !important;
  
  /* Máscara de vector SVG. Cambia 'stroke-width=2.5' si la quieres más gruesa o delgada */
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  -webkit-mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  -webkit-mask-size: contain !important;
  
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  mask-repeat: no-repeat !important;
  mask-position: center !important;
  mask-size: contain !important;
  
  z-index: 2 !important;
}

/* =========================================
   CONTENEDOR DEL TEXTO
========================================= */
.elementor-413 .elementor-element.elementor-element-39a443d .elementor-button-content-wrapper {
  padding-left: calc(var(--size) + var(--gap)) !important; 
  padding-right: 20px !important; 
  width: max-content !important; 
  display: flex !important;
  align-items: center !important;
  z-index: 3 !important;
}

/* =========================================
   EL TEXTO (SIEMPRE VISIBLE)
========================================= */
.elementor-413 .elementor-element.elementor-element-39a443d .elementor-button-text {
  color: var(--color-text-default) !important;
  white-space: nowrap !important;
  transition: color var(--duration) var(--ease) !important;
}

/* =========================================
   ESTADO HOVER (EXPANSIÓN)
========================================= */
.elementor-413 .elementor-element.elementor-element-39a443d:hover .elementor-button {
  width: var(--hover-width) !important;
  background-color: var(--color-bg-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-39a443d:hover .elementor-button-text {
  color: var(--color-text-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-39a443d .elementor-button-icon {
  display: none !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-1efc656 *//* =========================================
   IMAGE CONTAINER — ORANGE BORDER ON HOVER
========================================= */

.elementor-413 .elementor-element.elementor-element-1efc656 {
  --border-color: #FB600D;
  --border-size: 2px;
  --radius: 12px;
  --transition: 0.25s;

  position: relative !important;
  overflow: hidden !important;
  border-radius: var(--radius) !important;
}

/* Asegura que la imagen respete el borde redondeado */
.elementor-413 .elementor-element.elementor-element-1efc656 img {
  display: block !important;
  width: 100% !important;
  border-radius: var(--radius) !important;
}

/* Borde falso invisible */
.elementor-413 .elementor-element.elementor-element-1efc656::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border: var(--border-size) solid transparent !important;
  border-radius: var(--radius) !important;
  pointer-events: none !important;
  z-index: 20 !important;
  transition: border-color var(--transition) ease !important;
}

/* Hover */
.elementor-413 .elementor-element.elementor-element-1efc656:hover::after {
  border-color: var(--border-color) !important;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-7090944 *//* =============================================
   ⚙️ ZONA DE EDICIÓN FÁCIL
============================================= */
.elementor-413 .elementor-element.elementor-element-7090944 {
  /* ── COLORES ─────────────────────────── */
  --color-bg-default:   #070919;   /* Fondo en estado normal (círculo oscuro) */
  --color-bg-hover:     #FB600D;   /* Fondo al pasar el cursor (pill naranja) */
  --color-arrow:        #ffffff;   /* Color de la flecha */
  --color-text-default: #070919;   /* Color del texto normal (visible fuera del círculo) */
  --color-text-hover:   #ffffff;   /* Color del texto al pasar el cursor (dentro del pill) */

  /* ── TAMAÑOS ─────────────────────────── */
  --size:               34px;      /* Alto y ancho del círculo inicial */
  --hover-width:        490px;     /* Ancho TOTAL del botón expandido */
  --gap:                22px;      /* ESPACIO entre el área de la flecha y el texto */
  
  /* ── FLECHA ──────────────────────────── */
  --arrow-size:         20px;      /* Tamaño de la flecha. (Recomendado 14px-18px) */
  /* Nota: Ya no se usa --arrow-weight. El grosor ahora se define en 'stroke-width' dentro del bloque de la flecha abajo */
  
  /* ── ANIMACIÓN ───────────────────────── */
  --duration:           0.4s;      /* Velocidad de expansión */
  --ease:               ease-in-out;
}

/* =========================================
   ESTRUCTURA BASE DEL BOTÓN
========================================= */
.elementor-413 .elementor-element.elementor-element-7090944 {
  display: inline-flex !important;
}

.elementor-413 .elementor-element.elementor-element-7090944 .elementor-button {
  position: relative !important;
  width: var(--size) !important;
  height: var(--size) !important;
  background-color: var(--color-bg-default) !important;
  border-radius: 999px !important; 
  padding: 0 !important;
  border: none !important;
  overflow: visible !important; 
  transition: 
    width var(--duration) var(--ease), 
    background-color var(--duration) var(--ease) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* =========================================
   LA FLECHA (AHORA CON SVG MASK)
========================================= */
.elementor-413 .elementor-element.elementor-element-7090944 .elementor-button::before {
  content: "" !important; /* Se elimina el texto ">" */
  position: absolute !important;
  
  /* Centrado matemático perfecto dentro del círculo */
  left: calc((var(--size) - var(--arrow-size)) / 2) !important;
  top: calc((var(--size) - var(--arrow-size)) / 2) !important;
  width: var(--arrow-size) !important;
  height: var(--arrow-size) !important;
  
  /* El color de la flecha se inyecta mediante el background */
  background-color: var(--color-arrow) !important;
  
  /* Máscara de vector SVG. Cambia 'stroke-width=2.5' si la quieres más gruesa o delgada */
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  -webkit-mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  -webkit-mask-size: contain !important;
  
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
  mask-repeat: no-repeat !important;
  mask-position: center !important;
  mask-size: contain !important;
  
  z-index: 2 !important;
}

/* =========================================
   CONTENEDOR DEL TEXTO
========================================= */
.elementor-413 .elementor-element.elementor-element-7090944 .elementor-button-content-wrapper {
  padding-left: calc(var(--size) + var(--gap)) !important; 
  padding-right: 20px !important; 
  width: max-content !important; 
  display: flex !important;
  align-items: center !important;
  z-index: 3 !important;
}

/* =========================================
   EL TEXTO (SIEMPRE VISIBLE)
========================================= */
.elementor-413 .elementor-element.elementor-element-7090944 .elementor-button-text {
  color: var(--color-text-default) !important;
  white-space: nowrap !important;
  transition: color var(--duration) var(--ease) !important;
}

/* =========================================
   ESTADO HOVER (EXPANSIÓN)
========================================= */
.elementor-413 .elementor-element.elementor-element-7090944:hover .elementor-button {
  width: var(--hover-width) !important;
  background-color: var(--color-bg-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-7090944:hover .elementor-button-text {
  color: var(--color-text-hover) !important;
}

.elementor-413 .elementor-element.elementor-element-7090944 .elementor-button-icon {
  display: none !important;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-4999f13c *//* =========================================
   LEARN MORE BUTTON — Elementor Fix v3
========================================= */
.elementor-413 .elementor-element.elementor-element-4999f13c {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  /* aqui se edita posicion de texto*/
  width: 11.5rem !important;
  height: 3.5rem !important;
}

.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button {
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  /* aqui se edita gap entre circulo y texto*/
  padding: 0 1.4rem 0 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  overflow: hidden !important;
  cursor: pointer !important;
}

.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button .elementor-button-icon,
.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button .elementor-button-icon *,
.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button i,
.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button svg {
  display: none !important;
}

.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button::before,
.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button::after {
  content: none !important;
  display: none !important;
}

.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button .elementor-button-content-wrapper {
  position: relative !important;
  z-index: 4 !important;
  display: flex !important;
  align-items: center !important;
  pointer-events: none !important;
}

/* AQUÍ SE HIZO EL AJUSTE PARA LA TIPOGRAFÍA */
.elementor-413 .elementor-element.elementor-element-4999f13c .elementor-button .elementor-button-text {
  margin: 0 !important;
  /* line-height: 1 !important; -> Eliminado o comentado para que Elementor también controle el interlineado */
  color: #FFFFFF !important;
  white-space: nowrap !important;
  transition: color 0.45s cubic-bezier(0.65, 0, 0.076, 1) !important;
}

/* =========================================
   CÍRCULO — solo fondo, sin línea visible
========================================= */
.elementor-413 .elementor-element.elementor-element-4999f13c::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 3.5rem !important;
  height: 3.5rem !important;
  background: #FFFFFF !important;
  border-radius: 999px !important;
  z-index: 1 !important;
  transition: width 0.45s cubic-bezier(0.65, 0, 0.076, 1) !important;
}

/* =========================================
   FLECHA ">" centrada matemáticamente
   círculo 3.5rem → centro = 1.75rem
   punta 0.65rem → mitad = 0.325rem
   left = 1.75 - 0.325 = 1.425rem
========================================= */
.elementor-413 .elementor-element.elementor-element-4999f13c::after {
  content: "" !important;
  position: absolute !important;
  left: 1.425rem !important;
  top: 50% !important;
  width: 0.65rem !important;
  height: 0.65rem !important;
  border-top: 2.5px solid #080808 !important;
  border-right: 2.5px solid #080808!important;
  transform: translateY(-50%) rotate(45deg) !important;
  z-index: 2 !important;
  transition: left 0.45s cubic-bezier(0.65, 0, 0.076, 1) !important;
  background: none !important;
}

.elementor-413 .elementor-element.elementor-element-4999f13c:hover::after {
  border-top: 2.5px solid #FFFFFF !important;
  border-right: 2.5px solid #FFFFFF !important;
}

/* =========================================
   HOVER
========================================= */
.elementor-413 .elementor-element.elementor-element-4999f13c:hover::before {
  /* aqui se edita el ancho del circulo total*/
  width: 11rem !important;
  background: #FB600D !important;
}

.elementor-413 .elementor-element.elementor-element-4999f13c:hover .elementor-button .elementor-button-text {
  color: #FFFFFF!important;
}

.elementor-413 .elementor-element.elementor-element-4999f13c:hover::after {
  left: 1.925rem !important;
}

/* Ocultar en Tablet y Móvil */
@media (max-width: 1024px) {
  .elementor-413 .elementor-element.elementor-element-4999f13c {
    display: none !important;
  }
}/* End custom CSS */