/* ==========================================================
   CLOUDPELIZZON PORTAL DO CLIENTE
   V17 - THEME PARITY
   O TEMA ALTERA SOMENTE CORES.
   GEOMETRIA E LAYOUT SÃO ÚNICOS.
   ========================================================== */


/* ==========================================================
   PALETA - DARK
   ========================================================== */

html[data-theme="dark"]{

  --cp17-page:
    #02070d;

  --cp17-sidebar:
    #06131d;

  --cp17-head:
    linear-gradient(
      110deg,
      #030a10 0%,
      #06131f 72%,
      #082238 100%
    );

  --cp17-panel:
    #061522;

  --cp17-panel-soft:
    #081c2b;

  --cp17-card:
    #071824;

  --cp17-card-alt:
    #092238;

  --cp17-text:
    #f5fbff;

  --cp17-text-2:
    #a8c0cc;

  --cp17-muted:
    #7694a3;

  --cp17-border:
    rgba(
      51,
      187,
      232,
      .34
    );

  --cp17-border-soft:
    rgba(
      51,
      187,
      232,
      .18
    );

  --cp17-visual:
    #020a10;

  --cp17-plan-stage:
    #03111c;

  --cp17-plan-card:
    #08243a;

  --cp17-plan-featured:
    #0b3150;

}


/* ==========================================================
   PALETA - LIGHT
   ========================================================== */

html[data-theme="light"]{

  --cp17-page:
    #eaf5fa;

  --cp17-sidebar:
    #f6fbfd;

  --cp17-head:
    linear-gradient(
      110deg,
      #ffffff 0%,
      #effaff 72%,
      #d9f3fc 100%
    );

  --cp17-panel:
    #ffffff;

  --cp17-panel-soft:
    #f4fafc;

  --cp17-card:
    #ffffff;

  --cp17-card-alt:
    #edf9fd;

  --cp17-text:
    #082a3d;

  --cp17-text-2:
    #456777;

  --cp17-muted:
    #6b8997;

  --cp17-border:
    #9fd8eb;

  --cp17-border-soft:
    #cde7f0;

  --cp17-visual:
    #06131d;

  --cp17-plan-stage:
    #dff1f8;

  --cp17-plan-card:
    #ffffff;

  --cp17-plan-featured:
    #e9f8ff;

}


/* ==========================================================
   GEOMETRIA GLOBAL
   UMA ÚNICA ESTRUTURA PARA DARK E LIGHT
   ========================================================== */

@media(min-width:901px){

  html[data-theme]
  .cp7-shell{

    display:grid!important;

    grid-template-columns:
      176px
      minmax(0,1fr)!important;

    min-height:100vh!important;

  }


  html[data-theme]
  .cp7-sidebar{

    width:auto!important;

    min-width:0!important;

    max-width:none!important;

  }


  html[data-theme]
  .cp7-main{

    width:100%!important;

    min-width:0!important;

    max-width:none!important;

    margin:0!important;

    padding:
      18px
      22px
      48px!important;

  }


  html[data-theme]
  .cp14-content{

    width:100%!important;

    min-width:0!important;

    max-width:none!important;

    margin:0!important;

    padding:0!important;

  }

}


/* ==========================================================
   HEADERS
   MESMO TAMANHO / POSIÇÃO NOS DOIS TEMAS
   ========================================================== */

html[data-theme]
.cp14-main:not(.is-home)
.cp7-page-head{

  position:relative!important;

  width:100%!important;

  min-height:118px!important;

  margin:
    0 0
    20px!important;

  padding:
    23px
    165px
    23px
    26px!important;

  display:flex!important;

  align-items:center!important;

  justify-content:space-between!important;

  gap:24px!important;

  overflow:hidden!important;

  border:
    1px solid
    var(--cp17-border)!important;

  border-radius:
    17px!important;

  background-color:
    var(--cp17-panel)!important;

  background-image:
    url('/static/assets/cp-mark-3d.webp'),
    var(--cp17-head)!important;

  background-repeat:
    no-repeat,
    no-repeat!important;

  background-position:
    right 30px center,
    center!important;

  background-size:
    100px auto,
    cover!important;

  box-shadow:
    0 13px 28px
    rgba(
      13,
      73,
      99,
      .08
    )!important;

}


/* remove definitivamente qualquer outra implementação
   de logo dentro do header */

html[data-theme]
.cp7-page-head::before,

html[data-theme]
.cp7-page-head::after{

  content:none!important;

  display:none!important;

  background:none!important;

}


html[data-theme]
.cp7-page-head
img[src*="cp-mark"],

html[data-theme]
.cp7-page-head
.cp16-head-mark,

html[data-theme]
.cp7-page-head
.cp15-head-mark,

html[data-theme]
.cp7-page-head
.cp14-head-mark,

html[data-theme]
.cp7-page-head
.cp14-mark{

  display:none!important;

  visibility:hidden!important;

  opacity:0!important;

}


html[data-theme]
.cp7-page-head > div{

  min-width:0!important;

  max-width:
    calc(100% - 20px)!important;

}


html[data-theme]
.cp7-page-head h1{

  color:
    var(--cp17-text)!important;

}


html[data-theme]
.cp7-page-head p{

  color:
    var(--cp17-text-2)!important;

}


/* ==========================================================
   MÓDULOS - INTRO
   ========================================================== */

.cp17-modules-intro{

  display:grid!important;

  grid-template-columns:
    minmax(0,1.12fr)
    minmax(300px,.88fr)!important;

  align-items:end!important;

  gap:48px!important;

  margin:
    2px 0
    24px!important;

  padding:
    10px
    4px!important;

}


.cp17-modules-intro small,
.cp17-plans-heading small{

  display:block!important;

  color:#039fcf!important;

  font-size:10px!important;

  font-weight:950!important;

  letter-spacing:.16em!important;

}


.cp17-modules-intro h2,
.cp17-plans-heading h2{

  margin:
    7px 0 0!important;

  color:
    var(--cp17-text)!important;

  font-size:
    clamp(
      30px,
      2.5vw,
      46px
    )!important;

  line-height:1.02!important;

  letter-spacing:-.045em!important;

}


.cp17-modules-intro h2 span,
.cp17-plans-heading h2 span{

  display:block!important;

  color:#0795cf!important;

}


.cp17-modules-intro > p,
.cp17-plans-heading > p{

  margin:0!important;

  color:
    var(--cp17-text-2)!important;

  font-size:13px!important;

  line-height:1.65!important;

}


/* ==========================================================
   MÓDULOS - LISTA HORIZONTAL
   ========================================================== */

.cp17-module-list{

  display:grid!important;

  grid-template-columns:
    1fr!important;

  gap:22px!important;

  width:100%!important;

}


/* ==========================================================
   MÓDULO - CARD
   ========================================================== */

.cp17-module{

  position:relative!important;

  display:grid!important;

  grid-template-columns:
    minmax(0,1.02fr)
    minmax(430px,.98fr)!important;

  width:100%!important;

  min-height:400px!important;

  overflow:hidden!important;

  border:
    1px solid
    var(--cp17-border)!important;

  border-radius:22px!important;

  background:
    var(--cp17-card)!important;

  box-shadow:
    0 15px 34px
    rgba(
      11,
      75,
      103,
      .10
    )!important;

  transition:
    transform .30s
    cubic-bezier(.2,.8,.2,1),
    border-color .30s ease,
    box-shadow .30s ease!important;

}


.cp17-module:hover{

  transform:
    translateY(-5px)!important;

  border-color:#2ccbf1!important;

  box-shadow:
    0 25px 52px
    rgba(
      4,
      105,
      150,
      .17
    ),
    0 0 35px
    rgba(
      22,
      203,
      244,
      .07
    )!important;

}


/* ==========================================================
   MÓDULO - CONTEÚDO
   ========================================================== */

.cp17-module-content{

  min-width:0!important;

  padding:
    28px
    30px!important;

  display:flex!important;

  flex-direction:column!important;

}


.cp17-module-top{

  display:flex!important;

  align-items:flex-start!important;

  justify-content:space-between!important;

  gap:20px!important;

  margin-bottom:15px!important;

}


.cp17-module-ident{

  display:flex!important;

  align-items:center!important;

  gap:16px!important;

  min-width:0!important;

}


.cp17-module-icon{

  width:58px!important;

  height:58px!important;

  flex:
    0 0
    58px!important;

}


.cp17-module-ident small{

  display:block!important;

  margin-bottom:4px!important;

  color:#079bcb!important;

  font-size:9px!important;

  font-weight:950!important;

  letter-spacing:.15em!important;

}


.cp17-module-ident h3{

  margin:0!important;

  color:
    var(--cp17-text)!important;

  font-size:
    clamp(
      22px,
      1.7vw,
      29px
    )!important;

  line-height:1.08!important;

  letter-spacing:-.03em!important;

}


.cp17-module-badge{

  display:inline-flex!important;

  align-items:center!important;

  justify-content:center!important;

  min-height:29px!important;

  padding:
    0 12px!important;

  border:
    1px solid
    var(--cp17-border)!important;

  border-radius:999px!important;

  background:
    var(--cp17-panel-soft)!important;

  color:#087da6!important;

  font-size:8px!important;

  font-weight:950!important;

  letter-spacing:.11em!important;

  white-space:nowrap!important;

}


.cp17-module-badge.active{

  color:#0b895f!important;

  border-color:
    rgba(
      33,
      203,
      145,
      .42
    )!important;

}


.cp17-module-badge.active i{

  width:7px!important;

  height:7px!important;

  margin-right:7px!important;

  border-radius:50%!important;

  background:#28d69d!important;

  box-shadow:
    0 0 10px
    rgba(
      40,
      214,
      157,
      .55
    )!important;

}


.cp17-module-summary{

  margin:
    2px 0
    16px!important;

  color:
    var(--cp17-text-2)!important;

  font-size:13px!important;

  font-weight:650!important;

  line-height:1.5!important;

}


.cp17-module-why{

  margin-bottom:17px!important;

  padding:
    14px
    16px!important;

  border-left:
    3px solid
    #11c7ec!important;

  border-radius:
    0 11px 11px 0!important;

  background:
    var(--cp17-panel-soft)!important;

}


.cp17-module-why small{

  display:block!important;

  margin-bottom:6px!important;

  color:#0296c3!important;

  font-size:8px!important;

  font-weight:950!important;

  letter-spacing:.14em!important;

}


.cp17-module-why p{

  margin:0!important;

  color:
    var(--cp17-text-2)!important;

  font-size:12px!important;

  line-height:1.58!important;

}


.cp17-module-features{

  display:flex!important;

  flex-wrap:wrap!important;

  gap:
    8px 16px!important;

  margin:
    0 0
    20px!important;

  padding:0!important;

  list-style:none!important;

}


.cp17-module-features li{

  display:flex!important;

  align-items:center!important;

  gap:7px!important;

  color:
    var(--cp17-text-2)!important;

  font-size:11px!important;

}


.cp17-module-features b{

  color:#08bde4!important;

}


/* ==========================================================
   MÓDULO - COMERCIAL
   ========================================================== */

.cp17-module-commercial{

  margin-top:auto!important;

  display:grid!important;

  grid-template-columns:
    minmax(145px,.36fr)
    minmax(220px,.64fr)!important;

  gap:14px!important;

  align-items:end!important;

}


.cp17-module-price{

  min-height:67px!important;

  display:flex!important;

  flex-direction:column!important;

  justify-content:center!important;

  padding:
    10px
    15px!important;

  border:
    1px solid
    var(--cp17-border-soft)!important;

  border-radius:13px!important;

  background:
    var(--cp17-panel-soft)!important;

}


.cp17-module-price > small{

  color:
    var(--cp17-muted)!important;

  font-size:8px!important;

  font-weight:850!important;

  letter-spacing:.10em!important;

}


.cp17-module-price > div{

  display:flex!important;

  align-items:baseline!important;

  gap:5px!important;

  margin-top:3px!important;

}


.cp17-module-price span{

  color:
    var(--cp17-text-2)!important;

  font-size:12px!important;

}


.cp17-module-price strong{

  color:
    var(--cp17-text)!important;

  font-size:30px!important;

  line-height:1!important;

}


.cp17-module-cta{

  position:relative!important;

  width:100%!important;

  min-height:49px!important;

  overflow:hidden!important;

  border:0!important;

  border-radius:12px!important;

  display:flex!important;

  align-items:center!important;

  justify-content:center!important;

  gap:11px!important;

  background:
    linear-gradient(
      90deg,
      #10d1e8,
      #218ceb
    )!important;

  color:#00141f!important;

  font-size:10px!important;

  font-weight:950!important;

  letter-spacing:.07em!important;

  cursor:pointer!important;

  box-shadow:
    0 10px 23px
    rgba(
      0,
      146,
      216,
      .20
    )!important;

  transition:
    transform .18s ease,
    box-shadow .18s ease!important;

}


.cp17-module-cta::before,
.cp17-plan-cta::before{

  content:""!important;

  position:absolute!important;

  top:-60%!important;

  left:-40%!important;

  width:30%!important;

  height:220%!important;

  transform:
    rotate(20deg)!important;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.52),
      transparent
    )!important;

  transition:
    left .48s ease!important;

}


.cp17-module-cta:hover::before,
.cp17-plan-cta:hover::before{

  left:120%!important;

}


.cp17-module-cta:hover{

  transform:
    translateY(-2px)!important;

  box-shadow:
    0 15px 30px
    rgba(
      0,
      146,
      216,
      .29
    )!important;

}


.cp17-module-cta b,
.cp17-plan-cta b{

  transition:
    transform .18s ease!important;

}


.cp17-module-cta:hover b,
.cp17-plan-cta:hover b{

  transform:
    translateX(4px)!important;

}


.cp17-module-microcopy{

  display:block!important;

  margin-top:6px!important;

  color:
    var(--cp17-muted)!important;

  font-size:8px!important;

  line-height:1.35!important;

  text-align:center!important;

}


.cp17-module-active{

  grid-column:
    1 / -1!important;

  min-height:67px!important;

  display:flex!important;

  align-items:center!important;

  gap:12px!important;

  padding:
    11px
    15px!important;

  border:
    1px solid
    rgba(
      40,
      210,
      154,
      .35
    )!important;

  border-radius:13px!important;

  background:
    rgba(
      35,
      199,
      145,
      .07
    )!important;

}


.cp17-module-active > span{

  width:35px!important;

  height:35px!important;

  display:grid!important;

  place-items:center!important;

  border-radius:50%!important;

  background:
    rgba(
      32,
      206,
      149,
      .14
    )!important;

  color:#12a975!important;

}


.cp17-module-active small{

  display:block!important;

  color:
    var(--cp17-muted)!important;

  font-size:8px!important;

  letter-spacing:.11em!important;

}


.cp17-module-active strong{

  display:block!important;

  margin-top:3px!important;

  color:
    var(--cp17-text)!important;

  font-size:12px!important;

}


/* ==========================================================
   MÓDULO - IMAGEM 100% VISÍVEL
   ========================================================== */

.cp17-module-image{

  position:relative!important;

  min-width:0!important;

  display:flex!important;

  align-items:center!important;

  justify-content:center!important;

  padding:
    24px!important;

  overflow:hidden!important;

  border-left:
    1px solid
    var(--cp17-border-soft)!important;

  background:
    var(--cp17-visual)!important;

}


.cp17-module-image::before{

  content:""!important;

  position:absolute!important;

  width:320px!important;

  height:320px!important;

  border-radius:50%!important;

  background:
    rgba(
      0,
      191,
      240,
      .14
    )!important;

  filter:
    blur(70px)!important;

  transition:
    transform .45s ease,
    opacity .45s ease!important;

}


.cp17-module-image-frame{

  position:relative!important;

  z-index:2!important;

  width:100%!important;

  height:100%!important;

  min-height:350px!important;

  display:flex!important;

  align-items:center!important;

  justify-content:center!important;

  overflow:hidden!important;

  border-radius:15px!important;

  border:
    1px solid
    rgba(
      59,
      203,
      241,
      .21
    )!important;

  background:#020a10!important;

}


.cp17-module-image img{

  width:100%!important;

  height:100%!important;

  max-width:100%!important;

  max-height:350px!important;

  object-fit:contain!important;

  object-position:center!important;

  display:block!important;

  filter:
    saturate(1.05)
    contrast(1.03)!important;

  transform:
    scale(1)!important;

  transition:
    transform .50s
    cubic-bezier(.2,.8,.2,1),
    filter .35s ease!important;

}


.cp17-module:hover
.cp17-module-image img{

  transform:
    scale(1.035)!important;

  filter:
    saturate(1.15)
    contrast(1.06)
    brightness(1.04)!important;

}


.cp17-module:hover
.cp17-module-image::before{

  transform:
    scale(1.22)!important;

}


.cp17-visual-label{

  position:absolute!important;

  z-index:4!important;

  right:31px!important;

  bottom:12px!important;

  color:
    rgba(
      141,
      224,
      247,
      .62
    )!important;

  font-size:8px!important;

  font-weight:850!important;

  letter-spacing:.12em!important;

}


/* ==========================================================
   PLANOS
   MESMA GEOMETRIA NOS DOIS TEMAS
   ========================================================== */

.cp17-plans-stage{

  position:relative!important;

  width:100%!important;

  overflow:hidden!important;

  padding:
    42px
    42px
    48px!important;

  border:
    1px solid
    var(--cp17-border)!important;

  border-radius:24px!important;

  background:
    var(--cp17-plan-stage)!important;

  box-shadow:
    0 18px 40px
    rgba(
      11,
      70,
      96,
      .10
    )!important;

}


.cp17-plans-stage::before{

  content:""!important;

  position:absolute!important;

  inset:0!important;

  pointer-events:none!important;

  opacity:.08!important;

  background:
    linear-gradient(
      rgba(33,184,226,.50)
      1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(33,184,226,.50)
      1px,
      transparent 1px
    )!important;

  background-size:
    46px 46px!important;

}


.cp17-plans-heading{

  position:relative!important;

  z-index:2!important;

  display:grid!important;

  grid-template-columns:
    minmax(0,1.13fr)
    minmax(300px,.87fr)!important;

  gap:45px!important;

  align-items:end!important;

  margin-bottom:43px!important;

}


.cp17-plan-grid{

  position:relative!important;

  z-index:2!important;

  display:grid!important;

  grid-template-columns:
    repeat(
      3,
      minmax(0,1fr)
    )!important;

  gap:21px!important;

  align-items:stretch!important;

  padding-top:13px!important;

}


/* ==========================================================
   PLANO CARD
   ========================================================== */

.cp17-plan-card{

  position:relative!important;

  min-height:620px!important;

  padding:
    30px!important;

  display:flex!important;

  flex-direction:column!important;

  border:
    1px solid
    var(--cp17-border)!important;

  border-radius:23px!important;

  background:
    var(--cp17-plan-card)!important;

  color:
    var(--cp17-text)!important;

  box-shadow:
    0 14px 32px
    rgba(
      8,
      63,
      88,
      .10
    )!important;

  transition:
    transform .28s
    cubic-bezier(.2,.8,.2,1),
    box-shadow .28s ease,
    border-color .28s ease!important;

}


.cp17-plan-card:hover{

  transform:
    translateY(-9px)!important;

  border-color:#25cfee!important;

  box-shadow:
    0 27px 51px
    rgba(
      6,
      94,
      132,
      .20
    ),
    0 0 28px
    rgba(
      28,
      205,
      243,
      .08
    )!important;

}


.cp17-plan-card.featured{

  transform:
    translateY(-12px)!important;

  border-color:#24ceee!important;

  background:
    var(--cp17-plan-featured)!important;

  box-shadow:
    0 0 46px
    rgba(
      22,
      195,
      239,
      .11
    )!important;

}


.cp17-plan-card.featured:hover{

  transform:
    translateY(-19px)
    scale(1.012)!important;

  box-shadow:
    0 0 69px
    rgba(
      22,
      195,
      239,
      .20
    )!important;

}


.cp17-plan-card.current{

  border-color:
    rgba(
      37,
      210,
      153,
      .70
    )!important;

}


/* ==========================================================
   PLAN BADGES
   ========================================================== */

.cp17-plan-featured{

  position:absolute!important;

  z-index:3!important;

  top:-17px!important;

  left:50%!important;

  transform:
    translateX(-50%)!important;

  padding:
    9px 20px!important;

  border-radius:999px!important;

  background:
    linear-gradient(
      90deg,
      #21dfe9,
      #4fa9ff
    )!important;

  color:#00131d!important;

  font-size:9px!important;

  font-weight:950!important;

  letter-spacing:.07em!important;

  white-space:nowrap!important;

  animation:
    cp17PlanPulse
    3s ease-in-out
    infinite!important;

}


@keyframes cp17PlanPulse{

  0%,
  100%{

    box-shadow:
      0 7px 20px
      rgba(
        28,
        205,
        243,
        .17
      );

  }

  50%{

    box-shadow:
      0 7px 32px
      rgba(
        28,
        205,
        243,
        .43
      );

  }

}


.cp17-plan-current-badge{

  position:absolute!important;

  top:17px!important;

  right:17px!important;

  padding:
    6px 10px!important;

  border:
    1px solid
    rgba(
      42,
      207,
      151,
      .40
    )!important;

  border-radius:999px!important;

  background:
    rgba(
      39,
      199,
      145,
      .10
    )!important;

  color:#11a673!important;

  font-size:8px!important;

  font-weight:950!important;

}


/* ==========================================================
   PLANO CONTEÚDO
   ========================================================== */

.cp17-plan-index{

  display:flex!important;

  align-items:center!important;

  gap:9px!important;

  margin-bottom:18px!important;

}


.cp17-plan-index span{

  color:#08a9d7!important;

  font-family:monospace!important;

  font-size:11px!important;

  font-weight:950!important;

}


.cp17-plan-index small{

  color:
    var(--cp17-muted)!important;

  font-size:8px!important;

  font-weight:800!important;

  letter-spacing:.13em!important;

}


.cp17-plan-card h3{

  margin:
    0 0
    17px!important;

  color:
    var(--cp17-text)!important;

  font-size:29px!important;

  letter-spacing:-.03em!important;

}


.cp17-plan-price{

  display:flex!important;

  align-items:baseline!important;

  gap:7px!important;

  margin-bottom:18px!important;

}


.cp17-plan-price small{

  color:
    var(--cp17-text-2)!important;

  font-size:15px!important;

}


.cp17-plan-price strong{

  color:
    var(--cp17-text)!important;

  font-size:
    clamp(
      48px,
      4vw,
      61px
    )!important;

  line-height:.92!important;

  letter-spacing:-.05em!important;

}


.cp17-plan-price span{

  color:
    var(--cp17-text-2)!important;

  font-size:14px!important;

  font-weight:750!important;

}


.cp17-plan-tagline{

  min-height:39px!important;

  margin:
    0 0
    17px!important;

  color:
    var(--cp17-text-2)!important;

  font-size:12px!important;

  line-height:1.5!important;

}


.cp17-plan-benefit{

  min-height:121px!important;

  margin-bottom:18px!important;

  padding:
    14px 15px!important;

  border:
    1px solid
    var(--cp17-border-soft)!important;

  border-radius:12px!important;

  background:
    var(--cp17-panel-soft)!important;

}


.cp17-plan-benefit small,
.cp17-plan-audience small{

  display:block!important;

  margin-bottom:6px!important;

  color:#0795c3!important;

  font-size:8px!important;

  font-weight:950!important;

  letter-spacing:.13em!important;

}


.cp17-plan-benefit p,
.cp17-plan-audience p{

  margin:0!important;

  color:
    var(--cp17-text-2)!important;

  font-size:11px!important;

  line-height:1.55!important;

}


.cp17-plan-features{

  display:grid!important;

  gap:9px!important;

  margin:
    0 0
    18px!important;

  padding:0!important;

  list-style:none!important;

}


.cp17-plan-features li{

  display:flex!important;

  gap:9px!important;

  color:
    var(--cp17-text-2)!important;

  font-size:11px!important;

  line-height:1.4!important;

}


.cp17-plan-features b{

  color:#09b8df!important;

}


.cp17-plan-audience{

  margin-top:auto!important;

  padding-top:15px!important;

  border-top:
    1px solid
    var(--cp17-border-soft)!important;

}


.cp17-plan-actions{

  margin-top:19px!important;

}


.cp17-plan-cta{

  position:relative!important;

  width:100%!important;

  min-height:52px!important;

  overflow:hidden!important;

  border:
    1px solid
    #20bde5!important;

  border-radius:12px!important;

  display:flex!important;

  align-items:center!important;

  justify-content:center!important;

  gap:11px!important;

  background:
    transparent!important;

  color:#039fcf!important;

  font-size:10px!important;

  font-weight:950!important;

  letter-spacing:.06em!important;

  cursor:pointer!important;

  transition:
    transform .18s ease,
    background .18s ease,
    color .18s ease,
    box-shadow .18s ease!important;

}


.cp17-plan-cta:hover{

  transform:
    translateY(-2px)!important;

  background:
    rgba(
      20,
      196,
      236,
      .10
    )!important;

  box-shadow:
    0 12px 27px
    rgba(
      11,
      164,
      210,
      .17
    )!important;

}


.cp17-plan-cta.primary{

  border:0!important;

  background:
    linear-gradient(
      90deg,
      #20dfe8,
      #4ca9ff
    )!important;

  color:#00131d!important;

  box-shadow:
    0 11px 26px
    rgba(
      20,
      185,
      231,
      .23
    )!important;

}


.cp17-plan-microcopy{

  display:block!important;

  margin-top:8px!important;

  color:
    var(--cp17-muted)!important;

  font-size:8px!important;

  text-align:center!important;

}


.cp17-plan-active{

  min-height:54px!important;

  display:flex!important;

  align-items:center!important;

  justify-content:center!important;

  gap:10px!important;

  border:
    1px solid
    rgba(
      37,
      204,
      148,
      .35
    )!important;

  border-radius:12px!important;

  background:
    rgba(
      37,
      204,
      148,
      .08
    )!important;

  color:#13916a!important;

}


.cp17-plan-active span{

  font-size:17px!important;

}


.cp17-plan-active strong{

  display:block!important;

  font-size:9px!important;

  letter-spacing:.08em!important;

}


.cp17-plan-active small{

  display:block!important;

  margin-top:2px!important;

  color:
    var(--cp17-muted)!important;

  font-size:8px!important;

}


/* ==========================================================
   MODAL DE VENDA
   ========================================================== */

html[data-theme]
.page-planos
.cp7-modal-card{

  border:
    1px solid
    #25c9ec!important;

  background:
    var(--cp17-card)!important;

  color:
    var(--cp17-text)!important;

  box-shadow:
    0 30px 85px
    rgba(
      0,
      0,
      0,
      .38
    )!important;

}


html[data-theme]
.page-planos
.cp7-modal-card h2,
html[data-theme]
.page-planos
.cp7-modal-card strong{

  color:
    var(--cp17-text)!important;

}


html[data-theme]
.page-planos
.cp7-modal-card p,
html[data-theme]
.page-planos
.cp7-modal-card li{

  color:
    var(--cp17-text-2)!important;

}


/* ==========================================================
   RESPONSIVO
   MESMAS QUEBRAS NOS DOIS TEMAS
   ========================================================== */

@media(max-width:1250px){

  .cp17-module{

    grid-template-columns:
      minmax(0,1fr)
      minmax(360px,.82fr)!important;

  }


  .cp17-module-commercial{

    grid-template-columns:
      1fr!important;

  }

}


@media(max-width:1050px){

  .cp17-modules-intro,
  .cp17-plans-heading{

    grid-template-columns:
      1fr!important;

    gap:17px!important;

  }


  .cp17-module{

    grid-template-columns:
      1fr!important;

  }


  .cp17-module-image{

    order:-1!important;

    min-height:330px!important;

    border-left:0!important;

    border-bottom:
      1px solid
      var(--cp17-border-soft)!important;

  }


  .cp17-module-image-frame{

    min-height:290px!important;

  }


  .cp17-module-image img{

    max-height:290px!important;

  }


  .cp17-plan-grid{

    grid-template-columns:
      1fr!important;

  }


  .cp17-plan-card.featured,
  .cp17-plan-card.featured:hover{

    transform:none!important;

  }

}


@media(max-width:900px){

  html[data-theme]
  .cp7-main{

    width:100%!important;

    max-width:none!important;

  }

}


@media(max-width:760px){

  html[data-theme]
  .cp14-main:not(.is-home)
  .cp7-page-head{

    min-height:105px!important;

    padding:
      18px
      105px
      18px
      18px!important;

    background-position:
      right 15px center,
      center!important;

    background-size:
      70px auto,
      cover!important;

  }


  .cp17-module-content{

    padding:
      21px!important;

  }


  .cp17-module-top{

    flex-direction:column!important;

  }


  .cp17-module-commercial{

    grid-template-columns:
      1fr!important;

  }


  .cp17-plans-stage{

    padding:
      30px
      18px
      36px!important;

  }


  .cp17-plan-card{

    min-height:auto!important;

    padding:
      24px!important;

  }

}


/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media(
  prefers-reduced-motion:
  reduce
){

  .cp17-module,
  .cp17-module-image img,
  .cp17-module-cta,
  .cp17-plan-card,
  .cp17-plan-cta,
  .cp17-plan-featured{

    transition:none!important;

    animation:none!important;

  }

}