.elementor-50523 .elementor-element.elementor-element-6d87d27{--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: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;}@media(min-width:768px){.elementor-50523 .elementor-element.elementor-element-6d87d27{--content-width:100%;}}/* Start custom CSS *//* =========================
   TRIFASICO LANDING — CSS
   Escopo: adicione a classe "trifasico-landing" na seção principal
   ========================= */

/* Fontes (iguais ao projeto) */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;600;700;800&display=swap");

.trifasico-landing{
  /* Tokens (baseados no CSS do projeto) */
  --bg: hsl(30 30% 98%);
  --text: hsl(20 20% 12%);
  --muted: hsl(25 10% 45%);
  --card: hsl(0 0% 100%);
  --border: hsl(20 15% 90%);

  --shadow-sm: 0 1px 2px 0 hsl(0 0% 0% / 0.05);
  --shadow: 0 1px 3px 0 hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
  --shadow-md: 0 4px 6px -1px hsl(0 0% 0% / 0.1), 0 2px 4px -2px hsl(0 0% 0% / 0.1);
  --shadow-lg: 0 10px 15px -3px hsl(0 0% 0% / 0.1), 0 4px 6px -4px hsl(0 0% 0% / 0.1);

  --radius: 16px;

  --gradient-hero: linear-gradient(135deg, hsl(24 95% 50%) 0%, hsl(30 90% 48%) 50%, hsl(38 100% 50%) 100%);
  --gradient-accent: linear-gradient(135deg, hsl(38 100% 50%) 0%, hsl(30 95% 45%) 100%);
  --gradient-card: linear-gradient(180deg, hsl(0 0% 100%) 0%, hsl(30 30% 97%) 100%);

  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
}

/* Tipografia Elementor (títulos com Plus Jakarta Sans) */
.trifasico-landing .elementor-heading-title{
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  letter-spacing: -0.02em;
}
.trifasico-landing .elementor-widget-text-editor,
.trifasico-landing .elementor-widget-text-editor p{
  color: var(--text);
}
.trifasico-landing .elementor-widget-text-editor p{
  line-height: 1.65;
}

/* Links */
.trifasico-landing a{
  color: inherit;
  text-decoration: none;
}
.trifasico-landing a:hover{
  opacity: .92;
}

/* Container “cara de landing” */
.trifasico-landing .elementor-section.elementor-section-boxed > .elementor-container{
  max-width: 1200px;
}

/* HERO: overlay leve para melhorar contraste quando tem background image */
.trifasico-landing .trifasico-hero-overlay{
  position: relative;
}
.trifasico-landing .trifasico-hero-overlay:before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(1200px 500px at 20% 10%, hsl(0 0% 100% / 0.75), transparent 60%),
              linear-gradient(180deg, hsl(30 30% 98% / 0.75), hsl(30 30% 98% / 0.95));
  pointer-events:none;
}
.trifasico-landing .trifasico-hero-overlay > *{
  position: relative;
  z-index: 1;
}

/* Texto gradiente (se você quiser aplicar via “Classe CSS” no widget de heading) */
.trifasico-landing .text-gradient{
  background: var(--gradient-hero);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Cards / Boxes — aplique classe "trifasico-card" na coluna ou container */
.trifasico-landing .trifasico-card{
  background: var(--gradient-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 22px;
}
.trifasico-landing .trifasico-card:hover{
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
  transition: box-shadow .2s ease, transform .2s ease;
}

/* Badges — classe "trifasico-badge" */
.trifasico-landing .trifasico-badge{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--border);
  background: hsl(0 0% 100% / 0.7);
  border-radius: 999px;
  padding: 8px 12px;
  box-shadow: var(--shadow-sm);
  font-weight: 600;
}

/* Botões — deixa com a “cara” do projeto */
.trifasico-landing .elementor-button{
  border-radius: 999px !important;
  padding: 14px 22px !important;
  font-weight: 700 !important;
  box-shadow: var(--shadow-md);
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.trifasico-landing .elementor-button:hover{
  transform: translateY(-1px);
  box-shadow: var(--shadow-lg);
}

/* Botão principal (classe no widget: "btn-gradient") */
.trifasico-landing .btn-gradient .elementor-button{
  background: var(--gradient-accent) !important;
  border: 0 !important;
  color: #1b1b1b !important;
}

/* Botão secundário (classe: "btn-outline") */
.trifasico-landing .btn-outline .elementor-button{
  background: transparent !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}

/* Imagens com “pop” (classe: "img-soft") */
.trifasico-landing .img-soft img{
  border-radius: calc(var(--radius) + 6px);
  box-shadow: var(--shadow-lg);
}

/* Separadores / linhas (classe: "trifasico-divider") */
.trifasico-landing .trifasico-divider{
  height: 1px;
  background: var(--border);
  width: 100%;
}

/* Pequenas animações (opcional) */
@keyframes fadeUp{
  from{ opacity:0; transform: translateY(12px); }
  to{ opacity:1; transform: translateY(0); }
}
.trifasico-landing .animate-fade-up{
  animation: fadeUp .6s ease-out both;
}

/* Responsivo */
@media (max-width: 767px){
  .trifasico-landing .trifasico-card{ padding: 18px; }
  .trifasico-landing .elementor-button{ width: 100%; justify-content: center; }
}/* End custom CSS */