/* Estilo do site lucassilva.art, versão Mar. Veio da prévia aprovada em outubro de 2026. */
/* Layout: abas como paginas (Inicio, Filmes, Raizes e Algoritmos, Fotografia, Blog, Sobre) e uma pagina por filme.
   Inicio = quatro videos em tela cheia, ondas entre secoes, destaque em papel, parceiros, fotografia, blog, contato.
   O visitante troca o fundo (mar escuro / mar claro) no cabecalho; o destaque e sempre turquesa. */
:root {
  color-scheme: dark;
  --bg: #071012;
  --surface: #0d1a1c;
  --text: #eaf2f0;
  --muted: #9db2ae;
  --line: #1d2f31;
  --accent: #1fb5a8;
  --on-accent: #04201e;
  --areia: #ece5d8;
  --tinta: #191814;
  --paper-accent: #0b6b64;
  --claro: #eef3f1;
  --claro-ink: #0b2427;
  --mar-fundo: #0a1c20;
  --font-display: "Anton", Impact, "Arial Narrow", sans-serif;
  --font-serif: "Cormorant Garamond", Garamond, Georgia, serif;
  --font-ui: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
}
:root[data-palette="light"] { color-scheme: light; --bg: #f2f6f4; --surface: #e3ecea; --text: #0b2427; --muted: #4b6662; --line: #c8d7d3; --claro: #ffffff; --accent: #0a746d; --on-accent: #ffffff; }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { background: var(--bg); color: var(--text); font: 16px/1.6 var(--font-ui); margin: 0; overflow-x: hidden; transition: background .4s, color .4s; }
a { color: inherit; }
img, video { max-width: 100%; }
.gut { padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
.wrap { max-width: 1280px; margin: 0 auto; }
.mono { font: 500 12px/1.5 var(--font-mono); letter-spacing: .04em; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
h1[tabindex="-1"]:focus { outline: none; }
.ico { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; display: block; }

/* ---------- Cabecalho ---------- */
.top { position: fixed; z-index: 50; inset: 0 0 auto; padding-top: env(safe-area-inset-top, 0px); transition: background .4s, border-color .4s, color .4s; border-bottom: 1px solid transparent; color: #eaf2f0; }
.top::before { content: ""; position: absolute; inset: 0; z-index: -1; transition: background .4s; pointer-events: none; }
.top.solid::before { background: color-mix(in srgb, var(--bg) 90%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.top.solid { border-bottom-color: var(--line); color: var(--text); }
.top.menu-open { color: var(--text); }
.top .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 12px; }
.brand { display: flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; flex: none; min-width: 0; }
/* Logo: Selo da tarrafa (sistema "Lucas Silva Pereira"). Símbolo de 40 px no cabeçalho, logo com o nome no rodapé. */
.brand .ls-sym { width: 44px; height: 44px; display: block; overflow: visible; flex: none; }
.ls-acc { stroke: var(--accent); }
.ls-spin { transform-box: view-box; transform-origin: 120px 120px; animation: lsSpin 40s linear infinite; }
.ls-pulse { animation: lsPulse 3.2s ease-in-out infinite; }
.ls-spin.ls-pulse-s { animation: lsSpin 40s linear infinite, lsPulseS 3.2s ease-in-out infinite; }
@keyframes lsSpin { to { transform: rotate(360deg); } }
@keyframes lsPulse { 50% { stroke-width: 9.5px; opacity: .6; } }
@keyframes lsPulseS { 50% { stroke-width: 20px; opacity: .6; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse { 50% { stroke-width: 7.5; opacity: .6; } }
.brand .wm { height: 19px; width: auto; display: block; }
@media (max-width: 420px) { .brand .wm { height: 14px; } }
.menu { display: flex; align-items: center; gap: 4px 22px; flex-wrap: wrap; justify-content: flex-end; }
.menu > a { text-decoration: none; font: 500 15px/1 var(--font-ui); padding: 14px 0; position: relative; white-space: nowrap; }
.menu > a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 6px; height: 2px; background: var(--accent); transition: right .3s; }
.menu > a:hover::after, .menu > a[aria-current="page"]::after { right: 0; }
.menu .lang { font: 500 13px/1 var(--font-mono); opacity: .75; padding: 14px 0; }
.menu .lang::after { display: none; }
.tools { display: flex; align-items: center; gap: 2px; }
.tools a, .tools button { position: relative; width: 40px; height: 44px; display: grid; place-items: center; border-radius: 50%; text-decoration: none; transition: color .25s, transform .25s; background: none; border: 0; color: inherit; cursor: pointer; padding: 0; }
.tools a:hover, .tools button:hover { color: var(--accent); transform: translateY(-2px); }
.tools a.wa { width: 44px; height: 44px; background: var(--accent); color: var(--on-accent); margin-left: 6px; }
.tools a.wa:hover { color: var(--on-accent); }
.tools a.wa::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--accent); animation: ping 2.6s infinite; pointer-events: none; }
.tools .theme { border: 1px solid color-mix(in srgb, currentColor 35%, transparent); width: 40px; height: 40px; margin-left: 4px; }
.burger { display: none; background: none; border: 1.5px solid currentColor; color: inherit; font: 600 14px/1 var(--font-ui); padding: 12px 14px; min-height: 44px; cursor: pointer; flex: none; }
@media (max-width: 1100px) {
  .burger { display: inline-flex; align-items: center; }
  .menu { position: fixed; inset: 0; z-index: -1; background: var(--bg); color: var(--text); flex-direction: column; align-items: flex-start; justify-content: center; gap: 4px; padding: 80px max(24px, env(safe-area-inset-left, 0px)); transform: translateY(-100%); visibility: hidden; transition: transform .45s cubic-bezier(.7,0,.2,1), visibility 0s linear .45s; overflow-y: auto; }
  .menu.open { transform: none; visibility: visible; transition: transform .45s cubic-bezier(.7,0,.2,1), visibility 0s; }
  .menu > a { font: 400 clamp(32px, 8vw, 44px)/1.1 var(--font-display); text-transform: uppercase; padding: 6px 0; white-space: normal; }
  .menu .lang { font-size: 15px; }
  .tools { margin-top: 18px; }
}

.view { display: none; }
.view.on { display: block; }

/* ---------- Hero ---------- */
.hero { position: relative; height: 100svh; min-height: 520px; overflow: hidden; background: #0b1618; }
.hero video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1.4s ease; transform: scale(1.03); }
.hero video.on { opacity: 1; animation: drift 22s linear forwards; }
@keyframes drift { from { transform: scale(1.03); } to { transform: scale(1.06); } }
.grain { position: absolute; inset: 0; pointer-events: none; opacity: .1; mix-blend-mode: overlay; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); animation: grain 1s steps(6) infinite; }
@keyframes grain { 0%{transform:translate(0,0)} 33%{transform:translate(-3%,2%)} 66%{transform:translate(2%,-3%)} 100%{transform:translate(0,0)} }
.hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5,12,13,.5) 0%, transparent 20%, transparent 62%, rgba(5,12,13,.6) 100%); pointer-events: none; }
.hud { position: absolute; z-index: 3; left: 0; right: 0; bottom: 100px; color: rgba(234,242,240,.88); }
.hud .wrap { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.hud .now { display: flex; flex-direction: column; gap: 6px; max-width: 70ch; min-width: 0; text-decoration: none; }
.hud .now small { display: flex; gap: 10px; align-items: center; }
.hud .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); animation: rec 1.6s infinite; }
@keyframes rec { 50% { opacity: .2; } }
.hud .now strong { font: 400 clamp(18px, 2.2vw, 26px)/1.1 var(--font-display); text-transform: uppercase; letter-spacing: .02em; color: #fff; transition: opacity .3s; text-shadow: 0 1px 12px rgba(0,0,0,.4); }
.hud .now:hover strong { color: #9fe8df; }
.hud .ticks { display: flex; gap: 6px; }
.hud .ticks button { width: 38px; height: 24px; padding: 11px 0; background: none; border: 0; cursor: pointer; }
.hud .ticks button i { display: block; height: 2px; background: rgba(234,242,240,.3); position: relative; overflow: hidden; }
.hud .ticks button.on i::after { content: ""; position: absolute; inset: 0; background: #1fb5a8; transform-origin: left; animation: fill var(--dur, 10s) linear var(--delay, 0s) forwards; }
@keyframes fill { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.pausebtn { background: rgba(5,12,13,.45); border: 1px solid rgba(234,242,240,.3); color: #eaf2f0; font: 500 12px/1 var(--font-mono); padding: 12px 14px; min-height: 44px; cursor: pointer; }

/* ---------- Ondas ---------- */
.wv { position: relative; height: 90px; margin-top: -89px; z-index: 4; pointer-events: none; }
.wv svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.wv .back { opacity: .45; }

/* ---------- Midia ---------- */
.scene { position: relative; overflow: hidden; background: #22302f; aspect-ratio: 2.39 / 1; max-width: 100%; }
.scene video, .scene img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.2s cubic-bezier(.2,.7,.2,1), filter .9s; }
.scene.bw video, .scene.bw img { filter: grayscale(1) contrast(1.06); }
@media (hover: hover) { .scene.bw:hover video, .scene.bw:hover img { filter: none; } }
@media (hover: none) { .scene.bw video, .scene.bw img { filter: none; } .hint-hover { display: none; } }
.sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.scene .cap { position: absolute; z-index: 2; left: 12px; bottom: 10px; font: 500 11px/1 var(--font-mono); color: rgba(255,255,255,.88); text-shadow: 0 1px 6px rgba(0,0,0,.6); }
.kb img { animation: kb 16s ease-in-out infinite alternate; }
@keyframes kb { from { transform: scale(1); } to { transform: scale(1.1); } }

/* ---------- Papel (Arquivo) ---------- */
.arquivo { background: var(--areia); color: var(--tinta); position: relative; }
.arquivo .wrap { padding-block: clamp(40px, 7vw, 96px) clamp(56px, 8vw, 104px); }
.kicker { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; color: #5f5a4f; }
.kicker .pill { border: 1px solid currentColor; padding: 6px 10px; border-radius: 999px; }
.arquivo h2 { font: 400 clamp(44px, 7.4vw, 112px)/.95 var(--font-serif); letter-spacing: -.015em; margin: 22px 0 0; max-width: 18ch; text-wrap: balance; }
.arquivo h2 i { font-style: italic; color: var(--paper-accent); }
.arquivo .row { display: grid; grid-template-columns: 1fr; gap: 32px 64px; margin-top: clamp(32px, 5vw, 64px); }
@media (min-width: 960px) { .arquivo .row { grid-template-columns: 7fr 5fr; } }
.arquivo .row > * { min-width: 0; }
.lead { font: 400 clamp(20px, 2vw, 25px)/1.5 var(--font-serif); margin: 22px 0 0; max-width: 60ch; }
.lead + .lead { margin-top: 14px; }
.masters { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); border-top: 1px solid var(--tinta); margin-top: 28px; }
.masters div { padding: 14px 12px 14px 0; border-bottom: 1px solid #cdc4b3; }
.masters strong { display: block; font: 600 26px/1.1 var(--font-serif); }
.masters span { font: 400 12px/1.4 var(--font-mono); color: #6b655a; }
.ficha { margin: 0; display: grid; grid-template-columns: minmax(0, auto) minmax(0, 1fr); border-top: 1px solid currentColor; }
.ficha dt, .ficha dd { margin: 0; padding: 11px 0; border-bottom: 1px solid color-mix(in srgb, currentColor 20%, transparent); font: 400 13px/1.45 var(--font-mono); }
.ficha dt { opacity: .7; padding-right: 20px; text-transform: uppercase; letter-spacing: .05em; font-size: 11px; padding-top: 13px; }
.ficha dd { overflow-wrap: anywhere; }
@media (max-width: 520px) { .ficha { grid-template-columns: 1fr; } .ficha dt { border-bottom: 0; padding-bottom: 0; } .ficha dd { padding-top: 4px; } }
.statement { margin: 28px 0 0; padding: 0 0 0 18px; border-left: 3px solid var(--paper-accent); font: italic 400 21px/1.5 var(--font-serif); color: #3a372f; }
.seguir { display: inline-flex; align-items: center; gap: 12px; margin-top: 28px; font: 500 13px/1 var(--font-ui); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; border-bottom: 1px solid currentColor; padding: 12px 0 8px; }
.seguir span { transition: transform .3s; }
.seguir:hover span { transform: translateX(6px); }
.duo { display: grid; grid-template-columns: 1fr; gap: 40px 48px; border-top: 1px solid var(--tinta); padding-top: 40px; margin-top: clamp(48px, 7vw, 88px); }
@media (min-width: 820px) { .duo { grid-template-columns: 1fr 1fr; } }
.duo a { text-decoration: none; display: block; }
.duo .scene { aspect-ratio: 16 / 9; }
.duo h3 { font: 600 clamp(28px, 3vw, 38px)/1.05 var(--font-serif); margin: 18px 0 8px; }
.duo p { font: 400 19px/1.5 var(--font-serif); margin: 0 0 12px; color: #3a372f; }
.duo .mono { color: #6b655a; }

/* ---------- Parceiros ---------- */
.parc { background: var(--mar-fundo); color: #eaf2f0; overflow: hidden; white-space: nowrap; display: flex; align-items: stretch; border-block: 1px solid #16333a; }
.parc .lbl { flex: none; font: 500 12px/1 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; padding: 0 22px 0 max(20px, env(safe-area-inset-left, 0px)); border-right: 1px solid #1f3d44; display: flex; align-items: center; background: var(--mar-fundo); color: #1fb5a8; position: relative; z-index: 2; }
.parc .viewport { overflow: hidden; flex: 1; min-width: 0; }
.parc .track { display: inline-flex; width: max-content; align-items: center; padding-block: 18px; animation: slide 36s linear infinite; }
.parc .track > * { margin-right: 72px; }
.parc:hover .track, .parc:focus-within .track, .parc.hold .track { animation-play-state: paused; }
.parc .lg { display: inline-flex; align-items: center; height: 68px; flex: none; }
.parc .lg img { height: 100%; width: auto; display: block; }
.parc .lg.wide img { height: 34px; }
.parc .lg.tall { height: 80px; }
.parc .lg.white img { filter: brightness(0) invert(1); }
.parc .lg.txt { font: 400 26px/1 var(--font-display); text-transform: uppercase; letter-spacing: .03em; height: auto; }
@keyframes slide { to { transform: translateX(-50%); } }

/* ---------- Faixa Raizes ---------- */
.raizes-band { position: relative; overflow: hidden; }
.raizes-band .wrap { display: grid; grid-template-columns: 1fr; gap: 24px 56px; padding-block: clamp(48px, 7vw, 96px); align-items: center; }
@media (min-width: 900px) { .raizes-band .wrap { grid-template-columns: 7fr 5fr; } }
.raizes-band .rz-txt h2 { margin-bottom: 24px; }
.rz-foto { display: block; position: relative; text-decoration: none; color: inherit; }
.rz-foto img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 4px; outline: 1px solid rgba(159,232,223,.35); outline-offset: 8px; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.rz-foto:hover img { transform: scale(1.02); }
.rz-foto::after { content: ""; position: absolute; left: 50%; top: calc(50% - 16px); width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; background: rgba(4,10,12,.55) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 7l9 5-9 5z' fill='%23fff'/%3E%3C/svg%3E") center/28px no-repeat; transition: background-color .3s; }
.rz-foto:hover::after { background-color: var(--accent); }
.rz-foto span { display: block; margin-top: 18px; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.raizes-band h2 { font: 400 clamp(44px, 7vw, 100px)/.9 var(--font-display); text-transform: uppercase; margin: 0; }
.raizes-band h2 span { color: var(--accent); }
.raizes-band p { color: var(--muted); margin: 0 0 16px; max-width: 56ch; }
.ep-strip { display: flex; flex-wrap: wrap; gap: 8px; }
.ep-strip span { font: 500 12px/1 var(--font-mono); border: 1px solid var(--line); padding: 9px 10px; border-radius: 999px; }

/* ---------- Fotografia ---------- */
.foto { background: var(--claro); color: var(--claro-ink); padding-block: clamp(48px, 8vw, 104px) clamp(80px, 10vw, 130px); overflow: hidden; transition: background .4s; }
.foto-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px 40px; margin-bottom: 36px; }
.ghost { font: 400 clamp(52px, 10.5vw, 170px)/.82 var(--font-display); text-transform: uppercase; margin: 0; color: transparent; -webkit-text-stroke: 1.5px color-mix(in srgb, var(--claro-ink) 55%, transparent); max-width: 100%; }
.foto-head p { max-width: 42ch; color: #4b6662; margin: 0; }
.belt { display: flex; width: max-content; animation: slide 80s linear infinite; }
.belt > * { margin-right: 14px; }
.belt.rev { animation-direction: reverse; animation-duration: 94s; margin-top: 14px; }
.foto:hover .belt, .foto:focus-within .belt { animation-play-state: paused; }
.shot { position: relative; height: clamp(260px, 30vw, 420px); overflow: hidden; flex: none; text-decoration: none; color: #fff; display: block; background: #c9d6d3; }
.shot.p { aspect-ratio: 2 / 3; }
.shot.l { aspect-ratio: 3 / 2; }
.shot img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.shot:hover img { transform: scale(1.06); }
.shot b { position: absolute; z-index: 2; left: 14px; right: 14px; bottom: 12px; font: 400 20px/1.05 var(--font-display); text-transform: uppercase; transform: translateY(8px); opacity: 0; transition: transform .35s, opacity .35s; }
.shot:hover b { transform: none; opacity: 1; }
.shot::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 60%, rgba(0,0,0,.55)); opacity: 0; transition: opacity .35s; }
.shot:hover::after { opacity: 1; }
.foto .seguir { color: var(--claro-ink); }

/* ---------- Blog ---------- */
.news { padding-block: clamp(40px, 7vw, 96px) clamp(80px, 10vw, 130px); }
.news-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 28px; }
.news-head h2 { font: 400 clamp(40px, 6vw, 80px)/.9 var(--font-display); text-transform: uppercase; margin: 0; }
.posts { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 28px 24px; }
.post { text-decoration: none; display: block; min-width: 0; }
.post .scene { aspect-ratio: 16 / 10; margin-bottom: 14px; }
.post:hover .scene img { transform: scale(1.05); }
.post .k { color: var(--accent); }
.post h3 { font: 600 23px/1.2 var(--font-ui); margin: 6px 0 8px; letter-spacing: -.01em; }
.post p { color: var(--muted); margin: 0; font-size: 15px; }
.post:hover h3 { color: var(--accent); }

/* ---------- Contato ---------- */
.contato { background: var(--surface); transition: background .4s; }
.contato .wrap { display: grid; grid-template-columns: 1fr; gap: 28px 64px; padding-block: clamp(40px, 6vw, 80px) clamp(48px, 7vw, 96px); }
@media (min-width: 900px) { .contato .wrap { grid-template-columns: 6fr 5fr; align-items: end; } }
.contato h2 { font: 400 clamp(44px, 7vw, 104px)/.92 var(--font-display); text-transform: uppercase; margin: 0; }
.contato h2 span { color: var(--accent); }
.contato p { color: var(--muted); margin: 0 0 20px; max-width: 54ch; }
.wa-big { display: inline-flex; align-items: center; gap: 14px; background: var(--accent); color: var(--on-accent); text-decoration: none; font: 400 18px/1 var(--font-display); letter-spacing: .05em; text-transform: uppercase; padding: 14px 22px 14px 14px; min-height: 56px; }
.wa-big .ico { width: 28px; height: 28px; }

/* ---------- Rodape ---------- */
footer { background: var(--surface); border-top: 1px solid var(--line); color: var(--muted); }
footer .grid { display: grid; grid-template-columns: 1fr; gap: 32px 48px; padding-block: 48px 28px; }
@media (min-width: 820px) { footer .grid { grid-template-columns: 5fr 3fr 4fr; } }
footer .grid > * { min-width: 0; }
footer .fb { display: flex; flex-direction: column; gap: 18px; align-items: flex-start; color: var(--text); }
footer .fb-logo { display: block; color: var(--text); padding: 6px; margin: -6px; }
footer .ls-logo { width: 184px; height: 184px; display: block; overflow: visible; }
footer .fb strong { display: block; font: 400 26px/1.05 var(--font-display); text-transform: uppercase; letter-spacing: .02em; }
footer .fb span { display: block; color: var(--muted); font-size: 15px; margin-top: 6px; }
footer h4 { font: 500 12px/1 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--accent); margin: 6px 0 14px; }
footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
footer ul a { text-decoration: none; display: inline-block; padding: 6px 0; }
footer ul a:hover { color: var(--text); }
footer .contact a { color: var(--text); text-decoration: none; }
footer .contact .tools { margin-left: -8px; margin-top: 8px; color: var(--text); }
footer .legal { border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding-block: 18px 32px; font-size: 13px; }

/* ---------- Paginas internas ---------- */
.page-head { padding-top: calc(env(safe-area-inset-top, 0px) + 120px); padding-bottom: 20px; }
.page-head h1 { font: 400 clamp(44px, 12vw, 190px)/.85 var(--font-display); text-transform: uppercase; margin: 0; overflow-wrap: anywhere; }
.page-head .crumb { display: block; margin-bottom: 28px; font: 500 12px/1.4 var(--font-mono); color: var(--muted); }
.page-head .crumb a { text-decoration: none; }
.page-head .crumb a:hover { color: var(--accent); }
.page-head h1 { padding-top: .06em; }
.page-head p { color: var(--muted); max-width: 60ch; margin: 18px 0 0; }
.foto-topo.com-fundo { position: relative; overflow: hidden; margin-bottom: 28px; }
.foto-topo.com-fundo .page-head { position: relative; z-index: 2; min-height: min(68vh, 640px); display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: 64px; color: #fff; }
.foto-topo.com-fundo .page-head p { color: rgba(255,255,255,.86); }
.foto-fundo { position: absolute; inset: 0; z-index: 0; background: #0b1618; }
.foto-fundo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; animation: fotoFundo 30s linear infinite; animation-delay: calc(var(--i) * 6s - 1.5s); }
.foto-fundo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(4,10,12,.45) 0%, rgba(4,10,12,.2) 35%, rgba(4,10,12,.62) 82%, rgba(4,10,12,.75) 100%); }
@keyframes fotoFundo { 0% { opacity: 0; transform: scale(1.08); } 5% { opacity: 1; } 20% { opacity: 1; } 25% { opacity: 0; transform: scale(1); } 100% { opacity: 0; transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .foto-fundo img { animation: none; } .foto-fundo img:first-child { opacity: 1; } }
.filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 28px 0 8px; }
.filters button { background: none; color: var(--text); border: 1px solid var(--line); font: 500 14px/1 var(--font-ui); padding: 12px 16px; min-height: 44px; cursor: pointer; }
.filters button[aria-pressed="true"] { background: var(--text); color: var(--bg); border-color: var(--text); }
.films { display: grid; grid-template-columns: 1fr; gap: 48px 32px; padding-block: 32px 96px; }
@media (min-width: 780px) { .films { grid-template-columns: 1fr 1fr; } .films .card.wide { grid-column: 1 / -1; } }
.card { text-decoration: none; display: block; }
.card .scene { aspect-ratio: 4 / 3; }
.card.wide .scene { aspect-ratio: 21 / 9; }
.card:hover .scene video, .card:hover .scene img { transform: scale(1.05); }
.play { position: absolute; z-index: 3; left: 50%; top: 50%; width: 72px; height: 72px; margin: -36px 0 0 -36px; border-radius: 50%; background: var(--accent); display: grid; place-items: center; }
.play::before { content: ""; border-left: 18px solid var(--on-accent); border-top: 11px solid transparent; border-bottom: 11px solid transparent; margin-left: 6px; }
.play::after { content: ""; position: absolute; inset: -12px; border-radius: 50%; border: 2px solid var(--accent); animation: ping 2.4s infinite; }
@keyframes ping { 0% { transform: scale(.85); opacity: .9; } 100% { transform: scale(1.35); opacity: 0; } }
.card h2 { font: 400 clamp(30px, 4vw, 54px)/.95 var(--font-display); text-transform: uppercase; margin: 18px 0 10px; overflow-wrap: anywhere; }
.card .tag { display: inline-flex; gap: 8px; align-items: center; font: 500 14px/1.4 var(--font-ui); color: var(--muted); }
.card .tag::before { content: ""; width: 12px; height: 12px; border-radius: 50%; border: 3px solid var(--accent); flex: none; }
.card[hidden] { display: none; }

/* pagina de filme */
.film-head { padding-top: calc(env(safe-area-inset-top, 0px) + 110px); }
.crumb { font: 500 12px/1.4 var(--font-mono); color: var(--muted); }
.crumb a { text-decoration: none; }
.crumb a:hover { color: var(--accent); }
.film-head h1 { font: 400 clamp(46px, 8vw, 120px)/.9 var(--font-display); text-transform: uppercase; margin: 14px 0 10px; overflow-wrap: anywhere; text-wrap: balance; }
.film-head .en { font: italic 400 clamp(20px, 2.4vw, 28px)/1.3 var(--font-serif); color: var(--muted); margin: 0; }
.meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; }
.meta span { font: 500 12px/1 var(--font-mono); border: 1px solid var(--line); padding: 9px 11px; border-radius: 999px; }
.meta span.st { border-color: var(--accent); color: var(--accent); }
.player { margin-top: 28px; aspect-ratio: 16 / 9; }
.player .watch { position: absolute; z-index: 3; left: 50%; top: 50%; transform: translate(-50%, -50%); display: inline-flex; align-items: center; gap: 12px; background: var(--accent); color: var(--on-accent); text-decoration: none; font: 400 18px/1 var(--font-display); letter-spacing: .05em; text-transform: uppercase; padding: 16px 22px 16px 16px; border-radius: 999px; white-space: nowrap; }
@media (max-width: 520px) { .player .watch { font-size: 15px; padding: 10px 16px 10px 10px; } .player .note { display: none; } }
.player .watch i { width: 30px; height: 30px; border-radius: 50%; background: var(--on-accent); display: grid; place-items: center; }
.player .watch i::before { content: ""; border-left: 10px solid var(--accent); border-top: 6px solid transparent; border-bottom: 6px solid transparent; margin-left: 3px; }
.player .note { position: absolute; z-index: 3; right: 12px; bottom: 10px; font: 500 11px/1.3 var(--font-mono); color: rgba(255,255,255,.85); text-shadow: 0 1px 6px rgba(0,0,0,.6); max-width: 60%; text-align: right; }
.laurels { display: flex; flex-wrap: wrap; gap: 10px 28px; margin: 26px 0 0; }
.laurels span { font: italic 400 19px/1.3 var(--font-serif); display: inline-flex; gap: 10px; align-items: center; }
.laurels span::before { content: "✺"; font-style: normal; color: var(--accent); font-size: 14px; }
.film-body { display: grid; grid-template-columns: 1fr; gap: 40px 64px; padding-block: 48px 24px; }
@media (min-width: 960px) { .film-body { grid-template-columns: 7fr 5fr; } }
.film-body > * { min-width: 0; }
.film-body h2, .stills-head h2, .eps-head h2 { font: 500 12px/1 var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--accent); margin: 0 0 16px; }
.synopsis p { font: 400 clamp(19px, 1.8vw, 23px)/1.55 var(--font-serif); margin: 0 0 16px; }
.cast { margin-top: 28px; }
.cast ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; font: 400 18px/1.4 var(--font-serif); }
.links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.links a { font: 500 13px/1 var(--font-ui); border: 1px solid var(--line); padding: 12px 14px; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.links a:hover { border-color: var(--accent); color: var(--accent); }
.stills { padding-block: 24px 40px; }
.stills-grid { columns: 3 280px; column-gap: 12px; }
.stills-grid button { display: block; width: 100%; margin: 0 0 12px; padding: 0; border: 0; background: none; cursor: zoom-in; break-inside: avoid; overflow: hidden; }
.stills-grid img { width: 100%; height: auto; display: block; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.stills-grid button:hover img { transform: scale(1.04); }
.next-film { display: block; border-top: 1px solid var(--line); padding-block: 36px 96px; text-decoration: none; }
.next-film small { font: 500 12px/1 var(--font-mono); color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.next-film strong { display: block; font: 400 clamp(36px, 6vw, 80px)/.95 var(--font-display); text-transform: uppercase; margin-top: 10px; }
.next-film:hover strong { color: var(--accent); }
.vid-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.vid-list li a { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.vid-list li a:hover { color: var(--accent); }

/* lightbox */
.lb { position: fixed; inset: 0; z-index: 80; background: rgba(4,9,10,.94); display: grid; place-items: center; padding: max(20px, env(safe-area-inset-top, 0px)) 16px; }
.lb[hidden] { display: none; }
.lb img { max-width: min(1400px, 100%); max-height: 86vh; width: auto; height: auto; }
.lb button { position: absolute; background: rgba(255,255,255,.08); color: #fff; border: 1px solid rgba(255,255,255,.25); min-width: 48px; min-height: 48px; font: 500 16px/1 var(--font-ui); cursor: pointer; border-radius: 50%; }
.lb .x { top: calc(env(safe-area-inset-top, 0px) + 16px); right: 16px; }
.lb .pv { left: 16px; top: 50%; }
.lb .nx { right: 16px; top: 50%; }

/* Raizes */
.rz-intro { display: grid; grid-template-columns: 1fr; gap: 32px 64px; padding-block: 24px 40px; }
@media (min-width: 960px) { .rz-intro { grid-template-columns: 7fr 5fr; } }
.rz-intro > * { min-width: 0; }
.eps { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.eps li { border-bottom: 1px solid var(--line); }
.eps .ep { display: grid; grid-template-columns: 4.2em minmax(0, 1fr); gap: 4px 20px; align-items: baseline; padding-block: 22px; text-decoration: none; }
@media (min-width: 900px) { .eps .ep { grid-template-columns: 5em minmax(0, 1fr) 14em 9em; } }
.eps .n { font: 400 clamp(34px, 4vw, 52px)/1 var(--font-display); color: var(--accent); font-variant-numeric: tabular-nums; }
.eps .t { font: 600 clamp(19px, 2vw, 25px)/1.25 var(--font-ui); }
.eps .t small { display: block; font: 400 15px/1.4 var(--font-ui); color: var(--muted); margin-top: 6px; }
.eps .pl, .eps .go { font: 500 12px/1.4 var(--font-mono); color: var(--muted); grid-column: 2; }
@media (min-width: 900px) { .eps .pl, .eps .go { grid-column: auto; } }
.eps a.tt { text-decoration: none; }
.eps a.tt:hover, .eps .ep:hover a.tt { color: var(--accent); }
.eps small a { color: var(--text); }
.eps small a:hover { color: var(--accent); }
.eps a.go { text-decoration: none; }
.eps .go b { color: var(--accent); font-weight: 500; }
.eps .t small { display: block; }
.eps .soon .n { color: var(--muted); }

.cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 28px 24px; padding-block: 28px 96px; }
.cols .shot { height: auto; aspect-ratio: 4 / 5; }
.cols .shot b, .cols .shot::after { opacity: 1; transform: none; }
.bloglist { list-style: none; margin: 0; padding: 28px 0 96px; }
.bloglist li { border-top: 1px solid var(--line); }
.bloglist article { display: grid; grid-template-columns: 1fr; gap: 14px 32px; padding-block: 28px; }
@media (min-width: 820px) { .bloglist article { grid-template-columns: 300px minmax(0, 1fr); } }
.bloglist .scene { aspect-ratio: 16 / 10; }
.bloglist h2 { font: 400 clamp(26px, 3.2vw, 42px)/1 var(--font-display); text-transform: uppercase; margin: 8px 0 12px; overflow-wrap: anywhere; }
.bloglist p { color: var(--muted); margin: 0; max-width: 64ch; }
.bloglist .k { color: var(--accent); }
.about { display: grid; grid-template-columns: 1fr; gap: 32px 64px; padding-block: 28px 96px; }
@media (min-width: 900px) { .about { grid-template-columns: 5fr 6fr; } }
.about > * { min-width: 0; }
.about .scene { aspect-ratio: 4 / 5; }
.about p { font: 400 21px/1.55 var(--font-serif); margin: 0 0 16px; }
.about ul { list-style: none; padding: 0; margin: 24px 0 0; border-top: 1px solid var(--line); }
.about li { border-bottom: 1px solid var(--line); padding: 12px 0; font: 400 14px/1.4 var(--font-mono); color: var(--muted); }


/* louros */
.louros-band { background: var(--mar-fundo); color: #eaf2f0; padding: 26px 0 30px; overflow: hidden; }
.louros-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; max-width: 1280px; margin: 0 auto 14px; }
.louros-head h2 { margin: 0; color: #1fb5a8; letter-spacing: .08em; text-transform: uppercase; font-size: 12px; }
.louros-head span { color: #9db2ae; }
.louros-band .viewport { overflow: hidden; }
.louros-band .track { display: inline-flex; width: max-content; align-items: center; animation: slide 60s linear infinite; white-space: nowrap; }
.louros-band .track > * { margin-right: 44px; }
.louros-band:hover .track, .louros-band:focus-within .track, .louros-band.hold .track { animation-play-state: paused; }
.louros-band img { height: 104px; width: auto; display: block; flex: none; }
.louros-grid-band { background: var(--mar-fundo); color: #eaf2f0; padding: 20px 0 22px; margin: 8px 0 40px; }
.louros-grid-band h2 { margin: 0 0 14px; color: #1fb5a8; letter-spacing: .08em; text-transform: uppercase; font-size: 12px; }
.louros-grid { display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: center; }
.louros-grid img { height: 64px; width: auto; max-width: 150px; object-fit: contain; display: block; }
@media (max-width: 600px) { .louros-grid img { height: 52px; } }
.film-louros { margin-top: 26px; }
.film-louros .louros-grid-band { margin: 0; }
/* episodios com imagem */
.eps .ep { grid-template-columns: minmax(96px, 30%) minmax(0, 1fr); gap: 6px 18px; align-items: start; }
.eps .thumb { grid-row: span 3; position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--surface); }
.eps .thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.eps .ep:hover .thumb img { transform: scale(1.05); }
.eps .thumb { display: block; }
.eps .thumb .n { position: absolute; left: 8px; bottom: 4px; z-index: 2; font-size: clamp(26px, 3vw, 40px); color: #fff; text-shadow: 0 2px 14px rgba(0,0,0,.55); }
.eps .thumb.vazio { background: radial-gradient(120% 140% at 0% 100%, color-mix(in srgb, var(--accent) 55%, #04201e) 0%, #071012 70%); }
.eps .thumb.vazio::before { content: ""; position: absolute; inset: 0; opacity: .14; background-image: repeating-linear-gradient(45deg, #fff 0 1px, transparent 1px 14px), repeating-linear-gradient(-45deg, #fff 0 1px, transparent 1px 14px); }
.eps .t, .eps .pl, .eps .go { grid-column: 2; }
.eps .pl { margin-top: 2px; }
@media (min-width: 900px) {
  .eps .ep { grid-template-columns: 260px minmax(0, 1fr) 14em 8em; align-items: center; }
  .eps .thumb { grid-row: auto; }
  .eps .t { grid-column: 2; } .eps .pl { grid-column: 3; margin: 0; } .eps .go { grid-column: 4; }
}
.rz-fotos { margin-top: 56px; }
.rz-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; }
.rz-grid figure { margin: 0; }
.rz-grid button { display: block; width: 100%; aspect-ratio: 4 / 5; padding: 0; border: 0; background: var(--surface); cursor: zoom-in; overflow: hidden; position: relative; }
.rz-grid img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.rz-grid button:hover img { transform: scale(1.05); }
.rz-grid figcaption { font: 600 15px/1.3 var(--font-ui); margin-top: 8px; }
.rz-grid figcaption small { display: block; font: 400 13px/1.4 var(--font-ui); color: var(--muted); margin-top: 2px; }
/* ensaios */
.cols .shot small { position: absolute; z-index: 2; left: 14px; top: 12px; font: 500 11px/1 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; background: rgba(4,9,10,.55); padding: 7px 9px; }
.ensaio-head { padding-top: calc(env(safe-area-inset-top, 0px) + 110px); padding-bottom: 28px; }
.ensaio-head h1 { font: 400 clamp(44px, 9vw, 130px)/.9 var(--font-display); text-transform: uppercase; margin: 22px 0 14px; overflow-wrap: anywhere; padding-top: .06em; }
.ensaio-head p { color: var(--muted); max-width: 60ch; margin: 0; font: 400 clamp(19px, 1.8vw, 23px)/1.5 var(--font-serif); }
.ensaio-grid { columns: 3 300px; column-gap: 12px; padding-bottom: 24px; }
.ensaio-grid button { display: block; width: 100%; margin: 0 0 12px; padding: 0; border: 0; background: none; cursor: zoom-in; break-inside: avoid; overflow: hidden; }
.ensaio-grid img { width: 100%; height: auto; display: block; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.ensaio-grid button:hover img { transform: scale(1.03); }
/* cinematicos */
.cine-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 18px; padding-block: 28px 20px; }
.cine { position: relative; display: flex; flex-direction: column; justify-content: space-between; aspect-ratio: 16 / 10; padding: 16px; text-decoration: none; color: #eaf2f0; overflow: hidden; background: radial-gradient(130% 120% at 100% 0%, color-mix(in srgb, var(--accent) 45%, #04201e) 0%, #071012 65%); }
.cine::before { content: ""; position: absolute; inset: 0; background-image: repeating-linear-gradient(0deg, rgba(255,255,255,.04) 0 1px, transparent 1px 4px); pointer-events: none; }
.cine .num { font: 400 clamp(56px, 7vw, 92px)/.9 var(--font-display); opacity: .9; position: relative; }
.cine .lab { position: relative; display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; font: 500 12px/1.3 var(--font-mono); text-transform: uppercase; letter-spacing: .05em; }
.cine .lab b { width: 46px; height: 46px; border-radius: 50%; background: #1fb5a8; display: grid; place-items: center; flex: none; transition: transform .3s; }
.cine .lab b::before { content: ""; border-left: 13px solid #04201e; border-top: 8px solid transparent; border-bottom: 8px solid transparent; margin-left: 4px; }
.cine:hover .lab b { transform: scale(1.12); }
.cine-note { color: var(--muted); padding-bottom: 96px; }


/* ---------- Raizes: identidade da Benthos ---------- */
:root[data-page="raizes"] { --bg: #F7F3E8; --surface: #FBFAF5; --text: #0F3B4C; --muted: #3F6775; --line: #E8E1CF; --accent: #0C798B; --on-accent: #FBFAF5; --mar-fundo: #071A22; --claro: #FBFAF5; }
:root[data-page="raizes"][data-palette="dark"] { --bg: #071A22; --surface: #0c2731; --text: #F7F3E8; --muted: #9CAEB1; --line: #1d3b45; --accent: #72ABB4; --on-accent: #071A22; --mar-fundo: #0F3B4C; }
#v-raizes { font-family: "Figtree", "Archivo", system-ui, sans-serif; }
#v-raizes .page-head h1 { font: 300 clamp(48px, 9vw, 132px)/.98 "Figtree", system-ui, sans-serif; text-transform: none; letter-spacing: -.02em; color: var(--text); }
:root[data-page="raizes"]:not([data-palette="dark"]) #v-raizes .page-head h1 { color: #175066; }
#v-raizes .page-head h1 em { font-style: italic; color: var(--accent); }
#v-raizes .rz-lead { font: 300 clamp(20px, 2vw, 26px)/1.45 "Figtree", system-ui, sans-serif; color: var(--muted); max-width: 40ch; margin: 18px 0 0; }
#v-raizes .page-head .crumb { font: 500 12px/1.4 "Figtree", system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
#v-raizes .synopsis p { font: 300 clamp(18px, 1.6vw, 21px)/1.6 "Figtree", system-ui, sans-serif; }
#v-raizes .eps-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
#v-raizes, #v-raizes * { font-family: "Figtree", system-ui, sans-serif; }
#v-raizes .eps-head h2, #v-raizes .louros-grid-band h2 { font: 500 12px/1.4 "Figtree", system-ui, sans-serif; letter-spacing: .1em; }
#v-raizes .eps-head .mono { color: var(--muted); }
#v-raizes .eps .t { font: 400 clamp(19px, 2vw, 24px)/1.25 "Figtree", system-ui, sans-serif; }
#v-raizes .eps .thumb .n { font: 300 clamp(26px, 3vw, 40px)/1 "Figtree", system-ui, sans-serif; }
#v-raizes .ficha dt, #v-raizes .ficha dd, #v-raizes .eps .pl, #v-raizes .eps .go { font-family: "Figtree", system-ui, sans-serif; }
#v-raizes .links a { border-radius: 999px; }
#v-raizes .rz-grid figcaption { font-family: "Figtree", system-ui, sans-serif; }

/* ---------- Blog: pagina de cada post ---------- */
.post-head { padding-top: calc(env(safe-area-inset-top, 0px) + 110px); max-width: 900px; }
.post-head h1 { font: 400 clamp(38px, 6vw, 84px)/.95 var(--font-display); text-transform: uppercase; margin: 16px 0 14px; overflow-wrap: anywhere; padding-top: .06em; }
.post-head .lead { margin: 0; color: var(--muted); font: italic 400 clamp(20px, 2vw, 25px)/1.45 var(--font-serif); }
.post-cover { margin: 28px 0 0; aspect-ratio: 16 / 9; }
.post-body { max-width: 68ch; margin: 40px auto 0; }
.post-body p { font: 400 clamp(19px, 1.7vw, 22px)/1.6 var(--font-serif); margin: 0 0 18px; }
.post-body blockquote { margin: 26px 0; padding: 0 0 0 20px; border-left: 3px solid var(--accent); font: italic 400 clamp(21px, 2vw, 26px)/1.45 var(--font-serif); }
.post-body .assina { font: 500 13px/1.4 var(--font-mono); color: var(--muted); }
.post-gal { columns: 3 260px; column-gap: 12px; margin: 36px 0 0; }
.post-gal button { display: block; width: 100%; margin: 0 0 12px; padding: 0; border: 0; background: none; cursor: zoom-in; break-inside: avoid; overflow: hidden; }
.post-gal img { width: 100%; height: auto; display: block; }
.post-links { display: flex; flex-wrap: wrap; gap: 10px; margin: 28px auto 0; max-width: 68ch; }
.post-links a { font: 500 13px/1 var(--font-ui); border: 1px solid var(--line); padding: 12px 14px; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.post-links a:hover { border-color: var(--accent); color: var(--accent); }
.post-links a.main { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.post-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; border-top: 1px solid var(--line); margin-top: 56px; padding-block: 28px 96px; }
.post-nav a { text-decoration: none; }
.post-nav small { font: 500 12px/1 var(--font-mono); color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.post-nav strong { display: block; font: 400 clamp(22px, 3vw, 34px)/1.05 var(--font-display); text-transform: uppercase; margin-top: 8px; }
.post-nav a:hover strong { color: var(--accent); }
.post-nav .nx { text-align: right; }
.bloglist a.blink { text-decoration: none; color: inherit; display: block; }
.bloglist a.blink:hover h2 { color: var(--accent); }

/* ---------- Sobre ---------- */
.sobre-hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; overflow: hidden; background: #071012; color: #f3f7f6; }
.sobre-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); }
.sobre-fade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(4,10,12,.55) 0%, rgba(4,10,12,.25) 35%, rgba(4,10,12,.7) 70%, var(--bg) 100%), linear-gradient(90deg, rgba(4,10,12,.7) 0%, rgba(4,10,12,.1) 65%); }
.sobre-hero-in { position: relative; z-index: 2; width: 100%; display: grid; grid-template-columns: 1fr; gap: 28px 56px; align-items: end; padding-top: calc(env(safe-area-inset-top, 0px) + 120px); padding-bottom: 72px; }
@media (min-width: 900px) { .sobre-hero-in { grid-template-columns: 7fr 4fr; } }
.sobre-hero-in > * { min-width: 0; }
.sobre-txt .crumb { font: 500 12px/1 var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: #9fe8df; }
.sobre-txt h1 { font: 400 clamp(54px, 10vw, 150px)/.86 var(--font-display); text-transform: uppercase; margin: 16px 0 18px; padding-top: .06em; text-shadow: 0 2px 30px rgba(0,0,0,.35); }
.sobre-lead { font: 400 clamp(20px, 2.1vw, 27px)/1.45 var(--font-serif); margin: 0; max-width: 34ch; }
.sobre-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.sobre-tags span { font: 500 12px/1 var(--font-mono); border: 1px solid rgba(243,247,246,.4); padding: 9px 11px; border-radius: 999px; background: rgba(4,10,12,.25); }
.retrato { margin: 0; position: relative; aspect-ratio: 4 / 5; max-width: 420px; width: 100%; justify-self: end; overflow: hidden; border-radius: 4px; box-shadow: 0 30px 80px rgba(0,0,0,.45); outline: 1px solid rgba(159,232,223,.35); outline-offset: 10px; background: #0b1618; }
.retrato video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.retrato figcaption { position: absolute; left: 12px; bottom: 12px; z-index: 2; background: rgba(4,10,12,.6); padding: 8px 10px; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; transition: opacity .3s; }
@media (max-width: 899px) { .retrato { justify-self: start; max-width: 360px; } }
.sobre-bio { padding-block: 40px 24px; }
.sobre-cols { display: grid; grid-template-columns: 1fr; gap: 0 48px; }
@media (min-width: 900px) { .sobre-cols { grid-template-columns: 1fr 1fr 1fr; } }
.sobre-cols p { font: 400 clamp(18px, 1.6vw, 21px)/1.6 var(--font-serif); margin: 0 0 18px; }
.sobre-quote { margin: 8px 0 32px; padding: 28px 0 0; border-top: 1px solid var(--line); font: italic 400 clamp(22px, 2.6vw, 34px)/1.3 var(--font-serif); max-width: none; color: var(--text); }
.sobre-quote::before { content: "“"; color: var(--accent); }
.sobre-quote::after { content: "”"; color: var(--accent); }
.sobre-fotos { display: grid; grid-template-columns: 2fr 1.4fr 1fr; gap: 12px; margin-top: 12px; }
@media (max-width: 700px) { .sobre-fotos { grid-template-columns: 1fr 1fr; } .sobre-fotos button:first-child { grid-column: 1 / -1; } }
.sobre-fotos button { padding: 0; border: 0; background: none; cursor: zoom-in; overflow: hidden; aspect-ratio: 4 / 5; position: relative; }
.sobre-fotos button:first-child { aspect-ratio: auto; min-height: 320px; }
.sobre-fotos img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.2,.7,.2,1); }
.sobre-fotos button:hover img { transform: scale(1.04); }
.sobre-num { border-block: 1px solid var(--line); margin-top: 48px; }
.sobre-num .wrap { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; }
@media (min-width: 900px) { .sobre-num .wrap { grid-template-columns: repeat(4, 1fr); } }
.sobre-num div { padding: 28px 16px 28px 0; }
.sobre-num b { display: block; font: 400 clamp(46px, 6vw, 84px)/.9 var(--font-display); color: var(--accent); }
.sobre-num span { display: block; color: var(--muted); margin-top: 8px; font-size: 15px; max-width: 22ch; }
.sobre-faz { padding-block: 64px 24px; }
.sobre-faz h2, .sobre-dois h2 { color: var(--accent); letter-spacing: .1em; text-transform: uppercase; font-size: 12px; margin: 0 0 20px; }
.faz-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; }
.faz-grid article { border: 1px solid var(--line); padding: 22px 20px 24px; background: var(--surface); }
.faz-grid h3 { font: 400 26px/1 var(--font-display); text-transform: uppercase; margin: 0 0 10px; }
.faz-grid p { margin: 0; color: var(--muted); }
.sobre-dois { display: grid; grid-template-columns: 1fr; gap: 48px 64px; padding-block: 48px 40px; }
@media (min-width: 900px) { .sobre-dois { grid-template-columns: 1fr 1fr; } }
.sobre-dois > * { min-width: 0; }
.sobre-dois.solo { grid-template-columns: 1fr; }
.sobre-dois [hidden] { display: none; }
@media (min-width: 900px) { .sobre-dois.solo .sobre-pesquisa { display: grid; grid-template-columns: 1fr 1fr; gap: 0 64px; align-items: start; } .sobre-dois.solo .sobre-pesquisa h2 { grid-column: 1 / -1; } }
.sobre-carreira { padding-bottom: 8px; }
.tese { font: italic 400 clamp(22px, 2.4vw, 30px)/1.3 var(--font-serif); margin: 0 0 22px; }
.linha { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--line); }
.linha li { position: relative; padding: 0 0 22px 22px; }
.linha li::before { content: ""; position: absolute; left: -7px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--bg); border: 2px solid var(--accent); }
.linha b { display: block; font: 500 12px/1.4 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--accent); }
.linha span { display: block; margin-top: 4px; }
.sobre-bast { padding-block: 40px 80px; }
.reels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
@media (max-width: 700px) { .reels { grid-template-columns: repeat(3, 70%); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; } .reels figure { scroll-snap-align: start; } }
.reels figure { margin: 0; position: relative; aspect-ratio: 9 / 16; overflow: hidden; background: #0b1618; }
.reels video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.reels figcaption { position: absolute; left: 12px; bottom: 12px; right: 12px; font: 400 20px/1.05 var(--font-display); text-transform: uppercase; color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.6); }

/* ---------- Cinematicos com imagem ---------- */
.cine { background: #0b1618; justify-content: flex-end; }
.cine img, .cine video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.cine video { opacity: 0; transition: opacity .6s; }
.cine.playing video { opacity: 1; }
.cine:hover img { transform: scale(1.04); }
.cine::before { z-index: 1; background: linear-gradient(180deg, transparent 45%, rgba(0,0,0,.65)); }
.cine .lab { z-index: 2; }
.cine .lab strong { display: block; font: 400 clamp(24px, 2.6vw, 34px)/1 var(--font-display); text-transform: uppercase; letter-spacing: .01em; }
.cine .lab em { display: block; font: 400 13px/1.3 var(--font-ui); font-style: normal; text-transform: none; letter-spacing: 0; opacity: .85; margin-top: 6px; }
@media (min-width: 900px) { .cine.first { grid-column: span 2; } }

/* ---------- Ultima noticia flutuante ---------- */
.flash-link { display: grid; grid-template-columns: 92px minmax(0, 1fr); text-decoration: none; color: inherit; min-height: 84px; }
.flash-link:hover b { color: var(--accent); }
.flash { position: fixed; z-index: 45; left: max(14px, env(safe-area-inset-left, 0px)); bottom: max(14px, env(safe-area-inset-bottom, 0px)); width: min(340px, calc(100% - 28px)); background: color-mix(in srgb, var(--surface) 94%, transparent); color: var(--text); border: 1px solid var(--line); box-shadow: 0 14px 40px rgba(0,0,0,.28); backdrop-filter: blur(10px); text-decoration: none; transform: translateY(140%); transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.flash.show { transform: none; }
.flash .ph { position: relative; overflow: hidden; }
.flash .ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.flash .tx { padding: 12px 40px 12px 14px; min-width: 0; }
.flash small { display: flex; gap: 8px; align-items: center; font: 500 11px/1.2 var(--font-mono); color: var(--accent); text-transform: uppercase; letter-spacing: .06em; }
.flash small i { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); animation: rec 1.6s infinite; }
.flash b { display: block; font: 600 15px/1.25 var(--font-ui); margin: 6px 0 4px; }
.flash .ex { font-size: 13px; line-height: 1.4; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.flash b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.flash .close { position: absolute; top: 4px; right: 4px; width: 36px; height: 36px; border: 0; background: none; color: var(--muted); font-size: 20px; cursor: pointer; }
.flash .close:hover { color: var(--text); }
@media (max-width: 520px) { .flash { width: min(300px, calc(100% - 28px)); } .flash-link { grid-template-columns: 72px minmax(0, 1fr); min-height: 72px; } .flash .ex { display: none; } .flash b { font-size: 14px; } }

.rv { transform: none; transition: transform 1s cubic-bezier(.2,.7,.2,1); }
.rv.pre { transform: translateY(36px); }
@media (prefers-reduced-motion: reduce) {
  .parc .track, .louros-band .track, .belt, .kb img, .hud .dot, .play::after, .grain, .ls-spin, .ls-pulse, .ls-spin.ls-pulse-s, .tools a.wa::before, .hero video.on, .flash small i { animation: none; }
  .rv.pre { transform: none; }
  .flash { transition: none; }
}

/* ---------- Acréscimos do site final (páginas separadas, players, idioma) ---------- */
.skip { position: absolute; left: 12px; top: -80px; z-index: 100; background: var(--accent); color: var(--on-accent); padding: 12px 18px; border-radius: 4px; font: 600 14px/1 var(--font-ui); text-decoration: none; }
.skip:focus { top: 12px; }
.menu .lang a { display: inline-block; color: inherit; padding: 12px 6px; text-decoration: underline; text-underline-offset: 3px; }
.menu .lang b { display: inline-block; padding: 12px 6px; font-weight: 600; }
.scene.player.embed iframe, .cine.embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.cine.embed { position: relative; }