/* ============================================================
   Polzin Digital - estrutura/mecânica replicadas de landonorris.com
   (esqueleto de layout, grid e animações medidos na fonte).
   TODO conteúdo é placeholder/Polzin - nenhuma foto, texto ou
   marca do site original.
   Valores medidos: reveal 0.75s cubic-bezier(.65,.05,0,1) com
   clip-path; hover 0.6s cubic-bezier(.19,1,.22,1); tema oliva
   #282c20 / creme #f4f4ed; acento lime (verde Polzin #D2FF00).
   ============================================================ */

:root{
  --cream: #edece6;        /* hero claro */
  --cream-2: #e4e3db;
  --olive: #282c20;        /* fundo escuro medido */
  --olive-2: #31362a;
  --olive-3: #3a4031;
  --text-dark: #17180f;    /* texto sobre claro */
  --text-cream: #f4f4ed;   /* texto sobre escuro (medido) */
  --muted-dark: #5f6154;
  --muted-cream: rgba(244,244,237,0.62);
  --lime: #d2ff00;         /* acento (verde Polzin) */
  --lime-deep: #a8cc00;
  --lime-dark: #7d9c00;    /* verde fechado, mesmo tom do selo HIPAA */
  --term-green: #a8f51c;   /* verde de terminal, destaque do título do hero */
  --ink: #111112;
  --line-dark: rgba(23,24,15,0.14);
  --line-cream: rgba(244,244,237,0.16);
  --radius: 10px;          /* ~9.6px medido */
  --radius-btn: 13px;      /* menu button */
  --font: "Archivo", "Mona Sans", system-ui, -apple-system, sans-serif;
  --reveal-ease: cubic-bezier(0.65, 0.05, 0, 1);
  --reveal-dur: 0.75s;
  --hover-ease: cubic-bezier(0.19, 1, 0.22, 1);
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:100px; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

/* Lenis */
html.lenis, html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
.lenis.lenis-stopped{ overflow:hidden; }

body{
  font-family:var(--font); background:var(--olive); color:var(--text-cream);
  line-height:1.4; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
.wrap{ max-width:1400px; margin:0 auto; padding:0 40px; }
::selection{ background:var(--lime); color:var(--text-dark); }

h1,h2{ font-weight:800; text-transform:uppercase; line-height:0.92; letter-spacing:-0.01em; }
h3{ font-weight:600; }

/* placeholder visual (bloco no lugar de foto/vídeo) */
.ph{
  position:relative; overflow:hidden; border-radius:var(--radius);
  background:
    repeating-linear-gradient(135deg, rgba(210, 255, 0,0.05) 0 12px, transparent 12px 24px),
    linear-gradient(160deg, var(--olive-3), var(--olive-2));
  display:flex; align-items:center; justify-content:center;
}
.ph.light{ background:
    repeating-linear-gradient(135deg, rgba(23,24,15,0.04) 0 12px, transparent 12px 24px),
    linear-gradient(160deg, #d9d8cf, #e4e3db); }
.ph::after{
  content:"PLACEHOLDER"; font-size:0.68rem; letter-spacing:0.2em; font-weight:600;
  color:rgba(244,244,237,0.35);
}
.ph.light::after{ color:rgba(23,24,15,0.3); }

/* padrão topográfico */
.topo{
  position:absolute; inset:-25% 0; pointer-events:none; z-index:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='900' viewBox='0 0 900 900'%3E%3Cg fill='none' stroke='%2317180f' stroke-opacity='0.06' stroke-width='1.2'%3E%3Cpath d='M-100 200 Q220 90 450 230 T1000 200'/%3E%3Cpath d='M-100 300 Q240 190 470 330 T1020 300'/%3E%3Cpath d='M-100 410 Q260 300 480 440 T1040 410'/%3E%3Cpath d='M-100 530 Q240 430 470 560 T1030 530'/%3E%3Cpath d='M-100 650 Q260 550 500 680 T1060 650'/%3E%3Ccircle cx='300' cy='450' r='170'/%3E%3Ccircle cx='300' cy='450' r='240'/%3E%3Ccircle cx='300' cy='450' r='320'/%3E%3C/g%3E%3C/svg%3E");
  background-size:1000px 1000px;
}
.topo.on-dark{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='900' viewBox='0 0 900 900'%3E%3Cg fill='none' stroke='%23d2ff00' stroke-opacity='0.07' stroke-width='1.2'%3E%3Cpath d='M-100 200 Q220 90 450 230 T1000 200'/%3E%3Cpath d='M-100 330 Q240 220 470 360 T1020 330'/%3E%3Cpath d='M-100 470 Q260 360 480 500 T1040 470'/%3E%3Cpath d='M-100 620 Q240 520 500 650 T1060 620'/%3E%3Ccircle cx='620' cy='450' r='180'/%3E%3Ccircle cx='620' cy='450' r='260'/%3E%3C/g%3E%3C/svg%3E"); }

/* ============ Botões ============ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  height:52px; padding:0 24px; border-radius:var(--radius);
  font-weight:600; font-size:0.9rem; white-space:nowrap; cursor:pointer;
  border:1.5px solid transparent; transition:background .3s var(--hover-ease), color .3s var(--hover-ease), border-color .3s var(--hover-ease);
}
.btn-lime{ background:var(--lime); color:var(--text-dark); }
.btn-lime:hover{ background:var(--text-cream); }
.btn-line{ border-color:currentColor; }
.on-dark .btn-line:hover{ background:var(--lime); border-color:var(--lime); color:var(--text-dark); }
.on-light .btn-line:hover{ background:var(--text-dark); border-color:var(--text-dark); color:var(--cream); }

/* ============ Nav ============ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:60; height:96px;
  display:flex; justify-content:space-between; align-items:center;
  padding:0 26px;
}
/* logo (wordmark). No nav a troca é automática: fundo claro -> logo preta; fundo escuro -> logo clara */
.brand-lockup{ justify-self:start; display:flex; align-items:center; }
.brand-lockup img{ height:clamp(24px,2.3vw,32px); width:auto; display:block; }
.nav .brand-lockup .logo-light{ display:none; }
.nav.on-dark .brand-lockup .logo-dark{ display:none; }
.nav.on-dark .brand-lockup .logo-light{ display:block; }
.menu-head .brand-lockup img{ height:clamp(26px,2.7vw,34px); }
.nav-right{ justify-self:end; display:flex; align-items:center; gap:12px; }
.store-btn{
  display:inline-flex; align-items:center; gap:10px; height:72px; padding:0 28px;
  background:var(--lime); color:var(--text-dark); border-radius:12px;
  font-weight:700; font-size:1rem;
  transition:transform .3s var(--hover-ease), background .3s var(--hover-ease);
}
.store-btn svg{ width:19px; height:19px; }
.store-btn:hover{ transform:translateY(-2px); background:#e2ff4d; }
/* botão do menu: adaptativo (linhas escuras em fundo claro, claras em fundo escuro), sem verde */
.menu-btn{
  width:72px; height:72px; border-radius:14px;
  background:transparent; border:1.5px solid var(--line-dark); cursor:pointer;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px;
  transition:transform .3s var(--hover-ease), background .3s var(--hover-ease), border-color .3s var(--hover-ease);
}
.menu-btn:hover{ transform:translateY(-2px); background:rgba(23,24,15,0.06); }
.menu-btn i{ display:block; width:30px; height:2.5px; background:var(--text-dark); border-radius:2px; transition:transform .35s var(--reveal-ease), background .3s var(--hover-ease), opacity .2s ease; }
.nav.on-dark .menu-btn{ border-color:var(--line-cream); }
.nav.on-dark .menu-btn:hover{ background:rgba(244,244,237,0.1); }
.nav.on-dark .menu-btn i{ background:var(--text-cream); }
/* burguer vira X quando o menu abre */
.menu-btn.is-open i:nth-child(1){ transform:translateY(4.75px) rotate(45deg); }
.menu-btn.is-open i:nth-child(2){ transform:translateY(-4.75px) rotate(-45deg); }

/* ============ Menu overlay (full-screen, escuro estilo Lando) ============ */
.menu-overlay{
  position:fixed; inset:0; z-index:9990; background:var(--olive); color:var(--text-cream);
  clip-path:inset(0 0 100% 0); transition:clip-path .8s var(--reveal-ease);
  display:flex; flex-direction:column; padding:clamp(28px,4vw,52px) clamp(24px,5vw,80px); overflow:hidden;
  visibility:hidden;
}
.menu-overlay.open{ clip-path:inset(0 0 0 0); visibility:visible; }
.menu-overlay .topo{ display:none; }

/* ---- grafismo do menu: só a iluminação (glows lime flutuantes) ---- */
.menu-graphic{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.menu-graphic canvas{ position:absolute; inset:0; width:100%; height:100%; }
.mg-orb{ position:absolute; right:-16vw; top:-18vw; width:58vw; height:58vw; border-radius:50%;
  background:radial-gradient(circle, rgba(210,255,0,0.22), transparent 62%); filter:blur(26px);
  animation:mgFloat 16s ease-in-out infinite; }
.mg-orb-2{ right:auto; top:auto; left:-20vw; bottom:-22vw; width:52vw; height:52vw;
  background:radial-gradient(circle, rgba(210,255,0,0.14), transparent 64%);
  animation:mgFloat 22s ease-in-out infinite reverse; }
@keyframes mgFloat{ 0%,100%{ transform:translate(0,0); } 50%{ transform:translate(-3vw,3vh); } }

.menu-head{ position:relative; z-index:2; display:flex; justify-content:space-between; align-items:center; gap:20px; }
.menu-index{ font-size:0.72rem; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--muted-cream); margin-left:auto; margin-right:clamp(16px,3vw,40px); }
/* botão fechar: X de duas linhas que gira no hover */
.menu-close{ position:relative; width:52px; height:52px; border-radius:var(--radius-btn); background:transparent; border:1.5px solid var(--line-cream); cursor:pointer; transition:background .3s var(--hover-ease), border-color .3s var(--hover-ease), transform .4s var(--hover-ease); }
.menu-close span{ position:absolute; left:50%; top:50%; width:22px; height:2.5px; background:var(--text-cream); border-radius:2px; transition:background .3s var(--hover-ease); }
.menu-close span:nth-child(1){ transform:translate(-50%,-50%) rotate(45deg); }
.menu-close span:nth-child(2){ transform:translate(-50%,-50%) rotate(-45deg); }
.menu-close:hover{ background:var(--lime); border-color:var(--lime); transform:rotate(90deg); }
.menu-close:hover span{ background:var(--text-dark); }

/* itens grandes em negrito (Lando), revelação mascarada e hover melhorado */
.menu-links{ position:relative; z-index:2; margin:auto 0; display:flex; flex-direction:column; align-items:flex-start; gap:clamp(4px,0.8vw,12px); }
.menu-links a{
  position:relative; display:flex; align-items:center; gap:clamp(16px,2vw,32px); color:var(--text-cream);
  font-weight:800; text-transform:uppercase; font-size:clamp(2.2rem,7vw,5.4rem); line-height:1.02; letter-spacing:-0.01em;
  transition:padding-left .5s var(--hover-ease), color .35s var(--hover-ease);
}
/* seta lime que aparece deslizando no hover */
.menu-links a::before{
  content:""; width:0; height:clamp(3px,0.35vw,5px); background:var(--lime); border-radius:4px;
  transition:width .45s var(--hover-ease), margin-right .45s var(--hover-ease); margin-right:0;
}
/* rótulo mascarado: sobe de baixo, escalonado por --md */
.menu-links a .lbl{ position:relative; overflow:hidden; display:inline-block; padding-bottom:0.06em; }
.menu-links a .lbl b{ display:inline-block; font-weight:inherit; transform:translateY(115%); transition:transform .8s var(--reveal-ease); transition-delay:var(--md,0s); }
.menu-overlay.open .menu-links a .lbl b{ transform:none; }
.menu-links a:hover{ color:var(--lime); padding-left:clamp(6px,1vw,16px); }
.menu-links a:hover::before{ width:clamp(28px,3vw,64px); margin-right:clamp(4px,0.5vw,10px); }

.menu-foot{ position:relative; z-index:2; display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; color:var(--muted-cream); font-size:0.86rem; }
.menu-foot .socials{ display:flex; gap:20px; }
.menu-foot a:hover{ color:var(--lime); }
@media (prefers-reduced-motion: reduce){
  .menu-overlay, .menu-links a .lbl b{ transition:none; }
}

/* ============ Hero (claro) ============ */
/* ============ Tela de carregamento (preloader estilo Lando) ============ */
.loader{
  position:fixed; inset:0; z-index:9999; background:var(--lime); color:var(--olive);
  display:flex; align-items:center; justify-content:center;
  transition:transform .7s cubic-bezier(.76,0,.24,1);
}
.loader.done{ transform:translateY(-100%); }
.loader-inner{ display:flex; flex-direction:column; align-items:center; gap:clamp(14px,2vw,24px); }
.loader-brand{
  font-weight:800; text-transform:uppercase; font-size:clamp(2rem,6vw,4.8rem); letter-spacing:-0.02em; line-height:1; color:var(--olive);
  opacity:0; transform:translateY(20px); animation:loaderIn .8s var(--reveal-ease) .1s forwards;
}
.loader-brand span{ color:#fff; }
.loader-brand img{ height:clamp(38px,7vw,80px); width:auto; display:block; }
.loader-count{ font-weight:800; line-height:1; font-size:clamp(0.95rem,1.6vw,1.2rem); letter-spacing:0.16em; color:rgba(20,21,15,0.7); }
.loader-count em{ font-style:normal; color:var(--olive); margin-left:1px; }
.loader-domain{
  position:absolute; bottom:clamp(20px,4.5vh,44px); left:0; right:0; text-align:center;
  font-weight:800; text-transform:uppercase; font-size:clamp(0.72rem,1.5vw,0.92rem); letter-spacing:0.26em;
  color:rgba(20,21,15,0.72);
  opacity:0; animation:loaderIn .8s var(--reveal-ease) .35s forwards;
}
@keyframes loaderIn{ to{ opacity:1; transform:none; } }
html.loading, html.loading body{ overflow:hidden; height:100%; }

.hero{ position:relative; background:var(--cream); color:var(--text-dark); min-height:100dvh; overflow:hidden; padding:120px 0 0; }
.hero-particles{ position:absolute; inset:0; z-index:1; pointer-events:none; width:100%; height:100%; }
/* assinatura discreta no rodapé do hero, na mesma coluna da logo (26px, igual ao padding
   do nav) mas no extremo oposto: logo no topo, "since" na base da primeira dobra.
   Só na home; as outras páginas não têm esse elemento. */
.hero-since{
  position:absolute; left:26px; bottom:clamp(22px,3.4vh,38px); z-index:2;
  font-size:0.64rem; font-weight:600; text-transform:uppercase; letter-spacing:0.22em;
  color:var(--text-dark); opacity:0.5; white-space:nowrap;
  padding-left:16px;
}
.hero-since::before{
  content:''; position:absolute; left:0; top:50%; width:9px; height:1px;
  background:currentColor; opacity:0.7;
}
/* conteúdo do hero: headline + CTA de contato */
.hero-content{ position:relative; z-index:2; text-align:center; max-width:960px; margin:0 auto; padding:0 8px; }
.hero-content .p-eyebrow{ display:inline-flex; }
.hero-content h1{ font-family:'Anton', sans-serif; font-weight:400; text-transform:uppercase; font-size:clamp(3.4rem,11.5vw,9.5rem); line-height:0.88; letter-spacing:-0.01em; margin:0 0 24px; }
/* sombra dura (sem blur) deslocada: separa o verde claro do fundo cream e dá relevo,
   sem o contorno fechado que engrossava a Anton. Offset em em para escalar com o clamp. */
.hero-content h1 em{
  font-style:normal; color:var(--term-green);
  text-shadow:0.032em 0.042em 0 rgba(23,24,15,0.52);
}
/* digitação estilo terminal: cada caractere entra em steps(1), sem fade, para dar o
   estalo de tecla. Os spans são criados no js/main.js e já ocupam o espaço final,
   então nada reflui enquanto a frase é digitada. */
.hero-content h1 em .ch{ opacity:0; }
html:not(.loading) .hero-content h1 em .ch{
  animation:typeIn .01s steps(1) forwards;
  animation-delay:calc(0.35s + var(--i) * 0.055s);
}
@keyframes typeIn{ to{ opacity:1; } }
/* cursor de bloco, como o do prompt: aparece ao fim da digitação e fica piscando */
.hero-content h1 em.has-caret::after{
  content:''; display:inline-block; vertical-align:baseline;
  width:0.2em; height:0.44em; margin-left:0.08em;
  background:var(--term-green); opacity:0;
}
html:not(.loading) .hero-content h1 em.has-caret::after{
  animation:caretBlink 1.05s steps(1) infinite;
  animation-delay:calc(0.35s + var(--type-total, 12) * 0.055s);
}
@keyframes caretBlink{ 0%,49%{ opacity:1; } 50%,100%{ opacity:0; } }
@media (prefers-reduced-motion: reduce){
  /* sem digitação: as palavras já aparecem inteiras e sem cursor */
  .hero-content h1 em .ch{ opacity:1; animation:none; }
  .hero-content h1 em.has-caret::after{ display:none; }
}
.hero-content p{ max-width:52ch; margin:0 auto 32px; opacity:0.72; font-size:clamp(1.05rem,1.6vw,1.3rem); line-height:1.5; }
.hero-cta{ display:flex; flex-wrap:wrap; gap:16px; justify-content:center; align-items:center; }
.hero-link{ display:inline-flex; align-items:center; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; font-size:0.86rem; padding:8px 2px; border-bottom:2px solid transparent; transition:border-color .25s var(--hover-ease); }
.hero-link:hover{ border-bottom-color:var(--lime-deep); }
.hero-inner{ position:relative; z-index:2; height:calc(100dvh - 120px); display:flex; align-items:center; justify-content:center; }
.hero-visual{ width:min(46vw,560px); aspect-ratio:0.86; }
.hero-card{
  position:absolute; left:40px; bottom:44px; z-index:3; width:190px;
  border:1.5px solid var(--text-dark); border-radius:var(--radius); background:var(--cream);
  padding:16px; text-align:center;
}
.hero-card .lbl{ font-size:0.62rem; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted-dark); }
.hero-card .track{ margin:14px auto 10px; width:60px; height:34px; }
.hero-card .track .ph{ height:100%; }
.hero-card .badge{ border-top:1px solid var(--line-dark); padding-top:12px; margin-top:12px; font-size:0.64rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; }
@media (max-width:900px){ .hero-card{ display:none; } .hero-visual{ width:70vw; } }

/* ============ Marquee cinético (banda escura) ============ */
.marquee-sec{ position:relative; background:var(--olive); overflow:hidden; padding:120px 0; }
.marquee-row{ display:flex; width:max-content; will-change:transform; }
.marquee-row.a{ animation:mq 55s linear infinite; }
.marquee-row.b{ animation:mq 55s linear infinite reverse; margin-top:6px; }
.marquee-row .cell{ display:flex; align-items:center; gap:40px; padding-right:40px; }
.mq-word{ font-weight:800; text-transform:uppercase; font-size:clamp(3rem,9vw,8rem); line-height:1; white-space:nowrap; }
.mq-word.hollow{ color:transparent; -webkit-text-stroke:1.5px var(--text-cream); }
.mq-word.lime{ color:var(--lime); }
@keyframes mq{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .marquee-row{ animation:none !important; } }

/* ============ Reveal ligado ao scroll (automático / scroll-driven) ============ */
/* Por padrão tudo é visível. Onde o navegador suporta timeline de scroll,
   o reveal acontece atrelado à posição do scroll (revela ao rolar, some ao voltar). */
@media (prefers-reduced-motion: no-preference){
  @supports (animation-timeline: view()){
    .reveal, .reveal-pop{
      animation:reveal-scrub linear both;
      animation-timeline:view();
      animation-range:entry 2% cover 16%;
    }
    @keyframes reveal-scrub{
      from{ opacity:0; transform:translateY(38px); }
      to{ opacity:1; transform:none; }
    }
  }
}

/* barra de progresso minimalista no topo (fina, verde, ligada ao scroll) */
.progress-bar{
  position:fixed; top:0; left:0; right:0; height:2px; z-index:100;
  background:var(--lime); transform:scaleX(0); transform-origin:0 50%; will-change:transform;
}
@supports (animation-timeline: scroll()){
  .progress-bar{ animation:progress-grow linear both; animation-timeline:scroll(root); }
  @keyframes progress-grow{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }
}

/* ============ Seções base ============ */
section{ position:relative; }
.band{ padding:120px 0; }
.band.dark{ background:var(--olive); color:var(--text-cream); }
.band.dark-2{ background:var(--olive-2); color:var(--text-cream); }
.band.light{ background:var(--cream); color:var(--text-dark); }
.sec-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:32px; margin-bottom:52px; flex-wrap:wrap; }
.sec-head .eyebrow{ font-size:0.74rem; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--lime); margin-bottom:16px; }
.sec-head h2{ font-size:clamp(2.4rem,5vw,4.4rem); max-width:16ch; }
.sec-head p{ max-width:38ch; color:inherit; opacity:0.7; font-size:1.05rem; }

/* cabeçalho empilhado (título + texto abaixo, sem flutuar no canto) */
.p-eyebrow{ display:inline-flex; align-items:center; gap:10px; font-size:0.76rem; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--lime); margin-bottom:18px; }
.sec-lead{ max-width:64ch; margin-bottom:52px; }
.sec-lead h2{ font-size:clamp(2.4rem,4.5vw,3.8rem); max-width:18ch; }
.sec-lead p{ margin-top:18px; opacity:0.72; font-size:1.08rem; max-width:52ch; }

/* fundo em parallax nas seções (movimento/profundidade entre blocos) */
.band.has-topo{ overflow:hidden; }
.band.has-topo > .wrap{ position:relative; z-index:2; }
.band.has-topo > .topo{ z-index:0; opacity:0.6; }

/* grid de 4 colunas (medido: 4 cols, gap ~22px) */
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.card{ display:flex; flex-direction:column; gap:16px; }
.card .ph{ aspect-ratio:0.82; }
.card .k-label{ font-size:0.72rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--lime); }
.card h3{ font-weight:800; text-transform:uppercase; font-size:1.4rem; line-height:0.98; }
.card p{ opacity:0.66; font-size:0.95rem; }
.card a.more{ margin-top:auto; font-weight:700; font-size:0.82rem; text-transform:uppercase; letter-spacing:0.06em; display:inline-flex; gap:7px; transition:gap .3s var(--hover-ease), color .3s var(--hover-ease); }
.card a.more:hover{ gap:12px; color:var(--lime); }

/* banda feature (texto + media split) */
.feature{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.feature.flip .feature-text{ order:2; }
.feature-media{ aspect-ratio:1.15; }
.feature-text .eyebrow{ font-size:0.74rem; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--lime); margin-bottom:18px; }
.feature-text h2{ font-size:clamp(2.2rem,4vw,3.6rem); margin-bottom:20px; }
.feature-text p{ opacity:0.72; font-size:1.08rem; max-width:46ch; margin-bottom:28px; }

/* stat band grande */
.big-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
/* coluna flex + margin-top:auto no rótulo: os três rótulos encostam na mesma
   linha de base mesmo quando os números têm larguras/alturas diferentes */
.big-stat{ border-top:2px solid var(--lime); padding-top:20px; display:flex; flex-direction:column; }
.stats-sec .big-stat{ border-top-color:var(--lime-deep); } /* borda com contraste no fundo claro */
/* nowrap: "24/7" é largo e quebrava em duas linhas, desalinhando o rótulo dele */
.big-stat b{ display:block; font-weight:800; font-size:clamp(3.4rem,6.4vw,5.4rem); line-height:0.86; white-space:nowrap; }
.big-stat span{ display:block; margin-top:auto; padding-top:14px; opacity:0.7; text-transform:uppercase; letter-spacing:0.08em; font-size:0.82rem; font-weight:600; }

/* ============ Footer (card = imagem fundo.png sem distorção; lime por trás = continuidade) ============ */
footer{
  padding:0; position:relative;
  /* lime contínuo com a base da seção de cima (aparece nos cantos/vãos transparentes do card e nas laterais) */
  background:linear-gradient(180deg, #e8f79a 0%, #d3fc05 40%, #cdf400 100%);
}
.footer-frame{ position:relative; max-width:1460px; margin:0 auto; }
.footer-bg{ display:block; width:100%; height:auto; } /* card na proporção natural (nunca achatado) */
.footer-shell{
  position:absolute; inset:0; overflow:hidden; color:var(--text-cream);
  border-radius:0; background:transparent; /* a imagem desenha o card + recortes + textura */
  display:flex; flex-direction:column;
  padding:clamp(26px,3vw,50px) clamp(40px,5.5vw,88px) clamp(30px,3.4vw,54px);
}
.footer-shell .topo{ display:none; }
.footer-content{ flex:1 1 auto; display:flex; }
.footer-main{ flex:1 1 auto; }
.footer-content{ position:relative; z-index:2; }
.footer-top{ display:flex; align-items:center; justify-content:flex-start; gap:20px; }
.footer-logo{ height:44px; width:auto; }
.foot-huge{ text-align:center; font-weight:800; text-transform:uppercase; font-size:clamp(2rem,5.5vw,4.6rem); line-height:0.86; letter-spacing:-0.02em; margin:0 0 6px; }
.foot-huge em{ font-style:normal; color:var(--lime); }

/* layout: colunas flanqueando a foto, centralizadas entre a imagem e a beirada do card */
.footer-main{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:clamp(14px,3vw,50px); }

/* carrossel de logos (lime) rolando ao FUNDO do card inteiro (largura total), atrás de tudo */
.footer-marquee{
  position:absolute; z-index:0; bottom:15%; overflow:hidden; left:2%; right:2%;
  -webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
          mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
}
.fm-track{ display:flex; align-items:center; gap:clamp(36px,5vw,84px); width:max-content; will-change:transform; }
.fm-logo{ flex:0 0 auto; height:clamp(30px,3.4vw,54px); width:clamp(100px,10vw,152px); background:var(--lime); opacity:1;
  -webkit-mask:var(--l) center/contain no-repeat; mask:var(--l) center/contain no-repeat; }

/* herói: texto em caixa alta acima + foto do fundador (maior, mais pra baixo) */
.footer-hero{ align-self:stretch; justify-self:center; display:flex; flex-direction:column; align-items:center; justify-content:space-between; padding-top:clamp(30px,4vw,72px); }
.footer-statement{
  position:relative; z-index:2; text-align:center; font-family:'Anton', var(--font, sans-serif); font-weight:400; text-transform:uppercase;
  font-size:clamp(2.1rem,4.8vw,4.6rem); line-height:0.92; letter-spacing:0.01em; color:var(--text-cream);
  margin-bottom:clamp(6px,1vw,16px);
}
.footer-statement em{ font-style:normal; color:var(--lime); }
.footer-figure{ position:relative; z-index:1; display:flex; align-items:flex-end; margin-bottom:-34px; /* foto rente à linha inferior do card, por dentro */ }
.footer-figure img{ height:clamp(390px,56vh,560px); width:auto; display:block; filter:drop-shadow(0 22px 36px rgba(0,0,0,0.5)); }
/* CTA menor, sobreposto à foto, mais baixo; hover = brilho verde (glow), sem movimento */
.footer-figure .footer-pill{ position:absolute; left:50%; bottom:11%; transform:translateX(-50%); z-index:3;
  height:46px; padding:0 22px; font-size:0.8rem; gap:8px; white-space:nowrap;
  transition:background .3s ease, box-shadow .35s ease; }
.footer-figure .footer-pill:hover{ transform:translateX(-50%); background:#e4ff57;
  box-shadow:0 0 0 3px rgba(210,255,0,0.32), 0 8px 26px rgba(210,255,0,0.45); }
.footer-figure .footer-pill:hover svg{ transform:none; }
/* colunas centralizadas no espaço entre a borda do bloco e o quadrado central */
.footer-col{ text-align:center; }
.footer-col h4{ font-size:0.7rem; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted-cream); margin-bottom:16px; }
.footer-col ul{ list-style:none; display:flex; flex-direction:column; align-items:center; gap:3px; }
/* hover estilo Lando: o texto rola pra cima e uma cópia lime sobe de baixo (máscara) */
.footer-col a{
  position:relative; display:inline-block; overflow:hidden; font-weight:800; text-transform:uppercase;
  font-size:clamp(1rem,1.3vw,1.3rem); line-height:1.08; letter-spacing:-0.01em;
}
.footer-col a > span{ display:block; transition:transform .5s cubic-bezier(.76,0,.24,1); }
.footer-col a::after{
  content:attr(data-text); position:absolute; left:0; top:0; color:var(--lime);
  transform:translateY(100%); transition:transform .5s cubic-bezier(.76,0,.24,1);
}
.footer-col a:hover > span{ transform:translateY(-100%); }
.footer-col a:hover::after{ transform:translateY(0); }
.footer-col .lime-link{ color:var(--lime); }
.footer-col .lime-link::after{ color:#fff; } /* no link já-lime, a cópia sobe em branco */
.footer-col.right{ text-align:center; }

.footer-cta{ display:none; } /* pílula movida para o meio das logos */
.pill-cta{
  display:inline-flex; align-items:center; gap:11px; height:60px; padding:0 34px; border-radius:999px;
  background:var(--lime); color:var(--text-dark); font-weight:700; text-transform:uppercase; letter-spacing:0.04em; font-size:0.92rem;
  transition:transform .3s var(--hover-ease), background .3s var(--hover-ease);
}
.pill-cta:hover{ transform:translateY(-2px); background:#e2ff4d; }
.pill-cta svg{ transition:transform .3s var(--hover-ease); }
.pill-cta:hover svg{ transform:translate(2px,-2px); }

/* logos com a pílula no meio, sem linhas divisórias */
.footer-logos{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:clamp(20px,3vw,44px); padding:6px 0 0; }
.footer-logos .pill-cta{ margin:0 clamp(12px,2vw,26px); }
/* logos monocromáticas claras (limpo, no fundo escuro do rodapé) */
.footer-logos img{
  height:26px; width:auto; opacity:0.6; transition:opacity .3s var(--hover-ease);
  filter:brightness(0) invert(1);
}
.footer-logos img:hover{ opacity:1; }

/* barra legal fora do bloco, sobre a moldura verde */
/* barra legal nos VÃOS inferiores do card (cantos transparentes = lime), texto preto pequeno */
.footer-legal-bar{
  position:absolute; left:0; right:0; bottom:2.6%; z-index:5;
  display:flex; justify-content:space-between; align-items:center; gap:12px;
  padding:0 clamp(20px,2.6vw,48px); color:#0e100a; font-size:0.62rem; font-weight:700; letter-spacing:0.01em;
}
.footer-legal{ display:flex; gap:18px; }
.footer-legal-bar a{ color:#0e100a; text-transform:uppercase; letter-spacing:0.04em; font-weight:700; transition:opacity .2s ease; }
.footer-legal-bar a:hover{ opacity:0.6; }
.footer-legal a:hover{ color:var(--lime); }
/* ---- Rodapé no celular (só aqui; o desktop acima fica intacto) ----
   No desktop o conteúdo é sobreposto (absoluto) à imagem do card. Num celular a
   imagem fica baixa demais (proporção ~16/9) e o conteúdo estoura/é cortado.
   Aqui a MESMA imagem entra como border-image (9-slice) e o conteúdo volta ao
   fluxo normal, empilhado, para o card acompanhar a altura do conteúdo.
   Ordem no celular: carrossel > Pages/Follow on > frase > foto+CTA > barra legal. */
@media (max-width:860px){
  footer{ padding-bottom:clamp(16px,5vw,26px); }
  .footer-frame{ padding:0; }
  .footer-bg{ display:none; } /* a mesma imagem entra como border-image no shell */
  .footer-shell{
    position:static; overflow:visible;
    /* o PRÓPRIO footer-bg.png (ex-fundo.png) do desktop, aplicado como 9-slice:
       cantos, aba do topo e entalhes da base saem intactos da imagem; só a faixa
       uniforme (y 64..870, medida no arquivo) é esticada. Assim o card acompanha
       qualquer altura de conteúdo sem deformar. */
    /* sem background/border-color: a imagem é transparente em volta do card, e é
       por ali que o lime do footer aparece (mesma continuidade do desktop) */
    background:transparent;
    border-style:solid; border-color:transparent;
    border-width:32px 30px 36px 30px;
    border-image:url('/assets/footer-bg.png') 64 61 71 60 fill stretch;
    padding:clamp(24px,6vw,34px) clamp(16px,4.5vw,26px) 0;
    gap:clamp(26px,6vw,36px);
  }
  /* 1) carrossel de parceiros no topo do card */
  .footer-marquee{ position:static; order:1; left:auto; right:auto; bottom:auto; }
  .footer-content{ display:block; order:2; }

  /* 2) Pages e Follow on lado a lado  3) frase  4) foto + CTA */
  .footer-main{
    display:grid; grid-template-columns:1fr 1fr; align-items:start;
    grid-template-areas:"pages follow" "hero hero";
    /* cada coluna centralizada na sua metade: assim a distância moldura->texto
       fica igual à distância texto->meio nos dois lados */
    justify-items:center;
    gap:clamp(26px,6vw,36px) 0;
  }
  .footer-col{ grid-area:pages; }
  .footer-col.right{ grid-area:follow; }
  .footer-hero{ grid-area:hero; justify-self:stretch; width:100%; padding-top:0; gap:clamp(18px,5vw,26px); }

  .footer-statement{ font-size:clamp(1.95rem,9vw,3rem); margin-top:clamp(16px,5vw,28px); margin-bottom:0; }
  /* foto rente à linha de baixo do card: a margem negativa entra na borda até o
     fundo do entalhe inferior da imagem (~63% dos 36px de border-bottom) */
  .footer-figure{ flex-direction:column; align-items:center; justify-content:flex-end;
    width:100%; gap:0; margin-bottom:-22px; }
  .footer-figure img{ height:auto; width:min(72%,290px); filter:drop-shadow(0 16px 28px rgba(0,0,0,0.45)); }
  /* CTA volta a sobrepor a foto, como no desktop */
  .footer-figure .footer-pill{ height:48px; padding:0 24px; font-size:0.82rem; bottom:12%; }

  /* links compactos e centralizados, mantendo área de toque confortável */
  .footer-col, .footer-col.right{ text-align:center; }
  .footer-col h4{ font-size:0.62rem; margin-bottom:9px; }
  .footer-col ul{ align-items:center; gap:2px; }
  .footer-col a{ font-size:0.82rem; line-height:1.2; padding:5px 0; overflow:visible; }
  /* o hover de rolagem depende de linha única: no toque some e o texto pode quebrar */
  .footer-col a::after{ display:none; }
  .footer-col a > span{ transition:none; }

  /* 5) barra legal sai de cima do card e fecha a página, sobre o lime */
  .footer-legal-bar{
    position:static; flex-direction:column; justify-content:center; text-align:center;
    gap:6px; padding:clamp(14px,4vw,20px) 20px 0; font-size:0.66rem;
  }
  .footer-legal{ gap:14px; }
}
@media (max-width:420px){
  /* mesmo bem estreito, Pages e Follow on continuam lado a lado */
  .footer-main{ column-gap:12px; }
  .footer-col a{ font-size:0.78rem; }
}

/* ============ Lista de serviços de TI ============ */
.svc-lists{ display:grid; grid-template-columns:1fr 1fr; gap:0 clamp(32px,5vw,72px); margin-top:52px; }
.svc-col{ border-top:1px solid var(--line-cream); }
.svc-row{
  position:relative; display:grid; grid-template-columns:46px 1fr auto; gap:20px; align-items:center;
  padding:28px 22px; border-bottom:1px solid var(--line-cream); color:inherit; border-radius:14px;
  transition:background .4s var(--hover-ease), transform .55s var(--reveal-ease), opacity .55s var(--reveal-ease);
}
/* barra verde na lateral que cresce no hover */
.svc-row::before{
  content:""; position:absolute; left:0; top:14%; bottom:14%; width:3px; border-radius:3px;
  background:var(--lime); transform:scaleY(0); transform-origin:center;
  transition:transform .4s var(--hover-ease);
}
/* hover: fundo verde de destaque + letras pretas */
.svc-row:hover{ background:var(--lime); border-bottom-color:transparent; transform:translateX(2px); }
.svc-row:hover::before{ transform:scaleY(1); background:#0e100a; }
.svc-row:hover .svc-info strong{ padding-left:4px; }
.svc-num{ font-weight:700; font-size:0.86rem; color:var(--lime); transition:transform .4s var(--hover-ease), color .3s var(--hover-ease); }
.svc-row:hover .svc-num{ transform:translateY(-2px); color:#0e100a; }
.svc-info strong{ display:block; font-weight:800; text-transform:uppercase; font-size:clamp(1.25rem,1.8vw,1.7rem); line-height:1; letter-spacing:-0.01em; transition:color .35s var(--hover-ease); }
.svc-row:hover .svc-info strong{ color:#0e100a; }
.svc-info span{ display:block; margin-top:8px; font-size:0.9rem; opacity:0.58; transition:color .3s var(--hover-ease), opacity .3s var(--hover-ease); }
.svc-row:hover .svc-info span{ color:#0e100a; opacity:0.72; }
.svc-arrow{ display:flex; color:var(--lime); opacity:0; transform:translateX(-10px); transition:opacity .35s var(--hover-ease), transform .35s var(--hover-ease), color .3s var(--hover-ease); }
.svc-row:hover .svc-arrow{ opacity:1; transform:none; color:#0e100a; }
@media (max-width:760px){
  .svc-lists{ grid-template-columns:1fr; }
  .svc-col:nth-child(2){ border-top:0; }
}

/* ============ Parceiros - marquee minimalista ligado ao scroll ============ */
.partners-sec.light{ padding-top:clamp(58px,7vw,88px); padding-bottom:clamp(58px,7vw,88px); overflow:hidden; }
.pm-head{ text-align:center; margin-bottom:clamp(34px,4vw,50px); }
.pm-eyebrow{ font-size:0.74rem; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--text-dark); opacity:0.5; }
/* carrossel estreito, centralizado, com fade nas beiradas (logos "saindo da tela") */
.partners-marquee{
  overflow:hidden; width:min(1320px,94vw); margin:0 auto;
  -webkit-mask:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
  mask:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.pm-track{ display:flex; width:max-content; will-change:transform; }
.pm-group{ display:flex; align-items:center; gap:clamp(44px,5vw,72px); padding-right:clamp(44px,5vw,72px); }
.pm-group img{ height:clamp(24px,2.3vw,36px); width:auto; filter:brightness(0); opacity:0.82; transition:opacity .3s var(--hover-ease); }
.pm-group img:hover{ opacity:1; }
@media (prefers-reduced-motion: reduce){ .pm-track{ transform:none !important; } }

/* ============ Mapa de área de atuação (Leaflet, tema escuro) ============ */
/* mapa vetorial direto na página + barra de bandeiras (troca de país) */
.map-wrap{ position:relative; margin-top:clamp(32px,4vw,48px); padding-top:52px; }
/* mapa sem fundo próprio: deixa o degradê da seção aparecer atrás dos estados */
#opsMap{ width:100%; max-width:1180px; margin-inline:auto; display:block; height:clamp(460px,64vh,640px); background:transparent; }

/* ===== Degradê contínuo do mapa até o rodapé (fundo esverdeia e clareia descendo) ===== */
/* seção do mapa clara (texto preto) -> flui para os stats claros e o rodapé lime */
.band.dark.map-sec{ background:#f4f6ee; color:var(--text-dark); }
/* eyebrow como pílula lime de destaque (texto preto) no fundo claro */
.map-sec .p-eyebrow, .clients-sec .p-eyebrow, .clients-page-hero .p-eyebrow, .service-hero .p-eyebrow, .service-overview .p-eyebrow, .team-sec .p-eyebrow, .hero-content .p-eyebrow{ background:var(--lime); color:var(--text-dark); padding:8px 16px; border-radius:999px; margin-bottom:24px; box-shadow:0 5px 16px rgba(168,204,0,0.32); }
.map-sec .p-eyebrow .p-dot, .clients-sec .p-eyebrow .p-dot, .clients-page-hero .p-eyebrow .p-dot, .service-hero .p-eyebrow .p-dot, .service-overview .p-eyebrow .p-dot, .team-sec .p-eyebrow .p-dot, .hero-content .p-eyebrow .p-dot{ background:var(--text-dark); box-shadow:none; animation:none; }
.map-sec h2 em, .clients-sec h2 em, .clients-page-hero h1 em{ color:var(--lime-deep); } /* leve acento verde no destaque, legível no claro */

/* ===== Página de serviço (service.html?s=...) ===== */
.service-hero{ position:relative; overflow:hidden; padding:clamp(140px,18vh,220px) 0 clamp(44px,5vw,72px); background:#f4f6ee; color:var(--text-dark); text-align:center; }
.service-hero .wrap{ position:relative; z-index:2; max-width:900px; }
.svc-back{ display:inline-block; margin-bottom:22px; font-size:0.78rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted-dark); transition:color .2s ease; }
.svc-back:hover{ color:var(--lime-deep); }
.service-hero h1{ font-family:'Anton', sans-serif; font-weight:400; text-transform:uppercase; font-size:clamp(2.8rem,8vw,6rem); line-height:0.94; letter-spacing:-0.01em; margin:0 0 20px; }
.service-hero p{ max-width:56ch; margin:0 auto 30px; opacity:0.74; font-size:clamp(1.05rem,1.5vw,1.25rem); line-height:1.5; }
.service-hero .p-eyebrow #svcNum{ font-weight:800; }
/* imagem do serviço (banner) */
.service-media{ background:#f4f6ee; padding:0 0 clamp(24px,3vw,48px); }
.service-img{ border-radius:clamp(18px,2vw,28px); overflow:hidden; aspect-ratio:1400/760; box-shadow:0 26px 60px rgba(23,24,15,0.16); }
.service-img img{ width:100%; height:100%; object-fit:cover; display:block; }
/* overview: texto + destaque (stat) */
.service-overview{ background:#f4f6ee; color:var(--text-dark); padding:clamp(40px,5vw,72px) 0; }
.svc-ov-wrap{ display:grid; grid-template-columns:1.7fr 1fr; gap:clamp(30px,5vw,72px); align-items:center; }
.svc-ov-text p{ font-size:clamp(1.15rem,1.7vw,1.5rem); line-height:1.5; }
.svc-stat{ border-left:3px solid var(--lime-deep); padding-left:clamp(20px,2vw,30px); }
.svc-stat b{ display:block; font-family:'Anton', sans-serif; font-weight:400; font-size:clamp(2.6rem,5vw,4.4rem); line-height:0.9; color:var(--lime-deep); }
.svc-stat span{ display:block; margin-top:8px; text-transform:uppercase; letter-spacing:0.08em; font-size:0.82rem; font-weight:600; opacity:0.7; }
/* título de bloco */
.svc-block-h{ font-size:clamp(1.6rem,3vw,2.6rem); text-transform:uppercase; letter-spacing:-0.01em; margin:0 0 clamp(28px,3.5vw,44px); }
/* features (cards claros) */
/* color OBRIGATÓRIO aqui: sem ele o texto herda --text-cream do body e fica
   branco sobre card branco (era o motivo dos cards "invisíveis") */
.service-features{ background:#f4f6ee; color:var(--text-dark); padding:clamp(44px,5vw,80px) 0; }
/* ===== "What's included": lista editorial numerada, sem caixas =====
   Mesma mecânica das .svc-row da home (a linha inteira acende em lime e o texto
   vira preto), aqui em versão clara. O número faz o papel da antiga barrinha. */
.service-grid{ display:block; border-top:1px solid rgba(23,24,15,0.18); }
.svc-feature{
  position:relative; overflow:hidden;
  display:grid; grid-template-columns:clamp(40px,4.2vw,64px) 1fr; align-items:start;
  padding:clamp(22px,2.6vw,32px) clamp(12px,1.6vw,22px);
  border-bottom:1px solid rgba(23,24,15,0.18); border-radius:14px;
  transition:transform .5s var(--hover-ease), border-color .3s var(--hover-ease);
}
/* o lime sobe de baixo preenchendo a linha inteira */
.svc-feature::after{
  content:""; position:absolute; inset:0; z-index:0; background:var(--lime);
  transform:translateY(101%); transition:transform .5s var(--hover-ease);
}
.svc-feature > *{ position:relative; z-index:1; }
.svc-feature:hover{ transform:translateX(4px); border-bottom-color:transparent; }
.svc-feature:hover::after{ transform:translateY(0); }
.sf-num{
  font-family:'Anton', sans-serif; font-weight:400; line-height:1.5;
  font-size:clamp(0.95rem,1.2vw,1.2rem); color:var(--lime-deep);
  transition:color .35s var(--hover-ease), transform .45s var(--hover-ease);
}
.svc-feature h3{ font-size:clamp(1.15rem,1.6vw,1.5rem); font-weight:800; text-transform:uppercase; letter-spacing:-0.01em;
  margin:0 0 8px; transition:color .35s var(--hover-ease); }
.svc-feature p{ margin:0; max-width:66ch; opacity:0.7; line-height:1.5; font-size:0.98rem;
  transition:color .35s var(--hover-ease), opacity .35s var(--hover-ease); }
/* sobre o lime tudo vira preto e o número sobe um fio */
.svc-feature:hover .sf-num{ color:#0e100a; transform:translateY(-2px); }
.svc-feature:hover h3, .svc-feature:hover p{ color:#0e100a; }
.svc-feature:hover p{ opacity:0.78; }
@media (max-width:560px){
  .svc-feature{ grid-template-columns:28px 1fr; padding:20px 8px; }
  .svc-feature p{ font-size:0.92rem; }
}
/* how it works (etapas numeradas) */
/* ===== Etapas: cartões com número gigante em contorno como marca d'água ===== */
.service-process{ position:relative; background:var(--olive); color:var(--text-cream); padding:clamp(48px,6vw,90px) 0; overflow:hidden; }
/* brilho lime difuso ao fundo, para a seção não ser um retângulo chapado */
.service-process::before{
  content:""; position:absolute; z-index:0; top:-18%; right:-10%; width:52vw; height:52vw; max-width:640px; max-height:640px;
  border-radius:50%; background:radial-gradient(circle, rgba(210,255,0,0.13), transparent 62%); filter:blur(30px); pointer-events:none;
}
.service-process > .wrap{ position:relative; z-index:1; }
.process-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%,220px), 1fr)); gap:clamp(16px,1.8vw,26px); }
.process-step{
  position:relative; overflow:hidden; isolation:isolate;
  padding:clamp(26px,3vw,36px) clamp(20px,2.2vw,28px) clamp(24px,2.8vw,32px);
  border:1px solid rgba(210,255,0,0.22); border-radius:20px;
  background:linear-gradient(158deg, rgba(210,255,0,0.07), rgba(210,255,0,0) 62%);
  transition:transform .5s var(--hover-ease), border-color .4s var(--hover-ease),
             background .5s var(--hover-ease), box-shadow .5s var(--hover-ease);
}
/* o número vira marca d'água vazada no canto, bem grande */
.ps-num{
  position:absolute; z-index:-1; top:-0.12em; right:0.1em; pointer-events:none;
  font-family:'Anton', sans-serif; font-weight:400; line-height:1;
  font-size:clamp(4.2rem,7vw,6.2rem); color:transparent;
  -webkit-text-stroke:1.5px rgba(210,255,0,0.34);
  transition:-webkit-text-stroke-color .4s var(--hover-ease), transform .5s var(--hover-ease), opacity .4s var(--hover-ease);
}
/* sem suporte a text-stroke o número sumiria (color:transparent): cai para lime sólido */
@supports not ((-webkit-text-stroke: 1px red)){
  .ps-num{ color:rgba(210,255,0,0.26); }
}
.process-step h3{ font-size:clamp(1.2rem,1.6vw,1.5rem); font-weight:800; text-transform:uppercase; margin:0 0 10px; }
/* barrinha lime acima do título, cresce no hover */
.process-step h3::before{ content:""; display:block; width:24px; height:3px; border-radius:3px; background:var(--lime); margin-bottom:14px;
  transition:width .5s var(--hover-ease); }
.process-step p{ opacity:0.72; line-height:1.5; font-size:0.98rem; }
.process-step:hover{
  transform:translateY(-6px); border-color:var(--lime);
  background:linear-gradient(158deg, rgba(210,255,0,0.16), rgba(210,255,0,0.02) 68%);
  box-shadow:0 26px 50px -30px rgba(210,255,0,0.6);
}
.process-step:hover .ps-num{ -webkit-text-stroke-color:var(--lime); transform:scale(1.05); }
.process-step:hover h3::before{ width:54px; }
@media (prefers-reduced-motion: reduce){
  .svc-feature, .svc-feature::after, .process-step, .ps-num{ transition:none; }
  .svc-feature:hover, .process-step:hover{ transform:none; }
}
/* CTA final + outros serviços (degrada para o lime do rodapé) */
.service-cta{ background:linear-gradient(180deg, #f4f6ee 0%, #eef2cf 55%, #e8f79a 100%); color:var(--text-dark); padding:clamp(56px,7vw,110px) 0 clamp(80px,9vw,140px); text-align:center; }
.svc-cta-inner h2{ font-family:'Anton', sans-serif; font-weight:400; text-transform:uppercase; font-size:clamp(2rem,4.5vw,3.6rem); line-height:0.98; margin:0 0 14px; }
.svc-cta-inner em{ font-style:normal; color:var(--lime-deep); }
.svc-cta-inner p{ opacity:0.72; max-width:44ch; margin:0 auto 26px; font-size:1.05rem; }
.other-services{ margin-top:clamp(44px,5vw,70px); }
.os-label{ display:block; font-size:0.74rem; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted-dark); margin-bottom:16px; }
.os-links{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.os-links a{ padding:9px 18px; border-radius:999px; background:rgba(23,24,15,0.06); border:1px solid rgba(23,24,15,0.1); font-weight:700; font-size:0.86rem; text-transform:uppercase; letter-spacing:0.02em; transition:background .25s var(--hover-ease), color .25s var(--hover-ease); }
.os-links a:hover{ background:var(--text-dark); color:var(--cream); }
@media (max-width:760px){ .svc-ov-wrap{ grid-template-columns:1fr; } }

/* ===== Time (imagem + selo HIPAA) ===== */
.team-sec{ background:#f4f6ee; color:var(--text-dark); }
.team-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,72px); align-items:center; }
.team-media{ position:relative; }
/* 78% (era 84%): com 3 fotos empilhadas a coluna crescia demais ao lado do texto */
.team-img{ width:78%; aspect-ratio:16/10; border-radius:18px; overflow:hidden; display:flex; align-items:center; justify-content:center;
  box-shadow:0 22px 46px rgba(23,24,15,0.16);
  background:radial-gradient(120% 120% at 30% 20%, rgba(210,255,0,0.12), transparent 60%), linear-gradient(140deg, var(--olive), var(--olive-2)); }
.team-img:first-child{ margin-left:0; }
/* fotos sobrepostas em zigue-zague (não só para a direita, senão a coluna desequilibra
   com 3 fotos): a 2ª puxa para a direita, a 3ª volta para perto da margem esquerda.
   Sem contorno: a separação vem da sombra (profundidade). */
.team-img-2{ margin-left:20%; margin-top:-9%; position:relative; z-index:2;
  box-shadow:0 26px 54px rgba(23,24,15,0.3); }
.team-img-3{ margin-left:6%; margin-top:-9%; position:relative; z-index:3;
  box-shadow:0 30px 60px rgba(23,24,15,0.34); }
.team-img img{ width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .6s var(--hover-ease); }
/* flutuação lenta e dessincronizada: dá vida sem competir com o texto ao lado.
   Delays negativos para as três já entrarem em fases diferentes do ciclo. */
@media (prefers-reduced-motion: no-preference){
  .team-img{ animation:teamFloat 7s ease-in-out infinite; }
  .team-img-2{ animation-duration:8.6s; animation-delay:-2.8s; }
  .team-img-3{ animation-duration:9.8s; animation-delay:-5.4s; }
  @keyframes teamFloat{
    0%, 100%{ transform:translateY(0); }
    50%{ transform:translateY(-11px); }
  }
}
/* hover: só a imagem interna escala, para não brigar com o translateY da flutuação */
.team-img:hover img{ transform:scale(1.06); }
.team-img span{ font-size:0.78rem; text-transform:uppercase; letter-spacing:0.14em; color:var(--muted-cream); }
.team-text h2{ font-size:clamp(2rem,3.8vw,3.2rem); line-height:1.02; margin:0 0 14px; }
.team-text em{ font-style:normal; color:var(--lime-deep); }
.team-text p{ opacity:0.74; font-size:1.08rem; line-height:1.5; max-width:46ch; margin:0 0 clamp(24px,3vw,36px); }
.team-hipaa{ display:flex; align-items:center; gap:clamp(16px,2vw,24px); padding-top:clamp(20px,2.5vw,30px); border-top:1px solid rgba(23,24,15,0.12); }
.team-seal{ flex:0 0 auto; width:clamp(84px,9vw,116px); }
.team-seal svg{ width:100%; height:auto; display:block; }
.team-hipaa-txt strong{ display:block; font-size:1.05rem; font-weight:800; text-transform:uppercase; letter-spacing:-0.01em; margin-bottom:4px; }
.team-hipaa-txt span{ font-size:0.92rem; opacity:0.68; line-height:1.4; }
@media (max-width:800px){
  .team-wrap{ grid-template-columns:1fr; gap:clamp(30px,7vw,44px); }
  /* fotos ocupam melhor a largura no celular, mantendo a sobreposição em escada */
  .team-img{ width:84%; border-radius:16px; }
  .team-img-2{ margin-left:16%; margin-top:-8%; box-shadow:0 18px 38px rgba(23,24,15,0.32); }
  .team-img-3{ margin-left:5%; margin-top:-8%; box-shadow:0 20px 42px rgba(23,24,15,0.34); }
  .team-text p{ max-width:none; }
  .team-hipaa{ gap:16px; }
}
@media (max-width:520px){
  .team-img{ width:90%; }
  .team-img-2{ margin-left:10%; }
  .team-img-3{ margin-left:3%; }
  /* selo + texto HIPAA empilhados para não espremer a leitura */
  .team-hipaa{ flex-direction:column; align-items:flex-start; gap:14px; }
}

/* ===== Lumio (produto próprio + vídeo) ===== */
.lumio-sec{ background:var(--olive); }
.lumio-wrap{ display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(32px,5vw,72px); align-items:center; }
.lumio-text h2{ font-size:clamp(2rem,4vw,3.4rem); line-height:1.02; margin:0 0 16px; }
.lumio-text em{ font-style:normal; color:var(--lime); }
.lumio-text p{ opacity:0.72; font-size:1.08rem; line-height:1.5; max-width:46ch; margin:0 0 28px; }
.video-frame{ position:relative; aspect-ratio:16/9; border-radius:clamp(14px,1.6vw,22px); overflow:hidden; background:#000; box-shadow:0 30px 70px rgba(0,0,0,0.45); }
.video-frame iframe, .video-frame video{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; object-fit:cover; }
@media (max-width:860px){ .lumio-wrap{ grid-template-columns:1fr; } }

/* página de clientes: hero com espaço para o nav fixo + grafismo lime divertido */
.clients-page-hero{ position:relative; overflow:hidden; padding:clamp(150px,20vh,240px) 0 clamp(40px,4.5vw,64px); background:#f4f6ee; color:var(--text-dark); text-align:center; }
.clients-page-hero .wrap{ position:relative; z-index:2; }
.clients-page-hero h1{ font-size:clamp(2.6rem,6.5vw,5rem); line-height:0.98; letter-spacing:-0.02em; margin:0 0 18px; text-transform:uppercase; font-family:'Anton', sans-serif; font-weight:400; }
.clients-page-hero p{ max-width:60ch; margin:0 auto; opacity:0.72; font-size:clamp(1rem,1.4vw,1.15rem); }
.cph-orb{ position:absolute; z-index:0; width:46vw; height:46vw; max-width:620px; max-height:620px; right:-10vw; top:-16vw; border-radius:50%;
  background:radial-gradient(circle, rgba(210,255,0,0.5), transparent 62%); filter:blur(16px); pointer-events:none; animation:mgFloat 15s ease-in-out infinite; }
.cph-orb-2{ right:auto; top:auto; left:-14vw; bottom:-22vw; background:radial-gradient(circle, rgba(210,255,0,0.3), transparent 64%); animation:mgFloat 21s ease-in-out infinite reverse; }
.cph-stats{ display:flex; justify-content:center; flex-wrap:wrap; gap:clamp(22px,5vw,60px); margin-top:clamp(28px,3.5vw,46px); }
.cph-stats span{ font-size:0.82rem; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; color:var(--muted-dark); }
.cph-stats b{ display:block; font-family:'Anton', sans-serif; font-weight:400; font-size:clamp(1.9rem,3.6vw,2.9rem); color:var(--lime-deep); line-height:1; margin-bottom:5px; }
/* seção dos logos: degradê para o lime do rodapé (continuidade) + hover divertido nas células */
.clients-sec.clients-page-grid{ padding-top:clamp(18px,2.5vw,36px); background:linear-gradient(180deg, #f4f6ee 0%, #f4f6ee 48%, #eef2cf 76%, #e8f79a 100%); }
.clients-page-grid .client-logo{ border-radius:22px; transition:background .32s var(--hover-ease), transform .32s var(--hover-ease), box-shadow .32s var(--hover-ease); }
.clients-page-grid .client-logo:hover{ background:rgba(255,255,255,0.7); transform:translateY(-6px); box-shadow:0 16px 34px rgba(23,24,15,0.1); }

/* ===== Parceiros (página): um card por fabricante com o que ele habilita ===== */
.partners-page{
  background:linear-gradient(180deg, #f4f6ee 0%, #f4f6ee 52%, #eef2cf 80%, #e8f79a 100%);
  color:var(--text-dark);
  padding:clamp(24px,3vw,48px) 0 clamp(70px,8vw,120px);
}
.partner-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(14px,1.8vw,24px); }
.partner-card{
  display:flex; flex-direction:column;
  padding:clamp(24px,2.6vw,36px);
  border:1px solid rgba(23,24,15,0.12); border-radius:24px; background:rgba(255,255,255,0.55);
  transition:background .32s var(--hover-ease), transform .32s var(--hover-ease),
             box-shadow .32s var(--hover-ease), border-color .32s var(--hover-ease);
}
.partner-card:hover{
  background:rgba(255,255,255,0.88); border-color:rgba(168,204,0,0.5);
  transform:translateY(-6px); box-shadow:0 20px 42px rgba(23,24,15,0.12);
}
/* mesmo tratamento do marquee da home: logo achatada para preto, uniformizando marcas
   de cores muito diferentes (Microsoft colorido x Dell azul x Cogent) */
.partner-logo{ height:clamp(26px,2.6vw,34px); margin-bottom:clamp(18px,2vw,26px); }
.partner-logo img{ height:100%; width:auto; max-width:100%; object-fit:contain; filter:brightness(0); opacity:0.84; }
.partner-card h3{ font-size:clamp(1.3rem,2vw,1.7rem); font-weight:800; letter-spacing:-0.02em; margin:0 0 8px; }
.partner-card > p{ font-size:1rem; line-height:1.5; opacity:0.7; margin:0 0 clamp(16px,2vw,22px); }
.partner-list{ list-style:none; margin:0 0 clamp(20px,2.4vw,28px); padding:0; display:flex; flex-direction:column; gap:11px; }
.partner-list li{ position:relative; padding-left:22px; font-size:0.95rem; line-height:1.45; opacity:0.78; }
.partner-list li::before{
  content:''; position:absolute; left:0; top:0.55em; width:7px; height:7px;
  border-radius:50%; background:var(--lime-deep); opacity:0.85;
}
/* links dos serviços relacionados ficam colados na base, alinhando cards de alturas diferentes */
.partner-links{ margin-top:auto; display:flex; flex-wrap:wrap; gap:10px; }
.partner-links a{
  display:inline-flex; align-items:center; gap:7px;
  font-size:0.82rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em;
  padding:9px 15px; border-radius:999px; border:1px solid rgba(23,24,15,0.16);
  transition:background .3s var(--hover-ease), border-color .3s var(--hover-ease), transform .3s var(--hover-ease);
}
.partner-links a svg{ width:14px; height:14px; }
.partner-links a:hover{ background:var(--lime); border-color:var(--lime); transform:translateY(-2px); }
.partners-cta{ text-align:center; margin-top:clamp(48px,6vw,80px); }
.partners-cta h2{ font-size:clamp(1.8rem,3.4vw,2.8rem); margin:0 0 12px; }
.partners-cta p{ max-width:56ch; margin:0 auto clamp(24px,3vw,34px); opacity:0.72; font-size:1.05rem; line-height:1.5; }
@media (max-width:800px){
  .partner-grid{ grid-template-columns:1fr; }
}

/* ===== Contato: canais diretos (sem formulário), degradê para o rodapé ===== */
.contact-sec{
  background:linear-gradient(180deg, #f4f6ee 0%, #f4f6ee 46%, #eef2cf 76%, #e8f79a 100%);
  color:var(--text-dark);
  padding:clamp(24px,3vw,48px) 0 clamp(70px,8vw,120px);
}
.contact-card{
  display:flex; align-items:center; gap:clamp(16px,2.2vw,28px);
  padding:clamp(20px,2.4vw,30px) clamp(20px,2.6vw,34px);
  border:1px solid rgba(23,24,15,0.12); border-radius:22px; background:rgba(255,255,255,0.5);
  transition:background .32s var(--hover-ease), transform .32s var(--hover-ease),
             box-shadow .32s var(--hover-ease), border-color .32s var(--hover-ease);
}
.contact-card:hover{
  background:rgba(255,255,255,0.86); border-color:rgba(168,204,0,0.5);
  transform:translateY(-6px); box-shadow:0 18px 38px rgba(23,24,15,0.12);
}
/* o e-mail é o canal principal: card largo, tipografia maior */
.contact-card-main{ margin-bottom:clamp(14px,1.8vw,22px); }
.contact-icon{
  flex:0 0 auto; display:flex; align-items:center; justify-content:center;
  width:clamp(48px,5vw,62px); height:clamp(48px,5vw,62px); border-radius:16px;
  background:var(--lime); color:var(--text-dark); box-shadow:0 6px 18px rgba(168,204,0,0.34);
}
.contact-icon svg{ width:52%; height:52%; display:block; }
.contact-body{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:3px; }
.contact-body strong{ font-size:0.78rem; font-weight:700; text-transform:uppercase; letter-spacing:0.12em; color:var(--muted-dark); }
.contact-value{ font-size:clamp(1.05rem,1.7vw,1.35rem); font-weight:700; letter-spacing:-0.01em; word-break:break-word; }
.contact-card-main .contact-value{ font-size:clamp(1.25rem,2.6vw,2rem); }
.contact-note{ font-size:0.92rem; opacity:0.62; margin-top:2px; }
.contact-arrow{ flex:0 0 auto; width:22px; height:22px; opacity:0.4; transition:transform .32s var(--hover-ease), opacity .32s var(--hover-ease); }
.contact-arrow svg{ width:100%; height:100%; display:block; }
.contact-card:hover .contact-arrow{ opacity:1; transform:translate(3px,-3px); }
.contact-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(12px,1.6vw,20px); }
/* países atendidos: espelha a lista COUNTRIES do mapa (js/map.js). Ao incluir um país lá,
   inclua também aqui, senão as duas páginas passam a contar coisas diferentes. */
.contact-reach{ margin-top:clamp(40px,5vw,68px); }
.contact-reach h2{
  font-size:0.78rem; font-weight:700; text-transform:uppercase; letter-spacing:0.12em;
  color:var(--muted-dark); margin:0 0 clamp(16px,2vw,22px);
}
.contact-countries{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:clamp(10px,1.4vw,16px); }
.contact-countries li{
  display:flex; align-items:center; gap:10px;
  padding:10px clamp(14px,1.6vw,18px);
  border:1px solid rgba(23,24,15,0.12); border-radius:999px; background:rgba(255,255,255,0.5);
}
.contact-countries img{ width:24px; height:17px; object-fit:cover; border-radius:3px; display:block; }
.cc-name{ font-weight:700; font-size:0.98rem; letter-spacing:-0.01em; }
.cc-tag{
  font-size:0.66rem; font-weight:700; text-transform:uppercase; letter-spacing:0.1em;
  padding:3px 9px; border-radius:999px; background:rgba(168,204,0,0.24); color:var(--lime-deep);
}
/* remoto sem equipe local: cinza, para não competir com o verde de presença própria */
.cc-tag.is-remote{ background:rgba(23,24,15,0.08); color:var(--muted-dark); }
@media (max-width:520px){
  .contact-countries{ gap:8px; }
  .contact-countries li{ width:100%; }
  .cc-tag{ margin-left:auto; }
}
/* faixa de disponibilidade: fecha a página reafirmando cobertura, sem inventar dado novo */
.contact-avail{
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,3vw,44px);
  margin-top:clamp(40px,5vw,68px); padding-top:clamp(26px,3vw,40px);
  border-top:1px solid rgba(23,24,15,0.14);
}
.contact-avail-item strong{
  display:block; font-family:'Anton', sans-serif; font-weight:400; line-height:1;
  font-size:clamp(1.7rem,3.2vw,2.6rem); color:var(--lime-deep); margin-bottom:7px;
}
.contact-avail-item span{ font-size:0.9rem; opacity:0.66; line-height:1.4; }
@media (max-width:800px){
  .contact-grid{ grid-template-columns:1fr; }
  .contact-avail{ grid-template-columns:1fr; gap:22px; }
}
@media (max-width:520px){
  /* seta fora em telas estreitas: o card inteiro já é clicável */
  .contact-arrow{ display:none; }
  .contact-card{ gap:14px; }
}

/* ===== Clientes: logos limpos (sem fundo), grid apresentável logo abaixo do mapa ===== */
.clients-sec{ background:#f4f6ee; color:var(--text-dark); padding:clamp(24px,3vw,48px) 0 clamp(70px,8vw,120px); }
.clients-head{ text-align:center; }
.clients-head .p-eyebrow{ justify-content:center; }
.clients-head h2{ font-size:clamp(2rem,4vw,3.4rem); }
.clients-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(clamp(130px,16vw,190px), 1fr)); gap:clamp(10px,2vw,32px);
  margin-top:clamp(40px,5vw,64px); align-items:center; }
.client-logo{ display:flex; align-items:center; justify-content:center; padding:clamp(16px,2vw,30px); min-height:110px; }
/* caixa uniforme para todos os logos (mesmo tamanho padrão, contidos; todos já com fundo transparente) */
.client-logo img{ max-width:clamp(118px,13vw,156px); max-height:clamp(40px,3.6vw,50px); width:auto; height:auto; object-fit:contain;
  transition:transform .4s var(--hover-ease), filter .4s var(--hover-ease); }
/* logos mais quadrados/compactos: caixa um pouco maior p/ ficarem no mesmo tamanho visual dos wordmarks */
.client-logo img[src*="astral"],
.client-logo img[src*="efficace"],
.client-logo img[src*="empire"],
.client-logo img[src*="semex"],
.client-logo img[src*="berkdar"],
.client-logo img[src*="biotec"],
.client-logo img[src*="ssu"]{ max-height:clamp(58px,5.2vw,76px); max-width:clamp(126px,14vw,170px); }
.client-logo:hover img{ transform:scale(1.08); filter:drop-shadow(0 6px 14px rgba(0,0,0,0.12)); }
.clients-cta{ text-align:center; margin-top:clamp(30px,4vw,52px); }
/* A última seção antes do rodapé faz a ponte de cor: quase-branco no topo -> lime na
   base, casando com o #e8f79a onde o card do rodapé começa. Vale para a home e para
   clients.html, onde a grade de clientes é quem encosta no rodapé. */
   base, casando com o #e8f79a onde o card do rodapé começa. O :not() preserva o degradê
   próprio da página de clientes, que é mais específico e já resolvia isso lá. */
main > .clients-sec:last-child:not(.clients-page-grid){ background:linear-gradient(180deg, #f4f6ee 0%, #eef2cf 48%, #e8f79a 100%); }
.map-flags{ position:absolute; top:clamp(6px,1vw,12px); left:50%; transform:translateX(-50%); z-index:500; display:flex; gap:8px; }
/* bandeiras pequenas e minimalistas (só a bandeirinha) */
.flag-btn{
  padding:4px; border-radius:7px; cursor:pointer; line-height:0;
  border:1.5px solid transparent; background:rgba(20,21,15,0.55); backdrop-filter:blur(6px);
  transition:border-color .25s var(--hover-ease), background .25s var(--hover-ease), transform .2s var(--hover-ease);
}
.flag-btn span{ display:none; }
.flag-btn img{ width:26px; height:18px; object-fit:cover; border-radius:3px; display:block; opacity:0.8; transition:opacity .2s ease; }
.flag-btn:hover{ transform:translateY(-1px); border-color:var(--line-cream); }
.flag-btn:hover img{ opacity:1; }
.flag-btn.is-active{ border-color:var(--lime); background:rgba(210,255,0,0.14); }
.flag-btn.is-active img{ opacity:1; }
/* selo de atuação remota: aparece só quando o país ativo é remoto (classe via JS) */
.map-note{
  position:absolute; left:50%; bottom:clamp(6px,1.4vw,16px); transform:translateX(-50%) translateY(4px);
  z-index:500; display:inline-flex; align-items:center; gap:8px;
  padding:7px 14px; border-radius:999px; pointer-events:none;
  background:rgba(20,21,15,0.82); backdrop-filter:blur(6px); border:1px solid rgba(210,255,0,0.32);
  color:var(--text-cream); font-size:0.68rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase;
  opacity:0; visibility:hidden; transition:opacity .35s var(--hover-ease), transform .35s var(--hover-ease), visibility .35s;
}
.map-note::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--lime); flex-shrink:0; }
.map-note.is-on{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
@media (max-width:560px){ .map-note{ font-size:0.6rem; padding:6px 11px; letter-spacing:0.07em; } }
/* estados atendidos: brilho verde + elevação; acendem mais no hover */
#opsMap path.served-state{ filter:drop-shadow(0 0 6px rgba(210,255,0,0.45)) drop-shadow(0 2px 3px rgba(0,0,0,0.55)); transition:filter .25s ease; cursor:pointer; }
#opsMap path.served-state:hover{ filter:drop-shadow(0 0 12px rgba(210,255,0,0.75)) drop-shadow(0 6px 9px rgba(0,0,0,0.8)); }
/* divisas dos estados cinza um pouco mais suaves/definidas */
#opsMap path.gray-state{ transition:fill-opacity .25s ease; }
/* iniciais dos estados atendidos (sobre o verde) */
.leaflet-tooltip.state-label{ background:transparent; border:0; box-shadow:none; padding:0; margin:0; color:var(--text-dark); font-weight:800; font-size:0.56rem; line-height:1; letter-spacing:0.01em; text-align:center; white-space:nowrap; text-shadow:0 1px 2px rgba(255,255,255,0.35); pointer-events:none; display:none; }
.leaflet-tooltip.state-label::before{ display:none; }
/* só as siglas do país ativo ficam visíveis (tooltips do país anterior permanecem no DOM) */
#opsMap.show-USA .state-label.label-USA, #opsMap.show-BRA .state-label.label-BRA,
#opsMap.show-MEX .state-label.label-MEX, #opsMap.show-COL .state-label.label-COL,
#opsMap.show-ARG .state-label.label-ARG{ display:block; }
.leaflet-container{ background:var(--olive-2); font-family:var(--font); }
.leaflet-control-zoom a{ background:var(--olive-2); color:var(--text-cream); border-color:var(--line-cream); }
.leaflet-control-zoom a:hover{ background:var(--lime); color:var(--text-dark); }
.leaflet-bar{ border-color:var(--line-cream); box-shadow:none; }
.leaflet-control-attribution{ background:rgba(20,21,15,0.75); color:var(--muted-cream); }
.leaflet-control-attribution a{ color:var(--lime); }
.leaflet-popup-content-wrapper{ background:var(--olive-2); color:var(--text-cream); border-radius:12px; }
.leaflet-popup-content{ font-weight:600; }
.leaflet-popup-tip{ background:var(--olive-2); }
.map-pin{ width:15px; height:15px; border-radius:50%; background:var(--lime); border:2px solid var(--text-dark); box-shadow:0 0 0 4px rgba(210,255,0,0.22), 0 0 14px rgba(210,255,0,0.6); }

.partners-head{ text-align:center; max-width:62ch; margin:0 auto; }
.partners-head h2{ font-size:clamp(2.4rem,4.5vw,3.8rem); margin:0 auto; max-width:18ch; }
.partners-head p{ margin:18px auto 0; opacity:0.72; font-size:1.08rem; max-width:56ch; }
.partners-sec .p-eyebrow{ display:inline-flex; align-items:center; justify-content:center; gap:10px; font-size:0.76rem; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--lime); margin-bottom:18px; }
.p-dot{ width:8px; height:8px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 0 rgba(210, 255, 0,0.6); animation:p-pulse 2s infinite; }
@keyframes p-pulse{ 0%{ box-shadow:0 0 0 0 rgba(210, 255, 0,0.5);} 70%{ box-shadow:0 0 0 9px rgba(210, 255, 0,0);} 100%{ box-shadow:0 0 0 0 rgba(210, 255, 0,0);} }

/* cartões arredondados de parceiros (sem carrossel) */
.partners-row{
  display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:56px;
}
.partner-item{
  position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:26px; padding:56px 26px; text-align:center;
  border:1px solid var(--line-cream); border-radius:24px; background:rgba(244,244,237,0.02);
  transition:background .45s var(--hover-ease), border-color .45s var(--hover-ease), transform .55s var(--reveal-ease), box-shadow .45s var(--hover-ease), opacity .55s var(--reveal-ease);
}
.partner-item:hover{ background:var(--olive-2); border-color:var(--lime); box-shadow:0 22px 46px -26px rgba(210, 255, 0,0.4); }
.partner-logo{ height:54px; display:flex; align-items:center; justify-content:center; }
.partner-logo img{
  height:100%; width:auto; max-width:170px; object-fit:contain;
  opacity:0.75; transition:opacity .45s var(--hover-ease), transform .45s var(--hover-ease);
}
.partner-item:hover .partner-logo img{ opacity:1; transform:scale(1.05); }
.partner-item strong{ font-weight:700; font-size:1.12rem; letter-spacing:-0.01em; opacity:0.85; transition:opacity .45s var(--hover-ease); }
.partner-item:hover strong{ opacity:1; }

/* faixa de destaques embaixo (centralizada) */
.ph-features{ display:flex; flex-wrap:wrap; justify-content:center; gap:16px 44px; margin-top:52px; padding-top:40px; border-top:1px solid var(--line-cream); }
.ph-features span{ display:inline-flex; align-items:center; gap:11px; font-weight:600; font-size:0.94rem; opacity:0.82; }
.ph-features span::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--lime); flex-shrink:0; }

@media (prefers-reduced-motion: reduce){ .p-dot{ animation:none; } }
@media (max-width:900px){
  .partners-row{ grid-template-columns:1fr 1fr; }
  .partner-item{ padding:44px 24px; }
}
@media (max-width:520px){
  .partners-row{ grid-template-columns:1fr; }
}

/* ============ Cabeçalho de página interna ============ */
.page-hero{ position:relative; background:var(--olive); color:var(--text-cream); overflow:hidden; padding:180px 0 90px; border-bottom:1px solid var(--line-cream); }
.page-hero .eyebrow{ font-size:0.74rem; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--lime); margin-bottom:18px; }
.page-hero h1{ font-size:clamp(2.8rem,8vw,6.5rem); max-width:16ch; }
.page-hero p{ margin-top:22px; max-width:52ch; opacity:0.72; font-size:1.1rem; }

/* ============ Grade de logos de clientes ============ */
.clients-wall{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid var(--line-cream); border-left:1px solid var(--line-cream); }
.client-cell{
  position:relative; aspect-ratio:16/9;
  border-right:1px solid var(--line-cream); border-bottom:1px solid var(--line-cream);
  display:flex; align-items:center; justify-content:center; padding:34px;
  transition:background .4s var(--hover-ease);
}
.client-cell:hover{ background:var(--olive-2); }
.client-cell img{
  max-height:56px; max-width:78%; width:auto; object-fit:contain;
  opacity:0.72; transition:opacity .4s var(--hover-ease), transform .4s var(--hover-ease);
}
.client-cell:hover img{ opacity:1; transform:scale(1.04); }
/* placeholder quando não há arquivo (a classe .empty é setada via JS) */
.client-cell.empty::after{
  content:"LOGO"; font-size:0.7rem; letter-spacing:0.2em; font-weight:700;
  color:rgba(244,244,237,0.28);
}
.client-cell.empty img{ display:none; }
@media (max-width:1000px){ .clients-wall{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .clients-wall{ grid-template-columns:1fr; } }

/* ============ Responsivo ============ */
@media (max-width: 1000px){
  .grid-4{ grid-template-columns:1fr 1fr; }
  .feature{ grid-template-columns:1fr; gap:36px; }
  .feature.flip .feature-text{ order:0; }
  .big-stats{ grid-template-columns:1fr; }
  .foot-grid{ grid-template-columns:1fr 1fr; }
  .band{ padding:80px 0; }
  .wrap{ padding:0 24px; }
}
@media (max-width: 760px){
  html, body{ overflow-x:hidden; }
}
@media (max-width: 760px){
  /* hero: altura fixa cortava o texto em telas baixas; agora cresce com o conteúdo */
  .hero{ padding-top:104px; }
  .hero-inner{ height:auto; min-height:calc(100dvh - 104px); padding-block:clamp(24px,7vw,44px); }
  .hero-content p{ margin-bottom:26px; }
  .hero-cta{ gap:12px; }
  .marquee-sec{ padding:72px 0; }
  /* linhas de serviço mais compactas e com toque confortável */
  .svc-row{ grid-template-columns:34px 1fr auto; gap:14px; padding:20px 14px; }
  .svc-info span{ margin-top:6px; font-size:0.86rem; }
  .sec-lead{ margin-bottom:36px; }
  .map-wrap{ padding-top:44px; }
  #opsMap{ height:clamp(340px,52vh,460px); }
}
@media (max-width: 560px){
  .grid-4{ grid-template-columns:1fr; }
  .foot-grid{ grid-template-columns:1fr; }
  .nav{ height:80px; padding:0 16px; }
  .store-btn span{ display:none; }
  .store-btn{ height:56px; padding:0 16px; }
  .menu-btn{ width:56px; height:56px; gap:6px; }
  .menu-btn i{ width:26px; }
  .nav-right{ gap:10px; }
  .brand-lockup{ font-size:1rem; }
  .brand-lockup img{ height:22px; }
  .hero-since{ left:16px; } /* acompanha o padding menor do nav no celular */
}