:root{
  --brand-red: #cf0505;
  --brand-red-2: #e70909;
  --brand-black: #0b0b0b;
  --shadow-1: 0 6px 18px rgba(0,0,0,.10);
  --shadow-2: 0 12px 30px rgba(0,0,0,.25);
  --shadow-3: 0 16px 40px rgba(0,0,0,.25);

  /* z-index seguro */
  --z-header: 9999;
  --z-sticky: 99999;
  --z-fab: 9990;
  --z-vlibras: 9999999;
}

/* =========================
   FOOTER ATTENDANCE
   ========================= */
.footer-attendance-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.portal-btn-top {
    height: 36px;
    padding: 0 14px;
    font-size: 13px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #ff0000;
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    line-height: 1;
}
.portal-btn-top:hover {
    height: 36px;
    padding: 0 14px;
    font-size: 13px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #ff0000;
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    line-height: 1;
}
.portal-btn-top i {
    font-size: 13px;
}

.attendance-box{
  background: #fff;
  border: 2px solid var(--brand-red-2);
  border-radius: 12px;
  height: 110px;
  padding: 10px 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-shadow: var(--shadow-1);
  transition: transform .2s ease;
  text-align: center;
}

.attendance-box i{ font-size: 26px; margin-bottom: 6px; }
.attendance-box strong{ font-size: 14px; font-weight: 600; color: #111; line-height: 1.2; }
.attendance-box span{ font-size: 12px; color: #777; line-height: 1.2; }

.attendance-box:hover{ transform: translateY(-3px); }

.attendance-box.whatsapp i{ color: #25D366; }
.attendance-box.phone i{ color: #3b82f6; }
.attendance-box.instagram i{ color: #E1306C; }

.footer-v2 .widgets-sections .widget-newsletter form input{
  width: 100%;
  height: 64px;
  border-radius: 30px;
  padding: 0 38px;
  color: #666;
  font-size: 16px;
  border: 2px solid var(--brand-red-2);
}

.footer-v2 .footer-bottom{
  background-color: #000;
  padding: 21px 0;
}

/* =========================
   IMAGE RADIUS
   ========================= */
.image-column .image{
  border-radius: 20px !important;
  overflow: hidden;
}


/* =========================
   PAGINA NORMAIS (BG PRESO NA SECTION)
   ========================= */
.pagina-seciton{
  position: relative !important;
  z-index: 1 !important;
  padding: 40px 0 70px !important;
  margin: 0 !important;
  overflow: hidden;
}

.pagina-seciton .auto-container{
  position: relative !important;
  z-index: 2 !important;
}

/* =========================
   PRICE SECTION (BG PRESO NA SECTION)
   ========================= */
.price-seciton{
  position: relative !important;
  z-index: 1 !important;
  padding: 40px 0 70px !important;
  margin: 0 !important;
  overflow: hidden;
}
.custom-plan-wrap {
  margin-bottom: 120px;
}


.price-seciton .auto-container{
  position: relative !important;
  z-index: 2 !important;
}

.price-seciton .bg,
.price-seciton .bg-pattern-v2,
.price-seciton .bg-pattern{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

/* evita "faixa branca gigante" */
.price-seciton{
  padding-bottom: 120px !important;
}

/* reduz espaço do título */
.page-title{ padding: 30px 0 10px !important; }

.price-seciton .sec-title-v3{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.slick-dots{ display: none !important; }

.h2new, .h3new{
  color: #fff;
  font-family: var(--title-font);
  letter-spacing: -0.04em;
}

.sec-title-v3 .sub-titlenew{
  font-size: 16px;
  color: #fff;
  font-weight: 600;
  letter-spacing: 2.4px;
  display: inline-block;
  text-transform: uppercase;
}

/* =========================
   PLAN LIST (ICONE + TEXTO)
   ========================= */
section.price-seciton .plan-price .plan-list ul{
  padding: 0 !important;
  margin: 0 !important;
}

section.price-seciton .plan-price .plan-list ul li{
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 14px 0 !important;
  padding: 0 !important;

  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;

  position: relative !important;
  padding-left: 0 !important;
}

section.price-seciton .plan-price .plan-list ul li::before,
section.price-seciton .plan-price .plan-list ul li::after{
  content: none !important;
  display: none !important;
}

section.price-seciton .plan-price .plan-list ul li > i{
  width: 28px !important;
  min-width: 28px !important;
  font-size: 24px !important;
  line-height: 1 !important;
  text-align: center !important;
  margin: 0 !important;
  position: static !important;
  transform: none !important;
  float: none !important;
  color: var(--brand-red) !important;
}

section.price-seciton .plan-price .plan-list ul li > span.plan-text{
  display: inline-block !important;
}

section.price-seciton .plan-price .plan-list ul li > span.plan-text strong{
  white-space: nowrap !important;
}

section.price-seciton .plan-price .plan-list ul li > img.plan-icon-img{
  width: 32px;
  height: 32px;
  object-fit: cover;
  border-radius: 6px;
  background: #fff;
  padding: 2px;
  flex: 0 0 28px;
  margin-right: 8px;
}

/* =========================
   FILTER (SELECT)
   ========================= */
.plan-filter{
  max-width: 560px;
  margin: 18px auto 0;
}

.plan-filter-label{ color: #fff; }

.plan-filter-select{
  width: 100%;
  height: 70px;
  padding: 0 60px 0 22px;
  font-family: var(--text-font2);
  border: 2px solid var(--brand-red);
  border-radius: 18px;

  background: var(--brand-black);
  color: #fff;
  font-size: 18px;
  font-weight: 700;

  cursor: pointer;
  outline: none;

  -webkit-appearance: none;
  appearance: none;

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath fill='%23cf0505' d='M7 10l5 5l5-5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 22px center;
  background-size: 18px;
}

.plan-filter-select:hover{
  box-shadow: 0 14px 34px rgba(0,0,0,.35);
  transform: translateY(-2px);
  transition: .2s ease;
}

.plan-filter-select:focus{
  box-shadow: 0 0 0 3px rgba(207,5,5,.35);
}

.plan-filter-select option{
  background: var(--brand-black);
  color: #fff;
  font-weight: 600;
}

.plan-filter-select option:hover,
.plan-filter-select option:focus,
.plan-filter-select option:checked{
  background: var(--brand-red) !important;
  color: #fff !important;
}

/* =========================
   PARTNERS / LOGOS – HOVER
   ========================= */
.partners-section .image-box{
  border-radius: 16px;
  padding: 10px;
  transition: all .3s ease;
}

.partners-section .image-box .image{
  overflow: hidden;
  border-radius: 14px;
}

.partners-section .image-box img{
  width: 100%;
  height: auto;
  transition: transform .35s ease, filter .35s ease;
  filter: grayscale(100%) brightness(0.9);
}

.partners-section .image-box:hover{
  box-shadow: var(--shadow-2);
  border: 2px solid var(--brand-red);
  background: #fff;
}

.partners-section .image-box:hover img{
  transform: scale(1.08);
  filter: grayscale(0%) brightness(1);
}

/* =========================
   HEADER / Z-INDEX
   ========================= */
.main-header{
  position: relative;
  z-index: var(--z-header) !important;
}

.sticky-header{
  z-index: var(--z-sticky) !important;
}

footer.footer-v2{
  position: relative !important;
  z-index: 1 !important;
  clear: both !important;
  width: 100%;
}

.monteseuplano-btn {
	display: inline-block;
	font-size: 16px;
	font-weight: 700;
	border-radius: 10px;

	background: #cf0505;
	color: #ffffff;

	padding: 13px 52px;
	text-transform: uppercase;
	line-height: 35px;
	height: 60px;

	transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}

.monteseuplano-btn:hover {
	background: #000000;
	color: #ffffff;
	box-shadow: 0 10px 24px rgba(0, 0, 0, .35);
}

/* =========================
   DESKTOP: HAMBURGER IGUAL MOBILE (SEM DUPLICAR)
   - mostra apenas no outer-box
   ========================= */
@media (min-width: 992px){

  /* some do lugar errado */
  .main-header .nav-outer .mobile-nav-toggler{
    display: none !important;
  }

  /* aparece só ao lado do botão/outer-box */
  .main-header .outer-box .mobile-nav-toggler{
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #f2f2f2;
    margin-left: 12px;
  }

  /* mata duplicado no sticky */
  .sticky-header .mobile-nav-toggler{
    display: none !important;
  }

  /* desenha as 3 linhas usando apenas o 1º span */
  .main-header .outer-box .mobile-nav-toggler span + span{
    display: none !important;
  }

  .main-header .outer-box .mobile-nav-toggler span{
    display: block !important;
    width: 24px;
    height: 2px;
    background: #111;
    position: relative;
    border-radius: 2px;
  }

  .main-header .outer-box .mobile-nav-toggler span::before,
  .main-header .outer-box .mobile-nav-toggler span::after{
    content: "";
    position: absolute;
    left: 0;
    width: 24px;
    height: 2px;
    background: #111;
    border-radius: 2px;
  }
  .main-header .outer-box .mobile-nav-toggler span::before{ top: -7px; }
  .main-header .outer-box .mobile-nav-toggler span::after{  top:  7px; }
}

/* =========================
   MONTE SEU PLANO (HOVER COM BASE VERMELHA)
   ========================= */
.custom-plan-wrap{
  position: relative;
  z-index: 3;
  margin-top: 60px;
}

.custom-plan-card{
  background: #fff !important;
  border-radius: 20px;
  padding: 28px 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  border: 2px solid var(--brand-red);
  transition: transform .25s ease, box-shadow .25s ease;
  position: relative !important;
  overflow: visible !important;
  color: #111 !important;
}

.custom-plan-card .custom-plan-content p{ color: #444 !important; }

.custom-plan-card::after{
  content:"";
  position:absolute;
  left: 10px;
  right: 10px;
  bottom: -14px;
  height: 14px;
  background: var(--brand-red);
  border-radius: 0 0 18px 18px;
  opacity: 0;
  transform: translateY(6px);
  transition: .25s ease;
  z-index: -1;
}

.custom-plan-wrap:hover .custom-plan-card{
  transform: translateY(-6px);
  box-shadow: 0 16px 32px rgba(0,0,0,.22);
}

.custom-plan-wrap:hover .custom-plan-card::after{
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 768px){
  .custom-plan-card{
    flex-direction: column;
    text-align: center;
  }
}

/* =========================
   FLOATING ACTIONS (WHATS + CHAT)
   - sem z-index absurdo (pra não quebrar o menu)
   - VLibras sempre acima
   ========================= */
.fab-stack{
  position: fixed;
  right: 18px;
  bottom: 90px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  z-index: var(--z-fab);
}

.fab{
  position: relative;
  border: 0;
  outline: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 999px;
 
  text-decoration: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.fab .fab-icon{
  display: inline-flex;
  width: 58px;
  height: 58px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: #fff;
  font-size: 26px;
}

.fab-badge{
  position: absolute;
  top: -6px;
  right: -6px;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #e11d48;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 14px rgba(0,0,0,.25);
}

.fab-label{
  position: absolute;
  right: 70px;
  top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
  padding: 10px 14px;
  border-radius: 12px;
  font-weight: 700;
  font-size: 13px;
  line-height: 1.15;
  color: #fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}

@media (hover:hover){
  .fab:hover .fab-label{
    opacity: 1;
    transform: translateY(-50%) translateX(-4px);
  }
}

.fab-wa .fab-icon{ background: #22c55e; }
.fab-wa .fab-label{ background: #22c55e; }

.fab-chat .fab-icon{ background: #ff1a1a; }
.fab-chat .fab-label{ background: #ff1a1a; }

/* CHAT PANEL */
.chat-panel{
  position: fixed;
  right: 18px;
  bottom: 160px;
  width: 320px;
  max-width: calc(100vw - 36px);
  background: #fff;
  border-radius: 16px;
  box-shadow: var(--shadow-3);
  overflow: hidden;
  z-index: var(--z-fab);

  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
}

.chat-panel.is-open{
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.chat-panel-head{
  background: #ff1a1a;
  color: #fff;
  padding: 14px 16px;
}

.chat-panel-title{
  font-weight: 800;
  font-size: 16px;
}

.chat-panel-body{
  padding: 14px 14px 18px;
}

.chat-item{
  display: flex;
  gap: 12px;
  align-items: flex-start;
  text-decoration: none;
  color: #111;
  padding: 10px 8px;
  border-radius: 12px;
}

.chat-item:hover{ background: rgba(0,0,0,.04); }

.chat-item-ico {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ff1a1a;
    background: rgb(0 0 0);
    font-size: 16px;
}
.chat-item-text strong{
  display: block;
  font-size: 14px;
  font-weight: 800;
  margin-bottom: 2px;
}

.chat-item-text span{
  display: block;
  font-size: 13px;
  color: #444;
}

.chat-sep{
  height: 1px;
  background: rgba(0,0,0,.10);
  margin: 6px 4px;
}

.chat-panel-close{
  position: absolute;
  right: 10px;
  bottom: 10px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 0;
  background: #101010;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}

/* MOBILE ajustes */
@media (max-width: 768px){
  .fab-stack{ right: 14px; bottom: 84px; }
  .chat-panel{ right: 14px; bottom: 150px; }
}

/* =========================
   VLibras SEMPRE ACIMA
   ========================= */
[vw],
.vlibras-widget,
.vlibras-widget *{
  z-index: var(--z-vlibras) !important;
}
/* VLibras: posição fixa e sempre no mesmo lugar */
div[vw].enabled{
  left: auto !important;
  right: 0px !important;
  top: 36% !important;
  bottom: auto !important;
  transform: translateY(calc(-50% - 10px)) !important;
}

/* garante que o botão não some e fica clicável */
div[vw]{
  z-index: 9999999 !important;
  pointer-events: auto !important;
}

/* ============================
   BENCHMARK / INNER HERO
   ============================ */
.inner-hero{
  position: relative;
  padding: 110px 0 85px;
  background: url('/legado/images/background/inner-bg.jpg') center center / cover no-repeat;
  overflow: hidden;
}

.inner-hero-overlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,0,0,.86), rgba(0,0,0,.72));
  z-index: 1;
}

.inner-hero-content{
  position: relative;
  z-index: 2;
  color: #fff;
}

.inner-hero .breadcrumb{
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #cf0505;
  margin-bottom: 10px;
}

.inner-hero .breadcrumb a{
  color: #cf0505;
  text-decoration: none;
}

.inner-hero .breadcrumb span{
  margin: 0 6px;
 color: rgb(245 0 0 / 75%);
}

.inner-hero h1{
  font-size: 56px;
  font-weight: 900;
  letter-spacing: -1px;
  margin: 0 0 8px;
  color: #ffff;
}

.inner-hero-sub{
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: rgba(255,255,255,.85);
}

@media (max-width: 768px){
  .inner-hero{ padding: 85px 0 65px; }
  .inner-hero h1{ font-size: 34px; }
  .inner-hero-sub{ font-size: 15px; }
}
.plan-customizer{ padding: 80px 0; }
.pc-head{ margin-bottom: 22px; }
.pc-title{ color:#fff; font-weight: 900; font-size: 46px; line-height: 1.05; }
.pc-sub{ color: rgba(255,255,255,.72); margin-top: 10px; }

.pc-progress{ max-width: 1180px; margin: 0 auto 26px; }
.pc-progress-top{ display:flex; justify-content:space-between; color: rgba(255,255,255,.75); font-size: 13px; }
.pc-bar{ height: 6px; background: rgba(255,255,255,.18); border-radius: 99px; overflow:hidden; margin-top: 10px; }
#pc-bar-fill{ display:block; height:100%; width:33%; background:#cf0505; border-radius:99px; transition:.25s; }

.pc-grid{ display:grid; grid-template-columns: 1fr 380px; gap: 24px; align-items:start; }
@media (max-width: 992px){ .pc-grid{ grid-template-columns: 1fr; } }

.pc-card{
  background: rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 14px 40px rgba(0,0,0,.25);
}
.pc-card h3{ color:#fff; font-weight: 900; margin-bottom: 14px; }
.pc-muted{ color: rgba(255,255,255,.6); }

.is-hidden{ display:none !important; }

.pc-choice{
  width: 260px;
  text-align:left;
  background: rgba(0,0,0,.35);
  border: 2px solid rgba(255,255,255,.14);
  border-radius: 16px;
  padding: 16px;
  color:#fff;
  cursor:pointer;
}
.pc-choice.is-active{ border-color:#cf0505; box-shadow: 0 0 0 4px rgba(207,5,5,.15); }
.pc-choice-title{ font-weight: 900; font-size: 18px; }
.pc-choice-sub{ color: rgba(255,255,255,.65); margin-top: 4px; font-size: 13px; }
.pc-pill{ display:inline-block; margin-top: 10px; background:#cf0505; padding: 6px 10px; border-radius: 999px; font-weight: 900; font-size: 12px; }

.pc-actions{ display:flex; justify-content:space-between; margin-top: 18px; gap: 10px; }
.pc-btn{
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.25);
  color:#fff;
  border-radius: 12px;
  padding: 12px 18px;
  font-weight: 900;
}
.pc-btn-primary{ background:#cf0505; border-color:#cf0505; }
.pc-btn[disabled]{ opacity:.45; cursor:not-allowed; }

.pc-plans{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
@media (max-width: 992px){ .pc-plans{ grid-template-columns: 1fr; } }

.pc-plan{
  text-align:left;
  border-radius: 16px;
  padding: 16px;
  background: rgba(0,0,0,.35);
  border: 2px solid rgba(255,255,255,.12);
  cursor:pointer;
  color:#fff;
}
.pc-plan.is-active{ border-color:#cf0505; box-shadow: 0 0 0 4px rgba(207,5,5,.15); }
.pc-plan-top{ display:flex; justify-content:space-between; gap: 10px; align-items:center; }
.pc-plan-name{ font-weight: 900; }
.pc-plan-price{ font-weight: 900; }
.pc-plan-meta{ margin-top: 10px; display:grid; gap: 6px; color: rgba(255,255,255,.72); font-size: 13px; }
.pc-apps{ margin-top: 12px; display:flex; gap: 8px; flex-wrap:wrap; }
.pc-app-ico{ width: 34px; height:34px; border-radius: 10px; object-fit:cover; background:#fff; padding: 3px; }

.pc-plan-price-bottom{
  margin-top: 12px;
  display:inline-block;
  background:#cf0505;
  padding: 8px 12px;
  border-radius: 999px;
  font-weight: 900;
}

.pc-summary{
  position: sticky;
  top: 120px;
  background: rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  padding: 18px;
}
.pc-summary h3{ color:#fff; font-weight: 900; margin-bottom: 12px; }
.pc-sum-line{ display:flex; justify-content:space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.08); color: rgba(255,255,255,.7); }
.pc-sum-line strong{ color:#fff; }

.pc-extras{ display:grid; gap: 10px; }
.pc-extra{ display:block; }
.pc-extra input{ display:none; }
.pc-extra-ui{
  display:flex; align-items:center; justify-content:space-between; gap: 10px;
  padding: 12px; border-radius: 14px;
  border: 2px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.35);
  color:#fff;
}
.pc-extra-ui img{ width: 34px; height:34px; border-radius: 10px; background:#fff; padding:3px; object-fit:cover; }
.pc-extra input:checked + .pc-extra-ui{ border-color:#cf0505; box-shadow: 0 0 0 4px rgba(207,5,5,.15); }

/* ===== INNER HERO ===== */
.inner-hero{
  position: relative;
  padding: 90px 0 55px;
  background: #0b0b0b;
  overflow: hidden;
}
.inner-hero-overlay{
  position:absolute; inset:0;
   background: url('/legado/images/background/banner-menu.png') center center;
}
.inner-hero-content{ position:relative; z-index:1; color:#fff; }
.inner-hero .breadcrumb{ opacity:.85; margin-bottom:10px; }
.inner-hero .breadcrumb a{ color:#fff; }
.inner-hero .inner-hero-sub{ opacity:.9; margin-top:6px; color: #fff; }

/* ===== BUILDER ===== */
.plan-builder{
  padding: 80px 0;

}
.builder-header h2{ color:#fff; font-size: 44px; margin-bottom: 8px; }
.builder-header p{ color: rgba(255,255,255,.75); }

.builder-grid{
  margin-top: 32px;
  display: grid;
  grid-template-columns: 1.55fr .9fr;
  gap: 24px;
  align-items: start;
}

.builder-left, .builder-summary {
    background: rgb(4 4 4);
    border: 1px solid rgb(249 19 19);
    border-radius: 20px;
    padding: 22px;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .45);
}

.builder-left h4, .builder-summary h4{ color:#fff; margin-bottom: 14px; }

/* cards planos */
.builder-cards{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
}
.builder-card{
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.25);
  border-radius: 16px;
  padding: 14px;
  cursor:pointer;
  text-align:left;
  color:#fff;
  transition:.2s ease;
}
.builder-card:hover{ transform: translateY(-2px); border-color: rgba(207,5,5,.55); }
.builder-card.active{
  border: 2px solid #cf0505;
  box-shadow: 0 0 0 3px rgba(207,5,5,.18);
}
.builder-speed{ font-size: 26px; font-weight: 900; }
.builder-price{ opacity:.9; font-weight:700; margin-top: 4px; }
.builder-card-actions{ margin-top: 10px; }
.builder-btn{
  display:inline-flex; justify-content:center; align-items:center;
  width:100%; height: 44px;
  border-radius: 12px;
  background:#cf0505;
  font-weight:800;
}

/* apps */
.builder-section{ margin-top: 18px; }
.apps-grid{
  display:grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 12px;
}
.app-card{
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.25);
  border-radius: 16px;
  padding: 12px;
  color:#fff;
}
.app-card.extra{ cursor:pointer; text-align:left; }
.app-card.extra:hover{ border-color: rgba(207,5,5,.55); }
.app-card.extra.is-selected{
  border: 2px solid #cf0505;
  box-shadow: 0 0 0 3px rgba(207,5,5,.15);
}
.app-ico{
  width: 46px; height: 46px;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
}
.app-ico img{ width:100%; height:100%; object-fit: cover; }
.app-name{ margin-top: 10px; font-weight: 800; font-size: 13px; }
.app-tag{ margin-top: 6px; font-size: 12px; opacity:.85; }
.app-action{ margin-top: 8px; font-size: 12px; opacity:.9; }

.apps-loading, .apps-empty{ color: rgba(255,255,255,.7); padding: 10px; }

/* resumo */
.summary-box{
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 14px;
  color:#fff;
}
.summary-line{ display:flex; justify-content:space-between; gap:10px; opacity:.95; margin: 10px 0; }
.summary-divider{ height:1px; background: rgba(255,255,255,.10); margin: 12px 0; }
.summary-list .sum-item{ display:flex; justify-content:space-between; gap:8px; font-size: 13px; opacity:.9; padding: 4px 0; }
.summary-total{ display:flex; justify-content:space-between; align-items:center; margin-top: 10px; }
.summary-total strong{ font-size: 18px; color: #fff;}

.builder-submit{
  width: 100%;
  height: 52px;
  margin-top: 14px;
  border: 0;
  border-radius: 14px;
  background: #cf0505;
  color:#fff;
  font-weight: 900;
  cursor: pointer;
}
.builder-submit:disabled{
  opacity:.5;
  cursor:not-allowed;
}

@media (max-width: 992px){
  .builder-grid{ grid-template-columns: 1fr; }
  .builder-cards{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .apps-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
/* =========================================
   FIX: aproximar configurador do bloco de planos
   ========================================= */

/* reduz o espaço do fim do bloco de cards */
.price-seciton{
  padding-bottom: 10px !important;
  margin-bottom: 0 !important;
}

/* se existir alguma “faixa” ou espaçador do tema logo depois */
.price-seciton + section{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* puxa o configurador pra cima */
.plan-builder{
  padding-top: 10px !important;  /* estava grande */
  margin-top: -80px !important;  /* sobe mesmo */
}

/* garante que o container do configurador não ganhe margem extra */
.plan-builder .auto-container{
  margin-top: 0 !important;
}

/* se seu tema coloca espaço no main */
main.site-content{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* ===== MODAL CHECKOUT ===== */
.f1modal{ position: fixed; inset: 0; z-index: 99999; display:none; }
.f1modal.is-open{ display:block; }

.f1modal-backdrop{
  position:absolute; inset:0;
  background: rgba(0,0,0,.65);
  backdrop-filter: blur(2px);
}

.f1modal-dialog{
  position: relative;
  width: min(520px, calc(100vw - 26px));
  margin: 10vh auto 0;
  background: #0b0b0b;
  border: 1px solid rgb(255 0 0 / 93%);
  border-radius: 18px;
  box-shadow: 0 18px 55px rgba(0,0,0,.55);
  padding: 18px;
  color: #fff;
}

.h3modalpreco{
    color: #fff;
    font-family: var(--title-font);
    position: relative;
    line-height: var(--line-height-heading-);
    letter-spacing: -0.04em;
}
.layout2 p {
    color: #fff;
}

.f1modal-x{
  position:absolute; right: 12px; top: 10px;
  width: 38px; height: 38px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  color:#fff;
  font-size: 22px;
  cursor:pointer;
}

.f1modal-title{ margin: 4px 0 6px; font-weight: 900; }
.f1modal-sub{ margin: 0 0 14px; color: rgba(255,255,255,.72); }

.f1modal-label{ display:block; margin: 10px 0 6px; font-weight: 800; font-size: 13px; }
.f1modal-input{
  width: 100%;
  height: 52px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.35);
  color:#fff;
  padding: 0 14px;
  outline: none;
}
.f1modal-input:focus{ border-color: rgba(207,5,5,.8); box-shadow: 0 0 0 3px rgba(207,5,5,.18); }

.f1modal-actions{
  display:flex; gap: 10px;
  margin-top: 14px;
}
.f1modal-btn{
  flex: 1;
  height: 48px;
  border-radius: 14px;
  font-weight: 900;
  cursor:pointer;
  border: 1px solid rgba(255,255,255,.14);
}
.f1modal-btn.ghost{ background: rgba(255,255,255,.06); color:#fff; }
.f1modal-btn.primary{ background:#cf0505; border-color:#cf0505; color:#fff; }

.f1modal-hint{
  margin-top: 10px;
  font-size: 13px;
  color: rgba(255,255,255,.75);
}
.f1modal-hint.is-error{ color: #ffb4b4; }

section.error-section {
    background-color: #fbf8f3;
}
.error-section {
    background-color: #fbf8f3;
    min-height: 80vh;
    display: flex;
    align-items: center;
}

.error-actions {
    display: flex;
    gap: 15px;
    justify-content: flex-start;
}

.btn-back {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 2px solid #000000;
    color: #ff0909;
    transition: all 0.3s ease;
}

.btn-home {
    display: inline-flex;
    align-items: center;
    background-color: #2c3e50;
    color: #fff;
    padding: 12px 35px;
    border-radius: 50px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.3s ease;
}

/* Hovers e Mobile */
.btn-home:hover { 
    background-color: #cf0505 !important; 
    color: #fff !important; 
    text-decoration: none;
}

.btn-back:hover { 
    background-color: #2c3e50 !important; 
    color: #fff !important; 
}

@media (max-width: 768px) {
    .error-section .col-md-6 { margin-bottom: 40px; }
    .error-section .error-actions { justify-content: center !important; }
    .error-section { text-align: center; }
}

/* Container principal */
.modalcallback {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    z-index: 9999;
    align-items: center; /* Centraliza vertical */
    justify-content: center; /* Centraliza horizontal */
}

.modalcallback.active { display: flex; }

/* Fundo escuro atrás */
.modalcallback-backdrop {
    position: absolute;
    width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.8);
}

/* A CAIXA DO MODAL - Ajuste de tamanho aqui */
.modalcallback-dialog {
    position: relative;
    background: #0a0a0a; /* Preto da print */
    border: 1px solid #ff0000; /* Borda vermelha fina */
    border-radius: 20px;
    width: 90%;
    max-width: 420px; /* Tamanho ideal para formulário curto */
    padding: 30px;
    color: #ffffff;
    box-shadow: 0 0 30px rgba(255, 0, 0, 0.1);
}

/* Títulos */
.modalcallback-title { font-weight: 800; font-size : 24px; margin: 0;  color: #ffff;}
.modalcallback-sub { color: #ffff; font-size: 14px; margin-top: 5px; margin-bottom: 25px; }

/* Botão de Fechar (X) */
.modalcallback-x {
    position: absolute;
    top: 15px; right: 15px;
    background: #333;
    border: none;
    color: #fff;
    width: 35px; height: 35px;
    border-radius: 50%;
    cursor: pointer;
}

/* Inputs e Labels */
.modalcallback-label { display: block; font-weight: 700; margin-bottom: 8px; font-size: 13px; }
.modalcallback-input {
    width: 100%;
    background: #111;
    border: 1px solid #333;
    padding: 12px 15px;
    border-radius: 10px;
    color: #fff;
    margin-bottom: 20px;
}

/* Botões de Ação */
.modalcallback-actions { display: flex; gap: 10px; }
.modalcallback-btn {
    flex: 1;
    padding: 12px;
    border-radius: 10px;
    border: none;
    font-weight: 700;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center; gap: 8px;
}

.btn-cancel { background: #1a1a1a; color: #fff; border: 1px solid #333; }
.btn-call { background: #cc0000; color: #fff; } /* Vermelho F1 */


/* Container onde os balões vão aparecer */
.toast-stack {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 99999; /* Garante que fique acima de tudo */
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Estilo individual do balão */
.pabx-toast {
    min-width: 280px;
    padding: 15px 20px;
    border-radius: 8px;
    color: white;
    font-family: sans-serif;
    font-size: 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    transform: translateX(120%);
    transition: all 0.4s ease;
}

.pabx-toast.show { transform: translateX(0); }
.pabx-toast.success { background-color: #198754; border-left: 5px solid #0f5132; }
.pabx-toast.error { background-color: #dc3545; border-left: 5px solid #842029; }

.pabx-toast .close-btn {
    margin-left: 15px;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
}
   .card-f1 {
         background: #fff;
         padding: 40px;
         border-radius: 20px;
         box-shadow: 0 10px 30px rgba(0,0,0,0.05);
         height: 100%;
         border-top: 6px solid #e31e24;
         position: relative;
      }
      .icon-main { font-size: 40px; color: #e31e24; margin-bottom: 15px; display: block; }
      
      /* Timeline em blocos conforme a foto */
      .historia-bloco {
         display: flex;
         align-items: center;
         background: #f4f4f4;
         padding: 15px;
         margin-bottom: 12px;
         border-radius: 8px;
      }
      .ano-badge {
         background: #e31e24;
         color: #fff;
         font-weight: 800;
         padding: 5px 12px;
         border-radius: 5px;
         margin-right: 15px;
         min-width: 65px;
         text-align: center;
      }
      .ano-badge.hoje { background: #1a1a1a; }

      /* Box Propósito conforme a foto */
      .box-proposito {
         border: 1px solid #e31e24;
         background: #fff5f5;
         padding: 20px;
         border-radius: 12px;
         margin-top: 25px;
      }
      .proposito-header {
         color: #e31e24;
         font-weight: 800;
         display: flex;
         align-items: center;
         margin-bottom: 8px;
         font-size: 1.1rem;
      }
      .highlight-red { color: #e31e24; font-weight: 700; }
 /* Torna o botão do Chatmix invisível mas funcional para o script */
#chatmix-launcher,
.chatmix-widget-button,
iframe[title="chatmix-widget-launcher"] {
   opacity: 0 !important;
   pointer-events: none !important;
   position: fixed !important;
   width: 1px !important;
   height: 1px !important;
   bottom: 0 !important;
   right: 0 !important;
   overflow: hidden !important;
}

/* Garante que o formulário de Atendimento apareça por cima de tudo */
#chatmix-widget-container, 
.chatmix-widget-container,
iframe[name="chatmix-widget"] {
   z-index: 999999 !important;
   visibility: visible !important;
   display: block !important;
}

#chatHeader {
    background: #000;
    color: #ffffff !important;
    font-family: 'Arial', sans-serif;
    padding: 12px 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

/* Quando o modal estiver fechado, ele não pode ocupar espaço nenhum */
#customChatModal[style*="display: none"] {
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* cor só dos H5 dentro dos cards do builder */
#planCards .builder-card h5.h5ctsm{
  color: #fb0d0d !important;
}

    /* Configuração da Seção */
    .tv-premium-section {
        background: #000;
        color: #fff;
        padding: 80px 0;
        min-height: 80vh;
        display: flex;
        align-items: center;
    }

    .tv-title { font-size: 56px; font-weight: 900; line-height: 1; margin-bottom: 20px; }
    .tv-badge { background: #ff0909; padding: 5px 15px; border-radius: 4px; font-size: 12px; font-weight: bold; }
    .region-highlight { color: #ff0909; text-transform: uppercase; }
    .tv-description { font-size: 18px; color: #ccc; margin: 25px 0; }

    /* Efeito de Brilho na TV */
    .tv-glow-container { position: relative; }
    .tv-glow-container::after {
        content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
        width: 70%; height: 50%; background: #ff0909; filter: blur(100px); opacity: 0.4; z-index: 1;
    }
    .tv-mockup-img { position: relative; z-index: 2; max-width: 100%; height: auto; }

    /* Botão Customizado */
    .btn-premium-tv {
        background: #ff0909; color: #fff; border: none; padding: 18px 35px;
        border-radius: 50px; font-weight: bold; font-size: 16px; transition: 0.3s;
        box-shadow: 0 10px 20px rgba(255, 9, 9, 0.3);
    }
    .btn-premium-tv:hover { transform: scale(1.05); background: #d80808; }

    /* Modal - ESSENCIAL PARA FUNCIONAR */
    .custom-modal-f1 {
        display: none; position: fixed; z-index: 9999; left: 0; top: 0;
        width: 100%; height: 100%; background: rgba(0,0,0,0.9);
        align-items: center; justify-content: center;
    }
    .custom-modal-f1.active { display: flex; }
    .modal-content-f1 {
        background: #fff; color: #333; padding: 40px; border-radius: 20px;
        width: 90%; max-width: 450px; text-align: center;
    }
    .f1-input-group { margin-bottom: 20px; text-align: left; }
    .f1-input-group label { display: block; font-weight: bold; margin-bottom: 8px; }
    .f1-input-group input { 
        width: 100%; padding: 15px; border: 1px solid #ddd; border-radius: 10px; 
    }
    .btn-send-tv {
        width: 100%; background: #000; color: #fff; border: none;
        padding: 15px; border-radius: 10px; font-weight: bold; cursor: pointer;
    }
   .btn-corp:hover {
        transform: translateY(-3px);
        filter: brightness(0.9);
        color: #fff;
    }
.swal-border {
    border-radius: 16px !important;
    border: 1px solid rgb(229 15 15 / 70%);
    backdrop-filter: blur(8px);
}

.swal-text {
    font-size: 14px;
    opacity: 0.
}