/* Versão C (21/10/2026): a abertura vira um palco escuro com o CA em 3D (Three.js) atrás do retrato recortado;
   as seções claras ganham profundidade (inclinação 3D sob o cursor e cartas em perspectiva). */
:root { --noite: #121212; --noite-2: #1A1A1A; }

/* topo transparente sobre o palco escuro; volta ao claro ao sair dele */
.c3d .topo.sobre-palco { background: transparent; backdrop-filter: none; border-bottom-color: transparent; }
.c3d .topo.sobre-palco .marca span, .c3d .topo.sobre-palco .menu a { color: #EDEAE6; }
.c3d .topo.sobre-palco .marca img { filter: brightness(0) invert(1); }
.c3d .topo.sobre-palco .menu-botao span { background: #EDEAE6; }
.c3d .topo { position: fixed; left: 0; right: 0; }

/* ------------------------------------------------ palco */
.palco {
  position: relative; overflow: hidden; color: #EDEAE6;
  min-height: min(100svh, 980px);
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: 1fr auto;
  padding: 120px max(var(--margem), calc((100vw - var(--largura)) / 2 + var(--margem))) 0;
  background:
    radial-gradient(60% 70% at 72% 42%, rgba(196, 30, 58, .32), rgba(196, 30, 58, 0) 62%),
    radial-gradient(40% 50% at 15% 90%, rgba(255, 255, 255, .05), rgba(255, 255, 255, 0) 70%),
    linear-gradient(180deg, #0D0D0D 0%, var(--noite-2) 100%);
}
.palco::after {           /* grão fino, para o escuro não ficar chapado */
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .35; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}
.palco__texto { align-self: center; position: relative; z-index: 3; padding: 40px 0 56px; }
.palco__titulo { color: #FFFFFF; font-size: clamp(2.6rem, 5.4vw, 4.6rem); line-height: 1.02; font-weight: 700; letter-spacing: -.025em; }
.palco__titulo .linha { display: block; }
@media (min-width: 1100px) { .palco__titulo .linha { white-space: nowrap; } }
.palco__lead { color: #C9C4BE; font-size: 1.15rem; max-width: 44ch; margin: 30px 0 34px; }

.palco__visual { position: relative; z-index: 2; min-height: 560px; align-self: stretch; }
#ca3d { position: absolute; left: 2%; top: -4%; width: 112%; height: 96%; display: block; }
.palco__reserva { position: absolute; left: 6%; top: 8%; width: 82%; opacity: .9; }
.palco.com-3d .palco__reserva { display: none; }
.palco__retrato { position: absolute; z-index: 2; margin: 0; right: 0; bottom: 0; width: min(78%, 460px);
  will-change: transform; transition: transform .2s linear; }
.palco__retrato img { width: 100%; filter: drop-shadow(-18px 0 36px rgba(196, 30, 58, .35)) drop-shadow(0 24px 40px rgba(0,0,0,.55)); }
.palco__retrato figcaption { position: absolute; left: -46%; bottom: 120px; display: flex; flex-direction: column; gap: 2px;
  font: 400 .92rem/1.4 var(--texto); color: #B9B4AE; border-left: 2px solid var(--vermelho); padding-left: 12px; }
.palco__retrato figcaption strong { font: 600 1rem/1.3 var(--titulo); color: #FFFFFF; }

.palco__credenciais { grid-column: 1 / -1; position: relative; z-index: 4; list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(180deg, rgba(18,18,18,.0), rgba(18,18,18,.85) 40%); }
.palco__credenciais li { padding: 22px 20px 26px 0; display: flex; flex-direction: column; gap: 4px; font: 600 1.02rem/1.3 var(--titulo); color: #FFFFFF; }
.palco__credenciais li + li { padding-left: 22px; border-left: 1px solid rgba(255,255,255,.12); }
.palco__credenciais .credenciais__rotulo { color: #9C968F; }

/* a linha vermelha do título no palco escuro */
.c3d .linha--anotada::after { background: var(--vermelho); }

/* ------------------------------------------------ páginas de área */
.palco--area { min-height: min(86svh, 780px); }
.palco--area .palco__visual { min-height: 460px; }
.trilha { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 22px; font: 400 .9rem/1.4 var(--texto); color: #9C968F; }
.trilha a { color: #C9C4BE; text-decoration: underline; text-underline-offset: 3px; }
.trilha a:hover { color: #FFFFFF; }
.trilha [aria-current] { color: #EDEAE6; }
.separar { padding-top: 0; }
.separar__lista { list-style: none; margin: 0; padding: 0; max-width: 1000px; counter-reset: item;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; }
.separar__lista li { position: relative; padding: 20px 0 20px 48px; border-top: 1px solid var(--linha);
  font: 400 1.05rem/1.55 var(--texto); color: var(--tinta); }
.separar__lista li::before { counter-increment: item; content: counter(item, decimal-leading-zero);
  position: absolute; left: 0; top: 21px; font: 600 .95rem/1.4 var(--titulo); color: var(--vermelho); }
.separar__nota { margin: 28px 0 0; color: var(--grafite); font-size: 1.05rem; }
.outras-areas { padding-top: 0; }
.outras-areas__lista { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.outras-areas__lista a { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 20px;
  border: 1px solid var(--linha); border-radius: 999px; background: var(--branco); color: var(--tinta);
  font: 600 1rem/1 var(--titulo); text-decoration: none; transition: border-color .2s var(--ease), color .2s var(--ease); }
.outras-areas__lista a:hover, .outras-areas__lista a:focus-visible { border-color: var(--vermelho); color: var(--vermelho); }

/* ------------------------------------------------ página de texto (privacidade) */
.pagina-texto .texto-legal { max-width: 820px; padding-top: 140px; }
.texto-legal h1 { margin: 0 0 8px; }
.texto-legal h2 { font: 700 1.3rem/1.3 var(--titulo); margin: 40px 0 10px; color: var(--tinta); }
.texto-legal p { font: 400 1.05rem/1.7 var(--texto); color: var(--grafite); margin: 0 0 14px; max-width: 68ch; }
.texto-legal a { color: var(--vermelho); text-underline-offset: 3px; }
.texto-legal__data { color: var(--cinza) !important; font-size: .95rem !important; }
.trilha--clara { color: var(--cinza); }
.trilha--clara a { color: var(--grafite); }
.trilha--clara [aria-current] { color: var(--tinta); }
.rodape__legal a { color: inherit; text-underline-offset: 3px; }

/* ------------------------------------------------ profundidade nas seções */
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .c3d .situacoes { perspective: 1100px; background: transparent; border: 0; gap: 18px; }
  .c3d .situacao { border: 1px solid var(--linha); border-radius: 6px; transform-style: preserve-3d;
    transition: transform .35s var(--ease), box-shadow .35s var(--ease), background-color .25s var(--ease);
    transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); position: relative; overflow: hidden; }
  .c3d .situacao::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0;
    background: radial-gradient(420px circle at var(--gx, 50%) var(--gy, 50%), rgba(196, 30, 58, .10), transparent 60%);
    transition: opacity .3s var(--ease); }
  .c3d .situacao.inclinado { box-shadow: 0 30px 60px -30px rgba(26,26,26,.35); background: var(--branco); transition-duration: .08s; }
  .c3d .situacao.inclinado::after { opacity: 1; }
  /* sem translateZ nos filhos: com overflow hidden o cartão ficava por cima do link e o clique não chegava (01/11/2026) */

  /* a série: cartas em perspectiva que se abrem */
  .c3d .serie__posts { perspective: 1100px; transform-style: preserve-3d; }
  .c3d .serie__posts li { transform-style: preserve-3d; }   /* deixa a perspectiva da lista chegar aos cartões */
  .c3d .serie__posts li:nth-child(1) a { transform: rotateY(28deg) translateZ(-60px) translateX(30px); }
  .c3d .serie__posts li:nth-child(2) a { transform: rotateY(0deg) translateZ(40px) scale(1.04); z-index: 2; position: relative; }
  .c3d .serie__posts li:nth-child(3) a { transform: rotateY(-28deg) translateZ(-60px) translateX(-30px); }
  .c3d .serie__posts:hover li a { transform: rotateY(0) translateZ(0) translateX(0); }
  .c3d .serie__posts li a:hover { transform: translateZ(60px) scale(1.05) !important; }
  .c3d .serie__posts a { transition: transform .6s var(--ease); }

  .c3d .quem__retrato { perspective: 900px; }
  .c3d .quem__retrato .copia { transition: transform .35s var(--ease);
    transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); }
}

/* ------------------------------------------------ responsivo */
/* menu numa linha só: entre 900 e 1100 px some o nome ao lado do CA, que não cabia junto com o menu */
.menu a, .marca span { white-space: nowrap; }
@media (max-width: 1100px) and (min-width: 901px) {
  .marca span { display: none; }
  .menu { gap: 18px; }
}
@media (max-width: 900px) {
  .palco { grid-template-columns: 1fr; grid-template-rows: auto auto auto; padding-top: 96px; min-height: 0; }
  .palco__texto { padding: 16px 0 8px; }
  .palco__visual { min-height: 0; height: min(118vw, 560px); }
  .palco__retrato { right: 50%; transform: translateX(50%); width: min(74%, 380px); }
  .palco__retrato figcaption { left: auto; right: -12%; bottom: 40px; display: none; }
  #ca3d { left: -10%; right: -10%; width: 120%; top: 0; height: 90%; }
  .palco__credenciais { grid-template-columns: repeat(2, 1fr); }
  .palco__credenciais li:nth-child(3) { padding-left: 0; border-left: 0; }
  .palco__credenciais li:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.12); }
  .c3d .topo.sobre-palco { background: rgba(18,18,18,.6); backdrop-filter: blur(10px); }
  .palco--area .palco__visual { min-height: 0; height: min(44vw, 200px); }
  .palco--area .palco__reserva { width: auto; height: 100%; left: 50%; top: 0; transform: translateX(-50%); }
  .separar__lista { grid-template-columns: 1fr; }
  .c3d .menu.aberto { background: var(--papel); }
  .c3d .topo.sobre-palco .menu.aberto a { color: var(--tinta); }
}