:root{
  --bg:#ffffff;
  --surface:#ffffff;
  --surface-2:#f7f7f8;
  --stroke:#e7e7ea;
  --primary:#C79B2A;
  --primary-700:#A8841F;
  --primary-grad-1:#F0D783;
  --primary-grad-2:#D9AF3B;
  --text:#1a1a1a;
  --muted:#252b33;
  --shadow:0 10px 30px rgba(0,0,0,.08);
  --radius:14px;
  --container:1180px;
  --logo-h:48px;
  --logo-w:140px;
  --logo-gap:56px;
  --marquee-dur:28s;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;
  color:var(--text);
  background:linear-gradient(180deg,#ffffff,#fafafa 60%,#ffffff 100%);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,h5{margin:0 0 .5rem}
p{margin:.5rem 0 0}
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 20px}
.site-header{position:sticky;top:0;z-index:50;backdrop-filter:saturate(1.1) blur(10px);background:rgba(255,255,255,.78);border-bottom:1px solid var(--stroke)}
.header__wrap{display:flex;align-items:center;justify-content:space-between;height:88px}
.brand{display:flex;align-items:center;gap:.6rem}
/* LOGO MAIOR NA NAV (sem aumentar o header) */
.brand__logo{
  height:clamp(56px, 7.8vw, 72px);
  max-height:72px;
  width:auto;
  display:block;
}
.nav__list{display:flex;gap:18px;align-items:center;list-style:none}
.nav__link{opacity:.85;position:relative;transition:color .2s,opacity .2s}
.nav__link:hover,.nav__link:focus{color:var(--primary);opacity:1}
.nav__link::after{content:"";position:absolute;left:0;bottom:-6px;height:2px;width:0;background:var(--primary);transition:width .2s}
.nav__link:hover::after,.nav__link:focus::after{width:100%}
#checkbox{display:none}
.toggle{position:relative;width:40px;height:calc(4px*3 + 11px*2);cursor:pointer;margin-left:auto;display:none;z-index:61}
.bar{position:absolute;left:0;right:0;height:4px;border-radius:2px;background:var(--primary-700);opacity:1;transition:none .35s cubic-bezier(.5,-0.35,.35,1.5)}
.bar--top{bottom:calc(50% + 11px + 2px);transition-property:bottom,transform;transition-delay:.35s,0s}
.bar--middle{top:calc(50% - 2px);transition-property:opacity;transition-delay:.35s}
.bar--bottom{top:calc(50% + 11px + 2px);transition-property:top,transform;transition-delay:.35s,0s}
#checkbox:checked + .toggle .bar--top{bottom:calc(50% - 2px);transform:rotate(135deg);transition-delay:0s,.35s}
#checkbox:checked + .toggle .bar--middle{opacity:0;transition-duration:0s;transition-delay:.35s}
#checkbox:checked + .toggle .bar--bottom{top:calc(50% - 2px);transform:rotate(225deg);transition-delay:0s,.35s}
@media (max-width:720px){
  .toggle{display:block}
  .nav__list{position:fixed;inset:50px 0 auto 0;background:rgba(255,255,255,.98);backdrop-filter:blur(8px);border-bottom:1px solid var(--stroke);transform:translateY(-120%);transition:transform .25s ease;display:grid;gap:12px;padding:14px 20px;z-index:60}
  #checkbox:checked ~ .nav__list{transform:none}
}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:0;border-radius:999px;padding:.9rem 1.2rem;font-weight:600;background:#f1f2f4;color:var(--text);transition:transform .2s,box-shadow .2s,background .2s,color .2s;box-shadow:0 0 0 rgba(0,0,0,0)}
.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow)}
.btn--primary{background:var(--primary);color:#fff}
.btn--primary:hover{background:var(--primary-700)}
.hero .btn--ghost{
  background: rgba(255,255,255,.88);
  color:#1a1a1a;
  border-color: transparent;
  box-shadow: 0 10px 26px rgba(0,0,0,.15);
  backdrop-filter: saturate(1.1) blur(2px);
}
.hero .btn--ghost:hover{
  background:#fff;
  box-shadow: 0 16px 34px rgba(0,0,0,.22);
  transform: translateY(-1px);
}.btn--outline{background:transparent;border:1px solid var(--primary);color:var(--primary)}
.btn--sm{padding:.55rem .9rem}
.btn--full{width:100%}
.hero{position:relative;padding:120px 0 84px;border-bottom:1px solid var(--stroke);overflow:hidden;min-height:calc(100vh - 88px);display:flex;align-items:center}
.hero__grid{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;z-index:1}
.hero .h1{font-size:48px;line-height:1.1}
.lead{font-size:18px;color:var(--muted);margin:14px 0 20px}
.tag{background:linear-gradient(135deg,var(--primary-grad-1),var(--primary-grad-2));-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800}
.cta__row{display:flex;gap:12px;flex-wrap:wrap}
.media-cover{width:100%;height:auto;border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--stroke)}
.hero--video .hero__bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero__video{width:100%;height:100%;object-fit:cover;object-position:center 50%}
.hero__overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,.25))}
@media (max-width:992px){.hero{padding:96px 0 64px;min-height:calc(92vh - 80px)}.hero__grid{grid-template-columns:1fr}}
@media (max-width:720px){.hero{padding:84px 0 48px;min-height:calc(88vh - 72px)}.hero .h1{font-size:38px}}
.section{padding:80px 0}
.section--alt{padding:80px 0;background:linear-gradient(180deg,#fafafa,#ffffff)}
.section__head{margin:0 0 24px}
.h2{font-size:32px}
.h4{font-size:20px}
.h5{font-size:18px}
.muted{color:var(--muted)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card,.case{background:#ffffff;border:1px solid var(--stroke);border-radius:var(--radius);padding:18px;transition:.2s}
.card:hover,.case:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#dcdce0}
.card__icon{font-size:24px;opacity:.95;margin-bottom:8px;color:#2a2a2a}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.step{background:#ffffff;border:1px dashed #e1e1e6;border-radius:var(--radius);padding:18px}
.step__num{width:32px;height:32px;border-radius:999px;display:inline-grid;place-items:center;background:var(--primary);color:#fff;font-weight:700;margin-bottom:10px}

/* ===== LOGOS — quadradas 500x500 sem corte ===== */
:root{
  --logo-size: clamp(64px, 7vw, 88px);
  --logo-gap: 56px;
  --marquee-dur: 28s;
  --marquee-gutter: 110px;
}
.logos-marquee{
  padding:56px 0;
  border-top:1px solid var(--stroke);
  border-bottom:1px solid var(--stroke);
  background:#fff;
}
.marquee{
  overflow:hidden;
  width:100%;
  padding-block: 10px;
  -webkit-mask-image: linear-gradient(90deg,
    transparent 0,
    #000 var(--marquee-gutter),
    #000 calc(100% - var(--marquee-gutter)),
    transparent 100%);
          mask-image: linear-gradient(90deg,
    transparent 0,
    #000 var(--marquee-gutter),
    #000 calc(100% - var(--marquee-gutter)),
    transparent 100%);
}
/* TRACK em loop no desktop */
.marquee__track{
  display:flex;
  width:max-content;
  will-change:transform;
  animation:logos-loop var(--marquee-dur) linear infinite;
  animation-play-state: paused;
  align-items:center;
  transform:translate3d(0,0,0);
}
.marquee:hover .marquee__track{ animation-play-state: paused; }
.marquee__group{
  display:flex; align-items:center; gap:var(--logo-gap);
  padding-inline: var(--marquee-gutter);
}
.marquee__group::before,
.marquee__group::after{
  content:""; flex:0 0 var(--marquee-gutter);
}
.marquee__logo{
  width:var(--logo-size);
  height:var(--logo-size);
  flex:0 0 auto;
  display:grid; place-items:center;
}
.marquee__logo img{
  width:100%; height:100%;
  object-fit:contain;
}
@media (max-width:720px){
  :root{
    --logo-size: 60px;
    --logo-gap: 40px;
    --marquee-gutter: 70px;
  }
}
/* LOOP */
@keyframes logos-loop{
  from{ transform:translate3d(0,0,0) }
  to  { transform:translate3d(-50%,0,0) }
}

.case__logo{height:34px;background:#fff;border:1px solid var(--stroke);border-radius:8px;margin-bottom:10px;display:grid;place-items:center}
.case__metric{font-weight:700;color:var(--primary)}

.parallax{position:relative;min-height:56vh;display:grid;place-items:center;border-top:1px solid var(--stroke);border-bottom:1px solid var(--stroke);isolation:isolate}
.parallax__overlay{position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.75)),radial-gradient(60% 50% at 50% 40%,rgba(199,155,42,.12),transparent 60%);pointer-events:none}
.parallax__content{position:relative;z-index:1;text-align:center}
.parallax .h2{color:#1a1a1a;text-shadow:0 2px 10px rgba(0,0,0,.06)}
.parallax .muted{color:#2f3135}
@media (min-width:992px){.parallax{background-attachment:fixed}}
@media (max-width:991px){.parallax{background-attachment:scroll!important;min-height:44vh}}

.faq{background:#ffffff;border:1px solid var(--stroke);border-radius:var(--radius);padding:14px 16px;margin:10px 0;transition:background .2s}
.faq[open]{background:#fcfcfd}
.cta__grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start}
.form{background:#ffffff;border:1px solid var(--stroke);border-radius:var(--radius);padding:18px}
.form__row{display:flex;flex-direction:column;margin-bottom:12px}
label{font-size:14px;color:#4a4d52;margin-bottom:6px}
input,select,textarea{background:#ffffff;border:1px solid #dfe1e5;color:#1a1a1a;border-radius:10px;padding:12px;outline:0;transition:border-color .2s,box-shadow .2s}
input:focus,select:focus,textarea:focus{border-color:#c7cad0;box-shadow:0 0 0 3px rgba(199,155,42,.15)}
.check{display:flex;gap:10px;align-items:flex-start;margin:10px 0 14px}
.form__ok{margin:10px 0 0;color:#2a7a2e}

.footer{border-top:1px solid var(--stroke);background:#ffffff;padding:36px 0}
.footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:22px;align-items:flex-start}
.footer__list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.footer__copy{border-top:1px solid var(--stroke);margin:24px 0 0;padding-top:16px;color:var(--muted);text-align:center}
.brand--invert .brand__logo{filter:none}

@media (max-width:992px){
  .footer__grid{grid-template-columns:1fr 1fr;gap:18px}
  .footer__grid>:first-child{grid-column:1/-1}
  .grid-3{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .footer__grid{grid-template-columns:1fr;gap:14px;text-align:center}
  .footer__grid .brand{justify-content:center}
  .footer__list{justify-items:center}
  .grid-3{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
}

.wa-float{position:fixed;right:16px;bottom:18px;z-index:60;width:56px;height:56px;border-radius:999px;display:grid;place-items:center;background:#25D366;color:#fff;font-size:24px;box-shadow:0 10px 30px rgba(0,0,0,.18);transition:transform .2s,box-shadow .2s,filter .2s}
.wa-float:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 16px 36px rgba(0,0,0,.22);filter:saturate(1.05)}

[data-reveal]{opacity:0;transform:translateY(14px);transition:opacity .5s,transform .5s}
[data-reveal].is-visible{opacity:1;transform:none}

/* ===== LOGOS — AUTOPLAY EM TODAS AS TELAS ===== */
:root{
  --logo-size: clamp(64px, 7vw, 88px);
  --logo-gap: 56px;
  --marquee-dur: 28s;
  --marquee-gutter: 110px;
}

.logos-marquee{
  padding:56px 0;
  border-top:1px solid var(--stroke);
  border-bottom:1px solid var(--stroke);
  background:#fff;
}

.marquee{
  overflow:hidden;
  width:100%;
  padding-block:10px;
  /* fade para bordas elegantes */
  -webkit-mask-image: linear-gradient(90deg,
    transparent 0,
    #000 var(--marquee-gutter),
    #000 calc(100% - var(--marquee-gutter)),
    transparent 100%);
          mask-image: linear-gradient(90deg,
    transparent 0,
    #000 var(--marquee-gutter),
    #000 calc(100% - var(--marquee-gutter)),
    transparent 100%);
}

/* faixa sempre animando */
.marquee__track{
  display:flex;
  width:max-content;
  will-change:transform;
  animation:logos-loop var(--marquee-dur) linear infinite;
  animation-play-state: running;   /* <- força autoplay */
  align-items:center;
  transform:translate3d(0,0,0);
}

/* pausa no hover (desktop) */
@media (hover:hover){
  .marquee:hover .marquee__track{ animation-play-state: paused; }
}

.marquee__group{
  display:flex; align-items:center; gap:var(--logo-gap);
  padding-inline: var(--marquee-gutter);
}
.marquee__group::before,
.marquee__group::after{
  content:""; flex:0 0 var(--marquee-gutter);
}

.marquee__logo{
  width:var(--logo-size);
  height:var(--logo-size);
  flex:0 0 auto;
  display:grid; place-items:center;
}
.marquee__logo img{
  width:100%; height:100%;
  object-fit:contain;
}

/* Mobile: só ajusta tamanhos/gutter, mantém autoplay */
@media (max-width:720px){
  :root{
    --logo-size:60px;
    --logo-gap:40px;
    --marquee-gutter:70px;
  }
}

/* loop contínuo */
@keyframes logos-loop{
  from{ transform:translate3d(0,0,0) }
  to  { transform:translate3d(-50%,0,0) }
}


/* MAPA */
.map-embed{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  border:1px solid var(--stroke);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
  background:#e9ecef;
}
.map-embed iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  filter:saturate(1) contrast(1.03);
}
@media (max-width:720px){
  .map-embed{ aspect-ratio: 4/3; }
}

.case{ position: relative; padding-top: 18px; }

/* === CASES — Logo redonda centralizada e maior === */
.case__logo{
  width:110px;
  height:110px;
  border-radius:999px;
  overflow:hidden;
  background:#fff;
  border:1px solid var(--stroke);
  box-shadow:var(--shadow);
  display:grid;
  place-items:center;
  margin:-4px auto 16px;
}
.case__logo img{
  width:70%;
  height:70%;
  object-fit:contain;
  transform:scale(1.18);
  transform-origin:center;
}
#ctaWhatsBottom{ margin-top:1vh; }

/* responsivo */
@media (max-width:992px){
  .case__logo{ width:120px; height:120px; }
}
@media (max-width:720px){
  .case__logo{ width:100px; height:100px; }
}

/* ===== CONTATO — responsivo e sem corte no mobile ===== */
@media (max-width:992px){
  .cta__grid{ grid-template-columns:1fr; gap:18px; align-items:stretch; }
  .form{ padding:14px; }
  .container{ padding:0 16px; }
}
@media (max-width:720px){
  .section{ padding:56px 0; }
  #contato .cta__text{ order:2; }
  #contato .form{ order:1; margin-bottom:64px; border-radius:12px; }
  .h2{ font-size:26px; }
  label{ font-size:13px; }
  .form .form__row{ margin-bottom:10px; }
  input,select,textarea{ padding:12px; border-radius:10px; }
  .btn{ padding:.8rem 1rem; }
  .btn--full{ width:100%; }
  .wa-float{ right:12px; bottom:12px; }
}
@media (max-width:360px){
  .h2{ font-size:24px; }
  .form{ padding:12px; }
}
@media (max-width:720px){
  #contato .cta__text{ order:1; }
  #contato .form{ order:2; }
}

/* GRID dos cases no desktop / carrossel no mobile */
#cases .cases-track{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
}
#cases .case{
  box-sizing:border-box;
  background:#fff;
  border:1px solid var(--stroke);
  border-radius:var(--radius);
  padding:18px;
}
@media (max-width:720px){
  #cases .cases-track{
    display:flex;
    overflow-x:auto;
    gap:12px;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    padding-bottom:8px;
  }
  #cases .cases-track::-webkit-scrollbar{ display:none; }
  #cases .case{
    flex:0 0 100%;
    scroll-snap-align:start;
    margin:0;
  }
  #cases .cases-dots{
    display:flex;
    justify-content:center;
    gap:8px;
    margin-top:10px;
  }
  #cases .cases-dots .dot{
    width:8px; height:8px; border-radius:999px;
    background:#d7d7db; border:0; padding:0; cursor:pointer;
    transition:width .2s, background .2s;
  }
  #cases .cases-dots .dot.is-active{
    background:var(--primary);
    width:22px;
  }
}

.backlink{ display:inline-flex;align-items:center;gap:.4rem; font-weight:600; opacity:.8 }
.backlink:hover{opacity:1; color:var(--primary)}


body.legal-page{
  background: linear-gradient(180deg,#fafafa,#ffffff 60%,#fafafa 100%);
}
.legal__topbar{
  position: sticky; top: 0; z-index: 30;
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(8px) saturate(1.05);
  border-bottom: 1px solid var(--stroke);
}
.legal{
  max-width: 880px;
  margin: 28px auto 96px;
  background: #fff;
  border: 1px solid var(--stroke);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 28px 26px;
  line-height: 1.65;
}
.legal h1, .legal .h2{ font-size: 34px; line-height:1.15; margin: 6px 0 12px; }
.legal h2, .legal .h4{ font-size: 22px; margin: 24px 0 8px; }
.legal .updated{ color: var(--muted); font-size: 14px; margin: 0 0 16px; }
.legal ul{ padding-left: 20px; margin: 8px 0 16px; }
.legal li{ margin: 6px 0; }
.backlink{ display:inline-flex; align-items:center; gap:.4rem; font-weight:600; opacity:.85; padding:10px 0; }
.backlink:hover{ opacity:1; color:var(--primary); }
@media (max-width:720px){
  .legal{ margin:16px auto 56px; padding:18px; border-radius:12px; }
  .legal h1, .legal .h2{ font-size:26px; }
  .legal h2, .legal .h4{ font-size:20px; }
}

/* PARALLAX com imagem (caminho absoluto para evitar cache/relativo) */
.parallax{
  position: relative;
  min-height: 56vh;
  display: grid;
  place-items: center;
  background: #0f0f0f url('/assets/img/fundoImg.jpg') center/cover no-repeat;
  border-top: 1px solid var(--stroke);
  border-bottom: 1px solid var(--stroke);
  isolation: isolate;
}
.parallax__overlay{
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.65)),
    radial-gradient(60% 50% at 50% 40%, rgba(240,184,74,.10), transparent 60%);
  pointer-events: none;
}
.parallax__content{ position: relative; z-index: 1; text-align: center; }
.parallax .h2{ color: #fff; text-shadow: 0 2px 10px rgba(0,0,0,.45); }
.parallax .muted{ color: rgba(255,255,255,.85); }
@media (min-width: 992px){ .parallax{ background-attachment: fixed; } }
@media (max-width: 991px){ .parallax{ background-attachment: scroll !important; min-height:44vh; } }

.site-header .brand__logo{
  height: clamp(78px, 8.8vw, 86px); 
  max-height: 86px;                 
}

#logos{
  --logo-size: clamp(90px, 6vw, 80px); 
  --logo-gap: 56px;                   
  --marquee-gutter: 18px;            
}

@media (max-width:1200px){
  #logos{ --logo-gap: 22px; --marquee-gutter: 14px; }
}
@media (max-width:720px){
  #logos{ --logo-gap: 16px; --marquee-gutter: 10px; }
}

.alltech-developed{
  width: 100%;
  text-align: center;
  font-size: 14px;
  color: #444; 
  margin-top: 35px;
  padding: 20px 0;
  border-top: 1px solid #e7e7e7;
  font-family: 'Inter', sans-serif;
  letter-spacing: 0.2px;
  opacity: .95;
}

.alltech-developed a{
  color: #C79B2A; 
  text-decoration: none;
  font-weight: 600;
}

.alltech-developed a:hover{
  opacity: .75;
}
