/* Landing Galactia — CSS standalone (padrao do portal, independente do tema Filament).
   Sora via bunny.net, como o resto do projeto (Jura no theme, Sora via ->font()). */
@import url('https://fonts.bunny.net/css?family=sora:400,600,700,800');

:root{
  /* Constantes da marca Galactia */
  --violet:#7c5cff; --violet-bright:#9a80ff; --cyan:#31e0e6; --magenta:#ff5fa2; --mist:#ece9ff;
  --cosmos:#0a0a1f; --cosmos-deep:#08081a; --cosmos-card:#100c28; --cosmos-elev:#161038;
  --hairline:rgba(124,92,255,.16);

  /* Tokens que trocam por tema (default = claro) */
  --ground:#f3f4f6;
  --surface:#ffffff;
  --text:#201d32;
  --muted:#5c5a70;
  --border:#e7e6ef;
  --shadow:0 1px 2px rgba(16,12,40,.05), 0 18px 40px -24px rgba(16,12,40,.22);

  --font-body:'Sora', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --maxw:1140px;
}
@media (prefers-color-scheme: dark){
  :root{
    --ground:#0a0a1f; --surface:#100c28; --text:#ece9ff;
    --muted:rgba(236,233,255,.60); --border:rgba(124,92,255,.18);
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 22px 48px -26px rgba(0,0,0,.7);
  }
}
:root[data-theme="light"]{
  --ground:#f3f4f6; --surface:#ffffff; --text:#201d32;
  --muted:#5c5a70; --border:#e7e6ef;
  --shadow:0 1px 2px rgba(16,12,40,.05), 0 18px 40px -24px rgba(16,12,40,.22);
}
:root[data-theme="dark"]{
  --ground:#0a0a1f; --surface:#100c28; --text:#ece9ff;
  --muted:rgba(236,233,255,.60); --border:rgba(124,92,255,.18);
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 22px 48px -26px rgba(0,0,0,.7);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--ground); color:var(--text);
  font-family:var(--font-body); line-height:1.6; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
h1,h2,h3{margin:0; text-wrap:balance; line-height:1.1;}
p{margin:0;}
.wrap{width:100%; max-width:var(--maxw); margin:0 auto; padding:0 24px;}

/* ---------- textos utilitários ---------- */
.eyebrow{
  font-size:.72rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--violet-bright);
}
.grad{
  background:linear-gradient(100deg, var(--violet-bright) 0%, var(--cyan) 92%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* ---------- botões ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.5rem; padding:.72rem 1.25rem;
  border-radius:12px; font-family:inherit; font-weight:600; font-size:.95rem;
  border:1px solid transparent; cursor:pointer; transition:transform .15s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-1px);}
.btn:focus-visible{outline:2px solid var(--cyan); outline-offset:2px;}
.btn--primary{
  background:linear-gradient(120deg, var(--violet) 0%, #6a4bf0 100%); color:#fff;
  box-shadow:0 8px 24px -10px rgba(124,92,255,.7);
}
.btn--primary:hover{box-shadow:0 12px 30px -8px rgba(124,92,255,.85);}
.btn--ghost{background:transparent; color:var(--mist); border-color:rgba(236,233,255,.28);}
.btn--ghost:hover{border-color:var(--mist); background:rgba(236,233,255,.06);}
.btn--lg{padding:.9rem 1.6rem; font-size:1.02rem;}
.btn .arw{transition:transform .2s ease;}
.btn:hover .arw{transform:translateX(3px);}

/* ---------- NAV ---------- */
.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(8,8,26,.72); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--hairline);
}
.nav__in{display:flex; align-items:center; justify-content:space-between; height:68px; gap:1rem;}
.brand{display:inline-flex; align-items:center; color:var(--mist);}
.brand__logo{height:42px; width:auto; display:block;}
.nav__links{display:flex; align-items:center; gap:2rem;}
.nav__links a{color:rgba(236,233,255,.72); font-size:.92rem; font-weight:500; transition:color .18s ease;}
.nav__links a:hover{color:var(--mist);}
.nav__cta{display:flex; align-items:center; gap:.6rem;}
@media (max-width:860px){ .nav__links{display:none;} }
@media (max-width:520px){ .nav__cta .btn--ghost{display:none;} .brand__logo{height:35px;} .nav__cta .btn--primary{padding:.55rem .85rem; font-size:.85rem;} }
/* Rede de segurança mobile: um botão de texto longo (CTA) quebra em linha em vez de estourar a
   viewport — o `.btn` é `white-space:nowrap`, que num celular estreito viraria rolagem horizontal. */
@media (max-width:520px){ .btn{white-space:normal; text-align:center;} .btn--lg{max-width:100%;} }

/* ---------- HERO ---------- */
.hero{position:relative; background:var(--cosmos); color:var(--mist); overflow:hidden;}
.hero__canvas{position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none;}
.hero::after{ /* vinheta simétrica: o texto é centralizado, o núcleo do canvas fica atrás dele */
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(70% 60% at 50% 30%, rgba(10,10,31,.72) 0%, rgba(10,10,31,.30) 50%, transparent 72%),
    linear-gradient(180deg, transparent 60%, rgba(10,10,31,.85) 100%);
}
.hero__in{
  position:relative; z-index:2; text-align:center; max-width:820px; margin:0 auto;
  padding:clamp(3.5rem,8vw,6rem) 0 clamp(2.5rem,5vw,3.5rem);
}
.hero__actions{justify-content:center;}
.hero__sub{margin-left:auto; margin-right:auto;}
.hero__badge{
  display:inline-flex; align-items:center; gap:.5rem; padding:.36rem .8rem; margin-bottom:1.5rem;
  border:1px solid var(--hairline); border-radius:999px; background:rgba(124,92,255,.10);
  font-size:.76rem; font-weight:600; letter-spacing:.05em; color:var(--mist);
}
.hero__badge .dot{width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 10px var(--cyan);}
.hero h1{font-size:clamp(2.4rem,5.6vw,4rem); font-weight:800; letter-spacing:-.02em; margin-bottom:1.35rem;}
.hero__sub{font-size:clamp(1.05rem,1.9vw,1.28rem); color:rgba(236,233,255,.80); max-width:640px; margin-bottom:2.2rem;}
.hero__actions{display:flex; flex-wrap:wrap; gap:.9rem; align-items:center;}
.hero__note{margin-top:1.4rem; font-size:.84rem; color:rgba(236,233,255,.55);}

/* ---------- MOLDURA DA TELA DO PRODUTO ---------- */
/* Toda captura do sistema entra aqui: a moldura é sempre escura (o chrome do painel é cosmos nos
   dois temas), então a mesma imagem serve para o tema claro e para o escuro — metade dos arquivos
   e nenhum salto visual ao alternar o tema. */
.shot{
  position:relative; z-index:2; margin:0; border-radius:16px; overflow:hidden;
  border:1px solid var(--hairline); background:var(--cosmos-card);
  box-shadow:0 40px 80px -40px rgba(0,0,0,.85), 0 0 0 1px rgba(236,233,255,.04) inset;
}
.shot img{display:block; width:100%; height:auto;}
.shot--hero{max-width:1040px; margin:0 auto;}
/* Recorte estreito (um pedaço de tela, não a tela toda): esticar até a borda da coluna
   ampliaria a captura acima do tamanho original e borraria o texto dela. */
.shot--inset{max-width:434px; border-radius:12px;}
.shot--panel{max-width:434px; margin:0 auto;}
/* Documento claro (ata, proposta): a moldura escura brigaria com o papel branco. A altura é a
   natural da imagem — recortar num quadro fixo encolhe o texto do documento até ficar ilegível. */
.shot--doc{background:#fff; border-color:var(--border);}
.shot__caption{margin-top:.7rem; font-size:.82rem; color:var(--muted);}

/* faixa de canais dentro do hero */
.channels{position:relative; z-index:2; border-top:1px solid var(--hairline); padding:1.4rem 0 2.2rem;}
.channels__label{font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:rgba(236,233,255,.5); margin-bottom:1rem;}
.channels__row{display:flex; flex-wrap:wrap; gap:.7rem;}
.chip{
  display:inline-flex; align-items:center; gap:.5rem; padding:.5rem .95rem;
  border:1px solid var(--hairline); border-radius:999px; background:rgba(236,233,255,.04);
  font-size:.9rem; font-weight:500; color:var(--mist);
}
.chip svg{width:18px; height:18px; flex:none; color:var(--cyan);}
.chip:nth-child(2) svg{color:var(--magenta);}
.chip:nth-child(3) svg{color:var(--violet-bright);}
.chip:nth-child(5) svg{color:var(--magenta);}

/* ---------- SECTION genérica ---------- */
.section{padding:clamp(4rem,8vw,6.5rem) 0;}
.section__head{max-width:640px; margin-bottom:3rem;}
.section__head--center{max-width:700px; margin-left:auto; margin-right:auto; text-align:center;}
.section__head .eyebrow{display:block; margin-bottom:.9rem;}
.section__head h2{font-size:clamp(1.8rem,3.4vw,2.6rem); font-weight:700; letter-spacing:-.015em;}
.section__head p{margin-top:1rem; color:var(--muted); font-size:1.08rem;}

/* ---------- ABAS DE PRODUTO ---------- */
.tabs__list{
  display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:2rem; padding:.35rem;
  border:1px solid var(--border); border-radius:14px; background:var(--surface); width:fit-content;
}
.tabs__tab{
  padding:.6rem 1.1rem; border:0; border-radius:10px; background:transparent;
  font:inherit; font-size:.95rem; font-weight:600; color:var(--muted); cursor:pointer;
  transition:background .18s ease, color .18s ease;
}
.tabs__tab:hover{color:var(--text);}
.tabs__tab[aria-selected="true"]{background:var(--violet); color:#fff;}
.tabs__tab:focus-visible{outline:2px solid var(--cyan); outline-offset:2px;}
.tabs__panel{display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,4vw,3.5rem); align-items:center;}
/* 🚨 O atributo `hidden` do HTML perde para qualquer `display` declarado aqui — sem esta linha o
   painel inativo continuaria na tela (regra do navegador tem prioridade menor que a de autor). */
.tabs__panel[hidden]{display:none;}
.tabs__text h3{font-size:clamp(1.4rem,2.6vw,1.85rem); font-weight:700; letter-spacing:-.015em;}
.tabs__text p{margin-top:.9rem; color:var(--muted); font-size:1.04rem;}
@media (max-width:880px){ .tabs__panel{grid-template-columns:1fr;} .tabs__list{width:100%;} }

/* ---------- FAIXA DE IA (cosmos) ---------- */
.ai{background:var(--cosmos-deep); color:var(--mist); position:relative; overflow:hidden;}
.ai::before{
  content:""; position:absolute; top:-30%; right:-10%; width:60%; height:120%;
  background:radial-gradient(circle at center, rgba(124,92,255,.22), transparent 62%); pointer-events:none;
}
.ai__grid{position:relative; display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,4rem); align-items:center;}
@media (max-width:880px){ .ai__grid{grid-template-columns:1fr;} }
.ai__head h2{font-size:clamp(1.8rem,3.4vw,2.6rem); font-weight:700; letter-spacing:-.015em; margin:.9rem 0 1.4rem;}
.ai__list{display:flex; flex-direction:column; gap:1.3rem; margin-top:.5rem;}
.ai__item{display:flex; gap:1rem;}
.ai__item .tick{
  flex:none; width:34px; height:34px; border-radius:10px; display:grid; place-items:center;
  background:rgba(49,224,230,.12); border:1px solid rgba(49,224,230,.3); color:var(--cyan);
}
.ai__item h4{margin:0 0 .25rem; font-size:1.05rem; font-weight:700; color:var(--mist);}
.ai__item p{color:rgba(236,233,255,.66); font-size:.96rem;}

/* ---------- CTA FINAL ---------- */
.cta{background:var(--cosmos); color:var(--mist); position:relative; overflow:hidden; text-align:center;}
.cta::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(60% 120% at 50% 0%, rgba(124,92,255,.28), transparent 60%); pointer-events:none;
}
.cta__in{position:relative; padding:clamp(4rem,8vw,6rem) 0;}
.cta h2{font-size:clamp(2rem,4vw,3rem); font-weight:800; letter-spacing:-.02em; margin-bottom:1rem;}
.cta p{color:rgba(236,233,255,.72); font-size:1.1rem; max-width:520px; margin:0 auto 2.2rem;}
.cta__actions{display:flex; flex-wrap:wrap; gap:.9rem; justify-content:center;}

/* ---------- MANIFESTO (um sistema só) ---------- */
.manifesto{text-align:center;}
.manifesto__head{max-width:720px; margin:0 auto;}
.manifesto__head .eyebrow{display:block; margin-bottom:.9rem;}
.manifesto h2{font-size:clamp(1.8rem,3.4vw,2.6rem); font-weight:700; letter-spacing:-.015em;}
.manifesto p{margin-top:1rem; color:var(--muted); font-size:1.08rem;}
.flow{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:1rem; margin-top:2.4rem;}
.flow__node{
  display:inline-flex; align-items:center; gap:.55rem; padding:.7rem 1.1rem;
  border:1px solid var(--border); border-radius:14px; background:var(--surface);
  font-weight:600; font-size:.95rem; color:var(--text); box-shadow:var(--shadow);
}
.flow__node svg{width:20px; height:20px; flex:none; color:var(--violet);}
:root[data-theme="dark"] .flow__node svg{color:var(--violet-bright);}
@media (prefers-color-scheme: dark){ .flow__node svg{color:var(--violet-bright);} }
.flow__node--start{border-color:rgba(124,92,255,.45);}
.flow__arrow{display:inline-flex; color:var(--violet-bright);}
.flow__arrow svg{width:30px; height:30px;}
.flow__split{display:flex; flex-direction:column; gap:.7rem;}
@media (max-width:520px){ .flow__arrow svg{transform:rotate(90deg);} }

/* ---------- SEÇÃO alternada + SPOTLIGHT dividido ---------- */
.section--alt{background:var(--surface);}
.split{display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:center;}
.split--reverse .split__media{order:-1;}
.split__text .eyebrow{display:block; margin-bottom:.9rem;}
.split__text h2{font-size:clamp(1.7rem,3.2vw,2.4rem); font-weight:700; letter-spacing:-.015em;}
.split__text p{margin-top:1rem; color:var(--muted); font-size:1.06rem;}
@media (max-width:880px){ .split{grid-template-columns:1fr;} .split--reverse .split__media{order:0;} }

.checklist{list-style:none; margin:1.5rem 0 0; padding:0; display:grid; gap:.9rem;}
.checklist li{display:flex; align-items:flex-start; gap:.7rem; font-size:1rem; color:var(--text);}
.checklist .chk{
  flex:none; width:24px; height:24px; border-radius:7px; display:grid; place-items:center; margin-top:.05rem;
  background:rgba(49,224,230,.14); border:1px solid rgba(49,224,230,.35); color:#0c8f93;
}
:root[data-theme="dark"] .checklist .chk{color:var(--cyan);}
@media (prefers-color-scheme: dark){ .checklist .chk{color:var(--cyan);} }
.checklist .chk svg{width:14px; height:14px;}

/* nota "IA inclusa no plano" na faixa de IA */
.ai__note{
  display:flex; gap:.8rem; margin-top:1.8rem; padding:1.05rem 1.15rem;
  border:1px solid var(--hairline); border-radius:14px; background:rgba(124,92,255,.10);
}
.ai__note svg{width:22px; height:22px; flex:none; color:var(--cyan);}
.ai__note p{color:rgba(236,233,255,.82); font-size:.95rem;}
.ai__note strong{color:var(--mist);}

/* ---------- INTEGRAÇÕES ---------- */
.integra{display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;}
.integra__item{
  padding:1.3rem; border:1px solid var(--border); border-radius:14px; background:var(--surface);
  transition:border-color .2s ease;
}
.integra__item:hover{border-color:rgba(124,92,255,.45);}
.integra__item h3{font-size:1.02rem; font-weight:700; margin-bottom:.35rem;}
.integra__item p{color:var(--muted); font-size:.9rem;}
@media (max-width:900px){ .integra{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .integra{grid-template-columns:1fr;} }

/* ---------- PREÇO ---------- */
.pricing{display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; align-items:start;}
.pricing__card{
  position:relative; padding:1.9rem 1.6rem; border:1px solid var(--border); border-radius:18px;
  background:var(--ground); box-shadow:var(--shadow);
}
.pricing__card--hi{border-color:rgba(124,92,255,.5); background:var(--surface);}
.pricing__badge{
  position:absolute; top:-.7rem; left:1.6rem; padding:.22rem .7rem; border-radius:999px;
  background:var(--violet); color:#fff; font-size:.72rem; font-weight:700; letter-spacing:.04em;
}
.pricing__card h3{font-size:1.1rem; font-weight:700;}
.pricing__price{
  margin:.7rem 0 .2rem; font-size:2.8rem; font-weight:800; letter-spacing:-.03em;
  font-variant-numeric:tabular-nums; line-height:1;
}
.pricing__price small{font-size:.95rem; font-weight:600; color:var(--muted); letter-spacing:0;}
.pricing__price small:first-child{margin-right:.2rem;}
.pricing__seats{font-size:.9rem; font-weight:600; color:var(--text); margin-top:.9rem;}
.pricing__seats span{font-weight:400; color:var(--muted);}
.pricing__desc{margin-top:1rem; color:var(--muted); font-size:.95rem;}
.pricing__foot{margin-top:1.8rem; text-align:center; color:var(--muted); font-size:.95rem;}
.pricing__foot a{color:var(--violet); font-weight:600; text-decoration:underline;}
:root[data-theme="dark"] .pricing__foot a{color:var(--violet-bright);}
@media (prefers-color-scheme: dark){ .pricing__foot a{color:var(--violet-bright);} }
@media (max-width:880px){ .pricing{grid-template-columns:1fr;} }

/* ---------- PERGUNTAS FREQUENTES ---------- */
.faq{max-width:820px; margin:0 auto; display:flex; flex-direction:column; gap:.7rem;}
.faq__item{border:1px solid var(--border); border-radius:14px; background:var(--surface); overflow:hidden;}
.faq__item summary{
  padding:1.1rem 1.3rem; font-weight:600; font-size:1.02rem; cursor:pointer;
  list-style:none; display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.faq__item summary::-webkit-details-marker{display:none;}
.faq__item summary::after{
  content:"+"; flex:none; font-size:1.4rem; font-weight:400; line-height:1; color:var(--violet);
  transition:transform .2s ease;
}
:root[data-theme="dark"] .faq__item summary::after{color:var(--violet-bright);}
@media (prefers-color-scheme: dark){ .faq__item summary::after{color:var(--violet-bright);} }
.faq__item[open] summary::after{transform:rotate(45deg);}
.faq__item summary:focus-visible{outline:2px solid var(--cyan); outline-offset:-2px;}
.faq__item p{padding:0 1.3rem 1.2rem; color:var(--muted); font-size:.98rem;}

/* ---------- RODAPÉ ---------- */
.foot{background:var(--cosmos-deep); color:rgba(236,233,255,.6); border-top:1px solid var(--hairline);}
.foot__in{display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:2rem; padding:3rem 0 2.2rem;}
.foot .brand__logo{height:36px; margin-bottom:.75rem;}
.foot__tag{font-size:.86rem; max-width:340px;}
.foot__col{display:flex; flex-direction:column; gap:.6rem;}
.foot__col h2{
  margin:0 0 .3rem; font-size:.74rem; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(236,233,255,.45);
}
.foot__col a{font-size:.88rem; color:rgba(236,233,255,.7); transition:color .18s ease;}
.foot__col a:hover{color:var(--mist);}
.foot__base{border-top:1px solid var(--hairline); padding:1.2rem 0;}
.foot__copy{font-size:.82rem; color:rgba(236,233,255,.42);}
@media (max-width:880px){ .foot__in{grid-template-columns:1fr 1fr;} }
@media (max-width:520px){ .foot__in{grid-template-columns:1fr; gap:1.6rem;} }

/* ---------- reveal ---------- */
.js .reveal{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease;}
.js .reveal.in{opacity:1; transform:none;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .js .reveal{opacity:1; transform:none; transition:none;}
  .btn:hover{transform:none;}
}

/* ---------- WIDGET DE CONTATO (WhatsApp) ---------- */
.wa{position:fixed; right:20px; bottom:20px; z-index:60; font-family:var(--font-body);}
.wa__fab{
  display:inline-flex; align-items:center; gap:.55rem; padding:.72rem 1rem; border:0; border-radius:999px;
  background:#25d366; color:#052e17; font-family:inherit; font-weight:700; font-size:.95rem; cursor:pointer;
  box-shadow:0 12px 30px -8px rgba(37,211,102,.6); transition:transform .15s ease, box-shadow .2s ease;
}
.wa__fab:hover{transform:translateY(-2px); box-shadow:0 16px 36px -8px rgba(37,211,102,.75);}
.wa__fab:focus-visible{outline:2px solid var(--cosmos); outline-offset:2px;}
.wa__fab svg{width:22px; height:22px;}
@media (max-width:440px){ .wa__fab-label{display:none;} .wa__fab{padding:.85rem;} }

.wa__panel{
  position:absolute; right:0; bottom:calc(100% + 12px); width:344px; max-width:calc(100vw - 40px);
  background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:18px;
  box-shadow:var(--shadow); overflow:hidden;
}
.wa__panel[hidden]{display:none;}
.wa__head{display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:1rem 1.15rem; background:#25d366; color:#052e17;}
.wa__head-title{font-weight:700; font-size:1.05rem;}
.wa__head-sub{font-size:.82rem; opacity:.9; margin-top:.15rem;}
.wa__close{border:0; background:transparent; color:#052e17; font-size:1.5rem; line-height:1; cursor:pointer; padding:0 .1rem;}
.wa__form{display:flex; flex-direction:column; gap:.95rem; padding:1.15rem;}
.wa__field{display:flex; flex-direction:column; gap:.45rem;}
.wa__label{font-size:.85rem; font-weight:600; color:var(--text);}
.wa__opt{font-weight:400; color:var(--muted);}
/* Controles de formulário: mesma regra para o widget e para a página de contato — são o mesmo
   componente visual, só mudam o contexto e a largura. */
.wa__input, .cform__input{
  width:100%; padding:.62rem .72rem; font:inherit; color:var(--text);
  background:var(--ground); border:1px solid var(--border); border-radius:10px; outline:none;
}
.wa__input:focus, .cform__input:focus{border-color:var(--violet); box-shadow:0 0 0 3px rgba(124,92,255,.18);}
.wa__opts, .cform__opts{display:flex; flex-wrap:wrap; gap:.5rem;}
.wa__chk, .cform__chk{
  display:inline-flex; align-items:center; gap:.4rem; padding:.4rem .75rem; border:1px solid var(--border);
  border-radius:999px; font-size:.88rem; color:var(--text); cursor:pointer; user-select:none;
}
.wa__chk input, .cform__chk input{accent-color:var(--violet);}
.wa__chk:has(input:checked), .cform__chk:has(input:checked){border-color:var(--violet); background:rgba(124,92,255,.12);}
.wa__error{color:#dc2626; font-size:.82rem;}
.wa__error[hidden]{display:none;}
.wa__hint{font-size:.82rem; color:var(--muted);}
.wa__hint[hidden]{display:none;}
.wa__hint--ok{color:#1f9d63; font-weight:600;}
.wa__hint--err{color:var(--muted);}
.wa__submit{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.74rem 1rem; border:0;
  border-radius:12px; background:#25d366; color:#052e17; font:inherit; font-weight:700; cursor:pointer;
  transition:filter .15s ease;
}
.wa__submit:hover{filter:brightness(1.06);}
.wa__submit svg{width:18px; height:18px;}

/* ---------- PÁGINA DE CONTATO (formulário público) ---------- */
.cform{padding:clamp(2.5rem,6vw,4.5rem) 0;}
.cform__grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.75rem,4vw,3.5rem); align-items:start;}
.cform__aside h1{font-size:clamp(1.9rem,4.2vw,2.9rem); margin:.6rem 0 1rem;}
.cform__lead{color:var(--muted); font-size:1.02rem;}
.cform__list{list-style:none; padding:0; margin:1.75rem 0 0; display:flex; flex-direction:column; gap:.85rem;}
.cform__list li{display:flex; align-items:flex-start; gap:.65rem; color:var(--muted); font-size:.95rem;}
.cform__list svg{width:20px; height:20px; flex:none; color:var(--cyan); margin-top:.18rem;}

.cform__card{
  background:var(--surface); border:1px solid var(--border); border-radius:20px;
  box-shadow:var(--shadow); padding:clamp(1.25rem,3vw,2rem); min-width:0;
}
.cform__form{display:flex; flex-direction:column; gap:1.05rem;}
.cform__row{display:grid; grid-template-columns:1fr 1fr; gap:1.05rem;}
.cform__field{display:flex; flex-direction:column; gap:.4rem; min-width:0;}
.cform__label{font-size:.85rem; font-weight:600; color:var(--text);}
.cform__req{color:var(--magenta);}
.cform__opt{font-weight:400; color:var(--muted);}
textarea.cform__input{resize:vertical; min-height:120px;}
.cform__note{font-size:.8rem; color:var(--muted);}
.cform__alert{border:1px solid; border-radius:12px; padding:.9rem 1rem; font-size:.92rem; margin-bottom:1.15rem;}
.cform__alert--ok{border-color:rgba(49,224,230,.45); background:rgba(49,224,230,.12); color:var(--text);}
.cform__alert--err{border-color:rgba(255,95,162,.45); background:rgba(255,95,162,.12); color:var(--text);}
.cform .btn{justify-content:center;}

@media (max-width:880px){ .cform__grid{grid-template-columns:1fr;} }
@media (max-width:520px){ .cform__row{grid-template-columns:1fr;} }