.elementor-1276 .elementor-element.elementor-element-2d9ce28{--display:flex;--min-height:100vh;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-widget-icon-box.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon-box.elementor-view-framed .elementor-icon, .elementor-widget-icon-box.elementor-view-default .elementor-icon{fill:var( --e-global-color-primary );color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon-box .elementor-icon-box-title, .elementor-widget-icon-box .elementor-icon-box-title a{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-icon-box .elementor-icon-box-title{color:var( --e-global-color-primary );}.elementor-widget-icon-box:has(:hover) .elementor-icon-box-title,
					 .elementor-widget-icon-box:has(:focus) .elementor-icon-box-title{color:var( --e-global-color-primary );}.elementor-widget-icon-box .elementor-icon-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-1276 .elementor-element.elementor-element-6a04f71{width:var( --container-widget-width, 14% );max-width:14%;--container-widget-width:14%;--container-widget-flex-grow:0;}.elementor-1276 .elementor-element.elementor-element-6a04f71 > .elementor-widget-container{background-color:#FFFFFF;padding:0px 0px 0px 0px;border-radius:100px 100px 100px 100px;}.elementor-1276 .elementor-element.elementor-element-6a04f71 .elementor-icon-box-wrapper{align-items:center;text-align:center;gap:14px;}.elementor-1276 .elementor-element.elementor-element-6a04f71 .elementor-icon-box-title{margin-block-end:0px;color:#000000;}.elementor-1276 .elementor-element.elementor-element-6a04f71 .elementor-icon{font-size:60px;}.elementor-1276 .elementor-element.elementor-element-6a04f71 .elementor-icon i{transform:rotate(56deg);}.elementor-1276 .elementor-element.elementor-element-6a04f71 .elementor-icon-box-title, .elementor-1276 .elementor-element.elementor-element-6a04f71 .elementor-icon-box-title a{font-family:"Montserrat", Sans-serif;font-size:22px;font-weight:500;}@media(min-width:768px){.elementor-1276 .elementor-element.elementor-element-2d9ce28{--content-width:100vw;}}/* Start custom CSS for icon-box, class: .elementor-element-6a04f71 *//* ═══════════════════════════════════════════════════════
   BOTÃO PORTFÓLIO — versão corrigida
   Anel escuro visível + ícone com margem da borda
═══════════════════════════════════════════════════════ */

.btn-portfolio .elementor-icon-box-wrapper {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 100px !important;
  background: #FFFFFF !important;
  border: 3px solid #b0b0b0 !important;
  cursor: pointer;
  padding: 0px !important;
  display: flex !important;
  align-items: center !important;
}

/* Fundo escuro — expande da direita para a esquerda */
.btn-portfolio .elementor-icon-box-wrapper::before {
  content: '';
  position: absolute;
  right: 0; top: 0; bottom: 0;
  width: 58px;
  border-radius: 100px;
  background: #111111;
  transition: width 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
  z-index: 0;
}

.btn-portfolio .elementor-icon-box-wrapper:hover::before {
  width: 100%;
}

/* ─── Ícone ─── */
.btn-portfolio .elementor-icon-box-icon {
  position: relative;
  z-index: 2;
  flex-shrink: 0 !important;
  border-radius: 50%;
  transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1),
              box-shadow 0.3s ease;

  /* Anel escuro + fina linha de separação que aparece sobre fundo escuro */
  box-shadow:
    0 0 0 0px #111111,              /* anel escuro interno */
    0 0 0 0px rgba(255,255,255,0.18); /* separador claro — visível no hover */
}

/* No hover o separador fica um pouco mais visível */
.btn-portfolio .elementor-icon-box-wrapper:hover .elementor-icon-box-icon {
  transform: translateX(var(--icon-shift, -200px));
  box-shadow:
    0 0 0 1px #111111,
    0 0 0 1px rgba(255,255,255,0.28);
}

/* ─── Texto ─── */
.btn-portfolio .elementor-icon-box-content {
  position: relative;
  z-index: 2;
  flex: 1;
}

.btn-portfolio .elementor-icon-box-title,
.btn-portfolio .elementor-icon-box-title a {
  color: #1a1a1a !important;
  white-space: nowrap;
  transition: opacity 0.25s ease 0.05s, transform 0.35s ease;
}

.btn-portfolio .elementor-icon-box-wrapper:hover .elementor-icon-box-title,
.btn-portfolio .elementor-icon-box-wrapper:hover .elementor-icon-box-title a {
  opacity: 0 !important;
  transform: translateX(18px);
}/* End custom CSS */