:root{
  --orange:#F06A00;
  --orange2:#FF8A2A;
  --purple:#5B167A;
  --purple2:#8A0F8A;
  --bg:#ffffff;
  --text:#0b1020;
  --muted:#6b7280;
  --border: rgba(0,0,0,.12);
  --shadow: 0 18px 60px rgba(0,0,0,.14);
  --shadow2: 0 10px 28px rgba(0,0,0,.10);
  --r:18px;
  --r2:26px;
  --max:1180px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.6;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.container{width:min(100%, calc(var(--max) + 32px));margin:0 auto;padding:0 16px}

.skip{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip:focus{left:16px;top:16px;width:auto;height:auto;background:#fff;padding:10px 12px;border-radius:12px;box-shadow:var(--shadow);z-index:999}

/* Top bar */
.topbar{
  background: linear-gradient(90deg,var(--orange),var(--orange2));
  color:#fff;
  font-weight:800;
  font-size:.92rem;
}
.topbar__inner{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 0;
}
.topbar__left, .topbar__right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pillbtn{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.35);
  background: rgba(255,255,255,.10);
  color:#fff;
  font-weight:900;
}
.pillbtn:hover{background: rgba(255,255,255,.16)}
.iconbtn{
  width:34px;height:34px;border-radius:999px;
  display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.35);
  background: rgba(255,255,255,.10);
}
.iconbtn:hover{background: rgba(255,255,255,.16)}

/* Header / nav */
.header{
  position:sticky; top:0; z-index:99;
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(10px);
  border-bottom:1px solid rgba(0,0,0,.08);
}
.header__inner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0}
.brand{display:flex;align-items:center;gap:10px}
.brand__logo{width:180px;max-width:100%;height:auto;border-radius:18px}
.brand__name{
  font-family:Poppins, Inter, sans-serif;
  font-weight:900;
  letter-spacing:.2px;
  font-size:22px;
}
.brand__name span{color:var(--purple)}

.nav{display:flex;align-items:center;gap:12px;position:relative}
.nav__toggle{
  display:none;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  font-weight:900;
}
.nav__menu{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.nav__link{
  padding:10px 12px;
  border-radius:12px;
  font-weight:900;
  color:#2b2f3a;
}
.nav__link:hover{background:rgba(91,22,122,.08)}
.nav__link.is-active{background:rgba(91,22,122,.12); color:var(--purple)}
.header__cta{display:flex;gap:10px;align-items:center}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:12px 14px;
  border-radius:999px;
  border:0;
  font-weight:900;
  cursor:pointer;
  white-space:nowrap;
}
.btn--purple{
  background: linear-gradient(90deg,var(--purple),var(--purple2));
  color:#fff;
  box-shadow: 0 16px 36px rgba(91,22,122,.22);
}
.btn--orange{
  background: linear-gradient(90deg,var(--orange),var(--orange2));
  color:#fff;
  box-shadow: 0 16px 36px rgba(240,106,0,.24);
}
.btn--ghost{
  background:#fff;
  border:1px solid rgba(0,0,0,.14);
  color:#111827;
}
.btn--full{width:100%}
.btn--sm{padding:10px 12px;border-radius:999px;font-weight:900}

/* HERO banner like screenshot */
.hero{
  min-height: 520px;
  display:flex;
  align-items:stretch;
  position:relative;
  overflow:hidden;
  background:#111;
}
.hero__bg{
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.38) 55%, rgba(0,0,0,.30) 100%),
    url('../assets/hero.jpg');
  background-size: cover;
  background-position: center;
  filter: saturate(1.05);
}
.hero__inner{position:relative; z-index:2; width:100%;}
.hero__content{
  padding: 62px 0;
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 20px;
  align-items:center;
}
.hero__tag{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 12px;border-radius:999px;
  border:1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.10);
  color:#fff;
  font-weight:900;
  font-size:.9rem;
}
.hero h1{
  margin:14px 0 10px;
  font-family:Poppins, Inter, sans-serif;
  font-weight:900;
  letter-spacing:-.5px;
  font-size: clamp(34px, 4.6vw, 66px);
  line-height:1.02;
  color:#fff;
}
.hero h1 .plus{color: #ffcc66}
.hero .sub{
  margin:0 0 18px;
  color: rgba(255,255,255,.88);
  font-weight:700;
  max-width: 56ch;
}
.hero__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.hero__panel{
  background: rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.18);
  border-radius: var(--r2);
  padding:16px;
  backdrop-filter: blur(10px);
}
.hero__panel h3{margin:0 0 10px;color:#fff;font-family:Poppins, Inter, sans-serif}
.hero__panel .price{
  display:flex;align-items:baseline;gap:8px;
  padding:12px 14px;border-radius:18px;
  background: rgba(240,106,0,.14);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
}
.hero__panel .price strong{font-family:Poppins, Inter, sans-serif;font-size:34px}
.hero__panel ul{margin:12px 0 0;padding-left:18px;color:rgba(255,255,255,.92);font-weight:700}
.hero__panel li{margin:6px 0}

/* Sections */
.section{padding:64px 0}
.section__title{
  text-align:center;
  margin:0 0 24px;
  font-family:Poppins, Inter, sans-serif;
  font-weight:900;
}
.section__title .big{display:block;font-size:56px;line-height:1;color:#fff}
.section__title .small{display:block;font-size:34px;color:var(--purple)}
.section__title--light .big{color: var(--orange)}
.section__title--light .small{color: var(--purple)}
.center{display:flex;justify-content:center}
.grid{display:grid;gap:18px}

/* Plans section like screenshot */
.plans-wrap{
  background: linear-gradient(180deg, var(--orange), #ffb000);
}
.plans{
  grid-template-columns: repeat(4, 1fr);
  align-items:stretch;
}
.plan{
  background:#fff;
  border-radius: 22px;
  box-shadow: var(--shadow2);
  overflow:hidden;
  display:flex;flex-direction:column;
}
.plan__top{
  background: linear-gradient(90deg,var(--purple),var(--purple2));
  color:#fff;
  padding:18px 14px;
  text-align:center;
}
.plan__top .speed{font-family:Poppins, Inter, sans-serif;font-weight:900;font-size:48px;line-height:1}
.plan__top .unit{font-weight:900;opacity:.95}
.plan__body{padding:16px 16px 18px;display:flex;flex-direction:column;gap:12px}
.plan__price{
  display:flex;align-items:baseline;justify-content:center;gap:8px;
  color:#111827;
}
.plan__price span{font-weight:800;color:#374151}
.plan__price strong{font-family:Poppins, Inter, sans-serif;font-size:40px}
.plan__list{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.plan__list li{display:flex;gap:10px;align-items:center;color:#374151;font-weight:700}
.dot{width:10px;height:10px;border-radius:999px;background: var(--purple)}
.plan__cta{margin-top:auto}

/* Advantages section like screenshot */
.advantages{
  background:#fff;
}
.adv-title{
  text-align:center;
  margin:0 0 32px;
  font-family:Poppins, Inter, sans-serif;
  font-weight:900;
}
.adv-title .big{display:block;color:#ffb000;font-size:64px;line-height:1}
.adv-title .small{display:block;color:var(--purple);font-size:38px}
.adv-grid{grid-template-columns:repeat(6,1fr)}
.adv{
  background:#ffb000;
  border-radius:18px;
  padding:18px 12px;
  text-align:center;
  box-shadow: var(--shadow2);
}
.adv .ico{
  width:44px;height:44px;margin:0 auto 10px;
  border-radius:14px;
  display:grid;place-items:center;
  background: rgba(91,22,122,.14);
  color: var(--purple);
  font-size:20px;
  font-weight:900;
}
.adv strong{display:block;color:#fff;font-weight:900}
.adv small{display:block;color:rgba(255,255,255,.92);font-weight:800;margin-top:4px}

/* Company CTA section */
.company{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(0deg, rgba(91,22,122,.75), rgba(91,22,122,.75)),
    url('../assets/empresa.jpg');
  background-size: cover;
  background-position:center;
  color:#fff;
}
.company__inner{padding:72px 0;text-align:center}
.company h2{margin:0 0 10px;font-family:Poppins, Inter, sans-serif;font-size:56px;line-height:1.05}
.company p{margin:0 auto 18px;max-width:70ch;color:rgba(255,255,255,.92);font-weight:700}

/* Footer */
.footer{
  background: linear-gradient(90deg, var(--orange), #ffb000);
  color:#fff;
  padding:34px 0;
}
.footer__grid{display:grid;grid-template-columns: 1.2fr .9fr .9fr; gap:18px; align-items:start}
.footer a{display:block;color:rgba(255,255,255,.92);margin:8px 0;font-weight:800}
.footer a:hover{color:#fff}
.footer .muted{color:rgba(255,255,255,.85)}
.footer__bottom{border-top:1px solid rgba(255,255,255,.28);margin-top:18px;padding-top:14px;color:rgba(255,255,255,.88)}
.quick-links{display:grid;gap:10px}
.quick-links .btn{justify-content:flex-start}

/* Floating WhatsApp */
.whatsapp-float{
  position:fixed; right:16px; bottom:16px; z-index:99;
  width:54px;height:54px;border-radius:999px;
  display:grid;place-items:center;
  background: linear-gradient(90deg, #25D366, #1DA851);
  color:#fff;
  font-weight:900;
  box-shadow: 0 14px 36px rgba(0,0,0,.22);
}

/* Mobile */
@media (max-width: 1100px){
  .plans{grid-template-columns:repeat(2,1fr)}
  .adv-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width: 820px){
  .hero__content{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .topbar__right{display:none}
  .nav__toggle{display:inline-flex}
  .nav__menu{
    display:none;
    position:absolute; right:0; top:60px;
    background:#fff;
    border:1px solid rgba(0,0,0,.12);
    border-radius:16px;
    padding:10px;
    box-shadow: var(--shadow);
    flex-direction:column;
    min-width: 210px;
  }
  .nav__menu.is-open{display:flex}
  .header__cta{display:none}
  .plans{grid-template-columns:1fr}
  .adv-grid{grid-template-columns:repeat(2,1fr)}
}


.brand__name{display:none !important;}

.insta-btn img{
  width:22px;
  height:22px;
  display:block;
}

/* Instagram button enhancements */
.insta-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:50%;
  transition:all .3s ease;
}
.insta-btn img{
  width:24px;
  height:24px;
}
.insta-btn:hover{
  background:linear-gradient(45deg,#f58529,#dd2a7b,#8134af,#515bd4);
  transform:scale(1.08);
}

/* Hide topbar on mobile */
@media (max-width:768px){
  .topbar{display:none;}
}

/* Instagram button rectangular (brand-like) */
.insta-btn{
  width:64px;
  height:34px;
  border-radius:8px; /* não redondo */
  padding:0 10px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.insta-btn img{
  width:auto;
  height:20px;
}

/* Instagram button — horizontal badge style */
.insta-btn{
  width:110px;
  height:36px;
  border-radius:10px;
  padding:0 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
}
.insta-btn img{
  height:22px;
  width:auto;
}

/* Instagram button — same style as Atendimento */
.insta-btn{
  height:36px;
  padding:0 18px;
  border-radius:999px;
  background:rgba(255,255,255,0.18);
  border:1px solid rgba(255,255,255,0.45);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.insta-btn img{
  height:18px;
  width:auto;
}

.insta-btn:hover{
  background:rgba(255,255,255,0.28);
}

/* Instagram button — icon only, pill style */
.insta-btn{
  padding:0 14px;
}

/* Floating WhatsApp button with logo */
.whatsapp-float{
  background: #25D366;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='white' d='M16.04 2C8.3 2 2 8.17 2 15.78c0 2.82.75 5.47 2.17 7.78L2 30l6.63-2.08a14.2 14.2 0 007.41 2.03C23.7 29.95 30 23.8 30 16.22 30 8.62 23.7 2 16.04 2zm7.85 20.1c-.33.94-1.63 1.75-2.64 1.97-.7.15-1.62.27-4.69-1.01-3.92-1.63-6.46-5.6-6.65-5.86-.19-.26-1.6-2.13-1.6-4.07 0-1.93 1.02-2.88 1.38-3.27.36-.39.78-.49 1.04-.49.26 0 .52 0 .75.01.24.01.56-.09.88.67.33.76 1.11 2.63 1.21 2.82.1.19.16.42.03.68-.13.26-.19.42-.38.65-.19.23-.4.52-.57.7-.19.19-.39.39-.17.78.22.39.98 1.61 2.1 2.6 1.44 1.27 2.65 1.67 3.04 1.86.39.19.62.16.85-.1.23-.26.98-1.14 1.24-1.53.26-.39.52-.32.88-.19.36.13 2.28 1.08 2.67 1.28.39.19.65.29.75.45.1.16.1.91-.23 1.85z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px;
}

/* WhatsApp floating button — image badge style */
.whatsapp-float{
  width:200px;
  height:70px;
  border-radius:35px;
  background: transparent;
  background-image: url('../assets/whatsapp-badge.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  box-shadow: none;
}
.whatsapp-float::before,


/* WhatsApp floating button — same size as Instagram button */
.whatsapp-float{
  width:110px;
  height:36px;
  border-radius:999px;
  background-color: transparent;
  background-image: url('../assets/whatsapp-badge.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  box-shadow: none;
}

/* WhatsApp floating button — BIG, only the provided badge image (no green dot) */
.whatsapp-float{
  width:220px !important;
  height:74px !important;
  border-radius:999px !important;
  background: transparent !important;
  background-image: url('../assets/whatsapp-badge.png') !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.18) !important;
  border: 0 !important;
  overflow: hidden !important;
  font-size: 0 !important;      /* hide any text */
  line-height: 0 !important;
}
.whatsapp-float *{display:none !important;} /* in case some icon gets injected */
.whatsapp-float::before,
.whatsapp-float::after{display:none !important;}

/* WhatsApp floating button — larger badge and area */
.whatsapp-float{
  width:300px !important;
  height:96px !important;
  border-radius:999px !important;
  background: transparent !important;
  background-image: url('../assets/whatsapp-badge.png') !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 88% auto !important; /* logo fills most of the button */
  box-shadow: 0 14px 32px rgba(0,0,0,.22) !important;
  border: 0 !important;
  overflow: hidden !important;
}

/* WhatsApp floating button — FINAL SIZE */
.whatsapp-float{
  width:180px !important;
  height:76px !important;
  border-radius:999px !important;
  background: transparent !important;
  background-image: url('../assets/whatsapp-badge.png') !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 75% auto !important; /* logo 75% of button */
  box-shadow: 0 12px 26px rgba(0,0,0,.22) !important;
  border: 0 !important;
  overflow: hidden !important;
}
.whatsapp-float *,
.whatsapp-float::before,
.whatsapp-float::after{
  display:none !important;
}

/* WhatsApp floating button — FINAL SIZE v20 */
.whatsapp-float{
  width:150px !important;
  height:65px !important;
  border-radius:999px !important;
  background: transparent !important;
  background-image: url('../assets/whatsapp-badge.png') !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 70% auto !important; /* logo 70% of button */
  box-shadow: 0 10px 22px rgba(0,0,0,.22) !important;
  border: 0 !important;
  overflow: hidden !important;
}
.whatsapp-float *,
.whatsapp-float::before,
.whatsapp-float::after{
  display:none !important;
}

/* WhatsApp floating button — polish & mobile */
.whatsapp-float{
  position: fixed !important;
  right: 24px !important;
  bottom: 24px !important;
  animation: whatsappPulse 2.2s ease-in-out infinite;
}

/* Subtle pulse */
@keyframes whatsappPulse{
  0%{transform:scale(1)}
  50%{transform:scale(1.04)}
  100%{transform:scale(1)}
}

/* Mobile adjustment */
@media (max-width: 768px){
  .whatsapp-float{
    width:130px !important;
    height:58px !important;
    background-size:68% auto !important;
    right:16px !important;
    bottom:16px !important;
  }
}

/* Feature cards icon images */
.feature-card img{
  width:28px;
  height:28px;
  margin-bottom:10px;
}

/* Vantagens - imagens padronizadas */
.feature-card img {
  width: 42px;
  height: 42px;
  object-fit: contain;
  margin-bottom: 12px;
}

/* Vantagens - ícones em imagem (padronizados) */
.advantages .ico{
  display:flex;
  align-items:center;
  justify-content:center;
}
.advantages .ico img{
  width:42px;
  height:42px;
  object-fit:contain;
  display:block;
}

/* Ajustes finais - cards vantagens */
.advantages .adv{
  background: #ff1a00;
  box-shadow: none !important;
}

.advantages .ico{
  background: transparent !important;
  box-shadow: none !important;
}

.advantages .ico img{
  width: 56px;
  height: 56px;
}

/* Cards Vantagens - cor alinhada com o site */
.advantages .adv{
  background: linear-gradient(135deg, #1e90ff, #4fb3ff);
  color: #ffffff;
}

.advantages .adv strong,
.advantages .adv small{
  color:#ffffff;
}

/* Vantagens - laranja claro + hover + ícones brancos */
.advantages .adv{
  background: linear-gradient(135deg, #ffb35a, #ff8a1f);
  color:#ffffff;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

.advantages .adv:hover{
  transform: translateY(-6px);
  box-shadow: 0 14px 30px rgba(0,0,0,.20) !important;
  filter: brightness(1.02);
}

/* Texto sempre branco */
.advantages .adv strong,
.advantages .adv small{
  color:#ffffff !important;
}

/* Ícones em branco (aplica filtro nas PNGs) */
.advantages .ico img{
  filter: brightness(0) invert(1);
  opacity: .98;
}

/* Hover - cards de planos */
.plan-card,
.plano,
.plan{
  transition: transform .18s ease, box-shadow .18s ease;
}

.plan-card:hover,
.plano:hover,
.plan:hover{
  transform: translateY(-6px);
  box-shadow: 0 14px 30px rgba(0,0,0,.22);
}

/* Hover - botões principais */
button,
.btn,
a.btn,
.cta,
.assinar,
.btn-primary{
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

button:hover,
.btn:hover,
a.btn:hover,
.cta:hover,
.assinar:hover,
.btn-primary:hover{
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(0,0,0,.25);
  filter: brightness(1.03);
}