.elementor-282 .elementor-element.elementor-element-e4ddca1{--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;}.elementor-282 .elementor-element.elementor-element-99f7436{--display:flex;}.elementor-282 .elementor-element.elementor-element-1a63fac{--display:flex;}.elementor-282 .elementor-element.elementor-element-22acbde{--display:flex;}.elementor-282 .elementor-element.elementor-element-29d6595{--display:flex;}.elementor-282 .elementor-element.elementor-element-0e6b62b{--e-n-carousel-swiper-slides-gap:10px;--e-n-carousel-slide-height:auto;--e-n-carousel-slide-container-height:100%;--e-n-carousel-arrow-prev-left-align:0%;--e-n-carousel-arrow-prev-translate-x:0px;--e-n-carousel-arrow-prev-left-position:0px;--e-n-carousel-arrow-prev-top-align:50%;--e-n-carousel-arrow-prev-translate-y:-50%;--e-n-carousel-arrow-prev-top-position:0px;--e-n-carousel-arrow-next-right-align:0%;--e-n-carousel-arrow-next-translate-x:0%;--e-n-carousel-arrow-next-right-position:0px;--e-n-carousel-arrow-next-top-align:50%;--e-n-carousel-arrow-next-translate-y:-50%;--e-n-carousel-arrow-next-top-position:0px;}.elementor-282 .elementor-element.elementor-element-ca3a647{--display:flex;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-282 .elementor-element.elementor-element-0e6b62b{--e-n-carousel-swiper-slides-to-display:2;}}@media(max-width:767px){.elementor-282 .elementor-element.elementor-element-0e6b62b{--e-n-carousel-swiper-slides-to-display:1;}}/* Start custom CSS for html, class: .elementor-element-23ec8dd *//* =========================
   Cabeçalho de seção — "Conheça nossos planos"
   ========================= */

.stegio-header {
  text-align: center;
  margin: 4rem auto 3rem;
  max-width: 800px;
  padding: 0 1rem;
}

.stegio-header h2 {
  font-family: 'Segoe UI', sans-serif;
  font-size: 2.25rem; /* ~36px */
  font-weight: 800;
  color: hsl(330, 15%, 25%); /* mesmo tom do restante do site */
  margin-bottom: 0.75rem;
  line-height: 1.2;
}

.stegio-header p {
  font-family: 'Segoe UI', sans-serif;
  font-size: 1rem;
  color: hsl(340, 20%, 40%);
  font-weight: 400;
  line-height: 1.5;
}

/* Responsivo */
@media (max-width: 767px) {
  .stegio-header {
    margin: 3rem auto 2rem;
  }

  .stegio-header h2 {
    font-size: 1.75rem;
  }

  .stegio-header p {
    font-size: 0.95rem;
  }
}/* End custom CSS */
/* Start custom CSS for nested-carousel, class: .elementor-element-0e6b62b *//* =========================
   Stegio x Lovable — CSS completo (com alturas niveladas)
   ========================= */

/* Tokens (cores e sombras) — iguais ao Lovable */
:root{
  --background: 340 40% 98%;
  --foreground: 330 15% 25%;
  --card: 0 0% 100%;
  --card-foreground: 330 15% 25%;
  --primary: 340 82% 67%;
  --primary-foreground: #fff;
  --secondary: 280 60% 75%;
  --muted: 340 30% 95%;
  --muted-foreground: 330 10% 50%;
  --accent: 320 70% 85%;
  --accent-foreground: 330 15% 25%;
  --border: 340 25% 90%;
  --input: 340 25% 90%;
  --ring: 340 82% 67%;
  --radius: 1rem;

  --gradient-primary: linear-gradient(135deg, hsl(340 82% 67%) 0%, hsl(280 60% 75%) 100%);
  --shadow-soft:   0  8px 30px -4px hsl(340 82% 67% / .15);
  --shadow-medium: 0  8px 30px -4px hsl(340 82% 67% / .25);
  --shadow-strong: 0 16px 50px -8px hsl(340 82% 67% / .25);

  /* >>> Altura mínima dos cards (desktop). Ajuste aqui se quiser. */
  --card-min-h: 880px;
}

/* --- Normaliza o wrapper do Carousel/Slides do Elementor --- */
.stegio-carousel .elementor-slide-content{ padding:0 !important; display:flex; height:auto; }
.stegio-carousel .swiper-slide{ display:flex; align-items:stretch; }
.stegio-carousel .swiper-wrapper{ align-items:stretch; }

/* =========================
   CARD
   ========================= */
.stegio-card{
  background: hsl(var(--card));
  border: 2px solid hsl(var(--border));
  border-radius: calc(var(--radius) * 1.5); /* ~ rounded-3xl */
  padding: 2rem;
  box-shadow: var(--shadow-soft);
  color: hsl(var(--card-foreground));
  position: relative;
  width: 100%;
  max-width: 36rem;
  margin: 0 auto;
  transition: box-shadow .3s ease, transform .3s ease, border-color .3s ease;

  /* equal height + botão colado embaixo */
  display:flex;
  flex-direction:column;
  min-height: var(--card-min-h);
}
.stegio-card:hover{ box-shadow: var(--shadow-strong); transform: translateY(-6px); }

/* destaque (card do meio) */
.stegio-card.is-featured{
  border-color: hsl(var(--primary));
  background: linear-gradient(180deg, #fff0f5 0%, #fff 55%);
}

/* badge "Melhor oferta" automático */
.stegio-card.is-featured::after{
  content:"Melhor oferta";
  position:absolute; left:50%; top:-12px; transform:translateX(-50%);
  font-size:.75rem; font-weight:700; color:var(--primary-foreground);
  padding:.35rem .9rem; border-radius:999px; white-space:nowrap;
  background: var(--gradient-primary);
  box-shadow: 0 4px 15px rgba(0,0,0,.12);
}

/* =========================
   IMAGEM
   ========================= */
.stegio-image{
  margin-bottom: 1.5rem;
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(0,0,0,.08);
}
.stegio-image img{
  width:100%;
  height:16rem;             /* h-64 */
  object-fit:cover;
  transition: transform .5s ease;
}
.stegio-card:hover .stegio-image img{ transform: scale(1.05); }

/* =========================
   TEXTOS
   ========================= */
.stegio-title{ font-size:1.5rem; font-weight:800; margin:.25rem 0 .35rem; }
.stegio-sub{   color:hsl(var(--muted-foreground)); font-size:.9rem; }
.stegio-desc{  color:hsl(330 10% 40%); margin:.5rem 0 .25rem; }

/* preço */
.stegio-price{
  display:flex; align-items:baseline; gap:.5rem; margin:.35rem 0 0;
}
.stegio-price .num{ font-size:2rem; font-weight:800; color:hsl(var(--primary)); }
.stegio-price .per{ color:hsl(var(--muted-foreground)); }

/* =========================
   LISTA de benefícios
   ========================= */
.stegio-list{
  list-style:none; padding:0; margin:1rem 0 1.25rem;
}
.stegio-list li{
  display:flex; gap:.75rem; align-items:flex-start;
  margin:.6rem 0; color:hsl(330 15% 30%); font-size:.95rem;
}
.stegio-check{
  width:20px; height:20px; flex:0 0 20px; margin-top:.12rem;
  display:grid; place-items:center; border-radius:999px; background:hsl(var(--accent));
}
.stegio-check svg{ width:12px; height:12px; stroke:hsl(var(--primary)); }

/* =========================
   BOTÕES (idênticos ao Lovable) + alinhados no rodapé
   ========================= */
.stegio-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  width:100%; height:2.5rem; padding:.5rem 1rem; white-space:nowrap;

  border:1px solid hsl(var(--input));
  border-radius: calc(var(--radius) - 2px);

  background:hsl(var(--background));
  color: inherit;

  font-size:.875rem; line-height:1.25rem; font-weight:500;

  transition: color .15s, background-color .15s, border-color .15s;
  text-decoration:none !important;

  /* cola o botão no rodapé do card */
  margin-top:auto;
}
.stegio-btn:hover{
  background:hsl(var(--accent));
  color:hsl(var(--accent-foreground));
}
.stegio-btn:focus-visible{
  outline:2px solid hsl(var(--ring));
  outline-offset:2px;
}

/* botão destaque (gradiente + sombra) */
.stegio-btn.is-featured{
  border:none;
  background: var(--gradient-primary);
  color: var(--primary-foreground);
  box-shadow: 0 20px 30px -12px hsl(340 82% 67% / .35);
}
.stegio-btn.is-featured:hover{ filter:brightness(.97); }

/* =========================
   RESPONSIVO
   ========================= */
@media (max-width: 1200px){
  :root{ --card-min-h: 620px; }
}
@media (max-width: 1024px){
  :root{ --card-min-h: 590px; }
}
@media (max-width: 767px){
  :root{ --card-min-h: auto; }
  .stegio-card{ min-height: auto; }  /* no mobile deixa fluir */
  .stegio-image img{ height:14rem; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-b6f1981 */.stegio-table {
  width: 100%;
  border-collapse: collapse;
  font-family: 'Segoe UI', sans-serif;
  font-size: 15px;
  color: #444;
  background-color: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(255, 105, 180, 0.15);
}

.stegio-table th,
.stegio-table td {
  padding: 16px 14px;
  text-align: center;
  border-bottom: 1px solid #f4dbe8;
}

.stegio-table th {
  background: #fff5f8;
  font-weight: 600;
}

.stegio-table th.col-feature {
  text-align: left;
  background: #fff;
  color: #444;
}

.stegio-table td:first-child {
  text-align: left;
  font-weight: 500;
  color: #555;
  background-color: #fff;
}

.stegio-table tr:nth-child(even) td {
  background-color: #fffafd;
}

.stegio-table tr:nth-child(odd) td {
  background-color: #fff;
}

.stegio-table .highlight {
  background-color: #fff0f7 !important;
  color: #c2185b;
  font-weight: 600;
}

.stegio-table .price-row td {
  font-size: 16px;
  font-weight: 700;
  color: #c2185b;
  border-top: 2px solid #f4dbe8;
}

.stegio-table td strong {
  color: #c2185b;
}

.stegio-table td {
  transition: background 0.3s ease;
}

.stegio-table td:not(:first-child) {
  min-width: 120px;
}

/* Ícones ✓ ✕ */
.stegio-table td {
  font-size: 17px;
}
.stegio-table td:contains("✓") {
  color: #c2185b;
  font-weight: 700;
}
.stegio-table td:contains("✕") {
  color: #bbb;
  font-weight: 400;
}/* End custom CSS */