/* ---------- utility ---------- */
.eyebrow{
  display:flex; align-items:center; width:fit-content; margin:0 auto 16px;
  padding:8px 18px; border-radius:999px; border:1px solid var(--border-strong); background:var(--surface-2);
  font-family:var(--font-switzer); font-size:14px; font-weight:500;
  letter-spacing:-0.01em; color:var(--muted-sm); text-transform:none;
}
.eyebrow--pill{}
.section-title{
  font-family:var(--font-display); font-weight:600; font-size:clamp(1.75rem,3.571vw,3rem);
  line-height:1.2; letter-spacing:-.02em; color:var(--text);
}
.section-title--gradient{
  font-family:var(--font-display); font-weight:600; letter-spacing:-.03em;
  background:linear-gradient(180deg, var(--title-grad-a) 0%, var(--title-grad-b) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
/* título editorial de duas cores — mesmo peso, só a cor muda (fiel ao padrão auditado) */
.section-title__muted, .section-title__strong{
  display:block; font-weight:500; letter-spacing:-.03em; line-height:1.0;
  font-size:clamp(1.8rem, 3.571vw, 3rem);
}
.section-title__muted{ color:var(--text-faint); }
.section-title__strong{ color:var(--text); }
.section-title--inline .section-title__muted, .section-title--inline .section-title__strong{ display:inline; }
@media (max-width:1024.98px){
  .section-title--inline{ white-space:nowrap; }
  .section-title--inline .section-title__muted, .section-title--inline .section-title__strong{ font-size:clamp(18px, 6vw, 28px); white-space:nowrap; }
}
#sites .section-title__muted, #sites .section-title__strong,
#automacoes .section-title__muted, #automacoes .section-title__strong,
#faq .section-title__muted, #faq .section-title__strong,
#sobre .section-title__muted, #sobre .section-title__strong,
#contato .section-title__muted, #contato .section-title__strong{
  font-weight:600; letter-spacing:-.04em; line-height:1.1; font-size:clamp(1.6rem,3.095vw,2.6rem);
}
@media (max-width:1024.98px){
  .section-title__muted, .section-title__strong,
  #sites .section-title__muted, #sites .section-title__strong,
  #automacoes .section-title__muted, #automacoes .section-title__strong,
  #faq .section-title__muted, #faq .section-title__strong,
  #sobre .section-title__muted, #sobre .section-title__strong,
  #contato .section-title__muted, #contato .section-title__strong{
    font-size:clamp(18px, 6vw, 28px);
  }
}
.section-sub{
  font-size:clamp(.92rem,1.25vw,1.05rem); color:var(--text-dim); margin-top:16px;
  font-weight:500; line-height:1.4; letter-spacing:-.02em;
  max-width:60ch;
}
@media (max-width:1024.98px){
  .section-sub{ font-size:10px; line-height:16px; max-width:78%; }
}
.section-head{ max-width:var(--container); margin:0 auto; padding:0 var(--gutter) 56px; }
.section-head--center{ text-align:center; }
.section-head--center .section-sub{ margin-left:auto; margin-right:auto; }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--font-body); font-weight:600; font-size:1rem; letter-spacing:-.01em;
  padding:12px 16px; border-radius:var(--r-btn); cursor:pointer; transition:all .3s var(--ease);
  white-space:nowrap;
}
.btn--solid{ background:var(--accent); color:#fff; }
.btn--solid:hover{ background:var(--accent-deep); color:#fff; transform:translateY(-1px); }
.btn--outline{ border:1px solid var(--border-strong); color:var(--text); }
.btn--outline:hover{ border-color:var(--text-dim); transform:translateY(-1px); }
.btn--ghost{ border:1px solid var(--border); color:var(--text-dim); padding:11px 22px; font-size:.82rem; }
.btn--ghost:hover{ color:var(--text); border-color:var(--border-strong); }
.btn--sm{ padding:11px 20px; font-size:.82rem; }
.btn--accent{ border:1px solid var(--accent-line); color:var(--accent); background:transparent; padding:10px 20px; font-size:.82rem; }
.btn--dark{ background:#141416; color:#fff; border:1px solid rgba(255,255,255,.1); }
.btn--dark:hover{ background:#1c1c1f; border-color:rgba(255,255,255,.16); transform:translateY(-2px); }
.btn--accent:hover{ background:var(--accent-soft); border-color:var(--accent); color:var(--accent); transform:translateY(-2px); }

.link-arrow{
  display:inline-flex; align-items:center; gap:8px; font-weight:600; font-size:.95rem; color:var(--accent);
  transition:gap .25s var(--ease);
}
.link-arrow svg{ width:16px; height:16px; transition:transform .25s var(--ease); }
.link-arrow:hover{ gap:12px; }

.nav__cta-wrap{ position:relative; }
.nav__cta-menu{
  position:absolute; top:calc(100% + 12px); right:0; min-width:220px;
  background:var(--surface); border:1px solid var(--border-strong); border-radius:var(--r-card); padding:8px;
  display:flex; flex-direction:column; gap:2px;
  opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity .25s var(--ease), transform .25s var(--ease), visibility .25s;
  box-shadow:0 24px 48px -16px var(--shadow-strong);
  z-index:600;
}
.nav__cta-menu.is-open{ opacity:1; visibility:visible; transform:translateY(0); }
.nav__cta-option{
  display:flex; align-items:center; gap:10px; padding:11px 12px; border-radius:6px;
  font-size:.88rem; font-weight:500; color:var(--text); transition:background .2s;
}
.nav__cta-option:hover{ background:var(--surface-2); }
.nav__cta-icon{ width:18px; height:18px; flex-shrink:0; color:var(--accent); }
.nav__cta-icon--wpp{ color:#25D366; }

.nav__mobile-cta{ display:flex; flex-direction:column; gap:12px; margin:18px var(--gutter) 28px; }
.nav__cta--mobile{ width:100%; height:48px; font-size:.95rem; }
.nav__cta-menu--mobile{ position:static; min-width:0; width:100%; margin-top:8px; opacity:1; visibility:hidden; max-height:0; padding:0; transform:none; overflow:hidden; box-shadow:none; transition:max-height .3s var(--ease), padding .3s var(--ease), visibility .3s; }
.nav__cta-menu--mobile.is-open{ visibility:visible; max-height:160px; padding:8px; }

/* ---------- scroll reveal ---------- */
[data-reveal]{
  opacity:0; transform:translateY(28px);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
}
[data-reveal].in{ opacity:1; transform:translateY(0); }
[data-reveal-delay="1"]{ transition-delay:.1s; }
[data-reveal-delay="2"]{ transition-delay:.2s; }
[data-reveal-delay="3"]{ transition-delay:.32s; }

/* ============================================================
   TRAVAMENTO "ZOOM 67%": de 1025px até 1919.98px, o site inteiro (menos o
   menu fixo e a barra de contato flutuante) renderiza como se a tela fosse
   mais larga (largura real ÷ 0.67) e encolhe visualmente com transform:scale,
   reproduzindo nativamente em 100% a composição que aparece dando zoom-out
   pro navegador. 1920px+ não é afetado — já renderiza correto nativamente.
   O --container também é forçado ao valor "grande" nessa faixa, porque sua
   média query normal (1699px) só dispara olhando a largura REAL da tela. */
@media (min-width:1025px) and (max-width:1919.98px){
  :root{ --container: 1520px; }
  #pageZoomOuter{ width:100%; overflow:hidden; }
  #pageZoomInner{ transform-origin:top left; }
}

/* ============================================================
   NAVBAR
   ============================================================ */
.nav{
  position:fixed; top:0; left:0; width:100%; z-index:500;
  background:transparent;
  padding:10px var(--gutter);
  box-sizing:border-box;
  pointer-events:none;
}
.nav__inner{
  pointer-events:auto;
  position:relative;
  width:fit-content; max-width:calc(100% - 2 * var(--gutter)); margin:0 auto; height:46px;
  padding:0 8px 0 18px;
  box-sizing:border-box;
  display:flex; align-items:center; justify-content:flex-start; gap:28px;
  border-radius:999px; border:1px solid rgba(0,0,0,.1);
  background:#F4F1EB;
}
.nav__logo{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.nav__mark{ height:32px; width:auto; display:block; flex-shrink:0; object-fit:contain; }
.nav__divider{ width:1px; height:22px; background:var(--border-strong); flex-shrink:0; }
.nav__inner .nav__divider{ background:rgba(0,0,0,.14); }
.nav__logo-img{ height:27px; width:auto; display:block; flex-shrink:0; object-fit:contain; }
.nav__links{
  display:none; gap:2px; font-size:.78rem; color:rgba(0,0,0,.65); font-weight:500; flex-shrink:0;
}
@media (min-width:1025px){
  .nav.nav--open .nav__links{ display:flex; animation:navLinksIn .35s var(--ease); }
}
@keyframes navLinksIn{ from{ opacity:0; transform:translateY(-4px); } to{ opacity:1; transform:none; } }
.nav__links a{ position:relative; transition:color .3s, background .3s; padding:8px 12px; border-radius:999px; white-space:nowrap; }
.nav__links a:hover{ color:#000; background:rgba(0,0,0,.05); }
.nav__links a.is-active{ color:#000; background:rgba(0,0,0,.06); }
.nav__cta{ flex-shrink:0; border-radius:999px; height:34px; padding:0 14px; font-size:.78rem; }
.nav__toggle{
  display:none; flex-direction:column; align-items:center; justify-content:center;
  gap:4px; width:34px; height:34px; margin-right:-6px; cursor:pointer;
}
.nav__toggle span{ display:block; width:16px; height:2px; border-radius:1px; background:#000; transition:transform .3s, opacity .3s; }
.nav__mobile{
  display:none; flex-direction:column; gap:0; background:var(--bg);
  overflow:hidden; max-height:0; transition:max-height .4s var(--ease);
  position:fixed; top:var(--nav-h); left:0; width:100%; z-index:499;
  pointer-events:auto;
}
.nav__mobile.open{ max-height:calc(100svh - var(--nav-h)); overflow-y:auto; border-top:1px solid var(--border); box-shadow:0 24px 40px -20px var(--shadow); }
.nav__mobile a{ padding:18px var(--gutter); border-bottom:1px solid var(--border); font-size:1rem; color:var(--text-dim); }
.nav__mobile a.is-active{ color:var(--text); font-weight:600; }

@media (max-width:1024px){
  .nav__links, .nav__cta-wrap{ display:none; }
  .nav__toggle{ display:flex; }
  .nav__mobile{ display:flex; }
}

/* ============================================================
   HERO (Início) — capa
   ============================================================ */
.hero{
  position:relative; background:var(--bg); padding-top:var(--nav-h);
}
.hero__inner{
  position:relative; z-index:1; overflow:hidden;
  width:100%; max-width:var(--container); margin:0 auto;
  min-height:clamp(520px, 53.72vw, 722px);
  padding:64px 24px;
  box-sizing:border-box;
  display:flex; align-items:center;
}
@media (min-width:810px){ .hero__inner{ padding:64px 32px; } }
@media (min-width:1344px){ .hero__inner{ padding:64px 104px; } }
.hero__content{ position:relative; z-index:2; text-align:left; max-width:536px; display:flex; flex-direction:column; }
.hero__badge{
  align-self:flex-start;
  display:inline-flex; align-items:center; gap:8px; padding:12px 20px 12px 16px;
  border-radius:999px; border:1px solid var(--border-strong); background:var(--surface);
  font-family:var(--font-switzer); font-weight:500; font-size:14px; color:var(--text);
  transition:background-color .15s;
}
.hero__badge-dot{ width:16px; height:16px; border-radius:50%; background:var(--text); flex-shrink:0; }
.hero__title{
  position:relative; z-index:1; margin-top:0; font-family:var(--font-switzer); font-weight:600;
  font-size:clamp(26px, 3.27vw, 44px); line-height:1.05; letter-spacing:-0.05em;
  max-width:536px;
}
.hero__title-muted{ color:var(--muted); }
/* 2ª linha do título: brilho sutil atravessando o texto, em loop (respeita prefers-reduced-motion) */
.hero__title-strong{
  background-color:var(--ink);
  background-image:linear-gradient(105deg, transparent 0, transparent 40%, rgba(255,255,255,.85) 50%, transparent 60%, transparent 100%);
  background-size:200% 100%;
  background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
  animation:heroShine 2.2s ease-in-out infinite;
}
@keyframes heroShine{ 0%{ background-position:150% center; } 100%{ background-position:-50% center; } }
@media (prefers-reduced-motion:reduce){ .hero__title-strong{ animation-duration:15s; } }
.hero__tagline{
  position:relative; margin-top:32px; font-family:var(--font-switzer); font-size:18px;
  font-weight:500; line-height:28px; letter-spacing:-0.01em; max-width:536px; color:var(--muted-sm);
}
.hero__tagline strong{ color:var(--ink); font-weight:500; }
.hero__cta{ position:relative; margin-top:32px; display:flex; align-items:center; justify-content:flex-start; gap:16px; flex-wrap:wrap; }
.hero__cta-btn{ background:var(--ink); color:#fff; height:48px; padding:0 22px; border:1px solid var(--cta-ring); }
.hero__cta-btn--secondary{ height:48px; padding:0 22px; background:transparent; }
.hero__cta-btn:hover{ background:#1c1c1c; }
.hero__cta-avatar{
  width:36px; height:36px; border-radius:50%; overflow:hidden; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; background:#fff;
}
.hero__cta-avatar img{ width:100%; height:100%; object-fit:contain; padding:6px; }
.btn--lg{ padding:9px 18px; }

/* ============================================================
   PAINEL DO HERO (mockup desktop + celular, estilo "hx-") — cores da marca
   escala única (--p) definida no .hx-visual e herdada pelos dois frames,
   posicionado a ~57% do container e cortado pelo overflow:hidden do .hero__inner
   ============================================================ */
.hero__product{
  --hx-title: var(--ink); --hx-dark: var(--ink); --hx-cta: var(--accent); --hx-cta-line: #FF7A33;
  --hx-active-tint: #FFE0C7; --hx-border: #E6E8EC;
  position:absolute; z-index:1; top:18%; left:57%;
}
.hx-visual{
  --p: clamp(.32px, .0737vw, .99px);
  width:calc(950*var(--p)); height:calc(600*var(--p));
}
.hx-frame{ position:absolute; bottom:0; border:5px solid #fff; overflow:hidden; }
.hx-frame--desktop{
  left:0; border-radius:16px; box-shadow:0 7px 29px 0 rgba(100,100,111,.2);
}
.hx-frame--phone{
  left:-56px; bottom:-22px; background:#EEEEEE; border-radius:16px; box-shadow:-17px 16px 52px 0 rgba(0,0,0,.13);
}
.hx-i{ width:1em; height:1em; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }

/* ----- Dashboard desktop (950×594 de referência, escalado por --p) ----- */
.hx-dash{ width:calc(950*var(--p)); height:calc(594*var(--p)); display:flex; background:#F6F7F9; font-family:var(--font-inter-tight,var(--font-body)); color:#111827; font-size:calc(13*var(--p)); line-height:1.3; }
.hx-dash__side{ width:calc(196*var(--p)); flex-shrink:0; padding:calc(18*var(--p)) calc(14*var(--p)); }
.hx-dash__brand{ display:flex; align-items:center; justify-content:space-between; height:calc(22*var(--p)); margin-bottom:calc(22*var(--p)); color:#9CA3AF; font-size:calc(16*var(--p)); }
.hx-dash__brand-mark{ display:flex; align-items:center; gap:calc(8*var(--p)); min-width:0; }
.hx-dash__logo{ width:calc(30*var(--p)); height:calc(30*var(--p)); display:grid; place-items:center; font-size:calc(12*var(--p)); flex-shrink:0; }
.hx-dash__logo img{ width:100%; height:100%; object-fit:contain; }
.hx-dash__brand-divider{ width:calc(1*var(--p)); height:calc(18*var(--p)); background:#D9DBE0; flex-shrink:0; }
.hx-dash__brand-name{ font-size:calc(14*var(--p)); font-weight:800; color:var(--hx-title); white-space:nowrap; letter-spacing:calc(-0.2*var(--p)); }
.hx-dash__brand-name b{ font-weight:800; color:var(--hx-cta); }
.hx-dash__search{ height:calc(34*var(--p)); display:flex; align-items:center; gap:calc(8*var(--p)); padding:0 calc(6*var(--p)) 0 calc(10*var(--p)); background:#fff; border:calc(1*var(--p)) solid var(--hx-border); border-radius:calc(8*var(--p)); color:#6B7280; font-size:calc(13*var(--p)); }
.hx-dash__search .hx-i{ font-size:calc(14*var(--p)); color:#9CA3AF; }
.hx-kbd{ margin-left:auto; font-size:calc(11*var(--p)); color:#4B5563; padding:calc(2*var(--p)) calc(6*var(--p)); border:calc(1*var(--p)) solid #E5E7EB; border-radius:calc(5*var(--p)); background:#F9FAFB; }
.hx-dash__nav{ margin-top:calc(16*var(--p)); display:flex; flex-direction:column; gap:calc(2*var(--p)); }
.hx-dash__nav span{ height:calc(34*var(--p)); display:flex; align-items:center; gap:calc(10*var(--p)); padding:0 calc(10*var(--p)); border-radius:calc(8*var(--p)); color:#4B5563; }
.hx-dash__nav span .hx-i{ font-size:calc(15*var(--p)); }
.hx-dash__nav span.is-active{ background:none; color:var(--hx-title); font-weight:600; }
.hx-dash__nav span.is-active .hx-i{ color:var(--hx-cta); }
.hx-dash__main{ flex:1; min-width:0; margin:calc(10*var(--p)) calc(10*var(--p)) 0 0; background:#fff; border:calc(1*var(--p)) solid #ECEDF0; border-bottom:0; border-radius:calc(12*var(--p)) calc(12*var(--p)) 0 0; overflow:hidden; }
.hx-dash__top{ height:calc(50*var(--p)); display:flex; align-items:center; gap:calc(8*var(--p)); padding:0 calc(18*var(--p)); border-bottom:calc(1*var(--p)) solid #F0F1F3; font-weight:500; }
.hx-dash__top .hx-i{ font-size:calc(15*var(--p)); color:#6B7280; }
.hx-dash__body{ padding:calc(18*var(--p)); }
.hx-label{ font-size:calc(12*var(--p)); color:#6B7280; }
.hx-dash__total{ margin-top:calc(6*var(--p)); font-size:calc(30*var(--p)); font-weight:500; letter-spacing:calc(-0.6*var(--p)); }
.hx-dash__filters{ margin-top:calc(22*var(--p)); display:flex; align-items:center; gap:calc(8*var(--p)); }
.hx-seg{ display:flex; gap:calc(2*var(--p)); padding:calc(3*var(--p)); border:calc(1*var(--p)) solid var(--hx-border); border-radius:calc(8*var(--p)); background:#F7F8FA; }
.hx-seg span{ padding:calc(5*var(--p)) calc(9*var(--p)); border-radius:calc(6*var(--p)); font-size:calc(12*var(--p)); color:#374151; }
.hx-seg span.is-active{ background:#fff; box-shadow:0 calc(1*var(--p)) calc(2*var(--p)) rgba(0,0,0,.08); border:calc(1*var(--p)) solid var(--hx-border); padding:calc(4*var(--p)) calc(8*var(--p)); }
.hx-date{ display:flex; align-items:center; gap:calc(6*var(--p)); padding:calc(7*var(--p)) calc(10*var(--p)); border:calc(1*var(--p)) solid var(--hx-border); border-radius:calc(8*var(--p)); font-size:calc(12*var(--p)); color:#374151; }
.hx-date .hx-i{ font-size:calc(13*var(--p)); color:#6B7280; }
.hx-box{ border:calc(1*var(--p)) solid #ECEDF0; border-radius:calc(10*var(--p)); }
.hx-dash__row{ margin-top:calc(14*var(--p)); display:grid; grid-template-columns:calc(520*var(--p)) calc(300*var(--p)); gap:calc(14*var(--p)); }
.hx-dash__chart{ padding:calc(14*var(--p)) calc(16*var(--p)) calc(12*var(--p)); }
.hx-dash__side-card{ padding:calc(14*var(--p)) calc(16*var(--p)); }
.hx-bar{ margin-top:calc(14*var(--p)); }
.hx-bar div{ display:flex; justify-content:space-between; font-size:calc(11*var(--p)); color:#374151; }
.hx-bar span{ display:block; margin-top:calc(6*var(--p)); height:calc(6*var(--p)); border-radius:calc(99*var(--p)); background:#F1F2F4; overflow:hidden; }
.hx-bar span i{ display:block; height:100%; border-radius:calc(99*var(--p)); background:var(--hx-cta); }
.hx-box__title{ display:flex; align-items:center; gap:calc(6*var(--p)); font-size:calc(12*var(--p)); font-weight:500; }
.hx-box__title .hx-i{ font-size:calc(13*var(--p)); color:#6B7280; flex-shrink:0; }
.hx-plot{ margin-top:calc(20*var(--p)); display:grid; grid-template-columns:calc(28*var(--p)) 1fr; column-gap:calc(10*var(--p)); }
.hx-plot__y{ height:calc(150*var(--p)); display:flex; flex-direction:column; justify-content:space-between; text-align:right; font-size:calc(10*var(--p)); color:#6B7280; margin:calc(-6*var(--p)) 0; }
.hx-plot__area{ position:relative; height:calc(150*var(--p)); }
.hx-plot__area .hx-chart{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.hx-plot__grid{ position:absolute; inset:0; display:flex; flex-direction:column; justify-content:space-between; }
.hx-plot__grid i{ display:block; border-top:calc(1*var(--p)) dashed #EEF0F2; }
.hx-plot__x{ grid-column:2; margin-top:calc(8*var(--p)); display:flex; justify-content:space-between; font-size:calc(10*var(--p)); color:#6B7280; }
.hx-dash__stats{ margin-top:calc(14*var(--p)); display:grid; grid-template-columns:repeat(4, calc(196*var(--p))); }
.hx-stat{ padding:calc(14*var(--p)) calc(16*var(--p)); }
.hx-stat + .hx-stat{ border-left:calc(1*var(--p)) solid #F0F1F3; }
.hx-stat__head{ display:flex; align-items:flex-start; justify-content:space-between; }
.hx-stat__title{ font-size:calc(12*var(--p)); font-weight:600; }
.hx-stat__sub{ font-size:calc(11*var(--p)); color:#6B7280; }
.hx-stat__value{ margin-top:calc(8*var(--p)); font-size:calc(20*var(--p)); font-weight:600; }
.hx-pill{ display:inline-flex; align-items:center; gap:calc(4*var(--p)); padding:calc(2*var(--p)) calc(4*var(--p)) calc(2*var(--p)) calc(7*var(--p)); border-radius:calc(999*var(--p)); font-size:calc(11*var(--p)); font-weight:600; background:#E6F9DA; color:#2F7A1F; }
.hx-pill i{ width:calc(12*var(--p)); height:calc(12*var(--p)); border-radius:calc(99*var(--p)); background:#1F3D2B; display:inline-block; }
.hx-dash__more{ margin-top:calc(14*var(--p)); padding:calc(14*var(--p)) calc(16*var(--p)); height:calc(74*var(--p)); }

/* ----- Celular (218×486 de referência) ----- */
.hx-app{ position:relative; width:calc(218*var(--p)); height:calc(486*var(--p)); background:#fff; font-family:var(--font-inter-tight,var(--font-body)); color:#111827; font-size:calc(10*var(--p)); line-height:1.3; overflow:hidden; }
.hx-app__status{ height:calc(34*var(--p)); display:flex; align-items:center; justify-content:space-between; padding:calc(6*var(--p)) calc(18*var(--p)) 0; font-size:calc(10.5*var(--p)); font-weight:600; }
.hx-app__island{ position:absolute; top:calc(8*var(--p)); left:50%; transform:translateX(-50%); width:calc(62*var(--p)); height:calc(18*var(--p)); border-radius:calc(10*var(--p)); background:#0B0B0B; }
.hx-app__sig{ display:flex; align-items:center; gap:calc(3*var(--p)); }
.hx-app__sig b{ display:block; width:calc(3*var(--p)); background:#111; border-radius:calc(1*var(--p)); }
.hx-app__bat{ width:calc(17*var(--p)); height:calc(8*var(--p)); border:calc(1*var(--p)) solid #111; border-radius:calc(2.5*var(--p)); padding:calc(1*var(--p)); margin-left:calc(2*var(--p)); display:block; }
.hx-app__bat::after{ content:""; display:block; height:100%; width:80%; background:#111; border-radius:calc(1*var(--p)); }
.hx-app__head{ height:calc(32*var(--p)); display:flex; align-items:center; gap:calc(6*var(--p)); padding:0 calc(14*var(--p)); border-bottom:calc(1*var(--p)) solid #F1F2F4; font-weight:500; }
.hx-app__head .hx-i{ font-size:calc(11*var(--p)); color:#6B7280; }
.hx-app__icons{ margin-left:auto; display:flex; gap:calc(10*var(--p)); }
.hx-app__icons .hx-i{ font-size:calc(12*var(--p)); }
.hx-app__body{ padding:calc(14*var(--p)) calc(14*var(--p)) 0; }
.hx-app .hx-label{ font-size:calc(9*var(--p)); }
.hx-app__total{ margin-top:calc(4*var(--p)); display:flex; align-items:center; justify-content:space-between; font-size:calc(20*var(--p)); font-weight:500; letter-spacing:calc(-0.4*var(--p)); }
.hx-app__total .hx-i{ font-size:calc(12*var(--p)); color:#6B7280; }
.hx-app__pills{ margin-top:calc(12*var(--p)); display:flex; gap:calc(2*var(--p)); white-space:nowrap; }
.hx-app__pills span{ padding:calc(3*var(--p)) calc(7*var(--p)); border-radius:calc(999*var(--p)); font-size:calc(8.5*var(--p)); color:#374151; }
.hx-app__pills span.is-active{ background:var(--hx-active-tint); color:var(--hx-title); font-weight:500; }
.hx-app__chart{ margin-top:calc(12*var(--p)); }
.hx-app__chart-title{ font-size:calc(9*var(--p)); color:#6B7280; }
.hx-app__plot{ margin-top:calc(8*var(--p)); display:grid; grid-template-columns:calc(20*var(--p)) 1fr; column-gap:calc(6*var(--p)); }
.hx-app__plot-y{ height:calc(74*var(--p)); display:flex; flex-direction:column; justify-content:space-between; text-align:right; font-size:calc(7*var(--p)); color:#6B7280; margin:calc(-3*var(--p)) 0; }
.hx-app__plot-area{ position:relative; height:calc(74*var(--p)); }
.hx-app__plot-area .hx-chart{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.hx-app__plot-grid{ position:absolute; inset:0; display:flex; flex-direction:column; justify-content:space-between; }
.hx-app__plot-grid i{ display:block; border-top:calc(1*var(--p)) dashed #EEF0F2; }
.hx-app__plot-x{ grid-column:2; margin-top:calc(6*var(--p)); display:flex; justify-content:space-between; font-size:calc(7*var(--p)); color:#6B7280; }
.hx-app__list{ margin-top:calc(14*var(--p)); }
.hx-app__item{ padding:calc(10*var(--p)) calc(14*var(--p)); border-top:calc(1*var(--p)) solid #F1F2F4; }
.hx-app__item .hx-stat__title{ font-size:calc(8.5*var(--p)); }
.hx-app__item .hx-stat__sub{ font-size:calc(7.5*var(--p)); }
.hx-app__item .hx-stat__value{ margin-top:calc(6*var(--p)); font-size:calc(14*var(--p)); }
.hx-app__item .hx-pill{ font-size:calc(7.5*var(--p)); padding:calc(1*var(--p)) calc(3*var(--p)) calc(1*var(--p)) calc(5*var(--p)); gap:calc(3*var(--p)); }
.hx-app__item .hx-pill i{ width:calc(8*var(--p)); height:calc(8*var(--p)); }
.hx-app__tabs{ position:absolute; left:0; right:0; bottom:0; height:calc(58*var(--p)); background:#fff; border-top:calc(1*var(--p)) solid #F1F2F4; display:flex; justify-content:space-around; padding-top:calc(8*var(--p)); }
.hx-app__tabs span{ display:flex; flex-direction:column; align-items:center; gap:calc(3*var(--p)); font-size:calc(6.5*var(--p)); color:#6B7280; }
.hx-app__tabs span .hx-i{ font-size:calc(13*var(--p)); }
.hx-app__tabs span.is-active{ color:var(--hx-cta); font-weight:600; }
.hx-app__home{ position:absolute; bottom:calc(6*var(--p)); left:50%; transform:translateX(-50%); width:calc(62*var(--p)); height:calc(4*var(--p)); border-radius:calc(4*var(--p)); background:#111; }

@media (min-width:810px){
  .hx-frame{ border-width:8px; }
  .hx-frame--phone{ border-radius:26px; }
}

.dash-card{
  position:relative; z-index:1; background:#fff; border-radius:20px; padding:20px 22px 22px;
  box-shadow:0 40px 70px -30px rgba(0,0,0,.3), 0 10px 24px -14px rgba(0,0,0,.15);
  text-align:left; color:#111;
}
.dash-card__top{ display:flex; align-items:center; gap:10px; }
.dash-card__dot{ width:9px; height:9px; border-radius:50%; background:var(--accent); flex-shrink:0; }
.dash-card__label{ font-size:.78rem; font-weight:600; color:#111; }
.dash-card__icons{ margin-left:auto; display:flex; align-items:center; gap:12px; color:#9a9a9a; }
.dash-card__icons svg{ width:16px; height:16px; }
.dash-card__plus{
  width:22px; height:22px; border-radius:50%; background:var(--accent); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1rem; line-height:1;
}
.dash-card__stat{ display:flex; flex-direction:column; gap:4px; margin-top:18px; }
.dash-card__stat-label{ font-size:.7rem; color:#8a8a8a; }
.dash-card__stat-value{ font-family:var(--font-switzer); font-size:1.9rem; font-weight:600; letter-spacing:-0.02em; }
.dash-card__filters{ display:flex; align-items:center; gap:6px; margin-top:16px; font-size:.68rem; color:#8a8a8a; }
.dash-card__filters span{ padding:5px 10px; border-radius:999px; }
.dash-card__filters .is-active{ background:#111; color:#fff; font-weight:600; }
.dash-card__filters-spacer{ flex:1; }
.dash-card__filters-select{ border:1px solid #eee; }
.dash-card__body{ display:grid; grid-template-columns:1.4fr 1fr; gap:16px; margin-top:16px; }
.dash-card__chart-title{ font-size:.68rem; color:#8a8a8a; }
.dash-card__chart svg{ width:100%; height:64px; display:block; margin-top:6px; }
.dash-card__area{ fill:var(--accent-soft); stroke:none; }
.dash-card__line{ fill:none; stroke:var(--accent); stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.dash-card__side-title{ font-size:.68rem; color:#8a8a8a; }
.dash-card__bar{ display:flex; height:6px; border-radius:999px; overflow:hidden; margin-top:8px; background:#f0f0f0; }
.dash-card__bar .is-a{ background:var(--accent); }
.dash-card__bar .is-b{ background:#111; }
.dash-card__bar .is-c{ background:#dedede; }
.dash-card__legend{ list-style:none; margin:10px 0 0; padding:0; display:flex; flex-direction:column; gap:6px; font-size:.7rem; color:#555; }
.dash-card__legend li{ display:flex; align-items:center; gap:6px; }
.dash-card__legend b{ margin-left:auto; color:#111; font-weight:600; }
.dash-dot{ width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.dash-dot--a{ background:var(--accent); }
.dash-dot--b{ background:#111; }
.dash-dot--c{ background:#dedede; }
.dash-card__metrics{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:18px; padding-top:16px; border-top:1px solid #f0f0f0; }
.dash-card__metrics div{ display:flex; flex-direction:column; gap:3px; }
.dash-card__metrics span{ font-size:.62rem; color:#9a9a9a; }
.dash-card__metrics b{ font-family:var(--font-switzer); font-size:1rem; font-weight:600; }
.dash-card__metrics em{ font-style:normal; font-size:.62rem; font-weight:600; color:#1a9c5c; }

.dash-phone{
  position:absolute; z-index:2; left:-40px; bottom:-40px; width:170px;
  background:#fff; border-radius:20px; padding:14px 14px 16px;
  box-shadow:0 30px 60px -24px rgba(0,0,0,.35), 0 0 0 6px #fff, 0 0 0 7px #ececec;
  text-align:left; color:#111;
}
.dash-phone__notch{ width:44px; height:5px; border-radius:4px; background:#e4e4e4; margin:0 auto 10px; }
.dash-phone__top{ display:flex; align-items:center; gap:6px; font-size:.62rem; font-weight:600; color:#111; }
.dash-phone__icon{
  width:16px; height:16px; border-radius:5px; background:var(--accent); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:.5rem; font-weight:700;
}
.dash-phone__stat{ display:flex; flex-direction:column; gap:2px; margin-top:10px; }
.dash-phone__stat span{ font-size:.56rem; color:#9a9a9a; }
.dash-phone__stat b{ font-family:var(--font-switzer); font-size:1.15rem; font-weight:600; letter-spacing:-.02em; }
.dash-phone__filters{ display:flex; gap:4px; margin-top:8px; font-size:.54rem; color:#9a9a9a; }
.dash-phone__filters span{ padding:3px 7px; border-radius:999px; }
.dash-phone__filters .is-active{ background:#111; color:#fff; font-weight:600; }
.dash-phone__chart{ margin-top:8px; }
.dash-phone__chart-title{ font-size:.56rem; color:#9a9a9a; }
.dash-phone__chart svg{ width:100%; height:38px; display:block; margin-top:4px; }
.dash-phone__row{ display:flex; align-items:center; gap:6px; margin-top:8px; font-size:.58rem; color:#8a8a8a; }
.dash-phone__row b{ color:#111; font-size:.66rem; }
.dash-phone__row em{ font-style:normal; margin-left:auto; color:#1a9c5c; font-weight:600; }
.dash-phone__tabs{ display:flex; justify-content:center; gap:6px; margin-top:12px; }
.dash-phone__tabs span{ width:5px; height:5px; border-radius:50%; background:#e4e4e4; }
.dash-phone__tabs .is-active{ background:var(--accent); }
.dash-phone__tabs--icons{
  justify-content:space-between; gap:0; margin-top:14px; padding-top:10px; border-top:1px solid #f0f0f0;
}
.dash-phone__tabs--icons span{
  width:auto; height:auto; border-radius:0; background:none; color:#c2c2c2;
  display:flex; align-items:center; justify-content:center;
}
.dash-phone__tabs--icons span svg{ width:16px; height:16px; }
.dash-phone__tabs--icons .is-active{ background:none; color:var(--accent); }

/* ============================================================
   VITRINE DE PRODUTO — painel de automação em destaque (Automações)
   ============================================================ */
.showcase{ width:100%; max-width:var(--container); margin:0 auto; padding:0 var(--gutter); box-sizing:border-box; }
.showcase__card{
  position:relative; overflow:hidden; border-radius:28px;
  padding:64px clamp(24px,4.762vw,64px) 110px;
  background:linear-gradient(135deg, #FFB07A 0%, var(--accent) 48%, var(--accent-deep) 100%);
}
.showcase__card::before{
  content:''; position:absolute; top:-25%; left:-12%; width:65%; height:85%; pointer-events:none;
  background:radial-gradient(circle, rgba(255,255,255,.4) 0%, transparent 70%);
}
.showcase__peek{
  position:absolute; z-index:0; top:36px; left:clamp(24px,4.762vw,64px); width:190px;
  background:rgba(255,255,255,.85); backdrop-filter:blur(10px); border-radius:16px; padding:12px;
  box-shadow:0 20px 40px -20px rgba(0,0,0,.3);
}
.showcase__peek-top{ display:flex; align-items:center; justify-content:space-between; color:#111; }
.showcase__peek-dot{ width:16px; height:16px; border-radius:50%; background:var(--accent); }
.showcase__peek-top svg{ width:16px; height:16px; color:#9a9a9a; }
.showcase__peek-search{
  margin-top:10px; display:flex; align-items:center; gap:6px; font-size:.68rem; color:#8a8a8a;
  background:#fff; border-radius:8px; padding:7px 9px;
}
.showcase__peek-search svg{ width:13px; height:13px; flex-shrink:0; }
.showcase__peek-search b{ margin-left:auto; font-weight:600; color:#b5b5b5; font-size:.6rem; }
.showcase__dashboard{ position:relative; z-index:1; max-width:520px; margin-left:auto; }
.showcase__phone{ position:absolute; z-index:2; left:clamp(24px,4.762vw,64px); bottom:-30px; }

@media (max-width:900px){
  .showcase__card{ padding:56px 20px 200px; }
  .showcase__dashboard{ margin-left:0; max-width:100%; }
  .showcase__peek{ display:none; }
  .showcase__phone{ left:50%; transform:translateX(-50%); bottom:-30px; }
}
@media (max-width:480px){
  .showcase__card{ border-radius:20px; padding:44px 16px 190px; }
  .dash-card{ padding:16px 16px 18px; }
  .dash-card__body{ grid-template-columns:1fr; }
  .dash-card__metrics{ grid-template-columns:repeat(2,1fr); row-gap:14px; }
}

/* abaixo de 1025px (celular/tablet em pé): layout empilhado — título (3 linhas,
   centralizado), texto e botões centralizados, e a arte embaixo é uma réplica
   fiel da posição/corte do PC (mesmo top:18%/left:57%/--p máximo do PC), só
   renderizada num box virtual de 1520px e encolhida pra caber na tela real —
   garante o MESMO ponto de corte do PC, só que menor. */
.hero__title-break-mobile{ display:none; }
@media (max-width:1024.98px){
  .hero__inner{ flex-direction:column; align-items:stretch; min-height:0; padding:48px 24px 64px; }
  .hero__content{ max-width:460px; margin:0 auto; align-items:center; text-align:center; }
  .hero__title{ max-width:none; margin-left:auto; margin-right:auto; font-size:26px; }
  .hero__title-break-mobile{ display:block; }
  .hero__tagline{ margin-left:auto; margin-right:auto; font-size:14px; line-height:22px; }
  .hero__cta{ flex-direction:column; align-items:stretch; justify-content:center; width:100%; max-width:320px; margin-left:auto; margin-right:auto; }
  .hero__art-mobile{ position:relative; width:710px; height:722px; transform-origin:top left; margin-top:-8px; overflow:hidden; }
  .hero__art-mobile .hero__product{ left:7.9%; }
  .hero__art-mobile .hx-visual{ --p:.99px; }
}

/* ============================================================
   TEASER SPLIT — bloco Serviços (índice para Sites / Automações)
   ============================================================ */
.teaser-split{
  padding:clamp(64px,8.929vw,120px) 0; max-width:var(--container); margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter);
  display:grid; grid-template-columns:1fr 1fr; gap:20px;
}
.teaser-split--stack{
  grid-template-columns:1fr; max-width:720px; padding-top:0; padding-bottom:0;
}
.teaser{
  position:relative; padding:44px 40px; border-radius:20px;
  background:rgba(255,255,255,.03); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 30px 60px -34px rgba(0,0,0,.75);
  display:flex; flex-direction:column; align-items:center; gap:16px; overflow:hidden; text-align:center;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.teaser::before{
  content:''; position:absolute; top:-40%; right:-25%; width:70%; height:150%; pointer-events:none; z-index:0;
  background:radial-gradient(circle, var(--teaser-glow, rgba(255,90,31,.14)) 0%, transparent 70%);
}
.teaser--orange{ --teaser-glow: rgba(255,90,31,.16); }
.teaser--blue{ --teaser-glow: rgba(59,130,246,.16); }
.teaser:hover{ transform:translateY(-4px); border-color:rgba(255,255,255,.14); box-shadow:0 36px 70px -30px rgba(0,0,0,.8); }
.teaser__n{
  position:relative; z-index:1; display:inline-flex; align-items:center; justify-content:center;
  width:46px; height:46px; border-radius:13px; border:1px solid;
}
.teaser__n svg{ width:21px; height:21px; }
.teaser--orange .teaser__n{ background:rgba(255,90,31,.14); border-color:rgba(255,90,31,.4); color:#FF5A1F; }
.teaser--blue .teaser__n{ background:rgba(59,130,246,.14); border-color:rgba(59,130,246,.4); color:#3B82F6; }
.teaser__title{ position:relative; z-index:1; font-family:var(--font-display); font-weight:600; font-size:clamp(1.5rem,2.381vw,2rem); letter-spacing:-.02em; color:var(--text); }
.teaser__text{ position:relative; z-index:1; color:var(--text-dim); font-size:1rem; line-height:1.7; max-width:44ch; }
.teaser .link-arrow{ position:relative; z-index:1; }

.teaser__hooks{ position:relative; z-index:1; display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
.teaser__hook{
  font-family:var(--font-body); font-weight:500; font-size:.74rem; color:var(--text-dim);
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); border-radius:999px; padding:6px 13px;
}
.teaser--orange .teaser__hook{ color:#FF9E70; border-color:rgba(255,90,31,.3); background:rgba(255,90,31,.08); }
.teaser--blue .teaser__hook{ color:#7CAEFA; border-color:rgba(59,130,246,.3); background:rgba(59,130,246,.08); }

@media (max-width:760px){
  .teaser-split{ grid-template-columns:1fr; }
}

/* ============================================================
   SERVIÇOS — eyebrow centralizado (o conteúdo vem do bloco Portfólio + IA)
   ============================================================ */
.servicos{
  padding:clamp(64px,8.929vw,120px) 0;
  background:var(--bg); color:var(--ink);
}
.servicos__eyebrow{
  display:flex; align-items:center; width:fit-content; margin:0 auto 16px;
  padding:8px 18px; border-radius:999px; border:1px solid var(--border-strong); background:var(--surface-2);
  font-family:var(--font-switzer); font-size:14px; font-weight:500;
  letter-spacing:-0.01em; color:var(--muted-sm);
}
.servicos__titulo{
  text-align:center; max-width:620px; margin:0 auto;
  font-family:var(--font-switzer); font-weight:600; letter-spacing:-.04em; line-height:1.1;
  font-size:clamp(1.6rem, 3.095vw, 2.6rem);
}
.servicos__titulo-muted{ color:var(--muted); }
.servicos__titulo-strong{ color:var(--ink); }
@media (max-width:1024.98px){
  .servicos__titulo{ font-size:clamp(18px, 6vw, 28px); white-space:nowrap; }
}
.servicos__sub{
  text-align:center; max-width:560px; margin:10px auto 40px;
  font-family:var(--font-switzer); font-size:15px; font-weight:500; line-height:24px;
  letter-spacing:-0.01em; color:var(--ink);
}
@media (max-width:1024.98px){
  .servicos__sub{ font-size:10px; line-height:16px; max-width:78%; margin-left:auto; margin-right:auto; }
}
/* Serviços não usa .section-head (que dá 56px extra de padding-bottom nas outras seções) —
   compensa aqui pra manter o mesmo espaço título→conteúdo (~96px) em todas as seções. */
#servicos > .servicos__sub{ margin-bottom:80px; }

/* ============================================================
   PORTFÓLIO + IA — cartão de portfólio e cartão "pergunte pra IA"
   (cores/fontes adaptadas pra usar os tokens da marca)
   ============================================================ */
.ia-grid{
  --destaque: var(--accent);
  --botao-claro: #FFC898;
  --botao-escuro: var(--accent);
  --brilho-1: #FFCB9B;
  --brilho-2: #FFE9C9;
  --titulo: var(--ink);
  --texto: var(--muted-sm);
  --linha: rgba(20,20,15,.1);
  --fundo-claro: #F4F1EB;
  display:grid; grid-template-columns:1fr 1fr; gap:1px;
  background:var(--linha); border-top:1px solid var(--linha); border-bottom:1px solid var(--linha);
  max-width:var(--container); margin:clamp(64px,8.929vw,120px) auto 0;
}
.ia-col{ display:flex; flex-direction:column; gap:1px; }
.ia-bloco{ background:#fff; overflow:hidden; }
.ia-visual{ height:450px; position:relative; background:#F7F8FA; }
.ia-visual::before{
  content:""; position:absolute; inset:0;
  background-image:radial-gradient(rgba(0,0,0,.08) 1px,transparent 1.2px); background-size:8px 8px;
  -webkit-mask-image:radial-gradient(ellipse at 70% 30%,#000 10%,transparent 75%);
  mask-image:radial-gradient(ellipse at 70% 30%,#000 10%,transparent 75%);
}
.ia-texto{ padding:28px 24px 24px; min-height:210px; flex:1; display:flex; flex-direction:column; background:#EAE7DD; }
.ia-texto h3{
  font-family:var(--font-switzer); font-size:20px; font-weight:600;
  letter-spacing:-.02em; line-height:1; color:var(--titulo); margin-bottom:10px;
}
.ia-texto p{ font-size:14px; font-weight:500; line-height:1.8; color:var(--texto); margin-bottom:24px; }
.ia-link{
  font-family:var(--font-switzer); font-weight:600; color:var(--destaque);
  text-decoration:none; margin-top:auto; display:inline-block; transition:transform .3s var(--ease);
}
.ia-link:hover{ transform:translateX(4px); }

/* visual esquerdo: página de documentação inclinada */
.doc{
  position:absolute; left:13%; top:20%; width:92%; height:115%;
  background:#fff; border-radius:14px; border:1px solid var(--linha);
  box-shadow:-18px 20px 40px rgba(0,0,0,.07);
  transform:perspective(1400px) rotateY(16deg) rotateX(6deg) rotateZ(-2deg); transform-origin:left center;
  -webkit-mask-image:linear-gradient(to right,#000 45%,transparent 92%);
  mask-image:linear-gradient(to right,#000 45%,transparent 92%);
  font-size:11px; color:var(--texto);
}
.doc::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:55%; background:linear-gradient(transparent,#F7F8FA 80%); }
.doc-abas{ display:flex; align-items:center; padding:16px 22px; border-bottom:1px solid var(--linha); }
.doc-logo{ display:flex; align-items:center; gap:8px; }
.doc-logo__mark{ height:20px; width:auto; display:block; }
.doc-logo__img{ height:17px; width:auto; display:block; }
.doc-corpo{ display:flex; padding:18px 22px; }
.doc-menu{ width:38%; display:flex; flex-direction:column; gap:4px; }
.doc-menu b{ font-weight:600; color:var(--titulo); margin:4px 0 6px; }
.doc-menu .it{ display:flex; align-items:center; gap:8px; padding:6px 10px; border-radius:8px; }
.doc-menu .it svg{ width:12px; height:12px; flex:none; }
.doc-menu .it.ativo{ background:rgba(255,90,0,.12); color:var(--accent-deep); font-weight:600; }
.doc-menu .grupo{ margin-top:16px; }
.metodo{ font-size:7px; font-weight:700; padding:1px 4px; border-radius:3px; background:#E8F0FF; color:#4a6fd8; }
.metodo.get{ background:#E6F6E6; color:#3c9a3c; }
.doc-conteudo{ flex:1; padding-left:26px; }
.doc-conteudo .tag{ color:var(--destaque); font-weight:600; font-size:10px; }
.doc-conteudo h4{ font-family:var(--font-switzer); font-size:20px; color:var(--titulo); margin:6px 0 4px; }
.doc-conteudo .sub{ color:#6a7085; margin-bottom:18px; }
.doc-conteudo p{ line-height:1.8; color:#8a8fa0; margin-bottom:16px; }
.doc-conteudo h5{ font-family:var(--font-switzer); font-size:14px; color:var(--titulo); display:flex; gap:6px; align-items:center; margin-bottom:10px; }
.doc-conteudo li{ margin-left:14px; color:#9aa0b0; line-height:1.9; }

.mao{ position:absolute; width:24px; filter:drop-shadow(0 2px 2px rgba(0,0,0,.18)); z-index:3; }

/* visual direito: caixa de prompt */
.brilho{
  position:absolute; left:18%; top:22%; width:70%; height:60%; filter:blur(38px); opacity:.75;
  background:radial-gradient(ellipse at 70% 60%, var(--brilho-1), transparent 60%),
             radial-gradient(ellipse at 20% 30%, var(--brilho-2), transparent 55%);
}
.prompt{
  position:absolute; left:4%; right:12%; top:34%; height:180px;
  background:rgba(255,255,255,.96); border-radius:22px; border:2px solid #fff;
  box-shadow:0 0 0 1px rgba(226,231,241,.6), 0 18px 50px rgba(255,90,0,.12);
}
.prompt-texto{
  position:absolute; left:0; right:22%; top:34px; overflow:hidden; white-space:nowrap; text-align:right;
  font-family:var(--font-switzer); font-size:24px; font-weight:500; letter-spacing:.2px; color:#3A4257;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 25%);
  mask-image:linear-gradient(to right,transparent 0,#000 25%);
}
.prompt-texto .claro{ color:#9aa0b0; }
.prompt-texto .cursor{ color:var(--destaque); animation:iaPisca 1s steps(1) infinite; font-weight:400; }
.mic{ position:absolute; right:112px; bottom:34px; width:26px; color:#4a5268; }
.enviar{
  position:absolute; right:28px; bottom:18px; width:60px; height:60px; border-radius:50%;
  display:grid; place-items:center; color:var(--titulo);
  background:radial-gradient(circle at 40% 35%, var(--botao-claro), var(--botao-escuro));
  box-shadow:0 0 0 1px rgba(255,255,255,.8) inset, 0 8px 24px rgba(255,90,0,.45);
  animation:iaPulse 2.4s infinite;
}
.enviar svg{ width:28px; }
.prompt .mao{ right:26px; bottom:16px; width:30px; }

@keyframes iaPisca{ 50%{ opacity:0; } }
@keyframes iaPulse{
  50%{ box-shadow:0 0 0 1px rgba(255,255,255,.8) inset, 0 0 0 10px rgba(255,90,0,.12), 0 8px 24px rgba(255,90,0,.45); }
}
@media (prefers-reduced-motion:reduce){
  .prompt-texto .cursor{ animation:none; }
  .enviar{ animation:none; }
}


@media (max-width:900px){
  .ia-grid{ grid-template-columns:1fr; }
  .ia-visual{ height:320px; }
  .prompt{ left:5%; right:5%; height:140px; top:28%; }
  .prompt-texto{ font-size:18px; top:26px; }
  .enviar{ width:48px; height:48px; right:18px; bottom:14px; }
  .mic{ right:84px; bottom:26px; width:22px; }
}
@media (max-width:640px){
  .ia-texto h3{ font-size:16px; }
  .ia-texto p{ font-size:12px; }
  .ia-link{ font-size:13px; }
}
/* ============================================================
   STEPS — lista numerada editorial (Como fazemos)
   ============================================================ */
.steps{ max-width:var(--container); margin:0 auto; padding:0 var(--gutter); position:relative; }
.steps::before{
  content:''; position:absolute; top:0; bottom:0; left:calc(var(--gutter) + 27px);
  width:1px; background:var(--border);
}
.step{ position:relative; display:grid; grid-template-columns:56px 1fr; gap:28px; padding:32px 0; border-bottom:1px solid var(--border); }
.step:first-child{ padding-top:0; }
.step__n{
  position:relative; font-family:var(--font-display); font-weight:700; font-size:1.4rem; color:var(--accent);
  background:var(--bg); width:56px; text-align:center;
}
.step__title{ font-family:var(--font-display); font-weight:600; font-size:1.2rem; letter-spacing:-.01em; color:var(--text); }
.step__text{ margin-top:8px; color:var(--text-dim); font-size:.96rem; line-height:1.6; max-width:56ch; }

@media (max-width:640px){
  .steps::before{ left:calc(var(--gutter) + 22px); }
  .step{ grid-template-columns:44px 1fr; gap:18px; }
  .step__n{ font-size:1.1rem; width:44px; }
}

/* ============================================================
   SOBRE 2 — clientes rolando (usado dentro do svc-feature__left)
   ============================================================ */
.sobre2__clientes{ background:var(--ink); border-radius:var(--r-card); height:340px; width:100%; max-width:370px; overflow:hidden; position:relative; }
.sobre2__clientes::before, .sobre2__clientes::after{ content:""; position:absolute; left:0; right:0; height:50px; z-index:2; }
.sobre2__clientes::before{ top:0; background:linear-gradient(var(--ink),transparent); }
.sobre2__clientes::after{ bottom:0; background:linear-gradient(transparent,var(--ink)); }
.sobre2__lista{ display:flex; flex-direction:column; animation:sobre2Scroll 14s linear infinite; }
.sobre2__lista span{
  font-family:var(--font-display); font-weight:500; font-size:32px; letter-spacing:-.03em;
  line-height:1.15; color:rgba(255,255,255,.35); white-space:nowrap; padding:12px 24px;
}
.sobre2__lista span.b{ color:#fff; }
.sobre2__lista span.dir{ text-align:right; }
@keyframes sobre2Scroll{ from{ transform:translateY(0); } to{ transform:translateY(-50%); } }
.sobre2__clientes:hover .sobre2__lista{ animation-play-state:paused; }

@media (max-width:800px){
  .sobre2__clientes{ height:280px; }
  .sobre2__lista span{ font-size:24px; }
}

/* ============================================================
   STAT INLINE — prova / resultado (número grande discreto)
   ============================================================ */
.stat-block{ max-width:var(--container); margin:0 auto; padding:0 var(--gutter); display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:center; }
.stat-block__figure{ font-family:var(--font-display); font-weight:700; font-size:clamp(3rem,5.952vw,5rem); letter-spacing:-.03em; color:var(--accent); line-height:1; }
.stat-block__label{ margin-top:12px; color:var(--text-dim); font-size:1rem; }
.stat-block__text{ color:var(--text-dim); font-size:1.02rem; line-height:1.75; }
.stat-block__text strong{ color:var(--text); font-weight:600; }
.stat-block__tags{ display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.stat-block__tags li{ font-size:.82rem; color:var(--text-dim); padding:8px 14px; border:1px solid var(--border-strong); border-radius:20px; }

@media (max-width:800px){
  .stat-block{ grid-template-columns:1fr; gap:24px; }
}

/* ============================================================
   SERVICE EXAMPLES (Sites / Automações — o que entregamos / pode ser automatizado)
   ============================================================ */
.svc-examples{ display:grid; grid-template-columns:repeat(4,1fr); gap:40px 32px; }
.svc-examples--steps{ grid-template-columns:repeat(3,1fr); }
.svc-example{
  padding-top:24px; border-top:1px solid var(--border);
  transition:border-color .3s var(--ease);
}
.svc-example:hover{ border-color:var(--accent-line); }
.svc-example__n{ display:block; font-family:var(--font-display); font-size:1.6rem; font-weight:600; letter-spacing:-.02em; color:var(--text-faint); margin-bottom:14px; }
.svc-example h4{ font-family:var(--font-display); font-weight:600; font-size:18px; letter-spacing:-.01em; color:var(--text); }
.svc-example p{ color:var(--text-dim); font-size:14px; line-height:24px; margin-top:8px; }

@media (max-width:900px){ .svc-examples{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .svc-examples{ grid-template-columns:1fr; } }

.svc-split{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start; }
.svc-split .svc-examples{ grid-template-columns:1fr; }
.svc-split .svc-examples--steps{ grid-template-columns:repeat(2,1fr); }
@media (max-width:760px){
  .svc-split{ grid-template-columns:1fr; gap:64px; }
}

.svc-feature{ display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:center; }
.svc-feature--reverse{ grid-template-columns:1.1fr .9fr; }
.svc-feature.container{ max-width:1040px; margin-left:auto; margin-right:auto; }
.svc-feature__title{
  font-family:var(--font-display); font-size:clamp(2rem,3.333vw,2.8rem); line-height:1.05;
}
.svc-feature__title .section-title__muted{ display:block; font-weight:500; letter-spacing:-.03em; }
.svc-feature__title .section-title__strong{ display:block; font-weight:600; letter-spacing:-.03em; }
.svc-feature__list{ display:flex; flex-direction:column; gap:36px; }
.svc-feature__item{ display:flex; align-items:flex-start; gap:18px; }
.about-text p{ font-family:var(--font-switzer); font-size:16px; line-height:1.7; letter-spacing:-.01em; color:var(--muted-sm); }
.about-text p strong{ color:var(--ink); font-weight:600; }
.svc-feature__icon{
  flex:none; width:44px; height:44px; border-radius:50%; background:var(--ink); color:#fff;
  display:flex; align-items:center; justify-content:center;
}
.svc-feature__icon svg{ width:20px; height:20px; }
.svc-feature__item h4{ font-family:var(--font-display); font-weight:600; font-size:18px; letter-spacing:-.01em; color:var(--text); }
.svc-feature__item p{ color:var(--text-dim); font-size:14px; line-height:22px; margin-top:4px; }

@media (max-width:860px){
  .svc-feature.container{ max-width:320px; margin-top:48px !important; margin-bottom:48px !important; }
  .svc-feature{ grid-template-columns:118px 1fr; gap:34px; align-items:center; }
  .svc-feature--reverse{ grid-template-columns:118px 1fr; }
  .svc-feature--reverse .svc-feature__left{ order:0; }
  .svc-feature__left{ min-width:0; transform:translateY(-7px); }
  .svc-feature__title{ font-size:16px; line-height:1.15; text-align:left; }
  .svc-feature__title .section-title__muted, .svc-feature__title .section-title__strong{ font-size:16px !important; }
  .svc-feature__list{ gap:14px; }
  .svc-feature__item{ gap:9px; flex-direction:row; align-items:flex-start; }
  .svc-feature__icon{ width:22px; height:22px; }
  .svc-feature__icon svg{ width:10px; height:10px; }
  .svc-feature__item h4{ font-size:11px; }
  .svc-feature__item p{ font-size:8.5px; line-height:13px; margin-top:2px; }
}

/* ============================================================
   PORTFOLIO CAROUSEL
   ============================================================ */
.port-carousel{ position:relative; }
.port-viewport{ overflow:hidden; }
.port-track{ display:flex; gap:28px; transition:transform .6s var(--ease); will-change:transform; cursor:grab; touch-action:pan-y; }
.port-track.is-dragging{ transition:none; cursor:grabbing; }
.port-slide{
  flex:0 0 auto; width:min(880px, 74vw); display:flex; flex-direction:column;
  opacity:.35; transition:opacity .5s var(--ease);
}
.port-slide.is-active{ opacity:1; }
.port-slide .port-card__frame{ pointer-events:none; }
.port-slide.is-active .port-card__frame{ pointer-events:auto; }
.port-slide .port-card__row{ opacity:0; visibility:hidden; transition:opacity .3s var(--ease), visibility .3s; }
.port-slide.is-active .port-card__row{ opacity:1; visibility:visible; }
.port-slide .port-card__desc{ opacity:0; visibility:hidden; transition:opacity .3s var(--ease), visibility .3s; }
.port-slide.is-active .port-card__desc{ opacity:1; visibility:visible; }
.port-card__frame{
  position:relative; display:block; overflow:hidden; border-radius:var(--r-card); border:1px solid var(--border);
  background:var(--bg-alt); aspect-ratio:16/10;
  transition:border-color .4s var(--ease), box-shadow .4s var(--ease);
  transform:translateZ(0); will-change:transform;
}
.port-card__frame:hover{ border-color:var(--accent-line); box-shadow:0 30px 60px -24px var(--shadow-strong); }
.port-card__frame > picture > img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:top center;
  transition:transform .7s var(--ease); user-select:none;
  backface-visibility:hidden; transform:translateZ(0);
}
.port-card__frame:hover > picture > img{ transform:scale(1.03); }
.port-card__frame--browser{ display:flex; flex-direction:column; background:#0A0A0A; }
.port-card__browser-bar{
  display:flex; align-items:center; gap:5px; padding:9px 10px;
  background:#161616; border-bottom:1px solid rgba(255,255,255,.08); flex-shrink:0;
}
.port-card__browser-dot{ width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.port-card__browser-tab{
  margin-left:6px; display:flex; align-items:center; gap:5px; height:18px; padding:0 9px; max-width:100%;
  border-radius:5px 5px 0 0; background:#0A0A0A; border:1px solid rgba(255,255,255,.08); border-bottom:none;
  font-family:var(--font-switzer); font-size:8px; font-weight:500; color:rgba(255,255,255,.6);
  overflow:hidden; white-space:nowrap;
}
.port-card__browser-favicon{ width:10px; height:10px; flex-shrink:0; object-fit:contain; }
.port-card__browser-tab span{ overflow:hidden; text-overflow:ellipsis; }
.port-card__browser-body{
  flex:1; display:flex; flex-direction:row; align-items:stretch; justify-content:flex-start;
  background:#0A0A0A; color:#fff; text-align:left; overflow:hidden;
}
.port-mock__main{
  flex:1; min-width:0; display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start;
  gap:10px; padding:14px;
}
/* app header — login / criar conta, padrão em todos os cards */
.port-mock__appbar{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin:-14px -14px 8px; padding:11px 14px; background:#0A0A0A; border-bottom:1px solid rgba(255,255,255,.1);
}
.port-mock__appbar-brand{
  display:flex; align-items:center; gap:7px; font-family:var(--font-logo); font-weight:600; font-size:11px; color:#fff;
}
.port-mock__appbar-brand img{ height:15px; width:auto; object-fit:contain; }
.port-mock__appbar-brand .is-accent{ color:var(--accent); }
.port-mock__appbar-divider{ width:1px; height:13px; background:rgba(255,255,255,.2); display:block; }
.port-mock__appbar-links{ display:flex; align-items:center; gap:10px; flex:1; padding-left:4px; }
.port-mock__appbar-links span{ font-size:8px; font-weight:500; color:rgba(255,255,255,.45); white-space:nowrap; }
.port-mock__appbar-nav{ display:flex; align-items:center; gap:7px; flex-shrink:0; }
.port-mock__appbar-nav span{ font-size:8px; font-weight:500; color:rgba(255,255,255,.5); white-space:nowrap; }
.port-mock__appbar-btn{
  background:var(--accent); color:#fff !important; padding:3px 8px; border-radius:999px; font-weight:600 !important;
}
.port-mock__head{ display:flex; align-items:center; gap:6px; color:rgba(255,255,255,.5); }
.port-mock__head svg{ width:13px; height:13px; flex-shrink:0; }
.port-mock__head span{ font-family:var(--font-display); font-weight:600; font-size:11px; color:#fff; }
.port-mock__label{ font-size:9px; color:rgba(255,255,255,.4); }
.port-mock__value{ font-family:var(--font-display); font-weight:600; font-size:19px; letter-spacing:-.02em; color:#fff; margin-top:2px; }
.port-mock__chart{ margin-top:8px; }
.port-mock__why{ margin-top:auto; padding-top:10px; border-top:1px solid rgba(255,255,255,.1); }
.port-mock__why b{ display:block; font-family:var(--font-display); font-weight:600; font-size:8.5px; color:#fff; margin-bottom:3px; }
.port-mock__why p{ font-size:8.5px; line-height:1.5; color:rgba(255,255,255,.5); }
.port-mock__chart-row{ display:flex; gap:5px; height:52px; }
.port-mock__chart-y{
  flex-shrink:0; display:flex; flex-direction:column; justify-content:space-between;
  font-family:var(--font-mono); font-size:6.5px; color:rgba(255,255,255,.35); text-align:right; padding:1px 0;
}
.port-mock__chart-area{ position:relative; flex:1; min-width:0; }
.port-mock__chart-grid{ position:absolute; inset:0; display:flex; flex-direction:column; justify-content:space-between; }
.port-mock__chart-grid i{ display:block; border-top:1px dashed rgba(255,255,255,.14); }
.port-mock__chart-area svg{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.port-mock__chart-x{
  display:flex; justify-content:space-between; margin-top:4px; padding-left:20px;
  font-family:var(--font-mono); font-size:6.5px; color:rgba(255,255,255,.35);
}
.port-mock__stats{ display:flex; gap:7px; }
.port-mock__stat{ flex:1; background:rgba(255,255,255,.06); border-radius:8px; padding:7px 9px; min-width:0; }
.port-mock__stat span{ display:block; font-size:7.5px; color:rgba(255,255,255,.4); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.port-mock__stat b{ display:block; font-family:var(--font-display); font-weight:600; font-size:12px; color:#fff; margin-top:2px; }

/* variações de conteúdo — cada automação com um layout diferente */
.port-mock__chip{ font-size:7px; font-weight:600; padding:2px 6px; border-radius:999px; white-space:nowrap; flex-shrink:0; }
.port-mock__chip.is-ok{ background:rgba(97,196,84,.18); color:#7FE070; }
.port-mock__chip.is-wait{ background:rgba(244,191,79,.18); color:#F4BF4F; }

/* estoque — lista com barra de nível */
.port-mock__list{ list-style:none; display:flex; flex-direction:column; gap:7px; }
.port-mock__list li{ display:flex; align-items:center; gap:7px; }
.port-mock__list li span{ font-size:8.5px; color:rgba(255,255,255,.65); flex:0 0 58px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.port-mock__bar{ flex:1; height:4px; border-radius:999px; background:rgba(255,255,255,.1); overflow:hidden; }
.port-mock__bar i{ display:block; height:100%; background:var(--accent); border-radius:999px; }
.port-mock__list li b{ font-family:var(--font-display); font-size:8.5px; color:#fff; flex-shrink:0; width:26px; text-align:right; }

/* agenda — horário + nome + status */
.port-mock__agenda{ list-style:none; display:flex; flex-direction:column; gap:7px; }
.port-mock__agenda li{ display:flex; align-items:center; gap:7px; }
.port-mock__agenda-time{ font-family:var(--font-mono); font-size:8px; color:rgba(255,255,255,.4); flex-shrink:0; width:30px; }
.port-mock__agenda-name{ font-size:8.5px; color:rgba(255,255,255,.75); flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* imóveis — cards de anúncio */
.port-mock__props{ display:flex; flex-direction:column; gap:6px; }
.port-mock__prop{ background:rgba(255,255,255,.05); border-radius:7px; padding:6px 8px; display:flex; flex-direction:column; gap:2px; }
.port-mock__prop-tag{ font-size:6.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); }
.port-mock__prop b{ font-family:var(--font-display); font-size:8.5px; color:#fff; font-weight:600; }
.port-mock__prop span:last-child{ font-size:7.5px; color:rgba(255,255,255,.45); }

/* financeiro — lista de faturas */
.port-mock__invoice{ list-style:none; display:flex; flex-direction:column; gap:7px; }
.port-mock__invoice li{ display:flex; align-items:center; gap:7px; }
.port-mock__invoice li span:first-child{ font-size:8.5px; color:rgba(255,255,255,.7); flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.port-mock__invoice li b{ font-family:var(--font-display); font-size:8px; color:#fff; flex-shrink:0; }

/* pedidos — checklist */
.port-mock__check{ list-style:none; display:flex; flex-direction:column; gap:7px; }
.port-mock__check li{ display:flex; align-items:center; gap:7px; font-size:8.5px; color:rgba(255,255,255,.4); }
.port-mock__check li.is-done{ color:rgba(255,255,255,.75); }
.port-mock__check-ico{
  width:13px; height:13px; border-radius:50%; border:1px solid rgba(255,255,255,.25); flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:8px; color:transparent;
}
.port-mock__check li.is-done .port-mock__check-ico{ background:var(--accent); border-color:var(--accent); color:#fff; }

/* prontuários — arquivos */
.port-mock__files{ list-style:none; display:flex; flex-direction:column; gap:7px; }
.port-mock__files li{ display:flex; align-items:center; gap:7px; }
.port-mock__files li svg{ width:13px; height:13px; color:rgba(255,255,255,.4); flex-shrink:0; }
.port-mock__files li span{ font-size:8.5px; color:rgba(255,255,255,.75); flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.port-mock__files li small{ font-size:7px; color:rgba(255,255,255,.4); flex-shrink:0; }
.port-card__row{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-top:16px; }
.port-card__title{ font-family:var(--font-display); font-weight:600; font-size:1.05rem; letter-spacing:-.01em; color:var(--text); }
.port-card__tag{ display:block; font-family:var(--font-mono); font-size:.74rem; letter-spacing:.04em; color:var(--text-faint); margin-top:4px; }
.port-card__desc{ color:var(--text-dim); font-size:.92rem; line-height:1.6; margin-top:10px; max-width:56ch; }
.port-card__link{
  display:flex; align-items:center; gap:4px; font-family:var(--font-switzer); font-weight:600; font-size:.85rem;
  color:var(--text); white-space:nowrap; flex-shrink:0; margin-top:2px; transition:color .3s var(--ease);
}
.port-card__link:hover{ color:var(--accent); }


.port-carousel__controls{ display:flex; align-items:center; justify-content:center; gap:20px; margin-top:40px; position:relative; z-index:5; }
.port-carousel__btn{
  width:40px; height:40px; border:none; background:none; padding:0;
  display:flex; align-items:center; justify-content:center; color:var(--text-faint); cursor:pointer;
  transition:color .3s var(--ease), transform .3s var(--ease);
  position:relative; z-index:5; pointer-events:auto;
}
.port-carousel__btn svg{ width:13px; height:13px; stroke-width:1.6; pointer-events:none; }
.port-carousel__btn:hover{ color:var(--text); transform:scale(1.15); }
.port-carousel__btn:active{ transform:scale(.92); }

@media (max-width:900px){
  .port-slide{ width:82vw; }
  .port-card__title{ font-size:.88rem; }
  .port-card__tag{ font-size:.64rem; }
}

.port-carousel--compact .port-slide{ width:min(360px, 58vw); opacity:1; }
.port-carousel--compact .port-card__frame{ aspect-ratio:1/1.05; filter:brightness(.6); transition:filter .4s var(--ease); }
.port-carousel--compact .port-slide.is-active .port-card__frame{ filter:brightness(1); }
.port-carousel--compact .port-card__row{ justify-content:center; text-align:center; }
.port-carousel--compact .port-card__desc{ text-align:center; margin-left:auto; margin-right:auto; }
@media (max-width:900px){
  .port-carousel--compact .port-slide{ width:72vw; }
  .port-carousel--compact .port-mock__main{ transform:scale(.78); transform-origin:top center; }
  .port-carousel--compact .port-card__title{ font-size:.88rem; }
  .port-carousel--compact .port-card__tag{ font-size:.64rem; }
  .port-carousel--compact .port-card__desc{ font-size:.78rem; line-height:1.5; }
}
@media (max-width:560px){
  .port-carousel--compact .port-slide{ width:72vw; }
}

/* ============================================================
   FAQ — split 2 colunas (título à esquerda, acordeão à direita), 518px + 518px
   ============================================================ */
.faq-split{
  display:grid; grid-template-columns:1fr 1fr; gap:36px; align-items:start;
  max-width:var(--container); margin:0 auto; padding:0 var(--gutter);
}
.faq-split__head{ max-width:518px; }
.faq-split__head .section-title{ margin-top:16px; }
.faq-split--center{ display:block; }
.faq-split--center .faq__list{ max-width:640px; margin:0 auto; }
.faq__list{ max-width:518px; margin:0; padding:0; border-top:1px solid var(--border); }
.faq__item{ border-bottom:1px solid var(--border); }
.faq__question{
  width:100%; display:flex; align-items:center; gap:20px;
  padding:26px 0; text-align:left; cursor:pointer;
  font-family:var(--font-display); font-weight:600; font-size:1.05rem; color:var(--text);
  transition:color .3s;
}
.faq__question:hover{ color:var(--accent); }
.faq__n{
  flex-shrink:0; width:28px; font-family:var(--font-mono); font-weight:500; font-size:.85rem;
  color:var(--text-faint);
}
.faq__question span:not(.faq__n){ flex:1; }
.faq__icon{ width:20px; height:20px; color:var(--accent); flex-shrink:0; transition:transform .3s var(--ease); }
.faq__item.is-open .faq__icon{ transform:rotate(180deg); }
.faq__answer{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .35s var(--ease); }
.faq__item.is-open .faq__answer{ grid-template-rows:1fr; }
.faq__answer-inner{ overflow:hidden; }
.faq__answer-inner p{ padding-bottom:24px; color:var(--text-dim); font-size:.95rem; line-height:1.65; max-width:68ch; }

@media (max-width:900px){
  .faq-split{ grid-template-columns:1fr; gap:24px; }
  .faq-split__head, .faq__list{ max-width:none; }
}
@media (max-width:640px){
  .faq__question{ padding:16px 0; gap:12px; font-size:.85rem; }
  .faq__n{ width:20px; font-size:.7rem; }
  .faq__icon{ width:16px; height:16px; }
  .faq__answer-inner p{ padding-bottom:16px; font-size:.78rem; line-height:1.5; }
}

/* ============================================================
   CTA FINAL / BANDS
   ============================================================ */
.cta-final{
  padding:clamp(64px,8.929vw,120px) 0; background:var(--bg); border-top:1px solid var(--border); text-align:center;
}
.cta-final__inner{ max-width:640px; margin:0 auto; padding:0 var(--gutter); }
.cta-final__inner h2{
  font-family:var(--font-display); font-weight:600; font-size:clamp(1.7rem,2.857vw,2.4rem);
  letter-spacing:-.02em; line-height:1.15; color:var(--text);
}
.cta-final__inner p{ margin-top:16px; color:var(--text-dim); font-size:1.02rem; line-height:1.6; }
.cta-final__inner .btn--solid{ margin-top:32px; }

/* ============================================================
   CONTACT
   ============================================================ */
.contact{
  padding:clamp(64px,8.929vw,120px) 0; min-height:100svh; box-sizing:border-box;
  display:flex; flex-direction:column; justify-content:center;
}
.contact__inner{
  position:relative; z-index:1; max-width:var(--container); margin:0 auto; padding:0 var(--gutter);
  display:grid; grid-template-columns:.8fr 1.2fr; gap:56px; align-items:start;
}
.contact__inner--solo{ display:block; max-width:640px; }
.contact__side{ display:flex; flex-direction:column; gap:32px; }
.contact__side--row{
  flex-direction:row; flex-wrap:nowrap; justify-content:center; align-items:center; gap:48px;
  margin-top:64px; padding-top:40px; border-top:1px solid var(--border);
}
.contact__box{
  display:flex; align-items:center; gap:12px;
  text-decoration:none; transition:opacity .3s var(--ease), transform .3s var(--ease);
}
.contact__box > span:last-child{ display:flex; flex-direction:column; gap:4px; }
.contact__box:hover{ opacity:.7; transform:translateY(-2px); }
.contact__side--row .svc-feature__icon{ width:36px; height:36px; flex-shrink:0; }
.contact__side--row .svc-feature__icon svg{ width:16px; height:16px; }
.contact__side--row .contact__label{ font-size:.65rem; }
.contact__side--row .contact__value{ font-size:.92rem; white-space:nowrap; font-weight:600; }
@media (max-width:640px){
  .contact__side--row{
    flex-direction:column; flex-wrap:nowrap; justify-content:flex-start; align-items:flex-start;
    gap:22px; margin-top:36px; padding-top:24px;
  }
  .contact__box{ flex:0 0 auto; gap:12px; }
  .contact__side--row .svc-feature__icon{ width:32px; height:32px; }
  .contact__side--row .svc-feature__icon svg{ width:14px; height:14px; }
  .contact__side--row .contact__label{ font-size:.62rem; white-space:nowrap; }
  .contact__side--row .contact__value{ font-size:.92rem; white-space:nowrap; }
}
.contact__block{ display:flex; align-items:flex-start; gap:16px; }
.contact__block > div{ display:flex; flex-direction:column; gap:6px; }
.contact__label{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--text-faint); }
.contact__value{ font-family:var(--font-switzer); font-size:1.05rem; font-weight:500; color:var(--text); transition:color .3s; }
.contact__value:hover{ color:var(--accent); }
.contact__block .btn{ align-self:flex-start; margin-top:2px; }

.contact__form{ display:grid; grid-template-columns:1fr 1fr; gap:20px 20px; }
.contact__form[hidden]{ display:none; }
.contact__success{
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px;
  background:var(--bg); border:none; border-radius:var(--r-card);
  padding:36px 32px; width:100%; max-width:460px; margin:0 auto;
}
.contact__success[hidden]{ display:none; }
.contact__success-icon{ width:32px; height:32px; color:var(--accent); margin-bottom:4px; }
.contact__success h3{ font-family:var(--font-display); font-size:clamp(1.3rem,2vw,1.7rem); font-weight:600; letter-spacing:-.03em; line-height:1.15; color:var(--text); margin-bottom:8px; }
.contact__success p{ color:var(--text-dim); font-size:.9rem; line-height:1.6; white-space:nowrap; margin-bottom:18px; }
.contact__success .btn{ margin-top:2px; padding:9px 18px; font-size:.78rem; border-radius:8px; }
@media (max-width:640px){
  .contact__success{ padding:32px 12px; max-width:100%; }
  .contact__success p{ font-size:.72rem; }
}
@media (max-width:360px){
  .contact__success p{ font-size:.64rem; }
}
.field{ display:flex; flex-direction:column; gap:8px; }
.field--full{ grid-column:1 / -1; }
.field--hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.field label{ font-family:var(--font-body); font-size:.85rem; font-weight:500; letter-spacing:-.01em; text-transform:none; color:var(--text-dim); }
.field input, .field textarea{
  border:1px solid var(--border-strong); border-radius:11px; padding:13px 15px; font-size:.95rem;
  background:var(--glass-1); color:var(--text); transition:border-color .3s, box-shadow .3s, background .3s;
}
.field input:focus, .field textarea:focus{
  border-color:rgba(255,90,31,.5); background:var(--glass-2);
  box-shadow:0 0 0 4px rgba(255,90,31,.12); outline:none;
}
.field textarea{ resize:vertical; font-family:inherit; }
.field input::placeholder, .field textarea::placeholder{ color:var(--text-faint); opacity:1; }
.field input.is-invalid, .field textarea.is-invalid{ border-color:#DC2626; }
.field__error{ font-size:.8rem; color:#DC2626; min-height:0; display:none; }
.field__error:not(:empty){ display:block; }
.form-status{ font-family:var(--font-mono); font-size:.8rem; color:var(--accent); min-height:1.2em; }
.form-status.is-error{ color:#DC2626; }
.form-privacy{ font-family:var(--font-switzer); font-size:.8rem; line-height:1.5; color:var(--text-faint); }
.form-privacy a{ color:var(--text-dim); text-decoration:underline; text-underline-offset:2px; transition:color .3s; }
.form-privacy a:hover, .form-privacy a:focus-visible{ color:var(--accent); }

@media (max-width:900px){
  .contact__inner{ grid-template-columns:1fr; gap:20px; }
  .contact__form{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .contact__form{ grid-template-columns:1fr 1fr; gap:12px 10px; }
  .field{ gap:5px; }
  .field label{ font-size:.78rem; }
  .field input, .field textarea{ padding:9px 10px; font-size:.78rem; border-radius:9px; }
  .field textarea{ min-height:80px; }
  .btn--solid.field--full{ height:42px; font-size:.85rem; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ position:relative; overflow:hidden; border-top:1px solid var(--border); padding:clamp(56px,7.5vw,96px) 0 0; background:var(--bg-alt); }
/* assinatura final: wordmark gigante sangrando no rodapé, igual referência de estúdio premium */
.footer__giant{
  margin-top:40px; text-align:center; font-family:var(--font-logo); font-weight:800;
  font-size:clamp(3.5rem, 13.095vw, 11rem); line-height:.85; letter-spacing:-.03em;
  color:var(--text); opacity:.08; white-space:nowrap; pointer-events:none; user-select:none;
  transform:translateY(28%);
}
.footer__giant span{ color:var(--accent); }
.footer__inner{ max-width:var(--container); margin:0 auto; padding:0 var(--gutter); }
.footer__top{ display:flex; flex-direction:row; flex-wrap:wrap; align-items:flex-start; justify-content:center; text-align:left; gap:56px; max-width:900px; margin:0 auto; padding-bottom:48px; }
.footer__logo{ padding-top:2px; }
.footer__logo .nav__mark{ height:40px; }
.footer__logo .nav__logo-img{ height:34px; }

.footer__col{ display:flex; flex-direction:column; gap:18px; padding-left:40px; border-left:1px solid var(--border); }
.footer__col-label{
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--accent); font-weight:600;
}
.footer__menu-cols{ display:flex; flex-direction:column; gap:10px; justify-content:flex-start; }
.footer__menu-col{ display:flex; flex-direction:column; gap:10px; align-items:flex-start; }
.footer__menu-col a{ font-size:.85rem; font-weight:400; color:var(--text); transition:color .3s; }
.footer__menu-col a:hover, .footer__menu-col a:focus-visible{ color:var(--accent); }

.footer__contact-dark{ display:flex; flex-direction:column; align-items:flex-start; gap:20px; }
.footer__contact-item{ display:flex; flex-direction:column; align-items:flex-start; gap:7px; }
.footer__contact-label{
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--text-faint); font-weight:400;
}
.footer__contact-item a{ color:var(--text); font-weight:600; font-size:.85rem; transition:color .3s; }
.footer__contact-item a:hover, .footer__contact-item a:focus-visible{ color:var(--accent); }
.footer__social-icons{ display:flex; gap:10px; }
.footer__contact-item .footer__social-icon{
  width:34px; height:34px; border-radius:50%; background:var(--accent); color:#fff;
  display:flex; align-items:center; justify-content:center; transition:opacity .3s var(--ease), transform .3s var(--ease);
}
.footer__social-icon:hover, .footer__social-icon:focus-visible{ opacity:.82; transform:translateY(-2px); }
.footer__social-icon svg{ width:15px; height:15px; }

.footer__bottom{
  padding:24px 0; display:flex; align-items:center; justify-content:center; gap:10px 28px; flex-wrap:wrap; min-height:92px; box-sizing:border-box;
  border-top:1px solid var(--border); font-family:var(--font-mono); font-size:.76rem; color:var(--text-faint);
}
.footer__legal-links{ display:flex; gap:20px; }
.footer__legal-links a{ color:var(--text-faint); transition:color .3s; }
.footer__legal-links a:hover, .footer__legal-links a:focus-visible{ color:var(--accent); }

@media (max-width:640px){
  .footer__top{ flex-direction:column; align-items:flex-start; max-width:none; margin:0; gap:32px; }
  .footer__logo{ align-self:flex-start; margin-right:0; }
  .footer__col{ padding-left:0; border-left:none; gap:14px; }
  .footer__menu-cols{ flex-direction:column; gap:10px; }
  .footer__bottom{ justify-content:flex-start; }
}

/* ============================================================
   PÁGINAS LEGAIS (Política de Privacidade / Termos de Uso) —
   documento longo: cabeçalho com versão, resumo, sumário, tabelas
   que viram cards no mobile e folha de impressão. Só tokens do site.
   ============================================================ */
.legal-header{
  border-bottom:1px solid var(--border); padding:20px 0;
}
.legal-header__inner{ display:flex; align-items:center; justify-content:space-between; gap:16px; }
.legal-header__back{
  display:flex; align-items:center; gap:6px; font-family:var(--font-switzer); font-size:.9rem; font-weight:600;
  color:var(--text-dim); transition:color .3s;
}
.legal-header__back:hover, .legal-header__back:focus-visible{ color:var(--accent); }
.legal-header__back svg{ width:16px; height:16px; }

.legal{ --legal-accent-text:color-mix(in srgb, var(--accent-deep) 85%, #000); padding:clamp(56px,8vw,96px) 0 clamp(72px,10vw,120px); }
.legal__container{ display:block; max-width:780px; margin:0 auto; padding:0 var(--gutter); }
.legal__eyebrow{
  font-family:var(--font-mono); font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; color:var(--legal-accent-text); font-weight:600;
}
.legal__title{
  font-family:var(--font-display); font-weight:600; font-size:clamp(2rem,4vw,2.8rem); letter-spacing:-.02em;
  color:var(--text); margin-top:12px;
}
.legal__meta{
  display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:12px;
  font-family:var(--font-switzer); font-size:.9rem; color:var(--text-dim);
}
.legal__meta span + span::before{ content:"·"; margin-right:16px; color:var(--border-strong); }
.legal__print{
  display:inline-flex; align-items:center; gap:8px; margin-top:20px; padding:8px 14px;
  border:1px solid var(--border-strong); border-radius:var(--r-btn); background:transparent; cursor:pointer;
  font-family:var(--font-switzer); font-size:.85rem; font-weight:600; color:var(--text-dim); transition:color .3s, border-color .3s;
}
.legal__print[hidden]{ display:none; }
.legal__print:hover, .legal__print:focus-visible{ color:var(--accent); border-color:var(--accent-line); }
.legal__print svg{ width:16px; height:16px; }

/* Resumo em linguagem simples */
.legal__summary{
  margin-top:40px; padding:24px 28px; background:var(--surface); border:1px solid var(--border);
  border-radius:var(--r-card); box-shadow:0 1px 2px var(--shadow);
}
.legal__summary-title{
  font-family:var(--font-display); font-weight:600; font-size:1.05rem; letter-spacing:-.01em; color:var(--text);
}
.legal__summary ul{ margin-top:14px; display:flex; flex-direction:column; gap:10px; }
.legal__summary li{
  font-family:var(--font-switzer); font-size:.97rem; line-height:1.6; color:var(--text-dim);
  padding-left:20px; position:relative;
}
.legal__summary li::before{
  content:""; position:absolute; left:0; top:.6em; width:6px; height:6px; border-radius:50%; background:var(--accent);
}
.legal__summary a{ color:var(--text); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.legal__summary a:hover, .legal__summary a:focus-visible{ color:var(--accent); }
.legal__summary-note{ margin-top:14px; font-family:var(--font-switzer); font-size:.85rem; color:var(--text-dim); }

/* Sumário — numeração nativa (respeita <ol start>) */
.legal__toc{ margin-top:32px; padding-bottom:32px; border-bottom:1px solid var(--border); }
.legal__toc-title{
  font-family:var(--font-mono); font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; color:var(--text-dim); font-weight:600;
}
.legal__toc-part{ margin-top:18px; font-family:var(--font-switzer); font-size:.85rem; font-weight:600; color:var(--text); }
.legal__toc ol{ margin-top:12px; columns:2; column-gap:40px; list-style:decimal; padding-left:1.8em; }
.legal__toc li{ break-inside:avoid; padding:4px 0 4px 4px; font-family:var(--font-switzer); font-size:.95rem; line-height:1.45; }
.legal__toc li::marker{ color:var(--text-dim); font-variant-numeric:tabular-nums; }
.legal__toc a{ color:var(--text-dim); transition:color .3s; }
.legal__toc a:hover, .legal__toc a:focus-visible{ color:var(--accent); }

/* Corpo do documento */
.legal__body{ margin-top:48px; display:flex; flex-direction:column; gap:40px; }
.legal__body section{ scroll-margin-top:24px; }
.legal__body h2{
  font-family:var(--font-display); font-weight:600; font-size:1.35rem; letter-spacing:-.01em; color:var(--text);
}
.legal__body h3{
  margin-top:24px; font-family:var(--font-display); font-weight:600; font-size:1.05rem; color:var(--text);
}
.legal__body p{ font-family:var(--font-switzer); font-size:1rem; line-height:1.75; color:var(--muted-sm); margin-top:12px; }
.legal__body section > ul, .legal__body section > ol, .legal__highlight ul{ margin-top:12px; display:flex; flex-direction:column; gap:8px; }
.legal__body section > ul > li, .legal__highlight li{
  font-family:var(--font-switzer); font-size:1rem; line-height:1.65; color:var(--muted-sm);
  padding-left:20px; position:relative;
}
.legal__body section > ul > li::before, .legal__highlight li::before{
  content:""; position:absolute; left:0; top:.65em; width:6px; height:6px; border-radius:50%; background:var(--accent);
}
.legal__body strong{ color:var(--text); font-weight:600; }
.legal__body a{ color:var(--text); font-weight:600; text-decoration:underline; text-underline-offset:2px; transition:color .3s; }
.legal__body a:hover, .legal__body a:focus-visible{ color:var(--accent); }
.legal__body code{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.85em; overflow-wrap:anywhere; }

/* Lista numerada de etapas */
.legal__steps{ list-style:decimal; padding-left:1.4em; }
.legal__steps li{ font-family:var(--font-switzer); font-size:1rem; line-height:1.65; color:var(--muted-sm); padding-left:6px; }
.legal__steps li::marker{ color:var(--accent); font-weight:600; }

/* Divisor de partes (Termos: Parte I / Parte II) */
.legal__body .legal__part{
  margin-top:8px; padding-top:20px; border-top:1px solid var(--border-strong);
  font-family:var(--font-mono); font-size:.76rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--legal-accent-text); font-weight:600;
}
.legal__body > .legal__part:first-child{ margin-top:0; padding-top:0; border-top:0; }

/* Ficha de identificação do fornecedor */
.legal__facts{ margin-top:16px; border:1px solid var(--border); border-radius:var(--r-card); background:var(--surface); }
.legal__facts > div{ display:grid; grid-template-columns:180px 1fr; gap:12px; padding:12px 18px; border-bottom:1px solid var(--border); }
.legal__facts > div:last-child{ border-bottom:0; }
.legal__facts dt{ font-family:var(--font-switzer); font-size:.85rem; font-weight:600; color:var(--text-dim); }
.legal__facts dd{ font-family:var(--font-switzer); font-size:.95rem; color:var(--text); }
.legal__facts a{ color:var(--text); font-weight:600; text-decoration:underline; text-underline-offset:2px; }

/* Dado jurídico pendente — propositalmente chamativo para não passar despercebido */
.legal__placeholder{
  background:#FFF4D6; color:#7A4B00; border:1px dashed #D99A00; border-radius:6px; padding:1px 6px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.85em; font-weight:600;
}

/* Cláusulas limitativas em destaque (CDC art. 54, § 4º) */
.legal__highlight{
  margin-top:16px; padding:20px 22px; background:var(--accent-soft); border:1px solid var(--accent-line); border-radius:var(--r-card);
}
.legal__body .legal__highlight-title{
  margin-top:0; font-family:var(--font-display); font-weight:600; font-size:1rem; color:var(--text);
}
.legal__highlight li{ color:var(--text-dim); }

/* Canal de privacidade */
.legal__contact{
  margin-top:16px; padding:20px 22px; background:var(--surface); border:1px solid var(--border); border-radius:var(--r-card);
}
.legal__contact .legal__contact-label{
  margin-top:0; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600; color:var(--legal-accent-text);
}
.legal__contact .legal__contact-main{ margin-top:6px; font-size:1.15rem; }
.legal__contact .legal__contact-note{ margin-top:6px; font-size:.9rem; line-height:1.55; }

/* Tabelas — viram cards empilhados no mobile */
.legal__table-wrap{ margin-top:20px; border:1px solid var(--border); border-radius:var(--r-card); overflow:hidden; background:var(--surface); }
.legal__table{ width:100%; border-collapse:collapse; font-family:var(--font-switzer); font-size:.9rem; line-height:1.55; }
.legal__table th, .legal__table td{ padding:14px 16px; text-align:left; vertical-align:top; border-bottom:1px solid var(--border); }
.legal__table thead th{
  font-size:.74rem; letter-spacing:.08em; text-transform:uppercase; font-weight:600; color:var(--text-dim); background:var(--bg);
}
.legal__table tbody th{ font-weight:600; color:var(--text); }
.legal__table tbody th a{ font-weight:500; }
.legal__table td{ color:var(--muted-sm); }
.legal__table tbody tr:last-child th, .legal__table tbody tr:last-child td{ border-bottom:0; }

.visually-hidden{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

@media (max-width:640px){
  .legal{ padding:40px 0 64px; }
  .legal__body{ gap:32px; }
  .legal__summary{ margin-top:28px; padding:20px; }
  .legal__toc ol{ columns:1; }
  .legal__facts > div{ grid-template-columns:1fr; gap:2px; }
  .legal__table-wrap{ border:0; border-radius:0; background:none; overflow:visible; }
  .legal__table thead{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .legal__table, .legal__table tbody, .legal__table tr, .legal__table th, .legal__table td{ display:block; width:100%; }
  .legal__table tr{ background:var(--surface); border:1px solid var(--border); border-radius:var(--r-card); padding:6px 0; }
  .legal__table tr + tr{ margin-top:12px; }
  .legal__table th, .legal__table td{ border-bottom:0; padding:8px 16px; }
  .legal__table td::before, .legal__table tbody th::before{
    content:attr(data-label); display:block; font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; font-weight:600; color:var(--text-dim); margin-bottom:2px;
  }
}

/* Impressão / salvar em PDF: só o documento, em preto no branco */
@media print{
  .legal-header, .footer, .contact-bar, .legal__print{ display:none !important; }
  body{ background:#fff !important; }
  .legal{ padding:0; }
  .legal__container{ max-width:none; padding:0; }
  .legal__title, .legal__body h2, .legal__body h3, .legal__body p, .legal__body li, .legal__summary li,
  .legal__table td, .legal__table th, .legal__toc a{ color:#000 !important; }
  .legal__summary, .legal__table-wrap, .legal__facts, .legal__contact, .legal__highlight{ box-shadow:none; background:#fff; border-color:#999; }
  .legal__body section, .legal__table tr, .legal__summary, .legal__highlight{ break-inside:avoid; }
  .legal__body h2{ break-after:avoid; }
  .legal__body a[href^="http"]::after{ content:" (" attr(href) ")"; font-weight:400; font-size:.8em; word-break:break-all; }
}

/* ============================================================
   BARRA DE CONTATO FLUTUANTE — pílula com texto + 2 atalhos, some perto do footer
   ============================================================ */
.contact-bar{
  position:fixed; z-index:800; bottom:18px; left:50%; transform:translateX(-50%);
  display:flex; align-items:center; gap:6px; padding:6px 6px 6px 14px;
  border-radius:999px; border:1px solid rgba(255,255,255,.12);
  background:rgba(10,10,12,.7); backdrop-filter:blur(16px) saturate(1.3); -webkit-backdrop-filter:blur(16px) saturate(1.3);
  box-shadow:0 20px 40px -20px rgba(0,0,0,.6);
  transition:opacity .3s var(--ease), transform .3s var(--ease), visibility .3s;
}
.contact-bar.is-hidden{ opacity:0; visibility:hidden; transform:translateX(-50%) translateY(16px); }
.contact-bar__text{ display:flex; flex-direction:column; font-size:.68rem; color:rgba(255,255,255,.65); white-space:nowrap; }
.contact-bar__text strong{ color:#fff; font-weight:600; font-size:.74rem; }
.contact-bar__btn{
  display:flex; align-items:center; gap:0; height:32px; width:32px; padding:0;
  border-radius:999px; flex-shrink:0; overflow:hidden;
  transition:background .3s var(--ease), padding .3s var(--ease), width .3s var(--ease), gap .3s var(--ease);
}
.contact-bar__btn svg{ width:32px; height:32px; padding:9px; box-sizing:border-box; flex-shrink:0; }
.contact-bar__btn span{
  max-width:0; overflow:hidden; white-space:nowrap; font-size:.72rem; font-weight:600;
  transition:max-width .3s var(--ease);
}
.contact-bar:hover .contact-bar__btn{ width:auto; padding:0 12px 0 0; gap:6px; }
.contact-bar:hover .contact-bar__btn span{ max-width:100px; }
.contact-bar__btn--wpp{ background:#25D366; color:#fff; }
.contact-bar__btn--form{ background:rgba(255,255,255,.1); color:#fff; }

/* ============================================================
   SECTION WRAPPERS (paddings/borders comuns entre páginas)
   ============================================================ */
.container{ width:100%; max-width:var(--container); margin:0 auto; padding:0 var(--gutter); box-sizing:border-box; }
.section{
  padding:clamp(64px,8.929vw,120px) 0; min-height:100svh; box-sizing:border-box;
  display:flex; flex-direction:column; justify-content:center;
}
.section--alt{ background:var(--bg-alt); }
.section--border-top{ border-top:none; }

/* ============================================================
   TEMA CLARO — alterna com as seções escuras ao rolar a página
   ============================================================ */
.section--light{
  --bg: #F4F1EB;
  --bg-alt: #F4F1EB;
  --surface: #FFFFFF;
  --surface-2: #F4F1EB;
  --border: rgba(20,20,15,.08);
  --border-strong: rgba(20,20,15,.15);
  --text: #16160F;
  --text-dim: #5B5C52;
  --text-faint: #8C8D80;
  --shadow: rgba(20,20,15,.1);
  --shadow-strong: rgba(20,20,15,.16);

  --glass-1: rgba(20,20,15,.025);
  --glass-2: rgba(20,20,15,.035);
  --glass-3: rgba(20,20,15,.045);
  --glass-border: rgba(20,20,15,.08);
  --glass-border-2: rgba(20,20,15,.1);
  --glass-border-strong: rgba(20,20,15,.15);
  --glass-border-strong-2: rgba(20,20,15,.2);

  --title-grad-a: #16160F;
  --title-grad-b: #55564C;

  background:var(--bg); color:var(--text);
}
.section--light.section--alt{ background:var(--bg-alt); }

/* ============================================================
   SOBRE — vídeo centralizado + tópicos em linha
   ============================================================ */
.sobre-stack{ display:flex; flex-direction:column; align-items:center; gap:68px; }
.sobre-stack__video{ display:flex; justify-content:center; width:100%; max-width:370px; }
@media (max-width:640px){
  .sobre-stack__video{ max-width:300px; }
}
.diff-row{
  display:grid; grid-template-columns:repeat(3,1fr); gap:48px;
  max-width:980px; margin-left:auto; margin-right:auto; text-align:center;
}
.diff-row__item{
  padding:20px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border);
  transition:border-color .3s var(--ease);
}
.diff-row__item:hover{ border-color:var(--accent-line); }
.diff-row__item h4{
  font-family:var(--font-display); font-weight:600; letter-spacing:-.03em; line-height:1.15;
  font-size:clamp(1.2rem,1.786vw,1.5rem); color:var(--ink);
}
.diff-row__muted{ color:var(--text-faint); font-weight:500; }
.diff-row__item p{
  font-family:var(--font-switzer); font-size:15px; font-weight:500; line-height:24px;
  letter-spacing:-0.01em; color:var(--ink); margin-top:8px;
}
@media (max-width:1024.98px){
  .diff-row__item h4{ font-size:16px; }
  .diff-row__item p{ font-size:11px; line-height:17px; }
}
@media (max-width:860px){
  .diff-row{ grid-template-columns:1fr; gap:0; }
  .diff-row__item{ padding:24px 8px; border-top:none; }
  .diff-row__item:first-child{ border-top:1px solid var(--border); }
}

/* ============================================================
   SHOWREEL (Sobre) — apresentação institucional, 9 cenas
   ============================================================ */
.sr{
  width:100%; max-width:370px; aspect-ratio:370/480;
  background:#0A0A0A; border-radius:var(--r-card); color:var(--ink); position:relative;
  font-family:var(--font-display); container-type:size;
  --ink:#fff; --text-dim:rgba(255,255,255,.6); --muted-sm:rgba(255,255,255,.55);
  --text-faint:rgba(255,255,255,.4); --border:rgba(255,255,255,.12); --border-strong:rgba(255,255,255,.22);
  --bg:#0A0A0A;
}
.sr *{ box-sizing:border-box; margin:0; padding:0; }
.sr .sr-c{
  position:absolute; inset:0; opacity:0; display:flex; flex-direction:column;
  justify-content:center; padding:9cqw; gap:4.5cqw;
  transition:opacity .8s ease, transform .8s ease; transform:scale(1.015);
}
.sr .sr-c.on{ opacity:1; transform:scale(1); }
.sr .sr-c--center{ align-items:center; text-align:center; }

/* elementos comuns */
.sr .sr-eyebrow{
  display:flex; align-items:center; gap:2.6cqw; font-size:2.7cqw; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--text-dim);
}
.sr .sr-eyebrow::before{ content:""; width:4.5cqw; height:1px; background:var(--accent); }
.sr .sr-c--center .sr-eyebrow{ justify-content:center; }
.sr .sr-c.on .sr-eyebrow{ animation:srFadeUp .7s .05s both; }
.sr .sr-head{ display:flex; flex-direction:column; gap:3cqw; }
.sr .sr-bar{ display:block; width:0; height:1.4cqw; background:var(--ink); border-radius:1px; }
.sr .sr-c.on .sr-bar{ animation:srBarGrow .6s .3s cubic-bezier(.4,0,.2,1) both; }
@keyframes srBarGrow{ to{ width:11cqw; } }
.sr .sr-title{
  font-family:var(--font-display); font-weight:600; letter-spacing:-.03em; line-height:1.15;
  font-size:7.6cqw; color:var(--ink);
}
.sr .sr-c.on .sr-title{ animation:srMask .8s .12s both; }
.sr .sr-text{
  font-family:var(--font-switzer); font-size:3.6cqw; font-weight:500; line-height:1.6;
  letter-spacing:-.01em; color:var(--muted-sm); max-width:48cqw;
}
.sr .sr-c--center .sr-text{ max-width:62cqw; margin:0 auto; }
.sr .sr-c.on .sr-text{ animation:srFadeUp .8s .3s both; }

/* 01. abertura / 08. resultado */
.sr .sr-stmt{
  font-family:var(--font-display); font-weight:600; letter-spacing:-.035em; line-height:1.18;
  font-size:8.4cqw; color:var(--ink);
}
.sr .sr-stmt em{ font-style:normal; color:var(--accent); }
.sr .sr-stmt--sm{ font-size:5cqw; font-weight:500; color:var(--muted-sm); letter-spacing:-.02em; }
.sr .sr-stmt-sub{ font-family:var(--font-switzer); font-size:3.6cqw; font-weight:500; line-height:1.6; color:var(--muted-sm); max-width:60cqw; }
.sr .sr-c.on .sr-stmt{ animation:srMask .9s .1s both; }
.sr .sr-c.on .sr-stmt--sm{ animation:srFadeUp .7s both; }
.sr .sr-c.on .sr-stmt-sub{ animation:srFadeUp .8s .35s both; }

/* 02. quem somos — tags */
.sr .sr-tags{ display:flex; flex-wrap:wrap; gap:2.4cqw; }
.sr .sr-tags span{
  font-size:2.9cqw; font-weight:600; color:var(--ink); border:1px solid var(--border-strong);
  border-radius:999px; padding:1.6cqw 3.2cqw; opacity:0; transform:translateY(4cqw);
}
.sr .s2.on .sr-tags span{ animation:srFadeUp .6s both; }
.sr .s2.on .sr-tags span:nth-child(1){ animation-delay:.5s; }
.sr .s2.on .sr-tags span:nth-child(2){ animation-delay:.65s; }
.sr .s2.on .sr-tags span:nth-child(3){ animation-delay:.8s; }
.sr .s2.on .sr-tags span:nth-child(4){ animation-delay:.95s; }

/* 03. sites — mockup de navegador */
.sr .sr-mock{
  border:1px solid var(--border); border-radius:3cqw; overflow:hidden; background:#fff;
  box-shadow:0 20px 40px -24px rgba(20,20,15,.25); opacity:0; transform:translateY(5cqw) scale(.98);
}
.sr .s3.on .sr-mock{ animation:srMockIn .8s .3s both; }
@keyframes srMockIn{ to{ opacity:1; transform:none; } }
.sr .sr-mock__bar{ height:7.5cqw; background:#fff; display:flex; align-items:center; gap:1.6cqw; padding:0 3.2cqw; border-bottom:1px solid var(--border); }
.sr .sr-mock__bar i{ width:1.8cqw; height:1.8cqw; border-radius:50%; display:block; flex-shrink:0; }
.sr .sr-mock__tab{
  margin-left:2cqw; display:flex; align-items:center; gap:1.6cqw; font-family:var(--font-switzer);
  font-size:2.5cqw; font-weight:500; color:var(--muted-sm);
}
.sr .sr-mock__tab img{ height:3cqw; width:auto; object-fit:contain; }
.sr .sr-mock__screen{ position:relative; aspect-ratio:16/10.5; overflow:hidden; }
.sr .sr-mock__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; }
.sr .s3.on .sr-mock__img{ animation:srMockShow 3s ease-in-out both; }
.sr .s3.on picture:nth-child(2) .sr-mock__img{ animation-delay:3s; }
.sr .s3.on picture:nth-child(3) .sr-mock__img{ animation-delay:6s; animation-name:srMockShowFim; }
@keyframes srMockShow{ 0%{ opacity:0; transform:scale(1.1); } 12%{ opacity:1; } 82%{ opacity:1; transform:scale(1); } 100%{ opacity:0; transform:scale(1.02); } }
@keyframes srMockShowFim{ 0%{ opacity:0; transform:scale(1.1); } 12%{ opacity:1; } 100%{ opacity:1; transform:scale(1); } }

/* 04/05. fluxos conectados */
.sr .sr-flow{ position:relative; display:flex; justify-content:space-between; align-items:center; }
.sr .sr-flow::before{ content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:var(--border); transform:translateY(-50%); z-index:0; }
.sr .sr-flow__node{
  position:relative; z-index:1; background:var(--bg); border:1px solid var(--border-strong); border-radius:999px;
  padding:2cqw 3cqw; font-size:2.9cqw; font-weight:600; color:var(--ink);
  opacity:0; transform:scale(.7);
}
.sr .sr-flow--sm .sr-flow__node{ font-size:2.3cqw; padding:1.6cqw 2.2cqw; }
.sr .s4.on .sr-flow__node, .sr .s5.on .sr-flow__node{ animation:srNodeIn .5s both; }
.sr .sr-flow__node:nth-child(1){ animation-delay:.3s !important; }
.sr .sr-flow__node:nth-child(2){ animation-delay:.9s !important; }
.sr .sr-flow__node:nth-child(3){ animation-delay:1.5s !important; }
.sr .sr-flow__node:nth-child(4){ animation-delay:2.1s !important; }
.sr .sr-flow__node:nth-child(5){ animation-delay:2.7s !important; }
@keyframes srNodeIn{ to{ opacity:1; transform:scale(1); } }

/* 06. diferencial — construção */
.sr .sr-build{ display:grid; grid-template-columns:repeat(8,1fr); gap:2cqw; }
.sr .sr-build i{ aspect-ratio:1; border-radius:1.2cqw; background:var(--border-strong); opacity:0; transform:scale(.4); display:block; }
.sr .sr-build i:nth-child(6), .sr .sr-build i:nth-child(11){ background:var(--accent); }
.sr .s6.on .sr-build i{ animation:srBuildIn .5s both; }
.sr .s6.on .sr-build i:nth-child(1){ animation-delay:.1s; } .sr .s6.on .sr-build i:nth-child(2){ animation-delay:.15s; }
.sr .s6.on .sr-build i:nth-child(3){ animation-delay:.2s; } .sr .s6.on .sr-build i:nth-child(4){ animation-delay:.25s; }
.sr .s6.on .sr-build i:nth-child(5){ animation-delay:.3s; } .sr .s6.on .sr-build i:nth-child(6){ animation-delay:.35s; }
.sr .s6.on .sr-build i:nth-child(7){ animation-delay:.4s; } .sr .s6.on .sr-build i:nth-child(8){ animation-delay:.45s; }
.sr .s6.on .sr-build i:nth-child(9){ animation-delay:.5s; } .sr .s6.on .sr-build i:nth-child(10){ animation-delay:.55s; }
.sr .s6.on .sr-build i:nth-child(11){ animation-delay:.6s; } .sr .s6.on .sr-build i:nth-child(12){ animation-delay:.65s; }
.sr .s6.on .sr-build i:nth-child(13){ animation-delay:.7s; } .sr .s6.on .sr-build i:nth-child(14){ animation-delay:.75s; }
.sr .s6.on .sr-build i:nth-child(15){ animation-delay:.8s; } .sr .s6.on .sr-build i:nth-child(16){ animation-delay:.85s; }
@keyframes srBuildIn{ to{ opacity:1; transform:scale(1); } }

/* 07. como trabalhamos */
.sr .s7{ gap:5cqw; }
.sr .sr-steps{ position:relative; display:flex; flex-direction:column; gap:4.5cqw; }
.sr .sr-steps::before{ content:""; position:absolute; left:3.5cqw; top:3.5cqw; bottom:3.5cqw; width:1px; background:var(--border); z-index:0; }
.sr .sr-step{ position:relative; z-index:1; display:flex; align-items:flex-start; gap:3.4cqw; opacity:0; transform:translateY(3cqw); }
.sr .s7.on .sr-step{ animation:srFadeUp .6s both; }
.sr .s7.on .sr-step:nth-child(1){ animation-delay:.3s; }
.sr .s7.on .sr-step:nth-child(2){ animation-delay:1.1s; }
.sr .s7.on .sr-step:nth-child(3){ animation-delay:1.9s; }
.sr .s7.on .sr-step:nth-child(4){ animation-delay:2.7s; }
.sr .sr-step__n{
  width:7cqw; height:7cqw; border-radius:50%; border:1px solid var(--border-strong); background:var(--bg);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  font-size:2.6cqw; font-weight:600; color:var(--ink);
}
.sr .sr-step b{ font-family:var(--font-display); font-size:3.6cqw; font-weight:600; letter-spacing:-.01em; color:var(--ink); display:block; }
.sr .sr-step p{ font-family:var(--font-switzer); font-size:3cqw; color:var(--muted-sm); margin-top:.8cqw; line-height:1.5; }

/* 09. cta */
.sr .sr-btn{
  display:inline-block; background:var(--accent); color:#fff; font-family:var(--font-switzer);
  font-size:3.2cqw; font-weight:600; padding:3cqw 6cqw; border-radius:999px;
  opacity:0; transform:translateY(4cqw);
}
.sr .s9.on .sr-btn{ animation:srFadeUp .7s .55s both; }

@keyframes srFadeUp{ from{ opacity:0; transform:translateY(3cqw); } to{ opacity:1; transform:none; } }
@keyframes srMask{ from{ opacity:0; clip-path:inset(0 100% 0 0); transform:translateY(6cqw); } to{ opacity:1; clip-path:inset(0 0% 0 0); transform:translateY(0); } }

@media (prefers-reduced-motion:reduce){ .sr *{ animation-duration:.01s!important; } }
@media (max-width:640px){ .sr{ max-width:300px; } }