/* ═══════════════════════════════════════════════════════════════
   elvas * studio — site v2 "O Campo de Asteriscos"
   Tokens espelhados de colors_and_type.css. Easing único: quart-out.
   Camada imersiva (aurora, campo, explode→grid) em field.css, gerada pelo Lab.
   ═══════════════════════════════════════════════════════════════ */

@font-face { font-family: 'DM Sans'; src: url('../fonts/DMSans-latin.woff2') format('woff2'); font-weight: 100 1000; font-style: normal; font-display: swap; }
@font-face { font-family: 'Giarek'; src: url('../fonts/Giarek-Regular.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Wesker'; src: url('../fonts/Wesker-Bold.woff2') format('woff2'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Wesker'; src: url('../fonts/Wesker-BoldSemiExpanded.woff2') format('woff2'); font-weight: 800; font-display: swap; }
@font-face { font-family: 'Wesker Expanded'; src: url('../fonts/Wesker-BoldExpanded.woff2') format('woff2'); font-weight: 800; font-display: swap; }
/* A Wesker não tem acentos nem ° ®. Para esses glifos a Giarek entra no lugar (unicode-range),
   com size-adjust para casar a altura das caixas — é a mescla Wesker × Giarek da marca, automática. */
@font-face { font-family: 'Wesker'; src: url('../fonts/Giarek-Regular.woff2') format('woff2'); font-weight: 700 800; font-display: swap; size-adjust: 112%; unicode-range: U+00A0-00FF, U+0100-024F, U+1E00-1EFF; }
@font-face { font-family: 'Wesker Expanded'; src: url('../fonts/Giarek-Regular.woff2') format('woff2'); font-weight: 800; font-display: swap; size-adjust: 112%; unicode-range: U+00A0-00FF, U+0100-024F, U+1E00-1EFF; }

:root {
  --es-black: #1A1A18; --es-black-2: #212120; --es-white: #FFFFFF;
  --es-gray-1: #F5F4F2; --es-gray-2: #E5E3DF; --es-gray-3: #9A9896; --es-gray-4: #6F6D6B;
  --es-blue: #0045BE; --es-green: #00C360; --es-coral: #E3807C; --es-yellow: #F5C578; --es-cyan: #02ACFF;
  --es-font-display: 'Wesker Expanded', 'Impact', sans-serif;
  --es-font-cond: 'Wesker', 'Arial Black', sans-serif;
  --es-font-serif: 'Giarek', 'Georgia', serif;
  --es-font-body: 'DM Sans', system-ui, -apple-system, sans-serif;
  --es-fib-xs: 8px; --es-fib-sm: 13px; --es-fib-md: 21px; --es-fib-lg: 34px; --es-fib-xl: 55px; --es-fib-2xl: 89px; --es-fib-3xl: 144px;
  --es-px: 52px; --es-nav-h: 68px; --es-max-w: 1240px; --es-case-w: 1040px;
  --es-radius-sm: 3px; --es-radius-pill: 999px;
  --es-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --es-t: 200ms var(--es-ease); --es-t-slow: 400ms var(--es-ease); --es-t-xslow: 600ms var(--es-ease);
  --es-shadow-xs: 0 1px 0 rgba(0,0,0,0.07); --es-shadow-md: 0 8px 24px rgba(0,69,190,0.28); --es-shadow-xl: 0 20px 48px rgba(0,0,0,0.2);
  --ast: clamp(240px, 38vw, 520px);
  --pr: var(--es-blue); /* cor da atuação corrente; cada capítulo/case sobrescreve */
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; }
body { font-family: var(--es-font-body); color: var(--es-black); background: #fff; overflow-x: hidden; line-height: 1.6; }
a { text-decoration: none; color: inherit; }
button { cursor: pointer; border: none; background: none; font-family: inherit; color: inherit; }
ul, ol { list-style: none; }
img, video { display: block; max-width: 100%; height: auto; }
svg { display: block; flex-shrink: 0; }
em { font-family: var(--es-font-serif); font-style: normal; font-weight: 400; }

/* ── Foco, skip, grão ── */
:focus-visible { outline: 2px solid var(--es-blue); outline-offset: 3px; border-radius: 2px; }
.is-dark :focus-visible, .about :focus-visible, .manifesto :focus-visible, .jobs :focus-visible, .contact :focus-visible,
.es-footer :focus-visible, .es-menu :focus-visible, .es-nav.is-open :focus-visible, .hero :focus-visible, .case-nav :focus-visible { outline-color: var(--es-green); }
.form-group input:focus-visible, .form-group select:focus-visible, .form-group textarea:focus-visible { outline: none; border-color: var(--es-green); }
.es-skip { position: absolute; top: 8px; left: 8px; z-index: 9000; padding: 12px 18px; background: var(--es-black); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; border-radius: var(--es-radius-sm); transform: translateY(-200%); transition: transform var(--es-t); }
.es-skip:focus { transform: none; }
body::after { content: ''; position: fixed; inset: 0; z-index: 8999; pointer-events: none; opacity: 0.038;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 180px 180px; }

/* ── Tipografia utilitária ── */
.es-eyebrow { display: inline-flex; align-items: center; gap: 12px; font-size: var(--es-fib-xs); font-weight: 600; letter-spacing: 0.28em; text-transform: uppercase; color: var(--es-gray-4); }
.es-eyebrow a { border-bottom: 1px solid currentColor; padding-bottom: 1px; }
.es-line { display: block; overflow: hidden; padding: 0.06em 0 0.16em; margin: -0.06em 0 -0.16em; }
.es-line > span { display: block; }
.js .es-line > span { transform: translateY(110%); transition: transform 0.8s var(--es-ease); transition-delay: calc(var(--d, 0) * 100ms); }
.js .is-in .es-line > span, .js .is-in.es-line > span { transform: none; }
.js [data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity 0.6s var(--es-ease), transform 0.6s var(--es-ease); transition-delay: calc(var(--d, 0) * 80ms); }
.js [data-reveal].is-in { opacity: 1; transform: none; }

/* ── Botões ── */
.es-btn { display: inline-flex; align-items: center; gap: 10px; font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; padding: 16px 32px; min-height: 48px; border-radius: var(--es-radius-sm); transition: background var(--es-t), color var(--es-t), transform var(--es-t), box-shadow var(--es-t), border-color var(--es-t); }
.es-btn--primary { color: var(--es-black); background: #fff; }
.es-btn--primary:hover { background: var(--es-green); transform: translateY(-2px); box-shadow: var(--es-shadow-xl); }
.es-btn--ghost { color: #fff; border: 1.5px solid rgba(255,255,255,0.5); padding: 14.5px 30.5px; }
.es-btn--ghost:hover { background: #fff; color: var(--es-black); border-color: #fff; transform: translateY(-2px); }
.es-btn--outline { color: var(--es-black); border: 1.5px solid var(--es-black); padding: 14.5px 30.5px; }
.es-btn--outline:hover { background: var(--es-black); color: #fff; transform: translateY(-2px); }

/* ── Nav: flutua em mix-blend-mode difference, lê em qualquer fundo (preto, branco, coral, aurora) ── */
.es-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 200; display: flex; align-items: center; justify-content: space-between; padding: 0 var(--es-px); height: var(--es-nav-h); color: #fff; mix-blend-mode: difference; transition: transform var(--es-t-slow); }
.es-nav.is-hidden { transform: translateY(-100%); }   /* some ao rolar pra baixo, volta ao rolar pra cima */
.es-nav__logo .es-logo { height: 22px; width: auto; display: block; }
.es-logo__ast { transition: opacity var(--es-t); }
.es-nav.has-docking .es-logo__ast { opacity: 0; }
.es-nav.is-docked .es-logo__ast, .es-nav.is-open .es-logo__ast { opacity: 1; }
.es-nav__center ul { display: flex; align-items: center; gap: 40px; }
.es-nav__center a { display: inline-block; font-size: 10px; font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; position: relative; padding: 17px 0; opacity: 0.72; transition: opacity var(--es-t); }
.es-nav__center a:hover, .es-nav__center a[aria-current] { opacity: 1; }
.es-nav__center a::after { content: ''; position: absolute; bottom: 12px; left: 0; width: 100%; height: 1.5px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform var(--es-t-slow); }
.es-nav__center a:hover::after, .es-nav__center a[aria-current]::after { transform: scaleX(1); }
.es-nav__right { display: flex; align-items: center; gap: 10px; }
.es-nav__lang { font-size: 10px; font-weight: 700; letter-spacing: 0.18em; min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid currentColor; border-radius: var(--es-radius-sm); opacity: 0.72; transition: opacity var(--es-t); }
.es-nav__lang:hover { opacity: 1; }
.es-nav__cta { display: inline-flex; align-items: center; font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #000; background: #fff; padding: 13px 24px; min-height: 44px; border-radius: var(--es-radius-sm); transition: transform var(--es-t), opacity var(--es-t); }
.es-nav__cta:hover { transform: translateY(-1px); opacity: 0.9; }
.es-nav__burger { display: none; width: 44px; height: 44px; align-items: center; justify-content: center; flex-direction: column; gap: 6px; border-radius: var(--es-radius-sm); }
.es-nav__burger span { display: block; width: 22px; height: 2px; background: currentColor; transition: transform var(--es-t-slow), opacity var(--es-t); }
.es-nav.is-open .es-nav__burger span:first-child { transform: translateY(4px) rotate(45deg); }
.es-nav.is-open .es-nav__burger span:last-child { transform: translateY(-4px) rotate(-45deg); }
.es-nav.is-open { color: #fff; mix-blend-mode: normal; }
.es-nav.is-open .es-nav__cta { background: var(--es-green); color: var(--es-black); }
.is-case .es-nav, .is-case .es-nav.is-scrolled { color: #fff; }
.es-menu { position: fixed; inset: 0; z-index: 190; background: var(--es-black); color: #fff; padding: calc(var(--es-nav-h) + 24px) var(--es-px) 32px; display: flex; overflow: auto; }
.es-menu[hidden] { display: none; }
.es-menu__inner { display: flex; flex-direction: column; justify-content: space-between; width: 100%; }
.es-menu__list { display: flex; flex-direction: column; gap: 6px; }
.es-menu__list a { display: block; font-family: var(--es-font-display); font-weight: 800; font-size: clamp(34px, 9vw, 55px); line-height: 1.05; letter-spacing: -0.01em; padding: 6px 0; min-height: 44px; transition: color var(--es-t); }
.es-menu__list a:hover, .es-menu__list a:focus-visible { color: var(--es-green); }
.es-menu__foot { display: flex; flex-direction: column; gap: 6px; padding-top: 32px; font-size: var(--es-fib-sm); }
.es-menu__foot a { color: rgba(255,255,255,0.8); padding: 8px 0; }
.es-menu__foot span { font-family: var(--es-font-serif); color: rgba(255,255,255,0.55); letter-spacing: 0.06em; }
.js .es-menu__list li { opacity: 0; transform: translateY(18px); transition: opacity 0.5s var(--es-ease), transform 0.5s var(--es-ease); transition-delay: calc(var(--i) * 60ms); }
.js .es-menu.is-open .es-menu__list li { opacity: 1; transform: none; }
.es-menu__list li:nth-child(1) { --i: 1; } .es-menu__list li:nth-child(2) { --i: 2; } .es-menu__list li:nth-child(3) { --i: 3; } .es-menu__list li:nth-child(4) { --i: 4; } .es-menu__list li:nth-child(5) { --i: 5; }
body.is-menu-open { overflow: hidden; }
body.is-menu-open .hero__ast.is-live { visibility: hidden; }

/* ── Cursor da marca ── */
.es-cursor { position: fixed; top: 0; left: 0; z-index: 9999; width: 18px; height: 18px; margin: -9px 0 0 -9px; color: #fff; mix-blend-mode: difference; pointer-events: none; transition: transform 0.2s var(--es-ease); will-change: transform; }
.es-cursor svg { width: 100%; height: 100%; animation: es-spin 30s linear infinite; }
.es-cursor.is-hover { transform: scale(1.55); }
.es-cursor.is-hidden { opacity: 0; }
html.has-cursor, html.has-cursor a, html.has-cursor button, html.has-cursor label, html.has-cursor select { cursor: none; }
html.has-cursor input, html.has-cursor textarea { cursor: text; }
@keyframes es-spin { to { transform: rotate(360deg); } }

/* ═══ HERO ═══ */
.hero { position: relative; min-height: 100svh; display: grid; grid-template-columns: 1fr 1fr; align-items: center; padding: calc(var(--es-nav-h) + 20px) var(--es-px) 80px; background: var(--es-black); color: #fff; overflow: hidden; isolation: isolate; }
/* fallback estático do aurora: exceção sancionada pelo manual (a capa holográfica) */
.hero::before { content: ''; position: absolute; inset: -10%; z-index: -1; opacity: 0.9;
  background: radial-gradient(ellipse 60% 70% at 20% 30%, rgba(0,69,190,0.85), transparent 60%),
              radial-gradient(ellipse 50% 60% at 80% 25%, rgba(2,172,255,0.7), transparent 60%),
              radial-gradient(ellipse 60% 50% at 75% 80%, rgba(0,195,96,0.55), transparent 60%),
              radial-gradient(ellipse 55% 45% at 25% 85%, rgba(227,128,124,0.75), transparent 60%),
              radial-gradient(ellipse 40% 40% at 55% 60%, rgba(245,197,120,0.6), transparent 60%);
  filter: blur(40px); }
.hero__aurora { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; }
.hero.has-webgl::before { opacity: 0; }
.hero__inner { position: relative; z-index: 1; max-width: 640px; }
.hero__eyebrow { color: rgba(255,255,255,0.75); margin-bottom: 44px; }
.es-pulse-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--es-green); box-shadow: 0 0 0 3px rgba(0,195,96,0.18); animation: es-pulse 2.4s ease-in-out infinite; }
@keyframes es-pulse { 0%,100% { box-shadow: 0 0 0 3px rgba(0,195,96,0.18); } 50% { box-shadow: 0 0 0 7px rgba(0,195,96,0.08); } }
.hero__headline { font-family: var(--es-font-display); font-weight: 800; font-size: clamp(var(--es-fib-xl), 7.5vw, var(--es-fib-2xl)); line-height: 0.88; letter-spacing: -0.02em; margin-bottom: 32px; text-wrap: balance; }
.hero__headline em { font-size: 0.96em; letter-spacing: 0.02em; }
.hero__subline { font-family: var(--es-font-serif); font-size: var(--es-fib-md); letter-spacing: 0.06em; color: rgba(255,255,255,0.7); margin-bottom: 52px; }
.hero__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero__mark { display: flex; align-items: center; justify-content: center; min-height: var(--ast); position: relative; z-index: 1; }
.hero__ast { width: var(--ast); height: var(--ast); color: #fff; }
.hero__ast:not(.is-live) { animation: es-spin 30s linear infinite; }
.hero__ast.is-live { position: fixed; top: 0; left: 0; z-index: 210; pointer-events: none; will-change: transform; transform-origin: 50% 50%; mix-blend-mode: difference; }
.hero__scroll { position: absolute; bottom: 36px; left: var(--es-px); display: flex; align-items: center; gap: 14px; font-size: 10px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.6); }
.hero__scroll-line { width: 36px; height: 1px; background: rgba(255,255,255,0.4); position: relative; overflow: hidden; }
.hero__scroll-line::after { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: #fff; animation: es-scrolln 2s ease-in-out infinite; }
@keyframes es-scrolln { 0% { left: -100%; } 50% { left: 0; } 100% { left: 100%; } }

/* ═══ SUMÁRIO FIXO ═══ */
.toc { position: fixed; left: var(--es-px); top: 50%; transform: translateY(-50%); z-index: 150; opacity: 0; pointer-events: none; transition: opacity var(--es-t-slow); mix-blend-mode: difference; color: #fff; }
.toc.is-visible { opacity: 1; pointer-events: auto; }
.toc__list { display: flex; flex-direction: column; gap: 10px; }
.toc a { display: flex; align-items: center; gap: 12px; font-size: 10px; font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; opacity: 0.45; transition: opacity var(--es-t); min-height: 28px; }
.toc a:hover, .toc a.is-active { opacity: 1; }
.toc a:hover .toc__t, .toc a.is-active .toc__t { transform: translateX(6px); }
.toc__n { font-family: var(--es-font-cond); font-weight: 800; font-size: 11px; }
.toc__t { position: relative; transition: transform var(--es-t); }
.toc__t::after { content: ''; position: absolute; left: 0; bottom: -3px; width: 100%; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform var(--es-t-slow); }
.toc a.is-active .toc__t::after { transform: scaleX(1); }

/* ═══ O CAMPO ═══ */
.field { position: relative; }
.field__head { padding: 116px var(--es-px) 40px; max-width: var(--es-max-w); margin: 0 auto; }
.field__heading { font-family: var(--es-font-cond); font-weight: 700; font-size: clamp(var(--es-fib-lg), 4.6vw, var(--es-fib-xl)); line-height: 0.93; letter-spacing: 0.02em; margin-top: 14px; }
.field__heading em { font-size: 1.06em; letter-spacing: 0.04em; }
.ch { position: relative; min-height: 100svh; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; padding: 100px var(--es-px) 100px calc(var(--es-px) + var(--toc-w, 0px)); overflow: hidden; isolation: isolate; color: var(--es-black); background: #fff; }
@media (min-width: 1101px) { :root { --toc-w: 220px; } }
.ch__stage { position: absolute; inset: 0; z-index: 0; display: flex; align-items: center; justify-content: flex-end; padding-right: 6vw; pointer-events: none; }
.ch__ast { width: clamp(280px, 46vw, 760px); height: auto; color: var(--pr); }
.ch--outline .ch__ast { fill: none; stroke: currentColor; stroke-width: 1.25; }
.ch--blur .ch__ast { filter: blur(clamp(10px, 2.2vw, 34px)); }
.ch--petal, .ch--mesh { background: var(--pr); }
.ch--petal .ch__ast { color: #fff; }
.ch--mesh .ch__ast { color: var(--es-black); }
.ch--outline, .ch--blur { background: var(--es-black); color: #fff; }
.ch__inner { position: relative; z-index: 1; max-width: 560px; }
.ch__eyebrow { color: inherit; opacity: 0.7; margin-bottom: 28px; }
.ch__copy { font-family: var(--es-font-display); font-weight: 800; font-size: clamp(44px, 7vw, 120px); line-height: 0.9; letter-spacing: -0.01em; margin-bottom: 28px; text-wrap: balance; }
.ch__copy em { font-size: 0.98em; letter-spacing: 0.02em; }
.ch__desc { font-size: var(--es-fib-sm); line-height: 1.85; max-width: 420px; opacity: 0.8; margin-bottom: 36px; }
.ch__deliver { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 28px; margin: 0 0 32px; max-width: 560px; }
.ch__deliver li { display: flex; align-items: baseline; gap: 10px; font-size: var(--es-fib-sm); line-height: 1.5; }
.ch__deliver li::before { content: '*'; font-family: var(--es-font-cond); font-weight: 800; color: var(--pr); flex-shrink: 0; }
.ch--petal .ch__deliver li::before, .ch--mesh .ch__deliver li::before { color: currentColor; }
.ch__edge { font-family: var(--es-font-serif); font-size: var(--es-fib-md); line-height: 1.35; letter-spacing: 0.02em; max-width: 480px; }

/* ═══ /work/ — lista editorial dos 53 ═══ */
.wk { padding: calc(var(--es-nav-h) + 80px) var(--es-px) 116px; background: #fff; max-width: calc(var(--es-max-w) + 2 * var(--es-px)); margin: 0 auto; }
.wk__heading { font-family: var(--es-font-display); font-weight: 800; font-size: clamp(var(--es-fib-xl), 8vw, var(--es-fib-3xl)); line-height: 0.88; letter-spacing: -0.02em; margin: 14px 0 20px; }
.wk__heading em { font-size: 0.96em; letter-spacing: 0.02em; }
.wk__total { font-family: var(--es-font-serif); font-size: 0.4em; color: var(--es-gray-4); vertical-align: super; margin-left: 6px; }
.wk__sub { font-size: 15px; line-height: 1.7; color: var(--es-gray-4); max-width: 560px; margin-bottom: 40px; }
.wk__filters { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding-bottom: 28px; border-bottom: 1px solid var(--es-gray-2); }
.wk__filter { display: inline-flex; align-items: center; gap: 8px; font-size: 10px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; padding: 0 16px; min-height: 44px; border: 1px solid var(--es-gray-2); border-radius: var(--es-radius-pill); color: var(--es-gray-4); transition: background var(--es-t), color var(--es-t), border-color var(--es-t); }
.wk__filter-n { font-family: var(--es-font-cond); font-weight: 800; opacity: 0.6; }
.wk__filter:hover { border-color: var(--es-black); color: var(--es-black); }
.wk__filter.is-active { background: var(--es-black); border-color: var(--es-black); color: #fff; }
.wk__year { display: inline-flex; align-items: center; gap: 10px; margin-left: auto; }
.wk__year select { font-family: inherit; font-size: 11px; font-weight: 700; letter-spacing: 0.1em; min-height: 44px; padding: 0 14px; border: 1px solid var(--es-gray-2); border-radius: var(--es-radius-sm); background: #fff; color: var(--es-black); }
.wk-row { border-bottom: 1px solid var(--es-gray-2); }
.wk-row.is-hidden { display: none; }
.wk-row__link { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto auto 44px; align-items: center; gap: 24px; padding: 22px 0; color: var(--es-black); }
.wk-row__index { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; color: var(--es-gray-4); font-variant-numeric: tabular-nums; transition: color var(--es-t); }
.wk-row__title { font-family: var(--es-font-cond); font-weight: 700; font-size: clamp(24px, 3vw, 44px); letter-spacing: 0.01em; line-height: 1; transition: transform 0.4s var(--es-ease); overflow-wrap: anywhere; }
.wk-row__tags { font-family: var(--es-font-serif); font-size: var(--es-fib-sm); color: var(--es-gray-4); letter-spacing: 0.04em; white-space: nowrap; transition: color var(--es-t); }
.wk-row__year { font-size: 11px; font-weight: 600; letter-spacing: 0.14em; color: var(--es-gray-4); transition: color var(--es-t); }
.wk-row__arrow { width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid var(--es-gray-2); display: flex; align-items: center; justify-content: center; transition: border-color var(--es-t), background var(--es-t), color var(--es-t), transform 0.4s var(--es-ease); }
.wk-row__link:hover .wk-row__index { color: var(--es-blue); }
.wk-row__link:hover .wk-row__title { transform: translateX(8px); }
.wk-row__link:hover .wk-row__tags, .wk-row__link:hover .wk-row__year { color: var(--es-black); }
.wk-row__link:hover .wk-row__arrow { background: var(--es-black); border-color: var(--es-black); color: #fff; transform: rotate(45deg); }
.wk__empty { padding: 48px 0; font-family: var(--es-font-serif); font-size: var(--es-fib-md); color: var(--es-gray-4); }
/* preview da capa que segue o cursor (desktop) */
.wk-preview { position: fixed; top: 0; left: 0; width: 240px; aspect-ratio: 3/4; border-radius: 3px; overflow: hidden; pointer-events: none; z-index: 150; opacity: 0; transform: scale(0.88) rotate(-2deg); transition: opacity 0.25s var(--es-ease), transform 0.25s var(--es-ease); box-shadow: var(--es-shadow-xl); background: var(--es-black); }
.wk-preview.is-visible { opacity: 1; transform: scale(1) rotate(0deg); }
.wk-preview img { width: 100%; height: 100%; object-fit: cover; }

/* ═══ ABOUT / DATA DRIVEN + STATS ═══ */
.about { background: var(--es-black-2); color: #fff; padding: 116px var(--es-px) 0; position: relative; overflow: hidden; }
.about__bg-ast { position: absolute; top: -15%; left: -8%; width: 55%; height: auto; opacity: 0.035; color: #fff; animation: es-spin 60s linear infinite reverse; }
.about__inner { max-width: var(--es-max-w); margin: 0 auto; display: grid; grid-template-columns: 1.1fr 1fr; gap: 80px; align-items: center; position: relative; padding-bottom: 116px; }
.about__headline { font-family: var(--es-font-display); font-weight: 800; font-size: clamp(var(--es-fib-xl), 10vw, var(--es-fib-3xl)); line-height: 0.85; letter-spacing: 0.01em; }
.about__green { color: var(--es-green); display: block; }
.about__label { font-size: var(--es-fib-xs); font-weight: 600; letter-spacing: 0.28em; text-transform: uppercase; color: var(--es-green); margin-bottom: 20px; }
.about__body { font-size: var(--es-fib-sm); line-height: 1.85; font-weight: 300; color: rgba(255,255,255,0.58); margin-bottom: 36px; }
.about__author { display: flex; align-items: center; gap: 14px; font-family: var(--es-font-serif); font-size: var(--es-fib-sm); color: rgba(255,255,255,0.5); }
.about__author-line { width: 28px; height: 1px; background: rgba(255,255,255,0.3); }
.stats { max-width: var(--es-max-w); margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(255,255,255,0.06); }
.stat { padding: 52px 40px; border-right: 1px solid rgba(255,255,255,0.06); }
.stat:first-child { padding-left: 0; } .stat:last-child { padding-right: 0; border-right: none; }
.stat__num { font-family: var(--es-font-display); font-size: clamp(var(--es-fib-xl), 5.5vw, var(--es-fib-2xl)); font-weight: 800; line-height: 0.88; display: block; margin-bottom: 12px; font-variant-numeric: tabular-nums; }
.stat__num em { font-size: 0.85em; color: var(--es-green); }
.stat__label { font-size: var(--es-fib-xs); font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; color: rgba(255,255,255,0.55); }

/* ═══ MANIFESTO ═══ */
.manifesto { background: var(--es-black); color: #fff; padding: 128px var(--es-px); text-align: center; position: relative; overflow: hidden; }
.manifesto::before { content: ''; position: absolute; top: 0; left: var(--es-px); right: var(--es-px); height: 1px; background: rgba(245,197,120,0.25); }
.manifesto__bg { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; overflow: hidden; }
.manifesto__bg-ast { width: 82%; max-width: 720px; height: auto; opacity: 0.04; color: #fff; animation: es-spin 44s linear infinite reverse; }
.manifesto__inner { position: relative; z-index: 1; }
.manifesto__label { font-size: var(--es-fib-xs); font-weight: 600; letter-spacing: 0.28em; text-transform: uppercase; color: rgba(245,197,120,0.85); margin-bottom: 32px; }
.manifesto__headline { font-family: var(--es-font-display); font-weight: 800; font-size: clamp(var(--es-fib-xl), 8vw, var(--es-fib-3xl)); line-height: 0.88; letter-spacing: 0.01em; }
.manifesto__headline .es-line:first-child { color: var(--es-yellow); }
.manifesto__sub { font-family: var(--es-font-serif); font-size: var(--es-fib-md); letter-spacing: 0.06em; color: rgba(255,255,255,0.5); margin-top: 36px; }

/* ═══ JOBS ═══ */
.jobs { background: var(--es-black); color: #fff; padding: 116px var(--es-px); position: relative; overflow: hidden; }
.jobs::before { content: ''; position: absolute; top: 0; left: var(--es-px); right: var(--es-px); height: 1px; background: rgba(255,255,255,0.07); }
.jobs__bg-ast { position: absolute; bottom: -10%; right: -6%; width: 340px; height: auto; opacity: 0.028; color: #fff; animation: es-spin 52s linear infinite; pointer-events: none; }
.jobs__inner { max-width: var(--es-max-w); margin: 0 auto; position: relative; }
.jobs__header { margin-bottom: 64px; }
.jobs__eyebrow { color: rgba(0,195,96,0.9); margin-bottom: 14px; }
.jobs__heading { font-family: var(--es-font-cond); font-weight: 700; font-size: clamp(var(--es-fib-lg), 4.6vw, var(--es-fib-xl)); line-height: 0.93; letter-spacing: 0.02em; }
.jobs__heading em { font-size: 1.06em; color: var(--es-green); }
.jobs__sub { font-size: var(--es-fib-sm); line-height: 1.82; color: rgba(255,255,255,0.58); max-width: 520px; margin-top: 24px; }
.job { border-top: 1px solid rgba(255,255,255,0.08); }
.job:last-child { border-bottom: 1px solid rgba(255,255,255,0.08); }
.job h3 { margin: 0; font: inherit; }
.job__trigger { width: 100%; display: flex; align-items: center; gap: 20px; padding: 28px 0; text-align: left; color: inherit; }
.job__trigger:hover .job__title, .job__trigger:focus-visible .job__title { color: var(--es-green); }
.job__num { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; color: rgba(255,255,255,0.3); min-width: 28px; }
.job__title { font-family: var(--es-font-cond); font-size: clamp(var(--es-fib-md), 2.2vw, var(--es-fib-lg)); font-weight: 800; letter-spacing: 0.03em; flex: 1; transition: color var(--es-t); }
.job__meta { display: flex; align-items: center; gap: 8px; }
.job__tag { font-size: 10px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; padding: 5px 12px; border-radius: var(--es-radius-pill); border: 1px solid rgba(255,255,255,0.26); color: rgba(255,255,255,0.62); white-space: nowrap; }
.job__icon { width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.26); display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,0.62); transition: background var(--es-t), border-color var(--es-t), color var(--es-t), transform 0.35s var(--es-ease); flex-shrink: 0; }
.job.is-open .job__icon { transform: rotate(45deg); background: var(--es-green); border-color: var(--es-green); color: var(--es-black); }
.job__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.38s var(--es-ease); }
.job.is-open .job__panel { grid-template-rows: 1fr; }
.job__panel-inner { overflow: hidden; }
.job__body { padding: 0 0 40px 48px; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 32px; }
.job__desc { font-size: var(--es-fib-sm); line-height: 1.88; color: rgba(255,255,255,0.62); max-width: 580px; }
.job__desc strong { color: rgba(255,255,255,0.85); font-weight: 600; }
.job__apply { display: inline-flex; align-items: center; gap: 10px; font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--es-black); background: var(--es-green); padding: 14px 28px; min-height: 44px; border-radius: var(--es-radius-sm); transition: background var(--es-t), transform var(--es-t); }
.job__apply:hover { background: #fff; transform: translateY(-2px); }

/* ═══ CONTACT ═══ */
.contact { background: var(--es-black); color: #fff; padding: 120px var(--es-px); position: relative; }
.contact::before { content: ''; position: absolute; top: 0; left: var(--es-px); right: var(--es-px); height: 1px; background: rgba(255,255,255,0.07); }
.contact__inner { max-width: var(--es-max-w); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.contact__eyebrow { color: rgba(0,195,96,0.9); margin-bottom: 14px; }
.contact__heading { font-family: var(--es-font-display); font-weight: 800; font-size: clamp(var(--es-fib-xl), 5vw, var(--es-fib-2xl)); line-height: 0.9; letter-spacing: -0.02em; margin-bottom: 28px; }
.contact__heading em { color: var(--es-green); font-size: 0.96em; }
.contact__sub { font-size: var(--es-fib-sm); line-height: 1.85; color: rgba(255,255,255,0.58); max-width: 380px; margin-bottom: 52px; }
.contact__info { display: flex; flex-direction: column; gap: 16px; }
.contact__info-item { display: flex; align-items: center; gap: 14px; font-size: var(--es-fib-sm); color: rgba(255,255,255,0.62); }
.contact__info-item a { color: rgba(255,255,255,0.8); transition: color var(--es-t); }
.contact__info-item a:hover { color: var(--es-green); }
.contact__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--es-green); flex-shrink: 0; }
.contact__form { display: flex; flex-direction: column; gap: 20px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-group { display: flex; flex-direction: column; gap: 8px; }
.form-group label { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.55); }
.form-group input, .form-group select, .form-group textarea { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--es-radius-sm); color: #fff; font-family: inherit; font-size: var(--es-fib-sm); padding: 16px 18px; outline: none; transition: border-color var(--es-t), background var(--es-t); -webkit-appearance: none; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color: rgba(0,195,96,0.5); background: rgba(255,255,255,0.07); }
.form-group input::placeholder, .form-group textarea::placeholder { color: rgba(255,255,255,0.45); }
.form-group textarea { resize: vertical; min-height: 120px; line-height: 1.65; }
.form-group select option { background: var(--es-black); color: #fff; }
.es-form-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-submit { display: inline-flex; align-items: center; gap: 12px; font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--es-black); background: var(--es-green); padding: 18px 40px; min-height: 48px; border-radius: var(--es-radius-sm); align-self: flex-start; transition: background var(--es-t), transform var(--es-t); }
.form-submit:hover { background: #fff; transform: translateY(-2px); }
.form-submit[disabled] { opacity: 0.6; cursor: default; transform: none; }
.form-note { font-size: 11px; color: rgba(255,255,255,0.5); font-family: var(--es-font-serif); }
.form-note.is-error { color: var(--es-coral); } .form-note.is-ok { color: var(--es-green); }

/* ═══ FOOTER ═══ */
.es-footer { background: var(--es-black); color: #fff; padding: 80px var(--es-px) 44px; }
.es-footer__top { display: grid; grid-template-columns: 2fr 1fr 1fr 1.2fr; gap: 48px; padding-bottom: 60px; border-bottom: 1px solid rgba(255,255,255,0.07); margin-bottom: 32px; }
.es-footer__logo { display: inline-block; margin-bottom: 16px; color: #fff; }
.es-footer__logo .es-logo { height: 26px; width: auto; display: block; }
.es-footer__tagline { font-family: var(--es-font-serif); font-size: var(--es-fib-sm); color: rgba(255,255,255,0.5); line-height: 1.7; max-width: 220px; margin-bottom: 24px; }
.es-footer__socials { display: flex; gap: 10px; }
.es-footer__social { width: 44px; height: 44px; border-radius: var(--es-radius-sm); border: 1px solid rgba(255,255,255,0.1); display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,0.65); transition: border-color var(--es-t), color var(--es-t), background var(--es-t), transform var(--es-t); }
.es-footer__social:hover { border-color: var(--es-green); color: var(--es-green); background: rgba(0,195,96,0.07); transform: translateY(-2px); }
.es-footer__col-title { font-size: 9px; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; color: rgba(255,255,255,0.5); margin-bottom: 24px; }
.es-footer__links { display: flex; flex-direction: column; gap: 11px; }
.es-footer__links a { display: inline-block; padding: 6px 0; margin: -6px 0; }
.es-footer__links a, .es-footer__links span { font-size: 13px; color: rgba(255,255,255,0.7); line-height: 1.5; }
.es-footer__links a:hover { color: #fff; }
.es-footer__bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.es-footer__copy, .es-footer__made { font-size: 11px; color: rgba(255,255,255,0.5); }
.es-footer__made span { color: var(--es-green); }
/* o link 'secreto' do briefing: um asterisco apagado no canto; acende no hover/foco */
.es-footer__secret { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: -12px -12px -12px 0; color: rgba(255,255,255,0.14); transition: color var(--es-t), transform 0.6s var(--es-ease); }
.es-footer__secret:hover, .es-footer__secret:focus-visible { color: var(--es-green); transform: rotate(60deg); }
.es-footer__secret-ast { width: 14px; height: 14px; }

/* ═══ CASE ═══ */
.case-hero { position: relative; min-height: 100svh; display: flex; align-items: center; padding: calc(var(--es-nav-h) + 40px) var(--es-px) 72px; background: var(--es-black); color: #fff; overflow: hidden; isolation: isolate; }
.case-hero__inner { position: relative; z-index: 1; max-width: var(--es-max-w); width: 100%; margin: 0 auto; display: grid; grid-template-columns: 1.15fr 1fr; gap: 64px; align-items: center; }
.case-hero__eyebrow { color: rgba(255,255,255,0.8); margin-bottom: 28px; }
.case-hero__text { container-type: inline-size; }
/* título escala com a largura da própria coluna: 11cqi cabe ~12 letras de Wesker Expanded numa linha; só palavras maiores quebram */
.case-hero__title { font-family: var(--es-font-display); font-weight: 800; font-size: clamp(34px, 11cqi, 96px); line-height: 0.9; letter-spacing: -0.02em; margin-bottom: 40px; text-wrap: balance; overflow-wrap: anywhere; }
.case-meta { display: flex; flex-wrap: wrap; gap: 28px 48px; }
.case-meta dt { font-size: var(--es-fib-xs); font-weight: 600; letter-spacing: 0.28em; text-transform: uppercase; color: rgba(255,255,255,0.6); margin-bottom: 8px; }
.case-meta dd { font-size: var(--es-fib-sm); font-weight: 500; }
.case-hero__media { position: relative; aspect-ratio: 3/4; max-height: 78svh; margin: 0 0 0 auto; width: 100%; overflow: hidden; border-radius: 2px; background: var(--es-black-2); }
.case-hero__img { width: 100%; height: 100%; object-fit: cover; }
.case-hero__ast { position: absolute; right: -8%; bottom: -14%; width: 40vw; height: auto; color: var(--pr); opacity: 0.16; z-index: 0; animation: es-spin 60s linear infinite; pointer-events: none; }
.case-body { padding: 116px var(--es-px); background: #fff; }
.case-body__inner { max-width: var(--es-case-w); margin: 0 auto; display: flex; flex-direction: column; gap: 40px; }
.case-summary { font-family: var(--es-font-serif); font-size: clamp(var(--es-fib-md), 2.4vw, 30px); line-height: 1.4; letter-spacing: 0.01em; color: var(--es-black); max-width: 820px; margin-bottom: 24px; }
.case-h2 { font-family: var(--es-font-cond); font-weight: 700; font-size: clamp(var(--es-fib-lg), 3.6vw, var(--es-fib-xl)); line-height: 0.95; letter-spacing: 0.02em; margin-top: 56px; }
.case-p { font-size: 15px; line-height: 1.85; color: var(--es-gray-4); max-width: 720px; }
.case-img img, .case-video iframe { width: 100%; height: auto; border-radius: 2px; background: var(--es-gray-1); display: block; }
.case-video { aspect-ratio: 16/9; background: var(--es-black); border-radius: 2px; overflow: hidden; }
.case-video iframe { height: 100%; border: 0; }
.case-gallery { display: grid; gap: 3px; grid-template-columns: repeat(2, 1fr); }
.case-gallery--1 { grid-template-columns: 1fr; }
.case-gallery--3 { grid-template-columns: repeat(3, 1fr); }
.case-gallery .case-img img { height: 100%; object-fit: cover; }
.case-credits { font-family: var(--es-font-serif); font-size: var(--es-fib-sm); line-height: 1.9; color: var(--es-gray-4); letter-spacing: 0.04em; padding-top: 24px; border-top: 1px solid var(--es-gray-2); }
.case-nav { display: grid; grid-template-columns: 1fr 1fr; background: var(--es-black); color: #fff; }
.case-nav__link { display: flex; flex-direction: column; gap: 14px; padding: 72px var(--es-px); border-right: 1px solid rgba(255,255,255,0.07); transition: background var(--es-t-slow); }
.case-nav__link:last-child { border-right: none; text-align: right; align-items: flex-end; }
.case-nav__link:hover { background: var(--es-black-2); }
.case-nav__link .es-eyebrow { color: rgba(255,255,255,0.6); }
.case-nav__title { font-family: var(--es-font-cond); font-weight: 800; font-size: clamp(var(--es-fib-md), 3vw, var(--es-fib-xl)); letter-spacing: 0.02em; line-height: 1; }
.case-source { padding: 24px var(--es-px); background: var(--es-black); color: rgba(255,255,255,0.6); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; text-align: center; }
.case-source a { border-bottom: 1px solid currentColor; padding-bottom: 2px; }

/* ═══ VIEW TRANSITIONS (home ⇄ case) ═══ */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 0.45s; animation-timing-function: var(--es-ease); }
::view-transition-group(*) { animation-duration: 0.6s; animation-timing-function: var(--es-ease); }

/* ═══ RESPONSIVO ═══ */
@media (max-width: 1100px) {
  :root { --es-px: 40px; }
  .case-hero__inner { grid-template-columns: 1fr 1fr; gap: 40px; }
  .case-gallery--3 { grid-template-columns: repeat(2, 1fr); }
  .hero { grid-template-columns: 1fr; padding-bottom: 80px; }
  .ch { grid-template-columns: 1fr; }
  .ch__stage { justify-content: center; padding-right: 0; opacity: 0.5; }
  .wk-row__link { grid-template-columns: 28px minmax(0, 1fr) auto 44px; }
  .wk-row__tags { display: none; }
  .about__inner, .contact__inner { grid-template-columns: 1fr; gap: 48px; }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .stat { border-bottom: 1px solid rgba(255,255,255,0.06); }
  .es-footer__top { grid-template-columns: 1fr 1fr; }
  .toc { display: none; }
}
@media (max-width: 860px) {
  .es-nav__center { display: none; }
  .es-nav__burger { display: flex; }
}
@media (max-width: 700px) {
  :root { --es-px: 20px; --es-nav-h: 60px; }
  .es-nav__cta { display: none; }
  .hero { padding-top: calc(var(--es-nav-h) + 40px); }
  .ch { min-height: auto; padding: 80px var(--es-px); }
  .ch__ast { width: 70vw; }
  .ch--blur .ch__ast { filter: blur(14px); }
  .wk-row__link { grid-template-columns: 24px minmax(0, 1fr) 44px; gap: 14px; padding: 18px 0; }
  .wk-row__year { display: none; }
  .wk-row__title { font-size: 20px; line-height: 1.1; }
  .wk__year { margin-left: 0; }
  .ch__deliver { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .job__trigger { flex-wrap: wrap; gap: 12px 16px; }
  .job__title { flex: 1 1 0; min-width: 0; }
  .job__meta { order: 3; width: 100%; padding-left: 44px; }
  .job__body { grid-template-columns: 1fr; padding-left: 44px; }
  .stats { grid-template-columns: 1fr 1fr; }
  .es-footer__top { grid-template-columns: 1fr; }
  .case-hero { min-height: auto; padding-bottom: 48px; }
  .case-hero__inner { grid-template-columns: 1fr; gap: 36px; }
  .case-hero__media { max-height: 60svh; aspect-ratio: 4/5; }
  .case-meta { gap: 20px 32px; }
  .case-gallery, .case-gallery--3 { grid-template-columns: 1fr; }
  .case-nav { grid-template-columns: 1fr; }
  .case-nav__link { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.07); padding: 40px var(--es-px); }
  .case-nav__link:last-child { text-align: left; align-items: flex-start; }
}

/* ═══ REDUCED MOTION ═══ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  html { scroll-behavior: auto; }
  .js [data-reveal], .js .es-line > span { opacity: 1; transform: none; }
  /* aurora.js desenha 1 frame estático e não anima */
  ::view-transition-group(*), ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}