/* Layout: cinema noturno — grafite profundo, mármore claro em contraponto, bordô como fio condutor.
   Visual único e deliberado (não alterna com o tema do sistema). */
:root {
  --night: #15171a;
  --night-2: #1d2024;
  --night-3: #272b30;
  --graphite: #3d4146;
  --bordo: #7a1f25;
  --bordo-hi: #a33a41;
  --bordo-soft: #c98a8e;
  --marble: #eeebe6;
  --marble-2: #e3dfd8;
  --paper: #f8f6f2;
  --ink: #17191c;
  --ink-2: #4a4f56;
  --mist: #a9adb3;
  --mist-2: #7d8289;
  --line-d: rgb(255 255 255 / 0.1);
  --line-l: rgb(23 25 28 / 0.12);

  --f-display: 'Bodoni Moda', 'Didot', 'Bodoni 72', Georgia, serif;
  --f-body: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  --gutter: clamp(16px, 4vw, 56px);
  --max: 1320px;
  --ease: cubic-bezier(0.22, 0.8, 0.2, 1);
  --shadow-deep: 0 40px 80px -30px rgb(0 0 0 / 0.65), 0 18px 36px -18px rgb(0 0 0 / 0.5);
  --shadow-soft: 0 24px 48px -28px rgb(20 10 10 / 0.35);
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--night);
  color: #ecebe8;
  font-family: var(--f-body);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--bordo-soft); outline-offset: 3px; }
::selection { background: var(--bordo); color: #fff; }

/* ---------- Transições de página (navegação entre documentos) ---------- */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: vt-out 420ms var(--ease) both; }
::view-transition-new(root) { animation: vt-in 620ms var(--ease) both; }
::view-transition-old(site-header), ::view-transition-new(site-header) { animation: none; }
@keyframes vt-out { to { opacity: 0; transform: translateY(-24px) scale(0.985); filter: blur(4px); } }
@keyframes vt-in { from { opacity: 0; transform: translateY(32px); clip-path: inset(12% 0 0 0); } }
::view-transition-group(curso-hero), ::view-transition-group(artigo-hero) { animation-duration: 700ms; animation-timing-function: var(--ease); }

/* Cortina de abertura */
.curtain {
  position: fixed; inset: 0; z-index: 100; pointer-events: none;
  background: var(--night);
  animation: curtain 1100ms var(--ease) 150ms forwards;
}
.curtain::after {
  content: ''; position: absolute; left: 0; top: 50%; height: 1px; width: 100%;
  background: var(--bordo-hi); transform-origin: left; transform: scaleX(0);
  animation: line 700ms var(--ease) forwards;
}
@keyframes line { to { transform: scaleX(1); } }
@keyframes curtain { 0% { clip-path: inset(0 0 0 0); } 100% { clip-path: inset(0 0 100% 0); visibility: hidden; } }

/* ---------- Estrutura ---------- */
.wrap { width: min(100%, var(--max)); margin-inline: auto; padding-inline: var(--gutter); }
.section { padding-block: clamp(72px, 9vw, 140px); position: relative; }
.light { background: var(--paper); color: var(--ink); color-scheme: light; }
.marble { background: var(--marble); color: var(--ink); color-scheme: light; }

.kicker {
  display: inline-flex; align-items: center; gap: 12px;
  font: 500 11px/1 var(--f-mono); letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--bordo-soft); margin: 0 0 22px;
}
.kicker::before { content: ''; width: 28px; height: 1px; background: currentColor; }
.light .kicker, .marble .kicker { color: var(--bordo); }

.display {
  font-family: var(--f-display); font-weight: 400; letter-spacing: -0.02em;
  line-height: 1.02; margin: 0; text-wrap: balance;
}
.display em { font-style: italic; color: var(--bordo-soft); }
.light .display em, .marble .display em { color: var(--bordo); }
.h2 { font-size: clamp(2.3rem, 1.4rem + 3.6vw, 4.6rem); }
.h3 { font-family: var(--f-display); font-weight: 500; font-size: clamp(1.35rem, 1.1rem + 0.8vw, 1.8rem); line-height: 1.15; margin: 0; letter-spacing: -0.01em; text-wrap: balance; }
.meta { font: 500 11.5px/1.4 var(--f-mono); letter-spacing: 0.12em; text-transform: uppercase; color: var(--mist); }
.light .meta, .marble .meta { color: var(--mist-2); }
.lede { font-size: clamp(1.05rem, 1rem + 0.3vw, 1.2rem); color: var(--mist); max-width: 34rem; margin: 0; }
.light .lede, .marble .lede { color: var(--ink-2); }

.head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 24px 48px; margin-bottom: clamp(36px, 5vw, 64px); }
.head > div { min-width: 0; max-width: 46rem; }

/* ---------- Botões ---------- */
.btn {
  position: relative; display: inline-flex; align-items: center; gap: 14px;
  min-height: 52px; padding: 0 26px; border-radius: 999px;
  font: 600 13px/1 var(--f-body); letter-spacing: 0.06em; text-transform: uppercase; text-decoration: none;
  background: var(--bordo); color: #fff; border: 1px solid var(--bordo);
  overflow: hidden; isolation: isolate; cursor: pointer;
  transition: transform 400ms var(--ease), box-shadow 400ms var(--ease);
  box-shadow: 0 14px 30px -14px rgb(122 31 37 / 0.8);
}
.btn::before {
  content: ''; position: absolute; inset: 0; z-index: -1; background: var(--bordo-hi);
  transform: translateY(101%); transition: transform 500ms var(--ease);
}
.btn:hover::before { transform: none; }
.btn:hover { transform: translateY(-2px); }
.btn .ar { transition: transform 400ms var(--ease); }
.btn:hover .ar { transform: translateX(4px); }
.btn--ghost { background: transparent; border-color: rgb(255 255 255 / 0.28); box-shadow: none; }
.btn--ghost::before { background: rgb(255 255 255 / 0.08); }
.light .btn--ghost, .marble .btn--ghost { color: var(--ink); border-color: var(--line-l); }
.light .btn--ghost::before, .marble .btn--ghost::before { background: rgb(23 25 28 / 0.05); }

.link { display: inline-flex; gap: 10px; align-items: center; font: 600 12.5px/1 var(--f-body); letter-spacing: 0.08em; text-transform: uppercase; text-decoration: none; padding-bottom: 6px; background: linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat; transition: background-size 500ms var(--ease); }
.link:hover { background-size: 30% 1px; }

.chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; font: 500 10.5px/1 var(--f-mono); letter-spacing: 0.14em; text-transform: uppercase; border: 1px solid currentColor; }
.chip--example { color: #e7c277; border-color: rgb(231 194 119 / 0.5); background: rgb(231 194 119 / 0.08); }
.light .chip--example, .marble .chip--example { color: #8a6416; background: #fbf1da; border-color: #e5cc93; }

/* ---------- Cabeçalho ---------- */
.site-header {
  view-transition-name: site-header;
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  padding-top: env(safe-area-inset-top, 0px);
  transition: background 500ms var(--ease), backdrop-filter 500ms, border-color 500ms;
  border-bottom: 1px solid transparent;
}
.site-header.scrolled { background: rgb(21 23 26 / 0.78); backdrop-filter: blur(18px) saturate(1.3); border-color: var(--line-d); }
.nav { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 78px; }
.brand { display: inline-flex; flex-direction: column; line-height: 1; text-decoration: none; }
.brand b { font: 600 20px/1 var(--f-body); letter-spacing: 0.32em; color: #fff; }
.brand span { margin-top: 6px; font: 700 8.5px/1 var(--f-body); letter-spacing: 0.34em; text-transform: uppercase; color: var(--bordo-soft); }
.menu { display: none; list-style: none; margin: 0; padding: 0; gap: clamp(16px, 2vw, 34px); align-items: center; }
.menu a { position: relative; font-size: 13.5px; font-weight: 500; color: rgb(255 255 255 / 0.78); text-decoration: none; padding: 8px 0; transition: color 300ms; }
.menu a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--bordo-soft); transform: scaleX(0); transform-origin: right; transition: transform 500ms var(--ease); }
.menu a:hover { color: #fff; }
.menu a:hover::after, .menu a[aria-current]::after { transform: scaleX(1); transform-origin: left; }
.menu .cta-nav { padding: 10px 18px; border: 1px solid rgb(255 255 255 / 0.25); border-radius: 999px; }
.menu .cta-nav::after { display: none; }
.menu .cta-nav:hover { border-color: var(--bordo-soft); }
.burger { display: inline-flex; align-items: center; gap: 10px; background: none; border: 1px solid rgb(255 255 255 / 0.25); color: #fff; border-radius: 999px; padding: 10px 16px; font: 600 12px/1 var(--f-body); letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }
.drawer { position: fixed; inset: 0; z-index: 60; background: var(--night); padding: 100px var(--gutter) 40px; display: flex; flex-direction: column; gap: 6px; transform: translateY(-100%); transition: transform 700ms var(--ease); }
.drawer.open { transform: none; }
.drawer a { font-family: var(--f-display); font-size: 2.2rem; text-decoration: none; padding: 6px 0; border-bottom: 1px solid var(--line-d); }
.drawer .close { position: absolute; top: 22px; right: var(--gutter); }
@media (min-width: 1040px) { .menu { display: flex; } .burger { display: none; } }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: clamp(640px, 96svh, 980px); display: grid; align-items: end; overflow: hidden; isolation: isolate; }
.hero__img { position: absolute; inset: -6% 0 0 0; z-index: -2; }
.hero__img img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 30%; animation: kenburns 18s ease-out both; will-change: transform; }
@keyframes kenburns { from { transform: scale(1.12); } to { transform: scale(1.02); } }
.hero::before {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background:
    radial-gradient(120% 90% at 75% 30%, transparent 30%, rgb(10 11 13 / 0.55) 70%),
    linear-gradient(90deg, rgb(13 14 16 / 0.96) 0%, rgb(13 14 16 / 0.78) 34%, rgb(13 14 16 / 0.15) 64%, rgb(13 14 16 / 0.35) 100%),
    linear-gradient(0deg, var(--night) 0%, rgb(21 23 26 / 0.6) 24%, transparent 48%),
    linear-gradient(180deg, rgb(13 14 16 / 0.75) 0%, transparent 22%);
}
.hero__grain { position: absolute; inset: 0; z-index: -1; opacity: 0.07; mix-blend-mode: overlay; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }
.hero__inner { padding-top: 140px; padding-bottom: clamp(40px, 6vw, 72px); display: grid; gap: 48px; }
.hero h1 { font-size: clamp(2.9rem, 1.6rem + 5.4vw, 6.6rem); max-width: 12.5ch; }
.hero h1 .w { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: 0.08em; margin-bottom: -0.08em; }
.hero h1 .w > span { display: inline-block; animation: rise 1100ms var(--ease) both; }
@keyframes rise { from { transform: translateY(105%); } }
.hero__sub { display: flex; flex-wrap: wrap; gap: 28px 48px; align-items: end; justify-content: space-between; }
.hero__sub .lede { color: #c8cacd; animation: fade 1200ms var(--ease) 900ms both; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; animation: fade 1200ms var(--ease) 1050ms both; }
@keyframes fade { from { opacity: 0; transform: translateY(16px); } }

/* Trilho de destaques sobre o hero */
.rail { display: grid; gap: 1px; background: var(--line-d); border: 1px solid var(--line-d); border-radius: 18px; overflow: hidden; backdrop-filter: blur(16px); animation: fade 1200ms var(--ease) 1250ms both; box-shadow: var(--shadow-deep); }
.rail a { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; row-gap: 10px; gap: 18px; align-items: center; padding: 18px 22px; background: rgb(21 23 26 / 0.62); text-decoration: none; transition: background 400ms; min-width: 0; }
.rail a:hover { background: rgb(122 31 37 / 0.55); }
.rail .tag { grid-column: 1 / -1; font: 500 10.5px/1 var(--f-mono); letter-spacing: 0.18em; text-transform: uppercase; color: var(--bordo-soft); }
.rail a:hover .tag { color: #fff; }
.rail strong { font-weight: 500; font-size: 15px; line-height: 1.35; display: block; min-width: 0; }
.rail small { display: block; color: var(--mist); font-size: 12.5px; margin-top: 2px; }
.rail .go { font-size: 18px; transition: transform 400ms var(--ease); }
.rail a:hover .go { transform: translate(3px, -3px); }
@media (min-width: 900px) { .rail { grid-template-columns: repeat(3, 1fr); } .rail a { grid-template-columns: 1fr auto; grid-template-rows: auto auto; } .rail .tag { grid-column: 1 / -1; } }
.scroll-cue { display: none; }
@media (min-width: 900px) {
  .scroll-cue { display: flex; position: absolute; right: var(--gutter); top: 50%; transform: translateY(-50%) rotate(90deg); transform-origin: right center; gap: 14px; align-items: center; font: 500 10.5px/1 var(--f-mono); letter-spacing: 0.3em; text-transform: uppercase; color: var(--mist); }
  .scroll-cue::after { content: ''; width: 64px; height: 1px; background: linear-gradient(90deg, var(--bordo-soft), transparent); animation: cue 2.4s ease-in-out infinite; transform-origin: left; }
}
@keyframes cue { 0%, 100% { transform: scaleX(0.3); } 50% { transform: scaleX(1); } }

/* ---------- Faixa de áreas (marquee) ---------- */
.marquee { border-block: 1px solid var(--line-d); overflow: hidden; background: var(--night); padding-block: 26px; }
.marquee__track { display: flex; width: max-content; gap: 56px; animation: marquee 38s linear infinite; }
.marquee:hover .marquee__track { animation-play-state: paused; }
.marquee span { font-family: var(--f-display); font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.6rem); white-space: nowrap; color: rgb(255 255 255 / 0.85); display: inline-flex; align-items: center; gap: 56px; }
.marquee span:nth-child(even) { font-style: italic; color: transparent; -webkit-text-stroke: 1px rgb(255 255 255 / 0.45); }
.marquee span::after { content: '✦'; font-size: 0.5em; color: var(--bordo-hi); -webkit-text-stroke: 0; font-style: normal; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* ---------- Bento de destaques ---------- */
.bento { display: grid; gap: 16px; grid-template-columns: 1fr; }
.tile { position: relative; border-radius: 22px; overflow: hidden; min-width: 0; isolation: isolate; text-decoration: none; display: flex; flex-direction: column; transition: transform 600ms var(--ease), box-shadow 600ms var(--ease); }
.tile:hover { transform: translateY(-6px); }
.tile--event { min-height: 520px; justify-content: end; padding: 140px clamp(24px, 3vw, 40px) clamp(24px, 3vw, 40px); color: #fff; box-shadow: var(--shadow-deep); }
.tile--event img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 1400ms var(--ease); }
.tile--event:hover img { transform: scale(1.06); }
.tile--event::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgb(10 11 13 / 0.95) 0%, rgb(10 11 13 / 0.55) 45%, rgb(10 11 13 / 0.15) 100%), linear-gradient(90deg, rgb(10 11 13 / 0.5), transparent 60%); }
.tile--event .top { position: absolute; top: clamp(20px, 2.4vw, 32px); left: clamp(24px, 3vw, 40px); right: clamp(24px, 3vw, 40px); display: flex; justify-content: space-between; align-items: start; gap: 12px; flex-wrap: wrap; }
.date-badge { display: grid; place-items: center; width: 84px; padding: 12px 0; border-radius: 14px; background: rgb(255 255 255 / 0.1); backdrop-filter: blur(12px); border: 1px solid rgb(255 255 255 / 0.2); text-align: center; }
.date-badge b { font-family: var(--f-display); font-size: 2.2rem; font-weight: 400; line-height: 1; }
.date-badge small { font: 500 10px/1.2 var(--f-mono); letter-spacing: 0.2em; text-transform: uppercase; margin-top: 4px; }
.tile--event h3 { font-size: clamp(1.8rem, 1.2rem + 1.8vw, 2.8rem); max-width: 18ch; margin-top: 14px; }
.tile--event .info { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 18px; color: #d7d8da; font-size: 14px; }
.tile--event .info span { display: inline-flex; gap: 8px; align-items: center; }
.tile--event .actions { margin-top: 26px; display: flex; gap: 12px; flex-wrap: wrap; }

.tile--course { background: linear-gradient(155deg, #8a252c 0%, var(--bordo) 45%, #4c1216 100%); color: #fff; padding: clamp(24px, 2.6vw, 34px); box-shadow: 0 30px 60px -30px rgb(122 31 37 / 0.9); min-height: 300px; justify-content: space-between; }
.tile--course::after { content: '§'; position: absolute; right: -10px; bottom: -70px; font-family: var(--f-display); font-size: 260px; line-height: 1; color: rgb(255 255 255 / 0.07); z-index: -1; }
.tile--course h3 { font-size: clamp(1.5rem, 1.1rem + 1vw, 2rem); max-width: 14ch; }
.tile--course .meta { color: #f2c9cc; }

.tile--pub { background: var(--paper); color: var(--ink); padding: clamp(24px, 2.6vw, 34px); box-shadow: var(--shadow-soft); justify-content: space-between; min-height: 300px; }
.tile--pub .meta { color: var(--bordo); }
.tile--pub h3 { margin-top: 14px; }
.tile--pub p { color: var(--ink-2); font-size: 14.5px; margin: 12px 0 0; }

.tile--radar { background: var(--night-2); border: 1px solid var(--line-d); padding: clamp(22px, 2.4vw, 30px); }
.radar-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 8px; }
.live { display: inline-flex; gap: 8px; align-items: center; font: 500 10.5px/1 var(--f-mono); letter-spacing: 0.18em; text-transform: uppercase; color: var(--mist); }
.live::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #d4545c; box-shadow: 0 0 0 0 rgb(212 84 92 / 0.6); animation: ping 1.8s infinite; }
@keyframes ping { 70% { box-shadow: 0 0 0 9px rgb(212 84 92 / 0); } 100% { box-shadow: 0 0 0 0 rgb(212 84 92 / 0); } }
.feed { list-style: none; margin: 0; padding: 0; }
.feed li a { display: grid; gap: 4px; padding: 14px 0; border-bottom: 1px solid var(--line-d); text-decoration: none; transition: padding 400ms var(--ease), color 300ms; }
.feed li:last-child a { border-bottom: 0; }
.feed li a:hover { padding-left: 8px; color: #fff; }
.feed strong { font-weight: 500; font-size: 14.5px; line-height: 1.4; }
.feed .src { font: 500 10.5px/1 var(--f-mono); letter-spacing: 0.14em; text-transform: uppercase; color: var(--bordo-soft); }

@media (min-width: 760px) {
  .bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tile--event { grid-column: 1 / -1; }
}
@media (min-width: 1100px) {
  .bento { grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: minmax(150px, auto); }
  .tile--event { grid-column: 1 / 8; grid-row: 1 / 4; }
  .tile--course { grid-column: 8 / 13; grid-row: 1 / 2; }
  .tile--pub { grid-column: 8 / 13; grid-row: 2 / 4; }
  .tile--radar { grid-column: 1 / 13; }
  .tile--radar .feed { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 28px; }
  .tile--radar .feed li a { border-bottom: 0; border-top: 1px solid var(--line-d); }
}

/* ---------- Escritório / manifesto ---------- */
.manifesto { display: grid; gap: clamp(40px, 6vw, 96px); align-items: center; }
.manifesto .display { font-size: clamp(2.2rem, 1.3rem + 3.2vw, 4.2rem); }
.stack { position: relative; aspect-ratio: 4 / 4.4; max-width: 100%; }
.stack .a, .stack .b { position: absolute; overflow: hidden; border-radius: 18px; box-shadow: var(--shadow-deep); }
.stack .a { inset: 0 18% 18% 0; }
.stack .b { width: 46%; aspect-ratio: 3 / 4; right: 0; bottom: 0; border: 6px solid var(--paper); }
.stack img { position: absolute; left: 0; top: -12%; width: 100%; height: 124%; object-fit: cover; will-change: transform; }
.stack .stamp { position: absolute; left: -10px; bottom: 6%; z-index: 2; background: var(--bordo); color: #fff; padding: 16px 18px; border-radius: 14px; box-shadow: var(--shadow-soft); font: 500 10.5px/1.5 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; }
.stack .stamp b { display: block; font-family: var(--f-display); font-size: 1.6rem; letter-spacing: 0; text-transform: none; font-weight: 400; }
.pillars { display: grid; gap: 1px; background: var(--line-l); border-block: 1px solid var(--line-l); margin-top: 40px; }
.pillars div { background: var(--paper); padding: 22px 0; display: grid; grid-template-columns: 3rem 1fr; gap: 6px 16px; }
.pillars i { font-style: normal; font-family: var(--f-display); font-size: 1.4rem; color: var(--bordo); grid-row: span 2; }
.pillars b { font-weight: 600; font-size: 15px; }
.pillars span { color: var(--ink-2); font-size: 14px; grid-column: 2; }
.facts { display: flex; flex-wrap: wrap; gap: 28px 48px; margin-top: 36px; }
.facts div { display: grid; }
.facts b { font-family: var(--f-display); font-weight: 400; font-size: clamp(2.4rem, 2rem + 1.4vw, 3.4rem); line-height: 1; color: var(--ink); }
.facts span { font: 500 10.5px/1.4 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; color: var(--mist-2); margin-top: 8px; }
@media (min-width: 960px) { .manifesto { grid-template-columns: 1fr 1.05fr; } }

/* ---------- Áreas (lista interativa) ---------- */
.areas { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-d); position: relative; }
.areas li a { display: grid; grid-template-columns: auto 1fr auto; gap: 16px 32px; align-items: center; padding: clamp(22px, 2.6vw, 34px) 0; border-bottom: 1px solid var(--line-d); text-decoration: none; position: relative; }
.areas .idx { font: 500 12px/1 var(--f-mono); color: var(--mist-2); width: 2.4rem; }
.areas .t { font-family: var(--f-display); font-size: clamp(1.7rem, 1.1rem + 2.6vw, 3.6rem); line-height: 1.05; transition: transform 600ms var(--ease), color 400ms; min-width: 0; }
.areas .d { display: none; color: var(--mist); font-size: 14px; max-width: 26rem; }
.areas .arrow { width: 52px; height: 52px; border-radius: 50%; border: 1px solid var(--line-d); display: grid; place-items: center; transition: background 400ms, border-color 400ms, transform 500ms var(--ease); }
.areas li a:hover .t { transform: translateX(14px); color: #fff; }
.areas li a:hover .arrow { background: var(--bordo); border-color: var(--bordo); transform: rotate(-45deg); }
.areas li a::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgb(122 31 37 / 0.22), transparent 70%); opacity: 0; transition: opacity 500ms; pointer-events: none; }
.areas li a:hover::before { opacity: 1; }
@media (min-width: 900px) { .areas li a { grid-template-columns: 3rem minmax(0, 1.2fr) minmax(0, 1fr) auto; } .areas .d { display: block; } }
.hover-img { position: fixed; top: 0; left: 0; width: 280px; aspect-ratio: 4 / 5; border-radius: 16px; overflow: hidden; pointer-events: none; z-index: 40; opacity: 0; transform: translate(-50%, -50%) scale(0.85) rotate(-4deg); transition: opacity 400ms var(--ease), transform 500ms var(--ease); box-shadow: var(--shadow-deep); }
.hover-img.on { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(-2deg); }
.hover-img img { width: 100%; height: 100%; object-fit: cover; }
@media (hover: none) { .hover-img { display: none; } }

/* ---------- Equipe (galeria) ---------- */
.team-nav { display: flex; gap: 10px; }
.round { width: 54px; height: 54px; border-radius: 50%; border: 1px solid var(--line-l); background: transparent; display: grid; place-items: center; cursor: pointer; font-size: 18px; color: var(--ink); transition: background 400ms, color 400ms, border-color 400ms; }
.round:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.gallery { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(240px, 300px); gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 18px; scrollbar-width: thin; cursor: grab; }
.gallery:active { cursor: grabbing; }
.person { scroll-snap-align: start; margin: 0; }
.person .ph { aspect-ratio: 3 / 4; border-radius: 18px; overflow: hidden; position: relative; box-shadow: var(--shadow-soft); }
.person img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(0.85) contrast(1.05); transform: scale(1.04); transition: filter 800ms var(--ease), transform 1200ms var(--ease); }
.person:hover img { filter: none; transform: scale(1); }
.person .ph::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgb(10 11 13 / 0.55), transparent 45%); }
.person figcaption { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; margin-top: 14px; }
.person b { font-family: var(--f-display); font-weight: 500; font-size: 1.25rem; }
.person .chip { color: var(--mist-2); }
.team-wide { margin-top: 56px; border-radius: 22px; overflow: hidden; position: relative; height: clamp(260px, 36vw, 520px); max-width: 100%; box-shadow: var(--shadow-deep); }
.team-wide img { position: absolute; left: 0; top: -12%; width: 100%; height: 124%; object-fit: cover; object-position: 50% 40%; will-change: transform; }
.team-wide::after { content: ''; position: absolute; inset: 0; background: radial-gradient(90% 120% at 50% 40%, transparent 40%, rgb(10 11 13 / 0.55)); }

/* ---------- Agenda ---------- */
.agenda { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.ev a { display: grid; grid-template-columns: 92px 1fr; gap: 18px 28px; align-items: center; padding: 22px; border-radius: 18px; background: var(--night-2); border: 1px solid var(--line-d); text-decoration: none; transition: border-color 400ms, background 400ms, transform 500ms var(--ease); }
.ev a:hover { border-color: var(--bordo-hi); background: var(--night-3); transform: translateX(6px); }
.ev .when { text-align: center; border-right: 1px solid var(--line-d); padding-right: 18px; }
.ev .when b { display: block; font-family: var(--f-display); font-weight: 400; font-size: 2.6rem; line-height: 1; }
.ev .when small { font: 500 10.5px/1 var(--f-mono); letter-spacing: 0.2em; text-transform: uppercase; color: var(--bordo-soft); }
.ev .what { min-width: 0; display: grid; gap: 8px; }
.ev .row { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; color: var(--mist); font-size: 13.5px; }
.ev .type { font: 500 10.5px/1 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; color: #fff; background: rgb(122 31 37 / 0.6); padding: 6px 9px; border-radius: 999px; }
.ev .cta { display: none; }
@media (min-width: 820px) { .ev a { grid-template-columns: 110px 1fr auto; } .ev .cta { display: inline-flex; } }
.agenda-grid { display: grid; gap: clamp(32px, 5vw, 72px); }
@media (min-width: 1000px) { .agenda-grid { grid-template-columns: 0.8fr 1.2fr; align-items: start; } .agenda-grid .sticky { position: sticky; top: 120px; } }

/* ---------- Publicações ---------- */
.pubs { display: grid; gap: clamp(24px, 3vw, 40px); }
.pub-feature { display: grid; text-decoration: none; border-radius: 22px; overflow: hidden; background: var(--night); color: #fff; box-shadow: var(--shadow-deep); }
.pub-feature .img { aspect-ratio: 16 / 10; overflow: hidden; position: relative; }
.pub-feature .img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1400ms var(--ease); }
.pub-feature:hover .img img { transform: scale(1.05); }
.pub-feature .img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, var(--night), transparent 55%); }
.pub-feature .body { padding: clamp(24px, 3vw, 40px); display: grid; gap: 14px; margin-top: -90px; position: relative; }
.pub-feature h3 { font-size: clamp(1.7rem, 1.2rem + 1.4vw, 2.5rem); max-width: 22ch; }
.pub-feature p { color: var(--mist); margin: 0; max-width: 38rem; }
.pub-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-l); }
.pub-list a { display: grid; gap: 8px; padding: 22px 0; border-bottom: 1px solid var(--line-l); text-decoration: none; transition: padding 500ms var(--ease); }
.pub-list a:hover { padding-left: 12px; }
.pub-list .meta { color: var(--bordo); }
.pub-list h4 { margin: 0; font-family: var(--f-display); font-weight: 500; font-size: 1.3rem; line-height: 1.2; }
@media (min-width: 1000px) { .pubs { grid-template-columns: 1.3fr 1fr; align-items: start; } }

/* ---------- Formação (curso) ---------- */
.course-band { display: grid; gap: clamp(32px, 5vw, 72px); align-items: center; }
.course-visual { position: relative; border-radius: 26px; overflow: hidden; aspect-ratio: 5 / 4; box-shadow: var(--shadow-deep); view-transition-name: curso-hero; background: var(--bordo); }
.course-visual img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: luminosity; opacity: 0.55; }
.course-visual::after { content: ''; position: absolute; inset: 0; background: linear-gradient(160deg, rgb(122 31 37 / 0.15), rgb(21 23 26 / 0.85)); }
.course-visual .ov { position: absolute; inset: auto 0 0 0; z-index: 2; padding: clamp(22px, 3vw, 36px); display: grid; gap: 10px; }
.course-visual .ov b { font-family: var(--f-display); font-weight: 400; font-size: clamp(1.8rem, 1.3rem + 1.6vw, 2.8rem); line-height: 1.05; max-width: 14ch; }
.modules { display: flex; flex-wrap: wrap; gap: 8px; margin: 26px 0 30px; }
.modules span { padding: 9px 14px; border-radius: 999px; border: 1px solid var(--line-d); font-size: 13px; color: #d6d7d9; }
@media (min-width: 980px) { .course-band { grid-template-columns: 1fr 1fr; } }

/* ---------- Contato ---------- */
.contact { position: relative; overflow: hidden; isolation: isolate; }
.contact::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(70% 90% at 85% 10%, rgb(122 31 37 / 0.45), transparent 60%), radial-gradient(60% 80% at 0% 100%, rgb(61 65 70 / 0.6), transparent 60%); }
.contact .display { font-size: clamp(2.6rem, 1.4rem + 5vw, 6rem); max-width: 14ch; }
.channels { display: grid; gap: 1px; background: var(--line-d); border: 1px solid var(--line-d); border-radius: 20px; overflow: hidden; margin-top: 48px; }
.channels div { background: rgb(21 23 26 / 0.7); padding: 26px; display: grid; gap: 8px; min-width: 0; }
.channels b { font-family: var(--f-display); font-weight: 400; font-size: clamp(1.3rem, 1.1rem + 0.8vw, 1.8rem); overflow-wrap: anywhere; user-select: all; }
.channels small { font-size: 13px; color: var(--mist); }
@media (min-width: 860px) { .channels { grid-template-columns: repeat(3, 1fr); } }

/* ---------- Rodapé ---------- */
.footer { border-top: 1px solid var(--line-d); padding-block: 56px 32px; color: var(--mist); font-size: 14px; }
.footer-grid { display: grid; gap: 36px; }
.footer h5 { margin: 0 0 14px; font: 500 10.5px/1 var(--f-mono); letter-spacing: 0.2em; text-transform: uppercase; color: var(--bordo-soft); }
.footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.footer a { text-decoration: none; }
.footer a:hover { color: #fff; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--line-d); font-size: 12.5px; }
@media (min-width: 900px) { .footer-grid { grid-template-columns: 1.5fr repeat(3, 1fr); } }

/* ---------- Revelação ao rolar (só para o que está abaixo da dobra) ---------- */
.js .pre { opacity: 0; transform: translateY(36px); }
.js .pre.in { opacity: 1; transform: none; transition: opacity 1000ms var(--ease), transform 1100ms var(--ease); transition-delay: var(--d, 0ms); }

/* ---------- Páginas internas ---------- */
.page-hero { position: relative; padding: 170px 0 80px; overflow: hidden; isolation: isolate; }
.page-hero::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(80% 100% at 90% 0%, rgb(122 31 37 / 0.5), transparent 60%); }
.page-hero .display { font-size: clamp(2.6rem, 1.5rem + 4.6vw, 5.8rem); max-width: 14ch; }
.crumbs { display: flex; flex-wrap: wrap; gap: 10px; font: 500 11px/1 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; color: var(--mist); margin-bottom: 30px; }
.crumbs a { text-decoration: none; }
.crumbs a:hover { color: #fff; }
.crumbs span::before { content: '/'; margin-right: 10px; color: var(--mist-2); }
.split2 { display: grid; gap: clamp(32px, 5vw, 80px); }
@media (min-width: 980px) { .split2 { grid-template-columns: 1.15fr 0.85fr; align-items: start; } .split2 .sticky { position: sticky; top: 110px; } }
.prose { font-size: 1.08rem; line-height: 1.75; max-width: 42rem; }
.prose h2 { font-family: var(--f-display); font-weight: 500; font-size: 1.9rem; line-height: 1.15; margin: 2.2em 0 0.6em; }
.prose h3 { font-weight: 700; font-size: 1.1rem; margin: 1.8em 0 0.4em; }
.prose blockquote { margin: 1.6em 0; padding-left: 22px; border-left: 2px solid var(--bordo); font-family: var(--f-display); font-style: italic; font-size: 1.25rem; color: var(--ink-2); }
.panel { background: var(--night-2); border: 1px solid var(--line-d); border-radius: 22px; padding: 28px; box-shadow: var(--shadow-deep); }
.panel dl { margin: 0; display: grid; }
.panel dl div { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line-d); font-size: 14px; }
.panel dt { color: var(--mist); }
.panel dd { margin: 0; text-align: right; }
.field { display: grid; gap: 6px; margin-bottom: 14px; }
.field label { font-size: 12.5px; font-weight: 600; letter-spacing: 0.04em; color: #d7d8da; }
.field input, .field select { width: 100%; min-height: 50px; padding: 0 16px; border-radius: 12px; background: var(--night); border: 1px solid var(--line-d); color: #fff; font: inherit; }
.field input:focus { outline: 2px solid var(--bordo-soft); outline-offset: 1px; }
.check { display: flex; gap: 10px; align-items: start; font-size: 13px; color: var(--mist); margin-bottom: 12px; }
.check input { accent-color: var(--bordo); margin-top: 3px; }
.ok-msg { padding: 16px; border-radius: 12px; background: rgb(64 125 84 / 0.15); border: 1px solid rgb(64 125 84 / 0.5); color: #bfe3c9; font-size: 14px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; scroll-behavior: auto !important; }
  .curtain { display: none; }
  .js .pre { opacity: 1; transform: none; }
}
.panel .kicker { color: var(--bordo-soft); }

/* ---------- Ajustes v2 ---------- */
.brand img { height: 30px; width: auto; display: block; }
.footer .brand img { height: 34px; }
.footer-bottom a { text-decoration: underline; text-underline-offset: 3px; }
.channels b { font-size: clamp(1.05rem, 0.98rem + 0.45vw, 1.35rem); }
.channels div { padding: 22px; }

.team-grid { display: grid; gap: 28px 20px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 900px) { .team-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 28px; } }
.team-grid .person { display: grid; gap: 14px; text-decoration: none; color: var(--ink); position: relative; }
.team-grid .person .ph { aspect-ratio: 4 / 5; }
.person__cap { display: grid; gap: 6px; padding-right: 40px; }
.person__cap b { font-family: var(--f-display); font-weight: 500; font-size: clamp(1.05rem, 0.95rem + 0.6vw, 1.4rem); line-height: 1.15; }
.person__cap .meta { color: var(--bordo); }
.person__go { position: absolute; right: 0; bottom: 4px; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--line-l); display: grid; place-items: center; transition: background 400ms, color 400ms, transform 500ms var(--ease); }
.team-grid .person:hover .person__go { background: var(--bordo); color: #fff; border-color: var(--bordo); transform: rotate(-45deg); }
.team-grid .person:hover img { filter: none; transform: scale(1); }

.socio-hero { position: relative; padding: 150px 0 80px; overflow: hidden; isolation: isolate; }
.socio-hero::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(70% 90% at 85% 10%, rgb(122 31 37 / 0.5), transparent 60%); }
.socio-hero__in { display: grid; gap: 48px; align-items: center; }
.socio-hero h1 { font-size: clamp(2.4rem, 1.4rem + 3.8vw, 5rem); max-width: 14ch; }
.socio-tags { list-style: none; padding: 0; margin: 28px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.socio-tags li { padding: 8px 14px; border: 1px solid var(--line-d); border-radius: 999px; font-size: 13px; color: #d6d7d9; }
.socio-photo { border-radius: 24px; overflow: hidden; aspect-ratio: 4 / 5; box-shadow: var(--shadow-deep); max-width: 100%; }
.socio-photo img { width: 100%; height: 100%; object-fit: cover; animation: kenburns 14s ease-out both; }
@media (min-width: 980px) { .socio-hero__in { grid-template-columns: 1.25fr 0.75fr; } }
.prose .kicker { margin-bottom: 18px; }

.cp-grid { display: grid; gap: 20px; }
@media (min-width: 980px) { .cp-grid { grid-template-columns: 0.9fr 1.1fr; } }
.cp-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; background: var(--line-d); border: 1px solid var(--line-d); border-radius: 22px; overflow: hidden; }
.cp-list li { background: var(--night-2); padding: 22px 24px; display: grid; gap: 6px; }
.cp-list b { font-weight: 500; font-size: 15.5px; }
.cp-list small { color: var(--mist); font-size: 13px; }
.cp-pend { outline: 1px dashed rgb(231 194 119 / 0.45); outline-offset: -8px; }
.cp-pend .meta { color: #e7c277; }

.others { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 16px; }
.others a { display: grid; gap: 10px; text-decoration: none; color: var(--ink); font-family: var(--f-display); font-size: 1.1rem; }
.others img { aspect-ratio: 1; width: 100%; object-fit: cover; border-radius: 16px; filter: grayscale(0.8); transition: filter 600ms var(--ease); box-shadow: var(--shadow-soft); }
.others a:hover img { filter: none; }
.cp-grid .tile--course { grid-column: auto; grid-row: auto; }

/* ---------- v3: retrato padronizado sem corte + textos pequenos +1pt ---------- */
.socio-photo { aspect-ratio: 1717 / 2576; width: min(100%, 440px); justify-self: end; }
.socio-photo img { object-fit: cover; object-position: 50% 0; animation: none; transition: transform 1400ms var(--ease); }
.socio-photo:hover img { transform: scale(1.02); }
@media (max-width: 979px) { .socio-photo { justify-self: start; } }
.cp-photo { margin: 0 0 24px; border-radius: 22px; overflow: hidden; position: relative; box-shadow: var(--shadow-deep); }
.cp-photo img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; object-position: 50% 30%; }
.cp-photo figcaption { position: absolute; left: 20px; bottom: 16px; color: #fff; text-shadow: 0 1px 8px rgb(0 0 0 / 0.6); }

.kicker { font-size: 12px; }
.meta { font-size: 12.5px; }
.chip { font-size: 11.5px; }
.rail .tag { font-size: 11.5px; }
.rail small { font-size: 13.5px; }
.rail strong { font-size: 16px; }
.feed .src { font-size: 11.5px; }
.feed strong { font-size: 15.5px; }
.live { font-size: 11.5px; }
.date-badge small { font-size: 11px; }
.ev .when small, .ev .type { font-size: 11.5px; }
.ev .row { font-size: 14.5px; }
.pillars span { font-size: 15px; }
.pillars b { font-size: 16px; }
.facts span { font-size: 11.5px; }
.areas .idx { font-size: 13px; }
.areas .d { font-size: 15px; }
.tile--pub p { font-size: 15.5px; }
.modules span { font-size: 14px; }
.channels small { font-size: 14px; }
.footer { font-size: 15px; }
.footer h5 { font-size: 11.5px; }
.footer-bottom { font-size: 13.5px; }
.crumbs { font-size: 12px; }
.socio-tags li { font-size: 14px; }
.cp-list b { font-size: 16.5px; }
.cp-list small { font-size: 14px; }
.panel dl div { font-size: 15px; }
.check { font-size: 14px; }
.field label { font-size: 13.5px; }
.menu a { font-size: 14.5px; }
.btn { font-size: 14px; }
.link { font-size: 13.5px; }
.lede { font-size: clamp(1.1rem, 1.05rem + 0.3vw, 1.25rem); }

/* ---------- v4: fotos da equipe em cores; ao passar o mouse, tom bordô do logotipo ---------- */
.person img, .team-grid .person img, .others img { filter: none; transform: none; }
.team-grid .person .ph, .others a { position: relative; }
.team-grid .person .ph::before {
  content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: var(--bordo); mix-blend-mode: color; opacity: 0; transition: opacity 600ms var(--ease);
}
.team-grid .person .ph::after { z-index: 2; }
.team-grid .person:hover .ph::before, .team-grid .person:focus-visible .ph::before { opacity: 0.85; }
.team-grid .person:hover img { transform: scale(1.03); filter: contrast(1.05); }
.team-grid .person img { transition: transform 1200ms var(--ease), filter 600ms var(--ease); }
.others a span:last-child { position: relative; }
.others a::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; aspect-ratio: 1; border-radius: 16px; z-index: 1; pointer-events: none;
  background: var(--bordo); mix-blend-mode: color; opacity: 0; transition: opacity 600ms var(--ease);
}
.others a:hover::before { opacity: 0.85; }

/* ---------- v5: foto do escritório inteira, sem recorte ---------- */
.esc-photo { position: relative; margin: 0; max-width: 100%; }
.esc-photo img { width: 100%; aspect-ratio: 1600 / 1066; object-fit: cover; border-radius: 22px; box-shadow: var(--shadow-deep); }
.esc-photo .stamp { position: absolute; left: -10px; bottom: -18px; z-index: 2; background: var(--bordo); color: #fff; padding: 16px 18px; border-radius: 14px; box-shadow: var(--shadow-soft); font: 500 11.5px/1.5 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; }
.esc-photo .stamp b { display: block; font-family: var(--f-display); font-size: 1.6rem; letter-spacing: 0; text-transform: none; font-weight: 400; }
@media (max-width: 600px) { .esc-photo .stamp { left: 12px; } }

/* ---------- v6: escritório sem foto (texto em duas colunas) ---------- */
.manifesto--text { grid-template-columns: 1fr; }
.manifesto--text > div { display: grid; gap: 0 clamp(40px, 6vw, 96px); }
@media (min-width: 960px) {
  .manifesto--text > div { grid-template-columns: 1.1fr 1fr; align-items: start; }
  .manifesto--text .kicker { grid-column: 1; }
  .manifesto--text .display { grid-column: 1; }
  .manifesto--text .facts { grid-column: 1; }
  .manifesto--text .pillars { grid-column: 2; grid-row: 1 / span 3; margin-top: 0; }
}

/* ---------- v7: home alinhada ao site original ---------- */
.hero h1 { font-size: clamp(2.4rem, 1.4rem + 3.9vw, 5rem); max-width: 13ch; }
.esc-lede { margin: 22px 0 0; max-width: 40rem; }
@media (min-width: 960px) {
  .manifesto--text .esc-lede { grid-column: 1; }
  .manifesto--text .pillars { grid-row: 1 / span 4; }
}
.manifesto--text .display { font-size: clamp(2rem, 1.3rem + 2.6vw, 3.6rem); }

.quote-band { background: linear-gradient(150deg, #8a252c 0%, var(--bordo) 45%, #3e0f12 100%); color: #fff; padding-block: clamp(64px, 8vw, 120px); position: relative; overflow: hidden; isolation: isolate; }
.quote-band::after { content: '“'; position: absolute; right: -20px; top: -120px; font-family: var(--f-display); font-size: 520px; line-height: 1; color: rgb(255 255 255 / 0.06); z-index: -1; }
.quote { font-size: clamp(2rem, 1.2rem + 3.4vw, 4.4rem); max-width: 18ch; }
.quote em { color: #f2c9cc; }
.mv { display: grid; gap: 28px; margin-top: clamp(36px, 5vw, 64px); }
.mv div { border-top: 1px solid rgb(255 255 255 / 0.25); padding-top: 18px; }
.mv .meta { color: #f2c9cc; }
.mv p { margin: 10px 0 0; color: rgb(255 255 255 / 0.85); font-size: 16px; max-width: 34rem; }
@media (min-width: 860px) { .mv { grid-template-columns: 1fr 1fr; gap: 48px; } }

.bento--pubs .tile--event { min-height: 460px; }
.tile--pub2 { background: var(--marble); }
@media (min-width: 1100px) {
  .bento--pubs .tile--event { grid-column: 1 / 8; grid-row: 1 / 3; }
  .bento--pubs .tile--pub { grid-column: 8 / 13; grid-row: 1 / 2; }
  .bento--pubs .tile--pub2 { grid-column: 8 / 13; grid-row: 2 / 3; }
  .bento--pubs .tile--radar { grid-column: 1 / 13; grid-row: 3; }
}
.light .ev a { background: var(--paper); border-color: var(--line-l); color: var(--ink); box-shadow: var(--shadow-soft); }
.light .ev a:hover { background: #fff; border-color: var(--bordo); }
.light .ev .when { border-color: var(--line-l); }
.light .ev .when small { color: var(--bordo); }
.light .ev .row { color: var(--ink-2); }
.light .ev .type { background: var(--bordo); }
.contact .lede { color: #c8cacd; }
.cp-grid:has(> .cp-list:only-child) { grid-template-columns: 1fr; }

/* ---------- v8: cores do logotipo + banner mais claro ---------- */
:root {
  --bordo: #9f0331;          /* vermelho do logotipo */
  --bordo-hi: #7e0227;       /* hover: mesmo tom, mais escuro */
  --bordo-soft: #9f0331;     /* substitui o rosé: só a cor do logo */
  --logo-white: #ffffff;
}
.kicker, .section--night .kicker, .rail .tag, .feed .src, .ev .when small, .channels .meta, .footer h5, .mv .meta, .tile--course .meta, .crumbs { color: #c9cbce; }
.kicker::before, .footer h5::before { background: var(--bordo); }
.kicker::before { height: 2px; }
.light .kicker, .marble .kicker, .light .ev .when small, .tile--pub .meta, .pub-list .meta, .person__cap .meta { color: var(--bordo); }
.display em { color: #ffffff; font-style: italic; text-decoration: underline; text-decoration-color: var(--bordo); text-decoration-thickness: 3px; text-underline-offset: 0.12em; text-decoration-skip-ink: none; }
.light .display em, .marble .display em { color: var(--bordo); text-decoration: none; }
.quote-band { background: linear-gradient(150deg, #9f0331 0%, #7e0227 50%, #4a0117 100%); }
.quote em, .mv .meta, .tile--course .meta { color: #ffffff; }
.quote em { text-decoration: none; }
.tile--course { background: linear-gradient(155deg, #9f0331 0%, #7e0227 50%, #4a0117 100%); box-shadow: 0 30px 60px -30px rgb(159 3 49 / 0.8); }
.btn { box-shadow: 0 14px 30px -14px rgb(159 3 49 / 0.75); }
.areas li a:hover .arrow, .ev .type, .light .ev .type { background: var(--bordo); border-color: var(--bordo); }
.areas li a::before { background: linear-gradient(90deg, rgb(159 3 49 / 0.22), transparent 70%); }
.rail a:hover { background: rgb(159 3 49 / 0.6); }
.marquee span::after { color: var(--bordo); }
.contact::before { background: radial-gradient(70% 90% at 85% 10%, rgb(159 3 49 / 0.4), transparent 60%), radial-gradient(60% 80% at 0% 100%, rgb(61 65 70 / 0.6), transparent 60%); }
.page-hero::before, .socio-hero::before { background: radial-gradient(80% 100% at 90% 0%, rgb(159 3 49 / 0.35), transparent 60%); }
.live::before { background: var(--bordo); }
:focus-visible { outline-color: #ffffff; }

/* Banner: foto inteira à direita, sombra só onde está o texto */
.hero__img { inset: 0 0 0 auto; width: 100%; }
.hero__img img { object-position: 50% 35%; animation: kenburns-lite 18s ease-out both; }
@keyframes kenburns-lite { from { transform: scale(1.06); } to { transform: scale(1); } }
.hero::before {
  background:
    linear-gradient(90deg, rgb(13 14 16 / 0.92) 0%, rgb(13 14 16 / 0.7) 26%, rgb(13 14 16 / 0.12) 48%, transparent 62%),
    linear-gradient(0deg, rgb(13 14 16 / 0.92) 0%, rgb(13 14 16 / 0.35) 20%, transparent 36%),
    linear-gradient(180deg, rgb(13 14 16 / 0.55) 0%, transparent 16%);
}
@media (min-width: 1040px) {
  .hero__img { width: 66%; }
  .hero__img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, var(--night) 0%, transparent 22%); }
  .hero::before { background: linear-gradient(0deg, rgb(13 14 16 / 0.9) 0%, rgb(13 14 16 / 0.3) 18%, transparent 32%), linear-gradient(180deg, rgb(13 14 16 / 0.5) 0%, transparent 14%); }
  .hero h1 { max-width: 11ch; }
}
.hero__grain { opacity: 0.04; }

/* ---------- v9: monograma "M" e linhas diagonais da identidade ---------- */
/* Ângulo das diagonais do monograma: ~60° (dx 26 / dy 44) */
.mmark { width: 56px; height: 45px; fill: none; stroke-width: 3.2; stroke-linecap: square; overflow: visible; }
.mmark .r { stroke: var(--bordo); }
.mmark .w { stroke: #fff; }
.light .mmark .w, .marble .mmark .w { stroke: var(--ink); }
.mmark path { stroke-dasharray: 80; stroke-dashoffset: 80; animation: draw 1100ms var(--ease) forwards; }
.mmark path:nth-child(2) { animation-delay: 120ms; } .mmark path:nth-child(3) { animation-delay: 220ms; }
.mmark path:nth-child(4) { animation-delay: 320ms; } .mmark path:nth-child(5) { animation-delay: 420ms; }
@keyframes draw { to { stroke-dashoffset: 0; } }

/* Rótulos: o traço horizontal vira as duas diagonais do M */
.kicker::before { width: 22px; height: 14px; background: linear-gradient(120deg, transparent 0 34%, var(--bordo) 34% 46%, transparent 46% 58%, currentColor 58% 70%, transparent 70%); opacity: 1; }
.light .kicker::before, .marble .kicker::before { background: linear-gradient(120deg, transparent 0 34%, var(--bordo) 34% 46%, transparent 46% 58%, var(--ink) 58% 70%, transparent 70%); }

/* Cortina de abertura: diagonais vermelha e branca cruzam a tela */
.curtain::after { display: none; }
.curtain { background: var(--night); animation: curtain-diag 1200ms var(--ease) 700ms forwards; }
.curtain::before, .curtain i { content: ''; }
.curtain::before { position: absolute; top: -20%; bottom: -20%; left: 42%; width: 14px; background: var(--bordo); transform: skewX(-30deg) scaleY(0); transform-origin: top; animation: bar 650ms var(--ease) forwards; }
.curtain span { position: absolute; top: -20%; bottom: -20%; width: 6px; background: #fff; transform: skewX(-30deg) scaleY(0); transform-origin: top; animation: bar 650ms var(--ease) forwards; }
.curtain span:nth-child(1) { left: 46%; animation-delay: 120ms; }
.curtain span:nth-child(2) { left: 39%; width: 4px; background: var(--bordo); animation-delay: 200ms; }
@keyframes bar { to { transform: skewX(-30deg) scaleY(1); } }
@keyframes curtain-diag { from { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); } to { clip-path: polygon(130% 0, 130% 0, 100% 100%, 100% 100%); visibility: hidden; } }

/* Transição entre páginas: varredura diagonal com as linhas do M */
::view-transition-old(root) { animation: vt-out-diag 520ms var(--ease) both; }
::view-transition-new(root) { animation: vt-in-diag 760ms var(--ease) both; }
@keyframes vt-out-diag { to { opacity: 0.2; transform: translateX(-3%); } }
@keyframes vt-in-diag { from { clip-path: polygon(0 0, 0 0, -30% 100%, -30% 100%); } to { clip-path: polygon(0 0, 130% 0, 100% 100%, -30% 100%); } }

/* Linhas laterais diagonais (banner, faixa da frase, páginas internas) */
.lines { position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 0; }
.lines i { position: absolute; top: -10%; bottom: -10%; width: 2px; background: var(--bordo); transform: skewX(-30deg); opacity: 0.9; animation: slide-line 1600ms var(--ease) both; }
.lines i:nth-child(1) { right: 14%; width: 10px; animation-delay: 200ms; }
.lines i:nth-child(2) { right: 18%; background: rgb(255 255 255 / 0.55); animation-delay: 320ms; }
.lines i:nth-child(3) { right: 21%; width: 4px; animation-delay: 440ms; }
@keyframes slide-line { from { transform: skewX(-30deg) translateY(-110%); } to { transform: skewX(-30deg) translateY(0); } }
.page-hero > .wrap, .socio-hero > .wrap, .area-hero > .wrap { position: relative; z-index: 1; }

.hero .lines { z-index: -1; left: auto; width: 40%; }
.hero .lines i:nth-child(1) { right: 6%; opacity: 0.85; }
.hero .lines i:nth-child(2) { right: 10%; opacity: 0.5; }
.hero .lines i:nth-child(3) { right: 12.5%; }

.quote-band::after { content: none; }
.quote-band .mwater { position: absolute; right: -40px; bottom: -60px; width: min(46vw, 560px); height: auto; opacity: 0.16; z-index: -1; }
.quote-band .mwater .r { stroke: #fff; } .quote-band .mwater .w { stroke: #fff; }
.quote-band .mwater path { animation: none; stroke-dashoffset: 0; }
.footer { position: relative; overflow: hidden; }
.footer .mwater { position: absolute; right: -30px; top: -20px; width: 300px; opacity: 0.08; }
.footer .mwater path { animation: none; stroke-dashoffset: 0; }

/* Cartões da equipe: faixa diagonal bordô ao passar o mouse */
.team-grid .person .ph::after { content: ''; position: absolute; top: -20%; bottom: -20%; left: -30%; width: 18%; z-index: 3; background: linear-gradient(90deg, var(--bordo) 0 60%, transparent 60% 74%, rgb(255 255 255 / 0.7) 74% 84%, transparent 84%); transform: skewX(-30deg) translateX(0); opacity: 0; transition: transform 900ms var(--ease), opacity 300ms; }
.team-grid .person:hover .ph::after { opacity: 1; transform: skewX(-30deg) translateX(820%); }

/* ---------- Mega menu ---------- */
.menu .mtrig { background: none; border: 0; padding: 8px 0; font: 500 14.5px/1 var(--f-body); color: rgb(255 255 255 / 0.82); cursor: pointer; display: inline-flex; gap: 8px; align-items: center; position: relative; }
.menu .mtrig::after { content: ''; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform 300ms var(--ease); }
.menu .mtrig[aria-expanded='true'] { color: #fff; }
.menu .mtrig[aria-expanded='true']::after { transform: translateY(2px) rotate(-135deg); }
.menu .mtrig:hover { color: #fff; }
.site-header.mega-open { background: rgb(21 23 26 / 0.97); backdrop-filter: blur(18px); border-color: var(--line-d); }
.mega { position: absolute; left: 0; right: 0; top: 100%; background: rgb(21 23 26 / 0.98); border-top: 1px solid var(--line-d); border-bottom: 1px solid var(--line-d); box-shadow: 0 40px 80px -30px rgb(0 0 0 / 0.7); backdrop-filter: blur(18px); overflow: hidden; }
.mega:not([hidden]) { animation: mega-in 420ms var(--ease) both; }
@keyframes mega-in { from { opacity: 0; clip-path: inset(0 0 100% 0); } to { opacity: 1; clip-path: inset(0); } }
.mega::before { content: ''; position: absolute; top: -10%; bottom: -10%; left: 30%; width: 8px; background: var(--bordo); transform: skewX(-30deg); opacity: 0.14; }
.mega__in { display: grid; grid-template-columns: minmax(220px, 0.8fr) 2fr; gap: 48px; padding-block: 40px 44px; position: relative; }
.mega__in:has(> :nth-child(3)) { grid-template-columns: minmax(220px, 0.8fr) 1.2fr 1fr; }
.mega__intro .mmark { margin-bottom: 18px; }
.mega__lead { font-family: var(--f-display); font-size: 1.45rem; line-height: 1.2; margin: 0 0 18px; color: #fff; max-width: 18ch; }
.mega__list, .mega__people, .mega__arts { list-style: none; margin: 0; padding: 0; }
.mega__list { display: grid; gap: 4px; }
.mega__list--2 { grid-template-columns: 1fr 1fr; gap: 4px 28px; }
.mega__list a { display: grid; gap: 4px; padding: 14px 16px; border-radius: 12px; text-decoration: none; transition: background 300ms; }
.mega__list a:hover, .mega__list a:focus-visible { background: rgb(255 255 255 / 0.06); }
.mega__list b { font-weight: 600; font-size: 15.5px; color: #fff; }
.mega__list small { font-size: 13.5px; color: var(--mist); }
.mega__people { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 20px; }
.mega__people a { display: grid; grid-template-columns: 56px 1fr; gap: 14px; align-items: center; padding: 10px; border-radius: 12px; text-decoration: none; transition: background 300ms; }
.mega__people a:hover { background: rgb(255 255 255 / 0.06); }
.mega__people img { width: 56px; height: 56px; object-fit: cover; border-radius: 50%; }
.mega__people b { display: block; font-weight: 600; font-size: 14.5px; line-height: 1.25; color: #fff; }
.mega__people small { font: 500 11.5px/1.4 var(--f-mono); letter-spacing: 0.1em; color: var(--mist); }
.mega__h { font: 500 11.5px/1 var(--f-mono); letter-spacing: 0.2em; text-transform: uppercase; color: #c9cbce; margin: 6px 0 12px; }
.mega__arts a { display: block; padding: 10px 0; border-bottom: 1px solid var(--line-d); text-decoration: none; font-size: 15px; color: #e6e7e8; transition: color 300ms, padding 400ms var(--ease); }
.mega__arts a:hover { color: #fff; padding-left: 8px; }
.mega__card { position: relative; border-radius: 16px; overflow: hidden; min-height: 220px; display: flex; align-items: end; text-decoration: none; box-shadow: var(--shadow-deep); }
.mega__card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mega__card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgb(13 14 16 / 0.9), transparent 70%); }
.mega__card span { position: relative; z-index: 1; padding: 20px; display: grid; gap: 4px; }
.mega__card small { font: 500 11.5px/1 var(--f-mono); letter-spacing: 0.18em; text-transform: uppercase; color: #c9cbce; }
.mega__card b { font-family: var(--f-display); font-weight: 400; font-size: 1.5rem; }
@media (max-width: 1039px) { .mega { display: none !important; } }

/* Gaveta móvel com subpáginas */
.drawer { gap: 0; overflow-y: auto; }
.drawer details { border-bottom: 1px solid var(--line-d); }
.drawer summary { font-family: var(--f-display); font-size: 1.9rem; padding: 12px 0; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.drawer summary::-webkit-details-marker { display: none; }
.drawer summary::after { content: '+'; font-family: var(--f-body); color: var(--bordo); font-size: 1.4rem; }
.drawer details[open] summary::after { content: '–'; }
.drawer details a { display: block; font-family: var(--f-body); font-size: 1rem; padding: 10px 0 10px 14px; border: 0; color: #d6d7d9; }
.drawer details[open] { padding-bottom: 12px; }
.drawer .drawer__cta { margin-top: 24px; font-family: var(--f-display); font-size: 1.9rem; border: 0; }

/* Páginas de área */
.area-hero { padding-bottom: 96px; }
.area-hero .lines i:nth-child(1) { right: 10%; }
.area-scope { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-l); }
.area-scope li { font-family: var(--f-display); font-size: clamp(1.3rem, 1.1rem + 0.8vw, 1.8rem); padding: 18px 0; border-bottom: 1px solid var(--line-l); }
.area-q { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.area-q li { padding-left: 26px; position: relative; color: var(--ink-2); font-size: 16px; }
.area-q li::before { content: ''; position: absolute; left: 0; top: 0.45em; width: 14px; height: 12px; background: linear-gradient(120deg, transparent 0 34%, var(--bordo) 34% 48%, transparent 48%); }
.area-others { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; background: var(--line-d); border: 1px solid var(--line-d); border-radius: 18px; overflow: hidden; }
.area-others a { display: grid; grid-template-columns: 3rem 1fr auto; gap: 16px; align-items: center; padding: 20px 24px; background: var(--night); text-decoration: none; transition: background 400ms; }
.area-others a:hover { background: rgb(159 3 49 / 0.35); }
.area-others .idx { font: 500 12px/1 var(--f-mono); color: var(--mist); }
.area-others b { font-family: var(--f-display); font-weight: 400; font-size: 1.4rem; }
@media (min-width: 860px) { .area-others { grid-template-columns: repeat(2, 1fr); } }

/* ajustes finos v9 */
.mega { background: #17191c; }
@media (min-width: 1040px) { .hero__img::after { background: linear-gradient(90deg, var(--night) 0%, transparent 9%); } }
.hero .lines { left: 0; right: auto; width: 100%; }
.hero .lines i:nth-child(1) { right: auto; left: 1.2%; width: 8px; opacity: 0.9; }
.hero .lines i:nth-child(2) { right: auto; left: 2.4%; opacity: 0.45; }
.hero .lines i:nth-child(3) { right: auto; left: 3.1%; width: 3px; }
@media (max-width: 700px) { .hero .lines { display: none; } }

/* v10: cartão da equipe sem mudança de cor — só a faixa diagonal da identidade */
.team-grid .person .ph::before { display: none; }
.team-grid .person:hover img { filter: none; }
.scroll-cue { display: none !important; }

/* ---------- Mapa de localização (carrega o Google Maps só com clique — LGPD) ---------- */
.mapa { display: grid; gap: 0; margin-top: 20px; border: 1px solid var(--line-d); border-radius: 20px; overflow: hidden; background: rgb(21 23 26 / 0.7); box-shadow: var(--shadow-deep); }
@media (min-width: 900px) { .mapa { grid-template-columns: 1.6fr 1fr; } }
.mapa__frame { position: relative; min-height: 340px; display: grid; place-items: center; align-content: center; gap: 14px; padding: 24px; text-align: center; isolation: isolate; overflow: hidden; }
.mapa__placeholder { position: absolute; inset: 0; z-index: -1; background:
  linear-gradient(120deg, transparent 0 48%, rgb(159 3 49 / 0.35) 48% 49%, transparent 49%),
  linear-gradient(60deg, transparent 0 62%, rgb(255 255 255 / 0.08) 62% 63%, transparent 63%),
  repeating-linear-gradient(0deg, rgb(255 255 255 / 0.04) 0 1px, transparent 1px 44px),
  repeating-linear-gradient(90deg, rgb(255 255 255 / 0.04) 0 1px, transparent 1px 44px),
  radial-gradient(60% 70% at 50% 45%, #23262b, #17191c); }
.mapa__pin { position: absolute; left: 50%; top: 38%; transform: translate(-50%, -50%); width: 70px; height: 70px; border-radius: 50%; background: rgb(21 23 26 / 0.9); border: 1px solid var(--line-d); display: grid; place-items: center; box-shadow: 0 0 0 10px rgb(159 3 49 / 0.15), 0 0 0 22px rgb(159 3 49 / 0.07); }
.mapa__pin .mmark { width: 34px; height: 28px; }
.mapa__load { margin-top: 110px; }
.mapa__note { font-size: 13px; color: var(--mist); margin: 0; }
.mapa__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(0.25) contrast(1.05); }
.mapa__info { padding: clamp(24px, 3vw, 36px); display: grid; align-content: center; gap: 6px; border-top: 1px solid var(--line-d); }
@media (min-width: 900px) { .mapa__info { border-top: 0; border-left: 1px solid var(--line-d); } }
.mapa__info b { font-family: var(--f-display); font-weight: 400; font-size: clamp(1.3rem, 1.1rem + 0.8vw, 1.7rem); line-height: 1.2; margin: 8px 0 4px; }
.mapa__info > span:not(.meta) { color: #c8cacd; font-size: 15px; }
.mapa__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.mapa__actions .btn { min-height: 46px; padding: 0 20px; }