/* =========================================================
   MARIA TESSARO — PORTFÓLIO
   Visual: cinematográfico, escuro, cinético
   ========================================================= */

:root{
  --bg:        #0a0a0b;
  --bg-2:      #101012;
  --surface:   #16161a;
  --line:      rgba(255,255,255,.09);
  --ink:       #f4f2ee;
  --ink-dim:   #a3a09a;
  --ink-faint: #565550;
  --accent:    #ff4d17;   /* laranja cinema */
  --accent-2:  #ffb34d;   /* âmbar */
  --radius:    18px;
  --ease:      cubic-bezier(.22,1,.36,1);
  --font-disp: 'Oswald', sans-serif;
  --font-head: 'Archivo', sans-serif;
  --font-body: 'Space Grotesk', sans-serif;
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  /* grade fina de linhas (ref Tabish) sob as áreas escuras */
  background:
    linear-gradient(rgba(244,242,238,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(244,242,238,.035) 1px, transparent 1px),
    var(--bg);
  background-size:44px 44px, 44px 44px, auto;
  color:var(--ink);
  font-family:var(--font-body);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  cursor:none;
}
::selection{ background:var(--accent); color:#fff; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:none; background:none; border:none; color:inherit; }
em{ font-style:normal; color:var(--accent); }
img{ max-width:100%; display:block; }

/* Oswald: peso médio em tudo que é display (Anton era grossa demais) */
.hero__title,.page-title,.about__name,.section-title,.contact__title,
.stat__num,.preloader__counter,.tl__year,
.scard__idx,.vcard__idx,.scard__ph{ font-weight:500; }

/* ---------- GRAIN ---------- */
.grain{
  position:fixed; inset:-50%; z-index:9998; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 6s steps(8) infinite;
}
@keyframes grain{
  0%{transform:translate(0,0)} 10%{transform:translate(-4%,-4%)}
  30%{transform:translate(3%,-6%)} 50%{transform:translate(-5%,3%)}
  70%{transform:translate(4%,5%)} 90%{transform:translate(-3%,2%)}
  100%{transform:translate(0,0)}
}

/* ---------- CUSTOM CURSOR ---------- */
.cursor{ display:none; }
.cursor-dot{
  position:fixed; top:0; left:0; width:11px; height:11px; background:var(--accent); border-radius:50%;
  z-index:10000; pointer-events:none; transform:translate(-50%,-50%);
  box-shadow:0 0 14px rgba(255,77,23,.7); transition:transform .15s var(--ease), width .25s, height .25s;
}
.cursor-dot.is-hover{ width:20px; height:20px; }
body.no-cursor{ cursor:auto; }
@media (hover:none){ .cursor,.cursor-dot{ display:none; } body{ cursor:auto; } button,a{ cursor:pointer; } }

/* ---------- PRELOADER ---------- */
.preloader{
  position:fixed; inset:0; z-index:10001; background:var(--bg);
  display:flex; align-items:center; justify-content:center;
  transition:opacity .6s var(--ease), visibility .6s;
}
.preloader.is-done{ opacity:0; visibility:hidden; }
.preloader__inner{ text-align:center; }
.preloader__counter{ font-family:var(--font-disp); font-size:clamp(4rem,14vw,10rem); line-height:1; color:var(--ink); }
.preloader__label{ font-size:.72rem; letter-spacing:.4em; color:var(--ink-faint); margin:1rem 0; }
.preloader__bar{ width:240px; max-width:60vw; height:2px; background:var(--line); margin:0 auto; overflow:hidden; }
.preloader__bar span{ display:block; height:100%; width:0; background:var(--accent); }

/* ---------- SCROLL PROGRESS ---------- */
.scroll-progress{
  position:fixed; top:0; left:0; height:2px; width:0; background:var(--accent);
  z-index:9997; box-shadow:0 0 12px var(--accent);
}

/* ---------- NAV ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:9000;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.5rem clamp(1.2rem,4vw,3rem);
  mix-blend-mode:normal;
  transition:padding .4s var(--ease), background .4s;
}
.nav.is-scrolled{
  padding:.9rem clamp(1.2rem,4vw,3rem);
  background:rgba(10,10,11,.65); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav__brand{
  font-family:var(--font-head); font-weight:800; font-size:1.05rem; letter-spacing:.02em;
  display:flex; align-items:center; gap:.6rem;
}
.nav__brand span{ color:var(--ink-dim); font-weight:400; }
.nav__dot{ width:9px; height:9px; border-radius:50%; background:var(--accent); box-shadow:0 0 12px var(--accent); }
.nav__tabs{ display:flex; gap:.4rem; background:rgba(255,255,255,.03); border:1px solid var(--line); padding:.35rem; border-radius:100px; }
.nav__tab{
  position:relative; font-size:.85rem; font-weight:500; padding:.55rem 1.1rem; border-radius:100px;
  color:var(--ink-dim); transition:color .35s;
}
.nav__tab::before{
  content:''; position:absolute; inset:0; border-radius:100px; background:var(--accent);
  transform:scale(.6); opacity:0; transition:transform .4s var(--ease), opacity .35s; z-index:-1;
}
.nav__tab.is-active{ color:#fff; }
.nav__tab.is-active::before{ transform:scale(1); opacity:1; }
.nav__tab:not(.is-active):hover{ color:var(--ink); }
.nav__cta{
  display:inline-flex; align-items:center; gap:.5rem; font-weight:600; font-size:.85rem;
  border:1px solid var(--line); padding:.6rem 1.1rem; border-radius:100px; transition:.35s var(--ease);
}
.nav__cta:hover{ background:var(--ink); color:var(--bg); border-color:var(--ink); }
.nav__cta svg{ transition:transform .35s var(--ease); }
.nav__cta:hover svg{ transform:translate(2px,-2px); }
.nav__burger{ display:none; flex-direction:column; gap:6px; width:34px; }
.nav__burger span{ height:2px; background:var(--ink); border-radius:2px; transition:.3s; }

/* ---------- TABS SYSTEM ---------- */
.tab{ display:none; position:relative; }
.tab.is-active{ display:block; animation:tabIn .7s var(--ease); }
@keyframes tabIn{ from{ opacity:0; transform:translateY(24px); } to{ opacity:1; transform:none; } }

/* ---------- HERO ---------- */
.hero{ position:relative; min-height:100vh; padding:clamp(7rem,14vh,11rem) clamp(1.2rem,4vw,3rem) 3rem; overflow:hidden; display:flex; flex-direction:column; justify-content:center; background:var(--bg); /* bloqueia a grade na 1ª dobra */ }
.hero__bg{ position:absolute; inset:0; z-index:0; }
/* luz de set: blobs desfocados em camadas */
.blob{ position:absolute; border-radius:50%; filter:blur(62px); mix-blend-mode:screen; will-change:transform; }
.blob--1{ width:48vw; height:48vw; right:-10vw; top:-8vw; background:radial-gradient(circle at 35% 35%, rgba(255,77,23,.5), transparent 68%); animation:drift1 16s ease-in-out infinite; }
.blob--2{ width:40vw; height:40vw; left:-12vw; bottom:-14vw; background:radial-gradient(circle at 60% 40%, rgba(158,32,8,.55), transparent 70%); animation:drift2 21s ease-in-out infinite; }
.blob--3{ width:26vw; height:26vw; left:28vw; top:6vw; background:radial-gradient(circle, rgba(255,179,77,.30), transparent 70%); animation:drift3 13s ease-in-out infinite; }
.blob--4{ width:32vw; height:32vw; right:18vw; bottom:-10vw; background:radial-gradient(circle, rgba(34,84,120,.30), transparent 70%); animation:drift2 26s ease-in-out infinite reverse; }
@keyframes drift1{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(-6%,9%) scale(1.14);} }
@keyframes drift2{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(9%,-6%) scale(1.08);} }
@keyframes drift3{ 0%,100%{ transform:translate(0,0) scale(1); opacity:.8;} 50%{ transform:translate(-10%,6%) scale(1.2); opacity:1;} }
/* light leak varrendo devagar */
.hero__leak{ position:absolute; inset:-20%; background:linear-gradient(115deg, transparent 42%, rgba(255,120,50,.10) 50%, transparent 58%); animation:leak 11s ease-in-out infinite; }
@keyframes leak{ 0%,100%{ transform:translateX(-10%);} 50%{ transform:translateX(10%);} }
/* vinheta de lente */
.hero__vignette{ position:absolute; inset:0; background:radial-gradient(ellipse at 50% 42%, transparent 50%, rgba(4,3,3,.62) 100%); }
.hero__grid{
  position:absolute; inset:0;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:80px 80px; mask-image:radial-gradient(circle at 50% 40%,#000,transparent 75%);
  opacity:.5;
}
@keyframes marquee{ from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ---------- TIMELINE DO PREMIERE (fundo, perspectiva + DOF) ---------- */
.edit-bg{ position:absolute; inset:0; overflow:hidden; z-index:0; perspective:1000px; perspective-origin:50% 30%; }
/* timeline REAL (foto) — some sozinha se o arquivo não existir (onerror) */
.edit-bg__photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 42%; filter:blur(1.5px) saturate(1.02) brightness(.62); opacity:.38; }
.edit-bg:has(.edit-bg__photo) .edit-bg__plane{ display:none; }
.edit-bg__plane{ position:absolute; left:-25%; right:-25%; top:12%; bottom:-45%; display:flex; flex-direction:column; gap:10px; transform:rotateX(57deg) rotateZ(-11deg); transform-origin:center top; filter:blur(3px) saturate(.9); opacity:.8; -webkit-mask-image:radial-gradient(125% 95% at 62% 15%, #000 22%, transparent 80%); mask-image:radial-gradient(125% 95% at 62% 15%, #000 22%, transparent 80%); animation:tlPan 36s linear infinite; }
.edit-row{ display:flex; gap:7px; height:30px; flex:0 0 auto; }
.edit-clip{ height:100%; border-radius:4px; flex:0 0 auto; box-shadow:inset 0 1px 0 rgba(255,255,255,.15), inset 0 0 0 1px rgba(0,0,0,.35); }
@keyframes tlPan{ from{ transform:rotateX(57deg) rotateZ(-11deg) translateX(0); } to{ transform:rotateX(57deg) rotateZ(-11deg) translateX(-170px); } }
.edit-bg::after{ content:''; position:absolute; inset:0; pointer-events:none; filter:blur(7px); background:
  radial-gradient(circle at 22% 60%, rgba(120,180,255,.20), transparent 8%),
  radial-gradient(circle at 76% 46%, rgba(255,170,90,.18), transparent 7%),
  radial-gradient(circle at 44% 74%, rgba(120,220,170,.15), transparent 6%); }
.hero__scrim{ position:absolute; inset:0; z-index:0; pointer-events:none; background:linear-gradient(100deg, var(--bg) 24%, rgba(10,10,11,.55) 50%, transparent 76%); }

/* ---------- SELETOR DO PREMIERE (só na palavra VÍDEO) ---------- */
.hero__titlewrap{ position:relative; display:inline-block; }
.selword{ position:relative; display:inline-block; line-height:1; }
/* caixa posicionada por JS (mede a caixa-alta real) — encaixa perfeito */
.selbox{ position:absolute; border:1.5px solid #3d9bff; box-shadow:0 0 18px rgba(61,155,255,.22); pointer-events:none; opacity:0; transition:opacity .4s; animation:selPulse 3s ease-in-out infinite; }
.selbox.is-ready{ opacity:1; }
.selbox__label{ position:absolute; top:-1px; left:-1.5px; transform:translateY(-100%); font-family:var(--font-head); font-weight:600; font-size:.6rem; letter-spacing:.05em; color:#08131f; background:#3d9bff; padding:.16rem .5rem; border-radius:5px 5px 0 0; white-space:nowrap; }
.selbox .h{ position:absolute; width:9px; height:9px; background:#fff; border:1.5px solid #3d9bff; }
.selbox .h-tl{ top:0; left:0; transform:translate(-50%,-50%); }
.selbox .h-tm{ top:0; left:50%; transform:translate(-50%,-50%); }
.selbox .h-tr{ top:0; right:0; transform:translate(50%,-50%); }
.selbox .h-ml{ top:50%; left:0; transform:translate(-50%,-50%); }
.selbox .h-mr{ top:50%; right:0; transform:translate(50%,-50%); }
.selbox .h-bl{ bottom:0; left:0; transform:translate(-50%,50%); }
.selbox .h-bm{ bottom:0; left:50%; transform:translate(-50%,50%); }
.selbox .h-br{ bottom:0; right:0; transform:translate(50%,50%); }
@keyframes selPulse{ 0%,100%{ border-color:#3d9bff; } 50%{ border-color:#78b8ff; } }

@media (max-width:900px){ .selbox__label{ display:none; } }

/* ---------- PILLS FLUTUANTES (credenciais sobre a foto) ---------- */
/* pills agrupadas embaixo da foto (não soltas) */
.hero__tags{ position:absolute; right:clamp(1rem,4vw,4rem); bottom:6%; width:min(44%,480px); z-index:3; display:flex; flex-wrap:wrap; gap:.6rem; justify-content:flex-end; pointer-events:none; }
.htag{ display:inline-flex; align-items:center; gap:.5rem; font-family:var(--font-head); font-weight:600; font-size:.82rem; color:var(--ink); background:rgba(20,18,17,.6); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.16); border-radius:100px; padding:.55rem 1rem; box-shadow:0 10px 30px rgba(0,0,0,.45); white-space:nowrap; opacity:0; transform:translateY(14px); animation:tagIn .7s var(--ease) forwards; }
.htag i{ width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 10px var(--accent); }
.htag b{ color:var(--accent); font-weight:700; }
@keyframes tagIn{ to{ opacity:1; transform:translateY(0); } }
.htag--1{ animation-delay:.5s; } .htag--2{ animation-delay:.65s; } .htag--3{ animation-delay:.8s; } .htag--4{ animation-delay:.95s; }
@media (max-width:900px){ .hero__tags{ display:none; } }

.hero__content{ position:relative; z-index:2; max-width:1400px; margin:0 auto; width:100%; }
.hero__meta{ margin-bottom:3.4rem; }
.tag{ display:inline-flex; align-items:center; gap:.6rem; font-size:.78rem; letter-spacing:.08em; color:var(--ink-dim); border:1px solid var(--line); padding:.5rem 1rem; border-radius:100px; }
.tag__pulse{ width:8px; height:8px; border-radius:50%; background:#4ade80; box-shadow:0 0 0 0 rgba(74,222,128,.6); animation:pulse 2s infinite; }
@keyframes pulse{ 0%{box-shadow:0 0 0 0 rgba(74,222,128,.5)} 70%{box-shadow:0 0 0 12px rgba(74,222,128,0)} 100%{box-shadow:0 0 0 0 rgba(74,222,128,0)} }

.hero__title{ position:relative; z-index:1; font-family:var(--font-disp); font-size:clamp(3rem,8vw,8.5rem); line-height:.94; letter-spacing:-.01em; text-transform:uppercase; }
.hero__title .line{ display:block; white-space:nowrap; }

/* serifa itálica nos destaques — quebra a rigidez da condensada */
.hero__title em, .page-title em, .section-title em, .about__name em, .contact__title em{
  font-family:'Instrument Serif', Georgia, serif; font-style:italic; font-weight:400;
  text-transform:lowercase; letter-spacing:0; font-size:1.06em; line-height:.85;
}
.hero__title .line > span{ display:block; }

.hero__row{ display:flex; justify-content:flex-start; align-items:flex-end; gap:2.5rem; margin-top:2.5rem; flex-wrap:wrap; max-width:620px; }
.hero__lead{ max-width:34ch; color:var(--ink-dim); font-size:1.05rem; line-height:1.6; }
.hero__lead strong{ color:var(--ink); }
.hero__actions{ display:flex; gap:1rem; }

.btn{ display:inline-flex; align-items:center; gap:.6rem; font-weight:600; font-size:.95rem; padding:1rem 1.6rem; border-radius:100px; transition:.4s var(--ease); }
.btn--primary{ background:var(--accent); color:#fff; box-shadow:0 12px 34px rgba(255,77,23,.35); }
.btn--primary:hover{ background:var(--ink); color:var(--bg); transform:translateY(-3px); }
.btn--primary svg{ transition:transform .35s var(--ease); }
.btn--primary:hover svg{ transform:translateX(4px); }
.btn--ghost{ border:1px solid var(--line); color:var(--ink); }
.btn--ghost:hover{ background:rgba(255,255,255,.06); transform:translateY(-3px); }

.hero__scroll{ position:absolute; bottom:2rem; left:clamp(1.2rem,4vw,3rem); display:flex; align-items:center; gap:1rem; z-index:2; font-size:.7rem; letter-spacing:.3em; color:var(--ink-faint); }
.hero__scroll-line{ width:60px; height:1px; background:var(--ink-faint); position:relative; overflow:hidden; }
.hero__scroll-line::after{ content:''; position:absolute; inset:0; width:40%; background:var(--accent); animation:scrollLine 2s var(--ease) infinite; }
@keyframes scrollLine{ 0%{transform:translateX(-100%)} 100%{transform:translateX(250%)} }

/* ---------- RETRATO LIVRE (hero, estilo referência) ---------- */
.hero__figure{ position:absolute; right:-1.5rem; bottom:-10vh; height:min(94vh,1000px); z-index:1; pointer-events:none; }
/* luz quente de cenário atrás dela (lado do rosto) */
.hero__figure::before{
  content:''; position:absolute; left:38%; top:34%; transform:translate(-50%,-50%);
  width:175%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle, rgba(255,86,30,.40), rgba(255,86,30,.13) 45%, transparent 66%);
  filter:blur(55px);
}
/* respiro frio no lado do contra-luz teal */
.hero__figure::after{
  content:''; position:absolute; right:-30%; top:4%;
  width:75%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle, rgba(47,124,124,.30), transparent 65%);
  filter:blur(65px);
}
.fig{
  position:relative; height:100%; transform:scaleX(-1); /* espelhada: olhando pro título */
  /* derrete a borda do ombro (corte do enquadramento original) no fundo */
  -webkit-mask-image:linear-gradient(to left, #000 88%, transparent 99.5%);
          mask-image:linear-gradient(to left, #000 88%, transparent 99.5%);
}
.fig img{ position:relative; z-index:1; height:100%; width:auto; display:block; filter:drop-shadow(-18px 20px 44px rgba(8,5,4,.42)) saturate(1.03) contrast(.97); }
/* light wrap: a luz do cenário abraça o contorno dela */
.fig__wrap{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(70% 60% at 70% 30%, rgba(255,120,50,.95), rgba(255,86,30,.55) 55%, rgba(180,60,20,.35) 80%);
  -webkit-mask:url('assets/img/maria.png?v=4') center / 100% 100% no-repeat;
          mask:url('assets/img/maria.png?v=4') center / 100% 100% no-repeat;
  transform:scale(1.005);
  filter:blur(24px);
  opacity:.5;
  mix-blend-mode:screen;
}
/* rim light nas bordas: quente no lado do rosto, teal no contra-luz */
.fig__rim{
  position:absolute; inset:0; z-index:3; pointer-events:none;
  background:
    linear-gradient(to right, transparent 78%, rgba(255,150,60,.5) 97%),
    linear-gradient(to left, transparent 84%, rgba(64,150,150,.42) 99%);
  -webkit-mask:url('assets/img/maria.png?v=4') center / 100% 100% no-repeat;
          mask:url('assets/img/maria.png?v=4') center / 100% 100% no-repeat;
  mix-blend-mode:screen;
}
/* luz do ambiente refletida na silhueta (a própria foto vira máscara) */
.fig__tint{
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(105deg, rgba(31,107,107,.45) 6%, transparent 42%, rgba(255,86,30,.5) 90%);
  mix-blend-mode:soft-light;
  -webkit-mask:url('assets/img/maria.png?v=4') center / 100% 100% no-repeat;
          mask:url('assets/img/maria.png?v=4') center / 100% 100% no-repeat;
}
/* névoa quente na frente da figura (profundidade de cena) */
.hero__haze{
  position:absolute; right:-6%; bottom:-12%; width:60%; height:58%; z-index:2; pointer-events:none;
  background:
    radial-gradient(58% 52% at 62% 76%, rgba(255,86,30,.15), transparent 66%),
    radial-gradient(40% 35% at 88% 20%, rgba(47,124,124,.07), transparent 70%);
  filter:blur(28px);
}

/* ---------- FAIXA ADESIVA ---------- */
.band{ position:relative; z-index:3; background:var(--accent); transform:rotate(-1.6deg) scale(1.04); margin:-2.4rem 0 1rem; box-shadow:0 18px 50px rgba(255,77,23,.25); overflow:hidden; }
.band__track{ display:flex; align-items:center; gap:2.6rem; white-space:nowrap; padding:.85rem 0; animation:marquee 22s linear infinite; }
.band__track span{ font-family:var(--font-disp); font-weight:500; font-size:1.4rem; letter-spacing:.05em; color:#170c07; text-transform:uppercase; flex:0 0 auto; }

/* ---------- MURAL / DESTAQUES (autoplay) ---------- */
.reel{ padding:clamp(3.5rem,8vw,6rem) 0 clamp(3.5rem,8vw,6rem); overflow:hidden; }
.reel__head{ max-width:1400px; margin:0 auto 2.5rem; padding:0 clamp(1.2rem,4vw,3rem); }
.reel__rows{ display:flex; flex-direction:column; gap:1.1rem; }
.reel__wall{ display:flex; gap:1.1rem; width:max-content; animation:marquee 90s linear infinite; will-change:transform; }
.reel__wall--rev{ animation-direction:reverse; animation-duration:105s; }
.rcard{
  position:relative; flex:0 0 auto; width:clamp(170px,16vw,210px); aspect-ratio:9/16;
  border-radius:14px; overflow:hidden; border:1px solid var(--line); background:#0d0d0f;
  box-shadow:0 20px 50px rgba(0,0,0,.4);
}
.rcard video, .rcard img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.rcard::after{ content:''; position:absolute; inset:0; background:linear-gradient(transparent 60%, rgba(10,8,7,.45)); pointer-events:none; }
.rcard__tag{
  position:absolute; left:.7rem; bottom:.7rem; z-index:2;
  font-family:var(--font-head); font-weight:600; font-size:.64rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink); background:rgba(10,10,11,.72);
  border:1px solid var(--line); border-radius:100px; padding:.3rem .6rem;
}
@media (max-width:560px){ .reel__wall{ animation-duration:45s; } }

/* ---------- STATS ---------- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.stat{ background:var(--bg); padding:clamp(2rem,5vw,4rem) 2rem; text-align:center; transition:background .4s; }
.stat:hover{ background:var(--bg-2); }
.stat__num{ font-family:var(--font-disp); font-size:clamp(2.6rem,6vw,5rem); line-height:1; }
.stat__label{ color:var(--ink-dim); font-size:.82rem; letter-spacing:.05em; margin-top:.6rem; }

/* ---------- GENERIC SECTION ---------- */
.eyebrow{ display:inline-block; font-size:.75rem; letter-spacing:.3em; color:var(--accent); font-weight:600; text-transform:uppercase; }
.section-title{ font-family:var(--font-disp); font-size:clamp(2.2rem,6vw,4.5rem); line-height:1; text-transform:uppercase; margin-top:1rem; }

/* ---------- SPLIT ---------- */
.split{ position:relative; padding:clamp(4rem,10vw,8rem) clamp(1.2rem,4vw,3rem); max-width:1400px; margin:0 auto; }
/* dinheiro voando = "uma obsessão: resultado" (preenche o vazio, sem poluir) */
.deco{ position:absolute; z-index:1; pointer-events:none; }
.deco--bill{ width:clamp(120px,13vw,190px); top:6%; right:9%; transform:rotate(15deg); filter:drop-shadow(0 22px 40px rgba(0,0,0,.55)); }
.deco--bill2{ width:clamp(84px,9vw,128px); top:30%; right:30%; transform:rotate(-12deg); filter:drop-shadow(0 16px 30px rgba(0,0,0,.5)); opacity:.9; }
@media (max-width:760px){ .deco--bill,.deco--bill2{ display:none; } }
/* seta desenhada à mão apontando pro CTA (toque humano) */
.hero__actions{ position:relative; }
.deco-arrow{ position:absolute; right:-84px; top:-52px; width:74px; height:74px; background:var(--accent); pointer-events:none;
  -webkit-mask:url('assets/img/deco/arrow.png') center/contain no-repeat; mask:url('assets/img/deco/arrow.png') center/contain no-repeat;
  transform:rotate(-28deg); opacity:.92; }
@media (max-width:1100px){ .deco-arrow{ display:none; } }
@media (max-width:900px){ .deco-arrow{ display:none; } }
.split__head{ margin-bottom:3rem; }
.split__cards{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.scard{ position:relative; text-align:left; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--surface); transition:.5s var(--ease); }
.scard:hover{ transform:translateY(-6px); border-color:rgba(255,77,23,.4); }
.scard__idx{ position:absolute; top:1.2rem; right:1.4rem; font-family:var(--font-disp); font-size:1.4rem; color:var(--ink-faint); z-index:2; }
.scard__media{ height:280px; background:linear-gradient(135deg,#1a1a1f,#0e0e10); display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.scard__media--alt{ background:linear-gradient(135deg,#231410,#0e0e10); }
.scard__media::after{ content:''; position:absolute; inset:0; background:linear-gradient(transparent 45%, rgba(14,14,16,.55)); z-index:1; }
.scard__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.scard:hover .scard__media img{ transform:scale(1.06); }
.scard__ph{ font-family:var(--font-disp); font-size:3rem; color:rgba(255,255,255,.08); letter-spacing:.05em; }
.scard__body{ padding:2rem; }
.scard__body h3{ font-family:var(--font-head); font-size:1.7rem; font-weight:800; }
.scard__body p{ color:var(--ink-dim); margin:.8rem 0 1.4rem; line-height:1.6; max-width:40ch; }
.scard__go{ display:inline-flex; align-items:center; gap:.5rem; font-weight:600; color:var(--accent); }
.scard__go svg{ transition:transform .35s var(--ease); }
.scard:hover .scard__go svg{ transform:translateX(6px); }

/* ---------- LOGOS DE CLIENTES ---------- */
.logos{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); overflow:hidden; padding:2.4rem 0; }
.logos__label{ text-align:center; font-size:.72rem; letter-spacing:.28em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:1.8rem; padding:0 1.2rem; }
.logos__track{ display:flex; align-items:center; gap:clamp(3rem,6vw,5.5rem); white-space:nowrap; animation:marquee 32s linear infinite; }
.logos__track img{
  height:42px; width:auto; flex:0 0 auto;
  filter:brightness(0) invert(.92);   /* todos em branco: vitrine uniforme */
  opacity:.55; transition:opacity .35s, filter .35s;
}
.logos__track img:hover{ opacity:1; filter:brightness(0) invert(1); }
.logos:hover .logos__track{ animation-play-state:paused; }

/* ---------- PAGE HEAD (tabs internas) ---------- */
.page-head{ position:relative; padding:clamp(8rem,16vh,12rem) clamp(1.2rem,4vw,3rem) 3rem; max-width:1400px; margin:0 auto; }
.page-title{ font-family:var(--font-disp); font-size:clamp(3rem,11vw,9rem); line-height:.9; text-transform:uppercase; margin:2rem 0 1rem; }
.page-sub{ color:var(--ink-dim); max-width:52ch; font-size:1.1rem; line-height:1.6; }

/* ---------- GALLERY ---------- */
.gallery{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; padding:0 clamp(1.2rem,4vw,3rem) clamp(5rem,10vw,8rem); max-width:1400px; margin:0 auto; }
.gallery--alt{ grid-template-columns:repeat(2,1fr); }
.vcard{ position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); background:var(--surface); aspect-ratio:9/16; transition:.5s var(--ease); }
.gallery--alt .vcard{ aspect-ratio:16/10; }
.vcard:hover{ transform:translateY(-6px); border-color:rgba(255,77,23,.4); }
.vcard__ph{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1rem;
  background:
    linear-gradient(rgba(244,242,238,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(244,242,238,.05) 1px, transparent 1px),
    linear-gradient(160deg,#141419,#0c0c0f);
  background-size:26px 26px, 26px 26px, auto;
}
/* card com vídeo real: poster + overlay de play */
.vcard__poster{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.vcard:hover .vcard__poster{ transform:scale(1.05); }
.vcard__ph--over{ background:linear-gradient(transparent 55%, rgba(8,6,5,.75)); color:var(--ink); }
.vcard__ph::before{ content:''; position:absolute; inset:0; background:radial-gradient(circle at 50% 30%,rgba(255,77,23,.12),transparent 55%); }
.vcard__play{ width:64px; height:64px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.04); transition:.4s var(--ease); z-index:2; }
.vcard:hover .vcard__play{ background:var(--accent); border-color:var(--accent); transform:scale(1.1); }
.vcard__play svg{ margin-left:3px; }
.vcard__tag{ position:absolute; top:1rem; left:1rem; font-size:.7rem; letter-spacing:.1em; background:rgba(10,10,11,.7); border:1px solid var(--line); padding:.35rem .7rem; border-radius:100px; z-index:2; }
.vcard__meta{ position:absolute; bottom:0; left:0; right:0; padding:1.4rem; z-index:2; background:linear-gradient(transparent,rgba(0,0,0,.85)); }
.vcard__meta h4{ font-family:var(--font-head); font-weight:700; font-size:1.1rem; }
.vcard__meta span{ color:var(--ink-dim); font-size:.82rem; }
.vcard__idx{ position:absolute; top:1rem; right:1.2rem; font-family:var(--font-disp); font-size:1.2rem; color:rgba(255,255,255,.15); z-index:2; }

/* ---------- GALERIA CRIATIVOS (vídeo real + lightbox) ---------- */
.vgrid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.4rem; padding:0 clamp(1.2rem,4vw,3rem) clamp(5rem,10vw,8rem); max-width:1400px; margin:0 auto; }
.vitem{ position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); background:var(--surface); aspect-ratio:16/9; transition:.5s var(--ease); }
.vitem:hover{ transform:translateY(-6px); border-color:rgba(255,77,23,.45); }
.vitem img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.vitem:hover img{ transform:scale(1.05); }
.vitem::after{ content:''; position:absolute; inset:0; background:linear-gradient(transparent 45%, rgba(8,6,5,.82)); }
.vitem__play{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:2; width:66px; height:66px; border-radius:50%; background:rgba(10,10,11,.5); backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,.35); display:flex; align-items:center; justify-content:center; transition:.4s var(--ease); }
.vitem:hover .vitem__play{ background:var(--accent); border-color:var(--accent); transform:translate(-50%,-50%) scale(1.12); }
.vitem__play svg{ margin-left:3px; }
.vitem__meta{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:1.4rem 1.5rem; }
.vitem__tag{ font-family:var(--font-head); font-weight:700; font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--accent-2); }
.vitem__title{ font-family:var(--font-head); font-weight:700; font-size:1.25rem; margin-top:.25rem; }
@media (max-width:640px){ .vgrid{ grid-template-columns:1fr; } }

/* ---------- LIGHTBOX ---------- */
.lightbox{ position:fixed; inset:0; z-index:10050; background:rgba(6,5,5,.9); backdrop-filter:blur(10px); display:flex; align-items:center; justify-content:center; padding:clamp(1rem,4vw,3rem); opacity:0; visibility:hidden; transition:opacity .4s var(--ease), visibility .4s; }
.lightbox.is-open{ opacity:1; visibility:visible; }
.lightbox__stage{ width:min(1100px,100%); max-height:86vh; border-radius:14px; overflow:hidden; box-shadow:0 40px 120px rgba(0,0,0,.7); transform:scale(.96); transition:transform .45s var(--ease); }
.lightbox.is-open .lightbox__stage{ transform:scale(1); }
.lightbox__stage video{ width:100%; max-height:86vh; display:block; background:#000; }
.lightbox__close{ position:absolute; top:1.4rem; right:1.6rem; width:46px; height:46px; border-radius:50%; border:1px solid var(--line); background:rgba(255,255,255,.06); color:var(--ink); font-size:1.1rem; transition:.35s var(--ease); }
.lightbox__close:hover{ background:var(--accent); border-color:var(--accent); transform:rotate(90deg); }
/* cursor real dentro do player (senão o cursor custom some e não dá pra pausar/arrastar) */
.lightbox, .lightbox *{ cursor:auto; }
.lightbox video{ cursor:auto; }
.lightbox__close{ cursor:pointer; }
body.lb-open .cursor, body.lb-open .cursor-dot{ opacity:0; }

/* ---------- SOFTWARE HOLOGRÁFICO ---------- */
.softwares{ display:flex; flex-wrap:wrap; gap:1.1rem; margin-top:2rem; }
.holo{ position:relative; width:clamp(94px,12vw,128px); aspect-ratio:1; border-radius:20px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem; overflow:hidden; border:1px solid rgba(130,200,220,.28); background:linear-gradient(160deg, rgba(31,107,107,.16), rgba(255,77,23,.05)); }
.holo::before{ content:''; position:absolute; inset:0; background:repeating-linear-gradient(0deg, rgba(190,235,255,.08) 0 1px, transparent 1px 4px); animation:holoScan 5s linear infinite; pointer-events:none; }
.holo::after{ content:''; position:absolute; inset:0; background:radial-gradient(60% 55% at 50% 42%, rgba(120,205,225,.20), transparent 72%); pointer-events:none; }
.holo__mark{ position:relative; z-index:1; font-family:var(--font-head); font-weight:800; font-size:clamp(1.7rem,3.6vw,2.4rem); color:rgba(226,246,252,.94); letter-spacing:-.02em; text-shadow:-1.5px 0 rgba(255,64,90,.55), 1.5px 0 rgba(45,205,235,.55); filter:drop-shadow(0 0 10px rgba(95,205,225,.55)); animation:holoGlitch 4.5s infinite; }
/* logo real usado como máscara + holograma com aberração cromática */
.holo__logo{ position:relative; z-index:1; width:clamp(42px,5.2vw,58px); aspect-ratio:1; filter:drop-shadow(0 0 11px rgba(95,205,225,.6)); animation:holoGlitch 4.5s infinite; }
.holo__logo, .holo__logo::before, .holo__logo::after{ -webkit-mask:var(--logo) center/contain no-repeat; mask:var(--logo) center/contain no-repeat; }
.holo__logo{ background:linear-gradient(180deg, rgba(232,251,255,.96), rgba(120,208,228,.9)); }
.holo__logo::before, .holo__logo::after{ content:''; position:absolute; inset:0; mix-blend-mode:screen; }
.holo__logo::before{ background:rgba(255,64,90,.75); transform:translateX(-2px); }
.holo__logo::after{ background:rgba(45,205,235,.75); transform:translateX(2px); }
.holo__name{ position:relative; z-index:1; font-family:var(--font-head); font-weight:600; font-size:.58rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(226,246,252,.62); }
@keyframes holoScan{ from{ background-position:0 0; } to{ background-position:0 40px; } }
@keyframes holoGlitch{ 0%,90%,100%{ transform:translate(0,0); } 91%{ transform:translate(-2px,1px); text-shadow:-3px 0 rgba(255,64,90,.75), 3px 0 rgba(45,205,235,.75); } 94%{ transform:translate(2px,-1px); } 96%{ transform:translate(-1px,0); } }

/* ---------- DECORAÇÕES AUDIOVISUAL (cantos + timeline) ---------- */
.decor{ position:absolute; z-index:0; color:var(--ink); pointer-events:none; }
.decor svg{ width:100%; height:auto; display:block; }
.decor--clap{ top:76px; right:2.5%; width:clamp(88px,10vw,148px); opacity:.08; transform:rotate(9deg); animation:decorFloat 9s ease-in-out infinite; }
.decor--chair{ bottom:9%; left:2%; width:clamp(84px,8.5vw,132px); opacity:.07; animation:decorFloat 11s ease-in-out infinite reverse; }
@keyframes decorFloat{ 0%,100%{ transform:translateY(0) rotate(var(--r,0deg)); } 50%{ transform:translateY(-14px) rotate(var(--r,0deg)); } }
.decor--clap{ --r:9deg; }
.tl-strip{ position:relative; overflow:hidden; padding:1.6rem 0; opacity:.15; -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); }
.tl-strip__track{ display:flex; width:max-content; animation:marquee 50s linear infinite; }
.tl-strip__track svg{ height:clamp(80px,10vw,120px); width:auto; flex:0 0 auto; display:block; }

/* ---------- ABOUT ---------- */
.about{ max-width:1200px; margin:0 auto; padding:clamp(8rem,16vh,12rem) clamp(1.2rem,4vw,3rem) 4rem; }
.about__hero{ position:relative; }
.about__hero .eyebrow, .about__name, .about__role, .about__intro{ position:relative; z-index:1; }
.about__name{ font-family:var(--font-disp); font-size:clamp(3.5rem,13vw,11rem); line-height:.9; text-transform:uppercase; margin:1.8rem 0 .8rem; }
.about__role{ font-family:var(--font-head); font-weight:600; font-size:.82rem; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-dim); margin-bottom:3rem; }
.about__intro{ display:grid; grid-template-columns:300px 1fr; gap:3rem; align-items:start; }
.about__portrait{ aspect-ratio:3/4; border-radius:var(--radius); border:1px solid var(--line); overflow:hidden; background:linear-gradient(160deg,#1a1a1f,#0d0d0f); transform:rotate(-2deg); box-shadow:0 24px 60px rgba(0,0,0,.5); }
.about__portrait img{ width:100%; height:100%; object-fit:cover; object-position:50% 30%; }
.about__body{ display:flex; flex-direction:column; gap:2.2rem; }
.about__intro p{ font-size:1.25rem; line-height:1.75; color:var(--ink-dim); }
.about__intro p em{ color:var(--accent); font-family:'Instrument Serif', Georgia, serif; font-style:italic; font-size:1.1em; }
.about__specs{ border-top:1px solid var(--line); padding-top:1.6rem; }
.about__specs .eyebrow{ margin-bottom:1rem; }
.about__specs ul{ list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:.7rem 1.6rem; }
.about__specs li{ position:relative; padding-left:1.4rem; font-family:var(--font-head); font-weight:500; font-size:.98rem; color:var(--ink); }
.about__specs li::before{ content:''; position:absolute; left:0; top:.5em; width:7px; height:7px; border-radius:50%; background:var(--accent); }
.about__signature{ font-family:var(--font-disp); font-weight:500; font-size:clamp(1.5rem,3.4vw,2.6rem); line-height:1.15; text-transform:uppercase; color:var(--ink); margin-top:3rem; max-width:22ch; }
.about__signature em{ font-family:'Instrument Serif', Georgia, serif; font-style:italic; text-transform:none; color:var(--accent); }
@media (max-width:900px){ .about__specs ul{ grid-template-columns:1fr; } }

/* ---------- MINHA HISTÓRIA (vídeo) ---------- */
.story{ display:grid; grid-template-columns:minmax(280px,380px) 1fr; gap:clamp(2rem,5vw,4rem); align-items:center; padding:clamp(3rem,8vw,6rem) 0 0; }
.story__video video{
  width:100%; aspect-ratio:9/16; object-fit:cover; display:block;
  border-radius:var(--radius); border:1px solid var(--line); background:#000;
  box-shadow:0 30px 70px rgba(0,0,0,.5);
}
.story__text p{ color:var(--ink-dim); margin-top:1.2rem; line-height:1.7; max-width:46ch; font-size:1.05rem; }
@media (max-width:900px){
  .story{ grid-template-columns:1fr; }
  .story__video{ max-width:320px; margin:0 auto; }
}

.timeline{ padding:clamp(4rem,10vw,7rem) 0; }
.timeline__list{ margin-top:3rem; border-top:1px solid var(--line); }
.tl{ display:grid; grid-template-columns:160px 1fr; gap:2rem; padding:2rem 0; border-bottom:1px solid var(--line); transition:.4s var(--ease); }
.tl:hover{ padding-left:1rem; background:linear-gradient(90deg,rgba(255,77,23,.04),transparent); }
.tl__year{ font-family:var(--font-disp); font-weight:500; font-size:1.7rem; letter-spacing:.06em; color:var(--accent); }
.tl__body h3{ font-family:var(--font-head); font-weight:700; font-size:1.4rem; }
.tl__body p{ color:var(--ink-dim); margin-top:.5rem; }

.gear{ padding:clamp(3rem,8vw,6rem) 0; }
.gear__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; margin-top:2.5rem; }
.gear__item{ background:var(--bg); padding:2rem; display:flex; flex-direction:column; gap:.6rem; transition:background .4s; }
.gear__item:hover{ background:var(--bg-2); }
.gear__item span{ font-size:.72rem; letter-spacing:.2em; color:var(--ink-faint); }
.gear__item strong{ font-family:var(--font-head); font-size:1.15rem; font-weight:700; line-height:1.35; }
.gear__note{ margin-top:1.6rem; color:var(--ink-dim); font-size:1.02rem; line-height:1.7; max-width:62ch; }
.gear__note em{ font-family:'Instrument Serif', Georgia, serif; font-style:italic; color:var(--accent); }

.contact{ text-align:center; padding:clamp(4rem,10vw,7rem) 0 2rem; border-top:1px solid var(--line); }
.contact__title{ font-family:var(--font-disp); font-size:clamp(2.4rem,7vw,5rem); text-transform:uppercase; line-height:1; }
.contact__wpp{ display:inline-flex; align-items:center; gap:.6rem; margin:2rem 0 .4rem; background:#25D366; color:#062e17; font-family:var(--font-head); font-weight:700; font-size:1rem; padding:1rem 1.7rem; border-radius:100px; transition:.4s var(--ease); }
.contact__wpp:hover{ transform:translateY(-3px); box-shadow:0 14px 34px rgba(37,211,102,.32); }
.contact__mail{ display:block; margin:1.2rem 0 1.5rem; font-size:clamp(1.1rem,3vw,1.8rem); border-bottom:2px solid var(--accent); padding-bottom:.3rem; transition:.35s; }
.contact__mail:hover{ color:var(--accent); }
.contact__socials{ display:flex; gap:2rem; justify-content:center; }
.contact__socials a{ color:var(--ink-dim); position:relative; transition:color .3s; }
.contact__socials a:hover{ color:var(--ink); }

/* ---------- FOOTER ---------- */
.footer{ display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; padding:2rem clamp(1.2rem,4vw,3rem); border-top:1px solid var(--line); color:var(--ink-dim); font-size:.85rem; }
.footer__wpp{ display:inline-flex; align-items:center; gap:.45rem; color:#25D366; font-weight:600; transition:.3s; }
.footer__wpp:hover{ color:#4ee584; }
.footer__top{ color:var(--ink-dim); transition:color .3s; }
.footer__top:hover{ color:var(--accent); }

/* galeria com ritmo (quebra o grid certinho) */
@media (min-width:901px){
  .gallery .vcard:nth-child(3n+2){ margin-top:2.4rem; }
  .gallery--alt .vcard:nth-child(2n){ margin-top:2.4rem; }
}

/* ============================================================
   SISTEMAS v39 — corte, timeline-nav, previews, cursor, CTA
   ============================================================ */

/* ---------- CORTE entre abas ---------- */
.cut{ position:fixed; inset:0; z-index:9600; pointer-events:none; overflow:hidden; }
.cut i{ position:absolute; top:-12%; bottom:-12%; left:-40%; width:180%; transform:translateX(-125%) skewX(-14deg); }
.cut i:nth-child(1){ background:var(--accent); }
.cut i:nth-child(2){ background:#0d0c0c; }
.cut.run i:nth-child(1){ animation:cutSweep .62s cubic-bezier(.77,0,.18,1) both; }
.cut.run i:nth-child(2){ animation:cutSweep .62s cubic-bezier(.77,0,.18,1) .07s both; }
@keyframes cutSweep{ from{ transform:translateX(-125%) skewX(-14deg); } to{ transform:translateX(125%) skewX(-14deg); } }

/* ---------- CURSOR contextual ---------- */
.cursor-dot{ display:flex; align-items:center; justify-content:center; }
#cursorLabel{ font-family:var(--font-head); font-weight:700; font-size:0; letter-spacing:.14em; color:#1c0e06; white-space:nowrap; transition:font-size .15s; }
.cursor-dot.has-label{ width:auto; height:auto; padding:.5rem .85rem; border-radius:100px; }
.cursor-dot.has-label #cursorLabel{ font-size:.66rem; }
@media (hover:none){ .cursor, .cursor-dot{ display:none !important; } }

/* ---------- HERO: reveal de wipe + ken burns + luz respirando ---------- */
@media (prefers-reduced-motion: no-preference){
  /* o wipe só roda quando o preloader termina (body.is-ready) — senão anima escondido */
  body.is-ready .hero__title .line{ clip-path:inset(0 100% 0 0); animation:lineWipe .9s cubic-bezier(.77,0,.18,1) forwards; animation-delay:.25s; }
  body.is-ready .hero__title .line:nth-child(2){ animation-delay:.4s; }
  body.is-ready .hero__title .line:nth-child(3){ animation-delay:.55s; }
  .edit-bg__photo{ animation:kenburns 26s ease-in-out infinite alternate; }
  .hero__figure::before{ animation:breatheGlow 7s ease-in-out infinite; }
}
@keyframes lineWipe{ to{ clip-path:inset(0 -8% 0 0); } }
@keyframes kenburns{ from{ transform:scale(1); } to{ transform:scale(1.07) translateX(-1.5%); } }
@keyframes breatheGlow{ 0%,100%{ opacity:.8; } 50%{ opacity:1; } }

/* ---------- PREVIEW no hover (galerias) ---------- */
.hoverprev{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .35s; z-index:1; pointer-events:none; }
.is-prev .hoverprev{ opacity:1; }
.hoverprev__bar{ position:absolute; left:0; bottom:0; height:3px; width:0; background:var(--accent); z-index:3; box-shadow:0 0 8px rgba(255,77,23,.8); pointer-events:none; }

/* ---------- CTA FINAL (home) ---------- */
.cta{ max-width:1400px; margin:0 auto; padding:clamp(5rem,12vw,9rem) clamp(1.2rem,4vw,3rem) clamp(6rem,13vw,10rem); text-align:center; }
.cta__title{ font-family:var(--font-disp); font-weight:500; font-size:clamp(3rem,10vw,8.5rem); line-height:.95; text-transform:uppercase; margin-top:1.4rem; }
.cta__title em{ font-family:'Instrument Serif', Georgia, serif; font-style:italic; font-weight:400; text-transform:lowercase; letter-spacing:0; color:var(--accent); }
.cta__sub{ color:var(--ink-dim); margin:1.6rem auto 2.6rem; max-width:46ch; font-size:1.08rem; line-height:1.7; }
.btn--big{ font-size:1.15rem; padding:1.25rem 2.4rem; }

/* ---------- TIMELINE DE NAVEGAÇÃO (home) ---------- */
.tlnav{ position:fixed; left:50%; bottom:16px; transform:translateX(-50%); width:min(760px,94vw); z-index:9400;
  background:rgba(13,12,12,.78); backdrop-filter:blur(14px); border:1px solid var(--line); border-radius:14px;
  padding:.5rem .65rem .6rem; opacity:0; pointer-events:none; transition:opacity .4s var(--ease); }
body[data-tab="inicio"] .tlnav{ opacity:1; pointer-events:auto; }
body.lb-open .tlnav{ opacity:0 !important; pointer-events:none !important; }
.tlnav__head{ display:flex; justify-content:space-between; align-items:center; padding:0 .2rem .4rem; font-family:var(--font-head); font-weight:600; font-size:.6rem; letter-spacing:.14em; color:var(--ink-faint); text-transform:uppercase; }
.tlnav__tc{ font-variant-numeric:tabular-nums; color:var(--accent); }
.tlnav__track{ position:relative; display:flex; gap:3px; height:28px; }
.tlnav__clip{ flex:var(--w) 1 0; min-width:0; border-radius:4px; background:#26262e; background:color-mix(in srgb, var(--c) 52%, #0d0d10); border:1px solid rgba(255,255,255,.08);
  font-family:var(--font-head); font-weight:700; font-size:.52rem; letter-spacing:.12em; color:rgba(244,242,238,.78);
  overflow:hidden; white-space:nowrap; text-overflow:ellipsis; padding:0 .45rem; text-align:left; transition:filter .25s, border-color .25s; }
.tlnav__clip:hover{ filter:brightness(1.4); }
.tlnav__clip.is-live{ border-color:var(--accent); filter:brightness(1.3); }
.tlnav__playhead{ position:absolute; top:-8px; bottom:-4px; left:0; width:2px; background:var(--accent); box-shadow:0 0 10px rgba(255,77,23,.85); pointer-events:none; }
.tlnav__playhead::before{ content:''; position:absolute; top:-1px; left:50%; transform:translateX(-50%); border:6px solid transparent; border-top:8px solid var(--accent); }
@media (max-width:1000px){ .tlnav{ display:none; } }

/* mural: leve zoom no hover */
.rcard{ transition:transform .45s var(--ease); }
.rcard:hover{ transform:translateY(-5px) scale(1.02); }

/* ============================================================
   FINEZA v42 — luz viva, profundidade 3D, coreografia
   ============================================================ */

/* tilt 3D + brilho especular nos cards */
.vgrid, .gallery, .split__cards{ perspective:1200px; }
.tilt{ transform-style:preserve-3d; will-change:transform; }
.tilt .sheen{ position:absolute; inset:0; z-index:4; pointer-events:none; opacity:0; transition:opacity .3s; border-radius:inherit;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%), rgba(255,255,255,.13), transparent 60%); mix-blend-mode:screen; }
.tilt:hover .sheen{ opacity:1; }

/* notas de dólar suspensas (margin pra não brigar com rotate/translate) */
@media (prefers-reduced-motion: no-preference){
  .deco--bill{ animation:floatBill 7s ease-in-out infinite; }
  .deco--bill2{ animation:floatBill 9s ease-in-out infinite reverse; }
}
@keyframes floatBill{ 0%,100%{ margin-top:0; } 50%{ margin-top:-14px; } }

/* stats: número acende no hover */
.stat__num{ transition:color .3s, text-shadow .3s; }
.stat:hover .stat__num{ color:var(--accent); text-shadow:0 0 32px rgba(255,77,23,.45); }

/* ============================================================
   DIREÇÃO DE ARTE v43 — cores mesclando, degradês, grade
   ============================================================ */

/* AURORA: cores derretendo atrás das seções (cada aba tem a sua) */
.aurora{
  position:absolute; inset:-22% -10%; z-index:0; pointer-events:none;
  filter:blur(52px) saturate(1.15); opacity:.5;
  background:
    radial-gradient(38% 46% at 22% 30%, var(--a1, rgba(255,77,23,.5)), transparent 70%),
    radial-gradient(34% 40% at 76% 24%, var(--a2, rgba(255,170,80,.38)), transparent 70%),
    radial-gradient(42% 50% at 58% 78%, var(--a3, rgba(190,55,125,.28)), transparent 70%);
}
@media (prefers-reduced-motion: no-preference){
  .aurora{ animation:auroraDrift 26s ease-in-out infinite alternate; }
}
@keyframes auroraDrift{
  from{ transform:translate3d(-3%,-2%,0) rotate(-2deg) scale(1); }
  to{ transform:translate3d(3%,3%,0) rotate(2deg) scale(1.08); }
}
.page-head > *:not(.aurora), .cta > *:not(.aurora){ position:relative; z-index:1; }
.cta{ position:relative; overflow:visible; }

/* TÍTULOS com preenchimento em degradê (nada de branco chapado) */
.hero__title .line > span,
.page-title, .cta__title, .about__name, .section-title, .contact__title{
  background:linear-gradient(180deg, #faf7f0 42%, #ddcfb6 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
.hero__title em, .page-title em, .cta__title em, .about__name em, .section-title em, .contact__title em{
  background:linear-gradient(135deg, #ff5a1e 20%, #ffa14d 90%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
/* o selword é inline-block (novo contexto) — precisa do próprio gradiente senão fica invisível */
.selword{
  background:linear-gradient(180deg, #faf7f0 42%, #ddcfb6 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* COLOR GRADE nas thumbs — portfólio colorizado como um filme só */
.vcard__poster{ filter:saturate(.72) sepia(.22) hue-rotate(-8deg) contrast(1.06) brightness(.94); transition:filter .5s var(--ease), transform .6s var(--ease); }
.vitem img{ filter:saturate(.72) sepia(.22) hue-rotate(-8deg) contrast(1.06) brightness(.94); transition:filter .5s var(--ease), transform .6s var(--ease); }
.scard__media img{ filter:saturate(.85) sepia(.12) contrast(1.04); }
.vcard:hover .vcard__poster, .vitem:hover img, .scard:hover .scard__media img{ filter:none; }

/* FAIXA e BOTÕES com gradiente vivo */
.band{ background:linear-gradient(100deg, #e8420f, #ff7a33 45%, #ffb066 70%, #ff5a1e); }
.btn--primary{ background:linear-gradient(135deg, #ff5a1e, #ff8a3d); }
.btn--primary:hover{ background:linear-gradient(135deg, #ffb066, #ff8a3d); color:#1c0e06; }

/* fio de luz no topo de cada stat */
.stat{ position:relative; }
.stat::before{ content:''; position:absolute; top:0; left:18%; right:18%; height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,122,51,.55), transparent); }

/* ---------- REVEAL ---------- */
[data-reveal]{ opacity:0; transform:translateY(40px); transition:opacity .9s var(--ease), transform .9s var(--ease), filter 1.1s var(--ease); }
[data-reveal].is-in{ opacity:1; transform:none; }

/* ---------- RESPONSIVE ---------- */
@media (max-width:900px){
  .nav__tabs{ position:fixed; top:70px; left:1rem; right:1rem; flex-direction:column; padding:.8rem; border-radius:var(--radius); background:rgba(16,16,18,.96); backdrop-filter:blur(14px); transform:translateY(-140%); opacity:0; transition:.5s var(--ease); }
  .nav__tabs.is-open{ transform:none; opacity:1; }
  .nav__tab{ padding:.9rem; text-align:left; }
  .nav__cta{ display:none; }
  .nav__burger{ display:flex; }
  .hero__row{ flex-direction:column; align-items:flex-start; }
  .hero__title .line{ white-space:normal; }
  .hero{ padding-bottom:46vh; }
  .hero__figure{ height:46vh; right:50%; bottom:-4vh; transform:translateX(50%); }
  .stats{ grid-template-columns:repeat(2,1fr); }
  .split__cards{ grid-template-columns:1fr; }
  .gallery,.gallery--alt{ grid-template-columns:1fr 1fr; }
  .about__intro{ grid-template-columns:1fr; }
  .tl{ grid-template-columns:80px 1fr; gap:1rem; }
  .gear__grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .gallery,.gallery--alt{ grid-template-columns:1fr; }
  .stats{ grid-template-columns:1fr 1fr; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition-duration:.01ms !important; }
}

/* ============ LOGO "DUDA." (v45) ============ */
.nav__brand{ text-decoration:none; }
.nav__brand .logo{
  display:inline-flex; align-items:center;
  font-family:'Oswald',sans-serif; font-weight:700;
  font-size:1.5rem; letter-spacing:.005em; line-height:1;
  color:var(--ink);
  transition:transform .35s var(--ease);
}
.nav__brand:hover .logo{ transform:translateY(-1px); }
.nav__brand .logo__d{ height:1.02em; width:auto; margin:0 -.055em; display:block; }
.nav__brand .logo__play{ fill:var(--accent); transition:transform .35s var(--ease); transform-origin:center; transform-box:fill-box; }
.nav__brand:hover .logo__play{ transform:scale(1.12); }
.nav__brand .logo__dot{ color:var(--accent); margin-left:.03em; }

/* ============ FIX: foto do hero espremida no mobile (v45) ============ */
.fig img{ max-width:none; }

/* ============ MENU MOBILE = igual ao PC, sem burger (v45) ============ */
@media (max-width:900px){
  .nav{ flex-wrap:wrap; justify-content:center; gap:.6rem .8rem; padding:.85rem clamp(1rem,4vw,3rem); }
  .nav__brand{ flex:0 0 100%; justify-content:center; }
  .nav__brand .logo{ font-size:1.7rem; }
  .nav__tabs{
    position:static; transform:none; opacity:1; visibility:visible;
    flex-direction:row; flex-wrap:nowrap; align-items:center;
    width:auto; max-width:100%;
    top:auto; left:auto; right:auto;
    background:rgba(255,255,255,.03); border:1px solid var(--line);
    padding:.28rem; border-radius:100px; backdrop-filter:none;
    overflow-x:auto; scrollbar-width:none;
  }
  .nav__tabs::-webkit-scrollbar{ display:none; }
  .nav__tab{ flex:0 0 auto; padding:.52rem .68rem; font-size:.74rem; text-align:center; white-space:nowrap; }
  .nav__cta{ display:none; }
  .nav__burger{ display:none !important; }
  /* retrato do hero: centraliza sem distorcer + maior, aterrissando na faixa (sem flutuar) */
  .hero{ padding-bottom:52vh; }
  .hero__figure{ left:50%; right:auto; width:auto; transform:translateX(-50%); height:52vh; bottom:0; }
  .band{ margin-top:-3rem; position:relative; z-index:4; }
}

/* ============ TRAVA ROLAGEM HORIZONTAL (v47) ============
   luzes/faixa/blobs sangram além da borda de propósito — mas a página
   NÃO pode arrastar pro lado. clip trava sem criar container de scroll
   (hidden = fallback p/ navegadores antigos). */
html, body{ overflow-x:hidden; overflow-x:clip; }

/* ============ PERFORMANCE — só no celular/touch (v46) ============ */
@media (hover:none){
  .grain{ display:none; }                                   /* ruído de filme: mantém só no desktop */
  .nav.is-scrolled{ backdrop-filter:none; background:rgba(10,10,11,.94); }
  .rcard__tag{ backdrop-filter:none; }
}
@media (max-width:560px){
  .nav__tab{ padding:.5rem .56rem; font-size:.7rem; }
  .nav__brand .logo{ font-size:1.55rem; }
}