/* Mênfis Marketing — sistema base. Identidade: cinza #5d5d5d + laranja #fb5f1a. Conceito: a forja (ferro + brasa). */
:root{
  --ink:#0f0f11; --ink-2:#17171a; --ink-3:#212125;
  --steel:#5d5d5d; --steel-2:#8b8b90; --steel-3:#c9c9cc;
  --ember:#fb5f1a; --ember-hot:#ff9340; --ember-deep:#c9400a;
  --bone:#f3efe8; --bone-2:#e8e2d8; --white:#fff;

  /* tema atual (cada página sobrescreve) */
  --bg:var(--ink); --fg:#f4f1ec; --muted:#9a9a9f; --line:rgba(255,255,255,.12);
  --accent:var(--ember); --accent-2:var(--ember-hot); --accent-ink:#0f0f11;
  --card:var(--ink-2);

  --f-display:'Space Grotesk',system-ui,sans-serif;
  --f-text:'Space Grotesk',system-ui,sans-serif;
  --f-mono:'Space Grotesk',system-ui,sans-serif;
  --f-code:'JetBrains Mono',ui-monospace,monospace;
  --pad:clamp(20px,4vw,64px);
  --max:1480px;
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{background:var(--bg);color:var(--fg);font-family:var(--f-text);font-size:clamp(16px,1.05vw,18px);line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,video,canvas,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--accent);color:var(--accent-ink)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* tipografia */
.display{font-family:var(--f-display);font-weight:700;letter-spacing:-.03em;word-spacing:.07em;line-height:.96;}
.h1{font-size:clamp(46px,9.2vw,160px)}
.h2{font-size:clamp(36px,6vw,104px)}
.h3{font-size:clamp(26px,3.2vw,52px);line-height:1.02}
.h4{font-size:clamp(20px,1.7vw,28px);line-height:1.1;letter-spacing:-.02em}
.mono{font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.lead{font-size:clamp(18px,1.6vw,26px);line-height:1.4;color:var(--muted);max-width:46ch}
.accent{color:var(--accent)}
.thin{font-weight:300}
.out{-webkit-text-stroke:1.5px currentColor;color:transparent}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--accent);border-radius:2px}

.wrap{width:100%;max-width:var(--max);margin:0 auto;padding-inline:var(--pad)}
section{position:relative}
.sec{padding-block:clamp(80px,12vw,200px)}
.sec-tight{padding-block:clamp(56px,7vw,120px)}
.light{--bg:var(--bone);--fg:#17171a;--muted:#5c5a56;--line:rgba(0,0,0,.14);--card:#fff;background:var(--bg);color:var(--fg)}
.dark{--bg:var(--ink);--fg:#f4f1ec;--muted:#9a9a9f;--line:rgba(255,255,255,.12);--card:var(--ink-2);background:var(--bg);color:var(--fg)}
.ember{--bg:var(--ember);--fg:#0f0f11;--muted:rgba(15,15,17,.7);--line:rgba(0,0,0,.2);--accent:#0f0f11;--accent-ink:var(--ember);background:var(--bg);color:var(--fg)}

/* botões */
.btn{--h:56px;display:inline-flex;align-items:center;gap:14px;height:var(--h);padding:0 8px 0 26px;border-radius:99px;background:var(--accent);color:var(--accent-ink);font-weight:600;font-size:16px;position:relative;overflow:hidden;transition:transform .5s var(--ease)}
.btn .ic{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--accent-ink);color:var(--accent);transition:transform .5s var(--ease)}
.btn:hover .ic{transform:rotate(-45deg)}
.btn.ghost{background:transparent;color:var(--fg);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn.ghost .ic{background:var(--fg);color:var(--bg)}
.btn::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.25);transform:translateX(-101%) skewX(-20deg);transition:transform .7s var(--ease)}
.btn:hover::after{transform:translateX(101%) skewX(-20deg)}
.tlink{position:relative;display:inline-flex;gap:8px;align-items:center;font-weight:600}
.tlink::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;background:currentColor;transform-origin:right;transition:transform .5s var(--ease)}
.tlink:hover::after{transform:scaleX(0);transform-origin:left}

/* NAV */
.nav{position:fixed;inset:16px var(--pad) auto var(--pad);z-index:80;display:flex;justify-content:space-between;align-items:center;pointer-events:none}
.nav>*{pointer-events:auto}
.nav .brand{display:flex;align-items:center;height:56px;padding:0 22px;border-radius:99px;background:rgba(15,15,17,.55);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.nav .brand img{height:28px;width:auto}
.nav-r{display:flex;gap:10px;align-items:center}
.nav .pill{display:flex;align-items:center;height:56px;padding:0 6px;border-radius:99px;background:rgba(15,15,17,.55);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);color:#f4f1ec}
.nav .pill a.l{padding:0 16px;font-size:14px;font-weight:500;opacity:.8;transition:opacity .3s}
.nav .pill a.l:hover,.nav .pill a.l.on{opacity:1}
.nav .pill a.l.on{color:var(--ember)}
.menu-btn{box-shadow:0 0 0 3px rgba(15,15,17,.88);height:44px;padding:0 20px 0 18px;border-radius:99px;background:var(--ember);color:#0f0f11;font-weight:600;font-size:14px;display:flex;align-items:center;gap:10px}
.menu-btn i{display:grid;gap:4px}
.menu-btn i b{display:block;width:18px;height:2px;background:#0f0f11;border-radius:2px;transition:transform .5s var(--ease)}
.menu-open .menu-btn i b:first-child{transform:translateY(3px) rotate(45deg)}
.menu-open .menu-btn i b:last-child{transform:translateY(-3px) rotate(-45deg)}
@media(max-width:980px){.nav .pill a.l{display:none}.nav .pill{padding:0}}

.overlay{position:fixed;inset:0;z-index:70;background:var(--ink);color:#f4f1ec;display:none;overflow:auto;padding:110px var(--pad) 40px}
.overlay.on{display:block}
.overlay .grid{display:grid;grid-template-columns:1.2fr 1fr;gap:6vw;max-width:var(--max);margin:0 auto;min-height:calc(100vh - 150px);align-content:center}
.overlay .big a{display:flex;align-items:baseline;gap:18px;font-family:var(--f-display);font-weight:700;font-size:clamp(38px,6.2vw,104px);line-height:1.02;letter-spacing:-.035em;opacity:.45;transition:opacity .4s,transform .5s var(--ease),color .3s;overflow:hidden}
.overlay .big a sup{font-family:var(--f-mono);font-size:12px;color:var(--ember);letter-spacing:.1em;font-weight:400}
.overlay .big:hover a{opacity:.2}
.overlay .big a:hover{opacity:1;transform:translateX(18px);color:var(--ember)}
.overlay .svc{display:grid;gap:2px;align-content:center}
.overlay .svc h6{font-family:var(--f-mono);font-size:12px;color:var(--steel-2);letter-spacing:.12em;font-weight:400;margin-bottom:14px;text-transform:uppercase}
.overlay .svc a{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:18px;font-weight:500;transition:padding .4s var(--ease),color .3s}
.overlay .svc a:hover{padding-left:14px;color:var(--ember)}
.overlay .svc a span{font-family:var(--f-mono);font-size:11px;color:var(--steel-2)}
.overlay .bgwave{position:absolute;right:-8%;top:-10%;width:60vw;opacity:.07;pointer-events:none}
@media(max-width:900px){.overlay .grid{grid-template-columns:1fr}.overlay .svc{display:none}}

/* cursor */
.cursor{position:fixed;left:0;top:0;z-index:200;pointer-events:none;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--ember);mix-blend-mode:normal;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .3s;display:grid;place-items:center;font-size:11px;font-weight:700;color:#0f0f11;letter-spacing:.04em}
.cursor.big{width:84px;height:84px;margin:-42px 0 0 -42px}
.cursor.lbl{width:92px;height:92px;margin:-46px 0 0 -46px}
@media(hover:none){.cursor{display:none}}
body.has-cursor,body.has-cursor a,body.has-cursor button{cursor:none}
@media(hover:none){body.has-cursor,body.has-cursor a,body.has-cursor button{cursor:auto}}

/* cortina de transição = traços ondulados do ícone */
.curtain{position:fixed;inset:0;z-index:300;pointer-events:none;display:flex}
.curtain i{flex:1;background:var(--ink);transform:scaleY(0);transform-origin:top;border-radius:0 0 60% 60%/0 0 14% 14%}
.curtain i:nth-child(odd){background:#1b1b1f}
.curtain i:nth-child(3){background:var(--ember)}

/* progresso */
.progress{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:left;transform:scaleX(0);background:var(--ember);z-index:90}

/* reveal */
[data-split] .w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .04em .12em;margin:0 -.04em -.12em}
[data-split] .w>span{display:inline-block;transform:translateY(112%)}
.rv{opacity:0;transform:translateY(40px)}
.no-js .rv,.no-js [data-split] .w>span{opacity:1;transform:none}

/* marquee */
.marq{overflow:hidden;white-space:nowrap;user-select:none}
.marq.marq-on{display:flex}
.marq.marq-on .tr{flex:none;animation:marq var(--d,40s) linear infinite}
.marq.marq-on.rev .tr{animation-direction:reverse}
@keyframes marq{to{transform:translateX(-100%)}}
.marq .tr{display:inline-flex;gap:3vw;padding-right:3vw}
.marq .tr span{display:inline-flex;align-items:center;gap:3vw}
.marq .tr span::after{content:"";width:.5em;height:.5em;border-radius:50%;background:var(--accent);display:inline-block}

/* FOOTER */
.foot{background:var(--ink);color:#f4f1ec;padding:clamp(60px,8vw,120px) 0 0;overflow:hidden;position:relative}
.foot .cta{display:grid;gap:30px;margin-bottom:clamp(60px,9vw,140px)}
.foot .cta a.mail{font-family:var(--f-display);font-weight:700;letter-spacing:-.04em;font-size:clamp(34px,8vw,140px);line-height:.95;display:inline-block;transition:color .3s}
.foot .cta a.mail:hover{color:var(--ember)}
.foot .cols{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:40px;padding-block:44px;border-top:1px solid var(--line)}
.foot .cols h6{font-family:var(--f-mono);font-size:11px;font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:var(--steel-2);margin-bottom:16px}
.foot .cols a{display:block;padding:5px 0;opacity:.85}
.foot .cols a:hover{color:var(--ember);opacity:1}
.foot .brandline img{height:44px;width:auto;margin-bottom:18px}
.foot .brandline p{color:var(--steel-2);max-width:32ch;font-size:15px}
.foot .giant{font-family:var(--f-display);font-weight:700;letter-spacing:-.045em;font-size:23vw;line-height:.8;color:#1a1a1d;text-align:center;white-space:nowrap;margin-top:20px;user-select:none;transform:translateY(8%)}
.foot .legal{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:22px 0 26px;color:var(--steel-2);font-size:13px;border-top:1px solid var(--line)}
@media(max-width:800px){.foot .cols{grid-template-columns:1fr 1fr}.foot .brandline{grid-column:1/-1}}

/* WhatsApp flutuante */
.wa{position:fixed;right:20px;bottom:20px;z-index:75;width:60px;height:60px;border-radius:50%;background:var(--ember);color:#0f0f11;display:grid;place-items:center;box-shadow:0 12px 40px -10px rgba(251,95,26,.7);transition:transform .4s var(--ease)}
.wa:hover{transform:scale(1.1) rotate(-8deg)}
.wa svg{width:28px;height:28px}

/* cartões e chips */
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:99px;box-shadow:inset 0 0 0 1px var(--line);font-size:14px;font-weight:500;transition:background .3s,color .3s}
.chip.on,.chip:hover{background:var(--accent);color:var(--accent-ink);box-shadow:none}
.tag-ilus{display:inline-block;font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;border-radius:4px;border:1px dashed var(--line);color:var(--muted)}

/* hero de serviço (comum) */
.shero{min-height:100vh;min-height:100svh;display:grid;align-items:end;padding:140px 0 clamp(36px,5vw,70px);overflow:hidden;isolation:isolate}
.shero canvas.bg{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.shero .crumbs{display:flex;gap:10px;align-items:center;margin-bottom:26px;font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.shero .crumbs a:hover{color:var(--accent)}
.shero .row{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:end;margin-top:34px}
.shero .meta{display:grid;gap:8px;font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:right}
@media(max-width:800px){.shero .row{grid-template-columns:1fr}.shero .meta{text-align:left}}

/* navegação entre serviços */
.next{display:block;padding:clamp(70px,10vw,160px) 0;text-align:center;position:relative;overflow:hidden}
.next .display{transition:transform .8s var(--ease),color .3s}
.next:hover .display{transform:scale(1.04);color:var(--accent)}

:focus-visible{outline:2px solid var(--ember);outline-offset:3px}
.rm *,.rm *::before,.rm *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
.rmbtn{color:inherit;text-decoration:underline;text-underline-offset:3px;opacity:.8}.rmbtn:hover{opacity:1}

/* card de artigo (usado na home e no blog) */
.pcard{display:flex;flex-direction:column;border-radius:26px;overflow:hidden;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);transition:transform .6s var(--ease)}
.pcard:hover{transform:translateY(-10px)}
.pc-art{position:relative;aspect-ratio:16/10;display:grid;place-items:center;overflow:hidden;background:hsl(var(--h) 80% 52%);color:#0f0f11}
.pc-art::before{content:"";position:absolute;inset:-20%;background:repeating-linear-gradient(115deg,transparent 0 22px,rgba(0,0,0,.14) 22px 44px);transition:transform 1.2s var(--ease)}
.pcard:hover .pc-art::before{transform:translateX(60px)}
.pc-art .mono{position:absolute;left:18px;top:16px;z-index:1}
.pc-art b{position:relative;font-size:clamp(54px,7vw,110px);letter-spacing:-.05em;color:#fff;mix-blend-mode:normal}
.pc-b{display:grid;gap:8px;padding:22px 24px 26px}
.pc-b .mono{color:var(--muted)}
.pc-b p{color:var(--muted);font-size:15px}
