/*
Theme Name: Multfluxo
Theme URI: https://multfluxo.com.br
Author: Multfluxo
Description: Tema oficial Multfluxo — visual Figma, responsivo, com WooCommerce em modo orçamento e integração ERP por SKU. Animações Lenis + GSAP.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
Text Domain: multfluxo
*/

/* ---------- TOKENS DE DESIGN (Figma) ---------- */
:root{
  --laranja:#F37920;
  --laranja-esc:#d8641a;
  --ink:#231F20;
  --off:#ECEBE8;
  --cinza:#4A4948;
  --cinza-2:#717171;
  --branco:#ffffff;
  --linha:rgba(35,31,32,.12);
  --radius:18px;
  --radius-lg:28px;
  --sombra:0 18px 50px rgba(35,31,32,.10);
  --container:1280px;
  --header-h:88px;
  --font:'Jost',-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  --ff-alt:'Inter',var(--font);
}

/* ---------- RESET ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--off);
  font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;max-width:100%}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:0;background:none}
h1,h2,h3,h4,p{margin:0}
ul{margin:0;padding:0;list-style:none}

/* ---------- LAYOUT BASE ---------- */
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 clamp(20px,5vw,64px)}
.section{padding:clamp(56px,8vw,120px) 0}
.eyebrow{font-size:14px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--laranja)}
.h1{font-weight:600;line-height:1.02;font-size:clamp(44px,7vw,104px);letter-spacing:-.02em}
.h2{font-weight:600;line-height:1.05;font-size:clamp(30px,4.5vw,58px);letter-spacing:-.015em}
.h3{font-weight:600;font-size:clamp(21px,2.4vw,30px);letter-spacing:-.01em}
.lead{font-size:clamp(16px,1.4vw,20px);color:var(--cinza);max-width:56ch}
.muted{color:var(--cinza-2)}

/* botões */
.btn{display:inline-flex;align-items:center;gap:.55em;padding:16px 30px;border-radius:999px;
  font-weight:600;font-size:16px;line-height:1;transition:transform .25s ease,background .25s ease,color .25s ease;white-space:nowrap}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--laranja);color:#fff}
.btn-primary:hover{background:var(--laranja-esc)}
.btn-dark{background:var(--ink);color:#fff}
.btn-ghost{border:1.5px solid var(--ink);color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:#fff}
.btn svg{width:18px;height:18px}

/* animação de entrada (GSAP faz o resto; fallback visível) */
.reveal{opacity:1}
.no-js .reveal,.js .reveal{opacity:1}