.elementor-2906 .elementor-element.elementor-element-ad74713{--display:flex;--padding-top:120px;--padding-bottom:120px;--padding-left:0px;--padding-right:0px;}.elementor-2906 .elementor-element.elementor-element-1d3c56c{--display:grid;--e-con-grid-template-columns:repeat(3, 1fr);--grid-auto-flow:row;}.elementor-widget-image-box .elementor-image-box-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-widget-image-box:has(:hover) .elementor-image-box-title,
					 .elementor-widget-image-box:has(:focus) .elementor-image-box-title{color:var( --e-global-color-primary );}.elementor-widget-image-box .elementor-image-box-description{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-2906 .elementor-element.elementor-element-d8bdffa.elementor-position-right .elementor-image-box-img{margin-left:15px;}.elementor-2906 .elementor-element.elementor-element-d8bdffa.elementor-position-left .elementor-image-box-img{margin-right:15px;}.elementor-2906 .elementor-element.elementor-element-d8bdffa.elementor-position-top .elementor-image-box-img{margin-bottom:15px;}.elementor-2906 .elementor-element.elementor-element-d8bdffa .elementor-image-box-wrapper .elementor-image-box-img{width:30%;}.elementor-2906 .elementor-element.elementor-element-d8bdffa .elementor-image-box-img img{transition-duration:0.3s;}@media(min-width:2400px){.elementor-2906 .elementor-element.elementor-element-1d3c56c{--grid-auto-flow:row;}}@media(max-width:1366px){.elementor-2906 .elementor-element.elementor-element-1d3c56c{--grid-auto-flow:row;}}@media(max-width:1024px){.elementor-2906 .elementor-element.elementor-element-1d3c56c{--grid-auto-flow:row;}}@media(max-width:767px){.elementor-2906 .elementor-element.elementor-element-1d3c56c{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-2906 .elementor-element.elementor-element-d8bdffa .elementor-image-box-img{margin-bottom:15px;}}/* Start custom CSS for image-box, class: .elementor-element-d8bdffa *//* ===========================================
   BORDA EM DEGRADÊ PERSONALIZÁVEL
   =========================================== */

/* Aplique esta classe ao seu widget no Elementor */
.gradient-border {
    position: relative;
    background: #ffffff; /* Cor de fundo do conteúdo */
    padding: 30px; /* Espaçamento interno */
    border-radius: 20px; /* Arredondamento das pontas */
}

.gradient-border::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 20px; /* Mesmo valor do elemento pai */
    padding: 2px; /* Espessura da borda */
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); /* Degradê */
    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}


/* ===========================================
   VARIAÇÕES PRONTAS PARA USAR
   =========================================== */

/* Degradê Azul para Rosa */
.gradient-border.blue-pink::before {
    background: linear-gradient(135deg, #667eea 0%, #f093fb 100%);
}

/* Degradê Laranja para Roxo */
.gradient-border.orange-purple::before {
    background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
}

/* Degradê Verde para Azul */
.gradient-border.green-blue::before {
    background: linear-gradient(135deg, #30cfd0 0%, #330867 100%);
}

/* Degradê Arco-Íris */
.gradient-border.rainbow::before {
    background: linear-gradient(135deg, #ff0000 0%, #ff7f00 20%, #ffff00 40%, #00ff00 60%, #0000ff 80%, #8b00ff 100%);
}

/* Borda mais grossa */
.gradient-border.thick::before {
    padding: 5px;
}

/* Borda mais fina */
.gradient-border.thin::before {
    padding: 1px;
}

/* Cantos super arredondados */
.gradient-border.rounded {
    border-radius: 40px;
}

.gradient-border.rounded::before {
    border-radius: 40px;
}

/* Cantos levemente arredondados */
.gradient-border.soft-rounded {
    border-radius: 10px;
}

.gradient-border.soft-rounded::before {
    border-radius: 10px;
}

/* Sem arredondamento */
.gradient-border.sharp {
    border-radius: 0;
}

.gradient-border.sharp::before {
    border-radius: 0;
}


/* ===========================================
   COMO USAR NO ELEMENTOR
   ===========================================
   
   1. Vá até o widget que deseja aplicar a borda
   2. Na aba "Avançado" > "CSS Classes"
   3. Adicione: gradient-border
   4. Para personalizar, adicione classes extras:
      - gradient-border blue-pink
      - gradient-border thick rounded
      - gradient-border thin rainbow
   
   5. Para adicionar este CSS no Elementor:
      - Vá em Elementor > Custom CSS (no painel de edição)
      - Ou adicione em: Aparência > Personalizar > CSS Adicional
   
   =========================================== *//* End custom CSS */