/* EventifyLab — folha de estilos do site (extraída do mockup, fontes auto-hospedadas em ./fontes) */

  @font-face{font-family:"Grift";src:url("fontes/Grift-Light.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap;}
  @font-face{font-family:"Grift";src:url("fontes/Grift-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
  @font-face{font-family:"Grift";src:url("fontes/Grift-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap;}
  @font-face{font-family:"Grift";src:url("fontes/Grift-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;}
  @font-face{font-family:"Grift";src:url("fontes/Grift-ExtraBold.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap;}
  @font-face{font-family:"Grift";src:url("fontes/Grift-Black.woff2") format("woff2");font-weight:900;font-style:normal;font-display:swap;}

  :root{
    --bg:        #081c1b;
    --bg-raised: #0e2624;
    --bg-sunken: #051211;
    --line:      rgba(237,239,234,.14);
    --line-strong: rgba(237,239,234,.28);
    --ink:       #edefea;
    --ink-dim:   #9fb6b2;
    --ink-faint: #6d8582;
    --teal:      #3f9ea5;
    --teal-deep: #398e94;
    --teal-soft: rgba(63,158,165,.14);
    --on-teal:   #06201f;
    --amber:     #e7b25a;
    --amber-soft: rgba(231,178,90,.08);
    --r-sm: 4px;
    --r-btn: 4px;
    --container: 1320px;
    --disp: "Grift", system-ui, sans-serif;
  }

  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%;}
  body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--disp);font-weight:400;line-height:1.5;-webkit-font-smoothing:antialiased;}
  img,svg{display:block;max-width:100%;}
  a{color:inherit;}
  ::selection{background:var(--teal);color:var(--on-teal);}

  .wrap{max-width:var(--container);margin-inline:auto;padding-inline:24px;}
  @media(min-width:1024px){.wrap{padding-inline:56px;}}
  section{position:relative;}
  .hairline-top{border-top:1px solid var(--line);}

  .grain{position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.035;mix-blend-mode:overlay;}


  h1,h2,h3{font-family:var(--disp);margin:0;text-wrap:balance;}
  h1{font-weight:900;text-transform:uppercase;letter-spacing:-.01em;line-height:.98;}
  h2{font-weight:800;letter-spacing:-.01em;line-height:1.08;}
  h3{font-weight:700;letter-spacing:-.005em;line-height:1.15;}
  p{margin:0;}

  .btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--disp);font-weight:800;font-size:16px;padding:15px 26px;border-radius:var(--r-btn);text-decoration:none;white-space:nowrap;cursor:pointer;transition:transform .18s cubic-bezier(.16,1,.3,1), background-color .25s ease, border-color .25s ease, color .25s ease;border:1px solid transparent;}
  .btn:active{transform:scale(.98);}
  .btn-primary{background:var(--teal);color:var(--on-teal);}
  .btn-primary:hover{background:#4dabb2;}
  .btn-ghost{background:transparent;color:var(--ink);border-color:var(--line-strong);}
  .btn-ghost:hover{border-color:var(--teal);color:var(--teal);}
  a:focus-visible,button:focus-visible{outline:2px solid var(--teal);outline-offset:3px;}

  header{position:sticky;top:0;z-index:40;background:rgba(8,28,27,.86);backdrop-filter:blur(10px);}
  .nav-row{display:flex;align-items:center;justify-content:space-between;height:80px;gap:20px;}
  .nav-links{display:none;align-items:center;gap:28px;}
  .nav-links a{font-size:15px;font-weight:500;color:var(--teal);text-decoration:none;transition:color .25s ease;opacity:.92;}
  /* link de Parceiros destacado do resto do menu, como uma area de
     acesso/portal (intranet), nao um item de navegacao comum */
  .nav-links a.nav-portal{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border:1px solid var(--line-strong);border-radius:var(--r-sm);color:var(--ink);opacity:1;transition:border-color .25s ease,color .25s ease;}
  .nav-links a.nav-portal:hover{border-color:var(--teal);color:var(--teal);}
  .nav-links a:hover{color:var(--ink);opacity:1;}
  @media(min-width:1100px){.nav-links{display:flex;}}
  .nav-toggle{display:inline-flex;background:none;border:1px solid var(--line-strong);border-radius:var(--r-sm);width:40px;height:40px;align-items:center;justify-content:center;color:var(--ink);}
  @media(min-width:1100px){.nav-toggle{display:none;}}
  #mobile-menu{display:none;flex-direction:column;gap:2px;padding:8px 0 20px;border-top:1px solid var(--line);}
  #mobile-menu.open{display:flex;}
  #mobile-menu a{padding:12px 4px;font-size:15px;font-weight:500;color:var(--teal);text-decoration:none;}
  #mobile-menu a.nav-portal{display:inline-flex;align-items:center;gap:8px;margin-top:10px;padding:12px 14px;border:1px solid var(--line-strong);border-radius:var(--r-sm);color:var(--ink);}
  #mobile-menu a.nav-portal:hover{border-color:var(--teal);}

  .hero{display:flex;flex-direction:column;align-items:center;padding-top:clamp(32px,6vw,64px);padding-bottom:56px;}
  .hero-grid{display:grid;grid-template-columns:1fr;gap:48px;align-items:center;width:100%;}
  .hero h1{font-size:clamp(2.3rem,5.2vw,4.1rem);max-width:14ch;}
  .hero .lede{font-size:clamp(1.05rem,1.6vw,1.3rem);margin-top:26px;color:var(--ink-dim);font-weight:300;max-width:46ch;}
  .hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:36px;}

  /* circulo com foto real do totem em uso, que estoura pra fora da tela
     a direita — fica atras do conteudo (z-index abaixo de .hero > *), so
     aparece a partir de 768px pra nao competir com o texto em telas
     estreitas */
  .hero-bleed-circle{display:none;}
  @media(min-width:768px){.hero-bleed-circle{display:block;}}
  /* especificidade ".hero > .hero-bleed-circle" de proposito: precisa
     bater a regra ".hero > *{position:relative;z-index:1;}" mais abaixo
     no arquivo, senao o circulo herda position:relative/z-index:1 e para
     de ficar atras do texto */
  .hero > .hero-bleed-circle{position:absolute;top:50%;right:-14%;width:66vw;max-width:960px;aspect-ratio:1/1;border-radius:50%;transform:translateY(-50%) translate(var(--magx,0px),var(--magy,0px));transition:transform .35s cubic-bezier(.16,1,.3,1);border:1px solid var(--line-strong);z-index:0;pointer-events:none;overflow:hidden;}
  .hero-bleed-circle img{width:100%;height:100%;object-fit:cover;display:block;}
  .hero-bleed-circle::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 35% 32%,rgba(63,158,165,.28),rgba(8,28,27,.35) 60%,rgba(8,28,27,.65) 100%);}
  @media (prefers-reduced-motion:reduce){.hero > .hero-bleed-circle{transition:none;}}
  .flow-dash{stroke-dasharray:6 6;animation:dashmove 22s linear infinite;}
  @media (prefers-reduced-motion:reduce){.flow-dash{animation:none;}}
  @keyframes dashmove{to{stroke-dashoffset:-240;}}

  .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);}
  .reveal.in{opacity:1;transform:none;}
  @media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}}

  .py{padding-block:56px;}
  @media(min-width:1024px){.py{padding-block:80px;}}

  .stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
  @media(min-width:768px){.stat-grid{grid-template-columns:repeat(4,1fr);}}
  .stat{position:relative;background:var(--bg);padding:30px 24px;}
  .stat .num{font-family:var(--disp);font-weight:700;font-size:clamp(2.3rem,4.4vw,3.4rem);color:var(--teal);font-variant-numeric:tabular-nums;line-height:1.05;}
  .stat .lbl{margin-top:8px;font-size:14px;color:var(--ink-dim);font-weight:400;}
  #agencias .stat .lbl{line-height:1.3;}

  .how-intro{max-width:70ch;font-size:1.1rem;color:var(--ink-dim);font-weight:300;margin-top:18px;}
  .how-intro strong{color:var(--ink);font-weight:600;}
  .steps{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:44px;}
  @media(min-width:820px){.steps{grid-template-columns:repeat(3,1fr);}}
  .step{position:relative;background:var(--bg);padding:30px 26px;}
  .step .icon{width:46px;height:46px;border:1px solid var(--teal);display:flex;align-items:center;justify-content:center;color:var(--teal);}
  .step h3{margin-top:20px;font-size:1.25rem;text-transform:uppercase;letter-spacing:.02em;}
  .step p{margin-top:12px;color:var(--ink-dim);font-size:.95rem;max-width:36ch;}

  /* suporte remoto — cartao destacado, com icone, indicador "sempre
     disponivel" pulsando e leve glow radial de fundo. empilha no mobile,
     vira linha (icone + texto) a partir de 760px */
  .support-banner{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px;border:1px solid var(--line-strong);background:var(--bg-raised);padding:40px 32px;}
  @media(min-width:760px){.support-banner{flex-direction:row;text-align:left;padding:48px 56px;gap:36px;}}
  .support-banner::before{content:"";position:absolute;inset:0;background:radial-gradient(560px circle at 12% 15%,rgba(63,158,165,.16),transparent 60%);pointer-events:none;}
  .support-banner-icon{position:relative;z-index:1;flex-shrink:0;width:76px;height:76px;border-radius:50%;border:1px solid var(--teal);background:var(--teal-soft);color:var(--teal);display:flex;align-items:center;justify-content:center;}
  .support-banner-text{position:relative;z-index:1;}
  .support-banner-status{display:inline-flex;align-items:center;gap:9px;font-family:var(--disp);font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-bottom:12px;}
  .pulse-dot{position:relative;width:7px;height:7px;border-radius:50%;background:var(--teal);}
  .pulse-dot::before{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid var(--teal);animation:pulseDot 1.8s ease-out infinite;}
  @keyframes pulseDot{0%{transform:scale(.5);opacity:.8;}100%{transform:scale(2.4);opacity:0;}}
  @media(prefers-reduced-motion:reduce){.pulse-dot::before{animation:none;}}
  .support-banner h2{font-size:clamp(1.8rem,3.4vw,2.5rem);}
  .support-banner-text p{margin-top:12px;color:var(--ink-dim);font-size:1.05rem;max-width:46ch;}
  @media(min-width:760px){.support-banner-text p{margin-inline:0;}}

  code.dev{font-family:var(--disp);font-weight:500;font-size:.7rem;color:var(--amber);background:var(--amber-soft);border:1px solid rgba(231,178,90,.3);padding:2px 6px;border-radius:2px;}

  .eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--disp);font-weight:500;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--teal);margin-bottom:18px;}
  .eyebrow::before{content:"[";color:var(--ink-faint);}
  .eyebrow::after{content:"]";color:var(--ink-faint);}
  .section-head{max-width:760px;margin-bottom:40px;}
  .section-head h2{font-size:clamp(1.9rem,3.4vw,3rem);}
  .section-lede{margin-top:14px;color:var(--ink-dim);max-width:62ch;font-size:1.02rem;}
  .closer{margin-top:28px;color:var(--ink-dim);font-size:1rem;max-width:62ch;}

  /* modulos: grade assimetrica tipo bento — Quiz e Roleta (is-lg) ganham
     cartao maior; o destaque de cor (fundo + filete teal) so aparece no
     hover, em qualquer cartao, junto com um leve deslocamento do titulo */
  .mech-grid{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:8px;}
  @media(min-width:760px){
    .mech-grid{grid-template-columns:repeat(6,1fr);}
    .mech-card.is-lg{grid-column:span 3;}
    .mech-card{grid-column:span 2;}
  }
  .mech-card{position:relative;background:var(--bg);padding:26px 24px;display:flex;flex-direction:column;gap:10px;}
  .mech-card.is-lg{padding:34px 30px;gap:14px;}
  .mech-card h3{font-size:1.05rem;}
  .mech-card.is-lg h3{font-size:1.45rem;}
  .mech-card p{color:var(--ink-dim);font-size:.92rem;line-height:1.5;max-width:40ch;}
  .mech-card.is-lg p{font-size:1rem;max-width:46ch;}

  /* hover premium, comum a todos os cartoes de grade (modulos, numeros,
     como-funciona, parceiros): filete teal no topo + fundo mais claro +
     leve elevacao. a elevacao usa seletor mais especifico que o do
     stagger de entrada (.reveal.in ... {transform:none}) de proposito,
     senao o hover nunca teria efeito depois que o cartao ja revelou */
  .mech-card::before,.stat::before,.step::before,.partner-panel::before,.reason-card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--teal);transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.16,1,.3,1);}
  .mech-card:hover,.stat:hover,.step:hover,.partner-panel:hover,.reason-card:hover{background:var(--bg-raised);}
  .mech-card:hover::before,.stat:hover::before,.step:hover::before,.partner-panel:hover::before,.reason-card:hover::before{transform:scaleX(1);}
  .reveal.in .mech-grid .mech-card:hover,
  .reveal.in .stat-grid .stat:hover,
  .reveal.in .steps .step:hover,
  .reveal.in .partner-grid .partner-panel:hover,
  .reveal.in .reason-grid .reason-card:hover{transform:translateY(-2px);}
  @media (prefers-reduced-motion:reduce){
    .mech-card,.mech-card::before,.stat,.stat::before,.step,.step::before,.partner-panel,.partner-panel::before,.reason-card,.reason-card::before{transition:none;}
    .reveal.in .mech-grid .mech-card:hover,
    .reveal.in .stat-grid .stat:hover,
    .reveal.in .steps .step:hover,
    .reveal.in .partner-grid .partner-panel:hover,
    .reveal.in .reason-grid .reason-card:hover{transform:none;}
  }

  /* linha de produto (Game vs Vitrine nos pacotes) */
  .line-label{display:inline-block;font-family:var(--disp);font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-bottom:20px;margin-top:36px;}
  #pacotes .line-label:first-child{margin-top:0;}

  /* grid estatico do Vitrine nos pacotes — 2 colunas, sem JS de carrossel */
  .vitrine-pack-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-top:8px;}
  @media(min-width:640px){.vitrine-pack-grid{grid-template-columns:1fr 1fr;}}
  .vitrine-pack-grid .pack-card{width:auto;max-width:none;}

  /* pacotes — carrossel de cards */
  .pack-carousel-wrap{margin-top:8px;}
  .pack-carousel{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 14px;scrollbar-width:thin;scrollbar-color:var(--teal-deep) transparent;-webkit-overflow-scrolling:touch;}
  .pack-carousel::-webkit-scrollbar{height:6px;}
  .pack-carousel::-webkit-scrollbar-thumb{background:var(--teal-deep);}
  .pack-carousel::-webkit-scrollbar-track{background:transparent;}
  .pack-card{container-type:inline-size;scroll-snap-align:start;flex:0 0 auto;width:82vw;max-width:300px;display:flex;flex-direction:column;border:1px solid var(--line);background:var(--bg-raised);}
  @media(min-width:640px){.pack-card{width:300px;}}
  /* a partir de 1024px sempre cabem exatamente 3 cartoes na largura do
     carrossel (2 gaps de 20px entre eles); o 4o (Replay) fica pra fora,
     revelado ao clicar na seta de avancar */
  @media(min-width:1024px){.pack-card{width:calc((100% - 40px)/3);max-width:none;}}
  /* reformulado pra bater com as referencias em EventifyLab/Refs (4 pngs
     de mockup): tipografia bem mais ousada, preco gigante em peso 800,
     resto do texto em Grift Light (300) e bem maior que antes, icone de
     relogio com fundo teal solido (nao mais o soft) */
  /* gradiente identico ao Gradient.svg (EventifyLab/Gradient.svg): mesmos
     9 stops e mesmo angulo, calculado a partir do vetor do linearGradient
     original (x1,y1 964.62,701.34 -> x2,y2 158.35,-104.93 = 315deg) */
  .pack-card .head{padding:28px 24px 30px;background:linear-gradient(315deg,#3f9ea5 0%,#3c969d 2%,#2e767a 10%,#225a5c 18%,#184344 28%,#113132 39%,#0b2524 51%,#081e1d 67%,#081c1b 100%);overflow:hidden;}
  /* logo/separador/tier escalam com a largura real do cartao (container
     query), nao com a viewport — assim continuam cabendo mesmo quando o
     card fica estreito (ex: layout de 3 colunas logo apos o breakpoint
     de 1024px), sem depender de "quantas colunas" o layout tem no momento */
  .pack-card .head .lockup{display:flex;align-items:center;gap:clamp(6px,2.5cqi,12px);min-width:0;}
  .pack-card .head .brand-logo{height:clamp(15px,5.5cqi,26px);width:auto;display:block;flex-shrink:0;}
  .pack-card .head .sep{width:1px;height:clamp(12px,4.5cqi,18px);background:rgba(255,255,255,.4);flex-shrink:0;}
  .pack-card .head .tier{font-family:var(--disp);font-weight:300;font-size:clamp(.95rem,6.5cqi,1.7rem);text-transform:uppercase;letter-spacing:.04em;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
  .pack-card .body{padding:24px;display:flex;flex-direction:column;gap:24px;flex:1;}
  .pack-card .feat{margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
  .pack-card .feat li{list-style:none;display:flex;gap:10px;font-family:var(--disp);font-weight:300;font-size:1.08rem;color:var(--ink);line-height:1.15;}
  .pack-card .feat li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--teal);flex-shrink:0;margin-top:9px;}
  .pack-card .price-row{margin-top:auto;padding-top:20px;border-top:1px solid var(--line);}
  .pack-card .price{font-family:var(--disp);font-weight:800;font-size:2.9rem;color:var(--ink);line-height:1;}
  .pack-card .price .unit{font-size:1.1rem;font-weight:300;color:var(--ink);margin-left:8px;}
  .pack-card .price.consult{font-size:1.6rem;font-family:var(--disp);font-weight:300;color:var(--ink);}
  .pack-card .pricelabel{font-size:1.3rem;font-weight:300;color:var(--ink);margin-bottom:8px;}
  .pack-card .extra{margin-top:10px;font-size:1.1rem;font-weight:300;color:var(--ink);}
  .pack-card .duration{margin-top:18px;display:flex;align-items:center;gap:12px;font-family:var(--disp);font-weight:300;font-size:1.15rem;color:var(--ink);}
  .pack-card .duration .clk{width:28px;height:28px;border-radius:50%;background:var(--teal);display:flex;align-items:center;justify-content:center;color:var(--on-teal);flex-shrink:0;}
  .pack-card .strip{padding:16px 24px;background:#edefea;color:#081c1b;font-family:var(--disp);font-size:1.05rem;font-weight:300;text-align:right;}
  .pack-card .strip .strip-price{font-weight:800;font-size:1.5rem;margin-left:6px;}
  /* strip agora e sempre um link pro whatsapp, mesmo texto nos 4 cards */
  .pack-card a.strip{display:block;text-decoration:none;transition:background-color .25s ease;}
  .pack-card .strip:hover{background:#e0e3db;text-decoration:underline;}
  /* "ideal para" ocupa o lugar do price-row (escondido), mesmo espacamento */
  .pack-card .ideal-for{margin-top:auto;padding-top:20px;border-top:1px solid var(--line);}
  .pack-card .ideal-for .label{display:block;font-family:var(--disp);font-weight:500;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);margin-bottom:10px;}
  .pack-card .ideal-for p{font-size:1rem;color:var(--ink-dim);line-height:1.5;}
  .pack-nav{display:flex;align-items:center;justify-content:flex-end;gap:16px;margin-top:14px;}
  .pack-nav-buttons{display:flex;gap:10px;}
  .pack-nav button{width:38px;height:38px;border:1px solid var(--line-strong);background:transparent;color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:var(--r-sm);transition:border-color .25s ease,color .25s ease;}
  .pack-nav button:hover{border-color:var(--teal);color:var(--teal);}

  /* relatorio */
  .tagcloud{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;}
  .tagcloud span{font-family:var(--disp);font-weight:400;font-size:12px;letter-spacing:.02em;color:var(--ink);border:1px solid var(--line-strong);padding:9px 14px;}

  /* faq */
  /* faq em acordeao — resposta some por padrao, so revela ao clicar na
     pergunta. sem JS, .a comeca visivel (progressive enhancement, igual
     ao filtro de produto da pagina de privacidade); o JS que adiciona
     .is-collapsed no carregamento e alterna no clique */
  .qa-list{display:flex;flex-direction:column;margin-top:8px;}
  .qa{border-top:1px solid var(--line);}
  .qa:last-child{border-bottom:1px solid var(--line);}
  .qa .q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;background:none;border:none;padding:24px 0;margin:0;cursor:pointer;text-align:left;font-family:var(--disp);font-weight:700;font-size:1.3rem;color:var(--ink);}
  .qa .q span{transition:transform .35s cubic-bezier(.16,1,.3,1),color .3s ease;transform-origin:left center;display:inline-block;}
  .qa .q:hover span{transform:scale(1.018);color:var(--teal);}
  .qa .qa-chevron{flex-shrink:0;color:var(--teal);transition:transform .35s cubic-bezier(.16,1,.3,1);}
  .qa.is-collapsed .qa-chevron{transform:rotate(-90deg);}
  .qa .a{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s cubic-bezier(.16,1,.3,1);}
  .qa.is-collapsed .a{grid-template-rows:0fr;}
  .qa .a-inner{overflow:hidden;}
  .qa .a p{color:var(--ink-dim);font-size:.95rem;line-height:1.6;max-width:60ch;padding-bottom:24px;}
  @media (prefers-reduced-motion:reduce){.qa .q span{transition:none;}.qa .q:hover span{transform:none;}.qa .qa-chevron,.qa .a{transition:none;}}

  /* parceiros */
  .partner-grid{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:8px;}
  @media(min-width:860px){.partner-grid{grid-template-columns:1fr 1fr;}}
  .partner-panel{position:relative;background:var(--bg);padding:30px;}
  .partner-panel .tag{font-family:var(--disp);font-weight:500;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);}
  .partner-panel h3{margin-top:12px;font-size:1.3rem;}
  .partner-panel p{margin-top:14px;color:var(--ink-dim);font-size:.94rem;}
  .guarantee-row{margin-top:1px;display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-top:none;}
  @media(min-width:860px){.guarantee-row{grid-template-columns:1fr 1fr;}}
  .guarantee-row div{background:var(--bg-raised);padding:18px 30px;font-size:.9rem;color:var(--ink-dim);}

  /* ---------------- interação / polish ---------------- */
  html{scroll-behavior:smooth;scroll-padding-top:92px;}
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}

  #scrollProgress{position:fixed;top:0;left:0;height:2.5px;width:0%;background:var(--teal);z-index:70;transition:width .1s linear;}

  header{transition:background-color .3s ease;}
  header .nav-row{transition:height .25s ease;}
  header.scrolled{background:rgba(8,28,27,.97);}
  header.scrolled .nav-row{height:66px;}

  .nav-links a{position:relative;}
  .nav-links a.active{color:var(--ink);opacity:1;}
  .nav-links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-24px;height:2px;background:var(--teal);}
  #mobile-menu a.active{color:var(--ink);}

  .hero{overflow:hidden;}
  .hero::before{content:"";position:absolute;inset:0;background:radial-gradient(620px circle at var(--mx,50%) var(--my,18%),rgba(63,158,165,.11),transparent 55%);pointer-events:none;z-index:0;}
  .hero > *{position:relative;z-index:1;}
  @media (prefers-reduced-motion:reduce){.hero::before{display:none;}}

  .stat-grid .stat,.steps .step,.mech-grid .mech-card,.partner-grid .partner-panel{opacity:0;transform:translateY(14px);transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1),background-color .45s ease;}
  .reveal.in .stat-grid .stat,.reveal.in .steps .step,.reveal.in .mech-grid .mech-card,.reveal.in .partner-grid .partner-panel{opacity:1;transform:none;}
  .stat-grid .stat:nth-child(1),.steps .step:nth-child(1),.mech-grid .mech-card:nth-child(1),.partner-grid .partner-panel:nth-child(1){transition-delay:.05s;}
  .stat-grid .stat:nth-child(2),.steps .step:nth-child(2),.mech-grid .mech-card:nth-child(2),.partner-grid .partner-panel:nth-child(2){transition-delay:.14s;}
  .stat-grid .stat:nth-child(3),.steps .step:nth-child(3),.mech-grid .mech-card:nth-child(3){transition-delay:.23s;}
  .stat-grid .stat:nth-child(4),.mech-grid .mech-card:nth-child(4){transition-delay:.32s;}
  .mech-grid .mech-card:nth-child(5){transition-delay:.41s;}
  @media (prefers-reduced-motion:reduce){.stat-grid .stat,.steps .step,.mech-grid .mech-card,.partner-grid .partner-panel{opacity:1;transform:none;transition:none;}}

  .pack-carousel{cursor:grab;}
  .pack-carousel:active{cursor:grabbing;}
  .pack-card{transition:transform .45s cubic-bezier(.16,1,.3,1),border-color .45s ease;}
  .pack-card:hover{transform:translateY(-2px);border-color:var(--teal);}
  @media (prefers-reduced-motion:reduce){.pack-card{transition:none;}.pack-card:hover{transform:none;}}

/* rodapé — três colunas, conforme spec-site-eventifylab.md */
footer.site{padding-block:56px 32px;}
.footer-cols{display:grid;grid-template-columns:1fr;gap:36px;}
@media(min-width:720px){.footer-cols{grid-template-columns:1.3fr 1fr 1fr;gap:40px;}}
.footer-col .flabel{font-family:var(--disp);font-weight:500;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:14px;}
.footer-col p{color:var(--ink-dim);font-size:.9rem;line-height:1.6;max-width:34ch;}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.footer-col a{color:var(--ink-dim);font-size:.9rem;text-decoration:none;transition:color .25s ease;}
.footer-col a:hover{color:var(--teal);}
.footer-logo{height:24px;width:auto;margin-bottom:16px;opacity:.9;}
.footer-base{margin-top:44px;padding-top:20px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:6px 14px;font-family:var(--disp);font-weight:400;font-size:.75rem;color:var(--ink-faint);}

/* ---------------- páginas internas: /parceiros e /privacidade ---------------- */

/* topo de página interna (sem hero de tela cheia) */
.page-top{padding-top:56px;padding-bottom:56px;}
@media(min-width:1024px){.page-top{padding-top:80px;}}
.page-top h1{font-size:clamp(2rem,4.2vw,3.2rem);max-width:20ch;}
.page-top .lede{margin-top:20px;color:var(--ink-dim);font-weight:300;font-size:1.08rem;max-width:60ch;}

/* hero em video (usado em /parceiros) — video de fundo full-bleed com
   mascara de escurecimento, texto por cima em .wrap normal (com z-index).
   o .page-top continua dando o padding vertical, o video/mascara cobrem
   a secao inteira (position:absolute;inset:0 usa a padding-box do
   ancestral relative mais proximo, que e o proprio <section>) */
#home.hero-video{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;min-height:clamp(420px,50vw,600px);}
.hero-video-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.hero-video-mask{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,28,27,.6) 0%,rgba(8,28,27,.8) 55%,rgba(8,28,27,.94) 100%);z-index:0;}
/* width:100% forca o .wrap a esticar no eixo cruzado do flex column;
   sem isso, o margin-inline:auto do .wrap (que so deveria centralizar o
   container no max-width) vira sizing por fit-content dentro do flex, e
   o texto acaba visualmente centralizado em vez de alinhado com o resto
   da pagina */
#home.hero-video > .wrap{position:relative;z-index:1;width:100%;}
@media(max-width:640px){#home.hero-video{min-height:380px;}}

/* variante de 4 colunas para .steps (usado no fluxo de parceiros) */
@media(min-width:900px){.steps.steps-4{grid-template-columns:repeat(4,1fr);}}

/* variante de 3 colunas para .stat-grid (usado nos números de parceiros) */
@media(min-width:768px){.stat-grid.stat-grid-3{grid-template-columns:repeat(3,1fr);}}

/* variante de 3 colunas para .partner-grid (usado nos selos do teaser de parceiros na home) */
@media(min-width:760px){.partner-grid.partner-grid-3{grid-template-columns:repeat(3,1fr);}}
.partner-panel.badge p{margin-top:10px;}

/* listas simples com marcador, usadas em "com quem funciona" */
.plain-list{margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;}
.plain-list li{list-style:none;display:flex;gap:10px;font-size:.92rem;color:var(--ink-dim);line-height:1.45;}
.plain-list li::before{content:"–";color:var(--teal);flex-shrink:0;}
.plain-list.bad li::before{content:"×";color:var(--ink-faint);}

/* bloco de destaque (piloto, avisos) */
.callout{border:1px solid var(--line);background:var(--bg-raised);padding:28px 30px;margin-top:32px;}
.callout .tag{font-family:var(--disp);font-weight:500;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);}
.callout h3{margin-top:10px;font-size:1.2rem;}
.callout p{margin-top:12px;color:var(--ink-dim);font-size:.94rem;max-width:64ch;}

/* grade de 4 cards, usada na home e em /parceiros */
.reason-grid{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:8px;}
@media(min-width:760px){.reason-grid{grid-template-columns:repeat(2,1fr);}}
.reason-card{position:relative;background:var(--bg);padding:30px;transition:background-color .45s ease;}
.reason-card h3{font-size:1.6rem;}
.reason-card p{margin-top:14px;color:var(--ink-dim);font-size:.94rem;max-width:52ch;}

/* fechamento centralizado, com dois botões */
.cta-final{text-align:center;}
.cta-final h2{font-size:clamp(1.9rem,3.4vw,2.6rem);}
.cta-final p{margin-top:14px;color:var(--ink-dim);font-size:1.05rem;max-width:56ch;margin-inline:auto;}
.cta-final .actions{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-top:32px;}
.cta-final .rodape-nota{margin-top:20px;font-family:var(--disp);font-weight:400;font-size:.78rem;color:var(--ink-faint);}

/* aviso de revisão jurídica pendente, na página de privacidade */
.legal-banner{background:var(--amber-soft);border:1px solid rgba(231,178,90,.35);padding:18px 22px;font-size:.92rem;color:var(--ink);}
.legal-banner strong{color:var(--amber);}

/* corpo em prosa da política de privacidade */
.legal-body{margin-top:8px;}
.legal-body h2{margin-top:48px;font-size:1.4rem;}
.legal-body h2:first-child{margin-top:0;}
.legal-body p{margin-top:14px;color:var(--ink-dim);font-size:.98rem;line-height:1.65;max-width:74ch;}
.legal-body ul{margin:14px 0 0;padding-left:22px;color:var(--ink-dim);font-size:.98rem;line-height:1.65;max-width:74ch;}
.legal-body li{margin-top:6px;}
.legal-body strong{color:var(--ink);}

/* filtro por produto (EventifyLab / Salve!) na politica de privacidade —
   texto simples, no estilo do menu do header (.nav-links a): sem caixa,
   sem borda, sem fundo. Ativo = branco (var(--ink)); inativo, mas ainda
   clicavel = teal, igual a cor padrao dos links do menu. */
.product-switch{display:inline-flex;align-items:center;gap:14px;margin-top:28px;}
.product-switch button{font-family:var(--disp);font-weight:500;font-size:15px;background:transparent;color:var(--teal);border:none;padding:0;cursor:pointer;transition:color .25s ease;}
.product-switch button:hover{color:var(--ink);}
.product-switch button[aria-pressed="true"]{color:var(--ink);cursor:default;}
.product-switch .sep{color:var(--line-strong);}
.product-panel[hidden]{display:none;}

/* CTA "role para ver mais" no hero — irmao do .hero-grid, dentro do
   .hero (que agora empilha em coluna), NAO position:absolute: sem o
   hero forcado em 100dvh, um CTA "grudado no fim da tela" nao faz mais
   sentido — ele fica logo abaixo do conteudo, sempre, em qualquer
   altura de tela. */
.scroll-cta{margin-top:32px;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--ink-faint);text-decoration:none;font-family:var(--disp);font-weight:500;font-size:11px;letter-spacing:.08em;text-transform:uppercase;transition:color .25s ease;}
.scroll-cta:hover{color:var(--teal);}
.scroll-cta svg{animation:scrollBounce 1.6s ease-in-out infinite;}
@keyframes scrollBounce{0%,100%{transform:translateY(0);}50%{transform:translateY(6px);}}
@media (prefers-reduced-motion:reduce){.scroll-cta svg{animation:none;}}